Skip to content

J
jiedao-app-operator-master
Commit 68c40f49 authored by zhengyi's avatar zhengyi
Browse files
Options

路线选择器bug修复

parent 7f835652
Hide whitespace changes
Inline Side-by-side
Showing with 517 additions and 507 deletions
src/components/RoutersSelector/index.vue
View file @ 68c40f49
<template> <template>
<div> <div>
<div class="filters mb-10" v-if="showFilter"> <div class="filters mb-10" v-if="showFilter">
<template v-if="!type"> <template v-if="!type">
{{$t('运输方式')}} {{ $t('运输方式') }}
<dict-selector :type='DICT_TYPE.ECW_TRANSPORT_TYPE' v-model="transportType" :placeholder="$t('请选择运输方式')" :filter="transportFilter" style="width:150px" /> <dict-selector :type='DICT_TYPE.ECW_TRANSPORT_TYPE' v-model="transportType" :placeholder="$t('请选择运输方式')"
</template> :filter="transportFilter" style="width:150px"/>
{{$t('始发地')}}： </template>
<el-select :placeholder="$t('请选择始发地')" v-model="exportCity" clearable> {{ $t('始发地') }}：
<el-option v-for="item in exportCityList" :key="item.id" :label="item.titleZh" :value="item.id" /> <el-select :placeholder="$t('请选择始发地')" v-model="exportCity" clearable>
</el-select> <el-option v-for="item in exportCityList" :key="item.id" :label="item.titleZh" :value="item.id"/>
</el-select>
{{$t('目的国')}}： {{ $t('目的国') }}：
<el-select :placeholder="$t('请选择目的国')" <el-select :placeholder="$t('请选择目的国')"
v-model="destCountryIds" v-model="destCountryIds"
multiple multiple
clearable> clearable>
<el-option v-for="item in countryList" :key="item.id" :label="$l(item, 'title')" :value="item.id" /> <el-option v-for="item in countryList" :key="item.id" :label="$l(item, 'title')" :value="item.id"/>
</el-select> </el-select>
{{$t('目的城市')}}： {{ $t('目的城市') }}：
<!-- <!--
<el-select :placeholder="$t('请选择目的地')" v-model="importCity" clearable> <el-select :placeholder="$t('请选择目的地')" v-model="importCity" clearable>
<el-option v-for="item in importCityList" :key="item.id" :label="item.titleZh" :value="item.id" /> <el-option v-for="item in importCityList" :key="item.id" :label="item.titleZh" :value="item.id" />
</el-select> </el-select>
--> -->
<el-select :placeholder="$t('请选择目的城市')" <el-select :placeholder="$t('请选择目的城市')"
v-model="destCityIds" v-model="destCityIds"
multiple multiple
clearable> clearable>
<el-option v-for="item in AddressCity" :key="item.shi" :label="item.shiName" :value="item.shi" /> <el-option v-for="item in AddressCity" :key="item.shi" :label="item.shiName" :value="item.shi"/>
</el-select> </el-select>
{{$t('目的仓')}}： {{ $t('目的仓') }}：
<el-select :placeholder="$t('请选择目的仓')" <el-select :placeholder="$t('请选择目的仓')"
v-model="destWarehouseIds" v-model="destWarehouseIds"
multiple multiple
clearable> clearable>
<el-option v-for="item in AddressTown" :key="item.id" :label="item.titleZh" :value="item.id" /> <el-option v-for="item in AddressTown" :key="item.id" :label="item.titleZh" :value="item.id"/>
</el-select> </el-select>
<template v-if="type != 'sea'"> <template v-if="type != 'sea'">
{{$t('出货渠道')}}: {{ $t('出货渠道') }}:
<el-select :placeholder="$t('请选择出货渠道')" v-model="channelId" clearable> <el-select :placeholder="$t('请选择出货渠道')" v-model="channelId" clearable>
<el-option v-for="item in channelList" :key="item.channelId" :label="item.nameZh" :value="item.channelId" /> <el-option v-for="item in channelList" :key="item.channelId" :label="item.nameZh" :value="item.channelId"/>
</el-select> </el-select>
</template> </template>
</div>
<div class="mb-10 flex-row" v-if="showFilter">
<el-radio-group v-model="checkAll">
<el-radio :label="true">{{$t('全选')}}</el-radio>
<el-radio :label="false">{{$t('全不选')}}</el-radio>
</el-radio-group>
<el-link class="ml-20" type="danger">{{$t('已选择{n}条路线', {n: selectedRoutes.length})}}</el-link>
</div>
<el-row class="" :gutter="10">
<template v-for="(item, index) in filteredRouterList">
<el-col :span="12" :key="item.value">
<el-card class="mb-10">
<div slot="header">
{{$l(item, 'label')}}
<el-link type="primary" @click.native="toggleHide(item.value)" style="float:right">{{item._hide ? $t('展开') : $t('折叠')}}</el-link>
</div>
<!--table需要给一个key，否则全选的时候不会自动更新渲染-->
<el-table v-if="!hideMap[item.value]" :data="item.routerList" :span-method="SpanMethod" border :key="item.value">
<el-table-column :label="$t('始发仓')" prop="startTitleZh">
<template slot-scope="{row}">
{{$l(row, 'startTitle')}}
</template>
</el-table-column>
<el-table-column :label="$t('目的仓')" prop="destTitleZh" >
<template slot-scope="{row}">
{{$l(row, 'destTitle')}}
</template>
</el-table-column>
<el-table-column :label="$t('渠道')" prop="startTitleZh" v-if="[3,4].indexOf(+item.value) > -1">
<template slot-scope="{row}">
{{$l(row.channel, 'name')}}
</template>
</el-table-column>
<el-table-column v-if="showAttr" :label="$t('商品特性')" prop="startTitleZh">
<template slot-scope="{row}">
<!--{{ getAttrNames(row.attrId) }}-->
<template v-if="row.channel && row.channel.attrNameList">
{{row.channel.attrNameList.join(',')}}
</template>
</template>
</el-table-column>
<el-table-column :label="$t('操作')" prop="">
<template slot="header">
<el-checkbox @change="toggleGroupChecker(index, $event)" v-model="groupChecker[item.value]"></el-checkbox>
</template>
<template slot-scope="{row}">
<!--给一个Key让他在全选后更新渲染-->
<el-checkbox :key="getSelectedIndex(row)" :checked="getSelectedIndex(row) > -1" @change="toggleChecker(row, $event)"></el-checkbox>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</template>
</el-row>
</div> </div>
<div class="mb-10 flex-row" v-if="showFilter">
<el-radio-group v-model="checkAll">
<el-radio :label="true">{{ $t('全选') }}</el-radio>
<el-radio :label="false">{{ $t('全不选') }}</el-radio>
</el-radio-group>
<el-link class="ml-20" type="danger">{{ $t('已选择{n}条路线', {n: selectedRoutes.length}) }}</el-link>
</div>
<el-row class="" :gutter="10">
<template v-for="(item, index) in filteredRouterList">
<el-col :span="12" :key="item.value">
<el-card class="mb-10">
<div slot="header">
{{ $l(item, 'label') }}
<el-link type="primary" @click.native="toggleHide(item.value)" style="float:right">
{{ item._hide ? $t('展开') : $t('折叠') }}
</el-link>
</div>
<!--table需要给一个key，否则全选的时候不会自动更新渲染-->
<el-table v-if="!hideMap[item.value]" :data="item.routerList" :span-method="SpanMethod" border
:key="item.value">
<el-table-column :label="$t('始发仓')" prop="startTitleZh">
<template slot-scope="{row}">
{{ $l(row, 'startTitle') }}
</template>
</el-table-column>
<el-table-column :label="$t('目的仓')" prop="destTitleZh">
<template slot-scope="{row}">
{{ $l(row, 'destTitle') }}
</template>
</el-table-column>
<el-table-column :label="$t('渠道')" prop="startTitleZh" v-if="[3,4].indexOf(+item.value) > -1">
<template slot-scope="{row}">
{{ $l(row.channel, 'name') }}
</template>
</el-table-column>
<el-table-column v-if="showAttr" :label="$t('商品特性')" prop="startTitleZh">
<template slot-scope="{row}">
<!--{{ getAttrNames(row.attrId) }}-->
<template v-if="row.channel && row.channel.attrNameList">
{{ row.channel.attrNameList.join(',') }}
</template>
</template>
</el-table-column>
<el-table-column :label="$t('操作')" prop="">
<template slot="header">
<el-checkbox @change="toggleGroupChecker(index, $event)"
v-model="groupChecker[item.value]"></el-checkbox>
</template>
<template slot-scope="{row}">
<!--给一个Key让他在全选后更新渲染-->
<el-checkbox :key="getSelectedIndex(row)" :checked="getSelectedIndex(row) > -1"
@change="toggleChecker(row, $event)"></el-checkbox>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
</template>
</el-row>
</div>
</template> </template>
<script> <script>
import {getChannelList} from '@/api/ecw/channel' import {getChannelList} from '@/api/ecw/channel'
...@@ -110,436 +116,440 @@ import {getRegionList} from "@/api/ecw/order"; ...@@ -110,436 +116,440 @@ import {getRegionList} from "@/api/ecw/order";
import {openedRouterList} from '@/api/ecw/warehouse' import {openedRouterList} from '@/api/ecw/warehouse'
import {getProductAttrList} from "@/api/ecw/productAttr"; import {getProductAttrList} from "@/api/ecw/productAttr";
import Template from "@/views/cms/template"; import Template from "@/views/cms/template";
export default { export default {
components: {Template}, components: {Template},
props:{ props: {
value: { value: {
type: Array type: Array
},
option: Object,
// 类型，sea海运，air空运
type: String,
showFilter:{
type: Boolean,
default: true
}
}, },
data(){ option: Object,
return { // 类型，sea海运，air空运
transportTypeDicts: this.getDictDatas(this.DICT_TYPE.ECW_TRANSPORT_TYPE), type: String,
channelList:[], showFilter: {
tradeCityList:[], type: Boolean,
openedRouterList:[], // 开放路线 default: true
transportType: null, // 运输方式 }
importCity: null, // 目的地（进口城市） },
exportCity: null, // 始发地（出口城市） data() {
channelId: null, return {
selectedRoutes: [], // 勾选的路线渠道 transportTypeDicts: this.getDictDatas(this.DICT_TYPE.ECW_TRANSPORT_TYPE),
hideMap: {}, // 折叠状态 channelList: [],
checkAll: null, tradeCityList: [],
groupChecker: {}, // 分组全选状态 openedRouterList: [], // 开放路线
attrList:[], // 商品特性 transportType: null, // 运输方式
inited: false, importCity: null, // 目的地（进口城市）
countryList: [], //目的国 exportCity: null, // 始发地（出口城市）
AddressCity: [], //目的地 channelId: null,
AddressTown: [], //目的仓 selectedRoutes: [], // 勾选的路线渠道
destCountryIds: [], hideMap: {}, // 折叠状态
destCityIds: [], checkAll: null,
destWarehouseIds: [], groupChecker: {}, // 分组全选状态
attrList: [], // 商品特性
inited: false,
countryList: [], //目的国
AddressCity: [], //目的地
AddressTown: [], //目的仓
destCountryId: null,
destCityId: null,
destWarehouseId: null,
destCountryIds: [],
destCityIds: [],
destWarehouseIds: [],
} }
},
computed: {
importCityList() {
return this.tradeCityList.filter(item => item.type == 1 || item.type == 3)
}, },
computed:{ exportCityList() {
importCityList(){ //字典：贸易类型字典region_trade_type，0非进出口，1进口，2出口，3进出口
return this.tradeCityList.filter(item => item.type == 1 || item.type == 3) return this.tradeCityList.filter(item => item.type == 2 || item.type == 3)
}, },
exportCityList(){ exportCityIds() {
//字典：贸易类型字典region_trade_type，0非进出口，1进口，2出口，3进出口 let ids = []
return this.tradeCityList.filter(item => item.type == 2 || item.type == 3) this.exportCityList.forEach(item => {
}, ids.push(item.id)
exportCityIds(){ })
let ids = [] return ids
this.exportCityList.forEach(item => { },
ids.push(item.id) importCityIds() {
}) let ids = []
return ids this.importCityList.forEach(item => {
}, ids.push(item.id)
importCityIds(){ })
let ids = [] return ids
this.importCityList.forEach(item => { },
ids.push(item.id) // 根据选择的渠道筛选
}) availChannelList() {
return ids return this.channelList.filter(item => !this.channelId || this.channelId == item.channelId)
}, },
// 根据选择的渠道筛选 filteredRouterList() {
availChannelList(){ let transportTypeList = []
return this.channelList.filter(item => !this.channelId || this.channelId == item.channelId) this.transportTypeDicts
}, .filter(this.transportFilter)
filteredRouterList(){ .filter(transport => !this.channelId || transport.cssClass == 'channel')
let transportTypeList = [] .forEach(item => {
this.transportTypeDicts if (this.transportType === null || this.transportType == '' || this.transportType == item.value) {
.filter(this.transportFilter) let routerList = []
.filter(transport => !this.channelId || transport.cssClass == 'channel') this.openedRouterList.forEach(router => {
.forEach(item => { if (router.transportType == item.value) {
if(this.transportType === null || this.transportType == '' || this.transportType == item.value){ let availChannels = []
let routerList = [] // 空运相关的，没有可用的渠道则不显示线路
this.openedRouterList.forEach(router => { if (item.cssClass === 'channel') {
if(router.transportType == item.value){ availChannels = this.availChannelList.filter(channel => channel.countryId == router.destCountryId)
let availChannels = [] if (!availChannels.length) return
// 空运相关的，没有可用的渠道则不显示线路 }
if(item.cssClass === 'channel'){
availChannels = this.availChannelList.filter(channel => channel.countryId == router.destCountryId)
if(!availChannels.length) return
}
routerList.push(Object.assign({ routerList.push(Object.assign({
_merge: item.cssClass == 'channel' ? availChannels.length || 1 : 1, _merge: item.cssClass == 'channel' ? availChannels.length || 1 : 1,
channel: item.cssClass == 'channel' ? availChannels[0] || { channelId: 0} : {channelId: 0}, channel: item.cssClass == 'channel' ? availChannels[0] || {channelId: 0} : {channelId: 0},
}, router) }, router)
) )
// 字典的cssClass =channel则表示渠道相关（空运，海空联运） // 字典的cssClass =channel则表示渠道相关（空运，海空联运）
if(item.cssClass == 'channel'){ if (item.cssClass == 'channel') {
availChannels.slice(1).forEach(channel => { availChannels.slice(1).forEach(channel => {
routerList.push(Object.assign({channel, _merge: 0}, router)) routerList.push(Object.assign({channel, _merge: 0}, router))
}) })
} }
} }
}) })
let child = { let child = {
label: item.label, label: item.label,
labelEn: item.labelEn, labelEn: item.labelEn,
value: item.value, value: item.value,
_hide: false, // 是否折叠 _hide: false, // 是否折叠
routerList: routerList routerList: routerList
} }
transportTypeList.push(child) transportTypeList.push(child)
}
})
console.log(transportTypeList)
return transportTypeList
},
// 是否显示商品特性(渠道)
showAttr(){
return this.type == 'air'
},
// 显示产品特性
getAttrName(){
return (id) => {
let item = this.attrList.find(item => item.id === +id)
if(!item) return ''
return this.$l(item, 'attrName')
}
},
// 显示多个商品特性
getAttrNames(){
return (ids) => {
if(!ids) return ''
return ids.split(',').filter( item => !!item).map(id => this.getAttrName(id)).join(',')
} }
})
console.log(transportTypeList)
return transportTypeList
},
// 是否显示商品特性(渠道)
showAttr() {
return this.type == 'air'
},
// 显示产品特性
getAttrName() {
return (id) => {
let item = this.attrList.find(item => item.id === +id)
if (!item) return ''
return this.$l(item, 'attrName')
}
},
// 显示多个商品特性
getAttrNames() {
return (ids) => {
if (!ids) return ''
return ids.split(',').filter(item => !!item).map(id => this.getAttrName(id)).join(',')
}
}
},
watch: {
exportCity() {
this.getOpenedRouterList()
},
/*importCity(){
this.getChannelList()
this.getOpenedRouterList()
},*/
selectedRoutes(val) {
this.$emit('input', val)
// 如果选择发生变化
let total = 0
this.filteredRouterList.forEach(item => {
total += item.routerList.length
})
if (total != val.length && val.length) {
this.checkAll = null
}
},
value(val) {
this.selectedRoutes = val || []
},
checkAll(val) {
if (val === true || val === false) {
console.log('选中全部')
this.filteredRouterList.forEach(item => {
item.routerList.forEach(router => {
if (this.getSelectedIndex(router) > -1 != val) this.toggleChecker(router, val)
})
})
}
},
option(option) {
if (option) {
this.changeOption()
}
},
// 显示的路线发生变化之后，清空已勾选的路线
filteredRouterList() {
if (this.inited) {
this.selectedRoutes = []
Object.keys(this.groupChecker).forEach(key => {
this.groupChecker[key] = false
})
}
},
destCountryIds: {
//监听当前地区值的变化，于与上方地区值进行了双向绑定
deep: true, //深度监听
handler() {
//每当值省份值改变时其下地区值进行清空
this.AddressCity = [];
this.AddressTown = [];
this.destWarehouseIds = "";
this.destCityIds = "";
this.findByprovinceCode();
if (this.destCountryIds && this.destCountryIds.length > 0) {
//1 是所有区域，2 国家，3是市，
this.getAddressCity()
this.getAddressTown()
} else if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.size() > 0
) {
this.getAddressTown()
} }
this.getOpenedRouterList()
},
}, },
watch:{ destCityIds: {
exportCity(){ deep: true, //深度监听 目的仓
this.getOpenedRouterList() handler() {
}, this.AddressTown = [];
/*importCity(){ this.destWarehouseIds = "";
this.getChannelList() this.findBycityCode();
this.getOpenedRouterList() if (
},*/ this.destCountryIds && this.destCountryIds.length > 0 &&
selectedRoutes(val){ this.destCityIds && this.destCityIds.length > 0 &&
this.$emit('input', val) this.destWarehouseIds && this.destWarehouseIds.length > 0
// 如果选择发生变化 ) {
let total = 0 //获取当前城市值id，获取该城市下区域
this.filteredRouterList.forEach(item => {
total += item.routerList.length
})
if(total != val.length && val.length){
this.checkAll = null
}
},
value(val){
this.selectedRoutes = val || []
},
checkAll(val){
if(val === true || val === false){
console.log('选中全部')
this.filteredRouterList.forEach(item => {
item.routerList.forEach(router => {
if(this.getSelectedIndex(router) > -1 != val )this.toggleChecker(router, val)
})
})
}
},
option(option){
if(option){
this.changeOption()
}
},
// 显示的路线发生变化之后，清空已勾选的路线
filteredRouterList(){
if(this.inited){
this.selectedRoutes = []
Object.keys(this.groupChecker).forEach(key => {
this.groupChecker[key] = false
})
}
},
destCountryIds: {
//监听当前地区值的变化，于与上方地区值进行了双向绑定
deep: true, //深度监听
handler() {
//每当值省份值改变时其下地区值进行清空
this.AddressCity = [];
this.AddressTown = [];
this.destWarehouseIds = "";
this.destCityIds = "";
this.findByprovinceCode();
if (this.destCountryIds && this.destCountryIds.length > 0) {
//1 是所有区域，2 国家，3是市，
this.getAddressCity()
this.getAddressTown()
} else if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.size() > 0
) {
this.getAddressTown()
}
this.getOpenedRouterList()
},
},
destCityIds: {
deep: true, //深度监听 目的仓
handler() {
this.AddressTown = [];
this.destWarehouseIds = "";
this.findBycityCode();
if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
//获取当前城市值id，获取该城市下区域
} else if ( } else if (
this.destCountryIds && this.destCountryIds.length > 0 && this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 && this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0 this.destWarehouseIds && this.destWarehouseIds.length > 0
) { ) {
this.getAddressTown() this.getAddressTown()
} else if ( } else if (
this.destCountryIds && this.destCountryIds.length > 0 && this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 this.destCityIds && this.destCityIds.length > 0
) { ) {
this.findByprovinceCode() this.findByprovinceCode()
this.getAddressTown() this.getAddressTown()
} else if ( } else if (
this.destCountryIds && this.destCountryIds.length > 0 && this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 && this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0 this.destWarehouseIds && this.destWarehouseIds.length > 0
) { ) {
//获取当前城市值id，获取该城市下区域 //获取当前城市值id，获取该城市下区域
}
this.getOpenedRouterList()
this.getChannelList()
},
},
destWarehouseIds: {
deep: true, //深度监听
handler() {
if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
//获取当前城市值id，获取该城市下区域
this.findBycityCode()
} else if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
this.getAddressTown()
} else if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
this.findBycityCode()
}
this.getOpenedRouterList()
},
},
},
async created(){
this.tradeCityList = (await getTradeCityList()).data
// 路线需要过滤失效的进出口城市，所以在程序加载后再加载路线
await this.getOpenedRouterList()
if(this.option){
this.changeOption()
} }
await this.$nextTick() this.getOpenedRouterList()
this.getCountryList()
this.getAddressCity()
this.getAddressTown()
this.getChannelList() this.getChannelList()
if(this.value && this.value.length){ },
this.selectedRoutes = this.value },
destWarehouseIds: {
deep: true, //深度监听
handler() {
if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
//获取当前城市值id，获取该城市下区域
this.findBycityCode()
} else if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
this.getAddressTown()
} else if (
this.destCountryIds && this.destCountryIds.length > 0 &&
this.destCityIds && this.destCityIds.length > 0 &&
this.destWarehouseIds && this.destWarehouseIds.length > 0
) {
this.findBycityCode()
} }
this.getOpenedRouterList()
},
},
},
async created() {
this.tradeCityList = (await getTradeCityList()).data
// 路线需要过滤失效的进出口城市，所以在程序加载后再加载路线
await this.getOpenedRouterList()
if (this.option) {
this.changeOption()
}
await this.$nextTick()
this.getCountryList()
this.getAddressCity()
this.getAddressTown()
this.getChannelList()
if (this.value && this.value.length) {
this.selectedRoutes = this.value
}
// 如果显示特性，则需要查询特数据备用 // 如果显示特性，则需要查询特数据备用
if(this.showAttr){ if (this.showAttr) {
this.getAttrList() this.getAttrList()
} }
await this.$nextTick() await this.$nextTick()
this.inited = true this.inited = true
}, },
methods:{ methods: {
getChannelList(){ getChannelList() {
if (this.type == 'sea') return if (this.type == 'sea') return
let query = { let query = {
// cityId: this.importCity // cityId: this.importCity
cityId: this.destCityIds cityId: this.destCityIds
} }
getChannelList(query).then(res => { getChannelList(query).then(res => {
this.channelList = res.data this.channelList = res.data
}) })
}, },
getAttrList(){ getAttrList() {
getProductAttrList().then(res => { getProductAttrList().then(res => {
this.attrList = res.data this.attrList = res.data
}) })
}, },
changeOption(){ changeOption() {
if(!this.option) return if (!this.option) return
console.log("线路信息", this.option) console.log("线路信息", this.option)
this.destCountryId = + this.option.destCountryId || null this.destCountryId = +this.option.destCountryId || null
this.destCityId = +this.option.destCityId || null this.destCityId = +this.option.destCityId || null
this.destWarehouseId = +this.option.destWarehouseId || null this.destWarehouseId = +this.option.destWarehouseId || null
// this.importCity = +this.option.importCity || null // this.importCity = +this.option.importCity || null
this.exportCity = +this.option.exportCity || null this.exportCity = +this.option.exportCity || null
this.transportType = this.option.transportId || null this.transportType = this.option.transportId || null
this.channelId = +this.option.channelId || null this.channelId = +this.option.channelId || null
}, },
// 全选、全不选 某个运输方式所有线路 // 全选、全不选 某个运输方式所有线路
toggleGroupChecker(index, selected){ toggleGroupChecker(index, selected) {
let routerList = this.filteredRouterList[index].routerList let routerList = this.filteredRouterList[index].routerList
console.log(routerList.length, selected) console.log(routerList.length, selected)
routerList.forEach(router => { routerList.forEach(router => {
this.toggleChecker(router, selected) this.toggleChecker(router, selected)
}) })
}, },
async getOpenedRouterList(){ async getOpenedRouterList() {
let params = {} let params = {}
if(this.exportCity){ if (this.exportCity) {
params.startCityId = this.exportCity params.startCityId = this.exportCity
} }
if(this.destCountryIds){ if (this.destCountryIds) {
params.destCountryIds = this.destCountryId params.destCountryIds = this.destCountryId
} }
if(this.destCityIds){ if (this.destCityIds) {
params.destCityIds = this.destCityIds params.destCityIds = this.destCityIds
} }
if(this.destWarehouseIds){ if (this.destWarehouseIds) {
params.destWarehouseIds = this.destWarehouseIds params.destWarehouseIds = this.destWarehouseIds
} }
const res = await openedRouterList(params) const res = await openedRouterList(params)
this.openedRouterList = res.data.filter(item => { this.openedRouterList = res.data.filter(item => {
return this.exportCityIds.indexOf(item.startCityId) > -1 && this.importCityIds.indexOf(item.destCityId) > -1 return this.exportCityIds.indexOf(item.startCityId) > -1 && this.importCityIds.indexOf(item.destCityId) > -1
}) })
}, },
// 切换路线选择 // 切换路线选择
toggleChecker(router, selected){ toggleChecker(router, selected) {
// this.getSelectedIndex(router) // this.getSelectedIndex(router)
/* this.selectedRoutes.forEach((item, i)=>{ /* this.selectedRoutes.forEach((item, i)=>{
if(item.lineId == router.id && item.shippingChannelId == item.channel.id){ if(item.lineId == router.id && item.shippingChannelId == item.channel.id){
index = i index = i
break break
} }
}) */ }) */
if(selected){ if (selected) {
// 先判断是否已勾选 // 先判断是否已勾选
if(this.getSelectedIndex(router) > -1) return if (this.getSelectedIndex(router) > -1) return
this.selectedRoutes.push({ this.selectedRoutes.push({
lineId: router.id, lineId: router.id,
shippingChannelId: router.channel.channelId, shippingChannelId: router.channel.channelId,
transportId: router.transportType transportId: router.transportType
}) })
}else{ } else {
let index = this.getSelectedIndex(router) let index = this.getSelectedIndex(router)
if(index > -1){ if (index > -1) {
this.selectedRoutes.splice(index, 1) this.selectedRoutes.splice(index, 1)
} }
} }
}, },
getSelectedIndex(router){ getSelectedIndex(router) {
return this.selectedRoutes.findIndex(item => { return this.selectedRoutes.findIndex(item => {
return item.lineId == router.id && item.shippingChannelId == router.channel.channelId return item.lineId == router.id && item.shippingChannelId == router.channel.channelId
}) })
}, },
SpanMethod({ row, column, rowIndex, columnIndex }){ SpanMethod({row, column, rowIndex, columnIndex}) {
if (columnIndex < 2 ) { if (columnIndex < 2) {
return { return {
rowspan: row._merge, rowspan: row._merge,
colspan: 1 colspan: 1
} }
} }
return { return {
rowspan: 1, rowspan: 1,
colspan: 1 colspan: 1
} }
}, },
// 折叠，展开 // 折叠，展开
toggleHide(value){ toggleHide(value) {
this.$set(this.hideMap, value, !this.hideMap[value]) this.$set(this.hideMap, value, !this.hideMap[value])
}, },
// 运输方式筛选 // 运输方式筛选
transportFilter(item){ transportFilter(item) {
// 未指定类型则全部可用 // 未指定类型则全部可用
if(!this.type) return true if (!this.type) return true
return (this.type == 'sea' ? ['1','2'] : ['3', '4']).indexOf(item.value) > -1 return (this.type == 'sea' ? ['1', '2'] : ['3', '4']).indexOf(item.value) > -1
}, },
/* 国家 */ /* 国家 */
getCountryList() { getCountryList() {
getListTree({ treeType: 1 }).then((response) => { getListTree({treeType: 1}).then((response) => {
this.countryList = response.data; this.countryList = response.data;
}) })
}, },
getAddressCity() { getAddressCity() {
getRegionList(4, 4).then(({ data }) => { getRegionList(4, 4).then(({data}) => {
this.AddressCity = data; this.AddressCity = data;
}) })
}, },
getAddressTown() { getAddressTown() {
getRegionList(5, 5).then(({ data }) => { getRegionList(5, 5).then(({data}) => {
this.AddressTown = data; this.AddressTown = data;
}) })
}, },
findByprovinceCode() { findByprovinceCode() {
if (this.destCountryIds != null && this.destCountryIds.length > 0) { if (this.destCountryIds != null && this.destCountryIds.length > 0) {
//获取当前省份值id，获取该省份下城市 destCountryId provinceCode //获取当前省份值id，获取该省份下城市 destCountryId provinceCode
getRegionList(2, this.destCountryIds).then(({ data }) => { getRegionList(2, this.destCountryIds).then(({data}) => {
this.AddressCity = data; this.AddressCity = data;
}) })
} }
}, },
findBycityCode() { findBycityCode() {
if (this.destCityIds != null && this.destCityIds.length > 0) { if (this.destCityIds != null && this.destCityIds.length > 0) {
//获取当前城市值id，获取该城市下区域 //获取当前城市值id，获取该城市下区域
getRegionList(3, this.destCityIds).then(({ data }) => { getRegionList(3, this.destCityIds).then(({data}) => {
this.AddressTown = data; this.AddressTown = data;
}) })
} }
}, },
} }
} }
</script> </script>
<style scoped> <style scoped>
.mb-10{ .mb-10 {
margin-bottom: 10px margin-bottom: 10px
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment