Commit ae2e546b2ea62cae5eb360648ce79c405c17915d

Authored by sqy
1 parent 39d018f8

'修改首页样式部分,修改部分图表,fix:修复token过期没有权限问题'

... ... @@ -12,7 +12,7 @@ export default {
12 12 networkExceptionMsg:
13 13 'Please check if your network connection is normal! The network is abnormal',
14 14
15   - errMsg401: 'no permission',
  15 + errMsg401: '',
16 16 errMsg403: 'not authorized',
17 17 errMsg404: 'the resource was not found!',
18 18 errMsg405: 'Network request error, request method not allowed!',
... ...
... ... @@ -10,8 +10,7 @@ export default {
10 10 apiRequestFailed: '请求出错,请稍候重试',
11 11 networkException: '网络异常',
12 12 networkExceptionMsg: '网络异常,请检查您的网络连接是否正常!',
13   -
14   - errMsg401: '没有权限!',
  13 + errMsg401: '',
15 14 errMsg403: '未授权',
16 15 errMsg404: '未找到该资源!',
17 16 errMsg405: '网络请求错误,请求方法未允许!',
... ...
... ... @@ -10,7 +10,6 @@ import { SessionTimeoutProcessingEnum } from '/@/enums/appEnum';
10 10 const { createMessage, createErrorModal } = useMessage();
11 11 const error = createMessage.error!;
12 12 const stp = projectSetting.sessionTimeoutProcessing;
13   -
14 13 export function checkStatus(
15 14 status: number,
16 15 msg: string,
... ... @@ -19,7 +18,6 @@ export function checkStatus(
19 18 const { t } = useI18n();
20 19 const userStore = useUserStoreWithOut();
21 20 let errMessage = '';
22   -
23 21 switch (status) {
24 22 case 400:
25 23 errMessage = `${msg}`;
... ...
... ... @@ -121,7 +121,6 @@ const transform: AxiosTransform = {
121 121 const msg: string = response?.data?.msg ?? '';
122 122 const err: string = error?.toString?.() ?? '';
123 123 let errMessage = '';
124   -
125 124 try {
126 125 console.log(response.data);
127 126 if (response.data.status == '401' || response.data.message == '"Authentication failed"') {
... ...
... ... @@ -41,11 +41,7 @@
41 41 src="/src/assets/images/alarm-count.png"
42 42 style="width: 5rem; height: 5rem"
43 43 />
44   - <img
45   - v-if="isAdmin(role)"
46   - src="/src/assets/images/zh.png"
47   - style="width: 5rem; height: 5rem"
48   - />
  44 + <img v-else src="/src/assets/images/zh.png" style="width: 5rem; height: 5rem" />
49 45 </div>
50 46 <div class="flex-auto">
51 47 <div class="flex justify-between" style="align-items: center">
... ... @@ -54,7 +50,7 @@
54 50 }}</div>
55 51 <img src="/src/assets/images/tip.png" style="width: 1.4rem; height: 1.4rem" />
56 52 </div>
57   - <div> {{ !isAdmin(role) ? '11月告警数(条)' : '租户总量(个)' }}</div>
  53 + <div> {{ !isAdmin(role) ? `${currentMonth}月告警数(条)` : '租户总量(个)' }}</div>
58 54 </div>
59 55 </div>
60 56 <div class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5">
... ... @@ -68,30 +64,34 @@
68 64 v-if="!isAdmin(role)"
69 65 src="/src/assets/images/msg-count.png"
70 66 style="width: 5rem; height: 5rem"
71   - /><img
72   - v-if="isAdmin(role)"
73   - src="/src/assets/images/kf.png"
74   - style="width: 5rem; height: 5rem"
75   - />
  67 + /><img v-else src="/src/assets/images/kf.png" style="width: 5rem; height: 5rem" />
76 68 </div>
77   - <div class="flex-auto">
78   - <div class="flex justify-between" style="align-items: center">
79   - <div style="font-size: 1.625rem; color: #333">{{
80   - growCardList?.customerInfo?.sumCount
81   - }}</div>
82   - <img src="/src/assets/images/tip.png" style="width: 1.4rem; height: 1.4rem" />
  69 + <div style="display: flex; align-items: center">
  70 + <div v-if="!isAdmin(role)">
  71 + <div>
  72 + {{ `${currentMonth}月数据点(条)` }}
  73 + <span>{{ growCardList?.messageInfo?.dataPointsCount }}</span>
  74 + </div>
  75 + <div>
  76 + {{ `${currentMonth}月消息量(条)` }}
  77 + <span>{{ growCardList?.messageInfo?.messageCount }}</span>
  78 + </div>
83 79 </div>
84   - <div> {{ !isAdmin(role) ? '11月消息量(条)' : '客户总量(个)' }} </div>
  80 + <div v-else>客户总量(个)</div>
85 81 </div>
86 82 </div>
87 83 <div class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5">
88   - 今日新增 {{ growCardList?.customerInfo?.todayAdd }}</div
89   - >
  84 + <div>
  85 + 今日新增
  86 + <span class="ml-8">数据点 ({{ growCardList?.messageInfo?.todayDataPointsAdd }})</span>
  87 + <span class="ml-8">消息量 ({{ growCardList?.messageInfo?.todayMessageAdd }})</span>
  88 + </div>
  89 + </div>
90 90 </Card>
91 91 </div>
92 92 </template>
93 93 <script lang="ts" setup>
94   - import { ref, onMounted } from 'vue';
  94 + import { ref, onMounted, computed } from 'vue';
95 95 import { Card } from 'ant-design-vue';
96 96 import { getHomeData } from '/@/api/dashboard';
97 97 import { isAdmin } from '/@/enums/roleEnum';
... ... @@ -109,12 +109,26 @@
109 109 inActive: number;
110 110 todayAdd: number;
111 111 };
112   - tenantInfo: { sumCount: number; todayAdd: number };
113   - customerInfo: { sumCount: number; todayAdd: number };
  112 + tenantInfo?: { sumCount: number; todayAdd: number };
  113 + customerInfo?: { sumCount: number; todayAdd: number };
  114 + alarmInfo?: {
  115 + sumCount: number;
  116 + todayAdd: number;
  117 + };
  118 + messageInfo?: {
  119 + dataPointsCount: number;
  120 + messageCount: number;
  121 + todayDataPointsAdd: number;
  122 + todayMessageAdd: number;
  123 + };
114 124 }
115 125 const growCardList = ref<CardList>();
116 126 onMounted(async () => {
117 127 const res = await getHomeData();
118 128 growCardList.value = res;
119 129 });
  130 + // 获取当前月份0-11 +1
  131 + const currentMonth = computed(() => {
  132 + return new Date().getMonth() + 1;
  133 + });
120 134 </script>
... ...
... ... @@ -19,12 +19,10 @@
19 19 </div>
20 20 </template>
21 21 <div v-show="activeKey === '1'">
22   - <p class="center">告警数</p>
23 22 <!-- 折线图 -->
24 23 <VisitAnalysis :alarmList="state.alarmList" />
25 24 </div>
26 25 <div v-show="activeKey === '2'">
27   - <p class="center">消息量</p>
28 26 <!-- 柱形图 -->
29 27 <VisitAnalysisBar :dataPointList="state.dataPointList" :messageList="state.messageList" />
30 28 </div>
... ... @@ -170,7 +168,7 @@
170 168 for (const item of createdAlarmsCountHourly) {
171 169 newArray.push([item.ts, item.value]);
172 170 }
173   - state.alarmList = [[...state.alarmItem], ...newArray];
  171 + state.alarmList = newArray;
174 172 }
175 173 } else {
176 174 if (data) {
... ... @@ -200,8 +198,8 @@
200 198 for (const item of transportMsgCountHourly) {
201 199 newArray1.push([item.ts, item.value]);
202 200 }
203   - state.dataPointList = [[...state.dataPoint], ...newArray];
204   - state.messageList = [[...state.MsgCount], ...newArray1];
  201 + state.dataPointList = newArray;
  202 + state.messageList = newArray1;
205 203 }
206 204 }
207 205 },
... ... @@ -316,7 +314,7 @@
316 314 if (activeIndex.value === index) return;
317 315 activeIndex.value = index;
318 316 dateValue.value = '';
319   - let interval = 3600000;
  317 + let interval = 300000;
320 318 if (value === 86400000) {
321 319 interval = 7200000;
322 320 } else if (value === 604800000 || value === 2592000000) {
... ... @@ -342,11 +340,11 @@
342 340 });
343 341 send(sendValue);
344 342
345   - console.log(JSON.parse(sendValue), '----interval');
  343 + console.log(JSON.parse(sendValue), '----interval', state.alarmList);
