Skip to content

Commit fb4fb88

Browse files
author
tangtanglove
committed
优化代码
1 parent 34a6e60 commit fb4fb88

File tree

3 files changed

+172
-125
lines changed

3 files changed

+172
-125
lines changed

‎src/pages/Quark/components/QueryFilter.tsx‎

Lines changed: 110 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import ProForm, {
66
ProFormText,
77
ProFormDatePicker,
88
ProFormDateRangePicker,
9+
ProFormDateTimePicker,
10+
ProFormDateTimeRangePicker,
911
ProFormSelect
1012
} from '@ant-design/pro-form';
1113

@@ -17,6 +19,7 @@ export interface Action {
1719
const QueryFilter: React.FC<Action> = (props) => {
1820
const onFinish = (values: any) => {
1921
let query = {};
22+
2023
query['api'] = history.location.query.api;
2124
query['page'] = history.location.query.page;
2225
query['pageSize'] = history.location.query.pageSize;
@@ -30,6 +33,34 @@ const QueryFilter: React.FC<Action> = (props) => {
3033
query['filter'] = history.location.query.filter;
3134
}
3235

36+
// hack random
37+
query['random'] = Math.random();
38+
39+
history.push({ pathname: history.location.pathname, query: query });
40+
41+
if (props.current) {
42+
props.current.reload();
43+
}
44+
};
45+
46+
const onReset = () => {
47+
let query = {};
48+
49+
query['api'] = history.location.query.api;
50+
query['page'] = history.location.query.page;
51+
query['pageSize'] = history.location.query.pageSize;
52+
53+
if(history.location.query.sorter) {
54+
query['sorter'] = history.location.query.sorter;
55+
}
56+
57+
if(history.location.query.filter) {
58+
query['filter'] = history.location.query.filter;
59+
}
60+
61+
// hack random
62+
query['random'] = Math.random();
63+
3364
history.push({ pathname: history.location.pathname, query: query });
3465

3566
if (props.current) {
@@ -38,10 +69,11 @@ const QueryFilter: React.FC<Action> = (props) => {
3869
};
3970

4071
const searchComponent = (item:any) => {
72+
let component = null;
4173
switch(item.component) {
4274
case 'input':
4375
if(item.operator == 'between') {
44-
return (
76+
component =
4577
<ProForm.Group title={item.label}>
4678
<ProFormText
4779
key={item.name+'_start'}
@@ -56,98 +88,113 @@ const QueryFilter: React.FC<Action> = (props) => {
5688
style={item.style ? item.style : []}
5789
/>
5890
</ProForm.Group>
59-
)
6091
} else {
61-
return (
62-
<ProFormText
63-
key={item.name}
64-
name={item.name}
65-
label={item.label}
66-
placeholder={item.placeholder}
67-
style={item.style ? item.style : []}
68-
/>
69-
)
92+
component =
93+
<ProFormText
94+
key={item.name}
95+
name={item.name}
96+
label={item.label}
97+
placeholder={item.placeholder}
98+
style={item.style ? item.style : []}
99+
/>
70100
}
71101

72102
break;
73103
case 'select':
74-
return (
75-
<ProFormSelect
104+
component =
105+
<ProFormSelect
106+
key={item.name}
107+
label={item.label}
108+
name={item.name}
109+
options={item.options}
110+
style={item.style ? item.style : []}
111+
placeholder={item.placeholder}
112+
/>
113+
break;
114+
case 'multipleSelect':
115+
component =
116+
<ProFormSelect
117+
mode="multiple"
118+
key={item.name}
119+
label={item.label}
120+
name={item.name}
121+
options={item.options}
122+
style={item.style ? item.style : []}
123+
placeholder={item.placeholder}
124+
/>
125+
break;
126+
127+
case 'datetime':
128+
if(item.operator == 'between') {
129+
component =
130+
<ProFormDateTimeRangePicker
76131
key={item.name}
77132
label={item.label}
78133
name={item.name}
79-
options={item.options}
80134
style={item.style ? item.style : []}
81-
placeholder={item.placeholder}
82135
/>
83-
)
84-
85-
break;
86-
case 'multipleSelect':
87-
return (
88-
<ProFormSelect
89-
mode="multiple"
136+
} else {
137+
component =
138+
<ProFormDateTimePicker
90139
key={item.name}
91-
label={item.label}
92140
name={item.name}
93-
options={item.options}
94-
style={item.style ? item.style : []}
141+
label={item.label}
95142
placeholder={item.placeholder}
143+
style={item.style ? item.style : []}
96144
/>
97-
)
98-
145+
}
99146
break;
100147

101-
case 'datetime':
148+
case 'date':
102149
if(item.operator == 'between') {
103-
return (
104-
<ProFormDateRangePicker
105-
key={item.name}
106-
label={item.label}
107-
name={item.name}
108-
style={item.style ? item.style : []}
109-
/>
110-
)
150+
component =
151+
<ProFormDateRangePicker
152+
key={item.name}
153+
label={item.label}
154+
name={item.name}
155+
style={item.style ? item.style : []}
156+
/>
111157
} else {
112-
return (
113-
<ProFormDatePicker
114-
key={item.name}
115-
name={item.name}
116-
label={item.label}
117-
placeholder={item.placeholder}
118-
style={item.style ? item.style : []}
119-
/>
120-
)
158+
component =
159+
<ProFormDatePicker
160+
key={item.name}
161+
name={item.name}
162+
label={item.label}
163+
placeholder={item.placeholder}
164+
style={item.style ? item.style : []}
165+
/>
121166
}
122167
break;
123168

124169
case 'inputGroup':
125-
return (
126-
<ProForm.Group title={item.label}>
127-
<ProFormSelect
128-
key={item.name+'_start'}
129-
name={item.name+'_start'}
130-
options={item.options}
131-
style={{ width : (item.style.width[0] ? item.style.width[0] : null)}}
132-
/>
133-
<ProFormText
134-
key={item.name+'_end'}
135-
name={item.name+'_end'}
136-
style={{ width : (item.style.width[1] ? item.style.width[1] : null)}}
137-
placeholder={item.placeholder}
138-
/>
139-
</ProForm.Group>
140-
)
170+
component =
171+
<ProForm.Group title={item.label}>
172+
<ProFormSelect
173+
key={item.name+'_start'}
174+
name={item.name+'_start'}
175+
options={item.options}
176+
style={{ width : (item.style.width[0] ? item.style.width[0] : null)}}
177+
/>
178+
<ProFormText
179+
key={item.name+'_end'}
180+
name={item.name+'_end'}
181+
style={{ width : (item.style.width[1] ? item.style.width[1] : null)}}
182+
placeholder={item.placeholder}
183+
/>
184+
</ProForm.Group>
141185
break;
142186

143187
default:
144-
return null;
188+
component = null;
145189
}
190+
191+
return component;
146192
};
147193

148194
return (
149195
<ProQueryFilter
150-
onFinish = {onFinish}
196+
onFinish = {async (values) => { onFinish(values) }}
197+
onReset = {async () => { onReset() }}
151198
labelAlign = {props.search.labelAlign}
152199
size = {props.search.size}
153200
defaultCollapsed = {props.search.defaultCollapsed}

‎src/pages/Quark/components/Show.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const Show: React.FC<any> = (props:any) => {
2323
}
2424
}
2525

26-
return <ProDescriptions.Item label={item.label}>{component}</ProDescriptions.Item>;
26+
return <ProDescriptions.Item key={item.key} label={item.label}>{component}</ProDescriptions.Item>;
2727
})
2828
)
2929
return formItemComponent;

‎src/pages/Quark/components/Upgrade.tsx‎

Lines changed: 61 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -107,72 +107,72 @@ const Upgrade: React.FC<any> = props => {
107107

108108

109109
return (
110-
<Affix offsetBottom={offsetBottom} offsetTop={offsetTop} style={style}>
111-
{canUpgrade ?
112-
<>
110+
<>
111+
<Affix offsetBottom={offsetBottom} offsetTop={offsetTop} style={style}>
112+
{canUpgrade ?
113113
<Tooltip title={upgradeTip}>
114114
<Badge dot>
115115
<Button size={'large'} type="primary" shape="circle" onClick={()=> setUpgradeModalVisible(true)} icon={<ArrowUpOutlined />} />
116116
</Badge>
117117
</Tooltip>
118-
<Modal
119-
title={'当前版本'+upgradeInfo.app_version}
120-
visible={upgradeModalVisible}
121-
onOk={() => setUpgradeModalVisible(false)}
122-
onCancel={() => setUpgradeModalVisible(false)}
123-
footer={null}
124-
width={350}
125-
>
126-
<div>
127-
<div>{upgradeInfo.next_package.version} 更新日志：</div>
128-
<pre style={{minHeight:250}}>
129-
{upgradeInfo.next_package.description}
130-
</pre>
131-
<div style={{textAlign:'center'}}>
132-
<Space>
133-
<Popconfirm
134-
title="已经对系统进行了备份？"
135-
onConfirm={showModal}
136-
okText="是"
137-
cancelText="否"
138-
>
139-
<Button type="primary">立即升级</Button>
140-
</Popconfirm>
141-
<Button onClick={() => setUpgradeModalVisible(false)}>暂不升级</Button>
142-
</Space>
143-
</div>
144-
</div>
145-
</Modal>
146-
<Modal
147-
title="系统升级"
148-
visible={upgradingModalVisible}
149-
width={'860px'}
150-
footer={false}
151-
closable={false}
152-
>
153-
<div>正在进行 {upgradeInfo.next_package.version} 版本升级，此过程将会持续几分钟，请您耐心等待。</div>
154-
<div style={{marginTop:20}}>
155-
<Steps size="small" current={currentStep}>
156-
{steps.map((step:any,key:any) => {
157-
return <Steps.Step title={step.title} icon={(currentStep==key+1) ? <LoadingOutlined /> : false} />
158-
})}
159-
</Steps>
160-
</div>
161-
<div style={{ textAlign: 'center',marginTop:20 }}>
162-
<Progress type="circle" percent={steps[currentStep-1]['percent']} />
163-
</div>
164-
<div style={{ textAlign: 'center',marginTop:20 }}>
165-
{steps[currentStep-1]['tip']}
166-
<span>（<span style={{ color: '#cf1322' }}>系统升级中，请勿关闭本页面</span>）</span>
167-
</div>
168-
</Modal>
169-
</>
170-
:
171-
<Tooltip title={tip}>
172-
<Button size={'large'} type="primary" shape="circle" onClick={() => checkUpdate(api)} icon={<SyncOutlined spin={checking}/> }/>
173-
</Tooltip>
174-
}
175-
</Affix>
118+
:
119+
<Tooltip title={tip}>
120+
<Button size={'large'} type="primary" shape="circle" onClick={() => checkUpdate(api)} icon={<SyncOutlined spin={checking}/> }/>
121+
</Tooltip>
122+
}
123+
</Affix>
124+
<Modal
125+
title={'当前版本'+upgradeInfo.app_version}
126+
visible={upgradeModalVisible}
127+
onOk={() => setUpgradeModalVisible(false)}
128+
onCancel={() => setUpgradeModalVisible(false)}
129+
footer={null}
130+
width={350}
131+
>
132+
<div>
133+
<div>{upgradeInfo.next_package.version} 更新日志：</div>
134+
<pre style={{minHeight:250}}>
135+
{upgradeInfo.next_package.description}
136+
</pre>
137+
<div style={{textAlign:'center'}}>
138+
<Space>
139+
<Popconfirm
140+
title="已经对系统进行了备份？"
141+
onConfirm={showModal}
142+
okText="是"
143+
cancelText="否"
144+
>
145+
<Button type="primary">立即升级</Button>
146+
</Popconfirm>
147+
<Button onClick={() => setUpgradeModalVisible(false)}>暂不升级</Button>
148+
</Space>
149+
</div>
150+
</div>
151+
</Modal>
152+
<Modal
153+
title="系统升级"
154+
visible={upgradingModalVisible}
155+
width={'860px'}
156+
footer={false}
157+
closable={false}
158+
>
159+
<div>正在进行 {upgradeInfo.next_package.version} 版本升级，此过程将会持续几分钟，请您耐心等待。</div>
160+
<div style={{marginTop:20}}>
161+
<Steps size="small" current={currentStep}>
162+
{steps.map((step:any,key:any) => {
163+
return <Steps.Step key={step.key} title={step.title} icon={(currentStep==key+1) ? <LoadingOutlined /> : false} />
164+
})}
165+
</Steps>
166+
</div>
167+
<div style={{ textAlign: 'center',marginTop:20 }}>
168+
<Progress type="circle" percent={steps[currentStep-1]['percent']} />
169+
</div>
170+
<div style={{ textAlign: 'center',marginTop:20 }}>
171+
{steps[currentStep-1]['tip']}
172+
<span>（<span style={{ color: '#cf1322' }}>系统升级中，请勿关闭本页面</span>）</span>
173+
</div>
174+
</Modal>
175+
</>
176176
);
177177
};
178178

0 commit comments

Comments
 (0)