dianliang/lanan-system-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
PQZ 2024-09-21 13:59:25 +08:00
parent b46a55cbfd
commit 380e4e3c1d
4 changed files with 649 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
src/api/member/active/index.js
View File

@ -1,53 +1,62 @@
import request from '@/utils/request'
// 创建营销活动
export function createActiveMain(data) {
return request({
url: '/member/active-main/create',
method: 'post',
data: data
})
}
// 更新营销活动
export function updateActiveMain(data) {
return request({
url: '/member/active-main/update',
method: 'put',
data: data
})
}
// 删除营销活动
export function deleteActiveMain(id) {
return request({
url: '/member/active-main/delete?id=' + id,
method: 'delete'
})
}
// 获得营销活动
export function getActiveMain(id) {
return request({
url: '/member/active-main/get?id=' + id,
method: 'get'
})
}
// 获得营销活动分页
export function getActiveMainPage(params) {
return request({
url: '/member/active-main/page',
method: 'get',
params
})
}
// 导出营销活动 Excel
export function exportActiveMainExcel(params) {
return request({
url: '/member/active-main/export-excel',
method: 'get',
params,
responseType: 'blob'
})
}
import request from '@/utils/request'
// 创建营销活动
export function createActiveMain(data) {
return request({
url: '/member/active-main/create',
method: 'post',
data: data
})
}
// 参加营销活动
export function attendActive(data) {
return request({
url: '/base/customer-active/attendActive',
method: 'post',
data: data
})
}
// 更新营销活动
export function updateActiveMain(data) {
return request({
url: '/member/active-main/update',
method: 'put',
data: data
})
}
// 删除营销活动
export function deleteActiveMain(id) {
return request({
url: '/member/active-main/delete?id=' + id,
method: 'delete'
})
}
// 获得营销活动
export function getActiveMain(id) {
return request({
url: '/member/active-main/get?id=' + id,
method: 'get'
})
}
// 获得营销活动分页
export function getActiveMainPage(params) {
return request({
url: '/member/active-main/page',
method: 'get',
params
})
}
// 导出营销活动 Excel
export function exportActiveMainExcel(params) {
return request({
url: '/member/active-main/export-excel',
method: 'get',
params,
responseType: 'blob'
})
}

300
src/views/base/customer/CustomerMember.vue
View File

