This commit is contained in:
user 2023-11-08 14:58:40 +08:00
parent 4d28a69c94
commit c1b7ef61b5
6 changed files with 303 additions and 454 deletions

View File

@ -3,7 +3,7 @@ import request from '@/utils/request'
// 查询优惠券列表
export function listFavorable(query) {
return request({
url: '/business/marketingActivity/favorable/list',
url: 'business/marketingActivity/cardFavorable',
method: 'get',
params: query
})
@ -12,7 +12,7 @@ export function listFavorable(query) {
// 查询优惠券详细
export function getFavorable(id) {
return request({
url: '/business/marketingActivity/favorable/' + id,
url: '/business/marketingActivity/cardFavorable/' + id,
method: 'get'
})
}
@ -20,7 +20,7 @@ export function getFavorable(id) {
// 新增优惠券
export function addFavorable(data) {
return request({
url: '/business/marketingActivity/favorable',
url: '/business/marketingActivity/cardFavorable',
method: 'post',
data: data
})
@ -29,7 +29,7 @@ export function addFavorable(data) {
// 修改优惠券
export function updateFavorable(data) {
return request({
url: '/business/marketingActivity/favorable',
url: '/business/marketingActivity/cardFavorable',
method: 'put',
data: data
})
@ -38,7 +38,7 @@ export function updateFavorable(data) {
// 删除优惠券
export function delFavorable(id) {
return request({
url: '/business/marketingActivity/favorable/' + id,
url: '/business/marketingActivity/cardFavorable/' + id,
method: 'delete'
})
}

View File

@ -302,12 +302,9 @@
this.creatQrCode(url)
this.loadingdialog = false
}, 1000);
},
creatQrCode(url) {
document.getElementById("qrCode").innerHTML = ""
new QRCode(this.$refs.qrCodeUrl, {
text: url, //
width: 300,
@ -316,10 +313,7 @@
colorLight: '#fff',
correctLevel: QRCode.CorrectLevel.H
})
},
/** 查询兑换券列表 */
getList() {
this.loading = true

View File

@ -1,164 +1,39 @@
<template>
<!-- 优惠券页面-->
<div class="app-container">
<el-card style="margin-bottom: 20px">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="所属连锁店id" prop="chainStorId">
<el-input
v-model="queryParams.chainStorId"
placeholder="请输入所属连锁店id"
clearable
@keyup.enter.native="handleQuery"
/>
<el-form-item label="" prop="name">
<el-input v-model="queryParams.name" placeholder="优惠券名称"></el-input>
</el-form-item>
<el-form-item label="所属店铺id" prop="storeId">
<el-input
v-model="queryParams.storeId"
placeholder="请输入所属店铺id"
clearable
@keyup.enter.native="handleQuery"
/>
<el-form-item label="" prop="region">
<el-select v-model="queryParams.isonline" placeholder="在线/下线">
<el-option label="在线" value="0"></el-option>
<el-option label="下线" value="1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否在线 0在线 1 下线" prop="isonline">
<el-input
v-model="queryParams.isonline"
placeholder="请输入是否在线 0在线 1 下线"
clearable
@keyup.enter.native="handleQuery"
/>
<el-form-item label="" prop="region">
<el-select v-model="queryParams.isonline" placeholder="优惠类型">
<el-option label="满减券" value="0"></el-option>
<el-option label="折扣券" value="1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="优惠券名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入优惠券名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="满减金额" prop="fullDeduction">
<el-input
v-model="queryParams.fullDeduction"
placeholder="请输入满减金额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="优惠金额" prop="discountAmount">
<el-input
v-model="queryParams.discountAmount"
placeholder="请输入优惠金额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="满足金额" prop="satisfiedAmount">
<el-input
v-model="queryParams.satisfiedAmount"
placeholder="请输入满足金额"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="优惠折扣" prop="specialDiscount">
<el-input
v-model="queryParams.specialDiscount"
placeholder="请输入优惠折扣"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="折扣抵消" prop="discountOffset">
<el-input
v-model="queryParams.discountOffset"
placeholder="请输入折扣抵消"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="有效期" prop="validity">
<el-input
v-model="queryParams.validity"
placeholder="请输入有效期"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="生效日期" prop="effectiveDate">
<el-input
v-model="queryParams.effectiveDate"
placeholder="请输入生效日期"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="生效时间" prop="effectiveTime">
<el-input
v-model="queryParams.effectiveTime"
placeholder="请输入生效时间"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="可用时段" prop="availablePeriod">
<el-input
v-model="queryParams.availablePeriod"
placeholder="请输入可用时段"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="可用日期" prop="checkTime">
<el-input
v-model="queryParams.checkTime"
placeholder="请输入可用日期"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="排除日期" prop="checkOutTime">
<el-date-picker clearable
v-model="queryParams.checkOutTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择排除日期">
</el-date-picker>
</el-form-item>
<el-form-item label="互斥功能 0满减活动 1储值卡付款" prop="exclusiveFunction">
<el-input
v-model="queryParams.exclusiveFunction"
placeholder="请输入互斥功能 0满减活动 1储值卡付款"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="领取规则 0每人限领一张 1每人每日限领一张" prop="claimRule">
<el-input
v-model="queryParams.claimRule"
placeholder="请输入领取规则 0每人限领一张 1每人每日限领一张"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="发放数量" prop="count">
<el-input
v-model="queryParams.count"
placeholder="请输入发放数量"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="二维码链接" prop="qrCodeLink">
<el-input
v-model="queryParams.qrCodeLink"
placeholder="请输入二维码链接"
clearable
@keyup.enter.native="handleQuery"
/>
<el-form-item label="" prop="region">
<el-select v-model="queryParams.isonline" placeholder="卡券类型">
<el-option label="油品券" value="0"></el-option>
<el-option label="商品券" value="1"></el-option>
<el-option label="通用券" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card style="margin-bottom: 20px">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
@ -167,75 +42,64 @@
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['business/marketingActivity:favorable:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['business/marketingActivity:favorable:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['business/marketingActivity:favorable:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['business/marketingActivity:favorable:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="favorableList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键id" align="center" prop="id" />
<el-table-column label="所属连锁店id" align="center" prop="chainStorId" />
<el-table-column label="所属店铺id" align="center" prop="storeId" />
<el-table-column label="是否在线 0在线 1 下线" align="center" prop="isonline" />
<!-- <el-table-column label="是否在线 0在线 1 下线" align="center" prop="isonline" />-->
<el-table-column label="优惠券名称" align="center" prop="name" />
<el-table-column label="卡券类型 0油品券 1商品券 2通用券" align="center" prop="type" />
<el-table-column label="优惠类型 0满减券 1折扣券" align="center" prop="discountType" />
<el-table-column label="可用油品 092# 1: 95# 298# 30# 4-10# 5 LNG 6CNG 7京92# 8京95# 9京0#" align="center" prop="oilType" />
<el-table-column label="满减金额" align="center" prop="fullDeduction" />
<el-table-column label="优惠金额" align="center" prop="discountAmount" />
<el-table-column label="满足金额" align="center" prop="satisfiedAmount" />
<el-table-column label="优惠折扣" align="center" prop="specialDiscount" />
<el-table-column label="折扣抵消" align="center" prop="discountOffset" />
<el-table-column label="有效期" align="center" prop="validity" />
<el-table-column label="生效日期" align="center" prop="effectiveDate" />
<el-table-column label="生效时间" align="center" prop="effectiveTime" />
<el-table-column label="可用时段" align="center" prop="availablePeriod" />
<el-table-column label="可用周期类型 day每天可用 week周可用 month月可用" align="center" prop="checkDateType" />
<el-table-column label="可用日期" align="center" prop="checkTime" />
<el-table-column label="排除日期" align="center" prop="checkOutTime" width="180">
<el-table-column label="卡券类型 " align="center" prop="type" >
<template slot-scope="scope">
<el-tag v-if="scope.row.type == 0">油品券</el-tag>
<el-tag type="success" v-if="scope.row.type == 1">商品券</el-tag>
<el-tag type="warning" v-if="scope.row.type == 2">通用券</el-tag>
</template>
</el-table-column>
<el-table-column label="优惠类型" align="center" prop="discountType" >
<template slot-scope="scope">
<span>{{ parseTime(scope.row.checkOutTime, '{y}-{m}-{d}') }}</span>
<el-tag effect="dark" type="success" v-if="scope.row.discountType == 0">满减券</el-tag>
<el-tag effect="dark" v-if="scope.row.discountType == 1">折扣券</el-tag>
</template>
</el-table-column>
<el-table-column label="互斥功能 0满减活动 1储值卡付款" align="center" prop="exclusiveFunction" />
<el-table-column label="领取规则 0每人限领一张 1每人每日限领一张" align="center" prop="claimRule" />
<el-table-column label="满减金额" align="center" prop="fullDeduction" >
<template slot-scope="scope">
<el-tag effect="plain" type="success" >{{scope.row.fullDeduction}}</el-tag>
</template>
</el-table-column>
<el-table-column label="优惠金额" align="center" prop="discountAmount" >
<template slot-scope="scope">
<el-tag effect="plain" >{{scope.row.discountAmount}}</el-tag>
</template>
</el-table-column>
<el-table-column label="有效期" align="center" prop="validity" >
<template slot-scope="scope">
<span >{{scope.row.validity}}</span>
</template>
</el-table-column>
<el-table-column label="生效日期" align="center" prop="effectiveDate" />
<el-table-column label="生效时间" align="center" prop="effectiveTime" />
<el-table-column label="发放数量" align="center" prop="count" />
<el-table-column label="二维码链接" align="center" prop="qrCodeLink" />
<el-table-column label="优惠券状态 0启用 1 禁用" align="center" prop="status" />
<el-table-column label="满足金额" align="center" prop="satisfiedAmount" />
<el-table-column label="二维码链接" align="center" prop="qrCodeLink" >
<template slot-scope="scope">
<!-- <span >{{scope.row.qrCodeLink}}</span>-->
<div style="cursor: pointer" @click="qrcodelook(scope.row.qrCodeLink)">
<i class="el-icon-picture" ></i>
</div>
</template>
</el-table-column>
<el-table-column label="优惠券状态" align="center" prop="status" >
<template slot-scope="scope">
<div v-if="scope.row.status == 0">启用</div>
<div v-if="scope.row.status == 1">禁用</div>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
@ -243,15 +107,9 @@
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['business/marketingActivity:favorable:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['business/marketingActivity:favorable:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
@ -263,52 +121,93 @@
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
<!-- 添加或修改优惠券对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="所属连锁店id" prop="chainStorId">
<el-input v-model="form.chainStorId" placeholder="请输入所属连锁店id" />
</el-form-item>
<el-form-item label="所属店铺id" prop="storeId">
<el-input v-model="form.storeId" placeholder="请输入所属店铺id" />
</el-form-item>
<el-form-item label="是否在线 0在线 1 下线" prop="isonline">
<el-input v-model="form.isonline" placeholder="请输入是否在线 0在线 1 下线" />
</el-form-item>
<el-dialog :title="title" :visible.sync="open" width="50%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<!-- <el-form-item label="是否在线 0在线 1 下线" prop="isonline">-->
<!-- <el-input v-model="form.isonline" placeholder="请输入是否在线 0在线 1 下线" />-->
<!-- </el-form-item>-->
<el-form-item label="优惠券名称" prop="name">
<el-input v-model="form.name" placeholder="请输入优惠券名称" />
</el-form-item>
<el-form-item label="满减金额" prop="fullDeduction">
<el-input v-model="form.fullDeduction" placeholder="请输入满减金额" />
<el-form-item label="卡券类型" prop="type">
<el-radio-group v-model="form.type">
<el-radio label="0">油品券</el-radio>
<el-radio label="1">商品券</el-radio>
<el-radio label="2">通用券</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="优惠类型" prop="discountType">
<el-radio-group v-model="form.discountType">
<el-radio label="0">满减券</el-radio>
<el-radio label="1">折扣券</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="可用油品" prop="satisfiedAmount">
<el-checkbox-group v-model="form.oilType">
<el-checkbox v-for="city in oillist" :label="city" :key="city">{{city}}</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="满足金额" prop="satisfiedAmount">
<el-input v-model="form.satisfiedAmount" placeholder="请输入满足金额" />
</el-form-item>
<el-form-item label="优惠金额" prop="discountAmount">
<el-input v-model="form.discountAmount" placeholder="请输入优惠金额" />
</el-form-item>
<el-form-item label="满足金额" prop="satisfiedAmount">
<el-input v-model="form.satisfiedAmount" placeholder="请输入满足金额" />
</el-form-item>
<el-form-item label="优惠折扣" prop="specialDiscount">
<el-input v-model="form.specialDiscount" placeholder="请输入优惠折扣" />
</el-form-item>
<el-form-item label="折扣抵消" prop="discountOffset">
<el-input v-model="form.discountOffset" placeholder="请输入折扣抵消" />
</el-form-item>
<el-form-item label="有效期" prop="validity">
<el-input v-model="form.validity" placeholder="请输入有效期" />
</el-form-item>
<el-form-item label="生效日期" prop="effectiveDate">
<el-input v-model="form.effectiveDate" placeholder="请输入生效日期" />
<el-form-item label="生效日期" prop="timeType">
<el-radio-group v-model="form.timeType">
<el-radio label="0">领券后立即生效有效期 <el-input placeholder="有效天数" style="width: 200px" v-model="form.validityZero"><template slot="append"></template></el-input></el-radio>
<el-radio label="1">固定有效周期固定开始日期 <el-date-picker
v-model="form.effectiveDate"
type="date"
placeholder="选择日期">
</el-date-picker>
有效期
<el-input placeholder="有效天数" style="width: 200px" v-model="form.validityOne"><template slot="append"></template></el-input>
</el-radio>
<el-radio label="2">领券后第 <el-input style="width: 200px" placeholder="1" v-model="form.validityDay"><template slot="append">天生效</template></el-input> <el-input placeholder="" style="width: 200px" v-model="form.validityTwo"><template slot="append"></template></el-input></el-radio>
</el-radio-group>
</el-form-item>
<!-- <el-form-item label="满减金额" prop="fullDeduction">-->
<!-- <el-input v-model="form.fullDeduction" placeholder="请输入满减金额" />-->
<!-- </el-form-item>-->
<el-form-item label="生效时间" prop="effectiveTime">
<el-input v-model="form.effectiveTime" placeholder="请输入生效时间" />
<el-radio-group v-model="form.effectiveTime">
<el-radio label="0">领取时间</el-radio>
<el-radio label="1">指定时间</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="生效时间" v-if="form.effectiveTime == 1" prop="effectiveTime">
<el-time-picker
arrow-control
v-model="form.effectiveDateStart"
placeholder="任意时间点">
</el-time-picker>
</el-form-item>
<el-form-item label="可用时段" prop="availablePeriod">
<el-input v-model="form.availablePeriod" placeholder="请输入可用时段" />
<el-checkbox-group v-model="form.availablePeriod">
<el-checkbox-button v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox-button>
<!-- <el-checkbox-button v-for="(item,index) in cities" :key="index" :label="index">{{item}}</el-checkbox-button>-->
</el-checkbox-group>
</el-form-item>
<el-form-item label="可用日期" prop="checkTime">
<el-input v-model="form.checkTime" placeholder="请输入可用日期" />
<el-form-item label="可用周期" prop="checkTime">
<el-radio-group v-model="form.checkTime">
<el-radio label="每天都可以使用"></el-radio>
<el-radio label="每周都可以使用"></el-radio>
<el-radio label="每月都可以使用"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排除日期" prop="checkOutTime">
<el-date-picker clearable
v-model="form.checkOutTime"
@ -317,34 +216,65 @@
placeholder="请选择排除日期">
</el-date-picker>
</el-form-item>
<el-form-item label="互斥功能 0满减活动 1储值卡付款" prop="exclusiveFunction">
<el-input v-model="form.exclusiveFunction" placeholder="请输入互斥功能 0满减活动 1储值卡付款" />
<el-form-item label="互斥功能" prop="exclusiveFunction">
<el-radio-group v-model="form.exclusiveFunction">
<el-radio label="0">满减活动</el-radio>
<el-radio label="1">储值卡付款</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="领取规则 0每人限领一张 1每人每日限领一张" prop="claimRule">
<el-input v-model="form.claimRule" placeholder="请输入领取规则 0每人限领一张 1每人每日限领一张" />
<el-form-item label="领取规则 " prop="claimRule">
<el-radio-group v-model="form.claimRule">
<el-radio label="0">每人限领一张</el-radio>
<el-radio label="1">每人每日限领一张</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="发放数量" prop="count">
<el-input v-model="form.count" placeholder="请输入发放数量" />
</el-form-item>
<el-form-item label="二维码链接" prop="qrCodeLink">
<el-input v-model="form.qrCodeLink" placeholder="请输入二维码链接" />
<el-form-item label="状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio label="0">启用</el-radio>
<el-radio label="1">禁用</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<el-dialog
title="二维码"
v-loading="loadingdialog"
:visible.sync="centerDialogVisible"
width="350px"
center>
<div style="display: flex;align-items: center">
<div class="qr-code" id="qrCode" ref="qrCodeUrl"></div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="centerDialogVisible = false"> </el-button>
<el-button type="primary" @click="centerDialogVisible = false"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { listFavorable, getFavorable, delFavorable, addFavorable, updateFavorable } from "@/api/business/marketingActivity/favorable";
import QRCode from 'qrcodejs2'
import { listFavorable, getFavorable, delFavorable, addFavorable, updateFavorable } from "@/api/EventMarketing/cardFavorable";
export default {
name: "Favorable",
data() {
return {
cities: ['1', '2', '3', '4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24'],
oillist:['92#','95#','98#','0#','-10#','LNG','CNG','京92#','京95#','京0#',],
checkboxGroup1: ['1'],
centerDialogVisible:false,
loadingdialog:true,
//
loading: true,
//
@ -393,7 +323,7 @@ export default {
status: null,
},
//
form: {},
form: {availablePeriod:[]},
//
rules: {
}
@ -403,12 +333,31 @@ export default {
this.getList();
},
methods: {
qrcodelook(url) {
this.loadingdialog = true
this.centerDialogVisible = true
setTimeout(() => {
this.creatQrCode(url)
this.loadingdialog = false
}, 1000);
},
creatQrCode(url) {
document.getElementById("qrCode").innerHTML = ""
new QRCode(this.$refs.qrCodeUrl, {
text: url, //
width: 300,
height: 300,
colorDark: '#000',
colorLight: '#fff',
correctLevel: QRCode.CorrectLevel.H
})
},
/** 查询优惠券列表 */
getList() {
this.loading = true;
listFavorable(this.queryParams).then(response => {
this.favorableList = response.rows;
this.total = response.total;
this.favorableList = response.data.records;
this.total = response.data.total;
this.loading = false;
});
},
@ -427,7 +376,7 @@ export default {
name: null,
type: null,
discountType: null,
oilType: null,
oilType: [],
fullDeduction: null,
discountAmount: null,
satisfiedAmount: null,
@ -436,7 +385,7 @@ export default {
validity: null,
effectiveDate: null,
effectiveTime: null,
availablePeriod: null,
availablePeriod: [],
checkDateType: null,
checkTime: null,
checkOutTime: null,
@ -477,12 +426,10 @@ export default {
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids
getFavorable(id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改优惠券";
});
this.form = row;
this.open = true;
this.title = "修改优惠券";
},
/** 提交按钮 */
submitForm() {

View File

@ -236,7 +236,7 @@
</template>
<script>
import { listRecord, getRecord, delRecord, addRecord, updateRecord } from "@/api/business/marketingActivity/record";
// import { listRecord, getRecord, delRecord, addRecord, updateRecord } from "@/api/business/marketingActivity/record";
export default {
name: "Record",

View File

@ -1,192 +1,25 @@
<template>
<div class="app-container">
<el-card style="margin-bottom: 20px">
<el-form :model="queryParams" :rules="rules" ref="ruleForm" :inline="true" label-width="70px" class="demo-ruleForm">
<el-form-item label="" prop="region">
<el-select v-model="queryParams.name" placeholder="油品券/商品券">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="" prop="region">
<el-select v-model="queryParams.name" placeholder="优惠券/折扣券">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="" prop="name">
<el-input v-model="queryParams.name" placeholder="优惠券名称"></el-input>
</el-form-item>
<el-form-item label="" prop="region">
<el-select v-model="queryParams.name" placeholder="正常/禁用">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-button type="primary" icon="el-icon-search">搜索</el-button>
</el-form>
</el-card>
<el-card style="margin-bottom: 20px">
<div class="table-top">
<el-radio-group v-model="value">
<el-radio-button label="1">可用</el-radio-button>
<el-radio-button label="2">已下线</el-radio-button>
</el-radio-group>
<el-button type="primary" icon="el-icon-plus">新增优惠券</el-button>
</div>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column
prop="date"
label="优惠券名称"
width="150">
</el-table-column>
<el-table-column
prop="date"
label="卡券类型"
width="100">
<el-tag effect="dark">油品券</el-tag>
<!-- <template slot-scope="scope">-->
<!-- -->
<!-- </template>-->
</el-table-column>
<el-table-column
prop="date"
label="优惠类型"
width="100">
<el-tag>优惠券</el-tag>
</el-table-column>
<el-table-column label="券详情">
<el-table-column
prop="name"
label="满减金额"
width="120">
<el-tag effect="plain">290</el-tag>
</el-table-column>
<el-table-column
prop="name"
label="优惠券金额"
width="120">
<el-tag type="success" effect="plain">50</el-tag>
</el-table-column>
<el-table-column
prop="date"
label="有效期(天)"
width="120">
</el-table-column>
<el-table-column label="指定生效时间日期规则">
<el-table-column
prop="name"
label="生效日期"
width="120">
</el-table-column>
<el-table-column
prop="name"
label="生效时间"
width="120">
</el-table-column>
</el-table-column>
<el-table-column
prop="name"
label="发放数量"
width="120">
</el-table-column>
</el-table-column>
<el-table-column
prop="date"
label="二维码"
width="100">
<i class="el-icon-picture"></i>
</el-table-column>
<el-table-column
prop="date"
label="状态"
width="100">
</el-table-column>
<el-table-column
prop="date"
label="创建时间"
width="170">
</el-table-column>
<el-table-column
prop="date"
label="操作"
width="180">
</el-table-column>
</el-table>
</el-card>
<cardFavorable></cardFavorable>
</div>
</template>
<script>
import cardFavorable from '../cardFavorable/index'
export default {
name: 'index',
data(){
return{
tableData: [{
date: '2016-05-03',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-02',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-04',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-01',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-08',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-06',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}, {
date: '2016-05-07',
name: '王小虎',
province: '上海',
city: '普陀区',
address: '上海市普陀区金沙江路 1518 弄',
zip: 200333
}],
queryParams:{
name:""
},
value:'1'
}
},
components:{
cardFavorable
},
methods:{
}

View File

@ -4,6 +4,7 @@
<div style="display: flex;align-items: center">
<div style="width: 5%;margin-right: 10px">卡券核销:</div>
<div style="width: 80%;">
<!-- 17615834396-->
<el-input v-model="queryParams.mobile" placeholder="请输入会员手机号码"></el-input>
</div>
<div style="width: 10%;margin-left: 20px">
@ -11,7 +12,21 @@
</div>
</div>
<el-empty :image-size="200"></el-empty>
<div class="wrap-box">
<div class="coupon-box" v-for="(item,index) in couponList" :key="index">
<div class="box-top">
<span>{{item.exchangeName}}</span>
</div>
<div class="box-title">{{item.name}}</div>
<div class="box-hui"><span style="width: 35%">券码:</span> <span>{{item.ticketCode}}</span> </div>
<div class="box-hui"><span style="width: 35%">有效期:</span> <span>{{item.outTime}}</span> </div>
<div class="box-hui"><span style="width: 35%">获得方式:</span> <span>{{item.exchangeFrom}}</span> </div>
<div class="anniu" >
<span>立即核销</span>
</div>
</div>
</div>
<el-empty :image-size="300" v-if="total == 0"></el-empty>
</el-card>
@ -44,6 +59,7 @@
startTime: null,
endTime: null,
},
couponList:[],
recordList:[],
total:0,
}
@ -56,8 +72,13 @@
}
this.loading = true;
listRecord(this.queryParams).then(response => {
this.recordList = response.data.records;
this.total = response.data.total;
this.couponList = response.data.records;
this.total = response.data.total
if( response.data.total == 0){
this.$message.error("未找到兑换券")
}else{
}
this.loading = false;
});
},
@ -71,4 +92,58 @@
width: 100%;
}
.wrap-box{
width: 100%;
flex-wrap: wrap;
margin-top: 20px;
display: flex;
}
.coupon-box{
width: 200px;
height: 250px;
background: #ffffff;
border: 1px solid #eef1f6;
border-radius: 2px;
margin: 10px;
}
.box-top{
width: 100%;
height: 100px;
background: #00afff;
color: white;
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
font-weight: bold;
}
.box-title{
font-size: 18px;
font-weight: bold;
box-sizing: border-box;
padding: 5px 15px;
}
.box-hui{
box-sizing: border-box;
padding: 0px 15px;
color: #999999;
display: flex;
font-size: 12px;
}
.anniu{
box-sizing: border-box;
padding: 5px 15px;
display: flex;
align-items: center;
justify-content: center;
background: #ecf5ff;
color: #409EFF;
width: 100px;
border-radius: 6px;
margin: 5px auto;
cursor: pointer;
margin-top: 15px;
}
</style>