Showing
7 changed files
with
147 additions
and
93 deletions
@@ -79,6 +79,7 @@ interface TrendParamsType { | @@ -79,6 +79,7 @@ interface TrendParamsType { | ||
79 | | 'CUSTOMER_TREND' | 79 | | 'CUSTOMER_TREND' |
80 | | 'TENANT_TREND' | 80 | | 'TENANT_TREND' |
81 | | 'CUSTOMER_MESSAGE_STATISTICAL' | 81 | | 'CUSTOMER_MESSAGE_STATISTICAL' |
82 | + | 'CUSTOMER_ALARM_STATISTICAL' | ||
82 | | 'CUSTOMER_MESSAGE_STATISTICAL'; | 83 | | 'CUSTOMER_MESSAGE_STATISTICAL'; |
83 | } | 84 | } |
84 | // 获取租户趋势或者客户趋势数据 | 85 | // 获取租户趋势或者客户趋势数据 |
@@ -58,10 +58,10 @@ | @@ -58,10 +58,10 @@ | ||
58 | <div> {{ !isAdmin(role) ? `产品数` : '产品数' }}</div> | 58 | <div> {{ !isAdmin(role) ? `产品数` : '产品数' }}</div> |
59 | </div> | 59 | </div> |
60 | </div> | 60 | </div> |
61 | - <div v-if="!isAdmin(role)" class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | 61 | + <div v-if="!isAdmin(role)" class="pt-4" style="border-top: 2px solid #f0f2f5"> |
62 | 今日新增 {{ toThousands(growCardList?.productInfo?.todayAdd) }}</div | 62 | 今日新增 {{ toThousands(growCardList?.productInfo?.todayAdd) }}</div |
63 | > | 63 | > |
64 | - <div v-else class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | 64 | + <div v-else class="pt-4" style="border-top: 2px solid #f0f2f5"> |
65 | 今日新增 {{ toThousands(growCardList?.productInfo?.todayAdd) }}</div | 65 | 今日新增 {{ toThousands(growCardList?.productInfo?.todayAdd) }}</div |
66 | > | 66 | > |
67 | </Card> | 67 | </Card> |
@@ -92,7 +92,7 @@ | @@ -92,7 +92,7 @@ | ||
92 | <div> 设备数 </div> | 92 | <div> 设备数 </div> |
93 | </div> | 93 | </div> |
94 | </div> | 94 | </div> |
95 | - <div class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | 95 | + <div class="pt-4" style="border-top: 2px solid #f0f2f5"> |
96 | 今日新增 {{ toThousands(growCardList?.deviceInfo?.todayAdd) }} | 96 | 今日新增 {{ toThousands(growCardList?.deviceInfo?.todayAdd) }} |
97 | </div> | 97 | </div> |
98 | </Card> | 98 | </Card> |
@@ -143,10 +143,10 @@ | @@ -143,10 +143,10 @@ | ||
143 | <div> {{ !isAdmin(role) ? `告警数` : '租户总量' }}</div> | 143 | <div> {{ !isAdmin(role) ? `告警数` : '租户总量' }}</div> |
144 | </div> | 144 | </div> |
145 | </div> | 145 | </div> |
146 | - <div v-if="!isAdmin(role)" class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | 146 | + <div v-if="!isAdmin(role)" class="pt-4" style="border-top: 2px solid #f0f2f5"> |
147 | 今日新增 {{ toThousands(growCardList?.alarmInfo?.todayAdd) }}</div | 147 | 今日新增 {{ toThousands(growCardList?.alarmInfo?.todayAdd) }}</div |
148 | > | 148 | > |
149 | - <div v-else class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | 149 | + <div v-else class="pt-4" style="border-top: 2px solid #f0f2f5"> |
150 | 今日新增 {{ toThousands(growCardList?.tenantInfo?.todayAdd) }}</div | 150 | 今日新增 {{ toThousands(growCardList?.tenantInfo?.todayAdd) }}</div |
151 | > | 151 | > |
152 | </Card> | 152 | </Card> |
@@ -167,8 +167,8 @@ | @@ -167,8 +167,8 @@ | ||
167 | style="font-size: 1.625rem; color: #333; font-weight: bold" | 167 | style="font-size: 1.625rem; color: #333; font-weight: bold" |
168 | > | 168 | > |
169 | <CountTo | 169 | <CountTo |
170 | - v-if="growCardList?.messageInfo?.todayMessageAdd" | ||
171 | - :end-val="growCardList.messageInfo.todayMessageAdd" | 170 | + v-if="growCardList?.messageInfo?.messageCount" |
171 | + :end-val="growCardList.messageInfo.messageCount" | ||
172 | /> | 172 | /> |
173 | <CountTo v-else :end-val="0" /> | 173 | <CountTo v-else :end-val="0" /> |
174 | </div> | 174 | </div> |
@@ -185,7 +185,44 @@ | @@ -185,7 +185,44 @@ | ||
185 | !isAdmin(role) | 185 | !isAdmin(role) |
186 | ? `今日消息数:${ | 186 | ? `今日消息数:${ |
187 | growCardList?.messageInfo?.todayMessageAdd | 187 | growCardList?.messageInfo?.todayMessageAdd |
188 | - } 近30日新增 ${toThousands(growCardList?.messageInfo?.messageCount)}` | 188 | + } 今日消息点数 ${toThousands( |
189 | + growCardList?.messageInfo?.todayDataPointsAdd | ||
190 | + )}` | ||
191 | + : `客户总量:${growCardList?.customerInfo?.sumCount} 今日新增 ${toThousands( | ||
192 | + growCardList?.customerInfo?.todayAdd | ||
193 | + )}` | ||
194 | + }} | ||
195 | + </template> | ||
196 | + <img | ||
197 | + v-if="isAdmin(role)" | ||
198 | + src="/src/assets/images/tip.png" | ||
199 | + style="width: 1.125rem; height: 1.125rem" | ||
200 | + /> | ||
201 | + </Tooltip> | ||
202 | + </div> | ||
203 | + <div> {{ !isAdmin(role) ? `消息数` : '客户总量' }}</div> | ||
204 | + </div> | ||
205 | + <div class="flex-auto" v-if="!isAdmin(role)"> | ||
206 | + <div class="flex justify-between" style="align-items: center"> | ||
207 | + <div | ||
208 | + v-if="!isAdmin(role)" | ||
209 | + style="font-size: 1.625rem; color: #333; font-weight: bold" | ||
210 | + > | ||
211 | + <CountTo | ||
212 | + v-if="growCardList?.messageInfo?.dataPointsCount" | ||
213 | + :end-val="growCardList.messageInfo.dataPointsCount" | ||
214 | + /> | ||
215 | + <CountTo v-else :end-val="0" /> | ||
216 | + </div> | ||
217 | + <Tooltip> | ||
218 | + <template #title> | ||
219 | + {{ | ||
220 | + !isAdmin(role) | ||
221 | + ? `今日消息数:${ | ||
222 | + growCardList?.messageInfo?.todayMessageAdd | ||
223 | + } 今日消息点数 ${toThousands( | ||
224 | + growCardList?.messageInfo?.todayDataPointsAdd | ||
225 | + )}` | ||
189 | : `客户总量:${growCardList?.customerInfo?.sumCount} 今日新增 ${toThousands( | 226 | : `客户总量:${growCardList?.customerInfo?.sumCount} 今日新增 ${toThousands( |
190 | growCardList?.customerInfo?.todayAdd | 227 | growCardList?.customerInfo?.todayAdd |
191 | )}` | 228 | )}` |
@@ -194,15 +231,20 @@ | @@ -194,15 +231,20 @@ | ||
194 | <img src="/src/assets/images/tip.png" style="width: 1.125rem; height: 1.125rem" /> | 231 | <img src="/src/assets/images/tip.png" style="width: 1.125rem; height: 1.125rem" /> |
195 | </Tooltip> | 232 | </Tooltip> |
196 | </div> | 233 | </div> |
197 | - <div> {{ !isAdmin(role) ? `今日消息数` : '客户总量' }}</div> | 234 | + <div> {{ !isAdmin(role) ? `消息点数` : '' }}</div> |
198 | </div> | 235 | </div> |
199 | </div> | 236 | </div> |
200 | - <div v-if="!isAdmin(role)" class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | ||
201 | - 近30日新增 {{ toThousands(growCardList?.messageInfo?.messageCount) }}</div | ||
202 | - > | ||
203 | - <div v-else class="ml-2 pt-4" style="border-top: 2px solid #f0f2f5"> | ||
204 | - 近30日新增 {{ toThousands(growCardList?.customerInfo?.todayAdd) }}</div | ||
205 | - > | 237 | + <div class="flex justify-between" style="border-top: 2px solid #f0f2f5"> |
238 | + <div v-if="!isAdmin(role)" class="pt-4"> | ||
239 | + 今日消息数 {{ toThousands(growCardList?.messageInfo?.todayMessageAdd) }}</div | ||
240 | + > | ||
241 | + <div v-if="!isAdmin(role)" class="pt-4"> | ||
242 | + 今日消息点数 {{ toThousands(growCardList?.messageInfo?.todayDataPointsAdd) }}</div | ||
243 | + > | ||
244 | + <div v-else class="pt-4"> | ||
245 | + 近30日新增 {{ toThousands(growCardList?.customerInfo?.todayAdd) }}</div | ||
246 | + > | ||
247 | + </div> | ||
206 | </Card> | 248 | </Card> |
207 | </div> | 249 | </div> |
208 | <!-- 首页饼图 --> | 250 | <!-- 首页饼图 --> |
@@ -10,15 +10,15 @@ | @@ -10,15 +10,15 @@ | ||
10 | <div class="extra-date"> | 10 | <div class="extra-date"> |
11 | <template v-for="(item, index) in dateList" :key="item.value"> | 11 | <template v-for="(item, index) in dateList" :key="item.value"> |
12 | <span | 12 | <span |
13 | - @click="quickQueryDate(index, item.value, role === 'CUSTOMER_USER' && 'customer')" | 13 | + @click=" |
14 | + quickQueryDate(index, item.value, role === RoleEnum.CUSTOMER_USER, item.interval) | ||
15 | + " | ||
14 | :class="{ active: index === activeIndex }" | 16 | :class="{ active: index === activeIndex }" |
15 | >{{ item.label }}</span | 17 | >{{ item.label }}</span |
16 | > | 18 | > |
17 | </template> | 19 | </template> |
18 | <DatePicker | 20 | <DatePicker |
19 | - @change=" | ||
20 | - (_, DateString) => onDateChange(_, DateString, role === 'CUSTOMER_USER' && 'customer') | ||
21 | - " | 21 | + @change="(_, DateString) => onDateChange(_, DateString, role === RoleEnum.CUSTOMER_USER)" |
22 | v-model:value="dateValue" | 22 | v-model:value="dateValue" |
23 | /> | 23 | /> |
24 | </div> | 24 | </div> |
@@ -102,7 +102,7 @@ | @@ -102,7 +102,7 @@ | ||
102 | import { Card, DatePicker } from 'ant-design-vue'; | 102 | import { Card, DatePicker } from 'ant-design-vue'; |
103 | import VisitAnalysis from './VisitAnalysis.vue'; | 103 | import VisitAnalysis from './VisitAnalysis.vue'; |
104 | import VisitAnalysisBar from './VisitAnalysisBar.vue'; | 104 | import VisitAnalysisBar from './VisitAnalysisBar.vue'; |
105 | - import { isAdmin } from '/@/enums/roleEnum'; | 105 | + import { RoleEnum, isAdmin } from '/@/enums/roleEnum'; |
106 | import { useWebSocket } from '@vueuse/core'; | 106 | import { useWebSocket } from '@vueuse/core'; |
107 | import { getAuthCache } from '/@/utils/auth'; | 107 | import { getAuthCache } from '/@/utils/auth'; |
108 | import { JWT_TOKEN_KEY } from '/@/enums/cacheEnum'; | 108 | import { JWT_TOKEN_KEY } from '/@/enums/cacheEnum'; |
@@ -137,10 +137,10 @@ | @@ -137,10 +137,10 @@ | ||
137 | const activeIndex = ref(3); | 137 | const activeIndex = ref(3); |
138 | const dateValue = ref(); | 138 | const dateValue = ref(); |
139 | const dateList = ref([ | 139 | const dateList = ref([ |
140 | - { label: '1小时', value: 3600000 }, | ||
141 | - { label: '1天', value: 86400000 }, | ||
142 | - { label: '7天', value: 604800000 }, | ||
143 | - { label: '30天', value: 2592000000 }, | 140 | + { label: '1小时', value: 1000 * 60 * 60, interval: 1000 * 60 * 5 }, |
141 | + { label: '1天', value: 1000 * 60 * 60 * 24, interval: 1000 * 60 * 30 }, | ||
142 | + { label: '7天', value: 1000 * 60 * 60 * 24 * 7, interval: 1000 * 60 * 60 * 2 }, | ||
143 | + { label: '30天', value: 1000 * 60 * 60 * 24 * 30, interval: 1000 * 60 * 60 * 24 }, | ||
144 | ]); | 144 | ]); |
145 | 145 | ||
146 | // web Socket | 146 | // web Socket |
@@ -354,17 +354,16 @@ | @@ -354,17 +354,16 @@ | ||
354 | send(sendValue); | 354 | send(sendValue); |
355 | } | 355 | } |
356 | // 选择日期 | 356 | // 选择日期 |
357 | - async function onDateChange(_, dateString, roleType = '') { | ||
358 | - console.log(_, dateString, roleType); | 357 | + async function onDateChange(_, dateString, isCustomer: boolean) { |
359 | activeIndex.value = -1; | 358 | activeIndex.value = -1; |
360 | const dateTime = Number(formatToDateTime(dateString, 'x')); | 359 | const dateTime = Number(formatToDateTime(dateString, 'x')); |
361 | if (!dateString) return; | 360 | if (!dateString) return; |
362 | - if (roleType === 'customer') { | 361 | + if (isCustomer) { |
363 | if (activeKey.value === '1') { | 362 | if (activeKey.value === '1') { |
364 | const data = await getTrendData({ | 363 | const data = await getTrendData({ |
365 | startTs: dateTime, | 364 | startTs: dateTime, |
366 | endTs: dateTime + 86400000, | 365 | endTs: dateTime + 86400000, |
367 | - interval: 7200000, | 366 | + interval: 1000 * 60 * 30, |
368 | trend: 'CUSTOMER_ALARM_STATISTICAL', | 367 | trend: 'CUSTOMER_ALARM_STATISTICAL', |
369 | }); | 368 | }); |
370 | customerAlarmList.value = data; | 369 | customerAlarmList.value = data; |
@@ -372,7 +371,7 @@ | @@ -372,7 +371,7 @@ | ||
372 | const data = await getTrendData({ | 371 | const data = await getTrendData({ |
373 | startTs: dateTime, | 372 | startTs: dateTime, |
374 | endTs: dateTime + 86400000, | 373 | endTs: dateTime + 86400000, |
375 | - interval: 7200000, | 374 | + interval: 1000 * 60 * 30, |
376 | trend: 'CUSTOMER_MESSAGE_STATISTICAL', | 375 | trend: 'CUSTOMER_MESSAGE_STATISTICAL', |
377 | }); | 376 | }); |
378 | customerMessageList.value = data; | 377 | customerMessageList.value = data; |
@@ -390,7 +389,7 @@ | @@ -390,7 +389,7 @@ | ||
390 | : ['transportMsgCountHourly', 'transportDataPointsCountHourly'], | 389 | : ['transportMsgCountHourly', 'transportDataPointsCountHourly'], |
391 | startTs: dateTime, | 390 | startTs: dateTime, |
392 | endTs: dateTime + 86400000, | 391 | endTs: dateTime + 86400000, |
393 | - interval: 7200000, | 392 | + interval: 1000 * 60 * 30, |
394 | limit: 12, | 393 | limit: 12, |
395 | agg: 'SUM', | 394 | agg: 'SUM', |
396 | }, | 395 | }, |
@@ -403,17 +402,16 @@ | @@ -403,17 +402,16 @@ | ||
403 | const customerAlarmList = ref([]); | 402 | const customerAlarmList = ref([]); |
404 | const customerMessageList = ref([]); | 403 | const customerMessageList = ref([]); |
405 | // 快速选择时间 | 404 | // 快速选择时间 |
406 | - async function quickQueryDate(index: number, value: number, roleType = '') { | 405 | + async function quickQueryDate( |
406 | + index: number, | ||
407 | + value: number, | ||
408 | + isCustomer: boolean, | ||
409 | + interval: number | ||
410 | + ) { | ||
407 | if (activeIndex.value === index) return; | 411 | if (activeIndex.value === index) return; |
408 | activeIndex.value = index; | 412 | activeIndex.value = index; |
409 | dateValue.value = ''; | 413 | dateValue.value = ''; |
410 | - let interval = 300000; | ||
411 | - if (value === 86400000) { | ||
412 | - interval = 7200000; | ||
413 | - } else if (value === 604800000 || value === 2592000000) { | ||
414 | - interval = 86400000; | ||
415 | - } | ||
416 | - if (roleType === 'customer') { | 414 | + if (isCustomer) { |
417 | if (activeKey.value === '1') { | 415 | if (activeKey.value === '1') { |
418 | const data = await getTrendData({ | 416 | const data = await getTrendData({ |
419 | startTs: Date.now() - value, | 417 | startTs: Date.now() - value, |
@@ -6,19 +6,45 @@ | @@ -6,19 +6,45 @@ | ||
6 | @tabChange="onTabChange" | 6 | @tabChange="onTabChange" |
7 | v-if="!isAdmin(role)" | 7 | v-if="!isAdmin(role)" |
8 | > | 8 | > |
9 | + <template #messageStatistics> | ||
10 | + <span>消息量统计</span> | ||
11 | + <Tooltip> | ||
12 | + <template #title> | ||
13 | + <div>传输消息量: 即设备上报的消息数量,设备每上报一次数据量+1.</div> | ||
14 | + <div class="mt-1"> | ||
15 | + 传输数据点: | ||
16 | + 即设备每次上报的消息所包含的数据点,例如一条直连设备消息包含以下内容:{"ph":7,"humidity":65},则此消息有两个数据点. | ||
17 | + </div> | ||
18 | + </template> | ||
19 | + <QuestionCircleOutlined class="ml-2" /> | ||
20 | + </Tooltip> | ||
21 | + </template> | ||
9 | <template #tabBarExtraContent> | 22 | <template #tabBarExtraContent> |
10 | <div class="extra-date"> | 23 | <div class="extra-date"> |
24 | + <Tooltip> | ||
25 | + <template #title> | ||
26 | + <div> 30天: 查询最近30天的数据,间隔时间为1天.</div> | ||
27 | + <div>7天: 查询最近7天的数据,间隔时间为2小时.</div> | ||
28 | + <div>1天: 查询最近1天的数据,间隔时间为30分钟.</div> | ||
29 | + <div>1小时: 查询最近1小时的数据,间隔时间为5分钟.</div> | ||
30 | + <div> | ||
31 | + 间隔时间: | ||
32 | + 以当前时间作为结束时间,往前推移对应天数或小时的时间作为开始时间,然后在此时间区间内进行分组聚合查询. | ||
33 | + </div> | ||
34 | + </template> | ||
35 | + <QuestionCircleOutlined class="!mr-1" /> | ||
36 | + </Tooltip> | ||
11 | <template v-for="(item, index) in dateList" :key="item.value"> | 37 | <template v-for="(item, index) in dateList" :key="item.value"> |
12 | <span | 38 | <span |
13 | - @click="quickQueryDate(index, item.value, role === 'CUSTOMER_USER' && 'customer')" | 39 | + @click=" |
40 | + quickQueryDate(index, item.value, role === RoleEnum.CUSTOMER_USER, item.interval) | ||
41 | + " | ||
14 | :class="{ active: index === activeIndex }" | 42 | :class="{ active: index === activeIndex }" |
15 | >{{ item.label }}</span | 43 | >{{ item.label }}</span |
16 | > | 44 | > |
17 | </template> | 45 | </template> |
18 | <DatePicker | 46 | <DatePicker |
19 | - @change=" | ||
20 | - (_, DateString) => onDateChange(_, DateString, role === 'CUSTOMER_USER' && 'customer') | ||
21 | - " | 47 | + @change="(_, DateString) => onDateChange(_, DateString, role === RoleEnum.CUSTOMER_USER)" |
22 | v-model:value="dateValue" | 48 | v-model:value="dateValue" |
23 | /> | 49 | /> |
24 | </div> | 50 | </div> |
@@ -98,10 +124,11 @@ | @@ -98,10 +124,11 @@ | ||
98 | </template> | 124 | </template> |
99 | <script lang="ts" setup> | 125 | <script lang="ts" setup> |
100 | import { ref, reactive } from 'vue'; | 126 | import { ref, reactive } from 'vue'; |
101 | - import { Card, DatePicker } from 'ant-design-vue'; | 127 | + import { Card, DatePicker, Tooltip } from 'ant-design-vue'; |
128 | + import { QuestionCircleOutlined } from '@ant-design/icons-vue'; | ||
102 | // import VisitAnalysis from './VisitAnalysis.vue'; | 129 | // import VisitAnalysis from './VisitAnalysis.vue'; |
103 | import VisitAnalysisBar from './VisitAnalysisBar.vue'; | 130 | import VisitAnalysisBar from './VisitAnalysisBar.vue'; |
104 | - import { isAdmin } from '/@/enums/roleEnum'; | 131 | + import { RoleEnum, isAdmin } from '/@/enums/roleEnum'; |
105 | import { useWebSocket } from '@vueuse/core'; | 132 | import { useWebSocket } from '@vueuse/core'; |
106 | import { getAuthCache } from '/@/utils/auth'; | 133 | import { getAuthCache } from '/@/utils/auth'; |
107 | import { JWT_TOKEN_KEY } from '/@/enums/cacheEnum'; | 134 | import { JWT_TOKEN_KEY } from '/@/enums/cacheEnum'; |
@@ -129,17 +156,19 @@ | @@ -129,17 +156,19 @@ | ||
129 | // }, | 156 | // }, |
130 | { | 157 | { |
131 | key: '2', | 158 | key: '2', |
132 | - tab: '消息量统计', | 159 | + // tab: '消息量统计', |
160 | + slots: { tab: 'messageStatistics' }, | ||
133 | }, | 161 | }, |
134 | ]; | 162 | ]; |
163 | + | ||
135 | // 快速选择日期 | 164 | // 快速选择日期 |
136 | const activeIndex = ref(3); | 165 | const activeIndex = ref(3); |
137 | const dateValue = ref(); | 166 | const dateValue = ref(); |
138 | const dateList = ref([ | 167 | const dateList = ref([ |
139 | - { label: '1小时', value: 3600000 }, | ||
140 | - { label: '1天', value: 86400000 }, | ||
141 | - { label: '7天', value: 604800000 }, | ||
142 | - { label: '30天', value: 2592000000 }, | 168 | + { label: '1小时', value: 1000 * 60 * 60, interval: 1000 * 60 * 5 }, |
169 | + { label: '1天', value: 1000 * 60 * 60 * 24, interval: 1000 * 60 * 30 }, | ||
170 | + { label: '7天', value: 1000 * 60 * 60 * 24 * 7, interval: 1000 * 60 * 60 * 2 }, | ||
171 | + { label: '30天', value: 1000 * 60 * 60 * 24 * 30, interval: 1000 * 60 * 60 * 24 }, | ||
143 | ]); | 172 | ]); |
144 | 173 | ||
145 | // web Socket | 174 | // web Socket |
@@ -359,17 +388,16 @@ | @@ -359,17 +388,16 @@ | ||
359 | send(sendValue); | 388 | send(sendValue); |
360 | } | 389 | } |
361 | // 选择日期 | 390 | // 选择日期 |
362 | - async function onDateChange(_, dateString, roleType = '') { | ||
363 | - console.log(_, dateString, roleType); | 391 | + async function onDateChange(_, dateString, isCustomer: boolean) { |
364 | activeIndex.value = -1; | 392 | activeIndex.value = -1; |
365 | const dateTime = Number(formatToDateTime(dateString, 'x')); | 393 | const dateTime = Number(formatToDateTime(dateString, 'x')); |
366 | if (!dateString) return; | 394 | if (!dateString) return; |
367 | - if (roleType === 'customer') { | 395 | + if (isCustomer) { |
368 | if (activeKey.value === '1') { | 396 | if (activeKey.value === '1') { |
369 | const data = await getTrendData({ | 397 | const data = await getTrendData({ |
370 | startTs: dateTime, | 398 | startTs: dateTime, |
371 | endTs: dateTime + 86400000, | 399 | endTs: dateTime + 86400000, |
372 | - interval: 7200000, | 400 | + interval: 1000 * 60 * 30, |
373 | trend: 'CUSTOMER_ALARM_STATISTICAL', | 401 | trend: 'CUSTOMER_ALARM_STATISTICAL', |
374 | }); | 402 | }); |
375 | customerAlarmList.value = data; | 403 | customerAlarmList.value = data; |
@@ -377,7 +405,7 @@ | @@ -377,7 +405,7 @@ | ||
377 | const data = await getTrendData({ | 405 | const data = await getTrendData({ |
378 | startTs: dateTime, | 406 | startTs: dateTime, |
379 | endTs: dateTime + 86400000, | 407 | endTs: dateTime + 86400000, |
380 | - interval: 7200000, | 408 | + interval: 1000 * 60 * 30, |
381 | trend: 'CUSTOMER_MESSAGE_STATISTICAL', | 409 | trend: 'CUSTOMER_MESSAGE_STATISTICAL', |
382 | }); | 410 | }); |
383 | customerMessageList.value = data; | 411 | customerMessageList.value = data; |
@@ -395,7 +423,7 @@ | @@ -395,7 +423,7 @@ | ||
395 | : ['transportMsgCountHourly', 'transportDataPointsCountHourly'], | 423 | : ['transportMsgCountHourly', 'transportDataPointsCountHourly'], |
396 | startTs: dateTime, | 424 | startTs: dateTime, |
397 | endTs: dateTime + 86400000, | 425 | endTs: dateTime + 86400000, |
398 | - interval: 7200000, | 426 | + interval: 1000 * 60 * 30, |
399 | limit: 12, | 427 | limit: 12, |
400 | agg: 'SUM', | 428 | agg: 'SUM', |
401 | }, | 429 | }, |
@@ -408,17 +436,17 @@ | @@ -408,17 +436,17 @@ | ||
408 | const customerAlarmList = ref([]); | 436 | const customerAlarmList = ref([]); |
409 | const customerMessageList = ref([]); | 437 | const customerMessageList = ref([]); |
410 | // 快速选择时间 | 438 | // 快速选择时间 |
411 | - async function quickQueryDate(index: number, value: number, roleType = '') { | 439 | + async function quickQueryDate( |
440 | + index: number, | ||
441 | + value: number, | ||
442 | + isCustomer: boolean, | ||
443 | + interval: number | ||
444 | + ) { | ||
412 | if (activeIndex.value === index) return; | 445 | if (activeIndex.value === index) return; |
413 | activeIndex.value = index; | 446 | activeIndex.value = index; |
414 | dateValue.value = ''; | 447 | dateValue.value = ''; |
415 | - let interval = 300000; | ||
416 | - if (value === 86400000) { | ||
417 | - interval = 7200000; | ||
418 | - } else if (value === 604800000 || value === 2592000000) { | ||
419 | - interval = 86400000; | ||
420 | - } | ||
421 | - if (roleType === 'customer') { | 448 | + console.log(interval); |
449 | + if (isCustomer) { | ||
422 | if (activeKey.value === '1') { | 450 | if (activeKey.value === '1') { |
423 | const data = await getTrendData({ | 451 | const data = await getTrendData({ |
424 | startTs: Date.now() - value, | 452 | startTs: Date.now() - value, |
@@ -44,7 +44,7 @@ | @@ -44,7 +44,7 @@ | ||
44 | type: 'time', | 44 | type: 'time', |
45 | }, | 45 | }, |
46 | legend: { | 46 | legend: { |
47 | - data: ['传输数据点', '传输消息量'], | 47 | + data: ['总计传输数据点', '总计传输消息量'], |
48 | left: 'center', | 48 | left: 'center', |
49 | formatter: (name) => { | 49 | formatter: (name) => { |
50 | return name === '传输数据点' ? `${name} ${dataPointTotal}` : `${name} ${messageTotal}`; | 50 | return name === '传输数据点' ? `${name} ${dataPointTotal}` : `${name} ${messageTotal}`; |
@@ -60,7 +60,7 @@ | @@ -60,7 +60,7 @@ | ||
60 | }, | 60 | }, |
61 | series: [ | 61 | series: [ |
62 | { | 62 | { |
63 | - name: '传输数据点', | 63 | + name: '总计传输数据点', |
64 | type: 'line', | 64 | type: 'line', |
65 | stack: 'total', | 65 | stack: 'total', |
66 | data: props.dataPointList, | 66 | data: props.dataPointList, |
@@ -68,7 +68,7 @@ | @@ -68,7 +68,7 @@ | ||
68 | color: '#5AEEED', | 68 | color: '#5AEEED', |
69 | }, | 69 | }, |
70 | { | 70 | { |
71 | - name: '传输消息量', | 71 | + name: '总计传输消息量', |
72 | type: 'line', | 72 | type: 'line', |
73 | stack: 'total', | 73 | stack: 'total', |
74 | // barWidth: '10%', | 74 | // barWidth: '10%', |
@@ -18,7 +18,6 @@ | @@ -18,7 +18,6 @@ | ||
18 | :treeData="treeData" | 18 | :treeData="treeData" |
19 | :replace-fields="{ title: 'name', key: 'id' }" | 19 | :replace-fields="{ title: 'name', key: 'id' }" |
20 | :checkedKeys="roleMenus" | 20 | :checkedKeys="roleMenus" |
21 | - @check="handleCheckClick" | ||
22 | title="菜单分配" | 21 | title="菜单分配" |
23 | /> | 22 | /> |
24 | </Spin> | 23 | </Spin> |
@@ -31,7 +30,7 @@ | @@ -31,7 +30,7 @@ | ||
31 | import { BasicForm, useForm } from '/@/components/Form/index'; | 30 | import { BasicForm, useForm } from '/@/components/Form/index'; |
32 | import { formSchema, KeysTypeEnum, RoleMenuDictEnum } from './role.data'; | 31 | import { formSchema, KeysTypeEnum, RoleMenuDictEnum } from './role.data'; |
33 | import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; | 32 | import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; |
34 | - import { BasicTree, TreeItem } from '/@/components/Tree'; | 33 | + import { BasicTree, TreeActionType, TreeItem } from '/@/components/Tree'; |
35 | import { useMessage } from '/@/hooks/web/useMessage'; | 34 | import { useMessage } from '/@/hooks/web/useMessage'; |
36 | const { t } = useI18n(); //加载国际化 | 35 | const { t } = useI18n(); //加载国际化 |
37 | // 加载菜单数据 | 36 | // 加载菜单数据 |
@@ -55,9 +54,8 @@ | @@ -55,9 +54,8 @@ | ||
55 | const isUpdate = ref<boolean>(true); | 54 | const isUpdate = ref<boolean>(true); |
56 | const treeData = ref<TreeData[]>([]); | 55 | const treeData = ref<TreeData[]>([]); |
57 | const roleMenus = ref<string[]>([]); | 56 | const roleMenus = ref<string[]>([]); |
58 | - const allCheckedKeys = ref<string[]>([]); | ||
59 | const roleId = ref<string>(''); | 57 | const roleId = ref<string>(''); |
60 | - const treeRef = ref(); | 58 | + const treeRef = ref<Nullable<TreeActionType>>(); |
61 | const checked = ref<string[]>([]); //需要选中的节点 | 59 | const checked = ref<string[]>([]); //需要选中的节点 |
62 | const spinning = ref(false); | 60 | const spinning = ref(false); |
63 | 61 | ||
@@ -80,7 +78,6 @@ | @@ -80,7 +78,6 @@ | ||
80 | const { isTenantAdmin, isSysadmin, getRole } = useRole(); | 78 | const { isTenantAdmin, isSysadmin, getRole } = useRole(); |
81 | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner( | 79 | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner( |
82 | async (data: { isUpdate: boolean; record: RoleListItem }) => { | 80 | async (data: { isUpdate: boolean; record: RoleListItem }) => { |
83 | - allCheckedKeys.value = []; | ||
84 | resetFields(); | 81 | resetFields(); |
85 | roleId.value = ''; | 82 | roleId.value = ''; |
86 | // 在打开弹窗时清除所有选择的菜单 | 83 | // 在打开弹窗时清除所有选择的菜单 |
@@ -129,10 +126,10 @@ | @@ -129,10 +126,10 @@ | ||
129 | roleId.value = data.record.id; | 126 | roleId.value = data.record.id; |
130 | 127 | ||
131 | //通过角色id去获取角色对应的菜单的ids | 128 | //通过角色id去获取角色对应的菜单的ids |
132 | - allCheckedKeys.value = roleMenus.value = await getMenusIdsByRoleId(data.record.id); | 129 | + roleMenus.value = await getMenusIdsByRoleId(data.record.id); |
133 | excludeHalfCheckedKeys(unref(treeData)); | 130 | excludeHalfCheckedKeys(unref(treeData)); |
134 | await nextTick(); | 131 | await nextTick(); |
135 | - treeRef.value.setCheckedKeys(roleMenus.value); | 132 | + unref(treeRef)?.setCheckedKeys(roleMenus.value); |
136 | setFieldsValue(data.record); | 133 | setFieldsValue(data.record); |
137 | } else { | 134 | } else { |
138 | } | 135 | } |
@@ -150,13 +147,14 @@ | @@ -150,13 +147,14 @@ | ||
150 | setDrawerProps({ confirmLoading: true }); | 147 | setDrawerProps({ confirmLoading: true }); |
151 | const { createMessage } = useMessage(); | 148 | const { createMessage } = useMessage(); |
152 | try { | 149 | try { |
150 | + const menu = (unref(treeRef)?.getCheckedKeys() as string[]) || []; | ||
153 | const values = await validate(); | 151 | const values = await validate(); |
154 | const req = { | 152 | const req = { |
155 | id: roleId.value, | 153 | id: roleId.value, |
156 | name: values.name, | 154 | name: values.name, |
157 | remark: values.remark, | 155 | remark: values.remark, |
158 | status: values.status, | 156 | status: values.status, |
159 | - menu: unref(allCheckedKeys) || [], | 157 | + menu, |
160 | }; | 158 | }; |
161 | if (req.menu == undefined) return createMessage.error('请勾选权限菜单'); | 159 | if (req.menu == undefined) return createMessage.error('请勾选权限菜单'); |
162 | saveOrUpdateRoleInfoWithMenu(req).then(() => { | 160 | saveOrUpdateRoleInfoWithMenu(req).then(() => { |
@@ -170,10 +168,6 @@ | @@ -170,10 +168,6 @@ | ||
170 | }, 300); | 168 | }, 300); |
171 | } | 169 | } |
172 | } | 170 | } |
173 | - // Tree check事件 | ||
174 | - const handleCheckClick = (checkedNodes, { halfCheckedKeys }) => { | ||
175 | - allCheckedKeys.value = [...checkedNodes, ...halfCheckedKeys]; | ||
176 | - }; | ||
177 | 171 | ||
178 | const getPermissionByRole = async (roleType: RoleEnum) => { | 172 | const getPermissionByRole = async (roleType: RoleEnum) => { |
179 | try { | 173 | try { |
@@ -254,8 +248,6 @@ | @@ -254,8 +248,6 @@ | ||
254 | treeData, | 248 | treeData, |
255 | roleMenus, | 249 | roleMenus, |
256 | treeRef, | 250 | treeRef, |
257 | - handleCheckClick, | ||
258 | - allCheckedKeys, | ||
259 | }; | 251 | }; |
260 | }, | 252 | }, |
261 | }); | 253 | }); |
@@ -15,7 +15,6 @@ | @@ -15,7 +15,6 @@ | ||
15 | :treeData="treeData" | 15 | :treeData="treeData" |
16 | :replaceFields="{ title: 'name', key: 'id' }" | 16 | :replaceFields="{ title: 'name', key: 'id' }" |
17 | :checkedKeys="roleMenus" | 17 | :checkedKeys="roleMenus" |
18 | - @check="handleCheckClick" | ||
19 | checkable | 18 | checkable |
20 | toolbar | 19 | toolbar |
21 | ref="treeRef" | 20 | ref="treeRef" |
@@ -31,7 +30,7 @@ | @@ -31,7 +30,7 @@ | ||
31 | import { BasicForm, useForm } from '/@/components/Form/index'; | 30 | import { BasicForm, useForm } from '/@/components/Form/index'; |
32 | import { formSchema } from './role.data'; | 31 | import { formSchema } from './role.data'; |
33 | import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; | 32 | import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'; |
34 | - import { BasicTree, TreeItem } from '/@/components/Tree'; | 33 | + import { BasicTree, TreeActionType, TreeItem } from '/@/components/Tree'; |
35 | const { t } = useI18n(); //加载国际化 | 34 | const { t } = useI18n(); //加载国际化 |
36 | // 加载菜单数据 | 35 | // 加载菜单数据 |
37 | import { getAdminMenuList, getMenuList, getMenusIdsByRoleId } from '/@/api/sys/menu'; | 36 | import { getAdminMenuList, getMenuList, getMenusIdsByRoleId } from '/@/api/sys/menu'; |
@@ -55,9 +54,8 @@ | @@ -55,9 +54,8 @@ | ||
55 | const isUpdate = ref(true); | 54 | const isUpdate = ref(true); |
56 | const treeData = ref<TreeData[]>([]); | 55 | const treeData = ref<TreeData[]>([]); |
57 | const roleMenus = ref<string[]>([]); | 56 | const roleMenus = ref<string[]>([]); |
58 | - const allCheckedKeys = ref<string[]>([]); | ||
59 | const roleId = ref(''); | 57 | const roleId = ref(''); |
60 | - const treeRef = ref(); | 58 | + const treeRef = ref<Nullable<TreeActionType>>(null); |
61 | const checked = ref<string[]>([]); //需要选中的节点 | 59 | const checked = ref<string[]>([]); //需要选中的节点 |
62 | const spinning = ref(false); | 60 | const spinning = ref(false); |
63 | 61 | ||
@@ -79,7 +77,6 @@ | @@ -79,7 +77,6 @@ | ||
79 | 77 | ||
80 | const { isPlatformAdmin } = useRole(); | 78 | const { isPlatformAdmin } = useRole(); |
81 | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { | 79 | const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => { |
82 | - allCheckedKeys.value = []; | ||
83 | resetFields(); | 80 | resetFields(); |
84 | roleId.value = ''; | 81 | roleId.value = ''; |
85 | // 在打开弹窗时清除所有选择的菜单 | 82 | // 在打开弹窗时清除所有选择的菜单 |
@@ -111,11 +108,11 @@ | @@ -111,11 +108,11 @@ | ||
111 | roleId.value = data.record.id; | 108 | roleId.value = data.record.id; |
112 | 109 | ||
113 | //通过角色id去获取角色对应的菜单的ids | 110 | //通过角色id去获取角色对应的菜单的ids |
114 | - allCheckedKeys.value = roleMenus.value = await getMenusIdsByRoleId(data.record.id); | 111 | + roleMenus.value = await getMenusIdsByRoleId(data.record.id); |
115 | excludeHalfCheckedKeys(unref(treeData)); | 112 | excludeHalfCheckedKeys(unref(treeData)); |
116 | 113 | ||
117 | await nextTick(); | 114 | await nextTick(); |
118 | - treeRef.value.setCheckedKeys(roleMenus.value); | 115 | + treeRef.value?.setCheckedKeys(roleMenus.value); |
119 | setFieldsValue(data.record); | 116 | setFieldsValue(data.record); |
120 | } else { | 117 | } else { |
121 | } | 118 | } |
@@ -131,6 +128,7 @@ | @@ -131,6 +128,7 @@ | ||
131 | setDrawerProps({ loading: true }); | 128 | setDrawerProps({ loading: true }); |
132 | setDrawerProps({ confirmLoading: true }); | 129 | setDrawerProps({ confirmLoading: true }); |
133 | const { createMessage } = useMessage(); | 130 | const { createMessage } = useMessage(); |
131 | + const menu = (unref(treeRef)?.getCheckedKeys() as string[]) || []; | ||
134 | try { | 132 | try { |
135 | const values = await validate(); | 133 | const values = await validate(); |
136 | const req = { | 134 | const req = { |
@@ -139,7 +137,7 @@ | @@ -139,7 +137,7 @@ | ||
139 | remark: values.remark, | 137 | remark: values.remark, |
140 | status: values.status, | 138 | status: values.status, |
141 | roleType: RoleEnum.TENANT_ADMIN, | 139 | roleType: RoleEnum.TENANT_ADMIN, |
142 | - menu: unref(allCheckedKeys) || [], | 140 | + menu, |
143 | }; | 141 | }; |
144 | if (req.menu == undefined) return createMessage.error('请勾选权限菜单'); | 142 | if (req.menu == undefined) return createMessage.error('请勾选权限菜单'); |
145 | const res = await saveOrUpdateRoleInfoWithMenu(req); | 143 | const res = await saveOrUpdateRoleInfoWithMenu(req); |
@@ -157,10 +155,6 @@ | @@ -157,10 +155,6 @@ | ||
157 | }, 300); | 155 | }, 300); |
158 | } | 156 | } |
159 | } | 157 | } |
160 | - // Tree check事件 | ||
161 | - const handleCheckClick = (checkedNodes, { halfCheckedKeys }) => { | ||
162 | - allCheckedKeys.value = [...checkedNodes, ...halfCheckedKeys]; | ||
163 | - }; | ||
164 | 158 | ||
165 | const getPermissionByRole = async (roleType: RoleEnum) => { | 159 | const getPermissionByRole = async (roleType: RoleEnum) => { |
166 | try { | 160 | try { |
@@ -241,7 +235,6 @@ | @@ -241,7 +235,6 @@ | ||
241 | treeData, | 235 | treeData, |
242 | roleMenus, | 236 | roleMenus, |
243 | treeRef, | 237 | treeRef, |
244 | - handleCheckClick, | ||
245 | }; | 238 | }; |
246 | }, | 239 | }, |
247 | }); | 240 | }); |