zerod 0.6.0 → 0.6.3

package/components/Zform/index.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import { Form, Modal, Input, Button, Row, Col, message, ConfigProvider } from 'antd';
 import zh_CN from 'antd/lib/locale-provider/zh_CN';
 import PropTypes from 'prop-types';
@@ -227,7 +228,7 @@ export const Zform = Form.create()(
                     let newValue = value;
                     if (this.props.momentFormat) {
                         const currentItem = formItems.find((item) => item.key === key);
-                        if (currentItem && currentItem.format) {
+                        if (currentItem && currentItem.format && !moment.isMoment(value)) {
                             const toMoment = (val, format) => {
                                 return moment(val, format);
                             };
@@ -245,7 +246,30 @@ export const Zform = Form.create()(
                     return newValue;
                 }
             },
+            setErrorsId(rootEl, valuesIdMap) {
+                setTimeout(() => {
+                    let root = rootEl || this.currRootEl;
+
+                    if (root) {
+                        if (root.localName === 'td') {
+                            root = root.parentElement;
+                        }
+                        // console.dir(root);
+                        Object.keys(valuesIdMap).forEach((key) => {
+                            const inputEl = root.querySelector(`#${key}`);
+                            let parEl = inputEl.parentElement;
+                            while (parEl && !(parEl.className || '').includes('ant-form-item-control')) {
+                                parEl = parEl.parentElement;
+                            }
+                            if (parEl) {
+                                parEl.querySelector('.ant-form-explain').id = valuesIdMap[key];
+                            }
+                        });
+                    }
+                }, 100);
+            },
             setFieldsValue: (vals) => {
+                this.valuesIdMap = {};
                 const values = vals || this.props.values || this.props.formDefaultValues;
                 if (values) {
                     const saveSettingValues = { ...(this.state.saveSettingValues || {}), ...(values || {}) };
@@ -256,21 +280,32 @@ export const Zform = Form.create()(
                 const forms = !this.props.onlySetCurrentValues ? this.methods.getForms() : [this.form];
                 const otherFormItems = (this.props.getOtherFormItems && this.props.getOtherFormItems()) || [];
                 forms.forEach((form) => {
+                    const valuesIdMap = {};
                     const formItems = form.zformItems.concat(otherFormItems);
                     if (values && formItems.length) {
                         const newValues = {};
+                        const newFields = {};
                         formItems.forEach((field) => {
                             const key = field.key;
                             const value = values[key];
-                            if (value !== undefined) {
+                            if (value && typeof value === 'object' && !Array.isArray(value) && value.errors) {
+                                newFields[key] = {
+                                    value: this.methods.treatValue({ key, value: value.value, formItems }),
+                                    errors: value.errors.map((item) => new Error(item)),
+                                };
+                                valuesIdMap[key] = value.valueId;
+                            } else if (value !== undefined) {
                                 newValues[key] = this.methods.treatValue({ key, value, formItems });
                             }
                         });
-                        const allKeys = Object.keys(newValues);
-                        if (allKeys.length) {
-                            console.log(newValues, '----0');
+
+                        if (Object.keys(newValues).length) {
                             form.setFieldsValue(newValues);
                         }
+                        if (Object.keys(newFields).length) {
+                            form.setFields(newFields);
+                        }
+                        this.methods.setErrorsId(form.zform.currRootEl, valuesIdMap);
                     }
                 });
             },
@@ -482,6 +517,17 @@ export const Zform = Form.create()(
             }
             const_initItems.call(this, formItems, this.form, this.methods.changeFormItems, () => {
                 const_execAsync.call(this, (...rest) => {
+                    // const fields = formItems.reduce((tol, curr) => {
+                    //     const fieldErr = {};
+                    //     if (Array.isArray(curr.errorMsgs) && curr.errorMsgs.length) {
+                    //         const val = this.form.getFieldValue(curr.key);
+                    //         fieldErr[curr.key] = { value: val, errors: curr.errorMsgs };
+                    //     }
+                    //     return { ...tol, ...fieldErr };
+                    // }, {});
+                    // if (Object.keys(fields).length) {
+                    //     this.methods.setFields(fields);
+                    // }
                     this.form.formReady = true;
                     this.props.afterItemsRendered && this.props.afterItemsRendered(...rest);
                 });
@@ -536,6 +582,7 @@ export const Zform = Form.create()(
                     saveOptionsMapKey: this.form.saveOptionsMapKey,
                     getAsyncQueue: () => this.allAsync,
                     saveSettingValues: this.state.saveSettingValues || {},
+                    zform: this,
                 };
                 this.prevSettingValues = this.state.saveSettingValues;
                 this.prevPropsForm = this.props.form;
@@ -580,7 +627,13 @@ export const Zform = Form.create()(
             const items = this.getFormItems();
             const wrapperClassname = classNames('z-form', className || '');
             return this.setAntdConfigProvider(
-                <Form onSubmit={this.methods.onSubmit} className={wrapperClassname} style={style}>
+                <Form
+                    ref={(el) => {
+                        this.currRootEl = ReactDOM.findDOMNode(el);
+                    }}
+                    onSubmit={this.methods.onSubmit}
+                    className={wrapperClassname}
+                    style={style}>
                     <Row type="flex" className={`z-form-row z-form-label-${labelLayout} z-form-control-${controlSize}`}>
                         {items}
                     </Row>
@@ -599,7 +652,15 @@ export const Zform = Form.create()(
             );
         }
         setAntdConfigProvider(children) {
-            return <ConfigProvider locale={zh_CN}>{children}</ConfigProvider>;
+            return (
+                <ConfigProvider
+                    ref={(el) => {
+                        this.currRootEl = ReactDOM.findDOMNode(el);
+                    }}
+                    locale={zh_CN}>
+                    {children}
+                </ConfigProvider>
+            );
         }
     },
 );

package/components/Zform/style.scss

@@ -1,9 +1,10 @@
 @import "../../scss/common/z-form";
 :global {
-    // .z-form {
-    //     width: 86%;
-    //     margin: 0 auto !important;
-    // }
+ .z-form-control-small{
+	.ant-form-item-control{
+		line-height: 30px;
+	}
+ }
     .z-no-control-border {
         .ant-input,
         .ant-select-selection,

package/components/ZgapFilling/common.js

@@ -4,7 +4,7 @@ export function analysisTextTemplate(textTemplate) {
 }
 export function analysisTextTemplateForBLOCK(textTemplate) {
     let texts = textTemplate;
-    const placeRules = textTemplate.match(/<(div)[^>]*?>(?:<(div)[^>]*?>[\s\S]*?<\/\2>|[\s\S])*?<\/\1>/g);
+    const placeRules = textTemplate.match(/<(div)[^>]*?>(?:<(div)[^>]*?>(?:<(div)[^>]*?>[\s\S]*?<\/\3>|[\s\S])*?<\/\2>|[\s\S])*?<\/\1>/g);
     const blocks = [];
     let controls = [];
     if (placeRules) {
@@ -203,3 +203,6 @@ export function getControlDefaultValue({ blocks }) {
     }
     return defaultValue;
 }
+
+
+

package/components/Zinfo/ColInfoItem.jsx

@@ -1,17 +1,24 @@
 import React from 'react';
-// import { Col } from 'antd';
+import { Icon, Popover } from 'antd';
 import ZpageLoading from '../ZpageLoading';
 import ZtextBreak from '../ZtextBreak';
 
 class ColInfoItem extends React.PureComponent {
     static defaultProps = {
         item: {},
+        data: {},
     };
 
     state = {
         loading: this.props.loading,
         item: this.props.item,
+        data: {},
+        dataErrors: {},
     };
+
+    componentDidMount() {
+        this.methods.disponseData();
+    }
     componentDidUpdate(prevProps) {
         if (this.props.item !== prevProps.item) {
             this.setState({
@@ -19,10 +26,12 @@ class ColInfoItem extends React.PureComponent {
                 loading: this.props.loading,
             });
         }
+        if (this.props.data !== prevProps.data) {
+            this.methods.disponseData();
+        }
     }
     render() {
-        const { data } = this.props;
-        const { item } = this.state;
+        const { item, data, dataErrors } = this.state;
         const control = this.state.loading ? (
             <span>加载中...</span>
         ) : typeof item.control === 'function' ? (
@@ -30,8 +39,9 @@ class ColInfoItem extends React.PureComponent {
         ) : (
             data[item.key]
         );
+        const isError = Array.isArray(dataErrors[item.key]) && dataErrors[item.key].length;
         return (
-            <div className="z-info">
+            <div className={`z-info ${isError ? 'z-info-error' : ''}`}>
                 {item.label !== false ? (
                     <div
                         className="z-info-left z-info-left-content"
@@ -41,12 +51,41 @@ class ColInfoItem extends React.PureComponent {
                 ) : null}
                 <div className="z-info-right z-info-right-content">
                     <ZpageLoading showLoading={this.state.loading} size="small" />
+                    {isError ? (
+                        <Popover
+                            content={
+                                <div>
+                                    {dataErrors[item.key].map((msg) => {
+                                        return <p key={msg}>{msg}</p>;
+                                    })}
+                                </div>
+                            }
+                            title="错误信息">
+                            <Icon type="warning" className="error-info-icon" />
+                        </Popover>
+                    ) : null}
                     {typeof control === 'string' ? <ZtextBreak text={control} /> : control}
                 </div>
             </div>
         );
     }
     methods = {
+        disponseData: () => {
+            const data = {};
+            const dataErrors = {};
+            Object.keys(this.props.data).forEach((key) => {
+                const value = this.props.data[key];
+                data[key] = value;
+                if (value && typeof value === 'object' && !Array.isArray(value) && value.errors) {
+                    data[key] = value.value;
+                    dataErrors[key] = value.errors;
+                }
+            });
+            this.setState({
+                data,
+                dataErrors,
+            });
+        },
         showLoading: (show) => {
             this.setState({
                 loading: show,

package/components/Zinfo/index.jsx

@@ -16,15 +16,15 @@ class Zinfo extends React.PureComponent {
     };
     static defaultProps = {
         items: [
-            {
-                lable: '字段名',
-                key: 'name',
-                span: null,
-                render: () => {
-                    return (value, record) => <span>{value}</span>;
-                },
-                width: '160px',
-            },
+            // {
+            //     lable: '字段名',
+            //     key: 'name',
+            //     span: null,
+            //     render: () => {
+            //         return (value, record) => <span>{value}</span>;
+            //     },
+            //     width: '160px',
+            // },
         ],
         fieldValue: {},
         colCount: 2,

package/components/Zinfo/style.scss

@@ -16,11 +16,22 @@
             margin-bottom: -1px;
         }
         .z-info-right-content {
+            position: relative;
             border-right: 1px solid $border-color;
             margin-right: -1px;
             overflow: hidden;
+            .error-info-icon{
+                margin-right: 10px;
+                font-size: 16px;
+                vertical-align: middle;
+            }
+        }
+        .z-info-error{
+            .z-info-left-content,
+            .z-info-right-content {
+               color: #F52833;
+            }
         }
-    
     }
     .z-info-col + .z-info-col {
         .z-info-left-content,

package/components/ZliveForm/FormGroup.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, useImperativeHandle, useCallback } from 'react';
+import React, { useState, useEffect, useRef, useImperativeHandle, useCallback, useMemo } from 'react';
 import ReactDOM from 'react-dom';
 import Zform from '../Zform';
 import FormContext from './FormContext';
@@ -79,7 +79,24 @@ const FormGroup = React.memo(
                     return firstShow;
                 },
             }));
-
+            const groupTitle = useMemo(() => {
+                let title = null;
+                let labelShowTag = group.labelShowTag;
+                if (typeof labelShowTag !== 'number') {
+                    labelShowTag = 1;
+                }
+                switch (labelShowTag) {
+                    case 0:
+                        title = null;
+                        break;
+                    case 2:
+                        title = group.name;
+                        break;
+                    default:
+                        title = <ZpanelTitle>{group.name}</ZpanelTitle>;
+                }
+                return title;
+            }, [group.labelShowTag, group.name]);
             const [groupAttr, setGroupAttr] = useState({});
             return firstShow ? (
                 <Col
@@ -90,14 +107,12 @@ const FormGroup = React.memo(
                         domRef.current = ReactDOM.findDOMNode(el);
                     }}>
                     <div className={`z-panel z-view-form-panel ${className || ''}`}>
-                        {group.panelHeaderShow ? (
+                        {groupTitle || group.panelHeaderShow ? (
                             <div className="z-panel-heading z-flex-space-between z-flex-wrap">
                                 <div className="z-flex-items-v-center">
-                                    {typeof titleLeftRender === 'function' ? (
-                                        titleLeftRender(group, groupAttr, setGroupAttr)
-                                    ) : (
-                                        <ZpanelTitle>{group.name}</ZpanelTitle>
-                                    )}
+                                    {typeof titleLeftRender === 'function'
+                                        ? titleLeftRender(group, groupAttr, setGroupAttr)
+                                        : groupTitle}
                                 </div>
                                 <div className="z-flex-items-v-center">
                                     {typeof titleRightRender === 'function' &&
@@ -108,6 +123,7 @@ const FormGroup = React.memo(
                         <div className={group.groupLayout === 'horizontal' ? 'z-flex-1' : 'z-padding-15'}>
                             <MyForm
                                 group={group}
+                                controlSize={group.controlSize}
                                 onSubmit={onSubmit}
                                 onValidated={onValidated}
                                 labelLayout={labelLayout || 'inline'}

package/components/ZliveForm/common.js

@@ -40,10 +40,10 @@ export const labelShowTags = [
         label: '默认组名样式',
         value: 1,
     },
-    // {
-    //     label: '修饰符组名样式',
-    //     value: 2,
-    // },
+    {
+        label: '组名样式2',
+        value: 2,
+    },
 ];
 //以 "seq" 字段排序
 function sortList(o1, o2) {
@@ -165,6 +165,7 @@ export function getGroupItem(opt = {}, index) {
         config: groupConfig,
         hidden: group.hidden,
         show: opt.linkages === null ? index === 0 : !group.hidden,
+        controlSize: opt.controlSize,
     };
 }
 //从formData生成group数据
@@ -207,6 +208,7 @@ export function translateGroups({
                         doLinkageAction:
                             typeof doLinkageAction === 'function' ? doLinkageAction : doLinkageActionDefault,
                         groupLayout: formDataConf.groupLayout,
+                        controlSize: formDataConf.controlSize,
                         getExtendComponents,
                     },
                     index,
@@ -312,3 +314,12 @@ export function treeDataAddKey(tree = [], distMap, srcMap, isLeaf) {
           })
         : [];
 }
+
+export function getResponseData(result = {}, dataIndex = 'data') {
+    const dotLs = dataIndex.split('.');
+    let data = result[dotLs.shift()];
+    while (dotLs.length) {
+        data = data[dotLs.shift()];
+    }
+    return data;
+}

package/components/ZliveForm/controls.js

@@ -8,7 +8,7 @@ import moment from 'moment';
 import MapChooseAddress from './liveFormControls/ZmapChooseAddress';
 import TreeSelectLoader from './liveFormControls/TreeSelectLoader';
 import CascaderLoader from './liveFormControls/CascaderLoader';
-import { treeDataAddKey } from './common';
+import { treeDataAddKey, getResponseData } from './common';
 import UsersSelection from './liveFormControls/UsersSelection';
 import CurrentUserInfo from './liveFormControls/CurrentUserInfo';
 import ZsearchInput from './liveFormControls/ZsearchInput';
@@ -101,15 +101,6 @@ function paseFieldConfig(e, needDefault) {
     return config;
 }
 
-function getResponseData(result = {}, dataIndex = 'data') {
-    const dotLs = dataIndex.split('.');
-    let data = result[dotLs.shift()];
-    while (dotLs.length) {
-        data = data[dotLs.shift()];
-    }
-    return data;
-}
-
 function selectControl(controlName) {
     return function (e = {}, linkages, getGroupsFn = () => [], opt = {}, requestQuery = {}, currentForm) {
         //当isAsync为true,并且selectionsType是异步类型,就强制异步请求
@@ -146,7 +137,14 @@ function selectControl(controlName) {
                     dropdownMatchSelectWidth: false,
                     ...others,
                     ...opt,
-                    selectList,
+                    selectList: config.optionShowValue
+                        ? selectList.map((item) => {
+                              return {
+                                  ...item,
+                                  label: item.value !== item.label ? `${item.value}.${item.label}` : item.label,
+                              };
+                          })
+                        : selectList,
                     onChange: (...rest) => {
                         (typeof e.doLinkageAction === 'function' ? e.doLinkageAction : doLinkageAction)({
                             ages: linkages,

package/components/ZliveForm/index.jsx

@@ -24,7 +24,7 @@ import { getGroupItem, pareLinkages, removeSomeLinkage, labelShowTags } from './
 import ZfullLayer from '../ZfullLayer';
 import AddTagName from './liveFormActions/AddTagName';
 import ZliveFormMultiRow from '../ZliveFormMultiRow';
-const formDataConfigkeys = ['groupLayout', 'initialValueApi'];
+const formDataConfigkeys = ['groupLayout', 'initialValueApi', 'controlSize'];
 //校验、提取最新的formData数据
 function commitFormData(formViewerRef, layoutFormRef, linkageRef, onSave) {
     layoutFormRef.current.validateFields((errors, values) => {
@@ -409,10 +409,35 @@ function useGetItems(
                 initialValue: 'vertical',
             }),
         },
+        {
+            key: 'controlSize',
+            label: '表单尺寸',
+            span: 3,
+            show: false,
+            labelFocused: true,
+            render: (form, changeFormItems) =>
+                controls['3'].getControl(
+                    {
+                        config: {
+                            selectList: [
+                                { label: '大', value: 'large' },
+                                { label: '中', value: 'default' },
+                                { label: '小', value: 'small' },
+                            ],
+                        },
+                    },
+                    undefined,
+                    undefined,
+                    {},
+                ),
+            options: controls['3'].getOptions({
+                initialValue: 'default',
+            }),
+        },
         {
             key: 'initialValueApi',
             label: '异步获取表单初始值的后台接口',
-            span: 21,
+            span: 18,
             show: false,
             labelFocused: true,
             hiddenRendering: true,

package/components/ZliveForm/liveFormActions/AddTagName.jsx

@@ -8,6 +8,8 @@ const defaultTags = [
     { label: '整行展示字段', value: '3' },
     { label: 'ZliveInfoViewer里面强制展示字段', value: '4' },
     { label: 'ZliveInfoViewer里面强制隐藏字段', value: '5' },
+    { label: 'ZliveInfoViewer里面显示选项', value: '6' },
+    { label: 'ZliveInfoViewer里面Popover查看可选项', value: '7' },
 ];
 const colors = ['#F8AD3A', '#01D0A2', '#3277FA', '#B94354', '#7469F1'];
 const AddTagName = React.memo(

package/components/ZliveForm/liveFormActions/fieldTypeProperties/3_select.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { getControl, getOptions } from '../../../Zform/controls';
 import { itemsFromTree } from '../../../zTool';
-import { getCorresFormItem, urlRules } from './common';
+import { getCorresFormItem, urlRules, getSwitchOpt } from './common';
 import ZselectInput from '../../liveFormControls/ZselectInput';
 import RequestConfigBtn from '../../liveFormControls/RequestConfigBtn';
 //下拉、单选框/多选框的属性
@@ -237,6 +237,7 @@ export function getSelectCommonProperties({ itemsRef, controlList, formItemsLink
         ...getSelectionProperties({ itemsRef, controlList, formItemsLinkAction }),
         ...getSelectListFieldNamesProperties({ itemsRef, controlList, formItemsLinkAction }),
         ...getNotFoundContentProperties({ itemsRef, controlList, formItemsLinkAction }),
+       
     ];
 }
 export default {
@@ -263,6 +264,13 @@ export default {
                 },
                 options: getOptions({ required: true, initialValue: 'single' }),
             },
+            {
+                key: 'optionShowValue',
+                show: false,
+                label: '是否选项的值与Label一起显示',
+                labelFocused: true,
+                ...getSwitchOpt({ initialValue: false }),
+            },
             ...getSelectCommonProperties({ itemsRef, controlList, formItemsLinkAction }),
             ...getMaxSelectProperties({ itemsRef, controlList, formItemsLinkAction }),
         ];

package/components/ZliveForm/liveFormActions/fieldTypeProperties/8_checkbox.js

@@ -1,12 +1,20 @@
 import React from 'react';
 import { getSelectCommonProperties, getMaxSelectProperties } from './3_select';
 import { getControl, getOptions } from '../../../Zform/controls';
+import { getSwitchOpt } from './common';
 export default {
     label: '多选框',
     value: 8,
     getFieldPropertiesFormItems({ formItemsRef: itemsRef, componentList: controlList, formItemsLinkAction }) {
         return [
             ...getSelectCommonProperties({ itemsRef, controlList, formItemsLinkAction }),
+            {
+                key: 'optionShowValue',
+                show: false,
+                label: '是否选项的值与Label一起显示',
+                labelFocused: true,
+                ...getSwitchOpt({ initialValue: false }),
+            },
             {
                 key: 'colCount',
                 show: false,

package/components/ZliveForm/liveFormActions/fieldTypeProperties/9_radio.js

@@ -1,12 +1,20 @@
 import React from 'react';
 import { getSelectCommonProperties } from './3_select';
 import { getControl, getOptions } from '../../../Zform/controls';
+import { getSwitchOpt } from './common';
 export default {
     label: '单选框',
     value: 9,
     getFieldPropertiesFormItems({ formItemsRef: itemsRef, componentList: controlList, formItemsLinkAction }) {
         return [
             ...getSelectCommonProperties({ itemsRef, controlList, formItemsLinkAction }),
+            {
+                key: 'optionShowValue',
+                show: false,
+                label: '是否选项的值与Label一起显示',
+                labelFocused: true,
+                ...getSwitchOpt({ initialValue: false }),
+            },
             {
                 key: 'colCount',
                 show: false,

package/components/ZliveFormMultiRow/index.jsx

@@ -21,6 +21,7 @@ const ZliveFormMultiRow = (props) => {
         disabled,
         getExtendComponents,
         onAdd,
+        controlSize,
     } = props;
     const [state, setState] = useState({ items: [], titleGroups: [] });
     const multiRowMethodsRef = useRef();
@@ -150,6 +151,7 @@ const ZliveFormMultiRow = (props) => {
     );
     return (
         <ZmultiRowFormControl
+            controlSize={controlSize}
             showAddButton={showAddButton}
             showRemoveButton={showRemoveButton}
             value={value}

package/components/ZliveInfoMultiRow/ColTd.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import PropTypes from 'prop-types';
-
+// import PropTypes from 'prop-types';
+import { Popover, Icon } from 'antd';
 import './style.scss';
 
 import ZpageLoading from '../ZpageLoading';
@@ -8,24 +8,17 @@ import ZpageLoading from '../ZpageLoading';
 export default class ColTd extends React.PureComponent {
     static defaultProps = {
         item: {},
-    };
-    methods = {
-        showLoading: (show) => {
-            this.setState({
-                loading: show,
-            });
-        },
-        getStateItem: () => this.state.item,
-        changeItem: (newItem = {}) => {
-            this.setState({
-                item: { ...this.state.item, ...newItem },
-            });
-        },
+        data: {},
     };
     state = {
         loading: this.props.loading,
         item: this.props.item,
+        data: {},
+        dataErrors: {},
     };
+    componentDidMount() {
+        this.methods.disponseData();
+    }
     componentDidUpdate(prevProps) {
         if (this.props.item !== prevProps.item) {
             this.setState({
@@ -33,22 +26,69 @@ export default class ColTd extends React.PureComponent {
                 loading: this.props.loading,
             });
         }
+        if (this.props.data !== prevProps.data) {
+            this.methods.disponseData();
+        }
     }
     render() {
-        const { data } = this.props;
-        const { item } = this.state;
+        const { item, data, dataErrors } = this.state;
+        const isError = Array.isArray(dataErrors[item.key]) && dataErrors[item.key].length;
         const control = this.state.loading ? (
             <span>加载中...</span>
-        ) : typeof item.control == 'function' ? (
+        ) : typeof item.control === 'function' ? (
             item.control(data[item.key], data, item)
         ) : (
             data[item.key]
         );
         return (
             <td>
-                <div>{control}</div>
+                <div className={isError ? 'is-error' : ''}>
+                    {isError ? (
+                        <Popover
+                            content={
+                                <div>
+                                    {dataErrors[item.key].map((msg) => {
+                                        return <p key={msg}>{msg}</p>;
+                                    })}
+                                </div>
+                            }
+                            title="错误信息">
+                            <Icon type="warning" className="error-info-icon" />
+                        </Popover>
+                    ) : null}
+                    {control}
+                </div>
                 <ZpageLoading showLoading={this.state.loading} size="small" />
             </td>
         );
     }
+    methods = {
+        disponseData: () => {
+            const data = {};
+            const dataErrors = {};
+            Object.keys(this.props.data).forEach((key) => {
+                const value = this.props.data[key];
+                data[key] = value;
+                if (value && typeof value === 'object' && !Array.isArray(value) && value.errors) {
+                    data[key] = value.value;
+                    dataErrors[key] = value.errors;
+                }
+            });
+            this.setState({
+                data,
+                dataErrors,
+            });
+        },
+        showLoading: (show) => {
+            this.setState({
+                loading: show,
+            });
+        },
+        getStateItem: () => this.state.item,
+        changeItem: (newItem = {}) => {
+            this.setState({
+                item: { ...this.state.item, ...newItem },
+            });
+        },
+    };
 }

package/components/ZliveInfoMultiRow/style.scss

@@ -1,14 +1,22 @@
-:global{
-    .z-live-info-multi-row-body{
-        tr>td{
-            padding:10px 12px;
+:global {
+    .z-live-info-multi-row-body {
+        tr > td {
+            position: relative;
+            padding: 10px 12px;
             overflow: hidden;
-           
+            .is-error {
+                color: #f52833;
+            }
+            .error-info-icon {
+                margin-right: 10px;
+                font-size: 16px;
+                vertical-align: middle;
+            }
         }
     }
-    .z-live-info-multi-row-pagination{
+    .z-live-info-multi-row-pagination {
         display: flex;
         justify-content: flex-end;
         margin-top: 10px;
     }
-}
+}

package/components/ZliveInfoViewer/common.js

@@ -8,7 +8,8 @@ import { imgTypeRegExp } from '../ZliveForm/regExpression';
 import ZpdfViewer from '../ZpdfViewer';
 import MultiRowInfoControl from './MultiRowInfoControl';
 import ZgapFilling from '../ZgapFilling';
-
+import { treeDataAddKey, getResponseData } from '../ZliveForm/common';
+import { Popover } from 'antd';
 export function getPrivateImgs({ files, config }) {
     const privates = files.filter((item) => item.storage === 'PRIVATE');
     let asycnPromise = Promise.resolve();
@@ -69,7 +70,20 @@ export function valueAccuracy({
 }) {
     let value = '';
     let fileList = [];
-    let render = null;
+    let render = (text) => text;
+    const valLabel = formValues[`${field.fieldKey}Label`];
+    const val = formValues[field.fieldKey];
+    const strSyml = field.fieldType === 6 ? '/' : field.fieldType === 5 ? ' ~ ' : ' , ';
+    if (valLabel) {
+        value = Array.isArray(valLabel) ? valLabel.join(strSyml) : valLabel;
+    } else if (Array.isArray(val)) {
+        value = val[0] && (dataType.isObject(val[0]) || Array.isArray(val[0])) ? val : val.join(strSyml);
+    } else if (Array.isArray(config.selectList) && config.selectList.length) {
+        const selectItem = config.selectList.find((item) => item.value == val);
+        value = selectItem ? selectItem.label : val;
+    } else {
+        value = val;
+    }
     switch (field.fieldType) {
         case 11:
         case 16:
@@ -253,23 +267,85 @@ export function valueAccuracy({
             }
             break;
         }
-        default:
-            const valLabel = formValues[`${field.fieldKey}Label`];
-            const val = formValues[field.fieldKey];
-            const strSyml = field.fieldType === 6 ? '/' : field.fieldType === 5 ? ' ~ ' : ' , ';
-            if (valLabel) {
-                value = Array.isArray(valLabel) ? valLabel.join(strSyml) : valLabel;
-            } else if (Array.isArray(val)) {
-                if (val[0] && (dataType.isObject(val[0]) || Array.isArray(val[0]))) {
-                    value = val;
-                    Array.isArray(val);
-                } else {
-                    value = val.join(strSyml);
-                }
-            } else {
-                value = val;
+        case 3:
+        case 8:
+        case 9:
+            if (config.tagName.some((item) => ['6', '7'].includes(item.value))) {
+                const {
+                    selectionsType,
+                    // selectionsFromKey,
+                    selectionsUrl,
+                    selectionsQuery,
+                    selectListFieldNames,
+                    responseDataIndex,
+                } = config;
+                const isPopover = config.tagName.some((item) => ['7'].includes(item.value));
+                const getListVivew = function (selectList = [], optionShowValue) {
+                    return (text) => {
+                        const listView = (
+                            optionShowValue
+                                ? selectList.map((item) => {
+                                      return {
+                                          ...item,
+                                          label: item.value !== item.label ? `${item.value}.${item.label}` : item.label,
+                                      };
+                                  })
+                                : selectList
+                        ).map((item) => {
+                            return (
+                                <p className="z-text-darkGray" key={item.value}>
+                                    {item.label}
+                                </p>
+                            );
+                        });
+                        const textStyle = {};
+                        if (isPopover) {
+                            textStyle.paddingTop = '20px';
+                        } else {
+                            textStyle.marginBottom = '8px';
+                        }
+                        return (
+                            <div style={{ flex: 1 }}>
+                                <div style={textStyle}>{text}</div>
+                                {isPopover ? (
+                                    <Popover
+                                        overlayClassName="z-infoViewer-options-overlay"
+                                        content={<div>{listView}</div>}
+                                        title="可选项">
+                                        <div className="z-infoViewer-options-open">查看可选项</div>
+                                    </Popover>
+                                ) : (
+                                    <div className="z-infoViewer-options-wrapper">{listView}</div>
+                                )}
+                            </div>
+                        );
+                    };
+                };
+                render = () => {
+                    if (+selectionsType === 2) {
+                        return httpAjax(
+                            selectionsUrl.selectionsUrlMethod,
+                            selectionsUrl.selectionsUrl,
+                            {
+                                ...selectionsQuery,
+                            },
+                            selectionsUrl.requestConfig,
+                        ).then((re) => {
+                            const selectList = treeDataAddKey(
+                                getResponseData(re, responseDataIndex) || [],
+                                undefined,
+                                selectListFieldNames,
+                                undefined,
+                            );
+                            return getListVivew(selectList, config.optionShowValue);
+                        });
+                    }
+                    return getListVivew(config.selectList, config.optionShowValue);
+                };
             }
-            render = (text) => text;
+
+            break;
+        default:
     }
     return { value, render, fileList };
 }

package/components/ZliveInfoViewer/index.jsx

@@ -142,7 +142,7 @@ const InfoViewer = (props) => {
                                 : Array.isArray(config.tagName)
                                 ? config.tagName
                                 : [];
-
+                        config.tagName = tagName;
                         let fieldShowed = true;
                         if (tagName.some((item) => ['5'].includes(item.value))) {
                             //"5"强制隐藏
@@ -220,12 +220,33 @@ const InfoViewer = (props) => {
         <>
             {typeof children === 'function'
                 ? children({ groups, fieldValue })
-                : groups.map((g) => (
-                      <div key={g.name} className="z-infoViewer-group">
-                          {g.labelShowTag ? <ZpanelTitle className="z-margin-bottom-10">{g.name}</ZpanelTitle> : null}
-                          <Zinfo items={g.formItems} fieldValue={fieldValue} colCount={2} layoutType="freeCol"></Zinfo>
-                      </div>
-                  ))}
+                : groups.map((g) => {
+                      let title = null;
+                      let labelShowTag = g.labelShowTag;
+                      if (typeof labelShowTag !== 'number') {
+                          labelShowTag = 1;
+                      }
+                      switch (labelShowTag) {
+                          case 0:
+                              title = null;
+                              break;
+                          case 2:
+                              title = <div className="z-margin-bottom-10">{g.name}</div>;
+                              break;
+                          default:
+                              title = <ZpanelTitle className="z-margin-bottom-10">{g.name}</ZpanelTitle>;
+                      }
+                      return (
+                          <div key={g.name} className="z-infoViewer-group">
+                              {title}
+                              <Zinfo
+                                  items={g.formItems}
+                                  fieldValue={fieldValue}
+                                  colCount={2}
+                                  layoutType="freeCol"></Zinfo>
+                          </div>
+                      );
+                  })}
             {imgUrls.length
                 ? ReactDOM.createPortal(
                       <div

package/components/ZliveInfoViewer/style.scss

@@ -1,6 +1,47 @@
 @import '../../scss/common/z-info.scss';
-
+@import '../../scss/vars.scss';
 :global {
+    .z-infoViewer-options-overlay{
+        .ant-popover-inner-content{
+            max-height: calc(100vh - 60px);
+            overflow: auto;
+        }
+    }
+    .z-infoViewer-options-open {
+        display: block;
+        color: $--darkGray;
+        position: absolute;
+        top: 0;
+        right: 0;
+        padding: 4px 6px;
+        background-color: $--light-grey;
+        font-size: 12px;
+        line-height: 1em;
+    }
+    .z-infoViewer-options-wrapper {
+        border: 1px solid $--light-grey;
+        padding: 6px;
+        position: relative;
+        color: $--gray;
+        overflow: hidden;
+        &::after {
+            content: '可选项';
+            display: block;
+            color: $--darkGray;
+            position: absolute;
+            top: 0;
+            right: 0;
+            padding: 4px 6px;
+            background-color: $--light-grey;
+            font-size: 12px;
+            line-height: 1em;
+        }
+        p {
+            margin-top: 8px;
+            margin-bottom: 0;
+            margin-right: 30px;
+        }
+    }
     .z-infoViewer-group + .z-infoViewer-group {
         margin-top: 10px;
     }
@@ -28,14 +69,14 @@
     .z-infoViewer-file {
         width: 100%;
         margin-bottom: 0;
-        a{
+        a {
             color: $primary-color;
-           &:hover{
-            text-decoration: underline;
-           }
+            &:hover {
+                text-decoration: underline;
+            }
         }
     }
-    .z-infoViewer-imgs+.z-infoViewer-file{
+    .z-infoViewer-imgs + .z-infoViewer-file {
         margin-top: 20px;
     }
     .z-infoViewer-file + .z-infoViewer-file {

package/components/ZmainHOC/doc/rootRouter.md

@@ -2,15 +2,18 @@
 
 ```jsx
 import { getProcessEnv } from 'zerod/components/zTool/getProcessEnv';
-const { baserouter } = getProcessEnv();
+// const { baserouter } = getProcessEnv();
 import ZappHOC from 'zerod/components/ZappHOC';
+const routerType=  'history';
+const path = routerType==='hash'?window.location.hash.replace('#','') :window.location.pathname;
 export default ZappHOC({
     rootRoutes: [
         {
-            path: window.location.pathname,
+            path,
             component: Main,
         },
     ],
-    routerType: baserouter ? 'hash' : 'history',
+    routerType,
+    routerBasename:"/"
 });
 ```

package/components/ZmainHOC/index.jsx

@@ -166,6 +166,7 @@ export function ZmainHOC(pageConfig, mounted) {
             }
             //路由地址改变，关闭右边modal
             if (this.props.location.pathname !== prevProps.location.pathname) {
+                console.log(this.props.location.pathname,prevProps.location.pathname)
                 // //路由地址改变触发父窗口的消息事件
                 // if (window.appProtalWindow) {
                 // 	window.appProtalWindow &&
@@ -307,6 +308,7 @@ export function ZmainHOC(pageConfig, mounted) {
         sideMenuData = [];
         // 处理侧边导航数据
         setSideMenu = (sideMenu) => {
+            console.log(this.match.url)
             let menuData = sideMenu.menuData;
             let topOtherMenu = sideMenu.topOtherMenu || this.config.sideMenu.topOtherMenu;
             let bottomOtherMenu = sideMenu.bottomOtherMenu || this.config.sideMenu.bottomOtherMenu;

package/components/ZpageHeader/rootRouter.md

@@ -4,16 +4,18 @@
 
 // 这里渲染demo需要创建一个router根,  如果直接用在项目中的router则不需要
 import { getProcessEnv } from 'zerod/components/zTool/getProcessEnv';
+// const { baserouter } = getProcessEnv();
 import ZappHOC from 'zerod/components/ZappHOC';
-const { baserouter } = getProcessEnv();
-
+const routerType=  'history';
+const path = routerType==='hash'?window.location.hash.replace('#','') :window.location.pathname;
 export default ZappHOC({
     rootRoutes: [
         {
-            path: window.location.pathname,
+            path,
             component: Main,
         },
     ],
-    routerType: baserouter ? 'hash' : 'history',
+    routerType,
+    routerBasename:"/"
 });
 ```

package/components/zTool/index.js

@@ -233,6 +233,7 @@ export function parseJsonToObject(frontDef) {
     }
     return pare;
 }
+
 export const zTool = {
     ...ztool,
     BuildScroll,

package/package.json

@@ -1,19 +1,11 @@
 {
     "name": "zerod",
-    "version": "0.6.0",
+    "version": "0.6.3",
     "description": "react+antd+scss的扩展组件，结合zerod-admin-web脚手架使用",
     "author": "zgt",
     "main": "index.js",
     "module": "index.js",
-    "scripts": {
-        "login": "npm login --registry=http://172.16.8.10:8081/repository/hosted-npm/"
-    },
-    "repositories": [
-        {
-            "type": "git",
-            "url": "http://172.16.26.120/components/zerod-component-doc.git"
-        }
-    ],
+    "scripts": {},
     "dependencies": {
         "@loadable/component": "^5.14.1",
         "@esfaenza/pace": "^1.0.0",