bug fixed

src/api/article_z.js

@@ -23,6 +23,10 @@ export default {
   queryServiceMap(params) {
     return axios.post(`/dash/service/operations/page`, params)
   },
+  // todo 设备运营主题（重点区域/道路）
+  queryServiceList(params) {
+    return axios.post(`/dash/service/operations/page`, params)
+  },
   // 区域停车主题_区域饱和度
   queryParkingArea_qybhd(params) {
     return axios.post(`/dash/parking/area/stat1`, params)

src/api/audit.js

@@ -17,10 +17,18 @@ export default {
   qyfwjgListByPage(params) {
     return axios.get('/dash/enterprise/service/page', {params})
   },
-  // 停车场情况-列表
+  //  停车场情况-列表
   tccqkListByPage(params) {
     return axios.get('/dash/parking/lot/situation/page', {params})
   },
+  // todo 停车场情况-进场
+  jcListByPage(params) {
+    return axios.get('/dash/parking/lot/situation/page', {params})
+  },
+  // todo 停车场情况-出场
+  ccListByPage(params) {
+    return axios.get('/dash/parking/lot/situation/page', {params})
+  },
   // 停车场情况-总览
   tccqkView(params) {
     return axios.get('/dash/parking/lot/situation/view', {params})

src/assets/css/element_ui.css

@@ -44,6 +44,9 @@
   line-height: 30px;
 }
 
+
+
+
 .el-input-group>.el-input__inner {
   position: relative;
   /*width: 220px;*/
@@ -152,7 +155,8 @@
 .el-table {
   color: #bbc2d0 !important;
   font-size: 14px !important;
-  background: rgba(0, 0, 0, 0);
+  background: rgb(42, 42, 42);
+  border-color: rgb(51, 51, 51);
 }
 
 .el-table__body-wrapper::-webkit-scrollbar {

src/pages/index/components/berths_information.vue

@@ -2,25 +2,18 @@
   <div class="body-wrapper">
     <el-form class="form-wrapper" :inline="true" :model="formInline">
       <el-form-item label="行政区">
-        <el-select v-model="formInline.region" placeholder="行政区" popper-class="cur-select">
-          <el-option label="源汇区" value="源汇区"></el-option>
-          <el-option label="郾城区" value="郾城区"></el-option>
-          <el-option label="召陵区" value="召陵区"></el-option>
+        <el-select v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
+          <el-option v-for="item in options"  :key="item.label" :label="item.label" :value="item.value"></el-option>
         </el-select>
       </el-form-item>
-<!--      <el-form-item label="重点区域">-->
-<!--        <el-select v-model="formInline.region2" placeholder="重点区域" popper-class="cur-select">-->
-<!--          <el-option label="违规停车高发区" value="违规停车高发区"></el-option>-->
-<!--          <el-option label="事故高发区" value="事故高发区"></el-option>-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="道路">-->
-<!--        <el-select v-model="formInline.region3" placeholder="道路" popper-class="cur-select">-->
-<!--          <el-option label="拥政路" value="拥政路"></el-option>-->
-<!--          <el-option label="团结路" value="团结路"></el-option>-->
-<!--          <el-option label="黄河中路" value="黄河中路"></el-option>-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
+      <el-form-item label="重点区域">
+        <el-select v-model="formInline.keyAreas" placeholder="请选择" popper-class="cur-select">
+          <el-option  v-for="item in options1"  :key="item.label" :label="item.label" :value="item.value"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="具体道路">
+        <el-input v-model="formInline.streetName" placeholder="请输入"></el-input>
+      </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
       </el-form-item>
@@ -85,27 +78,34 @@ export default {
   data() {
     return {
       options: [{
-        value: '源汇区',
+        value: '411102',
         label: '源汇区'
       }, {
-        value: '召陵区',
+        value: '411103',
+        label: '郾城区'
+      },{
+        value: '411104',
         label: '召陵区'
-      }],
-      options2: [{
-        value: '违规停车高发区',
-        label: '违规停车高发区'
       }, {
-        value: '事故高发区',
-        label: '事故高发区'
+        value: '411121',
+        label: '舞阳县'
+      }, {
+        value: '411122',
+        label: '临颍县'
       }],
-      options3: [{
-        value: '团结路',
-        label: '团结路'
+      options1: [{
+        value: '商圈',
+        label: '商圈'
+      }, {
+        value: '学校',
+        label: '学校'
+      }, {
+        value: '医院',
+        label: '医院'
       }, {
-        value: '人民东路',
-        label: '人民东路'
+        value: '旅游景点',
+        label: '旅游景点'
       }],
-      value: '',
       columns: [
         {
           label: '日期',
@@ -129,22 +129,15 @@ export default {
         }
       ],
       modelPieColor: ["#2E8B57","#9078f8"],
-      modelData: {
-        list: []
-      },
+      modelData: [],
       modelPieColor2: ["#2E8B57","#9078f8"],
-      modelData2: {
-        list: []
-      },
+      modelData2: [],
       modelPieColor3: ["#2E8B57","#9078f8"],
-      modelData3: {
-        list: []
-      },
+      modelData3: [],
       formInline: {
-        interfaceName: '',
-        region: '',
-        region2: '',
-        region3: ''
+        regionCode: '',
+        keyAreas: '',
+        streetName: ''
       }
     }
   },
@@ -157,21 +150,35 @@ export default {
   },
   methods: {
     onSubmit() {
-      console.log('submit!');
+      this.dashBerthsInformationStat1()
+      this.dashBerthsInformationStat2()
+      this.dashBerthsInformationStat3()
     },
     dashBerthsInformationStat1(){
-      api.dashBerthsInformationStat1().then(res =>{
-        this.modelData.list = res.data
+      api.dashBerthsInformationStat1({...this.formInline}).then(res =>{
+        let arr = [
+          {name: '占用', value: res.data.records[0].occupancyParkingNumber || 0},
+          {name: '空闲', value: res.data.records[0].remainParkingNumber || 0},
+        ]
+        this.modelData = arr || []
       })
     },
     dashBerthsInformationStat2(){
-      api.dashBerthsInformationStat2().then(res =>{
-        this.modelData2.list = res.data
+      api.dashBerthsInformationStat2({...this.formInline}).then(res =>{
+        let arr = [
+          {name: '有', value: res.data.records[0].hasChargingNumber || 0},
+          {name: '无', value: res.data.records[0].noChargingNumber || 0},
+        ]
+        this.modelData2 = arr || []
       })
     },
     dashBerthsInformationStat3(){
-      api.dashBerthsInformationStat3().then(res =>{
-        this.modelData3.list = res.data
+      api.dashBerthsInformationStat3({...this.formInline}).then(res =>{
+        let arr = [
+          {name: '有', value: res.data.records[0].hasChargeNum || 0},
+          {name: '无', value: res.data.records[0].noChargeNum || 0},
+        ]
+        this.modelData3 = arr || []
       })
     },
   }

src/pages/index/components/berths_revenue.vue

@@ -5,25 +5,18 @@
     <br>
     <el-form class="form-wrapper" :inline="true" :model="formInline">
       <el-form-item label="行政区">
-        <el-select v-model="formInline.region" placeholder="行政区" popper-class="cur-select">
-          <el-option label="源汇区" value="源汇区"></el-option>
-          <el-option label="郾城区" value="郾城区"></el-option>
-          <el-option label="召陵区" value="召陵区"></el-option>
+        <el-select v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
+          <el-option v-for="item in options"  :key="item.label" :label="item.label" :value="item.value"></el-option>
         </el-select>
       </el-form-item>
-<!--      <el-form-item label="重点区域">-->
-<!--        <el-select v-model="formInline.region2" placeholder="重点区域" popper-class="cur-select">-->
-<!--          <el-option label="违规停车高发区" value="违规停车高发区"></el-option>-->
-<!--          <el-option label="事故高发区" value="事故高发区"></el-option>-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="道路">-->
-<!--        <el-select v-model="formInline.region3" placeholder="道路" popper-class="cur-select">-->
-<!--          <el-option label="拥政路" value="拥政路"></el-option>-->
-<!--          <el-option label="团结路" value="团结路"></el-option>-->
-<!--          <el-option label="黄河中路" value="黄河中路"></el-option>-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
+      <el-form-item label="重点区域">
+        <el-select v-model="formInline.keyAreas" placeholder="请选择" popper-class="cur-select">
+          <el-option  v-for="item in options1"  :key="item.label" :label="item.label" :value="item.value"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="具体道路">
+        <el-input v-model="formInline.streetName" placeholder="请输入"></el-input>
+      </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
       </el-form-item>
@@ -151,6 +144,22 @@ export default {
   },
   data() {
     return {
+      options: [{
+        value: '411102',
+        label: '源汇区'
+      }, {
+        value: '411103',
+        label: '郾城区'
+      },{
+        value: '411104',
+        label: '召陵区'
+      }, {
+        value: '411121',
+        label: '舞阳县'
+      }, {
+        value: '411122',
+        label: '临颍县'
+      }],
       linedata: [],
       linedata2: [],
       linedata3: [],
@@ -164,10 +173,9 @@ export default {
       dialogVisible: false,
       selRow: {},
       formInline: {
-        interfaceName: '',
-        region: '',
-        region2: '',
-        region3: ''
+        regionCode: '',
+        keyAreas: '',
+        streetName: ''
       }
     }
   },
@@ -182,7 +190,11 @@ export default {
   },
   methods: {
     onSubmit() {
-      console.log('submit!');
+      this.dashBerthsRevenueStat1()
+      this.dashBerthsRevenueStat2()
+      this.dashBerthsRevenueStat3()
+      this.dashBerthsRevenueStat4()
+      this.dashBerthsRevenueStat5()
     },
     lineTooltipFormat(params) {
       return `<div class="line-tooltip">
@@ -191,27 +203,27 @@ export default {
       }元</div>`;
     },
     dashBerthsRevenueStat1(){
-      api.dashBerthsRevenueStat1({}).then(res =>{
+      api.dashBerthsRevenueStat1({...this.formInline}).then(res =>{
         this.linedata = res.data
       })
     },
     dashBerthsRevenueStat2(){
-      api.dashBerthsRevenueStat2({}).then(res =>{
+      api.dashBerthsRevenueStat2({...this.formInline}).then(res =>{
         this.linedata2 = res.data
       })
     },
     dashBerthsRevenueStat3(){
-      api.dashBerthsRevenueStat3({}).then(res =>{
+      api.dashBerthsRevenueStat3({...this.formInline}).then(res =>{
         this.linedata3 = res.data
       })
     },
     dashBerthsRevenueStat4(){
-      api.dashBerthsRevenueStat4({}).then(res =>{
+      api.dashBerthsRevenueStat4({...this.formInline}).then(res =>{
         this.linedata4 = res.data
       })
     },
     dashBerthsRevenueStat5(){
-      api.dashBerthsRevenueStat5({}).then(res =>{
+      api.dashBerthsRevenueStat5({...this.formInline}).then(res =>{
         this.linedata5 = res.data
       })
     },

src/pages/index/components/berths_usage.vue

@@ -2,25 +2,18 @@
   <div class="body-wrapper">
     <el-form class="form-wrapper" :inline="true" :model="formInline">
       <el-form-item label="行政区">
-        <el-select v-model="formInline.region" placeholder="行政区" popper-class="cur-select">
-          <el-option label="源汇区" value="源汇区"></el-option>
-          <el-option label="郾城区" value="郾城区"></el-option>
-          <el-option label="召陵区" value="召陵区"></el-option>
+        <el-select v-model="formInline.regionCode" placeholder="请选择" popper-class="cur-select">
+          <el-option v-for="item in options"  :key="item.label" :label="item.label" :value="item.value"></el-option>
         </el-select>
       </el-form-item>
-<!--      <el-form-item label="重点区域">-->
-<!--        <el-select v-model="formInline.region2" placeholder="重点区域" popper-class="cur-select">-->
-<!--          <el-option label="违规停车高发区" value="违规停车高发区"></el-option>-->
-<!--          <el-option label="事故高发区" value="事故高发区"></el-option>-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="道路">-->
-<!--        <el-select v-model="formInline.region3" placeholder="道路" popper-class="cur-select">-->
-<!--          <el-option label="拥政路" value="拥政路"></el-option>-->
-<!--          <el-option label="团结路" value="团结路"></el-option>-->
-<!--          <el-option label="黄河中路" value="黄河中路"></el-option>-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
+      <el-form-item label="重点区域">
+        <el-select v-model="formInline.keyAreas" placeholder="请选择" popper-class="cur-select">
+          <el-option  v-for="item in options1"  :key="item.label" :label="item.label" :value="item.value"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="具体道路">
+        <el-input v-model="formInline.streetName" placeholder="请输入"></el-input>
+      </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
       </el-form-item>
@@ -42,10 +35,7 @@
           :dataset="linedata"
           :tooltipFormat="lineTooltipFormat"
           :encode="[
-              { x: 'month', y: 'comeIn', seriesName: '入场（路内）',bool:'true' },
-              { x: 'month', y: 'comeOut', seriesName: '入场（路外）',bool:'true' },
-              { x: 'month', y: 'leftIn', seriesName: '出场（路内）',bool:'true' },
-              { x: 'month', y: 'leftOut', seriesName: '出场（路外）',bool:'true' },
+              { x: 'month', y: 'leftOut', seriesName: '出场',bool:'true' },
             ]"
           id="axstj"
         />
@@ -66,10 +56,7 @@
           :dataset="linedata2"
           :tooltipFormat="lineTooltipFormat"
           :encode="[
-              { x: 'month', y: 'comeIn', seriesName: '入场（路内）',bool:'true' },
-              { x: 'month', y: 'comeOut', seriesName: '入场（路外）',bool:'true' },
-              { x: 'month', y: 'leftIn', seriesName: '出场（路内）',bool:'true' },
-              { x: 'month', y: 'leftOut', seriesName: '出场（路外）',bool:'true' },
+              { x: 'month', y: 'comeIn', seriesName: '出场',bool:'true' },
             ]"
           id="artj"
         />
@@ -90,10 +77,7 @@
           :dataset="linedata3"
           :tooltipFormat="lineTooltipFormat"
           :encode="[
-              { x: 'month', y: 'comeIn', seriesName: '入场（路内）',bool:'true' },
-              { x: 'month', y: 'comeOut', seriesName: '入场（路外）',bool:'true' },
-              { x: 'month', y: 'leftIn', seriesName: '出场（路内）',bool:'true' },
-              { x: 'month', y: 'leftOut', seriesName: '出场（路外）',bool:'true' },
+              { x: 'month', y: 'comeIn', seriesName: '出场',bool:'true' }
             ]"
           id="aztj"
         />
@@ -114,10 +98,7 @@
           :dataset="linedata4"
           :tooltipFormat="lineTooltipFormat"
           :encode="[
-              { x: 'month', y: 'comeIn', seriesName: '入场（路内）',bool:'true' },
-              { x: 'month', y: 'comeOut', seriesName: '入场（路外）',bool:'true' },
-              { x: 'month', y: 'leftIn', seriesName: '出场（路内）',bool:'true' },
-              { x: 'month', y: 'leftOut', seriesName: '出场（路外）',bool:'true' },
+              { x: 'month', y: 'comeIn',bool:'true' },
             ]"
           id="aytj"
         />
@@ -135,13 +116,10 @@
           :left="40"
           :legendTop="0"
           yAxisName="(辆)"
-          :dataset="linedata2"
+          :dataset="linedata5"
           :tooltipFormat="lineTooltipFormat"
           :encode="[
-              { x: 'month', y: 'comeIn', seriesName: '入场（路内）',bool:'true' },
-              { x: 'month', y: 'comeOut', seriesName: '入场（路外）',bool:'true' },
-              { x: 'month', y: 'leftIn', seriesName: '出场（路内）',bool:'true' },
-              { x: 'month', y: 'leftOut', seriesName: '出场（路外）',bool:'true' },
+              { x: 'month', y: 'comeIn',bool:'true' }
             ]"
           id="antj"
         />
@@ -163,6 +141,35 @@ export default {
   },
   data() {
     return {
+      options: [{
+        value: '411102',
+        label: '源汇区'
+      }, {
+        value: '411103',
+        label: '郾城区'
+      },{
+        value: '411104',
+        label: '召陵区'
+      }, {
+        value: '411121',
+        label: '舞阳县'
+      }, {
+        value: '411122',
+        label: '临颍县'
+      }],
+      options1: [{
+        value: '商圈',
+        label: '商圈'
+      }, {
+        value: '学校',
+        label: '学校'
+      }, {
+        value: '医院',
+        label: '医院'
+      }, {
+        value: '旅游景点',
+        label: '旅游景点'
+      }],
       linedata: [],
       linedata2: [],
       linedata3: [],
@@ -176,10 +183,9 @@ export default {
       dialogVisible: false,
       selRow: {},
       formInline: {
-        interfaceName: '',
-        region: '',
-        region2: '',
-        region3: ''
+        regionCode: '',
+        keyAreas: '',
+        streetName: ''
       }
     }
   },
@@ -194,30 +200,34 @@ export default {
   },
   methods: {
     onSubmit() {
-      console.log('submit!');
+      this.dashBerthsUsageStat1()
+      this.dashBerthsUsageStat2()
+      this.dashBerthsUsageStat3()
+      this.dashBerthsUsageStat4()
+      this.dashBerthsUsageStat5()
     },
     dashBerthsUsageStat1(){
-      api.dashBerthsUsageStat1().then(res =>{
+      api.dashBerthsUsageStat1({...this.formInline}).then(res =>{
         this.linedata = res.data
       })
     },
     dashBerthsUsageStat2(){
-      api.dashBerthsUsageStat2().then(res =>{
+      api.dashBerthsUsageStat2({...this.formInline}).then(res =>{
         this.linedata2 = res.data
       })
     },
     dashBerthsUsageStat3(){
-      api.dashBerthsUsageStat3().then(res =>{
+      api.dashBerthsUsageStat3({...this.formInline}).then(res =>{
         this.linedata3 = res.data
       })
     },
     dashBerthsUsageStat4(){
-      api.dashBerthsUsageStat4().then(res =>{
+      api.dashBerthsUsageStat4({...this.formInline}).then(res =>{
         this.linedata4 = res.data
       })
     },
     dashBerthsUsageStat5(){
-      api.dashBerthsUsageStat5().then(res =>{
+      api.dashBerthsUsageStat5({...this.formInline}).then(res =>{
         this.linedata5 = res.data
       })
     },

src/pages/index/components/parking_lot_situation.vue

@@ -1,37 +1,60 @@
 <template xmlns:piechart="http://www.w3.org/1999/html">
   <div class="body-wrapper">
-    <div class="search-card">
-      <h5>停车场情况</h5>
-    </div>
-    <br>
-    <div style="display: flex;justify-content: space-around;">
-      <div style="width: 25%;display: flex;">
-      <h4 class="h4font">泊位数量：</h4><h3 class="h4font">{{viewData.totalParkingNumber}}</h3>
-      </div>
-      <div style="width: 25%;display: flex;">
-        <h4 class="h4font">实时余位：</h4><h3 class="h4font">{{viewData.remainParkingNumber}}</h3>
-      </div>
-      <div style="width: 25%;display: flex;">
-        <h4 class="h4font">实时进场：</h4><h3 class="h4font">{{viewData.inNumber}}</h3>
-      </div>
-      <div style="width: 25%;display: flex;">
-        <h4 class="h4font">实时出场：</h4><h3 class="h4font">{{viewData.outNumber}}</h3>
-      </div>
-    </div>
-    <br>
-    <br>
-    <el-table :data="tableData" style="background: #2a2a2a;border-color: #333;">
-      <el-table-column v-for="(item, index) in columns" :key="index" :label="item.label" :prop="item.key">
-      </el-table-column>
-    </el-table>
-    <div class="table-pagination">
-      <el-pagination :background="false" layout="total, prev, pager, next" :total="total" @current-change="handlePageChange"
-                     :current-page.sync="pageNum" :page-size.sync="pageSize">
-      </el-pagination>
-    </div>
-    <br>
-
-
+    <el-tabs  v-model="activeName">
+      <el-tab-pane label="实时概况" name="实时概况">
+        <div style="display: flex;justify-content: space-around;">
+          <div style="width: 25%;display: flex;">
+            <h4 class="h4font">泊位数量：</h4><h3 class="h4font">{{viewData.totalParkingNumber}}</h3>
+          </div>
+          <div style="width: 25%;display: flex;">
+            <h4 class="h4font">实时余位：</h4><h3 class="h4font">{{viewData.remainParkingNumber}}</h3>
+          </div>
+          <div style="width: 25%;display: flex;">
+            <h4 class="h4font">实时进场：</h4><h3 class="h4font">{{viewData.inNumber}}</h3>
+          </div>
+          <div style="width: 25%;display: flex;">
+            <h4 class="h4font">实时出场：</h4><h3 class="h4font">{{viewData.outNumber}}</h3>
+          </div>
+        </div>
+        <br>
+        <br>
+        <el-table :data="tableData" style="background: #2a2a2a;border-color: #333;">
+          <el-table-column v-for="(item, index) in columns" :key="index" :label="item.label" :prop="item.key">
+          </el-table-column>
+        </el-table>
+        <div class="table-pagination">
+          <el-pagination :background="false" layout="total, prev, pager, next" :total="total" @current-change="handlePageChange"
+                         :current-page.sync="pageNum" :page-size.sync="pageSize">
+          </el-pagination>
+        </div>
+      </el-tab-pane>
+      <el-tab-pane label="实时进场" name="实时进出场">
+        <div style="display: flex; justify-content: space-between">
+          <div style="width: 50%">
+            <el-table :data="tableData1">
+              <el-table-column v-for="(item, index) in columns1" :key="index" :label="item.label" :prop="item.key">
+              </el-table-column>
+            </el-table>
+            <div class="table-pagination">
+              <el-pagination layout="prev, pager, next" :total="total1" @current-change="handlePageChange1"
+                             :current-page.sync="pageNum1" :page-size.sync="pageSize1">
+              </el-pagination>
+            </div>
+          </div>
+          <div style="width: 50%">
+            <el-table :data="tableData2">
+              <el-table-column v-for="(item, index) in columns2" :key="index" :label="item.label" :prop="item.key">
+              </el-table-column>
+            </el-table>
+            <div class="table-pagination">
+              <el-pagination layout="prev, pager, next" :total="total2" @current-change="handlePageChange2"
+                             :current-page.sync="pageNum2" :page-size.sync="pageSize2">
+              </el-pagination>
+            </div>
+          </div>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
   </div>
 </template>
 <script>
@@ -44,6 +67,7 @@ export default {
   },
   data() {
     return {
+      activeName: '实时概况',
       columns: [
         {
           label: '停车场ID',
@@ -71,12 +95,52 @@ export default {
         inNumber: "0",
         totalParkingNumber: "0",
         remainParkingNumber: "0"
-      }
+      },
+      tableData1: [],
+      total1: 0,
+      pageSize1: 10,
+      pageNum1: 1,
+      formInline1: {
+        plateNo: ''
+      },
+      columns2: [
+        {
+          label: '停车场名称',
+          key: 'carParkName'
+        },
+        {
+          label: '车牌号',
+          key: 'plateNo'
+        },
+        {
+          label: '入场时间',
+          key: 'inTime'
+        }
+      ],
+      tableData2: [
+        {
+          label: '停车场名称',
+          key: 'carParkName'
+        },
+        {
+          label: '车牌号',
+          key: 'plateNo'
+        },
+        {
+          label: '入场时间',
+          key: 'outTime'
+        }
+      ],
+      total2: 0,
+      pageSize2: 10,
+      pageNum2: 1,
     }
   },
   mounted() {
     this.getTableData()
     this.getView()
+    this.getTableData1()
+    this.getTableData2()
   },
   watch: {
   },
@@ -84,6 +148,12 @@ export default {
     handlePageChange() {
       this.getTableData()
     },
+    handlePageChange1() {
+      this.getTableData1()
+    },
+    handlePageChange2() {
+      this.getTableData2()
+    },
     getTableData() {
       const {pageNum, pageSize} = this
       api.tccqkListByPage({current: pageNum, size: pageSize}).then(res => {
@@ -91,6 +161,20 @@ export default {
         this.total = res.data.total || 0
       })
     },
+    getTableData1() {
+      const {pageNum1, pageSize1} = this
+      api.tccqkListByPage({current: pageNum1, size: pageSize1}).then(res => {
+        this.tableData1 = res.data.records || []
+        this.total1 = res.data.total || 0
+      })
+    },
+    getTableData2() {
+      const {pageNum2, pageSize2} = this
+      api.tccqkListByPage({current: pageNum2, size: pageSize2}).then(res => {
+        this.tableData2 = res.data.records || []
+        this.total2 = res.data.total || 0
+      })
+    },
     getView() {
       api.tccqkView().then(res => {
         this.viewData = res.data

src/pages/index/components/service_operations.vue

@@ -1,14 +1,52 @@
 <template>
-  <div style="color: #d5d3d3" class="middle-map">
-<!--    <el-select v-model="value" filterable remote reserve-keyword placeholder="请选择区域层级">-->
-<!--      <el-option-->
-<!--        v-for="item in options"-->
-<!--        :key="item.value"-->
-<!--        :label="item.label"-->
-<!--        :value="item.value">-->
-<!--      </el-option>-->
-<!--    </el-select>-->
-    <div class="bottom" id="map"></div>
+  <div class="body-wrapper">
+  <el-tabs v-model="activeName">
+    <el-tab-pane label="行政区" name="行政区">
+      <div style="color: #d5d3d3" class="middle-map">
+        <div class="bottom" id="map"></div>
+      </div>
+    </el-tab-pane>
+    <el-tab-pane label="重点区域" name="重点区域">
+        <el-form class="form-wrapper" :inline="true" :model="formInline">
+          <el-form-item label="重点区域">
+            <el-select v-model="formInline1.keyArea" placeholder="请选择" popper-class="cur-select">
+              <el-option v-for="item in options"  :key="item.label" :label="item.label" :value="item.value"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit1">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <el-table :data="tableData1">
+          <el-table-column v-for="(item, index) in columns1" :key="index" :label="item.label" :prop="item.key">
+          </el-table-column>
+        </el-table>
+        <div class="table-pagination">
+          <el-pagination layout="prev, pager, next" :total="total1" @current-change="handlePageChange1"
+                         :current-page.sync="pageNum1" :page-size.sync="pageSize1">
+          </el-pagination>
+        </div>
+    </el-tab-pane>
+    <el-tab-pane label="具体道路" name="具体道路">
+        <el-form class="form-wrapper" :inline="true" :model="formInline2">
+          <el-form-item label="具体道路">
+            <el-input v-model="formInline1.plateNo" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit1">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <el-table :data="tableData2">
+          <el-table-column v-for="(item, index) in columns2" :key="index" :label="item.label" :prop="item.key">
+          </el-table-column>
+        </el-table>
+        <div class="table-pagination">
+          <el-pagination layout="prev, pager, next" :total="total1" @current-change="handlePageChange1"
+                         :current-page.sync="pageNum2" :page-size.sync="pageSize2">
+          </el-pagination>
+        </div>
+    </el-tab-pane>
+  </el-tabs>
   </div>
 </template>
 
@@ -20,15 +58,19 @@ import api from '@/api/article_z'
 export default {
   data() {
     return {
+      activeName: '行政区',
       options: [{
-        value: '行政区',
-        label: '行政区'
+        value: '商圈',
+        label: '商圈'
       }, {
-        value: '重点区域',
-        label: '重点区域'
+        value: '学校',
+        label: '学校'
       }, {
-        value: '具体道路',
-        label: '具体道路'
+        value: '医院',
+        label: '医院'
+      }, {
+        value: '旅游景点',
+        label: '旅游景点'
       }],
       value: '',
       dqIndex: -1,
@@ -110,12 +152,70 @@ export default {
           },
         ],
       },
-      curData: {},
-      dataSource: null,
-      totalAll: '0',
+      columns1: [
+        {
+          label: '重点区域',
+          key: 'plateNo'
+        },
+        {
+          label: '设备数',
+          key: 'carType'
+        }
+      ],
+      tableData1: [],
+      total1: 0,
+      pageSize1: 10,
+      pageNum1: 1,
+      formInline1: {
+        keyArea: ''
+      },
+      columns2: [
+        {
+          label: '道路',
+          key: 'streatName'
+        },
+        {
+          label: '设备数',
+          key: 'carParkName'
+        },
+      ],
+      tableData2: [],
+      total2: 0,
+      pageSize2: 10,
+      pageNum2: 1,
+      formInline2: {
+        streatName: ''
+      },
     };
   },
   methods: {
+    onSubmit1() {
+      this.pageNum1 = 1
+      this.getTableData1()
+    },
+    onSubmit2() {
+      this.pageNum2 = 1
+      this.getTableData2()
+    },
+    handlePageChange1() {
+      this.getTableData1()
+    },
+    handlePageChange2() {
+      this.getTableData2()
+    },
+    getTableData1() {
+      const {pageNum1, pageSize1} = this
+      api.queryServiceList({current: pageNum1, size: pageSize1, ...this.formInline1}).then(res => {
+        this.tableData1 = res.data.records || [];
+        this.total1 = res.data.total || 0
+      })
+    },
+    getTableData2() {
+      api.queryServiceList({current: pageNum2, size: pageSize2, ...this.formInline2}).then(res => {
+        this.tableData2 = res.data.records || [];
+        this.total2 = res.data.total || 0
+      })
+    },
     setIntervalMap(chart) {
       this.timer = setInterval(() => {
         chart.dispatchAction({
@@ -182,15 +282,11 @@ export default {
   },
 };
 </script>
+<style lang="less" scoped>
 
-<style>
-.el-input__inner{
-  color:#eee;
-  border-color: #212121;
-  background-color: rgba(1, 28, 82, 0.8);
+.form-wrapper {
+  margin-bottom: 20px;
 }
-</style>
-<style lang="less" scoped>
 /deep/ .el-input__inner {
   background: #2d3744;
   border: none;
@@ -220,9 +316,57 @@ export default {
     line-height: 0px;
   }
 }
+/deep/ .form-wrapper .el-button {
+  background: linear-gradient(90deg,#0158d9,#3c97e4);
+  width: 100px;
+  height: 40px;
+}
+.body-wrapper {
+  padding: 20px;
+  background: #0c0c0c;
+  .button-block{
+    text-align: right;
+    margin-bottom: 20px;
+  }
+  .table-pagination{
+    text-align: right;
+  }
+  .search-card{
+    margin-bottom: 20px;
+    text-align: center;
+    .input-wrapper{
+      width: 36%;
+    }
+  }
+}
+.body-wrapper {
+  padding: 20px;
+  .button-block{
+    text-align: right;
+    margin-bottom: 20px;
+  }
+  .table-pagination{
+    text-align: right;
+  }
+  .search-card{
+    margin-bottom: 20px;
+    text-align: center;
+    .input-wrapper{
+      width: 36%;
+    }
+  }
+}
+.audit-dialog{
+  .mg-bt{
+    margin-bottom: 24px;
+  }
+  .label{
+    text-align: right;
+  }
+}
 .middle-map {
   width: 100%;
-  height: 100%;
+  height: 800px;
   .bottom {
     height: 90%;
     width: 100%;
@@ -241,4 +385,6 @@ export default {
     }
   }
 }
+
+
 </style>

src/util/dictionary.js

@@ -13,5 +13,12 @@ export default {
     '3': '白色',
     '4': '黑色',
     '5': '绿色'
+  },
+  areaCodeMap: {
+    '411102': '源汇区',
+    '411103': '郾城区',
+    '411104': '召陵区',
+    '411121': '舞阳县',
+    '411122': '临颍县'
   }
 }

static/mung-local-config.js

@@ -1,6 +1,6 @@
 window.mungConfig = {
   dev: {
-    BASE_API: "http://localhost:16399/luohe2_ee/api"
+    BASE_API: "https://park.lhzhtc.cn/luohe2_ee/api"
   },
   build: {
     BASE_API: "https://park.lhzhtc.cn/luohe2_ee/api"