From daf72111876c4c507388a399be478b73a813bdf6 Mon Sep 17 00:00:00 2001
From: pan <1029559041@qq.com>
Date: Sun, 24 May 2020 23:04:46 +0800
Subject: [PATCH] =?UTF-8?q?=E5=BF=97=E6=84=BF=E8=80=85=E5=B8=83=E5=B1=80?=
 =?UTF-8?q?=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/index.css         | 24 ++++++++++++++++++
 src/sub/Volunteer.tsx | 59 +++++++++++++++----------------------------
 2 files changed, 45 insertions(+), 38 deletions(-)

diff --git a/src/index.css b/src/index.css
index ac9bb01..82c2a03 100644
--- a/src/index.css
+++ b/src/index.css
@@ -58,6 +58,30 @@
   height: 100px;
 }
 
+/**
+*帮助信息高度
+ */
+.my-help-height{
+  height: 400px;
+}
+
+/**
+*求助信息高度
+ */
 .seek-help-height{
     height: 400px;
 }
+
+/**
+* 我的留言高度
+ */
+.my-leave-world-height{
+  height: 400px;
+}
+
+/**
+*志愿者页面信息宽度
+ */
+.volunteer{
+  width: 1400px;
+}
diff --git a/src/sub/Volunteer.tsx b/src/sub/Volunteer.tsx
index 0e674ac..badc7f2 100644
--- a/src/sub/Volunteer.tsx
+++ b/src/sub/Volunteer.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import {Button, Card, Col, Container, Row, Table} from "react-bootstrap";
+import {Button, Table} from "react-bootstrap";
 import {Input} from "../bootstrap/InputGroup";
 import {VolunteerProps} from "../entity";
 import {Page} from "../Page";
@@ -80,8 +80,7 @@ export class Volunteer extends React.Component<any, any>{
                     mail:"admin@qq.com",
                     //服务地点
                     address:"广州"
-                }
-            ],[
+                },
                 {
                     //个人描述
                     desc:"个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述个人描述",
@@ -129,21 +128,6 @@ export class Volunteer extends React.Component<any, any>{
                      address:this.state.form.address
                      }})}/>
 
-                {/*<InputGroup className="mt-3 col-3 ml-auto mr-auto">*/}
-                {/*    <InputGroup.Prepend>*/}
-                {/*        <InputGroup.Text>请选择服务地点</InputGroup.Text>*/}
-                {/*    </InputGroup.Prepend>*/}
-                {/*    <Form.Control as="select" custom value={this.state.form.address} onChange={(e)=>this.setState({*/}
-                {/*        form:{*/}
-                {/*            keyword:this.state.form.keyword,*/}
-                {/*            address:e.target.value*/}
-                {/*        }*/}
-                {/*    })}>*/}
-                {/*        {this.state.addressList.map((address:AddressProps, index:number)=>*/}
-                {/*            <option key={"option"+index} value={address.address} >{address.address}</option>*/}
-                {/*        )}*/}
-                {/*    </Form.Control>*/}
-                {/*</InputGroup>*/}
                 <Address onChange={(value:string)=>this.setState({
                     form:{
                         keyword:this.state.form.keyword,
@@ -155,32 +139,31 @@ export class Volunteer extends React.Component<any, any>{
 
                 <Page onClick={(page:number)=>this.loadVolunteerList(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>
 
-                <Container className="p-3">
+
                     {this.state.volunteerList.map((volunteers:Array<VolunteerProps>, index:number)=>
-                        <Row className="justify-content-center p-3" key={"row"+index}>{volunteers.map((volunteer:VolunteerProps, subIndex:number)=>
-                            <Col key={"col"+subIndex} className="col-5">
-                                <Card>
-                                    <Card.Header>志愿者个人简介</Card.Header>
-                                    <Card.Body>
-                                        <p>{volunteer.desc}</p>
-                                    </Card.Body>
-                                    <Card.Footer>
-                                        <Table  bordered hover variant="light">
+                        <div className="p-3 d-flex ml-auto mr-auto volunteer overflow-auto" key={"row"+index}>{volunteers.map((volunteer:VolunteerProps, subIndex:number)=>
+                            <div  key={"col"+subIndex} className="mr-3">
+                                    <div className="border-info border">
+                                        志愿者个人简介
+                                    </div>
+                                    <div>
+                                        <p className="border-info border m-0">{volunteer.desc}</p>
+                                    </div>
+                                    <div >
+                                        <Table>
                                             <tbody>
-                                                <tr>
-                                                    <td className="border-dark">{volunteer.name}</td><td className="border-dark">{volunteer.sex}</td><td className="border-dark">{volunteer.age}</td>
-                                                </tr>
-                                                <tr>
-                                                    <td className="border-dark">{volunteer.phone}</td><td className="border-dark">{volunteer.mail}</td><td className="border-dark">{volunteer.address}</td>
+                                            {[[volunteer.name,volunteer.sex,volunteer.age],[volunteer.phone,volunteer.mail,volunteer.address]].map((tr,index)=>
+                                                <tr key={"tr"+index}>
+                                                    {tr.map((td,index)=><td key={"td"+index} className="border border-info">{td}</td>)}
                                                 </tr>
+                                            )}
                                             </tbody>
                                         </Table>
-                                    </Card.Footer>
-                                </Card>
-                            </Col>
-                        )}</Row>
+                                    </div>
+                            </div>
+                        )}</div>
                     )}
-                </Container>
+
 
                 <Page onClick={(page:number)=>this.loadVolunteerList(page)} currentPage={this.state.page.currentPage} totalPage={this.state.page.totalPage} pageSize={this.state.page.pageSize}/>