关于我们

质量为本、客户为根、勇于拼搏、务实创新

< 返回新闻公共列表

abp(net core)+easyui+efcore实现仓储管理系统

发布时间:2020-03-31 00:00:00

   abp(net core)+easyui+efcore实现仓储管理系统目录

abp(net core)+easyui+efcore实现仓储管理系统——ABP总体介绍(一)
abp(net core)+easyui+efcore实现仓储管理系统——解决方案介绍(二)
abp(net core)+easyui+efcore实现仓储管理系统——领域层创建实体(三)
 abp(net core)+easyui+efcore实现仓储管理系统——定义仓储并实现 (四)
abp(net core)+easyui+efcore实现仓储管理系统——创建应用服务(五)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之控制器(六)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之列表视图(七)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之增删改视图(八)
abp(net core)+easyui+efcore实现仓储管理系统——展现层实现增删改查之菜单与测试(九)
abp(net core)+easyui+efcore实现仓储管理系统——使用 WEBAPI实现CURD (十一)
abp(net core)+easyui+efcore实现仓储管理系统——菜单-上 (十六)

abp(net core)+easyui+efcore实现仓储管理系统——EasyUI前端页面框架 (十八)

abp(net core)+easyui+efcore实现仓储管理系统——EasyUI之货物管理一 (十九)
abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之一(二十七)
abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之三(二十九)

abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之八(三十四)

abp(net core)+easyui+efcore实现仓储管理系统——ABP WebAPI与EasyUI结合增删改查之十(三十六)
abp(net core)+easyui+efcore实现仓储管理系统——入库管理之一(三十七)
abp(net core)+easyui+efcore实现仓储管理系统——入库管理之二(三十八)
abp(net core)+easyui+efcore实现仓储管理系统——入库管理之三存储过程(三十九)
abp(net core)+easyui+efcore实现仓储管理系统——入库管理之四(四十)
abp(net core)+easyui+efcore实现仓储管理系统——入库管理之五(四十一)
 
 

    在上一篇abp(net core)+easyui+efcore实现仓储管理系统——入库管理之五(四十一) 文章中实现了入库管理的列表页面,并实现了控制器的代码。在今天我们学习如何在前端实现新增入库单信息界面。

入库单新增功能

1. 在Visual Studio 2017的“解决方案资源管理器”中,左键单击在展现层的“ABP.TPLMS.Web.MVC”项目中的Views目录。找到InStock\Index.cshmtl文件。在此文件中添加视图代码。代码如下。

 

 <div id="divImportCargo" class="easyui-dialog" closed="true" style="top:10px;"
