SIPAIIS_WMS_JSSW/WebRoot/jsp/process/dataVisualContentEditForPicture.jsp

<%@ page language="java" pageEncoding="UTF-8" %>
<%@page import="com.sipai.entity.process.DataVisualContent" %>
<%request.setAttribute("Type_Picture", DataVisualContent.Type_Picture); %>
<%request.setAttribute("Isfull_True", DataVisualContent.Isfull_True); %>
<%request.setAttribute("Isfull_False", DataVisualContent.Isfull_False); %>

<link rel="stylesheet"
      href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css"/>
<script type="text/javascript"
        src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
        charset="utf-8"></script>
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/bootstrap-fileinput/css/fileinput.min.css"/>
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/bootstrap-fileinput/js/fileinput.min.js"
        charset="utf-8"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/bootstrap-fileinput/js/locales/zh.js"
        charset="utf-8"></script>

<style type="text/css">

</style>
<script type="text/javascript">
    
    var masterId = '${dataVisualContent.id}';
        var tbName = 'tb_pro_dataVisual_picture_file'; //数据表
        var nameSpace = 'dataVisualPicture';//保存文件夹
        var previews = new Array();
        var previewConfigs = new Array();

        var fileinput = function () {
            $.post(ext.contextPath + '/base/fileinput.do', {
                masterId: masterId,
                tbName: tbName,
                nameSpace: nameSpace
            }, function (data) {
                $("#fileInputDiv").html(data);
                openModal('fileInputModal');
            });
        };

        //名称定义不可修改
        var getFileList = function () {
            $.post(ext.contextPath + '/base/getInputFileList.do', {
                masterId: masterId,
                tbName: tbName
            }, function (data) {
//                 console.info(data)
                if (data.length > 0) {
                    previews = new Array();
                    // $('#maintenancefile').show();
                    for (var i = 0; i < data.length; i++) {
                        var previewConfig = new Object();
                        var path = data[i].abspath;
                        path = path.substring(path.indexOf('webapps') + 7, path.length);
                        path = ext.basePath.replace(ext.contextPath, '') + path.replace(/\\/g, "\/");
                        previews.push(path);
                        previewConfig['width'] = '50px';
                        previewConfig['caption'] = data[i].filename;
                        previewConfig['key'] = data[i].id;
                        previewConfigs.push(previewConfig);
                    }
                    showFileInput("dataVisualPictureFile");
                } else {
                    $('#dataVisualPictureFile').hide();
                }
            }, 'json');

        };

        function showFileInput(ctrlName) {
            var control = $('#' + ctrlName);
            control.fileinput('destroy');
            control.fileinput({
                language: 'zh', //设置语言
                showUpload: false, //是否显示上传按钮
                showRemove: false,
                showCaption: false,//是否显示标题
                showBrowse: false,//选择按钮
                showClose: false,//右上角关闭按钮
                dropZoneEnabled: false,//是否显示拖拽区域
                fileActionSettings: {
                    showDrag: false
                },
                browseClass: "btn btn-primary", //按钮样式
                maxFileCount: 10, //表示允许同时上传的最大文件个数
                enctype: 'multipart/form-data',
                validateInitialCount: true,
                previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                initialPreviewAsData: true,
                initialPreview: previews,
                initialPreviewConfig: previewConfigs,
                layoutTemplates: {
                    actionUpload: ''
                },
                deleteUrl: ext.contextPath + "/base/deleteInputFile.do",
                deleteExtraData: function () {           //传参
                    var data = {
                        "tbName": tbName
                    };
                    return data;
                }
            });
            $('#kvFileinputModal').on("hidden.bs.modal", function () {
                $(this).removeData("bs.modal");
                //modal重复打开会导致前面的滚动条失去作用
                $('.modal').css("overflow", "auto");
            });
        }
        
        
    $(function () {
        $('#backgroundContainer').colorpicker({format: null});

        $('#switchBtnIsFull').bootstrapSwitch({
            onText: '是',
            offText: '否',
            size: "small",
        });
        if ('${dataVisualContent.isfull}' == '${Isfull_False}') {
            $('#switchBtnIsFull').bootstrapSwitch('state', false, true);
        } else if ('${dataVisualContent.isfull}' == '${Isfull_True}') {
            $('#switchBtnIsFull').bootstrapSwitch('state', true, true);
        } else {
            $('#switchBtnIsFull').bootstrapSwitch('state', false, true);
        }

        $('#switchBtnIsFixed').bootstrapSwitch({
            onText: '是',
            offText: '否',
            size: "small",
        });

        if ('${dataVisualContent.isfixed}' == 'false') {
            $('#switchBtnIsFixed').bootstrapSwitch('state', false, true);
        } else if ('${dataVisualContent.isfixed}' == 'true') {
            $('#switchBtnIsFixed').bootstrapSwitch('state', true, true);
        } else {
            $('#switchBtnIsFixed').bootstrapSwitch('state', false, true);
        }

        $('#switchBtnIsvoiceknow').bootstrapSwitch({
            onText: '是',
            offText: '否',
            size: "small",
        });
        if ('${dataVisualContent.isvoiceknow}' == 'false') {
            $('#switchBtnIsvoiceknow').bootstrapSwitch('state', false, true);
        } else if ('${dataVisualContent.isvoiceknow}' == 'true') {
            $('#switchBtnIsvoiceknow').bootstrapSwitch('state', true, true);
        } else {
            $('#switchBtnIsvoiceknow').bootstrapSwitch('state', false, true);
        }
        
        getFileList();

    });

    function doPicturesave() {
        $("#contentsubForm").bootstrapValidator('validate');//提交验证
        if ($("#contentsubForm").data('bootstrapValidator').isValid()) {//获取验证结果，如果成功，执行下面代码
            let form = $("#contentsubForm").serialize();
            const isFullStatus = $('#switchBtnIsFull').bootstrapSwitch('state');
            if (isFullStatus) {
                form = form + "&isfull=${Isfull_True}";
            } else {
                form = form + "&isfull=${Isfull_False}";
            }
            const isFixedStatus = $('#switchBtnIsFixed').bootstrapSwitch('state');
            if (isFixedStatus) {
                form = form + "&isfixed=true";
            } else {
                form = form + "&isfixed=false";
            }
            const isvoiceknowStatus = $('#switchBtnIsvoiceknow').bootstrapSwitch('state');
            if (isvoiceknowStatus) {
                form = form + "&isvoiceknow=true";
            } else {
                form = form + "&isvoiceknow=false";
            }
            $.post(ext.contextPath + "/process/dataVisualContent/doupdate.do", form, function (data) {
                if (data.code == 1) {
                    closeModal('pictureSubModal');
                    if('${dataVisualContent.istab}'=='true'){
                        showOneContent('${dataVisualContent.id}','tab');
                    }else{
                        showOneContent('${dataVisualContent.id}');
                    }
                } else if (data.code == 0) {
                    showAlert('d', '保存失败');
                } else {
                    showAlert('d', data.res);
                }
            }, 'json');
        }
    }

    function doPictureDel() {
        swal({
            text: "您确定要删除此记录？",
            dangerMode: true,
            buttons: {
                cancel: {
                    text: "取消",
                    value: null,
                    visible: true,
                    className: "btn btn-default btn-sm",
                    closeModal: true,
                },
                confirm: {
                    text: "确定",
                    value: true,
                    visible: true,
                    className: "btn btn-danger btn-sm",
                    closeModal: true
                }
            }
        })
            .then(function (willDelete) {
                if (willDelete) {
                    $.post(ext.contextPath + '/process/dataVisualContent/dodelete.do', {
                        id: '${dataVisualContent.id}',
                        did: '${dataVisualContent.id}',
                        type: '${Type_Picture}'
                    }, function (data) {
                        var datajson = JSON.parse(data);
                        if (datajson.code == 1) {
                            closeModal('pictureSubModal');
                            $('#${dataVisualContent.id}').remove();
                        } else {
                            showAlert('d', '删除失败', 'mainAlertdiv');
                        }
                    });

                }
            });
    }

