| ¶Ô±ÈÐÂÎļþ | 
|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <el-select | 
|---|
|  |  |  | class="role-select" | 
|---|
|  |  |  | :class="{select__block: !inline}" | 
|---|
|  |  |  | :value="value" | 
|---|
|  |  |  | :placeholder="placeholder" | 
|---|
|  |  |  | :clearable="clearable" | 
|---|
|  |  |  | :disabled="disabled" | 
|---|
|  |  |  | @change="$emit('change', $event)" | 
|---|
|  |  |  | @input="$emit('input', $event)" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <el-option v-for="role in roles" :key="role.id" :value="role.id" :label="role.name"/> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import { fetchAll } from '@/api/system/role' | 
|---|
|  |  |  |  | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'RoleSelect', | 
|---|
|  |  |  | props: { | 
|---|
|  |  |  | value: {}, | 
|---|
|  |  |  | placeholder: { | 
|---|
|  |  |  | default: 'è¯·éæ©è§è²' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | inline: { | 
|---|
|  |  |  | default: true | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | disabled: {}, | 
|---|
|  |  |  | clearable: { | 
|---|
|  |  |  | default: false | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | roles: [] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | fetchAll() | 
|---|
|  |  |  | .then(data => { | 
|---|
|  |  |  | this.roles = data | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <style lang="scss" scoped> | 
|---|
|  |  |  | .select__block { | 
|---|
|  |  |  | display: block; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|