You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
250 lines
7.6 KiB
Plaintext
250 lines
7.6 KiB
Plaintext
9 months ago
|
(function ($) {
|
||
|
|
/*if ("undefined" == typeof IsPopEnableSelfInput) {
|
||
|
|
IsPopEnableSelfInput = false;
|
||
|
|
} */
|
||
|
|
function onUnselect(target, record) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
opts.onUnselect.call("", record);
|
||
|
|
$("#TB_" + opts.KeyOfEn).val($(target).mtags("getText"));
|
||
|
|
}
|
||
|
|
|
||
|
|
function appendSignalNode(target, data) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
var containerSpan = $(target).find(".ccflow-input-span-container-span");
|
||
|
|
|
||
|
|
var valueField = opts.valueField;
|
||
|
|
var textField = opts.textField;
|
||
|
|
if (!contains(target, data, valueField)) {
|
||
|
|
|
||
|
|
var tag = $('<span class="ccflow-tag ccflow-label ccflow-label-primary"></span>');
|
||
|
|
tag.data(data);
|
||
|
|
tag.html(data[textField] + '<i class="fa fa-times" data-role="remove"></i>');
|
||
|
|
containerSpan.append(tag);
|
||
|
|
tag.delegate("i", "click", function (e) {
|
||
|
|
var record = $(this).parent().data();
|
||
|
|
$(this).parent().remove();
|
||
|
|
opts.onUnselect.call("", record);
|
||
|
|
$("#TB_" + opts.KeyOfEn).val($(target).mtags("getText"));
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
function append(target, datas, remove) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
var container;
|
||
|
|
if (opts.IsEnter == false)
|
||
|
|
container = $(target).find(".ccflow-input-span-container");
|
||
|
|
else
|
||
|
|
container = $(target).find(".ccflow-input-span-container-span");
|
||
|
|
if (remove) {
|
||
|
|
container.children("span").remove();
|
||
|
|
}
|
||
|
|
var valueField = opts.valueField;
|
||
|
|
var textField = opts.textField;
|
||
|
|
|
||
|
|
for (var i = 0; i < datas.length; i++) {
|
||
|
|
var data = datas[i];
|
||
|
|
if (!contains(target, data, valueField)) {
|
||
|
|
var tag = $('<span class="ccflow-tag ccflow-label ccflow-label-primary"></span>');
|
||
|
|
tag.data(data);
|
||
|
|
tag.html(data[textField] + '<i class="fa fa-times" data-role="remove"></i>');
|
||
|
|
container.append(tag);
|
||
|
|
tag.delegate("i", "click", function (e) {
|
||
|
|
var record = $(this).parent().data();
|
||
|
|
$(this).parent().remove();
|
||
|
|
opts.onUnselect.call("", record);
|
||
|
|
$("#TB_" + opts.KeyOfEn).val($(target).mtags("getText"));
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function loadData(target, datas) {
|
||
|
|
append(target, datas, true);
|
||
|
|
}
|
||
|
|
|
||
|
|
function clear(target) {
|
||
|
|
if (opts.IsEnter == false)
|
||
|
|
$(target).find(".ccflow-input-span-container span").remove();
|
||
|
|
else
|
||
|
|
$(target).find(".ccflow-input-span-container-span span").remove();
|
||
|
|
}
|
||
|
|
|
||
|
|
function setValues(target, values) {
|
||
|
|
append(target, datas);
|
||
|
|
}
|
||
|
|
|
||
|
|
function getText(target) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
var textField = opts.textField;
|
||
|
|
var text = [];
|
||
|
|
if (opts.IsEnter == false)
|
||
|
|
$(target).find(".ccflow-input-span-container span").each(function () {
|
||
|
|
text.push($(this).data()[textField]);
|
||
|
|
});
|
||
|
|
else
|
||
|
|
$(target).find(".ccflow-input-span-container-span span").each(function () {
|
||
|
|
text.push($(this).data()[textField]);
|
||
|
|
});
|
||
|
|
return text.join(",");
|
||
|
|
}
|
||
|
|
|
||
|
|
function getValue(target) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
var valueField = opts.valueField;
|
||
|
|
var text = [];
|
||
|
|
if (opts.IsEnter == false)
|
||
|
|
$(target).find(".ccflow-input-span-container span").each(function () {
|
||
|
|
text.push($(this).data()[valueField]);
|
||
|
|
});
|
||
|
|
else
|
||
|
|
$(target).find(".ccflow-input-span-container-span span").each(function () {
|
||
|
|
text.push($(this).data()[valueField]);
|
||
|
|
});
|
||
|
|
return text.join(",");
|
||
|
|
}
|
||
|
|
|
||
|
|
function getOptions(target) {
|
||
|
|
return $.data(target, "mtags").options;
|
||
|
|
}
|
||
|
|
|
||
|
|
function contains(target, data, valueField) {
|
||
|
|
var flag = false;
|
||
|
|
var opts = getOptions(target);
|
||
|
|
if (opts.IsEnter == false)
|
||
|
|
$(target).find(".ccflow-input-span-container span").each(function () {
|
||
|
|
if (data[valueField] == $(this).data()[valueField]) {
|
||
|
|
flag = true;
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
else
|
||
|
|
$(target).find(".ccflow-input-span-container-span span").each(function () {
|
||
|
|
if (data[valueField] == $(this).data()[valueField]) {
|
||
|
|
flag = true;
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return flag;
|
||
|
|
}
|
||
|
|
|
||
|
|
function create(target) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
var html = "";
|
||
|
|
if (opts.IsEnter == true) {
|
||
|
|
html += '<div style="margin-bottom:6px"><input type = "text" id = "TB_InputAuto_' + opts.KeyOfEn + '" autocomplete = "off" style = "flex-grow: 1;width: 80%;border: none;border-bottom:1px solid #ccc !important;outline: none;padding: 0;color: #666;font-size: 14px;appearance: none;height: 28px;background-color: transparent;" />';
|
||
|
|
html += '<button type="button" class="el-button" id="' + target.id + '_Button" ><span>' + opts.Title + '</span></button></div>';
|
||
|
|
}
|
||
|
|
html += '<div class="main-container" >';
|
||
|
|
if (opts.IsEnter == false) {
|
||
|
|
html += '<div class="ccflow-input-span-container" >';
|
||
|
|
html += '<div id="stuff" placeholder="请双击选择" style="display: inline; border-left: 1px solid white; width: 1px;"></div>';
|
||
|
|
} else {
|
||
|
|
html += '<div class="ccflow-input-span-container" style="display: flex;flex-wrap: wrap;border:none">';
|
||
|
|
html += '<div id="stuff" style="display: inline; border-left: 1px solid white; width: 1px;"></div>';
|
||
|
|
html += '<span class="ccflow-input-span-container-span" style="display: contents;"></span>';
|
||
|
|
|
||
|
|
}
|
||
|
|
html += '</div>';
|
||
|
|
html += '</div>';
|
||
|
|
|
||
|
|
$(target).html(html);
|
||
|
|
$("#TB_InputAuto_" + opts.KeyOfEn).on('keypress', function (event) {
|
||
|
|
//回车事件
|
||
|
|
if (event.keyCode == 13 && $("#TB_InputAuto_" + opts.KeyOfEn).val() != "") {
|
||
|
|
appendSignalNode(target, { "No": new Date().getTime(), "Name": $("#TB_InputAuto_" + opts.KeyOfEn).val() });
|
||
|
|
SaveVal_FrmEleDB(opts.FK_MapData, opts.KeyOfEn, opts.RefPKVal, new Date().getTime(), $("#TB_InputAuto_" + opts.KeyOfEn).val(), 1);
|
||
|
|
$("#TB_InputAuto_" + opts.KeyOfEn).val("");
|
||
|
|
$("#TB_" + opts.KeyOfEn).val($(target).mtags("getText"));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
$("#TB_InputAuto_" + opts.KeyOfEn).blur(function () {
|
||
|
|
if ($("#TB_InputAuto_" + opts.KeyOfEn).val() != "") {
|
||
|
|
appendSignalNode(target, { "No": new Date().getTime(), "Name": $("#TB_InputAuto_" + opts.KeyOfEn).val() });
|
||
|
|
SaveVal_FrmEleDB(opts.FK_MapData, opts.KeyOfEn, opts.RefPKVal, new Date().getTime(), $("#TB_InputAuto_" + opts.KeyOfEn).val(), 1);
|
||
|
|
$("#TB_InputAuto_" + opts.KeyOfEn).val("");
|
||
|
|
$("#TB_" + opts.KeyOfEn).val($(target).mtags("getText"));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function setSize(target) {
|
||
|
|
var opts = getOptions(target);
|
||
|
|
var t = $(target);
|
||
|
|
if (opts.fit == true) {
|
||
|
|
var p = t.parent();
|
||
|
|
opts.width = p.width();
|
||
|
|
}
|
||
|
|
var c = t.find('.main-container');
|
||
|
|
c._outerWidth(opts.width);
|
||
|
|
c._outerHeight(opts.height);
|
||
|
|
t.find("#stuff")._outerHeight(opts.height);
|
||
|
|
}
|
||
|
|
|
||
|
|
$.fn.mtags = function (options, params) {
|
||
|
|
if (typeof options == 'string') {
|
||
|
|
return $.fn.mtags.methods[options](this, params);
|
||
|
|
}
|
||
|
|
options = options || {};
|
||
|
|
return this.each(function () {
|
||
|
|
var state = $.data(this, "mtags");
|
||
|
|
if (state) {
|
||
|
|
$.extend(state.options, options);
|
||
|
|
} else {
|
||
|
|
state = $.data(this, 'mtags', {
|
||
|
|
options : $.extend({}, $.fn.mtags.defaults, $.fn.mtags.parseOptions(this), options)
|
||
|
|
});
|
||
|
|
create(this);
|
||
|
|
}
|
||
|
|
setSize(this);
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
$.fn.mtags.methods = {
|
||
|
|
setValues : function (jq, values) {
|
||
|
|
return jq.each(function () {
|
||
|
|
setValues(this, values);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
getValue : function (jq) {
|
||
|
|
return getValue(jq[0]);
|
||
|
|
},
|
||
|
|
getText : function (jq) {
|
||
|
|
return getText(jq[0]);
|
||
|
|
},
|
||
|
|
clear : function (jq) {
|
||
|
|
return jq.each(function () {
|
||
|
|
clear(this);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
loadData : function (jq, values) {
|
||
|
|
return jq.each(function () {
|
||
|
|
loadData(this, values);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
$.fn.mtags.parseOptions = function (target) {
|
||
|
|
var t = $(target);
|
||
|
|
return $.extend({}, $.parser.parseOptions(target, [ "width", "data", {
|
||
|
|
"fit" : "boolean",
|
||
|
|
"valueField" : "string",
|
||
|
|
"textField" : "string"
|
||
|
|
}]));
|
||
|
|
};
|
||
|
|
|
||
|
|
$.fn.mtags.defaults = {
|
||
|
|
"width" : "100%",
|
||
|
|
"fit": true,
|
||
|
|
"FK_MapData":"FK_MapData",
|
||
|
|
"KeyOfEn": "KeyOfEn",
|
||
|
|
"RefPKVal":"RefPKVal",
|
||
|
|
"valueField" : "No",
|
||
|
|
"textField": "Name",
|
||
|
|
"IsEnter": false,
|
||
|
|
"Title":"选择",
|
||
|
|
"onUnselect" : function (record) {
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
})(jQuery);
|