leasepal-home/src/pages/H5/Join/JobDetail.vue

<template>
    <div class="job-detail">
        <div class="job-detail-title">
            เจ้าหน้าที่ตรวจสอบสินเชื่อ
        </div>
        <div class="job-detail-logo">
            <img class="gojob_logo" src="../../../assets/images/job_logo.png" alt="" />
        </div>
        <div class="job-content">
            <div class="job-content-item" v-for="item in list">
                <div class="job-content-item-title">
                    {{ item.title }}
                </div>
                <div class="job-content-item-detail">
                    <div class="job-content-item-detail-item" v-for="i in item.content">
                        {{ i }}
                    </div>
                </div>

            </div>
            <div class="job-content-item">
                <div class="job-content-item-title">
                    ช่องทางติดต่อ
                </div>
                <div class="job-content-item-detail">
                    <div class="job-content-item-detail-item" v-for="item in userInfo">
                        <div class="job-content-item-detail-label">
                            {{ item.label }}
                        </div>
                        <div class="job-content-item-detail-content">
                            {{ item.content }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script lang="ts" setup name="join">
import { ref } from 'vue';
const list = [{
    title: 'รายละเอียดงาน',
    content: [
        '1、ตรวจสอบและวิเคราะห์คุณสมบัติของลูกค้าตามเกณฑ์ที่กำหนด ก่อนอนุมัติสินเชื่อ',
        '2、ประเมินเอกสารและข้อมูลทางการเงิน เช่น บัตรประจำตัวประชาชน เอกสารการเงิน และประวัติการกู้ยืม',
        '3、ตัดสินใจอนุมัติหรือปฏิเสธคำขอเช่าตามนโยบายความเสี่ยงของบริษัท',
        '4、ตรวจสอบความถูกต้องของสัญญาเช่าและกระบวนการอนุมัติ เพื่อให้แน่ใจว่าสอดคล้องกับมาตรฐานและข้อกำหนดของบริษัท',
        '5、รายงานความเสี่ยงและแนวโน้มที่อาจเกิดขึ้น พร้อมทั้งเสนอวิธีป้องกันหรือปรับปรุงกระบวนการ'
    ]
}, {
    title: 'คุณสมบัต',
    content: [
        '1. ปริญญาตรีขึ้นไป สาขาการเงิน เศรษฐศาสตร์ การจัดการความเสี่ยง สถิติศาสตร์ หรือสาขาอื่นที่เกี่ยวข้องจะพิจารณาเป็นพิเศษ',
        '2. มีประสบการณ์ทำงานด้านการตรวจสอบความเสี่ยง การประเมินเครดิต หรืออุตสาหกรรมการเงินอย่างน้อย 1 ปี ผู้ที่มีประสบการณ์ในอุตสาหกรรมเช่า สินเชื่อขนาดเล็ก หรือธนาคารจะได้รับการพิจารณาเป็นพิเศษ',
        '3. เข้าใจกระบวนการจัดการความเสี่ยงและแบบจำลองการประเมินเครดิต รวมถึงกฎหมายที่เกี่ยวข้อง',
        '4. มีความสามารถในการวิเคราะห์ข้อมูลและความไวต่อความเสี่ยง สามารถประเมินความเสี่ยงได้ด้วยตัวเองได้เป็นอย่างด',
        '5. มีความชำนาญในการใช้โปรแกรมสำนักงาน และมีประสบการณ์ในการใช้งานระบบจัดการความเสี่ยงจะได้รับการพิจารณาเป็นพิเศษ',
    ]
}, {
    title: 'วิธีการสมัคร',
    content: [
        'กรุณาส่งเรซูเม่ของคุณมาที่อีเมลล โดยระบุหัวข้ออีเมลเป็น “ชื่อตำแหน่งงาน + ชื่อของคุณ” หรือสามารถติดต่อเราผ่านทางโทรศัพท์หรือ Line เพื่อขอข้อมูลเพิ่มเติม'
    ]
}]

const userInfo = [{
    label: 'ที่อยู่:',
    content: '135/21 อาคารอามรพันธุ์ 205 ทาวเวอร์ 2 ชั้น 9 ซอยนาทอง ถนนรัชดาภิเษก แขวงดินแดง เขตดินแดง กรุงเทพ 10400 สาขา 00001'
}, {
    label: 'Tel:',
    content: '0888000282'
}, {
    label: 'Line:',
    content: '@octop'
}, {
    label: 'E-mail:',
    content: 'Job@octoprental.com'
}]

</script>

<style scoped lang="scss">
.job-detail {
    width: 100%;
    margin: 50px 0 0;
    min-height: 80vh;
    max-width: 750px;
    margin: 0 auto;
    min-height: 80vh;
    background-color: #fff;
    padding: 20px;

    .job-detail-title {
        font-family: Prompt, Prompt;
        font-weight: bold;
        font-size: 16px;
        color: #333333;
    }

    .job-detail-logo {
        width: 70px;
        margin-top: 8PX;
    }

    .job-content {
        .job-content-item {
            margin-top: 20px;

            .job-content-item-title {
                font-weight: 500;
                font-size: 14px;
                color: #333333;
                position: relative;
                padding-left: 8px;

                &::before {
                    position: absolute;
                    content: '';
                    height: 12px;
                    width: 3px;
                    background: #267FFA;
                    border-radius: 15px;
                    top: 5px;
                    left: 0;

                }
            }

            .job-content-item-detail {
                margin-top: 8px;

                .job-content-item-detail-item {
                    font-weight: 300;
                    font-size: 13px;
                    color: #000000;
                    line-height: 25px;
                    display: flex;
                    align-items: baseline;

                    .job-content-item-detail-label {
                        font-weight: 400;
                        font-size: 13px;
                        color: #000000;
                        width: 50px;
                    }

                    .job-content-item-detail-content {
                        font-family: Prompt, Prompt;
                        font-weight: 300;
                        font-size: 13px;
                        color: #000000;
                        width: calc(100% - 80px);
                    }
                }
            }


        }
    }
}
</style>