148 lines
4.0 KiB
Vue
148 lines
4.0 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<div class="head-container">
|
||
<el-button type="primary" icon="plus" @click="$refs.addActive.show()">添加活动</el-button>
|
||
<el-button type="primary" icon="download" @click="$refs.downloadQR.show()">
|
||
下载会员充值二维码
|
||
</el-button>
|
||
<div style="margin-top: 35px; font-size: 16px; color: #333">
|
||
允许充值自定义金额：
|
||
<el-switch
|
||
v-model="shopInfo.isCustom"
|
||
active-value="1"
|
||
inactive-value="0"
|
||
size="large"
|
||
@change="customStatusChange"
|
||
></el-switch>
|
||
</div>
|
||
</div>
|
||
<div class="head-container">
|
||
<el-table :data="tableData.data" v-loading="tableData.loading">
|
||
<el-table-column label="店铺ID" prop="shopId"></el-table-column>
|
||
<el-table-column label="充值金额" prop="amount"></el-table-column>
|
||
<el-table-column label="赠送金额" prop="giftAmount"></el-table-column>
|
||
<el-table-column label="赠送积分" prop="giftPoints"></el-table-column>
|
||
<el-table-column label="是否使用优惠券" prop="isUseCoupon">
|
||
<template v-slot="scope">
|
||
{{ scope.row.isUseCoupon == 1 ? "是" : "否" }}
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" width="120">
|
||
<template v-slot="scope">
|
||
<el-button type="text" icon="edit" @click="$refs.addActive.show(scope.row)">
|
||
编辑
|
||
</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
<div class="head-container">
|
||
<el-pagination
|
||
:total="tableData.total"
|
||
:current-page="tableData.page + 1"
|
||
:page-size="tableData.size"
|
||
@current-change="paginationChange"
|
||
layout="total"
|
||
></el-pagination>
|
||
</div>
|
||
<addActive ref="addActive" @success="getTableData" />
|
||
<QR ref="downloadQR"></QR>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import handselTypes from "./handselTypes";
|
||
import addActive from "./components/addActive.vue";
|
||
import QR from "./components/downloadQR.vue";
|
||
import activeApi from "@/api/account/activate";
|
||
import dayjs from "dayjs";
|
||
export default {
|
||
components: {
|
||
addActive,
|
||
QR,
|
||
},
|
||
data() {
|
||
return {
|
||
query: {
|
||
shopId: "",
|
||
},
|
||
tableData: {
|
||
data: [],
|
||
page: 0,
|
||
size: 10,
|
||
loading: false,
|
||
total: 0,
|
||
},
|
||
shopInfo: {
|
||
isCustom: "0",
|
||
},
|
||
};
|
||
},
|
||
filters: {
|
||
handselTypeFilter(value) {
|
||
return handselTypes.find((item) => item.value == value).label;
|
||
},
|
||
timeFilter(s) {
|
||
return dayjs(s).format("YYYY-MM-DD HH:mm:ss");
|
||
},
|
||
},
|
||
mounted() {
|
||
this.getTableData();
|
||
},
|
||
methods: {
|
||
// 切换状态
|
||
async statusChange(e, row) {
|
||
if (row.couponName) {
|
||
try {
|
||
this.tableData.loading = true;
|
||
const data = { ...row };
|
||
data.isUseCoupon = e;
|
||
console.log(data.isUseCoupon);
|
||
await storageupActivate(data);
|
||
this.getTableData();
|
||
} catch (error) {
|
||
console.log(error);
|
||
this.tableData.loading = false;
|
||
}
|
||
} else {
|
||
console.log(22);
|
||
this.$message({
|
||
message: "请选择优惠劵",
|
||
type: "warning",
|
||
});
|
||
return false;
|
||
}
|
||
},
|
||
// 重置查询
|
||
resetHandle() {
|
||
this.query.name = "";
|
||
this.query.type = "";
|
||
this.getTableData();
|
||
},
|
||
// 分页回调
|
||
paginationChange(e) {
|
||
this.tableData.page = e - 1;
|
||
this.getTableData();
|
||
},
|
||
// 获取商品列表
|
||
async getTableData() {
|
||
this.tableData.loading = true;
|
||
try {
|
||
const res = await activeApi.getList({});
|
||
this.tableData.loading = false;
|
||
this.tableData.data = res;
|
||
this.tableData.total = res.length;
|
||
} catch (error) {
|
||
console.log(error);
|
||
}
|
||
},
|
||
customStatusChange() {
|
||
this.updateShopInfo();
|
||
},
|
||
async updateShopInfo() {
|
||
await tbShopInfoPut(this.shopInfo);
|
||
},
|
||
},
|
||
};
|
||
</script>
|