fix(crm/contract/detail): 优化合同详情页表格交互与样式

1. 调整状态列宽度并修复选项值绑定语法
2. 重构操作列样式与保存按钮样式
3. 替换客户表格选中逻辑，改为行点击直接选中
4. 移除冗余的客户表格操作列，添加行悬停高亮样式

klp-ui/src/views/crm/contract/detail/index.vue

@@ -313,13 +313,13 @@
           </template>
         </el-table-column>
         <!-- 状态 -->
-        <el-table-column label="状态" prop="status" width="90" align="center">
+        <el-table-column label="状态" prop="status" width="100" align="center">
           <template slot-scope="scope">
             <el-select v-model="scope.row.status" size="small" class="editable-cell-pink" @change="saveRow(scope.row)">
-              <el-option label="草稿" value="0" />
+              <el-option label="草稿" :value="0" />
-              <el-option label="已生效" value="1" />
+              <el-option label="已生效" :value="1" />
-              <el-option label="已作废" value="2" />
+              <el-option label="已作废" :value="2" />
-              <el-option label="已完成" value="3" />
+              <el-option label="已完成" :value="3" />
             </el-select>
           </template>
         </el-table-column>
@@ -338,9 +338,16 @@
           </template>
         </el-table-column>
         <!-- 操作 -->
-        <el-table-column label="操作" width="80" fixed="right" align="center">
+        <el-table-column label="操作" width="90" fixed="right" align="center" class-name="operation-column">
           <template slot-scope="scope">
-            <el-button type="text" size="mini" @click="saveRow(scope.row)">保存</el-button>
+            <el-button
+              type="primary"
+              size="mini"
+              plain
+              icon="el-icon-check"
+              class="save-btn"
+              @click="saveRow(scope.row)"
+            >保存</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -388,7 +395,8 @@
         size="small"
         border
         highlight-current-row
-        @current-change="handleCustomerCurrentChange"
+        row-class-name="customer-selectable-row"
+        @row-click="handleCustomerRowClick"
         style="width: 100%"
         max-height="360"
       >
@@ -397,11 +405,6 @@
         <el-table-column label="联系方式" prop="contactWay" width="130" show-overflow-tooltip />
         <el-table-column label="地址" prop="address" min-width="160" show-overflow-tooltip />
         <el-table-column label="税号" prop="taxNumber" width="140" show-overflow-tooltip />
-        <el-table-column label="操作" width="70" align="center">
-          <template slot-scope="scope">
-            <el-button type="text" size="mini" @click="selectCustomer(scope.row)">选择</el-button>
-          </template>
-        </el-table-column>
       </el-table>
       <div style="margin-top: 8px; text-align: right;">
         <el-pagination
@@ -592,9 +595,9 @@ export default {
       })
     },
 
-    // 客户表格行高亮选中
+    // 客户表格行点击选中
-    handleCustomerCurrentChange(val) {
+    handleCustomerRowClick(row) {
-      this.selectedCustomer = val
+      this.selectCustomer(row)
     },
 
     // 选择客户并回填
@@ -772,6 +775,39 @@ export default {
   border-color: #4d6a8e !important;
 }
 
+/* 操作列样式 */
+.operation-column {
+  background-color: #f5f7fa;
+}
+
+.save-btn {
+  padding: 6px 12px;
+  font-size: 12px;
+}
+
+/* 客户选择表格行样式 */
+.customer-selectable-row {
+  cursor: pointer;
+  transition: background-color 0.2s ease;
+}
+
+.customer-selectable-row:hover {
+  background-color: #e6f7ff !important;
+}
+
+.customer-selectable-row.el-table__row--striped:hover {
+  background-color: #e6f7ff !important;
+}
+
+/* 客户选择表格当前行高亮 */
+::v-deep .el-table--enable-row-hover .el-table__body tr.customer-selectable-row:hover > td {
+  background-color: #e6f7ff !important;
+}
+
+::v-deep .el-table__body tr.customer-selectable-row.current-row > td {
+  background-color: #b3e0ff !important;
+}
+
 /* 筛选结果数量显示 */
 .result-count {
   margin-left: auto;