efront 2.46.3 → 2.47.0

package/coms/zimoli/selectList.js

@@ -6,6 +6,7 @@ var singleClick = function () {
     node.activeNode = this;
     if (node.value === this.value) return;
     node.value = this.value;
+    node.name = this.name;
     dispatch(node, "change");
 };
 var multipleClick = function () {
@@ -21,21 +22,27 @@ var multipleClick = function () {
     }
     dispatch(node, "change");
 };
-function main(children, multiple) {
+
+function main(children, multiple, addable) {
     var list = div();
     list.value = multiple ? [] : "";
     var firstValue = false;
     var clicker = multiple ? multipleClick : singleClick;
-    var hasIcon = false, iconed = '';
-    appendChild(list, [].map.call(children, function (option) {
-        var item = div();
-        item.innerHTML = option.innerHTML;
-        var icon = option.getAttribute("icon");
+    var itemMap = Object.create(null);
+    function createItem(option) {
+        var key = option.key || option.value;
+        if (key in itemMap) return itemMap[key];
+        var item = itemMap[option.value] = document.createElement('div');
+
+        item.setAttribute("item", '');
+        item.innerHTML = option.innerHTML || option.name;
+        item.name = option.name || option.innerHTML;
+        var icon = option.getAttribute ? option.getAttribute("icon") : option.icon;
         if (icon) {
             hasIcon = true;
             css(item, { backgroundImage: `url('${icon}')` });
         }
-        item.value = option.value;
+        item.value = key;
         if (option.selected) {
             iconed = icon;
             if (multiple) {
@@ -54,10 +61,63 @@ function main(children, multiple) {
             onclick(item, clicker);
         }
         return item;
-    }));
+
+    }
+    var hasIcon = false, iconed = '';
+    appendChild(list, [].map.call(children, createItem));
+    if (addable) {
+        var adder = document.createElement("div");;
+        adder.innerHTML = "<a>添加</a><a>管理</a>";
+        button(adder.firstChild);
+        button(adder.children[1]);
+        on("click")(adder, async function (event) {
+            event.preventDefault();
+            var target = getTargetIn(this, event.target, false);
+            switch (target) {
+                case this.children[0]:
+                    var a = prompt("请输入", a => {
+                        if (a in itemMap) {
+                            alert(`选项 ${a} 已存在！`);
+                            return false;
+                        }
+                    });
+                    list.with = a;
+                    on('remove')(a, function () {
+                        list.with = null;
+                    });
+                    a = await a;
+                    if (a in itemMap) return false;
+                    cast(list.target, "add-option", a);
+                    children.push({ name: a, key: a });
+                    list.insertBefore(createItem({
+                        name: a,
+                        value: a,
+                    }), adder);
+                    break;
+                case this.children[1]:
+                    var options = [].slice.call(list.children, 0, list.children.length - 1);
+                    var edit = selectListEdit(options.slice(0));
+
+                    list.with = edit;
+                    on("remove")(edit, function () {
+                        list.with = null;
+                        remove([].slice.call(list.children, 0, list.children.length - 1));
+                        children.splice(0, children.length);
+                        children.push.apply(children, edit.$scope.options.map(o => ({ key: o.key || o.value, name: o.name || o.innerHTML })))
+                        appendChild.before(adder, edit.$scope.options.map(createItem));
+                        cast(list.target, 'set-options', edit.$scope.options);
+                    });
+                    popup(edit, [.5, .5]);
+                    break;
+            }
+        })
+        adder.setAttribute("adder", '');
+        list.appendChild(adder)
+    }
     if (hasIcon) {
         list.setAttribute('iconed', '');
     }
     list.icon = iconed;
+    on('mousedown')(list, e => e.preventDefault());
     return list;
 }

package/coms/zimoli/selectList.less

@@ -2,9 +2,11 @@
     max-width: 100%;
     background-color: #fff;
     line-height: 30px;
-    box-shadow: 0 0 20px -6px rgba(0, 0, 0, .3);
+    box-shadow: 0 0 20px -6px rgba(0, 0, 0, .1);
+    box-sizing: border-box;
+    border: 1px solid #0003;
 
-    >div {
+    >[item] {
         cursor: default;
         padding: 0 16px;
 
@@ -49,4 +51,15 @@
         background-position-y: 50%;
         background-position-x: 8px;
     }
+}
+
+>[adder] {
+    padding: 0 16px;
+    text-align: right;
+
+    a {
+        cursor: pointer;
+        vertical-align: top;
+        margin-left: 10px;
+    }
 }

package/coms/zimoli/selectListEdit.html

@@ -0,0 +1,15 @@
+<div head>管理选项</div>
+<div body>
+    <div>
+        <input placeholder="搜索或添加" v-model="search" @keydown.enter="add()" /><a @click="add()"
+            -if="search&&!filtered.hasFullmatch">添加</a>
+    </div>
+    <div class="item" -repeat="o in (search?filtered:options)">
+        <span -html=o.name></span>
+        <a type="danger" @click="del(o)">删除</a>
+    </div>
+</div>
+<div foot>
+    <btn @click="save()">确定</btn>
+    <btn type="white" @click="remove()">取消</btn>
+</div>

package/coms/zimoli/selectListEdit.js

@@ -0,0 +1,68 @@
+function main(options) {
+    var page = view();
+    page.innerHTML = template;
+    on("submit")(page, e => e.preventDefault());
+    render(page, {
+        options, a: button, input, _search: '',
+        add() {
+            var a = this._search;
+            a = a.trim();
+            if (!a) return;
+            if (this.filtered.hasFullmatch) return;
+            options.push({ name: a, value: a });
+            this.research();
+        },
+        del(o) {
+            for (var cx = 0, dx = options.length; cx < dx; cx++) {
+                if (options[cx].value === o.value) {
+                    var i = cx;
+                    break;
+                }
+            }
+            if (i >= 0) options.splice(i, 1);
+            console.log(i)
+            this.research();
+        },
+        get search() {
+            return this._search;
+        },
+        research() {
+            var v = this._search;
+            if (v) {
+                this.filtered = search(v, options);
+            }
+        },
+        set search(v) {
+            this._search = v;
+            if (v) {
+                this.research();
+            }
+        },
+        btn: button,
+        remove() {
+            remove(page);
+        },
+        save() {
+            remove(page);
+        },
+        filtered: []
+    });
+    drag.on(page.firstChild, page);
+    on("append")(page, function () {
+        setTimeout(function () {
+            page.querySelector("input").focus();
+        });
+    });
+    on("mousedown")(page, e => {
+        if (e.target !== page.querySelector("input")) {
+            e.preventDefault();
+        }
+    });
+    page.onback = function () {
+        if (page.$scope.search) {
+            page.$scope.search = '';
+            return false;
+        }
+    };
+    return page;
+}

package/coms/zimoli/selectListEdit.less

@@ -0,0 +1,21 @@
+& {
+    position: absolute;
+    user-select: none;
+}
+
+[body]>div {
+    padding: 6px 10px;
+    background: #fff;
+
+    >* {
+        line-height: 28px;
+        vertical-align: top;
+        margin-right: 20px;
+    }
+
+    &.item {
+        &:nth-of-type(n+2) {
+            border-top: 1px solid #0003;
+        }
+    }
+}

package/coms/zimoli/swap.less

@@ -30,7 +30,7 @@
     -o-appearance: none;
     appearance: none;
     &:before {
-        background-color: #26f;
+        background-color: #28c;
         transition: all .1s ease-out;
         left: 50%;
         top: 50%;

package/coms/zimoli/table.html

@@ -1,15 +1,17 @@
 <thead>
     <tr>
-        <td -repeat="f in fields"><i -if="f.icon" -class="f.icon"></i></span><span -if="f.name" -html="f.name"></span>
+        <td -repeat="f in fields track by f.id" :style="{width:f.width}"><i -if="f.icon"
+                -class="f.icon"></i></span><span -if="f.name" -html="f.name"></span>
         </td>
     </tr>
 </thead>
 <tbody -src="d in data">
     <tr>
         <td -repeat="f in fields">
-            <span -if="f.key" -text="d[f.key]"></span>
-            <a on-click="o.do(d)" -if="f.options" -repeat="o in f.options">
-                <span -text=o.name></span>
+            <model -if="f.key" :field=f :data=d readonly ></model>
+            <a on-click="o.do(d)" -if="!f.key&&f.options" _type="o.type instanceof Function?o.type(d):o.type"
+                -repeat="o in f.options">
+                <span -text="o.name instanceof Function?o.name(d):o.name"></span>
             </a>
         </td>
     </tr>

package/coms/zimoli/table.js

@@ -91,11 +91,11 @@ var adaptTarget = function (event) {
             }
             if (target) target = getFirstSingleColCell(this, target.colend);
             if (target) {
-                if (position.right >= getSelection(this).right - 7) {
+                if (position.right >= getScreenPosition(this).right - 7) {
                     target = this;
                     return;
                 }
-                css(this, { 'cursor': 'e-resize' });
+                css(document.body, { 'cursor': 'col-resize' });
                 result = {
                     target,
                     restX: event.clientX - target.offsetWidth
@@ -106,18 +106,66 @@ var adaptTarget = function (event) {
     }
     if (!result) {
         this.resizing = false;
-        css(this, { 'cursor': 'default' });
+        css(document.body, { 'cursor': '' });
     }
 };
 var tdElementReg = /^t[hd]$/i;
 var trElementReg = /^tr$/i;
+var id = 0;
+function enrichField(f) {
+    if (!f.id) f.id = ++id;
+    if (f.width) return;
+    var width;
+    if (f.size) {
+        width = f.size;
+        if (width < 40) width = width * 16;
+    }
+    else switch (f.type) {
+        case "text":
+            width = 30;
+            break;
+        case "input":
+            width = 200;
+            break;
+        case "date":
+            width = 180;
+        case "datetime":
+            width = 200;
+            break;
+        case "time":
+            width = 120;
+            break;
+        default:
+            if (f.options) {
+                width = f.options.map(o => o.name instanceof Function ? o.name() : o.name).join(" ").length * 20;
+            } else {
+                width = String(f.name || f.key).length * 16;
+            }
+    }
+    if (width > 600) width = 600;
+    f.width = width + 60;
+}
+
 
 function table(elem) {
     var tableElement = isElement(elem) ? elem : document.createElement("table");
     var activeCols = [];
-    onmousemove(tableElement, adaptTarget);
+    var adaptCursor = adaptTarget.bind(tableElement);
+    var off;
+    tableElement.init = function () {
+        off = on("mousemove")(window, adaptCursor);
+    };
+    tableElement.dispose = tableElement.destroy = function () {
+        off();
+    };
+    on("append")(tableElement, tableElement.init);
+    on("remove")(tableElement, tableElement.destroy);
+    if (isMounted(tableElement)) tableElement.init();
+
     moveupon(tableElement, {
-        start() { },
+        start(event) {
+            if (this.resizing) event.preventDefault();
+        },
         move: resizeTarget,
     });
     onmousemove(tableElement, function (event) {
@@ -142,7 +190,7 @@ function table(elem) {
             removeClass(td, "y-ing");
         });
     });
-    var table = tableElement.hasAttribute("ng-src") || tableElement.hasAttribute("src") ? list(tableElement) : tableElement;
+    var table = tableElement;
     var thead;
     var cellMatchManager = function (element) {
         if (!thead) [thead] = table.getElementsByTagName("thead");
@@ -162,10 +210,15 @@ function table(elem) {
     care(table, function ([fields, data]) {
         thead = null;
         this.innerHTML = template;
+        fields.forEach(enrichField);
         render(this, {
             fields,
             tbody: list,
             data,
+            model,
+            setWidth(target, f) {
+                css(target, { width: f.width });
+            },
             a: button,
         }, this.$parentScopes.concat(this.$scope));
     })

package/coms/zimoli/table.less

@@ -1,4 +1,5 @@
 &[dragchildren] {
+
     >thead,
     >tbody,
     & {
@@ -74,8 +75,9 @@ table,
     line-height: 32px;
     height: 100%;
     min-height: 30px;
-
+    user-select: auto;
     display: table-row-group;
+    overflow: auto;
 
     >tr {
 

package/coms/zimoli/textarea.less

@@ -16,6 +16,5 @@
 model>& {
     width: 100% !important;
     display: block;
-    margin: 10px 0;
     height: 120px;
 }

package/coms/zimoli/zimoli.js

@@ -249,11 +249,33 @@ function prepare(pgpath, ok) {
         return _with_elements;
     };
     state.path = function (url) {
-        if (isString(url) && /^[^\\\/]/.test(url)) {
+        if (/^\.+\//.test(url)) {
             url = pgpath.replace(/[^\/]*$/, url);
         }
+        if (isString(url) && /[\\\/\.]/.test(url)) {
+            url = url.replace(/^\.[\\\/]/, '');
+            var ps = url.split(/[\\\/]/);
+            var ds = [];
+            for (var p of ps) {
+                if (p === "..") {
+                    ds.pop();
+                }
+                else if (p !== ".") {
+                    ds.push(p);
+                }
+            }
+            url = "/" + ds.join('/').replace(/^\//, '');
+        }
         return url;
-    }
+    };
+    state.popup = function (a) {
+        a = state.path(a);
+        return popup.apply(this, [a].concat([].slice.call(arguments, 1)));
+    };
+    state.init = function (a) {
+        a = state.path(a);
+        return init.apply(this, [a].concat([].slice.call(arguments, 1)));
+    };
     state.go = function (url, args, _history_name) {
         // if (arguments.length === 1 && isFinite(url)) return window_history.go(url | 0);
         var to = function (_url, args, _history_name) {
@@ -337,11 +359,17 @@ function prepare(pgpath, ok) {
     }, state);
 }
 function create(pagepath, args, from, needroles) {
-    var page_object = isObject(pagepath) ? pagepath : page_generators[getpgpath(pagepath)];
-    if (!page_object) {
-        throw new Error(`调用create前请确保prepare执行完毕:${pagepath}`);
+    if (typeof pagepath === 'string') {
+        var page_object = isObject(pagepath) ? pagepath : page_generators[getpgpath(pagepath)];
+        if (!page_object) {
+            throw new Error(`调用create前请确保prepare执行完毕:${pagepath}`);
+        }
+        var { pg, "with": _with_elements, state, onback: _pageback_listener, roles } = page_object;
+    }
+    else if (isFunction(pagepath)) {
+        var pg = pagepath;
+        var { with: _with_elements, state = {}, onback: _pageback_listener, roles } = pg;
     }
-    var { pg, "with": _with_elements, state, onback: _pageback_listener, roles } = page_object;
     if (!checkroles(user.roles, roles) || !checkroles(user.roles, needroles)) {
         // 检查权限
         if (!user.isLogin && user.loginPath) {

package/debug.log

@@ -0,0 +1,2 @@
+[1106/041816.465:ERROR:registration_protocol_win.cc(102)] CreateFile: ϵͳ�Ҳ���ָ�����ļ��� (0x2)
+[1114/175715.384:ERROR:registration_protocol_win.cc(102)] CreateFile: ϵͳ�Ҳ���ָ�����ļ��� (0x2)

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "efront",
-    "version": "2.46.3",
+    "version": "2.47.0",
     "description": "一个开发工具，开放源代码，自带组件库和编译环境，可以用来开发web组件，web应用或nodejs模块，或做为已有代码的加密工具，也可以做为静态页面服务器或跨域中转服务器使用",
     "main": "public/efront.js",
     "directories": {