feat: 添加用户中心仪表盘模板(hgcloud_home) + drone部署步骤

- 解压 default_iSM72.tar.gz 到 hgcloud_home 目录
- drone新增步骤: 同步 hgcloud_home 到 /public/home/template/pc/

.drone.yml

@@ -23,6 +23,9 @@ steps:
       # 将会员中心全局主题 hgcloud 同步到运行目录
       - cp -rf /www/wwwroot/hgdemo.hgidc.cn/public/web/BlackFruit-web/clientarea/hgcloud /www/wwwroot/hgdemo.hgidc.cn/public/clientarea/template/pc/
 
+      # 将用户中心仪表盘主题 hgcloud_home 同步到运行目录
+      - cp -rf /www/wwwroot/hgdemo.hgidc.cn/public/web/BlackFruit-web/clientarea/home/hgcloud_home /www/wwwroot/hgdemo.hgidc.cn/public/home/template/pc/
+
   - name: Restart Nginx
     commands:
       - nginx -s reload

clientarea/home/hgcloud_home/api/finance.js

@@ -0,0 +1,163 @@
+// 	订单列表
+function orderList(params) {
+  return Axios.get("/order", {params});
+}
+
+// 交易记录列表
+function transactionList(params) {
+  return Axios.get(`/transaction`, {params});
+}
+
+// 订单详情
+function orderDetails(id) {
+  return Axios.get(`/order/${id}`);
+}
+
+// 余额记录列表
+function creditList(params) {
+  return Axios.get(`/credit`, {params});
+}
+// 公共配置
+function common() {
+  return Axios.get(`/common`);
+}
+
+// 账户详情
+function account() {
+  return Axios.get(`/account`);
+}
+
+// 提现申请
+function withdraw(params) {
+  return Axios.post(`/withdraw`, params);
+}
+
+// 提现规则详情
+function withdrawRule(params) {
+  return Axios.get(`/withdraw/rule/credit`, {params});
+}
+
+// 充值
+function recharge(params) {
+  return Axios.post(`/recharge`, params);
+}
+
+// 支付方式
+function gatewayList() {
+  return Axios.get(`/gateway`);
+}
+
+// 支付
+function pay(params) {
+  return Axios.post(`/pay`, params);
+}
+
+// 支付状态
+function getPayStatus(id) {
+  return Axios.get(`/pay/${id}/status`);
+}
+
+// 获取待审核金额
+function unAmount() {
+  return Axios.get(`/refund/pending/amount`);
+}
+
+// 使用/取消余额
+function creditPay(params) {
+  return Axios.post(`/credit`, params);
+}
+// 删除订单
+function delete_order(id) {
+  return Axios.delete(`/order/${id}`);
+}
+
+// // 使用余额支付
+// function onlinePay(params) {
+//   return Axios.post(`/pay`, params);
+// }
+
+// 代金券
+// 可领代金券列表
+function voucherAvailable({params}) {
+  return Axios.get(`/voucher`, {params});
+}
+
+function voucherMine(params) {
+  return Axios.get(`/voucher/mine`, {params});
+}
+
+function voucherGet(params) {
+  return Axios.post(`/voucher/${params.id}/get`, params);
+}
+
+function combineOrder(params) {
+  return Axios.post(`/order/combine`, params);
+}
+
+/* 申请合同列表 */
+function contractOrder(params) {
+  return Axios.get(`/e_contract/order`, {params});
+}
+/* 合同管理列表 */
+function contractList(params) {
+  return Axios.get(`/e_contract`, {params});
+}
+
+/* 保存甲方信息 */
+function editPartInfo(params) {
+  return Axios.put(`/e_contract/first_part_info`, params);
+}
+/* 获取甲方信息 */
+function getPartInfo() {
+  return Axios.get(`/e_contract/first_part_info`);
+}
+
+// 下载PDF
+function downloadContract(id) {
+  return Axios.post(`/e_contract/${id}/download`);
+}
+
+// 预览PDF
+function viewContract(id) {
+  return Axios.get(`/e_contract/${id}/preview`);
+}
+
+//取消合同
+function cancelContrat(id) {
+  return Axios.post(`/e_contract/${id}/cancel`);
+}
+
+//邮递纸质合同
+function mailContract(params) {
+  return Axios.post(`/e_contract/${params.id}/mail`, params);
+}
+
+// 获取实名认证信息
+function certificationInfo() {
+  return Axios.get(`/certification/info`);
+}
+
+// 出账列表
+function creditLimtList(params) {
+  return Axios.get(`/credit_limit/account`, {params});
+}
+
+// 授信详情
+function creditDetail() {
+  return Axios.get(`/credit_limit`);
+}
+
+//出账周期订单列表
+function creditOrderList(params) {
+  return Axios.get(`/credit_limit/account/${params.id}/order`, {params});
+}
+
+// 信用额提前还款
+function prePayment() {
+  return Axios.post(`/credit_limit/prepayment`);
+}
+
+// 冻结记录
+function apiFreezeList(params) {
+  return Axios.get(`/account/credit/freeze`, {params});
+}

clientarea/home/hgcloud_home/api/home.js

@@ -0,0 +1,58 @@
+// 会员中心首页
+function indexData() {
+  return Axios.get(`/index`);
+}
+
+//会员中心首页产品列表
+function indexHost(params) {
+  return Axios.get(`/index/host`, {params});
+}
+// 获取实名认证信息
+function certificationInfo() {
+  return Axios.get(`/certification/info`);
+}
+//工单列表
+function ticket_list(params) {
+  return Axios.get(`/ticket`, {params});
+}
+//会员中心首页新闻列表
+function newsList(params) {
+  return Axios.get(`/news/index`, {params});
+}
+// 推广者统计信息
+function promoter_statistic() {
+  return Axios.get(`/referral/promoter/statistic`);
+}
+
+// 开启推介计划
+function openRecommend() {
+  return Axios.post(`recommend/promoter`);
+}
+// 推广者基础信息
+function promoterInfo() {
+  return Axios.get(`/recommend/promoter`);
+}
+
+// 获取微信公众号用户关联信息
+function getWxInfo() {
+  return Axios.get(`/mp_weixin_notice/client`);
+}
+// 获取二维码
+function getWxQrcode() {
+  return Axios.get(`/mp_weixin_notice/qrcode`);
+}
+
+// 授信详情
+function creditDetail() {
+  return Axios.get(`/credit_limit`);
+}
+
+// 用户可用平台币详情
+function apiCoinDetail() {
+  return Axios.get(`/coin/client/coupon`);
+}
+
+// 平台币充值页面详情
+function apiCoinRecharge(params) {
+  return Axios.get(`/coin/recharge`, {params});
+}

clientarea/home/hgcloud_home/css/home.css

