移动端如何实现卡片分录分组后汇总一起展示原创
金蝶云社区-蔡销
蔡销
2人赞赏了该文章 175次浏览 未经作者许可,禁止转载编辑于2024年01月19日 14:35:44

需求如下:

卡片分录的数据,按照某个字段或者某些字段值来分组,分组后,相同分类的行需要展示在一起,分组的信息需要作为标题在界面上展示。效果如下图所示:

image.png

上面的数据一共是9行,有三种分组,分组后要展示在一起。

难点如下:

1、卡片分录的数据顺序是乱的,分组后,需要重新排布,才能够实现效果。

2、分组成功后的标题展示。


解决方案demo如下:

卡片分录添加一个下拉列表字段,dicj_combofield,值有A、B、C、D。

image.png


1、分组排序问题,设计好分组来源dicj_combofield,循环卡片分录,先收集分组A的行对象,再收集B组的行对象。。。

再循环该集合,单据体重新设置行的值。代码如下

@Override

    public void beforeBindData(EventObject e) {

        super.beforeBindData(e);

        DynamicObjectCollection entryEntity = this.getModel().getDataEntity(true).getDynamicObjectCollection("entryentity");

        //一级下拉列表 A B C D

        List<DynamicObject> list = new ArrayList<>(entryEntity.size());

        //先分组A

        sortByKeyValue(entryEntity, "A", list);

        //再分组B

        sortByKeyValue(entryEntity, "B", list);

        sortByKeyValue(entryEntity, "C", list);

        sortByKeyValue(entryEntity, "D", list);

        for (int i1 = 0; i1 < list.size(); i1++) {

            //重新设置行的值

            entryEntity.set(i1, list.get(i1));

        }

        this.getView().updateView("entryentity");

    }


    private void sortByKeyValue(DynamicObjectCollection coll, String key, List<DynamicObject> list) {

        for (int j = 0; j < coll.size(); j++) {

            DynamicObject item = coll.get(j);

            if (key.equals(item.getString("dicj_combofield"))) {

                list.add(item);

            }

        }

    

2、分组后的标题展示:

设计如下:

image.png

卡片分录里面添加两个卡片容器,一个用于展示标题,一个用于展示内容,正常一行都有标题+内容,但是由于分组后,标题只需要一行展示即可,剩下分组行就不需要展示标题行了。即设置不可见即可。

最后就是修改标题。

代码如下:

@Override

    public void afterBindData(EventObject e) {

        super.afterBindData(e);

        //控制标题卡片是否展示

        DynamicObjectCollection entryEntity = this.getModel().getDataEntity(true).getDynamicObjectCollection("entryentity");

        //一级下拉列表 A B C D

        CardEntry cardEntry = this.getControl("entryentity");

        Set<String> set = new HashSet<>();

        for (int i = 0; i < entryEntity.size(); i++) {

            DynamicObject item = entryEntity.get(i);

            String key = item.getString("dicj_combofield");

            if (set.contains(key)) {

                cardEntry.setChildVisible(false, i, "dicj_title");

            } else {

                set.add(key);

                //改标题名称

                Map<String, Object> map = new HashMap<>();

                map.put("text", key + "组");

                Map<String, Object> mapNew = new HashMap<>();

                mapNew.put("dicj_labelap", map);

                cardEntry.setCustomProperties(cardEntry.getKey(), i, mapNew);

            }

        }

    }


数据如下:

image.png

最终实现效果如下:

image.png

以上方案仅供参考。


赞 2