ทดสอบ Display Components

หน้าเพจสำหรับทดสอบ Display components ทั้งหมด แสดงผลทุกประเภทข้อมูล: null, undefined, string, object

DisplayStatus

null: null

N/A

โค้ดที่ใช้:

<DisplayStatus
  statuses={statuses}
  statusCode={JSON.stringify(testCase.value)}
  fallback="ไม่ระบุสถานะ"
/>

undefined:

N/A

โค้ดที่ใช้:

<DisplayStatus
  statuses={statuses}
  statusCode={JSON.stringify(testCase.value)}
  fallback="ไม่ระบุสถานะ"
/>

string: "ACTIVE"

ใช้งานได้

โค้ดที่ใช้:

<DisplayStatus
  statuses={statuses}
  statusCode={JSON.stringify(testCase.value)}
  fallback="ไม่ระบุสถานะ"
/>

object: {"code":"ACTIVE","name":"ใช้งานได้"}

ใช้งานได้

โค้ดที่ใช้:

<DisplayStatus
  statuses={statuses}
  statusCode={JSON.stringify(testCase.value)}
  fallback="ไม่ระบุสถานะ"
/>

DisplayPropertyType

null: null

ไม่ระบุประเภท

โค้ดที่ใช้:

<DisplayPropertyType
  propertyTypes={propertyTypes}
  propertyTypeCode={null}
  fallback="ไม่ระบุประเภท"
/>

undefined:

ไม่ระบุประเภท

โค้ดที่ใช้:

<DisplayPropertyType
  propertyTypes={propertyTypes}
  propertyTypeCode={undefined}
  fallback="ไม่ระบุประเภท"
/>

string: "RESIDENTIAL"

ที่พักอาศัย

โค้ดที่ใช้:

<DisplayPropertyType
  propertyTypes={propertyTypes}
  propertyTypeCode={"RESIDENTIAL"}
  fallback="ไม่ระบุประเภท"
/>

object: {"code":"RESIDENTIAL","name":"ที่พักอาศัย"}

ที่พักอาศัย

โค้ดที่ใช้:

<DisplayPropertyType
  propertyTypes={propertyTypes}
  propertyTypeCode={"RESIDENTIAL"}
  fallback="ไม่ระบุประเภท"
/>

DisplayConstructionBudgetSource

null: null

ไม่ระบุแหล่งงบประมาณ

โค้ดที่ใช้:

<DisplayConstructionBudgetSource
  constructionBudgetSources={constructionBudgetSources}
  constructionBudgetSourceCode={null}
  fallback="ไม่ระบุแหล่งงบประมาณ"
/>

undefined:

ไม่ระบุแหล่งงบประมาณ

โค้ดที่ใช้:

<DisplayConstructionBudgetSource
  constructionBudgetSources={constructionBudgetSources}
  constructionBudgetSourceCode={undefined}
  fallback="ไม่ระบุแหล่งงบประมาณ"
/>

string: "BUDGET_1"

งบประมาณแผ่นดิน

โค้ดที่ใช้:

<DisplayConstructionBudgetSource
  constructionBudgetSources={constructionBudgetSources}
  constructionBudgetSourceCode={"BUDGET_1"}
  fallback="ไม่ระบุแหล่งงบประมาณ"
/>

object: {"code":"BUDGET_1","name":"งบประมาณแผ่นดิน"}

งบประมาณแผ่นดิน

โค้ดที่ใช้:

<DisplayConstructionBudgetSource
  constructionBudgetSources={constructionBudgetSources}
  constructionBudgetSourceCode={"BUDGET_1"}
  fallback="ไม่ระบุแหล่งงบประมาณ"
/>

DisplayMaintenanceRecordType

null: null

ไม่ระบุประเภทการซ่อมบำรุง

โค้ดที่ใช้:

<DisplayMaintenanceRecordType
  maintenanceRecordTypes={maintenanceRecordTypes}
  maintenanceRecordTypeCode={null}
  fallback="ไม่ระบุประเภทการซ่อมบำรุง"
/>

undefined:

ไม่ระบุประเภทการซ่อมบำรุง

โค้ดที่ใช้:

<DisplayMaintenanceRecordType
  maintenanceRecordTypes={maintenanceRecordTypes}
  maintenanceRecordTypeCode={undefined}
  fallback="ไม่ระบุประเภทการซ่อมบำรุง"
/>

string: "REPAIR"

ซ่อมแซม

โค้ดที่ใช้:

<DisplayMaintenanceRecordType
  maintenanceRecordTypes={maintenanceRecordTypes}
  maintenanceRecordTypeCode={"REPAIR"}
  fallback="ไม่ระบุประเภทการซ่อมบำรุง"
/>

object: {"code":"REPAIR","name":"ซ่อมแซม"}

ซ่อมแซม

โค้ดที่ใช้:

<DisplayMaintenanceRecordType
  maintenanceRecordTypes={maintenanceRecordTypes}
  maintenanceRecordTypeCode={"REPAIR"}
  fallback="ไม่ระบุประเภทการซ่อมบำรุง"
/>

DisplayMaintenanceBudgetSource

null: null

ไม่ระบุแหล่งงบประมาณซ่อมบำรุง

โค้ดที่ใช้:

<DisplayMaintenanceBudgetSource
  maintenanceBudgetSources={maintenanceBudgetSources}
  maintenanceBudgetSourceCode={null}
  fallback="ไม่ระบุแหล่งงบประมาณซ่อมบำรุง"
/>

undefined:

ไม่ระบุแหล่งงบประมาณซ่อมบำรุง

โค้ดที่ใช้:

<DisplayMaintenanceBudgetSource
  maintenanceBudgetSources={maintenanceBudgetSources}
  maintenanceBudgetSourceCode={undefined}
  fallback="ไม่ระบุแหล่งงบประมาณซ่อมบำรุง"
/>

string: "BUDGET_1"

งบประมาณแผ่นดิน

โค้ดที่ใช้:

<DisplayMaintenanceBudgetSource
  maintenanceBudgetSources={maintenanceBudgetSources}
  maintenanceBudgetSourceCode={"BUDGET_1"}
  fallback="ไม่ระบุแหล่งงบประมาณซ่อมบำรุง"
/>

object: {"code":"BUDGET_1","name":"งบประมาณแผ่นดิน"}

งบประมาณแผ่นดิน

โค้ดที่ใช้:

<DisplayMaintenanceBudgetSource
  maintenanceBudgetSources={maintenanceBudgetSources}
  maintenanceBudgetSourceCode={"BUDGET_1"}
  fallback="ไม่ระบุแหล่งงบประมาณซ่อมบำรุง"
/>

หมายเหตุ

แสดงทุก component และทุกประเภทข้อมูลพร้อมกัน
แต่ละ component แสดงผลลัพธ์สำหรับ 4 ประเภทข้อมูล: null, undefined, string, object
DisplayStatus รองรับทั้ง string และ object สำหรับ statusCode (object จะแสดง name โดยตรง)
Display components อื่นๆ (DisplayPropertyType, DisplayConstructionBudgetSource, DisplayMaintenanceRecordType, DisplayMaintenanceBudgetSource) รองรับ string, null, undefined สำหรับ code (object จะถูกแปลงเป็น string code)