webpackJsonp([9],{"5W4P":function(n,e,t){(n.exports=t("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:"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",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@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,t){var i=t("yEDY");"string"==typeof i&&(i=[[n.i,i,""]]),i.locals&&(n.exports=i.locals);t("rjj0")("134c077c",i,!1,{})},bNYG:function(n,e,t){"use strict";Object.defineProperty(e,"__esModule",{value:!0});t("v2ns");var i=t("7QTg"),o=t("MJLE"),a=t.n(o),r=t("Au9i"),d=t("CCn6"),s=t("E26C"),l=t.n(s),c=t("kXdI"),p=t.n(c),A=(t("1UEi"),t("XaoW")),g=t.n(A),u=t("zpE/"),h=t.n(u),f=t("0ZjB"),v=t.n(f),w=t("2Pnh"),m=t.n(w),b={name:"index",components:{swiper:i.swiper,swiperSlide:i.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:p.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(r.Indicator.open(),document.body.scrollTop<10&&(document.body.scrollTop=20,document.documentElement.scrollTop=20),localStorage.getItem("cc_token")&&""!==localStorage.getItem("cc_token"))setTimeout(function(){r.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 t=e[0]+"-"+e[1],i="https://wechat-test.changchangenglish.com/#/buyDetail?shopId="+n.shopId+"&invite_code="+t+"-"+n.user_id;n.groupId&&"null"!==n.groupId&&(i+="&groupId="+n.groupId),n.qrcode(i),n.refVisible=!0,n.$nextTick(function(){n.dataURL||setTimeout(function(){var e=document.getElementById("capture").getClientRects()[0],t=(e.height,e.width);document.getElementById("capture").style.width=t+"px";n.getOffsetRect(n.$refs.imageWrapper);var i=document.getElementById("capture").getClientRects()[0],o=i.height1,a=i.width1;m()(document.getElementById("capture"),{async:!0,timeout:500,scrollX:1,scale:3,width:a,height:o,letterRendering:!0}).then(function(e){var t=e.toDataURL("image/jpg");n.dataURL=t}).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(),t=document.body,i=document.documentElement,o=window.pageYOffset||i.scrollTop||t.scrollTop,a=window.pageXOffset||i.scrollLeft||t.scrollLeft,r=i.clientTop||t.clientTop,d=i.clientLeft||t.clientLeft,s=e.top+o-r,l=e.left+a-d;return{top:Math.round(s),left:Math.round(l)}},qrcode:function(n){this.QRCodeB?this.QRCodeB.makeCode(n):this.QRCodeB=new a.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 t=new XMLHttpRequest;t.onload=function(){var n=new FileReader;n.onloadend=function(){e(n.result)},n.readAsDataURL(t.response)},t.responseType="blob",t.open("GET",n,!0),t.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 t=0;t<n.groupDetail.header_url.length;t++)n.groupDetail.header_url[t]=n.groupDetail.header_url[t].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 i=n;n.toDataURLBase64(n.groupDetail.share_desc.refImg[0].url,function(n){i.groupDetail.share_desc.refImg[0].url=n})}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,t=n._self._c||e;return n.groupDetail?t("div",{ref:"index",staticClass:"group-index"},[t("swiper",{ref:"mySwiper",staticClass:"banner",attrs:{options:n.swiperOption}},[n._l(n.groupDetail.goods_desc.img,function(e,i){return n.groupDetail.goods_desc?t("swiper-slide",{key:i},[t("img",{attrs:{src:e.url}})]):n._e()}),n._v(" "),t("div",{staticClass:"swiper-pagination",attrs:{slot:"pagination"},slot:"pagination"})],2),n._v(" "),1===n.groupDetail.is_auth_user?t("img",{staticClass:"ref-icon shake",attrs:{src:n.refIcon},on:{click:function(e){n.goToActivity()}}}):n._e(),n._v(" "),t("div",{staticClass:"head"},[t("div",{staticClass:"title"},[n._v("\n      "+n._s(n.groupDetail.name)+"\n    ")]),n._v(" "),t("span",{staticClass:"detail"},[n._v("\n              "+n._s(n.groupDetail.goods_desc.desc)+"\n          ")]),n._v(" "),t("div",{staticClass:"price"},[t("span",{staticClass:"price-content"},[n._v("￥"+n._s(n.groupDetail.current_price/100)+"元")])])]),n._v(" "),t("div",{staticClass:"head-icon"},[n._l(n.groupDetail.header_url,function(e,i){return i<5?t("img",{key:e,staticClass:"icon",attrs:{src:e}}):n._e()}),n._v(" "),t("img",{staticClass:"more",attrs:{src:n.moreUrl}}),n._v(" "),t("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?t("div",{staticClass:"welfare"},[n._v("\n    团长福利："+n._s(n.groupDetail.head_welfare)+"\n  ")]):n._e(),n._v(" "),t("div",{staticClass:"main-detail"},[t("div",{staticClass:"tab-content"},[t("div",{class:{"tab-btn":!0,active:n.tabType},on:{click:function(e){n.tabType=!0}}},[n._v("图文详情")]),n._v(" "),t("div",{class:{"tab-btn":!0,active:!n.tabType},on:{click:function(e){n.tabType=!1}}},[n._v("购买须知")])]),n._v(" "),n.tabType?t("div",{staticClass:"detail"},[t("div",{staticClass:"detail-content",domProps:{innerHTML:n._s(n.groupDetail.desc.detail)}})]):n._e(),n._v(" "),n.tabType?n._e():t("div",{staticClass:"qa-block"},[t("div",{staticClass:"qa-content qaDetail",domProps:{innerHTML:n._s(n.groupDetail.desc.qa)}})])]),n._v(" "),t("mt-popup",{model:{value:n.popupVisible,callback:function(e){n.popupVisible=e},expression:"popupVisible"}},[t("div",{staticClass:"pop-block"},[n.popType?t("img",{attrs:{src:n.qrCode}}):n._e(),n._v(" "),n.popType?n._e():t("img",{attrs:{src:n.groupDetail.desc.customer_service[0].url}}),n._v(" "),t("div",[n.popType?t("span",{domProps:{innerHTML:n._s(n.popcontentW)}}):n._e(),n._v(" "),n.popType?n._e():t("span",{domProps:{innerHTML:n._s(n.popcontentT)}})]),n._v(" "),t("img",{staticClass:"close",attrs:{src:n.closeUrl},on:{click:function(e){n.popupVisible=!1}}})])]),n._v(" "),t("mt-popup",{attrs:{closeOnClickModal:!1},model:{value:n.popFill,callback:function(e){n.popFill=e},expression:"popFill"}},[t("div",{staticClass:"pop-fill"},[n._v("\n      您好，本次拼团已经结束。您可以选择重新开团或单独购买\n      "),t("div",{staticClass:"btn-block"},[t("div",{staticClass:"btn",on:{click:function(e){n.rePlay()}}},[n._v("重新开团")])])])]),n._v(" "),t("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?t("div",{staticClass:"ref-content",style:{backgroundImage:"url("+n.refBg+")"}},[t("div",{staticClass:"tips"},[n._v("\n        长按保存图片\n      ")])]):n._e(),n._v(" "),n.groupDetail.share_desc.refImg&&n.groupDetail.share_desc.refImg.length>0?t("div",{ref:"imageWrapper",staticClass:"img-cvs",attrs:{id:"capture"}},[t("img",{attrs:{src:n.groupDetail.share_desc.refImg[0].url}}),n._v(" "),t("div",{staticClass:"qrcode",attrs:{id:"qrcode"}})]):n._e(),n._v(" "),t("img",{staticClass:"cvs-img",attrs:{src:n.dataURL}})]),n._v(" "),1===n.groupDetail.status&&n.invite_code_f?t("div",[n.groupDetail.goods_type&&2===n.groupDetail.goods_type?t("footer",[t("div",{staticClass:"btn",on:{click:function(e){n.showTeacher()}}},[t("img",{attrs:{src:n.weChatIcon}})]),n._v(" "),t("div",{staticClass:"btn big",attrs:{id:n.groupId?"reGroup":"singleBuy"},on:{click:function(e){n.groupPay(0)}}},[n.groupId?n._e():t("span",[n._v("￥"+n._s(n.groupDetail.original_price/100))]),n._v(" "),n.groupId?n._e():t("div",[n._v("单独购")]),n._v(" "),n.groupId?t("span",[n._v("￥"+n._s(n.groupDetail.current_price/100))]):n._e(),n._v(" "),n.groupId?t("div",[n._v("重新开团")]):n._e()]),n._v(" "),n.groupData&&0!==n.groupData.status?n._e():t("div",{staticClass:"btn big price",attrs:{id:n.groupId?"joinGroup":"newGroup"},on:{click:function(e){n.groupPay(1)}}},[t("span",[n._v("￥"+n._s(n.groupDetail.current_price/100))]),n._v(" "),n.groupId?n._e():t("div",[n._v(n._s(n.groupDetail.desc.group_number)+"人团")]),n._v(" "),n.groupId?t("div",[n._v("立即参团")]):n._e()]),n._v(" "),n.groupData&&0!==n.groupData.status?t("div",{staticClass:"btn big price full"},[n.groupId?t("div",[n._v("该团已满")]):n._e()]):n._e()]):n._e(),n._v(" "),n.groupDetail.goods_type&&2!==n.groupDetail.goods_type?t("footer",[t("div",{staticClass:"btn",on:{click:function(e){n.showTeacher()}}},[t("img",{attrs:{src:n.weChatIcon}})]),n._v(" "),t("div",{staticClass:"btn big price",on:{click:function(e){n.groupPay(1)}}},[t("span",[n._v("￥"+n._s(n.groupDetail.current_price/100))]),n._v(" "),t("div",[n._v("立即购买")])])]):n._e()]):n._e(),n._v(" "),1!==n.groupDetail.status?t("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=t("VU/8")(b,_,!1,function(n){D||(t("9Nk9"),t("rC6I"))},"data-v-ff30e8ae",null);y.options.__file="src/components/buy/index.vue";e.default=y.exports},rC6I:function(n,e,t){var i=t("5W4P");"string"==typeof i&&(i=[[n.i,i,""]]),i.locals&&(n.exports=i.locals);t("rjj0")("dc25c13e",i,!1,{})},yEDY:function(n,e,t){(n.exports=t("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:";AAkcA;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>\n  <div class="group-index" ref="index" v-if="groupDetail">\n    <swiper :options="swiperOption" class="banner" ref="mySwiper">\n      <swiper-slide v-if="groupDetail.goods_desc" v-for="(data,index) in groupDetail.goods_desc.img" :key="index">\n        <img :src="data.url"/>\n      </swiper-slide>\n      <div class="swiper-pagination" slot="pagination"></div>\n    </swiper>\n    <img :src="refIcon" class="ref-icon shake" @click="goToActivity()" v-if="groupDetail.is_auth_user === 1">\n    <div class="head">\n      <div class="title">\n        {{groupDetail.name}}\n      </div>\n      <span class="detail">\n                {{groupDetail.goods_desc.desc}}\n            </span>\n      <div class="price">\n        <span class="price-content">￥{{groupDetail.current_price/100}}元</span>\n      </div>\n\n    </div>\n    <div class="head-icon">\n      <img class="icon" v-for="(data,index) in groupDetail.header_url" v-if="index<5" :src="data" :key="data">\n      <img class="more" :src="moreUrl"/>\n      <span class="has">已售{{groupDetail.has_group_num}}件</span>\n    </div>\n    <div class="welfare" v-if="groupDetail.head_welfare && groupDetail.head_welfare !== \'\' && groupDetail.head_welfare !== null">\n      团长福利：{{groupDetail.head_welfare}}\n    </div>\n    <div class="main-detail">\n      <div class="tab-content">\n        <div :class="{\'tab-btn\':true,active:tabType}" @click="tabType=true">图文详情</div>\n        <div :class="{\'tab-btn\':true,active:!tabType}" @click="tabType=false">购买须知</div>\n      </div>\n      <div v-if="tabType" class="detail">\n        <div v-html="groupDetail.desc.detail" class="detail-content"></div>\n      </div>\n      <div v-if="!tabType" class="qa-block">\n        <div class="qa-content qaDetail" v-html="groupDetail.desc.qa">\n        </div>\n      </div>\n    </div>\n    <mt-popup v-model="popupVisible">\n      <div class="pop-block">\n        <img v-if="popType" :src="qrCode"/>\n        <img v-if="!popType" :src="groupDetail.desc.customer_service[0].url"/>\n        <div>\n          <span v-if="popType" v-html="popcontentW"></span>\n          <span v-if="!popType" v-html="popcontentT"></span>\n        </div>\n        <img class="close" :src="closeUrl" @click="popupVisible = false">\n      </div>\n    </mt-popup>\n    <mt-popup v-model="popFill" :closeOnClickModal="false">\n      <div class="pop-fill">\n        您好，本次拼团已经结束。您可以选择重新开团或单独购买\n        <div class="btn-block">\n          <div class="btn" @click="rePlay()">重新开团</div>\n        </div>\n      </div>\n    </mt-popup>\n    <mt-popup v-model="refVisible" style="background-color: transparent;margin-top: -80vw;margin-left: -40vw;transform: none">\n      <div :style="{backgroundImage:`url(${refBg})`}" class="ref-content"\n           v-if="groupDetail.share_desc.refImg && groupDetail.share_desc.refImg.length > 0">\n        <div class="tips">\n          长按保存图片\n        </div>\n      </div>\n      <div class="img-cvs" id="capture" ref="imageWrapper" v-if="groupDetail.share_desc.refImg && groupDetail.share_desc.refImg.length > 0">\n        <img :src="groupDetail.share_desc.refImg[0].url">\n        <div id="qrcode" class="qrcode">\n        </div>\n      </div>\n      <img :src="dataURL" class="cvs-img"/>\n    </mt-popup>\n    <div v-if="groupDetail.status === 1 && invite_code_f">\n    <footer v-if="groupDetail.goods_type && groupDetail.goods_type === 2">\n      <div class="btn" @click="showTeacher()">\n        <img :src="weChatIcon"/>\n      </div>\n      <div class="btn big" @click="groupPay(0)" :id="groupId ? \'reGroup\':\'singleBuy\'">\n        <span v-if="!groupId">￥{{groupDetail.original_price/100}}</span>\n        <div v-if="!groupId">单独购</div>\n        <span v-if="groupId">￥{{groupDetail.current_price/100}}</span>\n        <div v-if="groupId">重新开团</div>\n      </div>\n      <div class="btn big price" @click="groupPay(1)" :id="groupId ? \'joinGroup\':\'newGroup\'" v-if="!groupData || groupData.status === 0">\n        <span>￥{{groupDetail.current_price/100}}</span>\n        <div v-if="!groupId">{{groupDetail.desc.group_number}}人团</div>\n        <div v-if="groupId">立即参团</div>\n      </div>\n      <div class="btn big price full" v-if="groupData && groupData.status !== 0">\n        <div v-if="groupId">该团已满</div>\n      </div>\n    </footer>\n    <footer v-if="groupDetail.goods_type && groupDetail.goods_type !== 2">\n      <div class="btn" @click="showTeacher()">\n        <img :src="weChatIcon"/>\n      </div>\n      <div class="btn big price" @click="groupPay(1)">\n        <span>￥{{groupDetail.current_price/100}}</span>\n        <div>立即购买</div>\n      </div>\n    </footer>\n    </div>\n    <div v-if="groupDetail.status !== 1">\n      <footer>\n        <div style="color: #888">\n          已售罄\n        </div>\n      </footer>\n    </div>\n  </div>\n</template>\n\n<script>\n  import \'swiper/dist/css/swiper.css\'\n  import { swiper, swiperSlide } from \'vue-awesome-swiper\'\n  import  QRCode from \'qrcodejs2\'\n  import { Indicator } from \'mint-ui\';\n  import {getwechatParam,getGoodsDetailApi,getGroupDetailApi,getStatusWechatApi,getUserDetailApi} from "../../service/api";\n  import refBg from \'../../assets/refBg.png\'\n  import moreUrl from \'../../assets/moreIcon.png\'\n  import refIcon from \'../../assets/refIcon.png\'\n  import weChatIcon from \'../../assets/wechatIcon.png\'\n  import weChatQrUrl from \'../../assets/weChatCode.png\'\n  import closeUrl from \'../../assets/closemy.png\'\n  import html2canvas from \'html2canvas\'\n  export default {\n    name: "index",\n    components: {\n      swiper,\n      swiperSlide,\n    },\n    data(){\n      return {\n        refBg:refBg,\n        join:false,\n        popType:false,\n        popFill:false,\n        popupVisible:false,\n        refVisible:false,\n        tabType:true,\n        popcontentW:`您已经购买过课程，无需重复<br>购买，您可以添加微信公众号了解更多`,\n        popcontentT:`为了更好地为您进行课程服务，<br>请扫码添加老师二维码`,\n        qrCode:weChatQrUrl,\n        weChatIcon:weChatIcon,\n        closeUrl:closeUrl,\n        moreUrl:moreUrl,\n        refIcon:\'https://cdn.singsingenglish.com/new-sing/b7f43ced8f8268655c2c5b289360df990ec8f18e.png\',\n        swiperOption: {\n          pagination: {\n            el: \'.swiper-pagination\'\n          }\n        },\n        QRCodeB:false,\n        dataURL:null,\n        user_id:null,\n        invite_code_f:true,\n        invite_code:\'\',\n        shopId:\'\',\n        groupId:null,\n        groupDetail:false,\n        groupData:null,\n      }\n    },\n    mounted(){\n      this.getDetail();\n    },\n    methods:{\n      goToActivity(){\n        let query = {}\n        if(window.location.href.indexOf(\'shopId\')>-1){\n          query.shopId = this.$route.query.shopId;\n        }\n        if(window.location.href.indexOf(\'groupId\')>-1){\n          query.groupId = this.$route.query.groupId;\n        }\n        if(window.location.href.indexOf(\'invite_code\')> -1) {\n          query.invite_code = this.$route.query.invite_code;\n        }\n        this.$router.push({name:\'activity\',query:query})\n      },\n      refshow(){\n        Indicator.open();\n        if(document.body.scrollTop < 10){\n          document.body.scrollTop = 20;\n          document.documentElement.scrollTop = 20;\n        }\n        if(localStorage.getItem(\'cc_token\') && localStorage.getItem(\'cc_token\') !== \'\'){\n          setTimeout(()=>{\n            Indicator.close();\n            if(!this.invite_code){\n              this.invite_code = \'CC-USER\'\n            }\n              let invite_code = this.invite_code.split(\'-\');\n              if(invite_code.length > 2 && invite_code[1] === \'TEACHER\'){\n                invite_code[1] = \'USER\'\n              }\n              let code = `${invite_code[0]}-${invite_code[1]}`;\n              let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${code}-${this.user_id}`;\n              if(this.groupId && this.groupId !== \'null\'){\n                URL += `&groupId=${this.groupId}`\n              }\n              this.qrcode(URL);\n              this.refVisible = true;\n              this.$nextTick(()=>{\n                if(!this.dataURL){\n                  setTimeout(()=>{\n                    let {\n                      height,\n                      width\n                    } = document.getElementById(\'capture\').getClientRects()[0]\n                    document.getElementById(\'capture\').style.width = width + \'px\';\n                    let o = this.getOffsetRect(this.$refs.imageWrapper);\n                    let {\n                      height1,\n                      width1\n                    } = document.getElementById(\'capture\').getClientRects()[0];\n                    html2canvas(document.getElementById(\'capture\'),{\n                      async: true,\n                      timeout: 500,\n                      scrollX:1,\n                      scale: 3,\n                      width: width1,\n                      height: height1,\n                      letterRendering: true,\n                    }).then((canvas) => {\n                      let dataURL = canvas.toDataURL("image/jpg");\n                      this.dataURL = dataURL;\n                    }).catch(res=>{alert(res);console.log()});\n                  },500)\n                }else{\n\n                }\n              })\n          },500)\n\n        }else{\n          let query = {retUrl:this.$route.fullPath,is_new_user_url:\'1\'};\n          this.$router.push({name:\'author\',query:query})\n        }\n      },\n      getOffsetRect(ele){\n        var box=ele.getBoundingClientRect();\n        var body=document.body,\n          docElem=document.documentElement;\n        //获取页面的scrollTop,scrollLeft(兼容性写法)\n        var scrollTop=window.pageYOffset||docElem.scrollTop||body.scrollTop,\n          scrollLeft=window.pageXOffset||docElem.scrollLeft||body.scrollLeft;\n        var clientTop=docElem.clientTop||body.clientTop,\n          clientLeft=docElem.clientLeft||body.clientLeft;\n        var top=box.top+scrollTop-clientTop,\n          left=box.left+scrollLeft-clientLeft;\n        return {\n          //Math.round 兼容火狐浏览器bug\n          top:Math.round(top),\n          left:Math.round(left)\n        }\n      },\n      qrcode(data){\n        if(this.QRCodeB){\n          this.QRCodeB.makeCode(data)\n        }else{\n          this.QRCodeB = new QRCode(\'qrcode\', {\n            width: 80,\n            height: 80, // 高度\n            text: data, // 二维码内容\n            image: \'\'\n          });\n        }\n\n      },\n      // 分享\n      enableShare: function(option) {\n        let that = this;\n        getwechatParam({\n          api_list:   \'onMenuShareAppMessage,onMenuShareTimeline\',\n          url:window.location.href.split(\'#\')[0]\n        }).then(wechatRes => {\n          wx.config({\n            debug: false,\n            appId: wechatRes.appId,\n            timestamp: parseInt(wechatRes.timestamp),\n            nonceStr: wechatRes.nonceStr,\n            signature: wechatRes.signature,\n            jsApiList: wechatRes.jsApiList\n          });\n          wx.ready(function() {\n            wx.onMenuShareTimeline({\n              title: option.product_title, // 分享标题\n              desc: option.desc,// 分享描述\n              link: option.shareUrl, // 分享链接\n              imgUrl: option.shareIcon || \'https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png\', // 分享图标\n              success: function() {\n                console.log(\'分享成功\');\n              },\n              cancel: function() {\n                // alert("失败")\n                console.log(\'分享失败\')\n              }\n            });\n            wx.onMenuShareAppMessage({\n              title: option.product_title, // 分享标题\n              desc: option.desc,// 分享描述\n              link: option.shareUrl, // 分享链接\n              imgUrl: option.shareIcon || \'https://cdn.singsingenglish.com/singsing/recommend/logo-refer.png\', // 分享图标\n              success: function() {\n              },\n              cancel: function() {\n              }\n            });\n          })\n        })\n      },\n      // 处理invite_code\n      handleInviteCode(){\n        if(!this.invite_code){\n          this.invite_code = \'CC-USER-\'+this.user_id;\n        }else{\n          let invite_code = this.invite_code.split(\'-\');\n          if(invite_code.length > 2 && invite_code[1] === \'TEACHER\'){\n            invite_code[1] = \'USER\'\n          }\n          let code = `${invite_code[0]}-${invite_code[1]}`;\n          this.invite_code = `${code}-${this.user_id}`;\n        }\n      },\n      onShare: function(type) {\n\n            this.handleInviteCode();\n        let URL = `${process.env.BUY_URL}shopId=${this.shopId}&invite_code=${this.invite_code}`\n        this.enableShare({\n          product_title: this.groupDetail.share_desc.title,\n          desc: this.groupDetail.share_desc.content,\n          shareIcon:this.groupDetail.share_desc.img[0].url,\n          shareUrl:URL\n        })\n      },\n      toDataURLBase64 (src, callback) {\n        let xhttp = new XMLHttpRequest();\n        xhttp.onload = function () {\n          let fileReader = new FileReader();\n          fileReader.onloadend = function () {\n            callback(fileReader.result)\n          };\n          fileReader.readAsDataURL(xhttp.response)\n        };\n        xhttp.responseType = \'blob\';\n        xhttp.open(\'GET\', src, true);\n        xhttp.send()\n      },\n      // 初始化\n      getDetail(){\n        if(window.location.href.indexOf(\'invite_code\')> -1){\n          this.invite_code = this.$route.query.invite_code;\n          let l = this.invite_code.split(\'-\').length;\n          if(l === 2 ){\n            this.invite_code_f = false\n          }\n        }\n        getUserDetailApi().then(res=>{\n            this.user_id=res.user_id;\n        if(window.location.href.indexOf(\'shopId\')>-1){\n          this.shopId = this.$route.query.shopId;\n          getGoodsDetailApi(this.shopId).then(res=>{\n            res.desc = JSON.parse(res.desc);\n            res.goods_desc = JSON.parse(res.goods_desc);\n            res.share_desc = JSON.parse(res.share_desc);\n            //商品下架跳转绑定商品\n            if(res.status === 2 && res.bind_goods_id){\n              this.$router.push({name:\'buyDetail\',query:{shopId:res.bind_goods_id}});\n              this.getDetail();\n              return\n            }\n            this.groupDetail = res;\n            for (let i = 0;i<this.groupDetail.header_url.length;i++){\n              this.groupDetail.header_url[i]=this.groupDetail.header_url[i].replace(\'http://\',\'https://\')\n            }\n            this.groupDetail.desc.detail = this.groupDetail.desc.detail.replace(/http:\\/\\//g,\'https://\');\n            this.groupDetail.desc.qa = this.groupDetail.desc.qa.replace(/http:\\/\\//g,\'https://\');\n            if(this.groupDetail.share_desc.refImg && this.groupDetail.share_desc.refImg.length === 1){\n              this.groupDetail.share_desc.refImg[0].url = this.groupDetail.share_desc.refImg[0].url.replace(\'http://\',\'https://\');\n              let _this = this;\n              this.toDataURLBase64(this.groupDetail.share_desc.refImg[0].url, function (avatarUrl) {\n                _this.groupDetail.share_desc.refImg[0].url = avatarUrl;\n              });\n            }\n\n            if(this.groupDetail.goods_type === 2){\n              if(localStorage.getItem(\'cc_token\')){\n                getStatusWechatApi({goods_id:this.shopId}).then(res=>{\n                  if(res.out_trade_no){\n                    if(res.buy_type === 1){\n                      this.$router.push({name:\'buySuccess\',query:{out_trade_no:res.out_trade_no}});\n                    }else{\n                      this.$router.push({name:\'success\',query:{out_trade_no:res.out_trade_no}});\n                    }\n                  }\n                });\n              }\n              if(window.location.href.indexOf(\'groupId\')>-1){\n                this.groupId = this.$route.query.groupId;\n                getGroupDetailApi(this.groupId).then(res=>{\n                  this.groupData = res\n                });\n                this.onShare(0)\n              }else{\n                this.onShare(1)\n              }\n            }else{\n              this.handleInviteCode()\n            }\n          })\n        }\n        });\n      },\n      showTeacher(){\n        this.popType = false;\n        this.popupVisible = true\n      },\n      groupPay(type){\n        let query = {shopId: this.shopId,invite_code:this.$route.query.invite_code};\n        if(this.groupId){\n          query.group_order_id = this.groupId\n        }\n        if(type === 0 && !this.groupId){\n          query.type=\'single\';\n        }else if (type === 0 && this.groupId){\n          this.$router.push({\n            name: \'buyDetail\',\n            query:{\n              shopId:this.shopId,\n              invite_code:this.$route.query.invite_code\n            }\n          });\n          window.location.reload();\n          return false\n        } else{\n          query.type=\'\'\n        }\n        this.$router.push({\n          name: \'buy\',\n          query:query\n        })\n      }\n    }\n  }\n<\/script>\n<style>\n  img,video{\n    max-width: 100%;\n  }\n  @-webkit-keyframes swing {\n    10% {\n      transform: rotate(15deg);\n    }\n    20% {\n      transform: rotate(-10deg);\n    }\n    30% {\n      transform: rotate(5deg);\n    }\n    40% {\n      transform: rotate(-5deg);\n    }\n    50%, 100% {\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</style>\n<style scoped lang="less">\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</style>\n'],sourceRoot:""}])}});
//# sourceMappingURL=9.1c8d585b8369a0756d1e.js.map