会员设置

This commit is contained in:
余同学 2024-12-13 18:59:26 +08:00
parent e3bc9276d2
commit 6a55f965d7
12 changed files with 1296 additions and 267 deletions

View File

@ -58,6 +58,7 @@
"nprogress": "0.2.0",
"obj-modal": "^1.2.2",
"obj-table-plus": "^2.4.0",
"qrcodejs2": "^0.0.2",
"qs": "^6.13.0",
"quill": "1.3.7",
"screenfull": "5.0.2",

View File

@ -16,6 +16,31 @@ export const marketing = {
data: data,
});
},
//会员开通情况
getEffective: (data) => {
return $http.request({
url: `/merchant-api/memberPackageUnitStatus/getEffective`,
method: "post",
data,
});
},
//有效套餐
memberPackageList: (data) => {
return $http.request({
url: `/merchant-api/memberPackage/list`,
method: "post",
data,
});
},
//下单
placeOrder: (data) => {
return $http.request({
url: `/merchant-api/memberPackageUnitOrder/placeOrder`,
method: "post",
data,
});
},
//会员用户
marketingUserPage: (data) => {
return $http.request({
url: `/merchant-api/memberUnitUser/page`,
@ -23,6 +48,27 @@ export const marketing = {
params: data,
});
},
memberUnitUserDetail: (data) => {
return $http.request({
url: `/merchant-api/memberUnitUser/detail`,
method: "post",
data,
});
},
changeMemberPoints: (data) => {
return $http.request({
url: `/merchant-api/memberUnitUser/changeMemberPoints`,
method: "post",
data,
});
},
changeGrowthValue: (data) => {
return $http.request({
url: `/merchant-api/memberUnitUser/changeGrowthValue`,
method: "post",
data,
});
},
//积分列表
integralList: (data) => {
return $http.request({
@ -31,4 +77,25 @@ export const marketing = {
data,
});
},
reverseEnable: (data) => {
return $http.request({
url: `/merchant-api/memberUnitMemberTask/reverseEnable`,
method: "post",
data,
});
},
integralTop: (data) => {
return $http.request({
url: `/merchant-api/memberUnitMemberTask/top`,
method: "post",
data,
});
},
settingTaskDetail: (data) => {
return $http.request({
url: `/merchant-api/memberUnitMemberTask/settingTaskDetail`,
method: "post",
data,
});
},
};

View File

@ -156,7 +156,7 @@ http.interceptors.response.use(
router.push({ name: "login" });
return Promise.resolve(response);
} else if (response.data && response.data.code !=200 ) {
Message.closeAll();
// Message.closeAll();
Message({
message: response.data.msg||response.data.message,
type: "error"
@ -166,7 +166,7 @@ http.interceptors.response.use(
//请求成功的情况
//如果是开发模式下,都要弹出
if (process.env.NODE_ENV !== "production") {
Message.closeAll();
// Message.closeAll();
Message({
message: response.data.msg||response.data.message,
type: "success"
@ -175,9 +175,9 @@ http.interceptors.response.use(
// 生产环境下限制性弹出
else {
if (response.data.msg != "success" && response.data.msg != "查询成功" && Object.prototype.toString.call(response.data) === '[object Object]') {
Message.closeAll();
// Message.closeAll();
Message({
message: response.data.msg,
message: response.data.msg||response.data.message,
type: "success"
});
}

View File

@ -12,39 +12,36 @@
24年3月本商铺修改VIP2所需成长值为700并新增会员生日优惠卷2修改提交后,该用户会员等级保持VIP2不变且享有会员优惠卷1和会员优惠卷2
</div>
</div>
<div>
<!-- <el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="单位类型:">
<el-select
v-model="formInline.unitType"
placeholder="请选择单位类型:"
>
<div v-if="storeList.length > 1">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="摊铺:">
<el-select v-model="formInline.shopId" placeholder="请选择摊铺::">
<el-option
v-for="item in [
{ label: '市场', value: '1' },
{ label: '摊主', value: '2' },
{ label: '云店', value: '3' },
]"
:key="item.value"
:label="item.label"
:value="item.value"
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 @click="getData" type="primary">查询</el-button>
<el-button @click="getData" type="primary">导出</el-button>
<el-button @click="getList" type="primary">查询</el-button>
</el-form-item>
</el-form> -->
</el-form>
</div>
<div class="tipsLevel">
<div>
<span style="margin-right: 30px">全部等级({{ list.length }})</span
><el-button @click="add(null)" type="primary">+新增套餐</el-button>
><el-button @click="add" type="primary">+新增套餐</el-button>
</div>
<div>
<!-- <span style="margin-right: 30px">会员快要到期了</span>
<el-button @click="add(null)" type="primary">购买工具</el-button> -->
<span v-if="!form.effective" style="margin-right: 30px"
>未开通会员</span
>
<span v-if="form.effective" style="margin-right: 30px"
>会员到期时间 {{ form.effectiveEndTime }}</span
>
<el-button @click="addSetMenu" type="primary">购买工具</el-button>
</div>
</div>
<el-table :data="list" :border="true" style="width: 100%">
@ -109,24 +106,29 @@
</el-table>
<!-- 添加 -->
<addOrUpdate @getList="getList" ref="addOrUpdate"></addOrUpdate>
<!-- 添加套餐 -->
<set-menu @getList="getList" ref="setMenu"></set-menu>
</div>
</template>
<script>
import setMenu from "./popup/set-menu.vue";
import addOrUpdate from "./popup/add-or-update.vue";
import { mapState } from "vuex";
export default {
components: {
addOrUpdate,
setMenu,
},
data() {
return {
list: [],
formInline: {
unitType: "1",
unitType: "",
marketId: "",
shopId: "",
},
form: {},
};
},
created() {
@ -151,59 +153,18 @@ export default {
// },
getList() {
this.$api.marketing.marketingLevelPage(this.formInline).then((res) => {
this.list = res.data.data;
this.list = res.data.data ? res.data.data : [];
});
this.$api.marketing.getEffective(this.formInline).then((res) => {
console.log(res);
this.form = res.data.data;
});
},
add() {
// this.$api.marketing
// .addMarketingLevel({
// marketId: this.marketId,
// unitType: this.formInline.unitType,
// levelList: [
// {
// levelName: "",
// requiredGrowthValue: 0,
// growthValueUpperLimit: 99,
// enableMemberDiscount: true,
// enablePointsRedemption: true,
// enableBirthdayCoupons: true,
// enableBirthdayReward: true,
// discountRate: "9",
// rewardEffectiveTimeType: 1,
// memberLevelCouponsList: [
// {
// couponsName: "",
// couponsThreshold: "10",
// couponsMinus: 8,
// couponsEffectiveTimeType: 2,
// },
// ],
// },
// {
// levelName: "",
// requiredGrowthValue: 100,
// growthValueUpperLimit: 999999999,
// enableMemberDiscount: true,
// enablePointsRedemption: true,
// enableBirthdayCoupons: true,
// enableBirthdayReward: true,
// discountRate: "8",
// rewardEffectiveTimeType: 1,
// memberLevelCouponsList: [
// {
// couponsName: "",
// couponsThreshold: "20",
// couponsMinus: 10,
// couponsEffectiveTimeType: 2,
// },
// ],
// },
// ],
// })
// .then((res) => {
// console.log(res);
// });
this.$refs.addOrUpdate.toggle().add();
this.$refs.addOrUpdate.toggle().add(this.formInline);
},
addSetMenu() {
this.$refs.setMenu.toggle().add(this.formInline);
},
confirmEvent() {},
cancelEvent() {},

View File

@ -63,7 +63,7 @@ export default {
} else {
console.log("111");
this.modalData = {
couponsName: "",
couponsName: "生日优惠卷",
couponsThreshold: 0,
couponsMinus: 0,
couponsEffectiveTimeType: "1",

View File

@ -28,7 +28,6 @@
</div>
</template>
<script>
import { mapState } from "vuex";
import addCoupon from "./add-coupon.vue";
import { debounce, cloneDeep } from "lodash";
export default {
@ -111,8 +110,14 @@ export default {
this.init(cloneDeep(e.row));
}
return {
add: () => {
this.modalData = {};
add: (row) => {
console.log(row);
this.modalData = {
marketId: row.marketId,
shopId: row.shopId,
unitType: row.unitType,
};
this.queryTableData();
this.isAdd = true;
},
@ -493,12 +498,6 @@ export default {
label: this.isAdd ? "确认添加" : "确认修改",
type: "primary",
handle: debounce(() => {
this.modalData.marketId = this.marketId;
this.modalData.shopId = this.shopId;
this.modalData.unitType = JSON.parse(
sessionStorage.getItem("userInfo")
).unitType;
console.log(this.modalData);
this.$refs.modalForm.validate((valid) => {
if (valid) {
this.$api.marketing
@ -513,13 +512,6 @@ export default {
},
];
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
asyncComputed: {},
};

View File

@ -0,0 +1,245 @@
<template>
<div>
<obj-modal
ref="modal"
labelWidth="150px"
:modalCols="modalCols"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<template slot="dialog__after">
<el-form
label-width="150px"
:rules="rules"
:model="modalData"
ref="modalForm"
>
<el-form-item prop="packageId" label="选择套餐:">
<div class="card">
<div v-for="item in PackageList" :key="item.id">
<el-card class="box-card">
<div style="font-size: 20px; font-weight: 600">
{{ item.packageName }}
</div>
<div style="margin-top: 20px; font-size: 16px">
<span style="font-size: 20px; font-weight: 600">{{
item.packagePrice
}}</span
>/{{ item.packageEffectiveTimeQuantity
}}{{ item.packageEffectiveTimeUnit == 1 ? "年" : "月" }}
</div>
</el-card>
<el-radio
@change="changePackage"
style="margin-bottom: 20px"
v-model="modalData.packageId"
:label="item.id"
border
>请选择</el-radio
>
</div>
</div>
</el-form-item>
<el-form-item prop="packageQuantity" label="购买数量:">
<el-input-number
style="width: 200px"
controls-position="right"
:precision="0"
v-model="modalData.packageQuantity"
:min="0"
label="请输入"
></el-input-number>
</el-form-item>
</el-form>
<el-dialog
title="请扫描二维码"
:visible.sync="dialogVisible"
width="500px"
append-to-body
:before-close="handleClose"
>
<div v-if="isShow" class="qrcodeName">
<div class="qrcode" ref="qrCodeUrl"></div>
<div style="margin-top: 20px">请使用支付宝扫一扫完成支付</div>
</div>
</el-dialog>
</template>
</obj-modal>
</div>
</template>
<script>
import QRCode from "qrcodejs2";
import { debounce, cloneDeep } from "lodash";
import { Divider } from "element-ui";
export default {
components: {},
data() {
return {
isAdd: true,
dialogVisible: false,
isShow: false,
//
modalConfig: {
title: "添加优惠卷",
show: false,
width: "60%",
fullscreen: true,
},
modalData: {},
PackageList: [],
rules: {
packageId: [
{
required: true,
message: "请选择套餐",
trigger: ["blur", "change"],
},
],
packageQuantity: [
{
required: true,
message: "请输入购买数量",
trigger: ["blur", "change"],
},
],
},
userData: {},
qrcode: "",
};
},
watch: {
"modalConfig.show"(newVal) {
if (!newVal) {
//
setTimeout(() => {
this.$refs.modalForm.resetFields();
this.$emit("getList");
});
}
},
},
methods: {
queryTableData(pageNo, pageSize) {},
toggle(e) {
if (this.modalConfig.show == false) {
this.modalConfig.show = true;
this.$api.marketing
.memberPackageList({ packageEnable: true })
.then((res) => {
console.log(res);
this.PackageList = res.data.data;
// this.modalData = res.data.data;
});
} else {
this.modalConfig.show = false;
}
if (e) {
this.init(cloneDeep(e));
}
return {
add: (row) => {
this.userData = {
marketId: row.marketId,
shopId: row.shopId,
unitType: row.unitType,
userId: JSON.parse(sessionStorage.getItem("userInfo")).userId,
};
this.modalData = {
packageId: "",
packageQuantity: "1",
};
this.modalConfig.title = "会员营销工具套餐";
this.isAdd = true;
},
update: () => {
this.isAdd = false;
},
};
},
init(row) {},
changePackage() {
this.$refs.modalForm.validate();
// console.log(this.modalData.packageId);
},
creatQrCode(data) {
this.$nextTick(() => {
this.qrcode = new QRCode(this.$refs.qrCodeUrl, {
text: data.qr_pay_url, //
width: 300,
height: 300,
colorDark: "#000000",
colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.H,
});
});
},
handleClose(done) {
done();
this.isShow = false;
this.qrcode.clear();
console.log("123");
},
},
computed: {
modalCols() {
return [];
},
modalHandles() {
return [
{
label: "取消",
handle: () => {
this.toggle();
},
},
{
label: "确定购买",
type: "primary",
loading: this.isLoading,
submit: true,
handle: () => {
console.log(this.modalData, this.userData);
this.$refs.modalForm.validate((valid) => {
if (valid) {
this.$api.marketing
.placeOrder({ ...this.userData, ...this.modalData })
.then((res) => {
console.log(res);
this.dialogVisible = true;
this.isShow = true;
this.creatQrCode(res.data.data);
});
}
});
},
},
];
},
},
asyncComputed: {},
};
</script>
<style lang="scss" scoped>
.card {
width: 100%;
display: flex;
text-align: center;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.box-card {
margin-bottom: 20px;
width: 300px;
text-align: center;
}
.qrcodeName {
display: flex;
flex-flow: column;
align-items: center;
justify-content: center;
text-align: center;
}
</style>

View File

@ -4,7 +4,7 @@
此页面数据在每日0点提交并生效;请勿频繁操作以免影响用户体验
</div>
<div class="tipsLevel">积分/成长值任务9</div>
<div class="tipsLevel" v-if="storeList.length > 0">
<div class="tipsLevel" v-if="storeList.length > 1">
<el-select v-model="formInline.shopId" placeholder="请选择">
<el-option
v-for="item in storeList"
@ -19,49 +19,64 @@
>
</div>
<el-table :data="list" :border="true" style="width: 100%">
<el-table-column width="100" align="center" label="类型" prop="unitType">
<template v-slot="scope">
<span>{{ getUnitType(scope.row.unitType) }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="任务名称" prop="taskName" />
<el-table-column align="center" label="任务描述" prop="taskConfigDetail" />
<el-table-column
align="center"
label="任务描述"
prop="taskConfigDetail"
/>
<el-table-column
width="100"
align="center"
label="排序"
prop="taskSort"
/>
<el-table-column
width="140"
align="center"
label="状态"
prop="packageEffectiveTimeUnit"
prop="taskEnable"
>
<template v-slot="scope">
<span>{{
scope.row.packageEffectiveTimeUnit == 1 ? "年" : "月"
}}</span>
<el-switch
@change="changeState(scope.row)"
v-model="scope.row.taskEnable"
>
</el-switch>
</template>
</el-table-column>
<el-table-column align="center" label="操作" fixed="right" width="240">
<template v-slot="scope">
<el-button @click="add(scope.row)" type="primary">编辑</el-button>
<el-button @click="add(scope.row)" type="primary">转移</el-button>
<el-popconfirm
confirm-button-text="确定"
cancel-button-text="取消"
icon-color="#626AEF"
title="确定删除吗?"
@confirm="confirmEvent(scope.row)"
@cancel="cancelEvent"
<el-button
v-show="scope.$index != 0"
size="mini"
@click="addTop(scope.row)"
type="primary"
>置顶</el-button
>
<el-button size="mini" @click="addConfig(scope.row)" type="primary"
>配置积分</el-button
>
<template #reference>
<el-button type="danger">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
<!-- 配置积分 -->
<addOrUpdate @getList="getList" ref="addOrUpdate"></addOrUpdate>
</div>
</template>
<script>
import addOrUpdate from "./popup/add-or-update.vue";
import { mapState } from "vuex";
export default {
components: {
addOrUpdate,
},
data() {
return {
list: [],
@ -100,6 +115,85 @@ export default {
add() {},
confirmEvent() {},
cancelEvent() {},
getUnitType(type) {
if (type == 1) {
return "市场";
} else if (type == 2) {
return "摊主";
} else if (type == 3) {
return "云店";
}
},
changeState(e) {
if (e.taskEnable) {
this.$confirm("是否要开启此任务, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$api.marketing
.reverseEnable({
id: e.id,
})
.then((res) => {
this.getList();
})
.catch(() => {
this.getList();
});
})
.catch(() => {
this.getList();
});
} else {
this.$confirm("是否要关闭此任务, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$api.marketing
.reverseEnable({
id: e.id,
})
.then((res) => {
this.getList();
})
.catch((err) => {
this.getList();
});
})
.catch(() => {
this.getList();
});
}
},
addTop(e) {
this.$confirm("是否要置顶, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$api.marketing
.integralTop({
id: e.id,
})
.then((res) => {
this.getList();
})
.catch(() => {
this.getList();
});
})
.catch(() => {
this.getList();
});
},
addConfig(e) {
this.$refs.addOrUpdate.toggle(e).add();
},
},
computed: {
...mapState("userData", [

View File

@ -0,0 +1,276 @@
<template>
<div>
<obj-modal
ref="modal"
labelWidth="150px"
:modalCols="modalCols"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<template slot="dialog__after">
<el-form
label-width="150px"
:rules="rules"
:model="modalData"
ref="modalForm"
>
<div style="font-size: 18px; font-weight: 600">每日积分设置</div>
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="连续签到1天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
<el-col :span="6">
<el-form-item label="连续签到2天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
<el-col :span="6">
<el-form-item label="连续签到3天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
<el-col :span="6">
<el-form-item label="连续签到4天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="连续签到5天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
<el-col :span="6">
<el-form-item label="连续签到6天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
<el-col :span="6">
<el-form-item label="连续签到7天" prop="memberPoints">
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number> </el-form-item
></el-col>
</el-row>
<div style="font-size: 18px; font-weight: 600; margin-bottom: 20px">
购买商品积分/成长配置
</div>
<el-form-item
:label="`当前用户成长值为${form.growthValue},修改为`"
prop="growthValue"
>
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.growthValue"
:min="0"
label="请输入"
></el-input-number>
</el-form-item>
<el-form-item
style="margin-top: 20px"
label="请输入确定"
prop="determine"
>
<el-input
style="width: 150px"
v-model="modalData.determine"
label="请输入"
></el-input>
</el-form-item>
</el-form>
</template>
</obj-modal>
</div>
</template>
<script>
import { debounce, cloneDeep } from "lodash";
import { Divider } from "element-ui";
export default {
components: {},
data() {
return {
isAdd: true,
//
modalConfig: {
title: "",
show: false,
width: "700px",
fullscreen: true,
},
modalData: {},
form: {},
rules: {
memberPoints: [
{
required: true,
message: "请输入积分",
trigger: "blur",
},
],
growthValue: [
{
required: true,
message: "请输入成长值",
trigger: "blur",
},
],
determine: [
{
required: true,
message: "请输入确定",
trigger: "blur",
},
{
validator: (rule, value, callback) => {
if (value !== "确定") {
callback(new Error("请输入确定"));
} else {
callback();
}
},
},
],
},
};
},
watch: {
"modalConfig.show"(newVal) {
if (!newVal) {
//
setTimeout(() => {
this.$refs.modalForm.resetFields();
});
}
},
},
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.modalConfig.title = "积分设置";
this.isAdd = true;
},
update: () => {
this.modalConfig.title = "修改成长值";
this.isAdd = false;
},
};
},
init(row) {
console.log(row);
this.modalData = row;
this.form = {
memberPoints: row.memberPoints,
growthValue: row.growthValue,
};
},
},
computed: {
modalCols() {
return [];
},
modalHandles() {
return [
{
label: "取消",
handle: () => {
this.toggle();
},
},
{
label: "确认",
type: "primary",
handle: () => {
console.log(this.modalData);
this.$refs.modalForm.validate((valid) => {
console.log(valid);
if (valid) {
if (this.isAdd) {
this.$api.marketing
.changeMemberPoints({
id: this.modalData.id,
memberPoints: this.modalData.memberPoints,
})
.then((res) => {
this.$emit("queryList");
this.toggle();
});
}
} else {
this.$api.marketing
.changeGrowthValue({
id: this.modalData.id,
growthValue: this.modalData.growthValue,
})
.then((res) => {
this.$emit("queryList");
this.toggle();
});
}
});
},
},
];
},
},
asyncComputed: {},
};
</script>
<style lang="scss" scoped>
</style>

View File

@ -11,100 +11,8 @@
:enableAutoQuery="false"
>
<template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="用户ID">
<el-input
placeholder="请输入用户ID"
v-model="formInline.name"
></el-input>
</el-form-item>
<el-form-item label="用户昵称">
<el-input
placeholder="请输入用户昵称"
v-model="formInline.name"
></el-input>
</el-form-item>
<el-form-item 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 label="手机号">
<el-input
placeholder="请输入手机号"
v-model="formInline.name"
></el-input>
</el-form-item>
<el-form-item 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 label="注册时间">
<el-date-picker
v-model="value1"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item label="生日">
<el-date-picker
v-model="value1"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item 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
@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-form :inline="true" :model="form" class="demo-form-inline">
<el-form-item v-if="storeList.length > 1" label="店铺">
<el-select v-model="formInline.shopId" placeholder="请选择店铺">
<el-option
v-for="item in storeList"
@ -113,34 +21,89 @@
:value="item.shopId"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="用户ID">
<el-input
placeholder="请输入用户ID"
v-model="form.userId"
></el-input>
</el-form-item>
<el-form-item label="用户昵称">
<el-input
placeholder="请输入用户昵称"
v-model="form.username"
></el-input>
</el-form-item>
<el-form-item label="会员等级id">
<el-input
placeholder="请输入会员等级id"
v-model="form.levelId"
></el-input>
</el-form-item>
<el-form-item label="手机号">
<el-input
placeholder="请输入手机号"
v-model="form.mobile"
></el-input>
</el-form-item>
<el-form-item label="会员状态">
<el-select v-model="form.isMemberUser" placeholder="请选择会员状态">
<el-option
v-for="item in [
{ label: '是', value: 1 },
{ label: '否', value: 0 },
]"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="注册时间">
<el-date-picker
@change="changeTime"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="value1"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<!-- <el-form-item label="生日">
<el-date-picker
v-model="value1"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item> -->
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
<el-button type="primary" @click="$refs.oTable.reload()"
>重置</el-button
>
<el-button type="primary" @click="Reset">重置</el-button>
</el-form-item>
</el-form>
</template>
</obj-table-plus>
<!-- 添加或编辑 -->
<!-- <add-or-update
<!-- 修改积分或成长值 -->
<modifyPoints
@queryList="$refs.oTable.reload()"
ref="addOrUpdate"
></add-or-update> -->
ref="modifyPoints"
></modifyPoints>
<!-- 查看详情 -->
<!-- <viewDetails ref="viewDetails"></viewDetails> -->
<viewDetails ref="viewDetails"></viewDetails>
</div>
</template>
<script>
// import AddOrUpdate from "./popup/add-or-update.vue";
// import viewDetails from "./popup/view-details.vue";
import modifyPoints from "./popup/modify-points.vue";
import viewDetails from "./popup/view-details.vue";
import { mapState } from "vuex";
export default {
// components: { AddOrUpdate },
components: { viewDetails, modifyPoints },
data() {
return {
dataList: [],
@ -149,6 +112,7 @@ export default {
shopId: "",
unitType: "",
},
form: {},
tableProp: {
"auto-resize": true,
border: true,
@ -165,30 +129,31 @@ export default {
this.formInline = {
unitType: JSON.parse(sessionStorage.getItem("userInfo")).unitType,
marketId: this.marketId,
shopId: "",
shopId: this.shopId,
};
this.$nextTick(() => {
this.$refs.oTable.reload();
});
},
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();
});
});
},
// 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();
// });
// });
// },
queryList(pageNo, pageSize) {
this.$api.marketing
.marketingUserPage({
pageNumber: pageNo,
pageSize: pageSize,
...this.formInline,
...this.form,
})
.then((res) => {
console.log(res);
@ -201,6 +166,21 @@ export default {
this.$refs.oTable.complete(false);
});
},
Reset() {
this.form = {};
this.$nextTick(() => {
this.$refs.oTable.reload();
});
},
changeTime(val) {
if (val) {
this.form.startRegistrationTime = val[0];
this.form.endRegistrationTime = val[1];
} else {
this.form.startRegistrationTime = "";
this.form.endRegistrationTime = "";
}
},
},
computed: {
tableCols() {
@ -210,81 +190,134 @@ export default {
{
title: "用戶ID",
align: "center",
field: "name",
field: "userId",
},
{
title: "用戶头像",
align: "center",
field: "publisher",
field: "headUrl",
type: "jsx",
render: ({ row }) => {
if (row.publisher === "MERCHANT") {
return <span>店铺</span>;
} else if (row.publisher == "PLATFORM") {
return <span>平台</span>;
}
return (
<el-image
style="width: 60px; height: 60px"
src={row.headUrl}
preview-src-list={[row.headUrl]}
></el-image>
);
},
},
{
title: "用戶昵称",
align: "center",
field: "name",
field: "username",
},
{
title: "手机号",
align: "center",
field: "name",
field: "mobile",
},
// {
// title: "",
// align: "center",
// field: "name",
// },
// {
// title: "",
// align: "center",
// field: "name",
// },
// {
// title: "",
// align: "center",
// field: "name",
// },
{
title: "会员等级id",
align: "center",
field: "levelId",
},
{
title: "进行中订单数",
title: "会员等级名称",
align: "center",
field: "name",
},
{
title: "完成订单数",
align: "center",
field: "name",
},
{
title: "消费金额(元)",
align: "center",
field: "name",
},
{
title: "会员等级",
align: "center",
field: "money",
field: "levelName",
},
{
title: "生日",
align: "center",
field: "discount",
field: "birthday",
},
{
title: "注册时间",
align: "center",
field: "minPrice",
},
{
title: "限量",
align: "center",
field: "limitedNum",
field: "registrationTime",
},
// {
// title: "",
// align: "center",
// field: "limitedNum",
// },
{
title: "操作",
fixed: "right",
type: "jsx",
align: "center",
width: "140px",
render: (row) => {
let edit = () => {
// this.$refs.viewDetails.toggle(row).update();
width: "280px",
render: ({ row }) => {
let viewDetails = () => {
this.$api.marketing
.memberUnitUserDetail({
...this.formInline,
userId: row.userId,
})
.then((res) => {
console.log(res);
this.$refs.viewDetails.toggle(res.data.data).add();
});
};
let points = () => {
this.$api.marketing
.memberUnitUserDetail({
...this.formInline,
userId: row.userId,
})
.then((res) => {
console.log(res);
this.$refs.modifyPoints.toggle(res.data.data).add();
});
};
let growthValue = () => {
this.$api.marketing
.memberUnitUserDetail({
...this.formInline,
userId: row.userId,
})
.then((res) => {
console.log(res);
this.$refs.modifyPoints.toggle(res.data.data).update();
});
};
return (
<div>
<el-button size="mini" type="primary" onClick={edit}>
<el-button size="mini" type="primary" onClick={viewDetails}>
详情
</el-button>
<el-button
v-show={!row.id}
size="mini"
type="primary"
onClick={points}
>
修改积分
</el-button>
<el-button
v-show={!row.id}
size="mini"
type="primary"
onClick={growthValue}
>
修改成长值
</el-button>
</div>
);
},

View File

@ -0,0 +1,219 @@
<template>
<div>
<obj-modal
ref="modal"
labelWidth="150px"
:modalCols="modalCols"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<template slot="dialog__after">
<el-form
label-width="210px"
:rules="rules"
:model="modalData"
ref="modalForm"
>
<el-form-item
v-if="isAdd"
:label="`当前用户剩余积分${form.memberPoints},修改为`"
prop="memberPoints"
>
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.memberPoints"
:min="0"
label="请输入"
></el-input-number>
</el-form-item>
<el-alert
v-if="isAdd"
title="该操作无法撤回,请输入”确定“并提交,提交后会发送系统通知,通知该用户积分发生变化 "
:closable="false"
type="error"
>
</el-alert>
<el-form-item
v-if="!isAdd"
:label="`当前用户成长值为${form.growthValue},修改为`"
prop="growthValue"
>
<el-input-number
style="width: 150px"
controls-position="right"
:precision="0"
v-model="modalData.growthValue"
:min="0"
label="请输入"
></el-input-number>
</el-form-item>
<el-alert
v-if="!isAdd"
title="该操作无法撤回,请输入”确定“并提交,提交后会发送系统通知,通知该用户成长值发生变化 "
:closable="false"
type="error"
>
</el-alert>
<el-form-item
style="margin-top: 20px"
label="请输入确定"
prop="determine"
>
<el-input
style="width: 150px"
v-model="modalData.determine"
label="请输入"
></el-input>
</el-form-item>
</el-form>
</template>
</obj-modal>
</div>
</template>
<script>
import { debounce, cloneDeep } from "lodash";
import { Divider } from "element-ui";
export default {
components: {},
data() {
return {
isAdd: true,
//
modalConfig: {
title: "",
show: false,
width: "700px",
},
modalData: {},
form: {},
rules: {
memberPoints: [
{
required: true,
message: "请输入积分",
trigger: "blur",
},
],
growthValue: [
{
required: true,
message: "请输入成长值",
trigger: "blur",
},
],
determine: [
{
required: true,
message: "请输入确定",
trigger: "blur",
},
{
validator: (rule, value, callback) => {
if (value !== "确定") {
callback(new Error("请输入确定"));
} else {
callback();
}
},
},
],
},
};
},
watch: {
"modalConfig.show"(newVal) {
if (!newVal) {
//
setTimeout(() => {
this.$refs.modalForm.resetFields();
});
}
},
},
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.modalConfig.title = "修改积分";
this.isAdd = true;
},
update: () => {
this.modalConfig.title = "修改成长值";
this.isAdd = false;
},
};
},
init(row) {
console.log(row);
this.modalData = row;
this.form = {
memberPoints: row.memberPoints,
growthValue: row.growthValue,
};
},
},
computed: {
modalCols() {
return [];
},
modalHandles() {
return [
{
label: "取消",
handle: () => {
this.toggle();
},
},
{
label: "确认",
type: "primary",
handle: () => {
console.log(this.modalData);
this.$refs.modalForm.validate((valid) => {
console.log(valid);
if (valid) {
if (this.isAdd) {
this.$api.marketing
.changeMemberPoints({
id: this.modalData.id,
memberPoints: this.modalData.memberPoints,
})
.then((res) => {
this.$emit("queryList");
this.toggle();
});
}
} else {
this.$api.marketing
.changeGrowthValue({
id: this.modalData.id,
growthValue: this.modalData.growthValue,
})
.then((res) => {
this.$emit("queryList");
this.toggle();
});
}
});
},
},
];
},
},
asyncComputed: {},
};
</script>
<style lang="scss" scoped>
</style>

View File

@ -0,0 +1,141 @@
<template>
<div>
<obj-modal
ref="modal"
labelWidth="150px"
:modalCols="modalCols"
:modalConfig="modalConfig"
:modalData="modalData"
:modalHandles="modalHandles"
>
<template slot="dialog__after">
<div style="padding: 20px">
<el-descriptions title="用户信息">
<el-descriptions-item label="头像">
<el-image
style="width: 60px; height: 60px"
:src="modalData.headUrl"
:preview-src-list="[modalData.headUrl]"
>
</el-image>
</el-descriptions-item>
<el-descriptions-item label="用户名">{{
modalData.username
}}</el-descriptions-item>
<el-descriptions-item label="ID">{{
modalData.userId
}}</el-descriptions-item>
<el-descriptions-item label="手机号">{{
modalData.mobile
}}</el-descriptions-item>
<!-- <el-descriptions-item label=""
>江苏省苏州市吴中区吴中大道 1188 </el-descriptions-item
> -->
</el-descriptions>
</div>
<div
v-if="modalData.id"
style="margin-top: 20px; border-top: 1px solid #ccc; padding: 20px"
>
<el-descriptions title="会员信息">
<el-descriptions-item label="会员名称">{{
modalData.levelName
}}</el-descriptions-item>
<el-descriptions-item label="生日">{{
modalData.birthday
}}</el-descriptions-item>
<el-descriptions-item label="加入会员时间">{{
modalData.joinTime
}}</el-descriptions-item>
</el-descriptions>
</div>
</template>
</obj-modal>
</div>
</template>
<script>
import { debounce, cloneDeep } from "lodash";
import { Divider } from "element-ui";
export default {
components: {},
data() {
return {
isAdd: true,
//
modalConfig: {
title: "用户详情",
show: false,
width: "60%",
},
modalData: {},
};
},
watch: {
"modalConfig.show"(newVal) {
if (newVal) {
//
setTimeout(() => {
this.$refs.modal.resetFields();
});
}
},
},
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: () => {
this.modalConfig.title = "用户详情";
this.isAdd = true;
},
update: () => {
this.isAdd = false;
},
};
},
init(row) {
this.modalData = row;
},
},
computed: {
modalCols() {
return [];
},
modalHandles() {
return [
{
label: "取消",
handle: () => {
this.toggle();
},
},
{
label: this.isAdd ? "确认添加" : "确认",
type: "primary",
loading: this.isLoading,
submit: true,
handle: () => {
console.log(JSON.parse(JSON.stringify(this.modalData)));
this.$emit(
"addCouponData",
JSON.parse(JSON.stringify(this.modalData))
);
this.toggle();
},
},
];
},
},
asyncComputed: {},
};
</script>
<style lang="scss" scoped>
</style>