abp(net core)+easyui+efcore實現倉儲管理系統——組織管理升級之下(六十二)

在前一篇文章(abp(net core)+easyui+efcore實現倉儲管理系統——組織管理升級之上(六十一))我們對組織管理模組進行了部分升級，今天我們繼續對組織管理這個模組進行升級。

13. 在“組織管理”列表頁面中使用滑鼠勾選想要進行修改的組織資訊，然後點選“修改”按鈕。如下圖。

14.此時會彈出“修改組織資訊”介面，但介面上沒有顯示我們勾選的那一條組織資訊的任何資料。如下圖。

15.由於我們的功能主要都在javascript中寫的，所以要呼叫javascript，這個可以使用瀏覽器的“開發者工具”這個功能。透過檢查程式碼，在showOrg這個函式中設定斷點，觀察到row這個物件的屬性是小寫字母打頭，跟我們原來程式碼中的屬性名稱不一致。如下圖。

16.在Visual Studio 2022中的解決方案資源管理器中，找到“ABP.TPLMS.Web.Mvc”這個專案，找到”wwwroot\view-resources\views\orgs\index.js”檔案，使用滑鼠左鍵，雙擊，在文字編輯器開啟，找到showOrg函式。程式碼修改如下：

function showOrg(row) {
   
    $("#IDUpdate").val(row.id);
    $("#NameUpdate").val(row.name);

    $("#UpdBizCode").val(row.bizCode);
    $("#UpdType").val(row.Type);

    $("#UpdCustomCode").val(row.customCode);
    $("#UpdIsAutoExpand").val(row.isAutoExpand);

    $("#UpdIsLeaf").val(row.isLeaf);
    $("#UpdStatus").val(row.status);

    $("#UpdHotKey").val(row.hotKey);
    $("#UpdIconName").val(row.iconName);

    $("#RemarkUpdate").val(row.remark);
    $("#AddTree").combotree('setValue', row.parentId);

    $("#AddTree").combotree('setText', row.parentName);
    $('#UpdParentName').val(row.parentName);  
}

17. 在瀏覽器中按F5，重新整理頁面，然後重複第13，14步操作。在“組織管理”列表頁面中使用滑鼠勾選想要進行修改的組織資訊，然後點選“修改”按鈕。此時會彈出“修改組織資訊”介面，介面會顯示我們勾選的那一條組織資訊的資料。如下圖。

18.將型別修改為2，然後點選“儲存”按鈕。2這個資料就儲存到資料庫中。如下圖。

19.使用新增功能，新增一條“北京天壇店”的記錄資訊，然後選中這一條記錄，點選“刪除”按鈕。如下圖。

20.在彈出的提示“資訊”中我們點選“確定”按鈕，程式執行了刪除操作，提示資訊也提示了“刪除成功！”。如下圖。

21.實際上資料並沒有從資料庫中刪除，“北京天壇店”的這條資料，還在資料庫中。如下圖。

22.在Visual Studio 2022中的解決方案資源管理器中，找到“ABP.TPLMS.Web.Mvc”這個專案，找到”wwwroot\view-resources\views\orgs\index.js”檔案，使用滑鼠左鍵，雙擊，在文字編輯器開啟，找到deleteOrg函式。如下圖中的紅框處。

23.發現刪除操作中最後要的傳遞Id的程式碼中row.Id，Id的首字母是大寫。從之前對於修改操作除錯時，發現row的屬性的首字母，應該是小寫。所以這裡Id應改為id。具體程式碼如下：

//刪除
function deleteOrg() {
    $("#del").click(function () {
        var rows = $("#dgOrg").datagrid("getSelections");
        if (rows.length > 0) {
            $.messager.confirm("提示", "確定要刪除嗎?", function (res) {
                if (res) {
                    var codes = []; //重要不是{}
                    for (var i = 0; i < rows.length; i++) {

                        codes.push(rows[i].id);
                        _orgService.delete({
                            id: rows[i].id
                        }).done(function () {
                            $.messager.alert("提示", "刪除成功！");
                            $("#dgOrg").datagrid("clearChecked");
                            $("#dgOrg").datagrid("clearSelections");
                            $('#dgOrg').treegrid('reload');
                        });
                    }                   
               }
            });
        }

    })
}

24.在瀏覽器中重新整理頁面，讓我們修改的js程式碼，從新下載到了本地，然後選中“北京天壇店”這一條記錄，點選“刪除”按鈕，在彈出的提示“資訊”中我們點選“確定”按鈕，程式執行了刪除操作，提示資訊也提示了“刪除成功！”，這一條資料從資料庫中刪除了，頁面中也沒有了這一條記錄。如下圖。

abp(net core)+easyui+efcore實現倉儲管理系統——組織管理升級之下(六十二)

相關文章