Skip to content

Commit

Permalink
💄Allowance
Browse files Browse the repository at this point in the history
  • Loading branch information
@noeypatt
noeypatt committed Mar 31, 2020
1 parent 7ee6601 commit dab558c
Show file tree
Hide file tree
Showing 2 changed files with 102 additions and 30 deletions.
119 changes: 92 additions & 27 deletions pages/index/Allowance.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,14 +31,6 @@ const Allowance = () => {
title: "เบี้ยยังชีพที่ผู้สูงอายุจะได้รับ",
description: "การจ่ายเบี้ยยังชัพผู้สูงอายุแบบบันไดตามช่วงอายุ"
},
{
title: "กฎหมายผู้สูงอายุฉบับใหม่ให้สิทธิอะไรเพิ่มขึ้นบ้าง",
description: "กฎหมายผู้สูงอายุ ฉบับใหม่"
},
{
title: "การจัดสรรเงินช่วยเหลือ",
description: "หลักเกณฑ์ วิธีการ และเงื่อนไขในการจัดสรรเงินช่วยเหลือ"
}
])

const [status, setStatus] = useState(false)
Expand Down Expand Up @@ -66,9 +58,8 @@ const Allowance = () => {
}

const onChangeStep = current => {
console.log('onChange:', current);
setCurrent(current)
};
}

