|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<!-- <div style="width: 100%"> -->
|
|
|
- <Drawer :closable="false" width="1150" class-name="order_box" v-model="modals" :styles="{ padding: 0 }">
|
|
|
+ <Drawer :closable="false" width="1240" class-name="order_box" v-model="modals" :styles="{ padding: 0 }">
|
|
|
<div class="acea-row user-row">
|
|
|
<div class="avatar mr15">
|
|
|
<img :src="psInfo.avatar">
|
|
|
@@ -166,6 +166,38 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
+ <!-- 预约订单 -->
|
|
|
+ <template slot-scope="{ row, index }" slot="store">
|
|
|
+ <span class="tabBox_pice">{{row.store.name}}</span>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row }" slot="info">
|
|
|
+ <div class="tabBox" v-for="(val, i) in row.info" :key="i">
|
|
|
+ <div class="tabRow">
|
|
|
+ <div class="tabBox_img" v-viewer>
|
|
|
+ <img v-lazy="val.slider_image" />
|
|
|
+ </div>
|
|
|
+ <div class="tabBox_content ">
|
|
|
+ <div class="tabBox_tit line1" :title="val.store_name">{{ val.store_name }}</div>
|
|
|
+ <div class="tabBox_pice">{{'￥' + val.pay_price}}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="tabBox_serve" v-if="val.project_user_id">
|
|
|
+ 服务卡<br />
|
|
|
+ ID：{{val.project_user_id}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{ row }" slot="status">
|
|
|
+ <div class="tabBox" v-for="(val, i) in row.info" :key="i">
|
|
|
+ <div class="tabBox_serve" v-if="val.paid>0">
|
|
|
+ <Tag color="blue" size="medium">已付款</Tag>
|
|
|
+ </div>
|
|
|
+ <div class="tabBox_serve" v-else>
|
|
|
+ <Tag color="gold" size="medium">待付款</Tag>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <!-- 预约订单END -->
|
|
|
</Table>
|
|
|
<div class="acea-row row-right page">
|
|
|
<Page :total="total" :current.sync="userFrom.page" show-elevator show-total
|
|
|
@@ -189,6 +221,9 @@
|
|
|
import {
|
|
|
formatDate
|
|
|
} from '@/utils/validate';
|
|
|
+ import {
|
|
|
+ ColumnConfig
|
|
|
+ } from 'vxe-table';
|
|
|
|
|
|
export default {
|
|
|
name: 'userDetails',
|
|
|
@@ -208,6 +243,14 @@
|
|
|
val: 'order',
|
|
|
label: '消费记录'
|
|
|
},
|
|
|
+ {
|
|
|
+ val: 'order',
|
|
|
+ label: '话费充值'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ val: 'subscribe_order',
|
|
|
+ label: '预约记录'
|
|
|
+ },
|
|
|
{
|
|
|
val: 'integral',
|
|
|
label: '积分明细'
|
|
|
@@ -264,7 +307,9 @@
|
|
|
activeName: 'info',
|
|
|
isEdit: false,
|
|
|
groupOptions: [],
|
|
|
- labelOptions: []
|
|
|
+ labelOptions: [],
|
|
|
+ // 初始化默认时间格式
|
|
|
+ dataType: 'yyyy-MM-dd hh:mm:ss',
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -463,49 +508,86 @@
|
|
|
},
|
|
|
// tab选项
|
|
|
changeType(name) {
|
|
|
- this.loading = true;
|
|
|
- this.userFrom.type = name;
|
|
|
- this.activeName = name;
|
|
|
+ const that = this;
|
|
|
+ that.loading = true;
|
|
|
+ that.userFrom.type = name;
|
|
|
+ that.activeName = name;
|
|
|
let data = {
|
|
|
- id: this.userId,
|
|
|
- datas: this.userFrom
|
|
|
+ id: that.userId,
|
|
|
+ datas: that.userFrom
|
|
|
}
|
|
|
infoApi(data).then(async res => {
|
|
|
+ console.log('tab');
|
|
|
if (res.status === 200) {
|
|
|
let data = res.data;
|
|
|
- if (this.userFrom.type == 'service_card') {
|
|
|
- const dataType ='yyyy-MM-dd hh:mm:ss';
|
|
|
- this.userLists = data.list.map((res) => {
|
|
|
- if (res.order) {
|
|
|
- const date = new Date(res.order.add_time * 1000);
|
|
|
- res.add_time = this.formatDate(date, dataType);
|
|
|
- }
|
|
|
- if (res.card) {
|
|
|
- const card = res.card;
|
|
|
- if (card.product && card.type == 2) {
|
|
|
- // 设定时间显示默认样式
|
|
|
- const card_end_time = new Date(card.card_end_time * 1000);
|
|
|
- const card_start_time = new Date(card.card_start_time * 1000);
|
|
|
- const end_time = new Date(card.end_time * 1000);
|
|
|
- const start_time = new Date(card.start_time * 1000);
|
|
|
- card.card_end_time_text = that.formatDate(card_end_time, dataType);
|
|
|
- card.card_start_time_text = that.formatDate(card_start_time, dataType);
|
|
|
- card.end_time_text = that.formatDate(end_time, dataType);
|
|
|
- card.start_time_text = that.formatDate(start_time, dataType);
|
|
|
+ switch (that.userFrom.type) {
|
|
|
+ case "service_card_record":
|
|
|
+ console.log(data, 'data');
|
|
|
+ that.userLists = data.list.map((res) => {
|
|
|
+ const date = new Date(res.add_time * 1000);
|
|
|
+ res.add_time = that.formatDate(date, that.dataType);
|
|
|
+ return res
|
|
|
+ });
|
|
|
+ console.log(that.userLists, 'this.userLists ')
|
|
|
+ break;
|
|
|
+ case "service_card":
|
|
|
+ that.userLists = data.list.map((res) => {
|
|
|
+ if (res.order) {
|
|
|
+ const date = new Date(res.order.add_time * 1000);
|
|
|
+ res.add_time = that.formatDate(date, that.dataType);
|
|
|
}
|
|
|
- }
|
|
|
- return res
|
|
|
- });
|
|
|
- } else if (this.userFrom.type == 'service_card_record') {
|
|
|
- console.log(data, 'data');
|
|
|
- this.userLists = data.list.map((res) => {
|
|
|
- const date = new Date(res.add_time * 1000);
|
|
|
- res.add_time = this.formatDate(date, dataType);
|
|
|
- return res
|
|
|
- });
|
|
|
- console.log(this.userLists, 'this.userLists ')
|
|
|
- } else {
|
|
|
- this.userLists = data.list;
|
|
|
+ if (res.card) {
|
|
|
+ const card = res.card;
|
|
|
+ if (card.product && card.type == 2) {
|
|
|
+ // 设定时间显示默认样式
|
|
|
+ const card_end_time = new Date(card.card_end_time * 1000);
|
|
|
+ const card_start_time = new Date(card.card_start_time *
|
|
|
+ 1000);
|
|
|
+ const end_time = new Date(card.end_time * 1000);
|
|
|
+ const start_time = new Date(card.start_time * 1000);
|
|
|
+ card.card_end_time_text = that.formatDate(card_end_time,
|
|
|
+ that.dataType);
|
|
|
+ card.card_start_time_text = that.formatDate(
|
|
|
+ card_start_time, that.dataType);
|
|
|
+ card.end_time_text = that.formatDate(end_time, that
|
|
|
+ .dataType);
|
|
|
+ card.start_time_text = that.formatDate(start_time, that
|
|
|
+ .dataType);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return res
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case "subscribe_order":
|
|
|
+ that.userLists = data.list.map((re) => {
|
|
|
+ re.reservation_time_text = that.formatDate(new Date(re
|
|
|
+ .reservation_time * 1000), that.dataType);
|
|
|
+ re.add_time_text = that.formatDate(new Date(re.add_time * 1000),
|
|
|
+ that.dataType);
|
|
|
+ // 设置支付金额
|
|
|
+ re.payMoney = 0;
|
|
|
+ re.info.forEach(item => {
|
|
|
+ re.payMoney += item.pay_price * 1;
|
|
|
+ if (item.pay_type == 'weixin') {
|
|
|
+ re.pay_type_text = "微信"
|
|
|
+ } else if (item.pay_type == 'yue') {
|
|
|
+ re.pay_type_text = "余额"
|
|
|
+ } else if (item.pay_type == 'offline') {
|
|
|
+ re.pay_type_text = "线下"
|
|
|
+ } else if (item.pay_type == 'alipay') {
|
|
|
+ re.pay_type_text = "支付宝"
|
|
|
+ } else if (item.pay_type == 'cash') {
|
|
|
+ re.pay_type_text = "现金"
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return re
|
|
|
+ })
|
|
|
+ console.log(that.userLists, 'that.userLists111')
|
|
|
+ break;
|
|
|
+
|
|
|
+ default:
|
|
|
+ this.userLists = data.list;
|
|
|
+ break;
|
|
|
}
|
|
|
this.total = data.count;
|
|
|
switch (this.userFrom.type) {
|
|
|
@@ -542,6 +624,49 @@
|
|
|
}
|
|
|
]
|
|
|
break;
|
|
|
+ case 'subscribe_order':
|
|
|
+ this.columns = [{
|
|
|
+ title: "订单号",
|
|
|
+ key: "order_id",
|
|
|
+ minWidth: 160,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "商品信息",
|
|
|
+ slot: "info",
|
|
|
+ minWidth: 250,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "实际支付",
|
|
|
+ key: "payMoney",
|
|
|
+ minWidth: 70,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "支付方式",
|
|
|
+ key: "pay_type_text",
|
|
|
+ minWidth: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "支付状态",
|
|
|
+ slot: "status",
|
|
|
+ minWidth: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "预约时间",
|
|
|
+ key: "reservation_time_text",
|
|
|
+ minWidth: 130,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "预约门店",
|
|
|
+ slot: "store",
|
|
|
+ minWidth: 110,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "下单时间",
|
|
|
+ key: "add_time_text",
|
|
|
+ minWidth: 130,
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ break;
|
|
|
case 'integral':
|
|
|
this.columns = [{
|
|
|
title: '来源/用途',
|
|
|
@@ -817,6 +942,7 @@
|
|
|
this.$Message.error(res.msg);
|
|
|
}
|
|
|
}).catch(res => {
|
|
|
+ console.log("err", res);
|
|
|
this.loading = false;
|
|
|
this.$Message.error(res.msg);
|
|
|
})
|
|
|
@@ -826,11 +952,59 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
- .flex{
|
|
|
+ .tabBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .tabRow {
|
|
|
+ width: 0;
|
|
|
+ flex-grow: 1;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox_serve {
|
|
|
+ flex-shrink: 0;
|
|
|
+ padding-left: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox_content {
|
|
|
+ width: 0;
|
|
|
+ flex-grow: 1;
|
|
|
+ padding-left: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox_pice {
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox_img {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ flex-shrink: 0;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabBox_tit {
|
|
|
+ flex-grow: 1;
|
|
|
+ font-size: 12px !important;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .flex {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
}
|
|
|
+
|
|
|
/deep/.ivu-modal-body {
|
|
|
padding: 0;
|
|
|
}
|
