Commit bb9c2284 by member

参数错误

parent 05fdb2d8
<template>
<div class="right-wrap">
<topNav :navpath="navpath"></topNav>
<div class="right-content" @click="selectGoodsCateHide">
<div class="right-box">
<div class="attention-wrap">
<div class="form-wrap">
<el-form :rules="rules" :model="ruleForm" ref="ruleForm" label-width="120px" class="demo-ruleForm">
<el-form-item label="策略名称" prop="strategyName" class="padding-0">
<el-input v-model="ruleForm.strategyName" class="w-340 padding-0" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ cateNameLength }}/20</label>
</el-form-item>
<el-form-item label="适用条件" class="padding-0">
<div class="title-tip">该设置只对微信商城中的积分抵现起作用。</div>
</el-form-item>
<template v-for="(item, index) in ruleForm.gradeStrategyChannelList">
<template v-if="item.channelType == 1">
<el-form-item label="适用微信商城" prop="" :key="index">
<el-switch v-model="item.status"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.status" :key="index">
<el-form-item label="选择商户">
<el-select v-model="item.cliqueEnterpriseIdArr" placeholder="请选择" multiple size="small">
<el-option v-for="item in mechantOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="适用商品" class="padding-0">
<el-select class="fl" style="margin-right: 10px;" v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in applyGoods" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
<!-- 二级 -->
<!-- 商品品牌 -->
<el-select size="small" class="fl" @change="selectGoodsStoreWx" v-if="item.channelRelationProType == 2" v-model="valueWx" multiple placeholder="请选择">
<el-option v-for="item in goodsTreeOptionsWx" :key="item.brandId" :label="item.brandName" :value="item.brandId"> </el-option>
</el-select>
<!-- 商品品类 -->
<div v-if="item.channelRelationProType == 3" class="fl goods-cate">
<goodsCate ref="selectGoodsCate" :selectCateType="selectCateTypeWx" :selectCateData="selectCateDataWx" @getCateIds="getCateIds"></goodsCate>
</div>
<el-button style="width:202px" class="fl" v-if="item.channelRelationProType == 4" @click="showGoodsDialog('wx')">已选{{ goodsListWx.length }}件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<!-- 微盟渠道-->
<template v-if="item.channelType == 9">
<el-form-item label="微盟渠道" prop="" :key="index">
<el-switch v-model="item.status"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.status == true" :key="index">
<el-form-item label="选择店铺">
<vue-gic-store-new :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="wmuuid" ref="wmstoreGroup"></vue-gic-store-new>
</el-form-item>
<el-form-item label="微盟商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in wMGoodOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="折扣控制" prop="region" class="input-margin-b">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
</template>
<el-form-item label="折扣" prop="" class="margin-20">
<el-input @focus="inputFocus('discountRate')" @change="formatInputChange($event)" v-model="ruleForm.discountRate"></el-input>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00</span>
</el-form-item>
<el-form-item label="计算方式" prop="">
<el-radio v-model="ruleForm.calculationMethod" label="1">就低原则</el-radio>
<el-radio v-model="ruleForm.calculationMethod" label="2">折上折</el-radio>
</el-form-item>
<el-form-item>
<el-row>
<el-button type="primary" @click.stop.prevent="submitForm('ruleForm')">保 存</el-button>
<el-button @click.stop.prevent="goBack">返 回</el-button>
</el-row>
</el-form-item>
</el-form>
</div>
</div>
</div>
<!-- <vue-gic-store-linkage></vue-gic-store-linkage> -->
</div>
<!-- 添加商品 -->
<add-goods :goodsListId="goodsListId" :goodsType="goodsType" :goodShow.sync="goodShow" :projectName="repProjectName" @selectGoods="selectGoods"></add-goods>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNav from 'components/nav/navNew';
import addGoods from 'components/memberShip/add-goods';
import goodsCate from 'components/memberShip/goodsCate';
import strLength from '@/common/js/strlen';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { getRequest, postRequest, postJson } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'addGroupCate',
data() {
return {
repProjectName: 'gic-web',
navpath: [
{
name: '会员管理',
path: ''
},
{
name: '会员体系',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '添加会员等级',
path: '/addGroupGrade'
},
{
name: '添加折扣策略',
path: ''
}
],
rules: {
strategyName: [{ required: true, message: '请填写策略名称', trigger: 'blur' }]
},
// 添加商品弹窗
goodShow: false,
// 长度
cateNameLength: 0,
// 输入字限制
inputFlagNum: 20,
// 商户
mechantOption: [],
applyGoods: [
{
label: '所有商品',
value: '1'
},
{
label: '按商品品牌',
value: '2'
},
{
label: '按商品品类',
value: '3'
},
{
label: '按单件商品',
value: '4'
}
],
// 微盟渠道
wMShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
wMGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 商品品牌
goodsTreeOptionsWx: [],
valueWx: [],
goodsTreeOptionsLine: [],
valueLine: [],
// 门店 新
uuid: '', // 新增传空,编辑必传,
options: [0, 1, 2, 3, 4, 5], // 0 全部 1 门店类型 2门店标签 3 门店区域 4 门店分组 5 部分门店
isAdd: true,
scencs: 'integral',
wmuuid: '', // 微盟
ruleForm: {
// 积分获取规则
gradeStrategyId: '', //策略id
gradeId: '-1', //等级id
strategyName: '', //策略名称
strategyRelationType: '1', // /** 策略关联类型 1所有商品 2商品品牌 3商品类目 4部分商品 */
discountRate: '0.01', // 折扣率
calculationMethod: '1', // 计算方式 1就低原则 2折上折
discountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
discountControlUpper: '0', // 折扣控制 折扣范围 下限
discountControlLower: '0', //折扣控制 折扣范围 上限
gradeStrategyGoodsRelationIds: [], // 策略关联商品信息id
cliqueEnterpriseIds: [], // 策略关联商户信息
relationCount: '0',
enterpriseMS: null,
perpetualFlag: 1,
gradeStrategyChannelList: [
{
gradeStrategyChannelId: '', //id
channelType: '1', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
status: true, //渠道配置是否启用 1启用 0停用
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
strategyGoodsRelationIdArr: [], // 商品
},
{
gradeStrategyChannelId: '', //id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
status: true, //渠道配置是否启用 1启用 0停用
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
strategyGoodsRelationIdArr: [], // 商品
}
]
},
// 商品品类
selectCateDataWx: [], // 用于回显
selectCateDataLine: [],
selectCateTypeWx: 'wx',
selectCateTypeLine: 'line',
cateDataWx: [],
cateDataLine: [],
// 单个商品类型
goodsType: 'wx', // 单个商品类型 wx:微信商城,line:线下渠道
goodsListId: [],
goodsListWx: [],
goodsListLine: [],
// 商品品牌
goodsTreeOptions: [],
value5: [],
changeGoodData: ''
};
},
created() {
// this.selectReplayStyle()
},
mounted() {
let that = this;
if (that.$route.query.gradeId) {
that.ruleForm.gradeId = that.$route.query.gradeId;
that.navpath[3].path = '/editGroupGrade?gradeId=' + that.ruleForm.gradeId;
that.navpath[3].name = '编辑会员等级';
}
that.getGoodsBrand(); // 商品品牌
// 获取商户
that.getCliqueInfo();
},
methods: {
// 返回
goBack() {
let that = this;
if (that.$route.query.gradeId) {
this.$router.push({
path: '/editGroupGrade',
query: {
gradeId: that.$route.query.gradeId
}
});
} else {
this.$router.push('/addGroupGrade');
}
},
async checkListValue(data) {
let obj = {
flag: true,
text: ''
};
if (!!data.gradeStrategyChannelList.length) {
for (let i = 0; i < data.gradeStrategyChannelList.length; i++) {
if (!!data.gradeStrategyChannelList[i].status) {
if (!!data.gradeStrategyChannelList[i].status && data.gradeStrategyChannelList[i].integralUseDiscountControl == 2) {
if (!data.gradeStrategyChannelList[i].integralUseDiscountControlUpper || !data.gradeStrategyChannelList[i].integralUseDiscountControlLower) {
obj.flag = false;
obj.text = '请填写折扣';
}
if (parseInt(data.gradeStrategyChannelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.gradeStrategyChannelList[i].integralUseDiscountControlLower) > 10 || Number(data.gradeStrategyChannelList[i].integralUseDiscountControlUpper) <= Number(data.gradeStrategyChannelList[i].integralUseDiscountControlLower)) {
obj.flag = false;
obj.text = '折扣格式有误';
}
}
if (data.gradeStrategyChannelList[i].channelType == 1 && !data.gradeStrategyChannelList[i].cliqueEnterpriseIdArr.length) {
obj.flag = false;
obj.text = '请选择商户';
}
if (data.gradeStrategyChannelList[i].channelType == 3) {
const storeGroupDom = this.$refs.storeGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.storeGroup[0].isStoreSave();
} else {
flag = await this.$refs.storeGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
if (data.gradeStrategyChannelList[i].channelType == 9) {
const storeGroupDom = this.$refs.wmstoreGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.wmstoreGroup[0].isStoreSave();
} else {
flag = await this.$refs.wmstoreGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
}
}
}
return obj;
},
// 获取商户列表
getCliqueInfo() {
let that = this;
let para = {};
postRequest('/api-admin/list-enterprise', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result.listEnterprise;
data.forEach(function(ele, index) {
ele.label = ele.brandName;
ele.value = ele.enterpriseId;
});
that.mechantOption = data;
// 默认选择商户
// that.ruleForm.gradeStrategyChannelList[0].cliqueEnterpriseIdArr = [data[0].enterpriseId];
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
// log(error);
});
},
// 获取商品品牌 1
getGoodsBrand() {
let that = this;
let para = {};
getRequest('/api-mall/list-enterprise-brand', para)
.then(res => {
// log(res.data.result)
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptionsWx = data;
that.goodsTreeOptionsLine = data;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 选择商品品牌 微信商城
selectGoodsStoreWx(val) {
this.valueWx = val;
this.ruleForm.gradeStrategyChannelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr = [];
val.forEach(ele => {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
},
// 保存
submitForm(formName) {
let that = this;
this.$refs[formName].validate(valid => {
if (valid) {
let data = JSON.parse(JSON.stringify(that.ruleForm));
if (!data.strategyName) {
showMsg.showmsg('请填写策略名称', 'error');
return;
}
// if (data.strategyRelationType == 2 && that.value5.length < 1) {
// showMsg.showmsg('请选择商品品牌', 'error');
// return;
// }
// if (data.strategyRelationType == 3 && that.cateDataWx.length < 1) {
// showMsg.showmsg('请选择商品品类', 'error');
// return;
// }
// if (data.strategyRelationType == 4 && that.goodsListWx.length < 1) {
// showMsg.showmsg('请选择单件商品', 'error');
// return;
// }
// if (!data.cliqueEnterpriseIds.length) {
// showMsg.showmsg('请选择商户', 'error');
// return;
// }
// 扣控制中的折扣率判断
// if (data.discountControl == 2) {
// let flagA = Number(data.discountControlUpper) <= Number(data.discountControlLower);
// if (!data.discountControlUpper || !data.discountControlLower) {
// that.$message.error('折扣控制中的折扣不能为空');
// return;
// }
// if (flagA) {
// that.$message.error('折扣控制中的折扣格式有误');
// return;
// }
// }
if (data.discountRate == '') {
showMsg.showmsg('请填写折扣', 'error');
return;
} else if (data.discountRate < 0.01) {
showMsg.showmsg('折扣不能为0哦', 'error');
return;
}
that.checkListValue(data).then(res => {
if (!res.flag) {
showMsg.showmsg(res.text, 'error');
return;
} else {
// 设置开启状态 1-->true
data.gradeStrategyChannelList.forEach(function(ele, index) {
ele.status = ele.status == true ? 1 : 0;
if (ele.channelType == 1) {
ele.strategyGoodsRelationIdArr = ele.goodsRelationIdArr;
delete ele.goodsRelationIdArr;
}
if (ele.channelType == '9') {
ele.storeControlId = that.wmuuid;
}
});
let saveBool = true;
data.gradeStrategyChannelList.forEach(item => {
if (item.channelType == 1 && item.status == 1) {
// 微信商城
// 适用商品
if (item.channelRelationProType == 2 && this.valueWx.length < 1) {
// 商品品牌
showMsg.showmsg('请选择商品品牌', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 3 && this.cateDataWx.length < 1) {
// 商品品类
showMsg.showmsg('请选择商品品类', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 4 && this.goodsListWx.length < 1) {
// 单件商品
showMsg.showmsg('请选择单件商品', 'error');
return (saveBool = false);
}
}
});
data.discountControlUpper = data.discountControlUpper || '0';
data.discountControlLower = data.discountControlLower || '0';
data.cliqueEnterpriseIds = data.cliqueEnterpriseIds && data.cliqueEnterpriseIds.length && data.cliqueEnterpriseIds.join(',');
data.gradeStrategyGoodsRelationIds = data.gradeStrategyGoodsRelationIds && data.gradeStrategyGoodsRelationIds.length && data.gradeStrategyGoodsRelationIds.join(',');
if (saveBool) {
that.saveInfo(data);
}
}
})
} else {
log('error submit!!');
return false;
}
});
},
// 保存
saveInfo(form) {
let that = this;
let para = form;
postJson('/api-admin/save-member-grade-strategy', para)
.then(res => {
// log(res.data.result)
let resData = res.data;
if (resData.errorCode == 0) {
// 向本地暂存添加一条
let data = [];
let strategyOld = sessionStorage.getItem('strategy');
if (!!strategyOld && strategyOld != 'undefined' && strategyOld != '') {
let strategy = JSON.parse(sessionStorage.getItem('strategy'));
data = strategy;
}
data.push(resData.result);
sessionStorage.setItem('strategy', JSON.stringify(data));
showMsg.showmsg('保存成功', 'success');
that.goBack();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm.strategyName = temp.trim();
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
},
inputFocus(tag, flag) {
let that = this;
log(tag);
that.tempTag = tag;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 折扣重新写的判断
formatInputChange(e) {
let that = this;
that.ruleForm.discountControlLower = Number(String(that.ruleForm.discountControlLower).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.ruleForm.discountControlLower).replace(/[^\.\d]/g, '')).toFixed(2);
that.ruleForm.discountControlUpper = Number(String(that.ruleForm.discountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.ruleForm.discountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2);
// 比较大小
if (Number(that.ruleForm.discountControlLower) > 10) {
that.ruleForm.discountControlLower = Number(10).toFixed(2);
}
if (Number(that.ruleForm.discountControlUpper) > 10) {
that.ruleForm.discountControlUpper = Number(10).toFixed(2);
}
if (that.tempTag == 'discountRate') {
that.ruleForm[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
that.$forceUpdate();
},
changeRoute(route) {
this.$router.push(route);
},
// 选择商品品牌
selectGoodsStore(val) {
this.value5 = val;
this.ruleForm.gradeStrategyGoodsRelationIds = this.value5;
},
// 单件商品 的 子组件显示方法 3
showGoodsDialog(type) {
let that = this;
that.goodsType = type;
that.goodShow = true;
that.goodsListId = [];
if (type == 'wx') {
// that.goodsListId = ['1']
that.goodsListId = that.goodsListWx;
} else if (type == 'line') {
// that.goodsListId = ['12121']
that.goodsListId = that.goodsListLine;
}
},
// 单件商品 的 子组件触发方法
selectGoods(val) {
let that = this;
log(val);
that.goodShow = false;
that.goodsListId = [];
if (val) {
if (val.goodsType == 'wx') {
that.ruleForm.gradeStrategyGoodsRelationIds = val.strategyGoodsRelationIds;
that.goodsListWx = val.strategyGoodsRelationIds;
}
}
},
// 商品品类
getCateIds(val) {
// 获取数据
// log(val);
if (val.selectCateType == 'wx') {
this.ruleForm.gradeStrategyChannelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr.push(ele);
this.cateDataWx.push(ele);
});
}
});
} else if (val.selectCateType == 'line') {
this.ruleForm.gradeStrategyChannelList.forEach((item, index) => {
if (item.channelType == '3') {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr.push(ele);
this.cateDataLine.push(ele);
});
}
});
}
},
selectGoodsCateHide() {
// 调用子组件 商品品类组件的函数
if (this.ruleForm.gradeStrategyChannelList.length > 0) {
this.ruleForm.gradeStrategyChannelList.forEach((item, index) => {
if (item.channelType == '1' && item.channelRelationProType == 3) {
// 微信商城
if (this.$refs.selectGoodsCate instanceof Array) {
this.$refs.selectGoodsCate[0].hideDragClick();
} else {
this.$refs.selectGoodsCate.hideDragClick();
}
}
});
}
},
},
components: {
topNav,
addGoods,
goodsCate
}
};
</script>
<style lang="less" scoped>
.right-box {
padding: 24px;
}
.attention-wrap {
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.title-tip {
font-size: 12px;
color: #888;
}
}
.form-wrap {
/deep/ .el-radio {
margin-right: 0;
}
.el-input {
width: 178px;
padding: 0 10px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
left: 303px;
color: #c0c4cc;
font-size: 12px;
}
.span-txt {
position: absolute;
left: 222px;
z-index: 2;
width: 300px;
text-align: center;
}
.padding-0 {
padding: 0;
}
.form-child {
width: 100%;
padding: 15px 20px 10px 0px;
background: #f5f6f9;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.margin-l-120 {
margin-left: 120px;
}
.margin-20 {
margin-top: 20px;
}
.tinymce-wrap {
width: 780px;
}
}
/* 商品品类 */
.goods-cate {
display: inline-block;
}
.goods-cate .goods-cate-content {
width: 217px;
}
/*折扣率*/
.form-wrap /deep/ .el-input-number .el-input {
padding: 0 10px;
box-sizing: border-box;
.el-input__inner {
text-align: left;
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
<el-form-item label="等级名称" prop="gradeName" class="limit-el-item">
<el-input v-model="ruleForm.gradeName" class="w-340" @focus="focus('gradeName', 12)" @keyup.native="value => toInput(value)">
<!-- <template slot="append"><label class="input-label">{{inputNumObj.gradeName}}/12</label></template> -->
</el-input>
<label class="input-label">{{ inputNumObj.gradeName }}/12</label>
</el-form-item>
<el-form-item label="等级编码" prop="gradeCode" class="limit-el-item">
<el-input v-model="ruleForm.gradeCode" class="w-340" @focus="focus('gradeCode', 6)" @keyup.native="value => toInput(value)">
<!-- <template slot="append"><label class="input-label">{{inputNumObj.gradeCode}}/6</label></template> -->
</el-input>
<label class="input-label">{{ inputNumObj.gradeCode }}/6</label>
</el-form-item>
<el-form-item label="卡面颜色" prop="cardColor">
<el-color-picker v-model="ruleForm.cardColor"></el-color-picker>
</el-form-item>
<el-form-item label="文字颜色" prop="cardFontColor">
<el-color-picker v-model="ruleForm.cardFontColor"></el-color-picker>
</el-form-item>
<el-form-item label="等级类型" prop="gradeType">
<el-radio v-model="ruleForm.gradeType" label="1">常规卡</el-radio>
<el-radio v-model="ruleForm.gradeType" label="2">特殊卡</el-radio>
</el-form-item>
<el-form-item label="折扣" prop="discountRate">
<el-input v-model="ruleForm.discountRate" @focus="inputFocus('discountRate')" @change="formatInputChange($event)"></el-input>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00</span>
</el-form-item>
<el-form-item label="计算方式" prop="calculationMethod">
<el-radio v-model="ruleForm.calculationMethod" label="1">就低原则</el-radio>
<el-radio v-model="ruleForm.calculationMethod" label="2">折上折</el-radio>
</el-form-item>
<!-- 折扣控制 -->
<el-form-item label="折扣控制" prop="">
<div style="margin-bottom: 22px;">
<el-radio v-model="ruleForm.discountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div>
<el-radio v-model="ruleForm.discountControl" label="2">折扣</el-radio>
<!-- <el-input v-model="ruleForm.discountControlLower" @focus="inputFocus('discountControlLower')" @change="formatInputChange($event)"></el-input> -->
<el-input-number v-model="ruleForm.discountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<!-- <el-input v-model="ruleForm.discountControlUpper" @focus="inputFocus('discountControlUpper')" @change="formatInputChange($event)"></el-input> -->
<el-input-number v-model="ruleForm.discountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
<!-- 特殊折扣控制 -->
<el-form-item label="特殊折扣控制" prop="" v-if="false">
<el-table :data="countTableData" style="width: 100%">
<el-table-column prop="strategyName" label="策略名称"> </el-table-column>
<el-table-column prop="applyGoods" label="适用商品">
<template slot-scope="scope">
<template v-if="scope.row.strategyRelationType == 1">
所有商品
</template>
<template v-if="scope.row.strategyRelationType == 2">
商品品牌
</template>
<template v-if="scope.row.strategyRelationType == 3">
商品类目
</template>
<template v-if="scope.row.strategyRelationType == 4">
部分商品
</template>
</template>
</el-table-column>
<el-table-column prop="" label="折扣">
<template slot-scope="scope">
{{ scope.row.discountRate }}
</template>
</el-table-column>
<el-table-column prop="calWay" label="计算方式">
<template slot-scope="scope">
{{ scope.row.calculationMethod == 1 ? '就低原则' : '折上折' }}
</template>
</el-table-column>
<el-table-column prop="" label="折扣控制">
<template slot-scope="scope">
{{ scope.row.discountControl == 1 ? '所有折扣商品适用' : '折扣范围' }}
</template>
</el-table-column>
<el-table-column prop="" label="操作">
<template slot-scope="scope">
<router-link :to="{ path: '/editGroupCate', query: { strategyId: scope.row.gradeStrategyId } }" class="edit-btn el-button--text">编辑</router-link>
<el-button @click="delGroupCate(scope.$index, scope.row, countTableData)" type="text" size="small">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<div><el-button type="text" icon="el-icon-circle-plus-outline" @click="changeRoute('/addGroupCate')">新增策略</el-button></div>
</el-form-item>
<!-- 关联商户等级 -->
<el-form-item label="关联商户等级" prop="" class="table-label">
<el-table :data="linkLevelTableData" style="width: 100%">
<el-table-column prop="enterpriseName" label="商户名称"> </el-table-column>
<el-table-column prop="" label="会员等级">
<template slot-scope="scope">
<el-select size="small" v-model="scope.row.selectedGradeId" placeholder="请选择" @change="changeCardLevel($event, scope.row)">
<el-option v-for="(item, ind) in scope.row.gradeList" :key="ind" :label="item.gradeName" :value="item.gradeId"> </el-option>
</el-select>
</template>
</el-table-column>
<el-table-column prop="selectedGradeCode" label="等级编码"> </el-table-column>
<el-table-column prop="" label="自动升级">
<template slot-scope="scope">
<template v-if="scope.row.selectedAutoUpgrade">
{{ scope.row.selectedAutoUpgrade == 1 ? '是' : '否' }}
</template>
<template v-else>
{{ '--' }}
</template>
</template>
</el-table-column>
<el-table-column prop="" label="自动降级">
<template slot-scope="scope">
<template v-if="scope.row.selectedAutoDowngrade">
{{ scope.row.selectedAutoDowngrade == 1 ? '是' : '否' }}
</template>
<template v-else>
{{ '--' }}
</template>
</template>
</el-table-column>
</el-table>
</el-form-item>
<!-- 自动升级 -->
<el-form-item label="自动升级" prop="">
<el-switch v-model="ruleForm.autoUpgrade"> </el-switch>
</el-form-item>
<el-form-item label="升级条件" prop="" v-if="ruleForm.autoUpgrade">
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelHighcostSelect">当天消费满</el-checkbox>
<el-input v-model="ruleForm.upLevelHighcost" @focus="inputFocus('upLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelDaystoredSelect">当天储值满</el-checkbox>
<el-input v-model="ruleForm.upLevelDaystored" @focus="inputFocus('upLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumcostDays" @focus="inputFocus('upLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelSumcost" @focus="inputFocus('upLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelCostimesSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelCosttimesDays" @focus="inputFocus('upLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelCosttimes" @focus="inputFocus('upLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumstoredDays" @focus="inputFocus('upLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.upLevelSumstored" @focus="inputFocus('upLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumintegralDays" @focus="inputFocus('upLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得 </label>
<el-input v-model="ruleForm.upLevelSumintegral" @focus="inputFocus('upLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
<!-- 自动降级 -->
<el-form-item label="自动降级" prop="">
<el-switch v-model="ruleForm.autoDowngrade"> </el-switch>
</el-form-item>
<div v-if="ruleForm.autoDowngrade">
<el-form-item label="会员等级有效期" prop="">
<label> 自升级之日起算 </label>
<el-input v-model="ruleForm.gradeEffectDay" @focus="inputFocus('gradeEffectDay', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</el-form-item>
<el-form-item label="保级条件" prop="">
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelHighcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelHighcostDays" @focus="inputFocus('lowLevelHighcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天消费满</label>
<el-input v-model="ruleForm.lowLevelHighcost" @focus="inputFocus('lowLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelDaystoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelDaystoredDays" @focus="inputFocus('lowLevelDaystoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天储值满</label>
<el-input v-model="ruleForm.lowLevelDaystored" @focus="inputFocus('lowLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumcostDays" @focus="inputFocus('lowLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelSumcost" @focus="inputFocus('lowLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelCosttimesSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelCosttimesDays" @focus="inputFocus('lowLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelCosttimes" @focus="inputFocus('lowLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumstoredDays" @focus="inputFocus('lowLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.lowLevelSumstored" @focus="inputFocus('lowLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumintegralDays" @focus="inputFocus('lowLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得</label>
<el-input v-model="ruleForm.lowLevelSumintegral" @focus="inputFocus('lowLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
</div>
<el-form-item class="font-0">
<el-button type="primary" @click="submitForm('ruleForm')">保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import strLength from '@/common/js/strlen';
import { getRequest, postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'addMemberGrade',
data() {
return {
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '添加集团会员等级',
path: ''
}
],
rules: {
gradeName: [{ required: true, message: '请填写等级名称', trigger: 'blur' }],
gradeCode: [{ required: true, message: '请填写等级编码', trigger: 'blur' }],
cardColor: [{ required: true, message: '请填写卡面颜色', trigger: 'change' }],
cardFontColor: [{ required: true, message: '请填写文字颜色', trigger: 'change' }],
gradeType: [{ required: true, message: '请选择等级类型', trigger: 'change' }],
discountRate: [{ required: true, message: '请填写折扣', trigger: 'change' }],
calculationMethod: [{ required: true, message: '请填写计算方式', trigger: 'change' }]
},
// 输入控制
inputNumObj: {
gradeName: 0,
gradeCode: 0
},
// 记录输入的
inputFlag: '',
inputFlagNum: '',
// form
ruleForm: {
gradeId: '', //等级id
gradeIntegralId: '', //等级积分id
gradeName: '', //等级名称
gradeCode: '', //等级代码
cardColor: '#000000', //卡片颜色
cardFontColor: '#ffffff', //卡字体颜色
gradeType: '1', //常规还是特殊卡 1常规 2特殊
discountRate: '1', // 折扣率
calculationMethod: '2', // 计算方式 1就低原则 2折上折
discountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
discountControlUpper: '0',
discountControlLower: '0',
autoUpgrade: true, //自动升级 1启用 2停用
upLevelHighcostSelect: false, // 当天消费满
upLevelHighcost: '0',
upLevelDaystoredSelect: false, // 当天储值满
upLevelDaystored: '0',
upLevelSumcostSelect: false, //x天内消费满x元
upLevelSumcostDays: '0',
upLevelSumcost: '0',
upLevelCostimesSelect: false, // x天内消费满x次
upLevelCosttimes: '0',
upLevelCosttimesDays: '0',
upLevelSumstoredSelect: false, //x天内储值满x元
upLevelSumstored: '0',
upLevelSumstoredDays: '0',
upLevelSumintegralSelect: false, //x天内获得x积分
upLevelSumintegral: '0',
upLevelSumintegralDays: '',
autoDowngrade: true, //自动降级 1启用 2停用
gradeEffectDay: '0', //自升级之日起算X天
lowLevelHighcostDays: '0', //x天内单天消费满x元
lowLevelHighcost: '0',
lowLevelHighcostSelect: false,
lowLevelDaystoredSelect: false, //x天内单天储值满x元
lowLevelDaystoredDays: '0',
lowLevelDaystored: '0',
lowLevelSumcostDays: '0', //x天内消费满x元
lowLevelSumcostSelect: false,
lowLevelSumcost: '0',
lowLevelCosttimesSelect: false, //x天内消费满x次
lowLevelCosttimesDays: '0',
lowLevelCosttimes: '0',
lowLevelSumstoredSelect: false, //x天内储值满x元
lowLevelSumstored: '0',
lowLevelSumstoredDays: '0',
lowLevelSumintegralSelect: false, //x天内获得x积分
lowLevelSumintegral: '0',
lowLevelSumintegralDays: '0',
gradeDescribe: '', //会员等级说明
upCliqueEnterpriseRelation: null
},
// 特殊折扣控制
countTableData: [],
// 关联商户等级
linkLevelTableData: [],
// 会员卡等级
levelOptions: [
{
value: '0',
label: '普卡'
},
{
value: '1',
label: '青铜卡卡'
}
]
};
},
created() {
// this.selectReplayStyle()
},
methods: {
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// 返回
goBack() {
this.$router.go(-1);
},
inputFocus(tag, flag) {
let that = this;
that.tempTag = tag;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 折扣重新写的判断
formatInputChange(e) {
let that = this;
if (that.tempTag == 'discountControlLower' || that.tempTag == 'discountControlUpper') {
that.ruleForm[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
if (that.tempTag == 'discountRate') {
that.ruleForm[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
that.ruleForm[that.tempTag] = String(e.target.value).replace(/[^\.\d]/g, '');
if (!!that.tempFlag && that.tempFlag == 'day') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 4);
}
if (!!that.tempFlag && that.tempFlag == 'money') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 6);
}
if (!!that.tempFlag && that.tempFlag == 'point') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 8);
}
},
// 检查条件
checkUp(data) {
let flag = true;
if (!!data.autoUpgrade) {
if (!!data.upLevelHighcostSelect && !data.upLevelHighcost) {
flag = false;
}
if (!!data.upLevelDaystoredSelect && !data.upLevelDaystored) {
flag = false;
}
if (!!data.upLevelSumcostSelect && (!data.upLevelSumcostDays || !data.upLevelSumcost)) {
flag = false;
}
if (!!data.upLevelCostimesSelect && (!data.upLevelCosttimesDays || !data.upLevelCosttimes)) {
flag = false;
}
if (!!data.upLevelSumstoredSelect && (!data.upLevelSumstoredDays || !data.upLevelSumstored)) {
flag = false;
}
if (!!data.upLevelSumintegralSelect && (!data.upLevelSumintegralDays || !data.upLevelSumintegral)) {
flag = false;
}
}
return flag;
},
checkDown(data) {
let flag = true;
if (!!data.autoDowngrade) {
if (!data.gradeEffectDay) {
flag = false;
}
if (!!data.lowLevelHighcostSelect && (!data.lowLevelHighcostDays || !data.lowLevelHighcost)) {
flag = false;
}
if (!!data.lowLevelDaystoredSelect && (!data.lowLevelDaystoredDays || !data.lowLevelDaystored)) {
flag = false;
}
if (!!data.lowLevelSumcostSelect && (!data.lowLevelSumcostDays || !data.lowLevelSumcost)) {
flag = false;
}
if (!!data.lowLevelCosttimesSelect && (!data.lowLevelCosttimesDays || !data.lowLevelCosttimes)) {
flag = false;
}
if (!!data.lowLevelSumstoredSelect && (!data.lowLevelSumstoredDays || !data.lowLevelSumstored)) {
flag = false;
}
if (!!data.lowLevelSumintegralSelect && (!data.lowLevelSumintegralDays || !data.lowLevelSumintegral)) {
flag = false;
}
}
return flag;
},
// 保存
submitForm(formName) {
let that = this;
this.$refs[formName].validate(valid => {
if (valid) {
if (!that.ruleForm.gradeName) {
showMsg.showmsg('请填写等级名称', 'error');
return;
}
if (!that.ruleForm.gradeCode) {
showMsg.showmsg('请填写等级编码', 'error');
return;
}
if (that.ruleForm.discountRate == '') {
showMsg.showmsg('请填写折扣', 'error');
return;
} else if (that.ruleForm.discountRate < 0.01) {
showMsg.showmsg('折扣不能为0哦', 'error');
return;
}
if (that.ruleForm.discountControl == 2) {
let flagA = Number(that.ruleForm.discountControlUpper) <= Number(that.ruleForm.discountControlLower);
if (!that.ruleForm.discountControlUpper || !that.ruleForm.discountControlLower) {
that.$message.error('折扣控制中的折扣不能为空');
return;
}
if (flagA) {
that.$message.error('折扣控制中的折扣格式有误');
return;
}
}
if (parseInt(that.ruleForm.discountControlLower) > 10) {
that.ruleForm.discountControlLower = 10.0;
}
if (parseInt(that.ruleForm.discountControlUpper) > 10) {
that.ruleForm.discountControlUpper = 10.0;
}
if (!that.checkUp(that.ruleForm)) {
showMsg.showmsg('请填写升级条件', 'error');
return;
}
if (!that.checkDown(that.ruleForm)) {
showMsg.showmsg('请填写降级条件', 'error');
return;
}
let data = JSON.parse(JSON.stringify(that.ruleForm));
data.autoDowngrade = data.autoDowngrade == true ? 1 : 2;
data.autoUpgrade = data.autoUpgrade == true ? 1 : 2;
data.gradeType = String(data.gradeType);
data.upLevelHighcostSelect = data.upLevelHighcostSelect == true ? 1 : 0;
data.upLevelDaystoredSelect = data.upLevelDaystoredSelect == true ? 1 : 0;
data.upLevelSumcostSelect = data.upLevelSumcostSelect == true ? 1 : 0;
data.upLevelCostimesSelect = data.upLevelCostimesSelect == true ? 1 : 0;
data.upLevelSumstoredSelect = data.upLevelSumstoredSelect == true ? 1 : 0;
data.upLevelSumintegralSelect = data.upLevelSumintegralSelect == true ? 1 : 0;
log(data.lowLevelHighcostSelect, data.lowLevelDaystoredSelect, data.lowLevelSumcostSelect, data.lowLevelCosttimesSelect, data.lowLevelSumstoredSelect, data.lowLevelSumintegralSelect);
data.lowLevelHighcostSelect = data.lowLevelHighcostSelect == true ? 1 : 0;
data.lowLevelDaystoredSelect = data.lowLevelDaystoredSelect == true ? 1 : 0;
data.lowLevelSumcostSelect = data.lowLevelSumcostSelect == true ? 1 : 0;
data.lowLevelCosttimesSelect = data.lowLevelCosttimesSelect == true ? 1 : 0;
data.lowLevelSumstoredSelect = data.lowLevelSumstoredSelect == true ? 1 : 0;
data.lowLevelSumintegralSelect = data.lowLevelSumintegralSelect == true ? 1 : 0;
data.discountControlUpper = data.discountControlUpper || '0';
data.discountControlLower = data.discountControlLower || '0';
// 值增加默认 0
data.upLevelHighcost = data.upLevelHighcost || 0;
data.upLevelDaystored = data.upLevelDaystored || 0;
data.upLevelSumcostDays = data.upLevelSumcostDays || 0;
data.upLevelSumcost = data.upLevelSumcost || 0;
data.upLevelCosttimesDays = data.upLevelCosttimesDays || 0;
data.upLevelCosttimes = data.upLevelCosttimes || 0;
data.upLevelSumstoredDays = data.upLevelSumstoredDays || 0;
data.upLevelSumstored = data.upLevelSumstored || 0;
data.upLevelSumintegralDays = data.upLevelSumintegralDays || 0;
data.upLevelSumintegral = data.upLevelSumintegral || 0;
data.gradeEffectDay = data.gradeEffectDay || 0;
data.lowLevelHighcostDays = data.lowLevelHighcostDays || 0;
data.lowLevelHighcost = data.lowLevelHighcost || 0;
data.lowLevelDaystoredDays = data.lowLevelDaystoredDays || 0;
data.lowLevelDaystored = data.lowLevelDaystored || 0;
data.lowLevelSumcostDays = data.lowLevelSumcostDays || 0;
data.lowLevelSumcost = data.lowLevelSumcost || 0;
data.lowLevelCosttimesDays = data.lowLevelCosttimesDays || 0;
data.lowLevelCosttimes = data.lowLevelCosttimes || 0;
data.lowLevelSumstoredDays = data.lowLevelSumstoredDays || 0;
data.lowLevelSumstored = data.lowLevelSumstored || 0;
data.lowLevelSumintegralDays = data.lowLevelSumintegralDays || 0;
data.lowLevelSumintegral = data.lowLevelSumintegral || 0;
// 关联商户等级
let relation = '';
that.linkLevelTableData.forEach(function(ele, index) {
if (!!ele.selectedGradeId) {
relation += ele.enterpriseId + ':' + ele.selectedGradeId + (that.linkLevelTableData.length > 1 ? ',' : '');
}
});
data.upCliqueEnterpriseRelation = relation;
log(data.upCliqueEnterpriseRelation);
// 策略ids
data.gradeStrategyIds = '';
let cateArr = [];
if (!!that.countTableData.length) {
that.countTableData.forEach(function(ele, index) {
cateArr.push(ele.gradeStrategyId);
});
}
if (!!cateArr.length) {
data.gradeStrategyIds = cateArr.join(',');
}
log(data.gradeStrategyIds);
that.saveInfo(data);
} else {
showMsg.showmsg('表单信息未填写完整', 'error');
return false;
}
});
},
// 保存
saveInfo(form) {
let that = this;
let para = form;
postRequest('/api-admin/do-save-member-grade', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('保存成功', 'success');
// 返回
that.goBack();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 输入控制
focus(name, num) {
let that = this;
log(name, num);
that.inputFlag = name;
that.inputFlagNum = num;
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm[that.inputFlag] = temp.trim();
that.inputNumObj[that.inputFlag] = strLength.getZhLen(that.ruleForm[that.inputFlag]);
},
// 删除
delGroupCate(index, row, obj) {
let that = this;
log(index, row, obj);
let para = {
strategyId: row.gradeStrategyId
};
that
.$confirm('确认删除吗?', '提示', {
//type: 'warning'
})
.then(() => {
getRequest(that.baseUrl + '/api-auth/delete-member-grade-strategy', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('删除成功', 'success');
obj.splice(index, 1);
return;
}
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
})
.catch(() => {});
},
// 选择卡
changeCardLevel(e, row) {
row.gradeList.forEach(function(ele, index) {
if (ele.gradeId == e) {
row.selectedGradeCode = ele.gradeCode;
row.selectedAutoDowngrade = ele.autoDowngrade;
row.selectedAutoUpgrade = ele.autoUpgrade;
}
});
},
// 获取关联商户等级信息
getMemberGradeInfo() {
let that = this;
let para = {
gradeId: ''
};
postRequest('/api-admin/get-member-grade-info', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
// 策略
// that.countTableData = resData.result.strategyList
// 关联商户等级
let levelArr = resData.result.enterpriseGradeList;
levelArr.forEach(function(ele, index) {
if (!!ele.gradeList) {
ele.gradeList.unshift({
gradeId: '',
gradeName: '请选择',
gradeCode: '',
autoDowngrade: '',
autoUpgrade: ''
});
}
});
that.linkLevelTableData = levelArr;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
beforeRouteLeave(to, from, next) {
let that = this;
log(to, from, next);
// 存储已经填写的数据
log(that.ruleForm);
let d = to;
if (d.path == '/editGroupCate' || d.path == '/addGroupCate') {
sessionStorage.setItem('localForm', JSON.stringify(that.ruleForm));
sessionStorage.setItem('strategy', JSON.stringify(that.countTableData));
sessionStorage.setItem('relation', JSON.stringify(that.linkLevelTableData));
}
next();
},
components: {
topNavNew
},
mounted() {
let that = this;
let data = JSON.parse(sessionStorage.getItem('localForm'));
let strategy = JSON.parse(sessionStorage.getItem('strategy'));
let relation = JSON.parse(sessionStorage.getItem('relation'));
if (data || strategy || relation) {
log(data, strategy, relation);
that.ruleForm = data;
that.countTableData = strategy; // 获取已经增加的策略
that.linkLevelTableData = relation; // 获取已经填写的关联商户等级
that.inputNumObj.gradeName = strLength.getZhLen(that.ruleForm.gradeName);
that.inputNumObj.gradeCode = strLength.getZhLen(that.ruleForm.gradeCode);
sessionStorage.removeItem('localForm');
sessionStorage.removeItem('strategy');
sessionStorage.removeItem('relation');
return;
}
// 获取关联商户等级
that.getMemberGradeInfo();
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.el-input {
width: 180px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .el-form-item__label {
padding: 0 12px 0 0;
}
.limit-el-item {
/deep/ .el-form-item__content {
width: 340px;
}
}
/deep/ .el-form {
.el-form-item:last-child {
/*margin-bottom: 0;*/
.el-button {
margin-top: 25px;
}
}
}
/deep/ .el-table td,
/deep/ .el-table th {
padding: 7px 0;
}
/deep/ .input-label {
position: absolute;
right: 10px;
top: 2px;
color: #909399;
font-size: 12px;
}
.check-cell {
.el-input {
margin: 0 10px;
}
& + .check-cell {
margin-top: 15px;
}
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content" @click="selectGoodsCateHide">
<div class="right-box">
<div class="attention-wrap">
<div class="form-wrap">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item label="策略名称" prop="strategyName" class="padding-0 padding-r-45">
<el-input
v-model="ruleForm.strategyName"
class="w-340 padding-0"
@keyup.native="value => toInput(value)"
></el-input>
<label class="input-label">{{ cateNameLength }}/20</label>
</el-form-item>
<el-form-item label="适用对象" prop class="margin-20">
<el-select v-model="ruleForm.useCrowd" placeholder="请选择">
<el-option
v-for="item in applyObjOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="人群定向" v-if="ruleForm.useCrowd == 2" prop class="padding-0">
<el-button @click="showPeople">已设置{{ selectCount }}项筛选</el-button>
</el-form-item>
<el-form-item label="适用条件" class="padding-0">
<div class="title-tip">该设置只对微信商城中的积分抵现起作用。</div>
</el-form-item>
<!-- 只获取微信的 -->
<template v-for="(item, index) in ruleForm.channelList">
<template v-if="item.channelType == 1">
<el-form-item label="适用微信商城" prop="" :key="index">
<el-switch v-model="item.openStatus"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus" :key="index">
<el-form-item label="选择商户">
<el-select
v-model="item.enterpriseRelationIdArr"
placeholder="请选择"
multiple
size="small"
>
<el-option
v-for="item in mechantOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="适用商品" class="padding-0">
<el-select
class="fl"
style="margin-right: 10px;"
v-model="item.channelRelationProType"
placeholder="请选择"
>
<el-option
v-for="item in applyGoods"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<!-- 二级 -->
<!-- 商品品牌 -->
<el-select
size="small"
class="fl"
@change="selectGoodsStoreWx"
v-if="item.channelRelationProType == 2"
v-model="valueWx"
multiple
placeholder="请选择"
>
<el-option
v-for="item in goodsTreeOptionsWx"
:key="item.brandId"
:label="item.brandName"
:value="item.brandId"
></el-option>
</el-select>
<!-- 商品品类 -->
<div v-if="item.channelRelationProType == 3" class="fl goods-cate">
<goodsCate
ref="selectGoodsCate"
:selectCateType="selectCateTypeWx"
:selectCateData="selectCateDataWx"
@getCateIds="getCateIds"
></goodsCate>
</div>
<el-button
style="width:202px"
class="fl"
v-if="item.channelRelationProType == 4"
@click="showGoodsDialog('wx')"
>已选{{ goodsListWx.length }}件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number
v-model="item.integralUseDiscountControlLower"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label></label>
<el-input-number
v-model="item.integralUseDiscountControlUpper"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label>折商品都适用</label>
<span
style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;"
>注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<!-- 微盟渠道-->
<template v-if="item.channelType == 9">
<el-form-item label="微盟渠道" prop="" :key="index">
<el-switch v-model="item.openStatus"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus == true" :key="index">
<el-form-item label="选择店铺">
<vue-gic-store-new :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="wmuuid" ref="wmstoreGroup"></vue-gic-store-new>
</el-form-item>
<el-form-item label="微盟商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in wMGoodOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="折扣控制" prop="region" class="input-margin-b">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
</template>
<el-form-item label="抵现规则" prop class="margin-20">
<div>
<el-radio v-model="ruleForm.integralUseStatus" label="1">每使用</el-radio>
<el-input-number
v-model="ruleForm.integralUse.integral"
:precision="1"
:controls="false"
:max="10000.0"
:min="0.1"
></el-input-number>
<label>积分,抵</label>
<el-input-number
v-model="ruleForm.integralUse.fee"
:precision="1"
:controls="false"
:max="10000.0"
:min="0.1"
></el-input-number>
<label></label>
</div>
<div>
<el-radio v-model="ruleForm.integralUseStatus" label="0" class="margin-20">不支持抵现</el-radio>
</div>
</el-form-item>
<el-form-item label="比例限制" prop="name">
<label style="color: #606266">最多可抵用商品金额的</label>
<el-input
@keyup.native="formatInputNum($event)"
v-model="ruleForm.channelList[0].useProportionalRestriction"
>
<template slot="append">%</template>
</el-input>
</el-form-item>
<!-- 新增策略有效期配置 -->
<el-form-item label="策略有效期" prop="">
<!-- 1 永久 0 非永久 -->
<el-radio v-model="ruleForm.perpetualFlag" :label="1">永久有效</el-radio>
<el-radio v-model="ruleForm.perpetualFlag" :label="0">
在该时段内有效
<el-date-picker
v-if="ruleForm.perpetualFlag === 0"
v-model="ruleForm.perpetualDate"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']">
</el-date-picker>
</el-radio>
</el-form-item>
<el-form-item>
<el-row>
<el-button
:disabled="tpnEditBool"
type="primary"
@click="submitForm('ruleForm')"
>保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-row>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
<!-- 添加商品 -->
<add-goods
:goodsListId="goodsListId"
:goodsType="goodsType"
:goodShow.sync="goodShow"
:projectName="repProjectName"
@selectGoods="selectGoods"
></add-goods>
<!-- 人群筛选器的弹框 -->
<el-dialog title="自定义人群" :visible.sync="dialogVisiblePeople" width="980px">
<div class="select-people">
<vue-gic-group-people
:projectName="repProjectName"
:useId="useId"
:hasSearchData="hasSearchData"
:sceneValue="sceneValue"
ref="peopleFilter"
@findFilter="findFilter"
@getBackData="getBackData"
@editHide="editHide"
@editShow="editShow"
@hideBtn="hideBtn"
></vue-gic-group-people>
<div v-show="toggleTag" class="people-btn-wrap">
<el-row>
<el-button @click="getData" type="primary" size="small">确定</el-button>
<el-button @click="cancelFilter" size="small">取消</el-button>
</el-row>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-row>
<el-button @click="dialogVisiblePeople = false">取 消</el-button>
<el-button type="primary" @click="getPeopleData">确 定</el-button>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import addGoods from 'components/memberShip/add-goods';
import goodsCate from 'components/memberShip/goodsCate';
import '@riophae/vue-treeselect/dist/vue-treeselect.css';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import strLength from '@/common/js/strlen';
import { getRequest, postRequest, postJson } from '@/api/api';
import { log } from '@/utils/index.js';
const timeStramp = {
year: new Date().getFullYear(),
month: new Date().getMonth(),
day: new Date().getDate()
};
export default {
name: 'addIntegralSytem',
data() {
return {
repProjectName: 'gic-clique',
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '积分制度',
path: '/pointSystem'
},
{
name: '添加积分抵现策略',
path: ''
}
],
rules: {
strategyName: [{ required: true, message: '请填写策略名称', trigger: 'blur' }]
},
// 添加商品弹窗
goodShow: false,
// 长度
cateNameLength: 0,
// 输入字限制
inputFlagNum: 20,
// 商户
mechantOption: [],
applyGoods: [
{
label: '所有商品',
value: '1'
}
// {
// label: '按商品品牌',
// value: '2',
// },
// {
// label: '按商品品类',
// value: '3',
// },
// {
// label: '按单件商品',
// value: '4',
// },
],
// 微盟渠道
wMShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
wMGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 门店 新
uuid: '', // 新增传空,编辑必传,
options: [0, 1, 2, 3, 4, 5], // 0 全部 1 门店类型 2门店标签 3 门店区域 4 门店分组 5 部分门店
isAdd: true,
scencs: 'integral',
wmuuid: '', // 微盟
ruleForm: {
// 积分获取规则
integralStrategyId: '', //策略id
enterpriseId: '',
strategyName: '', //策略名称
strategyType: 2, // 策略类型 1消费积分 2积分抵现
useCrowd: '1', // 策略类型 1所有 2人群筛选
crowdJson: '', //人群筛选器内容
selectorParams: '',
integralGetStatus: '1', // 积分获取开启 1是0否
integralGetStrategy: '1', // 取整策略 1四舍五入 2抹零 3向上取整
integralGetFreezeDays: 1, // 获取积分冻结天数
integralGetEffectiveDays: 1, // 获取积分有效天
integralUseStatus: '0', // 积分抵现开启 1是0否
integralUse: { fee: '', integral: '' }, // 积分抵现 {fee:5,integral:5}
perpetualFlag: 1,
channelList: [
{
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '1', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
},
{
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
}
],
// perpetualDate: [new Date(timeStramp.year, timeStramp.month, timeStramp.day, 0, 0), new Date(timeStramp.year, timeStramp.month, timeStramp.day, 23, 59)]
},
// 适用对象
applyObjOption: [
{
label: '所有会员',
value: '1'
},
{
label: '自定义人群',
value: '2'
}
],
/* 人群筛选器 */
dialogVisiblePeople: false,
sceneValue: 'member', // 场景值
useId: '',
searchParams: '',
hasSearchData: '', // 当前页回显的数据(接口返回)
toggleTag: false,
selectCount: 0,
tempBusinessId: '', // 人群筛选器的临时保存
// 单个商品类型
goodsType: 'wx', // 单个商品类型 wx:微信商城,line:线下渠道
goodsListId: [],
goodsListWx: [],
goodsListLine: [],
// 商品品类
selectCateDataWx: [], // 用于回显
selectCateDataLine: [],
selectCateTypeWx: 'wx',
selectCateTypeLine: 'line',
cateDataWx: [],
cateDataLine: [],
storeGroupList: [],
// 商品品牌
goodsTreeOptionsWx: [],
valueWx: [],
goodsTreeOptionsLine: [],
valueLine: [],
// 太平鸟标识
tpnEditBool: false,
tpnEnterpriseId: 'ff808081671d3ceb01672adebf4e6149'
};
},
created() {
// this.selectReplayStyle()
},
methods: {
// 返回
goBack() {
this.$router.go(-1);
},
async checkListValue(data) {
let obj = {
flag: true,
text: ''
};
if (!!data.channelList.length) {
for (let i = 0; i < data.channelList.length; i++) {
if (!!data.channelList[i].openStatus) {
if (!!data.channelList[i].openStatus && data.channelList[i].integralUseDiscountControl == 2) {
if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
obj.flag = false;
obj.text = '请填写折扣';
}
if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
obj.flag = false;
obj.text = '折扣格式有误';
}
}
if (data.channelList[i].channelType == 1 && !data.channelList[i].enterpriseRelationIdArr.length) {
obj.flag = false;
obj.text = '请选择商户';
}
if (data.channelList[i].channelType == 3) {
const storeGroupDom = this.$refs.storeGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.storeGroup[0].isStoreSave();
} else {
flag = await this.$refs.storeGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
if (data.channelList[i].channelType == 9) {
const storeGroupDom = this.$refs.wmstoreGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.wmstoreGroup[0].isStoreSave();
} else {
flag = await this.$refs.wmstoreGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
}
}
}
return obj;
},
// 保存
submitForm(formName) {
let that = this;
if (!that.tpnEditBool) {
let data = JSON.parse(JSON.stringify(that.ruleForm));
this.$refs[formName].validate(valid => {
if (valid) {
// 非空验证
if (!data.strategyName) {
showMsg.showmsg('请填写策略名称', 'error');
return;
}
// if (!data.channelList[0].enterpriseRelationIdArr.length) {
// showMsg.showmsg('请选择商户', 'error');
// return;
// }
// if (data.channelList[0].integralUseDiscountControl == 2) {
// let flagA = Number(data.channelList[0].integralUseDiscountControlLower) >= Number(data.channelList[0].integralUseDiscountControlUpper);
// if (!data.channelList[0].integralUseDiscountControlLower || !data.channelList[0].integralUseDiscountControlUpper) {
// that.$message.error('折扣控制中的折扣不能为空');
// return;
// }
// if (flagA) {
// that.$message.error('折扣控制中的折扣格式有误');
// return;
// }
// }
let flag = !data.integralUse.fee || String(data.integralUse.integral) == '';
if (data.integralUseStatus == 1 && flag) {
that.$message.error('请填写抵现规则');
return;
}
if (data.integralUseStatus == 1) {
if (!Number(data.integralUse.fee)) {
showMsg.showmsg('抵现规则中的抵现金额不能为0', 'error');
return;
}
if (!Number(data.integralUse.integral)) {
showMsg.showmsg('抵现规则中的使用积分不能为0', 'error');
return;
}
}
// if (!data.channelList[0].useProportionalRestriction) {
// showMsg.showmsg('请填写比例限制', 'error');
// return;
// } else {
// if (data.channelList[0].useProportionalRestriction > 100) {
// showMsg.showmsg('比例限制不能大于100', 'error');
// return;
// }
// }
that.checkListValue(data).then(res => {
if (!res.flag) {
showMsg.showmsg(res.text, 'error');
return;
} else {
// 设置开启状态 1-->true
data.channelList.forEach(function(ele, index) {
ele.openStatus = ele.openStatus == true ? 1 : 0;
if (ele.channelType == 1) {
ele.strategyGoodsRelationIdArr = ele.goodsRelationIdArr;
delete ele.goodsRelationIdArr;
}
if (!ele.enterpriseRelationIdArr || !ele.enterpriseRelationIdArr.length) {
ele.enterpriseRelationIdArr = [];
}
if (!ele.storeRelationIdArr || !ele.storeRelationIdArr.length) {
ele.storeRelationIdArr = [];
}
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (ele.channelType == '9') {
ele.storeControlId = that.wmuuid;
}
});
let saveBool = true;
data.channelList.forEach(item => {
if (item.channelType == 1 && item.openStatus == 1) {
// 微信商城
// 适用商品
if (item.channelRelationProType == 2 && this.valueWx.length < 1) {
// 商品品牌
showMsg.showmsg('请选择商品品牌', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 3 && this.cateDataWx.length < 1) {
// 商品品类
showMsg.showmsg('请选择商品品类', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 4 && this.goodsListWx.length < 1) {
// 单件商品
showMsg.showmsg('请选择单件商品', 'error');
return (saveBool = false);
}
}
});
// 自定义人群
if (data.useCrowd == 2 && this.selectCount < 1) {
showMsg.showmsg('请选择人群定向', 'error');
return;
}
delete data.selectorParamsId;
// 规则需要乘以 10 去掉---20180906
// data.integralUse.fee = data.integralUse.fee;
// data.integralUse.integral = data.integralUse.integral;
data.integralUse = JSON.stringify(data.integralUse);
// if (data.channelList) {
// data.channelList.forEach(function(ele, index) {
// ele.openStatus = 1;
// });
// }
if (saveBool) {
that.saveForm(data);
}
}
})
} else {
log('error submit!!');
return false;
}
});
}
},
// 保存数据
saveForm(data) {
let that = this;
// log("添加积分抵现策略:" ,data)
let para = data;
postJson('/api-admin/save-member-integral-strategy', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
that.$message({
message: '添加成功',
type: 'success'
});
that.changeRoute('/pointSystem');
return;
}
errMsg.errorMsg(resData);
// that.updateData()
})
.catch(function(error) {
log(error);
});
},
// 去空值
bouncer(arr) {
return arr.filter(function(val) {
return !(!val || val === '');
});
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm.strategyName = temp.trim();
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
},
// input focus
inputFocus(obj, tag, flag) {
let that = this;
//log(tag);
that.tempTag = tag;
that.tempData = obj;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 折扣重新写的判断
formatInputChange(e) {
let that = this;
if (that.tempTag == 'integralUseDiscountControlLower' || that.tempTag == 'integralUseDiscountControlUpper') {
that.tempData[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.tempData[that.tempTag]) > 10) {
that.tempData[that.tempTag] = Number(10).toFixed(2);
}
return;
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
that.tempData.integralUseDiscountControlLower = Number(String(that.tempData.integralUseDiscountControlLower).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.tempData.integralUseDiscountControlLower).replace(/[^\.\d]/g, '')).toFixed(2);
that.tempData.integralUseDiscountControlUpper = Number(String(that.tempData.integralUseDiscountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.tempData.integralUseDiscountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2);
},
formatInputNum(e) {
let that = this;
that.ruleForm.integralUse.fee = strLength.getCharVal(String(that.ruleForm.integralUse.fee).replace(/[^\.\d]/g, ''), 6);
that.ruleForm.integralUse.integral = strLength.getCharVal(String(that.ruleForm.integralUse.integral).replace(/[^\d]/g, ''), 8);
that.ruleForm.channelList[0].useProportionalRestriction = strLength.getCharVal(String(that.ruleForm.channelList[0].useProportionalRestriction).replace(/[^\d]/g, ''), 3);
},
formatInputNumBlur() {
let that = this;
that.ruleForm.integralUse.fee = Number(strLength.getCharVal(String(that.ruleForm.integralUse.fee).replace(/[^\.\d]/g, ''), 6)).toFixed(1);
},
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// 获取商品品牌 1
getGoodsBrand() {
let that = this;
let para = {};
getRequest('/api-mall/list-enterprise-brand', para)
.then(res => {
// log(res.data.result)
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptionsWx = data;
that.goodsTreeOptionsLine = data;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 选择商品品牌 微信商城
selectGoodsStoreWx(val) {
this.valueWx = val;
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.forEach(ele => {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
},
// 单件商品 的 子组件显示方法
showGoodsDialog(type) {
let that = this;
that.goodsType = type;
that.goodShow = true;
that.goodsListId = [];
if (type == 'wx') {
// that.goodsListId = ['1']
that.goodsListId = that.goodsListWx;
} else if (type == 'line') {
// that.goodsListId = ['12121']
that.goodsListId = that.goodsListLine;
}
},
// 单件商品 的 子组件触发方法
selectGoods(val) {
let that = this;
that.goodShow = false;
that.goodsListId = [];
if (val) {
if (val.goodsType == 'wx') {
that.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1') {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.strategyGoodsRelationIds.forEach(ele => {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
that.goodsListWx = val.strategyGoodsRelationIds;
} else if (val.goodsType == 'line') {
that.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '3') {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.strategyGoodsRelationIds.forEach(ele => {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
that.goodsListLine = val.strategyGoodsRelationIds;
}
}
},
// 选择适用对象
changePeople(val) {
log(this.ruleForm.useCrowd);
},
showPeople() {
this.dialogVisiblePeople = true;
},
/* 人群筛选器 start */
getData() {
// 父组件调用子组件方法,触发父组件事件
this.$refs.peopleFilter.confirmSet();
},
getBackData(val) {
// log(val);
this.ruleForm.selectorParams = val;
},
findFilter(value) {
// 子组件触发父组件事件,返回过滤条件数据
// log(value);
this.ruleForm.crowdJson = value;
this.searchParams = value;
if (this.ruleForm.crowdJson) {
let arr = JSON.parse(this.ruleForm.crowdJson);
this.selectCount = 0;
if (arr.list) {
arr.list.forEach(item => {
this.selectCount += item.list.length;
});
}
}
},
getPeopleData() {
// 筛选器 弹框的确认按钮
let that = this;
that.$refs.peopleFilter.confirmSet();
setTimeout(function() {
if (that.searchParams) {
that.lsSaveBtn(that.searchParams);
}
}, 500);
},
lsSaveBtn(searchParams) {
// 人群筛选器弹框的确定按钮 临时保存
postRequest('/api-admin/get-screen-detail-param', {
requestProject: this.repProjectName,
tempBusinessId: this.tempBusinessId ? this.tempBusinessId : '',
detailParams: searchParams
})
.then(res => {
if (res.data.errorCode == 0) {
this.tempBusinessId = res.data.result;
this.useId = res.data.result;
this.dialogVisiblePeople = false;
this.searchParams = '';
} else {
this.$message.error(res.data.message);
}
})
.catch(err => {
log(err);
});
},
cancelFilter() {
this.$refs.peopleFilter.cancelSet();
},
// 隐藏保存按钮和确认按钮 (子组件会调用)
hideBtn() {
let that = this;
that.toggleTag = false;
},
// 显示编辑,保存按钮隐藏,确认按钮显示 (子组件会调用)
editShow() {
this.toggleTag = true;
},
editHide() {
this.toggleTag = false;
},
// 商品品类
getCateIds(val) {
// 获取数据
// log(val);
if (val.selectCateType == 'wx') {
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
this.cateDataWx.push(ele);
});
}
});
} else if (val.selectCateType == 'line') {
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '3') {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
this.cateDataLine.push(ele);
});
}
});
}
},
selectGoodsCateHide() {
// 调用子组件 商品品类组件的函数
if (this.ruleForm.channelList.length > 0) {
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1' && item.channelRelationProType == 3) {
// 微信商城
if (this.$refs.selectGoodsCate instanceof Array) {
this.$refs.selectGoodsCate[0].hideDragClick();
} else {
this.$refs.selectGoodsCate.hideDragClick();
}
}
});
}
},
// 获取商户列表
getCliqueInfo() {
let that = this;
let para = {};
postRequest('/api-admin/list-enterprise', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result.listEnterprise;
data.forEach(function(ele, index) {
ele.label = ele.brandName;
ele.value = ele.enterpriseId;
});
that.mechantOption = data;
// showMsg.showmsg('设置成功','success')
// 默认选择商户
// that.ruleForm.channelList[0].enterpriseRelationIdArr = [data[0].enterpriseId];
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 判断是否是太平鸟
getLoginInfo() {
let that = this;
let param = {};
postRequest('/api-auth/get-login-user-info', param)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (resData.result.enterpriseId == that.tpnEnterpriseId) {
that.tpnEditBool = true;
}
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
log(error);
});
}
},
components: {
topNavNew,
addGoods,
goodsCate
},
mounted() {
// 商品品牌
this.getGoodsBrand();
// 获取商户
this.getCliqueInfo();
this.getLoginInfo();
}
};
</script>
<style lang="less" scoped>
.right-box {
padding: 24px 32px;
}
.attention-wrap {
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.vue-treeselect {
display: inline-block;
vertical-align: top;
width: 300px;
}
.title-tip {
font-size: 12px;
color: #888;
}
.attention-content-wrap {
}
}
.form-wrap {
.el-input,
/deep/ .el-input-number {
width: 178px;
padding: 0 10px;
.el-input__inner {
text-align: left;
}
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
left: 303px;
color: #ccc;
font-size: 12px;
}
.el-select {
vertical-align: top;
}
.span-txt {
position: absolute;
left: 222px;
z-index: 2;
width: 300px;
text-align: center;
}
.padding-0 {
padding: 0;
}
.form-child {
width: 100%;
padding: 15px 20px 10px 0px;
background: #f5f6f9;
margin: 22px 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.margin-l-120 {
margin-left: 120px;
}
.margin-20 {
margin-top: 20px;
}
.tinymce-wrap {
width: 780px;
}
}
/*人群筛选器*/
.select-people {
max-height: 500px;
overflow-y: auto;
overflow-x: hidden;
}
.select-people /deep/ .marginLeft134 {
margin-left: 80px;
}
.select-people /deep/ .filter-content .member-templates-condition-title {
text-align: left;
font-size: 14px;
line-height: 24px;
}
.select-people /deep/ .filter-content {
margin-top: 0;
}
.people-btn-wrap {
width: 100%;
background: #f2f3f4;
box-sizing: border-box;
padding: 0 0 24px 100px;
}
.select-people /deep/ .detail {
margin-top: 0;
}
.margin-r-6 {
margin-right: 6px;
}
.right-box /deep/ .el-input__inner {
padding-right: 12px;
}
.right-box .padding-r-45 /deep/ .el-input__inner {
padding-right: 45px;
}
/* 商品品类 */
.goods-cate {
display: inline-block;
}
.goods-cate .goods-cate-content {
width: 217px;
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
<el-form-item label="等级名称" prop="gradeName" class="limit-el-item">
<el-input v-model="ruleForm.gradeName" class="w-340" @focus="focus('gradeName', 12)" @keyup.native="value => toInput(value)">
<!-- <template slot="append"><label class="input-label">{{inputNumObj.gradeName}}/12</label></template> -->
</el-input>
<label class="input-label">{{ inputNumObj.gradeName }}/12</label>
</el-form-item>
<el-form-item label="等级编码" prop="gradeCode" class="limit-el-item">
<el-input v-model="ruleForm.gradeCode" class="w-340" @focus="focus('gradeCode', 6)" @keyup.native="value => toInput(value)">
<!-- <template slot="append"><label class="input-label">{{inputNumObj.gradeCode}}/6</label></template> -->
</el-input>
<label class="input-label">{{ inputNumObj.gradeCode }}/6</label>
</el-form-item>
<el-form-item label="等级类型" prop="gradeType">
<el-radio v-model="ruleForm.gradeType" label="1">常规卡</el-radio>
<el-radio v-model="ruleForm.gradeType" label="2">特殊卡</el-radio>
</el-form-item>
<!-- 自动升级 -->
<!-- 自动升级 -->
<el-form-item label="自动升级" prop="">
<el-switch v-model="ruleForm.autoUpgrade"> </el-switch>
</el-form-item>
<el-form-item label="升级条件" prop="" v-if="ruleForm.autoUpgrade">
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelHighcostSelect">当天消费满</el-checkbox>
<el-input v-model="ruleForm.upLevelHighcost" @focus="inputFocus('upLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelDaystoredSelect">当天储值满</el-checkbox>
<el-input v-model="ruleForm.upLevelDaystored" @focus="inputFocus('upLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumcostDays" @focus="inputFocus('upLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelSumcost" @focus="inputFocus('upLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelCostimesSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelCosttimesDays" @focus="inputFocus('upLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelCosttimes" @focus="inputFocus('upLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumstoredDays" @focus="inputFocus('upLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.upLevelSumstored" @focus="inputFocus('upLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumintegralDays" @focus="inputFocus('upLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得 </label>
<el-input v-model="ruleForm.upLevelSumintegral" @focus="inputFocus('upLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
<!-- 自动降级 -->
<el-form-item label="自动降级" prop="">
<el-switch v-model="ruleForm.autoDowngrade"> </el-switch>
</el-form-item>
<div v-if="ruleForm.autoDowngrade">
<el-form-item label="会员等级有效期" prop="">
<label> 自升级之日起算 </label>
<el-input v-model="ruleForm.gradeEffectDay" @focus="inputFocus('gradeEffectDay', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</el-form-item>
<el-form-item label="保级条件" prop="">
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelHighcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelHighcostDays" @focus="inputFocus('lowLevelHighcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天消费满</label>
<el-input v-model="ruleForm.lowLevelHighcost" @focus="inputFocus('lowLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelDaystoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelDaystoredDays" @focus="inputFocus('lowLevelDaystoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天储值满</label>
<el-input v-model="ruleForm.lowLevelDaystored" @focus="inputFocus('lowLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumcostDays" @focus="inputFocus('lowLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelSumcost" @focus="inputFocus('lowLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelCosttimesSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelCosttimesDays" @focus="inputFocus('lowLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelCosttimes" @focus="inputFocus('lowLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumstoredDays" @focus="inputFocus('lowLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.lowLevelSumstored" @focus="inputFocus('lowLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumintegralDays" @focus="inputFocus('lowLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得</label>
<el-input v-model="ruleForm.lowLevelSumintegral" @focus="inputFocus('lowLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
</div>
<el-form-item class="font-0">
<el-button type="primary" @click="submitForm('ruleForm')">保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import strLength from '@/common/js/strlen';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'addMemberGrade',
data() {
return {
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '编辑商户会员等级',
path: '/memberGrade'
},
{
name: '添加商户会员等级',
path: ''
}
],
enterpId: '',
// 输入控制
inputNumObj: {
gradeName: 0,
gradeCode: 0
},
// 记录输入的
inputFlag: '',
inputFlagNum: '',
// form
ruleForm: {
gradeId: '', //等级id
gradeIntegralId: '', //等级积分id
gradeName: '', //等级名称
gradeCode: '', //等级代码
cardColor: '', //卡片颜色
cardFontColor: '', //卡字体颜色
gradeType: '1', //常规还是特殊卡 1常规 2特殊
discountRate: '2.0', // 折扣率
calculationMethod: '2', // 计算方式 1就低原则 2折上折
discountControl: '2', // 折扣控制 1所有折扣商品适用 2折扣范围
discountControlUpper: '0',
discountControlLower: '0',
autoUpgrade: true, //自动升级 1启用 2停用
upLevelHighcostSelect: false, // 当天消费满
upLevelHighcost: '',
upLevelDaystoredSelect: false, // 当天储值满
upLevelDaystored: '',
upLevelSumcostSelect: false, //x天内消费满x元
upLevelSumcostDays: '',
upLevelSumcost: '',
upLevelCostimesSelect: false, // x天内消费满x次
upLevelCosttimes: '',
upLevelCosttimesDays: '',
upLevelSumstoredSelect: false, //x天内储值满x元
upLevelSumstored: '',
upLevelSumstoredDays: '',
upLevelSumintegralSelect: false, //x天内获得x积分
upLevelSumintegral: '',
upLevelSumintegralDays: '',
autoDowngrade: true, //自动降级 1启用 2停用
gradeEffectDay: '', //自升级之日起算X天
lowLevelHighcostDays: '', //x天内单天消费满x元
lowLevelHighcost: '',
lowLevelHighcostSelect: false,
lowLevelDaystoredSelect: false, //x天内单天储值满x元
lowLevelDaystoredDays: '',
lowLevelDaystored: '',
lowLevelSumcostDays: '', //x天内消费满x元
lowLevelSumcostSelect: false,
lowLevelSumcost: '',
lowLevelCosttimesSelect: false, //x天内消费满x次
lowLevelCosttimesDays: '',
lowLevelCosttimes: '',
lowLevelSumstoredSelect: false, //x天内储值满x元
lowLevelSumstored: '',
lowLevelSumstoredDays: '',
lowLevelSumintegralSelect: false, //x天内获得x积分
lowLevelSumintegral: '',
lowLevelSumintegralDays: '',
gradeDescribe: '', //会员等级说明
upCliqueEnterpriseRelation: null
},
rules: {
gradeName: [{ required: true, message: '请输入等级名称', trigger: 'blur' }],
gradeCode: [{ required: true, message: '请输入等级编码', trigger: 'blur' }],
gradeType: [{ required: true, message: '请输入等级类型', trigger: 'blur' }]
},
cliqueId: '',
cliqueName: ''
};
},
created() {
// this.selectReplayStyle()
},
methods: {
changeRoute(route) {
this.$router.push(route);
},
// 返回
goBack() {
this.$router.go(-1);
},
inputFocus(tag, flag) {
let that = this;
log(tag);
that.tempTag = tag;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
log(e, e.target.value);
that.ruleForm[that.tempTag] = String(e.target.value).replace(/[^\.\d]/g, '');
// if (that.tempTag == 'discountControlLower' || that.tempTag =='discountControlUpper') {
// that.ruleForm[that.tempTag] = parseInt(String(e.target.value).replace(/[^\.\d]/g,'')).toFixed(2) == 'NaN'? '0.00': parseInt(String(e.target.value).replace(/[^\.\d]/g,'')).toFixed(2);
// return;
// }
if (!!that.tempFlag && that.tempFlag == 'day') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 4);
}
if (!!that.tempFlag && that.tempFlag == 'money') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 6);
}
if (!!that.tempFlag && that.tempFlag == 'point') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 8);
}
},
// 检查条件
checkUp(data) {
let flag = true;
if (!!data.autoUpgrade) {
if (!!data.upLevelHighcostSelect && !data.upLevelHighcost) {
flag = false;
}
if (!!data.upLevelDaystoredSelect && !data.upLevelDaystored) {
flag = false;
}
if (!!data.upLevelSumcostSelect && (!data.upLevelSumcostDays || !data.upLevelSumcost)) {
flag = false;
}
if (!!data.upLevelCostimesSelect && (!data.upLevelCosttimesDays || !data.upLevelCosttimes)) {
flag = false;
}
if (!!data.upLevelSumstoredSelect && (!data.upLevelSumstoredDays || !data.upLevelSumstored)) {
flag = false;
}
if (!!data.upLevelSumintegralSelect && (!data.upLevelSumintegralDays || !data.upLevelSumintegral)) {
flag = false;
}
}
return flag;
},
checkDown(data) {
let flag = true;
if (!!data.autoDowngrade) {
if (!data.gradeEffectDay) {
flag = false;
}
if (!!data.lowLevelHighcostSelect && (!data.lowLevelHighcostDays || !data.lowLevelHighcost)) {
flag = false;
}
if (!!data.lowLevelDaystoredSelect && (!data.lowLevelDaystoredDays || !data.lowLevelDaystored)) {
flag = false;
}
if (!!data.lowLevelSumcostSelect && (!data.lowLevelSumcostDays || !data.lowLevelSumcost)) {
flag = false;
}
if (!!data.lowLevelCosttimesSelect && (!data.lowLevelCosttimesDays || !data.lowLevelCosttimes)) {
flag = false;
}
if (!!data.lowLevelSumstoredSelect && (!data.lowLevelSumstoredDays || !data.lowLevelSumstored)) {
flag = false;
}
if (!!data.lowLevelSumintegralSelect && (!data.lowLevelSumintegralDays || !data.lowLevelSumintegral)) {
flag = false;
}
}
return flag;
},
// 保存
submitForm(formName) {
let that = this;
that.$refs[formName].validate(valid => {
if (valid) {
if (!that.ruleForm.gradeName) {
showMsg.showmsg('请填写等级名称', 'error');
return;
}
if (!that.ruleForm.gradeCode) {
showMsg.showmsg('请填写等级编码', 'error');
return;
}
if (!that.checkUp(that.ruleForm)) {
showMsg.showmsg('请填写升级条件', 'error');
return;
}
if (!that.checkDown(that.ruleForm)) {
showMsg.showmsg('请填写降级条件', 'error');
return;
}
let data = JSON.parse(JSON.stringify(that.ruleForm));
data.enterpriseId = that.enterpId;
data.discountControlUpper = data.discountControlUpper || '0';
data.discountControlLower = data.discountControlLower || '0';
data.autoDowngrade = data.autoDowngrade == true ? 1 : 2;
data.autoUpgrade = data.autoUpgrade == true ? 1 : 2;
data.gradeType = String(data.gradeType);
data.upLevelHighcostSelect = data.upLevelHighcostSelect == true ? 1 : 0;
data.upLevelDaystoredSelect = data.upLevelDaystoredSelect == true ? 1 : 0;
data.upLevelSumcostSelect = data.upLevelSumcostSelect == true ? 1 : 0;
data.upLevelCostimesSelect = data.upLevelCostimesSelect == true ? 1 : 0;
data.upLevelSumstoredSelect = data.upLevelSumstoredSelect == true ? 1 : 0;
data.upLevelSumintegralSelect = data.upLevelSumintegralSelect == true ? 1 : 0;
log(data.lowLevelHighcostSelect, data.lowLevelDaystoredSelect, data.lowLevelSumcostSelect, data.lowLevelCosttimesSelect, data.lowLevelSumstoredSelect, data.lowLevelSumintegralSelect);
data.lowLevelHighcostSelect = data.lowLevelHighcostSelect == true ? 1 : 0;
data.lowLevelDaystoredSelect = data.lowLevelDaystoredSelect == true ? 1 : 0;
data.lowLevelSumcostSelect = data.lowLevelSumcostSelect == true ? 1 : 0;
data.lowLevelCosttimesSelect = data.lowLevelCosttimesSelect == true ? 1 : 0;
data.lowLevelSumstoredSelect = data.lowLevelSumstoredSelect == true ? 1 : 0;
data.lowLevelSumintegralSelect = data.lowLevelSumintegralSelect == true ? 1 : 0;
// 值增加默认 0
data.upLevelHighcost = data.upLevelHighcost || 0;
data.upLevelDaystored = data.upLevelDaystored || 0;
data.upLevelSumcostDays = data.upLevelSumcostDays || 0;
data.upLevelSumcost = data.upLevelSumcost || 0;
data.upLevelCosttimesDays = data.upLevelCosttimesDays || 0;
data.upLevelCosttimes = data.upLevelCosttimes || 0;
data.upLevelSumstoredDays = data.upLevelSumstoredDays || 0;
data.upLevelSumstored = data.upLevelSumstored || 0;
data.upLevelSumintegralDays = data.upLevelSumintegralDays || 0;
data.upLevelSumintegral = data.upLevelSumintegral || 0;
data.gradeEffectDay = data.gradeEffectDay || 0;
data.lowLevelHighcostDays = data.lowLevelHighcostDays || 0;
data.lowLevelHighcost = data.lowLevelHighcost || 0;
data.lowLevelDaystoredDays = data.lowLevelDaystoredDays || 0;
data.lowLevelDaystored = data.lowLevelDaystored || 0;
data.lowLevelSumcostDays = data.lowLevelSumcostDays || 0;
data.lowLevelSumcost = data.lowLevelSumcost || 0;
data.lowLevelCosttimesDays = data.lowLevelCosttimesDays || 0;
data.lowLevelCosttimes = data.lowLevelCosttimes || 0;
data.lowLevelSumstoredDays = data.lowLevelSumstoredDays || 0;
data.lowLevelSumstored = data.lowLevelSumstored || 0;
data.lowLevelSumintegralDays = data.lowLevelSumintegralDays || 0;
data.lowLevelSumintegral = data.lowLevelSumintegral || 0;
that.saveInfo(data);
} else {
log('error submit!!');
return false;
}
});
},
// 保存
saveInfo(form) {
let that = this;
let para = form;
postRequest('/api-admin/do-save-member-grade', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('保存成功', 'success');
that.goBack();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
focus(name, num) {
let that = this;
log(name, num);
that.inputFlag = name;
that.inputFlagNum = num;
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm[that.inputFlag] = temp.trim();
that.inputNumObj[that.inputFlag] = strLength.getZhLen(that.ruleForm[that.inputFlag]);
}
},
components: {
topNavNew
},
mounted() {
let that = this;
that.cliqueId = that.$route.query.enterpriseId;
that.cliqueName = that.$route.query.name;
that.navpath[3].name = '编辑【' + that.cliqueName + '】会员等级';
that.navpath[3].path = '/memberGrade?enterpriseId=' + that.cliqueId + '&name=' + that.cliqueName;
that.navpath[4].name = '新增【' + that.cliqueName + '】等级';
that.enterpId = sessionStorage.getItem('enterpriseId');
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
/deep/ .el-form-item__label {
padding: 0 12px 0 0;
}
/deep/ .el-form {
.el-form-item:last-child {
/*margin-bottom: 0;*/
.el-button {
margin-top: 25px;
}
}
}
.el-input {
width: 180px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
.limit-el-item {
/deep/ .el-form-item__content {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
right: 10px;
top: 2px;
color: #909399;
font-size: 12px;
}
.check-cell {
.el-input {
margin: 0 10px;
}
& + .check-cell {
margin-top: 15px;
}
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<div class="form-wrap">
<el-form :model="ruleForm" ref="ruleForm" label-width="120px" class="demo-ruleForm">
<el-form-item label="策略名称" prop="">
<el-input v-model="ruleForm.strategyName" class="w-340" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ cateNameLength }}/20</label>
</el-form-item>
<template v-for="(item, index) in ruleForm.channelList">
<!-- 线下渠道 -->
<template v-if="item.channelType == 3">
<el-form-item label="适用线下渠道" prop="" :key="index">
<el-switch v-model="item.openStatus" active-text="启用" inactive-text="停用"> </el-switch>
</el-form-item>
<div class="form-child" v-if="item.openStatus" :key="index">
<el-form-item label="消费门店" prop="region">
<vue-gic-store-group :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="uuid" ref="storeGroup"></vue-gic-store-group>
</el-form-item>
<el-form-item label="适用商品" prop="name" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择" @change="changeGood($event)">
<el-option v-for="item in applyGoods" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
<!-- 二级 -->
<span class="span-txt" ref="treeinput" v-if="item.channelRelationProType == 2" @click="toggle('brand')">已选择 {{ item.strategyGoodsRelationIdArr ? item.strategyGoodsRelationIdArr.length : 0 }} 个品牌 </span>
<span class="span-txt" ref="treeinput" v-if="item.channelRelationProType == 3" @click="toggle('brand')">已选择 {{ item.strategyGoodsRelationIdArr ? item.strategyGoodsRelationIdArr.length : 0 }} 个品类 </span>
<treeselect v-if="item.channelRelationProType == 2 || item.channelRelationProType == 3" placeholder="" noOptionsText="暂无数据" noResultsText="无数据" :multiple="true" :always-open="goodsOpen" :options="goodsTreeOptions" :value-consists-of="valueConsistsOf" v-model="item.strategyGoodsRelationIdArr" />
<el-button v-if="item.channelRelationProType == 4" @click="showGoodsDialog">已选0件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01" :step="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<template v-if="item.channelType == 1">
<!-- 微信商城 -->
<el-form-item label="适用微信商城" prop="" :key="index">
<el-switch v-model="item.openStatus" active-text="启用" inactive-text="停用"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus == true" :key="index">
<el-form-item label="选择商户">
<el-select size="small" v-model="item.enterpriseRelationIdArr" placeholder="请选择" multiple>
<el-option v-for="(item, ind) in mechantOption" :key="ind" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="适用商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择" @change="changeGood($event)">
<el-option v-for="item in applyGoods" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
<!-- 二级 -->
<span class="span-txt" ref="treeinput" v-if="item.channelRelationProType == 2" @click="toggle('wx')">已选择 {{ item.goodsRelationIdArr ? item.goodsRelationIdArr.length : 0 }} 个品牌 </span>
<span class="span-txt" ref="treeinput" v-if="item.channelRelationProType == 3" @click="toggle('wx')">已选择 {{ item.goodsRelationIdArr ? item.goodsRelationIdArr.length : 0 }} 个品类 </span>
<treeselect v-if="item.channelRelationProType == 2 || item.channelRelationProType == 3" placeholder="" noOptionsText="暂无数据" noResultsText="无数据" :multiple="true" :always-open="wxOpen" :options="goodsTreeOptions" :value-consists-of="valueConsistsOf" v-model="item.goodsRelationIdArr" @select="selectWx($event, index, item)" />
<!--model=item.strategyGoodsRelationIdArr和上一个相同会有问题 -->
<el-button v-if="item.channelRelationProType == 4" @click="showGoodsDialog">已选0件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<!-- 微盟渠道-->
<template v-if="item.channelType == 9">
<el-form-item label="微盟渠道" prop="" :key="index">
<el-switch v-model="item.openStatus"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus == true" :key="index">
<el-form-item label="选择店铺">
<vue-gic-store-new :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="wmuuid" ref="wmstoreGroup"></vue-gic-store-new>
</el-form-item>
<el-form-item label="微盟商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in wMGoodOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="折扣控制" prop="region" class="input-margin-b">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
</template>
<el-form-item label="适用对象" prop="" class="margin-20">
<el-select v-model="ruleForm.useCrowd" placeholder="请选择">
<el-option v-for="item in applyObjOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="人群定向" v-if="ruleForm.useCrowd == 2" prop="" class="padding-0">
<el-button style="width: 214px;" @click="showPeople">已设置{{ selectCount }}项筛选</el-button>
</el-form-item>
<el-form-item label="获取规则" prop="">
<div>
<el-radio v-model="ruleForm.integralGetStatus" label="1">每消费</el-radio>
<el-input-number v-model="ruleForm.integralGet.fee" :precision="1" :controls="false" :max="10000.0" :min="0.1"></el-input-number>
<label>元,获取 </label>
<!-- <el-input v-model="ruleForm.integralGet.integral" @blur="formatInputNumBlur($event)"></el-input> -->
<el-input-number v-model="ruleForm.integralGet.integral" :precision="1" :controls="false" :max="10000.0" :min="0.1"></el-input-number>
<label>积分。取整策略为</label>
<el-select v-model="ruleForm.integralGetStrategy" placeholder="请选择">
<el-option v-for="item in cateOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</div>
<div>
<el-radio v-model="ruleForm.integralGetStatus" label="0" class="margin-20">不获取积分</el-radio>
</div>
</el-form-item>
<el-form-item label="积分冻结期" v-if="ruleForm.integralGetStatus == 1"> <el-input v-model="ruleForm.integralGetFreezeDays" @keyup.native="formatInputNum($event)"></el-input><label></label> </el-form-item>
<el-form-item label="积分有效期" v-if="ruleForm.integralGetStatus == 1"> <el-input v-model="ruleForm.integralGetEffectiveDays" @keyup.native="formatInputNum($event)"></el-input><label></label> </el-form-item>
<!-- 新增策略有效期配置 -->
<el-form-item label="策略有效期" prop="">
<!-- 1 永久 0 非永久 -->
<el-radio v-model="ruleForm.perpetualFlag" :label="1">永久有效</el-radio>
<el-radio v-model="ruleForm.perpetualFlag" :label="0">
在该时段内有效
<el-date-picker
v-if="ruleForm.perpetualFlag === 0"
v-model="ruleForm.perpetualDate"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']">
</el-date-picker>
</el-radio>
</el-form-item>
<el-form-item>
<el-button :disabled="tpnEditBool" type="primary" @click="submitForm('ruleForm')">保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
<!-- 添加商品 -->
<add-goods :goodShow="goodShow" :projectName="repProjectName" @selectGoods="selectGoods"></add-goods>
<!-- 人群筛选器的弹框 -->
<el-dialog title="自定义人群" :visible.sync="dialogVisiblePeople" width="980px">
<div class="select-people">
<vue-gic-group-people :useId="useId" :hasSearchData="hasSearchData" :sceneValue="sceneValue" ref="peopleFilter" @findFilter="findFilter" @getBackData="getBackData" @editHide="editHide" @editShow="editShow" @hideBtn="hideBtn"></vue-gic-group-people>
<div v-show="toggleTag" class="people-btn-wrap">
<el-row>
<el-button @click="getData" type="primary" size="small">确定</el-button>
<el-button @click="cancelFilter" size="small">取消</el-button>
</el-row>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-row>
<el-button @click="dialogVisiblePeople = false">取 消</el-button>
<el-button type="primary" @click="getPeopleData">确 定</el-button>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import addGoods from 'components/memberShip/add-goods';
import Treeselect from '@riophae/vue-treeselect';
// import the styles
import '@riophae/vue-treeselect/dist/vue-treeselect.css';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { postRequest, postJson } from '@/api/api';
import strLength from '@/common/js/strlen';
import { log } from '@/utils/index.js';
const timeStramp = {
year: new Date().getFullYear(),
month: new Date().getMonth(),
day: new Date().getDate()
};
export default {
name: 'addPointSytem',
data() {
return {
repProjectName: 'gic-clique',
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '积分制度',
path: '/pointSystem'
},
{
name: '添加积分获取策略',
path: ''
}
],
// 添加商品弹窗
goodShow: false,
// 输入字限制
inputFlagNum: 20,
// 门店
StoreOptions: [
{
label: '所有门店',
value: '1'
},
{
label: '门店分组',
value: '2'
},
{
label: '部分门店',
value: '3'
}
],
StoreTypeOptions: [
{
label: '所有门店',
value: '-1'
},
{
label: '自营',
value: '0'
},
{
label: '联营',
value: '1'
},
{
label: '加盟',
value: '2'
},
{
label: '代销',
value: '3'
},
{
label: '托管',
value: '4'
}
],
applyGoods: [
{
label: '所有商品',
value: '1'
}
// {
// label: '按商品品牌',
// value: '2',
// },
// {
// label: '按商品品类',
// value: '3',
// },
// {
// label: '按单件商品',
// value: '4',
// },
],
// tree
openOnFocus: true,
alwaysOpen: false,
goodsOpen: false,
wxOpen: false,
valueConsistsOf: 'ALL',
treeOptions: [],
storeNormalizer(node) {
return {
id: node.storeGroupId,
label: node.storeGroupName,
children: node.children
};
},
// 门店列表
storeListOptions: [],
// 适用商品
goodsTreeOptions: [],
// wxTreeOptions
wxTreeOptions: [],
// 第三方下拉
allShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
allGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 微盟渠道
wMShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
wMGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 商户
mechantOption: [],
// 适用对象
applyObjOption: [
{
label: '所有会员',
value: '1'
},
{
label: '自定义人群',
value: '2'
}
],
// 长度
cateNameLength: 0,
ruleForm: {
// 积分获取规则
integralStrategyId: '', //策略id
enterpriseId: '',
strategyName: '', //策略名称
strategyType: 1, // 策略类型 1消费积分 2积分抵现
useCrowd: '1', // 策略类型 1所有 2人群筛选
crowdJson: '', //人群筛选器内容
integralGetStatus: '1', // 积分获取开启 1是0否
integralGet: { fee: 1, integral: 1 },
integralGetStrategy: '1', // 取整策略 1四舍五入 2抹零 3向上取整
integralGetFreezeDays: 1, // 获取积分冻结天数
integralGetEffectiveDays: 1, // 获取积分有效天
integralUseStatus: '0', // 积分抵现开启 1是0否
integralUse: null, // 积分抵现 {fee:5,integral:5}
perpetualFlag: 1,
channelList: [
{
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '3', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
},
{
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '1', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
goodsRelationIdArr: [], // 复制的商品
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
},
{
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '8', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
},
{
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
}
],
perpetualFlag: 1,
perpetualDate: [
new Date(timeStramp.year, timeStramp.month, timeStramp.day, 0, 0),
new Date(timeStramp.year, timeStramp.month, timeStramp.day, 23, 59)
]
},
cateOptions: [
{
value: '1',
label: '四舍五入'
},
{
value: '2',
label: '抹零'
},
{
value: '3',
label: '进位制'
}
],
// 门店 新
uuid: '', // 新增传空,编辑必传,
options: [0, 1, 2, 3, 4, 5], // 0 全部 1 门店类型 2门店标签 3 门店区域 4 门店分组 5 部分门店
isAdd: true,
scencs: 'integral',
wmuuid: '', // 微盟
/* 人群筛选器 */
dialogVisiblePeople: false,
sceneValue: 'member', // 场景值
useId: '',
searchParams: '',
hasSearchData: '', // 当前页回显的数据(接口返回)
toggleTag: false,
selectCount: 0,
// 太平鸟标识
tpnEditBool: false,
tpnEnterpriseId: 'ff808081671d3ceb01672adebf4e6149'
};
},
methods: {
// 返回
goBack() {
this.$router.go(-1);
},
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// input focus
inputFocus(obj) {
let that = this;
that.tempData = obj;
},
formatInputNum(e) {
let that = this;
that.ruleForm.integralGetEffectiveDays = strLength.getCharVal(String(that.ruleForm.integralGetEffectiveDays).replace(/[^\d]/g, ''), 4);
that.ruleForm.integralGetFreezeDays = strLength.getCharVal(String(that.ruleForm.integralGetFreezeDays).replace(/[^\d]/g, ''), 4);
// that.ruleForm.integralGet.fee = strLength.getCharVal(String(that.ruleForm.integralGet.fee).replace(/[^\.\d]/g,''),6)
that.ruleForm.integralGet.integral = strLength.getCharVal(String(that.ruleForm.integralGet.integral).replace(/[^\d]/g, ''), 8);
},
async checkListValue(data) {
let obj = {
flag: true,
text: ''
};
if (!!data.channelList.length) {
for (let i = 0; i < data.channelList.length; i++) {
if (!!data.channelList[i].openStatus) {
if (!!data.channelList[i].openStatus && data.channelList[i].integralUseDiscountControl == 2) {
if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
obj.flag = false;
obj.text = '请填写折扣';
}
if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
obj.flag = false;
obj.text = '折扣格式有误';
}
}
if (data.channelList[i].channelType == 1 && !data.channelList[i].enterpriseRelationIdArr.length) {
obj.flag = false;
obj.text = '请选择商户';
}
if (data.channelList[i].channelType == 3) {
const storeGroupDom = this.$refs.storeGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.storeGroup[0].isStoreSave();
} else {
flag = await this.$refs.storeGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
if (data.channelList[i].channelType == 9) {
const storeGroupDom = this.$refs.wmstoreGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.wmstoreGroup[0].isStoreSave();
} else {
flag = await this.$refs.wmstoreGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
}
}
}
return obj;
},
// 保存
submitForm(formName) {
let that = this;
if (!that.tpnEditBool) {
this.$refs[formName].validate(valid => {
if (valid) {
// 处理数据
let data = JSON.parse(JSON.stringify(that.ruleForm));
if (!data.strategyName) {
showMsg.showmsg('请填写策略名称', 'error');
return;
}
let flag = !data.integralGet.fee || String(data.integralGet.integral) == '';
if (data.integralGetStatus == 1 && flag) {
showMsg.showmsg('请填写获取规则', 'error');
return;
}
if (data.integralGetStatus == 1) {
if (!Number(data.integralGet.fee)) {
showMsg.showmsg('获取规则中的消费金额不能为0', 'error');
return;
}
if (!Number(data.integralGet.integral)) {
showMsg.showmsg('获取规则中的获取积分不能为0', 'error');
return;
}
}
if (data.integralGetStatus == 1 && !Number(data.integralGetFreezeDays) && data.integralGetFreezeDays != '0') {
showMsg.showmsg('请填写积分冻结期', 'error');
return;
}
if (data.integralGetStatus == 1 && !Number(data.integralGetEffectiveDays)) {
showMsg.showmsg('请填写积分有效期', 'error');
return;
}
that.checkListValue(data).then(res => {
if (!res.flag) {
showMsg.showmsg(res.text, 'error');
return;
} else {
// 自定义人群
if (data.useCrowd == 2 && this.selectCount < 1) {
showMsg.showmsg('请选择人群定向', 'error');
return;
}
// 设置开启状态 1-->true
data.channelList.forEach(function(ele, index) {
ele.openStatus = ele.openStatus == true ? 1 : 0;
if (ele.channelType == 1) {
ele.strategyGoodsRelationIdArr = ele.goodsRelationIdArr;
delete ele.goodsRelationIdArr;
}
if (!ele.enterpriseRelationIdArr || !ele.enterpriseRelationIdArr.length) {
ele.enterpriseRelationIdArr = [];
}
if (!ele.storeRelationIdArr || !ele.storeRelationIdArr.length) {
ele.storeRelationIdArr = [];
}
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (ele.channelType == '3') {
ele.channelRelationStoreType = '1';
ele.channelStoreType = '-1';
ele.storeControlId = that.uuid;
}
if (ele.channelType == '9') {
ele.storeControlId = that.wmuuid;
}
});
data.integralGet.fee = parseInt(data.integralGet.fee * 10);
data.integralGet.integral = parseInt(data.integralGet.integral * 10);
data.integralGet = JSON.stringify(data.integralGet);
// 3.0_特殊策略新增有效期配置
if (data.perpetualFlag === 1) {
// 永久
// perpetualFlag 是否永久 0 非永久 1永久'
// startValidTime 有效期时间开始(毫秒时间戳)
// endValidTime 有效时间结束(毫秒时间戳)
} else {
// 时间区间
if (data.perpetualDate[0].indexOf('Z') > -1) {
// 说明第一次没有动过
data.startValidTime = new Date(this.transUTCTime(data.perpetualDate[0]) + ' 00:00').getTime();
data.endValidTime = new Date(this.transUTCTime(data.perpetualDate[1]) + ' 23:59').getTime();
} else {
data.startValidTime = new Date(data.perpetualDate[0].slice(0, -3)).getTime();
data.endValidTime = new Date(data.perpetualDate[1].slice(0, -3)).getTime();
}
}
delete data.perpetualDate;
that.saveForm(data);
}
});
} else {
log('error submit!!');
return false;
}
});
}
},
// 保存数据
saveForm(data) {
let that = this;
let para = data;
postJson('/api-admin/save-member-integral-strategy', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
that.$message({
message: '保存成功',
type: 'success'
});
that.changeRoute('/pointSystem');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 更新数据
updateData() {
let that = this;
// that.ruleForm.integralGet = JSON.parse(that.ruleForm.integralGet)
that.ruleForm.integralGet.fee = parseInt(that.ruleForm.integralGet.fee / 10);
that.ruleForm.integralGet.integral = parseInt(that.ruleForm.integralGet.integral / 10);
},
// 树形结构
toggle(flag) {
let that = this;
that.treeFlag = flag;
if (flag == 'store') {
that.alwaysOpen = true;
log(that.alwaysOpen);
}
if (flag == 'brand') {
that.goodsOpen = true;
}
if (flag == 'wx') {
that.wxOpen = true;
}
document.addEventListener('click', that.hidePanel, false);
},
hidePanel(e) {
let that = this;
log(that.$refs.treeinput, e.target.className);
if (typeof e.target.className == 'object') {
return;
}
let tag =
e.target.className != 'span-txt' &&
e.target.className != 'vue-treeselect__list' &&
e.target.className != 'vue-treeselect__label' &&
!e.target.className.includes('vue-treeselect__list-item vue-treeselect__indent-level') &&
e.target.className != 'vue-treeselect__minus-mark' &&
e.target.className != 'vue-treeselect__option' &&
e.target.className != 'vue-treeselect__option vue-treeselect__option--highlight' &&
!e.target.className.includes('vue-treeselect__checkbox vue-treeselect__checkbox--') &&
e.target.className != 'vue-treeselect__option-arrow-placeholder' &&
e.target.className != 'el-form demo-ruleForm' &&
e.target.className != 'vue-treeselect__option vue-treeselect__option--selected vue-treeselect__option--highlight' &&
e.target.className != 'vue-treeselect__list-item vue-treeselect__indent-level-1' &&
e.target.className != 'vue-treeselect__list-item vue-treeselect__indent-level-0' &&
e.target.className != 'vue-treeselect__checkbox-container' &&
e.target.className != 'vue-treeselect__option-arrow-container' &&
e.target.className != 'vue-treeselect__option-arrow vue-treeselect__option-arrow--rotated';
log(tag);
if (tag) {
if (that.treeFlag == 'store') {
that.alwaysOpen = false;
}
if (that.treeFlag == 'brand') {
that.goodsOpen = false;
}
if (that.treeFlag == 'wx') {
that.wxOpen = false;
}
}
},
// 搜索后出现下拉列表
// 点击
searchFocus(index, item) {
log(index, item);
},
// 搜索
remoteMethod(query) {
let that = this;
log('query:', query);
if (query !== '') {
// 获取搜索列表数据
that.getStoreList(query);
} else {
that.storeListOptions = [];
}
},
// 选择节点的方法
selectStore(e, item) {
log(e);
},
// 获取门店列表
getStoreList(query) {
let that = this;
log(query);
let para = {
searchParam: query,
flag: null,
requestProject: that.repProjectName
};
postRequest('/api-plug/query-store-by-code-name', para)
.then(res => {
log(res, res.data, res.data.errorCode);
let resData = res.data;
if (resData.errorCode == 0) {
resData.result.forEach(function(ele, index) {
ele.id = ele.storeId;
ele.value = ele.storeName;
ele.key = ele.storeId;
});
that.storeListOptions = resData.result;
return;
}
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
log(error);
// that.toLogin()
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 获取门店分组
getStoreGroup() {
let that = this;
let para = {};
postRequest('/api-admin/get-clique-storegroup', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
that.treeOptions = resData.result;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm.strategyName = temp.trim();
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
},
selStore(e, index, item) {
item.storeRelationIdArr = [];
},
// 微信
selectWx(e, index, item) {
let that = this;
item.strategyGoodsRelationIds = item.goodsRelationIds;
let data = that.ruleForm.channelList[index];
data.strategyGoodsRelationIds = [];
data.goodsRelationIds.forEach(function(ele, index) {
data.strategyGoodsRelationIds.push(ele);
});
},
// 线下渠道选择商品类别
changeGood(e) {
let that = this;
log('线下渠道选择商品类别:', e);
if (e == 2) {
that.getGoodsBrand();
}
if (e == 3) {
that.getGoodsCategory();
}
},
// 获取商品品牌
getGoodsBrand() {
let that = this;
let para = {};
postRequest('/api-admin/', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptions = data;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 获取商品分类
getGoodsCategory() {
let that = this;
let para = {};
postRequest('/api-admin/', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptions = data;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 子组件显示方法
showGoodsDialog() {
let that = this;
log('show');
that.goodShow = true;
},
// 子组件触发方法
selectGoods(val) {
let that = this;
log(val);
that.goodShow = false;
},
// 获取商户列表
getCliqueInfo() {
let that = this;
let para = {};
postRequest('/api-admin/list-enterprise', para)
.then(res => {
log(res.data);
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result.listEnterprise;
data.forEach(function(ele, index) {
ele.label = ele.brandName;
ele.value = ele.enterpriseId;
});
that.mechantOption = data;
log('商户列表:', that.mechantOption);
// showMsg.showmsg('设置成功','success')
that.ruleForm.channelList[0].enterpriseRelationIdArr = [data[0].enterpriseId];
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 选择人群筛选器
showPeople() {
this.dialogVisiblePeople = true;
},
/* 人群筛选器 start */
getData() {
// 父组件调用子组件方法,触发父组件事件
this.$refs.peopleFilter.confirmSet();
},
findFilter(value) {
// 子组件触发父组件事件,返回过滤条件数据
log(value);
this.ruleForm.crowdJson = value;
this.searchParams = value;
if (this.ruleForm.crowdJson) {
let arr = JSON.parse(this.ruleForm.crowdJson);
this.selectCount = 0;
if (arr.list) {
arr.list.forEach(item => {
this.selectCount += item.list.length;
});
}
}
},
cancelFilter() {
this.$refs.peopleFilter.cancelSet();
},
getBackData(val) {
// log(val);
this.ruleForm.selectorParams = val;
},
// 隐藏保存按钮和确认按钮 (子组件会调用)
hideBtn() {
let that = this;
that.toggleTag = false;
},
// 显示编辑,保存按钮隐藏,确认按钮显示 (子组件会调用)
editShow() {
this.toggleTag = true;
},
editHide() {
this.toggleTag = false;
},
getPeopleData() {
// 筛选器 弹框的确认按钮
let that = this;
that.$refs.peopleFilter.confirmSet();
setTimeout(_ => {
if (that.searchParams) {
that.lsSaveBtn(that.searchParams);
}
}, 500);
},
// 人群筛选器弹框的确定按钮 临时保存
lsSaveBtn(searchParams) {
postRequest('/api-admin/get-screen-detail-param', {
requestProject: this.repProjectName,
tempBusinessId: this.tempBusinessId ? this.tempBusinessId : '',
detailParams: searchParams
})
.then(res => {
if (res.data.errorCode == 0) {
this.tempBusinessId = res.data.result;
this.useId = res.data.result;
this.dialogVisiblePeople = false;
this.searchParams = '';
} else {
this.$message.error(res.data.message);
}
})
.catch(err => {
log(err);
});
},
/* end */
// 判断是否是太平鸟
getLoginInfo() {
let that = this;
let param = {};
postRequest('/api-auth/get-login-user-info', param)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (resData.result.enterpriseId == that.tpnEnterpriseId) {
that.tpnEditBool = true;
}
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
log(error);
});
}
},
components: {
topNavNew,
Treeselect,
addGoods
},
created() {
// this.selectReplayStyle()
log('create');
},
beforeMount() {
log('beforeMount');
},
mounted() {
let that = this;
// 获取商户列表
that.getCliqueInfo();
// 获取门店分组
that.getStoreGroup();
that.getLoginInfo();
}
};
</script>
<style lang="scss" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.vue-treeselect {
display: inline-block;
vertical-align: top;
width: 300px;
}
.attention-content-wrap {
}
}
.form-wrap {
.el-input {
width: 178px;
padding: 0 10px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
left: 303px;
color: #ccc;
font-size: 12px;
}
.el-select {
vertical-align: top;
}
.span-txt {
position: absolute;
z-index: 2;
width: 300px;
text-align: center;
}
.padding-0 {
padding: 0;
}
.form-child {
padding: 15px 20px 10px 0px;
background: #f5f6f9;
margin: 22px 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.margin-20 {
margin-top: 20px;
}
.tinymce-wrap {
width: 780px;
}
}
/*树形*/
.vue-treeselect /deep/ {
/deep/ .vue-treeselect__control {
height: 30px;
/*line-height: 36px;*/
cursor: pointer;
}
.vue-treeselect__placeholder {
line-height: 30px;
font-size: 12px;
}
.vue-treeselect__multi-value-item-container,
.vue-treeselect__multi-value {
line-height: 1;
height: 0;
opacity: 0;
}
span.vue-treeselect__multi-value-label {
line-height: 1;
}
.vue-treeselect__multi-value-item {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #f0f2f5;
color: #909399;
}
.vue-treeselect__value-remove {
color: #909399;
}
&:not(.vue-treeselect--disabled) .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-disabled):hover {
background-color: #f0f2f5;
color: #909399;
}
.vue-treeselect--searchable:not(.vue-treeselect--disabled) .vue-treeselect__value-container {
cursor: pointer;
}
.vue-treeselect__x-container {
display: none;
}
.vue-treeselect__control-arrow {
display: none;
}
.vue-treeselect__control-arrow-container {
position: relative;
}
/deep/ .vue-treeselect__value-container {
line-height: 30px;
}
/deep/.vue-treeselect__control-arrow-container:after,
.vue-treeselect__control-arrow-container:before {
border: 6px solid transparent;
border-left: 6px solid #fff;
width: 0;
height: 0;
position: absolute;
top: 49%;
left: 50%;
margin-left: -6px;
content: ' ';
margin-top: -3px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
/deep/ .vue-treeselect__control-arrow-container:before {
border-left-color: #c0c4cc;
top: 52%;
}
&.vue-treeselect--focused .vue-treeselect__control-arrow-container:after,
&.vue-treeselect--focused .vue-treeselect__control-arrow-container:before {
margin-top: -6px;
-webkit-transform: rotateZ(-90deg);
-moz-transform: rotateZ(-90deg);
-o-transform: rotateZ(-90deg);
transform: rotateZ(-90deg);
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
&.vue-treeselect--focused .vue-treeselect__control-arrow-container:before {
border-left-color: #c0c4cc;
top: 47%;
}
.vue-treeselect--has-value .vue-treeselect__multi-value {
margin-bottom: 0;
}
}
/*人群筛选器*/
.select-people {
max-height: 500px;
overflow-y: auto;
overflow-x: hidden;
}
.select-people /deep/ .marginLeft134 {
margin-left: 80px;
}
.select-people /deep/ .filter-content .member-templates-condition-title {
text-align: left;
font-size: 14px;
line-height: 24px;
}
.select-people /deep/ .filter-content {
margin-top: 0;
}
.people-btn-wrap {
width: 100%;
background: #f2f3f4;
box-sizing: border-box;
padding: 0 0 24px 100px;
}
.select-people /deep/ .detail {
margin-top: 0;
}
</style>
<template>
<div class="right-wrap">
<topNav :navpath="navpath"></topNav>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<div class="group-contain">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
<el-form-item label="集团名称" prop="cliqueName">
<el-input v-model="ruleForm.cliqueName" @focus="focus('cliqueName', 10)" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ inputNumObj.cliqueName }}/10</label>
</el-form-item>
<el-form-item label="公司名称" prop="enterpriseName">
<el-input v-model="ruleForm.enterpriseName" @focus="focus('enterpriseName', 20)" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ inputNumObj.enterpriseName }}/20</label>
</el-form-item>
<el-form-item label="所在地区" prop="region" class="city-area">
<vue-area-ab :projectName="projectName" :areaOptions="areaOptions" @selected="selected"></vue-area-ab>
</el-form-item>
<el-form-item label="详细地址" prop="addressDetail">
<el-input v-model="ruleForm.addressDetail" @focus="focus('addressDetail', 50)" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ inputNumObj.addressDetail }}/50</label>
</el-form-item>
<el-form-item label="集团logo" prop="qcloudImageUrl">
<div>
<el-upload class="avatar-uploader" :action="uploadUrl()" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
<div class="avatar-uploader-wrap" v-loading="uploadLoading">
<img v-if="ruleForm.qcloudImageUrl" :src="ruleForm.qcloudImageUrl" class="avatar" @mouseover="showImage(ruleForm.qcloudImageUrl)" @click="hideImage" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</div>
</el-upload>
<p class="upload-tip">只能上传规格为1:1的 jpg/jpeg 图片,且不超过1Mb</p>
</div>
</el-form-item>
<el-form-item label="关联商户">
<div class="link-shop">
<template v-for="(item, index) in ruleForm.enterpriseList">
<router-link tag="a" target="_blank" :to="{ path: '/login', query: { enterpriseId: item.enterpriseId, backgroundMode: item.backgroundMode } }" :key="index">
<img :src="item.qcloudImageUrl" alt="" />
<span>{{ item.brandName }}</span>
</router-link>
</template>
</div>
</el-form-item>
<el-form-item label="营业时间模板" prop="storeBusinessTime">
<el-time-picker is-range v-model="ruleForm.storeBusinessTime" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" placeholder="选择时间范围" format="HH:mm"> </el-time-picker>
</el-form-item>
<el-form-item label="客服热线" prop="customerPhone">
<el-input v-model="ruleForm.customerPhone" @focus="focus('customerPhone', 30)" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ inputNumObj.customerPhone }}/30</label>
</el-form-item>
<el-form-item label="集团简介" prop="enterpriseDescription">
<el-input type="textarea" v-model="ruleForm.enterpriseDescription" style="height: 96px;" @focus="focus('enterpriseDescription', 200)" @keyup.native="value => toInput(value)"> </el-input>
<template>
<label class="input-label textarea-label">{{ inputNumObj.enterpriseDescription }}/200</label>
</template>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">保 存</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<vue-gic-img-preview :imgUrl="imgUrl" :imgShowFlag="imgShowFlag" @hideImage="hideImage"></vue-gic-img-preview>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import strLength from '@/common/js/strlen';
import newTime from '@/common/js/timeFormat';
import topNav from 'components/nav/nav';
import { getRequest } from '@/api/api';
// eslint-disable-next-line
import qs from 'qs';
import { log } from '@/utils/index.js';
export default {
name: 'public_num_attention',
data() {
return {
projectName: 'gic-clique', // 当前项目名
areaOptions: {
provinceName: '',
provinceId: '',
cityName: '',
cityId: '',
countryName: '',
countyId: ''
},
navpath: [
{
name: '首页',
path: '/'
},
{
name: '集团信息',
path: ''
}
],
upUrl: '', // 上传地址
uploadLoading: false,
// 预览上传图片
imgShowFlag: false, // 是否弹框显示图片,true: 显示;false: 不显示
imgUrl: '',
ruleForm: {
cliqueName: '',
enterpriseName: '',
region: '',
addressDetail: '',
qcloudImageUrl: '',
enterpriseList: [
{
enterpriseId: '',
enterpriseName: '达摩',
qcloudImageUrl: '/'
}
],
storeBusinessTime: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)],
date1: '',
date2: '',
customerPhone: '',
enterpriseDescription: ''
},
rules: {
cliqueName: [{ required: true, message: '请输入集团名称', trigger: 'blur' }],
enterpriseName: [{ required: true, message: '请输入公司名称', trigger: 'blur' }],
region: [{ required: true, message: '请选择所在地区', trigger: 'blur' }],
addressDetail: [{ required: true, message: '请输入详细地址', trigger: 'change' }],
storeBusinessTime: [{ required: true, message: '请选择营业时间', trigger: 'change' }],
date1: [{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }],
date2: [{ type: 'date', required: true, message: '请选择时间', trigger: 'change' }],
customerPhone: [{ required: true, message: '请输入客服热线', trigger: 'change' }],
enterpriseDescription: [{ required: true, message: '请输入集团简介', trigger: 'blur' }]
},
inputNumObj: {
//输入字数
cliqueName: 0,
enterpriseName: 0,
addressDetail: 0,
customerPhone: 0,
enterpriseDescription: 0
},
// 记录输入的
inputFlag: '',
inputFlagNum: '',
baseUrl: '' // 域名
};
},
beforeMount() {
let that = this;
let host = window.location.origin;
log('当前host:', host);
if (host.indexOf('localhost') != '-1') {
that.baseUrl = 'http://gicdev.demogic.com';
} else {
that.baseUrl = host;
}
that.upUrl = that.baseUrl + '/api-plug/upload-img?wxFlag=1';
},
created() {
// this.selectReplayStyle()
log('created');
},
mounted() {
let that = this;
log('mounted');
that.getGroupInfo();
},
methods: {
// 预览图片方法
showImage(src) {
let that = this;
log(src);
that.imgShowFlag = true;
that.imgUrl = src;
},
hideImage(val) {
let that = this;
log(val);
that.imgShowFlag = false;
},
uploadUrl() {
let that = this;
let host = window.location.origin;
let baseUrl;
log('当前host:', host);
if (host.indexOf('localhost') != '-1') {
baseUrl = 'http://gicdev.demogic.com';
} else {
baseUrl = host;
}
that.upUrl = baseUrl + '/api-plug/upload-img?wxFlag=1&requestProject=gic-clique';
log(that.upUrl);
return that.upUrl;
},
changeRoute(route) {
let that = this;
that.$router.push(route);
},
// 保存
submitForm(formName) {
let that = this;
that.$refs[formName].validate(valid => {
if (valid) {
let newFormData = JSON.parse(JSON.stringify(that.ruleForm));
log(newFormData);
newFormData.storeBusinessTime = newTime.dateToTime(newFormData.storeBusinessTime);
// 发送的数据
log(newFormData.storeBusinessTime);
// 保存方法
that.saveGroupInfo(newFormData);
} else {
log('error submit!!');
that.$message.error({
duration: 1000,
message: '请填写完信息'
});
return false;
}
});
},
// 上传
handleAvatarSuccess(res, file) {
let that = this;
that.uploadLoading = false;
that.imgShowFlag = false;
log('上传成功回调:', res);
if (res.errorCode == 0) {
that.ruleForm.qcloudImageUrl = res.result[0].qcloudImageUrl; //URL.createObjectURL(file.raw);
that.ruleForm.imageFiledCode = res.result[0].imageFiledCode;
that.ruleForm.imageUrl = res.result[0].wxImg;
} else {
errMsg.errorMsg(res);
}
},
beforeAvatarUpload(file) {
let that = this;
that.imgShowFlag = false;
const isJPG = file.type === 'image/jpeg' || file.type === 'image/jpg';
const isLt2M = file.size / 1024 / 1024 <= 1;
if (!isJPG) {
that.$message.error('您只能上传 JPG/JPEG 图片!');
}
if (!isLt2M) {
that.$message.error('您只能上传小于 1Mb 的图片!');
}
return (
isJPG &&
isLt2M &&
new Promise(function(resolve, reject) {
let reader = new FileReader();
reader.onload = function(event) {
let image = new Image();
image.onload = function() {
let width = this.width;
let height = this.height;
log(width, height);
if (width !== height) {
that.uploadLoading = false;
that.$message.error('您只能上传规格为 1:1 的图片!');
reject();
}
resolve();
};
that.uploadLoading = true;
image.src = event.target.result;
log('上传成功:', event.target.result);
};
reader.readAsDataURL(file);
})
);
},
focus(name, num) {
let that = this;
log(name, num);
that.inputFlag = name;
that.inputFlagNum = num;
},
// 输入
toInput: function(value) {
let that = this;
log(value);
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
log(temp);
that.ruleForm[that.inputFlag] = temp.trim();
that.inputNumObj[that.inputFlag] = strLength.getZhLen(that.ruleForm[that.inputFlag]);
log(that.ruleForm[that.inputFlag]);
},
// 省市县选择
selected(val) {
log(val);
let that = this;
if (!!val.country) {
that.ruleForm.region = val;
log(val.areaId);
that.ruleForm.areaId = val.areaId;
} else {
that.ruleForm.region = '';
}
},
// 保存集团信息
saveGroupInfo(form) {
let that = this;
let para = {
requestProject: that.projectName,
cliqueName: form.cliqueName,
enterpriseName: form.enterpriseName,
brandName: form.brandName,
addressDetail: form.addressDetail,
imageUrl: form.imageUrl,
imageFieldCode: form.imageFieldCode,
qcloudImageUrl: form.qcloudImageUrl,
storeBusinessTime: form.storeBusinessTime,
customerPhone: form.customerPhone,
enterpriseDescription: form.enterpriseDescription,
areaId: form.areaId
};
getRequest('/api-admin/save-enterprise-info', para)
.then(res => {
// log(res,res.data,res.data.errorCode)
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('保存成功', 'success');
return;
}
// that.userFormVisible = false;
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
// that.toLogin()
// that.userFormVisible = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 跳转商户
redirect(e, enterpriseId) {
let that = this;
let para = {
eid: enterpriseId
};
getRequest('/api-auth/do-login-for-clique', para)
.then(res => {
// log(res,res.data,res.data.errorCode)
let resData = res.data;
if (resData.errorCode == 0) {
let href = that.baseUrl + '';
window.open(href, '_blank', 'toolbar=yes, width=1300, height=900');
return;
}
// that.userFormVisible = false;
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
// that.toLogin()
// that.userFormVisible = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 获取集团信息
getGroupInfo() {
let that = this;
let para = {
requestProject: that.projectName
};
getRequest('/api-admin/enterprise-info', para)
.then(res => {
// log(res,res.data,res.data.errorCode)
let resData = res.data;
if (resData.errorCode == 0) {
// 设置省市县
let newEnterprise = resData.result.enterprise;
// that.setArea(JSON.parse(JSON.stringify(newEnterprise)));
//
log(resData.result.enterprise);
newEnterprise.region = {};
newEnterprise.region.areaId = newEnterprise.areaId;
newEnterprise.region.provinceId = newEnterprise.province;
newEnterprise.region.provinceName = newEnterprise.provinceName;
newEnterprise.region.cityId = newEnterprise.city;
newEnterprise.region.cityName = newEnterprise.cityName;
newEnterprise.region.countyId = newEnterprise.country;
newEnterprise.region.countryName = newEnterprise.countryName;
that.areaOptionsNew = {};
that.areaOptionsNew.provinceName = newEnterprise.provinceName; // 默认的省市区传值
that.areaOptionsNew.provinceId = newEnterprise.province;
that.areaOptionsNew.cityName = newEnterprise.cityName;
that.areaOptionsNew.cityId = newEnterprise.city;
that.areaOptionsNew.countryName = newEnterprise.countryName;
that.areaOptionsNew.countyId = newEnterprise.country;
let obj = JSON.stringify(that.areaOptionsNew); // 深拷贝
that.areaOptions = JSON.parse(obj);
// that.areaOptions = JSON.parse(JSON.stringify(newEnterprise.region))
// 时间
if (!!newEnterprise.storeBusinessTime) {
newEnterprise.storeBusinessTime = newTime.timeToDate(newEnterprise.storeBusinessTime);
}
// 长度
if (!!newEnterprise.cliqueName) {
that.inputNumObj.cliqueName = strLength.getZhLen(newEnterprise.cliqueName);
}
if (!!newEnterprise.enterpriseName) {
that.inputNumObj.enterpriseName = strLength.getZhLen(newEnterprise.enterpriseName);
}
if (!!newEnterprise.addressDetail) {
that.inputNumObj.addressDetail = strLength.getZhLen(newEnterprise.addressDetail);
}
if (!!newEnterprise.customerPhone) {
that.inputNumObj.customerPhone = strLength.getZhLen(newEnterprise.customerPhone);
}
if (!!newEnterprise.enterpriseDescription) {
that.inputNumObj.enterpriseDescription = strLength.getZhLen(newEnterprise.enterpriseDescription);
}
that.ruleForm = newEnterprise;
that.ruleForm.enterpriseList = resData.result.enterpriseList;
log(that.ruleForm);
return;
}
// that.userFormVisible = false;
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
// that.toLogin()
// that.userFormVisible = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
setArea(obj) {
let that = this;
that.areaOptions.areaId = obj.areaId;
that.areaOptions.provinceId = obj.province;
that.areaOptions.provinceName = obj.provinceName;
that.areaOptions.cityId = obj.city;
that.areaOptions.cityName = obj.cityName;
that.areaOptions.countyId = obj.country;
that.areaOptions.countryName = obj.countryName;
}
},
components: {
topNav
}
};
</script>
<style lang="scss" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.attention-content-wrap {
}
/deep/ .el-form-item__label {
padding: 0 12px 0 0;
}
/deep/ .el-form {
.el-form-item:last-child {
/*margin-bottom: 0;*/
}
.el-form-item__content {
width: 700px;
}
.city-area {
/deep/ .w-160 {
width: 228px;
& + .w-160 {
/*margin-left: 6px;*/
}
}
}
}
}
.group-contain {
.el-input {
width: 700px;
&.el-date-editor {
width: 300px;
}
}
.el-textarea {
width: 700px;
/*height: 300px;*/
/deep/ .el-textarea__inner {
resize: none;
height: 96px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
/deep/ .input-label {
position: absolute;
right: 10px;
top: 2px;
color: #909399;
font-size: 12px;
}
.textarea-label {
position: absolute;
right: 10px;
top: 90px;
color: #909399;
}
.upload-tip {
color: #909399;
font-size: 12px;
line-height: 12px;
}
.avatar-uploader {
/deep/ .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
&:hover {
border-color: #1890ff;
}
}
}
.avatar-uploader .el-upload:hover {
border-color: #1890ff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 100px;
height: 100px;
line-height: 100px;
text-align: center;
}
.avatar-uploader-wrap {
width: 128px;
height: 128px;
padding: 8px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.avatar {
width: 100%;
// height: 120px;
display: block;
}
.el-icon-loading {
}
.link-shop {
width: 800px;
font-size: 0;
a {
display: inline-block;
width: 250px;
border: 1px solid #e3e5e9;
border-radius: 2px;
padding: 10px 15px;
margin-right: 16px;
margin-bottom: 10px;
color: #333;
font-size: 14px;
cursor: pointer;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
& + a {
/*margin-left: 10px;*/
}
}
img {
display: inline-block;
vertical-align: middle;
width: 60px;
height: 60px;
}
span {
display: inline-block;
vertical-align: middle;
}
}
.el-form-item.is-success /deep/ .el-input__inner,
.el-form-item.is-success /deep/ .el-input__inner:focus,
.el-form-item.is-success /deep/ .el-textarea__inner,
.el-form-item.is-success /deep/ .el-textarea__inner:focus {
border-color: #dcdfe6;
}
}
</style>
<template>
<div class="right-wrap">
<topNav :navpath="navpath"></topNav>
<div class="right-content" @click="selectGoodsCateHide">
<div class="right-box">
<div class="attention-wrap">
<div class="form-wrap">
<el-form :rules="rules" :model="ruleForm" ref="ruleForm" label-width="120px" class="demo-ruleForm">
<el-form-item label="策略名称" prop="strategyName" class="padding-0">
<el-input v-model="ruleForm.strategyName" class="w-340 padding-0" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ cateNameLength }}/20</label>
</el-form-item>
<el-form-item label="适用条件" class="padding-0">
<div class="title-tip">该设置只对微信商城中的积分抵现起作用。</div>
</el-form-item>
<template v-for="(item, index) in ruleForm.gradeStrategyChannelList">
<template v-if="item.channelType == 1">
<el-form-item label="适用微信商城" prop="" :key="index">
<el-switch v-model="item.status"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.status" :key="index">
<el-form-item label="选择商户">
<el-select v-model="item.cliqueEnterpriseIdArr" placeholder="请选择" multiple size="small">
<el-option v-for="item in mechantOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="适用商品" class="padding-0">
<el-select class="fl" style="margin-right: 10px;" v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in applyGoods" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
<!-- 二级 -->
<!-- 商品品牌 -->
<el-select size="small" class="fl" @change="selectGoodsStoreWx" v-if="item.channelRelationProType == 2" v-model="valueWx" multiple placeholder="请选择">
<el-option v-for="item in goodsTreeOptionsWx" :key="item.brandId" :label="item.brandName" :value="item.brandId"> </el-option>
</el-select>
<!-- 商品品类 -->
<div v-if="item.channelRelationProType == 3" class="fl goods-cate">
<goodsCate ref="selectGoodsCate" :selectCateType="selectCateTypeWx" :selectCateData="selectCateDataWx" @getCateIds="getCateIds"></goodsCate>
</div>
<el-button style="width:202px" class="fl" v-if="item.channelRelationProType == 4" @click="showGoodsDialog('wx')">已选{{ goodsListWx.length }}件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<!-- 微盟渠道-->
<template v-if="item.channelType == 9">
<el-form-item label="微盟渠道" prop="" :key="index">
<el-switch v-model="item.status"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.status == true" :key="index">
<el-form-item label="选择店铺">
<vue-gic-store-new :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="wmuuid" ref="wmstoreGroup"></vue-gic-store-new>
</el-form-item>
<el-form-item label="微盟商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in wMGoodOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="折扣控制" prop="region" class="input-margin-b">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
</template>
<el-form-item label="折扣" prop="discountRate" class="margin-20">
<el-input @focus="inputFocus('discountRate')" @change="formatInputChange($event)" v-model="ruleForm.discountRate"></el-input>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00</span>
</el-form-item>
<el-form-item label="计算方式" prop="">
<el-radio v-model="ruleForm.calculationMethod" label="1">就低原则</el-radio>
<el-radio v-model="ruleForm.calculationMethod" label="2">折上折</el-radio>
</el-form-item>
<el-form-item>
<el-row>
<el-button type="primary" @click.stop.prevent="submitForm('ruleForm')">保 存</el-button>
<el-button @click.stop.prevent="goBack">返 回</el-button>
</el-row>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<!-- 添加商品 -->
<add-goods :goodsListId="goodsListId" :goodsType="goodsType" :goodShow.sync="goodShow" :projectName="repProjectName" @selectGoods="selectGoods"></add-goods>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNav from 'components/nav/navNew';
import addGoods from 'components/memberShip/add-goods';
import goodsCate from 'components/memberShip/goodsCate';
import strLength from '@/common/js/strlen';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { getRequest, postRequest, postJson } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'editGroupCate',
data() {
return {
repProjectName: 'gic-web',
navpath: [
{
name: '会员管理',
path: ''
},
{
name: '会员体系',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '编辑会员等级',
path: '/editGroupGrade'
},
{
name: '编辑折扣策略',
path: ''
}
],
rules: {
strategyName: [{ required: true, message: '请填写策略名称', trigger: 'blur' }]
},
// 添加商品弹窗
goodShow: false,
// 长度
cateNameLength: 0,
// 输入字限制
inputFlagNum: 20,
// 门店
StoreOptions: [
{
label: '所有门店',
value: '0'
},
{
label: '门店分组',
value: '1'
},
{
label: '部分门店',
value: '2'
}
],
// 商户
mechantOption: [],
applyGoods: [
{
label: '所有商品',
value: '1'
},
{
label: '按商品品牌',
value: '2'
},
{
label: '按商品品类',
value: '3'
},
{
label: '按单件商品',
value: '4'
}
],
// 微盟渠道
wMShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
wMGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 商品品牌
goodsTreeOptionsWx: [],
valueWx: [],
goodsTreeOptionsLine: [],
valueLine: [],
// 门店 新
uuid: '', // 新增传空,编辑必传,
options: [0, 1, 2, 3, 4, 5], // 0 全部 1 门店类型 2门店标签 3 门店区域 4 门店分组 5 部分门店
isAdd: true,
scencs: 'integral',
wmuuid: '', // 微盟
ruleForm: {
// 积分获取规则
gradeStrategyId: '', //策略id
gradeId: '', //等级id
strategyName: '1211', //策略名称
strategyRelationType: 3, // /** 策略关联类型 1所有商品 2商品品牌 3商品类目 4部分商品 */
discountRate: 1.0, // 折扣率
calculationMethod: 2, // 计算方式 1就低原则 2折上折
discountControl: 2, // 折扣控制 1所有折扣商品适用 2折扣范围
discountControlUpper: 0, // 折扣控制 折扣范围 下限
discountControlLower: 0, //折扣控制 折扣范围 上限
gradeStrategyGoodsRelationIds: [], // 策略关联商品信息id
cliqueEnterpriseIds: [], // 策略关联商户信息
relationCount: 0,
enterpriseMS: null,
goodsCategoryList: [],
perpetualFlag: 1,
gradeStrategyChannelList: [
{
gradeStrategyChannelId: '', //id
channelType: '1', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
status: true, //渠道配置是否启用 1启用 0停用
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
strategyGoodsRelationIdArr: [], // 商品
cliqueEnterpriseIdArr: [],
},
{
gradeStrategyChannelId: '', //id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
status: true, //渠道配置是否启用 1启用 0停用
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
strategyGoodsRelationIdArr: [], // 商品
cliqueEnterpriseIdArr: [],
}
]
},
// 商品品类
selectCateDataWx: [], // 用于回显
selectCateDataLine: [],
selectCateTypeWx: 'wx',
selectCateTypeLine: 'line',
cateDataWx: [],
cateDataLine: [],
// 单个商品类型
goodsType: 'wx', // 单个商品类型 wx:微信商城,line:线下渠道
goodsListId: [],
goodsListWx: [],
goodsListLine: [],
// 商品品牌
goodsTreeOptions: [],
value5: [],
changeGoodData: ''
};
},
mounted() {
let that = this;
that.getGoodsBrand(); // 商品品牌
that.ruleForm.strategyId = that.$route.query.strategyId;
that.ruleForm.gradeId = that.$route.query.gradeId;
if (that.ruleForm.gradeId) {
that.navpath[3].path = '/editGroupGrade?gradeId=' + that.ruleForm.gradeId;
}
that.getInfo();
},
methods: {
// 返回
goBack() {
this.$router.go(-1);
},
async checkListValue(data) {
let obj = {
flag: true,
text: ''
};
if (!!data.gradeStrategyChannelList.length) {
for (let i = 0; i < data.gradeStrategyChannelList.length; i++) {
if (!!data.gradeStrategyChannelList[i].status) {
if (!!data.gradeStrategyChannelList[i].status && data.gradeStrategyChannelList[i].integralUseDiscountControl == 2) {
if (!data.gradeStrategyChannelList[i].integralUseDiscountControlUpper || !data.gradeStrategyChannelList[i].integralUseDiscountControlLower) {
obj.flag = false;
obj.text = '请填写折扣';
}
if (parseInt(data.gradeStrategyChannelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.gradeStrategyChannelList[i].integralUseDiscountControlLower) > 10 || Number(data.gradeStrategyChannelList[i].integralUseDiscountControlUpper) <= Number(data.gradeStrategyChannelList[i].integralUseDiscountControlLower)) {
obj.flag = false;
obj.text = '折扣格式有误';
}
}
if (data.gradeStrategyChannelList[i].channelType == 1 && !data.gradeStrategyChannelList[i].cliqueEnterpriseIdArr.length) {
obj.flag = false;
obj.text = '请选择商户';
}
if (data.gradeStrategyChannelList[i].channelType == 3) {
const storeGroupDom = this.$refs.storeGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.storeGroup[0].isStoreSave();
} else {
flag = await this.$refs.storeGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
if (data.gradeStrategyChannelList[i].channelType == 9) {
const storeGroupDom = this.$refs.wmstoreGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.wmstoreGroup[0].isStoreSave();
} else {
flag = await this.$refs.wmstoreGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
}
}
}
return obj;
},
// 获取商品品牌 1
getGoodsBrand() {
let that = this;
let para = {};
getRequest('/api-mall/list-enterprise-brand', para)
.then(res => {
// log(res.data.result)
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptionsWx = data;
that.goodsTreeOptionsLine = data;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 选择商品品牌 微信商城
selectGoodsStoreWx(val) {
this.valueWx = val;
this.ruleForm.gradeStrategyChannelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr = [];
val.forEach(ele => {
this.ruleForm.gradeStrategyChannelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
},
// 保存
submitForm(formName) {
let that = this;
this.$refs[formName].validate(valid => {
if (valid) {
let data = JSON.parse(JSON.stringify(that.ruleForm));
if (!data.strategyName) {
showMsg.showmsg('请填写策略名称', 'error');
return;
}
// if (data.strategyRelationType == 2 && that.value5.length < 1) {
// showMsg.showmsg('请选择商品品牌', 'error');
// return;
// }
// if (data.strategyRelationType == 3 && that.cateDataWx.length < 1) {
// showMsg.showmsg('请选择商品品类', 'error');
// return;
// }
// if (data.strategyRelationType == 4 && that.goodsListWx.length < 1) {
// showMsg.showmsg('请选择单件商品', 'error');
// return;
// }
// if (!data.cliqueEnterpriseIds.length) {
// showMsg.showmsg('请选择商户', 'error');
// return;
// }
// if (data.discountControl == 2&&(!data.discountControlLower||!data.discountControlUpper)) {
// showMsg.showmsg('请选择折扣控制中的折扣率','error')
// return;
// }
// 扣控制中的折扣率判断
// if (data.discountControl == 2) {
// let flagA = Number(data.discountControlUpper) <= Number(data.discountControlLower);
// if (!data.discountControlUpper || !data.discountControlLower) {
// that.$message.error('折扣控制中的折扣率不能为空');
// return;
// }
// if (flagA) {
// that.$message.error('折扣控制中的折扣率格式有误');
// return;
// }
// }
if (data.discountRate == '') {
showMsg.showmsg('请填写折扣率', 'error');
return;
} else if (data.discountRate < 0.01) {
showMsg.showmsg('折扣率不能为0哦', 'error');
return;
}
that.checkListValue(data).then(res => {
if (!res.flag) {
showMsg.showmsg(res.text, 'error');
return;
} else {
// 设置开启状态 1-->true
data.gradeStrategyChannelList.forEach(function(ele, index) {
ele.status = ele.status == true ? 1 : 0;
if (ele.channelType == 1) {
ele.strategyGoodsRelationIdArr = ele.goodsRelationIdArr;
delete ele.goodsRelationIdArr;
}
if (ele.channelType == '9') {
ele.storeControlId = that.wmuuid;
}
});
let saveBool = true;
data.gradeStrategyChannelList.forEach(item => {
if (item.channelType == 1 && item.status == 1) {
// 微信商城
// 适用商品
if (item.channelRelationProType == 2 && this.valueWx.length < 1) {
// 商品品牌
showMsg.showmsg('请选择商品品牌', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 3 && this.cateDataWx.length < 1) {
// 商品品类
showMsg.showmsg('请选择商品品类', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 4 && this.goodsListWx.length < 1) {
// 单件商品
showMsg.showmsg('请选择单件商品', 'error');
return (saveBool = false);
}
}
});
data.discountControlUpper = data.discountControlUpper || '0';
data.discountControlLower = data.discountControlLower || '0';
data.cliqueEnterpriseIds = data.cliqueEnterpriseIds && data.cliqueEnterpriseIds.length && data.cliqueEnterpriseIds.join(',');
data.gradeStrategyGoodsRelationIds = data.gradeStrategyGoodsRelationIds && data.gradeStrategyGoodsRelationIds.length && data.gradeStrategyGoodsRelationIds.join(',');
if (saveBool) {
that.saveInfo(data);
}
}
})
} else {
log('error submit!!');
return false;
}
});
},
// 保存
saveInfo(form) {
let that = this;
let para = form;
postJson('/api-admin/save-member-grade-strategy', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
// 向本地暂存替换一条
let data = JSON.parse(sessionStorage.getItem('strategy'));
// log(data)
data.forEach(function(ele, index) {
if (ele.gradeStrategyId == form.gradeStrategyId) {
ele.strategyName = resData.result.strategyName;
ele.cliqueEnterpriseIds = resData.result.cliqueEnterpriseIds;
ele.discountControl = resData.result.discountControl;
ele.discountControlLower = resData.result.discountControlLower;
ele.discountControlUpper = resData.result.discountControlUpper;
ele.discountRate = resData.result.discountRate;
ele.gradeStrategyGoodsRelationIds = resData.result.gradeStrategyGoodsRelationIds;
ele.relationCount = resData.result.relationCount;
ele.strategyRelationType = resData.result.strategyRelationType;
}
});
sessionStorage.setItem('strategy', JSON.stringify(data));
showMsg.showmsg('保存成功', 'success');
that.goBack();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm.cateName = temp.trim();
that.cateNameLength = strLength.getZhLen(that.ruleForm.cateName);
},
inputFocus(tag, flag) {
let that = this;
that.tempTag = tag;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 折扣重新写的判断
formatInputChange(e) {
let that = this;
// log(e)
that.ruleForm.discountControlLower = Number(String(that.ruleForm.discountControlLower).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.ruleForm.discountControlLower).replace(/[^\.\d]/g, '')).toFixed(2);
that.ruleForm.discountControlUpper = Number(String(that.ruleForm.discountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.ruleForm.discountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2);
// 比较大小
if (Number(that.ruleForm.discountControlLower) > 10) {
that.ruleForm.discountControlLower = Number(10).toFixed(2);
}
if (Number(that.ruleForm.discountControlUpper) > 10) {
that.ruleForm.discountControlUpper = Number(10).toFixed(2);
}
if (that.tempTag == 'discountRate') {
that.ruleForm[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
// log(e,e.target.value)
that.ruleForm[that.tempTag] = String(e.target.value).replace(/[^\.\d]/g, '');
if (that.tempTag == 'discountControlLower' || that.tempTag == 'discountControlUpper') {
that.ruleForm[that.tempTag] = Number(String(e.target.value).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(e.target.value).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
if (that.tempTag == 'discountRate') {
that.ruleForm[that.tempTag] = Number(String(e.target.value).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
if (!!that.tempFlag && that.tempFlag == 'day') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 4);
}
if (!!that.tempFlag && that.tempFlag == 'money') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 6);
}
if (!!that.tempFlag && that.tempFlag == 'point') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 8);
}
},
changeRoute(route) {
this.$router.push(route);
},
// 去空值
bouncer(arr) {
return arr.filter(function(val) {
return !(!val || val === '');
});
},
// 获取信息
getInfo() {
let that = this;
let para = {
strategyId: that.ruleForm.strategyId
};
postRequest('/api-admin/get-member-grade-strategy-info', para)
.then(res => {
let resData = res.data;
log(resData);
if (resData.errorCode == 0) {
// 商户列表
let prise = resData.result.enterpriseList;
if (prise) {
prise.forEach(function(ele, index) {
ele.label = ele.brandName;
ele.value = ele.enterpriseId;
});
that.mechantOption = prise;
}
let data = resData.result.strategyDTO;
if (!!data.cliqueEnterpriseIds) {
data.cliqueEnterpriseIds = that.bouncer(data.cliqueEnterpriseIds.split(','));
} else {
data.cliqueEnterpriseIds = [];
}
if (data.gradeStrategyChannelList) {
data.gradeStrategyChannelList.forEach(item => {
if (item.channelType == '1') {
// 微信商城
if (item.channelRelationProType == 3) {
// 商品品类
if (item.goodsCategoryList) {
item.goodsCategoryList.forEach(item => {
that.selectCateDataWx.push(item);
});
}
}
if (item.channelRelationProType == 4) {
// 单件商品
if (item.strategyGoodsRelationIdArr) {
item.strategyGoodsRelationIdArr.forEach(item => {
that.goodsListWx.push(item);
});
}
}
if (item.channelRelationProType == 2) {
// 商品品牌
if (item.strategyGoodsRelationIdArr) {
item.strategyGoodsRelationIdArr.forEach(item => {
that.valueWx.push(item);
});
}
}
}
});
}
data.discountRate = String(data.discountRate);
data.calculationMethod = String(data.calculationMethod);
data.discountControl = String(data.discountControl);
data.discountControlUpper = String(data.discountControlUpper);
data.discountControlLower = String(data.discountControlLower);
data.strategyRelationType = String(data.strategyRelationType);
that.ruleForm = that.formatData(data);
that.ruleForm.goodsCategoryList = [];
// 字数控制
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
// showMsg.showmsg('设置成功','success')
// log(data)
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
formatData(item) {
item.gradeStrategyChannelList.forEach((ele, index) => {
ele.status = ele.status == 0 ? false : true;
ele.channelType = String(ele.channelType);
ele.channelStoreType = String(ele.channelStoreType);
ele.channelRelationProType = String(ele.channelRelationProType);
ele.integralUseDiscountControl = String(ele.integralUseDiscountControl);
ele.integralUseDiscountControlUpper = String(ele.integralUseDiscountControlUpper);
ele.integralUseDiscountControlLower = String(ele.integralUseDiscountControlLower);
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (!ele.cliqueEnterpriseIdArr || !ele.cliqueEnterpriseIdArr.length) {
ele.cliqueEnterpriseIdArr = [];
}
if (ele.channelType == 9) {
this.wmuuid = ele.storeControlId;
this.isAdd = false;
}
});
let bool = item.gradeStrategyChannelList.some(item => item.channelType == 9);
!bool && item.gradeStrategyChannelList.push({
gradeStrategyChannelId: '', //id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
status: true, //渠道配置是否启用 1启用 0停用
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
strategyGoodsRelationIdArr: [], // 商品
cliqueEnterpriseIdArr: [] //商户
})
return item;
},
changeGood(e) {
// 切换适用商品
if (this.ruleForm.strategyRelationType == '1') {
this.ruleForm.gradeStrategyGoodsRelationIds = [];
}
},
// 选择商品品牌
selectGoodsStore(val) {
this.value5 = val;
this.ruleForm.gradeStrategyGoodsRelationIds = this.value5;
},
// 单件商品 的 子组件显示方法 3
showGoodsDialog(type) {
let that = this;
that.goodsType = type;
that.goodShow = true;
that.goodsListId = [];
if (type == 'wx') {
// that.goodsListId = ['1']
that.goodsListId = that.goodsListWx;
} else if (type == 'line') {
// that.goodsListId = ['12121']
that.goodsListId = that.goodsListLine;
}
},
// 单件商品 的 子组件触发方法
selectGoods(val) {
let that = this;
log(val);
that.goodShow = false;
that.goodsListId = [];
if (val) {
if (val.goodsType == 'wx') {
that.ruleForm.gradeStrategyGoodsRelationIds = val.strategyGoodsRelationIds;
that.goodsListWx = val.strategyGoodsRelationIds;
}
}
},
// 商品品类
getCateIds(val) {
if (val.selectCateType == 'wx') {
this.ruleForm.gradeStrategyGoodsRelationIds = [];
this.cateDataWx = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.gradeStrategyGoodsRelationIds.push(ele);
this.cateDataWx.push(ele);
});
log(this.ruleForm.gradeStrategyGoodsRelationIds);
}
},
selectGoodsCateHide() {
// 调用子组件 商品品类组件的函数
if (this.ruleForm.gradeStrategyChannelList.length > 0) {
this.ruleForm.gradeStrategyChannelList.forEach((item, index) => {
if (item.channelType == '1' && item.channelRelationProType == 3) {
// 微信商城
if (this.$refs.selectGoodsCate instanceof Array) {
this.$refs.selectGoodsCate[0].hideDragClick();
} else {
this.$refs.selectGoodsCate.hideDragClick();
}
}
});
}
},
},
components: {
topNav,
addGoods,
goodsCate
}
};
</script>
<style lang="less" scoped>
.right-box {
padding: 24px 32px;
}
.attention-wrap {
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.title-tip {
font-size: 12px;
color: #888;
}
}
.form-wrap {
/deep/ .el-radio {
margin-right: 0;
}
.el-input {
width: 178px;
padding: 0 10px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
left: 303px;
color: #c0c4cc;
font-size: 12px;
}
.span-txt {
position: absolute;
left: 222px;
z-index: 2;
width: 300px;
text-align: center;
}
.padding-0 {
padding: 0;
}
.form-child {
width: 100%;
padding: 15px 20px 10px 0px;
background: #f5f6f9;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.margin-l-120 {
margin-left: 120px;
}
.margin-20 {
margin-top: 20px;
}
.tinymce-wrap {
width: 780px;
}
}
/* 商品品类 */
.goods-cate {
display: inline-block;
}
.goods-cate .goods-cate-content {
width: 217px;
}
/*折扣率*/
.form-wrap /deep/ .el-input-number .el-input {
padding: 0 10px;
box-sizing: border-box;
.el-input__inner {
text-align: left;
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
<el-form-item label="等级名称" prop="gradeName" class="limit-el-item">
<el-input v-model="ruleForm.gradeName" class="w-340" @focus="focus('gradeName', 12)" @keyup.native="value => toInput(value)"> </el-input>
<label class="input-label">{{ inputNumObj.gradeName }}/12</label>
</el-form-item>
<el-form-item label="等级编码" prop="gradeCode" class="limit-el-item">
<el-input v-model="ruleForm.gradeCode" class="w-340" @focus="focus('gradeCode', 6)" @keyup.native="value => toInput(value)" :disabled="ruleForm.gradeCode == '' ? false : true"> </el-input>
<label class="input-label">{{ inputNumObj.gradeCode }}/6</label>
</el-form-item>
<el-form-item label="卡面颜色" prop="cardColor">
<el-color-picker v-model="ruleForm.cardColor"></el-color-picker>
</el-form-item>
<el-form-item label="文字颜色" prop="cardFontColor">
<el-color-picker v-model="ruleForm.cardFontColor"></el-color-picker>
</el-form-item>
<el-form-item label="等级类型" prop="gradeType">
<el-radio v-model="ruleForm.gradeType" label="1">常规卡</el-radio>
<el-radio v-model="ruleForm.gradeType" label="2">特殊卡</el-radio>
</el-form-item>
<el-form-item label="折扣" prop="discountRate">
<el-input @focus="inputFocus('discountRate')" @change="formatInputChange($event)" v-model="ruleForm.discountRate"></el-input>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00</span>
<!-- <el-input v-model="ruleForm.discountRate" @focus="inputFocus('discountRate')" @change="formatInputChange($event)"></el-input> -->
</el-form-item>
<el-form-item label="计算方式" prop="calculationMethod">
<el-radio v-model="ruleForm.calculationMethod" label="1">就低原则</el-radio>
<el-radio v-model="ruleForm.calculationMethod" label="2">折上折</el-radio>
</el-form-item>
<!-- 折扣控制 -->
<el-form-item label="折扣控制" prop="">
<div style="margin-bottom: 22px;">
<el-radio v-model="ruleForm.discountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div>
<el-radio v-model="ruleForm.discountControl" label="2">折扣</el-radio>
<el-input-number v-model="ruleForm.discountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="ruleForm.discountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
<!-- 关联商户等级 -->
<el-form-item label="关联商户等级" prop="" class="table-label">
<el-table :data="linkLevelTableData" style="width: 100%">
<el-table-column prop="enterpriseName" label="商户名称"> </el-table-column>
<el-table-column prop="" label="会员等级">
<template slot-scope="scope">
<el-select size="small" v-model="scope.row.selectedGradeId" placeholder="请选择" @change="changeCardLevel($event, scope.row)">
<el-option v-for="(item, ind) in scope.row.gradeList" :key="ind" :label="item.gradeName" :value="item.gradeId"> </el-option>
</el-select>
</template>
</el-table-column>
<el-table-column prop="selectedGradeCode" label="等级编码"> </el-table-column>
<el-table-column prop="" label="自动升级">
<template slot-scope="scope">
<template v-if="scope.row.selectedAutoUpgrade">
{{ scope.row.selectedAutoUpgrade == 1 ? '是' : '否' }}
</template>
<template v-else>
{{ '--' }}
</template>
</template>
</el-table-column>
<el-table-column prop="" label="自动降级">
<template slot-scope="scope">
<template v-if="scope.row.selectedAutoDowngrade">
{{ scope.row.selectedAutoDowngrade == 1 ? '是' : '否' }}
</template>
<template v-else>
{{ '--' }}
</template>
</template>
</el-table-column>
</el-table>
</el-form-item>
<!-- 特殊折扣控制 -->
<el-form-item label="特殊折扣控制" class="discount-ctrl-wrap">
<el-table class="discount-table" :data="countTableData" style="width: 100%">
<el-table-column prop="strategyName" label="策略名称"> </el-table-column>
<el-table-column prop="applyGoods" label="适用商品">
<template slot-scope="scope">
<p v-if="scope.row.strategyRelationType == 1">所有商品</p>
<p v-if="scope.row.strategyRelationType == 2">商品品牌</p>
<p v-if="scope.row.strategyRelationType == 3">商品类目</p>
<p v-if="scope.row.strategyRelationType == 4">部分商品</p>
</template>
</el-table-column>
<el-table-column prop="" label="折扣">
<template slot-scope="scope">
{{ scope.row.discountRate }}
</template>
</el-table-column>
<el-table-column prop="calWay" label="计算方式">
<template slot-scope="scope">
{{ scope.row.calculationMethod == 1 ? '就低原则' : '折上折' }}
</template>
</el-table-column>
<el-table-column prop="" label="折扣控制">
<template slot-scope="scope">
{{ scope.row.discountControl == 1 ? '所有折扣商品适用' : '折扣范围' }}
</template>
</el-table-column>
<el-table-column v-if="!contactBool" prop="" label="操作">
<template slot-scope="scope">
<el-row>
<el-button @click="editGroupCate(scope.$index, scope.row, ruleForm.countTableData)" type="text" size="small">
编辑
</el-button>
<delete-tip @confirm="delGroupCate(scope.$index, scope.row, countTableData)" tips="确认删除吗?">
<el-button type="text">删除</el-button>
</delete-tip>
</el-row>
</template>
</el-table-column>
</el-table>
<div>
<el-button v-show="!contactBool" type="text" icon="el-icon-circle-plus-outline" @click="addGroupCate">新增策略</el-button>
</div>
</el-form-item>
<!-- 自动升级 -->
<el-form-item label="自动升级" prop="">
<el-switch v-model="ruleForm.autoUpgrade"> </el-switch>
</el-form-item>
<el-form-item label="升级条件" prop="" v-if="ruleForm.autoUpgrade">
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelHighcostSelect">当天消费满</el-checkbox>
<el-input v-model="ruleForm.upLevelHighcost" @focus="inputFocus('upLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelDaystoredSelect">当天储值满</el-checkbox>
<el-input v-model="ruleForm.upLevelDaystored" @focus="inputFocus('upLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumcostDays" @focus="inputFocus('upLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelSumcost" @focus="inputFocus('upLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelCostimesSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelCosttimesDays" @focus="inputFocus('upLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelCosttimes" @focus="inputFocus('upLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumstoredDays" @focus="inputFocus('upLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.upLevelSumstored" @focus="inputFocus('upLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumintegralDays" @focus="inputFocus('upLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得 </label>
<el-input v-model="ruleForm.upLevelSumintegral" @focus="inputFocus('upLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
<!-- 自动降级 -->
<el-form-item label="自动降级" prop="">
<el-switch v-model="ruleForm.autoDowngrade"> </el-switch>
</el-form-item>
<div v-if="ruleForm.autoDowngrade">
<el-form-item label="会员等级有效期" prop="">
<label> 自升级之日起算 </label>
<el-input v-model="ruleForm.gradeEffectDay" @focus="inputFocus('gradeEffectDay', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</el-form-item>
<el-form-item label="保级条件" prop="">
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelHighcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelHighcostDays" @focus="inputFocus('lowLevelHighcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天消费满</label>
<el-input v-model="ruleForm.lowLevelHighcost" @focus="inputFocus('lowLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelDaystoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelDaystoredDays" @focus="inputFocus('lowLevelDaystoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天储值满</label>
<el-input v-model="ruleForm.lowLevelDaystored" @focus="inputFocus('lowLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumcostDays" @focus="inputFocus('lowLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelSumcost" @focus="inputFocus('lowLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelCosttimesSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelCosttimesDays" @focus="inputFocus('lowLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelCosttimes" @focus="inputFocus('lowLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumstoredDays" @focus="inputFocus('lowLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.lowLevelSumstored" @focus="inputFocus('lowLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumintegralDays" @focus="inputFocus('lowLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得</label>
<el-input v-model="ruleForm.lowLevelSumintegral" @focus="inputFocus('lowLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
</div>
<el-form-item class="font-0">
<el-button type="primary" @click="submitForm('ruleForm')">保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import strLength from '@/common/js/strlen';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { getRequest, postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'editGroupGrade',
data() {
return {
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '编辑集团会员等级',
path: ''
}
],
rules: {
gradeName: [{ required: true, message: '请填写等级名称', trigger: 'blur' }],
cardColor: [{ required: true, message: '请填写卡面颜色', trigger: 'change' }],
cardFontColor: [{ required: true, message: '请填写文字颜色', trigger: 'change' }],
gradeType: [{ required: true, message: '请选择等级类型', trigger: 'change' }],
discountRate: [{ required: true, message: '请填写折扣', trigger: 'change' }],
calculationMethod: [{ required: true, message: '请填写计算方式', trigger: 'change' }]
},
// 输入控制
inputNumObj: {
gradeName: 0,
gradeCode: 0
},
// 记录输入的
inputFlag: '',
inputFlagNum: '',
// form
ruleForm: {
gradeId: '', //等级id
gradeIntegralId: '', //等级积分id
gradeName: '', //等级名称
gradeCode: '', //等级代码
cardColor: '', //卡片颜色
cardFontColor: '', //卡字体颜色
gradeType: '1', //常规还是特殊卡 1常规 2特殊
discountRate: '', // 折扣率
calculationMethod: '2', // 计算方式 1就低原则 2折上折
discountControl: '', // 折扣控制 1所有折扣商品适用 2折扣范围
discountControlUpper: '',
discountControlLower: '',
autoUpgrade: true, //自动升级 1启用 2停用
upLevelHighcostSelect: false, // 当天消费满
upLevelHighcost: '',
upLevelDaystoredSelect: false, // 当天储值满
upLevelDaystored: '',
upLevelSumcostSelect: false, //x天内消费满x元
upLevelSumcostDays: '',
upLevelSumcost: '',
upLevelCostimesSelect: false, // x天内消费满x次
upLevelCosttimes: '',
upLevelCosttimesDays: '',
upLevelSumstoredSelect: false, //x天内储值满x元
upLevelSumstored: '',
upLevelSumstoredDays: '',
upLevelSumintegralSelect: false, //x天内获得x积分
upLevelSumintegral: '',
upLevelSumintegralDays: '',
autoDowngrade: true, //自动降级 1启用 2停用
gradeEffectDay: '', //自升级之日起算X天
lowLevelHighcostDays: '', //x天内单天消费满x元
lowLevelHighcost: '',
lowLevelHighcostSelect: false,
lowLevelDaystoredSelect: false, //x天内单天储值满x元
lowLevelDaystoredDays: '',
lowLevelDaystored: '',
lowLevelSumcostDays: '', //x天内消费满x元
lowLevelSumcostSelect: false,
lowLevelSumcost: '',
lowLevelCosttimesSelect: false, //x天内消费满x次
lowLevelCosttimesDays: '',
lowLevelCosttimes: '',
lowLevelSumstoredSelect: false, //x天内储值满x元
lowLevelSumstored: '',
lowLevelSumstoredDays: '',
lowLevelSumintegralSelect: false, //x天内获得x积分
lowLevelSumintegral: '',
lowLevelSumintegralDays: '',
gradeDescribe: '', //会员等级说明
upCliqueEnterpriseRelation: null
},
// 特殊折扣控制
countTableData: [],
// 关联商户等级
linkLevelTableData: [],
// 会员卡等级
levelOptions: [
{
value: '0',
label: '普卡'
},
{
value: '1',
label: '青铜卡卡'
}
]
};
},
methods: {
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// 返回
goBack() {
this.$router.go(-1);
},
inputFocus(tag, flag) {
let that = this;
log(tag);
that.tempTag = tag;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 折扣重新写的判断
formatInputChange(e) {
let that = this;
log(e);
if (that.tempTag == 'discountControlLower' || that.tempTag == 'discountControlUpper') {
that.ruleForm[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
// if (Number(that.ruleForm.discountControlLower) >= Number(that.ruleForm.discountControlUpper)) {
// that.ruleForm.discountControlLower = String(Number(that.ruleForm.discountControlUpper - 1).toFixed(2)).indexOf('-') !='-1'? '0.00':Number(that.ruleForm.discountControlUpper - 1).toFixed(2)
// }
return;
}
if (that.tempTag == 'discountRate') {
that.ruleForm[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
log(e, e.target.value);
that.ruleForm[that.tempTag] = String(e.target.value).replace(/[^\.\d]/g, '');
if (that.tempTag == 'discountControlLower' || that.tempTag == 'discountControlUpper') {
that.ruleForm[that.tempTag] = Number(String(e.target.value).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(e.target.value).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
if (that.tempTag == 'discountRate') {
that.ruleForm[that.tempTag] = Number(String(e.target.value).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.ruleForm[that.tempTag]) > 10) {
that.ruleForm[that.tempTag] = Number(10).toFixed(2);
}
return;
}
if (!!that.tempFlag && that.tempFlag == 'day') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 4);
}
if (!!that.tempFlag && that.tempFlag == 'money') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 6);
}
if (!!that.tempFlag && that.tempFlag == 'point') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 8);
}
},
// 检查条件
checkUp(data) {
let flag = true;
if (!!data.autoUpgrade) {
if (!!data.upLevelHighcostSelect && !data.upLevelHighcost) {
flag = false;
}
if (!!data.upLevelDaystoredSelect && !data.upLevelDaystored) {
flag = false;
}
if (!!data.upLevelSumcostSelect && (!data.upLevelSumcostDays || !data.upLevelSumcost)) {
flag = false;
}
if (!!data.upLevelCostimesSelect && (!data.upLevelCosttimesDays || !data.upLevelCosttimes)) {
flag = false;
}
if (!!data.upLevelSumstoredSelect && (!data.upLevelSumstoredDays || !data.upLevelSumstored)) {
flag = false;
}
if (!!data.upLevelSumintegralSelect && (!data.upLevelSumintegralDays || !data.upLevelSumintegral)) {
flag = false;
}
}
return flag;
},
checkDown(data) {
let flag = true;
if (!!data.autoDowngrade) {
if (!data.gradeEffectDay) {
flag = false;
}
if (!!data.lowLevelHighcostSelect && (!data.lowLevelHighcostDays || !data.lowLevelHighcost)) {
flag = false;
}
if (!!data.lowLevelDaystoredSelect && (!data.lowLevelDaystoredDays || !data.lowLevelDaystored)) {
flag = false;
}
if (!!data.lowLevelSumcostSelect && (!data.lowLevelSumcostDays || !data.lowLevelSumcost)) {
flag = false;
}
if (!!data.lowLevelCosttimesSelect && (!data.lowLevelCosttimesDays || !data.lowLevelCosttimes)) {
flag = false;
}
if (!!data.lowLevelSumstoredSelect && (!data.lowLevelSumstoredDays || !data.lowLevelSumstored)) {
flag = false;
}
if (!!data.lowLevelSumintegralSelect && (!data.lowLevelSumintegralDays || !data.lowLevelSumintegral)) {
flag = false;
}
}
return flag;
},
// 保存
submitForm(formName) {
let that = this;
this.$refs[formName].validate(valid => {
if (valid) {
if (!that.ruleForm.gradeName) {
showMsg.showmsg('请填写等级名称', 'error');
return;
}
if (!that.ruleForm.gradeCode) {
showMsg.showmsg('请填写等级编码', 'error');
return;
}
if (that.ruleForm.discountRate == '') {
showMsg.showmsg('请填写折扣', 'error');
return;
} else if (that.ruleForm.discountRate < 0.01) {
showMsg.showmsg('折扣不能为0哦', 'error');
return;
}
if (that.ruleForm.discountControl == 2) {
let flagA = Number(that.ruleForm.discountControlUpper) <= Number(that.ruleForm.discountControlLower);
if (!that.ruleForm.discountControlUpper || !that.ruleForm.discountControlLower) {
that.$message.error('折扣控制中的折扣不能为空');
return;
}
if (flagA) {
that.$message.error('折扣控制中的折扣格式有误');
return;
}
}
if (parseInt(that.ruleForm.discountControlLower) > 10) {
that.ruleForm.discountControlLower = 10.0;
}
if (parseInt(that.ruleForm.discountControlUpper) > 10) {
that.ruleForm.discountControlUpper = 10.0;
}
if (!that.checkUp(that.ruleForm)) {
showMsg.showmsg('请填写升级条件', 'error');
return;
}
if (!that.checkDown(that.ruleForm)) {
showMsg.showmsg('请填写降级条件', 'error');
return;
}
let data = JSON.parse(JSON.stringify(that.ruleForm));
data.autoDowngrade = data.autoDowngrade == true ? 1 : 2;
data.autoUpgrade = data.autoUpgrade == true ? 1 : 2;
data.gradeType = String(data.gradeType);
data.upLevelHighcostSelect = data.upLevelHighcostSelect == true ? 1 : 0;
data.upLevelDaystoredSelect = data.upLevelDaystoredSelect == true ? 1 : 0;
data.upLevelSumcostSelect = data.upLevelSumcostSelect == true ? 1 : 0;
data.upLevelCostimesSelect = data.upLevelCostimesSelect == true ? 1 : 0;
data.upLevelSumstoredSelect = data.upLevelSumstoredSelect == true ? 1 : 0;
data.upLevelSumintegralSelect = data.upLevelSumintegralSelect == true ? 1 : 0;
log(data.lowLevelHighcostSelect, data.lowLevelDaystoredSelect, data.lowLevelSumcostSelect, data.lowLevelCosttimesSelect, data.lowLevelSumstoredSelect, data.lowLevelSumintegralSelect);
data.lowLevelHighcostSelect = data.lowLevelHighcostSelect == true ? 1 : 0;
data.lowLevelDaystoredSelect = data.lowLevelDaystoredSelect == true ? 1 : 0;
data.lowLevelSumcostSelect = data.lowLevelSumcostSelect == true ? 1 : 0;
data.lowLevelCosttimesSelect = data.lowLevelCosttimesSelect == true ? 1 : 0;
data.lowLevelSumstoredSelect = data.lowLevelSumstoredSelect == true ? 1 : 0;
data.lowLevelSumintegralSelect = data.lowLevelSumintegralSelect == true ? 1 : 0;
data.discountControlUpper = data.discountControlUpper || '0';
data.discountControlLower = data.discountControlLower || '0';
// 值增加默认 0
data.upLevelHighcost = data.upLevelHighcost || 0;
data.upLevelDaystored = data.upLevelDaystored || 0;
data.upLevelSumcostDays = data.upLevelSumcostDays || 0;
data.upLevelSumcost = data.upLevelSumcost || 0;
data.upLevelCosttimesDays = data.upLevelCosttimesDays || 0;
data.upLevelCosttimes = data.upLevelCosttimes || 0;
data.upLevelSumstoredDays = data.upLevelSumstoredDays || 0;
data.upLevelSumstored = data.upLevelSumstored || 0;
data.upLevelSumintegralDays = data.upLevelSumintegralDays || 0;
data.upLevelSumintegral = data.upLevelSumintegral || 0;
data.gradeEffectDay = data.gradeEffectDay || 0;
data.lowLevelHighcostDays = data.lowLevelHighcostDays || 0;
data.lowLevelHighcost = data.lowLevelHighcost || 0;
data.lowLevelDaystoredDays = data.lowLevelDaystoredDays || 0;
data.lowLevelDaystored = data.lowLevelDaystored || 0;
data.lowLevelSumcostDays = data.lowLevelSumcostDays || 0;
data.lowLevelSumcost = data.lowLevelSumcost || 0;
data.lowLevelCosttimesDays = data.lowLevelCosttimesDays || 0;
data.lowLevelCosttimes = data.lowLevelCosttimes || 0;
data.lowLevelSumstoredDays = data.lowLevelSumstoredDays || 0;
data.lowLevelSumstored = data.lowLevelSumstored || 0;
data.lowLevelSumintegralDays = data.lowLevelSumintegralDays || 0;
data.lowLevelSumintegral = data.lowLevelSumintegral || 0;
// 关联商户等级
let relation = '';
that.linkLevelTableData.forEach(function(ele, index) {
if (!!ele.selectedGradeId) {
relation += ele.enterpriseId + ':' + ele.selectedGradeId + (that.linkLevelTableData.length > 1 ? ',' : '');
}
});
data.upCliqueEnterpriseRelation = relation;
log(data.upCliqueEnterpriseRelation);
// 策略ids
data.gradeStrategyIds = '';
let cateArr = [];
log(that.countTableData);
if (!!that.countTableData && !!that.countTableData.length) {
that.countTableData.forEach(function(ele, index) {
cateArr.push(ele.gradeId);
});
}
if (!!cateArr.length) {
data.gradeStrategyIds = cateArr.join(',');
}
log(data.gradeStrategyIds);
that.saveInfo(data);
} else {
showMsg.showmsg('表单信息未填写完整', 'error');
return false;
}
});
},
// 保存
//
saveInfo(form) {
let that = this;
let para = form;
postRequest('/api-admin/do-save-member-grade', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('保存成功', 'success');
// 返回
that.goBack();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 输入控制
focus(name, num) {
let that = this;
log(name, num);
that.inputFlag = name;
that.inputFlagNum = num;
},
// 输入
toInput: function(value) {
let that = this;
let temp = '';
temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm[that.inputFlag] = temp.trim();
that.inputNumObj[that.inputFlag] = strLength.getZhLen(that.ruleForm[that.inputFlag]);
},
// 添加策略
addGroupCate(path) {
this.$router.push({
path: '/addGroupCate',
query: {
gradeId: this.ruleForm.gradeId
}
});
},
// 编辑特殊折扣控制
editGroupCate(index, row, obj) {
this.$router.push({
path: '/editGroupCate',
query: {
gradeId: this.ruleForm.gradeId,
strategyId: row.gradeStrategyId
}
});
},
// 删除特殊折扣控制
delGroupCate(index, row, obj) {
let para = {
strategyId: row.gradeStrategyId
};
getRequest('/api-admin/delete-member-grade-strategy', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('删除成功', 'success');
obj.splice(index, 1);
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 选择卡
changeCardLevel(e, row) {
log(e, row);
row.gradeList.forEach(function(ele, index) {
if (ele.gradeId == e) {
row.selectedGradeCode = ele.gradeCode;
row.selectedAutoDowngrade = ele.autoDowngrade;
row.selectedAutoUpgrade = ele.autoUpgrade;
}
});
log(row);
},
// 获取集团等级信息
// 获取等级信息
getMemberGradeInfo() {
let that = this;
let para = {
gradeId: that.ruleForm.gradeId
};
postRequest('/api-admin/get-member-grade-info', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
// 策略
that.countTableData = resData.result.strategyList;
// 关联商户等级
let levelArr = resData.result.enterpriseGradeList;
levelArr.forEach(function(ele, index) {
if (!!ele.gradeList) {
ele.gradeList.unshift({
gradeId: '',
gradeName: '请选择',
gradeCode: '',
autoDowngrade: '',
autoUpgrade: ''
});
}
});
that.linkLevelTableData = levelArr;
// dto
let data = resData.result.dto;
data.autoDowngrade = data.autoDowngrade == 1 ? true : false;
data.autoUpgrade = data.autoUpgrade == 1 ? true : false;
data.gradeType = String(data.gradeType);
data.calculationMethod = String(data.calculationMethod);
data.discountControl = String(data.discountControl);
data.discountControlUpper = String(data.discountControlUpper);
data.discountControlLower = String(data.discountControlLower);
data.upLevelHighcostSelect = data.upLevelHighcostSelect == 1 ? true : false;
data.upLevelDaystoredSelect = data.upLevelDaystoredSelect == 1 ? true : false;
data.upLevelSumcostSelect = data.upLevelSumcostSelect == 1 ? true : false;
data.upLevelCostimesSelect = data.upLevelCostimesSelect == 1 ? true : false;
data.upLevelSumstoredSelect = data.upLevelSumstoredSelect == 1 ? true : false;
data.upLevelSumintegralSelect = data.upLevelSumintegralSelect == 1 ? true : false;
log(data.lowLevelHighcostSelect, data.lowLevelDaystoredSelect, data.lowLevelSumcostSelect, data.lowLevelCosttimesSelect, data.lowLevelSumstoredSelect, data.lowLevelSumintegralSelect);
data.lowLevelHighcostSelect = data.lowLevelHighcostSelect == 1 ? true : false;
data.lowLevelDaystoredSelect = data.lowLevelDaystoredSelect == 1 ? true : false;
data.lowLevelSumcostSelect = data.lowLevelSumcostSelect == 1 ? true : false;
data.lowLevelCosttimesSelect = data.lowLevelCosttimesSelect == 1 ? true : false;
data.lowLevelSumstoredSelect = data.lowLevelSumstoredSelect == 1 ? true : false;
data.lowLevelSumintegralSelect = data.lowLevelSumintegralSelect == 1 ? true : false;
that.ruleForm = data;
that.inputNumObj.gradeName = strLength.getZhLen(that.ruleForm.gradeName);
that.inputNumObj.gradeCode = strLength.getZhLen(that.ruleForm.gradeCode);
// showMsg.showmsg('设置成功','success')
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
beforeRouteLeave(to, from, next) {
let that = this;
let d = to;
if (d.path == '/editGroupCate' || d.path == '/addGroupCate') {
sessionStorage.setItem('localForm', JSON.stringify(that.ruleForm));
sessionStorage.setItem('strategy', JSON.stringify(that.countTableData));
sessionStorage.setItem('relation', JSON.stringify(that.linkLevelTableData));
}
next();
},
components: {
topNavNew
},
created() {
// this.selectReplayStyle()
},
mounted() {
let that = this;
log('mounted', that.$route.query.gradeId);
that.ruleForm.gradeId = that.$route.query.gradeId;
let data = JSON.parse(sessionStorage.getItem('localForm'));
let strategy = '';
if (sessionStorage.getItem('strategy') != 'undefined') {
strategy = JSON.parse(sessionStorage.getItem('strategy'));
}
let relation = '';
if (!!sessionStorage.getItem('relation') && sessionStorage.getItem('relation') != 'undefined') {
relation = JSON.parse(sessionStorage.getItem('relation'));
}
if (data || strategy || relation) {
if ((data && data.gradeId) || relation.length > 0) {
// log(data,strategy,relation)
that.ruleForm = data;
that.countTableData = strategy ? strategy : []; // 获取已经增加的策略
that.linkLevelTableData = relation; // 获取已经填写的关联商户等级
that.inputNumObj.gradeName = strLength.getZhLen(that.ruleForm.gradeName);
that.inputNumObj.gradeCode = strLength.getZhLen(that.ruleForm.gradeCode);
sessionStorage.removeItem('localForm');
sessionStorage.removeItem('strategy');
sessionStorage.removeItem('relation');
return;
}
}
// 如果本地没有数据,再去请求
that.getMemberGradeInfo();
},
updated: function() {
log('更新完成');
},
beforeRouteUpdate(to, from, next) {
// 在当前路由改变,但是该组件被复用时调用
// 举例来说,对于一个带有动态参数的路径 /foo/:id,在 /foo/1 和 /foo/2 之间跳转的时候,
// 由于会渲染同样的 Foo 组件,因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
// 可以访问组件实例 `this`
log('beforeRouteUpdate');
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
/deep/ .el-form-item__label {
padding: 0 12px 0 0;
}
/deep/ .el-form {
.el-form-item:last-child {
/*margin-bottom: 0;*/
.el-button {
margin-top: 25px;
}
}
}
.el-input {
width: 180px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
.limit-el-item {
/deep/ .el-form-item__content {
width: 340px;
}
}
/deep/ .el-table td,
/deep/ .el-table th {
padding: 7px 0;
}
/deep/ .input-label {
position: absolute;
right: 10px;
top: 2px;
color: #909399;
font-size: 12px;
}
.check-cell {
.el-input {
margin: 0 10px;
}
& + .check-cell {
margin-top: 15px;
}
}
}
.discount-ctrl-wrap /deep/ .el-form-item__label {
line-height: 48px;
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content" @click="selectGoodsCateHide">
<div class="right-box">
<div class="attention-wrap">
<div class="form-wrap">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item label="策略名称" prop="strategyName" class="padding-0 padding-r-45">
<el-input
v-model="ruleForm.strategyName"
class="w-340 padding-0"
@keyup.native="value => toInput(value)"
></el-input>
<label class="input-label">{{ cateNameLength }}/20</label>
</el-form-item>
<el-form-item label="适用对象" prop class="margin-20">
<el-select @change="changePeople" v-model="ruleForm.useCrowd" placeholder="请选择">
<el-option
v-for="item in applyObjOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="人群定向" v-if="ruleForm.useCrowd == 2" prop class="padding-0">
<el-button @click="showPeople">已设置{{ selectCount }}项筛选</el-button>
</el-form-item>
<el-form-item label="适用条件" class="padding-0">
<div class="title-tip">该设置只对微信商城中的积分抵现起作用。</div>
</el-form-item>
<!-- 只获取微信的 -->
<template v-for="(item, index) in ruleForm.channelList">
<template v-if="item.channelType == 1">
<el-form-item label="适用微信商城" prop="" :key="index">
<el-switch v-model="item.openStatus" active-text="启用" inactive-text="停用"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus" :key="index">
<el-form-item label="选择商户">
<el-select
v-model="item.enterpriseRelationIdArr"
placeholder="请选择"
multiple
size="small"
>
<el-option
v-for="item in mechantOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="适用商品" class="padding-0">
<el-select
class="fl"
style="margin-right: 10px;"
v-model="item.channelRelationProType"
placeholder="请选择"
>
<el-option
v-for="item in applyGoods"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<!-- 二级 -->
<!-- 商品品牌 -->
<el-select
size="small"
class="fl"
@change="selectGoodsStoreWx"
v-if="item.channelRelationProType == 2"
v-model="valueWx"
multiple
placeholder="请选择"
>
<el-option
v-for="item in goodsTreeOptionsWx"
:key="item.brandId"
:label="item.brandName"
:value="item.brandId"
></el-option>
</el-select>
<!-- 商品品类 -->
<div v-if="item.channelRelationProType == 3" class="fl goods-cate">
<goodsCate
ref="selectGoodsCate"
:selectCateType="selectCateTypeWx"
:selectCateData="selectCateDataWx"
@getCateIds="getCateIds"
></goodsCate>
</div>
<el-button
style="width:202px"
class="fl"
v-if="item.channelRelationProType == 4"
@click="showGoodsDialog('wx')"
>已选{{ goodsListWx.length }}件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<!-- <el-input @focus="inputFocus(item,'integralUseDiscountControlLower')" @change="formatInputChange($event)" v-model="item.integralUseDiscountControlLower"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlLower"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label></label>
<!-- <el-input @focus="inputFocus(item,'integralUseDiscountControlUpper')" @change="formatInputChange($event)" v-model="item.integralUseDiscountControlUpper"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlUpper"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label>折商品都适用</label>
<span
style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;"
>注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<!-- 微盟渠道-->
<template v-if="item.channelType == 9">
<el-form-item label="微盟渠道" prop="" :key="index">
<el-switch v-model="item.openStatus"> </el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus" :key="index">
<el-form-item label="选择店铺">
<vue-gic-store-new :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="wmuuid" ref="wmstoreGroup"></vue-gic-store-new>
</el-form-item>
<el-form-item label="微盟商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option v-for="item in wMGoodOption" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="折扣控制" prop="region" class="input-margin-b">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number v-model="item.integralUseDiscountControlLower" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label></label>
<el-input-number v-model="item.integralUseDiscountControlUpper" :precision="2" :controls="false" :max="10.0" :min="0.01"></el-input-number>
<label>折商品都适用</label>
<span style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;">注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
</template>
<el-form-item label="抵现规则" prop class="margin-20">
<div>
<el-radio v-model="ruleForm.integralUseStatus" label="1">每使用</el-radio>
<!-- <el-input @keyup.native="formatInputNum($event)" v-model="ruleForm.integralUse.integral"></el-input> -->
<el-input-number
v-model="ruleForm.integralUse.integral"
:precision="1"
:controls="false"
:max="10000.0"
:min="0.1"
></el-input-number>
<label>积分,抵</label>
<!-- <el-input @blur="formatInputNumBlur($event)" v-model="ruleForm.integralUse.fee"></el-input> -->
<el-input-number
v-model="ruleForm.integralUse.fee"
:precision="1"
:controls="false"
:max="10000.0"
:min="0.1"
></el-input-number>
<label></label>
</div>
<div>
<el-radio v-model="ruleForm.integralUseStatus" label="0" class="margin-20">不支持抵现</el-radio>
</div>
</el-form-item>
<el-form-item label="比例限制" prop="name">
<label style="color: #606266">最多可抵用商品金额的</label>
<el-input
@keyup.native="formatInputNum($event)"
v-model="ruleForm.channelList[0].useProportionalRestriction"
>
<template slot="append">%</template>
</el-input>
</el-form-item>
<!-- 新增策略有效期配置 -->
<el-form-item label="策略有效期" prop>
<!-- 1 永久 0 非永久 -->
<el-radio v-model="ruleForm.perpetualFlag" :label="1">永久有效</el-radio>
<el-radio v-model="ruleForm.perpetualFlag" :label="0">
在该时段内有效
<el-date-picker
v-if="ruleForm.perpetualFlag === 0"
v-model="ruleForm.perpetualDate"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
></el-date-picker>
</el-radio>
</el-form-item>
<el-form-item>
<el-row>
<el-button
:disabled="tpnEditBool"
type="primary"
@click="submitForm('ruleForm')"
>保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-row>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
<!-- 添加商品 -->
<add-goods
:goodsListId="goodsListId"
:goodsType="goodsType"
:goodShow.sync="goodShow"
:projectName="repProjectName"
@selectGoods="selectGoods"
></add-goods>
<!-- 人群筛选器的弹框 -->
<el-dialog title="自定义人群" :visible.sync="dialogVisiblePeople" width="980px">
<div class="select-people">
<vue-gic-group-people
:projectName="repProjectName"
:useId="useId"
:hasSearchData="hasSearchData"
:sceneValue="sceneValue"
ref="peopleFilter"
@findFilter="findFilter"
@getBackData="getBackData"
@editHide="editHide"
@editShow="editShow"
@hideBtn="hideBtn"
></vue-gic-group-people>
<div v-show="toggleTag" class="people-btn-wrap">
<el-row>
<el-button @click="getData" type="primary" size="small">确定</el-button>
<el-button @click="cancelFilter" size="small">取消</el-button>
</el-row>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-row>
<el-button @click="dialogVisiblePeople = false">取 消</el-button>
<el-button type="primary" @click="getPeopleData">确 定</el-button>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import addGoods from 'components/memberShip/add-goods';
import goodsCate from 'components/memberShip/goodsCate';
// import the styles
import '@riophae/vue-treeselect/dist/vue-treeselect.css';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import strLength from '@/common/js/strlen';
import { getRequest, postRequest, postJson } from '@/api/api';
import { log } from '@/utils/index.js';
const timeStramp = {
year: new Date().getFullYear(),
month: new Date().getMonth(),
day: new Date().getDate()
};
export default {
name: 'addIntegralSytem',
data() {
return {
repProjectName: 'gic-clique',
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '积分制度',
path: '/pointSystem'
},
{
name: '编辑积分抵现策略',
path: ''
}
],
rules: {
strategyName: [{ required: true, message: '请填写策略名称', trigger: 'blur' }]
},
// 添加商品弹窗
goodShow: false,
// 长度
cateNameLength: 0,
// 输入字限制
inputFlagNum: 20,
// 商户
mechantOption: [],
applyGoods: [
{
label: '所有商品',
value: '1'
}
// {
// label: '按商品品牌',
// value: '2',
// },
// {
// label: '按商品品类',
// value: '3',
// },
// {
// label: '按单件商品',
// value: '4',
// },
],
// 微盟渠道
wMShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
wMGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 门店 新
uuid: '', // 新增传空,编辑必传,
options: [0, 1, 2, 3, 4, 5], // 0 全部 1 门店类型 2门店标签 3 门店区域 4 门店分组 5 部分门店
isAdd: true,
scencs: 'integral',
wmuuid: '', // 微盟
ruleForm: {
// 积分获取规则
integralStrategyId: 'ff80808163a7a09b0163b01171e202db', //策略id
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000',
strategyName: 1, //策略名称
strategyType: 1, // 策略类型 1消费积分 2积分抵现
useCrowd: '1', // 策略类型 1所有 2人群筛选
crowdJson: '', //人群筛选器内容
selectorParams: '',
integralGetStatus: '1', // 积分获取开启 1是0否
integralGet: { fee: 11, integral: 12 },
integralGetStrategy: '1', // 取整策略 1四舍五入 2抹零 3向上取整
integralGetFreezeDays: 1, // 获取积分冻结天数
integralGetEffectiveDays: 1, // 获取积分有效天
integralUseStatus: '0', // 积分抵现开启 1是0否
integralUse: { fee: '', integral: '' }, // 积分抵现 {fee:5,integral:5}
perpetualFlag: 1,
channelList: [
{
integralStrategyChannelId: 'ff808081649321d20164a1fafbdd01df', //id
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000',
integralStrategyId: 'ff80808163a7a09b0163b01171e202db', //策略id
channelType: '1', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
}
],
perpetualFlag: 1,
perpetualDate: [new Date(timeStramp.year, timeStramp.month, timeStramp.day, 0, 0), new Date(timeStramp.year, timeStramp.month, timeStramp.day, 23, 59)]
},
// 适用对象
applyObjOption: [
{
label: '所有会员',
value: '1'
},
{
label: '自定义人群',
value: '2'
}
],
dialogVisiblePeople: false,
/* 人群筛选器 */
sceneValue: 'member', // 场景值
useId: '',
searchParams: '',
hasSearchData: '', // 当前页回显的数据(接口返回)
toggleTag: false,
selectCount: 0,
// 单个商品类型
goodsType: 'wx', // 单个商品类型 wx:微信商城,line:线下渠道
goodsListId: [],
goodsListWx: [],
goodsListLine: [],
// 商品品类
selectCateDataWx: [], // 用于回显
selectCateDataLine: [],
selectCateTypeWx: 'wx',
selectCateTypeLine: 'line',
cateDataWx: [],
cateDataLine: [],
storeGroupList: [],
// 商品品牌
goodsTreeOptionsWx: [],
valueWx: [],
goodsTreeOptionsLine: [],
valueLine: [],
// 太平鸟标识
tpnEditBool: false,
tpnEnterpriseId: 'ff808081671d3ceb01672adebf4e6149'
};
},
created() {
// this.selectReplayStyle()
},
mounted() {
let that = this;
log(that.$route.query.integralStrategyId);
// 获取策略 id
let id = that.$route.query.integralStrategyId;
that.ruleForm.integralStrategyId = id;
that.getInfo();
// 商品品牌
that.getGoodsBrand();
that.getLoginInfo();
},
methods: {
// 返回
goBack() {
this.$router.go(-1);
},
async checkListValue(data) {
let obj = {
flag: true,
text: ''
};
if (!!data.channelList.length) {
for (let i = 0; i < data.channelList.length; i++) {
if (!!data.channelList[i].openStatus) {
if (data.channelList[i].integralUseDiscountControl == 2) {
if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
obj.flag = false;
obj.text = '请填写折扣';
}
if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
obj.flag = false;
obj.text = '折扣格式有误';
}
}
if (data.channelList[i].channelType == 1 && !data.channelList[i].enterpriseRelationIdArr.length) {
obj.flag = false;
obj.text = '请选择商户';
}
if (data.channelList[i].channelType == 9) {
const storeGroupDom = this.$refs.wmstoreGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.wmstoreGroup[0].isStoreSave();
} else {
flag = await this.$refs.wmstoreGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
}
}
}
return obj;
},
// 保存
submitForm(formName) {
let that = this;
if (!that.tpnEditBool) {
this.$refs[formName].validate(valid => {
if (valid) {
// log(that.ruleForm);
let data = JSON.parse(JSON.stringify(that.ruleForm));
// 非空验证
if (!data.strategyName) {
showMsg.showmsg('请填写策略名称', 'error');
return;
}
// if (!data.channelList[0].enterpriseRelationIdArr.length) {
// showMsg.showmsg('请选择商户', 'error');
// return;
// }
// if (data.channelList[0].integralUseDiscountControl == 2) {
// let flagA = Number(data.channelList[0].integralUseDiscountControlLower) >= Number(data.channelList[0].integralUseDiscountControlUpper);
// if (!data.channelList[0].integralUseDiscountControlLower || !data.channelList[0].integralUseDiscountControlUpper) {
// that.$message.error('折扣控制中的折扣不能为空');
// return;
// }
// if (flagA) {
// that.$message.error('折扣控制中的折扣格式有误');
// return;
// }
// }
let flag = !data.integralUse.fee || String(data.integralUse.integral) == '';
if (data.integralUseStatus == 1 && flag) {
that.$message.error('请填写抵现规则');
return;
}
if (data.integralUseStatus == 1) {
if (!Number(data.integralUse.fee)) {
showMsg.showmsg('抵现规则中的抵现金额不能为0', 'error');
return;
}
if (!Number(data.integralUse.integral)) {
showMsg.showmsg('抵现规则中的使用积分不能为0', 'error');
return;
}
}
// if (!data.channelList[0].useProportionalRestriction) {
// showMsg.showmsg('请填写比例限制', 'error');
// return;
// } else {
// if (data.channelList[0].useProportionalRestriction > 100) {
// showMsg.showmsg('比例限制不能大于100', 'error');
// return;
// }
// }
that.checkListValue(data).then(res => {
if (!res.flag) {
showMsg.showmsg(res.text, 'error');
return;
} else {
// 设置开启状态 1-->true
data.channelList.forEach(function(ele, index) {
ele.openStatus = ele.openStatus == true ? 1 : 0;
if (ele.channelType == 1) {
ele.strategyGoodsRelationIdArr = ele.goodsRelationIdArr;
delete ele.goodsRelationIdArr;
}
if (!ele.enterpriseRelationIdArr || !ele.enterpriseRelationIdArr.length) {
ele.enterpriseRelationIdArr = [];
}
if (!ele.storeRelationIdArr || !ele.storeRelationIdArr.length) {
ele.storeRelationIdArr = [];
}
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (ele.channelType == '9') {
ele.storeControlId = that.wmuuid;
}
});
let saveBool = true;
data.channelList.forEach(item => {
if (item.channelType == 1 && item.openStatus == 1) {
// 微信商城
// 适用商品
if (item.channelRelationProType == 2 && this.valueWx.length < 1) {
// 商品品牌
showMsg.showmsg('请选择商品品牌', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 3 && this.cateDataWx.length < 1) {
// 商品品类
showMsg.showmsg('请选择商品品类', 'error');
return (saveBool = false);
}
if (item.channelRelationProType == 4 && this.goodsListWx.length < 1) {
// 单件商品
showMsg.showmsg('请选择单件商品', 'error');
return (saveBool = false);
}
}
});
// 自定义人群
if (data.useCrowd == 2 && this.selectCount < 1) {
showMsg.showmsg('请选择人群定向', 'error');
return;
}
delete data.selectorParamsId;
// 规则需要乘以 10 去掉---20180906
// data.integralUse.fee = data.integralUse.fee;
// data.integralUse.integral = data.integralUse.integral;
data.integralUse = JSON.stringify(data.integralUse);
// if (data.channelList) {
// data.channelList.forEach(function(ele, index) {
// ele.openStatus = 1;
// });
// }
data.perpetualFlag = 1;
if (saveBool) {
that.saveForm(data);
}
}
})
} else {
log('error submit!!');
return false;
}
});
}
},
// 保存数据
saveForm(data) {
let that = this;
// log("编辑积分抵现策略:" ,data)
let para = data;
postJson('/api-admin/save-member-integral-strategy', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
// that.updateData()
that.$message({
message: '保存成功',
type: 'success'
});
that.changeRoute('/pointSystem');
return;
}
errMsg.errorMsg(resData);
// that.updateData()
})
.catch(function(error) {
log(error);
});
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm.strategyName = temp.trim();
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
},
inputFocus(obj, tag, flag) {
let that = this;
that.tempTag = tag;
that.tempData = obj;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 折扣重新写的判断
formatInputChange(e) {
let that = this;
log(e);
if (that.tempTag == 'integralUseDiscountControlLower' || that.tempTag == 'integralUseDiscountControlUpper') {
that.tempData[that.tempTag] = Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(e).replace(/[^\.\d]/g, '')).toFixed(2);
if (Number(that.tempData[that.tempTag]) > 10) {
that.tempData[that.tempTag] = Number(10).toFixed(2);
}
// if (Number(that.tempData.integralUseDiscountControlLower) >= Number(that.tempData.integralUseDiscountControlUpper)) {
// that.tempData.integralUseDiscountControlLower = String(Number(that.tempData.integralUseDiscountControlUpper - 1).toFixed(2)).indexOf('-') !='-1'? '0.00':Number(that.tempData.integralUseDiscountControlUpper - 1).toFixed(2)
// }
return;
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
log(e, e.target.value, that.tempData.integralUseDiscountControlLower);
that.tempData.integralUseDiscountControlLower = Number(String(that.tempData.integralUseDiscountControlLower).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.tempData.integralUseDiscountControlLower).replace(/[^\.\d]/g, '')).toFixed(2);
that.tempData.integralUseDiscountControlUpper = Number(String(that.tempData.integralUseDiscountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.tempData.integralUseDiscountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2);
},
formatInputNum(e) {
let that = this;
that.ruleForm.integralUse.fee = strLength.getCharVal(String(that.ruleForm.integralUse.fee).replace(/[^\.\d]/g, ''), 6);
that.ruleForm.integralUse.integral = strLength.getCharVal(String(that.ruleForm.integralUse.integral).replace(/[^\.\d]/g, ''), 8);
that.ruleForm.channelList[0].useProportionalRestriction = strLength.getCharVal(String(that.ruleForm.channelList[0].useProportionalRestriction).replace(/[^\d]/g, ''), 3);
},
formatInputNumBlur() {
let that = this;
that.ruleForm.integralUse.fee = Number(strLength.getCharVal(String(that.ruleForm.integralUse.fee).replace(/[^\.\d]/g, ''), 6)).toFixed(1);
// that.ruleForm.integralGet.integral = Number(strLength.getCharVal(String(that.ruleForm.integralGet.integral).replace(/[^\.\d]/g,''),8)).toFixed(1)
},
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// 获取策略信息
getInfo() {
let that = this;
let para = {
strategyId: that.ruleForm.integralStrategyId
};
postRequest('/api-admin/get-member-integral-strategy', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
// 商户列表
let prise = res.data.result.enterpriseList;
prise.forEach(function(ele, index) {
ele.label = ele.brandName;
ele.value = ele.enterpriseId;
});
that.mechantOption = prise;
let item = res.data.result.strategy;
if (item.channelList) {
item.channelList.forEach(item => {
if (item.channelType == '1') {
// 微信商城
if (item.channelRelationProType == 3) {
// 商品品类
if (item.goodsCategoryList) {
item.goodsCategoryList.forEach(item => {
that.selectCateDataWx.push(item);
});
}
}
if (item.channelRelationProType == 4) {
// 单件商品
if (item.strategyGoodsRelationIdArr) {
item.strategyGoodsRelationIdArr.forEach(item => {
that.goodsListWx.push(item);
});
}
}
if (item.channelRelationProType == 2) {
// 商品品牌
if (item.strategyGoodsRelationIdArr) {
item.strategyGoodsRelationIdArr.forEach(item => {
that.valueWx.push(item);
});
}
}
}
});
}
// 自定义人群
if (item.useCrowd == 2) {
let arr = JSON.parse(item.crowdJson);
this.selectCount = 0;
if (arr.list) {
arr.list.forEach(item => {
if (item.list) {
this.selectCount += item.list.length;
}
});
}
this.useId = item.selectorParamsId;
this.hasSearchData = item.crowdJson;
}
item.integralUse = JSON.parse(item.integralUse);
if (!item.integralUse) {
item.integralUse = {};
item.integralUse.fee = '';
item.integralUse.integral = '';
}
// 规则需要先除以10去掉 -----20180906
that.ruleForm = that.formatData(item);
that.$set(that.ruleForm, 'perpetualDate', []);
that.ruleForm.perpetualDate[1] = new Date(this.ruleForm.endValidTime);
that.ruleForm.perpetualDate[0] = new Date(this.ruleForm.startValidTime);
// 字数控制
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 去空值
bouncer(arr) {
return arr.filter(function(val) {
return !(!val || val === '');
});
},
formatData(item) {
item.integralGetStatus = String(item.integralGetStatus);
item.integralUseStatus = String(item.integralUseStatus);
item.useCrowd = String(item.useCrowd);
item.integralGet = JSON.parse(item.integralGet);
item.channelList.forEach((ele, index) => {
ele.openStatus = ele.openStatus == 0 ? false : true;
ele.channelType = String(ele.channelType);
ele.channelRelationStoreType = String(ele.channelRelationStoreType);
ele.channelStoreType = String(ele.channelStoreType);
ele.channelRelationProType = String(ele.channelRelationProType);
ele.integralUseDiscountControl = String(ele.integralUseDiscountControl);
ele.integralUseDiscountControlUpper = String(ele.integralUseDiscountControlUpper);
ele.integralUseDiscountControlLower = String(ele.integralUseDiscountControlLower);
ele.useProportionalRestriction = String(ele.useProportionalRestriction);
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (!ele.storeRelationIdArr || !ele.storeRelationIdArr.length) {
ele.storeRelationIdArr = [];
}
if (!ele.enterpriseRelationIdArr || !ele.enterpriseRelationIdArr.length) {
ele.enterpriseRelationIdArr = [];
}
if (ele.channelType == 9) {
this.wmuuid = ele.storeControlId;
this.isAdd = false;
}
});
let bool = item.channelList.some(item => item.channelType == 9);
!bool && item.channelList.push({
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
})
return item;
},
// 获取商品品牌 1
getGoodsBrand() {
let that = this;
let para = {};
getRequest('/api-mall/list-enterprise-brand', para)
.then(res => {
// log(res.data.result)
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptionsWx = data;
that.goodsTreeOptionsLine = data;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 选择商品品牌 微信商城
selectGoodsStoreWx(val) {
this.valueWx = val;
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.forEach(ele => {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
},
// 单件商品 的 子组件显示方法
showGoodsDialog(type) {
let that = this;
that.goodsType = type;
that.goodShow = true;
that.goodsListId = [];
if (type == 'wx') {
// that.goodsListId = ['1']
that.goodsListId = that.goodsListWx;
} else if (type == 'line') {
// that.goodsListId = ['12121']
that.goodsListId = that.goodsListLine;
}
},
// 单件商品 的 子组件触发方法
selectGoods(val) {
let that = this;
that.goodShow = false;
that.goodsListId = [];
if (val) {
if (val.goodsType == 'wx') {
that.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1') {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.strategyGoodsRelationIds.forEach(ele => {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
that.goodsListWx = val.strategyGoodsRelationIds;
} else if (val.goodsType == 'line') {
that.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '3') {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.strategyGoodsRelationIds.forEach(ele => {
that.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
});
}
});
that.goodsListLine = val.strategyGoodsRelationIds;
}
}
},
// 选择适用对象
changePeople(val) {
log(this.ruleForm.useCrowd);
},
showPeople() {
this.dialogVisiblePeople = true;
},
/* 人群筛选器 start */
getData() {
// 父组件调用子组件方法,触发父组件事件
this.$refs.peopleFilter.confirmSet();
},
findFilter(value) {
// 子组件触发父组件事件,返回过滤条件数据
log(value);
this.ruleForm.crowdJson = value;
this.searchParams = value;
if (this.ruleForm.crowdJson) {
let arr = JSON.parse(this.ruleForm.crowdJson);
this.selectCount = 0;
if (arr.list) {
arr.list.forEach(item => {
this.selectCount += item.list.length;
});
}
}
},
cancelFilter() {
this.$refs.peopleFilter.cancelSet();
},
getBackData(val) {
log(val);
this.ruleForm.selectorParams = val;
},
// 隐藏保存按钮和确认按钮 (子组件会调用)
hideBtn() {
let that = this;
that.toggleTag = false;
},
// 显示编辑,保存按钮隐藏,确认按钮显示 (子组件会调用)
editShow() {
this.toggleTag = true;
},
editHide() {
this.toggleTag = false;
},
getPeopleData() {
// 筛选器 弹框的确认按钮
let that = this;
that.$refs.peopleFilter.confirmSet();
setTimeout(function() {
if (that.searchParams) {
that.lsSaveBtn(that.searchParams);
}
}, 500);
},
lsSaveBtn(searchParams) {
// 人群筛选器弹框的确定按钮 临时保存
postRequest('/api-admin/get-screen-detail-param', {
requestProject: 'gic-web',
tempBusinessId: this.tempBusinessId ? this.tempBusinessId : '',
detailParams: searchParams
})
.then(res => {
if (res.data.errorCode == 0) {
this.tempBusinessId = res.data.result;
this.useId = res.data.result;
this.dialogVisiblePeople = false;
this.searchParams = '';
} else {
this.$message.error(res.data.message);
}
})
.catch(err => {
log(err);
});
},
// 商品品类
getCateIds(val) {
// 获取数据
// log(val);
if (val.selectCateType == 'wx') {
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1') {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
this.cateDataWx.push(ele);
});
}
});
} else if (val.selectCateType == 'line') {
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '3') {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr = [];
val.cateIdsList.forEach(ele => {
this.ruleForm.channelList[index].strategyGoodsRelationIdArr.push(ele);
this.cateDataLine.push(ele);
});
}
});
}
},
selectGoodsCateHide() {
// 调用子组件 商品品类组件的函数
if (this.ruleForm.channelList.length > 0) {
this.ruleForm.channelList.forEach((item, index) => {
if (item.channelType == '1' && item.channelRelationProType == 3) {
// 微信商城
if (this.$refs.selectGoodsCate instanceof Array) {
this.$refs.selectGoodsCate[0].hideDragClick();
} else {
this.$refs.selectGoodsCate.hideDragClick();
}
}
});
}
},
// 判断是否是太平鸟
getLoginInfo() {
let that = this;
let param = {};
postRequest('/api-auth/get-login-user-info', param)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (resData.result.enterpriseId == that.tpnEnterpriseId) {
that.tpnEditBool = true;
}
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
log(error);
});
}
},
components: {
topNavNew,
addGoods,
goodsCate
}
};
</script>
<style lang="less" scoped>
.right-box {
padding: 24px 32px;
}
.attention-wrap {
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.vue-treeselect {
display: inline-block;
vertical-align: top;
width: 300px;
}
.title-tip {
font-size: 12px;
color: #888;
}
.attention-content-wrap {
}
}
.form-wrap {
.el-input,
/deep/ .el-input-number {
width: 178px;
padding: 0 10px;
.el-input__inner {
text-align: left;
}
&.w-300 {
width: 300px;
/*/deep/ .el-input-group__append{
background-color: #fff;
border-left: 0px;
}
/deep/ .el-input__inner {
border-right: 0px;
}*/
}
&.w-340 {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
left: 303px;
color: #ccc;
font-size: 12px;
}
.el-select {
vertical-align: top;
}
.span-txt {
position: absolute;
left: 222px;
z-index: 2;
width: 300px;
text-align: center;
}
.padding-0 {
padding: 0;
}
.form-child {
width: 100%;
padding: 15px 20px 10px 0px;
background: #f5f6f9;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.margin-l-120 {
margin-left: 120px;
}
.margin-20 {
margin-top: 20px;
}
.tinymce-wrap {
width: 780px;
}
}
/*人群筛选器*/
.select-people {
max-height: 500px;
overflow-y: auto;
overflow-x: hidden;
}
.select-people /deep/ .marginLeft134 {
margin-left: 80px;
}
.select-people /deep/ .filter-content .member-templates-condition-title {
text-align: left;
font-size: 14px;
line-height: 24px;
}
.select-people /deep/ .filter-content {
margin-top: 0;
}
.people-btn-wrap {
width: 100%;
background: #f2f3f4;
box-sizing: border-box;
padding: 0 0 24px 100px;
}
.select-people /deep/ .detail {
margin-top: 0;
}
.margin-r-6 {
margin-right: 6px;
}
.right-box /deep/ .el-input__inner {
padding-right: 12px;
}
.right-box .padding-r-45 /deep/ .el-input__inner {
padding-right: 45px;
}
/* 商品品类 */
.goods-cate {
display: inline-block;
}
.goods-cate .goods-cate-content {
width: 217px;
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
<el-form-item label="等级名称" prop="gradeName" class="limit-el-item">
<el-input v-model="ruleForm.gradeName" class="w-340" @focus="focus('gradeName', 12)" @keyup.native="value => toInput(value)">
<!-- <template slot="append"><label class="input-label">{{inputNumObj.gradeName}}/12</label></template> -->
</el-input>
<label class="input-label">{{ inputNumObj.gradeName }}/12</label>
</el-form-item>
<el-form-item label="等级编码" prop="gradeCode" class="limit-el-item">
<el-input v-model="ruleForm.gradeCode" class="w-340" @focus="focus('gradeCode', 6)" @keyup.native="value => toInput(value)" :disabled="ruleForm.gradeCode == '' ? false : true">
<!-- <template slot="append"><label class="input-label">{{inputNumObj.gradeCode}}/6</label></template> -->
</el-input>
<label class="input-label">{{ inputNumObj.gradeCode }}/6</label>
</el-form-item>
<el-form-item label="等级类型" prop="gradeType">
<el-radio v-model="ruleForm.gradeType" label="1">常规卡</el-radio>
<el-radio v-model="ruleForm.gradeType" label="2">特殊卡</el-radio>
</el-form-item>
<!-- 自动升级 -->
<!-- 自动升级 -->
<el-form-item label="自动升级" prop="">
<el-switch v-model="ruleForm.autoUpgrade"> </el-switch>
</el-form-item>
<el-form-item label="升级条件" prop="" v-if="ruleForm.autoUpgrade">
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelHighcostSelect">当天消费满</el-checkbox>
<el-input v-model="ruleForm.upLevelHighcost" @focus="inputFocus('upLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelDaystoredSelect">当天储值满</el-checkbox>
<el-input v-model="ruleForm.upLevelDaystored" @focus="inputFocus('upLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumcostDays" @focus="inputFocus('upLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelSumcost" @focus="inputFocus('upLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelCostimesSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelCosttimesDays" @focus="inputFocus('upLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.upLevelCosttimes" @focus="inputFocus('upLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumstoredDays" @focus="inputFocus('upLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.upLevelSumstored" @focus="inputFocus('upLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.upLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.upLevelSumintegralDays" @focus="inputFocus('upLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得 </label>
<el-input v-model="ruleForm.upLevelSumintegral" @focus="inputFocus('upLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
<!-- 自动降级 -->
<el-form-item label="自动降级" prop="">
<el-switch v-model="ruleForm.autoDowngrade"> </el-switch>
</el-form-item>
<div v-if="ruleForm.autoDowngrade">
<el-form-item label="会员等级有效期" prop="">
<label> 自升级之日起算 </label>
<el-input v-model="ruleForm.gradeEffectDay" @focus="inputFocus('gradeEffectDay', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</el-form-item>
<el-form-item label="保级条件" prop="">
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelHighcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelHighcostDays" @focus="inputFocus('lowLevelHighcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天消费满</label>
<el-input v-model="ruleForm.lowLevelHighcost" @focus="inputFocus('lowLevelHighcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelDaystoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelDaystoredDays" @focus="inputFocus('lowLevelDaystoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内单天储值满</label>
<el-input v-model="ruleForm.lowLevelDaystored" @focus="inputFocus('lowLevelDaystored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumcostSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumcostDays" @focus="inputFocus('lowLevelSumcostDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelSumcost" @focus="inputFocus('lowLevelSumcost', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelCosttimesSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelCosttimesDays" @focus="inputFocus('lowLevelCosttimesDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内消费满</label>
<el-input v-model="ruleForm.lowLevelCosttimes" @focus="inputFocus('lowLevelCosttimes', 'day')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumstoredSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumstoredDays" @focus="inputFocus('lowLevelSumstoredDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内储值满</label>
<el-input v-model="ruleForm.lowLevelSumstored" @focus="inputFocus('lowLevelSumstored', 'money')" @keyup.native="formatInput($event)"></el-input>
<label></label>
</div>
<div class="check-cell">
<el-checkbox v-model="ruleForm.lowLevelSumintegralSelect"></el-checkbox>
<el-input v-model="ruleForm.lowLevelSumintegralDays" @focus="inputFocus('lowLevelSumintegralDays', 'day')" @keyup.native="formatInput($event)"></el-input>
<label>天内获得</label>
<el-input v-model="ruleForm.lowLevelSumintegral" @focus="inputFocus('lowLevelSumintegral', 'point')" @keyup.native="formatInput($event)"></el-input>
<label> 积分 </label>
</div>
</el-form-item>
</div>
<el-form-item class="font-0">
<el-button type="primary" @click="submitForm('ruleForm')">保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import strLength from '@/common/js/strlen';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'editMemberGrade',
data() {
return {
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '编辑商户会员等级',
path: '/memberGrade'
},
{
name: '编辑商户会员等级',
path: ''
}
],
enterpId: '',
// 输入控制
inputNumObj: {
gradeName: 0,
gradeCode: 0
},
// 记录输入的
inputFlag: '',
inputFlagNum: '',
// form
ruleForm: {},
rules: {
gradeName: [{ required: true, message: '请输入等级名称', trigger: 'blur' }],
gradeCode: [{ required: true, message: '请输入等级编码', trigger: 'blur' }],
gradeType: [{ required: true, message: '请输入等级类型', trigger: 'blur' }]
},
cliqueId: '',
cliqueName: ''
};
},
created() {
// this.selectReplayStyle()
},
methods: {
changeRoute(route) {
this.$router.push(route);
},
// 返回
goBack() {
this.$router.go(-1);
},
inputFocus(tag, flag) {
let that = this;
log(tag);
that.tempTag = tag;
if (!!flag) {
that.tempFlag = flag;
} else {
that.tempFlag = '';
}
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
log(e, e.target.value);
that.ruleForm[that.tempTag] = String(e.target.value).replace(/[^\.\d]/g, '');
// if (that.tempTag == 'discountControlLower' || that.tempTag =='discountControlUpper') {
// that.ruleForm[that.tempTag] = parseInt(String(e.target.value).replace(/[^\.\d]/g,'')).toFixed(2) == 'NaN'? '0.00': parseInt(String(e.target.value).replace(/[^\.\d]/g,'')).toFixed(2);
// return;
// }
if (!!that.tempFlag && that.tempFlag == 'day') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 4);
}
if (!!that.tempFlag && that.tempFlag == 'money') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 6);
}
if (!!that.tempFlag && that.tempFlag == 'point') {
that.ruleForm[that.tempTag] = strLength.getCharVal(String(e.target.value).replace(/[^\.\d]/g, ''), 8);
}
},
// 检查条件
checkUp(data) {
let flag = true;
if (!!data.autoUpgrade) {
if (!!data.upLevelHighcostSelect && !data.upLevelHighcost) {
flag = false;
}
if (!!data.upLevelDaystoredSelect && !data.upLevelDaystored) {
flag = false;
}
if (!!data.upLevelSumcostSelect && (!data.upLevelSumcostDays || !data.upLevelSumcost)) {
flag = false;
}
if (!!data.upLevelCostimesSelect && (!data.upLevelCosttimesDays || !data.upLevelCosttimes)) {
flag = false;
}
if (!!data.upLevelSumstoredSelect && (!data.upLevelSumstoredDays || !data.upLevelSumstored)) {
flag = false;
}
if (!!data.upLevelSumintegralSelect && (!data.upLevelSumintegralDays || !data.upLevelSumintegral)) {
flag = false;
}
}
return flag;
},
checkDown(data) {
let flag = true;
if (!!data.autoDowngrade) {
if (!data.gradeEffectDay) {
flag = false;
}
if (!!data.lowLevelHighcostSelect && (!data.lowLevelHighcostDays || !data.lowLevelHighcost)) {
flag = false;
}
if (!!data.lowLevelDaystoredSelect && (!data.lowLevelDaystoredDays || !data.lowLevelDaystored)) {
flag = false;
}
if (!!data.lowLevelSumcostSelect && (!data.lowLevelSumcostDays || !data.lowLevelSumcost)) {
flag = false;
}
if (!!data.lowLevelCosttimesSelect && (!data.lowLevelCosttimesDays || !data.lowLevelCosttimes)) {
flag = false;
}
if (!!data.lowLevelSumstoredSelect && (!data.lowLevelSumstoredDays || !data.lowLevelSumstored)) {
flag = false;
}
if (!!data.lowLevelSumintegralSelect && (!data.lowLevelSumintegralDays || !data.lowLevelSumintegral)) {
flag = false;
}
}
return flag;
},
// 保存
submitForm(formName) {
let that = this;
this.$refs[formName].validate(valid => {
if (valid) {
// alert('submit!');
if (!that.ruleForm.gradeName) {
showMsg.showmsg('请填写等级名称', 'error');
return;
}
if (!that.ruleForm.gradeCode) {
showMsg.showmsg('请填写等级编码', 'error');
return;
}
if (!that.checkUp(that.ruleForm)) {
showMsg.showmsg('请填写升级条件', 'error');
return;
}
if (!that.checkDown(that.ruleForm)) {
showMsg.showmsg('请填写降级条件', 'error');
return;
}
let data = JSON.parse(JSON.stringify(that.ruleForm));
data.enterpriseId = that.enterpId;
// 非空验证
//
data.discountControlUpper = data.discountControlUpper || '0';
data.discountControlLower = data.discountControlLower || '0';
data.autoDowngrade = data.autoDowngrade == true ? 1 : 2;
data.autoUpgrade = data.autoUpgrade == true ? 1 : 2;
data.gradeType = String(data.gradeType);
data.upLevelHighcostSelect = data.upLevelHighcostSelect == true ? 1 : 0;
data.upLevelDaystoredSelect = data.upLevelDaystoredSelect == true ? 1 : 0;
data.upLevelSumcostSelect = data.upLevelSumcostSelect == true ? 1 : 0;
data.upLevelCostimesSelect = data.upLevelCostimesSelect == true ? 1 : 0;
data.upLevelSumstoredSelect = data.upLevelSumstoredSelect == true ? 1 : 0;
data.upLevelSumintegralSelect = data.upLevelSumintegralSelect == true ? 1 : 0;
log(data.lowLevelHighcostSelect, data.lowLevelDaystoredSelect, data.lowLevelSumcostSelect, data.lowLevelCosttimesSelect, data.lowLevelSumstoredSelect, data.lowLevelSumintegralSelect);
data.lowLevelHighcostSelect = data.lowLevelHighcostSelect == true ? 1 : 0;
data.lowLevelDaystoredSelect = data.lowLevelDaystoredSelect == true ? 1 : 0;
data.lowLevelSumcostSelect = data.lowLevelSumcostSelect == true ? 1 : 0;
data.lowLevelCosttimesSelect = data.lowLevelCosttimesSelect == true ? 1 : 0;
data.lowLevelSumstoredSelect = data.lowLevelSumstoredSelect == true ? 1 : 0;
data.lowLevelSumintegralSelect = data.lowLevelSumintegralSelect == true ? 1 : 0;
// 值增加默认 0
data.upLevelHighcost = data.upLevelHighcost || 0;
data.upLevelDaystored = data.upLevelDaystored || 0;
data.upLevelSumcostDays = data.upLevelSumcostDays || 0;
data.upLevelSumcost = data.upLevelSumcost || 0;
data.upLevelCosttimesDays = data.upLevelCosttimesDays || 0;
data.upLevelCosttimes = data.upLevelCosttimes || 0;
data.upLevelSumstoredDays = data.upLevelSumstoredDays || 0;
data.upLevelSumstored = data.upLevelSumstored || 0;
data.upLevelSumintegralDays = data.upLevelSumintegralDays || 0;
data.upLevelSumintegral = data.upLevelSumintegral || 0;
data.gradeEffectDay = data.gradeEffectDay || 0;
data.lowLevelHighcostDays = data.lowLevelHighcostDays || 0;
data.lowLevelHighcost = data.lowLevelHighcost || 0;
data.lowLevelDaystoredDays = data.lowLevelDaystoredDays || 0;
data.lowLevelDaystored = data.lowLevelDaystored || 0;
data.lowLevelSumcostDays = data.lowLevelSumcostDays || 0;
data.lowLevelSumcost = data.lowLevelSumcost || 0;
data.lowLevelCosttimesDays = data.lowLevelCosttimesDays || 0;
data.lowLevelCosttimes = data.lowLevelCosttimes || 0;
data.lowLevelSumstoredDays = data.lowLevelSumstoredDays || 0;
data.lowLevelSumstored = data.lowLevelSumstored || 0;
data.lowLevelSumintegralDays = data.lowLevelSumintegralDays || 0;
data.lowLevelSumintegral = data.lowLevelSumintegral || 0;
that.saveInfo(data);
} else {
log('error submit!!');
return false;
}
});
},
// 保存
saveInfo(form) {
let that = this;
let para = form;
postRequest('/api-admin/do-save-member-grade', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('保存成功', 'success');
that.goBack();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
focus(name, num) {
let that = this;
log(name, num);
that.inputFlag = name;
that.inputFlagNum = num;
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm[that.inputFlag] = temp.trim();
that.inputNumObj[that.inputFlag] = strLength.getZhLen(that.ruleForm[that.inputFlag]);
},
// 获取等级信息
getMemberGradeInfo() {
let that = this;
let para = {
gradeId: that.ruleForm.gradeId
};
postRequest('/api-admin/get-member-grade-info', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result.dto;
data.autoDowngrade = data.autoDowngrade == 1 ? true : false;
data.autoUpgrade = data.autoUpgrade == 1 ? true : false;
data.gradeType = String(data.gradeType);
data.upLevelHighcostSelect = data.upLevelHighcostSelect == 1 ? true : false;
data.upLevelDaystoredSelect = data.upLevelDaystoredSelect == 1 ? true : false;
data.upLevelSumcostSelect = data.upLevelSumcostSelect == 1 ? true : false;
data.upLevelCostimesSelect = data.upLevelCostimesSelect == 1 ? true : false;
data.upLevelSumstoredSelect = data.upLevelSumstoredSelect == 1 ? true : false;
data.upLevelSumintegralSelect = data.upLevelSumintegralSelect == 1 ? true : false;
log(data.lowLevelHighcostSelect, data.lowLevelDaystoredSelect, data.lowLevelSumcostSelect, data.lowLevelCosttimesSelect, data.lowLevelSumstoredSelect, data.lowLevelSumintegralSelect);
data.lowLevelHighcostSelect = data.lowLevelHighcostSelect == 1 ? true : false;
data.lowLevelDaystoredSelect = data.lowLevelDaystoredSelect == 1 ? true : false;
data.lowLevelSumcostSelect = data.lowLevelSumcostSelect == 1 ? true : false;
data.lowLevelCosttimesSelect = data.lowLevelCosttimesSelect == 1 ? true : false;
data.lowLevelSumstoredSelect = data.lowLevelSumstoredSelect == 1 ? true : false;
data.lowLevelSumintegralSelect = data.lowLevelSumintegralSelect == 1 ? true : false;
that.ruleForm = data;
that.inputNumObj.gradeName = strLength.getZhLen(that.ruleForm.gradeName);
that.inputNumObj.gradeCode = strLength.getZhLen(that.ruleForm.gradeCode);
// showMsg.showmsg('设置成功','success')
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
components: {
topNavNew
},
mounted() {
let that = this;
log('mounted', that.$route.query.gradeId);
that.ruleForm.gradeId = that.$route.query.gradeId;
that.getMemberGradeInfo();
that.cliqueId = that.$route.query.enterpriseId;
that.cliqueName = that.$route.query.name;
that.navpath[3].name = '编辑【' + that.cliqueName + '】会员等级';
that.navpath[3].path = '/memberGrade?enterpriseId=' + that.cliqueId + '&name=' + that.cliqueName;
that.navpath[4].name = '编辑【' + that.cliqueName + '】等级';
that.enterpId = sessionStorage.getItem('enterpriseId');
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.el-input {
width: 180px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .el-form-item__label {
padding: 0 12px 0 0;
}
/deep/ .el-form {
.el-form-item:last-child {
/*margin-bottom: 0;*/
.el-button {
margin-top: 25px;
}
}
}
.limit-el-item {
/deep/ .el-form-item__content {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
right: 10px;
top: 2px;
color: #909399;
font-size: 13px;
}
.check-cell {
.el-input {
margin: 0 10px;
}
& + .check-cell {
margin-top: 15px;
}
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<div class="form-wrap">
<el-form :model="ruleForm" ref="ruleForm" label-width="120px" class="demo-ruleForm">
<el-form-item label="策略名称" prop>
<el-input
v-model="ruleForm.strategyName"
class="w-340"
@keyup.native="value => toInput(value)"
>
<!-- <template slot="append"><label class="input-label">{{cateNameLength}}/20</label></template> -->
</el-input>
<label class="input-label">{{ cateNameLength }}/20</label>
</el-form-item>
<template v-for="(item, index) in ruleForm.channelList">
<!-- 线下渠道 -->
<template v-if="item.channelType == 3">
<el-form-item label="适用线下渠道" prop :key="index">
<el-switch v-model="item.openStatus" active-text="启用" inactive-text="停用"></el-switch>
</el-form-item>
<div class="form-child" v-if="item.openStatus" :key="index">
<el-form-item label="消费门店" prop="region">
<vue-gic-store-group
:scenesVal="scencs"
:options="options"
:isAdd="isAdd"
:uuid.sync="uuid"
ref="storeGroup"
></vue-gic-store-group>
</el-form-item>
<el-form-item label="适用商品" prop="name" class="padding-0">
<el-select
v-model="item.channelRelationProType"
placeholder="请选择"
@change="changeGood($event)"
>
<el-option
v-for="item in applyGoods"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<!-- 二级 -->
<span
class="span-txt"
ref="treeinput"
v-if="item.channelRelationProType == 2"
@click="toggle('brand')"
>已选择 {{ item.strategyGoodsRelationIdArr ? item.strategyGoodsRelationIdArr.length : 0 }} 个品牌</span>
<span
class="span-txt"
ref="treeinput"
v-if="item.channelRelationProType == 3"
@click="toggle('brand')"
>已选择 {{ item.strategyGoodsRelationIdArr ? item.strategyGoodsRelationIdArr.length : 0 }} 个品类</span>
<treeselect
v-if="item.channelRelationProType == 2 || item.channelRelationProType == 3"
placeholder
noOptionsText="暂无数据"
noResultsText="无数据"
noChildrenText="暂无数据"
:multiple="true"
:flat="true"
:always-open="goodsOpen"
:options="goodsTreeOptions"
:load-options="loadOptions"
:normalizer="goodNormalizer"
:value-consists-of="valueConsistsOf"
v-model="item.strategyGoodsRelationIdArr"
/>
<!--:default-expand-level="1":load-options="loadOptions" :normalizer="normalizer" :always-open="goodsOpen" -->
<el-button
v-if="item.channelRelationProType == 4"
@click="showGoodsDialog"
>已选0件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<!-- <el-input v-model="item.integralUseDiscountControlLower" @focus="inputFocus(item)" @keyup.native="formatInput($event)"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlLower"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
:step="0.01"
></el-input-number>
<label></label>
<!-- <el-input v-model="item.integralUseDiscountControlUpper" @focus="inputFocus(item)" @keyup.native="formatInput($event)"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlUpper"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label>折商品都适用</label>
<span
style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;"
>注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<template v-if="item.channelType == 1">
<!-- 微信商城 -->
<el-form-item label="适用微信商城" prop :key="index">
<el-switch v-model="item.openStatus" active-text="启用" inactive-text="停用"></el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus == true" :key="index">
<el-form-item label="选择商户">
<el-select
size="small"
v-model="item.enterpriseRelationIdArr"
placeholder="请选择"
multiple
>
<el-option
v-for="(item, ind) in mechantOption"
:key="ind"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="适用商品" class="padding-0">
<el-select
v-model="item.channelRelationProType"
placeholder="请选择"
@change="changeGood($event)"
>
<el-option
v-for="item in applyGoods"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<!-- 二级 -->
<span
class="span-txt"
ref="treeinput"
v-if="item.channelRelationProType == 2"
@click="toggle('wx')"
>已选择 {{ item.goodsRelationIds ? item.goodsRelationIds.length : 0 }} 个品牌</span>
<span
class="span-txt"
ref="treeinput"
v-if="item.channelRelationProType == 3"
@click="toggle('wx')"
>已选择 {{ item.goodsRelationIds ? item.goodsRelationIds.length : 0 }} 个品类</span>
<treeselect
v-if="item.channelRelationProType == 2 || item.channelRelationProType == 3"
placeholder
noOptionsText="暂无数据"
noResultsText="无数据"
noChildrenText="暂无数据"
:multiple="true"
:always-open="wxOpen"
:options="goodsTreeOptions"
:value-consists-of="valueConsistsOf"
v-model="item.goodsRelationIds"
:normalizer="goodNormalizer"
@select="selectWx($event, index, item)"
/>
<!--model=item.strategyGoodsRelationIds和上一个相同会有问题 -->
<el-button
v-if="item.channelRelationProType == 4"
@click="showGoodsDialog"
>已选0件商品</el-button>
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<!-- <el-input v-model="item.integralUseDiscountControlLower" @focus="inputFocus(item)" @keyup.native="formatInput($event)"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlLower"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label></label>
<!-- <el-input v-model="item.integralUseDiscountControlUpper" @focus="inputFocus(item)" @keyup.native="formatInput($event)"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlUpper"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label>折商品都适用</label>
<span
style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;"
>注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<template v-if="false">
<!-- 第三方 -->
<el-form-item label="第三方电商渠道" prop :key="index">
<el-switch v-model="item.openStatus" active-text="启用" inactive-text="停用"></el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus == true" :key="index">
<el-form-item label="选择店铺">
<el-select v-model="item.channelRelationStoreType" placeholder="请选择">
<el-option
v-for="item in allShopOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="天猫商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option
v-for="item in allGoodOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
<!-- 二级 -->
<!-- <treeselect
v-if="item.thirdApplyTmallGoods==1||item.thirdApplyTmallGoods==2"
placeholder="所有分类"
noOptionsText="暂无数据"
noResultsText="无数据"
:multiple="true"
:options="wxTreeOptions"
:value-consists-of="valueConsistsOf"
v-model="item.thirdApplyTmallGoodsIds"
/>
<el-button v-if="item.thirdApplyTmallGoods==3" @click="showGoodsDialog">已选0件商品</el-button>-->
</el-form-item>
<el-form-item label="折扣控制" prop="region">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<!-- <el-input v-model="item.integralUseDiscountControlLower" @focus="inputFocus(item)" @keyup.native="formatInput($event)"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlLower"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label></label>
<!-- <el-input v-model="item.integralUseDiscountControlUpper" @focus="inputFocus(item)" @keyup.native="formatInput($event)"></el-input> -->
<el-input-number
v-model="item.integralUseDiscountControlUpper"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label>折商品都适用</label>
<span
style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;"
>注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
<!-- 微盟渠道-->
<template v-if="item.channelType == 9">
<el-form-item label="微盟渠道" prop :key="index">
<el-switch v-model="item.openStatus"></el-switch>
</el-form-item>
<div class="form-child margin-20" v-if="item.openStatus == true" :key="index">
<el-form-item label="选择店铺">
<<<<<<< HEAD
<el-select v-model="item.channelRelationStoreType" placeholder="请选择">
<el-option
v-for="item in wMShopOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
=======
<vue-gic-store-new :scenesVal="scencs" :options="options" :isAdd="isAdd" :uuid.sync="wmuuid" ref="wmstoreGroup"></vue-gic-store-new>
>>>>>>> b6cc33e0cc78f5c575323640202f891ca22ea7b9
</el-form-item>
<el-form-item label="微盟商品" class="padding-0">
<el-select v-model="item.channelRelationProType" placeholder="请选择">
<el-option
v-for="item in wMGoodOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="折扣控制" prop="region" class="input-margin-b">
<div class="radio-cell">
<el-radio v-model="item.integralUseDiscountControl" label="1">所有折扣商品都适用</el-radio>
</div>
<div class="radio-cell margin-20">
<el-radio v-model="item.integralUseDiscountControl" label="2">折扣</el-radio>
<el-input-number
v-model="item.integralUseDiscountControlLower"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label></label>
<el-input-number
v-model="item.integralUseDiscountControlUpper"
:precision="2"
:controls="false"
:max="10.0"
:min="0.01"
></el-input-number>
<label>折商品都适用</label>
<span
style="font-size: 13px;color: #828282;line-height: 1;padding-left: 10px;"
>注意:折扣范围0.01-10.00,最低折扣不能大于最高折扣</span>
</div>
</el-form-item>
</div>
</template>
</template>
<el-form-item label="适用对象" prop class="margin-20">
<el-select v-model="ruleForm.useCrowd" placeholder="请选择">
<el-option
v-for="item in applyObjOption"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="人群定向" v-if="ruleForm.useCrowd == 2" prop class="padding-0">
<el-button style="width: 214px;" @click="showPeople">已设置{{ selectCount }}项筛选</el-button>
</el-form-item>
<el-form-item label="获取规则" prop>
<div>
<el-radio v-model="ruleForm.integralGetStatus" label="1">每消费</el-radio>
<!-- <el-input v-model="ruleForm.integralGet.fee" @blur="formatInputNumBlur($event)"></el-input> -->
<el-input-number
v-model="ruleForm.integralGet.fee"
:precision="1"
:controls="false"
:max="10000.0"
:min="0.1"
></el-input-number>
<label>元,获取</label>
<!-- <el-input v-model="ruleForm.integralGet.integral" @blur="formatInputNumBlur($event)"></el-input> -->
<el-input-number
v-model="ruleForm.integralGet.integral"
:precision="1"
:controls="false"
:max="10000.0"
:min="0.1"
></el-input-number>
<label>积分。取整策略为</label>
<el-select v-model="ruleForm.integralGetStrategy" placeholder="请选择">
<el-option
v-for="item in cateOptions"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</div>
<div>
<el-radio v-model="ruleForm.integralGetStatus" label="0" class="margin-20">不获取积分</el-radio>
</div>
</el-form-item>
<el-form-item label="积分冻结期" v-if="ruleForm.integralGetStatus == 1">
<el-input
v-model="ruleForm.integralGetFreezeDays"
@keyup.native="formatInputNum($event)"
></el-input>
<label></label>
</el-form-item>
<el-form-item label="积分有效期" v-if="ruleForm.integralGetStatus == 1">
<el-input
v-model="ruleForm.integralGetEffectiveDays"
@keyup.native="formatInputNum($event)"
></el-input>
<label></label>
</el-form-item>
<!-- 新增策略有效期配置 -->
<el-form-item label="策略有效期" prop>
<!-- 1 永久 0 非永久 -->
<el-radio v-model="ruleForm.perpetualFlag" :label="1">永久有效</el-radio>
<el-radio v-model="ruleForm.perpetualFlag" :label="0">
在该时段内有效
<el-date-picker
v-if="ruleForm.perpetualFlag === 0"
v-model="ruleForm.perpetualDate"
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm"
value-format="yyyy-MM-dd HH:mm:ss"
:default-time="['00:00:00', '23:59:59']"
></el-date-picker>
</el-radio>
</el-form-item>
<el-form-item>
<el-button
:disabled="tpnEditBool"
type="primary"
@click.stop="submitForm('ruleForm')"
>保 存</el-button>
<el-button @click="goBack">返 回</el-button>
</el-form-item>
</el-form>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
<!-- 添加商品 -->
<add-goods :goodShow="goodShow" :projectName="repProjectName" @selectGoods="selectGoods"></add-goods>
<!-- 人群筛选器的弹框 -->
<el-dialog
title="自定义人群"
:visible.sync="dialogVisiblePeople"
:close-on-click-modal="false"
width="980px"
>
<div class="select-people">
<vue-gic-group-people
:useId="useId"
:hasSearchData="hasSearchData"
:sceneValue="sceneValue"
ref="peopleFilter"
@findFilter="findFilter"
@getBackData="getBackData"
@editHide="editHide"
@editShow="editShow"
@hideBtn="hideBtn"
></vue-gic-group-people>
<div v-show="toggleTag" class="people-btn-wrap">
<el-row>
<el-button @click="getData" type="primary" size="small">确定</el-button>
<el-button @click="cancelFilter" size="small">取消</el-button>
</el-row>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-row>
<el-button @click="dialogVisiblePeople = false">取 消</el-button>
<el-button type="primary" @click="getPeopleData">确 定</el-button>
</el-row>
</span>
</el-dialog>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import addGoods from 'components/memberShip/add-goods';
import Treeselect from '@riophae/vue-treeselect';
// import the styles
import '@riophae/vue-treeselect/dist/vue-treeselect.css';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { postRequest, postJson } from '@/api/api';
import strLength from '@/common/js/strlen';
import { log } from '@/utils/index.js';
const timeStramp = {
year: new Date().getFullYear(),
month: new Date().getMonth(),
day: new Date().getDate()
};
export default {
name: 'editPointSytem',
data() {
return {
repProjectName: 'gic-clique',
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '积分制度',
path: '/pointSystem'
},
{
name: '编辑积分获取策略',
path: ''
}
],
// 添加商品弹窗
goodShow: false,
// 输入字限制
inputFlagNum: 20,
// 门店
StoreOptions: [
{
label: '所有门店',
value: '1'
},
{
label: '门店分组',
value: '2'
},
{
label: '部分门店',
value: '3'
}
],
StoreTypeOptions: [
{
label: '所有门店',
value: '-1'
},
{
label: '自营',
value: '0'
},
{
label: '联营',
value: '1'
},
{
label: '加盟',
value: '2'
},
{
label: '代销',
value: '3'
},
{
label: '托管',
value: '4'
}
],
applyGoods: [
{
label: '所有商品',
value: '1'
}
],
// tree
openOnFocus: true,
alwaysOpen: false,
goodsOpen: false,
wxOpen: false,
valueConsistsOf: 'ALL',
treeOptions: [],
storeNormalizer(node) {
return {
id: node.storeGroupId,
label: node.storeGroupName,
children: node.children
};
},
// 适用商品
goodsTreeOptions: [],
goodNormalizer(node /*, id */) {
// there is an extra `id` argument,
// which could be useful if you have multiple instances
// of vue-treeselect that share the same `normalizer` function
log(node);
return {
id: node.key,
label: node.name,
children: node.subOptions
};
},
// wxTreeOptions
wxTreeOptions: [],
// 商户
mechantOption: [],
// 第三方下拉
allShopOption: [
{
label: '所有店铺',
value: '1'
}
],
allGoodOption: [
{
label: '所有商品',
value: '1'
}
],
// 微盟渠道
wMShopOption: [
{
label: '所有店铺', // 就是所有门店
value: '1'
}
],
wMGoodOption: [
{
label: '所有商品',
value: '1'
}
],
storeListOptions: [], //下拉搜索出现的门店列表
// 适用对象
applyObjOption: [
{
label: '所有会员',
value: '1'
},
{
label: '自定义人群',
value: '2'
}
],
// 长度
cateNameLength: 0,
ruleForm: {
// 积分获取规则
integralStrategyId: 'ff80808163a7a09b0163b01171e202db', //策略id
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000',
strategyName: 1, //策略名称
strategyType: 1, // 策略类型 1消费积分 2积分抵现
useCrowd: 1, // 策略类型 1所有 2人群筛选
crowdJson: '', //人群筛选器内容
integralGetStatus: '1', // 积分获取开启 1是0否
integralGet: { fee: 1, integral: 1 },
integralGetStrategy: '1', // 取整策略 1四舍五入 2抹零 3向上取整
integralGetFreezeDays: 1, // 获取积分冻结天数
integralGetEffectiveDays: 1, // 获取积分有效天
integralUseStatus: 0, // 积分抵现开启 1是0否
integralUse: null, // 积分抵现 {fee:5,integral:5}
perpetualFlag: 1,
channelList: []
},
cateOptions: [
{
value: '1',
label: '四舍五入'
},
{
value: '2',
label: '抹零'
},
{
value: '3',
label: '进位制'
}
],
/* 人群筛选器 */
dialogVisiblePeople: false,
sceneValue: 'member', // 场景值
useId: '',
searchParams: '',
hasSearchData: '', // 当前页回显的数据(接口返回)
toggleTag: false,
selectCount: 0,
// 门店 新
uuid: '', // 新增传空,编辑必传,
options: [0, 1, 2, 3, 4, 5], // 0 全部 1 门店类型 2门店标签 3 门店区域 4 门店分组 5 部分门店
isAdd: true,
scencs: 'integral',
wmuuid: '', // 微盟
// 太平鸟标识
tpnEditBool: false,
tpnEnterpriseId: 'ff808081671d3ceb01672adebf4e6149'
};
},
methods: {
// 返回
goBack() {
this.$router.go(-1);
},
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// input focus
inputFocus(obj) {
let that = this;
that.tempData = obj;
},
// 输入框输入校验数字
formatInput(e) {
let that = this;
that.tempData.integralUseDiscountControlLower = Number(String(that.tempData.integralUseDiscountControlLower).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.tempData.integralUseDiscountControlLower).replace(/[^\.\d]/g, '')).toFixed(2);
that.tempData.integralUseDiscountControlUpper = Number(String(that.tempData.integralUseDiscountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2) == 'NaN' ? '0.00' : Number(String(that.tempData.integralUseDiscountControlUpper).replace(/[^\.\d]/g, '')).toFixed(2);
},
formatInputNum(e) {
let that = this;
that.ruleForm.integralGetEffectiveDays = strLength.getCharVal(String(that.ruleForm.integralGetEffectiveDays).replace(/[^\d]/g, ''), 4);
that.ruleForm.integralGetFreezeDays = strLength.getCharVal(String(that.ruleForm.integralGetFreezeDays).replace(/[^\d]/g, ''), 4);
// that.ruleForm.integralGet.fee = strLength.getCharVal(String(that.ruleForm.integralGet.fee).replace(/[^\.\d]/g,''),6)
that.ruleForm.integralGet.integral = strLength.getCharVal(String(that.ruleForm.integralGet.integral).replace(/[^\d]/g, ''), 8);
},
formatInputNumBlur() {
let that = this;
that.ruleForm.integralGet.fee = Number(strLength.getCharVal(String(that.ruleForm.integralGet.fee).replace(/[^\.\d]/g, ''), 6)).toFixed(1);
// that.ruleForm.integralGet.integral = Number(strLength.getCharVal(String(that.ruleForm.integralGet.integral).replace(/[^\.\d]/g,''),8)).toFixed(1)
},
async checkListValue(data) {
let obj = {
flag: true,
text: ''
};
if (!!data.channelList.length) {
for (let i = 0; i < data.channelList.length; i++) {
if (!!data.channelList[i].openStatus) {
if (data.channelList[i].integralUseDiscountControl == 2) {
if (!data.channelList[i].integralUseDiscountControlUpper || !data.channelList[i].integralUseDiscountControlLower) {
obj.flag = false;
obj.text = '请填写折扣';
}
if (parseInt(data.channelList[i].integralUseDiscountControlUpper) > 10 || parseInt(data.channelList[i].integralUseDiscountControlLower) > 10 || Number(data.channelList[i].integralUseDiscountControlUpper) <= Number(data.channelList[i].integralUseDiscountControlLower)) {
obj.flag = false;
obj.text = '折扣格式有误';
}
}
if (data.channelList[i].channelType == 1 && !data.channelList[i].enterpriseRelationIdArr.length) {
obj.flag = false;
obj.text = '请选择商户';
}
if (data.channelList[i].channelType == 3) {
const storeGroupDom = this.$refs.storeGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.storeGroup[0].isStoreSave();
} else {
flag = await this.$refs.storeGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
if (data.channelList[i].channelType == 9) {
const storeGroupDom = this.$refs.wmstoreGroup;
let flag = null;
if (storeGroupDom instanceof Array) {
flag = await this.$refs.wmstoreGroup[0].isStoreSave();
} else {
flag = await this.$refs.wmstoreGroup.isStoreSave();
}
if (!flag) {
obj.flag = false;
obj.text = '请选择门店';
}
}
}
}
}
return obj;
},
// 保存
submitForm(formName) {
let that = this;
if (!that.tpnEditBool) {
this.$refs[formName].validate(valid => {
if (valid) {
// 处理数据
let data = JSON.parse(JSON.stringify(that.ruleForm));
delete data.selectorParamsId;
if (!data.strategyName) {
showMsg.showmsg('请填写策略名称', 'error');
return;
}
let flag = !data.integralGet.fee || String(data.integralGet.integral) == '';
if (data.integralGetStatus == 1 && flag) {
showMsg.showmsg('请填写获取规则', 'error');
return;
}
if (data.integralGetStatus == 1) {
if (!Number(data.integralGet.fee)) {
showMsg.showmsg('获取规则中的消费金额不能为0', 'error');
return;
}
if (!Number(data.integralGet.integral)) {
showMsg.showmsg('获取规则中的获取积分不能为0', 'error');
return;
}
}
if (data.integralGetStatus == 1 && !Number(data.integralGetFreezeDays) && data.integralGetFreezeDays != '0') {
showMsg.showmsg('请填写积分冻结期', 'error');
return;
}
if (data.integralGetStatus == 1 && !Number(data.integralGetEffectiveDays)) {
showMsg.showmsg('请填写积分有效期', 'error');
return;
}
that.checkListValue(data).then(res => {
if (!res.flag) {
showMsg.showmsg(res.text, 'error');
return;
} else {
data.channelList.forEach(function(ele, index) {
ele.openStatus = ele.openStatus == true ? 1 : 0;
delete ele.strategyGoodsRelationIds;
delete ele.enterpriseRelationIds;
delete ele.storeRelationIds;
if (ele.channelType == 1) {
ele.strategyGoodsRelationIdArr = ele.goodsRelationIdArr;
delete ele.goodsRelationIdArr;
}
if (!ele.enterpriseRelationIdArr || !ele.enterpriseRelationIdArr.length) {
ele.enterpriseRelationIdArr = [];
}
if (!ele.storeRelationIdArr || !ele.storeRelationIdArr.length) {
ele.storeRelationIdArr = [];
}
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (ele.channelType == '3') {
ele.channelRelationStoreType = '1';
ele.channelStoreType = '-1';
ele.storeControlId = that.uuid;
}
if (ele.channelType == '9') {
ele.storeControlId = that.wmuuid;
}
});
data.integralGet.fee = parseInt(data.integralGet.fee * 10);
data.integralGet.integral = parseInt(data.integralGet.integral * 10);
data.integralGet = JSON.stringify(data.integralGet);
// 3.0_特殊策略新增有效期配置
if (data.perpetualFlag === 1) {
// 永久
// perpetualFlag 是否永久 0 非永久 1永久'
// startValidTime 有效期时间开始(毫秒时间戳)
// endValidTime 有效时间结束(毫秒时间戳)
} else {
// 时间区间
if (data.perpetualDate[0].indexOf('Z') > -1) {
// 说明第一次没有动过
data.startValidTime = new Date(this.transUTCTime(data.perpetualDate[0]) + ' 00:00').getTime();
data.endValidTime = new Date(this.transUTCTime(data.perpetualDate[1]) + ' 23:59').getTime();
} else {
data.startValidTime = new Date(data.perpetualDate[0].slice(0, -3)).getTime();
data.endValidTime = new Date(data.perpetualDate[1].slice(0, -3)).getTime();
}
}
delete data.perpetualDate;
that.saveForm(data);
}
});
} else {
log('error submit!!');
return false;
}
});
}
},
// 保存数据
saveForm(data) {
let that = this;
let para = data;
postJson('/api-admin/save-member-integral-strategy', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
that.$message.success('保存成功');
that.changeRoute('/pointSystem');
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 更新数据
updateData() {
let that = this;
// that.ruleForm.integralGet = JSON.parse(that.ruleForm.integralGet)
that.ruleForm.integralGet.fee = parseInt(that.ruleForm.integralGet.fee / 10);
that.ruleForm.integralGet.integral = parseInt(that.ruleForm.integralGet.integral / 10);
},
// 树形结构
toggle(flag) {
let that = this;
that.treeFlag = flag;
if (flag == 'store') {
that.alwaysOpen = true;
log(that.alwaysOpen);
}
if (flag == 'brand') {
that.goodsOpen = true;
}
if (flag == 'wx') {
that.wxOpen = true;
}
document.addEventListener('click', that.hidePanel, false);
},
hidePanel(e) {
let that = this;
log(that.$refs.treeinput, e.target.className, typeof e.target.className, that.treeFlag);
if (typeof e.target.className == 'object') {
return;
}
let tag =
e.target.className != 'span-txt' &&
e.target.className != 'vue-treeselect__list' &&
e.target.className != 'vue-treeselect__label' &&
!e.target.className.includes('vue-treeselect__list-item vue-treeselect__indent-level') &&
e.target.className != 'vue-treeselect__minus-mark' &&
e.target.className != 'vue-treeselect__option' &&
e.target.className != 'vue-treeselect__option vue-treeselect__option--highlight' &&
!e.target.className.includes('vue-treeselect__checkbox vue-treeselect__checkbox--') &&
e.target.className != 'vue-treeselect__option-arrow-placeholder' &&
e.target.className != 'el-form demo-ruleForm' &&
e.target.className != 'vue-treeselect__option vue-treeselect__option--selected vue-treeselect__option--highlight' &&
e.target.className != 'vue-treeselect__list-item vue-treeselect__indent-level-1' &&
e.target.className != 'vue-treeselect__list-item vue-treeselect__indent-level-0' &&
e.target.className != 'vue-treeselect__checkbox-container' &&
e.target.className != 'vue-treeselect__option-arrow-container' &&
e.target.className != 'vue-treeselect__option-arrow vue-treeselect__option-arrow--rotated';
log(tag);
if (tag) {
if (that.treeFlag == 'store') {
that.alwaysOpen = false;
}
if (that.treeFlag == 'brand') {
that.goodsOpen = false;
}
if (that.treeFlag == 'wx') {
that.wxOpen = false;
}
}
},
// 微信
selectWx(e, index, item) {
let that = this;
item.strategyGoodsRelationIds = item.goodsRelationIds;
let data = that.ruleForm.channelList[index];
data.strategyGoodsRelationIds = [];
data.goodsRelationIds.forEach(function(ele, index) {
data.strategyGoodsRelationIds.push(ele);
});
},
// 搜索后出现下拉列表
// 点击
searchFocus(index, item) {
log(index, item);
},
// 搜索
remoteMethod(query) {
let that = this;
if (query !== '') {
// 获取搜索列表数据
that.getStoreList(query);
} else {
that.storeListOptions = [];
}
},
// 获取门店列表
getStoreList(query) {
let that = this;
log(query);
let para = {
searchParam: query,
flag: null,
requestProject: that.repProjectName
};
postRequest('/api-plug/query-store-by-code-name', para)
.then(res => {
log(res, res.data, res.data.errorCode);
let resData = res.data;
if (resData.errorCode == 0) {
resData.result.forEach(function(ele, index) {
ele.id = ele.storeId;
ele.value = ele.storeName;
ele.key = ele.storeId;
});
that.storeListOptions = resData.result;
return;
}
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
log(error);
// that.toLogin()
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 获取门店分组
getStoreGroup() {
let that = this;
let para = {};
log(para, '1111');
postRequest('/api-admin/get-clique-storegroup', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
that.treeOptions = resData.result;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 输入
toInput: function(value) {
let that = this;
let temp = strLength.getByteVal(value.target.value, that.inputFlagNum);
that.ruleForm.strategyName = temp.trim();
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
},
selStore(e, index, item) {
item.storeRelationIdArr = [];
},
// 微信选择商品类别
wxChange(e) {
let that = this;
that.getGoodsCategory();
},
// 线下渠道选择商品类别
changeGood(e) {
let that = this;
log('线下渠道选择商品类别:', e);
if (e == 2) {
that.getGoodsBrand();
}
if (e == 3) {
that.getGoodsCategory();
}
},
// 获取商品品牌
getGoodsBrand() {
let that = this;
let para = {};
postRequest('/api-admin/', para)
.then(res => {
log(res.data.result);
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
that.goodsTreeOptions = data;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 子组件显示方法
showGoodsDialog() {
let that = this;
that.goodShow = true;
},
// 子组件触发方法
selectGoods(val) {
let that = this;
that.goodShow = false;
},
// 获取策略信息
getInfo() {
let that = this;
let para = {
strategyId: that.ruleForm.integralStrategyId
};
postRequest('/api-admin/get-member-integral-strategy', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let item = res.data.result.strategy;
// 商户列表
let prise = res.data.result.enterpriseList;
prise.forEach(function(ele, index) {
ele.label = ele.brandName;
ele.value = ele.enterpriseId;
});
that.mechantOption = prise;
// 自定义人群
if (item.useCrowd == 2) {
let arr = item.crowdJson ? JSON.parse(item.crowdJson) : [];
that.selectCount = 0;
if (arr.list) {
arr.list.forEach(item => {
if (item.list) {
that.selectCount += item.list.length;
}
});
}
that.useId = item.selectorParamsId;
that.hasSearchData = item.crowdJson;
}
that.ruleForm = that.formatData(item);
that.$set(that.ruleForm, 'perpetualDate', []);
that.ruleForm.perpetualDate[1] = new Date(this.ruleForm.endValidTime);
that.ruleForm.perpetualDate[0] = new Date(this.ruleForm.startValidTime);
// 字数控制
that.cateNameLength = strLength.getZhLen(that.ruleForm.strategyName);
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
formatData(item) {
item.integralGetStatus = String(item.integralGetStatus);
item.integralUseStatus = String(item.integralUseStatus);
item.integralGetStrategy = String(item.integralGetStrategy);
item.useCrowd = String(item.useCrowd);
item.integralGet = JSON.parse(item.integralGet);
// 获取规则需要除以 10
if (!!item.integralGet && !!item.integralGet.fee) {
item.integralGet.fee = Number(item.integralGet.fee / 10).toFixed(1);
}
if (!!item.integralGet && !!item.integralGet.integral) {
item.integralGet.integral = Number(item.integralGet.integral / 10).toFixed(1);
}
let channelType = [];
if (!!item.channelList.length) {
item.channelList[0] = item.channelList.splice(1, 1, item.channelList[0])[0]; // 第一个与第二个互换位置
item.channelList.forEach((ele, index) => {
ele.openStatus = ele.openStatus == 0 ? false : true;
ele.channelType = String(ele.channelType);
// ele.useCrowd = String(ele.useCrowd);
ele.channelRelationStoreType = String(ele.channelRelationStoreType);
ele.channelStoreType = String(ele.channelStoreType);
ele.channelRelationProType = String(ele.channelRelationProType);
ele.integralUseDiscountControl = String(ele.integralUseDiscountControl);
ele.integralUseDiscountControlUpper = String(ele.integralUseDiscountControlUpper);
ele.integralUseDiscountControlLower = String(ele.integralUseDiscountControlLower);
ele.useProportionalRestriction = String(ele.useProportionalRestriction);
if (!ele.enterpriseRelationIdArr || !ele.enterpriseRelationIdArr.length || ele.enterpriseRelationIdArr[0] == '[]') {
ele.enterpriseRelationIdArr = [];
}
if (!ele.storeRelationIdArr || !ele.storeRelationIdArr.length) {
ele.storeRelationIdArr = [];
}
if (!ele.strategyGoodsRelationIdArr || !ele.strategyGoodsRelationIdArr.length) {
ele.strategyGoodsRelationIdArr = [];
}
if (ele.channelType == 1) {
ele.goodsRelationIdArr = [];
ele.goodsRelationIdArr = ele.strategyGoodsRelationIdArr || []; // 复制商品字段
}
if (ele.channelType == 3) {
this.uuid = ele.storeControlId;
this.isAdd = false;
}
if (ele.channelType == 9) {
this.wmuuid = ele.storeControlId;
this.isAdd = false;
}
// 判断是否有微盟
channelType.push(ele.channelType);
});
if (channelType.indexOf('9') < 0) {
item.channelList.push({
integralStrategyChannelId: '', //id
enterpriseId: '',
integralStrategyId: '', //策略id
channelType: '9', //渠道类型 1微信 3:线下 5淘宝 6京东 7唯品会 8天猫
openStatus: true, //渠道配置是否启用 1启用 0停用
channelRelationEnterpriseType: '1', // 策略关联企业 1所有企业 2部分企业
channelRelationStoreType: '1', //策略关联门店类型 1所有门店 2门店分组 3部分门店
channelStoreType: '-1', // 策略选择门店类型 (-1:所有 0:自营 1:联营 2:加盟,3代销4托管)
channelRelationProType: '1', // 策略关联商品类型 1所有商品 2商品品牌 3商品类目 4部分商品
integralUseDiscountControl: '1', // 折扣控制 1所有折扣商品适用 2折扣范围
integralUseDiscountControlUpper: '0.0',
integralUseDiscountControlLower: '0.0',
useProportionalRestriction: '0.0', // 抵现比例限制
strategyGoodsRelationIdArr: [], // 商品
storeRelationIdArr: [], //门店
enterpriseRelationIdArr: [] //商户
});
}
}
// log(item.channelList[0])
return item;
},
// 获取商品品类
getGoodsCategory() {
let that = this;
let para = {
filterGoods: 1,
parentId: ''
};
postRequest('/api-mall/list_mall_goods_category', para)
.then(res => {
log(res, res.data, res.data.errorCode);
let resData = res.data;
let onelevelCategory = '';
if (resData.errorCode == 0) {
resData.result.forEach(function(ele, index) {
if (ele.parentId == '-1') {
ele.children = [];
ele.key = ele.mallCategoryId;
ele.id = ele.mallCategoryId;
ele.label = ele.name;
onelevelCategory = ele;
resData.result.splice(index, 1);
}
});
let list = resData.result;
list.forEach(function(ele, index) {
onelevelCategory.children.push(ele);
});
that.goodsTreeOptions = [];
that.goodsTreeOptions.push(onelevelCategory);
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
loadOptions({ action, parentNode, callback }) {
let that = this;
log(action, parentNode, callback);
if (action === 'LOAD_CHILDREN_OPTIONS') {
if (parentNode.id) {
that.getChildrenNode(parentNode, parentNode.id);
}
}
},
// 获取子节点方法
getChildrenNode(parentNode, parentId) {
let that = this;
let para = {
filterGoods: 1,
parentId: parentId,
requestProject: that.repProjectName
};
postRequest('/api-mall/list_mall_goods_category', para)
.then(res => {
log(res, res.data, res.data.errorCode);
let resData = res.data;
if (resData.errorCode == 0) {
resData.result.forEach(function(ele, index) {
if (ele.isLeaf == 0) {
ele.subOptions = null;
} else {
ele.subOptions = [];
}
ele.key = ele.mallCategoryId;
});
parentNode.subOptions = resData.result;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
// that.toLogin()
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 选择人群筛选器
showPeople() {
this.dialogVisiblePeople = true;
},
/* 人群筛选器 start */
getData() {
// 父组件调用子组件方法,触发父组件事件
this.$refs.peopleFilter.confirmSet();
},
findFilter(value) {
// 子组件触发父组件事件,返回过滤条件数据
// log(value);
this.ruleForm.crowdJson = value;
this.searchParams = value;
if (this.ruleForm.crowdJson) {
let arr = JSON.parse(this.ruleForm.crowdJson);
this.selectCount = 0;
if (arr.list) {
arr.list.forEach(item => {
this.selectCount += item.list.length;
});
}
}
},
cancelFilter() {
this.$refs.peopleFilter.cancelSet();
},
getBackData(val) {
log(val);
this.ruleForm.selectorParams = val;
},
// 隐藏保存按钮和确认按钮 (子组件会调用)
hideBtn() {
let that = this;
that.toggleTag = false;
},
// 显示编辑,保存按钮隐藏,确认按钮显示 (子组件会调用)
editShow() {
this.toggleTag = true;
},
editHide() {
this.toggleTag = false;
},
getPeopleData() {
// 筛选器 弹框的确认按钮
let that = this;
that.$refs.peopleFilter.confirmSet().then(res => {
if (!res) {
return;
} else {
setTimeout(_ => {
if (that.searchParams) {
that.lsSaveBtn(that.searchParams);
}
}, 500);
}
});
},
// 人群筛选器弹框的确定按钮 临时保存
lsSaveBtn(searchParams) {
postRequest('/api-admin/get-screen-detail-param', {
requestProject: this.repProjectName,
tempBusinessId: this.tempBusinessId ? this.tempBusinessId : '',
detailParams: searchParams
})
.then(res => {
if (res.data.errorCode == 0) {
this.tempBusinessId = res.data.result;
this.useId = res.data.result;
this.dialogVisiblePeople = false;
this.searchParams = '';
} else {
this.$message.error(res.data.message);
}
})
.catch(err => {
log(err);
});
},
/* end */
// 判断是否是太平鸟
getLoginInfo() {
let that = this;
let param = {};
postRequest('/api-auth/get-login-user-info', param)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (resData.result.enterpriseId == that.tpnEnterpriseId) {
that.tpnEditBool = true;
}
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
log(error);
});
}
},
components: {
topNavNew,
Treeselect,
addGoods
},
created() {
// this.selectReplayStyle()
},
mounted() {
let that = this;
log(that.$route.query.integralStrategyId);
// 获取策略 id
let id = that.$route.query.integralStrategyId;
that.ruleForm.integralStrategyId = id;
that.getInfo();
// 获取门店分组
that.getStoreGroup();
that.getLoginInfo();
}
};
</script>
<style lang="scss" scoped>
.attention-wrap {
padding: 24px 32px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.vue-treeselect {
display: inline-block;
vertical-align: top;
width: 300px;
}
.attention-content-wrap {
}
}
.form-wrap {
.el-input {
width: 178px;
padding: 0 10px;
&.w-300 {
width: 300px;
}
&.w-340 {
width: 340px;
}
}
/deep/ .input-label {
position: absolute;
left: 303px;
color: #ccc;
font-size: 12px;
}
.el-select {
vertical-align: top;
}
.span-txt {
position: absolute;
z-index: 2;
width: 300px;
text-align: center;
}
.padding-0 {
padding: 0;
}
.form-child {
padding: 15px 20px 10px 0px;
background: #f5f6f9;
margin: 22px 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.margin-20 {
margin-top: 20px;
}
.tinymce-wrap {
width: 780px;
}
}
/*树形*/
.vue-treeselect /deep/ {
/deep/ .vue-treeselect__control {
height: 30px;
/*line-height: 36px;*/
cursor: pointer;
}
.vue-treeselect__placeholder {
line-height: 30px;
font-size: 12px;
}
.vue-treeselect__multi-value-item-container,
.vue-treeselect__multi-value {
line-height: 1;
height: 0;
opacity: 0;
}
span.vue-treeselect__multi-value-label {
line-height: 1;
}
.vue-treeselect__multi-value-item {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #f0f2f5;
color: #909399;
}
.vue-treeselect__value-remove {
color: #909399;
}
&:not(.vue-treeselect--disabled) .vue-treeselect__multi-value-item:not(.vue-treeselect__multi-value-item-disabled):hover {
background-color: #f0f2f5;
color: #909399;
}
.vue-treeselect--searchable:not(.vue-treeselect--disabled) .vue-treeselect__value-container {
cursor: pointer;
}
.vue-treeselect__x-container {
display: none;
}
.vue-treeselect__control-arrow {
display: none;
}
.vue-treeselect__control-arrow-container {
position: relative;
}
/deep/ .vue-treeselect__value-container {
line-height: 30px;
}
/deep/.vue-treeselect__control-arrow-container:after,
.vue-treeselect__control-arrow-container:before {
border: 6px solid transparent;
border-left: 6px solid #fff;
width: 0;
height: 0;
position: absolute;
top: 49%;
left: 50%;
margin-left: -6px;
content: ' ';
margin-top: -3px;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
/deep/ .vue-treeselect__control-arrow-container:before {
border-left-color: #c0c4cc;
top: 52%;
}
&.vue-treeselect--focused .vue-treeselect__control-arrow-container:after,
&.vue-treeselect--focused .vue-treeselect__control-arrow-container:before {
margin-top: -6px;
-webkit-transform: rotateZ(-90deg);
-moz-transform: rotateZ(-90deg);
-o-transform: rotateZ(-90deg);
transform: rotateZ(-90deg);
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
&.vue-treeselect--focused .vue-treeselect__control-arrow-container:before {
border-left-color: #c0c4cc;
top: 47%;
}
.vue-treeselect--has-value .vue-treeselect__multi-value {
margin-bottom: 0;
}
}
/*人群筛选器*/
.select-people {
max-height: 500px;
overflow-y: auto;
overflow-x: hidden;
}
.select-people /deep/ .marginLeft134 {
margin-left: 80px;
}
.select-people /deep/ .filter-content .member-templates-condition-title {
text-align: left;
font-size: 14px;
line-height: 24px;
}
.select-people /deep/ .filter-content {
margin-top: 0;
}
.people-btn-wrap {
width: 100%;
background: #f2f3f4;
box-sizing: border-box;
padding: 0 0 24px 100px;
}
.select-people /deep/ .detail {
margin-top: 0;
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<!-- 开卡策略 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">开卡策略</h3>
<p class="open-card-descript">设置办理电子会员卡的基本规则</p>
</div>
<div class="cell-body">
<card-cate :cardCateInfo="cardCateInfo" :projectName="projectName"></card-cate>
</div>
</div>
<!-- 开卡基本信息配置 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">开卡基本信息配置</h3>
<p class="open-card-descript">设置办理电子会员卡的基本信息字段</p>
</div>
<div class="cell-body">
<el-form>
<el-form-item label="微信会员" prop="">
<el-button type="primary" @click="changeRoute('/memberInfoTemplate')">编辑模板</el-button>
</el-form-item>
</el-form>
<div class="phone-container">
<div class="phone-view">
<div class="phone-show-content">
<ul class="phone-list-bottom" id="showPhoneView">
<template v-for="(item, index) in memberTemp">
<li class="phone-list-item" v-show="item.systemFieldId == 'k103' && item.fieldContent.birthType" :key="index">
<div class="opend-card-item sex" style="height:71px">
<div class="item-title" style="line-height:70px">{{ item.fieldName }}</div>
<div style="float:left;">
<el-radio-group v-model="item.radio">
<el-radio :label="0">农历</el-radio>
<el-radio :label="1">阳历</el-radio>
</el-radio-group>
<p style="line-height: 30px;margin-top: -5px;">{{ item.fieldDescription }}</p>
</div>
</div>
</li>
<li class="phone-list-item" v-if="!(item.systemFieldId == -1 && item.fieldType == 5) && !(item.systemFieldId == 'k103' && item.fieldContent.birthType)" :key="index">
<template v-if="item.fieldType != 2">
<div class="opend-card-item" v-if="!(item.systemFieldId == -1 && item.fieldType == 5)">
<div :class="['item-title', item.fieldName.length > 6 ? 'item-title-prewrap' : '']">{{ item.fieldName }}</div>
<span>{{ item.fieldDescription }}</span>
</div>
</template>
<template v-if="item.fieldType == 2">
<div class="opend-card-item sex">
<div class="item-title">{{ item.fieldName }}</div>
<template v-for="(child, ind) in item.fieldContent">
<el-radio v-model="firstRadio" :label="ind" :key="ind">{{ child.name }}</el-radio>
</template>
</div>
</template>
</li>
<li v-if="item.systemFieldId == -1 && item.fieldType == 5" class="block" :key="index">
<template>
<div class="block-head">
<div class="opencard-item-title">{{ item.fieldName }}</div>
</div>
<div class="opend-card-item" v-for="(child, idx) in item.sonList" :key="idx">
<div :class="['item-title', child.fieldName.length > 6 ? 'item-title-prewrap' : '']">{{ child.fieldName }}</div>
<span>{{ child.fieldDescription }}</span>
</div>
</template>
</li>
</template>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 开卡门店配置 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">开卡门店配置</h3>
<p class="open-card-descript">设置会员的开卡门店规则</p>
</div>
<div class="cell-body">
<el-form :model="openCardForm" ref="openCardForm" label-width="130px" class="demo-ruleForm">
<el-form-item label="微信会员" prop="">
<el-radio v-model="openCardForm.wxOpenCardStoreSet" label="0" @change="changeRadio($event, 6)">首次关注门店</el-radio>
<el-radio v-model="openCardForm.wxOpenCardStoreSet" label="1" @change="changeRadio($event, 6)">开卡前最后关联门店</el-radio>
</el-form-item>
<el-form-item label="POS转微信会员" prop="">
<el-radio v-model="openCardForm.posOpenCardStoreSet" label="0" @change="changeRadio($event, 7)">ERP中的开卡门店</el-radio>
</el-form-item>
</el-form>
</div>
</div>
<!-- 第三方电商账号选择开关 -->
<!-- <div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">第三方电商账号选择开关</h3>
<p class="open-card-descript">设置会员开卡流程中选择第三方平台账号</p>
</div>
<div class="cell-body">
<el-form :model="thirdForm" ref="thirdForm" label-width="130px" class="demo-ruleForm">
<el-form-item label="开卡选择第三方电商账号" prop="">
<el-switch v-model="thirdForm.switch" @change="changeSwitch($event, 1)"> </el-switch>
</el-form-item>
</el-form>
</div>
</div> -->
<!-- 主门店配置 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">服务门店配置</h3>
<p class="open-card-descript">设置会员的服务门店规则</p>
</div>
<div class="cell-body">
<el-form :model="mainStoreForm" ref="mainStoreForm" label-width="130px" class="demo-ruleForm">
<el-form-item label="微信会员" prop="">
<el-radio v-model="mainStoreForm.wxMainStoreSet" label="0" @change="changeRadio($event, 8)">首次关注门店</el-radio>
<el-radio v-model="mainStoreForm.wxMainStoreSet" label="1" @change="changeRadio($event, 8)">开卡前最后关联门店</el-radio>
</el-form-item>
<el-form-item label="POS转微信会员" prop="">
<el-radio v-model="mainStoreForm.posMainStoreSet" label="0" @change="changeRadio($event, 9)">ERP中的开卡门店</el-radio>
</el-form-item>
<el-form-item label="开卡选择服务门店" prop="">
<el-switch v-model="mainStoreForm.openCardStoreEdit" @change="changeSwitch($event, 2)"> </el-switch>
</el-form-item>
<el-form-item label="开卡选择专属导购" prop="">
<el-switch v-model="mainStoreForm.openCardClerkEdit" @change="changeSwitch($event, 3)"> </el-switch>
</el-form-item>
<el-form-item label="服务门店变更逻辑" prop="">
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="name" label="对象" width="150"> </el-table-column>
<el-table-column prop="rules" label="变更服务门店规则"> </el-table-column>
<el-table-column prop="address" label="优先级" width="150">
<template>
<i class="el-icon-back" style="transform:rotate(-90deg)"></i>
</template>
</el-table-column>
<el-table-column prop="typeValue" label="是否开启" width="150">
<template slot-scope="scope">
<el-switch v-model="scope.row.typeValue" @change="changeServiceSwitch(scope.row.typeValue)"></el-switch>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
</div>
</div>
<!-- 归属修改权限 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">归属修改权限</h3>
<p class="open-card-descript">设置会员是否有权限对服务门店和专属导购进行修改</p>
</div>
<div class="cell-body">
<el-form :model="belongAuthForm" ref="belongAuthForm" label-width="130px" class="demo-ruleForm">
<el-form-item label="修改服务门店" prop="">
<el-switch v-model="belongAuthForm.storeEdit" @change="changeSwitch($event, 4)"> </el-switch>
</el-form-item>
<el-form-item label="修改次数限制" prop="" v-if="belongAuthForm.storeEdit == true">
<el-radio v-model="belongAuthForm.storeEditTimesType" label="1" @change="changeRadio($event, 11, 'store')">最多修改</el-radio>
<el-input v-model="belongAuthForm.storeEditTimes" @change="changeInput($event, 13, 'storeEditTimes')"></el-input><label></label>
<el-radio class="m-l-16" v-model="belongAuthForm.storeEditTimesType" label="2" @change="changeRadio($event, 11, 'store')">每月最多修改1次</el-radio>
<el-radio v-model="belongAuthForm.storeEditTimesType" label="3" @change="changeRadio($event, 11, 'store')">每年最多修改1次</el-radio>
</el-form-item>
<el-form-item label="修改专属导购" prop="">
<el-switch v-model="belongAuthForm.clerkEdit" @change="changeSwitch($event, 5)"><!-- active-text="启用" inactive-text="停用" --> </el-switch>
</el-form-item>
<el-form-item label="修改次数限制" prop="" v-if="belongAuthForm.clerkEdit == true">
<el-radio v-model="belongAuthForm.clerkEditTimesType" :disabled="belongAuthForm.storeEditTimesType == 2 || belongAuthForm.storeEditTimesType == 3 ? true : false" label="1" @change="changeRadio($event, 12)">最多修改</el-radio>
<el-input v-model="belongAuthForm.clerkEditTimes" @change="changeInput($event, 14, 'clerkEditTimes')"></el-input><label></label>
<el-radio class="m-l-16" v-model="belongAuthForm.clerkEditTimesType" label="2" @change="changeRadio($event, 12)">每月最多修改1次 </el-radio>
<el-radio v-model="belongAuthForm.clerkEditTimesType" :disabled="belongAuthForm.storeEditTimesType == 2 ? true : false" label="3" @change="changeRadio($event, 12)">每年最多修改1次</el-radio>
</el-form-item>
</el-form>
</div>
</div>
<!-- 商户会员等级 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">商户会员等级</h3>
<p class="open-card-descript">商户具体会员等级,请点击对应商户行的编辑按钮查看</p>
</div>
<div class="cell-body">
<el-table :data="merchantTableData" style="width: 100%">
<el-table-column prop="enterpriseName" label="商户名称"> </el-table-column>
<el-table-column prop="gradeCount" label="等级数量"> </el-table-column>
<el-table-column prop="" label="操作">
<template slot-scope="scope">
<!-- <el-button
@click="editMerchant(scope.$index,scope.row,merchantTableData)"
type="text"
size="small">
编辑
</el-button> -->
<router-link :to="{ path: '/memberGrade', query: { enterpriseId: scope.row.enterpriseId, name: scope.row.enterpriseName } }" class="edit-btn el-button--text">编辑</router-link>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 集团会员等级设置 -->
<div class="member-cell">
<div class="title-group">
<h3 class="open-card-title">集团会员等级设置</h3>
<p class="open-card-descript">设置集团卡会员等级制度</p>
</div>
<div class="cell-body">
<el-form :model="cliqueForm" ref="cliqueForm" label-width="130px" class="demo-ruleForm">
<el-form-item label="升级模式" prop="">
<el-radio disabled v-model="cliqueForm.gradeUpModel" label="0" @change="changeCliqueUp($event)">单商户独立计算</el-radio>
<el-radio disabled v-model="cliqueForm.gradeUpModel" label="1" @change="changeCliqueUp($event)">跨商户联合计算</el-radio>
</el-form-item>
<el-form-item label="关联升级" prop="" v-if="cliqueForm.gradeUpModel == 0">
<el-switch disabled v-model="cliqueForm.gradeUpModelSyncchange" @change="changeSwitch($event, 10)"> </el-switch>
</el-form-item>
</el-form>
<div class="add-level"><el-button type="primary" @click="changeRoute('/addGroupGrade')">新增等级</el-button></div>
<el-table :data="cliqueTableData" style="width: 100%">
<el-table-column prop="" label="卡面预览" width="260">
<template slot-scope="scope">
<div class="card-cell" :style="{ background: scope.row.cardColor }">
<img :src="logoImg" />
<span :style="{ color: scope.row.cardFontColor }">{{ scope.row.gradeName }}</span>
</div>
</template>
</el-table-column>
<el-table-column prop="gradeCode" label="等级编码"> </el-table-column>
<el-table-column prop="" label="等级类型">
<template slot-scope="scope">
{{ scope.row.gradeType == 1 ? '常规卡' : '特殊卡' }}
</template>
</el-table-column>
<el-table-column prop="" label="移动">
<template slot-scope="scope">
<!-- <div class="move-icon">
<i :class="['iconfont','sort-icon-all', 'icon-yd-icon-upload2', scope.$index==0? 'disable': '']" @click="toPre(scope.$index,scope.row,cliqueTableData)"></i>
<i :class="['sort-icon-all', 'sort-icon-down','iconfont','icon-yd-icon-upload2', scope.$index == cliqueTableData.length-1?'disable':'']" class="icon-font-down" @click="toNext(scope.$index,scope.row,cliqueTableData)"></i>
<i :class="['sort-icon-all', 'el-icon-upload2', 'sort-icon', scope.$index==0? 'disable':'']" @click="toUp(scope.$index,scope.row,cliqueTableData)"></i>
<i :class="['sort-icon-all', 'el-icon-download','sort-icon', scope.$index == cliqueTableData.length-1?'disable':'']" @click="toBottom(scope.$index,scope.row,cliqueTableData)"></i>
</div> -->
<i :class="['icon-color', 'el-icon-upload2', scope.$index == 0 ? 'disable' : '']" @click="toUp(scope.$index, scope.row, cliqueTableData)"></i>
<i :class="['icon-color', 'el-icon-back', 'icon-to-pre', scope.$index == 0 ? 'disable' : '']" @click="toPre(scope.$index, scope.row, cliqueTableData)"></i>
<i :class="['icon-color', 'el-icon-back', 'icon-to-next', scope.$index == cliqueTableData.length - 1 ? 'disable' : '']" @click="toNext(scope.$index, scope.row, cliqueTableData)"></i>
<i :class="['icon-color', 'el-icon-download', scope.$index == cliqueTableData.length - 1 ? 'disable' : '']" @click="toBottom(scope.$index, scope.row, cliqueTableData)"></i>
</template>
</el-table-column>
<el-table-column prop="" label="操作">
<template slot-scope="scope">
<!-- <el-button
@click="editCliqueLevel(scope.$index,scope.row,cliqueTableData)"
type="text"
size="small">
编辑
</el-button> -->
<router-link :to="{ path: '/editGroupGrade', query: { gradeId: scope.row.gradeId } }" class="edit-btn el-button--text">编辑</router-link>
<!-- <el-button class="m-l-10"
@click="delCliqueLevel(scope.$index,scope.row,cliqueTableData)"
type="text">
删除
</el-button> -->
<el-popover placement="top" width="160" v-model="scope.row.popVisible">
<p style="line-height: 1.5; padding: 10px 10px 20px;">确认删除吗?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="cancelPop(scope.$index, scope.row, cliqueTableData)">取消</el-button>
<el-button type="primary" size="mini" @click="delCliqueLevel(scope.$index, scope.row, cliqueTableData)">确定</el-button>
</div>
<el-button slot="reference" class="m-l-10" type="text">
删除
</el-button>
</el-popover>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- end -->
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import topNavNew from 'components/nav/navNew';
import cardCate from 'components/memberShip/card-cate'; // 开卡策略
import { getRequest, postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'memberCardSet',
data() {
return {
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '会员卡设置',
path: ''
}
],
projectName: 'gic-clique', //当前项目名
firstRadio: 0,
// 信息对象
cardCateInfo: {},
// 会员模板
memberTemp: [],
// 开卡门店配置
openCardForm: {
wxOpenCardStoreSet: '0',
posOpenCardStoreSet: '0'
},
// 第三方
thirdForm: {
switch: true
},
// 主门店
mainStoreForm: {
wxMainStoreSet: '0',
posMainStoreSet: '0',
openCardStoreEdit: true,
openCardClerkEdit: true
},
// 归属修改权限
belongAuthForm: {
storeEdit: true,
storeEditTimesType: '1',
storeEditTimes: '',
clerkEdit: true,
clerkEditTimesType: '1',
clerkEditTimes: ''
},
// 商户会员等级
merchantTableData: [],
// 集团会员等级
cliqueForm: {
gradeUpModelSyncchange: false, // 单商户独立计算下是否关联升级 1是 0否 (集团)
gradeUpModel: '0' // 等级升级模式 0单商户独立计算 1跨商户联合计算 (集团参数)
},
cliqueTableData: [],
logoImg: '', //企业logo
popVisible: false, //表格中删除
// 服务门店变更
tableData: [
{
name: '所有认证会员',
rules: '会员历史消费次数为0时,取在GIC系统上线后的首次消费门店为服务门店',
typeValue: false
}
]
};
},
created() {
// this.selectReplayStyle()
},
methods: {
// 服务门店变更逻辑
changeServiceSwitch(val) {
let typeValue = val ? 1 : 0;
let para = {
type: 16,
typeValue: typeValue
};
postRequest('/api-admin/modify-member-card-setting-flag', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('设置成功', 'success');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 路由跳转
changeRoute(route) {
this.$router.push(route);
},
// 开卡门店配置 等 radio change
changeRadio(e, tag, flag) {
let that = this;
that.saveSet(tag, e);
// 判断归属门店修改次数
if (!!flag && flag == 'store') {
if (e == 2) {
that.belongAuthForm.clerkEditTimesType = '2';
that.saveSet('12', 2);
}
if (e == 3) {
that.belongAuthForm.clerkEditTimesType = '3';
that.saveSet('12', 3);
}
}
},
saveSet(type, value) {
let that = this;
let para = {
type: type,
typeValue: value
};
postRequest('/api-admin/modify-member-card-setting-flag', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('设置成功', 'success');
if (type == 2 && value == '0') {
that.mainStoreForm.openCardClerkEdit = false;
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 第三方等 switch change
changeSwitch(e, num) {
let that = this;
// 开卡
if (num == 2 && !e) {
that.saveSet(2, 0);
that.saveSet(3, 0);
return;
}
if (num == 3 && e && !that.mainStoreForm.openCardStoreEdit) {
showMsg.showmsg('开卡选择服务门店停用时不允许修改', 'warning');
that.mainStoreForm.openCardClerkEdit = false;
return;
}
// 修改服务门店
if (num == 4 && e && !that.belongAuthForm.clerkEdit) {
showMsg.showmsg('修改专属导购停用时不允许修改', 'warning');
that.belongAuthForm.storeEdit = false;
return;
}
if (num == 4 && !e) {
that.belongAuthForm.storeEditTimesType = '1';
that.changeRadio(1, 11);
}
// 修改专属导购
if (num == 5 && !e) {
that.saveSet(num, 0);
that.belongAuthForm.storeEdit = false;
that.saveSet(4, 0);
return;
}
let v = e == true ? 1 : 0;
that.saveSet(num, v);
},
// input
changeInput(e, num, tag) {
let that = this;
e = !!parseInt(String(e).replace(/[^\d]/g, '')) ? parseInt(String(e).replace(/[^\d]/g, '')) : '0';
that.belongAuthForm.storeEditTimes = !!parseInt(String(that.belongAuthForm.storeEditTimes).replace(/[^\d]/g, '')) ? parseInt(String(that.belongAuthForm.storeEditTimes).replace(/[^\d]/g, '')) : 0;
that.belongAuthForm.clerkEditTimes = !!parseInt(String(that.belongAuthForm.clerkEditTimes).replace(/[^\d]/g, '')) ? parseInt(String(that.belongAuthForm.clerkEditTimes).replace(/[^\d]/g, '')) : 0;
if (that.belongAuthForm.storeEditTimes > that.belongAuthForm.clerkEditTimes) {
that.$message.error({
duration: 1000,
message: '修改服务门店次数必须小于修改专属导购次数'
});
return;
}
that.saveSet(num, e);
},
// 商户会员等级列表编辑
editMerchant(index, row, obj) {
let that = this;
that.changeRoute('/memberGrade');
},
// 编辑集团
editCliqueLevel(index, row, obj) {
let that = this;
that.changeRoute('/editGroupGrade');
},
// 取消删除
cancelPop(index, row, obj) {
row.popVisible = false;
},
// 删除
delCliqueLevel(index, row, obj) {
let para = {
gradeId: row.gradeId,
enterpriseId: ''
};
postRequest('/api-admin/delete-member-grade', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('删除成功', 'success');
obj.splice(index, 1);
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 修改集团升级模式
changeCliqueUp(e) {
let para = {
gradeUpModel: e
};
postRequest('/api-admin/modify-clique-grade-up-model', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('设置成功', 'success');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 置顶 先删除后追加首部
toUp(index, row, obj) {
let that = this;
if (index == 0) {
return;
}
let newTable = JSON.parse(JSON.stringify(that.cliqueTableData));
newTable.splice(index, 1);
newTable.unshift(row);
// 保存设置
that.setSort(row.gradeId, 10);
that.cliqueTableData = newTable;
},
// 向上
toPre(index, row, obj) {
let that = this;
if (index == 0) {
return;
}
let newTable = JSON.parse(JSON.stringify(that.cliqueTableData));
let temp = {};
temp = newTable[index - 1];
newTable[index - 1] = row;
newTable[index] = temp;
// 保存设置
that.setSort(row.gradeId, 20);
that.cliqueTableData = newTable;
},
// 向下
toNext(index, row, obj) {
let that = this;
if (index == obj.length - 1) {
return;
}
let newTable = JSON.parse(JSON.stringify(that.cliqueTableData));
let temp = {};
temp = newTable[index + 1];
newTable[index + 1] = row;
newTable[index] = temp;
// 保存设置
that.setSort(row.gradeId, 30);
that.cliqueTableData = newTable;
},
//置底 先删除后追加尾部
toBottom(index, row, obj) {
let that = this;
if (index == obj.length - 1) {
return;
}
let newTable = JSON.parse(JSON.stringify(that.cliqueTableData));
newTable.splice(index, 1);
newTable.push(row);
// 保存设置
that.setSort(row.gradeId, 40);
that.cliqueTableData = newTable;
},
// 等级排序
setSort(gradeId, type, enterpriseId) {
let para = {
gradeId: gradeId,
sortType: type
// enterpriseId: enterpriseId
};
postRequest('/api-admin/sort-member-grade', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('设置成功', 'success');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 获取会员卡设置信息
getMemberSetInfo() {
let that = this;
getRequest('/api-admin/get-enterprise-grade-info', {})
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
// 设置开卡策略信息
let member = resData.result.memberSystem;
if (!!member && !!Object.keys(member).length) {
that.setCateInfo(member);
that.cardCateInfo = that.setCateInfo(member);
// 开卡门店配置
that.openCardForm.wxOpenCardStoreSet = String(member.wxOpenCardStoreSet);
that.openCardForm.posOpenCardStoreSet = String(member.posOpenCardStoreSet);
// 第三方
that.thirdForm.switch = member.ecommerceRelationFlag == 1 ? true : false;
// 主门店
that.mainStoreForm.wxMainStoreSet = String(member.wxMainStoreSet);
that.mainStoreForm.posMainStoreSet = String(member.posMainStoreSet);
that.mainStoreForm.openCardStoreEdit = member.openCardStoreEdit == 1 ? true : false;
that.mainStoreForm.openCardClerkEdit = member.openCardClerkEdit == 1 ? true : false;
// 服务门店变更逻辑
that.tableData[0].typeValue = member.storeChangeLogic == 1 ? true : false;
//归属修改权限
that.belongAuthForm.storeEdit = member.storeEdit == 1 ? true : false;
that.belongAuthForm.clerkEdit = member.clerkEdit == 1 ? true : false;
that.belongAuthForm.storeEditTimesType = String(member.storeEditTimesType); //1自定义次数 2 每月修改1次 3每年修改1次
that.belongAuthForm.storeEditTimes = member.storeEditTimes; //自定义次数
that.belongAuthForm.clerkEditTimesType = String(member.clerkEditTimesType); //1自定义次数 2 每月修改1次 3每年修改1次
that.belongAuthForm.clerkEditTimes = member.clerkEditTimes; //自定义次数
// 集团会员卡设置
that.cliqueForm.gradeUpModel = String(member.gradeUpModel);
that.cliqueForm.gradeUpModelSyncchange = member.gradeUpModelSyncchange == 1 ? true : false;
}
// 商户会员等级
if (!!resData.result.CountList && !!resData.result.CountList.length) {
that.merchantTableData = resData.result.CountList;
}
// 卡面
that.logoImg = resData.result.logoImg;
if (!!resData.result.List && !!resData.result.List.length) {
resData.result.List.forEach(function(ele, index) {
ele.popVisible = false;
});
that.cliqueTableData = resData.result.List;
}
return;
}
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
log(error);
});
},
// 设置开卡策略
setCateInfo(item) {
item.cardCreateType = String(item.cardCreateType);
item.cardNoStatus = String(item.cardNoStatus);
item.cardNoTimeType = !!item.cardNoTimeType ? String(item.cardNoTimeType) : '0';
item.cardBegin = !!item.cardBegin && item.cardBegin != 'null' ? String(item.cardBegin) : '';
item.prefixKey = String(item.prefixKey);
item.suffixKey = String(item.suffixKey);
item.sex = !!item.sex ? item.sex : 0;
item.usePrefix = item.usePrefix == 1 ? true : false;
item.useSuffix = item.useSuffix == 1 ? true : false;
// item.gradeDescribe = item.gradeDescribe;
// item.memberSystemId = item.memberSystemId;
return item;
},
// // 获取模板信息
getTempInfo() {
let that = this;
let para = {};
postRequest('/api-admin/get-card-field-template-detail', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result;
data.forEach(function(ele, index) {
if (ele.fieldType == 2) {
ele.fieldContent = JSON.parse(ele.fieldContent.replace(/'/g, '"'));
}
// 生日 农历
if (ele.systemFieldId == 'k103') {
ele.radio = '';
ele.fieldContent = JSON.parse(ele.fieldContent);
ele.fieldContent.birthType = ele.fieldContent.birthType == 0 ? true : false;
}
});
that.memberTemp = data;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
}
},
components: {
topNavNew,
cardCate
},
mounted() {
let that = this;
that.getMemberSetInfo();
that.getTempInfo();
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
/* 模板 */
.phone-container {
margin-top: 40px;
}
.phone-view {
background: url(../../../assets/iphone.png) no-repeat;
background-size: 100%;
width: 410px;
height: 740px;
margin: 0 20px;
position: relative;
}
.phone-show-content {
width: 330px;
height: 537px;
position: absolute;
left: 41px;
top: 83px;
overflow-y: auto;
}
.block {
margin-bottom: 2px;
}
.block-head {
width: 100%;
background: #f5f5f8;
padding: 0;
height: 46px;
.opencard-item-title {
line-height: 46px;
padding-left: 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
.opend-card-item {
height: 46px;
line-height: 46px;
background: #fff;
border-bottom: 1px solid #e7e7eb;
font-size: 14px;
position: relative;
&.sex::after {
content: '';
width: 100%;
height: 100%;
z-index: 2;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}
.opend-card-group-title {
height: 40px;
line-height: 40px;
padding-left: 10px;
}
.opend-card-item {
height: 46px;
line-height: 46px;
background: #fff;
border-bottom: 1px solid #e7e7eb;
}
.phone-list-item {
// height: 44px;
// line-height: 44px;
background: #fff;
margin-bottom: 5px;
overflow: hidden;
}
.item-title {
width: 100px;
float: left;
padding-left: 10px;
overflow: hidden;
white-space: nowrap;
&.item-title-prewrap {
line-height: 15px;
word-break: break-all;
white-space: pre-wrap;
padding-top: 9px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
.move-icon i {
cursor: pointer;
}
.el-icon-upload2 {
font-size: 22px;
cursor: pointer;
}
.el-icon-download {
font-size: 22px;
cursor: pointer;
}
.icon-font-down {
display: inline-block;
transform: rotateX(180deg);
}
i.icon-color {
color: #606266;
}
i.disable {
color: #e6e6e6;
cursor: not-allowed;
}
.cell-body {
padding: 24px 32px;
margin-bottom: 18px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
/deep/ .el-form {
.el-form-item:nth-child(1) {
/*margin-top: 30px;*/
}
.el-form-item:last-child {
/*margin-bottom: 0;*/
}
}
}
.add-level {
width: 100%;
margin: 15px 0 22px 0;
text-align: right;
}
.card-cell {
display: flex;
width: 250px;
padding: 10px;
border-radius: 2px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
img {
width: 40px;
height: 40px;
border-radius: 50%;
display: inline-block;
vertical-align: middle;
}
span {
display: inline-block;
vertical-align: middle;
height: 40px;
line-height: 40px;
font-size: 14px;
margin-left: 5px;
}
}
.el-input {
width: 60px;
margin: 0 10px;
}
.el-form-item {
/deep/.el-form-item__label {
line-height: 1;
padding-top: 9px;
}
}
.member-cell {
background: #fff;
padding: 0;
}
.title-group {
position: relative;
border-bottom: 1px solid #e7e7eb;
padding: 20px 0 15px 32px;
}
.open-card-title {
font-size: 16px;
font-weight: 500;
/*padding:5px 0;*/
}
.open-card-descript {
font-size: 13px;
color: #828282;
padding: 5px 0;
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<div class="title">
<div>会员等级根据从低到高的顺序,自上而下进行排序</div>
<div class="add-btn"><el-button type="primary" @click="addGrade">新增等级</el-button></div>
</div>
<div class="table-wrap">
<el-table :data="memberTableData" style="width: 100%">
<el-table-column prop="gradeName" label="会员等级名称"> </el-table-column>
<el-table-column prop="gradeCode" label="等级编码"> </el-table-column>
<el-table-column prop="" label="等级类型">
<template slot-scope="scope">
{{ scope.row.gradeType == 1 ? '常规卡' : '特殊卡' }}
</template>
</el-table-column>
<el-table-column prop="" label="移动">
<template slot-scope="scope">
<i :class="['icon-color', 'el-icon-upload2', scope.$index == 0 ? 'disable' : '']" @click="toUp(scope.$index, scope.row, memberTableData)"></i>
<i :class="['icon-color', 'el-icon-back', 'icon-to-pre', scope.$index == 0 ? 'disable' : '']" @click="toPre(scope.$index, scope.row, memberTableData)"></i>
<i :class="['icon-color', 'el-icon-back', 'icon-to-next', scope.$index == memberTableData.length - 1 ? 'disable' : '']" @click="toNext(scope.$index, scope.row, memberTableData)"></i>
<i :class="['icon-color', 'el-icon-download', scope.$index == memberTableData.length - 1 ? 'disable' : '']" @click="toBottom(scope.$index, scope.row, memberTableData)"></i>
</template>
</el-table-column>
<el-table-column prop="" label="操作">
<template slot-scope="scope">
<el-button @click="editGrade(scope.$index, scope.row, memberTableData)" type="text" size="small">
编辑
</el-button>
<el-popover placement="top" width="160" v-model="scope.row.popVisible">
<p style="line-height: 1.5; padding: 10px 10px 20px;">确认删除吗?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="cancelPop(scope.$index, scope.row, memberTableData)">取消</el-button>
<el-button type="primary" size="mini" @click="delGrade(scope.$index, scope.row, memberTableData)">确定</el-button>
</div>
<el-button slot="reference" class="m-l-10" type="text">
删除
</el-button>
</el-popover>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { getRequest, postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'memberGrade',
data() {
return {
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '会员卡设置',
path: '/memberCardSet'
},
{
name: '编辑商户会员等级',
path: ''
}
],
// 商户id
cliqueId: '',
cliqueName: '', //商户 name
memberTableData: []
};
},
mounted() {
let that = this;
that.cliqueId = that.$route.query.enterpriseId;
that.cliqueName = that.$route.query.name;
that.navpath[3].name = '编辑【' + that.cliqueName + '】会员等级';
that.getList();
sessionStorage.removeItem('enterpriseId');
},
methods: {
//获取列表
getList() {
let that = this;
let para = {
enterpriseId: that.cliqueId
};
postRequest('/api-admin/get-enterprise-member-grade-list', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (!!resData.result.List && !!resData.result.List.length) {
resData.result.List.forEach(function(ele, index) {
ele.popVisible = false;
});
that.memberTableData = resData.result.List;
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {});
},
// 置顶 先删除后追加首部
toUp(index, row, obj) {
let that = this;
if (index == 0) {
return;
}
log(index, row, obj);
let newTable = JSON.parse(JSON.stringify(that.memberTableData));
newTable.splice(index, 1);
newTable.unshift(row);
log(newTable);
// 保存设置
that.setSort(row.gradeId, 10, that.cliqueId);
that.memberTableData = newTable;
},
// 向上
toPre(index, row, obj) {
let that = this;
if (index == 0) {
return;
}
log(index, row, obj);
let newTable = JSON.parse(JSON.stringify(that.memberTableData));
let temp = {};
temp = newTable[index - 1];
newTable[index - 1] = row;
newTable[index] = temp;
// 保存设置
that.setSort(row.gradeId, 20, that.cliqueId);
that.memberTableData = newTable;
},
// 向下
toNext(index, row, obj) {
let that = this;
if (index == obj.length - 1) {
return;
}
log(index, row, obj);
let newTable = JSON.parse(JSON.stringify(that.memberTableData));
let temp = {};
temp = newTable[index + 1];
newTable[index + 1] = row;
newTable[index] = temp;
// 保存设置
that.setSort(row.gradeId, 30, that.cliqueId);
that.memberTableData = newTable;
},
//置底 先删除后追加尾部
toBottom(index, row, obj) {
let that = this;
if (index == obj.length - 1) {
return;
}
log(index, row, obj);
let newTable = JSON.parse(JSON.stringify(that.memberTableData));
newTable.splice(index, 1);
newTable.push(row);
// 保存设置
that.setSort(row.gradeId, 40, that.cliqueId);
that.memberTableData = newTable;
},
// 等级排序
setSort(gradeId, type, enterpriseId) {
let that = this;
let para = {
gradeId: gradeId,
sortType: type,
enterpriseId: enterpriseId
};
postRequest('/api-admin/sort-member-grade', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('设置成功', 'success');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 编辑
editGrade(index, row, obj) {
this.$router.push({
path: '/editMemberGrade',
query: {
gradeId: row.gradeId,
enterpriseId: this.cliqueId,
name: this.cliqueName
}
});
},
// 新增等级
addGrade() {
this.$router.push({
path: '/addMemberGrade',
query: {
enterpriseId: this.cliqueId,
name: this.cliqueName
}
});
},
// 取消删除
cancelPop(index, row, obj) {
row.popVisible = false;
},
// 删除
delGrade(index, row, obj) {
let para = {
gradeId: row.gradeId,
enterpriseId: ''
};
getRequest('/api-admin/delete-member-grade', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('删除成功', 'success');
obj.splice(index, 1);
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {});
},
// 路由跳转
changeRoute(route) {
this.$router.push(route);
}
},
components: {
topNavNew
},
beforeRouteLeave(to, from, next) {
let that = this;
let d = to;
if (d.path == '/editMemberGrade' || d.path == '/addMemberGrade') {
sessionStorage.setItem('enterpriseId', that.cliqueId);
}
next();
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
padding: 24px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.title {
padding: 0 0 22px 0;
display: -webkit-flex;
display: flex;
align-items: center;
color: #828282;
.add-btn {
text-align: right;
}
div {
-webkit-flex: 1;
-moz-flex: 1;
-ms-flex: 1;
-o-flex: 1;
flex: 1;
font-size: 13px;
}
}
.el-icon-upload2 {
font-size: 22px;
cursor: pointer;
}
.el-icon-download {
font-size: 22px;
cursor: pointer;
}
i.icon-color {
color: #606266;
}
i.disable {
color: #e6e6e6;
cursor: not-allowed;
}
}
</style>
<template>
<!-- eslint-disable -->
<div class="template-wrap" :style="{ height: bodyHeight }">
<div class="template-contain">
<!-- 头部标题 -->
<div class="template-head">
<div class="template-title flex-1">
<img src="static/img/card-mould-logo.png" alt="logo" />
<span class="template-title-span">开卡字段配置模板</span>
</div>
<div class="template-btns flex-1 flex-r">
<el-button plain @click="changeRoute('/memberCardSet')">返 回</el-button>
<el-button type="primary" @click="saveAndBack">保存并启用</el-button>
</div>
</div>
<!-- 模板body -->
<div class="template-body">
<!-- 左侧 -->
<div class="template-cell template-cell-l">
<!-- tab 切换 -->
<el-tabs v-model="activeName">
<el-tab-pane label="系统字段" name="first">
<div class="filed-item-title">基本信息</div>
<ul>
<draggable id="list1" @clone="baseInfoClone" :list="baseInfo" class="compenent" :options="leftOption" :move="onMove" @start="isDragging = true" @end="itemMoveEnd"
><!-- @end="itemMoveEnd" -->
<li :class="['compenent-item', item.fixed == true ? 'fixed-item' : '']" :data-type="item.systemFieldId" v-for="(item, index) in baseInfo" @click="clickItem(item)" aria-hidden="true" :key="index">
<span v-if="item.systemFieldId == 'k101'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k102'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k103'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k104'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k105'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k106'">{{ item.fieldName }}</span>
</li>
</draggable>
</ul>
<div class="filed-item-title">家庭信息</div>
<ul>
<draggable id="list2" :list="familyInfo" class="compenent" :options="leftOption" :move="onMove" @start="isDragging = true" @end="itemMoveEnd">
<li :class="['compenent-item', item.fixed == true ? 'fixed-item' : '']" :data-type="item.systemFieldId" v-for="(item, index) in familyInfo" :key="index">
<span v-if="item.systemFieldId == 'k201'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k202'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k203'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k204'">{{ item.fieldName }}</span>
</li>
</draggable>
</ul>
<div class="filed-item-title">资产信息</div>
<ul>
<draggable id="list3" :list="assetInfo" class="compenent" :options="leftOption" :move="onMove" @start="isDragging = true" @end="itemMoveEnd">
<li :class="['compenent-item', item.fixed == true ? 'fixed-item' : '']" :data-type="item.systemFieldId" v-for="(item, idx) in assetInfo" :key="idx">
<span v-if="item.systemFieldId == 'k301'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k302'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k303'">{{ item.fieldName }}</span>
</li>
</draggable>
</ul>
<div class="filed-item-title">其他信息</div>
<ul>
<draggable id="list4" :list="otherInfo" class="compenent" :options="leftOption" :move="onMove" @start="isDragging = true" @end="itemMoveEnd">
<li :class="['compenent-item', item.fixed == true ? 'fixed-item' : '']" :data-type="item.systemFieldId" v-for="(item, index) in otherInfo" :key="index">
<span v-if="item.systemFieldId == 'k401'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k402'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k403'">{{ item.fieldName }}</span>
<span v-if="item.systemFieldId == 'k404'">{{ item.fieldName }}</span>
</li>
</draggable>
</ul>
</el-tab-pane>
<el-tab-pane label="自定义字段" name="second">
<div class="filed-item-title"><!-- 其他信息 --></div>
<ul>
<draggable id="list5" :list="defineInfo" class="compenent" :options="leftDefineOption" :move="onChildMove" @start="isDragging = true" @end="itemMoveEnd" @clone="cloneDefine">
<li :class="['compenent-item', item.fixed == true ? 'fixed-item' : '', item.fieldType == 5 ? 'block-class' : '']" :data-type="item.systemFieldId" v-for="(item, index) in defineInfo" :key="index">
<span v-if="item.systemFieldId == '-1' && item.fieldType == 3">{{ item.fieldNameCopy }}</span>
<span v-if="item.systemFieldId == '-1' && item.fieldType == 1">{{ item.fieldNameCopy }}</span>
<span v-if="item.systemFieldId == '-1' && item.fieldType == 4">{{ item.fieldNameCopy }}</span>
<span v-if="item.systemFieldId == '-1' && item.fieldType == 0">{{ item.fieldNameCopy }}</span>
<span v-if="item.systemFieldId == '-1' && item.fieldType == 5">{{ item.fieldNameCopy }}</span>
<i v-if="item.systemFieldId == '-1' && item.fieldType == 3" class="bg-icon bg-icon-one"></i>
<i v-if="item.systemFieldId == '-1' && item.fieldType == 1" class="bg-icon bg-icon-two"></i>
<i v-if="item.systemFieldId == '-1' && item.fieldType == 4" class="bg-icon bg-icon-three"></i>
<i v-if="item.systemFieldId == '-1' && item.fieldType == 0" class="bg-icon bg-icon-four"></i>
<i v-if="item.systemFieldId == '-1' && item.fieldType == 5" class="bg-icon bg-icon-five"></i>
</li>
</draggable>
</ul>
</el-tab-pane>
</el-tabs>
</div>
<!-- 中间 -->
<div class="template-cell template-cell-m">
<div class="phone-view">
<div class="phone-show-content">
<!-- 拖拽展示区域 -->
<div class="drag-show-content">
<div class="view-container">
<ul class="view-content" id="showPhoneView">
<template v-if="tempaletDataList.length == 0">
<img class="templet-null-img" src="../../../assets/templet_null_img.png" />
</template>
<draggable :options="{ group: { name: 'people', pull: false, put: true }, sort: true }" v-model="tempaletDataList" class="drag-wrap" @add="addItem">
<li :class="['filed-item', currentIndex == index ? 'active-item' : '', item.systemFieldId == -1 && item.fieldType == 5 ? 'li-block' : '']" v-for="(item, index) in tempaletDataList" @click="selectItem(item.systemFieldId, index)" :key="index">
<!-- 删除 -->
<span class="item-close" @click.stop="deleteItem(item.systemFieldId, index)"><i class="el-icon-close"></i></span>
<!-- item -->
<div v-if="item.systemFieldId == 'k103' && item.fieldContent.birthType">
<div class="no-change-birth" :class="['opencard-item-title', item.fieldName.length > 6 ? 'title-pre-wrap' : '']" style="height:67px;line-height:67px;">{{ item.fieldName }}</div>
<div class="draged-item-show">
<el-radio-group v-model="item.radio" style="margin-top:10px">
<el-radio disabled :label="0">农历</el-radio>
<el-radio disabled :label="1">阳历</el-radio>
</el-radio-group>
<span class="show-warm-text show-warm-text-flag" style="height:40px;line-height:40px;">{{ item.fieldDescription }}</span>
</div>
</div>
<div v-if="!(item.systemFieldId == -1 && item.fieldType == 5) && !(item.systemFieldId == 'k103' && item.fieldContent.birthType)">
<div :class="['opencard-item-title', item.fieldName.length > 6 ? 'title-pre-wrap' : '']">{{ item.fieldName }}</div>
<div class="draged-item-show">
<span class="show-warm-text show-warm-text-flag">{{ item.fieldDescription }}</span>
</div>
</div>
<template v-if="item.systemFieldId == -1 && item.fieldType == 5">
<div class="block">
<div class="block-head">
<div :class="['opencard-item-title', item.fieldName.length > 6 ? 'block-pre-wrap' : '']">{{ item.fieldName }}</div>
</div>
<ul class="view-content">
<draggable :options="{ group: { name: 'people', pull: false, put: true }, sort: true }" v-model="item.sonList" class="drag-wrap block-wrap" @add="addDragItem">
<li :class="['filed-item', currentChildIndex == ind ? 'active-item' : '']" v-for="(childItem, ind) in item.sonList" @click.stop="selectChildItem(childItem.systemFieldId, index, ind, item.sonList)" :key="ind">
<!-- 删除 -->
<span class="item-close" @click.stop="deleteChildItem(childItem.systemFieldId, index, ind, item.sonList)"><i class="el-icon-close"></i></span>
<!-- item -->
<div>
<div :class="['opencard-item-title', childItem.fieldName.length > 6 ? 'title-pre-wrap' : '']">{{ childItem.fieldName }}</div>
<div class="draged-item-show">
<span class="show-warm-text show-warm-text-flag">{{ childItem.fieldDescription }}</span>
</div>
</div>
</li>
</draggable>
</ul>
</div>
</template>
</li>
</draggable>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 右侧 -->
<div class="template-cell template-cell-r">
<el-tabs v-model="rightName">
<el-tab-pane label="控件设置" name="first">
<div id="edit-box">
<div class="edit-view baby-info-flag baby-info">
<template v-for="(item, index) in tempaletDataList">
<!-- 公共 -->
<template v-if="currentIndex == index && item.isMult != 1 && item.systemFieldId != -1">
<div class="edit-item " :key="index">
<div class="edit-item-title edit-title-padding">标题</div>
<add-input :inputValue="item.fieldName" :disFlag="1" :maxLength="10" @itemInput="itemInput"></add-input>
</div>
<!-- <div class="edit-item ">
<div class="edit-item-title">提示文字最多15个字</div>
<add-input :inputValue="item.fieldDescription" :disFlag="0" :maxLength="15" @itemInput="itemInput"></add-input>
</div> -->
</template>
<!-- 自定义中 根据 item.systemFieldId == -1 判断是否可编辑-->
<template v-if="currentIndex == index && item.systemFieldId == -1 && !currentChildIndex">
<div class="edit-item " :key="index">
<div class="edit-item-title">标题</div>
<add-input :inputValue="item.fieldName" :titleName="'title'" :disFlag="0" :maxLength="10" @itemInput="itemInput"></add-input>
</div>
</template>
<template v-if="currentIndex == index && item.fieldType != 5">
<div class="edit-item" :key="index">
<div class="edit-item-title">提示文字</div>
<!-- <el-input class="w-340" v-model="item.placeHolder" placeholder=""></el-input> -->
<add-input :inputValue="item.fieldDescription" :disFlag="0" :maxLength="15" @itemInput="itemInput"></add-input>
</div>
</template>
<!-- 组块内部 -->
<template v-if="childIndex == index && !!item.sonList && !!item.sonList.length && item.systemFieldId == -1">
<template v-for="(child, ind) in item.sonList">
<!-- 标题 -->
<template v-if="currentChildIndex == ind && (child.fieldType == '3' || child.fieldType == '1' || child.fieldType == '0' || child.fieldType == '4')">
<div class="edit-item test-title" :key="ind">
<div class="edit-item-title">标题</div>
<add-input :inputValue="child.fieldName" :titleName="'title'" :child="'child'" :disFlag="0" :maxLength="10" @itemInput="itemInput"></add-input>
</div>
</template>
<!-- 提示 -->
<template v-if="currentChildIndex == ind && (child.fieldType == '3' || child.fieldType == '1' || child.fieldType == '0' || child.fieldType == '4')">
<div class="edit-item test-title" :key="ind">
<div class="edit-item-title">提示文字</div>
<!-- <el-input class="w-340" v-model="item.placeHolder" placeholder=""></el-input> -->
<add-input :inputValue="child.fieldDescription" :disFlag="0" :child="'child'" :maxLength="15" @itemInput="itemInput"></add-input>
</div>
</template>
<!-- 类型 -->
<template v-if="currentChildIndex == ind && (child.fieldType == '3' || child.fieldType == '1' || child.fieldType == '0' || child.fieldType == '4')">
<div class="edit-item " :key="ind">
<div class="edit-item-title">类型</div>
<!-- <template v-for="(types,ind) in child.ruleContent">
<el-checkbox v-model="types.checked" @change="changeCheck($event,ind,child.type)">{{types.name}}</el-checkbox>
</template> -->
<!-- 单选 -->
<template v-if="child.fieldType == 3">
<template v-for="(types, ind) in child.ruleContent">
<el-radio v-model="types.checked" :label="types.checked" :key="ind">{{ types.name }}</el-radio>
</template>
</template>
<!-- 多选 -->
<template v-if="child.fieldType == 1">
<template v-for="(types, ind) in child.ruleContent">
<el-checkbox v-model="types.checked == 'checked' ? true : false" disabled :key="ind">{{ types.name }}</el-checkbox>
</template>
</template>
<!-- 单行输入框-->
<template v-if="child.fieldType == 0">
<template v-for="(types, ind) in child.ruleContent">
<el-checkbox v-model="types.select" @change="changeCheck($event, ind, child.type)" :key="ind">{{ types.name }}</el-checkbox>
</template>
</template>
<!-- 日期 -->
<template v-if="currentChildIndex == ind && child.systemFieldId == -1 && child.fieldType == 4">
<template v-for="(types, ind) in child.ruleContent">
<el-radio v-model="child.typeValue" :label="types.name" @change="changeRadio($event, ind, child)" :key="ind">{{ types.name }}</el-radio>
</template>
</template>
</div>
</template>
<!-- 长度限制 -->
<template v-if="currentChildIndex == ind && child.fieldType == 0">
<div class="edit-item " :key="ind">
<div class="edit-item-title">长度限制</div>
<el-input v-model="child.limitCountMin" placeholder="" @focus="inputFocus('limitCountMin', child)" @keyup.native="formatInput($event)" class="w-120"></el-input>
<label class="label-txt"></label>
<el-input v-model="child.limitCountMax" placeholder="" @focus="inputFocus('limitCountMax', child)" @keyup.native="formatInput($event)" class="w-120"></el-input>
<label class="label-txt">位字符</label>
</div>
</template>
<!-- 选项 -->
<template v-if="currentChildIndex == ind && (child.fieldType == '3' || child.fieldType == '1')">
<div class="edit-item" :key="ind">
<div class="edit-item-title">选项 <span v-if="child.fieldType == '1'">最多20项,每项最多10个字</span> <span v-if="child.fieldType == '3'">最多5项,每项最多10个字</span></div>
<template v-for="(types, ind) in child.fieldContent">
<div class="margin-t-15" :style="ind == 0 ? 'margin-top: 0' : ''" :key="ind">
<add-input :inputValue="types.name" :childIndex="ind" :child="'child'" :childItem="child.fieldType == '3' || child.fieldType == '1' ? 'k303' : ''" :disFlag="0" :maxLength="10" @itemInput="itemInput"></add-input>
<i class="opt-btn el-icon-remove del-item" v-if="child.fieldContent.length > 1" @click="delChildItem(index, ind, child)"></i>
<template v-if="child.systemFieldId == '-1' && child.fieldType == 1 && ind < 19">
<i class="opt-btn el-icon-circle-plus add-item" v-if="ind == child.fieldContent.length - 1" @click="addChildItem(index, ind, child)"></i>
</template>
<template v-if="child.systemFieldId == '-1' && child.fieldType == 3 && ind < 4">
<i class="opt-btn el-icon-circle-plus add-item" v-if="ind == child.fieldContent.length - 1" @click="addChildItem(index, ind, child)"></i>
</template>
</div>
</template>
</div>
</template>
<!-- 必填和商户 -->
<template v-if="currentChildIndex == ind && (child.fieldType == '3' || child.fieldType == '1' || child.fieldType == '0' || child.fieldType == '4')">
<div class="edit-item " :key="ind">
<div class="edit-item-title">验证</div>
<el-checkbox v-model="child.isMust">必填</el-checkbox>
</div>
<div class="edit-item " :key="ind">
<div class="edit-item-title">适用商户<!-- <el-checkbox :indeterminate="child.isIndeterminate" v-model="child.checkAll" @change="checkAllChange($event,child)" class="margin-l-15">全选</el-checkbox> --></div>
<div class="edit-item-checkbox">
<el-checkbox :indeterminate="child.isIndeterminate" v-model="child.checkAll" @change="checkAllChange($event, child)" class="margin-b-15">全选</el-checkbox>
</div>
<el-checkbox-group v-model="child.enterpriseIds" @change="checkedChange($event, child)">
<!-- 商户列表 -->
<template v-for="(merchantItem, idx) in merchantOptions">
<div class="checkbox-cell" :key="idx">
<el-checkbox :label="merchantItem.enterpriseId" :key="merchantItem.id"> <el-input class="w-316" v-model="merchantItem.name" placeholder="" disabled></el-input></el-checkbox>
</div>
</template>
</el-checkbox-group>
</div>
</template>
<!-- 单行输入框-->
<!-- <template v-if="currentChildIndex == ind && child.systemFieldId == -1 && child.fieldType==0">
<div class="edit-item ">
<div class="edit-item-title">类型</div>
<template v-for="(types,ind) in child.ruleContent">
<el-checkbox v-model="types.checked" @change="changeCheck($event,ind,child.type)">{{types.name}}</el-checkbox>
</template>
</div>
<div class="edit-item ">
<div class="edit-item-title">长度限制</div>
<el-input v-model="child.limitCountMin" placeholder="" class="w-120"></el-input>
<label class="label-txt">至</label>
<el-input v-model="child.limitCountMax" placeholder="" class="w-120"></el-input>
<label class="label-txt">位字符</label>
</div>
</template> -->
<!-- 自定义日期 -->
<!-- <template v-if="currentChildIndex == ind && child.systemFieldId == -1 && child.fieldType==4">
<div class="edit-item ">
<div class="edit-item-title">类型</div>
<template v-for="(types,ind) in child.ruleContent">
<el-radio v-model="child.typeValue" :label="types.name" @change="changeRadio($event,ind,child)">{{types.name}}</el-radio>
</template>
</div>
</template> -->
</template>
</template>
<!-- 姓名 生日个人爱好-->
<template v-if="currentIndex == index && (item.systemFieldId == 'k101' || item.systemFieldId == 'k104' || item.systemFieldId == 'k401')">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-checkbox v-model="types.checked == 'checked' ? true : false" :disabled="types.isEdit == 0 ? true : false" :key="ind">{{ types.name }}</el-checkbox>
</template>
</div>
<div class="edit-item " :key="index">
<div class="edit-item-title">长度限制</div>
<el-input v-model="item.limitCountMin" placeholder="" disabled class="w-120"></el-input>
<label class="label-txt"></label>
<el-input v-model="item.limitCountMax" placeholder="" disabled class="w-120"></el-input>
<label class="label-txt">位字符</label>
</div>
</template>
<!-- 性别 -->
<template v-if="currentIndex == index && item.systemFieldId == 'k102'">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-radio v-model="types.checked" :label="types.checked" :key="ind">{{ types.name }}</el-radio>
</template>
</div>
<div class="edit-item " :key="index">
<div class="edit-item-title">选项</div>
<!-- <div>
<el-input class="w-340" v-model="item.male" placeholder="" disabled></el-input>
</div>
<div class="margin-t-15">
<el-input class="w-340" v-model="item.female" placeholder="" disabled></el-input>
</div> -->
<template v-for="(types, ind) in item.fieldContent">
<div class="margin-t-15" :style="ind == 0 ? 'margin-top:0' : ''" :key="ind">
<add-input :inputValue="types.name" :disFlag="1" :maxLength="10" @itemInput="itemInput"></add-input>
</div>
</template>
</div>
</template>
<!-- 生日103 结婚纪念日204-->
<template v-if="currentIndex == index && (item.systemFieldId == 'k103' || item.systemFieldId == 'k204')">
<div class="edit-item " :key="index">
<div class="edit-item-title">数字</div>
<template v-for="(types, ind) in item.ruleContent">
<el-checkbox v-model="types.checked == 'checked' ? true : false" disabled :key="ind">{{ types.name }}</el-checkbox>
</template>
</div>
<div class="edit-item " :key="index">
<div class="edit-item-title">长度限制</div>
<el-input v-model="item.limitCountMin" placeholder="" disabled class="w-120"></el-input>
<label class="label-txt"></label>
<el-input v-model="item.limitCountMax" placeholder="" disabled class="w-120"></el-input>
<label class="label-txt">位字符</label>
</div>
<div class="edit-item " v-show="item.systemFieldId == 'k103'" :key="index">
<div class="edit-item-title">
设置农历生日<el-popover width="200" trigger="hover" content="开启后用户可手动选择填写农历或阳历生日,不开启则默认用户填写生日为阳历生日" placement="top"> <i slot="reference" class="el-icon-question"></i></el-popover>
</div>
<el-switch v-model="item.fieldContent.birthType"></el-switch>
<div class="edit-item-title">
年龄范围<el-popover width="215" trigger="hover" content="例:若用户填写年龄范围为0-10岁,则小程序端用户填写的生日年份只能为当前年份往前推10年内" placement="top"> <i slot="reference" class="el-icon-question"></i></el-popover>
</div>
<el-input-number class="w-120 my-input-number" :controls="false" v-model="item.fieldContent.sectionMin" min="0" max="99"></el-input-number>
<label class="label-txt"></label>
<el-input-number class="w-120 my-input-number" type="number" :controls="false" v-model="item.fieldContent.sectionMax" :min="item.fieldContent.sectionMin" max="99"></el-input-number>
<label class="label-txt"></label>
</div>
</template>
<!-- 文化程度 婚姻状况 是否有房 是否有车-->
<template v-if="currentIndex == index && (item.systemFieldId == 'k105' || item.systemFieldId == 'k201' || item.systemFieldId == 'k202' || item.systemFieldId == 'k301' || item.systemFieldId == 'k302')">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-radio v-model="types.checked" :label="types.checked" :key="ind">{{ types.name }}</el-radio>
</template>
</div>
<div class="edit-item " :key="index">
<div class="edit-item-title">选项</div>
<template v-for="(types, ind) in item.fieldContent">
<div class="margin-t-15" :style="ind == 0 ? 'margin-top: 0' : ''" :key="ind">
<add-input :inputValue="types.name" :disFlag="1" :maxLength="10" @itemInput="itemInput"></add-input>
</div>
</template>
</div>
</template>
<!-- 邮箱 -->
<template v-if="currentIndex == index && item.systemFieldId == 'k106'">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-checkbox v-model="types.checked == 'checked' ? true : false" disabled :key="ind">{{ types.name }}</el-checkbox>
</template>
</div>
</template>
<!-- 婚姻状况 文化程度相同 是否有房 是否有车-->
<!-- 宝宝信息 isMult //是否支持复合 例如宝宝信息可以多条记录(0:不支持,1:支持)-->
<template v-if="currentIndex == index && item.isMult == 1 && item.systemFieldId == 'k203'">
<div class="edit-item " :key="index">
<div class="edit-item-title">标题最多10个字</div>
<el-checkbox-group v-model="item.babyIds">
<template v-for="(nameItem, idx) in nameList">
<div class="checkbox-cell" :key="idx">
<el-checkbox :label="nameItem.fieldId">{{}}</el-checkbox>
<el-input class="w-316" v-model="nameItem.fieldName" placeholder="" disabled></el-input>
</div>
</template>
</el-checkbox-group>
</div>
</template>
<!-- 结婚街纪念日 生日 相同 -->
<!-- 是否有房 是否有车 文化程度 婚姻状况 相同-->
<!-- 年收入 购物周期 喜好的礼品-->
<template v-if="currentIndex == index && (item.systemFieldId == 'k303' || item.systemFieldId == 'k403' || item.systemFieldId == 'k404' || (item.systemFieldId == '-1' && item.fieldType == '3') || (item.systemFieldId == '-1' && item.fieldType == '1'))">
<template v-if="item.ruleContent.length"
><!-- v-if="item.systemFieldId == 'k303' || item.systemFieldId == 'k403' || item.systemFieldId == 'E1'"-->
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<!-- 单选 -->
<template v-if="item.fieldType == 2 || item.fieldType == 3">
<template v-for="(types, ind) in item.ruleContent">
<el-radio v-model="types.checked" :label="types.checked" :key="ind">{{ types.name }}</el-radio>
</template>
</template>
<!-- 多选 -->
<template v-if="item.fieldType == 1">
<template v-for="(types, ind) in item.ruleContent">
<el-checkbox v-model="types.checked == 'checked' ? true : false" disabled :key="ind">{{ types.name }}</el-checkbox>
</template>
</template>
</div>
</template>
<!-- <template v-if="item.systemFieldId == 'k404' || item.systemFieldId == 'E2'">
<div class="edit-item ">
<div class="edit-item-title">类型</div>
<template v-for="(types,ind) in item.ruleContent">
<el-checkbox v-model="types.checked=='checked'? true:false" :disabled="types.isEdit==0? true: false">{{types.name}}</el-checkbox>
</template>
</div>
</template> -->
<div class="edit-item " :key="index">
<div class="edit-item-title">选项 <span v-if="item.systemFieldId == 'k404' || (item.systemFieldId == '-1' && item.fieldType == '1')">最多20项,每项最多10个字</span> <span v-if="item.systemFieldId != 'k404' && (item.systemFieldId == 'k403' || item.systemFieldId == 'k303' || (item.systemFieldId == '-1' && item.fieldType == '3'))">最多5项,每项最多10个字</span></div>
<template v-for="(types, ind) in item.fieldContent">
<div class="margin-t-15" :style="ind == 0 ? 'margin-top: 0' : ''" :key="ind">
<add-input :inputValue="types.name" :childIndex="ind" :childItem="item.systemFieldId == 'k403' || item.systemFieldId == 'k303' || item.systemFieldId == 'k404' || (item.systemFieldId == '-1' && item.fieldType == '3') || (item.systemFieldId == '-1' && item.fieldType == '1') ? 'k303' : ''" :disFlag="0" :maxLength="10" @itemInput="itemInput"></add-input>
<i class="opt-btn el-icon-remove del-item" v-if="item.fieldContent.length > 1" @click="delChildItem(index, ind, item)"></i>
<template v-if="(item.systemFieldId == 'k404' || (item.systemFieldId == '-1' && item.fieldType == 1)) && ind < 19">
<i class="opt-btn el-icon-circle-plus add-item" v-if="ind == item.fieldContent.length - 1" @click="addChildItem(index, ind, item)"></i>
</template>
<template v-if="(item.systemFieldId == 'k403' || item.systemFieldId == 'k303' || (item.systemFieldId == '-1' && item.fieldType == '3')) && ind < 4">
<i class="opt-btn el-icon-circle-plus add-item" v-if="ind == item.fieldContent.length - 1" @click="addChildItem(index, ind, item)"></i>
</template>
</div>
</template>
</div>
</template>
<!-- 期望消息推送 -->
<template v-if="currentIndex == index && item.systemFieldId == 'k402'">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-checkbox v-model="types.checked == 'checked' ? true : false" disabled :key="ind">{{ types.name }}</el-checkbox>
</template>
</div>
<div class="edit-item " :key="index">
<div class="edit-item-title">选项</div>
<template v-for="(types, ind) in item.fieldContent">
<div class="margin-t-15" :style="ind == 0 ? 'margin-top: 0' : ''" :key="ind">
<add-input :inputValue="types.name" :disFlag="1" :maxLength="10" @itemInput="itemInput"></add-input>
</div>
</template>
</div>
</template>
<!-- 自定义字段 -->
<!-- 单行输入框-->
<template v-if="currentIndex == index && item.systemFieldId == -1 && item.fieldType == 0">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-checkbox v-model="types.select" @change="changeCheck($event, ind, item.type)" :key="ind">{{ types.name }}</el-checkbox>
</template>
</div>
<div class="edit-item " :key="index">
<div class="edit-item-title">长度限制</div>
<el-input v-model="item.limitCountMin" placeholder="" @focus="inputFocus('limitCountMin', item)" @keyup.native="formatInput($event)" class="w-120"></el-input>
<label class="label-txt"></label>
<el-input v-model="item.limitCountMax" placeholder="" @focus="inputFocus('limitCountMax', item)" @keyup.native="formatInput($event)" class="w-120"></el-input>
<label class="label-txt">位字符</label>
</div>
</template>
<!-- 自定义日期 -->
<template v-if="currentIndex == index && item.systemFieldId == -1 && item.fieldType == 4">
<div class="edit-item " :key="index">
<div class="edit-item-title">类型</div>
<template v-for="(types, ind) in item.ruleContent">
<el-radio v-model="item.typeValue" :label="types.name" @change="changeRadio($event, ind, item)" :key="ind">{{ types.name }}</el-radio>
</template>
</div>
</template>
<!-- 公共 -->
<template v-if="currentIndex == index && (item.systemFieldId != '-1' || (item.systemFieldId == '-1' && item.fieldType != 5))">
<div class="edit-item " :key="index">
<div class="edit-item-title">验证</div>
<el-checkbox v-model="item.isMust">必填</el-checkbox>
</div>
<!-- 生日时才有 -->
<template v-if="item.modifyLimitFlag == 1">
<div class="edit-item " :key="index">
<div class="edit-item-title">修改次数限制</div>
<div class="margin-t-0">
<el-radio v-model="item.modifyLimitStatus" label="0">最多修改</el-radio>
<el-input class="w-60" v-model="item.modifyTimesLimit" placeholder=""></el-input>
<label class="el-radio__label"></label>
</div>
<div class="margin-t-15">
<el-radio v-model="item.modifyLimitStatus" label="1">每月最多修改1次</el-radio>
</div>
<div class="margin-t-15">
<el-radio v-model="item.modifyLimitStatus" label="2">每年最多修改1次</el-radio>
</div>
</div>
</template>
<div class="edit-item " :key="index">
<div class="edit-item-title">适用商户</div>
<div class="edit-item-checkbox">
<el-checkbox :indeterminate="item.isIndeterminate" v-model="item.checkAll" @change="checkAllChange($event, item)" class="margin-b-15">全选</el-checkbox>
</div>
<el-checkbox-group v-model="item.enterpriseIds" @change="checkedChange($event, item)">
<!-- 商户列表 -->
<template v-for="(merchantItem, idx) in merchantOptions">
<div class="checkbox-cell" :key="idx">
<el-checkbox :label="merchantItem.enterpriseId" :key="merchantItem.id"> <el-input class="w-316" v-model="merchantItem.name" placeholder="" disabled></el-input></el-checkbox>
</div>
</template>
</el-checkbox-group>
</div>
</template>
</template>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
<!-- <vue-gic-footer></vue-gic-footer> -->
</div>
</template>
<script>
import draggable from 'vuedraggable';
import AddInput from '@/components/memberShip/add-input';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'memberInfoTemplate',
data() {
return {
// tab
activeName: 'first',
// right tab
rightName: 'first',
bodyHeight: (document.documentElement.clientHeight || document.body.clientHeight) + 'px',
// option
isDragging: false,
delayedDragging: false,
// leftOption
leftOption: {
group: { name: 'people', pull: 'clone', put: false },
sort: false,
disabled: false
},
leftDefineOption: {
group: { name: 'people', pull: 'clone', put: false },
sort: false,
disabled: false
},
// rightOption
// 宝宝生日字段列表
nameList: [
{
fieldDescription: '请输入',
fieldId: 'k20301',
fieldName: '宝宝名称',
fieldType: 0,
limitCountMax: 20,
limitCountMin: 1
},
{
fieldDescription: '请输入',
fieldId: 'k20302',
fieldName: '宝宝性别',
fieldType: 1,
limitCountMax: 20,
limitCountMin: 1
},
{
fieldDescription: '请输入',
fieldId: 'k20303',
fieldName: '宝宝生日',
fieldType: 2,
limitCountMax: 20,
limitCountMin: 1
},
{
fieldDescription: '请输入',
fieldId: 'k20304',
fieldName: '宝宝身高(cm)',
fieldType: 3,
limitCountMax: 20,
limitCountMin: 1
},
{
fieldDescription: '请输入',
fieldId: 'k20305',
fieldName: '宝宝体重(kg)',
fieldType: 4,
limitCountMax: 20,
limitCountMin: 1
},
{
fieldDescription: '请输入',
fieldId: 'k20306',
fieldName: '鞋码(码)',
fieldType: 5,
limitCountMax: 20,
limitCountMin: 1
}
],
selectKey: '',
// 基本信息
baseInfo: [],
// 家庭信息
familyInfo: [],
// 资产信息
assetInfo: [],
// 其他信息
otherInfo: [],
// 自定义
defineInfo: [
{
systemFieldId: '-1',
fieldName: '单选框',
fieldNameCopy: '单选框',
fieldEdited: 1, // 修改(0:不可修改,1:可修改)
fieldType: 3,
fixed: false,
isMult: '0',
parentFieldId: '-1',
fieldDescription: '请选择',
fieldCode: '-1',
regularRule: '0000000',
modifyTimesLimit: -1,
ruleContent: [{ type: 'radio', name: '单选', checked: 'checked', isEdit: 1 }],
fieldContent: [{ type: 'radio', name: '选项1' }, { type: 'radio', name: '选项2' }, { type: 'radio', name: '选项3' }],
limitCountMin: 1,
limitCountMax: 20,
allowEdit: '1001',
modifyLimitFlag: '0',
modifyLimitStatus: -1,
isMust: true,
checkAll: false,
isIndeterminate: false,
enterpriseIds: []
},
{
systemFieldId: '-1',
fieldName: '多选框',
fieldNameCopy: '多选框',
fieldEdited: 1, // 修改(0:不可修改,1:可修改)
fieldType: 1,
fixed: false,
isMult: '0',
parentFieldId: '-1',
fieldDescription: '请选择',
fieldCode: '-1',
limitCountMin: '-1',
limitCountMax: '-1',
regularRule: '0000000',
modifyTimesLimit: -1,
ruleContent: [{ type: 'checkbox', name: '多选', checked: 'checked', isEdit: 0 }],
fieldContent: [{ type: 'checkbox', name: '选项1' }, { type: 'checkbox', name: '选项2' }, { type: 'checkbox', name: '选项3' }],
isMust: true,
checkAll: false,
isIndeterminate: false,
allowEdit: '1001',
modifyLimitFlag: '0',
modifyLimitStatus: -1,
enterpriseIds: []
},
{
systemFieldId: '-1',
fieldName: '日期',
fieldNameCopy: '日期',
fieldEdited: 1, // 修改(0:不可修改,1:可修改)
fieldType: 4,
fixed: false,
parentFieldId: '-1',
fieldDescription: '请选择',
typeValue: '年-月-日',
fieldCode: '-1',
limitCountMin: '-1',
limitCountMax: '-1',
regularRule: '0000100',
modifyTimesLimit: -1,
ruleContent: [{ type: 'radio', name: '年-月-日', checked: 'checked', isEdit: 1 }, { type: 'radio', name: '年-月', isEdit: 1 }],
isMult: '0',
isMust: true,
checkAll: false,
isIndeterminate: false,
allowEdit: '1100',
modifyLimitFlag: '0',
modifyLimitStatus: -1,
enterpriseIds: []
},
{
systemFieldId: '-1',
fieldName: '单行输入框',
fieldNameCopy: '单行输入框',
fieldEdited: 1, // 修改(0:不可修改,1:可修改)
fieldType: 0,
fixed: false,
parentFieldId: '-1',
fieldDescription: '请输入',
fieldCode: '-1',
regularRule: '0000000',
modifyTimesLimit: -1,
ruleContent: [{ type: 'checkbox', name: '中文', select: false, checked: 'checked', isEdit: 1 }, { type: 'checkbox', name: '数字', select: false, checked: 'checked', isEdit: 1 }, { type: 'checkbox', name: '字母', select: false, checked: 'checked', isEdit: 1 }, { type: 'checkbox', name: '符号', select: false, checked: 'checked', isEdit: 1 }],
isMult: '0',
limitCountMin: 1,
limitCountMax: 20,
isMust: true,
checkAll: false,
isIndeterminate: false,
allowEdit: '1110',
modifyLimitFlag: '0',
modifyLimitStatus: -1,
enterpriseIds: []
},
{
systemFieldId: '-1',
fieldName: '组块',
fieldNameCopy: '组块',
fieldContent: '-1',
parentFieldId: 'ff8080816396562e016396605c450001',
fieldType: 5,
fieldEdited: 1, // 修改(0:不可修改,1:可修改)
fixed: false,
isMult: '0',
isMust: '1',
fieldDescription: '',
sonList: [],
fieldCode: '-1',
limitCountMin: '-1',
limitCountMax: '-1',
regularRule: '0000000',
modifyTimesLimit: -1,
ruleContent: '-1',
allowEdit: '0000',
modifyLimitFlag: '0',
modifyLimitStatus: -1,
enterpriseIds: ''
}
],
// 中间数据集合
currentIndex: 0, //当前选择的 item
currentKey: '', // 当前选择的 item key
tempaletDataList: [],
// sonlist
currentChildIndex: null,
childIndex: 0,
//商户列表
merchantOptions: [], //
// 已经选择的字段集合
setList: []
};
},
created() {
// this.selectReplayStyle()
},
methods: {
// baseInfoClone
baseInfoClone() {
// that.baseInfo = JSON.parse(JSON.stringify(that.baseInfo))
},
inputFocus(tag, obj) {
let that = this;
that.tempTag = tag;
that.tempObj = obj;
},
formatInput(e) {
let that = this;
that.tempObj[that.tempTag] = String(e.target.value).replace(/[^\d]/g, '');
// 判断最大值和最小值
if (that.tempObj['limitCountMin'] >= that.tempObj['limitCountMax']) {
that.$message.error({
duration: 1000,
message: '长度限制格式有误'
});
// 重新赋值
that.tempObj['limitCountMax'] = 20 + parseInt(that.tempObj['limitCountMin']);
}
},
// 点击 item
clickItem(item) {
log(item);
// item.fixed = !item.fixed
},
// move{relatedContext, draggedContext}
onMove(evt) {
if (evt.to.className.indexOf('block-wrap') != -1) {
let tag = false;
return tag;
}
const draggedElement = evt.draggedContext.element;
return !draggedElement.fixed;
},
// move child
onChildMove(evt) {
let tag = true;
if (evt.dragged.className.indexOf('block-class') != -1) {
if (evt.to.className.indexOf('block-wrap') != -1) {
tag = false;
}
}
return tag;
},
// move end
itemMoveEnd(evt) {
let that = this;
that.isDragging = false;
that.selectKey = '';
that.selectKey = evt.clone.dataset.type;
// 判断中间是否已经添加
that.tempaletDataList.forEach(function(ele, index) {
if (ele.systemFieldId == that.selectKey) {
setKey();
}
});
function setKey() {
if (that.selectKey.indexOf('k10') != -1) {
that.baseInfo.forEach(function(ele, index) {
if (ele.systemFieldId == that.selectKey) {
ele.fixed = true;
}
});
return;
}
if (that.selectKey.indexOf('k20') != -1) {
that.familyInfo.forEach(function(ele, index) {
if (ele.systemFieldId == that.selectKey) {
ele.fixed = true;
}
});
return;
}
if (that.selectKey.indexOf('k30') != -1) {
that.assetInfo.forEach(function(ele, index) {
if (ele.systemFieldId == that.selectKey) {
ele.fixed = true;
}
});
return;
}
if (that.selectKey.indexOf('k40') != -1) {
that.otherInfo.forEach(function(ele, index) {
if (ele.systemFieldId == that.selectKey) {
ele.fixed = true;
}
});
return;
}
// 自定义暂时不限制
// if (that.selectKey.indexOf('E') !=-1) {
// that.defineInfo.forEach(function(ele,index){
// if (ele.key == that.selectKey) {
// ele.fixed = true
// }
// })
// return;
// }
}
that.selectKey = '';
that.tempaletDataList = JSON.parse(JSON.stringify(that.tempaletDataList));
},
cloneDefine(evt) {
log('clone>>>>', evt);
},
// 中间部分方法
// 选择 item
selectItem(key, index) {
let that = this;
that.currentKey = key;
that.currentIndex = index;
that.currentChildIndex = null;
},
// 删除 item
deleteItem(key, index) {
let that = this;
that.tempaletDataList.splice(index, 1);
that.currentIndex--;
if (that.currentIndex <= 0) {
that.currentIndex = 0;
}
if (that.tempaletDataList.length) {
that.currentKey = that.tempaletDataList[that.currentIndex].systemFieldId;
}
// 删除后重新设置 fixed 值
if (key.indexOf('k10') != -1) {
that.baseInfo.forEach(function(ele, index) {
if (ele.systemFieldId == key) {
ele.fixed = false;
}
});
}
if (key.indexOf('k20') != -1) {
that.familyInfo.forEach(function(ele, index) {
if (ele.systemFieldId == key) {
ele.fixed = false;
}
});
}
if (key.indexOf('k30') != -1) {
that.assetInfo.forEach(function(ele, index) {
if (ele.systemFieldId == key) {
ele.fixed = false;
}
});
}
if (key.indexOf('k40') != -1) {
that.otherInfo.forEach(function(ele, index) {
if (ele.systemFieldId == key) {
ele.fixed = false;
}
});
}
},
// 添加 item
addItem(evt) {
let that = this;
log('中间add:', evt, that.tempaletDataList);
},
// 添加child
addDragItem(evt) {
let that = this;
log('中间 child-add:', evt, that.tempaletDataList);
return false;
},
// 组块
selectChildItem(key, index, ind, list) {
let that = this;
that.currentKey = key;
that.currentIndex = null;
that.childIndex = index;
that.currentChildIndex = ind;
},
deleteChildItem(key, index, ind, list) {
let that = this;
that.childIndex = index;
that.tempaletDataList = JSON.parse(JSON.stringify(that.tempaletDataList));
that.tempaletDataList[index].sonList.splice(ind, 1);
},
//右侧方法
// 全选
checkAllChange(e, item) {
let that = this;
if (e) {
that.merchantOptions.forEach(function(el, index) {
item.enterpriseIds.push(el.enterpriseId);
});
} else {
item.enterpriseIds = [];
}
item.isIndeterminate = false;
},
checkedChange(e, item) {
let that = this;
let count = e.length;
item.checkAll = count == that.merchantOptions.length;
item.isIndeterminate = count > 0 && count < that.merchantOptions.length;
},
// 添加删除选项
delChildItem(index, ind, item) {
item.fieldContent.splice(ind, 1);
},
addChildItem(index, ind, item) {
let that = this;
item.fieldContent.forEach(function(ele, index) {});
// 多选
if (item.systemFieldId == 'k404' || (item.systemFieldId == '-1' && item.fieldType == 1)) {
if (ind == 19) {
that.$message.error({
duration: 1000,
message: '最多可添加 20 项'
});
} else {
if (item.systemFieldId == '-1' && item.fieldType == 1) {
item.fieldContent.push({ type: 'checkbox', name: '请输入选项' });
// 判断重复字段
let arrValues = item.fieldContent.map(ite => ite.name); // 返回对象中键值集合的数组
if (that.isRepeat(arrValues)) {
item.fieldContent.splice(item.fieldContent.length - 1, 1);
arrValues.splice(item.fieldContent.length - 1, 1);
that.$message.error({
duration: 1000,
message: '选项不能重复'
});
return;
}
return;
}
item.fieldContent.push({ type: 'checkbox', name: '请输入选项' });
// 判断重复字段
let arrValues = item.fieldContent.map(ite => ite.name); // 返回对象中键值集合的数组
if (that.isRepeat(arrValues)) {
item.fieldContent.splice(item.fieldContent.length - 1, 1);
arrValues.splice(item.fieldContent.length - 1, 1);
that.$message.error({
duration: 1000,
message: '选项不能重复'
});
return;
}
}
return;
}
// 单选
if (ind == 4) {
that.$message.error({
duration: 1000,
message: '最多可添加 5 项'
});
return;
}
item.fieldContent.push({ type: 'radio', name: '请输入选项' });
// 判断重复字段
let arrValues = item.fieldContent.map(ite => ite.name); // 返回对象中键值集合的数组
if (that.isRepeat(arrValues)) {
item.fieldContent.splice(item.fieldContent.length - 1, 1);
arrValues.splice(item.fieldContent.length - 1, 1);
that.$message.error({
duration: 1000,
message: '选项不能重复'
});
return;
}
},
// 改变输入框的值,子组件触发方法
itemInput(val) {
let that = this;
// 判断组块子级
if (!!val && val.child == 'child') {
// 如果是标题
if (!!val && val.title == 'title') {
that.tempaletDataList[that.childIndex].sonList[that.currentChildIndex].fieldName = val.value;
return;
}
// 如果是/
if (!!val && val.flag == 'k303') {
that.tempaletDataList[that.childIndex].sonList[that.currentChildIndex].fieldContent[val.c3Index].name = val.value;
return;
}
that.tempaletDataList[that.childIndex].sonList[that.currentChildIndex].fieldDescription = val.value;
return;
}
// 如果是标题
if (!!val && val.title == 'title') {
that.tempaletDataList[that.currentIndex].fieldName = val.value;
return;
}
// 如果是年收入/
if (!!val && val.flag == 'k303') {
that.tempaletDataList[that.currentIndex].fieldContent[val.c3Index].name = val.value;
return;
}
that.tempaletDataList[that.currentIndex].fieldDescription = val;
},
// 自定义复选(单行输入框)
changeCheck(e, ind, item) {
log(item);
},
// 自定义单选(日期)
changeRadio(e, ind, item) {
if (e == '') {
item[ind];
}
},
// 判断添加重复字段
isRepeat(arr) {
let hash = {};
for (let i in arr) {
if (hash[arr[i]]) {
return true;
}
hash[arr[i]] = true;
}
return false;
},
//路由跳转
changeRoute(route) {
this.$router.push(route);
},
// 检查
checkTag(data) {
let tag = {};
tag.flag = true;
tag.bodyFlag = true;
tag.filedFlag = true;
data.forEach(function(ele, index) {
ele.isMust = ele.isMust == true ? 1 : 0; //是否必填(0:不是,1:必填)
ele.sortNum = index + 1; //排序
if (ele.fieldName == '') {
tag.filedFlag = false;
tag.name = ele.fieldName || '';
return false;
}
if (!!ele.enterpriseIds && (ele.enterpriseIds == null || !ele.enterpriseIds.length)) {
tag.flag = false;
tag.name = ele.fieldName;
}
if (ele.systemFieldId == 'k203' && !ele.babyIds.length) {
tag.bodyFlag = false;
tag.name = ele.fieldName || '宝宝';
}
// 判断组块
if (ele.systemFieldId == -1 && ele.fieldType == 5) {
ele.sonList.forEach(function(el, index) {
if (el.fieldName == '') {
tag.filedFlag = false;
tag.name = el.fieldName || '';
return false;
}
if (el.enterpriseIds == null || !el.enterpriseIds.length) {
tag.flag = false;
tag.name = el.fieldName;
}
});
}
});
return tag;
},
guid() {
return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
let r = (Math.random() * 16) | 0;
let v = c == 'x' ? r : (r & 0x3) | 0x8;
return v.toString(16);
});
},
// 保存
saveAndBack() {
let that = this;
let data = JSON.parse(JSON.stringify(that.tempaletDataList));
// 检查商户选中
if (!data || !data.length) {
that.$message.error({
duration: 1000,
message: '请配置开卡字段'
});
return;
}
let tagObj = that.checkTag(data);
// 检查商户选中
if (!tagObj.flag) {
that.$message.error({
duration: 1000,
message: tagObj.name + '字段至少选择一个商户'
});
return;
}
// 检查空字段
if (!tagObj.filedFlag) {
that.$message.error({
duration: 1000,
message: tagObj.name + '字段标题不能为空'
});
return;
}
// 检查宝宝
if (!tagObj.bodyFlag) {
that.$message.error({
duration: 1000,
message: tagObj.name + '字段至少选择一个选项'
});
return;
}
data.forEach(function(ele, index) {
ele.isMust = ele.isMust == true ? 1 : 0; //是否必填(0:不是,1:必填)
// 判断可修改
ele.fieldEdited = ele.fieldEdited == true ? 1 : 0;
ele.sortNum = index + 1; //排序
if (!!ele.enterpriseIds && ele.enterpriseIds.length) {
ele.enterpriseIds = ele.enterpriseIds.join(',');
}
if (ele.babyIds) {
ele.babyIds = ele.babyIds.join(',');
}
if (ele.fieldContent) {
ele.fieldContent = JSON.stringify(ele.fieldContent);
}
if (ele.ruleContent) {
ele.ruleContent = JSON.stringify(ele.ruleContent);
}
if (ele.systemFieldId != -1 || (ele.systemFieldId == -1 && ele.fieldType != 5)) {
ele.parentFieldId = '-1';
}
// 日期
if (ele.systemFieldId == -1 && ele.fieldType == 4) {
if (ele.typeValue == '年-月') {
ele.regularRule = '0000010';
} else {
ele.regularRule = '0000100';
}
}
// 组块:把子对象放到和组块同级中
if (ele.systemFieldId == -1 && ele.fieldType == 5) {
let newIdsArray = [];
let uuid = that.guid();
ele.parentFieldId = uuid; // 32 位 uuid
ele.sonList.forEach(function(el, index) {
el.isMust = el.isMust == true ? 1 : 0; //是否必填(0:不是,1:必填)
el.sortNum = index + 1; //排序
newIdsArray = newIdsArray.concat(el.enterpriseIds);
el.enterpriseIds = el.enterpriseIds.join(',');
el.parentFieldId = uuid;
data.push(el);
});
ele.enterpriseIds = [...new Set(newIdsArray)].join(',') || [];
}
// 生日 农历 新增
if (ele.systemFieldId == 'k103') {
ele.fieldContent = JSON.parse(ele.fieldContent);
ele.fieldContent.birthType = ele.fieldContent.birthType ? 0 : 1;
ele.fieldContent.sectionMin = ele.fieldContent.sectionMin > -1 ? Number(ele.fieldContent.sectionMin) : -1;
ele.fieldContent.sectionMax = ele.fieldContent.sectionMax > -1 ? Number(ele.fieldContent.sectionMax) : -1;
ele.fieldContent.timeFlag = ele.fieldContent.sectionMin == -1 && ele.fieldContent.sectionMax == -1 ? 1 : 3;
}
});
// 判断重复字段
let flagArr = data.map(item => item.fieldName);
if (that.isRepeat(flagArr)) {
that.$message.error({
duration: 1000,
message: '标题字段名不能重复'
});
return;
}
// 判断组块
let tagBlock = that.checkTag(data);
if (!tagBlock.flag) {
that.$message.error({
duration: 1000,
message: tagBlock.name + '字段至少选择一个商户'
});
return;
}
// return;
that.saveAllData(data);
},
// 保存数据
saveAllData(data) {
let that = this;
let para = {
params: JSON.stringify(data)
};
postRequest('/api-admin/save-card-filed-template', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
showMsg.showmsg('保存成功', 'success');
that.changeRoute('/memberCardSet');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 获取模板所有字段
getTempInfo() {
let that = this;
let para = {};
postRequest('/api-admin/member-card-filed-template', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result.cateList;
data.forEach(function(el, ind) {
el.fieldList.forEach(function(ele, index) {
if (!!ele.fieldContent && ele.fieldContent != -1) {
if (ele.fieldContent.indexOf("'") != '-1') {
ele.fieldContent = JSON.parse(ele.fieldContent.replace(/'/g, '"'));
} else {
ele.fieldContent = JSON.parse(ele.fieldContent);
}
}
if (!!ele.ruleContent && ele.ruleContent != -1) {
if (ele.ruleContent.indexOf("'") != '-1') {
ele.ruleContent = JSON.parse(ele.ruleContent.replace(/'/g, '"'));
} else {
ele.ruleContent = JSON.parse(ele.ruleContent);
}
// ele.ruleContent = JSON.parse(ele.ruleContent.replace(/'/g, '"'))
}
// 判断必选
ele.isMust = ele.isMust == 1 ? true : false;
// 判断可修改
ele.fieldEdited = ele.fieldEdited == 1 ? true : false;
// 判断商户全选
if (!!ele.enterpriseIds && ele.enterpriseIds != '' && ele.enterpriseIds != null && !!ele.enterpriseIds.length) {
// log(ele.enterpriseIds)
ele.enterpriseIds = ele.enterpriseIds.split(',');
} else {
ele.enterpriseIds = [];
}
ele.isIndeterminate = false;
if (!!ele.enterpriseIds && ele.enterpriseIds.length == that.merchantOptions.length) {
ele.checkAll = true;
} else {
ele.checkAll = false;
}
if (!!ele.enterpriseIds && !!ele.enterpriseIds.length && ele.enterpriseIds.length < that.merchantOptions.length) {
ele.isIndeterminate = true;
}
// 字段不一样,统一下字段
if (!ele.systemFieldId) {
ele.systemFieldId = ele.opencardFieldId;
}
// 判断禁用 fixed 字段
// log(that.setList)
if (that.setList.indexOf(ele.systemFieldId) != -1) {
ele.fixed = true;
} else {
ele.fixed = false;
}
// 如果是 k10开头
if (ele.systemFieldId.indexOf('k10') != -1) {
that.baseInfo.push(ele);
}
// 如果是 k20开头
if (ele.systemFieldId.indexOf('k20') != -1) {
// 宝宝信息
if (ele.systemFieldId == 'k203') {
ele.babyIds = [];
}
that.familyInfo.push(ele);
}
// 如果是 k30开头
if (ele.systemFieldId.indexOf('k30') != -1) {
that.assetInfo.push(ele);
}
// 如果是 k40开头
if (ele.systemFieldId.indexOf('k40') != -1) {
that.otherInfo.push(ele);
}
// 自定义不是从接口返回
// if (ele.systemFieldId == -1) {
// that.defineInfo.push(ele)
// }
});
});
//
// showMsg.showmsg('设置成功','success')
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 获取已经保存模板信息
getInfo() {
let that = this;
let para = {};
postRequest('/api-admin/get-card-field-template-detail', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
that.setList = [];
let data = resData.result ? resData.result : [];
data.forEach(function(ele, index) {
if (!!ele.fieldContent && ele.fieldContent != -1) {
if (ele.fieldContent.indexOf("'") != '-1') {
ele.fieldContent = JSON.parse(ele.fieldContent.replace(/'/g, '"'));
} else {
ele.fieldContent = JSON.parse(ele.fieldContent);
}
}
if (!!ele.ruleContent && ele.ruleContent != -1) {
if (ele.ruleContent.indexOf("'") != '-1') {
ele.ruleContent = JSON.parse(ele.ruleContent.replace(/'/g, '"'));
} else {
ele.ruleContent = JSON.parse(ele.ruleContent);
}
if (ele.systemFieldId == -1 && ele.fieldType == 0) {
ele.ruleContent.forEach(function(el, ind) {
el.select = el.select == 1 ? true : false;
});
}
}
// 判断必选
ele.isMust = ele.isMust == 1 ? true : false;
// 判断可修改
ele.fieldEdited = ele.fieldEdited == 1 ? true : false;
// 判断商户全选
if (!!ele.enterpriseIds && ele.enterpriseIds != '' && ele.enterpriseIds != null) {
ele.enterpriseIds = ele.enterpriseIds.split(',');
}
if (ele.enterpriseIds.length == that.merchantOptions.length) {
ele.checkAll = true;
} else {
ele.checkAll = false;
}
// 判断半选
ele.isIndeterminate = false;
if (!!ele.enterpriseIds && ele.enterpriseIds.length == that.merchantOptions.length) {
ele.checkAll = true;
} else {
ele.checkAll = false;
}
if (!!ele.enterpriseIds && !!ele.enterpriseIds.length && ele.enterpriseIds.length < that.merchantOptions.length) {
ele.isIndeterminate = true;
}
// 如果是生日
if (ele.modifyLimitStatus != '' || ele.modifyLimitStatus == 0) {
ele.modifyLimitStatus = String(ele.modifyLimitStatus);
}
// 宝宝信息
if (!!ele.babyIds) {
ele.babyIds = ele.babyIds.split(',');
} else {
ele.babyIds = [];
}
// 判断禁用,把已经获取的字段添加到数组中,以后判断是否禁用
that.setList.push(ele.systemFieldId);
// 判断自定义部分 regularRule
// if (ele.systemFieldId == -1 ) {
// let regularArr = ele.regularRule.split('')
// ele.zh = regularArr[0];
// ele.num = regularArr[1];
// ele.char = regularArr[2];
// ele.symb = regularArr[3];
// ele.ymd = regularArr[4];
// ele.ym = regularArr[5];
// ele.email = regularArr[6];
// }
// 日期
if (ele.systemFieldId == -1 && ele.fieldType == 4) {
if (ele.regularRule == '0000010') {
ele.typeValue = '年-月';
} else {
ele.typeValue = '年-月-日';
}
}
// 判断组块
if (ele.systemFieldId == -1 && ele.fieldType == 5) {
if (ele.sonList == null || !ele.sonList) {
ele.sonList = [];
}
if (!!ele.sonList && ele.sonList.length) {
ele.sonList.forEach(function(el, index) {
if (!!el.fieldContent && el.fieldContent != -1) {
if (el.fieldContent.indexOf("'") != '-1') {
el.fieldContent = JSON.parse(el.fieldContent.replace(/'/g, '"'));
} else {
el.fieldContent = JSON.parse(el.fieldContent);
}
// el.fieldContent = JSON.parse(el.fieldContent.replace(/'/g, '"'))
}
if (!!el.ruleContent && el.ruleContent != -1) {
if (el.ruleContent.indexOf("'") != '-1') {
el.ruleContent = JSON.parse(el.ruleContent.replace(/'/g, '"'));
} else {
el.ruleContent = JSON.parse(el.ruleContent);
}
// el.ruleContent = JSON.parse(el.ruleContent.replace(/'/g, '"'))
}
// 判断必选
el.isMust = el.isMust == 1 ? true : false;
// 判断商户全选
if (!!el.enterpriseIds && el.enterpriseIds != '' && el.enterpriseIds != null) {
el.enterpriseIds = el.enterpriseIds.split(',');
}
if (el.enterpriseIds.length == that.merchantOptions.length) {
el.checkAll = true;
} else {
el.checkAll = false;
}
// 日期
if (el.systemFieldId == -1 && el.fieldType == 4) {
if (el.regularRule == '0000010') {
el.typeValue = '年-月';
} else {
el.typeValue = '年-月-日';
}
}
// 判断半选
el.isIndeterminate = false;
if (!!el.enterpriseIds && el.enterpriseIds.length == that.merchantOptions.length) {
el.checkAll = true;
} else {
el.checkAll = false;
}
if (!!el.enterpriseIds && !!el.enterpriseIds.length && el.enterpriseIds.length < that.merchantOptions.length) {
el.isIndeterminate = true;
}
});
}
}
// 生日 农历
if (ele.systemFieldId == 'k103') {
ele.radio = '';
ele.fieldContent.birthType = ele.fieldContent.birthType == 0 ? true : false;
ele.fieldContent.sectionMin = ele.fieldContent.sectionMin == -1 ? undefined : ele.fieldContent.sectionMin;
ele.fieldContent.sectionMax = ele.fieldContent.sectionMax == -1 ? undefined : ele.fieldContent.sectionMax;
}
});
that.tempaletDataList = data;
// 获取模板所有字段
that.getTempInfo();
// showMsg.showmsg('设置成功','success')
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 获取商户列表
getCliqueInfo() {
let that = this;
let para = {};
postRequest('/api-admin/list-enterprise', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
let data = resData.result.listEnterprise;
data.forEach(function(ele, index) {
ele.name = ele.brandName;
ele.id = ele.enterpriseId;
});
that.merchantOptions = data;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
}
},
watch: {
isDragging(newValue) {
let that = this;
if (newValue) {
that.delayedDragging = true;
return;
}
that.$nextTick(() => {
that.delayedDragging = false;
});
}
},
components: {
draggable,
AddInput
},
mounted() {
let that = this;
// 获取商户列表
that.getCliqueInfo();
// 获取已经配置的数据
that.getInfo();
document.body.ondrop = function(event) {
event.preventDefault();
event.stopPropagation();
};
}
};
</script>
<style lang="less" scoped>
.template-wrap {
width: 100%;
/*height: 100%;*/
min-height: 860px;
padding: 0;
margin: 0;
background: url('../../../assets/template-bg.jpg') no-repeat center center;
background-size: 100% 100%;
.template-contain {
width: 1200px;
margin: 0 auto;
}
.template-head {
display: -webkit-box;
display: -webkit-flex;
display: flex;
justify-content: space-between;
height: 80px;
align-items: center;
.flex-1 {
-webkit-flex: 1;
-moz-flex: 1;
-ms-flex: 1;
-o-flex: 1;
flex: 1;
display: -webkit-box;
display: -webkit-flex;
display: flex;
align-items: center;
}
.flex-r {
justify-content: flex-end;
}
.template-title-span {
color: #fff;
font-size: 30px;
padding-left: 18px;
}
.el-button--default.is-plain {
background: rgba(255, 255, 255, 0);
color: #fff;
&:hover {
color: #1890ff;
}
}
}
.template-body {
width: 100%;
position: relative;
overflow: hidden;
.template-cell {
}
.el-tab-pane {
height: 660px;
overflow-y: scroll;
}
/* 左侧 */
.template-cell-l {
width: 350px;
float: left;
height: 740px;
padding-top: 40px;
.el-tabs {
/deep/ .el-tabs__item {
width: 50%;
width: 175px;
/*padding: 0;*/
color: rgba(255, 255, 255, 0.5);
&.is-active {
color: #1890ff;
}
}
}
.compenent-item {
position: relative;
width: 148px;
height: 42px;
margin: 0 15px 15px 0;
line-height: 40px;
padding: 0 10px;
display: inline-block;
text-align: center;
cursor: move;
color: #fff;
padding: 0;
overflow: hidden;
font-size: 12px;
border: 1px dashed rgba(255, 255, 255, 0.6);
background: rgba(255, 255, 255, 0.1);
&.fixed-item {
opacity: 0.5;
cursor: not-allowed;
}
}
#list5 {
.compenent-item {
text-align: left;
padding: 0 16px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
span,
.bg-icon {
display: inline-block;
vertical-align: middle;
}
.bg-icon {
position: absolute;
top: 50%;
right: 16px;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-o-transform: translate(0, -50%);
transform: translate(0, -50%);
width: 17px;
height: 17px;
background: url('../../../assets/icon-template.png') no-repeat center center;
background-size: 100%;
&.bg-icon-one {
background-position: 0 -50px;
}
&.bg-icon-two {
background-position: 0 -182px;
}
&.bg-icon-three {
background-position: 0 -67px;
}
&.bg-icon-four {
background-position: 0 0;
}
&.bg-icon-five {
background-position: 0 -165px;
}
}
/* &.compenent-item:nth-child(1) {
.bg-icon {
background-position: 0 -50px;
}
}
&.compenent-item:nth-child(2) {
.bg-icon {
background-position: 0 -182px;
}
}
&.compenent-item:nth-child(3) {
.bg-icon {
background-position: 0 -67px;
}
}
&.compenent-item:nth-child(4) {
.bg-icon {
background-position: 0 0;
}
}
&.compenent-item:nth-child(5) {
.bg-icon {
background-position: 0 -165px;
}
}*/
}
}
.filed-item-title {
padding: 15px 0;
font-size: 14px;
color: #ffffff;
}
}
/* 中间 */
/* 模板 */
.template-cell-m {
float: left;
width: 410px;
height: 740px;
margin: 0 20px;
position: relative;
.view-content {
position: relative;
}
.templet-null-img {
width: 249px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
}
.drag-wrap {
min-height: 530px;
overflow-x: hidden;
overflow-y: auto;
}
.phone-container {
margin-top: 40px;
}
.phone-view {
background: url(../../../assets/iphone.png) no-repeat;
background-size: 100%;
width: 410px;
height: 740px;
/*margin: 0 20px;*/
position: relative;
}
.phone-show-content {
width: 330px;
height: 537px;
position: absolute;
left: 41px;
top: 83px;
overflow-y: auto;
}
.opend-card-item {
height: 46px;
line-height: 46px;
background: #fff;
border-bottom: 1px solid #e7e7eb;
font-size: 14px;
position: relative;
&.sex::after {
content: '';
width: 100%;
height: 100%;
z-index: 2;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}
.opend-card-group-title {
height: 40px;
line-height: 40px;
padding-left: 10px;
}
.opend-card-item {
height: 46px;
line-height: 46px;
background: #fff;
border-bottom: 1px solid #e7e7eb;
}
.phone-list-item {
height: 44px;
line-height: 44px;
background: #fff;
margin-bottom: 5px;
}
.item-title {
width: 100px;
float: left;
padding-left: 10px;
}
.filed-item {
background: #fff;
height: 46px;
width: 100%;
height: auto;
background: #fff;
position: relative;
cursor: move;
padding: 0px;
margin: 0;
font-size: 12px;
color: #292929;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
&.active-item {
border: 1px solid #1890ff;
}
& + .filed-item {
margin-top: 5px;
&.li-block {
margin-top: 15px;
}
}
/*删除*/
.item-close {
position: absolute;
top: 0;
right: 0;
width: 18px;
height: 18px;
line-height: 18px;
text-align: center;
background: #1890ff;
color: #fff;
font-size: 14px;
font-weight: 700;
cursor: pointer;
display: none;
z-index: 2;
}
&:hover {
border: 1px dashed #1890ff;
.item-close {
display: block;
}
}
}
/* 组块 */
.block {
min-height: 308px;
background: #f0eff4;
.block-head {
width: 100%;
background: #f5f5f8;
padding: 0;
height: 35px;
.opencard-item-title {
height: 35px;
line-height: 35px;
/* &.block-pre-wrap{
line-height: 12px;
word-break: break-all;
white-space: pre-wrap;
padding-top: 7px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}*/
}
}
.drag-wrap {
min-height: 250px;
}
}
.opencard-drag {
background: #fff;
height: 46px;
}
.opencard-item-title {
width: 90px;
height: 46px;
line-height: 46px;
text-align: left;
float: left;
padding-left: 10px;
overflow: hidden;
white-space: nowrap;
&.title-pre-wrap {
line-height: 15px;
word-break: break-all;
white-space: pre-wrap;
padding-top: 9px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/*&.block-pre-wrap{
line-height: 12px;
word-break: break-all;
white-space: pre-wrap;
padding-top: 9px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}*/
}
.show-warm-text {
color: #c8c8cd;
width: 185px;
text-align: left;
display: inline-block;
white-space: nowrap;
height: 46px;
line-height: 46px;
}
/* 右侧 */
.template-cell-r {
width: 400px;
float: left;
overflow: hidden;
padding-top: 40px;
.el-tabs {
/deep/.el-tabs__item {
width: 175px;
/* padding: 0; */
/*color: rgba(255, 255, 255, 0.5);*/
}
/deep/.el-tabs__nav-wrap::after {
content: none;
}
}
.label-txt {
margin: 0 10px;
font-size: 14px;
color: #fff;
}
.margin-t-15 {
margin-top: 15px;
}
.margin-t-30 {
margin-top: 30px;
}
.margin-l-15 {
margin-left: 15px;
}
.margin-b-15 {
margin-bottom: 15px;
}
.w-60 {
width: 60px;
}
.w-120 {
width: 120px;
}
.w-316 {
width: 316px;
}
.w-340 {
width: 340px;
/deep/ .el-input__inner {
color: #fff;
background-color: rgba(255, 255, 255, 0.1);
}
}
.opt-btn {
cursor: pointer;
color: #c9d3df;
&.add-item:hover {
/*color: #1890ff;*/
}
&.del-item:hover {
/*color: #F56C6C;*/
}
}
.checkbox-cell {
& + .checkbox-cell {
margin-top: 15px;
}
color: #fff;
}
.el-checkbox {
/deep/ span.el-checkbox__label {
color: #fff;
}
&.is-disabled {
/deep/ span.el-checkbox__label {
color: #fff;
}
}
}
.el-radio {
/deep/ span.el-radio__label {
color: #fff;
}
&.is-disabled {
/deep/ span.el-radio__label {
color: #fff;
}
}
}
.el-input {
/deep/ .el-input__inner {
color: #fff;
background-color: rgba(255, 255, 255, 0.1);
}
.is-disabled {
/deep/ .el-input__inner {
color: #fff;
background-color: rgba(255, 255, 255, 0.1);
}
}
}
.el-checkbox {
color: #fff;
}
.edit-view {
/*height: 700px;*/
/*overflow-y: auto;*/
/*margin-top:40px;*/
}
.edit-item {
color: #fff;
padding-bottom: 10px;
.tip {
margin-left: -40px;
color: rgba(255, 255, 255, 0.7);
width: 30px;
display: inline-block;
text-align: right;
margin-right: 10px;
font-size: 12px;
}
}
.edit-item-title {
color: #ffffff;
font-size: 14px;
font-weight: normal;
padding: 20px 0;
&.edit-title-padding {
padding-top: 15px;
}
}
.edit-item-title span {
font-size: 12px;
margin-left: 5px;
}
}
}
}
.my-input-number /deep/ .el-input__inner {
background: rgba(255, 255, 255, 0.1);
text-align: left;
color: #fff;
}
.no-change-birth::after {
content: '';
width: 100%;
height: 100%;
z-index: 2;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
</style>
<template>
<div class="right-wrap near-store-contain">
<topNav :navpath="navpath"></topNav>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<label class="near-store-tip">单商户小程序中附近门店是否展示集团其他商户门店</label>
<div class="item-label">
<span>展示</span>
<el-switch v-model="nearStoreSwithFlag" @change="nearStoreSwitch"></el-switch>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNav from 'components/nav/nav';
import { postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'nearStoreSet',
data() {
return {
projectName: 'gic-clique', // 当前项目名
// 头部面包屑导航
navpath: [
{
name: '首页',
path: '/'
},
{
name: '附近门店',
path: ''
}
],
// 附近门店
nearStoreSwithFlag: true
};
},
created() {
// this.selectReplayStyle()
},
methods: {
changeRoute(route) {
log('route-change');
this.$router.push(route);
},
// change 附近门店开启/关闭
nearStoreSwitch() {
var that = this;
log(that.nearStoreSwithFlag);
that.setNearStore();
},
// 设置附近门店开启/关闭
setNearStore() {
var that = this;
var param = {
requestProject: that.projectName,
isShowCliqueStore: that.nearStoreSwithFlag == true ? 1 : 0
};
postRequest('/api-admin/save-clique-show-store', param)
.then(res => {
// log(res,res.data,res.data.errorCode)
var resData = res.data;
if (resData.errorCode == 0) {
that.$message({
message: '修改附近门店显示配置成功',
type: 'success'
});
return;
}
// that.userFormVisible = false;
that.nearStoreSwithFlag = false;
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
log(error);
// that.toLogin()
// that.userFormVisible = false;
that.nearStoreSwithFlag = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 获取附近门店开启值
getNearStore() {
var that = this;
var param = {
requestProject: that.projectName
};
postRequest('/api-admin/clique-show-store', param)
.then(res => {
// log(res,res.data,res.data.errorCode)
var resData = res.data;
if (resData.errorCode == 0) {
that.nearStoreSwithFlag = resData.result.isShowCliqueStore == 1 ? true : false;
return;
}
// that.userFormVisible = false;
that.$message.error({
duration: 1000,
message: resData.message
});
})
.catch(function(error) {
log(error);
// that.toLogin()
// that.userFormVisible = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
// // 提示信息
// that.$message.error({
// duration: 1000,
// message: '获取附近门店开启值'
// })
}
},
mounted() {
var that = this;
that.getNearStore();
},
components: {
topNav
}
};
</script>
<style lang="less" scoped>
.attention-wrap {
padding: 24px 33px;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.near-store-tip {
display: block;
font-size: 14px;
margin-bottom: 30px;
}
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.attention-content-wrap {
}
}
</style>
<template>
<div class="right-wrap">
<topNavNew :navpath="navpath"></topNavNew>
<div class="right-content">
<div class="right-box">
<div class="attention-wrap">
<!-- 积分制度 -->
<div class="point-cell point-form">
<div class="point-cell-wrap">
<point-form :pointInfo="pointInfo" :projectName="projectName"></point-form>
</div>
</div>
<div class="height-24"></div>
<!-- 特殊积分获取策略 -->
<div class="point-cell point-table">
<div class="flex table-top title-wrap">
<div class="flex-1 flex-l">
<p class="flex-title">特殊积分获取策略</p>
<div class="flex-lable">设置除通用积分获取规则以外的特殊策略</div>
</div>
</div>
<div class="fr btn-r-wrap"><el-button :disabled="tpnEditBool" type="primary" @click="handleAdd('point')">新增策略</el-button></div>
<!-- table border-->
<div class="table-contain">
<el-table class="table-no-line-wrap" :data="achieveTableData" style="width: 100%">
<el-table-column prop="strategyName" label="策略名称"> </el-table-column>
<el-table-column prop="" label="线下渠道">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.channelList" v-show="item.channelType == 3" :key="index">
<span v-if="item.openStatus == 0">关闭</span>
<span v-else>
<span v-if="item.channelRelationProType == 1 && item.channelRelationStoreType == 1">通用</span>
<span v-if="item.channelRelationProType != 1 || item.channelRelationStoreType != 1">自定义配置</span>
</span>
</span>
</template>
</el-table-column>
<el-table-column prop="" label="微信商城">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.channelList" v-show="item.channelType == 1" :key="index">
<span v-if="item.openStatus == 0">关闭</span>
<span v-else>
<span v-if="item.channelRelationProType == 1">通用</span>
<span v-if="item.channelRelationProType != 1">自定义配置</span>
</span>
</span>
</template>
</el-table-column>
<el-table-column prop="" label="微盟">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.channelList" v-show="item.channelType == 8" :key="index">
<span v-if="item.openStatus == 0">关闭</span>
<span v-else>
<span v-if="item.channelRelationProType == 1">通用</span>
<span v-if="item.channelRelationProType != 1">自定义配置</span>
</span>
</span>
</template>
</el-table-column>
<el-table-column prop="" label="适用对象">
<template slot-scope="scope">
{{ scope.row.useCrowd == 1 ? '所有会员' : '自定义人群' }}
</template>
</el-table-column>
<el-table-column prop="getRule" label="获取规则">
<template slot-scope="scope">
<span v-if="scope.row.integralGetStatus == 0">无积分</span>
<span v-if="scope.row.integralGetStatus != 0"> {{ scope.row.integralGet.fee / 10 }} : {{ scope.row.integralGet.integral / 10 }} </span>
</template>
</el-table-column>
<el-table-column prop="" label="有效期">
<template slot-scope="scope">
<div v-if="scope.row.perpetualFlag === 0">
<p>
{{ scope.row.startValidTime | normalizeDate }}
</p>
<p>
-
</p>
<p>
{{ scope.row.endValidTime | normalizeDate }}
</p>
</div>
<div v-else>
永久有效
</div>
</template>
</el-table-column>
<el-table-column prop="" label="状态">
<template slot-scope="scope">
{{ scope.row.perpetualFlag | normalizeStatus(scope.row.endValidTime) }}
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button @click="handleEditClick(scope.row, 'edit')" type="text">编辑</el-button>
<delete-tip @confirm="handleDelClick(scope.$index, scope.row, achieveTableData)" tips="确认删除吗?">
<el-button type="text">删除</el-button>
</delete-tip>
</template>
</el-table-column>
</el-table>
</div>
</div>
<div class="height-24"></div>
<!-- 特殊积分抵现策略 -->
<div class="point-cell point-table">
<div class="flex table-top title-wrap">
<div class="flex-1 flex-l">
<p class="flex-title">特殊积分抵现策略</p>
<div class="flex-lable">设置消费时使用积分抵现的规则(仅用于微信商城结算)</div>
</div>
</div>
<div class="fr btn-r-wrap"><el-button :disabled="tpnEditBool" type="primary" @click="handleAdd('integ')">新增策略</el-button></div>
<!-- table -->
<div class="table-contain">
<el-table :data="exchangeTableData" style="width: 100%">
<el-table-column prop="strategyName" label="策略名称"> </el-table-column>
<el-table-column prop="useCrowd" label="适用对象">
<template slot-scope="scope">
{{ scope.row.useCrowd == 1 ? '所有会员' : '自定义人群' }}
</template>
</el-table-column>
<el-table-column prop="" label="适用商品">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.channelList" :key="index">
<span v-if="item.channelType == 1">{{item.channelRelationProType == 1&&item.integralUseDiscountControl==1? "所有商品" : "自定义配置" }}</span>
</span>
</template>
</el-table-column>
<el-table-column prop="" label="折扣控制">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.channelList" :key="index">
<span v-if="item.channelType == 1">{{item.integralUseDiscountControl==1? "不限制" : (item.integralUseDiscountControlLower+':'+item.integralUseDiscountControlUpper) }}</span>
</span>
</template>
</el-table-column>
<el-table-column prop="getRule" label="抵现规则">
<template slot-scope="scope">
<span>
{{ scope.row.integralUseStatus == 0 ? '无积分' : scope.row.integralUse.integral + ':' + scope.row.integralUse.fee }}
</span>
</template>
</el-table-column>
<el-table-column prop="" label="比例限制">
<template slot-scope="scope">
<span v-for="(item, index) in scope.row.channelList" :key="index"><span v-if="item.channelType == 1">{{item.useProportionalRestriction}}%</span></span>
</template>
</el-table-column>
<el-table-column prop="" label="有效期">
<template slot-scope="scope">
<div v-if="scope.row.perpetualFlag === 0">
<p>
{{ scope.row.startValidTime | normalizeDate }}
</p>
<p>
-
</p>
<p>
{{ scope.row.endValidTime | normalizeDate }}
</p>
</div>
<div v-else>
永久有效
</div>
</template>
</el-table-column>
<el-table-column prop="" label="状态">
<template slot-scope="scope">
{{ scope.row.perpetualFlag | normalizeStatus(scope.row.endValidTime) }}
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button @click="handleEditClick2(scope.row)" type="text">编辑</el-button>
<delete-tip @confirm="handleDelClick(scope.$index, scope.row, exchangeTableData)" tips="确认删除吗?">
<el-button type="text">删除</el-button>
</delete-tip>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
</div>
</template>
<script>
import topNavNew from 'components/nav/navNew';
import pointForm from 'components/memberShip/point-form';
import errMsg from '@/common/js/error';
import { dateformat } from '@/utils/format';
import { postRequest } from '@/api/api';
import { log } from '@/utils/index.js';
export default {
name: 'pointSystem',
data() {
return {
projectName: 'gic-clique', // 当前项目名
navpath: [
{
name: '集团管理',
path: ''
},
{
name: '会员制度',
path: ''
},
{
name: '积分制度',
path: ''
}
],
// form
pointInfo: {},
bodyHtml: '', //富文本 tinymce 值
// table 获取
achieveTableData: [],
// table 抵现
exchangeTableData: [],
// 太平鸟标识
tpnEditBool: false,
tpnEnterpriseId: 'ff808081671d3ceb01672adebf4e6149'
};
},
filters: {
// 格式化时间戳
normalizeDate(val) {
return dateformat(val, 'yyyy-MM-dd hh:mm:ss').slice(0, -3);
},
normalizeStatus(val, date) {
if (val === 1) {
return '--';
} else {
// 判断时间 当前时间和最迟时间
if (date - Date.now() > 0) {
return '有效';
} else {
return '失效';
}
}
}
},
created() {
// this.selectReplayStyle()
},
methods: {
// 新增
handleAdd(flag) {
if (!this.tpnEditBool) {
if (flag == 'point') {
this.$router.push('/addPointSystem');
} else {
this.$router.push('/addIntegralSytem');
}
}
},
// 删除
handleDelClick(index, row, ArrData) {
let that = this;
let para = {
strategyId: row.integralStrategyId,
requestProject: that.projectName
};
postRequest('/api-admin/delete-member-integral-strategy', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
that.$message({
message: '删除成功',
type: 'success'
});
ArrData.splice(index, 1);
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
// 获取积分制度
getPointInfo() {
let that = this;
let param = {
requestProject: that.projectName
};
postRequest('/api-admin/get-member-integral-setting', param)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (!!resData.result.strategyList && !!resData.result.strategyList.length) {
let arr = resData.result.strategyList;
// 积分策略
arr.forEach(function(ele, index) {
ele.integralGet = JSON.parse(ele.integralGet);
ele.integralUse = JSON.parse(ele.integralUse);
if (ele.strategyType == 1) {
that.achieveTableData.push(ele);
} else {
that.exchangeTableData.push(ele);
}
});
}
// form
if (!!resData.result.memberIntegral) {
that.pointInfo = that.handleData(resData.result.memberIntegral);
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
log(error);
});
},
// 处理表单中数据
handleData(item) {
item.integralGetStatus = String(item.integralGetStatus);
item.integralUseStatus = String(item.integralUseStatus);
item.integralGetStrategy = String(item.integralGetStrategy);
item.integralGetDiscountControl = String(item.integralGetDiscountControl);
item.integralUseDiscountControl = String(item.integralUseDiscountControl);
item.integralGetDiscountControlUpper = String(item.integralGetDiscountControlUpper);
item.integralGetDiscountControlLower = String(item.integralGetDiscountControlLower);
item.integralUseDiscountControlUpper = String(item.integralUseDiscountControlUpper);
item.integralUseDiscountControlLower = String(item.integralUseDiscountControlLower);
item.integralGet = JSON.parse(item.integralGet);
item.integralUse = JSON.parse(item.integralUse);
item.integralCost = JSON.parse(item.integralCost);
item.integralGet.fee = Number(item.integralGet.fee / 10).toFixed(1);
item.integralGet.integral = Number(item.integralGet.integral / 10);
return item;
},
changeRoute(route) {
this.$router.push(route);
},
// 编辑积分获取策略
handleEditClick(row) {
this.$router.push({
path: '/editPointSystem',
query: {
integralStrategyId: row.integralStrategyId
}
});
},
// 编辑积分抵现策略
handleEditClick2(row) {
this.$router.push({
path: '/editIntegralSytem',
query: {
integralStrategyId: row.integralStrategyId
}
});
},
// 判断是否是太平鸟
getLoginInfo() {
let that = this;
let param = {};
postRequest('/api-auth/get-login-user-info', param)
.then(res => {
let resData = res.data;
if (resData.errorCode == 0) {
if (resData.result.enterpriseId == that.tpnEnterpriseId) {
that.tpnEditBool = true;
}
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
log(error);
});
}
},
components: {
topNavNew,
pointForm
},
mounted() {
let that = this;
that.getPointInfo();
that.getLoginInfo();
}
};
</script>
<style lang="less" scoped>
.right-box {
padding: 0;
}
.attention-wrap {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
.item-label {
font-size: 14px;
color: #606266;
margin-bottom: 30px;
span {
display: inline-block;
width: 80px;
}
}
.attention-content-wrap {
}
}
.attention-wrap {
.point-cell {
& + .point-cell {
margin-top: 60px;
}
}
.flex {
display: -webkit-flex;
display: flex;
&.table-top {
border-bottom: 1px solid #e7e7eb;
padding-bottom: 22px;
position: relative;
}
.flex-1 {
-webkit-flex: 1;
-moz-flex: 1;
-ms-flex: 1;
-o-flex: 1;
flex: 1;
}
.flex-title {
font-size: 15px;
font-weight: 500;
padding: 5px 0;
}
.flex-lable {
font-size: 13px;
color: #828282;
}
.flex-l {
text-align: left;
}
.flex-r {
text-align: right;
}
}
}
.right-box /deep/ .el-form-item .el-input__inner {
padding-right: 15px;
}
.point-cell-wrap {
padding: 24px 32px 0;
}
.title-wrap {
border-bottom: 1px solid #e7e7eb;
padding: 20px 32px 15px;
}
.btn-r-wrap {
padding: 24px 24px 22px 0;
}
.table-contain {
padding: 0 24px 24px;
}
/* 去掉表格的最后一条线 */
.table-no-line-wrap::before {
height: 0;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment