allow footerLinks reorder

components/admin/Theme.vue

@@ -54,25 +54,27 @@
       v-btn(color='warning' text @click='reset') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
       v-card
         v-list.mt-1(two-line subheader)
-          v-list-item(v-for='link in settings.footerLinks'
+          v-list-item(v-for='(link, idx) in settings.footerLinks'
             :key='`${link.label}`' @click='editFooterLink(link)')
             v-list-item-content
               v-list-item-title {{link.label}}
               v-list-item-subtitle {{link.href}}
             v-list-item-action
-              v-btn(icon color='error' @click.stop='removeFooterLink(link)')
+              v-btn.left(v-if='idx !== 0' icon color='warn' @click.stop='moveUpFooterLink(link, idx)')
+                v-icon(v-text='mdiChevronUp')
+              v-btn.float-right(icon color='error' @click.stop='removeFooterLink(link)')
                 v-icon(v-text='mdiDeleteForever')
 
 </template>
 <script>
 import { mapActions, mapState } from 'vuex'
-import { mdiDeleteForever, mdiRestore, mdiPlus } from '@mdi/js'
+import { mdiDeleteForever, mdiRestore, mdiPlus, mdiChevronUp } from '@mdi/js'
 
 export default {
   name: 'Theme',
   data () {
     return {
-      mdiDeleteForever, mdiRestore, mdiPlus,
+      mdiDeleteForever, mdiRestore, mdiPlus, mdiChevronUp,
       valid: false,
       logoKey: 0,
       link: { href: '', label: '' },
@@ -152,6 +154,12 @@ export default {
       const footerLinks = this.settings.footerLinks.filter(l => l.label !== item.label)
       this.setSetting({ key: 'footerLinks', value: footerLinks })
     },
+    async moveUpFooterLink (item, idx) {
+      const footerLinks = [...this.settings.footerLinks]
+      footerLinks[idx] = footerLinks[idx-1]
+      footerLinks[idx-1] = this.settings.footerLinks[idx]
+      this.setSetting({ key: 'footerLinks', value: footerLinks })
+    },
     editFooterLink (item) {
       this.link = { href: item.href, label: item.label }
       this.linkModal = true