样式处理

src/components/CollapseNavigation/index.vue

@@ -52,9 +52,18 @@ const props = defineProps({
     type: Number,
     default: 0,
   },
+  // 折叠面板的 v-model 绑定值（用于自动展开折叠面板）
+  collapseActiveNames: {
+    type: Array,
+    default: null,
+  },
 });
 
-const emit = defineEmits(["update:activeItem", "navClick"]);
+const emit = defineEmits([
+  "update:activeItem",
+  "navClick",
+  "update:collapseActiveNames",
+]);
 
 const currentItem = ref("");
 const scrollContainerEl = ref(null);

src/styles/manage.less

@@ -383,3 +383,43 @@
   }
 }
 // ==========================设置定制化样式 end ==========================
+
+// ==========================表格双色条纹样式 start ==========================
+.table-stripe-colors {
+  border: 1px solid #ebeef5;
+
+  // 奇数行 1、3、5、7…
+  .odd-row {
+    background-color: #f5f5f5 !important;
+  }
+
+  // 偶数行 2、4、6、8…
+  .even-row {
+    background-color: #edf0f5 !important;
+  }
+
+  // 鼠标悬停
+  .el-table__body tr:hover > td {
+    background-color: #e8f4ff !important;
+  }
+
+  // 表头
+  .el-table__header-wrapper {
+    th {
+      background-color: #f0f2f5 !important;
+      color: #333;
+      font-weight: 600;
+      text-align: center;
+      border-color: #ebeef5;
+    }
+  }
+
+  // 表格主体单元格
+  .el-table__body-wrapper {
+    td {
+      border-color: #ebeef5;
+      padding: 8px 0;
+    }
+  }
+}
+// ==========================表格双色条纹样式 end ==========================

src/views/everydayPage/annualAdd.vue

@@ -6,13 +6,12 @@
         <div class="project-tab-content-wrapper">
           <div class="tab-content">
             <el-form label-width="150" :model="formData" :disabled="isPreview">
-              <el-collapse v-model="activeCollapse">
-                <!-- 项目基本信息：字段完全对齐数据库 -->
-                <el-collapse-item
-                  title="项目基本信息"
-                  name="项目基本信息"
-                  id="collapse-项目基本信息"
+              <el-collapse
+                v-model="activeCollapse"
+                v-collapse-nav="navigationItems"
               >
+                <!-- 项目基本信息：字段完全对齐数据库 -->
+                <el-collapse-item title="项目基本信息" name="项目基本信息">
                   <el-row :gutter="20">
                     <el-col :span="12">
                       <el-form-item label="项目信息" required>
@@ -96,12 +95,16 @@
                     </el-col>
 
                     <el-col :span="6">
-                      <el-form-item label="运营年限（年）">
+                      <el-form-item label="运营年限">
                         <el-input
                           v-model="formData.yynxn"
                           :min="0"
-                          placeholder="请输入运营年限（年）"
-                        />
+                          placeholder="请输入运营年限"
+                        >
+                          <template #suffix>
+                            <span>年</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
 
@@ -122,16 +125,20 @@
                       </el-form-item>
                     </el-col>
                     <el-col :span="6">
-                      <el-form-item label="项目建设期 (月)">
+                      <el-form-item label="项目建设期">
                         <el-input
                           v-model="formData.xmjsqy"
                           :min="0"
-                          placeholder="请输入项目建设期 (月)"
-                        />
+                          placeholder="请输入项目建设期"
+                        >
+                          <template #suffix>
+                            <span>月</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="6">
-                      <el-form-item label="项目流转状态（审批状态）">
+                      <el-form-item label="项目流转状态">
                         <CommonSelector
                           v-model="formData.projectLzType"
                           dictName="xmlzzt"
@@ -154,7 +161,6 @@
                 <el-collapse-item
                   title="国资委中央企业投资信息"
                   name="国资委中央企业投资信息"
-                  id="collapse-国资委中央企业投资信息"
                 >
                   <div class="tzxx">
                     <!-- 战略类A：按数据库字段补充所有表单项 -->
@@ -494,11 +500,7 @@
                   </div>
                 </el-collapse-item>
                 <!-- 最终分类情况：补充长文本输入框 -->
