Commit 0cc6a090 by xiaohai

stay up

parent 2adc37ab
<template>
<div>
<el-table
ref="clerkViewTable"
class="diy-table"
height="445"
:data="tableData">
<el-table-column
type="selection"
width="42"
></el-table-column>
<el-table-column
label="门店"
width="175"
prop="employeeStoreName"
></el-table-column>
<el-table-column
label="门店code"
prop="storeCode"
width="175"
></el-table-column>
<el-table-column>
<template slot="header" slot-scope="scope">
<ul class="diy-header">
<li class="name">姓名</li>
<li class="phone">手机号</li>
<li class="position">职位</li>
<li class="status">状态</li>
</ul>
</template>
<template slot-scope="scope">
<ul>
<li v-for="clerk in scope.row.ext.store.ext.employeeClerkList" :key="clerk.employeeClerkId" class="clerk-obj-li">
<div class="clerk-name clerk-cell">{{clerk.name}}</div>
<div class="clerk-cell clerk-phone">{{clerk.phoneNumber}}</div>
<div class="clerk-cell clerk-position">{{clerk.positionName}}</div>
<div class="clerk-cell clerk-status">
<div class="status-icon" :class="clerk.activationStatus == 1 ? 'is-active' : ''">
<i class="iconfont icon-shouji"></i>
</div>
</div>
</li>
</ul>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import { getRequest, postRequest, postJsonRequest } from '@/api/api';
export default {
name: "clerkView",
props: {
tableData: {
type: Array,
default() {
return [];
}
}
},
data() {
return {
storeType: 0,
typeArr: ["全部类型", "自营", "联营", "代理(加盟)", "代销", "托管"],
storeStatus:"",
showChildMember: false
};
},
methods: {
},
mounted() {
let list = this.tableData;
list.forEach(store => {
store.storeCode = store.ext.store.storeCode;
});
},
watch: {
tableData(table) {
table.forEach(store => {
store.storeCode = store.ext.store.storeCode;
});
}
}
};
</script>
<style lang="scss">
.diy-table {
.diy-header {
display: flex;
.name {
width: 130px;
}
.phone, .position {
width: 125px;
}
.status {
width: 100px;
}
}
.clerk-obj-li {
display: flex;
padding: 10px 0;
margin-bottom: 25px;
line-height: 32px;
&:last-child {
margin-bottom: 0;
}
.clerk-name {
width: 130px;
.manager {
display: inline-block;
width: 30px;
height: 15px;
line-height: 16px;
vertical-align: middle;
text-align: center;
background:rgba(247,203,39,1);
border-radius:2px;
color: #fff;
font-size: 10px;
}
}
.clerk-phone, .clerk-position {
width: 125px;
}
.clerk-status {
width: 100px;
.status-icon {
width: 34px;
height: 32px;
line-height: 32px;
text-align: center;
background: #ECF5FF;
border: 1px solid #D9ECFF;
border-radius: 4px;
&.is-active {
color: #409EFF;
}
}
}
}
}
</style>
...@@ -5,38 +5,23 @@ ...@@ -5,38 +5,23 @@
@selection-change="selectMember" @selection-change="selectMember"
@row-click="linkToDetail" @row-click="linkToDetail"
:data="tableData"> :data="tableData">
<template v-for="prop in headList">
<el-table-column <el-table-column
:key="prop"
v-if="prop == 'selection'"
type="selection" type="selection"
width="42"> width="42">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
:key="prop"
v-if="prop == 'name'"
label="姓名" label="姓名"
> prop="name"
<template slot-scope="scope"> ></el-table-column>
<span>{{scope.row.name}}</span>
<span v-if="scope.row.isManager == 1" class="is-manager">部门负责人</span>
</template>
</el-table-column>
<el-table-column <el-table-column
:key="prop"
v-if="prop == 'phoneNumber'"
label="手机号" label="手机号"
prop="phoneNumber" prop="phoneNumber"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
:key="prop"
v-if="prop == 'positionName'"
label="职位" label="职位"
prop="positionName" prop="positionName"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
:key="prop"
v-if="prop == 'activationStatus'"
label="状态" label="状态"
> >
<template slot-scope="scope"> <template slot-scope="scope">
...@@ -45,7 +30,6 @@ ...@@ -45,7 +30,6 @@
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</template>
</el-table> </el-table>
</div> </div>
</template> </template>
...@@ -62,10 +46,15 @@ export default { ...@@ -62,10 +46,15 @@ export default {
headList: { headList: {
type: Array, type: Array,
default() { default() {
return ["name", "phoneNumber", "positionName", "activationStatus"]; return ["selection", "name", "phoneNumber", "positionName", "activationStatus"];
} }
} }
}, },
data() {
return {
tableData: []
};
},
methods: { methods: {
/** /**
* table选择员工 * table选择员工
...@@ -81,14 +70,12 @@ export default { ...@@ -81,14 +70,12 @@ export default {
window.location.href = "#/employee?employeeClerkId="+row.employeeClerkId; window.location.href = "#/employee?employeeClerkId="+row.employeeClerkId;
} }
}, },
computed: { mounted() {
tableData() { let arr = [];
let arr = []; this.employeeList.forEach(clerk => {
this.employeeList.forEach(clerk => { arr.push(clerk.ext.employeeClerk);
arr.push(clerk.ext.employeeClerk); });
}); this.tableData = arr;
return arr;
}
} }
}; };
</script> </script>
......
<template>
<div class="guid-div">
<div class="guid">
<p class="title">共享通讯录操作引导</p>
<div class="flex-div">
<div class="step">
<img src="../../../assets/guid1.png">
<p>点击建立共享企业,下载二维码 发给所要建立共享的企业</p>
</div>
<div class="step">
<img src="../../../assets/guid2.png">
<p>从企业通讯录中添加对方可见我方 企业的成员及门店</p>
</div>
<div class="step">
<img src="../../../assets/guid3.png">
<p>添加完成之后必须点击发布,所添加或 修改的信息才会同步至对方共享通讯录中</p>
</div>
</div>
</div>
<div class="guid">
<p class="des">应用场景</p>
<p class="des">适用于集团公司与子公司建立通讯录部分成员共享机制</p>
<p class="des">适用于总部与代理商、加盟商建立通讯录部分成员共享机制</p>
</div>
<div style="text-align: center;margin-top:50px;">
<a href="#/shareCode">
<el-button type="primary">建立共享企业</el-button>
</a>
</div>
</div>
</template>
<style lang="scss">
.guid-div {
width: 100%;
height:690px;
box-sizing: border-box;
background:rgba(255,255,255,1);
border-radius:2px;
padding: 30px;
.guid {
width:100%;
box-sizing: border-box;
background:rgba(255,255,255,1);
border:1px solid rgba(235,238,245,1);
border-radius:4px;
padding: 30px;
margin-bottom: 24px;
font-size:14px;
color:rgba(96,98,102,1);
.des {
text-align: center;
margin-bottom: 30px;
&:first-child {
font-size: 16px;
margin-bottom: 44px;
}
}
.title {
font-size:16px;
font-weight:500;
color:rgba(48,49,51,1);
margin-bottom: 50px;
text-align: center;
}
.flex-div {
display: flex;
.step {
flex: 1;
text-align: center;
height: 200px;
img {
height: 96px;
}
p {
width:260px;
height:34px;
line-height:24px;
margin: 40px auto 0;
}
}
}
}
}
</style>
<template> <template>
<div> <div>
<div class="sf-right-button-box"> <div class="sf-right-button-box common-right-button-box">
<el-select v-model="storeType" @change="selectByType" size="small"> <el-select v-model="storeType" @change="selectByType" size="small">
<el-option <el-option
v-for="(type, index) in typeArr" v-for="(type, index) in typeArr"
......
<template> <template>
<div> <div>
<div class="sf-right-button-box"> <div class="common-right-button-box">
<a href="#/storeInfo"> <a href="#/storeInfo">
<el-button type="primary">添加门店</el-button> <el-button type="primary">添加门店</el-button>
</a> </a>
......
<template> <template>
<div class="administrative-estrutura-container"> <div class="administrative-estrutura-container common-frame-container">
<search-menu <search-menu
@handleSearchKey="handleSearchKey" @handleSearchKey="handleSearchKey"
@handleTreeSelection="handleTreeSelection" @handleTreeSelection="handleTreeSelection"
...@@ -8,10 +8,10 @@ ...@@ -8,10 +8,10 @@
@handleEmployeeSelection="handleEmployeeSelection"> @handleEmployeeSelection="handleEmployeeSelection">
</search-menu> </search-menu>
<employee-info v-if="showEmployee == 'employee'" :info="selectedEmployee"></employee-info> <employee-info v-if="showEmployee == 'employee'" :info="selectedEmployee"></employee-info>
<div class="af-right-container" <div class="af-right-container common-right-container"
v-loading="loading" v-loading="loading"
v-else> v-else>
<div class="af-right-header"> <div class="af-right-header common-right-header">
<span class="title-span">{{groupInfo.groupName}}{{total}}人)</span> <span class="title-span">{{groupInfo.groupName}}{{total}}人)</span>
<span class="id-span">部门ID: {{groupInfo.departmentId}}</span> <span class="id-span">部门ID: {{groupInfo.departmentId}}</span>
<span class="handle-area"> <span class="handle-area">
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<el-button @click="goToEdit(groupInfo.level)" :href="'#/addGroup?groupId='+groupInfo.departmentId" :disabled="groupInfo.hasPression != 1" class="no-bdr-btn">编辑</el-button> <el-button @click="goToEdit(groupInfo.level)" :href="'#/addGroup?groupId='+groupInfo.departmentId" :disabled="groupInfo.hasPression != 1" class="no-bdr-btn">编辑</el-button>
</span> </span>
</div> </div>
<div class="af-right-button-box"> <div class="af-right-button-box common-right-button-box">
<a :href="'#/employee?addnew=1&departmentId='+groupInfo.departmentId"> <a :href="'#/employee?addnew=1&departmentId='+groupInfo.departmentId">
<el-button type="primary">添加成员</el-button> <el-button type="primary">添加成员</el-button>
</a> </a>
...@@ -272,7 +272,7 @@ ...@@ -272,7 +272,7 @@
margin: 0 10px; margin: 0 10px;
vertical-align: sub; vertical-align: sub;
} }
.no-bdr-btn { .no-bdr-btn {
background: none; background: none;
color: #409EFF; color: #409EFF;
border: none; border: none;
......
<template> <template>
<div class="administrative-estrutura-container"> <div class="administrative-estrutura-container">
<search-menu <template v-if="menuData.length > 0">
@handleSearchKey="handleSearchKey" <search-menu
@handleTreeSelection="handleTreeSelection" @handleSearchKey="handleSearchKey"
:treeData="menuData" @handleTreeSelection="handleTreeSelection"
:searchResult="searchResult" :treeData="menuData"
@handleEmployeeSelection="handleEmployeeSelection"> :searchResult="searchResult"
</search-menu> @handleEmployeeSelection="handleEmployeeSelection">
<employee-info v-if="showEmployee == 'employee'" :info="selectedEmployee"></employee-info> </search-menu>
<div class="af-right-container" <employee-info v-if="showEmployee == 'employee'" :info="selectedEmployee"></employee-info>
v-loading="loading" <div class="af-right-container"
v-else> v-loading="loading"
<div class="af-right-header"> v-else-if="groupInfo.isStoreGroup != 1 && groupInfo.level !=0">
<span class="title-span">{{groupInfo.groupName}}{{total}}人)</span> <div class="af-right-header">
<span class="id-span">部门ID: {{groupInfo.departmentId}}</span> <span class="title-span">{{groupInfo.groupName}}{{total}}人)<span class="not-show-app">本企业通讯录APP中不展示</span></span>
<span class="handle-area"> <template v-if="!!groupInfo.isMine">
<a :href="'#/addDepartment?addnew=1&departmentId='+groupInfo.departmentId" class="J_add-child a-href">添加子部门</a> <span class="handle-area" v-if="groupInfo.isStoreGroup == 1">
<span class="hurdle"></span> <a class="a-href" :href="'#/addGroup?addnew=1&groupId='+groupInfo.departmentId">添加子分组</a>
<a :href="'#/addDepartment?departmentId='+groupInfo.departmentId" class="J_edit a-href">编辑</a> <span class="hurdle"></span>
</span> <a class="a-href" :href="'#/addGroup?groupId='+groupInfo.departmentId">编辑</a>
</span>
<span class="handle-area" v-else>
<a :href="'#/addDepartment?addnew=1&departmentId='+groupInfo.departmentId" class="J_add-child a-href">添加子部门</a>
<template v-if="groupInfo.level != 0">
<span class="hurdle"></span>
<a :href="'#/addDepartment?departmentId='+groupInfo.departmentId" class="J_edit a-href">编辑</a>
</template>
</span>
</template>
</div>
<div class="af-right-button-box">
<template v-if="!!groupInfo.isMine">
<a href="#/storeInfo" v-if="groupInfo.isStoreGroup == 1">
<el-button type="primary">添加门店</el-button>
</a>
<a v-else :href="'#/employee?addnew=1&departmentId='+groupInfo.departmentId">
<el-button type="primary">添加成员</el-button>
</a>
<el-button type="danger" plain @click="delMembers" :disabled="disabledDel">批量删除</el-button>
</template>
<el-button class="J_show-children"><el-checkbox class="m-r-10" v-model="showChildMember" @change="setChildMemberShow"></el-checkbox><a class="a-href">显示子成员</a></el-button>
</div>
<clerk-view v-if="groupInfo.isStoreGroup == 1" :tableData="employeeList"></clerk-view>
<employee-list v-else :employeeList="employeeList" @selectMember="selectMember"></employee-list>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="[20, 40, 60, 80]"
:page-size="pageSize"
:current-page="currentPage"
layout="total, sizes, prev, pager, next"
:total="total">
</el-pagination>
</div>
</div> </div>
<div class="af-right-button-box"> <div class="af-right-container" v-else-if="groupInfo.isStoreGroup == 1 && groupInfo.level ==0">
<el-button type="primary">添加成员</el-button> <p>共享门店及成员数据</p>
<el-button type="danger" plain @click="delMembers" :disabled="disabledDel">批量删除</el-button> <el-checkbox-group v-model="checkList">
<el-button class="J_show-children"><el-checkbox class="m-r-10" v-model="showChildMember" @change="setChildMemberShow"></el-checkbox><a class="a-href">显示子成员</a></el-button> <el-checkbox label="sale">销售数据</el-checkbox>
<el-checkbox label="vip">会员数据</el-checkbox>
</el-checkbox-group>
</div> </div>
<employee-list :employeeList="employeeList" @selectMember="selectMember"></employee-list> </template>
<div class="pagination"> <template v-else>
<el-pagination <guid-div></guid-div>
background </template>
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="[20, 40, 60, 80]"
:page-size="pageSize"
:current-page="currentPage"
layout="total, sizes, prev, pager, next"
:total="total">
</el-pagination>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import searchMenu from "components/contacts/searchMenu"; import searchMenu from "components/contacts/share/searchMenu";
import employeeInfo from "components/contacts/employeeInfo"; import employeeInfo from "components/contacts/employeeInfo";
import employeeList from "components/contacts/share/employeeList"; import employeeList from "components/contacts/share/employeeList";
import clerkView from "components/contacts/share/clerkView";
import guidDiv from "components/contacts/share/guid";
import { getRequest, postRequest, postJsonRequest, postJson } from '@/api/api'; import { getRequest, postRequest, postJsonRequest, postJson } from '@/api/api';
export default { export default {
name: "administrativeEstrutura", name: "shareContact",
components: { components: {
searchMenu, searchMenu,
employeeInfo, employeeInfo,
employeeList employeeList,
guidDiv,
clerkView
}, },
data() { data() {
return { return {
...@@ -70,15 +103,19 @@ ...@@ -70,15 +103,19 @@
employeeList: [], employeeList: [],
searchResult: {}, searchResult: {},
showEmployee: false, showEmployee: false,
selectedEmployee: {} selectedEmployee: {},
checkList: []
}; };
}, },
created() {}, created() {},
beforeMount() { beforeMount() {
this.getGroupData(); this.getGroupData();
this.getEmployee(); // this.getEmployee();
}, },
methods: { methods: {
addSon() {
location.href = '#/addGroup?addnew=1&groupId='+this.groupInfo.departmentId;
},
handleSizeChange(val) { handleSizeChange(val) {
this.pageSize = val; this.pageSize = val;
this.getEmployee(); this.getEmployee();
...@@ -111,6 +148,7 @@ ...@@ -111,6 +148,7 @@
*/ */
handleTreeSelection(obj, node, showEmployee) { handleTreeSelection(obj, node, showEmployee) {
console.log(obj, node, "selection"); console.log(obj, node, "selection");
this.groupInfo = obj;
this.groupInfo.departmentId = obj.groupId; this.groupInfo.departmentId = obj.groupId;
this.groupInfo.groupName = obj.name; this.groupInfo.groupName = obj.name;
this.showEmployee = showEmployee; this.showEmployee = showEmployee;
...@@ -208,7 +246,6 @@ ...@@ -208,7 +246,6 @@
sharedContactGroupId: _this.groupInfo.departmentId, sharedContactGroupId: _this.groupInfo.departmentId,
findChildren: _this.showChildMember, findChildren: _this.showChildMember,
}; };
// params = JSON.stringify(params);
postJson("/haoban-manage-web/shared-contact/find-shared-member", params) postJson("/haoban-manage-web/shared-contact/find-shared-member", params)
.then(res => { .then(res => {
console.log(res, "menmers"); console.log(res, "menmers");
...@@ -216,7 +253,7 @@ ...@@ -216,7 +253,7 @@
let total = 0; let total = 0;
if (res.data.errorCode == 1) { if (res.data.errorCode == 1) {
list = res.data.result.list || []; list = res.data.result.list || [];
total = res.data.result.total || 0; total = res.data.result.pageInfo.total || 0;
} }
_this.employeeList = list; _this.employeeList = list;
_this.total = total; _this.total = total;
...@@ -252,6 +289,10 @@ ...@@ -252,6 +289,10 @@
.title-span { .title-span {
color: #303133; color: #303133;
font-size: 20px; font-size: 20px;
.not-show-app {
font-size:14px;
color:rgba(144,147,153,1);
}
} }
.handle-area { .handle-area {
float: right; float: right;
......
<template> <template>
<div class="store-estrutura-container"> <div class="store-estrutura-container common-frame-container">
<search-menu <search-menu
ref="searchMenu" ref="searchMenu"
:storeFrame="true" :storeFrame="true"
...@@ -24,10 +24,10 @@ ...@@ -24,10 +24,10 @@
</search-menu> </search-menu>
<clerk-info v-if="showEmployee == 'employee'" :clerkInfo="selectedEmployee"></clerk-info> <clerk-info v-if="showEmployee == 'employee'" :clerkInfo="selectedEmployee"></clerk-info>
<store-info ref="store_info" v-else-if="showEmployee == 'store'" :storeInfo="storeInfo"></store-info> <store-info ref="store_info" v-else-if="showEmployee == 'store'" :storeInfo="storeInfo"></store-info>
<div class="sf-right-container" <div class="sf-right-container common-right-container"
v-else v-else
v-loading="loading"> v-loading="loading">
<div class="sf-right-header"> <div class="sf-right-header common-right-header">
<span class="title-span">{{groupInfo.groupName}}({{total}}家)</span> <span class="title-span">{{groupInfo.groupName}}({{total}}家)</span>
<span class="id-span">部门ID: {{groupInfo.departmentId}}</span> <span class="id-span">部门ID: {{groupInfo.departmentId}}</span>
<span class="handle-area"> <span class="handle-area">
...@@ -312,17 +312,4 @@ export default { ...@@ -312,17 +312,4 @@ export default {
} }
}; };
</script> </script>
<style lang="scss">
.handle-area {
.no-bdr-btn {
background: none;
color: #409EFF;
border: none;
}
.el-button.is-disabled, .el-button.is-disabled:hover, .el-button.is-disabled:focus {
background: none;
color: #c0c4cc;
}
}
</style>
...@@ -32,108 +32,117 @@ ...@@ -32,108 +32,117 @@
}*/ }*/
} }
.store-estrutura-container { .common-frame-container {
display: flex; display: flex;
.sf-right-container { .common-right-container {
height: 690px; height: 690px;
background: #fff; background: #fff;
flex: 1; flex: 1;
padding: 0 24px; padding: 0 24px;
.sf-right-header { .common-right-header {
height: 70px; height: 70px;
line-height: 70px; line-height: 70px;
font-weight: 400; font-weight: 400;
font-size: 14px; font-size: 14px;
color: #606266; color: #606266;
.title-span { .title-span {
color: #303133; color: #303133;
font-size: 20px; font-size: 20px;
} }
.handle-area { .handle-area {
float: right; float: right;
.hurdle { .hurdle {
width:1px; width:1px;
height:16px; height:16px;
display: inline-block; display: inline-block;
background: #DCDFE6; background: #DCDFE6;
margin: 0 10px; margin: 0 10px;
vertical-align: sub; vertical-align: sub;
} }
} .no-bdr-btn {
} background: none;
.tab-div { color: #409EFF;
margin-bottom: 20px; border: none;
} }
.sf-right-button-box { .el-button.is-disabled, .el-button.is-disabled:hover, .el-button.is-disabled:focus {
padding: 8px 15px; background: none;
background: #EBEEF5; color: #c0c4cc;
font-size: 0; }
.el-select--small { }
width: 120px; }
margin-right: 10px; .tab-div {
} margin-bottom: 20px;
.el-button { }
margin-right: 10px; .common-right-button-box {
} padding: 8px 15px;
} background: #EBEEF5;
.pagination { font-size: 0;
margin-top: 30px; .el-select--small {
text-align: right; width: 120px;
} margin-right: 10px;
.diy-table { }
.diy-header { .el-button {
display: flex; margin-right: 10px;
.name { }
width: 130px; }
} .pagination {
.phone, .position { margin-top: 30px;
width: 125px; text-align: right;
} }
.status { .diy-table {
width: 100px; .diy-header {
} display: flex;
} .name {
.clerk-obj-li { width: 130px;
display: flex; }
padding: 10px 0; .phone, .position {
margin-bottom: 25px; width: 125px;
line-height: 32px; }
&:last-child { .status {
margin-bottom: 0; width: 100px;
} }
.clerk-name { }
width: 130px; .clerk-obj-li {
.manager { display: flex;
display: inline-block; padding: 10px 0;
width: 30px; margin-bottom: 25px;
height: 15px; line-height: 32px;
line-height: 16px; &:last-child {
vertical-align: middle; margin-bottom: 0;
text-align: center; }
background:rgba(247,203,39,1); .clerk-name {
border-radius:2px; width: 130px;
color: #fff; .manager {
font-size: 10px; display: inline-block;
} width: 30px;
} height: 15px;
.clerk-phone, .clerk-position { line-height: 16px;
width: 125px; vertical-align: middle;
} text-align: center;
.clerk-status { background:rgba(247,203,39,1);
width: 100px; border-radius:2px;
.status-icon { color: #fff;
width: 34px; font-size: 10px;
height: 32px; }
line-height: 32px; }
text-align: center; .clerk-phone, .clerk-position {
background: #ECF5FF; width: 125px;
border: 1px solid #D9ECFF; }
border-radius: 4px; .clerk-status {
&.is-active { width: 100px;
color: #409EFF; .status-icon {
} width: 34px;
} height: 32px;
} line-height: 32px;
text-align: center;
background: #ECF5FF;
border: 1px solid #D9ECFF;
border-radius: 4px;
&.is-active {
color: #409EFF;
}
}
}
} }
} }
} }
......
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