code-image-backup-public/lilishop-uniapp
1
0
Fork 0
mirror of https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git synced 2025-12-18 08:25:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

commit message

Browse Source
This commit is contained in:
Chopper
2021-05-13 11:03:32 +08:00
commit 23804939eb
2158 changed files with 149684 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

388
pages/tabbar/user/my.vue Normal file
View File

@@ -0,0 +1,388 @@
<template>
<view class="user">
<!-- 个人信息 -->
<view class="status_bar">
<!-- 这里是状态栏 -->
</view>
<view class="header" @click="userDetail">
<view class="head-1">
<image :src="userInfo.face || '/static/missing-face.png'"></image>
</view>
<view class="head-2" v-if="userInfo.id">
<view class="user-name">{{ userInfo.nickName }}</view>
</view>
<view class="head-2" v-else>
<view class="user-name">登录/注册</view>
</view>
<u-icon name="arrow-right"></u-icon>
</view>
<!-- 积分，优惠券，关注， -->
<div class="pointBox">
<u-row text-align="center" gutter="16" class="point">
<u-col text-align="center" span="4" @click="navigateTo('/pages/mine/deposit/index')">
<view>预存款</view>
<view class="money">{{ walletNum | unitPrice}}</view>
</u-col>
<u-col text-align="center" span="4" @click="navigateTo('/pages/cart/coupon/myCoupon')">
<view>优惠券</view>
<view>{{ couponNum || 0 }}</view>
</u-col>
<u-col text-align="center" span="4" @click="navigateTo('/pages/mine/myTracks')">
<view>足迹</view>
<view>{{ footNum || 0 }}</view>
</u-col>
</u-row>
</div>
<!-- 我的订单，代付款 -->
<view class="order">
<view class="order-item" @click="navigateTo('/pages/order/myOrder?status=0')">
<div class="bag bag1">
<u-icon name="order" size="35" color="#fff"></u-icon>
</div>
<view>我的订单</view>
</view>
<view class="order-item" @click="navigateTo('/pages/order/myOrder?status=1')">
<div class="bag bag2">
<u-icon name="bag-fill" size="35" color="#fff"></u-icon>
</div>
<view>待付款</view>
<!-- <view class="corner" v-if="cornerForm.stay_pay_order > 0">{{ cornerForm.stay_pay_order}}</view> -->
</view>
<view class="order-item" @click="navigateTo('/pages/order/myOrder?status=3')">
<div class="bag bag3">
<u-icon name="car-fill" size="35" color="#fff"></u-icon>
</div>
<view>待收货</view>
<!-- <view class="corner" v-if="cornerForm.stay_receiving_order > 0">{{ cornerForm.stay_receiving_order}}</view> -->
</view>
<view class="order-item" @click="navigateTo('/pages/order/evaluate/myEvaluate')">
<div class="bag bag4">
<u-icon name="star-fill" size="35" color="#fff"></u-icon>
</div>
<view>待评价</view>
<!-- <view class="corner" v-if="cornerForm.pending_comment_count > 0">{{ cornerForm.pending_comment_count}}</view> -->
</view>
<view class="order-item" @click="navigateTo('/pages/order/afterSales/afterSales')">
<div class="bag bag5">
<u-icon name="server-fill" size="35" color="#fff"></u-icon>
</div>
<view>售后服务</view>
<!-- <view class="corner" v-if="cornerForm.after_order > 0">{{ cornerForm.after_order}}</view> -->
</view>
</view>
<!-- 常用工具 -->
<tool />
</view>
</template>
<script>
import storage from "@/utils/storage.js";
import tool from "@/pages/tabbar/user/utils/tool.vue";
import { getCouponsNum, getFootprintNum } from "@/api/members.js";
import { getUserInfo, getUserWallet } from "@/api/members";
let startY = 0,
moveY = 0,
pageAtTop = true;
export default {
components: {
tool,
},
data() {
return {
coverTransform: "translateY(0px)",
coverTransition: "0s",
moving: false,
userInfo: {},
couponNum: "",
footNum: "",
walletNum: "",
};
},
onLoad() {},
onShow() {
this.userInfo = this.$options.filters.isLogin();
if (this.$options.filters.isLogin("auth")) {
this.getUserOrderNum();
}
},
onPullDownRefresh() {
this.getUserOrderNum();
this.userInfo = this.$options.filters.isLogin();
},
// #ifndef MP
onNavigationBarButtonTap(e) {
const index = e.index;
if (index === 0) {
this.navigateTo("/pages/mine/set/setUp");
}
},
// #endif
mounted() {},
methods: {
/**
* 统一跳转接口,拦截未登录路由
* navigator标签现在默认没有转场动画，所以用view
*/
navigateTo(url) {
uni.navigateTo({
url,
});
},
userDetail() {
this.userInfo.id
? this.navigateTo("/pages/mine/set/personMsg")
: this.navigateTo("/pages/passport/login");
},
/**
* 会员卡下拉和回弹
* 1.关闭bounce避免ios端下拉冲突
* 2.由于touchmove事件的缺陷（以前做小程序就遇到，比如20跳到40，h5反而好很多），下拉的时候会有掉帧的感觉
* transition设置0.1秒延迟，让css来过渡这段空窗期
* 3.回弹效果可修改曲线值来调整效果，推荐一个好用的bezier生成工具 http://cubic-bezier.com/
*/
coverTouchstart(e) {
if (pageAtTop === false) {
return;
}
this.coverTransition = "transform .1s linear";
startY = e.touches[0].clientY;
},
coverTouchmove(e) {
moveY = e.touches[0].clientY;
let moveDistance = moveY - startY;
if (moveDistance < 0) {
this.moving = false;
return;
}
this.moving = true;
if (moveDistance >= 80 && moveDistance < 100) {
moveDistance = 80;
}
if (moveDistance > 0 && moveDistance <= 80) {
this.coverTransform = `translateY(${moveDistance}px)`;
}
},
coverTouchend() {
if (this.moving === false) {
return;
}
this.moving = false;
this.coverTransition = "transform 0.3s cubic-bezier(.21,1.93,.53,.64)";
this.coverTransform = "translateY(0px)";
},
async getUserOrderNum() {
uni.stopPullDownRefresh();
Promise.all([
getCouponsNum(), //优惠券
getFootprintNum(), //浏览数量
getUserWallet(), //预存款
]).then((res) => {
this.couponNum = res[0].data.result;
this.footNum = res[1].data.result;
this.walletNum = res[2].data.result.memberWallet;
});
},
},
};
</script>
<style lang="scss" scoped>
html,
body {
overflow: auto;
}
.money {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.uiconRed {
position: relative;
&::before {
content: "";
background: red;
width: 10rpx;
height: 10rpx;
border-radius: 50%;
position: absolute;
right: 0;
top: 0;
}
}
.user {
.status_WEIXIN {
background: $light-color;
overflow: hidden;
> .status_WEIXIN_R {
float: right;
margin-right: 20rpx;
}
> .status_WEIXIN_L {
float: left;
margin-left: 20rpx;
}
}
.header {
max-width: 100%;
padding: calc(50rpx + var(--status-bar-height)) 30rpx 0 115rpx;
height: calc(var(--status-bar-height) + 360rpx);
background-size: cover;
border-bottom-left-radius: 20rpx;
border-bottom-right-radius: 20rpx;
background-image: url("/static/img/main-bg.png");
background-position: bottom;
background-repeat: no-repeat;
color: #ffffff;
display: flex;
justify-content: space-between;
.head-1 {
text-align: center;
width: 144rpx;
position: relative;
margin-top: 40rpx;
image {
width: 144rpx;
height: 144rpx;
border-radius: 50%;
margin-bottom: 30rpx;
border: 3px solid #fff;
}
.edti-head {
position: absolute;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.3);
top: 100rpx;
right: 0;
image {
width: 100%;
height: 100%;
}
}
.certificate {
font-size: 20rpx;
border: 1px solid #ffffff;
border-radius: 1em;
width: 91rpx;
margin: 0 auto;
}
}
.head-2 {
flex: 1;
margin-left: 30rpx;
line-height: 2em;
margin-top: 60rpx;
}
.u-icon {
margin-top: -120rpx;
}
}
.pointBox {
transform: translateY(-30rpx);
width: 94%;
margin: 0 3%;
background: #fff;
border-radius: 0.4em;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
height: 160rpx;
}
.point {
text-align: center;
height: 160rpx;
border-bottom: 1px solid $border-color-light;
color: #999;
font-size: $font-sm;
// #ifdef MP-WEIXIN
padding: 24rpx;
// #endif
.u-col {
line-height: 1.5em view {
color: $u-main-color;
font-size: 28rpx;
}
view:last-child {
margin-top: 8rpx;
color: $main-color;
font-size: $font-lg;
}
}
}
.order {
height: 140rpx;
text-align: center;
font-size: $font-sm;
display: flex;
justify-content: space-around;
align-items: center;
padding: 0 3%;
color: #999;
.order-item {
position: relative;
line-height: 2em;
width: 96rpx;
:first-child {
font-size: 48rpx;
margin-bottom: 10rpx;
}
.corner {
position: absolute;
right: 14rpx;
top: -6rpx;
width: 30rpx;
height: 30rpx;
background-color: red;
color: #fff;
border-radius: 50%;
line-height: 30rpx;
}
}
}
}
.user-name {
font-size: 34rpx;
}
.nickname {
font-size: 24rpx;
}
.bag {
width: 56rpx;
height: 56rpx;
border-radius: 50%;
margin: 0 auto;
}
.bag1 {
background: #ff4a48;
}
.bag2 {
background: #ff992f;
}
.bag3 {
background: #009ee0;
}
.bag4 {
background: #00d5d5;
}
.bag5 {
background: #28ccb0;
}
</style>

