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>鎵� 杩� 鍟嗭細</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>鎵� 杩� 鍟嗭細</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