添加选择采集项弹窗

xjrsoft-vue3/src/api/jcsj/cjx/index.ts

@@ -29,6 +29,21 @@ export async function getMesCollectionItemPage(params: MesCollectionItemPagePara
 }
 
 /**
+ * @description: 查询MesCollectionItem列表（不分页）
+ */
+export async function getMesCollectionItemList(params?: MesCollectionItemPageParams, mode: ErrorMessageMode = 'modal') {
+  return defHttp.get<MesCollectionItemPageModel[]>(
+    {
+      url: Api.List,
+      params,
+    },
+    {
+      errorMessageMode: mode,
+    },
+  );
+}
+
+/**
  * @description: 获取MesCollectionItem信息
  */
 export async function getMesCollectionItem(id: String, mode: ErrorMessageMode = 'modal') {

xjrsoft-vue3/src/components/Form/src/components/SubForm.vue

@@ -1667,9 +1667,21 @@
     localStorage.setItem('tableColumnShowSetting', JSON.stringify(obj));
   }
 
+  // 获取采集项表单API（用于采集方案页面）
+  const collectionItemFormApi = inject('collectionItemFormApi', null);
+
   function customClick(executeButton, record?, index?) {
     curRecord.value = index;
     curButtonModalConfig.value = executeButton.modal;
+    
+    // 特殊处理：如果是选择采集项按钮，直接调用provide的方法
+    if (executeButton.key === 'selectCollectionItem' && collectionItemFormApi) {
+      if (collectionItemFormApi.openCollectionItemSelect) {
+        collectionItemFormApi.openCollectionItemSelect();
+      }
+      return;
+    }
+    
     let obj = {
       selectedRows: selectedRowsData.value,
       tableDatas: data.value,

xjrsoft-vue3/src/views/jcsj/cjfa/components/CollectionItemSelectModal.vue

+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="registerModal"
+    title="选择采集项"
+    width="800"
+    @ok="handleSubmit"
+    @cancel="handleCancel"
+    :destroyOnClose="true"
+  >
+    <BasicTable @register="registerTable" />
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+import { ref, nextTick } from 'vue';
+import { BasicModal, useModalInner } from '/@/components/Modal';
+import { BasicTable, useTable } from '/@/components/Table';
+import { getMesCollectionItemPage } from '/@/api/jcsj/cjx';
+import { columns } from './collectionItemColumns';
+import { useMessage } from '/@/hooks/web/useMessage';
+const emit = defineEmits(['success']);
+
+
+const { createMessage } = useMessage();
+const contentType = ref<string>('');
+const getExistingItemIds = ref<(() => string[]) | null>(null); // 获取已存在的采集项ID列表的函数
+
+// 表格配置：不再维护外部 selection 状态
+const [registerTable, {
+  reload,
+  clearSelectedRowKeys,
+  getSelectRows,
+  getDataSource,
+  setTableData
+}] = useTable({
+  title: '采集项列表',
+  rowSelection: {
+    type: 'checkbox',
+  },
+  api: async (params) => {
+    if (!contentType.value) {
+      createMessage.warning('请先选择采集内容');
+      return { list: [], total: 0 };
+    }
+
+    const ctParam = String(contentType.value || '');
+    if (!ctParam) return { list: [], total: 0 };
+
+    const queryParams = {
+      ...params,
+      contentType: ctParam,
+      size: Math.min(params.pageSize || 50, 100),
+    };
+
+    try {
+      const result = await getMesCollectionItemPage(queryParams);
+      // 兼容多种返回格式
+      if (Array.isArray(result)) {
+        return { list: result, total: result.length };
+      }
+      if (result?.list) {
+        return { list: result.list, total: result.total ?? result.list.length };
+      }
+      if (result?.records) {
+        return { list: result.records, total: result.total ?? result.records.length };
+      }
+      // 泛型兼容：找第一个数组字段
+      for (const key in result) {
+        if (Array.isArray(result[key])) {
+          return { list: result[key], total: result.total ?? result[key].length };
+        }
+      }
+    } catch (error: any) {
+      console.error('获取采集项失败:', error);
+      createMessage.error(error?.message || '请求失败');
+    }
+    return { list: [], total: 0 };
+  },
+  columns,
+  pagination: { pageSize: 50 },
+  rowKey: 'id',
+  canResize: false,
+  showIndexColumn: false,
+  useSearchForm: false,
+});
+
+// 弹窗注册
+const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+  // 先重置所有状态，确保按钮可用
+  setModalProps({
+    confirmLoading: false,
+    destroyOnClose: true,
+  });
+
+  // 提取 contentType
+  let ctValue = data?.contentType;
+  if (Array.isArray(ctValue)) ctValue = ctValue[0];
+  contentType.value = ctValue ? String(ctValue) : '';
+
+  // 保存获取已存在采集项ID列表的函数
+  getExistingItemIds.value = typeof data?.getExistingItemIds === 'function' 
+    ? data.getExistingItemIds 
+    : null;
+
+  if (!contentType.value) {
+    createMessage.warning('请先选择采集内容');
+    closeModal();
+    return;
+  }
+
+  // 等待 DOM 更新
+  await nextTick();
+
+  // 清除可能遗留的选中状态和数据
+  if (clearSelectedRowKeys) {
+    clearSelectedRowKeys();
+  }
+  if (setTableData) {
+    setTableData([]);
+  }
+
+  // 重新加载对应类型的数据
+  await reload();
+
+  // 再次确保选中已清空
+  await nextTick();
+  if (clearSelectedRowKeys) {
+    clearSelectedRowKeys();
+  }
+
+  // 确保按钮状态正确
+  setModalProps({
+    confirmLoading: false,
+  });
+});
+
+// 提交处理：直接从表格获取选中行
+async function handleSubmit() {
+  try {
+    // 设置加载状态，防止重复点击
+    setModalProps({ confirmLoading: true });
+
+    const selectedRows = getSelectRows();
+    console.log('handleSubmit - selectedRows:', selectedRows);
+
+    if (!selectedRows || selectedRows.length === 0) {
+      createMessage.warning('请至少选择一个采集项');
+      setModalProps({ confirmLoading: false });
+      return;
+    }
+
+    // 在提交时实时获取最新的采集项列表，检查是否重复
+    let currentExistingItemIds: string[] = [];
+    if (getExistingItemIds.value) {
+      try {
+        const ids = getExistingItemIds.value();
+        currentExistingItemIds = Array.isArray(ids) 
+          ? ids.map(id => String(id)).filter(Boolean)
+          : [];
+      } catch (error) {
+        console.error('获取已存在的采集项列表失败:', error);
+      }
+    }
+
+    // 检查是否与已存在的采集项重复
+    const duplicateItems: any[] = [];
+    selectedRows.forEach((item: any) => {
+      const itemId = String(item.id || '');
+      if (currentExistingItemIds.includes(itemId)) {
+        duplicateItems.push(item);
+      }
+    });
+
+    if (duplicateItems.length > 0) {
+      const names = duplicateItems.map(item => item.name || item.code || item.id).join('、');
+      createMessage.warning(`以下采集项已存在，不可重复选择：${names}`);
+      setModalProps({ confirmLoading: false });
+      return;
+    }
+
+    // 触发成功事件
+    emit('success', selectedRows);
+
+    // 重置加载状态
+    setModalProps({ confirmLoading: false });
+
+    // 清空所有数据和状态（这些操作即使失败也不应该影响成功流程）
+    try {
+      if (clearSelectedRowKeys) {
+        clearSelectedRowKeys();
+      }
+      if (setTableData) {
+        setTableData([]);
+      }
+    } catch (cleanupError) {
+      console.warn('清空数据时出错（不影响提交）:', cleanupError);
+    }
+    
+    // 使用 nextTick 确保状态更新后再关闭
+    await nextTick();
+    closeModal();
+  } catch (error) {
+    console.error('提交失败:', error);
+    createMessage.error('提交失败，请重试');
+    setModalProps({ confirmLoading: false });
+  }
+}
+
+// 取消处理
+function handleCancel() {
+  // 确保按钮状态正确
+  setModalProps({ confirmLoading: false });
+  
+  // 清空所有数据和状态
+  if (clearSelectedRowKeys) {
+    clearSelectedRowKeys();
+  }
+  if (setTableData) {
+    setTableData([]);
+  }
+  
+  closeModal();
+}
+</script>

