合同中期支付项排序

src/views/project/debit/contract/pay.vue

@@ -87,7 +87,7 @@
                 ui="hc-test-drop-table"
                 :column="sorttableColumn" :datas="sorttableData" :loading="tableLoading" :index-style="{ width: 80 }"
                 is-new
-                is-row-drop is-sort quick-sort
+                is-row-drop quick-sort
                 @row-drop="rowDropTap" @row-sort="rowSortTap"
             >
                 <template #isDeduct="{ row }">
@@ -96,6 +96,14 @@
                 <template #isTotalTerms="{ row }">
                     <span>{{ row?.isTotalTerms === 1 ? '是' : '否' }}</span>
                 </template>
+                <template #action="{ index }">
+                    <span class="text-link text-xl" @click="upSortClick(index)">
+                        <HcIcon name="arrow-up" fill />
+                    </span>
+                    <span class="text-link ml-2 text-xl" @click="downSortClick(index)">
+                        <HcIcon name="arrow-down" fill />
+                    </span>
+                </template>
             </hc-table>
             
             <template #footer>
@@ -177,6 +185,7 @@ const sorttableColumn = ref([
     { key: 'isDeduct', name: '是否为扣款项', width: 100 },
     { key: 'isTotalTerms', name: '是否合计项', width: 100 },
     { key: 'payApplicableTypeName', name: '适用类型', width: 100 },
+    { key: 'action', name: '排序', width: 90 },
 
 ])
 const tableData = ref([])
@@ -205,6 +214,28 @@ const getTableData = async () => {
     }
 }
 
+//向下
+const downSortClick = (index) => {
+    const indexs = index + 1
+    const data = sorttableData.value
+    if (indexs !== data.length) {
+        const tmp = data.splice(indexs, 1)
+        sorttableData.value.splice(index, 0, tmp[0])
+    } else {
+        window?.$message?.warning('已经处于置底，无法下移')
+    }
+}
+
+//向上
+const upSortClick = (index) => {
+    const data = sortTableData.value || []
+    if (index !== 0) {
+        const tmp = data.splice(index - 1, 1)
+        sortTableData.value.splice(index, 0, tmp[0])
+    } else {
+        window?.$message?.warning('已经处于置顶，无法上移')
+    }
+}
 //引用系统支付项
 const systemPayShow = ref(false)
 const systemPaymentClick = () => {