瀏覽代碼

样式优化

tanxue 2 月之前
父節點
當前提交
6078e25e10

+ 25 - 14
common/styles/global/components.scss

@@ -156,19 +156,6 @@ view{box-sizing: border-box;}
 	.v-tabs__container-line.animation{height:4rpx!important;background-color: #3fd2a1!important;}
 }
 	
-/***** 通用弹窗  *****/		
-.phone-common-dialog{
-	width: 660rpx;border-radius: 12rpx;background-color: #fff;padding-top: 24rpx;
-	.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;}
-	.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: #3fd2a1;}
-}	
 /***** 查询框  *****/	
 .phone-search-box{
 	width: 100%;height: 110rpx;background-color:#f4f6fa;
@@ -386,4 +373,28 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 	display: flex;align-items: center;justify-content: center;border-radius: 8rpx;
 	text{font-size: 42rpx;color:#d7d7d7;}
 }
-.upload-bottom-text {font-size: 24rpx;color: #666;text-align: center;margin-top: 10rpx;}
+.upload-bottom-text {font-size: 24rpx;color: #666;text-align: center;margin-top: 10rpx;}
+
+/***** 通用弹窗  *****/		
+.phone-common-dialog{
+	width: 660rpx;border-radius: 12rpx;background-color: #fff;padding-top: 24rpx;
+	.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: 30rpx;color: #333;text-align: right;}
+		.common-input{
+			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;}
+	}
+	.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: #3fd2a1;}
+	
+}	

+ 14 - 0
common/styles/global/pages.scss

@@ -410,6 +410,19 @@
 		.idcard-icon{background-image: url("@/static/images/my/my-idcard-icon.png");}
 		.content-text{font-size: 30rpx;margin-left: 10rpx;}
 	}
+	// admin
+	.admin-head-box{
+		background-color: #fff;box-sizing: border-box;padding: 30rpx 36rpx;border-radius: 12rpx;
+		display: flex;justify-content: space-around;margin: -180rpx 20rpx 20rpx;
+		.head-content-box{font-size: 32rpx;color: #333;}
+		.tel-icon{background-image: url("@/static/images/my/my-tel-green-icon.png");}
+		.idcard-icon{background-image: url("@/static/images/my/my-idcard-green-icon.png");}
+	}
+	.jzgs-name-box{
+		width: 100%;height: 376rpx;text-align: center;font-size: 34rpx;color: #fff;
+		box-sizing: border-box;padding-top: 100rpx;font-weight: 600;
+		background-image: url("@/static/images/my/admin-my-bj.png");@include ezy-no-repeat-cover(top);
+	}
 	
 	// num
 	.my-num-box{
@@ -439,6 +452,7 @@
 		.list-row:last-child{border: 0;}
 		.list-icon{width: 42rpx;height: 42rpx;@include ezy-no-repeat-cover;margin-right: 32rpx;}
 		.user-icon{background-image: url("@/static/images/my/my-editor-icon.png");}
+		.mm-icon{background-image: url("@/static/images/login/login-lock-icon.png");}
 		.score-icon{background-image: url("@/static/images/my/my-score-icon.png");}
 		.login-out-icon{background-image: url("@/static/images/my/login-out-icon.png");}
 		.sxtcs-icon{background-image: url("@/static/images/my/my-sxtcs-icon.png");}

+ 15 - 11
pages/admin/my/index.vue

@@ -1,6 +1,9 @@
 <template>
 	<view class="client-my-page">
-		<view class="my-head-box">
+		<view class="jzgs-name-box">
+			<text>家政公司名称</text>
+		</view>
+		<view class="admin-head-box">
 			<view class="head-img-box">
 				<img class="head-img" :src="myInfoData.userImg" v-if="myInfoData.userImg">
 				<icon class="phone-default-userImg" v-else></icon>
@@ -23,13 +26,9 @@
 				<icon class="list-icon user-icon"></icon>
 				<text>修改个人信息</text>
 			</view>
-			<view class="list-row" @click="showZhuaPaiConfirm">
-				<icon class="list-icon sxtcs-icon"></icon>
-				<text>摄像头测试</text>
-			</view>
-			<view class="list-row" @click="showMessageDl">
-				<icon class="list-icon sxtsm-icon"></icon>
-				<text>摄像头说明</text>
+			<view class="list-row" @click="xgmmBtn">
+				<icon class="list-icon mm-icon"></icon>
+				<text>修改密码</text>
 			</view>
 			<view class="list-row" @click="exitLogin">
 				<icon class="list-icon login-out-icon"></icon>
@@ -37,10 +36,10 @@
 			</view>
 		</view>
 		<!-- 底部区域 -->
-		<customTabbarClient :currentTab="1"></customTabbarClient>
-		<common-dialog ref="commonDialogRef" :title="exitTitle" :content="exitContent"@confirm-btn="exitBtn"></common-dialog>
+		<customTabbarClient :currentTab="2"></customTabbarClient>
+		<common-dialog ref="commonDialogRef" :title="exitTitle" :content="exitContent" @confirm-btn="exitBtn"></common-dialog>
 		<shexiangDialogVue ref="shexiangRef" title="摄像头说明"></shexiangDialogVue>
-		
+		<password-dialog ref="passwordDialogRef" :title="修改密码" @confirm-btn="passwordBtn"></password-dialog>
 		<!-- 摄像头确认 -->
 		<zhuapaiConfrimVue ref="zpRef" @error="zpConfirmError" title="摄像头测试"></zhuapaiConfrimVue>
 	</view>
@@ -54,6 +53,7 @@
 	import {reactive,ref} from "vue";
 	import customTabbarClient from "@/components/custom-tabbar/custom-tabbar-admin.vue"
 	import commonDialog from '@/components/dialog/commonDialog.vue';
+	import passwordDialog from './passwordDialog.vue';
 	import shexiangDialogVue from "@/components/dialog/shexiangDialog.vue";
 	import zhuapaiConfrimVue from "@/components/zhuapaiConfirm/index.vue";
 	
@@ -68,6 +68,7 @@
 		from:''
 	});
 	const commonDialogRef = ref(null);
+	const passwordDialogRef = ref(null);
 	const shexiangRef = ref(null);
 	const zpRef = ref(null);
 	const exitContent = '你确定要执行这个操作吗?';
@@ -105,6 +106,9 @@
 		commonDialogRef.value.handleShow();
 		
 	}
