田强 / qx-common · Commits

Commit 1452d5e9dba8823c23fd4873b8d48fea9d2da966

Authored by 邱嘉伟
1 parent eda8f384

fix ：样式修改

Inline Side-by-side
Showing 4 changed files with 255 additions and 122 deletions
@@ -76,7 +76,6 @@ export const QxBaseCondition: React.FC<QxBaseConditionProps> = (props) => { @@ -76,7 +76,6 @@ export const QxBaseCondition: React.FC<QxBaseConditionProps> = (props) => {
76 ); 76 );
77 }; 77 };
78 78
79 - console.log('props', props);  
80 const RenderCondition = props.value?.map((item, key) => ( 79 const RenderCondition = props.value?.map((item, key) => (
81 <div className="qx-base-condition-list-item" key={item.code || key}> 80 <div className="qx-base-condition-list-item" key={item.code || key}>
82 {(props?.showIdx ?? true) && ( 81 {(props?.showIdx ?? true) && (
@@ -7,7 +7,6 @@ import { @@ -7,7 +7,6 @@ import {
7 Col, 7 Col,
8 DatePicker, 8 DatePicker,
9 Divider, 9 Divider,
10 - Form,  
11 Input, 10 Input,
12 InputNumber, 11 InputNumber,
13 Modal, 12 Modal,
@@ -15,6 +14,7 @@ import { @@ -15,6 +14,7 @@ import {
15 Select, 14 Select,
16 Space, 15 Space,
17 Table, 16 Table,
  17 + Tooltip,
18 message, 18 message,
19 } from 'antd'; 19 } from 'antd';
20 import React, { useCallback, useEffect, useState } from 'react'; 20 import React, { useCallback, useEffect, useState } from 'react';
@@ -148,30 +148,24 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -148,30 +148,24 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
148 ), 148 ),
149 dataIndex: 'code', 149 dataIndex: 'code',
150 className: 'code-header', 150 className: 'code-header',
151 - width: '200px', 151 + width: '150px',
152 key: 'code', 152 key: 'code',
153 render: (text, record) => { 153 render: (text, record) => {
154 const strTitle = (text as string) || ''; 154 const strTitle = (text as string) || '';
155 const index = strTitle.indexOf(searchValue); 155 const index = strTitle.indexOf(searchValue);
156 return ( 156 return (
157 - <Form.Item  
158 - name={'code' + record.id}  
159 - style={{ margin: 0 }}  
160 - // initialValue={record.code}  
161 - >  
162 - <Input  
163 - style={{ color: index > -1 && searchValue ? '#1890ff' : '' }}  
164 - draggable={true}  
165 - onDragStart={(event) => {  
166 - event.stopPropagation();  
167 - event.preventDefault();  
168 - }}  
169 - defaultValue={record.code}  
170 - bordered={false}  
171 - disabled={record.disabled || typeDis}  
172 - onBlur={(e) => handleChange(e, record, 'code')}  
173 - />  
174 - </Form.Item> 157 + <Input
  158 + style={{ color: index > -1 && searchValue ? '#1890ff' : '' }}
  159 + draggable={true}
  160 + onDragStart={(event) => {
  161 + event.stopPropagation();
  162 + event.preventDefault();
  163 + }}
  164 + defaultValue={record.code}
  165 + bordered={false}
  166 + disabled={record.disabled || typeDis}
  167 + onBlur={(e) => handleChange(e, record, 'code')}
  168 + />
175 ); 169 );
176 }, 170 },
177 }, 171 },
@@ -190,24 +184,18 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -190,24 +184,18 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
190 const strTitle = (record.title as string) || ''; 184 const strTitle = (record.title as string) || '';
191 const index = strTitle.indexOf(searchValue); 185 const index = strTitle.indexOf(searchValue);
192 return ( 186 return (
193 - <Form.Item  
194 - name={'title' + record.id}  
195 - style={{ margin: 0 }}  
196 - // initialValue={record.title}  
197 - >  
198 - <Input  
199 - style={{ color: index > -1 && searchValue ? '#1890ff' : '' }}  
200 - draggable={true}  
201 - onDragStart={(event) => {  
202 - event.stopPropagation();  
203 - event.preventDefault();  
204 - }}  
205 - defaultValue={record.title}  
206 - bordered={false}  
207 - disabled={record.disabled || typeDis}  
208 - onBlur={(e) => handleChange(e, record, 'title')}  
209 - />  
210 - </Form.Item> 187 + <Input
  188 + style={{ color: index > -1 && searchValue ? '#1890ff' : '' }}
  189 + draggable={true}
  190 + onDragStart={(event) => {
  191 + event.stopPropagation();
  192 + event.preventDefault();
  193 + }}
  194 + defaultValue={record.title}
  195 + bordered={false}
  196 + disabled={record.disabled || typeDis}
  197 + onBlur={(e) => handleChange(e, record, 'title')}
  198 + />
211 ); 199 );
212 }, 200 },
213 }, 201 },
@@ -220,29 +208,25 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -220,29 +208,25 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
220 ), 208 ),
221 dataIndex: 'type', 209 dataIndex: 'type',
222 className: 'ps-table-cell', 210 className: 'ps-table-cell',
223 - width: '102px', 211 + width: '95px',
224 key: 'type', 212 key: 'type',
225 render: (text, record) => ( 213 render: (text, record) => (
226 - <Form.Item  
227 - style={{ margin: 0 }}  
228 - name={'type' + record.id}  
229 - // initialValue={record.type} 214 + <Select
  215 + bordered={false}
  216 + disabled={record.disabled || typeDis}
  217 + defaultValue={record.type}
  218 + popupMatchSelectWidth
  219 + // dropdownStyle={{width: '1000px'}}
  220 + onSelect={(e) => handleChange(e, record, 'type')}
230 > 221 >
231 - <Select  
232 - bordered={false}  
233 - disabled={record.disabled || typeDis}  
234 - defaultValue={record.type}  
235 - onSelect={(e) => handleChange(e, record, 'type')}  
236 - >  
237 - {valueOptions.map((item) => {  
238 - return (  
239 - <Select.Option key={item.key} value={item.key}>  
240 - {item.title}  
241 - </Select.Option>  
242 - );  
243 - })}  
244 - </Select>  
245 - </Form.Item> 222 + {valueOptions.map((item) => {
  223 + return (
  224 + <Select.Option key={item.key} value={item.key}>
  225 + {item.title}
  226 + </Select.Option>
  227 + );
  228 + })}
  229 + </Select>
246 ), 230 ),
247 }, 231 },
248 { 232 {
@@ -253,7 +237,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -253,7 +237,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
253 ), 237 ),
254 dataIndex: 'valueMapping', 238 dataIndex: 'valueMapping',
255 className: 'ps-table-cell', 239 className: 'ps-table-cell',
256 - width: '116px', 240 + width: '200px',
257 key: 'valueMapping', 241 key: 'valueMapping',
258 render: (text, record) => ( 242 render: (text, record) => (
259 <div className="editable-cell-default "> 243 <div className="editable-cell-default ">
@@ -319,24 +303,18 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -319,24 +303,18 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
319 key: 'description', 303 key: 'description',
320 width: '120px', 304 width: '120px',
321 render: (text, record) => ( 305 render: (text, record) => (
322 - <Form.Item  
323 - name={'description' + record.id}  
324 - style={{ margin: 0 }}  
325 - // initialValue={text}  
326 - >  
327 - <Input  
328 - draggable={true}  
329 - onDragStart={(event) => {  
330 - event.stopPropagation();  
331 - event.preventDefault();  
332 - }}  
333 - key={inputKey}  
334 - defaultValue={text}  
335 - bordered={false}  
336 - disabled={record.disabled || typeDis}  
337 - onBlur={(e) => handleChange(e, record, 'description')}  
338 - />  
339 - </Form.Item> 306 + <Input
  307 + draggable={true}
  308 + onDragStart={(event) => {
  309 + event.stopPropagation();
  310 + event.preventDefault();
  311 + }}
  312 + key={inputKey}
  313 + defaultValue={text}
  314 + bordered={false}
  315 + disabled={record.disabled || typeDis}
  316 + onBlur={(e) => handleChange(e, record, 'description')}
  317 + />
340 ), 318 ),
341 }, 319 },
342 { 320 {
@@ -357,11 +335,15 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -357,11 +335,15 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
357 <Button 335 <Button
358 size={'small'} 336 size={'small'}
359 type="link" 337 type="link"
360 - disabled={record.disabled || typeDis} 338 + disabled={typeDis}
361 icon={ 339 icon={
362 - <QxBaseIcon style={{ fontSize: 16 }} type={'qx-icon-plus'} /> 340 + <QxBaseIcon
  341 + className={'title-btn'}
  342 + style={{ fontSize: 16 }}
  343 + type={'qx-icon-plus'}
  344 + />
363 } 345 }
364 - onClick={() => handleAdd(record.pid)} 346 + onClick={() => handleAdd(record)}
365 /> 347 />
366 )} 348 )}
367 {(record.type === 'OBJECT' || record.type === 'ARRAY') && 349 {(record.type === 'OBJECT' || record.type === 'ARRAY') &&
@@ -371,25 +353,32 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -371,25 +353,32 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
371 type="link" 353 type="link"
372 disabled={record.disabled || typeDis} 354 disabled={record.disabled || typeDis}
373 icon={ 355 icon={
374 - <Icon style={{ fontSize: 16 }} component={SubNodeIcon} /> 356 + <Icon
  357 + style={{ fontSize: 16 }}
  358 + className={'title-btn'}
  359 + component={SubNodeIcon}
  360 + />
375 } 361 }
376 onClick={() => handleAddTree(record.id)} 362 onClick={() => handleAddTree(record.id)}
377 /> 363 />
378 )} 364 )}
379 - <Button  
380 - size={'small'}  
381 - type="link"  
382 - className="btn-high-del"  
383 - disabled={record.disabled || typeDis}  
384 - icon={  
385 - <QxBaseIcon  
386 - style={{ fontSize: 16 }}  
387 - className={'title-btn-del-btn'}  
388 - type={'qx-icon-delete'}  
389 - />  
390 - }  
391 - onClick={() => handleDelete(record)}  
392 - /> 365 +
  366 + {!record.disabled && (
  367 + <Button
  368 + size={'small'}
  369 + type="link"
  370 + className="btn-high-del"
  371 + disabled={record.disabled || typeDis}
  372 + icon={
  373 + <QxBaseIcon
  374 + style={{ fontSize: 16 }}
  375 + className={'title-btn title-btn-del-btn'}
  376 + type={'qx-icon-delete'}
  377 + />
  378 + }
  379 + onClick={() => handleDelete(record)}
  380 + />
  381 + )}
