田强 / qx-common · Commits

Commit b6c6f20f3018f1b26208669f04ac04ead0587d40

Authored by 邱嘉伟
1 parent 7ba06aa9

fix：参数设计器 默认值字段修改 输入框增加校验

Inline Side-by-side
Showing 2 changed files with 71 additions and 43 deletions
@@ -156,7 +156,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -156,7 +156,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
156 </div> 156 </div>
157 ), 157 ),
158 dataIndex: 'code', 158 dataIndex: 'code',
159 - width: '15%', 159 + width: '12%',
160 editable: true, 160 editable: true,
161 key: 'code', 161 key: 'code',
162 // render: (text, record) => ( 162 // render: (text, record) => (
@@ -184,7 +184,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -184,7 +184,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
184 </div> 184 </div>
185 ), 185 ),
186 dataIndex: 'title', 186 dataIndex: 'title',
187 - width: '15%', 187 + width: '12%',
188 editable: true, 188 editable: true,
189 key: 'title', 189 key: 'title',
190 // render: (text, record) => ( 190 // render: (text, record) => (
@@ -254,14 +254,14 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -254,14 +254,14 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
254 </div> 254 </div>
255 </> : <> 255 </> : <>
256 <div key={record.id}> 256 <div key={record.id}>
257 - <span>{record.type == 'TIME' ? moment(text?.min).format(  
258 - formatEnum[text?.format] || 'YYYY-MM-DD') : text?.min} 257 + <span>{record.type == 'TIME' ? text?.min ? moment(text.min).format(
  258 + formatEnum[text?.format] || 'YYYY-MM-DD') : undefined : text?.min}
259 </span> 259 </span>
260 - {text?.min && ( 260 + {!!text?.min || text?.min >= 0 && (
261 <Space style={{ marginLeft: 5, marginRight: 5 }}>-</Space> 261 <Space style={{ marginLeft: 5, marginRight: 5 }}>-</Space>
262 )} 262 )}
263 - <span>{record.type == 'TIME' ? moment(text?.max).format(  
264 - formatEnum[text?.format] || 'YYYY-MM-DD') : text?.max} 263 + <span>{record.type == 'TIME' ? text?.max ? moment(text.max).format(
  264 + formatEnum[text?.format] || 'YYYY-MM-DD') : undefined : text?.max}
