Skip to content

G
gxpt_wechat
Commit 3426f2fb by zhangzhen
Options

界面优化

parent 39a51a8d
Showing with 246 additions and 72 deletions
pages.json
...@@ -227,6 +227,13 @@ ...@@ -227,6 +227,13 @@
} }
}, },
{ {
"path" : "rule/vipRule",
"style": {
"navigationBarTitleText": "活动规则",
"enablePullDownRefresh" : false
}
},
{
"path" : "levelDetail/index", "path" : "levelDetail/index",
"style": { "style": {
"navigationBarTitleText": "会员等级详情", "navigationBarTitleText": "会员等级详情",
......
pages/vipCreate/vipCreate.vue
...@@ -102,24 +102,7 @@ ...@@ -102,24 +102,7 @@
</view> </view>
<view class="part-2"> <view class="part-2">
<image class="img-bg" :src="assetsPath+'/vip/qy_bg_1.png'" mode="widthFix"></image> <image class="img-bg" :src="assetsPath+'/vip/qy_bg_1.png'" mode="widthFix"></image>
<view class="absolute">
<view v-if="consumerMemberStatus" class="absolute">
<view class="flex-5">
<view class="flex-row">
<text class="text-1">次卡</text>
<text class="text-2">充值 畅玩无忧</text>
</view>
<text class="text-3">有效期：领取后1年内有效</text>
</view>
<view class="flex-3">
<view class="flex-col">
<text class="text-2">暂未上线</text>
<text class="text-2">敬请期待</text>
</view>
</view>
</view>
<view v-else class="absolute">
<view class="flex-5"> <view class="flex-5">
<view class="flex-row"> <view class="flex-row">
<text class="text-1">权益</text> <text class="text-1">权益</text>
...@@ -155,16 +138,62 @@ ...@@ -155,16 +138,62 @@
<text>我已阅读</text><text class="text-pink" <text>我已阅读</text><text class="text-pink"
@tap="onNavToRule2">用户充值协议</text><text>,并同意协议内容</text> @tap="onNavToRule2">用户充值协议</text><text>,并同意协议内容</text>
</view> </view>
<view class="bg-box-2">
<view class="flex-row-center title-content">
<view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view>
<view class="title-text">
<view class="text">
<text>权益会员专属活动</text>
</view> </view>
<view class="line">
</view>
</view>
<view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view> </view>
</view> </view>
<!-- <view class="active-bg">
<view class="prefer-box-list">
<view v-for="(item,k) in preferList" :key="k" class="list-item"
@tap="onNavToRule3(item)">
<image class="img" :src="item.iconUrl" mode="widthFix"></image>
<text class="text-title">{{item.title}}</text>
<text class="text-slogan">{{item.slogan}}</text>
</view>
</view>
<view class="look-prefer-nav" @tap="onNavToRule3">
<text class="text-title">点击可查看权益详情</text>
<image class="img" :src="assetsPath+'/vip/icon_right.png'" mode="widthFix"></image>
</view>
</view>
<view class="adorn-2">
<image class="img" :src="assetsPath+'/vip/adorn_2.png'" mode="widthFix"></image>
</view>
</view>
</view>
</view>
<view v-if="tabIndex ==1" class="active-bg" @tap="onTabChange(2)">
<image :src="assetsPath+'/vip/active_bg.png'" mode="widthFix"></image> <image :src="assetsPath+'/vip/active_bg.png'" mode="widthFix"></image>
</view> </view>
<view class="active-bg-2"> <view v-if="tabIndex ==1" class="banner-box">
<image :src="assetsPath+'/vip/banner2.png'" mode="widthFix"></image> <swiper class="banner-swiper" :indicator-dots="true" :circular="true" :autoplay="true"
</view> --> :duration="1000" :interval="3000" indicator-active-color="#FFD600" indicator-color="rgba(0,0,0,0.5)">
<swiper-item v-for="(item,k) in bannerList" :key="k">
<view class="banner-item" @tap="onNavTo(item)">
<image class="img-bg" :src="item.imgUrl" mode="scaleToFill"></image>
</view>
</swiper-item>
</swiper>
</view>
<view v-if="tabIndex ==1" class="flex-col"> <view v-if="tabIndex ==1" class="flex-col">
<button class="cu-btn confirm-btn" @tap="onNavToRecharge"> <button class="cu-btn confirm-btn" @tap="onNavToRecharge">
...@@ -179,23 +208,24 @@ ...@@ -179,23 +208,24 @@
</view> </view>
</view> </view>
<view v-if="tabIndex ==1" class="active-bg"> <!-- <view v-if="tabIndex ==1" class="active-bg">
<image :src="assetsPath+'/vip/active_bg.png'" mode="widthFix"></image> <image :src="assetsPath+'/vip/active_bg.png'" mode="widthFix"></image>
</view> </view>
<view v-if="tabIndex ==1" class="active-bg-2"> <view v-if="tabIndex ==1" class="active-bg-2">
<image :src="assetsPath+'/vip/banner2.png'" mode="widthFix"></image> <image :src="assetsPath+'/vip/banner2.png'" mode="widthFix"></image>
</view> </view> -->
<view v-if="tabIndex ==2" class="bg-box-1 margin-top"> <view v-if="tabIndex ==2" class="bg-box-1 margin-top">
<view class="bg-box-2"> <view class="bg-box-2">
<view class="flex-col list-box-2">
<view class="flex-row-center title-content"> <view class="flex-row-center title-content">
<view class="xx"> <view class="xx">
<image :src="assetsPath+'/xx.png'" mode="widthFix"></image> <image :src="assetsPath+'/xx.png'" mode="widthFix"></image>
</view> </view>
<view class="title-text"> <view class="title-text">
<view class="text"> <view class="text">
<text>权益会员专属活动</text> <text>次卡专属购</text>
</view> </view>
<view class="line"> <view class="line">
...@@ -206,26 +236,41 @@ ...@@ -206,26 +236,41 @@
</view> </view>
</view> </view>
<view class="prefer-box-list"> <view class="flex-row part-1">
<view v-for="(item,k) in preferList" :key="k" class="list-item" @tap="onNavToRule3(item)"> <view class="text-bg-1">
<image class="img" :src="item.iconUrl" mode="widthFix"></image> <text>专属</text>
<text class="text-title">{{item.title}}</text>
<text class="text-slogan">{{item.slogan}}</text>
</view> </view>
<text class="text-2">超值回馈!</text>
<text class="text-3">（权益会员独享）</text>
</view> </view>
<view class="look-prefer-nav" @tap="onNavToRule3"> <view class="part-2">
<text class="text-title">点击可查看权益详情</text> <image class="img-bg" :src="assetsPath+'/vip/qy_bg_1.png'" mode="widthFix"></image>
<image class="img" :src="assetsPath+'/vip/icon_right.png'" mode="widthFix"></image> <view class="absolute">
<view class="flex-5">
<view class="flex-row">
<text class="text-1">次卡</text>
<text class="text-2">充值 畅玩无忧</text>
</view>
<text class="text-3">有效期：领取后1年内有效</text>
</view>
<view class="flex-3">
<view class="flex-col">
<text class="text-2">暂未上线</text>
<text class="text-2">敬请期待</text>
</view>
</view>
</view> </view>
</view> </view>
<view class="adorn-1"> <view class="rule-tip">
<image class="img" :src="assetsPath+'/vip/adorn_1.png'" mode="widthFix"></image> <checkbox-group @change="onRuleTipChange">
<checkbox class='round yellow' :class="checked?'checked':''" :checked="checked"
value="checked" style="transform: scale(0.6);"></checkbox>
</checkbox-group>
<text>我已阅读</text><text class="text-pink" @tap="onNavToRule2">用户充值协议</text><text>, 并同意协议内容</text>
</view>
</view> </view>
<view class="adorn-2">
<image class="img" :src="assetsPath+'/vip/adorn_2.png'" mode="widthFix"></image>
</view> </view>
</view> </view>
</view> </view>
...@@ -366,8 +411,8 @@ ...@@ -366,8 +411,8 @@
<view class="share-qrcode"> <view class="share-qrcode">
<view class="qrcode-box"> <view class="qrcode-box">
<tki-qrcode ref="qrcode" :cid="cid" :val="text" :size="size" unit="upx" <tki-qrcode ref="qrcode" :cid="cid" :val="text" :size="size" unit="upx"
icon="../../static/logo_icon.png" :iconSize="iconSize" :onval="true" :loadMake="loadMake" icon="../../static/logo_icon.png" :iconSize="iconSize" :onval="true"
:showLoading="true" @result="qrR" /> :loadMake="loadMake" :showLoading="true" @result="qrR" />
</view> </view>
<view class="part-bottom"> <view class="part-bottom">
...@@ -442,67 +487,81 @@ ...@@ -442,67 +487,81 @@
iconUrl: config.assetsPath + "/vip/p_1.png", iconUrl: config.assetsPath + "/vip/p_1.png",
title: "会员价", title: "会员价",
slogan: "最低享98折", slogan: "最低享98折",
value:0 value: 0
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_2.png", iconUrl: config.assetsPath + "/vip/p_2.png",
title: "专属礼物", title: "专属礼物",
slogan: "好礼享不停", slogan: "好礼享不停",
value:1 value: 1
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_3.png", iconUrl: config.assetsPath + "/vip/p_3.png",
title: "会员日", title: "会员日",
slogan: "半价活动", slogan: "半价活动",
value:2 value: 2
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_4.png", iconUrl: config.assetsPath + "/vip/p_4.png",
title: "特定活动", title: "特定活动",
slogan: "免报名费", slogan: "免报名费",
value:3 value: 3
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_5.png", iconUrl: config.assetsPath + "/vip/p_5.png",
title: "邀请有礼", title: "邀请有礼",
slogan: "推荐返利", slogan: "推荐返利",
value:4 value: 4
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_6.png", iconUrl: config.assetsPath + "/vip/p_6.png",
title: "专享礼物", title: "专享礼物",
slogan: "一年使用期限", slogan: "一年使用期限",
value:5 value: 5
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_7.png", iconUrl: config.assetsPath + "/vip/p_7.png",
title: "专属客服", title: "专属客服",
slogan: "一对一服务", slogan: "一对一服务",
value:6 value: 6
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_9.png", iconUrl: config.assetsPath + "/vip/p_9.png",
title: "商城", title: "商城",
slogan: "会员折扣", slogan: "会员折扣",
value:7 value: 7
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_10.png", iconUrl: config.assetsPath + "/vip/p_10.png",
title: "次卡", title: "次卡",
slogan: "特惠购", slogan: "特惠购",
value:8 value: 8
}, },
{ {
iconUrl: config.assetsPath + "/vip/p_8.png", iconUrl: config.assetsPath + "/vip/p_8.png",
title: "联营开店", title: "联营开店",
slogan: "共享资源", slogan: "共享资源",
value:9 value: 9
} }
] ],
bannerList:[
{
imgUrl:config.assetsPath+'/banner/1.png',
routePath:''
},
{
imgUrl:config.assetsPath+'/banner/2.png',
routePath:''
},
{
imgUrl:config.assetsPath+'/banner/3.png',
routePath:'/pages/storeList/storeList'
},
],
}; };
}, },
onLoad(query) { onLoad(query) {
console.log(query,"页面传递过来的参数") console.log(query, "页面传递过来的参数")
if (query.q) { if (query.q) {
const q = decodeURIComponent(query.q) const q = decodeURIComponent(query.q)
let d = q.split('?') let d = q.split('?')
...@@ -512,7 +571,7 @@ ...@@ -512,7 +571,7 @@
let l = item.split('='); let l = item.split('=');
obj[l[0]] = l[1]; obj[l[0]] = l[1];
}) })
console.log(obj,"参数对象") console.log(obj, "参数对象")
if (obj.uid) { if (obj.uid) {
uni.setStorageSync("shareUserId", obj.uid) uni.setStorageSync("shareUserId", obj.uid)
this.tabIndex = 2 this.tabIndex = 2
...@@ -536,6 +595,13 @@ ...@@ -536,6 +595,13 @@
} }
}, },
methods: { methods: {
onNavTo(val){
if(val.routePath){
uni.navigateTo({
url:val.routePath
})
}
},
onConfirmPay() { onConfirmPay() {
if (this.tabIndex == 1) { if (this.tabIndex == 1) {
this.onCreateRecharge() this.onCreateRecharge()
...@@ -632,7 +698,7 @@ ...@@ -632,7 +698,7 @@
onNavToRule() { onNavToRule() {
uni.navigateTo({ uni.navigateTo({
url: "/setting/rule/rule?keyData=vip_user_rule" url: "/setting/rule/vipRule"
}) })
}, },
onNavToRule2() { onNavToRule2() {
...@@ -778,9 +844,9 @@ ...@@ -778,9 +844,9 @@
console.log(r, "二维码路径") console.log(r, "二维码路径")
this.qrPath = r; this.qrPath = r;
}, },
onShareByQrcode(){ onShareByQrcode() {
this.text = `https://www.coujio.com/vipShare?uid=${this.userInfo.id}&act=0`; this.text = `https://www.coujio.com/vipShare?uid=${this.userInfo.id}&act=0`;
console.log(this.text,"text") console.log(this.text, "text")
this.loadMake = true; this.loadMake = true;
this.$refs.popupShare.open() this.$refs.popupShare.open()
}, },
...@@ -857,7 +923,7 @@ ...@@ -857,7 +923,7 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 690upx; width: 690upx;
min-height: 496upx; min-height: 300upx;
background: #FFCA7E; background: #FFCA7E;
border-radius: 32upx; border-radius: 32upx;
padding: 6px 0; padding: 6px 0;
...@@ -972,9 +1038,7 @@ ...@@ -972,9 +1038,7 @@
padding: 0 1%; padding: 0 1%;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
// margin: 42upx 0; margin: 42upx 0;
.item { .item {
position: relative; position: relative;
display: flex; display: flex;
...@@ -1144,9 +1208,11 @@ ...@@ -1144,9 +1208,11 @@
align-items: center; align-items: center;
width: 90%; width: 90%;
margin-top: 24upx; margin-top: 24upx;
.part-2{
.part-2 {
align-items: center; align-items: center;
} }
.text-bg-1 { .text-bg-1 {
display: flex; display: flex;
justify-content: center; justify-content: center;
...@@ -1648,18 +1714,21 @@ ...@@ -1648,18 +1714,21 @@
} }
} }
.popup-box-share{ .popup-box-share {
width: 90vw; width: 90vw;
border-radius: 12upx; border-radius: 12upx;
overflow: hidden; overflow: hidden;
.popup-box-2{
.popup-box-2 {
background: #f1f1f1; background: #f1f1f1;
} }
.share-qrcode { .share-qrcode {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
width: 100%; width: 100%;
.qrcode-box { .qrcode-box {
background-color: #ffffff; background-color: #ffffff;
border-radius: 12upx; border-radius: 12upx;
...@@ -1667,6 +1736,7 @@ ...@@ -1667,6 +1736,7 @@
padding: 20upx; padding: 20upx;
margin-top: 24upx; margin-top: 24upx;
} }
.part-bottom { .part-bottom {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
...@@ -1698,5 +1768,23 @@ ...@@ -1698,5 +1768,23 @@
} }
} }
} }
.banner-box{
display: flex;
justify-content: center;
width: 100%;
margin: 24upx 0 10upx;
.banner-swiper{
height: 100px;
width: 100%;
.banner-item{
width: 700upx;
height: 100%;
margin: 0 auto;
.img-bg{
width: 100%;
height: 100%;
}
}
}
}
</style> </style>
\ No newline at end of file
setting/equityFundLog/index.vue
...@@ -45,17 +45,52 @@ ...@@ -45,17 +45,52 @@
<view class="flex-between padding-sm part-top"> <view class="flex-between padding-sm part-top">
<text class="text-title text-lg text-black">权益金入账信息</text> <text class="text-title text-lg text-black">权益金入账信息</text>
<view class="flex-row-center"> <!-- <view class="flex-row-center">
<button v-for="(item,k) in tabList" :key="k" class="cu-btn sm" :class="tabIndex ===k?'bg-blue':'bg-white'" @tap="onTabChange(k)">{{item.name}}</button> <button v-for="(item,k) in tabList" :key="k" class="cu-btn sm" :class="tabIndex ===k?'bg-blue':'bg-white'" @tap="onTabChange(k)">{{item.name}}</button>
</view> -->
</view>
<view v-if="tabIndex ==1 && list2.length" class="list-content">
<view v-for="(item,index) in list2" :key="index" class="list-item">
<view class="flex-between">
<view class="flex-row-center">
<text class="">待入账时间:</text>
<text class="margin-left">{{item.expireTime}}</text>
</view>
<view class="">
</view>
</view>
<view class="flex-between">
<text class="">待入账金额:</text>
<text class="text-pink text-bold text-lg">￥{{item.equityFund}}</text>
</view>
<view class="flex-between">
<text class="">说明:</text>
<text class="text-black"><text
class="text-bold">{{item.newNickName || '凑角用户'}}_{{item.phone4Last}}</text>进行<text
class="text-bold">{{equityFundTypeEnum[item.equityFundType||'2']}}</text></text>
</view>
<view class="flex-between">
<view class="flex-row-center">
<text class="">创建时间:</text>
<text class="margin-left">{{item.createTime}}</text>
</view>
<view class="">
</view>
</view> </view>
</view> </view>
<view class="list-content"> </view>
<view v-else-if="tabIndex != 1 && list.length " class="list-content">
<view v-for="(item,index) in list" :key="index" class="list-item" @tap="onNavToOrderInfo(item)"> <view v-for="(item,index) in list" :key="index" class="list-item" @tap="onNavToOrderInfo(item)">
<view class="flex-between"> <view class="flex-between">
<view class="flex-row-center"> <view class="flex-row-center">
<text class="">入账时间:</text> <text class="">入账日期:</text>
<text class="margin-left">{{item.createTime}}</text> <text class="margin-left">{{item.createTime}}</text>
</view> </view>
<view class=""> <view class="">
...@@ -64,7 +99,7 @@ ...@@ -64,7 +99,7 @@
</view> </view>
<view class="flex-between"> <view class="flex-between">
<text class="">金额:</text> <text class="">已入账金额:</text>
<text class="text-pink text-bold text-lg">￥{{item.equityFund}}</text> <text class="text-pink text-bold text-lg">￥{{item.equityFund}}</text>
</view> </view>
...@@ -123,6 +158,7 @@ ...@@ -123,6 +158,7 @@
nomoreText: '到底啦', nomoreText: '到底啦',
statusIndex: 0, statusIndex: 0,
list: [], list: [],
list2:[],
assetsPath: config.assetsPath, assetsPath: config.assetsPath,
scrollTop: 0, scrollTop: 0,
queryParams: { queryParams: {
...@@ -282,17 +318,17 @@ ...@@ -282,17 +318,17 @@
}) })
if (this.queryParams.pageNum === 1) { if (this.queryParams.pageNum === 1) {
this.list = list this.list2 = list
} else { } else {
this.list.push(...list); this.list2.push(...list);
} }
if (this.list.length < res.data.total) { if (this.list2.length < res.data.total) {
this.status = "loadmore" this.status = "loadmore"
} else { } else {
this.status = "nomore" this.status = "nomore"
} }
console.log(this.list2,99999999999)
} else if (res.data.code == 401) { } else if (res.data.code == 401) {
this.loginStatus = false this.loginStatus = false
} }
......
setting/rule/vipRule.vue 0 → 100644
<template>
<view class="article">
<image class="img" :src="assetsPath+'/vip_rule.png'" mode="widthFix"></image>
</view>
</template>
<script>
import config from "@/config/index.config";
export default {
data() {
return {
assetsPath: config.assetsPath,
article: {
protocolTitle: '',
content: '',
},
keyData: ""
};
},
onLoad(option) {
},
methods: {
}
}
</script>
<style>
</style>
<style lang="scss">
.article {
display: flex;
flex-direction: column;
align-items: center;
width: 100vw;
.img{
width: 100%;
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment