|
@@ -1,64 +1,68 @@
|
|
<template>
|
|
<template>
|
|
- <div class="join-wrap">
|
|
|
|
- <div class="join-main-box">
|
|
|
|
- <p class="join-title">
|
|
|
|
- <span>
|
|
|
|
- {{$t('cusMgt.join.title')}}
|
|
|
|
- </span>
|
|
|
|
- </p>
|
|
|
|
- <div v-show="isJoin || isRep" style="margin-bottom:50px">
|
|
|
|
- <p class="join-title">
|
|
|
|
- <span>
|
|
|
|
- {{$t('cusMgt.join.title')}}
|
|
|
|
- </span>
|
|
|
|
- </p>
|
|
|
|
- <Icon type="md-checkmark-circle-outline" color="#19be6b" size="120" />
|
|
|
|
- <p v-if="isJoin" class="success-tips">{{userName}}, {{$t('cusMgt.join.hasJoin')}}</p>
|
|
|
|
- <p v-else-if="isRep" class="success-tips">{{$t('cusMgt.join.repJoin')}}</p>
|
|
|
|
- </div>
|
|
|
|
- <p v-show="!isJoin && !isRep" class="course-name">{{cusName || $t('cusMgt.join.errorInfo')}}</p>
|
|
|
|
- <div style="width:fit-content;margin: auto;">
|
|
|
|
- <p class="info-item" v-show="isJoin || isRep">
|
|
|
|
- <span class="info-lable">
|
|
|
|
- {{$t('cusMgt.join.cusLabel')}}
|
|
|
|
- </span>
|
|
|
|
- <span class="info-value">
|
|
|
|
- {{cusName}}
|
|
|
|
- </span>
|
|
|
|
- </p>
|
|
|
|
- <p class="info-item">
|
|
|
|
- <span class="info-lable">
|
|
|
|
- {{$t('cusMgt.join.teacherLabel')}}
|
|
|
|
- </span>
|
|
|
|
- <span class="info-value">
|
|
|
|
- {{tName}}
|
|
|
|
- </span>
|
|
|
|
- </p>
|
|
|
|
- <p class="info-item">
|
|
|
|
- <span class="info-lable">
|
|
|
|
- {{$t('cusMgt.join.listLabel')}}
|
|
|
|
- </span>
|
|
|
|
- <span class="info-value">
|
|
|
|
- {{listName}}
|
|
|
|
- </span>
|
|
|
|
- </p>
|
|
|
|
- <p class="info-item">
|
|
|
|
- <span class="info-lable">
|
|
|
|
- {{$t('settings.des')}}:
|
|
|
|
- </span>
|
|
|
|
- <span class="info-value">
|
|
|
|
- {{cusDesc}}
|
|
|
|
- </span>
|
|
|
|
- </p>
|
|
|
|
- <router-link v-show="(isJoin || isRep) && isPC" :to="{name:'login', query:{code,identity:'student'}}" style="margin-top:50px;display:block">{{$t('cusMgt.join.toTeammodel')}}</router-link>
|
|
|
|
- </div>
|
|
|
|
-
|
|
|
|
- <div class="join-btn" @click="joinList()" v-show="!isJoin && !isRep">
|
|
|
|
- {{ hasSend ? $t('newCusMgt.joinTip1') : $t('cusMgt.join.joinBtn')}}
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="join-wrap">
|
|
|
|
+ <div class="join-main-box">
|
|
|
|
+ <p class="join-title">
|
|
|
|
+ <span>
|
|
|
|
+ {{ $t("cusMgt.join.title") }}
|
|
|
|
+ </span>
|
|
|
|
+ </p>
|
|
|
|
+ <div v-show="isJoin || isRep" style="margin-bottom: 50px">
|
|
|
|
+ <p class="join-title">
|
|
|
|
+ <span>
|
|
|
|
+ {{ $t("cusMgt.join.title") }}
|
|
|
|
+ </span>
|
|
|
|
+ </p>
|
|
|
|
+ <Icon type="md-checkmark-circle-outline" color="#19be6b" size="120" />
|
|
|
|
+ <p v-if="isJoin" class="success-tips">{{ userName }}, {{ $t("cusMgt.join.hasJoin") }}</p>
|
|
|
|
+ <p v-else-if="isRep" class="success-tips">{{ $t("cusMgt.join.repJoin") }}</p>
|
|
|
|
+ </div>
|
|
|
|
+ <p v-show="!isJoin && !isRep" class="course-name">{{ cusName || $t("cusMgt.join.errorInfo") }}</p>
|
|
|
|
+ <div style="width: fit-content; margin: auto">
|
|
|
|
+ <p class="info-item" v-show="isJoin || isRep">
|
|
|
|
+ <span class="info-lable">
|
|
|
|
+ {{ $t("cusMgt.join.cusLabel") }}
|
|
|
|
+ </span>
|
|
|
|
+ <span class="info-value">
|
|
|
|
+ {{ cusName }}
|
|
|
|
+ </span>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="info-item">
|
|
|
|
+ <span class="info-lable">
|
|
|
|
+ {{ $t("cusMgt.join.teacherLabel") }}
|
|
|
|
+ </span>
|
|
|
|
+ <span class="info-value">
|
|
|
|
+ {{ tName }}
|
|
|
|
+ </span>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="info-item">
|
|
|
|
+ <span class="info-lable">
|
|
|
|
+ {{ $t("cusMgt.join.listLabel") }}
|
|
|
|
+ </span>
|
|
|
|
+ <span class="info-value">
|
|
|
|
+ {{ listName }}
|
|
|
|
+ </span>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="info-item">
|
|
|
|
+ <span class="info-lable"> {{ $t("settings.des") }}: </span>
|
|
|
|
+ <span class="info-value">
|
|
|
|
+ {{ cusDesc }}
|
|
|
|
+ </span>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="info-item" v-if="allowPick && !isJoin && !isRep">
|
|
|
|
+ <span class="info-lable"> 座号: </span>
|
|
|
|
+ <Select v-model="pickIRS" style="width: 80px">
|
|
|
|
+ <Option v-for="item in irsArr" :value="item" :key="item">{{ item }}</Option>
|
|
|
|
+ </Select>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="tips" v-if="allowPick && !isJoin && !isRep" style="margin-top: 20px; font-size: 12px">* 如果您自选的IRS座号已被占用,会由系统自动分配新的IRS编号</p>
|
|
|
|
+ <router-link v-show="(isJoin || isRep) && isPC" :to="{ name: 'login', query: { code, identity: 'student' } }" style="margin-top: 50px; display: block">{{ $t("cusMgt.join.toTeammodel") }}</router-link>
|
|
|
|
+ </div>
|
|
|
|
|
|
- </div>
|
|
|
|
- <!-- <div v-show="isJoin" class="join-main-box">
|
|
|
|
|
|
+ <div class="join-btn" @click="joinList()" v-show="!isJoin && !isRep">
|
|
|
|
+ {{ hasSend ? $t("newCusMgt.joinTip1") : $t("cusMgt.join.joinBtn") }}
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- <div v-show="isJoin" class="join-main-box">
|
|
<p class="join-title">
|
|
<p class="join-title">
|
|
<span>
|
|
<span>
|
|
{{$t('cusMgt.join.title')}}
|
|
{{$t('cusMgt.join.title')}}
|
|
@@ -67,211 +71,255 @@
|
|
<Icon type="md-checkmark-circle-outline" color="#19be6b" size="120" />
|
|
<Icon type="md-checkmark-circle-outline" color="#19be6b" size="120" />
|
|
<p class="success-tips">{{$t('cusMgt.join.hasJoin')}}</p>
|
|
<p class="success-tips">{{$t('cusMgt.join.hasJoin')}}</p>
|
|
</div> -->
|
|
</div> -->
|
|
- </div>
|
|
|
|
|
|
+ </div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
-import jwtDecode from 'jwt-decode'
|
|
|
|
-import { mapGetters } from 'vuex'
|
|
|
|
-export default {
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- hasSend:false,
|
|
|
|
- isRep: false,
|
|
|
|
- isPC: false,
|
|
|
|
- isLogin: false,
|
|
|
|
- isJoin: false,
|
|
|
|
- tId: '',
|
|
|
|
- tName: '',
|
|
|
|
- listNo: '',
|
|
|
|
- listName: '',
|
|
|
|
- cusName: '',
|
|
|
|
- cusDesc:'',
|
|
|
|
- cusId:'',
|
|
|
|
- code: '',
|
|
|
|
- userId: '',
|
|
|
|
- userName: '',
|
|
|
|
- id_token: ''
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- created() {
|
|
|
|
- console.log('当前站点配置信息', this.curSiteConfig)
|
|
|
|
- this.tId = this.$route.query.tId //教师id
|
|
|
|
- this.tName = this.$route.query.tName //教师姓名
|
|
|
|
- this.listNo = this.$route.query.listNo //名单id
|
|
|
|
- this.listName = this.$route.query.listName //名单
|
|
|
|
- this.cusName = this.$route.query.cusName //课程名称
|
|
|
|
- this.cusDesc = this.$route.query.cusDesc //课程名称
|
|
|
|
- this.cusId = this.$route.query.cusId //课程名称
|
|
|
|
- this.code = this.$route.query.code //登录成功返回的code
|
|
|
|
- if (!this.listNo) {
|
|
|
|
- this.$Modal.error({
|
|
|
|
- title: this.$t('cusMgt.join.errorTile'),
|
|
|
|
- content: this.$t('cusMgt.join.errorContent')
|
|
|
|
- })
|
|
|
|
- } else if (this.code) {
|
|
|
|
- //获取登录信息
|
|
|
|
- let host = this.curSiteConfig.coreAPIUrl
|
|
|
|
- let clientId = this.curSiteConfig.clientID
|
|
|
|
- this.$api.service.getToken(host, {
|
|
|
|
- grant_type: "authorization_code",
|
|
|
|
- client_id: clientId,
|
|
|
|
- code: this.code
|
|
|
|
- }).then(
|
|
|
|
- res => {
|
|
|
|
- if (!res.error) {
|
|
|
|
- this.id_token = res.id_token
|
|
|
|
- //记录登录状态,保证API请求验证通过
|
|
|
|
- localStorage.setItem("access_token", res.access_token)
|
|
|
|
- localStorage.setItem("id_token", res.id_token)
|
|
|
|
- localStorage.setItem("expires_in", res.expires_in)
|
|
|
|
- let tokenData = jwtDecode(res.id_token)
|
|
|
|
- if (tokenData) {
|
|
|
|
- this.userId = tokenData.sub
|
|
|
|
- this.userName = tokenData.name
|
|
|
|
- this.joinList()
|
|
|
|
- } else {
|
|
|
|
- this.$Message.error(this.$t('cusMgt.join.parseErr'))
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- this.$Message.error(this.$t('cusMgt.join.getErr'))
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- err => {
|
|
|
|
- this.$Message.error(this.$t('cusMgt.join.getErr'))
|
|
|
|
- }
|
|
|
|
- )
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
- // 判断移动端还是PC端
|
|
|
|
- this.isPC = !(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent))
|
|
|
|
- console.log('pc', this.isPC)
|
|
|
|
- },
|
|
|
|
- computed: {
|
|
|
|
- ...mapGetters({
|
|
|
|
- curSiteConfig: 'config/getCurSiteConfig',
|
|
|
|
- })
|
|
|
|
- },
|
|
|
|
- methods: {
|
|
|
|
- joinList() {
|
|
|
|
- console.error('xxx',this.id_token)
|
|
|
|
- console.error('xxxxxx',localStorage.id_token)
|
|
|
|
- if(!this.id_token && !localStorage.id_token){
|
|
|
|
- this.toLogin()
|
|
|
|
- return
|
|
|
|
- }
|
|
|
|
- this.$api.courseMgmt.qrCodeJoinList({
|
|
|
|
- stuListNo: this.listNo,
|
|
|
|
- courseId: this.cusId,
|
|
|
|
- tmdId: this.userId,
|
|
|
|
- id_token: this.id_token || localStorage.id_token,
|
|
|
|
- school: undefined //加入行政班时需要传对应编码,个人名单不用传
|
|
|
|
- }).then(
|
|
|
|
- res => {
|
|
|
|
- if (!res.error) {
|
|
|
|
- this.hasSend = false
|
|
|
|
- if (res.status == 2) {//重复加入
|
|
|
|
- this.$Message.success(this.$t('cusMgt.join.repJoin'))
|
|
|
|
- this.isRep = true
|
|
|
|
- } else if (res.status == 1) {//参数异常
|
|
|
|
- this.$Message.success(this.$t('cusMgt.join.joinPErr'))
|
|
|
|
- } else if (res.status == 0) {//正常加入
|
|
|
|
- this.$Message.success(this.$t('cusMgt.join.joinOk'))
|
|
|
|
- this.isJoin = true
|
|
|
|
- sessionStorage.setItem('identity', 'student')
|
|
|
|
- } else if (res.status == 4) {// 个人名单未开放加入
|
|
|
|
- this.$Message.warning(this.$t('cusMgt.join.joinLock'))
|
|
|
|
- } else if (res.status == 6) {// 需要审核通过再加入
|
|
|
|
- this.$Message.warning(this.$t('newCusMgt.joinTip1'))
|
|
|
|
- this.hasSend = true
|
|
|
|
- } else if (res.status == 5) {// 人数已满,需要审核通过再加入
|
|
|
|
- this.$Message.warning(this.$t('newCusMgt.joinTip2'))
|
|
|
|
- } else if (res.status == 7) {// 二维码设置已经过期
|
|
|
|
- this.$Message.warning(this.$t('newCusMgt.joinTip3'))
|
|
|
|
- }
|
|
|
|
- } else {
|
|
|
|
- this.$Message.error(this.$t('cusMgt.join.joinErr'))
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
- err => {
|
|
|
|
- this.$Message.error(this.$t('cusMgt.join.joinErr'))
|
|
|
|
- }
|
|
|
|
- )
|
|
|
|
- },
|
|
|
|
- toLogin() {
|
|
|
|
- // let type = process.env.NODE_ENV //product | development
|
|
|
|
- let accUrl = this.curSiteConfig.accAPIUrl
|
|
|
|
- let clientId = this.curSiteConfig.clientID
|
|
|
|
- let callback = decodeURIComponent(window.location.href)
|
|
|
|
- let state = this.$jsFn.getBtwRandom(1000, 9999)
|
|
|
|
- let nonce = this.$jsFn.uuid()
|
|
|
|
- let loginUrl = `${accUrl}/oauth2/authorize?response_type=code&client_id=${clientId}&state=${state}&nonce=${nonce}&redirect_uri=${encodeURIComponent(callback)}`
|
|
|
|
- window.location.href = loginUrl
|
|
|
|
- }
|
|
|
|
- },
|
|
|
|
|
|
+ import jwtDecode from "jwt-decode";
|
|
|
|
+ import { mapGetters } from "vuex";
|
|
|
|
+ export default {
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ irsArr: [],
|
|
|
|
+ pickIRS: 1,
|
|
|
|
+ allowPick: false,
|
|
|
|
+ hasSend: false,
|
|
|
|
+ isRep: false,
|
|
|
|
+ isPC: false,
|
|
|
|
+ isLogin: false,
|
|
|
|
+ isJoin: false,
|
|
|
|
+ tId: "",
|
|
|
|
+ tName: "",
|
|
|
|
+ listNo: "",
|
|
|
|
+ listName: "",
|
|
|
|
+ cusName: "",
|
|
|
|
+ cusDesc: "",
|
|
|
|
+ cusId: "",
|
|
|
|
+ code: "",
|
|
|
|
+ userId: "",
|
|
|
|
+ userName: "",
|
|
|
|
+ id_token: ""
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ console.log("当前站点配置信息", this.curSiteConfig);
|
|
|
|
+ this.tId = this.$route.query.tId; //教师id
|
|
|
|
+ this.tName = this.$route.query.tName; //教师姓名
|
|
|
|
+ this.listNo = this.$route.query.listNo; //名单id
|
|
|
|
+ this.listName = this.$route.query.listName; //名单
|
|
|
|
+ this.cusName = this.$route.query.cusName; //课程名称
|
|
|
|
+ this.cusDesc = this.$route.query.cusDesc; //课程名称
|
|
|
|
+ this.cusId = this.$route.query.cusId; //课程名称
|
|
|
|
+ this.code = this.$route.query.code; //登录成功返回的code
|
|
|
|
+ this.getGroupListDetails().then((r) => {
|
|
|
|
+ if (!this.listNo) {
|
|
|
|
+ this.$Modal.error({
|
|
|
|
+ title: this.$t("cusMgt.join.errorTile"),
|
|
|
|
+ content: this.$t("cusMgt.join.errorContent")
|
|
|
|
+ });
|
|
|
|
+ } else if (this.code) {
|
|
|
|
+ //获取登录信息
|
|
|
|
+ let host = this.curSiteConfig.coreAPIUrl;
|
|
|
|
+ let clientId = this.curSiteConfig.clientID;
|
|
|
|
+ this.$api.service
|
|
|
|
+ .getToken(host, {
|
|
|
|
+ grant_type: "authorization_code",
|
|
|
|
+ client_id: clientId,
|
|
|
|
+ code: this.code
|
|
|
|
+ })
|
|
|
|
+ .then(
|
|
|
|
+ (res) => {
|
|
|
|
+ if (!res.error) {
|
|
|
|
+ this.id_token = res.id_token;
|
|
|
|
+ //记录登录状态,保证API请求验证通过
|
|
|
|
+ localStorage.setItem("access_token", res.access_token);
|
|
|
|
+ localStorage.setItem("id_token", res.id_token);
|
|
|
|
+ localStorage.setItem("expires_in", res.expires_in);
|
|
|
|
+ let tokenData = jwtDecode(res.id_token);
|
|
|
|
+ if (tokenData) {
|
|
|
|
+ this.userId = tokenData.sub;
|
|
|
|
+ this.userName = tokenData.name;
|
|
|
|
+ if(!this.allowPick){
|
|
|
|
+ this.joinList();
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ this.$Message.error(this.$t("cusMgt.join.parseErr"));
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ this.$Message.error(this.$t("cusMgt.join.getErr"));
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ (err) => {
|
|
|
|
+ this.$Message.error(this.$t("cusMgt.join.getErr"));
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
|
|
-}
|
|
|
|
|
|
+ // 判断移动端还是PC端
|
|
|
|
+ this.isPC = !/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent);
|
|
|
|
+ console.log("pc", this.isPC);
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ ...mapGetters({
|
|
|
|
+ curSiteConfig: "config/getCurSiteConfig"
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ getGroupListDetails() {
|
|
|
|
+ return new Promise((r, j) => {
|
|
|
|
+ let req = {
|
|
|
|
+ stuListNo: this.listNo
|
|
|
|
+ };
|
|
|
|
+ this.$api.common.getGroupNosByIds(req).then(
|
|
|
|
+ (res) => {
|
|
|
|
+ this.allowPick = res.optNo === 1;
|
|
|
|
+ for (let i = 0; i < res.limitCount; i++) {
|
|
|
|
+ if (!res.nos.includes(i + 1 + "")) {
|
|
|
|
+ this.irsArr.push(i + 1);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ this.pickIRS = this.irsArr[0];
|
|
|
|
+ r(200);
|
|
|
|
+ },
|
|
|
|
+ (err) => {
|
|
|
|
+ this.$Message.error(this.$t("ae.ae35"));
|
|
|
|
+ j(500)
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ joinList() {
|
|
|
|
+ if (!this.id_token && !localStorage.id_token) {
|
|
|
|
+ this.toLogin();
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ let userToken = this.id_token || localStorage.id_token;
|
|
|
|
+ let tokenData = jwtDecode(userToken);
|
|
|
|
+ this.userName = tokenData.name;
|
|
|
|
+ this.userId = tokenData.sub;
|
|
|
|
+ this.$api.courseMgmt
|
|
|
|
+ .qrCodeJoinList({
|
|
|
|
+ stuListNo: this.listNo,
|
|
|
|
+ courseId: this.cusId,
|
|
|
|
+ tmdId: this.userId,
|
|
|
|
+ seatNo: this.pickIRS,
|
|
|
|
+ id_token: userToken,
|
|
|
|
+ school: undefined //加入行政班时需要传对应编码,个人名单不用传
|
|
|
|
+ })
|
|
|
|
+ .then(
|
|
|
|
+ (res) => {
|
|
|
|
+ if (!res.error) {
|
|
|
|
+ this.hasSend = false;
|
|
|
|
+ if (res.status == 2) {
|
|
|
|
+ //重复加入
|
|
|
|
+ this.$Message.success(this.$t("cusMgt.join.repJoin"));
|
|
|
|
+ this.isRep = true;
|
|
|
|
+ } else if (res.status == 1) {
|
|
|
|
+ //参数异常
|
|
|
|
+ this.$Message.success(this.$t("cusMgt.join.joinPErr"));
|
|
|
|
+ } else if (res.status == 0) {
|
|
|
|
+ let userIRS = res.stuList.members.find((i) => i.id === this.userId).irs;
|
|
|
|
+ //正常加入
|
|
|
|
+ this.$Message.success(this.$t("cusMgt.join.joinOk") + ", IRS: " + userIRS);
|
|
|
|
+ this.isJoin = true;
|
|
|
|
+ sessionStorage.setItem("identity", "student");
|
|
|
|
+ } else if (res.status == 4) {
|
|
|
|
+ // 个人名单未开放加入
|
|
|
|
+ this.$Message.warning(this.$t("cusMgt.join.joinLock"));
|
|
|
|
+ } else if (res.status == 6) {
|
|
|
|
+ // 需要审核通过再加入
|
|
|
|
+ this.$Message.warning(this.$t("newCusMgt.joinTip1"));
|
|
|
|
+ this.hasSend = true;
|
|
|
|
+ } else if (res.status == 5) {
|
|
|
|
+ // 人数已满,需要审核通过再加入
|
|
|
|
+ this.$Message.warning(this.$t("newCusMgt.joinTip2"));
|
|
|
|
+ } else if (res.status == 7) {
|
|
|
|
+ // 二维码设置已经过期
|
|
|
|
+ this.$Message.warning(this.$t("newCusMgt.joinTip3"));
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ this.$Message.error(this.$t("cusMgt.join.joinErr"));
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ (err) => {
|
|
|
|
+ this.$Message.error(this.$t("cusMgt.join.joinErr"));
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+ },
|
|
|
|
+ toLogin() {
|
|
|
|
+ // let type = process.env.NODE_ENV //product | development
|
|
|
|
+ let accUrl = this.curSiteConfig.accAPIUrl;
|
|
|
|
+ let clientId = this.curSiteConfig.clientID;
|
|
|
|
+ let callback = decodeURIComponent(window.location.href);
|
|
|
|
+ let state = this.$jsFn.getBtwRandom(1000, 9999);
|
|
|
|
+ let nonce = this.$jsFn.uuid();
|
|
|
|
+ let loginUrl = `${accUrl}/oauth2/authorize?response_type=code&client_id=${clientId}&state=${state}&nonce=${nonce}&redirect_uri=${encodeURIComponent(callback)}`;
|
|
|
|
+ window.location.href = loginUrl;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ };
|
|
</script>
|
|
</script>
|
|
<style scoped lang="less">
|
|
<style scoped lang="less">
|
|
-.success-tips {
|
|
|
|
- color: white;
|
|
|
|
- font-size: 16px;
|
|
|
|
- margin-top: 20px;
|
|
|
|
-}
|
|
|
|
-.join-wrap {
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- justify-content: space-evenly;
|
|
|
|
- align-items: center;
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
- background-image: url("../../assets/image/bak_light.jpg");
|
|
|
|
-}
|
|
|
|
-.join-btn {
|
|
|
|
- cursor: pointer;
|
|
|
|
- width: 100%;
|
|
|
|
- margin: auto;
|
|
|
|
- margin-top: 60px;
|
|
|
|
- text-align: center;
|
|
|
|
- border: 1px solid rgba(25, 190, 107, 0.5);
|
|
|
|
- // color: rgba(25, 190, 107, 1);
|
|
|
|
- color: white;
|
|
|
|
- padding: 4px 30px;
|
|
|
|
- border-radius: 5px;
|
|
|
|
- font-size: 16px;
|
|
|
|
- letter-spacing: 2px;
|
|
|
|
- font-weight: 400;
|
|
|
|
- user-select: none;
|
|
|
|
- background: rgba(25, 190, 107, 0.5);
|
|
|
|
-}
|
|
|
|
-.course-name {
|
|
|
|
- color: white;
|
|
|
|
- margin-bottom: 15px;
|
|
|
|
- font-size: 30px;
|
|
|
|
- // font-family: cursive;
|
|
|
|
-}
|
|
|
|
-.join-main-box {
|
|
|
|
- max-width: 90%;
|
|
|
|
- width: fit-content;
|
|
|
|
- text-align: center;
|
|
|
|
- .info-item {
|
|
|
|
- margin-top: 20px;
|
|
|
|
- font-size: 15px;
|
|
|
|
- width: fit-content;
|
|
|
|
- }
|
|
|
|
- .info-lable {
|
|
|
|
- color: #a5a5a5;
|
|
|
|
- }
|
|
|
|
- .info-value {
|
|
|
|
- color: #eeeeee;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-.join-title {
|
|
|
|
- position: absolute;
|
|
|
|
- top: 15px;
|
|
|
|
- text-align: center;
|
|
|
|
- width: 100%;
|
|
|
|
- left: 0px;
|
|
|
|
- border-bottom: 1px dashed;
|
|
|
|
- padding-bottom: 8px;
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|
|
|
|
+ .success-tips {
|
|
|
|
+ color: white;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ margin-top: 20px;
|
|
|
|
+ }
|
|
|
|
+ .join-wrap {
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ justify-content: space-evenly;
|
|
|
|
+ align-items: center;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ background-image: url("../../assets/image/bak_light.jpg");
|
|
|
|
+ }
|
|
|
|
+ .join-btn {
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ width: 100%;
|
|
|
|
+ margin: auto;
|
|
|
|
+ margin-top: 60px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ border: 1px solid rgba(25, 190, 107, 0.5);
|
|
|
|
+ // color: rgba(25, 190, 107, 1);
|
|
|
|
+ color: white;
|
|
|
|
+ padding: 4px 30px;
|
|
|
|
+ border-radius: 5px;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ letter-spacing: 2px;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ user-select: none;
|
|
|
|
+ background: rgba(25, 190, 107, 0.5);
|
|
|
|
+ }
|
|
|
|
+ .course-name {
|
|
|
|
+ color: white;
|
|
|
|
+ margin-bottom: 15px;
|
|
|
|
+ font-size: 30px;
|
|
|
|
+ // font-family: cursive;
|
|
|
|
+ }
|
|
|
|
+ .join-main-box {
|
|
|
|
+ max-width: 90%;
|
|
|
|
+ width: fit-content;
|
|
|
|
+ text-align: center;
|
|
|
|
+ .info-item {
|
|
|
|
+ margin-top: 20px;
|
|
|
|
+ font-size: 15px;
|
|
|
|
+ width: fit-content;
|
|
|
|
+ }
|
|
|
|
+ .info-lable {
|
|
|
|
+ color: #a5a5a5;
|
|
|
|
+ }
|
|
|
|
+ .info-value {
|
|
|
|
+ color: #eeeeee;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .join-title {
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 15px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ width: 100%;
|
|
|
|
+ left: 0px;
|
|
|
|
+ border-bottom: 1px dashed;
|
|
|
|
+ padding-bottom: 8px;
|
|
|
|
+ }
|
|
|
|
+</style>
|