265 </span> 265 </span>
266 </div> 266 </div>
267 </>} 267 </>}
@@ -294,27 +294,43 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -294,27 +294,43 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
294 }, 294 },
295 { 295 {
296 title: '默认值', 296 title: '默认值',
297 - dataIndex: 'qxProps',  
298 - width: '10%', 297 + dataIndex: 'mappingValues',
  298 + width: '12%',
299 editable: true, 299 editable: true,
300 - key: 'qxProps',  
301 - render: (text, record) => (  
302 - // console.log('text', text)  
303 - <span key={record.id}>{text?.default}</span> 300 + key: 'mappingValues',
  301 + render: (text) =>
  302 + text || [].map((item) => {
  303 + // if (item.indexOf('-') > -1) {
  304 + // if (text == item.key) {
  305 + return <span key={item}>{item.indexOf('-') > -1 ? item : ''}</span>;
  306 + // }
  307 + }),
  308 + // }
304 309
305 - // <Form.Item  
306 - // name={'default' + record.id}  
307 - // initialValue={text?.default}  
308 - // >  
309 - // <Input disabled={record.disabled} onBlur={(e) => props.handleChange(e, record, 'qxProps-default')} />  
310 - // </Form.Item>  
311 - ), 310 + // }
  311 + // )
  312 + // text || [].map((item ) => {
  313 + // return console.log('123', item.indexOf('-'))
  314 + // if (item.indexOf('-') > -1) {
  315 +
  316 + // <span key={item.type + record.id}>{item.value}</span>;
  317 + // }
  318 + // }),
  319 + // console.log('text', text)
  320 + // <span key={record.id}>{text?.default}</span>
  321 +
  322 + // <Form.Item
  323 + // name={'default' + record.id}
  324 + // initialValue={text?.default}
  325 + // >
  326 + // <Input disabled={record.disabled} onBlur={(e) => props.handleChange(e, record, 'qxProps-default')} />
  327 + // </Form.Item>
  328 + // ),
312 }, 329 },
313 { 330 {
314 title: '参数说明', 331 title: '参数说明',
315 dataIndex: 'description', 332 dataIndex: 'description',
316 editable: true, 333 editable: true,
317 - width: '10%',  
318 key: 'description', 334 key: 'description',
319 render: (text, record) => ( 335 render: (text, record) => (
320 <span key={record.id}>{text}</span> 336 <span key={record.id}>{text}</span>
@@ -484,6 +500,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -484,6 +500,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
484 initialValue={qxProps.min} 500 initialValue={qxProps.min}
485 > 501 >
486 <InputNumber 502 <InputNumber
  503 + min={0}
  504 + precision={0}
487 // defaultValue={qxProps.min} 505 // defaultValue={qxProps.min}
488 // onChange={onQxpropsChangen} 506 // onChange={onQxpropsChangen}
489 // onBlur={() => save('qxProps-min')} 507 // onBlur={() => save('qxProps-min')}
@@ -497,6 +515,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -497,6 +515,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
497 initialValue={qxProps.max} 515 initialValue={qxProps.max}
498 > 516 >
499 <InputNumber 517 <InputNumber
  518 + min={0}
  519 + precision={0}
500 // dataIndex={["qxProps", "max"]} 520 // dataIndex={["qxProps", "max"]}
501 // defaultValue={qxProps.max} 521 // defaultValue={qxProps.max}
502 // onBlur={() => save('qxProps-max')} 522 // onBlur={() => save('qxProps-max')}
@@ -522,6 +542,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -522,6 +542,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
522 style={{ margin: 0 }} 542 style={{ margin: 0 }}
523 > 543 >
524 <InputNumber 544 <InputNumber
  545 + precision={qxProps.precision || 0}
  546 + size='small'
525 // defaultValue={qxProps.min} 547 // defaultValue={qxProps.min}
526 // onBlur={() => save('qxProps-min')} 548 // onBlur={() => save('qxProps-min')}
527 style={{ width: '110px' }} 549 style={{ width: '110px' }}
@@ -536,6 +558,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -536,6 +558,8 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
536 name={['newQxProps', 'max']} 558 name={['newQxProps', 'max']}
537 > 559 >
538 <InputNumber 560 <InputNumber
  561 + size='small'
  562 + precision={qxProps.precision || 0}
539 // defaultValue={qxProps.max} 563 // defaultValue={qxProps.max}
540 // onBlur={() => save('qxProps-max')} 564 // onBlur={() => save('qxProps-max')}
541 style={{ width: '110px' }} 565 style={{ width: '110px' }}
@@ -550,6 +574,11 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -550,6 +574,11 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
550 name={['newQxProps', 'precision']} 574 name={['newQxProps', 'precision']}
551 > 575 >
552 <InputNumber 576 <InputNumber
  577 + size='small'
  578 + // formatter={decimalCheck}
  579 + precision={0}
  580 + min={0}
  581 + max={8}
553 // defaultValue={qxProps.precision} 582 // defaultValue={qxProps.precision}
554 // onBlur={() => save('qxProps-precision')} 583 // onBlur={() => save('qxProps-precision')}
555 placeholder="小数位数" 584 placeholder="小数位数"
@@ -569,6 +598,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -569,6 +598,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
569 > 598 >
570 <div> 599 <div>
571 <DatePicker 600 <DatePicker
  601 + size='small'
572 defaultValue={ 602 defaultValue={
573 qxProps?.min 603 qxProps?.min
574 ? moment(qxProps.min) 604 ? moment(qxProps.min)
@@ -576,7 +606,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -576,7 +606,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
576 } 606 }
577 format={formatEnum[qxProps?.format]} 607 format={formatEnum[qxProps?.format]}
578 // onChange={dateChange} 608 // onChange={dateChange}
579 - style={{ width: '130px' }} 609 + style={{ width: '110px' }}
580 // onBlur={() => save('qxProps-min')} 610 // onBlur={() => save('qxProps-min')}
581 showTime 611 showTime
582 onSelect={(e) => props.handleChange(e, record, 'qxProps-min')} 612 onSelect={(e) => props.handleChange(e, record, 'qxProps-min')}
@@ -585,13 +615,14 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -585,13 +615,14 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
585 {/* <DatePicker defaultValue={moment(qxProps.min)} onBlur={() => save('qxProps-min')} placeholder='开始日期' /> */} 615 {/* <DatePicker defaultValue={moment(qxProps.min)} onBlur={() => save('qxProps-min')} placeholder='开始日期' /> */}
586 &nbsp; ~ &nbsp; 616 &nbsp; ~ &nbsp;
587 <DatePicker 617 <DatePicker
  618 + size='small'
588 defaultValue={ 619 defaultValue={
589 qxProps?.min 620 qxProps?.min
590 ? moment(qxProps.max) 621 ? moment(qxProps.max)
591 : undefined 622 : undefined
592 } 623 }
593 format={formatEnum[qxProps?.format]} 624 format={formatEnum[qxProps?.format]}
594 - style={{ width: '130px' }} 625 + style={{ width: '110px' }}
595 // onChange={dateChange} 626 // onChange={dateChange}
596 showTime 627 showTime
597 // onBlur={toggleEdit} 628 // onBlur={toggleEdit}
@@ -601,6 +632,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -601,6 +632,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
601 {/* <DatePicker defaultValue={moment(qxProps.max)} onBlur={() => save('qxProps-max')} placeholder='结束日期' /> */} 632 {/* <DatePicker defaultValue={moment(qxProps.max)} onBlur={() => save('qxProps-max')} placeholder='结束日期' /> */}
602 </div> 633 </div>
603 <Select 634 <Select
  635 + size='small'
604 style={{ width: '90px' }} 636 style={{ width: '90px' }}
605 placeholder="格式" 637 placeholder="格式"
606 popupMatchSelectWidth={false} 638 popupMatchSelectWidth={false}
@@ -691,16 +723,11 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -691,16 +723,11 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
691 const qxPropsDefault = () => { 723 const qxPropsDefault = () => {
692 const valuesObj = [{ 724 const valuesObj = [{
693 type: typeTranslateItemtype(record.type), 725 type: typeTranslateItemtype(record.type),
694 - value: record?.qxProps?.default || '', 726 + value: record.mappingValues || [],
695 }] 727 }]
696 - record.valuesObj = valuesObj 728 + record.valuesObj = !record.valuesObj ? valuesObj : record.valuesObj
697 return ( 729 return (
698 <div> 730 <div>
699 - {/* <Input  
700 - defaultValue={record?.qxProps?.default}  
701 - ref={inputRef}  
702 - onBlur={() => save('qxProps-default')}  
703 - /> */}  
704 <QxFieldSetter 731 <QxFieldSetter
705 value={record.valuesObj || []} 732 value={record.valuesObj || []}
706 params={{ appCode: 'appCode', useId: true }} 733 params={{ appCode: 'appCode', useId: true }}
@@ -763,19 +790,19 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -763,19 +790,19 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
763 ) : dataIndex == 'qxProps' ? ( 790 ) : dataIndex == 'qxProps' ? (
764 title == '取值范围' ? ( 791 title == '取值范围' ? (
765 qxPropsRange() 792 qxPropsRange()
766 - ) : title == '默认值' ? (  
767 - qxPropsDefault()  
768 ) : ( 793 ) : (
769 qxPropsRemark() 794 qxPropsRemark()
770 ) 795 )
771 - ) : (  
772 - // @ts-ignore  
773 - <Input  
774 - ref={inputRef}  
775 - onPressEnter={save}  
776 - onBlur={() => save(dataIndex)}  
777 - />  
778 - )} 796 + ) : dataIndex == 'mappingValues' ?
  797 + qxPropsDefault() :
  798 + (
  799 + // @ts-ignore
  800 + <Input
  801 + ref={inputRef}
  802 + onPressEnter={save}
  803 + onBlur={() => save(dataIndex)}
  804 + />
  805 + )}
779 </Form.Item> 806 </Form.Item>
780 ) : ( 807 ) : (
781 <div 808 <div
@@ -23,7 +23,7 @@ import { @@ -23,7 +23,7 @@ import {
23 typeTranslateItemtype, 23 typeTranslateItemtype,
24 } from './constant'; 24 } from './constant';
25 25
26 -import { cloneDeep } from 'lodash-es'; 26 +import { cloneDeep, isEmpty } from 'lodash-es';
27 import moment from 'dayjs'; 27 import moment from 'dayjs';
28 import type { ParamDesignModel } from './constant'; 28 import type { ParamDesignModel } from './constant';
29 import { uidGen } from './stringUtil'; 29 import { uidGen } from './stringUtil';
@@ -526,6 +526,7 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -526,6 +526,7 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
526 }; 526 };
527 527
528 const changeField = (val: any, data: any) => { 528 const changeField = (val: any, data: any) => {
  529 + console.log('changeField', val)
529 if (!val || isEmpty(val)) { 530 if (!val || isEmpty(val)) {
530 return; 531 return;
531 } 532 }
@@ -583,9 +584,9 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -583,9 +584,9 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
583 // const strCode = nodeData.code as string; 584 // const strCode = nodeData.code as string;
584 const valuesObj = [{ 585 const valuesObj = [{
585 type: typeTranslateItemtype(nodeData.type), 586 type: typeTranslateItemtype(nodeData.type),
586 - value: nodeData?.qxProps?.default || '', 587 + value: nodeData.mappingValues || [],
587 }] 588 }]
588 - nodeData.valuesObj = valuesObj 589 + nodeData.valuesObj = !nodeData.valuesObj ? valuesObj : nodeData.valuesObj
589 // const index = strTitle.indexOf(searchValue); 590 // const index = strTitle.indexOf(searchValue);
590 const isShowTree = checkShowTree(nodeData); 591 const isShowTree = checkShowTree(nodeData);
591 const disabled = nodeData.disabled; 592 const disabled = nodeData.disabled;