From bf3323fcbe32918dda7099f05be56aa7151b1e26 Mon Sep 17 00:00:00 2001
From: 徐旺旺 <11530253@qq.com>
Date: 星期四, 14 一月 2021 15:56:11 +0800
Subject: [PATCH] 细节

---
 src/components/panel/RightSearchPanel.vue     |  330 ++++-----------------
 /dev/null                                     |  154 ----------
 src/assets/images/map-pages/icon/panel/pk.png |    0 
 src/components/panel/EnvProtectSearch.vue     |  180 ++++++++++++
 src/assets/images/map-pages/icon/panel/hb.png |    0 
 src/views/MapTemplate.vue                     |    2 
 src/components/panel/DischargeSearch.vue      |  170 +++++++++++
 src/components/panel/TopEnterprisePanel.vue   |   12 
 src/assets/images/map-pages/icon/panel/gd.png |    0 
 src/assets/images/map-pages/icon/tab_item.png |    0 
 10 files changed, 426 insertions(+), 422 deletions(-)

diff --git a/src/assets/images/map-pages/icon/panel/gd.png b/src/assets/images/map-pages/icon/panel/gd.png
new file mode 100644
index 0000000..144dcb9
--- /dev/null
+++ b/src/assets/images/map-pages/icon/panel/gd.png
Binary files differ
diff --git a/src/assets/images/map-pages/icon/panel/hb.png b/src/assets/images/map-pages/icon/panel/hb.png
new file mode 100644
index 0000000..bfb6b88
--- /dev/null
+++ b/src/assets/images/map-pages/icon/panel/hb.png
Binary files differ
diff --git a/src/assets/images/map-pages/icon/panel/pk.png b/src/assets/images/map-pages/icon/panel/pk.png
new file mode 100644
index 0000000..ac5277b
--- /dev/null
+++ b/src/assets/images/map-pages/icon/panel/pk.png
Binary files differ
diff --git a/src/assets/images/map-pages/icon/tab_item.png b/src/assets/images/map-pages/icon/tab_item.png
new file mode 100644
index 0000000..69c703b
--- /dev/null
+++ b/src/assets/images/map-pages/icon/tab_item.png
Binary files differ
diff --git a/src/components/panel/DischargeSearch.vue b/src/components/panel/DischargeSearch.vue
new file mode 100644
index 0000000..0b14697
--- /dev/null
+++ b/src/components/panel/DischargeSearch.vue
@@ -0,0 +1,170 @@
+<template>
+  <div>
+    <el-card class="search-panel">
+      <el-form ref="form" :model="form" label-width="90px" class="search-form">
+        <el-form-item label="鏌ヨ绫诲瀷锛�">
+          <el-select v-model="form.pipelineType" @change="handlePipelineType">
+            <el-option
+                v-for="item in pipelineTypeOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="妯$硦鎼滅储锛�">
+          <el-input v-model="form.key" size="mini"
+                    placeholder="鍦ㄦ杈撳叆鍏抽敭瀛�"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">
+          <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="search-result" style="height:271px;">
+      <div class="B-TMD-table-list" v-for="(item,index) in list" :key="index">
+        <div class="B-TMD-table-list-title">
+          <div class="B-TMD-table-list-head">
+            <div class="B-TMD-table-list-title-y"
+                 :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]">
+              <span>杩愬崟鍙凤細</span>
+              <span id="waybillNumber" class="B-TMD-table-list-title-y-num"
+                    :title="item.transNo">
+                                                <span class="B-TMD-table-list-title-y-alarm">{{ item.transNo }}</span>
+                                            </span>
+            </div>
+            <div class="B-TMD-table-list-title-c">
+              杞藉叿鍙凤細
+              <span id="plateNumber_p">
+                                                <span id="plateNumber_n"><a href="#">{{ item.vehicleNo }}</a></span>
+                                            </span>
+            </div>
+          </div>
+          <div class="B-TMD-table-icons" style="float:right">
+            <ul>
+              <li class="B-TMD-table-list-title-y-adress"
+                  @click="handleLocation(item)"></li>
+              <li :class="[{'B-TMD-table-list-title-y-car': item.vehicleStatus ==='910002', 'B-TMD-table-list-title-y-car-offline': item.vehicleStatus ==='910001','B-TMD-table-list-title-y-car-warning': item.vehicleStatus==='910003' }]"></li>
+            </ul>
+          </div>
+        </div>
+        <div class="B-TMD-table-list-content">
+          <div>
+            <span>鍙戣揣浼佷笟锛�</span>
+            <span id="b_twe_consignment" :title="item.outWarehouseName">{{
+                item.outWarehouseName == null ? "鏆傛棤" : item.outWarehouseName
+              }}</span>
+          </div>
+          <div>
+            <span>鎵�&nbsp;&nbsp;杩�&nbsp;&nbsp;鍟嗭細</span>
+            <span id="b_twe_loan" :title="item.carrierName">{{ item.carrierName }}</span>
+          </div>
+          <div><span>鏀惰揣浼佷笟锛�</span> <span
+              id="b_twe_loan1" :title="item.recvWarehouseName">{{ item.recvWarehouseName }}</span></div>
+        </div>
+        <div class="B-TMD-table-list-bottom">
+          <div class="B-TMD-table-list-bottom-name">
+            璐х墿鍚嶇О锛�<span :title="item.materialName">{{ item.materialName }}</span></div>
+        </div>
+      </div>
+    </el-card>
+
+    <el-card class="footer-page" v-if="total > 10">
+      <el-pagination
+          small
+          @current-change="handlePage"
+          :page-size=pageSize
+          layout="prev, pager, next"
+          :total=total
+          :current-page=current
+          class="warnPagination"
+      >
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'MonitorAreaTips',
+  components: {},
+  data () {
+    return {
+      isPanelVisible: false,
+      total: 0,
+      list: [],
+      form: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      }
+    }
+  },
+  methods: {
+    handleClose (done) {
+      console.log(done)
+    },
+    handleClick (tab, event) {
+      console.log(tab, event)
+    },
+    handleSearch () {
+
+    }
+  },
+  mounted () {
+    this.handleSearch()
+  }
+}
+</script>
+
+<style lang="less">
+.monitorHz {
+  .el-message-box__content {
+    background-color: #030D2E;
+  }
+
+  .search-form .el-form-item {
+    margin: 0px;
+  }
+
+  .search-form .el-icon-search {
+    display: grid;
+    line-height: 30px;
+    font-size: 18px;
+  }
+
+  .search-panel {
+    border: #07325B;
+    background-color: #07325B;
+  }
+
+  .search-result {
+    margin: 5px 0px 0px 0px;
+    padding: 0px;
+    border: #051842;
+    overflow-y: scroll;
+    background-color: #051842;
+  }
+
+  .B-TMD-table-list {
+    margin-top: 10px;
+    text-align: left;
+    padding-left: 10px;
+    color: #328EB5;
+    width: 100%;
+    line-height: 25px;
+    background-color: #0B3B6D;
+  }
+
+  .footer-page {
+    position: absolute;
+    bottom: 5px;
+  }
+}
+</style>
diff --git a/src/components/panel/EnvProtectSearch.vue b/src/components/panel/EnvProtectSearch.vue
new file mode 100644
index 0000000..99ac50f
--- /dev/null
+++ b/src/components/panel/EnvProtectSearch.vue
@@ -0,0 +1,180 @@
+<template>
+  <div>
+    <el-card class="search-panel">
+      <el-form ref="form" :model="form" label-width="90px" class="search-form">
+        <el-form-item label="绫诲瀷锛�">
+          <el-select v-model="form.pipelineType" @change="handlePipelineType">
+            <el-option
+                v-for="item in pipelineTypeOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="鏁版嵁绫诲瀷锛�">
+          <el-select v-model="form.dataType">
+            <el-option
+                v-for="item in dataTypeOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="妯$硦鎼滅储锛�">
+          <el-input v-model="form.key" size="mini"
+                    placeholder="鍦ㄦ杈撳叆鍏抽敭瀛�"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">
+          <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">
+        </el-form-item>
+      </el-form>
+    </el-card>
+    <el-card class="search-result" style="height:271px;">
+      <div class="B-TMD-table-list" v-for="(item,index) in list" :key="index">
+        <div class="B-TMD-table-list-title">
+          <div class="B-TMD-table-list-head">
+            <div class="B-TMD-table-list-title-y"
+                 :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]">
+              <span>杩愬崟鍙凤細</span>
+              <span id="waybillNumber" class="B-TMD-table-list-title-y-num"
+                    :title="item.transNo">
+                                                <span class="B-TMD-table-list-title-y-alarm">{{ item.transNo }}</span>
+                                            </span>
+            </div>
+            <div class="B-TMD-table-list-title-c">
+              杞藉叿鍙凤細
+              <span id="plateNumber_p">
+                                                <span id="plateNumber_n"><a href="#">{{ item.vehicleNo }}</a></span>
+                                            </span>
+            </div>
+          </div>
+          <div class="B-TMD-table-icons" style="float:right">
+            <ul>
+              <li class="B-TMD-table-list-title-y-adress"
+                  @click="handleLocation(item)"></li>
+              <li :class="[{'B-TMD-table-list-title-y-car': item.vehicleStatus ==='910002', 'B-TMD-table-list-title-y-car-offline': item.vehicleStatus ==='910001','B-TMD-table-list-title-y-car-warning': item.vehicleStatus==='910003' }]"></li>
+            </ul>
+          </div>
+        </div>
+        <div class="B-TMD-table-list-content">
+          <div>
+            <span>鍙戣揣浼佷笟锛�</span>
+            <span id="b_twe_consignment" :title="item.outWarehouseName">{{
+                item.outWarehouseName == null ? "鏆傛棤" : item.outWarehouseName
+              }}</span>
+          </div>
+          <div>
+            <span>鎵�&nbsp;&nbsp;杩�&nbsp;&nbsp;鍟嗭細</span>
+            <span id="b_twe_loan" :title="item.carrierName">{{ item.carrierName }}</span>
+          </div>
+          <div><span>鏀惰揣浼佷笟锛�</span> <span
+              id="b_twe_loan1" :title="item.recvWarehouseName">{{ item.recvWarehouseName }}</span></div>
+        </div>
+        <div class="B-TMD-table-list-bottom">
+          <div class="B-TMD-table-list-bottom-name">
+            璐х墿鍚嶇О锛�<span :title="item.materialName">{{ item.materialName }}</span></div>
+        </div>
+      </div>
+    </el-card>
+
+    <el-card class="footer-page" v-if="total > 10">
+      <el-pagination
+          small
+          @current-change="handlePage"
+          :page-size=pageSize
+          layout="prev, pager, next"
+          :total=total
+          :current-page=current
+          class="warnPagination"
+      >
+      </el-pagination>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'MonitorAreaTips',
+  components: {},
+  data () {
+    return {
+      isPanelVisible: false,
+      total: 0,
+      list: [],
+      form: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      }
+    }
+  },
+  methods: {
+    handleClose (done) {
+      console.log(done)
+    },
+    handleClick (tab, event) {
+      console.log(tab, event)
+    },
+    handleSearch () {
+
+    }
+  },
+  mounted () {
+    this.handleSearch()
+  }
+}
+</script>
+
+<style lang="less">
+.monitorHz {
+  .el-message-box__content {
+    background-color: #030D2E;
+  }
+
+  .search-form .el-form-item {
+    margin: 0px;
+  }
+
+  .search-form .el-icon-search {
+    display: grid;
+    line-height: 30px;
+    font-size: 18px;
+  }
+
+  .search-panel {
+    border: #07325B;
+    background-color: #07325B;
+  }
+
+  .search-result {
+    margin: 5px 0px 0px 0px;
+    padding: 0px;
+    border: #051842;
+    overflow-y: scroll;
+    background-color: #051842;
+  }
+
+  .B-TMD-table-list {
+    margin-top: 10px;
+    text-align: left;
+    padding-left: 10px;
+    color: #328EB5;
+    width: 100%;
+    line-height: 25px;
+    background-color: #0B3B6D;
+  }
+
+  .footer-page {
+    position: absolute;
+    bottom: 5px;
+  }
+}
+</style>
diff --git a/src/components/panel/MonitorHZ.vue b/src/components/panel/MonitorHZ.vue
deleted file mode 100644
index 547a4b5..0000000
--- a/src/components/panel/MonitorHZ.vue
+++ /dev/null
@@ -1,154 +0,0 @@
-<template>
-  <div class="monitorHz">
-    <el-card class="search-panel" style="background: #07325b;">
-      <el-form ref="form" :model="form" label-width="80px" class="search-form">
-        <el-form-item label="杞藉叿鍙凤細">
-          <el-input v-model="form.name" placeholder="鍦ㄦ杈撳叆杞藉叿鍙�"></el-input>
-        </el-form-item>
-        <el-row :gutter="20">
-          <el-col :span="4">
-            <el-row>
-              <el-form-item label="鏃堕棿锛�">
-                <el-date-picker
-                    v-model="form.name"
-                    type="date"
-                    style="width: 118px;"
-                    placeholder="閫夋嫨鏃ユ湡">
-                </el-date-picker>
-              </el-form-item>
-            </el-row>
-            <el-row>
-              <el-form-item>
-                <el-date-picker
-                    v-model="form.name"
-                    type="date"
-                    style="width: 118px;"
-                    placeholder="閫夋嫨鏃ユ湡"
-                >
-                </el-date-picker>
-              </el-form-item>
-            </el-row>
-          </el-col>
-          <el-col :span="2">
-            <div class="B-TMD-inp-button" @click="handleSearch"></div>
-          </el-col>
-        </el-row>
-      </el-form>
-    </el-card>
-    <el-card class="search-result" style="height:360px;">
-      <div class="B-TMD-table-list" v-for="(item,index) in list" :key="index">
-        <el-row :gutter="20">
-          <el-col :span="2" style="padding-left: 15px">
-            {{ index + 1 }}銆�
-          </el-col>
-          <el-col :span="15" style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
-            {{ item.processorName }}
-            <br/>
-            {{ item.startAddress }}
-          </el-col>
-          <el-col :span="6">
-            <a class="el-icon-location" style="font-size: 18px;margin-left:5px"
-               @click="handleLocation(item.dispatchNo,item.vno,item.eid,item.lng,item.lat)"></a>
-            <a class="el-icon-connection" style="font-size: 18px;margin-left:5px"></a>
-          </el-col>
-        </el-row>
-      </div>
-    </el-card>
-    <el-card class="footer-page" v-if="total > 10">
-      <el-pagination
-          small
-          :current-page.sync="currentPage1"
-          @current-change="handleSearch"
-          :page-size="10"
-          layout="prev, pager, next"
-          :total="1000"
-          class="warnPagination"
-      >
-      </el-pagination>
-    </el-card>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'MonitorAreaTips',
-  components: {},
-  data () {
-    return {
-      isPanelVisible: false,
-      total: 0,
-      list: [],
-      form: {
-        name: '',
-        region: '',
-        date1: '',
-        date2: '',
-        delivery: false,
-        type: [],
-        resource: '',
-        desc: ''
-      }
-    }
-  },
-  methods: {
-    handleClose (done) {
-      console.log(done)
-    },
-    handleClick (tab, event) {
-      console.log(tab, event)
-    },
-    handleSearch () {
-
-    }
-  },
-  mounted () {
-    this.handleSearch()
-  }
-}
-</script>
-
-<style lang="less">
-.monitorHz {
-  .el-message-box__content {
-    background-color: #030D2E;
-  }
-
-  .search-form .el-form-item {
-    margin: 0px;
-  }
-
-  .search-form .el-icon-search {
-    display: grid;
-    line-height: 30px;
-    font-size: 18px;
-  }
-
-  .search-panel {
-    border: #07325B;
-    background-color: #07325B;
-  }
-
-  .search-result {
-    margin: 5px 0px 0px 0px;
-    padding: 0px;
-    border: #051842;
-    overflow-y: scroll;
-    background-color: #051842;
-  }
-
-  .B-TMD-table-list {
-    margin-top: 10px;
-    text-align: left;
-    padding-left: 10px;
-    color: #328EB5;
-    width: 100%;
-    line-height: 25px;
-    background-color: #0B3B6D;
-  }
-
-  .footer-page {
-    position: absolute;
-    bottom: 5px;
-  }
-}
-</style>
diff --git a/src/components/panel/MonitorPanel.vue b/src/components/panel/RightSearchPanel.vue
similarity index 65%
rename from src/components/panel/MonitorPanel.vue
rename to src/components/panel/RightSearchPanel.vue
index d4901e9..4a59e18 100644
--- a/src/components/panel/MonitorPanel.vue
+++ b/src/components/panel/RightSearchPanel.vue
@@ -1,31 +1,22 @@
 <template>
   <div id="right-panel">
     <div class="panel-tab">
