feat(web): add app detail info dialog (#843)

* feat(web): add app setting

* feat(web): adjust statusBadge width

* feat(web): add user information

* feat(web): fix translation

* refactor(web): move language switch outside

* feat(web): add app detail info

---------

Co-authored-by: kongwy229 <[email protected]>
Co-authored-by: maslow <[email protected]>

Author: 3 people

web/public/locales/en/translation.json

@@ -54,7 +54,7 @@
   "Edit": "Edit ",
   "Generate": "generate",
   "InputTip": "please enter",
-  "IsRequired": "is required",
+  "IsRequired": " is required",
   "LimitSelect": "Please select at least one",
   "Logout": "Logout",
   "Name": "name",
@@ -137,8 +137,32 @@
     "Expire": "Expiration",
     "Setting": "Setting",
     "SystemSetting": "Application Settings",
-    "UserSetting": "User Settings",
-    "UpdateConfirm": "Update env will restart application, are you sure?"
+    "UserSetting": "User Info",
+    "UpdateConfirm": "Update env will restart application, are you sure?",
+    "BaseInfo": "Basic Information",
+    "DB": "Database",
+    "Delete": "Delete",
+    "Detail": "Rules details (experimental version)",
+    "Disk": "Hard Disk",
+    "Memory": "Memory",
+    "Restart": "Restart",
+    "network": "Outgoing capacity",
+    "Close": "Close",
+    "AppInfo": "Application Information",
+    "Auth": "Real-name Authentication",
+    "Code": "Code",
+    "CodeTip": "Please enter a four-digit verification code",
+    "ID": "ID",
+    "IDTip": "Please enter a valid ID number",
+    "Name": "Real name",
+    "Registered": "Registered Time",
+    "SendCode": "Send Code",
+    "Tel": "Mobile number",
+    "TelTip": "Please enter a valid Mobile phone number",
+    "ToAuth": "Authenticate Now",
+    "UserInfo": "User Information",
+    "noAuth": "Not Authenticated",
+    "showAuth": "Go to Auth"
   },
   "StoragePanel": {
     "All": "Total Capacity",
@@ -190,7 +214,8 @@
     "CurrentDomain": "Current domain: ",
     "RemoveHost": "Remove Host",
     "CancelHost": "Cancel Host",
-    "InstantUpload": "Instant Upload"
+    "InstantUpload": "Instant Upload",
+    "parsing": "parsing"
   },
   "TriggerPanel": {
     "AddTrigger": "Add Trigger",
@@ -223,13 +248,19 @@
   "EditTip": "modified, unpublished",
   "NoInfo": "No information",
   "RefreshDataSuccess": "data refreshed",
-  "Language": "Language",
   "database example": "database example",
   "update success": "update completed",
   "Take me home": "Take me home",
   "404Message": "We can't find that page",
   "403Message": "You don't have permission to access this page",
   "Bucket": {
     "StatusTip": "External access needs to set the bucket permission to readonly"
-  }
+  },
+  "Restart": "Restart",
+  "ShutDown": "ShutDown",
+  "Charge": "Charge",
+  "Back": "Return",
+  "Personal Access Token": "Personal Access Token",
+  "SwitchLanguage": "Switch Language",
+  "Storage": "Storage"
 }

web/public/locales/zh-CN/translation.json

@@ -125,8 +125,32 @@
     "AppEnv": "环境变量",
     "AddAppEnv": "新增环境变量",
     "Expire": "过期时间",
