weaver_trunk_cli/pc4mobx/prj/components/Demo.js

121 lines
3.3 KiB
JavaScript
Raw Normal View History

2023-03-08 15:22:38 +08:00
import React from 'react'
import { WeaDraggable ,WeaBrowser,WeaInput} from 'ecCom';
import { Row, Col } from 'antd';
import jQuery from 'jquery';
import { observable, action } from 'mobx';
import { inject, observer} from 'mobx-react';
import {WeaForm, WeaSwitch} from 'comsMobx';
import {WeaSearchGroup, WeaFormItem} from 'ecCom';
import {Button} from 'antd';
const datas = {
"condition": [
{
"title": "基本信息",
"items": [
{
"colSpan": 2,
"conditionType": "INPUT",
'rules': 'required|string',
"domkey": [
"resourcename"
],
"fieldcol": 12,
"isQuickSearch": true,
"label": "姓名",
"labelcol": 6,
"value": "",
"viewAttr": 2
},
{
colSpan:2,
"fieldcol": 12,
"labelcol": 6,
conditionType:"SCOPE",
domkey:
["seclevel", "seclevelTo"],
endValue:100,
isQuickSearch:false,
label:"安全级别",
startValue:'0',
viewAttr:3,
precision: 0,
min:[0, 10],
max:[10, 1000],
},
{
colSpan:2,
"fieldcol": 12,
"labelcol": 6,
conditionType:"TIMERANGEPICKER",
domkey:
["starttime", "endtime"],
label:"时间区间",
starttime:'14:50',
endtime:"15:30",
viewAttr:3,
'rules': 'required|string', // 校验规则
},
],
"defaultshow": true
}
]
}
class DemoStore {
@observable form = new WeaForm();
@action
getFormParams() {
return this.form.getFormParams();
}
}
const demoStore = new DemoStore();
@observer
export default class Main extends React.Component{
constructor(props) {
super(props);
}
componentDidMount() {
const conditioninfo = datas.condition;
const {form} = demoStore;
form.initFormFields(conditioninfo);
}
onChange(data) {
}
getSearchs() {
const conditioninfo = datas.condition;
const { form } = demoStore;
const {isFormInit} = form;
let group = [];
isFormInit && conditioninfo.map((c,i) =>{
let items = [];
c.items.map((field,index) => {
items.push({
com:(<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@ob84zg@${index}`}
label={`${field.label}`}
labelCol={{span: `${field.labelcol}`}}
error={form.getError(field)}
wrapperCol={{span: `${field.fieldcol}`}}>
<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@rrqhxt@${index}`} fieldConfig={field} form={form} onChange={this.onChange.bind(this)}/>
</WeaFormItem>),
colSpan:1
})
});
group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@k6q0d5@${i}`} needTigger={true} title={c.title} showGroup={c.defaultshow} items={items}/>)
});
return group;
}
render() {
const { form } = demoStore;
return (<div>
{this.getSearchs()}
<br/>
<div className="align-center"><Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ju1ve7`} onClick={()=>{}}>打印数据</Button><Button ecId={`${this && this.props && this.props.ecId || ''}_Button@3g13h1`} onClick={()=> form.reset()}></Button></div>
</div>)
}
};