gx

queenwuli

2020-12-21 1f3406acbac28b5b98c8d9dde2557374b97c0ef9

 hive-app/pages/login/index.vue

@@ -2,15 +2,65 @@
   <!-- 登录 -->
   <view>
      <view class="login-box">
         <input placeholder="输入账号" class="login-input"/>
         <input placeholder="输入密码" class="login-input mt-20"/>
         <button class="blue-btn mt-20">登录</button>
         <input v-model="username" placeholder="输入账号" class="login-input" maxlength="60"/>
         <input v-model="password" placeholder="输入密码" class="login-input mt-20" maxlength="60"/>
         <button :disabled="isDisabled" class="blue-btn mt-20" @click="login">登录</button>
      </view>
   </view>
</template>

<script>

   export default {
      data(){
         return {
            username: '',
            password: '',
            isDisabled: false
         }
      },
      methods:{
         valid(){
            if(!this.username.trim()){
               this.$toast.info('请输入账号');
               return false;
            }
            if(!this.password.trim()){
               this.$toast.info('输入密码');
               return false;
            }
         },
         login(){
            if(this.valid() === false){
               return;
            }
            this.isDisabled = true;
            this.$httpUtils.request('/api/common/login', {
               username: this.username.trim(),
               password: this.password.trim()
            }, 'POST').then((res) => {
               if(res.status == 200){
                  const {mapInfo} = res;
                  uni.setStorage({
                      key: 'userInfo',
                      data: JSON.stringify({
                        token: mapInfo.token,
                        roleInfo: mapInfo.user
                     }),
                      success: () => {
                          uni.switchTab({
                             url: '../workbench/index'
                          })
                      }
                  });
               }
               this.$toast.info(res.info);
               this.isDisabled = false;
            }).catch((err) => {
               this.isDisabled = false;
            })
         }
      }
   }
</script>

<style>
@@ -34,4 +84,8 @@
      color: #FFFFFF;
      font-size: 16px;
   }
   uni-button[disabled]:not([type]), uni-button[disabled][type=default]{
      color: #FFFFFF;
      background-color: rgba(36, 131, 255, 0.6);
   }
</style>