报表申报智能运输页面完成

pages/warehousing/Declaration/components/detail.vue

@@ -0,0 +1,214 @@
+<template>
+    <!-- 自定义导航栏 -->
+    <navigation :title="pathParams.billNo" :back-url="backUrl">
+        <template #right>
+            <view class="right-btn flex align-center justify-center ">
+                <uv-image @tap="onPrinter" src="../../../../static/printer.png" width="20px" height="20px"
+                    style="margin-top:10rpx" />
+                <uv-image v-if="detailInfo.status != '9'" @tap="toEditOrAway('2')" src="../../../../static/edit.png"
+                    class="ml-24" width="20px" height="20px" style="margin-top:10rpx" />
+            </view>
+        </template>
+    </navigation>
+    <view class="contentBox">
+        <view class="detailInfo mb-2">
+            <view class="line title">
+                <p> 申报单号：{{ detailInfo?.billNo }}</p>
+                <text>{{ getLabel(declareType, detailInfo?.status) }}</text>
+
+            </view>
+            <p class="line content">联系人：
+                <text> {{ detailInfo?.contactName || '-' }}</text>
+            </p>
+            <p class="line content">联系电话：
+                <text> {{ detailInfo?.contactPhone || '-' }}</text>
+            </p>
+            <p class="line content">地址：
+                <text>{{ detailInfo?.address || '-' }}</text>
+            </p>
+            <p class="line content">交付时间：
+                <text>{{ detailInfo?.deliveryTime ? detailInfo?.deliveryTime === '0' ? '15天' :
+                    detailInfo?.deliveryTime === '1' ? '立即' : '其他' : '-' }}</text>
+            </p>
+            <p class="line content">申报时间：
+                <text>{{ detailInfo?.createTime || '-' }}</text>
+            </p>
+            <view class="detailInfo mb-2 mt-4">
+                <view class="line title">
+                    <p> 打卡图片</p>
+                </view>
+                <view class="line">
+                    <uv-upload :fileList="detailInfo?.fileList" name="3" multiple
+                        :maxCount="detailInfo?.fileList?.length" :previewFullImage="true"></uv-upload>
+                </view>
+            </view>
+        </view>
+        <!-- 物料列表 -只读 -->
+
+        <material-list ref="materialRef" isEdit="3" :extendData="{ billType: detailInfo?.billType }"
+            :pathParams="{ billNo: detailInfo?.billNo }" backStr="declarationDetail"
+            :formData="{ material: detailInfo.itemList }" />
+
+        <!-- 底部按钮 -->
+        <view :class="detailInfo.status == '9' ? 'bottom1' : 'bottom'">
+            <uv-button type="error" v-if="detailInfo.status != '9'" text="作废" @tap="toObsolete"></uv-button>
+            <uv-button type="primary" text="申报单转入库单" @tap="toEditOrAway('1')"></uv-button>
+        </view>
+    </view>
+</template>
+<script setup>
+import _ from 'lodash';
+import { ref, computed } from 'vue';
+import { onLoad } from "@dcloudio/uni-app";
+import { objectToQuery, getLabel, declareType, removeStorage } from '../../../until';
+import { declareBillDetail, declareBillVoid } from '@/api/declaration';
+import MaterialList from '../../../components/MaterialList.vue';
+import Navigation from '../../../components/Navigation.vue';
+// ref:返回路径
+const backUrl = ref('')
+// 数据：路径参数
+const pathParams = ref('')
+// 数据：详情
+const detailInfo = ref('')
+// type
+const OPERATE_CONFIG = {
+    declaration: {
+        back: '/pages/warehousing/Declaration/my',
+        backType: 'declaration_detail',
+
+    },
+    my: {
+        back: '/pages/warehousing/Declaration/my',
+        backType: 'declaration_detail'
+    },
+}
+
+// 打印
+const onPrinter = () => { }
+// 获取详情 
+const getDetailInfo = () => {
+    declareBillDetail({ billNo: pathParams.value.billNo }).then((res) => {
+        const fileList = _.map(res.data?.fileList, (i) => ({ ...i, url: i.fileUrl, name: i?.fileName, }))
+        detailInfo.value = { ...res.data, fileList: fileList }
+
+    })
+}
+// 作废
+const toObsolete = () => {
+    declareBillVoid({
+        id: detailInfo.value.id
+    }).then((res) => {
+        console.log();
+        if (res.code == 200) {
+            uni.showToast({
+                title: '申报单作废成功',
+                mask: true,
+                icon: 'success',
+            })
+            getDetailInfo()
+        }
+
+    })
+}
+const setStorage = () => {
+    removeStorage()
+    uni.setStorageSync('app_material', detailInfo.value.itemList)
+    uni.setStorageSync('app_declaration', detailInfo.value)
+}
+
+/**
+ * 路径跳转操作 编辑、转为入库单
+ * @param {any} type - 类型标识，1 转为入库单   2 编辑
+ */
+const toEditOrAway = (key) => {
+    const query = objectToQuery(pathParams.value)
+    setStorage()
+
+    if (key === '1') {
+        uni.navigateTo({
+            url: `/pages/warehousing/stockIn/create${query}`
+        });
+    } else {
+
+        uni.navigateTo({
+            url: `/pages/warehousing/Declaration/create${query}`
+        });
+    }
+
+}
+// 接收路径参数
+onLoad((options) => {
+    pathParams.value = options;
+    const { type } = options;
+    let queryStr = objectToQuery(options);
+    let query = { ...options }
+    if (!options.billNo) {
+        uni.showToast({ title: '参数错误,无唯一码ID', icon: 'none' })
+        return
+    }
+
+    if (type != 'my') {
+        const { billNo, ...restParams } = options;
+        queryStr = objectToQuery(restParams);
+    }
+    backUrl.value = OPERATE_CONFIG?.[pathParams.value.type]?.back + `${queryStr}`
+    getDetailInfo()
+})
+
+</script>
+<style scoped lang="scss">
+// 底部按钮
+.bottom {
+    position: fixed;
+    bottom: 0;
+    height: 60rpx;
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+
+    .uv-button-wrapper {
+        width: 50%;
+        border-radius: 0;
+    }
+}
+
+.line {
+    display: flex;
+    background-color: #fff;
+    align-items: center;
+    padding: 6rpx 20rpx;
+    justify-content: space-between;
+
+}
+
+.title {
+    display: flex;
+    justify-content: space-between;
+    font-weight: 600;
+    border-bottom: 0.5px solid #ECEFF1;
+    font-size: 13px;
+}
+
+.content {
+    font-weight: 500;
+    font-size: 13px;
+}
+
+.bottom1 {
+    position: fixed;
+    bottom: 0;
+    height: 60rpx;
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+    // justify-content: center;
+    width: 100%;
+
+    .uv-button-wrapper {
+        width: 100%;
+        border-radius: 0;
+    }
+}
+</style>

