Commit 0ca46fe7 by member

会员标签页面完成

parent a8cf977c
......@@ -13,13 +13,6 @@
"version": "conventional-changelog -p angular -i changelog.md -s -r 0 && git add changelog.md"
},
"dependencies": {
"@gic-test/vue-area-ab": "^1.4.3",
"@gic-test/vue-gic-aside-menu": "^1.1.45",
"@gic-test/vue-gic-datepicker": "^1.3.1",
"@gic-test/vue-gic-footer": "^1.0.10",
"@gic-test/vue-gic-header": "^1.4.3",
"@gic-test/vue-gic-img-preview": "^1.0.12",
"@gic-test/vue-gic-store-new": "^1.2.8",
"@riophae/vue-treeselect": "0.0.29",
"@tinymce/tinymce-vue": "^1.0.8",
"element-ui": "^2.3.9",
......
......@@ -284,12 +284,12 @@ export default {
if (resData.errorCode == 1) {
let dataVal = JSON.parse(JSON.stringify(resData.result));
dataVal.forEach(function(ele, index) {
let newTagVal = JSON.parse(ele.tagParams);
if (newTagVal.selectedVal != '') {
ele.newTagVal = JSON.stringify(newTagVal.selectedVal).replace(/"/g, '');
} else {
ele.newTagVal = '';
}
let newTagVal = JSON.parse(ele.tagParams);
if (newTagVal.selectedVal != '') {
ele.newTagVal = JSON.stringify(newTagVal.selectedVal).replace(/"/g, '');
} else {
ele.newTagVal = '';
}
});
that.temporaryData = dataVal;
return;
......@@ -297,10 +297,11 @@ export default {
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
console.log(error);
// that.$message.error({
// duration: 1000,
// message: error.message
// });
});
},
......
......@@ -118,7 +118,6 @@ export default {
});
}
},
/* eslint-disable */
mounted() {
// var that = this;
// that.getNavPath();
......
<template>
<div class="tag-mode">
<div class="tag-header">
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全部选择</el-checkbox>
</div>
<div class="tag-content">
<el-checkbox-group v-model="checkedMode" @change="handleCheckedCitiesChange">
<el-checkbox v-for="mode in modes" :label="mode" :key="mode.value">{{ mode.name }}</el-checkbox>
</el-checkbox-group>
</div>
</div>
</template>
<script>
const MODES = [{ name: '图文', value: 1 }, { name: '文本', value: 2 }, { name: '图片', value: 3 }, { name: '小程序', value: 4 }];
export default {
name: 'tag-mode',
data() {
return {
modes: MODES,
checkedMode: [],
isIndeterminate: false,
checkAll: false
};
},
methods: {
handleCheckAllChange(val) {
this.checkedMode = val ? MODES : [];
this.isIndeterminate = false;
},
handleCheckedCitiesChange(val) {
let checkCount = val.length;
this.checkAll = checkCount === this.modes.length;
this.isIndeterminate = checkCount > 0 && checkCount < this.modes.length;
}
}
};
</script>
<style lang="scss" scoped>
.tag-mode {
margin-top: 10px;
.tag-header {
padding: 12px;
background-color: #ebeef5;
color: #909399;
}
.tag-content {
padding: 12px;
}
}
</style>
......@@ -193,10 +193,11 @@ export default {
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
console.log(error);
// that.$message.error({
// duration: 1000,
// message: error.message
// });
});
},
......
......@@ -13,7 +13,7 @@ import * as types from './store/types';
import '../theme/index.css';
import '../static/css/index.less';
import '../static/font/iconfont.css';
import vueGicDatepicker from '@gic-test/vue-gic-datepicker';
// import vueGicDatepicker from '@gic-test/vue-gic-datepicker';
/* import vueGicHeader from '@gic-test/vue-gic-header';
import vueGicAsideMenu from '@gic-test/vue-gic-aside-menu';
......@@ -30,7 +30,7 @@ Vue.use(vueAreaAb);
Vue.use(vueGicAsideMenu);
Vue.use(vueGicHeader); */
Vue.use(vueGicDatepicker);
// Vue.use(vueGicDatepicker);
Vue.config.productionTip = false;
// Vue.use(ElementUI, { size: 'large' });
Vue.use(VueAxios, axios);
......
function broadcast(componentName, eventName, params) {
this.$children.forEach(child => {
var name = child.$options.componentName;
if (name === componentName) {
child.$emit.apply(child, [eventName].concat(params));
} else {
broadcast.apply(child, [componentName, eventName].concat([params]));
}
});
}
export default {
methods: {
dispatch(componentName, eventName, params) {
var parent = this.$parent || this.$root;
var name = parent.$options.componentName;
while (parent && (!name || name !== componentName)) {
parent = parent.$parent;
if (parent) {
name = parent.$options.componentName;
}
}
if (parent) {
parent.$emit.apply(parent, [eventName].concat(params));
}
},
broadcast(componentName, eventName, params) {
broadcast.call(this, componentName, eventName, params);
}
}
};
import request from './index';
// 请求我的用户 标签分类
export const getMemberTag = () =>
request({
url: '/memberTag/platformHomePageV2',
method: 'get',
params: {
requestProject: 'gic-member-tag-web'
}
});
// 查询标签列表
export const getMemberTagList = params =>
request({
url: '/memberTag/platformTagPageListV2',
method: 'get',
params: params
});
// 手工标签新增三级
export const newHandTag = params =>
request({
url: '/tagLevel/addHand',
method: 'get',
params: params
});
// 手工三级标签列表
export const thirdHandTagList = params =>
request({
url: '/tagLevel/handThirdLevel',
method: 'get',
params: params
});
// 上手手工标签三级
export const deleteThirdTag = params =>
request({
url: '/tagLevel/delHand',
method: 'get',
params: params
});
// 修改三级手工标签
export const editThirdTag = params =>
request({
url: '/tagLevel/editHand',
method: 'get',
params: params
});
// 删除手工标签
export const delThirdHandTag = params =>
request({
url: '/memberTag/delHandMemberTag',
method: 'get',
params: params
});
// 会员分组分类 查询
export const memberGroupList = params =>
request({
url: '/member-tag-group-classify/list',
method: 'get',
params: params
});
import axios from 'axios';
import { Message } from 'element-ui';
// import { getToken } from '@/'
const host = window.location.origin;
const BASEURL = host.indexOf('localhost') > -1 ? 'http://gicdev.demogic.com/gic-member-tag-web' : host;
const server = axios.create({
baseURL: BASEURL,
timeout: 10000
});
server.interceptors.request.use(
config => {
// 在header裡面加一些內容 例如token
return config;
},
error => {
Promise.reject(error);
}
);
server.interceptors.response.use(
response => {
const data = response.data;
if (data.errorCode == 1) {
return data;
} else {
// 根据不同的状态码来做一些操作 例如 token不合法 token过期 没有权限之类的'
Message({
message: data.message,
type: 'warning',
duration: 3000
});
return Promise.reject('error');
}
},
error => {
console.log(error);
return Promise.reject(error);
}
);
export default server;
......@@ -28,16 +28,16 @@ export const constantRouterMap = [
{
path: '/',
name: 'index',
redirect: 'platformTagLib',
redirect: 'member-tag',
component: _import('index', 'index'),
children: [
// 平台标签
{
path: '/platformTagLib',
name: '平台标签库',
component: _import('platformTag', 'platformTagLib'),
path: '/member-tag',
name: '会员标签',
component: _import('platformTag', 'member-tag'),
meta: {
title: '会员标签-平台标签库'
title: '会员标签'
}
},
{
......@@ -95,9 +95,9 @@ export const constantRouterMap = [
{
path: '/myTagLib',
component: _import('myTag', 'myTagLib'),
name: '我的标签库',
name: '会员标签',
meta: {
title: '会员标签-我的标签库'
title: '会员标签'
}
},
{
......
......@@ -3,9 +3,9 @@
<vue-gic-header :projectName="projectName" :collapseFlag="collapseFlag" @collapseTag="collapseTag" @toRouterView="toRouterView"></vue-gic-header>
<div id="content" class="content">
<div class="content-body" :style="{ height: contentHeight }">
<div class="left-menu" :style="{ height: contentHeight }">
<!-- <div class="left-menu" :style="{ height: contentHeight }">
<vue-gic-aside-menu ref="asideMenu" :projectName="projectName" :leftModulesName="leftModulesName" :collapseFlag="collapseFlag"></vue-gic-aside-menu>
</div>
</div> -->
<transition name="fade" mode="out-in">
<!-- 缓存已经填好内容的页面 -->
<!-- <keep-alive include="editGroupGrade"> -->
......@@ -193,13 +193,13 @@ export default {
}
},
watch: {
$route: {
handler: function(val, oldVal) {
this.$refs.asideMenu.refreshRoute();
},
// 深度观察监听
deep: true
}
// $route: {
// handler: function(val, oldVal) {
// this.$refs.asideMenu.refreshRoute();
// },
// // 深度观察监听
// deep: true
// }
},
mounted() {
let that = this;
......
<template>
<div class="group-list">
<ul>
<li></li>
</ul>
</div>
</template>
......@@ -35,9 +35,9 @@
<el-form-item label="" prop="describle" class="w-548">
<div class="memberGroupEdit-wrap__item__title">分组描述</div>
<el-input class="w-407" type="textarea" v-model="ruleForm.describle" style="height: 96px;" @focus="focus('describle', 200)" @keyup.native="value => toInput(value)"> </el-input>
<template
><label class="input-label textarea-label">{{ inputNumObj.describle }}/200</label></template
>
<template>
<label class="input-label textarea-label">{{ inputNumObj.describle }}/200</label>
</template>
</el-form-item>
<el-form-item label="" class="" prop="updateDay" v-if="ruleForm.isActive == 0">
<div class="memberGroupEdit-wrap__item__title">更新频率</div>
......@@ -88,16 +88,17 @@
</add-tag-view>
</div>
</template>
<script>
/* eslint-disable */
import navCrumb from '@/components/nav/nav.vue';
import addTagView from '@/components/addTagView.vue';
import tagShortDetail from '@/components/tagShortDetail.vue';
import strLength from '@/common/js/strlen';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
// import errMsg from '@/common/js/error';
import { _debounce } from '@/common/js/public';
import { getRequest, postRequest, postJson, postForm } from '@/api/api';
import { postRequest } from '@/api/api';
export default {
name: 'memberGroupEdit',
data() {
......@@ -275,7 +276,7 @@ export default {
if (rate == 2) {
that.rateOptions = [];
let week = ['一', '二', '三', '四', '五', '六', '日'];
for (var i = 0; i < 7; i++) {
for (let i = 0; i < 7; i++) {
that.rateOptions.push({
value: String(i + 1),
label: `周${week[i]}`
......@@ -286,7 +287,7 @@ export default {
if (rate == 3) {
that.rateOptions = [];
for (var i = 1; i < 29; i++) {
for (let i = 1; i < 29; i++) {
that.rateOptions.push({
value: '' + i,
label: `${i} 号`
......@@ -413,15 +414,10 @@ export default {
return;
}
errMsg.errorMsg(resData);
// errMsg.errorMsg(resData);
})
.catch(function(error) {
console.log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
},
......@@ -446,8 +442,8 @@ export default {
* 判断添加重复字段
*/
isRepeat(arr) {
var hash = {};
for (var i in arr) {
let hash = {};
for (let i in arr) {
if (hash[arr[i]]) {
return true;
}
......@@ -628,6 +624,7 @@ export default {
postRequest('/member-tag-group/findOneDetial.json', para)
.then(res => {
// console.log(res,res.data,res.data.errorCode)
console.log(res);
const resData = res.data;
if (resData.errorCode == 1) {
let tagGroupDto = resData.result.tagGroupDto;
......@@ -663,15 +660,10 @@ export default {
return;
}
errMsg.errorMsg(resData);
// errMsg.errorMsg(resData);
})
.catch(function(error) {
console.log(error);
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
......@@ -707,6 +699,7 @@ export default {
}
};
</script>
<style lang="scss" scoped>
.memberGroupEdit-wrap__tags {
max-height: 222px;
......
......@@ -2,6 +2,9 @@
<div class="memberGroupList-wrap common-wrap">
<nav-crumb :navpath="navpath"></nav-crumb>
<div class="right-content">
<!-- 左边的会员分组 -->
<div class="group-list"></div>
<!-- 右边的表格 -->
<div class="right-box">
<div class="common-wrap__opt">
<el-input class="w-220 m-r-8" placeholder="请输入关键字搜索人群" prefix-icon="el-icon-search" v-model="tagSearch" clearable @clear="clearSearch" @keyup.enter.native="searchEnterFun"> </el-input>
......@@ -58,6 +61,11 @@
</el-table-column>
<el-table-column prop="peopleCover" label="覆盖人数" show-overflow-tooltip
><!-- width="150px" -->
<template slot="header">
覆盖人数
<i class="el-icon-more"></i>
</template>
<template slot-scope="scope">
{{ (scope.row.memberCount || 0) | formatNum }}
</template>
......@@ -138,6 +146,7 @@ import errMsg from '@/common/js/error';
import timeFormat from '@/common/js/timeFormat';
import { _debounce } from '@/common/js/public';
import { getRequest } from '@/api/api';
import { memberGroupList } from '@/request/api';
// import groupTransfer from '@/components/groupTransfer';
export default {
name: 'memberGroupList',
......@@ -181,6 +190,7 @@ export default {
},
created() {
this.loading = true;
this.getMemberGroupList();
},
filters: {
formatTimeYMD(data) {
......@@ -488,11 +498,20 @@ export default {
message: error.message
});
});
},
/**
* 会员分组分类
*/
getMemberGroupList() {
memberGroupList({
requestProject: 'gic-member-tag-web'
}).then(res => {
console.log(res);
});
}
},
mounted() {
const that = this;
that.getGroupList();
this.getGroupList();
}
};
</script>
......
<template>
<div class="member-tag">
<div class="tag-container">
<nav-crumb :navpath="navpath"></nav-crumb>
<div class="member-box">
<div class="tag-input">
<el-input placeholder="请输入关键词回车搜索标签" prefix-icon="el-icon-search" style="width: 348px" v-model="memberTag" @keyup.native.enter="searchMemberList" clearable></el-input>
</div>
<div class="main-tag">
<div class="tag-list">
<div class="search-box"></div>
<p class="user-info">我的用户</p>
<div class="list-box">
<TagType v-for="(list, i) in tagList" :key="i" :tag-list="list" @handleFristTag="handleFristTag"> </TagType>
</div>
</div>
<div class="tag-all">
<p class="tag-name">
{{ tagName }}
<el-button type="primary" class="add-newtag" @click="addNewTag" v-show="handTag == 1">新增标签</el-button>
</p>
<tag-container :data="memberTagList" :handTag="handTag" :groupId="groupId" @deleteHandTag="deleteHandTag"> </tag-container>
<div class="page-box" v-if="total > 0">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-sizes="[20, 30]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
</div>
</div>
</div>
<div class="foot-box">
<vue-gic-footer></vue-gic-footer>
</div>
</div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import TagType from './tag-type';
import TagContainer from './tag-container';
import { getMemberTag, getMemberTagList } from '@/request/api';
export default {
name: 'member-tag',
componentName: 'member-tag',
components: {
navCrumb,
TagType,
TagContainer
},
data() {
return {
// 面包屑参数
navpath: [
{
name: '首页',
path: `${window.location.origin}/report/#/memberSummary`,
relocation: true
},
{
name: '会员管理',
path: ''
},
{
name: '会员标签',
path: ''
}
],
tagList: [],
memberTagList: [], // 会员标签列表
tagName: '全部标签',
memberTag: '', // 搜索会员标签关键字
tagCategory: '', // 当前标签类别
pageSize: 20,
pageNum: 1,
currentPage: 1,
total: 0
};
},
methods: {
async getTagList() {
const Data = await getMemberTag();
if (Data.result && Data.result.length) {
this.tagList = Data.result;
} else {
this.tagList = [];
}
},
async loadMemberTagList(opt) {
const params = {
requestProject: 'gic-member-tag-web',
search: opt.searchName || null, // 标签名
tagLevelGroupId: opt.id || 0, // 标签层级
tagType: opt.type || null, // 标签类型
pageNum: this.pageNum,
pageSize: this.pageSize
};
const Data = await getMemberTagList(params);
if (Data.result.result && Data.result.result.length) {
this.memberTagList = Data.result.result;
this.total = Data.result.totalCount;
} else {
this.memberTagList = [];
this.total = 0;
}
},
// 每页条数改变
handleSizeChange(val) {
this.pageSize = val;
this.pageNum = 1;
this.loadMemberTagList({});
},
// 当前页码改变
handleCurrentChange(val) {
this.pageNum = val;
this.loadMemberTagList({});
},
// 模糊查询会员标签
searchMemberList() {
this.loadMemberTagList({
searchName: this.memberTag
});
},
// 一级标签
handleFristTag(list) {
this.loadMemberTagList({
id: list.id,
type: list.handTag ? 1 : -1 // 手工标签传1
});
this.groupId = list.id;
this.handTag = list.handTag;
this.changeTagTitle(list.name);
this.saveTagLevelGroupId(list);
},
changeTagTitle(name) {
this.tagName = name || '全部标签';
},
saveTagLevelGroupId(list) {
if (list.handTag == 1) {
const hangObj = {
name: list.name,
id: list.id
};
localStorage.setItem('groupId', JSON.stringify(hangObj));
}
},
// 添加手工标签
addNewTag() {
this.$router.push('/manualTagEdit');
},
// 删除手工
deleteHandTag(id) {
console.log(id);
this.loadMemberTagList({
id: id,
type: 1 // 手工标签传1
});
}
},
beforeMount() {
this.handTag = null;
this.groupId = '';
this.getTagList();
if (localStorage.getItem('groupId')) {
const hangObj = JSON.parse(localStorage.getItem('groupId'));
this.loadMemberTagList({
tagType: 1,
id: hangObj.id
});
this.tagName = hangObj.name;
this.handTag = true;
} else {
this.loadMemberTagList({
tagType: -1
});
}
},
mounted() {
this.$on('refersh-member-list', () => {
this.getTagList();
});
// 处理二级标签
this.$on('handle-second-tag', list => {
this.loadMemberTagList({
id: list.id,
type: list.handTag ? 1 : -1 // 手工标签传1
});
this.groupId = list.id;
this.handTag = list.handTag;
this.changeTagTitle(list.name);
this.saveTagLevelGroupId(list);
});
// 处理三级标签
this.$on('handle-third-tag', list => {
this.loadMemberTagList({
id: list.id,
type: list.handTag ? 1 : -1 // 手工标签传1
});
this.groupId = list.id;
this.handTag = list.handTag;
this.changeTagTitle(list.name);
this.saveTagLevelGroupId(list);
});
}
};
</script>
<style lang="scss" scoped>
.member-tag {
width: 100%;
overflow-y: auto;
.tag-container {
min-height: 100%;
box-sizing: border-box;
padding-bottom: 93px;
}
.foot-box {
margin-top: -100px;
}
.main-tag {
display: flex;
border-top: 1px solid #ebeef5;
.tag-list {
overflow-y: auto;
flex: 0 0 470px;
padding: 23px 0 0 25px;
height: 580px;
border-right: 1px solid #ebeef5;
.user-info {
font-size: 16px;
color: #909399;
}
}
.tag-all {
flex: 1;
position: relative;
.tag-name {
line-height: 34px;
padding: 10px 20px;
font-size: 16px;
color: #303133;
font-weight: bold;
}
.page-box {
position: absolute;
bottom: 10px;
right: 20px;
}
.add-newtag {
float: right;
margin-bottom: 10px;
}
}
}
.member-box {
margin: 20px 32px 0;
background-color: #fff;
.tag-input {
padding: 16px 20px;
}
}
}
</style>
<template>
<div class="second">
<span class="name" :class="{ 'manual-name': tagName === '手工标签' }" @click="handleSecondtag"> {{ tagList.name }} </span>
<i class="arrow-line" v-if="tagName !== '手工标签'">></i>
<el-popover placement="bottom" width="30" trigger="click">
<li class="more" @click="addNewType">新增子分类</li>
<li class="more" @click="handleEditType">编辑子分类</li>
<i slot="reference" class="el-icon-more icon-tag" v-if="tagName === '手工标签'"></i>
</el-popover>
<div class="third-list" :class="{ 'manual-tag': tagName === '手工标签' }">
<span v-if="tagName === '手工标签'" class="arrow"> > </span>
<span v-for="(item, i) in tagList.children" :key="i" class="tag-item" @click="handleThirdTag(item)">
{{ item.name }}
</span>
</div>
<!-- 编辑子分类 -->
<el-dialog :title="newName" :visible.sync="editVisiable" :close-on-click-modal="false" width="40%">
<el-table :data="editData" height="400">
<el-table-column label="子分类名称" prop="levelName">
<template slot-scope="scope">
<el-input v-model="scope.row.levelName" v-if="scope.row.editName"></el-input>
<span v-else>{{ scope.row.levelName }}</span>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button @click="handleEdit(scope.row, scope.$index)" type="text">{{ editText }}</el-button>
<el-button type="text" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<span slot="footer" class="dialog-footer">
<el-button @click="editVisiable = false">取消</el-button>
</span>
</el-dialog>
<!-- 新增子分类 -->
<el-dialog :title="newName" :visible.sync="dialogVisible" width="400px" top="20%" :close-on-click-modal="false">
<div class="newtype">
<span class="name">子分类名称 </span>
<el-input style="width: 200px" placeholder="请输入分类名称" maxlength="10" v-model="typeName"> </el-input>
<span class="count">{{ typeName.length }}/10</span>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="newTag">添 加</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import Emitter from '@/mixins/emitter';
import { newHandTag, thirdHandTagList, deleteThirdTag, editThirdTag } from '@/request/api';
export default {
mixins: [Emitter],
name: 'second-type',
componentName: 'second-type',
props: {
list: Object,
tagName: String
},
data() {
return {
tagList: {},
editData: [],
dialogVisible: false,
editVisiable: false,
editText: '编辑',
typeName: '',
newName: '' // 新增子分类
};
},
watch: {
list: {
immediate: true,
handler(newval) {
this.tagList = newval;
}
}
},
methods: {
// 新增子分类
addNewType() {
this.newName = `${this.list.name} - 新增子分类`;
this.dialogVisible = !this.dialogVisible;
},
// 编辑子分类
handleEditType() {
this.newName = `${this.list.name} - 编辑子分类`;
this.editVisiable = !this.editVisiable;
this.getThirdTag();
},
// 请求三级手工标签
getThirdTag() {
const param = {
tagLevelGroupId: this.tagList.id,
requestProject: 'gic-member-tag-web'
};
thirdHandTagList(param)
.then(res => {
if (res.errorCode == 1) {
this.editData = res.result.map(el => ({
...el,
editName: false
}));
} else {
this.editData = [];
}
})
.catch(err => {
console.log(err);
});
},
handleEdit(list, i) {
if (!list.editName) {
list.editName = true;
this.editText = '确认';
} else {
/** 提交修改的标签名
* 不能为空
*/
this.editThird(list, i);
}
},
// 修改三级分类
editThird(list, i) {
if (!list.levelName) {
this.$message({
message: '子分类名称不能为空',
type: 'warning',
duration: 1000
});
return;
}
const param = {
tagLevelGroupId: list.tagLevelGroupId,
levelName: list.levelName,
requestProject: 'gic-member-tag-web'
};
editThirdTag(param)
.then(res => {
if (res.errorCode == 1) {
this.$message({
message: '修改成功',
type: 'success',
duration: 1000
});
list.editName = false;
this.editText = '编辑';
}
})
.catch(err => {
console.log(err);
});
},
// 删除子分类
handleDelete(list) {
console.log(list);
const param = {
tagLevelGroupId: list.tagLevelGroupId,
requestProject: 'gic-member-tag-web'
};
deleteThirdTag(param)
.then(res => {
if (res.errorCode == 1) {
this.$message({
message: '删除成功',
type: 'success',
duration: 1000
});
this.getThirdTag();
this.dispatch('member-tag', 'refersh-member-list');
this.editVisiable = false;
}
})
.catch(err => {
console.log(err);
});
},
/**
* 添加手工标签
*/
newTag() {
const params = {
levelName: this.typeName,
parentLevelGroupId: this.tagList.id,
requestProject: 'gic-member-tag-web'
};
// 子分类名称不能为空
if (!this.typeName) {
this.$message({
message: '子分类名称不能为空',
type: 'warning',
duration: 3000
});
return;
}
if (!this.addHandTagFlag) {
this.addHandTagFlag = true;
newHandTag(params)
.then(res => {
this.addHandTagFlag = false;
if (res.errorCode == 1) {
this.dispatch('member-tag', 'refersh-member-list');
this.typeName = '';
this.dialogVisible = false;
this.$message({
message: '添加成功',
type: 'success',
duration: 3000
});
}
})
.catch(err => {
this.addHandTagFlag = false;
console.log(err);
});
}
},
/**
* 处理二级分类
*/
handleSecondtag() {
this.dispatch('member-tag', 'handle-second-tag', this.tagList);
},
/**
* 处理三级标签
*/
handleThirdTag(list) {
this.dispatch('member-tag', 'handle-third-tag', list);
}
},
created() {
this.addHandTagFlag = false;
}
};
</script>
<style lang="scss" scoped>
.second {
position: relative;
line-height: 26px;
.name {
float: left;
width: 70px;
text-align: right;
line-height: 26px;
}
.manual-name {
display: block;
float: none;
text-align: left;
font-size: 14px;
font-weight: bold;
margin-left: 13px;
}
.third-list {
margin-left: 90px;
.tag-item {
display: inline-block;
vertical-align: middle;
line-height: 26px;
margin-right: 15px;
font-size: 14px;
color: #606266;
}
}
.manual-tag {
margin-left: 25px;
.arrow {
margin-right: 10px;
}
}
.arrow-line {
float: left;
width: 20px;
text-align: center;
line-height: 26px;
}
.icon-tag {
position: absolute;
right: 20px;
top: 10px;
color: #c0c4cc;
cursor: pointer;
}
}
.more {
line-height: 26px;
text-align: center;
cursor: pointer;
&:hover {
color: #1890ff;
}
}
.newtype {
position: relative;
.name {
margin-right: 10px;
}
.count {
position: absolute;
top: 4px;
right: 90px;
}
}
</style>
<template>
<!-- 具体标签 -->
<div class="tag-some-list">
<div>
<el-table :data="tableData" height="460">
<el-table-column label="标签名称" prop="tagName">
<template slot-scope="scope">
<span class="tag-name">{{ scope.row.tagName }}</span>
<el-tooltip class="item" effect="dark" content="添加标签" placement="bottom">
<i class="el-icon-plus icon-tag-name" @click="addTag(scope.row)"></i>
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="标签描述" prop="tagDescribe">
<template slot-scope="scope">
<div>{{ scope.row.tagDescribe ? scope.row.tagDescribe : '--' }}</div>
</template>
</el-table-column>
<el-table-column label="是否实时" prop="isActive">
<template slot-scope="scope">
<span> {{ scope.row.isActive == 1 ? '实时' : '非实时' }} </span>
</template>
</el-table-column>
<el-table-column label="操作" v-if="handTag == 1">
<template slot-scope="scope">
<el-button type="text" @click="editHandTag(scope.row)">编辑</el-button>
<el-button type="text" @click="deleteHandTag(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog title="添加标签" :visible.sync="dialogVisible" width="540" :before-close="handleClose">
<div class="dialog-box">
<p class="tag-name">{{ dialogData.tagName }}</p>
<p class="tag-desc">根据会员信息扩展字段统计而来</p>
<div class="tag-value">
<p>标签值设置</p>
<div class="tag-area"></div>
<p>时间范围</p>
<div class="time-area">
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in TimeOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</div>
</div>
<div class="tag-mode">
<p>营销方式</p>
<tag-mode></tag-mode>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import TagMode from '@/components/tag/tag-mode';
import { delThirdHandTag } from '@/request/api';
export default {
name: 'tag-container',
components: {
TagMode
},
props: {
data: {
type: Array,
default() {
return [];
}
},
handTag: {
type: Boolean,
default: false
},
groupId: String
},
data() {
return {
tableData: [],
dialogVisible: false,
dialogData: {},
TimeOptions: []
};
},
methods: {
// 添加标签 弹框里面操作
addTag(list) {
this.dialogData = list;
this.dialogVisible = !this.dialogVisible;
},
editHandTag(list) {
this.$router.push({
path: '/manualTagEdit',
query: { tagId: list.tagId }
});
},
deleteHandTag(list) {
this.$confirm('删除标签后,符合该标签值的会员对应标签值将同步删除。一旦删除将无法恢复,确认要删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(_ => {
const param = {
tagId: list.tagId,
requestProject: 'gic-member-tag-web'
};
delThirdHandTag(param)
.then(res => {
if (res.errorCode == 1) {
this.$message({
message: '删除成功',
type: 'success',
duration: 1000
});
this.$emit('deleteHandTag', this.groupId);
}
})
.catch(err => {
console.log(err);
});
})
.catch(err => {
console.log(err);
});
}
},
watch: {
data: {
immediate: true,
handler(newval) {
this.tableData = newval;
}
}
}
};
</script>
<style lang="scss" scoped>
.tag-some-list {
height: 510px;
margin: 0 20px;
overflow-y: auto;
.tag-name {
display: inline-block;
vertical-align: middle;
}
.icon-tag-name {
display: inline-block;
vertical-align: middle;
cursor: pointer;
}
.tag-desc {
font-size: 14px;
line-height: 26px;
color: #606266;
}
.tag-name {
font-size: 14px;
font-weight: bold;
}
.tag-value {
margin-top: 10px;
padding-top: 10px;
margin-bottom: 10px;
border-top: 1px solid #ebeef5;
}
}
</style>
<template>
<div class="list">
<span class="expends-txt" @click="handleChangeExpends" v-if="list.name !== '手工标签'">{{ expends }} </span>
<el-collapseTransition>
<div class="first-tag" v-show="expends === '收起'">
<div>
<i :class="[list.icon, iconLight]" class="iconfont menu-icon"></i>
<span class="tag-name" :class="[iconLight]" @click="handleFirstTag">{{ list.name }}</span>
</div>
<div class="second-tag">
<second-tag :list="item" :tag-name="list.name" v-for="(item, i) in list.children" :key="i"></second-tag>
</div>
</div>
</el-collapseTransition>
</div>
</template>
<script>
import Vue from 'vue';
import { CollapseTransition } from 'element-ui';
import SecondTag from './second-tag';
Vue.component(CollapseTransition.name, CollapseTransition);
export default {
name: 'tag-type',
components: {
SecondTag
},
props: {
// 会员标签的数据
tagList: Object
},
data() {
return {
list: {},
typeName: '',
editData: [],
expends: '收起'
};
},
computed: {
iconLight() {
return this.list.name === '手工标签' ? 'icon-tag-light' : '';
}
},
methods: {
handleChangeExpends() {
this.expends = this.expends === '收起' ? '展开' : '收起';
},
// 处理一级标签
handleFirstTag() {
// 手工标签和其他标签
this.$emit('handleFristTag', this.list);
}
},
watch: {
tagList: {
immediate: true,
handler(newval) {
this.list = newval;
}
}
}
};
</script>
<style lang="scss" scoped>
.list {
position: relative;
padding-top: 10px;
margin-top: 10px;
&:last-child {
border-bottom: none;
}
.expends-txt {
position: absolute;
right: 20px;
font-size: 14px;
color: #1890ff;
cursor: pointer;
}
.tag-name {
display: inline-block;
margin-left: 5px;
font-size: 14px;
font-weight: bold;
color: #303133;
cursor: pointer;
}
.second-tag {
padding: 10px 0px 10px 10px;
margin: 0 1px;
font-size: 14px;
color: #303133;
border-bottom: 1px solid #ebeef5;
cursor: pointer;
}
.icon-tag-light {
color: #1890ff;
font-size: 14px;
font-weight: bold;
}
}
.list:last-child .second-tag {
border-bottom: none;
}
</style>
......@@ -32,3 +32,7 @@
}*/
}
.el-popover {
min-width: 100px;
}
......@@ -90,6 +90,7 @@ input {
font-size: 100%;
font-weight: normal;
vertical-align: baseline;
box-sizing: border-box;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
......
......@@ -28,7 +28,7 @@ export function checkStatus(err) {
return false;
}
}else {
Message.error(err);
// Message.error(err);
return false;
}
}
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