agentform.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333
  1. <style type="text/css">
  2. .amap-sug-result{
  3. z-index:999999999;
  4. }
  5. #pickerInput{
  6. z-index: 999999;
  7. position: absolute;
  8. right: 30px;
  9. top: 20px;
  10. width: 200px;
  11. }
  12. </style>
  13. <div class="layui-fluid">
  14. <div class="layui-row layui-col-space15">
  15. <div class="layui-col-md12">
  16. <div class="layui-card">
  17. <div class="layui-card-header">代理门店</div>
  18. <div class="layui-card-body" pad15>
  19. <div class="layui-form layui-form-pane" lay-filter="LAY-agent-agentform-edit">
  20. <input type="hidden" name="id" value="{$agent.id}">
  21. <div class="layui-form-item">
  22. <label class="layui-form-label">劳务公司</label>
  23. <div class="layui-input-block">
  24. <input type="text" name="workertitle" value="{$worker.title}" readonly class="layui-input layui-disabled">
  25. </div>
  26. </div>
  27. <div class="layui-form-item">
  28. <label class="layui-form-label">关联用户</label>
  29. <div class="layui-input-block">
  30. <input type="text" name="musermobile" value="{$agent.muser ? $agent.muser.mobile : ''}" lay-verify="phone" placeholder="请输入关联用户手机号..."
  31. autocomplete="off" class="layui-input">
  32. <div class="layui-form-mid layui-word-aux">关联用户的手机号。<!-- 关联的用户个人中心会出现代理门店管理入口导航。 --></div>
  33. </div>
  34. </div>
  35. <div class="layui-form-item">
  36. <label class="layui-form-label"><span style="color:#f90c05;">*</span>代理编号</label>
  37. <div class="layui-input-block">
  38. <input type="text" name="idnumber" value="{$agent.idnumber}" lay-verify="required" placeholder="请输入..."
  39. autocomplete="off" class="layui-input">
  40. <div class="layui-form-mid layui-word-aux">可以是代理特定编号,需要确保唯一性。</div>
  41. </div>
  42. </div>
  43. <div class="layui-form-item">
  44. <label class="layui-form-label"><span style="color:#f90c05;">*</span>代理名称</label>
  45. <div class="layui-input-block">
  46. <input type="text" name="title" value="{$agent.title}" lay-verify="required" placeholder="请输入..." autocomplete="off"
  47. class="layui-input">
  48. </div>
  49. </div>
  50. <div class="layui-form-item">
  51. <label class="layui-form-label">标图</label>
  52. <div class="layui-input-block">
  53. <div class="layui-upload">
  54. <button type="button" class="layui-btn attachment-upload-images" data-input="tilpic" data-amount="1">上传图片</button>
  55. <div class="layui-inline layui-word-aux"> 最佳尺寸:320px*320px </div>
  56. <div class="layui-upload-list echo-attachment-image-list" id="tilpic">
  57. {notempty name="agent.tilpic"}
  58. <div>
  59. <input type="hidden" name="tilpic" value="{$agent.tilpic}">
  60. <img src="{$agent.tilpic}">
  61. </div>
  62. {/notempty}
  63. </div>
  64. </div>
  65. </div>
  66. </div>
  67. <div class="layui-form-item">
  68. <label class="layui-form-label">轮播图</label>
  69. <div class="layui-input-block">
  70. <div class="layui-upload">
  71. <button type="button" class="layui-btn attachment-upload-images" data-input="picall" data-amount="9">上传图片</button>
  72. <div class="layui-inline layui-word-aux"> 最佳尺寸:750px*375px </div>
  73. <div class="layui-upload-list echo-attachment-image-list" id="picall">
  74. {volist name="agent.picall" id="vo"}
  75. <div>
  76. <input type="hidden" name="picall[]" value="{$vo}">
  77. <img src="{$vo}"> <button type="button" class="attachmentdel layui-btn layui-btn-primary layui-btn-xs layui-btn-fluid">删除</button>
  78. </div>
  79. {/volist}
  80. </div>
  81. </div>
  82. </div>
  83. </div>
  84. <div class="layui-form-item">
  85. <label class="layui-form-label"><span style="color:#f90c05;">*</span>负责人姓名</label>
  86. <div class="layui-input-block">
  87. <input type="text" name="realname" value="{$agent.realname}" lay-verify="required" placeholder="请输入..."
  88. autocomplete="off" class="layui-input">
  89. </div>
  90. </div>
  91. <div class="layui-form-item">
  92. <label class="layui-form-label">负责人手机</label>
  93. <div class="layui-input-block">
  94. <input type="text" name="mobile" value="{$agent.mobile}" lay-verify="phone" placeholder="请输入..." autocomplete="off"
  95. class="layui-input">
  96. </div>
  97. </div>
  98. <div class="layui-form-item">
  99. <label class="layui-form-label">门店电话</label>
  100. <div class="layui-input-block">
  101. <input type="text" name="telephone" value="{$agent.telephone}" placeholder="请输入..." autocomplete="off" class="layui-input">
  102. </div>
  103. </div>
  104. <div class="layui-form-item" id="LAY-agent-agentform-edit-areapicker">
  105. <label class="layui-form-label"><span style="color:#f90c05;">*</span>省市区</label>
  106. <div class="layui-input-inline">
  107. <select name="province" class="province-selector" data-value="{$agent.province}" lay-filter="province-2"
  108. lay-verify="required">
  109. <option value="">请选择省</option>
  110. </select>
  111. </div>
  112. <div class="layui-input-inline">
  113. <select name="city" class="city-selector" data-value="{$agent.city}" lay-filter="city-2" lay-verify="required">
  114. <option value="">请选择市</option>
  115. </select>
  116. </div>
  117. <div class="layui-input-inline">
  118. <select name="district" class="district-selector" data-value="{$agent.district}" lay-filter="district-2"
  119. lay-verify="required">
  120. <option value="">请选择区</option>
  121. </select>
  122. </div>
  123. </div>
  124. <div class="layui-form-item">
  125. <label class="layui-form-label">详细地址</label>
  126. <div class="layui-input-block">
  127. <input type="text" name="address" value="{$agent.address}" lay-verify="required" placeholder="请输入..."
  128. autocomplete="off" class="layui-input">
  129. </div>
  130. </div>
  131. <div class="layui-form-item">
  132. <label class="layui-form-label"><span style="color:#f90c05;">*</span>经纬度</label>
  133. <div class="layui-input-inline">
  134. <input type="text" name="longitude" value="{$agent.longitude}" lay-verify="required" placeholder="经度"
  135. autocomplete="off" class="layui-input">
  136. </div>
  137. <div class="layui-input-inline">
  138. <input type="text" name="latitude" value="{$agent.latitude}" lay-verify="required" placeholder="纬度"
  139. autocomplete="off" class="layui-input">
  140. </div>
  141. <div id="maplocation" style="width:500px;height:500px;display: none;">
  142. <input id="pickerInput" class="layui-input" placeholder="输入关键字选取地点"/>
  143. </div>
  144. <button style="float: left;" type="button" class="layui-btn" id="layuiadmin-map-lnglat">选择地理位置</button>
  145. </div>
  146. <div class="layui-form-item" id="formdetails">
  147. <label class="layui-form-label">门店介绍</label>
  148. <div class="layui-input-block">
  149. <textarea class="layui-textarea" name="details" id="details" placeholder="请输入..." style="display: none"
  150. lay-verify="editcontent">
  151. {$agent.details}
  152. </textarea>
  153. </div>
  154. </div>
  155. <div class="layui-form-item">
  156. <label class="layui-form-label">排序</label>
  157. <div class="layui-input-block">
  158. <input type="text" name="priority" value="{$agent.priority|default=0}" lay-verify="number" placeholder="请输入...,倒序,值越大越靠前。"
  159. autocomplete="off" class="layui-input">
  160. </div>
  161. </div>
  162. <div class="layui-form-item">
  163. <label class="layui-form-label">信息备注</label>
  164. <div class="layui-input-block">
  165. <input type="text" name="remark" value="{$agent.remark}" placeholder="请输入..." autocomplete="off" class="layui-input">
  166. </div>
  167. </div>
  168. <div class="layui-form-item" pane>
  169. <label class="layui-form-label">状态</label>
  170. <div class="layui-input-block">
  171. <input type="radio" name="status" value="1" title="正常" {eq name="agent.status|default=1" value="1" }checked{/eq} />
  172. <input type="radio" name="status" value="2" title="禁用" {eq name="agent.status" value="2" }checked{/eq} />
  173. </div>
  174. </div>
  175. <div class="layui-form-item" pane>
  176. <label class="layui-form-label">收益结算</label>
  177. <div class="layui-input-block">
  178. <input type="radio" name="is_settle" value="1" title="是" {eq name="agent.is_settle|default=1" value="1" }checked{/eq} />
  179. <input type="radio" name="is_settle" value="2" title="否" {eq name="agent.is_settle" value="2" }checked{/eq} />
  180. </div>
  181. </div>
  182. <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
  183. <legend>PC端管理账号密码</legend>
  184. </fieldset>
  185. <div class="layui-form-item">
  186. <label class="layui-form-label">登录账号</label>
  187. <div class="layui-input-block">
  188. <input type="text" name="loginname" value="{$agent.loginname}" placeholder="请输入..." autocomplete="off" class="layui-input">
  189. <div class="layui-form-mid layui-word-aux">PC端管理登录账号。</div>
  190. </div>
  191. </div>
  192. <div class="layui-form-item">
  193. <label class="layui-form-label">登录密码</label>
  194. <div class="layui-input-block">
  195. <input type="text" name="password" value="" placeholder="请输入登录密码,不修改留空" autocomplete="off" class="layui-input">
  196. <div class="layui-form-mid layui-word-aux">PC端管理登录密码。</div>
  197. </div>
  198. </div>
  199. <div class="layui-form-item">
  200. <div class="layui-input-block">
  201. <input type="button" lay-submit lay-filter="LAY-agent-agentform-edit-submit" value="确认提交" class="layui-btn">
  202. </div>
  203. </div>
  204. </div>
  205. </div>
  206. </div>
  207. </div>
  208. </div>
  209. </div>
  210. <script>
  211. layui.config({
  212. base: '/static/echoui/' //静态资源所在路径
  213. }).extend({
  214. index: 'lib/index' //主入口模块
  215. }).use(['index', 'form', 'set', 'upload', 'layedit', 'layarea'], function() {
  216. var $ = layui.$,
  217. setter = layui.setter,
  218. admin = layui.admin,
  219. form = layui.form,
  220. upload = layui.upload,
  221. layedit = layui.layedit,
  222. layarea = layui.layarea;
  223. form.render();
  224. var details = layedit.build('details', {
  225. uploadImage: {
  226. url: setter.baseWorkerUrl + 'attachment/tplfieldimage',
  227. type: 'post'
  228. }
  229. });
  230. form.verify({
  231. editcontent: function(value) {
  232. layedit.sync(details);
  233. }
  234. });
  235. layarea.render({
  236. elem: '#LAY-agent-agentform-edit-areapicker',
  237. data: {
  238. province: '福建省',
  239. city: '泉州市',
  240. district: '晋江市',
  241. }
  242. });
  243. var map = new AMap.Map('maplocation', {
  244. center:[118.551494,24.781674],//地图中心位置
  245. zoom: 12,
  246. });
  247. $('#layuiadmin-map-lnglat').on('click', function() {
  248. var index = layer.open({
  249. type: 1,
  250. title: '点击获取地址坐标',
  251. area: ['500px', '550px'],
  252. content: $('#maplocation'),
  253. success: function() {
  254. //var map = new AMap.Map("maplocation", { resizeEnable: true });
  255. map.on('click', function(e) {
  256. $('input[name="longitude"]').val(e.lnglat.getLng());
  257. $('input[name="latitude"]').val(e.lnglat.getLat());
  258. layer.close(index);
  259. });
  260. }
  261. });
  262. });
  263. var auto = new AMap.Autocomplete({ input: "pickerInput" });
  264. var placeSearch = new AMap.PlaceSearch({ map: map });
  265. window.select = function (e) {
  266. console.log(e);
  267. placeSearch.setCity(e.poi.adcode);
  268. placeSearch.search(e.poi.name);
  269. };
  270. AMap.event.addListener(auto, "select", select);
  271. form.on('submit(LAY-agent-agentform-edit-submit)', function(obj) {
  272. var index = parent.layer.getFrameIndex(window.name);
  273. admin.req({
  274. url: setter.baseWorkerUrl + 'agent/editagent',
  275. type: 'post',
  276. data: obj.field,
  277. done: function(res) {
  278. layer.msg("提交成功", {
  279. icon: 1
  280. });
  281. parent.layui.table.reload('LAY-agent-agentlist-table'); //重载表格
  282. parent.layer.close(index);
  283. }
  284. });
  285. });
  286. $('.echo-attachment-image-list').on('click', '.attachmentdel', function() {
  287. $(this).parent().remove();
  288. });
  289. upload.render({
  290. elem: '.attachment-upload-images',
  291. url: setter.baseWorkerUrl + 'attachment/tplfieldimage',
  292. accept: 'images',
  293. exits: 'jpg|png|jpeg',
  294. acceptMime: 'image/*',
  295. size: 2048,
  296. number: 1,
  297. method: 'post',
  298. before: function(obj) {
  299. var item = this.item;
  300. upload_input = $(item).data('input');
  301. upload_amount = $(item).data('amount');
  302. layer.load();
  303. },
  304. done: function(res, index, upload) {
  305. layer.closeAll('loading');
  306. var html = "";
  307. if (upload_amount == 1) {
  308. html += '<div> <input type="hidden" name="' + upload_input + '" value="' + res.data.src + '"> ';
  309. html += '<img src="' + res.data.src + '"></div>';
  310. $("#" + upload_input).html(html);
  311. } else {
  312. html += '<div> <input type="hidden" name="' + upload_input + '[]" value="' + res.data.src + '"> ';
  313. html += '<img src="' + res.data.src +
  314. '"> <button type="button" class="attachmentdel layui-btn layui-btn-primary layui-btn-xs layui-btn-fluid">删除</button></div>';
  315. $("#" + upload_input).append(html);
  316. }
  317. },
  318. error: function(index, upload) {
  319. layer.closeAll('loading');
  320. }
  321. });
  322. });
  323. </script>