pages/warehousing/Declaration/components/materialQueryDetail.vue

@@ -0,0 +1,170 @@
+<template>
+    <navigation title="物料库存查询" back-url="/pages/warehousing/Declaration/materialQuery" />
+
+    <view class="contentBox">
+        <view class="topSearch">
+            <uni-easyinput type="text" v-model="queryParams.keyword" prefixIcon="search" :inputBorder="false"
+                @iconClick="getList" placeholder="请输入搜索内容" />
+        </view>
+        <!-- 物料库存查询  -->
+        <z-paging ref="pagingRef" class="containerBox" v-model="infoList" @query="getDetailInfo">
+            <uni-list class="listBox">
+                <uni-list-item v-for="item in infoList" :key="item.id" clickable @tap="onChecked(item)">
+                    <template v-slot:body>
+                        <view style="display: flex; flex-direction: column;  width: 100%;">
+                            <view class="line title">
+                                <p>{{ item.materialName }} - {{ item.materialCode }}</p>
+                            </view>
+                            <view class="line content" style="color: #F44336;">
+                                <p>库存量</p>
+                                <p>{{ item.stockQty }}{{ item.unitName }}</p>
+                            </view>
+                            <view class="line content">
+                                <p>所在仓库</p>
+                                <p>{{ item.warehouseName }} - {{ item.areaName }}</p>
+                            </view>
+                            <view class="line content">
+                                <p>物料类别</p>
+                                <p>{{ item.typeName }}</p>
+                            </view>
+                            <view class="line content">
+                                <p>物料规格</p>
+                                <p>{{ item.specification }}</p>
+                            </view>
+                            <view class="line content">
+                                <p>物料型号</p>
+                                <p> <text v-if="item?.model">{{ item?.model }}</text>
+                                    <text v-else class="empty">未填写</text>
+                                </p>
+                            </view>
+                            <view class="line content">
+                                <p>物料说明</p>
+                                <p>
+                                    <text v-if="item?.materialDesc">{{ item?.materialDesc }}</text>
+                                    <text v-else class="empty">未填写</text>
+                                </p>
+                            </view>
+
+                        </view>
+                    </template>
+                </uni-list-item>
+            </uni-list>
+        </z-paging>
+    </view>
+</template>
+<script setup>
+import { ref } from 'vue';
+import { onShow, onLoad } from "@dcloudio/uni-app";
+import { stockList } from '@/api/declaration';
+import Navigation from '../../../components/Navigation.vue';
+import { objectToQuery } from '../../../until';
+
+const pathParams = ref('')
+const queryParams = ref({
+    keyword: ''
+})
+const pagingRef = ref(null)
+const infoList = ref([])
+
+onLoad((options) => {
+    pathParams.value = options;
+})
+
+const getDetailInfo = () => {
+    const val = pathParams.value.warehouseCode
+    const params = {
+        warehouseCode: val,
+        keyword: queryParams.value.keyword
+    }
+    stockList(params).then(res => {
+        res.data.forEach(e => {
+            e.showMore = false;
+        });
+        infoList.value = res.data
+        pagingRef.value.complete(res.data)
+    }).catch(res => {
+        pagingRef.value.complete(false)
+    })
+}
+
+const onChecked = (val) => {
+    const query = objectToQuery({ ...pathParams.value, materialId: val.materialId })
+    console.log(query);
+
+    uni.navigateTo({
+        url: `/pages/warehousing/InventoryInfo/components/inventoryAgeDetail${query}`
+    })
+}
+onShow(() => {
+    pagingRef.value?.reload?.()
+})
+
+</script>
+<style scoped lang="scss">
+.topSearch {
+    position: fixed;
+    top: 65rpx;
+    left: 0;
+    right: 0;
+    z-index: 999;
+    padding: 4rpx;
+    background-color: #fff;
+    border-bottom: 1px solid #eee;
+    box-sizing: border-box;
+}
+
+.containerBox {
+    padding-top: 120rpx !important;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+
+    .zp-l-text-rpx {
+        font-size: 12px;
+    }
+}
+
+::v-deep.listBox {
+    background-color: #F8F8FF;
+
+    .uni-list-item {
+        margin-bottom: 8rpx;
+    }
+
+    .uni-list-item__container {
+        padding: 0;
+    }
+
+    .line {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        border-bottom: 1px solid #eee;
+        padding: 12rpx;
+    }
+
+    .title {
+        font-weight: 600;
+        font-size: 14px;
+    }
+
+    .title::before {
+        content: '';
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 4rpx;
+        height: 45rpx;
+        background: #08a089;
+    }
+
+    .content {
+        font-weight: 500;
+        font-size: 13px;
+    }
+
+    .empty {
+        color: #D3D3D3;
+    }
+}
+</style>

