video_system/Modules/Camera/Resources/views/mine_add.blade.php

<style>
    .layui-upload-list {
        width: auto;
        height: auto;
        margin-bottom: 0;
    }

    .layui-elem-quote {
        padding-bottom: 5px;
    }

    .layui-upload-img {
        /*width: 92px;*/
        height: 92px;
    }

    hr {
        margin: 15px 0;
    }

    .uk-alert-danger {
        background: #fff1f0;
        color: #d85030;
        margin-bottom: 15px;
        padding: 10px;
        border: 1px solid rgba(216, 80, 48, .3);
        border-radius: 4px;
        text-shadow: 0 1px 0 #fff;
    }

    .imgItem {
        display: inline-block;
        position: relative;
        margin: 0 10px 10px 0;
    }

    .imgItem .layui-close {
        position: absolute;
        top: 0;
        right: 0;
        height: 16px;
        line-height: 16px;
        text-align: center;
        color: #000;
        width: 16px;
        border: 1px solid #000;
        background-color: #fff;
    }

    iframe.fr-iframe {
        padding: 0 20px;
    }

    .fr-wrapper.show-placeholder .fr-placeholder {
        padding-left: 30px !important;
    }

    .layui-form-label {
        width: {{ $colWidth }}px;
    }

    .layui-input-block {
        margin-left: {{ $colWidth + 30 }}px;
    }

    .weadmin-body {
        overflow: initial;
    }