-    "UserSetting": "用户设置",
-    "UpdateConfirm": "更新环境变量将重新启动应用，是否继续？"
+    "UserSetting": "用户信息",
+    "UpdateConfirm": "更新环境变量将重新启动应用，是否继续？",
+    "AppInfo": "应用信息",
+    "Restart": "重启应用",
+    "Delete": "删除应用",
+    "Close": "关闭应用",
+    "BaseInfo": "基础信息",
+    "Detail": "规则详情",
+    "Memory": "内存",
+    "Disk": "硬盘",
+    "DB": "数据库",
+    "network": "出网容量",
+    "UserInfo": "用户信息",
+    "Auth": "实名认证",
+    "Tel": "手机号",
+    "SendCode": "发送验证码",
+    "Code": "验证码",
+    "Name": "真实姓名",
+    "ID": "身份证号",
+    "ToAuth": "立即认证",
+    "showAuth": "去认证",
+    "noAuth": "未实名",
+    "IDTip": "请输入有效的身份证号码",
+    "CodeTip": "请输入四位数字验证码",
+    "TelTip": "请输入有效的手机号码",
+    "Registered": "注册时间"
   },
   "StoragePanel": {
     "CreateBucket": "创建 Bucket",
@@ -224,13 +248,19 @@
   "RefreshData": "刷新数据",
   "NoInfo": "暂无信息",
   "RefreshDataSuccess": "数据刷新成功",
-  "Language": "语言",
   "database example": "database 示例",
   "update success": "更新成功",
   "Take me home": "返回首页",
   "404Message": "找不到当前内容",
   "403Message": "当前用户没有权限",
   "Bucket": {
     "StatusTip": "外部访问需要将 bucket 权限设置为 readonly"
-  }
+  },
+  "Restart": "重启应用",
+  "ShutDown": "关闭应用",
+  "Charge": "余额充值",
+  "Back": "返回",
+  "Personal Access Token": "访问凭证 (PAT)",
+  "SwitchLanguage": "切换语言",
+  "Storage": "云存储"
 }

web/public/locales/zh/translation.json

@@ -138,7 +138,31 @@
     "Setting": "设置",
     "SystemSetting": "应用设置",
     "UserSetting": "用户设置",
-    "UpdateConfirm": "更新环境变量将重新启动应用，是否继续？"
+    "UpdateConfirm": "更新环境变量将重新启动应用，是否继续？",
+    "AppInfo": "应用信息",
+    "BaseInfo": "基础信息",
+    "Detail": "规则详情",
+    "Memory": "内存",
+    "Disk": "硬盘",
+    "DB": "数据库",
+    "network": "出网容量",
+    "Close": "关闭应用",
+    "Delete": "删除应用",
+    "Restart": "重启应用",
+    "UserInfo": "用户信息",
+    "Auth": "实名认证",
+    "Tel": "手机号",
+    "SendCode": "发送验证码",
+    "Code": "验证码",
+    "Name": "真实姓名",
+    "ID": "身份证号",
+    "ToAuth": "立即认证",
+    "showAuth": "去认证",
+    "noAuth": "未实名",
+    "IDTip": "请输入有效的身份证号码",
+    "CodeTip": "请输入四位数字验证码",
+    "TelTip": "请输入有效的手机号码",
+    "Registered": "注册时间"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -190,7 +214,8 @@
     "CurrentDomain": "当前域名: ",
     "CancelHost": "取消托管",
     "Inaccessible": "无法访问",
-    "InstantUpload": "立即上传"
+    "InstantUpload": "立即上传",
+    "RemoveHost": "取消静态托管"
   },
   "TriggerPanel": {
     "AddTrigger": "新建触发器",
@@ -223,13 +248,19 @@
   "EditTip": "已修改,未发布",
   "NoInfo": "暂无信息",
   "RefreshDataSuccess": "数据刷新成功",
-  "Language": "语言",
   "database example": "database 示例",
   "update success": "更新成功",
   "Take me home": "返回首页",
   "404Message": "找不到当前内容",
   "403Message": "当前用户没有权限",
   "Bucket": {
     "StatusTip": "外部访问需要将 bucket 权限设置为 readonly"
-  }
+  },
+  "Restart": "重启应用",
+  "ShutDown": "关闭应用",
+  "Charge": "余额充值",
+  "Back": "返回",
+  "Personal Access Token": "访问凭证 (PAT)",
+  "SwitchLanguage": "切换语言",
+  "Storage": "云存储"
 }

