oil-station/fuintAdmin/src/views/member/manage.vue

1181 lines
42 KiB
Vue
Raw Normal View History

2024-08-16 18:26:19 +08:00
<template>
<div class="content">
<div class="tab-box">
<div class="tab_" :class="{active:index== tabindex }" @click="getindex(index)" v-for="(item,index) in tabs"
:key="index">
{{ item.name }}
</div>
</div>
<div class="cot-box" v-if="tabindex==0">
<div>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="120px">
<el-form-item label="" prop="groupName" style="width: 180px">
<el-input
v-model="queryParams.groupName"
placeholder="请输入分组名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="">
<el-date-picker
v-model="beginTime"
style="width: 160px"
type="date"
placeholder="开始日期">
</el-date-picker>
<el-date-picker
v-model="endTime"
style="width: 160px"
type="date"
placeholder="结束日期">
</el-date-picker>
</el-form-item>
2024-10-23 08:52:43 +08:00
<el-form-item style="float: right;margin-right: 0px">
2024-08-16 18:26:19 +08:00
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
<el-button type="primary" @click="handleAdd">新增分组</el-button>
</el-form-item>
</el-form>
</div>
<!-- -->
2024-10-23 08:52:43 +08:00
<div style="height: 72vh;overflow: auto">
2024-08-16 18:26:19 +08:00
<el-table
:data="userGroupList"
border
style="width: 100%">
<el-table-column type="index" width="50" align="center" label="序号"/>
2024-08-27 10:18:27 +08:00
<el-table-column prop="groupName" align="center" label="分组名称" width="180">
<template slot-scope="scope">
<span>{{ scope.row.groupName || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="remark" align="center" label="备注" width="180">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.remark || "--" }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="userNum" align="center" label="会员数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
2024-08-27 10:18:27 +08:00
<span>{{ scope.row.userNum || 0 }}</span>
2024-08-16 18:26:19 +08:00
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="userProportion" align="center" label="会员占比">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
2024-08-27 10:18:27 +08:00
<span>{{ scope.row.userProportion || 0 }}%</span>
2024-08-16 18:26:19 +08:00
</template>
</el-table-column>
<el-table-column align="center" prop="status" label="状态">
<template slot-scope="scope">
<el-switch
v-model="scope.row.status"
active-value="qy"
inactive-value="jy"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="accountName" align="center" label="创建人">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.accountName || "--" }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="createTime" align="center" label="创建时间">
<template slot-scope="scope">
<span>{{ scope.row.createTime || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="updateTime" align="center" label="更新时间">
<template slot-scope="scope">
<span>{{ scope.row.updateTime || "--" }}</span>
</template>
</el-table-column>
2024-08-16 18:26:19 +08:00
<el-table-column align="center" label="操作" width="120">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
@click="handleUpdate(scope.row)"
>修改
</el-button>
<el-button
size="mini"
type="text"
@click="handleDelete(scope.row)"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
2024-10-23 08:52:43 +08:00
2024-08-16 18:26:19 +08:00
</div>
<div class="cot-box" v-if="tabindex==1">
<div>
<el-form :model="queryParams1" ref="queryForm" size="small" :inline="true" label-width="120px">
<el-form-item label="" prop="name" style="width: 180px">
<el-input
v-model="queryParams1.name"
placeholder="请输入活动名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="">
<el-date-picker
v-model="beginTime1"
style="width: 160px"
type="date"
placeholder="开始日期">
</el-date-picker>
<el-date-picker
v-model="endTime1"
style="width: 160px"
type="date"
placeholder="结束日期">
</el-date-picker>
</el-form-item>
2024-10-23 08:52:43 +08:00
<el-form-item style="float: right;margin-right: 0px">
2024-08-16 18:26:19 +08:00
<el-button type="primary" icon="el-icon-search" @click="handleQuery1">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery1">重置</el-button>
<el-button type="primary" @click="handleAdd1">新增定时群发</el-button>
</el-form-item>
</el-form>
</div>
<!-- -->
2024-10-23 08:52:43 +08:00
<div style="height: 72vh;overflow: auto">
2024-08-16 18:26:19 +08:00
<el-table
:data="massSendList"
border
style="width: 100%">
<el-table-column type="index" width="50" align="center" label="序号"/>
2024-08-27 10:18:27 +08:00
<el-table-column prop="name" align="center" label="活动名称" width="180">
<template slot-scope="scope">
<span>{{ scope.row.name || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="activityTimeType" align="center" label="活动时间" width="190">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span v-if="scope.row.activityTimeType==0">永久有效</span>
<span v-else>{{ scope.row.activityTimeFront }} ~ {{ scope.row.activityTimeAfter }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="sendFrequency" align="center" label="发送频次">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span v-if="scope.row.sendFrequency==0">每天一次</span>
<span v-if="scope.row.sendFrequency==1">周固定时间</span>
<span v-if="scope.row.sendFrequency==2">月固定时间</span>
<span v-if="scope.row.sendFrequency==3">法定节日时间</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="sendUserNum" align="center" label="群发会员">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.sendUserNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="senfGift" align="center" label="群发礼品">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.senfGift || "--" }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="status" align="center" label="活动状态">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<div v-if="scope.row.status == 0" style="color: #FF7E00">未开始</div>
<div v-if="scope.row.status == 1" style="color: #00CAFF">进行中</div>
<div v-if="scope.row.status == 2" style="color: #0DC291">已结束</div>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="accountName" align="center" label="创建人">
<template slot-scope="scope">
<span>{{ scope.row.accountName || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="createTime" align="center" label="创建时间">
<template slot-scope="scope">
<span>{{ scope.row.createTime || "--" }}</span>
</template>
</el-table-column>
2024-08-16 18:26:19 +08:00
<el-table-column align="center" label="操作" width="120">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
v-if="scope.row.status == 0"
@click="handleUpdate1(scope.row)"
>修改
</el-button>
<el-button
size="mini"
type="text"
@click="handleDelete1(scope.row)"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total1>0"
:total="total1"
:page.sync="queryParams1.page"
:limit.sync="queryParams1.pageSize"
@pagination="getList1"
/>
</div>
<div class="cot-box" v-if="tabindex==2">
<div>
<el-form :model="queryParams2" ref="queryForm" size="small" :inline="true" label-width="120px">
2024-10-24 14:20:20 +08:00
<el-form-item label="" prop="groupName" style="width: 180px">
<el-input placeholder="请输入活动名称" v-model="queryParams.tableName"/>
</el-form-item>
2024-08-16 18:26:19 +08:00
<el-form-item label="" prop="groupName" style="width: 180px">
2024-10-24 14:20:20 +08:00
<el-select v-model="queryParams2.status" placeholder="请选择状态">
2024-08-16 18:26:19 +08:00
<el-option label="已发送" value="0"></el-option>
<el-option label="发送失败" value="1"></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-date-picker
v-model="beginTime2"
style="width: 160px"
type="date"
placeholder="开始日期">
</el-date-picker>
<el-date-picker
v-model="endTime2"
style="width: 160px"
type="date"
placeholder="结束日期">
</el-date-picker>
</el-form-item>
2024-10-23 08:52:43 +08:00
<el-form-item style="float: right;margin-right: 0px">
2024-08-16 18:26:19 +08:00
<el-button type="primary" icon="el-icon-search" @click="handleQuery2">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery2">重置</el-button>
</el-form-item>
</el-form>
</div>
<!-- -->
2024-10-23 08:52:43 +08:00
<div style="height: 72vh;overflow: auto">
2024-08-16 18:26:19 +08:00
<el-table
:data="massSendRecordList"
border
style="width: 100%">
<el-table-column type="index" width="50" align="center" label="序号"/>
2024-08-27 10:18:27 +08:00
<el-table-column prop="activityName" align="center" label="活动名称" width="180">
<template slot-scope="scope">
<span>{{ scope.row.activityName || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="sendGift" align="center" label="群发礼品">
<template slot-scope="scope">
<span>{{ scope.row.sendGift || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="sendWay" align="center" label="群发方式">
<template slot-scope="scope">
<span>{{ scope.row.sendWay || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="massContent" align="center" label="群发内容" width="220">
<template slot-scope="scope">
<span>{{ scope.row.massContent || "--" }}</span>
</template>
</el-table-column>
2024-08-16 18:26:19 +08:00
2024-08-27 10:18:27 +08:00
<el-table-column prop="userNum" align="center" label="群发会员数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.userNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="successNum" align="center" label="成功数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.successNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="failNum" align="center" label="失败数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.failNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="status" align="center" label="状态">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<div v-if="scope.row.status == 0" style="color: #0DC291">已发送</div>
<div v-if="scope.row.status == 1" style="color: #F44522">发送失败</div>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="address" align="center" label="已领取数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.userNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="address" align="center" label="已核销数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.userNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="address" align="center" label="未核销数量">
2024-08-16 18:26:19 +08:00
<template slot-scope="scope">
<span>{{ scope.row.userNum || 0 }}</span>
</template>
</el-table-column>
2024-08-27 10:18:27 +08:00
<el-table-column prop="accountName" align="center" label="操作人员">
<template slot-scope="scope">
<span>{{ scope.row.accountName || "--" }}</span>
</template>
</el-table-column>
<el-table-column prop="createTime" align="center" label="群发时间" width="160">
<template slot-scope="scope">
<span>{{ scope.row.createTime || "--" }}</span>
</template>
</el-table-column>
2024-08-16 18:26:19 +08:00
<el-table-column align="center" label="操作" width="120">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
@click="handleDelete2(scope.row)"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total2>0"
:total="total2"
:page.sync="queryParams2.page"
:limit.sync="queryParams2.pageSize"
@pagination="getList2"
/>
</div>
2024-10-23 08:52:43 +08:00
<div style="width: 100%; height: 10px;"></div>
2024-08-16 18:26:19 +08:00
<!-- 添加或修改对话框 -->
2024-10-31 09:22:25 +08:00
<el-dialog center :title="title" :close-on-click-modal="false" :visible.sync="open" width="55%" append-to-body>
2024-08-16 18:26:19 +08:00
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
2024-10-24 14:20:20 +08:00
<div class="flax_box">
<el-form-item label="分组名称" prop="groupName">
<el-input style="width: 424px;" v-model="form.groupName" placeholder="请输入分组名称" maxlength="30"/>
</el-form-item>
2024-08-16 18:26:19 +08:00
2024-10-24 14:20:20 +08:00
<el-form-item label="会员等级" prop="gradeId">
<el-select v-model="form.gradeId" placeholder="请选择会员等级" style="width: 424px">
<el-option v-for="(item,index) in userGradeList" :key="index" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
</div>
<div class="flax_box">
<el-form-item label="会员标签" prop="userLabelId">
<el-select v-model="form.userLabelId" multiple placeholder="请选择会员标签(多选)" style="width: 424px">
<el-option v-for="(item,index) in userLabelList" :key="index" :label="item.labelName"
:value="item.id+''"></el-option>
</el-select>
</el-form-item>
<el-form-item label="会员性别" prop="userSex">
<el-checkbox-group v-model="form.userSex">
<el-checkbox type="name" label="1"></el-checkbox>
<el-checkbox type="name" label="0"></el-checkbox>
<el-checkbox type="name" label="2">不详</el-checkbox>
</el-checkbox-group>
</el-form-item>
</div>
2024-08-16 18:26:19 +08:00
2024-10-24 14:20:20 +08:00
<div class="flax_box">
2024-08-16 18:26:19 +08:00
<el-form-item label="会员年龄" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入年龄" v-model="form.userAgeFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入年龄" v-model="form.userAgeAfter" style="width: 190px"></el-input>
</div>
</el-form-item>
<el-form-item label="会员余额" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入余额" v-model="form.userBalanceFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入余额" v-model="form.userBalanceAfter" style="width: 190px"></el-input>
</div>
</el-form-item>
2024-10-24 14:20:20 +08:00
</div>
<div class="flax_box">
2024-08-16 18:26:19 +08:00
<el-form-item label="会员积分" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入积分" v-model="form.userPointFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入积分" v-model="form.userPointAfter" style="width: 190px"></el-input>
</div>
</el-form-item>
<el-form-item label="充值次数" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入充值次数" v-model="form.rechargeNumFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入充值次数" v-model="form.rechargeNumAfter" style="width: 190px"></el-input>
</div>
</el-form-item>
2024-10-24 14:20:20 +08:00
</div>
<div class="flax_box">
<el-form-item label="充值金额" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入充值金额" v-model="form.rechargeAmountFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入充值金额" v-model="form.rechargeAmountAfter" style="width: 190px"></el-input>
2024-08-16 18:26:19 +08:00
</div>
2024-10-24 14:20:20 +08:00
</el-form-item>
<el-form-item label="消费次数" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入消费次数" v-model="form.consumeNumFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入消费次数" v-model="form.consumeNumAfter" style="width: 190px"></el-input>
</div>
</el-form-item>
</div>
<div class="flax_box">
<el-form-item label="消费油品" prop="consumeOil">
<el-select style="width: 424px" v-model="form.consumeOil" multiple placeholder="请选择油品(多选)" >
<el-option v-for="(item,index) in oilNumberList" :key="index"
:label="getOilNamess(oilNameList,item.oilName)" :value="item.oilName"></el-option>
</el-select>
</el-form-item>
<el-form-item label="消费金额" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入消费金额" v-model="form.consumeAmountFront" style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入消费金额" v-model="form.consumeAmountAfter" style="width: 190px"></el-input>
</div>
</el-form-item>
</div>
<div class="flax_box">
2024-08-16 18:26:19 +08:00
<el-form-item label="平均消费" prop="paymentType">
<div class="d-s">
<el-input placeholder="请输入平均消费金额" v-model="form.averageConsumeFront"
style="width: 190px"></el-input>
<div style="margin: 0 15px"></div>
<el-input placeholder="请输入平均消费金额" v-model="form.averageConsumeAfter"
style="width: 190px"></el-input>
</div>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-switch
v-model="form.status"
active-value="qy"
inactive-value="jy"
active-color="#13ce66"
inactive-color="#ff4949">
</el-switch>
</el-form-item>
2024-10-24 14:20:20 +08:00
</div>
<el-form-item label="消费周期" prop="consumeCycle">
<div class="d-s">
<div class="icon-type" v-for="(item,index) in paymentTypelist" :key="index"
:class="{ 'acvtive' : index === tindex }" @click="Typeindex(index)">
<img src="../../assets/images/wx.png" style="width: 20px;height: 20px" v-if="index != tindex">
<img src="../../assets/images/xz.png" style="width: 20px;height: 20px" v-if="index == tindex">
{{ item }}
</div>
</div>
</el-form-item>
2024-08-16 18:26:19 +08:00
<el-form-item label="备注">
<el-input v-model="form.remark" placeholder="请输入备注" type="textarea"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<!-- 添加或修改对话框 -->
2024-10-31 09:22:25 +08:00
<el-dialog center :title="title" :close-on-click-modal="false" :visible.sync="open1" width="35%" append-to-body>
2024-08-16 18:26:19 +08:00
<el-form ref="form1" :model="form1" :rules="rules" label-width="80px">
<el-form-item label="活动名称" prop="name">
<el-input v-model="form1.name" placeholder="请输入活动名称" maxlength="30"/>
</el-form-item>
<el-form-item label="群发会员" prop="userGroupId">
2024-08-27 10:18:27 +08:00
<el-select v-model="form1.userGroupId" @change="chooseGroup" placeholder="请选择群发会员" style="width: 100%">
2024-08-16 18:26:19 +08:00
<el-option v-for="(item,index) in groupList" :key="index" :label="item.groupName" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="活动时间" prop="activityTimeType">
<div class="d-s">
<div class="icon-type" v-for="(item,index) in activityTimeTypeList" :key="index"
:class="{ 'acvtive' : index === tindex1 }" @click="Typeindex1(index)">
<img src="../../assets/images/wx.png" style="width: 20px;height: 20px" v-if="index != tindex1">
<img src="../../assets/images/xz.png" style="width: 20px;height: 20px" v-if="index == tindex1">
{{ item }}
</div>
<el-date-picker
v-model="form1.activityTimeFront"
style="width: 160px"
type="date"
placeholder="开始日期">
</el-date-picker>
2024-10-24 14:20:20 +08:00
<span style="margin: 0px 15px"></span>
2024-08-16 18:26:19 +08:00
<el-date-picker
v-model="form1.activityTimeAfter"
style="width: 160px"
type="date"
placeholder="结束日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="发送频次" prop="sendFrequency">
<div class="d-s">
<div class="icon-type" v-for="(item,index) in sendFrequencyList" :key="index"
:class="{ 'acvtive' : index === tindex2 }" @click="Typeindex2(index)">
<img src="../../assets/images/wx.png" style="width: 20px;height: 20px" v-if="index != tindex2">
<img src="../../assets/images/xz.png" style="width: 20px;height: 20px" v-if="index == tindex2">
{{ item }}
</div>
</div>
<div>
<el-checkbox-group v-model="weekDay" v-if="form1.sendFrequency==1">
<el-checkbox v-for="(item,index) in weekList" :key="index" :label="item"></el-checkbox>
</el-checkbox-group>
<el-checkbox-group v-model="monthDay" v-if="form1.sendFrequency==2">
<el-checkbox v-for="item in 31" :key="item" :label="item+''">{{ item }}</el-checkbox>
</el-checkbox-group>
<el-time-picker
v-model="form1.sendTime"
format="HH:mm"
placeholder="请选择发送时间点">
</el-time-picker>
</div>
</el-form-item>
<el-form-item label="群发方式" prop="sendWay">
<div style="display: flex">
<el-checkbox-group v-model="form1.sendWay">
<el-checkbox label="短信消息"></el-checkbox>
</el-checkbox-group>
<el-tooltip class="item" effect="light" content="仅对有手机号的会员进行群发" placement="right">
<img style="width: 16px;height: 16px;margin-top: 9px;margin-left: 10px" src="@/assets/images/wenhao.png">
</el-tooltip>
</div>
</el-form-item>
<el-form-item label="群发礼品" prop="senfGift">
<el-checkbox-group v-model="form1.senfGift">
<el-checkbox label="积分"></el-checkbox>
<el-checkbox label="优惠券"></el-checkbox>
<el-checkbox label="成长值"></el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="短信模板" prop="messageId">
<el-select v-model="form1.messageId" placeholder="请选择短信模板名称" style="width: 100%">
<el-option v-for="(item,index) in messageList" :key="index" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="跳转链接" prop="jumpLink">
<div class="d-s">
<div class="icon-type" v-for="(item,index) in jumpLinkList" :key="index"
:class="{ 'acvtive' : index === tindex3 }" @click="Typeindex3(index)">
<img src="../../assets/images/wx.png" style="width: 20px;height: 20px" v-if="index != tindex3">
<img src="../../assets/images/xz.png" style="width: 20px;height: 20px" v-if="index == tindex3">
{{ item }}
</div>
</div>
<el-select v-if="form1.jumpLink==0" v-model="form1.appletJumpPage" placeholder="请选择跳转页面"
style="width: 100%">
<el-option v-for="(item,index) in jumpPageList" :key="index" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
2024-10-24 14:20:20 +08:00
<!-- <el-form-item label="会员数量">-->
<!-- {{ form1.sendUserNum }}-->
<!-- </el-form-item>-->
2024-08-16 18:26:19 +08:00
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm1"> </el-button>
<el-button @click="cancel1"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
2024-08-27 10:18:27 +08:00
import {addUserGroup, deleteUserGroup, editUserGroup, getUserGroup, listUserGroup} from "../../api/userGroup/usergroup";
2024-08-16 18:26:19 +08:00
import {
addUserMassSend,
deleteUserMassSend,
editUserMassSend,
getUserMassSend,
listUserMassSend
} from "@/api/userGroup/userMassSend";
import {deleteUserMassSendRecord, listUserMassSendRecord} from "@/api/userGroup/userMassSendRecord";
import {listUserLabel} from "@/api/staff/user/userlabel";
import {listUserGrade} from "@/api/staff/user/usergrade";
import {getOilNameList, oilNumberList} from "@/api/order/oilnumgun";
import {getListApi} from "@/api/setting/message";
export default {
data() {
return {
tabindex: 0,
tindex: 0,
tindex1: 0,
tindex2: 0,
tindex3: 0,
paymentTypelist: [
"不限制", "7天", "15天", "30天", "60天", "90天", "180天",
],
activityTimeTypeList: [
"永久有效", "自定义"
],
sendFrequencyList: [
"每天一次", "周固定时间", "月固定时间", "法定节日时间"
],
jumpLinkList: [
"小程序链接", "常用链接"
],
weekList: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
weekDay: [],
monthDay: [],
tableData: [{
status: 0,
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
status: 0,
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
status: 0,
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
status: 0,
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
input: '',
value: '',
tabs: [
{
name: "分组管理",
},
{
name: "定时群发",
},
{
name: "群发记录",
}
],
total: 0,
queryParams: {
page: 1,
pageSize: 10
},
beginTime: "",
endTime: "",
userGroupList: [],
total1: 0,
queryParams1: {
page: 1,
pageSize: 10
},
beginTime1: "",
endTime1: "",
massSendList: [],
total2: 0,
queryParams2: {
page: 1,
pageSize: 10
},
beginTime2: "",
endTime2: "",
massSendRecordList: [],
title: '',
open: false,
form: {userSex: []},
userLabelList: [],
userGradeList: [],
oilNameList: [],
// 油号列表
oilNumberList: [],
open1: false,
form1: {userSex: []},
messageList: [],
jumpPageList: [
{id: 0, name: "首页"},
{id: 1, name: "一键加油"},
{id: 2, name: "储值卡充值"},
{id: 3, name: "囤油卡充值"},
{id: 4, name: "礼品卡兑换"},
{id: 5, name: "消费有礼"},
{id: 6, name: "折扣营销"},
{id: 7, name: "满减营销"},
{id: 8, name: "积分商城"},
{id: 9, name: "邀请有礼"},
],
groupList:[],
// 表单校验
rules: {
groupName: [
{required: true, message: "分组名称不能为空", trigger: "blur"},
],
status: [
{required: true, message: "状态不能为空", trigger: "blur"}
],
name: [
{required: true, message: "活动名称不能为空", trigger: "blur"}
],
userGroupId: [
{required: true, message: "群发会员不能为空", trigger: "blur"}
],
activityTimeType: [
{required: true, message: "活动时间不能为空", trigger: "blur"}
],
sendFrequency: [
{required: true, message: "发送频次不能为空", trigger: "blur"}
],
sendWay: [
{required: true, message: "群发方式不能为空", trigger: "blur"}
],
senfGift: [
{required: true, message: "群发礼品不能为空", trigger: "blur"}
],
messageId: [
{required: true, message: "短信模板不能为空", trigger: "blur"}
],
}
};
},
created() {
this.getList()
this.getUserLabelList()
},
methods: {
2024-08-27 10:18:27 +08:00
// 定时群发选择分组
chooseGroup(){
this.groupList.forEach(item => {
if (this.form1.userGroupId==item.id){
this.form1.sendUserNum = item.userNum
}
})
},
2024-08-16 18:26:19 +08:00
getUserLabelList() {
listUserLabel({page: 1, pageSize: 10, status: 'qy'}).then(res => {
this.userLabelList = res.data.records
})
listUserGrade({page: 1, pageSize: 20}).then(response => {
this.userGradeList = response.data.records;
});
getOilNameList().then(response => {
this.oilNameList = response.data;
})
oilNumberList().then(response => {
this.oilNumberList = response.data.records;
})
},
getMessageList() {
getListApi({page: 1, pageSize: 10000, status: '1'}).then(res => {
this.messageList = res.data.records;
})
listUserGroup({page: 1, pageSize: 10000, status: 'qy'}).then(res => {
this.groupList = res.data.records
})
},
getOilNamess(list, id) {
let name = ""
if (list != null && list != "") {
list.forEach(item => {
if (item.id == id) {
name = item.oilName;
}
})
}
return name;
},
// 取消按钮
cancel1() {
this.open1 = false;
this.reset();
},
// 提交按钮
submitForm1: function () {
this.$refs["form1"].validate(valid => {
if (valid) {
this.form1.sendWay = this.form1.sendWay.toString()
this.form1.senfGift = this.form1.senfGift.toString()
if (this.form1.sendFrequency==1){
if (this.weekDay.length>0) this.form1.sendDate = this.weekDay.toString()
}else if (this.form1.sendFrequency==2){
if (this.monthDay.length>0) this.form1.sendDate = this.monthDay.toString()
}
if (!this.form1.id) {
addUserMassSend(this.form1).then(res => {
this.$message.success("添加成功")
this.open1 = false
this.queryParams1.page = 1;
this.getList1()
})
} else {
editUserMassSend(this.form1).then(res => {
this.$message.success("修改成功")
this.open1 = false
this.queryParams1.page = 1;
this.getList1()
})
}
}
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 提交按钮
submitForm: function () {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.userSex) this.form.userSex = this.form.userSex.toString()
if (this.form.userLabelId) this.form.userLabelId = this.form.userLabelId.toString()
if (this.form.consumeOil) this.form.consumeOil = this.form.consumeOil.toString()
if (!this.form.id) {
addUserGroup(this.form).then(res => {
this.$message.success("添加成功")
this.open = false
this.queryParams.page = 1;
this.getList()
})
} else {
editUserGroup(this.form).then(res => {
this.$message.success("修改成功")
this.open = false
this.queryParams.page = 1;
this.getList()
})
}
}
});
},
Typeindex(index) {
this.tindex = index
this.form.consumeCycle = index
},
Typeindex1(index) {
this.tindex1 = index
this.form1.activityTimeType = index
},
Typeindex2(index) {
this.tindex2 = index
this.form1.sendFrequency = index
},
Typeindex3(index) {
this.tindex3 = index
this.form1.jumpLink = index
},
getList() {
let dateRange = []
if (this.beginTime && this.endTime) {
dateRange.push(this.beginTime.toLocaleDateString())
dateRange.push(this.endTime.toLocaleDateString())
}
listUserGroup(this.addDateRange(this.queryParams, dateRange)).then(res => {
this.userGroupList = res.data.records
this.total = res.data.total
})
},
getList1() {
let dateRange = []
if (this.beginTime1 && this.endTime1) {
dateRange.push(this.beginTime1.toLocaleDateString())
dateRange.push(this.endTime1.toLocaleDateString())
}
listUserMassSend(this.addDateRange(this.queryParams1, dateRange)).then(res => {
this.massSendList = res.data.records
this.total1 = res.data.total
})
},
getList2() {
let dateRange = []
if (this.beginTime2 && this.endTime2) {
dateRange.push(this.beginTime2.toLocaleDateString())
dateRange.push(this.endTime2.toLocaleDateString())
}
listUserMassSendRecord(this.addDateRange(this.queryParams2, dateRange)).then(res => {
this.massSendRecordList = res.data.records
this.total2 = res.data.total
})
},
// 修改按钮操作
handleUpdate(row) {
this.reset();
getUserGroup(row.id).then(res => {
this.open = true;
this.form = res.data;
if (res.data.userSex) {
this.form.userSex = res.data.userSex.split(",")
} else {
this.form.userSex = []
}
if (res.data.userLabelId) this.form.userLabelId = res.data.userLabelId.split(",")
if (res.data.consumeOil) this.form.consumeOil = res.data.consumeOil.split(",")
if (res.data.consumeCycle) this.tindex = res.data.consumeCycle
this.title = "修改会员分组"
})
},
// 修改按钮操作
handleUpdate1(row) {
getUserMassSend(row.id).then(res => {
this.open1 = true;
this.form1 = res.data;
if (res.data.sendDate){
if (res.data.sendFrequency==1) {
this.weekDay = res.data.sendDate.split(",")
}else if (res.data.sendFrequency==2){
this.monthDay = res.data.sendDate.split(",")
}
}else {
this.monthDay = []
this.weekDay = []
}
this.form1.sendWay = res.data.sendWay.split(",")
this.form1.senfGift = res.data.senfGift.split(",")
this.title = "修改定时群发"
})
},
// 表单重置
reset() {
this.resetForm("form");
},
// 删除按钮操作
handleDelete(row) {
const name = row.labelName || this.id;
this.$modal.confirm('是否删除本条数据,删除后无法恢复!').then(function () {
return deleteUserGroup(row.id);
}).then(() => {
this.queryParams.page = 1
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
// 删除按钮操作
handleDelete1(row) {
const name = row.labelName || this.id;
this.$modal.confirm('是否删除本条数据,删除后无法恢复!').then(function () {
return deleteUserMassSend(row.id);
}).then(() => {
this.queryParams1.page = 1
this.getList1();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
// 删除按钮操作
handleDelete2(row) {
const name = row.labelName || this.id;
this.$modal.confirm('是否删除本条数据,删除后无法恢复!').then(function () {
return deleteUserMassSendRecord(row.id);
}).then(() => {
this.queryParams2.page = 1
this.getList2();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
// 新增按钮操作
handleAdd1() {
this.tindex1 = 0
this.tindex2 = 0
this.tindex3 = 0
this.form1 = {
sendWay: [],
senfGift: [],
activityTimeType:this.tindex1,
sendFrequency:this.tindex2,
jumpLink:this.tindex3,
2024-08-27 10:18:27 +08:00
sendUserNum:0,
2024-08-16 18:26:19 +08:00
}
this.monthDay = []
this.weekDay = []
this.open1 = true;
this.title = "新增定时群发";
},
// 新增按钮操作
handleAdd() {
this.tindex = 0
this.reset();
this.form = {
status: "qy",
userSex: [],
consumeCycle: this.tindex
}
this.open = true;
this.title = "新增会员标签";
},
// 搜索按钮操作
handleQuery2() {
this.queryParams2.page = 1;
this.getList2();
},
// 重置按钮操作
resetQuery2() {
this.queryParams2 = {
page: 1,
pageSize: 10,
}
this.beginTime2 = ''
this.endTime2 = ''
this.handleQuery2();
},
// 搜索按钮操作
handleQuery1() {
this.queryParams1.page = 1;
this.getList1();
},
// 重置按钮操作
resetQuery1() {
this.queryParams1 = {
page: 1,
pageSize: 10,
}
this.beginTime1 = ''
this.endTime1 = ''
this.handleQuery1();
},
// 搜索按钮操作
handleQuery() {
this.queryParams.page = 1;
this.getList();
},
// 重置按钮操作
resetQuery() {
this.dateRange = [];
this.queryParams = {
page: 1,
pageSize: 10,
}
this.beginTime = ''
this.endTime = ''
this.handleQuery();
},
getindex(index) {
this.tabindex = index
if (index == 0) {
this.getList()
this.getUserLabelList()
} else if (index == 1) {
this.getList1()
this.getMessageList()
} else if (index == 2) {
this.getList2()
}
}
}
}
</script>
<style scoped lang="scss">
.content {
background: #f5f7f8;
width: 100%;
}
.tab-box {
width: 100%;
height: 40px;
background: #fff;
display: flex;
box-sizing: border-box;
2024-10-23 08:52:43 +08:00
border-top: 1px solid #eceff1;
margin-bottom: 10px;
2024-08-16 18:26:19 +08:00
}
.tab_ {
width: 75px;
height: 100%;
//border-bottom: 2px solid #FF770F;
display: flex;
font-weight: 500;
font-size: 14px;
color: #999999;
align-items: center;
justify-content: center;
margin-left: 50px;
cursor: pointer;
}
.active {
border-bottom: 2px solid #FF770F !important;
color: #FF770F !important;
}
.cot-box {
2024-10-23 08:52:43 +08:00
width: 99%;
2024-08-16 18:26:19 +08:00
border-radius: 8px;
background: #fff;
box-sizing: border-box;
padding: 20px;
margin: 0 auto;
}
.d-s-b {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 25px;
}
.d-s {
display: flex;
align-items: center;
}
.icon-type {
display: flex;
align-items: center;
font-weight: 400;
font-size: 14px;
color: #999999;
margin-right: 20px;
cursor: pointer;
}
2024-10-24 14:20:20 +08:00
.flax_box{
display: flex;
align-items: center;
}
2024-08-16 18:26:19 +08:00
.acvtive {
color: #FF770F !important;
}
</style>