</style>
<script src="/js/admin/xm-select.js"></script>
<script src="/laydate/laydate.js"></script>
<form class="layui-form" id="form-unify" method="post" action="{{ $path ?? '' }}" style="padding:20px;">
    @csrf
    <h2 class="uk-modal-title">{{ $fromTitle }}</h2>
    @if(isset($item[$primaryKey]))
        <input type="hidden" name="{{ $primaryKey }}" value="{{ $item[$primaryKey] }}">
    @endif
    <hr>

    @if ($errors->any())
        <div class="uk-alert-danger" uk-alert>
            <p>{{ $errors->first() }}</p>
        </div>
    @endif

    @foreach($columns as $key => $column)
        @switch($column['type'])
            @case('text')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block" style="line-height: 36px;">
                    @if(isset($column['default']) && !empty($column['default']))
                        @if($column['default'] instanceof Closure)
                            {!! $column['default']($item) !!}
                        @else
                            {!! $column['default'] !!}
                        @endif
                    @else
                        {!!  $item[$key] ?? '' !!}
                    @endif
                </div>
            </div>
            @break

            @case('input')
{{--            <div class="layui-form-item">--}}
{{--                <label class="layui-form-label">{{ $column['label'] }}</label>--}}
{{--                <div class="layui-input-block">--}}
{{--                    <input class="layui-input" type="text"--}}
{{--                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"--}}
{{--                           name="{{ $key }}"--}}
{{--                           value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}"/>--}}
{{--                </div>--}}
{{--            </div>--}}
            @break

            @case('password')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <input class="layui-input" type="password"
                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"
                           name="{{ $key }}"
                           value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}"/>
                </div>
            </div>
            @break

            @case('radio')
{{--            <div class="layui-form-item">--}}
{{--                <div class="layui-form-label">{{ $column['label'] }}</div>--}}
{{--                <div class="layui-input-block">--}}
{{--                    @foreach($column['options'] as $k => $col)--}}
{{--                        <label><input type="radio" name="{{ $key }}" value="{{ $k }}"--}}
{{--                                      @if((isset($item[$key]) && $item[$key] == $k) ||--}}
{{--                                      old($key) === $k ||--}}
{{--                                      (isset($column['default']) && $column['default'] === $k)) checked--}}
{{--                                      @endif title="{{ $col }}"/>--}}
{{--                        </label>--}}
{{--                    @endforeach--}}
{{--                </div>--}}
{{--            </div>--}}
            @break

            @case('checkbox')
            <div class="layui-form-item">
                <div class="layui-form-label">{{ $column['label'] }}</div>
                <div class="layui-input-block">
                    @foreach($column['options'] as $k => $col)
                        <input type="checkbox" name="{{ $key.'['.$k.']' }}" value="{{ $k }}"
                               @if((isset($item[$key]) && in_array($k, $item[$key])) ||
                               (old($key) !== null && in_array($k, old($key))) ||
                               (isset($column['default']) && !empty($column['default']) && in_array($k, $column['default']))) checked
                               @endif title="{{ $col }}" lay-filter="demo{{ $k }}"/>
                    @endforeach
                </div>
            </div>
            @break

            @case('textarea')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                <textarea class="layui-textarea" name="{{ $key }}" cols="30" rows="3"
                          placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}">{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}</textarea>
                </div>
            </div>
            @break

            @case('select')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <select name="{{ $key }}">
                        <option value="0" @if(!isset($item)) selected @endif>无</option>
                        @if(count($column['options']) > 0)
                            @foreach($column['options'] as $k => $col)
                                <option value="{{ $k }}"
                                        @if($column['default'] == $k || (isset($item[$key]) && $item[$key] == $k)) selected @endif>
                                    {{ $col }}
                                </option>
                            @endforeach
                        @endif
                    </select>
                </div>
            </div>
            @break

            {{--联动选择--}}
            @case('xselect')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <select name="{{ $key }}" xm-select="{{ $key }}" xm-select-radio="">
                        <option value="">无</option>
                    </select>
                </div>
            </div>
            <script>
                layui.use(['form', 'layer', 'formSelects'], function () {
                    var form = layui.form, layer = layui.layer, formSelects = layui.formSelects;
                    formSelects.config('{{ $key }}', {
                        keyName: 'title',            //自定义返回数据中name的key, 默认 name
                        keyVal: 'id',            //自定义返回数据中value的key, 默认 value
                        keyChildren: 'child',
                    }, true);
                    formSelects.data('{{ $key }}', 'local', {
                        arr: {!! json_encode($column['options'], JSON_UNESCAPED_UNICODE) !!},
                        linkage: true,
                        linkageWidth: 160
                    });

                    //如果有需要默认值的小伙伴请使用formSelects.value
                    @if(isset($item[$key]))
                    formSelects.value('{{ $key }}', ['{{ $item[$key] }}']);
                    @endif
                });
            </script>
            @break

            {{--单选--}}
            @case('sselect')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <select name="{{ $key }}" xm-select="{{ $key }}" xm-select-radio="" xm-select-search=""
                            xm-select-search-type="dl">
                        <option value="">无</option>
                    </select>
                </div>
            </div>
            <script>
                layui.use(['form', 'layer', 'formSelects'], function () {
                    var form = layui.form, layer = layui.layer, formSelects = layui.formSelects;
                    formSelects.config('{{ $key }}', {
                        keyName: 'title',            //自定义返回数据中name的key, 默认 name
                        keyVal: 'id',            //自定义返回数据中value的key, 默认 value
                        keyChildren: 'child',
                    }, true);
                    formSelects.data('{{ $key }}', 'local', {
                        arr: {!! json_encode($column['options'], JSON_UNESCAPED_UNICODE) !!}
                    });

                    //如果有需要默认值的小伙伴请使用formSelects.value
                    @if(isset($item[$key]))
                    formSelects.value('{{ $key }}', ['{{ $item[$key] }}']);
                    @endif
                });
            </script>
            @break

            {{--多选--}}
            @case('mselect')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <select name="{{ $key }}" xm-select="{{ $key }}" xm-select-search=""
                            xm-select-search-type="dl">
                        <option value="">无</option>
                    </select>
                </div>
            </div>
            <script>
                layui.use(['form', 'layer', 'formSelects'], function () {
                    var form = layui.form, layer = layui.layer, formSelects = layui.formSelects;
                    formSelects.config('{{ $key }}', {
                        keyName: 'title',            //自定义返回数据中name的key, 默认 name
                        keyVal: 'id',            //自定义返回数据中value的key, 默认 value
                        keyChildren: 'child',
                    }, true);
                    formSelects.data('{{ $key }}', 'local', {
                        arr: {!! json_encode($column['options'], JSON_UNESCAPED_UNICODE) !!}
                    });

                    //如果有需要默认值的小伙伴请使用formSelects.value
                    @if(isset($item[$key]))
                    formSelects.value('{{ $key }}', {!! json_encode($column['default'],JSON_UNESCAPED_UNICODE) !!});
                    @endif
                });
            </script>
            @break

            @case('tselect')
            <div class="layui-form-item" id="section_{{ $key }}">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div id="{{ $key }}"></div>
                </div>
            </div>
            <script>
                xmSelect.render({
                    el: '#{{ $key }}',
                    name: '{{ $key }}',
                    @if(isset($column['default']) && !empty($column['default']) && is_array($column['default']) && count($column['default']) > 0)
                    initValue: {!! json_encode($column['default']) !!},
                    @endif
                    autoRow: true,
                    filterable: true,
                    tree: {
                        show: true,
                        showFolderIcon: true,
                        showLine: true,
                        indent: 20,
                    },
                    data() {
                        return {!! json_encode($column['options']) !!};
                    }
                });
            </script>
            @break

            @case('trselect')
            <div class="layui-form-item" id="section_{{ $key }}">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div id="{{ $key }}"></div>
                </div>
            </div>
            <script>
                xmSelect.render({
                    el: '#{{ $key }}',
                    name: '{{ $key }}',
                    //单选
                    radio: true,
                    //选中关闭
                    clickClose: true,
                    @if(isset($column['default']) && !empty($column['default']) && is_array($column['default']) && count($column['default']) > 0)
                    initValue: {!! json_encode($column['default']) !!},
                    @endif
                    autoRow: true,
                    filterable: true,
                    tree: {
                        show: true,
                        showFolderIcon: true,
                        showLine: true,
                        indent: 20,
                    },
                    data() {
                        return {!! json_encode($column['options']) !!};
                    }
                });
            </script>
            @break

            @case('trmselect')
            <div class="layui-form-item" id="section_{{ $key }}">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div id="{{ $key }}"></div>
                </div>
            </div>
            <script>
                xmSelect.render({
                    el: '#{{ $key }}',
                    name: '{{ $key }}',
                    @if(isset($column['default']) && !empty($column['default']) && is_array($column['default']) && count($column['default']) > 0)
                    initValue: {!! json_encode($column['default']) !!},
                    @endif
                    autoRow: true,
                    filterable: true,
                    tree: {
                        show: true,
                        showFolderIcon: true,
                        showLine: true,
                        indent: 20,
                    },
                    data() {
                        return {!! json_encode($column['options']) !!};
                    }
                });
            </script>
            @break

            @case('date')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <input class="layui-input date-input" type="text"
                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"
                           name="{{ $key }}" autocomplete="off" readonly
                           disableautocomplete value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}">
                </div>
            </div>
            @break

            @case('dateMonth')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <input class="layui-input dateMonth-input" type="text"
                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"
                           name="{{ $key }}" autocomplete="off" readonly
                           disableautocomplete value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}">
                </div>
            </div>
            @break

            @case('dateYear')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <input class="layui-input dateYear-input" type="text"
                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"
                           name="{{ $key }}" autocomplete="off" readonly
                           disableautocomplete value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}">
                </div>
            </div>
            @break

            @case('dateTime')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <input class="layui-input" type="text"
                           id="{{ $key }}"
                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"
                           lay-key="{{ rand(10000,99999) }}"
                           name="{{ $key }}" autocomplete="off" readonly
                           disableautocomplete value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}">
                </div>
            </div>
            <script>
                layui.use('laydate', function () {
                    var laydate = layui.laydate;
                    //执行一个laydate实例
                    laydate.render({
                        elem: '#{{ $key }}'
                        , type: 'datetime'
                    });
                });
            </script>
            @break

            @case('time')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <input class="layui-input time-input" type="text"
                           placeholder="{{ $column['placeholder'] ?? '请输入'.$column['label'] }}"
                           name="{{ $key }}"
                           value="{{ $item[$key] ?? (old($key) ?? ($column['default'] ?? '')) }}">
                </div>
            </div>
            @break

            @case('tree_select')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    {{-- {!! json_encode($column) !!} --}}
                    <select name="{{ $key }}">
                        @if($column['isShowNull'] == true)
                            <option value="0" @if(!isset($item)) selected @endif>无</option>
                        @endif
                        @if(count($column['options']) > 0)
                            @include('admin::component.multi_select_option', ['selects' => $column['options'], 'selectPid' => $item[$key] ?? ($column['default'] ?? '')])
                        @endif
                    </select>
                </div>
            </div>
            @break

            @case('icon')
            <div class="layui-form-item" style="position:relative;">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div id="iconShow" class="layui-form-mid">
                        <i class="layui-icon layui-icon-{{ ($item[$key] ?? old($key)) ?? 'app' }}"></i>
                    </div>
                    <div class="layui-input-inline" id="iconInput">
                        <input class="layui-input" type="text" placeholder="选择图标" id="iconInput"
                               name="{{ $key }}" autocomplete="off"
                               disableautocomplete value="{{ $item[$key] ?? old($key) }}">
                    </div>
                </div>
                <div id="iconBox">
                    @include('admin::component/icon_list')
                </div>
            </div>
            <script>
                $(function () {
                    $('#iconInput').on('click', function () {
                        $('#iconBox').toggle();
                    })
                    $('#iconBox li i').on('click', function () {
                        var self = $(this);
                        $('#iconInput input').val(self.data('icon'));
                        $('#iconShow').html('<i class="layui-icon layui-icon-' + self.data('icon') + '"></i>');
                        $('#iconBox').hide();
                    })
                })
            </script>
            @break

            @case('uploadImg')
            <label class="layui-form-label">{{ $column['label'] }}</label>
            <div class="layui-upload">
                <img id="pre" class="layui-upload-img none">

                @if (strlen($column['default']) > 0)
                    <script>
                        $('#pre').attr('src', '{{ $column['default'] }}');
                    </script>
                @endif

                <span style="display: inline-table;">
                    <button type="button" class="layui-btn" id="selectImgBtn">上传图片</button>
                    <p id="uploadTips">
                        <input type="hidden" name="{{ $key }}" value="{{ $column['default'] ?? '' }}"/>
                    </p>
                </span>
            </div>
            <style>
                .layui-upload-img {
                    /*width: 92px;*/
                    height: 92px;
                    margin: 10px 10px 10px 10px;
                }

                #uploadTips {
                    line-height: 30px;
                }
            </style>
            <script>
                layui.use('upload', function () {

                    var $ = layui.jquery
                        , upload = layui.upload;

                    var uploadInst = upload.render({
                        elem: '#selectImgBtn'
                        , url: "{{ $column['uploadURLPath'] }}"
                        , acceptMime: 'image/jpg, image/png, image/jpeg'
                        , number: 1
                        , before: function (obj) {
                            //预读本地文件示例，不支持ie8
                            obj.preview(function (index, file, result) {
                                $('#pre').attr('src', result); //图片链接（base64）
                            });
                        }
                        , done: function (res) {
                            //如果上传失败
                            if (res.code > 0) {
                                return layer.msg('上传失败');
                            }
                            //上传成功
                            $("input[name='{{ $key }}']").val(res.data.image_path);
                        }
                        , error: function () {
                            //演示失败状态，并实现重传
                            var uploadTips = $('#uploadTips');
                            uploadTips.html('<span style="color: #FF5722; text-align:center">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                            uploadTips.find('.demo-reload').on('click', function () {
                                uploadInst.upload();
                            });
                        }
                    });

                });
            </script>

            @break

            @case('uploadImgs')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div class="layui-upload">
                        <blockquote class="layui-elem-quote layui-quote-nm">
                            预览图：
                            <div class="layui-upload-list" id="{{ $key }}_list">
                                @if(isset($column['default']) && !empty($column['default']))
                                    @foreach($column['default'] as $imgKey => $image)
                                        <span id="img{{ $imgKey }}" class="imgItem">
                                            <img src="{{ $image['path'] }}" alt="{{ $image['imageName'] }}"
                                                 class="layui-upload-img"/>
                                            <a href="javascript:void(0);" class="layui-close">X</a>
                                            <input type="hidden" name="{{ $key }}[{{ $imgKey }}][path]"
                                                   value="{{ $image['path'] }}">
                                            <input type="hidden" name="{{ $key }}[{{ $imgKey }}][imageName]"
                                                   value="{{ $image['imageName'] }}">
                                        </span>
                                    @endforeach
                                @endif
                            </div>
                        </blockquote>
                        <button type="button" class="layui-btn" id="{{ $key }}_btn">多图片上传</button>
                    </div>
                </div>
            </div>

            <script>
                layui.use('upload', function () {
                    var upload = layui.upload;
                    //多图片上传
                    upload.render({
                        elem: '#{{ $key }}_btn'
                        , url: '{{ $column['uploadURLPath'] }}'
                        , multiple: true
                        , accept: 'images'
                        , field: 'image'
                        , before: function (obj) {
                            //预读本地文件示例，不支持ie8
                            obj.preview(function (index, file, result) {
                                $('#{{ $key }}_list').append('<span id="img' + index + '" class="imgItem"><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img"><a href="javascript:void(0);" class="layui-close">X</a></span>')
                            });
                        }
                        , done: function (res, index) {
                            if (res.code === 0) {
                                $('#img' + index).append('<input type="hidden" name="{{ $key }}[' + index + '][path]" value="' + res.data.image_path + '"/>')
                                $('#img' + index).append('<input type="hidden" name="{{ $key }}[' + index + '][imageName]" value="' + res.data.image_name + '"/>')
                            }
                            //上传完毕
                        }
                    });
                });
            </script>
            @break

            @case('uploadFiles')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div class="layui-upload">
                        <div class="layui-upload-list">
                            <table class="layui-table">
                                <thead>
                                <tr>
                                    <th>文件名</th>
                                    <th>状态</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody id="{{ $key }}_list">
                                @if(isset($column['default']) && !empty($column['default']))
                                    @foreach($column['default'] as $fileKey => $file)
                                        <tr>
                                            <td>
                                                <a href="/admin/file/download?name={{ $file['fileName'] }}&path={{ $file['path'] }}"
                                                   target="_blank"></a>{{ $file['fileName'] }}</td>
                                            <td></td>
                                            <td>
                                                <button class="layui-btn layui-btn-xs layui-btn-danger file-delete">删除
                                                </button>
                                                <input type="hidden" name="{{ $key }}[{{ $fileKey }}][path]"
                                                       value="{{ $file['path'] }}"/>
                                                <input type="hidden" name="{{ $key }}[{{ $fileKey }}][fileName]"
                                                       value="{{ $file['fileName'] }}"/>
                                                <input type="hidden" name="{{ $key }}[{{ $fileKey }}][fileSize]"
                                                       value="{{ $file['fileSize'] ?? 0 }}"/>
                                            </td>
                                        </tr>
                                    @endforeach
                                @endif
                                </tbody>
                            </table>
                        </div>
                        <button type="button" class="layui-btn" id="{{ $key }}_btn">选择上传文件</button>
                    </div>
                </div>
            </div>
            <script>
                layui.use('upload', function () {
                    var upload = layui.upload;
                    //多文件列表示例
                    var fileListView = $('#{{ $key }}_list')
                        , uploadListIns = upload.render({
                        elem: '#{{ $key }}_btn'
                        , url: '{{ $column['uploadURLPath'] }}'
                        , accept: 'file'
                        , multiple: true
                        // , auto: false
                        // , bindAction: '#testListAction'
                        , choose: function (obj) {
                            // var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                            //读取本地文件
                            obj.preview(function (index, file, result) {
                                var tr = $(['<tr id="upload-{{ $key }}-' + index + '">'
                                    , '<td>' + file.name + '</td>'
                                    // , '<td>' + (file.size / 1014).toFixed(1) + 'kb</td>'
                                    , '<td>正在上传，请等待……</td>'
                                    , '<td>'
                                    , '<button class="layui-btn layui-btn-xs file-reload layui-hide">重传</button>'
                                    , '<button class="layui-btn layui-btn-xs layui-btn-danger file-delete">删除</button>'
                                    , '</td>'
                                    , '</tr>'].join(''));

                                //单个重传
                                tr.find('.file-reload').on('click', function () {
                                    obj.upload(index, file);
                                });

                                //删除
                                tr.find('.file-delete').on('click', function () {
                                    // delete files[index]; //删除对应的文件
                                    tr.remove();
                                    uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                                });

                                fileListView.append(tr);
                            });
                        }
                        , done: function (res, index, upload) {
                            if (res.code === 0) { //上传成功
                                var tr = fileListView.find('tr#upload-{{ $key }}-' + index)
                                    , tds = tr.children();
                                tds.eq(0).html('<a href="/admin/file/download?name=' + res.data.file_name + '&path=' + res.data.file_path + '" target="_blank">' + res.data.file_name + '</a>');
                                tds.eq(1).html('<span style="color: #5FB878;">上传成功</span>');
                                // tds.eq(3).html(''); //清空操作
                                tds.eq(2).append('<input type="hidden" name="{{ $key }}[' + index + '][path]" value="' + res.data.file_path + '"/>');
                                tds.eq(2).append('<input type="hidden" name="{{ $key }}[' + index + '][fileName]" value="' + res.data.file_name + '"/>');
                                tds.eq(2).append('<input type="hidden" name="{{ $key }}[' + index + '][fileSize]" value="' + (res.data.file_size == undefined ? 0 : res.data.file_size) + '"/>');
                                return;
                                // return delete this.files[index]; //删除文件队列已经上传成功的文件
                            }
                            this.error(index, upload);
                        }
                        , error: function (index, upload) {
                            var tr = fileListView.find('tr#upload-{{ $key }}-' + index)
                                , tds = tr.children();
                            tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                            tds.eq(3).find('.file-reload').removeClass('layui-hide'); //显示重传
                        }
                    });
                });
            </script>
            @break

            @case('hidden')
            <input type="hidden" name="{{ $key }}" value="{{ $column['label'] }}"/>
            @break

            @case('includeBlock')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    @includeIf($column['path'], $column['itemValue'])
                </div>
            </div>
            @break

            @case('editor')
            <div class="layui-form-item">
                <label class="layui-form-label">{{ $column['label'] }}</label>
                <div class="layui-input-block">
                    <div class="fr-view">
                        <textarea id="editor_{{ $key }}"
                                  name="{{ $key }}">{!! $item[$key] ?? $column['default'] !!}</textarea>
                        {{--<div id="editor_{{ $key }}">{!! $item[$key] ?? $column['default'] !!}</div>--}}
                    </div>
                </div>
            </div>
            <script>

                var editor_{{ $key }} = new FroalaEditor('#editor_{{ $key }}', {
                    language: 'zh_cn',
                    iframe: true,
                    quickInsertTags: [],
                    events: {
                        contentChanged: function () {
                            $('#editor_{{ $key }}').val(this.html.get());
                        }
                    },
                    // upload image
                    imageUploadParam: 'file',
                    imageUploadURL: '{{ $column['uploadURLPath'] }}',
                    imageUploadMethod: 'POST',
                    imageInsertButtons: ['imageBack', '|', 'imageUpload', 'imageByURL'],
                    imageDefaultWidth: 500,
                    // toolbar buttons
                    toolbarButtons: ['bold', 'italic', 'underline', 'strikeThrough', '|',
                        'paragraphFormat', 'fontFamily', 'fontSize', 'textColor', 'backgroundColor', 'clearFormatting', '|',
                        'align', 'formatOLSimple', 'formatUL', 'outdent', 'indent', 'quote', '|',
                        'insertLink', 'insertImage', 'insertTable', 'insertHR', '|',
                        'selectAll', 'clearFormatting', '|',
                        'undo', 'redo'],
                    requestWithCORS: true,
                    requestHeaders: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                /**
                 tinymce.init({
                    selector: '#editor_{{ $key }}',
                    menubar: false,
                    height: 600,
                    plugins: [
                        'advlist autolink link image imagetools lists charmap print preview hr anchor pagebreak spellchecker',
                        'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking',
                        'save table contextmenu directionality emoticons template paste textcolor'
                    ],
                    toolbar: 'insertfile undo redo | bold italic underline strikethrough removeformat formats forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image table tabledelete',
                    images_upload_handler: function (blobInfo, success, failure) {
                        var xhr, formData;
                        xhr = new XMLHttpRequest();
                        xhr.withCredentials = false;
                        xhr.open('POST', '{{ $column['uploadURLPath'] }}');
                        var token = '{{ csrf_token() }}';
                        xhr.setRequestHeader("X-CSRF-TOKEN", token);
                        xhr.onload = function () {
                            var json;
                            if (xhr.status != 200) {
                                failure('HTTP Error: ' + xhr.status);
                                return;
                            }
                            json = JSON.parse(xhr.responseText);

                            if (!json || typeof json.location != 'string') {
                                failure('Invalid JSON: ' + xhr.responseText);
                                return;
                            }
                            success(json.location);
                        };
                        formData = new FormData();
                        formData.append('file', blobInfo.blob(), blobInfo.filename());
                        xhr.send(formData);
                    },
                    language: 'zh_CN'
                });
                 **/
                {{--layui.use('layedit', function () {--}}
                {{--var layedit = layui.layedit;--}}
                {{--layedit.set({--}}
                {{--uploadImage: {--}}
                {{--url: '{{ $column['uploadURLPath'] }}'--}}
                {{--, acceptMime: 'image/jpg, image/png, image/jpeg'--}}
                {{--, number: 1--}}
                {{--, type: 'post' //默认post--}}
                {{--, headers: {--}}
                {{--'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')--}}
                {{--}--}}
                {{--}--}}
                {{--, tool: [--}}
                {{--'undo', 'redo', 'strong', 'italic', 'underline', 'del', 'addhr'--}}
                {{--, '|', 'fontfamily', 'fontSize', 'fontBackColor', 'colorpicker', 'face'--}}
                {{--, '|', 'left', 'center', 'right'--}}
                {{--, '|', 'link', 'unlink', 'image_alt', 'images'--}}
                {{--, '|', 'table'--}}
                {{--]--}}
                {{--});--}}
                {{--var index = layedit.build('editor_{{ $key }}'); //建立编辑器--}}
                {{--});--}}

            </script>
            @break

            @default
            暂无数据
        @endswitch
        @if($hasHr)
            <hr>
        @endif
    @endforeach

    <div class="layui-form-item" id="user_name">
        <label class="layui-form-label">区域名称</label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="title" value="{{ $item['title'] ?? (old('title') ?? ($column['default'] ?? '')) }}"/>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-form-label">视频服务器类型</div>
        <div class="layui-input-block">
            @foreach($columns['is_hak']['options'] as $k => $col)
                <label><input type="radio" name="is_hak" lay-filter="is_hak" value="{{ $k }}"
                              @if((isset($item['is_hak']) && $item['is_hak'] == $k)) checked @endif title="{{ $col }}"/>
                </label>
            @endforeach
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">排序</label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="sort"  value="{{ $item['sort'] ?? (old('sort') ?? ($columns['sort']['default'] ?? '')) }}"/>
        </div>
    </div>

    <div class="layui-form-item" id="ip">
        <label class="layui-form-label">ip地址</label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="ip"  value="{{ $item['ip'] ?? (old('ip') ?? ($column['default'] ?? '')) }}"/>
        </div>
    </div>

    <div class="layui-form-item" id="port">
        <label class="layui-form-label">端口</label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="port"  value="{{ $item['port'] ?? (old('port') ?? ($column['default'] ?? '')) }}"/>
        </div>
    </div>

    <div class="layui-form-item" id="key">
        <label class="layui-form-label" id="key_name"></label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="key"  value="{{ $item['key'] ?? (old('key') ?? ($column['default'] ?? '')) }}"/>
        </div>
    </div>

    <div class="layui-form-item" id="secret">
        <label class="layui-form-label" id="secret_name"></label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="secret"  value="{{ $item['secret'] ?? (old('secret') ?? ($column['default'] ?? '')) }}"/>
        </div>
    </div>

    <div class="layui-form-item" id="sOrgId">
        <label class="layui-form-label" id="sOrgId">设备ID</label>
        <div class="layui-input-block">
            <input class="layui-input" type="text" name="sOrgId"  value="{{ $item['sOrgId'] ?? (old('sOrgId') ?? ($column['default'] ?? '')) }}"/>
        </div>
    </div>

    <div id="kongbai">
        <br><br><br><br><br><br><br><br><br><br><br>
    </div>

    @if(!is_null($footBtns))
        <hr>
        <div style="text-align: right">
            @if(in_array('goback',$footBtns))
                @if($isAjax)
                    <button class="layui-btn layui-btn-primary layui-layer-close" style="position:relative;"
                            type="button">
                        取消
                    </button>
                @else
                    <button class="layui-btn layui-btn-primary layui-layer-close" style="position:relative;"
                            type="button"
                            onclick="javascript:history.go(-1);">返回
                    </button>
                @endif
            @endif
            @if(in_array('save',$footBtns))
                <button class="layui-btn" type="submit" lay-submit lay-filter="formBox">保存</button>
            @endif
        </div>
    @endif
</form>

<script>
    if($('input:radio[name="is_hak"]:checked').val() == undefined){
        $("input:radio[name=is_hak][value=0]").attr("checked", "true");
    }
    //根据摄像头来源显示内容
    if($('input:radio[name="is_hak"]:checked').val() == 0){//其他
        document.getElementById("ip").style.display = 'none';
        document.getElementById("port").style.display = 'none';
        document.getElementById("key").style.display = 'none';
        document.getElementById("secret").style.display = 'none';
        document.getElementById("kongbai").style.display = 'block';
        document.getElementById("sOrgId").style.display = 'none';
    }
    if($('input:radio[name="is_hak"]:checked').val() == 1){//海康
        document.getElementById("ip").style.display = 'block';
        document.getElementById("port").style.display = 'block';
        document.getElementById("key").style.display = 'block';
        document.getElementById("secret").style.display = 'block';
        document.getElementById("key_name").innerHTML = "请求key";
        document.getElementById("secret_name").innerHTML = "请求secret";
        document.getElementById("kongbai").style.display = 'none';
        document.getElementById("sOrgId").style.display = 'none';
    }
    if($('input:radio[name="is_hak"]:checked').val() == 4){//天地伟业
        document.getElementById("ip").style.display = 'block';
        document.getElementById("port").style.display = 'block';
        document.getElementById("key").style.display = 'block';
        document.getElementById("secret").style.display = 'block';
        document.getElementById("key_name").innerHTML = "用户名";
        document.getElementById("secret_name").innerHTML = "密码";
        document.getElementById("kongbai").style.display = 'none';
        document.getElementById("sOrgId").style.display = 'block';
    }

    layui.use(['form', 'laydate', 'table'], function () {
        var form = layui.form, table = layui.table;
        form.render();

        form.on('checkbox', function (data) {
            $(data.othis).toggleClass('layui-form-checked');
        });

        form.on('radio(is_hak)', function(data){
            var val=data.value;
            if(val == 0){
                document.getElementById("ip").style.display = 'none';
                document.getElementById("port").style.display = 'none';
                document.getElementById("key").style.display = 'none';
                document.getElementById("secret").style.display = 'none';
                document.getElementById("kongbai").style.display = 'block';
                document.getElementById("sOrgId").style.display = 'none';

            }else if(val == 1){
                document.getElementById("ip").style.display = 'block';
                document.getElementById("port").style.display = 'block';
                document.getElementById("key").style.display = 'block';
                document.getElementById("secret").style.display = 'block';
                document.getElementById("key_name").innerHTML = "请求key";
                document.getElementById("secret_name").innerHTML = "请求secret";
                document.getElementById("kongbai").style.display = 'none';
                document.getElementById("sOrgId").style.display = 'none';
            }else if(val == 4){
                document.getElementById("ip").style.display = 'block';
                document.getElementById("port").style.display = 'block';
                document.getElementById("key").style.display = 'block';
                document.getElementById("secret").style.display = 'block';
                document.getElementById("key_name").innerHTML = "用户名";
                document.getElementById("secret_name").innerHTML = "密码";
                document.getElementById("kongbai").style.display = 'none';
                document.getElementById("sOrgId").style.display = 'block';
            }
        });

        @if($isAjax)
        form.on('submit(formBox)', function (data) {
            var urlPost = $('#form-unify').attr('action');
            var submitBtn = $(data.elem);
            submitBtn.addClass('layui-btn-disabled').prop('disabled', true).text('提交中……');
            $.ajax({
                url: urlPost,
                type: 'POST',
                dataType: 'json',
                data: data.field
            })
                .done(function (res) {
                    if (res.code === 0) {
                        submitBtn.text('完成');
                        layer.msg('完成！', {anim: 0}, function () {
                            if (res.data.table === '') {
                                location.reload();
                            } else {
                                layer.closeAll();
                                if (res.data.table !== undefined) {
                                    table.reload(res.data.table);
                                }
                                if (res.url !== undefined) {
                                    location.href = res.url;
                                }
                            }
                        });
                    } else {
                        layer.msg(res.message, {anim: 0}, function () {
                            submitBtn.removeClass('layui-btn-disabled').prop('disabled', false).text('重新保存');
                        });
                    }
                })
                .fail(function (res) {
                    layer.msg(res.message, {anim: 0}, function () {
                        submitBtn.removeClass('layui-btn-disabled').prop('disabled', false).text('重新保存');
                    });
                });
            return false;
        });
        @endif
    });

    $('.layui-form').on('click', '.layui-close', function () {
        var self = $(this);
        self.closest('.imgItem').remove();
    });

    $('.layui-form').on('click', '.file-delete', function () {
        var self = $(this);
        self.closest('tr').remove();
    });

    $('.date-input').datepicker({
        language: 'zh-CN',
        format: 'yyyy-mm-dd',
        zIndex: 19999999,
        autoHide: true
    });
    $('.dateMonth-input').datepicker({
        language: 'zh-CN',
        format: 'yyyy-mm',
        zIndex: 19999999,
        autoHide: true
    });
    $('.dateYear-input').datepicker({
        language: 'zh-CN',
        format: 'yyyy',
        zIndex: 19999999,
        autoHide: true
    });
</script>