|
|
<template>
|
|
|
|
|
|
<LayoutContent>
|
|
|
<LayoutFilter @on-filter="onFilter" @on-clear="onClear">
|
|
|
<i-form ref="filterForm" inline :model="filter">
|
|
|
<i-form-item prop="id">
|
|
|
<i-input placeholder="输入ID" v-model="filter.id"></i-input>
|
|
|
</i-form-item>
|
|
|
<i-form-item prop="name">
|
|
|
<i-input placeholder="输入券名称" v-model="filter.name"></i-input>
|
|
|
</i-form-item>
|
|
|
<i-form-item prop="status">
|
|
|
<i-select v-model="filter.status" style="width: 100px;">
|
|
|
<i-option :value="0">全部</i-option>
|
|
|
<i-option :value="1">未生效</i-option>
|
|
|
<i-option :value="2">生效中</i-option>
|
|
|
<i-option :value="3">已过期</i-option>
|
|
|
<i-option :value="4">已作废</i-option>
|
|
|
</i-select>
|
|
|
</i-form-item>
|
|
|
<i-form-item prop="time">
|
|
|
<i-date-picker type="datetimerange" v-model="filter.time" width="300" placeholder="开始-结束时间" format="yyyy-MM-dd HH:mm" style="width: 250px"></i-date-picker>
|
|
|
</i-form-item>
|
|
|
</i-form>
|
|
|
</LayoutFilter>
|
|
|
<LayoutTools>
|
|
|
<i-button type="success" icon="md-add">新增优惠券</i-button>
|
|
|
</LayoutTools>
|
|
|
<LayoutTable>
|
|
|
<i-table :columns="columns" :data="data"></i-table>
|
|
|
<template slot="footer" class="btns">
|
|
|
<i-button type="primary" icon="ios-cloud-download">导出</i-button>
|
|
|
</template>
|
|
|
</LayoutTable>
|
|
|
</LayoutContent>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
import {Button} from 'iview'
|
|
|
import Api from '@/api/api'
|
|
|
|
|
|
const api = new Api()
|
|
|
|
|
|
export default {
|
|
|
name: 'CouponPage',
|
|
|
data() {
|
|
|
return {
|
|
|
filter: {
|
|
|
id: '',
|
|
|
name: '',
|
|
|
status: 0,
|
|
|
time: ['', '']
|
|
|
},
|
|
|
data: [{}],
|
|
|
columns: [{
|
|
|
title: 'ID',
|
|
|
key: 'id'
|
|
|
}, {
|
|
|
title: '券名称',
|
|
|
key: 'id'
|
|
|
}, {
|
|
|
title: '数量',
|
|
|
key: 'id'
|
|
|
}, {
|
|
|
title: '使用期限',
|
|
|
key: 'id'
|
|
|
}, {
|
|
|
title: '优惠券说明',
|
|
|
width: 300,
|
|
|
key: 'id'
|
|
|
}, {
|
|
|
title: '状态',
|
|
|
key: 'id'
|
|
|
}, {
|
|
|
title: '操作',
|
|
|
width: 270,
|
|
|
render() {
|
|
|
return (
|
|
|
<div>
|
|
|
<i-button type="success" size="small">查看详情</i-button>
|
|
|
<i-button type="primary" size="small">修改</i-button>
|
|
|
<i-button type="error" size="small">作废</i-button>
|
|
|
<i-button type="warning" size="small">发放记录</i-button>
|
|
|
</div>
|
|
|
);
|
|
|
}
|
|
|
}]
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
onFilter() {
|
|
|
this.fetchData(this.filter)
|
|
|
},
|
|
|
onClear() {
|
|
|
this.$refs.filterForm.resetFields()
|
|
|
this.fetchData(this.filter)
|
|
|
},
|
|
|
fetchData(params) {
|
|
|
api._post('/ufoPlatform/coupon/queryCoupons', {
|
|
|
id: params.id || void 0,
|
|
|
name: params.name || void 0,
|
|
|
status: params.status || void 0,
|
|
|
startTime: params.time[0] || void 0,
|
|
|
endTime: params.time[1] || void 0,
|
|
|
}, true)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
...
|
...
|
|