393 </Space> 382 </Space>
394 ); 383 );
395 }, 384 },
@@ -404,7 +393,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -404,7 +393,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
404 ), 393 ),
405 dataIndex: 'qxProps', 394 dataIndex: 'qxProps',
406 className: 'ps-table-cell', 395 className: 'ps-table-cell',
407 - width: '350px', 396 + width: '360px',
408 key: 'qxProps', 397 key: 'qxProps',
409 render: (qxProps: any, record: any) => { 398 render: (qxProps: any, record: any) => {
410 switch (record.type) { 399 switch (record.type) {
@@ -592,17 +581,15 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -592,17 +581,15 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
592 key: 'required', 581 key: 'required',
593 width: '86px', 582 width: '86px',
594 render: (text, record) => ( 583 render: (text, record) => (
595 - <Form.Item name={'required' + record.id} style={{ margin: 0 }}>  
596 - <Select  
597 - defaultValue={text || false}  
598 - bordered={false}  
599 - disabled={record.disabled || typeDis}  
600 - onSelect={(e) => props.handleChange(e, record, 'required')}  
601 - >  
602 - <Select.Option value={true}>是</Select.Option>  
603 - <Select.Option value={false}>否</Select.Option>  
604 - </Select>  
605 - </Form.Item> 584 + <Select
  585 + defaultValue={text || false}
  586 + bordered={false}
  587 + disabled={record.disabled || typeDis}
  588 + onSelect={(e) => props.handleChange(e, record, 'required')}
  589 + >
  590 + <Select.Option value={true}>是</Select.Option>
  591 + <Select.Option value={false}>否</Select.Option>
  592 + </Select>
606 ), 593 ),
607 }; 594 };
608 595
@@ -789,17 +776,37 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -789,17 +776,37 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
789 setMidData(_data); 776 setMidData(_data);
790 }; 777 };
791 778
  779 + const RenderTitle = (
  780 + <div>
  781 + 高级参数设计器
  782 + <Tooltip placement="top" title="帮助">
  783 + <span
  784 + className={'render-right__help'}
  785 + // onClick={() => {
  786 + // const _url = GoToHelpUrl(selectedNode?.type || '');
  787 + // _url && handleWindowOpen(_url);
  788 + // }}
  789 + >
  790 + <QxBaseIcon
  791 + className={'qx-data-flow__icon'}
  792 + type={'qx-icon-help-circle-fill'}
  793 + />
  794 + </span>
  795 + </Tooltip>
  796 + </div>
  797 + );
  798 +
