salesforce Lightning - Lightning Demo实例

标签: salesforce  salesforce lightning  lightning

salesforce Lightning 批量操作,及分页
前段时间简单整理了一下,使用lightning的开发方式做一个批量添加产品的功能。近期我又去对这个功能点增加了一些逻辑,比如分页,批量操作等。
总体来说还是一个批量添加产品的功能吧。

Tips:

  1. 使用按钮弹出的页面,是不能使用标准的那种提示的,这是一个saleforce 团队的 一个已知bug
  2. 使用css样式调节弹出页面的宽度,是不能够放到css中写的,这个目前不知道什么原因导致的,只能放到comment中写样式。
  3. 如果将样式写在comment中,那么对于comment的版本是有要求的,目前我使用的是41.0版本的。

这此首先做一个Demo的展示效果给大家:
Demo效果

这次我们换了两个对象去使用,一个是使用的Contract,另外一个使用的是自定义的Product。 因为项目搭建Demo的时候突然变了。。。。所以可能代码中有些变量的命名还是没换过来,不过应该不影响阅读。

先贴代码如下:
comment:

<aura:component implements="flexipage:availableForAllPageTypes,force:appHostable,flexipage:availableForRecordHome,force:lightningQuickActionWithoutHeader,force:hasSObjectName,force:hasRecordId" controller="AP_ContractItems">
    <style>
        .slds-modal__container {
             max-width: 80rem !important;
             width:80% !important;
        }
    </style>
    <!--初始化方法-->
    <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
    <aura:attribute name="IsRefresh" type="Boolean" default="false"/> 
    <aura:attribute name="IsSpinner" type="Boolean" default="false"/>
    <aura:attribute name="recordId" type="String" description="获取当前记录id"/>
    <!-- 选中的添加产品的数量 -->
    <aura:attribute name="orderProductList" type="List" description="合同产品List"/>
    <aura:attribute name="ProductList" type="List" description="产品list"/>
    <aura:attribute name="SearchKeyWord" type="string" description="搜索关键字参数"/>
    <aura:attribute name="Total_Amount" type="Double" description="选中产品的总价格"/>


     <!-- 分页参数 -->
    <aura:attribute name="page" type="integer" description="当前页码"/>
    <aura:attribute name="pages" type="integer" description="页码总数"/>
    <aura:attribute name="total" type="integer" description="分页记录总数"/>
    <aura:attribute name="pagesize" type="integer" description="每页记录数"/>
    <!-- 排序参数 -->
    <aura:attribute name="arrowDirection" type="string" default="arrowup" description="标题上的箭头符号方向"/>
    <aura:attribute name="isAsc" type="boolean" default="true" description="用于排序条件传递到Apex类的布尔标志"/> 
    <aura:attribute name="selectedTabsoft" type="string" default="Core__c" description="在哪个字段的标题上显示/隐藏箭头标志"/>
    <!--页面加载动画Loading 覆盖全屏 class="slds-spinner_container"-->
    <aura:if isTrue="{!v.IsSpinner}">
       <lightning:spinner variant="brand"  size="large" />
    </aura:if>

    <!-- 卡片 title卡片头部显示信息  iconName显示图标  footer 卡片底部显示信息-->
    <lightning:card title="批量添加合同产品" iconName="standard:work_order" >
        <aura:set attribute="actions">
            <lightning:button variant="brand" label="添加" iconName="action:new" iconPosition="left" onclick="{!c.doSave}" />
            <lightning:button variant="brand" label="删除" iconName="action:reject" iconPosition="left" onclick="{!c.doDel}" />
            <lightning:button variant="brand" label="保存" iconName="action:approval" iconPosition="left" onclick="{!c.dosaveAll}" />
        </aura:set>
      <!--   <p class="slds-p-horizontal_small">
            <lightning:badge label="产品检索" />
        </p> -->
        <p class="slds-p-horizontal_small">
            <!-- 将查询图标放到输入框里 使用下面这两个样式-->
            <div class="slds-input-has-icon slds-input-has-icon--right" style="width: 300px;">
                <div class="slds-show">
                    <ui:inputText blur="{!c.SearchProduct}" class="slds-lookup__search-input slds-input leftPaddingClass" value="{!v.SearchKeyWord}" placeholder="Search Products"/>
                </div>
                <a href="javascript:void(0);" onclick="{!c.SearchProduct}">
                    <lightning:icon class="slds-input__icon slds-show" iconName="utility:search" size="x-small" alternativeText="search"/> 
                </a>
            </div>
        </p><br/>

        <p class="slds-p-horizontal_small">
            <!-- 创建table的tr -->
            <div class="slds-table_edit_container slds-is-relative">
                <table class="slds-table slds-table_bordered slds-table_resizable-cols slds-table_fixed-layout slds-no-cell-focus slds-table_edit" role="grid">
                    <thead>
                        <tr class="slds-line-height_reset">
                            <th scope="col" style="width: 5%;">
                                <div class="slds-th__action slds-th__action_form">
                                    <ui:inputCheckbox aura:id="pro"  change="{!c.selectAll}" class="pro"/>
                                </div>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Account Name" scope="col" style="width: 10%;">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">序号</span>
                                </a>
                            </th> 
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Account Name" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品名称</span>
                                </a>
                            </th>                                                 
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Stage" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品系列</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Stage" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品型号</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Confidence" scope="col" onclick="{!c.sortProduct}">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">内核</span>
                                    <!-- &#9660 是网页特殊符号  向下箭头 -->
                                    <aura:if isTrue="{! and(v.arrowDirection == 'arrowdown', v.selectedTabsoft == 'Core__c') }">&nbsp; &#9660;</aura:if>  
                                    <aura:if isTrue="{! and(v.arrowDirection != 'arrowdown', v.selectedTabsoft == 'Core__c') }"> &nbsp; &#9650;</aura:if>
                                </a>
                            </th>
                        </tr>
                    </thead>
                     <!-- 循环table的td -->
                    <tbody>
                        <!-- aura:iteration 页面循环 -->
                        <aura:iteration items="{!v.ProductList}" var="obj" indexVar="sNo">
                            <tr class="slds-hint-parent">
                                <td class="slds-cell-edit" role="gridcell">
                                    <!-- 这里注意当前版本 lightning标准的复选框 后台拿不到值 -->
                                    <ui:inputCheckbox aura:id="productbox" value="{!obj.flag}" change="{!c.checkboxSelect}"/>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">  
                                        <span class="slds-truncate">{!sNo + 1}</span>
                                    </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate" title="{!obj.product.Name}">{!obj.product.Name}</span>
                                    </span>
                                </td>
                                 <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">{!obj.product.Product_Series__c}</span>
                                     </span>
                                </td>

                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">{!obj.product.Product_Model__c}</span>
                                     </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">{!obj.product.Core__c}</span>
                                     </span>
                                </td>
                            </tr>
                        </aura:iteration>
                    </tbody>
                    <tfoot class="slds-card__footer">
                        <tr>
                            <td colspan="6">
                                <div class="slds-truncate" style="text-align: center;">
                                    记录总数:{!v.total}&nbsp;&nbsp;&nbsp;&nbsp;
                                    <button disabled="{!v.page == 1}"  text="首页" onclick="{!c.HomeLastNavigate}" class="slds-button">首页</button>
                                    <button disabled="{!v.page == 1}"  text="上一页" onclick="{!c.navigate}" class="slds-button">上一页</button>
                                    <button aura:id="previousPage" disabled="{!v.page == v.pages}"  text="下一页" onclick="{!c.navigate}" class="slds-button">下一页</button>
                                    <button disabled="{!v.page == v.pages}"  text="尾页" onclick="{!c.HomeLastNavigate}" class="slds-button">尾页</button>
                                    &nbsp;&nbsp;&nbsp;&nbsp; 第{!v.page} / {!v.pages}页
                                </div>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </p>
        </lightning:card>
        <lightning:card title="已选合同产品" footer="{!'总金额:' + v.Total_Amount}">
        <p class="slds-p-horizontal_small">
            <!-- 创建table的tr -->
            <div class="slds-table_edit_container slds-is-relative">
                <table class="slds-table slds-table_bordered slds-table_resizable-cols slds-table_fixed-layout slds-no-cell-focus slds-table_edit" role="grid">
                    <thead>
                        <tr class="slds-line-height_reset">
                            <th scope="col" style="width: 5%;">
                                <div class="slds-th__action slds-th__action_form">
                                    <ui:inputCheckbox aura:id="proSelect"  change="{!c.selectAll}" class="proSelect"/>
                                </div>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Account Name" scope="col" style="width: 10%;">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">序号</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Account Name" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品名称</span>
                                </a>
                            </th>                                                 
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Stage" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品系列</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Stage" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品型号</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Contact" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">总价</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Confidence" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">产品单价</span>
                                </a>
                            </th>
                            <th aria-sort="none" class="slds-is-sortable slds-is-resizable slds-text-title_caps" aria-label="Contact" scope="col">
                                <a class="slds-th__action slds-text-link_reset" href="javascript:void(0);" role="button" tabindex="-1">
                                    <span class="slds-truncate">数量</span>
                                </a>
                            </th>
                        </tr>
                    </thead>
                    <!-- 循环table的td -->
                    <tbody>
                        <!-- aura:iteration 页面循环  indexVar属性为自动编号-->
                        <aura:iteration items="{!v.orderProductList}" var="obj" indexVar="sNo">
                            <tr class="slds-hint-parent">
                                <td class="slds-cell-edit" role="gridcell">
                                    <!-- 这里注意当前版本 lightning标准的复选框 后台拿不到值 -->
                                    <ui:inputCheckbox aura:id="proSelectBox" value="{!obj.flag}"  change="{!c.summary}"/>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">{!sNo + 1}</span>
                                    </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate" title="{!obj.pro.Name}">{!obj.pro.Name}</span>
                                    </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">{!obj.pro.Product_Series__c}</span>
                                    </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">{!obj.pro.Product_Model__c}</span>
                                     </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">
                                            <ui:outputNumber value="{!obj.total}"/>
                                        </span>
                                     </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">
                                            <ui:inputNumber updateOn="{!obj.pro.Id+'_Price'}" value="{!obj.price}" change="{!c.calculate}"/>
                                        </span>
                                     </span>
                                </td>
                                <td class="slds-cell-edit" role="gridcell">
                                    <span class="slds-grid slds-grid_align-spread">
                                        <span class="slds-truncate">
                                            <ui:inputNumber updateOn="{!obj.pro.Id+'_Num'}"  value="{!obj.num}" change="{!c.calculate}"/>
                                        </span>
                                     </span>
                                </td>
                            </tr>
                        </aura:iteration>
                    </tbody>
                </table>
            </div>
        </p>
    </lightning:card>
