@jx3box/jx3box-editor 1.0.8 → 1.1.2

package/src/Npc.vue

@@ -0,0 +1,214 @@
+<template>
+    <div class="w-npc" v-if="data">
+        <div class="w-npc-wrapper">
+            <div class="w-npc-content">
+                <div class="u-npc">
+                    <div class="u-title">
+                        <span class="u-name">{{ data.Name }}</span>
+                        <span class="u-name-add">
+                            <span v-if="data.Title || data.Level">&lt;</span>
+                            <span class="u-nick" v-if="data.Title">
+                                {{ data.Title }}
+                            </span>
+                            <span v-if="data.Title && data.Level">·</span>
+                            <b class="u-level" v-if="data.Level">{{ data.Level }}</b>
+                            <span v-if="data.Title || data.Level">&gt;</span>
+                        </span>
+                        <div class="u-base">
+                            <span class="u-atmap" v-if="data.MapName">
+                                {{ data.MapName }}
+                            </span>
+                            <span class="u-intensity" v-if="data.Intensity">
+                                强度
+                                {{ data.Intensity }}
+                            </span>
+                        </div>
+                    </div>
+                    <div class="u-primary">
+                        <div class="u-life">
+                            <img class="u-descicon u-descicon-life" svg-inline src="../assets/img/npc/energy.svg" />
+                            <b>血量</b>
+                            <em>MaxLife</em>
+                            <strong>{{ data.MaxLife }}</strong>
+                        </div>
+                        <div class="u-mana">
+                            <img class="u-descicon u-descicon-mana" svg-inline src="../assets/img/npc/energy.svg" />
+                            <b>内力</b>
+                            <em>MaxMana</em>
+                            <strong>{{ data.MaxMana }}</strong>
+                        </div>
+                        <div class="u-touch" v-if="data.TouchRange">
+                            <img class="u-descicon u-descicon-touch" svg-inline src="../assets/img/npc/radar.svg" />
+                            <b>范围</b>
+                            <em>TouchRange</em>
+                            <strong>{{ data.TouchRange }}</strong>
+                        </div>
+                        <div class="u-sense" v-if="data.Sense">
+                            <img class="u-descicon u-descicon-sense" svg-inline src="../assets/img/npc/sight.svg" />
+                            <b>识破</b>
+                            <em>Sense</em>
+                            <strong>{{ data.Sense }}</strong>
+                        </div>
+                        <div class="u-dodge" v-if="data.Dodge">
+                            <img class="u-descicon u-descicon-dodge" svg-inline src="../assets/img/npc/miss.svg" />
+                            <b>闪避</b>
+                            <em>Dodge</em>
+                            <strong>{{ data.Dodge }}</strong>
+                        </div>
+                        <div class="u-dodge" v-if="data.Parry">
+                            <img class="u-descicon u-descicon-dodge" svg-inline src="../assets/img/npc/miss.svg" />
+                            <b>招架</b>
+                            <em>Parry</em>
+                            <strong>{{ data.ParryValue }}</strong>
+                        </div>
+                        <div class="u-shield">
+                            <img class="u-descicon u-descicon-shield" svg-inline src="../assets/img/npc/shield.svg" />
+                            <b>防御</b>
+                            <em>Shield</em>
+                            <span class="u-sitem">
+                                外功防御
+                                <em>PhysicsShieldBase</em>
+                                <span class="u-value">{{ ~~data.PhysicsShieldBase }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                混元防御
+                                <em>NeutralMagicDefence</em>
+                                <span class="u-value">{{ ~~data.NeutralMagicDefence }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                阳性防御
+                                <em>SolarMagicDefence</em>
+                                <span class="u-value">{{ ~~data.SolarMagicDefence }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                阴性防御
+                                <em>LunarMagicDefence</em>
+                                <span class="u-value">{{ ~~data.LunarMagicDefence }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                毒性防御
+                                <em>PoisonMagicDefence</em>
+                                <span class="u-value">{{ ~~data.PoisonMagicDefence }}</span>
+                            </span>
+                        </div>
+                        <div class="u-critical">
+                            <img class="u-descicon u-descicon-attack" svg-inline src="../assets/img/npc/attack.svg" />
+                            <b>会心</b>
+                            <em>Critical</em>
+                            <span class="u-sitem">
+                                外功会心
+                                <em>PhysicsCriticalStrike</em>
+                                <span class="u-value">{{ ~~data.PhysicsCriticalStrike }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                混元会心
+                                <em>NeutralCriticalStrike</em>
+                                <span class="u-value">{{ ~~data.NeutralCriticalStrike }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                阳性会心
+                                <em>SolarCriticalStrike</em>
+                                <span class="u-value">{{ ~~data.SolarCriticalStrike }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                阴性会心
+                                <em>LunarCriticalStrike</em>
+                                <span class="u-value">{{ ~~data.LunarCriticalStrike }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                毒性会心
+                                <em>PoisonCriticalStrike</em>
+                                <span class="u-value">{{ ~~data.PoisonCriticalStrike }}</span>
+                            </span>
+                        </div>
+                        <div class="u-attack">
+                            <img class="u-descicon u-descicon-attack" svg-inline src="../assets/img/npc/target.svg" />
+                            <b>命中</b>
+                            <em>Attack</em>
+                            <span class="u-sitem">
+                                外功命中
+                                <em>PhysicsAttackHit</em>
+                                <span class="u-value">{{ ~~data.PhysicsAttackHit }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                混元命中
+                                <em>NeutralMagicHit</em>
+                                <span class="u-value">{{ ~~data.NeutralMagicHit }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                阳性命中
+                                <em>SolarMagicHit</em>
+                                <span class="u-value">{{ ~~data.SolarMagicHit }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                阴性命中
+                                <em>LunarMagicHit</em>
+                                <span class="u-value">{{ ~~data.LunarMagicHit }}</span>
+                            </span>
+                            <span class="u-sitem">
+                                毒性命中
+                                <em>PoisonMagicHit</em>
+                                <span class="u-value">{{ ~~data.PoisonMagicHit }}</span>
+                            </span>
+                        </div>
+                    </div>
+                    <div class="u-id">
+                        ID : {{id}}
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { getNpc } from "../service/database.js";
+import { iconLink } from "@jx3box/jx3box-common/js/utils";
+export default {
+    name: "Npc",
+    props: ["client", "id"],
+    data: () => ({
+        data: null,
+    }),
+    computed: {
+        params: function() {
+            return [this.client, this.id];
+        },
+    },
+    watch: {
+        params: {
+            immediate: true,
+            deep: true,
+            handler(val) {
+                if (val) {
+                    let [client, id] = val;
+                    // 读取本地数据
+                    const cache = sessionStorage.getItem(`npc-${client}-${id}`);
+                    if (cache) {
+                        this.data = JSON.parse(cache);
+                        // 没有缓存则发起请求获取数据
+                    } else {
+                        id &&
+                            getNpc(...this.params).then((res) => {
+                                let data = res.data?.list?.[0];
+                                this.data = data;
+
+                                // 将数据放入 sessionStorage
+                                sessionStorage.setItem(`npc-${client}-${id}`, JSON.stringify(data));
+                            });
+                    }
+                }
+            },
+        },
+    },
+    methods: {
+        iconLink: function(id) {
+            return iconLink(id, this.client);
+        },
+    },
+};
+</script>
+
+<style scoped lang="less">
+@import "../assets/css/module/npc.less";
+</style>

package/src/Resource.vue

@@ -109,6 +109,35 @@
                         </ul>
                         <el-alert v-if="!item.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
                     </el-tab-pane>
+                    <el-tab-pane label="Npc" name="npc">
+                        <span slot="label">
+                            <img class="u-icon" svg-inline src="../assets/img/npc/skull.svg" />
+                            <b>Npc</b>
+                            <em class="u-count">{{ stat.npc }}</em>
+                        </span>
+                        <p v-if="npc.length && done" class="m-resource-count">
+                            <i class="el-icon-s-data"></i> 共找到 <b>{{ npc.length }}</b> 条记录
+                        </p>
+                        <ul class="m-resource-list" v-if="npc.length">
+                            <li v-for="(o, i) in npc" :key="i" class="u-item" :class="{ on: o.isSelected }" @click="selectNpc(o, i)" ref="item">
+                                <span class="u-id">ID:{{ o.ID }}</span>
+                                <img class="u-pic" :title="'IconID:' + o.IconID" :src="iconURL(o.IconID)" />
+                                <span class="u-name">
+                                    {{ o.Name }}
+                                    <em v-if="o.Level">(等级：{{ o.Level }})</em>
+                                </span>
+                                <span class="u-content">
+                                    <span class="u-map">地图：{{ o.MapName }}</span>
+                                    <span class="u-life">血量：{{ o.MaxLife }}</span>
+                                    <span class="u-mana">内力：{{ o.MaxMana }}</span>
+                                </span>
+                                <span class="u-remark">
+                                    {{ o.Requirement }}
+                                </span>
+                            </li>
+                        </ul>
+                        <el-alert v-if="!npc.length && done" title="没有找到相关条目" type="info" show-icon></el-alert>
+                    </el-tab-pane>
                     <el-tab-pane label="图标" name="icon">
                         <span slot="label">
                             <img class="u-icon" svg-inline src="../assets/img/icons.svg" />
@@ -192,6 +221,7 @@ export default {
             buff: [],
             item: [],
             icon: [],
+            npc: [],
 
             stat: {
                 skill: 0,
@@ -370,6 +400,11 @@ export default {
             o.isSelected = true;
             this.html = `<img class="e-jx3-icon" src="${__iconPath}${this.iconDir}/${o.iconID}.png" alt="${o.iconID}"/>`;
         },
+        selectNpc: function (o, i){
+            this.resetItems()
+            o.isSelected = true
+            this.html = `<a data-type="npc" class="e-jx3-npc w-jx3-element" data-mode="" data-id="${o.ID}"  data-client="${this.client}" target="_blank" href="${this.getLink("npc", this.client, o.ID, '')}">[${o.Name}]</a>`
+        },
         resetItems: function() {
             let data = this[this.type];
             data.forEach((item) => {

package/src/components/markdown/katex.vue

@@ -0,0 +1,58 @@
+<template>
+    <div class="c-editor-markdown-dialog">
+        <span class="c-markdown-toolbar-file c-markdown-toolbar-item u-katex" @click="handleClick" title="插入Latex">
+            Σ
+        </span>
+
+        <el-dialog :visible.sync="visible" title="插入数学公式" :modal-append-to-body="false">
+            <a class="u-help" href="/tool/16295" target="_blank">💙 查看帮助文档</a>
+
+            <el-input class="u-input u-input-katex" type="textarea" :rows="5" v-model="katex"></el-input>
+
+            <div slot="footer">
+                <el-button @click="cancel">取消</el-button>
+                <el-button type="primary" @click="insert">插入</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "markdown_katex",
+    data() {
+        return {
+            visible: false,
+            katex: "",
+        };
+    },
+    methods: {
+        handleClick() {
+            this.visible = true;
+        },
+        cancel() {
+            this.visible = false;
+            this.katex = "";
+        },
+        insert() {
+            const content = `<pre class="e-latex-area w-latex">${this.katex}</pre>`;
+
+            this.$emit("insert", content);
+
+            this.katex = "";
+
+            this.visible = false;
+        },
+    },
+};
+</script>
+
+<style lang="less">
+.c-markdown-toolbar-item.u-katex {
+    display: inline-flex;
+    justify-content: center;
+    align-content: center;
+    width: 26px;
+    height: 26px;
+}
+</style>

package/src/components/markdown/macro.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="c-editor-markdown-dialog c-editor-markdown-macro">
+    <div class="c-editor-markdown-dialog">
         <span class="c-markdown-toolbar-file c-markdown-toolbar-item" @click="handleClick" title="插入宏">宏</span>
 
         <el-dialog :visible.sync="visible" title="插入宏" :modal-append-to-body="false">
@@ -35,12 +35,10 @@ export default {
 
             this.$emit('insert', content)
 
+            this.macro = ''
+
             this.visible = false
         }
     }
 }
 </script>
-
-<style lang="less">
-@import '../../../assets/css/markdown/common.less';
-</style>

package/src/components/markdown/pz.vue

@@ -1,12 +1,12 @@
 <template>
-    <div class="m-macro-dialog m-pz-dialog">
+    <div class="c-editor-markdown-dialog ">
         <span class="c-markdown-toolbar-file c-markdown-toolbar-item" @click="handleClick" title="插入配装方案">装</span>
 
         <el-dialog :visible.sync="visible" title="配装方案" :modal-append-to-body="false">
 
             <p>👘 请填入魔盒配装方案的<a target="_blank" href="/tool/32032">【嵌入版】</a>编码</p>
 
-            <el-input class="m-macro-input" type="textarea" :rows="4" v-model="pzCode"></el-input>
+            <el-input class="u-input" type="textarea" :rows="4" v-model="pzCode"></el-input>
 
             <div slot="footer">
                 <el-button @click="cancel">取消</el-button>
@@ -38,12 +38,10 @@ export default {
 
             this.$emit('insert', content)
 
+            this.pz = ''
+
             this.visible = false
         }
     }
 }
 </script>
-
-<style lang="less">
-@import '../../../assets/css/markdown/common.less';
-</style>

package/src/components/markdown/talent.vue

@@ -0,0 +1,49 @@
+<template>
+    <div class="c-editor-markdown-dialog">
+        <span class="c-markdown-toolbar-file c-markdown-toolbar-item" @click="handleClick" title="插入奇穴方案">
+            奇
+        </span>
+
+        <el-dialog :visible.sync="visible" title="插入奇穴方案" :modal-append-to-body="false">
+            <p>💙 请填入<a target="_blank" href="/app/talent">奇穴模拟器</a>生成的编码</p>
+
+            <el-input class="u-input u-input-macro" type="textarea" :rows="5" v-model="talent"></el-input>
+
+            <div slot="footer">
+                <el-button @click="cancel">取消</el-button>
+                <el-button type="primary" @click="insert">插入</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "markdown_talent",
+    data() {
+        return {
+            visible: false,
+            talent: "",
+        };
+    },
+    methods: {
+        handleClick() {
+            this.visible = true;
+        },
+        cancel() {
+            this.visible = false;
+            this.talent = "";
+        },
+        insert() {
+            const content = `<pre class="e-jx3qixue-area">${this.talent}</pre>`;
+
+            this.$emit("insert", content);
+
+            this.talent = "";
+
+            this.visible = false;
+        },
+    },
+};
+</script>
+

package/src/components/markdown/talent2.vue

@@ -0,0 +1,48 @@
+<template>
+    <div class="c-editor-markdown-dialog">
+        <span class="c-markdown-toolbar-file c-markdown-toolbar-item" @click="handleClick" title="插入镇派方案">
+            镇
+        </span>
+
+        <el-dialog :visible.sync="visible" title="插入镇派方案" :modal-append-to-body="false">
+            <p>💙 请填入<a target="_blank" href="/app/talent2">镇派模拟器</a>生成的编码</p>
+
+            <el-input class="u-input u-input-macro" type="textarea" :rows="5" v-model="talent"></el-input>
+
+            <div slot="footer">
+                <el-button @click="cancel">取消</el-button>
+                <el-button type="primary" @click="insert">插入</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "markdown_talent2",
+    data() {
+        return {
+            visible: false,
+            talent: "",
+        };
+    },
+    methods: {
+        handleClick() {
+            this.visible = true;
+        },
+        cancel() {
+            this.visible = false;
+            this.talent = "";
+        },
+        insert() {
+            const content = `<pre class="e-jx3talent2-area">${this.talent}</pre>`;
+
+            this.$emit("insert", content);
+
+            this.talent = "";
+
+            this.visible = false;
+        },
+    },
+};
+</script>

package/src/components/markdown/video.vue

@@ -0,0 +1,49 @@
+<template>
+    <div class="c-editor-markdown-dialog">
+        <span class="c-markdown-toolbar-video c-markdown-toolbar-item" @click="handleClick" title="插入视频">
+            <i class="el-icon-video-camera"></i>
+        </span>
+
+        <el-dialog :visible.sync="visible" title="插入视频" :modal-append-to-body="false">
+            <a class="u-help" href="/tool/686/" target="_blank">💙 点击查看如何获取视频地址</a>
+
+            <el-input class="u-input" type="textarea" :rows="4" v-model="videoUrl"></el-input>
+
+            <div slot="footer">
+                <el-button @click="cancel">取消</el-button>
+                <el-button type="primary" @click="insert">插入</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+    name: "markdown_video",
+    data() {
+        return {
+            visible: false,
+            videoUrl: "",
+        };
+    },
+    methods: {
+        handleClick() {
+            this.visible = true;
+        },
+        cancel() {
+            this.visible = false;
+            this.videoUrl = "";
+        },
+        insert() {
+            const content = `<div class="c-article-videox">${this.videoUrl}</div>`;
+
+            this.$emit("insert", content);
+
+            this.videoUrl = "";
+
+            this.visible = false;
+        },
+    },
+};
+</script>
+

package/assets/css/markdown/common.less

@@ -1,13 +0,0 @@
-.c-editor-markdown-macro {
-    display: inline-block;
-
-    .u-input {
-        .el-textarea__inner {
-
-            font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
-        }
-    }
-    .el-dialog__body {
-        padding-top: 0;
-    }
-}