fix:作品模块页面修改

src/pages/index/works/works_list/index.vue

@@ -64,8 +64,9 @@
     </el-dropdown>
   </el-space>
   <!-- 数据表格 -->
-  <DataTable ref="tableRef" style="width: 100%" :onSelectionChange="data => (selectionData = data)" :column="column"
+  <DataTable ref="tableRef" style="width: 100%" v-loading="loading"
-    :params="params" :request="params => getWorksList(params)">
+    :onSelectionChange="data => (selectionData = data)" :column="column" :params="params"
+    :request="params => tableDataInit(params)">
     <!-- 图片 -->
     <template #works_img="scope">
       <el-image v-if="scope.row.works_img" :src="scope.row.works_img.split(',')[0]" lazy
@@ -75,7 +76,7 @@
     </template>
     <!-- 排序 -->
     <template #works_order="scope">
-      <el-input-number :disabled="orderLoading" v-model='scope.row.works_order' controls-position="right"
+      <el-input-number :disabled="loading" v-model='scope.row.works_order' controls-position="right"
         @change="handleEditOrder(scope.row)"></el-input-number>
     </template>
     <!-- 作品类型 -->
@@ -88,7 +89,7 @@
     </template>
     <!-- 作品点赞数 -->
     <template #works_likes_count="scope">
-      <el-input-number :disabled="likeCountLoading" v-model='scope.row.works_likes_count' controls-position="right"
+      <el-input-number :disabled="loading" v-model='scope.row.works_likes_count' controls-position="right"
         @change="handleEditLikeCount(scope.row)"></el-input-number>
     </template>
     <template #chaoz="scope">
@@ -223,53 +224,47 @@ async function getClassesData() {
   await getClassesList().then((res) => classesData.value = res.data)
 }
 
-//排序
+
+//表格数据获取及拖拽处理
 let drag = ref(false)
-const tableExpandAll = ref(false)
+let tableData = ref();
-// 表格数据初始化
+async function tableDataInit(params) {
-function tableDataInit() {
+  await getWorksList(params).then((res) => tableData.value = res)
-  tableRef.value.reload();
   setTimeout(() => {
     [...document.getElementsByClassName('el-table__row')].map(item => { item.classList.add('row1') });
-    [...document.getElementsByClassName('el-table__row--level-1')].map(item => { item.classList.remove('row1') })
     drag.value === false && (drag.value = createDraw(document.getElementsByClassName('el-table__row')[0].parentElement))
   })
+  return tableData.value;
 }
 watch(drag, () => {
-  drag.value.start(() => {
+  const orderField = 'works_order';
-    dataList.value.map(item => {
-      tableRef.value.toggleRowExpansion(item, false)
-    })
-    tableExpandAll.value = false
-  })
   drag.value.drop((info) => {
     let targetIdx = [...document.getElementsByClassName('row1')].indexOf(info.el)
     let sourceIdx = [...document.getElementsByClassName('row1')].indexOf(info.info.source.el)
-    let orderIdx = dataList.value[sourceIdx]['works_order']
+    let orderIdx = tableData.value.data[sourceIdx][orderField]
-    dataList.value[targetIdx]['works_order'] = orderIdx
+    tableData.value.data[targetIdx][orderField] = orderIdx
-    handleEditOrder(dataList.value[targetIdx])
+    handleEditOrder(tableData.value.data[targetIdx])
   })
 })
 
 //排序
-const orderLoading = ref(false)
+const loading = ref(false)
 async function handleEditOrder(data) {
-  orderLoading.value = true
+  loading.value = true
   const { code } = await editWorks(data);
   if (code == 0) {
-    tableDataInit()
+    loading.value = false
-    orderLoading.value = false
+    tableRef.value.reload()
   }
 }
 
 //点赞
-const likeCountLoading = ref(false)
 async function handleEditLikeCount(data) {
-  likeCountLoading.value = true
+  loading.value = true
   const { code } = await editWorks(data);
   if (code == 0) {
-    tableDataInit()
+    loading.value = false
-    likeCountLoading.value = false
+    tableRef.value.reload()
   }
 }
 

src/pages/index/works/works_type/components/AddWorksTypeDialog.vue

@@ -3,7 +3,7 @@
     <el-form ref="formRef" :model="formData" :rules="rules">
       <el-row>
         <el-col :lg="24">
-          <el-form-item :label-width="labelWidth" label="上级菜单" prop="works_type_parent_guid">
+          <el-form-item :label-width="labelWidth" label="上级类型" prop="works_type_parent_guid">
             <el-cascader class="w100" filterable :options="dataList"
               :props="{ checkStrictly: true, value: 'works_type_guid', label: 'works_type_name', emitPath: false }"
               placeholder="请选择上级菜单" clearable v-model="formData.works_type_parent_guid">

src/pages/index/works/works_type/components/DetailWorksTypeDialog.vue

@@ -3,7 +3,7 @@
     <el-form ref="formRef" :model="formData" :disabled="true">
       <el-row>
         <el-col :lg="24">
-          <el-form-item :label-width="labelWidth" label="上级菜单" prop="works_type_parent_guid">
+          <el-form-item :label-width="labelWidth" label="上级类型" prop="works_type_parent_guid">
             <el-cascader class="w100" filterable :options="dataList"
               :props="{ checkStrictly: true, value: 'works_type_guid', label: 'works_type_name', emitPath: false }"
               placeholder="无" clearable v-model="formData.works_type_parent_guid">

src/pages/index/works/works_type/components/EditWorksTypeDialog.vue

@@ -3,7 +3,7 @@
     <el-form ref="formRef" :model="formData" :rules="rules">
       <el-row>
         <el-col :lg="24">
-          <el-form-item :label-width="labelWidth" label="上级菜单" prop="works_type_parent_guid">
+          <el-form-item :label-width="labelWidth" label="上级类型" prop="works_type_parent_guid">
             <el-cascader class="w100" filterable :options="dataList"
               :props="{ checkStrictly: true, value: 'works_type_guid', label: 'works_type_name', emitPath: false }"
               placeholder="请选择上级菜单" clearable v-model="formData.works_type_parent_guid">

src/pages/index/works/works_type/index.vue

@@ -174,11 +174,10 @@ const handleExcelSuccess = (value) => {
   getList()
 };
 
+//表格数据获取及拖拽处理
 const loading = ref(false)
 const dataList = ref([])
-//排序
 let drag = ref(false)
-// 查询数据
 function getList() {
   loading.value = true
   getWorksTypeList(params).then((res) => {
@@ -194,8 +193,8 @@ function getList() {
   })
 
 }
-
 watch(drag, () => {
+  const orderField = 'works_type_order';
   drag.value.start(() => {
     dataList.value.map(item => {
       tableRef.value.toggleRowExpansion(item, false)
@@ -205,8 +204,8 @@ watch(drag, () => {
   drag.value.drop((info) => {
     let targetIdx = [...document.getElementsByClassName('row1')].indexOf(info.el)
     let sourceIdx = [...document.getElementsByClassName('row1')].indexOf(info.info.source.el)
-    let orderIdx = dataList.value[sourceIdx]['works_type_order']
+    let orderIdx = dataList.value[sourceIdx][orderField]
-    dataList.value[targetIdx]['works_type_order'] = orderIdx
+    dataList.value[targetIdx][orderField] = orderIdx
     handleEditOrder(dataList.value[targetIdx])
   })
 })