标段解析

src/components/TableModel2/index.vue

@@ -3,18 +3,50 @@
     <div>
         <!-- 表单搜索 -->
         <el-card v-show="showSearch" class="search-card">
-            <el-form :inline="true" ref="queryFormRef" :rules="formRules" :model="queryParams" label-width="auto">
+            <el-form
-                <el-form-item :key="v" :prop="item.f_model" v-for="(item, v) in formLabel"
+                :inline="true"
-                    :label="item.isShow ? item.f_label : ''">
+                ref="queryFormRef"
-                    <el-input clearable :maxlength="item.f_max || 50" v-if="item.f_type === 'ipt'"
+                :rules="formRules"
-                        v-model.trim="queryParams[item.f_model]" :placeholder="`请输入${item.f_label}`"
+                :model="queryParams"
-                        :style="{ width: item.f_width || '180px' }" />
+                label-width="auto"
-                    <el-select clearable filterable v-if="item.f_type === 'sel'" v-model="queryParams[item.f_model]"
+            >
-                        :placeholder="`请选择${item.f_label}`" :style="{ width: item.f_width || '180px' }">
+                <el-form-item
-                        <el-option :key="v" :label="sel.label" :value="sel.value" v-for="(sel, v) in item.f_selList" />
+                    :key="v"
+                    :prop="item.f_model"
+                    v-for="(item, v) in formLabel"
+                    :label="item.isShow ? item.f_label : ''"
+                >
+                    <el-input
+                        clearable
+                        :maxlength="item.f_max || 50"
+                        v-if="item.f_type === 'ipt'"
+                        v-model.trim="queryParams[item.f_model]"
+                        :placeholder="`请输入${item.f_label}`"
+                        :style="{ width: item.f_width || '180px' }"
+                    />
+                    <el-select
+                        clearable
+                        filterable
+                        v-if="item.f_type === 'sel'"
+                        v-model="queryParams[item.f_model]"
+                        :placeholder="`请选择${item.f_label}`"
+                        :style="{ width: item.f_width || '180px' }"
+                    >
+                        <el-option
+                            :key="v"
+                            :label="sel.label"
+                            :value="sel.value"
+                            v-for="(sel, v) in item.f_selList"
+                        />
                     </el-select>
-                    <el-cascader clearable style="width: 180px" :show-all-levels="false" :props="item.optionProps"
+                    <el-cascader
-                        :options="item.f_selList" v-if="item.f_type === 'selCasAdd'" v-model="queryParams[item.f_model]"
+                        clearable
+                        style="width: 180px"
+                        :show-all-levels="false"
+                        :props="item.optionProps"
+                        :options="item.f_selList"
+                        v-if="item.f_type === 'selCasAdd'"
+                        v-model="queryParams[item.f_model]"
                         @change="
                             handleCasAdd(
                                 $event,
@@ -22,27 +54,59 @@
                                 cascadeFunc,
                                 extraTableProp,
                             )
-                            " />
+                        "
-                    <el-cascader style="width: 180px" :show-all-levels="false" :options="item.f_selList"
+                    />
-                        :props="item.optionProps" v-if="item.f_type === 'selCas'" v-model="queryParams[item.f_model]"
+                    <el-cascader
-                        @change="handleCas($event, item.f_model)" />
+                        style="width: 180px"
-                    <el-date-picker type="date" style="width: 240px" value-format="yyyy-MM-dd"
+                        :show-all-levels="false"
-                        v-if="item.f_type === 'date'" v-model="queryParams[item.f_model]"
+                        :options="item.f_selList"
-                        :placeholder="`请选择${item.f_label}`" />
+                        :props="item.optionProps"
-                    <el-date-picker type="daterange" style="width: 240px" range-separator="至" value-format="yyyy-MM-dd"
+                        v-if="item.f_type === 'selCas'"
-                        start-placeholder="开始日期" end-placeholder="结束日期" v-if="item.f_type === 'dateRange'"
+                        v-model="queryParams[item.f_model]"
-                        v-model="queryParams[item.f_model]" @change="onChangeTime($event, item.dateType)"
+                        @change="handleCas($event, item.f_model)"
-                        :picker-options="pickerOptions" />
+                    />
-                    <el-input-number :min="0" style="width: 240px" v-if="item.f_type === 'num'"
+                    <el-date-picker
-                        v-model="queryParams[item.f_model]" />
+                        type="date"
+                        style="width: 240px"
+                        value-format="yyyy-MM-dd"
+                        v-if="item.f_type === 'date'"
+                        v-model="queryParams[item.f_model]"
+                        :placeholder="`请选择${item.f_label}`"
+                    />
+                    <el-date-picker
+                        type="daterange"
+                        style="width: 240px"
+                        range-separator="至"
+                        value-format="yyyy-MM-dd"
+                        start-placeholder="开始日期"
+                        end-placeholder="结束日期"
+                        v-if="item.f_type === 'dateRange'"
+                        v-model="queryParams[item.f_model]"
+                        @change="onChangeTime($event, item.dateType)"
+                        :picker-options="pickerOptions"
+                    />
+                    <el-input-number
+                        :min="0"
+                        style="width: 240px"
+                        v-if="item.f_type === 'num'"
+                        v-model="queryParams[item.f_model]"
+                    />
                 </el-form-item>
                 <!-- 自定义搜索插槽：父组件可自行插入 el-form-item -->
                 <slot name="form" :queryParams="queryParams"></slot>
                 <el-form-item v-if="showBtnCrews">
