<?php


namespace App\Presenters;


class MultiSelectorPresenter
{
    public function render($name, $text, $value = null, $data = [], $option = [])
    {
        $data = $data ?: [['name' => '启用', 'value' => 1], ['name' => '禁用', 'value' => -1]];
        $isRequired = array_get($option, 'required', false);
        $requiredHtml = $isRequired ? '<span style="color: red">*</span>' : "";
        $elemId = $name . "Selector";
        $data = json_encode($data);
        $html = <<<EOF
           <label class="layui-form-label">
              $requiredHtml
              $text</label>
           <div class="layui-input-inline" style="margin-top: 0">
              <div id="$elemId" class="layui-input-inline" value="$value" style="width: 155px;"> 
              </div>
              <input type="hidden" name="$name" id="$name" value="$value">
          </div>
         <script>
          window.onload = function(){
        layui.use(['xmSelect', 'element'], function () {
    let xmSelect = layui.xmSelect;
    //渲染多选
    let selector = xmSelect.render({
        el: '#$elemId',
        name: '$name',
        searchTips: '请输入要查找的$text',
        paging: true,
        empty: '没有数据',
        prop: {
            name: 'name',
            value: 'value'
        },
	    size: 'mini',
        direction: 'down',
        data : $data,
        height: "1300px",
        autoRow: true,
        pageSize: 10,
        filterable: true,
        on: function (data) {
            let values = [];
            for (let x in data.arr)  // x 为属性名
            {
                values.push(data.arr[x].value);
            }
            console.log(values)
            $("#$name").val(values.join(','));
        }
    });
    let values = $('#$elemId').attr('value');
    selector.setValue(values.split(','));
});
        }
         </script>
EOF;
        return $html;
    }

}