Tháng Mười Hai 3, 2022 / Thủ Thuật, Tôi Làm Ứng Dụng

Một trong những cách sử dụng phổ biến nhất cho Power Apps là tạo một biểu mẫu để nhân viên điền vào và được nhiều người chấp thuận. Một ví dụ nhanh về điều này là ứng dụng Yêu cầu nghỉ phép. Trong đó thời gian nghỉ phải được sự chấp thuận của người quản lý và bộ phận nhân sự. Xây dựng biểu mẫu để thu thập thông tin cho ứng dụng này sẽ đơn giản nhưng làm cách nào bạn có thể gửi biểu mẫu tới từng người phê duyệt và yêu cầu họ ra quyết định?

Trong bài viết này, tôi sẽ chỉ cho bạn cách tạo biểu mẫu phê duyệt Power Apps với nhiều người phê duyệt, gửi yêu cầu phê duyệt qua email và trực quan hóa tiến trình phê duyệt bằng thành phần chỉ báo tiến độ thông qua việc xây dựng Ứng Dụng Yêu Cầu Thiết Bị

Giới Thiệu Ứng Dụng Yêu Cầu Thiết Bị

Ứng Dụng Yêu Cầu Thiết Bị cho phép nhân viên của một công ty có thể tạo yêu cầu cấp phát các thiết bị phục vụ cho công việc như Máy tính để bàn, Máy tính xách tay, Màn hình hoặc Bàn phím, Chuột mới,… Tất cả các yêu cầu này đều cần được phê duyệt bởi người quản lý trực tiếp của nhân viên và người quản lý IT trước khi xuất kho.

Để tạo Ứng Dụng Yêu Cầu Thiết Bị, bạn sẽ phải đi qua các bước sau đây:

Bước 1: Tạo SharePoint List

Bước 2: Tạo biểu mẫu yêu cầu mới (trong bước này bạn cần thiết lập các tính năng như: trạng thái của yêu cầu, ngày yêu cầu, thông tin người tạo yêu cầu, thông tin người phê duyệt, thông tin quản lý phòng IT, thiết lập tính năng chặn thao tác thủ công khi nhập liệu, và tạo nút hoàn tất yêu cầu)

Bước 3: Kính hoạt tính năng phê duyệt từ cấp quản lý (trong bước này bạn cần thiết lập các tính năng như: OnStart của ứng dụng, gửi email khi có yêu cầu mới, tạo nút từ chối/ phê duyệt)

Bước 1: Tạo SharePoint List

Bạn hãy tạo SharePoint List mới có tên là Equipment Orders với các cột như bên dưới:

Tên CộtLoại Dữ LiệuMô Tả
EquipmentChoicesBao gồm các lựa chọn sau:

Desktop PC – $1000
Laptop – $1500
Monitor – $300
Keyboard & Mouse – $80
StatusChoices Bao gồm các lựa chọn sau:

New
Submitted
Approved By Manager
Rejected By Manager
Approved By IT Manager
Rejected By IT Manager
Request DateDateNgày gởi yêu cầu
EmployeePersonNhân viên yêu cầu
ManagerPersonQuản lý trực tiếp
IT ManagerPersonQuản Lý phòng CNTT
CommentsMultiline TextNhân viên có thể giải trình lý do yêu cầu thiết bị

Bắt đầu ứng dụng canvas mới ttrong Power Apps Studio có tên là  IT Equipment Requests. Kết nối SharePoint List Equipment Orders của bạn với ứng dụng và thêm Biểu mẫu (Edit Form) vào màn hình. Sắp xếp các trường của biểu mẫu trong một cột như hình bên dưới.

Bước 2: Tạo biểu mẫu yêu cầu mới

Trong bước này, nhân viên cần phải chọn thiết bị họ muốn yêu cầu, viết lý do trong trường nhận xét và nhấp vào gửi để gửi biểu mẫu cho người quản lý của họ phê duyệt. Lưu ý: các trường khác của biểu mẫu phải được điền tự động để tránh lỗi nhập dữ liệu. Để tạo được các tính năng này, chúng ta sẽ lần lượt thiết lập theo các bước như sau:

