require-form.js 40 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780
  1. define(['jquery', 'layui', 'upload'], function($, layui, Upload) {
  2. var form = layui.form;
  3. var Form = {
  4. config: {
  5. fieldlisttpl:'<dd class="layui-form-item rules-item"><input type="text" class="layui-input" name="{{d.name}}[{{d.index}}][key]" placeholder="键" value="{{d.key|| \'\'}}" /> <input type="text" class="layui-input" name="{{d.name}}[{{d.index}}][value]" placeholder="值" value="{{d.value|| \'\'}}" /> <button type="button" class="layui-btn layui-btn-danger btn-remove layui-btn-xs"><i class="iconfont icon-close-fill"></i></button><button type="button" class="layui-btn btn-dragsort layui-btn-xs"><i class="iconfont icon-drag-move-2-fill"></i></button></dd>'
  6. },
  7. events: {
  8. bindevent: function(layform) {
  9. },
  10. validator: function(layform, success, error, submit) {
  11. if (!layform.is("form") || layform.hasClass("form-commonsearch"))
  12. return;
  13. var submitBtn = $("[lay-submit]", layform),
  14. filter = submitBtn.attr('lay-filter');
  15. $(".layer-footer [lay-submit],.fixed-footer [lay-submit],.normal-footer [lay-submit]", layform).removeClass("disabled");
  16. //自定义验证
  17. form.verify({
  18. username: function(value, elem){
  19. if (!/^\w{3,30}$/.test(value)) {
  20. return '用户名只能由3-30位数字、字母、下划线组合';
  21. }
  22. },
  23. password: function(value, elem) {
  24. if (!/^[\S]{6,30}$/.test(value)) {
  25. return '密码长度必须在6-30位之间,不能包含空格';
  26. }
  27. }
  28. })
  29. //验证通过提交表单
  30. form.on('submit(' + filter + ')', function(data) {
  31. submitBtn.addClass("disabled");
  32. var submitResult = Form.api.submit(layform, function(data, ret) {
  33. //that.holdSubmit(false);
  34. submitBtn.removeClass("disabled");
  35. if (false === $(this).triggerHandler("success.form", [data, ret])) {
  36. return false;
  37. }
  38. if (typeof success === 'function') {
  39. if (false === success.call($(this), data, ret)) {
  40. return false;
  41. }
  42. }
  43. //提示及关闭当前窗口
  44. var msg = ret.hasOwnProperty("msg") && ret.msg !== "" ? ret.msg : '操作成功!';
  45. parent.Toastr.success(msg);
  46. parent.$(".btn-refresh").trigger("click");
  47. if (window.name) {
  48. var index = parent.Layer.getFrameIndex(window.name);
  49. parent.Layer.close(index);
  50. }
  51. return false;
  52. }, function(data, ret) {
  53. if (false === $(this).triggerHandler("error.form", [data, ret])) {
  54. return false;
  55. }
  56. submitBtn.removeClass("disabled");
  57. if (typeof error === 'function') {
  58. if (false === error.call($(this), data, ret)) {
  59. return false;
  60. }
  61. }
  62. }, submit);
  63. //如果提交失败则释放锁定
  64. if (!submitResult) {
  65. submitBtn.removeClass("disabled");
  66. }
  67. return false;
  68. })
  69. //自定义关闭按钮事件
  70. layform.on("click", ".layer-close", function () {
  71. if (window.name) {
  72. var index = parent.Layer.getFrameIndex(window.name);
  73. parent.Layer.close(index);
  74. }
  75. return false;
  76. });
  77. },
  78. faselect: function(layform) {
  79. //绑定fachoose选择附件事件
  80. if ($(".faselect,.fachoose", layform).length > 0) {
  81. $(".faselect,.fachoose", layform).off('click').on('click', function() {
  82. var that = this;
  83. var multiple = $(this).data("multiple") ? $(this).data("multiple") : false;
  84. var mimetype = $(this).data("mimetype") ? $(this).data("mimetype") : '';
  85. var admin_id = $(this).data("admin-id") ? $(this).data("admin-id") : '';
  86. var user_id = $(this).data("user-id") ? $(this).data("user-id") : '';
  87. mimetype = mimetype.replace(/\/\*/ig, '/');
  88. var url = $(this).data("url") ? $(this).data("url") : (typeof Backend !== 'undefined' ? "general.attachments/select" : "user/attachment");
  89. parent.Yzn.api.open(url + "?element_id=" + $(this).attr("id") + "&multiple=" + multiple + "&mime=" + mimetype + "&admin_id=" + admin_id + "&user_id=" + user_id, '选择', {
  90. callback: function(data) {
  91. var button = $(that);
  92. var maxcount = $(button).data("maxcount");
  93. var input_id = $(button).data("input-id") ? $(button).data("input-id") : "";
  94. maxcount = typeof maxcount !== "undefined" ? maxcount : 0;
  95. if (input_id && data.multiple) {
  96. var urlArr = [];
  97. var inputObj = $("#" + input_id);
  98. var value = $.trim(inputObj.val());
  99. if (value !== "") {
  100. urlArr.push(inputObj.val());
  101. }
  102. var nums = value === '' ? 0 : value.split(/\,/).length;
  103. var files = data.url !== "" ? data.url.split(/\,/) : [];
  104. $.each(files, function(i, j) {
  105. var url = Config.upload.fullmode ? Yzn.api.cdnurl(j, true) : j;
  106. urlArr.push(url);
  107. });
  108. if (maxcount > 0) {
  109. var remains = maxcount - nums;
  110. if (files.length > remains) {
  111. Toastr.error('你最多选择' + remains + '个文件');
  112. return false;
  113. }
  114. }
  115. var result = urlArr.join(",");
  116. inputObj.val(result).trigger("change");
  117. } else if (input_id) {
  118. var url = Config.upload.fullmode ? Yzn.api.cdnurl(data.url, true) : data.url;
  119. $("#" + input_id).val(url).trigger("change").trigger("validate");
  120. }
  121. }
  122. });
  123. return false;
  124. });
  125. }
  126. },
  127. favisible: function(layform) {
  128. if ($("[data-favisible]", layform).length == 0) {
  129. return;
  130. }
  131. var checkCondition = function(condition) {
  132. var conditionArr = condition.split(/&&/);
  133. var success = 0;
  134. var baseregex = /^([a-z0-9\_\[\]]+)([>|<|=|\!]=?)(.*)$/i,
  135. strregex = /^('|")(.*)('|")$/,
  136. regregex = /^regex:(.*)$/;
  137. var operator_result = {
  138. '>': function(a, b) { return a > b; },
  139. '>=': function(a, b) { return a >= b; },
  140. '<': function(a, b) { return a < b; },
  141. '<=': function(a, b) { return a <= b; },
  142. '==': function(a, b) { return a == b; },
  143. '!=': function(a, b) { return a != b; },
  144. 'in': function(a, b) { return b.split(/\,/).indexOf(a) > -1; },
  145. 'regex': function(a, b) {
  146. var regParts = b.match(/^\/(.*?)\/([gim]*)$/);
  147. var regexp = regParts ? new RegExp(regParts[1], regParts[2]) : new RegExp(b);
  148. return regexp.test(a);
  149. }
  150. };
  151. var $disabledElements = layform.find(':disabled').removeAttr('disabled');
  152. var dataArr = layform.serializeArray(),
  153. dataObj = {},
  154. fieldName, fieldValue;
  155. $disabledElements.attr('disabled', 'disabled');
  156. var field = layform.attr('data-field') || 'row';
  157. $(dataArr).each(function(i, field) {
  158. fieldName = field.name;
  159. fieldValue = field.value;
  160. fieldName = fieldName.substr(-2) === '[]' ? fieldName.substr(0, fieldName.length - 2) : fieldName;
  161. dataObj[fieldName] = typeof dataObj[fieldName] !== 'undefined' ? [dataObj[fieldName], fieldValue].join(',') : fieldValue;
  162. });
  163. $.each(conditionArr, function(i, item) {
  164. var basematches = baseregex.exec(item);
  165. if (basematches) {
  166. var name = basematches[1],
  167. operator = basematches[2],
  168. value = basematches[3].toString();
  169. if (operator === '=') {
  170. var strmatches = strregex.exec(value);
  171. operator = strmatches ? '==' : 'in';
  172. value = strmatches ? strmatches[2] : value;
  173. }
  174. var regmatches = regregex.exec(value);
  175. if (regmatches) {
  176. operator = 'regex';
  177. value = regmatches[1];
  178. }
  179. var chkname;
  180. if (name.match(/[\[\]]+/)) {
  181. chkname = name;
  182. } else {
  183. chkname = "row[" + name + "]";
  184. if (typeof dataObj[chkname] === 'undefined' && typeof dataObj[name] !== 'undefined') {
  185. chkname = name;
  186. }
  187. }
  188. if (typeof dataObj[chkname] === 'undefined') {
  189. return false;
  190. }
  191. var objvalue = dataObj[chkname];
  192. if ($.isArray(objvalue)) {
  193. objvalue = dataObj[chkname].join(",");
  194. }
  195. if (['>', '>=', '<', '<='].indexOf(operator) > -1) {
  196. objvalue = parseFloat(objvalue);
  197. value = parseFloat(value);
  198. }
  199. var result = operator_result[operator](objvalue, value);
  200. success += (result ? 1 : 0);
  201. }
  202. });
  203. return success === conditionArr.length;
  204. };
  205. var formEach = function() {
  206. $("[data-favisible][data-favisible!='']", layform).each(function() {
  207. var visible = $(this).data("favisible");
  208. var groupArr = visible ? visible.toString().split(/\|\|/) : [];
  209. var success = 0;
  210. $.each(groupArr, function(i, j) {
  211. if (checkCondition(j)) {
  212. success++;
  213. }
  214. });
  215. if (success > 0) {
  216. $(this).removeClass("layui-hide");
  217. } else {
  218. $(this).addClass("layui-hide");
  219. }
  220. });
  221. }
  222. layform.on("keyup change click configchange", "input,textarea,select", function() {
  223. formEach();
  224. });
  225. form.on('select', function(data) {
  226. formEach();
  227. });
  228. form.on('checkbox', function(data) {
  229. formEach();
  230. });
  231. form.on('switch', function(data) {
  232. formEach();
  233. });
  234. form.on('radio', function(data) {
  235. formEach();
  236. });
  237. layform.on('reset', function() {
  238. setTimeout(function() {
  239. formEach();
  240. }, 50);
  241. });
  242. //追加上忽略元素
  243. setTimeout(function() {
  244. form.verify({
  245. required: function(value, elem) {
  246. if ($(elem).closest('.layui-hide[data-favisible]').is(':hidden')) {
  247. return;
  248. }
  249. if (!/[\S]+/.test(value) || value === undefined || value === null) {
  250. return '必填项不能为空';
  251. }
  252. }
  253. });
  254. }, 0);
  255. $("input,textarea,select", layform).trigger("configchange");
  256. },
  257. fieldlist: function(layform) {
  258. // 绑定fieldlist组件
  259. if ($(".fieldlist", layform).length > 0) {
  260. require(['dragsort'], function(undefined) {
  261. //刷新隐藏textarea的值
  262. var refresh = function(container, obj) {
  263. var data = {};
  264. var name = container.data("name");
  265. var textarea = $("textarea[name='" + name + "']", layform);
  266. var template = container.data("template");
  267. $.each($("input,select,textarea", container).serializeArray(), function(i, j) {
  268. var reg = /\[(\w+)\]\[(\w+)\]$/g;
  269. var match = reg.exec(j.name);
  270. if (!match)
  271. return true;
  272. match[1] = "x" + parseInt(match[1]);
  273. if (typeof data[match[1]] == 'undefined') {
  274. data[match[1]] = {};
  275. }
  276. if (typeof obj != 'undefined' && $(obj.elem).attr('name') == j.name) {
  277. data[match[1]][match[2]] = obj.value;
  278. } else {
  279. data[match[1]][match[2]] = j.value;
  280. }
  281. });
  282. //使用数组保存
  283. var usearray = container.data("usearray") || false;
  284. //保留空数据
  285. var keepempty = container.data("keepempty") || false;
  286. var result = template || usearray ? [] : {};
  287. var keys = Object.keys(Object.values(data)[0] || {});
  288. var isassociative = !usearray && keys.indexOf("value") > -1 && (keys.length === 1 || (keys.length === 2 && keys.indexOf("key") > -1));
  289. if(isassociative && keys.length ===2){
  290. result = {};
  291. }
  292. $.each(data, function (i, j) {
  293. if (j) {
  294. if (isassociative) {
  295. if (keys.length === 2) {
  296. if (j.key != '' || keepempty) {
  297. result['__PLACEHOLDKEY__' + j.key] = j.value;
  298. }
  299. } else {
  300. //一维数组
  301. result.push(j.value);
  302. }
  303. } else {
  304. result.push(j);
  305. }
  306. }
  307. });
  308. textarea.val(JSON.stringify(result).replace(/__PLACEHOLDKEY__/g, ''));
  309. };
  310. //追加一行数据
  311. var append = function(container, row, initial) {
  312. var tagName = container.data("tag") || (container.is("table") ? "tr" : "dd");
  313. var index = container.data("index");
  314. var name = container.data("name");
  315. var template = container.data("template");
  316. var data = container.data();
  317. index = index ? parseInt(index) : 0;
  318. container.data("index", index + 1);
  319. row = row ? row : {};
  320. row = typeof row.key === 'undefined' || typeof row.value === 'undefined' ? {key: '', value: ''} : row;
  321. var options = container.data("fieldlist-options") || {};
  322. var vars = {index: index, name: name, data: data, options: options, key: row.key, value: row.value, row: row.value};
  323. var tpl = template ? $("#" + template).html() : Form.config.fieldlisttpl;
  324. var html = layui.laytpl(tpl).render(vars);
  325. var obj = $(html);
  326. if ((options.deleteBtn === false || options.removeBtn === false) && initial)
  327. obj.find(".btn-remove").remove();
  328. if (options.dragsortBtn === false && initial)
  329. obj.find(".btn-dragsort").remove();
  330. if ((options.readonlyKey === true || options.disableKey === true) && initial) {
  331. obj.find("input[name$='[key]']").prop("readonly", true);
  332. }
  333. obj.attr("fieldlist-item", true);
  334. obj.insertAfter($(tagName + "[fieldlist-item]", container).length > 0 ? $(tagName + "[fieldlist-item]:last", container) : $(tagName + ":first", container));
  335. form.render();
  336. if ($(".btn-append,.append", container).length > 0) {
  337. //兼容旧版本事件
  338. $(".btn-append,.append", container).trigger("fa.event.appendfieldlist", obj);
  339. } else {
  340. //新版本事件
  341. container.trigger("fa.event.appendfieldlist", obj);
  342. }
  343. return obj;
  344. };
  345. var fieldlist = $(".fieldlist", layform);
  346. //表单重置
  347. layform.on("reset", function () {
  348. setTimeout(function () {
  349. fieldlist.trigger("fa.event.refreshfieldlist");
  350. });
  351. });
  352. //监听文本框改变事件
  353. $(document).on('change keyup changed', ".fieldlist input,.fieldlist textarea,.fieldlist select", function() {
  354. var container = $(this).closest(".fieldlist");
  355. refresh(container);
  356. });
  357. //追加控制(点击按钮)
  358. fieldlist.on("click", ".btn-append,.append", function(e, row) {
  359. var container = $(this).closest(".fieldlist");
  360. append(container, row);
  361. refresh(container);
  362. });
  363. //移除控制(点击按钮)
  364. fieldlist.on("click", ".btn-remove", function() {
  365. var container = $(this).closest(".fieldlist");
  366. var tagName = container.data("tag") || (container.is("table") ? "tr" : "dd");
  367. $(this).closest(tagName).remove();
  368. refresh(container);
  369. });
  370. //追加控制(通过事件)
  371. fieldlist.on("fa.event.appendtofieldlist", function(e, row) {
  372. var container = $(this);
  373. append(container, row);
  374. refresh(container);
  375. });
  376. form.on('radio(fieldlist)', function(data) {
  377. var container = $(this).closest(".fieldlist");
  378. refresh(container, data);
  379. });
  380. form.on('select(fieldlist)', function(data) {
  381. var container = $(this).closest(".fieldlist");
  382. refresh(container, data);
  383. });
  384. //根据textarea内容重新渲染
  385. fieldlist.on("fa.event.refreshfieldlist", function() {
  386. var container = $(this);
  387. var textarea = $("textarea[name='" + container.data("name") + "']", layform);
  388. //先清空已有的数据
  389. $("[fieldlist-item]", container).remove();
  390. var json = {};
  391. try {
  392. var val = textarea.val().replace(/"(\d+)"\:/g, "\"__PLACEHOLDERKEY__$1\":");
  393. json = JSON.parse(val);
  394. } catch (e) {}
  395. $.each(json, function(i, j) {
  396. append(container, {key: i.toString().replace("__PLACEHOLDERKEY__", ""), value: j}, true);
  397. });
  398. });
  399. //拖拽排序
  400. fieldlist.each(function() {
  401. var container = $(this);
  402. var tagName = container.data("tag") || (container.is("table") ? "tr" : "dd");
  403. container.dragsort({
  404. itemSelector: tagName,
  405. dragSelector: ".btn-dragsort",
  406. dragEnd: function() {
  407. refresh(container);
  408. },
  409. placeHolderTemplate: $("<" + tagName + "/>")
  410. });
  411. if (typeof container.data("options") === 'object' && container.data("options").appendBtn === false) {
  412. $(".btn-append,.append", container).hide();
  413. }
  414. $("textarea[name='" + container.data("name") + "']", layform).on("fa.event.refreshfieldlist", function() {
  415. //兼容旧版本事件
  416. $(this).closest(".fieldlist").trigger("fa.event.refreshfieldlist");
  417. });
  418. });
  419. fieldlist.trigger("fa.event.refreshfieldlist");
  420. })
  421. }
  422. },
  423. selectpage: function(layform) {
  424. // 绑定selectpage组件
  425. if ($(".selectpage", layform).length > 0) {
  426. require(['selectpage'], function() {
  427. $('.selectpage', layform).selectPage({
  428. eAjaxSuccess: function(data) {
  429. data.list = typeof data.data !== 'undefined' ? data.data : [];
  430. data.totalRow = typeof data.count !== 'undefined' ? data.count : data.data.length;
  431. return data;
  432. }
  433. })
  434. })
  435. $(layform).on("reset", function() {
  436. setTimeout(function() {
  437. $(".selectpage", layform).each(function() {
  438. if ($(this).val()) {
  439. var selectpage = $(this).data("selectPageObject");
  440. selectpage.elem.hidden.val($(this).val());
  441. $(this).selectPageRefresh();
  442. } else {
  443. $(this).selectPageClear();
  444. }
  445. });
  446. }, 1);
  447. })
  448. }
  449. },
  450. cxselect: function(layform) {
  451. //绑定cxselect元素事件
  452. if ($("[data-toggle='cxselect']", layform).length > 0) {
  453. require(['cxselect'], function() {
  454. $.cxSelect.defaults.jsonName = 'name';
  455. $.cxSelect.defaults.jsonValue = 'value';
  456. $.cxSelect.defaults.jsonSpace = 'data';
  457. $("[data-toggle='cxselect']", layform).cxSelect();
  458. });
  459. }
  460. },
  461. citypicker: function(layform) {
  462. // 绑定城市选择组件
  463. if ($("[data-toggle='city-picker']", layform).length > 0) {
  464. require(['citypicker'], function() {
  465. $(layform).on("reset", function() {
  466. setTimeout(function() {
  467. $("[data-toggle='city-picker']", layform).citypicker('refresh');
  468. }, 1);
  469. });
  470. })
  471. }
  472. },
  473. datetimepicker: function(layform) {
  474. // 绑定时间组件
  475. if ($(".datetime", layform).length > 0) {
  476. $(".datetime", layform).each(function() {
  477. var format = $(this).attr('data-date'),
  478. type = $(this).attr('data-date-type'),
  479. range = $(this).attr('data-date-range');
  480. if (type === undefined || type === '' || type === null) {
  481. type = 'datetime';
  482. }
  483. var options = {
  484. elem: this,
  485. type: type,
  486. trigger: 'click',
  487. };
  488. if (format !== undefined && format !== '' && format !== null) {
  489. options['format'] = format;
  490. }
  491. if (range !== undefined) {
  492. if (range === null || range === '') {
  493. range = '-';
  494. }
  495. options['range'] = range;
  496. options['shortcuts'] = [{
  497. text: "今天",
  498. value: function() {
  499. var today = new Date();
  500. return [
  501. new Date(today.getFullYear(), today.getMonth(), today.getDate()),
  502. new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59)
  503. ];
  504. }
  505. },
  506. {
  507. text: "昨天",
  508. value: function() {
  509. var yesterday = new Date();
  510. yesterday.setDate(yesterday.getDate() - 1);
  511. return [
  512. new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate()),
  513. new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate(), 23, 59, 59)
  514. ];
  515. }
  516. },
  517. {
  518. text: "7天前",
  519. value: function() {
  520. var today = new Date();
  521. var sevenDaysAgo = new Date();
  522. sevenDaysAgo.setDate(today.getDate() - 7);
  523. return [
  524. new Date(sevenDaysAgo.getFullYear(), sevenDaysAgo.getMonth(), sevenDaysAgo.getDate()),
  525. new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59)
  526. ];
  527. }
  528. },
  529. {
  530. text: "本月",
  531. value: function() {
  532. var date = new Date();
  533. var year = date.getFullYear();
  534. var month = date.getMonth();
  535. return [
  536. new Date(year, month, 1),
  537. new Date(year, month + 1, 0, 23, 59, 59)
  538. ];
  539. }
  540. },
  541. {
  542. text: "上个月",
  543. value: function() {
  544. var date = new Date();
  545. var year = date.getFullYear();
  546. var month = date.getMonth();
  547. return [
  548. new Date(year, month - 1, 1),
  549. new Date(year, month, 0, 23, 59, 59)
  550. ];
  551. }
  552. }
  553. ]
  554. }
  555. layui.laydate.render(options);
  556. })
  557. }
  558. },
  559. tagsinput: function(layform) {
  560. if ($(".form-tags", layform).length > 0) {
  561. require(['tagsinput'], function() {
  562. $(".form-tags", layform).tagsInput({
  563. width: 'auto',
  564. defaultText: $(this).data('remark') || '关键词回车确认',
  565. height: '26px',
  566. })
  567. layform.on("reset", function () {
  568. setTimeout(function () {
  569. $(".form-tags", layform).resetTags();
  570. }, 0);
  571. });
  572. });
  573. }
  574. },
  575. colorpicker: function(layform) {
  576. // 绑定颜色组件
  577. if ($('.colorpicker', layform).length > 0) {
  578. $('.colorpicker', layform).each(function() {
  579. var input_id = $(this).data("input-id");
  580. var inputObj = $("#" + input_id);
  581. layui.colorpicker.render({
  582. elem: $(this),
  583. color: inputObj.val(),
  584. done: function(color) {
  585. inputObj.val(color);
  586. }
  587. });
  588. });
  589. }
  590. },
  591. cropper: function(layform) {
  592. //裁剪图片
  593. layform.off('click', '.btn-cropper').on('click', '.btn-cropper', function() {
  594. var input = $("#" + $(this).data("input-id"));
  595. var image = $(this).parent('.file-panel').prev('img').data('original');
  596. var url = image;
  597. var parentWin = (parent ? parent : window);
  598. parentWin.Yzn.api.open('general.attachments/cropper?url=' + image, '裁剪', {
  599. callback: function(data) {
  600. if (typeof data !== 'undefined') {
  601. //data URI 转换为一个 File 对象
  602. var arr = data.dataURI.split(','),
  603. mime = arr[0].match(/:(.*?);/)[1],
  604. bstr = atob(arr[1]),
  605. n = bstr.length,
  606. u8arr = new Uint8Array(n);
  607. while (n--) {
  608. u8arr[n] = bstr.charCodeAt(n);
  609. }
  610. var urlArr = url.split('.');
  611. var suffix = 'png';
  612. url = urlArr.join('');
  613. var filename = url.substr(url.lastIndexOf('/') + 1);
  614. var exp = new RegExp("\\." + suffix + "$", "i");
  615. filename = exp.test(filename) ? filename : filename + "." + suffix;
  616. var file = new File([u8arr], filename, { type: mime });
  617. Upload.api.send(file, function(data) {
  618. input.val(input.val().replace(image, data.url)).trigger("change");
  619. }, function(data) {});
  620. }
  621. },
  622. area: ["800px", "600px"],
  623. })
  624. });
  625. },
  626. xmSelect: function(layform) {
  627. // 绑定下拉框多选组件
  628. if ($('.form-selects', layform).length > 0) {
  629. require(['xm-select'], function(xmSelect) {
  630. $('.form-selects', layform).each(function() {
  631. var name = $(this).data("name");
  632. var list = Array.isArray($(this).data("list")) || typeof $(this).data("list") === "object" ? $(this).data("list") : [];
  633. var value = $(this).data("value");
  634. var newArr = [];
  635. $.each(list, function(i, j) {
  636. var vote = {};
  637. vote.value = i;
  638. vote.name = j;
  639. newArr.push(vote);
  640. })
  641. if (typeof value != 'object' && value) {
  642. value = typeof value === "number" ? [value] : value.split(',')
  643. }
  644. xmSelect.render({
  645. el: this,
  646. initValue: value,
  647. name: name,
  648. data: newArr
  649. })
  650. })
  651. })
  652. }
  653. },
  654. plupload: function(layform) {
  655. Form.events.faupload(layform);
  656. },
  657. faupload: function(layform) {
  658. //绑定上传元素事件
  659. if ($(".plupload,.faupload", layform).length > 0) {
  660. Upload.api.upload($(".plupload,.faupload", layform));
  661. }
  662. },
  663. },
  664. api: {
  665. submit: function(form, success, error, submit) {
  666. if (form.length === 0) {
  667. Toastr.error("表单未初始化完成,无法提交");
  668. return false;
  669. }
  670. if (typeof submit === 'function') {
  671. if (false === submit.call(form, success, error)) {
  672. return false;
  673. }
  674. }
  675. var type = form.attr("method") ? form.attr("method").toUpperCase() : 'POST';
  676. type = type && (type === 'GET' || type === 'POST') ? type : 'POST';
  677. url = form.attr("action");
  678. url = url ? url : location.href;
  679. //修复当存在多选项元素时提交的BUG
  680. var params = {};
  681. var multipleList = $("[name$='[]']", form);
  682. if (multipleList.length > 0) {
  683. var postFields = form.serializeArray().map(function(obj) {
  684. return $(obj).prop("name");
  685. });
  686. $.each(multipleList, function(i, j) {
  687. if (postFields.indexOf($(this).prop("name")) < 0) {
  688. params[$(this).prop("name")] = '';
  689. }
  690. });
  691. }
  692. //调用Ajax请求方法
  693. Yzn.api.ajax({
  694. type: type,
  695. url: url,
  696. data: form.serialize() + (Object.keys(params).length > 0 ? '&' + $.param(params) : ''),
  697. dataType: 'json',
  698. complete: function(xhr) {
  699. var token = xhr.getResponseHeader('__token__');
  700. if (token) {
  701. $("input[name='__token__']").val(token);
  702. }
  703. }
  704. }, function(data, ret) {
  705. //$('.form-group', form).removeClass('has-feedback has-success has-error');
  706. if (data && typeof data === 'object') {
  707. //刷新客户端token
  708. if (typeof data.token !== 'undefined') {
  709. $("input[name='__token__']").val(data.token);
  710. }
  711. //调用客户端事件
  712. if (typeof data.callback !== 'undefined' && typeof data.callback === 'function') {
  713. data.callback.call(form, data);
  714. }
  715. }
  716. if (typeof success === 'function') {
  717. if (false === success.call(form, data, ret)) {
  718. return false;
  719. }
  720. }
  721. }, function(data, ret) {
  722. if (data && typeof data === 'object' && typeof data.token !== 'undefined') {
  723. $("input[name='__token__']").val(data.token);
  724. }
  725. if (typeof error === 'function') {
  726. if (false === error.call(form, data, ret)) {
  727. return false;
  728. }
  729. }
  730. });
  731. return true;
  732. },
  733. bindevent: function(form, success, error, submit) {
  734. form = typeof form === 'object' ? form : $(form);
  735. var events = Form.events;
  736. events.bindevent(form);
  737. events.validator(form, success, error, submit);
  738. events.selectpage(form);
  739. events.faupload(form);
  740. events.faselect(form);
  741. events.fieldlist(form);
  742. events.cxselect(form);
  743. events.citypicker(form);
  744. events.datetimepicker(form);
  745. events.colorpicker(form);
  746. events.cropper(form);
  747. events.xmSelect(form);
  748. events.tagsinput(form);
  749. events.favisible(form);
  750. }
  751. },
  752. }
  753. return Form;
  754. });