diff --git a/apps/web-contract/src/views/contract/iframe-info/components/info-archived/curd.tsx b/apps/web-contract/src/views/contract/iframe-info/components/info-archived/curd.tsx
new file mode 100644
index 00000000..f7c7264f
--- /dev/null
+++ b/apps/web-contract/src/views/contract/iframe-info/components/info-archived/curd.tsx
@@ -0,0 +1,308 @@
+import { DICT_TYPE, getDictObj, getDictOptions } from '#/utils/dict';
+import { dict } from '@fast-crud/fast-crud';
+
+/**
+ * 筛选合同列表数据
+ *
+ */
+function filterContractTypes(contractTypeData: any = [], parentId: string) {
+  return contractTypeData
+    .map((item) => {
+      item.label = item.contrLevelName;
+      item.value = item.contrLevelId;
+      return item;
+    })
+    .filter((item) => item.parentId === parentId);
+}
+
+export function getFormSchema(params: any = {}) {
+  const { contractTypeData, readOnly = false } = params;
+
+  return {
+    contractName: {
+      title: '合同名称',
+      key: 'contractName',
+      col: { span: 24 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    ctrType: {
+      title: '合同类别',
+      key: 'ctrType',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        class: 'min-w-[200px]',
+        dict: dict({
+          async getData({ form = {} }) {
+            return filterContractTypes(contractTypeData, '-1');
+          },
+        }),
+      },
+      valueChange({ form, value, getComponentRef }) {
+        form.ctrTwoType = undefined;
+        if (value) {
+          getComponentRef('ctrTwoType').reloadDict(); // 执行city的select组件的reloadDict()方法，触发“city”重新加载字典
+        }
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          let data = filterContractTypes(contractTypeData, '-1');
+          for (const item of data) {
+            if (item.value === form.ctrType) {
+              return <span>{item.label}</span>;
+            }
+          }
+          return <span></span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    ctrTwoType: {
+      title: '二级类别',
+      key: 'ctrTwoType',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        class: 'min-w-[200px]',
+        dict: dict({
+          async getData({ form = {} }) {
+            return filterContractTypes(contractTypeData, form.ctrType);
+          },
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          let data = filterContractTypes(contractTypeData, form.ctrType);
+          for (const item of data) {
+            if (item.value === form.ctrTwoType) {
+              return <span>{item.label}</span>;
+            }
+          }
+          return <span></span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    frameProtocol: {
+      title: '框架协议',
+      key: 'frameProtocol',
+      col: { span: 8 },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.common_whether),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.common_whether, form.frameProtocol)?.label}
+            </span>
+          );
+        },
+      },
+    },
+    frameProtocolCtr: {
+      title: '框架协议下的合同',
+      key: 'frameProtocolCtr',
+      col: { span: 12 },
+      labelCol: { style: { width: '200px' } },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.common_whether),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.common_whether, form.frameProtocolCtr)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+    },
+    fundAllocation: {
+      title: '资金流向',
+      key: 'fundAllocation',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_fund_flow),
+        }),
+      },
+      valueChange: {
+        immediate: true, //是否立即执行一次
+        handle({ form }) {
+          console.log(form);
+          form.fundAllocationName = getDictObj(
+            DICT_TYPE.contract_fund_flow,
+            form.fundAllocation,
+          )?.label;
+        },
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.contract_fund_flow, form.fundAllocation)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择资金流向' }],
+    },
+    fundDitch: {
+      title: '资金渠道',
+      key: 'fundDitch',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_funding_source),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.contract_funding_source, form.fundDitch)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择资金渠道' }],
+    },
+    budgetSum: {
+      title: '预算金额',
+      key: 'budgetSum',
+      col: { span: 8 },
+      colon: false,
+      component: {
+        name: 'a-input-number',
+        vModel: 'value',
+        class: 'w-full',
+        min: 0,
+        max: 9999,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span class="">{form.budgetSum}</span>;
+        },
+      },
+    },
+    priceType: {
+      title: '',
+      key: 'priceType',
+      col: { span: 6 },
+      labelCol: { style: { width: '12px' } },
+      colon: false,
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_currency_unit),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="mr-2">
+              {getDictObj(DICT_TYPE.contract_currency_unit, form.priceType)}
+            </span>
+          );
+        },
+      },
+    },
+    organiza: {
+      title: '组织形式',
+      key: 'organiza',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_organization_form),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.contract_organization_form, form.organiza)}
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择组织形式' }],
+    },
+    fileList: {
+      title: '相关附件',
+      key: 'fileList',
+    },
+  };
+}
diff --git a/apps/web-contract/src/views/contract/iframe-info/components/info-archived/info-archived.vue b/apps/web-contract/src/views/contract/iframe-info/components/info-archived/info-archived.vue
index 443512f8..ef107937 100644
--- a/apps/web-contract/src/views/contract/iframe-info/components/info-archived/info-archived.vue
+++ b/apps/web-contract/src/views/contract/iframe-info/components/info-archived/info-archived.vue
@@ -1,13 +1,221 @@
-<template>
-  <div>
+<script setup lang="ts">
+import { ref, computed, reactive, onMounted, nextTick, onUnmounted } from 'vue';
+import { MdiAdd } from '@vben/icons';
 