@ -1,119 +1,172 @@
<template>
<div>
<!-- 会员信息 -->
<el-card class="box-card">
<div slot="header" class="clearfix">
<span style="font-weight: bold">{{ formData.levelName }}</span>
</div>
<!--客户基本信息-->
<el-descriptions class="margin-top" :column="3" border>
<el-descriptions-item>
<template slot="label">
会员名称
</template>
{{ formData.cusName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
性别
</template>
<dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
联系方式
</template>
{{ formData.phoneNumber }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
生日
</template>
{{ parseTime(formData.birthday, '{y}-{m}-{d}') }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
客户来源
</template>
<dict-tag :type="DICT_TYPE.DICT_CUS_DATA_FROM" :value="formData.dataFrom"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
最近办理业务
</template>
<dict-tag :type="DICT_TYPE.DICT_CUS_BUSI_TYPE" :value="formData.nearDoContent"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
联系地址
</template>
{{ formData.address }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
绑定车辆
</template>
<template v-for="item in formData.carList">
<el-popover
placement="top-start"
width="200"
trigger="hover"
:content="item.licenseNumber">
<el-tag
style="margin-left: 5px"
:key="item.id"
slot="reference">
{{ item.brandStr }}({{ item.modelStr }})
</el-tag>
</el-popover>
</template>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
会员标签
</template>
<template v-for="item in formData.labelList">
<el-popover
placement="top-start"
width="200"
trigger="hover"
:content="item.labelContent">
<el-tag
style="margin-left: 5px"
:key="item.id"
slot="reference"
:type="item.labelType">
{{ item.labelName }}
</el-tag>
</el-popover>
</template>
</el-descriptions-item>
</el-descriptions>
</el-card>
<!-- 余额卡券 -->
<el-row >
<el-col :span="8">
<el-card class="box-card">
<el-row>
<el-col :span="18">
<el-card style="height: 165px; overflow: hidden;" >
<div slot="header" class="clearfix">
<span style="font-weight: bold">余额/积分</span>
<span style="font-weight: bold; font-size: 16px;">{{ formData.levelName }}</span>
</div>
<!--客户基本信息-->
<el-descriptions size="mini" class="margin-top" :column="3" border>
<el-descriptions-item>
<template slot="label">
会员名称
</template>
{{ formData.cusName }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
性别
</template>
<dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
联系方式
</template>
{{ formData.phoneNumber }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
生日
</template>
{{ parseTime(formData.birthday, '{y}-{m}-{d}') }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
客户来源
</template>
<dict-tag :type="DICT_TYPE.DICT_CUS_DATA_FROM" :value="formData.dataFrom"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
最近办理业务
</template>
<dict-tag :type="DICT_TYPE.DICT_CUS_BUSI_TYPE" :value="formData.nearDoContent"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
联系地址
</template>
{{ formData.address }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
会员标签
</template>
<template v-for="item in formData.labelList">
<el-popover
placement="top-start"
width="200"
trigger="hover"
:content="item.labelContent">
<el-tag
style="margin-left: 5px"
:key="item.id"
slot="reference"
:type="item.labelType">
{{ item.labelName }}
</el-tag>
</el-popover>
</template>
</el-descriptions-item>
</el-descriptions>
</el-card>
</el-col>
<el-col :span="6">
<el-card style="height: 165px; overflow: hidden;" >
<div slot="header" class="clearfix">
<span style="font-weight: bold; font-size: 16px;">余额/积分</span>
</div>
<div class="card-content">
<span class="balance-label">余额：</span>
<span class="balance-value">{{ formData.balance }}</span>
<br />
<span class="balance-label">累计充值：</span>
<span class="balance-value">{{ formData.allBalance }}</span>
</div>
</el-card>
</el-col>
</el-row>
<!-- 余额卡券 -->
<el-row >
<el-col :span="16">
<el-card class="box-card">
<el-card style="height: 260px; overflow: hidden;" >
<div slot="header" class="clearfix">
<span style="font-weight: bold">卡券</span>
<span style="font-weight: bold; font-size: 16px;"> 会员卡券</span>
</div>
<el-table
:data="formData.couponList"
border
size="mini"
height="200"
style="width: 100%">
<el-table-column show-overflow-tooltip prop="couponName" label="卡券名称" >
</el-table-column>
<el-table-column label="卡券类型" width="80" align="left" prop="couponType">
<template v-slot="scope">
<dict-tag :type="DICT_TYPE.MEMBER_COUPON_TYPE" :value="scope.row.couponType"/>
</template>
</el-table-column>
<el-table-column label="适用车型" width="130" align="center" prop="carModel">
<template v-slot="scope">
<span v-if="scope.row.carModel == null">不限</span>
<dict-tag :type="DICT_TYPE.MEMBER_CAR" :value="scope.row.carModel"/>
</template>
</el-table-column>
<el-table-column label="核销规则" width="100" align="center" prop="outRule">
<template v-slot="scope">
<dict-tag :type="DICT_TYPE.MEMBER_COUPON_OUT_RULE" :value="scope.row.outRule"/>
</template>
</el-table-column>
<el-table-column label="开始有效期" align="center" prop="beginTime" width="150">
<template v-slot="scope">
<span>{{ parseTime(scope.row.beginTime) }}</span>
</template>
</el-table-column>
<el-table-column label="结束有效期" align="center" prop="endTime" width="150">
<template v-slot="scope">
<span>{{ parseTime(scope.row.endTime) }}</span>
</template>
</el-table-column>
<el-table-column label="领取时间" align="center" prop="createTime" width="150">
<template v-slot="scope">
<span>{{ parseTime(scope.row.createTime) }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="110" align="center" class-name="small-padding fixed-width">
<template v-slot="scope">
<el-button size="mini" type="text" icon="el-icon-goods" @click="openChildForm(scope.row.id)">核销</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
</el-col>
<el-col :span="8">
<el-card style="height: 260px; overflow: hidden;" >
<div slot="header" class="clearfix">
<span style="font-weight: bold; font-size: 16px;"> 会员车辆</span>
</div>
<template v-for="item in formData.carList">
<el-descriptions direction="vertical" :column="3" :title="item.modelStr+'('+item.licenseNumber+')'">
<el-descriptions-item label="下次保养时间">{{ parseTime(item.nextMaintenanceDate, '{y}-{m}-{d}') }}</el-descriptions-item>
<el-descriptions-item label="下次年检时间">{{ parseTime(item.nextInspectionDate, '{y}-{m}-{d}') }}</el-descriptions-item>
<el-descriptions-item label="保险到期时间">{{ parseTime(item.insuranceExpiryDate, '{y}-{m}-{d}') }}</el-descriptions-item>
</el-descriptions>
</template>
</el-card>
</el-col>
</el-row>
<!-- 可参与活动 -->
<el-card class="box-card">
<div slot="header" class="clearfix">
<span style="font-weight: bold">可参与活动</span>
<span style="font-weight: bold; font-size: 16px;">可参与活动</span>
</div>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table size="mini" height="200" v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column width="100" label="活动名称" align="left" prop="name"/>
<el-table-column label="活动描述" show-overflow-tooltip align="left" prop="remark"/>
<el-table-column label="活动开始时间" align="center" prop="beginTime" width="150">
@ -128,9 +181,7 @@
</el-table-column>
<el-table-column width="100" label="操作" align="center" class-name="small-padding fixed-width">
<template v-slot="scope">
<el-button size="mini" type="text" icon="el-icon-delete"
v-hasPermi="['member:active-main:delete']">删除
</el-button>
<el-button size="mini" type="text" icon="el-icon-present" @click="openActive(scope.row)">参与活动</el-button>
</template>
</el-table-column>
</el-table>
@ -138,6 +189,8 @@
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getActiveList"/>
</el-card>
<ReceiveCouponForm @success="getById(param.id)" ref="receiveCouponForm"/>
<RuchForm @success="getById(param.id)" ref="RuchFormRef"/>
</div>
</template>
@ -145,8 +198,11 @@
<script>
import * as CustomerMainApi from '@/api/base/customer';
import * as ActiveMainApi from '@/api/member/active';
import ReceiveCouponForm from '@/views/base/customer/ReceiveCouponForm.vue'
import RuchForm from '@/views/base/customer/RuchForm.vue'
export default {
name: "CustomerMember",
components: {ReceiveCouponForm,RuchForm},
data() {
return {
//列表传入数据
@ -191,11 +247,51 @@ export default {
this.loading = false;
}
},
/**参与活动*/
async openActive(row){
if (row.isCoupon == '1' && row.isRechRule == '0'){
this.$refs["receiveCouponForm"].open(row.id,this.param);
}
if (row.isRechRule == '1'){
this.$refs["RuchFormRef"].open(row.id,this.param);
}
}
}
}
</script>
<style scoped>
.el-card_body {
padding: 5px 5px 5px 5px;
}
.custom-card {
height: 165px;
overflow: hidden;
border-radius: 10px; /* 圆角 */
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 阴影 */
padding: 15px; /* 内边距 */
}
.card-header {
margin-bottom: 10px; /* 头部和内容之间的间距 */
}
.card-content {
font-size: 25px; /* 内容的字体大小 */
}
.balance-label {
font-weight: bold; /* 标签字体加粗 */
}
.balance-value {
color: #f50a1d; /* 自定义颜色，例如 Element 的主色 */
font-weight: normal; /* 余额的显示要求正常 */
}
.el-card.is-always-shadow{
-webkit-box-shadow:none;
box-shadow:none;
border-radius: 0;
}
</style>

222
src/views/base/customer/ReceiveCouponForm.vue Normal file
View File

@ -0,0 +1,222 @@
<template>
<div class="app-container">
<!-- 对话框(添加 / 修改) -->
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" v-dialogDrag append-to-body>
<el-collapse v-model="activeNames">
<!-- 供应商基本信息 -->
<el-collapse-item name="1">
<template slot="title">
<div style="font-weight: bold">活动内容</div>
</template>
<el-descriptions class="margin-top" :column="2" border>
<el-descriptions-item>
<template slot="label">
活动名称
</template>
{{ formData.name }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
活动类型
</template>
<dict-tag :type="DICT_TYPE.MEMBER_ACTIVE" :value="formData.type"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
开始时间
</template>
{{ parseTime(formData.beginTime) }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
结束时间
</template>
{{ parseTime(formData.endTime) }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
活动内容
</template>
{{ formData.remark }}
</el-descriptions-item>
</el-descriptions>
</el-collapse-item>
<el-collapse-item title="关联卡券" name="2">
<template slot="title">
<div style="font-weight: bold">关联卡券</div>
</template>
<el-table
ref="multipleTable"
show-overflow-tooltip
@select="selectRow"
@select-all="handleSelectAll"
height="250" :data="formData.couponList" border size="small" style="width: 100%">
<el-table-column
v-if="formData.isPack == '0'"
type="selection"
width="55">
</el-table-column>
<el-table-column label="卡券名称" width="250" align="left" prop="name"/>
<el-table-column label="卡券类型" width="80" align="left" prop="type">
<template v-slot="scope">
<dict-tag :type="DICT_TYPE.MEMBER_COUPON_TYPE" :value="scope.row.type"/>
</template>
</el-table-column>
<el-table-column label="开始有效期" align="center" prop="beginTime" width="150">
<template v-slot="scope">
<span>{{ parseTime(scope.row.beginTime) }}</span>
</template>
</el-table-column>
<el-table-column label="结束有效期" align="center" prop="endTime" width="150">
<template v-slot="scope">
<span>{{ parseTime(scope.row.endTime) }}</span>
</template>
</el-table-column>
<el-table-column label="面额" width="100" align="right" prop="amount"/>
<el-table-column label="备注" show-overflow-tooltip align="left" prop="remark"/>
</el-table>
</el-collapse-item>
</el-collapse>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="formLoading">领 取</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import * as ActiveMainApi from '@/api/member/active';
export default {
name: "ActiveRuleCouponForm",
components: {},
data() {
return {
// 弹出层标题
dialogTitle: "",
// 是否显示弹出层
dialogVisible: false,
// 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
formLoading: false,
//折叠面板默认展开
activeNames: ['1', '2'],
// 表单参数
formData: {
id: undefined,
name: undefined,
type: undefined,
beginTime: undefined,
endTime: undefined,
remark: undefined,
couponList: []
},
// 表单校验
formRules: {},
//客户数据
cusRow:{},
//全选
multipleSelection:[]
};
},
methods: {
/** 打开弹窗 */
async open(id,cusRow) {
this.dialogVisible = true;
this.cusRow = cusRow
this.reset();
// 修改时，设置数据
if (id) {
this.formLoading = true;
try {
const res = await ActiveMainApi.getActiveMain(id);
this.formData = res.data;
this.title = "参加活动";
} finally {
this.formLoading = false;
}
}
this.title = "参加活动";
},
/**选中*/
selectRow(val,row){
//当前点击是否勾选
let selectBool = val.length && val.indexOf(row) !== -1
if(!selectBool){
//取消勾选
this.multipleSelection.forEach((item,i) => {
if(item.id == row.id){
this.multipleSelection.splice(i,1)
}
})
}else{
//选中
this.multipleSelection.push(row)
}
},
/**全选*/
handleSelectAll(val){
if(val.length == this.list.length){ //全选
this.multipleSelection = this.multipleSelection.concat(val)
//去重
let obj = {}
let result = []
this.multipleSelection.forEach(item => {
if(!obj[item.id]){
result.push(item)
obj[item.id] = true
}
})
this.multipleSelection = result
}else{ //取消全选
this.list.forEach(item => {
this.multipleSelection.forEach((multItem,i) => {
if(item.id == multItem.id){
this.multipleSelection.splice(i,1)
}
})
})
}
},
/** 提交按钮 */
async submitForm() {
// 校验主表
this.formLoading = true;
try {
const data = {
cusId:this.cusRow.id,
activeId:this.formData.id,
selectCoupon:this.multipleSelection
}
await ActiveMainApi.attendActive(data);
this.$modal.msgSuccess("参与成功");
this.dialogVisible = false
this.$emit('success');
} finally {
this.formLoading = false;
}
},
/** 表单重置 */
reset() {
this.formData = {
id: undefined,
name: undefined,
type: undefined,
beginTime: undefined,
endTime: undefined,
remark: undefined,
couponList: []
};
}
}
};
</script>

167
src/views/base/customer/RuchForm.vue Normal file
View File

@ -0,0 +1,167 @@
<template>
<div class="app-container">
<!-- 对话框(添加 / 修改) -->
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" v-dialogDrag append-to-body>
<span style="color: red">请输入充值金额：</span><el-input-number v-model="topUpAmount" :precision="2" ></el-input-number>
<el-collapse v-model="activeNames">
<!-- 供应商基本信息 -->
<el-collapse-item name="1">
<template slot="title">
<div style="font-weight: bold">活动内容</div>
</template>
<el-descriptions class="margin-top" :column="2" border>
<el-descriptions-item>
<template slot="label">
活动名称
</template>
{{ formData.name }}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
活动类型
</template>
<dict-tag :type="DICT_TYPE.MEMBER_ACTIVE" :value="formData.type"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
开始时间
</template>
{{parseTime(formData.beginTime)}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
结束时间
</template>
{{parseTime(formData.endTime)}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
活动内容
</template>
{{formData.remark}}
</el-descriptions-item>
</el-descriptions>
</el-collapse-item>
<el-collapse-item title="充值规则" name="2">
<template slot="title">
<div style="font-weight: bold">充值规则</div>
</template>
<el-table :data="formData.ruleList" border size="small" style="width: 100%">
<el-table-column label="名称" prop="name" align="left"/>
<el-table-column label="充值金额" prop="rechAmount" align="right"/>
<el-table-column label="赠送金额" prop="giveAmount" align="right"/>
</el-table>
</el-collapse-item>
</el-collapse>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import * as ActiveMainApi from '@/api/member/active';
export default {
name: "ActiveRuleForm",
components: {},
data() {
return {
// 弹出层标题
dialogTitle: "",
// 是否显示弹出层
dialogVisible: false,
// 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
formLoading: false,
//折叠面板默认展开
activeNames: ['1', '2'],
topUpAmount:0.00,
// 表单参数
formData: {
id: undefined,
name: undefined,
type: undefined,
beginTime: undefined,
endTime: undefined,
remark: undefined,
ruleList: [{
name:'',
rechAmount: '',
giveAmount: '',
}],
},
//客户数据
cusRow:{},
// 表单校验
formRules: {},
};
},
methods: {
/** 打开弹窗 */
async open(id,cusRow) {
this.dialogVisible = true;
this.cusRow = cusRow
this.reset();
// 修改时，设置数据
if (id) {
this.formLoading = true;
try {
const res = await ActiveMainApi.getActiveMain(id);
this.formData = res.data;
this.title = "参加活动";
} finally {
this.formLoading = false;
}
}
this.title = "参加活动";
},
/** 提交按钮 */
async submitForm() {
// 校验主表
this.formLoading = true;
try {
const data = {
cusId:this.cusRow.id,
activeId:this.formData.id,
topUpAmount:this.topUpAmount
}
await ActiveMainApi.attendActive(data);
this.$modal.msgSuccess("参与成功");
this.dialogVisible = false
this.$emit('success');
} finally {
this.formLoading = false;
}
},
/** 表单重置 */
reset() {
this.formData = {
id: undefined,
name: undefined,
type: undefined,
beginTime: undefined,
endTime: undefined,
remark: undefined,
ruleList: [{
name:'',
rechAmount: '',
giveAmount: '',
}],
};
}
}
};
</script>