uniProject/components/dialog/contentDialog.vue

<template>
	<uni-popup ref="commonPopup" :animation="false" :is-mask-click="false" mask-background-color="rgba(0, 0, 0, 0.4)">
		<view class="phone-common-dialog">
			<view class="common-body-box">
				<view class="common-title">{{title}}</view>
				<view class="common-content" :class="dialogContentClass">
					<slot></slot>
				</view>
				<view class="common-btn-box" v-if="showBtn">
					<view class="not-confirm-btn" @click="handleClose">{{notBtn}}</view>
					<view class="confirm-btn" @click="confirmBtn">{{okBtn}}</view>
				</view>
			</view>
		</view>
	<!-- 	<view class="popup-content" :class="{ 'popup-height': type='bottom' }">
			<slot></slot>
		</view> -->
	</uni-popup>

</template>

<script setup>
	import {
		reactive,
		ref
	} from 'vue';
	import {
		getJiazhengZhiye
	} from "@/api/jiazheng.js"


	const props = defineProps({
		type: {
			type: String,
			default: 'bottom'
		},
		title: {
			type: String,
			default: ''
		},
		content: {
			type: String,
			require: true,
			default: ''
		},
		dialogContentClass: {
			type: String,
			require: true,
			default: 'content-center-class'
		},
		notBtn: {
			type: String,
			require: true,
			default: '取消'
		},
		okBtn: {
			type: String,
			require: true,
			default: '确认'
		},
		showBtn: {
			type: Boolean,
			default: true
		}
	});
	const commonPopup = ref(null); // 索引
	const $emit = defineEmits(['confirm-btn'])


	// 打开弹窗
	function handleShow() {
		commonPopup.value.open();
	}
	// 取消
	function handleClose() {
		commonPopup.value.close();
	}
	// 确认
	function confirmBtn() {
		$emit('confirm-btn');
		commonPopup.value.close();
	}

	defineExpose({
		handleShow,
		handleClose
	})
</script>

<style>
</style>