<template>
|
<a-modal :title="currTitle" :width="450" :visible="visible" :closable="false" :maskClosable="closable">
|
<template slot="footer">
|
<a-button v-if="closable" @click="close">关闭</a-button>
|
<a-button type="primary" @click="departOk">确认</a-button>
|
</template>
|
|
<a-form>
|
<a-form-item
|
:labelCol="{ span: 4 }"
|
:wrapperCol="{ span: 20 }"
|
style="margin-bottom:10px"
|
:validate-status="validate_status"
|
>
|
<a-tooltip placement="topLeft">
|
<template slot="title">
|
<span>您隶属于多部门，请选择当前所在部门</span>
|
</template>
|
<a-avatar style="backgroundColor:#87d068" icon="gold" />
|
</a-tooltip>
|
<a-select
|
v-model="departSelected"
|
:class="{ 'valid-error': validate_status == 'error' }"
|
placeholder="请选择登录部门"
|
style="margin-left:10px;width: 80%"
|
>
|
<a-icon slot="suffixIcon" type="gold" />
|
<a-select-option v-for="d in departList" :key="d.id" :value="d.orgCode">
|
{{ d.departName }}
|
</a-select-option>
|
</a-select>
|
</a-form-item>
|
</a-form>
|
</a-modal>
|
</template>
|
|
<script>
|
import { getAction, putAction } from '@tievd/cube-block/lib/api/manage'
|
import Vue from 'vue'
|
import store from '@/store/'
|
import { USER_INFO } from '@tievd/cube-block/lib/store/mutation-types'
|
|
export default {
|
name: 'DepartSelect',
|
props: {
|
title: {
|
type: String,
|
default: '部门选择',
|
required: false
|
},
|
closable: {
|
type: Boolean,
|
default: false,
|
required: false
|
},
|
username: {
|
type: String,
|
default: '',
|
required: false
|
}
|
},
|
watch: {
|
username(val) {
|
if (val) {
|
this.loadDepartList()
|
}
|
}
|
},
|
data() {
|
return {
|
currTitle: this.title,
|
visible: false,
|
departList: [],
|
departSelected: '',
|
validate_status: '',
|
currDepartName: ''
|
}
|
},
|
created() {
|
//this.loadDepartList()
|
},
|
methods: {
|
loadDepartList() {
|
return new Promise(resolve => {
|
let url = '/sys/user/getCurrentUserDeparts'
|
this.currDepartName = ''
|
getAction(url).then(res => {
|
if (res.success) {
|
let departs = res.result.list
|
let orgCode = res.result.orgCode
|
if (departs && departs.length > 0) {
|
for (let i of departs) {
|
if (i.orgCode == orgCode) {
|
this.currDepartName = i.departName
|
break
|
}
|
}
|
}
|
this.departSelected = orgCode
|
this.departList = departs
|
if (this.currDepartName) {
|
this.currTitle = '部门切换（当前部门 : ' + this.currDepartName + '）'
|
}
|
}
|
resolve()
|
})
|
})
|
},
|
close() {
|
this.departClear()
|
},
|
departOk() {
|
if (!this.departSelected) {
|
this.validate_status = 'error'
|
return false
|
}
|
let obj = {
|
orgCode: this.departSelected,
|
username: this.username
|
}
|
putAction('/sys/selectDepart', obj).then(res => {
|
if (res.success) {
|
const userInfo = res.result
|
Vue.ls.set(USER_INFO, userInfo, 7 * 24 * 60 * 60 * 1000)
|
store.commit('SET_INFO', userInfo)
|
//console.log("---切换组织机构---userInfo-------",store.getters.userInfo.orgCode);
|
this.departClear()
|
}
|
})
|
},
|
show() {
|
//如果组件传值username此处就不用loadDepartList了
|
this.loadDepartList().then(() => {
|
this.visible = true
|
if (!this.departList || this.departList.length <= 0) {
|
this.$message.warning('您尚未设置部门信息!')
|
this.departClear()
|
}
|
})
|
},
|
departClear() {
|
this.departList = []
|
this.departSelected = ''
|
this.visible = false
|
this.validate_status = ''
|
this.currDepartName = ''
|
}
|
}
|
}
|
</script>
|
<style scoped>
|
.valid-error .ant-select-selection__placeholder {
|
color: #f5222d;
|
}
|
</style>
|
