@neatui/vue 1.2.21 → 1.2.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/vue",
-  "version": "1.2.21",
+  "version": "1.2.22",
   "description": "basic component ui",
   "main": "./src/index.ts",
   "license": "MIT",

package/src/components/basic/IFollowView.vue

@@ -14,7 +14,7 @@
       @mouseover="hovershow"
       @mouseout="hoverhide"
     >
-      <div ref="box" :ui-tips-box="state.pos" :class="tipBoxClass" :style="tipBoxStyle">
+      <div ref="box" :ui-tips-box="state.pos" :class="tipBoxClass" :style="tipBoxStyle" @mousedown="downdom">
         <slot name="tips"></slot>
         <div ui-tips-arrow=""></div>
       </div>
@@ -67,7 +67,8 @@
     view: 0,
     show: 0,
     pos: props.pos,
-    hover: 0
+    hover: 0,
+    tipdom: false
   });
 
   const showTimer: any = ref(null);
@@ -131,11 +132,24 @@
 
   // 取消
   const cancel = ({ target }: any = {}) => {
-    if (tip.value && !tip.value?.contains(target) && dom.value && !dom.value.contains(target) && !tip.value.querySelector('input:focus')) {
+    if (tip.value && !state.tipdom && !tip.value?.contains(target) && dom.value && !dom.value.contains(target) && !tip.value.querySelector('input:focus')) {
       state.show = 0;
     }
   };
 
+  const downdom = (ev: any) => {
+    state.tipdom = true;
+    document.addEventListener(
+      'mouseup',
+      () => {
+        setTimeout(() => {
+          state.tipdom = false;
+        }, 10);
+      },
+      true
+    );
+  };
+
   onMounted(() => {
     document.addEventListener('click', cancel, true);
   });

package/src/components/basic/IRouterView.vue

@@ -1,16 +1,19 @@
 <template>
-  <div :am-view="view" :am-mode="mode" class="route-view pr full bg-back" :view-full="full ? 1 : 0" @animationend="anim">
+  <div :am-view="view" :am-mode="mode" class="iroute-view pr full bg-back" :view-full="full ? 1 : 0" @animationend="anim">
     <div :class="listClass" :style="listStyle" am-view-item="list">
       <slot name="list" :mode="mode"></slot>
     </div>
     <div :class="itemClass" :style="itemStyle" am-view-item="item" ref="itemRef" v-if="view === 'iteming' || view === 'listing' || view === 'item'">
-      <slot name="item" :mode="mode"></slot>
+      <div class="iroute-view-dark" @click="cancel"></div>
+      <div class="iroute-view-body" :style="mode === 'preview' || mode === 'pop-up' ? 'box-shadow: rgba(0, 0, 0, 0.08) -5px 0px 10px 0px;' : 'width: 100%;'">
+        <slot name="item" :mode="mode"></slot>
+      </div>
     </div>
   </div>
 </template>
 <script setup lang="ts">
   import { deepcopy } from '@fekit/utils';
-  import { onMounted, onUnmounted, ref, watch, provide, reactive } from 'vue';
+  import { ref, watch, provide, reactive } from 'vue';
   import { useRoute, useRouter } from 'vue-router';
   const route = useRoute();
   const router = useRouter();
@@ -93,39 +96,32 @@
   watch(() => route.query[props.queryName], a);
   a();
 
-  const itemRef: any = ref(null);
   // 取消
   const cancel = ({ target }: any = {}) => {
-    const ifollow: any = document.querySelector('#ifollow');
-    const fekit: any = document.querySelector('#fekit');
-    const toasts: any = document.querySelectorAll('.mc-toast');
-    const layers: any = document.querySelectorAll('.fekit-layer');
-    if (
-      itemRef.value &&
-      !itemRef.value.contains(target) &&
-      !ifollow?.contains(target) &&
-      !fekit?.contains(target) &&
-      Array.from(layers).every((t: any) => !t.contains(target)) &&
-      Array.from(toasts).every((t: any) => !t.contains(target))
-    ) {
-      const _query = { ...route.query };
-      delete _query[props.queryName];
-      router.push({ path: route.path, query: _query });
-    }
+    const _query = { ...route.query };
+    delete _query[props.queryName];
+    router.push({ path: route.path, query: _query });
   };
-  onMounted(() => {
-    if (props.mode === 'preview' || props.mode === 'pop-up') {
-      document.addEventListener('click', cancel, true);
-    }
-  });
-  onUnmounted(() => {
-    if (props.mode === 'preview' || props.mode === 'pop-up') {
-      document.removeEventListener('click', cancel, true);
-    }
-  });
 </script>
 
 <style lang="scss">
+  .iroute-view-dark {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+  }
+  .iroute-view-body {
+    z-index: 1;
+  }
+
+  [am-mode='preview'] {
+    .iroute-view-body > * {
+      height: 100%;
+    }
+  }
+
   // 默认模式
   [am-view][am-mode~='default'] {
     overflow: hidden;