792 return ( 799 return (
793 <> 800 <>
794 <Modal 801 <Modal
795 - title="高级参数设计器" 802 + title={RenderTitle}
796 open={visible} 803 open={visible}
797 destroyOnClose 804 destroyOnClose
798 footer={null} 805 footer={null}
799 // onOk={handleCancel} 806 // onOk={handleCancel}
800 onCancel={onCancel} 807 onCancel={onCancel}
801 width={1200} 808 width={1200}
802 - wrapClassName={'qx-common__modal'} 809 + wrapClassName={'qx-common__modal qx-parameter-setting__modal'}
803 closeIcon={ 810 closeIcon={
804 <QxBaseIcon 811 <QxBaseIcon
805 className={'qx-common__modal--close'} 812 className={'qx-common__modal--close'}
@@ -914,7 +921,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => { @@ -914,7 +921,7 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
914 }} 921 }}
915 className="parameter-setting-table" 922 className="parameter-setting-table"
916 onRow={onRow} 923 onRow={onRow}
917 - scroll={{ x: 1000 }} 924 + scroll={{ y: 350 }}
918 bordered 925 bordered
919 pagination={false} 926 pagination={false}
920 size={'small'} 927 size={'small'}
@@ -12,7 +12,7 @@ import { @@ -12,7 +12,7 @@ import {
12 message, 12 message,
13 } from 'antd'; 13 } from 'antd';
14 import type { TreeProps } from 'antd/lib/tree'; 14 import type { TreeProps } from 'antd/lib/tree';
15 -import React, { useCallback, useEffect, useState } from 'react'; 15 +import React, { useCallback, useEffect, useRef, useState } from 'react';
16 import ParameterModal from './ParameterModal'; 16 import ParameterModal from './ParameterModal';
17 import { formatEnum } from './constant'; 17 import { formatEnum } from './constant';
18 // import type { InputRef } from 'antd'; 18 // import type { InputRef } from 'antd';
@@ -31,7 +31,6 @@ import { uidGen } from './stringUtil'; @@ -31,7 +31,6 @@ import { uidGen } from './stringUtil';
31 import './style.less'; 31 import './style.less';
32 32
33 import { SubDropIcon, SubNodeIcon } from './sub-node-icon'; 33 import { SubDropIcon, SubNodeIcon } from './sub-node-icon';
34 -  
35 const valueOptions = [ 34 const valueOptions = [
36 { key: 'STRING', label: '文本' }, 35 { key: 'STRING', label: '文本' },
37 { key: 'NUMBER', label: '数字' }, 36 { key: 'NUMBER', label: '数字' },
@@ -109,6 +108,8 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -109,6 +108,8 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
109 const [defaultExpandedKeys, setDefaultExpandedKeys] = useState<React.Key[]>(); //树节点的id 有了则展开 108 const [defaultExpandedKeys, setDefaultExpandedKeys] = useState<React.Key[]>(); //树节点的id 有了则展开
110 const [autoExpandParent, setAutoExpandParent] = useState(true); 109 const [autoExpandParent, setAutoExpandParent] = useState(true);
111 const [searchValue, setSearchValue] = useState(''); 110 const [searchValue, setSearchValue] = useState('');
  111 + const inputRef = useRef<any>(null);
  112 +
112 // const isDeveloper = window.sessionStorage.getItem('DEVELOPER_MODE') === '1'; 113 // const isDeveloper = window.sessionStorage.getItem('DEVELOPER_MODE') === '1';
113 // const inputRef = useRef<InputRef>(null); 114 // const inputRef = useRef<InputRef>(null);
114 //把所有子节点都展开拿出来 115 //把所有子节点都展开拿出来
@@ -467,20 +468,39 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -467,20 +468,39 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
467 }; 468 };
468 469
469 //普通增加节点，高级增加当前层级节点 470 //普通增加节点，高级增加当前层级节点
470 - const handleAdd = (_pid?: string, _type: string = 'STRING') => { 471 + const handleAdd = (itemData?: any, _type: string = 'STRING') => {
471 const _treeData = [...treeData]; 472 const _treeData = [...treeData];
472 const id = uidGen(); 473 const id = uidGen();
473 const code = uidGen(undefined, 6); 474 const code = uidGen(undefined, 6);
474 475
475 // @ts-ignore 476 // @ts-ignore
476 - const loopAddTree = (treeList: any[]) => { 477 + const loopAddTreePid = (treeList: any[]) => {
477 for (let i = 0; i < treeList.length; i++) { 478 for (let i = 0; i < treeList.length; i++) {
478 - if (treeList[i].id == _pid) { 479 + if (treeList[i].id == itemData.pid) {
479 treeList[i].child.push({ 480 treeList[i].child.push({
480 id, 481 id,
481 code, 482 code,
482 type: _type, 483 type: _type,
483 - pid: _pid, 484 + pid: itemData.pid,
  485 + title: '',
  486 + qxProps: getDefaultQxProps(_type),
  487 + });
  488 + return;
  489 + } else if (treeList[i].child) {
  490 + loopAddTreePid(treeList[i].child);
  491 + }
  492 + }
  493 + };
  494 +
  495 + const loopAddTree = (treeList: any[]) => {
  496 + for (let i = 0; i < treeList.length; i++) {
  497 + if (treeList[i].id == itemData.id) {
  498 + const index = treeList.findIndex((item) => item.id == itemData.id);
  499 + treeList.splice(index + 1, 0, {
  500 + id,
  501 + code,
  502 + type: _type,
  503 + // pid: itemData.pid,
484 title: '', 504 title: '',
485 qxProps: getDefaultQxProps(_type), 505 qxProps: getDefaultQxProps(_type),
486 }); 506 });
@@ -491,7 +511,9 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -491,7 +511,9 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
491 } 511 }
492 }; 512 };
493 513
494 - if (!_pid) { 514 + if (itemData && !itemData.pid) {
  515 + loopAddTree(_treeData);
  516 + } else if (!itemData) {
495 _treeData.push({ 517 _treeData.push({
496 id, 518 id,
497 code, 519 code,
@@ -500,11 +522,16 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -500,11 +522,16 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
500 qxProps: getDefaultQxProps(_type), 522 qxProps: getDefaultQxProps(_type),
501 pid: '', 523 pid: '',
502 }); 524 });
503 - } else {  
504 - loopAddTree(_treeData); 525 + } else if (itemData && !!itemData.pid) {
  526 + loopAddTreePid(_treeData);
505 } 527 }
506 setTreeData(_treeData); 528 setTreeData(_treeData);
507 props?.onChange(_treeData); 529 props?.onChange(_treeData);
  530 +
  531 + setTimeout(() => {
  532 + let myInput = document.getElementById(id);
  533 + myInput.focus();
  534 + }, 0);
508 }; 535 };
509 536
510 //增加子节点 537 //增加子节点
@@ -688,9 +715,13 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => { @@ -688,9 +715,13 @@ export const QxParameterSetting: React.FC<ParameterSettingProps> = (props) => {
688 </div> 715 </div>
689 <div className="opt-left"> 716 <div className="opt-left">
690 <Input 717 <Input
  718 + id={nodeData.id}
  719 + ref={inputRef}
691 status={!nodeData.title ? 'error' : ''} 720 status={!nodeData.title ? 'error' : ''}
692 placeholder={!nodeData.title ? '请输入参数名' : ''} 721 placeholder={!nodeData.title ? '请输入参数名' : ''}
693 - className={index > -1 && searchValue ? 'search-selected' : ''} 722 + className={
  723 + index > -1 && searchValue ? 'search-selected' : 'title-input'
  724 + }
694 draggable={true} 725 draggable={true}
695 onDragStart={(event) => { 726 onDragStart={(event) => {
696 event.stopPropagation(); 727 event.stopPropagation();
@@ -162,6 +162,32 @@ @@ -162,6 +162,32 @@
162 .ant-input-affix-wrapper { 162 .ant-input-affix-wrapper {
163 border-color: @N4; 163 border-color: @N4;
164 } 164 }
  165 +
  166 + .ant-input-status-error {
  167 + box-shadow: 0 0 4px 0 #e34d5980;
  168 + }
  169 +
  170 + .ant-input-status-error {
  171 + &:focus-within {
  172 + border: 1px solid @B8 !important;
  173 + box-shadow: 0 0 4px 0 #1764ff80;
  174 +
  175 + // box-shadow: 0 0 0 2px rgba(15, 112, 121, 0.269);
  176 + }
  177 + }
  178 +}
  179 +
  180 +.render-right__help {
  181 + margin: 0 8px;
  182 + width: 20px;
  183 + height: 24px;
  184 + font-size: 16px;
  185 + color: @N6;
  186 + cursor: pointer;
  187 +
  188 + &:hover {
  189 + color: @B8;
  190 + }
165 } 191 }
166 192
167 .opt-left-down { 193 .opt-left-down {
@@ -203,6 +229,10 @@ @@ -203,6 +229,10 @@
203 justify-content: flex-start; 229 justify-content: flex-start;
204 flex-wrap: nowrap; 230 flex-wrap: nowrap;
205 231
  232 + .ant-btn-default {
  233 + border: 0;
  234 + }
  235 +
206 .range-cell { 236 .range-cell {
207 display: flex; 237 display: flex;
208 align-content: center; 238 align-content: center;
@@ -222,15 +252,48 @@ @@ -222,15 +252,48 @@
222 } 252 }
223 253
224 .editable-cell-default { 254 .editable-cell-default {
  255 + overflow: auto;
  256 + // overflow-x:hidden;
  257 +
  258 + // ::-webkit-scrollbar{
  259 + // width: 0 !important;
  260 + // }
  261 +
225 .qx-base-condition-item { 262 .qx-base-condition-item {
226 margin: 0; 263 margin: 0;
227 } 264 }
228 265
229 .qx-field-setter { 266 .qx-field-setter {
230 border-width: 0; 267 border-width: 0;
  268 +
  269 + .ant-select-selector {
  270 + background-color: transparent;
  271 + }
  272 +
  273 + .qx-tags-input {
  274 + max-width: 140px;
  275 + min-width: 30px;
  276 + max-height: 40px;
  277 +
  278 + .qx-tags-input__box {
  279 + max-width: 140px;
  280 + min-width: 30px;
  281 + background-color: transparent !important;
  282 + }
  283 + }
  284 + }
  285 +
  286 + .qx-node-select {
  287 + .qx-base-condition-item__content-suffix {
  288 + background-color: transparent !important;
  289 + }
231 } 290 }
232 } 291 }
233 292
  293 +.editable-cell-default::-webkit-scrollbar {
  294 + display: none;
  295 +}
  296 +
234 .search-selected { 297 .search-selected {
235 // .ant-input { 298 // .ant-input {
236 color: #1890ff; 299 color: #1890ff;
@@ -318,6 +381,27 @@ @@ -318,6 +381,27 @@
318 display: block; 381 display: block;
319 } 382 }
320 383
  384 +.ant-table-body {
  385 + .ps-table-cell {
  386 + transition: all 0.2s ease;
  387 +
  388 + &:hover {
  389 + border: 1px solid @N6 !important;
  390 + border-radius: 2px;
  391 + }
  392 +
  393 + &:focus-within {
  394 + border: 1px solid #1764ff !important;
  395 + border-radius: 2px;
  396 + }
  397 +
  398 + // display: flex;
  399 + // .title-btn{
  400 + // color: @B8;
  401 + // }
  402 + }
  403 +}
  404 +
321 .qx-parameter-tree-list .ant-tree-list { 405 .qx-parameter-tree-list .ant-tree-list {
322 .ant-tree-treenode:not(.ant-tree-treenode-disabled) { 406 .ant-tree-treenode:not(.ant-tree-treenode-disabled) {
323 background-color: transparent !important; 407 background-color: transparent !important;
@@ -389,5 +473,17 @@ @@ -389,5 +473,17 @@
389 473
390 .parameter-setting-table .ant-table-cell { 474 .parameter-setting-table .ant-table-cell {
391 height: 40px; 475 height: 40px;
392 - padding: 4px 16px 0 4px !important; 476 + padding: 4px 16px 4px 4px !important;
  477 +}
  478 +
  479 +.qx-parameter-setting__modal {
  480 + .ant-modal-content {
  481 + min-height: 400px;
  482 + max-height: 600px;
  483 + // padding-bottom: 24px !important;
  484 + }
  485 +
  486 + .ant-modal-body {
  487 + overflow-y: hidden !important;
  488 + }
393 } 489 }