-                    <el-button v-if="showQueryButtons" class="query-btn" @click="handleQuery">
+                    <el-button
+                        v-if="showQueryButtons"
+                        class="query-btn"
+                        @click="handleQuery"
+                    >
                         查询
                     </el-button>
-                    <el-button v-if="showQueryButtons" class="reset-btn" @click="resetQuery">
+                    <el-button
+                        v-if="showQueryButtons"
+                        class="reset-btn"
+                        @click="resetQuery"
+                    >
                         重置
                     </el-button>
 
@@ -52,15 +116,26 @@
         </el-card>
         <!-- 按钮集群 -->
         <el-row class="btn-container">
-            <ToolbarModel v-if="showRightTools" :columns="columnCheckList" @queryTable="getTableList"
+            <ToolbarModel
-                :showSearch.sync="showSearch" :handleShow.sync="handleShow" :indexNumShow.sync="indexNumShow"
+                v-if="showRightTools"
-                :selectionShow.sync="selectionShow" :isSelectShow="isSelectShow" :showOperation="showOperation" />
+                :columns="columnCheckList"
+                @queryTable="getTableList"
+                :showSearch.sync="showSearch"
+                :handleShow.sync="handleShow"
+                :indexNumShow.sync="indexNumShow"
+                :selectionShow.sync="selectionShow"
+                :isSelectShow="isSelectShow"
+                :showOperation="showOperation"
+            />
         </el-row>
 
         <!-- 表格 -->
         <el-card class="table-card" :style="tableCardStyle">
             <!-- 表格头部插槽 -->
-            <div class="table-header" v-if="$slots.tableTitle || $slots.tableActions">
+            <div
+                class="table-header"
+                v-if="$slots.tableTitle || $slots.tableActions"
+            >
                 <div class="table-title">
                     <slot name="tableTitle"></slot>
                 </div>
@@ -71,29 +146,83 @@
 
             <!-- 表格容器，添加最大高度和滚动 -->
             <div class="table-container" :style="tableContainerStyle">
-                <el-table ref="tableRef" :data="tableList" style="width: 100%" v-loading="loading" select-on-indeterminate
+                <el-table
-                    @selection-change="handleSelectionChange">
+                    ref="tableRef"
-                    <el-table-column width="45" align="center" type="selection" :selectable="selectable"
+                    :data="tableList"
-                        v-if="selectionShow && isSelectShow" />
+                    style="width: 100%"
-                    <el-table-column fixed width="55" label="序号" type="index" align="center" :index="(index) =>
+                    v-loading="loading"
-                            (queryParams.pageNum - 1) * queryParams.pageSize +
+                    select-on-indeterminate
+                    @selection-change="handleSelectionChange"
+                    @current-change="handleCurrentChange"
+                    highlight-current-row
+                >
+                    <el-table-column
+                        width="45"
+                        align="center"
+                        type="selection"
+                        :selectable="selectable"
+                        v-if="selectionShow && isSelectShow"
+                    />
+                    <el-table-column
+                        width="45"
+                        align="center"
+                        label=""
+                        v-if="isRadioShow"
+                    >
+                        <template slot-scope="scope">
+                            <el-radio
+                                :label="getRowUniqueId(scope.row)"
+                                v-model="currentRowId"
+                            >
+                                <span></span>
+                            </el-radio>
+                        </template>
+                    </el-table-column>
+                    <el-table-column
+                        fixed
+                        width="55"
+                        label="序号"
+                        type="index"
+                        align="center"
+                        :index="
+                            (index) =>
+                                (queryParams.pageNum - 1) *
+                                    queryParams.pageSize +
                                 index +
                                 1
-                        " v-if="indexNumShow" />
+                        "
-                    <el-table-column :key="v" align="center" :label="item.t_label" :prop="item.t_props"
+                        v-if="indexNumShow"
-                        :width="item.t_width" show-overflow-tooltip v-for="(item, v) in tableColumCheckProps">
+                    />
+                    <el-table-column
+                        :key="v"
+                        align="center"
+                        :label="item.t_label"
+                        :prop="item.t_props"
+                        :width="item.t_width"
+                        show-overflow-tooltip
+                        v-for="(item, v) in tableColumCheckProps"
+                    >
                         <template slot-scope="scope">
                             <!-- 判断当前列数据是否需要使用插槽的数据 -->
                             <template v-if="item.t_slot">
