index.html 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
  5. <title>二维码生成 - {$site.name}</title>
  6. <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  7. <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
  8. <!--[if lt IE 9]>
  9. <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
  10. <script src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.js"></script>
  11. <![endif]-->
  12. </head>
  13. <body>
  14. <div class="container">
  15. <h2>二维码生成</h2>
  16. <hr>
  17. <div class="well">
  18. <form action="" method="post">
  19. <div class="row">
  20. <div class="col-md-4">
  21. <div class="form-group">
  22. <label class="control-label">文本内容</label>
  23. <input type="text" name="text" class="form-control" placeholder="" value="http://www.fastadmin.net">
  24. </div>
  25. <div class="form-group">
  26. <label class="control-label">标签</label>
  27. <input type="text" name="label" placeholder="" class="form-control" value="FastAdmin">
  28. </div>
  29. <div class="form-group">
  30. <label class="control-label">Logo</label>
  31. <div class="form-inline">
  32. <div class="radio">
  33. <label>
  34. <input type="radio" name="logo" id="logoyes" value="1" checked="">
  35. 显示(Logo地址在代码中修改)
  36. </label>
  37. </div>
  38. <div class="radio">
  39. <label>
  40. <input type="radio" name="logo" id="logono" value="0">
  41. 不显示
  42. </label>
  43. </div>
  44. </div>
  45. </div>
  46. <div class="form-group">
  47. <input type="submit" class="btn btn-info" />
  48. <input type="reset" class="btn btn-default" />
  49. </div>
  50. </div>
  51. <div class="col-md-2">
  52. <div id="toastTypeGroup">
  53. <label>标签水平位置</label>
  54. <div class="form-group radio">
  55. <label><input type="radio" name="labelhalign" value="0" checked="">居中</label>
  56. </div>
  57. <div class="form-group radio">
  58. <label><input type="radio" name="labelhalign" value="1">左</label>
  59. </div>
  60. <div class="form-group radio">
  61. <label><input type="radio" name="labelhalign" value="2">左边框</label>
  62. </div>
  63. <div class="form-group radio">
  64. <label><input type="radio" name="labelhalign" value="3">左图片</label>
  65. </div>
  66. <div class="form-group radio">
  67. <label><input type="radio" name="labelhalign" value="4">右</label>
  68. </div>
  69. <div class="form-group radio">
  70. <label><input type="radio" name="labelhalign" value="5">右边框</label>
  71. </div>
  72. <div class="form-group radio">
  73. <label><input type="radio" name="labelhalign" value="6">右图片</label>
  74. </div>
  75. </div>
  76. <div id="positionGroup">
  77. <label>标签垂直位置</label>
  78. <div class="form-group radio">
  79. <label>
  80. <input type="radio" name="labelvalign" value="1">上
  81. </label>
  82. </div>
  83. <div class="form-group radio">
  84. <label>
  85. <input type="radio" name="labelvalign" value="2">上边框
  86. </label>
  87. </div>
  88. <div class="form-group radio">
  89. <label>
  90. <input type="radio" name="labelvalign" value="3" checked="">中
  91. </label>
  92. </div>
  93. <div class="form-group radio">
  94. <label>
  95. <input type="radio" name="labelvalign" value="4">下
  96. </label>
  97. </div>
  98. </div>
  99. </div>
  100. <div class="col-md-2">
  101. <div class="form-group">
  102. <div class="form-group">
  103. <label class="control-label">前景色</label>
  104. <input type="text" name="foreground" placeholder="" class="form-control" value="#ffffff">
  105. </div>
  106. <div class="form-group">
  107. <label class="control-label">背景色</label>
  108. <input type="text" name="background" placeholder="" class="form-control" value="#000000">
  109. </div>
  110. <div class="form-group">
  111. <label class="control-label">大小</label>
  112. <input type="number" name="size" placeholder="" class="form-control" value="300">
  113. </div>
  114. <div class="form-group">
  115. <label class="control-label">内边距</label>
  116. <input type="number" name="padding" placeholder="" class="form-control" value="10">
  117. </div>
  118. </div>
  119. </div>
  120. <div class="col-md-3">
  121. <div class="form-group">
  122. <label class="control-label">Logo大小</label>
  123. <input type="number" name="logosize" placeholder="" class="form-control" value="50">
  124. </div>
  125. <div class="form-group">
  126. <label class="control-label">标签大小</label>
  127. <input type="number" name="labelfontsize" placeholder="" class="form-control" value="14">
  128. </div>
  129. <div class="form-group">
  130. <div id="positionGroup">
  131. <label>容错级别</label>
  132. <div class="form-group radio">
  133. <label>
  134. <input type="radio" name="errorcorrection" value="low">低
  135. </label>
  136. </div>
  137. <div class="form-group radio">
  138. <label>
  139. <input type="radio" name="errorcorrection" value="medium" checked="">中等
  140. </label>
  141. </div>
  142. <div class="form-group radio">
  143. <label>
  144. <input type="radio" name="errorcorrection" value="quartile">高
  145. </label>
  146. </div>
  147. <div class="form-group radio">
  148. <label>
  149. <input type="radio" name="errorcorrection" value="high">超高
  150. </label>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. </form>
  157. </div>
  158. <input type="text" class="form-control" id='qrcodeurl' />
  159. <img src="" alt="" id='qrcodeimg' />
  160. </div>
  161. <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
  162. <script type="text/javascript">
  163. $(function () {
  164. $("form").submit(function () {
  165. $("#qrcodeimg").prop("src", "{:addon_url('qrcode/index/build',[],false)}?" + $(this).serialize());
  166. $("#qrcodeurl").val("{:addon_url('qrcode/index/build',[],false,true)}?" + $(this).serialize());
  167. return false;
  168. });
  169. $("form").trigger('submit');
  170. });
  171. </script>
  172. </body>
  173. </html>