wbs节点排序

src/api/modules/wbs/wbsforelement.js

@@ -26,7 +26,14 @@ export default {
     },
     async upateBatchNodeTableInfo(form) {
         return HcApi({
-            url: "api/blade-manager/wbsTree/update-batch-node-tableInfo",
+            url: "/api/blade-manager/wbsTree/update-batch-node-tableInfo",
+            method: "post",
+            data: form,
+        });
+    },
+    async submitTableSort(form) {
+        return HcApi({
+            url: "/api/blade-manager/wbsFormElement/submit-table-sort",
             method: "post",
             data: form,
         });

src/views/desk/wbs/drawer-wbs.vue

@@ -109,7 +109,10 @@
                                             @click="editEleClick"
                                             >编辑元素表单</el-button
                                         >
-                                        <el-button size="small" type="success"
+                                        <el-button
+                                            size="small"
+                                            type="success"
+                                            @click="sortClick"
                                             >排序</el-button
                                         >
                                     </template>
@@ -156,7 +159,7 @@
             </div>
         </div>
 
-        <!-- 调整排序 -->
+        <!-- 树节点调整排序 -->
         <hc-dialog
             v-model="isSortingShow"
             title="调整排序"
@@ -216,6 +219,14 @@
             :ownerTypeList="ownerTypeList"
             :tab="tableData"
         ></editElePage>
+
+        <!-- 表单调整排序 -->
+        <tableSort
+            v-model="tableSortShow"
+            @close="tableSortShowClose"
+            :tab="tableData"
+        >
+        </tableSort>
     </hc-drawer>
 </template>
 
@@ -223,12 +234,11 @@
 import { nextTick, ref, watch, onMounted } from "vue";
 import { HcDelMsg } from "hc-vue3-ui";
 import { getDictionaryData, getDictionaryName } from "~src/utils/tools";
-
 import { getStoreValue, setStoreValue } from "~uti/storage";
+import tableSort from "./table-sort.vue";
 import {
     arrToId,
     deepClone,
-    formValidate,
     getArrValue,
     getObjValue,
     isNullES,
@@ -631,6 +641,16 @@ const editEleClick = () => {
         window.$message.warning("请先选择编辑哪个节点");
     }
 };
+
+// 元素表排序
+const tableSortShow = ref(false);
+const sortClick = () => {
+    tableSortShow.value = true;
+};
+const tableSortShowClose = () => {
+    tableSortShow.value = false;
+    getTableData();
+};
 </script>
 
 <style lang="scss">

src/views/desk/wbs/table-sort.vue

@@ -0,0 +1,101 @@
+<template>
+    <!-- 树节点调整排序 -->
+    <hc-dialog
+        v-model="isSortingShow"
+        title="调整排序"
+        widths="600px"
+        is-table
+        @close="sortingClose"
+    >
+        <hc-table
+            ref="tableSortingRef"
+            :column="tableSortingColumn"
+            :datas="tableSortingData"
+            is-row-drop
+            is-sort
+            quick-sort
+            @row-drop="sortingRowDropTap"
+            @row-sort="sortingRowSortTap"
+        />
+        <template #footer>
+            <el-button hc-btn @click="sortingClose">取消</el-button>
+            <el-button
+                hc-btn
+                type="primary"
+                :disabled="tableSortingData.length <= 0"
+                :loading="sortingLoading"
+                @click="sortingSubmit"
+                >提交</el-button
+            >
+        </template>
+    </hc-dialog>
+</template>
+<script setup>
+import { ref, watch, nextTick } from "vue";
+import mainApi from "~api/wbs/wbsforelement";
+const props = defineProps({
+    tab: {
+        type: Array,
+        default: () => [],
+    },
+});
+//事件
+const emit = defineEmits(["close"]);
+//双向绑定
+// eslint-disable-next-line no-undef
+const isSortingShow = defineModel("modelValue", {
+    default: false,
+});
+const tableSortingData = ref(props.tab);
+//监听显示
+watch(isSortingShow, (val) => {
+    if (val) {
+    } else {
+        emit("close");
+    }
+});
+//监听数据
+watch(
+    () => [props.tab],
+    ([tabdata]) => {
+        tableSortingData.value = tabdata;
+    },
+    { deep: true }
+);
+//关闭弹窗
+const sortingClose = () => {
+    isSortingShow.value = false;
+    emit("close");
+};
+const tableSortingRef = ref(null);
+const tableSortingColumn = [{ key: "tableName", name: "表单名称" }];
+const sortingRowDropTap = async (rows) => {
+    // 先清空，否则排序会异常
+    tableSortingData.value = [];
+    await nextTick();
+    tableSortingData.value = rows;
+};
+const sortingRowSortTap = async (rows) => {
+    // 先清空，否则排序会异常
+    tableSortingData.value = [];
+    await nextTick();
+    tableSortingData.value = rows;
+};
+const sortingLoading = ref(false);
+
+const sortingSubmit = async () => {
+    const arr = tableSortingData.value;
+    if (arr.length <= 0) {
+        window?.$message?.warning("暂无数据");
+        return;
+    }
+    sortingLoading.value = true;
+
+    const { error, code } = await mainApi.submitTableSort(arr);
+    sortingLoading.value = false;
+    if (!error && code === 200) {
+        window?.$message?.success("操作成功");
+        sortingClose();
+    }
+};
+</script>