feat(web): add billing center (labring#1371)

* feat(web): initialize billing center * feat(web): add user-invite * refactor(web): change custom domain position * feat(web): add billing detail interface * feat(web): add recharge order details * fix(web): fix amount display * fix(web): fix gift code mutate data & recharge data * fix(web): fix recharge order * refactor(web): add user setting popover
HUAHUAI23 · Jul 7, 2023 · 1f3e5df · 1f3e5df
1 parent d1423bb
commit 1f3e5df
Show file tree

Hide file tree

Showing 48 changed files with 2,511 additions and 456 deletions.
diff --git a/web/package-lock.json b/web/package-lock.json
diff --git a/web/package.json b/web/package.json
@@ -36,6 +36,7 @@
     "qrcode.react": "^3.1.0",
     "react": "18.2.0",
     "react-datepicker": "^4.11.0",
+    "react-day-picker": "^8.8.0",
     "react-dom": "18.2.0",
     "react-hook-form": "^7.43.9",
     "react-i18next": "^12.3.1",
@@ -44,6 +45,7 @@
     "react-markdown": "^8.0.7",
     "react-router-dom": "^6.11.2",
     "react-syntax-highlighter": "^15.5.0",
+    "recharts": "^2.7.2",
     "remark-gfm": "^3.0.1",
     "remark-math": "^5.1.1",
     "sass": "^1.62.1",

diff --git a/web/public/locales/en/translation.json b/web/public/locales/en/translation.json
@@ -189,7 +189,19 @@
     "UserName": "UserName",
     "Email": "Email",
     "PassWord": "PassWord",
-    "UserInvite": "UserInvite"
+    "UserInvite": "UserInvite",
+    "UserCenter": "User Center",
+    "CostOverview": "Cost Overview",
+    "CardRedemption": "Card Redemption",
+    "BillingDetails": "Billing Details",
+    "RechargeHistory": "Recharge History",
+    "PricingStandards": "Pricing Standards",
+    "EnterGiftCode": "Enter Gift Code",
+    "ExchangeSuccess": "Exchange Success",
+    "Domain": "Custom Domain",
+    "MyAccount": "My Account",
+    "CostTrend": "Cost Trend",
+    "Balance": "Balance"
   },
   "StoragePanel": {
     "All": "Total Capacity",
@@ -244,7 +256,8 @@
     "InstantUpload": "Instant Upload",
     "parsing": "parsing",
     "DomainUpdateSuccess": "Domain Update Success",
-    "DomainDeleteSuccess": "Domain Delete Success"
+    "DomainDeleteSuccess": "Domain Delete Success",
+    "CustomApplicationDomain": "Custom Application Domain"
   },
   "TriggerPanel": {
     "AddTrigger": "Add Trigger",
@@ -447,7 +460,7 @@
   "PleaseCloseApplicationFirst": "Please close your application first.",
   "custom": "Custom",
   "CostTime": "CostTime",
-  "Duration": "Duration",
+  "Duration": "Trade Time",
   "State": "State",
   "TotalAmount": "Total",
   "AIWelcomeMessage": "Hello, I am Laf AI Development Assistant, how can I help you?",
@@ -529,7 +542,29 @@
     "EditPasswordSuccess": "Edit Password Success",
     "EditPhoneSuccess": "Edit Phone Success",
     "EditAvatarSuccess": "Edit Avatar Success",
-    "Change": "Change"
+    "Change": "Change",
+    "InviteLink": "Invite Link",
+    "BonusDetails": "Bonus Details",
+    "Bonus": "Bonus",
+    "Channel": "Username",
+    "Time": "Time",
+    "InviteTips": "Copy the referral link and send it to others. When they click on this link to register, they will become your invited users, and you will immediately receive bonus."
   },
-  "Reset": "Reset"
-}
+  "Reset": "Reset",
+  "SettingModal": {
+    "Exchange": "Exange"
+  },
+  "MyIncomeandExpenses": "My Income and Expenses",
+  "Expenses": "Expenses",
+  "OrderNumber": "Order Number",
+  "Bonus amount": "Bonus amount",
+  "Total payment amount": "Total payment amount",
+  "Day": "Day",
+  "Week": "Week",
+  "Month": "Month",
+  "Year": "Year",
+  "Hour": "Hour",
+  "Core": "Core",
+  "No History": "No History",
+  "MyIncomeAndExpenses": "My Income And Expenses"
+}
diff --git a/web/public/locales/zh-CN/translation.json b/web/public/locales/zh-CN/translation.json
@@ -189,7 +189,19 @@
     "UserName": "用户名",
     "Email": "邮箱",
     "PassWord": "密码",
