@jx3box/jx3box-editor 2.2.47 → 3.0.0

package/src/Buff.vue

@@ -9,7 +9,7 @@
                 <span class="w-buff-name">{{ data.Name }}</span>
                 <span class="w-buff-desc">{{ data.Desc }}</span>
                 <span class="w-buff-type" v-if="data.DetachType"
-                    >※ {{ data.DetachType | showDetachType }}</span
+                    >※ {{ showDetachType(data.DetachType) }}</span
                 >
                 <span class="w-buff-meta">ID : {{ data.BuffID }}</span>
                 <span class="w-buff-meta">Level : {{ data.Level }}</span>
@@ -20,12 +20,25 @@
 </template>
 
 <script>
-import { getBuff } from "../service/database.js";
+import { getBuff } from "./service/database.js";
 import { iconLink } from "@jx3box/jx3box-common/js/utils";
-import detach_types from "../assets/data/detach_type.json";
+import detach_types from "./assets/data/detach_type.json";
 export default {
     name: "Buff",
-    props: ["client", "id", "level"],
+    props: {
+        client: {
+            type: String,
+            default: "std",
+        },
+        id: {
+            type: [String, Number],
+            default: "",
+        },
+        level: {
+            type: [String, Number],
+            default: "",
+        },
+    },
     data: () => ({
         data: null,
     }),
@@ -71,8 +84,6 @@ export default {
         iconLink: function (id) {
             return iconLink(id, this.client);
         },
-    },
-    filters: {
         showDetachType: function (val) {
             if (val && detach_types[val]) {
                 return detach_types[val];
@@ -85,5 +96,5 @@ export default {
 </script>
 
 <style lang="less">
-@import "../assets/css/module/buff.less";
+@import "./assets/css/module/buff.less";
 </style>

package/src/GameText.vue

@@ -10,13 +10,10 @@
 </template>
 
 <script>
-import {
-    extractTextContent,
-    getLink,
-    iconLink,
-} from "@jx3box/jx3box-common/js/utils";
-import { getResource as getResourceFromNode } from "../service/resource";
+import { extractTextContent, getLink, iconLink } from "@jx3box/jx3box-common/js/utils";
+import { getResource as getResourceFromNode } from "./service/resource";
 import { escape } from "lodash";
+import gameFonts from "./assets/data/game_font.json";
 
 export default {
     name: "GameText",
@@ -37,6 +34,7 @@ export default {
     data: function () {
         return {
             html: "",
+            renderVersion: 0,
         };
     },
     methods: {
@@ -50,23 +48,19 @@ export default {
             let style = ``;
             let link = null;
             content = content.replace(/\\n/g, "<br />").replace(/\\/g, "");
-            if ([item.r, item.g, item.b].every(v => v != undefined && v > 0)) {
+            if ([item.r, item.g, item.b].every((v) => v != undefined && v > 0)) {
                 style = `color: rgb(${item.r}, ${item.g}, ${item.b});`;
             } else if (item.font != undefined && item.font != 100) {
-                const fonts = require("../assets/data/game_font.json");
-                for (let color in fonts) {
-                    if (fonts[color].includes(item.font)) {
+                for (let color in gameFonts) {
+                    if (gameFonts[color].includes(item.font)) {
                         style = `color: ${color};`;
                         break;
                     }
                 }
             }
             if (item.name == "iteminfolink" && item.script) {
-                let item_type = item.script?.match(
-                    /this\.dwTabType=(\d+)/i
-                )?.[1];
-                let item_index =
-                    item.script?.match(/this\.dwIndex=(\d+)/i)?.[1];
+                let item_type = item.script?.match(/this\.dwTabType=(\d+)/i)?.[1];
+                let item_index = item.script?.match(/this\.dwIndex=(\d+)/i)?.[1];
                 if (item_type && item_index) {
                     let item_id = `${item_type}_${item_index}`;
                     link = getLink("item", item_id);
@@ -105,8 +99,8 @@ export default {
         renderTextHtml: function (Text) {
             let result = Text;
             result = this.renderImageHtml(result);
-            const matches = Text.match(/<Text>(.*?)<\/text>/gims);
-            if (!matches) return Text;
+            const matches = result.match(/<Text>(.*?)<\/text>/gims);
+            if (!matches) return result;
             for (let match of matches) {
                 let text = extractTextContent(match);
                 let html = this.renderItemHtml(text[0]);
@@ -117,29 +111,28 @@ export default {
         /**
          * 获取形如<BUFF 110 1 desc>, <ENCHANT 100>的资源字段并转换
          */
-        renderBuffResource: async function () {
+        renderBuffResource: async function (version) {
             const matches = this.html?.match(/<BUFF (\d+) (\d+) (.*?)>/gim);
             if (!matches) return;
             let resourceKeys = [];
             let replaceMap = {};
             //先统计需要的资源，减少请求数量
             for (let match of matches) {
-                let [token, id, level, type] = match.match(
-                    /<BUFF (\d+) (\d+) (.*?)>/i
-                );
+                let [token, id, level, type] = match.match(/<BUFF (\d+) (\d+) (.*?)>/i);
                 resourceKeys.push(`${id}_${level}`);
                 if (level != 0) resourceKeys.push(`${id}_0`);
                 replaceMap[token] = [id, level, type];
             }
             await this.getAllResources("buff", resourceKeys, this.client);
+            if (version !== this.renderVersion) return;
             for (let replace in replaceMap) {
                 let [id, level, type] = replaceMap[replace];
                 // 持续时间
                 if (type === "time") {
                     let interval;
                     let buff = this.getResource("buff", id, level);
-                    if (buff["Interval"]) interval = buff["Interval"];
-                    else interval = this.getResource("buff", id, 0)["Interval"];
+                    if (buff?.Interval) interval = buff.Interval;
+                    else interval = this.getResource("buff", id, 0)?.Interval;
                     if (!interval) {
                         console.log(replace, escape(replace));
                         this.html = this.html.replace(replace, escape(replace));
@@ -157,8 +150,8 @@ export default {
                 // buff描述
                 if (type === "desc") {
                     let buff = this.getResource("buff", id, level);
-                    let desc = buff["Desc"];
-                    if (!desc) desc = this.getResource("buff", id, 0)["Desc"];
+                    let desc = buff?.Desc;
+                    if (!desc) desc = this.getResource("buff", id, 0)?.Desc;
                     if (!desc) {
                         this.html = this.html.replace(replace, escape(replace));
                         continue;
@@ -170,10 +163,7 @@ export default {
                             let [_, _attr] = _m.match(/<BUFF ([0-9a-zA-Z]+)>/i);
                             for (let i = 1; i < 15; i++) {
                                 if (buff[`BeginAttrib${i}`] == _attr) {
-                                    desc = desc.replace(
-                                        _m,
-                                        buff[`BeginValue${i}A`]
-                                    );
+                                    desc = desc.replace(_m, buff[`BeginValue${i}A`]);
                                 }
                             }
                         }
@@ -182,7 +172,7 @@ export default {
                 }
             }
         },
-        renderEnchantResource: async function () {
+        renderEnchantResource: async function (version) {
             const matches = this.html.match(/<ENCHANT (\d+)>/gim);
             if (!matches) return;
             let resourceKeys = [];
@@ -193,6 +183,7 @@ export default {
                 replaceMap[match] = enchant_id;
             }
             await this.getAllResources("enchant", resourceKeys, this.client);
+            if (version !== this.renderVersion) return;
             for (let replace in replaceMap) {
                 try {
                     let enchant_id = replaceMap[replace];
@@ -207,9 +198,9 @@ export default {
                 }
             }
         },
-        renderResource: function () {
-            this.renderBuffResource();
-            this.renderEnchantResource();
+        renderResource: async function () {
+            const version = this.renderVersion;
+            await Promise.all([this.renderBuffResource(version), this.renderEnchantResource(version)]);
         },
         getAllResources: async function (type, ids) {
             let resources = await getResourceFromNode(type, ids, this.client);
@@ -218,18 +209,12 @@ export default {
             if (type == "buff") {
                 for (let item of data) {
                     let buff_token = `${item.BuffID}_${item.Level}`;
-                    sessionStorage.setItem(
-                        `buff-${this.client}-${buff_token}`,
-                        JSON.stringify(item)
-                    );
+                    sessionStorage.setItem(`buff-${this.client}-${buff_token}`, JSON.stringify(item));
                 }
             } else if (type == "enchant") {
                 for (let item of data) {
                     let enchant_token = `${item.ID}`;
-                    sessionStorage.setItem(
-                        `enchant-${this.client}-${enchant_token}`,
-                        JSON.stringify(item)
-                    );
+                    sessionStorage.setItem(`enchant-${this.client}-${enchant_token}`, JSON.stringify(item));
                 }
             }
         },
@@ -238,9 +223,7 @@ export default {
             if (type == "buff") {
                 token = `${id}_${level}`;
             }
-            let resource = sessionStorage.getItem(
-                `${type}-${this.client}-${token}`
-            );
+            let resource = sessionStorage.getItem(`${type}-${this.client}-${token}`);
             if (resource) return JSON.parse(resource);
             return null;
         },
@@ -249,7 +232,11 @@ export default {
         text: {
             immediate: true,
             handler: function (val) {
-                if (!val) return;
+                this.renderVersion += 1;
+                if (!val) {
+                    this.html = "";
+                    return;
+                }
                 this.html = this.renderTextHtml(val);
                 this.renderResource();
             },