style:权利人信息

@@ -25,6 +25,7 @@
     "nprogress": "0.2.0",
     "print-js": "^1.6.0",
     "qrcode": "^1.5.3",
+    "sortablejs": "^1.15.0",
     "vue": "2.6.10",
     "vue-json-editor": "^1.4.3",
     "vue-print-nb": "^1.7.5",

@@ -16,8 +16,8 @@
 
     <el-tabs v-model="activeName" @tab-click="handleClick" class="from-clues-header">
       <el-tab-pane label="基本信息" name="1"></el-tab-pane>
-      <el-tab-pane label="企业信息" name="2"></el-tab-pane>
-      <el-tab-pane label="银行机构" name="3"></el-tab-pane>
+      <el-tab-pane label="企业信息" v-if="showButton" name="2"></el-tab-pane>
+      <el-tab-pane label="银行机构" v-if="showButton" name="3"></el-tab-pane>
     </el-tabs>
 
     <el-form

 <!--
  * @Description:
  * @Autor: renchao
- * @LastEditTime: 2023-09-12 14:48:12
+ * @LastEditTime: 2023-09-13 10:18:32
 -->
 <template>
   <div class="clmlmx-box">
-    <lb-table :column="column" :key="key" :heightNumSetting="true" :calcHeight="600" :pagination="false" :data="tableData">
+    <div style="text-align:right">
+      <el-button type="primary" icon="el-icon-top">上移</el-button>
+      <el-button type="primary" icon="el-icon-bottom">下移</el-button>
+    </div>
+    <lb-table :column="column" :key="key" :heightNumSetting="true" :calcHeight="600"
+      :pagination="false" :data="tableData">
     </lb-table>
     <div class="text-center">
       <el-button @click="$popupCacel">取消</el-button>
@@ -15,8 +20,9 @@
 </template>
 <script>
   import Vue from 'vue'
+  import Sortable from 'sortablejs'
   import store from '@/store/index.js'
