|
@@ -0,0 +1,755 @@
|
|
|
+<template>
|
|
|
+ <view :style="colorStyle">
|
|
|
+ <view class="my-order">
|
|
|
+
|
|
|
+ <view class="nav acea-row row-around" style="position: fixed;top: 0;">
|
|
|
+ <view class="item" :class="orderStatus === 0 ? 'on' : ''" @click="statusClick(0)">
|
|
|
+ <view>待服务</view>
|
|
|
+ <!-- <view class="num">{{ orderData.order_count || 0 }}</view> -->
|
|
|
+ </view>
|
|
|
+ <!-- <view class="item" :class="orderStatus === 1 ? 'on' : ''" @click="statusClick(1)">
|
|
|
+ <view>进行中</view>
|
|
|
+ <view class="num">{{ orderData.unpaid_count || 0 }}</view>
|
|
|
+ </view> -->
|
|
|
+ <view class="item" :class="orderStatus == 2 ? 'on' : ''" @click="statusClick(2)">
|
|
|
+ <view>已完成</view>
|
|
|
+ <!-- <view class="num">{{ orderData.unshipped_count || 0 }}</view> -->
|
|
|
+ </view>
|
|
|
+ <view class="item" :class="orderStatus == 3 ? 'on' : ''" @click="statusClick(3)">
|
|
|
+ <view>已退款</view>
|
|
|
+ <!-- <view class="num ">{{ orderData.received_count || 0 }}</view> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="nav">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <Loading :loaded="loaded" :loading="loading"></Loading>
|
|
|
+ <view class="list">
|
|
|
+ <view class="item" v-for="(item, index) in orderList" :key="index">
|
|
|
+ <view @click="goOrderDetails(item.order_id)">
|
|
|
+ <view class="title acea-row row-between-wrapper">
|
|
|
+ <view class="acea-row row-middle">
|
|
|
+ 订单ID:{{item.order_id}}
|
|
|
+ </view>
|
|
|
+ <!-- <view v-if="item._status._type == 9" class="font-color">线下付款,未支付</view>
|
|
|
+ <view v-else-if="item._status._type == 0" class="font-color">待付款</view>
|
|
|
+ <view v-else-if="item._status._type == 1 && (item.shipping_type == 1 || item.shipping_type == 3)" class="font-color">待发货
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == 1 && (item.shipping_type == 2 || item.shipping_type == 4)" class="font-color">
|
|
|
+ {{item.shipping_type == 2?'待核销':'待收货'}}
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == 2" class="font-color">待收货
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == 3" class="font-color">待评价
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == 4" class="font-color">已完成
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == -2" class="font-color">已退款
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == 5 && item.status == 0" class="font-color">待核销
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == 5 && item.status == 5" class="font-color">部分核销
|
|
|
+ <text v-if="item.refund.length">{{item.is_all_refund?',退款中':',部分退款中'}}</text>
|
|
|
+ </view>
|
|
|
+ <view v-else-if="item._status._type == -1" class="font-color">申请退款
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+ <view class="item-info acea-row row-between row-top" v-for="(items, index) in item.info"
|
|
|
+ :key="index">
|
|
|
+ <view class="pictrue">
|
|
|
+ <image :src="items.slider_image"></image>
|
|
|
+ </view>
|
|
|
+ <view class="text acea-row row-between">
|
|
|
+ <view class="name line2">{{ items.store_name }}</view>
|
|
|
+ <view class="money">
|
|
|
+ <view >¥{{ items.pay_price }}</view>
|
|
|
+ <view>x1</view>
|
|
|
+ <!-- <view v-if="items.refund_num && item._status._type != -2" class="return">{{ items.refund_num }}件退款中</view> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="totalPrice showstore">
|
|
|
+ <view class="">
|
|
|
+ 下单时间: {{ showTime(item.add_time) }}
|
|
|
+ </view>
|
|
|
+ <view class="">
|
|
|
+ 预约时间: {{ showTime(item.reservation_time) }}
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="address acea-row row-between-wrapper" style="padding: 10rpx 30rpx;">
|
|
|
+ <view class="addressCon">
|
|
|
+ <view class='name acea-row row-middle'>
|
|
|
+ <view class="nameCon line1 on">{{item.store.name || ''}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="line1">
|
|
|
+ {{item.store.detailed_address || ''}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="icon acea-row row-middle" >
|
|
|
+ <view class="iconfont icon-dianhua" @click.stop="call(item.store.phone)"></view>
|
|
|
+ <view class="iconfont icon-dingwei2" @click.stop="showMaoLocation(item.store)"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="totalPrice">
|
|
|
+ 共{{ item.info.length || 0 }}件商品,总金额
|
|
|
+ <text class="money">¥{{ showTolPrice(item.info) }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="bottom acea-row row-right row-middle" >
|
|
|
+ <!-- <view class="icon acea-row row-middle" style="justify-self: flex-start;">
|
|
|
+ <view class="iconfont icon-dianhua" @click.stop="call(item.store.phone)"></view>
|
|
|
+ <view class="iconfont icon-dingwei2" @click.stop="showMaoLocation(tem.store)"></view>
|
|
|
+ </view> -->
|
|
|
+ <view class="bnt cancelBnt" v-if="item.status == 0 || item.status==1"
|
|
|
+ @click="cancelOrder(index, item.order_id)">取消订单</view>
|
|
|
+ <!-- <view class="bnt bg-color" v-if="item._status._type == 0"
|
|
|
+ @click="goPay(item.pay_price, item.order_id)">立即付款</view> -->
|
|
|
+ <!-- <view class="bnt bg-color" v-else-if="item._status._type == 3"
|
|
|
+ @click="goOrderDetails(item.order_id)">去评价</view> -->
|
|
|
+ <!-- <view class="bnt bg-color"
|
|
|
+ v-else-if="item.seckill_id < 1 && item.bargain_id < 1 && item.combination_id < 1 && item._status._type == 4"
|
|
|
+ @click="goOrderDetails(item.order_id)">
|
|
|
+ 再次购买
|
|
|
+ </view> -->
|
|
|
+ <!-- <view class="bnt cancelBnt" v-if="item._status._type == 4"
|
|
|
+ @click="delOrder(item.order_id, index)">删除订单</view> -->
|
|
|
+ <!-- <view class="bnt bg-color" @click="goOrderDetails(item.order_id)">查看详情</view> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="loadingicon acea-row row-center-wrapper" v-if="orderList.length > 0">
|
|
|
+ <text class="loading iconfont icon-jiazai" :hidden="loading == false"></text>
|
|
|
+ {{ loadTitle }}
|
|
|
+ </view>
|
|
|
+ <view v-if="orderList.length == 0 && !loading">
|
|
|
+ <emptyPage title="暂无订单信息~"></emptyPage>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <home v-if="navigation"></home>
|
|
|
+ <payment :payMode="payMode" :pay_close="pay_close" @onChangeFun="onChangeFun" :order_id="pay_order_id"
|
|
|
+ :totalPrice="totalPrice"></payment>
|
|
|
+ <!-- #ifdef MP -->
|
|
|
+ <!-- <authorize v-if="isShowAuth" @authColse="authColse" @onLoadFun="onLoadFun"></authorize> -->
|
|
|
+ <!-- #endif -->
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ getOrderList,
|
|
|
+ orderData,
|
|
|
+ orderCancel,
|
|
|
+ orderDel,
|
|
|
+ orderPay
|
|
|
+ } from '@/api/order.js';
|
|
|
+ import {
|
|
|
+ getUserInfo,
|
|
|
+ getServeOrder
|
|
|
+ } from '@/api/user.js';
|
|
|
+ import {
|
|
|
+ openOrderSubscribe
|
|
|
+ } from '@/utils/SubscribeMessage.js';
|
|
|
+ import home from '@/components/home';
|
|
|
+ import payment from '@/components/payment';
|
|
|
+ import {
|
|
|
+ toLogin
|
|
|
+ } from '@/libs/login.js';
|
|
|
+ import {
|
|
|
+ mapGetters
|
|
|
+ } from 'vuex';
|
|
|
+ import emptyPage from '@/components/emptyPage.vue';
|
|
|
+ import colors from '@/mixins/color.js';
|
|
|
+ import Loading from '@/components/Loading/index.vue'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ Loading,
|
|
|
+ payment,
|
|
|
+ home,
|
|
|
+ emptyPage
|
|
|
+ },
|
|
|
+ mixins:[colors],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loaded: false,
|
|
|
+ loading: false, //是否加载中
|
|
|
+ loadend: false, //是否加载完毕
|
|
|
+ loadTitle: '加载更多', //提示语
|
|
|
+ orderList: [], //订单数组
|
|
|
+ orderData: {}, //订单详细统计
|
|
|
+ orderStatus: 0, //订单状态
|
|
|
+ page: 1,
|
|
|
+ limit: 20,
|
|
|
+ payMode: [{
|
|
|
+ name: '微信支付',
|
|
|
+ icon: 'icon-weixinzhifu',
|
|
|
+ value: 'weixin',
|
|
|
+ title: '使用微信快捷支付',
|
|
|
+ payStatus: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '支付宝支付',
|
|
|
+ icon: 'icon-zhifubao',
|
|
|
+ value: 'alipay',
|
|
|
+ title: '使用线上支付宝支付',
|
|
|
+ payStatus: true
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '余额支付',
|
|
|
+ icon: 'icon-yuezhifu',
|
|
|
+ value: 'yue',
|
|
|
+ title: '当前可用余额:',
|
|
|
+ number: 0,
|
|
|
+ payStatus: true
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ pay_close: false,
|
|
|
+ pay_order_id: '',
|
|
|
+ totalPrice: '0',
|
|
|
+ isAuto: false, //没有授权的不会自动授权
|
|
|
+ isShowAuth: false //是否隐藏授权
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: mapGetters(['isLogin']),
|
|
|
+ onShow() {
|
|
|
+ uni.removeStorageSync('form_type_cart');
|
|
|
+ this.page = 1;
|
|
|
+ this.loadend = false;
|
|
|
+ this.orderList = [];
|
|
|
+ if (this.isLogin) {
|
|
|
+ this.getFun();
|
|
|
+ } else {
|
|
|
+ toLogin()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 生命周期函数--监听页面加载
|
|
|
+ */
|
|
|
+ onLoad(options) {
|
|
|
+ if (options.status) this.orderStatus = (options.status==undefined && options.status!=0)?'':parseInt(options.status);
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ showTime(time) {
|
|
|
+ var date = new Date(time*1000);
|
|
|
+ var year = date.getFullYear(); // 获取年份
|
|
|
+ var month = ("0" + (date.getMonth() + 1)).slice(-2); // 获取月份(注意月份从 0 开始,需要加 1)
|
|
|
+ var day = ("0" + date.getDate()).slice(-2); // 获取日期
|
|
|
+ var hours = ("0" + date.getHours()).slice(-2); // 获取小时
|
|
|
+ var minutes = ("0" + date.getMinutes()).slice(-2); // 获取分钟
|
|
|
+ var seconds = ("0" + date.getSeconds()).slice(-2); // 获取秒钟
|
|
|
+
|
|
|
+ var dateString = year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds; // 自定义时间格式
|
|
|
+ return dateString
|
|
|
+ },
|
|
|
+ call(phone) {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: phone,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ showMaoLocation(e) {
|
|
|
+ let self = this;
|
|
|
+ // #ifdef H5
|
|
|
+ if (self.$wechat.isWeixin()) {
|
|
|
+ self.$wechat.seeLocation({
|
|
|
+ latitude: Number(e.latitude),
|
|
|
+ longitude: Number(e.longitude),
|
|
|
+ name: e.name,
|
|
|
+ scale: 13,
|
|
|
+ address: `${e.address}-${e.detailed_address}`,
|
|
|
+ }).then(res => {})
|
|
|
+ } else {
|
|
|
+ // #endif
|
|
|
+ uni.openLocation({
|
|
|
+ latitude: Number(e.latitude),
|
|
|
+ longitude: Number(e.longitude),
|
|
|
+ name: e.name,
|
|
|
+ address: `${e.address}-${e.detailed_address}`,
|
|
|
+ success: function() {
|
|
|
+ Number
|
|
|
+ }
|
|
|
+ });
|
|
|
+ // #ifdef H5
|
|
|
+ }
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ showTolPrice(list) {
|
|
|
+ let price = 0;
|
|
|
+ list.forEach(item => {
|
|
|
+ price += item.pay_price*1
|
|
|
+ })
|
|
|
+ return price.toFixed(2)
|
|
|
+ },
|
|
|
+ getFun(){
|
|
|
+ // this.getOrderData();
|
|
|
+ this.getOrderList();
|
|
|
+ this.getUserInfo();
|
|
|
+ },
|
|
|
+ onLoadFun(){
|
|
|
+ this.getFun();
|
|
|
+ this.isShowAuth = false;
|
|
|
+ },
|
|
|
+ // 授权关闭
|
|
|
+ authColse: function(e) {
|
|
|
+ this.isShowAuth = e;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 事件回调
|
|
|
+ *
|
|
|
+ */
|
|
|
+ onChangeFun: function(e) {
|
|
|
+ let opt = e;
|
|
|
+ let action = opt.action || null;
|
|
|
+ let value = opt.value != undefined ? opt.value : null;
|
|
|
+ action && this[action] && this[action](value);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取用户信息
|
|
|
+ *
|
|
|
+ */
|
|
|
+ getUserInfo: function() {
|
|
|
+ let that = this;
|
|
|
+ getUserInfo().then(res => {
|
|
|
+ that.payMode[2].number = res.data.now_money;
|
|
|
+ that.$set(that, 'payMode', that.payMode);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 关闭支付组件
|
|
|
+ *
|
|
|
+ */
|
|
|
+ payClose: function() {
|
|
|
+ this.pay_close = false;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取订单统计数据
|
|
|
+ *
|
|
|
+ */
|
|
|
+ getOrderData: function() {
|
|
|
+ let that = this;
|
|
|
+ orderData().then(res => {
|
|
|
+ that.$set(that, 'orderData', res.data);
|
|
|
+ that.payMode.map(item => {
|
|
|
+ if (item.value == 'weixin') {
|
|
|
+ item.payStatus = res.data.pay_weixin_open ? true : false;
|
|
|
+ }
|
|
|
+ if (item.value == 'alipay') {
|
|
|
+ item.payStatus = res.data.ali_pay_status ? true : false;
|
|
|
+ }
|
|
|
+ if (item.value == 'yue') {
|
|
|
+ item.payStatus = res.data.yue_pay_status == 1 ? true : false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //#ifdef MP
|
|
|
+ this.payMode[1].payStatus = false;
|
|
|
+ //#endif
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 取消订单
|
|
|
+ *
|
|
|
+ */
|
|
|
+ cancelOrder: function(index, order_id) {
|
|
|
+ let that = this;
|
|
|
+ if (!order_id)
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: '缺少订单号无法取消订单'
|
|
|
+ });
|
|
|
+ uni.showModal({
|
|
|
+ title: '取消订单',
|
|
|
+ content: '您是否确认取消此订单',
|
|
|
+ confirmText: '确认',
|
|
|
+ cancelText: '再想想',
|
|
|
+ success: (res) => {
|
|
|
+ if (res.confirm) {
|
|
|
+ orderCancel(order_id)
|
|
|
+ .then(res => {
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: res.msg,
|
|
|
+ icon: 'success'
|
|
|
+ },
|
|
|
+ function() {
|
|
|
+ that.orderList.splice(index, 1);
|
|
|
+ that.$set(that, 'orderList', that.orderList);
|
|
|
+ that.$set(that.orderData, 'unpaid_count', that.orderData.unpaid_count - 1);
|
|
|
+ that.getOrderData();
|
|
|
+ }
|
|
|
+ );
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: err
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 打开支付组件
|
|
|
+ *
|
|
|
+ */
|
|
|
+ goPay: function(pay_price, order_id) {
|
|
|
+ this.$set(this, 'pay_close', true);
|
|
|
+ this.$set(this, 'pay_order_id', order_id);
|
|
|
+ this.$set(this, 'totalPrice', pay_price);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 支付成功回调
|
|
|
+ *
|
|
|
+ */
|
|
|
+ pay_complete: function() {
|
|
|
+ this.loadend = false;
|
|
|
+ this.page = 1;
|
|
|
+ this.$set(this, 'orderList', []);
|
|
|
+ this.pay_close = false;
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/goods/order_pay_status/index?order_id=' + this.pay_order_id +
|
|
|
+ '&msg=支付成功&type=3&totalPrice=' + this.totalPrice
|
|
|
+ })
|
|
|
+ this.pay_order_id = '';
|
|
|
+ this.getOrderData();
|
|
|
+ this.getOrderList();
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 支付失败回调
|
|
|
+ *
|
|
|
+ */
|
|
|
+ pay_fail: function() {
|
|
|
+ this.pay_close = false;
|
|
|
+ this.pay_order_id = '';
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 去订单详情
|
|
|
+ */
|
|
|
+ goOrderDetails: function(order_id) {
|
|
|
+ if (!order_id)
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: '缺少订单号无法查看订单详情'
|
|
|
+ });
|
|
|
+ // #ifdef MP
|
|
|
+ uni.showLoading({
|
|
|
+ title: '正在加载'
|
|
|
+ });
|
|
|
+ openOrderSubscribe()
|
|
|
+ .then(() => {
|
|
|
+ uni.hideLoading();
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/goods/order_details/index?order_id=' + order_id
|
|
|
+ })
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ uni.hideLoading();
|
|
|
+ });
|
|
|
+ // #endif
|
|
|
+ // #ifndef MP
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/goods/order_details/index?order_id=' + order_id
|
|
|
+ });
|
|
|
+ // #endif
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 切换类型
|
|
|
+ */
|
|
|
+ statusClick: function(status) {
|
|
|
+ if(this.loading) return
|
|
|
+ if (status === this.orderStatus) return;
|
|
|
+ this.orderStatus = status;
|
|
|
+ this.loadend = false;
|
|
|
+ this.page = 1;
|
|
|
+ this.$set(this, 'orderList', []);
|
|
|
+ this.getOrderList();
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 获取订单列表
|
|
|
+ */
|
|
|
+ getOrderList: function() {
|
|
|
+ let that = this;
|
|
|
+ if (that.loadend) return;
|
|
|
+ if (that.loading) return;
|
|
|
+ that.loading = true;
|
|
|
+ that.loadTitle = '加载更多';
|
|
|
+ getServeOrder({
|
|
|
+ status: that.orderStatus,
|
|
|
+ page: that.page,
|
|
|
+ limit: that.limit
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ let list = res.data.list || [];
|
|
|
+ console.log(list,'list')
|
|
|
+ if(that.orderStatus == 0) {
|
|
|
+ that.orderData.order_count = res.data.count;
|
|
|
+ }else if(that.orderStatus == 1) {
|
|
|
+ that.orderData.unpaid_count = res.data.count;
|
|
|
+ }else if(that.orderStatus == 2) {
|
|
|
+ that.orderData.unshipped_count = res.data.count;
|
|
|
+ }else if(that.orderStatus == 3) {
|
|
|
+ that.orderData.received_count = res.data.count;
|
|
|
+ }
|
|
|
+ let loadend = list.length < that.limit;
|
|
|
+ that.orderList = that.$util.SplitArray(list, that.orderList);
|
|
|
+ that.$set(that, 'orderList', that.orderList);
|
|
|
+ that.loadend = loadend;
|
|
|
+ that.loading = false;
|
|
|
+ that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
|
|
|
+ that.page = that.page + 1;
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ that.loading = false;
|
|
|
+ that.loadTitle = '加载更多';
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 删除订单
|
|
|
+ */
|
|
|
+ delOrder: function(order_id, index) {
|
|
|
+ let that = this;
|
|
|
+ uni.showModal({
|
|
|
+ title: '删除订单',
|
|
|
+ content: '确定删除该订单',
|
|
|
+ success: function (res) {
|
|
|
+ if (res.confirm) {
|
|
|
+ orderDel(order_id)
|
|
|
+ .then(res => {
|
|
|
+ that.orderList.splice(index, 1);
|
|
|
+ that.$set(that, 'orderList', that.orderList);
|
|
|
+ that.$set(that.orderData, 'unpaid_count', that.orderData.unpaid_count - 1);
|
|
|
+ that.getOrderData();
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: '删除成功',
|
|
|
+ icon: 'success'
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: err
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else if (res.cancel) {
|
|
|
+ return that.$util.Tips({
|
|
|
+ title: '已取消'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onReachBottom: function() {
|
|
|
+ this.getOrderList();
|
|
|
+ }
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .my-order .header {
|
|
|
+ height: 260rpx;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .header .picTxt {
|
|
|
+ height: 190rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .header .picTxt .text {
|
|
|
+ color: rgba(255, 255, 255, 0.8);
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-family: 'Guildford Pro';
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .header .picTxt .text .name {
|
|
|
+ font-size: 34rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #fff;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .header .picTxt .pictrue {
|
|
|
+ width: 122rpx;
|
|
|
+ height: 109rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .header .picTxt .pictrue image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .nav {
|
|
|
+ background-color: #fff;
|
|
|
+ width: 750rpx;
|
|
|
+ height: 90rpx;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ margin: 0 auto ;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .nav .item {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #282828;
|
|
|
+ padding: 27rpx 0;
|
|
|
+ border-bottom: 5rpx solid transparent;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .nav .item.on {
|
|
|
+ /* #ifdef H5 || MP */
|
|
|
+ font-weight: bold;
|
|
|
+ /* #endif */
|
|
|
+ /* #ifdef APP-PLUS */
|
|
|
+ color: #000;
|
|
|
+ /* #endif */
|
|
|
+ border-color: var(--view-theme);
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .nav .item .num {
|
|
|
+ margin-top: 18rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list {
|
|
|
+ width: 690rpx;
|
|
|
+ margin: 14rpx auto 0 auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ margin-bottom: 14rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .title {
|
|
|
+ height: 84rpx;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ border-bottom: 1rpx solid #eee;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #282828;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .title .sign {
|
|
|
+ font-size: 24rpx;
|
|
|
+ padding: 0 7rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ margin-right: 15rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info {
|
|
|
+ padding: 0 30rpx;
|
|
|
+ margin-top: 22rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info .pictrue {
|
|
|
+ width: 120rpx;
|
|
|
+ height: 120rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info .pictrue image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border-radius: 6rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info .text {
|
|
|
+ width: 486rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info .text .name {
|
|
|
+ width: 306rpx;
|
|
|
+ color: #282828;
|
|
|
+ height: 74rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info .text .money {
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .item-info .text .money .return{
|
|
|
+ // color: var(--view-priceColor);
|
|
|
+ margin-top: 10rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .totalPrice {
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #282828;
|
|
|
+ text-align: right;
|
|
|
+ margin: 27rpx 0 0 30rpx;
|
|
|
+ padding: 0 30rpx 30rpx 0;
|
|
|
+ border-bottom: 1rpx solid #eee;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .totalPrice .money {
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: var(--view-priceColor);
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .bottom {
|
|
|
+ height: 107rpx;
|
|
|
+ padding: 0 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .bottom .bnt {
|
|
|
+ width: 176rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 60rpx;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ font-size: 27rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .bottom .bnt.cancelBnt {
|
|
|
+ border: 1rpx solid #ddd;
|
|
|
+ color: #aaa;
|
|
|
+ }
|
|
|
+
|
|
|
+ .my-order .list .item .bottom .bnt~.bnt {
|
|
|
+ margin-left: 17rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .noCart {
|
|
|
+ margin-top: 171rpx;
|
|
|
+ padding-top: 0.1rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .noCart .pictrue {
|
|
|
+ width: 414rpx;
|
|
|
+ height: 336rpx;
|
|
|
+ margin: 78rpx auto 56rpx auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .noCart .pictrue image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .line2 {
|
|
|
+ word-break: break-all;
|
|
|
+ }
|
|
|
+ .showstore {
|
|
|
+ border-bottom: none !important;
|
|
|
+ text-align: left !important;
|
|
|
+ padding-bottom: 10rpx !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ .iconfont {
|
|
|
+ width: 44rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ background: var(--view-minorColorT);
|
|
|
+ font-size: 20rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 44rpx;
|
|
|
+ color: var(--view-theme);
|
|
|
+ margin-left: 26rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|