-      <ul>
-        <li id="test" @click="toggleMonitorPanel">
-          <div class="btn-stretch"></div>
-        </li>
-        <li class="B-TMT-tab-div" @click="showHZ">
-          <div class="B-TMT-tab-waybill" :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}"></div>
-        </li>
-        <li class="B-TMT-tab-div:hover" @click="showWayBill">
-          <div class="B-TMT-tab-route" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>
-        </li>
-      </ul>
+      <div class="btn-stretch" @click="toggleMonitorPanel"></div>
+      <div class="tab-gd" @click="handleGd" :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}"></div>
+      <div class="tab-hb" @click="handleHb" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>
+      <div class="tab-pk" @click="handlePk" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>
     </div>
     <div class="right-control">
       <div class="el-message-box__header panel_header">
-        <div class="el-message-box__title panel_title"><!----><span>绠$嚎淇℃伅鏌ヨ</span>
-          <div class="panel_searchTotal">鍏�<span style="color: #f5c228;margin:0 5px">{{ total }}</span>鏉¤褰�
-          </div>
+        <div class="el-message-box__title panel_title"><!----><span>{{ title }}</span>
         </div>
       </div>
       <div class="el-message-box__content" style="padding:6px;font-size: 13px;">
-        <div class="monitor1" v-if="wayBillVisible">
+        <div class="monitor1" v-if="gdVisible">
           <div>
             <el-card class="search-panel">
               <el-form ref="form" :model="form" label-width="90px" class="search-form">
