FrmBuider.cshtml 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328
  1. @{
  2. ViewBag.Title = "表单创建";
  3. Layout = "~/Views/Shared/_FlowForm.cshtml";
  4. }
  5. <script>
  6. var keyValue = request('keyValue');
  7. var postData = {};//提交数据
  8. var frmdatabase = "";
  9. var frmapp = "";
  10. $(function () {
  11. initialPage();
  12. })
  13. //初始化页面
  14. function initialPage() {
  15. $('#step-1 .panel-body').height($(window).height() - 228);
  16. $('#Description').height($(window).height() - 380);
  17. $('#step-2 .tab-content').height($(window).height() - 87);
  18. initBaseInfo();
  19. //加载导向
  20. $('#wizard').wizard().on('change', function (e, data) {
  21. var $finish = $("#btn_finish");
  22. var $next = $("#btn_next");
  23. if (data.direction == "next") {
  24. switch (data.step) {
  25. case 1:
  26. return bindingBase();
  27. break;
  28. case 2://绑定表单
  29. if (!bindingFrm()) {
  30. return false;
  31. }
  32. $finish.removeAttr('disabled');
  33. $next.attr('disabled', 'disabled');
  34. $('#btn_caogao').attr('disabled', 'disabled');
  35. break;
  36. default:
  37. break;
  38. }
  39. } else {
  40. $finish.attr('disabled', 'disabled');
  41. $next.removeAttr('disabled');
  42. $('#btn_caogao').removeAttr('disabled');
  43. }
  44. });
  45. $('input[name="isSystemTable"]').click(function () {
  46. var value = $(this).val();
  47. if (value == 0) {
  48. $('.Systemtable').hide();
  49. $('.Systemtable').find('.ui-select').removeAttr('isvalid');
  50. $('.Systemtable').find('.ui-select').removeAttr('checkexpession');
  51. }
  52. else {
  53. $('.Systemtable').show();
  54. $('.Systemtable').find('.ui-select').attr('isvalid', 'yes');
  55. $('.Systemtable').find('.ui-select').attr('checkexpession', 'NotNull');
  56. }
  57. });
  58. //获取表单
  59. if (!!keyValue) {
  60. //获取表单
  61. $.SetForm({
  62. url: "../../FlowManage/FormDesign/GetFormJson",
  63. param: { keyValue: keyValue },
  64. success: function (data) {
  65. $("#step-1").SetWebControls(data);
  66. $('#isSystemTable' + data.isSystemTable).trigger('click');
  67. if (data.isSystemTable == 1)
  68. {
  69. $("#step-1").find("#FrmDbId").trigger("change");
  70. $("#step-1").find("#FrmTable").ComboBoxSetValue(data.FrmTable);
  71. $("#step-1").find("#FrmTable").trigger("change");
  72. $("#step-1").find("#FrmTableId").ComboBoxSetValue(data.FrmTableId);
  73. }
  74. setFrmInfo(data);
  75. }
  76. });
  77. }
  78. //保存为草稿
  79. $('#btn_caogao').click(function () {
  80. if (!$('#step-1').Validform()) {
  81. return false;
  82. }
  83. var _data = $("#step-1").GetWebControls(keyValue);
  84. postData = $.extend(postData, _data);
  85. postData["EnabledMark"] = 3;
  86. var frmcotentls = frmapp.getData(true);
  87. postData.FrmContent = JSON.stringify(frmcotentls);
  88. $.SaveForm({
  89. url: "../../FlowManage/FormDesign/SaveForm?keyValue=" + keyValue,
  90. param: postData,
  91. loading: "正在保存数据...",
  92. success: function () {
  93. $.currentIframe().$("#gridTable").trigger("reloadGrid");
  94. }
  95. })
  96. });
  97. }
  98. /*=========基本配置(begin)==================================================================*/
  99. function initBaseInfo()
  100. {
  101. //性别
  102. $("#Gender").ComboBox({
  103. description: "==请选择==",
  104. });
  105. //表单类型
  106. $("#FrmType").ComboBoxTree({
  107. description: "==请选择==",
  108. height: "301px",
  109. param: { EnCode: "FormSort" },
  110. url: "../../SystemManage/DataItemDetail/GetDataItemTreeJson",
  111. allowSearch: true
  112. });
  113. //数据库选择
  114. var _FrmDbId;
  115. $("#FrmDbId").ComboBoxTree({
  116. description: "==请选择==",
  117. height: "242px",
  118. url: "../../SystemManage/DataBaseLink/GetTreeJson",
  119. allowSearch: true
  120. }).bind("change", function () {
  121. var value = $(this).attr('data-value');
  122. _FrmDbId = value;
  123. //数据表
  124. $("#FrmTable").ComboBox({
  125. param: { dataBaseLinkId: value },
  126. url: "../../SystemManage/DataBaseTable/GetTableListJson",
  127. id: "name",
  128. text: "name"
  129. });
  130. });
  131. //数据表
  132. $("#FrmTable").ComboBox({
  133. description: "==请选择==",
  134. height: "205px",
  135. allowSearch: true
  136. }).bind("change", function () {
  137. var value = $(this).attr('data-value');
  138. $.ajax({
  139. url: "../../SystemManage/DataBaseTable/GetTableFiledListJson",
  140. data: { dataBaseLinkId: _FrmDbId, tableName: value },
  141. type: "GET",
  142. dataType: "json",
  143. async: false,
  144. success: function (data) {
  145. $.each(data, function (id, item) {
  146. item.remark = item.column + "【" + item.remark + "】";
  147. });
  148. frmdatabase = data;
  149. //数据表
  150. $("#FrmTableId").ComboBox({
  151. data: frmdatabase,
  152. id: "column",
  153. text: "remark"
  154. });
  155. },
  156. error: function (XMLHttpRequest, textStatus, errorThrown) {
  157. dialogMsg(errorThrown, -1);
  158. }
  159. });
  160. });;
  161. //主键
  162. $("#FrmTableId").ComboBox({
  163. description: "==请选择==",
  164. height: "185px",
  165. allowSearch: true
  166. });
  167. }
  168. function bindingBase()
  169. {
  170. if (!$('#step-1').Validform()) {
  171. return false;
  172. }
  173. var _postData = $("#step-1").GetWebControls(keyValue);
  174. postData.isSystemTable = $('input[name="isSystemTable"]:checked').val();
  175. postData = $.extend(postData, _postData);
  176. setFrmInfo(postData);
  177. return true;
  178. }
  179. /*=========基本配置(end)====================================================================*/
  180. /*=========表单选择(begin)==================================================================*/
  181. function setFrmInfo(data)
  182. {
  183. var _height = $(window).height() - 87 < 410 ? 410 : $(window).height() - 87;
  184. postData.FrmContent = data.FrmContent;
  185. if (data.isSystemTable == "0") {
  186. frmapp = $('#frmdesign').frmDesign({
  187. Height: _height,
  188. frmContent: postData.FrmContent
  189. });
  190. }
  191. else {
  192. var _frmdatabase = [];
  193. for (var i in frmdatabase)
  194. {
  195. if (frmdatabase[i].column != postData.FrmTableId)
  196. {
  197. _frmdatabase.push(frmdatabase[i]);
  198. }
  199. }
  200. frmapp = $('#frmdesign').frmDesign({
  201. Height: _height,
  202. tablefiledJsonData: _frmdatabase,
  203. isSystemTable: postData.isSystemTable,
  204. frmContent: postData.FrmContent
  205. });
  206. }
  207. }
  208. function bindingFrm() {
  209. var frmcotentls = frmapp.getData();
  210. if (!frmcotentls) {
  211. return false;
  212. }
  213. postData.FrmContent = JSON.stringify(frmcotentls);
  214. return true;
  215. }
  216. /*=========表单选择(end)====================================================================*/
  217. /*=========创建完成(begin)==================================================================*/
  218. function finishbtn() {
  219. postData["EnabledMark"] = 1;
  220. $.SaveForm({
  221. url: "../../FlowManage/FormDesign/SaveForm?keyValue=" + keyValue,
  222. param: postData,
  223. loading: "正在保存数据...",
  224. success: function () {
  225. $.currentIframe().$("#gridTable").trigger("reloadGrid");
  226. }
  227. })
  228. }
  229. /*=========创建完成(end)====================================================================*/
  230. </script>
  231. <div class="widget-body">
  232. <div id="wizard" class="wizard" data-target="#wizard-steps" >
  233. <ul class="steps">
  234. <li data-target="#step-1" class="active"><span class="step">1</span>基本配置<span class="chevron"></span></li>
  235. <li data-target="#step-2"><span class="step">2</span>表单设计<span class="chevron"></span></li>
  236. <li data-target="#step-4"><span class="step">3</span>创建完成<span class="chevron"></span></li>
  237. </ul>
  238. </div>
  239. <div class="step-content wizard-step-content" id="wizard-steps">
  240. <div class="step-pane wizard-step-pane active" id="step-1">
  241. <div class="alert alert-danger" style="text-align: left; margin-bottom: 10px;">
  242. <i class="fa fa-warning alert-dismissible" style="position: relative; top: 1px; font-size: 15px; padding-right: 5px;"></i>
  243. 请你填写表单信息,用于创建或修改表单!
  244. </div>
  245. <div class="panel panel-default">
  246. <div class="panel-heading">
  247. <h3 class="panel-title">表单基本信息配置</h3>
  248. </div>
  249. <div class="panel-body">
  250. <table class="form">
  251. <tr>
  252. <td class="formTitle">表单编号<font face="宋体">*</font></td>
  253. <td class="formValue">
  254. <input id="FrmCode" type="text" class="form-control" placeholder="请输入编号" isvalid="yes" checkexpession="NotNull" />
  255. </td>
  256. </tr>
  257. <tr>
  258. <td class="formTitle">表单名称<font face="宋体">*</font></td>
  259. <td class="formValue">
  260. <input id="FrmName" type="text" class="form-control" placeholder="请输入名称" isvalid="yes" checkexpession="NotNull" />
  261. </td>
  262. </tr>
  263. <tr>
  264. <td class="formTitle">表单分类<font face="宋体">*</font></td>
  265. <td class="formValue">
  266. <div id="FrmType" type="selectTree" class="ui-select" isvalid="yes" checkexpession="NotNull"></div>
  267. </td>
  268. </tr>
  269. <tr>
  270. <td class="formTitle">是否建表<font face="宋体">*</font></td>
  271. <td class="formValue">
  272. <div class="rdio rdio-color_a"><input type="radio" name="isSystemTable" id="isSystemTable0" value="0" checked /><label for="isSystemTable0">否</label></div>
  273. <div class="rdio rdio-color_c"><input type="radio" name="isSystemTable" id="isSystemTable1" value="1" /><label for="isSystemTable1">是</label></div>
  274. </td>
  275. </tr>
  276. <tr class="Systemtable" style="display:none">
  277. <td class="formTitle">数据库<font face="宋体">*</font></td>
  278. <td class="formValue">
  279. <div id="FrmDbId" type="selectTree" class="ui-select"></div>
  280. </td>
  281. </tr>
  282. <tr class="Systemtable" style="display:none">
  283. <td class="formTitle">数据表<font face="宋体">*</font></td>
  284. <td class="formValue">
  285. <div id="FrmTable" type="select" class="ui-select"></div>
  286. </td>
  287. </tr>
  288. <tr class="Systemtable" style="display:none">
  289. <td class="formTitle">绑定主键<font face="宋体">*</font></td>
  290. <td class="formValue">
  291. <div id="FrmTableId" type="select" class="ui-select"></div>
  292. </td>
  293. </tr>
  294. <tr>
  295. <th class="formTitle formTitle-top">
  296. 备注
  297. </th>
  298. <td class="formValue">
  299. <textarea id="Description" class="form-control" style="height: 180px;"></textarea>
  300. </td>
  301. </tr>
  302. </table>
  303. </div>
  304. </div>
  305. </div>
  306. <div class="step-pane flowapp" id="step-2">
  307. <div id="frmdesign"></div>
  308. </div>
  309. <div class="step-pane" id="step-4">
  310. <div class="drag-tip">
  311. <i class="fa fa-check-circle"></i>
  312. <p >设计完成,请点击保存</p>
  313. </div>
  314. </div>
  315. </div>
  316. <div class="form-button" id="wizard-actions">
  317. <a id="btn_last" disabled class="btn btn-default btn-prev">上一步</a>
  318. <a id="btn_next" class="btn btn-default btn-next">下一步</a>
  319. <a id="btn_caogao" class="btn btn-info">保存草稿</a>
  320. <a id="btn_finish" disabled class="btn btn-success" onclick="finishbtn();">保存</a>
  321. </div>
  322. </div>