@jx3box/jx3box-vue3-ui 0.3.8 → 0.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jx3box/jx3box-vue3-ui",
-    "version": "0.3.8",
+    "version": "0.4.0",
     "description": "JX3BOX Vue3 UI",
     "main": "index.js",
     "scripts": {

package/public/tinymce.html

@@ -7,7 +7,7 @@
         <meta name="renderer" content="webkit" />
         <title><%= htmlWebpackPlugin.options.title %></title>
         <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
-        <script src="https://cdn.deepberry.cn/static/tinymce/tinymce.min.js?v=0.1.0"></script>
+        <script src="https://cdn.jx3box.com/static/tinymce/tinymce.min.js?v=1.8.8"></script>
         <!-- TODO: -->
         <!-- <script src="http://localhost:3000/tinymce.min.js"></script> -->
     </head>

package/service/database.js

@@ -1,5 +1,5 @@
 import axios from "axios";
-import { __node, __helperUrl } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __node, __helperUrl } = require("@jx3box/jx3box-common/data/jx3box.json");
 import { $node } from "@jx3box/jx3box-common/js/https_v2";
 
 function loadResource(type, query, params) {

package/src/editor/BoxResource.vue

@@ -155,7 +155,7 @@
 import { loadStat } from "../../service/database";
 import { loadAuthors, loadEmotions } from "../../service/cms";
 import { getUserInfo } from "../../service/author";
-import { __Root, __OriginRoot, __imgPath } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __Root, __OriginRoot, __imgPath } = require("@jx3box/jx3box-common/data/jx3box.json");
 import { getLink, showAvatar, resolveImagePath } from "@jx3box/jx3box-common/js/utils";
 import User from "@jx3box/jx3box-common/js/user";
 

package/src/editor/Resource.vue

@@ -282,7 +282,7 @@
 <script>
 import { loadResource, loadStat, getIcons } from "../../service/database";
 import { loadEmotions } from "../../service/cms";
-import { __iconPath, __Root, __OriginRoot } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __iconPath, __Root, __OriginRoot } = require("@jx3box/jx3box-common/data/jx3box.json");
 import detach_types from "../../assets/data/detach_type.json";
 import { iconLink, getLink, showAvatar } from "@jx3box/jx3box-common/js/utils";
 import GameText from "./components/GameText.vue";

package/src/editor/Tinymce.vue

@@ -33,8 +33,7 @@ import Editor from "@tinymce/tinymce-vue";
 import Upload from "./Upload";
 import Resource from "./Resource";
 import BoxResource from "./BoxResource";
-import { __cms } from "@jx3box/jx3box-common/data/jx3box.json";
-import { __imgPath } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __cms, __imgPath } = require("@jx3box/jx3box-common/data/jx3box.json");
 import Emotion from "@jx3box/jx3box-emotion/src/Emotion2.vue"
 import hljs_languages from "../../assets/js/item/hljs_languages.js"
 const API_Root = process.env.NODE_ENV === "production" ? __cms : "/";

package/src/editor/UploadAlum.vue

@@ -2,8 +2,8 @@
     <div class="c-upload-album">
         <Upload @insert="updateFileList" text="批量上传图片" />
         <div class="c-upload-album-list">
-            <div class="m-album" id="uploadAlbum" v-if="imgList && imgList.length">
-                <div class="u-album-item" v-for="(item, i) in imgList" :key="timeStamp + i">
+            <div class="m-album" id="uploadAlbum" v-if="imgList && imgList.length" :key="timeStamp">
+                <div class="u-album-item" v-for="(item, i) in imgList" :key="i">
                     <img class="u-pic" :src="item.url ? item.url : item" />
                     <i class="u-mask"></i>
                     <el-icon class="u-op u-preview" @click="previewHandle(item)"><ZoomIn /></el-icon>