@@ -0,0 +1,907 @@
+.el-main {
+  padding: 0 !important;
+}
+.main-content {
+  display: flex;
+  column-gap: 0.24rem;
+  background: #f6f6fa;
+}
+.left-box {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  row-gap: 0.24rem;
+}
+.info-box {
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  box-sizing: border-box;
+  padding: 0.25rem;
+  background-color: #fff;
+  border-radius: 0.04rem;
+}
+.info-first {
+  height: 0.6rem;
+  display: flex;
+  cursor: pointer;
+}
+.name-first {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 0.36rem;
+  background: #fff;
+  width: 0.6rem;
+  height: 0.6rem;
+  border-radius: 0.03rem;
+  color: #FFFFFF;
+  font-weight: bold;
+}
+.name-box {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  margin-left: 0.08rem;
+}
+.name {
+  color: #8692B0;
+  font-size: 0.14rem;
+  font-weight: 400;
+}
+.name .id-text {
+  color: #1E2736;
+}
+.hello {
+  font-weight: 400;
+  font-size: 0.16rem;
+  color: #1E2736;
+  max-width: 2.5rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.info-second {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+.info-three {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  row-gap: 0.04rem;
+}
+.info-three .compny-box,
+.info-three .person-box {
+  display: flex;
+  align-items: flex-start;
+  column-gap: 0.32rem;
+  font-size: 0.14rem;
+}
+.info-three .compny-box .left-icon,
+.info-three .person-box .left-icon {
+  display: flex;
+  align-items: center;
+  column-gap: 0.04rem;
+  font-size: 0.14rem;
+  color: #8692B0;
+}
+.info-three .compny-box .left-icon img,
+.info-three .person-box .left-icon img {
+  vertical-align: middle;
+  width: 0.24rem;
+  height: 0.24rem;
+  flex-shrink: 0;
+}
+.info-three .compny-box .right-text .certify-id,
+.info-three .person-box .right-text .certify-id {
+  display: flex;
+  align-items: center;
+}
+.info-three .compny-box .right-text .right-type,
+.info-three .person-box .right-text .right-type {
+  color: #949CB0;
+}
+.info-three .compny-box .right-text .company-name,
+.info-three .person-box .right-text .company-name {
+  color: #1E2736;
+  display: inline-block;
+  max-width: 2.5rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.info-three .compny-box .right-text .certify-bottom,
+.info-three .person-box .right-text .certify-bottom {
+  display: flex;
+  align-items: center;
+}
+.info-three .compny-box .right-text .certify-bottom .cpoy-btn,
+.info-three .person-box .right-text .certify-bottom .cpoy-btn {
+  cursor: pointer;
+  margin-left: 0.04rem;
+  width: 0.14rem;
+  height: 0.14rem;
+}
+.info-three .compny-box .right-text .bule-text,
+.info-three .person-box .right-text .bule-text {
+  cursor: pointer;
+  color: var(--color-primary);
+}
+.info-three .compny-box .right-text .certify-text,
+.info-three .person-box .right-text .certify-text {
+  color: #292E36;
+  display: inline-block;
+  max-width: 1.6rem;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.email-box,
+.phone-box {
+  color: #8692B0;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 0.14rem;
+}
+.email-box .phone-number,
+.phone-box .phone-number {
+  margin-left: 0.25rem;
+  color: #1E2736;
+}
+.info-second > div img {
+  margin-right: 0.05rem;
+  vertical-align: middle;
+  width: 0.16rem;
+}
+.statistics-content {
+  display: flex;
+  flex-wrap: wrap;
+  min-height: 2.4rem;
+}
+.money-box {
+  box-sizing: border-box;
+  flex: 1;
+  padding: 0.24rem;
+  border-radius: 0.04rem;
+  background-color: #fff;
+}
+.money-top {
+  display: flex;
+  justify-content: space-between;
+  column-gap: 0.26rem;
+}
+.money-top .money-credit {
+  position: relative;
+  flex: 1;
+  flex-shrink: 0;
+  border-radius: 0.04rem;
+  background: #F6F6FA;
+  padding: 0.16rem;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+.money-top .money-credit .credit-btn {
+  position: absolute;
+  right: 0;
+  top: 0;
+  cursor: pointer;
+  background-color: var(--color-primary);
+  font-size: 0.14rem;
+  color: #fff;
+  padding: 0.05rem 0.23rem;
+  border-radius: 0.04rem;
+  border-radius: 0 0.04rem 0 0.08rem;
+}
+.money-top .money-credit .credit-title {
+  color: #646464;
+  font-size: 0.14rem;
+  display: flex;
+  align-items: center;
+  column-gap: 0.08rem;
+}
+.money-top .money-credit .credit-title.coin-title {
+  justify-content: space-between;
+}
+.money-top .money-credit .credit-title .credit-detail {
+  color: var(--color-primary);
+  font-size: 0.14rem;
+  cursor: pointer;
+}
+.money-top .money-credit .credit-title .create-notice {
+  display: flex;
+  align-items: center;
+}
+.money-top .money-credit .credit-title .create-notice .notice-status {
+  width: 0.06rem;
+  height: 0.06rem;
+  border-radius: 50%;
+  background-color: #A2A2A2;
+}
+.money-top .money-credit .credit-title .create-notice .notice-status.active {
+  background-color: var(--color-success);
+}
+.money-top .money-credit .credit-title .create-notice .notice-btn {
+  color: var(--color-primary);
+  font-size: 0.12rem;
+  cursor: pointer;
+}
+.money-top .money-credit .credit-money {
+  margin-top: 0.16rem;
+  display: flex;
+  align-items: center;
+  column-gap: 0.1rem;
+}
+.money-top .money-credit .credit-money .credit-num {
+  color: #2B2B2B;
+  font-size: 0.32rem;
+  font-weight: 500;
+  flex-shrink: 0;
+}
+.money-top .money-credit .credit-money .credit-num .s-24 {
+  margin-right: 0.08rem;
+  font-size: 0.24rem;
+}
+.money-top .money-credit .credit-money .recharge-btn {
+  cursor: pointer;
+  padding: 0 0.1rem;
+  line-height: 0.24rem;
+  color: #ffffff;
+  font-size: 0.12rem;
+  border-radius: 0.04rem;
+  background: var(--color-primary);
+}
+.money-top .money-credit .credit-money .recharge-text {
+  font-weight: 400;
+  cursor: pointer;
+  color: var(--color-primary);
+  font-size: 0.14rem;
+  margin-left: 0.16rem;
+}
+.money-order {
+  margin-top: 0.32rem;
+  border-top: 1px solid #EEEEEE;
+  padding-top: 0.24rem;
+  display: flex;
+  align-items: center;
+}
+.money-order .money-order-divider {
+  width: 1px;
+  height: 0.2rem;
+  border-radius: 1px;
+  background: #EBEBF4;
+  margin: 0 0.2rem;
+}
+.money-order .money-order-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex: 1;
+  flex-shrink: 0;
+}
+.money-order .money-order-item .money-order-title {
+  display: flex;
+  align-items: center;
+  font-size: 0.14rem;
+  color: #333333;
+}
+.money-order .money-order-item .money-order-title .credit-tag {
+  margin-left: 0.08rem;
+  color: #333333;
+  font-size: 0.12rem;
+  box-sizing: border-box;
+  padding: 0.02rem 0.04rem;
+  border: 1px solid #E6E7EB;
+  border-radius: 2px;
+  background: #FFFFFF;
+}
+.money-order .money-order-item .money-order-value {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+  font-weight: bold;
+}
+.money-order .money-order-item .money-order-value .s-12 {
+  margin-right: 0.06rem;
+  font-size: 0.12rem;
+}
+.voucher-box {
+  color: #646464;
+  font-size: 0.12rem;
+}
+.voucher-box .bule-text {
+  color: var(--color-primary);
+  margin-left: 0.03rem;
+  cursor: pointer;
+}
+.statistics-bottom {
+  margin-top: -0.16rem;
+  display: flex;
+  padding: 0.26rem 5.32rem 0.26rem 0.24rem;
+  border-radius: 0.04rem;
+  background: url("../img/index_bg.png") no-repeat;
+  background-size: auto 100%;
+  background-position: right center;
+  background-color: #fff;
+}
+.statistics-bottom .statistics-item {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  column-gap: 0.08rem;
+}
+.statistics-bottom .statistics-item .statistics-item-name {
+  color: #A2A2A2;
+  font-size: 0.14rem;
+}
+.statistics-bottom .statistics-item .statistics-item-name .green-text {
+  color: var(--color-success);
+}
+.statistics-bottom .statistics-item .statistics-item-name .red-text {
+  color: var(--color-danger);
+}
+.statistics-bottom .statistics-item .statistics-item-value {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+  font-weight: bold;
+}
+.statistics-bottom .statistics-item .statistics-item-value .s-12 {
+  margin-right: 0.06rem;
+  font-size: 0.12rem;
+}
+.statistics-bottom .statistics-item-divider {
+  width: 1px;
+  height: 0.2rem;
+  border-radius: 1px;
+  background: #EBEBF4;
+  margin: 0 0.2rem;
+}
+.order-box {
+  margin-left: 0.08rem;
+  width: 5rem;
+  display: flex;
+  column-gap: 0.08rem;
+}
+.order-box .order-item {
+  height: 100%;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+  border-radius: 0.03rem;
+  cursor: pointer;
+}
+.order-box .order-title {
+  color: #FFFFFF;
+  font-size: 0.13rem;
+  font-weight: 500;
+}
+.order-box .order-nums {
+  margin-bottom: 0.33rem;
+  font-size: 0.32rem;
+  font-weight: bold;
+  color: #FFFFFF;
+}
+.order-box .order-type-img {
+  margin-top: 0.36rem;
+}
+.order-box .order-type-img img {
+  width: 0.68rem;
+  height: 0.68rem;
+}
+.order-box .order-box-1 {
+  background: #7239EA;
+}
+.order-box .order-box-2 {
+  background: #3699FF;
+}
+.order-box .order-box-3 {
+  background: #3DD598;
+}
+.product-list-box {
+  flex: 1;
+  background-color: #fff;
+  border-radius: 0.04rem;
+  padding: 0.24rem;
+}
+.product-list-box .title-text {
+  font-size: 0.14rem;
+  color: #2B2B2B;
+  margin-bottom: 0.24rem;
+}
+.product-list-box .product-name {
+  color: var(--color-primary);
+  font-size: 0.14rem;
+  cursor: pointer;
+}
+.product-list-box .red-time {
+  color: var(--color-danger);
+}
+.right-box {
+  flex-shrink: 0;
+  box-sizing: border-box;
+  padding: 0.24rem;
+  width: 4.5rem;
+  border-radius: 0.04rem;
+  background-color: #fff;
+}
+.recommend-box {
+  width: 3.65rem;
+  text-align: center;
+  margin: 0 auto;
+  margin-top: 0.21rem;
+}
+.recommend-box h2 {
+  text-align: center;
+  color: #1E2736;
+  font-size: 0.24rem;
+}
+.recommend-box p {
+  margin-top: 0.26rem;
+  text-align: center;
+  color: #8692B0;
+  font-size: 0.14rem;
+}
+.recommend-box img {
+  width: 3.65rem;
+  height: 2.56rem;
+}
+.recommend-people {
+  margin-top: 0.3rem;
+  border-top: 1px solid #E6E7EB;
+  padding-top: 0.3rem;
+  text-align: left;
+}
+.recommend-people-num {
+  display: inline-block;
+  width: 1rem;
+  height: 0.08rem;
+  background: var(--color-warning);
+  border-radius: 0rem 0.2rem 0.2rem 0rem;
+}
+.recommend-money-num {
+  display: inline-block;
+  width: 1.2rem;
+  height: 0.08rem;
+  background: var(--color-success);
+  border-radius: 0rem 0.2rem 0.2rem 0rem;
+}
+.recommend-number {
+  margin-left: 0.16rem;
+  font-weight: bold;
+  font-size: 0.26rem;
+  color: #040E34;
+}
+.recommend-people > div {
+  display: flex;
+  align-items: center;
+}
+.recommend-people > div:nth-of-type(2) {
+  margin-top: 0.47rem;
+}
+.WorkOrder-box {
+  margin-top: 0.24rem;
+}
+.WorkOrder-title {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 0.12rem;
+  font-size: 14px;
+  color: #2B2B2B;
+  font-weight: bold;
+}
+.more {
+  cursor: pointer;
+  display: block;
+  padding: 0 0.03rem;
+  background: #EEF4FF;
+  height: 0.24rem;
+  line-height: 0.24rem;
+  text-align: center;
+  border-radius: 0.03rem;
+  color: #8692B0;
+}
+.WorkOrder-content {
+  padding: 0.3rem 0.3rem 0 0.3rem;
+  border-radius: 0.03rem;
+  border: 1px solid #E6E7EB;
+}
+.WorkOrder-item {
+  display: flex;
+  align-items: center;
+  margin-bottom: 0.3rem;
+}
+.WorkOrder-item:hover {
+  cursor: pointer;
+  background-color: #f5f7fa;
+  transition: background-color 0.25s ease;
+}
+.replay-div {
+  flex-shrink: 0;
+  margin-right: 0.1rem;
+  font-weight: 500;
+  font-size: 0.13rem;
+  padding: 0 0.1rem;
+  height: 0.26rem;
+  line-height: 0.26rem;
+  text-align: center;
+  background: rgba(54, 155, 255, 0.205);
+  color: #FFF;
+  border-radius: 0.03rem;
+}
+.replay-red {
+  color: var(--color-danger);
+  background: rgba(240, 20, 46, 0.205);
+}
+.replay-green {
+  background: rgba(61, 213, 152, 0.205);
+  color: var(--color-success);
+}
+.replay-box {
+  width: 80%;
+}
+.replay-title {
+  font-size: 0.14rem;
+  color: #1E2736;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.replay-name {
+  font-size: 0.13rem;
+  font-weight: 500;
+  color: #8692B0;
+}
+.notice-box {
+  margin-top: 0.24rem;
+}
+.notice-item {
+  display: flex;
+  cursor: pointer;
+  justify-content: space-between;
+  align-items: center;
+  padding-left: 0.16rem;
+}
+.notice-item:hover {
+  background-color: #f5f7fa;
+  transition: background-color 0.25s ease;
+}
+.notice-item:nth-of-type(1) {
+  border-left: 0.02rem solid var(--color-success);
+  margin-bottom: 0.4rem;
+}
+.notice-item:nth-of-type(2) {
+  border-left: 0.02rem solid var(--color-primary);
+  margin-bottom: 0.4rem;
+}
+.notice-item:nth-of-type(3) {
+  border-left: 0.02rem solid var(--color-warning);
+  margin-bottom: 0.3rem;
+}
+.notice-time {
+  font-size: 0.2rem;
+  color: #1E2736;
+}
+.notice-title {
+  font-weight: 400;
+  font-size: 0.14rem;
+  color: #1E2736;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.notice-type {
+  font-size: 0.13rem;
+  font-weight: 500;
+  color: #8692B0;
+}
+.notice-item-right {
+  color: #8692B0;
+  width: 0.24rem;
+  height: 0.24rem;
+  text-align: center;
+  line-height: 0.24rem;
+  background: #EEF4FF;
+  border-radius: 0.03rem;
+}
+.no-product {
+  text-align: center;
+  margin-top: 1.06rem;
+  padding-bottom: 1.72rem;
+  background-color: #fff;
+  border-radius: 0.04rem;
+  padding: 0.24rem;
+}
+.no-product h2 {
+  font-weight: 400;
+  color: #171725;
+  font-size: 0.28rem;
+}
+.no-product p {
+  margin: 0.1rem 0 0.2rem 0;
+  color: #8692B0;
+  font-size: 0.14rem;
+}
+.no-recommend {
+  margin: 0 auto;
+  margin-top: 0.24rem;
+  color: #FFF;
+  font-size: 0.14rem;
+  background: var(--color-primary);
+  height: 0.32rem;
+  line-height: 0.32rem;
+  width: 1.52rem;
+  border-radius: 0.03rem;
+  cursor: pointer;
+}
+.recommend-text {
+  margin: 0 auto;
+  margin-top: 0.24rem;
+  color: #8692B0;
+  font-size: 0.14rem;
+  background: #EEF4FF;
+  height: 0.32rem;
+  line-height: 0.32rem;
+  border-radius: 0.03rem;
+}
+.info-box .divider-box {
+  height: 100%;
+  background-color: #E6E7EB !important;
+}
+.dialog-form {
+  display: flex;
+  flex-direction: column;
+}
+.cz-input {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.cz-input > .btn-ok {
+  margin-left: 0.1rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 3px;
+  color: rgba(255, 255, 255, 0.9);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.pay-html {
+  display: flex;
+  justify-content: center;
+}
+.pay-html > img {
+  width: 2.5rem;
+  height: 2.5rem;
+}
+.ty-select {
+  width: 100%;
+}
+.recommend-box-open .recommend-top {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.recommend-box-open .recommend-top .left {
+  display: flex;
+  flex-direction: column;
+}
+.recommend-box-open .recommend-top .left .row1 {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.recommend-box-open .recommend-top .left .row1 .title-text {
+  font-size: 18px;
+  font-weight: bold;
+  color: #171725;
+  margin-right: 0.2rem;
+  margin-bottom: 0;
+}
+.recommend-box-open .recommend-top .left .row1 .reword {
+  background: linear-gradient(180deg, #F74C4B 0%, #EF7575 100%);
+  border-radius: 3px;
+  color: #FFF;
+  position: relative;
+  padding: 1px 6px 1px 20px;
+  font-size: 13px;
+  cursor: pointer;
+}
+.recommend-box-open .recommend-top .left .row1 .reword img {
+  width: 36px;
+  height: 35px;
+  position: absolute;
+  left: -18px;
+  top: -4px;
+}
+.recommend-box-open .recommend-top .left .row2 {
+  font-size: 14px;
+  font-weight: bold;
+  color: #2B2B2B;
+  margin-top: 0.3rem;
+  margin-bottom: 0.13rem;
+}
+.recommend-box-open .recommend-top .left .row3,
+.recommend-box-open .recommend-top .left .row4 {
+  font-size: 14px;
+  color: #8692B0;
+}
+.recommend-box-open .recommend-top .right {
+  width: 1.5rem;
+  height: 1.53rem;
+}
+.recommend-box-open .url {
+  width: 100%;
+  height: 0.46rem;
+  border: 1px solid #E6E7EB;
+  border-radius: 3px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 0.26rem;
+}
+.recommend-box-open .url .url-text {
+  width: 100%;
+  font-size: 15px;
+  color: #8692B0;
+  margin-left: 0.16rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.recommend-box-open .url .copy-btn {
+  width: 112px;
+  height: 100%;
+  background: #E1F0FF;
+  border-left: 1px solid #E6E7EB;
+  border-radius: 0px 3px 3px 0px;
+  font-size: 16px;
+  color: var(--color-primary);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.recommend-box-open .top-statistic {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  column-gap: 0.08rem;
+  flex-wrap: wrap;
+  margin-top: 0.24rem;
+}
+.recommend-box-open .top-statistic .top-item {
+  padding: 0.16rem;
+  flex: 1;
+  box-shadow: 0px 1px 4px rgba(21, 34, 50, 0.08);
+  border-radius: 0.04rem;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding-bottom: 0.45rem;
+}
+.recommend-box-open .top-statistic .top-item:nth-of-type(1) {
+  background: url("../img/referral/top1.png") no-repeat;
+  background-size: 100% auto;
+  background-position: bottom;
+}
+.recommend-box-open .top-statistic .top-item:nth-of-type(2) {
+  background: url("../img/referral/top3.png") no-repeat;
+  background-size: 100% auto;
+  background-position: bottom;
+}
+.recommend-box-open .top-statistic .top-item .top-money {
+  font-size: 0.24rem;
+  font-weight: bold;
+  color: #1E2736;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.recommend-box-open .top-statistic .top-item .top-text {
+  font-size: 0.14rem;
+  color: #8692B0;
+}
+.open-dialog {
+  font-size: 16px;
+}
+.open-dialog .dialog-footer {
+  font-size: 0.16rem;
+}
+.open-dialog .dialog-footer .btn-ok {
+  width: 1.12rem;
+  height: 0.46rem;
+  background: var(--color-primary);
+  border-radius: 3px;
+  color: #FFF;
+}
+.open-dialog .dialog-footer .btn-no {
+  width: 1.12rem;
+  height: 0.46rem;
+  background: #E7E7E7;
+  border-radius: 3px;
+  color: #1E2736;
+}
+.wx-code {
+  width: 40px;
+  height: 40px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 50%;
+  z-index: 100;
+  position: fixed;
+  top: 50%;
+  right: 3px;
+  transform: translateY(50%);
+  cursor: pointer;
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+}
+.wx-code .wx-img {
+  width: 40px;
+  height: 40px;
+  background: url('../img/wx.svg') no-repeat;
+  background-size: 100% 100%;
+}
+.wx-code:hover .wx-img {
+  background: url('../img/wx_hover.svg') no-repeat;
+  background-size: 100% 100%;
+}
+.wx-box {
+  text-align: center;
+}
+.wx-box .img {
+  width: 200px;
+  height: 200px;
+  margin: 0 auto;
+}
+.wx-box .img img {
+  width: 100%;
+}
+@media screen and (max-width: 750px) {
+  .main-content {
+    display: block;
+    padding-bottom: 1.5rem;
+  }
+  .el-main {
+    margin-top: 1rem;
+  }
+  .statistics-bottom {
+    padding: 0.26rem 0.24rem;
+    margin-top: 0.24rem;
+  }
+  .recharge-btn {
+    height: 30px;
+    line-height: 30px;
+  }
+  .progress-box .el-progress-circle {
+    display: flex;
+  }
+  .order-box {
+    width: 100%;
+    margin-left: 0;
+    margin-top: 0.2rem;
+  }
+  .order-box .order-item {
+    flex: 1;
+  }
+  .info-box .divider-box {
+    display: none;
+  }
+  .info-three {
+    margin-top: 10px;
+    width: 100%;
+    align-items: flex-end;
+  }
+  .right-box {
+    width: auto;
+    margin-top: 0.2rem;
+  }
+}

clientarea/home/hgcloud_home/home.php

@@ -0,0 +1,390 @@
+<link rel="stylesheet" href="/{$template_catalog_home}/template/{$themes_home}/css/home.css">
+</head>
+
+<body>
+  <!-- mounted之前显示 -->
+  <div id="mainLoading">
+    <div class="ddr ddr1"></div>
+    <div class="ddr ddr2"></div>
+    <div class="ddr ddr3"></div>
+    <div class="ddr ddr4"></div>
+    <div class="ddr ddr5"></div>
+  </div>
+  <div class="template">
+    <el-container>
+      <aside-menu></aside-menu>
+      <el-container>
+        <top-menu></top-menu>
+        <el-main class="home-main">
+          <!-- 自己的东西 -->
+          <div class="main-card">
+            <div class="main-content">
+              <div class="left-box">
+                <div class="info-box">
+                  <div class="info-first" @click="goUser" v-loading="nameLoading">
+                    <div class="name-first" ref="headBoxRef">
+                      {{account.firstName}}
+                    </div>
+                    <div class="name-box">
+                      <p class="hello" :title="account.username">
+                        {{lang.index_hello}},{{account.username}}
+                        <span v-if="idcsmart_client_level.id"
+                          :style="{'color':idcsmart_client_level.background_color}">({{idcsmart_client_level.name}})
+                        </span>
+                      </p>
+                      <p class="name">
+                        ID：<span class="id-text">{{account.id}}</span>
+                      </p>
+                    </div>
+                  </div>
+                  <el-divider class="divider-box" direction="vertical"></el-divider>
+                  <div class="info-second" v-loading="nameLoading">
+                    <div class="email-box">
+                      <span><img src="/{$template_catalog_home}/template/{$themes}/img/email-icon.png"
+                          alt="">{{lang.index_email}}</span>
+                      <span class="phone-number">{{account.email ? account.email : '--'}}</span>
+                    </div>
+                    <div class="phone-box">
+                      <span><img src="/{$template_catalog_home}/template/{$themes}/img/tel-icon.png"
+                          alt="">{{lang.index_tel}}</span>
+                      <span class="phone-number">{{account.phone ? account.phone : '--'}}</span>
+                    </div>
+                  </div>
+                  <el-divider class="divider-box" direction="vertical"></el-divider>
+                  <div class="info-three" v-plugin="'IdcsmartCertification'"
+                    v-if="certificationObj.certification_open === 1">
+                    <div class="compny-box">
+                      <div class="left-icon">
+                        <img src="/{$template_catalog_home}/template/{$themes}/img/compny-icon.png" alt="">
+                        <span class="left-type">{{lang.index_compny}}</span>
+                      </div>
+                      <div class="right-text">
+                        <div class="right-title">
+                          <span class="company-name"
+                            v-if="certificationObj.company?.status === 1">{{certificationObj.company.certification_company}}</span>
+                          <span class="company-name bule-text" @click="handelAttestation"
+                            v-else>{{lang.index_goAttestation}}</span>
+                        </div>
+                        <div class="certify-id" v-if="certificationObj.certification_show_certify_id === 1">
+                          <div class="right-type">{{lang.finance_custom23}}：</div>
+                          <div class="company-name certify-bottom" :title="certificationObj.company?.certify_id">
+                            <span
+                              class="certify-text">{{certificationObj.company?.certify_id ? certificationObj.company.certify_id : '--'}}</span>
+                            <img class="cpoy-btn" v-copy="certificationObj.company.certify_id"
+                              v-if="certificationObj.company?.certify_id"
+                              src="/{$template_catalog_home}/template/{$themes}/img/copy.svg" alt="">
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="person-box">
+                      <div class="left-icon">
+                        <img class="left-icon" src="/{$template_catalog_home}/template/{$themes}/img/person-icon.png"
+                          alt="">
+                        <span class="left-type">{{lang.index_name}}</span>
+                      </div>
+                      <div class="right-text">
+                        <div class="right-title">
+                          <span class="company-name" v-if="certificationObj.is_certification"
+                            :title="certificationObj.company.status === 1 ? certificationObj.company.card_name : certificationObj.person.card_name">
+                            {{certificationObj.company.status === 1 ? certificationObj.company.card_name : certificationObj.person.card_name}}
+                          </span>
+                          <span class="company-name bule-text" @click="handelAttestation"
+                            v-else>{{lang.index_goAttestation}}</span>
+                        </div>
+                        <div class="certify-id" v-if="certificationObj.certification_show_certify_id === 1">
+                          <div class="right-type">{{lang.finance_custom24}}：</div>
+                          <div class="company-name certify-bottom" :title="certificationObj.person?.certify_id">
+                            <span
+                              class="certify-text">{{certificationObj.person?.certify_id ? certificationObj.person.certify_id : '--'}}
+                            </span>
+                            <img v-copy="certificationObj.person?.certify_id" v-if="certificationObj.person?.certify_id"
+                              class="cpoy-btn" src="/{$template_catalog_home}/template/{$themes}/img/copy.svg" alt="">
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div class="statistics-box">
+                  <div class="statistics-content" v-loading="nameLoading">
+                    <div class="money-box">
+                      <div class="money-top">
+                        <div class="money-credit">
+                          <div class="credit-btn" @click="showCz" v-if="commonData.recharge_open == 1">
+                            {{lang.index_text2}}
+                          </div>
+                          <div class="credit-title" v-if="commonData.balance_notice_show == 1">
+                            <div class="credit-name">{{lang.index_text3}}</div>
+                            <div class="create-notice">
+                              <div class="notice-status" :class="{'active': account.credit_remind === 1}"></div>
+                              <div class="notice-btn" @click="setAccoutCredit">【{{lang.coin_text66}}】</div>
+                            </div>
+                          </div>
+                          <div class="voucher-box" v-if="voucherList.length > 0">
+                            {{lang.index_text24}}
+                            <a href="/finance.htm?tab=4" target="_blank" class="bule-text">
+                              {{lang.index_text25}}
+                            </a>
+                          </div>
+                          <div class="credit-money">
+                            <div class="credit-num">
+                              <span class="s-24">{{commonData.currency_prefix}}</span>{{account.credit}}
+                              <span v-if="commonData.recharge_open == 1 && coinRecharge.length > 0"
+                                class="recharge-text" @click="showCz">{{lang.index_text35}}</span>
+                            </div>
+                          </div>
+                        </div>
+                        <div class="money-credit" v-plugin="'Coin'" v-if="coinData.name">
+                          <div class="credit-title coin-title">
+                            <div class="credit-name" style="display: flex; align-items: center;">
+                              {{coinData.name}}
+                              <el-tooltip effect="dark" placement="top" v-if="coinData.coin_description_open == 1">
+                                <div slot="content" v-html="coinData.coin_description"></div>
+                                <svg t="1745803081479" viewBox="0 0 1024 1024" version="1.1"
+                                  xmlns="http://www.w3.org/2000/svg" p-id="14138" width="16" height="16"
+                                  xmlns:xlink="http://www.w3.org/1999/xlink">
+                                  <path
+                                    d="M512 97.52381c228.912762 0 414.47619 185.563429 414.47619 414.47619s-185.563429 414.47619-414.47619 414.47619S97.52381 740.912762 97.52381 512 283.087238 97.52381 512 97.52381z m0 73.142857C323.486476 170.666667 170.666667 323.486476 170.666667 512s152.81981 341.333333 341.333333 341.333333 341.333333-152.81981 341.333333-341.333333S700.513524 170.666667 512 170.666667z m45.32419 487.619047v73.142857h-68.510476l-0.024381-73.142857h68.534857z m-4.047238-362.008381c44.251429 8.923429 96.889905 51.126857 96.889905 112.518096 0 61.415619-50.151619 84.650667-68.120381 96.134095-17.993143 11.50781-24.722286 24.771048-24.722286 38.863238V609.52381h-68.534857v-90.672762c0-21.504 6.89981-36.571429 26.087619-49.883429l4.315429-2.852571 38.497524-25.6c24.551619-16.530286 24.210286-49.712762 9.020952-64.365715a68.998095 68.998095 0 0 0-60.391619-15.481904c-42.715429 8.387048-47.640381 38.521905-47.932952 67.779047v16.554667H390.095238c0-56.953905 6.534095-82.773333 36.912762-115.395048 34.03581-36.449524 81.993143-42.300952 126.268952-33.328762z"
+                                    p-id="14139" fill="currentColor"></path>
+                                </svg>
+                              </el-tooltip>
+                            </div>
+                            <a href="/finance.htm?tab=7" target="_blank" class="credit-detail">
+                              {{lang.index_text34}}
+                            </a>
+                          </div>
+                          <div class="credit-money">
+                            <div class="credit-num">
+                              <span class="s-24">{{commonData.currency_prefix}}</span>{{coinData.leave_amount}}
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <template v-if="isShowCredit && creditData.status">
+                        <div class="money-order">
+                          <div class="money-order-item">
+                            <span
+                              class="money-order-title">{{lang.finance_text42}}({{commonData.currency_suffix}})</span>
+                            <span class="money-order-value"><span
+                                class="s-12">{{commonData.currency_prefix}}</span>{{creditData.account?.status === 'Repaid' ? '0.00' : creditData.account?.amount}}</span>
+                          </div>
+                          <div class="money-order-divider"></div>
+                          <div class="money-order-item">
+                            <div class="money-order-title">
+                              {{lang.finance_text38}}
+                              <div class="credit-tag" v-if="creditData.status === 'Expired'">{{lang.finance_text93}}
+                              </div>
+                              <div class="credit-tag" v-if="creditData.status === 'Overdue'">{{lang.finance_text94}}
+                              </div>
+                              <div class="credit-tag" v-if="creditData.status === 'Active'">{{lang.finance_text95}}
+                              </div>
+                              <div class="credit-tag" v-if="creditData.status === 'Suspended'">{{lang.finance_text96}}
+                              </div>
+                            </div>
+                            <div class="money-order-value">
+                              <span class="s-12">{{commonData.currency_prefix}}</span>{{creditData.remaining_amount}}
+                            </div>
+                          </div>
+                        </div>
+                      </template>
+
+                    </div>
+                    <div class="order-box">
+                      <div class="order-item order-box-1" @click="goProductList('using')">
+                        <div class="order-type-img">
+                          <img src="/{$template_catalog_home}/template/{$themes}/img/activation-icon.png" alt="">
+                        </div>
+                        <h3 class="order-title">{{lang.index_text6}}</h3>
+                        <div class="order-nums">{{account.host_active_num}}</div>
+                      </div>
+                      <div class="order-item order-box-2" @click="goProductList()">
+                        <div class="order-type-img">
+                          <img src="/{$template_catalog_home}/template/{$themes}/img/prduct-icon.png" alt="">
+                        </div>
+                        <h3 class="order-title">{{lang.index_text7}}</h3>
+                        <div class="order-nums">{{account.host_num}}</div>
+                      </div>
+                      <div class="order-item order-box-3" @click="goOrderList('Unpaid')">
+                        <div class="order-type-img">
+                          <img src="/{$template_catalog_home}/template/{$themes}/img/no-pay-order.png" alt="">
+                        </div>
+                        <h3 class="order-title">{{lang.index_text8}}</h3>
+                        <div class="order-nums">{{account.unpaid_order}}</div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div class="statistics-bottom">
+                  <div class="statistics-item">
+                    <div class="statistics-item-name">
+                      <span>{{lang.index_text4}}({{commonData.currency_suffix}})</span>
+                      <span
+                        :class="Number(account.this_month_consume_percent) >= 0 ? 'green-text' : 'red-text'"><span></span>{{Number(account.this_month_consume_percent)}}%</span>
+                    </div>
+                    <div class="statistics-item-value">
+                      <span class="s-12">{{commonData.currency_prefix}}</span>{{account.this_month_consume}}
+                    </div>
+                  </div>
+
+                  <div class="statistics-item-divider"></div>
+
+                  <div class="statistics-item">
+                    <div class="statistics-item-name">
+                      <span>{{lang.index_text5}}({{commonData.currency_suffix}})</span>
+                    </div>
+                    <div class="statistics-item-value">
+                      <span class="s-12">{{commonData.currency_prefix}}</span>{{account.consume}}
+                    </div>
+                  </div>
+
+                </div>
+                <div class="product-list-box">
+                  <h3 class="title-text">{{lang.index_text9}}</h3>
+                  <el-table :data="productList" style="width: 100%" v-if="productList.length !== 0"
+                    v-loading="productListLoading">
+                    <el-table-column prop="product_name" :label="lang.index_text10">
+                      <template slot-scope="{row}">
+                        <a :href="`/productdetail.htm?id=${row.id}`" class="product-name"
+                          target="_blank">{{row.product_name}}</a>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="name" :label="lang.index_text12">
+                      <template slot-scope="{row}">
+                        <span>{{row.name}}</span>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="due_time" :label="lang.index_text13">
+                      <template slot-scope="{row}">
+                        <span :class="row.isOverdue ? 'red-time' : ''">{{row.due_time | formateTime}}</span>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="client_notes" :label="lang.invoice_text139" show-overflow-tooltip>
+                      <template slot-scope="{row}">
+                        <span>{{row.client_notes || '--'}}</span>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                  <div v-if="productList.length === 0 && !productListLoading" class="no-product">
+                    <h2>{{lang.index_text14}}</h2>
+                    <p>{{lang.index_text15}}</p>
+                    <el-button @click="goGoodsList" type="primary">{{lang.index_text16}}</el-button>
+                  </div>
+                </div>
+              </div>
+              <div class="right-box">
+                <!-- 推介计划开始 -->
+
+                <div class="recommend-box-open" v-if="showRight && isOpen" v-plugin="'IdcsmartRecommend'">
+                  <div class="recommend-top">
+                    <div class="left">
+                      <div class="row1">
+                        <div class="title-text">{{lang.referral_title1}}</div>
+                        <span class="reword" @click="toReferral"><img
+                            src="/{$template_catalog_home}/template/{$themes}/img/reword.png"
+                            alt="">{{lang.referral_text14}}</span>
+                      </div>
+                      <div class="row2">{{lang.referral_title6}}</div>
+                      <div class="row3">{{lang.referral_text15}}</div>
+                      <div class="row4">{{lang.referral_text16}}</div>
+                    </div>
+                    <img class="right" src="/{$template_catalog_home}/template/{$themes}/img/credit-card.png" alt="">
+                  </div>
+                  <div class="url">
+                    <div class="url-text" :title="promoterData.url">{{promoterData.url}}</div>
+                    <div class="copy-btn" @click="copyUrl(promoterData.url)">{{lang.referral_btn2}}</div>
+                  </div>
+                  <div class="top-statistic">
+                    <div class="top-item">
+                      <div class="top-money">{{commonData.currency_prefix}}{{promoterData.withdrawable_amount}}</div>
+                      <div class="top-text">{{lang.referral_title2}}</div>
+                    </div>
+                    <div class="top-item">
+                      <div class="top-money">{{commonData.currency_prefix}}{{promoterData.pending_amount}}
+                      </div>
+                      <div class="top-text">{{lang.referral_title4}}</div>
+                    </div>
+                  </div>
+                </div>
+                <div class="recommend-box" v-if="!showRight || !isOpen">
+                  <img src="/{$template_catalog_home}/template/{$themes}/img/recommend-img.png" alt="">
+                  <div v-if="showRight">
+                    <h2>{{lang.index_text17}}</h2>
+                    <p>{{lang.index_text18}}</p>
+                    <div class="no-recommend" @click="openVisible = true">{{lang.index_text28}}</div>
+                  </div>
+                  <div v-else class="recommend-text">{{lang.index_text21}}</div>
+                </div>
+                <!-- 推介计划结束 -->
+
+                <div class="WorkOrder-box" v-if="ticketList.length !==0 " v-plugin="'IdcsmartTicket'">
+                  <div class="title-text WorkOrder-title">
+                    <div>{{lang.index_text22}}</div>
+                    <div class="more" @click="goWorkPage">···</div>
+                  </div>
+                  <div class="WorkOrder-content">
+                    <div class="WorkOrder-item" v-for="item in ticketList" :key="item.id"
+                      @click="goTickDetail(item.id)">
+                      <div class="replay-div" :style="{'background':`${item.color}`}">{{item.status}}</div>
+                      <div class="replay-box">
+                        <div class="replay-title">#{{item.ticket_num}} - {{item.title}}</div>
+                        <div class="replay-name">{{item.name}}</div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div class="notice-box" v-if="homeNewList.length !==0" v-plugin="'IdcsmartNews'">
+                  <div class="title-text WorkOrder-title">
+                    <div>{{lang.index_text23}}</div>
+                    <div class="more" @click="goNoticePage">···</div>
+                  </div>
+                  <div class="WorkOrder-content">
+                    <div v-for="item in homeNewList" :key="item.id" class="notice-item"
+                      @click="goNoticeDetail(item.id)">
+                      <div class="notice-item-left">
+                        <h3 class="notice-time">{{item.create_time | formareDay}}</h3>
+                        <h4 class="notice-title">{{item.title}}</h4>
+                        <h5 class="notice-type">{{item.type}}</h5>
+                      </div>
+                      <div class="notice-item-right"><i class="el-icon-arrow-right"></i></div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <!-- 确认开启弹窗 -->
+          <el-dialog :title="lang.referral_title8" :visible.sync="openVisible" width="4.8rem"
+            custom-class="open-dialog">
+            <span>{{lang.referral_tips7}}</span>
+            <span slot="footer" class="dialog-footer">
+              <el-button class="btn-ok" type="primary" @click="openReferral">{{lang.referral_btn6}}</el-button>
+              <el-button class="btn-no" @click="openVisible = false">{{lang.referral_btn7}}</el-button>
+            </span>
+          </el-dialog>
+          <pay-dialog ref="payDialog" @payok="paySuccess"></pay-dialog>
+          <credit-notice ref="creditNotice" @success="paySuccess"></credit-notice>
+          <recharge-dialog ref="rechargeDialog" @success="rechargeSuccess"></recharge-dialog>
+          <!-- 微信公众号 -->
+          <div class="wx-code" v-if="hasWxPlugin && conectInfo.is_subscribe === 0">
+            <el-popover width="200" trigger="hover" @show="getWxcode" placement="left">
+              <div class="wx-box">
+                <p class="tit">{{lang.wx_tip1}}</p>
+                <div class="img" v-loading="codeLoading">
+                  <img :src="wxQrcode" alt="" v-if="wxQrcode">
+                </div>
+              </div>
+              <div class="wx-img" slot="reference"></div>
+            </el-popover>
+          </div>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+  <!-- =======页面独有======= -->
+  <script src="/{$template_catalog}/template/{$themes}/components/creditNotice/creditNotice.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
+  <script src="/{$template_catalog}/template/{$themes}/components/rechargeDialog/rechargeDialog.js"></script>
+  <script src="/{$template_catalog_home}/template/{$themes_home}/api/finance.js"></script>
+  <script src="/{$template_catalog_home}/template/{$themes_home}/api/home.js"></script>
+  <script src="/{$template_catalog_home}/template/{$themes_home}/js/home.js"></script>

clientarea/home/hgcloud_home/img/copy.svg

@@ -0,0 +1,14 @@
+<svg width="14.000000" height="14.000000" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+	<desc>
+			Created with Pixso.
+	</desc>
+	<defs>
+		<clipPath id="clip74_885">
+			<rect id="svg" width="14.000000" height="14.000000" fill="white" fill-opacity="0"/>
+		</clipPath>
+	</defs>
+	<g clip-path="url(#clip74_885)">
+		<path id="path" d="M10.4 11.85L2.15 11.85L2.15 3.59L10.4 3.59L10.4 11.85ZM2.87 11.13L9.68 11.13L9.68 4.31L2.87 4.31L2.87 11.13Z" fill="#0058FF" fill-opacity="1.000000" fill-rule="nonzero"/>
+		<path id="path" d="M11.97 10.19L11.24 10.19L11.24 3.01L4.07 3.01L4.07 2.3L11.97 2.3L11.97 10.19Z" fill="#0058FF" fill-opacity="1.000000" fill-rule="nonzero"/>
+	</g>
+</svg>

clientarea/home/hgcloud_home/img/wx.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1744782731023" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1400" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M334.848 334.336a33.792 33.792 0 0 0-36.352 30.72 33.792 33.792 0 0 0 36.352 30.72 28.672 28.672 0 0 0 30.208-30.72 28.672 28.672 0 0 0-30.208-30.72zM581.12 512a24.576 24.576 0 0 0 0 51.2 27.648 27.648 0 0 0 30.208-24.576 27.648 27.648 0 0 0-30.208-26.624zM502.784 395.776a28.672 28.672 0 0 0 30.208-30.72 28.672 28.672 0 0 0-30.208-30.72 33.792 33.792 0 0 0-35.84 30.72 33.792 33.792 0 0 0 35.84 30.72zM713.216 512a24.576 24.576 0 0 0 0 51.2 27.648 27.648 0 0 0 30.208-24.576 27.648 27.648 0 0 0-30.208-26.624z" p-id="1401" fill="#cdcdcd"></path><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0zM412.672 646.656a403.456 403.456 0 0 1-83.968-12.288l-83.968 43.008 24.064-73.728a201.216 201.216 0 0 1-96.256-165.376c0-116.224 108.032-207.872 240.128-207.872a240.128 240.128 0 0 1 242.688 172.032h-23.04a198.144 198.144 0 0 0-204.8 193.536 185.344 185.344 0 0 0 7.168 51.2zM768 732.672l17.92 60.928-66.048-36.864a296.96 296.96 0 0 1-72.192 12.288 191.488 191.488 0 0 1-204.8-177.664 191.488 191.488 0 0 1 204.8-177.664c108.032 0 204.8 79.872 204.8 177.664A185.856 185.856 0 0 1 768 732.672z" p-id="1402" fill="#cdcdcd"></path></svg>

clientarea/home/hgcloud_home/img/wx_hover.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1744782720905" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11177" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><path d="M334.848 334.336a33.792 33.792 0 0 0-36.352 30.72 33.792 33.792 0 0 0 36.352 30.72 28.672 28.672 0 0 0 30.208-30.72 28.672 28.672 0 0 0-30.208-30.72zM581.12 512a24.576 24.576 0 0 0 0 51.2 27.648 27.648 0 0 0 30.208-24.576 27.648 27.648 0 0 0-30.208-26.624zM502.784 395.776a28.672 28.672 0 0 0 30.208-30.72 28.672 28.672 0 0 0-30.208-30.72 33.792 33.792 0 0 0-35.84 30.72 33.792 33.792 0 0 0 35.84 30.72zM713.216 512a24.576 24.576 0 0 0 0 51.2 27.648 27.648 0 0 0 30.208-24.576 27.648 27.648 0 0 0-30.208-26.624z" p-id="11178" fill="#0058FF"></path><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0zM412.672 646.656a403.456 403.456 0 0 1-83.968-12.288l-83.968 43.008 24.064-73.728a201.216 201.216 0 0 1-96.256-165.376c0-116.224 108.032-207.872 240.128-207.872a240.128 240.128 0 0 1 242.688 172.032h-23.04a198.144 198.144 0 0 0-204.8 193.536 185.344 185.344 0 0 0 7.168 51.2zM768 732.672l17.92 60.928-66.048-36.864a296.96 296.96 0 0 1-72.192 12.288 191.488 191.488 0 0 1-204.8-177.664 191.488 191.488 0 0 1 204.8-177.664c108.032 0 204.8 79.872 204.8 177.664A185.856 185.856 0 0 1 768 732.672z" p-id="11179" fill="#0058FF"></path></svg>

clientarea/home/hgcloud_home/js/home.js

@@ -0,0 +1,443 @@
+(function (window, undefined) {
+  var old_onload = window.onload;
+  window.onload = function () {
+    const template = document.getElementsByClassName("template")[0];
+    Vue.prototype.lang = window.lang;
+
+    new Vue({
+      components: {
+        asideMenu,
+        topMenu,
+        rechargeDialog,
+        payDialog,
+        creditNotice,
+      },
+      created() {
+        localStorage.frontMenusActiveId = "";
+        this.getCommonData();
+        this.getGateway();
+      },
+      mounted() {
+        const addons = document.querySelector("#addons_js");
+        this.addons_js_arr = JSON.parse(addons.getAttribute("addons_js"));
+        this.initData();
+      },
+      updated() {},
+      destroyed() {},
+      data() {
+        return {
+          addons_js_arr: [], // 插件数组
+          commonData: {
+            currency_prefix: "￥",
+          },
+          idcsmart_client_level: {
+            name: "",
+            id: "",
+            background_color: "",
+          },
+          showRight: false,
+          account: {}, // 个人信息
+          certificationObj: {}, // 认证信息
+          percentage: 0,
+          productListLoading: true,
+          nameLoading: false,
+          infoSecLoading: false,
+          productList: [], // 产品列表
+          ticketList: [], // 工单列表
+          homeNewList: [], // 新闻列表
+          // 支付方式
+          gatewayList: [],
+          headBgcList: [
+            "#3699FF",
+            "#57C3EA",
+            "#5CC2D7",
+            "#EF8BA2",
+            "#C1DB81",
+            "#F1978C",
+            "#F08968",
+          ],
+          // 轮询相关
+          timer: null,
+          time: 300000,
+          // 后台返回的支付html
+          payHtml: "",
+          // 错误提示信息
+          errText: "",
+          // 是否显示充值弹窗
+          isShowCz: false,
+          payLoading1: false,
+          isShowimg1: true,
+          // 充值弹窗表单数据
+          czData: {
+            amount: "",
+            gateway: "",
+          },
+          czDataOld: {
+            amount: "",
+            gateway: "",
+          },
+          isOpen: true,
+          promoterData: {},
+          openVisible: false,
+          voucherList: [], // 可领代金券列表
+          hasWxPlugin: false,
+          wxQrcode: "",
+          conectInfo: {
+            is_subscribe: 0,
+            accept_push: 0,
+          },
+          codeLoading: false,
+          isShowCredit: false,
+          creditData: {},
+          coinData: {},
+          coinRecharge: [],
+        };
+      },
+      filters: {
+        formateTime(time) {
+          if (time && time !== 0) {
+            return formateDate(time * 1000);
+          } else {
+            return "--";
+          }
+        },
+        formareDay(time) {
+          if (time && time !== 0) {
+            const dataTime = formateDate(time * 1000);
+            return (
+              dataTime.split(" ")[0].split("-")[1] +
+              "-" +
+              dataTime.split(" ")[0].split("-")[2]
+            );
+          } else {
+            return "--";
+          }
+        },
+      },
+      methods: {
+        goOrderList(val) {
+          location.href = "/finance.htm?order_status=" + val;
+        },
+        goProductList(val) {
+          if (val) {
+            location.href = "/productList.htm?tab=" + val;
+            return;
+          }
+          location.href = "/productList.htm";
+        },
+        //  授信详情
+        getCreditDetail() {
+          creditDetail().then((res) => {
+            if (res.data.status === 200) {
+              this.isShowCredit = true;
+              this.creditData = res.data.data.credit_limit;
+            }
+          });
+        },
+        goCredit() {
+          location.href = "/finance.htm?tab=6";
+        },
+        async getWxConectInfo() {
+          try {
+            const res = await getWxInfo();
+            this.conectInfo = res.data.data;
+          } catch (error) {
+            this.$message.error(error.data.msg);
+          }
+        },
+        async getWxcode() {
+          try {
+            this.codeLoading = true;
+            const res = await getWxQrcode();
+            this.wxQrcode = res.data.data.img_url;
+            this.codeLoading = false;
+          } catch (error) {
+            this.codeLoading = false;
+            this.$message.error(error.data.msg);
+          }
+        },
+        /* 可领代金券 */
+        async getVoucherAvailable() {
+          try {
+            const res = await voucherAvailable({page: 1, limit: 999});
+            this.voucherList = res.data.data.list.filter(
+              (item) => !item.is_get
+            );
+          } catch (error) {
+            this.$message.error(error.data.msg);
+          }
+        },
+        /* 可领代金券 end */
+        toReferral() {
+          location.href = `/plugin/${getPluginId(
+            "IdcsmartRecommend"
+          )}/recommend.htm`;
+        },
+        handelAttestation() {
+          location.href = `/plugin/${getPluginId(
+            "IdcsmartCertification"
+          )}/authentication_select.htm`;
+        },
+        goWorkPage() {
+          location.href = `/plugin/${getPluginId("IdcsmartTicket")}/ticket.htm`;
+        },
+        goNoticePage() {
+          location.href = `/plugin/${getPluginId("IdcsmartNews")}/source.htm`;
+        },
+        goNoticeDetail(id) {
+          location.href = `/plugin/${getPluginId(
+            "IdcsmartNews"
+          )}/news_detail.htm?id=${id}`;
+        },
+        goGoodsList() {
+          location.href = `/cart/goodsList.htm`;
+        },
+        goProductPage(id) {
+          location.href = `/productdetail.htm?id=${id}`;
+        },
+        goTickDetail(orderid) {
+          location.href = `/plugin/${getPluginId(
+            "IdcsmartTicket"
+          )}/ticketDetails.htm?id=${orderid}`;
+        },
+        getCoinRecharge() {
+          apiCoinRecharge().then((res) => {
+            this.coinRecharge = res.data.data.coins;
+          });
+        },
+        initData() {
+          const arr = this.addons_js_arr.map((item) => {
+            return item.name;
+          });
+          if (arr.includes("IdcsmartVoucher")) {
+            this.getVoucherAvailable();
+          }
+          if (arr.includes("IdcsmartCertification")) {
+            certificationInfo().then((res) => {
+              this.certificationObj = res.data.data;
+            });
+          }
+          if (arr.includes("IdcsmartTicket")) {
+            ticket_list({page: 1, limit: 3}).then((res) => {
+              this.ticketList = res.data.data.list;
+            });
+          }
+          if (arr.includes("IdcsmartNews")) {
+            newsList({page: 1, limit: 3}).then((res) => {
+              this.homeNewList = res.data.data.list.slice(0, 3);
+            });
+          }
+          if (arr.includes("IdcsmartRecommend")) {
+            this.showRight = true;
+            this.getPromoterInfo();
+          }
+
+          if (arr.includes("MpWeixinNotice")) {
+            this.hasWxPlugin = true;
+            this.getWxConectInfo();
+          }
+
+          if (arr.includes("CreditLimit")) {
+            // 开启了信用额
+            this.getCreditDetail();
+          }
+
+          if (arr.includes("Coin")) {
+            this.getCoinDetail();
+            this.getCoinRecharge();
+          }
+
+          this.getIndexHost();
+          this.getIndexInfo();
+
+          // promoter_statistic().then((res) => {
+          //     console.log(res);
+          // })
+        },
+        getCoinDetail() {
+          apiCoinDetail().then((res) => {
+            this.coinData = res.data.data;
+          });
+        },
+        getIndexInfo() {
+          this.nameLoading = true;
+          indexData()
+            .then((res) => {
+              this.account = res.data.data.account;
+              this.idcsmart_client_level =
+                res.data.data.account.customfield?.idcsmart_client_level || {};
+              localStorage.lang = res.data.data.account.language || "zh-cn";
+              const reg = /^[a-zA-Z]+$/;
+              if (reg.test(res.data.data.account.username.substring(0, 1))) {
+                this.account.firstName = res.data.data.account.username
+                  .substring(0, 1)
+                  .toUpperCase();
+              } else {
+                this.account.firstName =
+                  res.data.data.account.username.substring(0, 1);
+              }
+              this.percentage =
+                (Number(this.account.this_month_consume) /
+                  Number(this.account.consume)) *
+                  100 || 0;
+              if (sessionStorage.headBgc) {
+                this.$refs.headBoxRef.style.background = sessionStorage.headBgc;
+              } else {
+                const index = Math.round(
+                  Math.random() * (this.headBgcList.length - 1)
+                );
+                this.$refs.headBoxRef.style.background =
+                  this.headBgcList[index];
+                sessionStorage.headBgc = this.headBgcList[index];
+              }
+              this.nameLoading = false;
+            })
+            .catch((error) => {
+              // jwt过期跳转订购产品页面
+              // if (error.data.status == 401) {
+              //     location.href = "login.htm"
+              // }
+            });
+        },
+        getIndexHost() {
+          indexHost({page: 1, limit: 10})
+            .then((res) => {
+              this.productListLoading = false;
+              this.productList = res.data.data.list;
+              const data = new Date().getTime() * 0.001;
+              this.productList.forEach((item) => {
+                if (
+                  item.due_time !== 0 &&
+                  (item.due_time - data) / (60 * 60 * 24) <= 10
+                ) {
+                  item.isOverdue = true;
+                } else {
+                  item.isOverdue = false;
+                }
+              });
+            })
+            .catch(() => {
+              this.productListLoading = false;
+            });
+        },
+        // 获取支付方式列表
+        getGateway() {
+          gatewayList().then((res) => {
+            if (res.data.status === 200) {
+              this.gatewayList = res.data.data.list;
+            }
+          });
+        },
+        goUser() {
+          location.href = `account.htm`;
+        },
+        // 支付成功回调
+        paySuccess(e) {
+          indexData().then((res) => {
+            this.account = res.data.data.account;
+            this.account.firstName = res.data.data.account.username.substring(
+              0,
+              1
+            );
+            this.percentage =
+              (Number(this.account.this_month_consume) /
+                Number(this.account.consume)) *
+                100 || 0;
+          });
+        },
+        // 取消支付回调
+        payCancel(e) {},
+
+        // 显示充值 dialog
+        showCz() {
+          this.$refs.rechargeDialog.open();
+        },
+
+        rechargeSuccess() {
+          this.paySuccess();
+        },
+        setAccoutCredit() {
+          this.$refs.creditNotice.open();
+        },
+
+        // 获取通用配置
+        async getCommonData() {
+          this.commonData = JSON.parse(
+            localStorage.getItem("common_set_before")
+          ) || {
+            currency_prefix: "￥",
+          };
+          const res = await getCommon();
+          this.commonData = res.data.data;
+          localStorage.setItem(
+            "common_set_before",
+            JSON.stringify(res.data.data)
+          );
+          document.title =
+            this.commonData.website_name + "-" + lang.index_text33;
+        },
+        // 获取推广者基础信息
+        getPromoterInfo() {
+          promoterInfo()
+            .then((res) => {
+              if (res.data.status == 200) {
+                this.promoterData = res.data.data.promoter;
+                if (res.data.data.promoter.permission === 0) {
+                  this.showRight = false;
+                }
+                if (
+                  JSON.stringify(this.promoterData) == "{}" ||
+                  !res.data.data.promoter.url
+                ) {
+                  this.isOpen = false;
+                } else {
+                  this.isOpen = true;
+                }
+              }
+            })
+            .catch((err) => {
+              this.isOpen = false;
+              this.showRight = false;
+            });
+        },
+        // 开启推介计划
+        openReferral() {
+          openRecommend()
+            .then((res) => {
+              if (res.data.status == 200) {
+                this.$message.success(res.data.msg);
+                this.getPromoterInfo();
+                this.openVisible = false;
+              }
+            })
+            .catch((error) => {
+              this.$message.error(error.data.msg);
+            });
+        },
+        // 复制
+        copyUrl(text) {
+          if (navigator.clipboard && window.isSecureContext) {
+            // navigator clipboard 向剪贴板写文本
+            this.$message.success(lang.index_text32);
+            return navigator.clipboard.writeText(text);
+          } else {
+            // 创建text area
+            const textArea = document.createElement("textarea");
+            textArea.value = text;
+            // 使text area不在viewport，同时设置不可见
+            document.body.appendChild(textArea);
+            // textArea.focus()
+            textArea.select();
+            this.$message.success(lang.index_text32);
+            return new Promise((res, rej) => {
+              // 执行复制命令并移除文本框
+              document.execCommand("copy") ? res() : rej();
+              textArea.remove();
+            });
+          }
+        },
+      },
+    }).$mount(template);
+    typeof old_onload == "function" && old_onload();
+  };
+})(window);