Работа над BookmarkSettings

This commit is contained in:
Book Pauk
2020-11-04 14:43:06 +07:00
parent b2e0bcf995
commit f8c4960079
2 changed files with 79 additions and 25 deletions

View File

@@ -21,7 +21,7 @@
<div class="col row"> <div class="col row">
<div class="left-panel column items-center bg-grey-3"> <div class="left-panel column items-center bg-grey-3">
<q-btn class="q-mb-sm" round dense color="blue" icon="la la-edit" @click.stop="editBookmark" size="14px"> <q-btn class="q-mb-sm" round dense color="blue" icon="la la-edit" @click.stop="editBookmark" size="14px" :disabled="!selected">
<q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Редактировать закладку</q-tooltip> <q-tooltip :delay="1500" anchor="bottom middle" content-style="font-size: 80%">Редактировать закладку</q-tooltip>
</q-btn> </q-btn>
<q-btn class="q-mb-sm" round dense color="blue" icon="la la-plus" @click.stop="addBookmark" size="14px"> <q-btn class="q-mb-sm" round dense color="blue" icon="la la-plus" @click.stop="addBookmark" size="14px">
@@ -72,6 +72,7 @@ import * as lu from '../linkUtils';
const BookmarkSettingsProps = Vue.extend({ const BookmarkSettingsProps = Vue.extend({
props: { props: {
libs: Object, libs: Object,
addBookmarkVisible: Boolean,
} }
}); });
@@ -91,6 +92,7 @@ class BookmarkSettings extends BookmarkSettingsProps {
expanded = []; expanded = [];
created() { created() {
this.afterInit = true;
} }
mounted() { mounted() {
@@ -109,7 +111,7 @@ class BookmarkSettings extends BookmarkSettingsProps {
this.libs.groups.forEach(group => { this.libs.groups.forEach(group => {
const rkey = `${i}`; const rkey = `${i}`;
const g = {label: group.r, key: rkey, children: []}; const g = {label: group.r, key: rkey, children: []};
this.links[rkey] = group.r; this.links[rkey] = {l: group.r, c: ''};
let j = 0; let j = 0;
group.list.forEach(link => { group.list.forEach(link => {
@@ -119,7 +121,7 @@ class BookmarkSettings extends BookmarkSettingsProps {
key key
}); });
this.links[key] = link.l; this.links[key] = link;
if (link.l == this.libs.startLink && expanded.indexOf(rkey) < 0) { if (link.l == this.libs.startLink && expanded.indexOf(rkey) < 0) {
expanded.push(rkey); expanded.push(rkey);
} }
@@ -131,9 +133,12 @@ class BookmarkSettings extends BookmarkSettingsProps {
i++; i++;
}); });
this.$nextTick(() => { if (this.afterInit) {
this.expanded = expanded; this.$nextTick(() => {
}); this.expanded = expanded;
});
this.afterInit = false;
}
return result; return result;
} }
@@ -147,22 +152,36 @@ class BookmarkSettings extends BookmarkSettingsProps {
if (!this.selected) if (!this.selected)
return; return;
if (this.selected.indexOf('-') < 0) {//rootLink if (this.selected.indexOf('-') < 0) {//rootLink
this.$emit('do-action', {action: 'setRootLink', data: this.links[this.selected]}); this.$emit('do-action', {action: 'setRootLink', data: this.links[this.selected].l});
} else {//selectedLink } else {//selectedLink
this.$emit('do-action', {action: 'setSelectedLink', data: this.links[this.selected]}); this.$emit('do-action', {action: 'setSelectedLink', data: this.links[this.selected].l});
} }
this.close();
//this.close();
} }
openOptions() { openOptions() {
} }
editBookmark() {
this.$emit('do-action', {action: 'editBookmark', data: {link: this.links[this.selected].l, desc: this.links[this.selected].c}});
}
addBookmark() {
this.$emit('do-action', {action: 'addBookmark'});
}
delBookmark() {
}
close() { close() {
this.afterInit = false;
this.$emit('close'); this.$emit('close');
} }
keyHook(event) { keyHook(event) {
if (this.addBookmarkVisible)
return false;
if (event.type == 'keydown' && event.key == 'Escape') { if (event.type == 'keydown' && event.key == 'Escape') {
this.close(); this.close();
return true; return true;

View File

@@ -68,7 +68,8 @@
<template slot="header"> <template slot="header">
<div class="row items-center"> <div class="row items-center">
<q-icon class="q-mr-sm" name="la la-bookmark" size="28px"></q-icon> <q-icon class="q-mr-sm" name="la la-bookmark" size="28px"></q-icon>
Добавить закладку <div v-if="addBookmarkMode == 'edit'">Редактировать закладку</div>
<div v-else>Добавить закладку</div>
</div> </div>
</template> </template>
@@ -97,7 +98,9 @@
</template> </template>
</Dialog> </Dialog>
</div> </div>
<BookmarkSettings v-if="bookmarkSettingsActive" ref="bookmarkSettings" :libs="libs" @do-action="doAction" @close="closeBookmarkSettings"></BookmarkSettings> <BookmarkSettings v-if="bookmarkSettingsActive" ref="bookmarkSettings" :libs="libs" :addBookmarkVisible="addBookmarkVisible"
@do-action="doAction" @close="closeBookmarkSettings">
</BookmarkSettings>
</Window> </Window>
</template> </template>
@@ -154,6 +157,7 @@ class ExternalLibs extends Vue {
addBookmarkVisible = false; addBookmarkVisible = false;
transparentLayoutVisible = false; transparentLayoutVisible = false;
addBookmarkMode = '';
bookmarkLink = ''; bookmarkLink = '';
bookmarkDesc = ''; bookmarkDesc = '';
defaultRootLink = ''; defaultRootLink = '';
@@ -297,6 +301,8 @@ class ExternalLibs extends Vue {
case 'setLibs': this.commitLibs(event.data); break; case 'setLibs': this.commitLibs(event.data); break;
case 'setRootLink': this.rootLink = event.data; this.rootLinkInput(); break; case 'setRootLink': this.rootLink = event.data; this.rootLinkInput(); break;
case 'setSelectedLink': this.selectedLink = event.data; this.selectedLinkInput(); break; case 'setSelectedLink': this.selectedLink = event.data; this.selectedLinkInput(); break;
case 'editBookmark': this.addBookmark('edit', event.data.link, event.data.desc); break;
case 'addBookmark': this.addBookmark('add'); break;
} }
} }
@@ -439,9 +445,17 @@ class ExternalLibs extends Vue {
} }
} }
addBookmark() { addBookmark(mode = 'add', link = '', desc = '') {
this.bookmarkLink = (this.bookUrl ? this.makeProxySubst(lu.addProtocol(this.bookUrl), true) : '');
this.bookmarkDesc = ''; if (mode == 'edit') {
this.editBookmarkLink = this.bookmarkLink = link;
this.editBookmarkDesc = this.bookmarkDesc = desc;
} else {
this.bookmarkLink = (this.bookUrl ? this.makeProxySubst(lu.addProtocol(this.bookUrl), true) : '');
this.bookmarkDesc = '';
}
this.addBookmarkMode = mode;
this.addBookmarkVisible = true; this.addBookmarkVisible = true;
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.bookmarkLink.focus(); this.$refs.bookmarkLink.focus();
@@ -474,7 +488,6 @@ class ExternalLibs extends Vue {
bookmarkDescKeyDown(event) { bookmarkDescKeyDown(event) {
if (event.key == 'Enter') { if (event.key == 'Enter') {
this.okAddBookmark(); this.okAddBookmark();
event.preventDefault();
} }
} }
@@ -482,7 +495,7 @@ class ExternalLibs extends Vue {
if (!this.bookmarkLink) if (!this.bookmarkLink)
return; return;
const link = lu.addProtocol(this.bookmarkLink); const link = (this.addBookmarkMode == 'edit' ? lu.addProtocol(this.editBookmarkLink) : lu.addProtocol(this.bookmarkLink));
let index = -1; let index = -1;
try { try {
index = lu.getRootIndexByUrl(this.libs.groups, link); index = lu.getRootIndexByUrl(this.libs.groups, link);
@@ -491,14 +504,25 @@ class ExternalLibs extends Vue {
return; return;
} }
let libs = _.cloneDeep(this.libs);
//добавление
//есть группа в закладках //есть группа в закладках
if (index >= 0) { if (index >= 0) {
const item = lu.getListItemByLink(this.libs.groups[index].list, link); const item = lu.getListItemByLink(libs.groups[index].list, link);
if (!item || item.c != this.bookmarkDesc) { //редактирование
if (item && this.addBookmarkMode == 'edit') {
if (item) {
//редактируем
item.l = link;
item.c = this.bookmarkDesc;
this.commitLibs(libs);
} else {
await this.$root.stdDialog.alert('Не удалось отредактировать закладку', 'Ошибка');
}
} else if (!item) {
//добавляем //добавляем
let libs = _.cloneDeep(this.libs);
if (libs.groups[index].list.length >= 100) { if (libs.groups[index].list.length >= 100) {
await this.$root.stdDialog.alert('Достигнут предел количества закладок для этого сайта', 'Ошибка'); await this.$root.stdDialog.alert('Достигнут предел количества закладок для этого сайта', 'Ошибка');
return; return;
@@ -506,10 +530,18 @@ class ExternalLibs extends Vue {
libs.groups[index].list.push({l: link, c: this.bookmarkDesc}); libs.groups[index].list.push({l: link, c: this.bookmarkDesc});
this.commitLibs(libs); this.commitLibs(libs);
} else if (item.c != this.bookmarkDesc) {
if (await this.$root.stdDialog.confirm(`Такая закладка уже существует с другим описанием<br>` +
`Заменить '${this.$sanitize(item.c)}' на '${this.$sanitize(this.bookmarkDesc)}'?`, ' ')) {
item.c = this.bookmarkDesc;
this.commitLibs(libs);
} else
return;
} else {
await this.$root.stdDialog.alert('Такая закладка уже существует', ' ');
return;
} }
} else {//нет группы в закладках } else {//нет группы в закладках
let libs = _.cloneDeep(this.libs);
if (libs.groups.length >= 100) { if (libs.groups.length >= 100) {
await this.$root.stdDialog.alert('Достигнут предел количества различных сайтов в закладках', 'Ошибка'); await this.$root.stdDialog.alert('Достигнут предел количества различных сайтов в закладках', 'Ошибка');
return; return;
@@ -573,10 +605,13 @@ class ExternalLibs extends Vue {
keyHook(event) { keyHook(event) {
if (this.$root.rootRoute() == '/external-libs') { if (this.$root.rootRoute() == '/external-libs') {
if (this.$root.stdDialog.active)
return false;
if (this.bookmarkSettingsActive && this.$refs.bookmarkSettings.keyHook(event)) if (this.bookmarkSettingsActive && this.$refs.bookmarkSettings.keyHook(event))
return true; return true;
if (this.$refs.dialogAddBookmark.active) if (this.addBookmarkVisible)
return false; return false;
if (event.type == 'keydown' && event.key == 'F4') { if (event.type == 'keydown' && event.key == 'F4') {