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>