</aura:component>

controler.js 代码如下:

({
     doInit : function(component, event, helper) {
        component.set("v.IsSpinner",true);
        helper.init(component);
    },
     //上一页下一页
    navigate: function(component, event, helper)
    {
        component.set("v.IsSpinner",true);
        var page = component.get("v.page") || 1;
        var fieldName = component.get("v.selectedTabsoft");
        var direction = event.target.innerText;
        page = direction === "上一页" ? (page - 1) : (page + 1);
        helper.LoadingProduct(component, page, fieldName);
    },

    //首页尾页
    HomeLastNavigate: function(component, event, helper)
    {   
        component.set("v.IsSpinner",true);     
        var direction = event.target.innerText;
        var page = direction === "首页" ? 1 : component.get("v.pages");
        var fieldName = component.get("v.selectedTabsoft");
        helper.LoadingProduct(component, page ,fieldName);
    },

    //搜索产品
    SearchProduct: function(component, event, helper)
    {
        var page = component.get("v.page");
        var fieldName = component.get("v.selectedTabsoft");
        component.set("v.IsSpinner",true);
        helper.LoadingProduct(component,page,fieldName);
    },
    //排序
    sortProduct: function(component, event, helper) 
    {
       component.set("v.IsSpinner",true);
       //给前台哪个字段排序参数赋值   
       component.set("v.selectedTabsoft",'Core__c');
       //将要给哪个字段排序 传给helper中
       helper.sort(component,event,'Core__c');
    },
     //全选方法
    selectAll : function(component, event, helper)
    {
        var flag = event.getSource().get('v.class');
        var info;
        var Templist;
        if(flag == "pro"){
            info = "productbox";
            Templist = component.get("v.ProductList");
        }else{
            info = "proSelectBox";
            Templist = component.get("v.orderProductList");
        }
        if(Templist.length > 0)
        {
            //获取标题复选框的值
            var selectedHeaderCheck = event.getSource().get("v.value");
            //使用“box ”aura id获取表格上的所有复选框(所有迭代值都具有相同的ID)
            //返回所有复选框元素的列表
            var getAllId = component.find(info);
            //alert(getAllId);
            //如果本地ID是唯一的(在单个记录的情况下),find()返回组件,不是数组
            if(!Array.isArray(getAllId)){
                if(selectedHeaderCheck == true)
                {
                    component.find(info).set("v.value", true);
                    //component.set("v.selectedCount", 1);
                }
                else
                {
                    component.find(info).set("v.value", false);
                    //component.set("v.selectedCount", 0);
                }
            }
            else
            {
                //检查是否选择全部(标题复选框)为真,然后是for循环中的所有表格上的复选框
                //并在selectedCount属性中设置所有选中的复选框长度。
                //如果值为false,则在其他部分中将所有复选框设为false,以便循环播放
                //并选择计数为0
                if(selectedHeaderCheck == true)
                {
                    for(var i = 0; i < getAllId.length; i++)
                    {
                        component.find(info)[i].set("v.value", true);
                        //component.set("v.selectedCount", getAllId.length);
                    }
                }
                else
                {
                    for (var i = 0; i < getAllId.length; i++)
                    {
                        component.find(info)[i].set("v.value", false);
                        //component.set("v.selectedCount", 0);
                    }
                }
            }
        }
    },
    doSave : function(component, event, helper){
        component.set("v.IsSpinner",true);
        var prolist = component.get("v.ProductList");
        var productsAdd = component.get("v.orderProductList");
        //打勾的list
        for(var i = 0 ; i < prolist.length ; i ++ )
        {
            if(prolist[i].flag)
            {
                // 判断重复
                for(var j = 0 ; j < productsAdd.length ; j ++ )
                {

                    if( prolist[i].product.Id == productsAdd[j].pro.Id){
                        alert( prolist[i].product.Name+" 已经存在,请勿重复添加。");
                        component.set("v.IsSpinner",false);
                        return;
                    }
                }
            }
            if(prolist[i].flag)
            {   
                prolist[i].flag = false;
                 var newProduct = new Object();
                 newProduct.num = 0;
                 newProduct.flag = false;
                 newProduct.price = 0;
                 newProduct.total = 0;
                 newProduct.pro = prolist[i].product;
                productsAdd.unshift(newProduct);
            }
        }
        component.set("v.orderProductList", productsAdd);
        component.set("v.IsSpinner",false);
    },
    doDel : function(component, event, helper){
        component.set("v.IsSpinner",true);
        helper.delete(component);
    },
    dosaveAll : function(component, event, helper){
        component.set("v.IsSpinner",true);
        component.set("v.IsRefresh",false);
        helper.saveAll(component);
        if(!component.get("v.IsRefresh")){
            var sObjectEvent = $A.get("e.force:navigateToSObject");
            sObjectEvent.setParams({
                "recordId": component.get("v.recordId")
            }) 
            sObjectEvent.fire();
            window.location.reload();
        }
    },
    // 计算的方法
    calculate : function(component, event, helper){
        var input = event.getSource().get('v.updateOn');
        var value = event.getSource().get('v.value');
        var id = input.split("_")[0];
        var datalist = component.get("v.orderProductList"); 
        for(var i = 0 ; i < datalist.length ; i ++ )
        {
            if(datalist[i].pro.Id == id)
            {
                if(input.indexOf("_Num") != -1)
                {                   
                    datalist[i].total = (value * datalist[i].price).toFixed(4);
                    component.set("v.orderProductList",datalist);
                    helper.doSummary(component);
                    break;
                }else if(input.indexOf("_Price") != -1)
                {
                    datalist[i].total = (value * datalist[i].num).toFixed(4);
                    component.set("v.orderProductList",datalist);
                    helper.doSummary(component);
                    break;
                }
            }
        }

    },
    summary : function(component, event, helper){
         helper.doSummary(component);
    }
})

