@jx3box/jx3box-editor 2.2.48 → 3.0.0

package/src/ItemSimple.vue

@@ -8,51 +8,41 @@
         trigger="hover"
         transition="none"
         :close-delay="0"
-        v-model="visible"
+        v-model:visible="visible"
         @show="item_id = item.id"
     >
-        <div
-            class="m-simple-item"
-            slot="reference"
-            @mousedown="visible = false"
-            :class="{ onlyIcon: onlyIcon, withName: withName }"
-        >
-            <div class="m-icon">
-                <div
-                    class="u-border"
-                    :style="{
-                        backgroundImage: item_border(item),
-                        opacity: item.Quality == 5 ? 0.9 : 1,
-                    }"
-                ></div>
-                <div
-                    class="u-border-quest"
-                    :style="{ backgroundImage: item_border_quest(item) }"
-                ></div>
-                <img
-                    class="u-icon"
-                    :src="icon_url(item.IconID)"
-                    :alt="`IconID:${item.IconID}`"
-                    :style="{ width: iconSize, height: iconSize }"
-                />
+        <template #reference>
+            <div class="m-simple-item" @mousedown="visible = false" :class="{ onlyIcon: onlyIcon, withName: withName }">
+                <div class="m-icon">
+                    <div
+                        class="u-border"
+                        :style="{
+                            backgroundImage: item_border(item),
+                            opacity: item.Quality == 5 ? 0.9 : 1,
+                        }"
+                    ></div>
+                    <div class="u-border-quest" :style="{ backgroundImage: item_border_quest(item) }"></div>
+                    <img
+                        class="u-icon"
+                        :src="icon_url(item.IconID)"
+                        :alt="`IconID:${item.IconID}`"
+                        :style="{ width: iconSize, height: iconSize }"
+                    />
+                </div>
+                <span class="u-name" :style="{ color: item_color(item.Quality) }" v-text="item.Name"></span>
+                <span class="u-uiid fr" v-text="`ID: ${item.id}`"></span>
             </div>
-            <span
-                class="u-name"
-                :style="{ color: item_color(item.Quality) }"
-                v-text="item.Name"
-            ></span>
-            <span class="u-uiid fr" v-text="`ID: ${item.id}`"></span>
-        </div>
+        </template>
         <jx3-item :item_id="item_id" :jx3-client-type="jx3ClientType" />
     </el-popover>
 </template>
 
 <script>
 import Item from "./Item";
-import icon_url from "../assets/js/item/icon_url.js";
-import item_color from "../assets/js/item/color.js";
-import item_border from "../assets/js/item/border.js";
-import item_border_quest from "../assets/js/item/border_quest.js";
+import icon_url from "./assets/js/item/icon_url.js";
+import item_color from "./assets/js/item/color.js";
+import item_border from "./assets/js/item/border.js";
+import item_border_quest from "./assets/js/item/border_quest.js";
 
 export default {
     name: "ItemSimple",
@@ -114,5 +104,5 @@ export default {
 }
 </style>
 <style lang="less">
-@import "../assets/css/module/item_simple.less";
+@import "./assets/css/module/item_simple.less";
 </style>