refs #2606 Use vue-fontawesome in Modals/AddListMember
This commit is contained in:
parent
12036d1ab8
commit
e785ed2b7e
|
@ -1,14 +1,10 @@
|
|||
<template>
|
||||
<el-dialog
|
||||
:title="$t('modals.add_list_member.title')"
|
||||
:visible.sync="addListMemberModal"
|
||||
width="400px"
|
||||
class="add-member">
|
||||
<el-dialog :title="$t('modals.add_list_member.title')" :visible.sync="addListMemberModal" width="400px" class="add-member">
|
||||
<div class="search-account" :element-loading-background="loadingBackground">
|
||||
<el-form :inline="true">
|
||||
<input v-model="name" placeholder="Account name" class="account-name" v-shortkey="['enter']" @shortkey="search" autofocus></input>
|
||||
<input v-model="name" placeholder="Account name" class="account-name" v-shortkey="['enter']" @shortkey="search" autofocus />
|
||||
<el-button type="text" class="search" @click="search">
|
||||
<icon name="search"></icon>
|
||||
<font-awesome-icon icon="search" />
|
||||
</el-button>
|
||||
</el-form>
|
||||
<div class="search-results">
|
||||
|
@ -21,13 +17,11 @@
|
|||
<div class="username">
|
||||
{{ username(user) }}
|
||||
</div>
|
||||
<div class="acct">
|
||||
@{{ user.acct }}
|
||||
</div>
|
||||
<div class="acct">@{{ user.acct }}</div>
|
||||
</div>
|
||||
<div class="add">
|
||||
<el-button type="text" @click="add(user)">
|
||||
<icon name="plus"></icon>
|
||||
<font-awesome-icon icon="plus" />
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -42,7 +36,7 @@ import { mapState } from 'vuex'
|
|||
|
||||
export default {
|
||||
name: 'add-list-member',
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
name: ''
|
||||
}
|
||||
|
@ -54,27 +48,28 @@ export default {
|
|||
listId: state => state.TimelineSpace.Modals.AddListMember.targetListId
|
||||
}),
|
||||
addListMemberModal: {
|
||||
get () {
|
||||
get() {
|
||||
return this.$store.state.TimelineSpace.Modals.AddListMember.modalOpen
|
||||
},
|
||||
set (value) {
|
||||
set(value) {
|
||||
this.$store.dispatch('TimelineSpace/Modals/AddListMember/changeModal', value)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
username (account) {
|
||||
username(account) {
|
||||
if (account.display_name !== '') {
|
||||
return account.display_name
|
||||
} else {
|
||||
return account.username
|
||||
}
|
||||
},
|
||||
search () {
|
||||
search() {
|
||||
this.$store.dispatch('TimelineSpace/Modals/AddListMember/search', this.name)
|
||||
},
|
||||
add (user) {
|
||||
this.$store.dispatch('TimelineSpace/Modals/AddListMember/add', user)
|
||||
add(user) {
|
||||
this.$store
|
||||
.dispatch('TimelineSpace/Modals/AddListMember/add', user)
|
||||
.then(() => {
|
||||
this.addListMemberModal = false
|
||||
this.$store.dispatch('TimelineSpace/Contents/Lists/Edit/fetchMembers', this.listId)
|
||||
|
|
|
@ -23,7 +23,8 @@ import {
|
|||
faUnlock,
|
||||
faLock,
|
||||
faEyeSlash,
|
||||
faEye
|
||||
faEye,
|
||||
faPlus
|
||||
} from '@fortawesome/free-solid-svg-icons'
|
||||
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
|
||||
import 'vue-awesome/icons'
|
||||
|
@ -64,7 +65,8 @@ library.add(
|
|||
faUnlock,
|
||||
faLock,
|
||||
faEyeSlash,
|
||||
faEye
|
||||
faEye,
|
||||
faPlus
|
||||
)
|
||||
|
||||
Vue.use(ElementUI, { locale })
|
||||
|
|
Loading…
Reference in New Issue