Joget DX Available for Download

Check out Joget DX, the next generation successor to Joget Workflow for faster, simpler digital transformation.

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Info
titlePrevious step

Make sure that you have first completed the previous tutorial - Designing a Userview


Thai
ตรวจสอบให้แน่ใจว่าคุณได้ทำบทช่วยสอนก่อนหน้าเสร็จแล้ว - Designing a Userview



Table of Contents
maxLevel2
stylecircle


Widget Connector
width600
urlhttps://www.youtube.com/watch?v=W4LeBAMTTcY&list=PLFOgRDg2hmNLRplreZz_1l8ZITPZklPgZ&index=5

Introducing the new Process Builder

  1. In the Design App page, click on the Processes menu on the left, and then on the Design Processes button along the top.

    Thai

    ในหน้า Design App คลิกที่เมนู Processes ทางด้านซ้ายจากนั้นคลิกที่ปุ่ม Design Processes ที่อยู่ด้านบน




  2. This is the Process Builder.There are 3 main areas in the Process Builder. On the top (red), the Navigator panel contains a list of processes together with the action buttons on the right. On the left (blue), this is where the element palette is placed by default. One can move it around to suit one's style. The main panel in the middle is the Graph area (green) that contains the actual process diagram.


    Thai
    นี่คือตัวสร้าง Process Builder  มี 3 ส่วนหลักในตัวสร้างกระบวนการ ที่ด้านบน (สีแดง) พาเนล Navigator มีรายการกระบวนการพร้อมกับปุ่มการกระทำทางด้านขวา ทางด้านซ้าย (สีน้ำเงิน) นี่คือตำแหน่งที่วางจานองค์ประกอบตามค่าเริ่มต้น หนึ่งสามารถย้ายไปรอบ ๆ เพื่อให้เหมาะกับสไตล์ของแต่ละคน แผงหลักตรงกลางคือพื้นที่กราฟ (สีเขียว) ที่มีแผนภาพกระบวนการจริง






  3. Click on the edit icon under the process name in the Navigator. This brings up the properties dialog where you can edit the process details. Take note on the default workflow variable called status.


    Thai
    คลิกที่ไอคอนแก้ไขภายใต้ชื่อกระบวนการใน Navigator สิ่งนี้จะแสดงกล่องโต้ตอบคุณสมบัติที่คุณสามารถแก้ไขรายละเอียดกระบวนการ จดบันทึกเกี่ยวกับตัวแปรเวิร์กโฟลว์เริ่มต้นที่เรียกว่าสถานะ






  4. Add Participants into the process by clicking on the green add button under current Participant. Participants represent users or roles that perform a certain task. Click on the edit button while hovering over the participant name to set its properties.


    Thai
    เพิ่มผู้เข้าร่วมในกระบวนการโดยคลิกที่ปุ่มเพิ่มสีเขียวภายใต้ผู้เข้าร่วมปัจจุบัน ผู้เข้าร่วมแสดงถึงผู้ใช้หรือบทบาทที่ทำงานบางอย่าง คลิกที่ปุ่มแก้ไขในขณะที่โฮเวอร์เหนือชื่อผู้เข้าร่วมเพื่อตั้งค่าคุณสมบัติ




  5. Add Activities, Tools and Routes into the process diagram. Activities represent forms which require human interaction. Tools represent system or automated tasks, and routes are decision points. Use Transitions to link them all together in a flow. You may either expand your design by connecting from existing nodes or by dragging the required nodes from the element palette into the process diagram.  


    Thai

    เพิ่มกิจกรรมเครื่องมือและเส้นทางลงในแผนภาพกระบวนการ กิจกรรมเป็นตัวแทนของรูปแบบที่ต้องมีปฏิสัมพันธ์กับมนุษย์ เครื่องมือแสดงถึงระบบหรืองานอัตโนมัติและเส้นทางเป็นจุดตัดสินใจ ใช้การเปลี่ยนภาพเพื่อเชื่อมโยงพวกมันทั้งหมดเข้าด้วยกันในโฟลว์ คุณสามารถขยายการออกแบบของคุณโดยการเชื่อมต่อจากโหนดที่มีอยู่หรือโดยการลากโหนดที่ต้องการจากจานสีองค์ประกอบลงในแผนภาพกระบวนการ








  6. Ensure that the process has a proper Start and End. Click on Deploy at the top right to deploy the process to the server.


    Thai

    ตรวจสอบให้แน่ใจว่ากระบวนการมีการเริ่มต้นและสิ้นสุดที่เหมาะสม คลิกที่ Deploy ที่ด้านบนขวาเพื่อปรับใช้กระบวนการกับเซิร์ฟเวอร์