+import { Page, useVbenModal } from '@vben/common-ui';
+import { dict, type FormScopeContext } from '@fast-crud/fast-crud';
+import { MdiUpload } from '@vben/icons';
+import { useRouter } from 'vue-router';
+import dayjs, { Dayjs } from 'dayjs';
+import Apis from '#/api';
+import {
+  message,
+  Modal,
+  type UploadChangeParam,
+  type UploadProps,
+} from 'ant-design-vue';
+import { useUserStore } from '@vben/stores';
+import { useRoute } from 'vue-router';
+import { getFormSchema } from './curd';
+import { FileUploader } from '#/utils/file';
+import { DICT_TYPE, getDictObj, getDictOptions } from '#/utils/dict';
+import { useVxeTable } from '#/hooks/vxeTable';
+import { useRender } from '#/hooks/useRender';
+import type { VxeGridPropTypes } from 'vxe-table';
+
+const { xGridRef, gridProps, triggerProxy } = useVxeTable({ ref: 'xGridRef' });
+const userStore = useUserStore();
+
+const fileUploader = new FileUploader({});
+
+const router = useRouter();
+const route = useRoute();
+const id = ref(route.params.id);
+const pageRef = ref();
+
+const currData = ref({});
+
+const formRef = ref();
+
+let isLoading = ref(false);
+
+let contractTypeData = ref([]);
+
+let collapses = ['1', '2'];
+let collapseActiveKey = ref(collapses);
+
+const formBinding = ref({
+  col: { span: 24 },
+  initialForm: {
+    contractName: '',
+    frameProtocol: '0',
+    frameProtocolCtr: '0',
+    priceType: 'CNY',
+  },
+  labelCol: { style: { width: '120px' } },
+  columns: {},
+});
+
+function getColumns(params?): any {
+  let columns: VxeGridPropTypes.Columns = [
+    { type: 'seq', title: '序号', width: 60 },
+    { field: 'basisId', title: '依据号', width: 130 },
+    {
+      field: 'basisName',
+      title: '依据名称',
+      width: 200,
+    },
+    { field: 'basisNum', title: '依据编号', width: 180 },
+    {
+      field: 'basisTypeId',
+      title: '依据类型',
+      width: 100,
+      slots: {
+        default: ({ row }) => {
+          return getDictObj(DICT_TYPE.contract_basis_type, row.basisTypeId)
+            ?.label;
+        },
+      },
+    },
+    {
+      field: 'endDate',
+      title: '有效期',
+      width: 150,
+      slots: {
+        default: ({ row }) => {
+          return useRender.renderDate(row.endDate, 'YYYY-MM-DD');
+        },
+      },
+    },
+  ];
+
+  if (!id.value || (id.value && currData.value.step == 'edit')) {
+    columns.push({
+      title: '操作',
+      width: 120,
+      slots: { default: 'operate' },
+    });
+  }
+  return columns;
+}
+
+/** Hooks - 表格 */
+const gridOptions = reactive(
+  gridProps({
+    height: '200px',
+    columns: getColumns(),
+    data: [],
+    toolbarConfig: {
+      enabled: false,
+    },
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      useKey: true,
+      isCurrent: false,
+    },
+  }),
+);
+
+onMounted(async () => {
+  isLoading.value = true;
+  console.log(id.value);
+
+  try {
+    let contractReferTypeData = await Apis.contractReferType.get_list({
+      params: {},
+    });
+    contractTypeData.value = contractReferTypeData.rows || [];
+
+    if (id.value) {
+      let data: any = await Apis.contractBaseInfo.get_getOne({
+        params: { guid: id.value },
+      });
+      console.log(data);
+
+      currData.value = data;
+
+      formBinding.value.columns = getFormSchema({
+        contractTypeData: contractTypeData.value,
+        readOnly: !id.value || currData.value.step != 'edit',
+      });
+
+      xGridRef.value.reloadColumn(getColumns());
+
+      nextTick(() => {
+        formRef.value.setFormData(data);
+      });
+
+      // 如果有签约依据
+      if (data.basisId) {
+        let basisList = await Apis.lxBasisSale.get_page({
+          params: { basisId: data.basisId },
+        });
+        nextTick(() => {
+          xGridRef.value.insert(basisList.rows);
+        });
+      }
+
+      if (data.fileUuid) {
+        let files = await fileUploader.select(data.fileUuid);
+        console.log(files);
+        nextTick(() => {
+          formRef.value.setFormData({
+            fileList: files,
+          });
+        });
+      }
+
+      loadDataByContractTypeData();
+    } else {
+      formBinding.value.columns = getFormSchema({
+        contractTypeData: contractTypeData.value,
+        readOnly: false,
+      });
+    }
+  } catch (error) {
+    console.log(error);
+
+    Modal.error({
+      title: '提示',
+      content: '当前合同信息不存在',
+      onOk() {
+        back();
+      },
+    });
+  } finally {
+    isLoading.value = false;
+  }
+});
+</script>
+
+<template>
+  <div class="flex h-full w-full flex-col">
+    <a-collapse v-model:activeKey="collapseActiveKey" :bordered="false">
+      <a-collapse-panel key="1" header="基本信息" class="w-full">
+        <fs-form ref="formRef" class="w-full" v-bind="formBinding">
+          <template #form_fileList="scope">
+            <a-upload
+              v-model:fileList="scope.form.fileList"
+              accept=".pdf,.ppt,.pptx"
+              :max-count="3"
+              name="file"
+            >
+            </a-upload>
+          </template>
+        </fs-form>
+      </a-collapse-panel>
+
+      <a-collapse-panel key="2" header="签约依据" class="w-full">
+        <template #extra> </template>
+
+        <VxeGrid ref="xGridRef" v-bind="gridOptions" class="">
+          <template #toolbar_buttons></template>
+        </VxeGrid>
+      </a-collapse-panel>
+    </a-collapse>
   </div>
 </template>
 
