Merge pull request #1050 from h3poteto/loading

Fix loading color in preferences
This commit is contained in:
AkiraFukushima 2019-09-26 23:30:24 +09:00 committed by GitHub
commit fb94a9e0f5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 81 additions and 81 deletions

View File

@ -1,5 +1,5 @@
<template>
<div id="account">
<div id="account">
<h2>{{ $t('preferences.account.title') }}</h2>
<el-form class="connected-account section" size="small">
<h3>{{ $t('preferences.account.connected') }}</h3>
@ -9,45 +9,42 @@
tooltip-effect="dark"
empty-text="No accounts"
style="width: 100%"
v-loading="accountLoading">
<el-table-column
prop="username"
:label="$t('preferences.account.username')">
</el-table-column>
<el-table-column
prop="domain"
:label="$t('preferences.account.domain')">
</el-table-column>
<el-table-column
:label="$t('preferences.account.association')">
v-loading="accountLoading"
:element-loading-background="backgroundColor"
>
<el-table-column prop="username" :label="$t('preferences.account.username')"> </el-table-column>
<el-table-column prop="domain" :label="$t('preferences.account.domain')"> </el-table-column>
<el-table-column :label="$t('preferences.account.association')">
<template slot-scope="scope">
<el-button
@click.native.prevent="removeAccount(scope.$index, accounts)"
type="text"
class="action">
<el-button @click.native.prevent="removeAccount(scope.$index, accounts)" type="text" class="action">
<i class="el-icon-close"></i> {{ $t('preferences.account.remove_association') }}
</el-button>
</template>
</el-table-column>
<el-table-column
:label="$t('preferences.account.order')"
width="60">
<el-table-column :label="$t('preferences.account.order')" width="60">
<template slot-scope="scope">
<div class="allow-up">
<el-button class="arrow-up action" type="text" icon="el-icon-arrow-up" @click.native.prevent="forward(scope.$index, accounts)"></el-button>
<el-button
class="arrow-up action"
type="text"
icon="el-icon-arrow-up"
@click.native.prevent="forward(scope.$index, accounts)"
></el-button>
</div>
<div class="allow-down">
<el-button class="arrow-down action" type="text" icon="el-icon-arrow-down" @click.native.prevent="backward(scope.$index, accounts)"></el-button>
<el-button
class="arrow-down action"
type="text"
icon="el-icon-arrow-down"
@click.native.prevent="backward(scope.$index, accounts)"
></el-button>
</div>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item>
<el-popover
placement="top"
width="160"
v-model="deletePopoverVisible">
<el-popover placement="top" width="160" v-model="deletePopoverVisible">
<p>{{ $t('preferences.account.confirm_message') }}</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="deletePopoverVisible = false">{{ $t('preferences.account.cancel') }}</el-button>
@ -57,7 +54,7 @@
</el-popover>
</el-form-item>
</el-form>
</div>
</div>
</template>
<script>
@ -65,7 +62,7 @@ import { mapState } from 'vuex'
export default {
name: 'account',
data () {
data() {
return {
openRemoveDialog: false,
deletePopoverVisible: false
@ -75,13 +72,16 @@ export default {
...mapState({
accounts: state => state.Preferences.Account.accounts,
accountLoading: state => state.Preferences.Account.accountLoading
}),
...mapState({
backgroundColor: state => state.App.theme.background_color
})
},
created () {
created() {
this.loadAccounts()
},
methods: {
async loadAccounts () {
async loadAccounts() {
this.$store.commit('Preferences/Account/updateAccountLoading', true)
try {
await this.$store.dispatch('Preferences/Account/loadAccounts')
@ -94,8 +94,9 @@ export default {
this.$store.commit('Preferences/Account/updateAccountLoading', false)
}
},
removeAccount (index, accounts) {
this.$store.dispatch('Preferences/Account/removeAccount', accounts[index])
removeAccount(index, accounts) {
this.$store
.dispatch('Preferences/Account/removeAccount', accounts[index])
.then(() => {
this.loadAccounts()
})
@ -106,22 +107,19 @@ export default {
})
})
},
forward (index, accounts) {
this.$store.dispatch('Preferences/Account/forwardAccount', accounts[index])
.then(() => {
forward(index, accounts) {
this.$store.dispatch('Preferences/Account/forwardAccount', accounts[index]).then(() => {
this.loadAccounts()
})
},
backward (index, accounts) {
this.$store.dispatch('Preferences/Account/backwardAccount', accounts[index])
.then(() => {
backward(index, accounts) {
this.$store.dispatch('Preferences/Account/backwardAccount', accounts[index]).then(() => {
this.loadAccounts()
})
},
removeAllAssociations () {
removeAllAssociations() {
this.deletePopoverVisible = false
this.$store.dispatch('Preferences/Account/removeAllAccounts')
.then(() => {
this.$store.dispatch('Preferences/Account/removeAllAccounts').then(() => {
this.$router.push('/login')
})
}
@ -164,5 +162,4 @@ export default {
}
}
}
</style>

View File

@ -1,5 +1,5 @@
<template>
<div id="general" v-loading="loading">
<div id="general" v-loading="loading" :element-loading-background="backgroundColor">
<h2>{{ $t('preferences.general.title') }}</h2>
<el-form class="sounds section" label-position="right" label-width="250px" size="small">
<h3>{{ $t('preferences.general.sounds.title') }}</h3>
@ -42,6 +42,9 @@ export default {
...mapState('Preferences/General', {
loading: state => state.loading
}),
...mapState({
backgroundColor: state => state.App.theme.background_color
}),
...mapGetters('Preferences/General', ['notDarwin']),
sound_fav_rb: {
get() {