1、利用viewport完成PC端页面响应式布局，其他端还未适配 2、基本完成语言大模型页面布局及部分功能 3、实现对于侧边栏图标在首页与其他页面时不...

zhaowei

2024-08-02 15792ad8baea4ab886dbfc58009847f26de45df8

 src/views/user/LoginPhone.vue

@@ -16,13 +16,14 @@
            </div>
          </a-form-model-item>
        </a-col>
        <a-col style="height: 55px;display: flex;justify-content: right;align-items: center;padding-left: 15px">
        <a-col class="code-col-container">
          <a-button
            class="getCaptcha"
            tabindex="-1"
            :disabled="state.smsSendBtn"
            @click.stop.prevent="getCaptcha"
            v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"></a-button>
            @click.stop.prevent="getCaptcha">
            {{!state.smsSendBtn && '获取验证码' || (state.time+' s')}}
          </a-button>
        </a-col>
      </a-row>
    </a-form-model>
@@ -44,7 +45,7 @@
        //手机号登录用
        state: {
          time: 60,
          smsSendBtn: false,
          smsSendBtn: false
        },
        validatorRules:{
          mobile: [
@@ -68,12 +69,12 @@
              captcha: this.model.captcha,
              remember_me: rememberMe
            }
            console.log("登录参数", loginParams)
            console.log('登录参数', loginParams)
            this.PhoneLogin(loginParams).then((res) => {
              this.$emit('success', res.result)
            }).catch((err) => {
              this.$emit('fail', err)
            });
            })
          }else{
            this.$emit('validateFail')
          }
@@ -82,56 +83,56 @@
      // 校验手机号
      validateMobile(rule,value,callback){
        if (!value || new RegExp(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/).test(value)){
          callback();
          callback()
        }else{
          callback("您的手机号码格式不正确!");
          callback('您的手机号码格式不正确!')
        }
      },
      //获取验证码
      getCaptcha (e) {
        e.preventDefault();
        let that = this;
        e.preventDefault()
        let that = this
        that.validateFields([ 'mobile' ], (err) => {
            if (!err) {
              that.state.smsSendBtn = true;
              that.state.smsSendBtn = true
              let interval = window.setInterval(() => {
                if (that.state.time-- <= 0) {
                  that.state.time = 60;
                  that.state.smsSendBtn = false;
                  window.clearInterval(interval);
                  that.state.time = 60
                  that.state.smsSendBtn = false
                  window.clearInterval(interval)
                }
              }, 1000);
              }, 1000)

              const hide = that.$message.loading('验证码发送中..', 0);
              let smsParams = {};
              smsParams.mobile=that.model.mobile;
              smsParams.smsmode="0";
              postAction("/sys/sms",smsParams)
              const hide = that.$message.loading('验证码发送中..', 0)
              let smsParams = {}
              smsParams.mobile = that.model.mobile
              smsParams.smsmode = '0'
              postAction('/sys/sms', smsParams)
                .then(res => {
                  if(!res.success){
                    setTimeout(hide, 0);
                    that.cmsFailed(res.message);
                    setTimeout(hide, 0)
                    that.cmsFailed(res.message)
                  }
                  console.log(res);
                  setTimeout(hide, 500);
                  console.log(res)
                  setTimeout(hide, 500)
                })
                .catch(err => {
                  setTimeout(hide, 1);
                  clearInterval(interval);
                  that.state.time = 60;
                  that.state.smsSendBtn = false;
                  that.requestFailed(err);
                });
                  setTimeout(hide, 1)
                  clearInterval(interval)
                  that.state.time = 60
                  that.state.smsSendBtn = false
                  that.requestFailed(err)
                })
            }
          }
        );
        )
      },
      cmsFailed(err){
        this.$notification[ 'error' ]({
          message: '获取验证码失败',
          description:err,
          duration: 4,
        });
          duration: 4
        })
      },
      /**
       * 验证字段
@@ -144,12 +145,12 @@
          let p = new Promise((resolve, reject) => {
            this.$refs['form'].validateField(item, (err)=>{
              if(!err){
                resolve();
                resolve()
              }else{
                reject(err);
                reject(err)
              }
            })
          });
          })
          promiseArray.push(p)
        }
        Promise.all(promiseArray).then(()=>{
@@ -157,22 +158,32 @@
        }).catch(err=>{
          callback(err)
        })
      },

      }

    }

  }
</script>

<style scoped>
<style scoped lang="less">
  .code-col-container {
    height: 55px;
    display: flex;
    justify-content: right;
    align-items: center;
    padding-left: 15px;

.getCaptcha{
  display: block;
      display: flex;
  width: 100%;
  height: 45px;
  border-radius: 15px;
  font-size: 17.9px;
  color: #000;
  border: none;
      justify-content: center;
      align-items: center;
}
  }

</style>