|
|
@@ -0,0 +1,266 @@
|
|
|
+<template>
|
|
|
+ <z-paging ref="paging" v-model="list" paging-class="paging-btm-shadow" bgColor="#f7f7f7" safe-area-inset-bottom @query="query">
|
|
|
+ <template #top>
|
|
|
+ <ut-navbar leftText="请选择任务所使用的种源信息" :fixed="false"></ut-navbar>
|
|
|
+ </template>
|
|
|
+ <view class="d-flex a-c pd-24 pb-0 bg-#f7f7f7">
|
|
|
+ <view class="min-w-170 flex1">
|
|
|
+ <ut-action-sheet v-model="form.instoreType" :tabs="[{ label: '全部', value: '' }, ...pt_fresh_instore_type]" @change="changeSeach" title="选择原料类型">
|
|
|
+ <view class="d-flex search-select-item a-c">
|
|
|
+ <view class="flex1 ov-hd f-s-28 c-333 text-center f-w-5 w-s-no">{{ selectDictLabel(pt_fresh_instore_type, form.instoreType) || '全部' }}</view>
|
|
|
+ <up-icon size="24rpx" color="#333" name="arrow-down-fill" class="mr-5"></up-icon>
|
|
|
+ </view>
|
|
|
+ </ut-action-sheet>
|
|
|
+ </view>
|
|
|
+ <view class="h-86 pl-20 w-100%">
|
|
|
+ <ut-search ref="searchRef" v-model="form.keyword" @search="changeSeach" @change="changeSeach" margin="0" :border="false" placeholder="搜批次号、品种名、基地名" bgColor="#fff" height="86rpx" borderRadius="10rpx"></ut-search>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <template v-for="(item, index) in list" :key="index">
|
|
|
+ <info-card :item="item" :selected="selectedItems.has(item.id)" @click="toggleSelection(item)" />
|
|
|
+ </template>
|
|
|
+ <template #bottom>
|
|
|
+ <view v-if="formDate.inputs.length > 0" class="bg-#EBF6EE c-primary f-s-24 pd-10 pl-24">
|
|
|
+ 已选择种源：
|
|
|
+ <template v-for="(item, index) in formDate.inputs" :key="index">
|
|
|
+ <text v-if="index !== 0">、</text>
|
|
|
+ {{ item.variety }}
|
|
|
+ </template>
|
|
|
+ </view>
|
|
|
+ <view class="pd-20 d-flex">
|
|
|
+ <up-button type="primary" @click="open">确认选择</up-button>
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </z-paging>
|
|
|
+ <up-popup v-if="show" :show="show" :round="10" mode="bottom" @close="close" @open="open" closeable>
|
|
|
+ <view>
|
|
|
+ <view class="d-flex a-c pd-24">
|
|
|
+ <view class="f-s-34 f-w-5 c-#333">关联种源信息</view>
|
|
|
+ <view class="bg-#37A954 radius-10 pd4-10-20-10-20 d-flex a-c" style="width: max-content">
|
|
|
+ <up-icon name="plus" color="#fff" size="24rpx"></up-icon>
|
|
|
+ <view class="c-#fff f-s-22">添加种源关联信息</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="pd-24">
|
|
|
+ <up-form class="p-rtv" labelPosition="top" :model="formDate" :rules="rules" labelWidth="auto" ref="upFormRef">
|
|
|
+ <up-form-item :borderBottom="false" prop="inputs" id="inputspppp">
|
|
|
+ <view class="d-flex flex-cln" style="width: 100%">
|
|
|
+ <template v-for="(item, index) in Array.from(selectedItems.values())" :key="index">
|
|
|
+ <souceinfo showClose :data="item" :index="index" v-model:inputs="formDate.inputs[index]" @close="handleSourceClose" />
|
|
|
+ </template>
|
|
|
+ </view>
|
|
|
+ </up-form-item>
|
|
|
+ </up-form>
|
|
|
+ </view>
|
|
|
+ <view class="pd-20 d-flex">
|
|
|
+ <up-button type="primary" @click="saveSeedInfo">确认添加</up-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </up-popup>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+import { useClientRequest } from '@/utils/request';
|
|
|
+import InfoCard from './models/info-card.vue';
|
|
|
+import Souceinfo from './models/souceinfo.vue';
|
|
|
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
+const { pt_fresh_instore_type } = toRefs<any>(proxy?.useDict('pt_fresh_instore_type'));
|
|
|
+interface SeedItem {
|
|
|
+ id: number | string;
|
|
|
+ [key: string]: any;
|
|
|
+}
|
|
|
+
|
|
|
+const list = ref<SeedItem[]>([]);
|
|
|
+const paging = ref();
|
|
|
+const form = ref({
|
|
|
+ keyword: '',
|
|
|
+ instoreType: '',
|
|
|
+ part: '',
|
|
|
+ notIncludePart: '',
|
|
|
+});
|
|
|
+//表单
|
|
|
+const formDate = ref({
|
|
|
+ inputs: [] as any,
|
|
|
+});
|
|
|
+
|
|
|
+// 自定义inputs校验函数
|
|
|
+const validateInputs = (rule: any, value: any, callback: any) => {
|
|
|
+ // value 应该是 inputs 数组
|
|
|
+ if (!value || !Array.isArray(value) || value.length === 0) {
|
|
|
+ callback(new Error('请至少添加一个种源并填写用量'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 检查每个物料
|
|
|
+ for (const item of value) {
|
|
|
+ if (!item || typeof item !== 'object') {
|
|
|
+ callback(new Error('种源数据格式错误'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ const { storageId, inputAmount } = item;
|
|
|
+ console.log(item, 'item');
|
|
|
+
|
|
|
+ if (!storageId) {
|
|
|
+ callback(new Error('种源ID缺失'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (inputAmount === undefined || inputAmount === null || inputAmount === '') {
|
|
|
+ callback(new Error('请填写种源用量'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ const amounts = Number(inputAmount);
|
|
|
+ if (isNaN(amounts) || amounts <= 0) {
|
|
|
+ callback(new Error('种源用量必须大于0'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ callback();
|
|
|
+};
|
|
|
+// 表单验证规则
|
|
|
+const rules = ref({
|
|
|
+ inputs: [{ validator: validateInputs, trigger: 'blur' }],
|
|
|
+});
|
|
|
+
|
|
|
+const selectedItems = ref(new Map<string | number, SeedItem>());
|
|
|
+const query = async (pageNo: number, pageSize: number) => {
|
|
|
+ const params = {
|
|
|
+ pageNo,
|
|
|
+ pageSize,
|
|
|
+ ...form.value,
|
|
|
+ };
|
|
|
+ const res = await useClientRequest.get('/plt-api/app/storage/list', params);
|
|
|
+ const { rows } = res;
|
|
|
+ paging.value.complete(rows);
|
|
|
+};
|
|
|
+const changeSeach = () => {
|
|
|
+ paging.value.reload();
|
|
|
+};
|
|
|
+
|
|
|
+const toggleSelection = (item: SeedItem) => {
|
|
|
+ const newMap = new Map(selectedItems.value);
|
|
|
+ if (newMap.has(item.id)) {
|
|
|
+ // 取消选择
|
|
|
+ newMap.delete(item.id);
|
|
|
+ formDate.value.inputs = formDate.value.inputs.filter((inputItem: any) => inputItem.storageId !== item.id);
|
|
|
+ } else {
|
|
|
+ // 防止重复添加
|
|
|
+ if (!formDate.value.inputs.some((inputItem: any) => inputItem.storageId === item.id)) {
|
|
|
+ formDate.value.inputs.push({
|
|
|
+ storageId: item.id,
|
|
|
+ inputAmount: '',
|
|
|
+ variety: item?.variety,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ newMap.set(item.id, item);
|
|
|
+ }
|
|
|
+
|
|
|
+ selectedItems.value = newMap;
|
|
|
+ console.log('当前选中的种子:', Array.from(newMap.keys()));
|
|
|
+ console.log('表单数据:', formDate.value.inputs);
|
|
|
+};
|
|
|
+
|
|
|
+// 创建响应式数据
|
|
|
+const show = ref(false);
|
|
|
+// 定义方法
|
|
|
+const open = () => {
|
|
|
+ // 打开逻辑，比如设置 show 为 true
|
|
|
+ show.value = true;
|
|
|
+ // 获取所有选中的完整对象
|
|
|
+ const selectedArray = Array.from(selectedItems.value.values());
|
|
|
+ console.log('选中的完整项目:', selectedArray);
|
|
|
+ // 这里可以使用 selectedArray 进行后续处理
|
|
|
+};
|
|
|
+
|
|
|
+const close = () => {
|
|
|
+ // 关闭逻辑，设置 show 为 false
|
|
|
+ show.value = false;
|
|
|
+ // console.log('close');
|
|
|
+};
|
|
|
+
|
|
|
+// 处理种源信息关闭事件
|
|
|
+const handleSourceClose = (index: number) => {
|
|
|
+ // 根据索引找到对应的项目
|
|
|
+ const selectedArray = Array.from(selectedItems.value.values());
|
|
|
+ if (index >= 0 && index < selectedArray.length) {
|
|
|
+ const item = selectedArray[index];
|
|
|
+ console.log(item, 'item');
|
|
|
+
|
|
|
+ const newMap = new Map(selectedItems.value);
|
|
|
+
|
|
|
+ // 从 selectedItems 中删除对应的项目
|
|
|
+ newMap.delete(item.id);
|
|
|
+ selectedItems.value = newMap;
|
|
|
+
|
|
|
+ // 从 formDate.inputs 中删除对应的数据
|
|
|
+ // 注意：由于删除后数组索引会变化，我们需要根据 storageId 来过滤
|
|
|
+ formDate.value.inputs = formDate.value.inputs.filter((input: any) => input.storageId !== item.id);
|
|
|
+ }
|
|
|
+};
|
|
|
+const upFormRef = ref();
|
|
|
+//校验表单然后提交
|
|
|
+const saveSeedInfo = async () => {
|
|
|
+ uni.$u.debounce(
|
|
|
+ async () => {
|
|
|
+ try {
|
|
|
+ console.log('开始校验');
|
|
|
+ console.log(formDate.value, 'formDate.value');
|
|
|
+ await upFormRef.value?.validate();
|
|
|
+ console.log('校验完成');
|
|
|
+ const params = {
|
|
|
+ processId: processId.value,
|
|
|
+ inputList: formDate.value.inputs,
|
|
|
+ };
|
|
|
+ console.log('提交参数:', params);
|
|
|
+
|
|
|
+ // 这里需要根据实际 API 进行调整
|
|
|
+ const res = await useClientRequest.post('/plt-api/app/processInputMaterial/batchInput', params);
|
|
|
+ if (res.code == 200) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '提交成功',
|
|
|
+ icon: 'success',
|
|
|
+ duration: 2000,
|
|
|
+ });
|
|
|
+ setTimeout(() => {
|
|
|
+ //发送emit
|
|
|
+ uni.$emit('updatesuperviselist');
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1,
|
|
|
+ });
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+ } catch (error: any) {
|
|
|
+ console.log('表单验证错误:', error);
|
|
|
+ // 滚动到第一个错误字段
|
|
|
+ if (error && error[0]?.field) {
|
|
|
+ const firstErrorField = error[0].field + 'pppp';
|
|
|
+ paging.value?.scrollIntoViewById(firstErrorField, 30, true);
|
|
|
+ }
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ 1000,
|
|
|
+ true,
|
|
|
+ );
|
|
|
+};
|
|
|
+const processId = ref('');
|
|
|
+onLoad((options: any) => {
|
|
|
+ processId.value = options?.id;
|
|
|
+ if (+options?.processMedType == 1) {
|
|
|
+ form.value.part = 'PL-FR-05';
|
|
|
+ } else if (+options?.processMedType == 2) {
|
|
|
+ form.value.notIncludePart = 'PL-FR-05';
|
|
|
+ }
|
|
|
+});
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.search-select-item {
|
|
|
+ height: 86rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 12rpx;
|
|
|
+}
|
|
|
+</style>
|
