页面修改

修复了select选项，重写了一张图表

src/pages/index/components/customer_complaint.vue

@@ -4,35 +4,36 @@
       <h5>客户投诉监管</h5>
     </div>
     <br>
-    <form id="form1" size="medium">
-      <el-select v-model="value" placeholder="投诉类型" class="sel">
-        <el-option
-          v-for="item in options"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value">
-        </el-option>
-      </el-select>
+    <el-form class="form-wrapper" :inline="true" :model="formInline">
+      <el-form-item label="投诉类型">
+        <el-select v-model="formInline.region0" placeholder="投诉类型" 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="value" placeholder="路内停车场" class="sel">
-        <el-option
-          v-for="item in options2"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value">
-        </el-option>
-      </el-select>
-
-      <el-select v-model="value" placeholder="路外停车场" class="sel">
-        <el-option
-          v-for="item in options3"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value">
-        </el-option>
-      </el-select>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="路内停车场:">
+        <el-select v-model="formInline.region2" placeholder="路内停车场" 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="路外停车场" class="cur-select">
+          <el-option label="市图书馆停车场" value="市图书馆停车场"></el-option>
+          <el-option label="中山公园停车场" value="中山公园停车场"></el-option>
+          <el-option label="市中心医院停车场" value="市中心医院停车场"></el-option>
+          <el-option label="妇幼保健院停车场" value="妇幼保健院停车场"></el-option>
+        </el-select>
+      </el-form-item>
       <el-button class="btn_save" type="primary" @click="submitIntegrationConfig">客诉登记</el-button>
-    </form>
+    </el-form>
+    <br>
+    <br>
+    <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>
@@ -42,6 +43,7 @@
                      :current-page.sync="pageNum" :page-size.sync="pageSize">
       </el-pagination>
     </div>
+
     <div class="charts_all">
       <div class="charts">
         <piechart
@@ -70,6 +72,12 @@ export default {
   },
   data() {
     return {
+      formInline: {
+        region0: '',
+        region1: '',
+        region2: '',
+        region3: '',
+      },
       options: [{
         value: '经营服务类停车问题',
         label: '经营服务类停车问题'
@@ -200,6 +208,38 @@ export default {
 }
 </script>
 <style  lang="scss" scoped>
+.form-wrapper {
+  margin-bottom: 20px;
+}
+/deep/ .el-input__inner {
+  background: #2d3744;
+  border: none;
+  border-radius: 0;
+}
+/deep/ .el-select {
+  height: 40px;
+  .el-input__inner {
+    height: 40px;
+  }
+  .el-input__prefix, .el-input__suffix {
+    height: 40px;
+  }
+
+  /* 下面设置右侧按钮居中 */
+  .el-input__suffix {
+    top: 0px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-wrap: nowrap;
+    flex-direction: row;
+    align-content: flex-start;
+  }
+  /* 输入框加上上下边是 32px + 2px =34px */
+  .el-input__icon {
+    line-height: 0px;
+  }
+}
 .body-wrapper {
   padding: 20px;
   background: #0c0c0c;

src/pages/index/components/park_monitor.vue

@@ -22,25 +22,31 @@
       <div style="width: 100%;height: 50%">
       <h3 style="color: white;float: left">停车流量预警</h3>
       <br>
-      <vtable
-        :showIdx="true"
-        class="tax-table"
-        :columns="riskColumns"
-        :datas="riskData"
-        :isAutoScroll="true"
-      />
+        <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>
       </div>
       <br>
       <div style="width: 100%;height: 50%">
       <h3 style="color: white;float: left">泊位停车实况</h3>
       <br>
-      <vtable
-        :showIdx="true"
-        class="tax-table"
-        :columns="riskColumns2"
-        :datas="riskData2"
-        :isAutoScroll="true"
-      />
+        <br>
+        <el-table :data="tableData" style="background: #2a2a2a;border-color: #333;">
+          <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 :background="false" layout="total, prev, pager, next" :total="total2" @current-change="handlePageChange"
+                         :current-page.sync="pageNum2" :page-size.sync="pageSize2">
+          </el-pagination>
+        </div>
       </div>
     </div>
     </div>
@@ -72,6 +78,51 @@ export default {
         { name: "停车场", rowIdx: "tcc", origin: true },
         { name: "预警时间", rowIdx: "yjsj" },
       ],
+      columns: [
+        {
+          label: '预警信息',
+          key: 'resourceName'
+        },
+        {
+          label: '停车场',
+          key: 'resourceType'
+        },
+        {
+          label: '预警时间',
+          key: 'userName'
+        }
+      ],
+      columns2: [
+        {
+          label: '停车场',
+          key: 'tcc'
+        },
+        {
+          label: '泊位号',
+          key: 'bwh'
+        },
+        {
+          label: '泊位状态',
+          key: 'bwzt'
+        },
+        {
+          label: '是否潮汐车位',
+          key: 'sfcxcw'
+        },
+        {
+          label: '是否充电泊位',
+          key: 'sfcdcw'
+        },
+        {
+          label: '是否共享泊位',
+          key: 'sfgxcw'
+        }
+        ,
+        {
+          label: '是否异常',
+          key: 'sfyc'
+        }
+      ],
       riskData: [{
         yjxx: '饱和度大于80%',
         tcc: "建业智慧港停车场",
@@ -117,6 +168,9 @@ export default {
       total: 0,
       pageSize: 10,
       pageNum: 1,
+      total2: 0,
+      pageSize2: 10,
+      pageNum2: 1,
       radio: '2',
       dialogVisible: false,
       selRow: {},