return (
<React.Fragment>
Expand All @@ -90,7 +81,7 @@ const Allowance = () => {
<div className="detail-content">
<Steps current={current} direction="vertical" onChange={onChangeStep}>
{data.map((item, index) => (
<Step key={index} title={item.title} description={item.descriptionn} />
<Step key={index} title={item.title} description={item.descriptionn} />
))
}
</Steps>
Expand All @@ -111,26 +102,100 @@ const Allowance = () => {
</Steps>
{
current == 0 ?
<img src="/static/cover-img.png" alt="current" />
<div className="data-detail-content">
{/* <img src="/static/box1.jpg" alt="img" /> */}
<div className="title-content">
<h6 className="header-title-content">เบี้ยยังชีพผู้สูงอายุ</h6>
<div className="sub-title-content">
<h6>คือ สวัสดิการขั้นพื้นฐานที่ภาครัฐจัดสรรไว้ให้กับผู้สูงอายุ เพื่อเป็นเงินช่วยเหลือ</h6>
<h6> และแบ่งเบาภาระค่าใช้จ่ายการดำรงชีวิตในแต่ละเดือน</h6>
</div>
</div>
</div>
:
null
current == 1 ?
<div className="data-detail-content">
{/* <img src="/static/box1.jpg" alt="img" /> */}
<div className="title-content">
<h6 className="header-title-content">ใครบ้างมีสิทธิได้รับเบี้ยยังชีพผู้สูงอายุ</h6>
<h6>คุณสมบัติของผู้ที่จะได้รับเงินช่วยเหลือต้องมีเกณฑ์ ดังต่อไปนี้</h6>
<div className="sub-title-content">
<h6>1. มีสัญชาติไทย</h6>
<h6>2. มีอายุ 59 ปีบริบูรณ์ขึ้นไป</h6>
<h6>3. ต้องไม่เคยได้รับสิทธิประโยชน์จากหน่วยงานของรัฐ หรือรัฐวิสาหกิจ</h6>
</div>
<h6 className="header-title-content">ตัวอย่างการคำนวณอายุ</h6>
<h6>การลงทะเบียนของปี 2560 ต้องเป็นผู้สูงอายุที่เกิดก่อนวันที่ 1 ตุลาคม 2501</h6>
<h6>ส่วนผู้สูงอายุที่ทะเบียนราษฎรระบุเฉพาะปีเกิด </h6>
<h6>ให้ถือว่าเกิดวันที่ 1 มกราคม ของปีนั้น ๆ</h6>
<h6 className="header-title-content">สิทธิประโยชน์จากหน่วยงานของรัฐ หรือรัฐวิสาหกิจ</h6>
<h6>ไม่ว่าจะเป็น เงินบำนาญ เบี้ยหวัด บำนาญพิเศษ รวมถึงเงินอื่น ๆ ในลักษณะเดียวกัน เช่น</h6>

}

{/* <div className="data-detail-content">
{
data.map((item, index) => (
<div className="title-content" key={index}>
<h6 className="header-title-content">{item.title}</h6>
<div className="sub-title-content">
<h6 >{item.text}</h6>
<h6 >{item.subtext}</h6>
<h6 >{item.subtext2}</h6>
<h6>- ผู้สูงอายุที่อยู่ในสถานสงเคราะห์ของรัฐ หรือองค์กรปกครองส่วนท้องถิ่น</h6>
<h6>- ผู้ที่ได้รับเงินเดือน ค่าตอบแทน รายได้ประจำ หรือผลประโยชน์ตอบแทนอย่างอื่น</h6>
<h6>ที่รัฐจัดให้เป็นประจำ</h6>
</div>
</div>
))
}
</div> */}
:
current == 2 ?
<div className="data-detail-content">
{/* <img src="/static/box1.jpg" alt="img" /> */}
<div className="title-content">
<h6 className="header-title-content">การลงทะเบียนรับเบี้ยยังชีพผู้สูงอายุ</h6>
<h6>สำหรับผู้สูงอายุที่มีคุณสมบัติตามเกณฑ์ที่กำหนด</h6>
<h6>สามารถไปลงทะเบียนรับเบี้ยยังชีพด้วยตัวเองได้ตั้งแต่วันที่ 1-30 พฤศจิกายน ของทุกปี</h6>
<div className="sub-title-content">
<h6>1. ผู้สูงอายุในกรุงเทพฯ ลงทะเบียน ณ สำนักงานเขตที่มีชื่ออยู่ในทะเบียนบ้าน</h6>
<h6>2. ผู้สูงอายุต่างจังหวัดยื่นได้ที่สำนักงานเทศบาล หรือองค์การบริหารส่วนตำบล (อบต.) </h6>
<h6 className="sub-content">ที่ผู้สูงอายุมีชื่ออยู่ในทะเบียนบ้าน</h6>
</div>
<h6 className="header-title-content">ช่องทางในการรับเงินเบี้ยยังชีพผู้สูงอายุ</h6>
<div className="sub-title-content">
<h6>1. รับเป็นเงินสดด้วยตนเอง</h6>
<h6>2. ให้ผู้แทนที่ได้รับมอบอำนาจรับแทน</h6>
<h6>3. โอนเข้าบัญชีธนาคารในนามของผู้สูงอายุ</h6>
<h6>4. โอนเข้าบัญชีธนาคารในนามของผู้แทนที่ได้รับมอบอำนาจจากผู้สูงอาย</h6>
</div>
</div>
</div>
:
current == 3 ?
<div className="data-detail-content">
{/* <img src="/static/box1.jpg" alt="img" /> */}
<div className="title-content">
<h6 className="header-title-content">หลักฐานในการลงทะเบียนรับเบี้ยยังชีพผู้สูงอายุ</h6>
<div className="sub-title-content">
<h6>1. บัตรประจำตัวประชาชนตัวจริงพร้อมสำเนา หรือบัตรอื่นที่ออก</h6>
<h6 className="sub-content">โดยหน่วยงานของรัฐที่มีรูปถ่าย</h6>
<h6>2. ทะเบียนบ้านตัวจริงพร้อมสำเนา</h6>
<h6>3. สมุดบัญชีเงินฝากธนาคารตัวจริงพร้อมสำเนา สำหรับผู้ขอรับเงินผ่านธนาคาร</h6>
</div>
<h6 className="header-title-content">กรณีที่ผู้สูงอายุไม่สามารถมาจดทะเบียนได้ด้วยตนเอง</h6>
<h6> สามารถมอบอำนาจเป็นลายลักษณ์อักษรให้ผู้อื่นเป็นผู้ยื่นคำขอขึ้นทะเบียนรับเงินแทนได้</h6>
<h6>โดยผู้แทนจะต้องมีหนังสือมอบอำนาจพร้อมสำเนาบัตรประจำตัวประชาชน</h6>
<h6>ของผู้รับมอบอำนาจมายื่นคำขอขึ้นทะเบียนด้วย</h6>
</div>
</div>
:
current == 4 ?
<div className="data-detail-content">
{/* <img src="/static/box1.jpg" alt="img" /> */}
<div className="title-content">
<h6 className="header-title-content">เบี้ยยังชีพที่ผู้สูงอายุจะได้รับ</h6>
<h6>ปัจจุบันการจ่ายเบี้ยยังชีพผู้สูงอายุ จะเป็นแบบขั้นบันไดตามช่วงอายุ</h6>
<h6>โดยผู้สูงอายุจะได้รับเงินช่วยเหลือเป็นรายเดือนต่อเนื่องไปจนกว่าจะเสียชีวิต </h6>
<h6>ซึ่งแบ่งได้ตามนี้</h6>
<div className="sub-title-content">
<h6>- ช่วงอายุ 60 - 69 ปี ได้รับเงิน 600 บาทต่อเดือน</h6>
<h6>- ช่วงอายุ 70 - 79 ปี ได้รับเงิน 700 บาทต่อเดือน</h6>
<h6>- ช่วงอายุ 80 - 89 ปี ได้รับเงิน 800 บาทต่อเดือน</h6>
<h6>- ช่วงอายุ 90 ปีขึ้นไป ได้รับเงิน 1,000 บาทต่อเดือน</h6>
</div>
</div>
</div>
:
null
}
</div>
</div>
}
Expand Down
13 changes: 10 additions & 3 deletions styles/index/allowance.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,13 +35,15 @@ $primary-color: #39b54a !important;
img {
height: 20rem;
margin-right: 1rem;
margin-bottom: 1rem;
@media (max-width: 575.98px) {
margin-right: 0;
height: 18rem;
}
}

.data-detail-content {
width: 50%;
margin-left: 2rem;
display: flex;
flex-direction: column;
Expand All @@ -59,11 +61,16 @@ $primary-color: #39b54a !important;
}

.header-title-content {
margin-top: 1rem;
font-weight: bold !important;
}

.sub-title-content {
margin-left: 1rem;

.sub-content {
margin-left: 1rem;
}
}

h6 {
Expand All @@ -89,7 +96,7 @@ $primary-color: #39b54a !important;
}

.ant-steps {
width: 70%;
width: 50%;
}

.ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-tail::after {
Expand All @@ -100,7 +107,7 @@ $primary-color: #39b54a !important;
flex-direction: column;
user-select: none;

.ant-steps-item-subtitle{
.ant-steps-item-subtitle {
margin-left: 0;
color: rgba(0, 0, 0, 0.65);
}
Expand Down Expand Up @@ -138,7 +145,7 @@ $primary-color: #39b54a !important;
color: $primary-color;
}

.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail::after{
.ant-steps-vertical > .ant-steps-item > .ant-steps-item-container > .ant-steps-item-tail::after {
height: 2rem;
background: $primary-color;
}
Expand Down

1 comment on commit dab558c

@vercel
Copy link

@vercel vercel bot commented on dab558c Mar 31, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to following URLs:

Please sign in to comment.