114 lines
3.1 KiB
Vue
114 lines
3.1 KiB
Vue
<template>
|
|
<div>
|
|
<el-dialog title="优惠券" v-model="visible" width="80%">
|
|
<el-form :inline="true" :model="form">
|
|
<el-form-item label="券名称">
|
|
<el-input v-model="form.name" placeholder="请输入券名称"></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item label="状态">
|
|
<el-select v-model="form.status" placeholder="请选择" style="width: 140px">
|
|
<el-option
|
|
v-for="item in status"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="领取时间">
|
|
<el-date-picker
|
|
v-model="form.date"
|
|
type="daterange"
|
|
value-format="yyyy-MM-dd"
|
|
range-separator="至"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="handleSearch">搜索</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<el-table
|
|
style="width: 100%"
|
|
:data="tableData"
|
|
:columns="columns"
|
|
:pagination="pagination"
|
|
:row-key="getRowKey"
|
|
>
|
|
<el-table-column prop="id" label="券ID" />
|
|
<el-table-column prop="name" label="券名称" />
|
|
<!-- <el-table-column prop="type" label="券类型" /> -->
|
|
<el-table-column prop="createTime" label="领取时间" />
|
|
<el-table-column prop="useTime" label="使用时间" />
|
|
<el-table-column prop="source" label="领取来源" />
|
|
<el-table-column label="操作">
|
|
<template #default="scope">
|
|
<el-link :underline="false" type="primary" size="mini">查看</el-link>
|
|
<el-button :underline="false" type="danger" size="mini">删除</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<el-pagination
|
|
v-model:current-page="pagination.currentPage"
|
|
v-model:page-size="pagination.pageSize"
|
|
:total="pagination.total"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
@current-change="getList"
|
|
@size-change="getList"
|
|
/>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import couponApi from "@/api/market/coupon";
|
|
|
|
import { ref, reactive } from "vue";
|
|
const status = [
|
|
{ label: "全部", value: "" },
|
|
{ label: "未使用", value: 0 },
|
|
{ label: "已使用", value: 1 },
|
|
{ label: "已过期", value: 2 },
|
|
];
|
|
const visible = ref(false);
|
|
const form = reactive({
|
|
status: 0,
|
|
name: "",
|
|
date: "",
|
|
userId: "",
|
|
page: 1,
|
|
});
|
|
|
|
function open(data) {
|
|
console.log(data);
|
|
data.userId = form.userId;
|
|
form.page = 1;
|
|
visible.value = true;
|
|
getList();
|
|
}
|
|
function close() {
|
|
visible.value = false;
|
|
}
|
|
function getList() {
|
|
couponApi.getDetail(form).then((res) => {
|
|
console.log(res);
|
|
tableData.value = res.records;
|
|
pagination.total = res.totalRow;
|
|
});
|
|
}
|
|
|
|
const tableData = ref([]);
|
|
const pagination = ref({
|
|
total: 0,
|
|
pageSize: 10,
|
|
currentPage: 1,
|
|
});
|
|
defineExpose({
|
|
open,
|
|
close,
|
|
});
|
|
</script> |