田强 / qx-common · Commits

Commit 78d8829f4d810f6b82a14040bd7fe3ef462ff285

Authored by qiang.tian
2 parents 07984f02 932e6104

Merge branch 'feature/dataflow' of http://gitlab.qgutech.com/tianqiang/qx-common… 

… into feature/dataflow
Inline Side-by-side
Showing 4 changed files with 72 additions and 78 deletions
1 { 1 {
2 "name": "@qx/common", 2 "name": "@qx/common",
3 - "version": "3.0.0-alpha.26", 3 + "version": "3.0.0-alpha.27",
4 "description": "A react library developed with dumi", 4 "description": "A react library developed with dumi",
5 "license": "MIT", 5 "license": "MIT",
6 "module": "dist/index.js", 6 "module": "dist/index.js",
@@ -88,29 +88,6 @@ interface ParameterSettingProps { @@ -88,29 +88,6 @@ interface ParameterSettingProps {
88 appId?: string; // 当前应用ID 88 appId?: string; // 当前应用ID
89 } 89 }
90 90
91 -const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {  
92 - console.log('onChange', e);  
93 - e.persist();  
94 - const { value } = e.target;  
95 - console.log('onChange value', value);  
96 - // if (!value) {  
97 - // setExpandedKeys(undefined);  
98 - // setAutoExpandParent(false);  
99 - // setSearchValue(value);  
100 - // return;  
101 - // }  
102 - // const newExpandedKeys = (list || [])  
103 - // .map((item) => {  
104 - // if (item.title.indexOf(value) > -1 || item.code.indexOf(value) > -1) {  
105 - // return getParentKey(item.id, treeData);  
106 - // }  
107 - // return null;  
108 - // })  
109 - // .filter((item, i, self) => item && self.indexOf(item) === i);  
110 - // setExpandedKeys(newExpandedKeys as React.Key[]);  
111 - // setSearchValue(value);  
112 - // setAutoExpandParent(true);  
113 -};  
114 91
115 92
116 93
@@ -129,6 +106,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -129,6 +106,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
129 inputKey, 106 inputKey,
130 nodeType, 107 nodeType,
131 } = props; 108 } = props;
  109 + const [searchValue, setSearchValue] = useState('');
  110 +
132 // const [form] = Form.useForm() 111 // const [form] = Form.useForm()
133 //判断数组是否只有一个子节点 112 //判断数组是否只有一个子节点
134 const checkShowAdd = (_data: any) => { 113 const checkShowAdd = (_data: any) => {
@@ -144,6 +123,15 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -144,6 +123,15 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
144 return true; 123 return true;
145 }; 124 };
146 125
  126 + const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
  127 + e.persist();
  128 + const { value } = e.target;
  129 + // if (!value) {
  130 + // setExpandedKeys(undefined);
  131 + // setAutoExpandParent(false);
  132 + setSearchValue(value);
  133 + };
  134 +