187
pages/tabbar/user/similarGoods.vue Normal file
View File

@@ -0,0 +1,187 @@
<template>
<view class="similar-goods">
<view class="goods" @click="goDetail(goods.goods_id)">
<image :src="goods.goods_img" mode=""></image>
<view class="goods-intro">
<view>{{goods.goodsName}}</view>
<view>{{goods.goods_sn}}</view>
<view>¥{{goods.goods_price | unitPrice}}</view>
</view>
<!-- <button>找相似</button> -->
</view>
<view class="title">相似好货&nbsp;为您推荐</view>
<view class="scroll-con">
<view v-if="nomsg">没有相似商品</view>
<view v-else class="con" v-for="(item,index) in goodsList" :key="index" @click="goDetail(item)">
<image :src="item.thumbnail" mode=""></image>
<view class="nowrap">{{item.name}}</view>
<view>
<text>￥{{item.price | unitPrice}}
<!-- <text v-if="item.point">+{{item.point || 0}}积分</text> -->
</text>
<text>￥{{item.mktprice}}</text>
</view>
<view>
<text>已售{{item.buy_count}}件</text>
<text>{{item.grade}}%好评</text>
</view>
</view>
</view>
<uni-load-more :status="loadStatus"></uni-load-more>
</view>
</template>
<script>
import {
getGoodsList
} from '@/api/goods.js';
export default {
data() {
return {
loadStatus: 'more',
params: {
pageNumber: 1,
pageSize: 10,
keyword: ''
},
goods: {},
goodsList: [],
nomsg: false,
};
},
methods: {
getList() {
uni.showLoading({
title: "加载中"
})
this.params.keyword = this.goods.goodsName;
getGoodsList(this.params).then(res => {
uni.hideLoading()
if (res.statusCode == 200) {
let data = res.data;
if (data.data_total == 0) {
// this.nomsg = true;
this.loadStatus = 'noMore';
} else if (data.data_total < 10) {
this.loadStatus = 'noMore'
this.goodsList.push(...data.data)
} else {
this.goodsList.push(...data.data);
if (data.data.length < 10) this.loadStatus = 'noMore'
}
}
})
},
goDetail(item) {
uni.navigateTo({
url: '/pages/product/goods?id=' + item.id + "&goodsId=" +item.goodsId
})
},
loadData() {
if(this.loadStatus!='noMore'){
this.params.pageNumber++;
this.getList()
}
},
},
onLoad(option) {
this.goods = JSON.parse(decodeURIComponent(option.goods))
console.log(this.goods)
this.getList()
},
onReachBottom() { //触底事件，页面整个滚动使用
this.loadData()
}
}
</script>
<style lang="scss" scoped>
@import './collect.scss';
.title {
height: 110rpx;
line-height: 110rpx;
text-align: center;
color: #333;
background-color: #F1F1F1;
margin-top: 20rpx;
font-size: $font-base;
}
.goods {
padding: 0 30rpx;
}
.scroll-con {
width: 750rpx;
flex-wrap: wrap;
.con {
width: 345rpx;
margin: 20rpx 0 0 20rpx;
background-color: #FFFFFF;
border-radius: 10rpx;
box-sizing: border-box;
display: inline-block;
font-size: $font-sm;
// line-height: 1.5em;
image {
width: 100%;
height: 320rpx;
border-radius: 8rpx 8rpx 0 0;
}
view{
padding: 0 20rpx;
&::after{
content: '';
display: block;
clear: right;
}
text {
display: inline-block;
color: #999;
}
text:nth-child(2) {
float: right;
text-align: right;
}
}
view:last-child{
margin-bottom: 20rpx;
}
.nowrap {
position: relative;
line-height: 1.4em;
max-height: 2.8em; //height是line-height的整数倍，防止文字显示不全
overflow: hidden;
}
view:nth-child(2) {
font-size: 26rpx;
}
view:nth-child(3) {
margin-top: 10rpx;
font-weight: bold;
text:nth-child(1) {
color: #f56c6c;
}
text:nth-child(2) {
color: #d7d7d7;
text-decoration: line-through;
}
}
view:nth-child(4) {
margin-top: 10rpx;
}
}
}
</style>

157
pages/tabbar/user/utils/tool.vue Normal file
View File

@@ -0,0 +1,157 @@
<template>
<view>
<!-- 常用工具 -->
<view class="interact-tools" style="margin-bottom: 15px">
<view class="interact-title">常用工具</view>
<div class="paddingBox">
<view class="interact-container">
<view class="interact-item" @click="navigateTo('/pages/mine/signIn')">
<image src="/static/mine/sign.png" mode=""></image>
<view>每日签到</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/mine/point/myPoint')">
<image src="/static/mine/mypoint.png" mode=""></image>
<view>我的积分</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/cart/coupon/myCoupon')">
<image src="/static/mine/mycoupon.png" mode=""></image>
<view>优惠券</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/mine/myCollect')">
<image src="/static/mine/myfavorite.png" mode=""></image>
<view>我的关注</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/mine/myTracks')">
<image src="/static/mine/myhistory.png" mode=""></image>
<view>我的足迹</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/order/evaluate/myEvaluate')">
<image src="/static/mine/mycommit.png" mode=""></image>
<view>我的评价</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/order/complain/complainList')">
<image src="/static/mine/shensu.png" mode=""></image>
<view>我的投诉</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/mine/set/feedBack')">
<image src="/static/mine/feedback.png" mode=""></image>
<view>意见反馈</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/cart/coupon/couponCenter')">
<image src="/static/mine/couponcenter.png" mode=""></image>
<view>领券中心</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/mine/address/addressManage')">
<image src="/static/mine/myaddress.png" mode=""></image>
<view>地址管理</view>
</view>
<view class="interact-item" @click="navigateTo('/pages/mine/set/setUp')">
<image src="/static/mine/setting.png" mode=""></image>
<view>设置</view>
</view>
<view class="interact-item" @click="distribution">
<image src="/static/mine/distribution.png" mode=""></image>
<view>我的分销</view>
</view>
</view>
</div>
</view>
</view>
</template>
<script>
import { distribution } from "@/api/goods";
export default {
methods: {
navigateTo(url) {
uni.navigateTo({
url,
});
},
distribution() {
distribution().then((res) => {
if (res.data.result) {
let type = res.data.result.distributionStatus;
if (type == "PASS") {
uni.navigateTo({
url: "/pages/mine/distribution/home",
});
} else if (type == "RETREAT" || type == "REFUSE") {
uni.navigateTo({
url: "/pages/mine/distribution/auth",
});
} else {
uni.showToast({
title: "您的信息正在审核",
duration: 2000,
icon: "none",
});
}
} else if (!res.data.success && res.data.code == 22000) {
uni.showToast({
title: '分销功能暂未开启',
duration: 2000,
icon: "none",
});
} else {
// 没有资格申请 先去实名认证
uni.navigateTo({
url: "/pages/mine/distribution/auth",
});
}
});
},
},
};
</script>
<style lang="scss" scoped>
.interact-tools {
border-left: none;
border-right: none;
margin-top: 30rpx;
.interact-title {
background: #f2f2f2;
height: 96rpx;
line-height: 96rpx;
font-size: 28rpx;
color: #333;
font-weight: bold;
padding-left: 30rpx;
margin: 0 20rpx;
border-radius: 14rpx 14rpx 0 0;
}
.interactBox {
height: 156rpx;
}
.interact-container {
margin: 0 20rpx;
background: #fff;
border-radius: 0 0 14rpx 14rpx;
.interact-item-img {
width: 52rpx !important;
height: 52rpx !important;
// margin-bottom: !important;
margin: 0 auto 6rpx auto !important;
}
image {
width: 52rpx;
height: 52rpx;
margin-bottom: 6rpx;
}
display: flex;
align-items: center;
flex-wrap: wrap;
text-align: center;
.interact-item {
font-size: $font-sm;
width: 25%;
height: 160rpx;
padding: 30rpx;
}
}
}
</style>