-                <el-form-item label="绠$嚎绫诲瀷锛�">
+                <el-form-item label="绫诲瀷锛�">
                   <el-select v-model="form.pipelineType" @change="handlePipelineType">
                     <el-option
                         v-for="item in pipelineTypeOptions"
@@ -50,8 +41,8 @@
                             placeholder="鍦ㄦ杈撳叆鍏抽敭瀛�"></el-input>
                 </el-form-item>
                 <el-form-item>
+                  <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">
                   <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">
-                  <input type="button" class="btn-ok" @click="handleSearch" value="纭畾">
                 </el-form-item>
               </el-form>
             </el-card>
@@ -117,8 +108,11 @@
             </el-card>
           </div>
         </div>
-        <div class="monitor2" v-if="hzVisible">
-          <monitor-h-z></monitor-h-z>
+        <div class="monitor2" v-if="hbVisible">
+          <env-protect-search></env-protect-search>
+        </div>
+        <div class="monitor2" v-if="pkVisible">
+          <discharge-search></discharge-search>
         </div>
       </div>
     </div>
@@ -127,21 +121,21 @@
 
 <script>
 import $ from 'jquery'
-import MonitorHZ from './MonitorHZ'
-import mapApi from '@/api/mapApi'
-import { mapState } from 'vuex'
+import EnvProtectSearch from './EnvProtectSearch'
+import DischargeSearch from './DischargeSearch'
 
 export default {
   name: 'MonitorPanel',
-  components: { MonitorHZ },
+  components: { EnvProtectSearch, DischargeSearch },
   data () {
     return {
       isPanelVisible: false,
-      wayBillVisible: true,
-      hzVisible: false,
+      gdVisible: true,
+      hbVisible: false,
+      pkVisible: false,
       toggleMonitorStyle: 'right:0px',
       list: [],
-      total: 0,
+      title: '绠¢亾淇℃伅鏌ヨ',
       pipelineTypeOptions: [{
         value: '1',
         label: '绠$嚎鏈綋'
@@ -212,53 +206,8 @@
       isRouteHover: false
     }
   },
-  computed: {
-    ...mapState({
-      currentCorpType: state => state.currentCorpType,
-      currentCorp: state => state.currentCorp
-    }),
-    layerHelper () {
-      return this.$store.layerHelper
-    }
-  },
-  watch: {
-    currentCorpType: async function (val) {
-      const params = {
-        transNo: '',
-        carrierName: '',
-        transMode: '',
-        vehicleNo: '',
-        orderState: '',
-        vehicleStatus: '',
-        orgCode: this.currentCorp,
-        ownerSectorCode: val,
-        size: 10,
-        current: 1
-      }
-      const datas = await this.handleGetDatas(params)
-      console.log(datas)
-      // this.list = datas.data.records
-      // this.total = datas.data.total
-    },
-    currentCorp: async function (val) {
-      const params = {
-        transNo: '',
-        carrierName: '',
-        transMode: '',
-        vehicleNo: '',
-        orderState: '',
-        vehicleStatus: '',
-        orgCode: val,
-        ownerSectorCode: this.currentCorpType,
-        size: 10,
-        current: 1
-      }
-      const datas = await this.handleGetDatas(params)
-      console.log(datas)
-      // this.list = datas.data.records
-      // this.total = datas.data.total
-    }
-  },
+  computed: {},
+  watch: {},
   methods: {
     handleClose (done) {
       console.log(done)
@@ -271,27 +220,25 @@
         this.dataTypeOptions = this.pipelineOptions
       }
     },
-    async handlePage (page) {
-      console.log(page)
-      const params = {
-        transNo: '',
-        carrierName: '',
-        transMode: '',
-        vehicleNo: '',
-        orderState: '',
-        vehicleStatus: '',
-        orgCode: this.currentCorp,
-        ownerSectorCode: this.currentCorpType,
-        size: this.pageSize,
-        current: page
-      }
-      const datas = await this.handleGetDatas(params)
-      console.log(datas)
-      // this.list = datas.data.records
-      // this.total = datas.data.total
+    handlePage (page) {
     },
-    handleLocation (item) {
-      window.vectorLayerHelper.vectorLayerMap.cheliang.showGeometryByXY(item.transNo, item.vehicleNo, item.lng, item.lat)
+    handleGd () {
+      this.gdVisible = true
+      this.hbVisible = false
+      this.pkVisible = false
+      this.title = '绠¢亾淇℃伅鏌ヨ'
+    },
+    handleHb () {
+      this.gdVisible = false
+      this.hbVisible = true
+      this.pkVisible = false
+      this.title = '鐜繚璁炬柦鏌ヨ'
+    },
+    handlePk () {
+      this.gdVisible = false
+      this.hbVisible = false
+      this.pkVisible = true
+      this.title = '鎺掑彛淇℃伅鏌ヨ'
     },
     toggleMonitorPanel () {
       const el = $('.btn-stretch')
@@ -317,91 +264,16 @@
           transition: 'transform 1s linear'
         })
       }
-    },
-    async handleSearch () {
-      // this.list = wayBillData.data
-      // this.total = wayBillData.data.length
-      const params = {
-        transNo: this.form.transNo,
-        carrierName: this.form.carrierName,
-        transMode: this.form.transMode,
-        vehicleNo: this.form.vehicleNo,
-        orderState: this.form.orderState,
-        vehicleStatus: '',
-        orgCode: this.orgCodeStrings,
-        size: this.pageSize,
-        current: this.current
-      }
-      const datas = await this.handleGetDatas(params)
-      console.log(datas)
-      // this.list = datas.data.pager.records
-      // this.total = datas.data.pager.total
-    },
-    async handleInit () {
-      // this.list = wayBillData.data
-      // this.total = wayBillData.data.length
-      const params = {
-        transNo: '',
-        carrierName: '',
-        transMode: '',
-        vehicleNo: '',
-        orderState: '',
-        vehicleStatus: '',
-        orgCode: this.currentCorp,
-        ownerSectorCode: this.currentCorpType,
-        size: 10,
-        current: 1
-      }
-      const datas = await this.handleGetDatas(params)
-      console.log(datas)
-      // this.list = datas.data.records
-      // this.total = datas.data.total
-    },
-    async handleSetOrgCodeStrings () {
-      const orgCodes = await this.handleGetOrgCode()
-      let orgCodesString = ''
-      for (let i = 0; i < orgCodes.data.length; i++) {
-        const org = orgCodes.data[i]
-        orgCodesString += org.orgCode + ','
-      }
-      this.orgCodeStrings = orgCodesString.substring(0, orgCodesString.length - 1)
-    },
-    async handleGetOrgCode () {
-      const params = {
-        orgSector: this.currentCorpType,
-        serviceType: ''
-      }
-      const datas = await mapApi.getOrganizationompanyList(params)
-      return datas
-    },
-    async handleGetDatas (params) {
-      // let datas = await mapApi.getTransOrderlist(params)
-
-      const datas = params
-      return datas
-    },
-    showHZ () {
-      this.wayBillVisible = true
-      this.hzVisible = false
-      this.isWaybillHover = true
-      this.isRouteHover = false
-    },
-    showWayBill () {
-      this.hzVisible = true
-      this.wayBillVisible = false
-      this.isWaybillHover = false
-      this.isRouteHover = true
     }
   },
   mounted () {
-    this.handleInit()
   }
 }
 </script>
 
 <style lang="less">
 #right-panel {
