<template>
    <div class="modal fade" id="showContractLoan" aria-hidden="true" role="dialog" data-backdrop="static">
        <div class="modal-dialog modal-lg modal-dialog-scrollable">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title"></h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-span="Close"></button>
                </div>
                <div class="modal-body">
                    <div id="print-interest-contract" style="width: 198mm; margin: auto">
                        <div class="mortgage_loan">
                            <div class="mortgage_header">
                                <img src="images/logo.png" alt="" width="70px" class="position-absolute" style="top: 5px">
                                <div class="text-center">
                                    <h6 class="text_moul mb-2">ព្រះរាជាណាចក្រកម្ពុជា</h6>
                                    <h6 class="text_moul">ជាតិ សាសនា  ព្រះមហាក្សត្រ</h6>
                                    <img src="icons/contract.png" alt="">
                                    <p><u class="text_moul">កិច្ចសន្យាខ្ចីប្រាក់/បញ្ចាំ</u></p>
                                    <p class="mb-2"><u class="text_moul">កិច្ចសន្យានេះធ្វើឡើងរវាង</u></p>
                                </div>

                            </div>

                            <div class="mortgage_content">

                                <div class="d-flex justify-content-between">
                                    <div>
                                        <strong>លេខអ្នកសុំខ្ចី/បញ្ចាំ (CLIENT CID): {{ obj.client?.code }}</strong>
                                    </div>
                                    <div>
                                        <strong>កាលបរិច្ឆេទខ្ចីប្រាក់/បញ្ចាំៈថ្ងៃទី {{ obj.loan?.installment_date | onlyDay }} ខែ {{ obj.loan?.installment_date | onlyMonth }} ឆ្នាំ {{ obj.loan?.installment_date | onlyYear }}</strong>
                                    </div>
                                </div>

                                <p><strong><u>១.ភាគីឲ្យខ្ចីប្រាក់/ទទួលបញ្ចាំ៖</u></strong> <span class="text_moul"> TL </span>
                                    តំណាងពេញច្បាប់ដោយ
                                        <span v-if="obj.loan?.branch_id == 1" class="text_moul">{{ obj.repre_name }}</span>
                                        <span v-if="obj.loan?.branch_id == 2" class="text_moul">{{ obj.repre_name }}</span>

                                    ជាអ្នកអោយឥណទាន និងបញ្ចាំឯកជន ជាម្ចាស់បំណុល ឬបញ្ចាំ តទៅនេះហៅថាភាគី <span class="text_moul"><span class="text_moul">“ក”</span></span>។</p>

                                <p class="text_moul text-center">និង</p>

                                <p><strong><u>២.ភាគីសុំខ្ចីប្រាក់/ដាក់បញ្ចាំ៖</u></strong> ឈ្មោះ {{ obj.client?.name }} ភេទ {{ obj.client?.gender == 1 ? 'ប្រុស':'ស្រី' }}
                                    អាយុ <span v-if="obj.client?.date_of_birth">{{moment().diff(moment(obj.client.date_of_birth, 'YYYYMMDD'), 'years')}}</span>
                                    <span v-else>'............'</span> ឆ្នាំ
                                    សញ្ជាតិ ខ្មែរ
                                    កាន់<span v-if="obj.client?.type_document == 1">អត្តសញ្ញាណប័ណ្ណ</span>
                                    <span v-else-if="obj.client?.type_document == 2">សៀវភៅគ្រួសារ</span>
                                    <span v-else-if="obj.client?.type_document == 3">សៀវភៅស្នាក់នៅ</span>
                                    <span v-else-if="obj.client?.type_document == 4">លិខិតឆ្លងដែន</span>
                                    <span v-else>សំបុត្រកំណើត</span>
                                    លេខ {{ obj.client?.id_card || '........................................................'}}
                                    ចុះថ្ងៃទី <span v-if="obj.client?.create_card_date != null">{{ obj.client?.create_card_date | onlyDate }}</span><span v-else>........./.........../............. </span> ចេញដោយ {{ funIssuedBy(obj.client?.issued_by)}}
                                    មុខរបរផ្ទាល់ខ្លួន {{ obj.client?.occupation || '................................................' }} និងឈ្មោះ {{ obj.garuantor1?.name || '....................................' }}
                                    ភេទ <span v-if="obj.garuantor1?.name != null">{{ obj.garuantor1.gender == 1 ? 'ប្រុស':'ស្រី' }}</span><span v-else> .............</span>អាយុ {{ obj.garuantor1?.age || '............' }} ឆ្នាំ
                                    កាន់<span v-if="obj.garuantor1?.type_document == 1">អត្តសញ្ញាណប័ណ្ណ</span>
                                    <span v-else-if="obj.garuantor1?.type_document == 2">សៀវភៅគ្រួសារ</span>
                                    <span v-else-if="obj.garuantor1?.type_document == 3">សៀវភៅស្នាក់នៅ</span>
                                    <span v-else-if="obj.garuantor1?.type_document == 4">លិខិតឆ្លងដែន</span>
                                    <span v-else>សំបុត្រកំណើត</span>
                                    លេខ {{ obj.garuantor1?.id_card || '...........................................................' }}
                                    ចុះថ្ងៃទី <span v-if="obj.garuantor1?.create_card_date != null">{{ obj.garuantor1?.create_card_date | onlyDate }}</span><span v-else>........./.........../............. </span> ចេញដោយ {{ funIssuedBy(obj.garuantor1?.issued_by)}}
                                    ត្រូវជា {{ obj.garuantor1?.relationship || '................' }} ។
                                    អាស័យដ្ឋានបច្ចុបន្បៈផ្ទះលេខ...........ផ្លូវលេខ..........ក្រុមទី...........
                                    ភូមិ {{ obj.client?.village_kh || '.....................' }} ឃុំ/សង្កាត់ {{ obj.client?.commune_kh || '................................' }}
                                    ស្រុក/ខណ្ឌ/ក្រុង {{ obj.client?.district_kh || '......................................' }} ខេត្ត/រាជធានី {{ obj.client?.province_kh || '..............................' }} ។</p>

                                <p><strong>និងអ្នកធានាឈ្មោះ</strong> {{ obj.garuantor2?.name || '................................................................' }} ភេទ <span v-if="obj.garuantor2?.name !=null">{{ obj.garuantor2?.gender == 1 ? 'ប្រុស':'ស្រី' }}</span><span v-else>.............</span>
                                    អាយុ <span v-if="obj.garuantor2?.date_of_birth!=null">{{moment().diff(moment(obj.garuantor2.date_of_birth, 'YYYYMMDD'), 'years')}}</span>
                                    <span v-else>'............'</span> ឆ្នាំ
                                    សញ្ជាតិ ខ្មែរ
                                    កាន់<span v-if="obj.garuantor2?.type_document == 1">អត្តសញ្ញាណប័ណ្ណ</span>
                                    <span v-else-if="obj.garuantor2?.type_document == 2">សៀវភៅគ្រួសារ</span>
                                    <span v-else-if="obj.garuantor2?.type_document == 3">សៀវភៅស្នាក់នៅ</span>
                                    <span v-else-if="obj.garuantor2?.type_document == 4">លិខិតឆ្លងដែន</span>
                                    <span v-else>សំបុត្រកំណើត</span>
                                    លេខ {{ obj.garuantor2?.id_card || '........................................................' }}
                                    ចុះថ្ងៃទី  <span v-if="obj.garuantor2?.create_card_date != null">{{ obj.garuantor2?.create_card_date | onlyDate }}</span><span v-else>........./.........../............. </span> ចេញដោយ {{ funIssuedBy(obj.garuantor2?.issued_by)}}
                                    មុខរបរផ្ទាល់ខ្លួន {{ obj.garuantor2?.occupation || '................................................' }}
                                    និងឈ្មោះ {{ obj.garuantor3?.name || '................................................................' }} ភេទ <span v-if="obj.garuantor3?.name !=null">{{ obj.garuantor3?.gender == 1 ? 'ប្រុស':'ស្រី' }}</span><span v-else>.............</span>
                                    អាយុ <span v-if="obj.garuantor3?.date_of_birth!=null">{{moment().diff(moment(obj.garuantor3.date_of_birth, 'YYYYMMDD'), 'years')}}</span>
                                    <span v-else>'............'</span> ឆ្នាំ
                                    សញ្ជាតិ ខ្មែរ
                                    កាន់<span v-if="obj.garuantor3?.type_document == 1">អត្តសញ្ញាណប័ណ្ណ</span>
                                    <span v-else-if="obj.garuantor3?.type_document == 2">សៀវភៅគ្រួសារ</span>
                                    <span v-else-if="obj.garuantor3?.type_document == 3">សៀវភៅស្នាក់នៅ</span>
                                    <span v-else-if="obj.garuantor3?.type_document == 4">លិខិតឆ្លងដែន</span>
                                    <span v-else>សំបុត្រកំណើត</span>
                                    លេខ {{ obj.garuantor3?.id_card || '........................................................' }}
                                    ចុះថ្ងៃទី  <span v-if="obj.garuantor3?.create_card_date != null">{{ obj.garuantor3?.create_card_date | onlyDate }}</span><span v-else>........./.........../............. </span> ចេញដោយ {{ funIssuedBy(obj.garuantor3?.issued_by)}}
                                    មុខរបរផ្ទាល់ខ្លួន {{ obj.garuantor3?.occupation || '................................................' }}
                                    ត្រូវជា {{ obj.garuantor3?.relationship || '....................' }} ។
                                    អាស័យដ្ឋានបច្ចុបន្បៈផ្ទះលេខ...............ផ្លូវលេខ..................ក្រុមទី...........ភូមិ {{ obj.garuantor2?.village_kh || '...............................' }} ឃុំ/សង្កាត់ {{ obj.garuantor2?.commune_kh || '................................' }}
                                    ស្រុក/ខណ្ឌ/ក្រុង {{ obj.garuantor2?.district_kh || '................................' }} ខេត្ត/រាជធានី {{ obj.garuantor2?.province_kh || '......................' }} តទៅនេះហៅកាត់ថាភាគី <span class="text_moul">“ខ”</span>។</p>
                                <p class="text-center"><strong>ភាគី </strong> <span class="text_moul">“ក”</span> <strong>និងភាគី</strong> <span class="text_moul">“ខ”</span><strong>បានព្រមព្រៀងចុះកិច្ចសន្យាខ្ចីប្រាក់/ទទួលបញ្ចាំ ដោយអនុវត្តរាល់ប្រការទាំងឡាយដែលមានចែងខាងក្រោម៖</strong></p>

                                <div v-if="obj.realestate?.length > 0 || obj.motos?.length > 0" class="article">
                                    <p class="title"><strong><u>ប្រការរ១៖</u></strong></p>
                                    <p><strong>អំពីលក្ខខណ្ឌរួម</strong></p>
                                    <p>ផ្អែកលើមូលដ្ឋាននៃការស្នើសុំខ្ចីចងការប្រាក់ ឬសុំដាក់បញ្ចាំៈ ភាគី <span class="text_moul">“ក”</span>យល់ព្រមឲ្យភាគី <span class="text_moul">“ខ”</span>ខ្ចីចងការប្រាក់ ហើយភាគី<span class="text_moul">“ខ”</span>ក៏យល់ព្រមទទួល និងសន្យាសងមកភាគី <span class="text_moul">“ក”</span> វិញនូវប្រាក់ដើម និងការប្រាក់ គ្រប់ចំនួន និង រាល់លក្ខខណ្ឌដែលបានព្រមព្រៀងគ្នាដូចខាងក្រោមនេះ៖</p>
                                    <p class="title"><strong>១.១</strong></p>
                                    <p>ដើម្បីធានាបំណុល និងកាតព្វកិច្ចផ្សេងៗភាគី <span class="text_moul">“ខ”</span> បានដាក់ទ្រព្យបញ្ចាំៈ <input type="checkbox" class="ms-3"> កម្មសិទ្ឋិរបស់ខ្លួន <input type="checkbox" class="ms-2"> កម្មសិទ្ឋិរបស់អ្នកផ្សេង</p>

                                    <p class="title ps-4">✥</p>
                                    <p><strong>ទី១៖ អចលនទ្រព្យ (ប័ណ្ណកម្មសិទ្ធិ ដីលំនៅដ្ឋាន ដីស្រែ ដីចំការ...)</strong></p>

                                </div>

                                <!-- <table v-if="obj.realestate?.length > 0" class="table table-bordered border-secondary">
                                    <tbody>
                                        <tr>
                                            <td>ប្រភេទទ្រព្យតម្កល់</td>

                                            <th v-for="(item, index) in obj.realestate" :key="index">
                                                ទ្រព្យបញ្ចាំទី{{ index + 1 }}
                                            </th>
                                        </tr>
                                            <tr>
                                                <td>ប្រភេទទ្រព្យ</td>
                                                <td v-for="item in obj.realestate" :key="item.id">{{ item.model_type }}</td>
                                            </tr>
                                        <tr>
                                            <td>ម្ចាស់កម្មសិទ្ធិករ</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.collateral_owner }}</td>
                                        </tr>
                                        <tr>
                                            <td>ទីតាំងទ្រព្យ</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.location }}</td>
                                        </tr>
                                        <tr>
                                            <td>ទំហំ</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.size }}</td>
                                        </tr>
                                        <tr>
                                            <td>ខាងជើង</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.north }}</td>
                                        </tr>
                                        <tr>
                                            <td>ខាងត្បូង</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.south }}</td>
                                        </tr>

                                        <tr>
                                            <td>ខាងលិច</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.west }}</td>

                                        </tr>
                                        <tr>
                                            <td>ខាងកើត</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.east }}</td>
                                        </tr>
                                        <tr>
                                            <td>លេខឯកសារ</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.number }}</td>
                                        </tr>
                                        <tr>
                                            <td>កាលបរិច្ឆេទ</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.date_made }}</td>
                                        </tr>
                                        <tr>
                                            <td>ចេញដោយ</td>
                                            <td v-for="item in obj.realestate" :key="item.id">{{ item.full_details?.issued_by }}</td>
                                        </tr>
                                        <tr>
                                            <td>ផ្សេងៗ</td>
                                            <td></td>
                                            <td></td>
                                        </tr>
                                    </tbody>

                                </table> -->


                                <table v-if="obj.realestate?.length > 0" class="table table-bordered border-secondary">
                                    <tbody>
                                    <tr>
                                        <td>ប្រភេទទ្រព្យតម្កល់</td>
                                        <th v-for="(item, index) in obj.realestate" :key="item.id ?? index">
                                        ទ្រព្យបញ្ចាំទី{{ index + 1 }}
                                        </th>
                                    </tr>

                                    <tr v-for="field in fields" :key="field.key">
                                        <td>{{ field.label }}</td>
                                        <td v-for="item in obj.realestate" :key="item.id">
                                        {{ getFieldValue(item, field) }}
                                        </td>
                                    </tr>

                                    <tr>
                                        <td>ផ្សេងៗ</td>
                                        <td v-for="item in obj.realestate" :key="item.id"></td>
                                    </tr>
                                    </tbody>
                                </table>


                            <div v-if="obj.motos?.length > 0" class="article">
                                    <p class="title ps-4">✥</p>
                                    <p><strong>ទី២៖ ចលនទ្រព្យ (ប័ណ្ណសម្គាល់យានយន្តដូចជាម៉ូតូ ឡាន...)</strong></p>
                                </div>
                                <!-- <table v-if="obj.motos?.length > 0" class="table table-bordered border-secondary">
                                    <tbody>
                                        <tr>
                                            <td>ប្រភេទទ្រព្យតម្កល់</td>
                                             <th v-for="(item, index) in obj.motos" :key="index">
                                                ទ្រព្យបញ្ចាំទី{{ index + 1 }}
                                            </th>
                                        </tr>
                                        <tr>
                                            <td>ប្រភេទ</td>
                                            <td v-for="item in obj.motos" :key="item.id"> {{ checkStatusType(item.full_details?.status_type) }}</td>
                                        </tr>
                                        <tr>
                                            <td>ម៉ាក</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.model_type }}</td>
                                        </tr>
                                        <tr>
                                            <td>ពណ៌</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.color }}</td>
                                        </tr>
                                        <tr>
                                            <td>ផលិតឆ្នាំ</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.year }}</td>
                                        </tr>
                                        <tr>
                                            <td>ស្លាកលេខ</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.number_plate }}</td>
                                        </tr>
                                        <tr>
                                            <td>កំលាំង</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.strength }}</td>
                                        </tr>

                                        <tr>
                                            <td>លេខតួ/លេខសាក់ស៊ី</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.body_number }}</td>
                                        </tr>
                                        <tr>
                                            <td>លេខម៉ាស៊ីន</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.engine_number }}</td>
                                        </tr>
                                        <tr>
                                            <td>លតាប័ត្រលេខ</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.latabat }}</td>
                                        </tr>
                                        <tr>
                                            <td>កម្មសិទ្ធិករ</td>
                                            <td v-for="item in obj.motos" :key="item.id">{{ item.full_details?.collateral_owner }}</td>
                                        </tr>
                                    </tbody>

                                </table> -->

                                <table v-if="obj.motos?.length > 0" class="table table-bordered border-secondary">
                                    <tbody>
                                    <tr>
                                        <td>ប្រភេទទ្រព្យតម្កល់</td>
                                        <th v-for="(item, index) in obj.motos" :key="item.id ?? index">
                                        ទ្រព្យបញ្ចាំទី{{ index + 1 }}
                                        </th>
                                    </tr>

                                    <tr v-for="field in motoFields" :key="field.key">
                                        <td>{{ field.label }}</td>
                                        <td v-for="item in obj.motos" :key="item.id">
                                        {{ getFieldValue(item, field) }}
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>

                                <div class="article">
                                    <p class="title"> {{ (obj.realestate?.length > 0 || obj.motos?.length > 0)?'១.២':'១.១' }}</p>
                                    <p>ប្រាក់ខ្ចីចងការទិញរបស់របរប្រើប្រាស់ដែលភាគី <span class="text_moul">“ខ”</span> ទទួលបាន៖</p>

                                    <div class="article-list">
                                        <p class="title">-</p>
                                        <p>ជាលេខ {{ obj.loan?.loan_out | numberFomartValue }} (ជាអក្សរ {{ totalToword(obj.loan?.loan_out , obj.loan?.currency_id) }})។</p>
                                    </div>
                                    <div class="article-list">
                                        <p class="title">-</p>
                                        <p>រយៈពេលខ្ចីចងការប្រាក់/បញ្ចាំ {{ obj.loan?.period }} <input v-if="obj.loan?.term_type == 1" type="checkbox" class="ms-2" checked> <input v-else type="checkbox" class="ms-2"> ថ្ងៃ  <input v-if="obj.loan?.term_type == 2" checked type="checkbox" class="ms-2"> <input v-else type="checkbox" class="ms-2"> សប្តាហ៍ <input v-if="obj.loan?.term_type == 4" checked type="checkbox" class="ms-2"> <input v-else type="checkbox" class="ms-2"> ខែ។អត្រាការប្រាក់ {{ obj.loan?.interest }}%(ភាគរយ)
                                            <input v-if="obj.loan?.term_type == 1" checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> ក្នុងថ្ងៃ  <input v-if="obj.loan?.term_type == 2" checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> ក្នុងសប្តាហ៍ <input v-if="obj.loan?.term_type == 3" checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> ក្នុងពីរសប្តាហ៍  <input v-if="obj.loan?.term_type == 4 " checked type="checkbox" class="ms-2"><input type="checkbox" class="ms-2"> ក្នុងខែ                                            ។</p>
                                    </div>
                                    <div class="article-list">
                                        <p class="title">-</p>
                                        <p>របៀបសងប្រាក់៖ {{ funConditionPay(obj.loan?.condition_pay,obj.loan?.term_type)}}
                                            <input v-if="obj.loan?.term_type == 1" checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> ប្រចាំថ្ងៃ  <input v-if="obj.loan?.term_type == 2" checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> មួយសប្តាហ៍ <input v-if="obj.loan?.term_type == 3" checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> ពីរសប្តាហ៍  <input v-if="obj.loan?.term_type == 4 " checked type="checkbox" class="ms-2"><input v-else type="checkbox" class="ms-2"> មួយខែ
                                        </p>
                                    </div>

                                    <p class="title"> {{ (obj.realestate?.length > 0 || obj.motos?.length > 0)?'១.៣':'១.២' }}</p>
                                    <p>កន្លៃងបង់ប្រាក់៖ ប្រមូលដល់ផ្ទះ ឬ តាមប្រព័ន្ធធនាគារ</p>

                                    <p class="title"> {{ (obj.realestate?.length > 0 || obj.motos?.length > 0)?'១.៤':'១.៣' }}</p>
                                    <p>កំរៃសេវារដ្ឋបាល និងសេវាប្រតិបត្តិការ៖ ភាគី <span class="text_moul">“ខ”</span>យល់ព្រមបង់ប្រាក់កំរៃសេវារដ្ឋបាល និងសេវាប្រតិបត្តិការតាមគោលការណ៏កំណត់របស់ភាគី <span class="text_moul">“ក”</span> ។</p>

                                    <p class="title"> {{ (obj.realestate?.length > 0 || obj.motos?.length > 0)?'១.៥':'១.៤' }}</p>
                                    <p>ភាគី <span class="text_moul">“ខ”</span> អះអាងថា ទ្រព្យសម្បតិ្តដែលបានដាក់តម្កល់ ដូចដែលមានបញ្ជាក់ក្នុងប្រការមួយ ១.១ ខាងលើពិតជាកម្មសិទ្ធស្របច្បាប់ផ្ទាល់ខ្លួន ឬអ្នកដាក់តម្កល់ជំនួស ដោយពុំជាប់ពាក់ព័ន្ធអ្វីមួយ ឬជនណាមួយឡើយ ដែលធ្វើអោយបាត់បង់កាតព្វកិច្ចជាកម្មសិទ្ធករឡើយ ហើយបើផ្ទុយពីការអះអាងខាងលើ និងទទួលខុសត្រូវចំពោះមុខច្បាប់ជាធរមាន។</p>
                                </div>

                                <div class="article">
                                    <p class="title"><strong>ប្រការ២៖ </strong></p>
                                    <p><strong>អំពីលក្ខខណ្ឌពិសេស</strong></p>
                                    <p>ក្នុងករណីដែលភាគី <span class="text_moul">“ខ”</span> មិនបានអនុវត្តតាមកិច្ចសន្យាទទួលបញ្ចាំ ដូចមានចែងក្នុងប្រការ១ ចំនុច ១.១,១.២,១.៣,១.៤,១.៥ ខាងលើនេះទេ ភាគី <span class="text_moul">“ខ”</span>យល់ព្រមអោយភាគី <span class="text_moul">“ក”</span> អនុវត្តវិធានការដូចខាងក្រោម៖</p>
                                    <p class="title">២.១</p>
                                    <p>ក្នុងករណីកូនបំណុលយឺតយ៉ាវ មិនបានសងប្រាក់ទាន់ពេលវេលាតាមតារាងសងប្រាក់ កូនបំណុលសុខចិត្តបង់ប្រាក់ពិន័យចំនួន<strong>៣%</strong> នៃទឹកប្រាក់ដែលយឺត ដោយយឺតគិតចាប់ពីបួនថ្ងៃឡើងទៅ។</p>
                                    <p class="title">២.២</p>
                                    <p>ក្នុងករណីដែលភាគី  <span class="text_moul">“ខ”</span> បង្វិលប្រាក់ទៅអោយម្ចាល់បំណុលវិញទាំងអស់ ឬសងផ្តាច់មុនកាលកំណត់ ការប្រាក់ត្រូវបានគិតទាំងអស់តាមតារាងសងប្រាក់។</p>
                                    <p class="title">២.៣</p>
                                    <p>ក្នុងករណីដែលខកខានសងបំណុលតាមការកំណត់ក្នុងប្រការ១ កន្លងផុតរយៈពេល<strong>០៣ខែ</strong> ភាគី <span class="text_moul">“ខ”</span>សុខចិត្តលក់ទ្រព្យសម្បតិ្តរបស់ខ្លួន ដើម្បីទូទាត់បំណុល ឬអ្នកធានាបំណុលរបស់ខ្លួនសងជំនួស ឬភាគី <span class="text_moul">“ក”</span>កាត់កង ឬប្តឹងទៅតុលាការ ដើម្បីរឹបអូស ទ្រព្យសម្បតិ្ត ជាអចលនទ្រព្យ ចលនទ្រព្យដែលដាក់ធានា ឬទ្រព្យសម្បតិ្តផ្សេងៗទៀត ដូចជា ទំនិញ សន្និធិ ដែលមានក្រៅពីទ្រព្យដាក់ធានាលក់ឡាយឡុងដើម្បីកាត់យកមកទួទាត់បំណុលដែលនៅជំពាក់ទាំងអស់ រួមទាំងប្រាក់ដើម ការប្រាក់ សេវាផ្សេងៗ និងប្រាក់ពិន័យផងដែរ រហូតទាល់តែគ្រប់ចំនួន។</p>
                                    <p class="title">២.៤</p>
                                    <p>ក្នុងករណីដែលភាគី <span class="text_moul">“ខ”</span> មិនបានបង់ប្រាក់តាមកាលកំណត់ ឬមិនគោរពលក្ខខណ្ឌទាំងឡាយនៃកិច្ចសន្យានេះ ភាគី <span class="text_moul">“ក”</span> អាចប្តឹងទៅស្ថាប័នមានសមត្ថកិច្ច ដើម្បីទាមទារអោយសងប្រាក់ត្រឡប់មកវិញ ទោះបីមុនកាលកំណត់ក៍ដោយ។</p>
                                </div>
                                <div class="article">
                                    <p class="title"><strong>ប្រការ២៖ </strong></p>
                                    <p><strong>អំពីលក្ខខណ្ឌអវសាន</strong></p>
                                    <p> ភាគី <span class="text_moul">“ក”</span> និងភាគី <span class="text_moul">“ខ”</span> សន្យាគោរពយ៉ាងម៉ឺងម៉ាត់តាមរាល់ប្រការនៃ ខសន្យានានាខាងលើ។ក្នុងករណីមានការអនុវត្តផ្ទុយ ឬដោយរំលោភលើលក្ខខណ្ឌណាមួយនៃកិច្ចសន្យានេះ ភាគីដែលល្មើសត្រូវទទួលខុសត្រូវចំពោះមុខច្បាប់ជាធរមាន។ រាល់សោហ៊ុយចំណាយទាក់ទងក្នុងការដោះស្រាយលើវីវាទជាបន្ទុករបស់ភាគីដែលរំលោភលើកិច្ចសន្យា។
                                        កិច្ចសន្យានេះត្រូវបានធ្វើឡើង ដោយមានការព្រមព្រៀងពិតប្រាកដ និងដោយស្មើភាពគ្មានការបង្ខិតបង្ខំពីភាគីណាមួយឡើយ ហើយ មានប្រសិទ្ធភាពចាប់ពីថ្ងៃចុះហត្ថលេខា និងផ្តិតមេដៃនេះតទៅ។
                                    </p>
                                </div>
                                <p class="text-center"><span class="me-3">✥</span> កិច្ចសន្យានេះត្រូវបានធ្វើឡើងជា <strong>០២ច្បាប់</strong> ជាភាសាខ្មែរ ដើម្បីតម្កល់ទុកនៅៈ</p>
                                <div class="d-flex justify-content-center">
                                    <div>
                                        <p>-	ភាគី <span class="text_moul">“ក”</span>.................................................០១(ច្បាប់ដើម)</p>
                                        <p>-	ភាគី <span class="text_moul">“ខ”</span>.................................................០១(ច្បាប់ដើមចម្លង)</p>
                                    </div>
                                </div>
                                <br>
                                <div class="row page-avoid text-center">
                                    <div class="col-4">
                                        <p class="text_moul">ស្នាមមេដៃស្តាំភាគី <span class="text_moul">“ខ”</span></p>
                                        <div class="d-flex justify-content-around">
                                            <p class="text_moul">អ្នកខ្ចី</p>
                                            <p class="text_moul">អ្នករួមខ្ចី</p>
                                        </div>
                                        <br>
                                        <br>
                                        <br>
                                        <br>
                                        <div class="d-flex justify-content-around">
                                            <p class="text_moul">{{ obj.client?.name }}</p>
                                            <p class="text_moul">{{ obj.garuantor1?.name || '.........................' }}</p>
                                        </div>
                                    </div>
                                    <div class="col-4">
                                        <p class="invisible">.</p>
                                        <p class="text_moul">អ្នកធានា/បញ្ចាំជំនួស</p>
                                        <br>
                                        <br>
                                        <br>
                                        <br>
                                        <p class="text_moul">{{ obj.garuantor2?.name || '.........................' }}</p>
                                        <!-- <p>{{ obj.garuantor3?.name || '.........................' }}</p> -->
                                    </div>
                                    <div class="col-4">
                                        <p class="text_moul">តំណាងភាគី <span class="text_moul">“ក”</span></p>
                                        <p class="text_moul">ហត្ថលេខា និងត្រា</p>
                                        <br>
                                        <br>
                                        <br>
                                        <br>
                                        <p>.................................</p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-bs-dismiss="modal">{{ $t("Close") }}</button>
                    <button type="button" class="btn btn-primary" @click="printP">
                        {{$t('Print')}}
                    </button>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    var moment = require("moment");
    import {currencyToWord } from "number_to_khmer_word";
    export default {
        props:['obj'],
        data(){
            return{
                moment : moment,
                currencyToWord : currencyToWord,

                fields: [
                    { key: 'model_type', label: 'ប្រភេទទ្រព្យ', top: true },
                    { key: 'collateral_owner', label: 'ម្ចាស់កម្មសិទ្ធិករ' },
                    { key: 'location', label: 'ទីតាំងទ្រព្យ' },
                    { key: 'size', label: 'ទំហំ' },
                    { key: 'north', label: 'ខាងជើង' },
                    { key: 'south', label: 'ខាងត្បូង' },
                    { key: 'west', label: 'ខាងលិច' },
                    { key: 'east', label: 'ខាងកើត' },
                    { key: 'number', label: 'លេខឯកសារ' },
                    { key: 'date_made', label: 'កាលបរិច្ឆេទ' },
                    { key: 'issued_by', label: 'ចេញដោយ' },
                ],
                motoFields: [
                    { key: 'status_type', label: 'ប្រភេទ', format: this.checkStatusType },
                    { key: 'model_type', label: 'ម៉ាក', top: true },
                    { key: 'color', label: 'ពណ៌' },
                    { key: 'year', label: 'ផលិតឆ្នាំ' },
                    { key: 'number_plate', label: 'ស្លាកលេខ' },
                    { key: 'strength', label: 'កំលាំង' },
                    { key: 'body_number', label: 'លេខតួ/លេខសាក់ស៊ី' },
                    { key: 'engine_number', label: 'លេខម៉ាស៊ីន' },
                    { key: 'latabat', label: 'លតាប័ត្រលេខ' },
                    { key: 'collateral_owner', label: 'កម្មសិទ្ធិករ' },
                ],
            }
        },
        methods: {
            getFieldValue(item, field) {
            const raw = field.top
                ? item[field.key]
                : (item.full_details || {})[field.key];
            return field.format ? field.format(raw) : raw;
            },
            checkStatusType(status_type){
                if(status_type == 3){
                    return 'ឡាន'
                }else{
                    return 'ម៉ូតូ'
                }
            },
            printP() {
                this.$htmlToPaper("print-interest-contract", {
                    styles: ["/css/app.css", "/css/print/mortgage-loan.css"],
                });
            },
            funDate(date) {
                if(date){
                    return "ថ្ងៃទី" + moment(date).format("DD") + " ខែ" + this.funMonth(moment(date).format("MMM")) + " ឆ្នាំ" + moment(date).format("YYYY");
                } else {
                    return 'ថ្ងៃទី................... ខែ................... ឆ្នាំ...................'
                }
            },
            funConditionPay(ConPay,status){
                if(ConPay==1){
                    return 'បង់ប្រចាំ'+this.funTerm(status)+'ថេរ';
                }else if(ConPay==2){
                    return 'បង់រំលោះប្រចាំ'+this.funTerm(status)+'ថយ(ដើមថេរ)';
                }else if(ConPay==3){
                    return 'បង់ប្រាក់ដើមនិងការប្រាក់ថេរ'+this.funTerm(status);
                }else if(ConPay==4){
                    return 'បង់តែការប្រាក់ប្រចាំ'+this.funTerm(status);
                }
            },
            funMonth(mon) {
                if (mon == "Jan") {
                    return "មករា";
                } else if (mon == "Feb") {
                    return "កុម្ភៈ";
                } else if (mon == "Mar") {
                    return "មីនា";
                } else if (mon == "Apr") {
                    return "មេសា";
                } else if (mon == "May") {
                    return "ឧសភា";
                } else if (mon == "Jun") {
                    return "មិថុនា";
                } else if (mon == "Jul") {
                    return "កក្កដា";
                } else if (mon == "Aug") {
                    return "សីហា";
                } else if (mon == "Sep") {
                    return "កញ្ញា";
                } else if (mon == "Oct") {
                    return "តុលា";
                } else if (mon == "Nov") {
                    return "វិច្ឆិកា";
                } else if (mon == "Dec") {
                    return "ធ្នូ";
                }
            },
            funTypeCard(card) {
                if (card == 1) {
                    return "អត្តសញ្ញាណប័ណ្ណ";
                } else if (card == 2) {
                    return "សៀវភៅគ្រួសារ";
                } else if (card == 3) {
                    return "សៀវភៅស្នាក់នៅ";
                } else if (card == 4) {
                    return "លិខិតឆ្លងដែន";
                } else {
                    return "សំបុត្រកំណើត";
                }
            },
            funIssuedBy(value) {
                if (value == 1) {
                    return "ក្រសួងមហាផ្ទៃ";
                } else if (value == 2) {
                    return "អធិការដ្ឋាន,ប៉ុស្តិ៍រដ្ឋបាល";
                } else if (value == 3) {
                    return "មន្រ្តីអត្រានុកូលដ្ឋាន";
                } else if (value == 4) {
                    return "មេភូមិ,ចៅសង្កាត់";
                }
                else {
                    return "................................................";
                }
            },
            funTerm(status){
                if(status==1){
                    return 'ថ្ងៃ';
                }else if(status==2){
                    return 'សប្ដាហ៍';
                }else if(status==3){
                    return 'កន្លះខែ';
                }else if(status==4){
                    return 'ខែ';
                }
            },
            totalToword(loan_out,currency_id) {
                if (currency_id == 1) {
                    if (loan_out) {
                        return currencyToWord(loan_out, "KHR").slice(1).replace(/-/g, "");
                    } else {
                        return currencyToWord(0, "KHR").slice(1);
                    }
                } else {
                    if (loan_out) {
                        return currencyToWord(loan_out, "USD")
                            .slice(1)
                            .replace(/-/g, " ")
                            .replace(/ ដុល្លារ គត់/, " ដុល្លារសហរដ្ឋអាមេរិចគត់");
                    } else {
                        return currencyToWord(0, "USD").slice(1);
                    }
                }
            },
        }
    }
</script>

<style lang="scss" scoped>
    .article{
        position: relative;
        padding-left: 58px;
        .title{
            position: absolute;
            left: 0;
        }
    }
    .article-list{
        position: relative;
        padding-left: 10px;
        .list{
            position: absolute;
            left: 0;
        }
    }
    .border-box{
        border: 1px solid #000;
        width: 80px;
        height: 100px;
    }
</style>
