stlye:添加手机增加找回密码跳转

common/js/env.js

@@ -1,7 +1,7 @@
 "use strict";
 
-// let baseUrl = `https://jje.admin.xinyuekj.com.cn`
-let baseUrl = `http://127.0.0.1:9000`
+let baseUrl = `https://jje.admin.xinyuekj.com.cn`
+// let baseUrl = `http://127.0.0.1:9000`
 // let baseUrl = `http://192.168.1.150:8080`
 
 // 变量可自行添加修改

myPages/setting/setting-telphone.vue

@@ -1,315 +1,337 @@
 <template>
   <view class="container">
     <view class="login-wrap">
-		<view class="login-form">
-			<u--form
-				labelPosition="left"
-				:model="userInfo"
-				:rules="rules"
-				ref="form1"
-			>
-				<u-form-item
-					label="手机号"
-					prop="phonenumber"
-					labelWidth="auto"
-					labelAlign="right"
-				  >
-				<u--input
-					v-model="userInfo.phonenumber"
-					placeholder="请输入手机号"
-					border="bottom"
-					type="number"
-					maxlength="11"
-				></u--input>
-			  </u-form-item>
-			  <u-form-item
-					labelWidth="auto"
-					labelAlign="right"
-					label="验证码"
-					prop="smsCode"
-					width="120"
-				>
-				<u--input
-					v-model="userInfo.smsCode"
-					disabledColor="#ffffff"
-					placeholder="请输入验证码"
-					border="bottom"
-					maxlength="4"
-				></u--input>
-				<template #right>
-					<view class="identifying-code">
-						<u-code
-							ref="uCode3"
-							@change="codeChange2"
-							keep-running
-							start-text="获取验证码"
-						></u-code>
-						<text
-							@tap="getCode2"
-							:text="tips2"
-							class="u-page__code-text"
-						>{{tips2}}</text>
-					</view>
-				</template>
+      <view class="login-form">
+        <u--form
+            labelPosition="left"
+            :model="userInfo"
+            :rules="rules"
+            ref="form1"
+        >
+          <u-form-item
+              label="手机号"
+              prop="phonenumber"
+              labelWidth="auto"
+              labelAlign="right"
+          >
+            <u--input
+                v-model="userInfo.phonenumber"
+                placeholder="请输入手机号"
+                border="bottom"
+                type="number"
+                maxlength="11"
+            ></u--input>
+          </u-form-item>
+          <u-form-item
+              labelWidth="auto"
+              labelAlign="right"
+              label="验证码"
+              prop="smsCode"
+              width="120"
+          >
+            <u--input
+                v-model="userInfo.smsCode"
+                disabledColor="#ffffff"
+                placeholder="请输入验证码"
+                border="bottom"
+                maxlength="4"
+            ></u--input>
+            <template #right>
+              <view class="identifying-code">
+                <u-code
+                    ref="uCode3"
+                    @change="codeChange2"
+                    keep-running
+                    start-text="获取验证码"
+                ></u-code>
+                <text
+                    @tap="getCode2"
+                    :text="tips2"
+                    class="u-page__code-text"
+                >{{ tips2 }}
+                </text>
+              </view>
+            </template>
 
-			  </u-form-item>
-			</u--form>
-		</view>
-	</view>
+          </u-form-item>
+          <view style="font-size: 26rpx">
+            请输入您在娇骄儿的会员手机号，如需要找回账号请点击
+            <navigator url="/loginPages/login/retrieve-account">
+              <text style="color: #007aff">找回账号</text>
+              。
+            </navigator>
 
-	<view v-if="errTipShow" class="h-err">
-		<text>你输入的手机号码已存在，请换一个</text>
-	</view>
+          </view>
 
-	<view @click="setPhone()" class="op-btn-wrap">
-		<view class="h-btn">
-			<text>确定</text>
-		</view>
-	</view>
+        </u--form>
+      </view>
+    </view>
+
+    <view v-if="errTipShow" class="h-err">
+      <text>你输入的手机号码已存在，请换一个</text>
+    </view>
+
+    <view @click="setPhone()" class="op-btn-wrap">
+      <view class="h-btn">
+        <text>确定</text>
+      </view>
+    </view>
 
 
   </view>
 </template>
