排序配置

1.基本功能 1.基本功能

1.1.前端排序 1.1.前端排序

表格的表头上有上下两个三角形图标。点击上面的小三角为升序排序,下面的为降序排序。按住ctrl键连续点击多个字段时,排序顺序先按照第一个字段排序,然后在按照第二个字段排序。排序是对所有的数据进行排序的,并非对当前页面进行排序,此功能为表格控件自带功能。新表格和旧表格样式和配置方式都是一样的。

1.2.后端排序 1.2. 后端排序

后端排序指表格点击查询后所加载出的数据是按照一个或者多个字段进行升序或者降序显示数据的。平台如果未配置后端排序默认是按照创建时间降序排序的。新表格和旧表格样式和配置方式都是一样的。在点击查询后,控制台日志会输出ORDER BY语句。例如:ORDER BY SERIAL_NUMBER, SEQ DESC, TEST_CASE_201_DETAIL_ID DESC,其中SERIAL_NUMBERSEQ DESCTEST_CASE_201_DETAIL_ID为字段名称。

1.3.按拼音排序 1.3. 按拼音排序

表格的排序默认是按照字符串的ascii排序,可以通过扩展方式实现按照拼音排序。
QQ图片20201109103832

2.配置方法 2.配置方法

2.1.前端排序 2.1.前端排序

新表格和旧表格的配置方式是一样的。

配置

  1. 对象建模–业务对象–业务对象管理:锁定业务对象,编辑业务对象,点可视化布局按钮进入到可视化界面。
  2. 选中表格中的列,勾选字段显示排序即可。
    前端排序
  3. 如果是批量操作,可选中表格GRID,点击上面的小齿轮,勾选显示排序
    前端排序
    前端排序

代码

新表格代码举例:在表格对应的html的表格中生成了sortable标签。

    <g-hot-column title='测试集描述' has-tip="true"  align="left" width="150" data="testSuiteDescription"  sortable >
    </g-hot-column>

旧表格代码举例:在表格对应的html的表格中生成了sortable标签。

    <g-column cell-align="left" width="150" data="description"  sortable >  描述  
        <g-column-tmpl>
            <span title="{{row.description}}" >{{row.description}}</span>
        </g-column-tmpl>
    </g-column>

2.2.后端排序 2.2.后端排序

新表格和旧表格的配置方式是一样的。

配置

  1. 对象建模–业务对象–业务对象管理:锁定业务对象,编辑业务对象,点击可视化布局按钮进入到可视化界面。
  2. 选中表格中的列,在右侧中找到排序排序顺序字段。排序提供升序降序两种选择。排序顺序填写数字。如果配置多个字段组合排序,数字越小,优先级越高

代码

主表的排序在bsctr文件中的query业务对象Params方法中生成orderColumns。如果主表不是表格内编辑的情况下,子表的排序代码也是一样的。

var orderColumns = []
orderColumns.push({
     propertyName:'codeType',
     sortDirection:'ASC',
   sortOrder:1
    });
    orderColumns.push({
        propertyName:'codeName',
        sortDirection:'DESC',
     sortOrder:2
    });

如果主表和子表都是表格内编辑的情况,子表的排序代码在主表service中的get主业务对象Maps方法中生成orderColumn.setPropertyName()orderColumn.setSortOrder()方法。