helper.js 代码如下:

({
     init : function(component) {
        //调用服务器端方法
        var action = component.get("c.searchOrderProduct");
        //给后台方法参数传值
        action.setParam("orderId",component.get("v.recordId"));
        //调用回掉函数
        action.setCallback(this, function(response)
        {
            //定义提示信息
            var toastEvent = $A.get("e.force:showToast");
            var state = response.getState();
            //判断后台返回状态
            if(state == "SUCCESS")
            {
                //获取后台返回的参数
                console.log(JSON.stringify(response.getReturnValue()));  
                component.set("v.orderProductList",response.getReturnValue());
                component.set("v.pagesize",5);

                var page = component.get("v.page") || 1;
                var fieldName = component.get("v.selectedTabsoft");
                // 调用初始化产品块的方法
                this.LoadingProduct(component,page,fieldName);

                //设置提示信息;
                // alert("数据初始化完成!")
                // SFDC 已知问题,尚未解决。
                /*toastEvent.setParams(
                {
                    "title" : "SUCCESS",
                    "message" : "加载产品完成!",
                    "mode": "sticky",
                    "type" : "SUCCESS"
                });*/
            }
            else
            {
                console.log("=======error======="+response.getError()[0].message);
                //设置错误提示信息 
                toastEvent.setParams(
                {
                    "title" : "初始化数据",
                    "message" : "仓库产品加载失败,查看console.log!",
                    "type" : "Error"
                });
            }
            //将提示信息发出 如果不写这句话 将不会有提示信息 这个事件是系统自带事件,Lightning框架会监听这个事件
            toastEvent.fire();
        });
        //从客户端控制器调用服务器端控制器操作
        $A.enqueueAction(action);
    },
    LoadingProduct : function(component,page,fieldName){
       var action = component.get("c.searchProduct");
        /*
            第一个参数:页数
            第二个参数:每页显示的条数
            第三个参数:搜索关键字(默认为空)
            第四个参数:排序的字段名
            第五个参数:布尔类型 true:asc false desc
        */
        action.setParams({

             "pageNumber": page,
             "pagelength" : component.get("v.pagesize"),
             "searchWord": component.get("v.SearchKeyWord"),
             "sortField": fieldName,
             "isAsc": component.get("v.isAsc")
        });
        action.setCallback(this, function(response)
        {
            var toastEvent = $A.get("e.force:showToast");
            var state = response.getState();
            if(state == "SUCCESS")
            {
              /*  toastEvent.setParams(
                {
                    "title" : "SUCCESS",
                    "message" : "加载产品完成!",
                    "type" : "SUCCESS"
                });*/

                var result = response.getReturnValue();
                component.set("v.ProductList",result.ProductInnerList);
                //给分页参数赋值
                component.set("v.page", result.page);
                component.set("v.total", result.total);
                component.set("v.pages", Math.ceil(result.total / component.get("v.pagesize")));
                component.set("v.IsSpinner",false);
            }
            toastEvent.fire();
        });

        $A.enqueueAction(action); 

    },
    //排序方法
    sort: function(component,event,sortFieldName) 
    {  
        var currentDir = component.get("v.arrowDirection");

        if(currentDir == 'arrowdown') 
        {
            //修改箭头方向属性
            component.set("v.arrowDirection", 'arrowup');
            //设置排序属性 
            component.set("v.isAsc", true);
        } 
        else 
        {
            component.set("v.arrowDirection", 'arrowdown');
            component.set("v.isAsc", false);
        }

        //重新调用初始化产品方法
        var page = component.get("v.page") || 1;
        this.LoadingProduct(component,page,sortFieldName);
    },
    saveAll : function(component) {
        var productsAdd = component.get("v.orderProductList");
        var flag = false;
        var productsTempAddList = new Array();
        for(var i = 0 ; i < productsAdd.length ; i ++ )
        {
            if(productsAdd[i].flag)
            {
                flag = true;
                productsTempAddList.unshift(productsAdd[i]);
            }
        }
        if(flag){

            var proListJson = JSON.stringify(productsTempAddList);
            var action = component.get("c.save");
            action.setParams({
                contractId : component.get("v.recordId"),
                jsonStr : proListJson,
            });
            action.setCallback(this, function (response) 
            {
                var state = response.getState();
                //请求成功
                if (state === "SUCCESS") {

                    component.set("v.IsSpinner",false);
                }     
            });
            $A.enqueueAction(action);  
        }else{
            alert("至少选中一行产品进行保存");
            component.set("v.IsRefresh",true);
            component.set("v.IsSpinner",false);
        }
    },
    delete  : function(component) {
        var productsAdd = component.get("v.orderProductList");
        var flag = false;
        var productsTempAddList = new Array();
        for(var i = 0 ; i < productsAdd.length ; i ++ )
        {
            if(productsAdd[i].flag)
            { 
                flag = true;
            }else{
                productsTempAddList.unshift(productsAdd[i]);
            }
        }
        if(flag){
             component.set("v.orderProductList",productsTempAddList);
             component.set("v.IsSpinner",false);
        }else{
            alert("请选择要删除的产品行");
            component.set("v.IsSpinner",false);
        }
    },
     // 计算的方法
    doSummary : function(component){
        var amount = 0.0000;
        // 计算开票金额
        var dataTemplist = component.get("v.orderProductList"); 
        for(var i = 0 ; i < dataTemplist.length ; i ++ ){
            if(dataTemplist[i].flag){
                amount = (amount + dataTemplist[i].total);    
            }
        }
        component.set("v.Total_Amount",amount);
    }
})

