diff --git a/src/api/clue/index.ts b/src/api/clue/index.ts
index 9e64080..c928cfc 100644
--- a/src/api/clue/index.ts
+++ b/src/api/clue/index.ts
@@ -136,3 +136,5 @@ export const editCustomerInfo = (params: any) => defHttp.post({ url: '/dating-cl
 export const getDemandInfo = (params: any) => defHttp.get<any>({ url: '/dating-clue-service/user/get/dating-store-customer-demand/detail', params})
 
 export const editDemandInfo = (params: any) => defHttp.post({ url: '/dating-clue-service/user/edit/dating-store-customer-demand', params })
+
+export const getClueContractList = (params: any) => defHttp.get<any>({ url: '/dating-clue-service/user/list/contract/by-dating-clue', params})
\ No newline at end of file
diff --git a/src/views/components/Timeline.vue b/src/views/components/Timeline.vue
index e2927a1..1b3c75a 100644
--- a/src/views/components/Timeline.vue
+++ b/src/views/components/Timeline.vue
@@ -1,39 +1,39 @@
 <template>
   <ul class="ant-timeline" v-if="list && list.length" :style="{paddingTop: list.length == 1 ? '24px' : '10px'}" >
     <li class="ant-timeline-item" :style="{padding: list.length > 1 ? '0 0 10px' : '0px'}" v-if="list.length >= 1">
-    <div class="ant-timeline-item-tail" v-if="list.length > 1"></div>
-    <div class="ant-timeline-item-head ant-timeline-item-head-blue"><!----></div>
-    <div class="ant-timeline-item-content">
-      <div class="flex-row-center-start">
-        <span style="color: rgb(153, 153, 153);">{{list[0].createTime}}</span>
-        <span style="color: rgb(51, 51, 51);margin-left: 10px;">{{list[0].operatorName}}</span>
-        <span style="color: #333;" v-if="list[0].datingClueFollowStage">-{{followStageList.find((find) => find.value === list[0].datingClueFollowStage)?.label}}</span>
-        <span style="color: #faa19d;margin-left: 16px;" v-if="list[0].remark">{{list[0].remark}}</span>
+      <div class="ant-timeline-item-tail" v-if="list.length > 1"></div>
+      <div class="ant-timeline-item-head ant-timeline-item-head-blue"><!----></div>
+      <div class="ant-timeline-item-content">
+        <div class="flex-row-center-start">
+          <span style="color: rgb(153, 153, 153);">{{list[0].createTime}}</span>
+          <span style="color: rgb(51, 51, 51);margin-left: 10px;">{{list[0].operatorName}}</span>
+          <span style="color: #333;" v-if="list[0].datingClueFollowStage">-{{followStageList.find((find) => find.value === list[0].datingClueFollowStage)?.label}}</span>
+          <span style="color: #faa19d;margin-left: 16px;" v-if="list[0].remark">{{list[0].remark}}</span>
+        </div>
       </div>
-    </div>
     </li>
     <li class="ant-timeline-item" :style="{padding: list.length > 2 ? '0 0 10px' : '0px'}" v-if="list.length >= 2">
-    <div class="ant-timeline-item-tail" v-if="list.length > 2"></div>
-    <div class="ant-timeline-item-head ant-timeline-item-head-blue"><!----></div>
-    <div class="ant-timeline-item-content">
-      <div class="flex-row-center-start">
-        <span style="color: rgb(153, 153, 153);">{{list[1].createTime}}</span>
-        <span style="color: rgb(51, 51, 51);margin-left: 10px;">{{list[1].operatorName}}</span>
-        <span style="color: #333;" v-if="list[1].datingClueFollowStage">-{{followStageList.find((find) => find.value === list[1].datingClueFollowStage)?.label}}</span>
-        <span style="color: #faa19d;margin-left: 16px;" v-if="list[1].remark">{{list[1].remark}}</span>
+      <div class="ant-timeline-item-tail" v-if="list.length > 2"></div>
+      <div class="ant-timeline-item-head ant-timeline-item-head-blue"><!----></div>
+      <div class="ant-timeline-item-content">
+        <div class="flex-row-center-start">
+          <span style="color: rgb(153, 153, 153);">{{list[1].createTime}}</span>
+          <span style="color: rgb(51, 51, 51);margin-left: 10px;">{{list[1].operatorName}}</span>
+          <span style="color: #333;" v-if="list[1].datingClueFollowStage">-{{followStageList.find((find) => find.value === list[1].datingClueFollowStage)?.label}}</span>
+          <span style="color: #faa19d;margin-left: 16px;" v-if="list[1].remark">{{list[1].remark}}</span>
+        </div>
       </div>
-    </div>
     </li>
     <li class="ant-timeline-item" style="padding: 0px;" v-if="list.length >= 3">
-    <div class="ant-timeline-item-head ant-timeline-item-head-blue"><!----></div>
-    <div class="ant-timeline-item-content">
-      <div class="flex-row-center-start">
-        <span style="color: rgb(153, 153, 153);">{{list[2].createTime}}</span>
-        <span style="color: rgb(51, 51, 51);margin-left: 10px;">{{list[2].operatorName}}</span>
-        <span style="color: #333;" v-if="list[2].datingClueFollowStage">-{{followStageList.find((find) => find.value === list[2].datingClueFollowStage)?.label}}</span>
-        <span style="color: #faa19d;margin-left: 16px;" v-if="list[2].remark">{{list[2].remark}}</span>
+      <div class="ant-timeline-item-head ant-timeline-item-head-blue"><!----></div>
+      <div class="ant-timeline-item-content">
+        <div class="flex-row-center-start">
+          <span style="color: rgb(153, 153, 153);">{{list[2].createTime}}</span>
+          <span style="color: rgb(51, 51, 51);margin-left: 10px;">{{list[2].operatorName}}</span>
+          <span style="color: #333;" v-if="list[2].datingClueFollowStage">-{{followStageList.find((find) => find.value === list[2].datingClueFollowStage)?.label}}</span>
+          <span style="color: #faa19d;margin-left: 16px;" v-if="list[2].remark">{{list[2].remark}}</span>
+        </div>
       </div>
-    </div>
     </li>
   </ul>
   <div class="flex-row-center-center" style="padding: 8px;" v-else>
diff --git a/src/views/invite/inviteInfo/data.ts b/src/views/invite/inviteInfo/data.ts
index 0f32625..09c899d 100644
--- a/src/views/invite/inviteInfo/data.ts
+++ b/src/views/invite/inviteInfo/data.ts
@@ -440,4 +440,30 @@ export const tableColumns: BasicColumn[] = [
   //   },
   // },
   // { width: 160, title: '录入时间', dataIndex: 'creatTime' },
+]
+
+export const contactStatusList = [
+  { label: '未开始', value: 1 },
+  { label: '生效中', value: 2 },
+  { label: '已结束', value: 3 },
+  { label: '已废弃', value: 4 },
+]
+
+export const tableContractColumns: BasicColumn[] = [
+  { title: '甲方标识', dataIndex: 'firstPartyIdentityNo' },
+  { width: 110, title: '甲方经办人', dataIndex: 'firstPartyName' },
+  { title: '乙方标识', dataIndex: 'secondPartyIdentityNo' },
+  { title: '乙方经办人', dataIndex: 'secondPartyName' },
+  { width: 90, title: '签订日期', dataIndex: 'signDate' },
+  { width: 90, title: '开始日期', dataIndex: 'startDate' },
+  { width: 90, title: '结束日期', dataIndex: 'endDate' },
+  { width: 80, title: '合同状态', dataIndex: 'status',
+    customRender: ({ text }) => {
+      return contactStatusList.find((find) => find.value === text)?.label
+    },
+  },
+  { width: 80, title: '合同金额', dataIndex: 'amount' },
+  // { width: 160, title: '付款凭证', dataIndex: 'voucherImageList', slots: { customRender: 'voucherImageList' } },
+  { width: 160, title: '合同凭证', dataIndex: 'contractImageList', slots: { customRender: 'contractImageList' } },
+  { width: 120, title: '合同备注', dataIndex: 'remark' },
 ]
\ No newline at end of file
diff --git a/src/views/invite/inviteInfo/index.vue b/src/views/invite/inviteInfo/index.vue
index f2612e4..832d16b 100644
--- a/src/views/invite/inviteInfo/index.vue
+++ b/src/views/invite/inviteInfo/index.vue
@@ -155,21 +155,10 @@
           </TabPane>
           <TabPane key="2" tab="邀约进店">
             <div style="height: 100%;width: 100%;position: relative;">
-              <!-- <Button shape="circle" type="primary" ghost style="position: absolute;right: 24rpx;bottom: 24rpx;">
-                <template #icon><Icon icon="ant-design:plus-outlined" size="16px" style="color: #0960bd;"/></template>
-              </Button> -->
-              <!-- <Table bordered :pagination="false" :columns="tableColumns" :dataSource="appointmentList">
-                 
-              </Table> -->
               <BasicTable @register="registerTable">
                 <template #action="{ record }">
                   <TableAction
                     :actions="[
-                      {
-                        label: '取消',
-                        color: 'error',
-                        // onClick: handleCancel.bind(null, record['id']),
-                      },
                       {
                         label: '编辑',
                         onClick: handleAppointment.bind(null, record),
@@ -178,17 +167,26 @@
                         label: '结算',
                         color: 'error',
                         ifShow: record['status'] === 5,
-                        // onClick: handleSettle.bind(null, record['id']),
                       }
                     ]"
                   />
                 </template>
               </BasicTable>
-              <!-- <Result subTitle="暂无数据"></Result> -->
             </div>
           </TabPane>
           <TabPane key="3" tab="合同">
-            <Result subTitle="暂无数据"></Result>
+            <BasicTable @register="registerContractTable">
+              <template #contractImageList="{ text }">
+                <ImagePreviewGroup v-if="text && text.length">
+                  <Image
+                    v-for="(item, index) in text"
+                    style="width: 40px; height: 40px; border-radius: 5px; margin: 0 5px 5px 0"
+                    :key="index"
+                    :src="item.url"
+                  />
+                </ImagePreviewGroup>
+              </template>
+            </BasicTable>
           </TabPane>
           <TabPane key="4" tab="约见记录">
             <Result subTitle="暂无数据"></Result>
@@ -248,7 +246,7 @@
 <script setup lang="ts">
   import { useRoute } from 'vue-router'
   import { onMounted, ref, nextTick } from 'vue'
-  import { Tabs, Input, Popconfirm, Button, TabPane, Tag, Timeline, TimelineItem, Result, Spin, InputNumber, Table } from 'ant-design-vue'
+  import { Tabs, Input, Popconfirm, Button, TabPane, Tag, Timeline, TimelineItem, Result, Spin, InputNumber, Table, ImagePreviewGroup, Image } from 'ant-design-vue'
   import { Icon } from '/@/components/Icon'
   import { useMessage } from '/@/hooks/web/useMessage'
   import { CropperAvatar } from '/@/components/Cropper';
@@ -257,11 +255,11 @@
   import { BasicTable, useTable, TableAction } from '/@/components/Table'
   import { useForm } from '/@/components/Form'
   import { formatToDateTime } from '/@/utils/dateUtil'
-  import { basicSchema, modalFormSchema, tableColumns } from './data'
+  import { basicSchema, modalFormSchema, tableColumns, tableContractColumns } from './data'
   import { useModal } from '/@/components/Modal'
   import AppointmentModal from './modal.vue'
   import { demandMarriageMoreData, demandMarriageSchema } from '/@/views/clue/components/data'
-  import { getClueInfo, editClueRecord, recordClueing, getClueRecord, getAppointmentList } from '/@/api/clue'
+  import { getClueInfo, editClueRecord, recordClueing, getClueRecord, getAppointmentList, getClueContractList } from '/@/api/clue'
   import { genderList, channelList, clueStatusList, followTypeList, followStageList } from '/@/enums/customerEnum'
 
   const details = ref<any>()
@@ -308,6 +306,8 @@
   function onTabChange(){
     if(activeKey.value == '2'){
       reloadTable()
+    } else if(activeKey.value == '3'){
+      reloadContractTable()
     }
   }
 
@@ -315,6 +315,11 @@
     const dataSource= await getAppointmentList({datingClueId: details.value.id})
     setTableData(dataSource)
   }
+
+  async function reloadContractTable(){
+    const dataSource= await getClueContractList({datingClueId: details.value.id})
+    setContractData(dataSource)
+  }
   
   const activeKey = ref<string>('1')
   const activeKey2 = ref<string>('1')
@@ -458,6 +463,24 @@
     reloadTable()
     initFetch()
   }
+  const [registerContractTable, { setTableData: setContractData }] = useTable({
+    bordered: true,
+    immediate: false,
+    canResize: false,
+    pagination: false,
+    useSearchForm: false,
+    showIndexColumn: false,
+    showTableSetting: false,
+    columns: tableContractColumns,
+    // actionColumn: {
+    //   width: 120,
+    //   title: '操作',
+    //   fixed: 'right',
+    //   dataIndex: 'action',
+    //   slots: { customRender: 'action' },
+    // },
+  })
+
 </script>
 <style scoped lang="less">
 ::v-deep .ant-input-number {