Browse Source

add api

voice
刘嘉炜 5 years ago
parent
commit
7eb382b20d
  1. 4
      src/js/api.js
  2. 35
      src/pages/employee/authority_filter/authority_filter.vue
  3. 282
      src/pages/employee/authority_select/authority_select.vue
  4. 81
      src/pages/employee/change_admin/change_admin.vue
  5. 228
      src/pages/employee/manage/manage.vue
  6. 72
      src/pages/employee/review_list/review_list.vue
  7. BIN
      src/static/images/icon/people.png
  8. BIN
      src/static/images/icon/selected_987.png
  9. 25
      src/store/index.js

4
src/js/api.js

@ -30,6 +30,10 @@ API['employee'] = {
inviteCode:`${ORIGIN}/admin/assistant/qrcode/invite`, // 添加员工二维码
employeeAdd:`${ORIGIN}/assistant/employee/add`, // 添加员工-填写信息
employeeList:`${ORIGIN}/admin/assistant/employee/list`, // 员工列表
employeeDelete:`${ORIGIN}/admin/assistant/employee/delete`, // 移除员工
employeeGrant:`${ORIGIN}/admin/assistant/employee/grant`, // 员工授权
adminReplace:`${ORIGIN}/admin/assistant/replace`, // 更换管理员
employeeUnreview:`${ORIGIN}/admin/assistant/employee/unreview`, // 未审核员工列表
}

35
src/pages/employee/authority_filter/authority_filter.vue

