feat(web): support real name authentication (#1450)

* feat(web): add real name authentication * refactor(web): add comfirm to restart and pause app & adjust dashboard empty page * refactor(web): remove auth detail * fix(web): change sitesetting id_verify value * fix(web): fix location
labring · Aug 22, 2023 · 4b3126d · 4b3126d
1 parent 924e0fa
commit 4b3126d
Show file tree

Hide file tree

Showing 15 changed files with 349 additions and 278 deletions.
diff --git a/web/public/locales/en/translation.json b/web/public/locales/en/translation.json
@@ -139,7 +139,9 @@
     "DeleteApp": "delete apps",
     "DeleteTip": "The current operation will permanently delete applications, including functions, data, cloud storage, etc. related data related to the application. After deleting, <strong> will not be able to cancel </strong>,please enter <strong>{{appId}}</strong> confirm",
     "Duration": "Duration",
-    "Spec": "Spec"
+    "Spec": "Spec",
+    "WelcomeTo": "Welcome to",
+    "LAF": "the LAF cloud development platform!"
   },
   "SpecItem": {
     "cpu": "CPU",
@@ -204,7 +206,9 @@
     "CostTrend": "Cost Trend",
     "Balance": "Balance",
     "Pause": "Pause",
-    "AppMonitor": "Application Monitor"
+    "AppMonitor": "App Monitoring",
+    "PauseTips": "Are you sure you want to pause this application?",
+    "RestartTips": "Are you sure you want to restart this application?"
   },
   "StoragePanel": {
     "All": "Total Capacity",
@@ -558,7 +562,12 @@
     "Email": "Email",
     "ChangeEmail": "Change Email",
     "SmsNumber": "Verification Code",
-    "ChangeEmailSuccess": "Change Email Success"
+    "ChangeEmailSuccess": "Change Email Success",
+    "GotoAuth": "Go to Authenticate",
+    "NoAuth": "Not Real-name Verified",
+    "WarnTips": "You have not yet completed real-name authentication.",
+    "PleaseBindPhone": "Please bind your mobile number first",
+    "VerifiedIdentity": "Verified Identity"
   },
   "Reset": "Reset",
   "SettingModal": {
@@ -612,6 +621,7 @@
     "Quit": "Quit"
   },
   "Collaborative": "Collaborative",
+  "CreateApp": "New Application",
   "Used": "Used",
   "Remaining": "Remaining",
   "Pod": "Pod"

diff --git a/web/public/locales/zh-CN/translation.json b/web/public/locales/zh-CN/translation.json
@@ -139,7 +139,9 @@
     "DeleteApp": "删除 APP",
     "DeleteTip": "当前操作将会永久删除应用, 包括函数、数据、云存储等与应用相关的数据, 删除后<strong>将无法撤消</strong>,  请输入 <strong>{{appId}}</strong> 后确认",
     "Duration": "购买时长",
-    "Spec": "规格"
+    "Spec": "规格",
+    "WelcomeTo": "欢迎来到 ",
+    "LAF": " LAF 云开发平台！"
   },
   "SpecItem": {
     "cpu": "CPU",
@@ -204,7 +206,9 @@
     "CostTrend": "成本趋势",
     "Balance": "余额",
     "Pause": "暂停应用",
-    "AppMonitor": "资源监控"
+    "AppMonitor": "资源监控",
+    "PauseTips": "确定要暂停此应用吗？",
+    "RestartTips": "确定要重启此应用吗？"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -558,7 +562,12 @@
     "Email": "邮箱",
     "ChangeEmail": "更改邮箱",
     "SmsNumber": "验证码",
-    "ChangeEmailSuccess": "修改邮箱成功"
+    "ChangeEmailSuccess": "修改邮箱成功",
+    "GotoAuth": "去认证",
+    "NoAuth": "未实名",
+    "WarnTips": "您尚未实名认证",
+    "PleaseBindPhone": "请先绑定手机号",
+    "VerifiedIdentity": "已实名"
   },
   "Reset": "重置",
   "SettingModal": {
@@ -612,6 +621,7 @@
     "Quit": "退出"
   },
   "Collaborative": "协作",
+  "CreateApp": "新建应用",
   "Used": "已使用",
   "Remaining": "剩余",
   "Pod": "实例"

diff --git a/web/public/locales/zh/translation.json b/web/public/locales/zh/translation.json
@@ -139,7 +139,9 @@
     "DeleteApp": "删除 APP",
     "DeleteTip": "当前操作将会永久删除应用, 包括函数、数据、云存储等与应用相关的数据, 删除后<strong>将无法撤消</strong>,  请输入 <strong>{{appId}}</strong> 后确认",
     "Duration": "购买时长",
