提交 25ab75e7 authored 作者: 钟是志's avatar 钟是志

echart 组件支持 直接赋值option

上级 5f296890
import React, { useMemo } from 'react';
import ReactEcharts from 'echarts-for-react';
export default function EchartsDiy(props){
const { json, uuid, option, value } = props;
const opt = useMemo(() => {
return (value && typeof value === 'object' && Object.keys(value).length) ? value : option;
}, [value, option]);
// console.log(opt);
if(!opt){
return null;
}
return (
<ReactEcharts
style={{ height: json.height || 500 }}
key={uuid}
option={opt}
notMerge={true}
lazyUpdate={true}
theme={'theme_name'}
onEvents={{}}
/>
)
}
......@@ -83,6 +83,7 @@ import ButtonDiy from '@/webPublic/one_stop_public/tableCompon/Split_Index/Butto
import giveVarcharRules from '@/webPublic/one_stop_public/tableCompon/Split_Index/giveVarcharLength';
import getPopupContainer from '@/webPublic/one_stop_public/tableCompon/Split_Index/getPopupContainer';
import StepDiy from '@/webPublic/one_stop_public/tableCompon/Split_Index/StepDiy';
import EchartsDiy from '@/webPublic/one_stop_public/tableCompon/Split_Index/EchartsDiy';
/**
* 日期组件antd3.x有bug 详情见禅道 27152 毕业跟踪调查管理 毕业时间改为年级筛选
......@@ -162,9 +163,11 @@ export default class TableCom extends Component {
const { dispatch } = this.props;
const x = this.props.DataColumn.isShowModal;
x[fk] = true;
this.setState({
this.setState(
{
modalInit: data,
}, () => {
},
() => {
dispatch({
type: 'DataColumn/showModal',
payload: { isShowModal: x },
......@@ -176,8 +179,8 @@ export default class TableCom extends Component {
});
},
});
})
},
);
};
/**
......@@ -312,7 +315,7 @@ export default class TableCom extends Component {
return;
}
if (
!(this.dataFilter.includes(json.comName) || json.comName == 'TableSelect') &&
!(this.dataFilter.includes(json.comName) || json.comName === 'TableSelect') &&
json.isFormulaOnce
) {
return;
......@@ -320,7 +323,7 @@ export default class TableCom extends Component {
if (
!(
this.dataFilter.includes(json.comName) ||
json.comName == 'TableSelect' ||
json.comName === 'TableSelect' ||
(json.formula != null && json.formula != '')
)
) {
......@@ -404,7 +407,7 @@ export default class TableCom extends Component {
}
}
if (this.dataFilter.includes(json.comName) || json.comName == 'TableSelect') {
if (this.dataFilter.includes(json.comName) || json.comName === 'TableSelect') {
const obj2 = {
...obj,
...props.form.getFieldsValue(),
......@@ -713,7 +716,7 @@ export default class TableCom extends Component {
if (callback) {
const data = reqUrls[url].data;
if (json.optionType && json.optionType == 'func') {
if (json.optionType && json.optionType === 'func') {
const res = callback(data);
if (res != null && !(typeof res === 'function')) {
......@@ -727,7 +730,7 @@ export default class TableCom extends Component {
},
);
}
} else if (json.comName == 'Button') {
} else if (json.comName === 'Button') {
try {
callback(data);
} catch (e) {
......@@ -903,7 +906,7 @@ export default class TableCom extends Component {
if (!isChange) {
if (callback) {
const data = sqlKeys[sqlKey].data;
if (json.optionType && json.optionType == 'func') {
if (json.optionType && json.optionType === 'func') {
const res = callback(data);
if (res != null && !(typeof res === 'function')) {
this.setState(
......@@ -916,7 +919,7 @@ export default class TableCom extends Component {
},
);
}
} else if (json.comName == 'Button') {
} else if (json.comName === 'Button') {
try {
callback(data);
} catch (e) {
......@@ -1045,7 +1048,6 @@ export default class TableCom extends Component {
return 'norefeshxxxxxxxxxxxxxxxxxxxx';
};
getObjValues = () => {
const { isEdit, fatherObj, defaultValues, formKey, form, fatherCode } = this.props;
let obj = {};
......@@ -1064,7 +1066,7 @@ export default class TableCom extends Component {
};
}
return obj;
}
};
functionArguments = (column, callback) => {
const base52 = column.base52;
......@@ -1619,18 +1621,12 @@ export default class TableCom extends Component {
}
return <QRCode {...this.state.option} key={uuid} />;
}
if (json.comName == 'Echart') {
return (
<ReactEcharts
style={{ height: json.height || 500 }}
key={uuid}
option={this.state.option || {}}
notMerge={true}
lazyUpdate={true}
theme={'theme_name'}
onEvents={{}}
/>
);
if (json.comName === 'Echart') {
return this.props.form.getFieldDecorator(uuid, {
initialValue: '',
})(
<EchartsDiy json={json} uuid={uuid} option={this.state.option}/>
)
}
if (json.comName === 'Graph') {
return <Neo4jD3Com key={uuid} json={json} option={this.state.option || []} />;
......@@ -2115,9 +2111,9 @@ export default class TableCom extends Component {
if (dataColumn.isNull != null && !dataColumn.isNull) {
required = true;
}
if(Array.isArray(json.vlds)){
for(let item of json.vlds){
if(item.required){
if (Array.isArray(json.vlds)) {
for (let item of json.vlds) {
if (item.required) {
required = true; // 验证里面填了必填 则必填
}
}
......@@ -2590,12 +2586,8 @@ ${obj[dataColumn.base52]}
style={{
marginLeft: 5,
minHeight: get === 'mobile' ? '200px' : 'auto',
width:
get === 'mobile'
? 'auto'
: json.width,
width: get === 'mobile' ? 'auto' : json.width,
height: get === 'mobile' ? '' : json.height,
}}
/>
);
......@@ -3175,8 +3167,12 @@ ${obj[dataColumn.base52]}
}
}
const optDiy = Array.isArray(json?.options) ? json.options : Array.isArray(options) ? options : [];
if(dataColumn.base52 === 'KjWXQFIprRc'){
const optDiy = Array.isArray(json?.options)
? json.options
: Array.isArray(options)
? options
: [];
if (dataColumn.base52 === 'KjWXQFIprRc') {
// console.log(json, required, dataColumn, optDiy);
}
......@@ -3192,7 +3188,9 @@ ${obj[dataColumn.base52]}
},
],
})(
!optDiy.length ? <Input disabled={true} style={{ width: json.width }}/>:
!optDiy.length ? (
<Input disabled={true} style={{ width: json.width }} />
) : (
<Select
allowClear
showSearch
......@@ -3225,16 +3223,15 @@ ${obj[dataColumn.base52]}
}
{...otherProps}
>
{
optDiy.map(r => {
{optDiy.map(r => {
return (
<Option key={r.value} value={r.value}>
{r.label}
</Option>
);
})
}
</Select>,
})}
</Select>
),
);
if (
get === 'mobile' &&
......@@ -3441,13 +3438,12 @@ ${obj[dataColumn.base52]}
json.vlds && json.vlds.length > 0
? json.vlds
: [
{
required: required,
message: '请选择起止时间',
validator: (rule, value, callback) => {
let errors = [];
if(!value || !Array.isArray(value) || value.length !== 2){
if (!value || !Array.isArray(value) || value.length !== 2) {
// 移动端起止时间必须是个数组 且 length = 2
errors.push(new Error('请选择', rule.field));
}
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论