web/src/apis/typing.d.ts

@@ -2,103 +2,139 @@ export type TApplication = {
   id: string;
   name: string;
   appid: string;
-  regionName: string;
-  bundleName: string;
-  runtimeName: string;
+  regionId: string;
+  runtimeId: string;
+  tags: any[];
   state: string;
   phase: string;
-  tags: any[];
   createdAt: string;
   updatedAt: string;
+  lockedAt: string;
   createdBy: string;
   bundle: TBundle;
-  runtime: Runtime;
-  configuration: Configuration;
-  domain: Domain;
-  storage: Storage;
-  tls: boolean;
-  develop_token: string;
+  runtime: TRuntime;
+  configuration: TConfiguration;
+  domain: TDomain;
+  storage: TStorage;
   port: number;
+  develop_token: string;
+  tls: boolean;
+  function_debug_token: string;
   host: string;
   origin: string;
 };
 
 export type TBundle = {
   id: string;
+  appid: string;
   name: string;
   displayName: string;
-  regionName: string;
+  resource: TResource;
+  price: number;
+  createdAt: string;
+  updatedAt: string;
+};
+
+export type TResource = {
   limitCPU: number;
   limitMemory: number;
   requestCPU: number;
   requestMemory: number;
   databaseCapacity: number;
   storageCapacity: number;
   networkTrafficOutbound: number;
-  priority: number;
-  state: string;
-  price: number;
 };
 
-export type Runtime = {
+export type TRuntime = {
   id: string;
   name: string;
   type: string;
-  image: Image;
+  image: TImage;
+  state: string;
   version: string;
   latest: boolean;
 };
 
-export type Image = {
+export type TImage = {
   main: string;
   init: string;
   sidecar: any;
 };
 
-export type Configuration = {
+export type TConfiguration = {
   id: string;
   appid: string;
-  environments: Environment[];
+  environments: TEnvironment[];
   dependencies: any[];
   createdAt: string;
   updatedAt: string;
 };
 
-export type Environment = {
+export type TEnvironment = {
   name: string;
   value: string;
 };
 
-export type Domain = {
+export type TDomain = {
   id: string;
   appid: string;
-  bucketName: string;
   domain: string;
   state: string;
   phase: string;
+  lockedAt: string;
   createdAt: string;
   updatedAt: string;
-  lockedAt: string;
 };
 
-export type Storage = {
+export type TStorage = {
+  credentials: TCredentials;
   id: string;
   appid: string;
   accessKey: string;
   secretKey: string;
+  state: string;
+  phase: string;
+  lockedAt: string;
   createdAt: string;
   updatedAt: string;
-  credentials: Credentials;
 };
 
-export type Credentials = {
+export type TCredentials = {
   endpoint: string;
   accessKeyId: string;
   secretAccessKey: string;
   sessionToken: string;
   expiration: string;
 };
 
+export type TRegion = {
+  id: string;
+  name: string;
+  displayName: string;
+  state: string;
+  bundles: TBundle[];
+};
+
+export type TBundle = {
+  id: string;
+  name: string;
+  displayName: string;
+  price: number;
+  priority: number;
+  state: string;
+  resource: TResource;
+};
+
+export type TResource = {
+  limitCPU: number;
+  limitMemory: number;
+  requestCPU: number;
+  requestMemory: number;
+  databaseCapacity: number;
+  storageCapacity: number;
+  networkTrafficOutbound: number;
+};
+
 export type TBucket = {
   id: string;
   appid: string;
@@ -110,7 +146,7 @@ export type TBucket = {
   lockedAt: string;
   createdAt: string;
   updatedAt: string;
-  domain: Domain;
+  domain: TDomain;
   websiteHosting: TWebsiteHosting;
 };