pages/warehousing/Declaration/create.vue

@@ -0,0 +1,385 @@
+<template>
+    <navigation :title="title" :back-url="backUrl">
+        <template #right>
+            <my-link @tap="toMyDeclaration" style="font-size: 14px;">我的</my-link>
+        </template>
+    </navigation>
+    <view class="contentBox">
+        <uv-form ref="formRef" labelPosition="left" class="form" :model="formData" label-width="150rpx">
+            <!-- 联系人 -->
+            <uv-form-item label="联系人" prop="contactName">
+                <uv-input placeholder="请输入联系人" v-model="formData.contactName" clearable border="none" />
+            </uv-form-item>
+            <!-- 联系电话 -->
+            <uv-form-item label="联系电话" prop="contactPhone">
+                <uv-input placeholder="请输入联系电话" maxlength="11" type="number" v-model="formData.contactPhone" clearable
+                    border="none" />
+            </uv-form-item>
+            <!-- 交付时间 -->
+            <uv-form-item label="交付时间" @tap="toChooseTime">
+                <view v-if="formData?.deliveryTime">{{ formData.deliveryTime
+                    === '0' ? '15天' : formData.deliveryTime === '1' ? '立即' : '其他' }}</view>
+            </uv-form-item>
+            <!-- 存放地址 -->
+            <uv-form-item label="存放地址" prop="address" class="topLabel">
+                <uv-textarea v-model="formData.address" placeholder="请输入存放地址" border="none"></uv-textarea>
+            </uv-form-item>
+            <!-- 申报图片 -->
+            <uv-form-item label="申报图片" prop="fileList" class="topLabel">
+                <uv-upload :fileList="formData?.fileList" name="1" multiple :maxCount="6" @afterRead="afterRead"
+                    @delete="deleteImg" :previewFullImage="true"></uv-upload>
+
+            </uv-form-item>
+        </uv-form>
+        <!-- 物料列表 - 添加物料 -->
+        <MaterialList ref="materialRef" :formData="{ material: formData?.itemList }"
+            :isEdit="flag == 'declaration_edit' ? 5 : 1" :pathParams="{ ...pathParams.value, type: 'declaration' }"
+            @setStorage="toSetStorage" />
+        <!-- 底部操作栏 -->
+        <view class="bottom">
+            <uv-button @tap="scanCode">扫码添加</uv-button>
+            <uv-button type="primary" @tap="submitForm">提交</uv-button>
+        </view>
+    </view>
+    <!-- 选择物料 -->
+    <uv-modal ref="modalRef" class="chooseModal" :title="none" :showConfirmButton="false" :showCancelButton="false">
+        <p class="link" @tap="toCheckTime('0')">15天</p>
+        <p class="link" @tap="toCheckTime('1')">立即</p>
+        <p class="link" @tap="toCheckTime('2')">其他</p>
+
+    </uv-modal>
+</template>
+<script setup>
+import _ from 'lodash';
+import { ref } from 'vue';
+import { onLoad } from "@dcloudio/uni-app";
+
+import { objectToQuery, removeStorage } from '../../until';
+
+import { addDeclareBill, declareBillUpdate } from '@/api/declaration'
+import { uploadTechnicalFile } from '@/api/stockOut'
+import { getMaterialByQrCodeInfo } from '@/api/uniqueCode';
+
+import Navigation from '../../components/Navigation.vue';
+import MaterialList from '../../components/MaterialList.vue';
+const OPERATE_CONFIG = {
+    declaration: {
+        title: '申报单开单',
+        back: 'pages/warehousing/index'
+    },
+    my: {
+        title: '',//申报单编辑
+        back: '/pages/warehousing/Declaration/components/detail'
+    },
+}
+const title = ref('申报单开单')// ref：标题
+const backUrl = ref('')
+const formData = ref({ itemList: [], contactName: '', contactPhone: '', address: '', fileList: [], deliveryTime: '' })
+// 数据：路径参数
+const pathParams = ref('')
+// 标志：区分页面
+const flag = ref('')
+// ref：物料绑定
+const materialRef = ref([])
+// 弹窗：交付时间选择
+const modalRef = ref()
+// 交付时间选择
+const toChooseTime = () => {
+    modalRef.value.open()
+}
+const toCheckTime = (val) => {
+    formData.value.deliveryTime = val
+    modalRef.value.close()
+}
+// 上传申报图片
+const afterRead = async (event) => {
+    // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
+    let files = event.file?.map(file => file.url);
+    let formDataVal = {
+        scene: 'DECLARE',
+        bizType: 'DECLARE_ADDRESS',
+    }
+    uploadTechnicalFile(files, formDataVal).then(res => {
+        const some = _.some(res, { success: false })
+        if (some) return;
+        if (!formData.value?.fileList || formData.value?.fileList.length == 0) {
+            formData.value.fileList = []
+        }
+        res?.forEach(item => {
+            formData.value.fileList.push({ url: item?.url, name: item?.name, scene: 'DECLARE', bizType: 'DECLARE_ADDRESS' })
+        })
+    })
+}
+const toMyDeclaration = () => {
+    const query = objectToQuery(pathParams.value)
+    uni.navigateTo({
+        url: `/pages/warehousing/Declaration/my${query}`,
+    });
+}
+// 数据：缓存当前填入数据
+const toSetStorage = () => {
+    uni.setStorageSync('app_declaration', formData.value)
+}
+// 数据：获取缓存信息
+const getDeclarationInfo = () => {
+
+    const declarationInfo = uni.getStorageSync('app_declaration');// 申报信息
+    formData.value = declarationInfo || { itemList: [], contactName: '', contactPhone: '', address: '', fileList: [], deliveryTime: '' }
+
+    const material = uni.getStorageSync('app_material') || [];   // 物料信息
+    formData.value.itemList = material
+}
+
+// 扫码添加
+const scanCode = () => {
+    // 先校验是否支持扫码
+    uni.scanCode({
+        scanType: ['qrCode', 'barCode'], // 支持二维码 + 条形码
+        success: (res) => {
+            const idx = includes(existList, res.result)
+            if (idx) {
+                uni.showToast({
+                    title: '该物料已添加，请勿重复添加！',
+                    mask: true,
+                    icon: 'none',
+                })
+                return
+            }
+            if (res.result) {
+                getMaterialByQrCodeInfo({ code: res.result, existList: existList.value }).then((response) => {
+                    if (`${response.code}` === '200') {
+                        const material = uni.getStorageSync('app_material');
+                        // 处理物料信息 合并
+                        const materialInfo = _.filter(material, { isDelete: '0' });
+                        console.log('materialInfo====>', materialInfo);
+                        const materialId = response.data?.[0]?.materialId;
+                        console.log('materialId====>', materialId);
+                        // const idx = _.findIndex(materialInfo, (i) => i.materialId ? i.materialId == materialId : i.id == materialId);
+                        // console.log('已选中是否有重复数据====>', idx);
+
+                        // if (idx != -1) {
+                        //     uni.showToast({
+                        //         title: '该物料已添加，请勿重复添加！',
+                        //         mask: true,
+                        //         icon: 'none',
+                        //     })
+                        // } else {
+                        let _material = [...materialInfo, { ...response.data[0], uniqueCode: res.result }]
+                        console.log('新的物料数组====>', _material);
+                        formData.value.material = _material
+                        uni.setStorageSync('app_material', formData.value.material)
+                        existList.value.push(res.result)
+                        // }
+                    } else {
+                        console.log(response.code, 'response.code');
+                    }
+
+
+                })
+            }
+        },
+        fail: () => {
+            uni.showToast({ title: '扫码失败', icon: 'none' });
+        }
+    });
+};
+
+// 新增/编辑
+const submitForm = () => {
+    const materialInfo = materialRef.value.getMaterialList()
+    if (!materialInfo || (materialInfo && materialInfo.length == 0)) {
+        uni.showToast({
+            title: '请填写物料信息',
+            mask: true,
+            icon: 'error',
+        })
+        return
+    }
+
+    let params = {
+        itemList: _.map(materialInfo, (i) => ({ ...i.material })),
+        contactName: formData.value.contactName,
+        contactPhone: formData.value.contactPhone,
+        deliveryTime: formData.value.deliveryTime,
+        address: formData.value.address,
+        fileList: formData.value.fileList,
+    }
+    // 新建
+    if (!pathParams.value.billNo) {
+        addDeclareBill(params).then((res) => {
+            if (res.code == 200) {
+                uni.showToast({
+                    title: '申报单创建成功',
+                    mask: true,
+                    icon: 'success',
+                })
+                removeStorage()
+                uni.navigateTo({
+                    url: backUrl.value,
+                });
+            } else {
+                uni.showToast({
+                    title: '申报单创建失败',
+                    mask: true,
+                    icon: 'error',
+                })
+                return
+            }
+
+        })
+    } else {
+        // 编辑
+        params.billNo = pathParams.value?.billNo
+        params.id = formData.value?.id
+        declareBillUpdate(params).then((res) => {
+            if (res.code == 200) {
+                uni.showToast({
+                    title: '申报单编辑成功',
+                    mask: true,
+                    icon: 'success',
+                })
+                removeStorage()
+                uni.navigateTo({
+                    url: backUrl.value,
+                });
+            } else {
+                uni.showToast({
+                    title: '申报单编辑失败',
+                    mask: true,
+                    icon: 'error',
+                })
+                return
+            }
+        })
+    }
+
+}
+// 删除图片
+const deleteImg = (index, type) => {
+    formData.value.fileList?.splice(index, 1)
+}
+onLoad((options) => {
+    pathParams.value = options
+    flag.value = options.type
+    const query = objectToQuery(options)
+    if (options.billNo) {
+        title.value = options.billNo
+        backUrl.value = OPERATE_CONFIG?.my?.back + query
+    } else {
+        backUrl.value = OPERATE_CONFIG?.[options.type]?.back
+    }
+    console.log(backUrl, options.type);
+
+})
+getDeclarationInfo();
+</script>
+
+<style scoped lang="scss">
+.carPickerText {
+    color: #c0c4cc;
+}
+
+/* 底部按钮 */
+::v-deep .bottom {
+    position: fixed;
+    bottom: 0;
+    height: 60rpx;
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+
+    .uv-button-wrapper {
+        width: 50%;
+        border-radius: 0;
+    }
+
+    .uv-button--info {
+        background-color: #07c160;
+        color: #fff;
+
+    }
+}
+
+::v-deep .form {
+    // background-color: #fff;
+    padding: 0 0 12rpx 0;
+
+    .uv-input__content {
+        .uv-input__content__field-wrapper__field {
+            text-align: right !important;
+        }
+    }
+
+    .uv-form-item__body {
+        background-color: #fff;
+        padding: 12rpx;
+        margin-bottom: 2rpx;
+        align-items: center;
+    }
+
+    .uv-form-item__body__left__content__label {
+        font-size: 14px;
+    }
+
+    .uv-line {
+        border-bottom: 0 !important;
+    }
+
+    .uv-form-item__body__right__content__slot {
+        justify-content: flex-end;
+        align-items: center;
+    }
+
+    .uv-cell__body {
+        padding: 0
+    }
+
+    .uni-icons {
+        display: block;
+    }
+
+    .u-slot-title {
+
+        display: flex;
+        align-items: center;
+    }
+
+    .topLabel {
+        .uv-form-item__body {
+            display: block;
+        }
+
+        .uv-textarea {
+            padding-left: 0;
+
+        }
+
+        .uv-upload {
+            margin-top: 8px;
+        }
+    }
+}
+
+::v-deep.chooseModal {
+    .uv-modal__content {
+        display: block;
+        padding-top: 24rpx !important;
+        padding: 48rpx;
+
+        .title {
+            font-size: 16px;
+            margin: 16rpx 0;
+
+        }
+
+        .link {
+            color: #999;
+            margin-top: 24rpx;
+            font-size: 14px;
+
+        }
+    }
+}
+</style>

