newyear1.html 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <link rel="icon" href="/static/image/logo.png">
  8. <!--<link href="https://cdn.jsdelivr.net/npm/@mdi/font@6.x/css/materialdesignicons.min.css" rel="stylesheet">-->
  9. <link href="/static/plugs/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet">
  10. <link href="/static/plugs/vuetify/vuetify.css" rel="stylesheet">
  11. <!-- 引入样式 -->
  12. <link rel="stylesheet" href="/static/plugs/iview/styles/iview.css">
  13. <title>新年拜帖</title>
  14. <style>
  15. [v-cloak] {
  16. display: none !important;
  17. }
  18. body{
  19. color: #000;
  20. }
  21. .page{
  22. background-image: url("/static/image/newyear/bg.png");
  23. background-size: 100% 100%;
  24. }
  25. .page2,.page3{
  26. background-image: url("/static/image/newyear/bg2.png");
  27. background-size: 100% 100%;
  28. }
  29. .page1{
  30. display: flex;
  31. flex-direction:column;
  32. align-items: center;
  33. justify-content: center;
  34. }
  35. .page1 .div1{
  36. /**background-image: url("/static/image/newyear/img1.png");**/
  37. background-size: 100% 100%;
  38. width: 70%;
  39. height: 38%;
  40. margin-top: -15%;
  41. padding: 1em;
  42. }
  43. .page1 .div1 .div1-1,.page1 .div1 .div1-3{
  44. background-image: url("/static/image/newyear/img1_1.png");
  45. height: 10%;
  46. width: 100%;
  47. background-size: 100% 100%;
  48. z-index: 10;
  49. position: relative;
  50. }
  51. .page1 .div1 .div1-3{
  52. margin-top:-5%;
  53. z-index: 10;
  54. }
  55. .page1 .div1 .div1-2{
  56. background-image: url("/static/image/newyear/img1_2.png");
  57. height: 85%;
  58. width: 80%;
  59. background-size: 100% 100%;
  60. margin: 0 auto;
  61. margin-top:-5%;
  62. z-index: 1;
  63. }
  64. .page1 .div1 .msg_div{
  65. padding: 0.7em;
  66. display: flex;
  67. flex-direction:row;
  68. height: 100%;
  69. }
  70. .page1 .div0{
  71. padding-bottom: 3em;
  72. padding-top: -10%;
  73. }
  74. .page1 .div0 .msg1{
  75. width: 100%;
  76. font-size:3em;
  77. color: #f2c21f;
  78. text-align: center;
  79. line-height: 1.5em;
  80. padding-bottom: 0.5em;
  81. }
  82. .page1 .div1 .msg_div .msg2{
  83. height: 100%;
  84. padding: 0.5em;
  85. flex-grow: 1;
  86. text-align: center;
  87. }
  88. .page1 .div1 .msg_div .msg2 img {
  89. width:80%;
  90. height: 100%;
  91. object-fit: contain;
  92. }
  93. .page2 .div{
  94. padding: 2em;
  95. text-align: center;
  96. height: 100%;
  97. }
  98. .page2 .div .update_btn_div{
  99. margin-top: 2em;
  100. }
  101. .page2 .update_btn_div .btn1,.page2 .image_div .btn ,.page3 .div4 .btn{
  102. background:#e79713;
  103. color: #9a021a;
  104. width: 60%;
  105. text-align: center;
  106. border-radius: 5px;
  107. margin: 0 auto;
  108. padding-top: 0.5em;
  109. padding-bottom: 0.5em;
  110. }
  111. .page2 .input_div textarea{
  112. background:rgba(255, 255, 255, 0.5);
  113. }
  114. .page2 .up_info_div{
  115. text-align: left;
  116. padding-top: 1em;
  117. min-height: 10%;
  118. width: 80%;
  119. margin:0 auto;
  120. font-size: 18px;
  121. word-wrap:break-word;
  122. word-break:normal;
  123. letter-spacing:2px;
  124. color: #e2ae69;
  125. }
  126. .page2 .image_div .upload_img_div{
  127. height: 100%;
  128. position: relative;
  129. }
  130. .page2 .image_div
  131. {
  132. height: 45%;
  133. margin-top: 2em;
  134. }
  135. .page2 .image_div .row{
  136. display: flex;
  137. flex-direction: row;
  138. padding: 0 2.5em;
  139. height: 35%;
  140. }
  141. .page2 .image_div .row div{
  142. flex-grow: 1;
  143. height: 100%;
  144. padding: 0.3em;
  145. }
  146. .page2 .image_div .btn{
  147. font-size: 14px;
  148. height: auto !important;
  149. position: absolute;
  150. bottom: 10%;
  151. width: 70%;
  152. left: 15%;
  153. padding-top: 0.5em;
  154. padding-bottom: 0.5em;
  155. padding-top: 0.3em !important;
  156. padding-bottom: 0.3em !important;
  157. }
  158. #uploadfile{
  159. visibility: hidden;
  160. }
  161. .page3{
  162. padding: 2em;
  163. }
  164. .page3 .div1,.page3 .div3{
  165. padding-top: 1em;
  166. display: flex;
  167. flex-direction: row;
  168. }
  169. .page3 .div1
  170. {
  171. padding-top: 20%;
  172. }
  173. .page3 .div1 .div1-1{
  174. /*flex-grow: 1;*/
  175. width: 40%;
  176. }
  177. .page3 .div1 .div1-2{
  178. width: 60%;
  179. }
  180. .page3 .div3 .div3-1,.page3 .div3 .div3-2{
  181. /*flex-grow: 1;*/
  182. width: 50%;
  183. }
  184. .page3 .div1 .div1-1{
  185. text-align: center;
  186. }
  187. .page3 .div1 .div1-2{
  188. font-weight: bold;
  189. font-size: 20px;
  190. }
  191. .page3 .div2{
  192. padding: 2em;
  193. font-size: 20px;
  194. letter-spacing:2px;
  195. padding-top: 20%;
  196. padding-bottom: 20%;
  197. color: #e79713;
  198. }
  199. .page3 .div3{
  200. padding: 1em;
  201. font-size: 18px;
  202. }
  203. .page3 .div3 .div3-2{
  204. display: flex;
  205. flex-direction: column;
  206. align-items: center;
  207. padding-left: 0.5em;
  208. letter-spacing:2px;
  209. font-size: 18px;
  210. }
  211. .page3 .logo{
  212. width: 40%;
  213. object-fit: contain;
  214. }
  215. .page3 .watch{
  216. width: 80%;
  217. object-fit: contain;
  218. }
  219. .page3 .div4 .btn{
  220. font-size: 20px;
  221. }
  222. audio{
  223. visibility: hidden;
  224. }
  225. .loading{
  226. display: flex;
  227. flex-direction: row;
  228. align-items: center;
  229. color:#e79713;
  230. background: #9a021a;
  231. }
  232. .loading .content{
  233. margin: 0 auto;
  234. }
  235. .loading .content i{
  236. font-size: 100px;
  237. color:#e79713;
  238. }
  239. .hidden{
  240. visibility: hidden;
  241. height: 0px;
  242. overflow: hidden;
  243. }
  244. .control{
  245. position: fixed;
  246. bottom: 1em;
  247. right: 0.5em;
  248. width: 15%;
  249. height: 5%;
  250. z-index: 10;
  251. }
  252. .control .img{
  253. height: 100%;
  254. width: 100%;
  255. }
  256. .page3 .div2 .div2-mgs{
  257. display: flex;
  258. justify-content:start;
  259. padding-top: 1em;
  260. align-items: center;
  261. }
  262. .page3 .div2 .div2-msg0{
  263. font-size: 1.3em;
  264. }
  265. .page3 .div2 .div2-mgs .item{
  266. /*height: 1.5em;*/
  267. }
  268. .page3 .div2 .div2-mgs .icon{
  269. height: 1.5em;
  270. display: flex;
  271. align-items: center;
  272. }
  273. .page3 .div2 .div2-mgs .item img{
  274. height: 1em;
  275. }
  276. .page3 .div2 .div2-mgs .telno{
  277. height: 1.5em;
  278. line-height: 1.5em;
  279. padding-left: 1em;
  280. font-size: 1.5em;
  281. font-weight: bold;
  282. }
  283. </style>
  284. </head>
  285. <body>
  286. <div id="app" v-cloak>
  287. <audio src="/static/image/newyear/music1.mp3" loop="loop" preload="auto" id="bg-music">
  288. </audio>
  289. <div v-if="isloading" class="loading">
  290. <div class="content"><v-icon>fa fa-spinner fa-spin</v-icon></div>
  291. </div>
  292. <div :class="{hidden:isloading}">
  293. <div class="control">
  294. <img v-if="!isbottom" src="/static/image/newyear/up.gif" alt="" class="img">
  295. <img v-else src="/static/image/newyear/down.gif" alt="" class="img">
  296. </div>
  297. <div class="page page1">
  298. <div class="div0" v-if="upinfo">
  299. <div class="msg1">
  300. {{upinfo.userinfo.wname}}<br>祝您新年快乐
  301. </div>
  302. </div>
  303. <div class="div1">
  304. <div class="div1-1">
  305. </div>
  306. <div class="div1-2">
  307. <div class="msg_div" >
  308. <div class="msg2">
  309. <img src="/static/image/newyear/img1_3_1.png" alt="">
  310. </div>
  311. </div>
  312. </div>
  313. <div class="div1-3">
  314. </div>
  315. </div>
  316. </div>
  317. <div class="page page2">
  318. <div class="div">
  319. <div class="update_btn_div">
  320. <div v-if="isnew">
  321. <div class="btn1" v-if="!isupdateinfo" @click="updateinfo">
  322. 点&nbsp;击&nbsp;修&nbsp;改&nbsp;文&nbsp;字
  323. </div>
  324. <div class="btn1" v-else @click="saveinfo">
  325. 点&nbsp;击&nbsp;保&nbsp;存&nbsp;文&nbsp;字
  326. </div>
  327. </div>
  328. </div>
  329. <div class="up_info_div">
  330. <div v-if="isupdateinfo && isnew">
  331. <div class="input_div">
  332. <v-textarea name="info" v-model="up_info" rows="3" :value="up_info" :hint="up_info_str"></v-textarea>
  333. </div>
  334. </div>
  335. <div v-else>
  336. <pre>{{ up_info }}</pre>
  337. </div>
  338. </div>
  339. <div class="image_div">
  340. <div id="uploadfile_div">
  341. <input type="file" accept="image/*" id="uploadfile">
  342. </div>
  343. <div class="row row1">
  344. <div>
  345. <div class="upload_img_div" id="img1" :style="{ 'background-image': imglist[0] }">
  346. <div class="btn" v-if="isnew" @click="uploadimg" data-index="1">点击上传</div>
  347. </div>
  348. </div>
  349. <div>
  350. <div class="upload_img_div" id="img2" data-index="2">
  351. <div class="btn" v-if="isnew" @click="uploadimg" data-index="2">点击上传</div>
  352. </div>
  353. </div>
  354. </div>
  355. <div class="row row1">
  356. <div>
  357. <div class="upload_img_div" id="img3" data-index="3">
  358. <div class="btn" v-if="isnew" @click="uploadimg" data-index="3">点击上传</div>
  359. </div>
  360. </div>
  361. <div>
  362. <div class="upload_img_div" id="img4" data-index="4">
  363. <div class="btn" v-if="isnew" @click="uploadimg" data-index="4">点击上传</div>
  364. </div>
  365. </div>
  366. </div>
  367. <div class="row row1">
  368. <div>
  369. <div class="upload_img_div" id="img5" data-index="5">
  370. <div class="btn" v-if="isnew" @click="uploadimg" data-index="5">点击上传</div>
  371. </div>
  372. </div>
  373. <div>
  374. <div class="upload_img_div" id="img6" data-index="6">
  375. <div class="btn" v-if="isnew" @click="uploadimg" data-index="6">点击上传</div>
  376. </div>
  377. </div>
  378. </div>
  379. </div>
  380. </div>
  381. </div>
  382. <div class="page page3">
  383. <div class="div1">
  384. <div class="div1-1">
  385. <img src="/static/image/newyear/logo.png" alt="" class="logo">
  386. </div>
  387. <div class="div1-2" >
  388. <p>水猫工匠平台</p>
  389. <p>专注于招工找活</p>
  390. </div>
  391. </div>
  392. <div class="div2" v-if="upinfo">
  393. <div class="div2-msg0">
  394. <p>{{upinfo.userinfo.wname}}</p>
  395. </div>
  396. <div class="div2-mgs">
  397. <div class="item icon">
  398. <img src="/static/image/newyear/telno.png" alt="">
  399. </div>
  400. <div class="item telno"><p>{{upinfo.userinfo.telno}}</p></div>
  401. </div>
  402. </div>
  403. <div class="div3">
  404. <div class="div3-1">
  405. <img src="/static/image/newyear/watch.png" alt="" class="watch">
  406. </div>
  407. <div class="div3-2">
  408. 扫描二维码登录水猫工匠平台免费制作自己的拜年贴。
  409. </div>
  410. </div>
  411. <div class="div4" v-if="isnew">
  412. <div class="btn" @click="showresult">点&nbsp;击&nbsp;查&nbsp;看&nbsp;制&nbsp;作&nbsp;预&nbsp;览</div>
  413. </div>
  414. </div>
  415. </div>
  416. <Modal v-model="nothaswname" width="360" v-if="upinfo" :closable="modelclosable" :mask-closable="modelclosable">
  417. <p slot="header" style="text-align:center">
  418. <span>用户名设置</span>
  419. </p>
  420. <div style="text-align:center">
  421. <i-form :model="upinfo.userinfo" :label-width="80">
  422. <Form-item label="用户名">
  423. <i-input name="wname" v-model="upinfo.userinfo.wname"></i-input>
  424. </Form-item>
  425. </i-form>
  426. </div>
  427. <div slot="footer">
  428. <i-button type="error" size="large" long @click="savewname">保存</i-button>
  429. </div>
  430. </Modal>
  431. </div>
  432. <script>
  433. var info = {php}echo json_encode($info);{/php};
  434. var sharedata = {php}echo json_encode($sharedata);{/php};
  435. </script>
  436. <script src="/static/plugs/vue/vue.js"></script>
  437. <script src="/static/plugs/iview/iview.min.js"></script>
  438. <script src="/static/plugs/jquery/jquery.js"></script>
  439. <script src="/static/plugs/vuetify/vuetify.js"></script>
  440. <script src="/static/plugs/wechat/jweixin-1.0.0.js"></script>
  441. <!--<script src="/static/plugs/jssha/sha.js"></script>-->
  442. <script src="/static/plugs/js-sha1/sha1.js"></script>
  443. <!--<script src="/static/plugs/wechat/wx_share_config.js"></script>-->
  444. <script>
  445. var url =window.location.href;
  446. //alert(url)
  447. var string = "jsapi_ticket=" +sharedata.ticket + "&noncestr=" + sharedata.nonceStr+ "&timestamp=" +sharedata. timestamp + "&url=" + url;
  448. sign = sha1(string)
  449. wx.config({
  450. debug:false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
  451. appId:sharedata.appid, // 必填,企业号的唯一标识,此处填写企业号corpid
  452. timestamp:sharedata.timestamp , // 必填,生成签名的时间戳
  453. nonceStr:sharedata.nonceStr, // 必填,生成签名的随机串
  454. signature: sign,// 必填,签名,见附录1
  455. jsApiList:['onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ','onMenuShareWeibo','onMenuShareQZone'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
  456. });
  457. wx.error(function(res){
  458. // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
  459. //alert(11)
  460. //alert(JSON.stringify(res));
  461. });
  462. var share_info = {
  463. title:info.title,
  464. desc:info.title,
  465. link:url,
  466. imgUrl:info.previewurl
  467. };
  468. //alert(JSON.stringify(share_info));
  469. </script>
  470. <script src="/static/plugs/wechat/wx_share.js"></script>
  471. <script>
  472. var app = new Vue({
  473. el: '#app',
  474. vuetify: new Vuetify(),
  475. data: {
  476. modelclosable:false,
  477. nothaswname:false,
  478. isbottom:false,
  479. loading:true,
  480. imglist : [
  481. {id:0,url:'/static/image/newyear/img2_1.png'},
  482. {id:0,url:'/static/image/newyear/img2_2.png'},
  483. {id:0,url:'/static/image/newyear/img2_3.png'},
  484. {id:0,url:'/static/image/newyear/img2_4.png'},
  485. {id:0,url:'/static/image/newyear/img2_5.png'},
  486. {id:0,url:'/static/image/newyear/img2_6.png'},
  487. ],
  488. up_info_str:'个人简介',
  489. up_info:'',
  490. upinfo:false,
  491. info:info,
  492. isnew:true,
  493. isstart:true,
  494. userid:0,
  495. code:'',
  496. isupdateinfo:false,
  497. },
  498. computed: {
  499. isloading: function () {
  500. if(this.loading){
  501. return true
  502. }
  503. if(!this.upinfo){
  504. return true
  505. }
  506. return false
  507. }
  508. },
  509. methods:{
  510. updateinfo(){
  511. this.isupdateinfo=true
  512. },
  513. saveinfo(){
  514. var that = this;
  515. const url = "/index.php/index/party/saveinfo"
  516. const data ={
  517. 'id':this.upinfo.id,
  518. 'info':this.up_info
  519. }
  520. $.ajax({
  521. type: 'POST',
  522. url: url,
  523. data: data,
  524. dataType: "json",
  525. success: function(res){
  526. res = JSON.parse(res);
  527. if(200!=res.code){
  528. alert(res.msg);
  529. }else{
  530. that.isupdateinfo=false
  531. }
  532. }
  533. });
  534. },
  535. initpage(){
  536. var str = window.location.search;
  537. let param = {}
  538. str = str.substr(1);
  539. var strarr = str.split("&");
  540. for(var i=0;i<strarr.length;i++){
  541. var arr1 = strarr[i].split("=");
  542. param[arr1[0]] = arr1[1];
  543. }
  544. this.userid = param.userid;
  545. this.code = param.code;
  546. this.showinfo = 1==param.showinfo?true:false;
  547. this.getupinfo()
  548. this.sethtmlimglist()
  549. this.setimages()
  550. },
  551. distinctArrObj(arr) {
  552. var MyShow=(typeof arr!="object")? [arr] : arr //确保参数总是数组
  553. for (let i = 0; i < MyShow.length; i++) {
  554. if (MyShow[i] == null || MyShow[i] == "" || JSON.stringify(MyShow[i]) == "{}") {
  555. MyShow.splice(i, 1);
  556. i = i - 1;
  557. }
  558. }
  559. return MyShow;
  560. },
  561. getupinfo(){
  562. const url = "/index.php/index/party/partinparty"
  563. const data ={
  564. 'code':this.code,
  565. 'userid':this.userid
  566. }
  567. var that = this;
  568. $.ajax({
  569. type: 'POST',
  570. url: url,
  571. data: data,
  572. dataType: "json",
  573. success: function(res){
  574. res = JSON.parse(res);
  575. if(200!=res.code){
  576. alert(res.msg);
  577. }else{
  578. that.upinfo = res.data;
  579. var wname = that.upinfo.userinfo.wname
  580. if(null==wname||""==wname){
  581. that.nothaswname = true;
  582. }
  583. that.up_info = that.upinfo.info;
  584. if(that.showinfo){
  585. that.isnew = false
  586. }else{
  587. if(that.upinfo.isnew){
  588. that.isnew = true
  589. }else{
  590. if(0==that.upinfo.isover){
  591. that.isnew = true
  592. }else{
  593. that.isnew = false
  594. }
  595. }
  596. }
  597. //that.isnew =that.upinfo.isnew;
  598. if(that.isnew){
  599. that.isupdateinfo=true
  600. }
  601. share_info.desc=that.upinfo.userinfo.wname+"祝您新年快乐"
  602. }
  603. }
  604. });
  605. },
  606. setimages(){
  607. const url = "/index.php/index/party/getpicture"
  608. const data ={
  609. 'partyid':this.info.id,
  610. 'userid':this.userid
  611. }
  612. var that = this;
  613. $.ajax({
  614. type: 'POST',
  615. url: url,
  616. data: data,
  617. dataType: "json",
  618. success: function(res){
  619. res = JSON.parse(res);
  620. if(200!=res.code){
  621. //alert(res.msg);
  622. }else{
  623. const data = res.data;
  624. const list = data.list;
  625. $.each(list,function(index,term){
  626. that.imglist[term.sort-1].id = term.id
  627. that.imglist[term.sort-1].url = term.pictureurl
  628. });
  629. that.sethtmlimglist();
  630. }
  631. }
  632. });
  633. },
  634. sethtmlimglist(){
  635. $.each(this.imglist,function(index,term){
  636. const id = index+1;
  637. //"background-position": "center",
  638. $('.image_div #img'+id).css({'background-image':"url("+term.url+")","background-size":"100% 100%"});
  639. });
  640. },
  641. uploadimg(e){
  642. let index = $(e.target).data('index');
  643. console.log(index);
  644. let id = this.imglist[index-1].id;
  645. let that = this
  646. myFile = $('#uploadfile');
  647. myFile.click()
  648. myFile.unbind().change(function (e) {
  649. url = "/index.php/index/fileoper/uploadfilebydir";
  650. var formData = new window.FormData()
  651. //formData.append('userid', this.userid);
  652. //formData.append('partyid', this.partyid);
  653. //formData.append('id', id);
  654. formData.set('dir', "party");
  655. formData.set('file', document.querySelector('input[type=file]').files[0])
  656. var xhr=new XMLHttpRequest();
  657. xhr.open("post",url);
  658. xhr.send(formData);
  659. xhr.onload=function(){
  660. res = JSON.parse(xhr.response);
  661. if(200!=res.code){
  662. alert(res.resultData);
  663. }else{
  664. myFile.val('')
  665. formData.delete('dir')
  666. formData.delete('file')
  667. var pictureurl = res.resultData;
  668. that.imglist[index-1].url = pictureurl;
  669. that.sethtmlimglist()
  670. that.saveimg(index)
  671. }
  672. }
  673. });
  674. },
  675. saveimg(index){
  676. var that = this
  677. let id = this.imglist[index-1].id;
  678. let imgurl = this.imglist[index-1].url;
  679. var imgdata = {
  680. 'id':id,
  681. 'userid':this.userid,
  682. 'partyid':this.info.id,
  683. 'pictureurl':imgurl,
  684. 'sort':index
  685. };
  686. var url = "/index.php/index/party/savepicture"
  687. $.ajax({
  688. type: 'POST',
  689. url: url,
  690. data: imgdata,
  691. dataType: "json",
  692. success: function(res){
  693. res = JSON.parse(res);
  694. if(200!=res.code){
  695. alert(res.msg);
  696. }else{
  697. const data = res.data;
  698. const id = data.id;
  699. that.imglist[index-1].id = id
  700. }
  701. }
  702. });
  703. },
  704. showresult(){
  705. var data={
  706. 'id':this.upinfo.id
  707. }
  708. var url = "/index.php/index/party/setisoverbyid"
  709. $.ajax({
  710. type: 'POST',
  711. url: url,
  712. data: data,
  713. dataType: "json",
  714. success: function(res){
  715. res = JSON.parse(res);
  716. if(200!=res.code){
  717. alert(res.msg);
  718. }else{
  719. window.location.href = location.href;
  720. $('html ,body').animate({ scrollTop: -10 }, 500);
  721. }
  722. }
  723. });
  724. },
  725. audioAutoPlay() {
  726. let that = this
  727. let audio = document.getElementById("bg-music");
  728. if(this.isWeiXin()){
  729. document.addEventListener('WeixinJSBridgeReady', function() {
  730. that.loading=false
  731. audio.play();
  732. $("body").one("touchstart",function() {
  733. audio.play();
  734. });
  735. })
  736. }else{
  737. audio.addEventListener('canplaythrough', function () {
  738. that.loading=false
  739. audio.play();
  740. //取消加载中
  741. }, false);
  742. }
  743. },
  744. isWeiXin(){
  745. //window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息,这个属性可以用来判断浏览器类型
  746. var ua = window.navigator.userAgent.toLowerCase();
  747. //alert(JSON.stringify(ua))
  748. //通过正则表达式匹配ua中是否含有MicroMessenger字符串
  749. if(ua.match(/MicroMessenger/i) == 'micromessenger'){
  750. return true;
  751. } else{
  752. return false;
  753. }
  754. },
  755. savewname(){
  756. this.nothaswname=false
  757. let wname = this.upinfo.userinfo.wname;
  758. var data ={
  759. userid: this.upinfo.userinfo.id,
  760. wname: wname,
  761. }
  762. var url = "/index.php/index/user/saveuserwname"
  763. $.ajax({
  764. type: 'POST',
  765. url: url,
  766. data: data,
  767. dataType: "json",
  768. success: function(res){
  769. res = JSON.parse(res);
  770. if(200!=res.code){
  771. console.log(res.msg);
  772. }else{
  773. window.location.href = location.href;
  774. $('html ,body').animate({ scrollTop: -10 }, 500);
  775. }
  776. }
  777. });
  778. //保存
  779. }
  780. },
  781. mounted() {
  782. var that = this;
  783. this.audioAutoPlay();
  784. $('#uploadfile').hide()
  785. this.isstart= this.info.isstart;
  786. const height = $(window).height();
  787. $('.page').height(height);
  788. $('.loading').height(height);
  789. if(!this.isstart){
  790. alert("活动未开始");
  791. }else{
  792. this.initpage();
  793. $(window).scroll(function() {
  794. var scrollTop = $(document).scrollTop();
  795. var height = $(document).height();
  796. var diff = height-scrollTop;
  797. if(diff<=height*0.5){
  798. that.isbottom=true;
  799. }else{
  800. that.isbottom=false;
  801. }
  802. })
  803. }
  804. }
  805. })
  806. </script>
  807. </body>
  808. </html>