warehouseSelect.vue
4.08 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<template>
<a-modal
:title="currTitle"
:width="450"
:visible="visible"
:closable="false"
:maskClosable="closable">
<template slot="footer">
<a-button v-if="closable" @click="close">{{$t('button.close')}}</a-button>
<a-button type="primary" @click="departOk">{{$t('button.ok')}}</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.name" :value="d.code">
{{ d.name }}
</a-select-option>
</a-select>
</a-form-item>
</a-form>
</a-modal>
</template>
<script>
import {getAction, putAction} from '@/api/manage'
import Vue from 'vue'
import store from '@/store/'
import {USER_INFO} from "@/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/getUserWarehouses"
this.currDepartName = ''
getAction(url).then(res => {
if (res.success) {
let departs = res.result.list
let orgCode = res.result.warehouseCode
if (departs && departs.length > 0) {
for (let i of departs) {
if (i.code == orgCode) {
this.currDepartName = i.name
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 = {
warehouseCode: this.departSelected,
username: this.username
}
putAction("/sys/selectUserWarehouse", obj).then(res => {
if (res.success) {
const userInfo = res.result.userInfo;
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>