优惠卷

This commit is contained in:
余同学 2024-11-25 18:18:38 +08:00
parent a98bd21673
commit 99b9851d55
7 changed files with 928 additions and 12 deletions

12
src/api/modules/coupon.js Normal file
View File

@ -0,0 +1,12 @@
import $http from "@/utils/httpRequest.js";
export const coupon = {
//优惠券列表
couponList: (data) => {
return $http.request({
url: `/merchant-api/coupon/page`,
method: "get",
params: data,
});
},
};

View File

@ -176,7 +176,7 @@ export const mer_admin = {
}, },
//修改密码 //修改密码
changePassword: (data) => { changePassword: (data) => {
return $http.put(`/merchant-api/brand/admin_password`, data); return $http.put(`/merchant-api/auth/change/pwd`, data);
}, },
//修改管理员 //修改管理员
editAdmin: (data) => { editAdmin: (data) => {

View File

@ -120,6 +120,19 @@ export default {
}, },
], ],
}, },
{
menuId: getUUID(),
parentId: 0,
parentName: null,
name: "优惠卷管理",
url: "coupon/index",
perms: "",
type: 0,
elIcon: "el-icon-document-remove",
orderNum: 0,
open: null,
list: [],
},
// { // {
// "menuId": getUUID(), // "menuId": getUUID(),
// "parentId": 0, // "parentId": 0,

View File

@ -3,7 +3,7 @@
:title="isAdd ? '修改管理员账号' : '修改密码'" :title="isAdd ? '修改管理员账号' : '修改密码'"
:visible.sync="dialogFormVisible" :visible.sync="dialogFormVisible"
> >
<el-form ref="ruleForm" :model="form" :rules="rules"> <el-form v-if="isAdd" ref="ruleForm" :model="form" :rules="rules">
<el-form-item <el-form-item
label="密码:" label="密码:"
prop="password" prop="password"
@ -42,6 +42,45 @@
></el-input> ></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-form v-else ref="ruleForm" :model="form" :rules="rules">
<el-form-item
label="旧密码:"
prop="oldPassword"
:label-width="formLabelWidth"
>
<el-input
style="width: 240px"
type="password"
placeholder="请输入密码"
v-model="form.oldPassword"
autocomplete="off"
></el-input>
</el-form-item>
<el-form-item
label="新密码"
:label-width="formLabelWidth"
prop="newPassword"
>
<el-input
placeholder="请输入新密码"
style="width: 240px; margin-right: 20px"
v-model="form.newPassword"
show-password
></el-input>
</el-form-item>
<el-form-item
prop="isPassword"
label="确认新密码:"
:label-width="formLabelWidth"
>
<el-input
style="width: 240px"
placeholder="请再次输入新密码"
v-model="form.isPassword"
show-password
></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false"> </el-button> <el-button @click="dialogFormVisible = false"> </el-button>
<el-button type="primary" @click="determine"> </el-button> <el-button type="primary" @click="determine"> </el-button>
@ -88,11 +127,61 @@ export default {
trigger: "blur", trigger: "blur",
}, },
], ],
oldPassword: [
{ required: true, message: "请输入密码", trigger: "blur" },
],
newPassword: [
{
required: true,
message: "请输入密码",
trigger: "blur",
},
{
min: 8,
max: 12,
message:
"密码由8-12位字母、数字、特殊符号~、@、#、$、%、*)的组成,请重新输入",
trigger: "blur",
},
{
trigger: "blur",
validator: (rule, value, callback) => {
var passwordreg =
/(?=.*\d)(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{8,12}/;
if (!passwordreg.test(value)) {
callback(
new Error(
"密码由8-12位字母、数字、特殊符号~、@、#、$、%、*)的组成,请重新输入"
)
);
} else {
callback();
}
},
},
],
isPassword: [
{
required: true,
message: "请输入确认密码",
trigger: "blur",
},
{
trigger: "blur",
validator: (rule, value, callback) => {
if (value != this.form.newPassword) {
callback(new Error("密码输入不一致"));
} else {
callback();
}
},
},
],
}, },
}; };
}, },
watch: { watch: {
addDialogVisible(newVal, oldVal) { dialogFormVisible(newVal, oldVal) {
if (!newVal) { if (!newVal) {
this.$refs.ruleForm.resetFields(); this.$refs.ruleForm.resetFields();
} }
@ -107,6 +196,9 @@ export default {
code: "", code: "",
password: "", password: "",
}; };
} else {
this.isAdd = false;
console.log(row);
} }
this.dialogFormVisible = true; this.dialogFormVisible = true;
}, },
@ -140,15 +232,31 @@ export default {
setTimeout(this.countDown, 1000); setTimeout(this.countDown, 1000);
}, },
determine() { determine() {
if (this.isAdd) {
this.$refs.ruleForm.validate((valid) => { this.$refs.ruleForm.validate((valid) => {
console.log(valid); console.log(valid);
if (valid) { if (valid) {
this.$api.mer_admin.editAdmin(this.form).then((res) => { this.$api.mer_admin.editAdmin(this.form).then((res) => {
console.log(res); console.log(res);
}); });
} }
}); });
} else {
this.$refs.ruleForm.validate((valid) => {
console.log(valid);
if (valid) {
this.$api.mer_admin
.changePassword({
oldPassword: this.form.oldPassword,
newPassword: this.form.newPassword,
})
.then((res) => {
this.$message.success("修改成功");
this.dialogFormVisible = false;
});
}
});
}
}, },
}, },
}; };

