Files
alla-allaos-fullstack/docs/setup/uat-system-flow.html
2026-07-14 16:15:30 +07:00

1177 lines
66 KiB
HTML

<!doctype html>
<html lang="th">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>ALLA OS UAT Setup & System Flow</title>
<style>
:root {
--ink: #16201d;
--muted: #60706a;
--paper: #f7f4ec;
--surface: #fffdf7;
--line: #d9d0bf;
--line-strong: #a99d87;
--olive: #405b46;
--teal: #0f766e;
--amber: #b7791f;
--red: #b42318;
--blue: #1d4ed8;
--shadow: 0 18px 48px rgba(45, 38, 24, 0.12);
--radius: 8px;
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background:
linear-gradient(90deg, rgba(64, 91, 70, 0.055) 1px, transparent 1px),
linear-gradient(180deg, rgba(64, 91, 70, 0.055) 1px, transparent 1px),
var(--paper);
background-size: 28px 28px;
color: var(--ink);
font-family: "Aptos", "Segoe UI", Tahoma, sans-serif;
line-height: 1.55;
}
a {
color: var(--teal);
text-decoration: none;
}
.page {
width: min(1180px, calc(100% - 32px));
margin: 0 auto;
padding: 34px 0 56px;
}
.hero {
display: grid;
grid-template-columns: 1.35fr 0.65fr;
gap: 22px;
align-items: stretch;
margin-bottom: 24px;
}
.hero-main,
.hero-side,
.panel,
.card,
.step,
.check-item {
background: var(--surface);
border: 1px solid var(--line);
border-radius: var(--radius);
box-shadow: var(--shadow);
}
.hero-main {
padding: 34px;
position: relative;
overflow: hidden;
}
.hero-main::after {
content: "";
position: absolute;
inset: auto 28px 24px auto;
width: 160px;
height: 8px;
background: repeating-linear-gradient(90deg, var(--olive) 0 18px, transparent 18px 28px);
opacity: 0.25;
}
.eyebrow {
display: inline-flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
color: var(--olive);
font-size: 13px;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.dot {
width: 9px;
height: 9px;
border-radius: 99px;
background: var(--teal);
box-shadow: 18px 0 0 var(--amber), 36px 0 0 var(--blue);
}
h1,
h2,
h3 {
margin: 0;
line-height: 1.14;
}
h1 {
max-width: 820px;
font-size: clamp(34px, 6vw, 74px);
font-weight: 850;
letter-spacing: 0;
}
.hero-main p {
max-width: 740px;
margin: 18px 0 0;
color: var(--muted);
font-size: 18px;
}
.hero-side {
padding: 26px;
display: grid;
align-content: space-between;
gap: 20px;
}
.meta-list {
display: grid;
gap: 14px;
margin: 0;
padding: 0;
list-style: none;
}
.meta-list li {
display: flex;
justify-content: space-between;
gap: 18px;
border-bottom: 1px solid var(--line);
padding-bottom: 10px;
font-size: 14px;
}
.meta-list strong {
color: var(--muted);
font-weight: 600;
}
.status-strip {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 12px;
}
.badge {
display: inline-flex;
align-items: center;
min-height: 28px;
border-radius: 99px;
border: 1px solid currentColor;
padding: 4px 10px;
font-size: 12px;
font-weight: 800;
text-transform: uppercase;
}
.pass {
color: var(--teal);
background: rgba(15, 118, 110, 0.08);
}
.warn {
color: var(--amber);
background: rgba(183, 121, 31, 0.10);
}
.fail {
color: var(--red);
background: rgba(180, 35, 24, 0.08);
}
section {
margin-top: 24px;
}
.panel {
padding: 28px;
}
.section-head {
display: flex;
align-items: end;
justify-content: space-between;
gap: 20px;
margin-bottom: 20px;
}
.section-head h2 {
font-size: clamp(24px, 3vw, 38px);
}
.section-head p {
max-width: 540px;
margin: 0;
color: var(--muted);
}
.timeline {
display: grid;
grid-template-columns: repeat(7, minmax(120px, 1fr));
gap: 10px;
counter-reset: stage;
}
.stage {
position: relative;
min-height: 118px;
padding: 16px 14px;
background: #f2eadb;
border: 1px solid var(--line);
border-radius: var(--radius);
overflow: hidden;
}
.stage::before {
counter-increment: stage;
content: "0" counter(stage);
display: block;
margin-bottom: 22px;
color: var(--olive);
font-weight: 900;
font-size: 20px;
}
.stage b {
display: block;
font-size: 15px;
}
.stage span {
color: var(--muted);
display: block;
font-size: 12px;
margin-top: 5px;
}
.steps-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
}
.step {
padding: 20px;
box-shadow: none;
}
.step h3 {
display: flex;
align-items: center;
gap: 10px;
font-size: 20px;
margin-bottom: 14px;
}
.num {
display: inline-grid;
place-items: center;
width: 34px;
height: 34px;
border-radius: 99px;
background: var(--ink);
color: #fffdf7;
font-size: 14px;
font-weight: 900;
flex: 0 0 auto;
}
.flow-fields {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.field {
border-left: 3px solid var(--line-strong);
padding-left: 12px;
}
.field strong {
display: block;
margin-bottom: 4px;
color: var(--olive);
font-size: 13px;
text-transform: uppercase;
}
.field p {
margin: 0;
color: var(--muted);
font-size: 14px;
}
.data-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 12px;
}
.metric {
padding: 16px;
border: 1px solid var(--line);
border-radius: var(--radius);
background: #fbf6e9;
}
.metric strong {
display: block;
font-size: 31px;
line-height: 1;
}
.metric span {
display: block;
margin-top: 8px;
color: var(--muted);
font-size: 13px;
}
table {
width: 100%;
border-collapse: collapse;
background: var(--surface);
border: 1px solid var(--line);
border-radius: var(--radius);
overflow: hidden;
font-size: 14px;
}
th,
td {
padding: 12px 14px;
border-bottom: 1px solid var(--line);
text-align: left;
vertical-align: top;
}
th {
background: var(--ink);
color: #fffdf7;
font-weight: 800;
}
tr:last-child td {
border-bottom: 0;
}
.checklist {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px;
}
.check-item {
padding: 16px;
box-shadow: none;
}
.check-item strong {
display: block;
margin-bottom: 6px;
}
.check-item p {
margin: 0;
color: var(--muted);
font-size: 14px;
}
.next-flow {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 10px;
}
.next-flow div {
min-height: 96px;
padding: 14px;
background: var(--ink);
color: #fffdf7;
border-radius: var(--radius);
}
.next-flow b {
display: block;
margin-bottom: 8px;
font-size: 14px;
}
.next-flow span {
display: block;
color: rgba(255, 253, 247, 0.72);
font-size: 12px;
}
.note {
margin-top: 18px;
padding: 14px 16px;
background: rgba(29, 78, 216, 0.08);
border: 1px solid rgba(29, 78, 216, 0.22);
border-radius: var(--radius);
color: #20315e;
font-size: 14px;
}
.print-foot {
margin-top: 24px;
color: var(--muted);
font-size: 13px;
text-align: center;
}
@media (max-width: 980px) {
.hero,
.steps-grid,
.flow-fields {
grid-template-columns: 1fr;
}
.timeline,
.data-grid,
.checklist,
.next-flow {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 640px) {
.page {
width: min(100% - 22px, 1180px);
padding-top: 18px;
}
.hero-main,
.hero-side,
.panel {
padding: 20px;
}
.timeline,
.data-grid,
.checklist,
.next-flow {
grid-template-columns: 1fr;
}
.section-head {
display: block;
}
th,
td {
padding: 10px;
}
}
@media print {
body {
background: #fff;
}
.page {
width: 100%;
padding: 0;
}
.hero-main,
.hero-side,
.panel,
.card,
.step,
.check-item {
box-shadow: none;
}
}
</style>
</head>
<body>
<main class="page">
<header class="hero">
<div class="hero-main">
<div class="eyebrow"><span class="dot"></span> ALLA OS UAT Operation Guide</div>
<h1>UAT Setup & System Flow</h1>
<p>เอกสารนี้สรุปขั้นตอนเตรียมระบบ UAT จากชุด CSV ใน <strong>setup/ALLA-ONVALLA</strong> โดยเล่าแบบ user action ทีละ step เพื่อให้ tester รู้ว่าต้องทำอะไร ระบบทำอะไร และควรเห็นผลลัพธ์อะไรหลังจบแต่ละช่วง</p>
</div>
<aside class="hero-side" aria-label="Document metadata">
<ul class="meta-list">
<li><strong>Dataset</strong><span>setup/ALLA-ONVALLA</span></li>
<li><strong>Audience</strong><span>UAT Tester</span></li>
<li><strong>Format</strong><span>Static HTML</span></li>
<li><strong>Updated</strong><span>2026-07-14</span></li>
</ul>
<div>
<strong>Legend</strong>
<div class="status-strip">
<span class="badge pass">PASS</span>
<span class="badge warn">WARNING</span>
<span class="badge fail">FAIL</span>
</div>
</div>
</aside>
</header>
<section class="panel" aria-labelledby="overview-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Flow Timeline</div>
<h2 id="overview-title">ภาพรวมการเตรียมระบบ</h2>
</div>
<p>ให้ไล่จากซ้ายไปขวา หาก step ใดขึ้น FAIL ให้แก้ข้อมูลหรือ environment ก่อนค่อยไปต่อ ห้าม commit CSV ถ้า preview ยังมี blocking error</p>
</div>
<div class="timeline" aria-label="UAT setup timeline">
<div class="stage"><b>Reset DB</b><span>ล้างฐานข้อมูล UAT</span></div>
<div class="stage"><b>Migrate</b><span>สร้าง schema ล่าสุด</span></div>
<div class="stage"><b>Preview CSV</b><span>ตรวจไฟล์และ references</span></div>
<div class="stage"><b>Commit CSV</b><span>นำข้อมูลเข้าแบบ upsert</span></div>
<div class="stage"><b>Complete Setup</b><span>ปิด bootstrap run</span></div>
<div class="stage"><b>Readiness</b><span>ตรวจข้อมูลที่ต้องพร้อม</span></div>
<div class="stage"><b>Login UAT</b><span>เริ่มทดสอบจาก role จริง</span></div>
</div>
</section>
<section class="panel" aria-labelledby="steps-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Step By Step</div>
<h2 id="steps-title">User action ในแต่ละขั้นตอน</h2>
</div>
<p>ทุก step ด้านล่างออกแบบให้ tester หรือ admin ทำตามได้โดยไม่ต้องอ่านโค้ด</p>
</div>
<div class="steps-grid">
<article class="step">
<h3><span class="num">1</span> Reset DB</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>ยืนยันว่าจะล้างข้อมูล UAT แล้วรัน reset database ด้วย explicit confirmation</p></div>
<div class="field"><strong>System Action</strong><p>ลบ schema และตารางเดิม แล้วสร้าง schema ว่างสำหรับเริ่มรอบใหม่</p></div>
<div class="field"><strong>Expected Result</strong><p>ฐานข้อมูลไม่มีข้อมูล business เดิมค้างอยู่</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า reset ถูก block ให้ตรวจ host, database name และ flag reset safety</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">2</span> Run Migrations</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>รัน migration เพื่อสร้างตารางตาม schema ล่าสุด</p></div>
<div class="field"><strong>System Action</strong><p>Drizzle applies migrations และสร้าง migration history</p></div>
<div class="field"><strong>Expected Result</strong><p>ตารางหลัก เช่น users, organizations, memberships, CRM, approval พร้อมใช้งาน</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า migrate fail ให้แก้ schema/migration ก่อน import CSV</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">3</span> Preview CSV</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>เลือก source เป็น configured directory: <code>setup/ALLA-ONVALLA</code></p></div>
<div class="field"><strong>System Action</strong><p>อ่าน 11 required CSV, validate header, duplicate, enum, dependency และ references</p></div>
<div class="field"><strong>Expected Result</strong><p>Preview ต้องมี <span class="badge pass">0 errors</span> ก่อน commit</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้ามี unknown option ให้เติม master option หรือแก้ code ให้ตรงไฟล์อ้างอิง</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">4</span> Commit CSV</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>ใช้ preview hash ล่าสุดเพื่อ commit ข้อมูล CSV</p></div>
<div class="field"><strong>System Action</strong><p>นำข้อมูลเข้าแบบ transaction/upsert ตามลำดับ dependency</p></div>
<div class="field"><strong>Expected Result</strong><p>ข้อมูล users, orgs, memberships, roles, approvals, sequences ถูกสร้างครบ</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า hash mismatch ให้ preview ใหม่ แล้ว commit ด้วย hash ใหม่</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">5</span> Complete Setup</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>กด complete หรือเรียก setup completion หลัง required steps ผ่านแล้ว</p></div>
<div class="field"><strong>System Action</strong><p>บันทึก setup run, seed manifest และล็อกสถานะ bootstrap เป็น completed</p></div>
<div class="field"><strong>Expected Result</strong><p>Setup run ล่าสุดเป็น completed และระบบออกจาก bootstrap mode</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า complete ถูก block ให้ดู missing step หรือ readiness check ที่ยังไม่ผ่าน</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">6</span> Readiness Check</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>ตรวจจำนวนข้อมูลและจุด readiness ก่อนเริ่ม UAT</p></div>
<div class="field"><strong>System Action</strong><p>เช็ค active organization, role assignment, approval setup และ document sequences</p></div>
<div class="field"><strong>Expected Result</strong><p>ALLA และ ONVALLA มี users, Lead status, THB currency, quotation sequence พร้อม</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า Lead สร้างไม่ได้ ให้ตรวจ <code>crm_lead_status:new_job</code> และ <code>crm_lead</code> sequence</p></div>
</div>
</article>
</div>
</section>
<section class="panel" aria-labelledby="data-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Dataset Snapshot</div>
<h2 id="data-title">ข้อมูลที่ควรถูก import</h2>
</div>
<p>ตัวเลขเหล่านี้มาจาก CSV source ปัจจุบัน ไม่รวม row ที่ระบบสร้างเองระหว่าง runtime</p>
</div>
<div class="data-grid">
<div class="metric"><strong>25</strong><span>users.csv</span></div>
<div class="metric"><strong>2</strong><span>organizations.csv</span></div>
<div class="metric"><strong>25</strong><span>memberships.csv</span></div>
<div class="metric"><strong>27</strong><span>crm-role-assignments.csv</span></div>
<div class="metric"><strong>122</strong><span>master-options.csv</span></div>
<div class="metric"><strong>12</strong><span>document-sequences.csv</span></div>
<div class="metric"><strong>6</strong><span>approval-workflows.csv</span></div>
<div class="metric"><strong>24</strong><span>approval steps + matrix rows</span></div>
</div>
</section>
<section class="panel" aria-labelledby="csv-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Import Order</div>
<h2 id="csv-title">CSV dependency map</h2>
</div>
<p>ระบบต้องอ่านตามลำดับนี้ เพราะไฟล์ท้าย ๆ อ้างอิงข้อมูลจากไฟล์ก่อนหน้า</p>
</div>
<table>
<thead>
<tr>
<th>Order</th>
<th>CSV File</th>
<th>Tester Checkpoint</th>
</tr>
</thead>
<tbody>
<tr><td>01</td><td>users.csv</td><td>มี user UAT ครบทั้ง ALLA และ ONVALLA</td></tr>
<tr><td>02</td><td>organizations.csv</td><td>มีองค์กร ALLA และ ONVALLA</td></tr>
<tr><td>03</td><td>memberships.csv</td><td>user ทุกคนมี organization access</td></tr>
<tr><td>05</td><td>crm-role-assignments.csv</td><td>role/scopes พร้อมสำหรับ marketing, sales, manager, admin</td></tr>
<tr><td>06</td><td>master-options.csv</td><td>options สำคัญ เช่น currency, lead status, customer status พร้อม</td></tr>
<tr><td>07</td><td>branches.csv</td><td>branch head_office พร้อมใช้งานในแต่ละ org</td></tr>
<tr><td>08</td><td>product-types.csv</td><td>product type เช่น crane, dockdoor, solarcell พร้อม</td></tr>
<tr><td>14</td><td>document-sequences.csv</td><td>เลขเอกสารสำหรับ customer, lead, opportunity, quotation พร้อม</td></tr>
<tr><td>15</td><td>approval-workflows.csv</td><td>workflow quotation 3 ระดับต่อ org</td></tr>
<tr><td>16</td><td>approval-steps.csv</td><td>step approval เรียงตาม role</td></tr>
<tr><td>17</td><td>approval-matrix.csv</td><td>routing approval ตาม product และ amount พร้อม</td></tr>
</tbody>
</table>
</section>
<section class="panel" aria-labelledby="ready-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> UAT Readiness</div>
<h2 id="ready-title">Checklist ก่อนเริ่มทดสอบ</h2>
</div>
<p>ใช้รายการนี้เป็น gate สั้น ๆ ก่อนส่งให้ tester เริ่มใช้งานจริง</p>
</div>
<div class="checklist">
<div class="check-item"><span class="badge pass">PASS</span><strong>Organizations</strong><p>ALLA Company Limited และ ONVALLA Demo Company พร้อม</p></div>
<div class="check-item"><span class="badge pass">PASS</span><strong>Users & Memberships</strong><p>25 users มี active organization และ membership</p></div>
<div class="check-item"><span class="badge pass">PASS</span><strong>CRM Authorization</strong><p>27 role assignments ครอบคลุม UAT roles</p></div>
<div class="check-item"><span class="badge pass">PASS</span><strong>Lead Creation</strong><p><code>new_job</code> status และ <code>crm_lead</code> sequence พร้อม</p></div>
<div class="check-item"><span class="badge pass">PASS</span><strong>Quotation Approval</strong><p>workflow, steps, matrix พร้อมสำหรับ quotation routing</p></div>
<div class="check-item"><span class="badge warn">NOTE</span><strong>Import Warning</strong><p>WARNING แบบ AUDIT_GAP คือข้อจำกัด import engine ไม่ใช่ข้อมูลผิด</p></div>
</div>
</section>
<section class="panel" aria-labelledby="login-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Login Reference</div>
<h2 id="login-title">บัญชีที่ใช้เริ่ม UAT</h2>
</div>
<p>เอกสารนี้ไม่แสดง password ให้เปิดดูจากช่องทางจัดการ credential หรือไฟล์ CSV เฉพาะผู้มีสิทธิ์เท่านั้น</p>
</div>
<table>
<thead>
<tr>
<th>Role</th>
<th>ALLA</th>
<th>ONVALLA</th>
<th>ใช้ทดสอบอะไร</th>
</tr>
</thead>
<tbody>
<tr><td>System Admin</td><td>super_admin@allaos.local</td><td>-</td><td>setup, admin access, configuration</td></tr>
<tr><td>Marketing</td><td>mk.uat@allaos.local</td><td>mk.onvalla@allaos.local</td><td>สร้าง Lead และติดตาม handoff</td></tr>
<tr><td>Sales Manager</td><td>manager.uat@allaos.local</td><td>manager.onvalla@allaos.local</td><td>ดูทีม, assign, approve ขั้นต้น</td></tr>
<tr><td>Sales</td><td>sales_crane.uat@allaos.local</td><td>sales_crane.onvalla@allaos.local</td><td>Opportunity และ Quotation</td></tr>
<tr><td>Department / Top Manager</td><td>gm.uat@allaos.local / ceo.uat@allaos.local</td><td>gm.onvalla@allaos.local / ceo.onvalla@allaos.local</td><td>approval ระดับสูงและ dashboard monitoring</td></tr>
</tbody>
</table>
<div class="note">หาก login แล้วไม่เห็นเมนู ให้ตรวจ membership, CRM role assignment, branch scope และ product type scope ของ user นั้นก่อน</div>
</section>
<section class="panel" aria-labelledby="next-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> After Setup</div>
<h2 id="next-title">หลัง setup แล้ว tester ทำอะไรต่อ</h2>
</div>
<p>นี่คือ business flow สั้น ๆ เพื่อยืนยันว่าระบบ UAT พร้อมใช้งานจริง</p>
</div>
<div class="next-flow">
<div><b>1. Login</b><span>เข้าใช้งานด้วย user ตาม role ที่ต้องทดสอบ</span></div>
<div><b>2. Dashboard</b><span>ตรวจว่าเมนูและข้อมูลพื้นฐานโหลดได้</span></div>
<div><b>3. Create Lead</b><span>Marketing สร้าง Lead ด้วย status new_job</span></div>
<div><b>4. Assign Lead</b><span>ส่งต่อให้ Sales และสร้าง sales-owned work item</span></div>
<div><b>5. Create Quotation</b><span>Sales สร้าง quotation จาก customer/opportunity</span></div>
<div><b>6. Submit Approval</b><span>ตรวจ matrix routing และ approval chain ตามยอดเงิน</span></div>
</div>
</section>
<section class="panel" aria-labelledby="myday-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Daily Workspace</div>
<h2 id="myday-title">My Day ใช้งานอย่างไร</h2>
</div>
<p>My Day คือหน้ารวม “งานที่ควรทำก่อน” ของผู้ใช้ในวันนั้น ไม่ใช่ที่เก็บข้อมูลหลักของ CRM แต่เป็น workspace ที่ดึงงานจาก Activities, Calendar, Approvals, Hot Projects และ Timeline มาเรียงให้ตัดสินใจง่าย</p>
</div>
<div class="steps-grid">
<article class="step">
<h3><span class="num">1</span> เปิด My Day</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>Login ด้วย user UAT แล้วเข้าเมนู <code>CRM &gt; My Day</code></p></div>
<div class="field"><strong>System Action</strong><p>โหลด workspace ตามสิทธิ์ของ user และแสดงโหมด <code>Personal mode</code> หรือ <code>Manager mode</code></p></div>
<div class="field"><strong>Expected Result</strong><p>เห็นสรุป Activities, Meetings, Visits, Overdue, Hot Projects และ Approvals</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้าไม่เห็นเมนู ให้ตรวจ membership, CRM role assignment และ permission <code>crm.activity.read</code></p></div>
</div>
</article>
<article class="step">
<h3><span class="num">2</span> เลือกช่วงงาน</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>กดตัวกรอง <code>today</code>, <code>tomorrow</code> หรือ <code>this week</code> เพื่อดูคิวงานตามช่วงเวลา</p></div>
<div class="field"><strong>System Action</strong><p>กรองรายการตามวันครบกำหนด เวลาใน calendar และ scope ของ user หรือทีม</p></div>
<div class="field"><strong>Expected Result</strong><p>Priority Queue และ Today's Schedule เปลี่ยนตาม range ที่เลือก</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้ารายการว่าง ให้เช็คว่า activity มี assignee, due date/start date และอยู่ใน organization เดียวกับ user</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">3</span> ทำงานจาก Priority Queue</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>เริ่มจากรายการ P1/P2 ก่อน แล้วคลิกงานเพื่อเปิด record ต้นทาง เช่น Activity, Opportunity, Quotation หรือ Approval</p></div>
<div class="field"><strong>System Action</strong><p>รวม overdue activities, งานครบกำหนด, approval pending และ hot project แล้วจัดลำดับความสำคัญ</p></div>
<div class="field"><strong>Expected Result</strong><p>ผู้ใช้รู้ว่าต้อง follow-up งานไหนก่อน โดยไม่ต้องเปิดหลายหน้าเพื่อหาเอง</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้าคลิกแล้วไปหน้าที่ไม่เห็นข้อมูล ให้ตรวจสิทธิ์ของ source record และ branch/product scope</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">4</span> เพิ่มหรือติดตาม Activity</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>กด <code>Add Activity</code> เมื่อมีงาน follow-up ใหม่ หรือเปิด Activity เดิมเพื่ออัปเดตสถานะ/กำหนดเวลา</p></div>
<div class="field"><strong>System Action</strong><p>บันทึก Activity เป็นแหล่งข้อมูลหลัก แล้วส่งผลให้ My Day, Calendar และ Timeline แสดงงานล่าสุด</p></div>
<div class="field"><strong>Expected Result</strong><p>งานที่มี due date หรือ schedule จะกลับมาแสดงใน My Day ตามช่วงเวลาที่ถูกต้อง</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้าเพิ่ม Activity แล้วไม่ขึ้น ให้กด Refresh และตรวจว่า status ยังไม่ completed/cancelled</p></div>
</div>
</article>
</div>
<div class="note">จำง่าย ๆ: My Day คือ “หน้าเริ่มงานประจำวัน” ใช้ดูว่าตอนนี้ควรทำอะไรต่อ ไม่ใช่หน้าสำหรับวางแผนตารางเวลาทั้งเดือน</div>
</section>
<section class="panel" aria-labelledby="calendar-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Calendar Workspace</div>
<h2 id="calendar-title">Calendar ใช้งานอย่างไร</h2>
</div>
<p>Calendar คือมุมมองแบบเวลา ใช้ดู meeting, visit, task, reminder และ milestone จาก CRM โดยดึงข้อมูลจาก calendar projection ที่ผูกกับ Activity หรือ record ต้นทาง</p>
</div>
<div class="steps-grid">
<article class="step">
<h3><span class="num">1</span> เปิด Calendar</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>เข้าเมนู <code>CRM &gt; Calendar</code> เพื่อดูตารางงานของตัวเองหรือทีมตามสิทธิ์</p></div>
<div class="field"><strong>System Action</strong><p>โหลด event ตาม date range, organization, lens, user/team scope และ permission visibility</p></div>
<div class="field"><strong>Expected Result</strong><p>เห็น event พร้อมสรุป Due Today, Overdue, Meetings, Visits และ Hot Projects</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า calendar ว่าง ให้เช็คช่วงวันที่, owner/assignee, activity schedule และสิทธิ์การมองเห็นของ user</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">2</span> ค้นหาและเลือก event</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>ใช้ช่อง search เพื่อค้นหาชื่อ event, รายละเอียด, user หรือ source type แล้วคลิก event เพื่อดูรายละเอียด</p></div>
<div class="field"><strong>System Action</strong><p>กรองรายการบนหน้าจอ และแสดงข้อมูลเวลา สถานที่ ผู้รับผิดชอบ และ record ที่เกี่ยวข้อง</p></div>
<div class="field"><strong>Expected Result</strong><p>tester เข้าใจว่างานนี้เกี่ยวกับ customer, lead, opportunity, quotation หรือ approval ใด</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้า search ไม่เจอ ให้ลองล้าง keyword และตรวจว่างานอยู่ในช่วงวันที่ที่ calendar โหลดอยู่</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">3</span> ปรับเวลา event ที่แก้ได้</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>ลากหรือปรับเวลา event เฉพาะรายการที่เป็น editable activity และ user มีสิทธิ์แก้ไข</p></div>
<div class="field"><strong>System Action</strong><p>แปลงการลากเป็นคำสั่ง reschedule Activity แล้ว invalidate Calendar, My Day และ Activity cache</p></div>
<div class="field"><strong>Expected Result</strong><p>เวลาใหม่แสดงใน Calendar และ My Day หลังบันทึกสำเร็จ</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้าแก้ไม่ได้ อาจเป็น milestone/read-only event หรือ user ไม่มีสิทธิ์ update activity</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">4</span> สร้างงานใหม่จาก Calendar</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>เมื่อต้องเพิ่มนัดหมายใหม่ ให้ไปสร้างที่ Activity เพราะ Activity คือ source of truth ของงาน</p></div>
<div class="field"><strong>System Action</strong><p>หลัง Activity ถูกสร้าง ระบบสร้างหรืออัปเดต calendar projection เพื่อให้ event ปรากฏใน Calendar</p></div>
<div class="field"><strong>Expected Result</strong><p>event ใหม่แสดงใน Calendar ตามเวลา และแสดงใน My Day ถ้าอยู่ในช่วงที่เลือก</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้าสร้างแล้วไม่ขึ้น ให้ตรวจ start/end time, timezone, assignee และ refresh calendar</p></div>
</div>
</article>
</div>
<div class="note">จำง่าย ๆ: Calendar คือ “แผนที่เวลา” ใช้ดูว่างานเกิดขึ้นเมื่อไร ส่วนการสร้าง/แก้รายละเอียดงานควรทำผ่าน Activity หรือ record ต้นทาง</div>
</section>
<section class="panel" aria-labelledby="workspace-compare-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> How They Work Together</div>
<h2 id="workspace-compare-title">My Day, Calendar และ Activity ต่างกันอย่างไร</h2>
</div>
<p>สามส่วนนี้ทำงานร่วมกัน แต่ตอบคำถามคนละแบบ: วันนี้ควรทำอะไร, งานอยู่เวลาไหน, และข้อมูลต้นทางอยู่ที่ใด</p>
</div>
<table>
<thead>
<tr>
<th>ส่วนของระบบ</th>
<th>ใช้ตอบคำถาม</th>
<th>User Action หลัก</th>
<th>สิ่งที่ต้องจำ</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>My Day</strong></td>
<td>วันนี้ฉันควรทำอะไรก่อน</td>
<td>ดู Priority Queue, Schedule, Overdue, Pending Approval แล้วเปิด record เพื่อทำงานต่อ</td>
<td>เหมาะกับเริ่มวันและ follow-up งานเร่งด่วน</td>
</tr>
<tr>
<td><strong>Calendar</strong></td>
<td>งานนี้เกิดขึ้นวันและเวลาไหน</td>
<td>ดูตาราง, search event, เปิดรายละเอียด, reschedule event ที่แก้ได้</td>
<td>เหมาะกับวางแผนเวลาและดูภาระงานรายวัน/สัปดาห์/เดือน</td>
</tr>
<tr>
<td><strong>Activity</strong></td>
<td>รายละเอียดงานและ follow-up คืออะไร</td>
<td>สร้างงาน, ใส่ assignee, ตั้งเวลา, อัปเดตสถานะ, บันทึกผลการติดตาม</td>
<td>เป็น source of truth ของงานที่ actionable</td>
</tr>
<tr>
<td><strong>Lead / Opportunity / Quotation</strong></td>
<td>งานนี้เกี่ยวกับดีลหรือเอกสารใด</td>
<td>เปิด record ต้นทางเพื่อดู customer, stage, amount, approval และเอกสาร</td>
<td>เป็น business context ไม่ใช่คิวงานประจำวันโดยตรง</td>
</tr>
</tbody>
</table>
</section>
<section class="panel" aria-labelledby="workspace-uat-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> UAT Scenarios</div>
<h2 id="workspace-uat-title">วิธีทดสอบ My Day และ Calendar แบบเข้าใจง่าย</h2>
</div>
<p>ใช้ scenario ด้านล่างเพื่อยืนยันว่า workspace ทั้งสองหน้าเชื่อมกับ CRM flow จริง และ tester เห็นผลลัพธ์ที่คาดหวัง</p>
</div>
<div class="next-flow">
<div><b>1. Marketing Follow-up</b><span>สร้าง Lead แล้วเพิ่ม Activity follow-up วันนี้ให้ sales user</span></div>
<div><b>2. Check My Day</b><span>Login เป็น sales user แล้วดูว่า Activity ปรากฏใน Priority Queue หรือ Schedule</span></div>
<div><b>3. Check Calendar</b><span>เปิด Calendar ช่วงวันนี้ แล้วตรวจว่า event แสดงตามเวลาและ assignee</span></div>
<div><b>4. Reschedule</b><span>เลื่อนเวลา Activity ที่แก้ได้ แล้วตรวจว่า Calendar และ My Day อัปเดต</span></div>
<div><b>5. Approval Work</b><span>Submit Quotation approval แล้วตรวจ pending approval ใน My Day ของผู้อนุมัติ</span></div>
<div><b>6. Manager View</b><span>Login manager แล้วตรวจทีมตาม scope ว่าเห็นงานที่ควรเห็นเท่านั้น</span></div>
</div>
<div class="note">ถ้า My Day หรือ Calendar ไม่แสดงงาน ให้ไล่เช็คตามลำดับนี้: Activity มี assignee หรือไม่, วันที่อยู่ใน range หรือไม่, status ยัง active หรือไม่, user อยู่ organization เดียวกันหรือไม่, และ role/scope อนุญาตให้เห็น record นั้นหรือไม่</div>
</section>
<section class="panel" aria-labelledby="activity-types-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Activity Type Guide</div>
<h2 id="activity-types-title">Activity Type แต่ละแบบใช้เมื่อไร</h2>
</div>
<p>Activity Type คือชนิดของงานที่ต้องทำ มีผลต่อการกรองงาน, badge, สถิติใน My Day, การแสดงใน Calendar และการตีความว่าผู้ใช้ต้อง action แบบไหน</p>
</div>
<table>
<thead>
<tr>
<th>Activity Type</th>
<th>ใช้เมื่อไร</th>
<th>ตัวอย่าง User Action</th>
<th>ผลต่อระบบ</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>meeting</strong></td>
<td>มีนัดประชุมกับลูกค้า ทีมขาย หรือทีมภายใน</td>
<td>นัด review requirement, demo solution, kickoff</td>
<td>นับเป็น Meeting และแสดงเป็น event ใน Calendar เมื่อมี scheduled date</td>
</tr>
<tr>
<td><strong>visit</strong></td>
<td>ออกไปพบลูกค้าหรือไปพื้นที่ลูกค้า</td>
<td>MK/Sales ไปเยี่ยมลูกค้า A วันที่กำหนด</td>
<td>นับเป็น Visit ใน My Day/Calendar และช่วยตามประวัติการเข้าพบ</td>
</tr>
<tr>
<td><strong>phone_call</strong></td>
<td>โทรติดตามหรือโทรสอบถามข้อมูล</td>
<td>โทรถามความคืบหน้า, โทรยืนยันวันนัด</td>
<td>ใช้แยกงานโทรออกจาก meeting/visit เพื่อดู workload ได้ชัด</td>
</tr>
<tr>
<td><strong>email</strong></td>
<td>ส่งอีเมลเป็น action หลัก</td>
<td>ส่ง catalog, ส่งเอกสาร, ส่งสรุปหลังประชุม</td>
<td>ช่วยให้ Timeline เห็นว่ามีการสื่อสารผ่านอีเมล</td>
</tr>
<tr>
<td><strong>site_survey</strong></td>
<td>ต้องเข้าสำรวจหน้างานเพื่อเก็บข้อมูลเทคนิค</td>
<td>นัดสำรวจพื้นที่ติดตั้ง crane, dock door, solar</td>
<td>เหมาะกับงานก่อนเสนอราคา และช่วยทีมเห็น milestone สำรวจหน้างาน</td>
</tr>
<tr>
<td><strong>presentation</strong></td>
<td>นำเสนอสินค้า โซลูชัน หรือ proposal</td>
<td>Demo solution, present quotation, present project concept</td>
<td>ทำให้แยกกิจกรรมเชิงขาย/นำเสนอออกจาก meeting ทั่วไป</td>
</tr>
<tr>
<td><strong>reminder</strong></td>
<td>ตั้งเตือนให้กลับมาทำบางอย่างในอนาคต</td>
<td>เตือน follow-up ลูกค้าอีก 2 เดือน, เตือนขอข้อมูลเพิ่ม</td>
<td>ขึ้นใน My Day/Calendar ตาม due/scheduled date แต่ไม่ใช่งานอนุมัติ</td>
</tr>
<tr>
<td><strong>internal_task</strong></td>
<td>งานภายในที่ไม่ใช่การติดต่อกับลูกค้าโดยตรง</td>
<td>เตรียมเอกสาร, ตรวจข้อมูล, ประสานทีม service</td>
<td>มักใช้กับ Primary Entity = internal หรือ record ที่เกี่ยวข้อง</td>
</tr>
<tr>
<td><strong>follow_up</strong></td>
<td>ติดตามต่อจาก activity/lead/opportunity/quotation เดิม</td>
<td>ติดตาม lead หลังลูกค้าขอคิดก่อน, ติดตาม quotation หลังส่งราคา</td>
<td>เป็น type หลักสำหรับงานต่อเนื่อง และมักโผล่ใน Priority Queue</td>
</tr>
<tr>
<td><strong>delivery_coordination</strong></td>
<td>ประสานงานส่งมอบ ติดตั้ง หรือส่งเอกสารหลังปิดงาน</td>
<td>นัดวันส่งของ, ประสาน schedule ติดตั้ง, แจ้งทีม operation</td>
<td>ช่วยแยกงาน post-sale/operation ออกจากงานขายปกติ</td>
</tr>
<tr>
<td><strong>approval_action</strong></td>
<td>งานที่เกี่ยวกับการอนุมัติหรือรอ action จากผู้อนุมัติ</td>
<td>ตรวจ quotation ก่อน approve, request revision, follow approval</td>
<td>ช่วยเชื่อมงานผู้อนุมัติกับ My Day แต่ approval workflow ยังเป็น source หลัก</td>
</tr>
<tr>
<td><strong>email_follow_up</strong></td>
<td>alias เก่าสำหรับ follow-up ผ่านอีเมล</td>
<td>ติดตามลูกค้าด้วยอีเมล</td>
<td>ยังรองรับเพื่อ compatibility แต่ควรใช้ <code>email</code> หรือ <code>follow_up</code> ให้ชัดกว่า</td>
</tr>
<tr>
<td><strong>reminder_action</strong></td>
<td>alias เก่าสำหรับ action เตือนความจำ</td>
<td>งานเตือนที่ถูกสร้างจาก flow เก่า</td>
<td>ยังรองรับเพื่อ compatibility แต่ type หลักที่ควรเลือกใหม่คือ <code>reminder</code></td>
</tr>
<tr>
<td><strong>other</strong></td>
<td>ใช้เมื่อไม่มี type ใดตรงจริง ๆ</td>
<td>งานเฉพาะกิจที่ยังไม่เข้าหมวด</td>
<td>ควรใช้ให้น้อย เพราะทำให้ reporting และการกรองงานไม่คม</td>
</tr>
</tbody>
</table>
<div class="note"><strong>Reminder vs Reminder Action:</strong> <code>reminder</code> คือ Activity Type หลักสำหรับตั้งเตือนใน CRM ส่วน <code>reminder_action</code> เป็น alias เก่าที่ระบบยังรับได้เพื่อไม่ให้ข้อมูลเก่าพัง งานใหม่ควรเลือก <code>reminder</code> เป็นหลัก</div>
</section>
<section class="panel" aria-labelledby="prospecting-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Prospecting Case</div>
<h2 id="prospecting-title">ถ้ายังไม่รู้จักลูกค้าและยังไม่มี Customer ในระบบ บันทึกอย่างไร</h2>
</div>
<p>กรณีเป็นการวิ่งหาลูกค้าใหม่ ยังไม่รู้บริษัทชัด ยังไม่มี contact และยังไม่มี lead ให้บันทึกเป็น Activity แบบ internal/prospecting ก่อน เพื่อเก็บงานของทีมโดยไม่สร้าง customer หรือ lead ปลอม</p>
</div>
<div class="steps-grid">
<article class="step">
<h3><span class="num">1</span> ก่อนออกไปหาลูกค้า</h3>
<div class="flow-fields">
<div class="field"><strong>Primary Entity</strong><p>เลือก <code>internal</code></p></div>
<div class="field"><strong>Primary Record Id</strong><p>เว้นว่าง เพราะยังไม่มี customer/lead/opportunity จริงในระบบ</p></div>
<div class="field"><strong>Activity Type</strong><p>เลือก <code>visit</code> ถ้าออกพื้นที่, <code>phone_call</code> ถ้าโทรหา, หรือ <code>internal_task</code> ถ้าเป็นงานเตรียมรายชื่อ</p></div>
<div class="field"><strong>Subject</strong><p>เขียนให้ค้นเจอ เช่น <code>Prospecting visit - Industrial estate A</code></p></div>
</div>
</article>
<article class="step">
<h3><span class="num">2</span> หลังไปแล้วได้เพียงสัญญาณอนาคต</h3>
<div class="flow-fields">
<div class="field"><strong>User Action</strong><p>Complete activity เดิม แล้วใส่ Outcome Summary ว่าเจอข้อมูลอะไร แต่ยังไม่มี lead confirmed</p></div>
<div class="field"><strong>System Action</strong><p>เก็บเป็นประวัติการทำงานของ MK/Sales โดยยังไม่ผูกกับ customer record</p></div>
<div class="field"><strong>Expected Result</strong><p>ผู้จัดการเห็นว่ามี prospecting activity เกิดขึ้น แต่ pipeline/lead ยังไม่บวมจากข้อมูลที่ยังไม่ยืนยัน</p></div>
<div class="field"><strong>Troubleshooting</strong><p>ถ้าต้องตามต่อ ให้สร้าง Activity ใหม่ชนิด <code>reminder</code> หรือ <code>follow_up</code> ในวันที่เหมาะสม</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">3</span> เมื่อเริ่มรู้จักลูกค้าจริง</h3>
<div class="flow-fields">
<div class="field"><strong>Customer</strong><p>สร้าง customer/contact เมื่อรู้ชื่อบริษัทหรือผู้ติดต่อมากพอ</p></div>
<div class="field"><strong>Lead</strong><p>สร้าง lead เมื่อมี requirement หรือโอกาสงานที่ยืนยันได้</p></div>
<div class="field"><strong>Linking</strong><p>Activity ใหม่หลังจากนั้นควรผูกกับ <code>customer</code> หรือ <code>lead</code> แทน <code>internal</code></p></div>
<div class="field"><strong>Expected Result</strong><p>Timeline ของ customer/lead เริ่มสะสมประวัติจากจุดที่มี record จริง</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">4</span> ตัวอย่างจากเคส MK</h3>
<div class="flow-fields">
<div class="field"><strong>Visit</strong><p><code>internal</code> + <code>visit</code>, scheduled date เป็นวันออกไปพื้นที่, subject ระบุพื้นที่หรือกลุ่มเป้าหมาย</p></div>
<div class="field"><strong>Outcome</strong><p>บันทึกว่า “ยังไม่ได้ lead แต่ได้ยินว่าจะมีงานในอีก 2 เดือน”</p></div>
<div class="field"><strong>Next Activity</strong><p>สร้าง <code>reminder</code> หรือ <code>follow_up</code> อีก 2 เดือน เพื่อกลับไปตรวจสอบโอกาสงาน</p></div>
<div class="field"><strong>Do Not</strong><p>อย่าสร้าง Customer/Lead ปลอมถ้ายังไม่มีข้อมูลยืนยัน เพราะจะทำให้ UAT pipeline และ report เพี้ยน</p></div>
</div>
</article>
</div>
</section>
<section class="panel" aria-labelledby="activity-status-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Create Activity Fields</div>
<h2 id="activity-status-title">Status แต่ละแบบมีผลอย่างไร</h2>
</div>
<p>Status คือสถานะการทำงานของ Activity มีผลต่อคิวงานใน My Day, การนับ overdue, การแก้ไขงานต่อ และ Timeline ของ record ที่เกี่ยวข้อง</p>
</div>
<table>
<thead>
<tr>
<th>Status</th>
<th>ความหมาย</th>
<th>ควรใช้เมื่อไร</th>
<th>ผลต่อระบบ</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>draft</strong></td>
<td>ร่างงานไว้ก่อน ยังไม่ถือว่าเริ่มทำจริง</td>
<td>ยังไม่พร้อมนัดหมาย หรือยังรอข้อมูลก่อน assign/schedule</td>
<td>ยังเป็นงานเปิด แต่ไม่ควรใช้เป็นงานปฏิบัติประจำวันนานเกินไป</td>
</tr>
<tr>
<td><strong>scheduled</strong></td>
<td>วางแผนแล้ว มีวันทำงานหรือวันครบกำหนด</td>
<td>มีนัด visit, meeting, call, follow-up หรือ reminder ที่ต้องทำในอนาคต</td>
<td>แสดงใน Calendar/My Day ตาม Scheduled Date หรือ Due Date และอาจกลายเป็น overdue เมื่อเลยเวลา</td>
</tr>
<tr>
<td><strong>in_progress</strong></td>
<td>กำลังทำงานนี้อยู่</td>
<td>เริ่มติดต่อ เริ่มติดตาม หรือกำลังประสานงานแต่ยังไม่เสร็จ</td>
<td>ยังเป็น active work และถ้าเลย Due Date จะถูกมองเป็น overdue</td>
</tr>
<tr>
<td><strong>completed</strong></td>
<td>ทำงานเสร็จแล้ว</td>
<td>โทรแล้ว, ไปพบแล้ว, ส่งอีเมลแล้ว, follow-up แล้ว และบันทึกผลลัพธ์แล้ว</td>
<td>ปิดงาน ไม่ถูกดันเป็น overdue อีก และควรมี Outcome Summary / Next Action ถ้าต้องตามต่อ</td>
</tr>
<tr>
<td><strong>cancelled</strong></td>
<td>ยกเลิกงาน</td>
<td>นัดถูกยกเลิก ลูกค้าไม่ต้องการแล้ว หรือสร้างผิด</td>
<td>ปิดงาน ไม่ขึ้นเป็น overdue และควรใส่ Cancellation Reason</td>
</tr>
<tr>
<td><strong>skipped</strong></td>
<td>ข้ามงานนี้ไป</td>
<td>งานไม่จำเป็นแล้ว แต่ไม่ใช่การยกเลิกแบบ error เช่น ลูกค้าตอบผ่านช่องทางอื่นแล้ว</td>
<td>ปิดงาน ไม่ขึ้นเป็น overdue และควรใส่ Skip Reason เพื่ออธิบายเหตุผล</td>
</tr>
<tr>
<td><strong>overdue</strong></td>
<td>เลยกำหนดแล้ว</td>
<td>โดยปกติไม่ต้องเลือกเอง ระบบคำนวณจากวันที่</td>
<td>เป็น effective status: ถ้างานยังไม่ completed/cancelled/skipped และเลย Due Date หรือ Scheduled Date ระบบจะแสดงเป็น overdue</td>
</tr>
</tbody>
</table>
<div class="note">Transition สำคัญ: <code>draft</code> ไป <code>scheduled</code> หรือ <code>cancelled</code>; <code>scheduled</code> ไป <code>in_progress</code>, <code>completed</code>, <code>cancelled</code>, <code>skipped</code>; งานที่ <code>completed</code>, <code>cancelled</code>, <code>skipped</code> แล้วถือว่าปิดและไม่ควรย้อนกลับ</div>
</section>
<section class="panel" aria-labelledby="activity-date-title">
<div class="section-head">
<div>
<div class="eyebrow"><span class="dot"></span> Schedule & Due Logic</div>
<h2 id="activity-date-title">Scheduled Date และ Due Date มีผลอย่างไร</h2>
</div>
<p>สองช่องนี้คล้ายกันแต่ตอบคนละคำถาม: Scheduled Date คือ “จะทำเมื่อไร” ส่วน Due Date คือ “ต้องเสร็จไม่เกินเมื่อไร”</p>
</div>
<div class="steps-grid">
<article class="step">
<h3><span class="num">1</span> Scheduled Date</h3>
<div class="flow-fields">
<div class="field"><strong>ความหมาย</strong><p>วันที่วางแผนให้ activity เกิดขึ้น เช่น วันนัดประชุม วันไปพบลูกค้า วันโทร</p></div>
<div class="field"><strong>ใช้เมื่อไร</strong><p>ใช้กับงานที่มีเวลาทำชัดเจน เช่น <code>meeting</code>, <code>visit</code>, <code>site_survey</code>, <code>phone_call</code></p></div>
<div class="field"><strong>ผลต่อ Calendar</strong><p>ทำให้งานแสดงเป็น event ใน Calendar และถ้าลาก event ใน Calendar ระบบจะ reschedule Activity</p></div>
<div class="field"><strong>ผลต่อ My Day</strong><p>งานจะเข้า Schedule/คิวประจำวันเมื่ออยู่ในช่วง today, tomorrow หรือ this week</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">2</span> Due Date</h3>
<div class="flow-fields">
<div class="field"><strong>ความหมาย</strong><p>วันครบกำหนดที่งานควรเสร็จ ไม่จำเป็นต้องเป็นวันเดียวกับวันที่นัดทำงาน</p></div>
<div class="field"><strong>ใช้เมื่อไร</strong><p>ใช้กับงานที่มี deadline เช่น ส่งเอกสารภายในวันศุกร์, follow-up ไม่เกินสิ้นเดือน</p></div>
<div class="field"><strong>ผลต่อ Overdue</strong><p>ระบบใช้ Due Date เป็นตัวเทียบก่อน ถ้าเลยกำหนดและงานยังไม่ปิด จะแสดงเป็น <code>overdue</code></p></div>
<div class="field"><strong>ผลต่อ Priority</strong><p>งานที่ due ใกล้หรือ overdue มีโอกาสถูกดันให้เห็นชัดใน My Day / Priority Queue</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">3</span> ถ้าใส่ทั้งสองช่อง</h3>
<div class="flow-fields">
<div class="field"><strong>ตัวอย่าง</strong><p>นัด visit วันที่ 2026-07-17 แต่ต้องส่งสรุปไม่เกิน 2026-07-18</p></div>
<div class="field"><strong>Scheduled Date</strong><p>ใส่วันที่งานเกิดขึ้นจริง: <code>2026-07-17</code></p></div>
<div class="field"><strong>Due Date</strong><p>ใส่ deadline: <code>2026-07-18</code></p></div>
<div class="field"><strong>Expected Result</strong><p>Calendar ช่วยดูวันนัด ส่วน My Day/Overdue ช่วยเตือน deadline</p></div>
</div>
</article>
<article class="step">
<h3><span class="num">4</span> ถ้าใส่แค่ช่องเดียว</h3>
<div class="flow-fields">
<div class="field"><strong>มีแต่ Scheduled Date</strong><p>เหมาะกับนัดหมายที่เกิดวันนั้นและไม่มี deadline แยก ระบบจะใช้ scheduled date ช่วยคำนวณ overdue ถ้างานไม่ปิด</p></div>
<div class="field"><strong>มีแต่ Due Date</strong><p>เหมาะกับ task/reminder ที่ต้องเสร็จภายในวันหนึ่ง แต่ไม่ได้มีเวลานัดชัดเจน</p></div>
<div class="field"><strong>ไม่มีทั้งสอง</strong><p>งานจะค้นเจอใน Activity แต่ My Day/Calendar จะช่วยเตือนได้จำกัด</p></div>
<div class="field"><strong>Best Practice</strong><p>ถ้าต้องการให้งานขึ้น Calendar ให้ใส่ Scheduled Date; ถ้าต้องการกันลืม deadline ให้ใส่ Due Date</p></div>
</div>
</article>
</div>
<div class="note">หลักจำง่าย: <code>Scheduled Date</code> = วัน/เวลาที่จะทำงาน, <code>Due Date</code> = วันสุดท้ายที่งานต้องเสร็จ. ถ้า Due Date มีค่า ระบบจะใช้ Due Date เป็นหลักในการตัดสิน overdue; ถ้าไม่มี Due Date จึงใช้ Scheduled Date แทน</div>
</section>
<p class="print-foot">ALLA OS UAT Setup Flow - generated from setup/ALLA-ONVALLA CSV dataset.</p>
</main>
</body>
</html>