qianggou
/
uniapp
forked from zhongyuanhaiju/uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化：发布商品弹框添加服务费、实际收入、建议售价显示

This commit is contained in:
wuhui_zzw 2023-03-04 11:42:52 +08:00
parent 3dbb3102ea
commit 9455e4b5ad
4 changed files with 350 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
pages.json
View File

@ -1058,6 +1058,15 @@
// #endif
"navigationBarTitleText": "消息中心"
}
},
{
"path": "message/list",
"style": {
// #ifdef H5
"navigationStyle": "custom",
// #endif
"navigationBarTitleText": "消息列表"
}
}
]
},

89
pages_promotion/futures/order_details.vue
View File

@ -24,6 +24,14 @@
<view class="left">订单金额</view>
<view class="right right-price">￥{{ info.unit_price }}元</view>
</view>
<view class="info-list-block">
<view class="left">服务费</view>
<view class="right right-price">{{ info.service_price }}</view>
</view>
<view class="info-list-block">
<view class="left">实际收入</view>
<view class="right right-price">{{ info.real_income }}</view>
</view>
<view class="info-list-block">
<view class="left">订单编号<text class="copy-buttons" @click="$util.copy(info.order_no)">复制</text></view>
<view class="right">{{ info.order_no }}</view>
@ -60,6 +68,20 @@
<i class="icondiy icon-system-guanbi" @click="$refs.saleGoods.close()"></i>
</view>
</view>
<view class="transfer-info">
<view class="transfer-info-block">
<view class="info-title">服务费</view>
<view class="info-content">{{ service_charge }}</view>
</view>
<view class="transfer-info-block">
<view class="info-title">实际收入</view>
<view class="info-content">{{ real_income }}</view>
</view>
<view class="transfer-info-block">
<view class="info-title">建议售价</view>
<view class="info-content">{{ price_range.max_price }}</view>
</view>
</view>
<view class="transfer-price">
<view>请输入转售价格：</view>
<view>
@ -110,8 +132,10 @@ export default {
7 : '捡漏',
},
price_range: {},
transfer_price: 0.00,
split_message: '',
transfer_price: 0.00,// 转售价格
split_message: '',// 拆单确认信息
service_charge: 0.00, // 手续费
real_income: 0.00,// 实际收入
};
},
mixins: [],
@ -158,8 +182,11 @@ export default {
let maxPrice = unitPrice * (parseFloat(this.price_range.max) / 100);
this.price_range.min_price = (parseFloat(unitPrice) + parseFloat(minPrice)).toFixed(2);
this.price_range.max_price = (parseFloat(unitPrice) + parseFloat(maxPrice)).toFixed(2);
this.transfer_price = this.price_range.max_price;
this.transfer_price = this.price_range.max_price;// 默认 当前售价为最高价格
// 计算手续费
this.service_charge = (this.transfer_price * (parseFloat(res.data.service_price) / 100)).toFixed(2);
// 计算实际收入
this.real_income = (parseFloat(this.transfer_price) - parseFloat(this.service_charge)).toFixed(2);
}
}
});
@ -435,6 +462,54 @@ export default {
}
}
}
.transfer-info{
width: 100%;
padding: 10px 0;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: center;
justify-content: space-around;
align-items: center;
.transfer-info-block{
width: calc(100% / 3);
display: inline-flex;
flex-direction: column;
justify-content: center;
align-items: center;
flex-wrap: nowrap;
align-content: center;
.info-title{
font-size: 30rpx;
color: #9f9d9e;
}
.info-content{
font-size: 30rpx;
font-weight: bold;
}
}
.transfer-info-block:nth-of-type(1){
.info-content{
color: #ac736e;
}
}
.transfer-info-block:nth-of-type(2){
.info-content{
color: #ac736e;
}
}
.transfer-info-block:nth-of-type(3){
.info-content{
color: #d39a63;
}
}
}
.transfer-price-tips{
font-size: 24rpx;
height: 40rpx;
line-height: 30rpx;
color: #b5b2b3;
}
.transfer-price{
display: inline-flex;
width: 100%;
@ -450,12 +525,6 @@ export default {
height: 60rpx;
}
}
.transfer-price-tips{
font-size: 24rpx;
height: 40rpx;
line-height: 30rpx;
color: #b5b2b3;
}
.transfer-price-button{
width: 100%;
display: inline-flex;

137
pages_promotion/message/index.vue
View File

@ -9,7 +9,11 @@
<view class="message-content">
<!--顶部标题-->
<view class="titles">
<view class="titles-block" v-for="(item,index) in titles" :key="index">
<view class="titles-block"
v-for="(item,index) in titles"
:key="index"
@click="$util.redirectTo('/pages_promotion/message/list', { message_type: item.type })"
>
<view class="titles-block-icon">
<image class="top-image" :src="$util.img(item.icon)" mode="widthFix"></image>
</view>
@ -17,13 +21,14 @@
</view>
</view>
<!--消息列表-->
<mescroll-uni ref="mescroll" @getData="getList" top="350">
<mescroll-uni ref="mescroll" @getData="getList" top="320">
<block slot="list">
<view class="message-list">
<view class="message-block" v-for="(item,index) in list" :key="index">
<view class="message-block-top">
<view class="message-block-top-image">
<image class="top-image" :src="$util.img('public/static/img/message/business.png')" mode="widthFix"></image>
<text class="top-drop"></text>
</view>
<view class="message-block-top-title">交易信息</view>
</view>
@ -32,7 +37,9 @@
</view>
<view class="message-block-bottom">
<view class="message-block-bottom-left">查看详情</view>
<view class="message-block-bottom-right">2023-02-27 10:45</view>
<view class="message-block-bottom-right">
2023-02-27 10:45<i class="icondiy icon-system-arrow-right-s-line"></i>
</view>
</view>
</view>
</view>
@ -52,16 +59,12 @@ export default {
return {
// 顶部标题
titles:[
{ title: '交易信息', icon: 'public/static/img/message/business.png' },
{ title: '系统消息', icon: 'public/static/img/message/system.png' },
{ title: '通知消息', icon: 'public/static/img/message/notice.png' },
{ title: '留言反馈', icon: 'public/static/img/message/words.png' },
{ title: '交易信息', type: 'business', icon: 'public/static/img/message/business.png' },
{ title: '系统消息', type: 'system', icon: 'public/static/img/message/system.png' },
{ title: '通知消息', type: 'notice', icon: 'public/static/img/message/notice.png' },
{ title: '留言反馈', type: 'words', icon: 'public/static/img/message/words.png' },
],
list: [],
};
},
components: {},
@ -73,7 +76,7 @@ export default {
if (!uni.getStorageSync('token')) this.$refs.login.open('/pages_promotion/message/index');
},
methods: {
// 获取消息列表 todo:这里是订单列表 修改修改为消息列表
// 获取消息列表 todo:这里是订单列表 修改为消息列表
getList(mescroll) {
this.$api.sendRequest({
url: '/futures/api/futures/myList',
@ -106,10 +109,6 @@ export default {
},
onBackPress(options) {
if (options.from === 'navigateBack') return false;
@ -121,7 +120,7 @@ export default {
<style lang="scss" scoped>
.message-index{
background-color: #f0a71d;
background-color: #f5f5f5;
min-height: 100vh;
.top{
@ -133,11 +132,10 @@ export default {
}
}
.message-content{
padding: 30rpx;
padding: 0 30rpx 30rpx 30rpx;
width: calc(100% - (30rpx * 2));
position: absolute;
top: 90rpx;
.titles{
width: calc(100% - (20rpx * 2));
display: inline-flex;
@ -166,29 +164,96 @@ export default {
.titles-block-title{}
}
}
.message-list{
padding:0 20rpx;
background-color: red;
padding:0 30rpx;
.message-block{
background: #fff;
border-radius: 20rpx;
padding: 30rpx 30rpx 20rpx 30rpx;
margin-bottom: 30rpx;
.message-block-top{
--top-height--: 60rpx;
height: var(--top-height--);
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
.message-block-top-image{
height: var(--top-height--);
width: var(--top-height--);
position: relative;
.top-image{
width: 100% !important;
height: 100% !important;
}
.top-drop{
position: absolute;
top: 0;
right: 4rpx;
width: 10rpx;
height: 10rpx;
background: #fb3146;
border-radius: 50%;
border: 2rpx solid #f6e1e8;
}
}
.message-block-top-title{
font-size: 32rpx;
font-weight: bold;
color: #353535;
margin-left: 20rpx;
}
}
.message-block-message{
height: 80rpx;
line-height: 40rpx;
font-size: 28rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin: 20rpx 0;
color: #828282;
}
.message-block-bottom{
display: inline-flex;
width: 100%;
height: 60rpx;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: flex-end;
padding-top: 10rpx;
border-top: 2rpx solid #ededed;
.message-block-bottom-left{
font-size: 28rpx;
height: 60rpx;
line-height: 60rpx;
}
.message-block-bottom-right{
height: 60rpx;
line-height: 60rpx;
font-size: 26rpx;
color: #bababa;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-end;
align-items: baseline;
i{
height: 60rpx;
line-height: 60rpx;
font-size: 32rpx;
}
}
}
}
}
}
}
</style>

161
pages_promotion/message/list.vue Normal file
View File

@ -0,0 +1,161 @@
<template>
<page-meta :page-style="themeColor"></page-meta>
<view class="message-list-content">
<!-- 列表内容 -->
<mescroll-uni ref="mescroll" @getData="getList" top="0">
<block slot="list">
<view class="message-list">
<view class="message-block" v-for="(item,index) in list" :key="index">
<view class="message-block-top">
<view class="message-block-top-image">
<image class="top-image" :src="$util.img(type_info.icon)" mode="widthFix"></image>
</view>
<view class="message-block-top-title">{{ type_info.title }}</view>
</view>
<view class="message-block-message">
消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容消息内容
</view>
<view class="message-block-bottom">2023-02-27 10:45</view>
</view>
</view>
</block>
</mescroll-uni>
<!--登录弹框-->
<ns-login ref="login"></ns-login>
<!--加载动画-->
<loading-cover ref="loadingCover"></loading-cover>
</view>
</template>
<script>
export default {
data() {
return {
list: [],
// 类型信息
message_type: 'business',
type_info: {},
types: {
business: {title: '交易信息', type: 'business', icon: 'public/static/img/message/business.png'},
system: {title: '系统消息', type: 'system', icon: 'public/static/img/message/system.png'},
notice: {title: '通知消息', type: 'notice', icon: 'public/static/img/message/notice.png'},
words: {title: '留言反馈', type: 'words', icon: 'public/static/img/message/words.png'},
},
};
},
components: {},
mixins: [],
onLoad(option) {
this.message_type = option.message_type || 'business';
// 获取页面标题
this.type_info = this.types[this.message_type];
uni.setNavigationBarTitle({
title: this.type_info.title
});
},
onShow() {},
onReady(){
// 判断是否登录
if (!uni.getStorageSync('token')) this.$refs.login.open('/pages_promotion/futures/list');
},
methods: {
// 获取消息列表 todo:这里是订单列表 修改为消息列表
getList(mescroll) {
this.$api.sendRequest({
url: '/futures/api/futures/myList',
data: {
page: mescroll.num || 1,
page_size: mescroll.size || 10,
status: this.tabs_active,
},
success: res => {
if(parseInt(res.code) === 0){
mescroll.endSuccess(Object.keys(res.data.list).length);
//设置列表数据
if (parseInt(mescroll.num) === 1){
this.list = []; //如果是第一页需手动制空列表
}
this.list = this.list.concat(res.data.list); //追加新数据
}else {
this.msg = res.message;
}
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
},
fail: res => {
mescroll.endErr();
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
}
});
},
},
onBackPress(options) {
if (options.from === 'navigateBack') return false;
this.$util.redirectTo('/pages/member/index');
return true;
}
};
</script>
<style lang="scss" scoped>
.message-list-content{
background-color: #f5f5f5;
min-height: 100vh;
.message-list{
padding:30rpx;
.message-block{
background: #fff;
border-radius: 20rpx;
padding: 30rpx 30rpx 20rpx 30rpx;
margin-bottom: 30rpx;
.message-block-top{
--top-height--: 60rpx;
height: var(--top-height--);
width: 100%;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
.message-block-top-image{
height: var(--top-height--);
width: var(--top-height--);
position: relative;
.top-image{
width: 100% !important;
height: 100% !important;
}
}
.message-block-top-title{
font-size: 32rpx;
font-weight: bold;
color: #353535;
margin-left: 20rpx;
}
}
.message-block-message{
line-height: 40rpx;
font-size: 28rpx;
margin: 20rpx 0;
color: #828282;
}
.message-block-bottom{
height: 60rpx;
line-height: 60rpx;
font-size: 26rpx;
color: #bababa;
display: inline-flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-end;
align-items: baseline;
}
}
}
}
</style>