设置页面开发

api/my.js

@@ -10,6 +10,7 @@ export function getMineInfo(data = {}) {
     timeout: 20000
   })
 }
+
 export function getUserInfo(data = {}) {
   return request({
     'url': '/app/user/info',
@@ -20,4 +21,28 @@ export function getUserInfo(data = {}) {
     data,
     timeout: 20000
   })
+}
+
+export function getUserUpPassword(data = {}) {
+  return request({
+    'url': '/app/user/update/password',
+    headers: {
+      isToken: true
+    },
+    method: 'post',
+    data,
+    timeout: 20000
+  })
+}
+
+export function getUserUpBirthday(data = {}) {
+  return request({
+    'url': '/app/user/update/birthday',
+    headers: {
+      isToken: true
+    },
+    method: 'post',
+    data,
+    timeout: 20000
+  })
 }

common/styles/global/components.scss

@@ -143,6 +143,31 @@ view{box-sizing: border-box;}
 	width: 120rpx;height: 120rpx;margin: 0 auto;
 	background-image: url("@/static/images/my/user-default-img.png");@include ezy-no-repeat-cover();}
 
+/***** 通用弹窗  *****/		
+.phone-common-dialog{
+	width: 660rpx;border-radius: 12rpx;background-color: #fff;padding-top: 24rpx;box-sizing: border-box;position: relative;
+	.common-title{padding-top: 24rpx;font-size: 34rpx;color: #333;text-align: center;}
+	.common-content{font-size: 32rpx;color: #666;margin:32rpx 48rpx 48rpx;line-height: 1.6;}
+	.common-input-box{
+		padding: 32rpx 0 20rpx;
+		.common-input-row{display: flex;align-items: center;margin-bottom: 24rpx;}
+		.common-label-require{color: #ff0101;margin-right: 6rpx;width:16rpx;display: inline-block;flex-shrink: 0;}
+		.common-input-label{width: 200rpx;line-height:70rpx;font-size: 28rpx;color: #333;text-align: right;}
+		.common-input,.common-input-margin{
+			height: 70rpx;min-height: 70rpx;padding: 20rpx;box-sizing: border-box;margin-right: 30rpx;
+			border: 1rpx solid #f0f0f0;border-radius: 10rpx;display: block;flex: 1;font-size: 28rpx;}
+		.common-input-margin{margin:0 46rpx 24rpx 46rpx;}
+	}
+	.content-center-class{text-align: center;}
+	.content-left-class{text-align: left;}
+	.content-margin-bottom{margin-bottom: 20rpx;}
+	.common-btn-box{display: flex;flex-direction: row;border-top-color: #f5f5f5;border-top-style: solid;border-top-width: 1px;}
+	.not-confirm-btn,.confirm-btn{height: 90rpx;line-height: 90rpx;flex:1;text-align: center;font-size: 30rpx;}
+	.not-confirm-btn{color: #666;}
+	.confirm-btn{border-left-color: #f0f0f0;border-left-style: solid;border-left-width: 1px;color: $uni-primary;}
+	.code-img{width: 500rpx;height: 500rpx;display: block;margin: 0 auto;}
+}
+
 /*****分类组件 author: TX  date:2024-06-24*****/
 .lli-status-box{
   display: flex;justify-content: space-around;background: #fff;

common/styles/global/pages.scss

@@ -76,4 +76,6 @@
 	    background: linear-gradient(0deg,#436aff 0%, #234ff7 100%);border-radius: 45rpx;
 	    box-shadow: 0px 2rpx 14rpx -4rpx #5772ff;text-align: center;color: #fff;
 	}
-}
+}
+
+.phone-common-dialog.birthday-dialog{width: unset;}

pages/my/components/birthdayDialog.vue

@@ -0,0 +1,74 @@
+<template>
+	<uni-popup ref="birthdayPopup" :animation="false" :is-mask-click="false"
+	 mask-background-color="rgba(0, 0, 0, 0.4)">
+	 <view class="phone-common-dialog birthday-dialog">
+		<view class="common-body-box">
+			<uni-calendar
+				ref="calendar"
+				:insert="true"
+				@change="dataConfirm"
+				 />
+			<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,reactive} from "vue"
+	import {toast} from "@/utils/common";
+	const props = defineProps({
+	  notBtn: {
+	    type: String,
+	  	require: true,
+	    default: '取消'
+	  },
+	  okBtn: {
+	    type: String,
+	  	require: true,
+	    default: '确认'
+	  },
+	});
+	const time= ref('');
+	const birthdayPopup = ref(null); // 索引
+	const $emit = defineEmits(['confirm-btn'])
+	
+	function passClear(){
+		time.value = '';
+	}
+	
+	function dataConfirm(data){
+		time.value = data.fulldate;
+	}
+	
+	// 打开弹窗
+	function handleShow() {
+		birthdayPopup.value.open();
+	}
+	// 取消
+	function handleClose() {
+		passClear();
+		birthdayPopup.value.close();
+	}
+	// 确认
+	function confirmBtn(){
+		if(time.value){
+			$emit('confirm-btn',time.value);
+			passClear();
+			birthdayPopup.value.close();
+		}else{
+			toast('请选择日期')
+		}
+		
+	}
+	defineExpose({
+			handleShow,
+			handleClose
+		})
+</script>
+
+<style>
+</style>

pages/my/components/passwordDialog.vue

@@ -0,0 +1,103 @@
+<template>
+	<uni-popup ref="passwordPopup" :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">修改密码</view>
+			<view class="common-input-box">
+				<view class="common-input-row">
+					<text class="common-input-label"><text class="common-label-require">*</text>原密码：</text>
+					<input class="common-input" v-model="data.oldPassWord"  placeholder="请输入原密码" />
+				</view>
+				<view class="common-input-row">
+					<text class="common-input-label"><text class="common-label-require">*</text>新密码：</text>
+					<input class="common-input" v-model="data.newPassWord"  placeholder="请输入新密码" />
+				</view>
+				<view class="common-input-row">
+					<text class="common-input-label"><text class="common-label-require">*</text>确认密码：</text>
+					<input class="common-input" v-model="data.okPassWord"  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,reactive} from "vue"
+	const props = defineProps({
+	  notBtn: {
+	    type: String,
+	  	require: true,
+	    default: '取消'
+	  },
+	  okBtn: {
+	    type: String,
+	  	require: true,
+	    default: '确认'
+	  },
+	});
+	const data = reactive({
+		okPassWord: '',
+		oldPassWord: '',
+		newPassWord: '',
+	})
+	const passwordPopup = ref(null); // 索引
+	const $emit = defineEmits(['confirm-btn'])
+	
+	function passClear(){
+		data.okPassWord = '';
+		data.oldPassWord = '';
+		data.newPassWord = '';
+	}
+	// 打开弹窗
+	function handleShow() {
+		passwordPopup.value.open();
+	}
+	// 取消
+	function handleClose() {
+		passClear();
+		passwordPopup.value.close();
+	}
+	// 确认
+	function confirmBtn(){
+		let arr = [];
+		if (!data.oldPassWord) {
+			arr.push('原密码');
+		}
+		if (!data.newPassWord) {
+			arr.push('新密码');
+		}
+		if (!data.newPassWord) {
+			arr.push('确认密码');
+		}
+		if (!data.oldPassWord || !data.newPassWord) {
+			uni.showToast({
+				icon: 'none',
+				title: `请输入${arr.join('、')}信息！`
+			})
+			return;
+		}
+		if (data.newPassWord != data.okPassWord) {
+			uni.showToast({
+				icon: 'none',
+				title: '新密码和确认密码不同'
+			})
+			return;
+		}
+		$emit('confirm-btn',data);
+		passClear();
+		passwordPopup.value.close();
+	}
+	defineExpose({
+			handleShow,
+			handleClose
+		})
+</script>
+
+<style>
+</style>