302 lines
10 KiB
Vue
302 lines
10 KiB
Vue
<template>
|
|
<div>
|
|
<el-tabs v-model="subCardActive" @tab-click="handleClick">
|
|
<el-tab-pane label="子卡管理" name="subCardManage">
|
|
<div style="display: flex;justify-content: space-between;margin: 10px 0">
|
|
<div style="font-size: 16px">会员信息：{{form.mobile}}</div>
|
|
<el-button type="primary" :disabled="cardValueChildList.length>=2" @click="handleAdd1">新增子卡</el-button>
|
|
</div>
|
|
<div>
|
|
<el-table ref="tables" v-loading="loading" :data="cardValueChildList">
|
|
<el-table-column label="子卡ID" prop="id" align="center" width="60"/>
|
|
<el-table-column label="子卡手机号" prop="cardChildPhones" align="center"/>
|
|
<el-table-column label="创建时间" align="center" width="160" prop="createTime">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center" fixed='right'>
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
size="mini"
|
|
type="text"
|
|
icon="el-icon-edit"
|
|
@click="handleUpdate1(scope.row)"
|
|
>修改</el-button>
|
|
<el-button
|
|
size="mini"
|
|
type="text"
|
|
icon="el-icon-document"
|
|
@click="handleOrder(scope.row)"
|
|
>交易记录</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<!-- <pagination-->
|
|
<!-- :total="total"-->
|
|
<!-- :page.sync="queryParams.page"-->
|
|
<!-- :limit.sync="queryParams.pageSize"-->
|
|
<!-- @pagination="getList"-->
|
|
<!-- />-->
|
|
</div>
|
|
<el-alert
|
|
title="关于子卡"
|
|
type="info"
|
|
style="margin-top: 20px"
|
|
:closable="false"
|
|
description="子卡为会员子母卡功能,子卡共享母卡的储值额度及信息,子卡为实体会员卡信息,消费需在小程序中才可进行使用">
|
|
</el-alert>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="子卡消费记录" name="consumption">
|
|
<div style="display: flex;justify-content: space-between;margin: 10px 0">
|
|
<div style="font-size: 16px">
|
|
<el-form :model="subCardList" ref="queryForm" size="small" :inline="true" label-width="85px">
|
|
<el-form-item label="子卡手机号" prop="cardChildPhones">
|
|
<el-input
|
|
v-model="subCardList.cardChildPhones"
|
|
placeholder="请输入子卡手机号"
|
|
clearable
|
|
style="width: 240px;"
|
|
@keyup.enter.native="handleQuery"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="支付状态" prop="status">
|
|
<el-select
|
|
v-model="subCardList.status"
|
|
placeholder="全部"
|
|
clearable
|
|
style="width: 240px"
|
|
>
|
|
<el-option
|
|
v-for="dict in dict.type.pay_status"
|
|
:key="dict.value"
|
|
:label="dict.label"
|
|
:value="dict.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<el-table ref="tables" v-loading="loading" :data="orderList">
|
|
<el-table-column type="expand">
|
|
<template slot-scope="props">
|
|
<el-form label-position="left" class="demo-table-expand" style="margin-left: 20px">
|
|
<el-form-item label="备注信息">
|
|
<span>{{ props.row.remark }}</span>
|
|
</el-form-item>
|
|
</el-form>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="ID" prop="id" align="center" width="60"/>
|
|
<el-table-column label="子卡手机号" prop="cardChildPhones" align="center" />
|
|
<el-table-column label="订单号" prop="orderNo" align="center" />
|
|
<el-table-column label="订单金额" prop="amount" align="center" />
|
|
<el-table-column label="消费金额" prop="payAmount" align="center" />
|
|
<el-table-column label="支付状态" prop="status" align="center" >
|
|
<template slot-scope="scope">
|
|
<dict-tag :options="dict.type.pay_status" :value="scope.row.status"/>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="支付时间" prop="payTime" align="center" >
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.payTime ? parseTime(scope.row.payTime) :"--" }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<pagination
|
|
:total="total"
|
|
:page.sync="subCardList.page"
|
|
:limit.sync="subCardList.pageSize"
|
|
@pagination="getOrderList"
|
|
/>
|
|
</div>
|
|
<el-alert
|
|
title="关于子卡"
|
|
type="info"
|
|
style="margin-top: 20px"
|
|
:closable="false"
|
|
description="当前会员的所有子卡消费记录信息,可根据对应子卡卡号进行检索查询">
|
|
</el-alert>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
|
|
<el-dialog :title="title" :visible.sync="openSubCard1" width="30%">
|
|
<el-form ref="form1" :model="form1" :rules="rules" label-width="120px">
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="主卡信息" prop="userId" style="width: 420px">
|
|
<el-select
|
|
v-model="form1.userId"
|
|
placeholder="全部"
|
|
clearable
|
|
disabled
|
|
style="width: 100%"
|
|
>
|
|
<el-option
|
|
:label="form.mobile"
|
|
:value="form.id"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="子卡手机号" prop="cardChildPhones" style="width: 420px">
|
|
<el-input
|
|
v-model.number="form1.cardChildPhones"
|
|
placeholder="请输入子卡手机号"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="openSubCard1 = false">取 消</el-button>
|
|
<el-button type="primary" @click="submitSubCard">确 定</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {getUser} from "@/api/cashier/user/user";
|
|
import {
|
|
addCardValueChild,
|
|
cardValueChildInfo, editCardValueChild,
|
|
listCardValueChild,
|
|
listCardValueChildOrder
|
|
} from "@/api/cashier/user/cardvaluechild";
|
|
|
|
export default {
|
|
props:["pUserId"],
|
|
dicts:['pay_status'],
|
|
data(){
|
|
return{
|
|
subCardActive:'subCardManage',
|
|
form:{},
|
|
form1:{
|
|
userId:this.pUserId
|
|
},
|
|
loading:false,
|
|
total:0,
|
|
queryParams:{
|
|
page:1,
|
|
pageSize:10,
|
|
},
|
|
cardValueChildList:[],
|
|
userId:"",
|
|
subCardList: {
|
|
page:1,
|
|
pageSize:10,
|
|
cardChildPhones:'',
|
|
status:''
|
|
},
|
|
orderList:[],
|
|
title:"",
|
|
openSubCard1:false,
|
|
rules:{
|
|
userId:[{ required: true, message: '请选择主卡信息', trigger: 'change' }],
|
|
cardChildPhones:[{required: true, message: "请输入子卡手机号", trigger: "blur"}],
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
// this.userId = this.pUserId;
|
|
this.userId = this.$route.query.id;
|
|
|
|
this.getUser()
|
|
this.getCardList()
|
|
this.getOrderList()
|
|
},
|
|
methods:{
|
|
// 获取当前会员信息
|
|
getUser(){
|
|
getUser(this.userId).then(response => {
|
|
this.form = response.data
|
|
})
|
|
},
|
|
// 查询当前用户的子卡信息
|
|
getCardList(){
|
|
listCardValueChild(this.userId).then(res => {
|
|
this.cardValueChildList = res.data
|
|
})
|
|
},
|
|
// 查询子卡的交易信息
|
|
getOrderList(){
|
|
listCardValueChildOrder(this.subCardList).then(res => {
|
|
this.orderList = res.data.records
|
|
this.total = res.data.total
|
|
})
|
|
},
|
|
handleAdd1(){
|
|
// this.title = "添加子卡信息"
|
|
// this.openSubCard1 = true
|
|
this.$emit("handleAdd")
|
|
},
|
|
handleUpdate1(data){
|
|
// cardValueChildInfo(data.id).then(res => {
|
|
// this.form1 = res.data
|
|
// this.title = "修改子卡信息"
|
|
// this.openSubCard1 = true
|
|
// })
|
|
this.$emit("handleUpdate")
|
|
},
|
|
// 添加或修改子卡信息
|
|
submitSubCard(){
|
|
this.$refs["form1"].validate(valid => {
|
|
if (valid) {
|
|
if (this.form1.id) {
|
|
editCardValueChild(this.form1).then(res => {
|
|
if (res.data==1){
|
|
this.$modal.msgSuccess("修改成功!")
|
|
this.openSubCard1 = false
|
|
this.getCardList()
|
|
}else {
|
|
this.$modal.msgError("手机号已存在，请重新添加")
|
|
}
|
|
})
|
|
}else {
|
|
addCardValueChild(this.form1).then(res => {
|
|
if (res.data.success=="添加成功！"){
|
|
this.$modal.msgSuccess("添加成功!")
|
|
this.openSubCard1 = false
|
|
this.getCardList()
|
|
}else {
|
|
this.$modal.msgError(res.data.error)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
})
|
|
},
|
|
handleOrder(data){
|
|
this.subCardList.cardChildPhones = data.cardChildPhones
|
|
this.subCardActive = "consumption"
|
|
this.subCardList.page = 1;
|
|
this.getOrderList()
|
|
},
|
|
handleQuery(){
|
|
this.subCardList.page = 1;
|
|
this.getOrderList()
|
|
},
|
|
handleClick(tab, event) {
|
|
// console.log(tab, event);
|
|
// this.refStaff()
|
|
// this.realyPayBills = 0
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
</style>
|