feat: 选择项目导入model组件封装

src/components/projectlibraryModel/data.tsx

+import { BasicColumn, FormSchema } from '@/components/Table';
+import { h } from 'vue';
+import { Switch } from 'ant-design-vue';
+import { setRoleStatus } from '@/api/demo/system';
+import { useMessage } from '@/hooks/web/useMessage';
+
+type CheckedType = boolean | string | number;
+export const columns: (
+  | { dataIndex: string; width: number; title: string }
+  | { dataIndex: string; width: number; title: string }
+  | { dataIndex: string; width: number; title: string }
+  | { dataIndex: string; width: number; title: string }
+  | { dataIndex: string; width: number; title: string }
+  | { dataIndex: string; width: number; title: string }
+  | { dataIndex: string; width: number; title: string }
+)[] = [
+  {
+    title: '基本信息',
+    dataIndex: 'projectName',
+    width: 180,
+  },
+  {
+    title: '实施主体',
+    dataIndex: 'implementingEntity',
+    width: 180,
+  },
+  {
+    title: '建设模式',
+    dataIndex: 'constructionMode',
+    width: 200,
+  },
+  {
+    title: '建设地点',
+    dataIndex: 'constructionSite',
+    width: 180,
+  },
+  {
+    title: '项目类型',
+    dataIndex: 'projectType',
+    width: 180,
+  },
+  {
+    title: '资金来源',
+    dataIndex: 'fundingSource',
+    width: 180,
+  },
+  {
+    title: '建设目的及项目功能',
+    dataIndex: 'constructionPurpose',
+    width: 180,
+  },
+  {
+    title: '建设规模',
+    dataIndex: 'constructionScale',
+    width: 180,
+  },
+];
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    field: 'projectName',
+    label: '',
+    component: 'Input',
+    componentProps: {
+      placeholder: '搜索关键字',
+    },
+    colProps: { span: 4 },
+  },
+];
+
+export const formSchema: FormSchema[] = [
+  {
+    field: 'projectName',
+    label: '项目名称',
+    component: 'Input',
+    required: true,
+    componentProps: {
+      placeholder: 'XXXX项目',
+      disabled: true,
+      style: {
+        background: 'none',
+        border: 'none',
+      },
+    },
+    colProps: { span: 8 },
+  },
+  {
+    field: 'projectName',
+    label: '建设地点',
+    component: 'Input',
+    required: true,
+    componentProps: {
+      placeholder: '华苑片区',
+      disabled: true,
+      style: {
+        background: 'none',
+        border: 'none',
+      },
+    },
+    colProps: { span: 8 },
+  },
+  {
+    field: 'projectName',
+    label: '建设模式',
+    component: 'Input',
+    required: true,
+    componentProps: {
+      placeholder: '自建',
+      disabled: true,
+      style: {
+        background: 'none',
+        border: 'none',
+      },
+    },
+    colProps: { span: 8 },
+  },
+  // {
+  //   field: 'isReserveProject',
+  //   label: '是否为储备项目',
+  //   component: 'RadioButtonGroup',
+  //   defaultValue: '0',
+  //   componentProps: {
+  //     options: [
+  //       { label: '是', value: '1' },
+  //       { label: '否', value: '0' },
+  //     ],
+  //   },
+  // },
+  // {
+  //   field: 'status',
+  //   label: '状态',
+  //   component: 'RadioButtonGroup',
+  //   defaultValue: '0',
+  //   componentProps: {
+  //     options: [
+  //       { label: '启用', value: '1' },
+  //       { label: '停用', value: '0' },
+  //     ],
+  //   },
+  // },
+];

src/components/projectlibraryModel/projectlibraryModel.vue