-    "Spec": "规格"
+    "Spec": "规格",
+    "WelcomeTo": "欢迎来到 ",
+    "LAF": " LAF 云开发平台！"
   },
   "SpecItem": {
     "cpu": "CPU",
@@ -204,7 +206,9 @@
     "CostTrend": "成本趋势",
     "Balance": "余额",
     "Pause": "暂停应用",
-    "AppMonitor": "资源监控"
+    "AppMonitor": "资源监控",
+    "PauseTips": "确定要暂停此应用吗？",
+    "RestartTips": "确定要重启此应用吗？"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -558,7 +562,12 @@
     "Email": "邮箱",
     "ChangeEmail": "更改邮箱",
     "SmsNumber": "验证码",
-    "ChangeEmailSuccess": "修改邮箱成功"
+    "ChangeEmailSuccess": "修改邮箱成功",
+    "GotoAuth": "去认证",
+    "NoAuth": "未实名",
+    "WarnTips": "您尚未实名认证",
+    "PleaseBindPhone": "请先绑定手机号",
+    "VerifiedIdentity": "已实名"
   },
   "Reset": "重置",
   "SettingModal": {
@@ -612,6 +621,7 @@
     "Quit": "退出"
   },
   "Collaborative": "协作",
+  "CreateApp": "新建应用",
   "Used": "已使用",
   "Remaining": "剩余",
   "Pod": "实例"

diff --git a/web/src/apis/v1/api-auto.d.ts b/web/src/apis/v1/api-auto.d.ts
@@ -507,6 +507,7 @@ declare namespace Definitions {
     name?: string;
     createdAt?: string;
     updatedAt?: string;
+    idVerified?: { isVerified?: boolean };
   };
 
   export type CreateDependencyDto = {

diff --git a/web/src/layouts/Basic/RealNameWarn.tsx b/web/src/layouts/Basic/RealNameWarn.tsx
@@ -0,0 +1,48 @@
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { WarningTwoIcon } from "@chakra-ui/icons";
+
+import SettingModal from "@/pages/app/setting";
+import useTabMatch from "@/pages/app/setting/UserSetting/useTabMatch";
+import useGlobalStore from "@/pages/globalStore";
+import useSiteSettingStore from "@/pages/siteSetting";
+
+export default function Warn() {
+  const { t } = useTranslation();
+  const { userInfo, showError } = useGlobalStore((state) => state);
+  const [openModal, setOpenModal] = useState(false);
+  const { siteSettings } = useSiteSettingStore((state) => state);
+
+  return (
+    <div className="absolute left-1/2 top-10 flex h-16 translate-x-[-50%] items-center justify-between rounded-lg bg-white px-4 text-lg drop-shadow-md">
+      <span className="flex items-center pr-9">
+        <WarningTwoIcon className="mr-2 !text-error-600" />
+        <p>{siteSettings.id_verify?.metadata.message}</p>
+      </span>
+      <p
+        className="cursor-pointer font-semibold text-[#219BF4]"
+        onClick={() => {
+          if (userInfo?.phone) {
+            const w = window.open("about:blank");
+            w!.location.href = `${
+              siteSettings.id_verify?.metadata.authenticateSite
+            }?token=${localStorage.getItem("token")}`;
+          } else {
+            showError(t("UserInfo.PleaseBindPhone"));
+            setOpenModal(true);
+          }
+        }}
+      >
+        {t("UserInfo.GotoAuth")}
+      </p>
+
+      <SettingModal
+        headerTitle={t("SettingPanel.UserCenter")}
+        currentTab={"user-info"}
+        tabMatch={useTabMatch("user")}
+        openModal={openModal}
+        setOpenModal={setOpenModal}
+      />
+    </div>
+  );
+}
diff --git a/web/src/layouts/Basic.tsx → web/src/layouts/Basic/index.tsx b/web/src/layouts/Basic.tsx → web/src/layouts/Basic/index.tsx
@@ -3,25 +3,33 @@ import { AiFillHeart } from "react-icons/ai";
 import { Outlet } from "react-router-dom";
 import { Center, Spinner } from "@chakra-ui/react";
 
+import Warn from "./RealNameWarn";
+
 import Header from "@/layouts/Header";
 import useGlobalStore from "@/pages/globalStore";
+import useSiteSettingStore from "@/pages/siteSetting";
 
 export default function BasicLayout() {
-  const { init, loading } = useGlobalStore((state) => state);
+  const { init, loading, userInfo } = useGlobalStore((state) => state);
+  const { siteSettings } = useSiteSettingStore((state) => state);
+
   useEffect(() => {
     init();
   }, [init]);
-
   return (
     <div>
       <Header width="" />
       <div className="pb-10">
         {loading ? (
-          <Center style={{ minHeight: 300 }}>
+          <Center style={{ minHeight: 500 }}>
             <Spinner />
           </Center>
         ) : (
-          <Outlet />
+          <>
+            {siteSettings.id_verify?.value === "on" &&
+              !userInfo?.profile?.idVerified?.isVerified && <Warn />}
+            <Outlet />
+          </>
         )}
       </div>
       <div className="fixed bottom-0 -z-10 w-full py-4 text-center">

diff --git a/web/src/pages/app/setting/UserInfo/AuthDetail/index.tsx b/web/src/pages/app/setting/UserInfo/AuthDetail/index.tsx