homebeta.vue 28 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006
  1. <template>
  2. <view class="container_main ">
  3. <!-- 不设置遮盖层的时候 -->
  4. <!-- 这是引导页mid_state 中转状态1使用2不使用 -->
  5. <!-- pay_company==1微信2支付宝3其他" -->
  6. <!-- 收款码 -->
  7. <block v-if="info.pay_company!=4">
  8. <block v-if="info.type==1">
  9. <block v-for="(item,index) of info.urls" :key='index'>
  10. <!-- pay_company==3聚合码 -->
  11. <block v-if="item.pay_company==3">
  12. <block v-if='info.mid_state==1'>
  13. <!-- 引导页的安全认证 -->
  14. <block v-if="info.mid_type==10086">
  15. <image class="container_img" @click="Copy_nav_ali" :data-url="item.url"
  16. src="../../merchant/static/images/web_ua.png"
  17. mode="aspectFill">
  18. </image>
  19. </block>
  20. <!-- 其他的引导页 -->
  21. <block v-else>
  22. <image :src="URL+info.mid_img" class="container_img" @click="Copy_nav_ali" :data-url="item.url" mode="aspectFill"></image>
  23. </block>
  24. </block>
  25. <block v-else>
  26. <block v-if="isclose">
  27. <view v-if="info.hj_state==2" class="model" @click="juhecode" :data-url="item.url"></view>
  28. <view class="model_s flex-center" v-else @click="juhecode" :data-url="item.url">
  29. <view class="">
  30. <view class="wave ripple danger">
  31. <view class="circle"></view>
  32. <view class="circle"></view>
  33. <view class="circle"></view>
  34. <view class="circle"></view>
  35. <view class="circle"></view>
  36. <view class="circle"></view>
  37. <view class="model_s_pa flex-center">
  38. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png" mode=""></image>
  39. </view>
  40. </view>
  41. <view class="model_s_text">
  42. 点击进入
  43. </view>
  44. </view>
  45. </view>
  46. </block>
  47. <web-view :src="item.url"></web-view>
  48. <!-- <iframe class="iFrame" id="iFrame"></iframe> -->
  49. </block>
  50. </block>
  51. <block v-else>
  52. <!-- mid_state==1配置引导页 -->
  53. <block v-if='info.mid_state==1'>
  54. <!-- 引导页的安全认证 -->
  55. <block v-if="info.mid_type==10086">
  56. <image v-if="is_ua=='WeiXIN'&&item.pay_company==1" class="container_img" @click="Copy_nav" :data-url="item.url"
  57. src="../../merchant/static/images/wx_ua.png" mode="aspectFill">
  58. </image>
  59. <image v-if="is_ua=='Alipay'&&item.pay_company==2" class="container_img" @click="Copy_nav_ali" :data-url="item.url"
  60. src="../../merchant/static/images/ali_ua.png" mode="aspectFill">
  61. </image>
  62. </block>
  63. <!-- 其他的引导页 -->
  64. <block v-else>
  65. <image v-if="is_ua=='WeiXIN'&&item.pay_company==1" :src="URL+info.mid_img" class="container_img" @click="Copy_nav"
  66. :data-url="item.url" mode="aspectFill"></image>
  67. <image v-if="item.pay_company==5" :src="URL+info.mid_img" class="container_img" @click="Copy_nav_ali" :data-url="item.url"
  68. mode="aspectFill"></image>
  69. <image v-if="is_ua=='false'&&item.pay_company==1" :src="URL+info.mid_img" class="container_img" @click="Copy_nav"
  70. :data-url="item.url" mode="aspectFill"></image>
  71. <image v-if="is_ua=='Alipay'&&item.pay_company==2" :src="URL+info.mid_img" class="container_img" @click="Copy_nav_ali"
  72. :data-url="item.url" mode="aspectFill"></image>
  73. </block>
  74. </block>
  75. <block v-else>
  76. <block v-if="isclose">
  77. <image v-if="item.pay_company==1" src="../../merchant/static/images/wx_code.png" style="width: 100%;height: 100%;" mode="widthFix"></image>
  78. <image v-if="item.pay_company==2" src="../../merchant/static/images/ali_code.png" style="width: 100%;height: 100%;" mode="widthFix"></image>
  79. <view class="model_s flex-center" v-if="item.pay_company==2" @click="Copy_nav_ali" :data-url="item.url">
  80. <view class="">
  81. <view class="wave ripple danger">
  82. <view class="circle"></view>
  83. <view class="circle"></view>
  84. <view class="circle"></view>
  85. <view class="circle"></view>
  86. <view class="circle"></view>
  87. <view class="circle"></view>
  88. <view class="model_s_pa flex-center">
  89. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png" mode=""></image>
  90. </view>
  91. </view>
  92. <view class="model_s_text">
  93. 点击进入
  94. </view>
  95. </view>
  96. </view>
  97. <view class="model_s flex-center" v-if="item.pay_company==1" @click="Copy_nav" :data-url="item.url">
  98. <view class="">
  99. <view class="wave ripple danger">
  100. <view class="circle"></view>
  101. <view class="circle"></view>
  102. <view class="circle"></view>
  103. <view class="circle"></view>
  104. <view class="circle"></view>
  105. <view class="circle"></view>
  106. <view class="model_s_pa flex-center">
  107. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png" mode=""></image>
  108. </view>
  109. </view>
  110. <view class="model_s_text">
  111. 点击进入
  112. </view>
  113. </view>
  114. </view>
  115. </block>
  116. </block>
  117. </block>
  118. </block>
  119. </block>
  120. <block v-else-if="info.type==4">
  121. <block v-if='mid_state==1'>
  122. <block v-if="mid_type==10086">
  123. <!-- 引导页的安全认证 -->
  124. <image v-if="is_ua=='WeiXIN'" class="container_img" @click="Copy_four" src="../../merchant/static/images/wx_ua.png" mode="aspectFill"></image>
  125. <image v-if="is_ua=='Alipay'" class="container_img" @click="Copy_four" src="../../merchant/static/images/ali_ua.png" mode="aspectFill"></image>
  126. <image v-if="is_ua=='false'" class="container_img" @click="Copy_four" src="../../merchant/static/images/web_ua.png" mode="aspectFill"></image>
  127. </block>
  128. <image v-else class="container_img" @click="Copy_four" :src="URL+info.mid_img" mode="aspectFill"></image>
  129. </block>
  130. <block v-else>
  131. <block v-if="info.is_real==2">
  132. <view v-if="hj_state==2" class="model" @click="Copy_four"></view>
  133. <view class="model_s flex-center" v-else @click="Copy_four">
  134. <view class="">
  135. <view class="wave ripple danger">
  136. <view class="circle"></view>
  137. <view class="circle"></view>
  138. <view class="circle"></view>
  139. <view class="circle"></view>
  140. <view class="circle"></view>
  141. <view class="circle"></view>
  142. <view class="model_s_pa flex-center">
  143. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png" mode=""></image>
  144. </view>
  145. </view>
  146. <view class="model_s_text">
  147. 点击进入
  148. </view>
  149. </view>
  150. </view>
  151. <web-view :src="url"></web-view>
  152. </block>
  153. <block v-else>
  154. <block v-if="isclose">
  155. <view v-if="hj_state==2" class="model" @click="close"></view>
  156. <view class="model_s flex-center" v-else @click="close">
  157. <view class="">
  158. <view class="wave ripple danger">
  159. <view class="circle"></view>
  160. <view class="circle"></view>
  161. <view class="circle"></view>
  162. <view class="circle"></view>
  163. <view class="circle"></view>
  164. <view class="circle"></view>
  165. <view class="model_s_pa flex-center">
  166. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png"></image>
  167. </view>
  168. </view>
  169. <view class="model_s_text">
  170. 点击进入
  171. </view>
  172. </view>
  173. </view>
  174. </block>
  175. <view class="flex-center" style="width: 100%;height: 100%;">
  176. <image style="width: 100%;" mode="widthFix" class="model_s_sz_original" :src="URL+info.img_file"></image>
  177. </view>
  178. </block>
  179. </block>
  180. </block>
  181. <block v-else>
  182. <block v-if='mid_state==1'>
  183. <block v-if="mid_type==10086">
  184. <!-- 引导页的安全认证 -->
  185. <image v-if="is_ua=='WeiXIN'" class="container_img" @click="Copy" src="../../merchant/static/images/wx_ua.png" mode="aspectFill"></image>
  186. <image v-if="is_ua=='Alipay'" class="container_img" @click="Copy" src="../../merchant/static/images/ali_ua.png" mode="aspectFill"></image>
  187. <image v-if="is_ua=='false'" class="container_img" @click="Copy" src="../../merchant/static/images/web_ua.png" mode="aspectFill"></image>
  188. </block>
  189. <image v-else class="container_img" @click="Copy" :src="URL+info.mid_img" mode="aspectFill"></image>
  190. </block>
  191. <block v-else>
  192. <!-- 公众号==2 -->
  193. <block v-if="info.type==2">
  194. <block v-if="isclose">
  195. <view v-if="hj_state==2" class="model" @click="wxclose"></view>
  196. <block v-else>
  197. <!-- 查看原文 -->
  198. <view v-if="info.hj_type==2" class="model" @click="close">
  199. <view class="model-look">
  200. <view class="">
  201. 查看全文 <image class="look" src="../../static/images/look.png" mode=""></image>
  202. </view>
  203. </view>
  204. </view>
  205. <view v-else class="model_s flex-center" @click="wxclose">
  206. <view>
  207. <view class="wave ripple danger">
  208. <view class="circle"></view>
  209. <view class="circle"></view>
  210. <view class="circle"></view>
  211. <view class="circle"></view>
  212. <view class="circle"></view>
  213. <view class="circle"></view>
  214. <view class="model_s_pa flex-center">
  215. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png" mode=""></image>
  216. </view>
  217. </view>
  218. <view class="model_s_text">
  219. 点击进入
  220. </view>
  221. </view>
  222. </view>
  223. </block>
  224. </block>
  225. <block v-if="isios">
  226. <iframe title referrerpolicy="no-referrer" class="iFrame" id="iFrames"></iframe>
  227. </block>
  228. <block v-else>
  229. <iframe title referrerpolicy="no-referrer" class="iFrame" id="iFrames" :scrolling="isclose?'no':'yes'">
  230. </iframe>
  231. </block>
  232. <view class="box-pack-between wx-nav" @click="WxNav">
  233. <view class="">
  234. <!-- 阅读全文 -->
  235. </view>
  236. <view class="flex-center">
  237. <view class="flex-y-center wx-nav-left">
  238. <image src="../../static/images/wx-zan.png" class="wx-zan"></image> 赞
  239. </view>
  240. <view class="flex-y-center">
  241. <image src="../../static/images/wx-look.png" class="wx-zan"></image> 在看
  242. </view>
  243. </view>
  244. </view>
  245. </block>
  246. <!-- 网站==3 -->
  247. <block v-else>
  248. <block v-if="isclose">
  249. <view v-if="hj_state==2" class="model" @click="close"></view>
  250. <block v-else>
  251. <!-- 查看原文 -->
  252. <view v-if="info.hj_type==2" class="model" @click="close">
  253. <view class="model-look">
  254. <view class="">
  255. 查看全文 <image class="look" src="../../static/images/look.png" mode=""></image>
  256. </view>
  257. </view>
  258. </view>
  259. <view v-else class="model_s flex-center" @click="close">
  260. <view class="">
  261. <view class="wave ripple danger">
  262. <view class="circle"></view>
  263. <view class="circle"></view>
  264. <view class="circle"></view>
  265. <view class="circle"></view>
  266. <view class="circle"></view>
  267. <view class="circle"></view>
  268. <view class="model_s_pa flex-center">
  269. <image class="model_s_sz" src="../../merchant/static/images/shouzhi.png" mode=""></image>
  270. </view>
  271. </view>
  272. <view class="model_s_text">
  273. 点击进入
  274. </view>
  275. </view>
  276. </view>
  277. </block>
  278. </block>
  279. <!--<web-view :src="url"></web-view> -->
  280. <block v-if="isios">
  281. <iframe title referrerpolicy="origin" :src="url" class="iFrame" id="iFrame"></iframe>
  282. </block>
  283. <block v-else>
  284. <iframe title referrerpolicy="origin" :src="url" class="iFrame" id="iFrame" :scrolling="isclose?'no':'yes'">
  285. </iframe>
  286. </block>
  287. <!-- <iframe title referrerpolicy="no-referrer" :src="url" class="iFrame" ></iframe> -->
  288. </block>
  289. <!-- 文章==end-->
  290. </block>
  291. </block>
  292. </block>
  293. </view>
  294. </template>
  295. <script>
  296. // import Clipboard from 'clipboard';
  297. // #ifdef H5
  298. import getWXSign from "@/static/js/config.js";
  299. // #endif
  300. export default {
  301. data() {
  302. return {
  303. list: [],
  304. total: 0,
  305. page: 1,
  306. url: "",
  307. content: "",
  308. iscopy: true,
  309. info: {},
  310. URL: getApp().globalData.URL,
  311. windowWidth: uni.getSystemInfoSync().windowWidth,
  312. isclose: true,
  313. istrue: true,
  314. mid_state: 1,
  315. is_ua: "",
  316. mid_type: "",
  317. hj_state: "",
  318. is_real: "",
  319. isios: false,
  320. }
  321. },
  322. onLoad(e) {
  323. const oMeta = document.createElement('meta');
  324. oMeta.name = "referrer";
  325. oMeta.content = "never";
  326. document.getElementsByTagName('head')[0].appendChild(oMeta);
  327. if (/iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
  328. this.isios = true;
  329. }
  330. function getUrlParam(paraName) {
  331. let url = window.location.href;
  332. var arrObj = url.split("?");
  333. if (arrObj.length > 1) {
  334. var arr;
  335. for (var i = 0; i < arrObj.length; i++) {
  336. arr = arrObj[i].split("=");
  337. // console.log(arr)
  338. if (arr != null && arr[0] == paraName) {
  339. return arr[1];
  340. // var strs = arr[1].split("&");
  341. // console.log(strs)
  342. // return strs[0];
  343. }
  344. }
  345. return "";
  346. } else {
  347. return "";
  348. }
  349. }
  350. this.http(getUrlParam('card_num'));
  351. },
  352. onReady(e) {
  353. this.is_ua = IsWeixinOrAlipay();
  354. // console.log(this.is_ua);
  355. // alert(this.is_ua)
  356. function IsWeixinOrAlipay() {
  357. var ua = window.navigator.userAgent.toLowerCase();
  358. //判断是不是微信
  359. if (ua.match(/MicroMessenger/i) == 'micromessenger') {
  360. return "WeiXIN";
  361. }
  362. //判断是不是支付宝
  363. if (ua.match(/AlipayClient/i) == 'alipayclient') {
  364. return "Alipay";
  365. }
  366. //哪个都不是
  367. return "false";
  368. }
  369. },
  370. onReachBottom(e) {
  371. },
  372. methods: {
  373. http(card_num) {
  374. this.request({
  375. url: "funeng/scan",
  376. data: {
  377. card_num: card_num,
  378. },
  379. }).then(res => {
  380. // console.log(res, "res")
  381. if (res.code == '200') {
  382. var a = document.createElement('a');
  383. if (res.data.url) {
  384. a.href = res.data.url;
  385. if ("boss.passiontec.cn" == a.host) {
  386. const oMeta = document.createElement('meta');
  387. oMeta.name = "viewport";
  388. oMeta.content = "width=720";
  389. document.getElementsByTagName('head')[0].appendChild(oMeta);
  390. }
  391. }
  392. this.info = res.data;
  393. this.url = res.data.url;
  394. this.content = res.data.way_power.replace(/<br\s*\/?\s*>/ig, "\n");
  395. this.mid_state = res.data.mid_state;
  396. this.mid_type = res.data.mid_type;
  397. this.hj_state = res.data.hj_state;
  398. var title = "";
  399. if (res.data.mid_state == 1 && res.data.mid_title) {
  400. title = res.data.mid_title;
  401. } else if (res.data.wx_state == 1 && res.data.wx_title) {
  402. title = res.data.wx_title;
  403. } else {
  404. title = "";
  405. }
  406. uni.setNavigationBarTitle({
  407. title: title
  408. });
  409. if (res.data.pay_company == 4) {
  410. for (let i of res.data.urls) {
  411. if (i.pay_company == 4) {
  412. window.location.href = i.url + "?card_num=" + card_num;
  413. }
  414. }
  415. }
  416. if (res.data.type == 2 || res.data.type == 3 || res.data.type == 4) {
  417. // 网站赋能 type=3
  418. if (res.data.type == 3) {
  419. if (res.data.wx_title) {
  420. this.wxShare(res);
  421. } else {
  422. // this.Crawler(res);
  423. }
  424. } else {
  425. this.wxShare(res);
  426. }
  427. if (res.data.type == 2) {
  428. setTimeout(() => {
  429. let html = res.data.url_content;
  430. html = html.replace(/data-src/g, "src")
  431. html = html.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/g, '')
  432. html = html.replace(/https/g, "http");
  433. let html_src=html;
  434. // let iframeHtml = document.getElementById('iFrame');
  435. var pattern = /<meta.*?property="og:url".*?content="(.*?)".*?>/i;
  436. var arr = pattern.exec(html);
  437. let biz = getUrlParam(arr[1])[0];
  438. function getUrlParam(url) {
  439. var arrObj = url.split("?");
  440. if (arrObj.length > 1) {
  441. var arr;
  442. for (var i = 0; i < arrObj.length; i++) {
  443. arr = arrObj[i].split("&");
  444. }
  445. return arr;
  446. }
  447. }
  448. let iframe = document.getElementById('iFrames');
  449. iframe.src = html_src;
  450. var doc = iframe.contentDocument || iframe.document;
  451. doc.write(html_src);
  452. doc.getElementById("js_content").style.visibility = "visible";
  453. doc.getElementById("js_name").addEventListener('click', showMsg, false); //鼠标单击的时候调用showMes这个函数
  454. function showMsg() {
  455. window.location.href = `https://mp.weixin.qq.com/mp/profile_ext?action=home&${biz}#wechat_redirect`
  456. }
  457. // uni.getSystemInfo({
  458. // success: (res) => {
  459. // if (res.platform == 'ios') {
  460. // html_src = html;
  461. // iframeHtml.contentWindow.document.write(html_src)
  462. // } else {
  463. // html_src = '<meta name="referrer" content="never">' + html;
  464. // iframeHtml.srcdoc = html_src;
  465. // }
  466. // }
  467. // });
  468. }, 500)
  469. }
  470. }
  471. }
  472. }).catch((res) => {
  473. this.iscopy = false
  474. // console.log(res, "card_num=20ttp")
  475. uni.showToast({
  476. title: res.message,
  477. icon: 'none'
  478. })
  479. });
  480. },
  481. // 摘取网站信息
  482. Crawler(e) {
  483. this.request({
  484. url: "Exchange/Crawler",
  485. data: {
  486. url: e.data.url,
  487. },
  488. method: "GET",
  489. }).then(res => {
  490. console.log(res, "res")
  491. if (res.code === '200') {
  492. e.data.wx_title = res.data.title;
  493. e.data.wx_desc = res.data.desc;
  494. e.data.wximg_url = res.data.img;
  495. this.wxShare(e);
  496. }
  497. });
  498. },
  499. wxShare(res) {
  500. var imgUrl = res.data.wximg_url ? res.data.wximg_url : getApp().globalData.URL + res.data.wx_img;
  501. var super_id= this.info.super_id;
  502. getWXSign(super_id).then(r => {
  503. console.log(r, "imgURL")
  504. if (r) {
  505. if (/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
  506. this.$wx.updateAppMessageShareData({
  507. title: res.data.wx_title ? res.data.wx_title : "", // 分享标题
  508. desc: res.data.wx_desc ? res.data.wx_desc : "", // 分享描述
  509. link: window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  510. imgUrl: imgUrl, // 分享图标
  511. success: (res) => {
  512. // 设置成功
  513. console.log("设置成功", res)
  514. }
  515. })
  516. this.$wx.updateTimelineShareData({
  517. title: res.data.wx_title, // 分享标题
  518. link: window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  519. imgUrl: imgUrl, // 分享图标
  520. success: (res) => {
  521. // 设置成功
  522. console.log("设置成功", res)
  523. }
  524. })
  525. } else {
  526. // alert("pc")
  527. this.$wx.onMenuShareTimeline({
  528. title: res.data.wx_title, // 分享标题
  529. desc: res.data.wx_desc, // 分享描述
  530. link: window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  531. imgUrl: imgUrl, // 分享图标
  532. success: (res) => {
  533. // 设置成功
  534. console.log("设置成功", res)
  535. }
  536. })
  537. this.$wx.onMenuShareAppMessage({
  538. title: res.data.wx_title, // 分享标题
  539. desc: res.data.wx_desc, // 分享描述
  540. link: window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
  541. imgUrl: imgUrl, // 分享图标
  542. success: (res) => {
  543. // 设置成功
  544. console.log("设置成功", res)
  545. }
  546. })
  547. }
  548. }
  549. })
  550. },
  551. WxNav(e){
  552. window.location.href = this.url;
  553. },
  554. juhecode(e) {
  555. // console.log(e, "dddd")
  556. // return
  557. let content = this.content;
  558. this.isclose = false;
  559. if (!document.queryCommandSupported('copy')) {
  560. // 不支持
  561. return false
  562. }
  563. let textarea = document.createElement("textarea")
  564. textarea.value = content
  565. textarea.readOnly = "readOnly"
  566. document.body.appendChild(textarea)
  567. textarea.select() // 选择对象
  568. textarea.setSelectionRange(0, content.length) //核心
  569. let result = document.execCommand("copy") // 执行浏览器复制命令
  570. window.location.href = e.currentTarget.dataset.url;
  571. // this.url;
  572. textarea.remove();
  573. return result
  574. },
  575. // 遮盖层复制
  576. close(e) {
  577. // console.log(e)
  578. let content = this.content;
  579. this.isclose = false;
  580. if (!document.queryCommandSupported('copy')) {
  581. // 不支持
  582. return false
  583. }
  584. let textarea = document.createElement("textarea")
  585. textarea.value = content
  586. textarea.readOnly = "readOnly"
  587. document.body.appendChild(textarea)
  588. textarea.select() // 选择对象
  589. textarea.setSelectionRange(0, content.length) //核心
  590. let result = document.execCommand("copy") // 执行浏览器复制命令
  591. // console.log("gggg", result)
  592. textarea.remove();
  593. return result
  594. },
  595. wxclose(e) {
  596. // console.log(e)
  597. let content = this.content;
  598. this.isclose = false;
  599. if (!document.queryCommandSupported('copy')) {
  600. // 不支持
  601. return false
  602. }
  603. let textarea = document.createElement("textarea")
  604. textarea.value = content
  605. textarea.readOnly = "readOnly"
  606. document.body.appendChild(textarea)
  607. textarea.select() // 选择对象
  608. textarea.setSelectionRange(0, content.length) //核心
  609. let result = document.execCommand("copy") // 执行浏览器复制命令
  610. // console.log("gggg", result)
  611. textarea.remove();
  612. // window.location.href = this.url;
  613. return result
  614. },
  615. // 引导页复制跳转
  616. Copy() {
  617. let content = this.content;
  618. if (!document.queryCommandSupported('copy')) {
  619. // 不支持
  620. return false
  621. }
  622. let textarea = document.createElement("textarea")
  623. textarea.value = content
  624. textarea.readOnly = "readOnly"
  625. document.body.appendChild(textarea)
  626. textarea.select() // 选择对象
  627. textarea.setSelectionRange(0, content.length) //核心
  628. let result = document.execCommand("copy") // 执行浏览器复制命令
  629. textarea.remove();
  630. window.location.href = this.url;
  631. return result
  632. },
  633. Copy_four(e) {
  634. let content = this.content;
  635. if (!document.queryCommandSupported('copy')) {
  636. // 不支持
  637. return false
  638. }
  639. let textarea = document.createElement("textarea")
  640. textarea.value = content
  641. textarea.readOnly = "readOnly"
  642. document.body.appendChild(textarea)
  643. textarea.select() // 选择对象
  644. textarea.setSelectionRange(0, content.length) //核心
  645. let result = document.execCommand("copy") // 执行浏览器复制命令
  646. textarea.remove();
  647. // wx.previewImage({
  648. // current: '',
  649. // 当前显示图片的http链接
  650. // urls:['https://www.zchys.net/uploads/images/20220223/32dc33e3a4245788f1d6b9440d15a061.jpg'], // 需要预览的图片http链接列表
  651. // })
  652. this.$wx.previewImage({
  653. urls:['https://www.zchys.net/uploads/images/20220223/32dc33e3a4245788f1d6b9440d15a061.jpg'],
  654. success: (res) => {
  655. // 设置成功
  656. console.log("设置成功", res)
  657. }
  658. })
  659. // uni.previewImage({
  660. // urls: ['https://www.zchys.net/uploads/images/20220223/32dc33e3a4245788f1d6b9440d15a061.jpg'],
  661. // });
  662. return
  663. if (this.info.is_real == 1) {
  664. uni.navigateTo({
  665. url: "original?imagePath=" + this.info.img_file,
  666. })
  667. } else {
  668. window.location.href = this.url;
  669. }
  670. return result
  671. },
  672. Copy_nav(e) {
  673. let content = this.content;
  674. if (!document.queryCommandSupported('copy')) {
  675. // 不支持
  676. return false
  677. }
  678. let textarea = document.createElement("textarea")
  679. textarea.value = content
  680. textarea.readOnly = "readOnly"
  681. document.body.appendChild(textarea)
  682. textarea.select() // 选择对象
  683. textarea.setSelectionRange(0, content.length) //核心
  684. let result = document.execCommand("copy") // 执行浏览器复制命令
  685. textarea.remove();
  686. // window.location.href = e.currentTarget.dataset.url;
  687. uni.navigateTo({
  688. url: "pay_code?paycode_img=" + encodeURI(e.currentTarget.dataset.url),
  689. })
  690. return result
  691. },
  692. Copy_nav_ali(e) {
  693. // alert("Copy_nav_ali")
  694. let content = this.content;
  695. if (!document.queryCommandSupported('copy')) {
  696. // 不支持
  697. return false
  698. }
  699. let textarea = document.createElement("textarea")
  700. textarea.value = content
  701. textarea.readOnly = "readOnly"
  702. document.body.appendChild(textarea)
  703. textarea.select() // 选择对象
  704. textarea.setSelectionRange(0, content.length) //核心
  705. let result = document.execCommand("copy") // 执行浏览器复制命令
  706. textarea.remove();
  707. window.location.href = e.currentTarget.dataset.url;
  708. return result
  709. },
  710. },
  711. }
  712. </script>
  713. <style>
  714. page {
  715. height: 100%;
  716. width: 100%;
  717. }
  718. .wx-nav{
  719. padding: 20rpx;font-size: 28rpx;
  720. /* border-top: 2rpx solid #ccc; */
  721. }
  722. .wx-nav-left{
  723. margin-right: 30rpx;
  724. }
  725. .wx-zan{
  726. width:30rpx;
  727. height: 30rpx;
  728. margin-right: 15rpx;
  729. }
  730. .container_main {
  731. height: 100%;
  732. width: 100%;
  733. text-align: center;
  734. }
  735. .iFrame {
  736. height: 100%;
  737. width: 100%;
  738. border: none;
  739. }
  740. .container_main .container_img {
  741. height: 100%;
  742. width: 100%;
  743. position: fixed;
  744. z-index: 999;
  745. left: 0;
  746. }
  747. .model {
  748. height: 100%;
  749. width: 100%;
  750. position: fixed;
  751. z-index: 999;
  752. left: 0;
  753. top: 0;
  754. /* background: rgba(0,0,0,0.8); */
  755. }
  756. .model_s {
  757. height: 100%;
  758. width: 100%;
  759. position: fixed;
  760. z-index: 999;
  761. left: 0;
  762. top: 0;
  763. background: rgba(0, 0, 0, 0.5);
  764. }
  765. .model_s_pa {
  766. position: absolute;
  767. width: 300rpx;
  768. height: 300rpx;
  769. }
  770. .model_s_sz {
  771. width: 160rpx;
  772. height: 160rpx;
  773. margin-top: 52rpx;
  774. margin-left: 24rpx;
  775. }
  776. .model_s_text {
  777. font-size: 40rpx;
  778. color: #FFFFFF;
  779. }
  780. .model-look {
  781. background: rgba(255, 255, 255, 0.9);
  782. position: fixed;
  783. bottom: 0px;
  784. width: 100%;
  785. color: #1296db;
  786. padding-top: 30rpx;
  787. border-top: 1rpx solid #f1f1f1;
  788. height: 600rpx;
  789. }
  790. .look {
  791. margin-left: 10rpx;
  792. width: 30rpx;
  793. height: 30rpx;
  794. }
  795. .container_title {
  796. font-size: 48rpx;
  797. font-family: Source Han Sans CN, Source Han Sans CN-Medium;
  798. margin-top: 90rpx;
  799. padding: 0 20rpx;
  800. }
  801. .container_desc {
  802. padding: 0 20rpx;
  803. margin-top: 50rpx;
  804. font-size: 38rpx;
  805. font-family: Source Han Sans CN, Source Han Sans CN-Medium;
  806. }
  807. .go_btn_pf {
  808. /* position: fixed; */
  809. /* bottom: 40rpx; */
  810. width: 100%;
  811. margin-top: 130rpx;
  812. font-size: 32rpx;
  813. }
  814. .go_btn {
  815. width: 630rpx;
  816. background: rgb(64, 158, 255);
  817. color: #FFFFFF;
  818. }
  819. /************以下为具体实现************/
  820. .wave {
  821. position: relative;
  822. width: 300rpx;
  823. height: 300rpx;
  824. text-align: center;
  825. font-size: 28rpx;
  826. margin: 0 auto;
  827. }
  828. .wave .circle {
  829. position: absolute;
  830. border-radius: 50%;
  831. opacity: 0;
  832. }
  833. /* 波纹效果 */
  834. .wave.ripple .circle {
  835. width: calc(100% - 6px);
  836. /* 减去边框的大小 */
  837. height: calc(100% - 6px);
  838. /* 减去边框的大小 */
  839. border: 3px solid #fff;
  840. }
  841. .wave.ripple .circle:first-child {
  842. animation: circle-opacity 2s infinite;
  843. }
  844. .wave.ripple .circle:nth-child(2) {
  845. animation: circle-opacity 2s infinite;
  846. animation-delay: 0.3s;
  847. }
  848. .wave.ripple .circle:nth-child(3) {
  849. animation: circle-opacity 2s infinite;
  850. animation-delay: 0.6s;
  851. }
  852. .wave.ripple .circle:nth-child(4) {
  853. animation: circle-opacity 2s infinite;
  854. animation-delay: 0.8s;
  855. }
  856. .wave.ripple .circle:nth-child(5) {
  857. animation: circle-opacity 2s infinite;
  858. animation-delay: 1s;
  859. }
  860. .wave.ripple .circle:nth-child(6) {
  861. animation: circle-opacity 2s infinite;
  862. animation-delay: 1.2s;
  863. }
  864. .wave.ripple.danger {
  865. color: #FFFFFF;
  866. }
  867. .wave.ripple.danger .circle {
  868. border-color: #FFFFFF;
  869. }
  870. .wave.ripple.warning {
  871. color: orange;
  872. }
  873. .wave.ripple.warning .circle {
  874. border-color: orange;
  875. }
  876. /* 波动效果 */
  877. /*
  878. .wave.solid .circle {
  879. width: 100%;
  880. height: 100%;
  881. background: #fff;
  882. }
  883. .wave.solid .circle:first-child {
  884. animation: circle-opacity 2s infinite;
  885. }
  886. .wave.solid.danger {
  887. color: red;
  888. }
  889. .wave.solid.danger .circle {
  890. background: red;
  891. }
  892. .wave.solid.warning {
  893. color: orange;
  894. }
  895. .wave.solid.warning .circle {
  896. background: orange;
  897. } */
  898. @keyframes circle-opacity {
  899. from {
  900. opacity: 1;
  901. transform: scale(0);
  902. }
  903. to {
  904. opacity: 0;
  905. transform: scale(1);
  906. }
  907. }
  908. </style>