Skip to content

H
haoban-3
Commit d2174156 by 陈羽
Options

update: update

parent ddad0dce
Showing with 731 additions and 175 deletions
index.html
......@@ -13,7 +13,7 @@
<meta charset="utf-8">
<link rel="shortcut icon" href="./favicon.ico" />
<title>好办管理平台</title>
<link rel="stylesheet" type="text/css" href="//web-1251519181.file.myqcloud.com/custom-element/custom-element.1.0.58.3.css" />
<link rel="stylesheet" type="text/css" href="//web-1251519181.file.myqcloud.com/custom-element/custom-element.1.0.58.4.css" />
</head>
......
src/api/memberTag.js
......@@ -14,3 +14,12 @@ export const tagList = params => postRequest('/haoban-app-customer-web/tag/tag-l
// 会员标签-同步记录
export const syncLog = params => postRequest('/haoban-app-customer-web/tag/sync-log', params);
// 会员标签-同步会员明细
export const syncMemberLog = params => postRequest('/haoban-app-customer-web/tag/sync-member-log', params);
// 会员标签-同步标签明细
export const syncTagLog = params => postRequest('/haoban-app-customer-web/tag/sync-tag-log', params);
// 会员标签-是否可以操作校验
export const checkSync = () => postRequest('/haoban-app-customer-web/tag/check-sync', {});
src/views/apps/customerApp/memberTagSet.vue
......@@ -19,11 +19,13 @@
<i class="el-alert__icon el-icon-warning color-2f54eb"></i>
<div class="el-alert__content">
<p class="el-alert__title color-303133 font-13">
温馨提示<br />
1. 下方的标签是从【GIC后台-会员标签-手工标签-导购标签】中获取而来，若不一致，可刷新页面获取GIC后台最新的导购标签库。<br />
2. 可选多个GIC导购标签批量同步至企微标签库。每天最多操作同步1次，每月最多4次，请酌情开启同步。<br />
3. 当尚有“同步中”状态的导购标签时，不可进行其他操作如勾选标签或关闭同步等。<br />
4. 同步完成后，系统会将所选GIC导购标签同步至企微标签库，且“会员”身上被打上的GIC导购标签结果也会同步至企微端，也即“会员”所对应的企微客户身上也会被打上对应的同步过去的导购标签。<br />
5.所选标签成功同步至企微侧后，标签名称会默认带有“GIC”前缀，便于和企微标签库中本身创建的标签区分；请勿在企微标签库中对GIC侧同步过去的标签进行修改。
5. 所选标签成功同步至企微侧后，标签名称会默认带有“GIC”前缀，便于和企微标签库中本身创建的标签区分；请勿在企微标签库中对GIC侧同步过去的标签进行修改。<br />
6. 在企微后台删除GIC同步过去的标签组，该标签在此处将自动关闭同步，企微客户身上所打的该标签组下的标签值也会自动清除。
</p>
</div>
</div>
......@@ -35,19 +37,23 @@
<div class="tag-content">
<div class="tag-content-top p-20">
<div class="slect-wrap">
<el-input v-model="search" placeholder="请输入内容" style="width: 223px" prefix-icon="el-icon-search" /><el-select class="w-168 m-l-10" v-model="conditionObj.statusFlag" placeholder="全部同步状态" clearable @change="changeCondition">
<el-option label="有效" value="1"></el-option>
<el-option label="失效" value="0"></el-option>
<el-input v-model="search" placeholder="请输入内容" style="width: 223px" prefix-icon="el-icon-search" clearable @change="searchList" />
<el-select class="w-160 m-l-10" placeholder="全部同步状态" v-model="syncStatus" @change="searchList">
<el-option label="未同步" :value="0"></el-option>
<el-option label="同步中" :value="1"></el-option>
<el-option label="同步完成" :value="2"></el-option>
<el-option label="同步失败" :value="3"></el-option>
<el-option label="全部同步状态" :value="-1"></el-option>
</el-select>
</div>
<div class="btn-group">
<el-button @click="$router.push('/syncHistory')">同步历史</el-button>
<el-button @click="handlePartSync" type="primary" :class="['sync-btn', isShake ? 'shake' : '']">待开启同步标签（ {{ tagIds.length }} ）</el-button>
<el-button @click="drawer = true" type="primary" :disabled="!canSync" :class="['sync-btn', isShake ? 'shake' : '']">待开启同步标签（ {{ tagIds.length }} ）</el-button><span v-if="canUseCount === 0" class="no-use-count">本月同步次数已用尽</span>
</div>
</div>
<div class="tag-content-bottom">
<el-table ref="table" :data="tableData" tooltip-effect="dark" row-key="tagId" style="width: 100%" @selection-change="handleSelectionChange" @row-click="rowCheckChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table v-loading="loading" ref="table" :data="tableData" tooltip-effect="dark" row-key="tagId" style="width: 100%" @selection-change="handleSelectionChange" @row-click="rowCheckChange">
<el-table-column type="selection" width="55" :selectable="checkSelectable"></el-table-column>
<el-table-column label="标签组" prop="tagName" show-overflow-tooltip>
<template slot-scope="{ row }">
<span>{{ row.tagName || '--' }}</span>
......@@ -66,16 +72,14 @@
</div>
</template>
</el-table-column>
<el-table-column label="同步状态" prop="qywxTagName">
<el-table-column label="同步状态" prop="syncFlag">
<template slot-scope="{ row }">
<span>{{ row.syncFlag || '--' }}</span>
<span :class="['state-point', syncStatusClass[row.syncFlag]]">{{ syncStatusOpt[row.syncFlag] }}</span>
</template>
</el-table-column>
<el-table-column label="操作" prop="syncFlag">
<el-table-column label="操作">
<template slot-scope="{ row }">
<p v-if="row.syncFlag == 1">
<el-button type="text" @click="changeSync(row)">关闭同步</el-button>
</p>
<p v-if="row.syncFlag == 2 && canSync"><el-button type="text" @click="changeSync(row)">关闭同步</el-button></p>
<p v-else></p>
</template>
</el-table-column>
......@@ -90,8 +94,31 @@
<div class="block common-wrap__page text-right m-t-24">
<dm-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </dm-pagination>
</div>
<el-drawer title="我是标题" :visible.sync="drawer" :direction="direction" :before-close="handleClose">
<span>我来啦!</span>
<el-drawer :modal="false" :title="`待开启同步标签（${tagIds.length}）`" :visible.sync="drawer" :direction="direction" :before-close="handleClose">
<div v-if="tagIds.length" class="tag-list">
<div class="header">
<el-button type="text" @click="clearSlected">全部清空</el-button>
</div>
<ul class="content">
<li class="content-item" v-for="item in tagIds" :key="item.tagId">
<div class="left">
<p class="title">{{ item.tagName }}</p>
<p class="describe">{{ item.tagDescribe || '- -' }}</p>
</div>
<i class="el-icon-error" @click="cancelSelect(item)"></i>
</li>
</ul>
<div class="btn-wrap" @click="checkSync">
<p class="title">确认开启同步</p>
<p class="tip">注：每月可使用{{ totalCount }}次，目前还剩{{ canUseCount }}次</p>
</div>
</div>
<div v-else class="empty">
<svg class="icon svg-icon" aria-hidden="true" style="width:72px;height:46px;margin-bottom:10px;">
<use xlink:href="#iconkongbiaoqian" size="46"></use>
</svg>
<p>请先选择需开启同步的标签组</p>
</div>
</el-drawer>
</div>
</div>
......@@ -100,7 +127,7 @@
</template>
<script>
import { tagCategoryList, tagList, syncSet, closeSync } from '@/api/memberTag';
import { tagCategoryList, tagList, closeSync, syncSet, checkSync } from '@/api/memberTag';
import errMsg from '@/common/js/error';
export default {
name: 'app-detail',
......@@ -127,6 +154,7 @@ export default {
mounted() {
this.brandId && this.getTagCategoryList();
this.brandId && this.getTableList();
this.checkSyncCount();
this.$emit('showTab', '15');
},
data() {
......@@ -137,73 +165,67 @@ export default {
tableList: [],
tagIds: [],
search: '',
syncStatus: -1,
wxEnterpriseId: JSON.parse(localStorage.getItem('userInfos')).wxEnterpriseId,
pageSize: 20,
currentPage: 1,
total: 0,
drawer: false,
isShake: false
isShake: false,
loading: false,
selectIds: {},
canSync: true, // 查询是否有同步中队列 true可同步 flase不可以
totalCount: 4, // 总同步次数
canUseCount: 0, // 剩余同步次数
checkFirst: '',
syncStatusOpt: { 0: '未同步', 1: '同步中', 2: '同步完成 ', 3: '同步失败 ' },
syncStatusClass: { 0: 'state-point-default', 1: 'state-point-loading-scale', 2: 'state-point-success', 3: 'state-point-error' }
};
},
methods: {
checkSyncCount() {
checkSync().then(res => {
if (res.data.result) {
this.canSync = res.data.result.canSync;
this.totalCount = res.data.result.totalCount;
this.canUseCount = res.data.result.canUseCount;
}
});
},
checkSelectable(row) {
return !this.canSync ? false : this.canUseCount === 0 ? false : row.tagItems.length && row.syncFlag === 0 ? true : false;
2;
},
getTagCategoryList() {
tagCategoryList({ enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000' }).then(res => {
tagCategoryList({ enterpriseId: this.brandId }).then(res => {
this.tagCategory = res.data.result;
});
},
searchList() {
this.currentPage = 1;
this.getTableList();
},
getTableList() {
this.loading = true;
let params = {
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b',
wxEnterpriseId: this.wxEnterpriseId,
enterpriseId: this.brandId,
classifyId: this.tagCategoryId,
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000',
pageSize: this.pageSize,
pageNum: this.currentPage
// search: this.search
// enterpriseId: this.brandId,
// classifyId: this.tagCategoryId,
// wxEnterpriseId: this.wxEnterpriseId
pageNum: this.currentPage,
syncStatus: this.syncStatus,
search: this.search
};
tagList(params).then(res => {
this.total = res.data.result.totalCount;
// this.tableData = this.tableData.map(el => {
// this.$set(el, 'popoverFlag', false);
// this.$set(el, 'expend', false);
// return el;
// });
res.data.result.result.map(el => {
el.popoverFlag = false;
res.data.result.result.map((el, index) => {
el.expend = false;
el.index = index;
});
this.tableData = res.data.result.result;
});
},
// 开启同步接口
openSync(type, ids) {
let id;
let that = this;
id = ids.toString();
let params = {
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b',
tagIds: id,
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000'
};
syncSet(params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (type == 'part') {
if (that.tagIds.some(el => !el.tagItems || !el.tagItems.length)) that.$message.success('批量同步完成，没有标签值的标签将不会被同步');
else that.$message.success('批量同步完成');
}
that.getTableList();
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
this.loading = false;
this.$nextTick(() => {
this.chengePageToggleSelect();
});
});
},
......@@ -211,12 +233,9 @@ export default {
closeSync(row) {
let that = this;
let params = {
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b',
memberTagId: row.tagId,
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000'
// enterpriseId: this.brandId,
// memberTagId: id,
// wxEnterpriseId: this.wxEnterpriseId
enterpriseId: this.brandId,
wxEnterpriseId: this.wxEnterpriseId
};
closeSync(params)
.then(res => {
......@@ -241,9 +260,17 @@ export default {
},
// 改变同步状态
changeSync(row) {
row.popoverFlag = false;
if (!row.tagItems || !row.tagItems.length) return this.$message.warning('该标签没有标签值，无法同步');
this.$confirm('<div>确认关闭同步？</div><div>此为敏感操作！关闭同步后，企微标签库中该标签将会被立即删除， “企微好友”身上所被打的该标签也会被清除，请再次确认您的操作！</div>', '', {
customClass: 'top-icon',
closeOnClickModal: false,
dangerouslyUseHTMLString: true,
showClose: false,
type: 'warning'
})
.then(() => {
this.closeSync(row);
})
.catch(() => {});
},
handleSizeChange(val) {
this.pageSize = val;
......@@ -260,21 +287,80 @@ export default {
this.getTableList();
},
// 选中的row
handleSelectionChange(row) {
handleSelectionChange(rows) {
this.isShake = true;
this.tagIds = row;
let list = [];
rows.forEach(row => {
if (this.selectIds[row.tagId] === undefined) {
this.selectIds[row.tagId] = row;
list.push(row);
}
});
this.tagIds = this.tagIds.concat(list);
setTimeout(() => (this.isShake = false), 300);
},
rowCheckChange(row, column, event) {
this.$refs.table.toggleRowSelection(row);
if (this.canSync && row.syncFlag === 0) this.$refs.table.toggleRowSelection(row);
},
cancelSelect(row) {
this.$refs.table.toggleRowSelection(this.tableData[row.index]);
delete this.selectIds[row.tagId];
this.tagIds.splice(
this.tagIds.findIndex(item => item.tagId === row.tagId),
1
);
},
chengePageToggleSelect() {
Object.keys(this.selectIds).forEach((key, index) => {
if (this.selectIds[key].tagId === this.tableData[this.selectIds[key].index].tagId) {
this.$nextTick(() => {
this.$refs.table.toggleRowSelection(this.tableData[this.selectIds[key].index], true);
});
}
});
},
checkSync() {
this.$confirm('<div>确认开启同步？</div><div>由于数据量可能过大以及企微限制，系统将于晚上统一执行同步过程，最早可于次日看到同步结果，请耐心等待。</div>', '', {
customClass: 'top-icon',
closeOnClickModal: false,
dangerouslyUseHTMLString: true,
showClose: false,
type: 'warning'
})
.then(() => {
this.handlePartSync();
})
.catch(() => {});
this.drawer = false;
},
// 处理批量同步
handlePartSync() {
if (!this.tagIds.length) return this.$message.warning('请先选择需要同步的标签');
this.tagIds = this.tagIds.filter(el => !el.syncFlag); // 过滤掉已经同步的标签
if (!this.tagIds.length) return this.$message.warning('请选择未同步过的标签');
let ids = this.tagIds.map(el => el.tagId);
this.openSync('part', ids);
let ids = this.tagIds.map(el => el.tagId).toString();
let params = {
wxEnterpriseId: this.wxEnterpriseId,
enterpriseId: this.brandId,
tagIds: ids
};
syncSet(params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
this.$message.success('批量同步完成');
this.getTableList();
} else {
errMsg.errorMsg(resData);
}
})
.catch(function(error) {
this.$message.error({
duration: 1000,
message: error.message
});
});
},
clearSlected() {
this.tagIds = [];
this.$refs.table.clearSelection();
}
},
watch: {
......@@ -282,6 +368,7 @@ export default {
brandId: function(newData) {
this.getTagCategoryList();
this.getTableList();
this.checkSyncCount();
}
}
};
......@@ -311,6 +398,9 @@ li {
font-family: PingFangSC-Regular, PingFang SC;
}
}
.w-160 {
width: 160px;
}
.use-num {
font-family: PingFang-SC-Bold, PingFang-SC;
font-weight: bold;
......@@ -385,10 +475,16 @@ li {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #e4e7ed;
.no-use-count {
margin-left: 10px;
font-size: 12px;
font-weight: 400;
color: #909399;
line-height: 17px;
}
}
.tag-content-bottom {
padding: 20px 20px 14px;
padding: 0 20px 14px;
.tag-val {
max-width: 133px;
padding: 2px 12px;
......@@ -419,6 +515,167 @@ li {
}
}
}
/deep/.el-drawer {
width: 358px !important;
height: 100vh;
}
/deep/.el-drawer__container {
.el-drawer__header {
height: 46px;
padding: 0 22px 0 20px;
margin-bottom: 0;
line-height: 46px;
background: #f5f7fa;
span {
font-size: 16px;
font-weight: 600;
color: #47494c;
line-height: 22px;
}
.el-icon-close {
font-size: 13px;
color: #c0c4cc;
}
}
.tag-list {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
width: 100%;
height: calc(100vh - 46px);
.header {
display: flex;
justify-content: flex-end;
width: 100%;
height: 48px;
padding: 19px 20px 9px 0;
border-bottom: 1px solid #e4e7ed;
box-sizing: border-box;
.el-button {
height: 20px;
span {
display: block;
font-size: 14px;
font-weight: 400;
color: #365fee;
line-height: 20px;
}
}
}
.content {
height: calc(100vh - 152px);
padding: 13px 19px 0;
overflow: scroll;
.content-item {
display: flex;
justify-content: flex-start;
align-items: center;
width: 100%;
padding: 13px 0;
transition: 0.4s;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
.left {
.title {
width: 315px;
margin-bottom: 7px;
font-size: 14px;
font-weight: 600;
color: #3e4042;
line-height: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.describe {
width: 315px;
font-size: 12px;
font-weight: 400;
color: #a5a7ad;
line-height: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.el-icon-error {
margin-left: 40px;
font-size: 20px;
color: #e2e4e8;
display: none;
transition: all 0.5s;
cursor: pointer;
&:hover {
color: #c4c6cf;
}
}
&:hover {
transform: translateX(-5px);
.title,
.describe {
width: 252px;
}
.el-icon-error {
display: block;
}
}
}
}
.btn-wrap {
width: 100%;
height: 58px;
padding-top: 9px;
text-align: center;
background: #2f54eb;
box-sizing: border-box;
cursor: pointer;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
.title {
font-size: 16px;
font-weight: 600;
color: #ffffff;
line-height: 22px;
}
.tip {
font-size: 12px;
font-weight: 400;
color: rgba(255, 255, 255, 0.65);
line-height: 17px;
}
}
}
.empty {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
height: 100%;
margin-top: 212px;
p {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #66686b;
line-height: 20px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
}
}
}
.limit-wrap {
width: 95%;
......
src/views/apps/customerApp/syncHistory.vue
<template>
<div class="app-detail-wrap history p-20">
<div class="top m-b-20">
<el-alert type="info" show-icon :closable="false">
<span class="alert-info">
1. 同步历史指通过GIC修改并同步企微标签库，或者企微标签库修改同步的GIC标签库导致的标签覆盖（GIC标签库覆盖企微标签）<br />
2. 仅保存近一年同步历史
</span>
</el-alert>
<div role="alert" class="el-alert el-alert--info flex flex-align-start ">
<i class="el-alert__icon el-icon-warning color-2f54eb"></i>
<div class="el-alert__content">
<p class="el-alert__title color-303133 font-13">
1. 同步日志指通过GIC修改并同步企微标签库，或者企微标签库修改同步的GIC标签库导致的标签覆盖（GIC标签库覆盖企微标签）<br />
2. 仅保存近一年同步日志<br />
3. 标签同步明细包含同步至企微标签库的明细，同步完成会更新列表中的【更新时间】<br />
4. 会员同步失败明细包含企微会员标签同步失败的明细
</p>
</div>
</div>
</div>
<div class="search-group m-b-20">
<el-input v-model="searchTxt" placeholder="请输入标签组名称" style="width: 316px" prefix-icon="el-icon-search" />
<el-select v-model="statusType" placeholder="全部状态" style="width: 160px">
<el-option :value="1">成功</el-option>
<el-option :value="0">失败</el-option>
<el-select v-model="taskType" placeholder="全部事件类型" style="width: 160px" @change="reFresh">
<el-option :value="0" label="开启同步"></el-option>
<el-option :value="1" label="关闭同步"></el-option>
<el-option :value="-1" label="全部事件类型"></el-option>
</el-select>
</div>
<div class="content">
<el-table ref="table" :data="tableAllData.data" tooltip-effect="dark" style="width: 100%">
<el-table-column label="标签组" prop="tagGroup"></el-table-column>
<el-table-column label="更新时间" prop="updateTime"></el-table-column>
<el-table-column label="变更项" prop="changeItem"></el-table-column>
<el-table-column label="变更内容" prop="changeContent"></el-table-column>
<el-table-column label="涉及更新项" prop="updateItem"></el-table-column>
<el-table-column label="状态" prop="status">
<el-table v-loading="loading" ref="table" :data="tableData" tooltip-effect="dark" style="width: 100%">
<el-table-column label="事件类型" prop="taskType" min-width="120">
<template slot-scope="{ row }">{{ row.taskType | taskType }}</template>
</el-table-column>
<el-table-column label="更新时间" prop="updateTime" min-width="110">
<template slot-scope="{ row }">
<div class="line-18">{{ row.updateTime | timeStampToYmd }}</div>
<div class="line-18">{{ row.updateTime | timeStampToHms }}</div>
</template>
</el-table-column>
<el-table-column label="操作人" prop="optStaffName" width="150"></el-table-column>
<el-table-column label="涉及更新项" prop="taskContent" min-width="180"></el-table-column>
<el-table-column label="状态" prop="statusFlag" width="120">
<template slot-scope="{ row }">
<div class="status-class">
<span :class="[row.status == 0 ? 'status-error' : 'status-success']"></span>
......@@ -30,111 +41,342 @@
</div>
</template>
</el-table-column>
<el-table-column label="操作人" prop="user"></el-table-column>
<el-table-column label="原因" prop="reason"></el-table-column>
<el-table-column label="操作">
<el-table-column label="操作" width="280">
<template slot-scope="{ row }">
<el-button type="text" @click="failDialog = true">{{ row.status == 0 && '同步失败明细' }}</el-button>
<el-button type="text" @click="tagLogShow(row)">标签同步明细</el-button>
<el-button type="text" @click="memberLogShow(row)">会员同步失败明细</el-button>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24">
<dm-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="tableAllData.currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="tableAllData.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="tableAllData.total"> </dm-pagination>
<dm-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageNum" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </dm-pagination>
</div>
</div>
<!--弹窗html-->
<el-dialog :visible.sync="failDialog" title="同步失败明细" width="500px" custom-class="sync-fail">
<el-dialog :visible.sync="failDialog" :close-on-click-modal="false" title="同步失败明细" width="500px" custom-class="sync-fail">
<span>温馨提示：仅展示同步失败的会员</span>
<el-table :data="dialogData.data" class="m-b-20 m-t-20">
<el-table :data="memberSyncData" class="m-b-20 m-t-20" v-loading="memberLoading">
<el-table-column prop="name" label="会员姓名"></el-table-column>
<el-table-column prop="failReason" label="会员同步失败原因"></el-table-column>
</el-table>
<el-pagination small layout="prev, pager, next" style="margin: 0 0 10px 0;text-align:right" :total="dialogData.total" :current-page="dialogData.currentPage" :page-size="5" @current-change="dialogCurrentChange" />
<el-pagination small layout="prev, pager, next" style="margin: 0 0 10px 0;text-align:right" :total="memberSyncTotal" :current-page="memberSyncPageNum" :page-size="5" @current-change="memberSyncCurrentChange" />
<el-button type="primary" class="close-btn" @click="failDialog = false">关闭</el-button>
</el-dialog>
<el-dialog :visible.sync="tagDialog" :close-on-click-modal="false" title="标签同步明细" width="500px" custom-class="sync-fail">
<el-table :data="tagSyncData" class="m-b-20 m-t-20" v-loading="tagLoading" max-height="304">
<el-table-column prop="tagName" label="标签组"></el-table-column>
<el-table-column
prop="statusFlag"
label="同步状态"
:filters="[
{ text: '删除', value: 0 },
{ text: '预处理', value: 1 },
{ text: '成功', value: 2 },
{ text: '失败', value: 3 }
]"
:filter-method="filterHandler"
>
<template slot-scope="{ row }">
<el-tooltip v-if="row.statusFlag === 3" open-delay="200" :content="row.reason" placement="top">
<span class="tooltip-icon" style="cursor:default">{{ row.statusFlag | tagStatus }}</span>
</el-tooltip>
<span v-else class="tooltip-icon" style="cursor:default">{{ row.statusFlag | tagStatus }}</span>
</template>
</el-table-column>
</el-table>
<!-- <el-pagination small layout="prev, pager, next" style="margin: 0 0 10px 0;text-align:right" :total="tagSyncTotal" :current-page="tagSyncPageNum" :page-size="5" @current-change="tagSyncCurrentChange" /> -->
<el-button type="primary" class="close-btn" @click="tagDialog = false">关闭</el-button>
</el-dialog>
</div>
</template>
<script>
import { syncLog, syncMemberLog, syncTagLog } from '@/api/memberTag';
export default {
name: 'sync-history',
props: {
brandId: {
type: String,
default() {
return '';
}
}
},
data() {
return {
tableAllData: {
data: [
{
tagGroup: '蓝橙子',
updateTime: '2019-05-20 12:00:00',
changeItem: '标签组一',
changeContent: '标签组',
updateItem: '标签组',
status: 0,
user: '赖昌星',
reason: '好办后台同步'
}
],
tableData: [],
pageSize: 20,
pageNum: 1,
total: 0,
currentPage: 1,
pageSize: 20
memberSyncParam: {},
memberSyncData: [],
memberSyncTotal: 0,
memberSyncPageNum: 1,
tagSyncParam: {},
tagSyncData: [],
tagSyncSearch: '',
wxEnterpriseId: JSON.parse(localStorage.getItem('userInfos')).wxEnterpriseId,
taskType: -1,
loading: false,
failDialog: false, // 同步失败明细弹窗
memberLoading: false,
tagLoading: false,
tagDialog: false
};
},
dialogData: {
data: [
{
name: '刘晨曦',
failReason: '会员不存在'
methods: {
getTalbeList() {
this.loading = true;
let params = {
wxEnterpriseId: this.wxEnterpriseId,
enterpriseId: this.brandId,
pageSize: this.pageSize,
pageNum: this.pageNum,
taskType: this.taskType
};
syncLog(params).then(res => {
this.total = res.data.result.totalCount;
this.tableData = res.data.result.result;
this.loading = false;
});
},
reFresh(v) {
this.pageNum = 1;
this.getTalbeList();
},
handleSizeChange(v) {
this.pageSize = v;
this.pageNum = 1;
this.getTalbeList();
},
handleCurrentChange(v) {
this.pageNum = v;
this.getTalbeList();
},
memberLogShow(item) {
this.memberSyncParam = item;
this.failDialog = true;
this.getMemberTable();
},
// 获取弹窗表格数据
getMemberTable() {
this.memberLoading = true;
let params = {
wxEnterpriseId: this.wxEnterpriseId,
enterpriseId: this.brandId,
pageSize: 5,
pageNum: this.memberSyncPageNum,
taskId: this.memberSyncParam.taskId
};
syncMemberLog(params).then(res => {
this.memberSyncTotal = res.data.result.totalCount;
this.memberSyncData = res.data.result.result;
this.memberSyncData = [];
this.memberLoading = false;
});
},
// 弹窗表格页数改变
memberSyncCurrentChange(v) {
this.memberSyncPageNum = v;
this.getMemberTable();
},
tagLogShow(item) {
this.tagSyncParam = item;
this.tagDialog = true;
this.getTagTable();
},
getTagTable() {
this.tagLoading = true;
let params = {
wxEnterpriseId: this.wxEnterpriseId,
enterpriseId: this.brandId,
taskId: this.tagSyncParam.taskId,
search: this.tagSyncSearch
};
syncTagLog(params).then(res => {
// this.tagSyncData = res.data.result;
this.tagSyncData = [
{
name: '刘晨曦',
failReason: '会员不存在'
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
{
name: '刘晨曦',
failReason: '会员不存在'
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
{
name: '刘晨曦',
failReason: '会员不存在'
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
{
name: '刘晨曦',
failReason: '会员不存在'
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
{
name: '刘晨曦',
failReason: '会员不存在'
}
],
total: 6,
currentPage: 1
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
searchTxt: '',
statusType: 0,
failDialog: false // 同步失败明细弹窗
};
{
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
methods: {
// 获取表格数据
getTalbeList() {
console.log('1');
{
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 3,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
// 处理表格change
handleSizeChange() {
console.log('change size');
{
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 0,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
handleCurrentChange() {
console.log('change page');
{
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 2,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
},
// 获取弹窗表格数据
getDialogTable() {
console.log('1');
{
createTime: 1627456838000,
enterpriseId: 'ff808081593917d90159398ec6340012',
reason: '企业微信:不合法的标签名字(40071)',
relationId: 'a475603305704860a3928b436a3da484',
relationType: 0,
statusFlag: 1,
tagName: '好办',
taskDetailId: '984cfa39ee254fdcad8edcbd0516191b',
taskId: '8bfd1d7c5bd44b1488b10d51fa3d5b4f',
updateTime: 1627456846000,
wxEnterpriseId: 'ca66a01b79474c40b3e7c7f93daf1a3b'
}
];
this.tagLoading = false;
});
},
// 弹窗表格页数改变
dialogCurrentChange() {
console.log('1');
filterHandler(value, row, column) {
const property = column['property'];
return row[property] === value;
}
},
mounted() {
this.getTalbeList();
this.$emit('showTab', '15', '151');
},
filters: {
taskType(v) {
switch (v) {
case 0:
return '开启同步';
break;
case 1:
return '关闭同步';
break;
default:
break;
}
},
tagStatus(v) {
// 0删除 1预处理 2成功 3失败
switch (v) {
case 0:
return '删除 ';
break;
case 1:
return '预处理';
break;
case 2:
return '成功';
break;
case 3:
return '失败';
break;
default:
break;
}
}
},
watch: {
// 仅第一次赋值brandId调用
brandId: function(newData) {
this.getTalbeList();
}
}
};
</script>
......@@ -168,19 +410,32 @@ span,
padding-bottom: 14px;
.top {
width: 75%;
border-bottom: 1px solid #e4e7ed;
/deep/ .el-alert__icon {
font-size: 14px;
width: auto !important;
margin-top: -20px;
}
.alert-info {
.el-alert--info {
align-items: flex-start;
width: 815px;
padding: 5px 16px 5px 17px;
margin-right: 17px;
font-size: 13px;
font-weight: 400;
color: #303133;
background: #f0f5ff;
border-radius: 2px;
border: 1px solid #85a5ff;
-webkit-box-align: flex-start;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
.el-alert__content {
padding-left: 0;
.el-alert__title {
line-height: 22px;
}
}
.el-alert__icon {
margin-top: 5px;
margin-right: 9px;
font-size: 12px;
color: #2f54eb;
}
}
}
.content {
.status-class {
display: flex;
......
static/font/demo_index.html
......@@ -2,10 +2,10 @@
<html>
<head>
<meta charset="utf-8" />
<meta charset="utf-8"/>
<title>iconfont Demo</title>
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon" />
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg" />
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
......@@ -59,6 +59,12 @@
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe64c;</span>
<div class="name">空标签</div>
<div class="code-name">&amp;#xe64c;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe654;</span>
<div class="name">订单_评价</div>
<div class="code-name">&amp;#xe654;</div>
......@@ -496,9 +502,9 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1626682155511') format('woff2'),
url('iconfont.woff?t=1626682155511') format('woff'),
url('iconfont.ttf?t=1626682155511') format('truetype');
src: url('iconfont.woff2?t=1627375504150') format('woff2'),
url('iconfont.woff?t=1627375504150') format('woff'),
url('iconfont.ttf?t=1627375504150') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
......@@ -525,6 +531,15 @@
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont iconkongbiaoqian"></span>
<div class="name">
空标签
</div>
<div class="code-name">.iconkongbiaoqian
</div>
</li>
<li class="dib">
<span class="icon iconfont icondingdan_pingjia"></span>
<div class="name">
订单_评价
......@@ -1182,6 +1197,14 @@
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#iconkongbiaoqian"></use>
</svg>
<div class="name">空标签</div>
<div class="code-name">#iconkongbiaoqian</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icondingdan_pingjia"></use>
</svg>
<div class="name">订单_评价</div>
......
static/font/iconfont.css
@font-face {
font-family: "iconfont";
/* Project id 1628375 */
src: url('iconfont.woff2?t=1626682155511') format('woff2'), url('iconfont.woff?t=1626682155511') format('woff'), url('iconfont.ttf?t=1626682155511') format('truetype');
font-family: "iconfont"; /* Project id 1628375 */
src: url('iconfont.woff2?t=1627375504150') format('woff2'),
url('iconfont.woff?t=1627375504150') format('woff'),
url('iconfont.ttf?t=1627375504150') format('truetype');
}
.iconfont {
......@@ -12,6 +13,10 @@
-moz-osx-font-smoothing: grayscale;
}
.iconkongbiaoqian:before {
content: "\e64c";
}
.icondingdan_pingjia:before {
content: "\e654";
}
......
static/font/iconfont.js
This source diff could not be displayed because it is too large. You can view the blob instead.
static/font/iconfont.json
......@@ -6,6 +6,13 @@
"description": "",
"glyphs": [
{
"icon_id": "23164302",
"name": "空标签",
"font_class": "kongbiaoqian",
"unicode": "e64c",
"unicode_decimal": 58956
},
{
"icon_id": "8651336",
"name": "订单_评价",
"font_class": "dingdan_pingjia",
......
static/font/iconfont.ttf
No preview for this file type
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