+<template>
+  <BasicModal
+    width="70%"
+    v-bind="$attrs"
+    @register="register"
+    title="选择项目导入"
+    :minHeight="30"
+    okText="新建"
+    @ok="handleSubmit"
+    @visible-change="handleVisibleChange"
+  >
+    <BasicTable @register="registerTable">
+      <template #bodyCell="{ column, text, record, index }">
+        <!-- 当前列是序号列时，显示序号 -->
+        <span v-if="column.dataIndex === 'serialNumber'">{{ index + 1 }}</span>
+        <!-- 其他列正常显示 -->
+        <span v-else>{{ text }}</span>
+      </template>
+    </BasicTable>
+<!--    <button @click="getSelectRowList">获取数据</button>-->
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+  import { BasicModal } from '@/components/Modal';
+  import { BasicTable, useTable, TableAction } from '@/components/Table';
+  import { getListByPage } from '@/api/project/project';
+  import { columns, searchFormSchema } from '@/components/projectlibraryModel/data';
+  import { useMessage } from '@/hooks/web/useMessage';
+
+  const [registerTable, { reload, getSelectRows }] = useTable({
+    api: getListByPage,
+    title: '123',
+    columns,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+    },
+    useSearchForm: true,
+    showTableSetting: false,
+    bordered: true,
+    showIndexColumn: false,
+    rowSelection: {
+      type: 'checkbox',
+    },
+    // actionColumn: {
+    //   width: 80,
+    //   title: '操作',
+    //   dataIndex: 'action',
+    //   // slots: { customRender: 'action' },
+    //   fixed: undefined,
+    // },
+  });
+
+  const { createMessage } = useMessage();
+  function getSelectRowList() {
+    // createMessage.info('请在控制台查看！');
+    // console.log(getSelectRows());
+    emit('close', getSelectRows());
+  }
+
+  const emit = defineEmits(['close']);
+
+  function handleVisibleChange(v) {}
+
+  function handleSubmit() {
+    getSelectRowList()
+  }
+</script>

src/views/engineeringProject/engineeringEdit.vue

 <template>
-  <PageWrapper :title="getTitle" :contentBackground="false" headerSticky>
-    <template #extra>
-      <a-button type="primary" danger> 删除 </a-button>
-    </template>
+  <div>
+    <PageWrapper :title="getTitle" :contentBackground="false" headerSticky>
+      <template #extra>
+        <a-button type="primary" danger @click="delect"> 删除 </a-button>
+      </template>
 
-    <PageCard v-for="(item, index) in tabsFormSchema" :key="index" :title="item.name">
-      <BasicForm @register="item.Form[0]" />
-    </PageCard>
+      <PageCard v-for="(item, index) in tabsFormSchema" :key="index" :title="item.name">
+        <BasicForm @register="item.Form[0]" />
+      </PageCard>
 
-    <a-button type="primary" @click="addItem"> 添加 </a-button>
-  </PageWrapper>
+      <a-button type="primary" @click="addItem"> 添加 </a-button>
+    </PageWrapper>
+    <projectlibraryModel @register="register" @close="handleNew" />
+  </div>
 </template>
 <script lang="ts" setup>
+  import projectlibraryModel from '@/components/projectlibraryModel/projectlibraryModel.vue';
+  const [register, { openModal: openModal }] = useModal();
   import { unref, computed, onMounted, ref, reactive } from 'vue';
 
   import { useRoute } from 'vue-router';
@@ -19,6 +24,8 @@
   import PageCard from '@/components/Page/src/PageCard.vue';
   import { BasicForm, useForm, FormProps, UseFormReturnType } from '@/components/Form';
   import { formSchema } from './data';
+  import {useModal} from "@/components/Modal";
+  import {router} from "@/router";
 
   const getTitle = computed(() => (!unref(isUpdate) ? '新增2024年工程项目投资计划（工程）' : '编辑2024年工程项目投资计划（工程）'));
   const isUpdate = ref(false);
@@ -47,6 +54,14 @@
       Form: useForm(Object.assign({ schemas: formSchema }, baseFormConfig) as FormProps),
     });
   }
+  async function delect() {
+    openModal(true, {
+      // data: ['year'],
+    });
+  }
+  const handleNew = (e) => {
+    console.log('e', e);
+  };
 </script>
 <style lang="less" scoped>
   // .vben-page-wrapper-content-bg {