webpackJsonp([9],{"5W4P":function(n,e,r){(n.exports=r("FZ+f")(!0)).push([n.i,"\n.fl-r[data-v-ff30e8ae] {\n  float: right;\n}\n.main-block[data-v-ff30e8ae] {\n  margin: 5px;\n  background: white;\n  padding: 5px;\n}\n.clear-both[data-v-ff30e8ae]:after {\n  content: '';\n  display: block;\n  clear: both;\n}\n[data-v-ff30e8ae]::-webkit-scrollbar-track-piece {\n  border-radius: 10px;\n}\n[data-v-ff30e8ae]::-webkit-scrollbar {\n  width: 5px;\n  height: 5px;\n}\n[data-v-ff30e8ae]::-webkit-scrollbar-thumb {\n  background-color: #999;\n  border-radius: 10px;\n  height: 10px;\n  min-height: 10px;\n}\n.img-cvs[data-v-ff30e8ae] {\n  position: absolute;\n  width: 62.13333333vw;\n  top: 46.93333333vw;\n  left: 7.73333333vw;\n}\n.img-cvs .qrcode[data-v-ff30e8ae] {\n  position: absolute;\n  top: 81.33333333vw;\n  left: 4vw;\n  width: 16vw;\n}\n.cvs-img[data-v-ff30e8ae] {\n  position: absolute;\n  width: 62.13333333vw;\n  top: 46.93333333vw;\n  left: 7.73333333vw;\n  z-index: 10;\n}\n.ref-content[data-v-ff30e8ae] {\n  width: 79.73333333vw;\n  height: 150.4vw;\n  background-size: 100% 100%;\n  position: relative;\n}\n.ref-content .tips[data-v-ff30e8ae] {\n  font-size: 12px;\n  position: absolute;\n  color: #666;\n  right: 2.66666667vw;\n  top: 66.66666667vw;\n  width: 1em;\n}\n.group-index[data-v-ff30e8ae] {\n  height: 100%;\n  padding-bottom: toVw(150);\n  background: #f0f0f0;\n  font-family: PingFangSC-Regular;\n}\n.group-index .ref-icon[data-v-ff30e8ae] {\n  position: fixed;\n  height: 24vw;\n  top: 70vw;\n  z-index: 6;\n  right: 2.66666667vw;\n  /*border-radius: 100px;*/\n}\n.group-index .banner[data-v-ff30e8ae] {\n  background: white;\n}\n.group-index .banner img[data-v-ff30e8ae] {\n  width: 100%;\n}\n.group-index .head[data-v-ff30e8ae] {\n  background: white;\n  margin-bottom: 10px;\n  padding: 2.66666667vw;\n}\n.group-index .head .title[data-v-ff30e8ae] {\n  font-size: 20px;\n  color: #333333;\n  margin-bottom: 2vw;\n}\n.group-index .head .detail[data-v-ff30e8ae] {\n  font-size: 12px;\n  line-height: 1.6em;\n  color: #333333;\n  display: block;\n  margin-bottom: 2vw;\n}\n.group-index .head .price .price-content[data-v-ff30e8ae] {\n  font-family: PingFang-SC-Bold;\n  font-size: 20px;\n  color: #F83534;\n}\n.group-index .head-icon[data-v-ff30e8ae] {\n  padding: 2.66666667vw;\n  background: white;\n  margin-bottom: 2px;\n}\n.group-index .head-icon .icon[data-v-ff30e8ae] {\n  display: inline-block;\n  width: 8vw;\n  margin: 0 1.33333333vw;\n  border-radius: 1000px;\n  vertical-align: middle;\n}\n.group-index .head-icon .more[data-v-ff30e8ae] {\n  width: 6.66666667vw;\n  vertical-align: middle;\n}\n.group-index .head-icon .has[data-v-ff30e8ae] {\n  font-size: 12px;\n  line-height: 8vw;\n  color: #999999;\n  float: right;\n}\n.group-index .welfare[data-v-ff30e8ae] {\n  background: white;\n  padding: 1.33333333vw;\n  font-size: 12px;\n  text-align: center;\n  color: #999999;\n  margin-bottom: 20px;\n}\n.group-index .main-detail[data-v-ff30e8ae] {\n  padding: 2.66666667vw;\n  background: white;\n}\n.group-index .main-detail .tab-content[data-v-ff30e8ae] {\n  border-radius: 9px ;\n  border: 1px solid #F63539;\n}\n.group-index .main-detail .tab-content[data-v-ff30e8ae]:after {\n  content: '';\n  display: block;\n  clear: both;\n}\n.group-index .main-detail .tab-content .tab-btn[data-v-ff30e8ae] {\n  width: 50%;\n  float: left;\n  height: 10.66666667vw;\n  line-height: 10.66666667vw;\n  text-align: center;\n  color: #F63539;\n  border-radius: 9px ;\n}\n.group-index .main-detail .tab-content .tab-btn.active[data-v-ff30e8ae] {\n  background: #F63539;\n  color: white;\n}\n.group-index .main-detail .qa-block[data-v-ff30e8ae] {\n  padding: 2.66666667vw 0 toVw(150) 0;\n}\n.group-index .main-detail .qa-block img[data-v-ff30e8ae],\n.group-index .main-detail .qa-block video[data-v-ff30e8ae] {\n  max-width: 100%;\n}\n.group-index .main-detail .qa-block .qa-content[data-v-ff30e8ae] {\n  margin: toVw(10) 0;\n}\n.group-index .main-detail .qa-block .qa-content .qa-q[data-v-ff30e8ae] {\n  font-size: 16px;\n  color: #666666;\n}\n.group-index .main-detail .qa-block .qa-content .qa-a[data-v-ff30e8ae] {\n  font-size: 16px;\n  color: #333333;\n}\n.group-index .main-detail .detail[data-v-ff30e8ae] {\n  padding: 2.66666667vw 0 20vw 0;\n}\n.group-index .main-detail .detail .detail-content img[data-v-ff30e8ae],\n.group-index .main-detail .detail .detail-content video[data-v-ff30e8ae] {\n  max-width: 100%;\n}\n.group-index footer[data-v-ff30e8ae] {\n  position: absolute;\n  position: fixed;\n  bottom: 0;\n  width: 100%;\n  height: 16vw;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  background: white;\n  padding: 1.33333333vw;\n  border-top: 1px solid #d8d8d8;\n  -ms-flex-pack: distribute;\n      justify-content: space-around;\n}\n.group-index footer .btn[data-v-ff30e8ae] {\n  border: 1px solid #cccccc;\n  border-radius: 8px;\n  width: 0;\n  -webkit-box-flex: 2;\n      -ms-flex-positive: 2;\n          flex-grow: 2;\n  text-align: center;\n  padding: 2vw 0;\n  margin: 0 1.33333333vw;\n  line-height: 1.4em;\n  font-size: 16px;\n  color: #666666;\n}\n.group-index footer .btn span[data-v-ff30e8ae] {\n  display: block;\n  font-size: 20px;\n  font-family: PingFang-SC-Bold;\n}\n.group-index footer .btn img[data-v-ff30e8ae] {\n  width: 6.66666667vw;\n}\n.group-index footer .btn.big[data-v-ff30e8ae] {\n  padding: 0.66666667vw 0;\n  -webkit-box-flex: 5;\n      -ms-flex-positive: 5;\n          flex-grow: 5;\n}\n.group-index footer .btn.big.price[data-v-ff30e8ae] {\n  background: #F83534;\n  border-color: #F83534;\n  color: white;\n}\n.group-index footer .btn.big.price.full[data-v-ff30e8ae] {\n  background: #dddddd;\n  border-color: #dddddd;\n  line-height: 13.33333333vw;\n}\n.group-index .pop-block[data-v-ff30e8ae] {\n  padding: 5.33333333vw 1.33333333vw;\n  width: 80vw;\n  text-align: center;\n  font-size: 14px;\n  color: #666666;\n  position: relative;\n}\n.group-index .pop-block img[data-v-ff30e8ae] {\n  width: 33.33333333vw;\n}\n.group-index .pop-block .close[data-v-ff30e8ae] {\n  width: 6.66666667vw;\n  position: absolute;\n  top: 2.66666667vw;\n  right: 2.66666667vw;\n}\n.group-index .mint-popup[data-v-ff30e8ae] {\n  border-radius: 10px;\n}\n.group-index .pop-fill[data-v-ff30e8ae] {\n  width: 66.66666667vw;\n  padding: 4vw 4vw;\n  font-size: 16px;\n  color: #333333;\n}\n.group-index .pop-fill .btn-block[data-v-ff30e8ae] {\n  margin-top: 4vw;\n}\n.group-index .pop-fill .btn-block[data-v-ff30e8ae]:after {\n  content: '';\n  display: block;\n  clear: both;\n}\n.group-index .pop-fill .btn-block .btn[data-v-ff30e8ae] {\n  float: right;\n  background: #F83534;\n  font-size: 14px;\n  padding: 0.66666667vw 1.33333333vw;\n  border-radius: 8px;\n  color: #FFFFFF;\n}\n","",{version:3,sources:["D:/myproject/new-singsingH5/src/components/buy/D:/myproject/new-singsingH5/src/util/public.less","D:/myproject/new-singsingH5/src/components/buy/index.vue","D:/myproject/new-singsingH5/src/components/buy/D:/myproject/new-singsingH5/src/components/buy/index.vue"],names:[],mappings:";AAcA;EACE,aAAA;CCbD;ADeD;EACE,YAAA;EACA,kBAAA;EACA,aAAA;CCbD;ADmBC;EACE,YAAA;EACA,eAAA;EACA,YAAA;CCjBH;ADqBD;EACE,oBAAA;CCnBD;ADqBD;EACE,WAAA;EACA,YAAA;CCnBD;ADqBD;EACE,uBAAA;EACA,oBAAA;EACA,aAAA;EACA,iBAAA;CCnBD;ACodD;EACE,mBAAA;EACA,qBAAA;EACA,mBAAA;EACA,mBAAA;CDldD;AC8cD;EAMI,mBAAA;EACA,mBAAA;EACA,UAAA;EACA,YAAA;CDjdH;ACodD;EACE,mBAAA;EACA,qBAAA;EACA,mBAAA;EACA,mBAAA;EACA,YAAA;CDldD;ACodD;EACE,qBAAA;EACA,gBAAA;EACA,2BAAA;EACA,mBAAA;CDldD;AC8cD;EAMI,gBAAA;EACA,mBAAA;EACA,YAAA;EACA,oBAAA;EACA,mBAAA;EACA,WAAA;CDjdH;ACodD;EACE,aAAA;EACA,0BAAA;EACA,oBAAA;EACA,gCAAA;CDldD;AC8cD;EAMI,gBAAA;EACA,aAAA;EACA,UAAA;EACA,WAAA;EACA,oBAAA;EDjdF,yBAAyB;CAC1B;ACscD;EAcI,kBAAA;CDjdH;ACmcD;EAgBM,YAAA;CDhdL;ACgcD;EAoBI,kBAAA;EACA,oBAAA;EACA,sBAAA;CDjdH;AC2bD;EAwBM,gBAAA;EACA,eAAA;EACA,mBAAA;CDhdL;ACsbD;EA6BM,gBAAA;EACA,mBAAA;EACA,eAAA;EACA,eAAA;EACA,mBAAA;CDhdL;AC+aD;EAqCQ,8BAAA;EACA,gBAAA;EACA,eAAA;CDjdP;AC0aD;EA4CI,sBAAA;EACA,kBAAA;EACA,mBAAA;CDndH;ACqaD;EAgDM,sBAAA;EACA,WAAA;EACA,uBAAA;EACA,sBAAA;EACA,uBAAA;CDldL;AC8ZD;EAuDM,oBAAA;EACA,uBAAA;CDldL;AC0ZD;EA2DM,gBAAA;EACA,iBAAA;EACA,eAAA;EACA,aAAA;CDldL;ACoZD;EAkEI,kBAAA;EACA,sBAAA;EACA,gBAAA;EACA,mBAAA;EACA,eAAA;EACA,oBAAA;CDndH;AC4YD;EA0EI,sBAAA;EACA,kBAAA;CDndH;ACwYD;EA6EM,oBAAA;EACA,0BAAA;CDldL;ACmdK;EACE,YAAA;EACA,eAAA;EACA,YAAA;CDjdP;AC+XD;EAqFQ,WAAA;EACA,YAAA;EACA,sBAAA;EACA,2BAAA;EACA,mBAAA;EACA,eAAA;EACA,oBAAA;CDjdP;ACkdO;EACE,oBAAA;EACA,aAAA;CDhdT;ACkXD;EAmGM,oCAAA;CDldL;AC+WD;;EAqGQ,gBAAA;CDhdP;AC2WD;EAwGQ,mBAAA;CDhdP;ACwWD;EA0GU,gBAAA;EACA,eAAA;CD/cT;ACoWD;EA8GU,gBAAA;EACA,eAAA;CD/cT;ACgWD;EAoHM,+BAAA;CDjdL;AC6VD;;EAuHU,gBAAA;CDhdT;ACyVD;EA8HI,mBAAA;EACA,gBAAA;EACA,UAAA;EACA,YAAA;EACA,aAAA;EACA,qBAAA;EAEA,qBAAA;EAEA,cAAA;EACA,kBAAA;EACA,sBAAA;EACA,8BAAA;EACA,0BAAA;MAAA,8BAAA;CDpdH;ACyUD;EA6IM,0BAAA;EACA,mBAAA;EACA,SAAA;EACA,oBAAA;MAAA,qBAAA;UAAA,aAAA;EACA,mBAAA;EACA,eAAA;EACA,uBAAA;EACA,mBAAA;EACA,gBAAA;EACA,eAAA;CDndL;AC6TD;EAwJQ,eAAA;EACA,gBAAA;EACA,8BAAA;CDldP;ACwTD;EA6JQ,oBAAA;CDldP;ACodK;EACE,wBAAA;EACA,oBAAA;MAAA,qBAAA;UAAA,aAAA;CDldP;ACmdO;EACE,oBAAA;EACA,sBAAA;EACA,aAAA;CDjdT;ACkdS;EACE,oBAAA;EACA,sBAAA;EACA,2BAAA;CDhdX;ACuSD;EAgLI,mCAAA;EACA,YAAA;EACA,mBAAA;EACA,gBAAA;EACA,eAAA;EACA,mBAAA;CDpdH;AC+RD;EAuLM,qBAAA;CDndL;AC4RD;EA0LM,oBAAA;EACA,mBAAA;EACA,kBAAA;EACA,oBAAA;CDndL;ACsRD;EAiMI,oBAAA;CDpdH;ACmRD;EAoMI,qBAAA;EACA,iBAAA;EACA,gBAAA;EACA,eAAA;CDpdH;AC6QD;EAyMM,gBAAA;CDndL;ACodK;EACE,YAAA;EACA,eAAA;EACA,YAAA;CDldP;ACqQD;EAgNQ,aAAA;EACA,oBAAA;EACA,gBAAA;EACA,mCAAA;EACA,mBAAA;EACA,eAAA;CDldP",file:"index.vue",sourcesContent:["//颜色参数\n@toVw:100/375vw;\n@toVh:100/667vh;\n@bg-b: #333;\n@bg-b-s:#444;\n@black-line:#191919;\n@gray-line:#666;\n@light-line:#ddd;\n@main-font-color:#fff;\n@secondary-font-color:#999;\n@gold-color-light:#FFD04B;\n@gold-color: #a18430;\n\n//公共类\n.fl-r{\n  float: right;\n}\n.main-block{\n  margin: 5px;\n  background: white;\n  padding: 5px;\n}\nhtml{\n\n}\n.clear-both{\n  &:after{\n    content: '';\n    display: block;\n    clear: both;\n  }\n}\n//滚动条样式\n::-webkit-scrollbar-track-piece { //滚动条凹槽的颜色，还可以设置边框属性\n  border-radius: 10px;\n}\n::-webkit-scrollbar {//滚动条的宽度\n  width:5px;\n  height:5px;\n}\n::-webkit-scrollbar-thumb {//滚动条的设置\n  background-color:@secondary-font-color;\n  border-radius: 10px;\n  height: 10px;\n  min-height:10px;\n}\n",".fl-r {\n  float: right;\n}\n.main-block {\n  margin: 5px;\n  background: white;\n  padding: 5px;\n}\n.clear-both:after {\n  content: '';\n  display: block;\n  clear: both;\n}\n::-webkit-scrollbar-track-piece {\n  border-radius: 10px;\n}\n::-webkit-scrollbar {\n  width: 5px;\n  height: 5px;\n}\n::-webkit-scrollbar-thumb {\n  background-color: #999;\n  border-radius: 10px;\n  height: 10px;\n  min-height: 10px;\n}\n.img-cvs {\n  position: absolute;\n  width: 62.13333333vw;\n  top: 46.93333333vw;\n  left: 7.73333333vw;\n}\n.img-cvs .qrcode {\n  position: absolute;\n  top: 81.33333333vw;\n  left: 4vw;\n  width: 16vw;\n}\n.cvs-img {\n  position: absolute;\n  width: 62.13333333vw;\n  top: 46.93333333vw;\n  left: 7.73333333vw;\n  z-index: 10;\n}\n.ref-content {\n  width: 79.73333333vw;\n  height: 150.4vw;\n  background-size: 100% 100%;\n  position: relative;\n}\n.ref-content .tips {\n  font-size: 12px;\n  position: absolute;\n  color: #666;\n  right: 2.66666667vw;\n  top: 66.66666667vw;\n  width: 1em;\n}\n.group-index {\n  height: 100%;\n  padding-bottom: toVw(150);\n  background: #f0f0f0;\n  font-family: PingFangSC-Regular;\n}\n.group-index .ref-icon {\n  position: fixed;\n  height: 24vw;\n  top: 70vw;\n  z-index: 6;\n  right: 2.66666667vw;\n  /*border-radius: 100px;*/\n}\n.group-index .banner {\n  background: white;\n}\n.group-index .banner img {\n  width: 100%;\n}\n.group-index .head {\n  background: white;\n  margin-bottom: 10px;\n  padding: 2.66666667vw;\n}\n.group-index .head .title {\n  font-size: 20px;\n  color: #333333;\n  margin-bottom: 2vw;\n}\n.group-index .head .detail {\n  font-size: 12px;\n  line-height: 1.6em;\n  color: #333333;\n  display: block;\n  margin-bottom: 2vw;\n}\n.group-index .head .price .price-content {\n  font-family: PingFang-SC-Bold;\n  font-size: 20px;\n  color: #F83534;\n}\n.group-index .head-icon {\n  padding: 2.66666667vw;\n  background: white;\n  margin-bottom: 2px;\n}\n.group-index .head-icon .icon {\n  display: inline-block;\n  width: 8vw;\n  margin: 0 1.33333333vw;\n  border-radius: 1000px;\n  vertical-align: middle;\n}\n.group-index .head-icon .more {\n  width: 6.66666667vw;\n  vertical-align: middle;\n}\n.group-index .head-icon .has {\n  font-size: 12px;\n  line-height: 8vw;\n  color: #999999;\n  float: right;\n}\n.group-index .welfare {\n  background: white;\n  padding: 1.33333333vw;\n  font-size: 12px;\n  text-align: center;\n  color: #999999;\n  margin-bottom: 20px;\n}\n.group-index .main-detail {\n  padding: 2.66666667vw;\n  background: white;\n}\n.group-index .main-detail .tab-content {\n  border-radius: 9px ;\n  border: 1px solid #F63539;\n}\n.group-index .main-detail .tab-content:after {\n  content: '';\n  display: block;\n  clear: both;\n}\n.group-index .main-detail .tab-content .tab-btn {\n  width: 50%;\n  float: left;\n  height: 10.66666667vw;\n  line-height: 10.66666667vw;\n  text-align: center;\n  color: #F63539;\n  border-radius: 9px ;\n}\n.group-index .main-detail .tab-content .tab-btn.active {\n  background: #F63539;\n  color: white;\n}\n.group-index .main-detail .qa-block {\n  padding: 2.66666667vw 0 toVw(150) 0;\n}\n.group-index .main-detail .qa-block img,\n.group-index .main-detail .qa-block video {\n  max-width: 100%;\n}\n.group-index .main-detail .qa-block .qa-content {\n  margin: toVw(10) 0;\n}\n.group-index .main-detail .qa-block .qa-content .qa-q {\n  font-size: 16px;\n  color: #666666;\n}\n.group-index .main-detail .qa-block .qa-content .qa-a {\n  font-size: 16px;\n  color: #333333;\n}\n.group-index .main-detail .detail {\n  padding: 2.66666667vw 0 20vw 0;\n}\n.group-index .main-detail .detail .detail-content img,\n.group-index .main-detail .detail .detail-content video {\n  max-width: 100%;\n}\n.group-index footer {\n  position: absolute;\n  position: fixed;\n  bottom: 0;\n  width: 100%;\n  height: 16vw;\n  display: -webkit-box;\n  display: -moz-box;\n  display: -ms-flexbox;\n  display: -webkit-flex;\n  display: flex;\n  background: white;\n  padding: 1.33333333vw;\n  border-top: 1px solid #d8d8d8;\n  justify-content: space-around;\n}\n.group-index footer .btn {\n  border: 1px solid #cccccc;\n  border-radius: 8px;\n  width: 0;\n  flex-grow: 2;\n  text-align: center;\n  padding: 2vw 0;\n  margin: 0 1.33333333vw;\n  line-height: 1.4em;\n  font-size: 16px;\n  color: #666666;\n}\n.group-index footer .btn span {\n  display: block;\n  font-size: 20px;\n  font-family: PingFang-SC-Bold;\n}\n.group-index footer .btn img {\n  width: 6.66666667vw;\n}\n.group-index footer .btn.big {\n  padding: 0.66666667vw 0;\n  flex-grow: 5;\n}\n.group-index footer .btn.big.price {\n  background: #F83534;\n  border-color: #F83534;\n  color: white;\n}\n.group-index footer .btn.big.price.full {\n  background: #dddddd;\n  border-color: #dddddd;\n  line-height: 13.33333333vw;\n}\n.group-index .pop-block {\n  padding: 5.33333333vw 1.33333333vw;\n  width: 80vw;\n  text-align: center;\n  font-size: 14px;\n  color: #666666;\n  position: relative;\n}\n.group-index .pop-block img {\n  width: 33.33333333vw;\n}\n.group-index .pop-block .close {\n  width: 6.66666667vw;\n  position: absolute;\n  top: 2.66666667vw;\n  right: 2.66666667vw;\n}\n.group-index .mint-popup {\n  border-radius: 10px;\n}\n.group-index .pop-fill {\n  width: 66.66666667vw;\n  padding: 4vw 4vw;\n  font-size: 16px;\n  color: #333333;\n}\n.group-index .pop-fill .btn-block {\n  margin-top: 4vw;\n}\n.group-index .pop-fill .btn-block:after {\n  content: '';\n  display: block;\n  clear: both;\n}\n.group-index .pop-fill .btn-block .btn {\n  float: right;\n  background: #F83534;\n  font-size: 14px;\n  padding: 0.66666667vw 1.33333333vw;\n  border-radius: 8px;\n  color: #FFFFFF;\n}\n","\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n@import \"../../util/public\";\n.img-cvs{\n  position: absolute;\n  width: 233 * @toVw;\n  top: 176 * @toVw;\n  left: 29 * @toVw;\n  .qrcode{\n    position: absolute;\n    top: 305 * @toVw;\n    left: 15 * @toVw;\n    width: 60 * @toVw;\n  }\n}\n.cvs-img{\n  position: absolute;\n  width: 233 * @toVw;\n  top: 176 * @toVw;\n  left: 29 * @toVw;\n  z-index: 10;\n}\n.ref-content{\n  width: 299 * @toVw;\n  height: 564 * @toVw;\n  background-size: 100% 100%;\n  position: relative;\n  .tips{\n    font-size: 12px;\n    position: absolute;\n    color: #666;\n    right: 10 * @toVw;\n    top: 250 * @toVw;\n    width: 1em;\n  }\n}\n.group-index{\n  height: 100%;\n  padding-bottom: toVw(150);\n  background: #f0f0f0;\n  font-family: PingFangSC-Regular;\n  .ref-icon{\n    position: fixed;\n    height: 100/375 * 90vw ;\n    top: 70vw;\n    z-index: 6;\n    right: 10 * 100 /375vw;\n    /*border-radius: 100px;*/\n  }\n  .banner{\n    background: white;\n    img{\n      width: 100%;\n    }\n  }\n  .head{\n    background: white;\n    margin-bottom: 10px;\n    padding: 20/7.5vw;\n    .title{\n      font-size: 20px;\n      color: #333333;\n      margin-bottom: 15/7.5vw;\n    }\n    .detail{\n      font-size: 12px;\n      line-height: 1.6em;\n      color: #333333;\n      display: block;\n      margin-bottom: 15/7.5vw;\n    }\n    .price{\n      .price-content{\n        font-family: PingFang-SC-Bold;\n        font-size: 20px;\n        color: #F83534;\n      }\n    }\n  }\n  .head-icon{\n    padding: 20/7.5vw;\n    background: white;\n    margin-bottom: 2px;\n    .icon{\n      display: inline-block;\n      width: 60/7.5vw;\n      margin: 0 10/7.5vw;\n      border-radius: 1000px;\n      vertical-align: middle;\n    }\n    .more{\n      width: 50/7.5vw;\n      vertical-align: middle;\n    }\n    .has{\n      font-size: 12px;\n      line-height: 60/7.5vw;\n      color: #999999;\n      float: right;\n    }\n  }\n  .welfare{\n    background: white;\n    padding:10/7.5vw ;\n    font-size: 12px;\n    text-align: center;\n    color: #999999;\n    margin-bottom: 20px;\n  }\n  .main-detail{\n    padding: 20/7.5vw;\n    background: white;\n    .tab-content{\n      border-radius: 9px ;\n      border: 1px solid #F63539;\n      &:after{\n        content: '';\n        display: block;\n        clear: both;\n      }\n      .tab-btn{\n        width: 50%;\n        float: left;\n        height: 80/7.5vw;\n        line-height: 80/7.5vw;\n        text-align: center;\n        color: #F63539;\n        border-radius:9px ;\n        &.active{\n          background: #F63539;\n          color: white;\n        }\n      }\n    }\n    .qa-block{\n      padding: 20/7.5vw 0 toVw(150) 0;\n      img,video{\n        max-width: 100%;\n      }\n      .qa-content{\n        margin: toVw(10) 0;\n        .qa-q{\n          font-size: 16px;\n          color: #666666;\n        }\n        .qa-a{\n          font-size: 16px;\n          color: #333333;\n        }\n      }\n    }\n    .detail{\n      padding: 20/7.5vw 0 150/7.5vw 0;\n      .detail-content{\n        img,video{\n          max-width: 100%;\n        }\n      }\n\n    }\n  }\n  footer{\n    position: absolute;\n    position: fixed;\n    bottom: 0;\n    width: 100%;\n    height: 120/7.5vw;\n    display: -webkit-box;      // OLD - iOS 6-, Safari 3.1-6 //\n    display: -moz-box;         // OLD - Firefox 19- (buggy but mostly works) //\n    display: -ms-flexbox;      // TWEENER - IE 10 //\n    display: -webkit-flex;     // NEW - Chrome //\n    display: flex;             // NEW, Spec - Opera 12.1, Firefox 20+ //\n    background: white;\n    padding: 10/7.5vw;\n    border-top: 1px solid #d8d8d8;\n    justify-content:space-around;\n    .btn{\n      border: 1px solid #cccccc;\n      border-radius: 8px;\n      width:0;\n      flex-grow:2;\n      text-align: center;\n      padding: 15/7.5vw 0;\n      margin: 0 10/7.5vw;\n      line-height: 1.4em;\n      font-size: 16px;\n      color: #666666;\n      span{\n        display: block;\n        font-size: 20px;\n        font-family: PingFang-SC-Bold;\n      }\n      img{\n        width: 50/7.5vw;\n      }\n      &.big{\n        padding: 5/7.5vw 0;\n        flex-grow:5;\n        &.price{\n          background:  #F83534;\n          border-color: #F83534;\n          color: white;\n          &.full{\n            background: #dddddd;\n            border-color: #dddddd;\n            line-height: 50*@toVw;\n          }\n        }\n      }\n    }\n  }\n  .pop-block{\n    padding:40/7.5vw 10/7.5vw;\n    width: 600/7.5vw;\n    text-align: center;\n    font-size: 14px;\n    color: #666666;\n    position: relative;\n    img{\n      width: 250/7.5vw;\n    }\n    .close{\n      width: 50/7.5vw;\n      position: absolute;\n      top: 20/7.5vw;\n      right: 20/7.5vw;\n    }\n  }\n  .mint-popup{\n    border-radius: 10px;\n  }\n  .pop-fill{\n    width: 500/7.5vw;\n    padding:30/7.5vw 30/7.5vw;\n    font-size: 16px;\n    color: #333333;\n    .btn-block{\n      margin-top: 30/7.5vw;\n      &:after{\n        content:'';\n        display: block;\n        clear: both;\n      }\n      .btn{\n        float: right;\n        background: #F83534;\n        font-size: 14px;\n        padding: 5/7.5vw 10/7.5vw;\n        border-radius: 8px;\n        color: #FFFFFF;\n      }\n    }\n  }\n\n}\n\n"],sourceRoot:""}])},"9Nk9":function(n,e,r){var t=r("yEDY");"string"==typeof t&&(t=[[n.i,t,""]]),t.locals&&(n.exports=t.locals);r("rjj0")("134c077c",t,!1,{})},bNYG:function(n,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});r("v2ns");var t=r("7QTg"),i=r("MJLE"),o=r.n(i),a=r("Au9i"),d=r("CCn6"),s=r("E26C"),l=r.n(s),p=r("kXdI"),c=r.n(p),A=r("XaoW"),g=r.n(A),u=r("zpE/"),h=r.n(u),f=r("0ZjB"),v=r.n(f),m=r("2Pnh"),w=r.n(m),b={name:"index",components:{swiper:t.swiper,swiperSlide:t.swiperSlide},data:function(){return{refBg:l.a,join:!1,popType:!1,popFill:!1,popupVisible:!1,refVisible:!1,tabType:!0,popcontentW:"您已经购买过课程，无需重复<br>购买，您可以添加微信公众号了解更多",popcontentT:"为了更好地为您进行课程服务，<br>请扫码添加老师二维码",qrCode:h.a,weChatIcon:g.a,closeUrl:v.a,moreUrl:c.a,refIcon:"https://cdn.singsingenglish.com/new-sing/b7f43ced8f8268655c2c5b289360df990ec8f18e.png",swiperOption:{pagination:{el:".swiper-pagination"}},QRCodeB:!1,dataURL:null,user_id:null,invite_code_f:!0,invite_code:"",shopId:"",groupId:null,groupDetail:!1,groupData:null}},mounted:function(){this.getDetail()},methods:{goToActivity:function(){var n={};window.location.href.indexOf("shopId")>-1&&(n.shopId=this.$route.query.shopId),window.location.href.indexOf("groupId")>-1&&(n.groupId=this.$route.query.groupId),window.location.href.indexOf("invite_code")>-1&&(n.invite_code=this.$route.query.invite_code),this.$router.push({name:"activity",query:n})},refshow:function(){var n=this;if(a.Indicator.open(),document.body.scrollTop<10&&(document.body.scrollTop=20,document.documentElement.scrollTop=20),localStorage.getItem("cc_token")&&""!==localStorage.getItem("cc_token"))setTimeout(function(){a.Indicator.close(),n.invite_code||(n.invite_code="CC-USER");var e=n.invite_code.split("-");e.length>2&&"TEACHER"===e[1]&&(e[1]="USER");var r=e[0]+"-"+e[1],t="https://wechat-test.changchangenglish.com/#/buyDetail?shopId="+n.shopId+"&invite_code="+r+"-"+n.user_id;n.groupId&&"null"!==n.groupId&&(t+="&groupId="+n.groupId),n.qrcode(t),n.refVisible=!0,n.$nextTick(function(){n.dataURL||setTimeout(function(){var e=document.getElementById("capture").getClientRects()[0],r=(e.height,e.width);document.getElementById("capture").style.width=r+"px";n.getOffsetRect(n.$refs.imageWrapper);var t=document.getElementById("capture").getClientRects()[0],i=t.height1,o=t.width1;w()(document.getElementById("capture"),{async:!0,timeout:500,scrollX:1,scale:3,width:o,height:i,letterRendering:!0}).then(function(e){var r=e.toDataURL("image/jpg");n.dataURL=r}).catch(function(n){alert(n),console.log()})},500)})},500);else{var e={retUrl:this.$route.fullPath,is_new_user_url:"1"};this.$router.push({name:"author",query:e})}},getOffsetRect:function(n){var e=n.getBoundingClientRect(),r=document.body,t=document.documentElement,i=window.pageYOffset||t.scrollTop||r.scrollTop,o=window.pageXOffset||t.scrollLeft||r.scrollLeft,a=t.clientTop||r.clientTop,d=t.clientLeft||r.clientLeft,s=e.top+i-a,l=e.left+o-d;return{top:Math.round(s),left:Math.round(l)}},qrcode:function(n){this.QRCodeB?this.QRCodeB.makeCode(n):this.QRCodeB=new o.a("qrcode",{width:80,height:80,text:n,image:""})},enableShare:function(n){Object(d.y)({api_list:"onMenuShareAppMessage,onMenuShareTimeline",url:window.location.href.split("#")[0]}).then(function(e){wx.config({debug:!1,appId:e.appId,timestamp:parseInt(e.timestamp),nonceStr:e.nonceStr,signature:e.signature,jsApiList:e.jsApiList}),wx.ready(function(){wx.onMenuShareTimeline({title:n.product_title,desc:n.desc,link:n.shareUrl,imgUrl:n.shareIcon||"https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png",success:function(){console.log("分享成功")},cancel:function(){console.log("分享失败")}}),wx.onMenuShareAppMessage({title:n.product_title,desc:n.desc,link:n.shareUrl,imgUrl:n.shareIcon||"https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png",success:function(){},cancel:function(){}})})})},handleInviteCode:function(){if(this.invite_code){var n=this.invite_code.split("-");n.length>2&&"TEACHER"===n[1]&&(n[1]="USER");var e=n[0]+"-"+n[1];this.invite_code=e+"-"+this.user_id}else this.invite_code="CC-USER-"+this.user_id},onShare:function(n){this.handleInviteCode();var e="https://wechat-test.changchangenglish.com/#/buyDetail?shopId="+this.shopId+"&invite_code="+this.invite_code;this.enableShare({product_title:this.groupDetail.share_desc.title,desc:this.groupDetail.share_desc.content,shareIcon:this.groupDetail.share_desc.img[0].url,shareUrl:e})},toDataURLBase64:function(n,e){var r=new XMLHttpRequest;r.onload=function(){var n=new FileReader;n.onloadend=function(){e(n.result)},n.readAsDataURL(r.response)},r.responseType="blob",r.open("GET",n,!0),r.send()},getDetail:function(){var n=this;window.location.href.indexOf("invite_code")>-1&&(this.invite_code=this.$route.query.invite_code,2===this.invite_code.split("-").length&&(this.invite_code_f=!1));Object(d.w)().then(function(e){n.user_id=e.user_id,window.location.href.indexOf("shopId")>-1&&(n.shopId=n.$route.query.shopId,Object(d.g)(n.shopId).then(function(e){if(e.desc=JSON.parse(e.desc),e.goods_desc=JSON.parse(e.goods_desc),e.share_desc=JSON.parse(e.share_desc),2===e.status&&e.bind_goods_id)return n.$router.push({name:"buyDetail",query:{shopId:e.bind_goods_id}}),void n.getDetail();n.groupDetail=e;for(var r=0;r<n.groupDetail.header_url.length;r++)n.groupDetail.header_url[r]=n.groupDetail.header_url[r].replace("http://","https://");if(n.groupDetail.desc.detail=n.groupDetail.desc.detail.replace(/http:\/\//g,"https://"),n.groupDetail.desc.qa=n.groupDetail.desc.qa.replace(/http:\/\//g,"https://"),n.groupDetail.share_desc.refImg&&1===n.groupDetail.share_desc.refImg.length){n.groupDetail.share_desc.refImg[0].url=n.groupDetail.share_desc.refImg[0].url.replace("http://","https://");var t=n;n.toDataURLBase64(n.groupDetail.share_desc.refImg[0].url,function(n){t.groupDetail.share_desc.refImg[0].url=n})}var i=n.$route.query.invite_code;n.$sa.track("viewCourseDetail",{goodsID:n.groupDetail.id,courseCate:1===n.groupDetail.course_type?"体验课":"正式课",lessonNumber:n.groupDetail.watch_num,goodsName:n.groupDetail.name,coursePrice:n.groupDetail.original_price/100,discountPrice:n.groupDetail.current_price/100,courseID:n.groupDetail.course_id,courseName:"",salesType:i?i.split("-")[1]:"null",salesID:i?i.split("-")[2]:0}),2===n.groupDetail.goods_type?(localStorage.getItem("cc_token")&&Object(d.s)({goods_id:n.shopId}).then(function(e){e.out_trade_no&&(1===e.buy_type?n.$router.push({name:"buySuccess",query:{out_trade_no:e.out_trade_no}}):n.$router.push({name:"success",query:{out_trade_no:e.out_trade_no}}))}),window.location.href.indexOf("groupId")>-1?(n.groupId=n.$route.query.groupId,Object(d.i)(n.groupId).then(function(e){n.groupData=e}),n.onShare(0)):n.onShare(1)):n.handleInviteCode()}))})},showTeacher:function(){this.popType=!1,this.popupVisible=!0},groupPay:function(n){var e={shopId:this.shopId,invite_code:this.$route.query.invite_code};if(this.groupId&&(e.group_order_id=this.groupId),0!==n||this.groupId){if(0===n&&this.groupId)return this.$router.push({name:"buyDetail",query:{shopId:this.shopId,invite_code:this.$route.query.invite_code}}),window.location.reload(),!1;e.type=""}else e.type="single";this.$router.push({name:"buy",query:e})}}},C=function(){var n=this,e=n.$createElement,r=n._self._c||e;return n.groupDetail?r("div",{ref:"index",staticClass:"group-index"},[r("swiper",{ref:"mySwiper",staticClass:"banner",attrs:{options:n.swiperOption}},[n._l(n.groupDetail.goods_desc.img,function(e,t){return n.groupDetail.goods_desc?r("swiper-slide",{key:t},[r("img",{attrs:{src:e.url}})]):n._e()}),n._v(" "),r("div",{staticClass:"swiper-pagination",attrs:{slot:"pagination"},slot:"pagination"})],2),n._v(" "),1===n.groupDetail.is_auth_user?r("img",{staticClass:"ref-icon shake",attrs:{src:n.refIcon},on:{click:function(e){n.goToActivity()}}}):n._e(),n._v(" "),r("div",{staticClass:"head"},[r("div",{staticClass:"title"},[n._v("\n      "+n._s(n.groupDetail.name)+"\n    ")]),n._v(" "),r("span",{staticClass:"detail"},[n._v("\n              "+n._s(n.groupDetail.goods_desc.desc)+"\n          ")]),n._v(" "),r("div",{staticClass:"price"},[r("span",{staticClass:"price-content"},[n._v("￥"+n._s(n.groupDetail.current_price/100)+"元")])])]),n._v(" "),r("div",{staticClass:"head-icon"},[n._l(n.groupDetail.header_url,function(e,t){return t<5?r("img",{key:e,staticClass:"icon",attrs:{src:e}}):n._e()}),n._v(" "),r("img",{staticClass:"more",attrs:{src:n.moreUrl}}),n._v(" "),r("span",{staticClass:"has"},[n._v("已售"+n._s(n.groupDetail.has_group_num)+"件")])],2),n._v(" "),n.groupDetail.head_welfare&&""!==n.groupDetail.head_welfare&&null!==n.groupDetail.head_welfare?r("div",{staticClass:"welfare"},[n._v("\n    团长福利："+n._s(n.groupDetail.head_welfare)+"\n  ")]):n._e(),n._v(" "),r("div",{staticClass:"main-detail"},[r("div",{staticClass:"tab-content"},[r("div",{class:{"tab-btn":!0,active:n.tabType},on:{click:function(e){n.tabType=!0}}},[n._v("图文详情")]),n._v(" "),r("div",{class:{"tab-btn":!0,active:!n.tabType},on:{click:function(e){n.tabType=!1}}},[n._v("购买须知")])]),n._v(" "),n.tabType?r("div",{staticClass:"detail"},[r("div",{staticClass:"detail-content",domProps:{innerHTML:n._s(n.groupDetail.desc.detail)}})]):n._e(),n._v(" "),n.tabType?n._e():r("div",{staticClass:"qa-block"},[r("div",{staticClass:"qa-content qaDetail",domProps:{innerHTML:n._s(n.groupDetail.desc.qa)}})])]),n._v(" "),r("mt-popup",{model:{value:n.popupVisible,callback:function(e){n.popupVisible=e},expression:"popupVisible"}},[r("div",{staticClass:"pop-block"},[n.popType?r("img",{attrs:{src:n.qrCode}}):n._e(),n._v(" "),n.popType?n._e():r("img",{attrs:{src:n.groupDetail.desc.customer_service[0].url}}),n._v(" "),r("div",[n.popType?r("span",{domProps:{innerHTML:n._s(n.popcontentW)}}):n._e(),n._v(" "),n.popType?n._e():r("span",{domProps:{innerHTML:n._s(n.popcontentT)}})]),n._v(" "),r("img",{staticClass:"close",attrs:{src:n.closeUrl},on:{click:function(e){n.popupVisible=!1}}})])]),n._v(" "),r("mt-popup",{attrs:{closeOnClickModal:!1},model:{value:n.popFill,callback:function(e){n.popFill=e},expression:"popFill"}},[r("div",{staticClass:"pop-fill"},[n._v("\n      您好，本次拼团已经结束。您可以选择重新开团或单独购买\n      "),r("div",{staticClass:"btn-block"},[r("div",{staticClass:"btn",on:{click:function(e){n.rePlay()}}},[n._v("重新开团")])])])]),n._v(" "),r("mt-popup",{staticStyle:{"background-color":"transparent","margin-top":"-80vw","margin-left":"-40vw",transform:"none"},model:{value:n.refVisible,callback:function(e){n.refVisible=e},expression:"refVisible"}},[n.groupDetail.share_desc.refImg&&n.groupDetail.share_desc.refImg.length>0?r("div",{staticClass:"ref-content",style:{backgroundImage:"url("+n.refBg+")"}},[r("div",{staticClass:"tips"},[n._v("\n        长按保存图片\n      ")])]):n._e(),n._v(" "),n.groupDetail.share_desc.refImg&&n.groupDetail.share_desc.refImg.length>0?r("div",{ref:"imageWrapper",staticClass:"img-cvs",attrs:{id:"capture"}},[r("img",{attrs:{src:n.groupDetail.share_desc.refImg[0].url}}),n._v(" "),r("div",{staticClass:"qrcode",attrs:{id:"qrcode"}})]):n._e(),n._v(" "),r("img",{staticClass:"cvs-img",attrs:{src:n.dataURL}})]),n._v(" "),1===n.groupDetail.status&&n.invite_code_f?r("div",[n.groupDetail.goods_type&&2===n.groupDetail.goods_type?r("footer",[r("div",{staticClass:"btn",on:{click:function(e){n.showTeacher()}}},[r("img",{attrs:{src:n.weChatIcon}})]),n._v(" "),n.groupData&&0!==n.groupData.status?r("div",{staticClass:"btn big price full"},[n.groupId?r("div",[n._v("该团已满")]):n._e()]):n._e(),n._v(" "),r("div",{class:n.groupData&&0!==n.groupData.status?"btn big price":"btn big",attrs:{id:n.groupId?"reGroup":"singleBuy"},on:{click:function(e){n.groupPay(0)}}},[n.groupId?n._e():r("span",[n._v("￥"+n._s(n.groupDetail.original_price/100))]),n._v(" "),n.groupId?n._e():r("div",[n._v("单独购")]),n._v(" "),n.groupId?r("span",[n._v("￥"+n._s(n.groupDetail.current_price/100))]):n._e(),n._v(" "),n.groupId?r("div",[n._v("重新开团")]):n._e()]),n._v(" "),n.groupData&&0!==n.groupData.status?n._e():r("div",{staticClass:"btn big price",attrs:{id:n.groupId?"joinGroup":"newGroup"},on:{click:function(e){n.groupPay(1)}}},[r("span",[n._v("￥"+n._s(n.groupDetail.current_price/100))]),n._v(" "),n.groupId?n._e():r("div",[n._v(n._s(n.groupDetail.desc.group_number)+"人团")]),n._v(" "),n.groupId?r("div",[n._v("立即参团")]):n._e()])]):n._e(),n._v(" "),n.groupDetail.goods_type&&2!==n.groupDetail.goods_type?r("footer",[r("div",{staticClass:"btn",on:{click:function(e){n.showTeacher()}}},[r("img",{attrs:{src:n.weChatIcon}})]),n._v(" "),r("div",{staticClass:"btn big price",on:{click:function(e){n.groupPay(1)}}},[r("span",[n._v("￥"+n._s(n.groupDetail.current_price/100))]),n._v(" "),r("div",[n._v("立即购买")])])]):n._e()]):n._e(),n._v(" "),1!==n.groupDetail.status?r("div",[n._m(0)]):n._e()],1):n._e()};C._withStripped=!0;var x={render:C,staticRenderFns:[function(){var n=this.$createElement,e=this._self._c||n;return e("footer",[e("div",{staticStyle:{color:"#888"}},[this._v("\n        已售罄\n      ")])])}]},_=x;var D=!1;var y=r("VU/8")(b,_,!1,function(n){D||(r("9Nk9"),r("rC6I"))},"data-v-ff30e8ae",null);y.options.__file="src/components/buy/index.vue";e.default=y.exports},rC6I:function(n,e,r){var t=r("5W4P");"string"==typeof t&&(t=[[n.i,t,""]]),t.locals&&(n.exports=t.locals);r("rjj0")("dc25c13e",t,!1,{})},yEDY:function(n,e,r){(n.exports=r("FZ+f")(!0)).push([n.i,"\nimg,video{\n  max-width: 100%;\n}\n@-webkit-keyframes swing {\n10% {\n    -webkit-transform: rotate(15deg);\n            transform: rotate(15deg);\n}\n20% {\n    -webkit-transform: rotate(-10deg);\n            transform: rotate(-10deg);\n}\n30% {\n    -webkit-transform: rotate(5deg);\n            transform: rotate(5deg);\n}\n40% {\n    -webkit-transform: rotate(-5deg);\n            transform: rotate(-5deg);\n}\n50%, 100% {\n    -webkit-transform: rotate(0deg);\n            transform: rotate(0deg);\n}\n}\n.shake{\n   -webkit-animation-name: swing;\n   -webkit-animation-duration: 0.8s;\n   -webkit-transform-origin:50% 50%;\n   -webkit-animation-iteration-count: infinite;\n   -webkit-animation-timing-function: linear;\n}\n\n","",{version:3,sources:["D:/myproject/new-singsingH5/src/components/buy/src/components/buy/index.vue"],names:[],mappings:";AA8cA;EACA,gBAAA;CACA;AACA;AACA;IACA,iCAAA;YAAA,yBAAA;CACA;AACA;IACA,kCAAA;YAAA,0BAAA;CACA;AACA;IACA,gCAAA;YAAA,wBAAA;CACA;AACA;IACA,iCAAA;YAAA,yBAAA;CACA;AACA;IACA,gCAAA;YAAA,wBAAA;CACA;CACA;AACA;GACA,8BAAA;GACA,iCAAA;GACA,iCAAA;GACA,4CAAA;GACA,0CAAA;CACA",file:"index.vue",sourcesContent:['<template>\r\n  <div class="group-index" ref="index" v-if="groupDetail">\r\n    <swiper :options="swiperOption" class="banner" ref="mySwiper">\r\n      <swiper-slide v-if="groupDetail.goods_desc" v-for="(data,index) in groupDetail.goods_desc.img" :key="index">\r\n        <img :src="data.url"/>\r\n      </swiper-slide>\r\n      <div class="swiper-pagination" slot="pagination"></div>\r\n    </swiper>\r\n    <img :src="refIcon" class="ref-icon shake" @click="goToActivity()" v-if="groupDetail.is_auth_user === 1">\r\n    <div class="head">\r\n      <div class="title">\r\n        {{groupDetail.name}}\r\n      </div>\r\n      <span class="detail">\r\n                {{groupDetail.goods_desc.desc}}\r\n            </span>\r\n      <div class="price">\r\n        <span class="price-content">￥{{groupDetail.current_price/100}}元</span>\r\n      </div>\r\n\r\n    </div>\r\n    <div class="head-icon">\r\n      <img class="icon" v-for="(data,index) in groupDetail.header_url" v-if="index<5" :src="data" :key="data">\r\n      <img class="more" :src="moreUrl"/>\r\n      <span class="has">已售{{groupDetail.has_group_num}}件</span>\r\n    </div>\r\n    <div class="welfare" v-if="groupDetail.head_welfare && groupDetail.head_welfare !== \'\' && groupDetail.head_welfare !== null">\r\n      团长福利：{{groupDetail.head_welfare}}\r\n    </div>\r\n    <div class="main-detail">\r\n      <div class="tab-content">\r\n        <div :class="{\'tab-btn\':true,active:tabType}" @click="tabType=true">图文详情</div>\r\n        <div :class="{\'tab-btn\':true,active:!tabType}" @click="tabType=false">购买须知</div>\r\n      </div>\r\n      <div v-if="tabType" class="detail">\r\n        <div v-html="groupDetail.desc.detail" class="detail-content"></div>\r\n      </div>\r\n      <div v-if="!tabType" class="qa-block">\r\n        <div class="qa-content qaDetail" v-html="groupDetail.desc.qa">\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <mt-popup v-model="popupVisible">\r\n      <div class="pop-block">\r\n        <img v-if="popType" :src="qrCode"/>\r\n        <img v-if="!popType" :src="groupDetail.desc.customer_service[0].url"/>\r\n        <div>\r\n          <span v-if="popType" v-html="popcontentW"></span>\r\n          <span v-if="!popType" v-html="popcontentT"></span>\r\n        </div>\r\n        <img class="close" :src="closeUrl" @click="popupVisible = false">\r\n      </div>\r\n    </mt-popup>\r\n    <mt-popup v-model="popFill" :closeOnClickModal="false">\r\n      <div class="pop-fill">\r\n        您好，本次拼团已经结束。您可以选择重新开团或单独购买\r\n        <div class="btn-block">\r\n          <div class="btn" @click="rePlay()">重新开团</div>\r\n        </div>\r\n      </div>\r\n    </mt-popup>\r\n    <mt-popup v-model="refVisible" style="background-color: transparent;margin-top: -80vw;margin-left: -40vw;transform: none">\r\n      <div :style="{backgroundImage:`url(${refBg})`}" class="ref-content"\r\n           v-if="groupDetail.share_desc.refImg && groupDetail.share_desc.refImg.length > 0">\r\n        <div class="tips">\r\n          长按保存图片\r\n        </div>\r\n      </div>\r\n      <div class="img-cvs" id="capture" ref="imageWrapper" v-if="groupDetail.share_desc.refImg && groupDetail.share_desc.refImg.length > 0">\r\n        <img :src="groupDetail.share_desc.refImg[0].url">\r\n        <div id="qrcode" class="qrcode">\r\n        </div>\r\n      </div>\r\n      <img :src="dataURL" class="cvs-img"/>\r\n    </mt-popup>\r\n    <div v-if="groupDetail.status === 1 && invite_code_f">\r\n    <footer v-if="groupDetail.goods_type && groupDetail.goods_type === 2">\r\n      <div class="btn" @click="showTeacher()">\r\n        <img :src="weChatIcon"/>\r\n      </div>\r\n      <div class="btn big price full" v-if="groupData && groupData.status !== 0">\r\n        <div v-if="groupId">该团已满</div>\r\n      </div>\r\n      <div :class=" groupData && groupData.status !== 0 ? \'btn big price\':\'btn big\'" @click="groupPay(0)" :id="groupId ? \'reGroup\':\'singleBuy\'">\r\n        <span v-if="!groupId">￥{{groupDetail.original_price/100}}</span>\r\n        <div v-if="!groupId">单独购</div>\r\n        <span v-if="groupId">￥{{groupDetail.current_price/100}}</span>\r\n        <div v-if="groupId">重新开团</div>\r\n      </div>\r\n      <div class="btn big price" @click="groupPay(1)" :id="groupId ? \'joinGroup\':\'newGroup\'" v-if="!groupData || groupData.status === 0">\r\n        <span>￥{{groupDetail.current_price/100}}</span>\r\n        <div v-if="!groupId">{{groupDetail.desc.group_number}}人团</div>\r\n        <div v-if="groupId">立即参团</div>\r\n      </div>\r\n\r\n    </footer>\r\n    <footer v-if="groupDetail.goods_type && groupDetail.goods_type !== 2">\r\n      <div class="btn" @click="showTeacher()">\r\n        <img :src="weChatIcon"/>\r\n      </div>\r\n      <div class="btn big price" @click="groupPay(1)">\r\n        <span>￥{{groupDetail.current_price/100}}</span>\r\n        <div>立即购买</div>\r\n      </div>\r\n    </footer>\r\n    </div>\r\n    <div v-if="groupDetail.status !== 1">\r\n      <footer>\r\n        <div style="color: #888">\r\n          已售罄\r\n        </div>\r\n      </footer>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\n  import \'swiper/dist/css/swiper.css\'\r\n  import { swiper, swiperSlide } from \'vue-awesome-swiper\'\r\n  import  QRCode from \'qrcodejs2\'\r\n  import { Indicator } from \'mint-ui\';\r\n  import {getwechatParam,getGoodsDetailApi,getGroupDetailApi,getStatusWechatApi,getUserDetailApi} from "../../service/api";\r\n  import refBg from \'../../assets/refBg.png\'\r\n  import moreUrl from \'../../assets/moreIcon.png\'\r\n  import weChatIcon from \'../../assets/wechatIcon.png\'\r\n  import weChatQrUrl from \'../../assets/weChatCode.png\'\r\n  import closeUrl from \'../../assets/closemy.png\'\r\n  import html2canvas from \'html2canvas\'\r\n  export default {\r\n    name: "index",\r\n    components: {\r\n      swiper,\r\n      swiperSlide,\r\n    },\r\n    data(){\r\n      return {\r\n        refBg:refBg,\r\n        join:false,\r\n        popType:false,\r\n        popFill:false,\r\n        popupVisible:false,\r\n        refVisible:false,\r\n        tabType:true,\r\n        popcontentW:`您已经购买过课程，无需重复<br>购买，您可以添加微信公众号了解更多`,\r\n        popcontentT:`为了更好地为您进行课程服务，<br>请扫码添加老师二维码`,\r\n        qrCode:weChatQrUrl,\r\n        weChatIcon:weChatIcon,\r\n        closeUrl:closeUrl,\r\n        moreUrl:moreUrl,\r\n        refIcon:\'https://cdn.singsingenglish.com/new-sing/b7f43ced8f8268655c2c5b289360df990ec8f18e.png\',\r\n        swiperOption: {\r\n          pagination: {\r\n            el: \'.swiper-pagination\'\r\n          }\r\n        },\r\n        QRCodeB:false,\r\n        dataURL:null,\r\n        user_id:null,\r\n        invite_code_f:true,\r\n        invite_code:\'\',\r\n        shopId:\'\',\r\n        groupId:null,\r\n        groupDetail:false,\r\n        groupData:null,\r\n      }\r\n    },\r\n    mounted(){\r\n      this.getDetail();\r\n    },\r\n    methods:{\r\n      goToActivity(){\r\n        let query = {}\r\n        if(window.location.href.indexOf(\'shopId\')>-1){\r\n          query.shopId = this.$route.query.shopId;\r\n        }\r\n        if(window.location.href.indexOf(\'groupId\')>-1){\r\n          query.groupId = this.$route.query.groupId;\r\n        }\r\n        if(window.location.href.indexOf(\'invite_code\')> -1) {\r\n          query.invite_code = this.$route.query.invite_code;\r\n        }\r\n        this.$router.push({name:\'activity\',query:query})\r\n      },\r\n      refshow(){\r\n        Indicator.open();\r\n        if(document.body.scrollTop < 10){\r\n          document.body.scrollTop = 20;\r\n          document.documentElement.scrollTop = 20;\r\n        }\r\n        if(localStorage.getItem(\'cc_token\') && localStorage.getItem(\'cc_token\') !== \'\'){\r\n          setTimeout(()=>{\r\n            Indicator.close();\r\n            if(!this.invite_code){\r\n              this.invite_code = \'CC-USER\'\r\n            }\r\n              let invite_code = this.invite_code.split(\'-\');\r\n              if(invite_code.length > 2 && invite_code[1] === \'TEACHER\'){\r\n                invite_code[1] = \'USER\'\r\n              }\r\n              let code = `${invite_code[0]}-${invite_code[1]}`;\r\n              let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${code}-${this.user_id}`;\r\n              if(this.groupId && this.groupId !== \'null\'){\r\n                URL += `&groupId=${this.groupId}`\r\n              }\r\n              this.qrcode(URL);\r\n              this.refVisible = true;\r\n              this.$nextTick(()=>{\r\n                if(!this.dataURL){\r\n                  setTimeout(()=>{\r\n                    let {\r\n                      height,\r\n                      width\r\n                    } = document.getElementById(\'capture\').getClientRects()[0]\r\n                    document.getElementById(\'capture\').style.width = width + \'px\';\r\n                    let o = this.getOffsetRect(this.$refs.imageWrapper);\r\n                    let {\r\n                      height1,\r\n                      width1\r\n                    } = document.getElementById(\'capture\').getClientRects()[0];\r\n                    html2canvas(document.getElementById(\'capture\'),{\r\n                      async: true,\r\n                      timeout: 500,\r\n                      scrollX:1,\r\n                      scale: 3,\r\n                      width: width1,\r\n                      height: height1,\r\n                      letterRendering: true,\r\n                    }).then((canvas) => {\r\n                      let dataURL = canvas.toDataURL("image/jpg");\r\n                      this.dataURL = dataURL;\r\n                    }).catch(res=>{alert(res);console.log()});\r\n                  },500)\r\n                }else{\r\n\r\n                }\r\n              })\r\n          },500)\r\n\r\n        }else{\r\n          let query = {retUrl:this.$route.fullPath,is_new_user_url:\'1\'};\r\n          this.$router.push({name:\'author\',query:query})\r\n        }\r\n      },\r\n      getOffsetRect(ele){\r\n        var box=ele.getBoundingClientRect();\r\n        var body=document.body,\r\n          docElem=document.documentElement;\r\n        //获取页面的scrollTop,scrollLeft(兼容性写法)\r\n        var scrollTop=window.pageYOffset||docElem.scrollTop||body.scrollTop,\r\n          scrollLeft=window.pageXOffset||docElem.scrollLeft||body.scrollLeft;\r\n        var clientTop=docElem.clientTop||body.clientTop,\r\n          clientLeft=docElem.clientLeft||body.clientLeft;\r\n        var top=box.top+scrollTop-clientTop,\r\n          left=box.left+scrollLeft-clientLeft;\r\n        return {\r\n          //Math.round 兼容火狐浏览器bug\r\n          top:Math.round(top),\r\n          left:Math.round(left)\r\n        }\r\n      },\r\n      qrcode(data){\r\n        if(this.QRCodeB){\r\n          this.QRCodeB.makeCode(data)\r\n        }else{\r\n          this.QRCodeB = new QRCode(\'qrcode\', {\r\n            width: 80,\r\n            height: 80, // 高度\r\n            text: data, // 二维码内容\r\n            image: \'\'\r\n          });\r\n        }\r\n\r\n      },\r\n      // 分享\r\n      enableShare: function(option) {\r\n        let that = this;\r\n        getwechatParam({\r\n          api_list:   \'onMenuShareAppMessage,onMenuShareTimeline\',\r\n          url:window.location.href.split(\'#\')[0]\r\n        }).then(wechatRes => {\r\n          wx.config({\r\n            debug: false,\r\n            appId: wechatRes.appId,\r\n            timestamp: parseInt(wechatRes.timestamp),\r\n            nonceStr: wechatRes.nonceStr,\r\n            signature: wechatRes.signature,\r\n            jsApiList: wechatRes.jsApiList\r\n          });\r\n          wx.ready(function() {\r\n            wx.onMenuShareTimeline({\r\n              title: option.product_title, // 分享标题\r\n              desc: option.desc,// 分享描述\r\n              link: option.shareUrl, // 分享链接\r\n              imgUrl: option.shareIcon || \'https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png\', // 分享图标\r\n              success: function() {\r\n                console.log(\'分享成功\');\r\n              },\r\n              cancel: function() {\r\n                // alert("失败")\r\n                console.log(\'分享失败\')\r\n              }\r\n            });\r\n            wx.onMenuShareAppMessage({\r\n              title: option.product_title, // 分享标题\r\n              desc: option.desc,// 分享描述\r\n              link: option.shareUrl, // 分享链接\r\n              imgUrl: option.shareIcon || \'https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png\', // 分享图标\r\n              success: function() {\r\n              },\r\n              cancel: function() {\r\n              }\r\n            });\r\n          })\r\n        })\r\n      },\r\n      // 处理invite_code\r\n      handleInviteCode(){\r\n        if(!this.invite_code){\r\n          this.invite_code = \'CC-USER-\'+this.user_id;\r\n        }else{\r\n          let invite_code = this.invite_code.split(\'-\');\r\n          if(invite_code.length > 2 && invite_code[1] === \'TEACHER\'){\r\n            invite_code[1] = \'USER\'\r\n          }\r\n          let code = `${invite_code[0]}-${invite_code[1]}`;\r\n          this.invite_code = `${code}-${this.user_id}`;\r\n        }\r\n      },\r\n      onShare: function(type) {\r\n\r\n            this.handleInviteCode();\r\n        let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${this.invite_code}`\r\n        this.enableShare({\r\n          product_title: this.groupDetail.share_desc.title,\r\n          desc: this.groupDetail.share_desc.content,\r\n          shareIcon:this.groupDetail.share_desc.img[0].url,\r\n          shareUrl:URL\r\n        })\r\n      },\r\n      toDataURLBase64 (src, callback) {\r\n        let xhttp = new XMLHttpRequest();\r\n        xhttp.onload = function () {\r\n          let fileReader = new FileReader();\r\n          fileReader.onloadend = function () {\r\n            callback(fileReader.result)\r\n          };\r\n          fileReader.readAsDataURL(xhttp.response)\r\n        };\r\n        xhttp.responseType = \'blob\';\r\n        xhttp.open(\'GET\', src, true);\r\n        xhttp.send()\r\n      },\r\n      // 初始化\r\n      getDetail(){\r\n        if(window.location.href.indexOf(\'invite_code\')> -1){\r\n          this.invite_code = this.$route.query.invite_code;\r\n          let l = this.invite_code.split(\'-\').length;\r\n          if(l === 2 ){\r\n            this.invite_code_f = false\r\n          }\r\n        }\r\n        getUserDetailApi().then(res=>{\r\n            this.user_id=res.user_id;\r\n        if(window.location.href.indexOf(\'shopId\')>-1){\r\n          this.shopId = this.$route.query.shopId;\r\n          getGoodsDetailApi(this.shopId).then(res=>{\r\n            res.desc = JSON.parse(res.desc);\r\n            res.goods_desc = JSON.parse(res.goods_desc);\r\n            res.share_desc = JSON.parse(res.share_desc);\r\n            //商品下架跳转绑定商品\r\n            if(res.status === 2 && res.bind_goods_id){\r\n              this.$router.push({name:\'buyDetail\',query:{shopId:res.bind_goods_id}});\r\n              this.getDetail();\r\n              return\r\n            }\r\n            this.groupDetail = res;\r\n            for (let i = 0;i<this.groupDetail.header_url.length;i++){\r\n              this.groupDetail.header_url[i]=this.groupDetail.header_url[i].replace(\'http://\',\'https://\')\r\n            }\r\n            this.groupDetail.desc.detail = this.groupDetail.desc.detail.replace(/http:\\/\\//g,\'https://\');\r\n            this.groupDetail.desc.qa = this.groupDetail.desc.qa.replace(/http:\\/\\//g,\'https://\');\r\n            if(this.groupDetail.share_desc.refImg && this.groupDetail.share_desc.refImg.length === 1){\r\n              this.groupDetail.share_desc.refImg[0].url = this.groupDetail.share_desc.refImg[0].url.replace(\'http://\',\'https://\');\r\n              let _this = this;\r\n              this.toDataURLBase64(this.groupDetail.share_desc.refImg[0].url, function (avatarUrl) {\r\n                _this.groupDetail.share_desc.refImg[0].url = avatarUrl;\r\n              });\r\n            }\r\n            let invite = this.$route.query.invite_code;\r\n            this.$sa.track(\'viewCourseDetail\',{\r\n              goodsID:this.groupDetail.id,\r\n              courseCate:this.groupDetail.course_type === 1 ? \'体验课\' : \'正式课\',\r\n              lessonNumber:this.groupDetail.watch_num,\r\n              goodsName:this.groupDetail.name,\r\n              coursePrice:this.groupDetail.original_price/100,\r\n              discountPrice:this.groupDetail.current_price/100,\r\n              courseID:this.groupDetail.course_id,\r\n              courseName:\'\',\r\n              salesType:invite?invite.split(\'-\')[1]:\'null\',\r\n              salesID:invite?invite.split(\'-\')[2]:0\r\n            });\r\n            if(this.groupDetail.goods_type === 2){\r\n              if(localStorage.getItem(\'cc_token\')){\r\n                getStatusWechatApi({goods_id:this.shopId}).then(res=>{\r\n                  if(res.out_trade_no){\r\n                    if(res.buy_type === 1){\r\n                      this.$router.push({name:\'buySuccess\',query:{out_trade_no:res.out_trade_no}});\r\n                    }else{\r\n                      this.$router.push({name:\'success\',query:{out_trade_no:res.out_trade_no}});\r\n                    }\r\n                  }\r\n                });\r\n              }\r\n              if(window.location.href.indexOf(\'groupId\')>-1){\r\n                this.groupId = this.$route.query.groupId;\r\n                getGroupDetailApi(this.groupId).then(res=>{\r\n                  this.groupData = res\r\n                });\r\n                this.onShare(0)\r\n              }else{\r\n                this.onShare(1)\r\n              }\r\n            }else{\r\n              this.handleInviteCode()\r\n            }\r\n          })\r\n        }\r\n        });\r\n      },\r\n      showTeacher(){\r\n        this.popType = false;\r\n        this.popupVisible = true\r\n      },\r\n      groupPay(type){\r\n        let query = {shopId: this.shopId,invite_code:this.$route.query.invite_code};\r\n        if(this.groupId){\r\n          query.group_order_id = this.groupId\r\n        }\r\n        if(type === 0 && !this.groupId){\r\n          query.type=\'single\';\r\n        }else if (type === 0 && this.groupId){\r\n          this.$router.push({\r\n            name: \'buyDetail\',\r\n            query:{\r\n              shopId:this.shopId,\r\n              invite_code:this.$route.query.invite_code\r\n            }\r\n          });\r\n          window.location.reload();\r\n          return false\r\n        } else{\r\n          query.type=\'\'\r\n        }\r\n        this.$router.push({\r\n          name: \'buy\',\r\n          query:query\r\n        })\r\n      }\r\n    }\r\n  }\r\n<\/script>\r\n<style>\r\n  img,video{\r\n    max-width: 100%;\r\n  }\r\n  @-webkit-keyframes swing {\r\n    10% {\r\n      transform: rotate(15deg);\r\n    }\r\n    20% {\r\n      transform: rotate(-10deg);\r\n    }\r\n    30% {\r\n      transform: rotate(5deg);\r\n    }\r\n    40% {\r\n      transform: rotate(-5deg);\r\n    }\r\n    50%, 100% {\r\n      transform: rotate(0deg);\r\n    }\r\n  }\r\n  .shake{\r\n     -webkit-animation-name: swing;\r\n     -webkit-animation-duration: 0.8s;\r\n     -webkit-transform-origin:50% 50%;\r\n     -webkit-animation-iteration-count: infinite;\r\n     -webkit-animation-timing-function: linear;\r\n   }\r\n\r\n</style>\r\n<style scoped lang="less">\r\n  @import "../../util/public";\r\n  .img-cvs{\r\n    position: absolute;\r\n    width: 233 * @toVw;\r\n    top: 176 * @toVw;\r\n    left: 29 * @toVw;\r\n    .qrcode{\r\n      position: absolute;\r\n      top: 305 * @toVw;\r\n      left: 15 * @toVw;\r\n      width: 60 * @toVw;\r\n    }\r\n  }\r\n  .cvs-img{\r\n    position: absolute;\r\n    width: 233 * @toVw;\r\n    top: 176 * @toVw;\r\n    left: 29 * @toVw;\r\n    z-index: 10;\r\n  }\r\n  .ref-content{\r\n    width: 299 * @toVw;\r\n    height: 564 * @toVw;\r\n    background-size: 100% 100%;\r\n    position: relative;\r\n    .tips{\r\n      font-size: 12px;\r\n      position: absolute;\r\n      color: #666;\r\n      right: 10 * @toVw;\r\n      top: 250 * @toVw;\r\n      width: 1em;\r\n    }\r\n  }\r\n  .group-index{\r\n    height: 100%;\r\n    padding-bottom: toVw(150);\r\n    background: #f0f0f0;\r\n    font-family: PingFangSC-Regular;\r\n    .ref-icon{\r\n      position: fixed;\r\n      height: 100/375 * 90vw ;\r\n      top: 70vw;\r\n      z-index: 6;\r\n      right: 10 * 100 /375vw;\r\n      /*border-radius: 100px;*/\r\n    }\r\n    .banner{\r\n      background: white;\r\n      img{\r\n        width: 100%;\r\n      }\r\n    }\r\n    .head{\r\n      background: white;\r\n      margin-bottom: 10px;\r\n      padding: 20/7.5vw;\r\n      .title{\r\n        font-size: 20px;\r\n        color: #333333;\r\n        margin-bottom: 15/7.5vw;\r\n      }\r\n      .detail{\r\n        font-size: 12px;\r\n        line-height: 1.6em;\r\n        color: #333333;\r\n        display: block;\r\n        margin-bottom: 15/7.5vw;\r\n      }\r\n      .price{\r\n        .price-content{\r\n          font-family: PingFang-SC-Bold;\r\n          font-size: 20px;\r\n          color: #F83534;\r\n        }\r\n      }\r\n    }\r\n    .head-icon{\r\n      padding: 20/7.5vw;\r\n      background: white;\r\n      margin-bottom: 2px;\r\n      .icon{\r\n        display: inline-block;\r\n        width: 60/7.5vw;\r\n        margin: 0 10/7.5vw;\r\n        border-radius: 1000px;\r\n        vertical-align: middle;\r\n      }\r\n      .more{\r\n        width: 50/7.5vw;\r\n        vertical-align: middle;\r\n      }\r\n      .has{\r\n        font-size: 12px;\r\n        line-height: 60/7.5vw;\r\n        color: #999999;\r\n        float: right;\r\n      }\r\n    }\r\n    .welfare{\r\n      background: white;\r\n      padding:10/7.5vw ;\r\n      font-size: 12px;\r\n      text-align: center;\r\n      color: #999999;\r\n      margin-bottom: 20px;\r\n    }\r\n    .main-detail{\r\n      padding: 20/7.5vw;\r\n      background: white;\r\n      .tab-content{\r\n        border-radius: 9px ;\r\n        border: 1px solid #F63539;\r\n        &:after{\r\n          content: \'\';\r\n          display: block;\r\n          clear: both;\r\n        }\r\n        .tab-btn{\r\n          width: 50%;\r\n          float: left;\r\n          height: 80/7.5vw;\r\n          line-height: 80/7.5vw;\r\n          text-align: center;\r\n          color: #F63539;\r\n          border-radius:9px ;\r\n          &.active{\r\n            background: #F63539;\r\n            color: white;\r\n          }\r\n        }\r\n      }\r\n      .qa-block{\r\n        padding: 20/7.5vw 0 toVw(150) 0;\r\n        img,video{\r\n          max-width: 100%;\r\n        }\r\n        .qa-content{\r\n          margin: toVw(10) 0;\r\n          .qa-q{\r\n            font-size: 16px;\r\n            color: #666666;\r\n          }\r\n          .qa-a{\r\n            font-size: 16px;\r\n            color: #333333;\r\n          }\r\n        }\r\n      }\r\n      .detail{\r\n        padding: 20/7.5vw 0 150/7.5vw 0;\r\n        .detail-content{\r\n          img,video{\r\n            max-width: 100%;\r\n          }\r\n        }\r\n\r\n      }\r\n    }\r\n    footer{\r\n      position: absolute;\r\n      position: fixed;\r\n      bottom: 0;\r\n      width: 100%;\r\n      height: 120/7.5vw;\r\n      display: -webkit-box;      // OLD - iOS 6-, Safari 3.1-6 //\r\n      display: -moz-box;         // OLD - Firefox 19- (buggy but mostly works) //\r\n      display: -ms-flexbox;      // TWEENER - IE 10 //\r\n      display: -webkit-flex;     // NEW - Chrome //\r\n      display: flex;             // NEW, Spec - Opera 12.1, Firefox 20+ //\r\n      background: white;\r\n      padding: 10/7.5vw;\r\n      border-top: 1px solid #d8d8d8;\r\n      justify-content:space-around;\r\n      .btn{\r\n        border: 1px solid #cccccc;\r\n        border-radius: 8px;\r\n        width:0;\r\n        flex-grow:2;\r\n        text-align: center;\r\n        padding: 15/7.5vw 0;\r\n        margin: 0 10/7.5vw;\r\n        line-height: 1.4em;\r\n        font-size: 16px;\r\n        color: #666666;\r\n        span{\r\n          display: block;\r\n          font-size: 20px;\r\n          font-family: PingFang-SC-Bold;\r\n        }\r\n        img{\r\n          width: 50/7.5vw;\r\n        }\r\n        &.big{\r\n          padding: 5/7.5vw 0;\r\n          flex-grow:5;\r\n          &.price{\r\n            background:  #F83534;\r\n            border-color: #F83534;\r\n            color: white;\r\n            &.full{\r\n              background: #dddddd;\r\n              border-color: #dddddd;\r\n              line-height: 50*@toVw;\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n    .pop-block{\r\n      padding:40/7.5vw 10/7.5vw;\r\n      width: 600/7.5vw;\r\n      text-align: center;\r\n      font-size: 14px;\r\n      color: #666666;\r\n      position: relative;\r\n      img{\r\n        width: 250/7.5vw;\r\n      }\r\n      .close{\r\n        width: 50/7.5vw;\r\n        position: absolute;\r\n        top: 20/7.5vw;\r\n        right: 20/7.5vw;\r\n      }\r\n    }\r\n    .mint-popup{\r\n      border-radius: 10px;\r\n    }\r\n    .pop-fill{\r\n      width: 500/7.5vw;\r\n      padding:30/7.5vw 30/7.5vw;\r\n      font-size: 16px;\r\n      color: #333333;\r\n      .btn-block{\r\n        margin-top: 30/7.5vw;\r\n        &:after{\r\n          content:\'\';\r\n          display: block;\r\n          clear: both;\r\n        }\r\n        .btn{\r\n          float: right;\r\n          background: #F83534;\r\n          font-size: 14px;\r\n          padding: 5/7.5vw 10/7.5vw;\r\n          border-radius: 8px;\r\n          color: #FFFFFF;\r\n        }\r\n      }\r\n    }\r\n\r\n  }\r\n\r\n</style>\r\n'],sourceRoot:""}])}});
//# sourceMappingURL=9.6412051a38e23e19e94c.js.map