Commit 9dbcde0b by Jings

Merge remote-tracking branch 'origin/feature/九月迭代' into dev

parents b0df2600 2816e2ef
<!--
* @Descripttion : 当前组件信息
* @Author : 无尘
* @Date : 2020-02-13 16:13:59
* @LastEditors: Drama
* @LastEditTime: 2022-09-15 13:33:03
* @FilePath: /haoban-3/src/components/company/add-relatecopy.vue
-->
<!--
<add-relate :departObj="departObj" @refreshData="refreshData"></add-relate>
import addRelate from '@/components/company/add-relate.vue';
-->
<template>
<el-dialog custom-class="add-remote-dialog" width="600px" title="新增关联" :visible.sync="departVisible" append-to-body :before-close="handleClose">
<el-form :model="partForm" label-width="95px" :rules="rules" ref="partForm" class="dialog-form">
<!-- <el-form-item label="" prop="salerName">
<el-popover placement="bottom" title="" width="457" v-model="visible">
<div class="daily-store-select">
<div class="select-search">
<el-input placeholder="请输入code/手机号搜索进行账号关联" clearable maxlength="40" v-model="searchSelect" style="width: 100%" prefix-icon="el-icon-search" @keyup.native="(value) => toInput(value, searchSelect)" @clear="clearSearch"> </el-input>
</div>
<div class="el-scrollbar define-search-select">
<div class="el-select-dropdown__wrap el-scrollbar__wrap" style="margin-bottom: -5px; margin-right: -5px">
<ul class="el-scrollbar__view el-select-dropdown__list">
<li :class="['el-select-dropdown__item', item.clerkId == selectId ? 'selected hover' : '']" v-for="item in storeData" :key="item.clerkId" @click="checkStore(item)">
<div class="flex flex-space-between">
<div style="line-height: 26px">
<span class="block text-ellipsis">{{ item.clerkName }}{{ item.clerkCode }}</span>
<div class="text-ellipsis font-12 color-909399">{{ item.storeName || '--' }}</div>
</div>
<span v-if="item.clerkId == selectId" class="font-12 color-2f54eb el-icon-check flex-align-center" style="display: flex"></span>
<span v-if="item.relationStatus == 1" class="font-12 color-909399">已添加不能关联</span><el-button v-if="item.relationStatus == 1" class="m-l-10" type="text" @click.stop="toUnbind(item)">解绑</el-button>
</div>
</li>
<li v-if="!storeData.length" class="text-center"><span>暂无数据</span></li>
</ul>
</div>
</div>
</div>
<div class="show-select-num cursor-pointer w-558" slot="reference">
<div>{{ partForm.salerName }} <span v-if="!partForm.salerName" class="font-14 color-c0c4cc">请输入code/手机号搜索进行账号关联</span></div>
</div>
</el-popover>
</el-form-item> -->
<el-form-item label="关联角色" prop="glrole">
<el-radio-group v-model="partForm.glrole">
<el-radio :label="1">导购</el-radio>
<el-radio :label="2">区经/督导</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="关联账号" prop="clerkId" class="test-wrap">
<dm-select-scroller v-model="partForm.clerkId" placeholder="请选择" :data="brandList" :props="props" :width="352" @load="load" @remote-search="remoteSearch" :total-count="totalCount" :clearable="true"></dm-select-scroller>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="btn-class" @click="cancel">取消</el-button>
<el-button class="btn-class" type="primary" :loading="loading" @click="submitForm('partForm')">确定</el-button>
</div>
</el-dialog>
</template>
<script>
import limitInput from '@/components/limit-input.vue';
import { getRequest, postRequest } from '@/api/api';
import errMsg from '@/common/js/error';
import showMsg from '@/common/js/showmsg';
import { _debounce } from '@/common/js/public';
export default {
name: 'add-relate',
components: {
limitInput
},
props: {
departObj: {
type: [Object, Array],
default() {
return {};
}
}
},
data() {
return {
partForm: {
salerName: '',
glrole: 1, // TODO: 关联角色 导购 区经/督导
clerkId: ''
},
brandParams: {
pageNum: 1,
pageSize: 10,
search: ''
}, // TODO: 远程搜索参数
rules: {
salerName: [
{
required: true,
message: '请选择导购',
trigger: 'change'
}
]
},
searchSelect: '',
storeData: [],
selectId: '',
departVisible: true,
loading: false,
visible: false,
brandList: [], // TODO: 远程搜索数组
totalCount: 0,
props: {
label: 'clerkName',
value: 'clerkId',
childLabel: 'storeName'
}
};
},
methods: {
// TODO: 加载更多
load() {
console.log('load');
this.brandParams.pageNum++;
this.getRemoteAccountList();
},
// TODO: 远程搜索方法
remoteSearch(query) {
this.brandParams.search = query;
this.brandParams.pageNum = 1;
this.getRemoteAccountList();
},
// TODO: 获取远程关联账号数据
getRemoteAccountList(test) {
if (this.brandParams.pageNum == 1) {
this.brandList = [];
}
// if (!this.brandParams.search) return;
// getRequest('/', { ...this.brandParams }).then(res => {
// // TODO: 逻辑确认
// });
console.log('zoule');
console.log(this.brandParams.search, 'search--');
console.log(this.partForm.clerkId, 'id--');
let testArray = [
{
clerkName: 'admin',
clerkCode: '1',
clerkId: '8e414a85362c436dad66385eadd2f318',
enterpriseName: null,
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c0000',
storeId: 'ff808081732e0c720173325c1cf5001c',
storeName: '8300105乌鲁木齐新市汇嘉时代百货Yatlas哈哈哈哈哈哈哈哈哈哈',
relationStatus: 0,
staffId: null,
staffName: null
},
{
clerkName: 'admin222',
clerkCode: '1333',
clerkId: '8e414a85362c436dad66385eadd2f31822',
enterpriseName: null,
enterpriseId: 'ff8080815dacd3a2015dacd3ef5c000033',
storeId: 'ff808081732e0c720173325c1cf5001c44',
storeName: '号码摩托',
relationStatus: 0,
staffId: null,
staffName: null
}
];
this.brandList = testArray;
// getRequest('/haoban-manage3-web/search-clerk-relation', {
// search: test ? test : this.brandParams.search
// })
// .then(res => {
// let resData = res.data;
// if (resData.errorCode == 1) {
// this.brandList = resData.result || [];
// return;
// }
// errMsg.errorMsg(resData);
// })
// .catch(function(error) {
// this.$message.error({
// duration: 1000,
// message: error.message
// });
// });
},
/**
* 显示pop
*/
showPop() {
const that = this;
that.visible = true;
},
/**
* 解绑
*/
toUnbind(row) {
const that = this;
that
.$confirm(`导购账号(${row.clerkName})已绑定${row.staffName},是否确认解绑?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
that.visible = true;
that.postUnbind(row);
})
.catch(() => {
that.visible = true;
});
},
postUnbind(row) {
const that = this;
let para = {
staffId: row.staffId,
clerkId: row.clerkId
};
postRequest('/haoban-manage3-web/del-clerk-relation', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
showMsg.showmsg('解绑成功', 'success');
that.getData();
that.visible = true;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 选择
*/
checkStore(item) {
const that = this;
if (item.relationStatus == 1) {
return false;
}
that.selectId = item.clerkId;
that.partForm.salerName = item.clerkName;
that.$set(that.partForm, 'salerName', item.clerkName);
that.$forceUpdate();
that.$nextTick(() => {
that.$refs['partForm'].validate(valid => {
if (valid) {
return false;
}
});
});
},
/**
* 输入
*/
toInput: _debounce(function(e, value) {
const that = this;
if (that.searchSelect.trim() == '') {
return false;
}
that.getData();
}, 500),
// 搜索清除
clearSearch() {
const that = this;
that.storeData = [];
},
/**
* 关闭弹窗
*/
handleClose(done) {
const that = this;
that.$refs['partForm'].resetFields();
that.$emit('refreshData', 'close');
done();
},
cancel() {
const that = this;
that.$refs['partForm'].resetFields();
that.$emit('refreshData', 'close');
},
/**
* 确定保存
*/
submitForm: _debounce(function(form) {
const that = this;
that.loading = true;
that.$refs[form].validate(valid => {
if (valid) {
that.postAdd();
} else {
that.loading = false;
return false;
}
});
}, 300),
postAdd() {
const that = this;
let params = {
staffId: that.departObj.staffId,
// clerkId: that.selectId
clerkId: that.partForm.clerkId
};
console.log(params, 'cscsc');
that.loading = false;
return;
postRequest('/haoban-manage3-web/add-clerk-relation', params)
.then(res => {
let resData = res.data;
that.loading = false;
if (resData.errorCode == 1) {
showMsg.showmsg('添加成功', 'success');
that.$emit('refreshData', that.partForm);
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.loading = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
getData() {
const that = this;
let para = {
search: that.searchSelect
};
getRequest('/haoban-manage3-web/search-clerk-relation', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.storeData = resData.result || [];
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
watch: {
departObj(newData) {
// const that = this;
if (Object.keys(newData).length) {
// that.partForm = newData;
}
}
},
mounted() {
// const that = this;
// that.getData();
/* if (Object.keys(that.departObj).length) {
that.partForm = that.departObj;
} */
// TODO: 初始化加载
// this.getRemoteAccountList();
}
};
</script>
<style lang="less" scoped>
/deep/ .add-remote-dialog {
// .el-dialog {
// height: 221px;
// }
.el-dialog__header {
padding: 24px 24px 0 24px;
.el-dialog__title {
line-height: 25px;
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
color: #37383a;
}
}
.el-dialog__body {
padding: 30px;
}
}
// .damolish .el-select-dropdown .el-select-dropdown__empty {
// width: 352px;
// }
// .damolish .el-select-dropdown .el-select-dropdown__item {
// height: 45px;
// line-height: 45px;
// }
.w-95 {
width: 95px;
}
.w-352 {
width: 352px;
}
.m-l-30 {
margin-left: 30px;
}
.w-319 {
width: 319px;
}
.w-558 {
width: 558px;
}
.btn-class {
box-sizing: border-box;
padding: 5px 24px;
width: 80px;
height: 32px;
}
.damolish .el-popper {
min-width: 352px;
}
.text-ellipsis {
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>
......@@ -3,8 +3,8 @@
* @version: 1.0.0
* @Author: 无尘
* @Date: 2020-04-14 09:50:16
* @LastEditors: 无尘
* @LastEditTime: 2020-05-21 09:42:57
* @LastEditors: Drama
* @LastEditTime: 2022-09-08 18:01:24
-->
<!--
<text-edit :categoryId="categoryId" @closeText="closeText" @submitText="submitText"></text-edit>
......@@ -19,11 +19,11 @@
</el-form-item>
<el-form-item label="内容" prop="materialContent">
<div class="material-content">
<el-input show-word-limit placeholder="请输入内容" type="textarea" v-model="ruleForm.materialContent" maxlength="1000" class="w-440 welcomeContent"></el-input>
<el-popover placement="top" width="388" trigger="click">
<el-input id="inputContent" show-word-limit placeholder="请输入内容" type="textarea" v-model="ruleForm.materialContent" maxlength="1000" class="w-440 welcomeContent"></el-input>
<el-popover placement="top" width="388" trigger="click" @show="showPopover('inputContent')">
<ul class="flex flex-wrap">
<li v-for="(item, index) in emojiList" :key="index + 'emoji'">
<img :src="item.gifUrl" alt="" @click="selectEmoji(item)" />
<img :src="item.gifUrl" alt="" @click.stop="selectEmoji(item)" />
</li>
</ul>
<img class="emoji-img cursor-pointer" slot="reference" src="https://pic01-10001430.image.myqcloud.com/b0d3c14f-69e7-4753-8fbc-3bffcff9f8ce" alt="" />
......@@ -76,11 +76,18 @@ export default {
materialTitle: [{ required: true, message: '请输入文本标题', trigger: 'blur' }],
materialContent: [{ required: true, message: '请输入文本内容', trigger: 'blur' }]
},
emojiList: emojiArr
emojiList: emojiArr,
ele: '' // dom元素id
};
},
methods: {
/**
* 获取dom
*/
showPopover(id) {
this.ele = id;
},
/**
* 输入内容
**/
handleInput($event) {
......@@ -92,7 +99,19 @@ export default {
**/
selectEmoji(item) {
const that = this;
const str = that.ruleForm.materialContent + item.key;
let textArea = document.getElementById(this.ele);
let startPos = textArea.selectionStart;
let endPos = textArea.selectionEnd;
if (startPos === undefined || endPos === undefined) return;
let currentTxt = textArea.value;
const str = currentTxt.substring(0, startPos) + item.key + currentTxt.substring(endPos);
// const str = that.ruleForm.materialContent + item.key;
textArea.value = str;
textArea.focus();
this.$nextTick(() => {
textArea.selectionStart = startPos + item.key.length;
textArea.selectionEnd = endPos + item.key.length;
});
if (str.length > 1000) {
this.$message('添加该表情后文本内容将超过字数限制,无法添加!');
} else {
......
......@@ -3,8 +3,8 @@
* @version: 1.0.0
* @Author: 无尘
* @Date: 2018-10-10 14:44:45
* @LastEditors: 无尘
* @LastEditTime: 2020-12-14 16:54:50
* @LastEditors: Drama
* @LastEditTime: 2022-09-20 15:03:02
*/
import Vue from 'vue';
import Router from 'vue-router';
......@@ -119,7 +119,8 @@ export const constantRouterMap = [
{
path: '/guide-setting',
name: '导购设置',
component: _import('enterprise', 'guide-setting')
// component: _import('enterprise', 'guide-setting')
component: _import('enterprise', 'guide-setting-copy')
},
{
path: '/setting',
......@@ -168,6 +169,12 @@ export const constantRouterMap = [
name: '话务任务详情',
component: _import('salesleads/trafficTask', 'taskViewDetail')
},
// TODO: 导购视图
// {
// path: '/shopGuidView',
// name: '导购视图',
// component: _import('salesleads/trafficTask', 'shopGuidView')
// },
{
path: '/trafficTaskSet',
name: '话务任务设置',
......@@ -433,6 +440,8 @@ export const constantRouterMap = [
path: '/goodsShowSet',
name: '商品展示设置',
component: _import('apps/shoppingCenter', 'goodsShowSet')
// component: _import('apps/shoppingCenter', 'goodsShowSetCopy')
},
// 订单评价
{
......
......@@ -542,4 +542,52 @@ export function initDataRange() {
let startDay = startDate.getDate() < 10 ? '0' + startDate.getDate() : startDate.getDate();
let startNewMonth = startMonth < 10 ? '0' + startMonth : startMonth;
return [`${startYear}-${startNewMonth}-${startDay}`, `${year}-${newMonth}-${day}`];
}
/**
* 将平铺的数据结构转为树形结构
* @param {*} list 数组
* @param {*} rootValue 根元素id
* @param {*} param2 可配置参数
* @returns
*/
export function arrToTree(list,rootValue,{idName = 'id',parentIdName = 'parentId',childName = 'children'}= {}) {
const objMap ={}; // 暂存数组以id为key的映射关系
const result = []; // 结果
for (const item of list) {
const id = item[idName];
const parentId = item[parentIdName];
// 该元素有可能已经放入map中(找不到该项的parent时会先放入map)
objMap[id] = !objMap[id] ? item : {...item,...objMap[id]}
const treeItem = objMap[id]; // 找到映射的那一项 引用
if(parentId === rootValue) {
// 根元素 将结果放入
result.push(treeItem)
} else {
// 若父元素不存在,初始化父元素
if(!objMap[parentId]) {
objMap[parentId] = {}
}
// 若无该跟元素则放入map中
if(!objMap[parentId][childName]) {
objMap[parentId][childName] = []
}
objMap[parentId][childName].push(treeItem)
}
}
return result
}
export function getArrDifference(arr1,arr2) {
let result = [];
arr1.forEach(item => {
if(arr1.includes(item) && !arr2.includes(item)) {
result.push(item)
}
})
return result;
}
\ No newline at end of file
......@@ -3,8 +3,8 @@
* @version: 1.0.0
* @Author: 无尘
* @Date: 2019-03-20 14:36:37
* @LastEditors: 无尘
* @LastEditTime: 2020-08-26 10:01:07
* @LastEditors: Drama
* @LastEditTime: 2022-09-19 10:09:46
-->
<!--
......@@ -27,7 +27,7 @@
</div>
<div>
<el-checkbox v-if="$getButtonLimit($buttonCode.groupExpire)" :limit-code="$buttonCode.groupExpire" v-model="overTimeSeeFlag" @change="saveGroupSet" :disabled="$store.state.wxEnterpriseType">
<el-tooltip class="item" effect="dark" content="开启后,GIC中设置的好办端会员分组失效后,即使在GIC开启好办展示,好办移动端也不再展示该条分组" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;margin-left:-4px;" class="font-14 color-606266 m-r-20">会员分组失效后不展示</span></el-tooltip>
<el-tooltip class="item" effect="dark" content="勾选后,失效的分组不在好办小程序端展示" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;margin-left:-4px;" class="font-14 color-606266 m-r-20">会员分组失效后不展示</span></el-tooltip>
</el-checkbox>
<el-button v-if="$getButtonLimit($buttonCode.syncGroup)" :limit-code="$buttonCode.syncGroup" type="primary" :loading="loadingBtn" @click="toSync" :disabled="$store.state.wxEnterpriseType">立即同步</el-button>
<span v-if="syncDate" class="font-14 color-606266 p-r-10">最近一次同步时间:{{ syncDate | formatTimeStamp }}</span>
......
<!--
* @Descripttion: 当前组件信息
* @version: 1.0.0
* @Author: 无尘
* @Date: 2019-03-20 14:36:37
* @LastEditors: Drama
* @LastEditTime: 2022-09-14 11:21:41
-->
<template>
<div class="app-detail-wrap">
<!-- <div class="app-detail-pane border-box p-20">
<div class="m-b-20">
<span class="font-14 p-r-10">商品展示:</span>
<el-checkbox v-model="myCustomData.salesGoodsFlag">已上架商品</el-checkbox><el-checkbox v-model="myCustomData.notSalesGoodsFlag">未上架商品</el-checkbox>
</div>
<div><el-switch v-model="myCustomData.showPriceFlag"></el-switch><span class="font-14 color-303133 p-l-10">商品详情屏蔽价格</span><span class="font-12 color-909399 p-l-10">注:开启后,商品列表及商品详情中会屏蔽价格字段。关闭后显示价格。</span></div>
<div class="m-t-46">
<el-button v-if="$getButtonLimit($buttonCode.saveGoodsSet)" :limit-code="$buttonCode.saveGoodsSet" type="primary" :loading="loading" @click="submit('searchFlag')" :disabled="$store.state.wxEnterpriseType">保 存</el-button>
</div>
</div> -->
<div class="p-l-40 border-box p-t-30">
<el-form v-model="myCustomData" label-width="130px">
<el-form-item label="商品展示"><el-checkbox v-model="myCustomData.salesGoodsFlag">已上架商品</el-checkbox><el-checkbox v-model="myCustomData.notSalesGoodsFlag">未上架商品</el-checkbox></el-form-item>
<el-form-item label="商品详情价格" prop="showPriceFlag">
<div class="setting-radio-item">
<el-radio v-model="myCustomData.showPriceFlag" :label="false">屏蔽</el-radio>
<div class="set-tip-txt">商品列表及商品详情中不显示价格字段</div>
</div>
<div class="setting-radio-item">
<el-radio v-model="myCustomData.showPriceFlag" :label="true">不屏蔽</el-radio>
<div class="set-tip-txt">商品列表及商品详情中显示价格字段</div>
</div>
</el-form-item>
<!-- TODO: 字段确定 -->
<el-form-item label="商品品类名称" prop="test">
<div class="setting-radio-item m-b-30">
<el-radio v-model="myCustomData.test" label="1">一级品类名称</el-radio>
<div v-show="myCustomData.test == 1" class="tip-fixed">好办小程序 [客户详情] - [消费记录]的消费衣橱商品将按照此设置划分</div>
</div>
<div class="setting-radio-item m-b-30">
<el-radio v-model="myCustomData.test" label="2">二级品类名称</el-radio>
<div v-show="myCustomData.test == 2" class="tip-fixed">好办小程序 [客户详情] - [消费记录]的消费衣橱商品将按照此设置划分</div>
</div>
<div class="setting-radio-item m-b-30">
<el-radio v-model="myCustomData.test" label="3">三级品类名称</el-radio>
<div v-show="myCustomData.test == 3" class="tip-fixed">好办小程序 [客户详情] - [消费记录]的消费衣橱商品将按照此设置划分</div>
</div>
</el-form-item>
</el-form>
</div>
<!-- TODO: save按钮 -->
<div class="fixed-save-btn border-box" v-if="$getButtonLimit($buttonCode.saveGoodsSet)">
<el-button :limit-code="$buttonCode.saveGoodsSet" type="primary" :loading="loading" @click="submit('searchFlag')" :disabled="$store.state.wxEnterpriseType">保存</el-button>
</div>
</div>
</template>
<script>
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { _debounce } from '@/common/js/public';
import { postRequest } from '@/api/api';
export default {
name: 'app-detail',
props: {
brandId: {
type: String,
default() {
return '';
}
}
},
data() {
return {
projectName: '', // 当前项目名
wxEnterpriseRelatedId: sessionStorage.getItem('userInfos') ? JSON.parse(sessionStorage.getItem('userInfos')).wxEnterpriseId : '',
myCustomData: {
salesGoodsFlag: false,
notSalesGoodsFlag: false,
showPriceFlag: false,
test: '1'
},
activeId: '1',
loading: false
};
},
methods: {
/**
* 保存
*/
submit: _debounce(function(type) {
const that = this;
that.loading = true;
that.setData(type);
}, 500),
/**
* 保存-API
*/
setData(type) {
const that = this;
let para = {
enterpriseId: that.brandId,
// wxEnterpriseRelatedId: that.wxEnterpriseRelatedId,
salesGoodsFlag: that.myCustomData.salesGoodsFlag ? 1 : '0',
notSalesGoodsFlag: that.myCustomData.notSalesGoodsFlag ? 1 : '0',
showPriceFlag: that.myCustomData.showPriceFlag ? 1 : '0'
};
console.log(para, 'para---');
const url = '/haoban-app-aggregation-web/save-goods-setting';
postRequest(url, para)
.then(res => {
let resData = res.data;
that.loading = false;
that.getCustomerSet();
if (resData.errorCode == 1) {
showMsg.showmsg('保存成功', 'success');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.loading = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 获取数据
*/
getCustomerSet(brandId) {
const that = this;
let para = {
enterpriseId: that.brandId,
wxEnterpriseRelatedId: that.wxEnterpriseRelatedId
};
postRequest('/haoban-app-aggregation-web/find-goods-setting', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (!!resData.result) {
that.myCustomData.salesGoodsFlag = resData.result.salesGoodsFlag == 1 ? true : false;
that.myCustomData.notSalesGoodsFlag = resData.result.notSalesGoodsFlag == 1 ? true : false;
that.myCustomData.showPriceFlag = resData.result.showPriceFlag == 1 ? true : false;
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
watch: {
brandId: function(newData, oldData) {
const that = this;
if (newData) {
that.getCustomerSet(that.brandId);
}
}
},
mounted() {
const that = this;
if (that.brandId) {
that.getCustomerSet(that.brandId);
}
},
components: {}
};
</script>
<style lang="scss" scoped>
.w-500 {
width: 500px;
}
.w-195 {
width: 195px;
}
.color-1890ff {
color: #2f54eb;
}
.p-20 {
padding: 20px;
}
.p-l-38 {
padding-left: 38px;
}
.p-l-199 {
padding-left: 199px;
}
.p-t-30 {
padding-top: 30px;
}
.m-b-30 {
margin-bottom: 30px;
}
.damolish .el-form-item {
margin-bottom: 30px;
}
.damolish .el-button {
padding: 8px 26px;
}
.app-detail-wrap {
height: 100%;
background: #fff;
.el-tabs {
background: #fff;
>>> .el-tabs__nav-wrap {
/* height: 48px;
line-height: 48px; */
&::after {
height: 1px;
}
/* .el-tabs__nav-scroll {
padding-left: 20px;
} */
}
}
.condition-tip {
width: 740px;
.el-alert--info {
background: #e6f7ff;
border: 1px solid rgba(145, 213, 255, 1);
.el-alert__icon {
font-size: 12px;
}
}
}
.setting-radio-item {
position: relative;
& + .setting-radio-item {
margin-top: 15px;
}
.set-tip-txt,
.tip-fixed {
padding: 0 0 0 25px;
font-size: 12px;
font-weight: 400;
color: #909399;
line-height: 15px;
}
.tip-fixed {
position: absolute;
top: 10;
}
}
.fixed-save-btn {
position: fixed;
display: flex;
-webkit-box-pack: center;
-webkit-box-align: center;
align-items: center;
justify-content: center;
bottom: 0;
width: calc(100% - 206px);
height: 56px;
background: #ffffff;
box-shadow: 1px -2px 8px 0px rgba(220, 223, 230, 0.6);
}
}
</style>
<!--
* @Description:
* @Version: 1.0
* @Author: Drama
* @Date: 2022-09-14 11:09:43
* @LastEditors: Drama
* @LastEditTime: 2022-09-20 14:59:20
* @FilePath: /haoban-3/src/views/enterprise/guide-setting-copy.vue
* Copyright (C) 2022 huzhenhong. All rights reserved.
-->
<template>
<div class="app-detail-wrap">
<div class="border-box p-t-30 p-l-26 p-r-211">
<el-form ref="ruleForm" v-model="roleForm" label-width="100px">
<el-form-item label="应用权限" required>
<div class="dis-f">
<div class="title-wrap border-box border-radio-2">
<div class=" border-box tag-wrap F-S-14 F-C-BLACK dis-center border-radio-2 cursor-pointer" v-for="(item, index) in titleList" :key="index" :class="[activeNum == index ? 'checked-status' : '', item.isEmpty ? 'empted-status' : '']" @click="chooseType(index)">{{ item.title }}</div>
</div>
<div v-if="isShowErrorTip" class="error-tip border-box border-radio-2">
<i class="el-icon-warning"></i>
<div class="F-C-BLACK F-S-12 m-l-9">当前有未填项</div>
</div>
</div>
</el-form-item>
<el-form-item label="" prop="" class="">
<vue-gic-auth-tree class="auth-tree" :data="treeData" show-checkbox ref="tree" node-key="menuCode" :default-checked-keys="withoutParents" default-expand-all :props="defaultProps" showButtonFlag></vue-gic-auth-tree>
</el-form-item>
</el-form>
</div>
<!-- save按钮 -->
<div class="fixed-save-btn border-box" v-if="$getButtonLimit($buttonCode.saveGoodsSet)">
<el-button :limit-code="$buttonCode.saveGoodsSet" type="primary" :loading="loading" @click="submit" :disabled="$store.state.wxEnterpriseType">保存</el-button>
</div>
</div>
</template>
<script>
import { deepClone, arrToTree, getArrDifference } from '@/utils';
import { getRequest, postJsonRequest } from '@/api/api';
import { _debounce } from '@/common/js/public';
export default {
name: 'GuideSetting',
data() {
return {
roleForm: {},
titleList: [
{ title: '导购', isEmpty: false },
{ title: '店长', isEmpty: false },
{ title: '区经/督导', isEmpty: false }
],
activeNum: 0,
defaultProps: {
children: 'menuBOList',
label: 'menuName'
},
withoutParents: [], //不包含父节点
treeData: [],
treeData_0: [],
treeData_1: [],
treeData_2: [],
withoutParents_0: [],
withoutParents_1: [],
withoutParents_2: [],
curMenuCode_0: [], // 拷贝当前节点了的按钮
curMenuCode_1: [],
curMenuCode_2: [],
roleId_0: '',
roleId_1: '',
roleId_2: '',
copyMenu_0: [],
copyMenu_1: [],
copyMenu_2: [],
loading: false,
isShowErrorTip: false
};
},
computed: {
setDefaultExpandedKeys() {
return treeData => treeData.map(el => el.rightId);
}
},
async mounted() {
await this.getMenuRoleList(0);
await this.getMenuRoleList(1);
await this.getMenuRoleList(2);
},
methods: {
chooseType(index) {
this.isShowErrorTip = false;
this.treeData = deepClone(this['copyMenu_' + index]);
this.titleList.forEach(item => {
item.isEmpty = false;
});
let isChooseList = this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys());
// 切换tab时 缓存上个tag选择的节点
this['withoutParents_' + this.activeNum] = [...isChooseList];
this.activeNum = index;
// this.treeData = deepClone(this.copyMenu);
this.withoutParents = this['withoutParents_' + this.activeNum];
},
// 获取类型选择菜单
getQueryMenuList(clerkType) {
let params = {
clerkType
};
getRequest('/haoban-manage3-web/role/queryMenuByClerkType', params).then(res => {
if (res.data.code == 0) {
if (res.data.result) {
this['roleId_' + clerkType] = res.data.result.roleId;
this['curMenuCode_' + clerkType] = [...res.data.result.menuCodes]; // 保存当前类别选中状态,保存的时候用用于记录操作的区别
this['withoutParents_' + clerkType] = [...res.data.result.menuCodes];
if (clerkType == 0) {
// 当前导购选中
this.withoutParents = [...res.data.result.menuCodes];
}
} else {
this['withoutParents_' + clerkType] = [];
}
} else {
this.$message.error(res.data.message);
}
});
},
// 获取菜单列表
async getMenuRoleList(clerkType) {
let query = {
clerkType
};
await getRequest('/haoban-manage3-web/role/getHaobanMenuTreeList', query).then(res => {
if (res.data.code == 0) {
if (res.data.result) {
let resData = res.data;
let arr = resData.result;
arr.forEach(item => {
if (item.menuType == 0) {
item.parentCode = 0;
}
});
this['treeData_' + clerkType] = deepClone(arrToTree(arr, 0, { idName: 'menuCode', parentIdName: 'parentCode', childName: 'menuBOList' }));
if (clerkType == 0) {
this.treeData = deepClone(this.treeData_0);
}
this['copyMenu_' + clerkType] = deepClone(this['treeData_' + clerkType]);
this.getQueryMenuList(clerkType);
} else {
this['treeData_' + clerkType] = [];
this.treeData = [];
}
} else {
this.$message.error(res.data.message);
}
});
},
// 保存
submit: _debounce(function() {
let currentChooseList = this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys());
this['withoutParents_' + this.activeNum] = [...currentChooseList];
let errFlag_0 = this.withoutParents_0.length ? true : false;
let errFlag_1 = this.withoutParents_1.length ? true : false;
let errFlag_2 = this.withoutParents_2.length ? true : false;
let delMenu_0 = getArrDifference(this.curMenuCode_0, this.withoutParents_0);
let delMenu_1 = getArrDifference(this.curMenuCode_1, this.withoutParents_1);
let delMenu_2 = getArrDifference(this.curMenuCode_2, this.withoutParents_2);
if (!errFlag_0 || !errFlag_1 || !errFlag_2) {
this.$set(this.titleList[0], 'isEmpty', !errFlag_0);
this.$set(this.titleList[1], 'isEmpty', !errFlag_1);
this.$set(this.titleList[2], 'isEmpty', !errFlag_2);
this.isShowErrorTip = true;
return;
}
let para = {
clerkMenus: {
roleId: this.roleId_0,
clerkType: 0, // 导购
menuCodes: [...this.withoutParents_0], // 权限id
delMenuCodes: delMenu_0 // 删除的code
},
manegeClerkMenus: {
roleId: this.roleId_1,
clerkType: 1, // 店长
menuCodes: [...this.withoutParents_1],
delMenuCodes: delMenu_1
},
managerMenus: {
roleId: this.roleId_2,
clerkType: 2, // 区经
menuCodes: [...this.withoutParents_2],
delMenuCodes: delMenu_2
}
};
postJsonRequest('/haoban-manage3-web/role/edit', para).then(async res => {
let data = res.data;
if (data.code == 0) {
this.$message.success(res.data.message);
this.activeNum = 0;
this.treeData = [];
this.withoutParents = [];
await this.getMenuRoleList(0);
await this.getMenuRoleList(1);
await this.getMenuRoleList(2);
} else {
this.$message.warning(data.message);
}
});
}, 500)
}
};
</script>
<style lang="scss">
.auth-tree .iconfont.auth-expanded {
font-family: 'element-icons' !important;
}
.auth-tree .el-tree-node__expand-icon.auth-tree-arrow {
font-family: 'element-icons' !important;
}
</style>
<style lang="less" scoped>
.el-icon-warning {
width: 12px;
font-size: 12px;
color: #fa8c16;
}
.m-l-9 {
margin-left: 9px;
}
.p-l-26 {
padding-left: 26px;
}
.p-r-211 {
padding-right: 211px;
}
.F-S-14 {
font-size: 14px;
}
.F-S-12 {
font-size: 12px;
}
.F-C-BLACK {
color: #303133;
}
.border-radio-2 {
border-radius: 2px;
}
.dis-f {
display: flex;
}
.p-t-30 {
padding-top: 30px;
}
.damolish .el-button {
padding: 8px 26px;
}
.dis-center {
display: flex;
align-items: center;
justify-content: center;
}
.app-detail-wrap {
height: 100%;
background: #fff;
.title-wrap {
display: flex;
align-items: center;
justify-content: space-around;
padding: 4px 13px 4px 4px;
width: 201px;
height: 32px;
/* transform: translateY(-5px); */
border: 1px solid #dcdfe6;
background: #ffffff;
.tag-wrap {
padding: 0px 10px;
height: 24px;
}
.checked-status {
background: #ebeffe;
color: #2f54eb;
}
.empted-status {
color: #f5222d;
background: rgba(245, 34, 45, 0.11);
}
}
.error-tip {
display: flex;
align-items: center;
width: 129px;
padding: 4px 0px 4px 17px;
height: 32px;
margin-left: 8px;
background: #fcf6f1;
}
.right-config {
font-size: 14px;
.title {
display: flex;
justify-content: space-between;
align-items: center;
height: 50px;
box-sizing: border-box;
padding: 15px 20px 15px 30px;
color: #303133;
border: 1px solid #e4e7ed;
p {
font-weight: 600;
}
}
}
}
/* 权限设置 */
.account-limit-wrap {
font-size: 0px;
.limit-item {
display: flex;
border: 1px solid #dcdfe6;
border-radius: 4px;
margin-bottom: 10px;
.fl-item {
flex: 0 0 225px;
width: 225px;
background: rgb(246, 246, 246);
border-right: 1px solid #dcdfe6;
font-size: 16px;
font-weight: 500;
display: flex;
justify-content: center;
align-items: center;
.opr-icon {
color: #919191;
font-size: 13px;
padding: 6px 3px 3px;
margin-right: 12px;
cursor: pointer;
}
}
.fr-item {
flex: 1;
width: 100%;
color: #595959;
.item-title {
height: 45px;
line-height: 45px;
padding-left: 20px;
font-weight: 500;
background: rgb(246, 246, 246);
}
}
}
}
.expend {
height: auto;
}
.right-wrap_ {
width: 100%;
height: 100%;
box-sizing: border-box;
}
.fixed-save-btn {
position: fixed;
display: flex;
-webkit-box-pack: center;
-webkit-box-align: center;
align-items: center;
justify-content: center;
bottom: 0;
width: calc(100% - 206px);
height: 56px;
background: #ffffff;
box-shadow: 1px -2px 8px 0px rgba(220, 223, 230, 0.6);
}
</style>
<template>
<div class="my-customer-wrap common-set-wrap">
<div class="daily-set-content boder-box">
<div class="table-condition flex flex-space-between m-b-23">
<div class="table-condition-left flex flex-align-center">
<!-- TODO: 这里的搜索字段需要明确 -->
<el-input placeholder="计划名称" maxlength="50" v-model="conditionObj.searchInput" class="w-264" style="width: 264px;" @keyup.native="value => toInput(value, conditionObj.searchInput)"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
<el-input placeholder="任务标题" maxlength="50" v-model="conditionObj.searchInput" class="w-264 m-l-10" style="width: 264px;" @keyup.native="value => toInput(value, conditionObj.searchInput)"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
<el-input placeholder="导购名称/手机号" maxlength="50" v-model="conditionObj.searchInput" class="w-264 m-l-10" style="width: 264px;" @keyup.native="value => toInput(value, conditionObj.searchInput)"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
<el-select v-model="conditionObj.completed" placeholder="请选择" class="w-135 m-l-10" @change="changeSelect">
<el-option v-for="item in completedOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</div>
</div>
<div class="table-condition flex flex-space-between m-b-23">
<div class="table-condition-left flex flex-align-center">
<el-input placeholder="请输入门店名称" maxlength="50" v-model="conditionObj.searchInput" class="w-264" style="width: 264px;" @keyup.native="value => toInput(value, conditionObj.searchInput)"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
<gic-select-group :brandId="brandId" class="m-l-10" style="min-width: 213px !important;" :width="213" :selectData="conditionObj.storeGroup" @checkGroupIds="checkGroupIds"> </gic-select-group>
<el-date-picker class="m-l-10" prefix-icon="el-icon-time" :picker-options="pickerOptions" v-model="conditionObj.date" @change="changeSelect" :value-format="'yyyy-MM-dd'" type="daterange" align="right" unlink-panels range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间"> </el-date-picker>
</div>
<div class="table-condition-right">
<el-button v-if="$getButtonLimit($buttonCode.multipleDelTaskDetail)" :limit-code="$buttonCode.multipleDelTaskDetail" type="danger" @click="multDel">批量删除</el-button>
<el-button class="m-l-10" type="primary" v-if="$getButtonLimit($buttonCode.exportTaskDetail)" :limit-code="$buttonCode.exportTaskDetail" :loading="loadingBtn" @click="beforeExportExcel" plain>导出</el-button>
<el-tooltip content="导出结果中会员姓名、手机号等敏感信息将进行加密,实现隐私保护" placement="top">
<i class="el-icon-warning-outline font-14 p-l-6" v-show="enableDownloadCompleteData == 0"></i>
</el-tooltip>
</div>
</div>
<el-table class="select-table" ref="multipleTable" :key="tableRefresh" v-loading="loading" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="45" :class-name="selectRadio == 1 ? 'cell-disabled' : 'font-size-zero'"> </el-table-column>
<el-table-column width="25">
<template #header>
<el-dropdown style="line-height: 10px; padding: 0; margin-left: -15px; transform: translateY(4px); -webkit-transform: translateY(4px);" placement="bottom-start">
<span class="el-dropdown-link"><i class="iconfont-hb3 icongengduo"></i> </span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item> <el-checkbox v-model="selectRadio" :true-label="0" :false-label="2" @change="handleCommand">选择当页</el-checkbox></el-dropdown-item>
<el-dropdown-item> <el-checkbox v-model="selectRadio" :true-label="1" :false-label="2" @change="handleCommand">选择全部</el-checkbox></el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</template>
<template>{{ ' ' }}</template>
</el-table-column>
<el-table-column label="计划名称"></el-table-column>
<el-table-column prop="title" label="任务标题" show-overflow-tooltip></el-table-column>
<el-table-column label="门店名称"></el-table-column>
<el-table-column label="门店分组"></el-table-column>
<el-table-column label="导购" show-overflow-tooltip width="170">
<template slot-scope="scope">
<div class="flex flex-pack-center flex-start">
<el-popover placement="top-start" width="300" trigger="hover" @show="showSingleInfo(scope.row.clerkId)">
<div class="apply-info-detail">
<div class="flex">
<div class="apply-info-img flex-align-center flex-pack-center bg-82C5FF ">
<i v-if="!userData.headImg" class="iconfont-hb3 icon-yewuduanmorentouxian"></i>
<img v-else :src="userData.headImg" alt="img" />
</div>
<div class="flex flex-column apply-info-right flex-space-between">
<div class="apply-info-name">
{{ userData.staffName || '--' }} ( {{ userData.position || '--' }})
<!-- <i :class="[userData.sex == 2 ? 'icon-xingbienv color-FF585C' : 'icon-xingbienan color-508CEE', 'iconfont-hb3']"></i> -->
</div>
<div class="apply-info-phone">
<span class="w-80">手机号:</span><span class="w-130">{{ userData.nationCode == '86' ? userData.phoneNumber : '+' + userData.nationCode + '-' + userData.phoneNumber }}</span>
</div>
<div class="apply-info-store">
<span class="w-80">所属部门:</span><span class="w-130">{{ userData.departmentName || '--' }}</span>
</div>
</div>
</div>
</div>
<div slot="reference">
<div class="flex flex-align-center flex-pack-center bg-82C5FF table-head-pic cursor-pointer">
<i v-if="!scope.row.headImgUrl" class="iconfont-hb3 icon-yewuduanmorentouxian"></i>
<img v-else :src="scope.row.headImgUrl" alt="img" />
</div>
</div>
</el-popover>
<div class="clerk-info flex flex-column flex-space-between m-l-16" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
<p class="font-14 color-303133" style="line-height: 18px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
{{ scope.row.clerkName }}
</p>
<p class="font-14 color-909399" style="line-height: 18px;width: 100%; overflow:hidden;text-overflow: ellipsis;">
{{ scope.row.clerkPhone }}
</p>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="会员" show-overflow-tooltip width="170">
<template slot-scope="scope">
<div class="flex flex-pack-center flex-start">
<div class="flex flex-align-center flex-pack-center bg-82C5FF table-head-pic cursor-pointer">
<i v-if="!scope.row.memberHeadUrl" class="iconfont-hb3 icon-yewuduanmorentouxian"></i>
<img v-else :src="scope.row.memberHeadUrl" alt="img" />
</div>
<div class="clerk-info flex flex-column flex-space-between m-l-16" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
<p class="font-14 color-303133" style="line-height: 18px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
{{ scope.row.memberName }}
</p>
<p class="font-14 color-909399" style="line-height: 18px;width: 100%; overflow:hidden;text-overflow: ellipsis;">
{{ scope.row.memberCardNo }}
</p>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="任务创建时间" width="107">
<template slot-scope="scope">
<div class="line-18">{{ scope.row.createTime | formatTimeYMD }}</div>
<div class="line-18">{{ scope.row.createTime | formatTimeHMS }}</div>
</template>
</el-table-column>
<el-table-column prop="" label="完成期限" show-overflow-tooltip width="107">
<template slot-scope="scope">
<div class="line-18">{{ scope.row.lastTime | formatTimeYMD }}</div>
<div class="line-18">{{ scope.row.lastTime | formatTimeHMS }}</div>
</template>
</el-table-column>
<el-table-column label="逾期情况/逾期失效" width="140">
<template slot-scope="scope"> <span class="point" :style="'background:' + overdueStyle[scope.row.isOverTime] + ';'"></span>{{ scope.row.isOverTime }}/{{ scope.row.invalidStatus | formatInvalidStatus }}</template>
</el-table-column>
<el-table-column label="完成情况">
<template #header>
<el-tooltip class="item" effect="light" placement="right">
<div slot="content">
完成情况包含3种<br />
1.完成拨打任务;<br />
2.完成任务(无需拨打);<br />
3.完成任务(放弃拨打);<br />
4.未完成任务
</div>
<span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;">完成情况</span>
</el-tooltip>
</template>
<template slot-scope="scope">
<span class="point" :style="'background:' + taskStyle[scope.row.taskStatus] + ';'"></span>
{{ scope.row.isCompleted }}
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="200" v-if="$getButtonLimit($buttonCode.delTaskDetail) || $getButtonLimit($buttonCode.previewTaskDetail) || $getButtonLimit($buttonCode.resolveTaskDetail)">
<template slot-scope="scope">
<el-button v-if="$getButtonLimit($buttonCode.delTaskDetail)" :limit-code="$buttonCode.delTaskDetail" type="text" @click="handleDel(scope.$index, scope.row)">删除</el-button>
<el-button v-if="$getButtonLimit($buttonCode.previewTaskDetail)" :limit-code="$buttonCode.previewTaskDetail" type="text" @click="getPreviewData(scope.$index, scope.row)">预览</el-button>
<el-button v-if="$getButtonLimit($buttonCode.resolveTaskDetail)" :limit-code="$buttonCode.resolveTaskDetail" type="text" @click="getTaskDetail(scope.row)">完成详情</el-button>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
<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>
</div>
<!-- <multiple-del :showDialog="showDialog" :detailFlag="true" @hideDialog="hideDialog" :showTip="true"> </multiple-del> -->
<export-dialog :dialogVisible="exportDialog" @export="exportExcel" @update:dialogVisible="changeExportDialog" />
<qrcode-dialog ref="qrcodePreview" v-model="dialogVisible"></qrcode-dialog>
<detail-preview ref="detailPreview" :previewData="previewData" v-model="previewVisible" @closePreview="closePreview"></detail-preview>
<task-detail v-if="taskDetailVisible" @close="closeTaskDetail" :taskData="taskDetail"></task-detail>
</div>
</template>
<script>
import exportDialog from '@/components/common/export-dialog.vue';
import multipleDel from '@/components/app/cloudDaily/multiple-del.vue';
import qrcodeDialog from '@/components/app/qrcode-dialog.vue';
import detailPreview from '@/components/app/detail-preview.vue';
import taskDetail from '@/components/app/task-detail.vue';
import { getRequest, postRequest, postExcel } from '@/api/api';
import { _debounce } from '@/common/js/public';
import errMsg from '@/common/js/error';
import showMsg from '@/common/js/showmsg';
export default {
name: 'shopGuidView',
props: {
brandId: {
type: String,
default() {
return '';
}
}
},
filters: {
formatTimeYMD(data) {
return data && data != '- -' ? data.split(' ')[0] : '--';
},
formatTimeHMS(data) {
return data && data != '- -' ? data.split(' ')[1] : '--';
}
},
data() {
return {
enableDownloadCompleteData: 0,
tableH: window.screen.availHeight - 464 - 126,
activeBrand: this.brandId, // 品牌 id
loadingBtn: false,
selectRadio: 2, // 0:选择当页; 1:选择全部
showDialog: false, // 删除弹窗参数
// 条件
conditionObj: {
storeGroup: [], // TODO: 门店分组
wcStatus: '', // TODO: 完成情况
completed: '',
overdue: '',
title: '',
taskType: '1',
date: this.$store.state.salesDate
},
overdueStyle: {
已逾期: '#F5222D',
未逾期: '#2F54EB'
},
taskStyle: {
2: '#33AF4A',
5: '#33AF4A',
1: '#F5222D',
3: '#F5222D',
4: '#F5222D'
},
completedOptions: [
{
label: '所有完成情况',
value: ''
},
{
label: '已完成(已拨通)',
value: '1'
},
{
label: '已完成(放弃)',
value: '2'
},
/* {
label: '已完成(特殊完成)',
value: '3'
}, */
{
label: '未完成',
value: '0'
}
],
overOptions: [
{
label: '所有逾期情况',
value: ''
},
{
label: '逾期未失效',
value: '2'
},
{
label: '逾期已失效',
value: '3'
},
{
label: '已逾期',
value: '1'
},
{
label: '未逾期',
value: '0'
}
],
loading: false,
tableData: [],
multipleSelection: [],
dialogVisible: false, // 二维码
// 分页参数
currentPage: 1,
pageSize: 20,
total: 0,
previewData: {},
previewVisible: false,
// user
userData: {
staffName: '',
phoneNumber: '',
nationCode: '',
postion: '',
departmentName: '',
headImg: ''
},
taskDetailVisible: false,
taskDetail: {},
pickerOptions: {
disabledDate: time => {
const end = new Date();
return time.getTime() < end.getTime() - 3600 * 1000 * 24 * 365 || time.getTime() > end.getTime();
}
},
tableRefresh: false,
exportDialog: false
};
},
computed: {},
methods: {
/**
* 选择门店分组
*/
checkGroupIds: function(nodes) {
const that = this;
that.conditionObj.storeGroup = nodes;
that.currentPage = 1;
that.getTableList();
},
/**
* 输入
*/
toInput: _debounce(function(e, value) {
let that = this;
that.currentPage = 1;
that.getTableList();
}, 500),
getInfo() {
const gicEnterpriseId = JSON.parse(sessionStorage.getItem('userInfos')).enterpriseId;
getRequest('/haoban-app-tel-task-three-web/setting/find-enterprise-desensitization-setting', { gicEnterpriseId }).then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
this.enableDownloadCompleteData = resData.result.enableDownloadCompleteData;
return;
}
errMsg.errorMsg(resData);
});
},
beforeExportExcel() {
if (!this.multipleSelection.length) {
showMsg.showmsg('请选择任务', 'warning');
return false;
}
if (this.enableDownloadCompleteData == 1) {
this.exportDialog = true;
} else {
this.exportExcel(0);
}
},
changeExportDialog() {
this.exportDialog = false;
this.multipleSelection = [];
this.$refs.multipleTable.clearSelection();
},
/**
* 导 出
*/
exportExcel(type) {
const that = this;
if (!that.multipleSelection.length) {
showMsg.showmsg('请选择任务', 'warning');
return false;
}
that.loadingBtn = true;
let para = {
gicEnterpriseId: that.activeBrand, // 品牌 id
selectType: that.selectRadio == 2 && that.multipleSelection.length ? 0 : this.selectRadio,
storeId: that.$route.query.storeId,
ecmId: !!that.$route.query.ecmId ? that.$route.query.ecmId : '',
isOverTime: that.conditionObj.overdue || '', // 逾期
isCompleted: that.conditionObj.completed || '', // 完成
taskIds: that.selectRadio == 1 ? '' : that.multipleSelection.map(ele => ele.taskId).join(','),
dataType: type,
title: this.conditionObj.title
};
if (Array.isArray(this.conditionObj.date) && this.conditionObj.date.length == 2) {
para.createTimeStart = this.conditionObj.date[0];
para.createTimeEnd = this.conditionObj.date[1];
}
postExcel('/haoban-app-tel-task-three-web/task/export-store-view-clerk-list', para)
.then(res => {
that.loadingBtn = false;
if (!res.data) {
errMsg.errorMsg('暂无数据');
return false;
}
// let resData = res.data;
const blob = new Blob([res.data], {
type: 'application/vnd.ms-excel'
});
const fileName = `门店任务导购报表.xls`;
const elink = document.createElement('a');
elink.download = fileName;
elink.style.display = 'none';
elink.href = URL.createObjectURL(blob);
document.body.appendChild(elink);
elink.click();
URL.revokeObjectURL(elink.href); // 释放URL 对象
document.body.removeChild(elink);
// errMsg.errorMsg(resData);
})
.catch(function(error) {
that.loadingBtn = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 获取头像处显示信息
*/
/* eslint-disable */
showSingleInfo(memberId) {
const that = this;
const para = {
clerkId: memberId
};
postRequest('/haoban-manage3-web/get-clerk-info', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.userData = resData.result;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
closePreview() {
const that = this;
that.previewData = {};
},
/**
* 获取预览数据
*/
getPreviewData(index, item) {
const that = this;
let para = {
taskId: item.taskId
};
that.previewVisible = true;
postRequest('/haoban-app-tel-task-three-web/task/app-task-detail', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.previewData = resData.result;
that.previewVisible = true;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 显示选择本页/全部
*/
handleCommand(command) {
this.selectRadio = command;
this.tableRefresh = !this.tableRefresh;
if (command == 1 || command == 0) {
this.$nextTick(() => {
this.$refs.multipleTable.toggleAllSelection();
})
} else if (command == 2) {
this.$refs.multipleTable.clearSelection();
}
},
/**
* 表格选择
*/
handleSelectionChange(val) {
this.multipleSelection = val;
val.length ? '' : (this.selectRadio = 2);
},
/**
* 批量删除
*/
multDel() {
let that = this;
if (!that.multipleSelection.length) {
that.$message.error({
duration: 1000,
message: '请选择删除项'
});
return false;
}
this.$confirm('删除任务后,会影响任务统计如已完成,完成率,待完成以及销售线索收益等,请知悉', '确认要删除吗?').then(res => {
that.postMultDel();
})
},
postMultDel() {
let that = this;
let para = {
storeId: that.$route.query.storeId,
taskIds: that.selectRadio == 1 ? '' : that.multipleSelection.map(ele => ele.taskId).join(','), // 门店分组,数组
isOverTime: that.conditionObj.overdue || '', // 逾期
isCompleted: that.conditionObj.completed || '', // 完成
enterpriseId: that.activeBrand, // 品牌 id
isAll: that.selectRadio // 0:当页,1:所有
};
postRequest('/haoban-app-tel-task-three-web/task/batch-del-clerk-task-list', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
showMsg.showmsg('删除成功', 'success');
that.getTableList();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 分页---页码变化
* @param {Number} val
*/
handleSizeChange(val) {
const that = this;
that.currentPage = 1;
that.pageSize = val;
that.getTableList(this.selectRadio);
},
/**
* 分页---当前页变化
* @param {Number} val
*/
handleCurrentChange(val) {
const that = this;
that.currentPage = val;
that.getTableList(this.selectRadio);
},
changeSelect(e) {
const that = this;
if (!e) {
that.$store.dispatch('changeSales', []);
} else {
that.$store.dispatch('changeSales', e);
}
that.currentPage = 1;
that.getTableList();
},
/**
* 删除
*/
handleDel(index, row) {
const that = this;
this.$confirm('删除任务后,会影响任务统计如已完成,完成率,待完成以及销售线索收益等,请知悉', '确认要删除吗?')
.then(res => {
that.postDel(index, row);
})
.catch(() => { });
// that
// .$confirm(`确认要删除吗?`, '提示', {
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning'
// })
// .then(() => {
// that.postDel(index, row);
// })
// .catch(() => {});
},
postDel(index, row) {
const that = this;
let para = {
taskId: row.taskId,
enterpriseId: that.activeBrand // 品牌 id
};
getRequest('/haoban-app-tel-task-three-web/task/del-one', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
showMsg.showmsg('删除成功', 'success');
that.getTableList();
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 预览
*/
handlePreview(index, row) {
const that = this;
that.postPreview(index, row);
},
/**
* 预览---api
*/
postPreview(index, row) {
const that = this;
// 生成二维码需要的 url
let webUrl = `${row.taskId}`;
that.$refs.qrcodePreview.qrcode(webUrl, 'task');
that.dialogVisible = true;
},
/**
* 获取列表数据
*/
getTableList(val) {
const that = this;
that.loading = true;
let para = {
ecmId: that.$route.query.ecmId || '',
storeId: that.$route.query.storeId || '', // 门店
isOverTime: that.conditionObj.overdue || '', // 逾期
isCompleted: that.conditionObj.completed || '',
title: that.conditionObj.title || '', // 任务标题
pageNum: that.currentPage, // 当前页
pageSize: that.pageSize, // 一页显示个数
gicEnterpriseId: that.activeBrand
};
if (Array.isArray(that.conditionObj.date) && that.conditionObj.date.length === 2) {
para.createTimeStart=that.conditionObj.date[0];
para.createTimeEnd=that.conditionObj.date[1];
}
getRequest('/haoban-app-tel-task-three-web/task/clerk-task-list', para)
.then(res => {
let resData = res.data;
that.loading = false;
if (resData.errorCode == 1) {
if (resData.result.list) {
resData.result.list.forEach(ele => {
if (!ele.taskUrl || ele.taskUrl.length) {
ele.taskUrl = [];
}
});
}
that.tableData = resData.result.list || [];
that.total = resData.result.pageInfo ? resData.result.pageInfo.total : 0;
if (val == 1) {
this.$nextTick(() => {
this.$refs.multipleTable.toggleAllSelection();
});
} else {
this.selectRadio = 2;
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.loading = false;
that.$message.error({
duration: 1000,
message: error.message
});
});
},
getTaskDetail(item) {
this.taskDetail = { ...item };
this.taskDetailVisible = true;
},
closeTaskDetail() {
this.taskDetail = {};
this.taskDetailVisible = false;
}
},
watch: {
brandId: function(newData, oldData) {
const that = this;
if (!!newData) {
that.activeBrand = newData;
that.getTableList();
}
this.multipleSelection = []
}
},
mounted() {
let that = this;
that.activeBrand = that.brandId;
that.conditionObj.storeId = that.$route.query.storeId;
if (!!that.brandId) {
that.getTableList();
}
this.getInfo();
},
components: {
multipleDel,
qrcodeDialog,
detailPreview,
taskDetail,
exportDialog
}
};
</script>
<style type="text/scss" lang="scss" scoped>
.w-135 {
width: 135px;
}
.w-260 {
width: 260px;
}
.table-condition-left {
display: flex;
justify-content: flex-start;
align-items: center;
}
.task-imgs {
display: inline-block;
vertical-align: middle;
width: 30px;
height: 30px;
margin-right: 10px;
border-radius: 4px;
}
.daily-set-content {
padding: 16px;
.image-wrap {
width: 40px;
height: 40px;
min-width: 40px;
max-width: 40px;
max-height: 40px;
border-radius: 4px;
&.bg-82c5ff {
background: #82c5ff;
}
&.bg-eceaeb {
background: #eceaeb;
}
img {
max-width: 40px;
max-height: 40px;
border-radius: 4px;
}
i {
font-size: 20px;
color: #e5f3ff;
}
}
}
.depart-item-content {
width: 213px;
height: 32px;
overflow: hidden;
white-space: nowrap;
border-radius: 4px;
border: 1px solid #dcdfe6;
cursor: pointer;
}
.item-cell-select {
>>> .el-select__tags {
white-space: nowrap;
overflow: hidden;
}
}
.depart-cell {
position: relative;
margin: 0 24px 24px 0;
.el-icon-circle-close {
position: absolute;
top: -10px;
right: -10px;
font-size: 16px;
color: #808995;
cursor: pointer;
}
}
</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