Merge branch 'master' of http://122.51.230.86:3000/dianliang/lanan-system-vue
This commit is contained in:
commit
c99a04622e
@ -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'
|
||||
})
|
||||
}
|
||||
|
@ -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
222
src/views/base/customer/ReceiveCouponForm.vue
Normal 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
167
src/views/base/customer/RuchForm.vue
Normal 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>
|
Loading…
Reference in New Issue
Block a user