🐛: layer 类型

This commit is contained in:
sight 2022-07-09 10:32:27 +08:00
parent a939c48b79
commit 04dd4ab102
4 changed files with 27 additions and 23 deletions

View File

@ -45,13 +45,17 @@ const emit = defineEmits<InputEmits>();
const { t } = useI18n(); const { t } = useI18n();
const slots = useSlots(); 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); const hasContent = computed(() => (props.modelValue as string)?.length > 0);
watch( watch(
() => props.modelValue, () => props.modelValue,
() => { () => {
currentValue.value = String(props.modelValue == null ? '' : props.modelValue); currentValue.value = String(
props.modelValue == null ? "" : props.modelValue
);
} }
); );

View File

@ -17,7 +17,7 @@ export default {
}; };
</script> </script>
<script lang="ts" setup> <script lang="ts" setup>
import { nextTick, onMounted, ref } from "vue"; import { nextTick, onMounted, ref, shallowRef } from "vue";
import CloseBtnVue from "./CloseBtn.vue"; import CloseBtnVue from "./CloseBtn.vue";
export interface LayNotifyProps { export interface LayNotifyProps {
@ -35,7 +35,7 @@ const emit = defineEmits(["close"]);
const close = () => { const close = () => {
emit("close"); emit("close");
}; };
function addClass(obj: { className: any }, cls: string) { function addClass(obj: HTMLElement, cls: string) {
// class . // class .
let obj_class = obj.className, let obj_class = obj.className,
// class , ''. // class , ''.
@ -44,19 +44,17 @@ function addClass(obj: { className: any }, cls: string) {
obj.className = added; // class. obj.className = added; // class.
} }
const notifyRef = ref<HTMLElement | null>(null); const notifyRef = shallowRef<HTMLElement | null>(null);
onMounted(() => { onMounted(() => {
nextTick(() => { nextTick(() => {
if (notifyRef.value) {
setTimeout(() => { setTimeout(() => {
//class //class
// @ts-ignore if (!notifyRef.value?.parentElement?.parentElement) return;
addClass( addClass(
notifyRef.value.parentElement?.parentElement, notifyRef.value?.parentElement?.parentElement,
"layui-layer-notify" "layui-layer-notify"
); );
}, 300); }, 300);
}
}); });
}); });
</script> </script>

View File

@ -177,7 +177,6 @@ const firstOpenDelayCalculation = function () {
area.value = calculateDrawerArea(props.offset, props.area); area.value = calculateDrawerArea(props.offset, props.area);
} }
if (type == 5) { if (type == 5) {
// @ts-ignore
area.value = await calculatePhotosArea( area.value = await calculatePhotosArea(
props.imgList[props.startIndex].src, props.imgList[props.startIndex].src,
props props
@ -395,13 +394,14 @@ const boxClasses = computed(() => {
const supportMove = function () { const supportMove = function () {
if (props.move && type != 4) { if (props.move && type != 4) {
nextTick(() => { nextTick(() => {
// @ts-ignore //
useMove(layero.value, (left, top) => { if (!layero.value) return;
useMove(layero.value, (left: string, top: string) => {
l.value = left; l.value = left;
t.value = top; t.value = top;
}); });
// @ts-ignore //
useResize(layero.value, (width, height) => { useResize(layero.value, (width: string, height: string) => {
h.value = height; h.value = height;
w.value = width; w.value = width;
}); });
@ -524,7 +524,7 @@ const leaveActiveClass = computed(() => {
}); });
/** /**
* 弹层 * 弹层
* <p> * <p>
*/ */
const open = () => { const open = () => {
@ -576,7 +576,6 @@ const showTitle = computed(() => {
*/ */
const resetCalculationPohtosArea = function (index: number) { const resetCalculationPohtosArea = function (index: number) {
nextTick(async () => { nextTick(async () => {
// @ts-ignore
area.value = await calculatePhotosArea(props.imgList[index].src, props); area.value = await calculatePhotosArea(props.imgList[index].src, props);
offset.value = calculateOffset(props.offset, area.value, props.type); offset.value = calculateOffset(props.offset, area.value, props.type);
w.value = area.value[0]; w.value = area.value[0];

View File

@ -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(); let img = new Image();
img.src = url; img.src = url;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {