修改页面
This commit is contained in:
23
api/user.js
23
api/user.js
@ -1,20 +1,4 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | likeshop开源商城系统
|
||||
// +----------------------------------------------------------------------
|
||||
// | 欢迎阅读学习系统程序代码，建议反馈是我们前进的动力
|
||||
// | gitee下载：https://gitee.com/likeshop_gitee
|
||||
// | github下载：https://github.com/likeshop-github
|
||||
// | 访问官网：https://www.likeshop.cn
|
||||
// | 访问社区：https://home.likeshop.cn
|
||||
// | 访问手册：http://doc.likeshop.cn
|
||||
// | 微信公众号：likeshop技术社区
|
||||
// | likeshop系列产品在gitee、github等公开渠道开源版本可免费商用，未经许可不能去除前后端官方版权标识
|
||||
// | likeshop系列产品收费版本务必购买商业授权，购买去版权授权后，方可去除前后端官方版权标识
|
||||
// | 禁止对系统程序代码以任何目的，任何形式的再发布
|
||||
// | likeshop团队版权所有并拥有最终解释权
|
||||
// +----------------------------------------------------------------------
|
||||
// | author: likeshop.cn.team
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
import request from '../utils/request'
|
||||
import { client } from '@/utils/tools'
|
||||
//个人中心
|
||||
@ -392,3 +376,8 @@ export function getCopyright() {
|
||||
export function bindOawechat(data) {
|
||||
return request.post('account/oaAuthLogin', data)
|
||||
}
|
||||
|
||||
// 绑定微信
|
||||
export function getPhone(data) {
|
||||
return request.post('user/getPhone', data)
|
||||
}
|
||||
|
||||
@ -19,13 +19,13 @@
|
||||
</view>
|
||||
<image style="width: 28rpx; height: 28rpx" src="/static/images/arrow_right.png"></image>
|
||||
</view>
|
||||
<view class="opt-item row-between" @tap="allRefunds">
|
||||
<!-- <view class="opt-item row-between" @tap="allRefunds">
|
||||
<view>
|
||||
<view class="lg normal">退货退款</view>
|
||||
<view class="muted xs mt10">已收到货，需退还收到的实物</view>
|
||||
</view>
|
||||
<image style="width: 28rpx; height: 28rpx" src="/static/images/arrow_right.png"></image>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view :hidden="!hiddenOpt">
|
||||
<view class="refund-info row-between mt20">
|
||||
@ -34,24 +34,26 @@
|
||||
</view>
|
||||
<view class="refund-info row-between">
|
||||
<view class="lable">退款金额</view>
|
||||
<price-format color="#FF2C3C" :price="parseFloat(goods.total_pay_price) +
|
||||
<u-input v-model="refundMoney" input-align="right" placeholder="请输入退款金额"></u-input>
|
||||
<!-- <price-format color="#FF2C3C" :price="parseFloat(goods.total_pay_price) +
|
||||
parseFloat(goods.refund_express_money)
|
||||
" showSubscript="true" :subscriptSize="28" :firstSize="28" :secondSize="28" />
|
||||
" showSubscript="true" :subscriptSize="28" :firstSize="28" :secondSize="28" /> -->
|
||||
</view>
|
||||
<view class="refund-info row-between" @tap="showPopup">
|
||||
<view class="lable">退款原因</view>
|
||||
<view class="row">
|
||||
<text :class="'nr ' + (reasonIndex == -1 ? 'muted' : 'normal')">{{
|
||||
<u-input v-model="reason" input-align="right" placeholder="请输入退款原因"></u-input>
|
||||
<!-- <text :class="'nr ' + (reasonIndex == -1 ? 'muted' : 'normal')">{{
|
||||
reasonIndex == -1 ? "请选择" : reason[reasonIndex]
|
||||
}}</text>
|
||||
<image class="icon-sm ml20" src="/static/images/arrow_right.png"></image>
|
||||
<image class="icon-sm ml20" src="/static/images/arrow_right.png"></image> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="refund-info row">
|
||||
<!-- <view class="refund-info row">
|
||||
<view class="label">备注说明</view>
|
||||
<textarea v-show="!showPop" class="bg-body" placeholder="请描述申请售后的具体原因，100字以内" v-model="remark"
|
||||
name="textarea"></textarea>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="upload bg-white">
|
||||
<view class="title row-between">
|
||||
<view>上传凭证</view>
|
||||
@ -157,15 +159,15 @@ export default {
|
||||
applyAgainFun() {
|
||||
let { reason, reasonIndex, optTyle, remark, fileList } = this;
|
||||
|
||||
if (!reason[reasonIndex]) {
|
||||
return this.$toast({
|
||||
title: "请选择退款原因",
|
||||
});
|
||||
}
|
||||
// if (!reason[reasonIndex]) {
|
||||
// return this.$toast({
|
||||
// title: "请选择退款原因",
|
||||
// });
|
||||
// }
|
||||
|
||||
const data = {
|
||||
id: this.afterSaleId,
|
||||
reason: reason[reasonIndex],
|
||||
reason: reason,
|
||||
refund_type: optTyle,
|
||||
remark: remark,
|
||||
img: fileList.length <= 0 ? "" : fileList[0].base_url,
|
||||
@ -196,20 +198,32 @@ export default {
|
||||
},
|
||||
|
||||
applyAfterSaleFun() {
|
||||
let { reason, reasonIndex, optTyle, remark, fileList } = this;
|
||||
let { refundMoney, reason, reasonIndex, optTyle, remark, fileList } = this;
|
||||
|
||||
if (!reason[reasonIndex]) {
|
||||
if (!refundMoney) {
|
||||
return this.$toast({
|
||||
title: "请选择退款原因",
|
||||
title: "请输入退款金额",
|
||||
});
|
||||
}
|
||||
|
||||
if (!reason) {
|
||||
return this.$toast({
|
||||
title: "请输入退款原因",
|
||||
});
|
||||
}
|
||||
// if (!reason[reasonIndex]) {
|
||||
// return this.$toast({
|
||||
// title: "请选择退款原因",
|
||||
// });
|
||||
// }
|
||||
|
||||
const data = {
|
||||
item_id: this.itemId,
|
||||
order_id: this.orderId,
|
||||
refund_money: this.refundMoney,
|
||||
reason: reason[reasonIndex],
|
||||
refund_type: optTyle,
|
||||
remark: remark,
|
||||
// remark: remark,
|
||||
img: fileList.length <= 0 ? "" : fileList[0].url,
|
||||
};
|
||||
applyAfterSale(data).then((res) => {
|
||||
@ -255,7 +269,7 @@ export default {
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.goods = res.data.goods;
|
||||
this.reason = res.data.reason;
|
||||
// this.reason = res.data.reason;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
@ -1,199 +1,331 @@
|
||||
<template>
|
||||
<view class="coupon">
|
||||
<view>
|
||||
<u-tabs :list="tab" :is-scroll="false" :current="current" @change="change" :active-color="themeColor" height="96"></u-tabs>
|
||||
</view>
|
||||
|
||||
<mescroll-body ref="mescroll" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback">
|
||||
<view class="content">
|
||||
<view class="bg-white u-p-b-36 rounded-20">
|
||||
<view class="title row-between" @click="toCouponList">
|
||||
<view>优惠券</view>
|
||||
<view>
|
||||
可用 <text class="num">13</text> 张
|
||||
<u-icon name="arrow-right" size="24" color="#808080"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-relative" v-if="current === 0">
|
||||
<view class="package u-text-center u-p-t-22 u-p-b-28">
|
||||
<view class="bold-500">超级省钱券包</view>
|
||||
<view>超值权益一单回本</view>
|
||||
</view>
|
||||
|
||||
<view class="list u-absolute left-0 right-0">
|
||||
<view class="block br20">
|
||||
<view class="row-between">
|
||||
<view>
|
||||
<view class="row">
|
||||
<u-image :src="cloudPath + 'img/icon_package1.png'" width="34" height="28"></u-image>
|
||||
<view class="text-333 u-m-l-10 nr">券包</view>
|
||||
</view>
|
||||
<view class="text-755023 xs u-m-t-10">
|
||||
<text>2元最低可抵111元/共<text class="primary">1</text>张券</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-relative">
|
||||
<u-image :src="cloudPath + 'img/icon_package2.png'" width="220" height="60"></u-image>
|
||||
<view class="text-755023 u-absolute price xs">￥2.00</view>
|
||||
</view>
|
||||
<view class="u-m-l-32">
|
||||
<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="120">
|
||||
<view class="scroll-view-item_H coupon" v-for="(item, index) in couponList" :key="index">
|
||||
<view class="coupon-top">
|
||||
<text>满减券x{{item.num}}</text>
|
||||
</view>
|
||||
<view class="coupon-bg u-m-t-32">
|
||||
<view class="xxs u-text-center u-p-t-4 text-845F2E">满减券x1</view>
|
||||
<view class="bold-600 u-text-center u-p-t-26">
|
||||
<price-format color="#FF0000" :price="121.99" :subscriptSize="32" :firstSize="52" :secondSize="52"></price-format>
|
||||
</view>
|
||||
<view class="text-D8A658 u-text-center u-p-t-32">满11元可用</view>
|
||||
<view class="u-m-t-50 u-text-center primary">
|
||||
<price-format :subscript-size="34" :first-size="60" :second-size="50" :price="item.price" :weight="500"></price-format>
|
||||
</view>
|
||||
<view class="dashed"></view>
|
||||
<view class="coupon-tips">
|
||||
满{{item.full_price}}元可用
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="coupon-btn">领取优惠券</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-b-36 rounded-20 u-m-t-24">
|
||||
<view class="title row-between" @click="toCouponPackage">
|
||||
<view>优惠券包</view>
|
||||
<view>
|
||||
可用 <text class="num">13</text> 张
|
||||
<u-icon name="arrow-right" size="24" color="#808080"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="coupon-list u-m-t-12" v-if="current === 1">
|
||||
<view class="coupon-list-bg row-between" v-for="(item, index) in list" :key="index">
|
||||
<view class="row-start row-column u-row-center u-text-center">
|
||||
<view>
|
||||
<price-format :color="themeColor" :price="item.money" :subscriptSize="40" :firstSize="72" :secondSize="72"></price-format>
|
||||
|
||||
<view class="u-m-l-32">
|
||||
<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="120">
|
||||
<view class="scroll-view-item_H coupon2" v-for="(item, index) in couponPackageList" :key="index">
|
||||
<view class="coupon-top2">
|
||||
<text>优惠券专享</text>
|
||||
</view>
|
||||
<view class="full">{{ item.use_condition }}</view>
|
||||
</view>
|
||||
<view class="flex1 u-m-l-80 row-between">
|
||||
<view>
|
||||
<view class="coupon-text bold-600">优惠券</view>
|
||||
<view class="xs u-m-t-20 date">有效期 {{ item.use_time_tips }}天</view>
|
||||
<view class="unit">
|
||||
<view>{{item.price}}</view>
|
||||
<view>元</view>
|
||||
<view class="u-m-l-10 u-m-r-10">x</view>
|
||||
<view>{{item.num}}</view>
|
||||
<view>张</view>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="mpLogin" hover-class="none" :customStyle="{width: '160rpx', height: '56rpx', backgroundColor: themeColor, color: '#fff', border: 'none', borderRadius: '100rpx', fontSize: '24rpx'}" :hair-line="false">立即兑换</u-button>
|
||||
<view class="coupon-tips2">
|
||||
{{item.full_price == 0 ? '无门槛' : '满' + item.full_price + '元可用'}}
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-b-36 rounded-20 u-m-t-24">
|
||||
<view class="title row-between" @click="toCouponExchange">
|
||||
<view>兑换券</view>
|
||||
<view>
|
||||
可用 <text class="num">13</text> 张
|
||||
<u-icon name="arrow-right" size="24" color="#808080"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
|
||||
<view class="u-m-l-32">
|
||||
<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="120">
|
||||
<view class="scroll-view-item_H coupon" v-for="(item, index) in 10" :key="index">
|
||||
<view class="coupon-top">
|
||||
<text>满减券x1</text>
|
||||
</view>
|
||||
<view class="u-m-t-50 u-text-center primary">
|
||||
<price-format :subscript-size="34" :first-size="60" :second-size="50" :price="18" :weight="500"></price-format>
|
||||
</view>
|
||||
<view class="dashed"></view>
|
||||
<view class="coupon-tips">
|
||||
满11元可用
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="coupon-btn">立即兑换</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"
|
||||
import { getCoupon } from "@/api/user"
|
||||
import { getCouponList } from '@/api/activity';
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"
|
||||
import { getCoupon } from "@/api/user"
|
||||
import { getCouponList } from '@/api/activity'
|
||||
|
||||
|
||||
export default {
|
||||
mixins: [MescrollMixin],
|
||||
data() {
|
||||
return {
|
||||
tab: [
|
||||
{
|
||||
name: '购买'
|
||||
},
|
||||
{
|
||||
name: '兑换'
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
upOption:{
|
||||
noMoreSize: 4,
|
||||
empty:{
|
||||
tip: '~ 空空如也 ~', // 提示
|
||||
btnText: '',
|
||||
},
|
||||
textNoMore: '没有更多了'
|
||||
export default {
|
||||
mixins: [MescrollMixin],
|
||||
data() {
|
||||
return {
|
||||
tab: [
|
||||
{
|
||||
name: '购买'
|
||||
},
|
||||
list: []
|
||||
}
|
||||
{
|
||||
name: '兑换'
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
upOption: {
|
||||
noMoreSize: 4,
|
||||
empty: {
|
||||
tip: '~ 空空如也 ~', // 提示
|
||||
btnText: '',
|
||||
},
|
||||
textNoMore: '没有更多了'
|
||||
},
|
||||
list: [],
|
||||
couponList: [
|
||||
{price: 2, full_price: 9, num: 1},
|
||||
{price: 3, full_price: 15, num: 3},
|
||||
{price: 4, full_price: 18, num: 4},
|
||||
{price: 2, full_price: 0, num: 4},
|
||||
],
|
||||
couponPackageList: [
|
||||
{price: 2, full_price: 9, num: 1},
|
||||
{price: 3, full_price: 15, num: 3},
|
||||
{price: 4, full_price: 18, num: 4},
|
||||
{price: 2, full_price: 0, num: 4},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
change(index) {
|
||||
this.current = index
|
||||
},
|
||||
methods: {
|
||||
change(index) {
|
||||
this.current = index
|
||||
},
|
||||
|
||||
// 初始化数据
|
||||
upCallback(page) {
|
||||
getCouponList({
|
||||
page: page.num,
|
||||
current: this.current,
|
||||
}).then(res => {
|
||||
const {data} = res
|
||||
this.mescroll.endSuccess(data.length, data.totalPages);
|
||||
//设置列表数据
|
||||
if(page.num == 1) this.list = []; //如果是第一页需手动制空列表
|
||||
this.list = this.list.concat(data); //追加新数据
|
||||
}).catch(()=>{
|
||||
this.mescroll.endErr();
|
||||
})
|
||||
},
|
||||
// 初始化数据
|
||||
upCallback(page) {
|
||||
getCouponList({
|
||||
page: page.num,
|
||||
current: this.current,
|
||||
}).then(res => {
|
||||
const { data } = res
|
||||
this.mescroll.endSuccess(data.length, data.totalPages);
|
||||
//设置列表数据
|
||||
if (page.num == 1) this.list = []; //如果是第一页需手动制空列表
|
||||
this.list = this.list.concat(data); //追加新数据
|
||||
}).catch(() => {
|
||||
this.mescroll.endErr();
|
||||
})
|
||||
},
|
||||
|
||||
// 优惠券列表
|
||||
toCouponList() {
|
||||
uni.navigateTo({ url: '/bundle/pages/coupon/coupon_list' })
|
||||
},
|
||||
|
||||
// 优惠券包列表
|
||||
toCouponPackage() {
|
||||
uni.navigateTo({ url: '/bundle/pages/coupon/coupon_package' })
|
||||
},
|
||||
|
||||
// 兑换券列表
|
||||
toCouponExchange() {
|
||||
uni.navigateTo({ url: '/bundle/pages/coupon/coupon_exchange' })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.text-755023 {color: #755023;}
|
||||
.text-845F2E {color: #845F2E;}
|
||||
.text-D8A658 {color: #D8A658;}
|
||||
|
||||
.coupon {
|
||||
.package {
|
||||
background-color: #2D2622;
|
||||
height: 180rpx;
|
||||
.rounded-20 {
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
& > view:first-child {
|
||||
font-size: 64rpx;
|
||||
background: linear-gradient(90deg, #FDE0B4 0%, #FFC07F 100%);
|
||||
letter-spacing: 1px;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
& > view:last-child {
|
||||
font-size: 30rpx;
|
||||
background: linear-gradient(270deg, #FDE0B4 0%, #FFC07F 100%);
|
||||
letter-spacing: 1px;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
background-color: #F6F6F6;
|
||||
border-top-left-radius: 24rpx;
|
||||
border-top-right-radius: 24rpx;
|
||||
top: 160rpx;
|
||||
padding: 30rpx 24rpx;
|
||||
|
||||
.block {
|
||||
height: 386rpx;
|
||||
background: #FBE9CC;
|
||||
border: 2rpx solid #E0B66C;
|
||||
padding: 24rpx 36rpx 24rpx;
|
||||
|
||||
.price {
|
||||
left: 22rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.coupon-bg {
|
||||
width: 207rpx;
|
||||
height: 196rpx;
|
||||
background: url(#{$cloudPath}img/icon_package3.png) no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.coupon-list {
|
||||
.coupon-list-bg {
|
||||
height: 176rpx;
|
||||
background: url(#{$cloudPath}img/icon_coupon2.png) no-repeat;
|
||||
background-size: cover;
|
||||
margin: 0 32rpx 32rpx;
|
||||
padding: 0 32rpx;
|
||||
|
||||
.full {
|
||||
font-size: 20rpx;
|
||||
color: rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
.coupon-text {
|
||||
color: #1D2129;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.date {
|
||||
color: rgba(0, 0, 0, .4);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.content {
|
||||
margin: 26rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 26rpx 32rpx;
|
||||
}
|
||||
|
||||
.num {
|
||||
color: #E80E0F;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
|
||||
.scroll-view_H {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.scroll-view-item_H {
|
||||
display: inline-block;
|
||||
width: 206rpx;
|
||||
height: 196rpx;
|
||||
}
|
||||
|
||||
.coupon {
|
||||
position: relative;
|
||||
background: #FFF5F3;
|
||||
border-radius: 8px;
|
||||
margin-right: 22rpx;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.coupon::before,
|
||||
.coupon::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 70%;
|
||||
width: 32rpx;
|
||||
/* 控制凹口大小 */
|
||||
height: 32rpx;
|
||||
background: #fff;
|
||||
/* 与页面背景色一致 */
|
||||
border-radius: 50%;
|
||||
transform: translateY(-70%);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.coupon::before {
|
||||
left: -16rpx;
|
||||
}
|
||||
|
||||
.coupon::after {
|
||||
right: -16rpx;
|
||||
}
|
||||
|
||||
.coupon-top {
|
||||
width: 165rpx;
|
||||
height: 40rpx;
|
||||
background: linear-gradient( 180deg, #FC7001 0%, #FE00B0 100%);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
transform: translateX(-50%);
|
||||
text-align: center;
|
||||
border-bottom-left-radius: 24rpx;
|
||||
border-bottom-right-radius: 24rpx;
|
||||
color: #fff;
|
||||
font-size: 22rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.dashed {
|
||||
position: absolute;
|
||||
top: 66%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
transform: translateY(-66%);
|
||||
border: 2rpx dashed #E0B66C;
|
||||
}
|
||||
|
||||
.coupon-tips {
|
||||
color: #E0B66C;
|
||||
position: absolute;
|
||||
top: 90%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -90%);
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.coupon-btn {
|
||||
width: 554rpx;
|
||||
height: 68rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 68rpx;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
margin: 44rpx auto 0;
|
||||
background: linear-gradient( 90deg, #FC680E 0%, #FE02AC 100%);
|
||||
border-radius: 116rpx 116rpx 116rpx 116rpx;
|
||||
}
|
||||
|
||||
.coupon2 {
|
||||
margin-right: 20rpx;
|
||||
position: relative;
|
||||
width: 258rpx;
|
||||
height: 161rpx;
|
||||
background: #FFF5F3;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.curved-rect {
|
||||
width: 258rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.coupon-top2 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
transform: translateX(-50%);
|
||||
width: 136rpx;
|
||||
height: 30rpx;
|
||||
background: #FFEBE3;
|
||||
text-align: center;
|
||||
border-bottom-left-radius: 24rpx;
|
||||
border-bottom-right-radius: 24rpx;
|
||||
color: #F1BFB6;
|
||||
font-size: 22rpx;
|
||||
line-height: 27rpx;
|
||||
}
|
||||
|
||||
.unit {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 40rpx;
|
||||
color: #F90004;
|
||||
font-weight: 600;
|
||||
margin-top: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.coupon-tips2 {
|
||||
background-image: url('/static/coupon_bg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
height: 66rpx;
|
||||
text-align: center;
|
||||
padding-top: 20rpx;
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
198
bundle/pages/coupon/coupon_20250718.vue
Normal file
198
bundle/pages/coupon/coupon_20250718.vue
Normal file
@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<view class="coupon">
|
||||
<view>
|
||||
<u-tabs :list="tab" :is-scroll="false" :current="current" @change="change" :active-color="themeColor" height="96"></u-tabs>
|
||||
</view>
|
||||
|
||||
<mescroll-body ref="mescroll" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback">
|
||||
<view class="u-relative" v-if="current === 0">
|
||||
<view class="package u-text-center u-p-t-22 u-p-b-28">
|
||||
<view class="bold-500">超级省钱券包</view>
|
||||
<view>超值权益一单回本</view>
|
||||
</view>
|
||||
|
||||
<view class="list u-absolute left-0 right-0">
|
||||
<view class="block br20">
|
||||
<view class="row-between">
|
||||
<view>
|
||||
<view class="row">
|
||||
<u-image :src="cloudPath + 'img/icon_package1.png'" width="34" height="28"></u-image>
|
||||
<view class="text-333 u-m-l-10 nr">券包</view>
|
||||
</view>
|
||||
<view class="text-755023 xs u-m-t-10">
|
||||
<text>2元最低可抵111元/共<text class="primary">1</text>张券</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-relative">
|
||||
<u-image :src="cloudPath + 'img/icon_package2.png'" width="220" height="60"></u-image>
|
||||
<view class="text-755023 u-absolute price xs">￥2.00</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="coupon-bg u-m-t-32">
|
||||
<view class="xxs u-text-center u-p-t-4 text-845F2E">满减券x1</view>
|
||||
<view class="bold-600 u-text-center u-p-t-26">
|
||||
<price-format color="#FF0000" :price="121.99" :subscriptSize="32" :firstSize="52" :secondSize="52"></price-format>
|
||||
</view>
|
||||
<view class="text-D8A658 u-text-center u-p-t-32">满11元可用</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="coupon-list u-m-t-12" v-if="current === 1">
|
||||
<view class="coupon-list-bg row-between" v-for="(item, index) in list" :key="index">
|
||||
<view class="row-start row-column u-row-center u-text-center">
|
||||
<view>
|
||||
<price-format :color="themeColor" :price="item.money" :subscriptSize="40" :firstSize="72" :secondSize="72"></price-format>
|
||||
</view>
|
||||
<view class="full">{{ item.use_condition }}</view>
|
||||
</view>
|
||||
<view class="flex1 u-m-l-80 row-between">
|
||||
<view>
|
||||
<view class="coupon-text bold-600">优惠券</view>
|
||||
<view class="xs u-m-t-20 date">有效期 {{ item.use_time_tips }}天</view>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="mpLogin" hover-class="none" :customStyle="{width: '160rpx', height: '56rpx', backgroundColor: themeColor, color: '#fff', border: 'none', borderRadius: '100rpx', fontSize: '24rpx'}" :hair-line="false">立即兑换</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"
|
||||
import { getCoupon } from "@/api/user"
|
||||
import { getCouponList } from '@/api/activity';
|
||||
|
||||
|
||||
export default {
|
||||
mixins: [MescrollMixin],
|
||||
data() {
|
||||
return {
|
||||
tab: [
|
||||
{
|
||||
name: '购买'
|
||||
},
|
||||
{
|
||||
name: '兑换'
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
upOption:{
|
||||
noMoreSize: 4,
|
||||
empty:{
|
||||
tip: '~ 空空如也 ~', // 提示
|
||||
btnText: '',
|
||||
},
|
||||
textNoMore: '没有更多了'
|
||||
},
|
||||
list: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
change(index) {
|
||||
this.current = index
|
||||
},
|
||||
|
||||
// 初始化数据
|
||||
upCallback(page) {
|
||||
getCouponList({
|
||||
page: page.num,
|
||||
current: this.current,
|
||||
}).then(res => {
|
||||
const {data} = res
|
||||
this.mescroll.endSuccess(data.length, data.totalPages);
|
||||
//设置列表数据
|
||||
if(page.num == 1) this.list = []; //如果是第一页需手动制空列表
|
||||
this.list = this.list.concat(data); //追加新数据
|
||||
}).catch(()=>{
|
||||
this.mescroll.endErr();
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.text-755023 {color: #755023;}
|
||||
.text-845F2E {color: #845F2E;}
|
||||
.text-D8A658 {color: #D8A658;}
|
||||
|
||||
.coupon {
|
||||
.package {
|
||||
background-color: #2D2622;
|
||||
height: 180rpx;
|
||||
|
||||
& > view:first-child {
|
||||
font-size: 64rpx;
|
||||
background: linear-gradient(90deg, #FDE0B4 0%, #FFC07F 100%);
|
||||
letter-spacing: 1px;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
& > view:last-child {
|
||||
font-size: 30rpx;
|
||||
background: linear-gradient(270deg, #FDE0B4 0%, #FFC07F 100%);
|
||||
letter-spacing: 1px;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
background-color: #F6F6F6;
|
||||
border-top-left-radius: 24rpx;
|
||||
border-top-right-radius: 24rpx;
|
||||
top: 160rpx;
|
||||
padding: 30rpx 24rpx;
|
||||
|
||||
.block {
|
||||
height: 386rpx;
|
||||
background: #FBE9CC;
|
||||
border: 2rpx solid #E0B66C;
|
||||
padding: 24rpx 36rpx 24rpx;
|
||||
|
||||
.price {
|
||||
left: 22rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.coupon-bg {
|
||||
width: 207rpx;
|
||||
height: 196rpx;
|
||||
background: url(#{$cloudPath}img/icon_package3.png) no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.coupon-list {
|
||||
.coupon-list-bg {
|
||||
height: 176rpx;
|
||||
background: url(#{$cloudPath}img/icon_coupon2.png) no-repeat;
|
||||
background-size: cover;
|
||||
margin: 0 32rpx 32rpx;
|
||||
padding: 0 32rpx;
|
||||
|
||||
.full {
|
||||
font-size: 20rpx;
|
||||
color: rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
.coupon-text {
|
||||
color: #1D2129;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.date {
|
||||
color: rgba(0, 0, 0, .4);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
89
bundle/pages/coupon/coupon_exchange.vue
Normal file
89
bundle/pages/coupon/coupon_exchange.vue
Normal file
@ -0,0 +1,89 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="item row">
|
||||
<view class="price">
|
||||
<view class="primary">
|
||||
<price-format :subscript-size="40" :first-size="70" :second-size="70" :price="18"></price-format>
|
||||
</view>
|
||||
<view class="full">满20元可用</view>
|
||||
</view>
|
||||
<view class="dashed"> </view>
|
||||
<view class="flex1 u-m-l-40 row-between">
|
||||
<view>
|
||||
<view class="title">优惠券</view>
|
||||
<view class="u-m-t-20 full">有效期3天</view>
|
||||
</view>
|
||||
<view class="exchange">立即兑换</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
margin: 24rpx 24rpx 0;
|
||||
padding-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 176rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0,0,0,0.04);
|
||||
padding: 24rpx;
|
||||
}
|
||||
.item::before,
|
||||
.item::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 210rpx;
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
background: #F6F6F6;
|
||||
border-radius: 50%;
|
||||
z-index: 2;
|
||||
}
|
||||
.item::before {
|
||||
top: -10rpx;
|
||||
}
|
||||
.item::after {
|
||||
bottom: -10rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
width: 194rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.full {
|
||||
color: rgba(0,0,0,0.4);
|
||||
}
|
||||
|
||||
.dashed {
|
||||
border-right: 2px dashed #254062;
|
||||
height: 176rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 40rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
.exchange {
|
||||
width: 159rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
background: #FD414B;
|
||||
border-radius: 28rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
118
bundle/pages/coupon/coupon_list.vue
Normal file
118
bundle/pages/coupon/coupon_list.vue
Normal file
@ -0,0 +1,118 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="use">可使用优惠券</view>
|
||||
<view class="u-m-b-32">
|
||||
<u-checkbox-group style="width: 100%;">
|
||||
<view class="use-block u-relative u-p-24">
|
||||
<view class="coupon u-absolute top-0 left-0">优券</view>
|
||||
<view class="row-between">
|
||||
<view class="u-m-t-22">
|
||||
<view class="md bold">神优惠券</view>
|
||||
<view class="sm u-m-t-8">有效期至2025.04.26</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="primary u-text-center">
|
||||
<price-format :subscript-size="34" :first-size="60" :second-size="50" :price="3" :weight="500"></price-format>
|
||||
<view>
|
||||
满20可用
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-l-32">
|
||||
<u-checkbox v-model="checked" shape="circle" active-color="#FD414B"></u-checkbox>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dashed u-m-t-22 u-m-b-22"></view>
|
||||
<view class="desc">
|
||||
限商品现价+打包费-所有优惠金额满20元使用
|
||||
</view>
|
||||
</view>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
|
||||
<view class="not-use u-m-t-32">不可使用优惠券</view>
|
||||
<view class="opacity5 u-m-b-32">
|
||||
<u-checkbox-group style="width: 100%;" :disabled="true">
|
||||
<view class="use-block u-relative u-p-24">
|
||||
<view class="coupon u-absolute top-0 left-0">优券</view>
|
||||
<view class="row-between">
|
||||
<view class="u-m-t-22">
|
||||
<view class="md bold">神优惠券</view>
|
||||
<view class="sm u-m-t-8">有效期至2025.04.26</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="primary u-text-center">
|
||||
<price-format :subscript-size="34" :first-size="60" :second-size="50" :price="3" :weight="500"></price-format>
|
||||
<view>
|
||||
满20可用
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-l-32">
|
||||
<u-checkbox v-model="checked" shape="circle" active-color="#FD414B"></u-checkbox>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dashed u-m-t-22 u-m-b-22"></view>
|
||||
<view class="desc">
|
||||
限商品现价+打包费-所有优惠金额满20元使用
|
||||
</view>
|
||||
</view>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checked: false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
margin: 24rpx;
|
||||
}
|
||||
.use,
|
||||
.not-use {
|
||||
font-weight: 500;
|
||||
font-size: 30rpx;
|
||||
color: #000000;
|
||||
line-height: 44rpx;
|
||||
text-align: left;
|
||||
margin-bottom: 14rpx;
|
||||
}
|
||||
|
||||
.use-block {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.coupon {
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
width: 73rpx;
|
||||
height: 37rpx;
|
||||
background: linear-gradient( 90deg, #FE7702 0%, #FF27B9 100%);
|
||||
border-radius: 20rpx 0rpx 20rpx 0rpx
|
||||
}
|
||||
|
||||
.dashed {
|
||||
border: 2rpx dashed #D6D1D3;
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: #858687;
|
||||
}
|
||||
}
|
||||
|
||||
.opacity5 {
|
||||
opacity: .5;
|
||||
}
|
||||
</style>
|
||||
143
bundle/pages/coupon/coupon_package.vue
Normal file
143
bundle/pages/coupon/coupon_package.vue
Normal file
@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="item row-between" v-for="(item, index) in 10" :key="index">
|
||||
<view class="coupon2">
|
||||
<view class="coupon-top2">
|
||||
<text>优惠券专享</text>
|
||||
</view>
|
||||
<view class="unit">
|
||||
<view>5</view>
|
||||
<view>元</view>
|
||||
<view class="u-m-l-10 u-m-r-10">x</view>
|
||||
<view>6</view>
|
||||
<view>张</view>
|
||||
</view>
|
||||
<view class="coupon-tips2">
|
||||
满11元可用
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-l-18 flex1 row-between">
|
||||
<view>
|
||||
<view class="xl bold-600">30元神券包</view>
|
||||
<view class="surprise">惊喜折扣减12元</view>
|
||||
<view class="row u-m-t-38">
|
||||
<view class="primary">
|
||||
<price-format :subscript-size="26" :first-size="40" :second-size="40" :price="18" :weight="600"></price-format>
|
||||
</view>
|
||||
<view class="text-858386 u-m-l-8">
|
||||
<price-format :subscript-size="22" :first-size="22" :second-size="22" :price="30" :weight="400"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="buy" style="align-self: flex-end;">购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checked: false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bold-600 {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.text-858386 {
|
||||
color: #858386;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 24rpx 24rpx 0;
|
||||
padding-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(0,0,0,0.04);
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.coupon2 {
|
||||
margin-right: 20rpx;
|
||||
position: relative;
|
||||
width: 258rpx;
|
||||
height: 161rpx;
|
||||
background: #FFF5F3;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.curved-rect {
|
||||
width: 258rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.coupon-top2 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 0;
|
||||
transform: translateX(-50%);
|
||||
width: 136rpx;
|
||||
height: 30rpx;
|
||||
background: #FFEBE3;
|
||||
text-align: center;
|
||||
border-bottom-left-radius: 24rpx;
|
||||
border-bottom-right-radius: 24rpx;
|
||||
color: #F1BFB6;
|
||||
font-size: 22rpx;
|
||||
line-height: 27rpx;
|
||||
}
|
||||
|
||||
.unit {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 40rpx;
|
||||
color: #F90004;
|
||||
font-weight: 600;
|
||||
padding-top: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.coupon-tips2 {
|
||||
background-image: url('/static/coupon_bg.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
height: 66rpx;
|
||||
text-align: center;
|
||||
padding-top: 20rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.surprise {
|
||||
width: 159rpx;
|
||||
height: 31rpx;
|
||||
line-height: 31rpx;
|
||||
padding: 0 6rpx;
|
||||
background-color: #FCEEED;
|
||||
border-radius: 8rpx;
|
||||
color: #EB441A;
|
||||
text-align: center;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
.buy {
|
||||
width: 159rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
background: #FD414B;
|
||||
border-radius: 28rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@ -27,7 +27,7 @@
|
||||
return {
|
||||
list: [
|
||||
{
|
||||
image: "http://jianbing-media.stnav.com/frontend/img/banner.png",
|
||||
image: "https://jianbing-media.stnav.com/frontend/img/banner.png",
|
||||
title: "昨夜星辰昨夜风，画楼西畔桂堂东",
|
||||
},
|
||||
],
|
||||
|
||||
@ -9,28 +9,28 @@
|
||||
|
||||
<view class="u-absolute left-0 right-0 bg-white u-p-t-34 list">
|
||||
<view>
|
||||
<u-tabs :list="list" :is-scroll="true" :current="current" @change="change" inactive-color="#636363" :active-color="themeColor"></u-tabs>
|
||||
<u-tabs :list="tab" :is-scroll="true" :current="current" @change="change" inactive-color="#636363" :active-color="themeColor"></u-tabs>
|
||||
</view>
|
||||
<view class="u-m-l-24 u-m-r-24">
|
||||
<u-line color="#EEE" />
|
||||
</view>
|
||||
<view class="u-m-t-32 u-m-l-24 u-m-r-24">
|
||||
<view class="row-start u-col-top u-m-b-42" v-for="(itme, index) in 10">
|
||||
<view class="row-start u-col-top u-m-b-42" v-for="(item, index) in list">
|
||||
<view>
|
||||
<u-image :src="cloudPath + 'img/banner.png'" width="180" height="180" border-radius="20"></u-image>
|
||||
<u-image :src="cloudPath + item.image" width="180" height="180" border-radius="20"></u-image>
|
||||
</view>
|
||||
|
||||
<view class="u-m-l-18 w-full">
|
||||
<view>小熊早餐必备煮蛋器</view>
|
||||
<view>{{item.title}}</view>
|
||||
<view class="u-m-t-4 text-7c">兑换66人</view>
|
||||
<view class="u-m-t-42 row-between">
|
||||
<view>
|
||||
<text class="primary">100.00</text>
|
||||
<view v-if="item.needMoney">
|
||||
<text class="primary">{{item.point}}</text>
|
||||
<text class="text-7c">积分+</text>
|
||||
<text class="primary">100.00</text>
|
||||
<text class="primary">{{item.money}}</text>
|
||||
<text class="text-7c">元</text>
|
||||
</view>
|
||||
<view>
|
||||
<view class="flex1" style="display: flex;justify-content: flex-end;">
|
||||
<u-button @click="toExchange" hover-class="none" :customStyle="{width: '145rpx', height: '61rpx', backgroundColor: themeColor, color: '#fff', border: 'none', borderRadius: '31rpx'}" :hair-line="false">兑换</u-button>
|
||||
</view>
|
||||
</view>
|
||||
@ -45,7 +45,7 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [
|
||||
tab: [
|
||||
{
|
||||
name: '全部'
|
||||
},
|
||||
@ -53,7 +53,12 @@
|
||||
name: '热门推荐'
|
||||
}
|
||||
],
|
||||
current: 0
|
||||
current: 0,
|
||||
list: [
|
||||
{image: 'img/banner.png', title: '小熊早餐必备煮蛋器', needMoney: true, point: 100, money: 200},
|
||||
{image: 'img/banner.png', title: '满9-2优惠券', needMoney: false, point: 0, money: 0},
|
||||
{image: 'img/banner.png', title: '满15-3优惠券', needMoney: false, point: 0, money: 0},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -125,6 +125,10 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="settle-btn">
|
||||
<u-button @tap="goSettle" shape="circle" :hair-line="false" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '36rpx'}">去结算</u-button>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="u-text-center" style="height: 700rpx;line-height: 700rpx;" v-else>
|
||||
@ -171,6 +175,7 @@
|
||||
page:1,
|
||||
status: loadingType.LOADING,
|
||||
selectIndex: 0,
|
||||
categoryId: 0,
|
||||
cateList: [],
|
||||
goodsList: [],
|
||||
goods_spec: [],
|
||||
@ -251,6 +256,21 @@
|
||||
|
||||
// 添加到购物车(默认商品数量+1,可以让后端连表查询商品数量字段)
|
||||
async addCartFun(item) {
|
||||
console.log("🚀 ~ addCartFun ~ item:", item)
|
||||
|
||||
// 限购逻辑
|
||||
if (item.first_category_id === 1 || item.first_category_id === 2) {
|
||||
// 统计购物车中同类商品的总数量
|
||||
const totalNum = this.cartLists
|
||||
.filter(i => i.first_category_id === item.first_category_id)
|
||||
.reduce((sum, i) => sum + (i.goods_num || 0), 0);
|
||||
|
||||
if (totalNum >= 2) {
|
||||
this.$toast({ title: '该类商品每人限购2件' });
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
const {
|
||||
code,
|
||||
data,
|
||||
@ -285,6 +305,7 @@
|
||||
|
||||
// 获取购物车列表数据
|
||||
getCartListFun() {
|
||||
// 获取商品的分类ID
|
||||
getCartList().then((res) => {
|
||||
if (res.code == 1) {
|
||||
|
||||
@ -307,7 +328,7 @@
|
||||
// // this.cartType = cartType;
|
||||
this.totalPrice = total_amount
|
||||
// // this.isShow = true;
|
||||
// this.getCartNum();
|
||||
this.getCartNum();
|
||||
}
|
||||
});
|
||||
},
|
||||
@ -325,6 +346,8 @@
|
||||
|
||||
// 去结算
|
||||
goSettle() {
|
||||
console.log(this.cartLists)
|
||||
this.showCart = false
|
||||
const goods = this.cartLists.map(item => {
|
||||
return {
|
||||
item_id: item.item_id,
|
||||
@ -334,12 +357,12 @@
|
||||
|
||||
uni.navigateTo({
|
||||
url: "/pages/order_now/order_now?data=" +
|
||||
encodeURIComponent(
|
||||
JSON.stringify({
|
||||
goods,
|
||||
type: "cart",
|
||||
})
|
||||
),
|
||||
encodeURIComponent(
|
||||
JSON.stringify({
|
||||
goods,
|
||||
type: "cart",
|
||||
})
|
||||
),
|
||||
});
|
||||
},
|
||||
|
||||
@ -457,4 +480,7 @@
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.settle-btn {
|
||||
padding: 20rpx;
|
||||
}
|
||||
</style>
|
||||
@ -33,6 +33,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getPhone } from '@/api/user'
|
||||
|
||||
export default {
|
||||
name: "mobile-login",
|
||||
props: {
|
||||
@ -51,22 +53,37 @@
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
onGetPhoneNumber(e) {
|
||||
onGetPhoneNumber(e) {
|
||||
const code = e.detail.code
|
||||
if (e.detail.errMsg === "getPhoneNumber:ok") {
|
||||
// 这里需要解密手机号
|
||||
this.mobile = 110
|
||||
uni.showLoading({
|
||||
title: '获取中',
|
||||
mask: true
|
||||
})
|
||||
getPhone({code}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code === 1) {
|
||||
this.mobile = res.data.phone_info.phoneNumber
|
||||
} else {
|
||||
this.$toast({title: res.msg})
|
||||
return
|
||||
}
|
||||
}).catch(err => {
|
||||
this.$toast({title: '获取手机号失败'})
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// 提交数据
|
||||
handleSubmit(e) {
|
||||
// const {mobile} = this
|
||||
// if (!mobile) return this.$toast({
|
||||
// title: '请授权手机号'
|
||||
// })
|
||||
const {mobile} = this
|
||||
if (!mobile) return this.$toast({
|
||||
title: '请授权手机号'
|
||||
})
|
||||
|
||||
this.$emit('update', {
|
||||
mobile: 15005837859
|
||||
mobile
|
||||
})
|
||||
|
||||
this.showPop = false
|
||||
|
||||
@ -4,11 +4,12 @@
|
||||
:maskCloseAble="false">
|
||||
<view class="popup-content">
|
||||
<view class="u-font-xl bold-600">
|
||||
获取您的昵称和头像
|
||||
<!-- 获取您的昵称和头像 -->
|
||||
获取您的信息
|
||||
</view>
|
||||
<view class="popup-form">
|
||||
<form @submit="handleSubmit">
|
||||
<view class="u-flex u-row-between avatar u-m-t-80">
|
||||
<view class="u-flex u-row-between avatar u-m-t-80" v-if="infoType === 'all' || infoType === 'avatar'">
|
||||
<text>头像</text>
|
||||
<view class="u-flex u-row-between flex1 u-m-l-30">
|
||||
<button style="border: none;" class="u-flex u-row-between w-full" hover-class="none"
|
||||
@ -19,7 +20,7 @@
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between avatar u-m-t-60">
|
||||
<view class="u-flex u-row-between avatar u-m-t-60" v-if="infoType === 'all' || infoType === 'nickname'">
|
||||
<text>昵称</text>
|
||||
<view class="u-flex u-row-between flex1 u-m-l-30">
|
||||
<input
|
||||
@ -55,6 +56,10 @@
|
||||
value: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
infoType: {
|
||||
type: String,
|
||||
default: 'all'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@ -66,6 +71,8 @@
|
||||
methods: {
|
||||
// 头像选择
|
||||
onChooseAvatar(e) {
|
||||
console.log("🚀 ~ onChooseAvatar ~ e:", e)
|
||||
|
||||
const avatarUrl = e.detail.avatarUrl;
|
||||
if (!avatarUrl) {
|
||||
return;
|
||||
@ -78,6 +85,8 @@
|
||||
uploadFile(avatarUrl).then((res) => {
|
||||
uni.hideLoading();
|
||||
this.avatar = res.url;
|
||||
console.log("🚀 ~ onChooseAvatar ~ this.avatar:", this.avatar)
|
||||
|
||||
}).catch(() => {
|
||||
uni.hideLoading();
|
||||
this.$toast({title: "上传失败"});
|
||||
@ -88,13 +97,13 @@
|
||||
handleSubmit(e) {
|
||||
const {nickname} = e.detail.value
|
||||
const {avatar} = this
|
||||
if (!avatar) return this.$toast({
|
||||
title: '请添加头像'
|
||||
})
|
||||
// if (!avatar) return this.$toast({
|
||||
// title: '请添加头像'
|
||||
// })
|
||||
|
||||
if (!nickname) return this.$toast({
|
||||
title: '请输入昵称'
|
||||
})
|
||||
// if (!nickname) return this.$toast({
|
||||
// title: '请输入昵称'
|
||||
// })
|
||||
|
||||
this.$emit('update', {
|
||||
avatar,
|
||||
|
||||
@ -36,10 +36,11 @@
|
||||
<view class="sm text-999" v-if="mode === 'confirm'">
|
||||
<view class="u-line-2" style="color: #1D2129">{{ item.goods_name || item.name }}</view>
|
||||
<view class="u-m-t-4">周一至周日可用</view>
|
||||
<view class="row u-m-t-10">
|
||||
<view class="row-between u-m-t-10">
|
||||
<view class="primary">
|
||||
<price-format :price="item.original_price || item.goods_price" :subscriptSize="22" :firstSize="40" :secondSize="32"></price-format>
|
||||
</view>
|
||||
<view>x{{ item.goods_num }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sm text-999" v-if="mode === 'pay'">
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
v-for="(item, index) in orderList"
|
||||
:key="index"
|
||||
:url="'/pages/order_details/order_details?id=' + item.id">
|
||||
<order-goods :list="item.order_goods" :order_type="item.order_type" :imageRadius="12"
|
||||
<order-goods :list="item.orderGoods" :order_type="item.order_type" :imageRadius="12"
|
||||
:orderDesc="item.order_status_desc" :orderStatus="item.order_status"></order-goods>
|
||||
<view class="u-m-t-26 u-m-b-26 u-p-l-20 u-p-r-20">
|
||||
<u-line color="#EEE" />
|
||||
@ -36,7 +36,7 @@
|
||||
<view v-if="item.order_status > 0 && item.order_status < 4">
|
||||
<u-button @click.stop="seeDetails(item.id)" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">查看详情</u-button>
|
||||
</view>
|
||||
<view v-if="item.order_status == 4">
|
||||
<view v-if="item.order_status == 4 && ( type == 'delivery' || type == 'finish')">
|
||||
<u-button @click.stop="toRefund(item.id, item.order_goods)" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">申请退款</u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -20,7 +20,7 @@ const baseURLMap = {
|
||||
// development: 'https://jb.stnav.com',
|
||||
// 生产环境https://php-b2c.likeshop.cn
|
||||
|
||||
production: IS_H5 ? location.origin : 'https://jb.stnav.com'
|
||||
production: IS_H5 ? location.origin : 'https://jianbing.stnav.com'
|
||||
}
|
||||
|
||||
const baseURL = SWITCH_DEVELOPMENT ? baseURLMap['development'] : baseURLMap[process.env.NODE_ENV]
|
||||
|
||||
@ -50,7 +50,7 @@
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx5e2c7a2204b66251",
|
||||
"appid" : "wx842b054d24ba5c85",
|
||||
"setting" : {
|
||||
"urlCheck" : false,
|
||||
"minified" : true
|
||||
|
||||
@ -9,7 +9,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
primaryColor: '#FF2C3C',
|
||||
cloudPath: 'http://jianbing-media.stnav.com/frontend/',
|
||||
cloudPath: 'https://jianbing-media.stnav.com/frontend/',
|
||||
themeColor: '#254062'
|
||||
}
|
||||
},
|
||||
|
||||
18
pages.json
18
pages.json
@ -206,6 +206,24 @@
|
||||
"style": {
|
||||
"navigationBarTitleText": "申请售后"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/coupon/coupon_list",
|
||||
"style": {
|
||||
"navigationBarTitleText": "优惠券"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/coupon/coupon_package",
|
||||
"style": {
|
||||
"navigationBarTitleText": "优惠券包"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/coupon/coupon_exchange",
|
||||
"style": {
|
||||
"navigationBarTitleText": "兑换券"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<view class="flex1 u-line-1">
|
||||
<view class="lg bold-400 u-flex">
|
||||
<navigator class="u-flex" url="/pages/store/choose_store" hover-class="none">
|
||||
MEET轻食店
|
||||
时光煎饼店
|
||||
<u-icon name="arrow-right" size="28" class="right-icon"></u-icon>
|
||||
</navigator>
|
||||
</view>
|
||||
@ -66,7 +66,7 @@
|
||||
<view class="u-text-center">
|
||||
<navigator url="/pages/store/store?type=2" hover-class="none">
|
||||
<view class="text-default xxl">现在点单</view>
|
||||
<view class="xs text-999">下单更便捷</view>
|
||||
<view class="xs text-999">预约下单更便捷</view>
|
||||
<view class="u-flex u-row-center">
|
||||
<u-image :src="cloudPath + 'img/icon_order.png'" width="132" height="133" mode="aspectFit"></u-image>
|
||||
</view>
|
||||
|
||||
@ -6,19 +6,18 @@
|
||||
|
||||
<view class="u-text-center text-gray">
|
||||
<view>小程序需要登录注册才能使用相关功能，申请获取以下权限</view>
|
||||
<view class="u-m-t-20">获得你的公开信息(昵称、头像、手机号码等)</view>
|
||||
<!-- <view class="u-m-t-20">获得你的公开信息(昵称、头像、手机号码等)</view> -->
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-56">
|
||||
<!-- #ifdef MP -->
|
||||
<view class="u-m-b-32">
|
||||
<!-- <view class="u-m-b-32">
|
||||
<u-button @click="mpLogin" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :hair-line="false" shape="circle">快捷登录</u-button>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
<view>
|
||||
<u-button @click="mobileLogin" hover-class="none" :customStyle="{color: themeColor, border: '1px solid ' + themeColor, padding: '16rpx 0'}" :plain="true" :hair-line="false" shape="circle">手机号登录/注册</u-button>
|
||||
<u-button @click="mobileLogin" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :plain="true" :hair-line="false" shape="circle">手机号登录/注册</u-button>
|
||||
</view>
|
||||
|
||||
<!-- <u-button @click="testLogin" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :hair-line="false" shape="circle">测试账号一键登录</u-button> -->
|
||||
</view>
|
||||
|
||||
@ -141,13 +140,12 @@
|
||||
|
||||
// 更新新注册的用户信息
|
||||
async handleSubmitMobile(e) {
|
||||
mobileLogin({
|
||||
mobile: e.mobile
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.loginHandle(res.data)
|
||||
}
|
||||
})
|
||||
console.log("🚀 ~ handleSubmitMobile ~ e:", e)
|
||||
const wxCode = await getWxCode()
|
||||
const res = await accountLogin({ account: e.mobile, code: wxCode, client })
|
||||
if (res.code == 1) {
|
||||
this.loginHandle(res.data)
|
||||
}
|
||||
},
|
||||
|
||||
// 登录结果处理
|
||||
|
||||
@ -80,7 +80,7 @@
|
||||
<view class="nr bold-600">服务功能</view>
|
||||
<view>
|
||||
<u-grid :col="4" :border="false">
|
||||
<u-grid-item v-for="(item, index) in menuList[1]['content']['data']" :key="index" @click="tapMenu(item.link.path)">
|
||||
<u-grid-item v-for="(item, index) in menuList" :key="index" @click="tapMenu(item.link)">
|
||||
<u-image :src="item.image" width="64" height="64"></u-image>
|
||||
<view class="grid-text mt10">{{item.name}}</view>
|
||||
</u-grid-item>
|
||||
@ -127,9 +127,7 @@
|
||||
type: 2
|
||||
})
|
||||
if (code == 1) {
|
||||
this.menuList = data
|
||||
console.log("this.menuList>>>", this.menuList);
|
||||
return false;
|
||||
this.menuList = data[1].content.data
|
||||
}
|
||||
},
|
||||
|
||||
@ -137,7 +135,7 @@
|
||||
tapMenu(path) {
|
||||
if (!this.isLogin) return toLogin()
|
||||
uni.navigateTo({
|
||||
url: path
|
||||
url: path.path
|
||||
})
|
||||
// menuJump(item)
|
||||
},
|
||||
|
||||
@ -2,7 +2,8 @@
|
||||
<view>
|
||||
<view class="u-m-t-34" @tap="chooseAvatar">
|
||||
<view class="row-center">
|
||||
<u-avatar :src="userInfo.avatar ? userInfo.avatar : cloudPath + 'img/icon_avatar_empty2.png'" size="142"></u-avatar>
|
||||
<u-avatar v-if="userInfo.avatar" :src="userInfo.avatar" size="142"></u-avatar>
|
||||
<u-icon v-if="!userInfo.avatar" name="account-fill" size="142"></u-icon>
|
||||
</view>
|
||||
<view class="nr text-default u-text-center u-m-t-16">
|
||||
点击更换头像
|
||||
@ -20,7 +21,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="nr row-between u-col-center u-m-t-48" @tap="changeMobile">
|
||||
<!-- <view class="nr row-between u-col-center u-m-t-48" @tap="changeMobile">
|
||||
<view style="width: 100rpx;">手机号</view>
|
||||
<view class="flex1 u-m-l-80 row u-row-between u-col-center">
|
||||
<view>{{formatPhone(userInfo.mobile)}}</view>
|
||||
@ -28,7 +29,7 @@
|
||||
<u-image :src="cloudPath + 'img/icon_arrow_right.png'" width="44" height="44"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<view class="fixed left-0 right-0 save">
|
||||
@ -56,6 +57,7 @@
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<mplogin v-model="mp.showPopup" :info-type="mp.type" @close="mp.showPopup = false" @update="handleSubmitInfo"/>
|
||||
<mobile-login v-model="mobile.showPopup" @close="mobile.showPopup = false" :hideCancleBtn="false" @update="updateMobile"/>
|
||||
</view>
|
||||
</template>
|
||||
@ -82,6 +84,10 @@
|
||||
},
|
||||
mobile: {
|
||||
showPopup: false,
|
||||
},
|
||||
mp: {
|
||||
showPopup: false,
|
||||
type: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -94,32 +100,42 @@
|
||||
uni.$on('uAvatarCropper', (path) => {
|
||||
this.uploadImage(path)
|
||||
})
|
||||
|
||||
console.log("🚀 ~ onLoad ~ userInfo:", this.userInfo)
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 修改头像
|
||||
chooseAvatar() {
|
||||
this.fieldType = FieldType.AVATAR
|
||||
uni.$u.route({
|
||||
// 关于此路径，请见下方"注意事项"
|
||||
url: '/components/uview-ui/components/u-avatar-cropper/u-avatar-cropper',
|
||||
// 内部已设置以下默认参数值，可不传这些参数
|
||||
params: {
|
||||
// 输出图片宽度，高等于宽，单位px
|
||||
destWidth: 300,
|
||||
// 裁剪框宽度，高等于宽，单位px
|
||||
rectWidth: 300,
|
||||
// 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可
|
||||
fileType: 'jpg'
|
||||
}
|
||||
})
|
||||
// uni.$u.route({
|
||||
// // 关于此路径，请见下方"注意事项"
|
||||
// url: '/components/uview-ui/components/u-avatar-cropper/u-avatar-cropper',
|
||||
// // 内部已设置以下默认参数值，可不传这些参数
|
||||
// params: {
|
||||
// // 输出图片宽度，高等于宽，单位px
|
||||
// destWidth: 300,
|
||||
// // 裁剪框宽度，高等于宽，单位px
|
||||
// rectWidth: 300,
|
||||
// // 输出的图片类型，如果'png'类型发现裁剪的图片太大，改成"jpg"即可
|
||||
// fileType: 'jpg'
|
||||
// }
|
||||
// })
|
||||
|
||||
// 选择头像
|
||||
this.mp.showPopup = true
|
||||
this.mp.type = 'avatar'
|
||||
},
|
||||
|
||||
// 修改昵称
|
||||
changeName() {
|
||||
this.fieldType = FieldType.NICKNAME
|
||||
this.nickname.value = ''
|
||||
this.nickname.showPopup = true
|
||||
// this.nickname.value = ''
|
||||
// this.nickname.showPopup = true
|
||||
|
||||
// 选择昵称
|
||||
this.mp.showPopup = true
|
||||
this.mp.type = 'nickname'
|
||||
},
|
||||
|
||||
// 确认修改昵称
|
||||
@ -196,15 +212,22 @@
|
||||
if (p) {
|
||||
return p.substring(0, 3) + '****' + p.substring(7)
|
||||
}
|
||||
|
||||
return ''
|
||||
},
|
||||
|
||||
handleSubmitInfo(e) {
|
||||
if (this.mp.type === 'avatar') {
|
||||
this.setUserInfo(e.avatar)
|
||||
} else if (this.mp.type === 'nickname') {
|
||||
this.setUserInfo(e.nickname)
|
||||
}
|
||||
},
|
||||
|
||||
save() {
|
||||
uni.switchTab({
|
||||
url: '/pages/my/my'
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState(['token']),
|
||||
|
||||
@ -22,11 +22,13 @@
|
||||
},
|
||||
{
|
||||
name: '待付款',
|
||||
type: orderType.PAY
|
||||
type: orderType.PAY,
|
||||
count: 1
|
||||
},
|
||||
{
|
||||
name: '未制作',
|
||||
type: orderType.DELIVERY
|
||||
type: orderType.DELIVERY,
|
||||
count: 5
|
||||
},
|
||||
{
|
||||
name: '已完成',
|
||||
|
||||
@ -141,7 +141,7 @@
|
||||
<view>2022-11-10 15:26:07</view>
|
||||
</view>
|
||||
<view class="u-m-t-8 row-between">
|
||||
<view>发货时间：</view>
|
||||
<view>取餐时间：</view>
|
||||
<view>2022-11-10 15:26:07</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -154,14 +154,14 @@
|
||||
<!-- <u-button class="flex1" @click="mpLogin" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :hair-line="false">立即支付</u-button> -->
|
||||
</view>
|
||||
|
||||
<view class="fixed row-end u-text-center btn-group bg-white u-p-t-20" v-if="orderDetail.order_status > 0">
|
||||
<!-- <view class="fixed row-end u-text-center btn-group bg-white u-p-t-20" v-if="orderDetail.order_status > 0">
|
||||
<view class="mr20">
|
||||
<u-button @click="mobileLogin" hover-class="none" :customStyle="{width: '160rpx', height: '60rpx', color: themeColor, border: '1px solid ' + themeColor, padding: '16rpx 0', borderRadius: '8rpx'}" :plain="true" :hair-line="false">查看物流</u-button>
|
||||
</view>
|
||||
<view class="u-m-r-34">
|
||||
<u-button @click="mpLogin" hover-class="none" :customStyle="{width: '160rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0', borderRadius: '8rpx'}" :hair-line="false">确认收货</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<order-dialog ref="orderDialog" :orderId="orderDetail.id" :type="type" @refresh="onRefresh"></order-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -448,10 +448,9 @@ export default {
|
||||
|
||||
try {
|
||||
const { code, data, msg } = await orderBuy(from)
|
||||
|
||||
if (code == 1) {
|
||||
uni.redirectTo({
|
||||
url: `/pages/payment/payment?from=${data.type}&order_id=${data.order_id}`
|
||||
url: `/pages/payment/payment?from=${data.data.type}&order_id=${data.data.order_id}`
|
||||
})
|
||||
} else {
|
||||
throw new Error(msg)
|
||||
|
||||
@ -93,7 +93,7 @@
|
||||
<view>2022-11-10 15:26:07</view>
|
||||
</view>
|
||||
<view class="u-m-t-8 row-between">
|
||||
<view>发货时间：</view>
|
||||
<view>取餐时间：</view>
|
||||
<view>2022-11-10 15:26:07</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -62,11 +62,15 @@
|
||||
</view>
|
||||
|
||||
<view class="fixed bg-white row-between px48 u-p-t-20 u-p-b-20">
|
||||
<view class="column u-text-center">
|
||||
<view class="column u-text-center u-relative" @click="addCartFun">
|
||||
<view class="row-center">
|
||||
<u-image :src="cloudPath + 'img/icon_store.png'" width="48" height="48"></u-image>
|
||||
<!-- <u-image src="/static/tabbar/tab_cart.png" width="48" height="48"></u-image> -->
|
||||
<u-icon name="shopping-cart" size="48" color="#254062"></u-icon>
|
||||
</view>
|
||||
<view>购物车</view>
|
||||
<view class="u-absolute top-0 right-0 text-fff number u-text-center xxs" v-if="cartNum">
|
||||
{{ cartNum }}
|
||||
</view>
|
||||
<view>门店</view>
|
||||
</view>
|
||||
<view class="u-m-l-64 flex1">
|
||||
<u-button hover-class="none" @click="showSpecFun"
|
||||
@ -78,13 +82,18 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<shop-spec v-model="showSpec" :name="goods.name" :goods="goods" @close="showSpec = false" @confirm="confirmSpec" @buynow="onBuy"></shop-spec>
|
||||
<shop-spec v-model="showSpec" :name="goods.name" :goods="goods" @close="closePopup" @confirm="confirmSpec" @buynow="onBuy"></shop-spec>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapActions,
|
||||
mapGetters
|
||||
} from 'vuex';
|
||||
import {
|
||||
getGoodsDetail,
|
||||
getCartList,
|
||||
addCart,
|
||||
getPoster,
|
||||
getCartNum
|
||||
@ -101,6 +110,9 @@
|
||||
goods: [],
|
||||
spec: [],
|
||||
checkedGoods: {},
|
||||
source: '',
|
||||
cartLists: [],
|
||||
totalPrice: 0,
|
||||
}
|
||||
},
|
||||
|
||||
@ -110,9 +122,13 @@
|
||||
|
||||
onShow() {
|
||||
this.getGoodsDetailFun();
|
||||
this.getCartNum()
|
||||
this.getCartListFun()
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapActions(['getCartNum']),
|
||||
|
||||
// 获取商品详情
|
||||
async getGoodsDetailFun() {
|
||||
const {
|
||||
@ -124,10 +140,44 @@
|
||||
if (code == 1) {
|
||||
this.goods = data
|
||||
console.log(this.goods.goods_image);
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// 获取购物车列表数据
|
||||
getCartListFun() {
|
||||
// 获取商品的分类ID
|
||||
getCartList().then((res) => {
|
||||
if (res.code == 1) {
|
||||
let {
|
||||
lists,
|
||||
total_amount
|
||||
} = res.data;
|
||||
this.cartLists = lists;
|
||||
// // let cartType = 0;
|
||||
|
||||
// // if (lists.length == 0) {
|
||||
// // cartType = 2;
|
||||
// // } else {
|
||||
// // cartType = 1;
|
||||
// // }
|
||||
|
||||
// this.cartLists = list;
|
||||
// console.log(">>>", this.cartLists);
|
||||
|
||||
// // this.cartType = cartType;
|
||||
this.totalPrice = total_amount
|
||||
// // this.isShow = true;
|
||||
this.getCartNum();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 将当前的商品添加到购物车里面
|
||||
addCartFun() {
|
||||
this.source = 'cart'
|
||||
this.showSpec = true
|
||||
},
|
||||
|
||||
// 打开商品规格
|
||||
openSpec() {
|
||||
this.showSpec = true
|
||||
@ -138,6 +188,7 @@
|
||||
console.log("data>>>", data.spec);
|
||||
this.spec = data.spec
|
||||
this.showSpec = false
|
||||
this.source = ''
|
||||
},
|
||||
|
||||
onChangeGoods(e) {
|
||||
@ -151,17 +202,46 @@
|
||||
this.showSpec = true;
|
||||
},
|
||||
|
||||
closePopup() {
|
||||
this.source = ''
|
||||
},
|
||||
|
||||
// 购买商品
|
||||
onBuy(e) {
|
||||
let {id, goodsNum} = e.detail
|
||||
let goods = [{item_id: id, num: goodsNum}]
|
||||
const params = {goods}
|
||||
this.showSpec = false
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_now/order_now?data=' + encodeURIComponent((JSON.stringify(params)))
|
||||
})
|
||||
if (this.source === 'cart') {
|
||||
// 限购逻辑:套餐和单品内的商品列表，每个都是只能购买两个
|
||||
console.log("🚀 ~ onBuy ~ this.goods:", this.goods)
|
||||
if (this.goods.first_category_id == 1 || this.goods.first_category_id == 2) {
|
||||
const totalNum = this.cartLists
|
||||
.filter(i => i.first_category_id === this.goods.first_category_id)
|
||||
.reduce((sum, i) => sum + (i.goods_num || 0), 0);
|
||||
|
||||
if (totalNum >= 2) {
|
||||
this.$toast({ title: '该类商品每人限购2件' });
|
||||
return;
|
||||
} else {
|
||||
addCart({
|
||||
item_id: this.goods.id,
|
||||
goods_num: 1
|
||||
}).then(res => {
|
||||
this.getCartListFun()
|
||||
});
|
||||
}
|
||||
}
|
||||
} else {
|
||||
let {id, goodsNum} = e.detail
|
||||
let goods = [{item_id: id, num: goodsNum}]
|
||||
const params = {goods}
|
||||
this.showSpec = false
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_now/order_now?data=' + encodeURIComponent((JSON.stringify(params)))
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['cartNum']),
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -183,4 +263,13 @@
|
||||
right: 0;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.number {
|
||||
background-color: #FF2C3C;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -155,7 +155,7 @@
|
||||
.signin {
|
||||
height: 570rpx;
|
||||
margin: 24rpx 20rpx 0;
|
||||
background-image: url(http://jianbing-media.stnav.com/frontend/img/signin-bg.png);
|
||||
background-image: url(https://jianbing-media.stnav.com/frontend/img/signin-bg.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
|
||||
@ -19,6 +19,9 @@
|
||||
<u-button shape="circle" :hair-line="false" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '36rpx'}" @click="signin">自取</u-button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="">
|
||||
<u-alert-tips type="warning" title="当前门店已休息"></u-alert-tips>
|
||||
</view>
|
||||
<cate-one :list="cateList"></cate-one>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
BIN
static/coupon_bg.png
Normal file
BIN
static/coupon_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Reference in New Issue
Block a user