-                <el-collapse-item
-                  title="最终分类情况"
-                  name="最终分类情况"
-                  id="collapse-最终分类情况"
-                >
+                <el-collapse-item title="最终分类情况" name="最终分类情况">
                   <el-row :gutter="20">
                     <el-col :span="24">
                       <el-form-item label="最终分类情况说明">
@@ -512,12 +514,10 @@
                     </el-col>
                   </el-row>
                 </el-collapse-item>
-
                 <!-- 可研/决策信息（单位：万元）：独立表格，专属方法/数据源 -->
                 <el-collapse-item
                   title="可研/决策信息（单位：万元）"
                   name="可研/决策信息（单位：万元）"
-                  id="collapse-可研/决策信息（单位：万元）"
                 >
                   <el-table
                     :data="financialIndicators"
@@ -527,6 +527,7 @@
                     :header-cell-style="tableHeaderCellStyle"
                     :row-class-name="tableRowClassName"
                     row-key="serialNumber"
+                    class="table-stripe-colors"
                   >
                     <!-- 序号列 -->
                     <el-table-column
@@ -574,19 +575,20 @@
                           controls-position="right"
                           @change="handleFinancialChange(row)"
                           :disabled="isPreview"
+                          class="two-tone-input"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </template>
                     </el-table-column>
                   </el-table>
                 </el-collapse-item>
 
                 <!-- 年度投资计划：基础信息 -->
-                <el-collapse-item
-                  title="年度投资计划"
-                  name="年度投资计划"
-                  id="collapse-年度投资计划"
-                >
+                <el-collapse-item title="年度投资计划" name="年度投资计划">
                   <el-row :gutter="20">
                     <!-- 基础短字段：span12分栏 -->
                     <el-col :span="8">
@@ -611,7 +613,11 @@
                         <el-input
                           v-model="formData.ndTzMb"
                           placeholder="请输入年度投资目标"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="8">
@@ -622,26 +628,7 @@
                         />
                       </el-form-item>
                     </el-col>
-                    <!-- <el-col :span="6">
-                      <el-form-item label-width="240px" label="项目预计起始时间">
-                        <el-date-picker
-                          v-model="formData.xmkgsjyj"
-                          type="date"
-                          placeholder="请选择时间"
-                          value-format="YYYY-MM-DD"
-                        />
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="8">
-                      <el-form-item label-width="240px" label="项目预计完成时间">
-                        <el-date-picker
-                          v-model="formData.xmjgsjyj"
-                          type="date"
-                          placeholder="请选择时间"
-                          value-format="YYYY-MM-DD"
-                        />
-                      </el-form-item>
-                    </el-col> -->
+
                     <el-col :span="8">
                       <el-form-item
                         label-width="240px"
@@ -658,7 +645,7 @@
                     <el-col :span="8">
                       <el-form-item
                         label-width="240px"
-                        label="预计实现资本金内部收益率(%)"
+                        label="预计实现资本金内部收益率"
                       >
                         <el-input
                           v-model="formData.yjSxZbjNbsyl"
@@ -668,7 +655,11 @@
                           controls-position="right"
                           placeholder="请输入收益率"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>%</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="8">
@@ -787,7 +778,6 @@
                 <el-collapse-item
                   title="项目年度计划表格（单位：万元）"
                   name="项目年度计划表格（单位：万元）"
-                  id="collapse-项目年度计划表格（单位：万元）"
                 >
                   <div class="annualPlans">
                     <annualPlan
@@ -803,7 +793,6 @@
                 <el-collapse-item
                   title="项目年度计划(资金支付口径)"
                   name="项目年度计划(资金支付口径)"
-                  id="collapse-项目年度计划(资金支付口径)"
                 >
                   <el-row :gutter="20">
                     <el-col :span="6">
@@ -816,15 +805,16 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>%</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
 
                     <el-col :span="6">
-                      <el-form-item
-                        label-width="180px"
-                        label="年度计划总额(万元)"
-                      >
+                      <el-form-item label-width="180px" label="年度计划总额">
                         <el-input
                           v-model="formData.ndJhZe"
                           :min="0"
@@ -832,14 +822,15 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="6">
-                      <el-form-item
-                        label-width="180px"
-                        label="资本金-能建方(万元)"
-                      >
+                      <el-form-item label-width="180px" label="资本金-能建方">
                         <el-input
                           v-model="formData.zbjPtF"
                           :min="0"
