Prechádzať zdrojové kódy

fix: 给发票列表添加树形结构支持

xieyong 3 týždňov pred
rodič
commit
bebaf76504

+ 83 - 45
src/views/financialManage/invoiceManage/index.vue

@@ -12,6 +12,8 @@
         tool-class="ele-toolbar-form"
         :selection.sync="selection"
         :page-size="20"
+        row-key="id"
+        :tree-props="{ children: 'childrenList', hasChildren: 'hasChildren' }"
         @columns-change="handleColumnChange"
         :cache-key="cacheKeyUrl"
       >
@@ -39,50 +41,52 @@
         </template>
         <!-- 操作 -->
         <template v-slot:action="{ row }">
-          <el-link
-            type="primary"
-            :underline="false"
-            icon="el-icon-edit"
-            v-if="
-              (isNeed_process_is_close &&
-                [0, 3].includes(row.approvalStatus)) ||
-              !isNeed_process_is_close
-            "
-            @click="handleAddOrEditNew(row, 'update')"
-          >
-            修改
-          </el-link>
-          <el-link
-            type="primary"
-            :underline="false"
-            icon="el-icon-plus"
-            @click="sub(row)"
-            v-if="
-              isNeed_process_is_close && [0, 3].includes(row.approvalStatus)
-            "
-          >
-            提交
-          </el-link>
-          <el-popconfirm
-            class="ele-action"
-            title="确定要删除此信息吗?"
-            @confirm="remove([row.id])"
-            v-if="
-                  (isNeed_process_is_close &&
-                    [0, 3].includes(row.approvalStatus)) ||
-                  !isNeed_process_is_close
-                "
-          >
-            <template v-slot:reference>
-              <el-link
-                type="danger"
-                :underline="false"
-                icon="el-icon-delete"
-              >
-                删除
-              </el-link>
-            </template>
-          </el-popconfirm>
+          <template v-if="row._level === 0">
+            <el-link
+              type="primary"
+              :underline="false"
+              icon="el-icon-edit"
+              v-if="
+                (isNeed_process_is_close &&
+                  [0, 3].includes(row.approvalStatus)) ||
+                !isNeed_process_is_close
+              "
+              @click="handleAddOrEditNew(row, 'update')"
+            >
+              修改
+            </el-link>
+            <el-link
+              type="primary"
+              :underline="false"
+              icon="el-icon-plus"
+              @click="sub(row)"
+              v-if="
+                isNeed_process_is_close && [0, 3].includes(row.approvalStatus)
+              "
+            >
+              提交
+            </el-link>
+            <el-popconfirm
+              class="ele-action"
+              title="确定要删除此信息吗?"
+              @confirm="remove([row.id])"
+              v-if="
+                    (isNeed_process_is_close &&
+                      [0, 3].includes(row.approvalStatus)) ||
+                    !isNeed_process_is_close
+                  "
+            >
+              <template v-slot:reference>
+                <el-link
+                  type="danger"
+                  :underline="false"
+                  icon="el-icon-delete"
+                >
+                  删除
+                </el-link>
+              </template>
+            </el-popconfirm>
+          </template>
         </template>
         
         <template v-slot:code="{ row }">
@@ -194,7 +198,9 @@
             width: 45,
             type: 'selection',
             columnKey: 'selection',
-            align: 'center'
+            align: 'center',
+            // 子行不参与多选/批量删除
+            selectable: (row) => row._level === 0
           },
           {
             width: 60,
@@ -392,9 +398,41 @@
           pageNum: page,
           size: limit,
           ...where
+        }).then((res) => {
+          this.markTreeLevels(res.list);
+          return res;
         });
       },
 
+      /**
+       * 给每行打上 _level 标记,用于子行隐藏操作列 / 禁用选择等。
+       * 注意:不能给父行设 hasChildren=true。
+       * el-table 的 walkTreeNode 把 hasChildren 当作「懒加载节点」标记:
+       * 一旦该字段为真,walker 走 lazy 分支、cb(item, null, level),
+       * 非 lazy 模式下 normalize 的回调不会把它加进 treeData,
+       * 导致 treeCellPrefix 直接返回 null、连展开箭头都不渲染。
+       * 非 lazy 树要靠 childrenList 自身让 walker 走实际数组分支。
+       */
+      markTreeLevels(data) {
+        if (data == null) return;
+        let list = null;
+        if (Array.isArray(data)) {
+          list = data;
+        } else if (typeof data === 'object') {
+          list = data.list || data.rows || data.records || null;
+        }
+        if (!Array.isArray(list)) return;
+        const walk = (rows, level) => {
+          rows.forEach((r) => {
+            r._level = level;
+            if (Array.isArray(r.childrenList) && r.childrenList.length > 0) {
+              walk(r.childrenList, level + 1);
+            }
+          });
+        };
+        walk(list, 0);
+      },
+
       /* 刷新表格 */
       reload(where = {}) {
         console.log(1111);