登录注册功能开发

src/components/navs/hor-big-one.vue

@@ -265,15 +265,18 @@ color: #EE4454;
           </q-menu>
         </q-btn>
         <q-btn label="帮助中心" flat></q-btn>
-        <q-btn v-if="LoginUser.accountId <= 0" label="注册" flat></q-btn>
-        <template v-if="LoginUser.accountId > 0">
+        <q-btn v-if="LoginUser.id <= 0" label="注册" flat></q-btn>
+        <template v-if="LoginUser.id > 0">
           <q-btn-dropdown
             style="color: #444; font-weight: bold"
             class="q-ml-lg"
-            icon="iconfont iconicon-unlogin"
-            :label="LoginUser.name"
             unelevated
           >
+          <template v-slot:label>
+            <img class="avatar" v-if="LoginUser.photo" :src="LoginUser.photo" />
+            <img class="avatar" v-else src="../../assets/img/avatar.png" />
+            <!-- <span>{{LoginUser.name || LoginUser.mailbox}}</span> -->
+          </template>
             <div class="row no-wrap q-pa-md">
               <div class="column">
                 <q-list>
@@ -510,6 +513,7 @@ export default {
   },
   mounted() {
     this.isHome = this.$router.history.current.path==='/' || this.$router.history.current.path==='/index'
+    console.log('JSON.parse(window.localStorage.getItem("b2bUser"))', JSON.parse(window.localStorage.getItem("b2bUser")))
     if (localStorage.b2bUser) {
       this.LoginUser = JSON.parse(window.localStorage.getItem("b2bUser"));
     }
@@ -710,6 +714,11 @@ export default {
 </script>
 
 <style>
+.avatar {
+  width: 38px;
+  height: 38px;
+  border-radius: 50%;
+}
 .nav-items {
   position: relative;
 }

src/pages/login.vue

@@ -101,9 +101,26 @@
             <q-input outlined v-model="loginMsg.Mailbox" />
             <div class="primary q-mt-sm" v-show="tips">邮箱格式有误,请核实</div>
           </div>
-          <div class="form-group" v-if="loginType === 'PassWord'">
+          <div v-if="loginType === 'MailCode'|| loginType === 'bindEmail'">
+            <q-btn
+              v-if="!isSend" class="q-mb-lg"
+              unelevated
+              color="grey-3"
+              style="width: 100%; color: #8B8B8B !important; height: 50px; margin-top: 20px"
+              filled
+              label="发送验证码"
+              @click="sendVerify"
+            />
+            <div v-else class="mt q-mb-sm">
+              <q-input outlined v-model="loginMsg.MailCode" type="text" />
+              <div class="q-mt-sm" :class="cutDown ? 'text-grey-6' : ''">
+                {{ cutDown ? cutDown + "秒后可重新发送" : "重新發送驗證碼" }}
+              </div>
+            </div>
+          </div>
+          <div v-if="!isLogin || loginType ==='PassWord'" class="form-group">
             <div class="login_labelName flex justify-between items-center">
-              密碼<span class="text-grey-6 cursor-pointer" @click="resetPassword">忘記密碼</span>
+              密碼<span class="text-grey-6 cursor-pointer" v-if="loginType === 'PassWord'" @click="resetPassword">忘記密碼</span>
             </div>
             <q-input
               v-if="flag == 1"
@@ -130,23 +147,6 @@
               @click="flag = 1"
             ></i>
           </div>
-          <div v-else-if="loginType === 'MailCode'|| loginType === 'bindEmail'">
-            <q-btn
-              v-if="!isSend" class="q-mb-lg"
-              unelevated
-              color="grey-3"
-              style="width: 100%; color: #8B8B8B !important; height: 50px; margin-top: 20px"
-              filled
-              label="发送验证码"
-              @click="sendVerify"
-            />
-            <div v-else class="mt q-mb-sm">
-              <q-input outlined v-model="loginMsg.MailCode" type="text" />
-              <div class="q-mt-sm" :class="cutDown ? 'text-grey-6' : ''">
-                {{ cutDown ? cutDown + "秒后可重新发送" : "重新發送驗證碼" }}
-              </div>
-            </div>
-          </div>
           <div
             class="text-right f16 text-grey-6 cursor-pointer"
             v-if="isLogin"
@@ -309,10 +309,27 @@ this.CommonJump("/index", {});
       }
     },
     sendVerify() {
+      if(this.inSending) return
+      this.inSending = true
       if (this.verifyEmail()) {
-        this.isSend = true;
+        let SendType = this.userId ? 3 : (this.isLogin ? 1 : 0);
+        this.apipost('directCustomer_post_SendMail', {Mailbox: this.loginMsg.Mailbox, SendType: SendType, Id: this.userId}, (res) => {
+          this.inSending = false
+          if (res.data.resultCode == 1) {
+            this.isSend = true;
         this.cutDown = 60;
         this.startCutDown();
+          } else {
+            this.$q.notify({
+              type: "negative",
+              message: res.data.message,
+              position: "top",
+              timeout: 2000, // 以毫秒为单位; 0意味着没有超时
+            });
+          }
+        }, null)
+      } else {
+        this.inSending = false
       }
     },
     startCutDown() {
@@ -358,7 +375,6 @@ this.CommonJump("/index", {});
       // this.loginType = "wechat";
       // this.setWechatCode()
       const { AppID, State, OpenRedirectUri } = this.openInfo;
-      console.log("encodeURI('http://localhost:9090/login')", OpenRedirectUri)
       let redirect_uri = OpenRedirectUri
       const url = `https://open.weixin.qq.com/connect/qrconnect?appid=${AppID}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_login&state=${State}&wechat_redirect=${redirect_uri}`
       // this.windowObjectReference = window.open(url, 'wechat', 'left: 20,top: 20,width:200,height:200,')
@@ -426,6 +442,7 @@ this.CommonJump("/index", {});
           if (res.data.resultCode == 1) {
             var jsonData = JSON.stringify(res.data.data);
             window.localStorage.setItem("b2bUser", jsonData);
+            console.log('userInfo',jsonData, res.data.data)
             this.CommonJump("/index", {});
           } else {
             this.$q.notify({

src/pages/resetPassword.vue

@@ -183,10 +183,26 @@ export default {
   },
   methods: {
     sendVerify() {
+      if(this.inSending) return
+      this.inSending = true
       if (this.verifyEmail()) {
-        this.isSend = true;
+        this.apipost('directCustomer_post_SendMail', {Mailbox: this.loginMsg.Mailbox, SendType: 2}, (res) => {
+          this.inSending = false
+          if (res.data.resultCode == 1) {
+            this.isSend = true;
         this.cutDown = 60;
         this.startCutDown();
+          } else {
+            this.$q.notify({
+              type: "negative",
+              message: res.data.message,
+              position: "top",
+              timeout: 2000, // 以毫秒为单位; 0意味着没有超时
+            });
+          }
+        }, null)
+      } else {
+        this.inSending = false
       }
     },
     startCutDown() {
@@ -241,7 +257,7 @@ export default {
       }
       this.mylabel = "提交中...";
       this.apipost(
-        'MailboxPwdLogin_post',
+        'ResettingPwd_post',
         this.loginMsg,
         (res) => {
           this.mylabel = "重置密码";