From 58c94975c8f4ece9faa0af6d2048c79fe6427c07 Mon Sep 17 00:00:00 2001
From: lijingjia <lijj_xl@163.com>
Date: Mon, 20 May 2024 17:59:12 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A1=A8=E6=A0=BC=E5=A4=9A=E9=80=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CostEntry/receiveTable.vue | 73 ++++++++++++++++-------
 src/styles/common.scss                    | 27 +++++++++
 2 files changed, 79 insertions(+), 21 deletions(-)

diff --git a/src/components/CostEntry/receiveTable.vue b/src/components/CostEntry/receiveTable.vue
index a0f7e000..c49647c4 100644
--- a/src/components/CostEntry/receiveTable.vue
+++ b/src/components/CostEntry/receiveTable.vue
@@ -12,11 +12,14 @@
         :row="row"
       ></ActionBar>
     </div>
-    <hot-table ref="hotTb" :data="list" :settings="settings"></hot-table>
+    <div>
+      <input class="ds-tb-check" type="checkbox" v-model="allCheck" :indeterminate="someCheck">
+      <hot-table ref="hotTb" :data="list" :settings="settings"></hot-table>
+    </div>
   </div>
 </template>
 <script lang="ts" setup>
-  import { defineProps, ref, watch, computed, unref, defineComponent, onMounted, reactive, nextTick } from 'vue'
+  import { defineProps, ref, watch, watchEffect, computed, unref, defineComponent, onMounted, reactive, nextTick } from 'vue'
   // 下拉框数据接口
   import { GetFeeCurrencySelectList, GetFeeCodeSelectList } from '/@/api/common'
   import { HotTable } from '@handsontable/vue3';
@@ -53,6 +56,10 @@
     feeEnName: ''
   }
   const list = ref([])
+  // 全部勾选
+  const allCheck = ref(false)
+  // 部分勾选
+  const someCheck = ref(false)
   // 定义表格所有列
   const columns = [
     {
@@ -62,6 +69,10 @@
       width: 32,
       className: "htCenter",
       readOnly: false
+    }, {
+      title: '序号',
+      width: 130,
+      readOnly: true
     }, {
       title: '业务编号',
       width: 130,
@@ -324,6 +335,45 @@
       }
     })
   })
+  watchEffect(() => {
+    // 全选
+    if (allCheck.value) {
+      list.value.forEach(item => {
+        item.selected = true
+      })
+    } else {
+    // 取消全选
+      list.value.forEach(item => {
+        item.selected = false
+      })
+    }
+  })
+  watch(
+    list.value, (val) => {
+      let a = 0
+      let b = 0
+      val.forEach(item => {
+        if (item.selected) {
+          a += 1
+        } else {
+          b += 1
+        }
+      })
+      if (a == 0) {
+        allCheck.value = false
+      }
+      if (b == 0) {
+        allCheck.value = true
+      }
+      if (a != 0 && b != 0) {
+        someCheck.value = true
+      } else {
+        someCheck.value = false
+      }
+    }, {
+      deep: true
+    }
+  )
 </script>
 
 <style lang='scss'>
@@ -334,25 +384,6 @@
   background-color: #ffffff;
   padding: 0;
   margin-top: 10px;
-  .htCore {
-    thead {
-      tr {
-        height: 36px;
-        background: #fafafa;
-        th {
-          line-height: 34px;
-          background: #fafafa;
-        }
-      }
-    }
-    tbody {
-      tr {
-        td {
-          line-height: 30px;
-        }
-      }
-    }
-  }
 }
 .handsontableInput {
   line-height: 30px;
diff --git a/src/styles/common.scss b/src/styles/common.scss
index f3efbd1c..dc93607c 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -46,4 +46,31 @@ h5 {
       color: #79868c;
     }
   }
+}
+
+// handsontable 全选checkbox
+.ds-tb-check {
+  position: absolute;
+  z-index: 199;
+  left: 15px;
+  margin-top: 14px;
+}
+.htCore {
+  thead {
+    tr {
+      height: 36px;
+      background: #fafafa;
+      th {
+        line-height: 34px;
+        background: #fafafa;
+      }
+    }
+  }
+  tbody {
+    tr {
+      td {
+        line-height: 30px;
+      }
+    }
+  }
 }
\ No newline at end of file