721 lines
17 KiB
Vue
721 lines
17 KiB
Vue
<template>
|
||
<view class="c-card">
|
||
<view class="box">
|
||
<view class="base">
|
||
<view>
|
||
<view class="supplier"> {{ state.order.deviceName || "-" }} </view>
|
||
</view>
|
||
</view>
|
||
<view class="flex-box1">
|
||
<view class="type">{{ state.order.productName || "" }}</view>
|
||
<view class="btn">
|
||
<view
|
||
><u-tag
|
||
text="现场照片"
|
||
plain
|
||
shape="circle"
|
||
:bgColor="'rgba(237, 254, 255, 1)'"
|
||
@click="handleScenePhoto(state.order.id)"
|
||
></u-tag
|
||
></view>
|
||
<view
|
||
><u-tag
|
||
text="收货单作废"
|
||
plain
|
||
shape="circle"
|
||
:borderColor="'rgba(255, 147, 68, 1) !important'"
|
||
:bgColor="'rgba(255, 240, 229, 1)'"
|
||
:color="'rgba(255, 157, 85, 1) !important'"
|
||
@click="handleModal(true, state.order.id as string)"
|
||
></u-tag
|
||
></view>
|
||
<!-- 点击待出货结算-->
|
||
<view
|
||
v-if="
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentSettlement
|
||
"
|
||
><u-tag
|
||
text="编辑信息"
|
||
plain
|
||
shape="circle"
|
||
:borderColor="'rgba(0, 238, 78, 1) !important'"
|
||
:bgColor="'rgba(227, 255, 236, 1)'"
|
||
:color="'rgba(0, 238, 78, 1) !important'"
|
||
@click="handleUpdateOrder"
|
||
></u-tag
|
||
></view>
|
||
</view>
|
||
</view>
|
||
<!-- 出库 过磅时间对应过皮时间 -->
|
||
<view
|
||
class="flex-box"
|
||
v-if="
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentSettlement ||
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentNoPay
|
||
"
|
||
>
|
||
<text>审核人：{{ state.order.pricingUserName || "-" }}</text>
|
||
<text>过磅时间：{{ state.order.tareTime }}</text>
|
||
</view>
|
||
|
||
<!-- <view class="flex-box" v-if="getIsShow()" style="border: none">
|
||
<text>过磅时间：{{ state.order.grossTime || "-" }}</text>
|
||
</view>
|
||
<view class="flex-box" v-if="getIsShow()">
|
||
<text>定价人：{{ state.order.pricingUserName || "-" }}</text>
|
||
<text>审核人：{{ state.order.reviewerUserName || "-" }}</text>
|
||
</view> -->
|
||
|
||
<view class="more">
|
||
<view
|
||
v-if="
|
||
state.scaleStatusBtnType ===
|
||
ScaleStatusBtnType.ShipmentSettlement ||
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentNoPay
|
||
"
|
||
>
|
||
出货单号：{{ state.order.orderNumber }}
|
||
</view>
|
||
<view
|
||
v-if="
|
||
state.scaleStatusBtnType ===
|
||
ScaleStatusBtnType.ShipmentSettlement ||
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentNoPay
|
||
"
|
||
></view>
|
||
<view v-for="(item, index) in gridList1" :key="index">
|
||
<text v-if="item.name">{{ item.name }}：</text
|
||
><text
|
||
>{{ item.isBefore ? item.unit : "" }}
|
||
{{ item.num }}
|
||
{{ item.isBefore ? "" : item.unit }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- <u-gap height="10" bgColor="#F8F8F8"></u-gap> -->
|
||
<view class="mt-30">
|
||
<u-line></u-line>
|
||
</view>
|
||
<view
|
||
class="more"
|
||
v-if="
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentSettlement
|
||
"
|
||
>
|
||
<view v-for="(item, index) in gridList2" :key="index">
|
||
<text v-if="item.name">{{ item.name }}：</text
|
||
><text
|
||
>{{ item.isBefore ? item.unit : "" }}
|
||
{{ item.num }}
|
||
{{ item.isBefore ? "" : item.unit }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view
|
||
class="more"
|
||
v-if="
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentNoPay ||
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentPay
|
||
"
|
||
>
|
||
<view v-for="(item, index) in gridList3" :key="index">
|
||
<text v-if="item.name">{{ item.name }}：</text
|
||
><text
|
||
>{{ item.isBefore ? item.unit : "" }}
|
||
<text v-if="item.name === '净重误差'">
|
||
{{
|
||
(state.order.netWeight || 0) - (state.order.settlementNet || 0)
|
||
}}
|
||
</text>
|
||
<text v-else-if="item.name === '结算方式'">
|
||
{{ payMethodMap[item.num] || "暂无" }}
|
||
</text>
|
||
<text v-else> {{ item.num }}</text>
|
||
|
||
{{ item.isBefore ? "" : item.unit }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="op-btn">
|
||
<view
|
||
class="c-btn-review"
|
||
v-if="
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentSettlement
|
||
"
|
||
>
|
||
<view @click="handleReviewNoPay"> 出货未结算 </view>
|
||
<view class="active" @click="handleReviewPay"> 出货并结算 </view>
|
||
</view>
|
||
<view
|
||
v-if="
|
||
state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentSettlement
|
||
"
|
||
>
|
||
<u-button
|
||
text="重新过毛"
|
||
plain
|
||
:customStyle="{
|
||
color: 'rgba(0, 220, 238, 1)',
|
||
border: '1px solid #00DCEE',
|
||
'border-radius': '43rpx',
|
||
}"
|
||
@click="handleReWeight()"
|
||
></u-button>
|
||
</view>
|
||
<view>
|
||
<u-button
|
||
v-if="state.scaleStatusBtnType === ScaleStatusBtnType.ShipmentNoPay"
|
||
@click="handleSettlement"
|
||
text="立即结算"
|
||
type="primary"
|
||
:customStyle="{ 'border-radius': '43rpx' }"
|
||
></u-button>
|
||
</view>
|
||
<view>
|
||
<u-button
|
||
text="打印"
|
||
type="primary"
|
||
:customStyle="{ 'border-radius': '43rpx' }"
|
||
></u-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 支付方式 -->
|
||
<block v-for="(item, index) in state.sheetList" :key="index">
|
||
<u-action-sheet
|
||
:actions="contrlModalParams[item.key].list"
|
||
:title="contrlModalParams[item.key].title"
|
||
:show="contrlModalParams[item.key].isShow"
|
||
@select="(v: any) => handleSelect(item.key, v)"
|
||
@close="contrlModalParams[item.key].isShow = false"
|
||
:closeOnClickAction="true"
|
||
></u-action-sheet>
|
||
</block>
|
||
<SmallModal
|
||
:title="'确认作废吗？'"
|
||
:content="'确认作废后，该订单不能恢复！'"
|
||
:okText="'确认作废'"
|
||
:isMain="true"
|
||
:show="isShowCancelModal"
|
||
@handleModal="(v:boolean) => {handleModal(v, deleteId)}"
|
||
@handleOk="handleOk()"
|
||
/>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ShipmentApi } from "@/services/index";
|
||
import { ScaleStatusBtnType } from "@/utils/enum";
|
||
import { onLoad, onShow } from "@dcloudio/uni-app";
|
||
import SmallModal from "@/components/Modal/smallModal.vue";
|
||
const payMethodMap: any = {
|
||
"1": "现金",
|
||
"2": "转账",
|
||
"3": "微信",
|
||
"4": "支付宝",
|
||
};
|
||
const contrlModalParams = reactive<{ [attrName: string]: any }>({
|
||
paySelect: {
|
||
isShow: false,
|
||
title: "请选择支付方式",
|
||
// 1:现金支付，2：银行卡支付，3：线上支付（微信）4：支付宝
|
||
list: [
|
||
{
|
||
name: "微信",
|
||
key: 3,
|
||
},
|
||
{
|
||
name: "现金",
|
||
key: 1,
|
||
},
|
||
{
|
||
name: "支付宝",
|
||
key: 4,
|
||
},
|
||
{
|
||
name: "转账",
|
||
key: 2,
|
||
},
|
||
],
|
||
},
|
||
printSelect: {
|
||
isShow: false,
|
||
title: "请选择打印设备",
|
||
list: [
|
||
{
|
||
name: "打印设备1",
|
||
key: 1,
|
||
},
|
||
{
|
||
name: "打印设备2",
|
||
key: 2,
|
||
},
|
||
{
|
||
name: "打印设备3",
|
||
key: 3,
|
||
},
|
||
{
|
||
name: "打印设备4",
|
||
key: 4,
|
||
},
|
||
],
|
||
},
|
||
});
|
||
const state = reactive<{
|
||
order: Shipment;
|
||
[attrName: string]: any;
|
||
}>({
|
||
order: {
|
||
id: "",
|
||
buttonType: 0,
|
||
netWeight: 0,
|
||
},
|
||
sheetList: [
|
||
{
|
||
key: "paySelect",
|
||
},
|
||
{
|
||
key: "printSelect",
|
||
},
|
||
],
|
||
scaleStatusBtnType: 0,
|
||
});
|
||
const gridList1 = reactive([
|
||
{
|
||
name: "毛重",
|
||
enName: "grossWeight",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "皮重",
|
||
enName: "tare",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "净重",
|
||
enName: "netWeight",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
]);
|
||
const gridList2 = reactive([
|
||
{
|
||
name: "客户名称",
|
||
enName: "userName",
|
||
num: "",
|
||
isBefore: false,
|
||
},
|
||
{},
|
||
{
|
||
name: "签收时间",
|
||
enName: "signTime",
|
||
num: "",
|
||
isBefore: false,
|
||
},
|
||
{},
|
||
{
|
||
name: "毛重",
|
||
enName: "settlementGross",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "皮重",
|
||
enName: "settlementTare",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算重量",
|
||
enName: "settlementWeight",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "单价",
|
||
enName: "unitPrice",
|
||
num: "",
|
||
unit: "元/KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "预估总价",
|
||
enName: "estimatePrice",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算金额",
|
||
enName: "totalPrice",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "运费",
|
||
enName: "freight",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "杂费",
|
||
enName: "incidentals",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
]);
|
||
|
||
const gridList3 = reactive([
|
||
{
|
||
name: "客户名称",
|
||
enName: "userName",
|
||
num: "",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算人",
|
||
enName: "updateName",
|
||
num: "",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算时间",
|
||
enName: "signTime",
|
||
num: "",
|
||
isBefore: false,
|
||
},
|
||
{},
|
||
{
|
||
name: "结算重量",
|
||
enName: "settlementWeight",
|
||
num: 0,
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算单价",
|
||
enName: "unitPrice",
|
||
num: "",
|
||
unit: "元/KG",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "预估总价",
|
||
enName: "estimatePrice",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算金额",
|
||
enName: "totalPrice",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "运费",
|
||
enName: "freight",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "杂费",
|
||
enName: "incidentals",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "实际收入",
|
||
enName: "realIncome",
|
||
num: "",
|
||
unit: "元",
|
||
isBefore: false,
|
||
},
|
||
{
|
||
name: "结算方式",
|
||
enName: "paymentMethod",
|
||
num: "",
|
||
unit: "",
|
||
isBefore: false,
|
||
},
|
||
// 客户过磅净重-机器过磅净重
|
||
{
|
||
name: "净重误差",
|
||
enName: "netWeightError",
|
||
num: "",
|
||
unit: "KG",
|
||
isBefore: false,
|
||
},
|
||
]);
|
||
// 立即结算 // 先填写结算信息后更新状态为4
|
||
const handleSettlement = () => {
|
||
uni.navigateTo({
|
||
url:
|
||
"/pagesShipment/form/settlementForm?id=" +
|
||
state.order.id +
|
||
`&scaleStatusBtnType=${ScaleStatusBtnType.ShipmentPay}`, // 要跳转到的页面路径
|
||
});
|
||
};
|
||
const handleScenePhoto = (id: string) => {
|
||
uni.navigateTo({
|
||
url: "/pagesScenePhoto/index?orderType=1&imagesType=1&id=" + id, // 要跳转到的页面路径
|
||
});
|
||
};
|
||
// 出货未结算 // 先填写结算信息后更新状态为3
|
||
const handleReviewNoPay = () => {
|
||
uni.navigateTo({
|
||
url:
|
||
"/pagesShipment/form/settlementForm?id=" +
|
||
state.order.id +
|
||
`&scaleStatusBtnType=${ScaleStatusBtnType.ShipmentNoPay}`, // 要跳转到的页面路径
|
||
});
|
||
// ShipmentApi.updateOrderIn({ ...state.order, scaleStatus: 3 }).then((res) => {
|
||
// if (res.code === 200) {
|
||
// uni.navigateTo({
|
||
// url: "/pagesShipment/shipmentSettlement?scaleStatus=3", // 要跳转到的页面路径
|
||
// });
|
||
// }
|
||
// });
|
||
};
|
||
// 审核立即支付
|
||
const handleReviewPay = () => {
|
||
uni.navigateTo({
|
||
url:
|
||
"/pagesShipment/form/settlementForm?id=" +
|
||
state.order.id +
|
||
`&scaleStatusBtnType=${ScaleStatusBtnType.ShipmentPay}`, // 要跳转到的页面路径
|
||
});
|
||
};
|
||
|
||
const handleSelect = (key: string, v: any) => {
|
||
contrlModalParams[key].isShow = false;
|
||
if (key === "paySelect") {
|
||
// 修改订单状态
|
||
// ShipmentApi.updateOne({
|
||
// ...state.order,
|
||
// scaleStatus: 4,
|
||
// paymentMethod: v.key,
|
||
// }).then((res) => {
|
||
// if (res.code === 200) {
|
||
// uni.showToast({
|
||
// title: "支付成功",
|
||
// icon: "success",
|
||
// });
|
||
// uni.navigateTo({
|
||
// url: "/pagesReceive/payReview?scaleStatus=4", // 要跳转到的页面路径
|
||
// });
|
||
// }
|
||
// });
|
||
} else if (key === "printSelect") {
|
||
// 打印
|
||
}
|
||
};
|
||
const isShowCancelModal = ref(false);
|
||
const deleteId = ref("0");
|
||
// 打开确认作废对话框
|
||
const handleModal = (v: boolean, id: string) => {
|
||
isShowCancelModal.value = v;
|
||
deleteId.value = id;
|
||
};
|
||
const handleOk = () => {
|
||
ShipmentApi.deleteOrder({ ids: [deleteId.value] }).then((res) => {
|
||
if (res.code === 200) {
|
||
uni.navigateTo({
|
||
url: "/pagesShipment/shipmentSettlement?scaleStatus=2", // 要跳转到的页面路径
|
||
});
|
||
}
|
||
});
|
||
};
|
||
const handleUpdateOrder = () => {
|
||
uni.navigateTo({
|
||
url: "/pagesShipment/form/shipmentForm?id=" + state.order.id, // 要跳转到的页面路径
|
||
});
|
||
};
|
||
|
||
// 重新过毛
|
||
const handleReWeight = () => {
|
||
ShipmentApi.reGrossWeight({
|
||
id: state.order.id,
|
||
userId: state.order.userId,
|
||
deviceId: state.order.deviceId,
|
||
}).then((res) => {
|
||
if (res.code === 200) {
|
||
uni.navigateTo({
|
||
url: "/pagesShipment/shipmenting?scaleStatus=1", // 要跳转到的页面路径
|
||
});
|
||
}
|
||
});
|
||
};
|
||
const init = () => {
|
||
if (state.order.id) {
|
||
ShipmentApi.getDetailById({ id: state.order.id }).then((res) => {
|
||
if (res.code === 200) {
|
||
state.order = res.data;
|
||
gridList1.map((item) => {
|
||
item.num = state.order[item.enName as string];
|
||
});
|
||
gridList2.map((item) => {
|
||
item.num = state.order[item.enName as string];
|
||
});
|
||
gridList3.map((item) => {
|
||
if (item.name === "净重误差") {
|
||
item.num =
|
||
(state.order as any).netWeight -
|
||
(state.order as any).settlementNet;
|
||
}
|
||
item.num = state.order[item.enName as string];
|
||
});
|
||
}
|
||
});
|
||
}
|
||
}
|
||
onShow(() => {
|
||
init()
|
||
});
|
||
onLoad((option) => {
|
||
state.order.id = (option as any).id;
|
||
state.scaleStatusBtnType = parseInt((option as any).scaleStatusBtnType);
|
||
|
||
uni.$on("shipmentReviewUrlParams", (data) => {
|
||
console.log(data);
|
||
state.order.id = data.id;
|
||
state.scaleStatusBtnType = data.scaleStatusBtnType;
|
||
init()
|
||
});
|
||
});
|
||
onUnmounted(() => {
|
||
uni.$off("shipmentReviewUrlParams", () => {});
|
||
});
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.c-card {
|
||
margin: 30rpx 25rpx;
|
||
.box {
|
||
background: #ffffff;
|
||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||
border-radius: 13rpx;
|
||
padding: 30rpx;
|
||
.base {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #000000;
|
||
.btn {
|
||
border-radius: 24rpx;
|
||
border: 1px solid #00dcee;
|
||
padding: 10rpx 30rpx;
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
color: #00dcee;
|
||
line-height: 41rpx;
|
||
}
|
||
}
|
||
.name {
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #000000;
|
||
margin: 15rpx 0rpx;
|
||
text {
|
||
background-color: #ffaf75;
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
color: #ffffff;
|
||
padding: 5rpx 20rpx;
|
||
margin-left: 20rpx;
|
||
}
|
||
}
|
||
|
||
.flex-box1 {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin: 20rpx 0rpx;
|
||
.type {
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #ec0f3e;
|
||
}
|
||
.btn {
|
||
display: flex;
|
||
> view + view {
|
||
margin-left: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
.flex-box {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #999999;
|
||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||
padding-bottom: 20rpx;
|
||
}
|
||
}
|
||
.more {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
flex: 1;
|
||
font-weight: 400;
|
||
font-size: 26rpx;
|
||
color: #000000;
|
||
padding: 25rpx 0rpx 0rpx 0rpx;
|
||
> view {
|
||
line-height: 50rpx;
|
||
width: max-content;
|
||
}
|
||
}
|
||
.op-btn {
|
||
width: 80%;
|
||
margin: 0px auto;
|
||
margin-top: 100rpx;
|
||
.c-btn-review {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
background: #f5f5f5;
|
||
border-radius: 38rpx;
|
||
text-align: center;
|
||
margin-bottom: 80rpx;
|
||
> view {
|
||
width: 50%;
|
||
text-align: center;
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
color: #999999;
|
||
}
|
||
.active {
|
||
background: #00dcee;
|
||
border-radius: 38rpx;
|
||
font-weight: 500;
|
||
font-size: 26rpx;
|
||
color: #ffffff;
|
||
padding: 20rpx 30rpx;
|
||
}
|
||
}
|
||
> view + view {
|
||
margin-top: 30rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|