freight-web/src/pagesApp/shipmentCl.vue

317 lines
7.0 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 class="c-card">
<view class="search">
<u-search
placeholder="请输入供应商名称"
v-model="keyword"
:showAction="false"
:bgColor="'#fff'"
:borderColor="'rgba(0, 0, 0, 0.1)'"
:placeholderColor="'#C1C1C1'"
@search="handleSearch()"
@clear="handleSearch()"
></u-search>
</view>
<page-view
@loadList="
(v) => {
getList(v);
}
"
:noMoreData="pageList.noMoreData"
:list="pageList.list"
:height="100"
:isLoading="pageList.isLoading"
>
<view class="box" v-for="(item, index) in pageList.list" :key="index">
<view class="base">
<view>
<view class="no"> 出货单号{{ item.orderNumber }} </view>
<view class="supplier"> {{ item.deviceName }} </view>
</view>
<view>
<text class="btn" @click="handleScenePhoto((item as any).id)"
>现场照片</text
>
</view>
</view>
<view class="name"
>{{ item.userName }}
<text>{{ getScaleStatus((item as any).scaleStatus) }}</text>
<text v-if="item.repairTime">补单</text>
</view>
<view class="type">{{ item.productName }}</view>
<view class="more">
<view
v-for="(cItem, index) in gridList1"
:key="index"
:style="{
width: `${cItem.name === '创建时间' ? 'max-content' : ''}`,
'font-size': `${cItem.isCustomStyle ? '22rpx' : ''}`,
color: `${cItem.isCustomStyle ? '#999' : ''}`,
}"
>
<text v-if="cItem.name">{{ cItem.name }}</text
><text
>{{ cItem.isBefore ? cItem.unit : "" }}
{{ cItem.name === '送货方式' ? item[`${cItem.enName}`] === DeliveryMethod.Deliver ? '送货' : '自提' : item[`${cItem.enName}`] }}
{{ cItem.isBefore ? "" : cItem.unit }}
</text>
</view>
</view>
</view>
</page-view>
</view>
</template>
<script setup lang="ts">
import { ReceiveApi, ShipmentApi } from "@/services";
import PageView from "@/components/PageView/index.vue";
import { DeliveryMethod, ScaleStatus } from "@/utils/enum";
const keyword = ref("");
const gridList1 = reactive([
{
name: "卡号",
enName: "cardNumber",
},
{},
{
name: "创建时间",
enName: "createTime",
},
{},
{
name: "车牌号",
enName: "carNumber",
isBefore: false,
},
{
name: "送货方式",
enName: "deliveryMethod",
isBefore: false,
},
{
name: "毛重",
enName: "grossWeight",
num: "0",
unit: "KG",
isBefore: false,
},
{
name: "皮重",
enName: "tare",
unit: "KG",
isBefore: false,
},
{
name: "净重",
enName: "netWeight",
unit: "KG",
isBefore: false,
},
{
name: "数量",
enName: "number",
isBefore: false,
},
{
name: "过毛",
enName: "grossTime",
unit: "",
isBefore: false,
isCustomStyle: true,
},
{
name: "过皮",
enName: "tareTime",
unit: "",
isBefore: false,
isCustomStyle: true,
},
{
name: "结算重量",
enName: "settlementWeight",
unit: "KG",
isBefore: false,
},
{
name: "单价",
enName: "unitPrice",
unit: "/千克",
isBefore: false,
},
{
name: "结算总价",
enName: "estimatePrice",
unit: "",
isBefore: false,
},
{
name: "实结金额",
enName: "totalPrice",
unit: "",
isBefore: false,
},
{
name: "作废人",
enName: "updateName",
unit: "",
isBefore: false,
isCustomStyle: true,
},
{
name: "过皮",
enName: "tareTime",
unit: "",
isBefore: false,
isCustomStyle: true,
},
]);
const handleScenePhoto = (id: string) => {
uni.navigateTo({
url: "/pagesScenePhoto/index?orderType=2&imagesType=1&id=" + id, // 要跳转到的页面路径
});
};
const pageList: PageResult<Order> = reactive({
isLoading: false,
noMoreData: false,
total: 0,
list: [],
pageNum: 1,
pageSize: 100,
});
const resetPageList = () => {
pageList.noMoreData = false;
pageList.total = 0;
pageList.list = [];
pageList.pageNum = 1;
pageList.pageSize = 100;
};
const handleSearch = () => {
resetPageList();
getList();
};
const getList = (v?: boolean) => {
if (v) {
if (Math.ceil(pageList.total / pageList.pageSize) > pageList.pageNum) {
pageList.pageNum++;
} else {
pageList.noMoreData = true;
return;
}
}
pageList.isLoading = true;
ShipmentApi.getOrderPage({
pageSize: pageList.pageSize,
pageNumber: pageList.pageNum,
userName: keyword.value,
isDeleted: true,
}).then((res: any) => {
if (res.code === 200) {
pageList.isLoading = false;
(pageList as any).list = pageList.list.concat(res.data.list);
pageList.total = (res.data as any).total;
}
});
};
const getScaleStatus = (type: number) => {
if (type === ScaleStatus.ToBeShipment) {
return "待出货";
} else if (type === ScaleStatus.ToBeGrossWeight) {
return "待过毛";
} else if (type === ScaleStatus.ToBeShipmentReview) {
return "待审核";
} else if (type === ScaleStatus.ToBeShipmentPay) {
return "待支付";
} else if (type === ScaleStatus.ShipmentPaid) {
return "已支付";
}
};
onMounted(() => {
getList();
});
</script>
<style lang="scss" scoped>
.c-card {
margin: 30rpx 25rpx;
.box {
margin-top: 30rpx;
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;
.no {
font-weight: 400;
font-size: 26rpx;
color: #000000;
}
.supplier {
font-weight: 400;
font-size: 26rpx;
color: #000000;
}
.btn {
border-radius: 24rpx;
border: 1px solid #00dcee;
padding: 10rpx 30rpx;
font-weight: 500;
font-size: 26rpx;
color: #00dcee;
line-height: 41rpx;
}
}
.name {
font-weight: 400;
font-size: 28rpx;
color: #000000;
margin: 15rpx 0rpx;
text {
background-color: #ffaf75;
font-weight: 500;
font-size: 24rpx;
color: #ffffff;
padding: 5rpx 20rpx;
margin-left: 20rpx;
}
}
.type {
font-weight: 400;
font-size: 28rpx;
color: #ec0f3e;
margin-bottom: 20rpx;
}
.flex-box {
display: flex;
align-items: center;
justify-content: space-between;
font-weight: 400;
font-size: 26rpx;
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;
}
}
}
</style>