forked from Gitlink/forgeplus-react
参赛报名样式
This commit is contained in:
何童崇
parent
7aeeb5c93e
commit
4357b1a546
|
|
@ -4041,57 +4041,73 @@
|
|||
}
|
||||
},
|
||||
"cross-env": {
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
|
||||
"integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/cross-env/-/cross-env-5.2.1.tgz",
|
||||
"integrity": "sha512-1yHhtcfAd1r4nwQgknowuUNfIT9E8dOMMspC36g45dN+iD1blloi7xp8X/xAIDnjHWyt1uQ8PHk2fkNaym7soQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"cross-spawn": "^7.0.1"
|
||||
"cross-spawn": "^6.0.5"
|
||||
},
|
||||
"dependencies": {
|
||||
"cross-spawn": {
|
||||
"version": "7.0.3",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
|
||||
"integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
|
||||
"version": "6.0.5",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
|
||||
"integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"path-key": "^3.1.0",
|
||||
"shebang-command": "^2.0.0",
|
||||
"which": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"path-key": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
|
||||
"integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
|
||||
"dev": true
|
||||
},
|
||||
"shebang-command": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
|
||||
"integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"shebang-regex": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"shebang-regex": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
|
||||
"integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
|
||||
"dev": true
|
||||
},
|
||||
"which": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
|
||||
"integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"isexe": "^2.0.0"
|
||||
"nice-try": "^1.0.4",
|
||||
"path-key": "^2.0.1",
|
||||
"semver": "^5.5.0",
|
||||
"shebang-command": "^1.2.0",
|
||||
"which": "^1.2.9"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
=======
|
||||
"cross-fetch": {
|
||||
"version": "3.1.5",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/cross-fetch/-/cross-fetch-3.1.5.tgz",
|
||||
"integrity": "sha512-lvb1SBsI0Z7GDwmuid+mU3kWVBwTVUbe7S0H52yaaAdQOXq2YktTCZdlAcNKFzE6QtRz0snpw9bNiPeOIkkQvw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"node-fetch": "2.6.7"
|
||||
},
|
||||
"dependencies": {
|
||||
"node-fetch": {
|
||||
"version": "2.6.7",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/node-fetch/-/node-fetch-2.6.7.tgz",
|
||||
"integrity": "sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"whatwg-url": "^5.0.0"
|
||||
}
|
||||
},
|
||||
"webidl-conversions": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
|
||||
"integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==",
|
||||
"dev": true
|
||||
},
|
||||
"whatwg-url": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "http://173.15.15.82:8081/repository/npm-all/whatwg-url/-/whatwg-url-5.0.0.tgz",
|
||||
"integrity": "sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"tr46": "~0.0.3",
|
||||
"webidl-conversions": "^3.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"cross-port-killer": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/cross-port-killer/-/cross-port-killer-1.4.0.tgz",
|
||||
"integrity": "sha512-ujqfftKsSeorFMVI6JP25xMBixHEaDWVK+NarRZAGnJjR5AhebRQU+g+k/Lj8OHwM6f+wrrs8u5kkCdI7RLtxQ=="
|
||||
},
|
||||
>>>>>>> 5b7235fa (参赛报名样式)
|
||||
"cross-spawn": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-5.1.0.tgz",
|
||||
|
|
|
|||
|
|
@ -34,19 +34,23 @@ export default Form.create()(({ match, history, showNotification, form, current_
|
|||
return (
|
||||
<div className="qz_main">
|
||||
<div className="step">
|
||||
<span>报名</span>
|
||||
<img src={apply_top}/>
|
||||
<span className="left_tit"> 报名</span>
|
||||
<img src={apply_top} className="step_icon"/>
|
||||
<div className="border_dashed"></div>
|
||||
<img src={apply_one_active}/>
|
||||
<img src={apply_one_active} className="step_icon"/>
|
||||
<div className="border_dashed"></div>
|
||||
<img src={apply_two}/>
|
||||
<img src={apply_two} className="step_icon"/>
|
||||
<div className="border_dashed"></div>
|
||||
<img src={apply_down}/>
|
||||
<img src={apply_down} className="step_icon"/>
|
||||
</div>
|
||||
<div className="apply_information">
|
||||
<div>填报报名信息</div>
|
||||
<div className="apply_tip font-15">
|
||||
<img src={apply_notice} className="apply_notice"/>
|
||||
请认真核对报名信息，务必与线下报名表信息一致！
|
||||
</div>
|
||||
<div className="apply_information mb30">
|
||||
<div className="info_head">填写报名信息</div>
|
||||
{/* 报名表单 */}
|
||||
<Form>
|
||||
<Form className="info_form">
|
||||
{helper('参赛单位',
|
||||
'expertName',
|
||||
[{ required: true, message: "参赛单位不能为空" },
|
||||
|
|
@ -74,18 +78,18 @@ export default Form.create()(({ match, history, showNotification, form, current_
|
|||
{helper('赛区',
|
||||
'expertName',
|
||||
[{ required: true, message: "军衔不能为空" }],
|
||||
<Select style={{ width: 200 }} placeholder="请选择赛区">
|
||||
<Select placeholder="请选择赛区">
|
||||
{competitionArea.map(item=> {return <Option value={item.value}>{item.title}</Option>})}
|
||||
</Select>
|
||||
)}
|
||||
{helper('赛项',
|
||||
'expertName',
|
||||
[{ required: true, message: "军衔不能为空" }],
|
||||
<Select style={{ width: 200 }} placeholder="请选择赛项">
|
||||
<Select placeholder="请选择赛项">
|
||||
{competitionType.map(item=> {return <Option value={item.value}>{item.title}</Option>})}
|
||||
</Select>
|
||||
)}
|
||||
<div>
|
||||
<div className="class_from">
|
||||
{helper('课题来源',
|
||||
'expertName',
|
||||
[{ required: true, message: "课题来源不能为空" },
|
||||
|
|
|
|||
|
|
@ -1,4 +1,71 @@
|
|||
.step{
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
margin: 50px 0 60px;
|
||||
.left_tit{
|
||||
height: 20px;
|
||||
line-height: 19px;
|
||||
margin-right: 120px;
|
||||
border-left: 4px solid #2e5bfe;
|
||||
}
|
||||
.step_icon{
|
||||
width: 34px;
|
||||
}
|
||||
.border_dashed{
|
||||
width: 225px;
|
||||
margin: 0 12px;
|
||||
border-bottom: 1px dashed #bac1c9;
|
||||
}
|
||||
}
|
||||
.apply_tip{
|
||||
background-color:#fff5eb;
|
||||
border:1px solid #ffa13a;
|
||||
padding: 10px 0 10px 20px;
|
||||
color:#ffa13a;
|
||||
margin-bottom: 20px;
|
||||
.apply_notice{
|
||||
width: 16px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.apply_information{
|
||||
// padding: 0 0 30px 30px;
|
||||
background-color:#ffffff;
|
||||
border-radius:4px;
|
||||
box-shadow:0px 3px 12px #ecf0ff;
|
||||
.info_head{
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 12px 30px;
|
||||
}
|
||||
.info_form{
|
||||
padding: 8px 0 0 30px;
|
||||
.ant-form-item{
|
||||
display: inline-block;
|
||||
width: 33%;
|
||||
margin-right: 160px;
|
||||
}
|
||||
.class_from{
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
.apply_team{
|
||||
color: red;
|
||||
.add_member{
|
||||
margin: 10px 0 20px;
|
||||
border-radius:4px;
|
||||
}
|
||||
.member_info .ant-table{
|
||||
margin-top: 20px;
|
||||
.ant-form-item{
|
||||
width: 76%;
|
||||
}
|
||||
}
|
||||
.ant-table-thead > tr > th, .ant-table-tbody > tr > td{
|
||||
padding: 3px 16px;
|
||||
text-align: center;
|
||||
}
|
||||
.ant-table-thead > tr > th:first-child, .ant-table-tbody > tr > td:first-child{
|
||||
padding: 3px 16px 3px 55px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -71,11 +71,12 @@ class EditableTable extends React.Component {
|
|||
{
|
||||
title: '姓名',
|
||||
dataIndex: 'name',
|
||||
width: '30%',
|
||||
editable: true,
|
||||
align:'left'
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
width: '30%',
|
||||
dataIndex: 'age',
|
||||
editable: true,
|
||||
},
|
||||
|
|
@ -166,17 +167,18 @@ class EditableTable extends React.Component {
|
|||
};
|
||||
});
|
||||
return (
|
||||
<div>
|
||||
<Button onClick={this.handleAdd} type="primary" style={{ marginBottom: 16 }}>
|
||||
<div className="apply_team">
|
||||
<Button onClick={this.handleAdd} type="primary" className="add_member">
|
||||
添加成员
|
||||
</Button>
|
||||
<Table
|
||||
components={components}
|
||||
rowClassName={() => 'editable-row'}
|
||||
bordered
|
||||
dataSource={dataSource}
|
||||
columns={columns}
|
||||
/>
|
||||
<div className="member_info">
|
||||
<Table
|
||||
components={components}
|
||||
rowClassName={() => 'editable-row'}
|
||||
dataSource={dataSource}
|
||||
columns={columns}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue