From d47e5437da19a4a49762986dcf49eb1ec3195c16 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期三, 29 三月 2023 17:39:15 +0800
Subject: [PATCH] 预警研判优化

---
 src/views/intelligentPatrol/statistics/unlawful/type/index.vue | 1021 +++++++++++++++++++++++++++++---------------------------
 1 files changed, 528 insertions(+), 493 deletions(-)

diff --git a/src/views/intelligentPatrol/statistics/unlawful/type/index.vue b/src/views/intelligentPatrol/statistics/unlawful/type/index.vue
index 376a2fe..da0a8ac 100644
--- a/src/views/intelligentPatrol/statistics/unlawful/type/index.vue
+++ b/src/views/intelligentPatrol/statistics/unlawful/type/index.vue
@@ -1,165 +1,201 @@
 <template xmlns="http://www.w3.org/1999/html">
-  <div class="list">
-    <header>
-      <div class="header-content">
-        <div class="search">
-          <span style="padding-right: 20px">鏃堕棿鑼冨洿:</span>
-          <el-date-picker
-            v-model="value2"
-            type="daterange"
-            align="right"
-            unlink-panels
-            range-separator="鑷�"
-            start-placeholder="寮�濮嬫棩鏈�"
-            end-placeholder="缁撴潫鏃ユ湡"
-            :picker-options="pickerOptions"
-            value-format="yyyy-MM-dd HH:mm:ss"
-          >
-          </el-date-picker>
-        </div>
+    <div class="list">
+        <header>
+            <div class="header-content">
+                <div class="search">
+                    <span style="padding-right: 20px">鏃堕棿鑼冨洿:</span>
+                    <el-date-picker
+                        v-model="value2"
+                        type="daterange"
+                        align="right"
+                        unlink-panels
+                        range-separator="鑷�"
+                        start-placeholder="寮�濮嬫棩鏈�"
+                        end-placeholder="缁撴潫鏃ユ湡"
+                        :picker-options="pickerOptions"
+                        value-format="yyyy-MM-dd HH:mm:ss"
+                    >
+                    </el-date-picker>
+                </div>
 
-        <div class="find">
-          <el-button
-            type="primary"
-            icon="el-icon-search"
-            @click="setTableDataHandle"
-            >鏌ヨ</el-button
-          >
-          <el-button icon="el-icon-delete-solid" @click="resetTableData"
-            >閲嶇疆</el-button
-          >
-        </div>
+                <div class="find">
+                    <el-button
+                        type="primary"
+                        icon="el-icon-search"
+                        @click="setTableDataHandle"
+                        >鏌ヨ</el-button
+                    >
+                    <el-button
+                        icon="el-icon-delete-solid"
+                        @click="resetTableData"
+                        >閲嶇疆</el-button
+                    >
+                </div>
 
