formbuilder.js 64 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086
  1. var s4 = new SM4Util();
  2. var get_AccessToken = localStorage.getItem("GlWorkPlatform-AccessToken");
  3. var get_userId = $.cookie("GlWorkPlatform-userid");
  4. var get_formeditid = sp.getUrlName("formeditid");
  5. var get_routeinfoid = sp.getUrlName("routeinfoid");
  6. var get_routeid = sp.getUrlName("routeid");
  7. var get_id = sp.getUrlName("id");
  8. var get_pagefrom = sp.getUrlName("pagefrom");
  9. var get_leftActive = sp.getUrlName("leftActive");
  10. var get_leftActiveType = sp.getUrlName("leftActiveType");
  11. ////返回按钮事件
  12. function btnGoBack() {
  13. if (get_pagefrom == "formManageformlist") {
  14. window.location.href = "../formManage/formlist.html?leftActive=" + get_leftActive + "&leftActiveType=" + get_leftActiveType;
  15. } else {
  16. window.location.href = "viewlist.html";
  17. }
  18. };
  19. ///左侧tab点击切换
  20. $('#sptabLeftCode').settabs({
  21. event: 'click'
  22. });
  23. var get_userid = "";
  24. var get_routeid = sp.getUrlName("routeid");
  25. //////取得权限设置
  26. function getRole() {
  27. $.ajax({
  28. url: 'json/role.txt',
  29. type: 'get',
  30. data: { userid: get_userid },
  31. dataType: "json",
  32. success: function (res) {
  33. if (res.success) {
  34. if (res.message == "addAndEdit") {
  35. ///新增和编辑权限
  36. $("#btnSaveHtmlFileSpan").show();
  37. } else if (res.message == "edit") {
  38. ///编辑权限可以设计和保存
  39. $("#btnSaveHtmlFileSpan").show();
  40. } else if (res.message == "read") {
  41. ///只读权限,提交按钮删除
  42. $("#btnSaveHtmlFileSpan").remove();
  43. } else {
  44. $("#btnSaveHtmlFileSpan").remove();
  45. sp.dialog("您好,返回的权限不正确");
  46. }
  47. } else {
  48. sp.dialog("您好,未得到权限设置");
  49. }
  50. },
  51. error: function (returndata) {
  52. }
  53. });
  54. };
  55. getRole();
  56. var fbDragVars = {};////声明变量存储要拖拽的左侧字段控件
  57. var queryDataColsCustom_data = {};///声明变量存储加载到的左侧字段的数据
  58. /////主表字段构成20180826
  59. function getFbTableDataFild() {
  60. queryDataColsCustom_data = {};///声明变量存储加载到的左侧字段的数据
  61. var fbdataurl = "";///声明数据路径
  62. if (get_routeid == "23001") {
  63. fbdataurl = "json.page/fawen/fawen_huiYiJiYao_24.txt?v=" + new Date();////发文--会议纪要--word24
  64. } else if (get_routeid == "23002") {
  65. fbdataurl = "json.page/fawen/fawen_dangweizhengshiwen_17.txt?v=" + new Date();////发文--党委正式文--word17
  66. } else if (get_routeid == "23003") {
  67. fbdataurl = "json.page/fawen/fawen_dangweiqitawen_13.txt?v=" + new Date();////发文--党委其他文--word13
  68. } else if (get_routeid == "23003") {
  69. fbdataurl = "json.page/shouwen/shouwen_lingdaopishidangkouchengbandan_3.txt?v=" + new Date();////收文--领导批示党口承办单--word3
  70. } else if (get_routeid == "23003") {
  71. fbdataurl = "json.page/shouwen/shouwen_zhujianweiwenjianchengbandan_4.txt?v=" + new Date();////收文--住建委文件承办单--word4
  72. } else if (get_routeid == "23991") {
  73. fbdataurl = "json.page/spandown/spandown_test_1.txt?v=" + new Date();////为了演示
  74. } else {
  75. fbdataurl = "json/formdata.txt?v=" + new Date();////为了演示
  76. }
  77. var postData = {
  78. "formeditid": get_formeditid,
  79. "billkey":""
  80. }
  81. var postData_post = {
  82. "data": s4.encryptData_CBC(JSON.stringify(postData))
  83. }
  84. $.ajax({
  85. type: "post",
  86. //url: fbdataurl,
  87. url: apiurljs.login + "g2work/formedit/queryDataColsCustom",
  88. //data: {
  89. // "data": s4.encryptData_CBC(JSON.stringify(postData))
  90. //},
  91. data: JSON.stringify(postData_post),
  92. dataType: "json",
  93. contentType: "application/json",
  94. headers: { Authorization: "Bearer " + get_AccessToken }, ////请求头headers
  95. success: function (obj) {
  96. var res = strToJson(s4.decryptData_CBC(obj.data)).data;
  97. queryDataColsCustom_data = res;
  98. //console.log(JSON.stringify(res));
  99. //遍历主表 20180828
  100. //console.log(res);
  101. if (sp.isval(res.TableCols)) {
  102. $.each(res.TableCols, function (index, item) {
  103. //console.log(item.showtype);
  104. if (item.EKIND == "edit") {
  105. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  106. fbDragVars[varname] = "<input type='text' data-type='text' data-showtype='" + item.EKIND + "' data-code='" + item.CODE + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' />";
  107. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  108. $("#controlDivPart").append(fbleftcol);
  109. } else if (item.EKIND == "datetime") {
  110. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  111. fbDragVars[varname] = "<input type='text' data-type='date' data-showtype='" + item.EKIND + "' data-code='" + item.CODE + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' class='laydate-logo' data-format='yyyy-MM-dd' />";
  112. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  113. $("#controlDivPart").append(fbleftcol);
  114. } else if (item.EKIND == "number") {
  115. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  116. fbDragVars[varname] = "<input type='number' data-type='text' data-showtype='" + item.EKIND + "' data-code='" + item.CODE + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' />";
  117. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  118. $("#controlDivPart").append(fbleftcol);
  119. } else if (item.EKIND == "decimal") {
  120. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  121. fbDragVars[varname] = "<input type='number' data-type='text' data-showtype='" + item.EKIND + "' data-code='" + item.CODE + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' />";
  122. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  123. $("#controlDivPart").append(fbleftcol);
  124. } else if (item.EKIND == "text") {
  125. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  126. fbDragVars[varname] = "<textarea id='" + res.TableName + "_0_0_0_" + item.CODE + "' data-showtype='" + item.EKIND + "' data-code='" + item.CODE + "' rows='4'></textarea>";
  127. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  128. $("#controlDivPart").append(fbleftcol);
  129. } else if (item.EKIND == "select") {
  130. var options = "";
  131. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  132. options = "<option>选项1</option><option>选项2</option>"
  133. fbDragVars[varname] = "<select id='" + res.TableName + "_0_0_0_" + item.CODE + "' data-code='" + item.CODE + "' data-showtype='" + item.EKIND + "'>" + options + "</select>";
  134. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  135. $("#controlDivPart").append(fbleftcol);
  136. } else if (item.EKIND == "radiobox") {
  137. var control = "";
  138. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  139. control = "<label><input type='radio'/>选项1</label><label><input type='radio'/>选项2</label>"
  140. fbDragVars[varname] = "<div class='fb-radiopart sp-radio-none' data-showtype='" + item.EKIND + "' data-style='sp-radio-none' id='" + res.TableName + "_0_0_0_" + item.CODE + "' data-code='" + item.CODE + "'>" + control + "</div>";
  141. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  142. $("#controlDivPart").append(fbleftcol);
  143. } else if (item.EKIND == "checkbox") {
  144. var control = "";
  145. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  146. control = "<label><input type='checkbox'/>选项1</label><label><input type='checkbox'/>选项2</label>"
  147. fbDragVars[varname] = "<div class='fb-checkboxpart sp-checkbox-none' data-showtype='" + item.EKIND + "' data-style='sp-checkbox-none' id='" + res.TableName + "_0_0_0_" + item.CODE + "' data-code='" + item.CODE + "'>" + control + "</div>";
  148. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  149. $("#controlDivPart").append(fbleftcol);
  150. } else if (item.EKIND == "imgupload") {
  151. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  152. fbDragVars[varname] = "<span class='sp-upload' id='" + res.TableName + "_0_0_0_" + item.CODE + "' data-code='" + item.CODE + "'><img class='sp-upload-img' data-url='' alt='' style='width: 120px; height: 90px;' /><input type='file' class='sp-upload-file-img' /></span>";
  153. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  154. $("#controlDivPart").append(fbleftcol);
  155. }
  156. else if (item.EKIND == "fileupload") {
  157. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  158. fbDragVars[varname] = "<div class='sp-upload' id='" + res.TableName + "_0_0_0_" + item.CODE + "' data-code='" + item.CODE + "'><input type='button' class='sp-upload-btn-single' value='上传附件' /><input type='file' class='sp-upload-file-single' multiple='multiple' /><div class='sp-upload-tip'></div></div>";
  159. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  160. $("#controlDivPart").append(fbleftcol);
  161. } else if (item.EKIND == "popradiobox") {
  162. ///弹出窗口,单项选择器
  163. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  164. fbDragVars[varname] = "<input type='text' data-type='text' data-showtype='" + item.EKIND + "' onclick=\"spbld.layer_popradiobox_open('layer_popradiobox_" + item.CODE + "')\" data-code='" + item.CODE + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' class='spfb-input-popradiobox' readonly='readonly' data-ccode='' />";
  165. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" data-code='" + item.CODE + "' class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  166. $("#controlDivPart").append(fbleftcol);
  167. var varname_layer = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control_$010$_layer" + item.CODE;
  168. fbDragVars[varname_layer] = "<div class='sp-layer' id='layer_popradiobox_" + item.CODE + "' data-code='" + item.CODE + "' style='width:700px; max-height:500px;'>" +
  169. "<div class='sp-layer-head'><span class='sp-layer-title'>选择" + item.CNAME + "</span><span class='sp-layer-close' title='关闭' onclick='sp.layerhide()'>×</span></div>" +
  170. "<div class='sp-layer-body' style='max-height:410px; overflow-y:auto;'>"+
  171. "<div class='fb-radiopart sp-radio-blue' data-style='sp-radio-blue'>"+
  172. "<label><input type='radio' value='' />选项1</label><label><input type='radio' value='' />选项2</label>"+
  173. "</div>"+
  174. "</div>"+
  175. "<div class='sp-layer-foot'>"+
  176. "<div class='sp-page sp-mt-15'>"+
  177. "<span class='sp-btn-gray-outline sp-btn-radius' onclick='sp.layerhide()'>关 闭</span>" +
  178. "<span class='sp-btn-blue sp-btn-radius' onclick=\"spbld.layer_popradiobox_true('layer_popradiobox_" + item.CODE + "','" + res.TableName + "_0_0_0_" + item.CODE + "','" + item.CODE + "')\">确 定</span>" +
  179. "</div>"+
  180. "</div>"+
  181. "</div>";
  182. } else if (item.EKIND == "popcheckbox") {
  183. ///弹出窗口,多项选择器
  184. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  185. fbDragVars[varname] = "<textarea data-type='popcheckbox' data-showtype='" + item.EKIND + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' onclick=\"spbld.layer_popcheckbox_open('layer_popcheckbox_" + item.CODE + "')\" class='spfb-textarea-popcheckbox-1' readonly='readonly' data-code='" + item.CODE + "' data-ccode='' rows='4'></textarea>";
  186. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\" data-code='" + item.CODE + "' title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  187. $("#controlDivPart").append(fbleftcol);
  188. var varname_layer = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control_$010$_layer" + item.CODE;
  189. fbDragVars[varname_layer] = "<div class='sp-layer' id='layer_popcheckbox_" + item.CODE + "' data-code='" + item.CODE + "' style='width:700px; max-height:500px;'>" +
  190. "<div class='sp-layer-head'><span class='sp-layer-title'>选择" + item.CNAME + "</span><span class='sp-layer-close' title='关闭' onclick='sp.layerhide()'>×</span></div>" +
  191. "<div class='sp-layer-body' style='max-height:410px; overflow-y:auto;'>" +
  192. "<div class='fb-checkboxpart sp-checkbox-blue' data-style='sp-checkbox-blue'>" +
  193. "<label><input type='checkbox' value='' />选项1</label><label><input type='checkbox' value='' />选项2</label>" +
  194. "</div>" +
  195. "</div>" +
  196. "<div class='sp-layer-foot'>" +
  197. "<div class='sp-page sp-mt-15'>" +
  198. "<span class='sp-btn-gray-outline sp-btn-radius' onclick='sp.layerhide()'>关 闭</span>" +
  199. "<span class='sp-btn-blue sp-btn-radius' onclick=\"spbld.layer_popcheckbox_true('layer_popcheckbox_" + item.CODE + "','" + res.TableName + "_0_0_0_" + item.CODE + "','" + item.CODE + "')\">确 定</span>" +
  200. "</div>" +
  201. "</div>" +
  202. "</div>";
  203. } else if (item.EKIND == "optionbox") {
  204. ///意见控件
  205. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  206. fbDragVars[varname] = "<div class='sp-page' data-type='popcheckbox' data-showtype='" + item.EKIND + "' id='" + res.TableName + "_0_0_0_" + item.CODE + "' >"+
  207. "</div>"+
  208. "<span class='sp-btn-gray-outline spfb-btn-sign' onclick=\"spbld.layer_optionbox_open('" + res.TableName + "_0_0_0_" + item.CODE + "','" + res.TableName + "','" + item.CODE + "')\">签写意见</span>";
  209. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" data-code='" + item.CODE + "' class=\"draggable fb-left-col\" title=\"" + item.CNAME + "\">" + item.CNAME + "</span>";
  210. $("#controlDivPart").append(fbleftcol);
  211. var varname_layer = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control_$010$_layer_optionbox" + item.CODE;
  212. fbDragVars[varname_layer] = "<div class='sp-layer' id='layer_optionbox' style='width:600px; max-height:500px;'>" +
  213. "<div class='sp-layer-head'><span class='sp-layer-title'>签写意见</span><span class='sp-layer-close' title='关闭' onclick='sp.layerhide()'>×</span></div>" +
  214. "<div class='sp-layer-body' style='max-height:410px; overflow-y:auto;'>" +
  215. "<div class='sp-tab' id='layer_optionbox_tabs'>" +
  216. "<ul class='sp-tab-menu'>" +
  217. "<li data-index='0' class='sp-tab-current'>文字</li>" +
  218. "<li data-index='1'>手签</li>" +
  219. "</ul>" +
  220. "<div class='sp-tab-box' style='padding:10px 0; margin-left:1.5%;'>" +
  221. "<div class='sp-tab-current'>" +
  222. "<div class='sp-page'>" +
  223. "<div class='sp-col-50'>" +
  224. "<textarea id='layer_optionbox_textarea' class='sp-textarea' style='height:300px;'>" +
  225. "</textarea>" +
  226. "</div>" +
  227. "<div class='sp-col-50' style='border-left:1px solid #dedede; box-sizing:border-box;'>" +
  228. "<div class='sp-page-title'>常用语</div>" +
  229. "<div class='sp-line-gray sp-mt-5 sp-mb-5'></div>" +
  230. "<div class='sp-page' id='layer_optionbox_patterns' style='height:185px; overflow-y:auto;'>" +
  231. "<span class='sp-lh-20'>常用语1</span>" +
  232. "<span class='sp-lh-20'>常用语2</span>" +
  233. "</div>" +
  234. "<div class='sp-page-title'>新增常用语</div>" +
  235. "<div class='sp-line-gray sp-mt-5 sp-mb-5'></div>" +
  236. "<div class='sp-page' style='height:40px; overflow-y:auto;'>" +
  237. "<div class=sp-col-70><input type='text' class='sp-input' placeholder='请输入关键字' id='layer_optionbox_patterns_input' /></div>" +
  238. "<div class=sp-col-30><div class='sp-mt-5'><span class='sp-btn-blue sp-btn-md sp-btn-radius' onclick='spbld.layer_optionbox_patterns_add()'>新增</span></div></div>" +
  239. "</div>" +
  240. "</div>" +
  241. "</div>" +
  242. "</div>" +
  243. "<div class=' sp-tab-hide'>" +
  244. "<div class='spfb-optionbox-canvas' id='layer_optionbox_canvas_outpart' style='float:left; width:100%; height:274px; position:relative;'>"+
  245. "<canvas id='layer_optionbox_canvas' style='width: 100%; height: 100%;'></canvas>" +
  246. "</div>" +
  247. "<div class='sp-page sp-mt-10 sp-text-right'><span class='sp-btn-gray-outline sp-btn-radius' onclick='spbld.layer_optionbox_cnavas_clear()'>清 除</span></div>" +
  248. "</div>" +
  249. "</div>" +
  250. "</div>" +
  251. "</div>" +
  252. "<div class='sp-layer-foot'>" +
  253. "<div class='sp-page sp-mt-15'>" +
  254. "<span class='sp-btn-gray-outline sp-btn-radius' onclick='sp.layerhide()'>关 闭</span>" +
  255. "<span class='sp-btn-blue sp-btn-radius' id='layer_optionbox_true_btn' onclick='spbld.layer_optionbox_true()'>确 定</span>" +
  256. "</div>" +
  257. "</div>" +
  258. "</div>";
  259. } else if (item.EKIND == "htmltext") {
  260. ///HTML编辑控件,
  261. var varname = "fb$_10_0$main$_101_$table$" + index + "_$vars$_$010$_$control";
  262. fbDragVars[varname] = "正在开发中..";
  263. var fbleftcol = "<span draggable=\"true\" data-type='" + item.EKIND + "' id=\"controlDivPart_fbleftcol_" + index + "\" data-control=\"fb$_10_0$main$_101_$table$" + index + "\" data-controlid=\"" + res.TableName + "_0_0_0_" + item.CODE + "\" class=\"draggable fb-left-col\">" + item.CNAME + "</span>";
  264. $("#controlDivPart").append(fbleftcol);
  265. } else { return; }
  266. });
  267. ////遍历子表json20180828---删除掉了,20230306
  268. ///将此方法放在dom成功之后调用
  269. setup_draggable();////调用h5的拖拽的方法
  270. } else {
  271. sp.dialog("您好," + res.TableName + " 为空表");
  272. }
  273. },
  274. error: function (XMLHttpRequest, textStatus, errorThrown) {
  275. console.log(errorThrown);
  276. }
  277. });
  278. };
  279. /////拖拽方法,异步加载json生成左侧的字段时,将此方法放在dom成功之后
  280. function setup_draggable() {
  281. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  282. $('.draggable').on("dragstart", function (ev) {
  283. //ondragstart - 用户开始拖动元素时触发
  284. var dt = ev.originalEvent.dataTransfer;
  285. //dt.setData('crossIframeDragType', $(this).attr("data-type"));
  286. dt.setData('crossIframeDragType', $(this).attr("id"));
  287. dt.effectAllowed = 'move';
  288. iframeWindow.isCrossIFrameDragging = true;
  289. }).on("dragend", function (ev) {
  290. //ondragend - 用户完成元素拖动后触发
  291. iframeWindow.isCrossIFrameDragging = false;
  292. });
  293. /////为iframe中的td添加拖拽进入事件,然后判断isCrossIFrameDragging
  294. $(iframeWindow.document)
  295. .on("dragenter", 'td', function (ev) {
  296. //console.log('dragenter');
  297. ///说明文档-http://www.runoob.com/jsref/event-ondragstart.html
  298. ///ondragenter - 当被鼠标拖动的对象进入其容器范围内时触发此事件
  299. if (iframeWindow.isCrossIFrameDragging) {
  300. $(ev.target).addClass("hover");
  301. }
  302. })
  303. .on('dragleave', 'td', function (ev) {
  304. //console.log('dragleave');
  305. //ondragleave - 当被鼠标拖动的对象离开其容器范围内时触发此事件
  306. if (iframeWindow.isCrossIFrameDragging) {
  307. $(ev.target).removeClass('hover');
  308. //console.log();
  309. }
  310. })
  311. .on("dragover", 'td', function (ev) {
  312. //console.log('dragover');
  313. //ondragover-当某被拖动的对象在另一对象容器范围内拖动时触发此事件
  314. if (iframeWindow.isCrossIFrameDragging) {
  315. ev.preventDefault();
  316. ev.originalEvent.dataTransfer.dropEffect = 'move';
  317. }
  318. })
  319. .on("drop", 'td', function (ev) {
  320. ev.stopPropagation();
  321. //console.log('drop');
  322. $(iframeWindow.document).find('td').find("br").remove(); ///将里面含br的去掉
  323. //ondrop - 在一个拖动过程中,释放鼠标键时触发此事件
  324. var df = ev.originalEvent.dataTransfer;
  325. var get_crossIframeDragType = df.getData("crossIframeDragType");
  326. if (iframeWindow.isCrossIFrameDragging) {
  327. //$(ev.target).removeClass('hover').text("丢掉了[" + data + "],好样的,继续!");
  328. var gettd1html = $(ev.target).html();
  329. $(ev.target).html(gettd1html.replace(/<br>/g, ""));//将里面的<br>换行符去掉
  330. var get_text = $("#" + get_crossIframeDragType).text();
  331. var get_control = $("#" + get_crossIframeDragType).attr("data-control");
  332. var _varcontrol = "fbDragVars." + get_control + "_$vars$_$010$_$control";
  333. //注释这两行,其业务是当前td放置标题,下一个td放置控件---20230107
  334. //$(ev.target).removeClass('hover').append(get_text);
  335. //$(ev.target).next("td").removeClass('hover').append(eval(_varcontrol));
  336. ///修改成拖动字段只放置控件,标题未录入模式;---20230107
  337. var get_controid = $("#" + get_crossIframeDragType).attr("data-controlid");
  338. if ($(iframeWindow.document).find('body').find("#" + get_controid).length <1) {
  339. //没有重复项
  340. $(ev.target).removeClass('hover').append(eval(_varcontrol));
  341. var get_controlType = $("#" + get_crossIframeDragType).attr("data-type");
  342. if (get_controlType == "popradiobox") {
  343. var setLayerVarcontrol = "fbDragVars." + get_control + "_$vars$_$010$_$control_$010$_layer" + $("#" + get_crossIframeDragType).attr("data-code");
  344. $(iframeWindow.document).find(".sp-fb-grid").after(eval(setLayerVarcontrol));
  345. }
  346. if (get_controlType == "popcheckbox") {
  347. var setLayerVarcontrol = "fbDragVars." + get_control + "_$vars$_$010$_$control_$010$_layer" + $("#" + get_crossIframeDragType).attr("data-code");
  348. $(iframeWindow.document).find(".sp-fb-grid").after(eval(setLayerVarcontrol));
  349. }
  350. if (get_controlType == "optionbox") {
  351. var setLayerVarcontrol = "fbDragVars." + get_control + "_$vars$_$010$_$control_$010$_layer_optionbox" + $("#" + get_crossIframeDragType).attr("data-code");
  352. //if ($(iframeWindow.document).find("#layer_optionbox").length < 1) {
  353. // $(iframeWindow.document).find(".sp-fb-grid").after(eval(setLayerVarcontrol));
  354. //}
  355. $(iframeWindow.document).find("#layer_optionbox").remove();
  356. $(iframeWindow.document).find(".sp-fb-grid").after(eval(setLayerVarcontrol));
  357. }
  358. setgridControlOperate();/////控件综合设置
  359. } else {
  360. sp.dialog("您好,表单中已有 \"" + get_text + "\" 组件!");
  361. }
  362. }
  363. });
  364. }
  365. ///根据id判断加载视图中有无先前设计好的表单文件,有则加载到设计区域,无则设计区域为空*********************************************
  366. function fucGetFile() {
  367. var postData = {
  368. "ckey": "",
  369. "userid": get_userId,
  370. "formeditid": get_formeditid,
  371. "directionid": "0",
  372. "routeinfoid": "0",
  373. "routeid": "0",
  374. "id": "0"
  375. }
  376. //console.log(JSON.stringify(postData));
  377. var postData_post = {
  378. "data": s4.encryptData_CBC(JSON.stringify(postData))
  379. }
  380. //var postData_post_2 = {
  381. // "data": JSON.stringify(postData)
  382. //}
  383. //console.log(postData_post_2);
  384. $.ajax({
  385. type: "post",
  386. //url: fbdataurl,
  387. url: apiurljs.login + "g2app/abase/queryDataCustom",
  388. //data: {
  389. // "data": s4.encryptData_CBC(JSON.stringify(postData))
  390. //},
  391. data: JSON.stringify(postData_post),
  392. dataType: "json",
  393. contentType: "application/json",
  394. headers: { Authorization: "Bearer " + get_AccessToken }, ////请求头headers
  395. success: function (obj) {
  396. var res = strToJson(s4.decryptData_CBC(obj.data)).data;
  397. //console.log(res);
  398. //console.log(s4.decryptData_CBC(res.TableData));
  399. if (sp.isval(res.TableData)) {
  400. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  401. $(iframeWindow.document).find('body').html(s4.decryptData_CBC(res.TableData));
  402. setgridControlOperate();
  403. }
  404. },
  405. //请求执行异常执行的方法
  406. error: function (XMLHttpRequest, textStatus, errorThrown) {
  407. alert("您好,表单加载失败");
  408. }
  409. });
  410. }
  411. ///加载数据,整体设置*********************************************
  412. function getData() {
  413. if (get_routeid != "" && get_routeid != null && get_routeid != undefined) {
  414. fucGetFile();////判断是否有设计过的自定义表单
  415. getFbTableDataFild();///主子表字段构成
  416. } else {
  417. sp.dialog("未得到参数routeid,请确保参数正确!");
  418. location.href = "viewlist.html";
  419. }
  420. }
  421. //表单设计--点击切换事件
  422. btnStartDesign = function (obj) {
  423. $(".sp-list-type-title").removeClass("sp-list-type-active");
  424. $(obj).addClass("sp-list-type-active");
  425. $(".sp-form-builder").hide();
  426. $($(obj).attr("data-href")).show();
  427. };
  428. ////清空
  429. btn_spbldClear = function () {
  430. if (confirm("您确定要清空表单吗?")) {
  431. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  432. $(iframeWindow.document).find("body").html("");
  433. $(iframeWindow.document).find("body").text("");
  434. $(".sp-list-type-title").removeClass("sp-list-type-active");
  435. $("#btnStartDesign_tab").addClass("sp-list-type-active");
  436. $(".sp-form-builder").hide();
  437. $("#formBuilderTextareaPart").show();
  438. }
  439. }
  440. ////表单预览
  441. btnViewDesign = function (obj) {
  442. //$(".sp-list-type-title").removeClass("sp-list-type-active");
  443. //$(obj).addClass("sp-list-type-active");
  444. //$(".sp-form-builder").hide();
  445. //$($(obj).attr("data-href")).show();
  446. sp.layer($(obj).attr("data-href"));
  447. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  448. if ($(iframeWindow.document).find('table').length > 0) {
  449. $(iframeWindow.document).find('table').removeClass("mce-item-table").removeAttr("data-mce-selected").removeAttr("data-mce-style");
  450. $(iframeWindow.document).find('td').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  451. $(iframeWindow.document).find('div').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  452. $(iframeWindow.document).find(".mce-resizehandle").remove();
  453. var gettablehtml = $(iframeWindow.document).find('body').html();
  454. gettablehtml = gettablehtml.replace(/<br("[^"]*"|'[^']*'|[^'">])*>/g, "").replace(/sp-grid-control-checked/g, "");
  455. ////start---向iframe中跨域传递消息
  456. var iframeViewID = document.getElementById('iframeViewPart');
  457. var targetOrigin = '*';
  458. var func = { name: "formBuilderHtml", arg: gettablehtml };//传输name名称以及html代码
  459. iframeViewID.contentWindow.postMessage(func, targetOrigin);
  460. ////end---向iframe中跨域传递消息
  461. } else {
  462. ////start---向iframe中跨域传递消息
  463. var iframeViewID = document.getElementById('iframeViewPart');
  464. var targetOrigin = '*';
  465. var func = { name: "formBuilderHtml", arg: 0 };//传输name名称以及html代码
  466. iframeViewID.contentWindow.postMessage(func, targetOrigin);
  467. ////end---向iframe中跨域传递消息
  468. }
  469. };
  470. ///表单源码
  471. btnViewCode = function (obj) {
  472. $(".sp-list-type-title").removeClass("sp-list-type-active");
  473. $(obj).addClass("sp-list-type-active");
  474. $(".sp-form-builder").hide();
  475. $($(obj).attr("data-href")).show();
  476. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  477. if ($(iframeWindow.document).find('table').length > 0 || $(iframeWindow.document).find('div').length > 0) {
  478. $(iframeWindow.document).find('table').removeClass("mce-item-table").removeAttr("data-mce-selected").removeAttr("data-mce-style");
  479. //$(iframeWindow.document).find('table').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  480. $(iframeWindow.document).find('td').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  481. $(iframeWindow.document).find('div').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  482. $(iframeWindow.document).find(".mce-resizehandle").remove();
  483. var gettablehtml = $(iframeWindow.document).find('body').html();
  484. //gettablehtml = gettablehtml.toString().replace(/<table("[^"]*"|'[^']*'|[^'">])*>/g, '<table class="sp-fb-grid">');
  485. gettablehtml = gettablehtml.replace(/<br("[^"]*"|'[^']*'|[^'">])*>/g, "").replace(/sp-grid-control-checked/g, "").replace(/\<\/textarea\>/g, "<!--textarea-->");
  486. //gettablehtml = gettablehtml.replace(/sp-grid-control-checked/g, "");///替换选中的class
  487. //gettablehtml = gettablehtml.replace(/\<\/textarea\>/g, "<!--textarea-->");///替换选中的class
  488. //gettablehtml = gettablehtml.replace(/data\-click\=('|")laydate('|")/g, "onclick='laydate()'");///替换选中的时间点击事件
  489. //console.log(gettablehtml);
  490. var gettablehtml2 = "<textarea class='sp-textarea' id='formBuilderCodeTextarea' name='code' style='min-height:400px;'>" + gettablehtml + "</textarea>";
  491. $($(obj).attr("data-href")).html(html_beautify(gettablehtml2));
  492. var editor_two = CodeMirror.fromTextArea(document.getElementById("formBuilderCodeTextarea"), {
  493. lineNumbers: true,
  494. matchBrackets: true,
  495. styleActiveLine: true,
  496. //matchBrackets: true, // 括号匹配
  497. //mode: "htmlmixed" ///html混合模式
  498. //theme: "ambiance"
  499. })
  500. sp.fitHeight(".CodeMirror", 60);
  501. ////20230523--zyg
  502. editor_two.on("change", function () {
  503. //事件触发后执行事件 alert("change")
  504. var get_editor_val = editor_two.getValue();///获取编辑器内容
  505. if (get_editor_val.indexOf(" <!--textarea-->") != -1) {
  506. ///此处原因是 前面将</textarea>结尾符号,编译为<!--textarea-->; 因而需要再次将其替换过来
  507. get_editor_val = get_editor_val.toString().replace(/<!--textarea-->/g, " </textarea>");
  508. }
  509. //console.log(get_editor_val);
  510. $(iframeWindow.document).find("body").html("");
  511. $(iframeWindow.document).find("body").text("");
  512. $(iframeWindow.document).find("body").html(get_editor_val);
  513. });
  514. } else {
  515. var tip = "<div class='sp-table-tip' style='margin-top:-10px;'>您好,暂无表单源码</div>";
  516. $($(obj).attr("data-href")).html(tip);
  517. }
  518. };
  519. /////保存表单
  520. function btnSaveHtmlFile() {
  521. if (confirm("您好,您确定要保存此表单吗?")) {
  522. sp.dialog("正在保存..")
  523. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  524. if ($(iframeWindow.document).find('table').length > 0) {
  525. $(iframeWindow.document).find('table').removeClass("mce-item-table").removeAttr("data-mce-selected").removeAttr("data-mce-style");
  526. //$(iframeWindow.document).find('table').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  527. $(iframeWindow.document).find('td').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  528. $(iframeWindow.document).find('div').removeAttr("data-mce-selected").removeAttr("data-mce-style");
  529. $(iframeWindow.document).find(".mce-resizehandle").remove();
  530. var gettablehtml = $(iframeWindow.document).find('body').html();
  531. gettablehtml = gettablehtml.replace(/<br("[^"]*"|'[^']*'|[^'">])*>/g, "").replace(/sp-grid-control-checked/g, "");///替换br
  532. ///20230306编写,获取设计表单中已使用的左侧字段
  533. var set_hascontrol_tablecols = [];
  534. if (sp.isval(queryDataColsCustom_data.TableCols)) {
  535. $.each(queryDataColsCustom_data.TableCols, function (index2, item2) {
  536. var set_hascontol = queryDataColsCustom_data.TableName + "_0_0_0_" + item2.CODE;
  537. if ($(iframeWindow.document).find('body').find("#" + set_hascontol).length > 0) {
  538. set_hascontrol_tablecols.push(item2);
  539. }
  540. });
  541. } else {
  542. sp.dialog("您好," + queryDataColsCustom_data.TableName + " 为空表");
  543. }
  544. if (sp.isval(set_hascontrol_tablecols)) {
  545. ///判断是否为空表单,不是空表单时可以保存,
  546. //调用方法生成表单html文件
  547. var postData = {
  548. "formeditid": get_formeditid,
  549. "routeinfoid": "0",
  550. "routeid": "0",
  551. "id": "0",
  552. "tabledata": s4.encryptData_CBC(gettablehtml),
  553. "data": set_hascontrol_tablecols
  554. }
  555. var postData_post = {
  556. "data": s4.encryptData_CBC(JSON.stringify(postData))
  557. }
  558. //var postData_post_2 = {
  559. // "data": JSON.stringify(postData)
  560. //}
  561. //console.log(JSON.stringify(postData_post_2));
  562. $.ajax({
  563. type: "post",
  564. //url: fbdataurl,
  565. url: apiurljs.login + "/g2app/abase/saveDataCustom",
  566. //data: {
  567. // "data": s4.encryptData_CBC(JSON.stringify(postData))
  568. //},
  569. data: JSON.stringify(postData_post),
  570. dataType: "json",
  571. contentType: "application/json",
  572. headers: { Authorization: "Bearer " + get_AccessToken }, ////请求头headers
  573. success: function (result) {
  574. var res = strToJson(s4.decryptData_CBC(result.data)); //静态文件路径
  575. console.log(res);
  576. if (res.success) {
  577. fucGetFile();///再次加载
  578. sp.dialoghide();
  579. sp.dialog("您好,表单文件保存成功");
  580. }
  581. },
  582. //请求执行异常执行的方法
  583. error: function (XMLHttpRequest, textStatus, errorThrown) {
  584. sp.dialog("您好,表单文件生成失败");
  585. }
  586. });
  587. } else {
  588. sp.dialog("您好,当前为空表单,先设计表单!");
  589. }
  590. }
  591. else {
  592. sp.dialog("你好,暂无表单设计");
  593. }
  594. }
  595. else {
  596. return;
  597. }
  598. }
  599. ////*******设置点击控件后选中操作及右侧弹出设置区域*********************************************************************************************************
  600. function clearControlChecked(obj) {
  601. ///清除表格设计中的控件选中操作--
  602. obj.find("input").removeClass("sp-grid-control-checked"); ///文本框去掉选中样式
  603. obj.find("textarea").removeClass("sp-grid-control-checked");///多行文本框去掉选中样式
  604. obj.find(".fb-radiopart").removeClass("sp-grid-control-checked");//单选区域去掉选中样式
  605. obj.find(".fb-checkboxpart").removeClass("sp-grid-control-checked");//多选区域去掉选中样式
  606. obj.find(".sp-upload-img").removeClass("sp-grid-control-checked");//上传图片设置宽高区域
  607. obj.find("select").removeClass("sp-grid-control-checked");//下拉框去掉选中样式
  608. }
  609. function setgridControlOperate() {
  610. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  611. $(iframeWindow.document).find("input[data-type='text']").each(function () {
  612. /////文本框点击
  613. $(this).click(function () {
  614. //clearControlChecked($(iframeWindow.document));
  615. clearControlChecked($(iframeWindow.document));
  616. operate_textControl(this);
  617. });
  618. });
  619. $(iframeWindow.document).find("textarea").each(function () {
  620. /////多选框点击
  621. $(this).click(function () {
  622. clearControlChecked($(iframeWindow.document));
  623. operate_textControl(this);
  624. });
  625. });
  626. $(iframeWindow.document).find("input[data-type='date']").each(function () {
  627. /////日期框点击
  628. $(this).click(function () {
  629. clearControlChecked($(iframeWindow.document));
  630. $(".fb-textbox-part").hide();
  631. $(".fb-checkbox-part").hide();
  632. $(".fb-radio-part").hide();
  633. $(".fb-upload-img").hide(); //图片上传设置宽高区域
  634. $(".fb-dateset-part").show();
  635. $(".fb-setStyle-part").show();///设置补充样式
  636. $(this).addClass("sp-grid-control-checked");
  637. ///获取其style中的补充样式 -- 补充样式
  638. $("#trea_setClassBuChong").val($(this).attr("style")).attr("data-setid", $(this).attr("id"));
  639. ////为删除按钮赋值点中的控件的id--20230114
  640. $("#btn_delControl").attr("data-setid", $(this).attr("id"));
  641. var getformat = $(this).attr("data-format"); ///取得其验证格式
  642. $("#fbdatesetspanpart .sp-checkbox-tabs").removeClass("sp-checkbox-tabs-active")
  643. if (getformat != "" && getformat != null && getformat != undefined) {
  644. $("#fbdatesetspanpart span[data-value='" + getformat + "']").addClass("sp-checkbox-tabs-active");
  645. } else {
  646. $("#fbdatesetspanpart span[data-value='yyyy-MM-dd']").addClass("sp-checkbox-tabs-active");
  647. $(this).attr("data-format", 'yyyy-MM-dd');
  648. };
  649. ////判断其是否含有必填,含有则加上选中不含有则去掉选中
  650. if ($(this).hasClass("sp-required-date")) {
  651. $("#btnDateSetRequire").attr("checked", true).parent("label").addClass("chb-blue-checked");
  652. } else {
  653. $("#btnDateSetRequire").removeAttr("checked").parent("label").removeClass("chb-blue-checked");
  654. }
  655. });
  656. });
  657. ////单选区域
  658. $(iframeWindow.document).find(".fb-radiopart").each(function () {
  659. $(this).click(function () {
  660. clearControlChecked($(iframeWindow.document));
  661. $(".fb-textbox-part").hide();
  662. $(".fb-checkbox-part").hide();
  663. $(".fb-dateset-part").hide(); ///日期区域
  664. $(".fb-upload-img").hide(); //图片上传设置宽高区域
  665. $(".fb-radio-part").show();
  666. $(".fb-setStyle-part").show();///设置补充样式
  667. $(this).addClass("sp-grid-control-checked");
  668. ///获取其style中的补充样式 -- 补充样式
  669. $("#trea_setClassBuChong").val($(this).attr("style")).attr("data-setid", $(this).attr("id"));
  670. ////为删除按钮赋值点中的控件的id--20230114
  671. $("#btn_delControl").attr("data-setid", $(this).attr("id"));
  672. var get_style = $(this).attr("data-style"); ///取得其风格类别
  673. if (get_style != "" && get_style != null && get_style != undefined && get_style != "sp-radio-none") {
  674. $("#chb_selectRadioStyle").attr("checked", true).parent("label").addClass("chb-blue-checked");
  675. $("#selectRadioStylePart").show();
  676. $(".fb-radio-part select").val(get_style);
  677. } else {
  678. $("#chb_selectRadioStyle").removeAttr("checked").parent("label").removeClass("chb-blue-checked");
  679. $("#selectRadioStylePart").hide();
  680. $(".fb-radio-part select").val("sp-radio-none");
  681. }
  682. });
  683. });
  684. ////多选区域
  685. $(iframeWindow.document).find(".fb-checkboxpart").each(function () {
  686. $(this).click(function () {
  687. clearControlChecked($(iframeWindow.document));
  688. $(".fb-textbox-part").hide();
  689. $(".fb-radio-part").hide();
  690. $(".fb-dateset-part").hide(); ///日期区域
  691. $(".fb-upload-img").hide(); //图片上传设置宽高区域
  692. $(".fb-checkbox-part").show();
  693. $(".fb-setStyle-part").show();///设置补充样式
  694. $(this).addClass("sp-grid-control-checked");
  695. ///获取其style中的补充样式 -- 补充样式
  696. $("#trea_setClassBuChong").val($(this).attr("style")).attr("data-setid", $(this).attr("id"));
  697. ////为删除按钮赋值点中的控件的id--20230114
  698. $("#btn_delControl").attr("data-setid", $(this).attr("id"));
  699. var get_style = $(this).attr("data-style"); ///取得其风格类别
  700. if (get_style != "" && get_style != null && get_style != undefined && get_style != "sp-checkbox-none") {
  701. $("#chb_selectCheckboxStyle").attr("checked", true).parent("label").addClass("chb-blue-checked");
  702. $("#selectCheckboxStylePart").show();
  703. $(".fb-checkbox-part select").val(get_style);
  704. } else {
  705. $("#chb_selectCheckboxStyle").removeAttr("checked").parent("label").removeClass("chb-blue-checked");
  706. $("#selectCheckboxStylePart").hide();
  707. $(".fb-checkbox-part select").val("sp-checkbox-none");
  708. }
  709. });
  710. });
  711. /////上传图片区域
  712. $(iframeWindow.document).find(".sp-upload-img").each(function () {
  713. $(this).click(function () {
  714. clearControlChecked($(iframeWindow.document));
  715. $(".fb-textbox-part").hide();
  716. $(".fb-radio-part").hide();
  717. $(".fb-dateset-part").hide(); ///日期区域
  718. $(".fb-checkbox-part").hide();
  719. $(".fb-upload-img").show(); //图片上传设置宽高区域
  720. $(".fb-setStyle-part").show();///设置补充样式
  721. $(this).addClass("sp-grid-control-checked");
  722. ///获取其style中的补充样式 -- 补充样式
  723. $("#trea_setClassBuChong").val($(this).attr("style")).attr("data-setid", $(this).attr("id"));
  724. ////为删除按钮赋值点中的控件的id--20230114
  725. $("#btn_delControl").attr("data-setid", $(this).parent().attr("id"));
  726. var get_width = $(this).outerWidth();
  727. var get_height = $(this).outerHeight();
  728. $("#fbUploadImgWidth").val(get_width);
  729. $("#fbUploadImgHeight").val(get_height);
  730. });
  731. });
  732. /////下拉框点击--20230110
  733. $(iframeWindow.document).find("select").each(function () {
  734. $(this).click(function () {
  735. clearControlChecked($(iframeWindow.document));
  736. $(".fb-textbox-part").hide();
  737. $(".fb-checkbox-part").hide();
  738. $(".fb-radio-part").hide();
  739. $(".fb-upload-img").hide(); //图片上传设置宽高区域
  740. $(".fb-dateset-part").hide();
  741. $(".fb-setStyle-part").show();///设置补充样式
  742. $(this).addClass("sp-grid-control-checked");
  743. ///获取其style中的补充样式 -- 补充样式
  744. $("#trea_setClassBuChong").val($(this).attr("style")).attr("data-setid", $(this).attr("id"));
  745. ////为删除按钮赋值点中的控件的id--20230114
  746. $("#btn_delControl").attr("data-setid", $(this).attr("id"));
  747. });
  748. });
  749. };
  750. ///表格设计中输入框控件选中操作
  751. function operate_textControl(obj) {
  752. $(".fb-checkbox-part").hide();
  753. $(".fb-radio-part").hide();
  754. $(".fb-dateset-part").hide(); ///日期区域
  755. $(".fb-upload-img").hide(); //图片上传设置宽高区域
  756. $(".fb-textbox-part").show();
  757. $(".fb-setStyle-part").show();///设置补充样式
  758. $(obj).addClass("sp-grid-control-checked").focus();
  759. ///判断其含有必填,若有则右侧进行选中,无则去掉选种
  760. if ($(obj).hasClass("sp-required")) {
  761. $("#fucbtnRequire").attr("checked", true).parent("label").addClass("chb-blue-checked");
  762. } else {
  763. $("#fucbtnRequire").removeAttr("checked").parent("label").removeClass("chb-blue-checked");
  764. }
  765. ///判断其是否含有正则验证
  766. var get_regdata = $(obj).attr("data-reg"); ///取得新加的判断正则验证的属性
  767. if (get_regdata != "" && get_regdata != null && get_regdata != undefined) {
  768. ///含有正则验证,则赋值选中
  769. $("#funbtnuseRegular").attr("checked", true).parent("label").addClass("chb-blue-checked");
  770. $("#regularSelectPart").show();
  771. $("#regularSelectPart select").val(get_regdata);
  772. } else {
  773. ////不含验证则取消选中
  774. $("#funbtnuseRegular").removeAttr("checked").parent("label").removeClass("chb-blue-checked");
  775. $("#regularSelectPart").hide();
  776. $("#regularSelectPart select").val("0");
  777. }
  778. ///获取其style中的补充样式 --数值
  779. $("#trea_setClassBuChong").val($(obj).attr("style")).attr("data-setid", $(obj).attr("id"));
  780. ////为删除按钮赋值点中的控件的id--20230114
  781. $("#btn_delControl").attr("data-setid", $(obj).attr("id"));
  782. };
  783. ////补充样式改完之后点击确定进行保存--20230110
  784. function btn_trea_setClassBuChong_submit() {
  785. $("#btn_trea_setClassBuChong_submit").on("click", function () {
  786. var get_set_control_id = $("#trea_setClassBuChong").attr("data-setid");
  787. var get_trea_setClassBuChong_val=$("#trea_setClassBuChong").val();
  788. if (sp.isval(get_set_control_id)) {
  789. ///有需要设置的控件id
  790. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  791. $(iframeWindow.document).find("#" + get_set_control_id).attr("style", get_trea_setClassBuChong_val);
  792. }
  793. });
  794. }
  795. btn_trea_setClassBuChong_submit();
  796. /////删除图标按钮--操作事件--20230110
  797. function btn_delControl() {
  798. $("#btn_delControl").on("click", function () {
  799. var get_set_control_id = $("#btn_delControl").attr("data-setid");
  800. if (sp.isval(get_set_control_id)) {
  801. ///有需要设置的控件id
  802. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  803. if ($(iframeWindow.document).find("#" + get_set_control_id).attr("data-showtype") == "popradiobox") {
  804. ///类型为单项选择器,就将下面的layer弹出层删除掉
  805. var get_showcode = $(iframeWindow.document).find("#" + get_set_control_id).attr("data-code");
  806. $(iframeWindow.document).find("#layer_popradiobox_" + get_showcode).remove();
  807. console.log("#layer_popradiobox_" + get_showcode);
  808. }
  809. $(iframeWindow.document).find("#" + get_set_control_id).remove();
  810. $("#btn_delControl").attr("data-setid","");
  811. } else {
  812. sp.dialog("未找到元素控件");
  813. }
  814. });
  815. };
  816. btn_delControl();
  817. ///表单主题色调2022-12-25
  818. function setRedTheme() {
  819. $("#chb_selectRedTheme").on("click", function () {
  820. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  821. if ($(iframeWindow.document).find(".sp-fb-grid").length < 1 && $(iframeWindow.document).find("p").length < 1 && $(iframeWindow.document).find("h1").length < 1 && $(iframeWindow.document).find("h2").length < 1 && $(iframeWindow.document).find("h3").length < 1) {
  822. sp.dialog("你好,未查询到表单, 无法设置表单主题色调");
  823. } else {
  824. if ($(this).hasClass("sp-checkbox-tabs-active")) {
  825. $(this).removeClass("sp-checkbox-tabs-active");
  826. $(iframeWindow.document).find(".sp-fb-grid").removeClass("sp-fb-grid-red");
  827. $(iframeWindow.document).find("p").removeClass("sp-fb-red");
  828. $(iframeWindow.document).find("h1").removeClass("sp-fb-red");
  829. $(iframeWindow.document).find("h2").removeClass("sp-fb-red");
  830. $(iframeWindow.document).find("h3").removeClass("sp-fb-red");
  831. } else {
  832. $(this).addClass("sp-checkbox-tabs-active");
  833. $(iframeWindow.document).find(".sp-fb-grid").removeClass("sp-fb-grid-red").addClass("sp-fb-grid-red");
  834. $(iframeWindow.document).find("p").removeClass("sp-fb-red").addClass("sp-fb-red");
  835. $(iframeWindow.document).find("h1").removeClass("sp-fb-red").addClass("sp-fb-red");
  836. $(iframeWindow.document).find("h2").removeClass("sp-fb-red").addClass("sp-fb-red");
  837. $(iframeWindow.document).find("h3").removeClass("sp-fb-red").addClass("sp-fb-red");
  838. }
  839. }
  840. });
  841. ///无外层边框
  842. $("#chb_selectRedTheme_noneOutLine").on("click", function () {
  843. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  844. if ($(iframeWindow.document).find(".sp-fb-grid").length < 1 ) {
  845. sp.dialog("你好,未查询到表单, 无法设置表单");
  846. } else {
  847. if ($(this).hasClass("sp-checkbox-tabs-active")) {
  848. $(this).removeClass("sp-checkbox-tabs-active");
  849. $(iframeWindow.document).find(".sp-fb-grid").removeClass("sp-fb-grid-noneOutLine");
  850. } else {
  851. $(this).addClass("sp-checkbox-tabs-active");
  852. $(iframeWindow.document).find(".sp-fb-grid").removeClass("sp-fb-grid-noneOutLine").addClass("sp-fb-grid-noneOutLine");
  853. }
  854. }
  855. });
  856. };
  857. setRedTheme();
  858. ////必填项设置---文本框、多选框的
  859. $("#fucbtnRequire").click(function () {
  860. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  861. if ($(this).parent("label").hasClass("chb-blue-checked")) {
  862. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass("sp-required");
  863. } else {
  864. $(iframeWindow.document).find(".sp-grid-control-checked").addClass("sp-required");
  865. }
  866. });
  867. ////必填项设置---时间控件的
  868. $("#btnDateSetRequire").click(function () {
  869. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  870. if ($(this).parent("label").hasClass("chb-blue-checked")) {
  871. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass("sp-required-date").addClass("laydate-logo");
  872. } else {
  873. $(iframeWindow.document).find(".sp-grid-control-checked").addClass("sp-required-date").removeClass("laydate-logo");
  874. }
  875. });
  876. ////使用正则校验按钮,然后展开下方的select区域
  877. $("#funbtnuseRegular").click(function () {
  878. if ($(this).parent("label").hasClass("chb-blue-checked")) {
  879. $("#regularSelectPart").hide();
  880. } else {
  881. $("#regularSelectPart").show();
  882. }
  883. });
  884. ////含有正则验证的select
  885. $("#regularSelectPart select").change(function () {
  886. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  887. if ($(this).parent("label").hasClass("chb-blue-checked")) {
  888. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass("sp-required");
  889. } else {
  890. $(iframeWindow.document).find(".sp-grid-control-checked").addClass("sp-required");
  891. }
  892. var getval = $(this).val(); ///得到select中的value值
  893. var get_regdata = $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-reg"); ///取得新加的判断正则验证的属性
  894. if (getval != 0) {
  895. if (get_regdata != "" && get_regdata != null && get_regdata != undefined) {
  896. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass(get_regdata);
  897. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-reg", getval).addClass(getval);///加上新属性data-reg
  898. } else {
  899. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-reg", getval).addClass(getval);
  900. }
  901. } else {
  902. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass(get_regdata).removeAttr("data-reg");
  903. }
  904. });
  905. ///单选风格select
  906. $(".fb-radio-part select").change(function () {
  907. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  908. var getval = $(this).val(); ///得到select中的value值
  909. var get_style = $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-style"); ///取得风格类型
  910. if (get_style != "" && get_style != null && get_style != undefined) {
  911. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass(get_style);
  912. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-style", getval).addClass(getval);///加上新属性data-style
  913. } else {
  914. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-style", getval).addClass(getval);
  915. }
  916. });
  917. $("#chb_selectRadioStyle").click(function () {
  918. if ($(this).parent("label").hasClass("chb-blue-checked")) {
  919. $("#selectRadioStylePart").hide();
  920. } else {
  921. $("#selectRadioStylePart").show();
  922. }
  923. });
  924. ////---end
  925. ///多选风格select---start
  926. $(".fb-checkbox-part select").change(function () {
  927. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  928. var getval = $(this).val(); ///得到select中的value值
  929. var get_style = $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-style"); ///取得风格类型
  930. if (get_style != "" && get_style != null && get_style != undefined) {
  931. $(iframeWindow.document).find(".sp-grid-control-checked").removeClass(get_style);
  932. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-style", getval).addClass(getval);///加上新属性data-style
  933. } else {
  934. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-style", getval).addClass(getval);
  935. }
  936. });
  937. $("#chb_selectCheckboxStyle").click(function () {
  938. if ($(this).parent("label").hasClass("chb-blue-checked")) {
  939. $("#selectCheckboxStylePart").hide();
  940. } else {
  941. $("#selectCheckboxStylePart").show();
  942. }
  943. });
  944. ////---end
  945. ////start--时间日期格式化选中
  946. $("#fbdatesetspanpart .sp-checkbox-tabs").each(function () {
  947. $(this).click(function () {
  948. $(this).addClass("sp-checkbox-tabs-active").siblings().removeClass("sp-checkbox-tabs-active");
  949. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  950. var getval = $(this).attr("data-value");
  951. $(iframeWindow.document).find(".sp-grid-control-checked").attr("data-format", getval);
  952. });
  953. });
  954. ////end--时间日期格式化选中
  955. ///start--图片上传控件设置宽高
  956. $("#fbUploadImgWidth").change(function () {
  957. if ($(this).val() < 60) {
  958. sp.dialog("宽度最小为60");
  959. } else if ($(this).val() > 800) {
  960. sp.dialog("宽度最大为800");
  961. } else {
  962. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  963. $(iframeWindow.document).find(".sp-grid-control-checked").css({ width: $(this).val() });
  964. $(iframeWindow.document).find(".sp-grid-control-checked").next("input[type='file']").css({ width: $(this).val() });
  965. }
  966. });
  967. $("#fbUploadImgHeight").change(function () {
  968. if ($(this).val() < 60) {
  969. sp.dialog("高度最小为60");
  970. } else if ($(this).val() > 600) {
  971. sp.dialog("高度最大为600");
  972. } else {
  973. var iframeWindow = $('#formBuilderTextarea_ifr')[0].contentWindow;
  974. $(iframeWindow.document).find(".sp-grid-control-checked").css({ height: $(this).val() });
  975. }
  976. });
  977. ///end--图片上传控件设置宽高