- <script>
+<script>
 
 export default {
-	data() {
-		return {
-			errTipShow: false,
-			errShow: false,
-			userInfo: {
-				auth: true,
-				phonenumber: '',
-				phone: '',
-				smsCode: '',
-				openId: '',
-				password: "",
-				transactionPassword: "",
-				reference: "",
-				type: '' // 实名认证创建新账号
-			},
-			tips2: '',
-			rules: {
-				phonenumber:  [
-					{
-						required: true,
-						min: 10,
-						max: 12,
-						message: '请输入11位电话号码',
-						trigger: ['blur', 'change'],
-					},
-					{
-						// 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
-						validator: (rule, value, callback) => {
-							// 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
-							return !this.$isDataEmpty(value);
-						},
-						message: "请认真填写电话号码",
-						trigger: ['blur', 'change'],
-					}
-				],
-				smsCode: {
-					required: true,
-					min: 4,
-					max: 6,
-					message: '请输入4位验证码',
-					trigger: ['blur', 'change'],
-				},
-			},
-		}
-	},
-	onLoad(option) {
-	},
-	onReady() {
-		this.$refs.form1.setRules(this.rules)
-	},
-	methods: {
+  data() {
+    return {
+      errTipShow: false,
+      errShow: false,
+      userInfo: {
+        auth: true,
+        phonenumber: '',
+        phone: '',
+        smsCode: '',
+        openId: '',
+        password: "",
+        transactionPassword: "",
+        reference: "",
+        type: '' // 实名认证创建新账号
+      },
+      tips2: '',
+      rules: {
+        phonenumber: [
+          {
+            required: true,
+            min: 10,
+            max: 12,
+            message: '请输入11位电话号码',
+            trigger: ['blur', 'change'],
+          },
+          {
+            // 此为同步验证，可以直接返回true或者false，如果是异步验证，稍微不同，见下方说明
+            validator: (rule, value, callback) => {
+              // 调用uView自带的js验证规则，详见：https://www.uviewui.com/js/test.html
+              return !this.$isDataEmpty(value);
+            },
+            message: "请认真填写电话号码",
+            trigger: ['blur', 'change'],
+          }
+        ],
+        smsCode: {
+          required: true,
+          min: 4,
+          max: 6,
+          message: '请输入4位验证码',
+          trigger: ['blur', 'change'],
+        },
+      },
+    }
+  },
+  onLoad(option) {
+  },
+  onReady() {
+    this.$refs.form1.setRules(this.rules)
+  },
+  methods: {
 
-		getUserInfo(){
-			this.$api.getUserInfo().then(res=>{
-				uni.setStorageSync('userInfo',res.data.data)
-			})
+    getUserInfo() {
+      this.$api.getUserInfo().then(res => {
+        uni.setStorageSync('userInfo', res.data.data)
+      })
 
-		},
-		// 验证电话号码是否存在
-		saveSetPhoneData(){
-			let that = this;
-			// 验证电话号码是否存在
-			this.$api.setPhone(this.userInfo).then((res)=>{
-				uni.showToast({
-					title: '绑定成功'
-				})
-				this.getUserInfo()
-				setTimeout(function() {
-				   // 绑定成功，返回我的页面
-				   uni.switchTab({
-				     url: '/pages/my/index',
-				   });
-				}, 2000); // 延迟2秒执行
-			}).catch(() =>{
-				uni.showToast({
-					title: "操作失败"
-				})
-			});
-		},
-		// 去绑定账号密码页面
-		setPhone(){
-			let that = this;
-			this.$refs.form1.validate().then(res => {
-				that.saveSetPhoneData();
-			}).catch(errors => {
-				uni.$u.toast('校验失败,请认真填写')
-			})
-		},
-		codeChange2(text) {
-			this.tips2 = text;
-		},
-		getCode2() {
-			let that = this;
-			if (this.$refs.uCode3.canGetCode) {
-				that.getSmsCode();
-			} else {
-				uni.$u.toast('倒计时结束后再发送');
-			}
-		},
-		// 获取手机验证码
-		getSmsCode(){
-			let that = this;
-			if(!this.userInfo.phonenumber){
-				uni.$u.toast('请认真填写手机号');
-				return;
-			}
+    },
+    // 验证电话号码是否存在
+    saveSetPhoneData() {
+      let that = this;
+      // 验证电话号码是否存在
+      this.$api.setPhone(this.userInfo).then((res) => {
+        uni.showToast({
+          title: '绑定成功'
+        })
+        this.getUserInfo()
+        setTimeout(function () {
+          // 绑定成功，返回我的页面
+          uni.switchTab({
+            url: '/pages/my/index',
+          });
+        }, 2000); // 延迟2秒执行
+      }).catch(() => {
+        uni.showToast({
+          title: "操作失败"
+        })
+      });
+    },
+    // 去绑定账号密码页面
+    setPhone() {
+      let that = this;
+      this.$refs.form1.validate().then(res => {
+        that.saveSetPhoneData();
+      }).catch(errors => {
+        uni.$u.toast('校验失败,请认真填写')
+      })
+    },
+    codeChange2(text) {
+      this.tips2 = text;
+    },
+    getCode2() {
+      let that = this;
+      if (this.$refs.uCode3.canGetCode) {
+        that.getSmsCode();
+      } else {
+        uni.$u.toast('倒计时结束后再发送');
+      }
+    },
+    // 获取手机验证码
+    getSmsCode() {
+      let that = this;
+      if (!this.userInfo.phonenumber) {
+        uni.$u.toast('请认真填写手机号');
+        return;
+      }
 
-			// 验证电话号码是否存在
-			this.$api.phoneIsExist(this.userInfo).then((res)=>{
-				if(res.phoneIsExist){ // 存在
-					that.errTipShow = true;
-					setTimeout(() => {
-						that.errTipShow = false;
-					    // 在这里编写延迟执行的代码
-						that.userInfo.phonenumber = null;
-					}, 3000);
-				} else {
-					that.getPhoneCode();
-				}
-			}).catch(() =>{
-				uni.showToast({
-					title: "操作失败",
-					duration: 3000
-				})
-			});
+      // 验证电话号码是否存在
+      this.$api.phoneIsExist(this.userInfo).then((res) => {
+        if (res.phoneIsExist) { // 存在
+          that.errTipShow = true;
+          setTimeout(() => {
+            that.errTipShow = false;
+            // 在这里编写延迟执行的代码
+            that.userInfo.phonenumber = null;
+          }, 3000);
+        } else {
+          that.getPhoneCode();
+        }
+      }).catch(() => {
+        uni.showToast({
+          title: "操作失败",
+          duration: 3000
+        })
+      });
 
 
-		},
-		// 获取验证码
-		getPhoneCode(){
-			let that = this;
-			// 模拟向后端请求验证码
-			uni.showLoading({
-				title: '正在获取验证码'
-			})
-			this.$api.getSmsCode({phonenumber:this.userInfo.phonenumber,auth: true}).then((res)=>{
-				uni.hideLoading();
-				// 这里此提示会被this.start()方法中的提示覆盖
-				uni.$u.toast('验证码已发送');
-				// 通知验证码组件内部开始倒计时
-				that.$refs.uCode3.start();
-			}).catch(() =>{
-				uni.showToast({
-					title: "操作失败"
-				})
-			});
-		},
-	}
+    },
+    // 获取验证码
+    getPhoneCode() {
+      let that = this;
+      // 模拟向后端请求验证码
+      uni.showLoading({
+        title: '正在获取验证码'
+      })
+      this.$api.getSmsCode({phonenumber: this.userInfo.phonenumber, auth: true}).then((res) => {
+        uni.hideLoading();
+        // 这里此提示会被this.start()方法中的提示覆盖
+        uni.$u.toast('验证码已发送');
+        // 通知验证码组件内部开始倒计时
+        that.$refs.uCode3.start();
+      }).catch(() => {
+        uni.showToast({
+          title: "操作失败"
+        })
+      });
+    },
+  }
 }
 </script>
 <style lang="scss">