-        <div class="main-nav-right">
-          <el-button type="primary" icon="el-icon-upload2" @click="handleExport"
-            >瀵煎嚭</el-button
-          >
-        </div>
-      </div>
-    </header>
-    <main>
-      <div class="main-content">
-        <!-- 鏁版嵁灞曠ず -->
-        <el-table
-          border
-          stripe
-          ref="multipleTable"
-          :header-cell-style="{
-            background: '#F5F5F5',
-            'font-weight': '650',
-            'line-height': '45px',
-          }"
-          :row-class-name="tableRowClassName"
-          :data="list"
-          style="width: 100%"
-        >
-          <el-table-column type="selection" min-width="5"> </el-table-column>
-          <el-table-column prop="name" label="绫诲瀷鍚嶇О" min-width="10">
-          </el-table-column>
-          <el-table-column prop="count" label="浜嬩欢鎬绘暟" min-width="5">
-            <template slot-scope="scope">
-
-              <el-button type="text" @click="seachTotalEvents(scope.row.id)">{{scope.row.count}}</el-button>
-            </template>
-          </el-table-column>
-          <el-table-column prop="ratio" label="鍗犳瘮" min-width="5">
-          </el-table-column>
-          <el-table-column prop="register" label="绔嬫" min-width="5">
-          </el-table-column>
-          <el-table-column prop="notRegister" label="鏆備笉绔嬫" min-width="5">
-          </el-table-column>
-          <el-table-column prop="closing" label="缁撴" min-width="5">
-          </el-table-column>
-          <el-table-column prop="relearn" label="鍐嶅涔�" min-width="5">
-          </el-table-column>
-          <el-table-column prop="checked" label="宸插鏍�" min-width="5">
-          </el-table-column>
-          <el-table-column prop="checkedRatio" label="瀹℃牳鐜�" min-width="5">
-          </el-table-column>
-          <el-table-column prop="registerRatio" label="绔嬫鐜�" min-width="5">
-          </el-table-column>
-        </el-table>
-      </div>
-
-      <!-- tools -->
-      <div class="tools">
-        <div class="funs"></div>
-        <div class="pagination">
-          <el-pagination
-            background
-            :current-page="currentPage"
-            layout="prev, pager, next"
-            :total="totalNum"
-            :page-size="pageSize"
-            @current-change="changeCurrentPage"
-            @prev-click="handlePrev"
-            @next-click="handleNext"
-          >
-          </el-pagination>
-        </div>
-      </div>
-
-      <el-dialog
-          title="浜嬩欢鎬绘暟"
-          :visible.sync="dialogVisibleEvent"
-          width="80%"
-          :before-close="handClose">
-        <el-table
-            border
-            stripe
-            ref="multipleTable"
-            :header-cell-style="{
+                <div class="main-nav-right">
+                    <el-button
+                        type="primary"
+                        icon="el-icon-upload2"
+                        @click="handleExport"
+                        >瀵煎嚭</el-button
+                    >
+                </div>
+            </div>
+        </header>
+        <main>
+            <div class="main-content">
+                <!-- 鏁版嵁灞曠ず -->
+                <el-table
+                    border
+                    stripe
+                    ref="multipleTable"
+                    :header-cell-style="{
                         background: '#F5F5F5',
                         'font-weight': '650',
                         'line-height': '45px'
                     }"
-            :data="gridData"
-            style="width: 100%"
-            :row-class-name="tableRowClassName"
+                    :row-class-name="tableRowClassName"
+                    :data="list"
+                    style="width: 100%"
+                >
+                    <el-table-column type="selection" min-width="5">
+                    </el-table-column>
+                    <el-table-column
+                        prop="name"
+                        label="绫诲瀷鍚嶇О"
+                        min-width="10"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        prop="count"
+                        label="浜嬩欢鎬绘暟"
+                        min-width="5"
+                    >
+                        <template slot-scope="scope">
+                            <el-button
+                                type="text"
+                                @click="seachTotalEvents(scope.row.id, 1)"
+                                >{{ scope.row.count }}</el-button
+                            >
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="ratio" label="鍗犳瘮" min-width="5">
+                    </el-table-column>
+                    <el-table-column prop="register" label="绔嬫" min-width="5">
+                    </el-table-column>
+                    <el-table-column
+                        prop="notRegister"
+                        label="鏆備笉绔嬫"
+                        min-width="5"
+                    >
+                    </el-table-column>
+                    <el-table-column prop="closing" label="缁撴" min-width="5">
+                    </el-table-column>
+                    <el-table-column
+                        prop="relearn"
+                        label="鍐嶅涔�"
+                        min-width="5"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        prop="checked"
+                        label="宸插鏍�"
+                        min-width="5"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        prop="checkedRatio"
+                        label="瀹℃牳鐜�"
+                        min-width="5"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        prop="registerRatio"
+                        label="绔嬫鐜�"
+                        min-width="5"
+                    >
+                    </el-table-column>
+                </el-table>
+            </div>
 
-        >
+            <!-- tools -->
+            <div class="tools">
+                <div class="funs"></div>
+                <div class="pagination">
+                    <el-pagination
+                        background
+                        :current-page="currentPage"
+                        layout="prev, pager, next"
+                        :total="totalNum"
+                        :page-size="pageSize"
+                        @current-change="changeCurrentPage"
+                        @prev-click="handlePrev"
+                        @next-click="handleNext"
+                    >
+                    </el-pagination>
+                </div>
+            </div>
 
