255 lines
7.4 KiB
Vue
255 lines
7.4 KiB
Vue
<template>
|
||
<view class="page-content my-bg">
|
||
<cu-custom class="main-totextbar bg-main-oil" :isBack="true" bgColor="bg-main-oil">
|
||
<block slot="backText">返回</block>
|
||
<block slot="content">员工管理</block>
|
||
</cu-custom>
|
||
<view class="margin radius">
|
||
<form>
|
||
<view class="cu-form-group">
|
||
<view class="title">姓名</view>
|
||
<input
|
||
:maxlength="8"
|
||
@input="getChinese"
|
||
:value="userInfo.cUserName"
|
||
@blur="showChinese"
|
||
placeholder="请输入姓名"
|
||
name="input"
|
||
/>
|
||
</view>
|
||
<view class="cu-form-group">
|
||
<view class="title">手机号</view>
|
||
<input
|
||
type="number"
|
||
:maxlength="11"
|
||
v-model="userInfo.phone"
|
||
placeholder="请输入手机号"
|
||
name="input"
|
||
/>
|
||
</view>
|
||
|
||
<view class="cu-form-group text-right">
|
||
<view class="title">权限设置</view>
|
||
<view class>请选择以下权限</view>
|
||
</view>
|
||
<view class="padding bg-white">
|
||
<checkbox-group @change="checkboxChange" class="flex flex-wrap justify-between">
|
||
<view class="basis-sm margin-bottom-sm" v-for="(item,index) in checkbox" :key="index">
|
||
<checkbox
|
||
@tap="item.checked =! item.checked"
|
||
class="round red"
|
||
:class="item.checked?'checked':''"
|
||
:checked="item.checked?true:false"
|
||
:value="item.id"
|
||
></checkbox>
|
||
<text class="padding-left-xs">{{item.roleName}}</text>
|
||
</view>
|
||
</checkbox-group>
|
||
</view>
|
||
</form>
|
||
<view class="padding-top">
|
||
<view class="text-lg">添加说明</view>
|
||
<view class="padding-top-sm text-sm text-grey">
|
||
<view class="margin-bottom-xs">1、员工添加成功后，系统会向该员工发送一条短信，短信中包含了云站的识别码。</view>
|
||
<view
|
||
class="margin-bottom-xs"
|
||
>2、用户在收到短信后，需要关注“星油云站公众号”，进入小程序，输入云站编码后，根据页面要求输入对应的手机号，姓名，身份证信息，与管理员添加的信息一致方可绑定成功。</view>
|
||
<view class>3、绑定成功后无需再次登录操作。</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="margin-left margin-right padding-lg bottom-bg">
|
||
<button class="bg-main-oil round" @tap="saveInfo">保存</button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import staffApi from '@/packageStaff/api/staff.js'
|
||
import oliSiteApi from '@/api/oli-site.js'
|
||
import oliUserApi from '@/api/oli-user.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
siteId:uni.getStorageSync('oilSiteId'),
|
||
tempUid: uni.getStorageSync('tempUid'),
|
||
checkbox: [],
|
||
userInfo: {},
|
||
mainURL: this.global.mainURL,
|
||
authList: [],
|
||
lastAuthList: [],
|
||
menuList:'',
|
||
oilItem:uni.getStorageSync('siteOli')
|
||
}
|
||
},
|
||
created() {
|
||
this.getAllMenu()
|
||
if (this.tempUid.type === 'edit') {
|
||
setTimeout(() => {
|
||
this.getUserInfo()
|
||
}, 200);
|
||
}
|
||
},
|
||
methods: {
|
||
showChinese() {
|
||
const reg = /[\u4e00-\u9fa5]/g
|
||
var names = this.userInfo.cUserName.match(reg);
|
||
this.userInfo.cUserName = names.join("")
|
||
if (names) {
|
||
this.$set(this.userInfo, 'cUserName', names.join(""))
|
||
}
|
||
},
|
||
// 中文提取
|
||
getChinese(e) {
|
||
var value = e.target.value
|
||
console.log('e-target-value', value)
|
||
if (value !== null && value !== '') {
|
||
const reg = /[\u4e00-\u9fa5]/g
|
||
var names = value.match(reg);
|
||
// console.log(names)
|
||
// this.$set(this.userInfo, 'cUserName', names.join(""))
|
||
if (names) {
|
||
this.$set(this.userInfo, 'cUserName', names.join(""))
|
||
}
|
||
|
||
console.log('v-model-name', this.userInfo.cUserName)
|
||
}
|
||
|
||
|
||
},
|
||
calcMenuList() {
|
||
this.checkbox.forEach(item => {
|
||
console.log(item.checked)
|
||
if (item.checked) {
|
||
this.lastAuthList.push(item.value)
|
||
}
|
||
})
|
||
console.log('计算出来的', this.lastAuthList)
|
||
},
|
||
checkboxChange(e) {
|
||
console.log(e)
|
||
var items = this.checkbox,
|
||
values = e.detail.value;
|
||
this.menuList = values
|
||
for (var i = 0, lenI = items.length; i < lenI; ++i) {
|
||
const item = items[i]
|
||
if (values.includes(item.value)) {
|
||
this.$set(item, 'checked', true)
|
||
} else {
|
||
this.$set(item, 'checked', false)
|
||
}
|
||
}
|
||
},
|
||
updateUser(data4) {
|
||
staffApi.updateUser(data4).then(res => {
|
||
if (res.code === 20000) {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
duration: 3000
|
||
})
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 2500);
|
||
}
|
||
})
|
||
},
|
||
addUser(data4) {
|
||
oliUserApi.addNewStaff(data4).then(res => {
|
||
if (res.code === 20000) {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
duration: 3000
|
||
})
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 2500);
|
||
}
|
||
})
|
||
},
|
||
saveInfo() {
|
||
if (!this.userInfo.cUserName) {
|
||
uni.showToast({
|
||
title: '请输入员工姓名',
|
||
icon: 'none'
|
||
})
|
||
return false
|
||
}
|
||
if (!this.userInfo.phone) {
|
||
uni.showToast({
|
||
title: '请输入员工手机号',
|
||
icon: 'none'
|
||
})
|
||
return false
|
||
} else if (!/^(((13[0-9]{1})|(14[0-9]{1})|(15[0-9]{1})|(17[0-9]{1})|(18[0-9]{1})|(19[0-9]{1})|(16[0-9]{1}))+\d{8})$/.test(this.userInfo.phone)) {
|
||
uni.showToast({
|
||
title: '手机号码不正确',
|
||
icon: 'none'
|
||
})
|
||
return false
|
||
}
|
||
this.calcMenuList()
|
||
const data4 = {
|
||
siteId:this.siteId,
|
||
id: this.userInfo.cUserId,
|
||
userName: this.userInfo.cUserName,
|
||
phone: this.userInfo.phone,
|
||
roleIds: this.menuList.toString(),
|
||
pushState: 1,
|
||
channelId:uni.getStorageSync('channelId'),
|
||
pushProcedureState: 1
|
||
}
|
||
|
||
this.addUser(data4)
|
||
|
||
},
|
||
getAllMenu() {
|
||
// 获取权限列表
|
||
oliSiteApi.getRoleList().then( (res)=>{
|
||
console.log(res)
|
||
for(let i = 0 ; i <res.data.length ; i++){
|
||
if (res.data[i].roleName != 'ROOT' ) {
|
||
this.checkbox.push(res.data[i])
|
||
}
|
||
}
|
||
} )
|
||
// staffApi.getOilSiteAllMenu(this.tempUid.id).then(res => {
|
||
// if (res.code === 20000) {
|
||
// var auths = []
|
||
// var temp = res.data
|
||
// temp.forEach(item => {
|
||
// auths.push({
|
||
// value: item.menuId,
|
||
// checked: false,
|
||
// name: item.menuName
|
||
// })
|
||
// })
|
||
// this.checkbox = auths
|
||
// }
|
||
// })
|
||
|
||
},
|
||
getUserInfo() {
|
||
staffApi.findUserAuthById(this.tempUid.id).then(res => {
|
||
if (res.code === 20000) {
|
||
this.userInfo = res.data
|
||
this.authList = res.data.authList
|
||
if (this.authList && this.authList.length > 0) {
|
||
console.log('已有权限', this.authList)
|
||
this.authList.forEach((auth, index) => {
|
||
this.checkbox.forEach(item => {
|
||
if (auth.menuId === item.value) {
|
||
this.$set(item, 'checked', true)
|
||
}
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
</style>
|