@@ -847,14 +838,15 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="6">
-                      <el-form-item
-                        label-width="180px"
-                        label="资本金-外部股东(万元)"
-                      >
+                      <el-form-item label-width="180px" label="资本金-外部股东">
                         <el-input
                           v-model="formData.zbjWbGd"
                           :min="0"
@@ -862,11 +854,15 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="6">
-                      <el-form-item label-width="180px" label="债权融资(万元)">
+                      <el-form-item label-width="180px" label="债权融资">
                         <el-input
                           v-model="formData.zqRz"
                           :min="0"
@@ -874,14 +870,15 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                     <el-col :span="6">
-                      <el-form-item
-                        label-width="180px"
-                        label="回款再投入(万元)"
-                      >
+                      <el-form-item label-width="180px" label="回款再投入">
                         <el-input
                           v-model="formData.hkZtr"
                           :min="0"
@@ -889,12 +886,16 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
 
                     <el-col :span="6">
-                      <el-form-item label-width="180px" label="其他(万元)">
+                      <el-form-item label-width="180px" label="其他">
                         <el-input
                           v-model="formData.qt"
                           :min="0"
@@ -902,14 +903,18 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
 
                     <el-col :span="6">
                       <el-form-item
                         label-width="180px"
-                        label="我方仅指本单位出资(万元)"
+                        label="我方仅指本单位出资"
                       >
                         <el-input
                           v-model="formData.wfJzBdwCz"
@@ -918,7 +923,11 @@
                           controls-position="right"
                           placeholder="0.00"
                           style="width: 100%"
-                        />
+                        >
+                          <template #suffix>
+                            <span>万元</span>
+                          </template>
+                        </el-input>
                       </el-form-item>
                     </el-col>
                   </el-row>
@@ -927,7 +936,6 @@
                 <el-collapse-item
                   title="2026年参股单位出资情况修正(单位:万元)"
                   name="2026年参股单位出资情况修正(单位:万元)"
-                  id="collapse-2026年参股单位出资情况修正(单位:万元)"
                 >
                   <el-row :gutter="20">
                     <el-col :span="24">
@@ -973,7 +981,6 @@
     </div>
   </div>
 </template>
-
 <script setup>
 import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
 import { useRouter, useRoute } from "vue-router";
@@ -1052,25 +1059,8 @@ const router = useRouter();
 const route = useRoute();
 const { proxy } = getCurrentInstance();
 
-// ========== 导航配置 ==========
-// 定义所有折叠面板的导航信息
-const getNavigationItems = () => {
-  return [
-    { name: "项目基本信息", label: "项目基本信息" },
-    { name: "国资委中央企业投资信息", label: "国资委中央企业投资信息" },
-    { name: "最终分类情况", label: "最终分类情况" },
-    { name: "可研/决策信息（单位：万元）", label: "可研/决策信息" },
-    { name: "年度投资计划", label: "年度投资计划" },
-    { name: "项目年度计划表格（单位：万元）", label: "项目年度计划表格" },
-    { name: "项目年度计划(资金支付口径)", label: "资金支付口径" },
-    {
-      name: "2026年参股单位出资情况修正(单位:万元)",
-      label: "参股单位出资修正",
-    },
-  ];
-};
-
-const navigationItems = ref(getNavigationItems());
+// ========== 导航配置（由 v-collapse-nav 指令自动生成） ==========
+const navigationItems = ref([]);
 
 // 导航点击处理
 const handleNavClick = (item) => {
@@ -1753,7 +1743,6 @@ onMounted(() => {
   }
 });
 </script>
