layui按钮,根据表单行数据的状态值,来隐藏和显示

layui按钮,根据表单行数据的状态值,来隐藏和显示

实现效果如下:

在这里插入图片描述

主要前端代码:`

  <script type="text/html" id="tableBar">
                       {{#  if(d.headStatus == '新建(未审核)'){ }}
                       <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="look" sec:authorize="hasRole('ROLE_AssetHeadEdit')">
                           <i class="layui-icon">详情</i></a>
                       <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit" sec:authorize="hasRole('ROLE_AssetHeadEdit')">
                           <i class="layui-icon">修改</i></a>
                       <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" sec:authorize="hasRole('AssetHeadDel')">
                           <i class="layui-icon">删除</i></a>
                       <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="view" sec:authorize="hasRole('ROLE_AssetHeadView')">
                           <i class="layui-icon">审核</i></a>
                       {{#  } else if(d.headStatus == '审核完毕(未领用)'){ }}
                       <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="look" sec:authorize="hasRole('ROLE_AssetHeadEdit')">
                           <i class="layui-icon">详情</i></a>
                       <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="set" sec:authorize="hasRole('ROLE_AssetHeadSet')">
                           <i class="layui-icon">领用</i></a>
                       {{#  }else{ }}
                       <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="look" sec:authorize="hasRole('ROLE_AssetHeadEdit')">
                           <i class="layui-icon">详情</i></a>
                       <a class="layui-btn layui-btn-normal layui-btn-xs" ><i class="layui-icon">已完成</i></a>
                       {{#  } }}
                   </script>

d.headStatus == ‘新建(未审核)’ 中的d 是layui前端获取后端数据传来的数据
其中前端获取后端数据的方式,表单自动渲染数据:(如果没有特别命名,那layui就自动定为d

 <table id="main_table" class="layui-table" lay-filter="main_table" lay-data="{id: 'main_table',url:'./queryNotUseList', toolbar: '#toolBar',page:true,height:'full-165',cellMinWidth:120}">
                 <thead>

                        <tr >
                            <th lay-data="{align:'center', toolbar:'#tableBar', minWidth:250}">操作</th> 
                             <th lay-data="{field:'tid', align:'center'}">编码</th>
                            <th lay-data="{field:'userName', align:'center'}"></th>   
                               <th lay-data="{field:'headStatus', align:'center'}">状态</th>
                       </tr>
                       </thead>
                   </table>  
  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值