2 İşlemeler 7f818b3291 ... ec61bee1ef

Yazar SHA1 Mesaj Tarih
  lixiangrui ec61bee1ef feat: 运行数据图表联调 4 hafta önce
  lixiangrui 93743a2f88 feat: 运行数据图表联调 4 hafta önce

+ 41 - 0
src/api/portraitManagement/portraitManagement.js

@@ -43,4 +43,45 @@ export function getDeptPositionDistribution(data) {
43 43
 // 维度得分一览
44 44
 export function getDimensionScoreOverview(data) {
45 45
     return request({ url: '/score/dept-portrait/group-portrait', method: 'post', data })
46
+}
47
+
48
+// 1.查询每日通道过检率
49
+export function countLanePeakThroughput(data) {
50
+    return request({ url: '/ledger/operationLanePeakThroughput/countLanePeakThroughput', method: 'post', data })
51
+}
52
+// 2.查询当天开航每小时区域过检人数
53
+export function countStationHourlyThroughput(data) {
54
+    return request({ url: '/ledger/operationStationHourlyThroughput/countStationHourlyThroughput', method: 'get', data })
55
+}
56
+// 3.查获信息展示
57
+export function countSeizureInfoItem(data) {
58
+    return request({ url: '/ledger/seizureStats/countSeizureInfoItem', method: 'post', data })
59
+}
60
+// 4.查获物品分布
61
+export function countSeizeSubjectCategoryQuantity(data) {
62
+    return request({ url: '/ledger/seizureStats/countSeizeSubjectCategoryQuantity', method: 'post', data })
63
+}
64
+// 5.近30天查获数量(总表)
65
+export function countSeizureTotalQuantity(data) {
66
+    return request({ url: '/ledger/seizureStats/countSeizureTotalQuantity', method: 'post', data })
67
+}
68
+// 6.近30天查获数量(员工/小组/班组/部门)
69
+export function countSeizureSingleQuantity(data) {
70
+    return request({ url: '/ledger/seizureStats/countSeizureSingleQuantity', method: 'post', data })
71
+}
72
+// 7.查获工作区域分布
73
+export function countSeizeAreaQuantity(data) {
74
+    return request({ url: '/ledger/seizureStats/countSeizeAreaQuantity', method: 'post', data })
75
+}
76
+// 8.不安全事件物品分布
77
+export function countSeizureStatsItem(data) {
78
+    return request({ url: '/ledger/unsafeEvent/countSeizureStatsItem', method: 'post', data })
79
+}
80
+// 9.不安全事件类型分布
81
+export function countSeizureStatsType(data) {
82
+    return request({ url: '/ledger/unsafeEvent/countSeizureStatsType', method: 'post', data })
83
+}
84
+// 10.不安全事件岗位分布
85
+export function countSeizureStatsPost(data) {
86
+    return request({ url: '/ledger/unsafeEvent/countSeizureStatsPost', method: 'post', data })
46 87
 }

+ 7 - 19
src/views/portraitManagement/components/ChannelCheckChart.vue

@@ -16,7 +16,6 @@ const props = defineProps({
16 16
   }
17 17
 })