</script>
<div class="modal fade" id="pictureSubModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">编辑</h4>
            </div>

            <div id="alertDiv"></div>

            <div class="modal-body">
                <!-- 新增界面formid强制为subForm -->
                <form class="form-horizontal" id="contentsubForm" autocomplete="off">
                    <!-- 界面提醒div强制id为alertDiv -->
                    <input type="hidden" name="id" id="id" value="${dataVisualContent.id}"/>

                    <div class="form-group">
                        <label class="col-sm-2 control-label">id</label>
                        <label class="col-sm-4 control-label">${dataVisualContent.id}</label>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 control-label">左侧距离</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="postx" name="postx" placeholder="左侧距离"
                                   value="${dataVisualContent.postx}">
                        </div>
                        <label class="col-sm-2 control-label">上侧距离</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="posty" name="posty" placeholder="上侧距离"
                                   value="${dataVisualContent.posty}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">宽度</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="width" name="width" placeholder="宽度"
                                   value="${dataVisualContent.width}">
                        </div>
                        <label class="col-sm-2 control-label">高度</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="height" name="height" placeholder="高度"
                                   value="${dataVisualContent.height}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">自适应</label>
                        <div class="col-sm-4">
                            <div class="switch" data-on="primary" data-off="info">
                                <input id="switchBtnIsFull" type="checkbox"/>
                            </div>
                        </div>
                         <label class="col-sm-2 control-label">固定组件</label>
                        <div class="col-sm-4">
                            <div class="switch" data-on="primary" data-off="info">
                                <input id="switchBtnIsFixed" type="checkbox"/>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">刷新时间</label>
                        <div class="col-sm-3">
                            <input type="text" class="form-control" id="refreshtime" name="refreshtime"
                                   placeholder="刷新时间"
                                   value="${dataVisualContent.refreshtime}">
                        </div>
                        <div class="col-sm-1">
                            <div style="line-height: 34px;text-align: center;">min</div>
                        </div>
                        <label class="col-sm-2 control-label">图层</label>
                        <div class="col-sm-4">
                            <input type="text" class="form-control" id="zIndex" name="zIndex" placeholder="图层"
                                   value="${dataVisualContent.zIndex}">
                        </div>
                    </div>
                    <div class="form-group">
                         <label class="col-sm-2 control-label">背景色</label>
                        <div class="col-sm-4">
                            <div class="input-group" id="backgroundContainer">
                                <input name="background" id="background" type="text" class="form-control"
                                       placeholder="背景色"
                                       value="${dataVisualContent.background}">
                                <div class="input-group-addon">
                                    <i></i>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">样式</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="style" name="style" placeholder="样式"
                                   value="${dataVisualContent.style}">
                        </div>
                    </div>
