292
292
</dl>
293
293
</NcAppSettingsSection>
294
294
<NcAppSettingsSection id="snippets" :name="t('mail', 'Snippets')">
295
+ <NcButton type="primary" @click="() => snippetDialogOpen = true">
296
+ {{ t('mail', 'Create new snippet') }}
297
+ </NcButton>
295
298
<h6>{{ t('mail','My snippets') }}</h6>
296
- <List snippets="mySnippets" />
299
+ <List : snippets="mySnippets" />
297
300
<h6>{{ t('mail','Shared with me') }}</h6>
298
- <List snippets="shareSnippet "
301
+ <List : snippets="sharedSnippet "
299
302
:shared="true" />
300
303
</NcAppSettingsSection>
304
+ <NcDialog :open.sync="snippetDialogOpen"
305
+ :name="t('mail','New snippet')"
306
+ :is-form="true"
307
+ :buttons="snippetButtons"
308
+ size="normal">
309
+ <NcInputField :value.sync="localSnippet.title" :label="t('mail','Title of the snippet')" />
310
+ <NcTextArea rows="7"
311
+ :value.sync="localSnippet.content"
312
+ :label="t('mail','Content of the snippet')"
313
+ resize="horizontal" />
314
+ </NcDialog>
301
315
</NcAppSettingsDialog>
302
316
</div>
303
317
</template>
@@ -307,7 +321,7 @@ import { generateUrl } from '@nextcloud/router'
307
321
import { showError } from '@nextcloud/dialogs'
308
322
import CompactMode from 'vue-material-design-icons/ReorderHorizontal.vue'
309
323
310
- import { NcAppSettingsSection, NcAppSettingsDialog, NcButton, NcLoadingIcon as IconLoading, NcCheckboxRadioSwitch } from '@nextcloud/vue'
324
+ import { NcAppSettingsSection, NcAppSettingsDialog, NcButton, NcLoadingIcon as IconLoading, NcCheckboxRadioSwitch, NcDialog, NcInputField, NcTextArea } from '@nextcloud/vue'
311
325
312
326
import IconAdd from 'vue-material-design-icons/Plus.vue'
313
327
import IconEmail from 'vue-material-design-icons/Email.vue'
@@ -321,6 +335,8 @@ import InternalAddress from './InternalAddress.vue'
321
335
import isMobile from '@nextcloud/vue/dist/Mixins/isMobile.js'
322
336
import { mapGetters } from 'vuex'
323
337
import List from './snippets/List.vue'
338
+ import IconCancel from '@mdi/svg/svg/cancel.svg?raw'
339
+ import IconCheck from '@mdi/svg/svg/check.svg?raw'
324
340
325
341
export default {
326
342
name: 'AppSettingsMenu',
@@ -340,6 +356,9 @@ export default {
340
356
VerticalSplit,
341
357
HorizontalSplit,
342
358
List,
359
+ NcDialog,
360
+ NcInputField,
361
+ NcTextArea,
343
362
},
344
363
mixins: [isMobile],
345
364
props: {
@@ -372,6 +391,32 @@ export default {
372
391
showMailSettings: true,
373
392
selectedAccount: null,
374
393
mailvelopeIsAvailable: false,
394
+ snippetDialogOpen: false,
395
+ localSnippet: {
396
+ title: '',
397
+ content: '',
398
+ },
399
+ snippetButtons: [
400
+ {
401
+ label: 'Cancel',
402
+ icon: IconCancel,
403
+ callback: () => {
404
+ this.snippetDialogOpen = false
405
+ this.localSnippet = {
406
+ title: '',
407
+ content: '',
408
+ }
409
+ },
410
+ },
411
+ {
412
+ label: 'Ok',
413
+ type: 'primary',
414
+ icon: IconCheck,
415
+ callback: () => {
416
+ this.$store.dispatch('createSnippet', { ...this.localSnippet })
417
+ },
418
+ },
419
+ ],
375
420
}
376
421
},
377
422
computed: {
@@ -409,10 +454,10 @@ export default {
409
454
return this.$store.getters.getPreference('layout-mode', 'vertical-split')
410
455
},
411
456
mySnippets() {
412
- return this.$store.getters.getSnippets()
457
+ return this.$store.getters.getMySnippets
413
458
},
414
- shareSnippet () {
415
- return this.$store.getters.getSharedSnippets()
459
+ sharedSnippet () {
460
+ return this.$store.getters.getSharedSnippets
416
461
},
417
462
},
418
463
watch: {
@@ -430,6 +475,10 @@ export default {
430
475
mounted() {
431
476
this.sortOrder = this.$store.getters.getPreference('sort-order', 'newest')
432
477
document.addEventListener.call(window, 'mailvelope', () => this.checkMailvelope())
478
+ if (!this.$store.getters.areSnippetsFetched) {
479
+ this.$store.dispatch('fetchMySnippets')
480
+ this.$store.dispatch('fetchSharedSnippets')
481
+ }
433
482
},
434
483
updated() {
435
484
this.checkMailvelope()
0 commit comments