thirdCommit

付延余

2023-03-16 1ab29b3567574a721bd37d5ff9d7e9db386272d6

 pages/login/login.vue

@@ -1,49 +1,51 @@
<template>
   <view class="login">
      <!-- <view class="loginBtn">
      <u-button text="微信一键登录" type="success" shape="circle" icon="weixin-fill" @click="apiLogin"></u-button>
    </view> -->

      <!--国际化-->
      <js-lang title="login.title" :showBtn="false"></js-lang>
      <view class="logo">无人值守</view>
      <!-- 租户列表 -->
      <!-- <view class="tenantList">
         <u-input v-model="tenantId" placeholder="请输入内容" type="select" border="true" @click="show = true" />
         <u-action-sheet :list="tenantList" v-model="show" @click="selectTenant"></u-action-sheet>
      </view> -->
      <!--用户名密码登录-->
      <user-password />

      <!-- #ifdef MP -->
      <view class="loginBtn"><u-button class="button" @click.stop="getUserProfile" :disabled="btnLoading" :loading="btnLoading" type="primary" text="微信一键登录"></u-button></view>
      <user-password :btnText='0'/>
      <!-- 微信openid登录 -->
      <view class="loginBtn">
         <u-button class="button" @click.stop="beforeLoginEvent" :disabled="btnLoading" :loading="btnLoading" type="primary" text="微信一键登录"></u-button>
      </view>
      <view class="register" @click="registerClick"><text>注册</text></view>
      <!-- #endif -->
      <view class="login-bottom-box"><view class="copyright">2023冀中能源无人值守微信小程序</view></view>
      <view class="login-bottom-box">
         <view class="copyright">冀中能源无人值守微信小程序</view>
         <view class="copyright">小程序仅供已拥有系统账号特定内部人员使用</view>
      </view>
      <!-- 微信授权前的弹框 -->
      <view class="loginPopup">
         <u-popup :show="loginPopupShow" mode="bottom" @close="closePopup" @open="openPopup" round="10" :safeAreaInsetBottom="true">
            <view class="popup-warp">
               <view class="body"><text>本小程序，仅供已拥有系统账号特定内部人员登录使用，点击同意即表示您已同意相应信息授权。</text></view>
               <view class="btn">
                  <u-button @click="loginPopupShow = false" type="error" text="不同意" shape="circle" :plain="true"></u-button>
                  <u-button @click="wxLogin" type="error" text="同意" throttleTime="3000" shape="circle"></u-button>
               </view>
            </view>
         </u-popup>
      </view>
      <!-- 询问是否绑定微信 -->
      <view class="bindWxModel">
         <u-modal :show="bindWxModelShow" :title="bindWxModelTitle" showCancelButton :content="bindWxContent" @confirm="bindWxConfirm" @cancel="bindWxCancel"></u-modal>
      </view>
   </view>
</template>

<script>
import { apiLogin, apiLogin2, apiLoginPassword } from '@/api/publicInterface.js';
import { apiLoginWx, apiLoginPassword } from '@/api/publicInterface.js';
import { mapMutations } from 'vuex';
import userPassword from './userPassword.vue';