-                                <slot :data="scope.row" :name="item.t_slot"></slot>
+                                <slot
+                                    :data="scope.row"
+                                    :name="item.t_slot"
+                                ></slot>
                             </template>
                             <template v-else>
                                 {{ scope.row[item.t_props] || '-' }}
                             </template>
                         </template>
                     </el-table-column>
-                    <el-table-column align="center" label="操作" :width="handleColWidth" :show-overflow-tooltip="false"
+                    <el-table-column
-                        fixed="right" v-if="handleShow && showOperation">
+                        align="center"
+                        label="操作"
+                        :width="handleColWidth"
+                        :show-overflow-tooltip="false"
+                        fixed="right"
+                        v-if="handleShow && showOperation"
+                    >
                         <template slot-scope="{ row }">
                             <div class="optionDivRef">
                                 <slot :data="row" name="handle">-</slot>
@@ -104,8 +233,12 @@
             </div>
 
             <!-- 分页 -->
-            <pagination :total="total" @pagination="getTableList" :page.sync="queryParams.pageNum"
+            <pagination
-                :limit.sync="queryParams.pageSize" />
+                :total="total"
+                @pagination="getTableList"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+            />
         </el-card>
     </div>
 </template>
@@ -123,7 +256,7 @@ export default {
         // 列表请求接口
         requestApi: {
             type: Function,
-            default: () => function () { },
+            default: () => function () {},
         },
         // 列表配置项
         columnsList: {
@@ -178,6 +311,11 @@ export default {
             type: Boolean,
             default: false,
         },
+        // 是否显示单选框 由父组件传递 默认不显示
+        isRadioShow: {
+            type: Boolean,
+            default: false,
+        },
         // 测试时使用的数据源
         testTableList: {
             type: Array,
@@ -196,20 +334,24 @@ export default {
         // 表格最大高度（像素），默认600px
         tableMaxHeight: {
             type: [Number, String],
-            default: 600
+            default: 600,
         },
         // 是否自动加载数据 默认自动加载
         autoLoad: {
             type: Boolean,
-            default: true
+            default: true,
         },
         handleColWidth: {
             type: Number,
-            default: 200
+            default: 200,
         },
         showSearch: {
             type: Boolean,
-            default: true
+            default: true,
+        },
+        indexNumShow: {
+            type: Boolean,
+            default: true,
         },
     },
     computed: {
@@ -221,14 +363,16 @@ export default {
         },
         /* 表格卡片动态高度 */
         tableCardStyle() {
-            const baseHeight = this.showSearch ? 200 : 120; // 搜索区域高度
+            const baseHeight = this.showSearch ? 200 : 120 // 搜索区域高度
-            const toolbarHeight = this.showRightTools ? 40 : 0; // 工具栏高度
+            const toolbarHeight = this.showRightTools ? 40 : 0 // 工具栏高度
-            const paginationHeight = 60; // 分页区域高度
+            const paginationHeight = 60 // 分页区域高度
-            const availableHeight = `calc(100vh - ${baseHeight + toolbarHeight + paginationHeight + 25}px)`;
+            const availableHeight = `calc(100vh - ${
+                baseHeight + toolbarHeight + paginationHeight + 25
+            }px)`
             return {
                 height: availableHeight,
                 display: 'flex',
-                flexDirection: 'column'
+                flexDirection: 'column',
             }
         },
         /* 表格容器样式 */
@@ -237,7 +381,7 @@ export default {
                 flex: 1,
                 overflow: 'hidden',
                 display: 'flex',
-                flexDirection: 'column'
+                flexDirection: 'column',
             }
         },
     },
@@ -276,7 +420,7 @@ export default {
             // 是否显示复选框
             selectionShow: true,
             // 是否显示序号
-            indexNumShow: true,
+            
             // 是否显示操作列
             handleShow: true,
             // 列表每列 label
@@ -290,6 +434,10 @@ export default {
 
             // 日期选择器配置
             pickerOptions: {},
+            // 单选框当前选中的行唯一标识
+            currentRowId: null,
+            // 单选框当前选中的行数据
+            currentRowData: null,
         }
     },
 
@@ -361,7 +509,11 @@ export default {
                 delete queryParams.time // 剔除无关参数
                 // 删除日期范围选择器绑定的临时数组字段（如 openTime），保留实际使用的两个字段（如 openStartTime, openEndTime）
                 this.formLabel.forEach((item) => {
-                    if (item.f_type === 'dateRange' && item.dateType && item.dateType.length === 2) {
+                    if (
+                        item.f_type === 'dateRange' &&
+                        item.dateType &&
+                        item.dateType.length === 2
+                    ) {
                         delete queryParams[item.f_model]
                     }
                 })
@@ -376,6 +528,17 @@ export default {
                 if (res.code === 200) {
                     this.tableList = res.rows
                     this.total = res.total
+                    // 数据刷新后，如果之前选中的行不在当前列表中，清空选中状态
+                    if (this.isRadioShow && this.currentRowId) {
+                        const exists = this.tableList.some(
+                            (row) =>
+                                this.getRowUniqueId(row) === this.currentRowId,
+                        )
+                        if (!exists) {
+                            this.currentRowId = null
+                            this.currentRowData = null
+                        }
+                    }
                 }
                 this.loading = false
             } catch (error) {
@@ -440,7 +603,7 @@ export default {
                         this.$set(setObj, 'unitName', res.data.unitName)
                         this.$set(setObj, 'typeName', res.data.name)
                     })
-                    .catch((err) => { })
+                    .catch((err) => {})
                 for (let key in this.queryParams) {
                     this.$set(setObj, key, this.queryParams[key])
                 }
@@ -484,6 +647,19 @@ export default {
             this.selectedData = e
         },
 
+        // 获取行的唯一标识（优先使用id，否则使用索引）
+        getRowUniqueId(row) {
+            return row.id || row.proId || row.bidId || JSON.stringify(row)
+        },
+
+
+        // 处理表格当前行变化（用于高亮）
+        handleCurrentChange(currentRow) {
+            if (this.isRadioShow && currentRow) {
+                this.currentRowId = this.getRowUniqueId(currentRow)
+            }
+        },
+
         /* 时间change事件 */
         onChangeTime(e, type) {
             if (this.isOneMonth) {
@@ -535,6 +711,18 @@ export default {
             },
             deep: true,
         },
+        // 监听单选框选中值的变化
+        currentRowId(newVal, oldVal) {
+            if (this.isRadioShow && newVal && newVal !== oldVal) {
+                // 找到对应的行数据
+                const row = this.tableList.find(r => this.getRowUniqueId(r) === newVal)
+                if (row) {
+                    const index = this.tableList.findIndex(r => this.getRowUniqueId(r) === newVal)
+                    this.currentRowData = row
+                    this.$emit('radio-change', row, index)
+                }
+            }
+        },
     },
 }
 </script>
@@ -550,7 +738,7 @@ export default {
     .query-btn {
         width: 98px;
         height: 36px;
-        background: #1F72EA;
+        background: #1f72ea;
         box-shadow: 0px 4px 8px 0px rgba(51, 135, 255, 0.5);
         border-radius: 4px 4px 4px 4px;
         color: #fff;
@@ -559,7 +747,7 @@ export default {
         transition: all 0.3s;
 
         &:hover {
-            background: #4A8BFF;
+            background: #4a8bff;
             box-shadow: 0px 6px 12px 0px rgba(51, 135, 255, 0.6);
         }
     }
@@ -567,7 +755,7 @@ export default {
     .reset-btn {
         width: 98px;
         height: 36px;
-        background: #FFFFFF;
+        background: #ffffff;
         box-shadow: 0px 4px 8px 0px rgba(76, 76, 76, 0.2);
         border-radius: 4px 4px 4px 4px;
         color: #333;
@@ -669,6 +857,22 @@ export default {
     }
 }
 
+// 单选框样式
+::v-deep .el-radio {
+    margin: 0;
+
+    .el-radio__label {
+        padding-left: 0;
+    }
+
+    .el-radio__input {
+        .el-radio__inner {
+            width: 16px;
+            height: 16px;
+        }
+    }
+}
+
 // 表格样式优化
 ::v-deep .el-table {
     .el-button--text {
@@ -679,7 +883,7 @@ export default {
     // 表头样式
     thead {
         th {
-            background-color: #F1F6FF;
+            background-color: #f1f6ff;
             color: #424242;
             font-size: 16px;
             font-weight: 600;

src/router/index.js

@@ -513,6 +513,20 @@ export const dynamicRoutes = [
       }
     ]
   },
+  {
+    path: '/analysisBidDetail',
+    component: Layout,
+    hidden: true,
+    permissions: ['enterpriseLibrary:analysis:detail'],
+    children: [
+      {
+        path: 'index',
+        component: () => import('@/views/analysis/components/AnalysisBidDetail'),
+        name: 'AnalysisBidDetail',
+        meta: { title: '项目标段', activeMenu: '/analysis', noCache: true }
+      }
+    ]
+  },
 ]
 
 // 防止连续点击多次路由报错

src/views/analysis/components/AnalysisBidDetail.vue

@@ -0,0 +1,548 @@
+<template>
+    <div class="analysis-detail-container">
+        <div class="content-header">
+            <el-button class="reset-btn" @click="handleClose">返回</el-button>
+            <el-button class="upload-btn" @click="handleUpload('ruleForm')">提交解析</el-button>
+        </div>
+        <div class="content-scrollable">
+            <el-card class="analysis-detail-card">
+                <template slot="header">
+                    <div class="card-header">
+                        <img src="@/assets/enterpriseLibrary/basic-info.png" alt="项目信息">
+                        <h3>项目信息</h3>
+                    </div>
+                </template>
+                <div class="analysis-detail-content">
+                    <!-- 两列布局的字段 -->
+                    <el-row :gutter="24" class="detail-row">
+                        <el-col :span="12" class="detail-col">
+                            <div class="detail-field">
+                                <div class="field-label">项目名称</div>
+                                <div class="field-value">{{ detailData.proName || '--' }}</div>
+                            </div>
+                        </el-col>
+                        <el-col :span="12" class="detail-col">
+                            <div class="detail-field">
+                                <div class="field-label">项目编号</div>
+                                <div class="field-value">{{ detailData.proCode || '--' }}</div>
+                            </div>
+                        </el-col>
+                    </el-row>
+
+                    <el-row :gutter="24" class="detail-row">
+                        <el-col :span="12" class="detail-col">
+                            <div class="detail-field">
+                                <div class="field-label">招标人</div>
+                                <div class="field-value">{{ detailData.bidder || '--' }}</div>
+                            </div>
+                        </el-col>
+                        <el-col :span="12" class="detail-col">
+                            <div class="detail-field">
+                                <div class="field-label">代理机构</div>
+                                <div class="field-value">{{ detailData.agency || '--' }}</div>
+                            </div>
+                        </el-col>
+                    </el-row>
+
+                    <el-row :gutter="24" class="detail-row">
+                        <el-col :span="12" class="detail-col">
+                            <div class="detail-field">
+                                <div class="field-label">开标时间</div>
+                                <div class="field-value">{{ detailData.openTime || '--' }}</div>
+                            </div>
+                        </el-col>
+                        <el-col :span="12" class="detail-col">
+                            <div class="detail-field">
+                                <div class="field-label">开标方式</div>
+                                <div class="field-value">{{ detailData.openMethod || '--' }}</div>
+                            </div>
+                        </el-col>
+                    </el-row>
+
+                    <!-- 项目简介 - 占满宽度 -->
+                    <div class="detail-field full-width">
+                        <div class="field-label">项目简介</div>
+                        <div class="field-value description-value">{{ detailData.proDescription || '--' }}</div>
+                    </div>
+
+                    <!-- 招标文件 -->
+                    <div class="detail-field full-width">
+                        <div class="field-label">招标文件</div>
+                        <div class="file-value">{{ detailData.proDescription || '--' }}</div>
+                    </div>
+                </div>
+            </el-card>
+            <div class="table-container">
+                <el-row :gutter="12">
+                    <el-col :span="17">
+                        <TableModel :showSearch="false" :showOperation="false" :showRightTools="false"
+                            ref="detailTableRef" :columnsList="detailColumnsList" :request-api="listAPI"
+                            :sendParams="sendParams" :handleColWidth="180" :isRadioShow="true"
+                            @radio-change="handleRadioChange" :indexNumShow="false">
+                            <template slot="tableTitle">
+                                <div class="card-header">
+                                    <img src="@/assets/enterpriseLibrary/basic-info.png" alt="标的信息">
+                                    <h3>标的信息</h3>
+                                </div>
+                            </template>
+
+                            <template slot="handle" slot-scope="{ data }">
+                                <el-button type="text" v-hasPermi="['enterpriseLibrary:analysis:edit']"
+                                    class="action-btn" style="#FE9400" @click="handleUpdate(data)">
+                                    修改
+                                </el-button>
+                            </template>
+                        </TableModel>
+                    </el-col>
+                    <el-col :span="7">
+                        <el-card class="upload-container">
+                            <div class="card-header">
+                                <img src="@/assets/enterpriseLibrary/basic-info.png" alt="附件上传">
+                                <h3>附件上传</h3>
+                            </div>
+                            <div class="upload-title">
+                                <span>请先选择需要解析的标的，再上传标的及其相关附件附件进行解析</span>
+                            </div>
+                            <el-form :model="form" :rules="rules" ref="ruleForm" label-width="110px"
+                                label-position="top">
+                                <el-form-item v-for="(item, index) in uploadType" :key="index" :label="item"
+                                    :prop="`fileList${index + 1}`">
+                                    <UploadMoreFile :fileList="form[`fileList${index + 1}`]"
+                                        @file-change="handleFileChange" @del-file="handleDelFile"
+                                        :type="`fileList${index + 1}`" :uploadType="defaultParams.uploadType"
+                                        :maxFileTips="defaultParams.maxFileTips"
+                                        :fileUploadRule="defaultParams.fileUploadRule"
+                                        :limitUploadNum="defaultParams.limitUploadNum" />
+                                </el-form-item>
+                            </el-form>
+                        </el-card>
+                    </el-col>
+                </el-row>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { decryptWithSM4 } from '@/utils/sm'
+import { listAPI, delDataAPI } from '@/api/analysis/analysis'
+import { formLabel, detailColumnsList } from '../config'
+import TableModel from '@/components/TableModel2'
+import request from '@/utils/request'
+import BidForm from './BidForm.vue'
+import UploadMoreFile from '@/views/common/UploadMoreFile.vue'
+// 默认参数
+const defaultParams = {
+    fileUploadRule: {
+        fileUploadType: 'bidding',
+        fields_json: '',
+        suffix: 'analysis_database',
+    },
+    uploadType: 'pdf、doc、docx',
+    maxFileTips: '500MB',
+    limitUploadNum: 1,
+}
+export default {
+    name: 'AnalysisBidDetail',
+    components: {
+        TableModel,
+        BidForm,
+        UploadMoreFile
+    },
+    data() {
+        return {
+            formLabel,
+            detailColumnsList,
+            listAPI,
+            proId: '',
+            detailData: {},
+            sendParams: {
+                enterpriseId: 2
+            },
+            defaultParams,
+            selectedRow: {},
+            uploadType: ['标段文件', '标段文件2'],
+            form: {
+                delFileList: []
+            },
+            rules: {},
+        }
+    },
+    watch: {
+        uploadType: {
+            handler(newVal, oldVal) {
+                if (newVal && newVal.length > 0) {
+                    // 立即清除验证
+                    this.$refs.ruleForm && this.$refs.ruleForm.clearValidate()
+                    if (oldVal && oldVal.length > 0) {
+                        oldVal.forEach((item, index) => {
+                            this.$delete(this.form, `fileList${index + 1}`)
+                            this.$delete(this.rules, `fileList${index + 1}`)
+                        })
+                    }
+
+                    newVal.forEach((item, index) => {
+                        this.$set(this.form, `fileList${index + 1}`, [])
+                        this.$set(this.rules, `fileList${index + 1}`, [
+                            {
+                                required: true,
+                                message: `请上传${item}`,
+                                trigger: ['change'],
+                            },
+                        ])
+                    })
+
+                    this.$nextTick(() => {
+                        this.$refs.ruleForm &&
+                            this.$refs.ruleForm.clearValidate()
+                    })
+                }
+            },
+            immediate: true,
+        },
+    },
+    created() {
+        this.proId = decryptWithSM4(this.$route.query.proId)
+        this.getDetail()
+    },
+    methods: {
+        // 获取详情数据
+        async getDetail() {
+            try {
+                // TODO: 根据实际API接口调整
+                const res = await request({
+                    url: '/smartBid/analysis/detail',
+                    method: 'GET',
+                    params: { proId: this.proId }
+                })
+                // 或者使用 getDetailDataAPI，需要根据实际接口调整
+                // const res = await getDetailDataAPI({ proId: this.proId })
+
+                if (res.code === 200) {
+                    this.detailData = res.data || {}
+                } else {
+                    this.$message.error(res.msg || '获取详情失败')
+                    // 如果接口未实现，使用模拟数据
+                    this.detailData = {
+                        proName: '南方电网公司2025年电网基建工程第二批次施工公开招标项目',
+                        proCode: 'CG2700022002003411',
+                        bidder: '中建宏业建筑工程有限公司',
+                        agency: '南方电网供应链集团有限公司',
+                        openTime: '2025/06/02 09:00',
+                        openMethod: '线上开标',
+                        proDescription: '本项目为南方电网公司2025年电网基建工程第四批次施工公开招标，涵盖云南、广东及深圳地区的多个标段，工期从141至487日历天不等，计划总投资额约...'
+                    }
+                }
+            } catch (error) {
+                console.error('获取详情失败:', error)
+                // 如果接口未实现，使用模拟数据
+                this.detailData = {
+                    proName: '南方电网公司2025年电网基建工程第二批次施工公开招标项目',
+                    proCode: 'CG2700022002003411',
+                    bidder: '中建宏业建筑工程有限公司',
+                    agency: '南方电网供应链集团有限公司',
+                    openTime: '2025/06/02 09:00',
+                    openMethod: '线上开标',
+                    proDescription: '本项目为南方电网公司2025年电网基建工程第四批次施工公开招标，涵盖云南、广东及深圳地区的多个标段，工期从141至487日历天不等，计划总投资额约...'
+                }
+            }
+        },
+        // 返回
+        handleClose() {
+            const obj = { path: "/analysis" }
+            this.$tab.closeOpenPage(obj)
+        },
+        // 处理单选框变化
+        handleRadioChange(row, index) {
+            this.selectedRow = row
+            console.log('选中的行数据:', row)
+        },
+        // 文件变化
+        handleFileChange(file, fileName) {
+            console.log(file)
+            this.form[fileName] = file
+            this.$refs.ruleForm && this.$refs.ruleForm.clearValidate([fileName])
+
+        },
+        // 文件删除时触发
+        handleDelFile(file) {
+            console.log(file)
+            const delPath =
+                file?.response?.fileRes?.filePath || file?.filePath || null
+            if (delPath) {
+                this.form.delFileList.push(delPath)
+            }
+        },
+        validate(formName) {
+            return new Promise((resolve, reject) => {
+                this.$refs[formName].validate((valid) => {
+                    if (valid) {
+                        resolve(this.form) // 校验成功返回表单数据
+                    } else {
+                        reject(new Error('数据未填写完整'))
+                    }
+                })
+            })
+        },
+        /**验证 */
+        async handleUpload(formName) {
+            try {
+                if (Object.keys(this.selectedRow).length === 0) {
+                    this.$message.error('请选择要提交的标段')
+                    return
+
+                }
+                const data = await this.validate(formName)
+                // 所有校验通过，组装完整数据
+                let formData = {
+                    ...data,
+                    allFiles: [
+                        ...data.fileList.map((file) =>
+                            JSON.parse(JSON.stringify(file)),
+                        ),
+                    ],
+                    delFiles: [...data.delFileList],
+                }
+
+                let allFiles = formData.allFiles
+                    .map((file) => {
+                        return file?.response?.fileRes
+                            ? {
+                                ...file.response.fileRes,
+                            }
+                            : null
+                    })
+                    .filter((item) => item !== null)
+                formData.files = allFiles
+                delete formData.fileList
+                delete formData.delFileList
+                delete formData.allFiles
+                // 显示遮罩层
+                this.loading = this.$loading({
+                    lock: true,
+                    text: '数据提交中，请稍候...',
+                    background: 'rgba(0,0,0,0.5)',
+                    target:
+                        this.$el.querySelector('.el-dialog') || document.body,
+                })
+                console.log('所有表单校验通过，完整数据:', formData)
+                /* const res = await this.saveData(formData)
+                if (res.code === 200) {
+                    this.handleReuslt(res)
+                } else {
+                    this.$modal.msgError(res.msg)
+                } */
+            } catch (error) {
+            } finally {
+                if (this.loading) {
+                    this.loading.close()
+                }
+            }
+        },
+
+        // 保存接口
+        async saveData(formData) {
+            return new Promise((resolve, reject) => {
+                if (this.isAdd === 'add') {
+                    // 新增
+                    addDataAPI(formData)
+                        .then((res) => {
+                            resolve(res)
+                        })
+                        .catch((error) => {
+                            reject(error)
+                        })
+                } else {
+                    // 修改
+                    editDataAPI(formData)
+                        .then((res) => {
+                            resolve(res)
+                        })
+                        .catch((error) => {
+                            reject(error)
+                        })
+                }
+            })
+        },
+    }
+}
+</script>
+
+<style scoped lang="scss">
+.analysis-detail-container {
+    padding: 24px;
+    background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
+    height: calc(100vh - 84px);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+
+.content-scrollable {
+    flex: 1;
+    overflow-y: auto;
+    overflow-x: hidden;
+    padding-right: 6px; // 为滚动条留出空间
+
+    // 自定义滚动条样式
+    &::-webkit-scrollbar {
+        width: 6px;
+    }
+
+    &::-webkit-scrollbar-track {
+        background: transparent;
+    }
+
+    &::-webkit-scrollbar-thumb {
+        background: rgba(0, 0, 0, 0.2);
+        border-radius: 3px;
+
+        &:hover {
+            background: rgba(0, 0, 0, 0.3);
+        }
+    }
+}
+
+.content-header {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    margin-bottom: 20px;
+    gap: 12px;
+}
+
+.reset-btn {
+    width: 98px;
+    height: 36px;
+    background: #FFFFFF;
+    box-shadow: 0px 4px 8px 0px rgba(76, 76, 76, 0.2);
+    border-radius: 4px;
+    border: none;
+    color: #606266;
+    font-weight: 600;
+    font-size: 14px;
+    transition: all 0.3s ease;
+    cursor: pointer;
+
+    &:hover {
+        background: #f5f7fa;
+        color: #409EFF;
+        box-shadow: 0px 6px 12px 0px rgba(76, 76, 76, 0.3);
+    }
+}
+
+.analysis-detail-card {
+    background: #fff;
+    border-radius: 8px;
+    box-shadow: 0px 4px 20px 0px rgba(31, 35, 55, 0.1);
+    border: none;
+    margin-top: 5px;
+    margin-bottom: 10px;
+
+    ::v-deep .el-card__header {
+        padding: 20px 24px;
+        border-bottom: 1px solid #EBEEF5;
+    }
+
+    ::v-deep .el-card__body {
+        padding: 24px;
+    }
+}
+
+.card-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+
+    .header-icon {
+        font-size: 20px;
+        color: #409EFF;
+    }
+
+    h3 {
+        margin: 0;
+        font-size: 18px;
+        font-weight: 600;
+        color: #303133;
+    }
+}
+
+.analysis-detail-content {
+    .detail-row {
+        margin-bottom: 10px;
+
+        &:last-of-type {
+            margin-bottom: 0;
+        }
+    }
+
+    .detail-col {
+        margin-bottom: 10px;
+    }
+
+    .detail-field {
+        .field-label {
+            color: #424242;
+            font-size: 18px;
+            font-weight: 500;
+            margin-bottom: 8px;
+            line-height: 1.5;
+        }
+
+        .field-value {
+            background: #f5f7fa;
+            border-radius: 4px;
+            padding: 12px 16px;
+            color: #303133;
+            font-size: 14px;
+            line-height: 1.5;
+            min-height: 20px;
+            word-break: break-word;
+        }
+
+        &.full-width {
+            margin-bottom: 10px;
+
+            .description-value {
+                min-height: 80px;
+                white-space: pre-wrap;
+                word-wrap: break-word;
+            }
+        }
+
+        .file-value {
+            font-size: 14px;
+            line-height: 1.5;
+            color: #1f72ea;
+        }
+    }
+}
+
+.upload-container {
+    margin-top: 5px;
+}
+
+.upload-btn {
+    width: 98px;
+    height: 36px;
+    background: #1f72ea;
+    box-shadow: 0px 4px 8px 0px rgba(51, 135, 255, 0.5);
+    border-radius: 4px 4px 4px 4px;
+    color: #fff;
+    border: none;
+    font-size: 14px;
+    transition: all 0.3s;
+
+    &:hover {
+        background: #4a8bff;
+        box-shadow: 0px 6px 12px 0px rgba(51, 135, 255, 0.6);
+    }
+}
+
+.upload-title {
+    span {
+        font-size: 14px !important;
+        color: red;
+    }
+}
+</style>

src/views/analysis/components/AnalysisDetail.vue

@@ -281,7 +281,7 @@ export default {
 
 .analysis-detail-content {
     .detail-row {
-        margin-bottom: 20px;
+        margin-bottom: 10px;
 
         &:last-of-type {
             margin-bottom: 0;
@@ -289,7 +289,7 @@ export default {
     }
 
     .detail-col {
-        margin-bottom: 20px;
+        margin-bottom: 10px;
     }
 
     .detail-field {

src/views/analysis/index.vue

@@ -2,8 +2,16 @@
     <!-- 招标解析 -->
     <el-card class="analysis-container">
         <div class="table-container">
-            <TableModel :formLabel="formLabel" :showOperation="true" :showRightTools="false" ref="analysisTableRef"
+            <TableModel 
-                :columnsList="columnsList" :request-api="listAPI" :sendParams="sendParams" :handleColWidth="250">
+                :formLabel="formLabel" 
+                :showOperation="true" 
+                :showRightTools="false" 
+                ref="analysisTableRef"
+                :columnsList="columnsList" 
+                :request-api="listAPI" 
+                :sendParams="sendParams" 
+                :handleColWidth="250"
+            >
                 <template slot="tableTitle">
                     <h3>数据列表</h3>
                 </template>
@@ -17,8 +25,8 @@
                         @click="handleDetail(data)">
                         查看
                     </el-button>
-                    <el-button type="text" v-hasPermi="['enterpriseLibrary:tool:edit']" class="action-btn"
+                    <el-button type="text" v-hasPermi="['enterpriseLibrary:analysis:detail']" class="action-btn"
-                        @click="handleUpdate(data)">
+                        @click="handleBidDetail(data)">
                         标段解析
                     </el-button>
                     <el-button type="text" v-hasPermi="['enterpriseLibrary:tool:edit']" class="action-btn"
@@ -72,6 +80,7 @@ export default {
             showAnalysisForm: false,
             title: '',
             row: {},
+            selectedRow: null, // 单选框选中的行数据
         }
     },
 
@@ -112,11 +121,21 @@ export default {
                 }
             })
         },
+        /** 标段解析操作 */
+        handleBidDetail(row) {
+            this.$router.push({
+                name: 'AnalysisBidDetail',
+                query: {
+                    proId: encryptWithSM4('2')
+                }
+            })
+        },
 
         /* 搜索操作 */
         handleQuery() {
             this.$refs.analysisTableRef.getTableList()
         },
+        
         /** 删除操作 */
         handleDelete(row) {
             this.$confirm(`确定要删除"${row.toolName}"吗？删除后将无法恢复！`, '操作提示', {