224 lines
7.6 KiB
Vue
224 lines
7.6 KiB
Vue
<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-top-sm padding-bottom-xs flex justify-between align-center">
|
||
<text class="margin-right-sm">本单可派任务金额：<text class="text-red text-lg">{{curOrder.serverMoney}}</text></text>
|
||
</view>
|
||
<view class="padding-bottom-sm 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>
|
||
<view class="solid-top padding-top-sm flex justify-between align-center">
|
||
<input type="text" class="line-input radius-input margin-right-xs" v-model="workerName" placeholder="请输入师傅名称"></input>
|
||
<view class="text-xl text-bold">
|
||
<text class="cuIcon-search margin-right-sm" @click="searchWorkers"></text>
|
||
</view>
|
||
</view>
|
||
<!-- 可指派成员 -->
|
||
<scroll-view class="certern-height-with-scroll" :scroll-y="true" :scroll-with-animation="true">
|
||
<view v-if="searchedMembers && searchedMembers.length > 0">
|
||
<view class="bg-white padding" v-for="(member, index) in searchedMembers">
|
||
<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 ? member.workerName : member.name}}</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>
|
||
</view>
|
||
<view class="bg-white padding" v-for="(member, index) in members" v-else>
|
||
<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 ? member.workerName : member.name}}</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>
|
||
<view class="occupancy-bottom-bar"></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: [],
|
||
workerName: null,
|
||
curUserInfo: null,
|
||
searchedMembers: null
|
||
}
|
||
},
|
||
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;
|
||
this.pickedList = [];
|
||
this.curOrder = {};
|
||
this.curUserInfo = null;
|
||
},
|
||
loadData(order) {
|
||
this.resetData();
|
||
this.curUserInfo = this.$request.getCurUserInfo();
|
||
this.getCanAssignList(order);
|
||
},
|
||
async getCanAssignList(order) {
|
||
// 获取最新的订单信息
|
||
let getOrderRes = await this.$request.getOrderMasterDetail({
|
||
id: order.orderMasterId
|
||
});
|
||
|
||
let res = await this.$request.getCanAssignList({
|
||
orderMasterId: order.orderMasterId
|
||
});
|
||
let pickedList = res.data;
|
||
this.curOrder = getOrderRes.data;
|
||
this.pickedList = pickedList;
|
||
},
|
||
async searchWorkers() {
|
||
let res = await this.$request.getTeamPage({
|
||
leaderId: this.curUserInfo.workerId,
|
||
workerId: null,
|
||
workerName: this.workerName
|
||
});
|
||
this.searchedMembers = res.rows;
|
||
},
|
||
assignWork(member) {
|
||
let goodsToAssign = [];
|
||
// 标识是否派完所有goods，1为派完，0为未派完
|
||
let isAll = 1;
|
||
this.pickedList.forEach((item) => {
|
||
if (item.toAssignNum && 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,
|
||
workerName: member.workerName || member.name
|
||
}
|
||
this.$emit('assignWork', params);
|
||
} else {
|
||
uni.showToast({
|
||
title: '请填写派单价格',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
} else {
|
||
uni.showToast({
|
||
title: '请至少选择一种规格',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
}
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.certern-height-with-scroll {
|
||
height: 480rpx;
|
||
/* margin-bottom: calc(100rpx + constant(safe-area-inset-bottom) / 2); */
|
||
/* margin-bottom: calc(100rpx + env(safe-area-inset-bottom) / 2); */
|
||
}
|
||
</style>
|