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.
 
 
 
 

860 lines
26 KiB

<template>
<basic-container>
<div class="avue-crud">
<!-- <el-row :hidden="!search" style="padding:6px 18px">-->
<!-- &lt;!&ndash; 查询模块 &ndash;&gt;-->
<!-- <el-form :inline="true" :model="query">-->
<!-- &lt;!&ndash; 查询按钮 &ndash;&gt;-->
<!-- <el-form-item>-->
<!-- <el-button type="primary" icon="el-icon-search" @click="searchChange"> </el-button>-->
<!-- <el-button icon="el-icon-delete" @click="searchReset()"> </el-button>-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- </el-row>-->
<el-row :gutter="24" class="rows">
<el-col :xl="7" :lg="7" :md="8" :sm="24" >
<span style="padding-left: 10%" >配送总车次{{statistics.vehiclesNub}}/总包件数{{statistics.deliveriesTotal}}/总库存品数{{statistics.dinventoryTotal}} </span>
</el-col>
<el-col :xl="7" :lg="7" :md="8" :sm="24">
<span>商配总车次{{statistics.commercialNub}}/总包件数{{statistics.commercialTotal}}/总库存品数{{statistics.cinventoryTotal}} </span>
</el-col>
<el-col :xl="7" :lg="7" :md="8" :sm="24">
<span>市配总车次{{statistics.marketNub}}/总包件数{{statistics.marketTotal}}/总库存品数{{statistics.minventoryTotal}} </span>
</el-col>
</el-row>
<el-row style="margin-top: 30px">
<div class="avue-crud__header">
<!-- 头部左侧按钮模块 -->
<div class="avue-crud__left" style="margin-top: 20px">
<!-- <el-button type="primary" icon="el-icon-plus" @click="handleAdd"> </el-button>-->
<!-- <el-button type="danger" icon="el-icon-delete" @click="handleDelete" plain> </el-button>-->
</div>
<!-- 头部右侧按钮模块 -->
<div class="avue-crud__right">
<el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
<el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
<el-button icon="el-icon-search" @click="searchHide" circle></el-button>
</div>
</div>
</el-row>
<el-row>
<!-- 列表模块 -->
<tablecmt
:columnList="columnList"
:tableData="data"
:loading="loading"
@inputTxt="inputsc"
@timeCheck="timesc"
@btnCheck="btnsc"
@selectCheck="selectsc"
@selection="selectionsc"
>
<template #default="slotProps">
<el-button size="small" @click="editsolt(slotProps.scope)"> </el-button>
<el-button size="small" @click="editmap(slotProps.scope)"> </el-button>
<el-button size="small" @click="costadd(slotProps.scope)"> </el-button>
</template>
</tablecmt>
<!-- <el-table ref="table" v-loading="loading"-->
<!-- @selection-change="selectionChange"-->
<!-- :data="data"-->
<!-- :height="height"-->
<!-- style="width: 100%"-->
<!-- :border="option.border">-->
<!--&lt;!&ndash; <el-table-column type="selection" v-if="option.selection" width="55" align="center"></el-table-column>&ndash;&gt;-->
<!-- <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>-->
<!--&lt;!&ndash; <el-table-column v-if="option.index" label="#" type="index" width="50" align="center">&ndash;&gt;-->
<!--&lt;!&ndash; </el-table-column>&ndash;&gt;-->
<!-- <template v-for="(item,index) in option.column">-->
<!-- &lt;!&ndash; table字段 &ndash;&gt;-->
<!-- <el-table-column v-if="item.hide!==true"-->
<!-- :prop="item.prop"-->
<!-- :label="item.label"-->
<!-- :width="item.width"-->
<!-- :key="index">-->
<!-- </el-table-column>-->
<!-- </template>-->
<!-- &lt;!&ndash; 操作栏模块 &ndash;&gt;-->
<!-- <el-table-column prop="menu" label="操作" :width="220" align="center">-->
<!-- <template #="{row}">-->
<!--&lt;!&ndash; <el-button type="primary" text icon="el-icon-view" @click="handleView(row)">查看</el-button>&ndash;&gt;-->
<!-- <el-button type="primary" text icon="el-icon-view" @click="handleViewBlank(row)">查看</el-button>-->
<!-- <el-button type="primary" text icon="el-icon-view" @click="handleViewBlank(row)">查看地图</el-button>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- </el-table>-->
</el-row>
<el-row>
<div class="avue-crud__pagination" style="width:100%">
<!-- 分页模块 -->
<el-pagination align="right"
background
@size-change="sizeChange"
@current-change="currentChange"
:current-page="page.currentPage"
:page-sizes="[10, 20, 30, 40, 50, 100]"
:page-size="page.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="page.total">
</el-pagination>
</div>
</el-row>
<!-- 表单模块 -->
</div>
<el-dialog
v-model="dialogVisible"
title="增值服务"
width="30%"
:before-close="handleClose">
<el-form-item label="增值服务" prop="freightMark">
<el-checkbox-group v-model="form.addvalueType" @change="handleCheckedCitiesChange">
<el-checkbox style="width: 100%;margin-bottom: 3%;"
v-for="(item,index) in addvalueServeTypeData"
:key="item.dictKey"
:label="item.dictKey"
>{{item.dictValue}}
<span v-if="index===0||index===6||index===2||index===4">&nbsp;件数:
<el-input type="number" v-model="item.f"
:disabled="this.form?.freightMark?.indexOf(item.dictKey) == -1"
@change="textbox($event,index,1)"
style="width: 20%;border:none; border-bottom:2px solid #eee;"/>
</span>
<span v-if="index===1">公里:
<el-input type="primary" v-model="item.a"
:disabled="this.form?.freightMark?.indexOf(item.dictKey) == -1"
@change="textbox($event,index,2)"
style="width: 20%;border:none; border-bottom:2px solid #eee;"/>
</span>
<span v-if="index===3">距离:
<el-input type="number" v-model="item.b"
:disabled="this.form?.freightMark?.indexOf(item.dictKey) == -1"
@change="textbox($event,index,3)"
style="width: 20%;border:none; border-bottom:2px solid #eee;"/>
</span>
<span v-if="index===5">人数:
<el-input type="number" v-model="item.c"
:disabled="this.form?.freightMark?.indexOf(item.dictKey) == -1"
@change="textbox($event,index,4)"
style="width: 20%;border:none; border-bottom:2px solid #eee;"/>
</span>
<span v-if="index===0">楼层:
<el-input type="number" v-model="item.d"
:disabled="this.form?.freightMark?.indexOf(item.dictKey) == -1"
@change="textbox($event,index,5)"
style="width: 20%;border:none; border-bottom:2px solid #eee;"/>
</span>
<span v-if="item">预计费用:
<el-input type="number" v-model="item.e"
:disabled="this.form?.freightMark?.indexOf(item.dictKey) == -1"
@change="textbox($event,index,6)"
style="width: 20%;border:none; border-bottom:2px solid #eee;"/>
</span>
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="aaa">
确定(增值服务)
</el-button>
</span>
</template>
</el-dialog>
</basic-container>
<edittablehead
@setcolum="setnewcolum"
@closce="showdrawer"
:drawerShow="drawerShow"
:columnList="columnList"
></edittablehead>
</template>
<script>
import { getList, getDetail, add, update, remove,getPage,getstatistics } from "@/api/distribution/distributionDeliveryList";
import option from "@/option/distribution/distributionDeliveryList";
import { mapGetters } from "vuex";
import { getDictionaryBiz } from '@/api/system/dict';
import { addIncrement } from '@/api/distribution/distributionStockArticle';
export default {
data () {
return {
height: 0,
// 弹框标题
title: '',
// 是否展示弹框
box: false,
// 是否显示查询
search: true,
// 加载中
loading: true,
// 是否为查看模式
view: false,
// 查询信息
query: {},
//数据统计
statistics:{},
drawerShow: false,
// 分页信息
page: {
currentPage: 1,
pageSize: 10,
total: 40
},
//配送类型
deliverytypeData:[],
//配送种类
deliverykindData:[],
//配送状态
deliveryliststateData:[],
// 表单数据
form: {},
// 选择行
selectionList: [],
columnList: [
// {
// prop: '',
// label: '序号',
// type: 0,
// values: '',
// width: 55,
// checkarr: [],
// fixed: true,
// },
{
prop: 'trainNumber',
label: '车次',
type: 2,
values: '',
width: '150',
checkarr: [],
fixed: true,
sortable: true,
// head: true,
},
{
prop: 'warehouseName',
label: '仓库',
type: 2,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'kind',
label: '配送种类',
type: 3,
values: '',
width: '180',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'vehicleName',
label: '配送车辆',
type: 2,
values: '',
width: '180',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'driverName',
label: '配送司机',
type: 2,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'distributionCompany',
label: '配送公司',
type: 2,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'state',
label: '配送状态',
type: 3,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'customersNumber',
label: '配送客户数',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'price',
label: '配送价格',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'fee',
label: '增值服务',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'orderNumber',
label: '订单总数',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'deliveryNumber',
label: '配送包件数',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'inventoryNub',
label: '配送库存品件数',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'scannedNumber',
label: '扫描件数',
type: 1,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: 'loadingTeamName',
label: '装卸班组',
type: 2,
values: '',
width: '150',
checkarr: [],
fixed: false,
sortable: true,
},
{
prop: '',
label: '操作',
type: 6,
values: '',
width: '150',
checkarr: [],
fixed:'right',
sortable: false,
}
// 更多列的配置...
],
// 表单配置
option: option,
//增值服务弹窗
dialogVisible: false,
//增值服务字典列表
addvalueServeTypeData: [],
//增值服务列表
addvalueServeType: [],
//配送方式字典列表
deliveryWayData: [],
//增值服务对象
addvalueObj: {},
//订单行数据
orderInfo: {},
deliverId: null,
//费用列表
feeList: [],
//楼层
floorList: [],
// 表单列表
data: [],
}
},
mounted () {
this.queryDictionary();
this.init();
/**
* 初始化获取本地缓存的编辑隐藏的列表
* 固定搭配,不能更改
*/
let checkListnewarr = this.$functions.getStorage(window.location.pathname+'checkList');
let flexListnewarr = this.$functions.getStorage(window.location.pathname+'flexList');
let sortlistnewarr = this.$functions.getStorage(window.location.pathname+'sortlist');
if (checkListnewarr) {
this.columnList.map(item => {
item.head = false;
});
checkListnewarr.map(ite => {
this.columnList.map(item => {
if (ite == item.label) {
item.head = true;
}
});
});
}else{
let arr=[]
this.columnList.map(item => {
if(item.head){
arr.push(item.label)
}
});
this.$functions.setStorage(window.location.pathname+'checkList',arr)
}
if (flexListnewarr) {
this.columnList.map(item => {
item.fixed = false;
});
flexListnewarr.map(ite => {
this.columnList.map(item => {
if (ite == item.label) {
if(item.type==6){
item.fixed = 'right';
}else{
item.fixed = true;
}
}
});
});
}else{
let arr=[]
this.columnList.map(item => {
if(item.fixed){
arr.push(item.label)
}
});
this.$functions.setStorage(window.location.pathname+'flexList',arr)
}
if (sortlistnewarr) {
this.columnList.map(item => {
item.sortable = false;
});
sortlistnewarr.map(ite => {
this.columnList.map(item => {
if (ite == item.label) {
item.sortable = true;
}
});
});
}else{
let arr=[]
this.columnList.map(item => {
if(item.sortable){
arr.push(item.label)
}
});
this.$functions.setStorage(window.location.pathname+'sortlist',arr)
}
},
computed: {
...mapGetters(["permission"]),
ids () {
let ids = [];
this.selectionList.forEach(ele => {
ids.push(ele.id);
});
return ids.join(",");
}
},
methods: {
showdrawer(value){
this.drawerShow=value
},
/**
* 弹窗的勾选回调,用于更改头部数组
* 固定搭配,只需要更换 columnList
*/
setnewcolum(newarr, headarr,type) {
// console.log(newarr,'+++++++++++')
if(type==1){
this.columnList = newarr;
this.$functions.setStorage(window.location.pathname+'checkList', headarr);
}else if(type==2){
this.columnList = newarr;
this.$functions.setStorage(window.location.pathname+'flexList', headarr);
}else if(type==3){
this.columnList = newarr;
this.$functions.setStorage(window.location.pathname+'sortlist', headarr);
}
},
handleCheckedCitiesChange(value) {
if (value) {
this.form.addvalueType = value;
}
console.log('>>>>>', this.form);
if (value.length < 1) {
this.costList = [];
this.costListName = [];
}
this.deliveryWayData.forEach(i => {
if (value.includes(i.dictKey)) {
console.log(i);
i.pitch = true;
this.costListName = value;
}
});
},
textbox(e, index, a) {
if (a === 6) {
this.feeList[index + 1] = e;
return;
}
if (a === 5)
if (index === 0 && a === 5) {
this.floorList[index + 1] = e;
return;
}
this.costList[index + 1] = e;
//费用列表
},
aaa() {
let addvalueInfos = [];
this.form.addvalueType.forEach((item, index) => {
let addvalueInfo = {};
addvalueInfo.addvalueId = item;
if (item == 1 || item == 3 || item == 5 || item == 7) {
addvalueInfo.number = this.costList[item];
}
if (item == 2) {
addvalueInfo.kilometer = this.costList[item];
}
if (item == 4) {
addvalueInfo.distance = this.costList[item];
}
if (item == 6) {
addvalueInfo.peopleNum = this.costList[item];
}
if (this.floorList.length > 1) {
addvalueInfo.floor = this.floorList[1];
this.floorList = [];
}
addvalueInfo.fee = this.feeList[item];
addvalueInfos.push(addvalueInfo);
});
let params = {};
params.id = this.deliverId;
params.addvalue = addvalueInfos;
params.relatedId=2
console.log("params>>>>>>>>>>>>>>>>>>",params);
addIncrement(params).then(res => {
this.dialogVisible = false;
this.$message({
type: 'success',
message: '操作成功!'
});
});
this.onLoad(this.page);
},
selectionsc(value) {
console.log("进来了>>>>>>>>>>>>>",value);
},
editmap(scope){
const { row } = scope;
console.log("row>>>>>>xxxx",row);
this.$router.push({
path: '/distribution/reservation/atlas1',
query: {
item: JSON.stringify(row),
type:'2'
}
});
},
delectsolt(scope) {
const { row } = scope;
console.log(row);
},
handleClose(done) {
this.$confirm('确认关闭?')
.then(_ => {
done();
})
.catch(_ => {
});
},
editsolt(scope) {
const { row } = scope;
console.log(row);
this.$router.push({
path: '/distribution/deliverylist/distributionDeliveryListedt',
query: {
data: encodeURIComponent(JSON.stringify(row)),
name: row.trainNumber +'-查看配送'
}
});
},
costadd(scope) {
const { row } = scope;
console.log("row>>>>>>>>>>",row);
this.deliverId =row.id
//查询订单的增值服务,
this.addvalueServeType = [];
this.addvalue = {};
this.dialogVisible = true;
this.costList = [];
this.feeList = [];
this.floorList = [];
// this.orderInfo = row;
},
btnsc(index, row) {
console.log(index, row);
},
selectsc(index, row) {
this.query[row.prop] =index
if (!index){
delete this.query[row.prop]
}
this.onLoad(this.page);
},
timesc(index, row) {
console.log(index, row);
},
inputsc(index, row) {
this.query[row.prop] =index
if (!index){
delete this.query[row.prop]
}
this.onLoad(this.page);
},
queryDictionary() {
getDictionaryBiz('delivery_type').then(res => {
this.deliverytypeData = res.data.data;
});
getDictionaryBiz('addvalue_serve_type').then(res => {
this.addvalueServeTypeData = res.data.data;
});
getDictionaryBiz('delivery_way').then(res => {
this.deliveryWayData = res.data.data;
});
getDictionaryBiz('distribution_deliverylist_kind').then(res => {
this.deliverykindData = res.data.data;
this.columnList[2].checkarr =res.data.data.map(item=>{
item.value=item.dictKey
item.label=item.dictValue
return item
});
this.onLoad(this.page);
});
getDictionaryBiz('distribution_deliverylist_state').then(res => {
this.deliveryliststateData = res.data.data;
this.columnList[6].checkarr =res.data.data.map(item=>{
item.value=item.dictKey
item.label=item.dictValue
return item
});
this.onLoad(this.page);
});
},
//类型切换
// deliverytype(type){
// this.query.type=type;
// this.onLoad(this.page)
// },
init () {
this.height = this.setPx(document.body.clientHeight - 340);
},
searchHide () {
this.search = !this.search;
},
searchChange () {
this.onLoad(this.page);
},
searchReset () {
this.query = {};
this.page.currentPage = 1;
this.onLoad(this.page);
},
handleSubmit () {
if (!this.form.id) {
add(this.form).then(() => {
this.box = false;
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
} else {
update(this.form).then(() => {
this.box = false;
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
})
}
},
handleAdd () {
this.title = '新增'
this.form = {}
this.box = true
},
handleEdit (scope) {
const { row} = scope;
this.$router.push({
path: '/distribution/turndelivery/deliveryDiscuss',
query: {
id: row.id,
name: row.trainNumber +'-编辑配送'
}
});
},
handleView (row) {
this.title = '查看'
this.view = true;
this.box = true;
getDetail(row.id).then(res => {
this.form = res.data.data;
});
},
handleViewBlank (row) {
this.$router.push({
path: '/distribution/deliverylist/distributionDeliveryListedt',
query: {
data: encodeURIComponent(JSON.stringify(row)),
name: row.trainNumber +'-查看配送'
}
});
},
handleDelete () {
if (this.selectionList.length === 0) {
this.$message.warning("请选择至少一条数据");
return;
}
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(this.ids);
})
.then(() => {
this.selectionClear();
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
},
rowDel (row) {
this.$confirm("确定将选择数据删除?", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
return remove(row.id);
})
.then(() => {
this.onLoad(this.page);
this.$message({
type: "success",
message: "操作成功!"
});
});
},
beforeClose (done) {
done()
this.form = {};
this.view = false;
},
selectionChange (list) {
this.selectionList = list;
},
selectionClear () {
this.selectionList = [];
// this.$refs.table.clearSelection();
},
currentChange (currentPage) {
this.page.currentPage = currentPage;
this.onLoad(this.page);
},
sizeChange (pageSize) {
this.page.pageSize = pageSize;
this.onLoad(this.page);
},
onLoad (page, params = {}) {
this.loading = true;
getPage(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
const data = res.data.data;
// eslint-disable-next-line no-empty
for (let i = 0; i < data.records.length; i++) {
// eslint-disable-next-line no-empty
for (let j = 0; j < this.deliverytypeData.length; j++) {
// eslint-disable-next-line no-empty
if (data.records[i].type == this.deliverytypeData[j].dictKey) {
data.records[i].type = this.deliverytypeData[j].dictValue;
}
}
for (let j = 0; j < this.deliverykindData.length; j++) {
// eslint-disable-next-line no-empty
if (data.records[i].kind == this.deliverykindData[j].dictKey) {
data.records[i].kind = this.deliverykindData[j].dictValue;
}
}
for (let j = 0; j < this.deliveryliststateData.length; j++) {
// eslint-disable-next-line no-empty
if (data.records[i].state == this.deliveryliststateData[j].dictKey) {
data.records[i].state = this.deliveryliststateData[j].dictValue;
}
}
}
this.page.total = data.total;
this.data = data.records;
this.loading = false;
this.selectionClear();
});
getstatistics(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
this.statistics = res.data.data
});
// getDetail(row.id).then(res => {
// this.form = res.data.data;
// });
}
}
};
</script>