2.1 Thiết lập trạng thái gửi biểu mẫu

Trạng thái yêu cầu phải là ‘New’ trước khi gửi và sau đó chuyển sang ‘Submitted’ khi nhân viên nhấp vào nút gửi. Sử dụng mã này trong thuộc tính Default của thẻ Status

If(
    frm_Request.Mode=FormMode.New,
    {Value: Coalesce(varStatus, "New")},
    ThisItem.Status
)

Sau đó, tạo nút gửi ở cuối biểu mẫu và copy mã này vào thuộc tính OnSelect .

Set(varStatus, "Submitted"); SubmitForm(frm_Request);

Bây giờ mẫu yêu cầu sẽ trông như thế này.

2.2 Tạo trường ngày yêu cầu

Ngày yêu cầu phải luôn là ngày nhân viên gửi biểu mẫu. Nhập mã này vào thuộc tính Default của thẻ Ngày yêu cầu.

If(frm_Request.Mode=FormMode.New, Today(), ThisItem.RequestDate)

2.3 Tạo trường thông tin nhân viên

Trường thông tin nhân viên sẽ tự động điền từ tài khoản của người đang gửi biểu mẫu để tránh sai sót và tiết kiệm thời gian. Để ghi dữ liệu loại Person vào SharePoint List, chúng ta phải sử dụng một số mã đặc biệt trong trường Default của thẻ Nhân viên.

If(
    frm_Request.Mode = FormMode.New,
    {
        '@odata.type': "#Microsoft.Azure.Connectors.SharePoint.SPListExpandedUser",
        Claims: "i:0#.f|membership|" & User().Email,
        Department: "",
        DisplayName: User().FullName,
        Email: User().Email,
        JobTitle: "",
        Picture: ""
    },
    ThisItem.Employee
)

2.4 Tạo trường thông tin cấp quản lý phê duyệt

Chúng ta có thể lấy thông người quản lý trực tiếp của nhân viên đưa ra yêu cầu bằng cách sử dụng trình kết nối UserOffice365. Thêm trình kết nối này vào ứng dụng của bạn và sử dụng mã này trong thuộc tính Default của thẻ Manager

With(
    {wManager: Office365Users.ManagerV2(User().Email)},
    If(
        frm_Request.Mode=FormMode.New,
        {
            '@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedUser",
            Claims:"i:0#.f|membership|" & wManager.mail,
            Department:"",
            DisplayName: wManager.displayName,
            Email: wManager.mail,
            JobTitle:"",
            Picture:""
        },
        ThisItem.Manager
    )
)

2.5 Tạo trường thông tin cấp quản lý bộ phận CNTT

Trường Người quản lý CNTT phải được mặc định là tên của Người quản lý CNTT của công ty. Chúng ta sẽ mã hóa cứng thông tin này vào ứng dụng nhưng trong thực tế, thông tin này có thể được lấy từ một danh sách SharePoint khác chứa tên của những người có chủ chốt trong công ty. Đặt mã này vào thuộc tính Default của thẻ Trình quản lý CNTT.

If(
    frm_Request.Mode=FormMode.New,
    {
        '@odata.type':"#Microsoft.Azure.Connectors.SharePoint.SPListExpandedUser",
        Claims:"i:0#.f|membership|" & "david.johnson@yourcompany.com",
        Department:"",
        DisplayName: "David Johnson",
        Email:"david.johnson@yourcompany.com",
        JobTitle:"",
        Picture:""
    },
    ThisItem.ITManager
)

2.6 Thiết lập tính năng ngăn chặn nhập thủ công vào các trường dữ liệu

Để tránh trường hợp nhân viên thay đổi các giá trị mặc định trong các trường Trạng thái, Ngày yêu cầu, Nhân viên, Người quản lý và Người quản lý CNTT, chúng ta cần tắt khả năng chỉnh sửa bằng cách cập nhật thuộc tính DisplayMode thành chế độ only view – chỉ cho xem trong mỗi thẻ.

