posterqrcode.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. /**
  2. * Created by Administrator on 2021/2/27.
  3. */
  4. var layer = layui.layer;
  5. var $;
  6. var cur_open_div;
  7. layui.use(['jquery', 'layer','form'], function(){
  8. $ = layui.$;
  9. var form = layui.form;
  10. form.on('radio(invite_poster_qrcode_corner_type)',function(data){
  11. if(data.value == 1){//直角
  12. $('.qrcode').css('border-radius','0px');
  13. $('.qrcode img').css('border-radius','0px');
  14. }else if(data.value == 0){//圆角
  15. $('.qrcode').css('border-radius','10px');
  16. $('.qrcode img').css('border-radius','10px');
  17. }
  18. });
  19. form.on('radio(invite_poster_qrcode_border_status)',function(data){
  20. if(data.value == 1){//开启
  21. var border_color = $('input[name="invite_poster_qrcode_bordercolor"]').val();
  22. $('.qrcode').css('border','1px solid '+border_color);
  23. }else if(data.value == 0){//关闭
  24. $('.qrcode').css('border','none');
  25. }
  26. });
  27. //监听提交
  28. form.on('submit(formDemo)', function(data){
  29. var loadingIndex = layer.load();
  30. $.ajax({
  31. url: data.form.action,
  32. type: data.form.method,
  33. data: data.field,
  34. dataType:'json',
  35. success: function (info) {
  36. if(info.status == 0)
  37. {
  38. layer.msg(info.result.message,{icon: 1,time: 2000});
  39. layer.close(loadingIndex);
  40. }else if(info.status == 1){
  41. var go_url = location.href;
  42. if( info.result.hasOwnProperty("url") )
  43. {
  44. go_url = info.result.url;
  45. }
  46. layer.msg('操作成功',{time: 1000,
  47. end:function(){
  48. location.href = info.result.url;
  49. }
  50. });
  51. }
  52. }
  53. });
  54. return false;
  55. });
  56. })
  57. $('#invitePosterQrcodeBackColors').colpick({
  58. submit:true,
  59. color: invite_poster_qrcode_backcolor,
  60. onSubmit: function(color,color2){
  61. $('#invite_poster_qrcode_backcolor-input').val('#'+color2);
  62. $('#invitePosterQrcodeBackColors').find('.layui-colorpicker-trigger-span').css('background','#'+color2);
  63. $('.colpick_full').hide();
  64. changeQrcode();
  65. }
  66. });
  67. $('#invitePosterQrcodeLineColors').colpick({
  68. submit:true,
  69. color: invite_poster_qrcode_linecolor,
  70. onSubmit: function(color,color2){
  71. $('#invite_poster_qrcode_linecolor-input').val('#'+color2);
  72. $('#invitePosterQrcodeLineColors').find('.layui-colorpicker-trigger-span').css('background','#'+color2);
  73. $('.colpick_full').hide();
  74. changeQrcode();
  75. }
  76. });
  77. $('#invitePosterQrcodeBorderColors').colpick({
  78. submit:true,
  79. color: invite_poster_qrcode_bordercolor,
  80. onSubmit: function(color,color2){
  81. $('#invite_poster_qrcode_bordercolor-input').val('#'+color2);
  82. $('#invitePosterQrcodeBorderColors').find('.layui-colorpicker-trigger-span').css('background','#'+color2);
  83. $('.colpick_full').hide();
  84. var invite_poster_qrcode_border_status = $('input[name="invite_poster_qrcode_border_status"]:checked').val();
  85. if(invite_poster_qrcode_border_status == 1){
  86. $('.qrcode').css('border','1px solid #'+color2);
  87. }
  88. }
  89. });
  90. $('input[name="invite_poster_qrcode_size"]').on('input propertychange', function() {
  91. var size = $(this).val();
  92. if(size != ''){
  93. var r = /^\+?[1-9][0-9]*$/;  //判断是否为正整数
  94. if(!r.test(size)){
  95. $('input[name="invite_poster_qrcode_size"]').val('');
  96. }
  97. if(size > 1280){
  98. $('input[name="invite_poster_qrcode_size"]').val(1280);
  99. }
  100. size = Math.round(size/2);
  101. $('.qrcode').css('width', size+"px");
  102. $('.qrcode').css('height', size+"px");
  103. var top = $('input[name="invite_poster_qrcode_top"]').val();
  104. var left = $('input[name="invite_poster_qrcode_left"]').val();
  105. if(!r.test(top)){
  106. top = 0;
  107. }
  108. if(!r.test(left)){
  109. left = 0;
  110. }
  111. if(size > 375){
  112. left = 0;
  113. }else{
  114. if(Math.round(left/2)+size > 375){
  115. left = Math.round(375 - size);
  116. }else{
  117. left = Math.round(left/2);
  118. }
  119. }
  120. if(size > 667){
  121. top = 0;
  122. }else{
  123. if(Math.round(top/2)+size > 667){
  124. top = Math.round(667 - size);
  125. }else{
  126. top = Math.round(top/2);
  127. }
  128. }
  129. $('.back_body .qrcode').each(function(index){
  130. $(this).myDrag({
  131. parent: '.back_body',
  132. randomPosition: false, //初始位置是否随机
  133. direction:'all', //方向
  134. handler:false, //把手
  135. dragStart:function(x,y){
  136. }, //拖动开始 x,y为当前坐标
  137. dragEnd:function(x,y){
  138. $("input[name='invite_poster_qrcode_top']").val(y*2);
  139. $("input[name='invite_poster_qrcode_left']").val(x*2);
  140. }, //拖动停止 x,y为当前坐标
  141. dragMove:function(x,y){
  142. } //拖动进行中 x,y为当前坐标
  143. });
  144. });
  145. $('.qrcode').css('top', top+'px');
  146. $('.qrcode').css('left', left+'px');
  147. $('input[name="invite_poster_qrcode_top"]').val(top*2);
  148. $('input[name="invite_poster_qrcode_left"]').val(left*2);
  149. }
  150. });
  151. var default_color = "#ffffff";
  152. $('.resetQrcodeBackColor').click(function(){
  153. $('#invite_poster_qrcode_backcolor-input').val(default_color);
  154. $('#invitePosterQrcodeBackColors').find('.layui-colorpicker-trigger-span').css('background',default_color);
  155. $('.colpick_full').hide();
  156. changeQrcode();
  157. });
  158. var line_color = "#000000";
  159. $('.resetQrcodeLineColor').click(function(){
  160. $('#invite_poster_qrcode_linecolor-input').val(line_color);
  161. $('#invitePosterQrcodeLineColors').find('.layui-colorpicker-trigger-span').css('background',line_color);
  162. $('.colpick_full').hide();
  163. changeQrcode();
  164. });
  165. var border_color = "#000000";
  166. $('.resetQrcodeBorderColor').click(function(){
  167. $('#invite_poster_qrcode_bordercolor-input').val(border_color);
  168. $('#invitePosterQrcodeBorderColors').find('.layui-colorpicker-trigger-span').css('background',border_color);
  169. $('.colpick_full').hide();
  170. var invite_poster_qrcode_border_status = $('input[name="invite_poster_qrcode_border_status"]:checked').val();
  171. if(invite_poster_qrcode_border_status == 1){
  172. $('.qrcode').css('border','1px solid '+border_color);
  173. }
  174. });
  175. $('.back_body .qrcode').each(function(index){
  176. $(this).myDrag({
  177. parent: '.back_body',
  178. randomPosition: false, //初始位置是否随机
  179. direction:'all', //方向
  180. handler:false, //把手
  181. dragStart:function(x,y){
  182. }, //拖动开始 x,y为当前坐标
  183. dragEnd:function(x,y){
  184. $("input[name='invite_poster_qrcode_top']").val(y*2);
  185. $("input[name='invite_poster_qrcode_left']").val(x*2);
  186. }, //拖动停止 x,y为当前坐标
  187. dragMove:function(x,y){
  188. } //拖动进行中 x,y为当前坐标
  189. });
  190. $('.qrcode').css('top',qrcode_top+'px');
  191. $('.qrcode').css('left',qrcode_left+'px');
  192. });
  193. function changeQrcode(){
  194. var qrcode_backcolor = $('input[name="invite_poster_qrcode_backcolor"]').val();
  195. var qrcode_linecolor = $('input[name="invite_poster_qrcode_linecolor"]').val();
  196. $.ajax({
  197. url: change_url,
  198. type: "post",
  199. data: {back_color: qrcode_backcolor, line_color : qrcode_linecolor},
  200. dataType:'json',
  201. success: function (result) {
  202. $('.qrcode img').attr('src', result.result.invite_poster_qrcode_img);
  203. $('input[name="invite_poster_qrcode_img"]').val(result.result.invite_poster_qrcode_img_yuan);
  204. }
  205. });
  206. }