perf: 优化天翼云cdn 等待5秒部署完成

packages/ui/certd-client/src/locales/langs/zh-CN/certd.ts

@@ -604,7 +604,7 @@ export default {
   limitUserPipelineCountHelper: "0为不限制",
   enableSelfRegistration: "开启自助注册",
   enableUserValidityPeriod: "开启用户有效期",
-  userValidityPeriodHelper: "有效期内用户可正常使用，失效后流水线将被停用",
+  userValidityPeriodHelper: "有效期内用户可正常使用，失效后用户的流水线将被停用",
   enableUsernameRegistration: "开启用户名注册",
   enableEmailRegistration: "开启邮箱注册",
   proFeature: "专业版功能",
@@ -762,12 +762,12 @@ export default {
       fixedCertExpireDaysHelper: "固定证书有效期天数，有助于列表进度条整齐显示",
       fixedCertExpireDaysRecommend: "推荐90",
 
-      enableOauth: "启用OAuth2登录",
-      oauthEnabledHelper: "是否启用OAuth2登录",
-      oauthProviders: "OAuth2登录提供商",
-      oauthType: "OAuth2登录类型",
-      oauthConfig: "OAuth2登录配置",
-      oauthProviderSelectorPlaceholder: "请选择OAuth2登录提供商",
+      enableOauth: "启用第三方登录",
+      oauthEnabledHelper: "是否启用第三方登录",
+      oauthProviders: "第三方登录提供商",
+      oauthType: "第三方登录类型",
+      oauthConfig: "第三方登录配置",
+      oauthProviderSelectorPlaceholder: "请选择第三方登录提供商",
     },
   },
   modal: {

packages/ui/certd-client/src/views/certd/mine/api.ts

@@ -22,3 +22,36 @@ export async function UpdateProfile(form: any) {
     data: form,
   });
 }
+
+export async function GetOauthBounds() {
+  return await request({
+    url: "/oauth/bounds",
+    method: "POST",
+  });
+}
+
+export async function GetOauthProviders() {
+  return await request({
+    url: "/oauth/providers",
+    method: "POST",
+  });
+}
+
+export async function UnbindOauth(type: string) {
+  return await request({
+    url: "/oauth/unbind",
+    method: "POST",
+    data: { type },
+  });
+}
+
+export async function OauthBoundUrl(type: string) {
+  return await request({
+    url: "/oauth/login",
+    method: "POST",
+    data: {
+      type,
+      forType: "bind",
+    },
+  });
+}

packages/ui/certd-client/src/views/certd/mine/user-profile.vue

@@ -15,7 +15,14 @@
         </a-descriptions-item>
         <a-descriptions-item :label="t('authentication.email')">{{ userInfo.email }}</a-descriptions-item>
         <a-descriptions-item :label="t('authentication.phoneNumber')">{{ userInfo.phoneCode }}{{ userInfo.mobile }}</a-descriptions-item>
-        <a-descriptions-item></a-descriptions-item>
+        <a-descriptions-item v-if="settingStore.sysPublic.oauthEnabled && settingStore.isPlus" label="第三方账号绑定">
+          <div v-for="item in computedOauthBounds" :key="item.name" class="flex items-center gap-2">
+            <fs-icon :icon="item.icon" class="mr-2 text-blue-500" />
+            <span class="mr-2 w-36">{{ item.title }}</span>
+            <a-button v-if="item.bound" type="link" danger @click="unbind(item.name)">解绑</a-button>
+            <a-button v-else type="primary" @click="bind(item.name)">绑定</a-button>
+          </div>
+        </a-descriptions-item>
         <a-descriptions-item :label="t('common.handle')">
           <a-button type="primary" @click="doUpdate">{{ t("authentication.updateProfile") }}</a-button>
           <change-password-button class="ml-10" :show-button="true"> </change-password-button>
@@ -27,10 +34,12 @@
 
 <script lang="ts" setup>
 import * as api from "./api";
-import { Ref, ref } from "vue";
+import { computed, onMounted, Ref, ref } from "vue";
 import ChangePasswordButton from "/@/views/certd/mine/change-password-button.vue";
 import { useI18n } from "/src/locales";
 import { useUserProfile } from "./use";
+import { Modal } from "ant-design-vue";
+import { useSettingStore } from "/@/store/settings";
 
 const { t } = useI18n();
 
@@ -38,13 +47,13 @@ defineOptions({
   name: "UserProfile",
 });
 
+const settingStore = useSettingStore();
+
 const userInfo: Ref = ref({});
 
 const getUserInfo = async () => {
   userInfo.value = await api.getMineInfo();
 };
-getUserInfo();
-
 const { openEditProfileDialog } = useUserProfile();
 
 function doUpdate() {
@@ -54,4 +63,51 @@ function doUpdate() {
     },
   });
 }
