You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
966 lines
34 KiB
966 lines
34 KiB
<template> |
|
<basic-container> |
|
<div class="avue-crud" :style="`height:` + height"> |
|
<el-form :disabled="view" ref="form" :model="form" label-width="120px" :rules="rules"> |
|
<el-row :gutter="20"> |
|
<el-col :span="10"> |
|
<el-form-item label="客户名称" prop="province"> |
|
<el-select |
|
style="width: 100%" |
|
v-model="form.clientIds" |
|
filterable |
|
remote |
|
reserve-keyword |
|
placeholder="请输入关键词" |
|
:remote-method="remoteMethod" |
|
:loading="loading" |
|
> |
|
<el-option |
|
v-for="item in clientOptions" |
|
:key="item.id" |
|
:label="item.clientName" |
|
:value="item.id" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="10"> |
|
<el-form-item label="品牌" prop="goalGranary"> |
|
<el-select |
|
style="width: 100%" |
|
v-model="form.brand" |
|
filterable |
|
remote |
|
reserve-keyword |
|
placeholder="请输入关键词" |
|
:remote-method="remoteMethodBrand" |
|
:loading="loading" |
|
> |
|
<el-option |
|
v-for="item in options" |
|
:key="item.brandId" |
|
:label="item.brandName" |
|
:value="item.brandId" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="10" v-if="eachRide"> |
|
<el-form-item label="一口价" prop="goalGranary"> |
|
<el-select style="width: 100%" clearable v-model="form.fixedPrice" @change="choice"> |
|
<el-option label="是" value="2"> 是 </el-option> |
|
<el-option label="否" value="1"> 否 </el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="10" v-if="!buyNow && eachRide"> |
|
<el-form-item label="价格" prop="goalGranary"> |
|
<el-input v-model="form.fixedbuyNowPrice"></el-input> |
|
</el-form-item> |
|
</el-col> |
|
<!-- <el-col :span="10" v-if="buyNow"> |
|
<el-form-item label="每趟计费" prop="goalGranary"> |
|
<el-select |
|
style="width: 100%" |
|
clearable |
|
v-model="form.fixedRide" |
|
@change="choiceRide" |
|
> |
|
<el-option label="是" value="2"> 是 </el-option> |
|
<el-option label="否" value="1"> 否 </el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> --> |
|
<el-col :span="10" v-if="buyNow && !eachRide"> |
|
<el-form-item label="价格" prop="goalGranary"> |
|
<el-input v-model="form.fixedRidePrice"></el-input> |
|
</el-form-item> |
|
</el-col> |
|
<!-- <span v-if="buyNow">--> |
|
<!-- <el-col :span="10" v-if="buyNow && eachRide"> |
|
<el-form-item label="计价方式" prop="province"> |
|
<el-select v-model="form.formulaMode" placeholder="请选择" style="width: 100%"> |
|
<el-option |
|
v-for="item in freight" |
|
:key="item.dictKey" |
|
:label="item.dictValue" |
|
:value="item.dictKey" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> --> |
|
<el-col :span="10" v-if="buyNow && eachRide"> |
|
<el-form-item label="品类" prop="brand"> |
|
<el-cascader |
|
:props="propsType" |
|
:show-all-levels="false" |
|
style="width: 100%" |
|
v-model="form.category" |
|
@change="categoryChange" |
|
></el-cascader> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="10" v-if="buyNow && eachRide"> |
|
<el-form-item label="生效时间" prop="brand"> |
|
<el-date-picker |
|
style="width: 100%" |
|
v-model="form.effectiveTime" |
|
type="datetime" |
|
placeholder="请选择生效时间" |
|
format="YYYY-MM-DD hh:mm:ss" |
|
value-format="YYYY-MM-DD h:m:s a" |
|
/> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="10" v-if="buyNow && eachRide"> |
|
<el-form-item label="截止时间" prop="brand"> |
|
<el-date-picker |
|
style="width: 100%" |
|
v-model="form.expirationTime" |
|
type="datetime" |
|
placeholder="请选择截至时间" |
|
format="YYYY-MM-DD hh:mm:ss" |
|
value-format="YYYY-MM-DD h:m:s a" |
|
/> |
|
</el-form-item> |
|
</el-col> |
|
|
|
<el-col :span="10" v-if="buyNow && eachRide"> |
|
<el-form-item label="服务类型" prop="goalGranary"> |
|
<el-select |
|
v-model="form.typeService" |
|
multiple |
|
placeholder="请选择" |
|
style="width: 100%" |
|
@change="coverCharge" |
|
> |
|
<el-option |
|
v-for="item in freightType" |
|
:key="item.dictKey" |
|
:label="item.dictValue" |
|
:value="item.dictKey" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-form-item> |
|
</el-col> |
|
<el-col :span="24" v-if="buyNow && eachRide"> |
|
<!-- <el-form-item label="服务类型" prop="goalGranary" >--> |
|
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> |
|
<el-tab-pane :label="able" :name="able" v-if="dry"> |
|
<el-col :span="24"> |
|
<el-checkbox-group |
|
v-model="form.artery" |
|
@change="handleCheckedCitiesChange($event, '1')" |
|
class="el_Selectionbox" |
|
> |
|
<el-checkbox |
|
style="width: 16%; margin-bottom: 3%" |
|
v-for="(item, index) in artery" |
|
:key="item.dictKey" |
|
:label="item.dictKey" |
|
>{{ item.dictValue }} |
|
<el-input |
|
type="number" |
|
v-model="item.remark" |
|
placeholder="请输入费用" |
|
:disabled="this.form?.artery?.indexOf(item.dictKey) == -1" |
|
@change="textbox($event, index, '1')" |
|
style="width: 200px" |
|
/> |
|
<el-select |
|
v-model="item.formulaMode" |
|
@change="unitSelection(item, index, '1')" |
|
placeholder="请选择单位" |
|
> |
|
<el-option |
|
v-for="item in freight" |
|
:key="item.dictKey" |
|
:label="item.dictValue" |
|
:value="item.dictKey" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-checkbox> |
|
</el-checkbox-group> |
|
|
|
<!-- </el-form-item>--> |
|
</el-col> |
|
</el-tab-pane> |
|
<el-tab-pane :label="bin" :name="bin" v-if="cabin"> |
|
<el-col :span="24"> |
|
<!-- <el-form-item label="费用类型" prop="freightMark">--> |
|
<el-checkbox-group |
|
v-model="form.entrepot" |
|
@change="handleCheckedCitiesChange($event, '2')" |
|
class="el_Selectionbox" |
|
> |
|
<el-checkbox |
|
style="width: 20%; margin-bottom: 3%" |
|
v-for="(item, index) in entrepot" |
|
:key="item.dictKey" |
|
:label="item.dictKey" |
|
>{{ item.dictValue }} |
|
<el-input |
|
type="number" |
|
v-model="item.remark" |
|
placeholder="请输入费用" |
|
:disabled="this.form?.entrepot?.indexOf(item.dictKey) == -1" |
|
@change="textbox($event, index, '2')" |
|
style="width: 200px" |
|
/> |
|
<el-select |
|
v-model="item.formulaMode" |
|
@change="unitSelection(item, index, '2')" |
|
placeholder="请选择单位" |
|
> |
|
<el-option |
|
v-for="item in freight" |
|
:key="item.dictKey" |
|
:label="item.dictValue" |
|
:value="item.dictKey" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-checkbox> |
|
</el-checkbox-group> |
|
<!-- </el-form-item>--> |
|
</el-col> |
|
</el-tab-pane> |
|
|
|
<el-tab-pane :label="allocate" :name="allocate" v-if="match"> |
|
<el-col :span="24"> |
|
<!-- <el-form-item label="费用类型" prop="freightMark">--> |
|
<el-checkbox-group |
|
v-model="form.delivery" |
|
@change="handleCheckedCitiesChange($event, '3')" |
|
class="el_Selectionbox" |
|
> |
|
<el-checkbox |
|
style="width: 16%; margin-bottom: 3%" |
|
v-for="(item, index) in delivery" |
|
:key="item.dictKey" |
|
:label="item.dictKey" |
|
>{{ item.dictValue }} |
|
<el-input |
|
type="number" |
|
v-model="item.remark" |
|
placeholder="请输入费用" |
|
:disabled="this.form?.delivery?.indexOf(item.dictKey) == -1" |
|
@change="textbox($event, index, '3')" |
|
style="width: 200px" |
|
/> |
|
<el-select |
|
v-model="item.formulaMode" |
|
@change="unitSelection(item, index, '3')" |
|
placeholder="请选择单位" |
|
> |
|
<el-option |
|
v-for="item in freight" |
|
:key="item.dictKey" |
|
:label="item.dictValue" |
|
:value="item.dictKey" |
|
> |
|
</el-option> |
|
</el-select> |
|
</el-checkbox> |
|
</el-checkbox-group> |
|
<!-- </el-form-item>--> |
|
</el-col> |
|
</el-tab-pane> |
|
</el-tabs> |
|
<!-- </el-form-item>--> |
|
</el-col> |
|
<!-- </span>--> |
|
</el-row> |
|
<!-- 表单字段 --> |
|
</el-form> |
|
<!-- 表单按钮 --> |
|
<!-- foot --> |
|
<div class="foot" v-if="!view"> |
|
<div class="dialog-footer"> |
|
<el-button type="primary" icon="el-icon-circle-check" @click="handleSubmit('form')" |
|
>提 交</el-button |
|
> |
|
<!-- <el-button icon="el-icon-circle-close" @click="box = false">取 消</el-button>--> |
|
</div> |
|
</div> |
|
</div> |
|
</basic-container> |
|
</template> |
|
|
|
<script> |
|
import { getDictionaryBiz } from '@/api/system/dict'; |
|
import { getDeptLazyTree } from '@/api/basicdata/basicdataCategory'; |
|
import { selectName } from '@/api/basicdata/basicClient'; |
|
import { getListIdsName } from '@/api/basicdata/basicdataStoreBrand'; |
|
import { mapGetters } from 'vuex'; |
|
import { getDetail, add, update } from '@/api/basicdata/basicdataFreight'; |
|
|
|
export default { |
|
name: 'basicdataFreightFrom', |
|
data() { |
|
return { |
|
able: '', |
|
bin: '', |
|
allocate: '', |
|
options: [], |
|
DryWarehouseDistributionA: [], //干 |
|
DryWarehouseDistributionB: [], //仓 |
|
DryWarehouseDistributionC: [], //配 |
|
DryWarehouseDistributionAID: '', //干线ID |
|
DryWarehouseDistributionBID: '', //仓库ID |
|
DryWarehouseDistributionCID: '', //配送ID |
|
clientOptions: [], //客户集合 |
|
categoryData:[],//品类数据 |
|
categoryDataID:[],//品类数据的ID |
|
activeName: 'second', |
|
// 分页信息 |
|
page: { |
|
currentPage: 1, |
|
pageSize: 30, |
|
total: 40, |
|
}, |
|
// 是否显示查询 |
|
search: true, |
|
buyNow: true, //一口价 |
|
eachRide: true, //每趟费用 |
|
cabin: false, //仓 |
|
dry: false, //干 |
|
match: false, //配 |
|
// 加载中 |
|
loading: true, |
|
// 是否为查看模式 |
|
view: false, |
|
height: 0, |
|
clientType: [], //费用类型 |
|
delivery: [], //配费用类型 |
|
entrepot: [], //仓费用类型 |
|
artery: [], //干费用类型 |
|
|
|
arteryList: [], // 干 |
|
arteryListName: [], // 干 |
|
entrepotList: [], // |
|
entrepotListName: [], // |
|
deliveryList: [], // |
|
deliveryListName: [], // |
|
|
|
freight: [], //计价方式 |
|
freightType: [], //服务类型 |
|
// 表单数据 |
|
form: {}, |
|
rules: { |
|
// province: [ |
|
// { required: true, message: '请选择地址', trigger: 'blur' }, |
|
// // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' } |
|
// ], |
|
}, |
|
propsType: { |
|
lazy: true, |
|
multiple: true, |
|
checkStrictly: true, |
|
lazyLoad:(node, resolve)=> { |
|
console.log(this,'this'); |
|
let _this=this |
|
const { level } = node; |
|
setTimeout(async () => { |
|
// console.log("node/////////",node); |
|
const parentId = node.level === 0 ? 1 : node.data.value; |
|
// console.log("par",parentId); |
|
let shuju = await getDeptLazyTree(parentId); |
|
console.log(shuju,'品类数据'); |
|
shuju.data.data.forEach((item=>{ |
|
_this.categoryData.push(item) |
|
})) |
|
console.log(_this.categoryData,'categoryData'); |
|
// console.log(")))))))))))",shuju); |
|
const nodes = Array.from(shuju.data.data).map(item => ({ |
|
value: item.id, |
|
label: item.title, |
|
leaf: !item.hasChildren, |
|
})); |
|
|
|
// console.log("////////////",nodes); |
|
// 通过调用resolve将子节点数据返回，通知组件数据加载完成 |
|
resolve(nodes); |
|
}, 500); |
|
}, |
|
}, |
|
// 选择行 |
|
selectionList: [], |
|
}; |
|
}, |
|
watch: {}, |
|
mounted() {}, |
|
computed: { |
|
...mapGetters(['permission', 'tagWel', 'tagList']), |
|
ids() { |
|
let ids = []; |
|
this.selectionList.forEach(ele => { |
|
ids.push(ele.id); |
|
}); |
|
return ids.join(','); |
|
}, |
|
}, |
|
created() { |
|
this.init(); |
|
}, |
|
methods: { |
|
bianLier(costListName, clientType, costList, fei) { |
|
//获取费用价格 |
|
console.log('>>>>>>>>>', costListName, clientType, costList, fei); |
|
this.pan = false; |
|
// fei = []; |
|
for (let i = 0; i < costListName.length; i++) { |
|
if (!costList) { |
|
this.pan = true; |
|
return; |
|
} |
|
for (let a = 0; a < clientType.length; a++) { |
|
// console.log("进来了",clientType[a].dictKey , costListName[i]); |
|
if (clientType[a].dictKey == costListName[i]) { |
|
// console.log("进来了",clientType[a].dictKey , costListName[i]); |
|
let zhi = costList[costListName[i]]; |
|
// console.log("zhi>>",zhi); |
|
if (!zhi) { |
|
this.pan = true; |
|
continue; |
|
} else { |
|
//2.添加 |
|
console.log('clientType[a].dictKey,zhi', clientType[a].dictKey, zhi); |
|
fei.set(clientType[a].dictKey, zhi); |
|
} |
|
} |
|
} |
|
} |
|
}, |
|
//整合数据 |
|
integratedData() { |
|
this.form.typeService.forEach(async i => { |
|
switch (i) { |
|
case '1': |
|
let fe = new Map(); |
|
await this.bianLier(this.arteryListName, this.artery, this.arteryList, fe); |
|
if (!this.pan) { |
|
this.form.arter = fe; |
|
} |
|
break; |
|
case '2': |
|
let fei2 = new Map(); |
|
await this.bianLier(this.entrepotListName, this.entrepot, this.entrepotList, fei2); |
|
if (!this.pan) { |
|
this.form.entrepots = fei2; |
|
} |
|
break; |
|
case '3': |
|
let fei3 = new Map(); |
|
await this.bianLier(this.deliveryListName, this.delivery, this.deliveryList, fei3); |
|
if (!this.pan) { |
|
this.form.deliverys = fei3; |
|
} |
|
break; |
|
} |
|
}); |
|
}, |
|
handleSubmit(from) { |
|
//提交修改 |
|
this.$refs[from].validate(async valid => { |
|
if (valid) { |
|
if (!this.form.id) { |
|
let fei = new Map(); |
|
await this.integratedData(); |
|
if (this.pan) { |
|
this.$message.warning('请填写完整已勾选的数据费用'); |
|
return; |
|
} |
|
this.form.arterys = fei; |
|
this.form.clientIds = this.form.clientIds; |
|
this.form.brand = this.form.brand; |
|
this.form.itemName = this.form.clientIds |
|
this.form.category = this.form.category ? this.form.category.flat().join(',') : null; |
|
console.log(this.DryWarehouseDistributionA, '干选择'); |
|
console.log(this.DryWarehouseDistributionB, '仓选择'); |
|
console.log(this.DryWarehouseDistributionC, '配选择'); |
|
// this.DryWarehouseDistributionB, |
|
// this.form.details = this.DryWarehouseDistributionB; |
|
this.form.details = [].concat(...this.DryWarehouseDistributionA, ...this.DryWarehouseDistributionB, ...this.DryWarehouseDistributionC); |
|
console.log('提交的数据》》》', this.form); |
|
console.log(this.categoryDataID,'id'); |
|
console.log(this.categoryData,'名字'); |
|
let matchedData = this.categoryDataID.map(subArray => { |
|
// subArray 应该包含一个元素，即 id |
|
if (subArray.length === 1) { |
|
let idToMatch = subArray[0]; |
|
// 在 datas 中寻找匹配的 id |
|
let matched = this.categoryData.find(data => data.id === idToMatch); |
|
// 如果找到匹配，则返回对应的对象 |
|
if (matched) { |
|
return matched; |
|
} |
|
} |
|
return null; |
|
}).filter(item => item !== null); // 过滤掉任何未匹配的值（null） |
|
console.log(matchedData,'筛选出来的值'); |
|
return |
|
add(this.form).then(() => { |
|
this.$store.commit('DEL_TAG_CURRENT'); //关闭当前页面 |
|
this.$router.push('/basicdata/brand/basicdataFreight'); //添加成功跳转到列表 |
|
this.box = false; |
|
this.onLoad(this.page); |
|
this.$message({ |
|
type: 'success', |
|
message: '操作成功!', |
|
}); |
|
this.contextmenuFlag = false; |
|
|
|
}); |
|
} else { |
|
this.form.clientIds = this.form.clientIds; |
|
this.form.brand = this.form.brand; |
|
console.log('====>>>', this.form); |
|
|
|
update(this.form).then(() => { |
|
this.box = false; |
|
this.onLoad(this.page); |
|
this.$message({ |
|
type: 'success', |
|
message: '操作成功!', |
|
}); |
|
this.contextmenuFlag = false; |
|
this.$store.commit('DEL_TAG_CURRENT'); //关闭当前页面 |
|
this.$router.push('/basicdata/brand/basicdataFreight'); //添加成功跳转到列表 |
|
}); |
|
} |
|
} |
|
}); |
|
}, |
|
|
|
coverCharge(num) { |
|
console.log(num, '仓配选择'); |
|
console.log(this.freightType, 'freightType'); |
|
// = this.freightType.find(res=>res.dictKey).id |
|
// console.log(num); |
|
this.dry = false; |
|
this.cabin = false; |
|
this.match = false; |
|
num.forEach(it => { |
|
switch (it) { |
|
case '1': |
|
this.dry = true; |
|
this.able = '干'; |
|
this.activeName = '干'; |
|
this.DryWarehouseDistributionAID = ''; //先置空 |
|
console.log(it,'it====='); |
|
this.DryWarehouseDistributionAID = this.freightType.find(res => res.dictKey == it).id; |
|
break; |
|
case '2': |
|
console.log(num,'num'); |
|
this.cabin = true; |
|
this.bin = '仓'; |
|
this.activeName = '仓'; |
|
this.DryWarehouseDistributionBID = ''; //先置空 |
|
this.DryWarehouseDistributionBID = this.freightType.find(res => res.dictKey == it).id; |
|
break; |
|
case '3': |
|
this.match = true; |
|
this.allocate = '配'; |
|
this.activeName = '配'; |
|
this.DryWarehouseDistributionCID = ''; //先置空 |
|
this.DryWarehouseDistributionCID = this.freightType.find(res => res.dictKey == it).id; |
|
|
|
break; |
|
} |
|
}); |
|
}, |
|
handleClick(tab, event) { |
|
//tab 选择 |
|
// console.log(tab, event); |
|
}, |
|
choice(a) { |
|
//一口价选择 |
|
console.log(a); |
|
if (a == '2') { |
|
this.buyNow = false; |
|
} else { |
|
this.buyNow = true; |
|
} |
|
}, |
|
choiceRide(a) { |
|
//一口价选择 |
|
console.log(a); |
|
if (a == '2') { |
|
this.eachRide = false; |
|
} else { |
|
this.eachRide = true; |
|
} |
|
}, |
|
remoteMethodBrand(query) { |
|
//客户下拉 |
|
console.log('客户ID=====', this.form.clientIds); |
|
if (query !== '') { |
|
this.loading = true; |
|
setTimeout(async () => { |
|
this.loading = false; |
|
// this.options = this.list.filter(item => { |
|
// return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1; |
|
// }); |
|
let a = await getListIdsName(this.page.currentPage, this.page.pageSize, { |
|
brandName: query, |
|
ids: this.form.clientIds, |
|
}); |
|
console.log('>>>>>>>>>>', a.data.data); |
|
this.options = a.data.data.filter(item => { |
|
return item.brandName.toLowerCase().includes(query.toLowerCase()); |
|
}); |
|
}, 200); |
|
} else { |
|
this.options = []; |
|
} |
|
}, |
|
remoteMethod(query) { |
|
//客户下拉 |
|
if (query !== '') { |
|
this.loading = true; |
|
setTimeout(async () => { |
|
this.loading = false; |
|
// this.options = this.list.filter(item => { |
|
// return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1; |
|
// }); |
|
let a = await selectName(this.page.currentPage, this.page.pageSize, { |
|
clientName: query, |
|
}); |
|
console.log('>>>>>>>>>>', a.data.data.records); |
|
this.clientOptions = a.data.data.records.filter(item => { |
|
return item.clientName.toLowerCase().includes(query.toLowerCase()); |
|
}); |
|
}, 200); |
|
} else { |
|
this.clientOptions = []; |
|
} |
|
}, |
|
textbox(e, index, ole) { |
|
//费用价格填写 |
|
// console.log("e,index",e,index); |
|
console.log(e, 'e'); |
|
console.log(index + 1, 'index'); |
|
console.log(ole, 'ole'); |
|
switch (ole) { |
|
case '1': |
|
console.log(this.artery, 'this.artery'); |
|
let resDataIdA = this.artery.find(item => item.dictKey == index + 1); //筛选ID匹配的数据 |
|
console.log(resDataIdA, 'resDataIdA'); |
|
console.log(this.DryWarehouseDistributionA, 'this.DryWarehouseDistributionA'); |
|
|
|
let tmpData = this.DryWarehouseDistributionA.find( |
|
res => res.itemName == resDataIdA.dictValue |
|
); |
|
console.log(tmpData,'tmpData'); |
|
tmpData.cost = e; //价格重新赋值 |
|
console.log(this.DryWarehouseDistributionA, 'this.DryWarehouseDistributionA'); |
|
console.log(this.DryWarehouseDistributionA, '处理好的仓库数据'); |
|
|
|
|
|
|
|
|
|
this.arteryList[index + 1] = e; |
|
break; |
|
case '2': |
|
console.log(this.entrepot, 'this.entrepot'); |
|
let resDataIdB = this.entrepot.find(item => item.dictKey == index + 1); //筛选ID匹配的数据 |
|
console.log(resDataIdB, 'resDataIdB'); |
|
|
|
let tmpDatb = this.DryWarehouseDistributionB.find( |
|
res => res.itemName == resDataIdB.dictValue |
|
); |
|
tmpDatb.cost = e; //价格重新赋值 |
|
console.log(this.DryWarehouseDistributionB, 'this.DryWarehouseDistributionB'); |
|
console.log(this.DryWarehouseDistributionB, '处理好的仓库数据'); |
|
|
|
this.entrepotList[index + 1] = e; |
|
|
|
break; |
|
case '3': |
|
|
|
console.log(this.delivery, 'this.delivery'); |
|
let resDataIdC = this.delivery.find(item => item.dictKey == index + 1); //筛选ID匹配的数据 |
|
console.log(resDataIdC, 'resDataIdB'); |
|
|
|
let tmpDatC = this.DryWarehouseDistributionC.find( |
|
res => res.itemName == resDataIdC.dictValue |
|
); |
|
tmpDatC.cost = e; //价格重新赋值 |
|
console.log(this.DryWarehouseDistributionC, 'this.DryWarehouseDistributionC'); |
|
console.log(this.DryWarehouseDistributionC, '处理好的仓库数据'); |
|
|
|
|
|
|
|
this.deliveryList[index + 1] = e; |
|
break; |
|
} |
|
}, |
|
// 单位筛选 |
|
unitSelection(e, index, ole) { |
|
console.log(e, 'e====>'); |
|
switch (ole) { |
|
case '1': |
|
|
|
console.log(this.artery, 'this.artery'); |
|
let resDataIdA = this.artery.find(item => item.dictValue == e.dictValue); //筛选ID匹配的数据 |
|
console.log(resDataIdA, 'resDataIdB筛选出来的'); |
|
let resulta = this.DryWarehouseDistributionA.find( |
|
item => item.itemName == resDataIdA.dictValue |
|
); //筛选ID匹配的数据 |
|
resulta.formulaMode = this.freight.find(res => res.dictKey == e.formulaMode).id; |
|
resulta.formulaModeName = this.freight.find( |
|
res => res.dictKey == e.formulaMode |
|
).dictValue; |
|
break; |
|
case '2': |
|
// console.log(this.entrepot,'this.entrepot'); |
|
// console.log(e,'e'); |
|
console.log(index + 1, 'index'); |
|
// console.log(ole,'ole'); |
|
|
|
let resDataIdB = this.entrepot.find(item => item.dictValue == e.dictValue); //筛选ID匹配的数据 |
|
console.log(resDataIdB, 'resDataIdB筛选出来的'); |
|
console.log(this.DryWarehouseDistributionB, 'this.DryWarehouseDistributionB'); |
|
let resultb = this.DryWarehouseDistributionB.find( |
|
item => item.itemName == resDataIdB.dictValue |
|
); //筛选ID匹配的数据 |
|
console.log(resultb, 'resultb'); |
|
resultb.formulaMode = this.freight.find(res => res.dictKey == e.formulaMode).id; |
|
resultb.formulaModeName = this.freight.find( |
|
res => res.dictKey == e.formulaMode |
|
).dictValue; |
|
console.log(this.DryWarehouseDistributionB, '处理好的仓库数据'); |
|
|
|
break; |
|
case '3': |
|
|
|
|
|
let resDataIdC = this.delivery.find(item => item.dictValue == e.dictValue); //筛选ID匹配的数据 |
|
let resultc = this.DryWarehouseDistributionC.find( |
|
item => item.itemName == resDataIdC.dictValue |
|
); //筛选ID匹配的数据 |
|
|
|
resultc.formulaMode = this.freight.find(res => res.dictKey == e.formulaMode).id; |
|
resultc.formulaModeName = this.freight.find( |
|
res => res.dictKey == e.formulaMode |
|
).dictValue; |
|
break; |
|
} |
|
}, |
|
categoryChange(val,a){ |
|
console.log(val,a); |
|
let newArray = val.map(subArray => { |
|
// 如果内层数组长度大于 1，则只取最后一个元素组成新的数组 |
|
if (subArray.length > 1) { |
|
return [subArray[subArray.length - 1]]; |
|
} |
|
// 否则，直接保留这个数组 |
|
return subArray; |
|
}); |
|
this.categoryDataID=newArray |
|
console.log(this.categoryDataID,'data中的数据'); |
|
console.log(newArray,'重新组织的'); |
|
}, |
|
|
|
handleCheckedCitiesChange(value, index) { |
|
//费用选择 |
|
console.log('>>>>>>>', value, index); |
|
switch (index) { |
|
case '1': |
|
if (value.length < 1) { |
|
// console.log("111进来了》》》"); |
|
this.arteryList = []; |
|
this.arteryListName = []; |
|
} |
|
console.log(this.artery,'this.artery.'); |
|
|
|
console.log(value, 'value===='); |
|
let resulta = this.artery.filter(item => value.includes(item.dictKey)); |
|
console.log(resulta, '勾选的数据'); |
|
console.log(this.artery, 'artery'); |
|
resulta.forEach(item => { |
|
// 检查该项是否已经在数组中存在 |
|
if (!this.DryWarehouseDistributionA.some(b => b.itemId === item.dictKey)) { |
|
this.DryWarehouseDistributionA.push({ |
|
cost: item.remark, // 费用 |
|
itemName: item.dictValue, // 费用名称 |
|
itemId: item.dictKey, // 费用名称ID |
|
typeId: this.DryWarehouseDistributionAID ? this.DryWarehouseDistributionAID : null, |
|
typeName: '干线', |
|
}); |
|
} |
|
}); |
|
console.log(this.DryWarehouseDistributionA, '勾选处理好的数据'); |
|
|
|
|
|
|
|
|
|
this.artery.forEach(i => { |
|
// console.log("value.includes(i.dictkey)",value,i.dictKey); |
|
if (value.includes(i.dictKey)) { |
|
console.log('干', index, i); |
|
// i.pitch = true; |
|
this.arteryListName = value; |
|
} |
|
}); |
|
break; |
|
case '2': |
|
if (value.length < 1) { |
|
// console.log("222进来了》》》"); |
|
this.entrepotList = []; |
|
this.entrepotListName = []; |
|
} |
|
// this.DryWarehouseDistributionB=[];//置空已经选择的 |
|
console.log(value, 'value===='); |
|
let resultb = this.entrepot.filter(item => value.includes(item.dictKey)); |
|
console.log(resultb, '勾选的数据'); |
|
console.log(this.entrepot, 'entrepot'); |
|
resultb.forEach(item => { |
|
// 检查该项是否已经在数组中存在 |
|
if (!this.DryWarehouseDistributionB.some(b => b.itemId === item.dictKey)) { |
|
this.DryWarehouseDistributionB.push({ |
|
cost: item.remark, // 费用 |
|
itemName: item.dictValue, // 费用名称 |
|
itemId: item.dictKey, // 费用名称ID |
|
typeId: this.DryWarehouseDistributionBID ? this.DryWarehouseDistributionBID : null, |
|
typeName: '仓库', |
|
}); |
|
} |
|
}); |
|
console.log(this.DryWarehouseDistributionB, '勾选处理好的数据'); |
|
this.entrepot.forEach(i => { |
|
// console.log("value.includes(i.dictkey)",value,i.dictKey); |
|
if (value.includes(i.dictKey)) { |
|
// console.log("仓",index,i); |
|
// i.pitch = true; |
|
this.entrepotListName = value; |
|
} |
|
}); |
|
break; |
|
case '3': |
|
if (value.length < 1) { |
|
// console.log("333进来了》》》"); |
|
this.deliveryList = []; |
|
this.deliveryListName = []; |
|
} |
|
|
|
|
|
|
|
console.log(value, 'value===='); |
|
let resultc = this.delivery.filter(item => value.includes(item.dictKey)); |
|
resultc.forEach(item => { |
|
// 检查该项是否已经在数组中存在 |
|
if (!this.DryWarehouseDistributionC.some(b => b.itemId === item.dictKey)) { |
|
this.DryWarehouseDistributionC.push({ |
|
cost: item.remark, // 费用 |
|
itemName: item.dictValue, // 费用名称 |
|
itemId: item.dictKey, // 费用名称ID |
|
typeId: this.DryWarehouseDistributionCID ? this.DryWarehouseDistributionCID : null, |
|
typeName: '配送', |
|
}); |
|
} |
|
}); |
|
console.log(this.DryWarehouseDistributionB, '勾选处理好的数据'); |
|
|
|
|
|
|
|
this.delivery.forEach(i => { |
|
// console.log("value.includes(i.dictkey)",value,i.dictKey); |
|
if (value.includes(i.dictKey)) { |
|
// console.log("配",index,i); |
|
// i.pitch = true; |
|
this.deliveryListName = value; |
|
} |
|
}); |
|
break; |
|
} |
|
}, |
|
init() { |
|
this.height = this.setPx(document.body.clientHeight - 155); |
|
//字典 |
|
// getDictionaryBiz('jg_freight_mark').then(res => { |
|
// // console.log("字典》》》",res); |
|
// this.clientType = res.data.data; |
|
// }); |
|
//字典 |
|
getDictionaryBiz('basic_freight_formulamode').then(res => { |
|
// console.log("字典》》》",res); |
|
this.freight = res.data.data; |
|
}); |
|
//字典 |
|
getDictionaryBiz('basic_freight_type').then(res => { |
|
// console.log("字典》》》",res); |
|
this.freightType = res.data.data; |
|
}); |
|
getDictionaryBiz('artery').then(res => { |
|
//干线 |
|
// console.log("字典》》》",res); |
|
this.artery = res.data.data; |
|
}); |
|
getDictionaryBiz('entrepot').then(res => { |
|
//仓 |
|
// console.log("字典》》》",res); |
|
this.entrepot = res.data.data; |
|
}); |
|
getDictionaryBiz('delivery').then(res => { |
|
// 配 |
|
// console.log("字典》》》",res); |
|
this.delivery = res.data.data; |
|
}); |
|
|
|
}, |
|
}, |
|
}; |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
::v-deep .el-tabs__nav-scroll { |
|
width: 20% !important; |
|
margin: 0 auto !important; |
|
} |
|
|
|
::v-deep .el-tabs__item { |
|
font-size: 18px; |
|
} |
|
.foot { |
|
position: fixed; |
|
right: 0; |
|
bottom: 0; |
|
left: 0; |
|
z-index: 999; |
|
height: 60px; |
|
} |
|
.foot .dialog-footer { |
|
margin-bottom: 130px; |
|
text-align: center; |
|
} |
|
.ca .el-radio__inner { |
|
top: -18px; |
|
left: -19px; |
|
border-radius: 0; |
|
border: 0; |
|
width: 170px; |
|
height: 34px; |
|
background-color: transparent; |
|
cursor: pointer; |
|
box-sizing: border-box; |
|
position: absolute; |
|
} |
|
|
|
.ca .el-radio__input.is-checked .el-radio__inner { |
|
background: transparent; |
|
} |
|
.el_Selectionbox { |
|
display: flex; |
|
flex-wrap: wrap; |
|
.el-checkbox { |
|
width: 31% !important; |
|
} |
|
} |
|
</style>
|
|
|