Merge remote-tracking branch 'origin/dev' into dev

src/views/components/layerList/index.vue

@@ -541,7 +541,7 @@ export default {
   position: absolute;
   top: px-to-rem(80);
   left: px-to-rem(480);
-  width: px-to-rem(240);
+  width: px-to-rem(320);
   padding: px-to-rem(10);
   background: #1b2535;
   border-radius: 6px;

src/views/comprehensive-overview/pie-chart/index.vue

@@ -7,63 +7,16 @@ import { echartMixin } from '@/mixins'
 export default {
   name: 'PieChart',
   mixins: [echartMixin],
+  props:{
+    option:{}
+  },
   data() {
     return {
-      seriesData: [
-        { value: 10, name: '非采区采砂' },
-        { value: 10, name: '非采期采砂' },
-        { value: 10, name: '采砂超量' }
-      ]
     }
   },
   methods: {
     initChart() {
-      const option = {
-        backgroundColor: 'transparent',
-        color: ['#91ffab', '#90caff', '#f9dd71'],
-        graphic: {
-          elements: [
-            {
-              type: 'text',
-              left: '18%',
-              top: '38%',
-              style: {
-                text: `{a|3}{b|类}\n{c|预警类型}`,
-                fill: '#fff',
-                textAlign: 'center',
-                textVerticalAlign: 'middle',
-                rich: { a: { fontSize: this.pxToRem(28) }, b: { fontSize: this.pxToRem(12) }, c: { fontSize: this.pxToRem(14) } }
-              }
-            }
-          ]
-        },
-        legend: {
-          orient: 'vertical',
-          right: 10,
-          top: 35,
-          bottom: 20,
-          itemWidth: 12,
-          itemHeight:6,
-          textStyle: { color: '#F5F5F5', fontSize: this.pxToRem(14) },
-          formatter: (name) => {
-            const item = this.seriesData.find((d) => d.name === name)
-            return item ? `${name} ${item.value}` : name
-          }
-        },
-        series: [
-          {
-            name: '预警总数',
-            type: 'pie',
-            radius: ['70%', '95%'],
-            center: ['25%', '50%'],
-            avoidLabelOverlap: false,
-            label: { show: false },
-            labelLine: { show: true },
-            data: this.seriesData
-          }
-        ]
-      }
-      this.chartObj.setOption(option)
+      this.chartObj.setOption(this.option)
     },
     pxToRem(px) {
       return `${px / 100}rem`

src/views/comprehensive-overview/right.vue

@@ -33,29 +33,14 @@
                   <el-radio-button label="4">全部</el-radio-button>
                 </el-radio-group>
               </div>
-              <div class="dottTitle">事件总数</div>
-              <div class="data-info">
-                <div class="left">
-                  <div class="val">{{ eventInfo?.total }}</div>
-                  <img src="@/assets/image/comprehensive/midBg2.png" />
-                </div>
-                <div class="right">
-                  <div class="em" v-for="(item, index) in eventInfo?.list" :key="index">
-                    <div :class="`color${index + 1}`">{{ item.name }}</div>
-                    <div>{{ item.num }}</div>
-                  </div>
-                  <div class="em">
-                    <div class="color2">乱采</div>
-                    <div>0</div>
-                  </div>
-                  <div class="em">
-                    <div class="color3">乱堆</div>
-                    <div>0</div>
-                  </div>
-                  <div class="em">
-                    <div class="color4">乱占</div>
-                    <div>0</div>
+              <div class="card-item">
+                <div class="warning-content">
+                  <div class="warning-title">
+                    <div class="title">事件总数</div>
+                    <div class="num">{{ eventInfo?.total }}</div>
+                    <div class="unit">条</div>
                   </div>
+                  <PieChart style="height: 1.45rem" :option="eventOption" v-if="showEvent"/>
                 </div>
               </div>
             </div>
@@ -65,12 +50,12 @@
           <template v-slot:mainArea>
             <div class="card-item">
               <div class="warning-content">
-                <div class="warning-title">
+                <div class="warning-title mb16">
                   <div class="title">预警总数</div>
                   <div class="num">30</div>
                   <div class="unit">条</div>
                 </div>
-                <PieChart style="height: 1.45rem" />
+                <PieChart style="height: 1.45rem" :option="csOption" />
               </div>
             </div>
           </template>
@@ -93,10 +78,72 @@ export default {
   data() {
     return {
       dateVal: 1,
+      showEvent:false,
       eventInfo: {
         total: 0,
         list: []
-      }
+      },
+      seriesData: [
+        { value: 10, name: '非采区采砂' },
+        { value: 10, name: '非采期采砂' },
+        { value: 10, name: '采砂超量' }
+      ],
+      csOption: {
+        backgroundColor: 'transparent',
+        color: ['#91ffab', '#90caff', '#f9dd71'],
+        graphic: {
+          elements: [
+            {
+              type: 'text',
+              left: '18%',
+              top: '38%',
+              style: {
+                text: `{a|3}{b|类}\n{c|预警类型}`,
+                fill: '#fff',
+                textAlign: 'center',
+                textVerticalAlign: 'middle',
+                rich: { a: { fontSize: this.pxToRem(28) }, b: { fontSize: this.pxToRem(12) }, c: { fontSize: this.pxToRem(14) } }
+              }
+            }
+          ]
+        },
+        legend: {
+          orient: 'vertical',
+          right: 10,
+          top: 35,
+          bottom: 20,
+          itemWidth: 12,
+          itemHeight: 6,
+          textStyle: { color: '#F5F5F5', fontSize: this.pxToRem(14) },
+          formatter: (name) => {
+            const item = this.seriesData.find((d) => d.name === name)
+            return item ? `${name} ${item.value}` : name
+          }
+        },
+        series: [
+          {
+            name: '预警总数',
+            type: 'pie',
+            radius: ['70%', '95%'],
+            center: ['25%', '50%'],
+            avoidLabelOverlap: false,
+            label: { show: false },
+            labelLine: { show: true },
+            data: [
+              { value: 10, name: '非采区采砂' },
+              { value: 10, name: '非采期采砂' },
+              { value: 10, name: '采砂超量' }
+            ]
+          }
+        ]
+      },
+      eventData: [
+        { value: 0, name: '乱建' },
+        { value: 0, name: '乱采' },
+        { value: 0, name: '乱堆' },
+        { value: 0, name: '乱占' }
+      ],
+      eventOption: {}
     }
   },
   mounted() {
@@ -104,6 +151,7 @@ export default {
   },
   methods: {
     getData() {
+      this.showEvent = false
       window
         .requestSDK(
           '/sddnWeiHe/event/getEventStatistics',
@@ -114,9 +162,59 @@ export default {
           'get'
         )
         .then(async (res) => {
-          console.info(res)
+          this.showEvent = true
           this.eventInfo = res.data
-          console.info(this.eventInfo)
+          this.eventData[0].value = res.data.list.length > 0 ? res.data.list[0].num : 0
+          this.eventOption = {
+            backgroundColor: 'transparent',
+            color: ['#6BFE91', '#EFD800','#F17A23', '#4487D8'],
+            graphic: {
+              elements: [
+                {
+                  type: 'text',
+                  left: '18%',
+                  top: '38%',
+                  style: {
+                    text: `{a|4}{b|类}\n{c|四乱监测}`,
+                    fill: '#fff',
+                    textAlign: 'center',
+                    textVerticalAlign: 'middle',
+                    rich: { a: { fontSize: this.pxToRem(28) }, b: { fontSize: this.pxToRem(12) }, c: { fontSize: this.pxToRem(14) } }
+                  }
+                }
+              ]
+            },
+            legend: {
+              orient: 'vertical',
+              left:160,
+              top: 20,
+              bottom: 10,
+              itemWidth: 12,
+              itemHeight: 6,
+              textStyle: { color: '#F5F5F5', fontSize: this.pxToRem(14) },
+              formatter: (name) => {
+                const item = this.eventData.find((d) => d.name === name)
+                return item ? `${name} ${item.value}` : name
+              }
+            },
+            series: [
+              {
+                name: '四乱预警',
+                type: 'pie',
+                radius: ['70%', '95%'],
+                center: ['25%', '50%'],
+                avoidLabelOverlap: false,
+                label: { show: false },
+                labelLine: { show: true },
+                data: [
+                  { value: res.data.list.length > 0 ? res.data.list[0].num : 0, name: '乱建' },
+                  { value: 0, name: '乱采' },
+                  { value: 0, name: '乱堆' },
+                  { value: 0, name: '乱占' }
+                ]
+              }
+            ]
+          }
         })
     }
   }
@@ -203,7 +301,6 @@ export default {
     padding: px-to-rem(16) px-to-rem(15) px-to-rem(55) px-to-rem(11);
     height: px-to-rem(253);
     .slRadio {
-      margin-bottom: px-to-rem(24);
       :deep(.el-radio-button__inner) {
         background: rgba(79, 159, 255, 0.12);
         color: #4f9fff;
@@ -319,7 +416,7 @@ export default {
   .card-item {
     position: relative;
     width: 3.68rem;
-    padding: px-to-rem(22) px-to-rem(16) px-to-rem(27) px-to-rem(26);
+    padding: px-to-rem(15) px-to-rem(16) px-to-rem(20) px-to-rem(26);
     .icon-content {
       display: flex;
       align-items: center;
@@ -449,5 +546,8 @@ export default {
       }
     }
   }
+  .mb16{
+    margin-bottom: px-to-rem(20);
+  }
 }
 </style>

src/views/hydrologic-info/left.vue

@@ -30,11 +30,11 @@
                 </div>
                 <div class="row">
                   <div class="col">离线数：</div>
-                  <div class="col">2个</div>
+                  <div class="col">0个</div>
                 </div>
               </div>
             </div>
-            <div class="progress-content">
+            <!-- <div class="progress-content">
               <div class="progress-item" v-for="item in progressList" :key="item.id">
                 <div class="progress-item-text">
                   <span>{{ item.name }}</span>
@@ -44,7 +44,7 @@
                 </div>
                 <el-progress size="large" :percentage="item.percentage" color="#4183D3" :show-text="false" define-back-color="#213F61" :stroke-width="10"></el-progress>
               </div>
-            </div>
+            </div> -->
           </div>
         </template>
       </BaseMain>
@@ -56,14 +56,14 @@
                 <li class="li-item" v-for="(item, index) in [...swList, ...swList]" :key="index">
                   <div class="item">
                     <div class="titile">
-                      <div>{{ item.title }}</div>
+                      <div>{{ item.stationName }}</div>
                       <div class="btn"></div>
                     </div>
                     <div class="content">
                       <img :src="item.url" />
                       <div class="info">
                         <div>监测指标：{{ item.indicator }}</div>
-                        <div>监测点位置：{{ item.address }}</div>
+                        <div>监测点位置：{{ item.stationLocation }}</div>
                         <div>
                           在线状态：<span class="green">{{ item.status }}</span>
                         </div>
@@ -107,6 +107,7 @@ import iconUrl3 from '@/assets/image/hydrologic/icon4.png'
 import iconUrl4 from '@/assets/image/hydrologic/icon1.png'
 import iconUrl5 from '@/assets/image/hydrologic/icon3.png'
 import iconUrl6 from '@/assets/image/hydrologic/icon2.png'
+import {getHydrologicalList} from '@/api/hydrologicalStationApi'
 export default {
   data() {
     return {
@@ -188,8 +189,19 @@ export default {
   },
   mounted(){
     this.getAirInfo()
+    this.getHydrologicalList()
   },
   methods:{
+     getHydrologicalList() {
+      getHydrologicalList().then((res) => {
+        this.swList = res.data.records
+        this.swList.map((item)=>{
+          item.indicator='降雨、水位、流量、流速'
+          item.status= '在线',
+          item.url= imgUrl
+        })
+      })
+    },
     getAirInfo(){
        window
         .requestSDK('/order/weather/now', {adcode:'610481'}, {}, 'post')

src/views/hydrologic-info/right.vue

@@ -32,7 +32,7 @@
       <BaseMain title="监测信息统计">
         <template v-slot:headerR>
           <el-select v-model="selectedVal" size="mini" class="vSelect" popper-class="u-popper-select">
-            <el-option label="水文监测点" value="0"></el-option>
+            <el-option :label="opt.stationName" :value="opt.id" v-for="opt in swList" :key="opt.id"></el-option>
           </el-select>
           <el-select v-model="selectedVal1" size="mini" class="vSelect" popper-class="u-popper-select">
             <el-option label="水位" value="0"></el-option>
@@ -126,7 +126,7 @@ export default {
         }
       ],
       chartShow: false,
-      selectedVal: '0',
+      selectedVal: '',
       selectedVal1: '0',
       selectedVal2: '',
       selectedVal3: '',
@@ -260,6 +260,7 @@ export default {
         this.swList = res.data.records
         if (res.data.records.length > 0) {
           this.selectedVal2 = res.data.records[0].id
+          this.selectedVal = res.data.records[0].id
           this.changeSwOpt(this.selectedVal2)
         }
       })
@@ -331,7 +332,7 @@ export default {
                 splitLine: { show: false },
                 min: 380,
                 interval: 10,
-                max:420,
+                max: 420,
                 axisLine: {
                   lineStyle: {
                     color: '#374672',

src/views/hydrological-station/jcInfo.vue

@@ -32,7 +32,7 @@
     <el-table :data="tableData" border style="width: 100%" height="650">
       <el-table-column prop="realTimeElevation" label="实时高程(m)" align="center"> </el-table-column>
       <el-table-column prop="maxElevationYesterday" label="昨日最高高程(m)" align="center"> </el-table-column>
-      <el-table-column prop="precipitationOneH" label="1小时雨量(mm)" align="center"> </el-table-column>
+      <el-table-column prop="precipitationOneH" label="昨日雨量(mm)" align="center"> </el-table-column>
       <el-table-column prop="precipitationToday" label="当天雨量(mm）" align="center"> </el-table-column>
       <el-table-column prop="realTimeDischarge" label="实时流量(m³/s)" align="center"> </el-table-column>
       <el-table-column prop="realTimeVelocity" label="实时流速(m/s)" align="center"> </el-table-column>
@@ -74,7 +74,7 @@
         <el-form-item label="昨日最高高程：" prop="maxElevationYesterday">
           <el-input v-model="form.maxElevationYesterday" type="number" :min="380" :max="420"> </el-input><span>m</span>
         </el-form-item>
-        <el-form-item label="1小时雨量："> <el-input v-model="form.precipitationOneH" type="number" :min="0"> </el-input> <span>mm</span> </el-form-item>
+        <!-- <el-form-item label="1小时雨量："> <el-input v-model="form.precipitationOneH" type="number" :min="0"> </el-input> <span>mm</span> </el-form-item> -->
         <!-- <el-form-item label="当天雨量："> <el-input v-model="form.precipitationToday" type="number" :min="0"> </el-input> <span>mm</span> </el-form-item> -->
         <el-form-item label="实时流量：" prop="realTimeDischarge"> <el-input v-model="form.realTimeDischarge" type="number" :min="0"> </el-input> <span>m³/s</span> </el-form-item>
         <el-form-item label="实时流速："> <el-input v-model="form.realTimeVelocity" type="number" :min="0"> </el-input><span>m/s</span> </el-form-item>

src/views/sand-monitor/left.vue

@@ -40,7 +40,7 @@
         <div class="warning-content">
           <div class="warning-title">
             <div class="title">预警总数</div>
-            <div class="num">30</div>
+            <div class="num">0</div>
             <div class="unit">条</div>
           </div>
           <PieChart style="height: 1.45rem" />
@@ -112,8 +112,8 @@ export default {
     return {
       progressList: [
         { name: '允许采砂总量', value: '400吨', percentage: 50, color: '#3FEBED' },
-        { name: '监测已采总量', value: '400吨', percentage: 50, color: '#FCD294' },
-        { name: '过磅采砂总量', value: '400吨', percentage: 50, color: '#4183D3' }
+        { name: '监测已采总量', value: '0吨', percentage: 50, color: '#FCD294' },
+        { name: '过磅采砂总量', value: '0吨', percentage: 50, color: '#4183D3' }
       ],
       date: '日'
     }

src/views/sand-monitor/pie-chart/index.vue

@@ -10,9 +10,9 @@ export default {
   data() {
     return {
       seriesData: [
-        { value: 10, name: '非采区采砂' },
-        { value: 10, name: '非采期采砂' },
-        { value: 10, name: '采砂超量' }
+        { value: 0, name: '非采区采砂' },
+        { value: 0, name: '非采期采砂' },
+        { value: 0, name: '采砂超量' }
       ]
     }
   },

src/views/sand-monitor/right.vue

@@ -3,9 +3,6 @@
     <div class="sand-monitor-right-container">
       <base-header title="采砂地磅数据">
         <div class="header-tool">
-          <el-select v-model="selectedVal1" size="mini">
-            <el-option label="全部" value=""></el-option>
-          </el-select>
           <el-button type="text" size="mini" class="more-btn">更多</el-button>
         </div>
       </base-header>
@@ -25,9 +22,6 @@
       </div>
       <base-header title="采砂过车数据">
         <div class="header-tool">
-          <el-select v-model="selectedVal2" size="mini">
-            <el-option label="全部" value=""></el-option>
-          </el-select>
           <el-button type="text" size="mini" class="more-btn">更多</el-button>
         </div>
       </base-header>
@@ -60,9 +54,6 @@
       </div>
       <base-header title="采砂预警信息">
         <div class="header-tool">
-          <el-select v-model="selectedVal3" size="mini">
-            <el-option label="全部" value=""></el-option>
-          </el-select>
           <el-button type="text" size="mini" class="more-btn">更多</el-button>
         </div>
       </base-header>

src/views/water-station-popup/index.vue

@@ -21,7 +21,7 @@
                 </div>
               </el-col>
               <el-col :span="8" class="label-col">
-                <div class="label">1小时雨量：</div>
+                <div class="label">昨日雨量：</div>
                 <div class="value">
                   <span>{{ swInfo.precipitationOneH }}</span
                   ><span>mm</span>