generated from thzxcx/vue3
54 lines
1.2 KiB
Vue
54 lines
1.2 KiB
Vue
<template>
|
|
<View v-show="modelValue" h-100vh w-full w-750rpx relative bg="#818181" overflow-hidden z-1000>
|
|
<View class="th-prompt" w-400rpx text-center rounded-16rpx absolute top="1/3" left="1/2" ml="-200rpx" right-0 bg-white z-1001>
|
|
<View color="#3a3a3a" fs-32 font-400 my-48rpx>
|
|
{{ content }}
|
|
</View>
|
|
<View fs-32>
|
|
<View bg="#f2f7ff" h-1rpx mx-32rpx />
|
|
<View
|
|
active="bg-#f2f7ff"
|
|
flex-grow
|
|
color="#3b82f6"
|
|
py-16rpx
|
|
cursor-pointer
|
|
select-none
|
|
rounded-b-16rpx
|
|
@click="confirm"
|
|
>
|
|
{{ confirmText }}
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</template>
|
|
|
|
<script lang="ts" setup name="Alert">
|
|
withDefaults(
|
|
defineProps<{
|
|
/** 是否显示 */
|
|
modelValue?: boolean
|
|
/** 内容 */
|
|
content?: string
|
|
/** 确认按钮的默认值 */
|
|
confirmText?: string
|
|
}>(),
|
|
{
|
|
modelValue: false,
|
|
confirmText: '确定',
|
|
},
|
|
)
|
|
|
|
const emit = defineEmits<{
|
|
/** 更新modelValue */
|
|
(event: 'update:modelValue', modelValue: boolean): void
|
|
/** 确认事件 */
|
|
(event: 'confirm'): void
|
|
}>()
|
|
|
|
function confirm() {
|
|
emit('update:modelValue', false)
|
|
emit('confirm')
|
|
}
|
|
</script>
|