private Multimap<String, TestLixq201DetaiTableForm> getTestLixq201DetaiTableFormMaps(List<String> ids) {
        Multimap<String, TestLixq201DetaiTableForm> testCase201DetailsMaps = ArrayListMultimap.create();
        if (null != ids && ids.size() > 0) {
            //子对象  TestLixq201DetaiTableForm  testCase201Details
            TestLixq201DetaiTableFormExample testCase201DetailsExample = TestLixq201DetaiTableFormExample.create();
            Criteria testCase201DetailsCriteria = testCase201DetailsExample.and();
            List<OrderColumn> orderColumns = new ArrayList<OrderColumn>();
            OrderColumn orderColumn = new OrderColumn();
            orderColumn.setPropertyName("serialNumber");
            orderColumn.setSortOrder(1);
            orderColumn.setSortDirection("ASC");
            orderColumns.add(orderColumn);
            orderColumn = new OrderColumn();
            orderColumn.setPropertyName("seq");
            orderColumn.setSortOrder(2);
            orderColumn.setSortDirection("DESC");
            orderColumns.add(orderColumn);
            testCase201DetailsExample.addOrderByClause(TestLixq201DetaiTableForm.class, orderColumns);
            testCase201DetailsCriteria.andCreateCondition(TestLixq201DetaiTableForm.TESTCASE201ID, Operation.IN, ids);
            List<TestLixq201DetaiTableForm> testCase201Detailss = this.testLixq201DetaiTableFormService.find(testCase201DetailsExample);
            for (TestLixq201DetaiTableForm testLixq201DetaiTableForm : testCase201Detailss) {
                String key = "";
                String testCase201Id = testLixq201DetaiTableForm.getTestCase201Id();
                key = key + testCase201Id;
                testCase201DetailsMaps.put(key, testLixq201DetaiTableForm);
            }
        }
        return testCase201DetailsMaps;
    }

2.3.按拼音排序 2.3. 按拼音排序

  1. 表结构增加一个虚拟列
    Mysql5.7版本支持虚拟列,我们可通过给需要拼音排序的字段增加一个对应的虚拟列,数据为将MANUFACTURER转换为gbk编码进行存储,之后使用此虚拟列排序即可实现拼音排序。
    创建语句:
    alter table ry_weigh add VIR_MANUFACTURER varchar(100) character set gbk generated always as (convert(MANUFACTURER using gbk)) COMMENT ‘生产厂家虚拟字段(排序用)’ AFTER MANUFACTURER;
    添加索引
    ALTER TABLE ry_weigh ADD INDEX IDX_RY_WEIGH_VIR_MANUFACTURER
    (VIR_MANUFACTURER);
  2. 编辑业务对象的query方法,做调用前扩展
    1)配置扩展service
    QQ图片20201109105501
    2)扩展query方法调用规则
    编辑query方法,新增一个调用规则:
    微信图片_20201109110516
    3)重写queryBefore方法,代码可以参考3.常用扩展

3.常用扩展 3.常用扩展

3.1.按拼音排序 3.1. 按拼音排序

  1. 重写queryBefore方法
    生成后端代码后,会发现在查询方法前,会调用配置的扩展方法queryBefore:
/**
     *  GLPaaS生成
     *  根据Example查询分页
     * @return Page<T>
     */
    @Override
    public Page<RyWeigh> find(PageRequest pageRequest, RyWeighExample example, String businessType) {
        ryWeighExtService.queryBefore(example, businessType);
        Page<RyWeigh> page = super.find(pageRequest, example);
        return page;
    }

在扩展方法内修改example将排序字段替换成2.3中生成的虚拟列

/**称重记录查询扩展——查询前调用*/
    @Override
    public void queryBefore(RyWeighExample example, String businessType) {
        //重写实现拼音排序,替换为gbk存储的虚拟列
        if(StringUtils.isNotBlank(example.getOrderByClause())){
            //收货单位
            example.setOrderByClause(example.getOrderByClause().replace(RyWeigh.RECEIVENAME,"VIR_RECEIVE_NAME"));
            //发货单位
            example.setOrderByClause(example.getOrderByClause().replace(RyWeigh.SHIPPERNAME,"VIR_SHIPPER_NAME"));
            //生产厂家
            example.setOrderByClause(example.getOrderByClause().replace(RyWeigh.MANUFACTURER,"VIR_MANUFACTURER"));
        }
    }

QQ图片20201109111157

4.版本更新 4.版本更新