feat:增加类型显示

yangan

22 小时以前 a28d0135ee42809b2c5863609da37155d3ecba5b

 pages/login/userPassword.vue

@@ -2,134 +2,299 @@
   <view>
      <view class="list">
         <view class="list-call">
            <u--input
               v-model="username"
         <!--    <u--input v-model="username"
               clearable
               maxlength="32"
               type="text"
               placeholder="请输入用户名"
               placeholder="请输入手机号"
               prefixIcon="account"
               prefixIconStyle="font-size: 22px;color: #909399"
            ></u--input>
               prefixIconStyle="font-size: 22px;color: #909399"></u--input> -->
               <!--  #ifdef H5  -->
               <customPagination
                  style="width:100%; height: 60rpx;  font-size: 30rpx;"
                  :options="userList"
                  :value="username"
                  v-model="username"
                  @changeInput="changeInput2"
                  @input="handleInput2"
                  :placeholder="'请输入登录账号'"
               ></customPagination>
               <!--  #endif  -->
               <!--  #ifdef MP-WEIXIN  -->
            <customPagination
               style="width:100%; height: 60rpx;  font-size: 30rpx;"
               :options="userList"
               :value="username"
               v-model="username"
               @changeInput="changeInput2"
               @input="handleInput2"
               :placeholder="'请选择手机号'"
            ></customPagination>
            <!--  #endif  -->
         </view>
         <view class="list-call">
            <u--input
               v-model="password"
               clearable
            <u-input v-model="password"
               v-if="inpType"
               clearable
               maxlength="32"
               type="password"
               :type="'password'"
               placeholder="请输入密码"
               prefixIcon="lock"
               prefixIconStyle="font-size: 22px;color: #909399"
            ></u--input>
               style="padding:0;margin-left:8px;"
               prefixIconStyle="font-size: 22px;color: #909399">
               <template slot="suffix">
                  <u-icon  size="45" name="eye-off" @click.native.stop="todoShow"></u-icon>
            </template>
            </u-input>
            <u-input v-model="password"
               v-if="!inpType"
               maxlength="32"
               clearable
               :type="'text'"
               placeholder="请输入密码"
               prefixIcon="lock"
               style="padding:0;margin-left:8px;"
               prefixIconStyle="font-size: 22px;color: #909399">
               <template slot="suffix">
                  <u-icon  size="45" name="eye" @click.native.stop="todoShow"></u-icon>
            </template>
            </u-input>
         </view>
      </view>
      <view class="loginBtn"><u-button type="primary" :text="btnText == 1 ? '绑定' : '登录'" @click="submit()"></u-button></view>
      <!-- 记住密码 -->
      <view class="jizhu">
         <view>
            <u-checkbox-group
            v-model="isJizhu"
            placement="column"
            @change="checkboxChange"
        >
         <u-checkbox
         :checked="isChecked"
         label="记住密码" :size='35' :iconSize="35" :labelSize="30" name="1"
         placement="row">
      </u-checkbox>
      </u-checkbox-group>
   </view>
      </view>
      <view class="loginBtn">
      <u-button type="primary"
            :text="btnText == 1 ? '绑定' : '登录'"
            @click="submit()"
            :loading="submitLoading">
      </u-button>
    </view>
   </view>
</template>

