Commit 8a84ead3 authored by sippakorn.ji's avatar sippakorn.ji
Browse files

implement UW Report GLS screen using Aura component and

implement Survey Screen using Aura component
No related merge requests found
Showing with 1482 additions and 3 deletions
+1482 -3
<aura:documentation>
<aura:description>Documentation</aura:description>
<aura:example name="ExampleName" ref="exampleComponentName" label="Label">
Example Description
</aura:example>
</aura:documentation>
\ No newline at end of file
<aura:component
implements="force:lightningQuickActionWithoutHeader,force:hasRecordId,flexipage:availableForAllPageTypes,lightning:actionOverride"
controller="SurveyScreenController" access="global">
<aura:attribute name="caseId" type="String" />
<aura:attribute name="question" type="String" />
<aura:attribute name="score" type="String" default="" />
<aura:attribute name="name" type="String" default="" />
<aura:attribute name="comment" type="String" default="" />
<aura:attribute name="errorMessage" type="String" default="" />
<aura:attribute name="radioOptions" type="List" default="" />
<aura:handler name="init" value="{! this }" action="{! c.doInit }" />
<div class="slds-m-around_large"
style="width: 50%; margin-left: auto; margin-right: auto; margin-top: 10%; padding:30px;">
<lightning:card title=" ">
<h1
style="background-color: #fff176; font-size: 18px; margin-left: 1rem; margin-right: 1rem; padding: 1rem; border-radius: 0.5rem;">
⭐แบบสอบถาม: {!v.question}
</h1>
<div class="slds-grid slds-wrap slds-p-around_medium">
<!-- ฝั่งซ้าย: Radio button คะแนน -->
<div class="slds-col slds-size_1-of-2">
<label class="slds-form-element__label" for="scoreRadioGroup">
<span style="color: red;">*</span> คะแนน
</label>
<lightning:radioGroup name="score" aura:id="scoreRadioGroup" options="{! v.radioOptions }"
value="{! v.score }" />
</div>
<!-- ฝั่งขวา: ชื่อผู้ทำแบบสอบถาม และ Additional Comment -->
<div class="slds-col slds-size_1-of-2 slds-p-left_medium">
<lightning:input label="ชื่อผู้ทำแบบสอบถาม " name="name" value="{! v.name }" required="true"
messageWhenValueMissing="กรุณากรอกชื่อ" />
<lightning:textarea label="💬 Additional Comment" name="comment" value="{! v.comment }"
placeholder="เขียนความคิดเห็นเพิ่มเติม..." class="slds-m-top_medium" />
</div>
</div>
<!-- แสดง Error Message -->
<aura:if isTrue="{! v.errorMessage }">
<div class="slds-text-color_error slds-p-around_medium slds-text-align_right">
{! v.errorMessage }
</div>
</aura:if>
<!-- ปุ่ม Submit -->
<div class="slds-p-around_medium slds-text-align_right">
<lightning:button label="submit" variant="brand" onclick="{! c.handleSubmit }" />
</div>
<!-- banner -->
<div class="slds-p-around_medium slds-text-align_center">
<img src="{!$Resource.DLA_Banner}" alt="Survey Banner"
/>
</div>
</lightning:card>
<!-- <img src="{!$Resource.DLA_Banner}" alt="Survey Banner"
style="position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 1000; max-width: 100%; height: auto;" /> -->
</div>
</aura:component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>63.0</apiVersion>
<description>A Lightning Component Bundle</description>
</AuraDefinitionBundle>
.THIS {
}
.THIS .form-container {
/* max-width: 50%; */
/* width: 25%; */
margin-left: 2000px;
padding:300px;
margin-right: 2000px;
}
/* หา header ของ lightning:card โดย class slds-card__header */
.THIS .myCard .slds-card__header {
background-color: #FFEB3B; /* สีเหลือง (Yellow 500) */
}
/* ปรับสีตัวหนังสือ header ด้วย (ถ้าต้องการ) */
.THIS .myCard .slds-card__header-title {
color: #000000; /* สีดำ */
}
\ No newline at end of file
<design:component >
</design:component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M120,108 C120,114.6 114.6,120 108,120 L12,120 C5.4,120 0,114.6 0,108 L0,12 C0,5.4 5.4,0 12,0 L108,0 C114.6,0 120,5.4 120,12 L120,108 L120,108 Z" id="Shape" fill="#2A739E" />
<path d="M77.7383308,20 L61.1640113,20 L44.7300055,63.2000173 L56.0543288,63.2000173 L40,99.623291 L72.7458388,54.5871812 L60.907727,54.5871812 L77.7383308,20 Z" id="Path-1" fill="#FFFFFF" />
</g>
</svg>
\ No newline at end of file
({
doInit: function (component, event, helper) {
try {
const caseId = component.get("v.recordId") || helper.getUrlParam("id");
component.set("v.caseId", caseId);
console.log("caseId aura :" + caseId);
// เรียก picklist values จาก Apex
const action = component.get("c.getSurveyPicklistValues");
action.setCallback(this, function (response) {
try {
if (response.getState() === "SUCCESS") {
const values = response.getReturnValue();
const options = values.map(val => ({ label: val, value: val }));
component.set("v.radioOptions", options);
} else {
const errors = response.getError();
console.error("Picklist Load Error:", errors);
component.set("v.errorMessage", "ไม่สามารถโหลดตัวเลือกคะแนนได้");
}
} catch (innerErr) {
console.error("Mapping Picklist Error:", innerErr);
component.set("v.errorMessage", "เกิดข้อผิดพลาดในการประมวลผลคะแนน");
}
});
$A.enqueueAction(action);
// เรียกคำถามจาก Survey Master
helper.fetchQuestion(component, caseId);
} catch (err) {
console.error("doInit Error:", err);
component.set("v.errorMessage", "เกิดข้อผิดพลาดขณะโหลดข้อมูลแบบสอบถาม");
}
}
,
handleSubmit: function (component, event, helper) {
helper.submitSurvey(component);
}
})
// doInit: function (component, event, helper) {
// const caseId = component.get("v.recordId") || helper.getUrlParam("id");
// component.set("v.caseId", caseId);
// console.log("caseId aura :" + caseId);
// // ตั้งค่า radio 1-5
// component.set("v.radioOptions", [
// { label: '1: ควรปรับปรุง', value: '1: ควรปรับปรุง' },
// { label: '2: พอใช้', value: '2: พอใช้' },
// { label: '3: ปานกลาง', value: '3: ปานกลาง' },
// { label: '4: ดี', value: '4: ดี' },
// { label: '5: ดีมาก', value: '5: ดีมาก' }
// ]);
// helper.fetchQuestion(component, caseId);
// },
\ No newline at end of file
({
fetchQuestion: function (component, caseId) {
try {
const action = component.get("c.getQuestion");
action.setParams({ caseId: caseId });
action.setCallback(this, function (response) {
const state = response.getState();
if (state === "SUCCESS") {
component.set("v.question", response.getReturnValue());
} else {
console.error("Failed to fetch question:", response.getError());
component.set("v.errorMessage", "ไม่สามารถดึงคำถามได้");
}
});
$A.enqueueAction(action);
} catch (error) {
console.error("Unexpected error in fetchQuestion:", error);
component.set("v.errorMessage", "เกิดข้อผิดพลาดขณะโหลดคำถาม");
}
},
submitSurvey: function (component) {
try {
const caseId = component.get("v.caseId");
const score = component.get("v.score");
const name = component.get("v.name");
const comment = component.get("v.comment");
const question = component.get("v.question");
if (!score || !name) {
component.set("v.errorMessage", "กรุณากรอกชื่อและเลือกคะแนน");
return;
}
const action = component.get("c.submitSurvey");
action.setParams({ caseId, score, name, comment,question });
action.setCallback(this, function (response) {
const state = response.getState();
if (state === "SUCCESS") {
component.set("v.errorMessage", "");
alert("ส่งแบบสอบถามเรียบร้อยแล้ว");
} else {
const errors = response.getError();
console.error("Submit failed:", errors);
component.set("v.errorMessage", "ไม่สามารถส่งแบบสอบถามได้");
}
});
$A.enqueueAction(action);
} catch (error) {
console.error("Unexpected error in submitSurvey:", error);
component.set("v.errorMessage", "เกิดข้อผิดพลาดขณะส่งแบบสอบถาม");
}
},
getUrlParam: function (param) {
try {
const url = new URL(window.location.href);
return url.searchParams.get(param);
} catch (error) {
console.error("Error parsing URL param:", error);
return null;
}
}
});
\ No newline at end of file
({
// Your renderer method overrides go here
})
\ No newline at end of file
<aura:application access="GLOBAL" extends="ltng:outApp">
<aura:dependency resource="c:SurveyScreen"/>
</aura:application>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>64.0</apiVersion>
<description>A Lightning Component Bundle</description>
</AuraDefinitionBundle>
({
myAction : function(component, event, helper) {
}
})
\ No newline at end of file
......@@ -146,9 +146,9 @@
component.set('v.productInfo_columns', [
{ label: 'Product Code', fieldName: 'productCode', type: 'text', sortable: true, wrapText: true },
{ label: 'Product Name', fieldName: 'productName', type: 'text', sortable: true, wrapText: true },
{ label: 'Sum Assured', fieldName: 'sumAssured', type: 'number', cellAttributes: { alignment: 'right' }, sortable: true, wrapText: true },
{ label: 'Sum Assured', fieldName: 'sumAssured', type: 'number', cellAttributes: { alignment: 'left' }, sortable: true, wrapText: true },
{ label: 'Benefit/Premium Term', fieldName: 'benefitPremiumTerm', type: 'text', sortable: true, wrapText: true },
{ label: 'Standard Installment Premium', fieldName: 'standardInstallmentPremium', type: 'number', cellAttributes: { alignment: 'right' }, sortable: true, wrapText: true }
{ label: 'Standard Installment Premium', fieldName: 'standardInstallmentPremium', type: 'number', cellAttributes: { alignment: 'left' }, sortable: true, wrapText: true }
]);
component.set('v.productInfo_data', [
......@@ -211,7 +211,7 @@
{ label: 'Gender', fieldName: 'gender', type: 'text', sortable: true, wrapText: true },
{ label: 'Underwriting Decision Code', fieldName: 'underwritingDecisionCode', type: 'text', sortable: true, wrapText: true },
{ label: 'Impairment Code', fieldName: 'impairmentCode', type: 'text', sortable: true, wrapText: true },
{ label: 'Sequence No.', fieldName: 'sequenceNo', type: 'number', cellAttributes: { alignment: 'right' }, sortable: true, wrapText: true },
{ label: 'Sequence No.', fieldName: 'sequenceNo', type: 'number', cellAttributes: { alignment: 'left' }, sortable: true, wrapText: true },
{ label: 'Remarks', fieldName: 'remarks', type: 'text', sortable: true, wrapText: true },
{ label: 'Reporting Company', fieldName: 'reportingCompany', type: 'text', sortable: true, wrapText: true }
]);
......
<aura:documentation>
<aura:description>Documentation</aura:description>
<aura:example name="ExampleName" ref="exampleComponentName" label="Label">
Example Description
</aura:example>
</aura:documentation>
\ No newline at end of file
This diff is collapsed.
<?xml version="1.0" encoding="UTF-8"?>
<AuraDefinitionBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>63.0</apiVersion>
<description>A Lightning Component Bundle</description>
</AuraDefinitionBundle>
.THIS .center-text {
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
.THIS .case-section {
padding: 6px 10px;
border-radius: 4px;
background: #f3f3f3;
}
.THIS .case-border-field {
border: 1px solid #d8dde6;
}
.THIS .case-field {
border: 1px solid #d8dde6;
padding: 10px;
min-height: 60px;
margin: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
box-sizing: border-box; /* ทำให้ขอบไม่ขยายขนาด */
}
.THIS .header-style {
background-color: #96c1f0;
color: black; /* font */
}
.THIS .row-style {
background-color: #c4defa;
color: black;
}
/* เพิ่ม effect สำหรับ hover หรือ highlight row */
.THIS .row-style:hover,
.THIS .row-style:focus,
.THIS .row-style:active {
background-color: #1d64e9 !important;
color: black;
}
.THIS .custom-datatable .slds-table tbody tr {
/* background-color: #c4defa !important; */
color: black !important; /* สีตัวอักษร */
}
/* header */
.THIS .custom-datatable .slds-cell-fixed{
background-color: #96c1f0 !important;
color: black;
}
/* .THIS .slds-modal {
height: 100vh !important; ให้ Modal สูงเต็มจอ */
/* display: flex;
align-items: center;
justify-content: center;
} */
/*
.THIS .slds-modal__container {
height: 100vh; /* เต็มความสูงของหน้าจอ */
/* max-height: 100vh;
} */
.THIS .slds-modal__container{
/* <!-- ความสูงจอ 100% --> */
/* max-height : fit-content; */
/* min-height:max-content; */
/* height: auto; */
/* width: 50%; */
/* max-width: 50%; */
}
.THIS .slds-modal {
/* height: 100vh !important; */
/* width:80% !important; */
/* display: flex;
align-items: center;
justify-content: center; */
}
.THIS .custom-table {
width: 100%;
border-collapse: collapse;
/* table-layout: fixed;
min-height: 60px; */
}
.THIS .custom-table td {
width: 25%;
border: 1px solid #d8dde6;
padding: 10px;
vertical-align: top;
}
.THIS .custom-table strong {
/* padding: 5px; */
display: block;
margin-bottom: 5px;
}
.THIS .custom-table p {
/* padding: 5px; */
}
.THIS .font-test{
font-size: 20;
}
.THIS .comment-clamp.expand {
-webkit-line-clamp: unset;
display: block;
overflow: visible;
}
/* .THIS .line-clamp-3 {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
} */
.THIS .line-clamp-3 {
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
.THIS.example {
background-color: #eee;
width: 200px;
height: 300px;
border: 1px dotted black;
overflow-y: scroll; /* Add the ability to scroll */
}
/* Hide scrollbar for Chrome, Safari and Opera */
/* .THIS.example::-webkit-scrollbar {
display: none;
} */
.THIS.TH-cell-padding-right {
margin-right: 20% !important;
}
\ No newline at end of file
<design:component >
</design:component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
<svg width="120px" height="120px" viewBox="0 0 120 120" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M120,108 C120,114.6 114.6,120 108,120 L12,120 C5.4,120 0,114.6 0,108 L0,12 C0,5.4 5.4,0 12,0 L108,0 C114.6,0 120,5.4 120,12 L120,108 L120,108 Z" id="Shape" fill="#2A739E" />
<path d="M77.7383308,20 L61.1640113,20 L44.7300055,63.2000173 L56.0543288,63.2000173 L40,99.623291 L72.7458388,54.5871812 L60.907727,54.5871812 L77.7383308,20 Z" id="Path-1" fill="#FFFFFF" />
</g>
</svg>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment