| | |
| | | <el-card class="search-panel"> |
| | | <el-form ref="form" :model="form" label-width="90px" class="search-form"> |
| | | <el-form-item label="管线类型:"> |
| | | <el-input v-model="form.transNo" size="mini" placeholder="在此输入委托单号"></el-input> |
| | | <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.carrierName" size="mini" placeholder="在此输入承运商"></el-input> |
| | | <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.vehicleNo" size="mini" |
| | | <el-input v-model="form.key" size="mini" |
| | | placeholder="在此输入关键字"></el-input> |
| | | </el-form-item> |
| | | <el-form-item> |
| | |
| | | <div class="B-TMD-table-list-content"> |
| | | <div> |
| | | <span>发货企业:</span> |
| | | <span id="b_twe_consignment" :title="item.outWarehouseName">{{ item.outWarehouseName == null ? "暂无" : item.outWarehouseName }}</span> |
| | | <span id="b_twe_consignment" :title="item.outWarehouseName">{{ |
| | | item.outWarehouseName == null ? "暂无" : item.outWarehouseName |
| | | }}</span> |
| | | </div> |
| | | <div> |
| | | <span>承 运 商:</span> |
| | |
| | | import mapApi from '@/api/mapApi' |
| | | import { mapState } from 'vuex' |
| | | |
| | | const ysfsList = [{ |
| | | value: '全部', |
| | | label: '全部' |
| | | }, { |
| | | value: '公路', |
| | | label: '公路' |
| | | }, { |
| | | value: '铁路', |
| | | label: '铁路' |
| | | }, { |
| | | value: '水路', |
| | | label: '水路' |
| | | }] |
| | | const ztList = [{ |
| | | value: '全部', |
| | | label: '全部' |
| | | }, { |
| | | value: '全部卸货', |
| | | label: '全部卸货' |
| | | }, { |
| | | value: '在途', |
| | | label: '在途' |
| | | }] |
| | | export default { |
| | | name: 'MonitorPanel', |
| | | components: { MonitorHZ }, |
| | |
| | | toggleMonitorStyle: 'right:0px', |
| | | list: [], |
| | | total: 0, |
| | | ysfsList, |
| | | ztList, |
| | | 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, |
| | |
| | | current: 1 |
| | | } |
| | | let datas = await this.handleGetDatas(params) |
| | | console.log(datas) |
| | | // this.list = datas.data.records |
| | | // this.total = datas.data.total |
| | | this.list = datas.data.records |
| | | this.total = datas.data.total |
| | | }, |
| | | currentCorp: async function(val) { |
| | | let params = { |
| | |
| | | current: 1 |
| | | } |
| | | let datas = await this.handleGetDatas(params) |
| | | console.log(datas) |
| | | // this.list = datas.data.records |
| | | // this.total = datas.data.total |
| | | this.list = datas.data.records |
| | | this.total = datas.data.total |
| | | } |
| | | }, |
| | | methods: { |
| | | handleClose(done) { |
| | | console.log(done) |
| | | }, |
| | | handlePipelineType(item){ |
| | | console.log(item) |
| | | if(item === '2'){ |
| | | this.dataTypeOptions = this.attachOptions |
| | | }else if(item === '1'){ |
| | | this.dataTypeOptions = this.pipelineOptions |
| | | } |
| | | }, |
| | | async handlePage(page) { |
| | | console.log(page) |
| | |
| | | current: page |
| | | } |
| | | let datas = await this.handleGetDatas(params) |
| | | console.log(datas) |
| | | // this.list = datas.data.records |
| | | // this.total = datas.data.total |
| | | this.list = datas.data.records |
| | | this.total = datas.data.total |
| | | }, |
| | | handleLocation(item) { |
| | | window.vectorLayerHelper.vectorLayerMap.cheliang.showGeometryByXY(item.transNo, item.vehicleNo, item.lng, item.lat) |
| | |
| | | current: this.current |
| | | } |
| | | let datas = await this.handleGetDatas(params) |
| | | console.log(datas) |
| | | // this.list = datas.data.pager.records |
| | | // this.total = datas.data.pager.total |
| | | this.list = datas.data.pager.records |
| | | this.total = datas.data.pager.total |
| | | }, |
| | | async handleInit() { |
| | | // this.list = wayBillData.data |
| | |
| | | current: 1 |
| | | } |
| | | let datas = await this.handleGetDatas(params) |
| | | console.log(datas) |
| | | // this.list = datas.data.records |
| | | // this.total = datas.data.total |
| | | this.list = datas.data.records |
| | | this.total = datas.data.total |
| | | }, |
| | | async handleSetOrgCodeStrings() { |
| | | let orgCodes = await this.handleGetOrgCode() |
| | |
| | | return datas |
| | | }, |
| | | async handleGetDatas(params) { |
| | | // eslint-disable-next-line no-debugger |
| | | // debugger |
| | | // let datas = await mapApi.getTransOrderlist(params) |
| | | // return datas |
| | | return params |
| | | let datas = await mapApi.getTransOrderlist(params) |
| | | return datas |
| | | }, |
| | | showHZ() { |
| | | this.wayBillVisible = true |
| | |
| | | position: absolute; |
| | | right: 10px; |
| | | top: 10px; |
| | | |
| | | .el-card__body { |
| | | padding: 7px; |
| | | } |
| | | |
| | | .el-form-item__content { |
| | | color: rgb(52, 224, 255); |
| | | } |
| | | |
| | | .el-picker-panel { |
| | | background-color: #061e51 !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-input__inner::placeholder { |
| | | color: #9a9494; |
| | | } |
| | | |
| | | /* 谷歌 */ |
| | | |
| | | .el-input__inner::-webkit-input-placeholder { |
| | | color: #9a9494; |
| | | } |
| | | |
| | | /* 火狐 */ |
| | | |
| | | .el-input__inner:-moz-placeholder { |
| | | color: #9a9494; |
| | | } |
| | | |
| | | /*ie*/ |
| | | |
| | | .el-input__inner:-ms-input-placeholder { |
| | | color: #9a9494; |
| | | } |
| | | |
| | | .warning { |
| | | color: #dcc805; |
| | | } |
| | | |
| | | #plateNumber_n a { |
| | | color: rgb(52, 224, 255); |
| | | } |
| | | |
| | | .offline { |
| | | color: #9a9494; |
| | | } |
| | | |
| | | .customInput { |
| | | width: 118px; |
| | | } |
| | | |
| | | .btn-ok{ |
| | | float:right; |
| | | margin-right:10px; |
| | |
| | | color: white; |
| | | border: 1px solid white; |
| | | } |
| | | |
| | | .btn-reset{ |
| | | float:right; |
| | | margin-right:10px; |
| | |
| | | color: white; |
| | | border: 1px solid white; |
| | | } |
| | | |
| | | .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; |
| | | } |
| | | |
| | | .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-title { |
| | | width: 100%; |
| | | height: 50px; |
| | | } |
| | | |
| | | .B-TMD-table-list-head { |
| | | width: 160px; |
| | | float: left; |
| | |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .B-TMD-table-list-title-y-adress { |
| | | width: 16px; |
| | | height: 22px; |
| | | display: block; |
| | | background: url('/assets/images/map-page/icon/icon.png') no-repeat 0 -90px; |
| | | 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-page/icon/icon.png') no-repeat -45px 0; |
| | | 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-page/icon/icon.png') no-repeat -90px 0; |
| | | 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-page/icon/icon.png') no-repeat 0 0; |
| | | 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; |
| | | height: 28px; |
| | | background: url('/assets/images/map-page/icon/icon.png') no-repeat -408px 0; |
| | | 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; |
| | | } |
| | | |
| | | .btn-stretch-active { |
| | | background: url('/assets/images/map-page/icon/icon.png') no-repeat -440px 0; |
| | | background: url('/assets/images/map-pages/icon/icon.png') no-repeat -440px 0; |
| | | } |
| | | |
| | | .panel-tab { |
| | | position: absolute; |
| | | left: 0; |
| | |
| | | width: 40px; |
| | | z-index: 500; |
| | | background-color: #030D2E; |
| | | background: url('/assets/images/map-page/icon/caidan.png') no-repeat; |
| | | 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-page/icon/icon.png') no-repeat -320px 0; |
| | | 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-page/icon/icon.png') no-repeat -169px 0; |
| | | 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-page/icon/icon.png') no-repeat -361px 0 !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-page/icon/icon.png') no-repeat -197px 0 !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 { |
| | | width: 290px; |
| | | height: 573px; |
| | |
| | | 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; |
| | |
| | | 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-input-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; |
| | |
| | | background-color: transparent !important; |
| | | margin-bottom: -8px !important; |
| | | } |
| | | |
| | | .offline { |
| | | color: #64778B; |
| | | } |
| | | |
| | | .B-TMD-table-list { |
| | | margin-top: 10px; |
| | | text-align: left; |
| | |
| | | line-height: 25px; |
| | | background: url('/assets/images/map-pages/icon/dd.png') no-repeat; |
| | | } |
| | | |
| | | .B-TMD-inp-button { |
| | | width: 46px; |
| | | height: 52px; |
| | |
| | | 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; |
| | |
| | | border-top: 1px solid #25AECD; |
| | | color: #e4e8f1; |
| | | } |
| | | |
| | | .el-pager li { |
| | | color: #e4e8f1; |
| | | background: transparent; |
| | |
| | | border-top: 1px solid #25AECD; |
| | | color: #e4e8f1; |
| | | } |
| | | |
| | | .btn-next { |
| | | background-color: transparent; |
| | | border: 1px solid #25AECD; |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | ::-webkit-scrollbar{ |
| | | width: 7px; |
| | | height: 5px !important; |
| | | } |
| | | |
| | | ::-webkit-scrollbar-thumb { |
| | | /*滚动条里面小方块*/ |
| | | border-radius: 10px; |
| | |
| | | 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; |