集成登录

src/views/login/index.vue

@@ -102,6 +102,37 @@
         <a @click="changeLoginReg('Forget password')">好的</a>
       </div>
     </div>
+    <el-dialog
+      :visible.sync="showOrgList"
+      width="494px"
+      append-to-body
+      :show-close="false"
+      :close-on-click-modal="false"
+      class="login-org-list"
+    >
+      <div class="org-list-box">
+        <h3>请选择你所在的学校</h3>
+        <h4>Please select your school</h4>
+        <div class="org-list">
+          <el-select
+            v-model="org_id"
+            :placeholder="'点击选择'"
+            v-loadmore="SelectScroll"
+            v-loading="SelectLoading"
+          >
+            <el-option
+              v-for="item in institutionList.org_list"
+              :key="item.id"
+              :value="item.id"
+              :label="item.name"
+            ></el-option>
+          </el-select>
+          <el-button type="primary" @click="getLoginClever(code, 'orgId')"
+            >确定</el-button
+          >
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -270,6 +301,15 @@ export default {
       emailTipShow: false,
       emailTipDay: 0,
       loading: false,
+      org_id: "",
+      showOrgList: false,
+      SelectLoading: false,
+      institutionList: {
+        org_list: [],
+      }, //机构列表
+      inPage: 1,
+      inPageSize: 100,
+      code: "",
     };
   },
   //计算属性 类似于data概念
@@ -459,27 +499,34 @@ export default {
       this.browserRedirect();
     },
     // clever登录
-    getLoginClever(code) {
+    getLoginClever(code, type) {
+      if (type && !this.org_id) {
+        return;
+      }
       this.loading = true;
-      getLogin("login_control-Login_Clever", { code })
+
+      let data = {
+        code: code,
+        is_first_login: type ? "false" : "true",
+        org_id: type ? this.org_id : "",
+      };
+      getLogin("login_control-Login_Clever", data)
         .then((res) => {
           this.loading = false;
           if (res.status == -5) {
             this.$message.error(res.error);
             return;
           }
-
+          if (res.is_new_email && res.is_new_email === "true") {
+            this.showOrgList = true;
+            return;
+          } else {
+            this.showOrgList = false;
+          }
           setToken(res);
           let isShare = this.$route.query.temporary_link
             ? decodeURIComponent(this.$route.query.temporary_link)
             : "";
-          // if (
-          //   res.last_update_password_days >=
-          //     res.sys_recommend_password_update_days &&
-          //   !isShare
-          // ) {
-          //   this.changeEmailTips(res.last_update_password_days);
-          // } else {
           this.$message.success(this.$t("Key442"));
           setI18nLang(this.language_type).then(() => {
             if (isShare) {
@@ -494,15 +541,52 @@ export default {
               this.$message.warning(this.$t("Key247") + "....");
               location.href = `/GCLS-Learn/#/EnterSys`;
             } else {
+              this.LoginOrRegistration = "";
               this.getChildSysList();
             }
           });
-          // }
         })
         .catch((err) => {
           this.loading = false;
         });
     },
+    // 滚动加载
+    SelectScroll() {
+      if (
+        this.institutionList.org_list.length == this.institutionList.total_count
+      ) {
+        // this.$message.warning("No more data");
+        return;
+      }
+      this.SelectLoading = true;
+      this.inPage++;
+      let MethodName = "org_manager-PageQueryOrgIndexList_OpenQuery";
+      let data = {
+        name: "",
+        page_capacity: this.inPageSize,
+        cur_page: this.inPage,
+      };
+      getLogin(MethodName, data).then((res) => {
+        res.org_list.forEach((item) => {
+          this.institutionList.org_list.push(item);
+        });
+        this.SelectLoading = false;
+      });
+    },
+    // 获取机构列表
+    getinstitutionList() {
+      this.loading = true;
+      let MethodName = "org_manager-PageQueryOrgIndexList_OpenQuery";
+      let data = {
+        name: "",
+        page_capacity: this.inPageSize,
+        cur_page: this.inPage,
+      };
+      getLogin(MethodName, data).then((res) => {
+        this.loading = false;
+        this.institutionList = res;
+      });
+    },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   async created() {
@@ -522,6 +606,7 @@ export default {
         "Key20",
         "Key21",
         "Key22",
+        "Key32",
         "Key34",
         "Key35",
         "Key36",
@@ -553,10 +638,12 @@ export default {
       ],
     });
     this.isData = true;
-    const code = window.location.search.split("?")[1]?.split("=")[1]; // 获取识别码
-    if (code) {
-      this.getLoginClever(code);
+    this.code = window.location.search.split("?")[1]?.split("=")[1]; // 获取识别码
+    // this.code = this.$route.query.code;
+    if (this.code) {
+      this.getLoginClever(this.code);
     }
+    this.getinstitutionList();
   },
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
@@ -828,3 +915,39 @@ export default {
   }
 }
 </style>
+<style lang="scss">
+.login-org-list {
+  .el-dialog__header {
+    padding: 0;
+  }
+  .el-dialog__body {
+    text-align: center;
+    padding: 40px;
+  }
+  h3 {
+    color: #000;
+    font-size: 24px;
+    font-weight: 500;
+    line-height: 32px; /* 133.333% */
+    margin: 0;
+  }
+  h2 {
+    color: #000;
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 24px; /* 150% */
+    margin: 8px 0 24px 0;
+  }
+  .org-list {
+    display: flex;
+    column-gap: 16px;
+    .el-select {
+      flex: 1;
+    }
+    .el-button--primary {
+      background-color: #165dff;
+      border-color: #165dff;
+    }
+  }
+}
+</style>