From 9a7f3304f4ebc7251796fe1780dffb5b84d88510 Mon Sep 17 00:00:00 2001
From: jiang <BnsGit@123!>
Date: Fri, 23 Jan 2026 18:13:01 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E5=B7=A5=E7=A8=8B=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E6=94=B9=E9=80=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/project/index.vue | 1782 ++++++++++------------------
 1 file changed, 622 insertions(+), 1160 deletions(-)

diff --git a/src/views/system/project/index.vue b/src/views/system/project/index.vue
index aaad0315..d45432df 100644
--- a/src/views/system/project/index.vue
+++ b/src/views/system/project/index.vue
@@ -1,178 +1,163 @@
 <template>
   <div class="app-container">
-    <!-- 搜索表单 -->
-    <el-form
-      :inline="true"
-      label-width="80px"
-      label-position="right"
-      size="small"
-      ref="searchFormRef"
-      :model="searchParams"
-    >
-      <el-card class="search-box">
-        <el-row style="height: 32px">
-          <!-- 关键修改：使用 flex 布局实现自适应换行 -->
-        <div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 10px;">
-          <el-form-item prop="pro_name" label="项目名称" style="margin-bottom: 0; width: 320px">
-            <el-input
-              clearable
-              placeholder="请输入项目名称"
-              v-model="searchParams.pro_name"
-              style="width: 100%; min-width: 200px;"
+    <!-- 简化版搜索表单 -->
+    <div class="search-wrapper">
+      <el-form
+        :inline="true"
+        label-width="70px"
+        label-position="right"
+        ref="searchFormRef"
+        :model="searchParams"
+        class="search-form"
+      >
+        <el-form-item prop="pro_name" label="项目名称">
+          <el-input
+            clearable
+            placeholder="请输入项目名称"
+            v-model="searchParams.pro_name"
+            style="width: 200px"
+          />
+        </el-form-item>
+
+        <el-form-item prop="project_type" label="项目类型">
+          <el-select
+            clearable
+            placeholder="选择项目类型"
+            v-model="searchParams.project_type"
+            style="width: 180px"
+          >
+            <el-option v-for="dict in dict.type.project_type" :key="dict.value" :label="dict.label"
+                       :value="dict.label"
             />
-          </el-form-item>
+          </el-select>
+        </el-form-item>
 
-<!--          <el-form-item prop="pro_code" label="工程编号" style="margin-bottom: 0; width: 320px">-->
-<!--            <el-input-->
-<!--              clearable-->
-<!--              placeholder="请输入工程编号"-->
-<!--              v-model="searchParams.pro_code"-->
-<!--              style="width: 100%; min-width: 200px;"-->
-<!--            />-->
-<!--          </el-form-item>-->
+        <el-form-item prop="project_status" label="项目状态">
+          <el-select
+            clearable
+            placeholder="选择项目状态"
+            v-model="searchParams.project_status"
+            style="width: 180px"
+          >
+            <el-option v-for="dict in dict.type.project_status" :key="dict.value" :label="dict.label"
+                       :value="dict.label"
+            />
+          </el-select>
+        </el-form-item>
 
-<!--          <el-form-item prop="org_name" label="建管单位" style="margin-bottom: 0;  width: 320px">-->
-<!--            <el-input-->
-<!--              clearable-->
-<!--              placeholder="请输入单位名称"-->
-<!--              v-model="searchParams.org_name"-->
-<!--              style="width: 100%; min-width: 200px;"-->
-<!--            />-->
-<!--          </el-form-item>-->
+        <el-form-item prop="voltage" label="电压等级">
+          <el-select
+            clearable
+            placeholder="选择电压等级"
+            v-model="searchParams.voltage"
+            style="width: 180px"
+          >
+            <el-option v-for="dict in dict.type.voltage_type" :key="dict.value" :label="dict.label"
+                       :value="dict.label"
+            />
+          </el-select>
+        </el-form-item>
 
-          <el-form-item prop="project_type" label="项目类型" style="margin-bottom: 0; width: 320px">
-            <el-select
-              clearable
-              placeholder="选择项目类型"
-              v-model="searchParams.project_type"
-              style="width: 100%; min-width: 200px;"
-            >
-              <el-option
-                v-for="item in projectTypeList"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value"
-              />
-            </el-select>
-          </el-form-item>
-
-          <!-- 按钮区域 -->
-          <div style="display: flex; gap: 10px; margin-left: auto;">
-            <el-button @click="getProjectListData" size="mini" icon="el-icon-search" type="primary" class="primary-lease">
-              查询
-            </el-button>
-            <el-button @click="onReset" icon="el-icon-refresh" size="mini" class="primary-lease">重置</el-button>
-          </div>
-        </div>
-
-        </el-row>
-      </el-card>
-    </el-form>
+        <el-form-item>
+          <el-button @click="getProjectListData" icon="el-icon-search" type="primary">
+            查询
+          </el-button>
+          <el-button @click="onReset" icon="el-icon-refresh" style="margin-left: 8px">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
 
     <!-- 数据列表 -->
-    <el-card class="content-box">
-      <el-row style=" display: flex; justify-content: flex-end; align-items: center; gap: 10px;">
+    <div class="table-wrapper">
+      <div class="table-header" >
         <el-button
-          type="warning"
-          plain
-          size="mini"
-          @click="handleExport"
-        >导出
-        </el-button>
-        <el-button
-          size="mini"
           @click="handleAdd"
           type="primary"
-          class="primary-lease"
         >
           项目新建
         </el-button>
+<!--        <el-button-->
+<!--          type="warning"-->
+<!--          plain-->
+<!--          style="margin-left: 8px"-->
+<!--          @click="handleExport"-->
+<!--        >导出-->
+<!--        </el-button>-->
         <el-button
-          size="mini"
           type="danger"
-          class="primary-lease"
           @click="handleBatchDelete"
           :disabled="selectedRows.length === 0"
-          style="background: #FF5129;color: #FFFFFF;font-weight: 400;font-size: 14px;"
+          style="margin-left: 8px"
         >
           批量删除
         </el-button>
-      </el-row>
+      </div>
 
-
-      <div >
+      <!-- 表格容器：限制高度 + 隐藏滚动条 -->
+      <div class="table-content">
         <el-table
           :data="projectList"
-          show-overflow-tooltip
-          border stripe class="my-table"
+          border
+          stripe
+          class="project-table"
           @selection-change="handleSelectionChange"
-          style="overflow: auto;height: 1px;"
+          :show-header="true"
+          :show-overflow-tooltip="true"
+          height="100%"
         >
           <!--复选列-->
-          <el-table-column type="selection" width="55" align="center"/>
+          <el-table-column type="selection" width="50" align="center"/>
+          <!--序号列-->
+          <el-table-column align="center" label="序号" type="index" width="50"/>
 
-          <el-table-column align="center" label="序号" type="index" width="80"/>
-
-          <el-table-column align="center" prop="pro_name" show-overflow-tooltip label="项目名称" />
-
-          <el-table-column align="center" prop="pro_code" label="项目编号">
-
-          </el-table-column>
-          <el-table-column align="center" prop="dict_label" label="项目类型"/>
-          <el-table-column align="center" prop="voltage" label="电压等级"/>
-          <el-table-column align="center" prop="scale" label="规模"/>
-          <el-table-column align="center" prop="province" label="所在省"/>
-          <el-table-column align="center" prop="city" label="所在市"/>
-          <el-table-column align="center" prop="county" label="所在区/县"/>
-
-          <el-table-column align="center" prop="mechanize_rate" label="机械化率"/>
-          <el-table-column align="center" label="操作" :width="220">
+          <!-- 核心字段列 - 统一设置换行样式 -->
+          <el-table-column align="center" prop="pro_code" label="项目编号" min-width="120"/>
+          <el-table-column align="center" prop="pro_name" label="项目名称" min-width="200">
             <template slot-scope="scope">