-  import { InitClml, updateClml, deleteSjClml, moveClml } from "@/api/clxx.js";
+  import { InitClml, updateClml } from "@/api/clxx.js";
   export default {
     props: {
       formData: {
@@ -31,23 +37,8 @@
         loading: false,
         column: [
           {
-            width: '50',
-            renderHeader: (h, scope) => {
-              return <div> {
-                !this.formData.ableOperation ? '序号' : <i class="el-icon-plus pointer" onClick={() => { this.addClick() }}></i>
-              }
-              </div>
-            },
-            render: (h, scope) => {
-              return (
-                <div>
-                  {
-                    !this.formData.ableOperation ? <span>{scope.$index + 1}</span> :
-                      <i class="el-icon-minus pointer" onClick={() => { this.handleDelete(scope.$index, scope.row) }}></i>
-                  }
-                </div>
-              )
-            }
+            label: "选择",
+            type: 'selection'
           },
           {
             prop: "isrequired",
@@ -104,7 +95,7 @@
             width: "80",
             render: (h, scope) => {
               return (
-                (this.formData.ableOperation && scope.row.isrequired != '1') ?
+                (this.formData.ableOperation) ?
                   <el-input value={scope.row.sjsl} onInput={(val) => { scope.row.sjsl = val }}></el-input> : <span>{
                     scope.row.sjsl
                   }</span>
@@ -112,26 +103,22 @@
             }
           },
           {
-            prop: "smzt",
             label: "扫描时间",
-            width: "80",
+            width: "140",
             render: (h, scope) => {
               return (
-                (this.formData.ableOperation && scope.row.isrequired != '1') ?
-                  <el-input value={scope.row.sjsl} onInput={(val) => { scope.row.sjsl = val }}></el-input> : <span>{
-                    scope.row.sjsj
-                  }</span>
+                <span>{scope.row.sjsj}</span>
               )
             }
           },
           {
-            label: "扫描页数",
-            width: "80",
+            label: "页数",
+            width: "60",
             render: (h, scope) => {
-              if (scope.row.children && scope.row.children.length > 0) {
+              if (scope.row.ys && scope.row.ys > 0) {
                 return (
                   <div>
-                    <span>{scope.row.children.length}</span>
+                    <span>{scope.row.ys}</span>
                   </div>
                 );
               } else {
@@ -151,21 +138,13 @@
                 <div>
                   <el-button
                     type="text"
-                    disabled={scope.$index == 0 || !this.formData.ableOperation}
+                    icon="el-icon-delete"
+                    disabled={scope.row.ys == 0 || !this.formData.ableOperation}
                     onClick={() => {
-                      this.moveUpward(scope.$index, scope.row);
+                      this.handleDelete(scope.$index, scope.row);
                     }}
                   >
-                    上移
-                  </el-button>
-                  <el-button
-                    type="text"
-                    disabled={scope.$index + 1 == this.tableData.length || !this.formData.ableOperation}
-                    onClick={() => {
-                      this.moveDown(scope.$index, scope.row);
-                    }}
-                  >
-                    下移
+                    删除
                   </el-button>
 
                 </div >
@@ -186,11 +165,10 @@
         deep: true
       }
     },
+    mounted () {
+      this.initSort()
+    },
     methods: {
-      /**
-       * @description: handleSubmit
-       * @author: renchao
-       */
       handleSubmit () {
         this.loading = true
         updateClml(this.tableData).then(res => {
@@ -238,60 +216,6 @@
         })
       },
       /**
-       * @description: 上移
-       * @param {*} index
-       * @param {*} row
-       * @author: renchao
-       */
-      moveUpward (index, row) {
-        let obj = {
-          xh: row.xh,
-          bsmSlsq: row.bsmSlsq,
-          moveDirection: "UP",
-        };
-        // 接口待调
-        moveClml(obj).then(async (res) => {
-          if (res.code == 200) {
-            let res = await this.clmlInitList()
-            if (res == 200) {
-              this.$message({
-                message: '上移成功',
-                type: 'success'
-              })
-            }
-          } else {
-            this.$message.error(res.message);
-          }
-        })
-      },
-      /**
-       * @description: 下移
-       * @param {*} index
-       * @param {*} row
-       * @author: renchao
-       */
-      moveDown (index, row) {
-        let obj = {
-          xh: row.xh,
-          bsmSlsq: row.bsmSlsq,
-          moveDirection: "DOWN",
-        }
-        // 接口待调
-        moveClml(obj).then(async (res) => {
-          if (res.code == 200) {
-            let res = await this.clmlInitList()
-            if (res == 200) {
-              this.$message({
-                message: '下移成功',
-                type: 'success'
-              })
-            }
-          } else {
-            this.$message.error(res.message);
-          }
-        })
-      },
-      /**
        * @description: 材料目录删除
        * @param {*} index
        * @param {*} row
@@ -308,17 +232,6 @@
           cancelButtonText: '取消',
           type: 'warning'
         }).then(() => {
-          deleteSjClml({ sjBsm: row.bsmSj }).then(async (res) => {
-            if (res.code == 200) {
-              let res = await that.clmlInitList()
-              if (res == 200) {
-                that.$message({
-                  message: "删除成功",
-                  type: "success"
-                })
-              }
-            }
-          })
         }).catch(() => {
           this.$message({
             type: 'info',
@@ -326,23 +239,50 @@
           })
         })
       },
-      /**
-       * @description: 字典
-       * @param {*} val
-       * @param {*} code
-       * @author: renchao
-       */
-      dicStatus (val, code) {
-        let data = store.getters.dictData[code],
-          name = "暂无";
-        if (data) {
-          data.map((item) => {
-            if (item.dcode == val) {
-              name = item.dname;
+      initSort () {
+        const el = document.querySelectorAll('.el-table__body-wrapper > table > tbody')[0]
+        // const sortable = new Sortable(el, options);
+        // 根据具体需求配置options配置项
+        const sortable = new Sortable(el, {
+          onEnd: (evt) => { // 监听拖动结束事件
+            console.log(this) // this是当前vue上下文
+            console.log(evt.oldIndex) // 当前行的被拖拽前的顺序
+            console.log(evt.newIndex) // 当前行的被拖拽后的顺序
+            // 这里就可以写我们需要传给后台的逻辑代码
+            // 我们有了 evt.oldIndex 和 evt.newIndex 这两个参数做索引，我们可以根据绑定在表格上面的 data 这个 Array 找到两个相应的记录。就可以针对数据进行操作啦。
+            // 下面将拖拽后的顺序进行修改
+            const currRow = this.tableData.splice(evt.oldIndex, 1)[0]
+            this.tableData.splice(evt.newIndex, 0, currRow)
+            const newData = []
+            this.tableData.forEach((item, index) => {
+              newData[index] = {
+                id: item.id,
+                rank: index + 1
+              }
+            })
+            // 下面是将排序结果更新到数据库中，根据自己项目的逻辑进行实现即可。
+            const data = {
+              id: this.$route.params.id,
+              datas: {
+                streams: newData
+              }
+            }
+            this.$store
+              .dispatch('user/setMultiSort', data)
+              .then((res) => {
+                if (res.code === 200) {
+                  this.$message.success('排序修改成功')
+                  // 修改成功后重新获取列表数据更新
+                  this.getMultiLiveList()
+                } else {
+                  this.$message.error('排序修改失败')
                 }
-          });
-          return name;
+              })
+              .catch((e) => {
+                console.log(e)
+              })
           }
+        })
       }
     }
   }