data-options="buttons: '#dlg-buttons-cgo'">   <div data-options="region:'center',split:false" style="height:460px;"><table id="dgCargo">table>div> div><div id="dlg-buttons-cgo"><input type="submit" id="btnImportCargo" value="导入" class="btn btn-primary" />        <input type="submit" id="btnCancleCargo" value="取消" class="btn btn-info" />div><div id="divAddUpdINO" class="easyui-dialog" closed="true" style="top:10px;"
data-options
="buttons: '#dlg-buttons'"><div id="box"><div title="入库单"><table><tr><td><input type="hidden" name="ID" id="IDUpdate" />td>tr><tr><td>入库单号:td><td><input type="text" id="UpdNO" name="UNO" class="form-control input-sm" />td><td>预计送货日期:td><td><input type="text" id="PreDeliveryTimeUpdate" name="UPreDeliveryTime"
class
="form-control input-sm" />td><td> 状态:td><td><input type="text" id="StatusUpdate" name="UStatus"
class
="form-control input-sm" value="0" />td>tr><tr><td> 发货人:td><td><input type="text" id="OwnerCodeUpdate" name="UOwnerCode"
class
="form-control input-sm" />td><td colspan="2"><input type="text" id="OwnerNameUpdate" name="UOwnerName"
class
="form-control input-sm" />td><td>社会信用代码:td><td><input type="text" id="ConsignerSccdUpdate" name="UConsignerSccd"
class
="form-control input-sm" />td>tr><tr><td> 收货人:td><td><input type="text" id="CustomerCodeUpdate" name="UCustomerCode"
class
="form-control input-sm" />td><td colspan="2"><input type="text" id="CustomerNameUpdate" name="UCustomerName"
class
="form-control input-sm" />td><td>社会信用代码:td><td><input type="text" id="ConsigneeSccdUpdate" name="UConsigneeSccd"
class
="form-control input-sm" />td>tr><tr><td> 经营企业:td><td><input type="text" id="BizpoEtpsNoUpdate" name="UBizpoEtpsNo"
class
="form-control input-sm" />td><td colspan="2"><input type="text" id="BizpoEtpsNameUpdate" name="UBizpoEtpsName"
class
="form-control input-sm" />td><td>社会信用代码:td><td><input type="text" id="BizpoEtpsSccdUpdate" name="UBizpoEtpsSccd"
class
="form-control input-sm" />td>tr><tr><td>理货员:td><td> <input type="text" id="ReceiverUpdate" name="UReceiver"
class
="form-control input-sm" />td><td>收货开始时间:td><td><input type="text" id="ReceiveTimeUpdate" name="UReceiveTime"
class
="form-control input-sm" />td><td>收货结束时间:td><td><input type="text" id="ERcvTimeUpdate" name="UERcvTime"
class
="form-control input-sm" />td>tr><tr><td>净重:td><td> <input type="text" id="NwtUpdate" name="UNwt" class="form-control input-sm"
value
="0" />td><td>毛重:td><td><input type="text" id="GwtUpdate" name="UGwt" class="form-control input-sm"
value
="0" />td> <td>件数:td><td><input type="text" id="PackageQtyUpdate" name="UPackageQty"
class
="form-control input-sm" value="0" />td>                      tr><tr><td>仓库号:td><td><input type="text" id="WarehouseNoUpdate" name="UWarehouseNo"
class="form-control input-sm" />td> <td>仓库类型:td><td><input type="text" id="WarehouseTypeUpdate" name="UWarehouseType"
class
="form-control input-sm" />td><td>核查时间:td><td><input type="text" id="CheckTimeUpdate" name="UCheckTime"
class
="form-control input-sm" />td>tr><tr><td> 核查员:td><td><input type="text" id="CheckerUpdate" name="UChecker"
class="form-control input-sm" />td><td>操作员:td><td>

                           <input type="text" id="OperUpdate" name="UOper" class="form-control input-sm" />td><td>创建时间:td><td><input type="text" id="CreationTimeUpdate" name="UCreationTime"
class="form-control input-sm" />td>tr><tr><td> 备注:td><td colspan="5"><input type="text" id="RemarkUpdate" name="URemark"
class
="form-control input-sm" />td>tr>table>div><div title="入库单明细"><div data-options="region:'center',split:false" style="height:400px;"><table id="dgINOD">table>div>div>        div>div><div id="dlg-buttons"><input type="submit" id="btnSave" value="保存" class="btn btn-primary" /><input type="submit" id="btnSubmit" value="提交" class="btn btn-primary" /><input type="submit" id="btnCancle" value="取消" class="btn btn-info" />div>

 

 

    2. 在Visual Studio 2017的“解决方案资源管理器”中,找到表示“ABP.TPLMS.Web.Mvc”项目中的wwwroot\view-resources\InStock目录。

    3. 在InStock目录中找到Index.js文件。添加新增入库单的代码。代码如下。