@ -7,26 +7,54 @@
<text>请选择门店</text>
<text>(多项选择)</text>
</view>
<view class="as-select">
<input placeholder="全部" disabled />
<image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image>
</view>
<view class="as-tip">
<text>*</text>
<text>选择门店</text>
<text>小程序权限</text>
<text>(多项选择)</text>
</view>
<view class="as-select">
<input placeholder="全部" disabled />
<image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image>
</view>
</view>
<view class="af-btn" hover-class="hover-active">筛选</view>
</view>
</template>
<script>
import { API } from '../../../js/api'
import { servers } from '../../../js/server'
export default {
data(){
return {
storeList: [],
}
},
onLoad(){
this.getStoreList();
},
methods: {
getStoreList(brand_id=37){
servers.get({
url: API.stadiumList,
data: {
brand_id,
},
failMsg: '加载店铺列表失败!',
})
.then(res=>{
let _list = res.list || [];
this.storeList = _list;
})
}
}
}
</script>
<style lang="scss" scoped>
@ -60,6 +88,9 @@ export default {
}
}
}
>picker{
width: 100%;
}
.as-select{
padding-left: 20upx;
padding-right: 34upx;

282
src/pages/employee/authority_select/authority_select.vue

@ -1,11 +1,11 @@
<template>
<view class="authority-select">
<view class="as-contetnt">
<view class="ac-user">
<image></image>
<view class="ac-user" v-if="options_query.type == 'singleReview' || options_query.type == 'singleEdit'">
<image mode="aspectFill" :src="options_query.userInfo.avatar_url || ''"></image>
<view class="au-info">
<view>周小舞</view>
<view>电话 18098765331</view>
<view>{{options_query.userInfo.name || '-'}}</view>
<view>电话 {{options_query.userInfo.mobile || '-'}}</view>
</view>
</view>
<view class="ac-shop-author">
@ -13,48 +13,241 @@
<view>门店权限 </view>
<view>
<view>全选</view>
<switch color="#009874"></switch>
<switch @change="storeAllSelect" color="#009874"></switch>
</view>
</view>
<view class="asa-author-list">
<view class="aal-line">
<view>欧轩智能羽毛球馆(永泰店)</view>
<switch color="#009874"></switch>
</view>
<view class="aal-line">
<view>欧轩智能羽毛球馆(永泰店)</view>
<switch color="#009874"></switch>
<view class="aal-line" v-for="e in storeList" :key="e.id">
<view>{{e.name}}</view>
<switch :data-item="e" @change="storeSelect" :checked="!!e.isChecked" color="#009874"></switch>
</view>
</view>
</view>
<view class="ac-app-author">
<view class="ac-select-all">
<view>小程序权限 </view>
<view>
<view >
<view>全选</view>
<switch color="#009874"></switch>
<switch @change="appAllSelect" color="#009874"></switch>
</view>
</view>
<view class="aaa-list">
<view class="al-item" v-for="e in 4" :key="e">
<view>
<text>营业额</text>
<switch color="#009874"></switch>
</view>
<view>
<text>营业额</text>
<switch color="#009874"></switch>
</view>
<view class="al-item" v-for="e in appPermissionArr" :key="e.key">
<text>{{e.name}}</text>
<switch :data-item="e" @change="appSelect" :checked="!!e.isChecked" color="#009874"></switch>
</view>
</view>
</view>
<view class="ac-cancel" hover-class="hover-active">移除员工</view>
<view v-if="options_query.type == 'singleEdit'" class="ac-btn green" hover-class="hover-active" @click="saveEdit">保存</view>
<view v-if="options_query.type == 'singleEdit'" class="ac-btn red" hover-class="hover-active" @click="deleteEmployee">移除员工</view>
<view v-if="options_query.type == 'singleReview' || options_query.type == 'multipleReview'" class="ac-btn green" hover-class="hover-active">审核通过</view>
<view
v-if="options_query.type == 'singleReview'"
class="ac-btn"
hover-class="hover-active"
>不通过</view>
</view>
</view>
</template>
<script>
import util from '../../../utils/util';
import { mapGetters } from 'vuex';
import { servers } from '../../../js/server';
import { API } from '../../../js/api';
export default {
computed: {
...mapGetters([ 'permissionArr' ]),
},
data(){
return {
storeList: [],
appPermissionArr: [],
options_query: {
userInfo: {},
type: '', // singleEdit-> / singleReview -> / multipleReview ->
},
}
},
onLoad(options){
let _query = util.jsonPar(options.query);
this.options_query= _query;
//
this.getStoreList({
brand_id: _query.brand_id,
tags: _query.tags
});
//
this.appPermissionArr = this.formatAppSelected({
list: this.permissionArr,
menu: _query.menu
});
},
methods: {
formatAppSelected({
list=[],
menu=[],
}){
return list.map(ele=>{
if(menu.some(e=>e == ele.key))ele.isChecked = true;
return ele;
})
},
//
deleteEmployee(){
let { options_query } = this;
util.showModal({
title: '确认移除改员工吗?',
content: '移除后,改员工将无法登录和使用欧轩智能商家助手小程序',
showCancel: true,
success: sucRes=>{
if(sucRes.confirm){
servers.get({
url: API.employee.employeeDelete,
data: {
id: [options_query.userInfo.id]
},
isDefaultGet: false
})
.then(res=>{
if(res.data.code == 0){
util.showNone(res.data.message || '操作成功!');
setTimeout(_=>{
util.previousPageFunction({
fnName: 'refreshEmployList',
query: null
})
},1200)
}else{
util.showNone(res.data.message || '操作失败!');
}
})
}
}
})
},
//
saveEdit: util.debounce(function(){
let { appPermissionArr, storeList, options_query } = this;
let stadium_ids = storeList.filter(ele=>ele.isChecked).map(e=>e.id);
let menus = appPermissionArr.filter(ele=>ele.isChecked).map(e=>e.key);
util.showLoad();
servers.get({
url: API.employee.employeeGrant,
data: {
brand_id: options_query.brand_id,
user_id: options_query.userInfo.id,
stadium_ids: stadium_ids.join(','),
menus: menus.join(','),
},
isDefaultGet: false,
})
.then(e=>{
util.hideLoad();
if(e.data.code == 0){
util.showModal({
title: '修改权限成功',
content: e.data.message || '您可以在员工管理员中查看修改员工设置',
confirmText: '完成',
success: modRes=>{
if(modRes.confirm){
util.previousPageFunction({
fnName: 'refreshEmployList',
query: null
})
}
}
})
}else{
util.showNone(e.data.message || '操作失败!')
}
})
.catch(util.hideLoad)
},300,300),
//
storeAllSelect(e){
this.changeStorePermission({
isAll: true,
bol: e.detail.value,
})
},
//
storeSelect(e){
let curItem = e.currentTarget.dataset.item || {};
this.changeStorePermission({
ID: curItem.id,
isAll: false,
bol: e.detail.value,
})
},
//
changeStorePermission({
ID='',
isAll=false,
bol=false,
}){
let { storeList } = this;
this.storeList = storeList.slice().map(ele=>{
if(isAll)ele.isChecked = bol
if(ID == ele.id)ele.isChecked = bol;
return ele
})
},
//
appAllSelect(e){
this.changeAppPermission({
isAll: true,
bol: e.detail.value,
})
},
//
appSelect(e){
let curItem = e.currentTarget.dataset.item || {};
this.changeAppPermission({
key: curItem.key,
isAll: false,
bol: e.detail.value,
})
},
//
changeAppPermission({ key='', isAll=false, bol=false }){
let _arr = this.appPermissionArr || [];
this.appPermissionArr = _arr.slice().map(ele=>{
if(isAll)ele.isChecked = bol
if(key == ele.key)ele.isChecked = bol;
return ele
})
},
getStoreList({ brand_id, tags }){
util.showLoad();
servers.get({
url: API.stadiumList,
data: {
brand_id,
},
failMsg: '加载店铺列表失败!',
})
.then(res=>{
util.hideLoad();
let _list = res.list || [];
this.storeList = this.formatStoreSelected({ list: _list, tags });
})
.catch(util.hideLoad)
},
//
formatStoreSelected({
list=[],
tags=[]
}){
return list.map(ele=>{
if(tags.some(e=>e == ele.id))ele.isChecked = true;
return ele;
})
}
},
}
</script>
<style lang="scss" scoped>
@ -72,7 +265,6 @@ export default {
width: 112upx;
height: 112upx;
border-radius: 10upx;
background-color: skyblue;
}
.au-info{
>view{
@ -120,19 +312,26 @@ export default {
border-radius: 10upx;
.aaa-list{
padding: 0 30upx;
display: flex;
flex-wrap: wrap;
.al-item{
height: 116upx;
@include centerFlex(space-between);
&:not(:last-child){
border-bottom: 2upx solid #D8D8D8;
width: 50%;
flex-shrink: 0;
flex-grow: 1;
border-bottom: 2upx solid #D8D8D8;
@include centerFlex(flex-start);
&:nth-child(2n){
justify-content: flex-end;
}
>view{
>text{
margin-right: 50upx;
line-height: 44upx;
font-size: 32upx;
color: #1a1a1a;
}
&:last-child{
border-bottom: none;
}
>text{
margin-right: 20upx;
line-height: 44upx;
font-size: 32upx;
color: #1a1a1a;
}
}
}
@ -159,7 +358,7 @@ export default {
}
}
}
.ac-cancel{
.ac-btn{
margin: 0 auto 24upx;
width: 702upx;
height: 112upx;
@ -167,8 +366,15 @@ export default {
text-align: center;
line-height: 112upx;
font-size: 32upx;
color: #EA5061;
color: $themeColor;
background-color: #fff;
&.green{
background-color: $themeColor;
color: #fff;
}
&.red{
color: #EA5061;
}
}
}

81
src/pages/employee/change_admin/change_admin.vue

@ -3,21 +3,88 @@
<view class="ca-title">更改超级管理理员</view>
<view class="ca-section">
<view class="cs-tit"><text>*</text>请选择管理员</view>
<picker>
<picker mode="selector" :range="userList" range-key="actual_name" @change="pickerChange">
<view class="cs-selected">
<view>请选择超级管理员</view>
<input placeholder="请选择超级管理员" disabled v-model="selectedUserInfo.actual_name" />
<image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image>
</view>
</picker>
<view class="cs-tip">超级管理员只有一个请谨慎操作</view>
<view class="cs-tip">更改后您的超级管理员权限将降级为普通管理员</view>
</view>
<view class="ca-btn" hover-class="hover-active">确定</view>
<view class="ca-btn" hover-class="hover-active" @click="confirmChange">确定</view>
</view>
</template>
<script>
import { API } from '../../../js/api';
import { servers } from '../../../js/server';
import util from '../../../utils/util';
export default {
data(){
return {
brand_id: '',
userList: [],
selectedUserInfo: {}
}
},
onLoad(options){
this.brand_id = options.brand_id;
this.getUserList({});
},
methods: {
pickerChange(e){
let { userList } = this;
console.log(e)
this.selectedUserInfo = userList[e.detail.value];
},
confirmChange: util.debounce(function(){
let { brand_id, selectedUserInfo } = this;
servers.get({
url: API.employee.adminReplace,
data: {
brand_id,
user_id: selectedUserInfo.id,
},
isDefaultGet: false,
})
.then(res=>{
if(res.data.code == 0){
util.showNone(res.data.message || '操作成功!');
setTimeout(_=>{
util.routeTo(`/pages/index/index`,'rL')
},1200)
}else{
util.showNone(res.data.message || '操作失败!');
}
})
},300,300),
getUserList({
stadium_id='',
menu='',
key='',
}){
util.showLoad();
servers.get({
url: API.employee.employeeList,
data: {
stadium_id,
menu,
key,
},
isDefaultGet: false,
})
.then(res=>{
util.hideLoad();
let _data = res.data;
if(_data.code == 0){
this.userList = _data.data.employee || [];
}else{
util.showNone(_data.message || '加载员工列表!');
}
})
.catch(util.hideLoad)
}
}
}
</script>
<style lang="scss" scoped>
@ -55,12 +122,14 @@ export default {
border-radius: 10upx;
border: 2upx solid #d8d8d8;
@include centerFlex(space-between);
>view{
>input{
flex-grow: 1;
font-size: 32upx;
line-height: 44upx;
color: #9c9c9f;
color: #1A1A1A;
}
>image{
flex-shrink: 0;
width: 28upx;
height: 28upx;
transform: rotateZ(90deg);

228
src/pages/employee/manage/manage.vue

@ -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;

72
src/pages/employee/review_list/review_list.vue

@ -1,18 +1,18 @@
<template>
<view class="review-list">
<view class="rl-header">
<view>审核 3 </view>
<view>
<view>审核 {{reviewInfo.total}} </view>
<view @click="selectAll">
<text>全选</text>
<image mode="aspectFit"></image>
<image :class="[isAllSelected?'img-active':'']" mode="aspectFit" :src="isAllSelected?'/static/images/icon/selected_987.png':''"></image>
</view>
</view>
<view class="rl-users">
<view class="ru-item" v-for="e in 5" :key="e">
<view class="ru-item" v-for="(e,i) in reviewInfo.list" :key="i" @click="userSelect(i)">
<view>
<image class="ri-icon"></image>
<image class="ri-avatar"></image>
<view>胡雪儿</view>
<image :class="['ri-icon',e.isSelected?'active':'']" mode="aspectFit" :src="e.isSelected?'/static/images/icon/selected_987.png':''"></image>
<image class="ri-avatar" mode="apsectFill" :src="e.avatar_url || ''"></image>
<view>{{e.actual_name || '-'}}</view>
</view>
<image mode="aspectFit" src="/static/images/icon/arrow_b2.png"></image>
</view>
@ -23,8 +23,60 @@
</template>
<script>
import { API } from '../../../js/api'
import { servers } from '../../../js/server'
export default {
computed: {
isAllSelected(){
let _list = this.reviewInfo.list;
let _bol = true;
if(_list.length<=0)return false;
_list.forEach(ele=>{
if(!ele.isSelected)_bol = false
})
return _bol;
},
},
data(){
return{
reviewInfo: {
list: []
}
}
},
onLoad(){
this.getUserList();
},
methods: {
selectAll(){
let _list = this.reviewInfo.list.slice();
let { isAllSelected } = this;
_list.forEach(ele=>ele.isSelected = !isAllSelected);
this.reviewInfo.list = _list;
},
userSelect(index){
let _list = this.reviewInfo.list.slice();
_list[index].isSelected = !_list[index].isSelected
this.reviewInfo.list = _list;
// this.reviewInfo.list[index].isSelected = true;
this.$nextTick(this.$forceUpdate());
},
getUserList(){
servers.get({
url: API.employee.employeeUnreview,
data: {},
failMsg: '加载失败!'
})
.then(res=>{
console.log(res);
this.reviewInfo = res;
})
}
}
}
</script>
@ -60,6 +112,9 @@ export default {
border-radius: 50%;
border: 2upx solid #9c9c9f;
}
.img-active{
border-color: transparent;
}
}
}
}
@ -80,6 +135,9 @@ export default {
height: 40upx;
border-radius: 50%;
border: 2upx solid #D8D8D8;
&.active{
border-color: transparent;
}
}
.ri-avatar{
flex-shrink: 0;

BIN
src/static/images/icon/people.png

After

Width: 48  |  Height: 48  |  Size: 444 B

BIN
src/static/images/icon/selected_987.png

After

Width: 40  |  Height: 36  |  Size: 381 B

25
src/store/index.js

@ -10,7 +10,30 @@ export default new Vuex.Store({
APPID: uni.getAccountInfoSync().miniProgram.appId,
// #endif
brandInfo: {},
permissionObj: { // 权限代号对应
'1001': '营业额',
'1002': '收款记录',
'1003': '经营分析',
'1004': '预约订单',
'1005': '会员卡订单',
'1006': '积分订单',
'1007': '员工管理',
'1008': '查询核销',
'1009': '场地管理',
}
},
mutations,
actions,
});
getters: {
permissionArr: state=>{
let _arr = [], _obj = state.permissionObj;
for(let key in _obj){
_arr.push({
key,
name: _obj[key],
})
}
return _arr;
}
}
});
Loading…
Cancel
Save