服务端代码如下:

public with sharing class AP_ContractItems {
    // 订单产品 
    public class OrderProductInner
    {
        @AuraEnabled
        public Product__c pro{get;set;}
        @AuraEnabled
        public Boolean flag{get;set;}
        @AuraEnabled
        public Decimal total{get;set;}
        @AuraEnabled
        public Decimal price{get;set;}
        @AuraEnabled
        public Decimal num{get;set;}
        public OrderProductInner()
        {
            this.num = 0;
            this.price = 0;
            this.total = 0;
        }
    }
    //产品内部类
    public class ProductInner
    {
        @AuraEnabled
        public Product__c product{get;set;}
        @AuraEnabled
        public Boolean flag{get;set;}
        @AuraEnabled
        public Decimal price{get;set;}
        @AuraEnabled
        public Decimal num{get;set;}

    }
    //分页内部类
    public class PagerWrapper 
    {
        @AuraEnabled 
        public Integer pageSize{get;set;}
        @AuraEnabled 
        public Integer page{get;set;}
        @AuraEnabled 
        public Integer total{get;set;}
        @AuraEnabled 
        public List<ProductInner> ProductInnerList{get;set;}
    }
    @AuraEnabled
    public static OrderProductInner[] searchOrderProduct(String orderId) 
    {
        Map<Id,Product__c> proMap = new Map<Id,Product__c>();
        Set<Id> idSet = new Set<Id>();
        for(ContractProducts__c orderProduct : [SELECT Id,Name,Product__c,Product__r.Name,Product__r.Product_Model__c,Product__r.Product_Code__c,
                                               Product__r.Product_Series__c,Product__r.Core__c 
                                               from ContractProducts__c
                                               Where Contract__c =: orderId])
        {
            idSet.add(orderProduct.Product__c);
        }
        for(Product__c pro : [Select Id,Name,Product_Model__c,Product_Code__c,Product_Series__c,Core__c from Product__c Where Id in: idSet]){
            proMap.put(pro.Id,pro);
        }
        OrderProductInner[] orderProductlist = new OrderProductInner[]{};
        for(ContractProducts__c orderProduct : [SELECT Id,Name,Product__c,Product__r.Name,Product__r.Product_Model__c,Product__r.Product_Code__c,
                                               Product__r.Product_Series__c,Product__r.Core__c,Amount__c,Price__c  
                                               from ContractProducts__c
                                               Where Contract__c =: orderId])
        {
            OrderProductInner orderProductIn = new OrderProductInner();
            orderProductIn.pro = proMap.get(orderProduct.Product__c);
            orderProductIn.num = orderProduct.Amount__c;
            orderProductIn.price = orderProduct.Price__c;
            orderProductIn.total =  orderProduct.Amount__c *  orderProduct.Price__c;
            orderProductIn.flag = false;

            orderProductlist.add(orderProductIn);
        }

        return orderProductlist;
    }

    /*
        初始化查询所有产品
        第一个参数当前页数
        第二个参数每页的个数
        第三个参数搜索关键字
        注意这里不能用Integer,接收不到报错,必须使用Decimal
    */
    @AuraEnabled
    public static PagerWrapper searchProduct(Decimal pageNumber,Decimal pagelength,String searchWord,String sortField,boolean isAsc)
    {
        /*
            pageSize 每页显示多少个
            offset 要跳过多少条数据
        */
        Integer pageSize = (Integer)pagelength;
        Integer offset = ((Integer)pageNumber - 1) * pageSize;

        PagerWrapper pw =  new PagerWrapper();
        pw.pageSize = pageSize;
        pw.page = (Integer) pageNumber;


        /*
            拼接搜索参数字符串
        */
        String searchKeyWord = '%%';
        if(searchWord != null)
            searchKeyWord = '%'+searchWord+'%';

        String sql = 'Select Id,Name,Product_Model__c,Product_Code__c,Product_Series__c,Core__c From Product__c ';
        sql += 'Where Name Like \'' + searchKeyWord + '\'';
        if (sortField != '')
            sql += ' Order By ' + sortField;
        if (isAsc)
            sql += ' asc';
        else 
            sql += ' desc';
        sql += ' LIMIT ' + pageSize;
        sql += ' OFFSET ' + offset;

        System.debug(LoggingLevel.DEBUG, '*** size: ' + Database.query(sql));

        ProductInner[] pilist = new ProductInner[]{};
        for(Product__c cp : Database.query(sql))
        {
            ProductInner pi = new ProductInner();
            pi.product = cp;
            pi.flag = false;

            pilist.add(pi);
        } 

        //总数
        pw.total = [SELECT count() FROM Product__c Where Name Like : searchKeyWord];
        pw.ProductInnerList = pilist;

        return pw;
    }
    // 保存的方法
    @AuraEnabled
    public static void save(String contractId,String jsonStr)
    {
        List<ContractProducts__c> productInsert = new List<ContractProducts__c>();

        AP_ContractItems.OrderProductInner[] jsonApex = (AP_ContractItems.OrderProductInner[])JSON.deserialize(EncodingUtil.urlDecode(jsonStr,'utf_8'),AP_ContractItems.OrderProductInner[].class);
        for(AP_ContractItems.OrderProductInner orderProduct : jsonApex)
        {
            ContractProducts__c contractProduct = new ContractProducts__c();
            contractProduct.Contract__c = contractId;
            contractProduct.Product__c = orderProduct.pro.Id;
            contractProduct.Amount__c = orderProduct.num;
            contractProduct.Price__c  = orderProduct.price;
            productInsert.add(contractProduct);
        }
        try{
            insert productInsert;
        }catch(Exception e){
            System.debug(LoggingLevel.DEBUG, '*** Exception: ' + e.getMessage());
        }
    }

}