//--------------系统管理-->入库单管理-------------------------////显示货物信息数据function ShowCargo() {
    abp.log.warn('货物信息列表日志...');
    $("#dgCargo").datagrid({
        url: "/Cargo/List",
        title: "货物管理管理",
        pagination: true,
        pageSize: 10,
        pageList: [10, 20, 30],
        fit: true,
        fitColumns: false,
        loadMsg: "正在加载货物信息...",
        nowarp: false,
        border: false,
        idField: "Id",
        sortName: "Id",
        sortOrder: "asc",
        frozenColumns: [[//冻结列{ field: "ck", checkbox: true, align: "left", width: 50 }

        ]],
        columns: [[
        { title: "编号", field: "Id", width: 50, sortable: true },
        { title: "供应商", field: "SupplierId", width: 80, sortable: true },
        { title: "HSCode", field: "HSCode", width: 100, sortable: true },
       { title: "货物代码", field: "CargoCode", width: 100, sortable: true },
       { title: "货物名称", field: "CargoName", width: 80, sortable: false },
       { title: "规格型号", field: "Spcf", width: 100, sortable: false },
      { title: "产销国", field: "Country", width: 80, sortable: false },
       { title: "计量单位", field: "Unit", width: 100, sortable: false },
       { title: "包装", field: "Package", width: 100, sortable: false },
       { title: "单价", field: "Price", width: 100, sortable: false },
      { title: "币制", field: "Curr", width: 80, sortable: false },
       { title: "长宽高", field: "Length", width: 100, sortable: false, formatter: function (value, row, index) {      return row.Length + '*' + row.Width + '*' + row.Height;
                }
            },
            { title: "体积", field: "Vol", width: 80, sortable: false },
        { title: "备注", field: "Remark", width: 80, sortable: false },
            { title: '创建时间', field: 'CreationTime', width: 100, align: 'center' }
        ]]       
    });
    abp.log.warn('3货物信息列表日志...');
}function ShowCargoInfo() {  
    $("#divImportCargo").dialog({
            closed: false,
            title: "选择货物信息",
            modal: true,
            width: 820,
            height: 550,
            collapsible: true,
            minimizable: true,
            maximizable: true,
            resizable: true});

       ShowCargo();
       $("#dgCargo").datagrid("clearChecked");
       $("#dgCargo").datagrid("clearSelections");
}function reloaded() {   //reload$("#reload").click(function () {
            $('#dgINSO').datagrid('reload');
    });}//清空文本框function clearAll() {
    $("#divAddUpdINO input").each(function () {
            $(this).val("");
        });//默认值$("#PreDeliveryTimeUpdate").val(getNowFormatDate());    
    $("#StatusUpdate").val("0");
    $("#NwtUpdate").val("0");
    $("#GwtUpdate").val("0");
    $("#PackageQtyUpdate").val("0");    

}function GetNo() {
      $.get(abp.appPath + "api/services/app/InStockOrder/GetNo", function (data) {//     alert(data);  //  var obj = JSON.parse(data);$("#UpdNO").val(data);//$("#IDUpdate").val(obj.Id);    });

}//获取当前时间,格式YYYY-MM-DDfunction getNowFormatDate() {var date = new Date();var seperator1 = "-";var year = date.getFullYear();var month = date.getMonth() + 1;var strDate = date.getDate();if (month >= 1 && month <= 9) {
        month = "0" + month;
    }if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
    }var currentdate = year + seperator1 + month + seperator1 + strDate;return currentdate;
}//将表单数据转为jsonfunction form2Json(id) {var arr = $("#" + id).serializeArray()var jsonStr = ""; 

    jsonStr += '{';for (var i = 0; i < arr.length; i++) {
        jsonStr += '"' + arr[i].name + '":"' + arr[i].value + '",'}

    jsonStr = jsonStr.substring(0, (jsonStr.length - 1));
    jsonStr += '}'var json = JSON.parse(jsonStr)return json
} 
function defaultTab() {//默认显示第一个tab$('#box').tabs('select', "入库单");  
}//弹出 导入送货单的的对话框function showInSODialog() {
    $("#add").click(function () {      

            $.messager.confirm('编辑', '您想要创建入库单吗?', function (r) {if (r) {//打开对话框编辑$("#divAddUpdINO").dialog({
                        closed: false,
                        title: "新增入库单",
                        modal: true,
                        width: 820,
                        height: 550,
                        collapsible: true,
                        minimizable: true,
                        maximizable: true,
                        resizable: true,
                    });                   

                }
                defaultTab();
                GetNo();
                clearAll();
                ShowDetail("");
            });      

    });

    $("#btnSave").click(function () {       //保存var id = $("#IDUpdate").val();if (id == "" || id == undefined) {//验证$.messager.confirm('确认', '您确认要保存吗?', function (r) {if (r) {var postData = GetINO();               if (postData.No == "" || postData.CustomerCode == "" || postData.CustomerName=="" || postData.OwnerName=="") {
                        $.messager.alert('提示', ' 请填写相关必填项!', 'warning');return;
                    } 
                    $.post("/InStock/Add", postData, function (data) {if (data == "OK") {
                            $.messager.alert("提示", "保存成功!");
                            initable();
                        }else if (data == "NO") {
                            $.messager.alert("提示", "保存失败!");return;
                        }
                    });
                }
            })
        }else {
            saveDetail();
        }
});
}//显示明细function ShowDetail(no) {var lastIndex;
    $("#dgINOD").datagrid({
        url: "/InStock/GetDetail?no=" + no,
        title: "入库单明细",
        pagination: false,      
        fit: true,
        fitColumns: false,
        loadMsg: "正在加载入库单明细信息...",
        toolbar: "#dg-detail-button",
        nowarp: false,
        border: false,
        idField: "Id",
        sortName: "Id",
        sortOrder: "asc",
        singleSelect: true,
        iconCls: 'icon-edit',      
        columns: [[
            { title: "编号", field: "SeqNo", width: 50, sortable: true },
            { title: "入库单号", field: "InStockNo", width: 100, sortable: true },
            { title: "HSCode", field: "HSCode", width: 80, sortable: false },
            { title: "货物代码", field: "CargoCode", width: 100, sortable: true },
            { title: "货物名称", field: "CargoName", width: 160, sortable: false },
            { title: "规格型号", field: "Spcf", width: 80, sortable: false },
            { title: "数量", field: "Qty", width: 100, align: 'center', editor: {
                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 4}
                }
            },
            { title: "长", field: "Length", width: 70, align: 'center', editor: {
                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 2}
                }
            },
            {title: "宽", field: "Width", width: 70, align: 'center', editor: {
                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 2}
                }
            },
            {  title: "高", field: "Height", width: 70, align: 'center', editor: {
                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 2}
                }
            },
            { title: "产销国", field: "Country", width: 70, align: 'center' },
            {title: "单价", field: "Price", width: 100, align: 'center', editor: {
                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 2}
                }
            },        
            {  title: "总价", field: "TotalAmt", width: 100, align: 'center', editor: {

                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 2}
                }
            },

            { title: "包装", field: "Package", width: 70, align: 'center' },
            { title: "计量单位", field: "Unit", width: 70, align: 'center' },
            { title: "总体积", field: "Vol", width: 70, align: 'center', editor: {
                    type: 'numberbox', options: {
                        required: true, min: 0, precision: 4}
                }
            },
            { title: "品牌", field: "Brand", width: 70, align: 'center' }
        ]],
        onClickRow: function (index, rowData) {if (lastIndex != index) {
                $('#dgINOD').datagrid('endEdit', lastIndex);               
                editrow(index);  
            }
            lastIndex = index;   
        },    
        onBeginEdit: function (rowIndex, rowData) {
              setEditing(rowIndex);
        }
    });
}//计算报价小计function setEditing(rowIndex) {var editors = $('#dgINOD').datagrid('getEditors', rowIndex);var priceEditor = editors[4];var qtyEditor = editors[0];var lengthEditor = editors[1];var widthEditor = editors[2];var heightEditor = editors[3];var totalVolEditor = editors[6];var totalAmtEditor = editors[5];
    priceEditor.target.numberbox({
        onChange: function () { calculate();}
    });

    qtyEditor.target.numberbox({
        onChange: function () {
            calculate();
            calculateVol();
        }
    });

    lengthEditor.target.numberbox({
        onChange: function () { calculateVol(); }
    });

    widthEditor.target.numberbox({
        onChange: function () { calculateVol(); }
    });

    heightEditor.target.numberbox({
        onChange: function () { calculateVol(); }
    });function calculate() {var cost = (priceEditor.target.val()) * (qtyEditor.target.val());
        console.log(cost);
        totalAmtEditor.target.numberbox("setValue", cost);
    }function calculateVol() {var vol = (lengthEditor.target.val() / 100.0) * (widthEditor.target.val() / 100.0) * (heightEditor.target.val() / 100.0)*
(qtyEditor.target.val());        console.log(vol);        totalVolEditor.target.numberbox("setValue", vol);    } }function editrow(index) {    $('#dgINOD').datagrid('selectRow', index)        .datagrid('beginEdit', index); }function endEdit() {var rows = $('#dgINOD').datagrid('getRows');if (rows==undefined) {return;    }for (var i = 0; i < rows.length; i++) {        $('#dgINOD').datagrid('endEdit', i);    } }function saveDetail() {   endEdit();    $.messager.confirm('确认', '您确认要修改吗?', function (r) {var effectRow = new Object();var postData = GetINO();if (postData.Id) {            effectRow["postdata"] = JSON.stringify(postData);        }if ($('#dgINOD').datagrid('getChanges').length) {       var inserted = $('#dgINOD').datagrid('getChanges', "inserted");var deleted = $('#dgINOD').datagrid('getChanges', "deleted");       var updated = $('#dgINOD').datagrid('getChanges', "updated");     if (inserted.length) {                effectRow["inserted"] = JSON.stringify(inserted);            }if (deleted.length) {                effectRow["deleted"] = JSON.stringify(deleted);            }if (updated.length) {                effectRow["updated"] = JSON.stringify(updated);            }          }        $.post("/InStock/Update", effectRow, function (data) {           //  alert(data);if (data.success) {                $.messager.alert("提示", data.result);                $('#dgINOD').datagrid('acceptChanges');              }else {                $.messager.alert("提示", data.result);return;            }        }, "JSON")            ;              })     }function init() {    $("#PreDeliveryTimeUpdate").val(getNowFormatDate());    $("#btnCancle").click(function () {              $("#divAddUpdINO").dialog("close");          $('#dgINSO').datagrid('reload');    });    $("#btnCancleCargo").click(function () {        $("#divImportCargo").dialog("close");        $('#dgINSO').datagrid('reload');    });    $("#btnImportCargo").click(function () {//保存var rows = $('#dgCargo').datagrid('getSelections');if (rows.length > 0) {//验证$.messager.confirm('确认', '您确认要保存所选择的货物信息吗?', function (r) {if (r) {var obj_No = $("#UpdNO").val();var ids = [];//重要不是{}for (var i = 0; i < rows.length; i++) {                        ids.push(rows[i].Id);                    }var postData = {"Ids": ids.join(','),"No": obj_No                    };                    $.post("/InStock/ImportCargo", postData, function (data) {if (data == "OK") {                      $.messager.alert("提示", "保存货物信息成功!");                            ShowDetail(obj_No);                        }else if (data == "NO") {                      $.messager.alert("提示", "保存货物信息失败!");return;                        }                    });                }            })        }    }); }function GetINO() {var postData = {"No": $("#UpdNO").val(),"DeliveryNo": "","PreDeliveryTime": $("#PreDeliveryTimeUpdate").val(),"CustomerCode": $("#CustomerCodeUpdate").val(),"OwnerName": $("#OwnerNameUpdate").val(),"OwnerCode": $("#OwnerCodeUpdate").val(),"CustomerName": $("#CustomerNameUpdate").val(),"CheckTime": $("#CheckTimeUpdate").val(),"WarehouseType": $("#WarehouseTypeUpdate").val(),"WarehouseNo": $("#WarehouseNoUpdate").val(),"Oper": $("#OperUpdate").val(),"Receiver": $("#ReceiverUpdate").val(),"Nwt": $("#NwtUpdate").val(),"Remark": $("#RemarkUpdate").val(),"ReceiveTime": $("#ReceiveTimeUpdate").val(),     "Status": $("#StatusUpdate").val(),"Gwt": $("#GwtUpdate").val(),"Checker": $("#CheckerUpdate").val(),"PackageQty": $("PackageQtyUpdate").val(),"LastUpdateTime": "","LastOper":""};var id = $("#IDUpdate").val();if (!(id=="" || id==undefined)) {        postData.Id = id;    }return postData; } function showINO(row) {        $("#IDUpdate").val(row.Id);    $("#UpdNO").val(row.No);    $("#PreDeliveryTimeUpdate").val(row.PreDeliveryTime);    $("#CustomerCodeUpdate").val(row.CustomerCode);        $("#CustomerNameUpdate").val(row.CustomerName);    $("#OwnerCodeUpdate").val(row.OwnerCode);    $("#OwnerNameUpdate").val(row.OwnerName);    $("#CheckTimeUpdate").val(row.CheckTime);    $("#WarehouseTypeUpdate").val(row.WarehouseType);    $("#WarehouseNoUpdate").val(row.WarehouseNo);    $("#OperUpdate").val(row.Oper);    $("#ReceiverUpdate").val(row.Receiver);    $("#NwtUpdate").val(row.Nwt);     $("#RemarkUpdate").val(row.Remark);    $("#ReceiveTimeUpdate").val(row.ReceiveTime);    $("#StatusUpdate").val(row.Status);      $("#GwtUpdate").val(row.Gwt);    $("#CheckerUpdate").val(row.Checker);   }//------------系统管理-->入库单管理结束---------------//

 


/template/Home/Zkeys/PC/Static