From a460e34fae94dae490d0f33c785af6fe044e1a0c Mon Sep 17 00:00:00 2001
From: cocoapi <eksrns22tp@gmail.com>
Date: Fri, 4 Aug 2017 00:19:10 -0700
Subject: [PATCH] =?UTF-8?q?=ED=9A=8C=EC=9B=90=EB=B3=B4=EA=B8=B0=20?=
 =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=88=98=EC=A0=95=20#39?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

컴포넌트를 별도로 만들지않고 Antd내의 Table컴포넌트로 수정 및 구현
회비납부를 스케치에 따라 셀렉트형태로 변경
---
 src/container/evee/Members.js | 117 +++++++++++++++++++++-------------
 1 file changed, 71 insertions(+), 46 deletions(-)

diff --git a/src/container/evee/Members.js b/src/container/evee/Members.js
index a804420..71bc10a 100644
--- a/src/container/evee/Members.js
+++ b/src/container/evee/Members.js
@@ -1,18 +1,83 @@
 import React, { Component } from 'react'
-import { Select } from 'antd'
+import { Select, Table } from 'antd'
 
 const Option = Select.Option
 
-const user = {
+const users = [{
   name: '13기 송민준',
+  active: '-',
+  attend: '불참',
+  payment: '납',
   grade: '정회원',
-}
+  disciplinary: '-',
+}, {
+  name: '16기 김성우',
+  active: '-',
+  attend: '참',
+  payment: '납',
+  grade: '정회원',
+  disciplinary: '-',
+}]
 
 function handleChange(value) {
-  user.grade = value;
-  console.log(user.grade);
+  users.grade = value;
 }
 
+function payChange(value) {
+  users.payment = value;
+}
+
+const columns = [{
+  title: '기수 이름',
+  dataIndex: 'name',
+  key: 'name',
+  render: text => <a href="#"> {text} </a>,
+}, {
+  title: '활동여부',
+  dataIndex: 'active',
+  key: 'active',
+  render: text => <a href="#"> {text} </a>,
+}, {
+  title: '회의참석',
+  dataIndex: 'attend',
+  key: 'attend',
+  render: text => <a href="#"> {text} </a>,
+}, {
+  title: '회비납부',
+  dataIndex: 'payment',
+  key: 'payment',
+  render: text => (
+    <Select
+      defaultValue={text}
+      style={{ width: 80 }}
+      onChange={payChange}
+    >
+      <Option value="납">  납 </Option>
+      <Option value="미납">  미납 </Option>
+    </Select>
+    ),
+}, {
+  title: '회원등급',
+  dataIndex: 'grade',
+  key: 'grade',
+  render: text => (
+    <Select
+      defaultValue={text}
+      style={{ width: 120 }}
+      onChange={handleChange}
+    >
+      <Option value="준회원">  준회원 </Option>
+      <Option value="정회원">  정회원 </Option>
+      <Option value="임원">  임원 </Option>
+    </Select>
+    ),
+}, {
+  title: '징계',
+  dataIndex: 'disciplinary',
+  key: 'disciplinary',
+  render: text => <h1> {text} </h1>,
+}]
+
 class Members extends Component {
   render() {
     return (
@@ -22,47 +87,7 @@ class Members extends Component {
           <h1> 회원목록 </h1>
         </div>
         <div style={{ display: 'flex', flexDirection: 'column', padding: '8px', width: '944px', height: '80%', outline: 'solid black 1px' }}>
-          <div style={{ height: '5%', display: 'flex', flexDirection: 'row' }}>
-            <div style={{ width: '25%' }}>
-              <a> 기수 이름 </a>
-            </div>
-            <div style={{ width: '15%' }}>
-              <a> 활동여부</a>
-            </div>
-            <div style={{ width: '15%' }}>
-              <a> 회의참석</a>
-            </div>
-            <div style={{ width: '15%' }}>
-              <a> 회비납부</a>
-            </div>
-            <div style={{ width: '15%' }}>
-              <a> 회원등급</a>
-            </div>
-            <div style={{ width: '15%' }}>
-              <a> 징계</a>
-            </div>
-          </div>
-          <div style={{ height: '5%', display: 'flex', flexDirection: 'row' }}>
-            <div style={{ width: '25%' }}>
-              <a> {user.name} </a>
-            </div>
-            <div style={{ width: '15%' }} />
-            <div style={{ width: '15%' }} />
-            <div style={{ width: '15%' }} />
-            <div style={{ width: '15%' }}>
-              <Select
-                size="small"
-                defaultValue={user.grade}
-                style={{ width: 80 }}
-                onChange={handleChange}
-              >
-                <Option value="준회원"> 준회원 </Option>
-                <Option value="정회원"> 정회원 </Option>
-                <Option value="임원"> 임원</Option>
-              </Select>
-            </div>
-            <div style={{ width: '15%' }} />
-          </div>
+          <Table columns={columns} dataSource={users} />
         </div>
       </div>
     )