+
+const oauthBounds = ref([]);
+const oauthProviders = ref([]);
+async function loadOauthBounds() {
+  const res = await api.GetOauthBounds();
+  oauthBounds.value = res;
+}
+async function loadOauthProviders() {
+  const res = await api.GetOauthProviders();
+  oauthProviders.value = res;
+}
+
+const computedOauthBounds = computed(() => {
+  const list = oauthProviders.value.map(item => {
+    const bound = oauthBounds.value.find(bound => bound.type === item.name);
+    return {
+      ...item,
+      bound,
+    };
+  });
+  return list;
+});
+
+async function unbind(type: string) {
+  Modal.confirm({
+    title: "确认解绑吗？",
+    okText: "确认",
+    okType: "danger",
+    onOk: async () => {
+      await api.UnbindOauth(type);
+      await loadOauthBounds();
+    },
+  });
+}
+
+async function bind(type: string) {
+  //获取第三方登录URL
+  const res = await api.OauthBoundUrl(type);
+  const loginUrl = res.loginUrl;
+  window.location.href = loginUrl;
+}
+
+onMounted(async () => {
+  await getUserInfo();
+  await loadOauthBounds();
+  await loadOauthProviders();
+});
 </script>

packages/ui/certd-client/src/views/framework/login/index.vue

@@ -65,7 +65,7 @@
         </div>
       </a-form-item>
 
-      <div v-if="!queryBindCode" class="w-full">
+      <div v-if="!queryBindCode && settingStore.sysPublic.oauthEnabled && settingStore.isPlus" class="w-full">
         <oauth-footer></oauth-footer>
       </div>
     </a-form>
@@ -82,7 +82,7 @@
         <loading-button type="primary" size="large" html-type="button" class="login-button" :click="handleTwoFactorSubmit">OTP验证登录</loading-button>
       </a-form-item>
 
-      <a-form-item class="user-login-other">
+      <a-form-item class="mt-10">
         <a class="register" @click="twoFactor.loginId = null"> 返回 </a>
       </a-form-item>
     </a-form>

packages/ui/certd-client/src/views/framework/oauth/api.ts

@@ -2,12 +2,13 @@ import { request } from "/src/api/service";
 
 const apiPrefix = "/oauth";
 
-export async function OauthLogin(type: string) {
+export async function OauthLogin(type: string, forType?: string) {
   return await request({
     url: apiPrefix + `/login`,
     method: "post",
     data: {
       type,
+      forType: forType || "login",
     },
   });
 }

packages/ui/certd-client/src/views/framework/oauth/oauth-callback.vue

@@ -5,16 +5,16 @@
         <span v-if="!error">登录中...</span>
         <span v-else>{{ error }}</span>
       </div>
-      <div v-else class="oauth-callback-title">
-        <div>第三方登录成功，还未绑定账号，请选择</div>
+      <div v-else class="oauth-callback-title mt-10">
+        <div>第三方（{{ oauthType }}）登录成功，您还未绑定账号，请选择</div>
 
-        <div>
-          <a-button class="w-full mt-5" type="primary" @click="goBindUser">绑定已有账号</a-button>
-          <a-button class="w-full mt-5" type="primary" @click="autoRegister">创建新账号</a-button>
+        <div class="mt-10">
+          <a-button class="w-full mt-10" type="primary" @click="goBindUser">绑定已有账号</a-button>
+          <a-button class="w-full mt-10" type="primary" @click="autoRegister">创建新账号</a-button>
         </div>
 
-        <div class="w-full mt-5">
-          <router-link to="/login" class="w-full mt-5" type="primary">返回登录页</router-link>
+        <div class="w-full mt-10">
+          <router-link to="/login" class="w-full mt-10" type="primary">返回登录页</router-link>
         </div>
       </div>
     </div>
@@ -26,11 +26,13 @@ import { ref, onMounted } from "vue";
 import * as api from "./api";
 import { useRoute, useRouter } from "vue-router";
 import { useUserStore } from "/@/store/user";
+import { notification } from "ant-design-vue";
 
 const route = useRoute();
 const router = useRouter();
 const oauthType = route.params.type as string;
 const validationCode = route.query.validationCode as string;
+const forType = route.query.forType as string;
 const error = ref(route.query.error as string);
 const userStore = useUserStore();
 
@@ -58,6 +60,18 @@ onMounted(async () => {
   if (error.value) {
     return;
   }
+
+  if (forType === "bind") {
+    //绑定第三方账号
+    await api.BindUser(validationCode);
+    notification.success({
+      message: "绑定成功",
+    });
+    //跳转到首页
+    router.replace("/certd/mine/user-profile");
+    return;
+  }
+
   await handleOauthToken();
 });
 
@@ -86,7 +100,7 @@ async function autoRegister() {
   justify-content: center;
   align-items: center;
   gap: 16px;
-
+  width: 100%;
   .oauth-callback-content {
     display: flex;
     justify-content: center;
@@ -96,12 +110,14 @@ async function autoRegister() {
     border-radius: 16px;
     box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
     width: 500px;
+    max-width: 90%;
     margin: 0 auto;
     margin-top: 50px;
     margin-bottom: 100px;
+    min-height: 200px;
 
     .oauth-callback-title {
-      font-size: 24px;
+      font-size: 16px;
       font-weight: 500;
     }
   }