-          <el-table-column
-              prop="code"
-              label="浜嬩欢缂栧彿"
-              min-width="18"
-          >
-          </el-table-column>
-          <el-table-column
-              prop="eventSource"
-              label="闂鏉ユ簮"
-              min-width="8"
-          >
-            <template slot-scope="scope">
+            <el-dialog
+                title="浜嬩欢鎬绘暟"
+                :visible.sync="dialogVisibleEvent"
+                width="80%"
+                :before-close="handClose"
+            >
+                <el-table
+                    border
+                    stripe
+                    ref="multipleTable"
+                    :header-cell-style="{
+                        background: '#F5F5F5',
+                        'font-weight': '650',
+                        'line-height': '45px'
+                    }"
+                    :data="gridData"
+                    style="width: 100%"
+                    :row-class-name="tableRowClassName"
+                >
+                    <el-table-column
+                        prop="code"
+                        label="浜嬩欢缂栧彿"
+                        min-width="18"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        prop="eventSource"
+                        label="闂鏉ユ簮"
+                        min-width="8"
+                    >
+                        <template slot-scope="scope">
                             <span>{{
                                 scope.row.eventSource === 2
                                     ? '缃戞牸宸℃煡'
                                     : '瑙嗛宸℃煡'
-                              }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column
-              :prop="mystatus === 1 ? 'category' : 'category'"
-              :label="mystatus === 1 ? '澶х被鍚嶇О' : '杩濆缓绫诲埆'"
-              :min-width="mystatus === 1 ? '10' : '15'"
-          >
-          </el-table-column>
-          <el-table-column
-              :prop="mystatus === 1 ? 'type' : 'site'"
-              :label="mystatus === 1 ? '灏忕被鍚嶇О' : '杩濆缓鍦扮偣'"
-              min-width="10"
-          >
-          </el-table-column>
-          <el-table-column
-              :prop="mystatus === 1 ? 'site' : ''"
-              :label="
+                            }}</span>
+                        </template>
+                    </el-table-column>
+                    <el-table-column
+                        :prop="mystatus === 1 ? 'category' : 'category'"
+                        :label="mystatus === 1 ? '澶х被鍚嶇О' : '杩濆缓绫诲埆'"
+                        :min-width="mystatus === 1 ? '10' : '15'"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        :prop="mystatus === 1 ? 'type' : 'site'"
+                        :label="mystatus === 1 ? '灏忕被鍚嶇О' : '杩濆缓鍦扮偣'"
+                        min-width="10"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        :prop="mystatus === 1 ? 'site' : ''"
+                        :label="
                             mystatus === 1 ? '鎶ヨ鐐逛綅' : '杩濇硶寤虹瓚闀裤�佸銆侀珮'
                         "
-              :min-width="mystatus === 1 ? '10' : '20'"
-              show-overflow-tooltip
-          >
-            <template slot-scope="scope">
-              <div v-if="mystatus === 2">
+                        :min-width="mystatus === 1 ? '10' : '20'"
+                        show-overflow-tooltip
+                    >
+                        <template slot-scope="scope">
+                            <div v-if="mystatus === 2">
                                 <span>{{
                                     scope.row.buildingLength +
                                     '绫�' +
@@ -169,50 +205,49 @@
                                     '銆�' +
                                     scope.row.buildingHigh +
                                     '绫�'
-                                  }}</span>
-              </div>
-              <div v-else>{{ scope.row.site }}</div>
-            </template>
-          </el-table-column>
-          <el-table-column
-              :prop="mystatus === 1 ? 'street' : 'buildingArea'"
-              :label="mystatus === 1 ? '鎵�灞炲尯鍩�' : '杩濇硶寤虹瓚闈㈢Н'"
-              min-width="12"
-          >
-          </el-table-column>
-          <el-table-column
-              prop="alarmTime"
-              label="鎶ヨ鏃堕棿"
-              min-width="15"
-              v-if="mystatus === 1"
-          >
-            <template slot-scope="scope">
-              <span>{{ filterTime(scope.row.alarmTime) }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column
-              :prop="mystatus === 1 ? 'continueTime' : 'materials'"
-              :label="mystatus === 1 ? '鎸佺画鏃堕棿' : '杩濇硶寤虹瓚鏉愭枡'"
-              min-width="12"
-          >
-          </el-table-column>
-        </el-table>
+                                }}</span>
+                            </div>
+                            <div v-else>{{ scope.row.site }}</div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column
+                        :prop="mystatus === 1 ? 'street' : 'buildingArea'"
+                        :label="mystatus === 1 ? '鎵�灞炲尯鍩�' : '杩濇硶寤虹瓚闈㈢Н'"
+                        min-width="12"
+                    >
+                    </el-table-column>
+                    <el-table-column
+                        prop="alarmTime"
+                        label="鎶ヨ鏃堕棿"
+                        min-width="15"
+                        v-if="mystatus === 1"
+                    >
+                        <template slot-scope="scope">
+                            <span>{{ filterTime(scope.row.alarmTime) }}</span>
+                        </template>
+                    </el-table-column>
+                    <el-table-column
+                        :prop="mystatus === 1 ? 'continueTime' : 'materials'"
+                        :label="mystatus === 1 ? '鎸佺画鏃堕棿' : '杩濇硶寤虹瓚鏉愭枡'"
+                        min-width="12"
+                    >
+                    </el-table-column>
+                </el-table>
 
