用户组编辑框校验逻辑/数据源请求列sql错误提示

src/components/admin/userGroupDetailBox.jsx

@@ -6,14 +6,18 @@ const FormItem = Form.Item
 class DetailBox extends React.Component {
 
     okHandler = () => {
-        const { dispatch, userGroup} = this.props;
+        const { dispatch, userGroup, form } = this.props;
         const { newOne } = userGroup;
-        console.log(newOne.operate);
-        if(newOne.operate === 'create') {
-            dispatch({ type: 'userGroup/remoteAdd' });
-        }else if(newOne.operate === 'modify') {
-            dispatch({ type: 'userGroup/remoteModify' });
-        }
+
+        form.validateFields((err, values) => {
+            if(!err) {
+                if(newOne.operate === 'create') {
+                    dispatch({ type: 'userGroup/remoteAdd' });
+                }else if(newOne.operate === 'modify') {
+                    dispatch({ type: 'userGroup/remoteModify' });
+                }
+            }
+        })
     }
 
     hideBox = () => {
@@ -22,9 +26,10 @@ class DetailBox extends React.Component {
     }
 
     render() {
-        const { dispatch, userGroup } = this.props;
+        const { dispatch, userGroup, form } = this.props;
         const { newOne } = userGroup;
 
+        const { getFieldDecorator } = form;
         const formItemLayout = {
             labelCol: { span: 4 },
             wrapperCol: { span: 20 },
@@ -41,23 +46,36 @@ class DetailBox extends React.Component {
             >
                 <Form size='small'>
                     <FormItem label='用户组名' {...formItemLayout} >
-                        <Input
-                            placeholder="请输入用户组名称"
-                            value={newOne.name}
-                            onChange={(e) => {
-                                dispatch({ type: 'userGroup/setNewModelField', name: 'name', value: e.target.value });
-                            }}
-                        >
-                        </Input>
+                        {
+                            getFieldDecorator('groupName', {
+                                initialValue: newOne.name,
+                                rules: [{ required: true, whitespace: true, message: '用户组名不能为空' }],
+                            })(
+                                <Input
+                                    placeholder="请输入用户组名称"
+                                    // value={newOne.name}
+                                    onChange={(e) => {
+                                        dispatch({ type: 'userGroup/setNewModelField', name: 'name', value: e.target.value });
+                                    }}
+                                >
+                                </Input>
+                            )
+                        }
                     </FormItem>
                     <FormItem className='textarea-desc' label='描述' {...formItemLayout}>
-                        <Input.TextArea
-                            autosize={{ minRows: 2 }}
-                            value={newOne.description}
-                            onChange={(e) => {
-                                dispatch({ type: 'userGroup/setNewModelField', name: 'description', value: e.target.value });
-                            }}
-                        />
+                        {
+                            getFieldDecorator('description', {
+                                initialValue: newOne.description,
+                            })(
+                                <Input.TextArea
+                                    autosize={{ minRows: 2 }}
+                                    // value={newOne.description}
+                                    onChange={(e) => {
+                                        dispatch({ type: 'userGroup/setNewModelField', name: 'description', value: e.target.value });
+                                    }}
+                                />
+                            )
+                        }
                     </FormItem>
                 </Form>
             </Modal>
@@ -65,4 +83,4 @@ class DetailBox extends React.Component {
     }
 }
 
-export default connect(( { present: { userGroup } } ) => ({ userGroup }))(DetailBox)
+export default connect(( { present: { userGroup } } ) => ({ userGroup }))(Form.create()(DetailBox))

src/components/chartDesigner/charts/styleConfig.js

@@ -0,0 +1,44 @@
+/**
+ * 应用样式
+ */
+export default function(viewType, chartConfig) {
+    try {
+        let o;
+        switch(viewType) {
+            case 'bar': {
+                // o = barStyle(chartConfig);
+                break;
+            }
+            case 'pie': {
+                // o = pieStyle(chartConfig);
+                break;
+            }
+            case 'line': {
+                // o = lineStyle(chartConfig);
+                break;
+            }
+            case 'scatter': {
+                // o = scatterStyle(chartConfig);
+                break;
+            }
+            case 'aggregateTable': {
+                // o = aggregateTableStyle(chartConfig);
+                break;
+            }case 'dataView' : {
+                o = dataViewStyle(chartConfig);
+                break;
+            }
+            default:{
+                o = {};
+                break;
+            }
+        }
+        return o;
+    }catch(e) {
+        console.error(e);
+    }
+}
+
+function dataViewStyle(config) {
+    return config;
+}

src/components/dataSourceDetail/columnConfig.jsx

@@ -26,7 +26,7 @@ class DataSourceColumnConfig extends React.Component {
         super(props);
         this.state = {
             widths: [ 80, 300, 200, 100, 100 ],
-            visibleConfirm: false
+            visibleConfirm: false,
         }
     }
 
@@ -294,13 +294,15 @@ class DataSourceColumnConfig extends React.Component {
                                         autosize={{ minRows: 3 }}
                                         value={dataSourceDetail.target}
                                         onChange={(e) => {
-                                            dispatch({ type: 'dataSource/setInvalidSQL', value: false });
-                                            dispatch({ type: 'dataSourceDetail/setField', name: 'target', value: e.target.value });
+                                            dispatch({ type: 'dataSourceDetail/setFields', fields: [
+                                                { name: 'target', value: e.target.value },
+                                                { name: 'notice', value: '' }
+                                            ] });
                                         }}
                                     />
                                 </FormItem>
                                 <div className='buttons'>
-                                    <div className='errormessage' style={{ cursor: dataSourceDetail.invalidSQL ? 'text' : 'default', opacity: dataSourceDetail.invalidSQL ? '1' : '0' }}>未查询到列数据，请检查SQL是否正确</div>
+                                    <div className='errormessage'>{dataSourceDetail.notice}</div>
                                     <Tooltip
                                         title={
                                             <div>

src/components/dataSourceDetail/dataConnectConfig.jsx

@@ -63,6 +63,9 @@ class DataConnectConfig extends React.Component {
                                 { name: 'dbName', value: l.dbName },
                                 { name: 'userName', value: l.userName },
                                 { name: 'password', value: l.password },
+                                { name: 'target', value: '' },
+                                { name: 'columns', value: [] },
+                                { name: 'notice', value: '' },
                             ] });
                         }}
                     >

src/models/dataSourceDetail.js

@@ -23,6 +23,7 @@ export default {
             password: null,
             description: '',
             group: '-1',
+            notice: '',
             columns: [],
         },
         code: null,
@@ -41,6 +42,7 @@ export default {
         password: null,
         description: '',
         group: '-1',
+        notice: '',
         columns: [],
     },
     reducers: {
@@ -81,10 +83,6 @@ export default {
             let newState = Object.assign({}, state, { dirty });
             return newState;
         },
-        setInvalidSQL(state, action) {
-            const { value } = action;
-            return { ...state, invalidSQL: value };
-        },
     },
     effects: {
         *importColumns(action, { select, call, put }) {
@@ -122,7 +120,6 @@ export default {
                             filterable: true,
                         }
                     });
-                    yield put({ type: 'setInvalidSQL', value: columns.length === 0 });
                     // yield put({ type: 'setField', name: 'columns', value: columns });
                     if(cover) {
                         yield put({ type: 'setField', name: 'columns', value: columns });
@@ -136,16 +133,23 @@ export default {
                                 mergeColumns.push(c); 
                             }
                         });
-                        yield put({ type: 'setField', name: 'columns', value: mergeColumns });
+                        yield put({ type: 'setFields', fields: [
+                            { name: 'columns', value: mergeColumns },
+                            { name: 'notice', value: '' }
+                        ] });
                     }
                 }else {
-                    yield put({ type: 'setInvalidSQL', value: true });
-                    yield put({ type: 'setField', name: 'columns', value: [] });
+                    yield put({ type: 'setFields', fields: [
+                        { name: 'columns', value: [] },
+                        { name: 'notice', value: res.err || res.data.msg }
+                    ] });
                 }
             }catch(e) {
-                console.log(body)
-                yield put({ type: 'setInvalidSQL', value: true });
-                yield put({ type: 'setField', name: 'columns', value: [] });
+                console.error(body, e)
+                yield put({ type: 'setFields', fields: [
+                    { name: 'columns', value: [] },
+                    { name: 'notice', value: e }
+                ] });
                 message.error('请求列数据错误: ' + e);
             }
         },

src/models/userGroup.js

@@ -162,8 +162,7 @@ export default {
                 });
                 if(!res.err && res.data.code > 0) {
                     yield put({ type: 'modify', group: newOne });
-                    // yield put({ type: 'setNewModelField', name: 'visibleBox', value: false });
-                    // yield put({ type: 'resetNewModel' });
+                    yield put({ type: 'setNewModelField', name: 'visibleDetailBox', value: false });
                     message.success('修改成功');
                 }else {
                     message.error('修改失败: ' + (res.err || res.data.msg));