fix: 线索接口联调逻辑修改

src/views/market-manage/external-manage/clue-management/clue-list/index.vue

@@ -19,151 +19,185 @@ import {onMounted, ref} from 'vue';
 import AddOrEditDrawer from '/@/views/table-demo/components/AddOrEditDrawer.vue';
 import {useRouter} from 'vue-router';
 import {pick} from "lodash";
+import {DISPLAY_STATE} from "/@/components/BsUi/constant.js";
 
 const addOrEditDrawerRef = ref(null);
 const router = useRouter();
 const {
-  tableOptions,
-  setTablePropsValue: setValue,
-  getTablePropsValue: getValue,
-} = useBsTable({
-  tableOptions: {
-    url: '/supports/clue/queryPage',
-    gridOptions: {
-      // data:[],
-      loading: false,
-      columns: [
-        {
-          field: 'projectName',
-          title: '项目名称',
-        },
-        {
-          field: 'projectId',
-          title: '项目ID',
-        },
-        {
-          field: 'projectAddress',
-          title: '项目地址',
-        },
-        {
-          field: 'projectStatus',
-          title: '项目状态',
-        },
-        {
-          field: 'lessor',
-          title: '甲方',
-        },
-        {
-          field: 'tenderDate',
-          title: '预计招标日期',
-        },
-        {
-          field: 'projectBudgets',
-          title: '概算金额(万)',
-        },
-        {
-          field: 'factory',
-          title: '分厂/几期/机组',
-        },
-        {
-          field: 'projectSource',
-          title: '项目来源',
-        },
-        {
-          field: 'projectType',
-          title: '项目类型',
-        },
-        {
-          field: 'engineeringAttribute',
-          title: '工程属性',
-        },
-        {
-          field: 'businessType',
-          title: '业务类型',
-        },
-        {
-          field: 'belongMarketer',
-          title: '归属营销经理',
-        },
-        {
-          field: 'belongMarketingDepartment',
-          title: '归属营销部门',
-        },
-        {
-          field: 'name',
-          title: '创建人',
-        },
-        {
-          field: 'name',
-          title: '创建时间',
-        },
-        {
-          field: 'opt',
-          title: '操作',
-          width: '120px',
-          fixed: 'right',
-          align: 'center',
-          slots: {
-            default({row, column}) {
-              return (
-                  <a-button
-                      type='text'
-                      size='small'
-                      onClick={() => {
-                        goDetailPage(row);
-                      }}
-                  >
-                    查看详情
-                  </a-button>
-              );
-            },
-          },
-        },
-      ],
-    },
-    searchConfig: {
-      enabled: true,
-      fieldSpan: 4,
-      fields: [
-        {
-          field:'projectName',
-          component: 'a-input',
-          componentProps: {
-            placeholder: '请输入项目名称',
-          },
-        },
-        {
-          field:'projectId',
-          component: 'a-input',
-          componentProps: {
-            placeholder: '请输入项目ID',
-          },
-        },
-        {
-          field: 'projectAddress',
-          component: 'a-select',
-          componentProps: {
-            placeholder: '请选择地址',
-          },
-        },
-        {
-          field: 'status',
-          component: 'a-select',
-          componentProps: {
-            placeholder: '请选择项目状态',
-          },
-        },
-      ],
-    },
-    pagerConfig: {
-      enabled: true,
-      pageSize: 10,
-      pageNum: 1,
-      total: 0,
-    },
-  },
-});
+      tableOptions,
+      setTablePropsValue: setValue,
+      getTablePropsValue: getValue,
+    } = useBsTable({
+      tableOptions: {
+        url: '/supports/clue/queryPage',
+        gridOptions: {
+          // data:[],
+          loading: false,
+          columns: [
+            {
+              field: 'projectName',
+              title: '项目名称',
+            },
+            {
+              field: 'projectId',
+              title: '项目ID',
+            },
+            {
+              field: 'projectAddress',
+              title: '项目地址',
+            },
+            {
+              field: 'projectStatus',
+              title: '项目状态',
+            },
+            {
+              field: 'lessor',
+              title: '甲方',
+            },
+            {
+              field: 'tenderDate',
+              title: '预计招标日期',
+            },
+            {
+              field: 'projectBudgets',
+              title: '概算金额(万)',
+            },
+            {
+              field: 'factory',
+              title: '分厂/几期/机组',
+            },
+            {
+              field: 'projectSource',
+              title: '项目来源',
+            },
+            {
+              field: 'projectType',
+              title: '项目类型',
+            },
+            {
+              field: 'engineeringAttribute',
+              title: '工程属性',
+            },
+            {
+              field: 'businessType',
+              title: '业务类型',
+            },
+            {
+              field: 'belongMarketer',
+              title: '归属营销经理',
+            },
+            {
+              field: 'belongMarketingDepartment',
+              title: '归属营销部门',
+            },
+            {
+              field: 'name',
+              title: '创建人',
+            },
+            {
+              field: 'name',
+              title: '创建时间',
+            },
+            {
+              field: 'opt',
+              title: '操作',
+              width: '120px',
+              fixed: 'right',
+              align: 'center',
+            },
+            {
+              // fixed: 'right',
+              cellRender: {
+                name: 'CellOption',
+                extraProps: {
+                  buttons: [
+                    {
+                      title: '查看详情',
+                      code: 'view',
+                      display: ({row}) => {
+                        return DISPLAY_STATE.VISIBLE;
+                      },
+                      disabled({row}) {
+                        return false;
+                      },
+                      onClick({row}) {
+                        goDetailPage(row)
+                      },
+                      extraProps: {},
+                    },
+                  ],
+                },
+              },
+            }
+            // slots: {
+            //   default({row, column}) {
+            //     return (
+            //         <a-button
+            //             type='text'
+            //             size='small'
+            //             onClick={() => {
+            //               goDetailPage(row);
+            //             }}
+            //         >
+            //           查看详情
+            //         </a-button>
+            //     );
+            //   },
+            // }
+          ],
+        },
+        searchConfig: {
+          enabled: true,
+          fieldSpan:
+              4,
+          fields:
+              [
+                {
+                  field: 'projectName',
+                  component: 'a-input',
+                  componentProps: {
+                    placeholder: '请输入项目名称',
+                  },
+                },
+                {
+                  field: 'projectId',
+                  component: 'a-input',
+                  componentProps: {
+                    placeholder: '请输入项目ID',
+                  },
+                },
+                {
+                  field: 'projectAddress',
+                  component: 'a-select',
+                  componentProps: {
+                    placeholder: '请选择地址',
+                  },
+                },
+                {
+                  field: 'status',
+                  component: 'a-select',
+                  componentProps: {
+                    placeholder: '请选择项目状态',
+                  },
+                },
+              ],
+        }
+        ,
+        pagerConfig: {
+          enabled: true,
+          pageSize:
+              10,
+          pageNum:
+              1,
+          total:
+              0,
+        }
+        ,
+      },
+    })
+;
 const goDetailPage = (record) => {
+  console.log(record.id)
   router.push({
     path: "/market-manage/external-manage/clue-management/view-details",
     query: {

src/views/market-manage/external-manage/clue-management/clue-registration/index.vue

@@ -309,24 +309,44 @@
             </div>
           </div>
           <div class="steps-content">
-            <a-button type="dashed" @click="addTeam" block>
+
+            <bs-table v-bind="tableOptions">
+            </bs-table>
+            <a-button type="dashed" @click="showModal" block>
               <plus-outlined/>
               添加成员
             </a-button>
-            <!--            <bs-table v-bind="tableOptions">-->
-            <!--            </bs-table>-->
-            <a-table
-                :columns="teamColumns"
-                :data-source="teamData"
-                :pagination="false"
-                bordered
+            <a-modal
+                v-model:visible="visible"
+                title="添加团队成员"
+                @ok="handleOk"
+                @cancel="handleCancel"
             >
-              <template #bodyCell="{ column, record }">
-                <template v-if="column.key === 'action'">
-                  <a-button type="link" danger @click="removeTeam(record.key)">删除</a-button>
-                </template>
-              </template>
-            </a-table>
+              <a-form layout="vertical">
+                <a-form-item label="营销经理">
+                  <a-input v-model:value="formStates.manager" />
+                </a-form-item>
+                <a-form-item label="营销团队">
+                  <a-input v-model:value="formStates.team" />
+                </a-form-item>
+                <a-form-item label="支持说明">
+                  <a-textarea v-model:value="formStates.description" />
+                </a-form-item>
+              </a-form>
+            </a-modal>
+            <!--            <bs-table></bs-table>-->
+            <!--            <a-table-->
+            <!--                :columns="teamColumns"-->
+            <!--                :data-source="teamData"-->
+            <!--                :pagination="false"-->
+            <!--                bordered-->
+            <!--            >-->
+            <!--              <template #bodyCell="{ column, record }">-->
+            <!--                <template v-if="column.key === 'action'">-->
+            <!--                  <a-button type="link" danger @click="removeTeam(record.key)">删除</a-button>-->
+            <!--                </template>-->
+            <!--              </template>-->
+            <!--            </a-table>-->
           </div>
         </div>
         <div>
@@ -365,6 +385,7 @@
 </template>
 <script setup lang="jsx">
 import {reactive, ref, computed} from 'vue';
+const visible = ref(false);
 import {
   PlusOutlined,
   InboxOutlined,
@@ -376,7 +397,11 @@ import BsTable, {useBsTable} from '/@/components/BsUi/Table/index.js';
 
 const stepFormRef = ref(null);
 const router = useRouter();
-
+const formStates = reactive({
+  manager: '',
+  team: '',
+  description: ''
+});
 // --------------------- 数据 ---------------------
 // 表单数据
 const formState = reactive({
@@ -401,7 +426,7 @@ const formState = reactive({
   projectBackground: '',
   projectStage: '',
   belongMarketer: '',
-  attachment:'',
+  attachment: '',
   projectAddress: '',
   clueSource: 'serviceProvider',
   isOwnerPartyA: undefined,
@@ -410,7 +435,7 @@ const formState = reactive({
   isBiddingAgentPartyA: undefined,
   serviceProvider: undefined,
   region: undefined,
-  teamDTOList:[]
+  teamDTOList: []
 
 });
 
@@ -427,22 +452,24 @@ const {
     // url:''
     gridOptions: {
       loading: false,
+      displayToolbar:'123',
+      data: [],
       columns: [
         {
-          field: 'id',
-          title: '项目名称',
+          field: 'key',
+          title: '序号',
         },
         {
-          field: 'name',
-          title: '项目ID',
+          field: 'manager',
+          title: '营销经理',
         },
         {
-          field: 'name1',
-          title: '项目地址',
+          field: 'team',
+          title: '营销团队',
         },
         {
-          field: 'name2',
-          title: '项目状态',
+          field: 'description',
+          title: '支持说明',
         },
         {
           field: 'opt',
@@ -457,7 +484,7 @@ const {
                       type='text'
                       size='small'
                       onClick={() => {
-                        goDetailPage(row);
+                        deleteRow(row.key);
                       }}
                   >
                     删除
@@ -468,61 +495,61 @@ const {
         },
       ],
     },
+    toolbarConfig: {
+      enable: false,
+    },
     pagerConfig: {
       enabled: true,
+      isFixed: false,
       pageSize: 10,
       pageNum: 1,
       total: 0,
     },
-    toolbarConfig: {
-      onRefresh() {
-        fetchTableData();
-      },
-    },
   },
 });
-const teamColumns = [
-  {
-    title: '序号',
-    dataIndex: 'key',
-    key: 'key',
-    width: 80,
-  },
-  {
-    title: '营销经理',
-    dataIndex: 'manager',
-    key: 'manager',
-  },
-  {
-    title: '营销团队',
-    dataIndex: 'team',
-    key: 'team',
-  },
-  {
-    title: '支持说明',
-    dataIndex: 'support',
-    key: 'support',
-  },
-  {
-    title: '操作',
-    key: 'action',
-    width: 100,
-  },
-];
-const teamData = ref([
-  {
-    key: '1',
-    manager: '张经理',
-    team: '一团队',
-    support: '',
-  },
-  {
-    key: '2',
-    manager: '王经理',
-    team: 'XX团队',
-    support: '',
-  },
-]);
+const showModal = () => {
+  formStates.manager = '';
+  formStates.team = '';
+  formStates.description = '';
+  visible.value = true;
+};
+
+// 确认添加
+const handleOk = () => {
+  const currentData = getValue('gridOptions.data') || [];
+
+  const newRow = {
+    key: Date.now().toString(), // 生成唯一key
+    manager: formStates.manager,
+    team: formStates.team,
+    description: formStates.description
+  };
+
+  setValue('gridOptions.data', [...currentData, newRow]);
+  console.log(setValue('gridOptions.data', [...currentData, newRow]))
+  resetForm();
+  visible.value = false;
+};
+
+// 取消
+const handleCancel = () => {
+  resetForm();
+  visible.value = false;
+};
+
+// 重置表单
+const resetForm = () => {
+  formState.manager = '';
+  formState.team = '';
+  formState.description = '';
+};
+
+// 删除行
+const deleteRow = (key) => {
+  const currentData = getValue('gridOptions.data') || [];
+  const newData = currentData.filter(item => item.key !== key);
+  setValue('gridOptions.data', newData);
+};
 const addTeam = () => {
   const newKey = String(teamData.value.length + 1);
   teamData.value.push({

src/views/market-manage/external-manage/clue-management/view-details/index.vue

@@ -1,6 +1,28 @@
 <template>
   <div class="page-detail">
-    <page-detail-layout :tabs="tabs" v-model:tab-active-key="tabActiveKey">
+    <page-detail-layout :tabs="tabs" v-model:tab-active-key="tabActiveKey" :index-config="indexConfig" :steps-data="stepsData"
+                        title="华东电力二期治理项目">
+      <template #titleRight>
+<!--        <img src="/@/assets/images/page-detail-layout/customer/SS_user.png" alt=""/>-->
+        <a-tag color="blue">转介绍</a-tag>
+      </template>
+
+      <template #toolBtn>
+
+        <a-button ghost type="primary" size="small">转移</a-button>
+        <a-button type="primary" size="small">预进场</a-button>
+        <a-button danger ghost type="primary" size="small">释放公海</a-button>
+        <a-button danger ghost type="primary" size="small">放弃跟踪</a-button>
+      </template>
+
+      <template #titleBottom>
+        <a-tag color="#f0f4fe" v-for="(tagItem, tagIndex) in tagList" :key="tagIndex">
+          <div class="tag-stl">
+            <img :src="tagItem.icon" alt=""/>
+            <span class="title-render">{{ tagItem.title }}</span>
+          </div>
+        </a-tag>
+      </template>
       <template #tab1>
         <bs-contents-wrapper>
           <!-- 客户信息（动态列数） -->
@@ -18,67 +40,8 @@
           </bs-descriptions>
 
           <!-- 管理信息（表格） -->
-          <bs-descriptions title="管理信息">
-            <bs-table v-bind="tableOptions"/>
-            <a-card :bordered="false" class="customer-info-card">
-              <!-- 第一行 - 铺满 -->
-              <a-row :gutter="16">
-                <a-col :span="24">
-                  <div class="info-line first-line">
-                    <span class="info-item">
-                      <span class="info-label">集团公司：</span>
-                      <span class="info-value">{{ customerData.returnTo }}</span>
-                    </span>
-                      <span class="info-item">
-                      <span class="info-label">客户等级：</span>
-                      <span class="info-value">{{ customerData.level }}</span>
-                    </span>
-                    <span class="info-item">
-                      <span class="info-label">客户行业：</span>
-                      <span class="info-value">{{ customerData.industry }}</span>
-                    </span>
-                    <span class="info-item">
-                      <span class="info-label">客户类型：</span>
-                      <span class="info-value">{{ customerData.type }}</span>
-                    </span>
-                  </div>
-                </a-col>
-              </a-row>
-
-              <!-- 第二行 - 占一半宽度 -->
-              <a-row :gutter="24" style="margin-top: 8px;">
-                <a-col :span="7">
-                  <div class="info-line">
-                    <span class="info-item">
-                      <span class="info-label">归属区域：</span>
-                      <span class="info-value">{{ customerData.region }}</span>
-                    </span>
-                  </div>
-                </a-col>
-                <a-col :span="6">
-                  <div class="info-line">
-                    <span class="info-item">
-                      <span class="info-label" style="margin-left: -26px">归属营销人员：</span>
-                      <span class="info-value">{{ customerData.salesPerson }}</span>
-                    </span>
-                  </div>
-                </a-col>
-              </a-row>
-            </a-card>
-          </bs-descriptions>
-
-          <!-- 其他信息（默认每行 2 项） -->
-          <bs-descriptions
-              :items="otherForms"
-              title="其他信息"
-              :extraProps="{ column: 2 }"
-          >
-            <template #name1_label_slot>
-              <span style="color: #1890ff">Label插槽</span>
-            </template>
-            <template #name1_value_slot>
-              <span style="font-weight: bold">Value插槽</span>
-            </template>
+          <bs-descriptions title="协作团队">
+            <bs-table v-bind="tableOptions" v-if="tableList&&tableList.length>0"/>
           </bs-descriptions>
         </bs-contents-wrapper>
       </template>
@@ -90,58 +53,169 @@
 </template>
 
 <script setup>
-import {ref} from 'vue';
+import {reactive, ref, watch} from 'vue';
 import PageDetailLayout from '/@/components/business/page-detail-layout/index.vue';
 import {BsDescriptions, BsContentsWrapper} from '/@/components/BsUi/index.js';
 import selectedIcon from '/@/assets/images/page-detail-layout/selectedIcon.png';
 import unSelectedIcon from '/@/assets/images/page-detail-layout/unSelectedIcon.png';
 import BsTable, {useBsTable} from '/@/components/BsUi/Table/index.js';
-import { clientManageApi } from '/@/api/market-manage/clue-management/index.js';
-import {onMounted} from 'vue';
+import {clientManageApi} from '/@/api/market-manage/clue-management/index.js';
+import {onMounted,} from 'vue';
 import {useRoute} from 'vue-router';
 
 const route = useRoute();
 const tabActiveKey = ref('tab1');
-const bsDescriptionItemss = ref([]);
-onMounted(() => {
-  // 从query中获取传递的数据
-  const id = route.query.id;
-  clientManageApi.getQueryList(id).then((res)=>{
+const bsDescriptionItems = ref([]);
+const tableList = ref([]);
+const fetchData = (id) => {
+  if (!id) return;
+  clientManageApi.getQueryList(id).then((res) => {
+    tableList.value = res.data.teamDTOList;
+    setValue('gridOptions.data', res.data.teamDTOList)
     const customerData = res.data;
-    bsDescriptionItemss.value = [
-      { label: '客户地区', value: customerData.countryRegion || '--' },
-      { label: '客户来源', value: customerData.projectSource || '--' },
-      { label: '服务商名称', value: customerData.providerName || '--' },
-      { label: '客户名称', value: '--' },
-      { label: '属性', value: customerData.engineeringAttribute || '--' },
-      { label: '统一社会代码', value: '--' },
-      { label: '法定代表人', value: '--' },
-      { label: '存续状态', value: '--' },
-      {
-        label: '注册地址',
-        value: customerData.address || '--',
-        span: 4 // 跨越多列
-      },
-      { label: '注册时间', value: customerData.registerDate || '--' },
-      { label: '注册资本', value: customerData.registerCapital || '--' },
-      { label: '官网地址', value: customerData.website || '--' },
-      {
-        label: '经营范围',
-        value: customerData.businessScope || '--',
-        tooltip: customerData.businessScope // 鼠标悬停显示完整内容
-      },
-      {
-        label: '企业简介',
-        value: customerData.introduction ? truncateText(customerData.introduction, 50) : '--',
-        tooltip: customerData.introduction // 鼠标悬停显示完整内容
-      },
-      { label: '初始对接人', value: customerData.initialContact || '--' },
-      { label: '功能对接人电话', value: customerData.contactPhone || '--' },
-      { label: '办公地址', value: customerData.officeAddress || '--' }
+    bsDescriptionItems.value = [
+      {label: '项目类型', value: customerData.projectType || '--'},
+      {label: '线索名称', value: customerData.clueName || '--'},
+      {label: '线索来源', value: customerData.clueSource || '--'},
+      {label: '服务商名称', value: customerData.providerName || '--'},
+      {label: '项目名称', value: customerData.projectName || '--'},
+      {label: '工程属性', value: customerData.engineeringAttribute || '--'},
+      {label: '地区', value: customerData.district || '--'},
+      {label: '省市区', value: customerData.provinceName || '--'},
+      {label: '项目地址', value: customerData.address || '--',},
+      {label: '业主单位', value: ''},
+      {label: '设计单位', value: customerData.designUnitId || '--'},
+      {label: '总承包单位', value: customerData.contractorUnitId || '--'},
+      {label: '招标代理单位', value: customerData.tenderUnitId || '--',},
+      {label: '联合体', value: customerData.coalitionUnitState || '--',},
+      {label: '联合体情况说明', value: customerData.coalitionDescription || '--'},
+      {label: '项目所属行业', value: customerData.belongIndustry || '--'},
+      {label: '业务类型', value: customerData.businessType || '--'},
+      {label: '招标平台', value: customerData.tenderPlatform || '--'},
+      {label: '项目总概算', value: customerData.budgetAmount || '--'},
+      {label: '项目资金来源', value: customerData.financeSource || '--'},
+      {label: '分厂/几期/机组', value: customerData.shortDescription || '--'},
     ];
   })
+}
+const getImgUrl = (name) => {
+  return new URL('/src/assets/images/page-detail-layout/customer/' + name + '.svg', import.meta.url).href;
+};
+const tagList = [
+  {
+    title: 'XM202501120001',
+    icon: getImgUrl('icon-tianyancha'),
+  },
+  {
+    title: '华东电力集团',
+    icon: getImgUrl('icon-xiansuodengji'),
+  },
+  {
+    title: '山东省济南市历下区经开10路123号',
+    icon: getImgUrl('icon-biaoqianguanli'),
+  },
+  {
+    title: '曾用名',
+    icon: getImgUrl('icon-cengyongming'),
+  },
+];
+const stepsData = [
+  {
+    title: '标段备案',
+    time: '2024-09-18',
+    status: 'completed',
+    number: 1,
+    lineTopNum: 100,
+  },
+  {
+    title: '商机管理',
+    time: '2024-09-20',
+    status: 'completed',
+    number: 2,
+    lineTopNum: 100,
+  },
+  {
+    title: '项目立项',
+    time: '2024-10-11',
+    status: 'completed',
+    number: 3,
+    lineTopNum: 100,
+  },
+  {
+    title: '投标评审',
+    status: 'current',
+    number: 4,
+    lineTopNum: 0,
+  },
+  {
+    title: '投标管理',
+    status: 'todo',
+    number: 5,
+    lineTopNum: 0,
+  },
+  {
+    title: '中标捷报',
+    status: 'todo',
+    number: 6,
+    lineTopNum: 0,
+  },
+  {
+    title: '合同签订',
+    status: 'todo',
+    number: 7,
+    lineTopNum: 0,
+  },
+];
+const indexConfig = reactive({
+  sourceData: [
+    {
+      label: '预计合同金额',
+      value: '333,333,333(元)',
+    },
+    {
+      label: '招标方式',
+      value: '公开',
+    },
+    {
+      label: '预计开工日期',
+      value: '2025.09.12',
+    },
+    {
+      label: '预计完工日期',
+      value: '2025.09.15',
+    },
 
+    {
+      label: '联系人',
+      value: '李阳',
+    },
+    {
+      label: '联系电话',
+      value: '17753246827',
+    },
+    {
+      label: '营销归属人',
+      value: '李阳',
+    },
+    {
+      label: '商务支持人',
+      value: '李阳',
+    },
+  ],
+  labelKey: 'label',
+  valueKey: 'value',
 });
+onMounted(() => {
+  fetchData(route.query.id);
+});
+watch(
+    () => route.query.id,
+    (newId, oldId) => {
+      if (newId && newId !== oldId) {
+        fetchData(newId);
+      }
+    }
+);
 const customerData = ref({
   returnTo: "政府机构",
   level: "A级",
@@ -155,22 +229,86 @@ const tabs = ref([
     title: '基本信息',
     key: 'tab1',
     slotName: 'tab1',
-    selectedIcon: selectedIcon,
-    unSelectedIcon: unSelectedIcon,
+    selectedIcon: getImgUrl('icon-jibenxinxi-all'),
+    unSelectedIcon: getImgUrl('icon-jibenxinxi'),
   },
   {
     title: '跟进情况',
+    key: 'FollowUp',
+    slotName: 'FollowUp',
+    selectedIcon: getImgUrl('icon-genjinqingkuang-all'),
+    unSelectedIcon: getImgUrl('icon-genjinqingkuang'),
+  },
+  {
+    title: '任务看板',
     key: 'tab2',
     slotName: 'tab2',
-    selectedIcon: selectedIcon,
-    unSelectedIcon: unSelectedIcon,
+    selectedIcon: getImgUrl('icon-guanliangongsi-all'),
+    unSelectedIcon: getImgUrl('icon-guanliangongsi'),
   },
   {
-    title: '关联公司',
+    title: '服务成员',
     key: 'tab3',
     slotName: 'tab3',
-    selectedIcon: selectedIcon,
-    unSelectedIcon: unSelectedIcon,
+    selectedIcon: getImgUrl('icon-yingxiaotuandui-all'),
+    unSelectedIcon: getImgUrl('icon-yingxiaotuandui'),
+  },
+
+  {
+    title: '项目决策链',
+    key: 'CooperativeProject',
+    slotName: 'CooperativeProject',
+    selectedIcon: getImgUrl('icon-hezuoxiangmu-all'),
+    unSelectedIcon: getImgUrl('icon-hezuoxiangmu'),
+  },
+  {
+    title: '竞争管理',
+    key: 'CustomerDecisionChain',
+    slotName: 'CustomerDecisionChain',
+    selectedIcon: getImgUrl('icon-kehujuecelian-all'),
+    unSelectedIcon: getImgUrl('icon-kehujuecelian'),
+  },
+  {
+    title: '绩效管理',
+    key: 'ContractManagement',
+    slotName: 'ContractManagement',
+    selectedIcon: getImgUrl('icon-hetongguanli-all'),
+    unSelectedIcon: getImgUrl('icon-hetongguanli'),
+  },
+  {
+    title: '报价管理',
+    key: 'InvestmentCompetitionManagement',
+    slotName: 'InvestmentCompetitionManagement',
+    selectedIcon: getImgUrl('icon-touzijingzheng-all'),
+    unSelectedIcon: getImgUrl('icon-touzijingzheng'),
+  },
+  {
+    title: '投标管理',
+    key: 'CustomerReview',
+    slotName: 'CustomerReview',
+    selectedIcon: getImgUrl('icon-kehupingjia-all'),
+    unSelectedIcon: getImgUrl('icon-kehupingjia'),
+  },
+  {
+    title: '资料管理',
+    key: 'InfoMaterial',
+    slotName: 'InfoMaterial',
+    selectedIcon: getImgUrl('icon-xinxiziliao-all'),
+    unSelectedIcon: getImgUrl('icon-xinxiziliao'),
+  },
+  {
+    title: '风险管理',
+    key: 'InfoMaterial',
+    slotName: 'InfoMaterial',
+    selectedIcon: getImgUrl('icon-xinxiziliao-all'),
+    unSelectedIcon: getImgUrl('icon-xinxiziliao'),
+  },
+  {
+    title: '编辑记录',
+    key: 'EditReport',
+    slotName: 'EditReport',
+    selectedIcon: getImgUrl('icon-bianjijilu-all'),
+    unSelectedIcon: getImgUrl('icon-bianjijilu'),
   },
 ]);
 const {
@@ -184,27 +322,22 @@ const {
       data: [],
       columns: [
         {
-          field: 'id',
-          title: '上级单位名称',
-        },
-        {
-          field: 'name',
-          title: '法定代表人',
+          field: 'marketingManager',
+          title: '营销经理',
         },
         {
-          field: 'name1',
-          title: '股份占比',
+          field: 'marketingTeam',
+          title: '营销团队',
         },
         {
-          field: 'name2',
-          title: '省市区地址',
-        },
-        {
-          field: 'name',
-          title: '企业权责说明',
+          field: 'supportDescription',
+          title: '支持说明',
         },
       ],
     },
+    toolbarConfig: {
+      enable: false,
+    },
     pagerConfig: {
       enabled: true,
       isFixed: false,
@@ -214,87 +347,20 @@ const {
     },
   },
 });
-const bsDescriptionItems = ref([
-  {label: '客户地区', value: '国内客户'},
-  {label: '客户来源', value: '服务商提供'},
-  {label: '服务商名称', value: '服务名称—显示位置占位'},
-  {label: '客户名称', value: '江西大明环境治理有限公司'},
-  {label: '属性', value: '有限责任公司'},
-  {label: '统一社会代码', value: '9137020071801334564'},
-  {label: '法定代表人', value: '王鹏程'},
-  {label: '存续状态', value: '正常'},
-  {label: '注册地址', value: '江西省南昌经济技术开发区下乡（江西省公路管理局物流配送站内）', span: 4},
-  {label: '注册时间', value: '2006-09-16'},
-  {label: '注册资本', value: '1000万'},
-  {label: '官网地址', value: 'http://www.baidu.com'},
-  {label: '经营范围', value: '经营范围信息展示位置在这里,文字信息两列的话就要缩略显示,鼠标指入显示全部'},
-  {
-    label: '企业简介',
-    value: '望山山庄旅游度假集团,是国务院国有资产监督管理委员会直接管理的大型中央企业,总部设在深圳,已形成以文化、旅游、房地产、电子科技为主业的发展格局'
-  },
-  {label: '初始对接人', value: '同平'},
-  {label: '功能对接人电话', value: '15012341234'},
-  {label: '办公地址', value: '江西省南昌经济技术开发区下罗'},
-]);
-const otherForms = ref([
-  {label: '中国裁判文书网查询', value: 'http://wenshu.court.gov.cn/'},
-  {label: '最高院失信被执行人(黑名单)查询', value: 'http://wenshu.court.gov.cn/zhzxgk/'},
-  {label: '国家工商信息查询', value: 'https://www.gsxt.gov.cn/index.html'},
-  {label: '其他附件', value: '关于上传的文书文件名称信息展示位置'},
-  {label: '备注信息', value: '非必填项，有就显示，没有不显示该条'},
-]);
 </script>
 
 <style lang="scss" scoped>
 .page-detail {
   width: 100%;
 
-  .customer-info-card {
-    border-radius: 4px;
-    padding: 12px 16px;
-  }
-
-  .info-line {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-  }
-
-  .first-line {
-    justify-content: space-between;
-  }
-
-  .info-item {
+  .tag-stl {
     display: flex;
+    gap: 5px;
     align-items: center;
-    margin-right: 16px;
-    white-space: nowrap;
-  }
-
-  .info-label {
-    color: #666;
-    margin-right: 4px;
-  }
-
-  .info-value {
-    color: #333;
-    font-weight: 500;
-  }
-
-  /* 响应式调整 */
-  @media (max-width: 500px) {
-    .first-line {
-      flex-direction: column;
-      align-items: flex-start;
-    }
-
-    .info-item {
-      margin-bottom: 8px;
-      margin-right: 0;
-    }
 
-    :deep(.ant-col) {
-      width: 100% !important;
+    .title-render {
+      color: #999999;
+      font-size: 14px;
     }
   }
 }