View File

@ -0,0 +1,298 @@
<template>
<div style="height: calc(100vh - 200px)">
<obj-table-plus
ref="oTable"
style="height: 100%"
:tableCols="tableCols"
:tableProp="tableProp"
@query="queryList"
v-model="dataList"
:tableEvent="tableEvent"
:enableAutoQuery="false"
>
<template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item v-if="marketList.length > 0" label="菜市场">
<el-select
@change="getData"
v-model="formInline.marketId"
placeholder="请选择菜市场"
>
<el-option
v-for="item in marketList"
:key="item.marketId"
:label="item.marketName"
:value="item.marketId"
></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="marketList.length > 0" label="店铺">
<el-select v-model="formInline.shopId" placeholder="请选择店铺">
<el-option
v-for="item in storeList"
:key="item.shopId"
:label="item.shopName"
:value="item.shopId"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
</el-form-item>
</el-form>
<div class="mb-2">
<el-popover placement="bottom" trigger="click">
<el-button
type="warning"
size="mini"
v-for="item in [
{ label: '无门槛商品优惠卷', value: '1' },
{ label: '满减卷', value: '2' },
{ label: '新粉优惠卷', value: '3' },
]"
:key="item.value"
@click="addProduct({ label: item.label })"
>{{ item.label }}
</el-button>
<el-button
slot="reference"
type="primary"
class="link-left"
icon="el-icon-plus"
>添加优惠卷</el-button
>
</el-popover>
<!-- <el-button type="primary" size="small" @click="addProduct"
>添加优惠卷</el-button
> -->
<!-- <el-button
:disabled="selectList.length <= 0"
type="danger"
size="small"
@click="deleteProduct"
>批量删除</el-button
> -->
</div>
</template>
</obj-table-plus>
<!-- 添加或编辑 -->
<add-or-update
@queryList="$refs.oTable.reload()"
ref="addOrUpdate"
></add-or-update>
<!-- 查看详情 -->
<!-- <viewDetails ref="viewDetails"></viewDetails> -->
</div>
</template>
<script>
import AddOrUpdate from "./popup/add-or-update.vue";
// import viewDetails from "./popup/view-details.vue";
export default {
components: { AddOrUpdate },
data() {
return {
dataList: [],
formInline: {
marketId: "",
shopId: "",
},
tableProp: {
"auto-resize": true,
border: true,
height: "auto",
"row-id": "id",
"show-overflow": false,
},
productFilterType: "SALE",
selectList: [],
isShopId: false,
marketList: [],
storeList: [],
};
},
created() {
if (JSON.parse(sessionStorage.getItem("userInfo")).markets.length > 0) {
this.isShopId = true;
this.formInline.marketId = JSON.parse(
sessionStorage.getItem("userInfo")
).markets[0].marketId;
this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
console.log(this.marketList);
this.getData();
} else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
(this.formInline.shopId = JSON.parse(
sessionStorage.getItem("userInfo")
).shopId),
(this.isShopId = true);
this.$nextTick(() => {
this.$refs.oTable.reload();
});
} else {
this.isShopId = false;
}
},
methods: {
getData() {
this.$api.mer_admin
.storeList({ marketId: this.formInline.marketId })
.then((res) => {
this.storeList = res.data.data;
this.formInline.shopId = res.data.data[0].shopId;
this.$nextTick(() => {
this.$refs.oTable.reload();
});
});
},
addProduct(row) {
this.$refs.addOrUpdate
.toggle()
.add({
...row,
marketId: this.formInline.marketId,
shopId: this.formInline.shopId,
});
},
deleteProduct() {
console.log(this.selectList);
let integers = this.selectList.map((item) => {
return item.id;
});
this.$confirm("此操作将删除该商品, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
console.log("111");
this.$api.mer_admin.BatchDeleteProducts(integers).then((res) => {
this.$refs.oTable.reload();
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
},
queryList(pageNo, pageSize) {
this.$api.coupon
.couponList({
pageNumber: pageNo,
pageSize: pageSize,
...this.formInline,
})
.then((res) => {
console.log(res);
this.$refs.oTable.complete(
res.data.data.data,
Number(res.data.data.total)
);
})
.catch((err) => {
this.$refs.oTable.complete(false);
});
},
},
computed: {
tableCols() {
return [
{ type: "checkbox", width: "60px", fixed: "left" },
// { type: "seq", width: "60px", align: "center", title: "" },
{
title: "店铺",
align: "center",
field: "cardName",
},
{
title: "优惠券名称",
align: "center",
field: "cardNo",
},
{
title: "发行方",
align: "center",
field: "telNo",
},
{
title: "类别",
align: "center",
field: "name",
},
{
title: "领取类型",
align: "center",
field: "receiveType",
},
{
title: "优惠券类型",
align: "center",
field: "name",
},
{
title: "优惠金额",
align: "center",
field: "money",
},
{
title: "折扣",
align: "center",
field: "discount",
},
{
title: "最低消费",
align: "center",
field: "minPrice",
},
{
title: "状态",
align: "center",
field: "status",
type: "jsx",
render: ({ row }) => {
if (row.status == 0) {
return <span>关闭</span>;
} else if (row.status == 2) {
return <span>开启</span>;
}
},
},
{
title: "操作",
fixed: "right",
type: "jsx",
align: "center",
width: "140px",
render: (row) => {
let edit = () => {
// this.$refs.viewDetails.toggle(row).update();
};
return (
<div>
<el-button size="mini" type="primary" onClick={edit}>
详情
</el-button>
</div>
);
},
},
];
},
tableEvent() {
return {
"checkbox-all": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
},
"checkbox-change": ({ records, reserves }) => {
this.selectList = [...records, ...reserves];
},
};
},
},
};
</script>
<style lang="scss" scoped></style>

View File

@ -0,0 +1,255 @@
<template>
<div>
<obj-modal
ref="modal"
labelWidth="150px"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<template slot="dialog__content">
<el-form :model="modalData" ref="modalForm">
<el-form-item label-width="150px" label="优惠券名称" prop="name">
<el-input
style="width: 350px"
v-model="modalData.name"
placeholder="请输入优惠券名称"
>
</el-input>
</el-form-item>
<el-form-item label-width="150px" label="使用日期" prop="name">
<el-date-picker
@change="usageDateChange"
v-model="usageDate"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item label-width="150px" label="开发领取日期" prop="name">
<el-date-picker
@change="collectionDateChange"
v-model="collectionDate"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item label-width="150px" label="选择商品" prop="targetIds">
<el-input
style="width: 350px"
placeholder="请选择选择商品"
v-model="modalData.targetIds"
>
<template slot="append">
<el-button @click="selectProduct">请选择</el-button>
</template>
</el-input>
<div v-if="product.name" class="product">
<div>
<el-image
style="width: 80px; height: 80px; margin-right: 10px"
:src="product.productPhotoList[0].url"
>
</el-image>
</div>
<div>
<div style="line-height: 20px">
商品名称{{ product.name }}
</div>
<div style="line-height: 20px">
库存{{ product.stockNum }}
</div>
<div style="line-height: 20px; color: rgba(255, 87, 51, 1)">
{{ product.minSalePrice }}
</div>
</div>
</div>
</el-form-item>
<el-form-item label-width="150px" label="优惠金额" prop="targetIds">
<el-input-number
v-model="modalData.money"
:min="0"
label="请输入"
></el-input-number>
</el-form-item>
<el-form-item label-width="150px" label="发放数量" prop="targetIds">
<el-input-number
v-model="modalData.total"
:min="0"
:max="99999"
label="请输入"
></el-input-number>
</el-form-item>
<el-form-item label-width="150px" label="每人限领" prop="targetIds">
<el-select v-model="modalData.limitedNum" placeholder="请选择">
<el-option
v-for="item in [
{
label: '限制',
value: 0,
},
{
label: '1张',
value: 1,
},
{
label: '2张',
value: 2,
},
{
label: '3张',
value: 3,
},
{
label: '4张',
value: 4,
},
{
label: '5张',
value: 5,
},
]"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-form>
</template>
</obj-modal>
<!-- 选择商品 -->
<commodity @getProduct="getProduct" ref="commodity"></commodity>
</div>
</template>
<script>
import commodity from "./commodity.vue";
import { debounce, cloneDeep } from "lodash";
import { Divider } from "element-ui";
export default {
components: { commodity },
data() {
return {
isAdd: true,
//
modalConfig: {
title: "添加优惠卷",
show: false,
width: "800px",
},
formInline: {
marketId: "",
shopId: "",
},
modalData: {},
usageDate: [], //使
collectionDate: [], //
product: {}, //
};
},
methods: {
queryTableData(pageNo, pageSize) {},
toggle(e) {
if (this.modalConfig.show == false) {
this.modalConfig.show = true;
} else {
this.modalConfig.show = false;
}
if (e) {
this.init(cloneDeep(e));
}
return {
add: (row) => {
this.formInline = {
marketId: row.marketId,
shopId: row.shopId,
};
this.modalConfig.title = `添加${row.label}`;
this.$nextTick(() => {
this.modalData = {
total: 10000,
};
this.$refs.modal.resetFields();
});
this.isAdd = true;
},
update: () => {
this.isAdd = false;
},
};
},
init(row) {},
usageDateChange(e) {
if (e) {
this.modalData.useStartTime = e[0];
this.modalData.useEndTime = e[1];
} else {
this.modalData.useStartTime = "";
this.modalData.useEndTime = "";
}
},
collectionDateChange(e) {
if (e) {
this.modalData.receiveStartTime = e[0];
this.modalData.receiveEndTime = e[1];
} else {
this.modalData.receiveStartTime = "";
this.modalData.receiveEndTime = "";
}
},
//
selectProduct() {
console.log("123");
this.$refs.commodity.toggle().add(this.formInline);
},
//
getProduct(row) {
console.log(row);
this.modalData.targetIds = row.id;
this.product = row;
},
},
computed: {
modalHandles() {
return [
{
label: "取消",
handle: () => {
this.toggle();
},
},
{
label: "确认添加",
type: "primary",
handle: () => {
console.log(this.modalData);
this.$api.mer_admin.bankCardAdd(this.modalData).then((res) => {
console.log(res);
this.$emit("queryList");
this.toggle();
});
},
},
];
},
},
asyncComputed: {},
};
</script>
<style lang="scss" scoped>
.product {
display: flex;
align-items: center;
margin-top: 10px;
border: 1px solid #ccc;
width: 350px;
}
</style>

