From bdbc16ec2151d81cc45f333994ca9c23340ebf3c Mon Sep 17 00:00:00 2001
From: dengbf <dengbf@aliyun.com>
Date: Thu, 30 Nov 2023 14:23:39 +0800
Subject: [PATCH 1/2] =?UTF-8?q?-=20[=E4=BF=AE=E5=A4=8D]=20=E7=BA=A7?=
 =?UTF-8?q?=E8=81=94=E4=B8=8B=E6=8B=89=E7=BB=84=E4=BB=B6=EF=BC=9A=E7=82=B9?=
 =?UTF-8?q?=E5=87=BB=E5=A4=96=E9=83=A8=E6=97=B6=E8=87=AA=E5=8A=A8=E6=94=B6?=
 =?UTF-8?q?=E8=B5=B7=E4=B8=8B=E6=8B=89=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/resources/directives/scroll-hidden.js     |  2 ++
 .../plugins/TsForm/TsFormCascader.vue         | 28 ++++++++++++++++++-
 2 files changed, 29 insertions(+), 1 deletion(-)

diff --git a/src/resources/directives/scroll-hidden.js b/src/resources/directives/scroll-hidden.js
index 0b57dad5..fc97ad89 100644
--- a/src/resources/directives/scroll-hidden.js
+++ b/src/resources/directives/scroll-hidden.js
@@ -35,6 +35,8 @@ function onScroll(event) {
       let $date = el.querySelector('.ivu-date-picker');
       let dateVue = $date.__vue__;
       dateVue && dateVue.visible && elVue.onScroll && elVue.onScroll(event);
+    } else if (elVue && elVue.$refs.cascader && elVue.$refs.cascader.visible) { //TsFormCascader
+      elVue.onScroll && elVue.onScroll(event);
     }
   });
 
diff --git a/src/resources/plugins/TsForm/TsFormCascader.vue b/src/resources/plugins/TsForm/TsFormCascader.vue
index d233fa1d..9e8a59ba 100644
--- a/src/resources/plugins/TsForm/TsFormCascader.vue
+++ b/src/resources/plugins/TsForm/TsFormCascader.vue
@@ -3,6 +3,9 @@
     <span v-if="readonly" :class="[readonlyClass, readonlyTextHighlightClass]" :title="renderFormat(labeList,selectedData)">{{ renderFormat(labeList,selectedData) }}</span>
     <div
       v-else
+      v-click-outside:false="onClickOutside"
+      v-click-outside:false.mousedown="onClickOutside"
+      v-click-outside:false.touchstart="onClickOutside"
       :class="borderClass"
       :style="getStyle"
     >
@@ -16,6 +19,7 @@
         :content="labels"
       > -->
       <Cascader
+        ref="cascader"
         v-model="currentValue"
         :data="actualDataList"
         :disabled="disabled"
@@ -49,10 +53,12 @@
 <script>
 import formMixins from '@/resources/mixins/formMixins.js';
 import formScrollMixins from '@/resources/mixins/formScrollMixins.js';
+import { directive as ClickOutside } from '../../directives/v-click-outside-x.js';
 export default {
   name: 'TsFormCascader',
   tagComponent: 'TsForm',
-  mixins: [formMixins, formScrollMixins],
+  directives: { ClickOutside, formScrollMixins },
+  mixins: [formMixins],
   model: {
     prop: 'value',
     event: 'change'
@@ -165,6 +171,26 @@ export default {
         });
       }
       return dataList;
+    },
+    onClickOutside(event) {
+      //点击外部，下拉框消失
+      if (this.$refs.cascader && this.$refs.cascader.visible) {
+        const $contain = this.$refs.cascader ? this.$refs.cascader.$el || null : null;
+        if ((!$contain && $contain === event.target) || $contain.contains(event.target)) {
+          return;
+        }
+        //点击下拉框容器主要是在transfer为true的情况下面
+        const $el = this.$refs.cascader && this.$refs.cascader.$refs.drop ? this.$refs.cascader.$refs.drop.$el || null : null;
+        if (!$el || $el === event.target || $el.contains(event.target)) {
+          return;
+        }
+        this.$refs.cascader.visible = false;
+      }
+    },
+    onScroll(event) {
+      if (this.$refs.cascader && this.$refs.cascader.visible) {
+        this.$refs.cascader.visible = false;
+      }
     }
   },
   computed: {
-- 
Gitee


From 635e810b1c628c265b5c7b4d9ddf259b9b1a460a Mon Sep 17 00:00:00 2001
From: dengbf <dengbf@aliyun.com>
Date: Thu, 30 Nov 2023 14:26:45 +0800
Subject: [PATCH 2/2] commit

---
 src/resources/plugins/TsForm/TsFormCascader.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/resources/plugins/TsForm/TsFormCascader.vue b/src/resources/plugins/TsForm/TsFormCascader.vue
index 9e8a59ba..94a88850 100644
--- a/src/resources/plugins/TsForm/TsFormCascader.vue
+++ b/src/resources/plugins/TsForm/TsFormCascader.vue
@@ -57,8 +57,8 @@ import { directive as ClickOutside } from '../../directives/v-click-outside-x.js
 export default {
   name: 'TsFormCascader',
   tagComponent: 'TsForm',
-  directives: { ClickOutside, formScrollMixins },
-  mixins: [formMixins],
+  directives: { ClickOutside },
+  mixins: [formMixins, formScrollMixins],
   model: {
     prop: 'value',
     event: 'change'
-- 
Gitee