-  width: 323px;
+  width: 322px;
   height: 573px;
   position: absolute;
   right: 10px;
@@ -468,21 +340,19 @@
   }
 
   .btn-ok {
-    float: right;
     margin-right: 10px;
     width: 4rem;
-    background-color: lightblue;
+    background-color: #0B89B5;
     color: white;
-    border: 1px solid white;
+    border: 0;
   }
 
   .btn-reset {
-    float: right;
     margin-right: 10px;
     width: 4rem;
     background-color: orange;
     color: white;
-    border: 1px solid white;
+    border: 0;
   }
 
   .component-fade-enter-active, .component-fade-leave-active {
@@ -520,40 +390,8 @@
     white-space: nowrap;
   }
 
-  .B-TMD-table-list-title-y-adress {
-    width: 16px;
-    height: 22px;
-    display: block;
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat 0 -90px;
-    cursor: pointer;
-  }
-
-  .B-TMD-table-list-title-y-car {
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -45px 0;
-    width: 38px;
-    height: 38px;
-    display: block;
-    margin-top: 2px !important;
-  }
-
-  .B-TMD-table-list-title-y-car-offline {
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -90px 0;
-    width: 38px;
-    height: 38px;
-    display: block;
-    margin-top: 2px !important;
-  }
-
-  .B-TMD-table-list-title-y-car-warning {
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat 0 0;
-    width: 38px;
-    height: 38px;
-    display: block;
-    margin-top: 2px !important;
-  }
-
   .btn-stretch {
-    width: 20px;
+    width: 15px;
     height: 28px;
     background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -408px 0;
     margin-left: 10px;
@@ -565,8 +403,22 @@
     transition: transform 1s linear;
   }
 
