- {`${t('moveSelectedFilesTo')}${toPath}`}
+ {`${t('moveSelectedFilesTo')} ${toPath}`}
{data.path.map((v) => - {v.split(/[/\\]/).pop()}
)}
@@ -860,6 +883,7 @@ export function useFileItemActions (
const tagId = +`${e.key}`.split('toggle-tag-')[1]
const { is_remove } = await toggleCustomTagToImg({ tag_id: tagId, img_path: file.fullpath })
const tag = global.conf?.all_custom_tags.find((v) => v.id === tagId)?.name!
+ tagStore.refreshTags([file.fullpath])
message.success(t(is_remove ? 'removedTagFromImage' : 'addedTagToImage', { tag }))
return
}
diff --git a/vue/src/store/useTagStore.ts b/vue/src/store/useTagStore.ts
new file mode 100644
index 0000000..8892e13
--- /dev/null
+++ b/vue/src/store/useTagStore.ts
@@ -0,0 +1,49 @@
+import { Tag, batchGetTagsByPath } from '@/api/db'
+import { createReactiveQueue } from '@/util'
+import { defineStore } from 'pinia'
+import sjcl from 'sjcl'
+import { reactive } from 'vue'
+
+export const useTagStore = defineStore('useTagStore', () => {
+ const q = createReactiveQueue()
+ const fetchPendingImagePaths = new Set
()
+ const tagMap = reactive(new Map())
+ const fetchImageTags = async (paths: string[]) => {
+ paths = paths.filter(v => !fetchPendingImagePaths.has(v) && !tagMap.has(v))
+ if (!paths.length) {
+ return
+ }
+ try {
+ paths.forEach(v => tagMap.set(v, []))
+ const res = await batchGetTagsByPath(paths)
+ for (const path in res) {
+ tagMap.set(path, res[path])
+ }
+ } finally {
+ paths.forEach(v => fetchPendingImagePaths.delete(v))
+ }
+ }
+ const colors = ['pink', 'red', 'orange', 'green', 'cyan', 'blue', 'purple']
+ const colorCache = new Map()
+ const getColor = (tag: string) => {
+ let color = colorCache.get(tag)
+ if (!color) {
+ const hash = sjcl.hash.sha256.hash(tag)
+ const num = parseInt(sjcl.codec.hex.fromBits(hash), 16) % colors.length
+ color = colors[num]
+ colorCache.set(tag, color)
+ }
+ return color
+ }
+ const refreshTags = async (paths: string[]) => {
+ paths.forEach(v => tagMap.delete(v))
+ await fetchImageTags(paths)
+ }
+ return {
+ tagMap,
+ q,
+ getColor,
+ fetchImageTags,
+ refreshTags
+ }
+})