-
 <style lang="less" scoped>
 // 布局容器
 .project-tab-content-wrapper {
@@ -1793,32 +1782,41 @@ onMounted(() => {
   }
 }
 
-// 可研/决策信息表格样式
-:deep(.el-table) {
-  // 偶数行样式
-  .even-row {
-    background-color: #ffffff;
+// 双拼色输入框样式
+:deep(.two-tone-input) {
+  .el-input__wrapper {
+    border-radius: 0;
+    box-shadow: 0 0 0 1px #dcdfe6 inset;
+    padding: 0 8px;
   }
-
-  // 奇数行样式
-  .odd-row {
-    background-color: #fafafa;
+  .el-input__inner {
+    background-color: transparent !important;
+    text-align: right;
+    padding-right: 45px;
+    color: #333;
   }
-
-  // 鼠标悬停效果
-  .el-table__body tr:hover > td {
-    background-color: #e8f4ff !important;
+  .el-input__suffix {
+    position: absolute;
+    right: 8px;
+    top: 50%;
+    transform: translateY(-50%);
+    color: #606266;
+    font-size: 14px;
+    pointer-events: none;
   }
-
-  // 表格边框颜色
-  .el-table__body-wrapper,
-  .el-table__header-wrapper {
-    border: 1px solid #ebeef5;
+  &.is-focus .el-input__wrapper {
+    box-shadow: 0 0 0 1px #409eff inset;
   }
+}
 
-  // 单元格样式
-  td {
-    border-color: #ebeef5;
+.add-project-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 16px 0;
+  .header-right {
+    display: flex;
+    gap: 12px;
   }
 }
 </style>

src/views/everydayPage/annualPlan.vue

@@ -6,7 +6,7 @@
       <table class="investment-table">
         <!-- 表头行 -->
         <thead>
-          <tr style="background: #f5f7fa">
+          <tr>
             <td class="first-col" colspan="5">指标名称</td>
             <td>合计</td>
           </tr>
@@ -151,14 +151,7 @@
 
     <!-- 右侧：Element 时间输入表格（绑定**内部响应式数据**，不再直接绑props） -->
     <div class="right-table">
-      <el-table
-        :data="tableData"
-        style="width: 100%"
-        border
-        :cell-style="tableCellStyle"
-        :row-style="{ height: '48px' }"
-        :header-row-style="{ height: '48px', background: '#f5f7fa' }"
-      >
+      <el-table :data="tableData" :row-class-name="tableRowClassName" border>
         <el-table-column
           v-for="time in validDynamicTimeList"
           :key="`time-col-${time}`"
@@ -201,7 +194,9 @@ const props = defineProps({
   dynamicTimeList: { type: Array, default: () => [] }, // 父组件必须传
   isPreview: { type: Boolean, default: false },
 });
-
+const tableRowClassName = ({ rowIndex }) => {
+  return rowIndex % 2 === 0 ? "even-row" : "odd-row";
+};
 const emit = defineEmits([
   "update:modelValue", // v-model双向绑定
   "handleAnnualPlanChange", // 原有业务事件
@@ -322,19 +317,31 @@ const getAllRowsTotal = () => {
   return total.toFixed(2);
 };
 
-// 合计行样式（保持不变）
-const tableCellStyle = ({ row }) =>
-  row?.isTotal ? { background: "#f5f7fa", fontWeight: "bold" } : {};
+// 表格单元格样式
+const tableCellStyle = ({ row, columnIndex }) => {
+  const baseStyle = {
+    border: "1px solid #ebeef5",
+  };
 
-// 调试日志（打印内部数据字段，确认是否保留）
-onMounted(() => {
-  if (tableData.value.length > 0) {
+  if (row.isTotal) {
+    return { ...baseStyle, background: "#f5f7fa", fontWeight: "bold" };
   }
-});
+  // 左边三列（序号、指标项、合计）使用 #f7faff 背景色
+  if (columnIndex === 0 || columnIndex === 1 || columnIndex === 2) {
+    return { ...baseStyle, background: "#f7faff" };
+  }
+  return baseStyle;
+};
 </script>
 
 <style scoped lang="scss">
-// 所有样式保持不变，仅优化input样式，确保能看见
+::v-deep .odd-row {
+  background-color: #f5f5f5 !important;
+}
+// 偶数行 2、4、6、8…
+::v-deep .even-row {
+  background-color: #edf0f5 !important;
+}
 .annual-plan-wrap {
   display: flex;
   align-items: flex-start;
@@ -368,24 +375,9 @@ onMounted(() => {
 .investment-table thead td {
   height: 48px;
   font-weight: bold;
-  background: #f7faff;
-}
-.first-col {
-  font-weight: bold;
-  // background-color: #f5f7fa;
-}
-.second-col {
-  // background-color: #f5f7fa;
-}
-.third-col {
-  font-weight: 500;
-  // background-color: #f5f7fa;
-}
-// 新增：第四列样式（计划投资回款等模块）
-.fourth-col {
-  // background-color: #f5f7fa;
-  font-weight: 500;
+  // background: #f7faff;
 }
+
 // 样式优化：移除不必要的隐藏，确保元素可见
 :deep(.el-table) {
   --el-table-border-color: #ebeef5;