总体上功能可能跟前面的那个添加产品的功能差不太多,但是处理了一些细节的点。算是一个在修修改改就可以使用的一个功能吧。自己记录一下。

版权声明:本文为weixin_42716960原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_42716960/article/details/81746037

智能推荐

剑指offer 合并两个排序的链表

题目 链接:https://leetcode-cn.com/problems/he-bing-liang-ge-pai-xu-de-lian-biao-lcof/ 思路 我想的是,与合并两个有序数组一样的思维,新建一个链表,然后判断谁的值大,进而在新的链表上面进行插入。 看书思路 合并链表是一个递归问题:合并一个节点后可以转化为一个子问题。终止条件是其中一个链表为空 代码 链表反转也可以用递归解决...

Java编程思想 第三章:操作符

Java中的操作符和c/c++中的操作符基本一致,因为我之前学习过C语言和C++,所以本章的内容大部分都已熟知,下面只做简单的介绍。 Java操作符及优先级 Java中的操作符包括算术操作符,关系操作符,逻辑操作符,位运算符、自操作运算符、移位运算符、赋值运算符和其他运算符。 算术操作符:包括加减乘除和取余(%),优先级乘除取余高于加减,都是双元运算符,其中加法(+)可以用来连接两个字符串,比如:...

JetBrains 系列开发工具,如何配置 `SCSS` `File Watcher` ,相关输出配置参数详解:webStorm phpStorm IDEA

