为了方便操作，有时候需要将功能操作设置在行数据里，并且能够通过判断数据是否符合条件来显示操作按钮。

下面教大家怎么实现通过订单状态判断，已经审核通过的订单不显示修改按钮。

准备工作：

1、订单数据表，包含状态字段，同时准备几条数据

2、修改订单功能

实现步骤：

1、创建一个订单列表数据集，注意模板必须选择“集合beta”。

2、进入数据集流程编辑页，打开“显示-集合-订单”步骤的设置

3、点击“添加属性”按钮添加一个属性，并将该属性移至合适位置，“别名”设置为“操作”，“自定义显示”设置为“编程”。

4、点开“自定义显示-编程”的“编辑代码”。调整class为“cell”的div元素及其css样式

效果：

5、添加v-if 判断状态显示

效果：

6、调用修改订单的功能

完整代码：

<template>

    <div class="cell bm-cell" v-if="status" @click="updateOrder">修改</div>

</template>

<script>

    module.exports = {

    methods:{

        updateOrder(){

            //调用功能：修改订单

            this.$$cmd({

                type:"program",//固定值 program

                    value:{

                        flow:"604b0435ae2f6850134b64e1",//功能id

                        data:{//功能数据

                            "604b0435ae2f6850134b64e3":this.data,//步骤id：选择订单

                         },

                        skip:false,//true:不显示弹窗，直接在后台运行

                }

             });

        },

    },  

    computed:{

        // value 原始值

        // display 显示的值

        // data 当前行的数据

        // field 当前属性

        status(){

            //状态为待审的数据才显示按钮

            let status=this.data["604aee864630735012fabef0"];//订单状态

            return status=="待审";

        },

    },

}

</script>

<style lang="less" scoped>

    .cell {//默认cell的height为100%

        &.bm-cell {

            position: absolute;

            padding: 0px 14px;

            height: 32px;

            background: #00CEBB;

            border-radius: 3px;

            font-size: 16px;

            font-weight: 400;

            color: #FFFFFF;

            text-align: center;

            top: 5px;

            left: 20px;

            cursor:pointer;

        }

    }

</style>

至此功能已实现。

效果：