346 344 }
347 345 </script>
348 346
349   -<style scoped lang="less">
  347 +<style lang="less">
350 348 .center {
351 349 display: flex;
352 350 justify-content: center;
... ...
1 1 <template>
2   - <div ref="chartRef" :style="{ height, width }"></div>
  2 + <div>
  3 + <p class="center">告警数</p>
  4 + <div ref="chartRef" :style="{ height, width }" v-show="alarmList.length"></div>
  5 + <div v-show="!alarmList.length">暂无数据</div>
  6 + </div>
3 7 </template>
4 8 <script lang="ts" setup>
5 9 import { onMounted, ref, Ref, withDefaults, watch } from 'vue';
... ...
1 1 <template>
2   - <div ref="chartRef" :style="{ height, width }"></div>
  2 + <div>
  3 + <p class="center">消息量</p>
  4 + <div ref="chartRef" :style="{ height, width }" v-show="dataPointList.length"></div>
  5 + <div v-show="!dataPointList.length">暂无数据</div>
  6 + </div>
3 7 </template>
4 8 <script lang="ts" setup>
5 9 import { ref, Ref, watch, withDefaults } from 'vue';
... ... @@ -22,6 +26,15 @@
22 26 watch(
23 27 () => [props.dataPointList, props.messageList],
24 28 ([newValue, newValue1]) => {
  29 + // 计算总量
  30 + let dataPointTotal = 0;
  31 + let messageTotal = 0;
  32 + for (const item of newValue) {
  33 + dataPointTotal += Number(item[1]);
  34 + }
  35 + for (const item of newValue1) {
  36 + messageTotal += Number(item[1]);
  37 + }
25 38 setOptions({
26 39 tooltip: {
27 40 trigger: 'axis',
... ... @@ -34,8 +47,13 @@
34 47 },
35 48 legend: {
36 49 data: ['传输数据点', '传输消息量'],
37   - left: '10%',
  50 + left: '5%',
  51 + orient: 'vertical',
  52 + formatter: (name) => {
  53 + return name === '传输数据点' ? `${name} ${dataPointTotal}` : `${name} ${messageTotal}`;
  54 + },
38 55 },
  56 +
39 57 yAxis: {},
40 58 grid: {
41 59 left: '3%',
... ... @@ -45,18 +63,18 @@
45 63 },
46 64 series: [
47 65 {
48   - name: '传输消息量',
  66 + name: '传输数据点',
49 67 type: 'bar',
50 68 stack: 'total',
51   - data: newValue1,
52   - color: '#5c7bd9',
  69 + data: newValue,
  70 + color: '#9fe080',
53 71 },
54 72 {
55   - name: '传输数据点',
  73 + name: '传输消息量',
56 74 type: 'bar',
57 75 stack: 'total',
58   - data: newValue,
59   - color: '#9fe080',
  76 + data: newValue1,
  77 + color: '#5c7bd9',
60 78 },
61 79 ],
62 80 });
... ...