forestry-wx/src/plant/packaging/detail/models/print-info-page.vue

<template>
    <z-paging
        ref="paging"
        bgcolor="#F7F7F7"
        v-model="list"
        @query="query"
        safe-area-inset-bottom
        scroll-with-animation
    >
        <template #top>
            <ut-navbar title="包装任务详情" :fixed="false" border></ut-navbar>
        </template>
        <view class="d-flex a-c pd3-30-24-0 f-s-30 f-w-5">
            <view
                class="pd2-20-36 card-item-box mr-10 active"
            >{{ form?.refType == '2' ? '打印详情' : '关联详情' }}</view>
            <view @click="changeTebs" class="pd2-20-36 card-item-box">包装任务信息</view>
        </view>
        <view class="bg-fff pd-24">
            <view class="detail-info-card ov-hd p-rtv mb-40">
                <pack-card :item="form" :dict="dict"></pack-card>
                <view>
                    <view class></view>
                    <view></view>
                    <view></view>
                </view>
            </view>
            <view
                class="d-flex a-c pd2-10-0 j-ed"
                @click="$u.route({ url: '/tools/view-html/index', params: { url: 'https://ta.zycpzs.cn/oss-file/smart-trace/szyy/template/pack_code_type.html', title: '赋码方式区别' } })"
            >
                <up-icon size="28rpx" name="question-circle" color="#999"></up-icon>
                <span class="c-#999 f-s-24">三种打印方式的区别？怎么选择？</span>
            </view>
            <view class="mb-20">
                <ut-tabs v-model="printType" :tabs="tabs" @change="onRefresh"></ut-tabs>
            </view>
            <view>
                <template v-for="(item, index) in list" :key="index">
                    <template v-if="item?.printType == '1'">
                        <view class="mb-20 pd-20 bg-#F7F7F7 b-radius">
                            <view class="f-s-28 pd2-4-0">
                                <span class="c-#666">打印数量：</span>
                                <span class="c-#333 f-w-5">{{ item?.printCount }}</span>
                            </view>
                            <view class="f-s-28 pd2-4-0 d-flex">
                                <span class="c-#666">打印码值：</span>
                                <view class="flex1 ov-hd c-#333 f-w-5">
                                    <view>{{ item?.traceCodeStart }} 至</view>
                                    <view>{{ item?.traceCodeEnd }}</view>
                                </view>
                            </view>
                            <view class="d-flex f-s-24 c-#666">
                                <view class="flex1 ov-hd">打印人：{{ item?.createByName || '-' }}</view>
                                <view class="pr-100">打印时间：{{ item?.createTime || '-' }}</view>
                            </view>
                             <view class="pt-20 d-flex">
                                <view class="flex1"></view>
                                <view class="d-flex a-c">
                                    <up-button :customStyle="formItemBtnListStyle" class="ml-20" color="#18BECA">全部打印</up-button>
                                    <up-button @click="$u.route({ url: '/plant/print/print-range/index', params: item })" :customStyle="formItemBtnListStyle" class="ml-20" color="#37A954">区间打印</up-button>
                                </view>
                            </view>
                        </view>
                    </template>
                    <template></template>
                    <template></template>
                </template>
            </view>
        </view>
    </z-paging>
</template>
<script setup lang="ts">
import { useClientRequest } from "@/utils/request";
import PackCard from "@/plant/models/pack-card.vue";
import { formItemBtnListStyle } from "@/assets/styles/uview-plus";

const paging = ref(null);
const props = defineProps({
    packId: {
        type: String,
        default: ""
    },
    form: {
        type: Object,
        default: () => null
    },
    dict: {
        type: Object,
        default: () => null
    }
});
const printType = ref("1");
const { pt_pack_ref_type } = toRefs(props?.dict);
const emit = defineEmits(["changeTebs"]);
const tabs = reactive([
    { label: "打印记录", value: "1" },
    { label: "导出记录", value: "2" },
    { label: "找人代打记录", value: "3" }
]);
const changeTebs = () => {
    emit("changeTebs", "pack");
};
const list = ref([]);
const query = async (pageNum: number, pageSize: number) => {
    const params = {
        pageNum,
        pageSize,
        packId: props.packId,
        printType: printType.value
    };
    const res = await useClientRequest.get(
        "/plt-api/app/printLog/list",
        params
    );
    if (res && res?.rows) {
        const { rows } = res;
        paging.value.complete(rows);
    }
};
const onRefresh = () => {
    try {
        paging.value?.reload();
    } catch (error) {
        console.error("刷新列表失败:", error);
    }
};
</script>
<style lang="scss" scoped>
.card-item-box {
    color: #999;
    border-radius: 10rpx 10rpx 0 0;

    &.active {
        color: $u-primary;
        background-color: #fff;
    }
}
.detail-info-card {
    border-radius: 16rpx;
    border: 1rpx solid #9dd5ab;
}
</style>