bztang
/
bztang-h5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

重构：文创管理中心相关内容

This commit is contained in:
wuhui_zzw 2023-12-02 09:01:14 +08:00
parent 0de52b524d
commit 748878e194
11 changed files with 1190 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/weight_value/cultural_space/1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
src/assets/images/weight_value/cultural_space/2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

BIN
src/assets/images/weight_value/cultural_space/3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

BIN
src/assets/images/weight_value/cultural_space/4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

BIN
src/assets/images/weight_value/cultural_space/5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB

27
src/router/index.js
View File

@ -10449,6 +10449,33 @@ const routes = [
foot: true
}
},
{
path: "/member/legumes/withdrawal_record",
name: "legumes_center_withdrawal_record",
component:()=>import("../views/member/weight_value/legumes/withdrawal_record"),
meta: {
title: "消费增值",
foot: true
},
},
{
path: "/member/legumes/record_list",
name: "legumes_center_record_list",
component:()=>import("../views/member/weight_value/legumes/record_list"),
meta: {
title: "",
foot: true
},
},
{
path: "/member/legumes/record_list_details",
name: "legumes_center_record_list_details",
component:()=>import("../views/member/weight_value/legumes/record_list_details"),
meta: {
title: "结算详情",
foot: true
}
},
// 典藏室
{
path: "/member/collection_room",

169
src/views/member/weight_value/home.vue
View File

@ -11,43 +11,74 @@
<div class="user_id" v-if="page_params.content_type == 'cultural_space'">{{ user.team_dividend ? user.team_dividend.cultural_level_name : 'ID：' + user.uid }}</div>
<div class="user_id" v-else>{{ user.team_dividend ? user.team_dividend.level_name : 'ID：' + user.uid }}</div>
</div>
<!--可提现金额&团队人数-->
<div class="money-and-team box-item">
<div class="team-block" @click="goToPage('withdrawal')">
<div class="team-block-title">
可提现(元)<i class="fa fa-angle-right"></i>
<!-- 文创空间内容 -->
<template v-if="page_params.content_type === 'cultural_space'">
<!-- 团队总人数&团队总业绩 -->
<div class="money-and-team box-item">
<div class="team-block">
<div class="team-block-title">我的邀请</div>
<div class="team-block-money">{{ one_team_total }}</div>
</div>
<div class="team-block">
<div class="team-block-title">我的业绩</div>
<div class="team-block-money">{{ statistics.area_performance ? statistics.area_performance.num : '0.00' }}</div>
</div>
<div class="team-block-money">{{ income }}</div>
</div>
<div class="team-block" @click="goToPage('myRelationship')">
<div class="team-block-title">
团队总数<i class="fa fa-angle-right"></i>
<!--我的收入-->
<div class="my-income box-item">
<div class="income-top">
<div class="left-title">我的收入</div>
<div class="right-btn" @click="goToPage('withdrawal')">去易出<i class="fa fa-angle-right"></i></div>
</div>
<div class="team-block-money">{{ team_total }}</div>
</div>
</div>
<!--统计信息-->
<div class="statistics box-item">
<!--顶部内容-->
<div class="statistics-top">
<div class="top-block">
<div class="top-title">累计收入(元)</div>
<div class="top-income">{{ total_income }}</div>
</div>
<div class="top-block">
<div class="top-title" @click="goToPage('incomedetails')">
收入明细<i class="fa fa-angle-right"></i>
<div class="income-list">
<div class="income-list-block" v-for="(item,index) in income_list" :key="index" @click="goToPage(item.path_name,{},item.query)">
<div class="block-title">{{ item.title }}</div>
<div class="block-desc">{{ item.sub_title }}</div>
<img class="block-icon" :src="require('../../../assets/images/weight_value/cultural_space/' + item.icon)" />
</div>
</div>
</div>
<!--统计列表-->
<div class="statistic-list">
<div class="list-box" v-for="(item,index) in statistics" :key="index" @click="detailsGoToPage(item)">
<div class="box-title">{{ item.title }}</div>
<div class="box-num">{{ item.num }}</div>
</template>
<!--代理商中心内容-->
<template v-else>
<!--可提现金额&团队人数-->
<div class="money-and-team box-item">
<div class="team-block" @click="goToPage('withdrawal')">
<div class="team-block-title">
可提现(元)<i class="fa fa-angle-right"></i>
</div>
<div class="team-block-money">{{ income }}</div>
</div>
<div class="team-block" @click="goToPage('myRelationship')">
<div class="team-block-title">
团队总数<i class="fa fa-angle-right"></i>
</div>
<div class="team-block-money">{{ team_total }}</div>
</div>
</div>
</div>
<!--统计信息-->
<div class="statistics box-item">
<!--顶部内容-->
<div class="statistics-top">
<div class="top-block">
<div class="top-title">累计收入(元)</div>
<div class="top-income">{{ total_income }}</div>
</div>
<div class="top-block">
<div class="top-title" @click="goToPage('incomedetails')">
收入明细<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
<!--统计列表-->
<div class="statistic-list">
<div class="list-box" v-for="(item,index) in statistics" :key="index" @click="detailsGoToPage(item)">
<div class="box-title">{{ item.title }}</div>
<div class="box-num">{{ item.num }}</div>
</div>
</div>
</div>
</template>
<!--常用工具-->
<div class="tool-title">常用工具</div>
<div class="tool-content box-item">
@ -84,6 +115,7 @@ export default {
income: 0,
total_income: 0,
team_total: 0,
one_team_total: 0,
// 常用工具列表
cultural_space_tool_list: [
{ title: '我的客户', sub_title: '团队客户明细', icon: '003.png', path_name: 'myRelationship' },
@ -107,7 +139,14 @@ export default {
},
// 请求link
request_link: '',
poster_id: 0
poster_id: 0,
// 我的收入 生态发展收益=分销商直推奖（文创空间）、ecological
income_list: [
{title: '消费增值', sub_title: '查看文创豆收益', icon: '1.png', path_name: 'legumes_center_withdrawal_record', query: {} },
{title: '生态发展收益', sub_title: '好友购买得奖励', icon: '2.png', path_name: 'legumes_center_record_list', query: { type_name: 'ecological' } },
{title: '贡献分红', sub_title: '贡献值分红', icon: '3.png', path_name: 'legumes_center_record_list', query: { type_name: 'contribution' } },
{title: '股权收益', sub_title: '懂事参与分股权', icon: '4.png', path_name: 'legumes_center_record_list', query: { type_name: 'shareholding' } },
]
};
},
activated() {
@ -151,6 +190,7 @@ export default {
_this.income = data.income;
_this.total_income = data.total_income;
_this.team_total = data.team_total;
_this.one_team_total = data.one_team_total || 0;
_this.poster_id = data.poster_id || 0;
_this.is_show = true;
@ -247,6 +287,8 @@ export default {
);
},
}
};
</script>
@ -312,6 +354,73 @@ export default {
color: #ffffff;
}
}
// 我的收入
.my-income{
.income-top{
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: space-between;
height: 35px;
margin-bottom: 10px;
.left-title{
font-weight: bold;
font-size: 15px;
}
.right-btn{
background: linear-gradient(90deg, #f4cc84, #fadeac);
height: 24px;
line-height: 24px;
font-size: 13px;
padding: 0 10px;
border-radius: 30px;
i{
margin-left: 5px!important;
}
}
}
.income-list{
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
.income-list-block{
width: calc((100% - 10px) / 2);
height: 70px;
background: #f2ede7;// #f2ede7
border-radius: 5px;
position: relative;
padding: 10px 0 0 10px;
overflow: hidden;
margin-bottom: 10px;
.block-title{
width: 100%;
text-align: left;
font-size: 15px;
color: #714f3b;
}
.block-desc{
width: 100%;
text-align: left;
font-size: 11px;
color: #a7a9b1;
}
.block-icon{
position: absolute;
right: 0;
bottom: 0;
height: 45px;
}
}
.income-list-block:nth-last-child(3) ~ div {
margin-bottom: 0!important;
}
}
}
// 可提现金额&团队人数
.money-and-team {
display: inline-flex;

419
src/views/member/weight_value/legumes/record_list.vue Normal file
View File

@ -0,0 +1,419 @@
<template>
<div>
<c-title :hide="false" :text="page_params.type_name ? title_list[page_params.type_name] : ''" tolink="detailed"></c-title>
<div class="content-box">
<!--顶部内容-->
<div class="top-info">
<div class="top-info-content" v-if="page_params.type_name == 'ecological'">
<div class="hold-info">
<div class="hold-num">{{ info.share_reward }}</div>
<div class="hold-desc" @click="goToPage('weight_value_detailed',{},{key_name: 'share_reward',content_type: 'cultural_space'})">分享奖励明细<i class="fa fa-angle-right"></i></div>
</div>
<div class="statistics-list">
<div class="statistics-block" @click="goToPage('weight_value_detailed',{},{key_name: 'service_income',content_type: 'cultural_space'})">
<div class="b-num">{{ info.service_income }}</div>
<div class="b-title">生态服务<i class="fa fa-angle-right" style="margin-left: 5px;"></i></div>
</div>
<div class="statistics-block" @click="goToPage('weight_value_detailed',{},{key_name: 'contribution_income',content_type: 'cultural_space'})">
<div class="b-num">{{ info.contribution_income }}</div>
<div class="b-title">生态贡献<i class="fa fa-angle-right" style="margin-left: 5px;"></i></div>
</div>
<div class="statistics-block">
<div class="b-num">{{ info.commission }}</div>
<div class="b-title">总服务费</div>
</div>
</div>
</div>
<div class="top-info-content" v-else-if="page_params.type_name == 'contribution'">
<div class="hold-info">
<div class="hold-num">{{ info.contribution_bonus }}</div>
<div class="hold-desc" @click="goToPage('weight_value_detailed',{},{key_name: 'contribution_bonus',content_type: 'cultural_space'})">股权收益明细<i class="fa fa-angle-right"></i></div>
</div>
<div class="statistics-list">
<div class="statistics-block">
<div class="b-num">{{ info.contribution_bonus_undrawn }}</div>
<div class="b-title">可易出收益</div>
</div>
<div class="statistics-block">
<div class="b-num">{{ info.contribution_bonus_withdrawn }}</div>
<div class="b-title">已易出收益</div>
</div>
<div class="statistics-block">
<div class="b-num">{{ info.poundage }}</div>
<div class="b-title">总服务费</div>
</div>
</div>
</div>
<div class="top-info-content" v-else-if="page_params.type_name == 'shareholding'">
<div class="hold-info">
<div class="hold-num">1123.01</div>
<div class="hold-desc">股权收益明细<i class="fa fa-angle-right"></i></div>
</div>
<div class="statistics-list">
<div class="statistics-block">
<div class="b-num">901</div>
<div class="b-title">可易出收益</div>
</div>
<div class="statistics-block">
<div class="b-num">218</div>
<div class="b-title">已易出收益</div>
</div>
<div class="statistics-block">
<div class="b-num">84</div>
<div class="b-title">总服务费</div>
</div>
</div>
</div>
</div>
<!--明细-->
<div class="details-content">
<div class="title-box">易出明细</div>
<div class="record-list">
<template v-if="page_params.type_name == 'ecological'">
<div class="record-block" v-for="(item,index) in list" :key="index" @click="goToPage('legumes_center_record_list_details',{},{ withdraw_id: item.id })">
<div class="info">
<div class="record-top-info">
<div class="top-info-left">
<div class="remark">易出</div>
<div v-if="item.status == 0" class="status status-examine">审核中</div>
<div v-if="item.status == 1" class="status status-examine">待打款</div>
<div v-else-if="item.status == 2" class="status status-examine">已打款</div>
<div v-else-if="item.status == 3" class="status">已驳回</div>
</div>
<div class="change-num">-{{ item.amounts }}</div>
</div>
<div class="footer-info">
<div class="footer-info-box">{{ item.created_at }}</div>
<div class="footer-info-box">实际到账：{{ item.actual_amounts }}</div>
<div class="footer-info-box">服务费：{{ item.poundage }}</div>
</div>
</div>
<i class="fa fa-angle-right"></i>
</div>
</template>
<template v-else-if="page_params.type_name == 'contribution'">
<div class="record-block" v-for="(item,index) in list" :key="index" @click="goToPage('legumes_center_record_list_details',{},{ withdraw_id: item.id })">
<div class="info">
<div class="record-top-info">
<div class="top-info-left">
<div class="remark">易出</div>
<div v-if="item.status == 0" class="status status-examine">审核中</div>
<div v-if="item.status == 1" class="status status-examine">待打款</div>
<div v-else-if="item.status == 2" class="status status-examine">已打款</div>
<div v-else-if="item.status == 3" class="status">已驳回</div>
</div>
<div class="change-num">-{{ item.amounts }}</div>
</div>
<div class="footer-info">
<div class="footer-info-box">{{ item.created_at }}</div>
<div class="footer-info-box">实际到账：{{ item.actual_amounts }}</div>
<div class="footer-info-box">服务费：{{ item.poundage }}</div>
</div>
</div>
<i class="fa fa-angle-right"></i>
</div>
</template>
<template v-else-if="page_params.type_name == 'shareholding'">
<div class="record-block" v-for="(item,index) in list" :key="index" @click="goToPage('legumes_center_record_list_details',{},{ withdraw_id: item.id })">
<div class="info">
<div class="record-top-info">
<div class="top-info-left">
<div class="remark">易出</div>
<div v-if="item.status == 0" class="status status-examine">审核中</div>
<div v-if="item.status == 1" class="status status-examine">待打款</div>
<div v-else-if="item.status == 2" class="status status-examine">已打款</div>
<div v-else-if="item.status == 3" class="status">已驳回</div>
</div>
<div class="change-num">-{{ item.amounts }}</div>
</div>
<div class="footer-info">
<div class="footer-info-box">{{ item.created_at }}</div>
<div class="footer-info-box">实际到账：{{ item.actual_amounts }}</div>
<div class="footer-info-box">服务费：{{ item.poundage }}</div>
</div>
</div>
<i class="fa fa-angle-right"></i>
</div>
</template>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
components:{},
data() {
return {
page_params: {},
title_list: {
ecological: '生态发展收益',
contribution: '贡献分红',
shareholding: '股权收益',
},
info: {},
// 分页信息
list: [],
isLoadMore: true,
page: 1,
total_page: 0,
};
},
mounted() {
let _this = this;
_this.page_params = Object.assign(_this.$route.params, _this.$route.query);
if(!_this.page_params.type_name || _this.page_params.type_name == undefined){
_this.$dialog.alert({message:`非法请求，不明确的查看类型？`}).then(()=>{
_this.$router.push(_this.fun.getUrl('weight_value_home',{},{ content_type: 'cultural_space' }));
});
}else{
this.getStatistics();
this.getList();
}
},
methods: {
// 数据获取
getStatistics() {
let _this = this;
let params = {
type_name: _this.page_params.type_name
};
$http.get('plugin.cultural-space.api.index.getPublicStatistics', params, "加载中...").then((res) => {
if (parseInt(res.result) === 1) {
_this.info = res.data;
}
}).catch((error) => {});
},
// 列表获取
getList() {
let _this = this;
let params = {
page: _this.page,
type_name: _this.page_params.type_name
};
$http.post('plugin.cultural-space.api.index.getPublicList', params, "加载中...")
.then(response => {
if (response.result === 1) {
_this.isLoadMore = true;
let data = response.data;
if(parseInt(data.current_page) === 1){
_this.total_page = data.last_page;
_this.list = data.data;
}else{
if(Object.values(data.data).length > 0) _this.list = Object.values(_this.list).concat(Object.values(data.data));
}
} else {
_this.isLoadMore = false; // 防止多次请求分页数据
_this.list = [];
}
})
.catch(error => {
console.log(error);
});
},
// 分页获取数据
getMoreData() {
let _this = this;
if (!_this.isLoadMore) return;
_this.isLoadMore = false; // 防止多次请求分页数据
if (_this.page >= _this.total_page) {
return;
} else {
_this.page += 1;
_this.getList();
}
},
// 跳转页面
goToPage(key, params = {}, query = {}) {
if(key) this.$router.push(this.fun.getUrl(key, params, query));
},
}
};
</script>
<style lang="scss" scoped>
.content-box {
width: 100%;
min-height: calc(100vh - 40px);
background: #f2f2f2;
.top-info {
background: linear-gradient(180deg, #cdb38c, #e4d3b5) no-repeat;
background-size: 100% 90px;
padding: 10px;
.top-info-content {
background: #FFFFFF;
border-radius: 5px;
padding: 10px;
.hold-info {
width: 100%;
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: flex-start;
justify-content: center;
height: 70px;
border-bottom: 1px solid f2f2f2;
.hold-num {
font-size: 25px;
font-weight: bold;
}
.hold-desc {
color: #828485;
font-size: 13px;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
height: 20px;
i {
margin-left: 5px;
}
}
}
.statistics-list {
width: 100%;
height: 70px;
overflow: hidden;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
align-items: center;
.statistics-block {
.b-num {
font-size: 17px;
color: #262626;
}
.b-title {
font-size: 12px;
color: #848682;
}
}
}
}
}
.details-content {
padding: 0 10px;
margin-top: 10px;
.title-box {
width: 100%;
padding: 0 10px;
height: 30px;
font-size: 18px;
font-weight: bold;
color: #252925;
text-align: left;
}
.record-list {
width: 100%;
background: #FFFFFF;
border-radius: 10px;
padding: 10px;
.record-block {
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
.info {
width: calc(100% - 30px) !important;
height: 55px;
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: flex-start;
justify-content: space-evenly;
.record-top-info {
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
width: 100%;
.top-info-left {
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
.remark {
font-size: 14px;
font-weight: bold;
}
.status {
background: #e7f1ff;
height: 18px;
line-height: 18px;
padding: 0 5px;
font-size: 10px;
margin-left: 7px;
}
.status-examine {
color: #317aee;
}
.status-complete {
color: #40b72b;
}
}
.change-num {
}
}
.footer-info {
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
width: 100%;
font-size: 12px;
color: #919191;
.footer-info-box {
}
}
}
i {
width: 30px;
}
}
.record-block:not(:last-child) {
border-bottom: 1px solid #f2f2f2;
padding-bottom: 10px;
}
.record-block:not(:first-child) {
padding-top: 10px;
}
}
}
}
</style>

215
src/views/member/weight_value/legumes/record_list_details.vue Normal file
View File

@ -0,0 +1,215 @@
<template>
<div>
<c-title :hide="false" :text="'结算详情'" tolink="detailed"></c-title>
<div class="content-box">
<div class="bg-content"></div>
<div class="main-content">
<div class="top-content">
<div class="left-icon">
<span class="left-icon-drop"></span>
<span class="left-icon-drop"></span>
<span class="left-icon-drop"></span>
</div>
<div class="right-text" v-if="info.status == 0">
<div class="status">审核中</div>
<div class="status-desc">您提交的结算正在进行审核</div>
</div>
<div class="right-text" v-if="info.status == 1">
<div class="status">待打款</div>
<div class="status-desc">您提交的结算已通过审核，正在打款！</div>
</div>
<div class="right-text" v-if="info.status == 2">
<div class="status">已打款</div>
<div class="status-desc">您提交的结算已审核通过并且打款</div>
</div>
<div class="right-text" v-if="info.status == 3">
<div class="status">已驳回</div>
<div class="status-desc">您提交的结算已驳回</div>
</div>
</div>
<div class="form-content">
<div class="form-block">
<div class="form-label">申请易出</div>
<div class="form-value">{{ info.amounts || '' }}</div>
</div>
<div class="form-block">
<div class="form-label">服务费</div>
<div class="form-value">¥{{ info.poundage || '' }}</div>
</div>
<div class="form-block">
<div class="form-label">预计到账金额</div>
<div class="form-value">¥{{ info.actual_amounts || '' }}</div>
</div>
<div class="form-block">
<div class="form-label">到账银行卡</div>
<div class="form-value">{{ info.card_num ? info.card_num : '' }}</div>
</div>
<div class="form-block">
<div class="form-label">预计到账时间</div>
<div class="form-value">{{ info.expected_receipt_time || '' }}</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
components:{},
data() {
return {
page_params: {},
info: {},
};
},
mounted() {
let _this = this;
_this.page_params = Object.assign(_this.$route.params, _this.$route.query);
_this.getData();
},
methods: {
// 获取用户持有文创豆信息
getData() {
let _this = this;
$http.get("plugin.cultural-space.api.index.getPublicDetails", { withdraw_id: _this.page_params.withdraw_id }, "加载中...")
.then(response => {
if (response.result === 1) {
_this.info = response.data || {};
} else {
_this.$dialog.alert({message: response.msg}).then(() => {
_this.$router.push(_this.fun.getUrl('home'));
});
}
})
.catch(error => {
console.log(error);
});
},
}
};
</script>
<style lang="scss" scoped>
::v-deep .page-header-title {
.van-nav-bar__content {
background: #fecb32 !important;
}
.van-button::before {
background: #fecb32 !important;
}
.van-button {
background: #fecb32 !important;
}
}
.content-box {
width: 100%;
min-height: calc(100vh - 40px);
position: relative;
.bg-content {
width: 100%;
height: 230px;
border-radius: 300px / 0 0 30px 30px;
background: #fecb32;
}
.main-content {
position: absolute;
top: 0px;
left: 0;
width: 100%;
padding: 15px;
.top-content {
padding-left: 15px;
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
height: 60px;
margin: 20px 0 10px 0;
.left-icon {
width: 35px;
height: 35px;
border-radius: 50%;
border: 2px solid #120d14;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-evenly;
align-items: center;
.left-icon-drop {
background: #120d14;
width: 4px;
height: 4px;
display: inline-block;
border-radius: 50%;
}
}
.right-text {
height: 100%;
padding-left: 10px;
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: flex-start;
justify-content: space-evenly;
color: #120d14;
.status {
font-size: 18px;
font-weight: bold;
}
.status-desc {
font-size: 14px;
font-weight: bold;
}
}
}
.form-content {
padding: 15px;
box-shadow: 0px 2px 5px #eaebe7;
width: 100%;
background: #ffffff;
border-radius: 10px;
.form-block {
width: 100%;
height: 50px;
font-size: 15px;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
.form-label {
width: 110px;
text-align: left;
color: #6a6a6a;
}
.form-value {
color: #111111;
}
}
.form-block:not(:last-child) {
border-bottom: 1px solid #e7e7e7;
}
}
}
}
</style>

10
src/views/member/weight_value/legumes/withdrawal_details.vue
View File

@ -10,10 +10,18 @@
<span class="left-icon-drop"></span>
<span class="left-icon-drop"></span>
</div>
<div class="right-text">
<div class="right-text" v-if="info.status == 0">
<div class="status">审核中</div>
<div class="status-desc">您提交的结算正在进行审核</div>
</div>
<div class="right-text" v-if="info.status == 2">
<div class="status">已驳回</div>
<div class="status-desc">您提交的结算已驳回。{{ info.reject_reason }}</div>
</div>
<div class="right-text" v-if="info.status == 3">
<div class="status">已打款</div>
<div class="status-desc">您提交的结算已审核通过并且打款</div>
</div>
</div>
<div class="form-content">
<div class="form-block">

381
src/views/member/weight_value/legumes/withdrawal_record.vue Normal file
View File

@ -0,0 +1,381 @@
<template>
<div>
<c-title :hide="false" :text="'消费增值'" tolink="detailed"></c-title>
<div class="content-box">
<!--顶部内容-->
<div class="top-info">
<div class="statistics">
<div class="statistics-list">
<div class="statistics-block">
<div class="b-num">{{ info.voucher_number || 0 }}</div>
<div class="b-title">可易出文创豆</div>
</div>
<div class="statistics-block">
<div class="b-num">{{ info.goods_legumes || 0 }}</div>
<div class="b-title">兑换额度</div>
</div>
<div class="statistics-block">
<div class="b-num">{{ info.fund_num || 0 }}</div>
<div class="b-title">共享基金</div>
</div>
</div>
<div class="top-bg-line"></div>
<div class="hold">
<div class="left-info">
<div class="hold-num">{{ info.total_get }}</div>
<div class="hold-sub-title" @click="goToPage('weight_value_detailed',{},{key_name: 'legumes',content_type: 'cultural_space'})">
文创豆明细<i class="fa fa-angle-right"></i>
</div>
</div>
<img class="block-icon" src="@/assets/images/weight_value/cultural_space/5.png" />
</div>
</div>
</div>
<!--明细-->
<div class="details-content">
<div class="title-box">
<div class="left-title">易出明细</div>
<div class="right-info">已易出文创豆：{{ info.withdrawal_total_num || 0 }}</div>
</div>
<div class="record-list">
<div class="record-block" v-for="(item,index) in list" :key="index" @click="goToPage('legumes_center_withdrawal_details', { },{ legumes_withdrawal_id: item.id })">
<div class="info">
<div class="record-top-info">
<div class="top-info-left">
<div class="remark">易出</div>
<div v-if="item.status == 0" class="status status-examine">审核中</div>
<div v-else-if="item.status == 2" class="status">已驳回</div>
<div v-else-if="item.status == 3" class="status status-examine">已打款</div>
</div>
<div class="change-num">-{{ item.withdrawal_total_num }}</div>
</div>
<div class="footer-info">
<div class="footer-info-box">{{ item.created_at }}</div>
<div class="footer-info-box">实际到账：{{ item.reality_amount }}</div>
<div class="footer-info-box">服务费：{{ item.commission_num }}</div>
</div>
</div>
<i class="fa fa-angle-right"></i>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { scrollMixin } from "utils/mixin";
export default {
mixins: [scrollMixin],
components:{},
data() {
return {
info: {},
// 分页信息
list: [],
isLoadMore: true,
page: 1,
total_page: 0,
page_params: {},
};
},
mounted() {
this.getStatistics();
this.getList();
},
methods: {
// 数据获取
getStatistics() {
let _this = this;
$http.get('plugin.cultural-space.api.legumes.get-statistics', {}, "加载中...").then((res) => {
if (parseInt(res.result) === 1) {
_this.info = res.data;
}
}).catch((error) => {});
},
// 列表获取
getList() {
let _this = this;
let params = {
page: _this.page
};
$http.post('plugin.cultural-space.api.legumes.withdrawal-record', params, "加载中...")
.then(response => {
if (response.result === 1) {
_this.isLoadMore = true;
let data = response.data;
if(parseInt(data.current_page) === 1){
_this.total_page = data.last_page;
_this.list = data.data;
}else{
if(Object.values(data.data).length > 0) _this.list = Object.values(_this.list).concat(Object.values(data.data));
}
} else {
_this.isLoadMore = false; // 防止多次请求分页数据
_this.list = [];
}
})
.catch(error => {
console.log(error);
});
},
// 分页获取数据
getMoreData() {
let _this = this;
if (!_this.isLoadMore) return;
_this.isLoadMore = false; // 防止多次请求分页数据
if (_this.page >= _this.total_page) {
return;
} else {
_this.page += 1;
_this.getList();
}
},
// 跳转页面
goToPage(key, params = {}, query = {}) {
if(key) this.$router.push(this.fun.getUrl(key, params, query));
},
}
};
</script>
<style lang="scss" scoped>
::v-deep .page-header-title {
.van-nav-bar__content {
background: #fecc34 !important;
}
.van-button::before {
background: #fecc34 !important;
}
.van-button {
background: #fecc34 !important;
}
}
.content-box {
width: 100%;
min-height: calc(100vh - 40px);
background: #f2f2f2;
.top-info {
background: linear-gradient(180deg, #fecc34, #fae7b7);
padding: 15px;
box-shadow: 0 10px 20px 20px #fae7b7;
.statistics {
background: #fef8e1;
width: 100%;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
position: relative;
margin-top: 60px;
.statistics-list {
width: 100%;
overflow: hidden;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
align-items: center;
padding: 35px 10px 20px 10px;
.statistics-block {
.b-num {
font-size: 17px;
color: #262626;
}
.b-title {
font-size: 12px;
color: #848682;
}
}
}
.top-bg-line {
background: #fde9b3;
width: 100%;
height: 25px;
border-radius: 30px;
position: absolute;
top: -10px;
left: 0;
}
.hold {
--left-and-right-distance-: 15px;
width: calc(100% - var(--left-and-right-distance-));
height: 80px;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
padding: 0 10px;
position: absolute;
top: -65px;
left: calc(var(--left-and-right-distance-) / 2);
background: #FFFFFF;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
.left-info {
height: 80px;
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
align-items: flex-start;
.hold-num {
font-size: 23px;
font-weight: bold;
color: #232527;
}
.hold-sub-title {
font-size: 12px;
color: #898989;
i {
margin-left: 5px;
}
}
}
.block-icon {
height: 80px;
margin: 0 !important;
padding: 0 !important;
}
}
}
}
.details-content {
padding: 0 10px;
margin-top: 10px;
.title-box {
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: baseline;
padding: 0 10px;
height: 30px;
.left-title {
font-size: 18px;
font-weight: bold;
color: #252925;
}
.right-info {
font-size: 13px;
color: #91918d;
}
}
.record-list {
width: 100%;
background: #FFFFFF;
border-radius: 10px;
padding: 10px;
.record-block {
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
.info {
width: calc(100% - 30px) !important;
height: 55px;
display: inline-flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: flex-start;
justify-content: space-evenly;
.record-top-info {
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
width: 100%;
.top-info-left {
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
.remark {
font-size: 14px;
font-weight: bold;
}
.status {
background: #e7f1ff;
height: 18px;
line-height: 18px;
padding: 0 5px;
font-size: 10px;
margin-left: 7px;
}
.status-examine {
color: #317aee;
}
.status-complete {
color: #40b72b;
}
}
.change-num {
}
}
.footer-info {
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
width: 100%;
font-size: 12px;
color: #919191;
.footer-info-box {
}
}
}
i {
width: 30px;
}
}
.record-block:not(:last-child) {
border-bottom: 1px solid #f2f2f2;
padding-bottom: 10px;
}
.record-block:not(:first-child) {
padding-top: 10px;
}
}
}
}
</style>