DisplayMode.View

Ứng dụng Yêu cầu Thiết bị bây giờ trông như thế này.

2.7 Thiết lập tính năng hoàn tất quy trình yêu cầu

Cần thêm một vài dòng mã để làm cho biểu mẫu gửi yêu cầu mới. Viết mã này vào các thuộc tính sau của biểu mẫu

DefaultMode: FormMode.New

Item: varRequest

OnSuccess: ViewForm(frm_Request); Set(varRequest, frm_Request.LastSubmit);

Cuối cùng, chúng tôi muốn làm cho nút Submit biến mất khi biểu mẫu đã được gửi. Đặt mã này vào thuộc tính Visible của nút.

Form_EquipmentRequest.Mode=FormMode.New

Bây giờ một nhân viên có thể gửi biểu mẫu.

Bước 3: Kính hoạt tính năng phê duyệt từ cấp quản lý

Khi một nhân viên tạo một yêu cầu mới, một email sẽ được tự động gửi đến người quản lý trực tiếp của họ để yêu cầu phê duyệt. Người quản lý nhấp vào liên kết trong email để mở Power Apps tới biểu mẫu cần phê duyệt.

Trên giao diện của cấp quản lý, sẽ có hai nút xuất hiện là ‘Approve’ và ‘Reject’.  Biểu mẫu Phê duyệt cũng sẽ được gửi đến Người quản lý CNTT qua email. Nếu họ cũng chấp thuận, nhân viên sẽ nhận được thông báo rằng yêu cầu của họ đã được chấp thuận. Hoặc, nếu một trong hai người quản lý nhấp vào Từ chối thì nhân viên sẽ nhận được email thông báo rằng yêu cầu đã bị từ chối.

Để thể hiện được các tính năng này, chúng ta cần thiết lập ứng dụng theo các bước như sau:

3.1 Thiết lập OnStart của ứng dụng

Để tạo điều kiện thuận lợi cho việc gửi email có liên kết để mở ứng dụng, hãy đặt mã sau vào thuộc tính OnStart của ứng dụng. Lưu ý nhỏ là bạn nên sử dụng URL App Play của riêng mình thay vì URL mà tôi đang ghi ở đây.

// store the app play url in a variable
Set(varAppID, "https://apps.powerapps.com/play/xxxxxx-xxxx-xxxxx-xxxxx-xxxxxxxx?tenantId=xxxxxxx-xxxxxx-xxxxx-xxxxxx-xxxxxxxxx");

// lookup the request by id number and store in a variable
Set(varRequest, LookUp('IT Equipment Orders', ID=Value(Param("recordid"))));

// open the app in view-only mode if a matching request id is found
If(IsBlank(varRequest), NewForm(frm_Request),  ViewForm(frm_Request));

3.2 Thiết lập tính năng tự động gửi mail khi có yêu cầu mới

Để gửi email trực tiếp từ Power Apps, hãy thêm trình kết nối Office365Outlook . Sau đó viết mã này vào thuộc tính OnSuccess của biểu mẫu. Mã này sẽ gửi email đến người quản lý khi có yêu cầu mới được gửi.