<%--                    <div class="form-group">--%>
<%--                        <label class="col-sm-2 control-label">语音识别</label>--%>
<%--                        <div class="col-sm-4">--%>
<%--                            <div class="switch" data-on="primary" data-off="info">--%>
<%--                                <input id="switchBtnIsvoiceknow" type="checkbox"/>--%>
<%--                            </div>--%>
<%--                        </div>--%>
<%--                        <label class="col-sm-2 control-label">识别文字</label>--%>
<%--                        <div class="col-sm-4">--%>
<%--                            <input type="text" class="form-control" id="voicetext" name="voicetext" placeholder="识别文字"--%>
<%--                                   value="${dataVisualContent.voicetext}">--%>
<%--                        </div>--%>
<%--                    </div>--%>
<%--                    <div class="form-group">--%>
<%--                        <label class="col-sm-2 control-label">启用方法</label>--%>
<%--                        <div class="col-sm-10">--%>
<%--                            <input type="text" class="form-control" id="voicemethod" name="voicemethod" placeholder="启用方法"--%>
<%--                                   value="${dataVisualContent.voicemethod}">--%>
<%--                        </div>--%>
<%--                    </div>--%>

                    <div class="form-group">
                        <div class="col-sm-2">
                            <button type="button" class="btn btn-default btn-file" onclick="fileinput()" id="btn_save">
                                <i
                                        class="fa fa-paperclip"></i>上传图片
                            </button>
                        </div>
                        <div class="col-sm-6">
                            <input type="file" name="dataVisualPictureFile" id="dataVisualPictureFile" multiple
                                   class="file-loading"/>
                        </div>

                    </div>
                </form>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
                <button type="button" class="btn" onclick="doPictureDel();">删除</button>
                <button type="button" class="btn btn-primary" onclick="doPicturesave()">保存</button>
            </div>

        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>