|
|
|
@ -1,5 +1,5 @@ |
|
|
|
<template> |
|
|
|
<div class="main-content12 expense-wrap"> |
|
|
|
<div class="main-content12 recharge-wrap"> |
|
|
|
<h3 class="pagetitle">余额管理</h3> |
|
|
|
<div class="flex-common"> |
|
|
|
<div class="flex-between"> |
|
|
|
@ -11,40 +11,112 @@ |
|
|
|
<div class="flex"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="mt24"> |
|
|
|
<div class="mt24" v-if="totalType == '1'"> |
|
|
|
<div class="flex-between w552"> |
|
|
|
<div class="wallet-choose">充值选择</div> |
|
|
|
<div class="wallet-desc flex">设置通用余额提醒，防止余额不足，点此设置<img style="width: 14px" src="@/assets/input_ex_ic.png"/></div> |
|
|
|
<div class="wallet-desc flex" v-if="prompt" @click="jumpLink(prompt_link)">{{prompt}}<img style="width: 14px" src="@/assets/input_ex_ic.png"/></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<el-form class="el-row demo-ruleForm" ref="formRef"> |
|
|
|
<div class="flex gap24 mt12"> |
|
|
|
<div class="wallet-item wallet-item-active"> |
|
|
|
<img src="@/assets/site/tem-active.svg" class="tem-active" alt=""> |
|
|
|
<div class="wallet-name">通用钱包</div> |
|
|
|
<div class="wallet-num">当前余额<span class="wallet-price">4560</span>元</div> |
|
|
|
</div> |
|
|
|
<div class="wallet-item"> |
|
|
|
<!-- <img src="@/assets/site/tem-active.svg" class="tem-active" alt="">--> |
|
|
|
<div class="wallet-name">通用钱包</div> |
|
|
|
<div class="wallet-num">当前余额<span class="wallet-price">4560</span>元</div> |
|
|
|
<template v-for="item in walletList"> |
|
|
|
<div :key="item.type" class="wallet-item" :class="walletType == item.type ? 'wallet-item-active' : ''" @click="walletClick(item.type)"> |
|
|
|
<img src="@/assets/site/tem-active.svg" class="tem-active" alt="" v-if="walletType == item.type"> |
|
|
|
<div class="wallet-name">{{item.name}}</div> |
|
|
|
<div class="wallet-num">当前余额<span class="wallet-price">{{item.remain_money}}</span>元</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="buy-area"> |
|
|
|
<div class="flex-between w552 mt24"> |
|
|
|
<div class="wallet-choose">充值卡面值</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="flex mt12"> |
|
|
|
<GuipRadio v-model="domain_type" :options="domain_types"/> |
|
|
|
<div class="flex-between buy-bonus w552 mt12" v-show="Object.keys(bonus).length>0"> |
|
|
|
<img src="@/assets/site/recharge_bonus.png" alt=""> |
|
|
|
<div class="buy-bonus-info"> |
|
|
|
<div class="flex" v-for="(value, key) in bonus" :key="key"> |
|
|
|
<span>充<b>{{key}}</b>元</span><span>送<b class="red">{{value}}</b>元</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="buy-btn flex mt12"> |
|
|
|
<div class="flex mt12" v-if="Object.keys(buy_price_types).length>0"> |
|
|
|
<GuipRadio v-model="buy_price_type" :options="buy_price_types" @change="buyLinkClick()"/> |
|
|
|
</div> |
|
|
|
<div class="buy-btn flex mt12" v-if="buy_price_link" @click="jumpLink(buy_price_link)"> |
|
|
|
<img src="@/assets/site/tb_buy_btn.svg" alt="">跳转淘宝购买 |
|
|
|
</div> |
|
|
|
<div class="buy-desc flex mt12"> |
|
|
|
充值以本页跳转链接为准！淘宝交易服务费（0.6%）已由平台承担，暂时无需支付 |
|
|
|
<div class="buy-desc flex mt12" v-if="links_desc">{{links_desc}}</div> |
|
|
|
|
|
|
|
<hr class="buy-hr"> |
|
|
|
|
|
|
|
<div class="buy-recharge flex gap12"> |
|
|
|
<GuipInput ref="GuipInput" v-model="ordernum" class="w443" column="column" prop="age" placeholder="请输入淘宝订单号" /> |
|
|
|
<GuipButton @click="doRecharge()">现在充值</GuipButton> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="buy-info"> |
|
|
|
<p class="red">充值流程：</p> |
|
|
|
<p>1.填写订单编号</p> |
|
|
|
<p>2.点击【现在充值】按钮</p> |
|
|
|
<p>3.到淘宝确认收货</p> |
|
|
|
<p>4.点击弹层中已【确认收货】按钮</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-form> |
|
|
|
</div> |
|
|
|
<el-form class="mt24" v-else> |
|
|
|
<GuipTable :tableData="tableList" :key="tableKey" ref="multipleTable" autoColumn="true" :loading="tableLoading" style="flex:1"> |
|
|
|
<template v-if="totalType == '2'"> |
|
|
|
<el-table-column prop="tid" label="订单号"></el-table-column> |
|
|
|
<el-table-column prop="money"> |
|
|
|
<template slot="header"> |
|
|
|
充值金额 |
|
|
|
<span class="money-header" v-if="total_money>0"> 总计 {{ total_money }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="pay_date" label="充值时间"></el-table-column> |
|
|
|
<el-table-column prop="remain_money" label="充值前账号余额"></el-table-column> |
|
|
|
<el-table-column prop="type_desc" label="类型"></el-table-column> |
|
|
|
<el-table-column prop="opt" label="操作"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<GuipButton v-if="scope.row.confirm" type="ignore" class="mr-16" :btnstyle="confirmBtnStyle">确认收货</GuipButton> |
|
|
|
<div v-else>----</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</template> |
|
|
|
<template v-else> |
|
|
|
<el-table-column prop="tid" label="订单号"></el-table-column> |
|
|
|
<el-table-column prop="tid" label="退回成本"></el-table-column> |
|
|
|
<el-table-column prop="tid" label="时间"></el-table-column> |
|
|
|
<el-table-column prop="tid" label="充值前账号余额"></el-table-column> |
|
|
|
<el-table-column prop="tid" label="检测类型"></el-table-column> |
|
|
|
<el-table-column prop="tid" label="退款前论文状态"></el-table-column> |
|
|
|
<el-table-column prop="tid" label="订单金额"></el-table-column> |
|
|
|
<!-- <el-table-column prop="tid" label="退款金额"></el-table-column>--> |
|
|
|
<!-- <el-table-column prop="tid" label="退款方式"></el-table-column>--> |
|
|
|
<!-- <el-table-column prop="tid" label="退款时间"></el-table-column>--> |
|
|
|
<!-- <el-table-column prop="tid" label="退款理由"></el-table-column>--> |
|
|
|
<el-table-column prop="tid" label="退款详情"></el-table-column> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<!-- <el-table-column prop="date1" label="站点名称" min-width="130px" v-if="totalType == '2'">--> |
|
|
|
<!-- <template slot-scope="scope">--> |
|
|
|
<!-- <div class="flex">--> |
|
|
|
<!-- {{ nameList[scope.row.id] }}--> |
|
|
|
<!-- </div>--> |
|
|
|
<!-- </template>--> |
|
|
|
<!-- </el-table-column>--> |
|
|
|
|
|
|
|
|
|
|
|
</GuipTable> |
|
|
|
<el-pagination background @size-change='handleSizeChange' @current-change='handleCurrentChange' |
|
|
|
:current-page="currentPage" :page-size=pageSize layout="prev, pager, next,jumper" |
|
|
|
:total="parseInt(total)"> |
|
|
|
</el-pagination> |
|
|
|
</el-form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
@ -52,9 +124,15 @@ |
|
|
|
|
|
|
|
|
|
|
|
import GuipRadio from "@/components/GuipRadio.vue"; |
|
|
|
import GuipInput from "@/components/GuipInput.vue"; |
|
|
|
import GuipButton from "@/components/GuipButton.vue"; |
|
|
|
import GuipTable from "@/components/GuipTable.vue"; |
|
|
|
|
|
|
|
export default { |
|
|
|
components: { |
|
|
|
GuipTable, |
|
|
|
GuipButton, |
|
|
|
GuipInput, |
|
|
|
GuipRadio |
|
|
|
|
|
|
|
}, |
|
|
|
@ -69,48 +147,75 @@ export default { |
|
|
|
totalType:'1', |
|
|
|
tableLoading:false, |
|
|
|
|
|
|
|
walletType: '', |
|
|
|
walletList:[], |
|
|
|
|
|
|
|
prompt:'', |
|
|
|
prompt_link:'', |
|
|
|
bonus:[], |
|
|
|
buy_price_type: '', |
|
|
|
buy_price_types: {}, |
|
|
|
buy_price_link: '', |
|
|
|
buy_price_links: {}, |
|
|
|
links_desc: '', |
|
|
|
|
|
|
|
ordernum:'', |
|
|
|
|
|
|
|
siteNum: 1, |
|
|
|
tableKey: '', |
|
|
|
monthList:[], |
|
|
|
monthTotal:[], |
|
|
|
payList:[], |
|
|
|
nameList:[], |
|
|
|
topList:[], |
|
|
|
tableList:[], |
|
|
|
currentPage: 1, //当前页 |
|
|
|
pageSize: 20, //每页的容量 |
|
|
|
total: 0, //列表总数 |
|
|
|
total_money: 0, //列表总数 |
|
|
|
|
|
|
|
domain_type: 1, |
|
|
|
domain_types: {1: "平台免费域名", 2: "我自己有域名"}, |
|
|
|
confirmBtnStyle: { |
|
|
|
'background':'#FF4D4F', |
|
|
|
'color':'#FFFFFF', |
|
|
|
'border':'1px solid #FF4D4F', |
|
|
|
'border-radius':'4px', |
|
|
|
'width': '88px', |
|
|
|
'height': '33px', |
|
|
|
'font-size': '12px', |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.$nextTick(()=>{ |
|
|
|
this.totalType = this.total_type; |
|
|
|
|
|
|
|
this.handleClick() |
|
|
|
}) |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
handleClickDetail(id){ |
|
|
|
if(this.totalType == 2) this.$router.push(`/agent/statisticalDetails?uid=${id}&total_type=${this.totalType}&date=${this.date}`) |
|
|
|
if(this.totalType == 3) this.$router.push(`/agent/statisticalDetails?chktype=${id}&total_type=${this.totalType}&date=${this.date}`) |
|
|
|
walletClick(type){ |
|
|
|
this.walletType = type |
|
|
|
this.walletList.forEach(item => { |
|
|
|
if(item.type === type){ |
|
|
|
this.prompt = item.prompt |
|
|
|
this.prompt_link = item.prompt_link |
|
|
|
this.bonus = item.bonus |
|
|
|
|
|
|
|
item.links.forEach((v,idx) => { |
|
|
|
this.buy_price_types[idx] = v.face_val+'元' |
|
|
|
this.buy_price_links[idx] = v.url |
|
|
|
}) |
|
|
|
|
|
|
|
this.buy_price_type = '0' |
|
|
|
this.buy_price_link = this.buy_price_links[this.buy_price_type] |
|
|
|
this.links_desc = item.links_desc |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
handleClicksiteRank(id){ |
|
|
|
this.$router.push(`/agent/siteRank?id=${id}&total_type=${this.totalType}&date=`+this.date) |
|
|
|
jumpLink(link){ |
|
|
|
window.open(link, '_blank'); |
|
|
|
}, |
|
|
|
handleClickserviceRank(id){ |
|
|
|
this.$router.push(`/agent/serviceRank?id=${id}&total_type=${this.totalType}&date=`+this.date) |
|
|
|
buyLinkClick(){ |
|
|
|
this.buy_price_link = this.buy_price_links[this.buy_price_type]; |
|
|
|
}, |
|
|
|
handleClick(){ |
|
|
|
this.monthList = [] |
|
|
|
this.payList = [] |
|
|
|
this.monthTotal = [] |
|
|
|
this.nameList = [] |
|
|
|
this.topList = [] |
|
|
|
this.tableList = [] |
|
|
|
this.tableKey = Math.random(); |
|
|
|
if(this.totalType == 1) this.getRechargeData() |
|
|
|
if(this.totalType == 2) this.getSiteStats() |
|
|
|
if(this.totalType == 2) this.getRechargeList() |
|
|
|
if(this.totalType == 3) this.getChktypeStats() |
|
|
|
}, |
|
|
|
getRechargeData() { |
|
|
|
@ -118,7 +223,7 @@ export default { |
|
|
|
this.$http('POST', '/agentnew/ajax_get_recharge_data', {date: this.date}).then(response => { |
|
|
|
this.$nextTick(() => { |
|
|
|
this.walletList = response.data |
|
|
|
console.log(response) |
|
|
|
if(this.walletType == '') this.walletClick(response.data[0].type) |
|
|
|
}) |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
@ -127,17 +232,20 @@ export default { |
|
|
|
console.error('数据加载失败:', error) |
|
|
|
} |
|
|
|
}, |
|
|
|
getSiteStats() { |
|
|
|
getRechargeList() { |
|
|
|
this.tableLoading = true |
|
|
|
try { |
|
|
|
this.$http('POST', '/agentnew/ajax_get_site_stats', {date: this.date}).then(response => { |
|
|
|
this.$http('POST', '/agentnew/ajax_get_recharge_list', { |
|
|
|
type: this.walletType, |
|
|
|
cur_page: this.currentPage, |
|
|
|
page_size: this.pageSize |
|
|
|
}).then(response => { |
|
|
|
this.tableLoading = false |
|
|
|
this.$nextTick(() => { |
|
|
|
this.monthList = response.data.list |
|
|
|
this.payList = response.data.pay_list |
|
|
|
this.monthTotal = response.data.total |
|
|
|
this.nameList = response.data.name_list |
|
|
|
this.topList = response.data.top_list |
|
|
|
this.tableList = response.data.list |
|
|
|
this.total = response.data.total |
|
|
|
this.total_money = response.data.total_money |
|
|
|
console.log(this.total_money) |
|
|
|
}) |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
@ -154,11 +262,7 @@ export default { |
|
|
|
this.$http('POST', '/agentnew/ajax_get_chktype_stats', {date: this.date}).then(response => { |
|
|
|
this.tableLoading = false |
|
|
|
this.$nextTick(() => { |
|
|
|
this.monthList = response.data.list |
|
|
|
this.payList = response.data.pay_list |
|
|
|
this.monthTotal = response.data.total |
|
|
|
this.nameList = response.data.name_list |
|
|
|
this.topList = response.data.top_list |
|
|
|
this.tableList = response.data.list |
|
|
|
}) |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
@ -169,15 +273,52 @@ export default { |
|
|
|
this.tableLoading = false |
|
|
|
} |
|
|
|
}, |
|
|
|
doRecharge(){ |
|
|
|
try { |
|
|
|
this.$http('POST', '/agentnew/ajax_do_recharge', {orderId: this.ordernum,type: this.walletType}).then(response => { |
|
|
|
if (response.status) { |
|
|
|
this.$message.success('充值成功'); |
|
|
|
return true; |
|
|
|
} |
|
|
|
this.$message.error(response.info); |
|
|
|
}).catch(error => { |
|
|
|
console.error(error, 'error') |
|
|
|
}) |
|
|
|
} catch (error) { |
|
|
|
console.error('数据加载失败:', error) |
|
|
|
} |
|
|
|
}, |
|
|
|
handleSizeChange(val) { |
|
|
|
this.pageSize = val |
|
|
|
this.getRechargeList() |
|
|
|
}, |
|
|
|
handleCurrentChange(val) { |
|
|
|
this.currentPage = val |
|
|
|
this.getRechargeList() |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
|
|
.recharge-wrap{ |
|
|
|
.pagetitle { |
|
|
|
text-align: left; |
|
|
|
font-size: 16px; |
|
|
|
font-weight: bold; |
|
|
|
line-height: normal; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
color: #1E2226; |
|
|
|
margin-top: 8px; |
|
|
|
} |
|
|
|
.w552{ |
|
|
|
width: 552px; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
} |
|
|
|
.w443{ |
|
|
|
width: 443px; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
} |
|
|
|
.wallet-choose{ |
|
|
|
font-size: 14px; |
|
|
|
color: #1E2226; |
|
|
|
@ -185,6 +326,7 @@ export default { |
|
|
|
.wallet-desc{ |
|
|
|
font-size: 12px; |
|
|
|
color: #8A9099; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
.wallet-item{ |
|
|
|
display: flex; |
|
|
|
@ -199,13 +341,14 @@ export default { |
|
|
|
box-sizing: border-box; |
|
|
|
|
|
|
|
.wallet-name{ |
|
|
|
color: #006AFF; |
|
|
|
color: #1E2226;; |
|
|
|
font-size: 14px; |
|
|
|
font-weight: bold; |
|
|
|
} |
|
|
|
.wallet-num{ |
|
|
|
font-size: 12px; |
|
|
|
color: #626573; |
|
|
|
padding: 0 2px; |
|
|
|
} |
|
|
|
.wallet-price{ |
|
|
|
font-size: 22px; |
|
|
|
@ -224,6 +367,9 @@ export default { |
|
|
|
width: 30px; |
|
|
|
height: 30px; |
|
|
|
} |
|
|
|
.wallet-name{ |
|
|
|
color: #006AFF; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.gap24 { |
|
|
|
@ -232,6 +378,7 @@ export default { |
|
|
|
align-items: stretch; |
|
|
|
} |
|
|
|
|
|
|
|
.buy-area{ |
|
|
|
.buy-btn{ |
|
|
|
font-size: 12px; |
|
|
|
width: 139px; |
|
|
|
@ -244,12 +391,69 @@ export default { |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
|
|
|
|
.buy-bonus{ |
|
|
|
position: relative; |
|
|
|
.buy-bonus-info{ |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
position: absolute; |
|
|
|
top:54px; |
|
|
|
left: 22px; |
|
|
|
width: 510px; |
|
|
|
gap: 3px; |
|
|
|
color: #626573; |
|
|
|
div{ |
|
|
|
width: calc(50% - 15px); |
|
|
|
gap: 7px; |
|
|
|
b{ |
|
|
|
padding: 0 4px; |
|
|
|
} |
|
|
|
.red{ |
|
|
|
background: linear-gradient(180deg, #DB4CBB 0%, #EB202C 100%); |
|
|
|
-webkit-background-clip: text; |
|
|
|
-webkit-text-fill-color: transparent; |
|
|
|
background-clip: text; |
|
|
|
text-fill-color: transparent; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.buy-desc{ |
|
|
|
font-size: 12px; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
color: #006AFF; |
|
|
|
} |
|
|
|
|
|
|
|
.buy-hr{ |
|
|
|
border: 1px dashed #BABDC2; |
|
|
|
margin: 32px 0; |
|
|
|
} |
|
|
|
|
|
|
|
.buy-info{ |
|
|
|
width: 552px; |
|
|
|
color: #8A9099; |
|
|
|
font-size: 12px; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
background: #F6F7FA; |
|
|
|
padding: 12px; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
gap: 12px; |
|
|
|
text-align: left; |
|
|
|
box-sizing: border-box; |
|
|
|
margin-top: 24px; |
|
|
|
.red{ |
|
|
|
color: #FF4D4F; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.money-header{ |
|
|
|
color: #626573; |
|
|
|
margin-left: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
::v-deep .el-form-item { |
|
|
|
margin: 0; |
|
|
|
|