147 const getValueOptions = (item: any): ValueOptionProps[] | undefined => { 135 const getValueOptions = (item: any): ValueOptionProps[] | undefined => {
148 const widget = typeTranslateWidget(item.type); 136 const widget = typeTranslateWidget(item.type);
149 if (widget === 'userSelector') { 137 if (widget === 'userSelector') {
@@ -180,23 +168,28 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -180,23 +168,28 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
180 dataIndex: 'code', 168 dataIndex: 'code',
181 width: '150px', 169 width: '150px',
182 key: 'code', 170 key: 'code',
183 - render: (text, record) => (  
184 - < Form.Item  
185 - name={'code' + record.id}  
186 - style={{ margin: 0 }}  
187 - // initialValue={record.code}  
188 - >  
189 - <Input  
190 - draggable={true}  
191 - onDragStart={(event) => {  
192 - event.stopPropagation();  
193 - event.preventDefault();  
194 - }}  
195 - defaultValue={record.code}  
196 - bordered={false}  
197 - disabled={record.disabled} onBlur={(e) => handleChange(e, record, 'code')} />  
198 - </Form.Item >  
199 - ), 171 + render: (text, record) => {
  172 + const strTitle = (text as string) || '';
  173 + const index = strTitle.indexOf(searchValue);
  174 + return (
  175 + < Form.Item
  176 + name={'code' + record.id}
  177 + style={{ margin: 0 }}
  178 + // initialValue={record.code}
  179 + >
  180 + <Input
  181 + style={{ color: index > -1 && searchValue ? '#1890ff' : '' }}
  182 + draggable={true}
  183 + onDragStart={(event) => {
  184 + event.stopPropagation();
  185 + event.preventDefault();
  186 + }}
  187 + defaultValue={record.code}
  188 + bordered={false}
  189 + disabled={record.disabled} onBlur={(e) => handleChange(e, record, 'code')} />
  190 + </Form.Item >
  191 + )
  192 + },
200 }, 193 },
201 { 194 {
202 title: ( 195 title: (
@@ -208,23 +201,28 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -208,23 +201,28 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
208 dataIndex: 'title', 201 dataIndex: 'title',
209 width: '112px', 202 width: '112px',
210 key: 'title', 203 key: 'title',
211 - render: (text, record) => (  
212 - <Form.Item  
213 - name={'title' + record.id}  
214 - style={{ margin: 0 }}  
215 - // initialValue={record.title}  
216 - >  
217 - <Input  
218 - draggable={true}  
219 - onDragStart={(event) => {  
220 - event.stopPropagation();  
221 - event.preventDefault();  
222 - }}  
223 - defaultValue={record.title}  
224 - bordered={false}  
225 - disabled={record.disabled} onBlur={(e) => handleChange(e, record, 'title')} />  
226 - </Form.Item>  
227 - ), 204 + render: (text, record) => {
  205 + const strTitle = (record.title as string) || '';
  206 + const index = strTitle.indexOf(searchValue);
  207 + return (
  208 + <Form.Item
  209 + name={'title' + record.id}
  210 + style={{ margin: 0 }}
  211 + // initialValue={record.title}
  212 + >
  213 + <Input
  214 + style={{ color: index > -1 && searchValue ? '#1890ff' : '' }}
  215 + draggable={true}
  216 + onDragStart={(event) => {
  217 + event.stopPropagation();
  218 + event.preventDefault();
  219 + }}
  220 + defaultValue={record.title}
  221 + bordered={false}
  222 + disabled={record.disabled} onBlur={(e) => handleChange(e, record, 'title')} />
  223 + </Form.Item>
  224 + )
  225 + },
228 }, 226 },
229 { 227 {
230 title: ( 228 title: (
@@ -275,7 +273,6 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -275,7 +273,6 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
275 isMultiple={false} 273 isMultiple={false}
276 colsTree={props.nodeItem} 274 colsTree={props.nodeItem}
277 showFieldOpt={!(nodeType === 'START')} 275 showFieldOpt={!(nodeType === 'START')}
278 - // onChange={debounce((val) => handleField(val), 700)}  
279 onChange={(val) => handleChangeField(val, record)} 276 onChange={(val) => handleChangeField(val, record)}
280 popupOnBody={true} 277 popupOnBody={true}
281 inputDis={true} 278 inputDis={true}
@@ -464,7 +461,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -464,7 +461,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
464 ? moment(qxProps.min) 461 ? moment(qxProps.min)
465 : undefined 462 : undefined
466 } 463 }
467 - format={formatEnum[qxProps?.format]} 464 + format={formatEnum[qxProps?.format] || 'YYYY-MM-DD'}
468 // style={{ width: '110px' }} 465 // style={{ width: '110px' }}
469 showTime 466 showTime
470 onChange={(e) => handleChange(e, record, 'qxProps-min')} 467 onChange={(e) => handleChange(e, record, 'qxProps-min')}
@@ -475,11 +472,11 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -475,11 +472,11 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
475 size='small' 472 size='small'
476 bordered={false} 473 bordered={false}
477 defaultValue={ 474 defaultValue={
478 - qxProps?.min 475 + qxProps?.max
479 ? moment(qxProps.max) 476 ? moment(qxProps.max)
480 : undefined 477 : undefined
481 } 478 }
482 - format={formatEnum[qxProps?.format]} 479 + format={formatEnum[qxProps?.format] || 'YYYY-MM-DD'}
483 // style={{ width: '110px' }} 480 // style={{ width: '110px' }}
484 showTime 481 showTime
485 onChange={(e) => handleChange(e, record, 'qxProps-max')} 482 onChange={(e) => handleChange(e, record, 'qxProps-max')}
@@ -494,7 +491,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -494,7 +491,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
494 bordered={false} 491 bordered={false}
495 placeholder="格式" 492 placeholder="格式"
496 popupMatchSelectWidth={false} 493 popupMatchSelectWidth={false}
497 - defaultValue={qxProps.format || undefined} 494 + defaultValue={qxProps?.format || 'YEAR_DATE'}
498 onSelect={(e) => 495 onSelect={(e) =>
499 handleChange(e, record, 'qxProps-format') 496 handleChange(e, record, 'qxProps-format')
500 } 497 }
@@ -698,8 +695,6 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -698,8 +695,6 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
698 _newTreeData.splice(dropIndex, 0, todoData[0]); // 插入 695 _newTreeData.splice(dropIndex, 0, todoData[0]); // 插入
699 } 696 }
700 const _newData = generateTreeData(_newTreeData, ''); 697 const _newData = generateTreeData(_newTreeData, '');
701 - console.log('_newData', _newData)  
702 - console.log('_newTreeData', _newTreeData)  
703 handleDrop(_newData); 698 handleDrop(_newData);
704 dropCol.childNodes.forEach((item: any) => (item.style.borderTop = '')); 699 dropCol.childNodes.forEach((item: any) => (item.style.borderTop = ''));
705 dropCol.parentNode.childNodes.forEach( 700 dropCol.parentNode.childNodes.forEach(
@@ -828,14 +823,12 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -828,14 +823,12 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
828 </> 823 </>
829 ) : ( 824 ) : (
830 <Table 825 <Table
831 - // components={components}  
832 expandable={{ 826 expandable={{
833 defaultExpandAllRows: true, 827 defaultExpandAllRows: true,
834 - childrenColumnName: 'child' 828 + childrenColumnName: 'child',
835 }} 829 }}
836 onRow={() => onRow()} 830 onRow={() => onRow()}
837 scroll={{ x: 960, y: 432 }} 831 scroll={{ x: 960, y: 432 }}
838 - // rowClassName={() => 'editable-row'}  
839 bordered 832 bordered
840 pagination={false} 833 pagination={false}
841 size={'small'} 834 size={'small'}
@@ -614,18 +614,13 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -614,18 +614,13 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
614 614
615 // 渲染节点 615 // 渲染节点
616 const renderTitle = (nodeData: any) => { 616 const renderTitle = (nodeData: any) => {
617 - // const strTitle = (nodeData.title as string) || '';  
618 - // const strCode = nodeData.code as string;  
619 - // const valuesObj = [{  
620 - // type: typeTranslateItemtype(nodeData.type),  
621 - // value: nodeData.mappingValues || [],  
622 - // }]  
623 - // nodeData.valuesObj = !nodeData.valuesObj ? valuesObj : nodeData.valuesObj  
624 - // const index = strTitle.indexOf(searchValue); 617 + const strTitle = (nodeData.title as string) || '';
  618 + const index = strTitle.indexOf(searchValue);
625 const isShowTree = checkShowTree(nodeData); 619 const isShowTree = checkShowTree(nodeData);
626 const disabled = nodeData.disabled; 620 const disabled = nodeData.disabled;
627 return ( 621 return (
628 - <div onBlur={(e) => onBlur(e)} tabIndex={0} onFocus={(e) => onFocus(e)}> 622 + <div
  623 + onBlur={(e) => onBlur(e)} tabIndex={0} onFocus={(e) => onFocus(e)}>
629 <div 624 <div
630 style={{ 625 style={{
631 // padding: '2px', 626 // padding: '2px',
@@ -674,12 +669,12 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -674,12 +669,12 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
674 </div> 669 </div>
675 <div className="opt-left"> 670 <div className="opt-left">
676 <Input 671 <Input
  672 + className={index > -1 && searchValue ? 'search-selected' : ''}
677 draggable={true} 673 draggable={true}
678 onDragStart={(event) => { 674 onDragStart={(event) => {
679 event.stopPropagation(); 675 event.stopPropagation();
680 event.preventDefault(); 676 event.preventDefault();
681 }} 677 }}
682 - // ref={inputRef}  
683 key={inputKey} 678 key={inputKey}
684 style={{ width: '100%' }} 679 style={{ width: '100%' }}
685 maxLength={50} 680 maxLength={50}
@@ -169,6 +169,12 @@ @@ -169,6 +169,12 @@
169 169
170 } 170 }
171 171
  172 +.search-selected{
  173 + .ant-input {
  174 + color: #1890ff;
  175 + }
  176 +}
  177 +
172 .editable-cell-value-wrap { 178 .editable-cell-value-wrap {
173 min-height: 30px; 179 min-height: 30px;
174 padding: 5px 12px; 180 padding: 5px 12px;