-<script lang="ts" setup>
-
-</script>
-
-<style>
-
-</style>
+<style scoped></style>
diff --git a/apps/web-contract/src/views/contract/iframe-info/components/info-business/curd.tsx b/apps/web-contract/src/views/contract/iframe-info/components/info-business/curd.tsx
new file mode 100644
index 00000000..b1f3b6f0
--- /dev/null
+++ b/apps/web-contract/src/views/contract/iframe-info/components/info-business/curd.tsx
@@ -0,0 +1,703 @@
+import { DICT_TYPE, getDictObj, getDictOptions } from '#/utils/dict';
+import { dict } from '@fast-crud/fast-crud';
+
+/**
+ * 合同选商
+ *
+ */
+function filterContractTypes(contractTypeData: any = [], parentId: string) {
+  return contractTypeData
+    .map((item) => {
+      item.label = item.contrLevelName;
+      item.value = item.contrLevelId;
+      return item;
+    })
+    .filter((item) => item.parentId === parentId);
+}
+
+export function getFormSchema(params: any = {}) {
+  const { contractTypeData, readOnly = false } = params;
+
+  return {
+    contractName: {
+      title: '合同名称',
+      key: 'contractName',
+      col: { span: 24 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    ctrType: {
+      title: '合同类别',
+      key: 'ctrType',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        class: 'min-w-[200px]',
+        dict: dict({
+          async getData({ form = {} }) {
+            return filterContractTypes(contractTypeData, '-1');
+          },
+        }),
+      },
+      valueChange({ form, value, getComponentRef }) {
+        form.ctrTwoType = undefined;
+        if (value) {
+          getComponentRef('ctrTwoType').reloadDict(); // 执行city的select组件的reloadDict()方法，触发“city”重新加载字典
+        }
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          let data = filterContractTypes(contractTypeData, '-1');
+          for (const item of data) {
+            if (item.value === form.ctrType) {
+              return <span>{item.label}</span>;
+            }
+          }
+          return <span></span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    ctrTwoType: {
+      title: '二级类别',
+      key: 'ctrTwoType',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        class: 'min-w-[200px]',
+        dict: dict({
+          async getData({ form = {} }) {
+            return filterContractTypes(contractTypeData, form.ctrType);
+          },
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          let data = filterContractTypes(contractTypeData, form.ctrType);
+          for (const item of data) {
+            if (item.value === form.ctrTwoType) {
+              return <span>{item.label}</span>;
+            }
+          }
+          return <span></span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    frameProtocol: {
+      title: '框架协议',
+      key: 'frameProtocol',
+      col: { span: 8 },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.common_whether),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.common_whether, form.frameProtocol)?.label}
+            </span>
+          );
+        },
+      },
+    },
+    frameProtocolCtr: {
+      title: '框架协议下的合同',
+      key: 'frameProtocolCtr',
+      col: { span: 12 },
+      labelCol: { style: { width: '200px' } },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.common_whether),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.common_whether, form.frameProtocolCtr)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+    },
+    fundAllocation: {
+      title: '资金流向',
+      key: 'fundAllocation',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_fund_flow),
+        }),
+      },
+      valueChange: {
+        immediate: true, //是否立即执行一次
+        handle({ form }) {
+          console.log(form);
+          form.fundAllocationName = getDictObj(
+            DICT_TYPE.contract_fund_flow,
+            form.fundAllocation,
+          )?.label;
+        },
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.contract_fund_flow, form.fundAllocation)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择资金流向' }],
+    },
+    fundDitch: {
+      title: '资金渠道',
+      key: 'fundDitch',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_funding_source),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.contract_funding_source, form.fundDitch)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择资金渠道' }],
+    },
+    budgetSum: {
+      title: '预算金额',
+      key: 'budgetSum',
+      col: { span: 8 },
+      colon: false,
+      component: {
+        name: 'a-input-number',
+        vModel: 'value',
+        class: 'w-full',
+        min: 0,
+        max: 9999,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span class="">{form.budgetSum}</span>;
+        },
+      },
+    },
+    priceType: {
+      title: '',
+      key: 'priceType',
+      col: { span: 6 },
+      labelCol: { style: { width: '12px' } },
+      colon: false,
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_currency_unit),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="mr-2">
+              {getDictObj(DICT_TYPE.contract_currency_unit, form.priceType)}
+            </span>
+          );
+        },
+      },
+    },
+    organiza: {
+      title: '组织形式',
+      key: 'organiza',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_organization_form),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.contract_organization_form, form.organiza)}
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择组织形式' }],
+    },
+    fileList: {
+      title: '相关附件',
+      key: 'fileList',
+    },
+  };
+}
+
+export function getFormSchema2(params: any = {}) {
+  const { contractTypeData, readOnly = false } = params;
+
+  return {
+    contractName: {
+      title: '项目',
+      key: 'contractName',
+      col: { span: 12 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    ctrType: {
+      title: '项目类别',
+      key: 'ctrType',
+      col: { span: 12 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        class: 'min-w-[200px]',
+        dict: dict({
+          async getData({ form = {} }) {
+            return filterContractTypes(contractTypeData, '-1');
+          },
+        }),
+      },
+      valueChange({ form, value, getComponentRef }) {
+        form.ctrTwoType = undefined;
+        if (value) {
+          getComponentRef('ctrTwoType').reloadDict(); // 执行city的select组件的reloadDict()方法，触发“city”重新加载字典
+        }
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          let data = filterContractTypes(contractTypeData, '-1');
+          for (const item of data) {
+            if (item.value === form.ctrType) {
+              return <span>{item.label}</span>;
+            }
+          }
+          return <span></span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    ctrTwoType: {
+      title: '项目名称',
+      key: 'ctrTwoType',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        class: 'min-w-[200px]',
+        dict: dict({
+          async getData({ form = {} }) {
+            return filterContractTypes(contractTypeData, form.ctrType);
+          },
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          let data = filterContractTypes(contractTypeData, form.ctrType);
+          for (const item of data) {
+            if (item.value === form.ctrTwoType) {
+              return <span>{item.label}</span>;
+            }
+          }
+          return <span></span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    frameProtocol: {
+      title: '商务计价方式',
+      key: 'frameProtocol',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.common_whether),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.common_whether, form.frameProtocol)?.label}
+            </span>
+          );
+        },
+      },
+    },
+    frameProtocolCtr: {
+      title: '选商方式',
+      key: 'frameProtocolCtr',
+      col: { span: 24 },
+      labelCol: { style: { width: '200px' } },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.common_whether),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.common_whether, form.frameProtocolCtr)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+    },
+    fundAllocation: {
+      title: '选商方式说明',
+      key: 'fundAllocation',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_fund_flow),
+        }),
+      },
+      valueChange: {
+        immediate: true, //是否立即执行一次
+        handle({ form }) {
+          console.log(form);
+          form.fundAllocationName = getDictObj(
+            DICT_TYPE.contract_fund_flow,
+            form.fundAllocation,
+          )?.label;
+        },
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.contract_fund_flow, form.fundAllocation)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择资金流向' }],
+    },
+    fundDitch: {
+      title: '资质要求',
+      key: 'fundDitch',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_funding_source),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {
+                getDictObj(DICT_TYPE.contract_funding_source, form.fundDitch)
+                  ?.label
+              }
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择资金渠道' }],
+    },
+    budgetSum: {
+      title: '受托招标代理',
+      key: 'budgetSum',
+      col: { span: 24 },
+      colon: false,
+      component: {
+        name: 'a-input-number',
+        vModel: 'value',
+        class: 'w-full',
+        min: 0,
+        max: 9999,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span class="">{form.budgetSum}</span>;
+        },
+      },
+    },
+    priceType: {
+      title: '',
+      key: 'priceType',
+      col: { span: 6 },
+      labelCol: { style: { width: '12px' } },
+      colon: false,
+      component: {
+        name: 'fs-dict-select',
+        vModel: 'value',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_currency_unit),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="mr-2">
+              {getDictObj(DICT_TYPE.contract_currency_unit, form.priceType)}
+            </span>
+          );
+        },
+      },
+    },
+    organiza: {
+      title: '推荐供应商',
+      key: 'organiza',
+      col: { span: 24 },
+      component: {
+        name: 'fs-dict-radio',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_organization_form),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.contract_organization_form, form.organiza)}
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择组织形式' }],
+    },
+    organiza1: {
+      title: '项目范围',
+      key: 'organiza',
+      col: { span: 24 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+        class: 'min-w-[200px]',
+        dict: dict({
+          data: getDictOptions(DICT_TYPE.contract_organization_form),
+        }),
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return (
+            <span class="">
+              {getDictObj(DICT_TYPE.contract_organization_form, form.organiza)}
+            </span>
+          );
+        },
+      },
+      rules: [{ required: true, message: '请选择组织形式' }],
+    },
+    contractName1: {
+      title: '项目内容',
+      key: 'contractName',
+      col: { span: 12 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    contractName2: {
+      title: '工期要求（质量要求）',
+      key: 'contractName',
+      col: { span: 12 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    contractName3: {
+      title: '工程量（采购量）',
+      key: 'contractName',
+      col: { span: 12 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    contractName4: {
+      title: '计划投资明细',
+      key: 'contractName',
+      col: { span: 12 },
+      component: {
+        name: 'a-input',
+        vModel: 'value',
+        allowClear: false,
+      },
+      conditionalRender: {
+        match({ form }) {
+          return readOnly;
+        },
+        render({ form }) {
+          return <span>{form.contractName}</span>;
+        },
+      },
+      rules: [{ required: true }],
+    },
+    fileList: {
+      title: '相关附件',
+      key: 'fileList',
+    },
+  };
+}
diff --git a/apps/web-contract/src/views/contract/iframe-info/components/info-business/info-business.vue b/apps/web-contract/src/views/contract/iframe-info/components/info-business/info-business.vue
index 443512f8..475d6f35 100644
--- a/apps/web-contract/src/views/contract/iframe-info/components/info-business/info-business.vue
+++ b/apps/web-contract/src/views/contract/iframe-info/components/info-business/info-business.vue
@@ -1,13 +1,256 @@
-<template>
-  <div>
+<script setup lang="ts">
+import { ref, computed, reactive, onMounted, nextTick, onUnmounted } from 'vue';
+import { MdiAdd } from '@vben/icons';
 
+import { Page, useVbenModal } from '@vben/common-ui';
+import { dict, type FormScopeContext } from '@fast-crud/fast-crud';
+import { MdiUpload } from '@vben/icons';
+import { useRouter } from 'vue-router';
+import dayjs, { Dayjs } from 'dayjs';
+import Apis from '#/api';
+import {
+  message,
+  Modal,
+  type UploadChangeParam,
+  type UploadProps,
+} from 'ant-design-vue';
+import { useUserStore } from '@vben/stores';
+import { useRoute } from 'vue-router';
+import { getFormSchema,getFormSchema2 } from './curd.tsx';
+import { FileUploader } from '#/utils/file';
+import { DICT_TYPE, getDictObj, getDictOptions } from '#/utils/dict';
+import { useVxeTable } from '#/hooks/vxeTable';
+import { useRender } from '#/hooks/useRender';
+import type { VxeGridPropTypes } from 'vxe-table';
+
+const { xGridRef, gridProps, triggerProxy } = useVxeTable({ ref: 'xGridRef' });
+const userStore = useUserStore();
+
+const fileUploader = new FileUploader({});
+
+const router = useRouter();
+const route = useRoute();
+const id = ref(route.params.id);
+const pageRef = ref();
+
+const currData = ref({});
+
+const formRef = ref();
+const formRef2 = ref();
+
+let isLoading = ref(false);
+
+let contractTypeData = ref([]);
+
+let collapses = ['1', '2'];
+let collapseActiveKey = ref(collapses);
+
+const formBinding = ref({
+  col: { span: 24 },
+  initialForm: {
+    contractName: '',
+    frameProtocol: '0',
+    frameProtocolCtr: '0',
+    priceType: 'CNY',
+  },
+  labelCol: { style: { width: '120px' } },
+  columns: {},
+});
+
+const formBinding2 = ref({
+  col: { span: 24 },
+  initialForm: {
+    contractName: '',
+    frameProtocol: '0',
+    frameProtocolCtr: '0',
+    priceType: 'CNY',
+  },
+  labelCol: { style: { width: '120px' } },
+  columns: {},
+});
+
+function getColumns(params?): any {
+  let columns: VxeGridPropTypes.Columns = [
+    { type: 'seq', title: '序号', width: 60 },
+    { field: 'basisId', title: '依据号', width: 130 },
+    {
+      field: 'basisName',
+      title: '依据名称',
+      width: 200,
+    },
+    { field: 'basisNum', title: '依据编号', width: 180 },
+    {
+      field: 'basisTypeId',
+      title: '依据类型',
+      width: 100,
+      slots: {
+        default: ({ row }) => {
+          return getDictObj(DICT_TYPE.contract_basis_type, row.basisTypeId)
+            ?.label;
+        },
+      },
+    },
+    {
+      field: 'endDate',
+      title: '有效期',
+      width: 150,
+      slots: {
+        default: ({ row }) => {
+          return useRender.renderDate(row.endDate, 'YYYY-MM-DD');
+        },
+      },
+    },
+  ];
+
+  if (!id.value || (id.value && currData.value.step == 'edit')) {
+    columns.push({
+      title: '操作',
+      width: 120,
+      slots: { default: 'operate' },
+    });
+  }
+  return columns;
+}
+
+/** Hooks - 表格 */
+const gridOptions = reactive(
+  gridProps({
+    height: '200px',
+    columns: getColumns(),
+    data: [],
+    toolbarConfig: {
+      enabled: false,
+    },
+    pagerConfig: {
+      enabled: false,
+    },
+    rowConfig: {
+      useKey: true,
+      isCurrent: false,
+    },
+  }),
+);
+
+onMounted(async () => {
+  isLoading.value = true;
+  console.log(id.value);
+
+  try {
+    let contractReferTypeData = await Apis.contractReferType.get_list({
+      params: {},
+    });
+    contractTypeData.value = contractReferTypeData.rows || [];
+
+    if (id.value) {
+      let data: any = await Apis.contractBaseInfo.get_getOne({
+        params: { guid: id.value },
+      });
+      console.log(data);
+
+      currData.value = data;
+
+      formBinding.value.columns = getFormSchema({
+        contractTypeData: contractTypeData.value,
+        readOnly: !id.value || currData.value.step != 'edit',
+      });
+
+      formBinding2.value.columns = getFormSchema2({
+        contractTypeData: contractTypeData.value,
+        readOnly: !id.value || currData.value.step != 'edit',
+      });
+      xGridRef.value.reloadColumn(getColumns());
+
+      nextTick(() => {
+        formRef.value.setFormData(data);
+      });
+
+      // 如果有签约依据
+      if (data.basisId) {
+        let basisList = await Apis.lxBasisSale.get_page({
+          params: { basisId: data.basisId },
+        });
+        nextTick(() => {
+          xGridRef.value.insert(basisList.rows);
+        });
+      }
+
+      if (data.fileUuid) {
+        let files = await fileUploader.select(data.fileUuid);
+        console.log(files);
+        nextTick(() => {
+          formRef.value.setFormData({
+            fileList: files,
+          });
+        });
+      }
+
+      loadDataByContractTypeData();
+    } else {
+      formBinding.value.columns = getFormSchema({
+        contractTypeData: contractTypeData.value,
+        readOnly: false,
+      });
+      formBinding2.value.columns = getFormSchema2({
+        contractTypeData: contractTypeData.value,
+        readOnly: false,
+      });
+    }
+  } catch (error) {
+    console.log(error);
+
+    Modal.error({
+      title: '提示',
+      content: '当前合同信息不存在',
+      onOk() {
+        back();
+      },
+    });
+  } finally {
+    isLoading.value = false;
+  }
+});
+</script>
+
+<template>
+  <div class="flex h-full w-full flex-col">
+    <a-collapse v-model:activeKey="collapseActiveKey" :bordered="false">
+      <a-collapse-panel key="1" header="合同基本信息" class="w-full">
+        <fs-form ref="formRef" class="w-full" v-bind="formBinding">
+          <template #form_fileList="scope">
+            <a-upload
+              v-model:fileList="scope.form.fileList"
+              accept=".pdf,.ppt,.pptx"
+              :max-count="3"
+              name="file"
+            >
+            </a-upload>
+          </template>
+        </fs-form>
+      </a-collapse-panel>
+
+      <a-collapse-panel key="3" header="选商资料" class="w-full">
+        <fs-form ref="formRef2" class="w-full" v-bind="formBinding2">
+          <template #form_fileList="scope">
+            <a-upload
+              v-model:fileList="scope.form.fileList"
+              accept=".pdf,.ppt,.pptx"
+              :max-count="3"
+              name="file"
+            >
+            </a-upload>
+          </template>
+        </fs-form>
+      </a-collapse-panel>
+
+      <a-collapse-panel key="2" header="签约依据" class="w-full">
+        <template #extra> </template>
+
+        <VxeGrid ref="xGridRef" v-bind="gridOptions" class="">
+          <template #toolbar_buttons></template>
+        </VxeGrid>
+      </a-collapse-panel>
+    </a-collapse>
   </div>
 </template>
 
-<script lang="ts" setup>
-
-</script>
-
-<style>
-
-</style>
+<style scoped></style>