1
0
forked from x/volcanos

opt data.js

This commit is contained in:
harveyshao 2022-07-07 13:06:42 +08:00
parent 1296591da7
commit 09dbfcc3df
7 changed files with 85 additions and 83 deletions

View File

@ -474,7 +474,7 @@ Volcanos(chat.ONLAYOUT, {help: "页面布局", _init: function(can, target) { ta
if (layout) { return can.page.style(can, target, layout), can.onmotion.move(can, target, layout), layout } if (layout) { return can.page.style(can, target, layout), can.onmotion.move(can, target, layout), layout }
if (!event || !event.target || !event.clientX) { return {} } if (!event || !event.target || !event.clientX) { return {} }
var left = event.clientX-event.offsetX, top = event.clientY-event.offsetY+event.target.offsetHeight-1; if (right) { var left = event.clientX-event.offsetX, top = event.clientY-event.offsetY+event.target.offsetHeight-3; if (right) {
var left = event.clientX-event.offsetX+event.target.offsetWidth, top = event.clientY-event.offsetY var left = event.clientX-event.offsetX+event.target.offsetWidth, top = event.clientY-event.offsetY
} }

View File

@ -425,6 +425,8 @@ Volcanos("page", {help: "用户界面", ClassList: {
while (item) { res += item.offsetLeft||0, item = item.parentNode } while (item) { res += item.offsetLeft||0, item = item.parentNode }
return res return res
}, },
editable: function(can, item, ok) { item.setAttribute("contenteditable", ok) },
draggable: function(can, item, ok) { item.setAttribute("draggable", ok) },
AppendVue: function(can, meta, list, target) { AppendVue: function(can, meta, list, target) {
can.require(["https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"], function() { can.require(["https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"], function() {
@ -434,6 +436,7 @@ Volcanos("page", {help: "用户界面", ClassList: {
}) })
}, },
insertBefore: function(can, list, before) { insertBefore: function(can, list, before) {
var item = can.page.Append(can, before.parentNode, list).first var item = can.page.Append(can, before.parentNode, list).first
before.parentNode.insertBefore(item, before) before.parentNode.insertBefore(item, before)

View File

@ -43,13 +43,14 @@ table.content td { padding:2px 6px; }
table.content.action td:last-child, table.content.action th:last-child { background-color:#7dc6d7eb; position:sticky; right:0; } table.content.action td:last-child, table.content.action th:last-child { background-color:#7dc6d7eb; position:sticky; right:0; }
table.content thead { position:sticky; top:-1px; } table.content thead { position:sticky; top:-1px; }
td>input[type=button][name=create] { background-color:blue; } input[type=button][name=start] { background-color:#52ce78; }
td>input[type=button][name=remove] { background-color:red; } input[type=button][name=open] { background-color:blue; }
td>input[type=button][name=start] { background-color:#52ce78; } input[type=button][name=stop] { background-color:red; }
td>input[type=button][name=open] { background-color:blue; } input[type=button][name=create] { background-color:blue; }
td>input[type=button][name=stop] { background-color:red; } input[type=button][name=remove] { background-color:red; }
td>input[type=button][name=delete] { background-color:red; } input[type=button][name=delete] { background-color:red; }
td>input[type=button][name=insert] { background-color:blue; } input[type=button][name=insert] { background-color:blue; }
input[type=button][name=trash] { background-color:red; }
div.tabs { background-color:#00000038; color:white; padding:5px; margin:0 1px; } div.tabs { background-color:#00000038; color:white; padding:5px; margin:0 1px; }
div.code { background-color:#343a3445; color:white; padding:10px; border:solid 3px green; } div.code { background-color:#343a3445; color:white; padding:10px; border:solid 3px green; }
@ -151,7 +152,7 @@ body.white fieldset.word.float { background-color:#3d5569; color:black; }
body.white legend { border-radius:10px 10px 10px 10px; } body.white legend { border-radius:10px 10px 10px 10px; }
body.white select { background-color:#99CC66; color:white; border:2px solid #99CC66; border-radius:10px 10px 10px 10px; } body.white select { background-color:#99CC66; color:white; border:2px solid #99CC66; border-radius:10px 10px 10px 10px; }
body.white input[type=button] { background-color:#FF9900; color:white; border:2px solid #FF9900; border-radius:10px; } body.white input[type=button] { background-color:#FF9900; color:white; border:none; border-radius:10px; }
body.white input[type=text] { background-color:white; color:black; border:2px solid #14a58e; border-radius:6px; } body.white input[type=text] { background-color:white; color:black; border:2px solid #14a58e; border-radius:6px; }
body.white input[type=password] { background-color:white; color:black; border:2px solid #14a58e; border-radius:6px; } body.white input[type=password] { background-color:white; color:black; border:2px solid #14a58e; border-radius:6px; }
body.white input[name=cmd] { background-color:black; color:white; width:240px; } body.white input[name=cmd] { background-color:black; color:white; width:240px; }
@ -160,14 +161,15 @@ body.white table.content { color:black; }
body.white table.content tr { background-color:#e1f1ff1f; } body.white table.content tr { background-color:#e1f1ff1f; }
body.white table.content th { background-color:#99CCFF; } body.white table.content th { background-color:#99CCFF; }
body.white td>input[type=button][name=结束] { background-color:red; } body.white input[type=button][name=结束] { background-color:red; }
body.white td>input[type=button][name=stop] { background-color:red; } body.white input[type=button][name=stop] { background-color:red; }
body.white td>input[type=button][name=open] { background-color:blue; } body.white input[type=button][name=open] { background-color:blue; }
body.white td>input[type=button][name=start] { background-color:#52ce78; } body.white input[type=button][name=start] { background-color:#52ce78; }
body.white td>input[type=button][name=create] { background-color:blue; } body.white input[type=button][name=create] { background-color:blue; }
body.white td>input[type=button][name=remove] { background-color:red; } body.white input[type=button][name=remove] { background-color:red; }
body.white td>input[type=button][name=insert] { background-color:blue; } body.white input[type=button][name=insert] { background-color:blue; }
body.white td>input[type=button][name=delete] { background-color:red; } body.white input[type=button][name=delete] { background-color:red; }
body.white input[type=button][name=trash] { background-color:red; }
body.print { background-color:white; color:black; } body.print { background-color:white; color:black; }
body.print legend, body.print select, body.print input[type=text] { box-shadow:0px 0px 0px 0px #626bd0; } body.print legend, body.print select, body.print input[type=text] { box-shadow:0px 0px 0px 0px #626bd0; }
@ -270,6 +272,7 @@ body.mobile.landscape div.output.card div.item { width:auto; float:left; }
div.output.card div.item { padding:10px; border:solid 1px #e7e7e7; margin:10px; height:120px; width:240px; float:left; position:relative; } div.output.card div.item { padding:10px; border:solid 1px #e7e7e7; margin:10px; height:120px; width:240px; float:left; position:relative; }
div.output.card div.item>div.title { font-size:1.2rem; font-weight:bold; padding:10px; border-bottom: solid 1px #e7e7e7; } div.output.card div.item>div.title { font-size:1.2rem; font-weight:bold; padding:10px; border-bottom: solid 1px #e7e7e7; }
div.output.card div.item>div.content { padding:10px; height:24px; } div.output.card div.item>div.content { padding:10px; height:24px; }
div.output.card div.item.stop { color:gray; }
body.simple { background-color:white; } body.simple { background-color:white; }
body.simple fieldset.Header { border-bottom:solid 1px #e7e7e7; height:60px; display:block; } body.simple fieldset.Header { border-bottom:solid 1px #e7e7e7; height:60px; display:block; }

View File

@ -150,6 +150,7 @@ Volcanos(chat.ONACTION, {help: "交互操作", _init: function(can, cb, target)
var gt = "❯", lt = "❮"; function toggle(view) { return !can.setRiver("display") } var gt = "❯", lt = "❮"; function toggle(view) { return !can.setRiver("display") }
can.page.Append(can, target, [{view: [[html.TOGGLE, chat.PROJECT]], list: [{text: [gt, html.DIV]}], onclick: function(event) { can.page.Append(can, target, [{view: [[html.TOGGLE, chat.PROJECT]], list: [{text: [gt, html.DIV]}], onclick: function(event) {
event.target.innerHTML = toggle()? gt: lt event.target.innerHTML = toggle()? gt: lt
can.onaction.refresh(can)
}}]) }}])
} }
@ -219,14 +220,15 @@ Volcanos(chat.ONACTION, {help: "交互操作", _init: function(can, cb, target)
can.onlayout._init(can) can.onlayout._init(can)
}, },
help: function(can, button) { can.user.open("/help/"+button+".shy") }, help: function(can, button) { can.user.open("/help/"+button+".shy") },
refresh: function(can, button) { refresh: function(can) {
can._root._height = window.innerHeight, can._root._width = window.innerWidth can._root._height = window.innerHeight, can._root._width = window.innerWidth
can.onlayout._init(can) can.onlayout._init(can)
var width = can.ConfWidth()-can.Conf(html.MARGIN_X) var width = can.ConfWidth()-can.Conf(html.MARGIN_X)
can.core.List(can._plugins, function(sub) { can.core.List(can._plugins, function(sub) { var table = can.core.Value(sub, chat._OUTPUT_CURRENT)
can.page.style(can, sub._output, html.MAX_WIDTH, sub.ConfWidth(width)-(can.user.isWindows? 20: 0)) can.page.style(can, sub._output, html.MAX_WIDTH, sub.ConfWidth(width)-(can.user.isWindows? 20: 0))
can.onappend._output(sub, can.core.Value(sub, chat._OUTPUT_CURRENT)._msg, sub._display) table.ConfWidth(width)
table.onimport.layout? table.onimport.layout(table): can.onappend._output(sub, table._msg, sub._display)
}) })
}, },
}) })

View File

@ -1,34 +1,32 @@
Volcanos(chat.ONIMPORT, {help: "导入数据", _init: function(can, msg, cb) { Volcanos(chat.ONIMPORT, {help: "导入数据", _init: function(can, msg, cb) {
can.ui = can.onlayout.display(can)
can.base.isFunc(cb) && cb(msg) can.base.isFunc(cb) && cb(msg)
can.ui = can.onlayout.display(can)
can.table = can.onappend.table(can, msg, function(value, key, index, line) { can.table = can.onappend.table(can, msg, function(value, key, index, line) {
return {text: [value, "td"], oncontextmenu: function(event) { return {text: [value, html.TD], oncontextmenu: function(event) {
can.user.carte(event, can, can.ondetail, can.ondetail.list, function(ev, cmd, meta) { can.user.carte(event, can, can.ondetail, can.ondetail.list, function(ev, cmd, meta) {
var cb = meta[cmd]; cb && cb(event, can, cmd, value, key, index, line) var cb = meta[cmd]; cb && cb(event, can, cmd, value, key, index, line)
}) })
}, ondblclick: function(event) {
can.page.Modify(can, event.target, {contenteditable: true})
}, onclick: function(event) { }, onclick: function(event) {
if (key == "path") { can.run(event, [can.Option("path", value)]) } key == nfs.PATH && can.run(event, [can.Option(nfs.PATH, value)])
}, ondblclick: function(event) {
can.page.editable(can, event.target, true)
}} }}
}, can.ui.content) }, can.ui.content)
can.onexport.list = msg.append can.onappend._status(can, msg.append)
can.onaction._compute(event, can) can.onaction._compute(event, can)
}, },
}) }, [""])
Volcanos(chat.ONFIGURE, {help: "组件菜单", Volcanos(chat.ONFIGURE, {help: "组件菜单",
"求和": function(event, can, res, td, index) { "求和": function(event, can, res, td, index) {
res[index] = parseInt(td.innerText) + (res[index]||0); res[index] = parseInt(td.innerText) + (res[index]||0);
}, },
"最大": function(event, can, res, td, index) { "最大": function(event, can, res, td, index) {
var n = parseInt(td.innerText); (res[index] === undefined || parseInt(td.innerText) > parseInt(res[index])) && (res[index] = parseInt(td.innerText))
n > (res[index]||-10000) && (res[index] = n);
}, },
"最小": function(event, can, res, td, index) { "最小": function(event, can, res, td, index) {
var n = parseInt(td.innerText); (res[index] === undefined || parseInt(td.innerText) < parseInt(res[index])) && (res[index] = parseInt(td.innerText))
n < (res[index]||10000) && (res[index] = n);
}, },
"平均": function(event, can, res, td, ncol, cols, rows, nrow) { "平均": function(event, can, res, td, ncol, cols, rows, nrow) {
res[ncol] = parseInt(td.innerText) + (res[ncol]||0); res[ncol] = parseInt(td.innerText) + (res[ncol]||0);
@ -37,104 +35,98 @@ Volcanos(chat.ONFIGURE, {help: "组件菜单",
} }
}, },
}) })
Volcanos(chat.ONACTION, {help: "组件菜单", list: ["保存", ["mode", "全选", "块选", "反选", "多选", "拖动", "编辑"], ["some", "求和", "最大", "最小", "平均"]], Volcanos(chat.ONACTION, {help: "组件菜单", list: [ice.SAVE, [ice.MODE, "全选", "块选", "反选", "多选", "拖动", "编辑"], [ice.EXEC, "求和", "最大", "最小", "平均"]],
_compute: function(event, can) { _compute: function(event, can) {
var mul = "tr" + (can.Action("mode") == "全选"? "": ".select") var mul = html.TR + (can.Action(ice.MODE) == "全选"? "": ".select")
var method = can.onfigure[can.Action("some")], res = {} var method = can.onfigure[can.Action(ice.EXEC)], res = {}
can.page.Select(can, can.ui.content, mul, function(tr, nrow, rows) { can.page.Select(can, can.ui.content, mul, function(tr, nrow, rows) {
(mul != "tr" || nrow > 0) && can.page.Select(can, tr, "td", function(td, ncol, cols) { (mul != html.TR || nrow > 0) && can.page.Select(can, tr, html.TD, function(td, ncol, cols) {
method && method(event, can, res, td, ncol, cols, rows, nrow) method && method(event, can, res, td, ncol, cols, rows, nrow)
}) })
}) })
can.core.Item(res, function(key, value) { can.Status(can._msg.append[key], value||"") })
},
can.core.Item(res, function(key, value) { save: function(event, can, button) { can.runAction(event, button, [can.Option(nfs.PATH), can.onexport.file(can)]) },
can.Status(can._msg.append[key], value||"") exec: function(event, can, button) { can.onaction._compute(event, can) },
_foreach: function(can, button, cb) {
button && can.Action(ice.MODE, button)
can.page.Select(can, can.ui.content, html.TR, function(item) {
cb(item)
}) })
}, },
"保存": function(event, can, cmd) { "全选": function(event, can, button) {
can.runAction(event, cmd, [can.Option("path"), can.onexport.file(can)]) can.onaction._foreach(can, button, function(item) {
}, can.page.editable(can, item, false)
some: function(event, can, cmd) { can.page.draggable(can, item, false)
can.onaction._compute(event, can) item.onmouseenter = null, item.onclick = null
}, can.page.ClassList.del(can, item, html.SELECT)
"全选": function(event, can, cmd) {
cmd && can.Action("mode", cmd)
can.page.Select(can, can.ui.content, "tr", function(item) {
can.page.ClassList.del(can, item, "over") can.page.ClassList.del(can, item, "over")
can.page.ClassList.del(can, item, "select")
item.setAttribute("contenteditable", false)
item.setAttribute("draggable", false)
item.onmouseenter = null
item.onclick = null
}) })
can.onaction._compute(event, can) can.onaction._compute(event, can)
}, },
"块选": function(event, can, cmd) { "块选": function(event, can, button) {
cmd && can.Action("mode", cmd) can.onaction._foreach(can, button, function(item) {
can.page.Select(can, can.ui.content, "tr", function(item) {
item.onmouseenter = function() { item.onmouseenter = function() {
can.page.ClassList.add(can, item, "select") can.page.ClassList.add(can, item, html.SELECT)
can.onaction._compute(event, can) can.onaction._compute(event, can)
} }
}) })
}, },
"反选": function(event, can, cmd) { "反选": function(event, can, button) {
cmd && can.Action("mode", cmd) can.onaction._foreach(can, button, function(item) {
can.page.Select(can, can.ui.content, "tr", function(item) {
item.onmouseenter = function() { item.onmouseenter = function() {
can.page.ClassList.del(can, item, "select") can.page.ClassList.del(can, item, html.SELECT)
can.onaction._compute(event, can) can.onaction._compute(event, can)
} }
}) })
}, },
"多选": function(event, can, cmd) { "多选": function(event, can, button) {
cmd && can.Action("mode", cmd) can.onaction._foreach(can, button, function(item) {
can.page.Select(can, can.ui.content, "tr", function(item) { item.onmouseenter = function() {}
item.onclick = function() { item.onclick = function() {
can.page.ClassList.neg(can, item, "select") can.page.ClassList.neg(can, item, html.SELECT)
can.onaction._compute(event, can) can.onaction._compute(event, can)
} }
}) })
}, },
"拖动": function(event, can, cmd) { "拖动": function(event, can, button) {
can.onaction["全选"](event, can, cmd) can.onaction["全选"](event, can, button)
can.page.Select(can, can.ui.content, "tr", function(item) { can.onaction._foreach(can, "", function(item) {
item.setAttribute("draggable", true) can.page.draggable(can, item, true)
item.ondragstart = function(event) { can.drag = item } item.ondragstart = function(event) { can.drag = item }
item.ondragover = function(event) { event.preventDefault(), can.page.ClassList.add(can, item, "over")} item.ondragover = function(event) { event.preventDefault(), can.page.ClassList.add(can, item, "over")}
item.ondragleave = function(event) { can.page.ClassList.del(can, item, "over") } item.ondragleave = function(event) { can.page.ClassList.del(can, item, "over") }
item.ondrop = function(event) { event.preventDefault() item.ondrop = function(event) { event.preventDefault()
can.page.Select(can, can.ui.content, "table", function(table) { can.page.Select(can, can.ui.content, html.TABLE, function(table) {
table.insertBefore(can.drag, item) table.insertBefore(can.drag, item)
}) })
} }
}) })
}, },
"编辑": function(event, can, cmd) { "编辑": function(event, can, button) {
cmd && can.Action("mode", cmd) can.onaction._foreach(can, button, function(item) {
can.page.Select(can, can.ui.content, "tr", function(item) { can.page.editable(can, item, true)
item.setAttribute("contenteditable", true)
}) })
}, },
}) })
Volcanos(chat.ONDETAIL, {help: "组件详情", list: ["复制", "删除"], Volcanos(chat.ONDETAIL, {help: "组件详情", list: ["复制", "删除"],
"复制": function(event, can, cmd, value, key, index, line) { "复制": function(event, can, button, value, key, index, line) {
var end = can.page.Append(can, can.table, [{type: "tr", list: can.core.List(can._msg.append, function(key) { var end = can.page.Append(can, can.table, [{type: html.TR, list: can.core.List(can._msg.append, function(key) {
return {text: [line[key], "td"]} return {text: [line[key], html.TD]}
})}]).tr })}]).tr; can.table.insertBefore(end, event.target.parentNode)
can.table.insertBefore(end, event.target.parentNode)
}, },
"删除": function(event, can, cmd) { "删除": function(event, can, button) {
can.page.Remove(can, event.target.parentNode) can.page.Remove(can, event.target.parentNode)
}, },
}) })
Volcanos(chat.ONEXPORT, {help: "导出数据", Volcanos(chat.ONEXPORT, {help: "导出数据",
file: function(can) { file: function(can) {
return can.page.Select(can, can.ui.content, "tr", function(tr) { return can.page.Select(can, can.ui.content, html.TR, function(tr) {
return can.page.Select(can, tr, "th,td", function(td) {return td.innerHTML}).join(",") return can.page.Select(can, tr, can.page.Keys(html.TH, html.TD), function(td) {return td.innerHTML}).join(ice.FS)
}).join("\n") }).join(ice.NL)
}, },
}) })

View File

@ -126,6 +126,8 @@ Volcanos(chat.ONIMPORT, {help: "导入数据", _init: function(can, msg, cb, tar
}) })
}, can._output, target) }, can._output, target)
}, },
// layout: function(can) {
// },
}, [""]) }, [""])
Volcanos(chat.ONKEYMAP, {help: "键盘交互", Volcanos(chat.ONKEYMAP, {help: "键盘交互",
_mode: { _mode: {

View File

@ -13,7 +13,7 @@ Volcanos(chat.ONIMPORT, {help: "导入数据", _init: function(can, msg, cb, tar
}, },
card: function(can, msg, target) { card: function(can, msg, target) {
can.page.Appends(can, target, msg.Table(function(value) { can.page.Appends(can, target, msg.Table(function(value) {
return {view: html.ITEM, list: [ return {view: html.ITEM+" "+(value.status||""), list: [
{view: [wiki.TITLE, html.DIV, value.name]}, {view: [wiki.TITLE, html.DIV, value.name]},
{view: [wiki.CONTENT, html.DIV, value.text]}, {view: [wiki.CONTENT, html.DIV, value.text]},
{view: html.ACTION, inner: value.action, onclick: function(event) { {view: html.ACTION, inner: value.action, onclick: function(event) {