JetBrains 系列开发工具,如何配置 SCSS File Watcher ,相关输出配置参数详解:webStorm phpStorm IDEA 前言 你目前已经了解了如何使用 SCSS 进行开发,了解了该文章的内容:『 SCSS 日常用法 』 在 JetBrains 系列开发工具中通过 FileWatcher 进行编译的 SCSS 文件都是通过 sass 这个程序进行的。『 如何添加 Fil...

C语言小函数—二进制与十六进制

测试如下 “` int main() { long int num = 15; } “`...

仿微博或微信的文章多图显示(自定义MultiImageView)

按照一般的规矩,先上张图来供大伙看看 如果大致是大伙们需要实现的功能,不烦一观 自定义MultiImageView 工具类 具体使用 app.gradle中添加依赖 implementation 'com.github.bumptech.glide:glide:4.8.0' AndroidManifest.xml中配置联网权限 <uses-permission android:name=&q...

猜你喜欢

经典进程同步和互斥问题

经典进程同步与互斥问题 前言 一、生产者-消费者问题 1.问题描述 2.问题分析 3.代码 二、读者-写者问题 1.问题描述&&分析 2.代码 三、哲学家进餐问题 1.问题描述&&分析 2.代码 四、理发师问题 1.问题描述&&分析 2.代码 前言 在多道程序设计环境中,进程同步是一个非常重要的问题,下面讨论几个经典的进程同步问题。 一、生产者-消费...