@@ -31,8 +31,9 @@ export default {
             imgList: this.data || [],
             dialogImageUrl: "",
             dialogVisible: false,
-            timeStamp: new Date().getTime() + Math.random(),
+            timeStamp: null,
             sortable: null,
+            hasSort: false,
         };
     },
     model: {
@@ -55,10 +56,12 @@ export default {
         imgList: {
             deep: true,
             handler: function (newVal, oldVal) {
-                if (JSON.stringify(newVal) !== JSON.stringify(oldVal)) {
+                if (this.hasSort || JSON.stringify(newVal) !== JSON.stringify(oldVal)) {
+                    this.timeStamp = new Date().getTime() + Math.random();
                     this.$nextTick(() => {
                         this.sort();
                     });
+                    this.hasSort = false;
                     this.$emit("update", newVal);
                 }
             },
@@ -88,7 +91,15 @@ export default {
         },
         sort() {
             let el = document.getElementById("uploadAlbum");
-            this.sortable = Sortable.create(el);
+            this.sortable = Sortable.create(el, {
+                animation: 150,
+                onEnd: ({ newIndex, oldIndex }) => {
+                    const targetRow = this.imgList[oldIndex];
+                    this.imgList.splice(oldIndex, 1);
+                    this.imgList.splice(newIndex, 0, targetRow);
+                    this.hasSort = true;
+                },
+            });
         },
         showThumbnail(val) {
             return getThumbnail(val, 146);

package/src/editor/components/Author.vue

@@ -60,7 +60,7 @@
 import { authorLink, getLink, getThumbnail } from "@jx3box/jx3box-common/js/utils";
 import { getUserInfo, getUserMedals, getUserPublicTeams } from "../../../service/author";
 import { getDecoration, getDecorationJson } from "../../../service/cms";
-import { __imgPath, __userLevelColor } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __imgPath, __userLevelColor } = require("@jx3box/jx3box-common/data/jx3box.json");
 import User from "@jx3box/jx3box-common/js/user";
 import Avatar from "./Avatar.vue";
 import medal from "./Medal.vue";

package/src/editor/components/Avatar.vue

@@ -9,7 +9,7 @@
 </template>
 
 <script>
-import { __imgPath } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __imgPath } = require("@jx3box/jx3box-common/data/jx3box.json");
 import { showAvatar, authorLink } from "@jx3box/jx3box-common/js/utils";
 export default {
     name: "AvatarComponent",

package/src/editor/components/Equip.vue

@@ -44,7 +44,7 @@ import { authorLink } from "@jx3box/jx3box-common/js/utils";
 import QRcode from "@jx3box/jx3box-common-ui/src/interact/QRcode.vue";
 import { showTime } from "@jx3box/jx3box-common/js/moment.js";
 import { get_plan } from "../../../service/item.js";
-import { __Root } from "@jx3box/jx3box-common/data/jx3box.json";
+const { __Root } = require("@jx3box/jx3box-common/data/jx3box.json");
 export default {
     name: "EquipComponent",
     props: ["data", "id"],

package/src/header/Manage.vue

@@ -4,31 +4,25 @@
             <img class="u-add" svg-inline src="../../assets/img/header/manage.svg" />
         </span>
         <ul class="u-menu u-pop-content">
-            <li v-for="item in finalPanel" :key="item.label">
-                <a :href="item.link" target="_blank"
-                    ><el-icon>
-                        <component :is="item.icon" v-if="item.icon"></component>
-                        <Present v-else />
+            <li v-for="item in userPanel" :key="item.label">
+                <a :href="item.link" :target="item.target || '_self'">
+                    <el-icon>
+                        <Setting></Setting>
                     </el-icon>
-                    {{ item.label }}</a
-                >
-            </li>
-            <hr v-if="finalPanel.length" />
-            <li v-if="isEditor">
-                <a href="https://os.jx3box.com/admin" target="_blank"
-                    ><el-icon><MessageBox /></el-icon> 管理平台</a
-                >
-            </li>
-            <li v-if="isAdmin">
-                <a href="/admin"
-                    ><el-icon><Setting></Setting></el-icon> 站点配置</a
-                >
-            </li>
-            <li v-if="isTeamMember">
-                <a href="/dashboard/feedback?tab=pending"
-                    ><el-icon><Message /></el-icon> 反馈处理</a
-                >
+                    {{ item.label }}
+                </a>
             </li>
+            <hr v-if="userPanel.length" />
+            <template v-if="isEditor">
+                <li v-for="item in adminPanel" :key="item.label">
+                    <a :href="item.link" :target="item.target || '_self'">
+                        <el-icon>
+                            <Setting></Setting>
+                        </el-icon>
+                        {{ item.label }}
+                    </a>
+                </li>
+            </template>
         </ul>
     </div>
 </template>
@@ -37,7 +31,6 @@
 import User from "@jx3box/jx3box-common/js/user";
 import panel from "../../assets/data/panel.json";
 import { getMenu } from "../../service/header";
-import { checkTeamMember } from "../../service/cms";
 export default {
     name: "HeaderManage",
     data() {
@@ -48,20 +41,15 @@ export default {
         };
     },
     computed: {
-        finalPanel: function () {
-            // 只返回前两个
-            return this.panel
-                .filter((item) => {
-                    // 只返回有权限的
-                    if (item.onlyAdmin) {
-                        return this.isAdmin;
-                    }
-                    return true;
-                })
-                .slice(0, 2);
+        userPanel: function () {
+            return this.panel.filter((item) => {
+                return !item.onlyAdmin;
+            });
         },
-        isAdmin() {
-            return User.isAdmin();
+        adminPanel: function () {
+            return this.panel.filter((item) => {
+                return item.onlyAdmin;
+            });
         },
         isEditor() {
             return User.isEditor();
@@ -69,7 +57,6 @@ export default {
     },
     mounted() {
         this.loadPanel();
-        this.check();
     },
     methods: {
         loadPanel: function () {
@@ -88,22 +75,6 @@ export default {
                 console.log("loadPanel error", e);
             }
         },
-        check: function () {
-            try {
-                const isTeamMember = JSON.parse(localStorage.getItem("BoxTeam3"));
-
-                if (isTeamMember) {
-                    this.isTeamMember = isTeamMember === "true" || isTeamMember;
-                } else {
-                    checkTeamMember().then((res) => {
-                        this.isTeamMember = res.data.data;
-                        localStorage.setItem("BoxTeam3", this.isTeamMember);
-                    });
-                }
-            } catch (e) {
-                console.log("check error", e);
-            }
-        },
     },
 };
 </script>
@@ -112,11 +83,13 @@ export default {
 // 管理菜单
 .c-header-manage {
     height: 100%;
+
     .u-manage {
         padding: 0 10px 0 8px;
         height: 100%;
         .flex;
         align-items: center;
+
         svg {
             .size(19px);
         }