c84adf6823
All checks were successful
continuous-integration/drone/push Build is passing
- 注释掉info-box（用户名/邮箱/认证已在账户页） - 用三张finance-card替换statistics-box+圆形图表 - 余额卡片含充值按钮，本月消费含同比变化标签 - 信用额度保留为独立卡片 - 移除多余的div闭合标签
300 lines
16 KiB
PHP
300 lines
16 KiB
PHP
{include file="header"}
|
||
<link rel="stylesheet" href="/{$template_catalog}/template/{$themes}/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>
|
||
<!-- 自己的东西 -->
|
||
<div class="main-card">
|
||
<div class="main-content">
|
||
<div class="left-box">
|
||
<!-- info-box 已移至账户页面，此处隐藏 -->
|
||
<!--
|
||
<div class="info-box">
|
||
... 用户信息/邮箱/认证 ...
|
||
</div>
|
||
-->
|
||
<div class="finance-cards" v-loading="nameLoading">
|
||
<div class="finance-card balance-card">
|
||
<div class="finance-card-header">
|
||
<div class="finance-icon-wrap balance-icon"><i class="ph ph-wallet"></i></div>
|
||
<span class="finance-label">{{lang.index_text3}}</span>
|
||
</div>
|
||
<div class="finance-value">{{commonData.currency_prefix}}{{account.credit}}</div>
|
||
<div class="finance-card-footer">
|
||
<div class="recharge-btn" @click="showCz" v-if="commonData.recharge_open == 1">
|
||
{{lang.index_text2}}
|
||
</div>
|
||
<div class="voucher-link" 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>
|
||
</div>
|
||
<div class="finance-card month-card">
|
||
<div class="finance-card-header">
|
||
<div class="finance-icon-wrap month-icon"><i class="ph ph-chart-line-up"></i></div>
|
||
<span class="finance-label">{{lang.index_text4}}</span>
|
||
</div>
|
||
<div class="finance-value">{{commonData.currency_prefix}}{{account.this_month_consume}}</div>
|
||
<div class="finance-card-footer">
|
||
<span class="percent-badge green" v-if="Number(account.this_month_consume_percent) >= 0">
|
||
↑ {{Number(account.this_month_consume_percent)}}%
|
||
</span>
|
||
<span class="percent-badge red" v-else>
|
||
↓ {{Number(account.this_month_consume_percent) * -1}}%
|
||
</span>
|
||
<span class="vs-text">vs 上月</span>
|
||
</div>
|
||
</div>
|
||
<div class="finance-card total-card">
|
||
<div class="finance-card-header">
|
||
<div class="finance-icon-wrap total-icon"><i class="ph ph-coins"></i></div>
|
||
<span class="finance-label">{{lang.index_text5}}</span>
|
||
</div>
|
||
<div class="finance-value">{{commonData.currency_prefix}}{{account.consume}}</div>
|
||
<div class="finance-card-footer">
|
||
<span class="total-sub-text">{{lang.index_text1}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 信用额度（保留） -->
|
||
<div class="credit-extra" v-if="isShowCredit && creditData.status" v-loading="nameLoading">
|
||
<div class="finance-card credit-card">
|
||
<div class="finance-card-header">
|
||
<div class="finance-icon-wrap credit-icon"><i class="ph ph-credit-card"></i></div>
|
||
<span class="finance-label">{{lang.finance_text38}}</span>
|
||
<span class="credit-status-tag" v-if="creditData.status === 'Expired'">{{lang.finance_text93}}</span>
|
||
<span class="credit-status-tag" v-if="creditData.status === 'Overdue'">{{lang.finance_text94}}</span>
|
||
<span class="credit-status-tag active" v-if="creditData.status === 'Active'">{{lang.finance_text95}}</span>
|
||
<span class="credit-status-tag" v-if="creditData.status === 'Suspended'">{{lang.finance_text96}}</span>
|
||
</div>
|
||
<div class="finance-value">{{commonData.currency_prefix}}{{creditData.remaining_amount}}</div>
|
||
<div class="finance-card-footer">
|
||
<span class="bule-text" style="cursor:pointer" @click="goCredit">{{lang.index_text34}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 产品统计 -->
|
||
<div class="order-box" v-loading="nameLoading">
|
||
<div class="order-item order-box-1">
|
||
<div class="order-type-icon">
|
||
<i class="ph ph-pulse"></i>
|
||
</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">
|
||
<div class="order-type-icon">
|
||
<i class="ph ph-cube"></i>
|
||
</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">
|
||
<div class="order-type-icon">
|
||
<i class="ph ph-receipt"></i>
|
||
</div>
|
||
<h3 class="order-title">{{lang.index_text8}}</h3>
|
||
<div class="order-nums">{{account.unpaid_order}}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="product-list-box">
|
||
<h3 class="title-text">{{lang.index_text9}}</h3>
|
||
<div class="goods-box" v-loading="productListLoading">
|
||
<table class="goods-table">
|
||
<thead>
|
||
<tr>
|
||
<td>{{lang.index_text10}}</td>
|
||
<td>{{lang.index_text12}}</td>
|
||
<td class="time-box">{{lang.index_text13}}</td>
|
||
<td>{{lang.invoice_text139}}</td>
|
||
</tr>
|
||
</thead>
|
||
<tbody v-if="productList.length !== 0">
|
||
<tr v-for="item in productList" :key="item.id" class="product-item"
|
||
@click="goProductPage(item.id)">
|
||
<td>{{item.product_name}}</td>
|
||
<!-- <td>{{item.type ? item.type : '--'}}</td> -->
|
||
<td>{{item.name}}</td>
|
||
<td :class="item.isOverdue ? 'red-time' : ''">{{item.due_time | formateTime}}</td>
|
||
<td>{{item.client_notes}}</td>
|
||
</tr>
|
||
</tbody>
|
||
</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">{{lang.index_text16}}</el-button>
|
||
</div>
|
||
</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"><i class="ph-fill ph-gift" style="font-size:16px;margin-right:4px;vertical-align:middle"></i>{{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>
|
||
<div class="right recommend-illustration"><i class="ph ph-credit-card"></i></div>
|
||
</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="item-top">
|
||
<div class="top-money">{{commonData.currency_prefix}}{{promoterData.withdrawable_amount}}</div>
|
||
<div class="top-text">{{lang.referral_title2}}</div>
|
||
</div>
|
||
<div class="top-img-icon" style="color:#3DD598"><i class="ph ph-wallet"></i></div>
|
||
</div>
|
||
<div class="top-item">
|
||
<div class="item-top">
|
||
<div class="top-money">{{commonData.currency_prefix}}{{promoterData.pending_amount}}
|
||
<!-- <div class="icon-help" :title="`${lang.referral_text7}：${commonData.currency_prefix}${promoterData.frozen_amount}`">?</div> -->
|
||
</div>
|
||
<div class="top-text">{{lang.referral_title4}}</div>
|
||
</div>
|
||
<div class="top-img-icon" style="color:#F99600"><i class="ph ph-clock-countdown"></i></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="recommend-box" v-if="!showRight || !isOpen">
|
||
<div class="recommend-placeholder-icon"><i class="ph ph-megaphone"></i></div>
|
||
<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>
|
||
<!-- 充值 dialog -->
|
||
<div class="cz-dialog">
|
||
<el-dialog width="6.8rem" :visible.sync="isShowCz" @close="czClose">
|
||
<div class="dialog-title">
|
||
{{lang.finance_title4}}
|
||
</div>
|
||
<div class="dialog-form">
|
||
<el-form :model="czData" label-position="top" @submit.native.prevent>
|
||
<!-- <el-form-item :label="lang.finance_label18">
|
||
<el-select v-model="czData.gateway" @change="czSelectChange">
|
||
<el-option v-for="item in gatewayList" :key="item.id" :label="item.title" :value="item.name"></el-option>
|
||
</el-select>
|
||
</el-form-item> -->
|
||
<el-form-item :label="lang.finance_label19" prop="amount">
|
||
<div class="cz-input">
|
||
<!-- <el-input v-model="czData.amount" @keyup.native="czData.amount=oninput(czData.amount)"> -->
|
||
<el-input v-model="czData.amount" @keypress.enter.native="czInputChange"
|
||
@change="czData.amount=oninput(czData.amount)">
|
||
</el-input>
|
||
<el-button class="btn-ok" @click="czInputChange">{{lang.finance_btn6}}</el-button>
|
||
</div>
|
||
<div v-html="commonData.recharge_money_notice_content"></div>
|
||
</el-form-item>
|
||
<!-- <el-form-item v-if="errText">
|
||
<el-alert :title="errText" type="error" :closable="false" show-icon>
|
||
</el-alert>
|
||
</el-form-item>
|
||
<el-form-item v-loading="payLoading1">
|
||
<div class="pay-html" v-show="isShowimg1" v-html="payHtml"></div>
|
||
</el-form-item> -->
|
||
</el-form>
|
||
</div>
|
||
</el-dialog>
|
||
</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" @paycancel="payCancel"></pay-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}/api/finance.js"></script>
|
||
<script src="/{$template_catalog}/template/{$themes}/api/home.js"></script>
|
||
<script src="/{$template_catalog}/template/{$themes}/js/home.js"></script>
|
||
<script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
|
||
|
||
{include file="footer"}
|