From 05707c8c6adb1042597c52091ad25ed64d15bb55 Mon Sep 17 00:00:00 2001
From: litian <C21AF165>
Date: 星期四, 21 三月 2024 14:38:19 +0800
Subject: [PATCH] 设置
---
packagePersonal/pages/userSetting/index.wxml | 71 ++++++++--
packagePersonal/pages/userSetting/index.wxss | 86 ++++++++++++
packagePersonal/pages/userSetting/index.json | 4
pages/personalCenter/index.js | 6
packagePersonal/pages/userSetting/index.js | 241 ++++++++++++++++++++++++++++++++++
5 files changed, 391 insertions(+), 17 deletions(-)
diff --git a/packagePersonal/pages/userSetting/index.js b/packagePersonal/pages/userSetting/index.js
index 3f131a4..48c0a70 100644
--- a/packagePersonal/pages/userSetting/index.js
+++ b/packagePersonal/pages/userSetting/index.js
@@ -7,7 +7,18 @@
data: {
userInfo: {},
defaultAvatarUrl: 'https://cdn-we-retail.ym.tencent.com/miniapp/usercenter/icon-user-center-avatar@2x.png',
- visible: false
+ userInfoBox: false,
+ editType: '',
+ userInfoForm: {
+ phone: '',
+ email: '',
+ captcha: '',
+ code: '',
+ },
+ phoneError: false,
+ emailError: false,
+ imgCode: '',
+ countDown: 0,
},
/**
@@ -79,7 +90,235 @@
}
});
},
+ //淇敼鐢ㄦ埛绫诲瀷
+ editUserInfo(e) {
+ console.log(e)
+ let { info } = e.currentTarget.dataset
+ if (!this.data.userInfoBox) {
+ this.setData({
+ userInfoBox: true,
+ editType: info,
+ "userInfoForm.captcha": "",
+ "userInfoForm.code": ""
+ });
+ }
+ this.getImgCapcha()
+ },
+ onVisibleChange(e) {
+ this.setData({
+ userInfoBox: e.detail.visible,
+ countDown: 0,
+ });
+ },
+ //杈撳叆鎵嬫満鍙�
+ onPhoneInput(e) {
+ console.log(e)
+ const { phoneError } = this.data;
+ const isPhoneNumber = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/.test(e.detail.value);
+ if (phoneError === isPhoneNumber) {
+ this.setData({
+ phoneError: !isPhoneNumber,
+ "userInfoForm.phone": e.detail.value,
+ });
+ }
+ },
+
+ onEmailInput(e) {
+ const { emailError } = this.data;
+ const isPhoneNumber = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/.test(e.detail.value);
+ if (emailError === isPhoneNumber) {
+ this.setData({
+ emailError: !isPhoneNumber,
+ "userInfoForm.email": e.detail.value,
+ });
+ }
+ },
+
+ getImgCapcha() {
+ app.MG.identity.getImgCode().then((res) => {
+ this.setData({
+ imgCode: 'data:image/png;base64,' + res,
+ });
+ })
+ },
+ //鍥惧舰楠岃瘉鐮�
+ onCaptchaInput(e) {
+ this.setData({
+ "userInfoForm.captcha": e.detail.value,
+ });
+ },
+
+ //鐭俊閭楠岃瘉鐮�
+ onCodeInput(e) {
+ this.setData({
+ "userInfoForm.code": e.detail.value,
+ });
+ },
+
+ getPhoneCode() {
+ if (this.data.userInfoForm.phone && this.data.userInfoForm.captcha) {
+ app.MG.identity
+ .getPhoneCode({
+ phoneNumber: this.data.userInfoForm.phone,
+ imageCaptcha: this.data.userInfoForm.captcha,
+ appRefCode: app.config.appRefCode
+ })
+ .then((res) => {
+ if (res == '楠岃瘉鐮佸彂閫佹垚鍔�') {
+ wx.showToast({
+ title: res,
+ icon: 'none',
+ duration: 1000
+ })
+ // 寮�鍚煭淇￠獙璇佸�掕鏃�
+ this.getSecond(60)
+ } else {
+ wx.showToast({
+ title: res,
+ icon: 'none',
+ duration: 1000
+ })
+ this.getImgCapcha()
+ }
+ })
+ } else {
+ wx.showToast({
+ title: '璇峰～鍐欐墜鏈哄彿鎴栧浘褰㈤獙璇佺爜',
+ icon: 'none',
+ duration: 1000
+ })
+ }
+ },
+ getSecond(time) {
+ let timer = null
+ if (!timer) {
+ let countDown = time;
+ this.setData({
+ countDown: time,
+ });
+ timer = setInterval(() => {
+ countDown--
+ this.setData({
+ countDown: countDown,
+ });
+ if (this.data.countDow == 0) {
+ clearInterval(timer)
+ timer = null
+ }
+ }, 1000)
+ }
+ },
+
+ getEmailCode() {
+ console.log(this.data.userInfoForm.email)
+ if (this.data.userInfoForm.email && this.data.userInfoForm.captcha) {
+ app.MG.identity
+ .getEmailCode({
+ sendEmail: this.data.userInfoForm.email,
+ captcha: this.data.userInfoForm.captcha,
+ appRefCode: app.config.appRefCode
+ })
+ .then((res) => {
+ if (res == true) {
+ wx.showToast({
+ title: '楠岃瘉鐮佸凡鍙戦��',
+ icon: 'none',
+ duration: 1000
+ })
+ // 寮�鍚煭淇￠獙璇佸�掕鏃�
+ this.getSecond(60)
+ } else {
+ wx.showToast({
+ title: '閭楠岃瘉鐮佸彂閫佸け璐�',
+ icon: 'none',
+ duration: 1000
+ })
+ this.getImgCapcha()
+ }
+ })
+ } else {
+ wx.showToast({
+ title: '璇峰～鍐欓偖绠辨垨鍥惧舰楠岃瘉鐮�',
+ icon: 'none',
+ duration: 1000
+ })
+ }
+ },
+
+ confirmInfo() {
+ if (this.data.changeType == 'phone') {
+ let query = {
+ phoneNumber: this.data.userInfoForm.phone,
+ phoneCaptcha: this.data.userInfoForm.code
+ }
+ app.MG.identity.userSetPhoneNumber(query).then((res) => {
+ if (res == '楠岃瘉鐮佽繃鏈熸垨閿欒') {
+ wx.showToast({
+ title: res + ',璇风◢鍚庨噸璇�',
+ icon: 'none',
+ duration: 1000
+ })
+ } else if (res == '姝ゆ墜鏈哄彿鐮佸凡琚叾瀹冭处鍙风粦瀹�') {
+ wx.showToast({
+ title: res + ',璇锋洿鎹㈠叾浠栨墜鏈哄彿銆�',
+ icon: 'none',
+ duration: 1000
+ })
+ } else {
+ wx.showToast({
+ title: res,
+ icon: 'none',
+ duration: 1000
+ })
+
+ this.setData({
+ userInfoBox: false,
+ });
+ this.getUserInfo()
+ }
+ })
+ } else if (this.data.editType == 'email') {
+ let query = {
+ eMail: this.data.userInfoForm.email,
+ captcha: this.data.userInfoForm.code
+ }
+
+ app.MG.identity.bindingEmail(query).then((res) => {
+ if (res == '楠岃瘉鐮佽繃鏈�') {
+ wx.showToast({
+ title: res + ',璇风◢鍚庨噸璇曘��',
+ icon: 'none',
+ duration: 1000
+ })
+ } else if (res == '姝ら偖绠卞凡琚叾瀹冭处鍙风粦瀹�') {
+ wx.showToast({
+ title: res + ',璇锋洿鎹㈠叾浠栭偖绠便��',
+ icon: 'none',
+ duration: 1000
+ })
+
+ } else if (res == '楠岃瘉鐮佹棤鏁�') {
+ wx.showToast({
+ title: res,
+ icon: 'none',
+ duration: 1000
+ })
+ } else {
+ wx.showToast({
+ title: res,
+ icon: 'none',
+ duration: 1000
+ })
+ this.setData({
+ userInfoBox: false,
+ });
+ this.getUserInfo()
+ }
+ })
+ }
+
+ },
/**
* 椤甸潰鐩稿叧浜嬩欢澶勭悊鍑芥暟--鐩戝惉鐢ㄦ埛涓嬫媺鍔ㄤ綔
*/
diff --git a/packagePersonal/pages/userSetting/index.json b/packagePersonal/pages/userSetting/index.json
index 5ce906a..1be7702 100644
--- a/packagePersonal/pages/userSetting/index.json
+++ b/packagePersonal/pages/userSetting/index.json
@@ -2,6 +2,8 @@
"navigationBarTitleText": "璁剧疆",
"usingComponents": {
"t-icon": "tdesign-miniprogram/icon/icon",
- "t-avatar": "tdesign-miniprogram/avatar/avatar"
+ "t-avatar": "tdesign-miniprogram/avatar/avatar",
+ "t-popup": "tdesign-miniprogram/popup/popup",
+ "t-input": "tdesign-miniprogram/input/input"
}
}
\ No newline at end of file
diff --git a/packagePersonal/pages/userSetting/index.wxml b/packagePersonal/pages/userSetting/index.wxml
index 52ab0e9..51c6a17 100644
--- a/packagePersonal/pages/userSetting/index.wxml
+++ b/packagePersonal/pages/userSetting/index.wxml
@@ -13,28 +13,71 @@
</view>
<view class="itemList">
<view class="label">鎵嬫満鍙风爜</view>
- <view class="content">{{userInfo.phoneNumber || '鏈粦瀹氭墜鏈哄彿'}}</view>
+ <view class="content" data-info="{{'phone'}}" bindtap="editUserInfo">{{userInfo.phoneNumber || '鏈粦瀹氭墜鏈哄彿'}}</view>
<t-icon name="chevron-right" size="40rpx" color="#C2C2C2" />
</view>
<view class="itemList">
<view class="label">閭</view>
- <view class="content">{{userInfo.Email}}</view>
+ <view class="content" data-info="{{'email'}}" bindtap="editUserInfo">{{userInfo.Email}}</view>
<t-icon name="chevron-right" size="40rpx" color="#C2C2C2" />
</view>
-</view>
-<t-popup visible="{{visible}}" bind:visible-change="onVisibleChange" placement="bottom">
- <view class="block">
- <view class="header">
- <view class="title">璇烽�夋嫨鎮ㄧ殑鐢ㄦ埛绫诲瀷</view>
- </view>
- <view class="body">
+ <t-popup visible="{{userInfoBox}}" bind:visible-change="onVisibleChange" placement="bottom">
+ <view class="block">
+ <view class="body">
+ <view class="from-item" wx:if="{{editType == 'phone'}}">
+ <view class="label"> 鎵嬫満鍙凤細 </view>
+ <view class="item-content">
+ <view class="inputBox1">
+ <t-input placeholder="杈撳叆鎵嬫満鍙风爜" borderless value="{{userInfoForm.phone}}" type="number" tips="{{phoneError ? '鎵嬫満鍙疯緭鍏ヤ笉姝ｇ‘' : ''}}" bindchange="onPhoneInput" />
+ </view>
+ </view>
+ </view>
+ <view class="from-item" wx:if="{{editType == 'email'}}">
+ <view class=" label"> 閭锛� </view>
+ <view class="item-content">
+ <view class="inputBox1">
+ <t-input placeholder="杈撳叆閭" borderless value="{{userInfoForm.email}}" type="number" tips="{{emailError ? '閭杈撳叆涓嶆纭�' : ''}}" bindchange="onEmailInput" />
+ </view>
+ </view>
+ </view>
+ <view class="from-item">
+ <view class="label"> 鍥惧舰楠岃瘉鐮侊細 </view>
+ <view class="item-content">
+ <view class="inputBox">
+ <t-input placeholder="杈撳叆鍥惧舰楠岃瘉鐮�" borderless value="{{userInfoForm.captcha}}" type="number" bindchange="onCaptchaInput" />
+ </view>
+ <view class="code">
+ <image src="{{imgCode}}" class="imgCode hover" bindtap="getImgCapcha" />
+ </view>
+ </view>
- <view wx:for="{{userTypeList}}" wx:for-item="item" wx:for-index="index" wx:key="index" data-info="{{item}}" bindtap="tabUserTypeClick" class="{{item.value === userTypeActive ? 'activeItem item' : 'item'}}">
- {{ item.lable }}
+ </view>
+ <view class="from-item" wx:if="{{editType == 'phone'}}">
+ <view class="label"> 鐭俊楠岃瘉鐮侊細 </view>
+ <view class="item-content">
+ <view class="inputBox">
+ <t-input placeholder="杈撳叆鐭俊楠岃瘉鐮�" borderless value="{{userInfoForm.code}}" type="number" bindchange="onCodeInput" />
+ </view>
+ <view class="code">
+ <button class="btn" bindtap="getPhoneCode">{{countDown > 0 ? countDown : '鑾峰彇鐭俊楠岃瘉鐮�'}}</button>
+ </view>
+ </view>
+ </view>
+ <view class="from-item" wx:if="{{editType == 'email'}}">
+ <view class="label"> 閭楠岃瘉鐮侊細 </view>
+ <view class="item-content">
+ <view class="inputBox">
+ <t-input placeholder="杈撳叆閭楠岃瘉鐮�" borderless value="{{userInfoForm.code}}" type="number" bindchange="onCodeInput" />
+ </view>
+ <view class="code">
+ <button class="btn" bindtap="getEmailCode">鑾峰彇閭楠岃瘉鐮�</button>
+ </view>
+ </view>
+ </view>
</view>
</view>
<view class="footer">
- <button class="submit" bindtap="submit">纭畾</button>
+ <button class="submit" bindtap="confirmInfo">纭畾</button>
</view>
- </view>
-</t-popup>
\ No newline at end of file
+ </t-popup>
+</view>
\ No newline at end of file
diff --git a/packagePersonal/pages/userSetting/index.wxss b/packagePersonal/pages/userSetting/index.wxss
index 31d6148..be5d1e4 100644
--- a/packagePersonal/pages/userSetting/index.wxss
+++ b/packagePersonal/pages/userSetting/index.wxss
@@ -11,9 +11,10 @@
justify-content: space-between !important;
}
-.label {
+.itemList .label {
font-weight: bold;
width: 180rpx;
+ font-size: 32rpx;
}
.contentImg {
@@ -34,4 +35,87 @@
.content {
flex: 1;
color: #5C5C5C;
+ font-size: 32rpx;
+}
+
+.block {
+ width: 100vw;
+ background: #fff;
+ border-top-left-radius: 16rpx;
+ border-top-right-radius: 16rpx;
+}
+
+.block .body {
+ padding: 40rpx;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+}
+
+.block .body .from-item {
+ margin-bottom: 20rpx;
+ display: flex;
+ align-items: center;
+}
+
+.block .body .from-item .label {
+ width: 170rpx;
+ height: 72rpx;
+ line-height: 72rpx;
+ font-size: 28rpx;
+}
+
+.block .body .from-item .item-content {
+ padding: 10rpx;
+ flex: 1;
+ display: flex;
+}
+
+.inputBox1 {
+ width: 540rox;
+ height: 72rpx;
+ border: 2rpx solid #D9D9D9;
+ flex: 1;
+}
+
+.block .body .inputBox {
+ width: 280rpx;
+ height: 72rpx;
+ border: 2rpx solid #D9D9D9;
+}
+
+.t-input {
+ padding: 10rpx !important;
+}
+
+.imgCode {
+ height: 72rpx;
+ width: 200rpx;
+}
+
+.code {
+ width: 200rpx;
+ height: 72rpx;
+ margin-left: 20rpx;
+}
+
+.btn {
+ width: 200rpx;
+ height: 72rpx;
+ padding: 0 10rpx !important;
+ background: #ff6c00;
+ border: 2rpx solid #ff6c00;
+ color: #fff;
+ font-size: 28rpx;
+}
+
+.footer {
+ width: 80%;
+ margin: 10rpx auto;
+}
+
+.submit {
+ background: #ff6c00;
+ color: #fff;
+ border-radius: 50rpx;
}
\ No newline at end of file
diff --git a/pages/personalCenter/index.js b/pages/personalCenter/index.js
index f4dfc6b..7ece773 100644
--- a/pages/personalCenter/index.js
+++ b/pages/personalCenter/index.js
@@ -318,6 +318,12 @@
}
},
+ onPageScroll(e) {
+ this.setData({
+ isWhite: e.scrollTop > 20 ? true : false
+ })
+ },
+
/**
* 鐢ㄦ埛鐐瑰嚮鍙充笂瑙掑垎浜�
*/
--
Gitblit v1.9.1