xjrsoft-vue3/src/views/jcsj/cjfa/components/Form.vue

@@ -9,10 +9,11 @@
       :isCamelCase="true" 
       @model-change="handleChange"
     />
+    <CollectionItemSelectModal @register="registerSelectModal" @success="handleSelectSuccess" />
   </div>
 </template>
 <script lang="ts" setup>
-  import { reactive, ref, onMounted, nextTick, watch } from 'vue';
+  import { reactive, ref, onMounted, nextTick, watch, provide } from 'vue';
   import { formProps, formEventConfigs } from './config';
   import SimpleForm from '/@/components/SimpleForm/src/SimpleForm.vue';
   import { addMesCollectionScheme, getMesCollectionScheme, updateMesCollectionScheme } from '/@/api/jcsj/cjfa';
@@ -25,6 +26,9 @@
   import { changeWorkFlowForm, changeSchemaDisabled } from '/@/hooks/web/useWorkFlowForm';
   import { WorkFlowFormParams } from '/@/model/workflow/bpmnConfig';
   import { useRouter } from 'vue-router';
+  import { useModal } from '/@/components/Modal';
+  import CollectionItemSelectModal from './CollectionItemSelectModal.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
   
   const { filterFormSchemaAuth } = usePermission();
 
@@ -45,6 +49,14 @@
     formInfo:{formId:'',formName:''}
   });
   const { currentRoute } = useRouter();
