@truenewx/tnxvue3 3.0.0-alpha.28 → 3.0.0-alpha.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@truenewx/tnxvue3",
-  "version": "3.0.0-alpha.28",
+  "version": "3.0.0-alpha.30",
   "description": "互联网技术解决方案：Vue3扩展支持",
   "private": false,
   "publishConfig": {
@@ -24,7 +24,7 @@
     "vue-router": "~4.4.0"
   },
   "dependencies": {
-    "@truenewx/tnxcore": "3.0.0-alpha.16",
+    "@truenewx/tnxcore": "3.0.0-alpha.17",
     "@element-plus/icons-vue": "2.3.1",
     "async-validator": "4.2.5",
     "mitt": "3.0.1"

package/src/element-plus/button/Button.vue

@@ -1,7 +1,9 @@
 <template>
-    <el-tooltip :content="tooltipContent" :placement="tooltipPlacement" :disabled="disabled || !tooltipContent"
-        v-if="disabled === false || disabledTip !== false">
-        <el-dropdown split-button :type="type" :class="className" :disabled="disabled" :title="title" :size="size"
+    <el-tooltip
+        :content="tooltipContent"
+        :placement="tooltipPlacement"
+        :disabled="finalDisabled || !tooltipContent">
+        <el-dropdown split-button :type="type" :class="className" :disabled="finalDisabled" :title="title" :size="size"
             :style="$attrs.style" @click="clickButton" @command="clickItem" v-if="dropdownItems.length">
             <i :class="icon" style="margin-right: 0.5rem;" v-if="icon"></i>
             <template v-if="!hiddenCaption">
@@ -19,10 +21,21 @@
                 </el-dropdown-menu>
             </template>
         </el-dropdown>
-        <el-button :type="type" :class="className" :disabled="disabled" :title="title" @click="clickButton" :size="size"
-            :loading="loading" :plain="plain" :link="link" :bg="bg" :autofocus="autofocus"
+        <el-button :type="type"
+            :class="className"
+            :disabled="finalDisabled"
+            :title="title"
+            @click="clickButton"
+            :size="size"
+            :loading="loading"
+            :plain="plain"
+            :link="link"
+            :bg="bg"
+            :autofocus="autofocus"
             :round="round"
-            :circle="circle" :style="$attrs.style" v-else>
+            :circle="circle"
+            :style="$attrs.style"
+            v-else>
             <tnxel-icon :value="icon" v-if="icon"/>
             <span v-if="!hiddenCaption && ($slots.default || menuItem)">
                 <slot>{{ menuItem ? menuItem.caption : '' }}</slot>
@@ -52,7 +65,13 @@ export default {
         },
         type: String,
         icon: String,
-        size: String,
+        size: {
+            type: String,
+            validator: value => {
+                return ['small', 'default', 'large'].includes(value);
+            },
+            default: 'default',
+        },
         loading: Boolean,
         plain: Boolean,
         link: Boolean,
@@ -68,6 +87,10 @@ export default {
             type: String,
             default: 'top',
         },
+        disabled: {
+            type: Boolean,
+            default: false,
+        },
         disabledTip: {
             type: [String, Boolean],
             default: '没有操作权限',
@@ -83,7 +106,7 @@ export default {
         }
         return {
             menuItem: menuItem,
-            disabled: null,
+            finalDisabled: this.disabled,
             dropdownItems: [],
         }
     },
@@ -105,7 +128,13 @@ export default {
             return undefined;
         },
         title() {
-            return this.disabled ? this.disabledTip : this.$attrs.title;
+            if (this.finalDisabled) {
+                if (this.disabledTip === false) {
+                    return undefined;
+                }
+                return this.disabledTip;
+            }
+            return this.$attrs.title;
         }
     },
     created() {
@@ -115,6 +144,9 @@ export default {
         granted() {
             this.init();
         },
+        disabled() {
+            this.init();
+        },
         dropdown() {
             this.buildDropdownItems();
         },
@@ -122,11 +154,11 @@ export default {
     methods: {
         init() {
             if (this.granted !== null) {
-                this.disabled = !this.granted;
+                this.finalDisabled = this.disabled || !this.granted;
             } else if (this.menu && this.path) {
                 let vm = this;
                 this.menu.loadGrantedItems(function () {
-                    vm.disabled = !vm.menu.isGranted(vm.path);
+                    vm.finalDisabled = this.disabled || !vm.menu.isGranted(vm.path);
                     vm.buildDropdownItems();
                 });
             }

package/src/element-plus/edit-table/EditTable.vue

@@ -351,11 +351,20 @@ export default {
     height: 32px;
 }
 
+.tnxel-edit-table-container .el-table.padding-none .el-table__body-wrapper .el-input--small .el-input__wrapper,
+.tnxel-edit-table-container .el-table.padding-none .el-table__body-wrapper .el-input--small .el-select__wrapper {
+    height: 24px;
+}
+
 .tnxel-edit-table-container .el-table.padding-none .el-table__body-wrapper .el-textarea__wrapper {
     border-radius: 0;
     height: 40px;
 }
 
+.tnxel-edit-table-container .el-table.padding-none .el-table__body-wrapper .el-input--small .el-textarea__wrapper {
+    height: 32px;
+}
+
 .tnxel-edit-table-container .tnxel-edit-table .is-center .el-input__inner {
     text-align: center;
 }

package/src/element-plus/icon/Icon.vue

@@ -14,6 +14,7 @@
         <CircleCheckFilled v-else-if="value === 'CircleCheckFilled'"/>
         <CircleClose v-else-if="value === 'CircleClose'"/>
         <CircleCloseFilled v-else-if="value === 'CircleCloseFilled'"/>
+        <CirclePlus v-else-if="value === 'CirclePlus'"/>
         <Close v-else-if="value === 'Close'"/>
         <CloseBold v-else-if="value === 'CloseBold'"/>
         <CopyDocument v-else-if="value === 'CopyDocument'"/>
@@ -27,10 +28,13 @@
         <Files v-else-if="value === 'Files'"/>
         <Finished v-else-if="value === 'Finished'"/>
         <Folder v-else-if="value === 'Folder'"/>
+        <FolderOpened v-else-if="value === 'FolderOpened'"/>
+        <Grid v-else-if="value === 'Grid'"/>
         <Histogram v-else-if="value === 'Histogram'"/>
         <HomeFilled v-else-if="value === 'HomeFilled'"/>
         <InfoFilled v-else-if="value === 'InfoFilled'"/>
         <List v-else-if="value === 'List'"/>
+        <Management v-else-if="value === 'Management'"/>
         <Memo v-else-if="value === 'Memo'"/>
         <Minus v-else-if="value === 'Minus'"/>
         <MoreFilled v-else-if="value === 'MoreFilled'"/>
@@ -76,6 +80,7 @@ import {
     CircleCheckFilled,
     CircleClose,
     CircleCloseFilled,
+    CirclePlus,
     Close,
     CloseBold,
     CopyDocument,
@@ -89,11 +94,14 @@ import {
     Files,
     Finished,
     Folder,
+    FolderOpened,
+    Grid,
     Histogram,
     HomeFilled,
     InfoFilled,
     List,
     Loading,
+    Management,
     Memo,
     Minus,
     MoreFilled,
@@ -137,6 +145,7 @@ const components = {
     CircleCheckFilled,
     CircleClose,
     CircleCloseFilled,
+    CirclePlus,
     Close,
     CloseBold,
     CopyDocument,
@@ -150,10 +159,13 @@ const components = {
     Files,
     Finished,
     Folder,
+    FolderOpened,
+    Grid,
     Histogram,
     HomeFilled,
     InfoFilled,
     List,
+    Management,
     Memo,
     Minus,
     MoreFilled,

package/src/element-plus/select/Select.vue

@@ -321,6 +321,17 @@ export default {
                 if (!Array.isArray(model)) {
                     model = [model];
                 }
+                if (items && items.length) {
+                    // 多选时，如果model中有值不在items中，则去掉
+                    for (let i = model.length - 1; i >= 0; i--) {
+                        let item = this.getItem(model[i]);
+                        if (!item) {
+                            model.splice(i, 1);
+                        }
+                    }
+                } else {
+                    model = [];
+                }
                 return model;
             }
             if (util.object.isNull(model)) {

package/src/element-plus/tabs/Tabs.vue

@@ -60,7 +60,7 @@ export default {
         }
     },
     mounted() {
-        if (typeof this.$route.meta.isHistory === 'function') {
+        if (this.$route && this.$route.meta && typeof this.$route.meta.isHistory === 'function') {
             let cache = this.getCache();
             if (cache) {
                 let vm = this;

package/src/element-plus/tnxel.css

@@ -881,3 +881,8 @@ i svg {
 .el-input-group__prepend .el-select .select-trigger .el-input {
     height: 100%;
 }
+
+.el-message-box__message {
+    word-break: break-all;
+    overflow-wrap: break-word;
+}

package/src/element-plus/tnxel.js

@@ -247,6 +247,7 @@ export default build('tnxel', () => {
                 type: 'warning',
                 confirmButtonText: '确定',
             }, options);
+            this.closeLoading();
             ElMessageBox.alert(message, title, options).then(callback);
             this._handleZIndex('.el-message-box__wrapper:last');
             this.app.eventBus.emit('tnx.alert', options);
@@ -258,6 +259,7 @@ export default build('tnxel', () => {
                 type: 'success',
                 confirmButtonText: '确定',
             });
+            this.closeLoading();
             ElMessageBox.alert(message, '成功', options).then(callback);
             this._handleZIndex('.el-message-box__wrapper:last');
             this.app.eventBus.emit('tnx.success', options);
@@ -269,6 +271,7 @@ export default build('tnxel', () => {
                 type: 'error',
                 confirmButtonText: '确定',
             });
+            this.closeLoading();
             ElMessageBox.alert(message, '错误', options).then(callback);
             this._handleZIndex('.el-message-box__wrapper:last');
             this.app.eventBus.emit('tnx.error', options);
@@ -308,6 +311,7 @@ export default build('tnxel', () => {
                     callback(yes);
                 }
             }
+            this.closeLoading();
             ElMessageBox.confirm(message, title, options);
             this._handleZIndex('.el-message-box__wrapper:last');
             this.app.eventBus.emit('tnx.confirm', options);

package/src/element-plus/toolbar/ToolBarItem.js

@@ -0,0 +1,15 @@
+/**
+ * 工具栏项
+ */
+export default class ToolBarItem {
+
+    icon = '';
+    caption = '';
+    disabled = false;
+    click = null;
+
+    static from(object) {
+        return Object.assign(new ToolBarItem(), object);
+    }
+
+}

package/src/element-plus/toolbar/ToolBarItem.vue

@@ -0,0 +1,43 @@
+<template>
+    <Button type="default" link
+        :icon="item.icon"
+        :tooltip="item.caption" tooltip-placement="bottom"
+        :disabled="item.disabled"
+        :key="item.disabled"
+        :disabled-tip="false"
+        :size="size"
+        @click="item.click"/>
+</template>
+
+<script>
+import ToolBarItem from './ToolBarItem.js';
+import Button from '../button/Button.vue';
+
+export default {
+    name: 'TnxelToolBarItem',
+    components: {Button},
+    props: {
+        item: {
+            type: ToolBarItem,
+            required: true,
+        },
+        size: {
+            type: String,
+            validator: value => {
+                return ['small', 'default', 'large'].includes(value);
+            },
+            default: 'default',
+        },
+    },
+    data() {
+        return {
+            model: {},
+        };
+    },
+    methods: {}
+}
+</script>
+
+<style>
+
+</style>

package/src/element-plus/toolbar/Toolbar.vue

@@ -0,0 +1,56 @@
+<template>
+    <div class="tnxel-toolbar">
+        <div class="flex-v-center">
+            <template v-for="(item, index) of leftItems" :key="index">
+                <el-divider direction="vertical" v-if="item === '|'"/>
+                <ToolBarItem
+                    :item="Item.from(item)"
+                    :size="size"
+                    v-else-if="typeof item ==='object'"/>
+            </template>
+        </div>
+        <div class="flex-v-center">
+            <ToolBarItem v-for="(item, index) of rightItems" :key="index"
+                :item="Item.from(item)"
+                :size="size"/>
+        </div>
+    </div>
+</template>
+
+<script>
+import ToolBarItem from './ToolBarItem.vue';
+import Item from './ToolBarItem.js';
+
+export default {
+    name: 'TnxelToolbar',
+    components: {ToolBarItem},
+    props: {
+        leftItems: Array,
+        rightItems: Array,
+        size: {
+            type: String,
+            validator: value => {
+                return ['small', 'default', 'large'].includes(value);
+            },
+            default: 'default',
+        },
+    },
+    data() {
+        return {
+            Item,
+            model: {},
+        };
+    },
+    methods: {}
+}
+</script>
+
+<style>
+.tnxel-toolbar {
+    height: 32px;
+    padding: 0 8px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+</style>

package/src/tnxvue-router.js

@@ -37,8 +37,10 @@ function addRoute(routes, superiorPath, item, fnImportPage) {
 function applyItemsToRoutes(superiorPath, items, routes, fnImportPage) {
     if (items && items.length) {
         items.forEach(item => {
-            addRoute(routes, superiorPath, item, fnImportPage);
-            applyItemsToRoutes(item.path, item.subs, routes, fnImportPage);
+            if (item) {
+                addRoute(routes, superiorPath, item, fnImportPage);
+                applyItemsToRoutes(item.path, item.subs, routes, fnImportPage);
+            }
         });
     }
 }
@@ -68,7 +70,11 @@ export default function (VueRouter, menu, fnImportPage) {
     if (Array.isArray(menu)) {
         items = [];
         menu.forEach(function (m) {
-            items = items.concat(m.items);
+            if (Array.isArray(m.items)) {
+                items = items.concat(m.items);
+            } else { // menu实际上是items
+                items.push(m);
+            }
         });
     } else {
         items = menu.items;
@@ -124,8 +130,8 @@ export default function (VueRouter, menu, fnImportPage) {
 
     router.afterEach(function (to, from) {
         router.prev = from;
-        // 前后hash相同，但全路径不同（意味着参数不同），则需要刷新页面，否则页面不会刷新
-        if (to.href === from.href && to.fullPath !== from.fullPath) {
+        // 前后路径相同，但全路径不同（意味着参数不同），则需要刷新页面，否则页面不会刷新
+        if (to.path === from.path && to.fullPath !== from.fullPath) {
             window.location.reload();
         }
     });

package/src/tnxvue.js

@@ -126,6 +126,16 @@ export default build('tnxvue', () => {
                             }
                         }
                     }];
+                } else if (type === 'close') {
+                    return [{
+                        text: '关闭',
+                        type: theme || 'default',
+                        click(close) {
+                            if (typeof callback === 'function') {
+                                return callback.call(this, close);
+                            }
+                        }
+                    }];
                 } else {
                     return [{
                         text: '确定',