tanxin-ui 1.0.4 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/tanxin-ui.es.js +42 -17
- package/dist/tanxin-ui.umd.js +12 -12
- package/es/drawer/src/drawer.js +9 -6
- package/es/image-preview/src/image-preview.js +9 -6
- package/es/modal/src/modal.js +9 -6
- package/es/utils/hooks/useModal.d.ts +7 -0
- package/es/utils/hooks/useModal.js +31 -0
- package/lib/drawer/src/drawer.js +9 -6
- package/lib/image-preview/src/image-preview.js +9 -6
- package/lib/modal/src/modal.js +9 -6
- package/lib/utils/hooks/useModal.d.ts +7 -0
- package/lib/utils/hooks/useModal.js +33 -0
- package/package.json +1 -1
- package/es/utils/hooks/useZIndex.d.ts +0 -4
- package/es/utils/hooks/useZIndex.js +0 -15
- package/lib/utils/hooks/useZIndex.d.ts +0 -4
- package/lib/utils/hooks/useZIndex.js +0 -17
package/dist/tanxin-ui.es.js
CHANGED
|
@@ -16403,15 +16403,31 @@ function getModalLevelCount(vm) {
|
|
|
16403
16403
|
}
|
|
16404
16404
|
const zIndex = ref(0);
|
|
16405
16405
|
const fromIndex = 2e3;
|
|
16406
|
-
const
|
|
16406
|
+
const closingTag = ref(false);
|
|
16407
|
+
const useModal = () => {
|
|
16407
16408
|
const currentZIndex = computed(() => fromIndex + zIndex.value);
|
|
16408
16409
|
const nextZIndex = () => {
|
|
16409
16410
|
zIndex.value++;
|
|
16410
16411
|
return currentZIndex.value;
|
|
16411
16412
|
};
|
|
16413
|
+
const addClosingTag = () => {
|
|
16414
|
+
console.log("addClosingTag");
|
|
16415
|
+
closingTag.value = true;
|
|
16416
|
+
};
|
|
16417
|
+
const removeClosingTag = () => {
|
|
16418
|
+
console.log("removeClosingTag");
|
|
16419
|
+
closingTag.value = false;
|
|
16420
|
+
};
|
|
16421
|
+
const existsClosingTag = () => {
|
|
16422
|
+
console.log("existsClosingTag", closingTag.value);
|
|
16423
|
+
return closingTag.value;
|
|
16424
|
+
};
|
|
16412
16425
|
return {
|
|
16413
16426
|
currentZIndex,
|
|
16414
|
-
nextZIndex
|
|
16427
|
+
nextZIndex,
|
|
16428
|
+
addClosingTag,
|
|
16429
|
+
removeClosingTag,
|
|
16430
|
+
existsClosingTag
|
|
16415
16431
|
};
|
|
16416
16432
|
};
|
|
16417
16433
|
function _isSlot$f(s2) {
|
|
@@ -16543,6 +16559,7 @@ var Modal = defineComponent({
|
|
|
16543
16559
|
loading.value = props.loading;
|
|
16544
16560
|
});
|
|
16545
16561
|
const modalLevel = ref(0);
|
|
16562
|
+
const modal = useModal();
|
|
16546
16563
|
watch(() => visible.value, () => {
|
|
16547
16564
|
if (!isClient)
|
|
16548
16565
|
return;
|
|
@@ -16582,16 +16599,18 @@ var Modal = defineComponent({
|
|
|
16582
16599
|
};
|
|
16583
16600
|
};
|
|
16584
16601
|
const handleClose2 = () => {
|
|
16602
|
+
if (modal.existsClosingTag())
|
|
16603
|
+
return;
|
|
16604
|
+
modal.addClosingTag();
|
|
16585
16605
|
visible.value = false;
|
|
16586
16606
|
emit("update:visible", false);
|
|
16607
|
+
setTimeout(() => modal.removeClosingTag(), 10);
|
|
16587
16608
|
};
|
|
16588
16609
|
const handleKeyup = (event) => {
|
|
16589
16610
|
if (event.code == "Escape") {
|
|
16590
16611
|
console.log(`modal modalLevel.value = ${modalLevel.value}, getModalLevelCount(vm) - 1=${getModalLevelCount(vm) - 1}`);
|
|
16591
|
-
if (modalLevel.value == getModalLevelCount(vm) - 1)
|
|
16592
|
-
|
|
16593
|
-
handleClose2();
|
|
16594
|
-
}, 10);
|
|
16612
|
+
if (visible.value && modalLevel.value == getModalLevelCount(vm) - 1)
|
|
16613
|
+
handleClose2();
|
|
16595
16614
|
}
|
|
16596
16615
|
};
|
|
16597
16616
|
const mouseMoving = ref(false);
|
|
@@ -16680,7 +16699,7 @@ var Modal = defineComponent({
|
|
|
16680
16699
|
onBeforeMount(() => {
|
|
16681
16700
|
if (!isClient)
|
|
16682
16701
|
return;
|
|
16683
|
-
zIndex2.value =
|
|
16702
|
+
zIndex2.value = modal.nextZIndex();
|
|
16684
16703
|
});
|
|
16685
16704
|
onMounted(() => {
|
|
16686
16705
|
if (!isClient)
|
|
@@ -17240,6 +17259,7 @@ var Drawer = defineComponent({
|
|
|
17240
17259
|
});
|
|
17241
17260
|
const vm = getCurrentInstance();
|
|
17242
17261
|
const modalLevel = ref(0);
|
|
17262
|
+
const modal = useModal();
|
|
17243
17263
|
watch(() => visible.value, () => {
|
|
17244
17264
|
if (!visible.value)
|
|
17245
17265
|
loading.value = false;
|
|
@@ -17264,22 +17284,24 @@ var Drawer = defineComponent({
|
|
|
17264
17284
|
}
|
|
17265
17285
|
};
|
|
17266
17286
|
const handleClose2 = () => {
|
|
17287
|
+
if (modal.existsClosingTag())
|
|
17288
|
+
return;
|
|
17289
|
+
modal.addClosingTag();
|
|
17267
17290
|
visible.value = false;
|
|
17268
17291
|
emit("update:visible", false);
|
|
17292
|
+
setTimeout(() => modal.removeClosingTag(), 10);
|
|
17269
17293
|
};
|
|
17270
17294
|
const handleKeyup = (event) => {
|
|
17271
17295
|
if (event.code == "Escape") {
|
|
17272
|
-
if (modalLevel.value == getModalLevelCount(vm) - 1)
|
|
17273
|
-
|
|
17274
|
-
handleClose2();
|
|
17275
|
-
}, 10);
|
|
17296
|
+
if (visible.value && modalLevel.value == getModalLevelCount(vm) - 1)
|
|
17297
|
+
handleClose2();
|
|
17276
17298
|
}
|
|
17277
17299
|
};
|
|
17278
17300
|
const dialogPosition = ref();
|
|
17279
17301
|
onBeforeMount(() => {
|
|
17280
17302
|
if (!isClient)
|
|
17281
17303
|
return;
|
|
17282
|
-
zIndex2.value =
|
|
17304
|
+
zIndex2.value = modal.nextZIndex();
|
|
17283
17305
|
});
|
|
17284
17306
|
onMounted(() => {
|
|
17285
17307
|
if (!isClient)
|
|
@@ -21361,6 +21383,7 @@ var ImagePreview = defineComponent({
|
|
|
21361
21383
|
});
|
|
21362
21384
|
const vm = getCurrentInstance();
|
|
21363
21385
|
const modalLevel = ref(0);
|
|
21386
|
+
const modal = useModal();
|
|
21364
21387
|
const zIndex2 = ref(0);
|
|
21365
21388
|
const topStyles = computed(() => {
|
|
21366
21389
|
return {
|
|
@@ -21379,17 +21402,19 @@ var ImagePreview = defineComponent({
|
|
|
21379
21402
|
removeEventListener();
|
|
21380
21403
|
});
|
|
21381
21404
|
const handleClose2 = () => {
|
|
21405
|
+
if (modal.existsClosingTag())
|
|
21406
|
+
return;
|
|
21407
|
+
modal.addClosingTag();
|
|
21382
21408
|
visible.value = false;
|
|
21383
21409
|
emit("update:visible", false);
|
|
21410
|
+
setTimeout(() => modal.removeClosingTag(), 10);
|
|
21384
21411
|
};
|
|
21385
21412
|
const handleKeydown = (event) => {
|
|
21386
21413
|
switch (event.code) {
|
|
21387
21414
|
case "Escape":
|
|
21388
21415
|
console.log(`preview modalLevel.value = ${modalLevel.value}, getModalLevelCount(vm) - 1=${getModalLevelCount(vm) - 1}`);
|
|
21389
|
-
if (modalLevel.value == getModalLevelCount(vm) - 1)
|
|
21390
|
-
|
|
21391
|
-
handleClose2();
|
|
21392
|
-
}, 10);
|
|
21416
|
+
if (visible.value && modalLevel.value == getModalLevelCount(vm) - 1)
|
|
21417
|
+
handleClose2();
|
|
21393
21418
|
break;
|
|
21394
21419
|
case "ArrowDown":
|
|
21395
21420
|
handleScale(event, -1);
|
|
@@ -21511,7 +21536,7 @@ var ImagePreview = defineComponent({
|
|
|
21511
21536
|
onBeforeMount(() => {
|
|
21512
21537
|
if (!isClient)
|
|
21513
21538
|
return;
|
|
21514
|
-
zIndex2.value =
|
|
21539
|
+
zIndex2.value = modal.nextZIndex();
|
|
21515
21540
|
});
|
|
21516
21541
|
const render = () => {
|
|
21517
21542
|
const maskTransitionProps = getTransitionGroupProps("fade");
|