java设计模式——ThreadLocal线程单例

1、定义一个ThreadLocal线程单例,代码如下: 2、定义一个多线程类,代码如下: 3、定义一个测试类,代码如下: 4、输出结果,如下图:...

【tensorflow】线性模型实战

线性模型:y = 1.477 * x + 0.089   1. 采样数据 采样噪声eps在均值0,方差0.01的高斯分布中,而后在均匀分布U(0,1)中,区间[-10,10]进行n=100次随机采样:   2. 计算误差 循环计算每个点的预测值与真是值之间差的平方并累加,从而获得训练集上的均芳误差损失值。   3. 计算梯度   4. 梯度更新 对权重w和偏...

常见损失函数和评价指标总结(附公式&代码)

网上看到一篇很实用的帖子关于常见损失函数和评价指标,收藏下来 本文转载于https://zhuanlan.zhihu.com/p/91511706 ------------------------------------------------------------------------------------------------------------------------------...

为什么 4G/5G 的直播延时依然很高

通信技术的发展促进了视频点播和直播业务的兴起,4G 和 5G 网络技术的进步也使得流媒体技术变得越来越重要,但是网络技术并不能解决流媒体直播的高延迟问题。 本文不会介绍网络对直播业务的影响,而是会分析直播中常见的现象 — 主播和观众之间能够感觉到的明显网络延迟。除了业务上要求的延迟直播之外,有哪些因素会导致视频直播的延迟这么高呢? live-streaming  图 1 - ...