ViewForm(frm_Request);
Set(varRequest, frm_Request.LastSubmit);
If(varRequest.Status.Value="Submitted",
    Office365Outlook.SendEmailV2(
        varRequest.Manager.Email,
        "IT Equipment Request - Approval Required",
        "An I/T equipment request was made for a "&varRequest.Equipment.Value&" by "&varRequest.Employee.DisplayName&".  <a href="""&varAppID&"?recordid="&varRequest.ID&""">Click here</a> to approve/reject the request."
    )
)


Email được tạo bởi đoạn mã trên sẽ xuất hiện như thế này trong hộp thư đến của người quản lý.

3.3 Thiết lập các nút Phê duyệt & Từ chối

Các nút Phê duyệt và ừ chối sẽ thay thế nút gửi ở cuối biểu mẫu khi yêu cầu đang được xem xét. Đặt hai nút ở dưới cùng của biểu mẫu như trong hình bên dưới.

Khi nhấp vào phê duyệt, một email sẽ được gửi đến người tiếp theo trong quy trình phê duyệt. Sao chép và dán mã này vào thuộc tính OnSelect của nút phê duyệt.

If(
    varRequest.Status.Value="Submitted",
    Set(varRequest, Patch('IT Equipment Orders', LookUp('IT Equipment Orders', ID=varRequest.ID), {Status: {Value: "Approved By Manager"}}));
    Office365Outlook.SendEmailV2(
        varRequest.ITManager.Email,
        "IT Equipment Request - Approval Required",
        "An I/T equipment was made for a "&varRequest.Equipment.Value&" by "&varRequest.Employee.DisplayName&".  <a href="""&varAppID&"?recordid="&varRequest.ID&""">Click here</a> to approve/reject the request."
    ),

    varRequest.Status.Value="Approved By IT Manager",
    Set(varRequest, Patch('IT Equipment Orders', LookUp('IT Equipment Orders', ID=varRequest.ID), {Status: {Value: "Approved By IT"}}));
    Office365Outlook.SendEmailV2(
        varRequest.Employee.Email,
        "IT Equipment Request - Approved",
        "Your I/T equipment was approved for a "&varRequest.Equipment.Value&" by "&varRequest.Employee.DisplayName&".  <a href="""&varAppID&"?recordid="&varRequest.ID&""">Click here</a> to view the request."
    )
)

Ngược lại, khi nhấn nút từ chối, quá trình phê duyệt sẽ dừng lại và nhân viên sẽ được thông báo về yêu cầu bị từ chối. Sao chép và dán mã này vào thuộc tính OnSelect của nút Từ chối.

If(
    varRequest.Status.Value="Submitted",
    Set(varRequest, Patch('IT Equipment Orders', LookUp('IT Equipment Orders', ID=varRequest.ID), {Status: {Value: "Rejected By Manager"}}));
    Office365Outlook.SendEmailV2(
        varRequest.Employee.Email,
        "IT Equipment Request - Rejected",
        "Your I/T equipment was rejected for a "&varRequest.Equipment.Value&" by "&varRequest.Employee.DisplayName&".  <a href="""&varAppID&"?recordid="&varRequest.ID&""">Click here</a> to view the request."
    ),

    varRequest.Status.Value="Approved By Manager",
    Set(varRequest, Patch('IT Equipment Orders', LookUp('IT Equipment Orders', ID=varRequest.ID), {Status: {Value: "Rejected By IT Manager"}}));
    Office365Outlook.SendEmailV2(
        varRequest.Employee.Email,
        "IT Equipment Request - Rejected",
        "Your I/T equipment was rejected for a "&varRequest.Equipment.Value&" by "&varRequest.Employee.DisplayName&".  <a href="""&varAppID&"?recordid="&varRequest.ID&""">Click here</a> to view the request."
    )
)

Tính năng gửi email đến đây đã hoàn thành. Sau cùng, bạn chỉ cần thêm đoạn mã như bên dưới để chỉ hiển thị các nút khi yêu cầu đang được người quản lý xem xét. Đặt mã này vào thuộc tính Visible của cả hai nút.

(varRequest.Status.Value="Submitted" And User().Email=varRequest.Manager.Email) Or (varRequest.Status.Value="Approved By Manager" And User().Email=varRequest.ITManager.Email)

Vậy là chúng ta đã hoàn tất xây dựng Ứng Dụng Yêu Cầu Thiết Bị. Sau cùng, bạn cần thử nghiệm ứng dụng để đảm bảo tính năng gửi email và phê duyệt/từ chối sẽ hoạt động khi ứng dụng vào thực tế. Chúc các bạn thành công!

Related Posts

Leave a Comment

Email của bạn sẽ không được hiển thị công khai.