Compare commits
14 Commits
ddd3dd981a
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
| 55205f6e4d | |||
| ff5e4af2d4 | |||
| 9c0be00fbd | |||
| 462073058e | |||
| cdf7e721c5 | |||
| 7ae003c61f | |||
| 2b0d3c9c20 | |||
| a92a6c5baf | |||
| dab4dba0fe | |||
| 53fbee0ca9 | |||
| 8452fb9479 | |||
| c07a065e50 | |||
| 1144c1e3fe | |||
| 769987755d |
16
.hbuilderx/launch.json
Normal file
16
.hbuilderx/launch.json
Normal file
@ -0,0 +1,16 @@
|
||||
{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
||||
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
|
||||
"version": "0.0",
|
||||
"configurations": [{
|
||||
"default" :
|
||||
{
|
||||
"launchtype" : "local"
|
||||
},
|
||||
"mp-weixin" :
|
||||
{
|
||||
"launchtype" : "local"
|
||||
},
|
||||
"type" : "uniCloud"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -66,6 +66,7 @@ export function getVerifyLists(data) {
|
||||
params: data,
|
||||
});
|
||||
}
|
||||
|
||||
// 核销详情
|
||||
export function verification(data) {
|
||||
return request.post("order/verification", data);
|
||||
@ -75,11 +76,18 @@ export function verification(data) {
|
||||
export function verificationConfirm(data) {
|
||||
return request.post("order/verificationConfirm", data);
|
||||
}
|
||||
|
||||
//确认收货组件
|
||||
export function getwxReceiveDetail(params) {
|
||||
return request.get("order/wxReceiveDetail", { params });
|
||||
}
|
||||
|
||||
//查询确认收货
|
||||
export function getwechatSyncCheck(params) {
|
||||
return request.get("order/wechatSyncCheck", { params });
|
||||
}
|
||||
|
||||
// 店铺预约时间
|
||||
export function yuyueTime(data) {
|
||||
return request.post("order/yuyueTime", data)
|
||||
}
|
||||
|
||||
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)
|
||||
}
|
||||
|
||||
@ -76,7 +76,8 @@ export default {
|
||||
addressList: [],
|
||||
hasAddress: true,
|
||||
deleteSure: false,
|
||||
currentId: 0
|
||||
currentId: 0,
|
||||
type: 0
|
||||
}
|
||||
},
|
||||
|
||||
@ -98,6 +99,7 @@ export default {
|
||||
|
||||
methods: {
|
||||
onSelect(e) {
|
||||
console.log("e>>>", e);
|
||||
if (this.type) {
|
||||
let { id } = e.currentTarget.dataset
|
||||
uni.$emit('selectaddress', {
|
||||
|
||||
359
bundle/pages/apply_refund/apply_refund.vue
Normal file
359
bundle/pages/apply_refund/apply_refund.vue
Normal file
@ -0,0 +1,359 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- pages/apply_refund/apply_refund.wxml -->
|
||||
<view class="apply-refund">
|
||||
<view class="goods">
|
||||
<view class="row">
|
||||
<u-image width="160rpx" height="160rpx" radius="6rpx" lazy-load :src="goods.image" />
|
||||
<view class="goods-info">
|
||||
<view class="nr line2">{{ goods.goods_name }}</view>
|
||||
<view class="xs muted mt10">{{ goods.spec_value }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="opt-box mt20" :hidden="hiddenOpt">
|
||||
<view class="opt-item row-between border-line" @tap="onlyRefund">
|
||||
<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 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 :hidden="!hiddenOpt">
|
||||
<view class="refund-info row-between mt20">
|
||||
<view class="lable">数量</view>
|
||||
<view>{{ goods.goods_num }}</view>
|
||||
</view>
|
||||
<view class="refund-info row-between">
|
||||
<view class="lable">退款金额</view>
|
||||
<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" /> -->
|
||||
</view>
|
||||
<view class="refund-info row-between" @tap="showPopup">
|
||||
<view class="lable">退款原因</view>
|
||||
<view class="row">
|
||||
<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> -->
|
||||
</view>
|
||||
</view>
|
||||
<!-- <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 class="upload bg-white">
|
||||
<view class="title row-between">
|
||||
<view>上传凭证</view>
|
||||
<view class="muted">（选填，最多可上传1张）</view>
|
||||
</view>
|
||||
<uploader :deletable="true" preview-size="160rpx" :file-list="fileList" @after-read="afterRead"
|
||||
@delete="deleteImage" image-fit="aspectFill" />
|
||||
</view>
|
||||
<button class="btn br60" type="primary" size="lg" @tap="onSubmit">
|
||||
申请退款
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-popup id="popup" v-model="showPop" mode="bottom">
|
||||
<view class="pop-container bg-white">
|
||||
<view class="pop-header row-center md normal"> 退款原因 </view>
|
||||
<scroll-view style="height: 800rpx" :scroll-y="true">
|
||||
<view class="reason-box mt20">
|
||||
<radio-group @change="radioChange">
|
||||
<label v-for="(item, index) in reason" :key="index" class="reason-item row-between"
|
||||
@tap="hidePopup">
|
||||
<view class="reason-desc nr">
|
||||
{{ item }}
|
||||
</view>
|
||||
<radio :value="index"></radio>
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { refundOptType } from "@/utils/type";
|
||||
import { baseURL } from "@/config/app";
|
||||
import { getGoodsInfo, applyAfterSale, applyAgain } from "@/api/user";
|
||||
import { uploadFile, trottle } from "@/utils/tools.js";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
hiddenOpt: false,
|
||||
optTyle: refundOptType.ONLY_REFUND,
|
||||
goods: {},
|
||||
reason: [],
|
||||
showPop: false,
|
||||
reasonIndex: -1,
|
||||
fileList: [],
|
||||
remark: "",
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
let { order_id, item_id, afterSaleId } = options;
|
||||
this.orderId = order_id;
|
||||
this.itemId = item_id;
|
||||
this.afterSaleId = afterSaleId;
|
||||
this.getGoodsInfoFun();
|
||||
|
||||
this.onSubmit = trottle(this.onSubmit, 1000, this);
|
||||
},
|
||||
|
||||
methods: {
|
||||
showPopup() {
|
||||
this.showPop = true;
|
||||
},
|
||||
|
||||
radioChange(e) {
|
||||
this.reasonIndex = e.detail.value;
|
||||
},
|
||||
|
||||
hidePopup() {
|
||||
this.showPop = false;
|
||||
},
|
||||
|
||||
onlyRefund: function () {
|
||||
this.optTyle = refundOptType.ONLY_REFUND;
|
||||
this.hiddenOpt = true;
|
||||
},
|
||||
|
||||
allRefunds() {
|
||||
this.optTyle = refundOptType.REFUNDS;
|
||||
this.hiddenOpt = true;
|
||||
},
|
||||
|
||||
onSubmit() {
|
||||
console.log(this.afterSaleId);
|
||||
|
||||
if (this.afterSaleId) {
|
||||
this.applyAgainFun();
|
||||
} else {
|
||||
this.applyAfterSaleFun();
|
||||
}
|
||||
},
|
||||
|
||||
// 重新申请
|
||||
applyAgainFun() {
|
||||
let { reason, reasonIndex, optTyle, remark, fileList } = this;
|
||||
|
||||
// if (!reason[reasonIndex]) {
|
||||
// return this.$toast({
|
||||
// title: "请选择退款原因",
|
||||
// });
|
||||
// }
|
||||
|
||||
const data = {
|
||||
id: this.afterSaleId,
|
||||
reason: reason,
|
||||
refund_type: optTyle,
|
||||
remark: remark,
|
||||
img: fileList.length <= 0 ? "" : fileList[0].base_url,
|
||||
};
|
||||
applyAgain(data).then((res) => {
|
||||
if (res.code == 1) {
|
||||
uni.$emit("refreshsale");
|
||||
this.$toast(
|
||||
{
|
||||
title: res.msg,
|
||||
},
|
||||
{
|
||||
tab: 5,
|
||||
url:
|
||||
"/bundle/pages/after_sales_detail/after_sales_detail?afterSaleId=" +
|
||||
res.data.after_sale_id,
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
onInput(e) {
|
||||
this.setData({
|
||||
remark: e.detail.value,
|
||||
});
|
||||
this.remark = e.detail.value;
|
||||
},
|
||||
|
||||
applyAfterSaleFun() {
|
||||
let { refundMoney, reason, reasonIndex, optTyle, remark, fileList } = this;
|
||||
|
||||
if (!refundMoney) {
|
||||
return this.$toast({
|
||||
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,
|
||||
img: fileList.length <= 0 ? "" : fileList[0].url,
|
||||
};
|
||||
applyAfterSale(data).then((res) => {
|
||||
if (res.code == 1) {
|
||||
uni.$emit("refreshsale");
|
||||
this.$toast({
|
||||
title: "提交成功",
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url:
|
||||
"/bundle/pages/after_sales_detail/after_sales_detail?afterSaleId=" +
|
||||
res.data.after_sale_id,
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
afterRead(e) {
|
||||
const file = e;
|
||||
uni.showLoading({
|
||||
title: "正在上传中...",
|
||||
mask: true,
|
||||
});
|
||||
file.map((item) => {
|
||||
uploadFile(item.path).then((res) => {
|
||||
uni.hideLoading();
|
||||
this.fileList.push(res);
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
deleteImage(index) {
|
||||
this.fileList.splice(index, 1);
|
||||
},
|
||||
|
||||
getGoodsInfoFun() {
|
||||
let { orderId, itemId } = this;
|
||||
getGoodsInfo({
|
||||
order_id: orderId,
|
||||
item_id: itemId,
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.goods = res.data.goods;
|
||||
// this.reason = res.data.reason;
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
/* pages/apply_refund/apply_refund.wxss */
|
||||
.apply-refund {
|
||||
padding-bottom: 50rpx;
|
||||
|
||||
.goods {
|
||||
padding: 20rpx 0;
|
||||
background-color: white;
|
||||
padding: 20rpx 24rpx;
|
||||
|
||||
.goods-info {
|
||||
margin-left: 24rpx;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.opt-box {
|
||||
.opt-item {
|
||||
padding: 20rpx 20rpx 20rpx 30rpx;
|
||||
background-color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.border-line {
|
||||
border: 1px solid #f2f2f2;
|
||||
}
|
||||
|
||||
.apply-refund {
|
||||
.refund-info {
|
||||
background-color: #fff;
|
||||
padding: 24rpx 20rpx;
|
||||
border-bottom: var(--border);
|
||||
|
||||
.label {
|
||||
align-self: start;
|
||||
width: 140rpx;
|
||||
line-height: 36rpx;
|
||||
margin-top: 19rpx;
|
||||
}
|
||||
|
||||
textarea {
|
||||
flex: 1;
|
||||
height: 172rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.upload {
|
||||
padding: 0 20rpx 20rpx;
|
||||
|
||||
.title {
|
||||
padding: 24rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 680rpx;
|
||||
margin-top: 30rpx;
|
||||
margin-left: 26rpx;
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.pop-header {
|
||||
line-height: 42rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.reason-box {
|
||||
.reason-item {
|
||||
padding: 24rpx 20rpx;
|
||||
|
||||
.reason-desc {
|
||||
line-height: 46rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -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: 1,
|
||||
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: {
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<view>
|
||||
<u-cell-group :border="false">
|
||||
<u-cell-item title="退出登录" @click="logout" hover-class="none"></u-cell-item>
|
||||
<u-cell-item title="收货地址" @click="toAddress" :border-bottom="false" hover-class="none"></u-cell-item>
|
||||
<!-- <u-cell-item title="收货地址" @click="toAddress" :border-bottom="false" hover-class="none"></u-cell-item> -->
|
||||
</u-cell-group>
|
||||
|
||||
<u-modal v-model="showLogout" :content="content" :show-cancel-button="true" @confirm="confirmLogout"></u-modal>
|
||||
|
||||
@ -1,13 +1,16 @@
|
||||
<template>
|
||||
<view>
|
||||
<u-popup v-model="showPop" mode="bottom" border-radius="16" :safe-area-inset-bottom="true" :closeable="true">
|
||||
<view class="appointment-time">
|
||||
<view class="bold-700 lg u-p-t-24 u-p-b-24 u-text-center">选择预约时间</view>
|
||||
<view class="block row" style="height: 700rpx;">
|
||||
<u-popup v-model="showPop" mode="bottom" border-radius="16" :safe-area-inset-bottom="true" >
|
||||
<view class="appointment-time u-relative">
|
||||
<view class="bold-700 lg u-p-t-30 u-p-b-30 u-text-center time-text">选择预约时间</view>
|
||||
<view class="u-absolute close" @click="onClose">
|
||||
<u-icon size="40" name="close"></u-icon>
|
||||
</view>
|
||||
<view class="block row" style="height: 560rpx;">
|
||||
<view class="aside">
|
||||
<scroll-view style="height: 100%;" scroll-y="true" scroll-with-animation="true">
|
||||
<view style="padding-bottom: 200rpx;">
|
||||
<block v-for="(item, index) in cateList" :key="index">
|
||||
<block v-for="(item, index) in dateList" :key="index">
|
||||
<view :class="'one-item sm ' + (index == selectIndex ? 'active bg-white' : '')" @click="changeActive(index)">
|
||||
<text class="name">{{ item.name }}</text>
|
||||
<view v-if="index == selectIndex" class="active-line bg-default"></view>
|
||||
@ -19,9 +22,9 @@
|
||||
|
||||
<view class="main">
|
||||
<scroll-view style="height: 100%" scroll-y="true" scroll-with-animation="true">
|
||||
<view class="main-wrap u-m-t-32">
|
||||
<view class="bg-white br16 row u-col-top u-m-b-24" v-for="(item, index) in 20" :key="index">
|
||||
<view>9：00 - 9：30</view>
|
||||
<view class="main-wrap">
|
||||
<view class="bg-white br16 row u-col-top nr time-block" v-for="(item, index) in timeList" :key="index" @click="selectTime(index)">
|
||||
<view>{{ item.start_time }}-{{ item.end_time }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
@ -33,9 +36,11 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCatrgory} from '@/api/store'
|
||||
import {yuyueTime} from '@/api/order'
|
||||
|
||||
export default {
|
||||
name: "appointment-time",
|
||||
|
||||
props: {
|
||||
value: {
|
||||
type: Boolean,
|
||||
@ -46,25 +51,44 @@
|
||||
return {
|
||||
mobile: '',
|
||||
selectIndex: 0,
|
||||
cateList: []
|
||||
cateList: [],
|
||||
dateList: [],
|
||||
timeList: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getCatrgoryFun()
|
||||
this.dateList = [
|
||||
{'name': '今天'},
|
||||
{'name': '明天'}
|
||||
]
|
||||
|
||||
this.getYuYueTime()
|
||||
},
|
||||
methods: {
|
||||
getCatrgoryFun() {
|
||||
getCatrgory().then(res => {
|
||||
if (res.code == 1) {
|
||||
this.cateList = res.data
|
||||
}
|
||||
});
|
||||
// 获取预约时间
|
||||
getYuYueTime() {
|
||||
const store_id = 1
|
||||
yuyueTime({store_id}).then((res) => {
|
||||
this.timeList = res.data
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
changeActive(index) {
|
||||
const {cateList} = this
|
||||
this.selectIndex = index
|
||||
},
|
||||
|
||||
// 选择时间
|
||||
selectTime(index) {
|
||||
const day = this.dateList[this.selectIndex].name
|
||||
const time_id = this.timeList[index].id
|
||||
const time = this.timeList[index].start_time + '-' + this.timeList[index].end_time
|
||||
this.$emit('update', {
|
||||
day,
|
||||
time_id,
|
||||
time
|
||||
})
|
||||
},
|
||||
|
||||
// 提交数据
|
||||
handleSubmit(e) {
|
||||
@ -96,14 +120,23 @@
|
||||
this.$emit('input', val)
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.appointment-time {
|
||||
height: 800rpx;
|
||||
max-height: 800rpx;
|
||||
height: 560rpx;
|
||||
max-height: 560rpx;
|
||||
}
|
||||
|
||||
.time-text {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.close {
|
||||
right: 30rpx;
|
||||
top: 40rpx;
|
||||
}
|
||||
|
||||
.block {
|
||||
@ -120,7 +153,8 @@
|
||||
text-align: center;
|
||||
height: 108rpx;
|
||||
line-height: 108rpx;
|
||||
|
||||
width: 200rpx;
|
||||
|
||||
&.active {
|
||||
color: $-color-theme;
|
||||
font-size: 26rpx;
|
||||
@ -137,6 +171,12 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.time-block {
|
||||
height: 108rpx;
|
||||
line-height: 108rpx;
|
||||
border-bottom: 2rpx solid #F5F5F5;
|
||||
}
|
||||
|
||||
.main {
|
||||
height: 100%;
|
||||
@ -145,6 +185,7 @@
|
||||
.main-wrap {
|
||||
position: relative;
|
||||
padding: 0 20rpx;
|
||||
padding-bottom: 108rpx;
|
||||
.goods {
|
||||
padding-bottom: 200rpx;
|
||||
.info {
|
||||
|
||||
@ -5,7 +5,8 @@
|
||||
<scroll-view style="height: 100%;" scroll-y="true" scroll-with-animation="true">
|
||||
<view style="padding-bottom: 200rpx;">
|
||||
<block v-for="(item, index) in cateList" :key="index">
|
||||
<view :class="'one-item sm ' + (index == selectIndex ? 'active bg-white' : '')" @click="changeActive(index)">
|
||||
<view :class="'one-item sm ' + (index == selectIndex ? 'active bg-white' : '')"
|
||||
@click="changeActive(index)">
|
||||
<text class="name">{{ item.name }}</text>
|
||||
<view v-if="index == selectIndex" class="active-line bg-default"></view>
|
||||
</view>
|
||||
@ -15,33 +16,40 @@
|
||||
</view>
|
||||
|
||||
<view class="main">
|
||||
<scroll-view style="height: 100%" scroll-y="true" scroll-with-animation="true" @scrolltolower="getGoodsSearchFun">
|
||||
<scroll-view style="height: 100%" scroll-y="true" scroll-with-animation="true"
|
||||
@scrolltolower="getGoodsSearchFun">
|
||||
<view class="main-wrap">
|
||||
<view class="goods">
|
||||
<view class="u-p-t-32 bold-600">{{cateName}}</view>
|
||||
|
||||
<view class="u-p-t-32 bold-600">{{ cateName }}</view>
|
||||
|
||||
<view class="u-p-t-32">
|
||||
<navigator :url="`/pages/shop/shop?id=${item.id}`" hover-class="none" class="bg-white br16 row u-col-top u-m-b-24" v-for="(item, index) in goodsList" :key="index" >
|
||||
<navigator :url="`/pages/shop/shop?id=${item.id}`" hover-class="none"
|
||||
class="bg-white br16 row u-col-top u-m-b-24" v-for="(item, index) in goodsList"
|
||||
:key="index">
|
||||
<view>
|
||||
<u-image :src="item.image" width="136" height="136" border-radius="16"></u-image>
|
||||
<u-image :src="item.image" width="136" height="136"
|
||||
border-radius="16"></u-image>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view>
|
||||
<view class="u-line-2 u-p-t-10">{{item.name}}</view>
|
||||
<view class="u-line-2 u-p-t-10">{{ item.name }}</view>
|
||||
<view class="u-p-t-20 row-between">
|
||||
<view class="row">
|
||||
<view class="primary">
|
||||
<price-format :price="item.price" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
<price-format :price="item.price" :subscriptSize="22"
|
||||
:firstSize="34" :secondSize="26"></price-format>
|
||||
</view>
|
||||
<view class="u-m-l-8">
|
||||
<price-format :price="item.market_price" :lineThrough="true" color="#C0C0C0" :subscriptSize="22" :firstSize="22" :secondSize="22"></price-format>
|
||||
<price-format :price="item.market_price" :lineThrough="true"
|
||||
color="#C0C0C0" :subscriptSize="22" :firstSize="22"
|
||||
:secondSize="22"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="column-end">
|
||||
<view @click.stop="addCartFun(item)">
|
||||
<u-icon name="plus-circle-fill" color="#254062" size="48" ></u-icon>
|
||||
<u-icon name="plus-circle-fill" color="#254062" size="48"></u-icon>
|
||||
</view>
|
||||
<!-- <u-button @click="openSpec(item.name)" hover-class="none"
|
||||
:customStyle="{width: '116rpx', height: '46rpx', lineHeight: '46rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx'}"
|
||||
@ -52,7 +60,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</navigator>
|
||||
|
||||
|
||||
<loading-footer :status="status" :slot-empty="true">
|
||||
<view slot="empty" class="column-center" style="padding: 200rpx 0 0">
|
||||
<text class="lighter sm">暂无商品</text>
|
||||
@ -75,10 +83,11 @@
|
||||
<view class="u-m-l-32">
|
||||
<view class="row-center" v-if="totalPrice">
|
||||
<text class="text-fff">
|
||||
共计
|
||||
共计
|
||||
</text>
|
||||
<view class="primary u-m-t-10 u-m-l-20">
|
||||
<price-format :price="totalPrice" :subscriptSize="26" :firstSize="34" :secondSize="26"></price-format>
|
||||
<price-format :price="totalPrice" :subscriptSize="26" :firstSize="34"
|
||||
:secondSize="26"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-fff" v-else>
|
||||
@ -88,16 +97,17 @@
|
||||
</view>
|
||||
<view class="text-999" @tap="goSettle">去结算</view>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 购物车 -->
|
||||
<u-popup v-model="showCart" mode="bottom" :border-radius="16">
|
||||
<view style="max-height: 800rpx;">
|
||||
<view class="px20 text-999 mt20">
|
||||
温馨提示：请适量点餐
|
||||
温馨提示：请适量点餐,（套餐与单品系列限购2套）
|
||||
</view>
|
||||
<view v-if="cartLists.length > 0">
|
||||
<scroll-view style="height: 700rpx;" scroll-y="true" scroll-with-animation="true">
|
||||
<view class="row-start u-row-between u-p-t-20 u-padding-bottom-20 px20" v-for="(item, index) in cartLists" :key="index">
|
||||
<view class="row-start u-row-between u-p-t-20 u-padding-bottom-20 px20"
|
||||
v-for="(item, index) in cartLists" :key="index">
|
||||
<view class="row-start">
|
||||
<view>
|
||||
<u-image :src="item.img" width="136" height="136" border-radius="16"></u-image>
|
||||
@ -112,7 +122,8 @@
|
||||
<text>味浓芳香</text>
|
||||
</view>
|
||||
<view class="primary">
|
||||
<price-format :price="item.price" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
<price-format :price="item.price" :subscriptSize="22" :firstSize="34"
|
||||
:secondSize="26"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -121,10 +132,18 @@
|
||||
<u-icon class="u-p-t-10" name="trash" size="32"></u-icon>
|
||||
</view>
|
||||
<view class="u-p-t-30">
|
||||
<u-number-box :disabled="item.cart_status != 0" :min="1" :max="item.item_stock" :value="item.goods_num" @blur="countChange($event, item.cart_id, item)" @minus="countChange($event, item.cart_id, item)" @plus="countChange($event, item.cart_id, item)"></u-number-box>
|
||||
<u-number-box :disabled="item.cart_status != 0" :min="1" :max="item.first_category_id == 1 || item.first_category_id == 2 ? 2 : item.stock"
|
||||
:value="item.goods_num" @blur="countChange($event, item.cart_id, item)"
|
||||
@minus="countChange($event, item.cart_id, item)"
|
||||
@plus="countChange($event, item.cart_id, item)"></u-number-box>
|
||||
</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>
|
||||
@ -133,316 +152,360 @@
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<shop-spec v-model="showSpec" :name="goodsName" :spec="goods_spec" @close="showSpec = false" @confirm="confirmSpec"></shop-spec>
|
||||
<shop-spec v-model="showSpec" :name="goodsName" :spec="goods_spec" @close="showSpec = false"
|
||||
@confirm="confirmSpec"></shop-spec>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
mapActions,
|
||||
mapGetters
|
||||
} from 'vuex';
|
||||
import {
|
||||
loadingFun
|
||||
} from '@/utils/tools'
|
||||
import {
|
||||
getGoodsSearch,
|
||||
addCart,
|
||||
getPoster,
|
||||
getCartNum,
|
||||
getCartList,
|
||||
changeGoodsCount,
|
||||
deleteGoods
|
||||
} from '@/api/store';
|
||||
import {
|
||||
loadingType
|
||||
} from '@/utils/type';
|
||||
import {
|
||||
mapActions,
|
||||
mapGetters
|
||||
} from 'vuex';
|
||||
import {
|
||||
loadingFun
|
||||
} from '@/utils/tools'
|
||||
import {
|
||||
getGoodsSearch,
|
||||
addCart,
|
||||
getPoster,
|
||||
getCartNum,
|
||||
getCartList,
|
||||
changeGoodsCount,
|
||||
deleteGoods
|
||||
} from '@/api/store';
|
||||
import {
|
||||
loadingType
|
||||
} from '@/utils/type';
|
||||
|
||||
export default {
|
||||
name: "cate-one",
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => ([])
|
||||
export default {
|
||||
name: "cate-one",
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default: () => ([])
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
page: 1,
|
||||
status: loadingType.LOADING,
|
||||
selectIndex: 0,
|
||||
categoryId: 0,
|
||||
cateList: [],
|
||||
goodsList: [],
|
||||
goods_spec: [],
|
||||
cateName: '',
|
||||
numberVal: 1,
|
||||
showCart: false,
|
||||
showSpec: false,
|
||||
goods_num: 0,
|
||||
cartLists: [],
|
||||
totalPrice: 0,
|
||||
goodsName: '',
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCartNum();
|
||||
this.getCartListFun();
|
||||
uni.$on('refreshCartList', this.getCartListFun);
|
||||
},
|
||||
beforeDestroy() {
|
||||
uni.$off('refreshCartList', this.getCartListFun);
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['getCartNum']),
|
||||
|
||||
// 切换商品分类
|
||||
changeActive(index) {
|
||||
const {
|
||||
cateList
|
||||
} = this
|
||||
this.cateName = cateList[index].name
|
||||
this.selectIndex = index
|
||||
this.onRefresh()
|
||||
},
|
||||
|
||||
onRefresh() {
|
||||
this.page = 1
|
||||
this.goodsList = []
|
||||
this.status = loadingType.LOADING
|
||||
this.$nextTick(() => {
|
||||
this.getGoodsSearchFun();
|
||||
});
|
||||
},
|
||||
|
||||
async getGoodsSearchFun() {
|
||||
let {
|
||||
page,
|
||||
goodsList,
|
||||
priceSort,
|
||||
saleSort,
|
||||
status,
|
||||
cateList,
|
||||
selectIndex
|
||||
} = this;
|
||||
const item = cateList[selectIndex]
|
||||
if (item.type == 0) return
|
||||
if (status == loadingType.FINISHED) return;
|
||||
const params = {
|
||||
category_id: item.id,
|
||||
page_no: page,
|
||||
price: priceSort,
|
||||
sales_sum: saleSort
|
||||
}
|
||||
const data = await loadingFun(getGoodsSearch, page, goodsList, status, params)
|
||||
console.log(data);
|
||||
|
||||
if (!data) return
|
||||
this.page = data.page
|
||||
this.goodsList = data.dataList
|
||||
this.status = data.status
|
||||
},
|
||||
|
||||
// 显示购物车弹出窗
|
||||
showCartPopup() {
|
||||
if (this.cartLists.length > 0) {
|
||||
this.showCart = true
|
||||
} else {
|
||||
this.$toast({
|
||||
title: '请先添加商品'
|
||||
});
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
page:1,
|
||||
status: loadingType.LOADING,
|
||||
selectIndex: 0,
|
||||
cateList: [],
|
||||
goodsList: [],
|
||||
goods_spec: [],
|
||||
cateName: '',
|
||||
numberVal: 1,
|
||||
showCart: false,
|
||||
showSpec: false,
|
||||
goods_num: 0,
|
||||
cartLists: [],
|
||||
totalPrice: 0,
|
||||
goodsName: '',
|
||||
|
||||
// 添加到购物车(默认商品数量+1,可以让后端连表查询商品数量字段)
|
||||
async addCartFun(item) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/shop/shop?id=${item.id}&showPopup=true`
|
||||
})
|
||||
return
|
||||
|
||||
// 限购逻辑
|
||||
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,
|
||||
msg
|
||||
} = await addCart({
|
||||
item_id: item.id,
|
||||
goods_num: 1
|
||||
});
|
||||
if (code == 1) {
|
||||
this.getCartListFun()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCartNum()
|
||||
|
||||
// 打开规格弹窗
|
||||
openSpec(name) {
|
||||
this.showSpec = true
|
||||
this.goodsName = name
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['getCartNum']),
|
||||
|
||||
// 切换商品分类
|
||||
changeActive(index) {
|
||||
const {
|
||||
cateList
|
||||
} = this
|
||||
this.cateName = cateList[index].name
|
||||
this.selectIndex = index
|
||||
this.onRefresh()
|
||||
},
|
||||
|
||||
onRefresh() {
|
||||
this.page = 1
|
||||
this.goodsList = []
|
||||
this.status = loadingType.LOADING
|
||||
this.$nextTick(() => {
|
||||
this.getGoodsSearchFun();
|
||||
});
|
||||
},
|
||||
|
||||
async getGoodsSearchFun() {
|
||||
let {
|
||||
page,
|
||||
goodsList,
|
||||
priceSort,
|
||||
saleSort,
|
||||
status,
|
||||
cateList,
|
||||
selectIndex
|
||||
} = this;
|
||||
const item = cateList[selectIndex]
|
||||
if(item.type == 0) return
|
||||
if (status == loadingType.FINISHED) return;
|
||||
const params = {
|
||||
category_id: item.id,
|
||||
page_no: page,
|
||||
price: priceSort,
|
||||
sales_sum: saleSort
|
||||
}
|
||||
const data = await loadingFun(getGoodsSearch, page, goodsList, status, params)
|
||||
console.log(data);
|
||||
|
||||
if (!data) return
|
||||
this.page = data.page
|
||||
this.goodsList = data.dataList
|
||||
this.status = data.status
|
||||
},
|
||||
|
||||
// 显示购物车弹出窗
|
||||
showCartPopup() {
|
||||
if (this.cartLists.length > 0) {
|
||||
this.showCart = true
|
||||
}
|
||||
else {
|
||||
this.$toast({
|
||||
title: '请先添加商品'
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// 添加到购物车(默认商品数量+1,可以让后端连表查询商品数量字段)
|
||||
async addCartFun(item) {
|
||||
const {
|
||||
code,
|
||||
data,
|
||||
msg
|
||||
} = await addCart({
|
||||
item_id: item.id,
|
||||
goods_num: 1
|
||||
});
|
||||
if (code == 1) {
|
||||
// 购物车商品里面的数量
|
||||
countChange({ value }, cartId, item) {
|
||||
console.log("countChange", value, cartId, item);
|
||||
changeGoodsCount({
|
||||
cart_id: cartId,
|
||||
goods_num: value,
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun()
|
||||
}
|
||||
},
|
||||
|
||||
// 打开规格弹窗
|
||||
openSpec(name) {
|
||||
this.showSpec = true
|
||||
this.goodsName = name
|
||||
},
|
||||
|
||||
// 购物车商品里面的数量
|
||||
countChange({value}, cartId, item) {
|
||||
console.log("countChange", value, cartId, item);
|
||||
changeGoodsCount({
|
||||
cart_id: cartId,
|
||||
goods_num: value,
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun()
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获取购物车列表数据
|
||||
getCartListFun() {
|
||||
console.log("1>>>", 1);
|
||||
|
||||
getCartList().then((res) => {
|
||||
if (res.code == 1) {
|
||||
console.log("res>>>", res);
|
||||
|
||||
let {
|
||||
lists,
|
||||
total_amount
|
||||
} = res.data;
|
||||
// let cartType = 0;
|
||||
|
||||
// if (lists.length == 0) {
|
||||
// cartType = 2;
|
||||
// } else {
|
||||
// cartType = 1;
|
||||
// }
|
||||
|
||||
this.cartLists = lists;
|
||||
|
||||
// this.cartType = cartType;
|
||||
this.totalPrice = total_amount
|
||||
// this.isShow = true;
|
||||
this.getCartNum();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 购物车删除商品
|
||||
deleteGoods(cart_id) {
|
||||
deleteGoods({
|
||||
cart_id
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 去结算
|
||||
goSettle() {
|
||||
uni.navigateTo({
|
||||
url: `/pages/order_now/order_now?id=${id}`
|
||||
})
|
||||
},
|
||||
|
||||
// 跳转商品详情页
|
||||
toShop(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/shop/shop?id=${id}`
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['cartNum']),
|
||||
// 显示购物车数量
|
||||
buyNumber() {
|
||||
if (this.goods_num > 0) {
|
||||
return this.goods_num > 99 ? '99+' : this.goods_num
|
||||
|
||||
// 获取购物车列表数据
|
||||
getCartListFun() {
|
||||
// 获取商品的分类ID
|
||||
getCartList().then((res) => {
|
||||
if (res.code == 1) {
|
||||
|
||||
let {
|
||||
lists,
|
||||
total_amount
|
||||
} = res.data;
|
||||
this.cartLists = lists;
|
||||
console.log("🚀 ~ getCartListFun ~ lists:", 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();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
return ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
list: {
|
||||
handler(val) {
|
||||
if(!val.length) return
|
||||
let index = val.findIndex((item) => item.type == 1)
|
||||
|
||||
this.selectIndex = index == -1 ? 0 : index
|
||||
this.cateName = val[this.selectIndex].name
|
||||
this.cateList = val
|
||||
this.getGoodsSearchFun()
|
||||
// 购物车删除商品
|
||||
deleteGoods(cart_id) {
|
||||
deleteGoods({
|
||||
cart_id
|
||||
}).then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.getCartListFun();
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
|
||||
// 去结算
|
||||
goSettle() {
|
||||
console.log(this.cartLists)
|
||||
this.showCart = false
|
||||
const goods = this.cartLists.map(item => {
|
||||
return {
|
||||
item_id: item.item_id,
|
||||
num: item.goods_num
|
||||
}
|
||||
})
|
||||
|
||||
uni.navigateTo({
|
||||
url: "/pages/order_now/order_now?data=" +
|
||||
encodeURIComponent(
|
||||
JSON.stringify({
|
||||
goods,
|
||||
type: "cart",
|
||||
})
|
||||
),
|
||||
});
|
||||
},
|
||||
|
||||
// 跳转商品详情页
|
||||
toShop(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/shop/shop?id=${id}`
|
||||
})
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['cartNum']),
|
||||
// 显示购物车数量
|
||||
buyNumber() {
|
||||
if (this.goods_num > 0) {
|
||||
return this.goods_num > 99 ? '99+' : this.goods_num
|
||||
}
|
||||
|
||||
return ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
list: {
|
||||
handler(val) {
|
||||
if (!val.length) return
|
||||
let index = val.findIndex((item) => item.type == 1)
|
||||
|
||||
this.selectIndex = index == -1 ? 0 : index
|
||||
this.cateName = val[this.selectIndex].name
|
||||
this.cateList = val
|
||||
this.getGoodsSearchFun()
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
$header-height: 94rpx;
|
||||
|
||||
.cate {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cate-one {
|
||||
height: 100vh;
|
||||
|
||||
.aside {
|
||||
width: 180rpx;
|
||||
flex: none;
|
||||
height: 100%;
|
||||
background-color: #F7F8FA;
|
||||
|
||||
.one-item {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
height: 108rpx;
|
||||
line-height: 108rpx;
|
||||
|
||||
&.active {
|
||||
color: $-color-theme;
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.active-line {
|
||||
position: absolute;
|
||||
width: 6rpx;
|
||||
height: 30rpx;
|
||||
left: 4rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
page {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
$header-height: 94rpx;
|
||||
|
||||
.cate {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cate-one {
|
||||
height: 100vh;
|
||||
|
||||
.aside {
|
||||
width: 180rpx;
|
||||
flex: none;
|
||||
height: 100%;
|
||||
background-color: #F7F8FA;
|
||||
|
||||
.one-item {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
height: 108rpx;
|
||||
line-height: 108rpx;
|
||||
|
||||
&.active {
|
||||
color: $-color-theme;
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.main {
|
||||
background-color: #FFFAFB;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
|
||||
.main-wrap {
|
||||
position: relative;
|
||||
padding: 0 20rpx;
|
||||
.goods {
|
||||
.info {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 16rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.active-line {
|
||||
position: absolute;
|
||||
width: 6rpx;
|
||||
height: 30rpx;
|
||||
left: 4rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.buy {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: env(safe-area-inset-bottom);
|
||||
height: 100rpx;
|
||||
background-color: #212526;
|
||||
}
|
||||
|
||||
.number {
|
||||
background-color: #FF2C3C;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.main {
|
||||
background-color: #FFFAFB;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
|
||||
.main-wrap {
|
||||
position: relative;
|
||||
padding: 0 20rpx 160rpx;
|
||||
|
||||
.goods {
|
||||
.info {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.buy {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: calc(env(safe-area-inset-bottom) + 10rpx);
|
||||
height: 100rpx;
|
||||
background-color: #212526;
|
||||
}
|
||||
|
||||
.number {
|
||||
background-color: #FF2C3C;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.settle-btn {
|
||||
padding: 20rpx;
|
||||
}
|
||||
</style>
|
||||
@ -47,7 +47,6 @@
|
||||
};
|
||||
},
|
||||
|
||||
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
@ -58,6 +57,7 @@
|
||||
},
|
||||
couponId: [Number, String]
|
||||
},
|
||||
|
||||
watch: {
|
||||
list: {
|
||||
handler(val) {
|
||||
@ -72,6 +72,7 @@
|
||||
immediate: true,
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onSelect(id) {
|
||||
const {
|
||||
|
||||
@ -33,6 +33,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getPhone } from '@/api/user'
|
||||
|
||||
export default {
|
||||
name: "mobile-login",
|
||||
props: {
|
||||
@ -51,10 +53,25 @@
|
||||
};
|
||||
},
|
||||
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: '获取手机号失败'})
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -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
|
||||
@ -56,9 +57,9 @@
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
token: {
|
||||
infoType: {
|
||||
type: String,
|
||||
default: ''
|
||||
default: 'all'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@ -70,6 +71,8 @@
|
||||
methods: {
|
||||
// 头像选择
|
||||
onChooseAvatar(e) {
|
||||
console.log("🚀 ~ onChooseAvatar ~ e:", e)
|
||||
|
||||
const avatarUrl = e.detail.avatarUrl;
|
||||
if (!avatarUrl) {
|
||||
return;
|
||||
@ -79,9 +82,11 @@
|
||||
mask: true,
|
||||
});
|
||||
|
||||
uploadFile(avatarUrl, this.token).then((res) => {
|
||||
uploadFile(avatarUrl).then((res) => {
|
||||
uni.hideLoading();
|
||||
this.avatar = res.url;
|
||||
console.log("🚀 ~ onChooseAvatar ~ this.avatar:", this.avatar)
|
||||
|
||||
}).catch(() => {
|
||||
uni.hideLoading();
|
||||
this.$toast({title: "上传失败"});
|
||||
@ -92,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,
|
||||
|
||||
79
components/order-dialog/order-dialog.vue
Normal file
79
components/order-dialog/order-dialog.vue
Normal file
@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<u-modal v-model="show" :show-cancel-button ="true" :content="getTipsText" @confirm="onConfirm" confirm-color="#ff2c3c"></u-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
cancelOrder,
|
||||
delOrder,
|
||||
confirmOrder
|
||||
} from '@/api/order';
|
||||
export default {
|
||||
props: {
|
||||
type: Number,
|
||||
orderId: [Number, String]
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.show = true
|
||||
},
|
||||
close() {
|
||||
this.show = false
|
||||
},
|
||||
async onConfirm() {
|
||||
const {
|
||||
type,
|
||||
orderId
|
||||
} = this;
|
||||
let res = null;
|
||||
|
||||
switch (type) {
|
||||
case 0:
|
||||
res = await cancelOrder(orderId);
|
||||
break;
|
||||
|
||||
case 1:
|
||||
res = await delOrder(orderId);
|
||||
break;
|
||||
|
||||
case 2:
|
||||
res = await confirmOrder(orderId);
|
||||
break;
|
||||
}
|
||||
|
||||
if (res.code == 1) {
|
||||
this.close()
|
||||
this.$emit("refresh")
|
||||
this.$toast({
|
||||
title: res.msg
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
|
||||
getTipsText() {
|
||||
const {
|
||||
type
|
||||
} = this
|
||||
switch (type) {
|
||||
case 0:
|
||||
return "确认取消订单吗？"
|
||||
case 1:
|
||||
return "确认删除订单吗?"
|
||||
case 2:
|
||||
return "确认收货吗?"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@ -1,115 +1,68 @@
|
||||
<template>
|
||||
<view class="order-goods bg-white">
|
||||
<view v-for="(item, index) in list" :key="index" class="item-wrap">
|
||||
<view class="item row" @tap="toGoods(item.goods_id)">
|
||||
<view class="goods-img">
|
||||
<view class="bg-white">
|
||||
<view v-for="(item, index) in list" :key="index" class="item-wrap u-p-b-20">
|
||||
<view class="row-between u-p-r-20 u-p-t-20 u-p-b-24" v-if="mode === 'order'">
|
||||
<view class="u-line-1 nr bold-500 text-000"> {{ item.goods_name || item.name }}</view>
|
||||
<!-- 未发货订单暂时理解为未制作 -->
|
||||
<!-- 已发货订单暂时理解为已完成 -->
|
||||
<view class="flex1 u-m-l-40 text-nowrap" :class="{'primary': orderStatus == 1, 'text-999': orderStatus != 1}">{{ orderDesc }}</view>
|
||||
</view>
|
||||
<view class="item" :class="{row: mode != 'pay', 'row-start': mode == 'pay'}" @tap="toGoods(item.goods_id)">
|
||||
<view :style="{ width: imageWidth + 'rpx', height: imageHeight + 'rpx' }">
|
||||
<u-image :src="item.image_str || item.image"
|
||||
:width="imageWidth"
|
||||
:height="imageHeight"
|
||||
:border-radius="imageRadius"
|
||||
:mode="imgMode"
|
||||
lazy-load/>
|
||||
</view>
|
||||
<view class="goods-info ml20 flex1">
|
||||
<view class="goods-name line2 mb10">
|
||||
<u-tag
|
||||
class="mr10"
|
||||
v-if="team.need"
|
||||
:text="team.need + '人团'"
|
||||
size="mini"
|
||||
type="primary"
|
||||
mode="plain"
|
||||
/>
|
||||
{{ item.goods_name || item.name }}</view
|
||||
>
|
||||
<view class="goods-spec xs muted mb20">{{
|
||||
item.spec_value_str || item.spec_value
|
||||
}}</view>
|
||||
<view class="row-between">
|
||||
<view class="goods-price row">
|
||||
<view class="sm text-999" v-if="mode === 'order'">
|
||||
<view>下单时间:2024-10-10 16:58:53</view>
|
||||
<view>预计时间:2025-10-10 16:58:54</view>
|
||||
<view>数量:x{{ item.goods_num }}</view>
|
||||
<view>实付:
|
||||
<price-format
|
||||
v-if="!item.is_member && (order_type === 0 || order_type === 1)"
|
||||
:weight="500"
|
||||
:subscript-size="24"
|
||||
:first-size="34"
|
||||
:second-size="24"
|
||||
:price="item.original_price || item.goods_price"
|
||||
></price-format>
|
||||
</view>
|
||||
<view>{{item.spec_value_str || item.spec_value}}</view>
|
||||
</view>
|
||||
<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-between u-m-t-10">
|
||||
<view class="primary">
|
||||
<price-format
|
||||
v-if="!item.is_member && order_type === 0"
|
||||
:weight="500"
|
||||
:subscript-size="24"
|
||||
:first-size="34"
|
||||
:second-size="24"
|
||||
:price="item.original_price || item.goods_price"
|
||||
></price-format>
|
||||
<price-format :price="item.original_price || item.goods_price" :subscriptSize="22" :firstSize="40" :secondSize="32"></price-format>
|
||||
</view>
|
||||
<view class="vip-price row" v-if="item.is_member && order_type === 0">
|
||||
<view class="price-name xxs">会员价</view>
|
||||
<view style="padding: 0 10rpx">
|
||||
<price-format
|
||||
:price="item.goods_price"
|
||||
:first-size="22"
|
||||
:second-size="22"
|
||||
:subscript-size="22"
|
||||
:weight="500"
|
||||
color="#7B3200"
|
||||
></price-format>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="vip-price row"
|
||||
v-if="order_type === 1 || order_type === 2 || order_type === 3"
|
||||
>
|
||||
<view class="price-name xxs" style="background-color: #e74346">
|
||||
<text v-if="order_type === 1">秒杀价</text>
|
||||
<text v-if="order_type === 2">拼团价</text>
|
||||
<text v-if="order_type === 3">砍价</text>
|
||||
</view>
|
||||
|
||||
<view style="padding: 0 10rpx">
|
||||
<price-format
|
||||
:price="item.goods_price"
|
||||
:first-size="22"
|
||||
:second-size="22"
|
||||
:subscript-size="22"
|
||||
:weight="500"
|
||||
color="#7B3200"
|
||||
></price-format>
|
||||
</view>
|
||||
<view>x{{ item.goods_num }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="sm text-999" v-if="mode === 'pay'">
|
||||
<view class="u-line-2" style="color: #1D2129">{{ item.goods_name || item.name }}</view>
|
||||
</view>
|
||||
<view class="sm text-999" v-if="mode === 'order_detail'">
|
||||
<view class="u-line-2" style="color: #1D2129">{{ item.goods_name || item.name }}</view>
|
||||
<view class="u-m-t-4">x{{ item.goods_num }}</view>
|
||||
<view class="row 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>
|
||||
<view class="goods-num sm">x{{ item.goods_num }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="mode === 'comfirm'">
|
||||
<view class="delivery" v-if="delivery === 1 && !item.is_express"
|
||||
>该商品不支持快递配送</view
|
||||
>
|
||||
|
||||
<template v-if="mode === 'confirm'">
|
||||
<view class="delivery" v-if="delivery === 2 && !item.is_selffetch"
|
||||
>该商品不支持门店自提</view
|
||||
>
|
||||
</template>
|
||||
|
||||
<view class="goods-footer row" v-if="link">
|
||||
<view style="flex: 1"></view>
|
||||
<navigator
|
||||
class="mr20"
|
||||
hover-class="none"
|
||||
:url="'/bundle/pages/goods_reviews/goods_reviews?id=' + item.id"
|
||||
v-if="item.comment_btn"
|
||||
>
|
||||
<button size="xs" class="plain br60" hover-class="none">评价晒图</button>
|
||||
</navigator>
|
||||
<navigator
|
||||
v-if="item.refund_btn"
|
||||
hover-class="none"
|
||||
:url="
|
||||
'/bundle/pages/apply_refund/apply_refund?order_id=' +
|
||||
item.order_id +
|
||||
'&item_id=' +
|
||||
item.item_id
|
||||
"
|
||||
>
|
||||
<button size="xs" class="plain br60" hover-class="none">申请退款</button>
|
||||
</navigator>
|
||||
<view v-if="item.after_status_desc" style="color: orange">
|
||||
{{ item.after_status_desc }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@ -138,7 +91,7 @@ export default {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
// order | comfirm
|
||||
// order | confirm | pay
|
||||
mode: {
|
||||
type: String,
|
||||
default: 'order'
|
||||
@ -158,6 +111,18 @@ export default {
|
||||
imageRadius: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
orderDesc: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
imgMode: {
|
||||
type: String,
|
||||
default: 'scaleToFill'
|
||||
},
|
||||
orderStatus: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -1,86 +1,188 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="bg-white br16 px20 u-p-t-20 u-p-b-20 u-m-b-24">
|
||||
<view>
|
||||
<navigator hover-class="none" url="/pages/order_details/order_details?type=0">
|
||||
<view class="row-between">
|
||||
<view>煎饼果子套餐</view>
|
||||
<view class="text-999">待付款</view>
|
||||
<!-- <view class="text-999">已完成</view>
|
||||
<view class="text-999">退款</view>
|
||||
<view class="primary" >未制作</view>
|
||||
<view class="primary" >未取餐</view> -->
|
||||
</view>
|
||||
<view class="u-m-t-16 row">
|
||||
<view>
|
||||
<u-image :src="cloudPath + 'img/banner.png'" width="124" height="124" border-radius="16"></u-image>
|
||||
</view>
|
||||
<view class="sm ml20 text-999">
|
||||
<view>下单时间:2024-10-10 16:58:53</view>
|
||||
<view>预计时间:2025-10-10 16:58:54</view>
|
||||
<view>数量:1</view>
|
||||
<view>实付:￥0.00</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-26 u-m-b-26">
|
||||
<u-line color="#EEE" />
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="u-m-t-26 row-between">
|
||||
<view class="primary">等待时间:15分钟</view>
|
||||
<view class="row">
|
||||
<view class="u-m-r-16">
|
||||
<u-button @click="cancleOrder" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', color: '#999', border: '1px solid #DDD'}" :plain="true" :hair-line="false" shape="circle">取消订单</u-button>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="toPay" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">去付款</u-button>
|
||||
</view>
|
||||
<!-- <view>
|
||||
<u-button @click="seeDetails" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">查看详情</u-button>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="toRefund" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">查看详情</u-button>
|
||||
</view> -->
|
||||
<mescroll-uni ref="mescroll" top="100rpx" @init="mescrollInit" @down="downCallback" :down="downOption" :up="upOption" @up="upCallback">
|
||||
<view class="u-p-20">
|
||||
<navigator class="bg-white br16 px20 u-m-b-24 u-p-b-20" hover-class="none"
|
||||
v-for="(item, index) in orderList"
|
||||
:key="index"
|
||||
:url="'/pages/order_details/order_details?id=' + item.id">
|
||||
<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" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-26 row-between u-p-l-20 u-p-r-20">
|
||||
<view class="primary flex1">
|
||||
<view v-if="getCancelTime(item.order_cancel_time) > 0">
|
||||
<u-count-down separator="zh" :timestamp="getCancelTime(item.order_cancel_time)"
|
||||
separator-color="#FF2C3C" color="#FF2C3C" :separator-size="26" :font-size="26"
|
||||
bg-color="transparent" @end="orderRefresh"></u-count-down>
|
||||
</view>
|
||||
<!-- 这边还缺一个未制作等待的时间 -->
|
||||
<view class="primary" v-if="type === 'finish'">
|
||||
存餐格号:15号
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="u-m-r-16" v-if="item.cancel_btn">
|
||||
<u-button @click="cancelOrder(item.id)" hover-class="none"
|
||||
:customStyle="{ width: '164rpx', height: '60rpx', color: '#999', border: '1px solid #DDD' }"
|
||||
:plain="true" :hair-line="false" shape="circle">取消订单</u-button>
|
||||
</view>
|
||||
<view v-if="item.pay_btn">
|
||||
<u-button @click="payNow(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 > 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 && ( 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>
|
||||
</view>
|
||||
</navigator>
|
||||
<order-dialog ref="orderDialog" :order-id="orderId" :type="orderType" @refresh="reflesh"></order-dialog>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-uni>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'order-list',
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: 'all'
|
||||
}
|
||||
import {
|
||||
getOrderList,
|
||||
cancelOrder,
|
||||
delOrder,
|
||||
confirmOrder,
|
||||
completeAudit
|
||||
} from '@/api/order'
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"
|
||||
|
||||
export default {
|
||||
name: 'order-list',
|
||||
mixins: [MescrollMixin],
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: 'all'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
orderList: [],
|
||||
downOption: {
|
||||
auto: false
|
||||
},
|
||||
upOption: {
|
||||
noMoreSize: 4,
|
||||
empty: {
|
||||
tip: '~ 空空如也 ~', // 提示
|
||||
btnText: '',
|
||||
fixed: true
|
||||
},
|
||||
textNoMore: '没有更多了'
|
||||
},
|
||||
orderId: "",
|
||||
pay_way: "",
|
||||
showCancel: false,
|
||||
orderType: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
uni.$on("refreshorder", () => {
|
||||
this.reflesh();
|
||||
});
|
||||
uni.$on("payment", (params) => {
|
||||
if (params.result) {
|
||||
this.reflesh();
|
||||
uni.navigateBack();
|
||||
setTimeout(() => this.$toast({ title: "支付成功" }), 0.5 * 1000);
|
||||
}
|
||||
});
|
||||
},
|
||||
destroyed: function () {
|
||||
uni.$off(["payment", "refreshorder"]);
|
||||
},
|
||||
methods: {
|
||||
// 初始化数据
|
||||
upCallback(page) {
|
||||
let pageNum = page.num // 页码, 默认从1开始
|
||||
let pageSize = page.size // 页长, 默认每页10条
|
||||
let { type } = this
|
||||
getOrderList({
|
||||
page_size: pageSize,
|
||||
page_no: pageNum,
|
||||
type
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
let curPageData = data.list;
|
||||
let curPageLen = curPageData.length;
|
||||
let hasNext = !!data.more;
|
||||
if (page.num == 1) this.orderList = [];
|
||||
this.orderList = this.orderList.concat(curPageData);
|
||||
this.mescroll.endSuccess(curPageLen, hasNext);
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 取消订单
|
||||
cancleOrder() {
|
||||
|
||||
},
|
||||
|
||||
// 去付款
|
||||
toPay() {
|
||||
|
||||
},
|
||||
|
||||
// 查看详情
|
||||
seeDetails() {
|
||||
|
||||
},
|
||||
|
||||
// 申请退款
|
||||
toRefund() {
|
||||
|
||||
|
||||
orderRefresh() {
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
|
||||
cancelOrder(id) {
|
||||
this.orderId = id;
|
||||
this.orderType = 0;
|
||||
this.$nextTick(() => {
|
||||
this.orderDialog();
|
||||
});
|
||||
},
|
||||
|
||||
payNow(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/payment/payment?from=${"order"}&order_id=${id}`,
|
||||
});
|
||||
},
|
||||
|
||||
reflesh() {
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
|
||||
orderDialog() {
|
||||
this.$refs.orderDialog.open();
|
||||
},
|
||||
|
||||
// 查看详情
|
||||
seeDetails(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/order_details/order_details?id=${id}`
|
||||
})
|
||||
},
|
||||
|
||||
// 申请退款
|
||||
toRefund(id, goods) {
|
||||
if (goods.length == 1) {
|
||||
uni.navigateTo({
|
||||
url: `/bundle/pages/apply_refund/apply_refund?order_id=${goods[0].order_id}&item_id=${goods[0].item_id}`
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: `/pages/order_details/order_details?id=${id}`
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getCancelTime() {
|
||||
return (time) => time - Date.now() / 1000;
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
type() {
|
||||
this.mescroll.resetUpScroll()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@ -29,17 +29,19 @@
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="flex1 u-text-right">
|
||||
<u-number-box v-model="goodsNum" :min="1" :max="checkedGoods.stock"
|
||||
<!-- 限购逻辑:套餐和单品内的商品列表，每个都是只能购买两个 -->
|
||||
<u-number-box v-model="goodsNum" :min="1" :max="goods.first_category_id == 1 || goods.first_category_id == 2 ? 2 : checkedGoods.stock"
|
||||
:disabled="disabledNumberBox"></u-number-box>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="row u-row-center mt20 u-p-b-20" :class="specValueText.indexOf('请选择') != -1 || checkedGoods.stock == 0 ? 'disabled' : ''">
|
||||
<view class="w-40 mr10">
|
||||
<u-button @click="close" 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="close" 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="confirm('cart')" hover-class="none" :customStyle="{color: themeColor, border: '1px solid ' + themeColor, padding: '16rpx 0'}" :plain="true" :hair-line="false" shape="circle">加入购物车</u-button>
|
||||
</view>
|
||||
<view class="w-40 ml10">
|
||||
<u-button @click="confirm" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :hair-line="false" shape="circle">确定</u-button>
|
||||
<u-button @click="confirm('buy')" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :hair-line="false" shape="circle">确定</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -156,6 +158,23 @@
|
||||
|
||||
},
|
||||
|
||||
// 商品数量变化
|
||||
handleCountChange({ value }) {
|
||||
console.log("🚀 ~ countChange ~ value:", value)
|
||||
console.log("🚀 ~ countChange ~ goods:", this.goods)
|
||||
if (this.goods.first_category_id === 1 || this.goods.first_category_id === 2) {
|
||||
// 套餐和单品系列限购2套
|
||||
if (value > 2) {
|
||||
this.disabledNumberBox = true
|
||||
return this.$toast({
|
||||
title: '套餐与单品系列限购2套',
|
||||
})
|
||||
} else {
|
||||
this.goodsNum = value
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 选择规格
|
||||
// chooseSpec(item, index1, index2, attr) {
|
||||
// if (item.name == '辣度') {
|
||||
@ -198,7 +217,7 @@
|
||||
// },
|
||||
|
||||
// 确认选择的规格
|
||||
confirm() {
|
||||
confirm(type) {
|
||||
let { checkedGoods, goodsNum } = this;
|
||||
if (this.specValueText.indexOf("请选择") != -1)
|
||||
return this.$toast({
|
||||
@ -211,6 +230,7 @@
|
||||
checkedGoods.goodsNum = goodsNum;
|
||||
this.$emit('buynow', {
|
||||
detail: checkedGoods,
|
||||
type
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
@ -17,8 +17,10 @@ const baseURLMap = {
|
||||
// development: 'https://likeshop-open.yixiangonline.com',
|
||||
// development: 'http://admin.likeshop.com',
|
||||
development: 'https://jianbing.stnav.com',
|
||||
// development: 'https://jb.stnav.com',
|
||||
// 生产环境https://php-b2c.likeshop.cn
|
||||
production: IS_H5 ? location.origin : ''
|
||||
|
||||
production: IS_H5 ? location.origin : 'https://jianbing.stnav.com'
|
||||
}
|
||||
|
||||
const baseURL = SWITCH_DEVELOPMENT ? baseURLMap['development'] : baseURLMap[process.env.NODE_ENV]
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name" : "base",
|
||||
"appid" : "__UNI__119A841",
|
||||
"appid" : "__UNI__397496C",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
@ -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'
|
||||
}
|
||||
},
|
||||
|
||||
30
pages.json
30
pages.json
@ -134,6 +134,12 @@
|
||||
"navigationBarTitleText": "支付订单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/pay_result/pay_result",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "components/uview-ui/components/u-avatar-cropper/u-avatar-cropper",
|
||||
"style": {
|
||||
@ -194,6 +200,30 @@
|
||||
"style": {
|
||||
"navigationBarTitleText": "联系客服"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/apply_refund/apply_refund",
|
||||
"style": {
|
||||
"navigationBarTitleText": "申请售后"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/coupon/coupon_list",
|
||||
"style": {
|
||||
"navigationBarTitleText": "优惠券"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/coupon/coupon_package",
|
||||
"style": {
|
||||
"navigationBarTitleText": "优惠券包"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/coupon/coupon_exchange",
|
||||
"style": {
|
||||
"navigationBarTitleText": "兑换券"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -4,18 +4,18 @@
|
||||
<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>
|
||||
<view class="u-m-t-8 u-line-1">
|
||||
<!-- <view class="u-m-t-8 u-line-1">
|
||||
<navigator class="u-flex " url="/bundle/pages/address/address?type=1" hover-class="none">
|
||||
<u-icon name="map" size="32"></u-icon>
|
||||
<view class="u-line-1">
|
||||
{{userAddress || '请选择收货地址'}}
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view>
|
||||
<u-button shape="circle" :hair-line="false" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '36rpx'}" @click="signin">签到</u-button>
|
||||
@ -53,8 +53,15 @@
|
||||
</view>
|
||||
|
||||
<!-- 下单 -->
|
||||
<view class="order u-flex u-row-between">
|
||||
<view class="bg-white u-text-center">
|
||||
<view class="order u-flex u-row-center bg-white" @click="toStore">
|
||||
<view>
|
||||
<view class="reserve">预约下单</view>
|
||||
<view class="desc">极速送达更便捷</view>
|
||||
</view>
|
||||
<view>
|
||||
<u-image :src="cloudPath + 'img/home_image1.png'" width="204" height="204"></u-image>
|
||||
</view>
|
||||
<!-- <view class="bg-white u-text-center">
|
||||
<navigator url="/pages/store/store?type=1" hover-class="none">
|
||||
<view class="text-default xxl">预约下单</view>
|
||||
<view class="xs text-999">极速送达更便捷</view>
|
||||
@ -62,16 +69,16 @@
|
||||
<u-image :src="cloudPath + 'img/icon_p_order.png'" width="132" height="132"></u-image>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="bg-white u-text-center">
|
||||
</view> -->
|
||||
<!-- <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>
|
||||
</navigator>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<!-- 活动图 -->
|
||||
@ -157,6 +164,12 @@
|
||||
uni.navigateTo({
|
||||
url: '/pages/signin/signin'
|
||||
})
|
||||
},
|
||||
|
||||
toStore() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/store/store'
|
||||
})
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -200,9 +213,31 @@
|
||||
|
||||
.order {
|
||||
margin: 30rpx 20rpx;
|
||||
height: 300rpx;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
& > view {
|
||||
border-radius: 16rpx;
|
||||
padding: 40rpx 86rpx;
|
||||
}
|
||||
|
||||
.reserve {
|
||||
font-weight: 500;
|
||||
font-size: 44rpx;
|
||||
color: #254062;
|
||||
line-height: 26rpx;
|
||||
font-weight: 500;
|
||||
margin-bottom: 34rpx;
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #999999;
|
||||
line-height: 26rpx;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
text-transform: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -6,20 +6,19 @@
|
||||
|
||||
<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>
|
||||
<!-- <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>
|
||||
|
||||
<view class="u-m-t-32 u-flex u-row-center">
|
||||
@ -42,7 +41,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<mplogin v-model="mpLoginPopup" :token="token" @close="mpLoginPopup = false" @update="handleSubmitInfo"/>
|
||||
<mplogin v-model="mpLoginPopup" @close="mpLoginPopup = false" @update="handleSubmitInfo"/>
|
||||
<mobile-login v-model="mobilePopup" @close="mobilePopup = false" @update="handleSubmitMobile"/>
|
||||
</view>
|
||||
</template>
|
||||
@ -69,8 +68,7 @@
|
||||
},
|
||||
loginData: {},
|
||||
mpLoginPopup: false,
|
||||
mobilePopup: false,
|
||||
token: ''
|
||||
mobilePopup: false
|
||||
}
|
||||
},
|
||||
|
||||
@ -110,10 +108,7 @@
|
||||
if (code == 1) {
|
||||
if (data.is_new_user) {
|
||||
uni.hideLoading()
|
||||
this.token = data.token
|
||||
this.$nextTick(() => {
|
||||
this.mpLoginPopup = true
|
||||
})
|
||||
this.mpLoginPopup = true
|
||||
this.loginData = data
|
||||
} else {
|
||||
this.loginHandle(data)
|
||||
@ -145,13 +140,15 @@
|
||||
|
||||
// 更新新注册的用户信息
|
||||
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()
|
||||
console.log("🚀 ~ handleSubmitMobile ~ wxCode:", wxCode)
|
||||
console.log("🚀 ~ handleSubmitMobile ~ client:", client)
|
||||
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" :key="index" @click="tapMenu(item)">
|
||||
<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,14 +127,17 @@
|
||||
type: 2
|
||||
})
|
||||
if (code == 1) {
|
||||
this.menuList = data
|
||||
this.menuList = data[1].content.data
|
||||
}
|
||||
},
|
||||
|
||||
// 点击菜单跳转页面
|
||||
tapMenu(item) {
|
||||
tapMenu(path) {
|
||||
if (!this.isLogin) return toLogin()
|
||||
menuJump(item)
|
||||
uni.navigateTo({
|
||||
url: path.path
|
||||
})
|
||||
// menuJump(item)
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
|
||||
@ -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.WAIT_PAY
|
||||
type: orderType.PAY,
|
||||
count: 1
|
||||
},
|
||||
{
|
||||
name: '未制作',
|
||||
type: orderType.NOT_MADE
|
||||
type: orderType.DELIVERY,
|
||||
count: 5
|
||||
},
|
||||
{
|
||||
name: '已完成',
|
||||
@ -34,7 +36,7 @@
|
||||
},
|
||||
{
|
||||
name: '退款',
|
||||
type: orderType.REFUND
|
||||
type: orderType.CLOSE
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
@ -42,11 +44,14 @@
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// setTabbar()
|
||||
},
|
||||
methods: {
|
||||
tabChange(index) {
|
||||
console.log("this.list>>>", this.list);
|
||||
this.current = index
|
||||
this.type = this.list[index].type
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,12 +1,21 @@
|
||||
<template>
|
||||
<view class="u-m-l-32 u-m-r-32">
|
||||
<view class="u-p-32 br16 bg-white u-m-t-16">
|
||||
滨江区XXX门店
|
||||
<view class="u-m-l-32 u-m-r-32" style="padding-bottom: 200rpx;">
|
||||
<view v-if="orderDetail.order_status == 0" class="u-m-t-48 row">
|
||||
<view class="bold-500 mb10 xxxl text-000" >未付款</view>
|
||||
<view class="u-m-l-16 sm row text-999" style="line-height: 26rpx" v-if="cancelTime > 0">请在
|
||||
<u-count-down separator="zh" :timestamp="cancelTime" separator-color="#999" color="#999"
|
||||
:separator-size="26" :font-size="26" bg-color="transparent"></u-count-down>
|
||||
内完成支付
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-p-32 br16 bg-white u-m-t-16" v-if="orderDetail.order_status > 0">
|
||||
{{ orderDetail.delivery_address }}
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-32 u-m-t-36 br8">
|
||||
<view class="row u-col-top">
|
||||
<view>
|
||||
<!-- <view>
|
||||
<u-image :src="cloudPath + 'img/banner.png'" width="124" height="124" border-radius="8"></u-image>
|
||||
</view>
|
||||
<view>
|
||||
@ -29,16 +38,50 @@
|
||||
<price-format :lineThrough="true" color="#C0C0C0" :subscriptSize="22" :firstSize="22" :secondSize="22" :price="16.9"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<order-goods :link="true" :list="orderDetail.order_goods"
|
||||
:order_type="orderDetail.order_type" :mode="orderDetail.order_status == 0 ? 'pay' : 'order_detail'"></order-goods>
|
||||
</view>
|
||||
|
||||
<view class="row-end">
|
||||
|
||||
<view class="row-end" v-if="orderDetail.order_status > 0">
|
||||
<u-button class="u-m-r-24" @click="mobileLogin" hover-class="none" :customStyle="{height: '46rpx', color: '#454545', border: '1px solid #454545', borderRadius: '8rpx', padding: '0 8rpx', fontSize: '24rpx'}" :plain="true" :hair-line="false">再来一单</u-button>
|
||||
<u-button @click="mobileLogin" hover-class="none" :customStyle="{height: '46rpx', color: '#454545', border: '1px solid #454545', borderRadius: '8rpx', padding: '0 8rpx', fontSize: '24rpx'}" :plain="true" :hair-line="false">申请售后</u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-32 u-m-t-40 br8" v-if="orderDetail.order_status == 0" >
|
||||
<view class="bold-600 u-font-28">保温盒地址</view>
|
||||
<view class="text-attr u-m-t-16">
|
||||
<view class="u-m-t-8 text-999">
|
||||
孙婉宛
|
||||
</view>
|
||||
<view class="u-m-t-8 text-999">
|
||||
15271435646
|
||||
</view>
|
||||
<view class="u-m-t-8 text-999">
|
||||
站前北街4号顺义供电公司北50米
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-32 u-m-t-40 br8" v-if="orderDetail.order_status == 0">
|
||||
<view class="bold-600 u-font-28">订单信息</view>
|
||||
<view class="text-attr u-m-t-16">
|
||||
<view class="u-m-t-8 text-999">
|
||||
<view>买家昵称: 134213234122321232123</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-8 text-999">
|
||||
<view>订单编号: {{ orderDetail.order_sn }}</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-8 text-999">
|
||||
<view>下单时间: {{ orderDetail.create_time }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-32 u-m-t-32">
|
||||
<view class="bg-white u-p-32 u-m-t-32" v-if="orderDetail.order_status > 0">
|
||||
<view class="row-between">
|
||||
<view class="nr">商品总价</view>
|
||||
<view>
|
||||
@ -78,7 +121,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white u-p-32 u-m-t-40 br8">
|
||||
<view class="bg-white u-p-32 u-m-t-40 br8" v-if="orderDetail.order_status > 0">
|
||||
<view class="bold-600 u-font-28">订单信息</view>
|
||||
<view class="text-attr u-m-t-16">
|
||||
<view class="u-m-t-8 row-between">
|
||||
@ -98,26 +141,131 @@
|
||||
<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>
|
||||
</view>
|
||||
|
||||
<view class="fixed row-end u-text-center btn-group bg-white u-p-t-20">
|
||||
<view class="mr20">
|
||||
<u-button @click="mobileLogin" hover-class="none" :customStyle="{width: '160rpx', height: '80rpx', color: themeColor, border: '1px solid ' + themeColor, padding: '16rpx 0', borderRadius: '8rpx'}" :plain="true" :hair-line="false">查看物流</u-button>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="mpLogin" hover-class="none" :customStyle="{width: '160rpx', height: '80rpx', backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0', borderRadius: '8rpx'}" :hair-line="false">确认收货</u-button>
|
||||
</view>
|
||||
|
||||
<view class="fixed row-start u-text-center btn-group bg-white" v-if="orderDetail.order_status == 0">
|
||||
<view class="flex1 btn1" @tap="cancelOrder">取消订单</view>
|
||||
<view class="flex1 btn2 bg-default text-fff" @tap="payNow">立即支付</view>
|
||||
<!-- <u-button class="flex1" @click="mobileLogin" hover-class="none" :customStyle="{color: themeColor, padding: '16rpx 0'}" :plain="true" :hair-line="false">取消订单</u-button> -->
|
||||
<!-- <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="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> -->
|
||||
<order-dialog ref="orderDialog" :orderId="orderDetail.id" :type="type" @refresh="onRefresh"></order-dialog>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getOrderDetail,
|
||||
getwechatSyncCheck,
|
||||
getwxReceiveDetail,
|
||||
confirmOrder,
|
||||
} from "@/api/order"
|
||||
|
||||
export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
orderDetail: {},
|
||||
team: {},
|
||||
isFirstLoading: true,
|
||||
type: 0,
|
||||
cancelTime: 0,
|
||||
showCancel: "",
|
||||
showLoading: false,
|
||||
imageQR: "",
|
||||
priceShow: false,
|
||||
};
|
||||
},
|
||||
onLoad: function (options) {
|
||||
this.id = options.id;
|
||||
this.getOrderDetailFun();
|
||||
},
|
||||
onUnload() {
|
||||
uni.$off("payment");
|
||||
},
|
||||
methods: {
|
||||
onRefresh() {
|
||||
uni.$emit("refreshorder");
|
||||
const { type } = this;
|
||||
if ([0, 2].includes(type)) {
|
||||
this.getOrderDetailFun();
|
||||
} else if (type == 1) {
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 2000);
|
||||
}
|
||||
},
|
||||
getOrderDetailFun() {
|
||||
getOrderDetail(this.id)
|
||||
.then((res) => {
|
||||
if (res.code == 1) {
|
||||
this.cancelTime = res.data.order_cancel_time - Date.now() / 1000;
|
||||
this.orderDetail = res.data;
|
||||
this.$nextTick(() => {
|
||||
this.isFirstLoading = false;
|
||||
});
|
||||
} else {
|
||||
setTimeout(() => uni.navigateBack(), 1500);
|
||||
}
|
||||
return res.data;
|
||||
})
|
||||
.then((data) => {
|
||||
if (data.delivery_type === 2) {
|
||||
// 提货码
|
||||
this.$nextTick(function () {
|
||||
const refQR = this.$refs["qrcode"];
|
||||
refQR._makeCode();
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 取消订单
|
||||
cancelOrder() {
|
||||
this.type = 0;
|
||||
this.$nextTick(() => {
|
||||
this.orderDialog();
|
||||
});
|
||||
},
|
||||
|
||||
orderDialog() {
|
||||
this.$refs.orderDialog.open();
|
||||
},
|
||||
|
||||
payNow() {
|
||||
uni.$on("payment", (params) => {
|
||||
setTimeout(() => {
|
||||
if (params.result) {
|
||||
this.$toast({
|
||||
title: "支付成功",
|
||||
});
|
||||
this.getOrderDetailFun();
|
||||
uni.$emit("refreshorder");
|
||||
} else {
|
||||
this.$toast({
|
||||
title: "支付失败",
|
||||
});
|
||||
}
|
||||
}, 500);
|
||||
});
|
||||
|
||||
uni.navigateTo({
|
||||
url: `/pages/payment/payment?from=${"order"}&order_id=${this.id}`,
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -140,7 +288,13 @@
|
||||
|
||||
.btn-group {
|
||||
& > view {
|
||||
font-size: 36rpx;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
}
|
||||
|
||||
.btn1 {
|
||||
color: #323232;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="px32">
|
||||
<view class="px32" style="padding-bottom: 200rpx;">
|
||||
<!-- 收货方式 -->
|
||||
<view class="bg-white br16 row u-m-t-32">
|
||||
<!-- <u-tabs
|
||||
@ -72,34 +72,16 @@
|
||||
<u-icon name="arrow-right" />
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="bg-white br16 row u-m-t-32">
|
||||
<view class="bg-white br16 row u-m-t-32 u-p-20">
|
||||
<order-goods :team="{ need: orderInfo.team_need }" :list="goodsLists" :delivery="delivery"
|
||||
:order_type="orderInfo.order_type" :imageWidth="260" :imageHeight="172" mode="comfirm"></order-goods>
|
||||
<!-- <view>
|
||||
<u-image :src="cloudPath + 'img/banner.png'" width="260" height="172"></u-image>
|
||||
</view>
|
||||
<view class="ml20 flex1">
|
||||
<view class="nr bold-600">煎饼果子</view>
|
||||
<view class="text-999 mt10">周一指周日可用</view>
|
||||
<view class="mt20 row-between">
|
||||
<view class="row">
|
||||
<view class="primary">
|
||||
<price-format :price="12.9" :subscriptSize="22" :firstSize="40" :secondSize="32"></price-format>
|
||||
</view>
|
||||
<view class="u-m-l-8">
|
||||
<price-format :lineThrough="true" color="#C0C0C0" :subscriptSize="22" :firstSize="24" :secondSize="24" :price="16.9"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
<view class="num nr">X1</view>
|
||||
</view>
|
||||
</view> -->
|
||||
:order_type="orderInfo.order_type" :imageWidth="186" :imageHeight="186" mode="confirm"></order-goods>
|
||||
</view>
|
||||
|
||||
<view class="item row-between bg-white br16 row u-m-t-32 p24" @tap="showCoupon = true">
|
||||
<view>优惠券</view>
|
||||
<view class="row">
|
||||
<text class="primary" v-if="orderInfo.discount_amount">-￥{{ orderInfo.discount_amount }}</text>
|
||||
<text v-else-if="usableCoupon.length" class="primary">{{
|
||||
<text class="text-default" v-if="orderInfo.discount_amount">-￥{{ orderInfo.discount_amount }}</text>
|
||||
<text v-else-if="usableCoupon.length" class="text-default">{{
|
||||
usableCoupon.length + '张可用'
|
||||
}}</text>
|
||||
<text v-else class="muted">无优惠券可用</text>
|
||||
@ -108,25 +90,25 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white br16 p24 u-m-t-32 nr row-between" @click="appointmentTime">
|
||||
<view>预约时间</view>
|
||||
<view class="row">
|
||||
<view class="u-m-r-10"> {{day}} , {{ time }}</view>
|
||||
<u-icon name="arrow-right" size="32"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white br16 p24 u-m-t-32">
|
||||
<view>
|
||||
备注
|
||||
</view>
|
||||
<view class="flex1 u-m-t-16 mask">
|
||||
<u-input v-model="value" type="textarea" :border="border" maxlength="150"/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white br16 p24 u-m-t-32 nr row-between" @click="appointmentTime">
|
||||
<view>预约时间</view>
|
||||
<view class="row">
|
||||
<view class="u-m-r-10">16:00-16:30</view>
|
||||
<u-icon name="arrow-right" size="32"></u-icon>
|
||||
<u-input v-model="userRemark" type="textarea" maxlength="150"/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="bg-white br16 p24 u-m-t-32 nr">
|
||||
<!-- <view class="bg-white br16 p24 u-m-t-32 nr">
|
||||
<view class="row-between">
|
||||
<view class="row-center">
|
||||
<u-icon name="weixin-circle-fill" color="#28C445" size="80"></u-icon>
|
||||
@ -139,11 +121,11 @@
|
||||
</u-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<view class="bg-white br16 p24 u-m-t-32 nr">
|
||||
<!-- <view class="bg-white br16 p24 u-m-t-32 nr">
|
||||
<view class="row-between">
|
||||
<view class="row-center">
|
||||
<u-icon name="zhifubao-circle-fill" color="#1477FE" size="80"></u-icon>
|
||||
@ -156,7 +138,7 @@
|
||||
</u-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
|
||||
<view class="fixed bg-white row-between px48 u-padding-top-20 u-padding-bottom-20">
|
||||
@ -193,12 +175,13 @@
|
||||
</tabs>
|
||||
</view>
|
||||
</u-popup>
|
||||
<appointment-time v-model="timePopup" @close="timePopup = false" @update="handleSubmitMobile" />
|
||||
<appointment-time v-model="timePopup" @close="timePopup = false" @update="handleSubmitTime" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { orderBuy, getOrderCoupon, getDelivery } from '@/api/order'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@ -233,6 +216,11 @@ export default {
|
||||
usableCoupon: [], // 优惠券--可使用
|
||||
unusableCoupon: [], // 优惠券--不可用
|
||||
showCoupon: false, // 显示优惠券Popup
|
||||
userRemark: '', // 用户留言
|
||||
type: '', // 订单类型
|
||||
day: '',
|
||||
timeId: 0,
|
||||
time: ''
|
||||
}
|
||||
},
|
||||
|
||||
@ -240,6 +228,7 @@ export default {
|
||||
const data = JSON.parse(decodeURIComponent(options.data))
|
||||
console.log("data>>>", data);
|
||||
this.goods = data.goods
|
||||
this.type = data.type
|
||||
|
||||
//#ifdef MP-WEIXIN
|
||||
this.pay.weixin = 1
|
||||
@ -249,8 +238,17 @@ export default {
|
||||
this.pay.alipay = 1
|
||||
//#endif
|
||||
|
||||
// 配送方式
|
||||
getDelivery()
|
||||
this.getDeliveryFun()
|
||||
},
|
||||
|
||||
onUnload() {
|
||||
// 取消全局监听
|
||||
uni.$off(['selectaddress', 'store'])
|
||||
},
|
||||
|
||||
methods: {
|
||||
getDeliveryFun() {
|
||||
getDelivery()
|
||||
.then(({ code, data, msg }) => {
|
||||
// 请求结果判断
|
||||
if (code != 1) throw new Error(msg)
|
||||
@ -285,14 +283,15 @@ export default {
|
||||
uni.$on('payment', (params) => {
|
||||
setTimeout(() => {
|
||||
uni.$off('payment')
|
||||
console.log("payment>>>", 'payment');
|
||||
|
||||
if (params.result) {
|
||||
uni.redirectTo({
|
||||
url: `/pages/pay_result/pay_result?id=${params.order_id}`
|
||||
})
|
||||
} else {
|
||||
uni.redirectTo({
|
||||
url: '/pages/user_order/user_order'
|
||||
uni.reLaunch({
|
||||
url: '/pages/order/order'
|
||||
})
|
||||
}
|
||||
}, 500)
|
||||
@ -305,14 +304,8 @@ export default {
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
onUnload() {
|
||||
// 取消全局监听
|
||||
uni.$off(['selectaddress', 'store'])
|
||||
},
|
||||
|
||||
methods: {
|
||||
appointmentTime() {
|
||||
this.timePopup = true
|
||||
},
|
||||
@ -322,17 +315,17 @@ export default {
|
||||
getOrderCoupon({
|
||||
goods: this.goods
|
||||
})
|
||||
.then(({ code, data, msg }) => {
|
||||
if (code != 1) throw new Error(msg)
|
||||
return data
|
||||
})
|
||||
.then((data) => {
|
||||
this.usableCoupon = data.usable
|
||||
this.unusableCoupon = data.unusable
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
.then(({ code, data, msg }) => {
|
||||
if (code != 1) throw new Error(msg)
|
||||
return data
|
||||
})
|
||||
.then((data) => {
|
||||
this.usableCoupon = data.usable
|
||||
this.unusableCoupon = data.unusable
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err)
|
||||
})
|
||||
},
|
||||
|
||||
// 选择优惠券
|
||||
@ -421,55 +414,53 @@ export default {
|
||||
})
|
||||
},
|
||||
|
||||
// 选择预约时间
|
||||
handleSubmitTime(data) {
|
||||
this.day = data.day
|
||||
this.timeId = data.time_id
|
||||
this.time = data.time
|
||||
this.timePopup = false
|
||||
},
|
||||
|
||||
// 订单提交
|
||||
async handleOrderSubmit(from) {
|
||||
this.showLoading = true
|
||||
// 判断预约时间
|
||||
if (this.day === '今天') {
|
||||
const today = new Date();
|
||||
const year = today.getFullYear();
|
||||
const month = String(today.getMonth() + 1).padStart(2, '0');
|
||||
const date = String(today.getDate()).padStart(2, '0');
|
||||
from.date = `${year}-${month}-${date}`;
|
||||
} else if (this.day === '明天') {
|
||||
const tomorrow = new Date();
|
||||
tomorrow.setDate(tomorrow.getDate() + 1);
|
||||
const year = tomorrow.getFullYear();
|
||||
const month = String(tomorrow.getMonth() + 1).padStart(2, '0');
|
||||
const date = String(tomorrow.getDate()).padStart(2, '0');
|
||||
from.date = `${year}-${month}-${date}`;
|
||||
}
|
||||
|
||||
from.remark = this.userRemark
|
||||
from.type = this.type
|
||||
from.time_id = this.timeId
|
||||
|
||||
// 订单处理
|
||||
// handleOrderMethods(action) {
|
||||
// // 订单提交数据
|
||||
// const orderFrom = {
|
||||
// action,
|
||||
// goods: this.goods,
|
||||
// delivery_type: this.delivery,
|
||||
// use_integral: this.useIntegral,
|
||||
// address_id: this.addressId,
|
||||
// coupon_id: this.couponId,
|
||||
// bargain_launch_id: this.bargainLaunchId == -1 ? '' : this.bargainLaunchId
|
||||
// }
|
||||
|
||||
// switch (action) {
|
||||
// case 'info':
|
||||
// this.initPageData(orderFrom)
|
||||
// break
|
||||
// case 'submit':
|
||||
// this.handleOrderSubmit(orderFrom)
|
||||
// break
|
||||
// }
|
||||
// },
|
||||
|
||||
// // 订单提交
|
||||
// async handleOrderSubmit(from) {
|
||||
// this.showLoading = true
|
||||
|
||||
// from.remark = this.userRemark
|
||||
// from.type = this.type
|
||||
|
||||
// try {
|
||||
// const { code, data, msg } = this.teamId ? await teamBuy(from) : await orderBuy(from)
|
||||
|
||||
// if (code == 1) {
|
||||
// uni.redirectTo({
|
||||
// url: `/pages/payment/payment?from=${data.type}&order_id=${data.order_id}`
|
||||
// })
|
||||
// } else {
|
||||
// throw new Error(msg)
|
||||
// }
|
||||
// } catch (err) {
|
||||
// console.log(err)
|
||||
// // this.$toast({ title: '下单异常，请重新操作' })
|
||||
// } finally {
|
||||
// this.showLoading = false
|
||||
// }
|
||||
// },
|
||||
try {
|
||||
const { code, data, msg } = await orderBuy(from)
|
||||
if (code == 1) {
|
||||
uni.redirectTo({
|
||||
url: `/pages/payment/payment?from=${data.data.type}&order_id=${data.data.order_id}`
|
||||
})
|
||||
} else {
|
||||
throw new Error(msg)
|
||||
}
|
||||
} catch (err) {
|
||||
console.log(err)
|
||||
// this.$toast({ title: '下单异常，请重新操作' })
|
||||
} finally {
|
||||
this.showLoading = false
|
||||
}
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
delivery() {
|
||||
|
||||
134
pages/pay_result/pay_result.vue
Normal file
134
pages/pay_result/pay_result.vue
Normal file
@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<view class="pay-result column-center">
|
||||
<view class="contain bg-white">
|
||||
<view class="header column-center">
|
||||
<view>
|
||||
<image class="tips-icon" :src="`${cloudPath}img/icon_paySuccess.png`"></image>
|
||||
</view>
|
||||
<view class="xl mt20">订单支付成功</view>
|
||||
</view>
|
||||
<view style="height:181rpx"></view>
|
||||
<view class="info">
|
||||
<view class="order-num row-between mt20">
|
||||
<view class="ml20">订单编号</view>
|
||||
<view class="mr20">
|
||||
{{payInfo.order_sn}}
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="payInfo.pay_time" class="order-time row-between mt20">
|
||||
<view class="ml20">付款时间</view>
|
||||
<view class="mr20">{{payInfo.pay_time}}</view>
|
||||
</view>
|
||||
<view class="order-pay-type row-between mt20">
|
||||
<view class="ml20">支付方式</view>
|
||||
<view class="mr20">{{payInfo.pay_way_text}}</view>
|
||||
</view>
|
||||
<view class="order-pay-money row-between mt20">
|
||||
<view class="ml20">支付金额</view>
|
||||
<view class="mr20">
|
||||
<price-format :price="payInfo.order_amount"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="line ml20"></view>
|
||||
<view class="opt-btn-contain row-center wrap">
|
||||
<navigator hover-class="none" class="check-order-btn row-center bg-default br60 mt20" open-type="switchTab" url="/pages/order/order">
|
||||
<view class="white lg">查看订单</view>
|
||||
</navigator>
|
||||
<navigator hover-class="none" class="go-back-btn row-center br60 mt20" open-type="switchTab" url="/pages/index/index">
|
||||
<view class="textdefault br60 lg">返回首页</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getOrderDetail
|
||||
} from '@/api/order';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
payInfo: {}
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
|
||||
},
|
||||
props: {},
|
||||
onLoad: function(options) {
|
||||
this.id = options.id;
|
||||
this.getOrderResultFun();
|
||||
},
|
||||
|
||||
|
||||
methods: {
|
||||
getOrderResultFun() {
|
||||
getOrderDetail(this.id).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.payInfo = res.data
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.pay-result {
|
||||
.contain {
|
||||
width: 682rpx;
|
||||
margin-left: 20rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-top: 78rpx;
|
||||
padding-left: 20rpx;
|
||||
padding-right: 20rpx;
|
||||
padding-bottom: 40rpx;
|
||||
position: relative;
|
||||
|
||||
.tips-icon {
|
||||
width: 112rpx;
|
||||
height: 112rpx;
|
||||
}
|
||||
|
||||
.header {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: -50rpx;
|
||||
}
|
||||
|
||||
.order-num {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.info {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.opt-btn-contain {
|
||||
margin-top: 40rpx;
|
||||
|
||||
.check-order-btn {
|
||||
width: 650rpx;
|
||||
height: 84rpx;
|
||||
}
|
||||
|
||||
.go-back-btn {
|
||||
width: 650rpx;
|
||||
height: 84rpx;
|
||||
border:1px solid #254062;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 650rpx;
|
||||
border-top: 1px solid rgba(229, 229, 229, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -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>
|
||||
|
||||
@ -2,24 +2,27 @@
|
||||
<view>
|
||||
<view class="shop">
|
||||
<view>
|
||||
<u-swiper :list="goods.goods_image" name="uri" height="500" border-radius="0" mode="number" indicator-pos="bottomRight"></u-swiper>
|
||||
<u-swiper :list="goods.goods_image" name="uri" height="500" border-radius="0" mode="number"
|
||||
indicator-pos="bottomRight"></u-swiper>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-padding-top-20 u-padding-bottom-20 br24">
|
||||
<view class="nr">{{ goods.name }}</view>
|
||||
<view class="mt10 row u-row-between">
|
||||
<view class="row">
|
||||
<view class="primary">
|
||||
<price-format :price="goods.min_price" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||||
<price-format :price="goods.min_price" :subscriptSize="22" :firstSize="34"
|
||||
:secondSize="26"></price-format>
|
||||
</view>
|
||||
<view class="sale u-text-center primary u-m-l-12">0折</view>
|
||||
<view class="primary u-m-l-12">
|
||||
<price-format :lineThrough="true" color="#999" :subscriptSize="22" :firstSize="22" :secondSize="22" :price="goods.market_price"></price-format>
|
||||
<price-format :lineThrough="true" color="#999" :subscriptSize="22" :firstSize="22"
|
||||
:secondSize="22" :price="goods.market_price"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-999">已售66</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="u-m-t-20 u-m-b-20">
|
||||
<u-line color="#eee" />
|
||||
</view>
|
||||
@ -28,31 +31,30 @@
|
||||
<text>须知</text>
|
||||
<text class="text-999 ml20">周一至周日可用</text>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="row-between mt20">
|
||||
<view>
|
||||
<text>保障</text>
|
||||
<text class="text-999 ml20">随时退 过期自动退</text>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="openSpec" hover-class="none"
|
||||
:customStyle="{width: '116rpx', height: '46rpx', lineHeight: '46rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx'}"
|
||||
:hair-line="false"
|
||||
shape="circle">
|
||||
选规格
|
||||
<u-button @click="openSpec" hover-class="none"
|
||||
:customStyle="{ width: '116rpx', height: '46rpx', lineHeight: '46rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx' }"
|
||||
:hair-line="false" shape="circle">
|
||||
选规格
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="u-m-t-24">
|
||||
<view class="u-m-l-48 nr">详情</view>
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-p-t-20 u-p-b-20 br24">
|
||||
<u-image :src="cloudPath + 'img/banner.png'" height="600"></u-image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="u-m-t-24">
|
||||
<view class="u-m-l-48 nr">购买须知</view>
|
||||
<view class="bg-white mx24 px24 u-m-t-24 u-p-t-20 u-p-b-20 br24">
|
||||
@ -60,127 +62,221 @@
|
||||
</view>
|
||||
</view>
|
||||
</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"
|
||||
:customStyle="{height: '92rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx'}"
|
||||
:hair-line="false"
|
||||
shape="circle">
|
||||
立即购买
|
||||
<u-button hover-class="none" @click="showSpecFun"
|
||||
:customStyle="{ height: '92rpx', fontSize: '24rpx', backgroundColor: themeColor, color: '#fff', border: 'none', paddingTop: '8rpx' }"
|
||||
:hair-line="false" shape="circle">
|
||||
立即购买
|
||||
</u-button>
|
||||
</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" @confirm="confirmSpec"
|
||||
@buynow="onBuy"></shop-spec>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getGoodsDetail,
|
||||
addCart,
|
||||
getPoster,
|
||||
getCartNum
|
||||
} from '@/api/store'
|
||||
import {
|
||||
toLogin
|
||||
} from '@/utils/login'
|
||||
import {
|
||||
mapActions,
|
||||
mapGetters
|
||||
} from 'vuex';
|
||||
import {
|
||||
getGoodsDetail,
|
||||
getCartList,
|
||||
addCart,
|
||||
getPoster,
|
||||
getCartNum
|
||||
} from '@/api/store'
|
||||
import {
|
||||
toLogin
|
||||
} from '@/utils/login'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id: 0,
|
||||
showSpec: false,
|
||||
goods: [],
|
||||
spec: [],
|
||||
checkedGoods: {},
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id: 0,
|
||||
showSpec: false,
|
||||
goods: [],
|
||||
spec: [],
|
||||
checkedGoods: {},
|
||||
source: '',
|
||||
cartLists: [],
|
||||
totalPrice: 0,
|
||||
showPopup: false,
|
||||
}
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
console.log("🚀 ~ onLoad ~ options:", options)
|
||||
this.id = options.id
|
||||
this.showPopup = options.showPopup === 'true' ? true : false
|
||||
this.showSpec = this.showPopup
|
||||
},
|
||||
|
||||
onUnload() {
|
||||
uni.$emit('refreshCartList');
|
||||
},
|
||||
|
||||
onShow() {
|
||||
this.getGoodsDetailFun();
|
||||
this.getCartNum()
|
||||
this.getCartListFun()
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapActions(['getCartNum']),
|
||||
|
||||
// 获取商品详情
|
||||
async getGoodsDetailFun() {
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await getGoodsDetail({
|
||||
id: this.id
|
||||
});
|
||||
if (code == 1) {
|
||||
this.goods = data
|
||||
console.log(this.goods.goods_image);
|
||||
}
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
this.id = options.id
|
||||
},
|
||||
// 获取购物车列表数据
|
||||
getCartListFun() {
|
||||
// 获取商品的分类ID
|
||||
getCartList().then((res) => {
|
||||
if (res.code == 1) {
|
||||
let {
|
||||
lists,
|
||||
total_amount
|
||||
} = res.data;
|
||||
this.cartLists = lists;
|
||||
// // let cartType = 0;
|
||||
|
||||
onShow() {
|
||||
this.getGoodsDetailFun();
|
||||
},
|
||||
// // if (lists.length == 0) {
|
||||
// // cartType = 2;
|
||||
// // } else {
|
||||
// // cartType = 1;
|
||||
// // }
|
||||
|
||||
methods: {
|
||||
// 获取商品详情
|
||||
async getGoodsDetailFun() {
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await getGoodsDetail({
|
||||
id: this.id
|
||||
});
|
||||
if (code == 1) {
|
||||
this.goods = data
|
||||
console.log(this.goods.goods_image);
|
||||
|
||||
// this.cartLists = list;
|
||||
// console.log(">>>", this.cartLists);
|
||||
|
||||
// // this.cartType = cartType;
|
||||
this.totalPrice = total_amount
|
||||
// // this.isShow = true;
|
||||
this.getCartNum();
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
// 打开商品规格
|
||||
openSpec() {
|
||||
this.showSpec = true
|
||||
},
|
||||
// 将当前的商品添加到购物车里面
|
||||
addCartFun() {
|
||||
this.showSpec = true
|
||||
},
|
||||
|
||||
// 获取选择的商品规格
|
||||
confirmSpec(data) {
|
||||
console.log("data>>>", data.spec);
|
||||
this.spec = data.spec
|
||||
this.showSpec = false
|
||||
},
|
||||
// 打开商品规格
|
||||
openSpec() {
|
||||
this.showSpec = true
|
||||
},
|
||||
|
||||
onChangeGoods(e) {
|
||||
console.log(e);
|
||||
this.checkedGoods = e.detail;
|
||||
},
|
||||
// 获取选择的商品规格
|
||||
confirmSpec(data) {
|
||||
console.log("data>>>", data.spec);
|
||||
this.spec = data.spec
|
||||
this.showSpec = false
|
||||
},
|
||||
|
||||
// 选择规格
|
||||
showSpecFun() {
|
||||
if (!this.isLogin) return toLogin();
|
||||
this.showSpec = true;
|
||||
},
|
||||
onChangeGoods(e) {
|
||||
console.log(e);
|
||||
this.checkedGoods = e.detail;
|
||||
},
|
||||
|
||||
// 购买商品
|
||||
onBuy(e) {
|
||||
let {id, goodsNum} = e.detail
|
||||
let goods = [{item_id: id, num: goodsNum}]
|
||||
const params = {goods}
|
||||
// 选择规格
|
||||
showSpecFun() {
|
||||
if (!this.isLogin) return toLogin();
|
||||
this.showSpec = true;
|
||||
},
|
||||
|
||||
// 购买商品
|
||||
onBuy(e) {
|
||||
if (e.type === 'cart') {
|
||||
let { id, goodsNum } = e.detail
|
||||
addCart({
|
||||
item_id: id,
|
||||
goods_num: goodsNum
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$toast({
|
||||
title: res.msg
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
this.getCartListFun()
|
||||
if (this.showPopup) {
|
||||
setTimeout(() => {
|
||||
uni.redirectTo({
|
||||
url: '/pages/store/store'
|
||||
});
|
||||
}, 300);
|
||||
}
|
||||
this.showSpec = false
|
||||
});
|
||||
} 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>
|
||||
|
||||
<style lang="scss">
|
||||
.shop {
|
||||
padding-bottom: 180rpx;
|
||||
.sale {
|
||||
background-color: #FEFBEA;
|
||||
width: 100rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
.shop {
|
||||
padding-bottom: 180rpx;
|
||||
|
||||
.sale {
|
||||
background-color: #FEFBEA;
|
||||
width: 100rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.number {
|
||||
background-color: #FF2C3C;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -215,20 +215,20 @@
|
||||
});
|
||||
}
|
||||
});
|
||||
console.log("this.cartList>>>", goods);
|
||||
console.log("this.cartList1>>>", goods);
|
||||
|
||||
if (goods.length == 0) return this.$toast({
|
||||
title: "您还没有选择商品哦",
|
||||
});
|
||||
// uni.navigateTo({
|
||||
// url: "/pages/confirm_order/confirm_order?data=" +
|
||||
// encodeURIComponent(
|
||||
// JSON.stringify({
|
||||
// goods,
|
||||
// type: "cart",
|
||||
// })
|
||||
// ),
|
||||
// });
|
||||
uni.navigateTo({
|
||||
url: "/pages/order_now/order_now?data=" +
|
||||
encodeURIComponent(
|
||||
JSON.stringify({
|
||||
goods,
|
||||
type: "cart",
|
||||
})
|
||||
),
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
@ -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;
|
||||
|
||||
|
||||
@ -10,14 +10,17 @@
|
||||
MEET轻食店
|
||||
<u-icon name="arrow-right" size="28" class="right-icon u-m-l-4"></u-icon>
|
||||
</view>
|
||||
<view class="u-flex u-m-t-8" @click="chooseAddress">
|
||||
<!-- <view class="u-flex u-m-t-8" @click="chooseAddress">
|
||||
<u-icon name="map" size="32"></u-icon>
|
||||
门店地址
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view>
|
||||
<!-- <view>
|
||||
<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>
|
||||
<view class="">
|
||||
<u-alert-tips type="warning" title="当前门店已休息"></u-alert-tips>
|
||||
</view>
|
||||
<cate-one :list="cateList"></cate-one>
|
||||
</view>
|
||||
@ -34,7 +37,6 @@
|
||||
keyword: ''
|
||||
}
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
this.getCatrgoryFun();
|
||||
},
|
||||
|
||||
BIN
static/coupon_bg.png
Normal file
BIN
static/coupon_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
@ -64,6 +64,10 @@ page {
|
||||
|
||||
/* 定义字体大小 */
|
||||
|
||||
.xxxl {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.xxl {
|
||||
font-size: 36rpx;
|
||||
}
|
||||
@ -506,10 +510,12 @@ checkbox {
|
||||
.text-666 {color: #666}
|
||||
.text-999 {color: #999}
|
||||
.text-fff {color: #fff}
|
||||
.text-000 {color: #000}
|
||||
.text-gray {color: #86909C}
|
||||
.text-default {color: #254062}
|
||||
|
||||
.bg-default {background-color: #254062}
|
||||
.text-nowrap {white-space: nowrap}
|
||||
|
||||
.fixed {position: fixed;}
|
||||
|
||||
|
||||
2
uni.scss
2
uni.scss
@ -71,4 +71,4 @@ $u-form-item-height: 70rpx;
|
||||
|
||||
$-color-theme: #254062;
|
||||
|
||||
$cloudPath: 'http://jianbing-media.stnav.com/frontend/';
|
||||
$cloudPath: 'https://jianbing-media.stnav.com/frontend/';
|
||||
@ -269,14 +269,14 @@ export function menuJump(item) {
|
||||
}
|
||||
}
|
||||
|
||||
export function uploadFile(path, token = '') {
|
||||
export function uploadFile(path) {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.uploadFile({
|
||||
url: `${baseURL}/api/file/formimage`,
|
||||
url: `${baseURL}/api/file/formImage`,
|
||||
filePath: path,
|
||||
name: "file",
|
||||
header: {
|
||||
token: store.getters.token || token,
|
||||
token: store.getters.token,
|
||||
},
|
||||
fileType: "image",
|
||||
cloudPath: "",
|
||||
|
||||
@ -23,13 +23,14 @@ export const orderType = {
|
||||
// 全部
|
||||
ALL: 'all',
|
||||
// 待付款
|
||||
WAIT_PAY: 'wait_pay',
|
||||
PAY: 'pay',
|
||||
// 未制作
|
||||
NOT_MADE: 'not_made',
|
||||
DELIVERY: 'delivery',
|
||||
// 已完成
|
||||
FINISH: 'finish',
|
||||
// 退款
|
||||
REFUND: 'refund'
|
||||
REFUND: 'refund',
|
||||
CLOSE: 'close' //待收货
|
||||
};
|
||||
// 售后状态
|
||||
export const AfterSaleType = {
|
||||
|
||||
Reference in New Issue
Block a user