device_edit.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242
  1. <include file="public@header" />
  2. <style>
  3. #map {
  4. width: 100%;
  5. height: 100%;
  6. min-height: 320px;
  7. }
  8. .collage {
  9. display: none;
  10. }
  11. </style>
  12. </head>
  13. <body>
  14. <div class="wrap">
  15. <ul class="nav nav-tabs">
  16. <li><a href="{:url('shop/devices')}">商家设备列表</a></li>
  17. <li class="active"><a>修改设备</a></li>
  18. </ul>
  19. <form method="post" class="form-horizontal js-ajax-form margin-top-20" action="{:url('shop/devicePost')}">
  20. <div class="form-group">
  21. <label for="input-name" class="col-sm-2 control-label"><span class="form-required">*</span>设备名称</label>
  22. <div class="col-md-6 col-sm-6">
  23. <input type="text" class="form-control" id="input-name" name="name" placeholder="设备名称" value="{$info.name|default=''}">
  24. </div>
  25. </div>
  26. <div class="form-group">
  27. <label for="input-status" class="col-sm-2 control-label">商家</label>
  28. <div class="col-md-6 col-sm-4">
  29. <select class="form-control" name="shop_uid" id="input-status">
  30. <foreach name="businessList" item="vo">
  31. <option value="{$vo.id}" <if condition="$info.shop_uid == $vo.id">selected</if>>{$vo.real_name}</option>
  32. </foreach>
  33. </select>
  34. </div>
  35. </div>
  36. <div class="form-group">
  37. <label for="input-api-key" class="col-sm-2 control-label"><span class="form-required">*</span>设备KEY</label>
  38. <div class="col-md-6 col-sm-6">
  39. <input type="text" class="form-control" id="input-api-key" name="api_key" placeholder="32位密钥" value="{$info.api_key|default=''}">
  40. </div>
  41. </div>
  42. <div class="form-group">
  43. <label for="input-device_code" class="col-sm-2 control-label"><span class="form-required">*</span>设备号</label>
  44. <div class="col-md-6 col-sm-6">
  45. <input type="text" class="form-control" id="input-device_code" name="device_code" placeholder="唯一序列号" value="{$info.device_code|default=''}">
  46. </div>
  47. <label style="height: 30px; line-height: 30px;"
  48. for="show_device_code"><input id="show_device_code" type="checkbox" name="show_device_code" value="1" <if condition="$info.show_device_code == 1">checked</if>>显示设备号</label>
  49. </div>
  50. <div class="form-group">
  51. <label for="input-number" class="col-sm-2 control-label"><span class="form-required">*</span>编号</label>
  52. <div class="col-md-6 col-sm-6">
  53. <input type="text" class="form-control" id="input-number" name="number" value="{$info.number|default=''}">
  54. </div>
  55. </div>
  56. <div class="form-group">
  57. <label for="input-color_type" class="col-sm-2 control-label">机器类型</label>
  58. <div class="col-md-6 col-sm-4">
  59. <select class="form-control" name="color_type" id="input-color_type">
  60. <option value="1" <if condition="$info.color_type == 1">selected</if>>黑白</option>
  61. <option value="2" <if condition="$info.color_type == 2">selected</if>>彩印</option>
  62. </select>
  63. </div>
  64. </div>
  65. <div class="form-group">
  66. <label for="input-collage" class="col-sm-2 control-label">是否支持拼团</label>
  67. <div class="col-md-6 col-sm-4">
  68. <select class="form-control" name="is_collage" id="input-collage" onchange="changeCollage()">
  69. <option value="1" <if condition="$info.is_collage == 1">selected</if>>不支持</option>
  70. <option value="2" <if condition="$info.is_collage == 2">selected</if>>支持</option>
  71. </select>
  72. </div>
  73. </div>
  74. <div class="form-group">
  75. <label for="input-price" class="col-sm-2 control-label"><span class="form-required">*</span>价格</label>
  76. <div class="col-md-6 col-sm-6">
  77. <input type="text" class="form-control" id="input-price" name="price" value="{$info.price|default=''}">
  78. </div>
  79. </div>
  80. <div class="form-group">
  81. <label for="input-color_price" class="col-sm-2 control-label"><span class="form-required">*</span>彩印价格</label>
  82. <div class="col-md-6 col-sm-6">
  83. <input type="text" class="form-control" id="input-color_price" name="color_price" value="{$info.color_price|default=''}">
  84. </div>
  85. </div>
  86. <div class="form-group collage">
  87. <label for="input-collage_price" class="col-sm-2 control-label"><span class="form-required">*</span>拼团价格</label>
  88. <div class="col-md-6 col-sm-6">
  89. <input type="text" class="form-control" id="input-collage_price" name="collage_price" value="{$info.collage_price|default=''}">
  90. </div>
  91. </div>
  92. <div class="form-group collage">
  93. <label for="input-collage_color_price" class="col-sm-2 control-label"><span class="form-required">*</span>拼团彩印价格</label>
  94. <div class="col-md-6 col-sm-6">
  95. <input type="text" class="form-control" id="input-collage_color_price" name="collage_color_price" value="{$info.collage_color_price|default=''}">
  96. </div>
  97. </div>
  98. <div class="form-group collage">
  99. <label for="input-collage_num" class="col-sm-2 control-label"><span class="form-required">*</span>成团人数</label>
  100. <div class="col-md-6 col-sm-6">
  101. <input type="text" class="form-control" id="input-collage_num" name="collage_num" value="{$info.collage_num|default=''}">
  102. </div>
  103. </div>
  104. <div class="form-group">
  105. <label for="input-address" class="col-sm-2 control-label"><span class="form-required">*</span>定位地址</label>
  106. <div class="col-md-6 col-sm-6">
  107. <input type="text" class="form-control" id="input-address" name="address" placeholder="定位获取" value="{$info.address|default=''}">
  108. </div>
  109. </div>
  110. <div class="form-group">
  111. <label class="col-sm-2 control-label"><span class="form-required"></span>定位</label>
  112. <div class="col-md-6 col-sm-8">
  113. <input type="hidden" id="lng" name="lng" value="{$info.lng|default=''}">
  114. <input type="hidden" id="lat" name="lat" value="{$info.lat|default=''}">
  115. <input type="hidden" id="province" name="province" value="{$info.province|default=''}">
  116. <input type="hidden" id="city" name="city" value="{$info.city|default=''}">
  117. <input type="hidden" id="district" name="district" value="{$info.district|default=''}">
  118. <div id="map">获取定位</div>
  119. </div>
  120. </div>
  121. <div class="form-group">
  122. <div class="col-sm-offset-2 col-sm-10">
  123. <input type="hidden" name="id" value="{$info.id}">
  124. <button type="submit" class="btn btn-primary js-ajax-submit">{:lang('SAVE')}</button>
  125. <a class="btn btn-default" href="javascript:history.back(-1);">{:lang('BACK')}</a>
  126. </div>
  127. </div>
  128. </form>
  129. </div>
  130. <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak={$mapKey|default=''}"></script>
  131. <script src="__STATIC__/js/admin.js"></script>
  132. <script>
  133. $(function(){
  134. var lng = "{$info.lng|default=''}";
  135. var lat = "{$info.lat|default=''}";
  136. var map = new BMap.Map('map');
  137. var poi = new BMap.Point(lng, lat);
  138. map.enableScrollWheelZoom();
  139. map.centerAndZoom(poi, 12);
  140. var mark = new BMap.Marker(poi);
  141. map.addOverlay(mark);
  142. mark.addEventListener("dragend", showInfo);
  143. mark.enableDragging(); //可拖拽
  144. // 添加定位控件
  145. var geolocationControl = new BMap.GeolocationControl();
  146. map.addControl(geolocationControl);
  147. changeCollage();
  148. if(lng == '' || lat == ''){
  149. loadLocation();
  150. }
  151. map.addEventListener("click",function(e){
  152. poi = new BMap.Point(e.point.lng, e.point.lat);
  153. mark = new BMap.Marker(poi);
  154. mark.addEventListener("dragend", showInfo);
  155. mark.enableDragging(); //可拖拽
  156. });
  157. /**
  158. * 获取地址
  159. * @param e
  160. */
  161. function showInfo(e){
  162. var gc = new BMap.Geocoder();
  163. gc.getLocation(e.point, function(rs){
  164. var addComp = rs.addressComponents;
  165. var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;//获取地址
  166. $("#province").val(addComp.province);
  167. $("#city").val(addComp.city);
  168. $("#district").val(addComp.district);
  169. $("#input-address").val(address);
  170. $("#lng").val(e.point.lng);
  171. $("#lat").val(e.point.lat);
  172. });
  173. }
  174. /**
  175. * 坐标转换
  176. * @param point
  177. * @returns {*}
  178. */
  179. function changePoint(point){
  180. var x_pi = 3.14159265358979324 * 3000.0 / 180.0;
  181. var x = point.lng - 0.0065;
  182. var y = point.lat - 0.006;
  183. var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * x_pi);
  184. var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * x_pi);
  185. point.lng = z * Math.cos(theta);
  186. point.lat = z * Math.sin(theta);
  187. return point;
  188. }
  189. // 定位
  190. function loadLocation() {
  191. var geolocation = new BMap.Geolocation();
  192. geolocation.getCurrentPosition(function (r) {
  193. console.log(r);
  194. if (this.getStatus() == BMAP_STATUS_SUCCESS) {
  195. poi = new BMap.Point(r.point.lng, r.point.lat);
  196. mark = new BMap.Marker(poi);
  197. mark.addEventListener("dragend", showInfo);
  198. mark.enableDragging(); //可拖拽
  199. var address = r.address.province+' '+r.address.city +' '+r.address.district;
  200. $("#lng").val(poi.lng);
  201. $("#lat").val(poi.lat);
  202. $("#province").val(r.address.province);
  203. $("#city").val(r.address.city);
  204. $("#district").val(r.address.district);
  205. $("#input-address").val(address);
  206. setTimeout(function(){
  207. showMsg('您的城市:'+r.address.city);
  208. }, 500)
  209. }
  210. else {
  211. showMsg('获取您的位置信息失败');
  212. }
  213. }, {enableHighAccuracy: true});
  214. }
  215. })
  216. function changeCollage(){
  217. var _this = $("#input-collage");
  218. if(_this.val() == 2){
  219. $(".collage").show();
  220. }else{
  221. $(".collage").hide()
  222. }
  223. }
  224. </script>
  225. </body>
  226. </html>