scancode.html 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equv="X-UA-Compatible" content="IE=edge" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1" />
  7. <meta name="format-detection" content="telephone=no" />
  8. <title>潜山市党建引领信用村(社区)建设</title>
  9. <meta name="keywords" content="潜山市党建引领信用村(社区)建设">
  10. <meta name="description" content="潜山市党建引领信用村(社区)建设">
  11. <script src="static/js/vue.js"></script>
  12. <script type="text/javascript" src="static/js/vue-router.js"></script>
  13. <script src="static/js/index.js" type="text/javascript"></script>
  14. <script type="text/javascript" src="./static/js/jquery.min.js"></script>
  15. <script type="text/javascript" src="./static/js/qrcode.js"></script>
  16. <script src="static/js/common.js"></script>
  17. <link href="static/css/common.css" rel="stylesheet" />
  18. <link href="static/css/style.css" rel="stylesheet" />
  19. <link rel="stylesheet" href="static/css/theme-chalk/index.css">
  20. <style></style>
  21. </head>
  22. <body class="qscan">
  23. <div class="qscant">
  24. <div class="qusetimg"><img src="static/images/wback.png" class="backimg" /></div>
  25. 二维码出示
  26. </div>
  27. <div id="app" class="qsmain">
  28. <div style="flex: 1;">
  29. <div class="qsbox mb4">
  30. <img src="static/images/scantit.png" class="qsboxtimg" />
  31. <div>
  32. <div class="mb66">
  33. <div class="f26 cd3 tc mb7">{{creditLevel}}级 信用户</div>
  34. <div class="qscode">
  35. <div id="qrcode" class="qscodeimg"></div>
  36. <div class="qscodetit" v-if='!phoneNum'>暂无二维码</div>
  37. </div>
  38. <div class="f46 c0 fw tc" id="myTime"></div>
  39. </div>
  40. <div class="qslines">
  41. <div class="qsline flexc mb46">
  42. <i class="qslinea"></i>
  43. <div class="f26 cd3">人员姓名</div><i class="qslinea"></i>
  44. </div>
  45. </div>
  46. <div class="f3 c0 fw tc" v-if="userName">{{lookflag?userName:getHideFn(userName)}}</div>
  47. <div class="qslook" @click="getLook">
  48. <img src="static/images/nlook.png" class="qslooka" v-if='lookflag' />
  49. <img src="static/images/look.png" class="qslooka" v-else />
  50. <div class="cbf f24">{{lookflag?'隐藏':'显示'}}信息</div>
  51. </div>
  52. </div>
  53. </div>
  54. </div>
  55. <!-- <div class="qsfoot" style="justify-content: center;">
  56. <div class="qsfoota">
  57. <img src="static/images/fcode.png" class="qsfootb" />
  58. <div class="f26 c91">付款码</div>
  59. </div>
  60. <div class="qsfoota" @click="getCode">
  61. <img src="static/images/scode.png" class="qsfootb" />
  62. <div class="f26 c91">扫一扫</div>
  63. </div>
  64. </div> -->
  65. </div>
  66. </body>
  67. <script type="text/javascript">
  68. var app = new Vue({
  69. el: '#app',
  70. data: {
  71. base_url: 'http://118.31.23.65:5007/prod-api',
  72. timefn: '',
  73. useinfo: '',
  74. lookflag: false,
  75. idCard: '',
  76. menuId: '',
  77. recordType:'',
  78. recordName:'',
  79. userName: '',
  80. creditLevel: '',
  81. phoneNum: ''
  82. },
  83. created() {
  84. clearInterval(this.timefn)
  85. // 获取权益
  86. this.menuId = decodeURI(this.getQueryString("menuId")) || "";
  87. if(window.localStorage.getItem('userinfo')){
  88. var userinfo=JSON.parse(window.localStorage.getItem('userinfo'))
  89. this.idCard = userinfo.idCard||'';
  90. this.phoneNum = userinfo.phone||'';
  91. this.userName = userinfo.userName||'';
  92. this.creditLevel = userinfo.creditLevel||'';
  93. }
  94. this.gettimeFn();
  95. },
  96. mounted() {
  97. // 手机号
  98. if (this.phoneNum) {
  99. this.getCodeFn()
  100. } else {
  101. this.$message({
  102. message: "二维码生成异常",
  103. type: 'error',
  104. center: true,
  105. });
  106. }
  107. },
  108. // 页面销毁周期关闭相机
  109. beforeDestroy() {
  110. clearInterval(this.timefn)
  111. },
  112. methods: {
  113. // 获取当前时间
  114. getCurrentDate() {
  115. var date = new Date()
  116. var y = date.getFullYear();
  117. var m = date.getMonth() + 1;
  118. var d = date.getDate();
  119. var h = date.getHours();
  120. var min = date.getMinutes();
  121. var s = date.getSeconds();
  122. var week = date.getDay(); //获取当前星期X(0-6,0代表星期天)
  123. var weeks = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
  124. var yearStr = y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d) + ' '
  125. var timeStr = (h < 10 ? ('0' + h) : h) + ':' + (min < 10 ? ('0' + min) : min) + ':' + (s < 10 ? (
  126. '0' + s) : s);
  127. var time = yearStr + timeStr
  128. $("#myTime").html(time);
  129. },
  130. getCodeFn() {
  131. // 显示二维码
  132. // var nowtime = new Date().getTime()+(60*10*1000);
  133. // ,'time':nowtime
  134. var nesstr={"phone":this.phoneNum, "menuId":this.menuId,"idCard":this.idCard}
  135. // var d=this.phoneNum+'-'+this.menuId+'-'+this.idCard
  136. // var nesstr={"code":d}
  137. var s=encodeURIComponent(JSON.stringify(nesstr))
  138. new QRCode('qrcode', {
  139. text: s,
  140. // width: 128,
  141. // height: 128,
  142. // colorDark : "#000000",
  143. // colorLight : "#ffffff",
  144. // correctLevel : QRCode.CorrectLevel.H
  145. });
  146. },
  147. getUseFn() {
  148. var that = this;
  149. let params = {
  150. "idCard": that.idCard
  151. }
  152. $.ajax({
  153. url: this.base_url + '/system/h5/user/info',
  154. type: 'POST',
  155. data: JSON.stringify(params),
  156. dataType: 'json',
  157. success: function(res) {
  158. if (res.code == 200) {
  159. that.useinfo = res.data;
  160. if (res.data.phoneNum) {
  161. that.getCodeFn()
  162. } else {
  163. that.$message({
  164. message: "二维码生成异常",
  165. type: 'error',
  166. center: true,
  167. });
  168. }
  169. } else {
  170. that.$message({
  171. message: res.msg,
  172. type: 'error',
  173. center: true,
  174. });
  175. }
  176. }
  177. })
  178. },
  179. getHideFn(name) {
  180. if (name) {
  181. let enName = []
  182. if (name.length === 2) {
  183. return name[0] + '*'
  184. } else {
  185. let num = name.length - 2
  186. enName.push(name[0])
  187. for (let i = 0; i < num; i++) {
  188. enName.push('*')
  189. }
  190. enName.push(name[name.length - 1])
  191. return enName.join('')
  192. }
  193. }
  194. },
  195. // 扫一扫
  196. getCode() {
  197. // window.location.href="higin.html"
  198. },
  199. getLook() {
  200. this.lookflag = !this.lookflag
  201. },
  202. gettimeFn() {
  203. var that = this;
  204. that.timefn = setInterval(function() {
  205. that.getCurrentDate()
  206. }, 1000)
  207. // window.clearInterval(this.timefn);
  208. },
  209. getQueryString(name) {
  210. try {
  211. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  212. var r = window.location.href.split('?')[1].match(reg);
  213. // console.log(reg,r)
  214. if (r != null) {
  215. return r[2];
  216. }
  217. return ""; //如果此处只写return;则返回的是undefined
  218. } catch (e) {
  219. return ""; //如果此处只写return;则返回的是undefined
  220. }
  221. },
  222. },
  223. })
  224. </script>
  225. <script type="text/javascript">
  226. $(document).ready(function() {
  227. window.clearInterval(this.timefn);
  228. $('.backimg').click(function() {
  229. window.clearInterval(this.timefn);
  230. window.history.go(-1)
  231. })
  232. })
  233. </script>
  234. </html>