+  const [registerSelectModal, { openModal: openSelectModal }] = useModal();
+  const { createMessage } = useMessage();
+
+  // 提供方法给SubForm使用
+  provide('collectionItemFormApi', {
+    openCollectionItemSelect,
+  });
+
   watch(
     () => state.formModel,
     (val) => { 
@@ -55,6 +67,7 @@
     },
   );
 
+  
   onMounted(async () => {
     try {
       if (props.fromPage == FromPageType.MENU) {
@@ -199,6 +212,65 @@
   function handleChange(val) { 
     emits('update:value', val);
   }
+
+
+  // 打开采集项选择弹窗
+  function openCollectionItemSelect() {
+    const contentType = state.formModel.contentType;
+    if (!contentType) {
+      createMessage.warning('请先选择采集内容');
+      return;
+    }
+    // 传入获取最新采集项列表的函数，以便在提交时实时获取最新数据
+    const getExistingItemIds = () => {
+      const currentList = state.formModel.mesCollectionSchemeItemList || [];
+      return currentList.map((item: any) => item.collectionItemId || item.id).filter(Boolean);
+    };
+    openSelectModal(true, { contentType, getExistingItemIds });
+  }
+
+  // 处理选择采集项成功
+  function handleSelectSuccess(selectedItems: any[]) {
+    try {
+      if (!selectedItems || selectedItems.length === 0) {
+        return;
+      }
+
+      const currentList = state.formModel.mesCollectionSchemeItemList || [];
+
+      selectedItems.forEach((item) => {
+        const newItem = {
+          code: item.code,
+          name: item.name,
+          contentType: item.contentType,
+          note: item.note || '',
+          collectionItemId: item.id,
+          schemeId: state.formModel.id || '',
+          _isFromSelect: true, // 标记为从选择弹窗添加的项，用于禁用编辑
+        };
+        currentList.push(newItem);
+      });
+
+      state.formModel.mesCollectionSchemeItemList = currentList;
+      // 更新表单值
+      if (systemFormRef.value) {
+        systemFormRef.value.setFieldsValue({
+          mesCollectionSchemeItemList: currentList,
+        });
+      }
+    } catch (error) {
+      console.error('处理选择采集项成功时出错:', error);
+      // 不抛出错误，避免影响弹窗关闭
+    }
+  }
+
+  // 暴露方法给外部调用
+  function getFormApi() {
+    return {
+      openCollectionItemSelect,
+    };
+  }
+
    async function sendMessageForAllIframe() {
     try {
       if (systemFormRef.value && systemFormRef.value.sendMessageForAllIframe) {
@@ -218,7 +290,9 @@
     setWorkFlowForm,
     getRowKey,
     getFieldsValue,
-    sendMessageForAllIframe
+    sendMessageForAllIframe,
+    getFormApi,
+    openCollectionItemSelect,
   });
 </script>
 

xjrsoft-vue3/src/views/jcsj/cjfa/components/collectionItemColumns.ts

+import { BasicColumn } from '/@/components/Table';
+
+export const columns: BasicColumn[] = [
+  {
+    title: '编码',
+    dataIndex: 'code',
+    width: 150,
+  },
+  {
+    title: '名称',
+    dataIndex: 'name',
+    width: 200,
+  },
+  {
+    title: '数据类型',
+    dataIndex: 'dataType',
+    width: 120,
+  },
+  {
+    title: '备注',
+    dataIndex: 'note',
+    width: 200,
+  },
+];
+
+
+

xjrsoft-vue3/src/views/jcsj/cjfa/components/config.ts

@@ -409,7 +409,7 @@ export const formProps: FormProps = {
                       suffix: '',
                       addonBefore: '',
                       addonAfter: '',
-                      disabled: false,
+                      disabled: (record: any) => record?._isFromSelect === true,
                       allowClear: false,
                       showLabel: true,
                       required: false,
@@ -440,7 +440,7 @@ export const formProps: FormProps = {
                       suffix: '',
                       addonBefore: '',
                       addonAfter: '',
-                      disabled: false,
+                      disabled: (record: any) => record?._isFromSelect === true,
                       allowClear: false,
                       showLabel: true,
                       required: false,
@@ -468,7 +468,7 @@ export const formProps: FormProps = {
                       showSearch: false,
                       isMultiple: false,
                       clearable: false,
-                      disabled: false,
+                      disabled: (record: any) => record?._isFromSelect === true,
                       staticOptions: [
                         { key: 1, label: 'Option 1', value: 'Option 1' },
                         { key: 2, label: 'Option 2', value: 'Option 2' },
@@ -510,7 +510,7 @@ export const formProps: FormProps = {
                       suffix: '',
                       addonBefore: '',
                       addonAfter: '',
-                      disabled: false,
+                      disabled: (record: any) => record?._isFromSelect === true,
                       allowClear: false,
                       showLabel: true,
                       required: false,
@@ -567,7 +567,7 @@ export const formProps: FormProps = {
                 buttonName: '选择数据',
                 showLabel: true,
                 showComponentBorder: true,
-                showBorder: false,
+                showBorder: true,
                 bordercolor: '#f0f0f0',
                 bordershowtype: [true, true, true, true],
                 borderwidth: 1,
@@ -603,12 +603,20 @@ export const formProps: FormProps = {
                     checked: false,
                   },
                 ],
-                isShowAdd: true,
+                isShowAdd: false,
                 isShowDelete: true,
                 hasCheckedCol: true,
                 events: {},
                 showPagenation: true,
                 showColunmSet: false,
+                topButtonList: [
+                  {
+                    key: 'selectCollectionItem',
+                    label: '新增',
+                    style: 'primary',
+                    icon: 'ant-design:plus-outlined',
+                  },
+                ],
               },
             },
           ],