Houjie
2025-07-07 0a48655d2162b709ecb80d249a4085971add6140
pages/login/loginOauth2.vue
@@ -1,12 +1,12 @@
<template>
    <view class="zai-box">
        <!-- 登录加载弹窗 -->
        <view class="cu-load load-modal">
            <image src="https://static.jeecg.com/upload/test/login4_1595818039175.png" mode="aspectFit"
                   class="round"></image>
            <view class="gray-text">正在登录中...</view>
        </view>
  <view class="zai-box">
    <!-- 登录加载弹窗 -->
    <view class="cu-load load-modal">
      <image src="https://static.jeecg.com/upload/test/login4_1595818039175.png" mode="aspectFit"
             class="round"></image>
      <view class="gray-text">正在登录中...</view>
    </view>
  </view>
</template>
@@ -17,184 +17,196 @@
import configService from '@/common/service/config.service.js';
export default {
    data() {
        return {
            loading: false,
            env: {
                thirdType: '',
                thirdApp: false,
                wxWork: false,
                dingtalk: false,
            },
            redirectUrl: ''
        };
  data() {
    return {
      loading: false,
      env: {
        thirdType: '',
        thirdApp: false,
        wxWork: false,
        dingtalk: false,
      },
      redirectUrl: ''
    };
  },
  beforeCreate() {
    // 如果当前 不是 OAuth2APP环境,就重定向到 /user/login 页面
    if (!isOAuth2AppEnv()) {
      this.$Router.replace({name: 'login'})
    }
  },
  created() {
    this.checkEnv()
    this.doOAuth2Login()
  },
  methods: {
    ...mapActions(['ThirdLogin']),
    /** 检测当前的环境 */
    checkEnv() {
      // 判断当时是否是企业微信环境
      if (/wxwork/i.test(navigator.userAgent)) {
        this.env.thirdApp = true
        this.env.wxWork = true
        this.env.thirdType = 'wechat_enterprise'
      }
      // 判断当时是否是钉钉环境
      if (/dingtalk/i.test(navigator.userAgent)) {
        this.env.thirdApp = true
        this.env.dingtalk = true
        //this.env.thirdType='dingtalk'
      }
    },
    beforeCreate() {
        // 如果当前 不是 OAuth2APP环境,就重定向到 /user/login 页面
        if (!isOAuth2AppEnv()) {
            this.$Router.replace({name: 'login'})
    /** 进行OAuth2登录操作 */
    doOAuth2Login() {
      if (this.env.thirdApp) {
        // 判断是否携带了Token,是就说明登录成功
        this.redirectUrl = ''
        let search = window.location.search;
        if (search.indexOf('hasToken') > 0) {
          let obj = getUrlParams(search);
          if (obj.params.redirect) {
            this.redirectUrl = decodeURIComponent(decodeURIComponent(obj.params.redirect));
            this.goRedirectUrl();
          } else {
            alert('hasToken参数错误!')
          }
        } else if (search.indexOf('oauth2LoginToken') > 0) {
          let obj = getUrlParams(search);
          this.env.thirdType = obj.params.thirdType;
          let token = obj.params.oauth2LoginToken;
          if (obj.params.redirect) {
            this.redirectUrl = decodeURIComponent(obj.params.redirect)
          }
          this.doThirdLogin(token)
        } else if (this.env.wxWork) {
          this.doWechatEnterpriseOAuth2Login()
        } else if (this.env.dingtalk) {
          this.doDingTalkOAuth2Login()
        }
      }
    },
    created() {
        this.checkEnv()
        this.doOAuth2Login()
    // 根据token执行登录
    doThirdLogin(token) {
      this.ThirdLogin({token: token, thirdType: this.env.thirdType}).then(res => {
        if (res.data.success) {
          uni.showToast({
            title: '登录',
            icon: 'none',
            duration: 3000,
            content: res
          });
          this.loginSuccess()
        } else {
          this.requestFailed(res)
        }
      }).catch((e) => {
        alert(e.message || e)
      })
    },
    methods: {
        ...mapActions(['ThirdLogin']),
        /** 检测当前的环境 */
        checkEnv() {
            // 判断当时是否是企业微信环境
            if (/wxwork/i.test(navigator.userAgent)) {
                this.env.thirdApp = true
                this.env.wxWork = true
                //this.env.thirdType='wechat_enterprise'
            }
            // 判断当时是否是钉钉环境
            if (/dingtalk/i.test(navigator.userAgent)) {
                this.env.thirdApp = true
                this.env.dingtalk = true
                //this.env.thirdType='dingtalk'
            }
        },
    loginSuccess() {
      this.$Router.replaceAll({name: 'index'})
    },
    requestFailed(err) {
      uni.showToast({
        title: '登录',
        icon: 'none',
        duration: 3000,
        content: err
      });
    },
    goRedirectUrl() {
      let obj = getUrlParams(this.redirectUrl);
      let path = obj.url;
      let params = obj.params;
      if (params.info) {
        let temp = JSON.parse(params.info);
        let query = {
          instanceId: temp.procInsId,
          taskId: temp.taskId,
          taskDefKey: temp.taskDefKey
        }
        if (temp.claim == 1) {
          query['claim'] = 1
        }
        this.$Router.replaceAll({path, query})
      } else {
        this.$Router.replaceAll({path})
      }
    },
    /** 企业微信OAuth2登录 */
    doWechatEnterpriseOAuth2Login() {
      this.sysOAuth2Login('wechat_enterprise')
    },
        /** 进行OAuth2登录操作 */
        doOAuth2Login() {
            if (this.env.thirdApp) {
                // 判断是否携带了Token,是就说明登录成功
                this.redirectUrl = ''
                let search = window.location.search;
                if (search.indexOf('hasToken') > 0) {
                    let obj = getUrlParams(search);
                    if (obj.params.redirect) {
                        this.redirectUrl = decodeURIComponent(decodeURIComponent(obj.params.redirect));
                        this.goRedirectUrl();
                    } else {
                        alert('hasToken参数错误!')
                    }
                } else if (search.indexOf('oauth2LoginToken') > 0) {
                    let obj = getUrlParams(search);
                    this.env.thirdType = obj.params.thirdType;
                    let token = obj.params.oauth2LoginToken;
                    if (obj.params.redirect) {
                        this.redirectUrl = decodeURIComponent(obj.params.redirect)
                    }
                    this.doThirdLogin(token)
                } else if (this.env.wxWork) {
                    this.doWechatEnterpriseOAuth2Login()
                } else if (this.env.dingtalk) {
                    this.doDingTalkOAuth2Login()
                }
            }
        },
    /** 钉钉OAuth2登录 */
    doDingTalkOAuth2Login() {
      this.sysOAuth2Login('dingtalk')
    },
        // 根据token执行登录
        doThirdLogin(token) {
            this.ThirdLogin({token: token, thirdType: this.env.thirdType}).then(res => {
                if (res.data.success) {
                    this.loginSuccess()
                } else {
                    this.requestFailed(res)
                }
            }).catch((e) => {
                alert(e.message || e)
            })
        },
        loginSuccess() {
               this.$Router.replaceAll({name: 'index'})
        },
        requestFailed(err) {
            this.$message.warning("登录失败")
        },
        goRedirectUrl() {
            let obj = getUrlParams(this.redirectUrl);
            let path = obj.url;
            let params = obj.params;
            if (params.info) {
                let temp = JSON.parse(params.info);
                let query = {
                    instanceId: temp.procInsId,
                    taskId: temp.taskId,
                    taskDefKey: temp.taskDefKey
                }
                if (temp.claim == 1) {
                    query['claim'] = 1
                }
                this.$Router.replaceAll({path, query})
            } else {
                this.$Router.replaceAll({path})
            }
        },
        /** 企业微信OAuth2登录 */
        doWechatEnterpriseOAuth2Login() {
            this.sysOAuth2Login('wechat_enterprise')
        },
        /** 钉钉OAuth2登录 */
        doDingTalkOAuth2Login() {
            this.sysOAuth2Login('dingtalk')
        },
        /** 后台构造oauth2登录地址 */
        sysOAuth2Login(source) {
    /** 后台构造oauth2登录地址 */
    sysOAuth2Login(source) {
            let domainURL = configService.apiUrl;
            let url = `${domainURL}/sys/thirdLogin/oauth2/${source}/login`;
            let url = `http://houjie.xalxzn.com:8866/jeecg-boot/sys/thirdLogin/oauth2/${source}/login`;
            let state = window.location.origin + window.location.search
            url += `?state=${encodeURIComponent(state)}`;
            console.log('sysOAuth2Login====》', url)
            window.location.href = url;
        },
    }
            window.location.href = url;
    },
  }
}
</script>
<style>
.login-paddingtop {
    padding-top: 100 upx;
  padding-top: 100upx;
}
.zai-box {
    padding: 0 20 upx;
    padding-top: 100 upx;
    position: relative;
  padding: 0 20upx;
  padding-top: 100upx;
  position: relative;
}
.zai-logo {
    width: 200 upx;
    height: 150px;
  width: 200upx;
  height: 150px;
}
.zai-title {
    font-size: 58 upx;
    color: #000000;
    text-align: center;
  font-size: 58upx;
  color: #000000;
  text-align: center;
}
.input-placeholder, .zai-input {
    color: #94afce;
  color: #94afce;
}
.zai-label {
    padding: 60 upx 0;
    text-align: center;
    font-size: 30 upx;
    color: #a7b6d0;
  padding: 60upx 0;
  text-align: center;
  font-size: 30upx;
  color: #a7b6d0;
}
.zai-btn {
    background: #ff65a3;
    color: #fff;
    border: 0;
    border-radius: 100 upx;
    font-size: 36 upx;
  background: #ff65a3;
  color: #fff;
  border: 0;
  border-radius: 100upx;
  font-size: 36upx;
}
.zai-btn:after {
    border: 0;
  border: 0;
}
/*按钮点击效果*/
.zai-btn.button-hover {
    transform: translate(1 upx, 1 upx);
  transform: translate(1upx, 1upx);
}
</style>