|
|
@ -3,8 +3,17 @@ |
|
|
|
<view class="em-content"> |
|
|
|
<view class="ec-search"> |
|
|
|
<view> |
|
|
|
<input placeholder="请输入" /> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/round_close.png"></image> |
|
|
|
<image v-if="!isInputFocus" mode="aspectFit" src="/static/images/icon/search.png"></image> |
|
|
|
<input |
|
|
|
@blur="iptOnBlur" |
|
|
|
@focus="iptOnFocus" |
|
|
|
@confirm="confirmSearch" |
|
|
|
confirm-type="search" |
|
|
|
type="text" |
|
|
|
placeholder="请输入要搜索的员工名字" |
|
|
|
v-model="searchTxt" |
|
|
|
/> |
|
|
|
<image @click="cleanIpt" v-if="isInputFocus" mode="aspectFit" src="/static/images/icon/round_close.png"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="ec-info"> |
|
|
@ -15,14 +24,14 @@ |
|
|
|
<view class="ei-tip" @click="toReview"> |
|
|
|
<text>待审核员工</text> |
|
|
|
<view> |
|
|
|
<view>222</view> |
|
|
|
<view v-if="employeeInfo.count>0">{{employeeInfo.count || 0}}</view> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="ei-user"> |
|
|
|
<view> |
|
|
|
<image></image> |
|
|
|
<view class="eu-name">胡雪儿</view> |
|
|
|
<image mode="aspectFill" :src="employeeInfo.admin.avatar_url || ''"></image> |
|
|
|
<view class="eu-name">{{employeeInfo.admin.actual_name || '-'}}</view> |
|
|
|
<view class="eu-tag">超级管理员</view> |
|
|
|
</view> |
|
|
|
<view hover-class="hover-active" @click="changeAdmin">更换</view> |
|
|
@ -31,26 +40,27 @@ |
|
|
|
<view class="ec-employees"> |
|
|
|
<view class="ec-header"> |
|
|
|
<view> |
|
|
|
<image mode="aspectFit" src=""></image> |
|
|
|
<view>员工总数 <text>3</text></view> |
|
|
|
<image mode="aspectFit" src="/static/images/icon/people.png"></image> |
|
|
|
<view>员工总数 <text>{{employeeInfo.total || 0}}</text></view> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<text @click="toFilter">筛选</text> |
|
|
|
<text>删除</text> |
|
|
|
<text class="active">取消</text> |
|
|
|
<text v-if="!isDeleteOperate" @click="openDeleteOperate">删除</text> |
|
|
|
<text class="active" v-if="isDeleteOperate" @click="cancelDeleteOperate">取消</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="ec-lists"> |
|
|
|
<view class="el-item" v-for="k in employeeList" :key="k.id" @click="toAuthority"> |
|
|
|
<view class="el-item" v-for="k in employeeInfo.employee" :key="k.id" @click="toAuthority(k)"> |
|
|
|
<view> |
|
|
|
<image class="ei-icon"></image> |
|
|
|
<image :class="['ei-icon', k.isDelete?'active':'']" mode="aspectFit" :src="k.isDelete?'/static/images/icon/selected_987.png':''" v-if="isDeleteOperate"></image> |
|
|
|
<image class="ei-avatar" mode="aspectFill" :src="k.avatar_url"></image> |
|
|
|
<view class="ei-info"> |
|
|
|
<view>{{k.actual_name}}</view> |
|
|
|
<view class="ei-author"> |
|
|
|
<view>权限:</view> |
|
|
|
<view> |
|
|
|
<view v-for="e in 2" :key="e">场馆订{{e}}</view> |
|
|
|
<view class="tag-active" v-if="k.extension.permission.menu.length == 9">全部权限</view> |
|
|
|
<view v-else v-for="e in k.extension.permission.menu" :key="e">{{permissionObj[e] || ''}}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
@ -59,12 +69,12 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="ec-fixed-bot"> |
|
|
|
<view> |
|
|
|
<image></image> |
|
|
|
<view class="ec-fixed-bot" v-if="isDeleteOperate"> |
|
|
|
<view @click="selectAllDelete"> |
|
|
|
<image :class="isSelectedAllDelete?'img-active':''" :src="isSelectedAllDelete?'/static/images/icon/selected_987.png':''"></image> |
|
|
|
<text>全选</text> |
|
|
|
</view> |
|
|
|
<view hover-class="hover-active">移除</view> |
|
|
|
<view hover-class="hover-active" @click="employeeDelete">移除</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
@ -73,21 +83,124 @@ |
|
|
|
import { API } from '../../../js/api'; |
|
|
|
import { servers } from '../../../js/server'; |
|
|
|
import util from '../../../utils/util' |
|
|
|
import { mapState } from 'vuex'; |
|
|
|
export default { |
|
|
|
computed: { |
|
|
|
...mapState([ 'permissionObj', 'brandInfo' ]), |
|
|
|
}, |
|
|
|
data(){ |
|
|
|
return { |
|
|
|
employeeList: [], |
|
|
|
isDeleteOperate: false, // 是否展开删除员工操作 |
|
|
|
isSelectedAllDelete: false, // 全选删除 |
|
|
|
isInputFocus: false, |
|
|
|
searchTxt: '', |
|
|
|
employeeInfo: { |
|
|
|
admin: {}, // 超管信息 |
|
|
|
employee: [], // 员工列表 |
|
|
|
count: 0, // 待审核人数 |
|
|
|
total: 0 // 员工总数 |
|
|
|
}, |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(){ |
|
|
|
this.getEmployeeList({}) |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 移除员工 |
|
|
|
employeeDelete: util.debounce(function(){ |
|
|
|
let _employeeList = this.employeeInfo.employee || []; |
|
|
|
console.log(_employeeList); |
|
|
|
let _deleteArr = _employeeList.filter(ele=>{ |
|
|
|
if(ele.isDelete)return ele; |
|
|
|
}) |
|
|
|
// if(_deleteArr.length<=0)return util.showNone('请选择要删除的员工!'); |
|
|
|
let ids = _deleteArr.map(ele=>ele.id) |
|
|
|
console.log(ids) |
|
|
|
util.showModal({ |
|
|
|
title: '提示', |
|
|
|
content: '移除后,改员工将无法登录和使用欧轩智能商家助手小程序', |
|
|
|
showCancel: true, |
|
|
|
success: sucRes=>{ |
|
|
|
if(sucRes.confirm){ |
|
|
|
util.showLoad(); |
|
|
|
servers.get({ |
|
|
|
url: API.employee.employeeDelete, |
|
|
|
data: { |
|
|
|
id: ids.join(',') |
|
|
|
}, |
|
|
|
isDefaultGet: false |
|
|
|
}) |
|
|
|
.then(res=>{ |
|
|
|
util.hideLoad(); |
|
|
|
if(res.data.code == 0){ |
|
|
|
this.cancelDeleteOperate(); |
|
|
|
util.showNone(res.data.message || '操作成功!'); |
|
|
|
setTimeout(_=>{ |
|
|
|
this.refreshEmployList() |
|
|
|
},1200) |
|
|
|
}else{ |
|
|
|
util.showNone(res.data.message || '操作失败!'); |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(util.hideLoad) |
|
|
|
} |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
},300,300), |
|
|
|
// 确认搜索 |
|
|
|
confirmSearch(){ |
|
|
|
let { searchTxt } = this; |
|
|
|
this.getEmployeeList({ |
|
|
|
key: searchTxt, |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 清除搜索输入 |
|
|
|
cleanIpt(){ |
|
|
|
this.searchTxt = ''; |
|
|
|
}, |
|
|
|
|
|
|
|
iptOnBlur(){ |
|
|
|
this.isInputFocus = false; |
|
|
|
}, |
|
|
|
iptOnFocus(){ |
|
|
|
this.isInputFocus = true; |
|
|
|
}, |
|
|
|
// 移除操作-> 全选 |
|
|
|
selectAllDelete(){ |
|
|
|
let { isSelectedAllDelete } = this; |
|
|
|
this.isSelectedAllDelete = !isSelectedAllDelete; |
|
|
|
this.deleteSelect({ |
|
|
|
isAll: true, |
|
|
|
allBol : !isSelectedAllDelete |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 取消移除操作 |
|
|
|
cancelDeleteOperate(){ |
|
|
|
this.isDeleteOperate = false; |
|
|
|
this.isSelectedAllDelete = false; |
|
|
|
this.deleteSelect({ |
|
|
|
isAll: true, |
|
|
|
allBol : false |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 打开移除操作 |
|
|
|
openDeleteOperate(){ |
|
|
|
this.isDeleteOperate = true; |
|
|
|
}, |
|
|
|
refreshEmployList(){ |
|
|
|
let { searchTxt } = this; |
|
|
|
this.getEmployeeList({ |
|
|
|
key: searchTxt |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 获取员工列表 |
|
|
|
getEmployeeList({ |
|
|
|
stadium_id='', |
|
|
|
menu='', |
|
|
|
key='', |
|
|
|
}){ |
|
|
|
util.showLoad(); |
|
|
|
servers.get({ |
|
|
|
url: API.employee.employeeList, |
|
|
|
data: { |
|
|
@ -98,24 +211,63 @@ export default { |
|
|
|
isDefaultGet: false, |
|
|
|
}) |
|
|
|
.then(res=>{ |
|
|
|
if(res.data.code == 0){ |
|
|
|
this.employeeList = res.data.data.data || []; |
|
|
|
util.hideLoad(); |
|
|
|
let _data = res.data; |
|
|
|
if(_data.code == 0){ |
|
|
|
this.employeeInfo = _data.data; |
|
|
|
}else{ |
|
|
|
util.showNone(res.data.message || '加载失败!'); |
|
|
|
util.showNone(_data.message || '加载失败!'); |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(util.hideLoad) |
|
|
|
}, |
|
|
|
// 跳转邀请二维码 |
|
|
|
addEmployee(){ |
|
|
|
util.routeTo(`/pages/employee/invite_code/invite_code`, 'nT'); |
|
|
|
}, |
|
|
|
// 更换超管 |
|
|
|
changeAdmin(){ |
|
|
|
util.routeTo(`/pages/employee/change_admin/change_admin`, 'nT'); |
|
|
|
let { brandInfo } = this; |
|
|
|
util.routeTo(`/pages/employee/change_admin/change_admin?brand_id=${brandInfo.brand.id}`, 'nT'); |
|
|
|
}, |
|
|
|
// 筛选 |
|
|
|
toFilter(){ |
|
|
|
util.routeTo(`/pages/employee/authority_filter/authority_filter`, 'nT'); |
|
|
|
}, |
|
|
|
toAuthority(){ |
|
|
|
util.routeTo(`/pages/employee/authority_select/authority_select`, 'nT'); |
|
|
|
// 员工修改权限 |
|
|
|
toAuthority(item){ |
|
|
|
let { isDeleteOperate, brandInfo } = this; |
|
|
|
if(isDeleteOperate)return this.deleteSelect({ item }); |
|
|
|
console.log(brandInfo); |
|
|
|
console.log(item); |
|
|
|
let _query = { |
|
|
|
type: 'singleEdit', |
|
|
|
brand_id: brandInfo.brand.id, |
|
|
|
userInfo: { |
|
|
|
id: item.id, |
|
|
|
name: item.actual_name, |
|
|
|
avatar_url: item.avatar_url, |
|
|
|
mobile: item.mobile, |
|
|
|
}, |
|
|
|
tags: item.extension.permission.tags || [], // 门店权限 |
|
|
|
menu: item.extension.permission.menu || [], // 小程序权限 |
|
|
|
} |
|
|
|
|
|
|
|
util.routeTo(`/pages/employee/authority_select/authority_select?query=${util.jsonStr(_query)}`, 'nT'); |
|
|
|
}, |
|
|
|
//删除选择 |
|
|
|
deleteSelect({ item={}, isAll=false, allBol=false}){ |
|
|
|
let employee = this.employeeInfo.employee || []; |
|
|
|
let _employee = employee.slice(); |
|
|
|
_employee.forEach((e,i)=>{ |
|
|
|
if(isAll)return e.isDelete = allBol |
|
|
|
if(e.id == item.id){ |
|
|
|
if(e.isDelete)this.isSelectedAllDelete = false; |
|
|
|
e.isDelete = e.isDelete ? false : true; |
|
|
|
} |
|
|
|
}) |
|
|
|
this.employeeInfo.employee = _employee; |
|
|
|
this.$nextTick(_=>this.$forceUpdate()); |
|
|
|
}, |
|
|
|
toReview(){ |
|
|
|
util.routeTo(`/pages/employee/review_list/review_list`, 'nT'); |
|
|
@ -126,9 +278,9 @@ export default { |
|
|
|
<style lang="scss" scoped> |
|
|
|
@import "../../../style/public.scss"; |
|
|
|
.em-content{ |
|
|
|
padding-bottom: 96upx; |
|
|
|
padding-bottom: calc( 96upx + constant(safe-area-inset-bottom)); |
|
|
|
padding-bottom: calc( 96upx + env(safe-area-inset-bottom)); |
|
|
|
padding-bottom: 100upx; |
|
|
|
padding-bottom: calc( 100upx + constant(safe-area-inset-bottom)); |
|
|
|
padding-bottom: calc( 100upx + env(safe-area-inset-bottom)); |
|
|
|
.ec-search{ |
|
|
|
margin-bottom: 16upx; |
|
|
|
height: 144upx; |
|
|
@ -148,7 +300,14 @@ export default { |
|
|
|
color: #1a1a1a; |
|
|
|
} |
|
|
|
>image{ |
|
|
|
margin-right: 20upx; |
|
|
|
flex-shrink: 0; |
|
|
|
width: 40upx; |
|
|
|
height: 40upx; |
|
|
|
} |
|
|
|
>input+image{ |
|
|
|
margin-left: 20upx; |
|
|
|
margin-right: 0; |
|
|
|
flex-shrink: 0; |
|
|
|
width: 32upx; |
|
|
|
height: 32upx; |
|
|
@ -217,7 +376,6 @@ export default { |
|
|
|
width: 80upx; |
|
|
|
height: 80upx; |
|
|
|
border-radius: 10upx; |
|
|
|
background-color: skyblue; |
|
|
|
} |
|
|
|
.eu-name{ |
|
|
|
max-width: 40%; |
|
|
@ -266,9 +424,9 @@ export default { |
|
|
|
>image{ |
|
|
|
flex-shrink: 0; |
|
|
|
margin-right: 12upx; |
|
|
|
margin-bottom: -4upx; |
|
|
|
width: 48upx; |
|
|
|
height: 48upx; |
|
|
|
background-color: $themeColor; |
|
|
|
} |
|
|
|
>view{ |
|
|
|
flex-grow: 1; |
|
|
@ -320,6 +478,9 @@ export default { |
|
|
|
height: 40upx; |
|
|
|
border: 2upx solid #d8d8d8; |
|
|
|
border-radius: 50%; |
|
|
|
&.active{ |
|
|
|
border: 2upx solid transparent; |
|
|
|
} |
|
|
|
} |
|
|
|
.ei-avatar{ |
|
|
|
flex-shrink: 0; |
|
|
@ -327,7 +488,6 @@ export default { |
|
|
|
width: 80upx; |
|
|
|
height: 80upx; |
|
|
|
border-radius: 10upx; |
|
|
|
background-color: tomato; |
|
|
|
} |
|
|
|
.ei-info{ |
|
|
|
flex-grow: 1; |
|
|
@ -340,6 +500,7 @@ export default { |
|
|
|
} |
|
|
|
.ei-author{ |
|
|
|
display: flex; |
|
|
|
|
|
|
|
>view{ |
|
|
|
&:first-child{ |
|
|
|
flex-shrink: 0; |
|
|
@ -364,8 +525,14 @@ export default { |
|
|
|
border: 2upx solid #d8d8d8; |
|
|
|
color: #9C9C9F; |
|
|
|
} |
|
|
|
.tag-active{ |
|
|
|
border: 2upx solid $themeColor !important; |
|
|
|
color: $themeColor !important; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
@ -396,6 +563,9 @@ export default { |
|
|
|
border-radius: 50%; |
|
|
|
border: 2upx solid #D8D8D8; |
|
|
|
} |
|
|
|
.img-active{ |
|
|
|
border: 2upx solid transparent !important; |
|
|
|
} |
|
|
|
>text{ |
|
|
|
line-height: 40upx; |
|
|
|
font-size: 28upx; |
|
|
|