+	function xgmmBtn(){
+		passwordDialogRef.value.handleShow();
+	}
 	function exitBtn(){
 		getMineLogout().then(res => {
 			toast('退出登录成功')

+ 1 - 16
pages/admin/my/myInfo.vue

@@ -5,18 +5,6 @@
 			<view @click="handleBack" class="nav-bar-icon"></view>
 			<text class="nav-bar-title">个人信息</text>
 		</view>
-		<!-- 头像 -->
-		<view class="user-img-box">
-			
-			<uni-file-picker limit="1" :del-icon="false" disable-preview :auto-upload="false"
-				@select="handleSelect" file-mediatype="image" class="phone-file-picker user-file-picker">
-				<text class="user-title">头像</text>
-				<img class="head-img" :src="data.icon" v-if="data.icon">
-				<icon class="phone-default-userImg" v-else></icon>
-				<icon class="user-jt-icon"></icon>
-			</uni-file-picker>
-			<!-- <view>图片地址:{{data.icon}}</view> -->
-		</view>
 		<!-- 姓名 -->
 		<view class="form-label-input">
 			<view class="phone-form-label"><text class="form-label-require">*</text>姓名</view>
@@ -151,10 +139,7 @@
 		if (!data.userName) {
 			arr.push('电话');
 		}
-		if (!data.icon) {
-			arr.push('头像');
-		}
-		if (!data.realName || !data.userName||!data.icon) {
+		if (!data.realName || !data.userName) {
 			uni.showToast({
 				icon: 'none',
 				title: `请完善${arr.join('、')}信息!`

+ 86 - 0
pages/admin/my/passwordDialog.vue

@@ -0,0 +1,86 @@
+<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="form-label-input">
+					<view class="phone-form-label"><text class="form-label-require">*</text>原密码</view>
+					<input v-model="data.oldPassWord"  placeholder="请输入原密码" />
+					<icon></icon>
+				</view>
+				<view class="form-label-input">
+					<view class="phone-form-label"><text class="form-label-require">*</text>新密码</view>
+					<input v-model="data.newPassWord"  placeholder="请输入新密码" />
+					<icon></icon>
+				</view>
+				<view class="form-label-input">
+					<view class="phone-form-label"><text class="form-label-require">*</text>确认密码</view>
+					<input v-model="data.okPassWord"  placeholder="请确认密码" />
+					<icon></icon>
+				</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.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 handleShow() {
+		passwordPopup.value.open();
+	}
+	// 取消
+	function handleClose() {
+		passwordPopup.value.close();
+	}
+	// 确认
+	function confirmBtn(){
+		$emit('confirm-btn');
+		passwordPopup.value.close();
+	}
+	defineExpose({
+			handleShow,
+			handleClose
+		})
+</script>
+
+<style>
+</style>

二進制
static/images/my/admin-my-bj.png