-page,body{
-	background: #fff;
+page, body {
+  background: #fff;
 }
 
-.h-err{
-	color: red;
-	text-align: center;
-	font-size: 14px;
+.h-err {
+  color: red;
+  text-align: center;
+  font-size: 14px;
 }
 
-.h-popo-content{
-	height: 170px;
-	padding: 12px;
-	width: 300px;
-	text-align: center;
-	font-size: 14px;
-	font-family: PingFangSC-Semibold, PingFang SC;
-	.h-img{
-		display: flex;
-		justify-content: center;
-	}
-	.h-text{
-		margin-top: 12px;
-		font-weight: 400;
-		color: #666666;
-	}
-	.text{
-		margin-top: 6px;
-		font-weight: 400;
-		color: #666666;
-	}
-	.h-btn-wrap{
-		display: flex;
-		justify-content: space-between;
-		color: #333333;
-		text-align: center;
-		margin-top: 14px;
-		.h-left-btn{
-			height: 32px;
-			line-height: 30px;
-			background: #EEEEEE;
-			width: 100px;
-			text-align: center;
-			border-radius: 16px;
-			margin: 0 auto;
-		}
-		.h-right-btn{
-			height: 32px;
-			line-height: 30px;
-			background: #FFE05C;
-			width: 100px;
-			border-radius: 16px;
-			margin: 0 auto;
+.h-popo-content {
+  height: 170px;
+  padding: 12px;
+  width: 300px;
+  text-align: center;
+  font-size: 14px;
+  font-family: PingFangSC-Semibold, PingFang SC;
+
+  .h-img {
+    display: flex;
+    justify-content: center;
+  }
+
+  .h-text {
+    margin-top: 12px;
+    font-weight: 400;
+    color: #666666;
+  }
+
+  .text {
+    margin-top: 6px;
+    font-weight: 400;
+    color: #666666;
+  }
+
+  .h-btn-wrap {
+    display: flex;
+    justify-content: space-between;
+    color: #333333;
+    text-align: center;
+    margin-top: 14px;
+
+    .h-left-btn {
+      height: 32px;
+      line-height: 30px;
+      background: #EEEEEE;
+      width: 100px;
+      text-align: center;
+      border-radius: 16px;
+      margin: 0 auto;
+    }
 
-		}
-	}
+    .h-right-btn {
+      height: 32px;
+      line-height: 30px;
+      background: #FFE05C;
+      width: 100px;
+      border-radius: 16px;
+      margin: 0 auto;
+
+    }
+  }
 }
 
-.container{
-	background: #fff;
-	height: 300px;
-	.login-wrap {
-		display: flex;
-		justify-content: center;
-		.login-form{
-			width: 90%;
-		}
-		.account{
-			display: flex;
-		}
-		.identifying-code{
-		}
-	}
-	.op-btn-wrap{
-		margin-top: 30px;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		.h-btn{
-			text-align: center;
-			width: 343px;
-			height: 42px;
-			background: #FFE05C;
-			border-radius: 27px;
-			line-height: 42px;
-		}
-	}
+.container {
+  background: #fff;
+  height: 300px;
+
+  .login-wrap {
+    display: flex;
+    justify-content: center;
+
+    .login-form {
+      width: 90%;
+    }
+
+    .account {
+      display: flex;
+    }
+
+    .identifying-code {
+    }
+  }
+
+  .op-btn-wrap {
+    margin-top: 30px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    .h-btn {
+      text-align: center;
+      width: 343px;
+      height: 42px;
+      background: #FFE05C;
+      border-radius: 27px;
+      line-height: 42px;
+    }
+  }
 }
 </style>

pages/index/index.vue

@@ -24,7 +24,7 @@
           <!--          温馨提示-->
           <view  class="noticeCard">
             <uni-card>
-              <text>温馨提示：“娇骄儿JJe”微信小程序为新系统限白云店和遵义店使用，微信小程序系统目前处于试运行阶段，老会员卡暂时不能使用；待开放正式版“娇骄儿JJe”微信小程序后会员退卡全店通用，具体时间请关注娇骄儿微信公众号以及“娇骄儿JJe”微信小程序通告。如有异常请联系工作人员：0851-85833828</text>
+              <text>{{indexTips}}</text>
             </uni-card>
           </view>
           <!-- 个人信息、钱包、商店 -->
@@ -254,7 +254,8 @@ export default {
         latitude: 0
       },
       storeList: [],
-      storeInfo: {}
+      storeInfo: {},
+      indexTips:'温馨提示:“娇骄儿JJe”微信小程序为新系统限白云店和遵义店使用，微信小程序系统目前处于试运行阶段，老会员卡暂时不能使用；待开放正式版“娇骄儿JJe”微信小程序后会员退卡全店通用，具体时间请关注娇骄儿微信公众号以及“娇骄儿JJe”微信小程序通告。如有异常请联系工作人员：0851-85833828'
     };
   },