<script>
import { apiLoginPassword } from '@/api/publicInterface.js';
import { mapMutations } from 'vuex';
import { setName, setToken, setRefreshToken, setUsernameKey, setCustomerId, redirectHome } from '@/utils/status.js';
export default {
   name: 'userPassword',
   props: {
      //0:正常，1：微信绑定
      btnText: {
         type: Number,
         default: 0
      }
   },
   data() {
      return {
         // username: '12222222222', // 客户
         username: '13333333332',// 司机
         password: '123456',
         remember: true,
         baseUrl: ''
      };
   },
   methods: {
      ...mapMutations(['setUserTabbar']),
      //登录
      async submit() {
         uni.showLoading({
            title: '登录中...'
         });
         //表单校验
         if (this.username.length === 0) {
            this.$u.toast('请输入账号');
            return;
   import { apiLoginPassword } from '@/api/publicInterface.js';
   import { mapMutations } from 'vuex';
   import customPagination from './user.vue'
   import { setName, setToken, setRefreshToken, setUsernameKey, setCustomerId, redirectHome } from '@/utils/status.js';
   export default {
      name: 'userPassword',
      props: {
         //0:正常，1：微信绑定
         btnText: {
            type: Number,
            default: 0
         },
         userList: {
            type: Array,
            default: () => {
               return [];
            }
         }
         if (this.password.length === 0) {
            this.$u.toast('请输入密码');
            return;
         }
         let grant_type = 'password';
         //登录接口
         await apiLoginPassword({
            username: this.username,
            password: this.password,
            grant_type,
            scope: 'server'
         })
            .then(res => {
               setToken(res.access_token);
               setRefreshToken(res.refresh_token);
               if (this.btnText == 0) {
                  if (res.code != 1) {
                     // 登陆成功，存储相关信息
                     setToken(res.access_token);
                     setRefreshToken(res.refresh_token);
                     setUsernameKey(res.username);
                     //查询用户详细信息并储存
                     this.$reqGet('getUserEntity')
                        .then(res => {
                           this.$u.toast('恭喜您，登录成功！');
                           this.setUserTabbar(res.data.type);
                           uni.setStorageSync('roleType', res.data.type);
                           setCustomerId(res.data.customerid);
                           setName(res.name);
                           uni.hideLoading();
                           //跳转页面
                           this.$nextTick(() => {
                              redirectHome();
                           });
                        })
                        .catch(err => {
                           this.$u.toast('登录异常！');
                           console.log(err);
                        });
                  } else {
                     uni.hideLoading();
                     this.$u.toast(res.msg);
                  }
               } else {
                  this.$reqPost('wxBind', { state: 'MINI', code: uni.getStorageSync('openid') }, 'params').then(res => {
                     uni.hideLoading();
                     if (res.code == 0) {
                        this.$u.toast('绑定成功！即将回到登录页！');
                        setTimeout(() => {
                           uni.navigateBack();
                        }, 1000);
                     } else {
                        this.$u.toast(res.msg ? res.msg : '绑定失败');
                     }
                  });
               }
            })
            .catch(e => {
               this.$u.toast(e);
      },
      components: {
         customPagination
      },
      data() {
         return {
            username: '', // 客户
            isJizhu: uni.getStorageSync('remberPassWord').username  ? ['1'] : false,
            isChecked:false,
            username: uni.getStorageSync('remberPassWord').username || '',//承运商
            password: uni.getStorageSync('remberPassWord').password || '',
            remember: true,
            inpType:true,
            baseUrl: '',
            submitLoading: false,
            weXinisLoginFlag:[1,2,3], //微信
            H5IsLoginFlag:[5,6], //h5
         };
      },
      methods: {
         ...mapMutations(['setUserTabbar']),
         changeInput2(e){
            this.username=e.username
            // this.password=e.password
         },
         handleInput2(e){
         },
         todoShow(){
            console.log('点击')
            this.inpType = !this.inpType;
            this.password = this.password;

         },
         //登录
         async submit() {
            uni.showLoading({
               title: '登录中...'
            });
            //表单校验
            if (this.username.length === 0) {
               this.$u.toast('请输入账号');
               return;
            }
            if (this.password.length === 0) {
               this.$u.toast('请输入密码');
               return;
            }
            let grant_type = 'password';
            //登录接口
            this.submitLoading = true
            await apiLoginPassword({
                  username: this.username,
                  password: this.password,
                  grant_type,
                  scope: 'server'
               })
               .then(res => {
                  setToken(res.access_token);
                  setRefreshToken(res.refresh_token);
                  if (this.btnText == 0) {
                     this.submitLoading = false
                     if (res.code != 1) {
							

                        // 登陆成功，存储相关信息
                        setToken(res.access_token);
                        setRefreshToken(res.refresh_token);
                        setUsernameKey(res.username);
                        //查询用户详细信息并储存
                        this.$reqGet('getUserEntity')
                           .then(res => {
                    console.log(res,'登录信息----------')
                                    //#ifdef MP-WEIXIN
                        if(this.H5IsLoginFlag.includes(res.data.type)) {
                           this.$u.toast('当前角色请前往h5页面登录')
                           return ;

                        }
                        //#endif
                        // #ifdef H5
                        if(this.weXinisLoginFlag.includes(res.data.type)) {
                           console.log('触发登录角色')
                           this.$u.toast('当前角色请前往小程序登录')
                           return ;

                        }
                        //#endif

                              this.$u.toast('登录成功');
                              if(this.isJizhu.length){ //记住密码
                                 uni.setStorageSync('remberPassWord',{
                                    username: this.username,
                                    password: this.password,
                                 });
                              }else{
                                 uni.setStorageSync('remberPassWord',{
                                    username: this.username,
                                    password: '',
                                 });
                              }
                              this.setUserTabbar(res.data.type);
                              uni.setStorageSync('productIds',res.data.productIds)
                              uni.setStorageSync('roleType', res.data.type);
                              uni.setStorageSync("userId", res.data.userId)
                              uni.setStorageSync("carNo", res.data.carNo)
                              uni.setStorageSync("userInfo", res.data)
                              uni.removeStorageSync('bunkerIds')
                              uni.setStorageSync("isFirstMeet", false)
                              let data=uni.getStorageSync('userList')?JSON.parse(uni.getStorageSync('userList')):[];
                              let id = data.length + 1;
                               if (data.filter(item=> item.username == this.username).length == 0){
                               data.push({username: this.username,password: this.password,type:res.data.type})
                              }
                              uni.setStorageSync("userList", JSON.stringify(data))
                              setCustomerId(res.data.customerid);
                              setName(res.data.name);
                              uni.hideLoading();
                    if(res.data.forcePassword == 1) {
                      uni.navigateTo({
                        url: '/pages/login/resetPassword/resetPassword'
                      })
                    }else {
                      //跳转页面
                      this.$nextTick(() => {
                        redirectHome();
                      });
                    }
                           })
                           .catch(err => {
                              this.submitLoading = false
                              this.$u.toast('登录异常！');
                              console.log(err);
                           });
                     } else {
                        uni.hideLoading();
                        this.$u.toast(res.msg);
                     }
                  } else {
                     uni.login({
                        success: res => {
                           if (res.code) {
                              uni.setStorageSync('bindcode', res.code);
                           }
                           if (uni.getStorageSync('bindcode')) {
                        this.$reqPost('wxBind', { state: 'MINI', code: uni.getStorageSync('bindcode') },
                           'params').then(res => {
                           uni.hideLoading();
                           if (res.code == 0) {
                              this.$u.toast('绑定成功！即将回到登录页！');
                              setTimeout(() => {
                                 uni.navigateBack();
                              }, 1000);
                           } else {
                              this.$u.toast(res.msg ? res.msg : '绑定失败');
                           }
                        });
                     }
                        }
                     });
						
                  }
               }).catch(e => {
                  this.submitLoading = false
                  this.$u.toast(e);
               });

         },
         checkboxChange(val){
            console.log(val,'isJz')
         }
      }
   }
};
   };
</script>

<style lang="scss">
@import 'index.scss';
.dengluBtn {
   margin-top: 80rpx;
}
   @import 'index.scss';

   .dengluBtn {
      margin-top: 80rpx;
   }
  /* #ifdef H5 */
  .loginBtn{
    width: 80%;
    margin: 0 auto;
  }
  /* #endif */
  .jizhu{
   padding: 40rpx 70rpx 40rpx 70rpx;
   display: flex;
    justify-content: flex-end;
  }
</style>