<template>
|
<div class="main_app">
|
<Breadcrumb />
|
<QueryForm v-model="filters" :query-form-config="queryFormConfig" @handleQuery="getList(1)" @clear="clearQueryForm">
|
</QueryForm>
|
<div class="table_btns">
|
<el-button plain type="primary" @click="handleEx">导出</el-button>
|
<el-button plain type="danger" @click="openModal('zuofei')">作废</el-button>
|
<el-button plain @click="openModal('tiaozheng')">套餐调整</el-button>
|
</div>
|
<el-table v-loading="loading" :data="list" stripe border @selection-change="handleSelectionChange">
|
<el-table-column fixed="left" align="center" type="selection" :selectable="handleDisable" width="55" />
|
<el-table-column align="center" label="套餐票号" min-width="160" show-overflow-tooltip>
|
<template v-slot="scope">
|
<span class="primaryColor pointer" @click="comboDetail(scope.row)">{{
|
scope.row.code
|
}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="套餐类型" min-width="80">
|
<template v-slot="scope">
|
<span v-if="scope.row.type == '0'">期限卡</span>
|
<span v-if="scope.row.type == '1'">次卡</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="套餐名称" show-overflow-tooltip min-width="100" prop="name" />
|
<el-table-column align="center" label="用户信息" min-width="100" prop="openid" show-overflow-tooltip />
|
<el-table-column align="center" label="使用次数" min-width="80" prop="useTimes">
|
</el-table-column>
|
<el-table-column align="center" label="有效日期" min-width="200" prop="remainCount">
|
<template v-slot="scope">
|
<span>{{ scope.row.useStartDate }}至{{ scope.row.useEndDate }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="套餐状态" min-width="80">
|
<template v-slot="scope">
|
<span v-if="scope.row.status == '0'" class="text_success">正常</span>
|
<span v-if="scope.row.status == '1'" class="text_warning">作废</span>
|
<span v-if="scope.row.status == '2'" class="text-danger">待支付</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="操作" fixed="right" min-width="150">
|
<template v-slot="scope">
|
<template>
|
<el-button v-if="scope.row.status == '0'" type="text" @click="openCan(scope.row)">作废</el-button>
|
<span v-else>-</span>
|
</template>
|
</template>
|
</el-table-column>
|
</el-table>
|
<div class="table_btns">
|
<Pagination @size-change="handleSizeChange" @current-change="getList" :pagination="pagination" />
|
</div>
|
|
<el-dialog title="套餐调整" :visible.sync="isShowAdjust" width="500px">
|
<div class="adjust_modal">
|
<div style="margin-top: -30px; margin-bottom: 10px;">
|
<el-radio v-model="adjustData.flag" label="0">已选{{ selList.length }}条数据</el-radio>
|
</div>
|
<div style="margin-bottom: 16px;">
|
<el-radio v-model="adjustData.flag" label="1">选现有筛选条件下全部的{{ pagination.total }}条数据</el-radio>
|
</div>
|
<div class="df_ac mb5">
|
<span class="key">有效期增加：</span>
|
<el-input v-model="adjustData.addNum" oninput="value=value.replace(/[^\d]/g,'')" class="flex1 mr10" />
|
<span>天</span>
|
</div>
|
<div class="df_ac mb20">
|
<span class="key" />
|
<span class="text_warning">修改后套餐有效期增加以上天数</span>
|
</div>
|
<div class="df_ac mt20">
|
<span class="key">调整备注：</span>
|
<el-input v-model="ModelRemark" style="width: 356px" placeholder="请按要求输入备注说明，非必填" />
|
</div>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="isShowAdjust = false">取消</el-button>
|
<el-button type="primary" :loading="subLoading" @click="handleModelEnter">确定</el-button>
|
</span>
|
</el-dialog>
|
<el-dialog title="套餐作废" :visible.sync="isShowCan" width="500px">
|
<div class="adjust_modal" style="margin-top: -30px;">
|
<div class="red" style="font-size: 16px;">确定作废选中套餐吗？作废后，套餐不可使用</div>
|
<div class="df_ac mt10">
|
<el-input type="textarea" v-model="remarkCan" placeholder="请按要求输入备注说明，非必填" />
|
</div>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="isShowCan = false">取消</el-button>
|
<el-button type="primary" :loading="subLoading" @click="handleCan">确定</el-button>
|
</span>
|
</el-dialog>
|
|
<Refund v-if="isShowRefund" ref="RefundRef" @close="isShowRefund = false" @success="refundSuccess" />
|
<Detail v-if="isShowDetail" ref="detailRef" />
|
<Detail ref="DetailRef" />
|
</div>
|
</template>
|
|
<script>
|
import BasePageTemp from '@/components/base/BasePageTemp'
|
import Breadcrumb from '@/layouts/Breadcrumb'
|
import Detail from './components/SaleDetail.vue'
|
import { Message } from 'element-ui'
|
import {
|
comboSalePage,
|
comboSaleEx,
|
comboSaleCancel,
|
comboSaleAdjust,
|
} from '@/api/business/combo.js'
|
export default {
|
name: 'SalesRecord',
|
extends: BasePageTemp,
|
components: { Breadcrumb, Detail },
|
data() {
|
return {
|
exportLoading: false,
|
isShowDetail: false,
|
isShowRefund: false,
|
queryFormConfig: {
|
formItems: [{
|
filed: 'code',
|
type: 'input',
|
label: '套餐票号',
|
placeholder: '请输入套餐号',
|
clearable: true
|
}, {
|
filed: 'name',
|
type: 'input',
|
label: '套餐名称',
|
placeholder: '请输入套餐名称',
|
clearable: true
|
}, {
|
filed: 'openid',
|
type: 'input',
|
label: '用户信息',
|
clearable: true
|
}, {
|
filed: 'status',
|
type: 'select',
|
label: '状态',
|
placeholder: '请选择状态',
|
clearable: true,
|
options: [
|
{ value: '0', label: '正常' },
|
{ value: '1', label: '作废' },
|
// { value: '2', label: '待支付' }
|
]
|
}],
|
online: true
|
},
|
querys: {
|
id: '',
|
mealsName: '',
|
memberSearchValue: '',
|
status: '',
|
indate: []
|
},
|
|
saleRecordList: [],
|
saleRecordTotal: 0,
|
selList: [],
|
saleRecordLoading: false,
|
subLoading: false,
|
|
isShowCan: false,
|
ModalTitle: '',
|
ModalText: '',
|
ModelRemark: '',
|
remarkCan: '',
|
// ⬇️adjust调整相关
|
isShowAdjust: false,
|
isShowCan: false,
|
canList: [],
|
adjustData: {
|
flag: 0,
|
addNum: '',
|
addTime: ''
|
},
|
serviceChargePrice: '',
|
serviceChargeId: ''
|
}
|
},
|
created() {
|
// this.meta = this.$route.meta.buttons || []
|
this.getList(1)
|
},
|
methods: {
|
rowClickRefund(row) {
|
this.isShowRefund = true
|
this.$nextTick(() => {
|
this.$refs.RefundRef.getPrice(row)
|
this.$refs.RefundRef.isShow = true
|
})
|
},
|
refundSuccess() {
|
this.isShowRefund = false
|
this.getList()
|
},
|
handleEx() {
|
const { pagination, filters } = this
|
this.$dialog.exportConfirm('确认导出吗？')
|
.then(() => {
|
this.loading = true
|
comboSaleEx({
|
page: 1,
|
capacity: 1000000,
|
model: filters
|
})
|
.then(response => {
|
this.download(response)
|
})
|
.catch(e => {
|
this.$tip.apiFailed(e)
|
})
|
.finally(() => {
|
this.loading = false
|
})
|
})
|
.catch(() => { })
|
},
|
openCan(row) {
|
this.isShowCan = true
|
this.canList = [row]
|
},
|
handleDisable(row) {
|
// return row.status == 0
|
return true
|
},
|
// 查询表格数据
|
getList(page) {
|
const { pagination, filters } = this
|
this.loading = true
|
if (page) { pagination.page = page }
|
comboSalePage({
|
model: {
|
...filters
|
},
|
capacity: pagination.pageSize,
|
page: pagination.page,
|
}).then(res => {
|
this.loading = false
|
this.list = res.records || []
|
this.pagination.total = res.total || 0
|
}, () => {
|
this.loading = false
|
})
|
},
|
clearQueryForm() {
|
// eslint-disable-next-line no-unused-vars
|
this.filters = {}
|
this.getList(1)
|
},
|
// 打开modal 冻结 解冻 作废
|
openModal(type) {
|
const { selList } = this
|
this.ModelRemark = ''
|
this.adjustData.addNum = ''
|
this.adjustData.addTime = ''
|
switch (type) {
|
case 'zuofei':
|
this.ModalTitle = '套餐作废'
|
this.ModalText = '确定作废选中套餐吗？作废后，套餐不可使用'
|
break
|
case 'tiaozheng':
|
this.ModalTitle = '套餐调整'
|
break
|
default:
|
break
|
}
|
if (selList.length === 0 && type == 'zuofei') {
|
return Message.warning(`请先选择要${this.ModalTitle.slice(2)}的套餐`)
|
}
|
if (this.ModalTitle === '套餐调整') {
|
this.isShowAdjust = true
|
this.adjustData = {
|
flag: '0'
|
}
|
} else {
|
this.isShowCan = true
|
}
|
},
|
// 确定 冻结 解冻 作废
|
handleModelEnter() {
|
switch (this.ModalTitle) {
|
case '套餐作废':
|
this.cancellation()
|
break
|
case '套餐调整':
|
this.handleAdjust()
|
break
|
default:
|
break
|
}
|
},
|
// 调整
|
async handleAdjust() {
|
if (!this.adjustData.addNum && !this.adjustData.addTime) {
|
return Message.warning('请输入要调整的有效期天数或者余量次数')
|
}
|
const data = {
|
info: this.ModelRemark,
|
addDays: this.adjustData.addNum || 0,
|
choseIdList: this.adjustData.flag == 0 ? this.selList.map(i => i.id) : [],
|
...this.filters
|
}
|
|
this.subLoading = true
|
const res = await comboSaleAdjust({ ...data }).catch(() => {
|
this.subLoading = false
|
this.isShowCan = false
|
})
|
this.subLoading = false
|
this.isShowCan = false
|
if (res) {
|
Message.success('套餐调整成功')
|
this.getList()
|
this.isShowAdjust = false
|
}
|
},
|
// 作废
|
async cancellation() {
|
const data = {
|
handleRemake: this.remarkCan,
|
choseIdList: this.selList.map(i => i.id)
|
}
|
this.subLoading = true
|
const res = await comboSaleCancel({ ...data }).catch(() => {
|
this.subLoading = false
|
this.isShowCan = false
|
})
|
this.subLoading = false
|
this.isShowCan = false
|
if (res) {
|
Message.success('作废成功')
|
this.getList()
|
}
|
},
|
async handleCan() {
|
const data = {
|
handleRemake: this.remarkCan,
|
choseIdList: this.canList.map(i => i.id)
|
}
|
this.subLoading = true
|
const res = await comboSaleCancel({ ...data }).catch(() => {
|
this.subLoading = false
|
this.isShowCan = false
|
})
|
this.subLoading = false
|
this.isShowCan = false
|
if (res) {
|
Message.success('作废成功')
|
this.getList()
|
}
|
},
|
handleSelectionChange(val) {
|
this.selList = val
|
},
|
comboDetail(item) {
|
this.$nextTick(() => {
|
this.$refs.DetailRef.isShowModal = true
|
this.$refs.DetailRef.getDetail(item)
|
})
|
},
|
pageSizeChange(val) {
|
this.pagination.rows = val
|
this.getList(1)
|
}
|
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.adjust_modal {
|
.df_ac {
|
.key {
|
width: 92px;
|
text-align: right;
|
}
|
}
|
|
.el-dialog__body {}
|
|
.text_warning {
|
color: #e89e42;
|
}
|
}
|
</style>
|
