hazardousWaste_app/pages/warehousing/uniqueCode/issueUniqueCode/materialSelection.vue

<!-- 物料选择 -->
<template>
    <view class="content">
        <view class="topSearch" v-if="!backUrl.includes('inbound')">
            <uni-easyinput type="text" v-model="queryParams.keyword" prefixIcon="search" :inputBorder="false"
                @iconClick="getMaterialList" placeholder="请输入搜索内容" />
        </view>

        <!-- 物料列表  -->
        <z-paging ref="pagingRef" class="containerBox" v-model="materialList" @query="getMaterialList"
            v-if="!backUrl.includes('inbound')">
            <uni-list>
                <uni-list-item v-for="item in materialList" :key="item.id" clickable class="material-card"
                    @click="onMaterial(item)">
                    <template v-slot:body>
                        <p style="display: flex; flex-direction: column; width: 100%;">
                        <p class="title">{{ item.materialName }} ({{ item.materialCode }})</p>
                        <p class="subTitle">
                            <!-- 简称/型号/规格/类型 -->
                            <span v-if="item.materialShortName">{{ item.materialShortName }} / </span>
                            <span v-if="item.model">{{ item.model }} / </span>
                            <span v-if="item.specification">{{ item.specification }} / </span>
                            <span v-if="item.typeName">{{ item.typeName }} </span>
                        </p>
                        <p class="tag">
                            <uni-tag :text="getTypeParentNames(item.typeParentNames)" type="error" />
                        <p>单位：{{ item.unitName }}</p>
                        </p>
                        </p>

                    </template>
                </uni-list-item>
            </uni-list>
        </z-paging>

        <view v-if="backUrl.includes('inbound')">
            <uni-list>
                <uni-list-item v-for="item in materialList" :key="item.id" clickable class="material-card"
                    @click="onMaterial(item)">
                    <template v-slot:body>
                        <p style="display: flex; flex-direction: column; width: 100%;">
                        <p class="title">{{ item.materialName }} ({{ item.materialCode }})</p>
                        <p class="subTitle">
                            <!-- 简称/型号/规格/类型 -->
                            <span v-if="item.materialShortName">{{ item.materialShortName }} / </span>
                            <span v-if="item.model">{{ item.model }} / </span>
                            <span v-if="item.specification">{{ item.specification }} / </span>
                            <span v-if="item.typeName">{{ item.typeName }} </span>
                        </p>
                        <p class="tag">
                            <uni-tag :text="getTypeParentNames(item.typeParentNames)" type="error" />
                        <p>单位：{{ item.unitName }}</p>
                        </p>
                        </p>

                    </template>
                </uni-list-item>
            </uni-list>
        </view>
    </view>
</template>
<script setup>
import _ from 'lodash';
import { computed, ref } from 'vue';
import { getTypeParentNames, } from '../until';
import { objectToQuery } from '../../../until';
import { getMaterial } from '@/api/uniqueCode'
import { onShow, onLoad } from "@dcloudio/uni-app";

// ref:下拉加载
const pagingRef = ref(null)
// 数据：查询参数
const queryParams = ref({
    keyword: ''
})
// 数据：物料
const materialList = ref([])
// 数据：路径参数
const pathParams = ref('')

// 数据：返回路径标识 stockIn 入库单开单 stockInDetail入库单编辑 issueUniqueCode唯一码  issueUniqueCode_inbound入库生成唯一码
const backUrl = computed(() => pathParams?.value?.back)
// 方法：获取列表
const getMaterialList = () => {
    getMaterial(queryParams.value).then(res => {
        res.rows.forEach(e => {
            e.showMore = false;
        });
        pagingRef.value.complete(res.rows)
    }).catch(res => {
        pagingRef.value.complete(false)
    })
}
// 方法：获取列表 - 入库生成唯一码
const getMaterialListInbound = () => {
    const list = uni.getStorageSync('app_material_select_list')
    console.log('list',list);
    materialList.value=list


}

onShow(() => {
    pagingRef.value?.reload?.()
})
onLoad((options) => {
    pathParams.value = options
    getMaterialListInbound()
})
// 方法：获取缓存物料信息
const getStorageMaterial = (val) => {
    // 唯一码编辑进入  数量默认1\唯一码物料表id\物料id
    if (pathParams.value.id) {
        const value = uni.getStorageSync('app_material');
        if (value && value?.length > 0) {
            return [{ ...val, quantity: 1, uniqueCodeMaterialId: value?.[0]?.id, uniqueCodeRemark: value?.[0]?.uniqueCodeRemark, materialId: val.id, isDelete: '0' }]
        }
    }
    return [{ ...val, quantity: 1 }]
}
// 方法：返回路径
const toBack = (back) => {
    const path = objectToQuery({ ...pathParams.value })
    let url = ''
    switch (back) {
        case 'stockIn':
            // 入库单开单添加物料进入
            url = `/pages/warehousing/stockIn/create`
            break
        case 'issueUniqueCode':
        case 'issueUniqueCode_inbound':
            // 唯一码发放/入库生成唯一码
            url = `/pages/warehousing/uniqueCode/issueUniqueCode/index`
            break
        case 'stockInDetail':
            //我的入库单/入库单入库
            url = `/pages/warehousing/stockIn/components/detail`
            break
    }
    uni.navigateTo({
        url: `${url}${path}`
    })
}
// 方法：选择物料
const onMaterial = (val) => {
    let materialChecked = uni.getStorageSync('app_material');
    if (!Array.isArray(materialChecked)) {
        materialChecked = [];
    }

    console.log(materialChecked, 'materialChecked==>');

    const item = _.find(materialChecked, (i) => i.materialId ? i.materialId === val.id : i.id === val.id)
    console.log(item, 'item==>');

    const idx = _.findIndex(materialChecked, (i) => i.materialId ? i.materialId === val.id : i.id === val.id)
    console.log(idx, 'idx==>', idx != -1 && item?.isDelete == '0', backUrl.value);

    if (idx != -1 && item?.isDelete == '0') {    // isDelete为0表示未删除  1为已删除数据不在对比范围内
        console.log(backUrl.value == 'stockIn', '11111111111111111111111111');

        if (backUrl.value == 'stockIn') {
            console.log(111111111111);

            uni.showToast({
                title: '该物料已添加，请勿重复添加！',
                mask: true,
                icon: 'none',
            })
        }
        //! 现在仅允许添加一条物料打印一个唯一码  但保留可添加多个
        // uni.showToast({
        //     title: '该物料已添加，请勿重复添加！',
        //     mask: true,
        //     icon: 'none',
        // })
        toBack(backUrl.value)
    } else {
        console.log('执行到这里');

        if (val) {
            if (backUrl.value == 'stockIn') {
                materialChecked = [...materialChecked, { ...val, quantity: 1, isDelete: '0' }];
            } else {
                materialChecked = getStorageMaterial(val)
            }
            uni.setStorageSync('app_material', materialChecked);
        }
        toBack(backUrl.value)
    }
}

</script>
<style scoped lang="scss">
.topSearch {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    padding: 10px;
    background-color: #fff;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
}

.containerBox {
    // padding: 0 12rpx;
    padding-top: 60px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .zp-l-text-rpx {
        font-size: 12px;
    }
}
</style>