18 18
 const setChartsOptionsBar = computed(() => {
19
-  const hours = Array.from({length: 24}, (_, i) => `${i.toString().padStart(2, '0')}:00`)
20 19
   return {
21 20
     grid: {
22 21
       top: 40,
@@ -26,7 +25,7 @@ const setChartsOptionsBar = computed(() => {
26 25
     },
27 26
     xAxis: {
28 27
       type: 'category',
29
-      data: hours,
28
+      data: props.chartsData.map(item => item.recordDate),
30 29
       axisLabel: { color: '#fff', fontSize: 14 },
31 30
       axisLine: { lineStyle: { color: '#344067' } }
32 31
     },
@@ -44,7 +43,7 @@ const setChartsOptionsBar = computed(() => {
44 43
         type: 'value',
45 44
         name: '数量',
46 45
         position: 'right',
47
-        max: Math.max(...props.chartsData.map(item => item.num)) + 100,
46
+        max: 'dataMax',
48 47
         axisLabel: { color: '#fff', fontSize: 14 },
49 48
         axisLine: {  lineStyle: { color: '#fff' } },
50 49
         splitLine: { show: false }
@@ -52,21 +51,10 @@ const setChartsOptionsBar = computed(() => {
52 51
     ],
53 52
     series: [
54 53
       {
55
-        name: '过检人数',
54
+        name: '本通道过检人数',
56 55
         type: 'bar',
57 56
         yAxisIndex: 1,
58
-        data: props.chartsData.map(item => item.num),
59
-        itemStyle: {
60
-          color: '#6DA6FE',
61
-          borderRadius: [2, 2, 0, 0],
62
-        },
63
-        barWidth: '20%'
64
-      },
65
-      {
66
-        name: '过检人数1',
67
-        type: 'bar',
68
-        yAxisIndex: 1,
69
-        data: props.chartsData.map(item => item.num1),
57
+        data: props.chartsData.map(item => item.totalRecord),
70 58
         itemStyle: {
71 59
           color: '#9963FB',
72 60
           borderRadius: [2, 2, 0, 0],
@@ -74,10 +62,10 @@ const setChartsOptionsBar = computed(() => {
74 62
         barWidth: '20%'
75 63
       },
76 64
       {
77
-        name: '过检人数2',
65
+        name: '过检人数',
78 66
         type: 'bar',
79 67
         yAxisIndex: 1,
80
-        data: props.chartsData.map(item => item.num2),
68
+        data: props.chartsData.map(item => item.totalThroughput),
81 69
         itemStyle: {
82 70
           color: '#FCE661',
83 71
           borderRadius: [2, 2, 0, 0],
@@ -88,7 +76,7 @@ const setChartsOptionsBar = computed(() => {
88 76
         name: '过检率',
89 77
         type: 'line',
90 78
         yAxisIndex: 0,
91
-        data: props.chartsData.map(item => item.rate),
79
+        data: props.chartsData.map(item => item.throughputRate),
92 80
         smooth: true,
93 81
         itemStyle: { color: '#F801FA' },
94 82
         lineStyle: { color: '#F801FA' }

+ 5 - 3
src/views/portraitManagement/components/EventItems.vue

@@ -31,18 +31,20 @@ const setChartsOptionsBar = computed(() => {
31 31
       textStyle: { color: '#fff' }
32 32
     },
33 33
     legend: {
34
-      top: 'center',
34
+      top: '10%',
35 35
       left: '0%',
36 36
       orient: 'vertical',
37 37
       textStyle: { color: '#fff' }
38 38
     },
39 39
     series: [{
40 40
       type: 'pie',
41
+      avoidLabelOverlap: true, 
41 42
       radius: ['40%', '60%'],
43
+      center: ['50%', '50%'], 
42 44
       data: props.chartsData.map(item => {
43 45
         return {
44
-          value: item.num,
45
-          name: item.name
46
+          value: item.itemNum,
47
+          name: item.itemName
46 48
         }
47 49
       }),
48 50
       label: { show: true, color: '#fff', fontSize: 16, lineHeight: 20, formatter: '{b}\n{c}'  },

+ 4 - 3
src/views/portraitManagement/components/EventType.vue

@@ -31,7 +31,7 @@ const setChartsOptionsBar = computed(() => {
31 31
       textStyle: { color: '#fff' }
32 32
     },
33 33
     legend: {
34
-      top: 'center',
34
+      top: '10%',
35 35
       left: '0%',
36 36
       orient: 'vertical',
37 37
       textStyle: { color: '#fff' }
@@ -39,10 +39,11 @@ const setChartsOptionsBar = computed(() => {
39 39
     series: [{
40 40
       type: 'pie',
41 41
       radius: ['40%', '60%'],
42
+      center: ['50%', '50%'], 
42 43
       data: props.chartsData.map(item => {
43 44
         return {
44
-          value: item.num,
45
-          name: item.name
45
+          value: item.eventTypeNum,
46
+          name: item.eventTypeName
46 47
         }
47 48
       }),
48 49
       label: { show: true, color: '#fff', fontSize: 16, lineHeight: 20, formatter: '{b}\n{c}'  },

+ 2 - 2
src/views/portraitManagement/components/EventWorkArea.vue

@@ -16,7 +16,7 @@ const props = defineProps({
16 16
   }
17 17
 })
18 18
 const setChartsOptionsBar = computed(() => {
19
-  const labels = props.chartsData.map(item => item.name)
19
+  const labels = props.chartsData.map(item => item.positionName)
20 20
   return {
21 21
     grid: {
22 22
       top: 50,
@@ -49,7 +49,7 @@ const setChartsOptionsBar = computed(() => {
49 49
       {
50 50
         name: '查获数量',
51 51
         type: 'bar',
52
-        data: props.chartsData.map(item => item.num),
52
+        data: props.chartsData.map(item => item.positionNum),
53 53
         itemStyle: {
54 54
           borderRadius: [5, 5, 0, 0],
55 55
           color: '#6DA6FE',

+ 19 - 8
src/views/portraitManagement/components/SearchBar.vue

@@ -1,5 +1,6 @@
1 1
 <template>
2 2
   <div class="ep-topbar" @click="visible = false">
3
+    <div class="ep-topbar-content">
3 4
     <div class="time-btns">
4 5
       <div :class="currentTime === 'week' ? 'primary' : 'default'" @click="selectTime('week')">近一周</div>
5 6
       <div :class="currentTime === 'month' ? 'primary' : 'default'" @click="selectTime('month')">近一月</div>
@@ -38,6 +39,7 @@
38 39
         </div>
39 40
       </div>
40 41
     </el-popover>
42
+    </div>
41 43
   </div>
42 44
 </template>
43 45
 
@@ -136,6 +138,7 @@ const searchHandler = (query = {}) => {
136 138
     }
137 139
   } else {
138 140
     emit('search', queryParams)
141
+    visible.value = false
139 142
   }
140 143
 }
141 144
 
@@ -204,7 +207,7 @@ onUnmounted(() => {
204 207
 defineExpose({
205 208
   getDefQuery() {
206 209
     return {
207
-      ...getTimeRange()
210
+      ...getTimeRange(),
208 211
     }
209 212
   }
210 213
 })
@@ -212,14 +215,22 @@ defineExpose({
212 215
 
213 216
 <style lang="scss" scoped>
214 217
 .ep-topbar {
215
-  display: flex;
216
-  align-items: center;
217
-  justify-content: flex-start;
218
+
218 219
   height: 60px;
219
-  padding: 0 15px;
220
-  box-sizing: border-box;
221
-  gap: 12px;
222
-  flex-wrap: wrap;
220
+  position: relative;
221
+
222
+  .ep-topbar-content {
223
+    position: absolute;
224
+    padding: 0 15px;
225
+    inset: 0;
226
+    display: flex;
227
+    align-items: center;
228
+    justify-content: flex-start;
229
+    box-sizing: border-box;
230
+    gap: 12px;
231
+    flex-wrap: wrap;
232
+    z-index: 1000;
233
+  }
223 234
 
224 235
   .time-btns {
225 236
     display: flex;

+ 11 - 13
src/views/portraitManagement/components/SeizedInfo.vue

@@ -4,7 +4,7 @@
4 4
       <div class="svgIcon">
5 5
         <Svg></Svg>
6 6
         <div class="svgContent">
7
-          <div class="value">1658</div>
7
+          <div class="value">{{ chartsData.totalSeizeNum }}</div>
8 8
           <div class="tips">
9 9
             <span>查获总数</span>
10 10
             <span>(所有人员)</span>
@@ -27,7 +27,7 @@ const bar = ref(null)
27 27
 const props = defineProps({
28 28
   chartsData: {
29 29
     type: Object,
30
-    default: () => ([])
30
+    default: () => ({ totalSeizeNum: 0, itemList: [] })
31 31
   }
32 32
 })
33 33
 
@@ -74,17 +74,16 @@ const colors = [
74 74
 ]
75 75
 
76 76
 const setChartsOptionsBar = computed(() => {
77
-  const hours = ['等级1', '等级2', '等级3']
78 77
   return {
79 78
     grid: {
80
-      top: 30,
79
+      top: 20,
81 80
       bottom: 40,
82
-      left: 60,
83
-      right: 30
81
+      left: 35,
82
+      right: 15
84 83
     },
85 84
     xAxis: {
86 85
       type: 'category',
87
-      data: hours,
86
+      data: props.chartsData.itemList.map(item => item.name),
88 87
       axisLabel: { color: '#fff', fontSize: 14 },
89 88
       axisLine: { lineStyle: { color: '#344067' } }
90 89
     },
@@ -92,24 +91,23 @@ const setChartsOptionsBar = computed(() => {
92 91
       {
93 92
         type: 'value',
94 93
         position: 'left',
95
-        max: Math.max(...props.chartsData.map(item => item.num)) + 100,
96 94
         axisLabel: { color: '#fff', fontSize: 14 },
97 95
         axisLine: {  lineStyle: { color: '#fff' } },
98
-        splitLine: { show: false }
96
+        splitLine: { lineStyle: { color: '#344067' }  }
99 97
       }
100 98
     ],
101 99
     series: [
102 100
       {
103
-        name: '数',
101
+        name: '查获数',
104 102
         type: 'bar',
105
-        data: props.chartsData.map(item => item.num),
103
+        data: props.chartsData.itemList.map(item => item.seizeNum),
106 104
         itemStyle: {
107 105
           color: (params) => {
108 106
             return colors[params.dataIndex % colors.length]
109 107
           },
110 108
           borderRadius: [5, 5, 0, 0],
111 109
         },
112
-        barWidth: '40px'
110
+        barWidth: '50%'
113 111
       },
114 112
     ],
115 113
     tooltip: {
@@ -129,7 +127,7 @@ useECharts(bar, setChartsOptionsBar);
129 127
   display: flex;
130 128
   width: 100%;
131 129
   height: 100%;
132
-  column-gap: 30px;
130
+  column-gap: 20px;
133 131
   .svgIcon {
134 132
     width: 280px;
135 133
     box-sizing: border-box;

+ 2 - 2
src/views/portraitManagement/components/SeizedItems.vue

@@ -41,8 +41,8 @@ const setChartsOptionsBar = computed(() => {
41 41
       radius: ['40%', '70%'],
42 42
       data: props.chartsData.map(item => {
43 43
         return {
44
-          value: item.num,
45
-          name: item.name
44
+          value: item.itemNum,
45
+          name: item.itemName
46 46
         }
47 47
       }),
48 48
       label: { show: true, color: '#fff', fontSize: 16, lineHeight: 20, formatter: '{b}\n{c}'  },

+ 79 - 95
src/views/portraitManagement/components/SeizedNum.vue

@@ -5,115 +5,99 @@
5 5
 </template>
6 6
 
7 7
 <script setup>
8
-import { computed } from 'vue';
9
-import Card from './card.vue';
10
-import { useECharts } from '@/hooks/useEcharts.js';
11
-const bar = ref(null)
12
-const props = defineProps({
13
-  chartsData: {
14
-    type: Object,
15
-    default: () => ([])
16
-  }
17
-})
18
-const setChartsOptionsBar = computed(() => {
19
-  return {
20
-    grid: {
21
-      top: 40,
22
-      bottom: 30,
23
-      left: 60,
24
-      right: 20
25
-    },
26
-    xAxis: {
27
-      type: 'category',
28
-      axisLabel: { show: false },
29
-      axisLine: { show: false },
30
-      boundaryGap: false
31
-    },
32
-    yAxis: [
33
-      {
34
-        type: 'value',
35
-        position: 'left',
36
-        axisLabel: { color: '#fff', fontSize: 14 },
37
-        axisLine: {  lineStyle: { color: '#fff' } },
38
-        splitLine: { lineStyle: { color: '#344067' } }
39
-      },
40
-    ],
41
-    series: [
42
-      {
43
-        name: '数量1',
44
-        type: 'line',
45
-        data: props.chartsData.map(item => item.num),
46
-        smooth: true,
47
-        itemStyle: { color: '#71B138' },
48
-        lineStyle: { color: '#71B138' },
49
-        areaStyle: { color: {
8
+  import { computed } from 'vue';
9
+  import Card from './card.vue';
10
+  import { useECharts } from '@/hooks/useEcharts.js';
11
+  const bar = ref(null)
12
+  const props = defineProps({
13
+    chartsData: {
14
+      type: Object,
15
+      default: () => ([])
16
+    }
17
+  })
18
+  const countryColors = ['#71B138', '#F801FA', '#6DA6FE', '#95E530', '#9963FB', '#FCE661', '#22C2CC', '#F76723']
19
+  const createItemConfig = (index) => {
20
+    const curColor = countryColors[index % countryColors.length] 
21
+    return {
22
+      type: 'line',
23
+      smooth: true,
24
+      itemStyle: { color: curColor },
25
+      lineStyle: { color: curColor },
26
+      areaStyle: {
27
+        color: {
50 28
           type: 'linear',
51 29
           x: 0,
52 30
           y: 0,
53 31
           x2: 0,
54 32
           y2: 1,
55 33
           colorStops: [{
56
-            offset: 0, color: '#71B138'
34
+            offset: 0, color: curColor
57 35
           }, {
58
-            offset: 1, color: '#71B13800'
36
+            offset: 1, color: curColor + '00'
59 37
           }],
60 38
           global: false
61
-        }}
39
+        }
40
+      }
41
+    }
42
+  }
43
+  const setChartsOptionsBar = computed(() => {
44
+    const group = props.chartsData.reduce((cur,acc) => {
45
+      let curItem = cur.find(item => item.groupName === acc.groupName)
46
+      if (curItem) {
47
+        curItem.seizeNums.push(acc.seizeQuantity)
48
+        curItem.recordDates.push(acc.recordDate)
49
+      } else {
50
+        curItem = {
51
+          groupName: acc.groupName,
52
+          seizeNums: [acc.seizeQuantity],
53
+          recordDates: [acc.recordDate]
54
+        }
55
+        cur.push(curItem)
56
+      }
57
+      return cur
58
+    }, [])
59
+    console.log(group);
60
+    
61
+    return {
62
+      grid: {
63
+        top: 40,
64
+        bottom: 30,
65
+        left: 60,
66
+        right: 20
62 67
       },
63
-      {
64
-        name: '数量2',
65
-        type: 'line',
66
-        data: props.chartsData.map(item => item.num1),
67
-        smooth: true,
68
-        itemStyle: { color: '#F801FA' },
69
-        lineStyle: { color: '#F801FA' },
70
-        areaStyle: { color: {
71
-          type: 'linear',
72
-          x: 0,
73
-          y: 0,
74
-          x2: 0,
75
-          y2: 1,
76
-          colorStops: [{
77
-            offset: 0, color: '#F801FA'
78
-          }, {
79
-            offset: 1, color: '#F801FA00'
80
-          }],
81
-          global: false
82
-        }}
68
+      xAxis: {
69
+        type: 'category',
70
+        axisLabel: { show: false },
71
+        axisLine: { show: false },
72
+        boundaryGap: false,
73
+        data: group.length ? group[0].recordDates : []
83 74
       },
84
-      {
85
-        name: '数量3',
86
-        type: 'line',
87
-        data: props.chartsData.map(item => item.num2),
88
-        smooth: true,
89
-        itemStyle: { color: '#6DA6FE' },
90
-        lineStyle: { color: '#6DA6FE' },
91
-        areaStyle: { color: {
92
-          type: 'linear',
93
-          x: 0,
94
-          y: 0,
95
-          x2: 0,
96
-          y2: 1,
97
-          colorStops: [{
98
-            offset: 0, color: '#6DA6FE'
99
-          }, {
100
-            offset: 1, color: '#6DA6FE00'
101
-          }],
102
-          global: false
103
-        }}
75
+      yAxis: [
76
+        {
77
+          type: 'value',
78
+          position: 'left',
79
+          axisLabel: { color: '#fff', fontSize: 14 },
80
+          axisLine: { lineStyle: { color: '#fff' } },
81
+          splitLine: { lineStyle: { color: '#344067' } }
82
+        },
83
+      ],
84
+      series: group.map((item, index) => {
85
+        return {
86
+          name: item.groupName,
87
+          data: item.seizeNums,
88
+          ...createItemConfig(index)
89
+        }
90
+      }),
91
+      tooltip: {
92
+        trigger: 'axis',
93
+        backgroundColor: 'rgba(13,80,122,1)',
94
+        borderColor: '#70CFE7',
95
+        textStyle: { color: '#fff' }
104 96
       }
105
-    ],
106
-    tooltip: {
107
-      trigger: 'axis',
108
-      backgroundColor: 'rgba(13,80,122,1)',
109
-      borderColor: '#70CFE7',
110
-      textStyle: { color: '#fff' }
111 97
     }
112
-  }
113
-})
114
-
115
-useECharts(bar, setChartsOptionsBar);
98
+  })
116 99
 
100
+  useECharts(bar, setChartsOptionsBar);
117 101
 </script>
118 102
 
119 103
 <style lang="scss" scoped></style>

+ 4 - 2
src/views/portraitManagement/components/SeizedNumAll.vue

@@ -15,8 +15,9 @@ const props = defineProps({
15 15
     default: () => ([])
16 16
   }
17 17
 })
18
+
19
+
18 20
 const setChartsOptionsBar = computed(() => {
19
-  const hours = Array.from({length: 24}, (_, i) => `${i.toString().padStart(2, '0')}:00`)
20 21
   return {
21 22
     grid: {
22 23
       top: 40,
@@ -26,6 +27,7 @@ const setChartsOptionsBar = computed(() => {
26 27
     },
27 28
     xAxis: {
28 29
       type: 'category',
30
+      data: props.chartsData.map(item => item.recordDate ),
29 31
       axisLabel: { show: false },
30 32
       axisLine: { show: false },
31 33
       boundaryGap: false
@@ -43,7 +45,7 @@ const setChartsOptionsBar = computed(() => {
43 45
       {
44 46
         name: '查获数',
45 47
         type: 'line',
46
-        data: props.chartsData.map(item => item.num),
48
+        data: props.chartsData.map(item => item.seizeQuantity),
47 49
         smooth: true,
48 50
         itemStyle: { color: '#71B138' },
49 51
         lineStyle: { color: '#71B138' }

+ 2 - 2
src/views/portraitManagement/components/SeizedWorkArea.vue

@@ -16,7 +16,7 @@ const props = defineProps({
16 16
   }
17 17
 })
18 18
 const setChartsOptionsBar = computed(() => {
19
-  const labels = props.chartsData.map(item => item.name)
19
+  const labels = props.chartsData.map(item => item.workArea)
20 20
   return {
21 21
     grid: {
22 22
       top: 50,
@@ -49,7 +49,7 @@ const setChartsOptionsBar = computed(() => {
49 49
       {
50 50
         name: '查获数量',
51 51
         type: 'bar',
52
-        data: props.chartsData.map(item => item.num),
52
+        data: props.chartsData.map(item => item.areaSeizeNum),
53 53
         itemStyle: {
54 54
           borderRadius: [5, 5, 0, 0],
55 55
           color: '#95E530',

+ 1 - 1
src/views/portraitManagement/components/TestArea.vue

@@ -49,7 +49,7 @@ const setChartsOptionsBar = computed(() => {
49 49
       {
50 50
         name: '查获数量',
51 51
         type: 'bar',
52
-        data: props.chartsData.map(item => item.num),
52
+        data: props.chartsData.map(item => item.total),
53 53
         itemStyle: {
54 54
           borderRadius: [5, 5, 0, 0],
55 55
           color: '#9963FB',

+ 2 - 2
src/views/portraitManagement/components/TestItems.vue

@@ -31,7 +31,7 @@ const setChartsOptionsBar = computed(() => {
31 31
       textStyle: { color: '#fff' }
32 32
     },
33 33
     legend: {
34
-      top: 'center',
34
+      top: '10%',
35 35
       left: '0%',
36 36
       orient: 'vertical',
37 37
       textStyle: { color: '#fff' }
@@ -41,7 +41,7 @@ const setChartsOptionsBar = computed(() => {
41 41
       radius: ['0%', '60%'],
42 42
       data: props.chartsData.map(item => {
43 43
         return {
44
-          value: item.num,
44
+          value: item.total,
45 45
           name: item.name
46 46
         }
47 47
       }),

+ 2 - 2
src/views/portraitManagement/components/TestResult.vue

@@ -31,7 +31,7 @@ const setChartsOptionsBar = computed(() => {
31 31
       textStyle: { color: '#fff' }
32 32
     },
33 33
     legend: {
34
-      top: 'center',
34
+      top: '10%',
35 35
       left: '0%',
36 36
       orient: 'vertical',
37 37
       textStyle: { color: '#fff' }
@@ -41,7 +41,7 @@ const setChartsOptionsBar = computed(() => {
41 41
       radius: ['0%', '60%'],
42 42
       data: props.chartsData.map(item => {
43 43
         return {
44
-          value: item.num,
44
+          value: item.total,
45 45
           name: item.name
46 46
         }
47 47
       }),

+ 152 - 63
src/views/portraitManagement/deptProfile/component/runData.vue

@@ -1,47 +1,47 @@
1 1
 <template>
2 2
   <div class="operation-data">
3 3
     <div class="row">
4
-      <ChannelCheckChart :chartsData="chartsData" />
4
+      <ChannelCheckChart :chartsData="channelCheckData" />
5 5
     </div>
6 6
     <div class="row">
7 7
       <div class="col">
8
-        <SeizedInfo :chartsData="chartsData"/>
8
+        <SeizedInfo :chartsData="countSeizureInfoItemData"/>
9 9
       </div>
10 10
       <div class="col">
11
-        <SeizedItems :chartsData="chartsData" />
11
+        <SeizedItems :chartsData="countSeizeSubjectCategoryQuantityData" />
12 12
       </div>
13 13
     </div>
14 14
     <div class="row">
15 15
       <div class="col">
16
-        <SeizedNumAll :chartsData="chartsData"/>
16
+        <SeizedNumAll :chartsData="countSeizureTotalQuantityData"/>
17 17
       </div>
18 18
       <div class="col">
19
-        <SeizedNum :chartsData="chartsData" />
19
+        <SeizedNum :chartsData="countSeizureSingleQuantityData" />
20 20
       </div>
21 21
     </div>
22 22
     <div class="row">
23
-      <SeizedWorkArea :chartsData="chartsData" />
23
+      <SeizedWorkArea :chartsData="countSeizeAreaQuantityData" />
24 24
     </div>
25 25
     <div class="row">
26 26
       <div class="col">
27
-        <EventItems :chartsData="chartsData"  />
27
+        <EventItems :chartsData="countSeizureStatsItemData"  />
28 28
       </div>
29 29
       <div class="col">
30
-        <EventType :chartsData="chartsData"  />
30
+        <EventType :chartsData="countSeizureStatsTypeData"  />
31 31
       </div>
32 32
       <div class="col">
33
-        <EventWorkArea :chartsData="chartsData"  />
33
+        <EventWorkArea :chartsData="countSeizureStatsPostData"  />
34 34
       </div>
35 35
     </div>
36 36
     <div class="row">
37 37
       <div class="col">
38
-        <TestItems :chartsData="chartsData"  />
38
+        <TestItems :chartsData="securityTestItemClassificationData"  />
39 39
       </div>
40 40
       <div class="col">
41
-        <TestResult :chartsData="chartsData"  />
41
+        <TestResult :chartsData="securityTestPassingStatusData"  />
42 42
       </div>
43 43
       <div class="col">
44
-        <TestArea :chartsData="chartsData"  />
44
+        <TestArea :chartsData="securityTestRegionData"  />
45 45
       </div>
46 46
     </div>
47 47
     <div class="row">
@@ -71,7 +71,23 @@ import TestResult from '../../components/TestResult.vue';
71 71
 import TestArea from '../../components/TestArea.vue';
72 72
 import SupervisionDistribution from '../../components/SupervisionDistribution.vue';
73 73
 import InterceptionDistribution from '../../components/InterceptionDistribution.vue';
74
-import { realtimeInterceptionItem, supervisionProblemPosition } from '@/api/portraitManagement/portraitManagement';
74
+import { 
75
+  countLanePeakThroughput,
76
+  countStationHourlyThroughput,
77
+  countSeizureInfoItem,
78
+  countSeizeSubjectCategoryQuantity,
79
+  countSeizureTotalQuantity,
80
+  countSeizureSingleQuantity,
81
+  countSeizeAreaQuantity,
82
+  countSeizureStatsItem,
83
+  countSeizureStatsType,
84
+  countSeizureStatsPost,
85
+  securityTestItemClassification,
86
+  securityTestPassingStatus,
87
+  securityTestRegion,
88
+  realtimeInterceptionItem,
89
+  supervisionProblemPosition,
90
+} from '@/api/portraitManagement/portraitManagement';
75 91
 
76 92
 const props = defineProps({
77 93
   queryParams: {
@@ -80,57 +96,114 @@ const props = defineProps({
80 96
   }
81 97
 })
82 98
 
83
-const chartsData = ref([
84
-  {
85
-    num: 370,
86
-    num1: 330,
87
-    num2: 120,
88
-    num3: 470,
89
-    num4: 570,
90
-    rate: 30,
91
-    name: '打火机'
92
-  },
93
-  {
94
-    num: 330,
95
-    num1: 430,
96
-    num2: 420,
97
-    num3: 430,
98
-    num4: 150,
99
-    rate: 60,
100
-    name: '火柴'
101
-  },
102
-  {
103
-    num: 410,
104
-    num1: 310,
105
-    num2: 220,
106
-    num3: 370,
107
-    num4: 510,
108
-    rate: 35,
109
-    name: '刀具'
110
-  },
111
-  {
112
-    num: 570,
113
-    num1: 440,
114
-    num2: 420,
115
-    num3: 410,
116
-    num4: 470,
117
-    rate: 80,
118
-    name: '充电宝'
119
-  },
120
-  {
121
-    num: 340,
122
-    num1: 330,
123
-    num2: 620,
124
-    num3: 370,
125
-    num4: 170,
126
-    rate: 60,
127
-    name: '烟火'
128
-  },
129
-])
99
+const channelCheckData = ref([])
100
+const invokerCountLanePeakThroughput = () => {
101
+  countLanePeakThroughput(props.queryParams).then(res => {
102
+    if (res.code === 200 && res.data) {
103
+      channelCheckData.value = res.data || []
104
+    }
105
+  })
106
+}
130 107
 
131
-const supervisionData = ref([])
132
-const interceptionData = ref([])
108
+const countSeizureInfoItemData = ref({ totalSeizeNum: 0, itemList: [] })
109
+const invokerCountSeizureInfoItem = () => {
110
+  countSeizureInfoItem(props.queryParams).then(res => {
111
+    if (res.code === 200 && res.data) {
112
+      countSeizureInfoItemData.value = res.data || { totalSeizeNum: 0, itemList: [] }
113
+    }
114
+  })
115
+}
116
+
117
+const countSeizeSubjectCategoryQuantityData = ref([])
118
+const invokerCountSeizeSubjectCategoryQuantity = () => {
119
+  countSeizeSubjectCategoryQuantity(props.queryParams).then(res => {
120
+    if (res.code === 200 && res.data) {
121
+      countSeizeSubjectCategoryQuantityData.value = res.data || []
122
+    }
123
+  })
124
+}
125
+
126
+const countSeizureTotalQuantityData = ref([])
127
+const invokerCountSeizureTotalQuantity = () => {
128
+  countSeizureTotalQuantity(props.queryParams).then(res => {
129
+    if (res.code === 200 && res.data) {
130
+      countSeizureTotalQuantityData.value = res.data || []
131
+    }
132
+  })
133
+}
134
+
135
+const countSeizureSingleQuantityData = ref([])
136
+const invokerCountSeizureSingleQuantity = () => {
137
+  countSeizureSingleQuantity(props.queryParams).then(res => {
138
+    if (res.code === 200 && res.data) {
139
+      countSeizureSingleQuantityData.value = res.data || []
140
+    }
141
+  })
142
+}
133 143
 
144
+const countSeizeAreaQuantityData = ref([])
145
+const invokerCountSeizeAreaQuantity = () => {
146
+  countSeizeAreaQuantity(props.queryParams).then(res => {
147
+    if (res.code === 200 && res.data) {
148
+      countSeizeAreaQuantityData.value = res.data || []
149
+    }
150
+  })
151
+}
152
+
153
+const countSeizureStatsItemData = ref([])
154
+const invokerCountSeizureStatsItem = () => {
155
+  countSeizureStatsItem(props.queryParams).then(res => {
156
+    if (res.code === 200 && res.data) {
157
+      countSeizureStatsItemData.value = res.data || []
158
+    }
159
+  })
160
+}
161
+const countSeizureStatsTypeData = ref([])
162
+const invokerCountSeizureStatsType = () => {
163
+  countSeizureStatsType(props.queryParams).then(res => {
164
+    if (res.code === 200 && res.data) {
165
+      countSeizureStatsTypeData.value = res.data || []
166
+    }
167
+  })
168
+}
169
+const countSeizureStatsPostData = ref([])
170
+const invokerCountSeizureStatsPost = () => {
171
+  countSeizureStatsPost(props.queryParams).then(res => {
172
+    if (res.code === 200 && res.data) {
173
+      countSeizureStatsPostData.value = res.data || []
174
+    }
175
+  })
176
+}
177
+
178
+const securityTestItemClassificationData = ref([])
179
+const invokerSecurityTestItemClassification = () => {
180
+  securityTestItemClassification(props.queryParams).then(res => {
181
+    if (res.code === 200 && res.data) {
182
+      securityTestItemClassificationData.value = res.data || []
183
+    }
184
+  })
185
+}
186
+
187
+const securityTestPassingStatusData = ref([])
188
+const invokerSecurityTestPassingStatus = () => {
189
+    securityTestPassingStatus(props.queryParams).then(res => {
190
+    if (res.code === 200 && res.data) {
191
+      securityTestPassingStatusData.value = res.data || []
192
+    }
193
+  })
194
+}
195
+const securityTestRegionData = ref([])
196
+const invokerSecurityTestRegion = () => {
197
+    securityTestRegion(props.queryParams).then(res => {
198
+    if (res.code === 200 && res.data) {
199
+      securityTestRegionData.value = res.data || []
200
+    }
201
+  })
202
+}
203
+
204
+
205
+
206
+const supervisionData = ref([])
134 207
 const fetchSupervisionData = async () => {
135 208
   try {
136 209
     const res = await supervisionProblemPosition(props.queryParams)
@@ -145,6 +218,7 @@ const fetchSupervisionData = async () => {
145 218
   }
146 219
 }
147 220
 
221
+const interceptionData = ref([])
148 222
 const fetchInterceptionData = async () => {
149 223
   try {
150 224
     const res = await realtimeInterceptionItem(props.queryParams)
@@ -160,10 +234,22 @@ const fetchInterceptionData = async () => {
160 234
 }
161 235
 
162 236
 const fetchData = () => {
237
+
238
+  invokerCountLanePeakThroughput()
239
+  invokerCountSeizureInfoItem()
240
+  invokerCountSeizeSubjectCategoryQuantity()
241
+  invokerCountSeizureTotalQuantity()
242
+  invokerCountSeizureSingleQuantity()
243
+  invokerCountSeizeAreaQuantity()
244
+  invokerCountSeizureStatsItem()
245
+  invokerCountSeizureStatsType()
246
+  invokerCountSeizureStatsPost()
247
+  invokerSecurityTestItemClassification()
248
+  invokerSecurityTestPassingStatus()
249
+  invokerSecurityTestRegion()
163 250
   fetchSupervisionData()
164 251
   fetchInterceptionData()
165 252
 }
166
-
167 253
 watch(() => props.queryParams, () => {
168 254
   fetchData()
169 255
 }, { deep: true, immediate: true })
@@ -178,10 +264,13 @@ watch(() => props.queryParams, () => {
178 264
     display: flex;
179 265
     column-gap: 15px;
180 266
     height: 360px;
267
+    width: 100%;
268
+    overflow: hidden;
181 269
     margin-bottom: 15px;
182 270
     .col {
183 271
       flex: 1;
184 272
       height: 100%;
273
+      min-width: 0px;
185 274
       :deep(.info-card) {
186 275
         height: 100%;
187 276
       }

+ 8 - 2
src/views/portraitManagement/deptProfile/index.vue

@@ -1,10 +1,10 @@
1 1
 <template>
2 2
   <div class="group-profile-page">
3 3
     <Page title="安检人事管理可视化大屏" :tabs="['能力画像', '运行数据']" @tab-change="handleTabChange">
4
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch" :deptType="'BRIGADE'"/>
4
+      <SearchBar v-model:visible="searchVisible" ref="searchBar" @search="handleSearch" :deptType="'BRIGADE'"/>
5 5
       <PentagonGroup :items="pentagonItems" />
6 6
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
7
-      <RunData v-else />
7
+      <RunData v-else :query-params="queryParams"/>
8 8
     </Page>
9 9
 
10 10
   </div>
@@ -163,6 +163,12 @@ const handleSearch = (params) => {
163 163
 const handleTabChange = (index) => {
164 164
   activeTab.value = index
165 165
 }
166
+
167
+const searchBar = ref(null)
168
+onMounted(() => {
169
+  queryParams.value = Object.assign({ deptId: '' }, searchBar.value.getDefQuery())
170
+})
171
+
166 172
 </script>
167 173
 
168 174
 <style lang="scss" scoped>

+ 152 - 63
src/views/portraitManagement/groupProfile/component/runData.vue

@@ -1,47 +1,47 @@
1 1
 <template>
2 2
   <div class="operation-data">
3 3
     <div class="row">
4
-      <ChannelCheckChart :chartsData="chartsData" />
4
+      <ChannelCheckChart :chartsData="channelCheckData" />
5 5
     </div>
6 6
     <div class="row">
7 7
       <div class="col">
8
-        <SeizedInfo :chartsData="chartsData"/>
8
+        <SeizedInfo :chartsData="countSeizureInfoItemData"/>
9 9
       </div>
10 10
       <div class="col">
11
-        <SeizedItems :chartsData="chartsData" />
11
+        <SeizedItems :chartsData="countSeizeSubjectCategoryQuantityData" />
12 12
       </div>
13 13
     </div>
14 14
     <div class="row">
15 15
       <div class="col">
16
-        <SeizedNumAll :chartsData="chartsData"/>
16
+        <SeizedNumAll :chartsData="countSeizureTotalQuantityData"/>
17 17
       </div>
18 18
       <div class="col">
19
-        <SeizedNum :chartsData="chartsData" />
19
+        <SeizedNum :chartsData="countSeizureSingleQuantityData" />
20 20
       </div>
21 21
     </div>
22 22
     <div class="row">
23
-      <SeizedWorkArea :chartsData="chartsData" />
23
+      <SeizedWorkArea :chartsData="countSeizeAreaQuantityData" />
24 24
     </div>
25 25
     <div class="row">
26 26
       <div class="col">
27
-        <EventItems :chartsData="chartsData"  />
27
+        <EventItems :chartsData="countSeizureStatsItemData"  />
28 28
       </div>
29 29
       <div class="col">
30
-        <EventType :chartsData="chartsData"  />
30
+        <EventType :chartsData="countSeizureStatsTypeData"  />
31 31
       </div>
32 32
       <div class="col">
33
-        <EventWorkArea :chartsData="chartsData"  />
33
+        <EventWorkArea :chartsData="countSeizureStatsPostData"  />
34 34
       </div>
35 35
     </div>
36 36
     <div class="row">
37 37
       <div class="col">
38
-        <TestItems :chartsData="chartsData"  />
38
+        <TestItems :chartsData="securityTestItemClassificationData"  />
39 39
       </div>
40 40
       <div class="col">
41
-        <TestResult :chartsData="chartsData"  />
41
+        <TestResult :chartsData="securityTestPassingStatusData"  />
42 42
       </div>
43 43
       <div class="col">
44
-        <TestArea :chartsData="chartsData"  />
44
+        <TestArea :chartsData="securityTestRegionData"  />
45 45
       </div>
46 46
     </div>
47 47
     <div class="row">
@@ -71,7 +71,22 @@ import TestResult from '../../components/TestResult.vue';
71 71
 import TestArea from '../../components/TestArea.vue';
72 72
 import SupervisionDistribution from '../../components/SupervisionDistribution.vue';
73 73
 import InterceptionDistribution from '../../components/InterceptionDistribution.vue';
74
-import { realtimeInterceptionItem, supervisionProblemPosition } from '@/api/portraitManagement/portraitManagement';
74
+import { 
75
+  countLanePeakThroughput,
76
+  countSeizureInfoItem,
77
+  countSeizeSubjectCategoryQuantity,
78
+  countSeizureTotalQuantity,
79
+  countSeizureSingleQuantity,
80
+  countSeizeAreaQuantity,
81
+  countSeizureStatsItem,
82
+  countSeizureStatsType,
83
+  countSeizureStatsPost,
84
+  securityTestItemClassification,
85
+  securityTestPassingStatus,
86
+  securityTestRegion,
87
+  realtimeInterceptionItem,
88
+  supervisionProblemPosition,
89
+} from '@/api/portraitManagement/portraitManagement';
75 90
 
76 91
 const props = defineProps({
77 92
   queryParams: {
@@ -80,57 +95,115 @@ const props = defineProps({
80 95
   }
81 96
 })
82 97
 
83
-const chartsData = ref([
84
-  {
85
-    num: 370,
86
-    num1: 330,
87
-    num2: 120,
88
-    num3: 470,
89
-    num4: 570,
90
-    rate: 30,
91
-    name: '打火机'
92
-  },
93
-  {
94
-    num: 330,
95
-    num1: 430,
96
-    num2: 420,
97
-    num3: 430,
98
-    num4: 150,
99
-    rate: 60,
100
-    name: '火柴'
101
-  },
102
-  {
103
-    num: 410,
104
-    num1: 310,
105
-    num2: 220,
106
-    num3: 370,
107
-    num4: 510,
108
-    rate: 35,
109
-    name: '刀具'
110
-  },
111
-  {
112
-    num: 570,
113
-    num1: 440,
114
-    num2: 420,
115
-    num3: 410,
116
-    num4: 470,
117
-    rate: 80,
118
-    name: '充电宝'
119
-  },
120
-  {
121
-    num: 340,
122
-    num1: 330,
123
-    num2: 620,
124
-    num3: 370,
125
-    num4: 170,
126
-    rate: 60,
127
-    name: '烟火'
128
-  },
129
-])
130 98
 
131
-const supervisionData = ref([])
132
-const interceptionData = ref([])
99
+const channelCheckData = ref([])
100
+const invokerCountLanePeakThroughput = () => {
101
+  countLanePeakThroughput(props.queryParams).then(res => {
102
+    if (res.code === 200 && res.data) {
103
+      channelCheckData.value = res.data || []
104
+    }
105
+  })
106
+}
107
+
108
+const countSeizureInfoItemData = ref({ totalSeizeNum: 0, itemList: [] })
109
+const invokerCountSeizureInfoItem = () => {
110
+  countSeizureInfoItem(props.queryParams).then(res => {
111
+    if (res.code === 200 && res.data) {
112
+      countSeizureInfoItemData.value = res.data || { totalSeizeNum: 0, itemList: [] }
113
+    }
114
+  })
115
+}
116
+
117
+const countSeizeSubjectCategoryQuantityData = ref([])
118
+const invokerCountSeizeSubjectCategoryQuantity = () => {
119
+  countSeizeSubjectCategoryQuantity(props.queryParams).then(res => {
120
+    if (res.code === 200 && res.data) {
121
+      countSeizeSubjectCategoryQuantityData.value = res.data || []
122
+    }
123
+  })
124
+}
125
+
126
+const countSeizureTotalQuantityData = ref([])
127
+const invokerCountSeizureTotalQuantity = () => {
128
+  countSeizureTotalQuantity(props.queryParams).then(res => {
129
+    if (res.code === 200 && res.data) {
130
+      countSeizureTotalQuantityData.value = res.data || []  
131
+    }
132
+  })
133
+}
134
+
135
+const countSeizureSingleQuantityData = ref([])
136
+const invokerCountSeizureSingleQuantity = () => {
137
+  countSeizureSingleQuantity(props.queryParams).then(res => {
138
+    if (res.code === 200 && res.data) {
139
+      countSeizureSingleQuantityData.value = res.data || []
140
+    }
141
+  })
142
+}
143
+
144
+const countSeizeAreaQuantityData = ref([])
145
+const invokerCountSeizeAreaQuantity = () => {
146
+  countSeizeAreaQuantity(props.queryParams).then(res => {
147
+    if (res.code === 200 && res.data) {
148
+      countSeizeAreaQuantityData.value = res.data || []
149
+    }
150
+  })
151
+}
152
+
153
+const countSeizureStatsItemData = ref([])
154
+const invokerCountSeizureStatsItem = () => {
155
+  countSeizureStatsItem(props.queryParams).then(res => {
156
+    if (res.code === 200 && res.data) {
157
+      countSeizureStatsItemData.value = res.data || []
158
+    }
159
+  })
160
+}
161
+const countSeizureStatsTypeData = ref([])
162
+const invokerCountSeizureStatsType = () => {
163
+  countSeizureStatsType(props.queryParams).then(res => {
164
+    if (res.code === 200 && res.data) {
165
+      countSeizureStatsTypeData.value = res.data || []
166
+    }
167
+  })
168
+}
169
+const countSeizureStatsPostData = ref([])
170
+const invokerCountSeizureStatsPost = () => {
171
+  countSeizureStatsPost(props.queryParams).then(res => {
172
+    if (res.code === 200 && res.data) {
173
+      countSeizureStatsPostData.value = res.data || []
174
+    }
175
+  })
176
+}
177
+
178
+const securityTestItemClassificationData = ref([])
179
+const invokerSecurityTestItemClassification = () => {
180
+  securityTestItemClassification(props.queryParams).then(res => {
181
+    if (res.code === 200 && res.data) {
182
+      securityTestItemClassificationData.value = res.data || []
183
+    }
184
+  })
185
+}
133 186
 
187
+const securityTestPassingStatusData = ref([])
188
+const invokerSecurityTestPassingStatus = () => {
189
+    securityTestPassingStatus(props.queryParams).then(res => {
190
+    if (res.code === 200 && res.data) {
191
+      securityTestPassingStatusData.value = res.data || []
192
+    }
193
+  })
194
+}
195
+const securityTestRegionData = ref([])
196
+const invokerSecurityTestRegion = () => {
197
+    securityTestRegion(props.queryParams).then(res => {
198
+    if (res.code === 200 && res.data) {
199
+      securityTestRegionData.value = res.data || []
200
+    }
201
+  })
202
+}
203
+
204
+
205
+
206
+const supervisionData = ref([])
134 207
 const fetchSupervisionData = async () => {
135 208
   try {
136 209
     const res = await supervisionProblemPosition(props.queryParams)
@@ -145,6 +218,7 @@ const fetchSupervisionData = async () => {
145 218
   }
146 219
 }
147 220
 
221
+const interceptionData = ref([])
148 222
 const fetchInterceptionData = async () => {
149 223
   try {
150 224
     const res = await realtimeInterceptionItem(props.queryParams)
@@ -160,10 +234,22 @@ const fetchInterceptionData = async () => {
160 234
 }
161 235
 
162 236
 const fetchData = () => {
237
+
238
+  invokerCountLanePeakThroughput()
239
+  invokerCountSeizureInfoItem()
240
+  invokerCountSeizeSubjectCategoryQuantity()
241
+  invokerCountSeizureTotalQuantity()
242
+  invokerCountSeizureSingleQuantity()
243
+  invokerCountSeizeAreaQuantity()
244
+  invokerCountSeizureStatsItem()
245
+  invokerCountSeizureStatsType()
246
+  invokerCountSeizureStatsPost()
247
+  invokerSecurityTestItemClassification()
248
+  invokerSecurityTestPassingStatus()
249
+  invokerSecurityTestRegion()
163 250
   fetchSupervisionData()
164 251
   fetchInterceptionData()
165 252
 }
166
-
167 253
 watch(() => props.queryParams, () => {
168 254
   fetchData()
169 255
 }, { deep: true, immediate: true })
@@ -178,10 +264,13 @@ watch(() => props.queryParams, () => {
178 264
     display: flex;
179 265
     column-gap: 15px;
180 266
     height: 360px;
267
+    width: 100%;
268
+    overflow: hidden;
181 269
     margin-bottom: 15px;
182 270
     .col {
183 271
       flex: 1;
184 272
       height: 100%;
273
+      min-width: 0px;
185 274
       :deep(.info-card) {
186 275
         height: 100%;
187 276
       }

+ 12 - 5
src/views/portraitManagement/groupProfile/index.vue

@@ -1,7 +1,9 @@
1 1
 <template>
2 2
   <div class="group-profile-page">
3 3
     <Page title="安检人事管理可视化大屏" :tabs="['能力画像', '运行数据']" @tab-change="handleTabChange">
4
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch"  :deptType="'TEAMS'" />
4
+      <div style="margin-bottom: 30px;">
5
+        <SearchBar v-model:visible="searchVisible" ref="searchBar" @search="handleSearch"  :deptType="'TEAMS'" />
6
+      </div>
5 7
       <PentagonGroup :items="pentagonItems" />
6 8
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
7 9
       <RunData v-else :query-params="queryParams"/>
@@ -11,7 +13,7 @@
11 13
 </template>
12 14
 
13 15
 <script setup>
14
-import { ref } from 'vue'
16
+import { ref, computed, onMounted } from 'vue'
15 17
 import Page from '../components/page.vue'
16 18
 import SearchBar from '../components/SearchBar.vue'
17 19
 import Profile from './component/profile.vue'
@@ -27,7 +29,7 @@ const activeTab = ref(0)
27 29
 const searchVisible = ref(false)
28 30
 const queryParams = ref({})
29 31
 
30
-const pentagonItems = ref([
32
+const pentagonItems = computed(() => [
31 33
   {
32 34
     value: '88',
33 35
     label: '综合得分',
@@ -74,7 +76,7 @@ const pentagonItems = ref([
74 76
     bgGradientEnd: 'rgba(15,70,250,0.2)'
75 77
   },
76 78
   {
77
-    value: '周游波小组',
79
+    value: groupName.value,
78 80
     label: '',
79 81
     iconPath: zu02Icon,
80 82
     iconStyle: {
@@ -155,7 +157,7 @@ const pentagonItems = ref([
155 157
     bgGradientEnd: 'rgba(15,70,250,0.2)'
156 158
   }
157 159
 ])
158
-
160
+const groupName = ref('')
159 161
 const handleSearch = (params) => {
160 162
   queryParams.value = params
161 163
 }
@@ -163,6 +165,11 @@ const handleSearch = (params) => {
163 165
 const handleTabChange = (index) => {
164 166
   activeTab.value = index
165 167
 }
168
+const searchBar = ref(null)
169
+onMounted(() => {
170
+  queryParams.value = Object.assign({ groupId: '' }, searchBar.value.getDefQuery())
171
+})
172
+
166 173
 </script>
167 174
 
168 175
 <style lang="scss" scoped>

+ 121 - 48
src/views/portraitManagement/stationProfile/component/runData.vue

@@ -42,12 +42,12 @@
42 42
     </div>
43 43
 
44 44
     <div class="content-row">
45
-      <SeizedInfo :chartsData="seizedInfoData" />
46
-      <SeizedItems :chartsData="seizedItemsData" />
45
+      <SeizedInfo :chartsData="countSeizureInfoItemData" />
46
+      <SeizedItems :chartsData="countSeizeSubjectCategoryQuantityData" />
47 47
     </div>
48 48
 
49 49
     <div class="content-row">
50
-      <SeizedNumAll :chartsData="seizedNumAllData" />
50
+      <SeizedNumAll :chartsData="countSeizureTotalQuantityData" />
51 51
       <InfoCard title="每日查获数量(部门对比)">
52 52
         <div ref="dailySeizedAreaRef" class="daily-chart"></div>
53 53
       </InfoCard>
@@ -56,19 +56,19 @@
56 56
 
57 57
 
58 58
     <div class="content-row">
59
-      <SeizedWorkArea :chartsData="workAreaDistData" />
59
+      <SeizedWorkArea :chartsData="countSeizeAreaQuantityData" />
60 60
     </div>
61 61
 
62 62
     <div class="content-row">
63
-      <EventItems :chartsData="unsafeItemDistData" />
64
-      <EventType :chartsData="unsafeTypeDistData" />
65
-      <EventWorkArea :chartsData="unsafePostDistData" />
63
+      <EventItems :chartsData="countSeizureStatsItemData" />
64
+      <EventType :chartsData="countSeizureStatsTypeData" />
65
+      <EventWorkArea :chartsData="countSeizureStatsPostData" />
66 66
     </div>
67 67
 
68 68
     <div class="content-row">
69
-      <TestItems :chartsData="securityTestItemData" />
70
-      <TestResult :chartsData="securityTestPassData" />
71
-      <TestArea :chartsData="securityTestAreaData" />
69
+      <TestItems :chartsData="securityTestItemClassificationData" />
70
+      <TestResult :chartsData="securityTestPassingStatusData" />
71
+      <TestArea :chartsData="securityTestRegionData" />
72 72
     </div>
73 73
   </div>
74 74
 </template>
@@ -87,7 +87,20 @@ import EventWorkArea from '../../components/EventWorkArea.vue'
87 87
 import TestItems from '../../components/TestItems.vue'
88 88
 import TestResult from '../../components/TestResult.vue'
89 89
 import TestArea from '../../components/TestArea.vue'
90
-import { securityTestItemClassification, securityTestPassingStatus, securityTestRegion } from '@/api/portraitManagement/portraitManagement'
90
+import {
91
+  countSeizureInfoItem,
92
+  countSeizeSubjectCategoryQuantity,
93
+  countSeizureTotalQuantity,
94
+  countSeizureSingleQuantity,
95
+  countSeizeAreaQuantity,
96
+  countSeizureStatsItem,
97
+  countSeizureStatsType,
98
+  countSeizureStatsPost,
99
+  securityTestItemClassification,
100
+  securityTestPassingStatus,
101
+  securityTestRegion,
102
+
103
+} from '@/api/portraitManagement/portraitManagement'
91 104
 
92 105
 const props = defineProps({
93 106
   queryParams: {
@@ -141,57 +154,117 @@ const seizedInfoData = [
141 154
   { num: 481 }
142 155
 ]
143 156
 
144
-const seizedItemsData = ref([])
145
-const securityTestItemData = ref([])
146 157
 
147
-const fetchSeizedItemsData = async () => {
148
-  try {
149
-    const res = await securityTestItemClassification(props.queryParams)
158
+const countSeizureInfoItemData = ref({ totalSeizeNum: 0, itemList: [] })
159
+const invokerCountSeizureInfoItem = () => {
160
+  countSeizureInfoItem(props.queryParams).then(res => {
150 161
     if (res.code === 200 && res.data) {
151
-      securityTestItemData.value = res.data.map(item => ({
152
-        num: item.total,
153
-        name: item.name
154
-      }))
162
+      countSeizureInfoItemData.value = res.data || { totalSeizeNum: 0, itemList: [] }
155 163
     }
156
-  } catch (error) {
157
-    console.error('获取安保测试物品分类数据失败', error)
158
-  }
164
+  })
159 165
 }
160
-const securityTestPassData = ref([])
161
-const securityTestAreaData = ref([])
162 166
 
163
-const fetchSecurityTestPassData = async () => {
164
-  try {
165
-    const res = await securityTestPassingStatus(props.queryParams)
167
+const countSeizeSubjectCategoryQuantityData = ref([])
168
+const invokerCountSeizeSubjectCategoryQuantity = () => {
169
+  countSeizeSubjectCategoryQuantity(props.queryParams).then(res => {
166 170
     if (res.code === 200 && res.data) {
167
-      securityTestPassData.value = res.data.map(item => ({
168
-        num: item.total,
169
-        name: item.name
170
-      }))
171
+      countSeizeSubjectCategoryQuantityData.value = res.data || []
171 172
     }
172
-  } catch (error) {
173
-    console.error('获取安保测试通过情况数据失败', error)
174
-  }
173
+  })
175 174
 }
176 175
 
177
-const fetchSecurityTestAreaData = async () => {
178
-  try {
179
-    const res = await securityTestRegion(props.queryParams)
176
+const countSeizureTotalQuantityData = ref([])
177
+const invokerCountSeizureTotalQuantity = () => {
178
+  countSeizureTotalQuantity(props.queryParams).then(res => {
180 179
     if (res.code === 200 && res.data) {
181
-      securityTestAreaData.value = res.data.map(item => ({
182
-        num: item.total,
183
-        name: item.name
184
-      }))
180
+      countSeizureTotalQuantityData.value = res.data || []
185 181
     }
186
-  } catch (error) {
187
-    console.error('获取安保测试区域情况数据失败', error)
188
-  }
182
+  })
189 183
 }
190 184
 
185
+const countSeizureSingleQuantityData = ref([])
186
+const invokerCountSeizureSingleQuantity = () => {
187
+  countSeizureSingleQuantity(props.queryParams).then(res => {
188
+    if (res.code === 200 && res.data) {
189
+      countSeizureSingleQuantityData.value = res.data || []
190
+    }
191
+  })
192
+}
193
+
194
+const countSeizeAreaQuantityData = ref([])
195
+const invokerCountSeizeAreaQuantity = () => {
196
+  countSeizeAreaQuantity(props.queryParams).then(res => {
197
+    if (res.code === 200 && res.data) {
198
+      countSeizeAreaQuantityData.value = res.data || []
199
+    }
200
+  })
201
+}
202
+
203
+const countSeizureStatsItemData = ref([])
204
+const invokerCountSeizureStatsItem = () => {
205
+  countSeizureStatsItem(props.queryParams).then(res => {
206
+    if (res.code === 200 && res.data) {
207
+      countSeizureStatsItemData.value = res.data || []
208
+    }
209
+  })
210
+}
211
+const countSeizureStatsTypeData = ref([])
212
+const invokerCountSeizureStatsType = () => {
213
+  countSeizureStatsType(props.queryParams).then(res => {
214
+    if (res.code === 200 && res.data) {
215
+      countSeizureStatsTypeData.value = res.data || []
216
+    }
217
+  })
218
+}
219
+const countSeizureStatsPostData = ref([])
220
+const invokerCountSeizureStatsPost = () => {
221
+  countSeizureStatsPost(props.queryParams).then(res => {
222
+    if (res.code === 200 && res.data) {
223
+      countSeizureStatsPostData.value = res.data || []
224
+    }
225
+  })
226
+}
227
+
228
+const securityTestItemClassificationData = ref([])
229
+const invokerSecurityTestItemClassification = () => {
230
+  securityTestItemClassification(props.queryParams).then(res => {
231
+    if (res.code === 200 && res.data) {
232
+      securityTestItemClassificationData.value = res.data || []
233
+    }
234
+  })
235
+}
236
+
237
+const securityTestPassingStatusData = ref([])
238
+const invokerSecurityTestPassingStatus = () => {
239
+    securityTestPassingStatus(props.queryParams).then(res => {
240
+    if (res.code === 200 && res.data) {
241
+      securityTestPassingStatusData.value = res.data || []
242
+    }
243
+  })
244
+}
245
+const securityTestRegionData = ref([])
246
+const invokerSecurityTestRegion = () => {
247
+    securityTestRegion(props.queryParams).then(res => {
248
+    if (res.code === 200 && res.data) {
249
+      securityTestRegionData.value = res.data || []
250
+    }
251
+  })
252
+}
253
+
254
+
255
+
191 256
 const fetchData = () => {
192
-  fetchSeizedItemsData()
193
-  fetchSecurityTestPassData()
194
-  fetchSecurityTestAreaData()
257
+  invokerCountSeizureInfoItem()
258
+  invokerCountSeizeSubjectCategoryQuantity()
259
+  invokerCountSeizureTotalQuantity()
260
+  invokerCountSeizureSingleQuantity()
261
+  invokerCountSeizeAreaQuantity()
262
+  invokerCountSeizureStatsItem()
263
+  invokerCountSeizureStatsType()
264
+  invokerCountSeizureStatsPost()
265
+  invokerSecurityTestItemClassification()
266
+  invokerSecurityTestPassingStatus()
267
+  invokerSecurityTestRegion()
195 268
 }
196 269
 
197 270
 watch(() => props.queryParams, () => {

+ 153 - 63
src/views/portraitManagement/teamProfile/component/runData.vue

@@ -1,47 +1,47 @@
1 1
 <template>
2 2
   <div class="operation-data">
3 3
     <div class="row">
4
-      <ChannelCheckChart :chartsData="chartsData" />
4
+      <ChannelCheckChart :chartsData="channelCheckData" />
5 5
     </div>
6 6
     <div class="row">
7 7
       <div class="col">
8
-        <SeizedInfo :chartsData="chartsData"/>
8
+        <SeizedInfo :chartsData="countSeizureInfoItemData"/>
9 9
       </div>
10 10
       <div class="col">
11
-        <SeizedItems :chartsData="chartsData" />
11
+        <SeizedItems :chartsData="countSeizeSubjectCategoryQuantityData" />
12 12
       </div>
13 13
     </div>
14 14
     <div class="row">
15 15
       <div class="col">
16
-        <SeizedNumAll :chartsData="chartsData"/>
16
+        <SeizedNumAll :chartsData="countSeizureTotalQuantityData"/>
17 17
       </div>
18 18
       <div class="col">
19
-        <SeizedNum :chartsData="chartsData" />
19
+        <SeizedNum :chartsData="countSeizureSingleQuantityData" />
20 20
       </div>
21 21
     </div>
22 22
     <div class="row">
23
-      <SeizedWorkArea :chartsData="chartsData" />
23
+      <SeizedWorkArea :chartsData="countSeizeAreaQuantityData" />
24 24
     </div>
25 25
     <div class="row">
26 26
       <div class="col">
27
-        <EventItems :chartsData="chartsData"  />
27
+        <EventItems :chartsData="countSeizureStatsItemData"  />
28 28
       </div>
29 29
       <div class="col">
30
-        <EventType :chartsData="chartsData"  />
30
+        <EventType :chartsData="countSeizureStatsTypeData"  />
31 31
       </div>
32 32
       <div class="col">
33
-        <EventWorkArea :chartsData="chartsData"  />
33
+        <EventWorkArea :chartsData="countSeizureStatsPostData"  />
34 34
       </div>
35 35
     </div>
36 36
     <div class="row">
37 37
       <div class="col">
38
-        <TestItems :chartsData="chartsData"  />
38
+        <TestItems :chartsData="securityTestItemClassificationData"  />
39 39
       </div>
40 40
       <div class="col">
41
-        <TestResult :chartsData="chartsData"  />
41
+        <TestResult :chartsData="securityTestPassingStatusData"  />
42 42
       </div>
43 43
       <div class="col">
44
-        <TestArea :chartsData="chartsData"  />
44
+        <TestArea :chartsData="securityTestRegionData"  />
45 45
       </div>
46 46
     </div>
47 47
     <div class="row">
@@ -71,7 +71,23 @@ import TestResult from '../../components/TestResult.vue';
71 71
 import TestArea from '../../components/TestArea.vue';
72 72
 import SupervisionDistribution from '../../components/SupervisionDistribution.vue';
73 73
 import InterceptionDistribution from '../../components/InterceptionDistribution.vue';
74
-import { realtimeInterceptionItem, supervisionProblemPosition } from '@/api/portraitManagement/portraitManagement';
74
+import { 
75
+  countLanePeakThroughput,
76
+  countStationHourlyThroughput,
77
+  countSeizureInfoItem,
78
+  countSeizeSubjectCategoryQuantity,
79
+  countSeizureTotalQuantity,
80
+  countSeizureSingleQuantity,
81
+  countSeizeAreaQuantity,
82
+  countSeizureStatsItem,
83
+  countSeizureStatsType,
84
+  countSeizureStatsPost,
85
+  securityTestItemClassification,
86
+  securityTestPassingStatus,
87
+  securityTestRegion,
88
+  realtimeInterceptionItem,
89
+  supervisionProblemPosition,
90
+} from '@/api/portraitManagement/portraitManagement';
75 91
 
76 92
 const props = defineProps({
77 93
   queryParams: {
@@ -80,57 +96,115 @@ const props = defineProps({
80 96
   }
81 97
 })
82 98
 
83
-const chartsData = ref([
84
-  {
85
-    num: 370,
86
-    num1: 330,
87
-    num2: 120,
88
-    num3: 470,
89
-    num4: 570,
90
-    rate: 30,
91
-    name: '打火机'
92
-  },
93
-  {
94
-    num: 330,
95
-    num1: 430,
96
-    num2: 420,
97
-    num3: 430,
98
-    num4: 150,
99
-    rate: 60,
100
-    name: '火柴'
101
-  },
102
-  {
103
-    num: 410,
104
-    num1: 310,
105
-    num2: 220,
106
-    num3: 370,
107
-    num4: 510,
108
-    rate: 35,
109
-    name: '刀具'
110
-  },
111
-  {
112
-    num: 570,
113
-    num1: 440,
114
-    num2: 420,
115
-    num3: 410,
116
-    num4: 470,
117
-    rate: 80,
118
-    name: '充电宝'
119
-  },
120
-  {
121
-    num: 340,
122
-    num1: 330,
123
-    num2: 620,
124
-    num3: 370,
125
-    num4: 170,
126
-    rate: 60,
127
-    name: '烟火'
128
-  },
129
-])
130 99
 
131
-const supervisionData = ref([])
132
-const interceptionData = ref([])
100
+const channelCheckData = ref([])
101
+const invokerCountLanePeakThroughput = () => {
102
+  countLanePeakThroughput(props.queryParams).then(res => {
103
+    if (res.code === 200 && res.data) {
104
+      channelCheckData.value = res.data || []
105
+    }
106
+  })
107
+}
108
+
109
+const countSeizureInfoItemData = ref({ totalSeizeNum: 0, itemList: [] })
110
+const invokerCountSeizureInfoItem = () => {
111
+  countSeizureInfoItem(props.queryParams).then(res => {
112
+    if (res.code === 200 && res.data) {
113
+      countSeizureInfoItemData.value = res.data || { totalSeizeNum: 0, itemList: [] }
114
+    }
115
+  })
116
+}
117
+
118
+const countSeizeSubjectCategoryQuantityData = ref([])
119
+const invokerCountSeizeSubjectCategoryQuantity = () => {
120
+  countSeizeSubjectCategoryQuantity(props.queryParams).then(res => {
121
+    if (res.code === 200 && res.data) {
122
+      countSeizeSubjectCategoryQuantityData.value = res.data || []
123
+    }
124
+  })
125
+}
126
+
127
+const countSeizureTotalQuantityData = ref([])
128
+const invokerCountSeizureTotalQuantity = () => {
129
+  countSeizureTotalQuantity(props.queryParams).then(res => {
130
+    if (res.code === 200 && res.data) {
131
+      countSeizureTotalQuantityData.value = res.data || []
132
+    }
133
+  })
134
+}
135
+
136
+const countSeizureSingleQuantityData = ref([])
137
+const invokerCountSeizureSingleQuantity = () => {
138
+  countSeizureSingleQuantity(props.queryParams).then(res => {
139
+    if (res.code === 200 && res.data) {
140
+      countSeizureSingleQuantityData.value = res.data || []
141
+    }
142
+  })
143
+}
144
+
145
+const countSeizeAreaQuantityData = ref([])
146
+const invokerCountSeizeAreaQuantity = () => {
147
+  countSeizeAreaQuantity(props.queryParams).then(res => {
148
+    if (res.code === 200 && res.data) {
149
+      countSeizeAreaQuantityData.value = res.data || []
150
+    }
151
+  })
152
+}
153
+
154
+const countSeizureStatsItemData = ref([])
155
+const invokerCountSeizureStatsItem = () => {
156
+  countSeizureStatsItem(props.queryParams).then(res => {
157
+    if (res.code === 200 && res.data) {
158
+      countSeizureStatsItemData.value = res.data || []
159
+    }
160
+  })
161
+}
162
+const countSeizureStatsTypeData = ref([])
163
+const invokerCountSeizureStatsType = () => {
164
+  countSeizureStatsType(props.queryParams).then(res => {
165
+    if (res.code === 200 && res.data) {
166
+      countSeizureStatsTypeData.value = res.data || []
167
+    }
168
+  })
169
+}
170
+const countSeizureStatsPostData = ref([])
171
+const invokerCountSeizureStatsPost = () => {
172
+  countSeizureStatsPost(props.queryParams).then(res => {
173
+    if (res.code === 200 && res.data) {
174
+      countSeizureStatsPostData.value = res.data || []
175
+    }
176
+  })
177
+}
178
+
179
+const securityTestItemClassificationData = ref([])
180
+const invokerSecurityTestItemClassification = () => {
181
+  securityTestItemClassification(props.queryParams).then(res => {
182
+    if (res.code === 200 && res.data) {
183
+      securityTestItemClassificationData.value = res.data || []
184
+    }
185
+  })
186
+}
133 187
 
188
+const securityTestPassingStatusData = ref([])
189
+const invokerSecurityTestPassingStatus = () => {
190
+    securityTestPassingStatus(props.queryParams).then(res => {
191
+    if (res.code === 200 && res.data) {
192
+      securityTestPassingStatusData.value = res.data || []
193
+    }
194
+  })
195
+}
196
+const securityTestRegionData = ref([])
197
+const invokerSecurityTestRegion = () => {
198
+    securityTestRegion(props.queryParams).then(res => {
199
+    if (res.code === 200 && res.data) {
200
+      securityTestRegionData.value = res.data || []
201
+    }
202
+  })
203
+}
204
+
205
+
206
+
207
+const supervisionData = ref([])
134 208
 const fetchSupervisionData = async () => {
135 209
   try {
136 210
     const res = await supervisionProblemPosition(props.queryParams)
@@ -145,6 +219,7 @@ const fetchSupervisionData = async () => {
145 219
   }
146 220
 }
147 221
 
222
+const interceptionData = ref([])
148 223
 const fetchInterceptionData = async () => {
149 224
   try {
150 225
     const res = await realtimeInterceptionItem(props.queryParams)
@@ -160,10 +235,22 @@ const fetchInterceptionData = async () => {
160 235
 }
161 236
 
162 237
 const fetchData = () => {
238
+
239
+  invokerCountLanePeakThroughput()
240
+  invokerCountSeizureInfoItem()
241
+  invokerCountSeizeSubjectCategoryQuantity()
242
+  invokerCountSeizureTotalQuantity()
243
+  invokerCountSeizureSingleQuantity()
244
+  invokerCountSeizeAreaQuantity()
245
+  invokerCountSeizureStatsItem()
246
+  invokerCountSeizureStatsType()
247
+  invokerCountSeizureStatsPost()
248
+  invokerSecurityTestItemClassification()
249
+  invokerSecurityTestPassingStatus()
250
+  invokerSecurityTestRegion()
163 251
   fetchSupervisionData()
164 252
   fetchInterceptionData()
165 253
 }
166
-
167 254
 watch(() => props.queryParams, () => {
168 255
   fetchData()
169 256
 }, { deep: true, immediate: true })
@@ -178,10 +265,13 @@ watch(() => props.queryParams, () => {
178 265
     display: flex;
179 266
     column-gap: 15px;
180 267
     height: 360px;
268
+    width: 100%;
269
+    overflow: hidden;
181 270
     margin-bottom: 15px;
182 271
     .col {
183 272
       flex: 1;
184 273
       height: 100%;
274
+      min-width: 0px;
185 275
       :deep(.info-card) {
186 276
         height: 100%;
187 277
       }

+ 8 - 2
src/views/portraitManagement/teamProfile/index.vue

@@ -1,10 +1,10 @@
1 1
 <template>
2 2
   <div class="group-profile-page">
3 3
     <Page title="安检人事管理可视化大屏" :tabs="['能力画像', '运行数据']" @tab-change="handleTabChange">
4
-      <SearchBar v-model:visible="searchVisible" @search="handleSearch" :deptType="'MANAGER'"/>
4
+      <SearchBar v-model:visible="searchVisible" ref="searchBar" @search="handleSearch" :deptType="'MANAGER'"/>
5 5
       <PentagonGroup :items="pentagonItems" />
6 6
       <Profile v-if="activeTab === 0" :query-params="queryParams" />
7
-      <RunData v-else />
7
+      <RunData v-else :query-params="queryParams"/>
8 8
     </Page>
9 9
 
10 10
   </div>
@@ -163,6 +163,12 @@ const handleSearch = (params) => {
163 163
 const handleTabChange = (index) => {
164 164
   activeTab.value = index
165 165
 }
166
+
167
+const searchBar = ref(null)
168
+onMounted(() => {
169
+  queryParams.value = Object.assign({ teamId: '' }, searchBar.value.getDefQuery())
170
+})
171
+
166 172
 </script>
167 173
 
168 174
 <style lang="scss" scoped>