+              <div class="cell-text-ellipsis">{{ scope.row.pro_name }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="org_name" label="施工单位" min-width="150">
+            <template slot-scope="scope">
+              <div class="cell-text-ellipsis">{{ scope.row.org_name }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="project_source" label="项目来源" min-width="80"/>
+          <el-table-column align="center" prop="project_type" label="项目类型" min-width="80"/>
+          <el-table-column align="center" prop="project_amount" label="项目金额" min-width="80"/>
+          <el-table-column align="center" prop="project_address" label="项目地点" min-width="180">
+            <template slot-scope="scope">
+              <div class="cell-text-ellipsis">{{ scope.row.project_address }}</div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="actual_start_date" label="实际开始日期" min-width="110"/>
+          <el-table-column align="center" prop="actual_end_date" label="实际结束日期" min-width="110"/>
+          <el-table-column align="center" prop="project_status" label="项目状态" min-width="80">
+            <template slot-scope="scope">
+              <el-tag :type="getStatusTagType(scope.row.project_status)">
+                {{ scope.row.project_status || '-' }}
+              </el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="voltage" label="电压等级" width="100"/>
+          <el-table-column align="center" prop="substation_capacity" label="变电容量" width="80"/>
+          <el-table-column align="center" prop="line_length" label="线路长度" width="80"/>
 
-
-
-              <!-- 查看详情按钮（复用编辑按钮样式，仅改文字和方法） -->
-<!--              <el-button-->
-<!--                size="small"-->
-<!--                type="info"-->
-<!--                class="primary-lease"-->
-<!--                @click="handleViewDetails(scope.row)"-->
-<!--              >-->
-<!--                查看-->
-<!--              </el-button>-->
-
-
-
-              <!-- 编辑按钮：移除 v-if 条件，直接显示 -->
-              <el-button
-                type="text"
-                @click="handleEdit(scope.row)"
-              >
-                编辑
-              </el-button>
-              <!-- 删除按钮：移除 v-if 条件，直接显示 -->
-              <el-popconfirm
-                width="220"
-                icon="el-icon-info"
-                icon-color="#626AEF"
-                title="确定删除该项目吗？"
-                @confirm="handleDelete(scope.row.id)"
-              >
-                <template slot="reference">
-                  <el-button type="text"  style="margin-left: 8px; color: red">
-                    删除
-                  </el-button>
-                </template>
-              </el-popconfirm>
+          <!--操作列-->
+          <el-table-column align="center" label="操作" width="120">
+            <template slot-scope="scope">
+              <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button>
+              <el-button type="text" style="color: red" @click="handleDeleteConfirm(scope.row.id)">删除</el-button>
             </template>
           </el-table-column>
         </el-table>
       </div>
-      <!-- 分页组件 -->
+
+      <!-- 分页组件：固定右下 -->
       <div class="pagination-wrapper">
         <el-pagination
           background
-          layout="total,sizes,prev, pager, next"
+          layout="total, sizes, prev, pager, next"
           :total="total"
           :page-size="searchParams.pageSize"
           :current-page="searchParams.pageNum"
@@ -180,254 +165,125 @@
           @current-change="handleCurrentChange"
         />
       </div>
-    </el-card>
+    </div>
 
-    <!-- 新增/编辑对话框 -->
+    <!-- 简化版新增/编辑对话框 -->
     <el-dialog
-      width="1000px"
+      width="800px"
       @close="handleDialogClose"
       destroy-on-close
       :title="dialogTitle"
       :visible.sync="addOrEditDialogVisible"
-      custom-class="simple-dialog"
     >
       <el-form
-        label-width="100px"
+        label-width="90px"
         label-position="right"
         ref="addOrEditFormRef"
         :model="addOrEditForm"
         :rules="addOrEditFormRules"
-        class="simple-form"
-        label-class="el-form-item__label"
       >
-        <el-row :gutter="20">
-          <el-col :span="24">
-            <el-row :gutter="15">
-              <el-col :span="12">
-                <el-form-item label="项目名称" prop="pro_name">
-                  <el-input
-                    v-model="addOrEditForm.pro_name"
-                    placeholder="请输入项目名称"
-                    style="width: 100%"
-                    maxlength="50"
-                    show-word-limit
-                    :disabled="isView"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="项目编号" prop="pro_code">
-                  <el-input
-                    v-model="addOrEditForm.pro_code"
-                    placeholder="请输入项目编号"
-                    style="width: 100%"
-                    maxlength="30"
-                    show-word-limit
-                    :disabled="!isAdd || isView"
-
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-
-            <el-row :gutter="15">
-              <el-col :span="12">
-                <el-form-item label="电压等级" prop="voltage">
-                  <!-- <el-input
-                    v-model="addOrEditForm.voltage"
-                    placeholder="请输入电压等级（如：500）"
-                    style="width: 100%"
-                    maxlength="10"
-                    show-word-limit
-                    :disabled="isView"
-                  /> -->
-                  <el-select
-                    clearable
-                    placeholder="请选择电压等级"
-                    v-model="addOrEditForm.voltage"
-                    style="width: 100%; min-width: 200px;"
-                  >
-                    <el-option
-                      v-for="item in voltageList"
-                      :key="item.value"
-                      :label="item.value"
-                      :value="item.value"
-                    />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="规模" prop="scale">
-                  <el-input
-                    v-model="addOrEditForm.scale"
-                    placeholder="请输入规模"
-                    style="width: 100%"
-                    maxlength="50"
-                    show-word-limit
-                    :disabled="isView"
-                  />
-                </el-form-item>
-              </el-col>
-
-              <el-col :span="12">
-                <el-form-item label="项目类型" prop="project_type"> <!-- 注意prop要与表单字段对齐 -->
-                  <el-select
-                    clearable
-                    style="width: 100%"
-                    placeholder="请选择项目类型"
-                    v-model="addOrEditForm.project_type"
-                    :disabled="isView"
-                  >
-                    <el-option
-                      v-for="item in projectTypeList"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value"
-                    />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-
-              <el-col :span="12">
-                <el-form-item label="建管单位" prop="org_name">
-                  <el-input
-                    v-model="addOrEditForm.org_name"
-                    placeholder="请输入单位"
-                    style="width: 100%"
-                    maxlength="50"
-                    show-word-limit
-                    :disabled="isView"
-                  />
-                </el-form-item>
-              </el-col>
-
-
-            <el-col :span="12">
-              <el-form-item label="机械化率" prop="mechanize_rate">
-                <el-input
-                  v-model="addOrEditForm.mechanize_rate"
-                  placeholder="请输入机械化率"
-                  style="width: 100%"
-                  maxlength="50"
-                  show-word-limit
-                  :disabled="isView"
+        <!-- 分两列布局，简化层级 -->
+        <el-row :gutter="15">
+          <!-- 第一列 -->
+          <el-col :span="12">
+            <el-form-item label="项目名称" prop="pro_name">
+              <el-input v-model="addOrEditForm.pro_name" placeholder="请输入项目名称" maxlength="100" show-word-limit/>
+            </el-form-item>
+            <!--            <el-form-item label="施工单位" prop="construction_unit">
+                          <el-input v-model="addOrEditForm.construction_unit" placeholder="请输入施工单位" maxlength="50"
+                                    show-word-limit
+                          />
+                        </el-form-item>-->
+            <el-form-item label="项目类型" prop="project_type">
+              <el-select v-model="addOrEditForm.project_type" placeholder="请选择项目类型" clearable
+                         style="width: 100%"
+              >
+                <el-option v-for="dict in dict.type.project_type" :key="dict.value" :label="dict.label"
+                           :value="dict.label"
                 />
-              </el-form-item>
-            </el-col>
-        </el-row>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="开工日期" prop="actual_start_date">
+              <el-date-picker type="date" v-model="addOrEditForm.actual_start_date" placeholder="选择开始日期"
+                              value-format="yyyy-MM-dd" style="width: 100%"
+              />
+            </el-form-item>
+            <el-form-item label="电压等级" prop="voltage">
+              <el-select v-model="addOrEditForm.voltage" placeholder="请选择电压等级" clearable style="width: 100%">
+                <el-option v-for="dict in dict.type.voltage_type" :key="dict.value" :label="dict.label"
+                           :value="dict.label"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="变电容量" prop="substation_capacity">
+              <el-input v-model="addOrEditForm.substation_capacity" placeholder="请输入变电容量" type="number"
+                        step="0.01"
+                        min="0"
+                        @input="(e) => handleNumberInput(e, this, 'addOrEditForm.substation_capacity')"
+              />
+            </el-form-item>
+            <el-form-item label="线路长度" prop="line_length">
+              <el-input v-model="addOrEditForm.line_length" placeholder="请输入线路长度" type="number" step="0.01"
+                        min="0"
+                        @input="(e) => handleNumberInput(e, this, 'addOrEditForm.line_length')"
+              />
+            </el-form-item>
+          </el-col>
+          <!-- 第二列 -->
+          <el-col :span="12">
+            <el-form-item label="项目编号" prop="pro_code">
+              <el-input v-model="addOrEditForm.pro_code" placeholder="请输入项目编号" maxlength="100" show-word-limit
+                        :disabled="!isAdd"
+              />
+            </el-form-item>
+            <el-form-item label="项目来源" prop="project_source">
+              <el-select v-model="addOrEditForm.project_source" placeholder="请选择项目来源" clearable
+                         style="width: 100%"
+              >
+                <el-option v-for="dict in dict.type.project_source" :key="dict.value" :label="dict.label"
+                           :value="dict.label"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="项目金额" prop="project_amount">
+              <el-input v-model="addOrEditForm.project_amount" step="0.01" placeholder="请输入项目金额" type="number"
+                        min="0"
+                        @input="(e) => handleNumberInput(e, this, 'addOrEditForm.project_amount')"
+              />
+            </el-form-item>
+            <el-form-item label="完工日期" prop="actual_end_date">
+              <el-date-picker type="date" v-model="addOrEditForm.actual_end_date" placeholder="选择结束日期"
+                              value-format="yyyy-MM-dd" style="width: 100%"
+              />
+            </el-form-item>
+            <el-form-item label="项目状态" prop="project_status">
+              <el-select v-model="addOrEditForm.project_status" placeholder="请选择项目状态" clearable
+                         style="width: 100%"
+              >
+                <el-option v-for="dict in dict.type.project_status" :key="dict.value" :label="dict.label"
+                           :value="dict.label"
+                />
+              </el-select>
+            </el-form-item>
 
-
-
-            <el-row :gutter="15">
-              <el-col :span="12">
-                <el-form-item label="开工时间" prop="start_time">
-                  <el-date-picker
-                    type="date"
-                    placeholder="选择开工时间"
-                    v-model="addOrEditForm.start_time"
-                    value-format="yyyy-MM-dd"
-                    style="width: 100%"
-                    :disabled="isView"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="投产时间" prop="put_time">
-                  <el-date-picker
-                    type="date"
-                    placeholder="选择投产时间"
-                    v-model="addOrEditForm.put_time"
-                    value-format="yyyy-MM-dd"
-                    style="width: 100%"
-                    :disabled="isView"
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row :gutter="15">
-              <el-col :span="8">
-                <el-form-item label="所在省" prop="province">
-                  <el-select
-                    clearable
-                    style="width: 100%"
-                    placeholder="请选择所在省"
-                    v-model="addOrEditForm.province"
-                    @change="loadCities"
-                  >
-                    <el-option
-                      v-for="item in provinceOptions"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value"
-                    />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="8">
-                <el-form-item label="所在市" prop="city">
-                  <el-select
-                    clearable
-                    style="width: 100%"
-                    placeholder="请选择所在市"
-                    v-model="addOrEditForm.city"
-                    @change="loadDistricts"
-                    :disabled="!addOrEditForm.province"
-                  >
-                  <el-option
-                    v-for="item in cityOptions"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="8">
-                <el-form-item label="所在区/县" prop="county">
-                  <el-select
-                    clearable
-                    style="width: 100%"
-                    placeholder="请选择所在区/县"
-                    v-model="addOrEditForm.county"
-                    :disabled="!addOrEditForm.city"
-                  >
-                  <el-option
-                    v-for="item in districtOptions"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                  </el-select>
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row>
-              <el-col :span="24">
-                <el-form-item label="备注" prop="remark">
-                  <el-input
-                    type="textarea"
-                    v-model="addOrEditForm.remark"
-                    placeholder="请输入备注内容"
-                    :rows="3"
-                    style="width: 100%"
-                    maxlength="100"
-                    show-word-limit
-                    :disabled="isView"
-                  />
-                </el-form-item>
-              </el-col>
-            </el-row>
           </el-col>
         </el-row>
+        <!-- 单行大字段 -->
+        <el-form-item label="项目地点" prop="project_address">
+          <el-input v-model="addOrEditForm.project_address" placeholder="请输入项目地点" maxlength="100"
+                    show-word-limit
+          />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input type="textarea" v-model="addOrEditForm.remark" placeholder="请输入备注" rows="2" maxlength="100"
+                    show-word-limit
+          />
+        </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button @click="addOrEditDialogVisible = false" class="cancel-btn">取消</el-button>
-        <el-button type="primary" @click="handleSubmit" :loading="submitLoading" class="confirm-btn" v-if="!isView">
-          <span v-if="!submitLoading">{{ isAdd ? '新增' : '确认' }}</span>
-          <span v-else>提交中...</span>
+        <el-button @click="addOrEditDialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="handleSubmit" :loading="submitLoading">
+          {{ isAdd ? '新增' : '保存' }}
         </el-button>
       </div>
     </el-dialog>
@@ -444,240 +300,62 @@ import {
   getProjectTypeList,
   delProjectBatch  // 新增：导入批量删除API
 } from '@/api/system/project'
-import { Message } from 'element-ui'
-import { getProvinces, getCities, getCounties } from '@/api/system/region'
-import {debounce} from "@/utils";
 
 export default {
   name: 'ProjectManagement',
+  dicts: ['voltage_type', 'project_status', 'project_type', 'project_source'],
   data() {
     return {
-      total: 0,
-      projectList: [],
-      selectedRows: [],   // 存储选中的表格行
-      provinceOptions: [],    // 省份下拉选项
-      cityOptions: [],        // 城市下拉选项
-      districtOptions: [],    // 区县下拉选项
-      dialogTitle: '新增项目',
-      addOrEditDialogVisible: false,
-      submitLoading: false,
-      isAdd: true,
-      isView: false,
-      voltageList: [
-        { value: '35kv及以下', label: '35kv及以下' },
-        { value: '110kv', label: '110kv' },
-        { value: '220kv', label: '220kv' },
-        { value: '500kv', label: '500kv' },
-        { value: '500kv以上', label: '500kv以上' }
-      ],
-
-      // 搜索参数
+      // 搜索参数 - 精简版
       searchParams: {
-        pro_name: '',
-        pro_code: '',
-        project_type: '',
-        org_name: '',
-        dict_value:'',
+        pageNum: 1,
         pageSize: 10,
-        pageNum: 1
-      },
-
-      // 表单数据
-      addOrEditForm: {
-        id: '',
         pro_name: '',
-        pro_code: '',
         project_type: '',
-        org_name: '',
-        contractUnit: '',
-        mechanize_rate: '',
-        remark: '',
-        voltage: '',
-        scale: '',
-        province: '',
-        city: '',
-        county: '',
-        start_time: '',
-        put_time: '',
+        project_status: '',
+        voltage: ''
       },
-
-      projectTypeList: [],
-
-      // 表单验证规则
+      // 列表数据
+      projectList: [],
+      total: 0,
+      // 选中行
+      selectedRows: [],
+      // 弹窗相关
+      addOrEditDialogVisible: false,
+      dialogTitle: '',
+      isAdd: true,
+      submitLoading: false,
+      // 表单数据 - 精简字段
+      addOrEditForm: {
+        pro_code: '',
+        pro_name: '',
+        construction_unit: '',
+        project_source: '',
+        project_type: '',
+        project_amount: 0,
+        project_address: '',
+        actual_start_date: '',
+        actual_end_date: '',
+        project_status: '',
+        voltage: '',
+        substation_capacity: 0,
+        line_length: 0,
+        remark: ''
+      },
+      // 简化校验规则
       addOrEditFormRules: {
-        // 以下字段保持必填
-        pro_name: [
-          { required: true, message: '请输入项目名称', trigger: 'blur' }
-        ],
-        pro_code: [
-          { required: true, message: '请输入项目编号', trigger: 'blur' }
-        ],
-        voltage: [
-          { required: true, message: '请输入电压等级', trigger: 'blur' }
-        ],
-        scale: [
-          { required: true, message: '请输入规模', trigger: 'blur' }
-        ],
-        project_type: [
-          { required: true, message: '请选择项目类型', trigger: 'change' }
-        ],
-        province: [
-          { required: true, message: '请选择所在省', trigger: 'blur' }
-        ],
-        city: [
-          { required: true, message: '请选择所在市', trigger: 'blur' }
-        ],
-        county: [
-          { required: true, message: '请选择所在区/县', trigger: 'blur' }
-        ],
-
-        start_time: [
-
-          { message: '请选择开工时间', trigger: 'change' }
-        ],
-        put_time: [
-          { message: '请选择投产时间', trigger: 'change' },
-          { validator: this.validateTimeDifference, trigger: 'change' }
-        ],
-        mechanize_rate: [
-
-          {
-            pattern: /^(100(\.0{1,2})?|0(\.\d{1,2})?|[1-9]\d{0,1}(\.\d{1,2})?)$/,
-            message: '请输入 0 ~ 100 之间的有效数字，且不能以 0 开头（如 01、010）',
-            trigger: 'blur'
-          }
-        ],
-        org_name: [
-          // 非必填，仅保留长度限制（可选）
-          { max: 50, message: '单位名称不能超过50个字符', trigger: 'blur' }
-        ],
-        remark: [
-          { max: 100, message: '备注不能超过100个字符', trigger: 'blur' }
-        ],
-        contractUnit: [] // 完全非必填，留空数组
+        pro_name: [{ required: true, message: '请输入项目名称', trigger: 'blur' }],
+        pro_code: [{ required: true, message: '请输入项目编号', trigger: 'blur' }],
+        construction_unit: [{ required: true, message: '请输入施工单位', trigger: 'blur' }],
+        project_type: [{ required: true, message: '请选择项目类型', trigger: 'change' }]
       }
     }
   },
-
   created() {
-    this.handleSubmit=debounce(this.handleSubmit, 500);
-  },
-
-  mounted() {
-    this.loadProvinces() // 页面加载时加载省份
     this.getProjectListData()
-    this.loadProjectTypes()
   },
-
   methods: {
-
-    // 自定义校验：投产时间必须晚于开工时间
-    validateTimeDifference(rule, value, callback) {
-      const startTime = this.addOrEditForm.start_time; // 开工时间
-      const endTime = value; // 投产时间（当前校验字段的值）
-
-      // 若未选择投产时间，直接通过（非必填）
-      if (!endTime) return callback();
-
-      // 若已选择开工时间，校验时间差
-      if (startTime) {
-        const startDate = new Date(startTime);
-        const endDate = new Date(endTime);
-        // 若投产时间早于或等于开工时间，提示错误
-        if (endDate <= startDate) {
-          return callback(new Error('投产时间必须晚于开工时间'));
-        }
-      }
-
-      // 校验通过
-      callback();
-    },
-
-    async loadProvinces() {
-      try {
-        const res = await getProvinces()
-        if (res.code === 200) {
-          // 关键转换：将 areaCode → value，name → label
-          this.provinceOptions = res.data.map(item => ({
-            value: item.areaCode, // 下拉框的选项值（存储用）
-            label: item.short_name       // 下拉框的显示文本（用户看）
-          }))
-        } else {
-          Message.error('加载省份失败：' + (res.message || '未知错误'))
-        }
-      } catch (error) {
-        console.error('省份加载异常：', error)
-        Message.error('网络异常，无法加载省份数据')
-      }
-    },
-
-    // 加载城市
-    async loadCities(provinceAreaCode) {
-      console.log('loadCities param:', provinceAreaCode)
-
-      // 关键改动：当省份改变时，清空城市和区县的选项及表单值
-      // 即使 provinceAreaCode 为空（例如用户清空了省份选择），也执行清空操作
-      this.cityOptions = [];
-      this.districtOptions = [];
-      this.addOrEditForm.city = '';
-      this.addOrEditForm.county = '';
-
-      // 如果没有传入有效的省份编码，则直接返回
-      if (!provinceAreaCode || !/^\d{6,12}$/.test(provinceAreaCode)) {
-        console.error('❌ 传入了无效的 provinceAreaCode：', provinceAreaCode);
-        return;
-      }
-
-      try {
-        const res = await getCities(provinceAreaCode)
-        if (res.code === 200) {
-          this.cityOptions = res.data.map(item => ({
-            value: item.areaCode,
-            label: item.short_name
-          }))
-        } else {
-          Message.error('加载城市失败')
-        }
-      } catch (error) {
-        console.error('城市加载异常：', error)
-        Message.error('无法加载城市数据')
-      }
-    },
-
-// 加载区县
-    async loadDistricts(cityAreaCode) {
-      console.log('loadDistricts param:', cityAreaCode)
-
-      // 关键改动：当城市改变时，清空区县的选项及表单值
-      // 即使 cityAreaCode 为空，也执行清空操作
-      this.districtOptions = [];
-      this.addOrEditForm.county = '';
-
-      // 如果没有传入有效的城市编码，则直接返回
-      if (!cityAreaCode || !/^\d{6,12}$/.test(cityAreaCode)) {
-        console.error('❌ 传入了无效的 cityAreaCode：', cityAreaCode);
-        return;
-      }
-
-      try {
-        const res = await getCounties(cityAreaCode)
-        if (res.code === 200) {
-          this.districtOptions = res.data.map(item => ({
-            value: item.areaCode,
-            label: item.name
-          }))
-        } else {
-          Message.error('加载区县失败')
-        }
-      } catch (error) {
-        console.error('区县加载异常：', error)
-        Message.error('无法加载区县数据')
-      }
-    },
-
-
-
-    // 获取工程列表
+    // 获取列表数据
     async getProjectListData() {
       try {
         const res = await listProject(this.searchParams)
@@ -685,625 +363,409 @@ export default {
           this.projectList = res.data.rows || []
           this.total = res.data.total || 0
         } else {
-          Message.error(res.message || '获取项目列表失败')
+          this.$modal.msgError(res.message || '获取项目列表失败')
         }
       } catch (error) {
-        Message.error('获取项目列表失败')
+        this.$modal.msgError('获取项目列表失败')
       }
     },
-
-    // 加载工程类型
-    async loadProjectTypes() {
-      try {
-        const res = await getProjectTypeList()
-        if (res.code === 200) {
-          this.projectTypeList = res.data.map(item => ({
-            label: item.dict_label,
-            value: item.dict_value
-          }))
-        } else {
-          Message.error('获取项目类型失败：' + (res.message || ''))
-        }
-      } catch (error) {
-        Message.error('加载项目类型时发生网络错误')
-      }
-    },
-
-    handleExport() {
-      this.download('/material-mall/project/export', {
-        ...this.queryParams
-      }, `项目管理_${new Date().getTime()}.xlsx`)
-    },
-
-    // 重置搜索
-    onReset() {
-      this.searchParams = {
-        pro_name: '',
-        pro_code: '',
-        project_type: '',
-        org_name: '',
-        pageSize: this.searchParams.pageSize,
-        pageNum: 1
-      }
-      this.$refs.searchFormRef?.clearValidate()
-      this.getProjectListData()
-    },
-
-    // 表格选择变化
-    handleSelectionChange(selection) {
-      this.selectedRows = selection
-    },
-
-    // 详情页跳转
-    handleToDetails(id) {
-      this.$router.push({name: 'demand-details', query: {id}})
-    },
-
-    // 新增工程
-    handleAdd() {
-      this.isAdd = true
-      this.isView = false
-      this.dialogTitle = '新增项目'
-      this.addOrEditForm = {
-        id: '',
-        pro_name: '',
-        pro_code: '',
-        project_type: '',
-        org_name: '',
-        contractUnit: '',
-        remark: '',
-        voltage: '',
-        scale: '',
-        province: '',
-        city: '',
-        county: '',
-        start_time: '',
-        put_time: ''
-      }
-      this.$refs.addOrEditFormRef?.clearValidate()
-      this.addOrEditDialogVisible = true
-    },
-
-    // 查看详情
-    async handleViewDetails(row) {
-      this.isView = true
-      this.dialogTitle = '查看项目详情'
-      try {
-        const res = await getProject(row.id)
-        if (res.code === 200) {
-          this.addOrEditForm = {...res.data}
-          this.addOrEditDialogVisible = true
-        } else {
-          Message.error(res.message || '获取项目详情失败')
-        }
-      } catch (error) {
-        Message.error('获取项目详情失败')
-      }
-    },
-
-    async handleEdit(row) {
-      this.isAdd = false;
-      this.isView = false;
-      this.dialogTitle = '编辑项目';
-
-      try {
-        // 1. 获取工程详情
-        const res = await getProject(row.id);
-        if (res.code !== 200) return this.$message.error('获取详情失败');
-
-        // 拿到原始数据
-        const projectData = res.data;
-
-        // ================== 核心修改开始 ==================
-        // 2. 处理机械化率的格式：去除百分号，并转换为数字
-        if (projectData.mechanize_rate && typeof projectData.mechanize_rate === 'string') {
-          // 使用 replace('%', '') 去掉百分号
-          // 使用 parseFloat() 将字符串转换为数字
-          projectData.mechanize_rate = parseFloat(projectData.mechanize_rate.replace('%', ''));
-        }
-        // ================== 核心修改结束 ==================
-
-        // 3. 确保省份列表已加载（含 areaCode 映射）
-        await this.loadProvinces();
-
-        // 4. 省份名称 -> 编码
-        const targetProvince = this.provinceOptions.find(item => item.label === projectData.province);
-        const provinceCode = targetProvince ? targetProvince.value : '';
-        if (!provinceCode) {
-          Message.warning(`未找到“${projectData.province}”对应的编码，请手动选择`);
-          this.addOrEditForm = { ...projectData }; // 这里也会使用处理后的数据
-          this.addOrEditDialogVisible = true;
-          return;
-        }
-
-        // 5. 用编码加载城市列表
-        await this.loadCities(provinceCode);
-        // 城市名称 -> 编码
-        const targetCity = this.cityOptions.find(item => item.label === projectData.city);
-        const cityCode = targetCity ? targetCity.value : '';
-
-        // 6. 用编码加载区县列表
-        await this.loadDistricts(cityCode);
-        // 区县名称 -> 编码
-        const targetCounty = this.districtOptions.find(item => item.label === projectData.county);
-        const countyCode = targetCounty ? targetCounty.value : '';
-
-        // 7. 表单赋值（此时 projectData.mechanize_rate 已经是数字 80 了）
-        this.addOrEditForm = {
-          ...projectData,
-          province: provinceCode,
-          city: cityCode,
-          county: countyCode
-        };
-
-        this.addOrEditDialogVisible = true;
-        this.$nextTick(() => this.$refs.addOrEditFormRef?.clearValidate());
-      } catch (error) {
-        console.error('编辑失败：', error);
-        Message.error('编辑失败');
-      }
-    },
-
-
-    // 提交表单
-    async handleSubmit() {
-
-      const valid = await this.$refs.addOrEditFormRef?.validate()
-      if (!valid) return
-
-
-      // 处理机械化率：添加%符号
-      if (this.addOrEditForm.mechanize_rate) {
-        this.addOrEditForm.mechanize_rate = `${this.addOrEditForm.mechanize_rate}%`
-      }
-
-      this.submitLoading = true
-      try {
-        let res = this.isAdd ? await addProject(this.addOrEditForm) : await updateProject(this.addOrEditForm)
-        if (res.code === 200) {
-          Message.success(this.isAdd ? '新增项目成功' : '编辑项目成功')
-          this.addOrEditDialogVisible = false
-          this.getProjectListData()
-        } else {
-          Message.error(res.message || (this.isAdd ? '新增项目失败' : '编辑项目失败'))
-        }
-      } catch (error) {
-        //Message.error('网络错误，操作失败')
-      } finally {
-        this.submitLoading = false
-      }
-    },
-
-    // 删除工程
-    async handleDelete(id) {
-      try {
-        const res = await delProject(id)
-        if (res.code === 200) {
-          Message.success('删除项目成功')
-          this.getProjectListData()
-        } else {
-          Message.error(res.message || '删除项目失败')
-        }
-      } catch (error) {
-        Message.error('删除项目失败')
-      }
-    },
-
-    // 批量删除 - 修复后的方法
-    async handleBatchDelete() {
-      if (this.selectedRows.length === 0) {
-        Message.warning('请选择要删除的项目')
+    handleNumberInput(val, vm, field, options = {}) {
+      // 核心修复1：校验vm有效性，避免调用内部方法时报错
+      if (!vm || typeof vm.$nextTick !== 'function' || typeof vm.$set !== 'function') {
+        console.warn('handleNumberInput: 无效的Vue实例', vm)
         return
       }
 
-      try {
-        await this.$confirm(
-          `确定删除选中的 ${this.selectedRows.length} 个项目吗？`,
-          '提示',
-          {
-            type: 'warning',
-            confirmButtonText: '确定',
-            cancelButtonText: '取消'
-          }
-        )
+      // 默认配置
+      const { decimalLimit = 2, allowZero = true } = options
+      // 特殊处理：单独输入e/E直接重置为0（核心拦截点1）
+      if (val === 'e' || val === 'E' || val === 'ｅ' || val === 'Ｅ') {
+        this.setNestedField(vm, field, '0')
+        return
+      }
+      // 核心修复2：过滤非法字段名（避开$/_开头的内部属性）
+      if (!field || typeof field !== 'string' || field.includes('__ob__') || field.startsWith('$') || field.startsWith('_')) {
+        console.warn('handleNumberInput: 非法字段名', field)
+        return
+      }
 
-        const ids = this.selectedRows.map(row => row.id)
-        const res = await delProjectBatch(ids)
-
-        if (res.code === 200) {
-          Message.success(`成功删除 ${this.selectedRows.length} 个项目`)
-          this.getProjectListData()
-          this.selectedRows = [] // 清空选中状态
-        } else {
-          Message.error(res.message || '批量删除失败')
-        }
-      } catch (error) {
-        if (error !== 'cancel') {
-          Message.error('批量删除失败')
+      // 步骤0：禁止数字常量（科学计数法、十六进制、Infinity、NaN等）
+      let valStr = ''
+      if (val !== '' && val !== null && val !== undefined) {
+        valStr = val.toString().toLowerCase()
+        console.log(valStr)
+        const invalidPattern = /(e|0x|infinity|nan)/
+        if (invalidPattern.test(valStr)) {
+          const emptyValue = allowZero ? '0' : ''
+          this.setNestedField(vm, field, emptyValue)
+          return
         }
       }
+
+      // 空值处理
+      if (val === '' || val === null || val === undefined) {
+        const emptyValue = allowZero ? '0' : ''
+        this.setNestedField(vm, field, emptyValue)
+        return
+      }
+
+      // 步骤1：移除所有非数字和非小数点的字符
+      let newValue = valStr.replace(/[^0-9.]/g, '')
+
+      // 步骤2：禁止负数（若有负号直接重置）
+      if (newValue.includes('-')) {
+        newValue = allowZero ? '0' : ''
+      }
+
+      // 步骤3：处理前置0
+      if (newValue.indexOf('.') === -1) {
+        // 无小数点：纯数字去前置0
+        newValue = Number(newValue).toString()
+        // 处理 Number(0000) → '0' 的情况
+        if (newValue === '0' && !allowZero) {
+          newValue = ''
+        }
+      } else {
+        // 有小数点：仅清理整数部分前置0
+        const [integerPart, decimalPart] = newValue.split('.')
+        const cleanInteger = integerPart ? Number(integerPart).toString() : '0'
+        // 拼接小数部分（保留不超过限制位数）
+        const limitedDecimal = decimalPart.slice(0, decimalLimit)
+        newValue = `${cleanInteger}.${limitedDecimal}`
+        // 处理特殊情况：0. → 0 或 空
+        if (newValue.endsWith('.')) {
+          newValue = allowZero ? cleanInteger : (cleanInteger === '0' ? '' : cleanInteger)
+        }
+      }
+
+      // 步骤4：限制小数位数（兜底处理）
+      if (newValue.indexOf('.') !== -1) {
+        const [intPart, decPart] = newValue.split('.')
+        if (decPart.length > decimalLimit) {
+          newValue = `${intPart}.${decPart.slice(0, decimalLimit)}`
+        }
+      }
+
+      // 步骤5：不允许0的情况，清空0值
+      if (!allowZero && newValue === '0') {
+        newValue = ''
+      }
+
+      // 核心修复3：安全设置嵌套字段（从$data开始，避开内部属性）
+      this.setNestedField(vm, field, newValue)
     },
 
-    // 关闭对话框
-    handleDialogClose() {
-      this.isView = false
-      this.$refs.addOrEditFormRef?.clearValidate()
-    },
+    // 新增：安全设置嵌套字段的辅助方法（核心解决__ob__警告）
+    setNestedField(vm, field, value) {
+      const fieldArr = field.split('.')
+      // 从$data开始解析（仅访问用户定义的data属性，避开Vue内部属性）
+      let target = vm.$data
 
+      // 逐层初始化嵌套字段（避免访问到__ob__）
+      for (let i = 0; i < fieldArr.length - 1; i++) {
+        const key = fieldArr[i]
+        // 跳过内部属性
+        if (key.startsWith('$') || key.startsWith('_') || key === '__ob__') continue
+        // 若层级不存在，初始化空对象（保证响应式）
+        if (!target[key] || typeof target[key] !== 'object') {
+          vm.$set(target, key, {})
+        }
+        target = target[key]
+      }
+
+      // 最终赋值（保证响应式）
+      const finalKey = fieldArr[fieldArr.length - 1]
+      if (finalKey && !finalKey.startsWith('$') && !finalKey.startsWith('_') && finalKey !== '__ob__') {
+        vm.$nextTick(() => {
+          vm.$set(target, finalKey, value)
+        })
+      }
+    },
+    // 重置搜索
+    onReset() {
+      this.$refs.searchFormRef.resetFields()
+      this.searchParams = {
+        pageNum: 1,
+        pageSize: 10,
+        pro_name: '',
+        project_type: '',
+        project_status: '',
+        voltage: ''
+      }
+      this.getProjectListData()
+    },
     // 分页大小改变
     handleSizeChange(val) {
       this.searchParams.pageSize = val
       this.getProjectListData()
     },
-
-    // 当前页码改变
+    // 页码改变
     handleCurrentChange(val) {
       this.searchParams.pageNum = val
       this.getProjectListData()
+    },
+    // 选择行改变
+    handleSelectionChange(val) {
+      this.selectedRows = val
+    },
+    // 新增
+    handleAdd() {
+      this.isAdd = true
+      this.dialogTitle = '新增项目'
+      this.resetForm()
+      this.addOrEditDialogVisible = true
+    },
+    // 编辑
+    handleEdit(row) {
+      this.isAdd = false
+      this.dialogTitle = '编辑项目'
+      this.addOrEditForm = { ...row }
+      this.addOrEditDialogVisible = true
+    },
+    // 删除确认
+    handleDeleteConfirm(id) {
+      this.$confirm('确定删除该项目吗？', '提示', {
+        type: 'warning',
+        confirmButtonText: '确定',
+        cancelButtonText: '取消'
+      }).then(() => {
+        try {
+          delProject(id)
+          this.getProjectListData()
+          // 实际替换为批量删除接口
+          this.$message.success('删除成功')
+
+        } catch (e) {
+          this.$message.error('删除失败')
+        }
+      })
+    },
+    // 批量删除
+    handleBatchDelete() {
+      this.$confirm('确定删除选中的项目吗？', '提示', { type: 'warning' }).then(async() => {
+        try {
+          const ids = this.selectedRows.map(item => item.id)
+          delProjectBatch(ids)
+          // 实际替换为批量删除接口
+          this.$message.success('批量删除成功')
+          this.getProjectListData()
+        } catch (e) {
+          this.$message.error('批量删除失败')
+        }
+      })
+    },
+    // 导出
+    handleExport() {
+      this.$message.success('导出成功')
+    },
+    // 提交表单
+    async handleSubmit() {
+      try {
+        // 1. 先禁用提交按钮，防止重复点击
+        this.submitLoading = true
+
+        // 2. 表单校验（转为Promise，适配async/await）
+        const valid = await new Promise((resolve) => {
+          this.$refs.addOrEditFormRef.validate((isValid) => {
+            resolve(isValid)
+          })
+        })
+
+        // 3. 校验失败直接返回
+        if (!valid) {
+          this.$message.error('表单校验失败，请检查必填项')
+          return // 终止后续逻辑
+        }
+
+        // 4. 调用接口（await等待返回结果）
+        let res
+        if (this.isAdd) {
+          res = await addProject(this.addOrEditForm) // 新增接口
+        } else {
+          res = await updateProject(this.addOrEditForm) // 编辑接口
+        }
+
+        // 5. 接口返回结果判断（根据实际后端返回格式调整）
+        if (res && (res.code === 200 || res.success)) {
+          this.$message.success(this.isAdd ? '新增成功' : '编辑成功')
+          this.addOrEditDialogVisible = false
+          await this.getProjectListData() // 刷新列表
+        } else {
+          // 接口返回失败（如业务校验不通过）
+          this.$message.error(res?.msg || (this.isAdd ? '新增失败' : '编辑失败'))
+        }
+      } catch (e) {
+        // 捕获所有异常：接口报错、网络错误、代码异常等
+        console.error('提交表单异常：', e)
+        this.$message.error(e?.response?.data?.msg || '操作失败，请稍后重试')
+      } finally {
+        // 无论成功/失败，最终恢复加载状态
+        this.submitLoading = false
+      }
+    },
+    // 关闭弹窗
+    handleDialogClose() {
+      this.resetForm()
+    },
+    // 重置表单
+    resetForm() {
+      this.addOrEditForm = {
+        pro_code: '',
+        pro_name: '',
+        construction_unit: '',
+        project_source: '',
+        project_type: '',
+        project_amount: '',
+        project_address: '',
+        actual_start_date: '',
+        actual_end_date: '',
+        project_status: '',
+        voltage: '',
+        substation_capacity: '',
+        line_length: '',
+        remark: ''
+      }
+      this.$nextTick(() => {
+        this.$refs.addOrEditFormRef?.clearValidate()
+      })
+    },
+    // 获取状态标签类型
+    getStatusTagType(status) {
+      const typeMap = {
+        '1': 'info',
+        '2': 'primary',
+        '3': 'success',
+        '4': 'warning'
+      }
+      return typeMap[status] || 'default'
     }
   }
 }
 </script>
 
-<style lang="scss" scoped>
-/* 样式部分保持不变 */
-::v-deep .upload-tip .el-form-item__label {
-  color: transparent;
+<style scoped>
+/* 全局容器：禁止页面滚动 */
+.app-container {
+  background: #f5f7fa;
+  height: calc(99vh - 84px); /* 占满视口高度 */
+  box-sizing: border-box; /* 包含padding */
+  overflow: hidden; /* 核心：隐藏页面滚动条 */
+  display: flex;
+  flex-direction: column; /* 垂直布局，防止内容溢出 */
 }
 
-.el-pagination {
-  justify-content: flex-end;
-  padding: 5px 0;
+/* 搜索区 */
+.search-wrapper {
+  background: #fff;
+  padding: 16px;
+  border-radius: 4px;
+  margin-bottom: 16px;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+  flex-shrink: 0; /* 不压缩 */
 }
 
-::v-deep .el-pagination.is-background .el-pager li.is-active {
-  background-color: #3cb4a6;
-}
-
-::v-deep .el-form--inline .el-form-item {
-  margin-right: 6px;
-  width: 95%;
-}
-
-.img-list {
+.search-form {
   display: flex;
   align-items: center;
-
-  .img-items {
-    width: 100px;
-    height: 100px;
-    margin-right: 8px;
-    position: relative;
-
-    img {
-      width: 100%;
-      height: 100%;
-    }
-
-    .mask-img {
-      visibility: hidden;
-      position: absolute;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background-color: #000;
-      opacity: 0.5;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-      .delete-icon {
-        font-size: 20px;
-        cursor: pointer;
-        z-index: 9;
-        color: #fff;
-      }
-    }
-  }
-
-  .img-items:hover .mask-img {
-    visibility: visible;
-  }
+  flex-wrap: wrap;
+  gap: 12px;
 }
 
-.app-container{
-  overflow-y:unset;
-  background: #F0F0F0;
-}
-.app-container-content {
-  height: calc(100vh - 120px);
-
-  ::v-deep .el-dialog {
-    display: flex !important;
-    flex-direction: column !important;
-    margin: 0 !important;
-    position: absolute !important;
-    top: 50% !important;
-    left: 50% !important;
-    transform: translate(-50%, -50%) !important;
-    height: calc(100vh - 120px);
-
-    .el-dialog__body {
-      flex: 1;
-
-      padding: 20px 40px;
-    }
-
-    .dialog-content {
-      padding: 20px;
-    }
-  }
-}
-
-.search-box {
-  margin-bottom: 20px;
-  border-radius: 8px;
-  padding: 0;
-
-  ::v-deep .el-card__body {
-    padding: 20px !important;
-  }
-}
-
-.el-form-item--small.el-form-item {
-  margin-bottom: 0px;
-}
-
-.content-box {
-  border-radius: 8px;
-  //height: calc(100vh - 210px);
+/* 表格区：自适应剩余高度 */
+.table-wrapper {
+  background: #fff;
+  padding: 16px;
+  border-radius: 4px;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+  flex: 1; /* 占满剩余高度 */
   display: flex;
   flex-direction: column;
+  overflow: hidden; /* 确保容器不溢出 */
+}
+
+.table-header {
+  display: flex;
+  align-items: center;
+  margin-bottom: 12px;
+  flex-shrink: 0; /* 不压缩 */
+  justify-content: flex-end
+}
+
+/* 表格内容容器：自适应高度 + 隐藏滚动条（核心修复：overflow改为auto） */
+.table-content {
+  flex: 1; /* 占满剩余高度 */
+  overflow: auto; /* 关键：开启滚动，仅容器内滚动 */
+  /* 核心：隐藏滚动条 */
+  -ms-overflow-style: none; /* IE/Edge */
+  scrollbar-width: none; /* Firefox */
+  /* 关键：给sticky表头预留定位空间，防止表头被遮挡 */
+  position: relative;
+}
+
+/* Chrome/Safari 隐藏滚动条 */
+.table-content::-webkit-scrollbar {
+  display: none;
+}
+
+.project-table {
+  width: 100%;
+  --el-table-row-height: 60px; /* 适配两行文字高度 */
+  --el-table-header-text-color: #333;
+  --el-table-header-background-color: #fafafa;
+}
+
+/* 核心：表头固定（sticky吸顶）- 增强兼容性 */
+.project-table .el-table__header-wrapper {
+  position: sticky;
+  top: 0;
+  z-index: 10;
+  background-color: var(--el-table-header-background-color) !important;
+}
+
+/* 修复表头单元格边框 */
+.project-table .el-table__header th {
+  border-bottom: 1px solid #ebeef5;
+  border-right: 1px solid #ebeef5;
+  white-space: nowrap;
+}
+
+/* 修复elementUI表格默认的margin-top问题 */
+.project-table .el-table__header {
+  margin-top: 0 !important;
+}
+
+/* 单元格文字两行显示，超出省略 */
+.cell-text-ellipsis {
+  display: -webkit-box;
+  -webkit-line-clamp: 2; /* 限制显示2行 */
+  -webkit-box-orient: vertical;
   overflow: hidden;
-
-  ::v-deep .el-card__body {
-    display: flex !important;
-    flex-direction: column !important;
-    height: 100% !important;
-    padding: 20px;
-  }
-
-  .el-row:first-child {
-    margin-bottom: 16px;
-    flex-shrink: 0;
-
-    .el-col {
-      display: flex;
-      justify-content: flex-end;
-      align-items: center;
-      gap: 12px;
-    }
-  }
-
-  .table-container {
-    flex: 1;
-    overflow: hidden;
-    margin-bottom: 0;
-    min-height: 0;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .pagination-wrapper {
-    flex-shrink: 0;
-    padding-top: 6px;
-    margin-top: auto;
-    text-align: right;equipment-retire
-
-    ::v-deep .pagination-container {
-      padding: 0px 20px !important;
-      /* margin-bottom: 30px; */
-    }
-  }
-
-  ::v-deep .el-table {
-    &.el-table--striped .el-table__body {
-      tr.el-table__row--striped td {
-        background-color: #F6FBFA !important;
-      }
-    }
-
-    .el-table__header {
-      background: #E9F0EE;
-
-      th {
-        background: #E9F0EE !important;
-        color: #606266;
-        font-weight: 600;
-        height: 50px;
-      }
-    }
-
-    &.el-table--striped .el-table__body tr.el-table__row:hover > td.el-table__cell {
-      background-color: #CCF1E9 !important;
-    }
-  }
+  text-overflow: ellipsis;
+  line-height: 1.5;
+  max-height: 3em; /* 2行 * 1.5行高 = 3em */
+  word-break: break-all;
 }
 
-.dialog-table {
-  border-radius: 6px;
-  overflow: hidden;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-
-  ::v-deep .el-table {
-    border-radius: 6px;
-    overflow: hidden;
-
-    &.el-table--striped .el-table__body {
-      tr.el-table__row--striped td {
-        background-color: #F6FBFA !important;
-      }
-    }
-
-    .el-table__header {
-      background: #E9F0EE;
-
-      th {
-        background: #E9F0EE !important;
-        color: #606266;
-        font-weight: 600;
-        height: 45px;
-        font-size: 14px;
-        border-bottom: 2px solid #e4e7ed;
-      }
-    }
-
-    .el-table__body {
-      tr {
-        transition: all 0.2s ease;
-
-        &:hover {
-          background-color: #f8f9fa;
-        }
-
-        td {
-          padding: 12px 8px;
-          font-size: 13px;
-          border-bottom: 1px solid #f0f2f5;
-        }
-      }
-    }
-
-    &.el-table--striped .el-table__body tr.el-table__row:hover > td.el-table__cell {
-      background-color: #CCF1E9 !important;
-    }
-
-    &::before {
-      display: none;
-    }
-
-    &::after {
-      display: none;
-    }
-  }
-}
-
-.simple-dialog {
-  .el-dialog__header {
-    padding: 15px 20px;
-    border-bottom: 1px solid #eee;
-
-    .el-dialog__title {
-      font-size: 16px;
-      font-weight: 600;
-    }
-  }
-
-  .el-dialog__body {
-    padding: 20px;
-  }
-
-  .el-dialog__footer {
-    padding: 10px 20px;
-    border-top: 1px solid #eee;
-    text-align: right;
-  }
-}
-
-.simple-form {
-  .el-form-item {
-    margin-bottom: 15px;
-
-    .el-form-item__label {
-      color: #333;
-      padding-right: 10px;
-
-      &::before {
-        content: '*';
-        color: #ff4d4f;
-        margin-right: 4px;
-      }
-
-      &.no-required::before {
-        content: '';
-        margin-right: 0;
-      }
-    }
-  }
-
-  .el-input, .el-select, .el-date-picker {
-    width: 100%;
-  }
-
-  .el-textarea {
-    width: 100%;
-
-    &:focus {
-      border-color: #1890ff;
-    }
-  }
+/* 分页组件：固定右下 */
+.pagination-wrapper {
+  margin-top: 12px;
+  text-align: right; /* 水平居右 */
+  flex-shrink: 0; /* 不压缩 */
+  padding-right: 4px;
 }
 
+/* 弹窗样式 */
 .dialog-footer {
-  .cancel-btn {
-    margin-right: 10px;
-  }
-
-  .confirm-btn {
-    background-color: #2CBAB2;
-    border-color: #2CBAB2;
-    font-weight: 400;
-    font-size: 14px;
-    color: #FFFFFF;
-    text-align: center;
-    font-style: normal;
-    text-transform: none;
-  }
-}
-
-::v-deep .el-button--primary{
-  background-color: #2CBAB2;
-  border-color: #2CBAB2;
-  font-family: Microsoft YaHei, Microsoft YaHei;
-  font-weight: 400;
-  font-size: 14px;
-  color: #FFFFFF;
-  text-align: center;
-  font-style: normal;
-  text-transform: none;
-}
-
-::v-deep .el-button--warning.is-plain{
-  background-color: #2CBAB2;
-  border-color: #2CBAB2;
-  font-family: Microsoft YaHei, Microsoft YaHei;
-  font-weight: 400;
-  font-size: 14px;
-  color: #FFFFFF;
-  text-align: center;
-  font-style: normal;
-  text-transform: none;
-}
-
-::v-deep .el-button--text {
-  font-size: 16px;
-  font-weight: 400;
-  color: #2CBAB2;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-
-::v-deep .el-dialog__title{
-  font-family: Microsoft YaHei, Microsoft YaHei;
-  font-weight: bold;
-  font-size: 16px;
-  color: #3F3F3F;
-  line-height: 24px;
-  text-align: left;
-  font-style: normal;
-  text-transform: none;
-}
-
-::v-deep .el-form-item__label{
-  font-family: Microsoft YaHei, Microsoft YaHei;
-  font-weight: 400;
-  font-size: 16px;
-  color: #3F3F3F;
-  line-height: 24px;
   text-align: right;
-  font-style: normal;
-  text-transform: none;
+}
+
+/* 修复表格滚动时的tbody边框 */
+.project-table .el-table__body {
+  border-top: none; /* 避免和表头边框重复 */
+}
+
+/* hover行样式优化（不影响表头） */
+.project-table .el-table__row:hover {
+  background-color: #f5f7fa;
 }
 </style>

From 88907f1f049a2c90f7a3728aed1b2f7c0904fe05 Mon Sep 17 00:00:00 2001
From: bb_pan <max_163email@163.com>
Date: Fri, 23 Jan 2026 18:36:49 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E4=BD=93=E7=B3=BB=E8=A3=85=E5=A4=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/Navbar.vue           |   7 +-
 src/views/search/systemEquipment/index.vue | 621 +++++++++++++++++++++
 2 files changed, 627 insertions(+), 1 deletion(-)
 create mode 100644 src/views/search/systemEquipment/index.vue

diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index ffafeac7..df3debbd 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -483,7 +483,7 @@ export default {
     font-family: Microsoft YaHei, Microsoft YaHei;
     font-weight: 400;
     font-size: 14px;
-    color: #2cbab2;
+    color: #095A4D;
     line-height: 30px;
 
     .list-box {
@@ -498,6 +498,10 @@ export default {
     width: 100%;
     display: flex;
     align-items: center;
+    span {
+      color: #095A4D;
+      font-weight: 800;
+    }
   }
   .menu-title {
     width: 100%;
@@ -507,6 +511,7 @@ export default {
 
     // 移入效果
     &:hover {
+      color: #2CBAB2;
       background: rgba(44, 186, 178, 0.1);
       border-radius: 4px;
     }
diff --git a/src/views/search/systemEquipment/index.vue b/src/views/search/systemEquipment/index.vue
new file mode 100644
index 00000000..5380fcff
--- /dev/null
+++ b/src/views/search/systemEquipment/index.vue
@@ -0,0 +1,621 @@
+<template>
+  <div class="mindmap-wrapper">
+    <vue-org-tree
+      v-if="treeReady"
+      ref="orgTree"
+      :treeData="treeData"
+      :horizontal="false"
+      :collapsable="true"
+      :render-content="renderContent"
+    />
+  </div>
+</template>
+
+<script>
+import VueOrgTree from 'vue-org-tree'
+
+export default {
+  name: 'SystemEquipment',
+  components: { VueOrgTree },
+  data() {
+    return {
+      treeReady: false,
+      treeData: {
+        name: '国家电网有限公司输变电工程机械化施工装备体系',
+        expand: true,
+        children: [
+          {
+            name: '架空输电线路工程',
+            expand: true,
+            children: [
+              {
+                name: '临时道路修筑',
+                expand: true,
+                children: [
+                  { name: '道路修筑', children: [{ name: '道路修筑装备', children: [{ name: '清障开路车' }] }] },
+                  {
+                    name: '道路建设',
+                    children: [
+                      { name: '机械化路搭设装备', children: [{ name: '路面铺收车' }, { name: '滩涂通道板' }] },
+                      { name: '机械化桥搭设装备', children: [{ name: '桥梁架收车' }, { name: '动力舟桥' }] },
+                      { name: '机械化平台措设装备', children: [{ name: '作业浮箱' }] },
+                    ],
+                  },
+                ],
+              },
+              {
+                name: '物料运输',
+                expand: true,
+                children: [
+                  {
+                    name: '物料运输设备',
+                    children: [
+                      { name: '地面运输装备', children: [{ name: '履带式运输车' }] },
+                      { name: '架空运输装备', children: [{ name: '货运索道' }, { name: '轨道式运输车' }] },
+                      {
+                        name: '空中运输装备',
+                        children: [
+                          { name: '有人直升机' },
+                          { name: '重载无人机' },
+                          { name: '系留气球' },
+                          { name: '动力飞艇' },
+                        ],
+                      },
+                    ],
+                  },
+                ],
+              },
+              {
+                name: '基础施工',
+                expand: true,
+                children: [
+                  {
+                    name: '基坑开挖',
+                    children: [
+                      {
+                        name: '岩石锚杆钻机(适用孔径90-150mm)',
+                        children: [{ name: '分体式岩石锚杆钻机' }, { name: '一体式岩石锚杆钻机' }],
+                      },
+                      {
+                        name: '微型桩钻机(适用孔径200-400mm)',
+                        children: [
+                          { name: '分体式微型桩钻机' },
+                          { name: '轮步式作业平台' },
+                          { name: '微型桩潜孔锤钻机' },
+                        ],
+                      },
+                      {
+                        name: '挖孔桩钻机(适用孔径600-3200mm)',
+                        children: [{ name: '分体式挖孔桩钻机' }, { name: '电建钻机' }, { name: '深基坑作业一体机' }],
+                      },
+                      {
+                        name: '螺旋锚钻机',
+                        children: [{ name: '螺旋锚钻机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '钢筋笼制作',
+                    children: [
+                      {
+                        name: '钢筋笼制作装置',
+                        children: [{ name: '钢筋笼立式制作装置' }, { name: '钢筋笼卧式制作装置' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '泥凝土浇筑',
+                    children: [
+                      {
+                        name: '混凝土浇筑装备',
+                        children: [{ name: '混凝土罐车' }, { name: '混凝土泵车' }, { name: '基础养护装置' }],
+                      },
+                    ],
+                  },
+                ],
+              },
+              {
+                name: '组塔施工',
+                expand: true,
+                children: [
+                  { name: '塔材组片', children: [{ name: '塔材组片装置', children: [{ name: '塔材组片装置' }] }] },
+                  {
+                    name: '塔材吊装',
+                    children: [
+                      { name: '流动式起重机', children: [{ name: '全地面起重机' }, { name: '履带式起重机' }] },
+                      {
+                        name: '固定式落地物杆',
+                        children: [
+                          { name: '悬浮物杆' },
+                          { name: '落地摇臂抱杆' },
+                          { name: '落地平壁抱杆' },
+                          { name: '四柱抱杆' },
+                        ],
+                      },
+                      {
+                        name: '移动式落地抱杆',
+                        children: [{ name: '履带式落地抱杆' }, { name: '轮步式落地抱杆' }],
+                      },
+                    ],
+                  },
+                  { name: '塔材紧固', children: [{ name: '塔材紧固装备', children: [{ name: '螺栓紧固机器人' }] }] },
+                ],
+              },
+              {
+                name: '架线施工',
+                expand: true,
+                children: [
+                  {
+                    name: '跨越施工',
+                    children: [
+                      { name: '固定式跨越架', children: [{ name: '金属格构式跨越架' }, { name: '悬索式跨越架' }] },
+                      {
+                        name: '移动式跨越架',
+                        children: [{ name: '伞形跨越架' }, { name: '羊角跨越架' }, { name: '照明系统' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '导地线展放',
+                    children: [
+                      {
+                        name: '导地线展放装备',
+                        children: [{ name: '多旋翼无人机' }, { name: '牵引机' }, { name: '张力机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '紧线挂线',
+                    children: [
+                      {
+                        name: '紧线挂线装备',
+                        children: [{ name: '电动紧线机' }, { name: '弧垂监测机器人' }, { name: '自动压接机' }],
+                      },
+                    ],
+                  },
+                  { name: '附件安装', children: [{ name: '附件安装装备', children: [{ name: '间隔棒安装机器人' }] }] },
+                ],
+              },
+            ],
+          },
+          {
+            name: '变电站工程',
+            expand: true,
+            children: [
+              {
+                name: '变电土建',
+                expand: true,
+                children: [
+                  {
+                    name: '地基施工',
+                    children: [
+                      {
+                        name: '地基施工装备',
+                        children: [
+                          { name: '履带式强夯机' },
+                          { name: '压密注浆机' },
+                          { name: '挖掘机' },
+                          { name: '推土机' },
+                          { name: '振动压路机' },
+                        ],
+                      },
+                    ],
+                  },
+                  {
+                    name: '桩基础施工',
+                    children: [
+                      {
+                        name: '装配式基础施工装备',
+                        children: [{ name: '液压式压桩机' }, { name: '轮胎式起重机' }],
+                      },
+                      {
+                        name: '现浇式基础施工装备',
+                        children: [{ name: '旋挖钻机' }, { name: '混凝土泵车' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '建筑物施工',
+                    children: [
+                      {
+                        name: '装配式建筑物施工装备',
+                        children: [
+                          { name: '轮胎式起重机' },
+                          { name: '剪叉式升降平台' },
+                          { name: '混凝土摊铺机' },
+                          { name: '地坪涂敷机器人' },
+                        ],
+                      },
+                      {
+                        name: '现浇式建筑物施工装备',
+                        children: [{ name: '塔式起重机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '构筑物施工',
+                    children: [
+                      {
+                        name: '装配式构筑物施工装备',
+                        children: [{ name: '预制围墙运输安装一体车' }, { name: '汽车起重机' }, { name: '曲臂升降车' }],
+                      },
+                      {
+                        name: '现浇式构筑物施工装备',
+                        children: [{ name: '混凝土搅拌运输车' }, { name: '混凝土泵车' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '构支架施工',
+                    children: [
+                      {
+                        name: '构支架施工装备',
+                        children: [{ name: '汽车起重机' }, { name: '升降工作平台' }],
+                      },
+                    ],
+                  },
+                ],
+              },
+              {
+                name: '电气安装',
+                expand: true,
+                children: [
+                  {
+                    name: '一次设备施工',
+                    children: [
+                      {
+                        name: '气体绝缘类设备安装装备',
+                        children: [
+                          { name: 'GIS运输就位装置' },
+                          { name: 'GIS无尘化安装系统' },
+                          { name: 'GIS气露监测装置' },
+                          { name: 'GIS气室内检机器人' },
+                        ],
+                      },
+                      {
+                        name: '油绝缘类设备安装装备',
+                        children: [
+                          { name: '变电站油气处理集中控制系统' },
+                          { name: '主设备安装智能感知装置' },
+                          { name: '低电流短路法加热装置' },
+                        ],
+                      },
+                    ],
+                  },
+                  {
+                    name: '二次设备施工',
+                    children: [
+                      {
+                        name: '屏柜安装装备',
+                        children: [{ name: '屏柜搬运机' }],
+                      },
+                      {
+                        name: '二次电缆安装装备',
+                        children: [
+                          { name: '电缆支架安装机器人' },
+                          { name: '二次线缆双端协作机器人' },
+                          { name: '二次电缆自动敷设机器人' },
+                        ],
+                      },
+                    ],
+                  },
+                  {
+                    name: '试验调试',
+                    children: [
+                      {
+                        name: '变压器电气试验装置',
+                        children: [{ name: '变压器一体化检测装置' }],
+                      },
+                      {
+                        name: '耐压试验装置',
+                        children: [{ name: 'GIS耐压试验平台' }, { name: 'GIS同频同相耐压试验装置' }],
+                      },
+                      {
+                        name: '局放试验装置',
+                        children: [{ name: '变压器局放试验平台' }, { name: '数模一体继保测试仪' }],
+                      },
+                      {
+                        name: '继保调试(通用)装置',
+                        children: [{ name: '监控信息一体化自动验收装置' }, { name: '三相通流压综合测试仪' }],
+                      },
+                      {
+                        name: '继保调试(智能站)装置',
+                        children: [{ name: '继电保护定值校核仪' }, { name: '数字量继保测试仪' }],
+                      },
+                      {
+                        name: '光缆调试装置',
+                        children: [{ name: '光纤测试仪' }],
+                      },
+                    ],
+                  },
+                ],
+              },
+            ],
+          },
+          {
+            name: '电缆（海缆）工程',
+            expand: true,
+            children: [
+              {
+                name: '电缆土建施工',
+                expand: true,
+                children: [
+                  {
+                    name: '基坑（槽）施工',
+                    children: [
+                      {
+                        name: '直埋装备',
+                        children: [{ name: '开/挖槽机' }],
+                      },
+                      {
+                        name: '排管、电缆沟装备',
+                        children: [{ name: '反铲挖掘机' }, { name: '装载机' }, { name: '钢板压拔桩机' }],
+                      },
+                      {
+                        name: '明挖隧道装备',
+                        children: [
+                          { name: '伸缩臂挖掘机' },
+                          { name: '锚杆钻机' },
+                          { name: '混凝土喷射机' },
+                          { name: 'U型盾构' },
+                        ],
+                      },
+                      {
+                        name: '暗挖/顶管/盾构工井装备',
+                        children: [{ name: '门式起重机' }, { name: '成槽机' }, { name: '铣槽机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '通道掘进施工',
+                    children: [
+                      {
+                        name: '浅埋暗挖隧道装备',
+                        children: [
+                          { name: '悬臂式隧道掘进机' },
+                          { name: '注浆机' },
+                          { name: '锚杆台车' },
+                          { name: '水磨取芯掘进机' },
+                        ],
+                      },
+                      {
+                        name: '钻爆法隧道装备',
+                        children: [{ name: '凿岩台车' }],
+                      },
+                      {
+                        name: '顶管隧道装备',
+                        children: [
+                          { name: '圆形泥水/土压/气压顶管机' },
+                          { name: '岩石顶管机' },
+                          { name: '微型顶管机' },
+                          { name: '矩形/马蹄形顶管机' },
+                          { name: '顶盾机' },
+                          { name: '中继间' },
+                        ],
+                      },
+                      {
+                        name: '盾构隧道装备',
+                        children: [{ name: '盾构机' }, { name: '隧道掘进机(TBM)' }],
+                      },
+                      {
+                        name: '定向钻管道装备',
+                        children: [{ name: '水平定向钻机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '通道结构施工',
+                    children: [
+                      {
+                        name: '明挖隧道/管廊结构装备',
+                        children: [{ name: '铝合金滑动模板' }],
+                      },
+                      {
+                        name: '暗挖隧道结构装备',
+                        children: [{ name: '二衬台车' }],
+                      },
+                      {
+                        name: '隧道隔板装备',
+                        children: [{ name: '预制隔板拼装机' }],
+                      },
+                      {
+                        name: '支架装备',
+                        children: [{ name: '支架安装机器人' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '通道结构检测',
+                    children: [
+                      {
+                        name: '超前探测装置',
+                        children: [{ name: '水平定向钻机' }, { name: '地质钻机' }],
+                      },
+                      {
+                        name: '结构检测装置',
+                        children: [{ name: '隧道检测机器人' }, { name: '管道检测机器人' }, { name: '测绘机器人' }],
+                      },
+                      {
+                        name: '智能化监测装置',
+                        children: [{ name: '电缆隧道巡检机器人' }],
+                      },
+                    ],
+                  },
+                ],
+              },
+              {
+                name: '电缆GIL敷设',
+                expand: true,
+                children: [
+                  {
+                    name: '电缆/GIL运输',
+                    children: [
+                      {
+                        name: '管廊/隧道装备',
+                        children: [{ name: 'GIL运输车' }, { name: '电缆牵引机' }, { name: '输送机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '电缆/GIL安装',
+                    children: [
+                      {
+                        name: '隧道装备',
+                        children: [
+                          { name: 'GIL安装装置' },
+                          { name: '电缆敷设成套装备' },
+                          { name: '电缆上架装置' },
+                          { name: '电缆加热保温车' },
+                        ],
+                      },
+                      {
+                        name: '工井排管装备',
+                        children: [{ name: '电缆输送机' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '电缆附件安装',
+                    children: [
+                      {
+                        name: '隧道装备',
+                        children: [{ name: '高压电缆预处理装置' }, { name: '电缆接头缠包机器人' }],
+                      },
+                    ],
+                  },
+                  {
+                    name: '电缆试验',
+                    children: [
+                      {
+                        name: '耐压试验装置',
+                        children: [{ name: '高压电缆GIS终端试验套筒' }, { name: '变频谐振耐压设备' }],
+                      },
+                      {
+                        name: '局放试验装置',
+                        children: [{ name: '同步分布式局部放电检测设备' }],
+                      },
+                      {
+                        name: '电缆线路参数测试装置',
+                        children: [{ name: '电缆线路参数测试仪' }],
+                      },
+                    ],
+                  },
+                ],
+              },
+              {
+                name: '海缆施工',
+                expand: true,
+                children: [
+                  {
+                    name: '海缆敷设',
+                    children: [
+                      {
+                        name: '路由勘测装备',
+                        children: [{ name: '路由勘测船' }, { name: '路由无人勘测船' }],
+                      },
+                      {
+                        name: '海缆退扭装备',
+                        children: [{ name: '电缆电动转盘' }],
+                      },
+                      {
+                        name: '敷设施工装备',
+                        children: [
+                          { name: '布缆机' },
+                          { name: '海缆敷设船' },
+                          { name: '埋设犁' },
+                          { name: '埋设犁牵引机' },
+                          { name: '门型吊架' },
+                          { name: '甲板储缆装置' },
+                        ],
+                      },
+                      {
+                        name: '辅助施工装备',
+                        children: [
+                          { name: '施工拖带船' },
+                          { name: '施工抛/起锚船' },
+                          { name: '施工警戒船' },
+                          { name: '水下机器人' },
+                        ],
+                      },
+                    ],
+                  },
+                ],
+              },
+            ],
+          },
+        ],
+      },
+    }
+  },
+  mounted() {
+    this.expandAll(this.treeData)
+    this.treeReady = true
+  },
+  methods: {
+    renderContent(h, data) {
+      return h('div', { class: 'custom-node' }, data.name)
+    },
+    expandAll(node) {
+      console.log('🚀 ~ node:', node)
+      if (!node) return
+
+      // 确保是响应式的
+      this.$set(node, 'expand', true)
+
+      if (node.children && node.children.length) {
+        node.children.forEach((child) => {
+          this.expandAll(child)
+        })
+      }
+    },
+  },
+}
+</script>
+
+<style scoped>
+.mindmap-wrapper {
+  width: 100%;
+  height: 90vh;
+  overflow: auto;
+  background: #f7f9fc;
+  padding: 20px;
+  display: flex;
+  justify-content: center;
+}
+
+/* 节点卡片样式 */
+.custom-node {
+  padding: 8px 14px;
+  border-radius: 6px;
+  background: #ffffff;
+  border: 1px solid #dcdfe6;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
+  font-size: 16px;
+  color: #303133;
+  white-space: nowrap;
+}
+
+/* 根节点突出显示 */
+::v-deep .vue-org-tree > .org-tree-node > .org-tree-node-label .custom-node {
+  background: #144f99;
+  color: #fff;
+  border-color: #409eff;
+  font-weight: bold;
+}
+
+/* 连线颜色 */
+.org-tree-node:before,
+.org-tree-node:after {
+  border-color: #c0c4cc !important;
+}
+
+.org-tree-node-children {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.org-tree-node {
+  margin-right: 60px;
+}
+</style>

From e17ce901e24f1eeccf796fee44077bcba19dae8e Mon Sep 17 00:00:00 2001
From: bb_pan <max_163email@163.com>
Date: Fri, 23 Jan 2026 18:37:13 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E4=BD=93=E7=B3=BB=E8=A3=85=E5=A4=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/package.json b/package.json
index 5656fc1c..15bc1540 100644
--- a/package.json
+++ b/package.json
@@ -71,6 +71,7 @@
     "vue-cropper": "0.5.5",
     "vue-easy-print": "^0.0.8",
     "vue-meta": "2.4.0",
+    "vue-org-tree": "^0.1.0",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.0",