我们发布啦

This commit is contained in:
张乐
2020-08-13 16:12:57 +08:00
parent a3e1c38d27
commit c0cec49f41
1885 changed files with 376936 additions and 2 deletions

View File

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,312 @@
<template>
<view>
<form @submit="formSubmit" report-submit='true'>
<view class='evaluate-con'>
<view class='goodsStyle acea-row row-between'>
<view class='pictrue'>
<image :src='productInfo.image'></image>
</view>
<view class='text acea-row row-between'>
<view class='name line2'>{{productInfo.store_name}}</view>
<view class='money'>
<view>{{productInfo.price}}</view>
<view class='num'>x{{cart_num}}</view>
</view>
</view>
</view>
<view class='score'>
<view class='item acea-row row-middle' v-for="(item,indexw) in scoreList" :key="indexw">
<view>{{item.name}}</view>
<view class='starsList'>
<text @click="stars(indexn, indexw)" v-for="(itemn, indexn) in item.stars" :key="indexn" class='iconfont' :class="item.index >= indexn? 'icon-shitixing font-color':'icon-kongxinxing'"></text>
</view>
<text class='evaluate'>{{item.index === -1 ? "" : item.index + 1 + "分"}}</text>
</view>
<view class='textarea'>
<textarea placeholder='商品满足你的期待么?说说你的想法,分享给想买的他们吧~' name="comment" placeholder-class='placeholder'></textarea>
<view class='list acea-row row-middle'>
<view class='pictrue' v-for="(item,index) in picsPath" :key="index">
<image :src='item'></image>
<text class='iconfont icon-guanbi1 font-color' @click='DelPic(index)'></text>
</view>
<view class='pictrue acea-row row-center-wrapper row-column' @click='uploadpic' v-if="picsPath.length < 8">
<text class='iconfont icon-icon25201'></text>
<view>上传图片</view>
</view>
</view>
</view>
<button class='evaluateBnt bg-color' formType="submit">立即评价</button>
</view>
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
orderProduct,
orderComment
} from '@/api/order.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
pics: [],
picsPath: [],
scoreList: [{
name: "商品质量",
stars: ["", "", "", "", ""],
index: -1
},
{
name: "服务态度",
stars: ["", "", "", "", ""],
index: -1
}
],
orderId: '',
productId: 0, //产品id
evaluateId: 0, //评价id
unique: '',
productInfo: {},
cart_num: 0,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
id: 0//订单id
};
},
computed: mapGetters(['isLogin']),
onLoad(options) {
if (!options.unique || !options.uni || !options.id) return this.$util.Tips({
title: '缺少参数'
}, {
tab: 3,
url: 1
});
this.unique = options.unique;
this.orderId = options.uni;
this.id = options.id;
this.evaluateId = options.id;
if (this.isLogin) {
this.getOrderProduct();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
onLoadFun() {
this.getOrderProduct();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取某个产品详情
*
*/
getOrderProduct: function() {
let that = this;
orderProduct({
orderId: that.id,
uni: that.unique
}).then(res => {
that.$set(that, 'productInfo', res.data.productInfo);
that.$set(that, 'cart_num', res.data.cartNum);
that.$set(that, 'productId', res.data.productId);
});
},
stars: function(indexn, indexw) {
this.scoreList[indexw].index = indexn;
},
/**
* 删除图片
*
*/
DelPic: function(index) {
let that = this,
pic = this.picsPath[index];
that.picsPath.splice(index, 1);
that.$set(that, 'picsPath', that.picsPath);
},
/**
* 上传文件
*
*/
uploadpic: function() {
let that = this;
that.$util.uploadImageOne({
url: 'user/upload/image',
name: 'multipart',
model: "product",
pid: 1
}, function(res) {
that.pics.push(res.data.url);
that.picsPath.push(res.data.localPath);
that.$set(that, 'pics', that.pics);
that.$set(that, 'picsPath', that.picsPath);
});
},
/**
* 立即评价
*/
formSubmit: function(e) {
let formId = e.detail.formId,
value = e.detail.value,
that = this,
product_score = that.scoreList[0].index + 1 === 0 ? "" : that.scoreList[0].index + 1,
service_score = that.scoreList[1].index + 1 === 0 ? "" : that.scoreList[1].index + 1;
if (!value.comment) return that.$util.Tips({
title: '请填写你对宝贝的心得!'
});
value.productScore = product_score;
value.serviceScore = service_score;
console.log("that.pics");
let aa = JSON.stringify(that.pics);
console.log(typeof aa);
value.pics = JSON.stringify(that.pics);
value.productId = that.productId;
value.oid = that.evaluateId;
value.unique = that.unique;
uni.showLoading({
title: "正在发布评论……"
});
orderComment(value).then(res => {
uni.hideLoading();
return that.$util.Tips({
title: '感谢您的评价!',
icon: 'success'
}, '/pages/order_details/index?order_id=' + that.orderId);
}).catch(err => {
uni.hideLoading();
return that.$util.Tips({
title: err
});
});
}
}
}
</script>
<style lang="scss" scoped>
.evaluate-con .score {
background-color: #fff;
border-top: 1rpx solid #f5f5f5;
font-size: 28rpx;
color: #282828;
padding: 48rpx 30rpx 65rpx 30rpx;
}
.evaluate-con .score .item~.item {
margin-top: 30rpx;
}
.evaluate-con .score .item .starsList {
padding: 0 35rpx 0 40rpx;
}
.evaluate-con .score .item .starsList .iconfont {
font-size: 40rpx;
color: #aaa;
}
.evaluate-con .score .item .starsList .iconfont~.iconfont {
margin-left: 20rpx;
}
.evaluate-con .score .item .evaluate {
color: #aaa;
font-size: 24rpx;
}
.evaluate-con .score .textarea {
width: 690rpx;
background-color: #fafafa;
border-radius: 10rpx;
margin-top: 48rpx;
}
.evaluate-con .score .textarea textarea {
font-size: 28rpx;
padding: 38rpx 30rpx 0 30rpx;
width: 100%;
box-sizing: border-box;
height: 160rpx;
}
.evaluate-con .score .textarea .placeholder {
color: #bbb;
}
.evaluate-con .score .textarea .list {
margin-top: 25rpx;
padding-left: 5rpx;
}
.evaluate-con .score .textarea .list .pictrue {
width: 140rpx;
height: 140rpx;
margin: 0 0 35rpx 25rpx;
position: relative;
font-size: 22rpx;
color: #bbb;
}
.evaluate-con .score .textarea .list .pictrue:nth-last-child(1) {
border: 1rpx solid #ddd;
box-sizing: border-box;
}
.evaluate-con .score .textarea .list .pictrue image {
width: 100%;
height: 100%;
border-radius: 3rpx;
}
.evaluate-con .score .textarea .list .pictrue .icon-guanbi1 {
font-size: 45rpx;
position: absolute;
top: -20rpx;
right: -20rpx;
}
.evaluate-con .score .textarea .list .pictrue .icon-icon25201 {
color: #bfbfbf;
font-size: 50rpx;
}
.evaluate-con .score .evaluateBnt {
font-size: 30rpx;
color: #fff;
width: 690rpx;
height: 86rpx;
border-radius: 43rpx;
text-align: center;
line-height: 86rpx;
margin-top: 45rpx;
}
</style>

View File

@@ -0,0 +1,137 @@
<template>
<view>
<view class='evaluate-list'>
<view class='generalComment acea-row row-between-wrapper'>
<view class='acea-row row-middle font-color'>
<view class='evaluate'>评分</view>
<view class='start' :class="'star'+Math.round((replyData.replyChance)*5)"></view>
</view>
<view><text class='font-color'>{{(replyData.replyChance)*100}}%</text>好评率</view>
</view>
<view class='nav acea-row row-middle'>
<view class='item' :class='type==0 ? "bg-color":""' @click='changeType(0)'>全部({{replyData.sumCount}})</view>
<view class='item' :class='type==1 ? "bg-color":""' @click='changeType(1)'>好评({{replyData.goodCount}})</view>
<view class='item' :class='type==2 ? "bg-color":""' @click='changeType(2)'>中评({{replyData.inCount}})</view>
<view class='item' :class='type==3 ? "bg-color":""' @click='changeType(3)'>差评({{replyData.poorCount}})</view>
</view>
<userEvaluation :reply="reply"></userEvaluation>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
</view>
<view class='noCommodity' v-if="!replyData.sumCount && page > 1">
<view class='pictrue'>
<image src='/images/noEvaluate.png'></image>
</view>
</view>
</view>
</template>
<script>
import {
getReplyList,
getReplyConfig
} from '@/api/store.js';
import userEvaluation from '@/components/userEvaluation';
export default {
components: {
userEvaluation
},
data() {
return {
replyData: {},
product_id: 0,
reply: [],
type: 0,
loading: false,
loadend: false,
loadTitle: '加载更多',
page: 1,
limit: 20
};
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
let that = this;
if (!options.product_id) return that.$util.Tips({
title: '缺少参数'
}, {
tab: 3,
url: 1
});
that.product_id = options.product_id;
},
onShow: function() {
this.getProductReplyCount();
this.getProductReplyList();
},
methods: {
/**
* 获取评论统计数据
*
*/
getProductReplyCount: function() {
let that = this;
getReplyConfig(that.product_id).then(res => {
that.$set(that,'replyData',res.data);
});
},
/**
* 分页获取评论
*/
getProductReplyList: function() {
let that = this;
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
that.loadTitle = '';
getReplyList(that.product_id, {
page: that.page,
limit: that.limit,
type: that.type,
}).then(res => {
let list = res.data.list,
loadend = list.length < that.limit;
that.reply = that.$util.SplitArray(list, that.reply);
that.$set(that,'reply',that.reply);
that.loading = false;
that.loadend = loadend;
that.loadTitle = loadend ? "😕人家是有底线的~~" : "加载更多";
that.page = that.page + 1;
}).catch(err => {
that.loading = false,
that.loadTitle = '加载更多'
});
},
/*
* 点击事件切换
* */
changeType: function(e) {
let type = parseInt(e);
if (type == this.type) return;
this.type = type;
this.page = 1;
this.loadend = false;
this.$set(this,'reply',[]);
this.getProductReplyList();
}
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
this.getProductReplyList();
},
}
</script>
<style lang="scss">
page{background-color:#fff;}
.evaluate-list .generalComment{height:94rpx;padding:0 30rpx;margin-top:1rpx;background-color:#fff;font-size:28rpx;color:#808080;}
.evaluate-list .generalComment .evaluate{margin-right:7rpx;}
.evaluate-list .nav{font-size:24rpx;color:#282828;padding:0 30rpx 32rpx 30rpx;background-color:#fff;border-bottom:1rpx solid #f5f5f5;}
.evaluate-list .nav .item{font-size:24rpx;color:#282828;border-radius:6rpx;height:54rpx;padding:0 20rpx;background-color:#f4f4f4;line-height:54rpx;margin-right:17rpx;}
.evaluate-list .nav .item.bg-color{color:#fff;}
</style>

View File

@@ -0,0 +1,250 @@
<template>
<div>
<div class="storeBox" ref="container">
<div class="storeBox-box" v-for="(item, index) in storeList" :key="index" @click.stop="checked(item)">
<div class="store-img"><img :src="item.image" lazy-load="true" /></div>
<div class="store-cent-left">
<div class="store-name">{{ item.name }}</div>
<div class="store-address line1">
{{ item.address }}{{ ", " + item.detailedAddress }}
</div>
</div>
<div class="row-right">
<div>
<a class="store-phone" :href="'tel:' + item.phone"><span class="iconfont icon-dadianhua01"></span></a>
</div>
<div class="store-distance" @click.stop="showMaoLocation(item)">
<span class="addressTxt" v-if="item.range">距离{{ item.range }}千米</span>
<span class="addressTxt" v-else>查看地图</span>
<span class="iconfont icon-youjian"></span>
</div>
</div>
</div>
<Loading :loaded="loaded" :loading="loading"></Loading>
</div>
<div>
<iframe v-if="locationShow && !isWeixin" ref="geoPage" width="0" height="0" frameborder="0" style="display:none;"
scrolling="no" :src="
'https://apis.map.qq.com/tools/geolocation?key=' +
mapKey +
'&referer=myapp'
">
</iframe>
</div>
</div>
</template>
<script>
import Loading from "@/components/Loading";
import {
storeListApi
} from "@/api/store";
import {
isWeixin
} from "@/utils/index";
// #ifdef H5
import {
wechatEvevt,
wxShowLocation
} from "@/libs/wechat";
// #endif
import {
mapGetters
} from "vuex";
// import cookie from "@/utils/store/cookie";
const LONGITUDE = "user_longitude";
const LATITUDE = "user_latitude";
const MAPKEY = "mapKey";
export default {
name: "storeList",
components: {
Loading
},
// computed: mapGetters(["goName"]),
data() {
return {
page: 1,
limit: 20,
loaded: false,
loading: false,
storeList: [],
system_store: {},
// mapKey: cookie.get(MAPKEY),
locationShow: false,
user_latitude: 0,
user_longitude: 0
};
},
onLoad() {
try {
this.user_latitude = uni.getStorageSync('user_latitude');
this.user_longitude = uni.getStorageSync('user_longitude');
} catch (e) {
// error
}
},
mounted() {
if (this.user_latitude && this.user_longitude) {
this.getList();
} else {
this.selfLocation();
}
// this.$scroll(this.$refs.container, () => {
// !this.loading && this.getList();
// });
},
methods: {
selfLocation() {
let self = this
uni.getLocation({
type: 'wgs84',
success: function(res) {
try {
uni.setStorageSync('user_latitude', res.latitude);
uni.setStorageSync('user_longitude', res.longitude);
} catch {}
self.getList();
},
complete:function() {
self.getList();
}
});
},
showMaoLocation(e) {
uni.openLocation({
latitude: Number(e.latitude),
longitude: Number(e.longitude),
success: function() {
console.log('success');
Number
}
});
},
// 选中门店
checked(e) {
uni.$emit("handClick", {
address: e
});
uni.navigateBack();
// if (this.goName === "orders") {
// this.$store.commit("GET_STORE", e);
// this.$router.go(-1); //返回上一层
// }
},
// 获取门店列表数据
getList: function() {
if (this.loading || this.loaded) return;
this.loading = true;
let data = {
latitude: this.user_latitude || "", //纬度
longitude: this.user_longitude || "", //经度
page: this.page,
limit: this.limit
};
storeListApi(data)
.then(res => {
this.loading = false;
this.loaded = res.data.list.length < this.limit;
this.storeList.push.apply(this.storeList, res.data.list);
this.page = this.page + 1;
})
.catch(err => {
this.$dialog.error(err.msg);
});
}
},
onReachBottom() {
this.getList();
}
};
</script>
<style>
.geoPage {
position: fixed;
width: 100%;
height: 100%;
top: 0;
z-index: 10000;
}
.storeBox {
width: 100%;
background-color: #fff;
padding: 0 30rpx;
}
.storeBox-box {
width: 100%;
height: auto;
display: flex;
align-items: center;
padding: 23rpx 0;
justify-content: space-between;
border-bottom: 1px solid #eee;
}
.store-cent {
display: flex;
align-items: center;
width: 80%;
}
.store-cent-left {
width: 45%;
}
.store-img {
width: 120rpx;
height: 120rpx;
border-radius: 6rpx;
margin-right: 22rpx;
}
.store-img img {
width: 100%;
height: 100%;
}
.store-name {
color: #282828;
font-size: 30rpx;
margin-bottom: 22rpx;
font-weight: 800;
}
.store-address {
color: #666666;
font-size: 24rpx;
}
.store-phone {
width: 50rpx;
height: 50rpx;
color: #fff;
border-radius: 50%;
display: block;
text-align: center;
line-height: 50rpx;
background-color: #e83323;
margin-bottom: 22rpx;
}
.store-distance {
font-size: 22rpx;
color: #e83323;
}
.iconfont {
font-size: 20rpx;
}
.row-right {
display: flex;
flex-direction: column;
align-items: flex-end;
width: 33.5%;
}
</style>

View File

@@ -0,0 +1,279 @@
<template>
<view>
<view class='logistics'>
<view class='header acea-row row-between row-top'>
<view class='pictrue'>
<image :src='product.productInfo.image'></image>
</view>
<view class='text acea-row row-between'>
<view class='name line2'>{{product.productInfo.storeName}}</view>
<view class='money'>
<view>{{product.truePrice}}</view>
<view>x{{product.cartNum}}</view>
</view>
</view>
</view>
<view class='logisticsCon'>
<view class='company acea-row row-between-wrapper'>
<view class='picTxt acea-row row-between-wrapper'>
<view class='iconfont icon-wuliu'></view>
<view class='text'>
<view><text class='name line1'>物流公司</text> {{orderInfo.deliveryName}}</view>
<view class='express line1'><text class='name'>快递单号</text> {{orderInfo.deliveryId}}</view>
</view>
</view>
<!-- #ifndef H5 -->
<view class='copy' @tap='copyOrderId'>复制单号</view>
<!-- #endif -->
<!-- #ifdef H5 -->
<view class='copy copy-data' :data-clipboard-text="orderInfo.deliveryId">复制单号</view>
<!-- #endif -->
</view>
<view class='item' v-for="(item,index) in expressList" :key="index">
<view class='circular' :class='index === 0 ? "on":""'></view>
<view class='text' :class='index===0 ? "on-font on":""'>
<view>{{item.status}}</view>
<view class='data' :class='index===0 ? "on-font on":""'>{{item.time}}</view>
</view>
</view>
</view>
<recommend :hostProduct='hostProduct' v-if="hostProduct.length"></recommend>
</view>
<!-- #ifdef MP -->
<authorize :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
express
} from '@/api/order.js';
import {
getProductHot
} from '@/api/store.js';
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import recommend from '@/components/recommend';
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
recommend,
// #ifdef MP
authorize
// #endif
},
data() {
return {
orderId: '',
product: {
productInfo: {}
},
orderInfo: {},
expressList: [],
hostProduct: []
};
},
computed: mapGetters(['isLogin']),
onLoad: function (options) {
if (!options.orderId) return this.$util.Tips({title:'缺少订单号'});
this.orderId = options.orderId;
if (this.isLogin) {
this.getExpress();
this.get_host_product();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true);
// #endif
}
},
onReady: function() {
// #ifdef H5
this.$nextTick(function() {
const clipboard = new ClipboardJS(".copy-data");
clipboard.on("success", () => {
this.$util.Tips({
title: '复制成功'
});
});
});
// #endif
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.getExpress();
this.get_host_product();
},
copyOrderId:function(){
uni.setClipboardData({ data: this.orderInfo.deliveryId });
},
getExpress:function(){
let that=this;
express(that.orderId).then(function(res){
let result = res.data.express|| {};
that.$set(that,'product',res.data.order.cartInfo[0] || {});
that.$set(that,'orderInfo',res.data.order);
that.$set(that,'expressList',result.list || []);
});
},
/**
* 获取我的推荐
*/
get_host_product: function () {
let that = this;
getProductHot().then(function (res) {
that.$set(that,'hostProduct',res.data.list);
});
},
}
}
</script>
<style scoped lang="scss">
.logistics .header {
padding: 23rpx 30rpx;
background-color: #fff;
height: 166rpx;
box-sizing: border-box;
}
.logistics .header .pictrue {
width: 120rpx;
height: 120rpx;
}
.logistics .header .pictrue image {
width: 100%;
height: 100%;
border-radius: 6rpx;
}
.logistics .header .text {
width: 540rpx;
font-size: 28rpx;
color: #999;
margin-top: 6rpx;
}
.logistics .header .text .name {
width: 365rpx;
color: #282828;
}
.logistics .header .text .money {
text-align: right;
}
.logistics .logisticsCon {
background-color: #fff;
margin: 12rpx 0;
}
.logistics .logisticsCon .company {
height: 120rpx;
margin: 0 0 45rpx 30rpx;
padding-right: 30rpx;
border-bottom: 1rpx solid #f5f5f5;
}
.logistics .logisticsCon .company .picTxt {
width: 520rpx;
}
.logistics .logisticsCon .company .picTxt .iconfont {
width: 50rpx;
height: 50rpx;
background-color: #666;
text-align: center;
line-height: 50rpx;
color: #fff;
font-size: 35rpx;
}
.logistics .logisticsCon .company .picTxt .text {
width: 450rpx;
font-size: 26rpx;
color: #282828;
}
.logistics .logisticsCon .company .picTxt .text .name {
color: #999;
}
.logistics .logisticsCon .company .picTxt .text .express {
margin-top: 5rpx;
}
.logistics .logisticsCon .company .copy {
font-size: 20rpx;
width: 106rpx;
height: 40rpx;
text-align: center;
line-height: 40rpx;
border-radius: 3rpx;
border: 1rpx solid #999;
}
.logistics .logisticsCon .item {
padding: 0 40rpx;
position: relative;
}
.logistics .logisticsCon .item .circular {
width: 20rpx;
height: 20rpx;
border-radius: 50%;
position: absolute;
top: -1rpx;
left: 31.5rpx;
background-color: #ddd;
}
.logistics .logisticsCon .item .circular.on {
background-color: #e93323;
}
.logistics .logisticsCon .item .text.on-font {
color: #e93323;
}
.logistics .logisticsCon .item .text .data.on-font {
color: #e93323;
}
.logistics .logisticsCon .item .text {
font-size: 26rpx;
color: #666;
width: 615rpx;
border-left: 1rpx solid #e6e6e6;
padding: 0 0 60rpx 38rpx;
}
.logistics .logisticsCon .item .text.on {
border-left-color: #f8c1bd;
}
.logistics .logisticsCon .item .text .data {
font-size: 24rpx;
color: #999;
margin-top: 10rpx;
}
.logistics .logisticsCon .item .text .data .time {
margin-left: 15rpx;
}
</style>

View File

@@ -0,0 +1,205 @@
<template>
<view>
<form @submit="subRefund" report-submit='true'>
<view class='apply-return'>
<view class='goodsStyle acea-row row-between' v-for="(item,index) in orderInfo.cartInfo" :key="index">
<view class='pictrue'><image :src='item.info.productInfo.image'></image></view>
<view class='text acea-row row-between'>
<view class='name line2'>{{item.info.productInfo.storeName}}</view>
<view class='money' v-if="item.info.productInfo.attrInfo">
<view>{{item.info.productInfo.attrInfo.price}}</view>
<view class='num'>x{{item.info.cartNum}}</view>
</view>
<view class='money' v-else>
<view>{{item.info.productInfo.price}}</view>
<view class='num'>x{{item.info.cartNum}}</view>
</view>
</view>
</view>
<view class='list'>
<view class='item acea-row row-between-wrapper'>
<view>退货件数</view>
<view class='num'>{{orderInfo.totalNum}}</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>退款金额</view>
<view class='num'>{{orderInfo.payPrice}}</view>
</view>
<view class='item acea-row row-between-wrapper' @tap="toggleTab('region')">
<view>退款原因</view>
<picker class='num' @change="bindPickerChange" :value="index" :range="RefundArray">
<view class="picker acea-row row-between-wrapper">
<view class='reason'>{{RefundArray[index]}}</view>
<text class='iconfont icon-jiantou'></text>
</view>
</picker>
</view>
<view class='item textarea acea-row row-between'>
<view>备注说明</view>
<textarea placeholder='填写备注信息100字以内' class='num' name="refund_reason_wap_explain" placeholder-class='填写备注信息100字以内'></textarea>
</view>
<view class='item acea-row row-between'>
<view class='title acea-row row-between-wrapper'>
<view>上传凭证</view>
<view class='tip'>( 最多可上传3张 )</view>
</view>
<view class='upload acea-row row-middle'>
<view class='pictrue' v-for="(item,index) in refund_reason_wap_imgPath" :key="index">
<image :src='item'></image>
<view class='iconfont icon-guanbi1 font-color' @tap='DelPic(index)'></view>
</view>
<view class='pictrue acea-row row-center-wrapper row-column' @tap='uploadpic' v-if="refund_reason_wap_imgPath.length < 3">
<text class='iconfont icon-icon25201'></text>
<view>上传凭证</view>
</view>
</view>
</view>
</view>
<button class='returnBnt bg-color' form-type="submit">申请退款</button>
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import { ordeRefundReason, orderRefundVerify, getOrderDetail} from '@/api/order.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
refund_reason_wap_img:[],
refund_reason_wap_imgPath:[],
orderInfo:{},
RefundArray: [],
index: 0,
orderId:0,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad: function (options) {
if (!options.orderId) return this.$util.Tips({title:'缺少订单id,无法退款'},{tab:3,url:1});
this.orderId = options.orderId;
if (this.isLogin) {
this.getOrderInfo();
this.getRefundReason();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true);
// #endif
}
},
methods: {
onLoadFun:function(){
this.getOrderInfo();
this.getRefundReason();
},
/**
* 获取订单详情
*
*/
getOrderInfo:function(){
let that=this;
getOrderDetail(that.orderId).then(res=>{
that.$set(that,'orderInfo',res.data);
});
},
/**
* 获取退款理由
*/
getRefundReason:function(){
let that=this;
ordeRefundReason().then(res=>{
that.$set(that,'RefundArray',res.data);
})
},
/**
* 删除图片
*
*/
DelPic:function(e){
let index = e, that = this;
that.refund_reason_wap_imgPath.splice(index, 1);
that.$set(that,'refund_reason_wap_imgPath',that.refund_reason_wap_imgPath);
},
/**
* 上传文件
*
*/
uploadpic:function(){
let that=this;
that.$util.uploadImageOne({url:'user/upload/image',name:'multipart', model:"product", pid:1}, function(res){
that.refund_reason_wap_img.push(res.data.url);
that.refund_reason_wap_imgPath.push(res.data.localPath);
that.$set(that,'refund_reason_wap_img',that.refund_reason_wap_img);
that.$set(that,'refund_reason_wap_imgPath',that.refund_reason_wap_imgPath);
});
},
/**
* 申请退货
*/
subRefund:function(e){
console.log(e);
let that = this, value = e.detail.value;
//收集form表单
// if (!value.refund_reason_wap_explain) return app.Tips({title:'请输入退款原因'});
orderRefundVerify({
text: that.RefundArray[that.index] || '',
refund_reason_wap_explain: value.refund_reason_wap_explain,
refund_reason_wap_img: that.refund_reason_wap_img.join(','),
uni: that.orderId
}).then(res=>{
return this.$util.Tips({ title: '申请成功', icon: 'success' }, { tab: 5, url: '/pages/users/user_return_list/index?isT=1' });
}).catch(err=>{
return this.$util.Tips({ title: err });
})
},
bindPickerChange: function (e) {
this.$set(this,'index',e.detail.value);
}
}
}
</script>
<style scoped lang="scss">
.apply-return .list{background-color:#fff;margin-top:18rpx;}
.apply-return .list .item{margin-left:30rpx;padding-right:30rpx;min-height:90rpx;border-bottom:1rpx solid #eee;font-size:30rpx;color:#333;}
.apply-return .list .item .num{color:#282828;width:427rpx;text-align:right;}
.apply-return .list .item .num .picker .reason{width:385rpx;}
.apply-return .list .item .num .picker .iconfont{color:#666;font-size:30rpx;margin-top:2rpx;}
.apply-return .list .item.textarea{padding:30rpx 30rpx 30rpx 0;}
.apply-return .list .item textarea{height:100rpx;font-size:30rpx;}
.apply-return .list .item .placeholder{color:#bbb;}
.apply-return .list .item .title{height:95rpx;width:100%;}
.apply-return .list .item .title .tip{font-size:30rpx;color:#bbb;}
.apply-return .list .item .upload{padding-bottom:36rpx;}
.apply-return .list .item .upload .pictrue{margin:22rpx 23rpx 0 0;width:156rpx;height:156rpx;position:relative;font-size:24rpx;color:#bbb;}
.apply-return .list .item .upload .pictrue:nth-of-type(4n){margin-right:0;}
.apply-return .list .item .upload .pictrue image{width:100%;height:100%;border-radius:3rpx;}
.apply-return .list .item .upload .pictrue .icon-guanbi1{position:absolute;font-size:45rpx;top:-10rpx;right:-10rpx;}
.apply-return .list .item .upload .pictrue .icon-icon25201{color:#bfbfbf;font-size:50rpx;}
.apply-return .list .item .upload .pictrue:nth-last-child(1){border:1rpx solid #ddd;box-sizing:border-box;}
.apply-return .returnBnt{font-size:32rpx;color:#fff;width:690rpx;height:86rpx;border-radius:50rpx;text-align:center;line-height:86rpx;margin:43rpx auto;}
</style>

View File

@@ -0,0 +1,372 @@
<template>
<div class="register absolute">
<div class="shading">
<div class="pictrue acea-row row-center-wrapper">
<image :src="logoUrl" v-if="logoUrl" />
<image src="/static/images/logo2.png" v-else />
</div>
</div>
<div class="whiteBg" v-if="formItem === 1">
<div class="title acea-row row-center-wrapper">
<div class="item" :class="current === index ? 'on' : ''" v-for="(item, index) in navList" @click="navTap(index)"
:key="index">
{{ item }}
</div>
</div>
<div class="list" :hidden="current !== 1">
<form @submit.prevent="submit">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" required />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="password" placeholder="填写登录密码" v-model="password" required />
</div>
</div>
</form>
<!-- <navigator class="forgetPwd" hover-class="none" url="/pages/users/retrievePassword/index">
<span class="iconfont icon-wenti"></span>忘记密码
</navigator> -->
</div>
<div class="list" :hidden="current !== 0">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
{{ text }}
</button>
</div>
</div>
<div class="item" v-if="isShowCode">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="codeVal" />
<div class="code" @click="again"><img :src="codeUrl" /></div>
</div>
</div>
</div>
<div class="logon" @click="loginMobile" :hidden="current !== 0">登录</div>
<div class="logon" @click="submit" :hidden="current === 0">登录</div>
<div class="tip">
<div :hidden="current !== 1">
没有账号?
<span @click="current = 0" class="font-color-red">快速登录</span>
</div>
</div>
</div>
<!-- <div class="whiteBg" v-else>
<div class="title">注册账号</div>
<div class="list">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
{{ text }}
</button>
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_1.png"></image>
<input type="password" placeholder="填写您的登录密码" v-model="password" />
</div>
</div>
<div class="item" v-if="isShowCode">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="codeVal" />
<div class="code" @click="again"><img :src="codeUrl" /></div>
</div>
</div>
</div>
<div class="logon" @click="register">注册</div>
<div class="tip">
已有账号?
<span @click="formItem = 1" class="font-color-red">立即登录</span>
</div>
</div> -->
<div class="bottom"></div>
</div>
</template>
<script>
import dayjs from "@/plugin/dayjs/dayjs.min.js";
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
loginH5,
loginMobile,
registerVerify,
register,
// getCodeApi,
getUserInfo
} from "@/api/user";
import attrs, {
required,
alpha_num,
chs_phone
} from "@/utils/validate";
import {
validatorDefaultCatch
} from "@/utils/dialog";
import {
getLogo
} from "@/api/public";
import {
VUE_APP_API_URL
} from "@/utils";
const BACK_URL = "login_back_url";
export default {
name: "Login",
mixins: [sendVerifyCode],
data: function() {
return {
navList: ["快速登录", "账号登录"],
current: 0,
account: "",
password: "",
captcha: "",
formItem: 1,
type: "login",
logoUrl: "",
keyCode: "",
codeUrl: "",
codeVal: "",
isShowCode: false
};
},
watch:{
formItem:function(nval,oVal){
if(nval == 1){
this.type = 'login'
}else{
this.type = 'register'
}
}
},
mounted: function() {
this.getCode();
this.getLogoImage();
},
methods: {
again() {
this.codeUrl =
VUE_APP_API_URL +
"/sms_captcha?" +
"key=" +
this.keyCode +
Date.parse(new Date());
},
getCode() {
let that = this
// getCodeApi()
// .then(res => {
// that.keyCode = res.data.key;
// })
// .catch(res => {
// that.$util.Tips({
// title: res
// });
// });
},
async getLogoImage() {
let that = this;
getLogo().then(res => {
that.logoUrl = res.data.logoUrl;
});
},
async loginMobile() {
let that = this;
if (!that.account) return that.$util.Tips({
title: '请填写手机号码'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (!that.captcha) return that.$util.Tips({
title: '请填写验证码'
});
if (!/^[\w\d]+$/i.test(that.captcha)) return that.$util.Tips({
title: '请输入正确的验证码'
});
loginMobile({
account: that.account,
captcha: that.captcha,
spread: that.$Cache.get("spread")
})
.then(res => {
let data = res.data;
let newTime = Math.round(new Date() / 1000);
that.$store.commit("LOGIN", {
'token': data.token
// 'time': dayjs(data.expiresTime) - newTime
});
const backUrl = that.$Cache.get(BACK_URL) || "/pages/index/index";
that.$Cache.clear(BACK_URL);
getUserInfo().then(res => {
that.$store.commit("SETUID", res.data.uid);
if (backUrl === '/pages/index/index' || backUrl === '/pages/order_addcart/order_addcart' || backUrl ===
'/pages/user/index') {
uni.switchTab({
url: backUrl
});
} else {
uni.switchTab({
url: '/pages/index/index'
});
}
})
})
.catch(res => {
that.$util.Tips({
title: res
});
});
},
async register() {
let that = this;
if (!that.account) return that.$util.Tips({
title: '请填写手机号码'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (!that.captcha) return that.$util.Tips({
title: '请填写验证码'
});
if (!/^[\w\d]+$/i.test(that.captcha)) return that.$util.Tips({
title: '请输入正确的验证码'
});
if (!that.password) return that.$util.Tips({
title: '请填写密码'
});
if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/i.test(that.password)) return that.$util.Tips({
title: '您输入的密码过于简单'
});
register({
account: that.account,
captcha: that.captcha,
password: that.password,
spread: that.$Cache.get("spread")
})
.then(res => {
that.$util.Tips({
title: res
});
that.formItem = 1;
})
.catch(res => {
that.$util.Tips({
title: res
});
});
},
async code() {
let that = this;
if (!that.account) return that.$util.Tips({
title: '请填写手机号码'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (that.formItem == 2) that.type = "register";
// phone: that.account
// type: that.type,
// key: that.keyCode,
// code: that.codeVal
await registerVerify(that.account)
.then(res => {
that.$util.Tips({title:res.message});
that.sendCode();
})
.catch(res => {
// if (res.data.status === 402) {
// that.codeUrl = `${VUE_APP_API_URL}/sms_captcha?key=${that.keyCode}`;
// that.isShowCode = true;
// }
that.$util.Tips({title:res.message});
});
},
navTap: function(index) {
this.current = index;
},
async submit() {
let that = this;
if (!that.account) return that.$util.Tips({
title: '请填写账号'
});
if (!/^[\w\d]{5,16}$/i.test(that.account)) return that.$util.Tips({
title: '请输入正确的账号'
});
if (!that.password) return that.$util.Tips({
title: '请填写密码'
});
loginH5({
account: that.account,
password: that.password,
spread: that.$Cache.get("spread")
})
.then(({
data
}) => {
// let newTime = Math.round(new Date() / 1000);
that.$store.commit("LOGIN", {
'token': data.token
// 'time': dayjs(data.expiresTime) - newTime
});
const backUrl = that.$Cache.get(BACK_URL) || "/pages/index/index";
that.$Cache.clear(BACK_URL);
getUserInfo().then(res => {
that.$store.commit("SETUID", res.data.uid);
if (backUrl === '/pages/index/index' || backUrl === '/pages/order_addcart/order_addcart' || backUrl ==='/pages/user/index') {
uni.switchTab({
url: backUrl
});
} else {
uni.switchTab({
url: '/pages/index/index'
});
}
})
})
.catch(e => {
that.$util.Tips({
title: e
});
});
}
}
};
</script>
<style lang="scss">
.code img {
width: 100%;
height: 100%;
}
.acea-row.row-middle {
input {
margin-left: 20rpx;
}
}
</style>

View File

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,558 @@
<template>
<view>
<view class='my-order'>
<view class='header bg-color'>
<view class='picTxt acea-row row-between-wrapper'>
<view class='text'>
<view class='name'>订单信息</view>
<view>消费订单{{orderData.orderCount || 0}} 总消费{{orderData.sumPrice || 0}}</view>
</view>
<view class='pictrue'>
<image src='../../../static/images/orderTime.png'></image>
</view>
</view>
</view>
<view class='nav acea-row row-around'>
<view class='item' :class='orderStatus==0 ? "on": ""' @click="statusClick(0)">
<view>待付款</view>
<view class='num'>{{orderData.unPaidCount || 0}}</view>
</view>
<view class='item' :class='orderStatus==1 ? "on": ""' @click="statusClick(1)">
<view>待发货</view>
<view class='num'>{{orderData.unShippedCount || 0}}</view>
</view>
<view class='item' :class='orderStatus==2 ? "on": ""' @click="statusClick(2)">
<view>待收货</view>
<view class='num '>{{orderData.receivedCount || 0}}</view>
</view>
<view class='item' :class='orderStatus==3 ? "on": ""' @click="statusClick(3)">
<view>待评价</view>
<view class='num'>{{orderData.evaluatedCount || 0}}</view>
</view>
<view class='item' :class='orderStatus==4 ? "on": ""' @click="statusClick(4)">
<view>已完成</view>
<view class='num'>{{orderData.completeCount || 0}}</view>
</view>
</view>
<view class='list'>
<view class='item' v-for="(item,index) in orderList" :key="index">
<view @click='goOrderDetails(item.storeOrder.orderId,item.storeOrder.unique)'>
<view class='title acea-row row-between-wrapper'>
<view class="acea-row row-middle">
<text class="sign cart-color acea-row row-center-wrapper" v-if="item.storeOrder.bargainId != 0">砍价</text>
<text class="sign cart-color acea-row row-center-wrapper" v-else-if="item.storeOrder.combinationId != 0">拼团</text>
<text class="sign cart-color acea-row row-center-wrapper" v-else-if="item.storeOrder.seckillId != 0">秒杀</text>
<view>{{item.storeOrder.createTime}}</view>
</view>
<view v-if="item.status?item.status.type == 0:0" class='font-color'>待付款</view>
<view v-else-if="item.status?item.status.type == 1:0 && item.storeOrder.shippingType==1" class='font-color'>待发货</view>
<view v-else-if="item.status?item.status.type == 2:0 && item.storeOrder.shippingType==1" class='font-color'>待收货</view>
<view v-else-if="item.status?item.status.type == 3:0 && item.storeOrder.shippingType==1" class='font-color'>待评价</view>
<view v-else-if="item.status?item.status.type == 4:0 && item.storeOrder.shippingType==1" class='font-color'>已完成</view>
<view v-else-if="item.storeOrder.shippingType==2" class='font-color'>待核销</view>
</view>
<view class='item-info acea-row row-between row-top' v-for="(item,index) in item.cartInfo" :key="index">
<view class='pictrue'>
<image :src='item.info.productInfo.image'></image>
</view>
<view class='text acea-row row-between'>
<view class='name line2'>{{item.info.productInfo.storeName}}</view>
<view class='money'>
<view v-if="item.info.productInfo.attrInfo">{{item.info.productInfo.attrInfo.price}}</view>
<view v-else>{{item.info.productInfo.price}}</view>
<view>x{{item.info.cartNum}}</view>
</view>
</view>
</view>
<view class='totalPrice'>{{(item.cartInfo?item.cartInfo.length:0) || 0}}件商品总金额
<text class='money font-color'>{{item.storeOrder.payPrice}}</text>
</view>
</view>
<view class='bottom acea-row row-right row-middle'>
<view class='bnt cancelBnt' v-if="item.status?item.status.type==0:0 || item.status?item.status.type == 9:0" @click='cancelOrder(index,item.storeOrder.id)'>取消订单</view>
<view class='bnt bg-color' v-if="item.status?item.status.type == 0:0" @click='goPay(item.storeOrder.payPrice,item.storeOrder.orderId)'>立即付款</view>
<view class='bnt bg-color' v-else-if="item.status?item.status.type == 1:0 || item.status?item.status.type == 9:0" @click='goOrderDetails(item.storeOrder.orderId,item.storeOrder.unique)'>查看详情</view>
<view class='bnt bg-color' v-else-if="item.status?item.status.type == 2:0 && item.status.deliveryType" @click='goOrderDetails(item.storeOrder.orderId,item.storeOrder.unique)'>查看详情</view>
<view class='bnt bg-color' v-else-if="item.status?item.status.type == 3:0" @click='goOrderDetails(item.storeOrder.orderId,item.storeOrder.unique)'>去评价</view>
<view class='bnt bg-color' v-else-if="item.storeOrder.seckillId < 1 && item.storeOrder.bargainId < 1 && item.storeOrder.combinationId < 1 && item.status?item.status.type == 4:0"
@click='goOrderDetails(item.storeOrder.orderId,item.storeOrder.unique)'>再次购买</view>
<view class='bnt cancelBnt' v-if="item.status?item.status.type == 4:0" @click='delOrder(item.storeOrder.id,index)'>删除订单</view>
</view>
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if="orderList.length>0">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<view v-if="orderList.length == 0">
<emptyPage title="暂无订单~"></emptyPage>
</view>
</view>
<view class='noCart' v-if="orderList.length == 0 && page > 1">
<view class='pictrue'>
<image src='/images/noOrder.png'></image>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
<payment :payMode='payMode' :pay_close="pay_close" @onChangeFun='onChangeFun' :order_id="pay_order_id" :totalPrice='totalPrice'></payment>
</view>
</template>
<script>
import {
getOrderList,
orderData,
orderCancel,
orderDel,
orderPay
} from '@/api/order.js';
import {
getUserInfo
} from '@/api/user.js';
import {
openOrderSubscribe
} from '@/utils/SubscribeMessage.js';
import home from '@/components/home';
import payment from '@/components/payment';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import emptyPage from '@/components/emptyPage.vue'
export default {
components: {
payment,
home,
emptyPage,
// #ifdef MP
authorize
// #endif
},
data() {
return {
loading: false, //是否加载中
loadend: false, //是否加载完毕
loadTitle: '加载更多', //提示语
orderList: [], //订单数组
orderData: {}, //订单详细统计
orderStatus: 0, //订单状态
page: 1,
limit: 20,
payMode: [{
name: "微信支付",
icon: "icon-weixinzhifu",
value: 'weixin',
title: '微信快捷支付'
},
{
name: "余额支付",
icon: "icon-yuezhifu",
value: 'yue',
title: '可用余额:',
number: 0
}
],
pay_close: false,
pay_order_id: '',
totalPrice: '0',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onShow() {
if (this.isLogin) {
this.getOrderData();
this.getOrderList();
this.getUserInfo();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true);
// #endif
}
},
methods: {
onLoadFun() {
this.getOrderData();
this.getOrderList();
this.getUserInfo();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 事件回调
*
*/
onChangeFun: function(e) {
let opt = e;
let action = opt.action || null;
let value = opt.value != undefined ? opt.value : null;
(action && this[action]) && this[action](value);
},
/**
* 获取用户信息
*
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.payMode[1].number = res.data.nowMoney;
that.$set(that, 'payMode', that.payMode);
});
},
/**
* 关闭支付组件
*
*/
payClose: function() {
this.pay_close = false;
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
if (options.status) this.orderStatus = options.status;
},
/**
* 获取订单统计数据
*
*/
getOrderData: function() {
let that = this;
orderData().then(res => {
that.$set(that, 'orderData', res.data);
})
},
/**
* 取消订单
*
*/
cancelOrder: function(index, order_id) {
let that = this;
if (!order_id) return that.$util.Tips({
title: '缺少订单号无法取消订单'
});
uni.showLoading({
title: '正在删除中'
});
orderCancel(order_id).then(res => {
uni.hideLoading();
return that.$util.Tips({
title: '删除成功',
icon: 'success'
}, function() {
that.orderList.splice(index, 1);
that.$set(that, 'orderList', that.orderList);
that.$set(that.orderData, 'unpaid_count', that.orderData.unpaid_count - 1);
that.getOrderData();
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
/**
* 打开支付组件
*
*/
goPay: function(pay_price, order_id) {
this.$set(this, 'pay_close', true);
this.$set(this, 'pay_order_id', order_id);
this.$set(this, 'totalPrice', pay_price);
},
/**
* 支付成功回调
*
*/
pay_complete: function() {
this.loadend = false;
this.page = 1;
this.$set(this, 'orderList', []);
this.pay_close = false;
this.pay_order_id = '';
this.getOrderData();
this.getOrderList();
},
/**
* 支付失败回调
*
*/
pay_fail: function() {
this.pay_close = false;
this.pay_order_id = '';
},
/**
* 去订单详情
*/
goOrderDetails: function(order_id) {
if (!order_id) return that.$util.Tips({
title: '缺少订单号无法查看订单详情'
});
// #ifdef MP
uni.showLoading({
title: '正在加载',
})
openOrderSubscribe().then(() => {
uni.hideLoading();
uni.navigateTo({
url: '/pages/order_details/index?order_id=' + order_id
})
}).catch(() => {
uni.hideLoading();
})
// #endif
// #ifndef MP
uni.navigateTo({
url: '/pages/order_details/index?order_id=' + order_id
})
// #endif
},
/**
* 切换类型
*/
statusClick: function(status) {
if (status == this.orderStatus) return;
this.orderStatus = status;
this.loadend = false;
this.page = 1;
this.$set(this, 'orderList', []);
this.getOrderList();
},
/**
* 获取订单列表
*/
getOrderList: function() {
let that = this;
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
that.loadTitle = "加载更多";
getOrderList({
type: that.orderStatus,
page: that.page,
limit: that.limit,
}).then(res => {
let list = res.data || [];
let loadend = list.length < that.limit;
that.orderList = that.$util.SplitArray(list, that.orderList);
that.$set(that, 'orderList', that.orderList);
that.loadend = loadend;
that.loading = false;
that.loadTitle = loadend ? "我也是有底线的" : '加载更多';
that.page = that.page + 1;
}).catch(err => {
that.loading = false;
that.loadTitle = "加载更多";
})
},
/**
* 删除订单
*/
delOrder: function(order_id, index) {
let that = this;
orderDel(order_id).then(res => {
that.orderList.splice(index, 1);
that.$set(that, 'orderList', that.orderList);
that.$set(that.orderData, 'unpaid_count', that.orderData.unpaid_count - 1);
that.getOrderData();
return that.$util.Tips({
title: '删除成功',
icon: 'success'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
},
onReachBottom: function() {
this.getOrderList();
}
}
</script>
<style scoped lang="scss">
.my-order .header {
height: 260rpx;
padding: 0 30rpx;
}
.my-order .header .picTxt {
height: 190rpx;
}
.my-order .header .picTxt .text {
color: rgba(255, 255, 255, 0.8);
font-size: 26rpx;
font-family: 'Guildford Pro';
}
.my-order .header .picTxt .text .name {
font-size: 34rpx;
font-weight: bold;
color: #fff;
margin-bottom: 20rpx;
}
.my-order .header .picTxt .pictrue {
width: 122rpx;
height: 109rpx;
}
.my-order .header .picTxt .pictrue image {
width: 100%;
height: 100%;
}
.my-order .nav {
background-color: #fff;
width: 690rpx;
height: 140rpx;
border-radius: 6rpx;
margin: -73rpx auto 0 auto;
}
.my-order .nav .item {
text-align: center;
font-size: 26rpx;
color: #282828;
padding: 29rpx 0;
}
.my-order .nav .item.on {
font-weight: bold;
border-bottom: 5rpx solid #e93323;
}
.my-order .nav .item .num {
margin-top: 18rpx;
}
.my-order .list {
width: 690rpx;
margin: 14rpx auto 0 auto;
}
.my-order .list .item {
background-color: #fff;
border-radius: 6rpx;
margin-bottom: 14rpx;
}
.my-order .list .item .title {
height: 84rpx;
padding: 0 30rpx;
border-bottom: 1rpx solid #eee;
font-size: 28rpx;
color: #282828;
}
.my-order .list .item .title .sign {
font-size: 24rpx;
padding: 0 7rpx;
height: 36rpx;
margin-right: 15rpx;
}
.my-order .list .item .item-info {
padding: 0 30rpx;
margin-top: 22rpx;
}
.my-order .list .item .item-info .pictrue {
width: 120rpx;
height: 120rpx;
}
.my-order .list .item .item-info .pictrue image {
width: 100%;
height: 100%;
border-radius: 6rpx;
}
.my-order .list .item .item-info .text {
width: 486rpx;
font-size: 28rpx;
color: #999;
margin-top: 6rpx;
}
.my-order .list .item .item-info .text .name {
width: 306rpx;
color: #282828;
}
.my-order .list .item .item-info .text .money {
text-align: right;
}
.my-order .list .item .totalPrice {
font-size: 26rpx;
color: #282828;
text-align: right;
margin: 27rpx 0 0 30rpx;
padding: 0 30rpx 30rpx 0;
border-bottom: 1rpx solid #eee;
}
.my-order .list .item .totalPrice .money {
font-size: 28rpx;
font-weight: bold;
}
.my-order .list .item .bottom {
height: 107rpx;
padding: 0 30rpx;
}
.my-order .list .item .bottom .bnt {
width: 176rpx;
height: 60rpx;
text-align: center;
line-height: 60rpx;
color: #fff;
border-radius: 50rpx;
font-size: 27rpx;
}
.my-order .list .item .bottom .bnt.cancelBnt {
border: 1rpx solid #ddd;
color: #aaa;
}
.my-order .list .item .bottom .bnt~.bnt {
margin-left: 17rpx;
}
.noCart {
margin-top: 171rpx;
padding-top: 0.1rpx;
}
.noCart .pictrue {
width: 414rpx;
height: 336rpx;
margin: 78rpx auto 56rpx auto;
}
.noCart .pictrue image {
width: 100%;
height: 100%;
}
</style>

View File

@@ -0,0 +1,352 @@
<template>
<view>
<view class="promoter-list">
<view class='promoterHeader bg-color'>
<view class='headerCon acea-row row-between-wrapper'>
<view>
<view class='name'>推广人数</view>
<view><text class='num'>{{teamCount}}</text></view>
</view>
<view class='iconfont icon-tuandui'></view>
</view>
</view>
<view class='nav acea-row row-around'>
<view :class="grade == 0 ? 'item on' : 'item'" @click='setType(0)'>一级({{total}})</view>
<view :class="grade == 1 ? 'item on' : 'item'" @click='setType(1)'>二级({{totalLevel}})</view>
</view>
<view class='search acea-row row-between-wrapper'>
<view class='input'><input placeholder='点击搜索会员名称' placeholder-class='placeholder' v-model="keyword" @confirm="submitForm" confirm-type='search' name="search"></input></view>
<button class='iconfont icon-sousuo2' @click="submitForm"></button>
</view>
<view class='list'>
<view class="sortNav acea-row row-middle">
<view class="sortItem" @click='setSort("childCount","ASC")' v-if="sort == 'childCountDESC'">团队排序
<image src='/static/images/sort1.png'></image>
</view>
<view class="sortItem" @click='setSort("childCount")' v-else-if="sort == 'childCountASC'">团队排序
<image src='/static/images/sort3.png'></image>
</view>
<view class="sortItem" @click='setSort("childCount","DESC")' v-else>团队排序
<image src='/static/images/sort2.png'></image>
</view>
<view class="sortItem" @click='setSort("numberCount","ASC")' v-if="sort == 'numberCountDESC'">金额排序
<image src='/static/images/sort1.png'></image>
</view>
<view class="sortItem" @click='setSort("numberCount")' v-else-if="sort == 'numberCountASC'">金额排序
<image src='/static/images/sort3.png'></image>
</view>
<view class="sortItem" @click='setSort("numberCount","DESC")' v-else>金额排序
<image src='/static/images/sort2.png'></image>
</view>
<view class="sortItem" @click='setSort("orderCount","ASC")' v-if="sort == 'orderCountDESC'">订单排序
<image src='/static/images/sort1.png'></image>
</view>
<view class="sortItem" @click='setSort("orderCount")' v-else-if="sort == 'orderCountASC'">订单排序
<image src='/static/images/sort3.png'></image>
</view>
<view class="sortItem" @click='setSort("orderCount","DESC")' v-else>订单排序
<image src='/static/images/sort2.png'></image>
</view>
</view>
<block v-for="(item,index) in recordList" :key="index">
<view class='item acea-row row-between-wrapper'>
<view class="picTxt acea-row row-between-wrapper">
<view class='pictrue'>
<image :src='item.avatar'></image>
</view>
<view class='text'>
<view class='name line1'>{{item.nickname}}</view>
<view>加入时间: {{item.time}}</view>
</view>
</view>
<view class="right">
<view><text class='num font-color'>{{item.childCount ? item.childCount : 0}}</text></view>
<view><text class="num">{{item.orderCount ? item.orderCount : 0}}</text></view>
<view><text class="num">{{item.numberCount ? item.numberCount : 0}}</text></view>
</view>
</view>
</block>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
spreadPeople
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
total: 0,
totalLevel: 0,
teamCount: 0,
page: 1,
limit: 20,
keyword: '',
sort: '',
isAsc: '',
sortKey: '',
grade: 0,
status: false,
recordList: [],
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.userSpreadNewList();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
onShow: function() {
if (this.is_show) this.userSpreadNewList();
},
onHide: function() {
this.is_show = true;
},
methods: {
onLoadFun: function(e) {
this.userSpreadNewList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
setSort: function(sortKey,isAsc) {
console.log(sortKey);
let that = this;
that.isAsc = isAsc;
that.sort = sortKey+isAsc;
console.log('ppppppp');
console.log(sortKey+isAsc);
that.sortKey = sortKey;
that.page = 1;
that.limit = 20;
that.status = false;
that.$set(that, 'recordList', []);
that.userSpreadNewList();
},
submitForm: function() {
this.page = 1;
this.limit = 20;
this.status = false;
this.$set(this, 'recordList', []);
this.userSpreadNewList();
},
setType: function(grade) {
if (this.grade != grade) {
this.grade = grade;
this.page = 1;
this.limit = 20;
this.keyword = '';
this.sort = '';
this.isAsc = '';
this.status = false;
this.$set(this, 'recordList', []);
this.userSpreadNewList();
}
},
userSpreadNewList: function() {
let that = this;
let page = that.page;
let limit = that.limit;
let status = that.status;
let keyword = that.keyword;
let isAsc = that.isAsc;
let sortKey = that.sortKey;
let grade = that.grade;
let recordList = that.recordList;
let recordListNew = [];
if (status == true) return;
spreadPeople({
page: page,
limit: limit,
keyword: keyword,
grade: grade,
sortKey: sortKey,
isAsc: isAsc
}).then(res => {
let recordListData = res.data.spreadPeopleList?res.data.spreadPeopleList:[];
let len = recordListData.length;
recordListNew = recordList.concat(recordListData);
that.total = res.data.total;
that.totalLevel = res.data.totalLevel;
that.teamCount = that.$util.$h.Add(Number(res.data.total), Number(res.data.totalLevel));
that.status = limit > len;
that.page = page + 1;
that.$set(that, 'recordList', recordListNew);
});
}
},
onReachBottom: function() {
this.userSpreadNewList();
}
}
</script>
<style scoped lang="scss">
.promoter-list .nav {
background-color: #fff;
height: 86rpx;
line-height: 86rpx;
font-size: 28rpx;
color: #282828;
border-bottom: 1rpx solid #eee;
}
.promoter-list .nav .item.on {
border-bottom: 5rpx solid #e93323;
color: #e93323;
}
.promoter-list .search {
width: 100%;
background-color: #fff;
height: 86rpx;
padding-left: 30rpx;
box-sizing: border-box;
}
.promoter-list .search .input {
width: 610rpx;
height: 60rpx;
border-radius: 50rpx;
background-color: #f5f5f5;
text-align: center;
position: relative;
}
.promoter-list .search .input input {
height: 100%;
font-size: 26rpx;
width: 610rpx;
text-align: center;
}
.promoter-list .search .input .placeholder {
color: #bbb;
}
.promoter-list .search .input .iconfont {
position: absolute;
right: 28rpx;
color: #999;
font-size: 28rpx;
top: 50%;
transform: translateY(-50%);
}
.promoter-list .search .iconfont {
font-size: 45rpx;
color: #515151;
width: 110rpx;
height: 60rpx;
line-height: 60rpx;
}
.promoter-list .list {
margin-top: 12rpx;
}
.promoter-list .list .sortNav {
background-color: #fff;
height: 76rpx;
border-bottom: 1rpx solid #eee;
color: #333;
font-size: 28rpx;
}
.promoter-list .list .sortNav .sortItem {
text-align: center;
flex: 1;
}
.promoter-list .list .sortNav .sortItem image {
width: 24rpx;
height: 24rpx;
margin-left: 6rpx;
vertical-align: -3rpx;
}
.promoter-list .list .item {
background-color: #fff;
border-bottom: 1rpx solid #eee;
height: 152rpx;
padding: 0 30rpx 0 20rpx;
font-size: 24rpx;
color: #666;
}
.promoter-list .list .item .picTxt {
width: 440rpx;
}
.promoter-list .list .item .picTxt .pictrue {
width: 106rpx;
height: 106rpx;
border-radius: 50%;
}
.promoter-list .list .item .picTxt .pictrue image {
width: 100%;
height: 100%;
border-radius: 50%;
border: 3rpx solid #fff;
box-shadow: 0 0 10rpx #aaa;
box-sizing: border-box;
}
.promoter-list .list .item .picTxt .text {
width: 304rpx;
font-size: 24rpx;
color: #666;
}
.promoter-list .list .item .picTxt .text .name {
font-size: 28rpx;
color: #333;
margin-bottom: 13rpx;
}
.promoter-list .list .item .right {
width: 240rpx;
text-align: right;
font-size: 22rpx;
color: #333;
}
.promoter-list .list .item .right .num{
margin-right: 7rpx;
}
</style>

View File

@@ -0,0 +1,226 @@
<template>
<view>
<view class="promoter-order">
<view class='promoterHeader bg-color'>
<view class='headerCon acea-row row-between-wrapper'>
<view>
<view class='name'>累积推广订单</view>
<view><text class='num'>{{recordCount || 0}}</text></view>
</view>
<view class='iconfont icon-2'></view>
</view>
</view>
<view class='list' v-if="recordList.length>0">
<block v-for="(item,index) in recordList" :key="index">
<view class='item'>
<view class='title acea-row row-column row-center'>
<view class='data'>{{item.time}}</view>
<view>本月累计推广订单{{item.count || 0}}</view>
</view>
<view class='listn'>
<block v-for="(child,indexn) in item.child" :key="indexn">
<view class='itenm'>
<view class='top acea-row row-between-wrapper'>
<view class='pictxt acea-row row-between-wrapper'>
<view class='pictrue'>
<image :src='child.avatar'></image>
</view>
<view class='text line1'>{{child.nickname}}</view>
</view>
<view class='money' v-if="child.type == 'brokerage'">返佣<text class='font-color'>{{child.number}}</text></view>
<view class='money' v-else>暂未返佣<text class='font-color'>{{child.number}}</text></view>
</view>
<view class='bottom'>
<view><text class='name'>订单编号</text>{{child.order_id}}</view>
<view><text class='name'>下单时间</text>{{child.time}}</view>
</view>
</view>
</block>
</view>
</view>
</block>
</view>
<view v-if="recordList.length == 0">
<emptyPage title="暂无推广订单~"></emptyPage>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
spreadOrder
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import emptyPage from '@/components/emptyPage.vue'
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
emptyPage,
home
},
data() {
return {
page: 1,
limit: 10,
status: false,
recordList: [],
recordCount: 0,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false,//是否隐藏授权
time: 0
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getRecordOrderList();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
stringToDate : function(data){
let str = data.replace(/-/g,'/');
let date = new Date(str);
return data;
},
onLoadFun() {
this.getRecordOrderList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
getRecordOrderList: function() {
let that = this;
let page = that.page;
let limit = that.limit;
let status = that.status;
let recordList = that.recordList;
let newList = [];
if (status == true) return;
spreadOrder({
page: page,
limit: limit
}).then(res => {
let recordListData = res.data.list ? res.data.list : [];
// 每页返回的总条数;
let len = 0;
for(let i = 0;i<recordListData.length;i++) {
len = len + recordListData[i].child.length;
let str = recordListData[i].time.replace(/-/g,'/');
let date = new Date(str).getTime();
if(that.time === date){
that.$set(that.recordList[i],'child',that.recordList[i].child.concat(recordListData[i].child));
}else{
recordListData.forEach((item,index)=>{
if(recordListData[i]==item){
newList.push(item);
}
})
that.$set(that, 'recordList', recordList.concat(newList));
}
that.time = date;
};
that.recordCount = res.data.count || 0;
that.status = limit > len;
that.page = page + 1;
});
}
},
onReachBottom() {
this.getRecordOrderList()
}
}
</script>
<style scoped lang="scss">
.promoter-order .list .item .title {
height: 133rpx;
padding: 0 30rpx;
font-size: 26rpx;
color: #999;
}
.promoter-order .list .item .title .data {
font-size: 28rpx;
color: #282828;
margin-bottom: 5rpx;
}
.promoter-order .list .item .listn .itenm {
background-color: #fff;
}
.promoter-order .list .item .listn .itenm~.itenm {
margin-top: 12rpx;
}
.promoter-order .list .item .listn .itenm .top {
margin-left: 30rpx;
padding-right: 30rpx;
border-bottom: 1rpx solid #eee;
height: 100rpx;
}
.promoter-order .list .item .listn .itenm .top .pictxt {
width: 320rpx;
}
.promoter-order .list .item .listn .itenm .top .pictxt .text {
width: 230rpx;
font-size: 30rpx;
color: #282828;
}
.promoter-order .list .item .listn .itenm .top .pictxt .pictrue {
width: 66rpx;
height: 66rpx;
}
.promoter-order .list .item .listn .itenm .top .pictxt .pictrue image {
width: 100%;
height: 100%;
border-radius: 50%;
border: 3rpx solid #fff;
box-sizing: border-box;
box-shadow: 0 0 15rpx #aaa;
}
.promoter-order .list .item .listn .itenm .top .money {
font-size: 28rpx;
}
.promoter-order .list .item .listn .itenm .bottom {
padding: 20rpx 30rpx;
font-size: 28rpx;
color: #666;
line-height: 1.6;
}
.promoter-order .list .item .listn .itenm .bottom .name {
color: #999;
}
</style>

View File

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,163 @@
<template>
<div class="register absolute">
<div class="shading">
<div class="pictrue acea-row row-center-wrapper">
<image src="/static/images/logo2.png" />
</div>
</div>
<div class="whiteBg">
<div class="title">找回密码</div>
<div class="list">
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/phone_1.png"></image>
<input type="text" placeholder="输入手机号码" v-model="account" />
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" />
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
{{ text }}
</button>
</div>
</div>
<div class="item">
<div class="acea-row row-middle">
<image src="/static/images/code_2.png"></image>
<input type="password" placeholder="填写您的新密码" v-model="password" />
</div>
</div>
<div class="item" v-if="isShowCode">
<div class="align-left">
<input type="text" placeholder="填写验证码" class="codeIput" v-model="codeVal" />
<div class="code" @click="again"><img :src="codeUrl" /></div>
</div>
</div>
</div>
<div class="logon" @click="registerReset">确认</div>
<div class="tip">
<span class="font-color-red" @click="back">立即登录</span>
</div>
</div>
<div class="bottom"></div>
</div>
</template>
<script>
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
registerVerify,
registerReset,
getCodeApi
} from "@/api/user";
// import { validatorDefaultCatch } from "@/utils/dialog";
// import attrs, { required, alpha_num, chs_phone } from "@utils/validate";
// import { VUE_APP_API_URL } from "@utils";
export default {
name: "RetrievePassword",
data: function() {
return {
account: "",
password: "",
captcha: "",
keyCode: "",
codeUrl: "",
codeVal: "",
isShowCode: false
};
},
mixins: [sendVerifyCode],
mounted: function() {
this.getCode();
},
methods: {
back() {
uni.navigateBack();
},
again() {
this.codeUrl =
VUE_APP_API_URL + "/captcha?" + this.keyCode + Date.parse(new Date());
console.log(this.codeUrl);
},
getCode() {
getCodeApi()
.then(res => {
this.keyCode = res.data.key;
})
.catch(res => {
this.$dialog.error(res.msg);
});
},
async registerReset() {
var that = this;
if (!that.account) return that.$util.Tips({
title: '请填写手机号码'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (!that.captcha) return that.$util.Tips({
title: '请填写验证码'
});
registerReset({
account: that.account,
captcha: that.captcha,
password: that.password,
code: that.codeVal
})
.then(res => {
that.$util.Tips({
title: res.msg
}, {
tab: 3
})
})
.catch(res => {
that.$util.Tips({
title: res
})
});
},
async code() {
let that = this;
if (!that.account) return that.$util.Tips({
title: '请填写手机号码'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (that.formItem == 2) that.type = "register";
await registerVerify({
phone: that.account,
type: that.type,
key: that.keyCode,
code: that.codeVal
})
.then(res => {
that.$dialog.success(res.msg);
that.sendCode();
})
.catch(res => {
console.log(res, 'res')
// if (res.data.status === 402) {
// that.codeUrl = `${VUE_APP_API_URL}/sms_captcha?key=${that.keyCode}`;
// that.isShowCode = true;
// }
that.$util.Tips({
title: res
});
});
},
}
};
</script>
<style scoped>
.code img {
width: 100%;
height: 100%;
}
</style>

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 725 B

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

View File

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

View File

@@ -0,0 +1,533 @@
<template>
<view>
<form @submit="formSubmit" report-submit='true'>
<view class='addAddress'>
<view class='list'>
<view class='item acea-row row-between-wrapper'>
<view class='name'>姓名</view>
<input type='text' placeholder='请输入姓名' name='realName' :value="userAddress.realName" placeholder-class='placeholder'></input>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>联系电话</view>
<input type='text' placeholder='请输入联系电话' name="phone" :value='userAddress.phone' placeholder-class='placeholder'></input>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>所在地区</view>
<view class="address">
<picker mode="multiSelector" @change="bindRegionChange" @columnchange="bindMultiPickerColumnChange" :value="valueRegion"
:range="multiArray">
<view class='acea-row'>
<view class="picker">{{region[0]}}{{region[1]}}{{region[2]}}</view>
<view class='iconfont icon-dizhi font-color'></view>
</view>
</picker>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>详细地址</view>
<input type='text' placeholder='请填写具体地址' name='detail' placeholder-class='placeholder' :value='userAddress.detail'></input>
</view>
</view>
<view class='default acea-row row-middle'>
<checkbox-group @change='ChangeIsDefault'>
<checkbox :checked="userAddress.isDefault" />设置为默认地址</checkbox-group>
</view>
<button class='keepBnt bg-color' form-type="submit">立即保存</button>
<!-- #ifdef MP -->
<view class="wechatAddress" v-if="!id" @click="getWxAddress">导入微信地址</view>
<!-- #endif -->
<!-- #ifdef H5 -->
<view class="wechatAddress" v-if="this.$wechat.isWeixin() && !id" @click="getAddress">导入微信地址</view>
<!-- #endif -->
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
editAddress,
getAddressDetail
} from '@/api/user.js';
import {
getCity
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import wPicker from "@/components/wPicker/w-picker.vue";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
// import city from '@/utils/cityData';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
regionDval: ['浙江省', '杭州市', '滨江区'],
cartId: '', //购物车id
pinkId: 0, //拼团id
couponId: 0, //优惠券id
id: 0, //地址id
userAddress: {
isDefault: false
}, //地址详情
region: ['省', '市', '区'],
valueRegion: [0, 0, 0],
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
district: [],
multiArray: [],
multiIndex: [0, 0, 0],
cityId: 0,
defaultRegion: ['广东省', '广州市', '番禺区'],
defaultRegionCode: '440113'
};
},
computed: mapGetters(['isLogin']),
onLoad(options) {
if (this.isLogin) {
this.cartId = options.cartId || '';
this.pinkId = options.pinkId || 0;
this.couponId = options.couponId || 0;
this.id = options.id || 0;
uni.setNavigationBarTitle({
title: options.id ? '修改地址' : '添加地址'
})
this.getUserAddress();
this.getCityList();
// if(this.district && this.district.length){
// this.initialize();
// }
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
// 回去地址数据
getCityList: function() {
let that = this;
getCity().then(res => {
this.district = res.data
that.initialize();
})
},
initialize: function() {
let that = this,
province = [],
city = [],
area = [];
if (that.district.length) {
let cityChildren = that.district[0].child || [];
let areaChildren = cityChildren.length ? (cityChildren[0].child || []) : [];
that.district.forEach(function(item) {
province.push(item.name);
});
cityChildren.forEach(function(item) {
city.push(item.name);
});
areaChildren.forEach(function(item) {
area.push(item.name);
});
this.multiArray = [province, city, area]
}
},
bindRegionChange: function(e) {
let multiIndex = this.multiIndex,
province = this.district[multiIndex[0]] || {
child: []
},
city = province.child[multiIndex[1]] || {
cityId: 0
},
multiArray = this.multiArray,
value = e.detail.value;
this.region = [multiArray[0][value[0]], multiArray[1][value[1]], multiArray[2][value[2]]]
this.cityId = city.cityId
this.valueRegion = [0, 0, 0]
this.initialize();
},
bindMultiPickerColumnChange: function(e) {
let that = this,
column = e.detail.column,
value = e.detail.value,
currentCity = this.district[value] || {
child: []
},
multiArray = that.multiArray,
multiIndex = that.multiIndex;
multiIndex[column] = value;
switch (column) {
case 0:
let areaList = currentCity.child[0] || {
child: []
};
multiArray[1] = currentCity.child.map((item) => {
return item.name;
});
multiArray[2] = areaList.child.map((item) => {
return item.name;
});
break;
case 1:
let cityList = that.district[multiIndex[0]].child[multiIndex[1]].child || [];
multiArray[2] = cityList.map((item) => {
return item.name;
});
break;
case 2:
break;
}
// #ifdef MP
this.$set(this.multiArray, 0, multiArray[0]);
this.$set(this.multiArray, 1, multiArray[1]);
this.$set(this.multiArray, 2, multiArray[2]);
// #endif
// #ifdef H5
this.multiArray = multiArray;
// #endif
this.multiIndex = multiIndex
// this.setData({ multiArray: multiArray, multiIndex: multiIndex});
},
// 授权回调
onLoadFun: function() {
this.getUserAddress();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
toggleTab(str) {
this.$refs[str].show();
},
onConfirm(val) {
this.region = val.checkArr[0] + '-' + val.checkArr[1] + '-' + val.checkArr[2];
},
getUserAddress: function() {
if (!this.id) return false;
let that = this;
getAddressDetail(this.id).then(res => {
let region = [res.data.province, res.data.city, res.data.district];
that.$set(that, 'userAddress', res.data);
that.$set(that, 'region', region);
that.city_id = res.data.cityId
});
},
// 导入共享地址(小程序)
getWxAddress: function() {
let that = this;
uni.authorize({
scope: 'scope.address',
success: function(res) {
uni.chooseAddress({
success: function(res) {
let addressP = {};
addressP.province = res.provinceName;
addressP.city = res.cityName;
addressP.district = res.countyName;
addressP.cityId = 0;
editAddress({
address: addressP,
isDefault: 1,
realName: res.userName,
postCode: res.postalCode,
phone: res.telNumber,
detail: res.detailInfo,
id: 0
}).then(res => {
setTimeout(function() {
if (that.cartId) {
let cartId = that.cartId;
let pinkId = that.pinkId;
let couponId = that.couponId;
that.cartId = '';
that.pinkId = '';
that.couponId = '';
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + cartId + '&addressId=' + (that.id ? that.id :
res.data
.id) + '&pinkId=' + pinkId + '&couponId=' + couponId
});
} else {
uni.navigateBack({
delta: 1
});
}
}, 1000);
return that.$util.Tips({
title: "添加成功",
icon: 'success'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
fail: function(res) {
if (res.errMsg == 'chooseAddress:cancel') return that.$util.Tips({
title: '取消选择'
});
},
})
},
fail: function(res) {
uni.showModal({
title: '您已拒绝导入微信地址权限',
content: '是否进入权限管理,调整授权?',
success(res) {
if (res.confirm) {
uni.openSetting({
success: function(res) {}
});
} else if (res.cancel) {
return that.$util.Tips({
title: '已取消!'
});
}
}
})
},
})
},
// 导入共享地址(微信);
getAddress() {
let that = this;
that.$wechat.openAddress().then(userInfo => {
// open();
editAddress({
id: this.id,
realName: userInfo.userName,
phone: userInfo.telNumber,
address: {
province: userInfo.provinceName,
city: userInfo.cityName,
district: userInfo.countryName,
cityId: 0
},
detail: userInfo.detailInfo,
isDefault: 1,
postCode: userInfo.postalCode
})
.then(() => {
setTimeout(function() {
if (that.cartId) {
let cartId = that.cartId;
let pinkId = that.pinkId;
let couponId = that.couponId;
that.cartId = '';
that.pinkId = '';
that.couponId = '';
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + cartId + '&addressId=' + (that.id ? that.id :
res.data
.id) + '&pinkId=' + pinkId + '&couponId=' + couponId
});
} else {
uni.navigateTo({
url:'/pages/users/user_address_list/index'
})
// history.back();
}
}, 1000);
// close();
that.$util.Tips({
title: "添加成功",
icon: 'success'
});
})
.catch(err => {
// close();
return that.$util.Tips({
title: err || "添加失败"
});
});
}).catch(err => {
console.log(err);
});
},
/**
* 提交用户添加地址
*
*/
formSubmit: function(e) {
let that = this,
value = e.detail.value;
if (!value.realName) return that.$util.Tips({
title: '请填写收货人姓名'
});
if (!value.phone) return that.$util.Tips({
title: '请填写联系电话'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(value.phone)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (that.region == '省-市-区') return that.$util.Tips({
title: '请选择所在地区'
});
if (!value.detail) return that.$util.Tips({
title: '请填写详细地址'
});
value.id = that.id;
let regionArray = that.region;
value.address = {
province: regionArray[0],
city: regionArray[1],
district: regionArray[2],
cityId: that.cityId,
};
value.isDefault = that.userAddress.isDefault;
uni.showLoading({
title: '保存中',
mask: true
})
editAddress(value).then(res => {
if (that.id)
that.$util.Tips({
title: '修改成功',
icon: 'success'
});
else
that.$util.Tips({
title: '添加成功',
icon: 'success'
});
setTimeout(function() {
if (that.cartId) {
let cartId = that.cartId;
let pinkId = that.pinkId;
let couponId = that.couponId;
that.cartId = '';
that.pinkId = '';
that.couponId = '';
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + cartId + '&addressId=' + (that.id ? that.id : res.data.id) +'&pinkId=' + pinkId + '&couponId=' + couponId
});
} else {
// #ifdef H5
return history.back();
// #endif
// #ifndef H5
return uni.navigateBack({
delta: 1,
})
// #endif
}
}, 1000);
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
ChangeIsDefault: function(e) {
this.$set(this.userAddress, 'isDefault', !this.userAddress.isDefault);
}
}
}
</script>
<style scoped lang="scss">
.addAddress .list {
background-color: #fff;
}
.addAddress .list .item {
padding: 30rpx;
border-top: 1rpx solid #eee;
}
.addAddress .list .item .name {
width: 195rpx;
font-size: 30rpx;
color: #333;
}
.addAddress .list .item .address {
// width: 412rpx;
flex: 1;
margin-left: 20rpx;
}
.addAddress .list .item input {
width: 475rpx;
font-size: 30rpx;
}
.addAddress .list .item .placeholder {
color: #ccc;
}
.addAddress .list .item picker {
width: 475rpx;
}
.addAddress .list .item picker .picker {
width: 410rpx;
font-size: 30rpx;
}
.addAddress .list .item picker .iconfont {
font-size: 43rpx;
}
.addAddress .default {
padding: 0 30rpx;
height: 90rpx;
background-color: #fff;
margin-top: 23rpx;
}
.addAddress .default checkbox {
margin-right: 15rpx;
}
.addAddress .keepBnt {
width: 690rpx;
height: 86rpx;
border-radius: 50rpx;
text-align: center;
line-height: 86rpx;
margin: 50rpx auto;
font-size: 32rpx;
color: #fff;
}
.addAddress .wechatAddress {
width: 690rpx;
height: 86rpx;
border-radius: 50rpx;
text-align: center;
line-height: 86rpx;
margin: 0 auto;
font-size: 32rpx;
color: #fe960f;
border: 1px solid #fe960f;
}
</style>

View File

@@ -0,0 +1,537 @@
<template>
<view>
<form @submit="formSubmit" report-submit='true'>
<view class='addAddress'>
<view class='list'>
<view class='item acea-row row-between-wrapper'>
<view class='name'>姓名</view>
<input type='text' placeholder='请输入姓名' name='real_name' :value="userAddress.real_name" placeholder-class='placeholder'></input>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>联系电话</view>
<input type='text' placeholder='请输入联系电话' name="phone" :value='userAddress.phone' placeholder-class='placeholder'></input>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>所在地区</view>
<view class="address">
<picker mode="multiSelector" @change="bindRegionChange" @columnchange="bindMultiPickerColumnChange" :value="valueRegion"
:range="multiArray">
<view class='acea-row'>
<view class="picker">{{region[0]}}{{region[1]}}{{region[2]}}</view>
<view class='iconfont icon-dizhi font-color'></view>
</view>
</picker>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>详细地址</view>
<input type='text' placeholder='请填写具体地址' name='detail' placeholder-class='placeholder' :value='userAddress.detail'></input>
</view>
</view>
<view class='default acea-row row-middle'>
<checkbox-group @change='ChangeIsDefault'>
<checkbox :checked="userAddress.is_default ? true : false" />设置为默认地址</checkbox-group>
</view>
<button class='keepBnt bg-color' form-type="submit">立即保存</button>
<!-- #ifdef MP -->
<view class="wechatAddress" v-if="!id" @click="getWxAddress">导入微信地址</view>
<!-- #endif -->
<!-- #ifdef H5 -->
<view class="wechatAddress" v-if="this.$wechat.isWeixin() && !id" @click="getAddress">导入微信地址</view>
<!-- #endif -->
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
editAddress,
getAddressDetail
} from '@/api/user.js';
import {
getCity
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import wPicker from "@/components/wPicker/w-picker.vue";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
import city from '@/utils/city';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
regionDval: ['浙江省', '杭州市', '滨江区'],
cartId: '', //购物车id
pinkId: 0, //拼团id
couponId: 0, //优惠券id
id: 0, //地址id
userAddress: {
is_default: false
}, //地址详情
region: ['省', '市', '区'],
valueRegion: [0, 0, 0],
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
district: [],
multiArray: [],
multiIndex: [0, 0, 0],
cityId: 0,
defaultRegion: ['广东省', '广州市', '番禺区'],
defaultRegionCode: '440113'
};
},
computed: mapGetters(['isLogin']),
onLoad(options) {
if (this.isLogin) {
this.cartId = options.cartId || '';
this.pinkId = options.pinkId || 0;
this.couponId = options.couponId || 0;
this.id = options.id || 0;
uni.setNavigationBarTitle({
title: options.id ? '修改地址' : '添加地址'
})
this.getUserAddress();
this.getCityList();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
// 回去地址数据
getCityList: function() {
let that = this;
getCity().then(res => {
this.district = res.data
that.initialize();
})
},
initialize: function() {
let that = this,
province = [],
city = [],
area = [];
if (that.district.length) {
let cityChildren = that.district[0].c || [];
let areaChildren = cityChildren.length ? (cityChildren[0].c || []) : [];
that.district.forEach(function(item) {
province.push(item.n);
});
cityChildren.forEach(function(item) {
city.push(item.n);
});
areaChildren.forEach(function(item) {
area.push(item.n);
});
this.multiArray = [province, city, area]
}
},
bindRegionChange: function(e) {
let multiIndex = this.multiIndex,
province = this.district[multiIndex[0]] || {
c: []
},
city = province.c[multiIndex[1]] || {
v: 0
},
multiArray = this.multiArray,
value = e.detail.value;
this.region = [multiArray[0][value[0]], multiArray[1][value[1]], multiArray[2][value[2]]]
// this.$set(this.region,0,multiArray[0][value[0]]);
// this.$set(this.region,1,multiArray[1][value[1]]);
// this.$set(this.region,2,multiArray[2][value[2]]);
this.cityId = city.v
this.valueRegion = [0, 0, 0]
this.initialize();
},
bindMultiPickerColumnChange: function(e) {
let that = this,
column = e.detail.column,
value = e.detail.value,
currentCity = this.district[value] || {
c: []
},
multiArray = that.multiArray,
multiIndex = that.multiIndex;
multiIndex[column] = value;
switch (column) {
case 0:
let areaList = currentCity.c[0] || {
c: []
};
multiArray[1] = currentCity.c.map((item) => {
return item.n;
});
multiArray[2] = areaList.c.map((item) => {
return item.n;
});
break;
case 1:
let cityList = that.district[multiIndex[0]].c[multiIndex[1]].c || [];
multiArray[2] = cityList.map((item) => {
return item.n;
});
break;
case 2:
break;
}
// #ifdef MP
this.$set(this.multiArray, 0, multiArray[0]);
this.$set(this.multiArray, 1, multiArray[1]);
this.$set(this.multiArray, 2, multiArray[2]);
// #endif
// #ifdef H5
this.multiArray = multiArray;
// #endif
this.multiIndex = multiIndex
// this.setData({ multiArray: multiArray, multiIndex: multiIndex});
},
// 授权回调
onLoadFun: function() {
this.getUserAddress();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
toggleTab(str) {
this.$refs[str].show();
},
// bindRegionChange: function(e) {
// this.$set(this, 'region', e.detail.value);
// },
onConfirm(val) {
this.region = val.checkArr[0] + '-' + val.checkArr[1] + '-' + val.checkArr[2];
},
getUserAddress: function() {
if (!this.id) return false;
let that = this;
getAddressDetail(this.id).then(res => {
// let region = [res.data.province, res.data.city, res.data.district];
let region = [res.data.province, res.data.city, res.data.district];
that.$set(that, 'userAddress', res.data);
that.$set(that, 'region', region);
that.city_id = res.data.city_id
});
},
// 导入共享地址(小程序)
getWxAddress: function() {
let that = this;
uni.authorize({
scope: 'scope.address',
success: function(res) {
uni.chooseAddress({
success: function(res) {
let addressP = {};
addressP.province = res.provinceName;
addressP.city = res.cityName;
addressP.district = res.countyName;
editAddress({
address: addressP,
is_default: 1,
real_name: res.userName,
post_code: res.postalCode,
phone: res.telNumber,
detail: res.detailInfo,
id: 0,
type: 1,
}).then(res => {
setTimeout(function() {
if (that.cartId) {
let cartId = that.cartId;
let pinkId = that.pinkId;
let couponId = that.couponId;
that.cartId = '';
that.pinkId = '';
that.couponId = '';
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + cartId + '&addressId=' + (that.id ? that.id :
res.data
.id) + '&pinkId=' + pinkId + '&couponId=' + couponId
});
} else {
uni.navigateBack({
delta: 1
});
}
}, 1000);
return that.$util.Tips({
title: "添加成功",
icon: 'success'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
fail: function(res) {
if (res.errMsg == 'chooseAddress:cancel') return that.$util.Tips({
title: '取消选择'
});
},
})
},
fail: function(res) {
uni.showModal({
title: '您已拒绝导入微信地址权限',
content: '是否进入权限管理,调整授权?',
success(res) {
if (res.confirm) {
uni.openSetting({
success: function(res) {}
});
} else if (res.cancel) {
return that.$util.Tips({
title: '已取消!'
});
}
}
})
},
})
},
// 导入共享地址(微信);
getAddress() {
let that = this;
that.$wechat.openAddress().then(userInfo => {
open();
editAddress({
id: this.id,
real_name: userInfo.userName,
phone: userInfo.telNumber,
address: {
province: userInfo.provinceName,
city: userInfo.cityName,
district: userInfo.countryName
},
detail: userInfo.detailInfo,
is_default: 1,
post_code: userInfo.postalCode,
type: 1,
})
.then(() => {
setTimeout(function() {
if (that.cartId) {
let cartId = that.cartId;
let pinkId = that.pinkId;
let couponId = that.couponId;
that.cartId = '';
that.pinkId = '';
that.couponId = '';
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + cartId + '&addressId=' + (that.id ? that.id :
res.data
.id) + '&pinkId=' + pinkId + '&couponId=' + couponId
});
} else {
uni.navigateTo({
url:'/pages/users/user_address_list/index'
})
// history.back();
}
}, 1000);
close();
that.$util.Tips({
title: "添加成功",
icon: 'success'
});
})
.catch(err => {
close();
return that.$util.Tips({
title: err || "添加失败"
});
});
}).catch(err => {
console.log(err);
});
},
/**
* 提交用户添加地址
*
*/
formSubmit: function(e) {
let that = this,
value = e.detail.value;
if (!value.real_name) return that.$util.Tips({
title: '请填写收货人姓名'
});
if (!value.phone) return that.$util.Tips({
title: '请填写联系电话'
});
if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(value.phone)) return that.$util.Tips({
title: '请输入正确的手机号码'
});
if (that.region == '省-市-区') return that.$util.Tips({
title: '请选择所在地区'
});
if (!value.detail) return that.$util.Tips({
title: '请填写详细地址'
});
value.id = that.id;
let regionArray = that.region;
value.address = {
province: regionArray[0],
city: regionArray[1],
district: regionArray[2],
city_id: that.cityId,
};
value.is_default = that.userAddress.is_default ? 1 : 0;
uni.showLoading({
title: '保存中',
mask: true
})
editAddress(value).then(res => {
if (that.id)
that.$util.Tips({
title: '修改成功',
icon: 'success'
});
else
that.$util.Tips({
title: '添加成功',
icon: 'success'
});
setTimeout(function() {
if (that.cartId) {
let cartId = that.cartId;
let pinkId = that.pinkId;
let couponId = that.couponId;
that.cartId = '';
that.pinkId = '';
that.couponId = '';
uni.navigateTo({
url: '/pages/users/order_confirm/index?cartId=' + cartId + '&addressId=' + (that.id ? that.id : res.data.id) +'&pinkId=' + pinkId + '&couponId=' + couponId
});
} else {
// #ifdef H5
return history.back();
// #endif
// #ifndef H5
return uni.navigateBack({
delta: 1,
})
// #endif
}
}, 1000);
}).catch(err => {
return that.$util.Tips({
title: err
});
})
},
ChangeIsDefault: function(e) {
this.$set(this.userAddress, 'is_default', !this.userAddress.is_default);
}
}
}
</script>
<style scoped lang="scss">
.addAddress .list {
background-color: #fff;
}
.addAddress .list .item {
padding: 30rpx;
border-top: 1rpx solid #eee;
}
.addAddress .list .item .name {
width: 195rpx;
font-size: 30rpx;
color: #333;
}
.addAddress .list .item .address {
// width: 412rpx;
flex: 1;
margin-left: 20rpx;
}
.addAddress .list .item input {
width: 475rpx;
font-size: 30rpx;
}
.addAddress .list .item .placeholder {
color: #ccc;
}
.addAddress .list .item picker {
width: 475rpx;
}
.addAddress .list .item picker .picker {
width: 410rpx;
font-size: 30rpx;
}
.addAddress .list .item picker .iconfont {
font-size: 43rpx;
}
.addAddress .default {
padding: 0 30rpx;
height: 90rpx;
background-color: #fff;
margin-top: 23rpx;
}
.addAddress .default checkbox {
margin-right: 15rpx;
}
.addAddress .keepBnt {
width: 690rpx;
height: 86rpx;
border-radius: 50rpx;
text-align: center;
line-height: 86rpx;
margin: 50rpx auto;
font-size: 32rpx;
color: #fff;
}
.addAddress .wechatAddress {
width: 690rpx;
height: 86rpx;
border-radius: 50rpx;
text-align: center;
line-height: 86rpx;
margin: 0 auto;
font-size: 32rpx;
color: #fe960f;
border: 1px solid #fe960f;
}
</style>

View File

@@ -0,0 +1,463 @@
<template>
<view>
<view class='address-management' :class='addressList.length < 1 && page > 1 ? "fff":""'>
<view class='line'>
<image src='../../../static/images/line.jpg' v-if="addressList.length"></image>
</view>
<radio-group class="radio-group" @change="radioChange" v-if="addressList.length">
<view class='item' v-for="(item,index) in addressList" :key="index">
<view class='address' @click='goOrder(item.id)'>
<view class='consignee'>收货人{{item.realName}}<text class='phone'>{{item.phone}}</text></view>
<view>收货地址{{item.province}}{{item.city}}{{item.district}}{{item.detail}}</view>
</view>
<view class='operation acea-row row-between-wrapper'>
<!-- #ifndef MP -->
<radio class="radio" :value="index.toString()" :checked="item.isDefault">
<text>设为默认</text>
</radio>
<!-- #endif -->
<!-- #ifdef MP -->
<radio class="radio" :value="index" :checked="item.isDefault">
<text>设为默认</text>
</radio>
<!-- #endif -->
<view class='acea-row row-middle'>
<view @click='editAddress(item.id)'><text class='iconfont icon-bianji'></text>编辑</view>
<view @click='delAddress(index)'><text class='iconfont icon-shanchu'></text>删除</view>
</view>
</view>
</view>
</radio-group>
<view class='loadingicon acea-row row-center-wrapper' v-if="addressList.length">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<view class='noCommodity' v-if="addressList.length < 1 && page > 1">
<view class='pictrue'>
<image src='../../../static/images/noAddress.png'></image>
</view>
</view>
<view style='height:120rpx;'></view>
<view class='footer acea-row row-between-wrapper'>
<!-- #ifdef APP-PLUS -->
<view class='addressBnt bg-color on' @click='addAddress'><text class='iconfont icon-tianjiadizhi'></text>添加新地址</view>
<!-- #endif -->
<!-- #ifdef MP-->
<view class='addressBnt bg-color' @click='addAddress'><text class='iconfont icon-tianjiadizhi'></text>添加新地址</view>
<view class='addressBnt wxbnt' @click='getWxAddress'><text class='iconfont icon-weixin2'></text>导入微信地址</view>
<!-- #endif -->
<!-- #ifdef H5-->
<view class='addressBnt bg-color' :class="this.$wechat.isWeixin()?'':'on'" @click='addAddress'><text class='iconfont icon-tianjiadizhi'></text>添加新地址</view>
<view class='addressBnt wxbnt' @click='getAddress' v-if="this.$wechat.isWeixin()"><text class='iconfont icon-weixin2'></text>导入微信地址</view>
<!-- #endif -->
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getAddressList,
setAddressDefault,
delAddress,
editAddress,
postAddress
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
addressList: [],
cartId: '',
pinkId: 0,
couponId: 0,
loading: false,
loadend: false,
loadTitle: '加载更多',
page: 1,
limit: 20,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad(options) {
if (this.isLogin) {
this.cartId = options.cartId || '';
this.pinkId = options.pinkId || 0;
this.couponId = options.couponId || 0;
this.getAddressList(true);
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
onShow: function() {
let that = this;
that.getAddressList(true);
},
methods: {
onLoadFun: function() {
this.getAddressList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/*
* 导入微信地址(小程序)
*/
getWxAddress: function() {
let that = this;
uni.authorize({
scope: 'scope.address',
success: function(res) {
uni.chooseAddress({
success: function(res) {
let addressP = {};
addressP.province = res.provinceName;
addressP.city = res.cityName;
addressP.district = res.countyName;
addressP.cityId = 0;
editAddress({
address: addressP,
isDefault: true,
realName: res.userName,
postCode: res.postalCode,
phone: res.telNumber,
detail: res.detailInfo,
id: 0
//type: 1//区别城市id导入微信地址无城市id需要后台自己查找;
}).then(res => {
that.$util.Tips({
title: "添加成功",
icon: 'success'
}, function() {
that.getAddressList(true);
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
fail: function(res) {
if (res.errMsg == 'chooseAddress:cancel') return that.$util.Tips({
title: '取消选择'
});
},
})
},
fail: function(res) {
uni.showModal({
title: '您已拒绝导入微信地址权限',
content: '是否进入权限管理,调整授权?',
success(res) {
if (res.confirm) {
uni.openSetting({
success: function(res) {
console.log(res.authSetting)
}
});
} else if (res.cancel) {
return that.$util.Tips({
title: '已取消!'
});
}
}
})
}
})
},
/*
* 导入微信地址(公众号)
*/
getAddress() {
let that = this;
that.$wechat.openAddress().then(userInfo => {
// open();
editAddress({
realName: userInfo.userName,
phone: userInfo.telNumber,
address: {
province: userInfo.provinceName,
city: userInfo.cityName,
district: userInfo.countryName,
cityId: 0
},
detail: userInfo.detailInfo,
postCode: userInfo.postalCode,
isDefault: true
})
.then(() => {
that.$util.Tips({
title: "添加成功",
icon: 'success'
}, function() {
// close();
that.getAddressList(true);
});
})
.catch(err => {
// close();
return that.$util.Tips({
title: err || "添加失败"
});
});
});
},
/**
* 获取地址列表
*
*/
getAddressList: function(isPage) {
let that = this;
if (isPage) {
that.loadend = false;
that.page = 1;
that.$set(that, 'addressList', []);
};
if (that.loading) return;
if (that.loadend) return;
that.loading = true;
that.loadTitle = '';
getAddressList({
page: that.page,
limit: that.limit
}).then(res => {
let list = res.data.list;
let loadend = list.length < that.limit;
that.addressList = that.$util.SplitArray(list, that.addressList);
that.$set(that, 'addressList', that.addressList);
that.loadend = loadend;
that.loadTitle = loadend ? '我也是有底线的' : '加载更多';
that.page = that.page + 1;
that.loading = false;
}).catch(err => {
that.loading = false;
that.loadTitle = '加载更多';
});
},
/**
* 设置默认地址
*/
radioChange: function(e) {
let index = parseInt(e.detail.value),
that = this;
let address = this.addressList[index];
if (address == undefined) return that.$util.Tips({
title: '您设置的默认地址不存在!'
});
setAddressDefault(address.id).then(res => {
for (let i = 0, len = that.addressList.length; i < len; i++) {
if (i == index) that.addressList[i].isDefault = true;
else that.addressList[i].isDefault = false;
}
that.$util.Tips({
title: '设置成功',
icon: 'success'
}, function() {
that.$set(that, 'addressList', that.addressList);
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
/**
* 编辑地址
*/
editAddress: function(id) {
let cartId = this.cartId,
pinkId = this.pinkId,
couponId = this.couponId;
this.cartId = '';
this.pinkId = '';
this.couponId = '';
uni.navigateTo({
url: '/pages/users/user_address/index?id=' + id + '&cartId=' + cartId + '&pinkId=' + pinkId + '&couponId=' +
couponId
})
},
/**
* 删除地址
*/
delAddress: function(index) {
let that = this,
address = this.addressList[index];
if (address == undefined) return that.$util.Tips({
title: '您删除的地址不存在!'
});
delAddress(address.id).then(res => {
that.$util.Tips({
title: '删除成功',
icon: 'success'
}, function() {
that.addressList.splice(index, 1);
that.$set(that, 'addressList', that.addressList);
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
/**
* 新增地址
*/
addAddress: function() {
let cartId = this.cartId,
pinkId = this.pinkId,
couponId = this.couponId;
this.cartId = '';
this.pinkId = '';
this.couponId = '';
uni.navigateTo({
url: '/pages/users/user_address/index?cartId=' + cartId + '&pinkId=' + pinkId + '&couponId=' + couponId
})
},
goOrder: function(id) {
let cartId = '';
let pinkId = '';
let couponId = '';
if (this.cartId && id) {
cartId = this.cartId;
pinkId = this.pinkId;
couponId = this.couponId;
this.cartId = '';
this.pinkId = '';
this.couponId = '';
uni.redirectTo({
url: '/pages/users/order_confirm/index?is_address=1&cartId=' + cartId + '&addressId=' + id + '&pinkId=' +
pinkId + '&couponId=' + couponId
})
}
}
},
onReachBottom: function() {
this.getAddressList();
}
}
</script>
<style>
.address-management.fff {
background-color: #fff;
height: 1300rpx
}
.address-management .line {
width: 100%;
height: 3rpx;
}
.address-management .line image {
width: 100%;
height: 100%;
display: block;
}
.address-management .item {
background-color: #fff;
padding: 0 30rpx;
margin-bottom: 12rpx;
}
.address-management .item .address {
padding: 30rpx 0;
border-bottom: 1rpx solid #eee;
font-size: 28rpx;
color: #282828;
}
.address-management .item .address .consignee {
font-size: 28rpx;
font-weight: bold;
margin-bottom: 8rpx;
}
.address-management .item .address .consignee .phone {
margin-left: 25rpx;
}
.address-management .item .operation {
height: 83rpx;
font-size: 28rpx;
color: #282828;
}
.address-management .item .operation .radio text {
margin-left: 13rpx;
}
.address-management .item .operation .iconfont {
color: #2c2c2c;
font-size: 35rpx;
vertical-align: -2rpx;
margin-right: 10rpx;
}
.address-management .item .operation .iconfont.icon-shanchu {
margin-left: 40rpx;
font-size: 38rpx;
}
.address-management .footer {
position: fixed;
width: 100%;
background-color: #fff;
bottom: 0;
height: 106rpx;
padding: 0 30rpx;
box-sizing: border-box;
}
.address-management .footer .addressBnt {
width: 330rpx;
height: 76rpx;
border-radius: 50rpx;
text-align: center;
line-height: 76rpx;
font-size: 30rpx;
color: #fff;
}
.address-management .footer .addressBnt.on {
width: 690rpx;
margin: 0 auto;
}
.address-management .footer .addressBnt .iconfont {
font-size: 35rpx;
margin-right: 8rpx;
vertical-align: -1rpx;
}
.address-management .footer .addressBnt.wxbnt {
background-color: #fe960f;
}
</style>

View File

@@ -0,0 +1,173 @@
<template>
<view>
<view class='bill-details'>
<view class='nav acea-row'>
<view class='item' :class='type==0 ? "on":""' @click='changeType(0)'>全部</view>
<view class='item' :class='type==1 ? "on":""' @click='changeType(1)'>消费</view>
<view class='item' :class='type==2 ? "on":""' @click='changeType(2)'>充值</view>
</view>
<view class='sign-record'>
<view class='list' v-for="(item,index) in userBillList" :key="index">
<view class='item'>
<view class='data'>{{item.date}}</view>
<view class='listn'>
<view class='itemn acea-row row-between-wrapper' v-for="(vo,indexn) in item.list" :key="indexn">
<view>
<view class='name line1'>{{vo.title}}</view>
<view>{{vo.add_time}}</view>
</view>
<view class='num' v-if="vo.pm">+{{vo.number}}</view>
<view class='num font-color' v-else>-{{vo.number}}</view>
</view>
</view>
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if="userBillList.length>0">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<view v-if="userBillList.length == 0">
<emptyPage title="暂无账单的记录哦~"></emptyPage>
</view>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getCommissionInfo
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import emptyPage from '@/components/emptyPage.vue';
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
emptyPage,
home
},
data() {
return {
loadTitle: '加载更多',
loading: false,
loadend: false,
page: 1,
limit: 10,
type: 0,
userBillList: [],
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onShow() {
if (this.isLogin) {
this.getUserBillList();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
this.type = options.type || 0;
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
this.getUserBillList();
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.getUserBillList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取账户明细
*/
getUserBillList: function() {
let that = this;
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
that.loadTitle = "";
let data = {
page: that.page,
limit: that.limit
}
getCommissionInfo(data, that.type).then(function(res) {
let list = res.data.list?res.data.list:[],
loadend = list.length < that.limit;
that.userBillList = that.$util.SplitArray(list, that.userBillList);
that.$set(that, 'userBillList', that.userBillList);
that.loadend = loadend;
that.loading = false;
that.loadTitle = loadend ? "哼😕~我也是有底线的~" : "加载更多";
that.page = that.page + 1;
}, function(res) {
that.loading = false;
that.loadTitle = '加载更多';
});
},
/**
* 切换导航
*/
changeType: function(type) {
this.type = type;
this.loadend = false;
this.page = 1;
this.$set(this, 'userBillList', []);
this.getUserBillList();
},
}
}
</script>
<style scoped lang='scss'>
.bill-details .nav {
background-color: #fff;
height: 90rpx;
width: 100%;
line-height: 90rpx;
}
.bill-details .nav .item {
flex: 1;
text-align: center;
font-size: 30rpx;
color: #282828;
}
.bill-details .nav .item.on {
color: #e93323;
border-bottom: 3rpx solid #e93323;
}
</style>

View File

@@ -0,0 +1,362 @@
<template>
<view>
<view class='cash-withdrawal'>
<view class='nav acea-row'>
<view v-for="(item,index) in navList" :key="index" class='item font-color' @click="swichNav(index)">
<view class='line bg-color' :class='currentTab==index ? "on":""'></view>
<view class='iconfont' :class='item.icon+" "+(currentTab==index ? "on":"")'></view>
<view>{{item.name}}</view>
</view>
</view>
<view class='wrapper'>
<view :hidden='currentTab != 0' class='list'>
<form @submit="subCash" report-submit='true'>
<view class='item acea-row row-between-wrapper'>
<view class='name'>持卡人</view>
<view class='input'><input placeholder='请输入持卡人姓名' placeholder-class='placeholder' name="name"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>卡号</view>
<view class='input'><input type='number' placeholder='请填写卡号' placeholder-class='placeholder' name="cardum"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>银行</view>
<view class='input'>
<picker @change="bindPickerChange" :value="index" :range="array">
<text class='Bank'>{{array[index]}}</text>
<text class='iconfont icon-qiepian38'></text>
</picker>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view>
<view class='input'><input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="money" type='digit'></input></view>
</view>
<view class='tip'>
当前可提现金额: <text class="price">{{commission.commissionCount}},</text>冻结佣金{{commission.brokenCommission}}
</view>
<view class='tip'>
说明: 每笔佣金的冻结期为{{commission.brokenDay}}到期后可提现
</view>
<button formType="submit" class='bnt bg-color'>提现</button>
</form>
</view>
<view :hidden='currentTab != 1' class='list'>
<form @submit="subCash" report-submit='true'>
<view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view>
<view class='input'><input placeholder='请填写您的微信账号' placeholder-class='placeholder' name="name"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view>
<view class='input'><input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="money" type='digit'></input></view>
</view>
<view class='tip'>
当前可提现金额: <text class="price">{{commission.commissionCount}},</text>冻结佣金{{commission.brokenCommission}}
</view>
<view class='tip'>
说明: 每笔佣金的冻结期为{{commission.brokenDay}}到期后可提现
</view>
<button formType="submit" class='bnt bg-color'>提现</button>
</form>
</view>
<view :hidden='currentTab != 2' class='list'>
<form @submit="subCash" report-submit='true'>
<view class='item acea-row row-between-wrapper'>
<view class='name'>账号</view>
<view class='input'><input placeholder='请填写您的支付宝账号' placeholder-class='placeholder' name="name"></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='name'>提现</view>
<view class='input'><input :placeholder='"最低提现金额"+minPrice' placeholder-class='placeholder' name="money" type='digit'></input></view>
</view>
<view class='tip'>
当前可提现金额: <text class="price">{{commission.commissionCount}},</text>冻结佣金{{commission.brokenCommission}}
</view>
<view class='tip'>
说明: 每笔佣金的冻结期为{{commission.brokenDay}}到期后可提现
</view>
<button formType="submit" class='bnt bg-color'>提现</button>
</form>
</view>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
extractCash,
extractBank,
getUserInfo,
brokerageCommission
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
navList: [{
'name': '银行卡',
'icon': 'icon-yinhangqia'
},
{
'name': '微信',
'icon': 'icon-weixin2'
},
{
'name': '支付宝',
'icon': 'icon-icon34'
}
],
currentTab: 0,
index: 0,
array: [], //提现银行
minPrice: 0.00, //最低提现金额
userInfo: [],
isClone: false,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
commission:{}
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUserInfo();
this.getUserExtractBank();
this.getBrokerageCommission();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true);
// #endif
}
},
methods: {
onLoadFun: function() {
this.getUserInfo();
this.getUserExtractBank();
this.getBrokerageCommission();
},
getBrokerageCommission(){
brokerageCommission().then(res=>{
this.commission = res.data;
})
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
getUserExtractBank: function() {
let that = this;
extractBank().then(res => {
let array = res.data.extractBank;
array.unshift("请选择银行");
that.$set(that, 'array', array);
that.minPrice = res.data.minPrice;
that.commission = res.data;
});
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.userInfo = res.data;
});
},
swichNav: function(current) {
this.currentTab = current;
},
bindPickerChange: function(e) {
this.index = e.detail.value;
},
subCash: function(e) {
let that = this,
value = e.detail.value;
if (that.currentTab == 0) { //银行卡
if (value.name.length == 0) return this.$util.Tips({
title: '请填写持卡人姓名'
});
if (value.cardum.length == 0) return this.$util.Tips({
title: '请填写卡号'
});
if (that.index == 0) return this.$util.Tips({
title: "请选择银行"
});
value.extractType = 'bank';
value.bankname = that.array[that.index];
} else if (that.currentTab == 1) { //微信
value.extractType = 'weixin';
if (value.name.length == 0) return this.$util.Tips({
title: '请填写微信号'
});
value.wechat = value.name;
} else if (that.currentTab == 2) { //支付宝
value.extractType = 'alipay';
if (value.name.length == 0) return this.$util.Tips({
title: '请填写账号'
});
value.alipayCode = value.name;
}
if (value.money.length == 0) return this.$util.Tips({
title: '请填写提现金额'
});
if (value.money < that.minPrice) return this.$util.Tips({
title: '提现金额不能低于' + that.minPrice
});
extractCash(value).then(res => {
that.getUserInfo();
return this.$util.Tips({
title: "提现成功",
icon: 'success'
},{ tab: 2, url: '/pages/users/user_spread_user/index' });
}).catch(err => {
return this.$util.Tips({
title: err
});
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #fff !important;
}
.cash-withdrawal .nav {
height: 130rpx;
box-shadow: 0 10rpx 10rpx #f8f8f8;
}
.cash-withdrawal .nav .item {
font-size: 26rpx;
flex: 1;
text-align: center;
}
.cash-withdrawal .nav .item~.item {
border-left: 1px solid #f0f0f0;
}
.cash-withdrawal .nav .item .iconfont {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
border: 2rpx solid #e93323;
text-align: center;
line-height: 37rpx;
margin: 0 auto 6rpx auto;
font-size: 22rpx;
box-sizing: border-box;
}
.cash-withdrawal .nav .item .iconfont.on {
background-color: #e93323;
color: #fff;
border-color: #e93323;
}
.cash-withdrawal .nav .item .line {
width: 2rpx;
height: 20rpx;
margin: 0 auto;
transition: height 0.3s;
}
.cash-withdrawal .nav .item .line.on {
height: 39rpx;
}
.cash-withdrawal .wrapper .list {
padding: 0 30rpx;
}
.cash-withdrawal .wrapper .list .item {
border-bottom: 1rpx solid #eee;
height: 107rpx;
font-size: 30rpx;
color: #333;
}
.cash-withdrawal .wrapper .list .item .name {
width: 130rpx;
}
.cash-withdrawal .wrapper .list .item .input {
width: 505rpx;
}
.cash-withdrawal .wrapper .list .item .input .placeholder {
color: #bbb;
}
.cash-withdrawal .wrapper .list .tip {
font-size: 26rpx;
color: #999;
margin-top: 25rpx;
}
.cash-withdrawal .wrapper .list .bnt {
font-size: 32rpx;
color: #fff;
width: 690rpx;
height: 90rpx;
text-align: center;
border-radius: 50rpx;
line-height: 90rpx;
margin: 64rpx auto;
}
.cash-withdrawal .wrapper .list .tip2 {
font-size: 26rpx;
color: #999;
text-align: center;
margin: 44rpx 0 20rpx 0;
}
.cash-withdrawal .wrapper .list .value {
height: 135rpx;
line-height: 135rpx;
border-bottom: 1rpx solid #eee;
width: 690rpx;
margin: 0 auto;
}
.cash-withdrawal .wrapper .list .value input {
font-size: 80rpx;
color: #282828;
height: 135rpx;
text-align: center;
}
.cash-withdrawal .wrapper .list .value .placeholder2 {
color: #bbb;
}
.price {
color: $theme-color;
}
</style>

View File

@@ -0,0 +1,135 @@
<template>
<view>
<view class='coupon-list' v-if="couponsList.length">
<view class='item acea-row row-center-wrapper' v-for='(item,index) in couponsList' :key="index">
<view class='money' :class='item.isValid === false ? "moneyGray" : ""'>
<view><text class='num'>{{item.money}}</text></view>
<view class="pic-num">{{ item.minPrice }}元可用</view>
</view>
<view class='text'>
<view class='condition line1'>
<view class="line-title" :class="item.isValid === false ? 'bg-color-huic' : 'bg-color-check'" v-if="item.useType === 1">通用劵</view>
<view class="line-title" :class="item.isValid === false ? 'bg-color-huic' : 'bg-color-check'" v-else-if="item.useType === 2">商品券</view>
<view class="line-title" :class="item.isValid === false ? 'bg-color-huic' : 'bg-color-check'" v-else-if="item.useType === 3">品类券</view>
<view>{{item.name}}</view>
</view>
<view class='data acea-row row-between-wrapper'>
<view>{{item.startTime}} ~ {{item.endTime}}</view>
<view class='bnt gray' v-if="item.isValid===false">已过期</view>
<view class='bnt bg-color' v-else>可使用</view>
</view>
</view>
</view>
</view>
<view class='noCommodity' v-if="!couponsList.length && loading==true">
<view class='pictrue'>
<image src='../../../static/images/noCoupon.png'></image>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getUserCoupons
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
couponsList: [],
loading: false,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUseCoupons();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.getUseCoupons();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取领取优惠券列表
*/
getUseCoupons: function() {
let that = this;
getUserCoupons({status:0}).then(res => {
that.loading = true;
that.$set(that, 'couponsList', res.data);
})
}
}
}
</script>
<style>
.money {
display: flex;
flex-direction: column;
justify-content: center;
}
.pic-num {
color: #ffffff;
font-size: 0.24rem;
}
.coupon-list .item .text .condition{
display: flex;
align-items: center;
}
.condition .line-title {
width: 90rpx;
height: 40rpx !important;
line-height: 1.5 !important;
padding: 0 10rpx;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: rgba(255, 247, 247, 1);
border: 1px solid rgba(232, 51, 35, 1);
opacity: 1;
border-radius: 22rpx;
font-size: 20rpx !important;
color: #e83323;
margin-right: 12rpx;
}
</style>

View File

@@ -0,0 +1,160 @@
<template>
<view>
<view class='coupon-list' v-if="couponsList.length">
<view class='item acea-row row-center-wrapper' v-for="(item,index) in couponsList" :key="index">
<view class='money' :class='item.isUse ? "moneyGray" : "" '>
<view><text class='num'>{{item.money}}</text></view>
<view class="pic-num">{{item.minPrice}}元可用</view>
</view>
<view class='text'>
<view class='condition line1'>
<span class='line-title' :class='(item.isUse==true || item.isUse==2)?"gray":""' v-if='item.type===0'>通用劵</span>
<span class='line-title' :class='(item.isUse==true || item.isUse==2)?"gray":""' v-else-if='item.type===1'>品类券</span>
<span class='line-title' :class='(item.isUse==true || item.isUse==2)?"gray":""' v-else>商品券</span>
<span>{{item.name}}</span>
</view>
<view class='data acea-row row-between-wrapper'>
<view>{{ item.receiveStartTime ? item.receiveStartTime + "-" : ""}}{{ item.receiveEndTime }}</view>
<view class='bnt gray' v-if="item.isUse==true">已领取</view>
<view class='bnt bg-color' v-else @click='getCoupon(item.id,index)'>立即领取</view>
</view>
</view>
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if="couponsList.length">
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<view class='noCommodity' v-else-if="!couponsList.length && loading==true">
<view class='pictrue'>
<image src='../../../static/images/noCoupon.png'></image>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
getCoupons,
setCouponReceive
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
couponsList: [],
loading: false,
loadend: false,
loadTitle: '加载更多',//提示语
page: 1,
limit: 20,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad(){
if(this.isLogin){
// #ifdef H5
this.getUseCoupons();
// #endif
}else{
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this,'isShowAuth',true)
// #endif
}
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
this.getUseCoupons();
},
methods: {
onLoadFun(){
this.getUseCoupons();
},
// 授权关闭
authColse:function(e){
this.isShowAuth = e
},
getCoupon:function(id,index){
let that = this;
let list = that.couponsList;
let ids = [];
ids.push(id);
//领取优惠券
setCouponReceive(ids).then(function (res) {
list[index].isUse = true;
that.$set(that,'couponsList',list);
that.$util.Tips({ title: '领取成功' });
},function(res){
return that.$util.Tips({title:res.msg});
});
},
/**
* 获取领取优惠券列表
*/
getUseCoupons:function(){
let that=this
if(this.loadend) return false;
if(this.loading) return false;
getCoupons({ page: that.page, limit: that.limit }).then(res=>{
let list=res.data,loadend=list.length < that.limit;
let couponsList = that.$util.SplitArray(list, that.couponsList);
that.$set(that,'couponsList',couponsList);
that.loadend = loadend;
that.loadTitle = loadend ? '我也是有底线的' : '加载更多';
that.page = that.page + 1;
that.loading = false;
}).catch(err=>{
that.loading = false;
that.loadTitle = '加载更多';
});
}
}
}
</script>
<style scoped>
.condition .line-title{
width:90rpx;
padding: 0 10rpx;
box-sizing: border-box;
background:rgba(255,247,247,1);
border:1px solid rgba(232,51,35,1);
opacity:1;
border-radius:20rpx;
font-size:20rpx;
color: #E83323;
margin-right: 12rpx;
}
.condition .line-title.gray{
border-color:#BBB;
color:#bbb;
background-color:#F5F5F5;
}
.coupon-list .pic-num{
color: #FFFFFF;
font-size: 24rpx;
}
</style>

View File

@@ -0,0 +1,232 @@
<template>
<view>
<view class='collectionGoods' v-if="collectProductList.length">
<navigator :url='"/pages/goods_details/index?id="+item.id' hover-class='none' class='item acea-row row-between-wrapper'
v-for="(item,index) in collectProductList" :key="index">
<view class='pictrue'>
<image :src="item.image"></image>
</view>
<view class='text acea-row row-column-between'>
<view class='name line1'>{{item.storeName}}</view>
<view class='acea-row row-between-wrapper'>
<view class='money font-color'>{{item.price}}</view>
<view class='delete' @click.stop='delCollection(item.id,index)'>删除</view>
</view>
</view>
</navigator>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
</view>
<view class='noCommodity' v-else-if="!collectProductList.length && page > 1">
<view class='pictrue'>
<image src='../../../static/images/noCollection.png'></image>
</view>
<recommend :hostProduct="hostProduct"></recommend>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getCollectUserList,
getProductHot,
collectDel
} from '@/api/store.js';
import {
mapGetters
} from "vuex";
import {
toLogin
} from '@/libs/login.js';
import recommend from '@/components/recommend';
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
export default {
components: {
recommend,
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
hostProduct: [],
loadTitle: '加载更多',
loading: false,
loadend: false,
collectProductList: [],
limit: 8,
page: 1,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false ,//是否隐藏授权
hotScroll:false,
hotPage:1,
hotLimit:10
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.get_user_collect_product();
this.get_host_product();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
onShow(){
this.loadend = false;
this.page = 1;
this.collectProductList = [];
this.get_user_collect_product();
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
this.get_user_collect_product();
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.get_user_collect_product();
this.get_host_product();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取收藏产品
*/
get_user_collect_product: function() {
let that = this;
if (this.loading) return;
if (this.loadend) return;
that.loading = true;
that.loadTitle = "";
getCollectUserList({
page: that.page,
limit: that.limit
}).then(res => {
let collectProductList = res.data.list;
let loadend = collectProductList.length < that.limit;
that.collectProductList = that.$util.SplitArray(collectProductList, that.collectProductList);
that.$set(that, 'collectProductList', that.collectProductList);
that.loadend = loadend;
that.loadTitle = loadend ? '我也是有底线的' : '加载更多';
that.page = that.page + 1;
that.loading = false;
}).catch(err => {
that.loading = false;
that.loadTitle = "加载更多";
});
},
/**
* 取消收藏
*/
delCollection: function(id, index) {
let that = this;
collectDel(id).then(res => {
return that.$util.Tips({
title: '取消收藏成功',
icon: 'success'
}, function() {
that.collectProductList.splice(index, 1);
that.$set(that, 'collectProductList', that.collectProductList);
});
});
},
/**
* 获取我的推荐
*/
get_host_product: function() {
let that = this;
if(that.hotScroll) return
getProductHot(
that.hotPage,
that.hotLimit,
).then(res => {
that.hotPage++
that.hotScroll = res.data.list.length<that.hotLimit
that.hostProduct = that.hostProduct.concat(res.data.list)
});
}
},
onReachBottom() {
this.get_host_product();
}
}
</script>
<style scoped lang="scss">
.collectionGoods {
background-color: #fff;
border-top: 1rpx solid #eee;
}
.collectionGoods .item {
margin-left: 30rpx;
padding-right: 30rpx;
border-bottom: 1rpx solid #eee;
height: 180rpx;
}
.collectionGoods .item .pictrue {
width: 130rpx;
height: 130rpx;
}
.collectionGoods .item .pictrue image {
width: 100%;
height: 100%;
border-radius: 6rpx;
}
.collectionGoods .item .text {
width: 535rpx;
height: 130rpx;
font-size: 28rpx;
color: #282828;
}
.collectionGoods .item .text .name {
width: 100%;
}
.collectionGoods .item .text .money {
font-size: 26rpx;
}
.collectionGoods .item .text .delete {
font-size: 26rpx;
color: #282828;
width: 144rpx;
height: 46rpx;
border: 1px solid #bbb;
border-radius: 4rpx;
text-align: center;
line-height: 46rpx;
}
.noCommodity {
background-color: #fff;
padding-top: 1rpx;
border-top: 0;
}
</style>

View File

@@ -0,0 +1,383 @@
<template>
<view>
<form @submit="formSubmit" report-submit='true'>
<view class='personal-data'>
<view class='list'>
<view class="item acea-row row-between-wrapper">
<view>头像</view>
<view class="pictrue" @click.stop='uploadpic'>
<image :src='userInfo.localPath'></image>
<image src='../../../static/images/alter.png' class="alter"></image>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>昵称</view>
<view class='input'><input type='text' name='nickname' :value='userInfo.nickname'></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>手机号码</view>
<navigator url="/pages/users/user_phone/index" hover-class="none" class="input" v-if="!userInfo.phone">
点击绑定手机号<text class="iconfont icon-xiangyou"></text>
</navigator>
<view class='input acea-row row-between-wrapper' v-else>
<input type='text' disabled='true' name='phone' :value='userInfo.phone' class='id'></input>
<text class='iconfont icon-suozi'></text>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>ID号</view>
<view class='input acea-row row-between-wrapper'>
<input type='text' :value='userInfo.uid' disabled='true' class='id'></input>
<text class='iconfont icon-suozi'></text>
</view>
</view>
<!-- #ifdef MP -->
<view class='item acea-row row-between-wrapper'>
<view>权限设置</view>
<view class="input" @click="Setting">
点击管理<text class="iconfont icon-xiangyou"></text>
</view>
</view>
<!-- #endif -->
<view class="item acea-row row-between-wrapper" v-if="userInfo.phone && userInfo.userType == 'h5'">
<view>密码</view>
<navigator url="/pages/users/user_pwd_edit/index" hover-class="none" class="input">
点击修改密码<text class="iconfont icon-xiangyou"></text>
</navigator>
</view>
</view>
<button class='modifyBnt bg-color' formType="submit">保存修改</button>
<!-- #ifdef H5 -->
<view class="logOut cart-color acea-row row-center-wrapper" @click="outLogin" v-if="!this.$wechat.isWeixin()">退出登录</view>
<!-- #endif -->
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
getUserInfo,
userEdit,
getLogout
} from '@/api/user.js';
import {
switchH5Login
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import dayjs from "@/plugin/dayjs/dayjs.min.js";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
userInfo: {},
loginType: 'h5', //app.globalData.loginType
userIndex: 0,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUserInfo();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.getUserInfo();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 小程序设置
*/
Setting: function() {
uni.openSetting({
success: function(res) {
console.log(res.authSetting)
}
});
},
/**
* 退出登录
*
*/
outLogin: function() {
let that = this;
if (that.loginType == 'h5') {
uni.showModal({
title: '提示',
content: '确认退出登录?',
success: function (res) {
if (res.confirm) {
getLogout()
.then(res => {
that.$store.commit("LOGOUT");
uni.switchTab({
url: '/pages/index/index'
});
})
.catch(err => {
console.log(err);
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
},
/**
* 获取用户详情
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
res.data.localPath = res.data.avatar;
that.$set(that, 'userInfo', res.data);
});
},
/**
* 上传文件
*
*/
uploadpic: function() {
let that = this;
that.$util.uploadImageOne({url:'user/upload/image',name:'multipart', model:"user", pid:7}, function(res){
that.userInfo.avatar = res.data.url;
that.$set(that.userInfo,'localPath',res.data.localPath);
});
},
/**
* 提交修改
*/
formSubmit: function(e) {
let that = this,
value = e.detail.value
if (!value.nickname) return that.$util.Tips({
title: '用户姓名不能为空'
});
value.avatar = that.userInfo.avatar;
userEdit(value).then(res => {
return that.$util.Tips({
title: '更换头像已成功',
icon: 'success'
}, {
tab: 3,
url: 1
});
}).catch(msg => {
return that.$util.Tips({
title: msg.message || '保存失败,您并没有修改'
}, {
tab: 3,
url: 1
});
});
}
}
}
</script>
<style scoped lang="scss">
.personal-data .wrapper {
margin: 10rpx 0;
background-color: #fff;
padding: 36rpx 30rpx 13rpx 30rpx;
}
.personal-data .wrapper .title {
margin-bottom: 30rpx;
font-size: 32rpx;
color: #282828;
}
.personal-data .wrapper .wrapList .item {
width: 690rpx;
height: 160rpx;
background-color: #f8f8f8;
border-radius: 20rpx;
margin-bottom: 22rpx;
padding: 0 30rpx;
position: relative;
border: 2rpx solid #f8f8f8;
box-sizing:border-box;
}
.personal-data .wrapper .wrapList .item.on {
border-color: #e93323;
border-radius: 20rpx;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAArIAAACgCAYAAADw+I85AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6M0QzNkY3NzlCNzJCMTFFOTgyNEU4QzhGQTRFRUY2REQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6M0QzNkY3N0FCNzJCMTFFOTgyNEU4QzhGQTRFRUY2REQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozRDM2Rjc3N0I3MkIxMUU5ODI0RThDOEZBNEVFRjZERCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozRDM2Rjc3OEI3MkIxMUU5ODI0RThDOEZBNEVFRjZERCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pn3rJMAAAArUSURBVHja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");
background-size: 100% 100%;
background-color: #fff9f9;
background-repeat: no-repeat;
}
.personal-data .wrapper .wrapList .item .picTxt {
width: 445rpx;
}
.personal-data .wrapper .wrapList .item .picTxt .pictrue {
width: 96rpx;
height: 96rpx;
position: relative;
}
.personal-data .wrapper .wrapList .item .picTxt .pictrue image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.personal-data .wrapper .wrapList .item .picTxt .pictrue .alter {
width: 30rpx;
height: 30rpx;
border-radius: 50%;
position: absolute;
bottom: 0;
right: 0;
}
.personal-data .wrapper .wrapList .item .picTxt .text {
width: 325rpx;
}
.personal-data .wrapper .wrapList .item .picTxt .text .name {
width: 100%;
font-size: 30rpx;
color: #282828;
}
.personal-data .wrapper .wrapList .item .picTxt .text .phone {
font-size: 24rpx;
color: #999;
margin-top: 10rpx;
}
.personal-data .wrapper .wrapList .item .bnt {
font-size: 24rpx;
background-color: #fff;
border-radius: 27rpx;
width: 140rpx;
height: 54rpx;
border: 2rpx solid #e93323;
}
.personal-data .wrapper .wrapList .item .currentBnt {
position: absolute;
right: 0;
top: 0;
font-size: 26rpx;
background-color: rgba(233, 51, 35, 0.1);
width: 140rpx;
height: 48rpx;
border-radius: 0 20rpx 0 20rpx;
}
.personal-data .list {
margin-top: 15rpx;
background-color: #fff;
}
.personal-data .list .item {
padding: 30rpx 30rpx 30rpx 0;
border-bottom: 1rpx solid #f2f2f2;
margin-left: 30rpx;
font-size: 32rpx;
color: #282828;
}
.personal-data .list .item .phone {
width: 160rpx;
height: 56rpx;
font-size: 24rpx;
color: #fff;
line-height: 56rpx;
border-radius: 32rpx
}
.personal-data .list .item .pictrue {
width: 88rpx;
height: 88rpx;
position: relative;
}
.personal-data .list .item .pictrue image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.personal-data .list .item .pictrue .alter{
width: 30rpx;
height: 30rpx;
border-radius: 50%;
position: absolute;
bottom: 0;
right: 0;
}
.personal-data .list .item .input {
width: 415rpx;
text-align: right;
color: #868686;
}
.personal-data .list .item .input .id {
width: 365rpx;
}
.personal-data .list .item .input .iconfont {
font-size: 35rpx;
}
.personal-data .modifyBnt {
font-size: 32rpx;
color: #fff;
width: 690rpx;
height: 90rpx;
border-radius: 50rpx;
text-align: center;
line-height: 90rpx;
margin: 76rpx auto 0 auto;
}
.personal-data .logOut {
font-size: 32rpx;
text-align: center;
width: 690rpx;
height: 90rpx;
border-radius: 45rpx;
margin: 30rpx auto 0 auto;
}
</style>

View File

@@ -0,0 +1,475 @@
<template>
<view>
<form @submit="formSubmit" report-submit='true'>
<view class='personal-data'>
<!-- <view class="wrapper">
<view class="title">管理我的账号</view>
<view class="wrapList">
<view class="item acea-row row-between-wrapper" :class="item.uid === userInfo.uid ? 'on' : ''" v-for="(item,index) in switchUserInfo"
:key="index" @click='switchAccounts(index)'>
<view class="picTxt acea-row row-between-wrapper">
<view class="pictrue" @click.stop='uploadpic' v-if='item.uid === userInfo.uid'>
<image :src='item.avatar'></image>
<image src='../../../static/images/alter.png' class="alter"></image>
</view>
<view class="pictrue" v-else>
<image :src='item.avatar'></image>
</view>
<view class="text">
<view class="name line1">{{ item.nickname }}</view>
<view class="phone" v-if="item.phone && item.user_type !='h5'">绑定手机号{{ item.phone }}</view>
<view class="phone" v-else-if="item.phone && item.user_type =='h5'">账号{{ item.phone }}</view>
<view class="phone" v-else>暂未绑定手机号</view>
</view>
</view>
<view class="currentBnt acea-row row-center-wrapper font-color" v-if='item.uid === userInfo.uid'>
当前账号
</view>
<view class="bnt font-color acea-row row-center-wrapper" v-else>
使用账号
</view>
</view>
</view>
</view> -->
<view class='list'>
<view class="item acea-row row-between-wrapper">
<view>头像</view>
<view class="pictrue" @click.stop='uploadpic'>
<image :src='userInfo.avatar'></image>
<image src='../../../static/images/alter.png' class="alter"></image>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>昵称</view>
<view class='input'><input type='text' name='nickname' :value='userInfo.nickname'></input></view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>手机号码</view>
<navigator url="/pages/user_phone/index" hover-class="none" class="input" v-if="!userInfo.phone">
点击绑定手机号<text class="iconfont icon-xiangyou"></text>
</navigator>
<view class='input acea-row row-between-wrapper' v-else>
<input type='text' disabled='true' name='phone' :value='userInfo.phone' class='id'></input>
<text class='iconfont icon-suozi'></text>
</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view>ID号</view>
<view class='input acea-row row-between-wrapper'>
<input type='text' :value='userInfo.uid' disabled='true' class='id'></input>
<text class='iconfont icon-suozi'></text>
</view>
</view>
<!-- #ifdef MP -->
<view class='item acea-row row-between-wrapper'>
<view>权限设置</view>
<view class="input" @click="Setting">
点击管理<text class="iconfont icon-xiangyou"></text>
</view>
</view>
<!-- #endif -->
<view class="item acea-row row-between-wrapper" v-if="userInfo.phone && userInfo.user_type == 'h5'">
<view>密码</view>
<navigator url="/pages/user_pwd_edit/index" hover-class="none" class="input">
点击修改密码<text class="iconfont icon-xiangyou"></text>
</navigator>
</view>
</view>
<button class='modifyBnt bg-color' formType="submit">保存修改</button>
<!-- #ifdef H5 -->
<view class="logOut cart-color acea-row row-center-wrapper" @click="outLogin" v-if="!this.$wechat.isWeixin()">退出登录</view>
<!-- #endif -->
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
getUserInfo,
userEdit,
getLogout
} from '@/api/user.js';
import {
switchH5Login
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import dayjs from "@/plugin/dayjs/dayjs.min.js";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
userInfo: {},
loginType: 'h5', //app.globalData.loginType
userIndex: 0,
switchUserInfo: [],
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUserInfo();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
/**
* 授权回调
*/
onLoadFun: function() {
this.getUserInfo();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 小程序设置
*/
Setting: function() {
uni.openSetting({
success: function(res) {
console.log(res.authSetting)
}
});
},
switchAccounts: function(index) {
let userInfo = this.switchUserInfo[index],
that = this;
that.userIndex = index;
if (that.switchUserInfo.length <= 1) return true;
if (userInfo === undefined) return that.$util.Tips({
title: '切换的账号不存在'
});
if (userInfo.user_type === 'h5') {
uni.showLoading({
title: '正在切换中'
});
switchH5Login().then(res => {
uni.hideLoading();
let newTime = Math.round(new Date() / 1000);
that.$store.commit("LOGIN", {
'token': res.data.token,
'time': dayjs(res.data.expires_time) - newTime
});
that.getUserInfo();
}).catch(err => {
uni.hideLoading();
return that.$util.Tips({
title: err
});
})
} else {
that.$store.commit("LOGOUT");
uni.showLoading({
title: '正在切换中'
});
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
that.isAuto = true;
that.$set(that, 'isShowAuth', true);
// #endif
}
},
/**
* 退出登录
*
*/
outLogin: function() {
let that = this;
if (that.loginType == 'h5') {
uni.showModal({
title: '提示',
content: '确认退出登录?',
success: function (res) {
if (res.confirm) {
getLogout()
.then(res => {
that.$store.commit("LOGOUT");
uni.switchTab({
url: '/pages/index/index'
});
})
.catch(err => {
console.log(err);
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
},
/**
* 获取用户详情
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.$set(that, 'userInfo', res.data);
let switchUserInfo = res.data.switchUserInfo || [];
for (let i = 0; i < switchUserInfo.length; i++) {
if (switchUserInfo[i].uid == that.userInfo.uid) that.userIndex = i;
// 切割h5用户user_type状态h5、routine小程序、wechat公众号只有h5未注册手机号时h5才可和小程序或是公众号数据想通
//#ifdef H5
if (
!that.$wechat.isWeixin() &&
switchUserInfo[i].user_type != "h5" &&
switchUserInfo[i].phone === ""
)
switchUserInfo.splice(i, 1);
//#endif
}
that.$set(that, "switchUserInfo", switchUserInfo);
});
},
/**
* 上传文件
*
*/
uploadpic: function() {
let that = this;
that.$util.uploadImageOne('upload/image', function(res){
console.log('mmj');
let userInfo = that.switchUserInfo[that.userIndex];
if (userInfo !== undefined) {
userInfo.avatar = res.data.url;
}
that.switchUserInfo[that.userIndex] = userInfo;
that.$set(that,'switchUserInfo',that.switchUserInfo);
});
},
/**
* 提交修改
*/
formSubmit: function(e) {
console.log(e);
let that = this,
value = e.detail.value,
userInfo = that.switchUserInfo[that.userIndex];
if (!value.nickname) return that.$util.Tips({
title: '用户姓名不能为空'
});
console.log('666666666666666666');
// value.avatar = userInfo.avatar;
userEdit(value).then(res => {
return that.$util.Tips({
title: res.msg,
icon: 'success'
}, {
tab: 3,
url: 1
});
}).catch(msg => {
return that.$util.Tips({
title: msg || '保存失败,您并没有修改'
}, {
tab: 3,
url: 1
});
});
}
}
}
</script>
<style scoped lang="scss">
.personal-data .wrapper {
margin: 10rpx 0;
background-color: #fff;
padding: 36rpx 30rpx 13rpx 30rpx;
}
.personal-data .wrapper .title {
margin-bottom: 30rpx;
font-size: 32rpx;
color: #282828;
}
.personal-data .wrapper .wrapList .item {
width: 690rpx;
height: 160rpx;
background-color: #f8f8f8;
border-radius: 20rpx;
margin-bottom: 22rpx;
padding: 0 30rpx;
position: relative;
border: 2rpx solid #f8f8f8;
box-sizing:border-box;
}
.personal-data .wrapper .wrapList .item.on {
border-color: #e93323;
border-radius: 20rpx;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAArIAAACgCAYAAADw+I85AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6M0QzNkY3NzlCNzJCMTFFOTgyNEU4QzhGQTRFRUY2REQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6M0QzNkY3N0FCNzJCMTFFOTgyNEU4QzhGQTRFRUY2REQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozRDM2Rjc3N0I3MkIxMUU5ODI0RThDOEZBNEVFRjZERCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozRDM2Rjc3OEI3MkIxMUU5ODI0RThDOEZBNEVFRjZERCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pn3rJMAAAArUSURBVHja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");
background-size: 100% 100%;
background-color: #fff9f9;
background-repeat: no-repeat;
}
.personal-data .wrapper .wrapList .item .picTxt {
width: 445rpx;
}
.personal-data .wrapper .wrapList .item .picTxt .pictrue {
width: 96rpx;
height: 96rpx;
position: relative;
}
.personal-data .wrapper .wrapList .item .picTxt .pictrue image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.personal-data .wrapper .wrapList .item .picTxt .pictrue .alter {
width: 30rpx;
height: 30rpx;
border-radius: 50%;
position: absolute;
bottom: 0;
right: 0;
}
.personal-data .wrapper .wrapList .item .picTxt .text {
width: 325rpx;
}
.personal-data .wrapper .wrapList .item .picTxt .text .name {
width: 100%;
font-size: 30rpx;
color: #282828;
}
.personal-data .wrapper .wrapList .item .picTxt .text .phone {
font-size: 24rpx;
color: #999;
margin-top: 10rpx;
}
.personal-data .wrapper .wrapList .item .bnt {
font-size: 24rpx;
background-color: #fff;
border-radius: 27rpx;
width: 140rpx;
height: 54rpx;
border: 2rpx solid #e93323;
}
.personal-data .wrapper .wrapList .item .currentBnt {
position: absolute;
right: 0;
top: 0;
font-size: 26rpx;
background-color: rgba(233, 51, 35, 0.1);
width: 140rpx;
height: 48rpx;
border-radius: 0 20rpx 0 20rpx;
}
.personal-data .list {
margin-top: 15rpx;
background-color: #fff;
}
.personal-data .list .item {
padding: 30rpx 30rpx 30rpx 0;
border-bottom: 1rpx solid #f2f2f2;
margin-left: 30rpx;
font-size: 32rpx;
color: #282828;
}
.personal-data .list .item .phone {
width: 160rpx;
height: 56rpx;
font-size: 24rpx;
color: #fff;
line-height: 56rpx;
border-radius: 32rpx
}
.personal-data .list .item .pictrue {
width: 88rpx;
height: 88rpx;
position: relative;
}
.personal-data .list .item .pictrue image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.personal-data .list .item .pictrue .alter{
width: 30rpx;
height: 30rpx;
border-radius: 50%;
position: absolute;
bottom: 0;
right: 0;
}
.personal-data .list .item .input {
width: 415rpx;
text-align: right;
color: #868686;
}
.personal-data .list .item .input .id {
width: 365rpx;
}
.personal-data .list .item .input .iconfont {
font-size: 35rpx;
}
.personal-data .modifyBnt {
font-size: 32rpx;
color: #fff;
width: 690rpx;
height: 90rpx;
border-radius: 50rpx;
text-align: center;
line-height: 90rpx;
margin: 76rpx auto 0 auto;
}
.personal-data .logOut {
font-size: 32rpx;
text-align: center;
width: 690rpx;
height: 90rpx;
border-radius: 45rpx;
margin: 30rpx auto 0 auto;
}
</style>

View File

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,447 @@
<template>
<view>
<view class='my-account'>
<view class='wrapper'>
<view class='header'>
<view class='headerCon'>
<view class='account acea-row row-top row-between'>
<view class='assets'>
<view>总资产()</view>
<view class='money'>{{statistics.nowMoney || 0}}</view>
</view>
<!-- #ifdef APP-PLUS || H5 -->
<navigator url="/pages/users/user_payment/index" hover-class="none" class='recharge font-color'>充值</navigator>
<!-- #endif -->
<!-- #ifdef MP -->
<view @click="openSubscribe('/pages/users/user_payment/index')" class='recharge font-color'>充值</view>
<!-- #endif -->
</view>
<view class='cumulative acea-row row-top'>
<view class='item'>
<view>累计充值()</view>
<view class='money'>{{statistics.recharge || 0}}</view>
</view>
<view class='item'>
<view>累计消费()</view>
<view class='money'>{{statistics.orderStatusSum || 0}}</view>
</view>
</view>
</view>
</view>
<view class='nav acea-row row-middle'>
<navigator class='item' hover-class='none' url='/pages/users/user_bill/index'>
<view class='pictrue'>
<image src='../../../static/images/record1.png'></image>
</view>
<view>账单记录</view>
</navigator>
<navigator class='item' hover-class='none' url='/pages/users/user_bill/index?type=1'>
<view class='pictrue'>
<image src='../../../static/images/record2.png'></image>
</view>
<view>消费记录</view>
</navigator>
<navigator class='item' hover-class='none' url='/pages/users/user_bill/index?type=2' v-if="recharge_switch">
<view class='pictrue'>
<image src='../../../static/images/record3.png'></image>
</view>
<view>充值记录</view>
</navigator>
<navigator class='item' hover-class='none' url='/pages/users/user_integral/index'>
<view class='pictrue'>
<image src='../../../static/images/record4.png'></image>
</view>
<view>积分中心</view>
</navigator>
</view>
<view class='advert acea-row row-between-wrapper'>
<navigator class='item acea-row row-between-wrapper' hover-class='none' url='/pages/users/user_sgin/index'>
<view class='text'>
<view class='name'>签到领积分</view>
<view>赚积分抵现金</view>
</view>
<view class='pictrue'>
<image src='../../../static/images/gift.png'></image>
</view>
</navigator>
<navigator class='item on acea-row row-between-wrapper' hover-class='none' url='/pages/users/user_get_coupon/index'>
<view class='text'>
<view class='name'>领取优惠券</view>
<view>满减享优惠</view>
</view>
<view class='pictrue'>
<image src='../../../static/images/money.png'></image>
</view>
</navigator>
</view>
<!-- <view class='list'>
<view class='item acea-row row-between-wrapper'>
<view class='picTxt acea-row row-between-wrapper'>
<view class='iconfont icon-hebingxingzhuang'></view>
<view class='text'>
<view class='line1'>最新拼团活动</view>
<view class='infor line1'>最新的优惠商品上架拼团</view>
</view>
</view>
<navigator hover-class='none' url='/pages/activity/goods_combination/index' class='bnt' v-if="activity.is_pink">立即参与</navigator>
<view class='bnt end' v-else>已结束</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='picTxt acea-row row-between-wrapper'>
<view class='iconfont icon-miaosha yellow'></view>
<view class='text'>
<view class='line1'>当前限时秒杀</view>
<view class='infor line1'>最新商品秒杀进行中</view>
</view>
</view>
<navigator hover-class='none' url='/pages/activity/goods_seckill/index' class='bnt' v-if="activity.is_seckill">立即参与</navigator>
<view class='bnt end' v-else>已结束</view>
</view>
<view class='item acea-row row-between-wrapper'>
<view class='picTxt acea-row row-between-wrapper'>
<view class='iconfont icon-kanjia1 green'></view>
<view class='text'>
<view class='line1'>砍价活动</view>
<view class='infor line1'>呼朋唤友来砍价</view>
</view>
</view>
<navigator hover-class='none' url='/pages/activity/goods_bargain/index' class='bnt' v-if="activity.is_bargin">立即参与</navigator>
<view class='bnt end' v-else>已结束</view>
</view>
</view> -->
</view>
<recommend :hostProduct="hostProduct" v-if="hostProduct.length"></recommend>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getProductHot
} from '@/api/store.js';
import {
openRechargeSubscribe
} from '@/utils/SubscribeMessage.js';
import {
getUserInfo,
userActivity,
getuserDalance
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
import recommend from '@/components/recommend/index';
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
export default {
components: {
recommend,
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
userInfo: {},
hostProduct: [],
isClose: false,
recharge_switch: 0,
activity: {},
isAuto: false, //没有授权的不会自动授权
isShowAuth: false ,//是否隐藏授权
hotScroll:false,
statistics:{},
hotPage:1,
hotLimit:10
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUserInfo();
this.get_host_product();
this.get_activity();
this.userDalance();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
onLoadFun: function() {
this.getUserInfo();
this.get_host_product();
this.get_activity();
this.userDalance();
},
userDalance(){
getuserDalance().then(res=>{
this.statistics = res.data;
})
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
// #ifdef MP
openSubscribe: function(page) {
uni.showLoading({
title: '正在加载',
})
openRechargeSubscribe().then(res => {
uni.hideLoading();
uni.navigateTo({
url: page,
});
}).catch(() => {
uni.hideLoading();
});
},
// #endif
/**
* 获取用户详情
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.$set(that, 'userInfo', res.data);
that.recharge_switch = res.data.recharge_switch;
});
},
/**
* 获取活动可参与否
*/
get_activity: function() {
// let that = this;
// userActivity().then(res => {
// that.$set(that, "activity", res.data);
// })
},
/**
* 获取我的推荐
*/
get_host_product: function() {
let that = this;
if(that.hotScroll) return
getProductHot(
that.hotPage,
that.hotLimit,
).then(res => {
that.hotPage++
that.hotScroll = res.data.list.length<that.hotLimit
that.hostProduct = that.hostProduct.concat(res.data.list)
});
}
},
onReachBottom() {
this.get_host_product();
}
}
</script>
<style scoped lang="scss">
.my-account .wrapper {
background-color: #fff;
padding: 32rpx 0 34rpx 0;
margin-bottom: 14rpx;
}
.my-account .wrapper .header {
width: 690rpx;
height: 330rpx;
background-image: linear-gradient(to right, #f33b2b 0%, #f36053 100%);
border-radius: 16rpx;
margin: 0 auto;
box-sizing: border-box;
color: rgba(255, 255, 255, 0.6);
font-size: 24rpx;
}
.my-account .wrapper .header .headerCon {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAArIAAAFKCAYAAADhULxpAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkEzMUM4RDlEM0YxNTExRTk4OUJFQ0Q4Qjg0RDBCMzQ1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkEzMUM4RDlFM0YxNTExRTk4OUJFQ0Q4Qjg0RDBCMzQ1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTMxQzhEOUIzRjE1MTFFOTg5QkVDRDhCODREMEIzNDUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTMxQzhEOUMzRjE1MTFFOTg5QkVDRDhCODREMEIzNDUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6ymvxvAAAIhklEQVR42uzd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');
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
width: 100%;
padding: 36rpx 0 29rpx 0;
box-sizing: border-box;
}
.my-account .wrapper .header .headerCon .account {
padding: 0 35rpx;
}
.my-account .wrapper .header .headerCon .account .assets .money {
font-size: 72rpx;
color: #fff;
font-family: 'Guildford Pro';
}
.my-account .wrapper .header .headerCon .account .recharge {
font-size: 28rpx;
width: 150rpx;
height: 54rpx;
border-radius: 27rpx;
background-color: #fff9f8;
text-align: center;
line-height: 54rpx;
}
.my-account .wrapper .header .headerCon .cumulative {
margin-top: 46rpx;
}
.my-account .wrapper .header .headerCon .cumulative .item {
flex: 1;
padding-left: 35rpx;
}
.my-account .wrapper .header .headerCon .cumulative .item .money {
font-size: 48rpx;
font-family: 'Guildford Pro';
color: #fff;
margin-top: 6rpx;
}
.my-account .wrapper .nav {
height: 155rpx;
border-bottom: 1rpx solid #f5f5f5;
}
.my-account .wrapper .nav .item {
flex: 1;
text-align: center;
font-size: 26rpx;
color: #999;
}
.my-account .wrapper .nav .item .pictrue {
width: 44rpx;
height: 44rpx;
margin: 0 auto;
margin-bottom: 20rpx;
}
.my-account .wrapper .nav .item .pictrue image {
width: 100%;
height: 100%;
}
.my-account .wrapper .advert {
padding: 0 30rpx;
margin-top: 30rpx;
}
.my-account .wrapper .advert .item {
background-color: #fff6d1;
width: 332rpx;
height: 118rpx;
border-radius: 10rpx;
padding: 0 27rpx 0 25rpx;
box-sizing: border-box;
font-size: 24rpx;
color: #e44609;
}
.my-account .wrapper .advert .item.on {
background-color: #fff3f3;
color: #e96868;
}
.my-account .wrapper .advert .item .pictrue {
width: 78rpx;
height: 78rpx;
}
.my-account .wrapper .advert .item .pictrue image {
width: 100%;
height: 100%;
}
.my-account .wrapper .advert .item .text .name {
font-size: 30rpx;
font-weight: bold;
color: #f33c2b;
margin-bottom: 7rpx;
}
.my-account .wrapper .advert .item.on .text .name {
color: #f64051;
}
.my-account .wrapper .list {
padding: 0 30rpx;
}
.my-account .wrapper .list .item {
margin-top: 44rpx;
}
.my-account .wrapper .list .item .picTxt .iconfont {
width: 82rpx;
height: 82rpx;
border-radius: 50%;
background-image: linear-gradient(to right, #ff9389 0%, #f9776b 100%);
text-align: center;
line-height: 82rpx;
color: #fff;
font-size: 40rpx;
}
.my-account .wrapper .list .item .picTxt .iconfont.yellow {
background-image: linear-gradient(to right, #ffccaa 0%, #fea060 100%);
}
.my-account .wrapper .list .item .picTxt .iconfont.green {
background-image: linear-gradient(to right, #a1d67c 0%, #9dd074 100%);
}
.my-account .wrapper .list .item .picTxt {
width: 428rpx;
font-size: 30rpx;
color: #282828;
}
.my-account .wrapper .list .item .picTxt .text {
width: 317rpx;
}
.my-account .wrapper .list .item .picTxt .text .infor {
font-size: 24rpx;
color: #999;
margin-top: 5rpx;
}
.my-account .wrapper .list .item .bnt {
font-size: 26rpx;
color: #282828;
width: 156rpx;
height: 52rpx;
border: 1rpx solid #ddd;
border-radius: 26rpx;
text-align: center;
line-height: 52rpx;
}
.my-account .wrapper .list .item .bnt.end {
font-size: 26rpx;
color: #aaa;
background-color: #f2f2f2;
border-color: #f2f2f2;
}
</style>

View File

@@ -0,0 +1,539 @@
<template>
<view>
<form @submit="submitSub" report-submit='true'>
<view class="payment-top acea-row row-column row-center-wrapper">
<span class="name">我的余额</span>
<view class="pic">
<span class="pic-font">{{ userinfo.nowMoney || 0 }}</span>
</view>
</view>
<view class="payment">
<view class="nav acea-row row-around row-middle">
<view class="item" :class="active==index?'on':''" v-for="(item,index) in navRecharge" :key="index" @click="navRecharges(index)">{{item}}</view>
</view>
<view class='tip picList' v-if='!active'>
<view class="pic-box pic-box-color acea-row row-center-wrapper row-column" :class="activePic == index ? 'pic-box-color-active' : ''"
v-for="(item, index) in picList" :key="index" @click="picCharge(index, item)">
<view class="pic-number-pic">
{{ item.price }}<span class="pic-number"> </span>
</view>
<view class="pic-number">赠送{{ item.giveMoney }} </view>
</view>
<view class="pic-box pic-box-color acea-row row-center-wrapper" :class="activePic == picList.length ? 'pic-box-color-active' : ''"
@click="picCharge(picList.length)">
<input type="number" placeholder="其他" v-model="money" class="pic-box-money pic-number-pic" :class="activePic == picList.length ? 'pic-box-color-active' : ''" />
</view>
<view class="tips-box">
<view class="tips mt-30">注意事项</view>
<view class="tips-samll" v-for="item in rechargeAttention" :key="item">
{{ item }}
</view>
</view>
</view>
<view class="tip" v-else>
<view class='input'><text></text><input placeholder="0.00" type='number' placeholder-class='placeholder' :value="number"
name="number"></input></view>
<view class="tips-title">
<view style="font-weight: bold; font-size: 26rpx;">提示</view>
<view style="margin-top: 10rpx;">当前佣金为 <text class='font-color'>{{commission || 0}}</text></view>
</view>
<view class="tips-box">
<view class="tips mt-30">注意事项</view>
<view class="tips-samll" v-for="item in rechargeAttention" :key="item">
{{ item }}
</view>
</view>
</view>
<button class='but bg-color' formType="submit"> {{active ? '立即转入': '立即充值' }}</button>
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getUserInfo,
rechargeRoutine,
rechargeWechat,
getRechargeApi,
extractBank,
transferIn
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
let that = this;
return {
now_money: 0,
navRecharge: ['账户充值', '佣金转入'],
active: 0,
number: '',
userinfo: {},
placeholder: "0.00",
from: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
picList: [],
activePic: 0,
money: "",
numberPic: '',
rechar_id: 0,
rechargeAttention: [],
commission: 0
};
},
computed: mapGetters(['isLogin']),
onLoad(options) {
// #ifdef H5
this.from = this.$wechat.isWeixin() ? "public" : "weixinh5"
// #endif
if (this.isLogin) {
this.getUserInfo();
this.getRecharge();
this.getUserExtractBank();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
/**
* 选择金额
*/
picCharge(idx, item) {
this.activePic = idx;
if (item === undefined) {
this.rechar_id = 0;
this.numberPic = "";
} else {
this.money = "";
this.rechar_id = item.id;
this.numberPic = item.price;
}
},
getUserExtractBank: function() {
let that = this;
extractBank().then(res => {
that.commission = res.data.commissionCount;
});
},
/**
* 充值额度选择
*/
getRecharge() {
getRechargeApi()
.then(res => {
this.picList = res.data.rechargeQuota;
if (this.picList[0]) {
this.rechar_id = this.picList[0].id;
this.numberPic = this.picList[0].price;
}
this.rechargeAttention = res.data.rechargeAttention || [];
})
.catch(res => {
this.$dialog.toast({
mes: res
});
});
},
onLoadFun: function() {
this.getUserInfo();
this.getRecharge();
this.getUserExtractBank();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
navRecharges: function(index) {
this.active = index;
},
/**
* 获取用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
that.$set(that, 'userinfo', res.data);
})
},
/*
* 用户充值
*/
submitSub: function(e) {
let that = this
let value = e.detail.value.number;
// 转入余额
if (that.active) {
if (parseFloat(value) < 0 || parseFloat(value) == NaN || value == undefined || value == "") {
return that.$util.Tips({
title: '请输入金额'
});
}
uni.showModal({
title: '转入余额',
content: '转入余额后无法再次转出,确认是否转入余额',
success(res) {
if (res.confirm) {
transferIn({
price: parseFloat(value)
}).then(res => {
return that.$util.Tips({
title: '转入成功',
icon: 'success'
}, {
tab: 5,
url: '/pages/users/user_money/index'
});
})
// // #ifdef MP || APP-PLUS
// rechargeRoutine({
// price: parseFloat(value),
// type: 1
// })
// // #endif
// // #ifdef H5
// rechargeWechat({
// price: parseFloat(value),
// from: that.from,
// type: 1
// })
// // #endif
// .then(res => {
// return that.$util.Tips({
// title: '转入成功',
// icon: 'success'
// }, {
// tab: 5,
// url: '/pages/users/user_money/index'
// });
// }).catch(err => {
// return that.$util.Tips({
// title: err
// })
// });
} else if (res.cancel) {
return that.$util.Tips({
title: '已取消'
});
}
},
})
} else {
uni.showLoading({
title: '正在支付',
})
// #ifdef MP || APP-PLUS
let money = parseFloat(this.money);
if (this.rechar_id == 0) {
if (Number.isNaN(money)) {
return that.$util.Tips({
title: '充值金额必须为数字'
});
}
if (money <= 0) {
return that.$util.Tips({
title: '充值金额不能为0'
});
}
} else {
money = this.numberPic
}
rechargeRoutine({
price: money,
type: 0,
rechar_id: this.rechar_id
}).then(res => {
uni.hideLoading();
let jsConfig = res.data.data;
let packages = 'prepay_id=' + jsConfig.prepayId;
uni.requestPayment({
timeStamp: jsConfig.timeStamp.toString(),
nonceStr: jsConfig.nonceStr,
package: packages,
signType: jsConfig.signType,
paySign: jsConfig.paySign,
success: function(res) {
that.$set(that, 'userinfo.nowMoney', that.$util.$h.Add(value, that.userinfo.nowMoney));
return that.$util.Tips({
title: '支付成功',
icon: 'success'
}, {
tab: 5,
url: '/pages/users/user_money/index'
});
},
fail: function(err) {
console.log(err);
return that.$util.Tips({
title: '支付失败'
});
},
complete: function(res) {
if (res.errMsg == 'requestPayment:cancel') return that.$util.Tips({
title: '取消支付'
});
}
})
}).catch(err => {
uni.hideLoading();
return that.$util.Tips({
title: err
})
});
// #endif
// #ifdef H5
rechargeWechat({
price: that.rechar_id == 0 ? that.money : that.numberPic,
from: that.from,
rechar_id: that.rechar_id,
payType: 0
}).then(res => {
let jsConfig = res.data;
let packages = 'prepay_id=' + jsConfig.prepayId;
let data = {
timestamp:jsConfig.timeStamp,
nonceStr:jsConfig.nonceStr,
package:packages,
signType:jsConfig.signType,
paySign:jsConfig.paySign,
h5PayUrl:jsConfig.h5PayUrl
};
if (that.from == "weixinh5") {
let domain = encodeURIComponent(location.href.split('/pages')[0]);
let urls = data.h5PayUrl + '&redirect_url='+ domain + '/pages/users/user_money/index';
location.replace(urls);
return that.$util.Tips({
title: '支付成功',
icon: 'success'
}, {
tab: 5,
url: '/pages/users/user_money/index'
});
} else {
that.$wechat.pay(data)
.finally(() => {
that.$set(that, 'userinfo.nowMoney', that.$util.$h.Add(value, that.userinfo.nowMoney));
return that.$util.Tips({
title: '支付成功',
icon: 'success'
}, {
tab: 5,
url: '/pages/users/user_money/index'
});
})
.catch(function(err) {
console.log(err);
return that.$util.Tips({
title: '支付失败'
});
});
}
})
// #endif
}
}
}
}
</script>
<style lang="scss">
page {
width: 100%;
height: 100%;
background-color: #fff;
}
.payment {
position: relative;
top: -60rpx;
width: 100%;
background-color: #fff;
border-radius: 10rpx;
padding-top: 25rpx;
border-top-right-radius: 39rpx;
border-top-left-radius: 39rpx;
}
.payment .nav {
height: 75rpx;
line-height: 75rpx;
padding: 0 100rpx;
}
.payment .nav .item {
font-size: 30rpx;
color: #333;
}
.payment .nav .item.on {
font-weight: bold;
border-bottom: 4rpx solid #e83323;
}
.payment .input {
display: flex;
align-items: center;
justify-content: center;
border-bottom: 1px dashed #dddddd;
margin: 60rpx auto 0 auto;
padding-bottom: 20rpx;
font-size: 56rpx;
color: #333333;
flex-wrap: nowrap;
}
.payment .input text {
padding-left: 106rpx;
}
.payment .input input {
padding-right: 106rpx;
width: 300rpx;
height: 94rpx;
text-align: center;
font-size: 70rpx;
}
.payment .placeholder {
color: #d0d0d0;
height: 100%;
line-height: 94rpx;
}
.payment .tip {
font-size: 26rpx;
color: #888888;
padding: 0 30rpx;
margin-top: 25rpx;
}
.payment .but {
color: #fff;
font-size: 30rpx;
width: 700rpx;
height: 86rpx;
border-radius: 50rpx;
margin: 46rpx auto 0 auto;
line-height: 86rpx;
}
.payment-top {
width: 100%;
height: 350rpx;
background-color: #e83323;
.name {
font-size: 26rpx;
color: rgba(255, 255, 255, 0.8);
margin-top: -38rpx;
margin-bottom: 30rpx;
}
.pic {
font-size: 32rpx;
color: #fff;
}
.pic-font {
font-size: 78rpx;
color: #fff;
}
}
.picList {
display: flex;
flex-wrap: wrap;
margin: 30rpx 0;
.pic-box {
width: 32%;
height: auto;
border-radius: 20rpx;
margin-top: 21rpx;
padding: 20rpx 0;
margin-right: 12rpx;
&:nth-child(3n) {
margin-right: 0;
}
}
.pic-box-color {
background-color: #f4f4f4;
color: #656565;
}
.pic-number {
font-size: 22rpx;
}
.pic-number-pic {
font-size: 38rpx;
margin-right: 10rpx;
text-align: center;
}
.pic-box-color-active {
background-color: #ec3323 !important;
color: #fff !important;
}
}
.tips-box {
.tips {
font-size: 28rpx;
color: #333333;
font-weight: 800;
margin-bottom: 14rpx;
margin-top: 20rpx;
}
.tips-samll {
font-size: 24rpx;
color: #333333;
margin-bottom: 14rpx;
}
.tip-box {
margin-top: 30rpx;
}
}
.tips-title {
margin-top: 20rpx;
font-size: 24rpx;
color: #333;
}
</style>

View File

@@ -0,0 +1,205 @@
<template>
<view>
<form @submit="editPwd" report-submit='true'>
<view class="ChangePassword">
<view class="list">
<view class="item">
<input type='number' placeholder='填写手机号码' placeholder-class='placeholder' v-model="phone"></input>
</view>
<view class="item acea-row row-between-wrapper">
<input type='number' placeholder='填写验证码' placeholder-class='placeholder' class="codeIput" v-model="captcha"></input>
<button class="code font-color" :class="disabled === true ? 'on' : ''" :disabled='disabled' @click="code">
{{ text }}
</button>
</view>
</view>
<button form-type="submit" class="confirmBnt bg-color">确认绑定</button>
</view>
</form>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
registerVerify,
bindingPhone,
verifyCode
} from '@/api/api.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
mixins: [sendVerifyCode],
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
phone:'',
captcha:'',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
key: ''
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
// verifyCode().then(res=>{
// this.$set(this, 'key', res.data.key)
// });
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
onLoadFun:function(){},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
editPwd: function() {
let that = this;
if (!that.phone) return that.$util.Tips({
title: '请填写手机号码!'
});
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) return that.$util.Tips({
title: '请输入正确的手机号码!'
});
if (!that.captcha) return that.$util.Tips({
title: '请填写验证码'
});
uni.showModal({
title: '是否绑定账号',
confirmText: '绑定',
success(res) {
if (res.confirm) {
bindingPhone({
account: that.phone,
captcha: that.captcha
}).then(res => {
return that.$util.Tips({
title: res.message,
icon: 'success'
}, {
tab: 5,
url: '/pages/users/user_info/index'
});
}).catch(err => {
return that.$util.Tips({
title: err
});
})
} else if (res.cancel) {
return that.$util.Tips({
title: '您已取消绑定!'
}, {
tab: 5,
url: '/pages/users/user_info/index'
});
}
}
});
},
/**
* 发送验证码
*
*/
async code() {
let that = this;
if (!that.phone) return that.$util.Tips({
title: '请填写手机号码!'
});
if (!(/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.phone))) return that.$util.Tips({
title: '请输入正确的手机号码!'
});
await registerVerify(that.phone).then(res => {
that.$util.Tips({
title: res.message
});
that.sendCode();
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #fff !important;
}
.ChangePassword .phone {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 55rpx;
}
.ChangePassword .list {
width: 580rpx;
margin: 53rpx auto 0 auto;
}
.ChangePassword .list .item {
width: 100%;
height: 110rpx;
border-bottom: 2rpx solid #f0f0f0;
}
.ChangePassword .list .item input {
width: 100%;
height: 100%;
font-size: 32rpx;
}
.ChangePassword .list .item .placeholder {
color: #b9b9bc;
}
.ChangePassword .list .item input.codeIput {
width: 340rpx;
}
.ChangePassword .list .item .code {
font-size: 32rpx;
background-color: #fff;
}
.ChangePassword .list .item .code.on {
color: #b9b9bc !important;
}
.ChangePassword .confirmBnt {
font-size: 32rpx;
width: 580rpx;
height: 90rpx;
border-radius: 45rpx;
color: #fff;
margin: 92rpx auto 0 auto;
text-align: center;
line-height: 90rpx;
}
</style>

View File

@@ -0,0 +1,218 @@
<template>
<view>
<view class="ChangePassword">
<form @submit="editPwd" report-submit='true'>
<view class="phone">当前手机号{{phone}}</view>
<view class="list">
<view class="item">
<input type='password' placeholder='设置新密码' placeholder-class='placeholder' name="password" :value="password"></input>
</view>
<view class="item">
<input type='password' placeholder='确认新密码' placeholder-class='placeholder' name="qr_password" :value="qr_password"></input>
</view>
<view class="item acea-row row-between-wrapper">
<input type='number' placeholder='填写验证码' placeholder-class='placeholder' class="codeIput" name="captcha" :value="captcha"></input>
<button class="code font-color" :class="disabled === true ? 'on' : ''" :disabled='disabled' @click="code">
{{ text }}
</button>
</view>
</view>
<button form-type="submit" class="confirmBnt bg-color">确认修改</button>
</form>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import sendVerifyCode from "@/mixins/SendVerifyCode";
import {
phoneRegisterReset,
registerVerify
} from '@/api/api.js';
import {
getUserInfo
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
mixins: [sendVerifyCode],
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
userInfo: {},
phone: '',
password: '',
captcha: '',
qr_password: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getUserInfo();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
methods: {
/**
* 授权回调
*/
onLoadFun: function(e) {
this.getUserInfo();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取个人用户信息
*/
getUserInfo: function() {
let that = this;
getUserInfo().then(res => {
let tel = res.data.phone;
let phone = tel.substr(0, 3) + "****" + tel.substr(7);
that.$set(that, 'userInfo', res.data);
that.phone = phone;
});
},
/**
* 发送验证码
*
*/
async code() {
let that = this;
if (!that.userInfo.phone) return that.$util.Tips({
title: '手机号码不存在,无法发送验证码!'
});
await registerVerify(that.userInfo.phone).then(res => {
that.$util.Tips({
title: res.message
});
that.sendCode();
}).catch(err => {
return that.$util.Tips({
title: err
});
});
},
/**
* H5登录 修改密码
*
*/
editPwd: function(e) {
let that = this,
password = e.detail.value.password,
qr_password = e.detail.value.qr_password,
captcha = e.detail.value.captcha;
if (!password) return that.$util.Tips({
title: '请输入新密码'
});
if (qr_password != password) return that.$util.Tips({
title: '两次输入的密码不一致!'
});
if (!captcha) return that.$util.Tips({
title: '请输入验证码'
});
phoneRegisterReset({
account: that.userInfo.phone,
captcha: captcha,
password: password
}).then(res => {
return that.$util.Tips({
title: res.message
}, {
tab: 3,
url: 1
});
}).catch(err => {
return that.$util.Tips({
title: err
});
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #fff !important;
}
.ChangePassword .phone {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-top: 55rpx;
}
.ChangePassword .list {
width: 580rpx;
margin: 53rpx auto 0 auto;
}
.ChangePassword .list .item {
width: 100%;
height: 110rpx;
border-bottom: 2rpx solid #f0f0f0;
}
.ChangePassword .list .item input {
width: 100%;
height: 100%;
font-size: 32rpx;
}
.ChangePassword .list .item .placeholder {
color: #b9b9bc;
}
.ChangePassword .list .item input.codeIput {
width: 340rpx;
}
.ChangePassword .list .item .code {
font-size: 32rpx;
background-color: #fff;
}
.ChangePassword .list .item .code.on {
color: #b9b9bc !important;
}
.ChangePassword .confirmBnt {
font-size: 32rpx;
width: 580rpx;
height: 90rpx;
border-radius: 45rpx;
color: #fff;
margin: 92rpx auto 0 auto;
text-align: center;
line-height: 90rpx;
}
</style>

View File

@@ -0,0 +1,185 @@
<template>
<view>
<view class='return-list' v-if="orderList.length">
<view class='goodWrapper' v-for="(item,index) in orderList" :key="index" @click='goOrderDetails(item.storeOrder.orderId)'>
<view class='iconfont icon-tuikuanzhong powder' v-if="item.status.type==-1"></view>
<view class='iconfont icon-yituikuan' v-if="item.status.type==-2"></view>
<view class='orderNum'>订单号{{item.storeOrder.orderId}}</view>
<view class='item acea-row row-between-wrapper' v-for="(item,index) in item.cartInfo" :key="index">
<view class='pictrue'>
<image :src='item.info.productInfo.image'></image>
</view>
<view class='text'>
<view class='acea-row row-between-wrapper'>
<view class='name line1'>{{item.info.productInfo.storeName}}</view>
<view class='num'>x {{item.info.cartNum}}</view>
</view>
<view class='attr line1' v-if="item.info.productInfo.attrInfo">{{item.info.productInfo.attrInfo.suk}}</view>
<view class='attr line1' v-else>{{item.info.productInfo.storeName}}</view>
<view class='money'>{{item.info.productInfo.price}}</view>
</view>
</view>
<view class='totalSum'>{{item.cartInfo.length || 0}}件商品总金额 <text class='font-color price'>{{item.storeOrder.payPrice}}</text></view>
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import home from '@/components/home';
import {
getOrderList
} from '@/api/order.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
home,
// #ifdef MP
authorize
// #endif
},
data() {
return {
loading: false,
loadend: false,
loadTitle: '加载更多', //提示语
orderList: [], //订单数组
orderStatus: -3, //订单状态
page: 1,
limit: 20,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
this.getOrderList();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
this.getOrderList();
},
methods: {
onLoadFun() {
this.getOrderList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 去订单详情
*/
goOrderDetails: function(order_id) {
if (!order_id) return that.$util.Tips({
title: '缺少订单号无法查看订单详情'
});
uni.navigateTo({
url: '/pages/order_details/index?order_id=' + order_id + '&isReturen=1'
})
},
/**
* 获取订单列表
*/
getOrderList: function() {
let that = this;
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
that.loadTitle = "";
getOrderList({
type: that.orderStatus,
page: that.page,
limit: that.limit,
}).then(res => {
let list = res.data || [];
let loadend = list.length < that.limit;
that.orderList = that.$util.SplitArray(list, that.orderList);
that.$set(that,'orderList',that.orderList);
console.log('8888888888888888888');
console.log(that.orderList);
that.loadend = loadend;
that.loading = false;
that.loadTitle = loadend ? "我也是有底线的" : '加载更多';
that.page = that.page + 1;
}).catch(err => {
that.loading = false;
that.loadTitle = "加载更多";
});
}
}
}
</script>
<style lang="scss" scoped>
.return-list .goodWrapper {
background-color: #fff;
margin-top: 13rpx;
position: relative;
}
.return-list .goodWrapper .orderNum {
padding: 0 30rpx;
border-bottom: 1px solid #eee;
height: 87rpx;
line-height: 87rpx;
font-size: 30rpx;
color: #282828;
}
.return-list .goodWrapper .item {
border-bottom: 0;
}
.return-list .goodWrapper .totalSum {
padding: 0 30rpx 32rpx 30rpx;
text-align: right;
font-size: 26rpx;
color: #282828;
}
.return-list .goodWrapper .totalSum .price {
font-size: 28rpx;
font-weight: bold;
}
.return-list .goodWrapper .iconfont {
position: absolute;
font-size: 109rpx;
top: 7rpx;
right: 30rpx;
color: #ccc;
}
.return-list .goodWrapper .iconfont.powder {
color: #f8c1bd;
}
</style>

View File

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,109 @@
<template>
<view>
<view class='sign-record'>
<view class='list' v-for="(item,index) in signList" :key="index">
<view class='item'>
<view class='data'>{{item.month}}</view>
<view class='listn'>
<view class='itemn acea-row row-between-wrapper' v-for="(itemn,indexn) in item.list" :key="indexn">
<view>
<view class='name line1'>{{itemn.title}}</view>
<view>{{itemn.addTime}}</view>
</view>
<view class='num font-color'>+{{itemn.number}}</view>
</view>
</view>
</view>
</view>
<view class='loadingicon acea-row row-center-wrapper'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadtitle}}
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import { getSignMonthList } from '@/api/user.js';
import { toLogin } from '@/libs/login.js';
import { mapGetters } from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
export default {
components: {
// #ifdef MP
authorize
// #endif
},
data() {
return {
loading:false,
loadend:false,
loadtitle:'加载更多',
page:1,
limit:8,
signList:[],
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin']),
onLoad(){
if(this.isLogin){
this.getSignMoneList();
}else{
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this,'isShowAuth',true)
// #endif
}
},
onReachBottom: function () {
this.getSignMoneList();
},
methods: {
/**
*
* 授权回调
*/
onLoadFun:function(){
this.getSignMoneList();
},
// 授权关闭
authColse:function(e){
this.isShowAuth = e
},
/**
* 获取签到记录列表
*/
getSignMoneList:function(){
let that=this;
if(that.loading) return;
if(that.loadend) return;
that.loading = true;
that.loadtitle = "";
getSignMonthList({ page: that.page, limit: that.limit }).then(res=>{
let list = res.data.list;
let loadend = list.length < that.limit;
that.signList = that.$util.SplitArray(list, that.signList);
that.$set(that,'signList',that.signList);
that.loadend = loadend;
that.loading = false;
that.loadtitle = loadend ? "哼😕~我也是有底线的~" : "加载更多"
}).catch(err=>{
that.loading = false;
that.loadtitle = '加载更多';
});
},
}
}
</script>
<style>
</style>

View File

@@ -0,0 +1,410 @@
<template>
<view>
<view class='distribution-posters'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
@change="bindchange" previous-margin="40px" next-margin="40px">
<block v-for="(item,index) in spreadList" :key="index">
<swiper-item>
<image :src="item.pic" class="slide-image" :class="swiperIndex == index ? 'active' : 'quiet'" mode='aspectFill' />
</swiper-item>
</block>
</swiper>
<!-- #ifdef MP -->
<view class='keep bg-color' @click='savePosterPath'>保存海报</view>
<!-- #endif -->
<!-- #ifndef MP -->
<div class="preserve acea-row row-center-wrapper">
<div class="line"></div>
<div class="tip">长按保存图片</div>
<div class="line"></div>
</div>
<!-- #endif -->
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<view class="canvas">
<canvas style="width:750px;height:1190px;" canvas-id="canvasOne"></canvas>
<canvas style="" canvas-id="qrcode" :style="{width: `${qrcodeSize}px`, height: `${qrcodeSize}px`}" />
</view>
</view>
</template>
<script>
// #ifdef H5
import uQRCode from '@/js_sdk/Sansnn-uQRCode/uqrcode.js'
// #endif
import {
getUserInfo,
spreadBanner
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
import {
getQrcode
} from '@/api/api.js';
// #endif
import home from '@/components/home';
import {
imageBase64
} from "@/api/public";
export default {
components: {
// #ifdef MP
authorize,
// #endif
home
},
data() {
return {
imgUrls: [],
indicatorDots: false,
circular: false,
autoplay: false,
interval: 3000,
duration: 500,
swiperIndex: 0,
spreadList: [],
userInfo: {},
poster: '',
isAuto: false, //没有授权的不会自动授权
isShowAuth: false, //是否隐藏授权
imagePath: '',
qrcodeSize: 1000,
PromotionCode: '',
base64List: []
};
},
computed: mapGetters(['isLogin']),
onLoad() {
if (this.isLogin) {
// #ifdef H5
this.userSpreadBannerList();
// #endif
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
/**
* 用户点击右上角分享
*/
// #ifdef MP
onShareAppMessage: function() {
return {
title: this.userInfo.nickname + '-分销海报',
imageUrl: this.spreadList[0].pic,
path: '/pages/index/index?spid=' + this.userInfo.uid,
};
},
// #endif
onReady() {
},
methods: {
getImageBase64:function(images){
uni.showLoading({
title: '海报生成中',
mask: true
});
let that = this;
let spreadList = [];
images.forEach((item,index)=>{
imageBase64({url:item.pic}).then(res=>{
spreadList[index] = res.data.code;
that.$set(that,'base64List',spreadList);
that.$set(that, 'poster', spreadList[0]);
that.userInfos();
})
})
},
// 小程序二维码
getQrcode(){
let that = this;
let data = {
pid: that.userInfo.uid,
path: '/pages/index/index'
}
getQrcode(data).then(res=>{
that.PromotionCode = res.data.code;
// let image = '../../../static/images/aa.jpg';
// that.PosterCanvas(image, res.data.code, that.userInfo.nickname,0);
that.PosterCanvas(this.base64List[0], res.data.code, that.userInfo.nickname,0);
})
},
// 生成二维码;
make() {
let that = this;
let href = location.href.split('/pages')[0];
uQRCode.make({
canvasId: 'qrcode',
text: href+'/pages/index/index?spread=' + that.userInfo.uid,
size: this.qrcodeSize,
margin: 10,
success: res => {
that.PromotionCode = res;
// let image = '../../../static/images/aa.jpg';
// that.PosterCanvas(image, that.PromotionCode, that.userInfo.nickname,0);
that.PosterCanvas(this.base64List[0], that.PromotionCode, that.userInfo.nickname,0);
},
complete: () => {},
fail: res => {
that.$util.Tips({
title: '海报二维码生成失败!'
});
}
})
},
PosterCanvas: function(arrImages, code, nickname,index) {
let context = uni.createCanvasContext('canvasOne')
context.clearRect(0, 0, 0, 0);
let that = this;
uni.getImageInfo({
src: arrImages,
success: function(image) {
context.drawImage(arrImages, 0, 0, 750, 1190);
context.save();
context.drawImage(code, 110, 925, 140, 140);
context.restore();
context.setFontSize(28);
context.fillText(nickname, 270, 980);
context.fillText('邀请您加入', 270, 1020);
context.draw(true,function(){
uni.canvasToTempFilePath({
destWidth: 750,
destHeight: 1190,
canvasId: 'canvasOne',
fileType: 'jpg',
success: function(res) {
// 在H5平台下tempFilePath 为 base64
uni.hideLoading();
that.imagePath = res.tempFilePath;
that.spreadList[index].pic = res.tempFilePath;
}
})
})
},
fail: function(err) {
uni.hideLoading();
that.$util.Tips({
title: '无法获取图片信息'
});
}
});
},
onLoadFun: function(e) {
this.$set(this, 'userInfo', e);
this.userSpreadBannerList();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
bindchange(e) {
let base64List = this.base64List;
let index = e.detail.current;
this.swiperIndex = index;
this.$set(this, 'poster', base64List[index]);
this.PosterCanvas(base64List[index], this.PromotionCode, this.userInfo.nickname,index);
// let aa = ['../../../static/images/aa.jpg','../../../static/images/aa.jpg','../../../static/images/aa.jpg'];
// this.PosterCanvas(aa[index], this.PromotionCode, this.userInfo.nickname,index);
},
// 点击保存海报
savePosterPath: function() {
let that = this;
uni.downloadFile({
url: that.poster,
success(resFile) {
if (resFile.statusCode === 200) {
uni.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
uni.authorize({
scope: 'scope.writePhotosAlbum',
success() {
uni.saveImageToPhotosAlbum({
filePath: resFile.tempFilePath,
success: function(res) {
return that.$util.Tips({
title: '保存成功'
});
},
fail: function(res) {
return that.$util.Tips({
title: res.errMsg
});
},
complete: function(res) {},
})
},
fail() {
uni.showModal({
title: '您已拒绝获取相册权限',
content: '是否进入权限管理,调整授权?',
success(res) {
if (res.confirm) {
uni.openSetting({
success: function(res) {
console.log(res.authSetting)
}
});
} else if (res.cancel) {
return that.$util.Tips({
title: '已取消!'
});
}
}
})
}
})
} else {
uni.saveImageToPhotosAlbum({
filePath: resFile.tempFilePath,
success: function(res) {
return that.$util.Tips({
title: '保存成功'
});
},
fail: function(res) {
return that.$util.Tips({
title: res.errMsg
});
},
complete: function(res) {},
})
}
},
fail(res) {
}
})
} else {
return that.$util.Tips({
title: resFile.errMsg
});
}
},
fail(res) {
return that.$util.Tips({
title: res.errMsg
});
}
})
},
userInfos() {
let that = this;
getUserInfo().then(res => {
that.userInfo = res.data;
// #ifdef H5
that.make();
that.setShareInfoStatus();
// #endif
// #ifdef MP
that.getQrcode();
// #endif
})
},
setShareInfoStatus: function() {
if (this.$wechat.isWeixin()) {
let configAppMessage = {
desc: '分销海报',
title: this.userInfo.nickname + '-分销海报',
link: '/pages/index/index?spread=' + this.userInfo.uid,
imgUrl: this.spreadList[0].pic
};
this.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"], configAppMessage)
}
},
userSpreadBannerList: function() {
let that = this;
uni.showLoading({
title: '获取中',
mask: true,
})
spreadBanner({
page: 1,
limit: 5
}).then(res => {
uni.hideLoading();
that.$set(that, 'spreadList', res.data);
that.getImageBase64(res.data);
}).catch(err => {
uni.hideLoading();
});
}
}
}
</script>
<style lang="scss">
page {
background-color: #a3a3a3 !important;
}
.canvas canvas{
position: fixed;
z-index: -5rpx;
opacity: 0;
}
.distribution-posters swiper {
width: 100%;
height: 1000rpx;
position: relative;
margin-top: 40rpx;
}
.distribution-posters .slide-image {
width: 100%;
height: 100%;
margin: 0 auto;
border-radius: 15rpx;
}
.distribution-posters .slide-image.active {
transform: none;
transition: all 0.2s ease-in 0s;
}
.distribution-posters .slide-image.quiet {
transform: scale(0.8333333);
transition: all 0.2s ease-in 0s;
}
.distribution-posters .keep {
font-size: 30rpx;
color: #fff;
width: 600rpx;
height: 80rpx;
border-radius: 50rpx;
text-align: center;
line-height: 80rpx;
margin: 38rpx auto;
}
.distribution-posters .preserve {
color: #fff;
text-align: center;
margin-top: 38rpx;
}
.distribution-posters .preserve .line {
width: 100rpx;
height: 1px;
background-color: #fff;
}
.distribution-posters .preserve .tip {
margin: 0 30rpx;
}
</style>

View File

@@ -0,0 +1,192 @@
<template>
<view>
<view class='commission-details'>
<view class='promoterHeader bg-color'>
<view class='headerCon acea-row row-between-wrapper'>
<view>
<view class='name'>{{name}}</view>
<view class='money' v-if="recordType == 4"><text class='num'>{{extractCount}}</text></view>
<view class='money' v-else><text class='num'>{{recordCount}}</text></view>
</view>
<view class='iconfont icon-jinbi1'></view>
</view>
</view>
<view class='sign-record'>
<block v-for="(item,index) in recordList" :key="index" v-if="recordList.length>0">
<view class='list'>
<view class='item'>
<view class='data'>{{item.date}}</view>
<view class='listn'>
<block v-for="(child,indexn) in item.list" :key="indexn">
<view class='itemn acea-row row-between-wrapper'>
<view>
<view class='name line1'>{{child.title}}</view>
<view>{{child.add_time}}</view>
</view>
<view class='num font-color' v-if="child.pm == 1">+{{child.number}}</view>
<view class='num' v-else>-{{child.number}}</view>
</view>
</block>
</view>
</view>
</view>
</block>
<view v-if="recordList.length == 0">
<emptyPage title='暂无提现记录~'></emptyPage>
</view>
</view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
<home></home>
</view>
</template>
<script>
import {
getCommissionInfo,
getSpreadInfo
} from '@/api/user.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import emptyPage from '@/components/emptyPage.vue'
import home from '@/components/home';
export default {
components: {
// #ifdef MP
authorize,
// #endif
emptyPage,
home
},
data() {
return {
name: '',
type: 0,
page: 1,
limit: 10,
recordList: [],
recordType: 0,
recordCount: 0,
status: false,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false ,//是否隐藏授权
extractCount:0
};
},
computed: mapGetters(['isLogin']),
onLoad(options) {
if (this.isLogin) {
this.type = options.type;
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
},
onShow: function() {
let type = this.type;
if (type == 1) {
uni.setNavigationBarTitle({
title: "提现记录"
});
this.name = '提现总额';
this.recordType = 4;
this.getRecordList();
this.getRecordListCount();
} else if (type == 2) {
uni.setNavigationBarTitle({
title: "佣金记录"
});
this.name = '佣金明细';
this.recordType = 3;
this.getRecordList();
this.getRecordListCount();
} else {
uni.showToast({
title: '参数错误',
icon: 'none',
duration: 1000,
mask: true,
success: function(res) {
setTimeout(function() {
// #ifndef H5
uni.navigateBack({
delta: 1,
});
// #endif
// #ifdef H5
history.back();
// #endif
}, 1200)
},
});
}
},
methods: {
onLoadFun() {
this.getRecordList();
this.getRecordListCount();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
getRecordList: function() {
let that = this;
let page = that.page;
let limit = that.limit;
let status = that.status;
let recordType = that.recordType;
let recordList = that.recordList;
let recordListNew = [];
if (status == true) return;
getCommissionInfo({
page: page,
limit: limit
}, recordType).then(res => {
let len = res.data.list.length;
let recordListData = res.data.list;
recordListNew = recordList.concat(recordListData);
that.status = limit > len;
that.page = page + 1;
that.$set(that, 'recordList', recordListNew);
});
},
getRecordListCount: function() {
let that = this;
getSpreadInfo().then(res => {
that.recordCount = res.data.commissionCount;
that.extractCount = res.data.extractCount;
});
}
},
onReachBottom: function() {
this.getRecordList();
}
}
</script>
<style scoped lang="scss">
.commission-details .promoterHeader .headerCon .money {
font-size: 36rpx;
}
.commission-details .promoterHeader .headerCon .money .num {
font-family: 'Guildford Pro';
}
</style>

View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,480 @@
<template>
<view>
<view class='member-center'>
<view class='header'>
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
@change="bindchange" previous-margin="30px" next-margin="30px">
<block v-for="(item,index) in VipList" :key="index">
<swiper-item>
<view class="memberBg" :class="swiperIndex == index ? 'active' : 'quiet'" :style='"background-image:url("+item.image+")"'
mode='aspectFill'>
<view class='name'>{{item.name}}</view>
<view class='discount'>可享受商品折扣:{{item.discount}}<text class='iconfont icon-zhekou'></text></view>
<view class='lock' v-if="item.grade < grade"><text class='iconfont icon-xuanzhong1'></text>已解锁更高等级</view>
<view class='lock' v-if="item.grade > grade"><text class='iconfont icon-quanxianguanlisuozi'></text>该会员等级尚未解锁</view>
<view class='nav acea-row' v-if="grade==item.grade">
<view class='item' v-if="indexn <= 3" v-for="(itemn,indexn) in item.task_list" :key="indexn">
<view class='num'>{{itemn.number}}</view>
<view>{{itemn.real_name}}</view>
</view>
</view>
</view>
</swiper-item>
</block>
</swiper>
</view>
<view class='wrapper'>
<view class='title acea-row row-between-wrapper'>
<view><text class='iconfont icon-jingyanzhi'></text>会员升级要求</view>
<view class='num'><text class='current'>{{reach_count || 0}}</text>/{{task.length || 0}}</view>
</view>
<view class='list'>
<view class='item' v-for="(item,index) in task" :key="index">
<view class='top acea-row row-between-wrapper'>
<view class='name' @click='opHelp(index)'>{{item.name}}<text v-if="item.illustrate" class='iconfont icon-wenti'></text></view>
<view v-if="item.finish">已满足条件</view>
<view v-else>未满足条件</view>
</view>
<view class="cu-progress">
<view class='bg-red' :style="'width:'+item.speed+'%;'"></view>
</view>
<view class='experience acea-row row-between-wrapper'>
<view>{{item.task_type_title}}</view>
<view><text class='num'>{{item.new_number || 0}}</text>/{{item.number || 0}}</view>
</view>
</view>
</view>
</view>
<recommend :hostProduct="hostProduct"></recommend>
<view class='growthValue' :class='growthValue==false?"on":""'>
<view class='pictrue'>
<image src='../../../static/images/value.jpg'></image><text class='iconfont icon-guanbi3' @click='growthValue'></text>
</view>
<view class='conter'>{{illustrate}}</view>
</view>
<view class='mask' :hidden='growthValue' @click='growthValueClose'></view>
</view>
<!-- #ifdef MP -->
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
<!-- #endif -->
</view>
</template>
<script>
import {
userLevelGrade,
userLevelTask,
userLevelDetection
} from '@/api/user.js';
import {
getProductHot
} from '@/api/store.js';
import {
toLogin
} from '@/libs/login.js';
import {
mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import recommend from '@/components/recommend';
export default {
components: {
recommend,
// #ifdef MP
authorize
// #endif
},
data() {
return {
reach_count:0,
VipList: [],
indicatorDots: false,
circular: true,
autoplay: false,
interval: 3000,
duration: 500,
swiperIndex: 0,
growthValue: true,
task: [], //任务列表
illustrate: '', //任务说明
level_id: 0, //任务id,
hostProduct: [],
grade: 0,
isAuto: false, //没有授权的不会自动授权
isShowAuth: false ,//是否隐藏授权
hotScroll:false,
hotPage:1,
hotLimit:10
};
},
computed: mapGetters(['isLogin']),
watch: {
VipList: function() {
console.log('观察')
let that = this;
if (that.VipList.length > 0) {
that.VipList.forEach(function(item, index) {
if (item.is_clear === false) {
// that.swiper.slideTo(index);
that.activeIndex = index;
that.grade = item.grade;
}
});
}
}
},
onLoad() {
if (this.isLogin) {
this.setLeveLComplete();
this.get_host_product();
} else {
// #ifdef H5 || APP-PLUS
toLogin();
// #endif
// #ifdef MP
this.isAuto = true;
this.$set(this, 'isShowAuth', true)
// #endif
}
let that = this;
setTimeout(function() {
that.loading = true
}, 500)
},
methods: {
onLoadFun: function() {
this.setLeveLComplete();
this.get_host_product();
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
/**
* 获取我的推荐
*/
get_host_product: function() {
let that = this;
getProductHot().then(res => {
let that = this;
if(that.hotScroll) return
getProductHot(
that.hotPage,
that.hotLimit,
).then(res => {
that.hotPage++
that.hotScroll = res.data.length<that.hotLimit
that.hostProduct = that.hostProduct.concat(res.data)
});
});
},
/**
* 会员切换
*
*/
bindchange(e) {
let index = e.detail.current;
this.swiperIndex = index;
this.level_id = this.VipList[index].id || 0;
// this.grade = this.VipList[index].grade
this.getTask();
},
/**
* 关闭说明
*/
growthValueClose: function() {
this.growthValue = true;
},
/**
* 打开说明
*/
opHelp: function(index) {
this.growthValue = false;
this.illustrate = this.task[index].illustrate;
},
/**
* 设置会员
*/
setLeveLComplete: function() {
let that = this;
userLevelDetection().then(res => {
that.getVipList();
});
},
/**
* 获取会员等级
*
*/
getVipList: function() {
let that = this;
userLevelGrade().then(res => {
that.$set(that, 'VipList', res.data.list);
that.task = res.data.task.task;
that.reach_count = res.data.task.reach_count;
that.level_id = res.data.list[0] ? res.data.list[0].id : 0;
let arr = [];
// res.data.list.forEach(function(item, index) {
// if (item.is_clear == false) {
// arr.push(item.grade);
// }
// })
// that.grade = arr[0] || 0;
// that.grade = res.data.list[0].grade
});
},
/**
* 获取任务要求
*/
getTask: function() {
let that = this;
userLevelTask(that.level_id).then(res => {
that.task = res.data.task;
that.reach_count = res.data.reach_count;
});
}
},
onReachBottom() {
this.get_host_product();
}
}
</script>
<style scoped lang="scss">
.member-center .header {
background-color: #232323;
width: 100%;
padding: 50rpx 0;
}
.member-center .header swiper {
width: 100%;
height: 328rpx;
position: relative;
}
.member-center .header swiper-item .memberBg.active {
transform: none;
transition: all 0.2s ease-in 0s;
}
.member-center .header swiper-item .memberBg.quiet {
transform: scale(0.9);
transition: all 0.2s ease-in 0s;
}
.member-center .header swiper-item .memberBg {
width: 100%;
height: 328rpx;
border-radius: 16rpx;
color: #fff;
position: relative;
background-size: 100% 100%
}
.member-center .header swiper-item .memberBg image {
width: 89rpx;
height: 108rpx;
display: block;
position: absolute;
right: 60rpx;
}
.member-center .header swiper-item .memberBg .name {
font-size: 46rpx;
font-weight: bold;
padding: 40rpx 0 0 35rpx;
}
.member-center .header swiper-item .memberBg .discount {
font-size: 28rpx;
font-weight: bold;
margin: 15rpx 0 0 35rpx;
}
.member-center .header swiper-item .memberBg .discount .iconfont {
margin-left: 10rpx;
font-size: 30rpx;
}
.member-center .header swiper-item .memberBg .nav {
margin-top: 55rpx;
}
.member-center .header swiper-item .memberBg .nav .item {
flex: 1;
text-align: center;
color: rgba(255, 255, 255, 0.6);
position: relative;
}
.member-center .header swiper-item .memberBg .nav .item .num {
font-size: 40rpx;
color: #fff;
font-family: 'Guildford Pro';
}
.member-center .header swiper-item .memberBg .nav .item~.item::before {
position: absolute;
width: 2rpx;
height: 32rpx;
background-color: rgba(255, 255, 255, 0.6);
content: '';
left: 0;
top: 50%;
transform: translateY(-50%);
}
.member-center .header swiper-item .memberBg .lock {
font-size: 26rpx;
margin: 73rpx 0 0 35rpx;
}
.member-center .header swiper-item .memberBg .lock .iconfont {
font-size: 37rpx;
margin-right: 15rpx;
vertical-align: -4rpx;
}
.member-center .wrapper {
background-color: #fff;
padding-bottom: 16rpx;
margin-bottom: 20rpx;
}
.member-center .wrapper .title {
height: 98rpx;
padding: 0 30rpx;
font-size: 30rpx;
font-weight: bold;
color: #282828;
}
.member-center .wrapper .title .iconfont {
color: #ffae06;
font-weight: normal;
font-size: 40rpx;
margin-right: 12rpx;
vertical-align: -2rpx;
}
.member-center .wrapper .title .num {
font-size: 28rpx;
color: #999;
}
.member-center .wrapper .title .num .current {
color: #ffae06;
}
.member-center .wrapper .list .item {
width: 690rpx;
height: 184rpx;
background-color: #f9f9f9;
margin: 0 auto 20rpx auto;
padding: 27rpx 0 22rpx 0;
border-radius: 12rpx;
box-sizing: border-box;
}
.member-center .wrapper .list .item .top {
padding-right: 27rpx;
font-size: 26rpx;
color: #999;
}
.member-center .wrapper .list .item .top .name {
border-left: 6rpx solid #ffae06;
padding-left: 20rpx;
font-size: 28rpx;
color: #282828;
font-weight: bold;
}
.member-center .wrapper .list .item .top .name .iconfont {
color: #999;
font-size: 30rpx;
vertical-align: -2rpx;
margin-left: 10rpx;
}
.member-center .wrapper .list .item .cu-progress {
overflow: hidden;
height: 12rpx;
background-color: #eee;
width: 636rpx;
border-radius: 20rpx;
margin: 35rpx auto 0 auto;
}
.member-center .wrapper .list .item .cu-progress .bg-red {
width: 0;
height: 100%;
transition: width 0.6s ease;
background-color: #ffaa29;
border-radius: 20rpx;
}
.member-center .wrapper .list .item .experience {
margin-top: 17rpx;
padding: 0 27rpx;
font-size: 24rpx;
color: #999;
}
.member-center .wrapper .list .item .experience .num {
color: #ffad07;
}
.member-center .growthValue {
background-color: #fff;
border-radius: 16rpx;
position: fixed;
top: 266rpx;
left: 50%;
width: 560rpx;
height: 740rpx;
margin-left: -280rpx;
z-index: 99;
transform: translate3d(0, -200%, 0);
transition: all .3s cubic-bezier(.25, .5, .5, .9);
}
.member-center .growthValue.on {
transform: translate3d(0, 0, 0);
}
.member-center .growthValue .pictrue {
width: 100%;
height: 257rpx;
position: relative;
}
.member-center .growthValue .pictrue image {
width: 100%;
height: 100%;
border-radius: 16rpx 16rpx 0 0;
}
.member-center .growthValue .conter {
padding: 0 35rpx;
font-size: 30rpx;
color: #333;
margin-top: 58rpx;
line-height: 1.5;
height: 350rpx;
overflow: auto;
}
.member-center .growthValue .pictrue .iconfont {
position: absolute;
font-size: 65rpx;
color: #fff;
top: 775rpx;
left: 50%;
transform: translateX(-50%);
}
</style>