add_change.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>新增企业</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  9. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  10. <meta name="apple-mobile-web-app-capable" content="yes">
  11. <meta name="format-detection" content="telephone=no">
  12. <link rel="stylesheet" type="text/css" href="../../layui/css/layui.css" />
  13. <link rel="stylesheet" type="text/css" href="../../css/common.css" />
  14. <style type="text/css">
  15. .ui-required:before {
  16. content: "*";
  17. color: red;
  18. vertical-align: middle;
  19. }
  20. #roleSelectViwe .layui-form-item {
  21. margin-bottom: 0
  22. }
  23. #roleSelectViwe .layui-input-inline {
  24. width: calc(100% - 110px);
  25. margin-right: 0;
  26. }
  27. .region {
  28. padding-left: 10px;
  29. height: 38px;
  30. line-height: 38px;
  31. background-color: #fff;
  32. border-radius: 2px;
  33. border: 1px solid #e6e6e6;
  34. width: 100% !important;
  35. width: calc(100% - 132px) !important;
  36. }
  37. .userTip {
  38. color: #666;
  39. font-size: 12px;
  40. }
  41. .userTip b {
  42. color: #333;
  43. }
  44. #roleSelectViwe .layui-form-item {
  45. margin-bottom: 0
  46. }
  47. #roleSelectViwe .layui-input-inline {
  48. width: calc(100% - 110px);
  49. margin-right: 0;
  50. }
  51. .region {
  52. padding-left: 10px;
  53. height: 38px;
  54. line-height: 38px;
  55. background-color: #fff;
  56. border-radius: 2px;
  57. border: 1px solid #e6e6e6;
  58. width: calc(100% - 132px) !important;
  59. }
  60. .userTip {
  61. color: #666;
  62. font-size: 12px;
  63. }
  64. .userTip b {
  65. color: #333;
  66. }
  67. .my-middle {
  68. line-height: 36px;
  69. }
  70. .my-button {
  71. width: 60%;
  72. margin-left: 20%;
  73. height: 40px;
  74. text-align: center;
  75. line-height: 40px;
  76. border: 1px dashed;
  77. border-radius: 5px;
  78. }
  79. .my-inline {
  80. display: inline-block;
  81. float: left;
  82. text-align: center;
  83. height: 38px;
  84. line-height: 38px;
  85. width: 10%;
  86. }
  87. .my-images-inline {
  88. display: inline-block;
  89. width: 104px;
  90. height: 104px;
  91. border: 1px dashed;
  92. border-radius: 5px;
  93. padding: 4px;
  94. vertical-align: top;
  95. margin: 4px;
  96. }
  97. .my-img {
  98. width: 100%;
  99. height: 100%;
  100. }
  101. .my-images-add {
  102. display: inline-block;
  103. text-align: center;
  104. line-height: 103px;
  105. font-size: 32px;
  106. cursor: pointer;
  107. background-color: #fbfbfb;
  108. }
  109. .my-del {
  110. background-color: black;
  111. color: white;
  112. }
  113. .button-delImage.button-delAssayImage {
  114. position: relative;
  115. left: -2px;
  116. top: -106px;
  117. }
  118. </style>
  119. <script type="text/html" id="typeHtmlTpl">
  120. <option value="">请选择</option>
  121. {{# if(!d.list){d.list = []}; layui.each(d.list, function(index, item){ }}
  122. <option value="{{item.guid}}">{{item.roleName}}</option>
  123. {{# }); }}
  124. </script>
  125. </head>
  126. <body>
  127. <form class="layui-form" action="" lay-filter="addForm" style="padding: 20px 20px 0 0">
  128. <div class="layui-form-item">
  129. <div class="layui-inline">
  130. <label class="layui-form-label ui-required">企业代码</label>
  131. <div class="layui-input-block">
  132. <input type="text" id="ID_orgCode" name="orgCode" lay-verify="mustNumber6" placeholder="请输入企业代码"
  133. autocomplete="off" class="layui-input">
  134. </div>
  135. </div>
  136. <div class="layui-inline">
  137. <label class="layui-form-label">企业简码</label>
  138. <div class="layui-input-block">
  139. <input type="text" id='ID_orgBrevity' name="orgBrevity" placeholder="请输入企业简码" lay-verify="mustNumber3"
  140. autocomplete="off" class="layui-input">
  141. </div>
  142. </div>
  143. <script type="text/javascript">
  144. (function () {
  145. let a = document.querySelector('#ID_orgCode');
  146. let b = document.querySelector('#ID_orgBrevity');
  147. a.onchange = function () {
  148. b.value = (this.value + '').substr(-3);
  149. }
  150. })();
  151. </script>
  152. </div>
  153. <!-- <div class="layui-form-item">
  154. <label class="layui-form-label">企业公众号二维码</label>
  155. <div class="layui-input-block">
  156. <div id="imageListDiv" style="display: flex;"></div>
  157. <div class="layui-form-mid layui-word-aux">图片视频上传完毕后请记得按保存哦</div>
  158. </div>
  159. <script type="text/html" id="imageHtmlTpl">
  160. <div class="layui-form-item">
  161. {{# if(!d.list){d.list = []}; layui.each(d.list, function(index, item){ }}
  162. <div class="my-images-inline">
  163. {{#if ("jpg|jpeg|png|gif|bmp".indexOf(item.substring(item.lastIndexOf(".")+1))==-1){}}
  164. <video class="my-img" src="{{window.hywa.config.href}}/{{item}}" autoplay loop></video>
  165. {{#}else{}}
  166. <img class="my-img" src="{{window.hywa.config.href}}/{{item}}">
  167. {{#} }}
  168. <i class="layui-icon my-del button-delImage" data-bind="{{index}}" title="删除" data-icon="&#x1006;">&#x1006;</i>
  169. </div>
  170. {{# }); }}
  171. <div class="my-images-inline my-images-add" id="imageUploadBtn">+</div>
  172. </div>
  173. </script>
  174. </div> -->
  175. <div class="layui-form-item">
  176. <label class="layui-form-label ui-required">企业名称</label>
  177. <div class="layui-input-block">
  178. <input type="text" name="orgName" maxlength="50" lay-verify="required|normal" placeholder="请输入企业名称"
  179. autocomplete="off" class="layui-input">
  180. </div>
  181. </div>
  182. <!-- <div class="layui-form-item">
  183. <div class="layui-inline">
  184. <label class="layui-form-label ui-required">联系人</label>
  185. <div class="layui-input-block">
  186. <input type="text" name="principals" lay-verify="required|normal" placeholder="请输入联系人姓名" maxLength="5" autocomplete="off" class="layui-input">
  187. </div>
  188. </div>
  189. <div class="layui-inline">
  190. <label class="layui-form-label ui-required">联系电话</label>
  191. <div class="layui-input-block">
  192. <input type="text" name="tel" lay-verify="required|normal" placeholder="请输入联系电话" maxLength="18" autocomplete="off" class="layui-input">
  193. </div>
  194. </div>
  195. <div class="layui-inline">
  196. <label class="layui-form-label">qq</label>
  197. <div class="layui-input-block">
  198. <input type="text" name="qqCode" lay-verify="" placeholder="请输入qq号" maxLength="18" autocomplete="off" class="layui-input">
  199. </div>
  200. </div>
  201. </div>
  202. <div class="layui-form-item">
  203. <label class="layui-form-label">企业官网</label>
  204. <div class="layui-input-block">
  205. <input type="text" name="companyUrl" placeholder="请输入企业官网" maxLength="100" autocomplete="off" class="layui-input">
  206. </div>
  207. </div>
  208. <div class="layui-form-item">
  209. <label class="layui-form-label">企业地址</label>
  210. <div class="layui-input-block">
  211. <input type="text" name="orgAddress" placeholder="请输入企业地址" maxLength="100" autocomplete="off"
  212. class="layui-input">
  213. </div>
  214. </div>-->
  215. <div class="layui-form-item">
  216. <label class="layui-form-label">二维码网址</label>
  217. <div class="layui-input-block">
  218. <input type="text" name="qrcodeUrlPrefixe" placeholder="请输入二维码网址" maxLength="100" autocomplete="off"
  219. class="layui-input">
  220. </div>
  221. </div>
  222. <div class="layui-form-item">
  223. <label class="layui-form-label ui-required">系统名称</label>
  224. <div class="layui-input-block">
  225. <input type="text" name="systemName" maxlength="50" lay-verify="required|normal" placeholder="请输入系统名称"
  226. autocomplete="off" class="layui-input">
  227. </div>
  228. </div>
  229. <div class="layui-form-item">
  230. <label class="layui-form-label ui-required">溯源模版</label>
  231. <div class="layui-input-block">
  232. <select name="templeType" lay-verify="required|normal">
  233. <option value=""></option>
  234. <option value="0">标准模板</option>
  235. <option value="1">大米模板</option>
  236. <option value="2">林产品模板</option>
  237. </select>
  238. </div>
  239. </div>
  240. <!-- <div class="layui-form-item">
  241. <label class="layui-form-label">备注</label>
  242. <div class="layui-input-block">
  243. <input type="text" name="remark" placeholder="请输入备注" maxLength="500" autocomplete="off"
  244. class="layui-input">
  245. </div>
  246. </div> -->
  247. <div class="layui-form-item layui-layer-btn">
  248. <div class="layui-input-block">
  249. <button type="reset" class="layui-btn layui-btn-primary" id="closeWin">取消</button>
  250. <button class="layui-btn" lay-submit lay-filter="formDemo">保存</button>
  251. </div>
  252. </div>
  253. </form>
  254. <script type="text/javascript">
  255. function loadJS(url) {
  256. document.write("<script src='" + url + "?ver=" + new Date().getTime() + "'><\/script>")
  257. }
  258. loadJS("../../layui/layui.js");
  259. loadJS("../../js/ajaxhook.min.js");
  260. loadJS("../../js/config.js");
  261. </script>
  262. <script type="text/javascript">
  263. layui.config({
  264. base: "../../js/layuiPlugins/"
  265. }).use(["form", 'layer', 'jquery', 'laytpl', 'upload'], function () {
  266. var form = layui.form,
  267. layer = layui.layer,
  268. $ = layui.jquery,
  269. laytpl = layui.laytpl,
  270. upload = layui.upload;
  271. var funcName = "org";
  272. var formData = {
  273. guid: (JSON.stringify(location.searchObj()) != "{}") ? location.searchObj().guid || null : null, //带参传入ID
  274. current: {}, //当前表单数据
  275. select_data: "select_" + funcName, //查询企业
  276. save_data: (location.searchObj().guid ? 'edit' : 'add') + '_' + funcName, //查询企业
  277. formLayFilter: "addForm", //表单容器
  278. closeModal: function () { //关闭当前窗口
  279. parent.layer.close(parent.layer.getFrameIndex(window.name));
  280. }
  281. };
  282. var option = {
  283. elem: '#imageUploadBtn',
  284. url: 'uploadImage',
  285. accept: "file",
  286. exts: "jpg|jpeg|png|gif|bmp|mp4|ogg|webm|avi|wma|rmvb|rm|flash|3gp|flv|mp3",
  287. size: 10240,//kb
  288. before: function () {
  289. uploadMsg = layer.msg('正在上传中……', {
  290. icon: 16,
  291. fixed: false,
  292. time: 0
  293. });
  294. },
  295. done: function (res) {
  296. layer.close(uploadMsg);
  297. formData.current.wxQRImg = res.data[0];
  298. imageTpl({
  299. elem: "#imageListDiv",
  300. list: [formData.current.wxQRImg]
  301. });
  302. },
  303. error: function () {
  304. }
  305. };
  306. //图片列表模板
  307. function imageTpl(obj) {
  308. laytpl(imageHtmlTpl.innerHTML).render(obj, function (html) {
  309. $(obj.elem).html(html);
  310. upload.render(option);
  311. $(".button-delImage").on("click", function (e) {
  312. formData.current.wxQRImg = "";
  313. imageTpl({
  314. elem: "#imageListDiv",
  315. list: []
  316. });
  317. });
  318. });
  319. }
  320. //初始化
  321. formData.main = function () {
  322. var _this = this;
  323. if (this.guid) {
  324. _this.getCurrent(_this.guid); //获取并初始化表单角色信息
  325. } else {
  326. _this.initialization();
  327. }
  328. if (location.searchObj().event == "view") {
  329. var el = document.getElementsByTagName("INPUT");
  330. for (var i = 0; i < el.length; i++) {
  331. el[i].readOnly = true;
  332. }
  333. el = document.getElementsByTagName("SELECT");
  334. for (var i = 0; i < el.length; i++) {
  335. el[i].disabled = true;
  336. }
  337. el = document.getElementsByTagName("checkbox");
  338. for (var i = 0; i < el.length; i++) {
  339. el[i].disabled = true;
  340. }
  341. el = document.getElementsByTagName("button");
  342. for (var i = 0; i < el.length; i++) {
  343. 0
  344. if (el[i].innerText.replace(" ", "") == "保存") {
  345. el[i].style.display = "none";
  346. }
  347. }
  348. }
  349. return this;
  350. };
  351. //初始化
  352. formData.initialization = function () {
  353. var _this = this;
  354. // imageTpl({
  355. // elem: "#imageListDiv",
  356. // list: _this.current.wxQRImg?[_this.current.wxQRImg]:[]
  357. // });
  358. //监听提交
  359. form.on('submit(formDemo)', function (obj) {
  360. //必须return false;
  361. return _this.fusionData(obj.field).submitInfo(); //获取选中权限变数组,提交变化===下拉
  362. });
  363. //关闭窗口
  364. $("#closeWin").on("click", function () {
  365. _this.closeModal();
  366. });
  367. return _this;
  368. };
  369. //获取当前信息
  370. formData.getCurrent = function (id) {
  371. var _this = this;
  372. $.ajax({
  373. url: this.select_data,
  374. method: 'get',
  375. data: {
  376. guid: id || this.guid //当前ID
  377. },
  378. success: function (res) {
  379. _this.current = res.data[0];
  380. _this.initialization().formVal();
  381. }
  382. });
  383. return _this;
  384. };
  385. //表单赋值
  386. formData.formVal = function () {
  387. var _this = this;
  388. form.val(this.formLayFilter, this.current);
  389. return this;
  390. };
  391. //合并表单内容
  392. formData.fusionData = function (obj) {
  393. this.current = $.extend(this.current, obj);
  394. if (this.current.guid) {
  395. delete this.current.password;
  396. }
  397. return this;
  398. };
  399. //提交新增修改
  400. formData.submitInfo = function () {
  401. var _this = this;
  402. $.ajax({
  403. type: 'POST',
  404. url: this.save_data,//+'?userId='+this.guid
  405. data: JSON.stringify(this.current),
  406. contentType: 'application/json',
  407. success: function (res) {
  408. if (!(res.code - 0)) {
  409. parent.layer.msg(res.msg, {
  410. icon: 1
  411. });
  412. _this.closeModal();
  413. } else {
  414. layer.msg(res.msg, {
  415. icon: 2
  416. });
  417. }
  418. }
  419. });
  420. return false;
  421. };
  422. formData.main();
  423. //验证规则
  424. form.verify({
  425. phoneNumber: function (value) {
  426. if (value) {
  427. if (!(/^1[3|4|5|7|8]\d{9}$/).test(value)) {
  428. return '请输入正确的手机号码';
  429. }
  430. }
  431. return false;
  432. },
  433. mustNumber6: [
  434. /^[0-9]{6}$/,
  435. "必须是数字6位"
  436. ],
  437. mustNumber3: [
  438. /^[0-9]{3}$/,
  439. "必须是数字3位"
  440. ],
  441. normal: function () {
  442. return false;
  443. }
  444. });
  445. });
  446. </script>
  447. </body>
  448. </html>