-        <div >
-          <el-pagination
-              background
-              :current-page="currentPages"
-              layout="prev, pager, next"
-              :total="totalNums"
-              :page-size="pageSizes"
-              @current-change="changeCurrentPages"
-          >
-          </el-pagination>
-        </div>
-
-      </el-dialog>
-    </main>
-  </div>
+                <div>
+                    <el-pagination
+                        background
+                        :current-page="currentPages"
+                        layout="prev, pager, next"
+                        :total="totalNums"
+                        :page-size="pageSizes"
+                        @current-change="changeCurrentPages"
+                    >
+                    </el-pagination>
+                </div>
+            </el-dialog>
+        </main>
+    </div>
 </template>
   <script>
 import { createNamespacedHelpers } from "vuex";
@@ -221,331 +256,331 @@
 const { mapActions } = createNamespacedHelpers("statistics");
 
 export default {
-  data() {
-    return {
-      seachID:'',
-      dialogVisibleEvent:false,
-      mystatus:1,
-      totalNums:1,
-      pageSizes:10,
-      currentPages:1,
-      gridData:[],
-      pickerOptions: {
-        shortcuts: [
-          {
-            text: "鏈�杩戜竴鍛�",
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-              picker.$emit("pick", [start, end]);
+    data() {
+        return {
+            seachID: '',
+            dialogVisibleEvent: false,
+            mystatus: 1,
+            totalNums: 1,
+            pageSizes: 10,
+            currentPages: 1,
+            gridData: [],
+            pickerOptions: {
+                shortcuts: [
+                    {
+                        text: "鏈�杩戜竴鍛�",
+                        onClick(picker) {
+                            const end = new Date();
+                            const start = new Date();
+                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+                            picker.$emit("pick", [start, end]);
+                        },
+                    },
+                    {
+                        text: "鏈�杩戜竴涓湀",
+                        onClick(picker) {
+                            const end = new Date();
+                            const start = new Date();
+                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+                            picker.$emit("pick", [start, end]);
+                        },
+                    },
+                    {
+                        text: "鏈�杩戜笁涓湀",
+                        onClick(picker) {
+                            const end = new Date();
+                            const start = new Date();
+                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+                            picker.$emit("pick", [start, end]);
+                        },
+                    },
+                ],
             },
-          },
-          {
-            text: "鏈�杩戜竴涓湀",
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-              picker.$emit("pick", [start, end]);
-            },
-          },
-          {
-            text: "鏈�杩戜笁涓湀",
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-              picker.$emit("pick", [start, end]);
-            },
-          },
-        ],
-      },
-      value1: "",
-      value2: "",
-      list: [],
-      totalNum: 0,
-      pageSize: 10,
-      currentPage: 1,
-    };
-  },
-  created() {
-    this.setTableData();
-  },
-  methods: {
-    ...mapActions(["searchByType"]),
-    handClose(){
-      this.dialogVisibleEvent=false
+            value1: "",
+            value2: "",
+            list: [],
+            totalNum: 0,
+            pageSize: 10,
+            currentPage: 1,
+        };
     },
-    changeCurrentPages(page){
-      this.currentPages = page;
-
-      this.seachTotalEvents(this.seachID)
+    created() {
+        this.setTableData();
     },
-// 澶勭悊鏃堕棿
-    filterTime(time) {
-      return helper(time);
-    },
-    seachTotalEvents(id){
-      this.seachID=id
-      this.dialogVisibleEvent =true
-      console.log(this.value2)
-      let params ={
-        type:1,
-        violationsTypeId:id,
-        current: this.currentPages,
-        size: this.pageSizes,
-      }
-      params.startTime = this.value2[0]||''
-      params.endTime = this.value2[1]||''
-      basecase.baseCasePoolList(params).then(res=>{
-        console.log(res)
-        this.gridData =res.records
-        this.pageSizes =res.size
-        this.currentPages =res.current
-        this.totalNums = res.total
-      })
-    },
-    handleExport(e) {
-      this.$axios({
-        method: "post",
-        // url: `sccg/intelligentPatrol/statistics/export/unlawful`,
-        url: `sccg/intelligentPatrol/statistics/export/unlawful/type`,
-        responseType: "arraybuffer",
-        data: {
-          beginTime: this.value2[0],
-          endTime: this.value2[1],
+    methods: {
+        ...mapActions(["searchByType"]),
+        handClose() {
+            this.dialogVisibleEvent = false
         },
-      }).then((res) => {
-        let time = new Date();
-        let deathdate = time.toLocaleDateString();
-        const blob = new Blob([res.data], {
-          type: "application/vnd.ms-excel;charset=utf-8",
-        });
+        changeCurrentPages(page) {
 
-        if (window.navigator.msSaveBlob) {
-          window.navigator.msSaveBlob(
-            blob,
-            deathdate + "鎸夎繚瑙勭被鍨嬬粺璁�" + ".xlsx"
-          );
-        } else {
-          const url = window.URL.createObjectURL(blob);
-          const link = document.createElement("a");
-          link.style.display = "none";
-          link.href = url;
-          link.download = deathdate + "鎸夎繚瑙勭被鍨嬬粺璁�" + ".xlsx";
-          document.body.appendChild(link);
-          link.click();
-          document.body.removeChild(link);
-        }
-        this.$message.success("鎿嶄綔鎴愬姛");
-      });
+            this.seachTotalEvents(this.seachID, page)
+        },
+        // 澶勭悊鏃堕棿
+        filterTime(time) {
+            return helper(time);
+        },
+        seachTotalEvents(id, page) {
+            this.seachID = id
+            this.dialogVisibleEvent = true
+
+            this.currentPages = page;
+            let params = {
+                type: 1,
+                violationsTypeId: id,
+                current: this.currentPages,
+                size: this.pageSizes,
+            }
+            params.startTime = this.value2[0] || ''
+            params.endTime = this.value2[1] || ''
+            basecase.baseCasePoolList(params).then(res => {
+                // console.log(res)
+                this.gridData = res.records
+                this.pageSizes = res.size
+                this.currentPages = res.current
+                this.totalNums = res.total
+            })
+        },
+        handleExport(e) {
+            this.$axios({
+                method: "post",
+                // url: `sccg/intelligentPatrol/statistics/export/unlawful`,
+                url: `sccg/intelligentPatrol/statistics/export/unlawful/type`,
+                responseType: "arraybuffer",
+                data: {
+                    beginTime: this.value2[0],
+                    endTime: this.value2[1],
+                },
+            }).then((res) => {
+                let time = new Date();
+                let deathdate = time.toLocaleDateString();
+                const blob = new Blob([res.data], {
+                    type: "application/vnd.ms-excel;charset=utf-8",
+                });
+
+                if (window.navigator.msSaveBlob) {
+                    window.navigator.msSaveBlob(
+                        blob,
+                        deathdate + "鎸夎繚瑙勭被鍨嬬粺璁�" + ".xlsx"
+                    );
+                } else {
+                    const url = window.URL.createObjectURL(blob);
+                    const link = document.createElement("a");
+                    link.style.display = "none";
+                    link.href = url;
+                    link.download = deathdate + "鎸夎繚瑙勭被鍨嬬粺璁�" + ".xlsx";
+                    document.body.appendChild(link);
+                    link.click();
+                    document.body.removeChild(link);
+                }
+                this.$message.success("鎿嶄綔鎴愬姛");
+            });
+        },
+        setTableDataHandle(e) {
+            this.setTableData();
+        },
+        resetTableData(e) {
+            this.value2 = "";
+            this.setTableData();
+        },
+        // 璁剧疆琛ㄦ牸鏂戦┈绾�
+        tableRowClassName({ row, rowIndex }) {
+            if ((rowIndex + 1) % 2 == 0) {
+                return "warning-row";
+            } else {
+                return "success-row";
+            }
+            return "";
+        },
+        // 璁剧疆tableData
+        setTableData() {
+            const { currentPage, pageSize, context } = this;
+            this.searchByType({
+                currentPage,
+                pageSize,
+                beginTime: this.value2[0],
+                endTime: this.value2[1],
+            }).then((res) => {
+                this.list = res.records;
+                this.totalNum = res.total;
+            });
+        },
+        // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
+        changeCurrentPage(page) {
+            this.currentPage = page;
+            this.setTableData();
+        },
+        // 涓婁竴椤电偣鍑讳簨浠�
+        handlePrev(page) {
+            this.currentPage = page;
+            this.setTableData();
+        },
+        // 涓嬩竴椤电偣鍑讳簨浠�
+        handleNext(page) {
+            this.currentPage = page;
+            this.setTableData();
+        },
     },
-    setTableDataHandle(e) {
-      this.setTableData();
-    },
-    resetTableData(e) {
-      this.value2 = "";
-      this.setTableData();
-    },
-    // 璁剧疆琛ㄦ牸鏂戦┈绾�
-    tableRowClassName({ row, rowIndex }) {
-      if ((rowIndex + 1) % 2 == 0) {
-        return "warning-row";
-      } else {
-        return "success-row";
-      }
-      return "";
-    },
-    // 璁剧疆tableData
-    setTableData() {
-      const { currentPage, pageSize, context } = this;
-      this.searchByType({
-        currentPage,
-        pageSize,
-        beginTime: this.value2[0],
-        endTime: this.value2[1],
-      }).then((res) => {
-        this.list = res.records;
-        this.totalNum = res.total;
-      });
-    },
-    // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠�
-    changeCurrentPage(page) {
-      this.currentPage = page;
-      this.setTableData();
-    },
-    // 涓婁竴椤电偣鍑讳簨浠�
-    handlePrev(page) {
-      this.currentPage = page;
-      this.setTableData();
-    },
-    // 涓嬩竴椤电偣鍑讳簨浠�
-    handleNext(page) {
-      this.currentPage = page;
-      this.setTableData();
-    },
-  },
 };
 </script>
   <style lang="scss" scoped>
 .list {
-  text-align: left;
-  padding: 10px 20px;
-  color: #4b9bb7;
-  border: 1px solid #ccc;
-  header {
-    background-color: white;
-    border: 1px solid #fff;
+    text-align: left;
+    padding: 10px 20px;
+    color: #4b9bb7;
+    border: 1px solid #ccc;
+    header {
+        background-color: white;
+        border: 1px solid #fff;
 
-    .header-content {
-      //padding: 0 40px;
-      display: flex;
-      line-height: 100px;
-      justify-content: space-between;
-      align-items: center;
+        .header-content {
+            //padding: 0 40px;
+            display: flex;
+            line-height: 100px;
+            justify-content: space-between;
+            align-items: center;
 
-      .search {
-        // display: flex;
-        justify-content: flex-start;
+            .search {
+                // display: flex;
+                justify-content: flex-start;
 
-        span {
-          flex: 1;
+                span {
+                    flex: 1;
+                }
+
+                .el-input {
+                    flex: 2;
+                    color: #1d3f57;
+
+                    &::v-deep .el-input__inner {
+                        // background-color: #09152f;
+                        border: 1px solid #17324c;
+                    }
+                }
+                .el-select {
+                    flex: 1;
+                }
+                .el-date-editor {
+                    flex: 1;
+                }
+                // :deep(.el-range-input) {
+                // background-color: #09152f;
+                // }
+            }
+            .find {
+                margin-right: auto;
+                margin-left: 30px;
+            }
         }
+    }
 
-        .el-input {
-          flex: 2;
-          color: #1d3f57;
-
-          &::v-deep .el-input__inner {
-            // background-color: #09152f;
-            border: 1px solid #17324c;
-          }
-        }
-        .el-select {
-          flex: 1;
-        }
-        .el-date-editor {
-          flex: 1;
-        }
-        // :deep(.el-range-input) {
+    :deep(.el-range-separator) {
+        padding: 0px !important;
+    }
+    main {
         // background-color: #09152f;
+        margin-top: 20px;
+        padding-bottom: 50px;
+        border: 1pox solid #fff;
+
+        .main-title {
+            line-height: 60px;
+            padding: 10px 20px;
+        }
+
+        .tools {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 0 20px;
+
+            .funs {
+                display: flex;
+
+                .funsItem {
+                    line-height: 28px;
+                    display: flex;
+                    align-items: center;
+                    border: 1px solid #17324c;
+                    border-radius: 4px;
+                    font-size: 12px;
+                    margin-left: 10px;
+
+                    .el-checkbox {
+                        width: 80px;
+                        padding: 0 10px;
+                    }
+
+                    .el-select {
+                        width: 120px;
+                    }
+
+                    &::v-deep .el-input__inner {
+                        border: none;
+                        // background-color: #09152f;
+                    }
+
+                    &:hover {
+                        border: 1px solid #4b9bb7;
+                    }
+
+                    &:hover .el-checkbox {
+                        color: #4b9bb7;
+                    }
+                }
+            }
+
+            .pagination {
+                margin-top: 50px;
+                display: flex;
+                line-height: 50px;
+                justify-content: center;
+
+                .el-pagination {
+                    &::v-deep li,
+                    &::v-deep .btn-prev,
+                    &::v-deep .btn-next {
+                        // background-color: #071f39;
+                        color: #4b9bb7;
+                    }
+
+                    &::v-deep .active {
+                        background-color: #409eff;
+                        color: #fff;
+                    }
+                }
+            }
+        }
+        // &::v-deep .warning-row {
+        //   background-color: #06122c;
         // }
-      }
-      .find {
-        margin-right: auto;
-        margin-left: 30px;
-      }
-    }
-  }
 
-  :deep(.el-range-separator) {
-    padding: 0px !important;
-  }
-  main {
-    // background-color: #09152f;
-    margin-top: 20px;
-    padding-bottom: 50px;
-    border: 1pox solid #fff;
+        // &::v-deep .success-row {
+        //   background-color: #071f39;
+        // }s
 
-    .main-title {
-      line-height: 60px;
-      padding: 10px 20px;
-    }
-
-    .tools {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      padding: 0 20px;
-
-      .funs {
-        display: flex;
-
-        .funsItem {
-          line-height: 28px;
-          display: flex;
-          align-items: center;
-          border: 1px solid #17324c;
-          border-radius: 4px;
-          font-size: 12px;
-          margin-left: 10px;
-
-          .el-checkbox {
-            width: 80px;
-            padding: 0 10px;
-          }
-
-          .el-select {
-            width: 120px;
-          }
-
-          &::v-deep .el-input__inner {
-            border: none;
-            // background-color: #09152f;
-          }
-
-          &:hover {
-            border: 1px solid #4b9bb7;
-          }
-
-          &:hover .el-checkbox {
-            color: #4b9bb7;
-          }
-        }
-      }
-
-      .pagination {
-        margin-top: 50px;
-        display: flex;
-        line-height: 50px;
-        justify-content: center;
-
-        .el-pagination {
-          &::v-deep li,
-          &::v-deep .btn-prev,
-          &::v-deep .btn-next {
-            // background-color: #071f39;
-            color: #4b9bb7;
-          }
-
-          &::v-deep .active {
-            background-color: #409eff;
-            color: #fff;
-          }
-        }
-      }
-    }
-    // &::v-deep .warning-row {
-    //   background-color: #06122c;
-    // }
-
-    // &::v-deep .success-row {
-    //   background-color: #071f39;
-    // }s
-
-    .operationBox {
-      display: flex;
-    }
-
-    .el-divider {
-      background-color: #4b9bb7;
-    }
-    .el-table {
-      // color: #4b9bb7;
-      // font-size: 10px;
-      .operation {
-        display: flex;
-        color: var(--operation-color);
-        .line {
-          padding: 0 5px;
+        .operationBox {
+            display: flex;
         }
 
-        span:hover {
-          cursor: pointer;
+        .el-divider {
+            background-color: #4b9bb7;
         }
-      }
+        .el-table {
+            // color: #4b9bb7;
+            // font-size: 10px;
+            .operation {
+                display: flex;
+                color: var(--operation-color);
+                .line {
+                    padding: 0 5px;
+                }
+
+                span:hover {
+                    cursor: pointer;
+                }
+            }
+        }
     }
-  }
 }
 </style>

--
Gitblit v1.8.0