282 lines
8.1 KiB
Vue
282 lines
8.1 KiB
Vue
<template>
|
||
<view class="viewport">
|
||
<CustomNavbar />
|
||
<u-tabs
|
||
:list="tabsList"
|
||
:is-scroll="false"
|
||
:current="tabsCurrent"
|
||
@change="fnTabsChg"
|
||
></u-tabs>
|
||
<u-card v-for="orderItem in orderList">
|
||
<view class="" slot="head">
|
||
<text>采购订单（编号：{{ orderItem.orderNumber }}）</text>
|
||
</view>
|
||
<view class="" slot="body">
|
||
<u-row gutter="16">
|
||
<u-col span="12">
|
||
<text>订单日期：</text><text>{{ fnFormat(orderItem.orderDate) }}</text>
|
||
</u-col>
|
||
<u-col span="6">
|
||
<text>物料名称：</text><text>{{ orderItem.materialName }}</text>
|
||
</u-col>
|
||
<u-col span="6">
|
||
<text>规格型号：</text><text>{{ orderItem.specification }}</text>
|
||
</u-col>
|
||
<u-col span="6">
|
||
<text>物料编码：</text><text>{{ orderItem.materialCode }}</text>
|
||
</u-col>
|
||
<u-col span="6">
|
||
<text>下单数量：</text><text>{{ orderItem.orderQuantity }}</text>
|
||
</u-col>
|
||
<u-col span="12">
|
||
<text>要求到货日期：</text><text>{{ fnFormat(orderItem.requestDeliveryDate) }}</text>
|
||
</u-col>
|
||
<u-col span="6">
|
||
<text>总投产数量：</text><text>{{ orderItem.totalProductionQuantity }}</text>
|
||
</u-col>
|
||
<u-col span="6">
|
||
<text>总发货数量：</text><text>{{ orderItem.totalSendQuantity }}</text>
|
||
</u-col>
|
||
</u-row>
|
||
</view>
|
||
<view class="" slot="foot">
|
||
<template v-if="orderItem.orderStatus == 1">
|
||
<u-button
|
||
size="mini"
|
||
:custom-style="{
|
||
color: 'white',
|
||
margin: '5px',
|
||
backgroundImage:
|
||
'linear-gradient(to right, rgb(111, 137, 221), rgb(42, 75, 180))',
|
||
}"
|
||
:plain="true"
|
||
shape="circle"
|
||
@click="fnTakeOrder(orderItem)"
|
||
>
|
||
接单
|
||
</u-button>
|
||
</template>
|
||
<template v-else-if="orderItem.orderStatus == 2">
|
||
<u-button
|
||
size="mini"
|
||
:custom-style="{
|
||
color: 'white',
|
||
margin: '5px',
|
||
backgroundImage:
|
||
'linear-gradient(to right, rgb(255, 133, 133), rgb(249, 61, 61))',
|
||
}"
|
||
:plain="true"
|
||
shape="circle"
|
||
@click="fnDelay(orderItem)"
|
||
>
|
||
延期发货
|
||
</u-button>
|
||
<u-button
|
||
size="mini"
|
||
:custom-style="{
|
||
color: 'white',
|
||
margin: '5px',
|
||
backgroundImage:
|
||
'linear-gradient(to right, rgb(255, 199, 131), rgb(252, 136, 13))',
|
||
}"
|
||
:plain="true"
|
||
shape="circle"
|
||
@click="fnFinish(orderItem)"
|
||
>
|
||
缺货结单
|
||
</u-button>
|
||
<u-button
|
||
size="mini"
|
||
:custom-style="{
|
||
color: 'white',
|
||
margin: '5px',
|
||
backgroundImage:
|
||
'linear-gradient(to right, rgb(111, 137, 221), rgb(42, 75, 180))',
|
||
}"
|
||
:plain="true"
|
||
shape="circle"
|
||
@click="fnToProd(orderItem)"
|
||
>
|
||
投产
|
||
</u-button>
|
||
<u-button
|
||
size="mini"
|
||
:custom-style="{
|
||
color: 'white',
|
||
margin: '5px',
|
||
backgroundImage:
|
||
'linear-gradient(to right, rgb(126, 237, 140), rgb(74, 215, 92))',
|
||
}"
|
||
:plain="true"
|
||
shape="circle"
|
||
@click="fnShipments(orderItem)"
|
||
>
|
||
发货
|
||
</u-button>
|
||
</template>
|
||
</view>
|
||
</u-card>
|
||
<PopToProd ref="popToProd" @evtRefresh="fnRefreshA"></PopToProd>
|
||
<PopDelay ref="popDelay" @evtRefresh="fnRefreshB"></PopDelay>
|
||
<PopShipments ref="popShipments" @evtRefresh="fnRefreshC"></PopShipments>
|
||
<u-top-tips ref="uTips"></u-top-tips>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
|
||
import { mapGetters } from "vuex";
|
||
import dayjs from "dayjs";
|
||
import {
|
||
getOrderList,
|
||
takeOrder,
|
||
finish,
|
||
} from "@/api/yys/materialProcurementOrder.js";
|
||
import CustomNavbar from "./components/CustomNavbar";
|
||
import PopToProd from "./components/PopToProd";
|
||
import PopDelay from "./components/PopDelay";
|
||
import PopShipments from "./components/PopShipments";
|
||
export default {
|
||
components: { CustomNavbar, PopToProd, PopDelay, PopShipments },
|
||
mixins: [],
|
||
data() {
|
||
return {
|
||
isLoading: false,
|
||
tabsList: [
|
||
{ name: "待接单", orderStatus: "1" },
|
||
{ name: "已接单", orderStatus: "2" },
|
||
{ name: "部分发货", orderStatus: "4" },
|
||
{ name: "发货完成", orderStatus: "5" },
|
||
],
|
||
tabsCurrent: 0,
|
||
orderList: [],
|
||
};
|
||
},
|
||
watch: {},
|
||
computed: {},
|
||
onLoad(params) {
|
||
this.fnGetList();
|
||
},
|
||
onUnload() {},
|
||
methods: {
|
||
fnTabsChg(index) {
|
||
this.tabsCurrent = index;
|
||
this.fnGetList();
|
||
},
|
||
fnGetList() {
|
||
let tabsNow = this.tabsList[this.tabsCurrent];
|
||
let params = {
|
||
orderStatus: tabsNow.orderStatus,
|
||
};
|
||
getOrderList(params)
|
||
.then((res) => {
|
||
if (res.code == 200) {
|
||
this.orderList = res.data;
|
||
}
|
||
console.log(res);
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
},
|
||
fnTakeOrder(orderItem) {
|
||
uni.showModal({
|
||
title: "确认接单",
|
||
content: "确认接单（编号：" + orderItem.orderNumber + ")",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
// 用户确认接单
|
||
console.log("用户确认接单");
|
||
takeOrder(orderItem)
|
||
.then((res) => {
|
||
if (res.code == 200) {
|
||
this.$refs.uTips.show({
|
||
title: "确认接单提交成功",
|
||
type: "success",
|
||
duration: "2300",
|
||
});
|
||
this.fnGetList();
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
} else if (res.cancel) {
|
||
// 用户取消接单
|
||
console.log("用户取消接单");
|
||
}
|
||
},
|
||
});
|
||
console.log(orderItem);
|
||
},
|
||
fnToProd(orderItem) {
|
||
this.$refs.popToProd.init(orderItem);
|
||
},
|
||
fnFinish(orderItem) {
|
||
uni.showModal({
|
||
title: "缺货结单",
|
||
content: "缺货结单（编号：" + orderItem.orderNumber + ")",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
// 用户确认缺货结单
|
||
console.log("用户确认缺货结单");
|
||
finish(orderItem)
|
||
.then((res) => {
|
||
if (res.code == 200) {
|
||
this.$refs.uTips.show({
|
||
title: "缺货结单提交成功",
|
||
type: "success",
|
||
duration: "2300",
|
||
});
|
||
this.fnGetList();
|
||
}
|
||
})
|
||
.catch((err) => {
|
||
console.log(err);
|
||
});
|
||
} else if (res.cancel) {
|
||
// 用户取消缺货结单
|
||
console.log("用户取消缺货结单");
|
||
}
|
||
},
|
||
});
|
||
},
|
||
fnDelay(orderItem) {
|
||
this.$refs.popDelay.init(orderItem);
|
||
},
|
||
fnShipments(orderItem) {
|
||
this.$refs.popShipments.init(orderItem);
|
||
},
|
||
fnRefreshA() {
|
||
this.$refs.uTips.show({
|
||
title: "投产提交成功",
|
||
type: "success",
|
||
duration: "2300",
|
||
});
|
||
this.fnGetList();
|
||
},
|
||
fnRefreshB() {
|
||
this.$refs.uTips.show({
|
||
title: "延期发货提交成功",
|
||
type: "success",
|
||
duration: "2300",
|
||
});
|
||
this.fnGetList();
|
||
},
|
||
fnRefreshC() {
|
||
this.$refs.uTips.show({
|
||
title: "发货提交成功",
|
||
type: "success",
|
||
duration: "2300",
|
||
});
|
||
this.fnGetList();
|
||
},
|
||
fnFormat(time, fmtStr = "YYYY-MM-DD") {
|
||
return dayjs(time).format(fmtStr);
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss"></style>
|