我们发布啦
This commit is contained in:
张乐
255
app/pages/activity/bargain/index.vue
Normal file
255
app/pages/activity/bargain/index.vue
Normal file
@@ -0,0 +1,255 @@
|
||||
<template>
|
||||
<view>
|
||||
<block v-if="bargain.length>0">
|
||||
<div class="bargain-record" ref="container">
|
||||
<div class="item" v-for="(item, index) in bargain" :key="index">
|
||||
<div class="picTxt acea-row row-between-wrapper">
|
||||
<div class="pictrue">
|
||||
<image :src="item.image" />
|
||||
</div>
|
||||
<div class="text acea-row row-column-around">
|
||||
<div class="line1" style="width: 100%;">{{ item.title }}</div>
|
||||
<count-down :justify-left="'justify-content:left'" :is-day="true" :tip-text="'倒计时 '" :day-text="' 天 '" :hour-text="' 时 '" :minute-text="' 分 '"
|
||||
:second-text="' 秒'" :datatime="item.datatime" v-if="item.status === 1"></count-down>
|
||||
<div class="successTxt font-color-red" v-else-if="item.status === 3">砍价成功</div>
|
||||
<div class="endTxt" v-else>活动已结束</div>
|
||||
<div class="money font-color-red">
|
||||
已砍至<span class="symbol">￥</span><span class="num">{{ item.residue_price }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom acea-row row-between-wrapper">
|
||||
<div class="purple" v-if="item.status === 1">活动进行中</div>
|
||||
<div class="success" v-else-if="item.status === 3">砍价成功</div>
|
||||
<div class="end" v-else>活动已结束</div>
|
||||
<div class="acea-row row-middle row-right">
|
||||
<div class="bnt cancel" v-if="item.status === 1" @click="getBargainUserCancel(item.bargain_id)">
|
||||
取消活动
|
||||
</div>
|
||||
<div class="bnt bg-color-red" v-if="item.status === 1" @click="goDetail(item.bargain_id)">
|
||||
继续砍价
|
||||
</div>
|
||||
<!-- <div class="bnt bg-color-red" v-else @click="goList">重开一个</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Loading :loaded="status" :loading="loadingList"></Loading>
|
||||
</div>
|
||||
</block>
|
||||
<block v-if="bargain.length == 0">
|
||||
<emptyPage title="暂无砍价记录～"></emptyPage>
|
||||
</block>
|
||||
<home></home>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import CountDown from "@/components/countDown";
|
||||
import emptyPage from '@/components/emptyPage.vue'
|
||||
import {
|
||||
getBargainUserList,
|
||||
getBargainUserCancel
|
||||
} from "@/api/activity";
|
||||
import {
|
||||
getUserInfo
|
||||
} from '@/api/user.js';
|
||||
import Loading from "@/components/Loading";
|
||||
import home from '@/components/home';
|
||||
export default {
|
||||
name: "BargainRecord",
|
||||
components: {
|
||||
CountDown,
|
||||
Loading,
|
||||
emptyPage,
|
||||
home
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
bargain: [],
|
||||
status: false, //砍价列表是否获取完成 false 未完成 true 完成
|
||||
loadingList: false, //当前接口是否请求完成 false 完成 true 未完成
|
||||
page: 1, //页码
|
||||
limit: 20, //数量
|
||||
userInfo: {}
|
||||
};
|
||||
},
|
||||
onLoad: function() {
|
||||
this.getBargainUserList();
|
||||
this.getUserInfo();
|
||||
// this.$scroll(this.$refs.container, () => {
|
||||
// !this.loadingList && this.getBargainUserList();
|
||||
// });
|
||||
},
|
||||
methods: {
|
||||
goDetail: function(id) {
|
||||
// this.$router.push({
|
||||
// path: "/activity/dargain_detail/" + id +'&bargain='+ userInfo.uid
|
||||
// });
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/goods_bargain_details/index?id=${id}&bargain=${this.userInfo.uid}`
|
||||
})
|
||||
},
|
||||
// 砍价列表
|
||||
goList: function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/goods_bargain/index'
|
||||
})
|
||||
},
|
||||
getBargainUserList: function() {
|
||||
var that = this;
|
||||
if (that.loadingList) return;
|
||||
if (that.status) return;
|
||||
getBargainUserList({
|
||||
page: that.page,
|
||||
limit: that.limit
|
||||
})
|
||||
.then(res => {
|
||||
that.status = res.data.length < that.limit;
|
||||
that.bargain.push.apply(that.bargain, res.data);
|
||||
that.page++;
|
||||
that.loadingList = false;
|
||||
})
|
||||
.catch(res => {
|
||||
that.$dialog.error(res.msg);
|
||||
});
|
||||
},
|
||||
getBargainUserCancel: function(bargainId) {
|
||||
var that = this;
|
||||
getBargainUserCancel({
|
||||
bargainId: bargainId
|
||||
})
|
||||
.then(res => {
|
||||
that.status = false;
|
||||
that.loadingList = false;
|
||||
that.page = 1;
|
||||
that.bargain = [];
|
||||
that.getBargainUserList();
|
||||
that.$util.Tips({
|
||||
title: res.msg
|
||||
})
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
})
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取个人用户信息
|
||||
*/
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUserInfo().then(res => {
|
||||
that.userInfo = res.data;
|
||||
});
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getBargainUserList();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*砍价记录*/
|
||||
.bargain-record .item .picTxt .text .time .styleAll {
|
||||
color: #fc4141;
|
||||
font-size:24rpx;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .time .red {
|
||||
color: #999;
|
||||
font-size:24rpx;
|
||||
}
|
||||
.bargain-record .item {
|
||||
background-color: #fff;
|
||||
margin-bottom: 12upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt {
|
||||
height: 210upx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 30upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .pictrue {
|
||||
width: 150upx;
|
||||
height: 150upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .text {
|
||||
width: 515upx;
|
||||
font-size: 30upx;
|
||||
color: #282828;
|
||||
height: 150upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .text .time {
|
||||
font-size: 24upx;
|
||||
color: #868686;
|
||||
justify-content: left !important;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .text .successTxt{
|
||||
font-size:24rpx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .text .endTxt{
|
||||
font-size:24rpx;
|
||||
color: #999;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .money {
|
||||
font-size: 24upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .text .money .num {
|
||||
font-size: 32upx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bargain-record .item .picTxt .text .money .symbol {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom {
|
||||
height: 100upx;
|
||||
padding: 0 30upx;
|
||||
font-size: 27upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom .purple {
|
||||
color: #f78513;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom .end {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom .success {
|
||||
color: #e93323;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom .bnt {
|
||||
font-size: 27upx;
|
||||
color: #fff;
|
||||
width: 176upx;
|
||||
height: 60upx;
|
||||
border-radius: 32upx;
|
||||
text-align: center;
|
||||
line-height: 60upx;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom .bnt.cancel {
|
||||
color: #aaa;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.bargain-record .item .bottom .bnt~.bnt {
|
||||
margin-left: 18upx;
|
||||
}
|
||||
</style>
|
||||
260
app/pages/activity/goods_bargain/index.vue
Normal file
260
app/pages/activity/goods_bargain/index.vue
Normal file
File diff suppressed because one or more lines are too long
1092
app/pages/activity/goods_bargain_details/index.vue
Normal file
1092
app/pages/activity/goods_bargain_details/index.vue
Normal file
File diff suppressed because one or more lines are too long
228
app/pages/activity/goods_combination/index.vue
Normal file
228
app/pages/activity/goods_combination/index.vue
Normal file
File diff suppressed because one or more lines are too long
1412
app/pages/activity/goods_combination_details/index.vue
Normal file
1412
app/pages/activity/goods_combination_details/index.vue
Normal file
File diff suppressed because one or more lines are too long
875
app/pages/activity/goods_combination_status/index.vue
Normal file
875
app/pages/activity/goods_combination_status/index.vue
Normal file
@@ -0,0 +1,875 @@
|
||||
<template>
|
||||
<div class="group-con">
|
||||
<div class="header acea-row row-between-wrapper">
|
||||
<div class="pictrue">
|
||||
<img :src="storeCombination.image" />
|
||||
</div>
|
||||
<div class="text">
|
||||
<div class="line1" v-text="storeCombination.title"></div>
|
||||
<div class="money">
|
||||
￥
|
||||
<span class="num" v-text="storeCombination.price"></span>
|
||||
<span class="team cart-color" v-text="storeCombination.people + '人拼'"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="pinkBool === -1" class="iconfont icon-pintuanshibai"></div>
|
||||
<div v-else-if="pinkBool === 1" class="iconfont icon-pintuanchenggong font-color-red"></div>
|
||||
</div>
|
||||
<div class="wrapper">
|
||||
<div class="title acea-row row-center-wrapper" v-if="pinkBool === 0">
|
||||
<div class="line"></div>
|
||||
<div class="name acea-row row-center-wrapper">
|
||||
剩余
|
||||
<CountDown :is-day="false" :tip-text="' '" :day-text="' '" :hour-text="' : '" :minute-text="' : '" :second-text="' '"
|
||||
:datatime="pinkT.stop_time"></CountDown>结束
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<div class="tips font-color-red" v-if="pinkBool === 1">
|
||||
恭喜您拼团成功
|
||||
</div>
|
||||
<div class="tips" v-else-if="pinkBool === -1">
|
||||
还差{{ count }}人，拼团失败
|
||||
</div>
|
||||
<div class="tips font-color-red" v-else-if="pinkBool === 0">
|
||||
拼团中，还差{{ count }}人拼团成功
|
||||
</div>
|
||||
<div class="list acea-row row-middle" :class="[
|
||||
pinkBool === 1 || pinkBool === -1 ? 'result' : '',
|
||||
iShidden ? 'on' : ''
|
||||
]">
|
||||
<div class="pictrue">
|
||||
<img :src="pinkT.avatar" />
|
||||
</div>
|
||||
<div class="acea-row row-middle" v-if="pinkAll.length > 0">
|
||||
<div class="pictrue" v-for="(item, index) in pinkAll" :key="index">
|
||||
<img :src="item.avatar" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="pictrue" v-for="index in count" :key="index">
|
||||
<img class="img-none" src="/static/images/vacancy.png" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="(pinkBool === 1 || pinkBool === -1) && count > 9" class="lookAll acea-row row-center-wrapper" @click="lookAll">
|
||||
{{ iShidden ? "收起" : "查看全部" }}
|
||||
<span class="iconfont" :class="iShidden ? 'icon-xiangshang' : 'icon-xiangxia'"></span>
|
||||
</div>
|
||||
<!-- #ifdef H5 -->
|
||||
<div v-if="userBool === 1 && isOk == 0 && pinkBool === 0">
|
||||
<div class="teamBnt bg-color-red" v-if="$wechat.isWeixin()" @click="H5ShareBox = true">邀请好友参团</div>
|
||||
<div class="teamBnt bg-color-red" v-else @click="goPoster">邀请好友参团</div>
|
||||
</div>
|
||||
<!-- <div class="teamBnt bg-color-red" v-if="userBool === 1 && isOk == 0 && pinkBool === 0" @click="goPoster">
|
||||
邀请好友参团
|
||||
</div> -->
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<button open-type='share' class="teamBnt bg-color-red" v-if="userBool === 1 && isOk == 0 && pinkBool === 0">邀请好友参团</button>
|
||||
<!-- #endif -->
|
||||
<div class="teamBnt bg-color-red" v-else-if="userBool === 0 && pinkBool === 0 && count > 0" @click="pay">
|
||||
我要参团
|
||||
</div>
|
||||
<div class="teamBnt bg-color-red" v-if="pinkBool === 1 || pinkBool === -1" @click="goDetail(storeCombination.id)">
|
||||
再次开团
|
||||
</div>
|
||||
<div class="cancel" @click="getCombinationRemove" v-if="pinkBool === 0 && userBool === 1">
|
||||
<span class="iconfont icon-guanbi3"></span>取消开团
|
||||
</div>
|
||||
<div class="lookOrder" v-if="pinkBool === 1" @click="goOrder">
|
||||
查看订单信息
|
||||
<span class="iconfont icon-xiangyou"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group-recommend">
|
||||
<div class="title acea-row row-between-wrapper">
|
||||
<div>大家都在拼</div>
|
||||
<div class="more" @click="goList">
|
||||
更多拼团
|
||||
<span class="iconfont icon-jiantou"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list acea-row row-middle">
|
||||
<div class="item" v-for="(item, index) in storeCombinationHost" :key="index" @click="goDetail(item.id)">
|
||||
<div class="pictrue">
|
||||
<img :src="item.image" />
|
||||
<div class="team" v-text="item.people + '人团'"></div>
|
||||
</div>
|
||||
<div class="name line1" v-text="item.title"></div>
|
||||
<div class="money font-color-red" v-text="'￥' + item.price"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<product-window :attr='attr' :limitNum='1' :iSbnt='1' @myevent="onMyEvent" @ChangeAttr="ChangeAttr" @ChangeCartNum="ChangeCartNum" @iptCartNum="iptCartNum"
|
||||
@attrVal="attrVal" @goCat="goPay"></product-window>
|
||||
<!-- 发送给朋友图片 -->
|
||||
<view class="share-box" v-if="H5ShareBox">
|
||||
<image src="/static/images/share-info.png" @click="H5ShareBox = false"></image>
|
||||
</view>
|
||||
<!-- #ifdef MP -->
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- #endif -->
|
||||
<!-- <Product-window v-on:changeFun="changeFun" :attr="attr" :limitNum='1' :iSbnt='1'></Product-window> -->
|
||||
<home></home>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CountDown from "@/components/countDown";
|
||||
import ProductWindow from "@/components/productWindow";
|
||||
import {
|
||||
toLogin
|
||||
} from '@/libs/login.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
import {
|
||||
getCombinationPink,
|
||||
postCombinationRemove
|
||||
} from "@/api/activity";
|
||||
import {
|
||||
postCartAdd
|
||||
} from "@/api/store";
|
||||
// #ifdef MP
|
||||
import authorize from '@/components/Authorize';
|
||||
// #endif
|
||||
import home from '@/components/home';
|
||||
const NAME = "GroupRule";
|
||||
const app = getApp();
|
||||
export default {
|
||||
name: NAME,
|
||||
components: {
|
||||
CountDown,
|
||||
ProductWindow,
|
||||
home,
|
||||
// #ifdef MP
|
||||
authorize
|
||||
// #endif
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
currentPinkOrder: "", //当前拼团订单
|
||||
isOk: 0, //判断拼团是否完成
|
||||
pinkBool: 0, //判断拼团是否成功|0=失败,1=成功
|
||||
userBool: 0, //判断当前用户是否在团内|0=未在,1=在
|
||||
pinkAll: [], //团员
|
||||
pinkT: [], //团长信息
|
||||
storeCombination: [], //拼团产品
|
||||
storeCombinationHost: [], //拼团推荐
|
||||
pinkId: 0,
|
||||
count: 0, //拼团剩余人数
|
||||
iShidden: false,
|
||||
isOpen: false, //是否打开属性组件
|
||||
attr: {
|
||||
cartAttr: false,
|
||||
productSelect: {
|
||||
image: "",
|
||||
store_name: "",
|
||||
price: "",
|
||||
quota: 0,
|
||||
unique: "",
|
||||
cart_num: 1,
|
||||
quota_show: 0,
|
||||
product_stock: 0
|
||||
},
|
||||
attrValue: "",
|
||||
productAttr: []
|
||||
},
|
||||
cart_num:'',
|
||||
userInfo:{},
|
||||
H5ShareBox: false, //公众号分享图片
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false //是否隐藏授权
|
||||
};
|
||||
},
|
||||
computed: mapGetters(['isLogin']),
|
||||
onLoad(options) {
|
||||
var that = this;
|
||||
that.pinkId = options.id;
|
||||
if (that.isLogin == false) {
|
||||
// #ifdef H5 || APP-PLUS
|
||||
toLogin();
|
||||
// #endif
|
||||
// #ifdef MP
|
||||
that.isAuto = true;
|
||||
that.$set(that, 'isShowAuth', true);
|
||||
// #endif
|
||||
}else{
|
||||
// #ifdef H5
|
||||
this.getCombinationPink();
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
this.getCombinationPink();
|
||||
},
|
||||
//#ifdef MP
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function() {
|
||||
let that = this;
|
||||
that.close();
|
||||
that.addShareBargain();
|
||||
return {
|
||||
title: '您的好友' + that.userInfo.nickname + '邀请您参团' + that.storeCombination.title,
|
||||
path: app.globalData.openPages,
|
||||
imageUrl: that.storeCombination.image,
|
||||
}
|
||||
},
|
||||
//#endif
|
||||
methods: {
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e;
|
||||
},
|
||||
// 授权后回调
|
||||
onLoadFun: function(e) {
|
||||
this.userInfo = e
|
||||
app.globalData.openPages = '/pages/activity/goods_combination_status/index?id=' + this.pinkId;
|
||||
this.getCombinationPink();
|
||||
},
|
||||
/**
|
||||
* 购物车手动填写
|
||||
*
|
||||
*/
|
||||
iptCartNum: function (e) {
|
||||
this.$set(this.attr.productSelect,'cart_num',e);
|
||||
this.$set(this, "cart_num", e);
|
||||
},
|
||||
attrVal(val) {
|
||||
this.attr.productAttr[val.indexw].index = this.attr.productAttr[val.indexw].attr_values[val.indexn];
|
||||
},
|
||||
onMyEvent: function() {
|
||||
this.$set(this.attr, 'cartAttr', false);
|
||||
this.$set(this, 'isOpen', false);
|
||||
},
|
||||
//将父级向子集多次传送的函数合二为一；
|
||||
// changeFun: function(opt) {
|
||||
// if (typeof opt !== "object") opt = {};
|
||||
// let action = opt.action || "";
|
||||
// let value = opt.value === undefined ? "" : opt.value;
|
||||
// this[action] && this[action](value);
|
||||
// },
|
||||
// changeattr: function(res) {
|
||||
// var that = this;
|
||||
// that.attr.cartAttr = res;
|
||||
// },
|
||||
//选择属性；
|
||||
ChangeAttr: function(res) {
|
||||
this.$set(this,'cart_num',1);
|
||||
let productSelect = this.productValue[res];
|
||||
if (productSelect) {
|
||||
this.$set(this.attr.productSelect, "image", productSelect.image);
|
||||
this.$set(this.attr.productSelect, "price", productSelect.price);
|
||||
this.$set(this.attr.productSelect, "quota", productSelect.quota);
|
||||
this.$set(this.attr.productSelect, "unique", productSelect.unique);
|
||||
this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"product_stock",
|
||||
productSelect.product_stock
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"quota_show",
|
||||
productSelect.quota_show
|
||||
);
|
||||
this.$set(this, "attrValue", res);
|
||||
this.$set(this, "attrTxt", "已选择");
|
||||
} else {
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"image",
|
||||
this.storeCombination.image
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"price",
|
||||
this.storeCombination.price
|
||||
);
|
||||
this.$set(this.attr.productSelect, "quota", 0);
|
||||
this.$set(this.attr.productSelect, "unique", "");
|
||||
this.$set(this.attr.productSelect, "cart_num", 0);
|
||||
this.$set(this.attr.productSelect, "quota_show", 0);
|
||||
this.$set(this.attr.productSelect, "product_stock", 0);
|
||||
this.$set(this, "attrValue", "");
|
||||
this.$set(this, "attrTxt", "请选择");
|
||||
}
|
||||
},
|
||||
ChangeCartNum: function(res) {
|
||||
//changeValue:是否 加|减
|
||||
//获取当前变动属性
|
||||
let productSelect = this.productValue[this.attrValue];
|
||||
if (this.cart_num) {
|
||||
productSelect.cart_num = this.cart_num;
|
||||
this.attr.productSelect.cart_num = this.cart_num;
|
||||
}
|
||||
//如果没有属性,赋值给商品默认库存
|
||||
if (productSelect === undefined && !this.attr.productAttr.length)
|
||||
productSelect = this.attr.productSelect;
|
||||
if (productSelect === undefined) return;
|
||||
let stock = productSelect.stock || 0;
|
||||
let quotaShow = productSelect.quota_show || 0;
|
||||
let productStock = productSelect.product_stock || 0;
|
||||
let num = this.attr.productSelect;
|
||||
//设置默认数据
|
||||
if (productSelect.cart_num == undefined) productSelect.cart_num = 1;
|
||||
if (res) {
|
||||
num.cart_num ++;
|
||||
if(quotaShow >= productStock){
|
||||
if (num.cart_num > productStock) {
|
||||
this.$set(this.attr.productSelect, "cart_num", productStock);
|
||||
this.$set(this, "cart_num", productStock);
|
||||
}
|
||||
}else{
|
||||
if (num.cart_num > quotaShow) {
|
||||
this.$set(this.attr.productSelect, "cart_num", quotaShow);
|
||||
this.$set(this, "cart_num", quotaShow);
|
||||
}
|
||||
}
|
||||
this.$set(this, "cart_num", num.cart_num);
|
||||
this.$set(this.attr.productSelect, "cart_num", num.cart_num);
|
||||
|
||||
} else {
|
||||
num.cart_num--;
|
||||
if (num.cart_num < 1) {
|
||||
this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
this.$set(this, "cart_num", 1);
|
||||
}
|
||||
this.$set(this, "cart_num", num.cart_num);
|
||||
this.$set(this.attr.productSelect, "cart_num", num.cart_num);
|
||||
}
|
||||
// if (res) {
|
||||
// num.cart_num++;
|
||||
// if (num.cart_num > quota) {
|
||||
// this.$set(this.attr.productSelect, "cart_num", quota);
|
||||
// this.$set(this, "cart_num", quota);
|
||||
// }
|
||||
// } else {
|
||||
// num.cart_num--;
|
||||
// if (num.cart_num < 1) {
|
||||
// this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
// this.$set(this, "cart_num", 1);
|
||||
// }
|
||||
// }
|
||||
},
|
||||
//默认选中属性；
|
||||
DefaultSelect() {
|
||||
let productAttr = this.attr.productAttr,
|
||||
value = [];
|
||||
for (var key in this.productValue) {
|
||||
if (this.productValue[key].quota > 0) {
|
||||
value = this.attr.productAttr.length ? key.split(",") : [];
|
||||
break;
|
||||
}
|
||||
}
|
||||
for (let i = 0; i < productAttr.length; i++) {
|
||||
this.$set(productAttr[i], "index", value[i]);
|
||||
}
|
||||
//sort();排序函数:数字-英文-汉字；
|
||||
let productSelect = this.productValue[value.sort().join(",")];
|
||||
if (productSelect && productAttr.length) {
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"store_name",
|
||||
this.storeCombination.title
|
||||
);
|
||||
this.$set(this.attr.productSelect, "image", productSelect.image);
|
||||
this.$set(this.attr.productSelect, "price", productSelect.price);
|
||||
this.$set(this.attr.productSelect, "quota", productSelect.quota);
|
||||
this.$set(this.attr.productSelect, "unique", productSelect.unique);
|
||||
this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"product_stock",
|
||||
productSelect.product_stock
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"quota_show",
|
||||
productSelect.quota_show
|
||||
);
|
||||
this.$set(this, "attrValue", value.sort().join(","));
|
||||
this.attrValue = value.sort().join(",");
|
||||
this.$set(this, "attrTxt", "已选择");
|
||||
} else if (!productSelect && productAttr.length) {
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"store_name",
|
||||
this.storeCombination.title
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"image",
|
||||
this.storeCombination.image
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"price",
|
||||
this.storeCombination.price
|
||||
);
|
||||
this.$set(this.attr.productSelect, "quota", 0);
|
||||
this.$set(this.attr.productSelect, "unique", "");
|
||||
this.$set(this.attr.productSelect, "cart_num", 0);
|
||||
this.$set(this.attr.productSelect, "product_stock", 0);
|
||||
this.$set(this.attr.productSelect, "quota_show", 0);
|
||||
this.$set(this, "attrValue", "");
|
||||
this.$set(this, "attrTxt", "请选择");
|
||||
} else if (!productSelect && !productAttr.length) {
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"store_name",
|
||||
this.storeCombination.title
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"image",
|
||||
this.storeCombination.image
|
||||
);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"price",
|
||||
this.storeCombination.price
|
||||
);
|
||||
this.$set(this.attr.productSelect, "quota", 0);
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"unique",
|
||||
this.storeCombination.unique || ""
|
||||
);
|
||||
this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
this.$set(this.attr.productSelect, "quota_show", 0);
|
||||
this.$set(this.attr.productSelect, "product_stock", 0);
|
||||
this.$set(this, "attrValue", "");
|
||||
this.$set(this, "attrTxt", "请选择");
|
||||
}
|
||||
},
|
||||
setProductSelect: function() {
|
||||
var that = this;
|
||||
var attr = that.attr;
|
||||
attr.productSelect.image = that.storeCombination.image;
|
||||
attr.productSelect.store_name = that.storeCombination.title;
|
||||
attr.productSelect.price = that.storeCombination.price;
|
||||
attr.productSelect.quota = 0;
|
||||
attr.productSelect.quota_show = 0;
|
||||
attr.productSelect.product_stock = 0;
|
||||
attr.cartAttr = false;
|
||||
that.$set(that, "attr", attr);
|
||||
},
|
||||
pay: function() {
|
||||
var that = this;
|
||||
that.attr.cartAttr = true;
|
||||
that.isOpen = true;
|
||||
},
|
||||
goPay() {
|
||||
var that = this;
|
||||
var data = {};
|
||||
// that.attr.cartAttr = res;
|
||||
data.productId = that.storeCombination.product_id;
|
||||
data.cartNum = that.attr.productSelect.cart_num;
|
||||
data.uniqueId = that.attr.productSelect.unique;
|
||||
data.combinationId = that.storeCombination.id;
|
||||
data.new = 1;
|
||||
console.log(that.pinkId);
|
||||
postCartAdd(data)
|
||||
.then(res => {
|
||||
uni.navigateTo({
|
||||
url:'/pages/users/order_confirm/index?cartId=' +res.data.cartId +'&pinkid='+that.pinkId
|
||||
})
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title:res
|
||||
})
|
||||
});
|
||||
},
|
||||
goPoster: function() {
|
||||
var that = this;
|
||||
// this.$router.push({
|
||||
// path: "/activity/poster/" + that.pinkId + "/1"
|
||||
// });
|
||||
uni.navigateTo({
|
||||
url:'/pages/activity/poster-poster/index?type=2&id='+that.pinkId
|
||||
})
|
||||
},
|
||||
goOrder: function() {
|
||||
var that = this;
|
||||
uni.navigateTo({
|
||||
url:"/pages/order_details/index?order_id=" + that.currentPinkOrder
|
||||
})
|
||||
},
|
||||
//拼团列表
|
||||
goList: function() {
|
||||
uni.navigateTo({
|
||||
url:'/pages/activity/goods_combination/index'
|
||||
})
|
||||
},
|
||||
//拼团详情
|
||||
goDetail: function(id) {
|
||||
this.pinkId = id
|
||||
// this.getCombinationPink();
|
||||
uni.navigateTo({
|
||||
url:'/pages/activity/goods_combination_details/index?id='+id
|
||||
})
|
||||
// this.$router.push({
|
||||
// path: "/activity/group_detail/" + id
|
||||
// });
|
||||
},
|
||||
//拼团信息
|
||||
getCombinationPink: function() {
|
||||
var that = this;
|
||||
getCombinationPink(that.pinkId).then(res => {
|
||||
that.$set(
|
||||
that,
|
||||
"storeCombinationHost",
|
||||
res.data.store_combination_host
|
||||
);
|
||||
res.data.pinkT.stop_time = parseInt(res.data.pinkT.stop_time)
|
||||
that.$set(that, "storeCombination", res.data.store_combination);
|
||||
that.$set(that, "pinkT", res.data.pinkT);
|
||||
that.$set(that, "pinkAll", res.data.pinkAll);
|
||||
that.$set(that, "count", res.data.count);
|
||||
that.$set(that, "userBool", res.data.userBool);
|
||||
that.$set(that, "pinkBool", res.data.pinkBool);
|
||||
that.$set(that, "isOk", res.data.is_ok);
|
||||
that.$set(that, "currentPinkOrder", res.data.current_pink_order);
|
||||
that.$set(that, "userInfo", res.data.userInfo);
|
||||
that.attr.productAttr = res.data.store_combination.productAttr;
|
||||
that.productValue = res.data.store_combination.productValue;
|
||||
//#ifdef H5
|
||||
that.setOpenShare();
|
||||
//#endif
|
||||
that.setProductSelect();
|
||||
if (that.attr.productAttr != 0) that.DefaultSelect();
|
||||
});
|
||||
},
|
||||
//#ifdef H5
|
||||
setOpenShare() {
|
||||
let that = this;
|
||||
let configTimeline = {
|
||||
title:
|
||||
"您的好友" +
|
||||
that.userInfo.nickname +
|
||||
"邀请您参团" +
|
||||
that.storeCombination.title,
|
||||
desc: that.storeCombination.title,
|
||||
link:
|
||||
window.location.protocol +
|
||||
"//" +
|
||||
window.location.host +
|
||||
"/pages/activity/goods_combination_status/index?id=" +
|
||||
that.pinkId,
|
||||
imgUrl: that.storeCombination.image
|
||||
};
|
||||
if (this.$wechat.isWeixin()) {
|
||||
this.$wechat.wechatEvevt([
|
||||
"updateAppMessageShareData",
|
||||
"updateTimelineShareData",
|
||||
"onMenuShareAppMessage",
|
||||
"onMenuShareTimeline"
|
||||
],
|
||||
configTimeline
|
||||
)
|
||||
.then(res => {
|
||||
console.log(res);
|
||||
})
|
||||
.catch(res => {
|
||||
if (res.is_ready) {
|
||||
res.wx.updateAppMessageShareData(configTimeline);
|
||||
res.wx.updateTimelineShareData(configTimeline);
|
||||
res.wx.onMenuShareAppMessage(configTimeline);
|
||||
res.wx.onMenuShareTimeline(configTimeline);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
//#endif
|
||||
//拼团取消
|
||||
getCombinationRemove: function() {
|
||||
var that = this;
|
||||
postCombinationRemove({
|
||||
id: that.pinkId,
|
||||
cid: that.storeCombination.id
|
||||
})
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title:res.msg
|
||||
},{
|
||||
tab: 3,
|
||||
})
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title:res
|
||||
})
|
||||
});
|
||||
},
|
||||
lookAll: function() {
|
||||
this.iShidden = !this.iShidden;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
/*开团*/
|
||||
.group-con .header {
|
||||
width: 100%;
|
||||
height: 186rpx;
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #f5f5f5;
|
||||
padding: 0 30rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.group-con .header .iconfont {
|
||||
font-size: 100rpx;
|
||||
position: absolute;
|
||||
color: #ccc;
|
||||
right: 33rpx;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
|
||||
.group-con .header .pictrue {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.group-con .header .pictrue img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.group-con .header .text {
|
||||
width: 540rpx;
|
||||
font-size: 30rpx;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.group-con .header .text .money {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.group-con .header .text .money .num {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.group-con .header .text .money .team {
|
||||
padding: 1rpx 10rpx;
|
||||
font-weight: normal;
|
||||
border-radius: 50rpx;
|
||||
font-size: 20rpx;
|
||||
vertical-align: 4rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper {
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
padding: 2rpx 0 35rpx 0;
|
||||
}
|
||||
|
||||
.group-con .wrapper .title {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .title .line {
|
||||
width: 136rpx;
|
||||
height: 1px;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.group-con .wrapper .title .name {
|
||||
margin: 0 45rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.group-con .wrapper .title .name .time {
|
||||
margin: 0 14rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .title .name .timeTxt {
|
||||
color: #fc4141;
|
||||
}
|
||||
|
||||
.group-con .wrapper .title .name .time .styleAll {
|
||||
background-color: #ffcfcb;
|
||||
text-align: center;
|
||||
border-radius: 3rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
color: #fc4141;
|
||||
padding: 2rpx 5rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .tips {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-top: 30rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.group-con .wrapper .list {
|
||||
padding: 0 30rpx;
|
||||
margin-top: 45rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .list.result {
|
||||
max-height: 240rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.group-con .wrapper .list.result.on {
|
||||
max-height: 2000rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .list .pictrue {
|
||||
width: 94rpx;
|
||||
height: 94rpx;
|
||||
margin: 0 0 29rpx 35rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .list .pictrue img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #e93323;
|
||||
}
|
||||
|
||||
.group-con .wrapper .list .pictrue img.img-none {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.group-con .wrapper .lookAll {
|
||||
font-size: 24rpx;
|
||||
color: #282828;
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .lookAll .iconfont {
|
||||
font-size: 25rpx;
|
||||
margin: 2rpx 0 0 10rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .teamBnt {
|
||||
font-size: 30rpx;
|
||||
width: 620rpx;
|
||||
height: 86rpx;
|
||||
border-radius: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 86rpx;
|
||||
color: #fff;
|
||||
margin: 21rpx auto 0 auto;
|
||||
}
|
||||
|
||||
.group-con .wrapper .cancel,
|
||||
.group-con .wrapper .lookOrder {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #282828;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .cancel .iconfont {
|
||||
font-size: 35rpx;
|
||||
color: #2c2c2c;
|
||||
vertical-align: -4rpx;
|
||||
margin-right: 9rpx;
|
||||
}
|
||||
|
||||
.group-con .wrapper .lookOrder .iconfont {
|
||||
font-size: 25rpx;
|
||||
color: #2c2c2c;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.group-con .group-recommend {
|
||||
background-color: #fff;
|
||||
margin-top: 25rpx;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .title {
|
||||
padding-right: 30rpx;
|
||||
margin-left: 30rpx;
|
||||
height: 85rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .title .more {
|
||||
color: #808080;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .title .more .iconfont {
|
||||
margin-left: 13rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list .item {
|
||||
width: 210rpx;
|
||||
margin: 0 0 25rpx 30rpx;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list .item .pictrue {
|
||||
width: 100%;
|
||||
height: 210rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list .item .pictrue img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list .item .pictrue .team {
|
||||
position: absolute;
|
||||
top: 28rpx;
|
||||
left: -5rpx;
|
||||
min-width: 100rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
text-align: center;
|
||||
border-radius: 0 18rpx 18rpx 0;
|
||||
font-size: 20rpx;
|
||||
color: #fff;
|
||||
background-image: linear-gradient(to right, #fb5445 0%, #e93323 100%);
|
||||
background-image: -webkit-linear-gradient(to right, #fb5445 0%, #e93323 100%);
|
||||
background-image: -moz-linear-gradient(to right, #fb5445 0%, #e93323 100%);
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list .item .name {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-top: 0.18rem;
|
||||
}
|
||||
|
||||
.group-con .group-recommend .list .item .money {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.share-box {
|
||||
z-index: 1000;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
358
app/pages/activity/goods_seckill/index.vue
Normal file
358
app/pages/activity/goods_seckill/index.vue
Normal file
@@ -0,0 +1,358 @@
|
||||
<template>
|
||||
<div>
|
||||
<view class='flash-sale'>
|
||||
<view class="saleBox"></view>
|
||||
<view class='header' v-if="timeList.length>0">
|
||||
<image :src='timeList[active].slide'></image>
|
||||
</view>
|
||||
<view class="seckillList acea-row row-between-wrapper">
|
||||
<view class="priceTag">
|
||||
<image src="/static/images/priceTag.png"></image>
|
||||
</view>
|
||||
<view class='timeLsit'>
|
||||
<scroll-view class="scroll-view_x" scroll-x scroll-with-animation :scroll-left="scrollLeft" style="width:auto;overflow:hidden;height:106rpx;">
|
||||
<block v-for="(item,index) in timeList" :key='index'>
|
||||
<view @tap='settimeList(item,index)' class='item' :class="active == index?'on':''">
|
||||
<view class='time'>{{item.time}}</view>
|
||||
<view class="state">{{item.state}}</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='list'>
|
||||
<block v-for="(item,index) in seckillList" :key='index'>
|
||||
<view class='item acea-row row-between-wrapper' @tap='goDetails(item)'>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.image'></image>
|
||||
</view>
|
||||
<view class='text acea-row row-column-around'>
|
||||
<view class='name line1'>{{item.title}}</view>
|
||||
<view class='money'>￥
|
||||
<text class='num font-color'>{{item.price}}</text>
|
||||
<text class="y_money">￥{{item.ot_price}}</text>
|
||||
</view>
|
||||
<view class="limit">限量 <text class="limitPrice">{{item.quota}}件</text></view>
|
||||
<view class="progress">
|
||||
<view class='bg-reds' :style="'width:'+item.percent+'%;'"></view>
|
||||
<view class='piece'>已抢{{item.percent}}%</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='grab bg-color' v-if="status == 1">马上抢</view>
|
||||
<view class='grab bg-color' v-else-if="status == 2">未开始</view>
|
||||
<view class='grab bg-color-hui' v-else>已结束</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view class='noCommodity' v-if="seckillList.length == 0 && (page != 1 || active== 0)">
|
||||
<view class='pictrue'>
|
||||
<image src='/static/images/noShopper.png'></image>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getSeckillIndexTime,
|
||||
getSeckillList
|
||||
} from '../../../api/activity.js';
|
||||
import home from '@/components/home/index.vue'
|
||||
export default {
|
||||
components: {
|
||||
home
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
topImage: '',
|
||||
seckillList: [],
|
||||
timeList: [],
|
||||
active: 5,
|
||||
scrollLeft: 0,
|
||||
interval: 0,
|
||||
status: 1,
|
||||
countDownHour: "00",
|
||||
countDownMinute: "00",
|
||||
countDownSecond: "00",
|
||||
page: 1,
|
||||
limit: 4,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getSeckillConfig();
|
||||
},
|
||||
methods: {
|
||||
getSeckillConfig: function() {
|
||||
let that = this;
|
||||
getSeckillIndexTime().then(res => {
|
||||
that.topImage = res.data.lovely;
|
||||
that.timeList = res.data.seckillTime;
|
||||
that.active = res.data.seckillTimeIndex;
|
||||
if (that.timeList.length) {
|
||||
// wxh.time(that.data.timeList[that.data.active].stop, that);
|
||||
that.scrollLeft = (that.active - 1.37) * 100
|
||||
setTimeout(function() {
|
||||
that.loading = true
|
||||
}, 2000);
|
||||
that.seckillList = [],
|
||||
that.page = 1
|
||||
that.status = that.timeList[that.active].status
|
||||
that.getSeckillList();
|
||||
}
|
||||
});
|
||||
},
|
||||
getSeckillList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getSeckillList(that.timeList[that.active].id, data).then(res => {
|
||||
var seckillList = res.data;
|
||||
var loadend = seckillList.length < that.limit;
|
||||
that.page++;
|
||||
that.seckillList = that.seckillList.concat(seckillList),
|
||||
that.page = that.page;
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
},
|
||||
settimeList: function(item, index) {
|
||||
var that = this;
|
||||
this.active = index
|
||||
if (that.interval) {
|
||||
clearInterval(that.interval);
|
||||
that.interval = null
|
||||
}
|
||||
that.interval = 0,
|
||||
that.countDownHour = "00";
|
||||
that.countDownMinute = "00";
|
||||
that.countDownSecond = "00";
|
||||
that.status = that.timeList[that.active].status;
|
||||
that.loadend = false;
|
||||
that.page = 1;
|
||||
that.seckillList = [];
|
||||
// wxh.time(e.currentTarget.dataset.stop, that);
|
||||
that.getSeckillList();
|
||||
},
|
||||
goDetails(item){
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/goods_seckill_details/index?id=' + item.id + '&time=' + this.timeList[this.active].stop + '&status=' + this.status
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getSeckillList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #F5F5F5 !important;
|
||||
}
|
||||
|
||||
.flash-sale .header {
|
||||
width: 710rpx;
|
||||
height: 300rpx;
|
||||
margin: -215rpx auto 0 auto;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.flash-sale .header image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.flash-sale .seckillList {
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.flash-sale .seckillList .priceTag {
|
||||
width: 75rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.flash-sale .seckillList .priceTag image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.flash-sale .timeLsit {
|
||||
width: 610rpx;
|
||||
white-space: nowrap;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.flash-sale .timeLsit .item {
|
||||
display: inline-block;
|
||||
font-size: 20rpx;
|
||||
color: #666;
|
||||
text-align: center;
|
||||
padding: 11rpx 0;
|
||||
box-sizing: border-box;
|
||||
height: 96rpx;
|
||||
margin-right: 35rpx;
|
||||
}
|
||||
|
||||
.flash-sale .timeLsit .item .time {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.flash-sale .timeLsit .item.on .time {
|
||||
color: #E93323;
|
||||
}
|
||||
|
||||
.flash-sale .timeLsit .item.on .state {
|
||||
width: 90rpx;
|
||||
height: 30rpx;
|
||||
border-radius: 15rpx;
|
||||
background: linear-gradient(90deg, rgba(252, 25, 75, 1) 0%, rgba(252, 60, 32, 1) 100%);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.flash-sale .countDown {
|
||||
height: 92rpx;
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
margin-top: -14rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.flash-sale .countDown .num {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
background-color: #ffcfcb;
|
||||
padding: 4rpx 7rpx;
|
||||
border-radius: 3rpx;
|
||||
}
|
||||
|
||||
.flash-sale .countDown .text {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
margin-right: 13rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item {
|
||||
height: 230rpx;
|
||||
position: relative;
|
||||
width: 710rpx;
|
||||
margin: 0 auto 20rpx auto;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 0 25rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .pictrue {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text {
|
||||
width: 460rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
height: 166rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .name {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .money {
|
||||
font-size: 30rpx;
|
||||
color: #E93323;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .money .num {
|
||||
font-size: 40rpx;
|
||||
font-weight: 500;
|
||||
font-family: 'Guildford Pro';
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .money .y_money {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-decoration-line: line-through;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .limit {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .limit .limitPrice {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .progress {
|
||||
overflow: hidden;
|
||||
background-color: #FFEFEF;
|
||||
width: 260rpx;
|
||||
border-radius: 18rpx;
|
||||
height: 18rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .progress .bg-reds {
|
||||
width: 0;
|
||||
height: 100%;
|
||||
transition: width 0.6s ease;
|
||||
background: linear-gradient(90deg, rgba(233, 51, 35, 1) 0%, rgba(255, 137, 51, 1) 100%);
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text .progress .piece {
|
||||
position: absolute;
|
||||
left: 8%;
|
||||
transform: translate(0%, -50%);
|
||||
top: 49%;
|
||||
font-size: 16rpx;
|
||||
color: #FFB9B9;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .grab {
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
width: 150rpx;
|
||||
height: 54rpx;
|
||||
border-radius: 27rpx;
|
||||
text-align: center;
|
||||
line-height: 54rpx;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
bottom: 30rpx;
|
||||
background: #bbbbbb;
|
||||
}
|
||||
|
||||
.flash-sale .saleBox {
|
||||
width: 100%;
|
||||
height: 230rpx;
|
||||
background: rgba(233, 51, 35, 1);
|
||||
border-radius: 0 0 50rpx 50rpx;
|
||||
}
|
||||
</style>
|
||||
1205
app/pages/activity/goods_seckill_details/index.vue
Normal file
1205
app/pages/activity/goods_seckill_details/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
136
app/pages/activity/poster-poster/index.vue
Normal file
136
app/pages/activity/poster-poster/index.vue
Normal file
@@ -0,0 +1,136 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='poster-poster'>
|
||||
<view class='tip'><text class='iconfont icon-shuoming'></text>提示：点击图片即可保存至手机相册 </view>
|
||||
<view class='pictrue'>
|
||||
<image :src='image' mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getBargainPoster, getCombinationPoster } from '../../../api/activity.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
parameter: {
|
||||
'navbar': '1',
|
||||
'return': '1',
|
||||
'title': '拼团海报',
|
||||
'color': true,
|
||||
'class': '0'
|
||||
},
|
||||
type: 0,
|
||||
id: 0,
|
||||
image: '',
|
||||
from:''
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
// #ifdef MP
|
||||
this.from = 'routine'
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
this.from = 'wechat'
|
||||
// #endif
|
||||
var that = this;
|
||||
if (options.hasOwnProperty('type') && options.hasOwnProperty('id')) {
|
||||
this.type = options.type
|
||||
this.id = options.id
|
||||
if (options.type == 1) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '砍价海报'
|
||||
})
|
||||
} else {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '拼团海报'
|
||||
})
|
||||
}
|
||||
} else {
|
||||
return app.Tips({
|
||||
title: '参数错误',
|
||||
icon: 'none'
|
||||
}, {
|
||||
tab: 3,
|
||||
url: 1
|
||||
});
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.getPosterInfo();
|
||||
},
|
||||
methods: {
|
||||
getPosterInfo: function() {
|
||||
var that = this,url = '';
|
||||
let data = {
|
||||
id: that.id,
|
||||
'from': that.from
|
||||
};
|
||||
if (that.type == 1) {
|
||||
getBargainPoster({
|
||||
bargainId: that.id,
|
||||
'from': that.from
|
||||
}).then(res => {
|
||||
that.image = res.data.url
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
} else {
|
||||
getCombinationPoster(data).then(res => {
|
||||
that.image = res.data.url
|
||||
}).catch(err => {
|
||||
|
||||
})
|
||||
}
|
||||
},
|
||||
showImage: function() {
|
||||
var that = this;
|
||||
let imgArr = this.image.split(',')
|
||||
uni.previewImage({
|
||||
urls: imgArr,
|
||||
longPressActions: {
|
||||
itemList: ['发送给朋友', '保存图片', '收藏'],
|
||||
success: function(data) {
|
||||
console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
|
||||
},
|
||||
fail: function(err) {
|
||||
console.log(err.errMsg);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #d22516 !important;
|
||||
}
|
||||
|
||||
.poster-poster .tip {
|
||||
height: 80rpx;
|
||||
font-size: 26rpx;
|
||||
color: #e8c787;
|
||||
text-align: center;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
|
||||
.poster-poster .tip .iconfont {
|
||||
font-size: 36rpx;
|
||||
vertical-align: -4rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
|
||||
.poster-poster .pictrue {
|
||||
width: 690rpx;
|
||||
height: 100%;
|
||||
margin: 0 auto 50rpx auto;
|
||||
}
|
||||
|
||||
.poster-poster .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
360
app/pages/admin/delivery/index.vue
Normal file
360
app/pages/admin/delivery/index.vue
Normal file
@@ -0,0 +1,360 @@
|
||||
<template>
|
||||
<view class="deliver-goods">
|
||||
<header>
|
||||
<view class="order-num acea-row row-between-wrapper">
|
||||
<view class="num line1">订单号：{{ order_id }}</view>
|
||||
<view class="name line1">
|
||||
<span class="iconfont icon-yonghu2"></span>{{ delivery.nickname }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="address">
|
||||
<view class="name">
|
||||
{{ delivery.real_name
|
||||
}}<span class="phone">{{ delivery.user_phone }}</span>
|
||||
</view>
|
||||
<view>{{ delivery.user_address }}</view>
|
||||
</view>
|
||||
<view class="line"><image src="@/static/images/line.jpg" /></view>
|
||||
</header>
|
||||
<view class="wrapper">
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<view>发货方式</view>
|
||||
<view class="mode acea-row row-middle row-right">
|
||||
<view class="goods" :class="active === index ? 'on' : ''" v-for="(item, index) in types" :key="index" @click="changeType(item, index)">
|
||||
{{ item.title }}<span class="iconfont icon-xuanzhong2"></span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="logistics.length>0">
|
||||
<view class="list" v-show="active === 0">
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<view>发货方式</view>
|
||||
<view class="select-box">
|
||||
<picker class="pickerBox" @change="bindPickerChange" :value="seIndex" :range="logistics" range-key="name">
|
||||
<!-- <view></view> -->
|
||||
<view class="uni-input">{{logistics[seIndex].name}}</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<view>快递单号</view>
|
||||
<input type="text" placeholder="填写快递单号" v-model="delivery_id" class="mode" />
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<view class="list" v-show="active === 1">
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<view>送货人</view>
|
||||
<input type="text" placeholder="填写送货人" v-model="delivery_name" class="mode" />
|
||||
</view>
|
||||
<view class="item acea-row row-between-wrapper">
|
||||
<view>送货电话</view>
|
||||
<input type="text" placeholder="填写送货电话" v-model="delivery_id" class="mode" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height:1.2rem;"></view>
|
||||
<view class="confirm" @click="saveInfo">确认提交</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getAdminOrderDelivery,
|
||||
setAdminOrderDelivery,
|
||||
getLogistics
|
||||
} from "@/api/admin";
|
||||
import { checkPhone } from '@/utils/validate.js'
|
||||
export default {
|
||||
name: "GoodsDeliver",
|
||||
components: {},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
types: [{
|
||||
type: "express",
|
||||
title: "发货"
|
||||
},
|
||||
{
|
||||
type: "send",
|
||||
title: "送货"
|
||||
},
|
||||
{
|
||||
type: "fictitious",
|
||||
title: "无需发货"
|
||||
}
|
||||
],
|
||||
active: 0,
|
||||
order_id: "",
|
||||
delivery: [],
|
||||
logistics: [],
|
||||
delivery_type: "express",
|
||||
delivery_name: "",
|
||||
delivery_id: "",
|
||||
seIndex:0,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
"$route.params.oid": function(newVal) {
|
||||
let that = this;
|
||||
if (newVal != undefined) {
|
||||
that.order_id = newVal;
|
||||
that.getIndex();
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad: function(option) {
|
||||
this.order_id = option.id;
|
||||
this.getIndex();
|
||||
this.getLogistics();
|
||||
},
|
||||
methods: {
|
||||
changeType: function(item, index) {
|
||||
this.active = index;
|
||||
this.delivery_type = item.type;
|
||||
this.delivery_name = "";
|
||||
this.delivery_id = "";
|
||||
},
|
||||
getIndex: function() {
|
||||
let that = this;
|
||||
getAdminOrderDelivery(that.order_id).then(
|
||||
res => {
|
||||
that.delivery = res.data;
|
||||
},
|
||||
error => {
|
||||
that.$dialog.error(error.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
getLogistics: function() {
|
||||
let that = this;
|
||||
getLogistics().then(
|
||||
res => {
|
||||
that.logistics = res.data;
|
||||
},
|
||||
error => {
|
||||
that.$dialog.error(error.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
async saveInfo() {
|
||||
let that = this,
|
||||
delivery_type = that.delivery_type,
|
||||
delivery_name = that.logistics[that.seIndex].name,
|
||||
delivery_id = that.delivery_id,
|
||||
userName = that.delivery_name,
|
||||
save = {};
|
||||
save.order_id = that.order_id;
|
||||
save.delivery_type = that.delivery_type;
|
||||
switch (delivery_type) {
|
||||
case "send":
|
||||
if(!userName){
|
||||
return that.$util.Tips({
|
||||
title:'请填写送货人姓名'
|
||||
})
|
||||
}
|
||||
if(!delivery_id || !checkPhone(delivery_id)){
|
||||
return that.$util.Tips({
|
||||
title:'请填写正确的手机号码'
|
||||
})
|
||||
}
|
||||
save.delivery_name = userName;
|
||||
save.delivery_id = delivery_id;
|
||||
that.setInfo(save);
|
||||
break;
|
||||
case "express":
|
||||
if(!delivery_id){
|
||||
return this.$util.Tips({
|
||||
title:'请填写快递单号'
|
||||
})
|
||||
}
|
||||
save.delivery_name = delivery_name;
|
||||
save.delivery_id = delivery_id;
|
||||
that.setInfo(save);
|
||||
break;
|
||||
case "fictitious":
|
||||
that.setInfo(save);
|
||||
break;
|
||||
}
|
||||
},
|
||||
setInfo: function(item) {
|
||||
let that = this;
|
||||
console.log(item);
|
||||
setAdminOrderDelivery(item).then(
|
||||
res => {
|
||||
that.$util.Tips({
|
||||
title:res.msg,
|
||||
icon:'success',
|
||||
mask:true
|
||||
})
|
||||
setTimeout(res=>{
|
||||
uni.navigateBack();
|
||||
},2000)
|
||||
},
|
||||
error => {
|
||||
that.$dialog.error(error.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
bindPickerChange(e){
|
||||
console.log(e,'tar')
|
||||
this.seIndex = e.detail.value
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*发货*/
|
||||
.deliver-goods header {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
margin-top: 10upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .order-num {
|
||||
padding: 0 30upx;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
height: 67upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .order-num .num {
|
||||
width: 430upx;
|
||||
font-size: 26upx;
|
||||
color: #282828;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.deliver-goods header .order-num .num:after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
width: 1px;
|
||||
height: 30upx;
|
||||
background-color: #ddd;
|
||||
top: 50%;
|
||||
margin-top: -15upx;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.deliver-goods header .order-num .name {
|
||||
width: 260upx;
|
||||
font-size: 26upx;
|
||||
color: #282828;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.deliver-goods header .order-num .name .iconfont {
|
||||
font-size: 35upx;
|
||||
color: #477ef3;
|
||||
vertical-align: middle;
|
||||
margin-right: 10upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .address {
|
||||
font-size: 26upx;
|
||||
color: #868686;
|
||||
background-color: #fff;
|
||||
padding: 30upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .address .name {
|
||||
font-size: 34upx;
|
||||
color: #282828;
|
||||
margin-bottom: 10upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .address .name .phone {
|
||||
margin-left: 40upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .line {
|
||||
width: 100%;
|
||||
height: 3upx;
|
||||
}
|
||||
|
||||
.deliver-goods header .line image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item {
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 30upx;
|
||||
height: 96upx;
|
||||
font-size: 32upx;
|
||||
color: #282828;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item .mode {
|
||||
width: 460upx;
|
||||
height: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item .mode .iconfont {
|
||||
font-size: 30upx;
|
||||
margin-left: 13upx;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item .mode .goods~.goods {
|
||||
margin-left: 30upx;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item .mode .goods {
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item .mode .goods.on {
|
||||
color: #477ef3;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item .icon-up {
|
||||
position: absolute;
|
||||
font-size: 35upx;
|
||||
color: #2c2c2c;
|
||||
right: 30upx;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item select {
|
||||
direction: rtl;
|
||||
padding-right: 60upx;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.deliver-goods .wrapper .item input::placeholder {
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.deliver-goods .confirm {
|
||||
font-size: 32upx;
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
height: 100upx;
|
||||
background-color: #477ef3;
|
||||
text-align: center;
|
||||
line-height: 100upx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
.select-box{
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
|
||||
.pickerBox{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
268
app/pages/admin/order/index.vue
Normal file
268
app/pages/admin/order/index.vue
Normal file
File diff suppressed because one or more lines are too long
776
app/pages/admin/orderDetail/index.vue
Normal file
776
app/pages/admin/orderDetail/index.vue
Normal file
@@ -0,0 +1,776 @@
|
||||
<template>
|
||||
<view class="order-details pos-order-details">
|
||||
<view class="header acea-row row-middle">
|
||||
<view class="state">{{ title }}</view>
|
||||
<view class="data">
|
||||
<view class="order-num">订单：{{ orderInfo.order_id }}</view>
|
||||
<view>
|
||||
<span class="time">{{ orderInfo.add_time }}</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="remarks acea-row row-between-wrapper" v-if="goname != 'looks'">
|
||||
<span class="iconfont icon-zhinengkefu-"></span>
|
||||
<input type="button" class="line1" style="text-align: left;" :value="
|
||||
orderInfo.remark ? orderInfo.remark : '订单未备注，点击添加备注信息'
|
||||
"
|
||||
@click="modify('1')" />
|
||||
</view>
|
||||
<view class="orderingUser acea-row row-middle">
|
||||
<span class="iconfont icon-yonghu2"></span>{{ orderInfo.nickname }}
|
||||
</view>
|
||||
<view class="address">
|
||||
<view class="name">
|
||||
{{ orderInfo.real_name
|
||||
}}<span class="phone">{{ orderInfo.user_phone }}</span>
|
||||
</view>
|
||||
<view>{{ orderInfo.user_address }}</view>
|
||||
</view>
|
||||
<view class="line">
|
||||
<image src="/static/images/line.jpg" />
|
||||
</view>
|
||||
<view class="pos-order-goods">
|
||||
<navigator :url="`/pages/goods_details/index?id=${item.cart_info.productInfo.product_id}`" hover-class="none" class="goods acea-row row-between-wrapper" v-for="(item, index) in orderInfo._info" :key="index">
|
||||
<view class="picTxt acea-row row-between-wrapper">
|
||||
<view class="pictrue">
|
||||
<image :src="item.cart_info.productInfo.image" />
|
||||
</view>
|
||||
<view class="text acea-row row-between row-column">
|
||||
<view class="info line2">
|
||||
{{ item.cart_info.productInfo.store_name }}
|
||||
</view>
|
||||
<view class="attr">{{ item.cart_info.productInfo.suk }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="money">
|
||||
<view class="x-money">￥{{ item.cart_info.productInfo.price }}</view>
|
||||
<view class="num">x{{ item.cart_info.cart_num }}</view>
|
||||
<view class="y-money">￥{{ item.cart_info.productInfo.ot_price }}</view>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="public-total">
|
||||
共{{ orderInfo.total_num }}件商品，应支付
|
||||
<span class="money">￥{{ orderInfo.pay_price }}</span> ( 邮费 ¥{{
|
||||
orderInfo.pay_postage
|
||||
}}
|
||||
)
|
||||
</view>
|
||||
<view class="wrapper">
|
||||
<view class="item acea-row row-between">
|
||||
<view>订单编号：</view>
|
||||
<view class="conter acea-row row-middle row-right">
|
||||
{{ orderInfo.order_id
|
||||
}}
|
||||
<!-- #ifdef H5 -->
|
||||
<span class="copy copy-data" :data-clipboard-text="orderInfo.order_id">复制</span>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<span class="copy copy-data" @click="copyNum(orderInfo.order_id)">复制</span>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view>下单时间：</view>
|
||||
<view class="conter">{{ orderInfo.add_time }}</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view>支付状态：</view>
|
||||
<view class="conter">
|
||||
{{ orderInfo.paid == 1 ? "已支付" : "未支付" }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view>支付方式：</view>
|
||||
<view class="conter">{{ payType }}</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view>买家留言：</view>
|
||||
<view class="conter">{{ orderInfo.mark }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper">
|
||||
<view class="item acea-row row-between">
|
||||
<view>支付金额：</view>
|
||||
<view class="conter">￥{{ orderInfo.total_price }}</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view>优惠券抵扣：</view>
|
||||
<view class="conter">-￥{{ orderInfo.coupon_price }}</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view>运费：</view>
|
||||
<view class="conter">￥{{ orderInfo.freight_price }}</view>
|
||||
</view>
|
||||
<view class="actualPay acea-row row-right">
|
||||
实付款：<span class="money font-color-red">￥{{ orderInfo.pay_price }}</span>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper" v-if="
|
||||
orderInfo.delivery_type != 'fictitious' && orderInfo._status._type === 2
|
||||
">
|
||||
<view class="item acea-row row-between">
|
||||
<view>配送方式：</view>
|
||||
<view class="conter" v-if="orderInfo.delivery_type === 'express'">
|
||||
快递
|
||||
</view>
|
||||
<view class="conter" v-if="orderInfo.delivery_type === 'send'">送货</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view v-if="orderInfo.delivery_type === 'express'">快递公司：</view>
|
||||
<view v-if="orderInfo.delivery_type === 'send'">送货人：</view>
|
||||
<view class="conter">{{ orderInfo.delivery_name }}</view>
|
||||
</view>
|
||||
<view class="item acea-row row-between">
|
||||
<view v-if="orderInfo.delivery_type === 'express'">快递单号：</view>
|
||||
<view v-if="orderInfo.delivery_type === 'send'">送货人电话：</view>
|
||||
<view class="conter">
|
||||
{{ orderInfo.delivery_id
|
||||
}}<span class="copy copy-data" :data-clipboard-text="orderInfo.delivery_id">复制</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="height:120upx;"></view>
|
||||
<view class="footer acea-row row-right row-middle" v-if="goname != 'looks'">
|
||||
<view class="more"></view>
|
||||
<view class="bnt cancel" @click="modify('0')" v-if="types == 0">
|
||||
一键改价
|
||||
</view>
|
||||
<view class="bnt cancel" @click="modify('0')" v-if="types == -1">
|
||||
立即退款
|
||||
</view>
|
||||
<view class="bnt cancel" @click="modify('1')">订单备注</view>
|
||||
<view class="bnt cancel" v-if="orderInfo.pay_type === 'offline' && orderInfo.paid === 0" @click="offlinePay">
|
||||
确认付款
|
||||
</view>
|
||||
<navigator class="bnt delivery" v-if="types == 1" :url="'/pages/admin/delivery/index?id='+orderInfo.order_id">去发货</navigator>
|
||||
</view>
|
||||
<PriceChange :change="change" :orderInfo="orderInfo" v-on:closechange="changeclose($event)" v-on:savePrice="savePrice"
|
||||
:status="status"></PriceChange>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import PriceChange from "@/components/PriceChange";
|
||||
// #ifdef H5
|
||||
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
|
||||
// #endif
|
||||
import {
|
||||
getAdminOrderDetail,
|
||||
setAdminOrderPrice,
|
||||
setAdminOrderRemark,
|
||||
setOfflinePay,
|
||||
setOrderRefund
|
||||
} from "@/api/admin";
|
||||
// import { required, num } from "@utils/validate";
|
||||
// import { validatorDefaultCatch } from "@utils/dialog";
|
||||
import {
|
||||
isMoney
|
||||
} from '@/utils/validate.js'
|
||||
|
||||
export default {
|
||||
name: "AdminOrder",
|
||||
components: {
|
||||
PriceChange
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
order: false,
|
||||
change: false,
|
||||
order_id: "",
|
||||
orderInfo: {
|
||||
_status: {}
|
||||
},
|
||||
status: "",
|
||||
title: "",
|
||||
payType: "",
|
||||
types: "",
|
||||
clickNum: 1,
|
||||
goname:''
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
"$route.params.oid": function(newVal) {
|
||||
let that = this;
|
||||
if (newVal != undefined) {
|
||||
that.order_id = newVal;
|
||||
that.getIndex();
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad: function(option) {
|
||||
let self = this
|
||||
this.order_id = option.id;
|
||||
this.goname = option.goname
|
||||
this.getIndex();
|
||||
// #ifdef H5
|
||||
this.$nextTick(function() {
|
||||
var clipboard = new ClipboardJS('.copy-data');
|
||||
// var copybtn = document.getElementsByClassName("copy-data");
|
||||
// var clipboard = new Clipboard(copybtn);
|
||||
clipboard.on('success', function(e) {
|
||||
self.$util.Tips({
|
||||
title:'复制成功'
|
||||
})
|
||||
});
|
||||
clipboard.on('error', function(e) {
|
||||
self.$util.Tips({
|
||||
title:'复制失败'
|
||||
})
|
||||
});
|
||||
});
|
||||
// #endif
|
||||
|
||||
},
|
||||
methods: {
|
||||
more: function() {
|
||||
this.order = !this.order;
|
||||
},
|
||||
modify: function(status) {
|
||||
this.change = true;
|
||||
this.status = status;
|
||||
},
|
||||
changeclose: function(msg) {
|
||||
this.change = msg;
|
||||
},
|
||||
getIndex: function() {
|
||||
let that = this;
|
||||
getAdminOrderDetail(that.order_id).then(
|
||||
res => {
|
||||
that.orderInfo = res.data;
|
||||
that.types = res.data._status._type;
|
||||
that.title = res.data._status._title;
|
||||
that.payType = res.data._status._payType;
|
||||
},
|
||||
err => {
|
||||
that.$util.Tips({
|
||||
title: err
|
||||
}, {
|
||||
tab: 3,
|
||||
url: 1
|
||||
});
|
||||
}
|
||||
);
|
||||
},
|
||||
async savePrice(opt) {
|
||||
let that = this,
|
||||
data = {},
|
||||
price = opt.price,
|
||||
refund_price = opt.refund_price,
|
||||
refund_status = that.orderInfo.refund_status,
|
||||
remark = opt.remark;
|
||||
data.order_id = that.orderInfo.order_id;
|
||||
if (that.status == 0 && refund_status === 0) {
|
||||
if (!isMoney(price)) {
|
||||
return that.$util.Tips({
|
||||
title: '请输入正确的金额'
|
||||
});
|
||||
}
|
||||
data.price = price;
|
||||
setAdminOrderPrice(data).then(
|
||||
function() {
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title: '改价成功',
|
||||
icon: 'success'
|
||||
})
|
||||
that.getIndex();
|
||||
},
|
||||
function() {
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title: '改价失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
);
|
||||
} else if (that.status == 0 && refund_status === 1) {
|
||||
if (!isMoney(refund_price)) {
|
||||
return that.$util.Tips({
|
||||
title: '请输入正确的金额'
|
||||
});
|
||||
}
|
||||
data.price = refund_price;
|
||||
data.type = opt.type;
|
||||
setOrderRefund(data).then(
|
||||
res => {
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title: res.msg
|
||||
});
|
||||
that.getIndex();
|
||||
},
|
||||
err => {
|
||||
console.log(err, 'err')
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
}
|
||||
);
|
||||
} else {
|
||||
if (!remark) {
|
||||
return this.$util.Tips({
|
||||
title: '请输入备注'
|
||||
})
|
||||
}
|
||||
data.remark = remark;
|
||||
setAdminOrderRemark(data).then(
|
||||
res => {
|
||||
that.change = false;
|
||||
this.$util.Tips({
|
||||
title: res.msg,
|
||||
icon: 'success'
|
||||
})
|
||||
that.getIndex();
|
||||
},
|
||||
err => {
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
offlinePay: function() {
|
||||
setOfflinePay({
|
||||
order_id: this.orderInfo.order_id
|
||||
}).then(
|
||||
res => {
|
||||
this.$util.Tips({
|
||||
title: res.msg,
|
||||
icon: 'success'
|
||||
});
|
||||
this.getIndex();
|
||||
},
|
||||
err => {
|
||||
this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
}
|
||||
);
|
||||
},
|
||||
// #ifdef MP
|
||||
copyNum(id) {
|
||||
|
||||
uni.setClipboardData({
|
||||
data: id,
|
||||
success: function() {
|
||||
console.log('success');
|
||||
}
|
||||
});
|
||||
},
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
webCopy(item, index) {
|
||||
console.log('yunxingle')
|
||||
let items = item
|
||||
let indexs = index
|
||||
let self = this
|
||||
|
||||
if (self.clickNum == 1) {
|
||||
console.log('22')
|
||||
self.clickNum += 1
|
||||
self.webCopy(items, indexs)
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/*商户管理订单详情*/
|
||||
.pos-order-details .header {
|
||||
background: linear-gradient(to right, #2291f8 0%, #1cd1dc 100%);
|
||||
background: -webkit-linear-gradient(to right, #2291f8 0%, #1cd1dc 100%);
|
||||
background: -moz-linear-gradient(to right, #2291f8 0%, #1cd1dc 100%);
|
||||
}
|
||||
|
||||
.pos-order-details .header .state {
|
||||
font-size: 36upx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.pos-order-details .header .data {
|
||||
margin-left: 35upx;
|
||||
font-size: 28upx;
|
||||
}
|
||||
|
||||
.pos-order-details .header .data .order-num {
|
||||
font-size: 30upx;
|
||||
margin-bottom: 8upx;
|
||||
}
|
||||
|
||||
.pos-order-details .remarks {
|
||||
width: 100%;
|
||||
height: 86upx;
|
||||
background-color: #fff;
|
||||
padding: 0 30upx;
|
||||
}
|
||||
|
||||
.pos-order-details .remarks .iconfont {
|
||||
font-size: 40upx;
|
||||
color: #2a7efb;
|
||||
}
|
||||
|
||||
.pos-order-details .remarks input {
|
||||
width: 630upx;
|
||||
height: 100%;
|
||||
font-size: 30upx;
|
||||
}
|
||||
|
||||
.pos-order-details .remarks input::placeholder {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.pos-order-details .orderingUser {
|
||||
font-size: 26upx;
|
||||
color: #282828;
|
||||
padding: 0 30upx;
|
||||
height: 67upx;
|
||||
background-color: #fff;
|
||||
margin-top: 16upx;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
}
|
||||
|
||||
.pos-order-details .orderingUser .iconfont {
|
||||
font-size: 40upx;
|
||||
color: #2a7efb;
|
||||
margin-right: 15upx;
|
||||
}
|
||||
|
||||
.pos-order-details .address {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.pos-order-details .pos-order-goods {
|
||||
margin-top: 17upx;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more {
|
||||
font-size: 27upx;
|
||||
color: #aaa;
|
||||
width: 100upx;
|
||||
height: 64upx;
|
||||
text-align: center;
|
||||
line-height: 64upx;
|
||||
margin-right: 25upx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .delivery {
|
||||
background: linear-gradient(to right, #2291f8 0%, #1cd1dc 100%);
|
||||
background: -webkit-linear-gradient(to right, #2291f8 0%, #1cd1dc 100%);
|
||||
background: -moz-linear-gradient(to right, #2291f8 0%, #1cd1dc 100%);
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more .order .arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 11upx solid transparent;
|
||||
border-right: 11upx solid transparent;
|
||||
border-top: 20upx solid #e5e5e5;
|
||||
position: absolute;
|
||||
left: 15upx;
|
||||
bottom: -18upx;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more .order .arrow:before {
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 9upx solid transparent;
|
||||
border-right: 9upx solid transparent;
|
||||
border-top: 19upx solid #fff;
|
||||
position: absolute;
|
||||
left: -10upx;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more .order {
|
||||
width: 200upx;
|
||||
background-color: #fff;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 10upx;
|
||||
position: absolute;
|
||||
top: -200upx;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more .order .item {
|
||||
height: 77upx;
|
||||
line-height: 77upx;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more .order .item~.item {
|
||||
border-top: 1px solid #f5f5f5;
|
||||
}
|
||||
|
||||
.pos-order-details .footer .more .moreName {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/*订单详情*/
|
||||
.order-details .header {
|
||||
padding: 0 30upx;
|
||||
height: 150upx;
|
||||
}
|
||||
|
||||
.order-details .header.on {
|
||||
background-color: #666 !important;
|
||||
}
|
||||
|
||||
.order-details .header .pictrue {
|
||||
width: 110upx;
|
||||
height: 110upx;
|
||||
}
|
||||
|
||||
.order-details .header .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.order-details .header .data {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 24upx;
|
||||
margin-left: 27upx;
|
||||
}
|
||||
|
||||
.order-details .header.on .data {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.order-details .header .data .state {
|
||||
font-size: 30upx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
margin-bottom: 7upx;
|
||||
}
|
||||
|
||||
/* .order-details .header .data .time{margin-left:20upx;} */
|
||||
.order-details .nav {
|
||||
background-color: #fff;
|
||||
font-size: 26upx;
|
||||
color: #282828;
|
||||
padding: 25upx 0;
|
||||
}
|
||||
|
||||
.order-details .nav .navCon {
|
||||
padding: 0 40upx;
|
||||
}
|
||||
|
||||
.order-details .nav .navCon .on {
|
||||
font-weight: bold;
|
||||
color: #e93323;
|
||||
}
|
||||
|
||||
.order-details .nav .progress {
|
||||
padding: 0 65upx;
|
||||
margin-top: 10upx;
|
||||
}
|
||||
|
||||
.order-details .nav .progress .line {
|
||||
width: 100upx;
|
||||
height: 2upx;
|
||||
background-color: #939390;
|
||||
}
|
||||
|
||||
.order-details .nav .progress .iconfont {
|
||||
font-size: 25upx;
|
||||
color: #939390;
|
||||
margin-top: -2upx;
|
||||
width: 30upx;
|
||||
height: 30upx;
|
||||
line-height: 33upx;
|
||||
text-align: center;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.order-details .address {
|
||||
font-size: 26upx;
|
||||
color: #868686;
|
||||
background-color: #fff;
|
||||
padding: 25upx 30upx 30upx 30upx;
|
||||
}
|
||||
|
||||
.order-details .address .name {
|
||||
font-size: 30upx;
|
||||
color: #282828;
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
|
||||
.order-details .address .name .phone {
|
||||
margin-left: 40upx;
|
||||
}
|
||||
|
||||
.order-details .line {
|
||||
width: 100%;
|
||||
height: 3upx;
|
||||
}
|
||||
|
||||
.order-details .line image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.order-details .wrapper {
|
||||
background-color: #fff;
|
||||
margin-top: 12upx;
|
||||
padding: 30upx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item {
|
||||
font-size: 28upx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item~.item {
|
||||
margin-top: 20upx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item .conter {
|
||||
color: #868686;
|
||||
width: 500upx;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item .conter .copy {
|
||||
font-size: 20rpx;
|
||||
color: #333;
|
||||
border-radius: 3rpx;
|
||||
border: 1px solid #666;
|
||||
padding: 0rpx 15rpx;
|
||||
margin-left: 24rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .actualPay {
|
||||
border-top: 1upx solid #eee;
|
||||
margin-top: 30upx;
|
||||
padding-top: 30upx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .actualPay .money {
|
||||
font-weight: bold;
|
||||
font-size: 30upx;
|
||||
}
|
||||
|
||||
.order-details .footer {
|
||||
width: 100%;
|
||||
height: 100upx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: #fff;
|
||||
padding: 0 30upx;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt {
|
||||
width: auto;
|
||||
height: 60upx;
|
||||
line-height: 60upx;
|
||||
text-align: center;
|
||||
line-height: upx;
|
||||
border-radius: 50upx;
|
||||
color: #fff;
|
||||
font-size: 27upx;
|
||||
padding: 0 3%;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt.cancel {
|
||||
color: #aaa;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt.default {
|
||||
color: #444;
|
||||
border: 1px solid #444;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt~.bnt {
|
||||
margin-left: 18upx;
|
||||
}
|
||||
|
||||
.pos-order-goods {
|
||||
padding: 0 30upx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods {
|
||||
height: 185upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods~.goods {
|
||||
border-top: 1px dashed #e5e5e5;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt {
|
||||
width: 515upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .pictrue {
|
||||
width: 130upx;
|
||||
height: 130upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .text {
|
||||
width: 365upx;
|
||||
height: 130upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .text .info {
|
||||
font-size: 28upx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .text .attr {
|
||||
font-size: 24upx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money {
|
||||
width: 164upx;
|
||||
text-align: right;
|
||||
font-size: 28upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money .x-money {
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money .num {
|
||||
color: #ff9600;
|
||||
margin: 5upx 0;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money .y-money {
|
||||
color: #999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.public-total {
|
||||
font-size: 28upx;
|
||||
color: #282828;
|
||||
border-top: 1px solid #eee;
|
||||
height: 92upx;
|
||||
line-height: 92upx;
|
||||
text-align: right;
|
||||
padding: 0 30upx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.public-total .money {
|
||||
color: #ff4c3c;
|
||||
}
|
||||
</style>
|
||||
467
app/pages/admin/orderList/index.vue
Normal file
467
app/pages/admin/orderList/index.vue
Normal file
@@ -0,0 +1,467 @@
|
||||
<template>
|
||||
<view class="pos-order-list" ref="container">
|
||||
<view class="nav acea-row row-around row-middle">
|
||||
<view class="item" :class="where.status == 0 ? 'on' : ''" @click="changeStatus(0)">
|
||||
待付款
|
||||
</view>
|
||||
<view class="item" :class="where.status == 1 ? 'on' : ''" @click="changeStatus(1)">
|
||||
待发货
|
||||
</view>
|
||||
<view class="item" :class="where.status == 2 ? 'on' : ''" @click="changeStatus(2)">
|
||||
待收货
|
||||
</view>
|
||||
<view class="item" :class="where.status == 3 ? 'on' : ''" @click="changeStatus(3)">
|
||||
待评价
|
||||
</view>
|
||||
<view class="item" :class="where.status == 4 ? 'on' : ''" @click="changeStatus(4)">
|
||||
已完成
|
||||
</view>
|
||||
<view class="item" :class="where.status == -3 ? 'on' : ''" @click="changeStatus(-3)">
|
||||
退款
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="item" v-for="(item, index) in list" :key="index">
|
||||
<view class="order-num acea-row row-middle" @click="toDetail(item)">
|
||||
订单号：{{ item.order_id }}
|
||||
<span class="time">下单时间：{{ item.add_time }}</span>
|
||||
</view>
|
||||
<view class="pos-order-goods" v-for="(val, key) in item._info" :key="key">
|
||||
<view class="goods acea-row row-between-wrapper" @click="toDetail(item)">
|
||||
<view class="picTxt acea-row row-between-wrapper">
|
||||
<view class="pictrue">
|
||||
<image :src="val.cart_info.productInfo.image" />
|
||||
</view>
|
||||
<view class="text acea-row row-between row-column">
|
||||
<view class="info line2">
|
||||
{{ val.cart_info.productInfo.store_name }}
|
||||
</view>
|
||||
<view class="attr" v-if="val.cart_info.productInfo.suk">
|
||||
{{ val.cart_info.productInfo.suk }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="money">
|
||||
<view class="x-money">￥{{ val.cart_info.productInfo.price }}</view>
|
||||
<view class="num">x{{ val.cart_info.cart_num }}</view>
|
||||
<view class="y-money">
|
||||
￥{{ val.cart_info.productInfo.ot_price }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="public-total">
|
||||
共{{ item.total_num }}件商品，应支付
|
||||
<span class="money">￥{{ item.pay_price }}</span> ( 邮费 ¥{{
|
||||
item.total_postage
|
||||
}}
|
||||
)
|
||||
</view>
|
||||
<view class="operation acea-row row-between-wrapper">
|
||||
<view class="more">
|
||||
<!-- <view class="iconfont icon-gengduo" @click="more(index)"></view>-->
|
||||
<!-- <view class="order" v-show="current === index">-->
|
||||
<!-- <view class="items">-->
|
||||
<!-- {{ where.status > 0 ? "删除" : "取消" }}订单-->
|
||||
<!-- </view>-->
|
||||
<!-- <view class="arrow"></view>-->
|
||||
<!-- </view>-->
|
||||
</view>
|
||||
<view class="acea-row row-middle">
|
||||
<view class="bnt" @click="modify(item, 0)" v-if="where.status == 0">
|
||||
一键改价
|
||||
</view>
|
||||
<view class="bnt" @click="modify(item, 1)">订单备注</view>
|
||||
<view class="bnt" @click="modify(item, 0)" v-if="where.status == -3 && item.refund_status === 1">
|
||||
立即退款
|
||||
</view>
|
||||
<view class="bnt cancel" v-if="item.pay_type === 'offline' && item.paid === 0" @click="offlinePay(item)">
|
||||
确认付款
|
||||
</view>
|
||||
<navigator class="bnt" v-if="where.status == 1" :url="'/pages/admin/delivery/index?id='+item.order_id">去发货
|
||||
</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<Loading :loaded="loaded" :loading="loading"></Loading>
|
||||
<PriceChange :change="change" :orderInfo="orderInfo" v-on:closechange="changeclose($event)" v-on:savePrice="savePrice"
|
||||
:status="status"></PriceChange>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getAdminOrderList,
|
||||
setAdminOrderPrice,
|
||||
setAdminOrderRemark,
|
||||
setOfflinePay,
|
||||
setOrderRefund
|
||||
} from "@/api/admin";
|
||||
import Loading from '@/components/Loading/index'
|
||||
import PriceChange from '@/components/PriceChange/index'
|
||||
import { isMoney } from '@/utils/validate.js'
|
||||
export default {
|
||||
name: "AdminOrderList",
|
||||
components: {
|
||||
Loading,
|
||||
PriceChange
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
current: "",
|
||||
change: false,
|
||||
types: 0,
|
||||
where: {
|
||||
page: 1,
|
||||
limit: 10,
|
||||
status: 0
|
||||
},
|
||||
list: [],
|
||||
loaded: false,
|
||||
loading: false,
|
||||
orderInfo: {},
|
||||
status: ""
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
"$route.params.types": function(newVal) {
|
||||
let that = this;
|
||||
if (newVal != undefined) {
|
||||
that.where.status = newVal;
|
||||
that.init();
|
||||
}
|
||||
},
|
||||
types: function() {
|
||||
this.getIndex();
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
this.where.status = option.types
|
||||
this.current = "";
|
||||
this.getIndex();
|
||||
},
|
||||
methods: {
|
||||
// 获取数据
|
||||
getIndex: function() {
|
||||
let that = this;
|
||||
if (that.loading || that.loaded) return;
|
||||
that.loading = true;
|
||||
getAdminOrderList(that.where).then(
|
||||
res => {
|
||||
that.loading = false;
|
||||
that.loaded = res.data.length < that.where.limit;
|
||||
that.list.push.apply(that.list, res.data);
|
||||
that.where.page = that.where.page + 1;
|
||||
},
|
||||
err => {
|
||||
that.$dialog.error(err.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
// 初始化
|
||||
init: function() {
|
||||
this.list = [];
|
||||
this.where.page = 1;
|
||||
this.loaded = false;
|
||||
this.loading = false;
|
||||
this.getIndex();
|
||||
this.current = "";
|
||||
},
|
||||
// 导航切换
|
||||
changeStatus(val) {
|
||||
if (this.where.status != val) {
|
||||
this.where.status = val;
|
||||
this.init();
|
||||
}
|
||||
},
|
||||
// 商品操作
|
||||
modify: function(item, status) {
|
||||
let temp = status.toString()
|
||||
this.change = true;
|
||||
this.orderInfo = item;
|
||||
this.status = temp;
|
||||
},
|
||||
changeclose: function(msg) {
|
||||
this.change = msg;
|
||||
},
|
||||
async savePrice(opt) {
|
||||
let that = this,
|
||||
data = {},
|
||||
price = opt.price,
|
||||
refund_price = opt.refund_price,
|
||||
refund_status = that.orderInfo.refund_status,
|
||||
remark = opt.remark;
|
||||
data.order_id = that.orderInfo.order_id;
|
||||
if (that.status == 0 && refund_status === 0) {
|
||||
if(!isMoney(price)){
|
||||
return that.$util.Tips({title: '请输入正确的金额'});
|
||||
}
|
||||
data.price = price;
|
||||
setAdminOrderPrice(data).then(
|
||||
function() {
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title:'改价成功',
|
||||
icon:'success'
|
||||
})
|
||||
that.init();
|
||||
},
|
||||
function() {
|
||||
that.change = false;
|
||||
that.$util.Tips({
|
||||
title:'改价失败',
|
||||
icon:'none'
|
||||
})
|
||||
}
|
||||
);
|
||||
} else if (that.status == 0 && refund_status === 1) {
|
||||
if(!isMoney(refund_price)){
|
||||
return that.$util.Tips({title: '请输入正确的金额'});
|
||||
}
|
||||
data.price = refund_price;
|
||||
data.type = opt.type;
|
||||
setOrderRefund(data).then(
|
||||
res => {
|
||||
that.change = false;
|
||||
that.$util.Tips({title: res.msg});
|
||||
that.init();
|
||||
},
|
||||
err => {
|
||||
console.log(err,'err')
|
||||
that.change = false;
|
||||
that.$util.Tips({title: err});
|
||||
}
|
||||
);
|
||||
} else {
|
||||
|
||||
if(!remark){
|
||||
return this.$util.Tips({
|
||||
title:'请输入备注'
|
||||
})
|
||||
}
|
||||
data.remark = remark;
|
||||
setAdminOrderRemark(data).then(
|
||||
res => {
|
||||
that.change = false;
|
||||
this.$util.Tips({
|
||||
title:res.msg,
|
||||
icon:'success'
|
||||
})
|
||||
that.init();
|
||||
},
|
||||
err => {
|
||||
that.change = false;
|
||||
that.$util.Tips({title: err});
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
toDetail(item){
|
||||
uni.navigateTo({
|
||||
url:`/pages/admin/orderDetail/index?id=${item.order_id}`
|
||||
})
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getIndex()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.pos-order-list .nav {
|
||||
width: 100%;
|
||||
height: 96upx;
|
||||
background-color: #fff;
|
||||
font-size: 30upx;
|
||||
color: #282828;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.pos-order-list .nav .item.on {
|
||||
color: #2291f8;
|
||||
}
|
||||
|
||||
.pos-order-list .list {
|
||||
margin-top: 120upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item {
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item~.item {
|
||||
margin-top: 24upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .order-num {
|
||||
height: 124upx;
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 30upx;
|
||||
font-weight: bold;
|
||||
color: #282828;
|
||||
padding: 0 30upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .order-num .time {
|
||||
font-size: 26upx;
|
||||
font-weight: normal;
|
||||
color: #999;
|
||||
margin-top: -40upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation {
|
||||
padding: 20upx 30upx;
|
||||
margin-top: 3upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .more {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .icon-gengduo {
|
||||
font-size: 50upx;
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .order .arrow {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 11upx solid transparent;
|
||||
border-right: 11upx solid transparent;
|
||||
border-top: 20upx solid #e5e5e5;
|
||||
position: absolute;
|
||||
left: 15upx;
|
||||
bottom: -18upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .order .arrow:before {
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 7upx solid transparent;
|
||||
border-right: 7upx solid transparent;
|
||||
border-top: 20upx solid #fff;
|
||||
position: absolute;
|
||||
left: -7upx;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .order {
|
||||
width: 200upx;
|
||||
background-color: #fff;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 10upx;
|
||||
position: absolute;
|
||||
top: -100upx;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .order .items {
|
||||
height: 77upx;
|
||||
line-height: 77upx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .order .items~.items {
|
||||
border-top: 1px solid #f5f5f5;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .bnt {
|
||||
font-size: 28upx;
|
||||
color: #5c5c5c;
|
||||
width: 170upx;
|
||||
height: 60upx;
|
||||
border-radius: 30upx;
|
||||
border: 1px solid #bbb;
|
||||
text-align: center;
|
||||
line-height: 60upx;
|
||||
}
|
||||
|
||||
.pos-order-list .list .item .operation .bnt~.bnt {
|
||||
margin-left: 14upx;
|
||||
}
|
||||
|
||||
.pos-order-goods {
|
||||
padding: 0 30upx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods {
|
||||
height: 185upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods~.goods {
|
||||
border-top: 1px dashed #e5e5e5;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt {
|
||||
width: 515upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .pictrue {
|
||||
width: 130upx;
|
||||
height: 130upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .text {
|
||||
width: 365upx;
|
||||
height: 130upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .text .info {
|
||||
font-size: 28upx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .picTxt .text .attr {
|
||||
font-size: 24upx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money {
|
||||
width: 164upx;
|
||||
text-align: right;
|
||||
font-size: 28upx;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money .x-money {
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money .num {
|
||||
color: #ff9600;
|
||||
margin: 5upx 0;
|
||||
}
|
||||
|
||||
.pos-order-goods .goods .money .y-money {
|
||||
color: #999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.public-total {
|
||||
font-size: 28upx;
|
||||
color: #282828;
|
||||
border-top: 1px solid #eee;
|
||||
height: 92upx;
|
||||
line-height: 92upx;
|
||||
text-align: right;
|
||||
padding: 0 30upx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.public-total .money {
|
||||
color: #ff4c3c;
|
||||
}
|
||||
</style>
|
||||
323
app/pages/admin/order_cancellation/index.vue
Normal file
323
app/pages/admin/order_cancellation/index.vue
Normal file
File diff suppressed because one or more lines are too long
BIN
app/pages/admin/static/scan.gif
Normal file
BIN
app/pages/admin/static/scan.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 191 KiB |
631
app/pages/admin/statistics/index.vue
Normal file
631
app/pages/admin/statistics/index.vue
Normal file
@@ -0,0 +1,631 @@
|
||||
<template>
|
||||
<div class="statistical-page" ref="container">
|
||||
<div class="navs">
|
||||
<div class="list">
|
||||
<div class="item" :class="time == 'today' ? 'on' : ''" @click="setTime('today')">
|
||||
今天
|
||||
</div>
|
||||
<div class="item" :class="time == 'yesterday' ? 'on' : ''" @click="setTime('yesterday')">
|
||||
昨天
|
||||
</div>
|
||||
<div class="item" :class="time == 'seven' ? 'on' : ''" @click="setTime('seven')">
|
||||
最近7天
|
||||
</div>
|
||||
<div class="item" :class="time == 'month' ? 'on' : ''" @click="setTime('month')">
|
||||
本月
|
||||
</div>
|
||||
<div class="item" :class="time == 'date' ? 'on' : ''" @click="dateTitle">
|
||||
<!-- <span class="iconfont icon-xiangxia"></span>
|
||||
<span v-for="(value, index) in renderValues" :key="index">
|
||||
{{ value }}</span
|
||||
> -->
|
||||
自定义
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wrapper">
|
||||
<div class="title">
|
||||
{{ title }}{{ this.where.type == 1 ? "营业额（元）" : "订单量（份）" }}
|
||||
</div>
|
||||
<div class="money">{{ time_price }}</div>
|
||||
<div class="increase acea-row row-between-wrapper">
|
||||
<div>
|
||||
{{ title }}增长率：<span :class="increase_time_status === 1 ? 'red' : 'green'">{{ increase_time_status === 1 ? "" : "-" }}{{ growth_rate }}%
|
||||
<span class="iconfont" :class="
|
||||
increase_time_status === 1
|
||||
? 'icon-xiangshang1'
|
||||
: 'icon-xiangxia2'
|
||||
"></span></span>
|
||||
</div>
|
||||
<div>
|
||||
{{ title }}增长：<span :class="increase_time_status === 1 ? 'red' : 'green'">{{ increase_time_status === 1 ? "" : "-" }}{{ increase_time }}
|
||||
<span class="iconfont" :class="
|
||||
increase_time_status === 1
|
||||
? 'icon-xiangshang1'
|
||||
: 'icon-xiangxia2'
|
||||
"></span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chart">
|
||||
<div class="chart-title">
|
||||
单位（{{where.type == 1?'元':'份'}}）
|
||||
</div>
|
||||
<canvas canvas-id="canvasLineA" id="canvasLineA" class="charts" disable-scroll=true @touchstart="touchLineA"
|
||||
@touchmove="moveLineA" @touchend="touchEndLineA"></canvas>
|
||||
</div>
|
||||
<div class="public-wrapper">
|
||||
<div class="title">
|
||||
<span class="iconfont icon-xiangxishuju"></span>详细数据
|
||||
</div>
|
||||
<div class="nav acea-row row-between-wrapper">
|
||||
<div class="data">日期</div>
|
||||
<div class="browse">订单量</div>
|
||||
<div class="turnover">成交额</div>
|
||||
</div>
|
||||
<div class="conter">
|
||||
<div class="item acea-row row-between-wrapper" v-for="(item, index) in list" :key="index">
|
||||
<div class="data">{{ item.time }}</div>
|
||||
<div class="browse">{{ item.count }}</div>
|
||||
<div class="turnover">{{ item.price }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<uni-calendar ref="calendar" :date="info.date" :insert="info.insert" :lunar="info.lunar" :startDate="info.startDate" :endDate="info.endDate" :range="info.range" @confirm="confirm" :showMonth="info.showMonth" />
|
||||
<div class="mask" @touchmove.prevent v-show="current === true" @click="close"></div>
|
||||
<!-- <Loading :loaded="loaded" :loading="loading"></Loading> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import uCharts from '@/components/ucharts/ucharts'
|
||||
import uniCalendar from '@/components/uni-calendar/uni-calendar.vue'
|
||||
var canvaLineA = null;
|
||||
// import Calendar from 'mpvue-calendar'
|
||||
// #ifdef MP-WEIXIN
|
||||
// import 'mpvue-calendar/src/style.css
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
// import 'mpvue-calendar/src/browser-style.css'
|
||||
// #endif
|
||||
|
||||
import {
|
||||
getStatisticsMonth,
|
||||
getStatisticsTime
|
||||
} from "@/api/admin";
|
||||
// import Loading from "@components/Loading";
|
||||
const year = new Date().getFullYear();
|
||||
const month = new Date().getMonth() + 1;
|
||||
const day = new Date().getDate();
|
||||
export default {
|
||||
name: "Statistics",
|
||||
components: {
|
||||
// Calendar,
|
||||
// uCharts
|
||||
uniCalendar
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
value: [
|
||||
[year, month, day - 1],
|
||||
[year, month, day]
|
||||
],
|
||||
isrange: true,
|
||||
weekSwitch: false,
|
||||
ismulti: false,
|
||||
monFirst: true,
|
||||
clean: false, //简洁模式
|
||||
lunar: false, //显示农历
|
||||
renderValues: [],
|
||||
monthRange: [],
|
||||
current: false,
|
||||
where: {
|
||||
start: "",
|
||||
stop: "",
|
||||
type: ""
|
||||
},
|
||||
types: "", //类型|order=订单数|price=营业额
|
||||
time: "", //时间|today=今天|yesterday=昨天|month=本月
|
||||
title: "", //时间|today=今天|yesterday=昨天|month=本月
|
||||
growth_rate: "", //增长率
|
||||
increase_time: "", //增长率
|
||||
increase_time_status: "", //增长率
|
||||
time_price: "", //增长率
|
||||
loaded: false,
|
||||
loading: false,
|
||||
filter: {
|
||||
page: 1,
|
||||
limit: 10,
|
||||
start: "",
|
||||
stop: ""
|
||||
},
|
||||
list: [],
|
||||
// charts
|
||||
cWidth: '',
|
||||
cHeight: '',
|
||||
pixelRatio: 1,
|
||||
textarea: '',
|
||||
"LineA": {
|
||||
"categories": ["2012", "2013", "2014", "2015", "2016", "2017"],
|
||||
"series": [{
|
||||
"data": [35, 8, 25, 37, 4, 20]
|
||||
}]
|
||||
},
|
||||
info: {
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
lunar: false,
|
||||
range: true,
|
||||
insert: false,
|
||||
selected: [],
|
||||
showMonth:false
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
"$route.params": function(newVal) {
|
||||
var that = this;
|
||||
if (newVal != undefined) {
|
||||
that.setType(newVal.type);
|
||||
that.setTime(newVal.time);
|
||||
that.getIndex();
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad: function(options) {
|
||||
this.setType(options.type);
|
||||
this.setTime(options.time);
|
||||
this.cWidth = uni.upx2px(690);
|
||||
this.cHeight = uni.upx2px(500);
|
||||
|
||||
// this.handelRenderValues();
|
||||
// this.getIndex();
|
||||
this.getInfo();
|
||||
// this.$scroll(this.$refs.container, () => {
|
||||
// !this.loading && this.getInfo();
|
||||
// });
|
||||
},
|
||||
computed: {
|
||||
monthRangeText() {
|
||||
return this.monthRange.length ? "固定" : "指定范围";
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getIndex: function() {
|
||||
let tempDay = []
|
||||
let tempNum = []
|
||||
var that = this;
|
||||
getStatisticsTime(that.where).then(
|
||||
res => {
|
||||
var _info = res.data.chart,
|
||||
day = [],
|
||||
num = [];
|
||||
_info.forEach(function(item) {
|
||||
day.push(item.time);
|
||||
num.push(item.num);
|
||||
});
|
||||
that.growth_rate = res.data.growth_rate;
|
||||
that.increase_time = res.data.increase_time;
|
||||
that.increase_time_status = res.data.increase_time_status;
|
||||
that.time_price = res.data.time;
|
||||
|
||||
res.data.chart.forEach((item, index) => {
|
||||
tempDay.push(item.time)
|
||||
tempNum.push(item.num)
|
||||
})
|
||||
that.LineA.categories = tempDay
|
||||
that.LineA.series[0].data = tempNum
|
||||
that.showLineA("canvasLineA", that.LineA);
|
||||
},
|
||||
error => {
|
||||
that.$dialog.error(error.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
setTime: function(time) {
|
||||
let self = this
|
||||
this.time = time;
|
||||
var year = new Date().getFullYear(),
|
||||
month = new Date().getMonth() + 1,
|
||||
day = new Date().getDate();
|
||||
this.list = [];
|
||||
this.filter.page = 1;
|
||||
this.loaded = false;
|
||||
this.loading = false;
|
||||
switch (time) {
|
||||
case "today":
|
||||
this.where.start =
|
||||
new Date(Date.parse(year + "/" + month + "/" + day)).getTime() /
|
||||
1000;
|
||||
this.where.stop =
|
||||
new Date(Date.parse(year + "/" + month + "/" + day)).getTime() /
|
||||
1000 +
|
||||
24 * 60 * 60 -
|
||||
1;
|
||||
this.title = "今日";
|
||||
this.getIndex();
|
||||
this.getInfo();
|
||||
break;
|
||||
case "yesterday":
|
||||
this.where.start =
|
||||
new Date(Date.parse(year + "/" + month + "/" + day)).getTime() /
|
||||
1000 -
|
||||
24 * 60 * 60;
|
||||
this.where.stop =
|
||||
new Date(Date.parse(year + "/" + month + "/" + day)).getTime() /
|
||||
1000 -
|
||||
1;
|
||||
this.title = "昨日";
|
||||
this.getIndex();
|
||||
this.getInfo();
|
||||
break;
|
||||
case "month":
|
||||
this.where.start =
|
||||
new Date(year, new Date().getMonth(), 1).getTime() / 1000;
|
||||
this.where.stop = new Date(year, month, 1).getTime() / 1000 - 1;
|
||||
this.title = "本月";
|
||||
this.getIndex();
|
||||
this.getInfo();
|
||||
break;
|
||||
case "seven":
|
||||
this.where.start =
|
||||
new Date(Date.parse(year + "/" + month + "/" + day)).getTime() /
|
||||
1000 +
|
||||
24 * 60 * 60 -
|
||||
7 * 3600 * 24;
|
||||
this.where.stop =
|
||||
new Date(Date.parse(year + "/" + month + "/" + day)).getTime() /
|
||||
1000 +
|
||||
24 * 60 * 60 -
|
||||
1;
|
||||
this.title = "七日";
|
||||
this.getIndex();
|
||||
this.getInfo();
|
||||
break;
|
||||
}
|
||||
},
|
||||
setType: function(type) {
|
||||
switch (type) {
|
||||
case "price":
|
||||
this.where.type = 1;
|
||||
break;
|
||||
case "order":
|
||||
this.where.type = 2;
|
||||
break;
|
||||
}
|
||||
},
|
||||
dateTitle: function() {
|
||||
this.$refs.calendar.open()
|
||||
this.time = 'date'
|
||||
// this.current = true;
|
||||
},
|
||||
close: function() {
|
||||
this.current = false;
|
||||
},
|
||||
getInfo: function() {
|
||||
var that = this;
|
||||
if (that.loading || that.loaded) return;
|
||||
that.loading = true;
|
||||
that.filter.start = that.where.start;
|
||||
that.filter.stop = that.where.stop;
|
||||
getStatisticsMonth(that.filter).then(
|
||||
res => {
|
||||
that.loading = false;
|
||||
that.loaded = res.data.length < that.filter.limit;
|
||||
that.list.push.apply(that.list, res.data);
|
||||
that.filter.page = that.filter.page + 1;
|
||||
},
|
||||
error => {
|
||||
that.$dialog.message(error.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
// 创建charts
|
||||
showLineA(canvasId, chartData) {
|
||||
let _self = this
|
||||
canvaLineA = new uCharts({
|
||||
$this: _self,
|
||||
canvasId: canvasId,
|
||||
type: 'line',
|
||||
fontSize: 11,
|
||||
padding: [15, 15, 0, 15],
|
||||
legend: {
|
||||
show: false,
|
||||
padding: 5,
|
||||
lineHeight: 11,
|
||||
margin: 5,
|
||||
},
|
||||
dataLabel: true,
|
||||
dataPointShape: true,
|
||||
dataPointShapeType: 'hollow',
|
||||
background: '#FFFFFF',
|
||||
pixelRatio: _self.pixelRatio,
|
||||
categories: chartData.categories,
|
||||
series: chartData.series,
|
||||
animation: true,
|
||||
enableScroll: true, //开启图表拖拽功能
|
||||
xAxis: {
|
||||
disableGrid: false,
|
||||
type: 'grid',
|
||||
gridType: 'dash',
|
||||
itemCount: 4,
|
||||
scrollShow: true,
|
||||
scrollAlign: 'left'
|
||||
},
|
||||
yAxis: {
|
||||
//disabled:true
|
||||
gridType: 'dash',
|
||||
splitNumber: 8,
|
||||
min: 0,
|
||||
max: 30,
|
||||
format: (val) => {
|
||||
return val.toFixed(0)
|
||||
} //如不写此方法，Y轴刻度默认保留两位小数
|
||||
},
|
||||
width: _self.cWidth * _self.pixelRatio,
|
||||
height: _self.cHeight * _self.pixelRatio,
|
||||
extra: {
|
||||
line: {
|
||||
type: 'straight'
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
// charts触摸事件
|
||||
touchLineA(e) {
|
||||
canvaLineA.scrollStart(e);
|
||||
},
|
||||
moveLineA(e) {
|
||||
canvaLineA.scroll(e);
|
||||
},
|
||||
touchEndLineA(e) {
|
||||
canvaLineA.scrollEnd(e);
|
||||
},
|
||||
// 日历确定
|
||||
confirm(e) {
|
||||
let self = this
|
||||
if(e.range.after && e.range.before){
|
||||
let star = new Date(e.range.after).getTime()/1000
|
||||
let stop = new Date(e.range.before).getTime()/1000
|
||||
self.where.start = star
|
||||
self.where.stop = stop
|
||||
self.list = [];
|
||||
self.filter.page = 1;
|
||||
self.loaded = false;
|
||||
self.loading = false;
|
||||
Promise.all([self.getIndex(),self.getInfo()]);
|
||||
}
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getInfo();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
/*交易额统计*/
|
||||
.statistical-page .navs {
|
||||
width: 100%;
|
||||
height: 96upx;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
line-height: 96upx;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.statistical-page .navs .list {
|
||||
overflow-y: hidden;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.statistical-page .navs .item {
|
||||
font-size: 32upx;
|
||||
color: #282828;
|
||||
margin-left: 60upx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.statistical-page .navs .item.on {
|
||||
color: #2291f8;
|
||||
}
|
||||
|
||||
.statistical-page .navs .item .iconfont {
|
||||
font-size: 25upx;
|
||||
margin-left: 13upx;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper {
|
||||
width: 740upx;
|
||||
background-color: #fff;
|
||||
border-radius: 10upx;
|
||||
margin: 119upx auto 0 auto;
|
||||
padding: 50upx 60upx;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .title {
|
||||
font-size: 30upx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .money {
|
||||
font-size: 72upx;
|
||||
color: #fba02a;
|
||||
text-align: center;
|
||||
margin-top: 10upx;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .increase {
|
||||
font-size: 28upx;
|
||||
color: #999;
|
||||
margin-top: 20upx;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .increase .red {
|
||||
color: #ff6969;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .increase .green {
|
||||
color: #1abb1d;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .increase .iconfont {
|
||||
font-size: 23upx;
|
||||
margin-left: 15upx;
|
||||
}
|
||||
|
||||
.statistical-page .chart {
|
||||
width: 690upx;
|
||||
background-color: #fff;
|
||||
border-radius: 10upx;
|
||||
margin: 23upx auto 0 auto;
|
||||
/* padding: 25upx 22upx 0 22upx; */
|
||||
}
|
||||
|
||||
.statistical-page .chart .chart-title{
|
||||
padding:20upx 20upx 10upx;
|
||||
font-size: 26upx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.statistical-page .chart canvas {
|
||||
width: 100%;
|
||||
height: 530rpx;
|
||||
}
|
||||
|
||||
.statistical-page .chart .company {
|
||||
font-size: 26upx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.yd-confirm {
|
||||
background-color: #fff;
|
||||
font-size: unset;
|
||||
width: 540upx;
|
||||
height: 250upx;
|
||||
border-radius: 40upx;
|
||||
}
|
||||
|
||||
.yd-confirm-hd {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.yd-confirm-title {
|
||||
color: #030303;
|
||||
font-weight: bold;
|
||||
font-size: 36upx;
|
||||
}
|
||||
|
||||
.yd-confirm-bd {
|
||||
text-align: center;
|
||||
font-size: 28upx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.yd-confirm-ft {
|
||||
line-height: 90upx;
|
||||
margin-top: 14px;
|
||||
border-top: 1upx solid #eee;
|
||||
}
|
||||
|
||||
.yd-confirm-ft>a {
|
||||
color: #e93323;
|
||||
}
|
||||
|
||||
.yd-confirm-ft>a.primary {
|
||||
border-left: 1upx solid #eee;
|
||||
color: #e93323;
|
||||
}
|
||||
|
||||
.echarts {
|
||||
width: 100%;
|
||||
height: 550upx;
|
||||
}
|
||||
|
||||
.calendar-wrapper {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 777;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
|
||||
}
|
||||
|
||||
.calendar-wrapper.on {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .increase {
|
||||
font-size: 26upx;
|
||||
}
|
||||
|
||||
.statistical-page .wrapper .increase .iconfont {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.public-wrapper .title {
|
||||
font-size: 30upx;
|
||||
color: #282828;
|
||||
padding: 0 30upx;
|
||||
margin-bottom: 20upx;
|
||||
}
|
||||
|
||||
.public-wrapper .title .iconfont {
|
||||
color: #2291f8;
|
||||
font-size: 40upx;
|
||||
margin-right: 13upx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.public-wrapper {
|
||||
margin: 18upx auto 0 auto;
|
||||
width: 690upx;
|
||||
background-color: #fff;
|
||||
border-radius: 10upx;
|
||||
padding-top: 25upx;
|
||||
}
|
||||
|
||||
.public-wrapper .nav {
|
||||
padding: 0 30upx;
|
||||
height: 70upx;
|
||||
line-height: 70upx;
|
||||
font-size: 24upx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.public-wrapper .data {
|
||||
width: 210upx;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.public-wrapper .browse {
|
||||
width: 192upx;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.public-wrapper .turnover {
|
||||
width: 227upx;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.public-wrapper .conter {
|
||||
padding: 0 30upx;
|
||||
}
|
||||
|
||||
.public-wrapper .conter .item {
|
||||
border-bottom: 1px solid #f7f7f7;
|
||||
height: 70upx;
|
||||
font-size: 24upx;
|
||||
}
|
||||
|
||||
.public-wrapper .conter .item .turnover {
|
||||
color: #d84242;
|
||||
}
|
||||
</style>
|
||||
80
app/pages/auth/index.vue
Normal file
80
app/pages/auth/index.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<view class="lottie-bg">
|
||||
<view id="lottie">
|
||||
<image src="/static/img/live-logo.gif" rel="preload" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import wechat from "@/libs/wechat";
|
||||
import {
|
||||
getUserInfo
|
||||
} from "@/api/user";
|
||||
export default {
|
||||
name: "Auth",
|
||||
mounted() {
|
||||
|
||||
},
|
||||
onLoad(option) {
|
||||
let that = this
|
||||
const {
|
||||
code,
|
||||
state
|
||||
} = option;
|
||||
wechat.auth(code, state)
|
||||
.then(() => {
|
||||
getUserInfo().then(res => {
|
||||
console.log(res);
|
||||
console.log(option.back_url);
|
||||
console.log(decodeURIComponent(
|
||||
decodeURIComponent(option.back_url)
|
||||
));
|
||||
that.$store.commit("SETUID", res.data.uid);
|
||||
location.href = decodeURIComponent(
|
||||
decodeURIComponent(option.back_url)
|
||||
);
|
||||
}).catch(res => {
|
||||
console.log('getUserInfo错误='+res);
|
||||
});
|
||||
})
|
||||
.catch((err) => {
|
||||
// location.replace("/");
|
||||
console.log('auth错误='+err);
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.lottie-bg {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 999;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#lottie {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
transform: translate3d(0, 0, 0);
|
||||
margin: auto;
|
||||
|
||||
image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
144
app/pages/columnGoods/HotNewGoods/index.vue
Normal file
144
app/pages/columnGoods/HotNewGoods/index.vue
Normal file
@@ -0,0 +1,144 @@
|
||||
<template>
|
||||
<div class="quality-recommend">
|
||||
<div class="slider-banner swiper">
|
||||
<view class="swiper">
|
||||
<swiper indicator-dots="true" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
|
||||
indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
|
||||
<block v-for="(item,index) in imgUrls" :key="index">
|
||||
<swiper-item>
|
||||
<image :src="item.img" class="slide-image"></image>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
</div>
|
||||
<div class="title acea-row row-center-wrapper">
|
||||
<div class="line"></div>
|
||||
<div class="name">
|
||||
<span class="iconfont" :class="icon"></span>{{ name }}
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<view class="wrapper">
|
||||
<GoodList :bastList="goodsList" :is-sort="false"></GoodList>
|
||||
<view class="txt-bar" v-if="goodsList.length>0 && !isScroll">我是有底线的~</view>
|
||||
<emptyPage v-if="goodsList.length==0 && !isScroll" title="暂无数据~"></emptyPage>
|
||||
</view>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import emptyPage from '@/components/emptyPage.vue'
|
||||
import GoodList from "@/components/goodList";
|
||||
import { getGroomList } from "@/api/store";
|
||||
export default {
|
||||
name: "HotNewGoods",
|
||||
components: {
|
||||
GoodList,
|
||||
emptyPage,
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
imgUrls: [],
|
||||
goodsList: [],
|
||||
name: "",
|
||||
icon: "",
|
||||
type:0,
|
||||
autoplay:true,
|
||||
circular:true,
|
||||
interval: 3000,
|
||||
duration: 500,
|
||||
page:1,
|
||||
limit:8,
|
||||
isScroll:true
|
||||
};
|
||||
},
|
||||
onLoad: function(option) {
|
||||
this.type = option.type
|
||||
this.titleInfo();
|
||||
this.getIndexGroomList();
|
||||
},
|
||||
methods: {
|
||||
titleInfo: function() {
|
||||
if (this.type === "1") {
|
||||
this.name = "精品推荐";
|
||||
this.icon = "icon-jingpintuijian";
|
||||
// document.title = "精品推荐";
|
||||
uni.setNavigationBarTitle({
|
||||
title:"精品推荐"
|
||||
})
|
||||
} else if (this.type === "2") {
|
||||
this.name = "热门榜单";
|
||||
this.icon = "icon-remen";
|
||||
uni.setNavigationBarTitle({
|
||||
title:"热门榜单"
|
||||
})
|
||||
} else if (this.type === "3") {
|
||||
this.name = "首发新品";
|
||||
this.icon = "icon-xinpin";
|
||||
uni.setNavigationBarTitle({
|
||||
title:"首发新品"
|
||||
})
|
||||
}else if (this.type === "4") {
|
||||
this.name = "促销单品";
|
||||
this.icon = "icon-xinpin";
|
||||
uni.setNavigationBarTitle({
|
||||
title:"促销单品"
|
||||
})
|
||||
}
|
||||
},
|
||||
getIndexGroomList: function() {
|
||||
if(!this.isScroll) return
|
||||
let that = this;
|
||||
let type = this.type;
|
||||
getGroomList(type,{
|
||||
page:this.page,
|
||||
limit:this.limit
|
||||
}).then(res => {
|
||||
that.imgUrls = res.data.banner;
|
||||
that.goodsList = that.goodsList.concat(res.data.list);
|
||||
that.isScroll = res.data.list.length>=that.limit
|
||||
that.page++
|
||||
})
|
||||
.catch(function(res) {
|
||||
that.$util.Tips({ title: res });
|
||||
});
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getIndexGroomList()
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
/deep/ .empty-box{
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.swiper,swiper,swiper-item,.slide-image{
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
}
|
||||
.quality-recommend {
|
||||
.wrapper{
|
||||
background: #fff;
|
||||
}
|
||||
.title {
|
||||
height: 120rpx;
|
||||
font-size:32rpx;
|
||||
color: #282828;
|
||||
background-color: #f5f5f5;
|
||||
.line{
|
||||
width: 230rpx;
|
||||
height: 2rpx;
|
||||
background-color: #e9e9e9;
|
||||
}
|
||||
}
|
||||
}
|
||||
.txt-bar{
|
||||
padding: 20rpx 0;
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
</style>
|
||||
1021
app/pages/customer_list/chat.vue
Normal file
1021
app/pages/customer_list/chat.vue
Normal file
File diff suppressed because it is too large
Load Diff
80
app/pages/customer_list/index.vue
Normal file
80
app/pages/customer_list/index.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<div class="CustomerList">
|
||||
<div
|
||||
class="item acea-row row-between-wrapper"
|
||||
v-for="item in list"
|
||||
:key="item.id"
|
||||
@click="goPage(item)"
|
||||
>
|
||||
<div class="pictrue"><img :src="item.avatar" /></div>
|
||||
<div class="text line1">{{ item.nickname }}</div>
|
||||
</div>
|
||||
<home></home>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { serviceList } from "@/api/user";
|
||||
import home from '@/components/home';
|
||||
|
||||
export default {
|
||||
name: "CustomerList",
|
||||
components:{
|
||||
home
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
productId: 0,
|
||||
orderId: ""
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
serviceList().then(res => {
|
||||
this.list = res.data;
|
||||
});
|
||||
},
|
||||
goPage(item){
|
||||
uni.navigateTo({
|
||||
url:'/pages/customer_list/chat?uid='+item.uid+'&productId='+ this.productId+'&orderId='+this.orderId
|
||||
})
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
this.getList();
|
||||
if (option.productId)
|
||||
this.productId = option.productId;
|
||||
if (option.orderId) {
|
||||
this.orderId = option.orderId
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.CustomerList {
|
||||
margin-top:13rpx;
|
||||
}
|
||||
.CustomerList .item {
|
||||
height: 138rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 0 24rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
.CustomerList .item .pictrue {
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 50%;
|
||||
border: 3rpx solid #fff;
|
||||
box-shadow: 0 0 1rpx 5rpx #f3f3f3;
|
||||
}
|
||||
.CustomerList .item .pictrue img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.CustomerList .item .text {
|
||||
width: 582rpx;
|
||||
font-size: 32rpx;
|
||||
color: #000;
|
||||
}
|
||||
</style>
|
||||
94
app/pages/first_new_product/index.vue
Normal file
94
app/pages/first_new_product/index.vue
Normal file
@@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='quality-recommend'>
|
||||
<swipers :imgUrls="imgUrls"></swipers>
|
||||
<view class='title acea-row row-center-wrapper'>
|
||||
<view class='line'></view>
|
||||
<view class='name'><text class='iconfont' :class="icon"></text>{{name}}</view>
|
||||
<view class='line'></view>
|
||||
</view>
|
||||
<goodList :bastList="bastList" :status="status"></goodList>
|
||||
</view>
|
||||
<home></home>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import goodList from '@/components/goodList';
|
||||
import home from '@/components/home';
|
||||
import swipers from '@/components/swipers';
|
||||
import { getGroomList } from '@/api/store.js';
|
||||
export default {
|
||||
components: {
|
||||
goodList,
|
||||
swipers,
|
||||
home
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgUrls: [],
|
||||
bastList:[],
|
||||
name:'',
|
||||
icon:'',
|
||||
type:0,
|
||||
status:0
|
||||
};
|
||||
},
|
||||
onLoad: function (options) {
|
||||
this.type = options.type;
|
||||
},
|
||||
onShow: function () {
|
||||
let type = this.type;
|
||||
if (type == 1){
|
||||
uni.setNavigationBarTitle({
|
||||
title:"精品推荐"
|
||||
});
|
||||
this.name = '精品推荐';
|
||||
this.icon = 'icon-jingpintuijian';
|
||||
} else if (type == 2) {
|
||||
uni.setNavigationBarTitle({
|
||||
title:"热门榜单"
|
||||
});
|
||||
this.name = '热门榜单';
|
||||
this.icon = 'icon-remen';
|
||||
this.status = 1;
|
||||
} else if (type == 3) {
|
||||
uni.setNavigationBarTitle({
|
||||
title:"首发新品"
|
||||
});
|
||||
this.name = '首发新品';
|
||||
this.icon = 'icon-xinpin';
|
||||
} else if (type == 4) {
|
||||
uni.setNavigationBarTitle({
|
||||
title:"促销单品"
|
||||
});
|
||||
this.name = '促销单品';
|
||||
this.icon = 'icon-cuxiaoguanli';
|
||||
}else{
|
||||
uni.setNavigationBarTitle({
|
||||
title:"首发新品"
|
||||
});
|
||||
this.name = '首发新品';
|
||||
this.icon = 'icon-xinpin';
|
||||
}
|
||||
this.getIndexGroomList();
|
||||
},
|
||||
methods: {
|
||||
getIndexGroomList: function () {
|
||||
let that = this;
|
||||
getGroomList(that.type).then(res=>{
|
||||
that.imgUrls = res.data.banner;
|
||||
that.$set(that,'bastList',res.data.list)
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page{background-color:#fff;}
|
||||
.quality-recommend .title{height:120rpx;font-size:32rpx;color:#282828;background-color:#f5f5f5;}
|
||||
.quality-recommend .title .line{width:230rpx;height:2rpx;background-color:#e9e9e9;}
|
||||
.quality-recommend .title .name{margin:0 20rpx;}
|
||||
.quality-recommend .title .name .iconfont{margin-right:13rpx;font-size:38rpx;vertical-align:-4rpx;color:#343434;}
|
||||
</style>
|
||||
251
app/pages/goods_cate/goods_cate.vue
Normal file
251
app/pages/goods_cate/goods_cate.vue
Normal file
@@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<view class='productSort'>
|
||||
<view class='header acea-row row-center-wrapper'>
|
||||
<view class='acea-row row-between-wrapper input'>
|
||||
<text class='iconfont icon-sousuo'></text>
|
||||
<input type='text' placeholder='点击搜索商品信息' @confirm="searchSubmitValue" confirm-type='search' name="search"
|
||||
placeholder-class='placeholder'></input>
|
||||
</view>
|
||||
</view>
|
||||
<view class='aside'>
|
||||
<view class='item acea-row row-center-wrapper' :class='index==navActive?"on":""' v-for="(item,index) in productList"
|
||||
:key="index" @click='tap(index,"b"+index)'><text>{{item.name}}</text></view>
|
||||
</view>
|
||||
<view class='conter'>
|
||||
<scroll-view scroll-y="true" :scroll-into-view="toView" :style='"height:"+height+"rpx;"' @scroll="scroll"
|
||||
scroll-with-animation='true'>
|
||||
<block v-for="(item,index) in productList" :key="index">
|
||||
|
||||
<view class='listw' :id="'b'+index">
|
||||
<view class='title acea-row row-center-wrapper'>
|
||||
<view class='line'></view>
|
||||
<view class='name'>{{item.name}}</view>
|
||||
<view class='line'></view>
|
||||
</view>
|
||||
<view class='list acea-row'>
|
||||
<block v-for="(itemn,indexn) in item.child" :key="indexn">
|
||||
<navigator hover-class='none' :url='"/pages/goods_list/index?cid="+itemn.id+"&title="+itemn.name' class='item acea-row row-column row-middle'>
|
||||
<view class='picture'>
|
||||
<image :src='itemn.extra'></image>
|
||||
</view>
|
||||
<view class='name line1'>{{itemn.name}}</view>
|
||||
</navigator>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view :style='"height:"+(height-300)+"rpx;"' v-if="number<15"></view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getCategoryList
|
||||
} from '@/api/store.js';
|
||||
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
navlist: [],
|
||||
productList: [],
|
||||
navActive: 0,
|
||||
number: "",
|
||||
height: 0,
|
||||
hightArr: [],
|
||||
toView: ""
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.getAllCategory();
|
||||
},
|
||||
onShow(){},
|
||||
methods: {
|
||||
infoScroll: function() {
|
||||
let that = this;
|
||||
let len = that.productList.length;
|
||||
let child = that.productList[len - 1]&&that.productList[len - 1].child?that.productList[len - 1].child:[];
|
||||
this.number = child?child.length:0;
|
||||
//设置商品列表高度
|
||||
uni.getSystemInfo({
|
||||
success: function(res) {
|
||||
that.height = (res.windowHeight) * (750 / res.windowWidth) - 98;
|
||||
},
|
||||
});
|
||||
let height = 0;
|
||||
let hightArr = [];
|
||||
for (let i = 0; i < len; i++) {
|
||||
//获取元素所在位置
|
||||
let query = uni.createSelectorQuery().in(this);
|
||||
let idView = "#b" + i;
|
||||
query.select(idView).boundingClientRect();
|
||||
query.exec(function(res) {
|
||||
let top = res[0].top;
|
||||
hightArr.push(top);
|
||||
that.hightArr = hightArr
|
||||
});
|
||||
};
|
||||
},
|
||||
tap: function(index, id) {
|
||||
this.toView = id;
|
||||
this.navActive = index;
|
||||
},
|
||||
getAllCategory: function() {
|
||||
let that = this;
|
||||
getCategoryList().then(res => {
|
||||
that.productList = res.data;
|
||||
setTimeout(function(){
|
||||
that.infoScroll();
|
||||
},500)
|
||||
})
|
||||
},
|
||||
scroll: function(e) {
|
||||
let scrollTop = e.detail.scrollTop;
|
||||
let scrollArr = this.hightArr;
|
||||
for (let i = 0; i < scrollArr.length; i++) {
|
||||
if (scrollTop >= 0 && scrollTop < scrollArr[1] - scrollArr[0]) {
|
||||
this.navActive = 0
|
||||
} else if (scrollTop >= scrollArr[i] - scrollArr[0] && scrollTop < scrollArr[i + 1] - scrollArr[0]) {
|
||||
this.navActive = i
|
||||
} else if (scrollTop >= scrollArr[scrollArr.length - 1] - scrollArr[0]) {
|
||||
this.navActive = scrollArr.length - 1
|
||||
}
|
||||
}
|
||||
},
|
||||
searchSubmitValue: function(e) {
|
||||
if (this.$util.trim(e.detail.value).length > 0)
|
||||
uni.navigateTo({
|
||||
url: '/pages/goods_list/index?searchValue=' + e.detail.value
|
||||
})
|
||||
else
|
||||
return this.$util.Tips({
|
||||
title: '请填写要搜索的产品信息'
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.productSort .header {
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
border-bottom: 1rpx solid #f5f5f5;
|
||||
}
|
||||
|
||||
.productSort .header .input {
|
||||
width: 700rpx;
|
||||
height: 60rpx;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 50rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 25rpx;
|
||||
}
|
||||
|
||||
.productSort .header .input .iconfont {
|
||||
font-size: 35rpx;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.productSort .header .input .placeholder {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.productSort .header .input input {
|
||||
font-size: 26rpx;
|
||||
height: 100%;
|
||||
width: 597rpx;
|
||||
}
|
||||
|
||||
.productSort .aside {
|
||||
position: fixed;
|
||||
width: 180rpx;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
top:0;
|
||||
background-color: #f7f7f7;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
margin-top: 96rpx;
|
||||
}
|
||||
|
||||
.productSort .aside .item {
|
||||
height: 100rpx;
|
||||
width: 100%;
|
||||
font-size: 26rpx;
|
||||
color: #424242;
|
||||
}
|
||||
|
||||
.productSort .aside .item.on {
|
||||
background-color: #fff;
|
||||
border-left: 4rpx solid #fc4141;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #fc4141;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.productSort .conter {
|
||||
margin: 96rpx 0 0 180rpx;
|
||||
padding: 0 14rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.productSort .conter .listw {
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.productSort .conter .listw .title {
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.productSort .conter .listw .title .line {
|
||||
width: 100rpx;
|
||||
height: 2rpx;
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.productSort .conter .listw .title .name {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin: 0 30rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.productSort .conter .list {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.productSort .conter .list .item {
|
||||
width: 177rpx;
|
||||
margin-top: 26rpx;
|
||||
}
|
||||
|
||||
.productSort .conter .list .item .picture {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.productSort .conter .list .item .picture image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.productSort .conter .list .item .name {
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
width: 120rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
1717
app/pages/goods_details/index.vue
Normal file
1717
app/pages/goods_details/index.vue
Normal file
File diff suppressed because one or more lines are too long
1730
app/pages/goods_details/index001.vue
Normal file
1730
app/pages/goods_details/index001.vue
Normal file
File diff suppressed because one or more lines are too long
81
app/pages/goods_details/index003.vue
Normal file
81
app/pages/goods_details/index003.vue
Normal file
@@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<view>
|
||||
<view v-if="canvasStatus">
|
||||
<view class="mask"></view>
|
||||
<image :src='imagePath' class="canvas"></image>
|
||||
</view>
|
||||
<view v-else>
|
||||
<canvas style="width:750rpx;height:1190rpx;position: fixed;z-index: -5;" canvas-id="firstCanvas"></canvas>
|
||||
<canvas style="position:fixed;z-index: -5;opacity: 0;" canvas-id="qrcode" :style="{width: `${qrcodeSize}px`, height: `${qrcodeSize}px`}"/>
|
||||
</view>
|
||||
<div @click='clickgg'>点击</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uQRCode from '@/js_sdk/Sansnn-uQRCode/uqrcode.js'
|
||||
import {
|
||||
HTTP_REQUEST_URL
|
||||
} from '@/config/app.js';
|
||||
export default {
|
||||
data(){
|
||||
return{
|
||||
imagePath:'',
|
||||
canvasStatus:false,
|
||||
|
||||
qrcodeText: HTTP_REQUEST_URL,
|
||||
qrcodeSize: 129,
|
||||
PromotionCode:''
|
||||
}
|
||||
},
|
||||
onReady: function (e) {
|
||||
this.make();
|
||||
},
|
||||
methods: {
|
||||
// 生成二维码；
|
||||
make() {
|
||||
let that = this;
|
||||
uQRCode.make({
|
||||
canvasId: 'qrcode',
|
||||
text: this.qrcodeText,
|
||||
size: this.qrcodeSize,
|
||||
margin: 10,
|
||||
success: res => {
|
||||
that.PromotionCode = res;
|
||||
},
|
||||
complete: () => {
|
||||
},
|
||||
fail:res=>{
|
||||
that.$util.Tips({
|
||||
title: '海报二维码生成失败！'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
clickgg(){
|
||||
let that = this;
|
||||
// ../../static/images/barg002.png
|
||||
let arrImages = ['../../static/images/posterbackgd.png','../../static/images/explosion.png',that.PromotionCode];
|
||||
let storeName = '1十大歌手大好时光的电视广上世纪法国设计风格加工费设计规范技术规范设计规范手机话费csdsdsdsd9';
|
||||
let price = '20';
|
||||
that.$util.PosterCanvas(arrImages, storeName, price, function(tempFilePath) {
|
||||
console.log('klklkl');
|
||||
that.imagePath = tempFilePath;
|
||||
that.canvasStatus = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.canvas{
|
||||
position: fixed;
|
||||
width: 512rpx;
|
||||
height: 864rpx;
|
||||
top:50%;
|
||||
left:50%;
|
||||
margin-left: -256rpx;
|
||||
margin-top: -432rpx;
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
394
app/pages/goods_list/index.vue
Normal file
394
app/pages/goods_list/index.vue
Normal file
@@ -0,0 +1,394 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='productList'>
|
||||
<view class='search bg-color acea-row row-between-wrapper'>
|
||||
<view class='input acea-row row-between-wrapper'><text class='iconfont icon-sousuo'></text>
|
||||
<input placeholder='搜索商品名称' placeholder-class='placeholder' confirm-type='search' name="search" :value='where.keyword'
|
||||
@confirm="searchSubmit"></input>
|
||||
</view>
|
||||
<view class='iconfont' :class='is_switch==true?"icon-pailie":"icon-tupianpailie"' @click='Changswitch'></view>
|
||||
</view>
|
||||
<view class='nav acea-row row-middle'>
|
||||
<view class='item' :class='title ? "font-color":""' @click='set_where(1)'>{{title ? title:'默认'}}</view>
|
||||
<view class='item' @click='set_where(2)'>
|
||||
价格
|
||||
<image v-if="price==1" src='../../static/images/up.png'></image>
|
||||
<image v-else-if="price==2" src='../../static/images/down.png'></image>
|
||||
<image v-else src='../../static/images/horn.png'></image>
|
||||
</view>
|
||||
<view class='item' @click='set_where(3)'>
|
||||
销量
|
||||
<image v-if="stock==1" src='../../static/images/up.png'></image>
|
||||
<image v-else-if="stock==2" src='../../static/images/down.png'></image>
|
||||
<image v-else src='../../static/images/horn.png'></image>
|
||||
</view>
|
||||
<!-- down -->
|
||||
<view class='item' :class='nows ? "font-color":""' @click='set_where(4)'>新品</view>
|
||||
</view>
|
||||
<view class='list acea-row row-between-wrapper' :class='is_switch==true?"":"on"'>
|
||||
<view class='item' :class='is_switch==true?"":"on"' hover-class='none' v-for="(item,index) in productList" :key="index" @click="godDetail(item)">
|
||||
<view class='pictrue' :class='is_switch==true?"":"on"'>
|
||||
<image :src='item.image' :class='is_switch==true?"":"on"'></image>
|
||||
<span class="pictrue_log_class" :class="is_switch === true ? 'pictrue_log_big' : 'pictrue_log'" v-if="item.activity && item.activity.type === '1'">秒杀</span>
|
||||
<span class="pictrue_log_class" :class="is_switch === true ? 'pictrue_log_big' : 'pictrue_log'" v-if="item.activity && item.activity.type === '2'">砍价</span>
|
||||
<span class="pictrue_log_class" :class="is_switch === true ? 'pictrue_log_big' : 'pictrue_log'" v-if="item.activity && item.activity.type === '3'">拼团</span>
|
||||
</view>
|
||||
<view class='text' :class='is_switch==true?"":"on"'>
|
||||
<view class='name line1'>{{item.storeName}}</view>
|
||||
<view class='money font-color' :class='is_switch==true?"":"on"'>￥<text class='num'>{{item.price}}</text></view>
|
||||
<view class='vip acea-row row-between-wrapper' :class='is_switch==true?"":"on"'>
|
||||
<view class='vip-money' v-if="item.vip_price && item.vip_price > 0">￥{{item.vip_price}}
|
||||
<image src='../../static/images/vip.png'></image>
|
||||
</view>
|
||||
<view>已售{{item.sales}}{{item.unitName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='loadingicon acea-row row-center-wrapper' v-if='productList.length > 0'>
|
||||
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='noCommodity' v-if="productList.length==0 && where.page > 1">
|
||||
<view class='pictrue'>
|
||||
<image src='../../static/images/noShopper.png'></image>
|
||||
</view>
|
||||
<recommend :hostProduct="hostProduct"></recommend>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getProductslist,
|
||||
getProductHot
|
||||
} from '@/api/store.js';
|
||||
import recommend from '@/components/recommend';
|
||||
import {mapGetters} from "vuex";
|
||||
import { goShopDetail } from '@/libs/order.js'
|
||||
export default {
|
||||
computed: mapGetters(['uid']),
|
||||
components: {
|
||||
recommend
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
productList: [],
|
||||
is_switch: true,
|
||||
where: {
|
||||
keyword: '',
|
||||
priceOrder: '',
|
||||
salesOrder: '',
|
||||
news: 0,
|
||||
page: 1,
|
||||
limit: 20,
|
||||
cid: 0,
|
||||
},
|
||||
price: 0,
|
||||
stock: 0,
|
||||
nows: false,
|
||||
loadend: false,
|
||||
loading: false,
|
||||
loadTitle: '加载更多',
|
||||
title: '',
|
||||
hostProduct: [],
|
||||
hotPage:1,
|
||||
hotLimit:10,
|
||||
hotScroll:false
|
||||
};
|
||||
},
|
||||
onLoad: function(options) {
|
||||
this.$set(this.where, 'cid', options.cid || 0);
|
||||
this.title = options.title || '';
|
||||
this.$set(this.where, 'keyword', options.searchValue || '');
|
||||
this.get_product_list();
|
||||
this.get_host_product();
|
||||
},
|
||||
methods: {
|
||||
// 去详情页
|
||||
godDetail(item){
|
||||
goShopDetail(item,this.uid).then(res=>{
|
||||
uni.navigateTo({
|
||||
url:`/pages/goods_details/index?id=${item.id}`
|
||||
})
|
||||
})
|
||||
},
|
||||
Changswitch: function() {
|
||||
let that = this;
|
||||
that.is_switch = !that.is_switch
|
||||
},
|
||||
searchSubmit: function(e) {
|
||||
let that = this;
|
||||
that.$set(that.where, 'keyword', e.detail.value);
|
||||
that.loadend = false;
|
||||
that.$set(that.where, 'page', 1)
|
||||
this.get_product_list(true);
|
||||
},
|
||||
/**
|
||||
* 获取我的推荐
|
||||
*/
|
||||
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)
|
||||
// that.$set(that, 'hostProduct', res.data)
|
||||
});
|
||||
},
|
||||
//点击事件处理
|
||||
set_where: function(e) {
|
||||
switch (e) {
|
||||
case 1:
|
||||
// #ifdef H5
|
||||
return history.back();
|
||||
// #endif
|
||||
// #ifndef H5
|
||||
return uni.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
// #endif
|
||||
break;
|
||||
case 2:
|
||||
if (this.price == 0) this.price = 1;
|
||||
else if (this.price == 1) this.price = 2;
|
||||
else if (this.price == 2) this.price = 0;
|
||||
this.stock = 0;
|
||||
break;
|
||||
case 3:
|
||||
if (this.stock == 0) this.stock = 1;
|
||||
else if (this.stock == 1) this.stock = 2;
|
||||
else if (this.stock == 2) this.stock = 0;
|
||||
this.price = 0
|
||||
break;
|
||||
case 4:
|
||||
this.nows = !this.nows;
|
||||
break;
|
||||
}
|
||||
this.loadend = false;
|
||||
this.$set(this.where, 'page', 1);
|
||||
this.get_product_list(true);
|
||||
},
|
||||
//设置where条件
|
||||
setWhere: function() {
|
||||
if (this.price == 0) this.where.priceOrder = '';
|
||||
else if (this.price == 1) this.where.priceOrder = 'desc';
|
||||
else if (this.price == 2) this.where.priceOrder = 'asc';
|
||||
if (this.stock == 0) this.where.salesOrder = '';
|
||||
else if (this.stock == 1) this.where.salesOrder = 'desc';
|
||||
else if (this.stock == 2) this.where.salesOrder = 'asc';
|
||||
this.where.news = this.nows ? 1 : 0;
|
||||
},
|
||||
//查找产品
|
||||
get_product_list: function(isPage) {
|
||||
let that = this;
|
||||
that.setWhere();
|
||||
if (that.loadend) return;
|
||||
if (that.loading) return;
|
||||
if (isPage === true) that.$set(that, 'productList', []);
|
||||
that.loading = true;
|
||||
that.loadTitle = '';
|
||||
getProductslist(that.where).then(res => {
|
||||
let list = res.data.list;
|
||||
let productList = that.$util.SplitArray(list, that.productList);
|
||||
let loadend = list.length < that.where.limit;
|
||||
that.loadend = loadend;
|
||||
that.loading = false;
|
||||
that.loadTitle = loadend ? '已全部加载' : '加载更多';
|
||||
that.$set(that, 'productList', productList);
|
||||
that.$set(that.where, 'page', that.where.page + 1);
|
||||
}).catch(err => {
|
||||
that.loading = false;
|
||||
that.loadTitle = '加载更多';
|
||||
});
|
||||
},
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
onReachBottom() {
|
||||
if(this.productList.length>0){
|
||||
this.get_product_list();
|
||||
}else{
|
||||
this.get_host_product();
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.productList .search {
|
||||
width: 100%;
|
||||
height: 86rpx;
|
||||
padding-left: 23rpx;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.productList .search .input {
|
||||
width: 640rpx;
|
||||
height: 60rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 50rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.productList .search .input input {
|
||||
width: 548rpx;
|
||||
height: 100%;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.productList .search .input .placeholder {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.productList .search .input .iconfont {
|
||||
font-size: 35rpx;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.productList .search .icon-pailie,
|
||||
.productList .search .icon-tupianpailie {
|
||||
color: #fff;
|
||||
width: 62rpx;
|
||||
font-size: 40rpx;
|
||||
height: 86rpx;
|
||||
line-height: 86rpx;
|
||||
}
|
||||
|
||||
.productList .nav {
|
||||
height: 86rpx;
|
||||
color: #454545;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 86rpx;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.productList .nav .item {
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.productList .nav .item.font-color {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.productList .nav .item image {
|
||||
width: 15rpx;
|
||||
height: 19rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.productList .list {
|
||||
padding: 0 20rpx;
|
||||
margin-top: 172rpx;
|
||||
}
|
||||
|
||||
.productList .list.on {
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #f6f6f6;
|
||||
}
|
||||
|
||||
.productList .list .item {
|
||||
width: 345rpx;
|
||||
margin-top: 20rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.productList .list .item.on {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
border-bottom: 1rpx solid #f6f6f6;
|
||||
padding: 30rpx 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.productList .list .item .pictrue {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 345rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .pictrue.on {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
|
||||
.productList .list .item .pictrue image.on {
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text {
|
||||
padding: 20rpx 17rpx 26rpx 17rpx;
|
||||
font-size: 30rpx;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.productList .list .item .text.on {
|
||||
width: 508rpx;
|
||||
padding: 0 0 0 22rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text .money {
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text .money.on {
|
||||
margin-top: 50rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text .money .num {
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text .vip {
|
||||
font-size: 22rpx;
|
||||
color: #aaa;
|
||||
margin-top: 7rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text .vip.on {
|
||||
margin-top: 12rpx;
|
||||
}
|
||||
|
||||
.productList .list .item .text .vip .vip-money {
|
||||
font-size: 24rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.productList .list .item .text .vip .vip-money image {
|
||||
width: 46rpx;
|
||||
height: 21rpx;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.noCommodity {
|
||||
background-color: #fff;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
</style>
|
||||
219
app/pages/goods_search/index.vue
Normal file
219
app/pages/goods_search/index.vue
Normal file
@@ -0,0 +1,219 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='searchGood'>
|
||||
<view class='search acea-row row-between-wrapper'>
|
||||
<view class='input acea-row row-between-wrapper'>
|
||||
<text class='iconfont icon-sousuo2'></text>
|
||||
<input type='text' :value='searchValue' :focus="focus" placeholder='点击搜索商品' placeholder-class='placeholder' @input="setValue"></input>
|
||||
</view>
|
||||
<view class='bnt' @tap='searchBut'>搜索</view>
|
||||
</view>
|
||||
<view class='title'>热门搜索</view>
|
||||
<view class='list acea-row'>
|
||||
<block v-for="(item,index) in hotSearchList" :key="index">
|
||||
<view class='item' @tap='setHotSearchValue(item.title)'>{{item.title}}</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class='line'></view>
|
||||
<goodList :bastList="bastList" v-if="bastList.length > 0"></goodList>
|
||||
<view class='loadingicon acea-row row-center-wrapper' v-if="bastList.length > 0">
|
||||
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
||||
</view>
|
||||
</view>
|
||||
<view class='noCommodity'>
|
||||
<view class='pictrue' v-if="bastList.length == 0">
|
||||
<image src='../../static/images/noSearch.png'></image>
|
||||
</view>
|
||||
<recommend :hostProduct='hostProduct' v-if="bastList.length == 0"></recommend>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getSearchKeyword,
|
||||
getProductslist,
|
||||
getProductHot
|
||||
} from '@/api/store.js';
|
||||
import goodList from '@/components/goodList';
|
||||
import recommend from '@/components/recommend';
|
||||
export default {
|
||||
components: {
|
||||
goodList,
|
||||
recommend
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
hostProduct: [],
|
||||
searchValue: '',
|
||||
focus: true,
|
||||
bastList: [],
|
||||
hotSearchList: [],
|
||||
first: 0,
|
||||
limit: 8,
|
||||
page: 1,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
loadTitle: '加载更多',
|
||||
hotPage:1,
|
||||
isScroll:true
|
||||
};
|
||||
},
|
||||
onShow: function() {
|
||||
this.getRoutineHotSearch();
|
||||
this.getHostProduct();
|
||||
},
|
||||
onReachBottom: function() {
|
||||
if(this.bastList.length>0){
|
||||
this.getProductList();
|
||||
}else{
|
||||
this.getHostProduct();
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
getRoutineHotSearch: function() {
|
||||
let that = this;
|
||||
getSearchKeyword().then(res => {
|
||||
that.$set(that, 'hotSearchList', res.data);
|
||||
});
|
||||
},
|
||||
getProductList: function() {
|
||||
let that = this;
|
||||
if (that.loadend) return;
|
||||
if (that.loading) return;
|
||||
that.loading = true;
|
||||
that.loadTitle = '';
|
||||
getProductslist({
|
||||
keyword: that.searchValue,
|
||||
page: that.page,
|
||||
limit: that.limit
|
||||
}).then(res => {
|
||||
let list = res.data.list,
|
||||
loadend = list.length < that.limit;
|
||||
that.bastList = that.$util.SplitArray(list, that.bastList);
|
||||
that.$set(that,'bastList',that.bastList);
|
||||
that.loading = false;
|
||||
that.loadend = loadend;
|
||||
that.loadTitle = loadend ? "😕人家是有底线的~~" : "加载更多";
|
||||
that.page = that.page + 1;
|
||||
}).catch(err => {
|
||||
that.loading = false,
|
||||
that.loadTitle = '加载更多'
|
||||
});
|
||||
},
|
||||
getHostProduct: function() {
|
||||
let that = this;
|
||||
if(!this.isScroll) return
|
||||
getProductHot(that.hotPage,that.limit).then(res => {
|
||||
that.isScroll = res.data.list.length>=that.limit
|
||||
that.hostProduct = that.hostProduct.concat(res.data.list)
|
||||
that.hotPage += 1;
|
||||
});
|
||||
},
|
||||
setHotSearchValue: function(event) {
|
||||
this.$set(this, 'searchValue', event);
|
||||
this.page = 1;
|
||||
this.loadend = false;
|
||||
this.$set(this, 'bastList', []);
|
||||
this.getProductList();
|
||||
},
|
||||
setValue: function(event) {
|
||||
this.$set(this, 'searchValue', event.detail.value);
|
||||
},
|
||||
searchBut: function() {
|
||||
let that = this;
|
||||
that.focus = false;
|
||||
if (that.searchValue.length > 0) {
|
||||
that.page = 1;
|
||||
that.loadend = false;
|
||||
that.$set(that, 'bastList', []);
|
||||
uni.showLoading({
|
||||
title: '正在搜索中'
|
||||
});
|
||||
that.getProductList();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
return this.$util.Tips({
|
||||
title: '请输入要搜索的商品',
|
||||
icon: 'none',
|
||||
duration: 1000,
|
||||
mask: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.searchGood .search {
|
||||
padding-left: 30rpx;
|
||||
}
|
||||
|
||||
.searchGood .search {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.searchGood .search .input {
|
||||
width: 598rpx;
|
||||
background-color: #f7f7f7;
|
||||
border-radius: 33rpx;
|
||||
padding: 0 35rpx;
|
||||
box-sizing: border-box;
|
||||
height: 66rpx;
|
||||
}
|
||||
|
||||
.searchGood .search .input input {
|
||||
width: 472rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.searchGood .search .input .placeholder {
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.searchGood .search .input .iconfont {
|
||||
color: #000;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
|
||||
.searchGood .search .bnt {
|
||||
width: 120rpx;
|
||||
text-align: center;
|
||||
height: 66rpx;
|
||||
line-height: 66rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.searchGood .title {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
margin: 50rpx 30rpx 25rpx 30rpx;
|
||||
}
|
||||
|
||||
.searchGood .list {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
|
||||
.searchGood .list .item {
|
||||
font-size: 26rpx;
|
||||
color: #454545;
|
||||
padding: 0 21rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 3rpx;
|
||||
line-height: 60rpx;
|
||||
border: 1rpx solid #aaa;
|
||||
margin: 0 0 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.searchGood .line {
|
||||
border-bottom: 1rpx solid #eee;
|
||||
margin: 20rpx 30rpx 0 30rpx;
|
||||
}
|
||||
</style>
|
||||
1787
app/pages/index/index.vue
Normal file
1787
app/pages/index/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
1917
app/pages/index/index001.vue
Normal file
1917
app/pages/index/index001.vue
Normal file
File diff suppressed because it is too large
Load Diff
280
app/pages/news_details/index.vue
Normal file
280
app/pages/news_details/index.vue
Normal file
@@ -0,0 +1,280 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='newsDetail'>
|
||||
<view class='title'>{{articleInfo.title}}</view>
|
||||
<view class='list acea-row row-middle'>
|
||||
<view class='label'>{{articleInfo.categoryName}}</view>
|
||||
<view class='item'></text>{{articleInfo.createTime}}</view>
|
||||
<!-- <view class='item'><text class='iconfont icon-liulan'></text>{{articleInfo.visit}}</view> -->
|
||||
</view>
|
||||
<view class='conters'>
|
||||
<jyf-parser :html="content" ref="article" :tag-style="tagStyle"></jyf-parser>
|
||||
</view>
|
||||
<view class="picTxt acea-row row-between-wrapper" v-if="store_info.id">
|
||||
<view class="pictrue">
|
||||
<image :src="store_info.image"></image>
|
||||
</view>
|
||||
<view class="text">
|
||||
<view class="name line1">{{store_info.storeName}}</view>
|
||||
<view class="money font-color">
|
||||
￥<text class="num">{{store_info.price}}</text>
|
||||
</view>
|
||||
<view class="y_money">￥{{store_info.otPrice}}</view>
|
||||
</view>
|
||||
<navigator :url="'/pages/goods_details/index?id='+store_info.id" hover-class="none" class="label"><text class="span">查看商品</text></navigator>
|
||||
</view>
|
||||
<!-- #ifdef H5 -->
|
||||
<button class="bnt bg-color" hover-class='none' @click="listenerActionSheet" v-if="this.$wechat.isWeixin()">和好友一起分享</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<button class="bnt bg-color" open-type="share" hover-class='none'>和好友一起分享</button>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<shareInfo @setShareInfoStatus="setShareInfoStatus" :shareInfoStatus="shareInfoStatus"></shareInfo>
|
||||
<home></home>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getArticleDetails
|
||||
} from '@/api/api.js';
|
||||
import {
|
||||
getProductDetail
|
||||
} from '@/api/store.js';
|
||||
import shareInfo from '@/components/shareInfo';
|
||||
import home from '@/components/home';
|
||||
import parser from "@/components/jyf-parser/jyf-parser";
|
||||
export default {
|
||||
components: {
|
||||
shareInfo,
|
||||
home,
|
||||
"jyf-parser": parser
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
id: 0,
|
||||
articleInfo: [],
|
||||
store_info: {},
|
||||
content:'',
|
||||
shareInfoStatus:false,
|
||||
tagStyle: {
|
||||
img: 'width:100%;'
|
||||
},
|
||||
productId: 0
|
||||
};
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
if (options.hasOwnProperty('id')){
|
||||
this.id = options.id;
|
||||
}else{
|
||||
// #ifndef H5
|
||||
uni.navigateBack({delta: 1 });
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
history.back();
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
onShow: function () {
|
||||
this.getArticleOne();
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
// #ifdef MP
|
||||
onShareAppMessage: function() {
|
||||
return {
|
||||
title: this.articleInfo.title,
|
||||
imageUrl: this.articleInfo.imageInput.length ? this.articleInfo.imageInput[0] : "",
|
||||
desc: this.articleInfo.synopsis,
|
||||
path: '/pages/news_details/index?id=' + this.id
|
||||
};
|
||||
},
|
||||
// #endif
|
||||
methods: {
|
||||
getArticleOne:function(){
|
||||
let that = this;
|
||||
getArticleDetails({id:that.id}).then(res=>{
|
||||
uni.setNavigationBarTitle({
|
||||
title:res.data.title.substring(0,7) + "..."
|
||||
});
|
||||
that.$set(that,'articleInfo',res.data);
|
||||
that.$set(that,'productId',res.data.productId);
|
||||
if(res.data.productId){
|
||||
that.goodInfo(res.data.productId);
|
||||
}
|
||||
that.content = res.data.content;
|
||||
// #ifdef H5
|
||||
if(this.$wechat.isWeixin()){
|
||||
this.setShareInfo();
|
||||
}
|
||||
// #endif
|
||||
});
|
||||
},
|
||||
goodInfo(id){
|
||||
getProductDetail(id).then(res=>{
|
||||
this.$set(this,'store_info',res.data.storeInfo?res.data.storeInfo:{});
|
||||
})
|
||||
},
|
||||
listenerActionSheet(){
|
||||
this.shareInfoStatus = true
|
||||
},
|
||||
setShareInfoStatus(){
|
||||
this.shareInfoStatus = false
|
||||
},
|
||||
setShareInfo: function() {
|
||||
let href = location.href;
|
||||
let configAppMessage = {
|
||||
desc: this.articleInfo.synopsis,
|
||||
title: this.articleInfo.title,
|
||||
link: href,
|
||||
imgUrl: this.articleInfo.imageInput.length ? this.articleInfo.imageInput[0] : ""
|
||||
};
|
||||
this.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"], configAppMessage);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.newsDetail .title {
|
||||
padding: 0 30rpx;
|
||||
font-size: 34rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
margin: 45rpx 0 23rpx 0;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.newsDetail .list {
|
||||
margin: 0 30rpx;
|
||||
// border-bottom: 1rpx solid #eee;
|
||||
padding-bottom: 25rpx;
|
||||
}
|
||||
|
||||
.newsDetail .list .label {
|
||||
font-size: 30rpx;
|
||||
color: #B1B2B3;
|
||||
// height: 38rpx;
|
||||
// border-radius: 3rpx;
|
||||
// text-align: center;
|
||||
// line-height: 38rpx;
|
||||
// padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.newsDetail .list .item {
|
||||
margin-left: 27rpx;
|
||||
font-size: 30rpx;
|
||||
color: #B1B2B3;
|
||||
}
|
||||
|
||||
.newsDetail .list .item .iconfont {
|
||||
font-size: 28rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.newsDetail .list .item .iconfont.icon-shenhezhong {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.newsDetail .conters {
|
||||
padding: 0 30rpx;
|
||||
font-size: 32rpx;
|
||||
color: #8A8B8C;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt {
|
||||
width: 690rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 20rpx;
|
||||
border: 1px solid #e1e1e1;
|
||||
position: relative;
|
||||
margin: 30rpx auto 0 auto;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .pictrue {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20rpx 0 0 20rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .text {
|
||||
width: 460rpx;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .text .name {
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .text .money {
|
||||
font-size: 24rpx;
|
||||
margin-top: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .text .money .num {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .text .y_money {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .label {
|
||||
position: absolute;
|
||||
background-color: #303131;
|
||||
width: 160rpx;
|
||||
height: 50rpx;
|
||||
right: -7rpx;
|
||||
border-radius: 25rpx 0 6rpx 25rpx;
|
||||
text-align: center;
|
||||
line-height: 50rpx;
|
||||
bottom: 24rpx;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .label .span {
|
||||
background-image: linear-gradient(to right, #fff71e 0%, #f9b513 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.newsDetail .picTxt .label:after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-bottom: 8rpx solid #303131;
|
||||
border-right: 8rpx solid transparent;
|
||||
top: -7rpx;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.newsDetail .bnt {
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
width: 690rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 45rpx;
|
||||
margin: 48rpx auto;
|
||||
text-align: center;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
</style>
|
||||
313
app/pages/news_list/index.vue
Normal file
313
app/pages/news_list/index.vue
Normal file
@@ -0,0 +1,313 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='newsList'>
|
||||
<view class='swiper' v-if="imgUrls.length > 0">
|
||||
<swiper indicator-dots="true" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
|
||||
indicator-color="rgba(102,102,102,0.3)" indicator-active-color="#666">
|
||||
<block v-for="(item,index) in imgUrls" :key="index">
|
||||
<swiper-item>
|
||||
<navigator :url="'/pages/news_details/index?id='+item.id">
|
||||
<image :src="item.imageInput[0]" class="slide-image" />
|
||||
</navigator>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class='nav' v-if="navList.length > 0">
|
||||
<scroll-view class="scroll-view_x" scroll-x scroll-with-animation :scroll-left="scrollLeft" style="width:auto;overflow:hidden;">
|
||||
<block v-for="(item,index) in navList" :key="index">
|
||||
<view class='item' :class='active==item.id?"on":""' @click='tabSelect(item.id)'>
|
||||
<view>{{item.name}}</view>
|
||||
<view class='line bg-color' v-if="active==item.id"></view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class='list'>
|
||||
<block v-for="(item,index) in articleList" :key="index">
|
||||
<navigator :url='"/pages/news_details/index?id="+item.id' hover-class='none' class='item acea-row row-between-wrapper'
|
||||
v-if="item.imageInput.length == 1">
|
||||
<view class='text acea-row row-column-between'>
|
||||
<view class='name line2'>{{item.title}}</view>
|
||||
<view>{{item.createTime}}</view>
|
||||
</view>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.imageInput[0]'></image>
|
||||
</view>
|
||||
</navigator>
|
||||
<navigator :url='"/pages/news_details/index?id="+item.id' hover-class='none' class='item' v-else-if="item.imageInput.length == 2">
|
||||
<view class='title line1'>{{item.title}}</view>
|
||||
<view class='picList acea-row row-between-wrapper'>
|
||||
<block v-for="(itemImg,indexImg) in item.imageInput" :key="indexImg">
|
||||
<view class='pictrue'>
|
||||
<image :src='itemImg'></image>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class='time'>{{item.createTime}}</view>
|
||||
</navigator>
|
||||
<navigator :url='"/pages/news_details/index?id="+item.id' hover-class='none' class='item' v-else-if="item.imageInput.length > 2">
|
||||
<view class='title line1'>{{item.title}}</view>
|
||||
<view class='picList on acea-row row-between-wrapper'>
|
||||
<block v-for="(itemImg,indexImg) in item.imageInput" :key="indexImg">
|
||||
<view class='pictrue'>
|
||||
<image :src='itemImg'></image>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class='time'>{{item.createTime}}</view>
|
||||
</navigator>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view class='noCommodity' v-if="articleList.length == 0 && (page != 1 || active== 0)">
|
||||
<view class='pictrue'>
|
||||
<image src='../../static/images/noNews.png'></image>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getArticleCategoryList,
|
||||
getArticleList,
|
||||
getArticleHotList,
|
||||
getArticleBannerList
|
||||
} from '@/api/api.js';
|
||||
import home from '@/components/home';
|
||||
export default {
|
||||
components: {
|
||||
home
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgUrls: [],
|
||||
articleList: [],
|
||||
indicatorDots: false,
|
||||
circular: true,
|
||||
autoplay: true,
|
||||
interval: 3000,
|
||||
duration: 500,
|
||||
navList: [],
|
||||
active: 0,
|
||||
page: 1,
|
||||
limit: 8,
|
||||
status: false,
|
||||
scrollLeft: 0
|
||||
};
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function() {
|
||||
this.getArticleHot();
|
||||
this.getArticleBanner();
|
||||
this.getArticleCate();
|
||||
this.status = false;
|
||||
this.page = 1;
|
||||
this.articleList = [];
|
||||
this.getCidArticle();
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
this.getCidArticle();
|
||||
},
|
||||
methods: {
|
||||
getArticleHot: function() {
|
||||
let that = this;
|
||||
getArticleHotList().then(res => {
|
||||
that.$set(that, 'articleList', res.data.list);
|
||||
});
|
||||
},
|
||||
getArticleBanner: function() {
|
||||
let that = this;
|
||||
getArticleBannerList().then(res => {
|
||||
that.imgUrls = res.data.list;
|
||||
});
|
||||
},
|
||||
getCidArticle: function() {
|
||||
let that = this;
|
||||
if (that.active == 0) return;
|
||||
let limit = that.limit;
|
||||
let page = that.page;
|
||||
let articleList = that.articleList;
|
||||
if (that.status) return;
|
||||
getArticleList(that.active, {
|
||||
page: page,
|
||||
limit: limit
|
||||
}).then(res => {
|
||||
let articleListNew = [];
|
||||
let len = res.data.list.length;
|
||||
articleListNew = articleList.concat(res.data.list);
|
||||
that.page++;
|
||||
that.$set(that, 'articleList', articleListNew);
|
||||
that.status = limit > len;
|
||||
that.page = that.page;
|
||||
});
|
||||
},
|
||||
getArticleCate: function() {
|
||||
let that = this;
|
||||
getArticleCategoryList().then(res => {
|
||||
let list = res.data.list;
|
||||
list.unshift({id:0,name:'热门'});
|
||||
that.$set(that, 'navList', list);
|
||||
});
|
||||
},
|
||||
tabSelect(active) {
|
||||
this.active = active;
|
||||
this.scrollLeft = (active - 1) * 50;
|
||||
if (this.active == 0) this.getArticleHot();
|
||||
else {
|
||||
this.$set(this, 'articleList', []);
|
||||
this.page = 1;
|
||||
this.status = false;
|
||||
this.getCidArticle();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
.newsList .swiper {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.newsList .swiper swiper {
|
||||
width: 100%;
|
||||
height: 365rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.newsList .swiper .slide-image {
|
||||
width: 100%;
|
||||
height: 335rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
// #ifdef MP-WEIXIN
|
||||
.newsList .swiper .wx-swiper-dot {
|
||||
width: 12rpx !important;
|
||||
height: 12rpx !important;
|
||||
border-radius: 0;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: 0 100%;
|
||||
}
|
||||
|
||||
.newsList .swiper .wx-swiper-dot~.wx-swiper-dot {
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.newsList .swiper .wx-swiper-dots.wx-swiper-dots-horizontal {
|
||||
margin-bottom: -15rpx;
|
||||
}
|
||||
// #endif
|
||||
// #ifdef APP-PLUS || H5
|
||||
.newsList .swiper .uni-swiper-dot {
|
||||
width: 12rpx !important;
|
||||
height: 12rpx !important;
|
||||
border-radius: 0;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: 0 100%;
|
||||
}
|
||||
|
||||
.newsList .swiper .uni-swiper-dot~.uni-swiper-dot {
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.newsList .swiper .uni-swiper-dots.uni-swiper-dots-horizontal {
|
||||
margin-bottom: -15rpx;
|
||||
}
|
||||
// #endif
|
||||
.newsList .nav {
|
||||
padding: 0 30rpx;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
box-sizing: border-box;
|
||||
margin-top: 43rpx;
|
||||
}
|
||||
|
||||
.newsList .nav .item {
|
||||
display: inline-block;
|
||||
font-size: 32rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.newsList .nav .item.on {
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.newsList .nav .item~.item {
|
||||
margin-left: 46rpx;
|
||||
}
|
||||
|
||||
.newsList .nav .item .line {
|
||||
width: 24rpx;
|
||||
height: 4rpx;
|
||||
border-radius: 2rpx;
|
||||
margin: 10rpx auto 0 auto;
|
||||
}
|
||||
|
||||
.newsList .list .item {
|
||||
margin: 0 30rpx;
|
||||
border-bottom: 1rpx solid #f0f0f0;
|
||||
padding: 35rpx 0;
|
||||
}
|
||||
|
||||
.newsList .list .item .pictrue {
|
||||
width: 250rpx;
|
||||
height: 156rpx;
|
||||
}
|
||||
|
||||
.newsList .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.newsList .list .item .text {
|
||||
width: 420rpx;
|
||||
height: 156rpx;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.newsList .list .item .text .name {
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.newsList .list .item .picList .pictrue {
|
||||
width: 335rpx;
|
||||
height: 210rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.newsList .list .item .picList.on .pictrue {
|
||||
width: 217rpx;
|
||||
height: 136rpx;
|
||||
}
|
||||
|
||||
.newsList .list .item .picList .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.newsList .list .item .time {
|
||||
text-align: right;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 22rpx;
|
||||
}
|
||||
</style>
|
||||
1082
app/pages/order_addcart/order_addcart.vue
Normal file
1082
app/pages/order_addcart/order_addcart.vue
Normal file
File diff suppressed because it is too large
Load Diff
756
app/pages/order_addcart/order_addcart01.vue
Normal file
756
app/pages/order_addcart/order_addcart01.vue
Normal file
@@ -0,0 +1,756 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='shoppingCart'>
|
||||
<view class='labelNav acea-row row-around row-middle'>
|
||||
<view class='item'><text class='iconfont icon-xuanzhong'></text>100%正品保证</view>
|
||||
<view class='item'><text class='iconfont icon-xuanzhong'></text>所有商品精挑细选</view>
|
||||
<view class='item'><text class='iconfont icon-xuanzhong'></text>售后无忧</view>
|
||||
</view>
|
||||
<view class='nav acea-row row-between-wrapper'>
|
||||
<view>购物数量 <text class='num font-color'>{{cartCount}}</text></view>
|
||||
<view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0" class='administrate acea-row row-center-wrapper'
|
||||
@click='manage'>{{ footerswitch ? '管理' : '取消'}}</view>
|
||||
</view>
|
||||
<view v-if="cartList.valid.length > 0 || cartList.invalid.length > 0">
|
||||
<view class='list'>
|
||||
<checkbox-group @change="checkboxChange">
|
||||
<block v-for="(item,index) in cartList.valid" :key="index">
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<!-- #ifndef MP -->
|
||||
<checkbox :value="(item.id).toString()" :checked="item.checked" />
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<checkbox :value="item.id" :checked="item.checked" />
|
||||
<!-- #endif -->
|
||||
<navigator :url='"/pages/goods_details/index?id="+item.product_id' hover-class='none' class='picTxt acea-row row-between-wrapper'>
|
||||
<view class='pictrue'>
|
||||
<image v-if="item.productInfo.attrInfo" :src='item.productInfo.attrInfo.image'></image>
|
||||
<image v-else :src='item.productInfo.image'></image>
|
||||
</view>
|
||||
<view class='text'>
|
||||
<view class='line1'>{{item.productInfo.store_name}}</view>
|
||||
<view class='infor line1' v-if="item.productInfo.attrInfo">属性：{{item.productInfo.attrInfo.suk}}</view>
|
||||
<view class='money'>￥{{item.truePrice}}</view>
|
||||
</view>
|
||||
<view class='carnum acea-row row-center-wrapper'>
|
||||
<view class="reduce" :class="item.numSub ? 'on' : ''" @click.stop='subCart(index)'>-</view>
|
||||
<view class='num'>{{item.cart_num}}</view>
|
||||
<!-- <view class="num">
|
||||
<input type="number" v-model="item.cart_num" @click.stop @input="iptCartNum(index)" @blur="blurInput(index)"/>
|
||||
</view> -->
|
||||
<view class="plus" :class="item.numAdd ? 'on' : ''" @click.stop='addCart(index)'>+</view>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</block>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
<view class='invalidGoods' v-if="cartList.invalid.length > 0">
|
||||
<view class='goodsNav acea-row row-between-wrapper'>
|
||||
<view @click='goodsOpen'><text class='iconfont' :class='goodsHidden==true?"icon-xiangxia":"icon-xiangshang"'></text>失效商品</view>
|
||||
<view class='del' @click='unsetCart'><text class='iconfont icon-shanchu1'></text>清空</view>
|
||||
</view>
|
||||
<view class='goodsList' :hidden='goodsHidden'>
|
||||
<block v-for="(item,index) in cartList.invalid" :key='index'>
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view class='invalid'>失效</view>
|
||||
<view class='pictrue'>
|
||||
<image v-if="item.productInfo.attrInfo" :src='item.productInfo.attrInfo.image'></image>
|
||||
<image v-else :src='item.productInfo.image'></image>
|
||||
</view>
|
||||
<view class='text acea-row row-column-between'>
|
||||
<view class='line1 name'>{{item.productInfo.store_name}}</view>
|
||||
<view class='infor line1' v-if="item.productInfo.attrInfo">属性：{{item.productInfo.attrInfo.suk}}</view>
|
||||
<view class='acea-row row-between-wrapper'>
|
||||
<!-- <view>￥{{item.truePrice}}</view> -->
|
||||
<view class='end'>该商品已失效</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='noCart' v-if="cartList.valid.length == 0 && cartList.invalid.length == 0">
|
||||
<view class='pictrue'>
|
||||
<image src='../../static/images/noCart.png'></image>
|
||||
</view>
|
||||
<recommend :hostProduct='hostProduct'></recommend>
|
||||
</view>
|
||||
<view style='height:120rpx;'></view>
|
||||
<view class='footer acea-row row-between-wrapper' v-if="cartList.valid.length > 0">
|
||||
<view>
|
||||
<checkbox-group @change="checkboxAllChange">
|
||||
<checkbox value="all" :checked="!!isAllSelect" /><text class='checkAll'>全选 ({{cartCount}})</text>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
<view class='money acea-row row-middle' v-if="footerswitch==true">
|
||||
<text class='font-color'>￥{{selectCountPrice}}</text>
|
||||
<form @submit="subOrder" report-submit='true'>
|
||||
<button class='placeOrder bg-color' formType="submit">立即下单</button>
|
||||
</form>
|
||||
</view>
|
||||
<view class='button acea-row row-middle' v-else>
|
||||
<form @submit="subCollect" report-submit='true'>
|
||||
<button class='bnt cart-color' formType="submit">收藏</button>
|
||||
</form>
|
||||
<form @submit="subDel" report-submit='true'>
|
||||
<button class='bnt' formType="submit">删除</button>
|
||||
</form>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #ifdef MP -->
|
||||
<authorize :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getCartList,
|
||||
getCartCounts,
|
||||
changeCartNum,
|
||||
cartDel
|
||||
} from '@/api/order.js';
|
||||
import {
|
||||
getProductHot,
|
||||
collectAll
|
||||
} from '@/api/store.js';
|
||||
import {
|
||||
toLogin
|
||||
} from '@/libs/login.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
import recommend from '@/components/recommend';
|
||||
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
|
||||
// #ifdef MP
|
||||
import authorize from '@/components/Authorize';
|
||||
// #endif
|
||||
export default {
|
||||
components: {
|
||||
recommend,
|
||||
// #ifdef MP
|
||||
authorize
|
||||
// #endif
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
cartCount: 0,
|
||||
goodsHidden: true,
|
||||
footerswitch: true,
|
||||
hostProduct: [],
|
||||
cartList: {
|
||||
valid: [],
|
||||
invalid: []
|
||||
},
|
||||
isAllSelect: false, //全选
|
||||
selectValue: [], //选中的数据
|
||||
selectCountPrice: 0.00,
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
hotScroll:false,
|
||||
hotPage:1,
|
||||
hotLimit:10
|
||||
};
|
||||
},
|
||||
computed: mapGetters(['isLogin']),
|
||||
onLoad: function(options) {
|
||||
let that = this;
|
||||
if (that.isLogin == false) {
|
||||
// #ifdef H5 || APP-PLUS
|
||||
toLogin();
|
||||
// #endif
|
||||
// #ifdef MP
|
||||
that.isAuto = true;
|
||||
that.$set(that, 'isShowAuth', true);
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
onShow: function() {
|
||||
if (this.isLogin == true) {
|
||||
this.getHostProduct();
|
||||
this.getCartList();
|
||||
this.getCartNum();
|
||||
this.goodsHidden = true;
|
||||
this.footerswitch = true;
|
||||
this.hostProduct = [];
|
||||
this.hotScroll = false;
|
||||
this.hotPage = 1;
|
||||
this.hotLimit = 10;
|
||||
this.cartList = {
|
||||
valid: [],
|
||||
invalid: []
|
||||
},
|
||||
this.isAllSelect = false; //全选
|
||||
this.selectValue = []; //选中的数据
|
||||
this.selectCountPrice = 0.00;
|
||||
this.cartCount = 0;
|
||||
this.isShowAuth = false;
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 手动输入数量失焦事件
|
||||
*/
|
||||
// inputBlur(index,val) {
|
||||
// if (val <= 1) {
|
||||
// // let index = e.currentTarget.dataset.index;
|
||||
// let item = this.cartList.valid[index];
|
||||
// item.cart_num = 1;
|
||||
// if (item.cart_num) this.setCartNum(item.id, item.cart_num);
|
||||
// this.cartList.valid[index] = item;
|
||||
// this.$set(this.cartList,'valid',this.cartList.valid);
|
||||
// this.switchSelect();
|
||||
// }
|
||||
// },
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e;
|
||||
},
|
||||
subDel: function(event) {
|
||||
let that = this,
|
||||
selectValue = that.selectValue;
|
||||
if (selectValue.length > 0)
|
||||
cartDel(selectValue).then(res => {
|
||||
that.getCartList();
|
||||
that.getCartNum();
|
||||
});
|
||||
else
|
||||
return that.$util.Tips({
|
||||
title: '请选择产品'
|
||||
});
|
||||
},
|
||||
getSelectValueProductId: function() {
|
||||
let that = this;
|
||||
let validList = that.cartList.valid;
|
||||
let selectValue = that.selectValue;
|
||||
let productId = [];
|
||||
if (selectValue.length > 0) {
|
||||
for (let index in validList) {
|
||||
if (that.inArray(validList[index].id, selectValue)) {
|
||||
productId.push(validList[index].product_id);
|
||||
}
|
||||
}
|
||||
};
|
||||
return productId;
|
||||
},
|
||||
subCollect: function(event) {
|
||||
let that = this,
|
||||
selectValue = that.selectValue;
|
||||
if (selectValue.length > 0) {
|
||||
let selectValueProductId = that.getSelectValueProductId();
|
||||
collectAll(that.getSelectValueProductId().join(',')).then(res => {
|
||||
return that.$util.Tips({
|
||||
title: res.msg,
|
||||
icon: 'success'
|
||||
});
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
} else {
|
||||
return that.$util.Tips({
|
||||
title: '请选择产品'
|
||||
});
|
||||
}
|
||||
},
|
||||
subOrder: function(event) {
|
||||
let that = this,
|
||||
selectValue = that.selectValue;
|
||||
if (selectValue.length > 0) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/order_confirm/index?cartId=' + selectValue.join(',')
|
||||
});
|
||||
} else {
|
||||
return that.$util.Tips({
|
||||
title: '请选择产品'
|
||||
});
|
||||
}
|
||||
},
|
||||
checkboxAllChange: function(event) {
|
||||
let value = event.detail.value;
|
||||
if (value.length > 0) {
|
||||
this.setAllSelectValue(1)
|
||||
} else {
|
||||
this.setAllSelectValue(0)
|
||||
}
|
||||
},
|
||||
setAllSelectValue: function(status) {
|
||||
let that = this;
|
||||
let selectValue = [];
|
||||
let valid = that.cartList.valid;
|
||||
if (valid.length > 0) {
|
||||
for (let index in valid) {
|
||||
if (status == 1) {
|
||||
valid[index].checked = true;
|
||||
selectValue.push(valid[index].id);
|
||||
} else valid[index].checked = false;
|
||||
}
|
||||
that.$set(that.cartList, 'valid', valid);
|
||||
that.selectValue = selectValue;
|
||||
that.switchSelect();
|
||||
}
|
||||
},
|
||||
checkboxChange: function(event) {
|
||||
let that = this;
|
||||
let value = event.detail.value;
|
||||
let valid = that.cartList.valid;
|
||||
for (let index in valid) {
|
||||
if (that.inArray(valid[index].id, value)) valid[index].checked = true;
|
||||
else valid[index].checked = false;
|
||||
}
|
||||
that.$set(that.cartList, 'valid', valid);
|
||||
that.isAllSelect = value.length == that.cartList.valid.length;
|
||||
that.selectValue = value;
|
||||
that.switchSelect();
|
||||
},
|
||||
inArray: function(search, array) {
|
||||
for (let i in array) {
|
||||
if (array[i] == search) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
},
|
||||
switchSelect: function() {
|
||||
let that = this;
|
||||
let validList = that.cartList.valid;
|
||||
let selectValue = that.selectValue;
|
||||
let selectCountPrice = 0.00;
|
||||
if (selectValue.length < 1) {
|
||||
that.selectCountPrice = selectCountPrice;
|
||||
} else {
|
||||
for (let index in validList) {
|
||||
if (that.inArray(validList[index].id, selectValue)) {
|
||||
selectCountPrice = that.$util.$h.Add(selectCountPrice, that.$util.$h.Mul(validList[index].cart_num, validList[
|
||||
index].truePrice))
|
||||
}
|
||||
}
|
||||
that.selectCountPrice = selectCountPrice;
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 购物车手动填写
|
||||
*
|
||||
*/
|
||||
iptCartNum: function (index) {
|
||||
let item = this.cartList.valid[index];
|
||||
if(item.cart_num){
|
||||
this.setCartNum(item.id, item.cart_num);
|
||||
}
|
||||
this.switchSelect();
|
||||
},
|
||||
blurInput:function (index) {
|
||||
console.log(66);
|
||||
let item = this.cartList.valid[index];
|
||||
if(!item.cart_num){
|
||||
item.cart_num = 1;
|
||||
console.log( item.cart_num)
|
||||
this.$set(this.cartList,'valid',this.cartList.valid)
|
||||
}
|
||||
},
|
||||
subCart: function(index) {
|
||||
let that = this;
|
||||
let status = false;
|
||||
let item = that.cartList.valid[index];
|
||||
item.cart_num = Number(item.cart_num) - 1;
|
||||
if (item.cart_num < 1) status = true;
|
||||
if (item.cart_num <= 1) {
|
||||
item.cart_num = 1;
|
||||
item.numSub = true;
|
||||
} else {
|
||||
item.numSub = false;
|
||||
item.numAdd = false;
|
||||
}
|
||||
if (false == status) {
|
||||
that.setCartNum(item.id, item.cart_num, function(data) {
|
||||
that.cartList.valid[index] = item;
|
||||
that.switchSelect();
|
||||
});
|
||||
}
|
||||
},
|
||||
addCart: function(index) {
|
||||
let that = this;
|
||||
let item = that.cartList.valid[index];
|
||||
item.cart_num = Number(item.cart_num) + 1;
|
||||
let productInfo = item.productInfo;
|
||||
if (productInfo.hasOwnProperty('attrInfo') && item.cart_num >= item.productInfo.attrInfo.stock) {
|
||||
item.cart_num = item.productInfo.attrInfo.stock;
|
||||
item.numAdd = true;
|
||||
item.numSub = false;
|
||||
}else {
|
||||
item.numAdd = false;
|
||||
item.numSub = false;
|
||||
}
|
||||
that.setCartNum(item.id, item.cart_num, function(data) {
|
||||
that.cartList.valid[index] = item;
|
||||
that.switchSelect();
|
||||
});
|
||||
},
|
||||
setCartNum(cartId, cartNum, successCallback) {
|
||||
let that = this;
|
||||
changeCartNum(cartId, cartNum).then(res => {
|
||||
successCallback && successCallback(res.data);
|
||||
});
|
||||
},
|
||||
getCartNum: function() {
|
||||
let that = this;
|
||||
getCartCounts().then(res => {
|
||||
that.cartCount = res.data.count;
|
||||
});
|
||||
},
|
||||
getCartList: function() {
|
||||
let that = this;
|
||||
getCartList().then(res => {
|
||||
let cartList = res.data;
|
||||
let valid = cartList.valid;
|
||||
let numSub = [{
|
||||
numSub: true
|
||||
}, {
|
||||
numSub: false
|
||||
}];
|
||||
let numAdd = [{
|
||||
numAdd: true
|
||||
}, {
|
||||
numAdd: false
|
||||
}],
|
||||
selectValue = [];
|
||||
if (valid.length > 0) {
|
||||
for (let index in valid) {
|
||||
if (valid[index].cart_num == 1) {
|
||||
valid[index].numSub = true;
|
||||
} else {
|
||||
valid[index].numSub = false;
|
||||
}
|
||||
let productInfo = valid[index].productInfo;
|
||||
if (productInfo.hasOwnProperty('attrInfo') && valid[index].cart_num == valid[index].productInfo.attrInfo.stock) {
|
||||
valid[index].numAdd = true;
|
||||
} else if (valid[index].cart_num == valid[index].productInfo.stock) {
|
||||
valid[index].numAdd = true;
|
||||
} else {
|
||||
valid[index].numAdd = false;
|
||||
}
|
||||
valid[index].checked = true;
|
||||
selectValue.push(valid[index].id);
|
||||
}
|
||||
}
|
||||
that.$set(that, 'cartList', cartList);
|
||||
that.goodsHidden = cartList.valid.length <= 0 ? false : true;
|
||||
that.selectValue = selectValue;
|
||||
that.isAllSelect = valid.length == selectValue.length && valid.length;
|
||||
that.switchSelect();
|
||||
});
|
||||
},
|
||||
getHostProduct: 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)
|
||||
});
|
||||
},
|
||||
goodsOpen: function() {
|
||||
let that = this;
|
||||
that.goodsHidden = !that.goodsHidden;
|
||||
},
|
||||
manage: function() {
|
||||
let that = this;
|
||||
that.footerswitch = !that.footerswitch;
|
||||
},
|
||||
unsetCart: function() {
|
||||
let that = this,
|
||||
ids = [];
|
||||
for (let i = 0, len = that.cartList.invalid.length; i < len; i++) {
|
||||
ids.push(that.cartList.invalid[i].id);
|
||||
}
|
||||
cartDel(ids).then(res => {
|
||||
that.$util.Tips({
|
||||
title: '清除成功'
|
||||
});
|
||||
that.$set(that.cartList, 'invalid', []);
|
||||
}).catch(res => {
|
||||
|
||||
});
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getHostProduct();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.shoppingCart .labelNav {
|
||||
height: 76rpx;
|
||||
padding: 0 30rpx;
|
||||
font-size: 22rpx;
|
||||
color: #8c8c8c;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #f5f5f5;
|
||||
z-index: 5;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.shoppingCart .labelNav .item .iconfont {
|
||||
font-size: 25rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .nav {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #fff;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
z-index: 5;
|
||||
top: 76rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .nav .administrate {
|
||||
font-size: 26rpx;
|
||||
color: #282828;
|
||||
width: 110rpx;
|
||||
height: 46rpx;
|
||||
border-radius: 6rpx;
|
||||
border: 1px solid #868686;
|
||||
}
|
||||
|
||||
.shoppingCart .noCart {
|
||||
margin-top: 171rpx;
|
||||
background-color: #fff;
|
||||
padding-top: 0.1rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .noCart .pictrue {
|
||||
width: 414rpx;
|
||||
height: 336rpx;
|
||||
margin: 78rpx auto 56rpx auto;
|
||||
}
|
||||
|
||||
.shoppingCart .noCart .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.shoppingCart .list {
|
||||
margin-top: 171rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item {
|
||||
padding: 25rpx 30rpx;
|
||||
background-color: #fff;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt {
|
||||
width: 627rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .pictrue {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .text {
|
||||
width: 444rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .text .infor {
|
||||
font-size: 24rpx;
|
||||
color: #868686;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .text .money {
|
||||
font-size: 32rpx;
|
||||
color: #282828;
|
||||
margin-top: 28rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .carnum {
|
||||
height: 47rpx;
|
||||
position: absolute;
|
||||
bottom: 7rpx;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .carnum view {
|
||||
border: 1rpx solid #a4a4a4;
|
||||
width: 66rpx;
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
line-height: 40rpx;
|
||||
font-size: 28rpx;
|
||||
color: #a4a4a4;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .carnum .reduce {
|
||||
border-right: 0;
|
||||
border-radius: 3rpx 0 0 3rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .carnum .reduce.on {
|
||||
border-color: #e3e3e3;
|
||||
color: #dedede;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .carnum .plus {
|
||||
border-left: 0;
|
||||
border-radius: 0 3rpx 3rpx 0;
|
||||
}
|
||||
|
||||
.shoppingCart .list .item .picTxt .carnum .num {
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsNav {
|
||||
width: 100%;
|
||||
height: 66rpx;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsNav .iconfont {
|
||||
color: #424242;
|
||||
font-size: 28rpx;
|
||||
margin-right: 17rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsNav .del {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsNav .del .icon-shanchu1 {
|
||||
color: #999;
|
||||
font-size: 33rpx;
|
||||
vertical-align: -2rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsList .item {
|
||||
padding: 20rpx 30rpx;
|
||||
border-top: 1rpx solid #f5f5f5;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsList .item .invalid {
|
||||
font-size: 22rpx;
|
||||
color: #fff;
|
||||
width: 70rpx;
|
||||
height: 36rpx;
|
||||
background-color: #aaa;
|
||||
border-radius: 3rpx;
|
||||
text-align: center;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsList .item .pictrue {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsList .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsList .item .text {
|
||||
width: 433rpx;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
height: 140rpx;
|
||||
}
|
||||
.shoppingCart .invalidGoods .goodsList .item .text .name{width:100%;}
|
||||
.shoppingCart .invalidGoods .goodsList .item .text .infor {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .invalidGoods .goodsList .item .text .end {
|
||||
font-size: 26rpx;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
.shoppingCart .footer {
|
||||
z-index:9;
|
||||
width: 100%;
|
||||
height: 96rpx;
|
||||
background-color: #fafafa;
|
||||
position: fixed;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
border-top: 1rpx solid #eee;
|
||||
//
|
||||
bottom: 0;
|
||||
//
|
||||
// #ifndef MP
|
||||
bottom: 50px;
|
||||
// #endif
|
||||
}
|
||||
|
||||
.shoppingCart .footer .checkAll {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
// .shoppingCart .footer checkbox .wx-checkbox-input{background-color:#fafafa;}
|
||||
.shoppingCart .footer .money {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .footer .placeOrder {
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
width: 226rpx;
|
||||
height: 70rpx;
|
||||
border-radius: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 70rpx;
|
||||
margin-left: 22rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .footer .button .bnt {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
border-radius: 50rpx;
|
||||
border: 1px solid #999;
|
||||
width: 160rpx;
|
||||
height: 60rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
}
|
||||
|
||||
.shoppingCart .footer .button form~form {
|
||||
margin-left: 17rpx;
|
||||
}
|
||||
</style>
|
||||
991
app/pages/order_details/index.vue
Normal file
991
app/pages/order_details/index.vue
Normal file
@@ -0,0 +1,991 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='order-details'>
|
||||
<!-- 给header上与data上加on为退款订单-->
|
||||
<view class='header bg-color acea-row row-middle' :class='isGoodsReturn ? "on":""'>
|
||||
<view class='pictrue' v-if="isGoodsReturn==false">
|
||||
<image :src="orderInfo.statusPic"></image>
|
||||
</view>
|
||||
<view class='data' :class='isGoodsReturn ? "on":""'>
|
||||
<view class='state'>{{orderInfo.pstatus.msg}}</view>
|
||||
<view>{{orderInfo.createTime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="isGoodsReturn==false">
|
||||
<view class='nav'>
|
||||
<view class='navCon acea-row row-between-wrapper'>
|
||||
<view :class="status.type == 0 || status.type == -9 ? 'on':''">待付款</view>
|
||||
<view :class="status.type == 1 ? 'on':''">{{orderInfo.shippingType==1 ? '待发货':'待核销'}}</view>
|
||||
<view :class="status.type == 2 ? 'on':''" v-if="orderInfo.shippingType == 1">待收货</view>
|
||||
<view :class="status.type == 3 ? 'on':''">待评价</view>
|
||||
<view :class="status.type == 4 ? 'on':''">已完成</view>
|
||||
</view>
|
||||
<view class='progress acea-row row-between-wrapper'>
|
||||
<view class='iconfont' :class='(status.type == 0 || status.type == -9 ? "icon-webicon318":"icon-yuandianxiao") + " " + (status.type >= 0 ? "font-color":"")'></view>
|
||||
<view class='line' :class='status.type > 0 ? "bg-color":""'></view>
|
||||
<view class='iconfont' :class='(status.type == 1 ? "icon-webicon318":"icon-yuandianxiao") + " " + (status.type >= 1 ? "font-color":"")'></view>
|
||||
<view class='line' :class='status.type > 1 ? "bg-color":""' v-if="orderInfo.shippingType == 1"></view>
|
||||
<view class='iconfont' :class='(status.type == 2 ? "icon-webicon318":"icon-yuandianxiao") + " " +(status.type >= 2 ? "font-color":"")'
|
||||
v-if="orderInfo.shippingType == 1"></view>
|
||||
<view class='line' :class='status.type > 2 ? "bg-color":""'></view>
|
||||
<view class='iconfont' :class='(status.type == 3 ? "icon-webicon318":"icon-yuandianxiao") + " " + (status.type >= 3 ? "font-color":"")'></view>
|
||||
<view class='line' :class='status.type > 3 ? "bg-color":""'></view>
|
||||
<view class='iconfont' :class='(status.type == 4 ? "icon-webicon318":"icon-yuandianxiao") + " " + (status.type >= 4 ? "font-color":"")'></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 拒绝退款 -->
|
||||
<view class="refund" v-if="orderInfo.refundReason">
|
||||
<view class="title">
|
||||
<image src="/static/images/shuoming.png" mode=""></image>
|
||||
商家拒绝退款
|
||||
</view>
|
||||
<view class="con">拒绝原因：{{orderInfo.refundReason}}</view>
|
||||
</view>
|
||||
<view class="writeOff" v-if="orderInfo.shippingType == 2 && orderInfo.paid">
|
||||
<view class="title">核销信息</view>
|
||||
<view class="grayBg">
|
||||
<view class="pictrue">
|
||||
<image :src="orderInfo.code"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="gear">
|
||||
<image src="../../static/images/writeOff.jpg"></image>
|
||||
</view>
|
||||
<view class="num">{{orderInfo.verifyCode}}</view>
|
||||
<view class="rules">
|
||||
<view class="item">
|
||||
<view class="rulesTitle acea-row row-middle">
|
||||
<text class="iconfont icon-shijian"></text>核销时间
|
||||
</view>
|
||||
<view class="info">
|
||||
每日：<text class="time">{{orderInfo.systemStore.dayTime}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="rulesTitle acea-row row-middle">
|
||||
<text class="iconfont icon-shuoming1"></text>使用说明
|
||||
</view>
|
||||
<view class="info">可将二维码出示给店员扫描或提供数字核销码</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="map acea-row row-between-wrapper" v-if="orderInfo.shippingType == 2">
|
||||
<view>自提地址信息</view>
|
||||
<view class="place cart-color acea-row row-center-wrapper" @tap="showMaoLocation">
|
||||
<text class="iconfont icon-weizhi"></text>查看位置
|
||||
</view>
|
||||
</view>
|
||||
<view class='address' v-if="orderInfo.shippingType === 1">
|
||||
<view class='name'>{{orderInfo.realName}}<text class='phone'>{{orderInfo.userPhone}}</text></view>
|
||||
<view>{{orderInfo.userAddress}}</view>
|
||||
</view>
|
||||
<view class='address' v-else style="margin-top:0;">
|
||||
<view class='name' @tap="makePhone">{{orderInfo.systemStore?orderInfo.systemStore.name:''}}<text class='phone'>{{orderInfo.systemStore?orderInfo.systemStore.phone:''}}</text><text
|
||||
class="iconfont icon-tonghua font-color"></text></view>
|
||||
<view>{{orderInfo.systemStore?orderInfo.systemStore.detailedAddress:''}}</view>
|
||||
</view>
|
||||
<view class='line' v-if="orderInfo.shippingType === 1">
|
||||
<image src='../../static/images/line.jpg'></image>
|
||||
</view>
|
||||
</view>
|
||||
<orderGoods :evaluate='evaluate' :orderId="order_id" :ids="id" :uniId="uniId" :cartInfo="cartInfo" :jump="true"></orderGoods>
|
||||
<!-- <div class="goodCall" @click="goGoodCall"> -->
|
||||
<!-- #ifdef H5 -->
|
||||
<div class="goodCall" @click="kefuClick">
|
||||
<span class="iconfont icon-kefu"></span><span>联系客服</span>
|
||||
</div>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<div class="goodCall">
|
||||
<button open-type='contact' hover-class='none'>
|
||||
<span class="iconfont icon-kefu"></span><span>联系客服</span>
|
||||
</button>
|
||||
</div>
|
||||
<!-- #endif -->
|
||||
<view class='wrapper'>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>订单编号：</view>
|
||||
<view class='conter acea-row row-middle row-right'>{{orderInfo.orderId}}
|
||||
<!-- #ifndef H5 -->
|
||||
<text class='copy' @tap='copy'>复制</text>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<text class='copy copy-data' :data-clipboard-text="orderInfo.orderId">复制</text>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>下单时间：</view>
|
||||
<view class='conter'>{{(orderInfo.createTime || 0)}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>支付状态：</view>
|
||||
<view class='conter' v-if="orderInfo.paid">已支付</view>
|
||||
<view class='conter' v-else>未支付</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>支付方式：</view>
|
||||
<view class='conter'>{{orderInfo.pstatus.payType}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between' v-if="orderInfo.mark">
|
||||
<view>买家留言：</view>
|
||||
<view class='conter'>{{orderInfo.mark}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 退款订单详情 -->
|
||||
<view class='wrapper' v-if="isGoodsReturn">
|
||||
<view class='item acea-row row-between'>
|
||||
<view>收货人：</view>
|
||||
<view class='conter'>{{orderInfo.realName}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>联系电话：</view>
|
||||
<view class='conter'>{{orderInfo.userPhone}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>收货地址：</view>
|
||||
<view class='conter'>{{orderInfo.userAddress}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="orderInfo.status!=0">
|
||||
<view class='wrapper' v-if='orderInfo.deliveryType=="express"'>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>配送方式：</view>
|
||||
<view class='conter'>发货</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>快递公司：</view>
|
||||
<view class='conter'>{{orderInfo.deliveryName || ''}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>快递号：</view>
|
||||
<view class='conter'>{{orderInfo.deliveryId || ''}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='wrapper' v-else-if='orderInfo.deliveryType=="send"'>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>配送方式：：</view>
|
||||
<view class='conter'>送货</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>配送人姓名：</view>
|
||||
<view class='conter'>{{orderInfo.deliveryName || ''}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>联系电话：</view>
|
||||
<view class='conter acea-row row-middle row-right'>{{orderInfo.deliveryId || ''}}<text class='copy' @tap='goTel'>拨打</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='wrapper' v-else-if='orderInfo.deliveryType=="fictitious"'>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>虚拟发货：</view>
|
||||
<view class='conter'>已发货，请注意查收</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='wrapper'>
|
||||
<view class='item acea-row row-between'>
|
||||
<view>支付金额：</view>
|
||||
<view class='conter'>￥{{orderInfo.totalPrice}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between' v-if='orderInfo.couponId'>
|
||||
<view>优惠券抵扣：</view>
|
||||
<view class='conter'>-￥{{orderInfo.couponPrice}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between' v-if="orderInfo.useIntegral > 0">
|
||||
<view>积分抵扣：</view>
|
||||
<view class='conter'>-￥{{orderInfo.deductionPrice}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between' v-if="orderInfo.payPostage > 0">
|
||||
<view>运费：</view>
|
||||
<view class='conter'>￥{{orderInfo.payPostage}}</view>
|
||||
</view>
|
||||
<view class='actualPay acea-row row-right'>实付款：<text class='money font-color'>￥{{orderInfo.payPrice}}</text></view>
|
||||
</view>
|
||||
<view style='height:120rpx;'></view>
|
||||
<view class='footer acea-row row-right row-middle' v-if="isGoodsReturn==false || status.type == 9">
|
||||
<view class="qs-btn" v-if="status.type == 0 || status.type == -9" @click.stop="cancelOrder">取消订单</view>
|
||||
<view class='bnt bg-color' v-if="status.type==0" @tap='pay_open(orderInfo.orderId)'>立即付款</view>
|
||||
<!-- #ifdef MP -->
|
||||
<view @tap="openSubcribe('/pages/users/goods_return/index?orderId='+orderInfo.orderId)" class='bnt cancel'
|
||||
v-else-if="orderInfo.paid === 1 && orderInfo.refundStatus === 0">申请退款</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP -->
|
||||
<navigator hover-class="none" :url="'/pages/users/goods_return/index?orderId='+orderInfo.orderId" class='bnt cancel'
|
||||
v-else-if="orderInfo.paid === true && orderInfo.refundStatus === 0">申请退款</navigator>
|
||||
<!-- #endif -->
|
||||
<view class='bnt bg-color' v-if="status.class_status==1" @tap='goJoinPink'>查看拼团</view>
|
||||
<navigator class='bnt cancel' v-if="orderInfo.deliveryType == 'express' && status.class_status==3 && status.type==2"
|
||||
hover-class='none' :url="'/pages/users/goods_logistics/index?orderId='+ orderInfo.orderId">查看物流</navigator>
|
||||
<view class='bnt bg-color' v-if="status.class_status==3" @tap='confirmOrder'>确认收货</view>
|
||||
<view class='bnt cancel' v-if="status.type==4" @tap='delOrder'>删除订单</view>
|
||||
<view class='bnt bg-color' v-if="status.class_status==5" @tap='goOrderConfirm'>再次购买</view>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<!-- #ifdef MP -->
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- #endif -->
|
||||
<payment :payMode='payMode' :pay_close="pay_close" @onChangeFun='onChangeFun' :order_id="pay_order_id" :totalPrice='totalPrice'></payment>
|
||||
</view>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.goodCall {
|
||||
color: #e93323;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: 86rpx;
|
||||
padding: 0 30rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
font-size: 30rpx;
|
||||
line-height: 86rpx;
|
||||
background: #fff;
|
||||
|
||||
.icon-kefu {
|
||||
font-size: 36rpx;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
/* #ifdef MP */
|
||||
button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 86rpx;
|
||||
font-size: 30rpx;
|
||||
color: #e93323;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.order-details .header {
|
||||
padding: 0 30rpx;
|
||||
height: 150rpx;
|
||||
}
|
||||
|
||||
.order-details .header.on {
|
||||
background-color: #666 !important;
|
||||
}
|
||||
|
||||
.order-details .header .pictrue {
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
}
|
||||
|
||||
.order-details .header .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.order-details .header .data {
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
font-size: 24rpx;
|
||||
margin-left: 27rpx;
|
||||
}
|
||||
|
||||
.order-details .header .data.on {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.order-details .header .data .state {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
margin-bottom: 7rpx;
|
||||
}
|
||||
|
||||
.order-details .header .data .time {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.order-details .nav {
|
||||
background-color: #fff;
|
||||
font-size: 26rpx;
|
||||
color: #282828;
|
||||
padding: 25rpx 0;
|
||||
}
|
||||
|
||||
.order-details .nav .navCon {
|
||||
padding: 0 40rpx;
|
||||
}
|
||||
|
||||
.order-details .nav .on {
|
||||
color: #e93323;
|
||||
}
|
||||
|
||||
.order-details .nav .progress {
|
||||
padding: 0 65rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.order-details .nav .progress .line {
|
||||
width: 100rpx;
|
||||
height: 2rpx;
|
||||
background-color: #939390;
|
||||
}
|
||||
|
||||
.order-details .nav .progress .iconfont {
|
||||
font-size: 25rpx;
|
||||
color: #939390;
|
||||
margin-top: -2rpx;
|
||||
}
|
||||
|
||||
.order-details .address {
|
||||
font-size: 26rpx;
|
||||
color: #868686;
|
||||
background-color: #fff;
|
||||
margin-top: 13rpx;
|
||||
padding: 35rpx 30rpx;
|
||||
}
|
||||
|
||||
.order-details .address .name {
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.order-details .address .name .phone {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
|
||||
.order-details .line {
|
||||
width: 100%;
|
||||
height: 3rpx;
|
||||
}
|
||||
|
||||
.order-details .line image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.order-details .wrapper {
|
||||
background-color: #fff;
|
||||
margin-top: 12rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item~.item {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item .conter {
|
||||
color: #868686;
|
||||
width: 460rpx;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.order-details .wrapper .item .conter .copy {
|
||||
font-size: 20rpx;
|
||||
color: #333;
|
||||
border-radius: 3rpx;
|
||||
border: 1rpx solid #666;
|
||||
padding: 3rpx 15rpx;
|
||||
margin-left: 24rpx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .actualPay {
|
||||
border-top: 1rpx solid #eee;
|
||||
margin-top: 30rpx;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
.order-details .wrapper .actualPay .money {
|
||||
font-weight: bold;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.order-details .footer {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: #fff;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt {
|
||||
width: 176rpx;
|
||||
height: 60rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
border-radius: 50rpx;
|
||||
color: #fff;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt.cancel {
|
||||
color: #aaa;
|
||||
border: 1rpx solid #ddd;
|
||||
}
|
||||
|
||||
.order-details .footer .bnt~.bnt {
|
||||
margin-left: 18rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff {
|
||||
background-color: #fff;
|
||||
margin-top: 13rpx;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .title {
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
height: 87rpx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 30rpx;
|
||||
line-height: 87rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .grayBg {
|
||||
background-color: #f2f5f7;
|
||||
width: 590rpx;
|
||||
height: 384rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
margin: 50rpx auto 0 auto;
|
||||
padding-top: 55rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .grayBg .pictrue {
|
||||
width: 290rpx;
|
||||
height: 290rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.order-details .writeOff .grayBg .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.order-details .writeOff .gear {
|
||||
width: 590rpx;
|
||||
height: 30rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.order-details .writeOff .gear image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.order-details .writeOff .num {
|
||||
background-color: #f0c34c;
|
||||
width: 590rpx;
|
||||
height: 84rpx;
|
||||
color: #282828;
|
||||
font-size: 48rpx;
|
||||
margin: 0 auto;
|
||||
border-radius: 0 0 20rpx 20rpx;
|
||||
text-align: center;
|
||||
padding-top: 4rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .rules {
|
||||
margin: 46rpx 30rpx 0 30rpx;
|
||||
border-top: 1px solid #f0f0f0;
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .rules .item {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .rules .item .rulesTitle {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.order-details .writeOff .rules .item .rulesTitle .iconfont {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
margin-right: 8rpx;
|
||||
margin-top: 5rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .rules .item .info {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
margin-top: 7rpx;
|
||||
}
|
||||
|
||||
.order-details .writeOff .rules .item .info .time {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.order-details .map {
|
||||
height: 86rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
line-height: 86rpx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
margin-top: 13rpx;
|
||||
background-color: #fff;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.order-details .map .place {
|
||||
font-size: 26rpx;
|
||||
width: 176rpx;
|
||||
height: 50rpx;
|
||||
border-radius: 25rpx;
|
||||
line-height: 50rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.order-details .map .place .iconfont {
|
||||
font-size: 27rpx;
|
||||
height: 27rpx;
|
||||
line-height: 27rpx;
|
||||
margin: 2rpx 3rpx 0 0;
|
||||
}
|
||||
|
||||
.order-details .address .name .iconfont {
|
||||
font-size: 34rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.refund {
|
||||
padding: 0 30rpx 30rpx;
|
||||
margin-top: 24rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
height: 86rpx;
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.con {
|
||||
padding-top: 25rpx;
|
||||
font-size: 28rpx;
|
||||
color: #868686;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getOrderDetail,
|
||||
orderAgain,
|
||||
orderTake,
|
||||
orderDel,
|
||||
orderCancel
|
||||
} from '@/api/order.js';
|
||||
import {
|
||||
openOrderRefundSubscribe
|
||||
} from '@/utils/SubscribeMessage.js';
|
||||
import {
|
||||
getUserInfo
|
||||
} from '@/api/user.js';
|
||||
import home from '@/components/home';
|
||||
import payment from '@/components/payment';
|
||||
import orderGoods from "@/components/orderGoods";
|
||||
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
|
||||
import {
|
||||
toLogin
|
||||
} from '@/libs/login.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
// #ifdef MP
|
||||
import authorize from '@/components/Authorize';
|
||||
// #endif
|
||||
export default {
|
||||
components: {
|
||||
payment,
|
||||
home,
|
||||
orderGoods,
|
||||
// #ifdef MP
|
||||
authorize
|
||||
// #endif
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
order_id: '',
|
||||
evaluate: 0,
|
||||
cartInfo: [], //购物车产品
|
||||
orderInfo: {
|
||||
systemStore: {},
|
||||
pstatus: {}
|
||||
}, //订单详情
|
||||
system_store: {},
|
||||
isGoodsReturn: false, //是否为退款订单
|
||||
status: {}, //订单底部按钮状态
|
||||
isClose: false,
|
||||
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, //是否隐藏授权
|
||||
id: 0,//订单id
|
||||
uniId:''
|
||||
};
|
||||
},
|
||||
computed: mapGetters(['isLogin']),
|
||||
onLoad: function(options) {
|
||||
if (!options.order_id && !options.uniId) return this.$util.Tips({title:'缺少参数'},{tab:3,url:1});
|
||||
this.$set(this, 'order_id', options.order_id);
|
||||
},
|
||||
onShow() {
|
||||
if (this.isLogin) {
|
||||
this.getOrderInfo();
|
||||
this.getUserInfo();
|
||||
} else {
|
||||
// #ifdef H5 || APP-PLUS
|
||||
toLogin();
|
||||
// #endif
|
||||
// #ifdef MP
|
||||
this.isAuto = true;
|
||||
this.$set(this, 'isShowAuth', true);
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
onHide: function() {
|
||||
this.isClose = true;
|
||||
},
|
||||
onReady: function() {
|
||||
// #ifdef H5
|
||||
this.$nextTick(function() {
|
||||
const clipboard = new ClipboardJS(".copy-data");
|
||||
clipboard.on("success", () => {
|
||||
this.$util.Tips({
|
||||
title: '复制成功'
|
||||
});
|
||||
});
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
methods: {
|
||||
kefuClick(){
|
||||
return this.$util.Tips({
|
||||
title: '客服功能正在开发中......'
|
||||
});
|
||||
},
|
||||
goGoodCall() {
|
||||
let self = this
|
||||
uni.navigateTo({
|
||||
url: `/pages/customer_list/index?orderId=${self.order_id}`
|
||||
})
|
||||
},
|
||||
openSubcribe: function(e) {
|
||||
let page = e;
|
||||
uni.showLoading({
|
||||
title: '正在加载',
|
||||
})
|
||||
openOrderRefundSubscribe().then(res => {
|
||||
uni.hideLoading();
|
||||
uni.navigateTo({
|
||||
url: page,
|
||||
});
|
||||
}).catch(() => {
|
||||
uni.hideLoading();
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 事件回调
|
||||
*
|
||||
*/
|
||||
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);
|
||||
},
|
||||
/**
|
||||
* 拨打电话
|
||||
*/
|
||||
makePhone: function() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: this.system_store.phone
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 打开地图
|
||||
*
|
||||
*/
|
||||
showMaoLocation: function() {
|
||||
if (!this.system_store.latitude || !this.system_store.longitude) return this.$util.Tips({
|
||||
title: '缺少经纬度信息无法查看地图！'
|
||||
});
|
||||
uni.openLocation({
|
||||
latitude: parseFloat(this.system_store.latitude),
|
||||
longitude: parseFloat(this.system_store.longitude),
|
||||
scale: 8,
|
||||
name: this.system_store.name,
|
||||
address: this.system_store.address + this.system_store.detailedAddress,
|
||||
success: function() {
|
||||
|
||||
},
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 关闭支付组件
|
||||
*
|
||||
*/
|
||||
payClose: function() {
|
||||
this.pay_close = false;
|
||||
},
|
||||
/**
|
||||
* 打开支付组件
|
||||
*
|
||||
*/
|
||||
pay_open: function() {
|
||||
this.pay_close = true;
|
||||
this.pay_order_id = this.orderInfo.orderId;
|
||||
this.totalPrice = this.orderInfo.payPrice;
|
||||
},
|
||||
/**
|
||||
* 支付成功回调
|
||||
*
|
||||
*/
|
||||
pay_complete: function() {
|
||||
this.pay_close = false;
|
||||
this.pay_order_id = '';
|
||||
this.getOrderInfo();
|
||||
},
|
||||
/**
|
||||
* 支付失败回调
|
||||
*
|
||||
*/
|
||||
pay_fail: function() {
|
||||
this.pay_close = false;
|
||||
this.pay_order_id = '';
|
||||
},
|
||||
/**
|
||||
* 登录授权回调
|
||||
*
|
||||
*/
|
||||
onLoadFun: function() {
|
||||
this.getOrderInfo();
|
||||
this.getUserInfo();
|
||||
},
|
||||
/**
|
||||
* 获取用户信息
|
||||
*
|
||||
*/
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUserInfo().then(res => {
|
||||
that.payMode[1].number = res.data.nowMoney;
|
||||
that.$set(that, 'payMode', that.payMode);
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 获取订单详细信息
|
||||
*
|
||||
*/
|
||||
getOrderInfo: function() {
|
||||
let that = this;
|
||||
uni.showLoading({
|
||||
title: "正在加载中"
|
||||
});
|
||||
getOrderDetail(that.order_id).then(res => {
|
||||
uni.hideLoading();
|
||||
let _type = res.data.pstatus.type;
|
||||
that.$set(that, 'orderInfo', res.data);
|
||||
that.$set(that, 'evaluate', _type == 3 ? 3 : 0);
|
||||
that.$set(that, 'system_store', res.data.systemStore);
|
||||
that.$set(that, 'id', res.data.id);
|
||||
let cartInfo = res.data.cartInfo,newCartInfo = [];
|
||||
cartInfo.forEach((item,index)=>{
|
||||
newCartInfo.push(item.info);
|
||||
});
|
||||
that.$set(that, 'cartInfo', newCartInfo);
|
||||
if (res.data.refundStatus != 0) {
|
||||
that.isGoodsReturn = true;
|
||||
};
|
||||
that.getOrderStatus();
|
||||
}).catch(err => {
|
||||
uni.hideLoading();
|
||||
that.$util.Tips({
|
||||
title: err
|
||||
}, '/pages/users/order_list/index');
|
||||
});
|
||||
},
|
||||
/**
|
||||
*
|
||||
* 剪切订单号
|
||||
*/
|
||||
// #ifndef H5
|
||||
copy: function() {
|
||||
let that = this;
|
||||
uni.setClipboardData({
|
||||
data: this.orderInfo.order_id
|
||||
});
|
||||
},
|
||||
// #endif
|
||||
/**
|
||||
* 打电话
|
||||
*/
|
||||
goTel: function() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: this.orderInfo.deliveryId
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 设置底部按钮
|
||||
*
|
||||
*/
|
||||
getOrderStatus: function() {
|
||||
let orderInfo = this.orderInfo || {},
|
||||
_status = orderInfo.pstatus || {
|
||||
type: 0
|
||||
},
|
||||
status = {};
|
||||
let type = parseInt(_status.type),
|
||||
delivery_type = orderInfo.deliveryType,
|
||||
seckill_id = orderInfo.seckillId ? parseInt(orderInfo.seckillId) : 0,
|
||||
bargain_id = orderInfo.bargainId ? parseInt(orderInfo.bargainId) : 0,
|
||||
combination_id = orderInfo.combinationId ? parseInt(orderInfo.combinationId) : 0;
|
||||
status = {
|
||||
type: type == 9 ? -9 : type,
|
||||
class_status: 0
|
||||
};
|
||||
if (type == 1 && combination_id > 0) status.class_status = 1; //查看拼团
|
||||
if (type == 2 && delivery_type == 'express') status.class_status = 2; //查看物流
|
||||
if (type == 2) status.class_status = 3; //确认收货
|
||||
if (type == 4 || type == 0) status.class_status = 4; //删除订单
|
||||
if (!seckill_id && !bargain_id && !combination_id && (type == 3 || type == 4)) status.class_status = 5; //再次购买
|
||||
this.$set(this, 'status', status);
|
||||
},
|
||||
/**
|
||||
* 去拼团详情
|
||||
*
|
||||
*/
|
||||
goJoinPink: function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/goods_combination_status/index?id=' + this.orderInfo.pinkId,
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 再此购买
|
||||
*
|
||||
*/
|
||||
goOrderConfirm: function() {
|
||||
let that = this;
|
||||
orderAgain(that.orderInfo.unique).then(res => {
|
||||
return uni.navigateTo({
|
||||
url: '/pages/users/order_confirm/index?cartId=' + res.data.cateId + '&again=true&new=true'
|
||||
});
|
||||
});
|
||||
},
|
||||
confirmOrder: function() {
|
||||
let that = this;
|
||||
uni.showModal({
|
||||
title: '确认收货',
|
||||
content: '为保障权益，请收到货确认无误后，再确认收货',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
orderTake(that.id).then(res => {
|
||||
return that.$util.Tips({
|
||||
title: '操作成功',
|
||||
icon: 'success'
|
||||
}, function() {
|
||||
that.getOrderInfo();
|
||||
});
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
*
|
||||
* 删除订单
|
||||
*/
|
||||
delOrder: function() {
|
||||
let that = this;
|
||||
orderDel(this.order_id).then(res => {
|
||||
return that.$util.Tips({
|
||||
title: '删除成功',
|
||||
icon: 'success'
|
||||
}, {
|
||||
tab: 3,
|
||||
url: 1
|
||||
});
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
});
|
||||
},
|
||||
cancelOrder() {
|
||||
let self = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认取消该订单?',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
orderCancel(self.orderInfo.id)
|
||||
.then((data) => {
|
||||
self.$util.Tips({
|
||||
title: '删除成功'
|
||||
}, {
|
||||
tab: 3
|
||||
})
|
||||
})
|
||||
.catch(() => {
|
||||
self.getDetail();
|
||||
});
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.qs-btn {
|
||||
width: auto;
|
||||
height: 60rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
border-radius: 50rpx;
|
||||
color: #fff;
|
||||
font-size: 27rpx;
|
||||
padding: 0 3%;
|
||||
color: #aaa;
|
||||
border: 1px solid #ddd;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
</style>
|
||||
245
app/pages/order_pay_status/index.vue
Normal file
245
app/pages/order_pay_status/index.vue
Normal file
@@ -0,0 +1,245 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class='payment-status'>
|
||||
<!--失败时： 用icon-iconfontguanbi fail替换icon-duihao2 bg-color-->
|
||||
<view class='iconfont icon-duihao2 bg-color' v-if="order_pay_info.paid || order_pay_info.payType == 'offline'"></view>
|
||||
<view class='iconfont icon-iconfontguanbi bg-color' v-else></view>
|
||||
<!-- 失败时：订单支付失败 -->
|
||||
<view class='status' v-if="order_pay_info.payType != 'offline'">{{order_pay_info.paid ? '订单支付成功':'订单支付失败'}}</view>
|
||||
<view class='status' v-else>订单创建成功</view>
|
||||
<view class='wrapper'>
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view>订单编号</view>
|
||||
<view class='itemCom'>{{order_pay_info.orderId}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view>下单时间</view>
|
||||
<view class='itemCom'>{{order_pay_info.payTime}}</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view>支付方式</view>
|
||||
<view class='itemCom' v-if="order_pay_info.payType=='weixin'">微信支付</view>
|
||||
<view class='itemCom' v-else-if="order_pay_info.payType=='yue'">余额支付</view>
|
||||
<view class='itemCom' v-else-if="order_pay_info.payType=='offline'">线下支付</view>
|
||||
<view class='itemCom' v-else-if="order_pay_info.payType=='alipay'">支付宝支付</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view>支付金额</view>
|
||||
<view class='itemCom'>{{order_pay_info.payPrice}}</view>
|
||||
</view>
|
||||
<!--失败时加上这个 -->
|
||||
<view class='item acea-row row-between-wrapper' v-if="order_pay_info.paid==0 && order_pay_info.payType != 'offline'">
|
||||
<view>失败原因</view>
|
||||
<view class='itemCom'>{{status==2 ? '取消支付':msg}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--失败时： 重新购买 -->
|
||||
<view @tap="goOrderDetails" v-if="status==0">
|
||||
<button formType="submit" class='returnBnt bg-color' hover-class='none'>查看订单</button>
|
||||
</view>
|
||||
<view @tap="goOrderDetails" v-if="order_pay_info.paid==0 && status==1">
|
||||
<button class='returnBnt bg-color' hover-class='none'>重新购买</button>
|
||||
</view>
|
||||
<view @tap="goOrderDetails" v-if="order_pay_info.paid==0 && status==2">
|
||||
<button class='returnBnt bg-color' hover-class='none'>重新支付</button>
|
||||
</view>
|
||||
<button @click="goPink(order_pay_info.pinkId)" class='returnBnt cart-color' formType="submit" hover-class='none' v-if="order_pay_info.pinkId && order_pay_info.paid!=0 && status!=2 && status!=1">邀请好友参团</button>
|
||||
<button @click="goIndex" class='returnBnt cart-color' formType="submit" hover-class='none' v-else>返回首页</button>
|
||||
</view>
|
||||
<!-- #ifdef MP -->
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getOrderDetail
|
||||
} from '@/api/order.js';
|
||||
import {
|
||||
openOrderSubscribe
|
||||
} from '@/utils/SubscribeMessage.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 {
|
||||
orderId: '',
|
||||
order_pay_info: {
|
||||
paid: 1,
|
||||
_status: {}
|
||||
},
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false ,//是否隐藏授权
|
||||
status:0,
|
||||
msg:''
|
||||
};
|
||||
},
|
||||
computed: mapGetters(['isLogin']),
|
||||
onLoad: function(options) {
|
||||
if (!options.order_id) return this.$util.Tips({
|
||||
title: '缺少参数无法查看订单支付状态'
|
||||
}, {
|
||||
tab: 3,
|
||||
url: 1
|
||||
});
|
||||
this.orderId = options.order_id;
|
||||
this.status = options.status || 0;
|
||||
this.msg = options.msg || '';
|
||||
if (this.isLogin) {
|
||||
this.getOrderPayInfo();
|
||||
} else {
|
||||
// #ifdef H5 || APP-PLUS
|
||||
toLogin();
|
||||
// #endif
|
||||
// #ifdef MP
|
||||
this.isAuto = true;
|
||||
this.$set(this, 'isShowAuth', true);
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onLoadFun: function() {
|
||||
this.getOrderPayInfo();
|
||||
},
|
||||
/**
|
||||
*
|
||||
* 支付完成查询支付状态
|
||||
*
|
||||
*/
|
||||
getOrderPayInfo: function() {
|
||||
let that = this;
|
||||
uni.showLoading({
|
||||
title: '正在加载中'
|
||||
});
|
||||
getOrderDetail(that.orderId).then(res => {
|
||||
uni.hideLoading();
|
||||
that.$set(that, 'order_pay_info', res.data);
|
||||
uni.setNavigationBarTitle({
|
||||
title: res.data.paid ? '支付成功' : '支付失败'
|
||||
});
|
||||
}).catch(err => {
|
||||
uni.hideLoading();
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 去首页关闭当前所有页面
|
||||
*/
|
||||
goIndex: function(e) {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
},
|
||||
// 去参团页面；
|
||||
goPink:function(id){
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/goods_combination_status/index?id='+id
|
||||
});
|
||||
},
|
||||
/**
|
||||
*
|
||||
* 去订单详情页面
|
||||
*/
|
||||
goOrderDetails: function(e) {
|
||||
let that = this;
|
||||
// #ifdef MP
|
||||
uni.showLoading({
|
||||
title: '正在加载',
|
||||
})
|
||||
openOrderSubscribe().then(res => {
|
||||
uni.hideLoading();
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_details/index?order_id=' + that.orderId
|
||||
});
|
||||
}).catch(() => {
|
||||
nui.hideLoading();
|
||||
});
|
||||
// #endif
|
||||
// #ifndef MP
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_details/index?order_id=' + that.orderId
|
||||
})
|
||||
// #endif
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.payment-status {
|
||||
background-color: #fff;
|
||||
margin: 195rpx 30rpx 0 30rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 1rpx 0 28rpx 0;
|
||||
}
|
||||
|
||||
.payment-status .iconfont {
|
||||
font-size: 70rpx;
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 140rpx;
|
||||
text-shadow: 0px 4px 0px #df1e14;
|
||||
border: 6rpx solid #f5f5f5;
|
||||
margin: -76rpx auto 0 auto;
|
||||
background-color: #999;
|
||||
}
|
||||
|
||||
.payment-status .iconfont.fail {
|
||||
text-shadow: 0px 4px 0px #7a7a7a;
|
||||
}
|
||||
|
||||
.payment-status .status {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin: 25rpx 0 37rpx 0;
|
||||
}
|
||||
|
||||
.payment-status .wrapper {
|
||||
border: 1rpx solid #eee;
|
||||
margin: 0 30rpx 47rpx 30rpx;
|
||||
padding: 35rpx 0;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.payment-status .wrapper .item {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
|
||||
.payment-status .wrapper .item~.item {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.payment-status .wrapper .item .itemCom {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.payment-status .returnBnt {
|
||||
width: 630rpx;
|
||||
height: 86rpx;
|
||||
border-radius: 50rpx;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
text-align: center;
|
||||
line-height: 86rpx;
|
||||
margin: 0 auto 20rpx auto;
|
||||
}
|
||||
</style>
|
||||
8
app/pages/promotional_items/index.vue
Normal file
8
app/pages/promotional_items/index.vue
Normal file
@@ -0,0 +1,8 @@
|
||||
<template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
123
app/pages/retrieve_password/index.vue
Normal file
123
app/pages/retrieve_password/index.vue
Normal file
@@ -0,0 +1,123 @@
|
||||
<template>
|
||||
<view class="register absolute">
|
||||
<view class="shading">
|
||||
<view class="pictrue acea-row row-center-wrapper">
|
||||
<image src="/static/images/logo2.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="whiteBg">
|
||||
<view class="title">找回密码</view>
|
||||
<view class="list">
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
<image src="/static/images/phone_1.png"></image>
|
||||
<input type="text" placeholder="输入手机号码" placeholder-class="placeholder" v-model="account" class="input"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="align-left acea-row row-middle">
|
||||
<image src="/static/images/code_2.png"></image>
|
||||
<input type="text" placeholder="填写验证码" class="codeIput" v-model="captcha" placeholder-class="placeholder"/>
|
||||
<button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="code">
|
||||
{{ text }}
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
<image src="/static/images/code_1.png"></image>
|
||||
<input type="password" placeholder="填写您的登录密码" v-model="password" placeholder-class="placeholder" class="input"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="logon" @click="registerReset">确认</view>
|
||||
<navigator url="/pages/users/login/index" class="tip">
|
||||
<text class="font-color">立即登录</text>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="bottom"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import sendVerifyCode from "@/mixins/SendVerifyCode";
|
||||
import { registerVerify, registerReset } from "@/api/user";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
account: "",
|
||||
password: "",
|
||||
captcha: ""
|
||||
};
|
||||
},
|
||||
mixins: [sendVerifyCode],
|
||||
methods: {
|
||||
registerReset() {
|
||||
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: '您输入的密码过于简单'
|
||||
});
|
||||
registerReset({
|
||||
account: that.account,
|
||||
captcha: that.captcha,
|
||||
password: that.password
|
||||
})
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title: res.msg,
|
||||
success: () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/index'
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(res => {
|
||||
console.log(res);
|
||||
that.$util.Tips({
|
||||
title: res.msg
|
||||
});
|
||||
});
|
||||
},
|
||||
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: '请输入正确的手机号码'
|
||||
});
|
||||
registerVerify({ phone: that.account })
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title: res.msg
|
||||
});
|
||||
that.sendCode();
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
586
app/pages/user/index.vue
Normal file
586
app/pages/user/index.vue
Normal file
@@ -0,0 +1,586 @@
|
||||
<template>
|
||||
<view class="new-users">
|
||||
<view class="head">
|
||||
<view class="user-card">
|
||||
<view class="bg"></view>
|
||||
<view class="user-info">
|
||||
<image class="avatar" :src='userInfo.avatar' v-if="userInfo.avatar" @click="goEdit()"></image>
|
||||
<image v-else class="avatar" src="/static/images/f.png" mode="" @click="goEdit()"></image>
|
||||
<view class="info">
|
||||
<!-- #ifdef MP -->
|
||||
<view class="name" v-if="!userInfo.uid" @tap="openAuto">
|
||||
请点击授权
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="name" v-if="userInfo.uid">
|
||||
{{userInfo.nickname}}
|
||||
<view class="vip" v-if="userInfo.vip">
|
||||
<image :src="userInfo.vip_icon" alt="">
|
||||
<view style="margin-left: 10rpx;" class="vip-txt">{{userInfo.vip_name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="num" v-if="userInfo.phone" @click="goEdit()">
|
||||
<view class="num-txt">ID：{{userInfo.uid}}</view>
|
||||
<view class="icon">
|
||||
<image src="/static/images/edit.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="phone" v-if="!userInfo.phone && isLogin" @tap="bindPhone">绑定手机号</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="num-wrapper">
|
||||
<view class="num-item" @click="goMenuPage('/pages/users/user_money/index')">
|
||||
<text class="num">{{userInfo.nowMoney || 0}}</text>
|
||||
<view class="txt">余额</view>
|
||||
</view>
|
||||
<view class="num-item" @click="goMenuPage('/pages/users/user_integral/index')">
|
||||
<text class="num">{{userInfo.integral || 0}}</text>
|
||||
<view class="txt">积分</view>
|
||||
</view>
|
||||
<view class="num-item" @click="goMenuPage('/pages/users/user_coupon/index')">
|
||||
<text class="num">{{userInfo.couponCount || 0}}</text>
|
||||
<view class="txt">优惠券</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sign" @click="goSignIn">签到</view>
|
||||
</view>
|
||||
<view class="order-wrapper">
|
||||
<view class="order-hd flex">
|
||||
<view class="left">订单中心</view>
|
||||
<navigator class="right flex" hover-class="none" url="/pages/users/order_list/index" open-type="navigate">
|
||||
查看全部
|
||||
<text class="iconfont icon-xiangyou"></text>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="order-bd">
|
||||
<block v-for="(item,index) in orderMenu" :key="index">
|
||||
<navigator class="order-item" hover-class="none" :url="item.url">
|
||||
<view class="pic">
|
||||
<image :src="item.img" mode=""></image>
|
||||
<text class="order-status-num" v-if="item.num > 0">{{ item.num }}</text>
|
||||
</view>
|
||||
<view class="txt">{{item.title}}</view>
|
||||
</navigator>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 轮播 -->
|
||||
<view class="slider-wrapper" v-if="imgUrls.length>0">
|
||||
<swiper indicator-dots="true" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
|
||||
indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
|
||||
<block v-for="(item,index) in imgUrls" :key="index">
|
||||
<swiper-item>
|
||||
<navigator :url='item.url' class='slide-navigator acea-row row-between-wrapper' hover-class='none'>
|
||||
<image :src="item.pic" class="slide-image"></image>
|
||||
</navigator>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<!-- 会员菜单 -->
|
||||
<view class="user-menus" style="margin-top: 20rpx;">
|
||||
<block v-for="(item,index) in MyMenus" :key="index">
|
||||
<navigator class="item" :url="item.url" hover-class="none" v-if="!(item.url =='/pages/service/index' || (item.url =='/pages/users/user_spread_user/index' && !userInfo.isPromoter))">
|
||||
<view class="left">
|
||||
<image :src="item.pic"></image>
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</navigator>
|
||||
</block>
|
||||
<!-- #ifdef H5 -->
|
||||
<!-- <navigator class="item" url="/pages/customer_list/index" hover-class="none">
|
||||
<view class="left">
|
||||
<image src="/static/images/user_menu08.png"></image>
|
||||
<text>联系客服</text>
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</navigator> -->
|
||||
<view class="item" @click="kefuClick">
|
||||
<view class="left">
|
||||
<image src="/static/images/user_menu08.png"></image>
|
||||
<text>联系客服</text>
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<button class="item" open-type='contact' hover-class='none'>
|
||||
<view class="left">
|
||||
<image src="/static/images/user_menu08.png"></image>
|
||||
<text>联系客服</text>
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<view style="height: 50rpx;"></view>
|
||||
<!-- #ifdef MP -->
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getMenuList,
|
||||
getUserInfo
|
||||
// setVisit
|
||||
} from '@/api/user.js';
|
||||
import {
|
||||
orderData
|
||||
} from '@/api/order.js';
|
||||
import {
|
||||
toLogin
|
||||
} from '@/libs/login.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
// #ifdef MP
|
||||
import authorize from '@/components/Authorize';
|
||||
// #endif
|
||||
const app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
// #ifdef MP
|
||||
authorize
|
||||
// #endif
|
||||
},
|
||||
computed: mapGetters(['isLogin']),
|
||||
data() {
|
||||
return {
|
||||
orderMenu: [{
|
||||
img: '/static/images/order1.png',
|
||||
title: '待付款',
|
||||
url: '/pages/users/order_list/index?status=0',
|
||||
num: 0
|
||||
},
|
||||
{
|
||||
img: '/static/images/order2.png',
|
||||
title: '待发货',
|
||||
url: '/pages/users/order_list/index?status=1',
|
||||
num: 0
|
||||
},
|
||||
{
|
||||
img: '/static/images/order3.png',
|
||||
title: '待收货',
|
||||
url: '/pages/users/order_list/index?status=2',
|
||||
num: 0
|
||||
},
|
||||
{
|
||||
img: '/static/images/order4.png',
|
||||
title: '待评价',
|
||||
url: '/pages/users/order_list/index?status=3',
|
||||
num: 0
|
||||
},
|
||||
{
|
||||
img: '/static/images/order5.png',
|
||||
title: '售后/退款',
|
||||
url: '/pages/users/user_return_list/index',
|
||||
num: 0
|
||||
},
|
||||
],
|
||||
imgUrls: [],
|
||||
userMenu: [],
|
||||
autoplay: true,
|
||||
circular: true,
|
||||
interval: 3000,
|
||||
duration: 500,
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
orderStatusNum: {},
|
||||
userInfo: {},
|
||||
MyMenus: []
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let that = this;
|
||||
that.$set(that, 'MyMenus', app.globalData.MyMenus);
|
||||
},
|
||||
onShow: function() {
|
||||
let that = this;
|
||||
if (that.isLogin) {
|
||||
this.getUserInfo();
|
||||
this.getMyMenus();
|
||||
// this.setVisit();
|
||||
this.getOrderData();
|
||||
}else{
|
||||
// #ifdef H5 || APP-PLUS
|
||||
if (that.isLogin == false) {
|
||||
toLogin();
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 记录会员访问
|
||||
// setVisit(){
|
||||
// setVisit({
|
||||
// url:'/pages/user/index'
|
||||
// }).then(res=>{})
|
||||
// },
|
||||
kefuClick(){
|
||||
return this.$util.Tips({
|
||||
title: '客服功能正在开发中......'
|
||||
});
|
||||
},
|
||||
getOrderData(){
|
||||
let that = this;
|
||||
orderData().then(res=>{
|
||||
that.orderMenu.forEach((item, index) => {
|
||||
switch (item.title) {
|
||||
case '待付款':
|
||||
item.num = res.data.unPaidCount
|
||||
break
|
||||
case '待发货':
|
||||
item.num = res.data.unShippedCount
|
||||
break
|
||||
case '待收货':
|
||||
item.num = res.data.receivedCount
|
||||
break
|
||||
case '待评价':
|
||||
item.num = res.data.evaluatedCount
|
||||
break
|
||||
case '售后/退款':
|
||||
item.num = res.data.refundCount
|
||||
break
|
||||
}
|
||||
})
|
||||
that.$set(that,'orderMenu',that.orderMenu);
|
||||
})
|
||||
},
|
||||
// 打开授权
|
||||
openAuto() {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
},
|
||||
// 授权回调
|
||||
onLoadFun() {
|
||||
this.getUserInfo();
|
||||
this.getMyMenus();
|
||||
// this.setVisit();
|
||||
this.getOrderData();
|
||||
},
|
||||
Setting: function() {
|
||||
uni.openSetting({
|
||||
success: function(res) {
|
||||
console.log(res.authSetting)
|
||||
}
|
||||
});
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
// 绑定手机
|
||||
bindPhone() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/user_phone/index'
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 获取个人用户信息
|
||||
*/
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUserInfo().then(res => {
|
||||
that.userInfo = res.data;
|
||||
that.$store.commit("SETUID", res.data.uid);
|
||||
});
|
||||
},
|
||||
/**
|
||||
*
|
||||
* 获取个人中心图标
|
||||
*/
|
||||
getMyMenus: function() {
|
||||
let that = this;
|
||||
if (this.MyMenus.length) return;
|
||||
getMenuList().then(res => {
|
||||
that.$set(that, 'MyMenus', res.data.routine_my_menus);
|
||||
this.imgUrls = res.data.routine_my_banner
|
||||
});
|
||||
},
|
||||
// 编辑页面
|
||||
goEdit() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/user_info/index'
|
||||
})
|
||||
},
|
||||
// 签到
|
||||
goSignIn() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/user_sgin/index'
|
||||
})
|
||||
},
|
||||
// goMenuPage
|
||||
goMenuPage(url){
|
||||
if(this.isLogin){
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
}else{
|
||||
// #ifdef MP
|
||||
this.openAuto()
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.new-users {
|
||||
.head {
|
||||
padding-top: 30rpx;
|
||||
background: #fff;
|
||||
|
||||
.user-card {
|
||||
position: relative;
|
||||
width: 710rpx;
|
||||
height: 340rpx;
|
||||
margin: 0 auto;
|
||||
padding: 35rpx 28rpx;
|
||||
background: linear-gradient(90deg, $bg-star 0%, $bg-end 100%);
|
||||
box-shadow: 0px 10rpx 20rpx 0px rgba(255, 2, 0, 0.2);
|
||||
border-radius: 24rpx;
|
||||
|
||||
.bg {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('~@/static/images/user_bg.png');
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.user-info {
|
||||
z-index: 20;
|
||||
position: relative;
|
||||
display: flex;
|
||||
|
||||
.avatar {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-left: 20rpx;
|
||||
padding: 15rpx 0;
|
||||
|
||||
.name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
font-size: 31rpx;
|
||||
|
||||
.vip {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 36rpx;
|
||||
padding: 0 20rpx;
|
||||
background: rgba(0, 0, 0, 0.2);
|
||||
border-radius: 18px;
|
||||
font-size: 20rpx;
|
||||
margin-left: 12rpx;
|
||||
|
||||
image {
|
||||
width: 27rpx;
|
||||
height: 27rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.num {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
|
||||
image {
|
||||
width: 22rpx;
|
||||
height: 23rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.num-wrapper {
|
||||
z-index: 30;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 60rpx;
|
||||
// padding: 0 47rpx;
|
||||
color: #fff;
|
||||
|
||||
.num-item {
|
||||
width: 33.33%;
|
||||
text-align: center;
|
||||
|
||||
.num {
|
||||
font-size: 42rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.txt {
|
||||
margin-top: 8rpx;
|
||||
font-size: 26rpx;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sign {
|
||||
z-index: 200;
|
||||
position: absolute;
|
||||
right: -12rpx;
|
||||
top: 80rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 120rpx;
|
||||
height: 60rpx;
|
||||
background: linear-gradient(90deg, rgba(255, 225, 87, 1) 0%, rgba(238, 193, 15, 1) 100%);
|
||||
border-radius: 29rpx 4rpx 4rpx 29rpx;
|
||||
color: #282828;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.order-wrapper {
|
||||
.order-hd {
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx 28rpx;
|
||||
margin-top: 33rpx;
|
||||
border-bottom: 1px solid #F5F5F5;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
|
||||
.right {
|
||||
align-items: center;
|
||||
color: #666666;
|
||||
font-size: 26rpx;
|
||||
|
||||
.icon-xiangyou {
|
||||
margin-left: 5rpx;
|
||||
margin-top: 6rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-bd {
|
||||
display: flex;
|
||||
padding: 0 24rpx;
|
||||
.order-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 20%;
|
||||
height: 160rpx;
|
||||
|
||||
.pic {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
|
||||
image {
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.txt {
|
||||
margin-top: 15rpx;
|
||||
font-size: 26rpx;
|
||||
color: #454545;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.slider-wrapper {
|
||||
margin: 20rpx 0;
|
||||
height: 130rpx;
|
||||
|
||||
swiper,
|
||||
swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 130rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.user-menus {
|
||||
background-color: #fff;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 90rpx;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 46rpx;
|
||||
height: 46rpx;
|
||||
margin-right: 25rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 655rpx;
|
||||
height: 1px;
|
||||
background-color: #EEEEEE;
|
||||
}
|
||||
|
||||
&:last-child::before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
button{
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.phone {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.order-status-num {
|
||||
|
||||
min-width:12rpx;
|
||||
background-color: #fff;
|
||||
color: #ee5a52;
|
||||
border-radius: 15px;
|
||||
position: absolute;
|
||||
right:-14rpx;
|
||||
top: -15rpx;
|
||||
font-size: 20rpx;
|
||||
padding: 0 8rpx;
|
||||
border: 1px solid #ee5a52;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
234
app/pages/users/commission_rank/index.vue
Normal file
234
app/pages/users/commission_rank/index.vue
Normal file
File diff suppressed because one or more lines are too long
312
app/pages/users/goods_comment_con/index.vue
Normal file
312
app/pages/users/goods_comment_con/index.vue
Normal 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>
|
||||
137
app/pages/users/goods_comment_list/index.vue
Normal file
137
app/pages/users/goods_comment_list/index.vue
Normal 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>
|
||||
250
app/pages/users/goods_details_store/index.vue
Normal file
250
app/pages/users/goods_details_store/index.vue
Normal 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>
|
||||
279
app/pages/users/goods_logistics/index.vue
Normal file
279
app/pages/users/goods_logistics/index.vue
Normal 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>
|
||||
205
app/pages/users/goods_return/index.vue
Normal file
205
app/pages/users/goods_return/index.vue
Normal 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>
|
||||
372
app/pages/users/login/index.vue
Normal file
372
app/pages/users/login/index.vue
Normal 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>
|
||||
1147
app/pages/users/order_confirm/index.vue
Normal file
1147
app/pages/users/order_confirm/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
558
app/pages/users/order_list/index.vue
Normal file
558
app/pages/users/order_list/index.vue
Normal 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>
|
||||
352
app/pages/users/promoter-list/index.vue
Normal file
352
app/pages/users/promoter-list/index.vue
Normal 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>
|
||||
226
app/pages/users/promoter-order/index.vue
Normal file
226
app/pages/users/promoter-order/index.vue
Normal 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>
|
||||
313
app/pages/users/promoter_rank/index.vue
Normal file
313
app/pages/users/promoter_rank/index.vue
Normal file
File diff suppressed because one or more lines are too long
163
app/pages/users/retrievePassword/index.vue
Normal file
163
app/pages/users/retrievePassword/index.vue
Normal 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>
|
||||
BIN
app/pages/users/static/vip.png
Normal file
BIN
app/pages/users/static/vip.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 725 B |
BIN
app/pages/users/static/vip01.png
Normal file
BIN
app/pages/users/static/vip01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.0 KiB |
BIN
app/pages/users/static/vip02.png
Normal file
BIN
app/pages/users/static/vip02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
BIN
app/pages/users/static/vip03.png
Normal file
BIN
app/pages/users/static/vip03.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
BIN
app/pages/users/static/vip04.png
Normal file
BIN
app/pages/users/static/vip04.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
BIN
app/pages/users/static/vip05.png
Normal file
BIN
app/pages/users/static/vip05.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
533
app/pages/users/user_address/index.vue
Normal file
533
app/pages/users/user_address/index.vue
Normal 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>
|
||||
537
app/pages/users/user_address/index001.vue
Normal file
537
app/pages/users/user_address/index001.vue
Normal 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>
|
||||
463
app/pages/users/user_address_list/index.vue
Normal file
463
app/pages/users/user_address_list/index.vue
Normal 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>
|
||||
173
app/pages/users/user_bill/index.vue
Normal file
173
app/pages/users/user_bill/index.vue
Normal 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>
|
||||
362
app/pages/users/user_cash/index.vue
Normal file
362
app/pages/users/user_cash/index.vue
Normal 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>
|
||||
135
app/pages/users/user_coupon/index.vue
Normal file
135
app/pages/users/user_coupon/index.vue
Normal 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>
|
||||
160
app/pages/users/user_get_coupon/index.vue
Normal file
160
app/pages/users/user_get_coupon/index.vue
Normal 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>
|
||||
232
app/pages/users/user_goods_collection/index.vue
Normal file
232
app/pages/users/user_goods_collection/index.vue
Normal 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>
|
||||
383
app/pages/users/user_info/index.vue
Normal file
383
app/pages/users/user_info/index.vue
Normal 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/Pn3rJMAAAArUSURBVHja7N3NXuLIGsDhqigK2Ou+grmEuf/t2fT+bOYKZn9aW5Q6qaQSIoKfoCQ8z29QRBSBzX+q31RiSikAAMDYVF4CAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQBAyAIAIGQBAEDIAgCAkAUAQMgCAMAJuPQSAABMy79///XaXfJi5qy0YFUuqVzW9eWhvqzK9b1+/vpHyAIAcMjCqxs1tldj/zHl/6oU4rz+ctY2a3tzjO2n0F6tUqobMYZ5fX1V337XBm0MMbX3SuXnvv1peqcBAKYlXl+VSI2lZJuIzSuwi7pUY3/HFPsijYMPcVOps9hG7W19fRVT+50YT6TXvdUAABML2at5V6rdTdfNSmzXquX2FOKTr7trsVvBjeVOISzLyuyfNnNTOIWWFbIAAFNzfd2umjYrsmlWR+i8KuusXbhurudZgTZpU6w/p82Ka0oldJvb47z+cp3HDU5kQVbIAgBMTVwsmzitr1V1ni5C07Pd5EAXtCVlm3BNTfS27dvGbAiDcYPUr9TWvys91jetT2BEVsgCAEwuZOeLJkDr/+Z5sbXdb7UdCIixb9M2WDdjss2n4X274YN2LraJ3fzjeUTh9yk8TyELADC1kM0rsjHVTRpnTYam2I8LNBOuaRO0TbaWbQhidyRYKveLmz0P+vu223ZV8ZWtuYQsAADvD9nlTTMb23/dxelg9TUM4nSzRLvZsSANf274u9uvZnXm/hGyAAAcVHWzzKusl5uDtvq9YtvvpzZJmwGC+GS1tR83iHuGYMuPXtbfF7IAABxWXP7IyVkNT4awGQ/Y7FswHBkIW9e7W1Kfv0/GDKpTeJ5CFgBgapbLPAJQxX5X2DIuEPsdYtsSTak/nKv5Xir7GQxWZNvvlZGC/pReUcgCAHB41c2PnbfHrc+v3bbv61MhZAEAJibmkE1pXRdo9SRDuxXVuJWp3XBsGYDdfL9frx38jub767LVgZAFAOCAIdvsWpBjs5tlHZx4tvmQNhsVdH1bAjYO9pTtrlX9cEJvfQrPU8gCAExMdXOTPz3knQvCk/1iU4iDhO3HCuKT8yK0v6P/mfL9wTFf9W0PpzBvIGQBACYmLm7yOMCqDtB5f6hXak94UFo0lPMklO22ykFfg71mNyu3/ZkUNltz1b+7vYOQBQDgkCG7vMmxmWdkVyGfiWvH3rD9yWeb22O/KVdfuqVy29HZOBwuWKVmbEHIAgBw6JBdLMqKaryLMV3GwRFcqRykVXWt2g0V9KfyimV7rsEEbTkILLbDCXftqIGDvQAAOLTFsjtxwbrOzds6PJcpPT8pQnctlV6N/XlsBwd9lZXcsp/sbZXiuszJClkAAA4rzuclUpsl11UdoXcxxXm709Zg7rUp1fJ13KzKDnbfGhwQFu/qr1fdoGwUsgAAHD5kF32JlhD9E5ots+KiCv0JvAZzr3GzPUGJ235lNo8TpHjbBnF373QSz1PIAgBMLWSvrtoQTf3ga5YP0nqsP89jPgCs7dz2Q4xhu03T5mfuYnNyhTjYzSAE228BALDXv3//9aGf+/mf/5ai3Zy0q4wOrGOIv1NoznEwq0P3sv66yl+XLs0ztfV9wkOO2NieVKFP29SeKqyP2I/+fUIWAIDdZrP+6nDhdDMa0JyZ60+57LvPM9+0CJsfttq6NMetCVkAgIn57pXST0Zr7tOLEqzd552ELAAA3x2u3aV6zw8LWQAAvlKO1Vm5XHzmFwlZAABGE69CFgDgDb5z1vTnr3+m8BLmcL06VnMKWQCAwzRVt9rYHVWf5c2r8g4Bef/WVWi3tZq6WF6L6/DOmVchCwDwdcGWY+0q7N+ZKpa4vSj3y2F7H9ptr9IZvh5CFgDgm+UVx8UHgm0Ye7ehXaUVsEIWAOBLLEq0fTb+lqFdnb0d8WtxXS7fcq4EIQsA8HY5Pmc7bs9jAt0MbJ6HXZe460YLuhna7eDrVjF/j+x1yM9lHo48AytkAQAOY7EnYu9Cu7KadsRtd7DXqtzvqgTgdhTm3z2Gldmq/K0n0ZBCFgDgdd02UkM5UPNK6uMbf0eO2nyQV161XYanq5lX5fZTnpn91jGCfVUNAMB+OdwWOyL2f++I2KHH8rPrrds/cvDYV/XiTWhXkuOp/WEAAOy3axXy944QfY9uNXc7mK9P7Lnnlegf4UT/FV/IAgC8bHukII8HPB7g9z6W3/XSY32nvEK8DKe5SixkAQBecbkVcmlHfH7G9okRYvj+1c/chz9OLKqFLADAO23vUrAKhz0jV7dt10uP+dXhniP2YgxvjpAFANhvO+gejvAYD6885lfJK7D5oK44ljfH9lsAAPttL/o9HuExHl95zK+QdyS4HtubI2QBAPbbXp1cH+Ex1q885rEd4pS7J/F/GQAAvD1sx260EStkAQBelr4gZKtXHvNYlmOOWCELAPCy7X/2P8aBWBevPOYx5JXY2djfHCELALDf9oFYxzi+6PKVxzxGxF5N4c0RsgAA++3a4/WQ4wUxPF8ZfTji85lPJWKFLADAy3JUbp9565DbVF2H52cOWx3puczCCLfYErIAAB93vyM+DzEre7EjLO+P9Bzy+MJyam+MkAUAeNmf8HwngeUnO6raEZapPNYxem85xTdGyAIAvCwH5u2Ohsqnc/3IyuxF+dntDrsNh996K5aIjVN8Y4QsAMDr8tzq/Y6O+hHaA6jeEoqx3PfHjga7D8eZjZ2H42wZdhKcohYA4G1uw+5dBvKc61UJ0XxZh81esFW5zML+HQ9W4fmK7yHMwoR2KBCyAACf8zvs3oc1ltveG473R4rYqvydkyZkAQDeJ4fnQwnFj86ednO3x9pq6zN/m5AFAJiwVYnZbqzgrdGYAzavwu7aCeFQrs6l8YQsAMDH5BC9K5fcVHkmNR9YVQ3CNt8nz8s+DuL3mPJjz8/lDRCyAACf9/AFkfoWZzFSIGQBAF7x89c/Y/pzZ+fWdvaRBQCYhvm5PWEhCwAwftfn2HVCFgBg3GIJ2bMjZAEAxu06nNEBXkIWAGAaujOKnSUhCwAwXme7GitkAQDG66xXY2tJyAIAjNMsnPFqbG0tZAEAxun6zJ+/kAUAGKF8Bq9z77hHIQsAMD5XXoLwIGQBAMYlz8XOzvw1WAcrsgAAo2M1NoRV/iBkAQDGZeYlCPdCFgBgXHK7XYjYZrRAyAIAjMi5r8am+nI3rHoAAITsGNyWmBWyAAAjkncrOOexgjxSsBreIGQBAMbh8oyfew7Y2+0bhSwAgJA9ZQ+7Ivbcyx4AQMietvt9EStkAQDGIc/HntO/pKcSsCtlDwAwbufUbHkV9i4MdifwogAAjNfUdyvIJzhYhcHJDtQ9AMA0TGmsIJVYzZfH0B7M9fiRX/R/AQYA1i4UF+HkevkAAAAASUVORK5CYII=");
|
||||
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>
|
||||
475
app/pages/users/user_info/index001.vue
Normal file
475
app/pages/users/user_info/index001.vue
Normal 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/Pn3rJMAAAArUSURBVHja7N3NXuLIGsDhqigK2Ou+grmEuf/t2fT+bOYKZn9aW5Q6qaQSIoKfoCQ8z29QRBSBzX+q31RiSikAAMDYVF4CAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQBAyAIAIGQBAEDIAgCAkAUAQMgCAMAJuPQSAABMy79///XaXfJi5qy0YFUuqVzW9eWhvqzK9b1+/vpHyAIAcMjCqxs1tldj/zHl/6oU4rz+ctY2a3tzjO2n0F6tUqobMYZ5fX1V337XBm0MMbX3SuXnvv1peqcBAKYlXl+VSI2lZJuIzSuwi7pUY3/HFPsijYMPcVOps9hG7W19fRVT+50YT6TXvdUAABML2at5V6rdTdfNSmzXquX2FOKTr7trsVvBjeVOISzLyuyfNnNTOIWWFbIAAFNzfd2umjYrsmlWR+i8KuusXbhurudZgTZpU6w/p82Ka0oldJvb47z+cp3HDU5kQVbIAgBMTVwsmzitr1V1ni5C07Pd5EAXtCVlm3BNTfS27dvGbAiDcYPUr9TWvys91jetT2BEVsgCAEwuZOeLJkDr/+Z5sbXdb7UdCIixb9M2WDdjss2n4X274YN2LraJ3fzjeUTh9yk8TyELADC1kM0rsjHVTRpnTYam2I8LNBOuaRO0TbaWbQhidyRYKveLmz0P+vu223ZV8ZWtuYQsAADvD9nlTTMb23/dxelg9TUM4nSzRLvZsSANf274u9uvZnXm/hGyAAAcVHWzzKusl5uDtvq9YtvvpzZJmwGC+GS1tR83iHuGYMuPXtbfF7IAABxWXP7IyVkNT4awGQ/Y7FswHBkIW9e7W1Kfv0/GDKpTeJ5CFgBgapbLPAJQxX5X2DIuEPsdYtsSTak/nKv5Xir7GQxWZNvvlZGC/pReUcgCAHB41c2PnbfHrc+v3bbv61MhZAEAJibmkE1pXRdo9SRDuxXVuJWp3XBsGYDdfL9frx38jub767LVgZAFAOCAIdvsWpBjs5tlHZx4tvmQNhsVdH1bAjYO9pTtrlX9cEJvfQrPU8gCAExMdXOTPz3knQvCk/1iU4iDhO3HCuKT8yK0v6P/mfL9wTFf9W0PpzBvIGQBACYmLm7yOMCqDtB5f6hXak94UFo0lPMklO22ykFfg71mNyu3/ZkUNltz1b+7vYOQBQDgkCG7vMmxmWdkVyGfiWvH3rD9yWeb22O/KVdfuqVy29HZOBwuWKVmbEHIAgBw6JBdLMqKaryLMV3GwRFcqRykVXWt2g0V9KfyimV7rsEEbTkILLbDCXftqIGDvQAAOLTFsjtxwbrOzds6PJcpPT8pQnctlV6N/XlsBwd9lZXcsp/sbZXiuszJClkAAA4rzuclUpsl11UdoXcxxXm709Zg7rUp1fJ13KzKDnbfGhwQFu/qr1fdoGwUsgAAHD5kF32JlhD9E5ots+KiCv0JvAZzr3GzPUGJ235lNo8TpHjbBnF373QSz1PIAgBMLWSvrtoQTf3ga5YP0nqsP89jPgCs7dz2Q4xhu03T5mfuYnNyhTjYzSAE228BALDXv3//9aGf+/mf/5ai3Zy0q4wOrGOIv1NoznEwq0P3sv66yl+XLs0ztfV9wkOO2NieVKFP29SeKqyP2I/+fUIWAIDdZrP+6nDhdDMa0JyZ60+57LvPM9+0CJsfttq6NMetCVkAgIn57pXST0Zr7tOLEqzd552ELAAA3x2u3aV6zw8LWQAAvlKO1Vm5XHzmFwlZAABGE69CFgDgDb5z1vTnr3+m8BLmcL06VnMKWQCAwzRVt9rYHVWf5c2r8g4Bef/WVWi3tZq6WF6L6/DOmVchCwDwdcGWY+0q7N+ZKpa4vSj3y2F7H9ptr9IZvh5CFgDgm+UVx8UHgm0Ye7ehXaUVsEIWAOBLLEq0fTb+lqFdnb0d8WtxXS7fcq4EIQsA8HY5Pmc7bs9jAt0MbJ6HXZe460YLuhna7eDrVjF/j+x1yM9lHo48AytkAQAOY7EnYu9Cu7KadsRtd7DXqtzvqgTgdhTm3z2Gldmq/K0n0ZBCFgDgdd02UkM5UPNK6uMbf0eO2nyQV161XYanq5lX5fZTnpn91jGCfVUNAMB+OdwWOyL2f++I2KHH8rPrrds/cvDYV/XiTWhXkuOp/WEAAOy3axXy944QfY9uNXc7mK9P7Lnnlegf4UT/FV/IAgC8bHukII8HPB7g9z6W3/XSY32nvEK8DKe5SixkAQBecbkVcmlHfH7G9okRYvj+1c/chz9OLKqFLADAO23vUrAKhz0jV7dt10uP+dXhniP2YgxvjpAFANhvO+gejvAYD6885lfJK7D5oK44ljfH9lsAAPttL/o9HuExHl95zK+QdyS4HtubI2QBAPbbXp1cH+Ex1q885rEd4pS7J/F/GQAAvD1sx260EStkAQBelr4gZKtXHvNYlmOOWCELAPCy7X/2P8aBWBevPOYx5JXY2djfHCELALDf9oFYxzi+6PKVxzxGxF5N4c0RsgAA++3a4/WQ4wUxPF8ZfTji85lPJWKFLADAy3JUbp9565DbVF2H52cOWx3puczCCLfYErIAAB93vyM+DzEre7EjLO+P9Bzy+MJyam+MkAUAeNmf8HwngeUnO6raEZapPNYxem85xTdGyAIAvCwH5u2Ohsqnc/3IyuxF+dntDrsNh996K5aIjVN8Y4QsAMDr8tzq/Y6O+hHaA6jeEoqx3PfHjga7D8eZjZ2H42wZdhKcohYA4G1uw+5dBvKc61UJ0XxZh81esFW5zML+HQ9W4fmK7yHMwoR2KBCyAACf8zvs3oc1ltveG473R4rYqvydkyZkAQDeJ4fnQwnFj86ednO3x9pq6zN/m5AFAJiwVYnZbqzgrdGYAzavwu7aCeFQrs6l8YQsAMDH5BC9K5fcVHkmNR9YVQ3CNt8nz8s+DuL3mPJjz8/lDRCyAACf9/AFkfoWZzFSIGQBAF7x89c/Y/pzZ+fWdvaRBQCYhvm5PWEhCwAwftfn2HVCFgBg3GIJ2bMjZAEAxu06nNEBXkIWAGAaujOKnSUhCwAwXme7GitkAQDG66xXY2tJyAIAjNMsnPFqbG0tZAEAxun6zJ+/kAUAGKF8Bq9z77hHIQsAMD5XXoLwIGQBAMYlz8XOzvw1WAcrsgAAo2M1NoRV/iBkAQDGZeYlCPdCFgBgXHK7XYjYZrRAyAIAjMi5r8am+nI3rHoAAITsGNyWmBWyAAAjkncrOOexgjxSsBreIGQBAMbh8oyfew7Y2+0bhSwAgJA9ZQ+7Ivbcyx4AQMietvt9EStkAQDGIc/HntO/pKcSsCtlDwAwbufUbHkV9i4MdifwogAAjNfUdyvIJzhYhcHJDtQ9AMA0TGmsIJVYzZfH0B7M9fiRX/R/AQYA1i4UF+HkevkAAAAASUVORK5CYII=");
|
||||
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>
|
||||
359
app/pages/users/user_integral/index.vue
Normal file
359
app/pages/users/user_integral/index.vue
Normal file
File diff suppressed because one or more lines are too long
447
app/pages/users/user_money/index.vue
Normal file
447
app/pages/users/user_money/index.vue
Normal 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/eHBhY2tldCBlbmQ9InIiPz6ymvxvAAAIhklEQVR42uzd0W6bQBCG0QWMwfj9nzfNKNBYVSq1iXH443MkXzfdGz6hYbZ7eXlpAACQpncEAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgAgZAEAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAEIWAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgAgZAEAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAEIWAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgAgZAEAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAEIWAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAACELAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQAQsgAAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAAIQsAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQBAyAIAIGQBAEDIAgCAkAUAQMgCAICQBQAAIQsAgJAFAAAhCwAAQhYAAIQsAABCFgAAhCwAAAhZAACELAAACFkAABCyAAAIWQAAELIAACBkAQBAyAIAIGQBAEDIAgCAkAUA4Ec7OQIAAIJ0r7/h9dcLWQAAjh6tt7/fEwVCFgCAw0frR4QsAADfoV9b9DZc/4uQBQDgkeG6xeuXlw4IWQAA9g7X+nX3/geELAAA99D9Ea67r3kVsgAAfFaNCIztfVzgoYQsAAD/6vat69h2GBcQsgAA3Et/E66HakchCwDAR/G6hethe1HIAgBwG6/1GxL+YCELAPC8ujVczynxKmQBAMTr4WZehSwAAH/rvnPb6XICIQsAwD31a7yO7QEXFAhZAAC+InruVcgCADyfob2/fe2e4T8sZAEAsm1vX5+u64QsAECebfa1ft2zHoKQBQDIUeMDU3t7C/v0hCwAwPGNa8AOjkLIAgAcXY0MbOMDveMQsgAAR2f+VcgCAMQF7LQGLEIWAODwfMAlZAEABKyQBQBgz4CddZiQBQAQsEIWAICdAtYIgZAFAIhRWwhmAStkAQBSdGvAWqMlZAEAYgJ22wPrIgMhCwAQoeJ1FrBCFgAgqaUqYAdHIWQBABLUh1wXLSVkAQBSbHOwk6MQsgAAKczBClkAgCg1/3pp5mCFLABACPtghSwAQJy6jevSjBEIWQCAELYRCFkAgDjbNgJvYYUsAEAEH3MJWQCAKHbCClkAgMgGqrewvaMQsgAACazUErIAAJHd4y2skAUAiFJvYc3CClkAgBg2EghZAIA49QZ2dgxCFgAghdu5hCwAQJxxjVi3cwlZAIAYFbDWaglZAIAYNUqwNB90CVkAgCD1BrY+6DJKIGQBACK4oQshCwDEMUqAkAUA4thKgJAFAOK4ZhYhCwBEqbevi25ByAIASYY1YntHgZAFAFLURoKLY0DIAgBJzMMiZAGAKOZhEbIAQJyag70287AIWQAgrEnqTaz9sAhZACCGj7oQsgBAHB91IWQBgDg1SjA6BoQsAJCi5mDro67BUSBkAYAUNhMgZAGAOMMasTYTIGQBgKjmsF4LIQsARBnXiAUhCwDEsCMWIQsAxKn9sLNjQMgCAElcdICQBQDi1CjB2TEgZAGAJG7r4mEsIwYARCxCFgAQsfAoRgsAgK+6agqELACQpG7pWvQE38VoAQDwWSIWIQsAxDFOgJAFAOJ4E4uQBQAiI9Z2AoQsACBiQcgCAHu6iFiELACQZn79nR0DQhYASDKtPxCyAECMegs7OwaELACQpOZhL44BIQsAJKkdsYtjQMgCAEkGEYuQBQASu6AitnMUCFkAIEXF61UbIGQBABELQhYA2FltJxgcA0IWAEhSe2JdPYuQBQCi1IUHbu1CyAIAUWpXrAsPELIAQNzz365YhCwAEGXbUGBXLEIWAIiyeP4jZAGANLWh4OQYELIAQBIbChCyAECcuuxgdgwIWQAgSX3UtTQfdyFkAYAwPu5CyAIAcXzchZAFAOKMzcddCFkAIPD57vpZhCwAEMXHXQhZACBSzcUOjgEhCwAkOa8/ELIAQNQz3aUHCFkAII65WIQsABCnNhSYi0XIAgBRal+suViELAAQ9xy3LxYhCwDEqYg1F4uQBQCi1PWzJ8eAkAUAktSHXVZtIWQdAQDEMRcLQhYA4riCFoQsAMSpmdjJMYCQBYAktZ3ASAEIWQCIM3tug5AFgDQ1UuD2LhCyABDFSAEIWQCINHleg5AFgDRDs6UAhCwABFocAQhZAEhjpACELABEPp9nxwBCFgDS2FIAQhYA4oztbW8sIGQBIIadsSBkASDSvMYsIGQBIEbtjHUNLQhZAIhjpACELADEqTexg2MAIQsASWom1s5YELIAEGdqPvACIQsAgc/hyTGAkAWAND7wAiELAHFOzQ1eIGQBIJAPvEDIAkAc67ZAyAJAHOu2QMgCQCTrtkDIAkCcCtizYwAhCwBp5uZtLAhZAAh85nobC0IWAOL4wAuELADEqVVbo2MAIQsAaSZHAEIWANJ4GwtCFgAimY2FnfwSYABJ5w5fwq1SbwAAAABJRU5ErkJggg==');
|
||||
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>
|
||||
539
app/pages/users/user_payment/index.vue
Normal file
539
app/pages/users/user_payment/index.vue
Normal 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>
|
||||
205
app/pages/users/user_phone/index.vue
Normal file
205
app/pages/users/user_phone/index.vue
Normal 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>
|
||||
218
app/pages/users/user_pwd_edit/index.vue
Normal file
218
app/pages/users/user_pwd_edit/index.vue
Normal 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>
|
||||
185
app/pages/users/user_return_list/index.vue
Normal file
185
app/pages/users/user_return_list/index.vue
Normal 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>
|
||||
534
app/pages/users/user_sgin/index.vue
Normal file
534
app/pages/users/user_sgin/index.vue
Normal file
File diff suppressed because one or more lines are too long
109
app/pages/users/user_sgin_list/index.vue
Normal file
109
app/pages/users/user_sgin_list/index.vue
Normal 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>
|
||||
410
app/pages/users/user_spread_code/index.vue
Normal file
410
app/pages/users/user_spread_code/index.vue
Normal 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>
|
||||
192
app/pages/users/user_spread_money/index.vue
Normal file
192
app/pages/users/user_spread_money/index.vue
Normal 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>
|
||||
224
app/pages/users/user_spread_user/index.vue
Normal file
224
app/pages/users/user_spread_user/index.vue
Normal file
File diff suppressed because one or more lines are too long
510
app/pages/users/user_vip/index.vue
Normal file
510
app/pages/users/user_vip/index.vue
Normal file
File diff suppressed because one or more lines are too long
480
app/pages/users/user_vip/index01.vue
Normal file
480
app/pages/users/user_vip/index01.vue
Normal 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>
|
||||
Reference in New Issue
Block a user