uniProject/pages/admin/zizhanghao/components/resetPassword.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">
					<view class="form-label-input">
						<view class="phone-form-label"><text class="form-label-require"></text>密码</view>
						<input v-model="password" placeholder="请输入密码" />
					</view>
					<view class="form-label-input">
						<view class="phone-form-label"><text class="form-label-require"></text>确认密码</view>
						<input v-model="password2" placeholder="请输入二次确认密码" />
					</view>
				</view>
				<view class="common-btn-box">
					<view class="not-confirm-btn" @click="handleClose">{{notBtn}}</view>
					<view class="confirm-btn" @click="confirmBtn">{{okBtn}}</view>
				</view>
			</view>
		</view>
	</uni-popup>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		getUserGuanliReset
	} from "@/api/zizhanghao.js"

	const props = defineProps({
		title: {
			type: String,
			default: ''
		},
		dialogContentClass: {
			type: String,
			require: true,
			default: 'content-center-class'
		},
		notBtn: {
			type: String,
			require: true,
			default: '取消'
		},
		okBtn: {
			type: String,
			require: true,
			default: '确认'
		},
	});

	const password = ref('');
	const password2 = ref('');
	const userId = ref(null)

	const commonPopup = ref(null); // 索引
	const $emit = defineEmits(['confirm-btn'])
	// 打开弹窗
	function handleShow(userIdData) {
		userId.value = userIdData;
		commonPopup.value.open();
	}
	// 取消
	function handleClose() {
		password.value = null;
		userId.value  = null;
		commonPopup.value.close();
	}
	// 确认
	function confirmBtn() {
		if (!password.value) {
			uni.showToast({
				icon: 'none',
				title: '请输入密码'
			})
			return;
		}
		if (!password2.value) {
			uni.showToast({
				icon: 'none',
				title: '请输入二次确认密码'
			})
			return;
		}
		if (password.value !== password2.value) {
			uni.showToast({
				icon: 'none',
				title: '两次输入密码不同'
			})
			return;
		}
		getUserGuanliReset({
			userId: userId.value,
			password: password.value
		}).then(res => {
			if (res.data) {
				uni.showToast({
					icon: 'none',
					title: '更新成功'
				})
				$emit('confirm-btn');
				commonPopup.value.close();
				password.value = null;
				userId.value  = null;
			}
		})
	}
	defineExpose({
		handleShow,
		handleClose
	})
</script>

<style>
</style>