import { setToken, setRefreshToken, setUsernameKey, setCustomerId, redirectHome } from '@/utils/status.js';
export default {
   data() {
      return {
         // wxcode: '31363631363534303739323636', // 客户
         // wxcode: '31363631363534303700000000', // 货代1
         // wxcode: '31363631363534303700000004', // 货代2
         wxcode: '31363631363534303700000001', // 司机1
         // wxcode: '31363631363534303700000005', // 司机2
         // wxcode: '', // 客户
         openid: '',
         roleId: 0,

         tenantId: undefined,
         wxcode: '', // 司机1
         btnLoading: false,
         show: false,
         tenantList: []
         loginPopupShow: false,
         // 绑定微信模态框
         bindWxModelShow: false,
         bindWxModelTitle: '提示',
         bindWxContent: '如果已拥有系统账号，可以直接跳转绑定微信页面'
      };
   },
   components: {
@@ -52,51 +54,110 @@
   methods: {
      ...mapMutations(['setUserTabbar']),
      // 访问wx.login,获取code
      login() {
         // let _this = this;
      beforeLoginEvent() {
         this.loginPopupShow = true;
      },
      wxLogin() {
         // 获取登录用户code
         uni.login({
            success: res => {
               console.log('登录loginRes', res);
               if (res.code) {
                  this.wxcode = res.code;
                  this.apiLogin();
               } else {
                  uni.showToast({
                     title: '微信登录失败！',
                     duration: 2000
                  });
               }
               // this.apiLogin();
            }
         });
      },
      // 登录接口
      apiLogin() {
         // console.log(this.$uStoreKey.roleType);
         apiLogin2({ code: this.wxcode })
            .then(res => {
               console.log('请求登录', res);
               if (res.msg == '需绑定') {
                  uni.navigateTo({
                     url: `/pages/register/register?code=${res.data}`
         // apiLoginWx({ code: this.wxcode })
         //    .then(res => {
         //       console.log('请求登录', res);
         //       if (res.msg == '需绑定') {
         //          uni.navigateTo({
         //             url: `/pages/register/register?code=${res.data}`
         //          });
         //       }
         //       if (res.msg == '登录成功') {
         //          uni.setStorageSync('userInfo', res.data);
         //          this.setUserTabbar(res.data.type);
         //          uni.switchTab({
         //             url: '/pages/tabbar-page/index-tabbar/index-tabbar'
         //          });
         //       }
         //    })
         //    .catch(err => {
         //       console.log('错误', err);
         //    });

         /**
          * @openid
          * 获取微信用户openid,微信一键登录暂无相关接口，用于测试呼叫客服功能
          */

         wx.request({
            url: `https://api.weixin.qq.com/sns/jscode2session?appid=wx4a62fc1684c429a9&secret=ee90afe376cdcec2fdd947c0a4db961a&js_code=${this.wxcode}&grant_type=authorization_code`,
            success(res) {
               let id = res.data.openid;
               uni.setStorageSync('openid', id);
               uni.showToast({
                  title: '成功获取测试openid',
                  icon: 'none'
               });
            }
         });
         this.$nextTick(() => {
            apiLoginWx({ code: uni.getStorageSync('openid') }).then(res => {
               if (res.code != 1) {
                  this.$u.toast('恭喜您，登录成功！');
                  // 登陆成功，存储相关信息
                  setToken(res.access_token);
                  setRefreshToken(res.refresh_token);
                  setUsernameKey(res.username);
                  //查询用户详细信息并储存
                  this.$reqGet('getUserEntity').then(res => {
                     this.setUserTabbar(res.data.type);
                     uni.setStorageSync('roleType', res.data.type);
                     setCustomerId(res.data.customerid);
                     //跳转页面
                     this.$nextTick(() => {
                        redirectHome();
                     });
                  });
               } else {
                  this.$u.toast(res.msg);
                  this.bindWxModelShow = true;
               }
               if (res.msg == '登录成功') {
                  uni.setStorageSync('userInfo', res.data);
                  this.setUserTabbar(res.data.type);
                  uni.switchTab({
                     url: '/pages/tabbar-page/index-tabbar/index-tabbar'
                  });
               }
            })
            .catch(err => {
               console.log('错误', err);
            });
         });

         this.loginPopupShow = false;
      },
      registerClick(){
      bindWxConfirm() {
         uni.navigateTo({
            url:"/pages/register/register"
         })
            url: `/pages/login/wxLogin?code=${uni.getStorageSync('openid')}`
         });
         this.bindWxModelShow = false;
      },
      bindWxCancel() {
         this.bindWxModelShow = false;
      },
      // 弹出层时间
      closePopup() {
         this.loginPopupShow = false;
      },
      openPopup() {
         console.log('打开了');
      },
      registerClick() {
         uni.navigateTo({
            url: '/pages/register/register'
         });
      }
   }
};
@@ -135,7 +196,7 @@
      width: 80%;
      font-size: 64rpx;
      color: #497bff;
      margin: 50rpx auto 0;
      margin: vww(100) auto 0;
      text-align: center;
   }

@@ -204,12 +265,29 @@
      padding: 0 70rpx;
   }

   .tenantList {
      font-size: 32rpx;
      width: 80%;
      height: 80rpx;
      text-align: center;
      margin: 50rpx auto 0;
   // 弹出框
   .loginPopup {
      .u-popup {
         .u-transition {
            .u-popup__content {
               .popup-warp {
                  height: vww(200);
                  padding: vww(10) vww(20);
                  .body {
                     width: 100%;
                     height: 70%;
                  }
                  .btn {
                     display: flex;
                     justify-content: space-between;
                     .u-button {
                        width: 40%;
                     }
                  }
               }
            }
         }
      }
   }
}
</style>