Mapping Participants to Users

  1. Once a process has been successfully deployed, return to the previous tab/window. The new process diagram will be generated after you click on OK. Joget will interpret the process diagram and load the process details.


    Thai

    เมื่อกระบวนการได้รับการปรับใช้เรียบร้อยแล้วให้กลับไปที่แท็บ / หน้าต่างก่อนหน้า แผนภาพกระบวนการใหม่จะถูกสร้างขึ้นหลังจากที่คุณคลิกที่ตกลง Joget จะตีความแผนภาพกระบวนการและโหลดรายละเอียดกระบวนการ



     

  2. Click on Configure Mapping button along the top.


    Thai

    คลิกที่ปุ่ม Configure Mapping ที่ด้านบน


       

  3. The Process Mapper is one of the main highlights Joget DX.


    Thai

    Process Mapper เป็นหนึ่งในไฮไลท์หลักของ Joget DX


     

  4. Click on the Participant to open up the Map Participants to Users.


    Thai

    คลิกที่ผู้เข้าร่วมเพื่อเปิดแผนที่ผู้เข้าร่วมไปยังผู้ใช้




  5. Participants defined in the process are listed in the Map Participants to Users, and you can map each participant to specific people. Click on Add/Edit Mapping to map to specific groups, users, organization chart, etc. If no mapping is done for a participant, any tasks are automatically defaulted to the current user instead.


    Thai

    ผู้เข้าร่วมที่กำหนดไว้ในกระบวนการมีการระบุไว้ใน Map Participants to Users และคุณสามารถแมปผู้เข้าร่วมแต่ละคนกับบุคคลที่เฉพาะเจาะจง คลิกที่เพิ่ม / แก้ไขการแมปเพื่อแมปกับกลุ่มผู้ใช้แผนภูมิองค์กรและอื่น ๆ หากไม่มีการจับคู่กับผู้เข้าร่วมกิจกรรมใด ๆ จะเริ่มต้นโดยอัตโนมัติกับผู้ใช้ปัจจุบันแทน


     

