feat:完善首页 景区功能

src/views/scenic/components/box-1.vue

@@ -5,7 +5,7 @@
         <img src="@/assets/images/ticket.png" />
         <div
           class="header__left-item"
-          v-for="(item, index) in scenicStore.scenicSpotData"
+          v-for="(item, index) in scenicStore.scenicSpotData.data"
           :key="index"
         >
           <div class="label">{{ item.name }}</div>
@@ -13,22 +13,9 @@
         </div>
       </div>
       <div>
-        <div>
-          <div class="label">游览舒适度</div>
-          <p class="value">舒适</p>
-        </div>
-        <div>
-          <div class="label">景区安全</div>
-          <p class="value">安全</p>
-        </div>
-
-        <div>
-          <div class="label">通景交通</div>
-          <p class="value">畅通</p>
-        </div>
-        <div>
-          <div class="label">停车场负荷度</div>
-          <p class="value">空闲</p>
+        <div v-for="(item, index) in scenicStore.scenicSpotData.infoList" :key="index">
+          <div class="label">{{ item.name }}</div>
+          <p class="value" :class="{ error: item.type == 4 }">{{ item.value }}</p>
         </div>
       </div>
     </div>

src/views/scenic/components/box-2.vue

@@ -4,11 +4,6 @@
       <div class="box mr-8">
         <Title1 title="排队信息" />
         <div class="count-box flex justify-between">
-          <!--          <count-item-->
-          <!--            label="今日出票"-->
-          <!--            :count="scenicStore.scenicQueueData.header.jrcp"-->
-          <!--            suffix="张"-->
-          <!--          />-->
           <count-item
             label="今日接待人数"
             :count="scenicStore.scenicQueueData.header.jrjdrs"
@@ -134,7 +129,7 @@
           </div>
           <PieRow
             label="告警总数"
-            :dataList="list"
+            :dataList="scenicStore.secureData.dataList"
             :total="alarmTotal"
             :width="440"
             :height="300"
@@ -173,7 +168,7 @@
               :width="220"
               :height="300"
               sub-title="拥堵总时长"
-              :list="scenicStore.trafficData.data.countRate"
+              :list="scenicStore.trafficData.data.timeRate"
             />
           </div>
         </div>
@@ -335,44 +330,6 @@
   let carOverlays = ref([])
   let shipOverlays = ref([])
 
-  let list = ref([
-    {
-      name: '人群聚集识别',
-      count: 0,
-      value: 0
-    },
-    {
-      name: '人群计数识别',
-      count: 0,
-      value: 0
-    },
-    {
-      name: '游客跌倒',
-      count: 0,
-      value: 0
-    },
-    {
-      name: '游客攀爬',
-      count: 0,
-      value: 0
-    },
-    {
-      name: '违法吸烟',
-      count: 0,
-      value: 0
-    },
-    {
-      name: '烟火焚烧',
-      count: 0,
-      value: 0
-    },
-    {
-      name: '人员离岗',
-      count: 0,
-      value: 0
-    }
-  ])
-
   const garageList = computed(() => {
     return scenicStore.stopCarData.headList
   })

src/views/scenic/components/jam.vue

@@ -56,7 +56,7 @@
     return props.list.map((item) => {
       return {
         ...item,
-        value: parseFloat(item.value)
+        value: item.count
       }
     })
   }
@@ -71,68 +71,66 @@
     return () => `{value|${getTotal()}}` + '\n' + `{name|${props.subTitle}}`
   }
 
-  let defaultCofig = {
-    color: ['#A665F1', '#0063FF', '#00D0FF', '#01FEFE', '#FC2638', '#FED958'],
-    legend: {
-      x: 'left',
-      y: '74%',
-      itemHeight: fitChartSize(12),
-      itemWidth: fitChartSize(12),
-      itemGap: fitChartSize(10),
-      formatter: function (name) {
-        return '{name|' + name + '}'
-      },
-      textStyle: {
-        rich: {
-          name: {
-            color: '#fff',
-            fontSize: fitChartSize(14)
+  const init = () => {
+    if (!params) {
+      params = {
+        color: ['#A665F1', '#0063FF', '#00D0FF', '#01FEFE', '#FC2638', '#FED958'],
+        legend: {
+          x: 'left',
+          y: '74%',
+          itemHeight: fitChartSize(12),
+          itemWidth: fitChartSize(12),
+          itemGap: fitChartSize(10),
+          formatter: function (name) {
+            return '{name|' + name + '}'
           },
-          value: {
-            color: '#00D5F6',
-            fontSize: fitChartSize(14)
-          }
-        }
-      }
-    },
-    series: [
-      {
-        type: 'pie',
-        center: ['50%', '40%'],
-        radius: ['55%', '70%'],
-        itemStyle: {
-          borderWidth: fitChartSize(4),
-          borderColor: '#093672'
-        },
-        label: {
-          show: true,
-          position: 'center',
-          fontWeight: 'bold',
-          formatter: formatLabel(),
-          rich: {
-            value: {
-              color: '#fff',
-              fontSize: fitChartSize(24),
-              fontWeight: 'bold',
-              padding: [0, 0, 5, 0]
-            },
-            name: {
-              color: '#fff',
-              fontSize: fitChartSize(12)
+          textStyle: {
+            rich: {
+              name: {
+                color: '#fff',
+                fontSize: fitChartSize(14)
+              },
+              value: {
+                color: '#00D5F6',
+                fontSize: fitChartSize(14)
+              }
             }
           }
         },
-        labelLine: {
-          show: false
-        },
-        data: getSeriesData()
+        series: [
+          {
+            type: 'pie',
+            center: ['50%', '40%'],
+            radius: ['55%', '70%'],
+            itemStyle: {
+              borderWidth: fitChartSize(4),
+              borderColor: '#093672'
+            },
+            label: {
+              show: true,
+              position: 'center',
+              fontWeight: 'bold',
+              formatter: formatLabel(),
+              rich: {
+                value: {
+                  color: '#fff',
+                  fontSize: fitChartSize(24),
+                  fontWeight: 'bold',
+                  padding: [0, 0, 5, 0]
+                },
+                name: {
+                  color: '#fff',
+                  fontSize: fitChartSize(12)
+                }
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data: getSeriesData()
+          }
+        ]
       }
-    ]
-  }
-
-  const init = () => {
-    if (!params) {
-      params = defaultCofig
     } else {
       params.series[0].label.formatter = formatLabel()
       params.series[0].data = getSeriesData()

src/views/scenic/index.vue

@@ -46,7 +46,7 @@
             scenicStore.setWordkOrderData(val)
             break
           case 'scenicSpotData':
-            scenicStore.setScenicSpotData(val.data)
+            scenicStore.setScenicSpotData(val)
             break
           case 'scenicSppotLineUp':
             scenicStore.setScenicQueueData(val)
@@ -70,7 +70,7 @@
             scenicStore.setCarShipData(val.data)
             break
         }
-        if (!timer) sendCarShip()
+        // if (!timer) sendCarShip()
       }
     }
   )