dingdong-master/pages/order-manage/dispatch-order.vue

178 lines
5.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view>
<view>
<view class="solid-bottom padding-bottom-sm">
<view v-if="columnTitleArr.length" class="flex justify-between margin-tb-sm">
<view class="basis-df">{{columnTitleArr[0]}}</view>
<view class="flex justify-end text-center basis-df">
<view v-for="(title, index) in columnTitleArr" v-if="index >= 1" class="basis-df">{{title}}</view>
</view>
</view>
<view class="flex justify-between margin-tb-xs align-center" v-for="(item,index) in pickedList" :key="index">
<view class='cu-tag padding basis-lg'>{{item.goodsName}}</view>
<view class="flex justify-end basis-df text-center align-center">
<view class="basis-df">{{item.goodsNum}}</view>
<view class="basis-df">
<uni-number-box :min="0" :max="item.goodsNum" v-model="item.toAssignNum" @change="changePiecesNum($event, item)">
</uni-number-box>
</view>
</view>
</view>
</view>
<view class="padding-tb-sm solid-bottom flex justify-between align-center">
<text class="margin-right-sm" style="width: 150rpx;">派单价格</text>
<input type="digit" class="line-input radius-input" v-model="dispatchTotalPrice" placeholder="请输入派出总额"></input>
</view>
</view>
<!-- 可指派成员 -->
<scroll-view class="certern-height-with-scroll" :scroll-y="true" :scroll-with-animation="true">
<view class="bg-white padding" v-for="(member, index) in members">
<view class="flex justify-between align-center">
<view class="flex justify-start align-center">
<view class="cu-avatar round"
:style="'background-image:url(' + member.workerLogoUrl + ');min-width: 80rpx;min-height: 80rpx'"></view>
<view class="text-lg margin-left-sm">{{member.workerName}}</view>
</view>
<view>
<button class="cu-btn bg-main-color shadow-blur" @click="assignWork(member)">指派</button>
<text v-if="singleServ" class="padding-left text-lg text-gray text-bold" data-modal="showDispatchPriceModal" @click="showModal"><text class="cuIcon-right"></text></text>
</view>
</view>
</view>
</scroll-view>
<!-- 派单金额模态框 -->
<view class="cu-modal" :class="showDispatchPriceModal?'show':''">
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end solid-bottom">
<view class="content">按金额派出</view>
<view class="action" data-modal="showDispatchPriceModal" @tap="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-xl bg-white">
<view>请输入派单金额:</view>
<view class="flex justify-center align-center margin-top-sm">
<input class="radius-input" type="digit"></input>
<text>元</text>
</view>
</view>
<view class="cu-bar bg-white solid-top">
<view class="action margin-0 flex-sub text-black" data-modal="showDispatchPriceModal" @tap="hideModal">取消</view>
<view class="action margin-0 flex-sub text-main-color solid-left" data-modal="showDispatchPriceModal" @tap="hideModal"
@click="">确认派单</view>
</view>
</view>
</view>
</view>
</template>
<script>
// import productPicked from '@/components/goods-card/product-picked.vue';
export default {
name: 'dispatch-order',
// components: {
// productPicked
// },
props: {
singleServ: {
type: Boolean,
default: false
},
product: {
type: Object,
default: {}
},
members: {
type: Array,
default: {}
},
orderNow: {
type: Boolean,
default: false
}
},
data() {
return {
dispatchTotalPrice: null,
showDispatchPriceModal: false,
columnTitleArr: ['购买机型', '待派单', '派单量'],
curOrder: {},
pickedList: []
}
},
methods: {
showModal(e) {
this[e.currentTarget.dataset.modal] = true;
},
hideModal(e) {
this[e.currentTarget.dataset.modal] = false;
},
changePiecesNum(curNum, curItem) {
curItem.toAssignNum = curNum;
},
resetData() {
this.dispatchTotalPrice = null;
},
loadData(order) {
this.resetData();
this.getCanAssignList(order);
},
async getCanAssignList(order) {
let res = await this.$request.getCanAssignList({
orderMasterId: order.orderMasterId
});
let pickedList = res.data;
this.curOrder = order;
this.pickedList = pickedList;
},
assignWork(member) {
let goodsToAssign = [];
// 标识是否派完所有goods1为派完0为未派完
let isAll = 1;
this.pickedList.forEach((item) => {
if (item.goodsNum !== item.toAssignNum) {
isAll = 0;
}
if (item.toAssignNum) {
goodsToAssign.push({
goodsStandardId: item.goodsStandardId,
num: item.toAssignNum
})
}
});
if (goodsToAssign.length > 0) {
if (this.dispatchTotalPrice) {
let params = {
goodsList: goodsToAssign,
workerId: member.workerId,
totalPay: this.dispatchTotalPrice,
orderMasterId: this.curOrder.orderMasterId,
isAll: isAll
}
this.$emit('assignWork', params);
} else {
uni.showToast({
title: '请填写派单价格',
icon: 'none'
})
}
} else {
uni.showToast({
title: '请至少选择一种规格',
icon: 'none'
})
}
}
},
}
</script>
<style scoped>
.certern-height-with-scroll {
height: 280rpx;
margin-bottom: calc(100rpx + constant(safe-area-inset-bottom) / 2);
margin-bottom: calc(100rpx + env(safe-area-inset-bottom) / 2);
}
</style>