Mapping Activities to Forms

  1. In the Process Mapper, click on an Activity to open up the Map Activities to Forms.


    Thai

    ใน Process Mapper คลิกที่กิจกรรมเพื่อเปิด Map Activities to Forms




  2. In the Map Activities to Forms, all process activities are listed.


    Thai

    ใน Map Activities to Forms กิจกรรมกระบวนการทั้งหมดจะแสดงรายการ



  3. For each activity, click on Add/Edit Form to select from a list of current forms in the app.


    Thai

    สำหรับแต่ละกิจกรรมคลิกที่ Add/Edit Form เพื่อเลือกจากรายการของแบบฟอร์มปัจจุบันในแอป


     
     
     

  4. As an example to handle an approval process, click on Create New Form to create a new Travel Approval Form. In this new form, add a Subform that displays the original submitted form, and radio buttons to capture the approval status.


    Thai

    เป็นตัวอย่างในการจัดการกระบวนการอนุมัติคลิกที่ Create New Form เพื่อสร้างแบบฟอร์มอนุมัติการเดินทางใหม่ ในฟอร์มใหม่นี้เพิ่มฟอร์มย่อยที่แสดงฟอร์มที่ส่งเหมือนเดิมและปุ่มตัวเลือกเพื่อจับสถานะการอนุมัติ


     
     
     

  5. Configure this Subform to select the original request form.


    Thai

    กำหนดค่าฟอร์มย่อยนี้เพื่อเลือกแบบฟอร์มคำขอต้นฉบับ


     
     
     

  6. Configure the status radio button to have Approved and Rejected options.


    Thai

    กำหนดค่าปุ่มตัวเลือกสถานะให้มีตัวเลือกอนุมัติและปฏิเสธ


     
     
     

  7. For routing purposes, an important setting in the radio button is the mapping to a workflow variable under Advanced Options. In this case, setting the mapping to status means that the value will be stored in the status workflow variable.


    Thai

    สำหรับการกำหนดเส้นทางการตั้งค่าที่สำคัญในปุ่ม radio button คือการแมปไปยังตัวแปรเวิร์กโฟลว์ภายใต้ตัวเลือกขั้นสูง ในกรณีนี้การตั้งค่าการจับคู่กับสถานะหมายความว่าค่าจะถูกเก็บไว้ในตัวแปรสถานะเวิร์กโฟลว์


     

      

  8. After all the configuration, the new approval form should look similar to the following screenshot:


    Thai

    หลังจากการกำหนดค่าทั้งหมดแบบฟอร์มการอนุมัติใหม่ควรมีลักษณะคล้ายกับภาพหน้าจอต่อไปนี้:


     

  9. Ensure the Activities are mapped accordingly.

    Thai
    ตรวจสอบให้แน่ใจว่ากิจกรรมถูกแมปอย่างเหมาะสม


      

Mapping Tools to Plugins

  1. By clicking on a Tool in the Process Mapper, it will open up the Map Tools to Plugins


    Thai

    โดยการคลิกที่เครื่องมือใน Process Mapper จะเปิดเครื่องมือ Map Tools to Plugins


       

  2. In the Map Tools to Plugins, you can map tools defined in the process to plugins. For each tool, select a Plugin and perform the necessary configuration.


    Thai
    ใน Map Tools to Plugins คุณสามารถแมปเครื่องมือที่กำหนดไว้ในกระบวนการเพื่อปลั๊กอิน สำหรับแต่ละเครื่องมือให้เลือกปลั๊กอินและดำเนินการกำหนดค่าที่จำเป็น


     
      