pages/warehousing/Declaration/materialQuery.vue

@@ -0,0 +1,8 @@
+<template>
+    <!-- 仓库信息  -->
+    <choose-list :isWarehousing="true" :pathParams="{ type: 'materialQuery' }" />
+</template>
+<script setup>
+import ChooseList from '../../components/ChooseList.vue'
+</script>
+<style lang="sass" scoped></style>

pages/warehousing/Declaration/my.vue

@@ -0,0 +1,155 @@
+<template>
+    <!-- -->
+    <navigation title="我的申报单" :back-url="backUrl"></navigation>
+    <view class="contentBox">
+        <!-- 搜索框 -->
+        <view class="topSearch">
+            <uni-easyinput type="text" v-model="queryParams.keyword" prefixIcon="search" :input-border="false"
+                @icon-click="getList" placeholder="请输入搜索内容" />
+        </view>
+        <!-- 列表 -->
+        <z-paging ref="pagingRef" class="containerBox" v-model="list" @query="getList">
+            <uni-list class="listBox">
+                <uni-list-item v-for="item in list" :key="item.id" clickable @tap="onDetail(item)">
+                    <template v-slot:body>
+                        <view style="display: flex; flex-direction: column; width: 100%;">
+                            <view class="line title">
+                                <p> 申报单号：{{ item.billNo }}</p>
+                                <p>{{ getLabel(declareType, item?.status) }}</p>
+                            </view>
+                            <p class="line content">联系人：<text>{{ item?.contactName || '-' }}</text></p>
+                            <p class="line content">联系电话：<text>{{ item?.contactPhone || '-' }}</text></p>
+                            <p class="line content">地址:<text>{{ item?.address || '-' }}</text></p>
+                            <p class="line content">申报时间： <text>{{ item?.createTime || '-' }}</text></p>
+                        </view>
+                    </template>
+                </uni-list-item>
+            </uni-list>
+        </z-paging>
+    </view>
+</template>
+
+<script setup>
+import _ from 'lodash';
+import { ref } from 'vue';
+import { onShow, onLoad } from "@dcloudio/uni-app";
+import { declareList } from '@/api/declaration';
+import Navigation from '../../components/Navigation.vue';
+import { objectToQuery, getLabel, declareType } from '../../until';
+
+const OPERATE_CONFIG = {
+    declaration: {
+        back: '/pages/warehousing/Declaration/create'
+    },
+    my: {
+        back: 'pages/warehousing/index'
+    },
+}
+const pagingRef = ref(null)
+const list = ref([])
+const backUrl = ref('')
+const pathParams = ref('')
+const queryParams = ref({ keyword: '' })
+
+const onDetail = (item) => {
+    const query = objectToQuery({ ...pathParams.value, billNo: item.billNo })
+    uni.navigateTo({
+        url: `/pages/warehousing/Declaration/components/detail${query}`,
+    });
+}
+
+const getList = (pageNo, pageSize) => {
+    queryParams.value.pageNum = pageNo
+    declareList({ ...queryParams.value }).then(res => {
+        res.rows.forEach(e => {
+            e.showMore = false;
+        });
+        pagingRef.value.complete(res.rows)
+    }).catch(() => {
+        pagingRef.value.complete(false)
+    })
+
+}
+// 数据：路径参数
+onLoad(options => {
+    pathParams.value = options;
+    const { type } = options;
+
+    let queryStr = '';
+    if (type !== 'my') {
+        const { billNo, ...restParams } = options;
+        queryStr = objectToQuery(restParams);
+    }
+
+    const baseBackUrl = OPERATE_CONFIG?.[type]?.back;
+    backUrl.value = queryStr ? `${baseBackUrl}${queryStr}` : baseBackUrl;
+})
+onShow(() => {
+    pagingRef.value?.reload?.()
+})
+</script>
+
+<style scoped lang="scss">
+/* 搜索框：放在导航栏下面，不覆盖 */
+.topSearch {
+    position: fixed;
+    top: 65rpx;
+    left: 0;
+    right: 0;
+    z-index: 99;
+    padding: 8rpx 16rpx;
+    background-color: #fff;
+    border-bottom: 1px solid #eee;
+    box-sizing: border-box;
+
+}
+
+.containerBox {
+    padding-top: 125rpx !important;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+}
+
+::v-deep .listBox {
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+    background-color: #F8F8FF;
+
+    .zp-l-text-rpx {
+        font-size: 12px;
+    }
+
+    .uni-list--border-bottom {
+        padding: 8px 12px 8px 15px;
+    }
+
+    .uni-list {
+        background-color: #F8F8FF;
+    }
+
+    .uni-list-item {
+        margin-bottom: 4rpx;
+    }
+
+    .line {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 8px 0;
+    }
+
+    .title {
+        justify-content: space-between;
+        font-weight: 600;
+        font-size: 13px;
+    }
+
+    .content {
+        font-weight: 500;
+        font-size: 13px;
+        color: #696969;
+    }
+}
+</style>