-  .btn-stretch-active {
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -440px 0;
+  .tab-gd {
+    width: 32px;
+    height: 30px;
+    background-color: #0B3B6D;
+  }
+
+  .tab-hb {
+    width: 32px;
+    height: 30px;
+    background-color: #545454;
+  }
+
+  .tab-pk {
+    width: 32px;
+    height: 30px;
+    background-color: #83a6c4;
   }
 
   .panel-tab {
@@ -574,63 +426,9 @@
     left: 0;
     height: 120px;
     top: 0;
-    width: 40px;
+    width: 32px;
     z-index: 500;
-    background-color: #030D2E;
     background: url('../../assets/images/map-pages/icon/caidan.png') no-repeat;
-  }
-
-  .B-TMT-tab-div {
-    width: 29px;
-    height: 29px;
-    margin-left: 3px;
-    margin-top: 10px;
-    cursor: pointer;
-
-    :hover {
-      cursor: pointer;
-      // background: url("");
-    }
-  }
-
-  .B-TMT-tab-waybill {
-    width: 29px !important;
-    height: 29px !important;
-    margin-top: 0 !important;
-    margin-left: 0 !important;
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -320px 0;
-  }
-
-  .B-TMT-tab-route {
-    width: 20px;
-    height: 19px;
-    margin-left: 5px;
-    margin-top: 6px;
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -169px 0;
-  }
-
-  .B-TMT-tab-waybill-isActive, .B-TMT-tab-waybill:hover {
-    width: 29px !important;
-    height: 29px !important;
-    margin-top: 0 !important;
-    margin-left: -1px !important;
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -361px 0 !important;
-  }
-
-  .B-TMT-tab-route-isActive, .B-TMT-tab-route:hover {
-    width: 32px !important;
-    height: 29px !important;
-    margin-top: 0 !important;
-    margin-left: -1px !important;
-    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -197px 0 !important;
-  }
-
-  .panel-tab ul {
-    list-style: none;
-  }
-
-  .panel-tab ul li {
-    height: 30px;
   }
 
   .right-control {
@@ -690,7 +488,7 @@
     color: #569ee1;
   }
 
-  input::-moz-input-placeholder {
+  input::-moz-placeholder {
     color: #569ee1;
   }
 
@@ -735,7 +533,7 @@
     position: absolute;
     bottom: 8px;
     right: 16px;
-    background: url('/assets/images/map-pages/icon/icon.png') no-repeat -481px 0;
+    background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -481px 0;
     cursor: pointer;
   }
 
diff --git a/src/components/panel/TopEnterprisePanel.vue b/src/components/panel/TopEnterprisePanel.vue
index aded26e..3bf542e 100644
--- a/src/components/panel/TopEnterprisePanel.vue
+++ b/src/components/panel/TopEnterprisePanel.vue
@@ -94,10 +94,20 @@
   height: 40px;
   padding-top: 10px;
   background: #07325b;
-  border: 2px solid #2A8FD4;
+  border: 1px solid #2A8FD4;
   border-radius: 10px;
   text-align: center;
 
+  .el-button {
+    border-radius: 0;
+  }
+
+  .el-input__inner {
+    border-radius: 0;
+    border: 1px solid #0e639e;
+    background-color: #061e51;
+  }
+
   .el-form-item__label {
     color: #ffffff;
   }
diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue
index 75746b3..8b3b26c 100644
--- a/src/views/MapTemplate.vue
+++ b/src/views/MapTemplate.vue
@@ -21,7 +21,7 @@
 import LcBasemap from '@components/LayerController/modules/LcBaseMap'
 import LcServiceLayer from '@components/LayerController/modules/LcServiceLayer'
 import LcServiceLayerFilter from '@components/LayerController/modules/LcServiceLayerFilter'
-import MonitorPanel from '@components/panel/MonitorPanel'
+import MonitorPanel from '@components/panel/RightSearchPanel'
 import TopEnterprisePanel from '@components/panel/TopEnterprisePanel'
 import ToolBoxPanel from '@components/panel/ToolBoxPanel'
 

--
Gitblit v1.8.0