encrypt/gancio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

remove vuetifycss and materialicon -> use threeshake

Browse Source 
@nuxt/vuetify etc...
This commit is contained in:
lesion
2022-02-08 14:45:19 +01:00
parent 8ee236f30e
commit 32e48ed64d
27 changed files with 335 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
components/Announcement.vue
View File

@@ -1,15 +1,16 @@
<template lang="pug">
nuxt-link(:to='`/announcement/${announcement.id}`')
v-alert.mb-1(border='left' type='info' color="primary" show-icon) {{announcement.title}}
v-alert.mb-1(border='left' type='info' color="primary" :icon='mdiInformation') {{announcement.title}}
</template>
<script>
import { mapState } from 'vuex'
import { mdiInformation } from '@mdi/js'
export default {
data () {
return { mdiInformation }
},
props: {
announcement: { type: Object, default: () => ({}) }
},
computed: mapState(['announcements'])
}
}
</script>

28
components/Editor.vue
View File

@@ -7,56 +7,56 @@
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.bold() }"
@click="commands.bold")
v-icon mdi-format-bold
v-icon(v-text='mdiFormatBold')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.underline() }"
@click="commands.underline")
v-icon mdi-format-underline
v-icon(v-text='mdiFormatUnderline')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.strike() }"
@click="commands.strike")
v-icon mdi-format-strikethrough-variant
v-icon(v-text='mdiFormatStrikethroughVariant')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.italic() }"
@click="commands.italic")
v-icon mdi-format-italic
v-icon(v-text='mdiFormatItalic')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.heading({level: 1}) }"
@click="commands.heading({level: 1})")
v-icon mdi-format-header-1
v-icon(v-text='mdiFormatHeader1')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.heading({level: 2}) }"
@click="commands.heading({level: 2})")
v-icon mdi-format-header-2
v-icon(v-text='mdiFormatHeader2')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.heading({level: 3}) }"
@click="commands.heading({level: 3})")
v-icon mdi-format-header-3
v-icon(v-text='mdiFormatHeader3')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.code() }"
@click="commands.code")
v-icon mdi-code-tags
v-icon(v-text='mdiCodeTags')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.blockquote() }"
@click="commands.blockquote")
v-icon mdi-format-quote-open
v-icon(v-text='mdiFormatQuoteOpen')
v-btn(icon text tabindex='-1'
:class="{ primary: isActive.bullet_list() }"
@click="commands.bullet_list")
v-icon mdi-format-list-bulleted
v-icon(v-text='mdiFormatListBulleted')
v-btn(icon text tabindex='-1' :class='{ primary: isActive.link() }'
@click='commands.link({href: getMarkAttrs("link") && getMarkAttrs("link").href ? "" : "https://"}); $refs.link.focus();')
v-icon mdi-link
v-icon(v-text='mdiLink')
v-text-field.pt-0.ml-1(v-show='isActive.link()' ref='link' @focus='focus' @blur='blur' hide-details
:value='isActive.link() && getMarkAttrs("link") && getMarkAttrs("link").href || ""'
@keypress.enter='commands.link({ href: $event.target.value}); editor.focus()')
@@ -65,6 +65,9 @@
</template>
<script>
import debounce from 'lodash/debounce'
import { mdiLink, mdiFormatListBulleted, mdiFormatQuoteOpen, mdiCodeTags,
mdiFormatHeader1, mdiFormatHeader2, mdiFormatHeader3, mdiFormatItalic,
mdiFormatStrikethroughVariant, mdiFormatBold, mdiFormatUnderline } from '@mdi/js'
import { Editor, EditorContent, EditorMenuBar, EditorMenuBubble } from 'tiptap'
import {
Blockquote,
@@ -97,6 +100,9 @@ export default {
},
data () {
return {
mdiLink, mdiFormatListBulleted, mdiFormatQuoteOpen, mdiCodeTags,
mdiFormatHeader1, mdiFormatHeader2, mdiFormatHeader3, mdiFormatItalic,
mdiFormatStrikethroughVariant, mdiFormatBold, mdiFormatUnderline,
options: [],
linkActive: false,
editor: null,

16
components/Event.vue
View File

@@ -2,7 +2,7 @@
v-card.h-event.event.d-flex(itemscope itemtype="https://schema.org/Event")
nuxt-link(:to='`/event/${event.slug || event.id}`' itemprop="url")
img.img.u-featured(:src='thumbnail' :alt='alt' :loading='this.lazy?"lazy":"eager"' itemprop="image" :style="{ 'object-position': thumbnailPosition }")
v-icon.float-right.mr-1(v-if='event.parentId' color='success') mdi-repeat
v-icon.float-right.mr-1(v-if='event.parentId' color='success' v-text='mdiRepeat')
.title.p-name(itemprop="name") {{event.title}}
v-card-text.body.pt-0.pb-0
@@ -19,35 +19,39 @@
v-menu(offset-y)
template(v-slot:activator="{on}")
v-btn.align-self-end(icon v-on='on' color='primary' alt='more')
v-icon mdi-dots-vertical
v-icon(v-text='mdiDotsVertical')
v-list(dense)
v-list-item-group
v-list-item(@click='clipboard(`${settings.baseurl}/event/${event.slug || event.id}`)')
v-list-item-icon
v-icon mdi-content-copy
v-icon(v-text='mdiContentCopy')
v-list-item-content
v-list-item-title {{$t('common.copy_link')}}
v-list-item(:href='`/api/event/${event.slug || event.id}.ics`')
v-list-item-icon
v-icon mdi-calendar-export
v-icon(v-text='mdiCalendarExport')
v-list-item-content
v-list-item-title {{$t('common.add_to_calendar')}}
v-list-item(v-if='is_mine' :to='`/add/${event.id}`')
v-list-item-icon
v-icon mdi-pencil
v-icon(v-text='mdiPencil')
v-list-item-content
v-list-item-title {{$t('common.edit')}}
v-list-item(v-if='is_mine' @click='remove(false)')
v-list-item-icon
v-icon(color='error') mdi-delete-forever
v-icon(color='error' v-text='mdiDeleteForever')
v-list-item-content
v-list-item-title {{$t('common.remove')}}
</template>
<script>
import { mapState } from 'vuex'
import clipboard from '../assets/clipboard'
import { mdiRepeat, mdiPencil, mdiDotsVertical, mdiContentCopy, mdiCalendarExport, mdiDeleteForever } from '@mdi/js'
export default {
data () {
return { mdiRepeat, mdiPencil, mdiDotsVertical, mdiContentCopy, mdiCalendarExport, mdiDeleteForever }
},
props: {
event: { type: Object, default: () => ({}) },
lazy: Boolean

6
components/List.vue
View File

@@ -9,14 +9,18 @@ div#list
v-for='event in computedEvents'
:key='`${event.id}_${event.start_datetime}`' small)
v-list-item-content
v-list-item-subtitle <v-icon small color='success' v-if='event.parentId'>mdi-repeat</v-icon> {{event|when}}
v-list-item-subtitle <v-icon small color='success' v-if='event.parentId' v-text='mdiRepeat'></v-icon> {{event|when}}
span.primary--text.ml-1 @{{event.place.name}}
v-list-item-title(v-text='event.title')
</template>
<script>
import { mdiRepeat } from '@mdi/js'
export default {
name: 'List',
data () {
return { mdiRepeat }
},
props: {
title: {
type: String,

46
components/Nav.vue
View File

@@ -12,52 +12,57 @@
v-spacer
v-btn(v-if='$auth.loggedIn || settings.allow_anon_event' icon nuxt to='/add' :aria-label='$t("common.add_event")')
v-icon(large color='primary') mdi-plus
v-icon(large color='primary' v-text='mdiPlus')
v-btn(icon nuxt to='/export' :aria-label='$t("common.share")')
v-icon mdi-share-variant
v-icon(v-text='mdiShareVariant')
v-btn(v-if='!$auth.loggedIn' icon nuxt to='/login' :aria-label='$t("common.login")')
v-icon mdi-login
v-icon(v-text='mdiLogin')
client-only
v-menu(v-if='$auth.loggedIn' offset-y)
template(v-slot:activator="{ on, attrs }")
v-btn(icon v-bind='attrs' v-on='on' aria-label='Menu')
v-icon mdi-dots-vertical
v-icon(v-text='mdiDotsVertical')
v-list
v-list-item(nuxt to='/settings')
v-list-item-icon
v-icon mdi-cog
v-icon(v-text='mdiCog')
v-list-item-content
v-list-item-title {{$t('common.settings')}}
v-list-item(v-if='$auth.user.is_admin' nuxt to='/admin')
v-list-item-icon
v-icon mdi-account
v-icon(v-text='mdiAccount')
v-list-item-content
v-list-item-title {{$t('common.admin')}}
v-list-item(@click='logout')
v-list-item-icon
v-icon mdi-logout
v-icon(v-text='mdiLogout')
v-list-item-content
v-list-item-title {{$t('common.logout')}}
template(#placeholder)
v-btn(icon aria-label='Menu')
v-icon mdi-dots-vertical
v-btn(v-if='$auth.loggedIn' icon aria-label='Menu')
v-icon(v-text='mdiDotsVertical')
v-btn(icon @click='clipboard(feedLink, "common.feed_url_copied")' aria-label='RSS')
v-icon(color='orange') mdi-rss
v-icon(color='orange' v-text='mdiRss')
</template>
<script>
import { mapState } from 'vuex'
import clipboard from '../assets/clipboard'
import { mdiPlus, mdiShareVariant, mdiLogin, mdiDotsVertical, mdiLogout, mdiAccount, mdiCog, mdiRss } from '@mdi/js'
export default {
name: 'Nav',
data () {
return { mdiPlus, mdiShareVariant, mdiLogout, mdiLogin, mdiDotsVertical, mdiAccount, mdiCog, mdiRss }
},
mixins: [clipboard],
computed: {
...mapState(['filters', 'settings']),
@@ -77,32 +82,11 @@ export default {
return `${this.settings.baseurl}/feed/rss${query}`
},
could_add () {
return (this.$auth.loggedIn || this.settings.allow_anon_event)
}
},
methods: {
logout () {
this.$root.$message('common.logout_ok')
this.$auth.logout()
},
async createTrustedInstance () {
let url = this.instance_url
if (!url.match(/^https?:\/\//)) {
url = `https://${url}`
}
try {
const instance = await this.$axios.$get(`${url}/.well-known/nodeinfo/2.0`)
const trusted_instance = {
url,
name: instance.metadata.nodeName,
description: instance.metadata.nodeDescription,
place: instance.metadata.placeDescription
}
this.setSetting({ key: 'trusted_instances', value: this.settings.trusted_instances.concat(trusted_instance) })
} catch (e) {
this.$root.$message(e, { color: 'error' })
}
}
}
}

6
components/Search.vue
View File

@@ -24,17 +24,18 @@
@click:close='remove(data.item)'
:input-value="data.selected")
v-avatar(left)
v-icon {{data.item.type === 'place' ? 'mdi-map-marker' : 'mdi-tag' }}
v-icon(v-text="data.item.type === 'place' ? mdiMapMarker : mdiTag")
span {{ data.item.label }}
template(v-slot:item='{ item }')
v-list-item-avatar
v-icon {{item.type === 'place' ? 'mdi-map-marker' : 'mdi-tag' }}
v-icon(v-text="item.type === 'place' ? mdiMapMarker : mdiTag")
v-list-item-content
v-list-item-title(v-text='item.label')
</template>
<script>
import { mapState } from 'vuex'
import { mdiMapMarker, mdiTag } from '@mdi/js'
export default {
name: 'Search',
props: {
@@ -43,6 +44,7 @@ export default {
},
data () {
return {
mdiTag, mdiMapMarker,
tmpfilter: null,
search: ''
}

11
components/Snackbar.vue
View File

@@ -7,17 +7,20 @@
:left="left"
:right="right"
:timeout="timeout")
v-icon.mr-3(color="white") {{icon}}
v-icon.mr-3(color="white" v-text='icon')
span {{ message }}
template(v-slot:action="{ }")
v-icon(size="16" @click="active = false") mdi-close-circle
v-icon(size="16" @click="active = false" v-text='mdiCloseCircle')
</template>
<script>
import { mdiAlert, mdiCloseCircle } from '@mdi/js'
export default {
data () {
return {
icon: 'md-alert',
mdiAlert, mdiCloseCircle,
icon: mdiAlert,
color: 'secondary',
bottom: true,
top: false,
@@ -33,7 +36,7 @@ export default {
this.active = true
this.message = this.$t(message, opts)
this.color = opts.color || 'secondary'
this.icon = opts.icon || 'md-alert'
this.icon = opts.icon || mdiAlert
}
}
}

4
components/admin/Announcement.vue
View File

@@ -17,7 +17,7 @@
v-btn(@click='dialog=false' color='error') {{$t('common.cancel')}}
v-btn(@click='save' color='primary' :disabled='!valid || loading' :loading='loading') {{$t(`common.${editing?'save':'send'}`)}}
v-btn(@click='openDialog' text color='primary') <v-icon>mdi-plus</v-icon> {{$t('common.add')}}
v-btn(@click='openDialog' text color='primary') <v-icon v-text='mdiPlus'></v-icon> {{$t('common.add')}}
v-card-text
v-data-table(
v-if='announcements.length'
@@ -36,11 +36,13 @@ import { mapActions } from 'vuex'
import cloneDeep from 'lodash/cloneDeep'
import Editor from '../Editor'
import Announcement from '../Announcement'
import { mdiPlus } from '@mdi/js'
export default {
components: { Editor, Announcement },
data () {
return {
mdiPlus,
valid: false,
dialog: false,
editing: false,

6
components/admin/Federation.vue
View File

@@ -56,7 +56,7 @@
v-btn(color='error' @click='dialogAddInstance=false') {{$t('common.cancel')}}
v-btn(color='primary' :disabled='!valid || loading' :loading='loading' @click='createTrustedInstance') {{$t('common.ok')}}
v-btn.mt-4(@click='dialogAddInstance = true' color='primary' text) <v-icon>mdi-plus</v-icon> {{$t('admin.add_instance')}}
v-btn.mt-4(@click='dialogAddInstance = true' color='primary' text) <v-icon v-text='mdiPlus'></v-icon> {{$t('admin.add_instance')}}
v-data-table(
v-if='settings.trusted_instances.length'
:hide-default-footer='settings.trusted_instances.length<10'
@@ -64,17 +64,19 @@
:items='settings.trusted_instances')
template(v-slot:item.actions="{item}")
v-btn(icon @click='deleteInstance(item)' color='error')
v-icon mdi-delete-forever
v-icon(v-text='mdiDeleteForever')
</template>
<script>
import { mapActions, mapState } from 'vuex'
import axios from 'axios'
import { mdiDeleteForever, mdiPlus } from '@mdi/js'
export default {
name: 'Federation',
data ({ $store, $options }) {
return {
mdiDeleteForever, mdiPlus,
instance_url: '',
instance_name: $store.state.settings.instance_name,
instance_place: $store.state.settings.instance_place,

14
components/admin/Moderation.vue
View File

@@ -13,7 +13,7 @@
dense :headers='instancesHeader'
@click:row='instanceSelected')
template(v-slot:item.blocked="{ item }")
v-icon(@click='toggleBlock(item)') {{item.blocked ? 'mdi-checkbox-intermediate' : 'mdi-checkbox-blank-outline'}}
v-icon(@click='toggleBlock(item)' v-text='item.blocked ? mdiCheckboxIntermediate : mdiCheckboxBlankOutline')
v-col(:span='11')
span {{$t('common.users')}}
@@ -24,7 +24,7 @@
:hide-default-footer='users.length<5'
dense :headers='usersHeader')
template(v-slot:item.blocked="{ item }")
v-icon(@click='toggleUserBlock(item)') {{item.blocked?'mdi-checkbox-intermediate':'mdi-checkbox-blank-outline'}}
v-icon(@click='toggleUserBlock(item)' v-text='item.blocked ? mdiCheckboxIntermediate : mdiCheckboxBlankOutline')
div
v-card-title {{$t('common.resources')}}
@@ -42,25 +42,27 @@
v-menu(offset-y)
template(v-slot:activator="{ on }")
v-btn.mr-2(v-on='on' color='primary' small icon)
v-icon mdi-dots-vertical
v-icon(v-text='mdiDotsVertical')
v-list
v-list-item(v-if='!item.hidden' @click='hideResource(item, true)')
v-list-item-title <v-icon left>mdi-eye-off</v-icon> {{$t('admin.hide_resource')}}
v-list-item-title <v-icon left v-text='mdiEyeOff'></v-icon> {{$t('admin.hide_resource')}}
v-list-item(v-else @click='hideResource(item, false)')
v-list-item-title <v-icon left>mdi-eye</v-icon> {{$t('admin.show_resource')}}
v-list-item-title <v-icon left v-text='mdiEye'></v-icon> {{$t('admin.show_resource')}}
v-list-item(@click='deleteResource(item)')
v-list-item-title <v-icon left>mdi-delete</v-icon> {{$t('admin.delete_resource')}}
v-list-item-title <v-icon left v-text='mdiDelete'></v-icon> {{$t('admin.delete_resource')}}
//- v-list-item(@click='toggleUserBlock(item.ap_user)')
//- v-list-item-title <v-icon left>mdi-lock</v-icon> {{$t('admin.block_user')}}
</template>
<script>
import { mapState, mapActions } from 'vuex'
import get from 'lodash/get'
import { mdiDelete, mdiEye, mdiEyeOff, mdiDotsVertical, mdiCheckboxIntermediate, mdiCheckboxBlankOutline } from '@mdi/js'
export default {
name: 'Moderation',
data () {
return {
mdiDelete, mdiEye, mdiEyeOff, mdiDotsVertical, mdiCheckboxIntermediate, mdiCheckboxBlankOutline,
instances: [],
resources: [],
users: [],

5
components/admin/Places.vue
View File

@@ -32,13 +32,16 @@
:items='places')
template(v-slot:item.actions='{item}')
v-btn(@click='editPlace(item)' color='primary' icon)
v-icon mdi-pencil
v-icon(v-text='mdiPencil')
</template>
<script>
import { mapState, mapActions } from 'vuex'
import { mdiPencil } from '@mdi/js'
export default {
data () {
return {
mdiPencil,
loading: false,
dialog: false,
valid: false,

6
components/admin/Settings.vue
View File

@@ -53,9 +53,9 @@
v-card-actions
v-btn(text @click='showSMTP=true')
<v-icon v-if='showSMTPAlert' color='error'>mdi-alert</v-icon> {{$t('admin.show_smtp_setup')}}
<v-icon v-if='showSMTPAlert' color='error' v-text='mdiAlert'></v-icon> {{$t('admin.show_smtp_setup')}}
v-btn(text @click='$emit("complete")' color='primary' v-if='setup') {{$t('common.next')}}
v-icon mdi-arrow-right
v-icon(v-text='mdiArrowRight')
</template>
@@ -65,6 +65,7 @@ import { mapActions, mapState } from 'vuex'
import moment from 'dayjs'
import tzNames from './tz.json'
import locales from '../../locales/esm'
import { mdiAlert, mdiArrowRight } from '@mdi/js'
export default {
props: {
@@ -74,6 +75,7 @@ export default {
name: 'Settings',
data ({ $store }) {
return {
mdiAlert, mdiArrowRight,
title: $store.state.settings.title,
description: $store.state.settings.description,
locales: Object.keys(locales).map(locale => ({ value: locale, text: locales[locale] })),

10
components/admin/Theme.vue
View File

@@ -8,7 +8,7 @@
@change='uploadLogo'
accept='image/*')
template(slot='append-outer')
v-btn(color='warning' text @click='resetLogo') <v-icon>mdi-restore</v-icon> {{$t('common.reset')}}
v-btn(color='warning' text @click='resetLogo') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img(:src='`${settings.baseurl}/logo.png?${logoKey}`'
max-width="60px" max-height="60px" contain)
@@ -50,8 +50,8 @@
v-card-title {{$t('admin.footer_links')}}
v-card-text
v-btn(color='primary' text @click='openLinkModal') <v-icon>mdi-plus</v-icon> {{$t('admin.add_link')}}
v-btn(color='warning' text @click='reset') <v-icon>mdi-restore</v-icon> {{$t('common.reset')}}
v-btn(color='primary' text @click='openLinkModal') <v-icon v-text='mdiPlus'></v-icon> {{$t('admin.add_link')}}
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'
@@ -61,16 +61,18 @@
v-list-item-subtitle {{link.href}}
v-list-item-action
v-btn(icon color='error' @click.stop='removeFooterLink(link)')
v-icon mdi-delete-forever
v-icon(v-text='mdiDeleteForever')
</template>
<script>
import { mapActions, mapState } from 'vuex'
import { mdiDeleteForever, mdiRestore, mdiPlus } from '@mdi/js'
export default {
name: 'Theme',
data () {
return {
mdiDeleteForever, mdiRestore, mdiPlus,
valid: false,
logoKey: 0,
link: { href: '', label: '' },

12
components/admin/Users.vue
View File

@@ -3,11 +3,11 @@
v-card-title {{$t('common.users')}}
v-spacer
v-text-field(v-model='search'
append-icon='mdi-magnify' outlined rounded
:append-icon='mdiMagnify' outlined rounded
label='Search'
single-line hide-details)
v-btn(color='primary' text @click='newUserDialog = true') <v-icon>mdi-plus</v-icon> {{$t('common.new_user')}}
v-btn(color='primary' text @click='newUserDialog = true') <v-icon v-text='mdiPlus'></v-icon> {{$t('common.new_user')}}
//- ADD NEW USER
v-dialog(v-model='newUserDialog' :fullscreen='$vuetify.breakpoint.xsOnly')
@@ -20,7 +20,7 @@
:label="$t('common.email')"
:rules="$validators.email")
v-switch(v-model='new_user.is_admin' :label="$t('common.admin')" inset)
v-alert(type='info' :closable='false') {{$t('admin.user_add_help')}}
v-alert(type='info' :closable='false' :icon='mdiInformation') {{$t('admin.user_add_help')}}
v-card-actions
v-spacer
v-btn(@click='newUserDialog=false' color='error') {{$t('common.cancel')}}
@@ -34,8 +34,8 @@
:hide-default-footer='users.length<5'
:search='search')
template(v-slot:item.is_active='{item}')
v-icon(v-if='item.is_active' color='success') mdi-check
v-icon(v-else color='warning') mdi-close
v-icon(v-if='item.is_active' color='success' v-text='mdiCheck')
v-icon(v-else color='warning' v-text='mdiClose')
template(v-slot:item.actions='{item}')
v-btn(v-if='item.recover_code' text small :to='`/user_confirm/${item.recover_code}`') {{$t('common.confirm')}}
v-btn(text small @click='toggle(item)'
@@ -49,6 +49,7 @@
<script>
import { mapState } from 'vuex'
import get from 'lodash/get'
import { mdiClose, mdiMagnify, mdiCheck, mdiPlus, mdiInformation } from '@mdi/js'
export default {
name: 'Users',
@@ -57,6 +58,7 @@ export default {
},
data () {
return {
mdiClose, mdiMagnify, mdiCheck, mdiPlus, mdiInformation,
newUserDialog: false,
valid: false,
new_user: {