<template>
|
<view class="outbound-page">
|
<view class="search-section">
|
<wd-row>
|
<wd-col :span="21">
|
<wd-search
|
v-model="searchKeyword"
|
placeholder="请输入车牌号"
|
placeholder-left
|
hide-cancel
|
@search="handleSearch"
|
@clear="handleClear"
|
></wd-search>
|
</wd-col>
|
<wd-col :span="3">
|
<view class="scan_box" @click="handleSearch">
|
<wd-icon name="search" size="24px" color="#0D867F"></wd-icon>
|
</view>
|
</wd-col>
|
</wd-row>
|
</view>
|
|
<view class="list-section">
|
<z-paging
|
ref="pagingRef"
|
v-model="shippingList"
|
:fixed="false"
|
:auto-show-back-to-top="true"
|
@query="getList"
|
>
|
<wd-card
|
v-for="(item, index) in shippingList"
|
:key="item.deliveryid || index"
|
custom-class="card_bg"
|
@click="toMaterialDetail(item)"
|
>
|
<template #title>
|
<text class="font-medium text-[#252525]">发货单号: {{ item.vbillcode || "-" }}</text>
|
</template>
|
<wd-row class="my-2">
|
<wd-col :span="24">
|
<view class="flex">
|
<view class="icon_box">
|
<wd-icon name="folder" color="#0D867F"></wd-icon>
|
</view>
|
<text class="text-[#646874] mx-2">
|
发货单日期:
|
<text class="text-[#252525]">{{ item.dbilldate || "-" }}</text>
|
</text>
|
</view>
|
</wd-col>
|
</wd-row>
|
<wd-row class="my-2">
|
<wd-col :span="24">
|
<view class="flex">
|
<view class="icon_box">
|
<wd-icon name="folder" color="#0D867F"></wd-icon>
|
</view>
|
<text class="text-[#646874] mx-2">
|
车牌号:
|
<text class="text-[#252525]">{{ item.carno || "-" }}</text>
|
</text>
|
</view>
|
</wd-col>
|
</wd-row>
|
<wd-row class="my-2" v-if="item.vmemo">
|
<wd-col :span="24">
|
<view class="flex">
|
<view class="icon_box">
|
<wd-icon name="folder" color="#0D867F"></wd-icon>
|
</view>
|
<text class="text-[#646874] mx-2">
|
发货单备注:
|
<text class="text-[#252525]">{{ item.vmemo || "-" }}</text>
|
</text>
|
</view>
|
</wd-col>
|
</wd-row>
|
</wd-card>
|
</z-paging>
|
</view>
|
|
<wd-toast />
|
</view>
|
</template>
|
|
<script setup lang="ts">
|
import { ref } from "vue";
|
import { useToast } from "wot-design-uni";
|
import zPaging from "@/components/z-paging/z-paging.vue";
|
import OutboundApi from "@/api/product/outbound";
|
|
const toast = useToast();
|
const pagingRef = ref();
|
const searchKeyword = ref("");
|
const shippingList = ref<any[]>([]);
|
|
// 获取列表数据
|
const getList = async (pageNo: number, pageSize: number) => {
|
const params: any = {
|
contractNo: "",
|
carNo: searchKeyword.value || "",
|
current: pageNo,
|
size: pageSize,
|
};
|
|
try {
|
const { code, data, msg } = await OutboundApi.queryErpOutboundOrder(params);
|
if (code === 200 && data) {
|
const records = data.records || [];
|
if (!records.length) {
|
pagingRef.value.complete(true);
|
} else {
|
pagingRef.value.complete(records);
|
}
|
} else {
|
toast.error(msg || "获取出库单列表失败");
|
pagingRef.value.complete(true);
|
}
|
} catch (error) {
|
console.error("获取出库单列表失败:", error);
|
toast.error("获取出库单列表失败");
|
pagingRef.value.complete(true);
|
}
|
};
|
|
// 搜索处理
|
const handleSearch = () => {
|
// 重新加载数据
|
pagingRef.value.reload();
|
};
|
|
// 清空搜索
|
const handleClear = () => {
|
searchKeyword.value = "";
|
handleSearch();
|
};
|
|
// 跳转到物料详情页
|
const toMaterialDetail = (item: any) => {
|
uni.navigateTo({
|
url: `/pages/outbound/material?id=${item.deliveryid}&vbillcode=${item.vbillcode}&vsrccode=${item.vsrccode || ""}`,
|
});
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.outbound-page {
|
min-height: 100vh;
|
background: #f3f9f8;
|
padding: 10rpx;
|
}
|
|
.search-section {
|
background: #fff;
|
padding: 10rpx;
|
margin-bottom: 10rpx;
|
}
|
|
.scan_box {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 38px;
|
height: 38px;
|
padding: 6px;
|
background: #fff;
|
}
|
|
.list-section {
|
padding: 0 4px;
|
height: calc(100vh - 150rpx);
|
}
|
|
.card_bg {
|
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.05);
|
padding-bottom: 10px;
|
margin-bottom: 10px;
|
margin-left: 6px;
|
margin-right: 6px;
|
}
|
|
.shipping-card {
|
margin: 0 5px;
|
}
|
|
.icon_box {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 20px;
|
height: 20px;
|
background: #e7f4ec99;
|
border-radius: 50%;
|
}
|
|
.empty_tip {
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
padding: 40px 0;
|
}
|
|
.empty_text {
|
color: #999;
|
font-size: 14px;
|
}
|
|
:deep(.wd-search__block) {
|
border-radius: unset;
|
}
|
</style>
|
