/**
 * <p>
 *  datasource.js
 * </p>
 *
 * @author Administrator
 * @since 2021/5/24
 */
layui.use(['layer', 'gtable', 'tag', 'form'], function () {
    const layer = layui.layer,
        gtable = layui.gtable
    // 用于临时存储查询条件
    let searchText = '';
    let markTypeTable;

    /**
     * 打开编辑窗口
     * @param data
     */
    const openEditLayer = function (data) {
        let tag, edit_template = `<div class="layui-row layui-form" lay-filter="markTypeEditForm" style="padding: 10px; width: 600px">
            <div class="layui-col-md12">
                <input type="hidden" name="id">
                <div class="layui-form-item">
                    <label class="layui-form-label">类型名称</label>
                    <div class="layui-input-block">
                        <input type="text" id="markTypeInput" name="markType" placeholder="请输入类型名称" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">标签</label>
                    <div class="layui-input-block">
                        <div id="markTag" style="padding: 8px;border: 1px solid #eee;min-height: 90px; max-height: 320px; overflow: auto">
                        </div>
                    </div>
                </div>
            </div>
        </div>`;
        layer.open({
            id: 'menuEdit',
            type: 1,
            title: '置标类型编辑',
            content: edit_template,
            btn: ['保存', '取消'],
            success: () => {
                tag = new MarkTag(layui.tag, {
                    tagId: 'markTag',
                    container: '#markTag',
                    addBtn: true,
                    removeBtn: true,
                });
                setData();
            },
            yes: saveMarkType
        });

        function setData() {
            if (data) {
                layui.form.val('markTypeEditForm', data);
                tag.setData(data.markDefault);
            }
        }

        function saveMarkType(index) {
            let formData = layui.form.val('markTypeEditForm');
            if (!formData.markType) {
                layer.msg("请输入类型名称");
                return false;
            }
            formData.markDefault = tag.getTextStr();
            Util.post(`/mark/api/type/save`, formData).then(res => {
                if (res.flag) {
                    layer.msg("保存成功");
                    layer.close(index);
                    markTypeTable.reload();
                } else {
                    showErrorMsg(res.msg);
                }
            })
        }
    }

    const deleteRow = function (id, callback) {
        Util.send(`/mark/api/type/${id}`, {}, 'delete').then(res => {
            if (res.flag) {
                showOkMsg("删除成功");
                markTypeTable.reload()
                callback && callback();
            } else {
                showErrorMsg(res.msg);
            }
        })
    }

    /**
     * 数据表格点击事件
     */
    const tableEventCallback = function (obj) {
        let rowData = obj.data;
        switch (obj.event) {
            case 'add':
                openEditLayer();
                break;
            case 'query':
                searchText = $('#searchKeyInput').val().trim();
                let queryOps = {
                    page: {current: 1},
                    where: {markType: searchText}
                }
                markTypeTable.reload(queryOps);
                break;
            case 'edit':
                openEditLayer(rowData);
                break;
            case 'delete':
                layer.confirm('确定要删除该数据吗？', function (index) {
                    deleteRow(rowData.id, () => {
                        layer.close(index)
                    });
                });
                break;
        }
    }

    const markTypeTableOptions = {
        id: 'markTypeTable',
        url: `${ctx}/mark/api/type/page`,
        method: 'get',
        cols: [[
            {field: 'id', title: 'ID', hide: true},
            {field: 'markType', title: '置标类型', width: 200},
            {title: '标签', templet: (d) => MarkTag.getStaticTagHtml(d.markDefault) || ''},
            {field: 'insertTypeStr', title: '录入方式', width: 120},
            {field: 'createUserStr', title: '创建人', width: 100},
            {field: 'createTime', title: '创建时间', width: 170},
            {fixed: 'right', align: 'center', title: '操作', toolbar: '#rowToolBar', width: 150}
        ]],
        limit: 20,
        onToolBarTable: tableEventCallback,
        onToolBarRow: tableEventCallback,
        done: function (res) {
            $('#searchKeyInput').val(searchText);
            //driver.init({elem: '#driverManageBtn'});
        }
    }
    markTypeTable = gtable.init(markTypeTableOptions);
});