Physton/sd-webui-prompt-all-in-one
1
0
Fork 0
mirror of https://github.com/Physton/sd-webui-prompt-all-in-one.git synced 2026-01-26 19:29:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add Favorites Tab to Keyword Group

Browse Source 
添加收藏列表Tab到关键词组
This commit is contained in:
Physton
2023-08-18 22:34:48 +08:00
parent 7935404fc6
commit 98b4fbd46a
7 changed files with 132 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
javascript/main.entry.js
View File

File diff suppressed because one or more lines are too long

2
javascript/main.entry.js.map
View File

File diff suppressed because one or more lines are too long

15
src/src/App.vue
View File

@@ -762,16 +762,15 @@ export default {
})
data.toEn.set(local, en)
}
for (let item of this.groupTags) {
for (let group of item.groups) {
if (group.type && group.typ == 'wrap') continue
this.groupTags.forEach((item, index) => {
item.tabKey = 'groupTags-' + index
item.groups.forEach((group, subIndex) => {
group.tabKey = 'subGroupTags-' + index + '-' + subIndex
if (group.type && group.type == 'wrap') return
let key = common.getTagsColorKey(item.name, group.name)
if (!this.groupTagsColor[key]) {
this.groupTagsColor[key] = ref(common.fitterInputColor(group.color))
}
for (let en in group.tags) {
if (!en) continue
this.groupTagsColorKeyCache[en] = key
@@ -780,8 +779,8 @@ export default {
if (!local || en == local) continue
setData(en, local)
}
}
}
})
})
this.groupTagsTranslateCache = data
},
updateTippyState() {

44
src/src/components/phystonPrompt.vue
View File

@@ -414,24 +414,52 @@
</div>
<div class="group-tabs" v-show="!hideGroupTags && groupTags.length">
<div class="group-header" ref="groupTabsHeader">
<div :class="['group-tab', 'favorite' == groupTagsActive ? 'active' : '']"
@click="activeGroupTab('favorite')"
data-name="favorite">{{ getLang('favorite') }}</div>
<div v-for="(item, index) in groupTags"
:key="index"
:class="['group-tab', index == groupTagsActive ? 'active' : '']"
:class="['group-tab', item.tabKey == groupTagsActive ? 'active' : '']"
@click="activeGroupTab(index)"
:data-name="item.name">{{ item.name }}</div>
</div>
<div class="group-body">
<div v-for="(item, index) in groupTags" :key="index" :class="['group-main', index == groupTagsActive ? 'active' : '']">
<div class="sub-group-header" v-if="index == groupTagsActive">
<div :class="['group-main', 'favorite' == groupTagsActive ? 'active' : '']">
<div class="sub-group-header" v-if="'favorite' == groupTagsActive">
<div v-for="(item) in getCurrentTypeFavorites()"
:key="item.key"
:class="['sub-group-tab', 'favorite-' + item.key == subGroupTagsActive ? 'active' : '']"
@click="activeSubGroupTab('favorite', item.key)"
:data-name="item.name">{{ getLang(item.name) }}</div>
</div>
<div class="sub-group-body" v-if="'favorite' == groupTagsActive">
<div v-for="(item) in getCurrentTypeFavorites()"
:key="item.key"
:class="['sub-group-main', 'favorite-' + item.key == subGroupTagsActive ? 'active' : '']">
<div class="group-tags" v-if="'favorite-' + item.key == subGroupTagsActive">
<div class="tag-item" ref="groupTagItem" v-for="(favorite) in item.list"
v-tooltip="getGroupTagTooltip(favorite.name, favorite.prompt)"
@click="onClickGroupTagFavorite(favorite)">
<div class="tag-local">{{ favorite.name == '' ? favorite.prompt : favorite.name }}</div>
<div class="tag-en">{{ favorite.prompt }}</div>
</div>
</div>
</div>
</div>
</div>
<div v-for="(item, index) in groupTags" :key="index" :class="['group-main', item.tabKey == groupTagsActive ? 'active' : '']">
<div class="sub-group-header" v-if="item.tabKey == groupTagsActive">
<div v-for="(group, subIndex) in item.groups"
:key="subIndex"
:class="[group.type && group.type === 'wrap' ? 'sub-group-tag-wrap': 'sub-group-tab', subIndex == subGroupTagsActive ? 'active' : '']"
@click="activeSubGroupTab(subIndex)"
:class="[group.type && group.type === 'wrap' ? 'sub-group-tag-wrap': 'sub-group-tab', group.tabKey == subGroupTagsActive ? 'active' : '']"
@click="activeSubGroupTab(index, subIndex)"
:data-name="group.name">{{ group.name }}</div>
</div>
<div class="sub-group-body" v-if="index == groupTagsActive">
<div v-for="(group, subIndex) in item.groups" :key="subIndex" :class="['sub-group-main', subIndex == subGroupTagsActive ? 'active' : '']">
<div class="group-tags" v-if="subIndex == subGroupTagsActive">
<div class="sub-group-body" v-if="item.tabKey == groupTagsActive">
<div v-for="(group, subIndex) in item.groups" :key="subIndex" :class="['sub-group-main', group.tabKey == subGroupTagsActive ? 'active' : '']">
<div class="group-tags" v-if="group.tabKey == subGroupTagsActive">
<div class="tag-item" ref="groupTagItem" v-for="(local, en) in group.tags"
v-tooltip="getGroupTagTooltip(local, en)"
@click="onClickGroupTag(local, en)">

58
src/src/mixins/phystonPrompt/groupTagsMixin.js
View File

@@ -4,23 +4,50 @@ import {ref} from "vue"
export default {
data() {
return {
groupTagsActive: 0,
subGroupTagsActive: 0,
groupTagsActive: '',
subGroupTagsActive: '',
}
},
watch: {
groupTags: {
handler() {
if (!this.groupTagsActive || !this.subGroupTagsActive) {
this.groupTagsActive = 'favorite'
this.subGroupTagsActive = 'favorite-' + this.favoriteKey
/*for (let item of this.groupTags) {
this.groupTagsActive = item.tabKey
for (let group of item.groups) {
if (group.type && group.typ == 'wrap') continue
this.subGroupTagsActive = group.tabKey
break
}
break
}*/
}
this._setGroupTagItemWidth()
},
deep: true,
immediate: true,
},
favorites: {
handler() {
},
deep: true,
immediate: true,
}
},
methods: {
activeGroupTab(index) {
this.groupTagsActive = index
this.subGroupTagsActive = 0
if (index === 'favorite') {
this.groupTagsActive = 'favorite'
this.subGroupTagsActive = 'favorite-' + this.favoriteKey
index = 0
} else {
this.groupTagsActive = this.groupTags[index].tabKey
this.subGroupTagsActive = this.groupTags[index].groups[0].tabKey
index += 1
}
let scrollLeft = this.$refs.groupTabsHeader.children[index].offsetLeft - this.$refs.groupTabsHeader.offsetWidth / 2 + this.$refs.groupTabsHeader.children[index].offsetWidth / 2
this.$refs.groupTabsHeader.scrollTo({
left: scrollLeft,
@@ -28,13 +55,18 @@ export default {
})
this._setGroupTagItemWidth()
},
activeSubGroupTab(index) {
this.subGroupTagsActive = index
activeSubGroupTab(index, subIndex) {
if (index === 'favorite') {
this.subGroupTagsActive = 'favorite-' + subIndex
} else {
this.subGroupTagsActive = this.groupTags[index].groups[subIndex].tabKey
}
this._setGroupTagItemWidth()
},
_setGroupTagItemWidth() {
// this.$refs.groupTagItem
this.$nextTick(() => {
if (!this.$refs.groupTagItem) return
this.$refs.groupTagItem.forEach((item, index) => {
item.style.width = 'auto'
})
@@ -42,9 +74,11 @@ export default {
this.$refs.groupTagItem.forEach((item, index) => {
maxWidth = Math.max(maxWidth, item.offsetWidth)
})
this.$refs.groupTagItem.forEach((item, index) => {
item.style.width = maxWidth + 'px'
})
if (maxWidth > 0) {
this.$refs.groupTagItem.forEach((item, index) => {
item.style.width = maxWidth + 'px'
})
}
})
},
onClickHideGroupTags() {
@@ -54,6 +88,12 @@ export default {
this._appendTag(en, local, false, -1, 'text')
this.updateTags()
},
onClickGroupTagFavorite(favorite) {
favorite.tags.forEach((tag) => {
this._appendTag(tag.value, tag.localValue, tag.disabled, -1, tag.type)
})
this.updateTags()
},
getGroupTagTooltip(local, en) {
let html = ''
if (local && local !== en) {

1
src/src/mixins/phystonPrompt/headerMixin.js
View File

@@ -520,6 +520,7 @@ export default {
this.favorites = typeof window.phystonPromptfavorites === 'object' ? window.phystonPromptfavorites : []
},
getCurrentTypeFavorites() {
this.favorites = typeof window.phystonPromptfavorites === 'object' ? window.phystonPromptfavorites : []
let favorites = []
this.favorites.forEach(favorite => {
if (this.neg) {

1
src/src/mixins/phystonPrompt/tagMixin.js
View File

@@ -144,7 +144,6 @@ export default {
return tag
},
_isTagBlacklist(tag) {
console.log(tag)
if (typeof tag['type'] === 'string' && tag.type === 'wrap') return false
if (tag.isLora) {
if (this.blacklist.lora && this.blacklist.lora.includes(tag.loraName)) return true