amis
amis copied to clipboard
baidu
如何统计inputtable 表格某一列数据，显示到界面。
实现场景：
我想统计inputtable 表格某一列数据，显示到界面。
存在的问题：
请简单描述你现在遇到的不符合预期的问题... 因为我编辑使用的是文本框，所以想使用change进行统计，但是我不知道如何更新，amisscope 这个字段我没有，并且我不知道如何在里面读取表格数据。
当前方案：
请粘贴你当前方案的完整 amis schema 代码...
{ "type": "input-table", "name": "oACommuting", "label": "", "columns": [ { "type": "text", "label": "报销金额", "name": "money", "id": "u:c6534bcd0382", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:6da7b421b322", "saveImmediately": false, "type": "input-text", "name": "Amount", "validations": { "isFloat": true }, "validationErrors": { "isFloat": "请输入正确的报销金额" }, "required": true, "onEvent": { "change": { "weight": 0, "actions": [ { "actionType": "custom", "script": "/* 自定义JS使用说明： \n * 1.动作执行函数doAction，可以执行所有类型的动作\n * 2.通过上下文对象context可以获取当前组件实例，例如context.props可以获取该组件相关属性\n * 3.事件对象event，在doAction之后执行event.stopPropagation = true;可以阻止后续动作执行\n*/\nvar money = 10;\n\nconsole.log(this.setState)\nconsole.log(this.oACommuting)\nfor (var index in this.oACommuting) {\n var m = this.oACommuting[index];\n\n if(!isNaN(m.Amount)){\n money = money + parseFloat(m.Amount);\n }\n};\ndoAction({\n "actionType": "setValue",\n "componentId": "myform",\n "value": {'money':'10'}\n});\n" } ] } } } }, { "type": "text", "label": "用途说明", "name": "desc", "id": "u:56b0fb5ce937", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:e4efb347a5c0", "type": "input-text", "name": "desc" } }, { "type": "text", "label": "发票类型", "name": "发票类型", "id": "u:62b283570987", "placeholder": "-", "quickEdit": { "mode": "popOver", "id": "u:f7b9218dbcf0", "type": "select", "name": "InvoiceType", "label": "", "options": [ { "label": "电子发票", "value": "电子发票" }, { "label": "纸质发票", "value": "纸质发票" } ], "multiple": false, "required": true } }, { "type": "text", "label": "发票号", "name": "number", "id": "u:e19bdb30182d", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:59917dc3bf5f", "type": "input-text", "required": true, "name": "InvoiceNumber" } } ], "addable": true, "editable": true, "removable": false, "strictMode": true, "id": "u:e3132c50e490", "columnsTogglable": false, "value": [ { "desc": "", "InvoiceType": "电子发票" } ], "needConfirm": false, "required": true }
{
"type": "page",
"title": "Hello world",
"body": [
{
"type": "form",
"title": "表单",
"data": {
"oACommuting": [
{
"desc": "",
"InvoiceType": "电子发票",
"Amount": "1.523"
},
{
"Amount": "2.588"
},
{
"Amount": "3.45645"
}
],
"sum": 1
},
"body": [
{
"label": "",
"type": "input-table",
"name": "oACommuting",
"id": "u:e3132c50e490",
"columns": [
{
"type": "text",
"label": "报销金额",
"name": "money",
"id": "u:c6534bcd0382",
"placeholder": "-",
"quickEdit": {
"mode": "inline",
"id": "u:6da7b421b322",
"saveImmediately": false,
"type": "input-text",
"name": "Amount",
"validations": {
"isFloat": true
},
"validationErrors": {
"isFloat": "请输入正确的报销金额"
},
"required": true
}
},
{
"type": "text",
"label": "用途说明",
"name": "desc",
"id": "u:56b0fb5ce937",
"placeholder": "-",
"quickEdit": {
"mode": "inline",
"id": "u:e4efb347a5c0",
"type": "input-text",
"name": "desc"
}
},
{
"type": "text",
"label": "发票类型",
"name": "发票类型",
"id": "u:62b283570987",
"placeholder": "-",
"quickEdit": {
"mode": "popOver",
"id": "u:f7b9218dbcf0",
"type": "select",
"name": "InvoiceType",
"label": "",
"options": [
{
"label": "电子发票",
"value": "电子发票"
},
{
"label": "纸质发票",
"value": "纸质发票"
}
],
"multiple": false,
"required": true
}
},
{
"type": "text",
"label": "发票号",
"name": "number",
"id": "u:e19bdb30182d",
"placeholder": "-",
"quickEdit": {
"mode": "inline",
"id": "u:59917dc3bf5f",
"type": "input-text",
"required": true,
"name": "InvoiceNumber"
}
}
],
"addable": true,
"editable": true,
"removable": false,
"strictMode": true,
"columnsTogglable": false,
"value": [
{
"desc": "",
"InvoiceType": "电子发票"
}
],
"needConfirm": false,
"required": true
},
{
"label": "调试用 数据域Json",
"type": "static",
"tpl": "<%=JSON.stringify(this)%>
-----------------------
",
"id": "u:0ccc82c736ab"
},
{
"label": "报销总金额",
"type": "static",
"tpl": "${oACommuting|pick:Amount|sum|round:1}",
"id": "u:cc139300bb25"
}
],
"id": "u:47ded88a88df"
}
],
"id": "u:f651c80f58ed"
}
拿去 给你调试了好久~~~ Amis很强大！！！ 参考资料 https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/expression https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/data-mapping#round https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/data-mapping#pick
编辑器 https://aisuda.github.io/amis-editor-demo/#/edit/0
但是做校验的时候 ，不行，比如有统计一列数据，然后小于某个文本框的值
那不是太简单了么 统计都出来了 搞个组件显示错误内容 比如 合计大于20
提交按钮搞成>20时候隐藏 或者禁止点击不就完了~~
还有其他方式 都可以实现~~~
{ "type": "page", "title": "Hello world", "body": [ { "type": "form", "title": "表单", "data": { "oACommuting": [ { "desc": "", "InvoiceType": "电子发票", "Amount": "1.523" }, { "Amount": "2.588" }, { "Amount": "3.45645" } ], "sum": 1 }, "body": [ { "label": "", "type": "input-table", "name": "oACommuting", "id": "u:e3132c50e490", "columns": [ { "type": "text", "label": "报销金额", "name": "money", "id": "u:c6534bcd0382", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:6da7b421b322", "saveImmediately": false, "type": "input-text", "name": "Amount", "validations": { "isFloat": true }, "validationErrors": { "isFloat": "请输入正确的报销金额" }, "required": true } }, { "type": "text", "label": "用途说明", "name": "desc", "id": "u:56b0fb5ce937", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:e4efb347a5c0", "type": "input-text", "name": "desc" } }, { "type": "text", "label": "发票类型", "name": "发票类型", "id": "u:62b283570987", "placeholder": "-", "quickEdit": { "mode": "popOver", "id": "u:f7b9218dbcf0", "type": "select", "name": "InvoiceType", "label": "", "options": [ { "label": "电子发票", "value": "电子发票" }, { "label": "纸质发票", "value": "纸质发票" } ], "multiple": false, "required": true } }, { "type": "text", "label": "发票号", "name": "number", "id": "u:e19bdb30182d", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:59917dc3bf5f", "type": "input-text", "required": true, "name": "InvoiceNumber" } } ], "addable": true, "editable": true, "removable": false, "strictMode": true, "columnsTogglable": false, "value": [ { "desc": "", "InvoiceType": "电子发票" } ], "needConfirm": false, "required": true }, { "label": "调试用 数据域Json", "type": "static", "tpl": "<%=JSON.stringify(this)%>-----------------------", "id": "u:0ccc82c736ab" }, { "label": "报销总金额", "type": "static", "tpl": "${oACommuting|pick:Amount|sum|round:1}", "id": "u:cc139300bb25" } ], "id": "u:47ded88a88df" } ], "id": "u:f651c80f58ed" }
拿去 给你调试了好久~~~ Amis很强大！！！ 参考资料 https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/expression https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/data-mapping#round https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/data-mapping#pick
编辑器 https://aisuda.github.io/amis-editor-demo/#/edit/0
大哥，像那种进销存，打开窗口选择相应的商品可以单选后者批量选择后返回到数据表单里怎么操作，包括名称、数量、单价、颜色等等，并且能自动计算总金额等该怎么做，谢谢大哥
{ "type": "page", "title": "Hello world", "body": [ { "type": "form", "title": "表单", "data": { "oACommuting": [ { "desc": "", "InvoiceType": "电子发票", "Amount": "1.523" }, { "Amount": "2.588" }, { "Amount": "3.45645" } ], "sum": 1 }, "body": [ { "label": "", "type": "input-table", "name": "oACommuting", "id": "u:e3132c50e490", "columns": [ { "type": "text", "label": "报销金额", "name": "money", "id": "u:c6534bcd0382", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:6da7b421b322", "saveImmediately": false, "type": "input-text", "name": "Amount", "validations": { "isFloat": true }, "validationErrors": { "isFloat": "请输入正确的报销金额" }, "required": true } }, { "type": "text", "label": "用途说明", "name": "desc", "id": "u:56b0fb5ce937", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:e4efb347a5c0", "type": "input-text", "name": "desc" } }, { "type": "text", "label": "发票类型", "name": "发票类型", "id": "u:62b283570987", "placeholder": "-", "quickEdit": { "mode": "popOver", "id": "u:f7b9218dbcf0", "type": "select", "name": "InvoiceType", "label": "", "options": [ { "label": "电子发票", "value": "电子发票" }, { "label": "纸质发票", "value": "纸质发票" } ], "multiple": false, "required": true } }, { "type": "text", "label": "发票号", "name": "number", "id": "u:e19bdb30182d", "placeholder": "-", "quickEdit": { "mode": "inline", "id": "u:59917dc3bf5f", "type": "input-text", "required": true, "name": "InvoiceNumber" } } ], "addable": true, "editable": true, "removable": false, "strictMode": true, "columnsTogglable": false, "value": [ { "desc": "", "InvoiceType": "电子发票" } ], "needConfirm": false, "required": true }, { "label": "调试用 数据域Json", "type": "static", "tpl": "<%=JSON.stringify(this)%>-----------------------", "id": "u:0ccc82c736ab" }, { "label": "报销总金额", "type": "static", "tpl": "${oACommuting|pick:Amount|sum|round:1}", "id": "u:cc139300bb25" } ], "id": "u:47ded88a88df" } ], "id": "u:f651c80f58ed" }
拿去 给你调试了好久~~~ Amis很强大！！！ 参考资料 https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/expression https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/data-mapping#round https://aisuda.bce.baidu.com/amis/zh-CN/docs/concepts/data-mapping#pick
编辑器 https://aisuda.github.io/amis-editor-demo/#/edit/0
@lvJianWu 可参照此方法，获取指定列统计数据：oACommuting|pick:Amount|sum
