添加table-view效果

添加独立bar.json
This commit is contained in:
CSSC-WORK\murmur 2024-07-01 17:30:56 +08:00
parent 9b991deea1
commit e63ee924d4
3 changed files with 280 additions and 12 deletions

View File

@ -121,6 +121,10 @@ getStatus = function(){
return {state={math.random(-1,1),math.random(-1,1),math.random(-1,1)}};
}
loadSchema = function(s){
var jsonstr = string.load("/res/"++s++".json");
return web.json.parse(jsonstr);
}
import wsock.tcp.asynHttpServer;
@ -129,6 +133,16 @@ var httpServer = wsock.tcp.asynHttpServer();
httpServer.run(
//此处添加函数
["/loadSchema"] = function(response,request){
//console.varDump(request)
var data = request.get["schema"];//读取表单请求发送的数据,已解析为 aardio 对象
var rst = loadSchema(data)
response.write({
"status": 0,
"data": rst
})
};
["/sendPair"] = function(response,request){
//console.varDump(request)

91
res/bar.json Normal file
View File

@ -0,0 +1,91 @@
{
"type": "table-view",
"trs": [
{
"background": "#F7F7F7",
"tds": [
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "模块",
"id": "u:19f87144bbea"
},
"id": "u:fddabc45cb59",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "最后一分钟状态",
"id": "u:420e9a9f9353"
},
"id": "u:6ffa039534e7",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "最近一次状态",
"id": "u:2dfafcf526f9"
},
"id": "u:fe0dab630536",
"align": "center",
"valign": "middle"
}
],
"id": "u:37a706fd866d"
},
{
"tds": [
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "TT",
"id": "u:518882ea6114"
},
"id": "u:897aee319eb4",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "each",
"name": "items",
"items": {
"type": "tpl",
"tpl": "<div style='width: ${width}; height: ${height}; border-radius: 2px; background-color: ${color[0]}; box-shadow: 0 0 5px ${color[0]}, 0 0 10px ${color[0]} inset'></div>",
"style": {
"display": "inline-block",
"marginRight": "5px",
"marginBottom": "-5px"
}
}
},
"id": "u:4804d1216011",
"width": "80%",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "<div style='width: ${height}; height: ${height}; border-radius: 2px; background-color: ${items[59].color[0]}; box-shadow: 0 0 5px ${items[59].color[0]}, 0 0 10px ${items[59].color[0]} inset'></div>",
"id": "u:20d501a115fc"
},
"id": "u:ba272dd0e407",
"align": "center",
"valign": "middle"
}
],
"id": "u:42c47c152e5f"
}
],
"id": "u:18e5f253165a"
}

View File