-    "UserInvite": "我的推广"
+    "UserInvite": "我的推广",
+    "UserCenter": "用户中心",
+    "CostOverview": "成本总览",
+    "CardRedemption": "点卡兑换",
+    "BillingDetails": "账单明细",
+    "RechargeHistory": "充值记录",
+    "PricingStandards": "计价标准",
+    "EnterGiftCode": "输入卡密",
+    "ExchangeSuccess": "兑换成功",
+    "Domain": "域名设置",
+    "MyAccount": "我的账户",
+    "CostTrend": "成本趋势",
+    "Balance": "余额"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -244,7 +256,8 @@
     "InstantUpload": "立即上传",
     "RemoveHost": "取消静态托管",
     "DomainUpdateSuccess": "域名修改成功",
-    "DomainDeleteSuccess": "域名删除成功"
+    "DomainDeleteSuccess": "域名删除成功",
+    "CustomApplicationDomain": "自定义应用域名"
   },
   "TriggerPanel": {
     "AddTrigger": "新建触发器",
@@ -490,7 +503,7 @@
   "PleaseCloseApplicationFirst": "请先关闭应用",
   "custom": "自定义",
   "CostTime": "扣费时间",
-  "Duration": "计费周期",
+  "Duration": "交易时间",
   "State": "状态",
   "TotalAmount": "总费用",
   "AIWelcomeMessage": "你好，我是 Laf AI 开发助理，请问有什么可以帮助您的吗？",
@@ -529,7 +542,29 @@
     "EditPasswordSuccess": "密码修改成功",
     "EditPhoneSuccess": "电话号修改成功",
     "EditAvatarSuccess": "头像更新成功",
-    "Change": "更改"
+    "Change": "更改",
+    "InviteLink": "推广链接",
+    "BonusDetails": "奖励明细",
+    "Bonus": "奖励",
+    "Channel": "用户名",
+    "Time": "时间",
+    "InviteTips": "复制推广链接，发送给其他人。当他们点击此链接注册后，将成为你的被邀请人，并且你可立刻获得佣金。"
   },
-  "Reset": "重置"
-}
+  "Reset": "重置",
+  "SettingModal": {
+    "Exchange": "兑换"
+  },
+  "MyIncomeandExpenses": "我的收支",
+  "Expenses": "支出",
+  "OrderNumber": "订单号",
+  "Bonus amount": "赠送金额",
+  "Total payment amount": "实付金额",
+  "Day": "天",
+  "Week": "周",
+  "Month": "月",
+  "Year": "年",
+  "Hour": "小时",
+  "Core": "核",
+  "No History": "暂无记录",
+  "MyIncomeAndExpenses": "我的收支"
+}
diff --git a/web/public/locales/zh/translation.json b/web/public/locales/zh/translation.json
@@ -189,7 +189,19 @@
     "UserName": "用户名",
     "Email": "邮箱",
     "PassWord": "密码",
-    "UserInvite": "我的推广"
+    "UserInvite": "我的推广",
+    "UserCenter": "用户中心",
+    "CostOverview": "成本总览",
+    "CardRedemption": "点卡兑换",
+    "BillingDetails": "账单明细",
+    "RechargeHistory": "充值记录",
+    "PricingStandards": "计价标准",
+    "EnterGiftCode": "输入卡密",
+    "ExchangeSuccess": "兑换成功",
+    "Domain": "域名设置",
+    "MyAccount": "我的账户",
+    "CostTrend": "成本趋势",
+    "Balance": "余额"
   },
   "StoragePanel": {
     "All": "总容量",
@@ -244,7 +256,8 @@
     "InstantUpload": "立即上传",
     "RemoveHost": "取消静态托管",
     "DomainUpdateSuccess": "域名修改成功",
-    "DomainDeleteSuccess": "域名删除成功"
+    "DomainDeleteSuccess": "域名删除成功",
+    "CustomApplicationDomain": "自定义应用域名"
   },
   "TriggerPanel": {
     "AddTrigger": "新建触发器",
@@ -490,7 +503,7 @@
   "PleaseCloseApplicationFirst": "请先关闭应用",
   "custom": "自定义",
   "CostTime": "扣费时间",
-  "Duration": "计费周期",
+  "Duration": "交易时间",
   "State": "状态",
   "TotalAmount": "总费用",
   "AIWelcomeMessage": "你好，我是 Laf AI 开发助理，请问有什么可以帮助您的吗？",
@@ -529,7 +542,29 @@
     "EditPasswordSuccess": "密码修改成功",
     "EditPhoneSuccess": "电话号修改成功",
     "EditAvatarSuccess": "头像更新成功",
-    "Change": "更改"
+    "Change": "更改",
+    "InviteLink": "推广链接",
+    "BonusDetails": "奖励明细",
+    "Bonus": "奖励",
+    "Channel": "用户名",
+    "Time": "时间",
+    "InviteTips": "复制推广链接，发送给其他人。当他们点击此链接注册后，将成为你的被邀请人，并且你可立刻获得佣金。"
   },
