- odoodev.png (737.18 KiB) Viewed 2635 times
เพื่อปรับแต่ง Kanban View ที่มีอยู่แล้วใน Odoo สามารถทำได้โดยการสืบทอด View เดิม (inheritance) ผ่าน XML ซึ่งช่วยให้เราสามารถเพิ่มหรือลบองค์ประกอบต่าง ๆ ใน View ได้
ตัวอย่างการเพิ่มฟิลด์ priority บน Kanban Card:
โค้ด: เลือกทั้งหมด
<record id="custom_project_task_kanban_view" model="ir.ui.view">
<field name="name">project.task.kanban.custom</field>
<field name="model">project.task</field>
<field name="inherit_id" ref="project.view_task_kanban"/>
<field name="arch" type="xml">
<xpath expr="//div[@class='o_kanban_card']" position="inside">
<div class="o_kanban_priority">
<field name="priority"/>
</div>
</xpath>
</field>
</record>
- เรากำลังสืบทอด View เดิมที่ชื่อ project.view_task_kanban
- เพิ่มฟิลด์ priority ลงในการ์ด Kanban ในส่วนที่กำหนด
การใช้ kanban_bar เป็นหนึ่งในคุณสมบัติที่มีประโยชน์ใน Kanban View โดยแสดงแถบความคืบหน้าในแต่ละการ์ด เช่น การแสดงสถานะหรือระดับความสำเร็จของงาน
ตัวอย่างการใช้ kanban_bar ในการแสดงความคืบหน้าของงาน:
โค้ด: เลือกทั้งหมด
<kanban>
<field name="stage_id"/>
<field name="progress" widget="kanban_bar" options="{'max_value': 100}"/>
</kanban>
- ฟิลด์ progress จะถูกแสดงเป็นแถบความคืบหน้า
- options="{'max_value': 100}" กำหนดค่าสูงสุดของแถบความคืบหน้าเป็น 100%
เราสามารถจัดลำดับการแสดงผลของการ์ดใน Kanban View โดยใช้คำสั่ง group_by หรือปรับแต่งลำดับตามเงื่อนไขที่ต้องการ
ตัวอย่างการใช้ group_by เพื่อจัดกลุ่มการ์ดตามสถานะของงาน:
โค้ด: เลือกทั้งหมด
<kanban>
<field name="stage_id" widget="statusbar" statusbar_visible="True"/>
<field name="assigned_to" group_by="stage_id"/>
</kanban>- ใช้ group_by="stage_id" เพื่อจัดกลุ่มการ์ดตามสถานะของงาน
- statusbar_visible="True" แสดงสถานะของการ์ดในรูปแบบแถบสถานะ
การใช้สีช่วยให้ผู้ใช้สามารถระบุสถานะหรือความสำคัญของการ์ดได้ง่ายขึ้น Odoo รองรับการใช้สีผ่าน decoration-* เช่น decoration-success สำหรับการทำเครื่องหมายสำเร็จ หรือ decoration-danger สำหรับสถานะที่ต้องการการดูแลเป็นพิเศษ
ตัวอย่างการใช้สีเพื่อแสดงสถานะของการ์ด:
โค้ด: เลือกทั้งหมด
<kanban>
<field name="stage_id"/>
<field name="priority" decoration-danger="priority == 'high'"/>
</kanban>- decoration-danger="priority == 'high'" จะทำให้การ์ดที่มีความสำคัญสูงแสดงด้วยสีแดง
หากต้องการเพิ่มปุ่มเพื่อให้ผู้ใช้สามารถทำการเปลี่ยนแปลงสถานะหรือทำงานบางอย่างใน Kanban View ได้ทันที สามารถใช้ button ในการกำหนด
ตัวอย่างการเพิ่มปุ่ม Mark as Done ใน Kanban Card:
โค้ด: เลือกทั้งหมด
<kanban>
<button name="action_done" type="object" string="Mark as Done" class="oe_highlight"/>
</kanban>- name="action_done" เป็นฟังก์ชันที่ต้องถูกกำหนดในโมเดล
- type="object" คือการเรียกใช้เมธอดในโมเดล
- class="oe_highlight" เพื่อเน้นปุ่มให้เด่นขึ้น
การปรับแต่ง Kanban View ใน Odoo เป็นกระบวนการที่ต้องอาศัยความเข้าใจทั้งในด้านเทคนิคและการออกแบบเพื่อสร้างประสบการณ์ผู้ใช้ที่ดี เริ่มจากการใช้การสืบทอด View ผ่าน XML แทนการแก้ไขไฟล์หลักโดยตรง การเพิ่มฟิลด์ใหม่ลงในการ์ดควรทำอย่างมีระบบ โดยคำนึงถึงความสัมพันธ์ของข้อมูลและความจำเป็นในการใช้งานจริง การใช้สีผ่าน decoration-* ช่วยสร้างความแตกต่างระหว่างสถานะต่างๆ ได้อย่างชัดเจน เช่น การ์ดสีแดงสำหรับงานที่ค้างนาน หรือสีเขียวสำหรับงานที่เสร็จสมบูรณ์ การแสดงความคืบหน้าผ่าน kanban_bar ทำให้ผู้ใช้สามารถประเมินสถานะงานได้ในพริบตา ส่วนการเพิ่มปุ่มดำเนินการเฉพาะช่วยเพิ่มประสิทธิภาพการทำงานโดยลดขั้นตอนที่ไม่จำเป็น การจัดกลุ่มข้อมูลด้วย Group By ที่เหมาะสมจะสร้างระบบการจัดการงานที่มีประสิทธิภาพ ในทางเทคนิคควรระมัดระวังเรื่อง Performance เมื่อมีข้อมูลจำนวนมาก และทดสอบการแสดงผลบนอุปกรณ์ต่างๆ การออกแบบที่ดีควรผสมผสานระหว่างความสวยงามและประโยชน์ใช้สอย โดยเน้นที่การแก้ปัญหาการทำงานจริงมากกว่าความสวยงามภายนอก การใช้ Placeholder และ Tooltip ช่วยเพิ่มความสะดวกในการใช้งาน ขณะที่การกำหนด Default Sort Order ที่สอดคล้องกับ Workflow จะทำให้ระบบใช้งานได้อย่างเป็นธรรมชาติที่สุด
อ้างอิง
https://www.odoo.com/documentation/16.0/developer/tutorials/master_odoo_web_framework/03_custom_kanban_view.html
https://www.cybrosys.com/blog/how-to-create-kanban-view-in-odoo-17
https://www.cybrosys.com/blog/how-to-create-a-simple-kanban-view-in-odoo