@ -149,8 +149,29 @@
{
"type": "switch",
"label": "天通",
"option": "说明",
"name": "switch",
"mode": "inline",
"name": "switchTT",
"falseValue": false,
"trueValue": true,
"id": "u:bd2f8c0b2176",
"onEvent": {
"change": {
"weight": 0,
"actions": [
{
"ignoreError": false,
"actionType": "custom",
"script": "const buttonText = context.props.label + (!context.props.value?'开':'关');\ndoAction({\n actionType: 'ajax',\n args: {\n api: {\n url: '/sendData',\n method: 'post',\n data: {\n buttonLabel: buttonText\n },\n successMessage: '请求成功',\n errorMessage: '请求失败'\n }\n }\n});\n"
}
]
}
}
},
{
"type": "switch",
"label": "超短波",
"mode": "inline",
"name": "switchCDB",
"falseValue": false,
"trueValue": true,
"id": "u:bd2f8c0b2176",
@ -177,41 +198,183 @@
{
"type": "service",
"interval": 1500, // 1.5
silentPolling: true
"silentPolling": true,
"api": "/api/getStatus", // API
"data": {
"maxBarCnt":"60",
"width":"5px",
"height":"30px",
"powerdown":"#808080",
"alive":"#00ff00",
"dead":"#ff0000",
"items": [
//{"color": "#808080"},
//{"color": "#808080"},
//{"color": "#808080"},
//{"color": "#808080"},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
{"color": ["${powerdown}","${powerdown}","${powerdown}"]},
]
},
"body": [
//"schemaApi": "/loadSchema?schema=bar"
"body":[
{
"type": "table-view",
"trs": [
{
"background": "#F7F7F7",
"tds": [
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "模块",
"id": "u:19f87144bbea"
},
"id": "u:fddabc45cb59",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "最后一分钟状态",
"id": "u:420e9a9f9353"
},
"id": "u:6ffa039534e7",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "最近一次状态",
"id": "u:2dfafcf526f9"
},
"id": "u:fe0dab630536",
"align": "center",
"valign": "middle"
}
],
"id": "u:37a706fd866d"
},
{
"tds": [
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "TT",
"id": "u:518882ea6114"
},
"id": "u:897aee319eb4",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "each",
"name": "items",
"items": {
"type": "tpl",
"tpl": "<div style='width: ${width}; height: ${height}; border-radius: 2px; background-color: ${color[0]}; box-shadow: 0 0 5px ${color[0]}, 0 0 10px ${color[0]} inset' title='设备'></div><br><div style='width: ${width}; height: ${height}; border-radius: 2px; background-color: ${color[1]}; box-shadow: 0 0 5px ${color[1]}, 0 0 10px ${color[1]} inset' title='超短波'></div><br><div style='width: ${width}; height: ${height}; border-radius: 2px; background-color: ${color[2]}; box-shadow: 0 0 5px ${color[2]}, 0 0 10px ${color[2]} inset' title='${state}'></div>",
"tpl": "<div style='width: ${width}; height: ${height}; border-radius: 2px; background-color: ${color[0]}; box-shadow: 0 0 5px ${color[0]}, 0 0 10px ${color[0]} inset'></div>",
"style": {
"display": "inline-block",
"marginRight": "5px",
"marginBottom": "5px"
"marginBottom": "-5px"
}
}
}
"id": "u:4804d1216011",
"width": "80%",
"align": "center",
"valign": "middle"
},
{
"body": {
"type": "tpl",
"wrapperComponent": "",
"tpl": "<div style='width: ${height}; height: ${height}; border-radius: 2px; background-color: ${items[59].color[0]}; box-shadow: 0 0 5px ${items[59].color[0]}, 0 0 10px ${items[59].color[0]} inset'></div>",
"id": "u:20d501a115fc"
},
"id": "u:ba272dd0e407",
"align": "center",
"valign": "middle"
}
],
"id": "u:42c47c152e5f"
},
],
"id": "u:18e5f253165a"
}
]
,
"onEvent": {
"fetchInited": {
"actions": [
{
"actionType": "custom",
"script": "const colorMap=['#808080','#ff0000','#00ff00'];\n const ncolor = [colorMap[event.data.responseData.state[0]+1],colorMap[event.data.responseData.state[1]+1],colorMap[event.data.responseData.state[2]+1]];\n console.log(event.data.responseData.state,ncolor);\ncontext.props.data.items.push({'color':ncolor})\nif (context.props.data.items.length > context.props.data.maxBarCnt) {\n context.props.data.items.shift(); // Remove the oldest value\n};"
}
"script": "const colorMap=[context.props.data.powerdown,context.props.data.dead,context.props.data.alive];\n const ncolor = [colorMap[event.data.responseData.state[0]+1],colorMap[event.data.responseData.state[1]+1],colorMap[event.data.responseData.state[2]+1]];\n console.log(event.data.responseData.state,ncolor);\ncontext.props.data.items.push({'color':ncolor})\nif (context.props.data.items.length > context.props.data.maxBarCnt) {\n context.props.data.items.shift(); // Remove the oldest value\n};"
},
]
}
}