var logicalCode; var groupId;// 批量选择组进行编辑 var port; //解决mui 输入框失去焦点后滚动条跳至顶部bug // function inputBlurBug() { // $("input,textarea").off("blur"); // $("input,textarea").on("blur", function () { // $("body").removeClass("mui-focusin") // window.scroll(0, $('html').scrollTop() - 1) // }); // } // inputBlurBug(); // 设置值到普通的输入框 function setVal(key, para) { if (para[key] != null) { var dom = $('#' + key) // 目前只支持 input和textarea if (dom.length > 0 && (dom[0].tagName === 'INPUT' || dom[0].tagName === 'TEXTAREA')) { dom.val(para[key]); } else { dom.text(para[key]); } } } // 设置单选框 function setRadio(key, para) { if (para[key] != null) { var dom = $("[name='" + key + "'][value='" + para[key] + "']"); if (dom.length > 0) { dom[0].checked = true; } } } // switch function setSwitch(key, para) { var sDom = $('[key="' + key + '"]') var trueValue = sDom.attr("true-value"); // 后台返回的开关值很多都是数字,如果dom表明了是数字,则按数字加载; 注意:如果是字符串必须是:true-value='"isOn"'这样的形式 if (trueValue) { trueValue = JSON.parse(trueValue); } else { trueValue = true } if (para[key] != null && para[key] === trueValue) { sDom.addClass("active"); } } //获取懒加载的属性值 var QueryCacheData = null; var getDevParam = function (key, query, callback) { if (!$.isArray(key)) { key = [key] } var queryData = { logicalCode: logicalCode, groupId: groupId, key: key, } if (query && $.isPlainObject(query)) { queryData = $.extend(queryData, query) QueryCacheData = query } sendRequest({ url: "/dealer/getDeviceFunctionByKey", type: "POST", mask: "正在获取参数...", contentType: "json", data: queryData, success: function (response) { if (response.result === 1) { var payload = response.payload; for (var key in ParamKeyMap) { var type = ParamKeyMap[key]; if (type === 'switch') { setSwitch(key, payload); } else if (type === 'value') { setVal(key, payload); } else if (type === 'radio') { setRadio(key, payload); } else { setVal(key, payload);// 默认是value } } if(callback){ callback(payload) } } else { mui.toast(response.description); } } }); }; function batchConfirm(callback) { // 由于 confirm 回调参数 e是指 mui-popup-button元素,而不是子元素,所以需要加事件穿透noClick if (logicalCode instanceof Array && logicalCode.length > 1) { let btnArr = ['取消', '修改的参数', '全部参数'] mui.confirm('' + "您可以选择将所有参数设置到被选择设备,或者只将修改过的参数设置到被选择设备。请谨慎选择。", '谨慎保存', btnArr, function (e) { if (e.index === 1) { if (callback) { callback('diff') } } else if (e.index === 2) { if (callback) { callback('all') } } }); } else { callback() } } function initTitle() { logicalCode = getQueryString("logicalCode") || ""; if (logicalCode.indexOf('[') > -1) { logicalCode = JSON.parse(logicalCode) } else if (logicalCode) { logicalCode = [logicalCode] } groupId = getQueryString("groupId") || ""; if (groupId.indexOf('[') > -1) { groupId = JSON.parse(groupId) } else if (groupId) { groupId = [groupId] } port = getQueryString("port") || ""; var type = getQueryString("type");//设备类型 $("#device").html(" " + type + logicalCode + (port ? ' 端口' + port : '')); } function setDevResultShow(res) { if (res.description) { mui.alert(res.description); } else { mui.toast("操作成功"); } } // 将要合并发送的数据 var mergeSubmitData = {} var mergeSubmitOption = { prev: function () { } } var ParamKeyMap = {}; var ParamLazy = false; function initParam(option, callback, lazy) { var getDeviceParamsUrl = "/dealer/getDeviceFunction"; var level = 'device' var dialogSubmitSuccess = null if (option && (option.params || option.lazy)) { ParamKeyMap = option.params; callback = option.callback; dialogSubmitSuccess = option.dialogSubmitSuccess; lazy = option.lazy; level = option.level if (level === 'port') { getDeviceParamsUrl = "/dealer/getPortParam"; } option.getDeviceParamsUrl && (getDeviceParamsUrl = option.getDeviceParamsUrl); } else { ParamKeyMap = option;// 缓存keymap,懒加载时,用来确定数据展现方式 } initTitle(); //懒加载的属性使用不同的模式 if (lazy) { ParamLazy = lazy } else { var data = {logicalCode: logicalCode, groupId: groupId} if (level === 'port') { data.port = port } //获取 设备功能设置 sendRequest({ url: getDeviceParamsUrl, type: "POST", mask: "正在获取参数...", data: JSON.stringify(data), success: function (response) { if (response.result == 1) { var para = response.para; for (var key in ParamKeyMap) { var type = ParamKeyMap[key]; if (type === 'switch') { setSwitch(key, para); } else if (type === 'value') { setVal(key, para); } else if (type === 'radio') { setRadio(key, para); } else { setVal(key, para);// 默认是value } // 缓存一下,用于全部保存 mergeSubmitData[key] = para[key] } if (callback) { callback(response.para) } } else { mui.toast(response.description); } } }); } var mergeSubmit = $('.mergeSubmit').length > 0;// 合并发送的模式,主要用于jinneng $("form.edit-content").on("submit", function (ev) { var dialog = $(this).closest('.edit-back'); var submitPre = $(this).attr("submitPre"); var data = {}; var domList = $(this).find(".save-data"); domList.each(function () { var key = ""; var val = ""; if ($(this).attr("type") == "radio") { key = $(this).attr("name"); val = $("[name='" + key + "']:checked").val() } else { key = $(this).attr("id"); val = $("#" + key).val(); } data[key] = val; }); // 合并数据准备一起发送 if (mergeSubmit) { mergeSubmitData = $.extend(true, mergeSubmitData, data) dialog.addClass('mui-hidden'); } else { // 单独发送参数。如果发现有需要额外带的参数,都给带上,目前来说只有非合并模式用到,比如真谷多 var url = "/dealer/setDeviceFunctionParam"; if (submitPre) { var dataTemp = window[submitPre](data) if (dataTemp) { data = dataTemp } } var sendData = $.extend({"logicalCode": logicalCode, groupId: groupId}, data) if (QueryCacheData) { sendData = $.extend(sendData, QueryCacheData) } if (level === 'port') { url = "/dealer/setPortParam"; sendData.port = port } sendRequest({ url: url, type: "POST", mask: "正在设置参数...", data: JSON.stringify(sendData),// 带上逻辑编号 success: function (res) { if (res.result == 1) { // 清空窗口的附带参数 closeBoxCallback() dialog.addClass('mui-hidden'); setDevResultShow(res) if (dialogSubmitSuccess) { dialogSubmitSuccess() } } else { mui.toast(res.description); } } }); } //阻止submit表单提交的默认行为 ev.preventDefault(); }); //开关 $('.mui-table-view-cell').on('tap', '.switch', function () { var that = $(this); that.toggleClass('active'); var key = that.attr("key"); var trueValue = that.attr("true-value") || true; var falseValue = that.attr("false-value") || false; var interfaceName = that.attr("interfaceName") || "setDeviceFunction"; var confirmText = that.attr("confirmText"); var callback = that.attr("callback"); var switchFun = falseValue; if (that.hasClass("active")) { switchFun = trueValue; } var data = {}; data[key] = switchFun; function ok() { // 合并发送的模式,缓存数据 if (mergeSubmit) { mergeSubmitData = $.extend(true, mergeSubmitData, data) } else { sendRequest("/dealer/" + interfaceName, "POST", JSON.stringify($.extend({"logicalCode": logicalCode, groupId: groupId,}, data)), function (res) { if (res.result == 1) { setDevResultShow(res) if (callback) { window[callback]() } } else { that.toggleClass('active');//设置失败还原开关 mui.toast(res.description); } }); } } if (confirmText) { mui.confirm(confirmText, '温馨提示', function (e) { if (e.index === 1) { ok() } else { // 虽然语法表意上好像一样 但是测试结果 toggleClass 好像没有生效 暂时不明为什么 if (that.hasClass('active')) { that.remove("active") }else{ that.addClass("active") } // that.toggleClass('active');//取消设置还原开关 } }); } else { ok() } }); bindBtnEvent() // 合并保存所有参数模式;各个弹窗各自校验; $("#submitAll").on('click', function () { batchConfirm(function (modifyMode) { // 合并数据预处理 if (mergeSubmitOption.prev) { mergeSubmitOption.prev() } var url = "/dealer/setDeviceFunctionParam"; var data = $.extend({"logicalCode": logicalCode, groupId: groupId, modifyMode: modifyMode}, mergeSubmitData) if (level === 'port') { url = "/dealer/setPortParam"; data.port = port } sendRequest(url, "POST", JSON.stringify(data), function (res) { if (res.result == 1) { setDevResultShow(res) } else { mui.toast(res.description); } // 如果有操作记录,则直接调到设置的结果页面 if (res.payload.operationId != null) { var url = "/dealer/index.html#/device/paramsResult" var option = {operationId: res.payload.operationId} goPage(url, option); } }); }) }) // 全局一个表单,优点:用户操作方便。 缺点:一个表单装下所有参数,速度慢,如果业务复杂或是参数多就需要拆分到弹窗。 // 可以配置class = mergeSubmit ,这样switch数据就会合并到此处,可以不用submitAll按钮。 $("form.device-param-form").on("submit", function (ev) { var data = {}; var that = $(this) batchConfirm(function (modifyMode) { var validateFun = that.attr('validate') if (validateFun) { var re = window[validateFun]() if (re === false) { return false } } var domList = that.find(".save-data"); domList.each(function () { var that2 = $(this) var key = ""; var val = ""; // 主要是文本框或是单选框,switch比较特殊 if (that2.attr("type") == "radio") { key = that2.attr("name"); val = $("[name='" + key + "']:checked").val() } else { key = that2.attr("id"); val = $("#" + key).val(); } data[key] = val; }); var interfaceName = that.attr("interfaceName") || "setDeviceFunctionParam"; var interfaceBase = that.attr("interfaceBase") || "/dealer/"; // 合并数据准备一起发送,合并的主要是switch, mergeSubmitData 合并(比如配置mergeSubmit后的 switch) var sendData = $.extend(true, {"logicalCode": logicalCode, groupId: groupId,modifyMode: modifyMode}, mergeSubmitData, data) // 合并数据预处理 if (mergeSubmitOption.prev) { mergeSubmitOption.prev(sendData)// 这里直接去修改 sendData还靠谱些 } var url = interfaceBase + interfaceName if (level === 'port') { url = "/dealer/setPortParam"; sendData.port = port } sendRequest({ url: url, type: "POST", mask: "正在设置参数...", data: JSON.stringify(sendData),// 带上逻辑编号 success: function (res) { if (res.result == 1) { // 保存结果提示 setDevResultShow(res) } else { mui.toast(res.description); } } }); }) //阻止submit表单提交的默认行为 ev.preventDefault(); }); $("form.service-param-form").on("submit", function (ev) { var data = {}; var that = $(this) var validateFun = that.attr('validate') if (validateFun) { var re = window[validateFun]() if (re === false) { return false } } var domList = that.find(".save-data"); domList.each(function () { var that2 = $(this) var key = ""; var val = ""; // 主要是文本框或是单选框,switch比较特殊 if (that2.attr("type") == "radio") { key = that2.attr("name"); val = $("[name='" + key + "']:checked").val() } else { key = that2.attr("id"); val = $("#" + key).val(); } data[key] = val; }); var sendData = $.extend(true, { "logicalCode": logicalCode }, mergeSubmitData, data) // 合并数据预处理 if (mergeSubmitOption.prev) { mergeSubmitOption.prev(sendData)// 这里直接去修改 sendData还靠谱些 } var interfaceName = that.attr("interfaceName") || "device/serverSetting/set"; var interfaceBase = that.attr("interfaceBase") || "/dealer/"; var url = interfaceBase + interfaceName sendRequest({ url: url, type: "POST", mask: "正在设置服务器侧参数...", data: JSON.stringify(sendData),// 带上逻辑编号 success: function (res) { if (res.result == 1) { setDevResultShow(res) } else { mui.toast(res.description); } if (res.payload.operationId != null) { var url = "/dealer/index.html#/device/paramsResult" var option = {operationId: res.payload.operationId} goPage(url, option); } } }); ev.preventDefault(); }); } function bindBtnEvent() { //按钮 $('.dev-fun-btn').on('tap', function () { var that = $(this); var key = that.attr("key"); var callback = that.attr("callback"); var data = {logicalCode: logicalCode, groupId: groupId,}; if (!logicalCode) { alert('没有获取到逻辑编号!') } var needConfirm = true var value = this.dataset['paramValue']; var paramTips = this.dataset['paramTips']; if (paramTips == null) { paramTips = '确定继续?'; } else if (paramTips === 'false') { needConfirm = false } if (value !== undefined) { data[key] = value; } else { data[key] = true } var interfaceName = 'setDeviceFunction' if ($(this).closest('[interfaceName]').length) { interfaceName = $(this).closest('[interfaceName]').attr('interfaceName') } var url = "" if (interfaceName.includes('/')) { url = interfaceName } else { url = "/dealer/" + interfaceName } function next() { sendRequest(url, "POST", JSON.stringify(data), function (res) { if (res.result == 1) { setDevResultShow(res) setTimeout(function () { if (callback) { if (!callback.includes('(')) { window[callback](res) } else { eval(callback) } } }, 1000) } else { mui.toast(res.description); } }); } if (needConfirm) { mui.confirm(paramTips, '温馨提示', function (e) { if (e.index === 1) { next() } }); } else { next() } }); } // 某些设备有懒加载的属性,此函数清空懒加载查询的条件 function closeBoxCallback() { // 清空QueryCacheData QueryCacheData = null } //设置属性框:打开; query为一些额外的参数,比如101100的端口号 function toSetParam(_index, _lazyKey, _query) { var index = _index var lazyKey = _lazyKey var query = _query var callback = null if($.isPlainObject(_index)){ index = _index.dialogName lazyKey = _index.lazyParams query = _index.queryParams callback = _index.callback } $('#paramPanel' + index).removeClass('mui-hidden'); function goLazyLoadParam(lazyKey) { getDevParam(lazyKey, query, callback) } // 如果有传递过来,表明是懒加载 if (lazyKey) { if ($.isPlainObject(lazyKey)) { // 多个属性,传进来是Object,不是数组 var idList = [] for (var key in lazyKey) { idList.push(key) } goLazyLoadParam(idList); } else { // 单个属性 goLazyLoadParam(lazyKey); } } else if (ParamLazy) { // 如果没有传递key,但是配置了懒加载,则寻找该弹窗内的 所有输入框,找到对应的key; var keyDomList = $('#paramPanel' + index).find('.save-data') var idList = [] keyDomList.each(function () { var dom = $(this) var id = dom.attr('id') if (dom.attr('type') === "radio") { id = dom.attr('name') } // 不重复插入 if (idList.indexOf(id) === -1) { idList.push(id) } }) goLazyLoadParam(idList); } $('#paramPanel' + index).off().click(function (evt) { if ($(evt.target).closest('.edit-content').length == 0) { $('#paramPanel' + index).addClass('mui-hidden'); closeBoxCallback() } }); // 使用tap会造成事件穿透,所以用click 必须是>.edit-content>.mui-popup-buttons 否则内部vue的二层弹窗取消按钮会有问题 $('#paramPanel' + index + ' > .edit-content>.mui-popup-buttons span').off().click(function () { if ($(this).index() == 0) { //点击取消 $('#paramPanel' + index).addClass('mui-hidden'); closeBoxCallback() } else { } }); } // 去下一级的参数设置 function goNextPage(pageNo) { goPage(pageConfig[pageNo], { logicalCode: getQueryString("logicalCode"), type: getQueryString("type"), code: getQueryString("code"), }) }