-  "Reset": "重置"
-}
+  "Reset": "重置",
+  "SettingModal": {
+    "Exchange": "兑换"
+  },
+  "MyIncomeandExpenses": "我的收支",
+  "Expenses": "支出",
+  "OrderNumber": "订单号",
+  "Bonus amount": "赠送金额",
+  "Total payment amount": "实付金额",
+  "Day": "天",
+  "Week": "周",
+  "Month": "月",
+  "Year": "年",
+  "Hour": "小时",
+  "Core": "核",
+  "No History": "暂无记录",
+  "MyIncomeAndExpenses": "我的收支"
+}
diff --git a/web/src/App.css b/web/src/App.css
@@ -71,3 +71,8 @@ a {
     background: black;
   }
 }
+
+.rdp-day_selected {
+  background-color: #00A9A6 !important;
+  color: white !important;
+}
diff --git a/web/src/apis/v1/accounts.ts b/web/src/apis/v1/accounts.ts
@@ -30,6 +30,26 @@ export async function AccountControllerFindOne(
   });
 }
 
+/**
+ * Get charge order total amount
+ */
+export async function AccountControllerGetChargeOrderAmount(
+  params: Paths.AccountControllerGetChargeOrderAmount.BodyParameters,
+): Promise<{
+  error: string;
+  data: Definitions.Number;
+}> {
+  // /v1/accounts/charge-order/amount
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/accounts/charge-order/amount`, {
+    method: "GET",
+    params: params,
+  });
+}
+
 /**
  * Get charge order
  */
@@ -50,6 +70,26 @@ export async function AccountControllerGetChargeOrder(
   });
 }
 
+/**
+ * get all charge order
+ */
+export async function AccountControllerChargeRecord(
+  params: Paths.AccountControllerChargeRecord.BodyParameters,
+): Promise<{
+  error: string;
+  data: Paths.AccountControllerChargeRecord.Responses;
+}> {
+  // /v1/accounts/charge-orders
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/accounts/charge-orders`, {
+    method: "GET",
+    params: params,
+  });
+}
+
 /**
  * Create charge order
  */
@@ -107,3 +147,61 @@ export async function AccountControllerWechatNotify(
     data: params,
   });
 }
+
+/**
+ * Use a gift code
+ */
+export async function AccountControllerGiftCode(params: Definitions.UseGiftCodeDto): Promise<{
+  error: string;
+  data: Definitions.Account;
+}> {
+  // /v1/accounts/gift-code
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/accounts/gift-code`, {
+    method: "POST",
+    data: params,
+  });
+}
+
+/**
+ * get a invite code
+ */
+export async function AccountControllerInviteCode(
+  params: Paths.AccountControllerInviteCode.BodyParameters,
+): Promise<{
+  error: string;
+  data: Definitions.InviteCode;
+}> {
+  // /v1/accounts/invite-code
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/accounts/invite-code`, {
+    method: "GET",
+    params: params,
+  });
+}
+
+/**
+ * get invite code profit
+ */
+export async function AccountControllerInviteCodeProfit(
+  params: Paths.AccountControllerInviteCodeProfit.BodyParameters,
+): Promise<{
+  error: string;
+  data: Paths.AccountControllerInviteCodeProfit.Responses;
+}> {
+  // /v1/accounts/invite-profit
+  let _params: { [key: string]: any } = {
+    appid: useGlobalStore.getState().currentApp?.appid || "",
+    ...params,
+  };
+  return request(`/v1/accounts/invite-profit`, {
+    method: "GET",
+    params: params,
+  });
+}