From d7dd4a54b16e97e8e60bf0ea28762c3952093a8b Mon Sep 17 00:00:00 2001 From: YANGDL <114714267@qq.com> Date: 星期二, 09 三月 2021 14:52:05 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/components/panel/RightSearchPanel.vue | 1039 +++++++++++++++++++++++++-------------------------------- 1 files changed, 456 insertions(+), 583 deletions(-) diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue index f0c186f..587073a 100644 --- a/src/components/panel/RightSearchPanel.vue +++ b/src/components/panel/RightSearchPanel.vue @@ -1,274 +1,116 @@ <template> - <div id="right-panel"> - <div class="panel-tab"> - <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>{{ title }}</span> - </div> - </div> - <div class="el-message-box__content" style="padding:6px;font-size: 13px;"> - <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-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> - </div> - <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> + <div id="right-panel"> + <div class="panel-tab"> + <div v-for="item in topicMenu" :key="item.id" :title="item.name" class="tab-item" @click="handleGd" :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}"> + <img :src="item.icon" style="width: 24px;height: 24px;"></div> +<!-- <div class="tab-item" @click="handleHb" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>--> +<!-- <div class="tab-item" @click="handlePk" :class="{'B-TMT-tab-route-isActive': isRouteHover}"></div>--> </div> +<!-- <div class="panel-fold-btn" >--> +<!-- <div class="btn-stretch" @click="toggleMonitorPanel"></div>--> +<!-- </div>--> + +<!-- <div class="panel-fold-btn" @click="toggleMonitorPanel" >--> +<!-- <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div>--> +<!--<!– <div class="btn-stretch" v-if="isCollapse" </div>–>--> +<!--<!– <div class="btn-shrink" v-else-if="!isCollapse" ></div>–>--> +<!--<!– :style = "{width:isCollapse ? '290px' : '0px'}"–>--> +<!-- </div>--> +<!-- <div class="right-control" v-if="!isCollapse" >--> + <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] " > + <div class="panel-fold-btn" @click="toggleMonitorPanel"> +<!-- <div class="btn-stretch" v-if="isCollapse"></div>--> +<!-- <div class="btn-shrink" v-else-if="!isCollapse"></div>--> + <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div> + </div> + <component :title="title" :is="gcComp"></component> + </div> + </div> </template> <script> -import $ from 'jquery' -import EnvProtectSearch from './EnvProtectSearch' -import DischargeSearch from './DischargeSearch' +// import $ from 'jquery' +import EnvProtectSearch from './topicSearch/EnvProtectSearch' +import DischargeSearch from './topicSearch/DischargeSearch' +import { TopicList } from '../../conf/Topic' +import SewersSearch from '@components/panel/topicSearch/SewersSearch' export default { name: 'MonitorPanel', components: { EnvProtectSearch, DischargeSearch }, data () { return { + topicMenu: [], + topicList: TopicList, + topicCheckedList: [], isPanelVisible: false, + gcComp: 'sewersSearch', + gdVisible: true, hbVisible: false, pkVisible: false, toggleMonitorStyle: 'right:0px', - list: [], - total: 0, - title: '绠¢亾淇℃伅鏌ヨ', - pipelineTypeOptions: [{ - value: '1', - label: '绠$嚎鏈綋' - }, { - value: '2', - label: '闄勫睘璁炬柦' - }], - dataTypeOptions: [], - attachOptions: [{ - value: '1', - label: '闃�闂�' - }, { - value: '2', - label: '绠″粖' - }, { - value: '3', - label: '绠℃灦' - }, { - value: '4', - label: '涓夐��' - }, { - value: '5', - label: '鍥涢��' - }, { - value: '6', - label: '寮ご' - }], - pipelineOptions: [{ - value: '1', - label: '绠$嚎' - }, { - value: '2', - label: '闆ㄦ按绠℃' - }, { - value: '3', - label: '鍚洂绠℃' - }, { - value: '4', - label: '鍚补绠℃' - }, { - value: '5', - label: '浜嬫晠姘寸娈�' - }, { - value: '6', - label: '鍚⒈绠℃' - }, { - value: '7', - label: '寰幆姘寸娈�' - }, { - value: '8', - label: '鍑�鍖栨按绠℃' - }, { - value: '9', - label: '鐢熸椿姹℃按绠℃' - }], - form: { - transNo: null, - carrierName: null, - transMode: null, - vehicleNo: null, - orderState: null, - size: 10, - current: 1 - }, - pageSize: 10, - current: 1, - isWaybillHover: true, - isRouteHover: false + + title: '姹¢洦姘寸缃�', + + isCollapse: false } }, - computed: {}, - watch: {}, + computed: { + topicMenu () { + console.log(this.$store.state.map.topic.topicCheckedList) + return this.$store.state.map.topic.topicCheckedList + } + }, methods: { handleClose (done) { console.log(done) }, - handleSearch () { - }, - handlePipelineType (item) { - console.log(item) - if (item === '2') { - this.dataTypeOptions = this.attachOptions - } else if (item === '1') { - this.dataTypeOptions = this.pipelineOptions - } - }, handlePage (page) { }, 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') - // let cs = 'btn-stretch-active' - var rightControl = $('#right-panel') - const right = rightControl.css('right') - if (right === '10px') { - rightControl.animate({ - right: '-290px' - }) - el.css({ - transform: 'rotateY(180deg)', - 'transform-origin': '50% 50%', - transition: 'transform 1s linear' - }) - } else { - rightControl.animate({ - right: '10px' - }) - el.css({ - transform: 'rotateY(0deg)', - 'transform-origin': '50% 50%', - transition: 'transform 1s linear' - }) - } + this.isCollapse = !this.isCollapse + // const el = $('.btn-stretch') + // const el2 = $('.panel-fold-btn') + // const el = document.getElementsByClassName('.btn-stretch') + // const el2 = document.getElementsByClassName('.panel-fold-btn') + // let = 'btn-stretch-active' + // var rightControl = $('#right-panel') + // var rightControl = document.getElementById('#right-panel') + // const right = rightControl.css('right') + // const rightit = rightControl.ownerDocument.defaultView + // const right = rightit.getComputedStyle(rightit, null).right + // if (right === '10px') { + // rightControl.animate({ + // right: '-322px' + // }) + // el.css({ + // transform: 'rotateY(180deg)', + // 'transform-origin': '50% 50%', + // transition: 'transform 1s linear' + // }) + // el2.animate({ + // right: '320px', + // speed: 1000 + // }) + // } else { + // rightControl.animate({ + // right: '10px' + // }) + // el.css({ + // transform: 'rotateY(0deg)', + // 'transform-origin': '50% 50%', + // transition: 'transform 1s linear' + // }) + // el2.animate({ + // right: '290px', + // speed: 1000 + // }) + // } } }, mounted () { @@ -277,370 +119,401 @@ </script> <style lang="less"> - #right-panel { - width: 322px; - height: 573px; - position: absolute; - right: 10px; - top: 10px; +@import '@assets/css/map/_map-variable'; +#right-panel { + width: 322px; + //height: 573px; + height: 100%; + position: absolute; + right: 10px; + top: 10px; - .el-card__body { - padding: 7px; - } + .el-card__body { + padding: 7px; + } - .el-form-item__content { - color: rgb(52, 224, 255); - } + .el-form-item__content { + color: rgb(52, 224, 255); + } - .el-picker-panel { - background-color: #061e51 !important; - } + .el-picker-panel { + background-color: #061e51 !important; + } - .el-input__inner { - border-radius: 0 !important; - background-color: #061e51 !important; - border: solid 1px #0e639e !important; - } + .el-input__inner { + border-radius: 0 !important; + background-color: #061e51 !important; + border: solid 1px #0e639e !important; + } - .el-form-item__label { - color: rgb(52, 224, 255); - } + .el-form-item__label { + color: rgb(52, 224, 255); + /*<!--color: @color;-->*/ + } - .el-input__inner::placeholder { - color: #9a9494; - } + .el-input__inner::placeholder { + color: #9a9494; + } - /* 璋锋瓕 */ + /* 璋锋瓕 */ - .el-input__inner::-webkit-input-placeholder { - color: #9a9494; - } + .el-input__inner::-webkit-input-placeholder { + color: #9a9494; + } - /* 鐏嫄 */ + /* 鐏嫄 */ - .el-input__inner:-moz-placeholder { - color: #9a9494; - } + .el-input__inner:-moz-placeholder { + color: #9a9494; + } - /*ie*/ + /*ie*/ - .el-input__inner:-ms-input-placeholder { - color: #9a9494; - } + .el-input__inner:-ms-input-placeholder { + color: #9a9494; + } - .warning { - color: #dcc805; - } + .warning { + color: #dcc805; + } - #plateNumber_n a { - color: rgb(52, 224, 255); - } + #plateNumber_n a { + color: rgb(52, 224, 255); + } - .offline { - color: #9a9494; - } + .offline { + color: #9a9494; + } - .customInput { - width: 118px; - } + .customInput { + width: 118px; + } - .btn-ok { - margin-right: 10px; - width: 4rem; - background-color: #0B89B5; - color: white; - border: 0; - } + .btn-ok { + margin-right: 10px; + width: 4rem; + background-color: #0B89B5; + color: white; + border: 0; + } - .btn-reset { - margin-right: 10px; - width: 4rem; - background-color: orange; - color: white; - border: 0; - } + .btn-reset { + margin-right: 10px; + width: 4rem; + background-color: orange; + color: white; + border: 0; + } - .component-fade-enter-active, .component-fade-leave-active { - transition: opacity .5s ease; - } + .component-fade-enter-active, .component-fade-leave-active { + transition: opacity .5s ease; + } - .component-fade-enter, .component-fade-leave-to - /* .component-fade-leave-active for below version 2.1.8 */ { - opacity: 0; - } + .component-fade-enter, .component-fade-leave-to + /* .component-fade-leave-active for below version 2.1.8 */ { + opacity: 0; + } - .B-TMD-table-icons ul li { - float: left; - margin: 10px; - list-style: none; - } + .B-TMD-table-icons ul li { + float: left; + margin: 10px; + list-style: none; + } - .B-TMD-table-list { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } + .B-TMD-table-list { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } - .B-TMD-table-list-title { - width: 100%; - height: 50px; - } + .B-TMD-table-list-title { + width: 100%; + height: 30px; + } - .B-TMD-table-list-head { - width: 160px; - float: left; - padding-left: 5px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .btn-stretch { - width: 15px; - height: 28px; - background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -408px 0; - margin-left: 10px; - margin-top: 3px; - cursor: pointer; - - transform: rotateY(180deg); - transform-origin: 50% 50%; - transition: transform 1s linear; - } - - .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 { - position: absolute; - left: 0; - height: 120px; - top: 0; - width: 32px; - z-index: 500; - background: url('../../assets/images/map-pages/icon/caidan.png') no-repeat; - } - - .right-control { - width: 290px; - height: 573px; - position: absolute; - top: 0; - right: 0; - z-index: 999; - background: url('../../assets/images/map-pages/icon/bgc.png') no-repeat; - } - - .panel_searchTotal { - font-size: 12px; - float: right; - } - - .panel_header { - // background-color: #030D2E; - padding: 7px 15px 3px 20px; - } - - .panel_title { - font-size: 12px; - margin: 0px; - padding: 0px; - color: #78c4ff; - font-weight: bold; - } - - .el-message-box__content { - background-color: transparent; - } - - .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 !important; - margin-top: 0px; - - .el-input__inner { - border-radius: 0px !important; - background-color: #061e51 !important; - } - } - - input::-webkit-input-placeholder { - color: #569ee1; - } - - input::-moz-placeholder { - color: #569ee1; - } - - input::-ms-input-placeholder { - color: #569ee1; - } - - input[type=text]:focus { - outline: 1px solid #17e4f6; - // box-shadow: 1px 0px 3px 0px #17e4f6; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); - } - - .search-result { - margin: 5px 0px 0px 0px; - padding: 0px; - border: #051842; - height: 290px; - overflow-y: scroll; - background-color: transparent !important; - margin-bottom: -8px !important; - } - - .offline { - color: #64778B; - } - - .B-TMD-table-list { - margin-top: 10px; - text-align: left; - padding-left: 10px; - //color: #64778B; - color: #34e0ff; - width: 100%; - line-height: 25px; - background: url('../../assets/images/map-pages/icon/dd.png') no-repeat; - } - - .B-TMD-inp-button { - width: 46px; - height: 52px; - position: absolute; - bottom: 8px; - right: 16px; - background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -481px 0; - cursor: pointer; - } - - .footer-page { - position: absolute; - background-color: transparent !important; - bottom: 10px !important; - margin-left: 0px; - border: none; - - .warnPagination { - .btn-quicknext, .btn-quickprev { - color: #e4e8f1 !important; - background-color: transparent; - // border: 1px solid #25AECD; - border-left: 1px solid #25AECD; - border-bottom: 1px solid #25AECD; - border-top: 1px solid #25AECD; - color: #e4e8f1; - } - - .el-pager li { - color: #e4e8f1; - background: transparent; - // border: 1px solid #25AECD; - border-left: 1px solid #25AECD; - border-bottom: 1px solid #25AECD; - border-top: 1px solid #25AECD; - } - - .el-pager li.active { - border-color: #25AECD; - background-color: rgba(38, 222, 253, 0.3); - color: #e4e8f1; - } - - .el-pager li:hover { - border-color: #25AECD; - background-color: rgba(38, 222, 253, 0.3); - color: #34e0ff; - } - - .btn-prev { - background-color: transparent; - // border: 1px solid #25AECD; - border-left: 1px solid #25AECD; - border-bottom: 1px solid #25AECD; - border-top: 1px solid #25AECD; - color: #e4e8f1; - } - - .btn-next { - background-color: transparent; - border: 1px solid #25AECD; - color: #e4e8f1; - } - } - } - - ::-webkit-scrollbar { - width: 7px; - height: 5px !important; - } - - ::-webkit-scrollbar-thumb { - /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/ - border-radius: 10px; - box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); - background: #0661AE; - border: 1px solid transparent; - } - - ::-webkit-scrollbar-track { - /*婊氬姩鏉¢噷闈㈣建閬�*/ - // box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2); - border-radius: 0px; - background: #0E3565; - } - - .selectFrom { - color: #061e51; - border: 1px solid #061e51 !important; - background: #dcc805 !important; - - .el-select-dropdown__list { - background: #061e51 !important; - } - - .el-select-dropdown__item { - color: #949494; - background: #061e51 !important; - } - - .el-select-dropdown__item.hover, - .el-select-dropdown__item:hover { - color: #fff; - background: #061e51 !important; - } - - .popper__arrow { - background-color: #061e51 !important; - } - } + .B-TMD-table-list-head { + //width: 160px; + float: left; + padding-left: 5px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .panel-fold-btn{ + overflow: hidden; + position: absolute; + top:45%; + left: -18px; + /*left: 0px;*/ + //right: 320px; + /*right: 290px;*/ + z-index: 1000; + /*right: 0px;*/ + background-color: rgba(5,24,66,.8); + border-radius: 10px 0 0 10px; + .btn-stretch { + width: 20px; + height: 40px; + background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -408px 5px; + cursor: pointer; + /*margin-left: -20px;*/ + transform: rotateY(0deg); + transform-origin: 50% 50%; + transition: transform 1s linear; + /*transition: 3s linear;*/ } + .btn-shrink { + width: 20px; + height: 40px; + background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -408px 5px; + cursor: pointer; + + transform: rotateY(180deg); + transform-origin: 50% 50%; + transition: transform 1s linear; + } + } + + .tab-item { + width: 32px; + height: 30px; + color: @color; + font-size: 12px; + background-color: #0B3B6D; + } + .tab-item:hover{ + cursor: pointer; + } + .panel-tab { + position: absolute; + left: 0; + //height: 120px; + top: 0; + width: 32px; + z-index: 500; + background: url('../../assets/images/map-pages/icon/caidan.png') no-repeat; + } + + .right-control { + /*width: 290px;*/ + //height: 573px; + height: 100%; + position: relative; + top: 0; + right: 0; + z-index: 999; + background: url('../../assets/images/map-pages/icon/bgc.png') no-repeat; + background-size: 100% 98%; + } + .a{ + transform: translateX(328px); + transition: transform 3s linear; + } + .panel_searchTotal { + font-size: 12px; + float: right; + } + + .panel_header { + // background-color: #030D2E; + padding: 8px 15px 3px 20px; + } + + .panel_title { + font-size: 12px; + /*margin: 0px;*/ + /*padding: 0px;*/ + color: #78c4ff; + font-weight: bold; + } + + .el-message-box__content { + background-color: transparent; + } + + .search-form .el-form-item { + /*margin: 0px;*/ + margin-bottom: 8px; + } + + .search-form .el-icon-search { + display: grid; + line-height: 30px; + font-size: 18px; + } + + .search-panel { + border: #07325B; + background-color: #07325B !important; + margin-top: 0px; + + .el-input__inner { + border-radius: 0px !important; + background-color: #061e51 !important; + } + } + + input::-webkit-input-placeholder { + color: #569ee1; + } + + input::-moz-placeholder { + color: #569ee1; + } + + input::-ms-input-placeholder { + color: #569ee1; + } + + input[type=text]:focus { + outline: 1px solid #17e4f6; + // box-shadow: 1px 0px 3px 0px #17e4f6; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); + } + + .search-result { + margin: 5px 0px 0px 0px; + padding: 0px; + border: #051842; + //height: 290px; + height: calc(~"100vh - 180px"); + overflow-y: scroll; + background-color: transparent !important; + margin-bottom: -8px !important; + } + + .offline { + color: #64778B; + } + + .B-TMD-table-list { + margin-top: 10px; + text-align: left; + padding-left: 10px; + //color: #64778B; + color: #34e0ff; + width: 100%; + line-height: 25px; + background: url('../../assets/images/map-pages/icon/dd.png') no-repeat; + } + + .B-TMD-inp-button { + width: 46px; + height: 52px; + position: absolute; + bottom: 8px; + right: 16px; + background: url('../../assets/images/map-pages/icon/icon.png') no-repeat -481px 0; + cursor: pointer; + } + + .footer-page { + position: absolute; + background-color: transparent !important; + bottom: 10px !important; + margin-left: 0px; + border: none; + + .warnPagination { + .btn-quicknext, .btn-quickprev { + color: #e4e8f1 !important; + background-color: transparent; + // border: 1px solid #25AECD; + border-left: 1px solid #25AECD; + border-bottom: 1px solid #25AECD; + border-top: 1px solid #25AECD; + color: #e4e8f1; + } + + .el-pager li { + color: #e4e8f1; + background: transparent; + // border: 1px solid #25AECD; + border-left: 1px solid #25AECD; + border-bottom: 1px solid #25AECD; + border-top: 1px solid #25AECD; + } + + .el-pager li.active { + border-color: #25AECD; + background-color: rgba(38, 222, 253, 0.3); + color: #e4e8f1; + } + + .el-pager li:hover { + border-color: #25AECD; + background-color: rgba(38, 222, 253, 0.3); + color: #34e0ff; + } + + .btn-prev { + background-color: transparent; + // border: 1px solid #25AECD; + border-left: 1px solid #25AECD; + border-bottom: 1px solid #25AECD; + border-top: 1px solid #25AECD; + color: #e4e8f1; + } + + .btn-next { + background-color: transparent; + border: 1px solid #25AECD; + color: #e4e8f1; + } + } + } + + ::-webkit-scrollbar { + width: 7px; + height: 5px !important; + } + + ::-webkit-scrollbar-thumb { + /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/ + border-radius: 10px; + box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); + background: #0661AE; + border: 1px solid transparent; + } + + ::-webkit-scrollbar-track { + /*婊氬姩鏉¢噷闈㈣建閬�*/ + box-shadow : inset 0 0 5px rgba(0, 0, 0, 0.2); + border-radius: 0px; + background: #0E3565; + } + + .selectFrom { + color: #061e51; + border: 1px solid #061e51 !important; + background: #dcc805 !important; + + .el-select-dropdown__list { + background: #061e51 !important; + } + + .el-select-dropdown__item { + color: #949494; + background: #061e51 !important; + } + + .el-select-dropdown__item.hover, + .el-select-dropdown__item:hover { + color: #fff; + background: #061e51 !important; + } + + .popper__arrow { + background-color: #061e51 !important; + } + } + .unfold { + transform: translateX(332px); + transition: transform 0.5s linear; + } + .shrink { + transform: translateX(0px); + transition: transform 0.5s linear; + } +} </style> -- Gitblit v1.8.0