{extend name="public/base" /}
{block name="title"}推荐位商品列表{/block}
{block name="css"}
<style type="text/css">
tbody .layui-table-cell{height:50px;line-height:50px;}
tbody .layui-table-cell img{width: auto;height: 50px}
</style>
{/block}
{block name="content"}
<div class="layui-fluid">   
  <div class="layui-card">
    <form class="layui-form layui-card-header layuiadmin-card-header-auto" id="searchForm">
      <div class="layui-form-item asuma-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">商品名称</label>
            <div class="layui-input-block">
                <input type="text" name="goods_name" autocomplete="off" class="layui-input">
            </div>
        </div>
         <div class="layui-inline">
            <label class="layui-form-label">商品分类</label>
            <div class="layui-input-block">
              <select name="class_id" lay-search lay-reqText="请选择分类">
                <option value="">支持搜索</option>
                {volist name="classify" id="one"}
                <optgroup label="{$one.name}">
                  {if $one.child ?? ''}
                  {volist name="$one.child" id="two"}
                  <option value="{$two.id}">{$two.name}</option>
                  {/volist}
                  {/if}
                </optgroup>
                {/volist}
              </select>
            </div>
          </div>
        <div class="layui-inline">
            <button class="layui-btn layui-btn-asuma layuiadmin-btn-admin" lay-submit lay-filter="goodsSearch">
              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
            </button>
        </div>
      </div>
    </form>
    
    <div class="layui-card-body">
       
        <table id="goods" lay-filter="goods"></table>  
    </div>
  </div>
</div>
{/block}
{block name="footjs"}
<script type="text/html" id="optTpl">
  {{# if (d.fin == 1) { }}  
     <a class="layui-btn layui-btn-xs layui-btn-disabled">已添加</a>
  {{# } else { }}  
     <a class="layui-btn layui-btn-asuma layui-btn-xs" lay-event="add">添加</a>
  {{# } }}  
</script>

<script>
  layui.config({
    base: '__JS__/layuiext/' //静态资源所在路径
  }).use([ 'table','form'], function(){
    var $ = layui.$
    ,form = layui.form
    ,table = layui.table;

    var tableIns =  table.render({
      elem: '#goods'
      ,url: "{:route('recogoodsList')}?rid="+"{$rid}" //数据接口
      ,page: true //开启分页
      ,limit:10
      ,limits:[10,25,50]
      ,defaultToolbar: ['filter', 'print']
      ,done:function (res, curr, count) {
        if(count <= this.limit){
          $('.layui-table-page').addClass('layui-hide');//总条数小于每页限制条数时隐藏分页
        }
      }
      ,cols: [[ //表头
        {field: 'goods_name', title: '商品名称'}
        ,{field: 'imgs', title: '图片', templet: function(d){
          return '<img src="__FILEROOT__/thumb'+d.imgs+'"';
        }}
        ,{field: 'classfy', title: '所属分类'}  
          ,{field: 'post_type', title: '邮寄方式', templet: function(d){
          var post_type = ''
          switch(d.post_type){
            case 1:  post_type = '免邮' ;break;
            case 2:  post_type = '不免邮'; break;
            case 3:  post_type = '自提'; break;
            default:;break;
          }
          return post_type;
        }}
        ,{field: 'freight', title: '运费'} 
        ,{field: 'create_time', title: '创建时间', sort: true}
        ,{title: '操作',toolbar: '#optTpl'}
      ]]
    });
   
    table.on('sort(goods)',function(obj){
      if(tableIns.config.page.count <= tableIns.config.page.limit){
        $('.layui-table-page').addClass('layui-hide');//总条数小于每页限制条数时隐藏分页
      }
    })


    //监听搜索
    form.on('submit(goodsSearch)', function(data){
      let field = data.field;
      //执行重载
      tableIns.reload({
        where: field
        ,page:{curr:1}
      });

      return false;
    });
 

    table.on('tool(goods)', function(obj){
        switch(obj.event){
          case 'add':   
             $.post("{:route('Shop/addrecogoods')}", {gid:obj.data.id,rid:"{$rid}"}, function(res){
                if(res.code == 1){
                  layer.msg('添加成功');
                  window.parent.location.reload();//再执行关闭 
                }else{
                  layer.msg('添加失败', {icon: 5});
                   window.parent.location.reload();//再执行关闭 
                }
              },'json');
          break;
     
        };
    });


  });
</script>
{/block}