From 04dd4ab102f8ef00fda9b353d5a4ec0a79558918 Mon Sep 17 00:00:00 2001
From: sight <1453017105@qq.com>
Date: Sat, 9 Jul 2022 10:32:27 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B:=20layer=20=E7=B1=BB=E5=9E=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/src/component/input/index.vue   |  8 +++++--
 package/layer/src/component/Notifiy.vue       | 24 +++++++++----------
 package/layer/src/component/index.vue         | 13 +++++-----
 package/layer/src/utils/index.ts              |  5 +++-
 4 files changed, 27 insertions(+), 23 deletions(-)

diff --git a/package/component/src/component/input/index.vue b/package/component/src/component/input/index.vue
index c3650b54..9d4cbc39 100644
--- a/package/component/src/component/input/index.vue
+++ b/package/component/src/component/input/index.vue
@@ -45,13 +45,17 @@ const emit = defineEmits<InputEmits>();
 
 const { t } = useI18n();
 const slots = useSlots();
-const currentValue = ref<string>(String(props.modelValue == null ? '' : props.modelValue));
+const currentValue = ref<string>(
+  String(props.modelValue == null ? "" : props.modelValue)
+);
 const hasContent = computed(() => (props.modelValue as string)?.length > 0);
 
 watch(
   () => props.modelValue,
   () => {
-    currentValue.value = String(props.modelValue == null ? '' : props.modelValue);
+    currentValue.value = String(
+      props.modelValue == null ? "" : props.modelValue
+    );
   }
 );
 
diff --git a/package/layer/src/component/Notifiy.vue b/package/layer/src/component/Notifiy.vue
index 3bf8f629..7359bcf6 100644
--- a/package/layer/src/component/Notifiy.vue
+++ b/package/layer/src/component/Notifiy.vue
@@ -17,7 +17,7 @@ export default {
 };
 </script>
 <script lang="ts" setup>
-import { nextTick, onMounted, ref } from "vue";
+import { nextTick, onMounted, ref, shallowRef } from "vue";
 import CloseBtnVue from "./CloseBtn.vue";
 
 export interface LayNotifyProps {
@@ -35,7 +35,7 @@ const emit = defineEmits(["close"]);
 const close = () => {
   emit("close");
 };
-function addClass(obj: { className: any }, cls: string) {
+function addClass(obj: HTMLElement, cls: string) {
   //获取 class 内容.
   let obj_class = obj.className,
     //判断获取到的 class 是否为空, 如果不为空在前面加个'空格'.
@@ -44,19 +44,17 @@ function addClass(obj: { className: any }, cls: string) {
   obj.className = added; //替换原来的 class.
 }
 
-const notifyRef = ref<HTMLElement | null>(null);
+const notifyRef = shallowRef<HTMLElement | null>(null);
 onMounted(() => {
   nextTick(() => {
-    if (notifyRef.value) {
-      setTimeout(() => {
-        //此处延迟加载class，以免影响弹出效果
-        // @ts-ignore
-        addClass(
-          notifyRef.value.parentElement?.parentElement,
-          "layui-layer-notify"
-        );
-      }, 300);
-    }
+    setTimeout(() => {
+      //此处延迟加载class，以免影响弹出效果
+      if (!notifyRef.value?.parentElement?.parentElement) return;
+      addClass(
+        notifyRef.value?.parentElement?.parentElement,
+        "layui-layer-notify"
+      );
+    }, 300);
   });
 });
 </script>
diff --git a/package/layer/src/component/index.vue b/package/layer/src/component/index.vue
index 0ece2861..db41c292 100644
--- a/package/layer/src/component/index.vue
+++ b/package/layer/src/component/index.vue
@@ -177,7 +177,6 @@ const firstOpenDelayCalculation = function () {
       area.value = calculateDrawerArea(props.offset, props.area);
     }
     if (type == 5) {
-      // @ts-ignore
       area.value = await calculatePhotosArea(
         props.imgList[props.startIndex].src,
         props
@@ -395,13 +394,14 @@ const boxClasses = computed(() => {
 const supportMove = function () {
   if (props.move && type != 4) {
     nextTick(() => {
-      // @ts-ignore 拖拽
-      useMove(layero.value, (left, top) => {
+      // 拖拽
+      if (!layero.value) return;
+      useMove(layero.value, (left: string, top: string) => {
         l.value = left;
         t.value = top;
       });
-      // @ts-ignore 拉伸
-      useResize(layero.value, (width, height) => {
+      // 拉伸
+      useResize(layero.value, (width: string, height: string) => {
         h.value = height;
         w.value = width;
       });
@@ -524,7 +524,7 @@ const leaveActiveClass = computed(() => {
 });
 
 /**
- * 打卡弹层
+ * 打开弹层
  * <p>
  */
 const open = () => {
@@ -576,7 +576,6 @@ const showTitle = computed(() => {
  */
 const resetCalculationPohtosArea = function (index: number) {
   nextTick(async () => {
-    // @ts-ignore
     area.value = await calculatePhotosArea(props.imgList[index].src, props);
     offset.value = calculateOffset(props.offset, area.value, props.type);
     w.value = area.value[0];
diff --git a/package/layer/src/utils/index.ts b/package/layer/src/utils/index.ts
index 780d1595..c6f4adfc 100644
--- a/package/layer/src/utils/index.ts
+++ b/package/layer/src/utils/index.ts
@@ -264,7 +264,10 @@ export function getDrawerAnimationClass(offset: any, isClose: boolean = false) {
 }
 
 //计算图片大小 并缩放
-export async function calculatePhotosArea(url: string, options: object) {
+export async function calculatePhotosArea(
+  url: string,
+  options: object
+): Promise<Array<string>> {
   let img = new Image();
   img.src = url;
   return new Promise((resolve, reject) => {