View File

@ -0,0 +1,230 @@
<template>
<obj-modal
ref="modal"
labelWidth="150px"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<template slot="dialog__content">
<obj-table-plus
ref="oTable"
style="height: 70vh"
:tableCols="tableCols"
:tableProp="tableProp"
@query="queryList"
v-model="dataList"
:tableEvent="tableEvent"
:enableAutoQuery="false"
>
<!-- <template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item v-if="marketList.length > 0" label="菜市场">
<el-select
@change="getData"
v-model="formInline.marketId"
placeholder="请选择菜市场"
>
<el-option
v-for="item in marketList"
:key="item.marketId"
:label="item.marketName"
:value="item.marketId"
></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="marketList.length > 0" label="店铺">
<el-select v-model="formInline.shopId" placeholder="请选择店铺">
<el-option
v-for="item in storeList"
:key="item.shopId"
:label="item.shopName"
:value="item.shopId"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
</el-form-item>
</el-form>
</template> -->
</obj-table-plus>
</template>
</obj-modal>
</template>
<script>
import { debounce, cloneDeep } from "lodash";
export default {
data() {
return {
isAdd: true,
//
modalConfig: {
title: "请点击选择商品",
show: false,
width: "1000px",
},
modalData: {},
dataList: [], //
tableProp: {
"auto-resize": true,
border: true,
height: "auto",
"row-id": "id",
"show-overflow": false,
},
selectList: {},
tableEvent: {
"current-change": async (e) => {
console.log(e.row);
this.selectList = e.row;
},
},
formInline: {},
};
},
methods: {
queryList(pageNo, pageSize) {
this.$api.mer_admin
.getProductPage({
p: {
pageNumber: pageNo,
pageSize: pageSize,
},
...this.formInline,
productFilterType: "SALE",
merchantId: JSON.parse(sessionStorage.getItem("userInfo")).merchantId,
productQuerySortParam: [],
})
.then((res) => {
console.log(res);
this.$refs.oTable.complete(
res.data.data.data,
Number(res.data.data.total)
);
})
.catch((err) => {
this.$refs.oTable.complete(false);
});
},
toggle(e) {
if (this.modalConfig.show == false) {
this.modalConfig.show = true;
} else {
this.modalConfig.show = false;
}
if (e) {
this.init(cloneDeep(e));
}
return {
add: (row) => {
this.formInline = row;
this.isAdd = true;
this.$nextTick(() => {
this.$refs.oTable.reload();
});
},
update: () => {
this.isAdd = false;
},
};
},
init(row) {},
},
computed: {
tableCols() {
return [
{ type: "seq", width: "60px", align: "center", title: "序号" },
{
title: "商品图",
field: "productPhotoList",
align: "center",
width: "100px",
type: "jsx",
render: ({ row }) => {
if (row.productPhotoList.length > 0) {
return (
<el-image
preview-src-list={row.productPhotoList.map((item) => {
return item.url;
})}
src={row.productPhotoList[0].url}
></el-image>
);
} else {
return <span>暂无商品图</span>;
}
},
},
{
title: "商品名称",
align: "center",
field: "name",
},
{
title: "商品售价",
align: "center",
field: "minSalePrice",
type: "jsx",
render: ({ row }) => {
if (row.minSalePrice == row.maxSalePrice) {
return <span>{row.minSalePrice}</span>;
} else {
return (
<span>
{row.minSalePrice}~{row.maxSalePrice}
</span>
);
}
},
},
{
title: "折扣",
align: "center",
field: "discountActivity",
type: "jsx",
render: ({ row }) => {
if (row.discountActivity) {
return <span>{row.discountActivity.ruleObject.discount}</span>;
}
},
},
{
title: "销量",
align: "center",
field: "saleNum",
},
{
title: "库存",
align: "center",
field: "stockNum",
},
];
},
modalHandles() {
return [
{
label: "取消",
handle: () => {
this.toggle();
},
},
{
label: "确认",
type: "primary",
handle: () => {
this.$emit("getProduct", this.selectList);
this.toggle();
},
},
];
},
},
};
</script>
<style>
</style>