/** * widget searchbox 查找框 * @author luoyifan * 2018-12-01 14:00:00 */ "use strict"; (function ($) { //默认 searchbox $.extend($.fn.searchbox.defaults, { prompt: '回车搜索', icons: [{ iconCls: 'icon-clear', handler: function (e) { var $me = $(e.data.target); $me.textbox('clear').textbox('textbox').focus(); if ($me.textbox('options').widget) { widget.clear(e); } } }], searcher: function () { var opts = $(this).searchbox('options'); var option = opts.dialog || opts.widget; if (option) { widget.show(option, this); } } }); })(jQuery); var widget = { show: function (option, sender) { var $sender = $(sender); var $power = $(sender).up('power'); $power.progress(); //恢复 $sender, 设置为焦点离开之前输入的值 // var query = $sender.data().widgetTmpValue != null ? $sender.data().widgetTmpValue : $sender.searchbox('options').value; var query = $sender.searchbox('options').value != null ? $sender.searchbox('options').value : $sender.data().widgetTmpValue; $sender.textbox('setValue', query); seajs.use([option.url], function (widgetWindowOption) { //为二级弹出初始化查询数据 var onLoadData1 = option['onWidgetLoadData'] || option.bind; var onLoadData2 = option['onWidgetLoadData'] || option.other; var d = {}; var onLoadData = Object.assign(d, onLoadData1, onLoadData2); var data; if ($.type(onLoadData) === 'function') { data = onLoadData.call($sender, option); } else { var vs = onLoadData; var $grid = $sender.up('grid'); var row; if ($grid.length > 0) { //表格带回值 row = $grid.getEditRow(); } else { //窗体带回值 row = $sender.findForm().formGet(); $sender.data().widgetValue = $sender.searchbox('getValue'); } if ($.type(vs) === "string") { vs = [vs]; } data = {}; if ($.type(vs) === 'array') { //数组,直接读取 $.each(vs, function (index, name) { data[name] = row[name]; }); } else { //对象调用, 建立映射关系 for (var prop in vs) { if (!vs.hasOwnProperty(prop)) continue; if (!row.hasOwnProperty(prop)) { console.log('searchbox没有属性' + prop, row); continue; } data[vs[prop]] = row[prop]; } } } if (widgetWindowOption.hasOwnProperty('onWidgetLoadData')) { widgetWindowOption.onWidgetLoadData(sender, data); } //获取到 xtype:widget 的窗口 if ($.type(widgetWindowOption) === 'function') { widgetWindowOption = widgetWindowOption($.extend(data, { sender: $sender, query: query })); } $power.progress('close'); var filterMethod = function (val) { var rows = $grid.find('tr[role="row"][id]'); if (val.length <= 0) { //显示所有行 rows.show(); return; } rows.each(function (rowIndex, row) { var finded = false; $(row).find('td').each(function (colIndex, col) { if (colIndex < 2 || finded) return; if ($.trim(col.innerText).toLowerCase().indexOf(val) >= 0) { finded = true; } }); // searchbox在可编辑列表中列表的显示和隐藏 // if (finded) { // $(row).show(); // } else { // $(row).hide(); // } }); }; var qp = option.queryParams; if ($.type(qp) === 'function') { qp = option.queryParams.apply($sender); } //============ 展示出界面 var $dlg; var $ff; var $dId = $.yvan.createId('widgetDialog'); var $tId = $.yvan.createId('textbox'); var dlgOpt = { xtype: 'dialog', id: 'efrwrt_id', dialogId: $dId, title: widgetWindowOption.title || '匿名对话框', width: widgetWindowOption.width || 900, height: widgetWindowOption.height || 400, center: { items: $.extend(true, { xtype: 'grid', queryParams: qp, onRender: function () { //默认1秒后 grid 获取焦点 $ff = $(this); setTimeout(function () { $sender.data().isWidgetOpen = true; if ($ff.length > 0) { $ff.focus(); } $sender.data().isWidgetOpen = false; }, 500); $('#' + $tId).textbox('setValue',query); }, onKeyDown: function (e) { if (e.key === 'Control' || e.key === 'Shift' || e.key === 'Alt') { return false; } if (e.keyCode === 13) { //如果按下回车键,就发出确认 var $grid = $dlg.down('grid'); var row = $grid.rowData(); if (row) { $dlg.data('confirm')(row); } } }, onDblClickRow: function (rowid, iRow, iCol, e) { //双击表格的行,发出确认 var $grid = $dlg.down('grid'); $dlg.data('confirm')($grid.rowData(rowid)); }, loadComplete: function () { var $grid = $(this); var data = $grid.getRowData(); if (data.length <= 0) { $.yvan.msg('没有符合要求的数据'); //还原 $sender.data().widgetTmpValue = $sender.data().widgetValue; $sender.textbox('setValue', $sender.data().widgetValue); //没有数据行 if (option.hasOwnProperty('autoClose') && option.autoClose) { setTimeout(function () { $dlg.window('close'); }, 0); } } else if (data.length === 1) { //唯一数据行 if (option.hasOwnProperty('autoClose') && option.autoClose) { $dlg.data('confirm')(data[0]); } } var val = $dlg.parent().item('dlgSearch').val() || ''; filterMethod($.trim(val).toLowerCase()); } }, widgetWindowOption.grid) }, onClose: function () { $sender.textbox('setValue', $sender.data().widgetValue); $sender.textbox('textbox').focus(); }, toolbar: [{ text: '确认', iconCls: 'fa fa-save', onClick: function () { //发出确认 var $grid = $dlg.down('grid'); var row = $grid.rowData(); if (row) { $dlg.data('confirm')(row); } } }, { text: '取消', iconCls: 'fa fa-times', onClick: function () { $dlg.window('close'); } }, { id: $tId, xtype: 'textbox', name: 'dlgSearch', prompt:option.widgetPrompt, onRender: function () { $(this).textbox('textbox').bind('input propertychange', function () { //取值过滤行 var val = $(this).val() || ''; filterMethod($.trim(val).toLowerCase()); }); } }, { text: '搜索', iconCls: 'fa fa-search', onClick: function () { var t = $('#' + $tId).textbox('getValue'); // $sender.data().widgetValue = t; // $sender.searchbox('setValue',t); var $grid = $dlg.down('grid'); $grid.reload({ queryParams: { query: t } }); } }] }; $dlg = $.yvan.showDialog(sender, dlgOpt); // 关闭当前窗口 // $dlg.dialog({ // onClose:function(){ // alert("123"); // } // }); $dlg.data({ confirm: function (row) { var successOpt = option['success'] || option.bind; if (!successOpt) { //没有配置,只写自己 if ($sender.name && row.hasOwnProperty($sender.name)) { $sender.searchbox('setValue', row[$sender.name]); $sender.data().widgetValue = row[$sender.name]; // $dlg.dialog('close'); $dlg.window('close'); return true; } } if ($.type(successOpt) === "function") { //是函数,调函数 var ret = successOpt.apply(this, arguments); $sender.data().widgetValue = $sender.searchbox('getValue'); // $dlg.dialog('close'); $dlg.window('close'); return ret; } //字符串或数组,直接调用数组 if ($.type(successOpt) === "string") { successOpt = [successOpt]; } var obj = {}; if ($.type(successOpt) === 'array') { //数组,根据名字逐个写入 $.each(successOpt, function (index, name) { obj[name] = row[name]; }); } else if ($.type(successOpt) === 'object') { //对象,根据映射关系写入 var vs = successOpt; for (var prop in vs) { if (!vs.hasOwnProperty(prop)) continue; if (!row.hasOwnProperty(vs[prop])) { console.error('弹出框没有属性' + vs[prop], row); continue; } obj[prop] = row[vs[prop]]; } } var $grid = $sender.up('grid'); if ($grid.length > 0) { //表格内编辑 $grid.setEditRow(obj); } else { //窗体编辑 $sender.findForm().form('load', obj); } $sender.data().widgetValue = $sender.searchbox('getValue'); if ($.type(option['afterConfirm']) === 'function') { option['afterConfirm'](obj); } //确认关闭 // $dlg.dialog('close'); $dlg.window('close'); } }); }); }, clear: function (e) { var $me = $(e.data.target); $me.textbox('clear').textbox('textbox').focus(); if (!$me.textbox('options').widget) return; var widget = $me.textbox('options').widget; var clear = widget.clear || widget.bind; if ($.type(clear) === "function") { widget.clear(); } if ($.type(clear) === "string") { clear = [clear]; } var obj = {}; var vs = clear; if ($.type(vs) === 'array') { //数组清空 $.each(vs, function (index, name) { obj[name] = ''; }); } else { //对象,按名字清空 for (var prop in vs) { if (!vs.hasOwnProperty(prop)) continue; obj[prop] = ''; } } $me.data().widgetValue = $me.searchbox('getValue'); var $grid = $me.up('grid'); if ($grid.length > 0) { //表格内编辑 $grid.setEditRow(obj); } else { //窗体编辑 $me.findForm().form('load', obj); } } };