@voplus/morpho-document 5.0.18 → 5.0.19

package/es/components/TagView/state.js

@@ -1,299 +1,323 @@
-import { __decorate } from "tslib";
-import { action, computed, makeObservable, observable, runInAction } from "mobx";
-/** colors of preset */
-export const colorList = [
-    { value: "magenta", color: "rgba(235,47,150,1)" },
-    { value: "red", color: "rgba(245,34,45,1)" },
-    { value: "volcano", color: "rgba(250,84,28,1)" },
-    { value: "orange", color: "rgba(250,140,22,1)" },
-    { value: "gold", color: "rgba(250,173,20,1)" },
-    { value: "lime", color: "rgba(160,217,17,1)" },
-    { value: "green", color: "rgba(82,196,26,1)" },
-    { value: "cyan", color: "rgba(19,194,194,1)" },
-    { value: "blue", color: "rgba(24,144,255,1)" },
-    { value: "geekblue", color: "rgba(47,84,235,1)" },
-    { value: "purple", color: "rgba(114,46,209,1)" },
-    { value: "black", color: "rgba(0,0,0,1)" },
-    { value: "grey", color: "rgba(250,250,250,1)", borderColor: "#d9d9d9" },
-];
-export class State {
-    constructor(id, documentStore) {
-        Object.defineProperty(this, "id", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: id
-        });
-        Object.defineProperty(this, "documentStore", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: documentStore
-        });
-        /** porps list of tags */
-        Object.defineProperty(this, "tags", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        /** Add list of tags */
-        Object.defineProperty(this, "addTags", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        /** load list of tags */
-        Object.defineProperty(this, "list", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        /** name of tag */
-        Object.defineProperty(this, "name", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: ""
-        });
-        /** color of tag */
-        Object.defineProperty(this, "color", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: "geekblue"
-        });
-        /** loaded of tag list */
-        Object.defineProperty(this, "saveLoading", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        /** data loading */
-        Object.defineProperty(this, "loading", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        /**  visible of AddTagDialog */
-        Object.defineProperty(this, "visible", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        /** 当前可更改Tag */
-        Object.defineProperty(this, "info", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        /**  */
-        Object.defineProperty(this, "timer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: undefined
-        });
-        Object.defineProperty(this, "onkeydown", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (e) => {
-                if (e.keyCode !== 13)
-                    return;
-                const tag = this.list.find((tag) => tag.name === name);
-                if (tag)
-                    this.color = tag.color;
-                this.deduplicate();
-            }
-        });
-        Object.defineProperty(this, "onChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (name) => {
-                this.name = name.trim();
-                const tag = this.list.find((tag) => tag.name === name);
-                if (tag)
-                    this.color = tag.color;
-                this.deduplicate();
-            }
-        });
-        Object.defineProperty(this, "onSearch", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (value) => {
-                if (!value)
-                    return;
-                if (this.timer)
-                    clearTimeout(this.timer);
-                this.name = value.trim();
-                this.timer = setTimeout(() => {
-                    this.loadData();
-                    this.timer = undefined;
-                }, 300);
-            }
-        });
-        Object.defineProperty(this, "onVisibleChange", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (visible) => {
-                this.visible = !!visible;
-            }
-        });
-        Object.defineProperty(this, "onOk", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: async () => {
-                if (!this.addTags.length)
-                    return;
-                const AddTags = this.addTags.map(({ name, color }) => color ? { Name: name, Color: color } : { Name: name });
-                this.saveLoading = true;
-                await this.documentStore.edit(this.id, { data: { AddTags }, error: "message" });
-                runInAction(() => (this.saveLoading = false));
-                runInAction(() => (this.visible = false));
-                // const tags = state.addTags.map(name => ({ name, color: state.color }));
-                runInAction(() => (this.tags = [...this.tags, ...this.addTags]));
-            }
-        });
-        makeObservable(this);
-    }
-    get show() {
-        return !this.tags.length || this.visible;
-    }
-    /** Name of 当前可更改Tag */
-    get editTagName() {
-        return this.info ? this.info.name : "";
-    }
-    onRemove(e, tagName) {
-        e.preventDefault();
-        this.addTags = this.addTags.filter(({ name }) => tagName !== name);
-        if (this.editTagName === tagName)
-            this.info = {};
-    }
-    async onClose(removedTag) {
-        this.tags = this.tags.filter(({ name }) => name !== removedTag);
-        await this.documentStore.edit(this.id, {
-            data: { RemoveTags: [removedTag] },
-            error: "message",
-        });
-    }
-    deduplicate() {
-        if (this.name &&
-            !this.addTags.some((item) => item.name === this.name && item.color === this.color)
-        //  && !state.tags.some(tag => tag.name === state.name)
-        ) {
-            this.addTags = [
-                ...this.addTags,
-                { name: this.name, color: this.color === "grey" ? "" : this.color },
-            ];
-            this.reset();
-        }
-    }
-    async loadData() {
-        try {
-            this.loading = true;
-            await this.documentStore.loadTags(this.name || "").then((res) => {
-                runInAction(() => (this.list = res));
-                runInAction(() => (this.loading = false));
-            });
-        }
-        catch (error) {
-            runInAction(() => (this.loading = false));
-        }
-    }
-    selectColor(value) {
-        this.color = value;
-        if (this.info)
-            this.info.color = value;
-        this.deduplicate();
-    }
-    init() {
-        this.addTags = [];
-        this.reset();
-    }
-    reset() {
-        this.name = "";
-        this.color = "geekblue";
-        this.info = {};
-    }
-}
-__decorate([
-    observable
-], State.prototype, "tags", void 0);
-__decorate([
-    observable
-], State.prototype, "addTags", void 0);
-__decorate([
-    observable
-], State.prototype, "list", void 0);
-__decorate([
-    observable
-], State.prototype, "name", void 0);
-__decorate([
-    observable
-], State.prototype, "color", void 0);
-__decorate([
-    observable
-], State.prototype, "saveLoading", void 0);
-__decorate([
-    observable
-], State.prototype, "loading", void 0);
-__decorate([
-    observable
-], State.prototype, "visible", void 0);
-__decorate([
-    observable
-], State.prototype, "info", void 0);
-__decorate([
-    computed
-], State.prototype, "show", null);
-__decorate([
-    computed
-], State.prototype, "editTagName", null);
-__decorate([
-    action
-], State.prototype, "onRemove", null);
-__decorate([
-    action
-], State.prototype, "onClose", null);
-__decorate([
-    action
-], State.prototype, "onkeydown", void 0);
-__decorate([
-    action
-], State.prototype, "onChange", void 0);
-__decorate([
-    action
-], State.prototype, "deduplicate", null);
-__decorate([
-    action
-], State.prototype, "onSearch", void 0);
-__decorate([
-    action
-], State.prototype, "loadData", null);
-__decorate([
-    action
-], State.prototype, "onVisibleChange", void 0);
-__decorate([
-    action
-], State.prototype, "onOk", void 0);
-__decorate([
-    action
-], State.prototype, "selectColor", null);
-__decorate([
-    action
-], State.prototype, "init", null);
-__decorate([
-    action
-], State.prototype, "reset", null);
+import { __decorate } from "tslib";
+import { action, computed, makeObservable, observable, runInAction } from "mobx";
+/** colors of preset */
+export const colorList = [
+    { value: "magenta", color: "rgba(235,47,150,1)" },
+    { value: "red", color: "rgba(245,34,45,1)" },
+    { value: "volcano", color: "rgba(250,84,28,1)" },
+    { value: "orange", color: "rgba(250,140,22,1)" },
+    { value: "gold", color: "rgba(250,173,20,1)" },
+    { value: "lime", color: "rgba(160,217,17,1)" },
+    { value: "green", color: "rgba(82,196,26,1)" },
+    { value: "cyan", color: "rgba(19,194,194,1)" },
+    { value: "blue", color: "rgba(24,144,255,1)" },
+    { value: "geekblue", color: "rgba(47,84,235,1)" },
+    { value: "purple", color: "rgba(114,46,209,1)" },
+    { value: "black", color: "rgba(0,0,0,1)" },
+    { value: "grey", color: "rgba(250,250,250,1)", borderColor: "#d9d9d9" },
+];
+export class State {
+    constructor(documentStore, items) {
+        Object.defineProperty(this, "documentStore", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: documentStore
+        });
+        Object.defineProperty(this, "items", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: items
+        });
+        Object.defineProperty(this, "id", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /** porps list of tags */
+        Object.defineProperty(this, "tags", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        /** Add list of tags */
+        Object.defineProperty(this, "addTags", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        /** load list of tags */
+        Object.defineProperty(this, "list", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        /** name of tag */
+        Object.defineProperty(this, "name", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: ""
+        });
+        /** color of tag */
+        Object.defineProperty(this, "color", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: "geekblue"
+        });
+        /** loaded of tag list */
+        Object.defineProperty(this, "saveLoading", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        /** data loading */
+        Object.defineProperty(this, "loading", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        /**  visible of AddTagDialog */
+        Object.defineProperty(this, "visible", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        /** 当前可更改Tag */
+        Object.defineProperty(this, "info", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**  */
+        Object.defineProperty(this, "timer", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: undefined
+        });
+        Object.defineProperty(this, "onkeydown", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (e) => {
+                if (e.keyCode !== 13)
+                    return;
+                const tag = this.list.find((tag) => tag.name === name);
+                if (tag)
+                    this.color = tag.color;
+                this.deduplicate();
+            }
+        });
+        Object.defineProperty(this, "onChange", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (name) => {
+                this.name = name.trim();
+                const tag = this.list.find((tag) => tag.name === name);
+                if (tag)
+                    this.color = tag.color;
+                this.deduplicate();
+            }
+        });
+        Object.defineProperty(this, "onSearch", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (value) => {
+                if (!value)
+                    return;
+                if (this.timer)
+                    clearTimeout(this.timer);
+                this.name = value.trim();
+                this.timer = setTimeout(() => {
+                    this.loadData();
+                    this.timer = undefined;
+                }, 300);
+            }
+        });
+        Object.defineProperty(this, "onVisibleChange", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: (visible) => {
+                this.visible = !!visible;
+                this.init();
+            }
+        });
+        Object.defineProperty(this, "onOk", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: async () => {
+                if (!this.addTags.length)
+                    return;
+                const AddTags = this.addTags.map(({ name, color }) => color ? { Name: name, Color: color } : { Name: name });
+                this.saveLoading = true;
+                const result = await this.documentStore.editTags(this.id, {
+                    data: { AddTags },
+                    error: "message",
+                });
+                this.items.overwrite(this.id, result);
+                runInAction(() => (this.saveLoading = false));
+                runInAction(() => (this.visible = false));
+                // const tags = state.addTags.map(name => ({ name, color: state.color }));
+                // runInAction(() => (this.tags = [...this.tags, ...this.addTags]));
+            }
+        });
+        makeObservable(this);
+    }
+    get show() {
+        return !this.tags.length || this.visible;
+    }
+    /** Name of 当前可更改Tag */
+    get editTagName() {
+        return this.info ? this.info.name : "";
+    }
+    onRemove(e, tagName) {
+        e.preventDefault();
+        this.addTags = this.addTags.filter(({ name }) => tagName !== name);
+        if (this.editTagName === tagName)
+            this.info = {};
+    }
+    async onClose(removedTag) {
+        this.tags = this.tags.filter(({ name }) => name !== removedTag);
+        const result = await this.documentStore.editTags(this.id, {
+            data: { RemoveTags: [removedTag] },
+            error: "message",
+        });
+        this.items.overwrite(this.id, result);
+    }
+    deduplicate() {
+        if (this.name &&
+            !this.addTags.some((item) => item.name === this.name && item.color === this.color)
+        //  && !state.tags.some(tag => tag.name === state.name)
+        ) {
+            this.addTags = [
+                ...this.addTags,
+                { name: this.name, color: this.color === "grey" ? "" : this.color },
+            ];
+            this.reset();
+        }
+    }
+    async loadData() {
+        try {
+            this.loading = true;
+            await this.documentStore.loadTags(this.name || "").then((res) => {
+                runInAction(() => (this.list = res));
+                runInAction(() => (this.loading = false));
+            });
+        }
+        catch (error) {
+            runInAction(() => (this.loading = false));
+        }
+    }
+    selectColor(value) {
+        this.color = value;
+        if (this.info)
+            this.info.color = value;
+        this.deduplicate();
+    }
+    init() {
+        this.addTags = [];
+        this.reset();
+    }
+    reset() {
+        this.name = "";
+        this.color = "geekblue";
+        this.info = {};
+    }
+}
+__decorate([
+    observable
+], State.prototype, "id", void 0);
+__decorate([
+    observable
+], State.prototype, "tags", void 0);
+__decorate([
+    observable
+], State.prototype, "addTags", void 0);
+__decorate([
+    observable
+], State.prototype, "list", void 0);
+__decorate([
+    observable
+], State.prototype, "name", void 0);
+__decorate([
+    observable
+], State.prototype, "color", void 0);
+__decorate([
+    observable
+], State.prototype, "saveLoading", void 0);
+__decorate([
+    observable
+], State.prototype, "loading", void 0);
+__decorate([
+    observable
+], State.prototype, "visible", void 0);
+__decorate([
+    observable
+], State.prototype, "info", void 0);
+__decorate([
+    computed
+], State.prototype, "show", null);
+__decorate([
+    computed
+], State.prototype, "editTagName", null);
+__decorate([
+    action
+], State.prototype, "onRemove", null);
+__decorate([
+    action
+    // delete tag
+], State.prototype, "onClose", null);
+__decorate([
+    action
+    // Enter to 待选列表
+], State.prototype, "onkeydown", void 0);
+__decorate([
+    action
+    // select to 待选列表
+], State.prototype, "onChange", void 0);
+__decorate([
+    action
+    // Deduplicate
+], State.prototype, "deduplicate", null);
+__decorate([
+    action
+    // load tags by keyword
+], State.prototype, "onSearch", void 0);
+__decorate([
+    action
+    // tags load
+], State.prototype, "loadData", null);
+__decorate([
+    action
+    // show or hide AddTagDialog
+], State.prototype, "onVisibleChange", void 0);
+__decorate([
+    action
+    // submit tags
+], State.prototype, "onOk", void 0);
+__decorate([
+    action
+], State.prototype, "selectColor", null);
+__decorate([
+    action
+    /** 初始化tag */
+], State.prototype, "init", null);
+__decorate([
+    action
+], State.prototype, "reset", null);
 //# sourceMappingURL=state.js.map