Mapping Routes to Plugins

  1. To handle routing (for example approval conditions), use Routes in combination with workflow variables. To create a workflow variable, click on Design Process to access the Process Builder. Double click on the process name in the Navigator to bring up the process dialog. Click on the first small icon under the Workflow variable heading, and key in the ID of the variable e.g. status.


    Thai

    ในการจัดการการจัดเส้นทาง (ตัวอย่างเช่นเงื่อนไขการอนุมัติ) ให้ใช้ Routes ร่วมกับตัวแปรเวิร์กโฟลว์ ในการสร้างตัวแปรเวิร์กโฟลว์คลิกที่ Design Process เพื่อเข้าถึง Process Builder ดับเบิลคลิกที่ชื่อกระบวนการใน Navigator เพื่อเปิดกล่องโต้ตอบกระบวนการ คลิกที่ไอคอนเล็ก ๆ แรกใต้ส่วนหัวตัวแปร Workflow และพิมพ์ ID ของตัวแปรเช่น สถานะ.

    Info
    titleRoutes

    Learn more about  Process Routes .

    Thai

    เรียนรู้เพิ่มเติมเกี่ยวกับ Process Routes .



  2. Once a workflow variable has been defined, get back to the Process Mapper. By clicking on a Route it will open up the Map Routes to Plugins.


    Thai

    เมื่อตัวแปรเวิร์กโฟลว์ถูกกำหนดแล้วให้กลับไปที่ Process Mapper โดยคลิกที่เส้นทางมันจะเปิดเส้น Map Routes to Plugins


     

  3. In Map Routes to Plugins, you can map routes defined in the process to plugins. Select the Simple Rules Decision plugin. 


    Thai

    ใน Map Routes to Plugins คุณสามารถแมปเส้นทางที่กำหนดไว้ในกระบวนการเพื่อปลั๊กอิน เลือกปลั๊กอิน Simple Rules Decision




  4. In the plugin configuration,click on Add Rule and then click Add Condition. Set the Variable field to status and set the Value field to Approved. The variable status is referring to the workflow variable


    Thai

    ในการกำหนดค่าปลั๊กอินให้คลิกที่ Add Rule แล้วคลิก Add Condition ตั้งค่าฟิลด์ตัวแปรเป็นสถานะและตั้งค่าฟิลด์เป็นอนุมัติ สถานะตัวแปรอ้างถึงตัวแปรเวิร์กโฟลว์




  5. In the THEN rule, click on Add Action and set Type to Transition  and set Transition to transition3 (Send Approved Email). This means that this transition will occur if the value of status is "Approved".


    Thai

    จากนั้นคลิกที่ Add Action และตั้งค่า Type เป็น Transition และการตั้งค่า Transition ไปสู่ transition3 (ส่งอีเมลที่ได้รับอนุมัติ) ซึ่งหมายความว่าการเปลี่ยนแปลงนี้จะเกิดขึ้นหากค่าสถานะเป็น "อนุมัติ"


     

  6. In the ELSE THEN rule, Set the Type to Transition and set Transition to transition4 (Send Rejected Email) to indicate that it is the default path to take when other conditions are not met. An example of a simple routing process is as shown below:


    Thai

    ในกฎ ELSE THEN ให้ตั้งค่า Type เป็น Transition และตั้งค่า Transition เป็น transition4 (ส่งอีเมลที่ถูกปฏิเสธ) เพื่อระบุว่าเป็นเส้นทางเริ่มต้นที่จะใช้เมื่อไม่ตรงตามเงื่อนไขอื่น ๆ ตัวอย่างของกระบวนการผลิตอย่างง่ายดังแสดงด้านล่าง:


Test Driving the Process

  1. To perform a test run on a process, click on the Run Process button along the top of the App design process page.


    Thai

    เพื่อทำการทดสอบการทำงานกับกระบวนการคลิกที่ปุ่ม Run Process ที่ด้านบนของหน้ากระบวนการออกแบบแอป









Incorporating the Process into the Userview

  1. In the Design App page, click on the name of an existing userview to launch the Userview Builder.


    Thai

    ในหน้า Design App ให้คลิกที่ชื่อของ userview ที่มีอยู่เพื่อเรียกใช้ Userview Builder


      

  2. Drag a Run Process element into a menu category. This menu element allows the user to start a process from the userview.


    Thai

    ลากองค์ประกอบ Run Process ในหมวดหมู่เมนู องค์ประกอบเมนูนี้ช่วยให้ผู้ใช้สามารถเริ่มกระบวนการจาก userview


     

  3. Click on Properties of the Run Process element and select the process to run.


    Thai

    คลิกที่คุณสมบัติขององค์ประกอบเรียกใช้กระบวนการและเลือกกระบวนการที่จะเรียกใช้


     
      

  4. Drag an Inbox element into a menu category. This menu element provides the user with an inbox to manage their assigned workflow tasks.


    Thai

    ลากองค์ประกอบ Inbox ลงในหมวดหมู่เมนู องค์ประกอบเมนูนี้จัดเตรียมกล่องจดหมายเข้าของผู้ใช้เพื่อจัดการงานจากเวิร์กโฟลว์


     
      

  5. Save the userview, and you will be able to run and perform assigned tasks in the published userview.


    Thai

    บันทึก userview และคุณจะสามารถเรียกใช้และทำงานที่ได้รับมอบหมายใน userview ที่เผยแพร่




Related Tutorials

Children Display