123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997 |
- <template>
- <view class="page">
- <view class="main_content2" :style="{backgroundImage:'url('+img_url+'signIn/sign_ac_bg.png)'}">
- <view class="top_bar">
- <view class="top_header">
- <view class="top_header_left" @click="goBack">
- <image :src="img_url + 'signIn/to_back.png'" mode=""></image>
- </view>
- <view class="top_header_cen">签到中心</view>
- <view class="top_white_space"></view>
- </view>
- </view>
- <view class="mid_banner">
- <view class="banner_tip">
- <view class="s_sign_tip" @tap="isHideMask = false;signRule=true">
- <image :src="img_url+'signIn/help_icon.png'" mode=""></image>
- <text>活动规则</text>
- </view>
- </view>
- <view class="banner_b_title">
- <text>每日签到领积分</text>
- </view>
- <view class="banner_s_title">
- <image :src="img_url+'signIn/ban_oral_left.png'" mode=""></image>
- <text>连续累计签到 独享好礼翻倍</text>
- <image :src="img_url+'signIn/ban_oral_right.png'" mode=""></image>
- </view>
- <view class="banner_time" v-if="JSON.stringify(signInfo)!='{}'">
- <view class="banner_time_tip">{{acState==0?'距离活动开始还有':(acState==1?'距离活动结束还有':'活动已结束')}}</view>
- <view class="banner_time_count">
- <block v-if="countDown.day!=0">{{countDown.day}}天</block>
- {{countDown.hour}}
- <text>小时</text>
- {{countDown.minute}}
- <text>分</text>
- {{countDown.second}}
- <text>秒</text>
- </view>
- </view>
- </view>
- <view class="sign_ac_con">
- <block v-if="JSON.stringify(signInfo)!='{}'">
- <view class="ac_con_top">
- <view class="cur_int">目前积分<text>{{my_points}}</text></view>
- <view class="cur_int_tip" v-show="signInfo.continueNum>0">连续签到{{signInfo.continueNum}}天可领取好礼</view>
- </view>
- <view class="ac_con_bottom">
- <view class="sign_ac_day">
- <block v-if="signInfo.memberSignInfoList&&signInfo.memberSignInfoList.length<=8">
- <view class="sign_ac_day_line1">
- <view class="day_bonus_img" v-for="(item,index) in signInfo.memberSignInfoList.slice(0,4)" :key="index">
- <image :src="img_url+'signIn/sign_bonus.png'" mode="" :class="{opa_class:item.signRecordState!=2}"></image>
- <text>第{{index+1}}天</text>
- </view>
- </view>
- <view class="sign_ac_day_line1">
- <view class="day_bonus_img" v-for="(item,index) in signInfo.memberSignInfoList.slice(4)" :key="index">
- <image :src="img_url+'signIn/sign_bonus.png'" mode="" :class="{opa_class:item.signRecordState!=2}"></image>
- <text>第{{index+5}}天</text>
- </view>
- </view>
- </block>
- <block v-else>
- <swiper class="swiper-box" :current="current" indicator-dots="true" indicator-color="#ffa527" indicator-active-color="#FF6F1A">
- <swiper-item class="swiper-item" v-for="(item,idxA) in signMutipleDay" :key="idxA">
- <view class="sign_ac_day_line1">
- <view class="day_bonus_img" v-for="(subItem,idxB) in item.slice(0,4)" :key="idxB">
- <image :src="img_url+'signIn/sign_bonus.png'" mode="" :class="{opa_class:subItem.signRecordState!=2}"></image>
- <text>第{{idxB+idxA*8+1}}天</text>
- </view>
- </view>
-
- <view class="sign_ac_day_line1">
- <view class="day_bonus_img" v-for="(subItem,idxC) in item.slice(4)" :key="idxC">
- <image :src="img_url+'signIn/sign_bonus.png'" mode="" :class="{opa_class:subItem.signRecordState!=2}"></image>
- <text>第{{idxC+idxA*8+5}}天</text>
- </view>
- </view>
- </swiper-item>
- </swiper>
- </block>
- </view>
- <view class="sign_ac_but sign_on" v-if="acState==1&&signInfo.isSign==1" @tap="goSign">立即签到</view>
- <view class="sign_ac_but sign_al" v-if="acState==1&&signInfo.isSign==2">今日已签到 {{signInfo.integralPerSign>0?'积分+'+signInfo.integralPerSign:''}}</text></view>
- <view class="sign_ac_but sign_off" v-if="acState==0">活动未开始</view>
- <view class="sign_ac_but sign_off" v-if="acState==2">活动已结束</view>
- <view class="sign_fini">
- <block v-if="signInfo.continueNum>0">
- <text v-if="signCountTotal>5">您已连续签到{{signCountTotal}}天,<block v-if="signInfo.integralPerSign>0">累计积分{{signCountTotal*signInfo.integralPerSign}}</block></text>
- <text v-if="signCountTotal==signInfo.continueNum">您已连续签到{{signCountTotal}}天, <block v-show="signInfo.bonusIntegral>0">获得积分奖励{{signInfo.bonusIntegral}}</block> <block v-if="signInfo.bonusVoucher>0">,优惠券:{{signInfo.bonusVoucherName}}</block></text>
- </block>
- </view>
- </view>
-
- </block>
- <block v-if="JSON.stringify(signInfo)=='{}'&&!firstLoading">
- <view class="signAc_off">签到活动已关闭</view>
- <view class="signAc_off_but" @click="goBack()">返回</view>
- </block>
- </view>
- <view class="sign_ac_bottom" :style="{backgroundImage:'url('+img_url+'signIn/sign_ac_bottom.png)'}" v-if="JSON.stringify(signInfo.share)!='{}'">
- <view class="share_con">
- <view class="share_con_top">
- <text>分享至好友</text>
- <view class="share_but" @click="goShare">
- 分享
- <image :src="img_url+'signIn/share_but.png'" mode=""></image>
- </view>
- </view>
- <text>分享至好友,共同参与签到领积分活动</text>
- </view>
- </view>
-
- <view class="popMask" :hidden="isHideMask" @tap="hideMask">
- <view class="sign_rule" @click.stop="()=>{}" v-if="signRule">
- <view class="sign_rule_title">签到领积分规则</view>
- <view class="sign_rule_one">
- <image :src="img_url+'signIn/sign_rule1.png'" mode=""></image>
- <text>每日签到获得积分奖励</text>
- </view>
- <view class="sign_rule_one_text">
- <text>{{signInfo.bonusRules}}</text>
- </view>
- <view class="sign_rule_one">
- <image :src="img_url+'signIn/sign_rule2.png'" mode=""></image>
- <text>分享活动</text>
- </view>
- <view class="sign_rule_one_text">
- <text>
- 1.签到活动未开始前即可分享至好友;
- </text>
- </view>
- <view class="sign_but_rule" @click.stop="hideMask">知道了~</view>
- </view>
-
- </view>
-
- <!-- 分享弹框 start -->
- <view class="share_model" v-if="share_model" @touchmove.stop.prevent="moveHandle">
- <view class="share_model_list">
- <!-- #ifdef H5 -->
- <view class="share_model_pre" @tap.stop="sldShareBrower" v-if="isWeiXinBrower">
- <image :src="img_url+'goods_detail/wx_share.png'" mode=""></image>
- <text>{{$L('微信好友')}}</text>
- </view>
- <!-- #endif -->
- <!-- #ifdef MP-WEIXIN -->
- <button open-type="share" class="share_model_pre">
- <image :src="img_url+'goods_detail/wx_share.png'" mode=""></image>
- <text>{{$L('微信好友')}}</text>
- </button>
- <!-- #endif -->
- <!-- #ifdef APP-PLUS -->
- <view class="share_model_pre" @tap.stop="sldShare(0,'WXSceneSession')">
- <image :src="img_url+'goods_detail/wx_share.png'" mode=""></image>
- <text>{{$L('微信好友')}}</text>
- </view>
- <view class="share_model_pre" @tap.stop="sldShare(0,'WXSenceTimeline')">
- <image :src="img_url+'goods_detail/wechat_moments.png'" mode=""></image>
- <text>{{$L('微信朋友圈')}}</text>
- </view>
- <!-- #endif -->
- </view>
- <view class="share_model_close" @click="closeShareModel">
- <image :src="img_url+'goods_detail/share_close.png'" mode=""></image>
- </view>
- </view>
- <!-- 分享弹框 end -->
- <!-- 微信浏览器分享提示 start-->
- <view class="wx_brower_share_mask" v-if="showWeiXinBrowerTip">
- <view class="wx_brower_share_top_wrap">
- <image :src="img_url+'wx_share_tip.png'" mode="widthFix" @tap="closeShareModel" class="wx_brower_share_img"></image>
- </view>
- </view>
- <!-- 微信浏览器分享提示 end-->
- </view>
- </view>
- </template>
- <script>
- import uniSwiperDot from "@/components/uni-swiper-dot/uni-swiper-dot.vue";
- export default{
- data(){
- return{
- img_url:getApp().globalData.imgUrl,
- bigDay:'00',
- month:'00',
- year:'0000',
- signInfo:{},
- my_points:0,
- acState:'',
- countDown:{
- day:0,
- hour:0,
- minute:0,
- second:0
- },
- secInterval:'',
- isHideMask:true,
- signCountTotal:0,
- signMutipleDay:[],
- current:0,
- isWeiXinBrower:false,
- share_model:false,
- showWeiXinBrowerTip:false,
- isReachContiBonus:false,
- signRule:false,
- firstLoading:true
- }
- },
- created() {
- this.initData()
- // #ifdef H5
- this.isWeiXinBrower = this.$isWeiXinBrower();
- // #endif
- },
- components:{
- uniSwiperDot,
- },
- methods:{
-
- initData(){
- uni.showLoading({})
- this.getInfo()
- this.getUserPoints()
- },
- goBack(){
- const prePage = getCurrentPages()[getCurrentPages().length-2]
- if(prePage.route == 'pages/index/index'){
- uni.switchTab({
- url:'/pages/index/index'
- })
- }else{
- uni.switchTab({
- url:'/pages/user/user'
- })
- }
-
- },
- //获取签到信息
- getInfo(){
- this.firstLoading = true
- let params = {
- url:'/v3/promotion/front/sign/activity/detail'
- }
- this.$request(params).then(res=>{
- if(res.state==200){
- this.firstLoading = false
- this.signInfo = res.data
- uni.hideLoading()
- this.countDay()
- this.openTime()
- }else if(res.state==255){
- this.$api.msg(res.msg)
- }
- })
- },
- //获取用户积分
- getUserPoints(){
- let param = {}
- param.url = 'v3/member/front/integralLog/getMemberIntegral'
- param.method = 'GET'
- this.$request(param).then(res=>{
- if(res.state == 200){
- this.my_points = res.data.memberIntegral
-
- }
- })
- },
- //处理距离活动开始时间|距离活动结束时间
- openTime(){
- let now= new Date()
- let start = new Date(this.signInfo.startTime.replace(/-/g, '/'))
- let end = new Date(this.signInfo.endTime.replace(/-/g, '/'))
- if(now<start){
- this.acState = 0
- }else if(now>start&&now<end){
- this.acState = 1
- let diffTime = (end.getTime() - now.getTime())/1000
- this.secInterval = setInterval(()=>{
- if(diffTime == 0){
- //倒计时结束,清除倒计时
- this.getInfo()
- clearInterval(this.secInterval);
- }else{
- diffTime--;
- let day = parseInt(diffTime / 60 / 60 / 24);
- let hours = parseInt(diffTime / 60 / 60 % 24);
- let minutes = parseInt(diffTime / 60 % 60);
- let seconds = parseInt(diffTime % 60);
- this.countDown.day = day
- this.countDown.hour = hours
- this.countDown.minute = minutes
- this.countDown.second = seconds
- }
- },1000)
- }else if(now>end){
- this.acState = 2
- }
- },
- //处理签到天数
- countDay(){
- let {continueNum,integralPerSign,memberSignInfoList} = this.signInfo
- let now = new Date()
- let nowIdx = 0
- let contiSignCount = 0
-
- //在数组中找到当天的下标
- this.signContiDay = new Array(this.signInfo.memberSignInfoList.length).fill({day:0,isSignIn:0})
- this.signInfo.memberSignInfoList.some((i,index)=>{
- let day = new Date(i.date.replace(/-/g, '/'))
- if(day.getFullYear()==now.getFullYear()&&day.getMonth()==now.getMonth()&&day.getDate()==now.getDate()){
- nowIdx = index
- return false
- }
- })
-
-
-
- //如果有连续签到奖励,则计算当天之前连续签到几天
- if(continueNum>0){
- for(let i = nowIdx;i>=0;i--){
- if(this.signInfo.memberSignInfoList[i].signRecordState==2){
- contiSignCount++
- continue
- }else{
- break
- }
- }
- //如果连续签到达到要求的天数则--
- if(contiSignCount==continueNum){
- this.isReachContiBonus = true
- }else if(contiSignCount>continueNum){ //如果已经完成连续签到,下一次签到重新开始算
- contiSignCount = contiSignCount - continueNum
- this.isReachContiBonus = false
- }
- this.signCountTotal = contiSignCount
- }
-
-
-
- // 如果活动天数大于8天,则另外处理(大于8天,则需要用swiper滑动展示)
- if(memberSignInfoList.length>8){
- this.current = nowIdx<8?0:(nowIdx+1)/8 //根据现在时间决定swiper的current
- console.log(this.current,'llll',nowIdx)
- this.formatMutipleDay()
- }
- },
-
- // 如果活动天数大于8天,则另外处理(大于8天,则需要用swiper滑动展示)
- formatMutipleDay(){
- let {memberSignInfoList} = this.signInfo
- let splt = 8
- let multiArr = []
- let init = 0
- let count = Math.ceil(memberSignInfoList.length/splt)
- for(let i = 0;i<count;i++){
- multiArr.push(memberSignInfoList.slice(init,init+splt))
- init+=splt
- }
- this.signMutipleDay = multiArr
- },
-
- hideMask(){
- this.isHideMask = true
- },
- //去签到
- goSign(){
- let source = 0
- // #ifdef APP-PLUS
- if(uni.getSystemInfoSync().platform==='ios'){
- source = 4
- }else if(uni.getSystemInfoSync().platform==='android'){
- source = 3
- }
- // #endif
-
- //#ifdef H5
- source = 2
- //#endif
-
- //#ifdef MP-WEIXIN
- source = 5
- //#endif
-
- let param = {
- url:'v3/promotion/front/sign/activity/doSign',
- method:'POST',
- data:{
- source,
- signActivityId:this.signInfo.signActivityId
- }
- }
-
- this.$request(param).then(res=>{
- if(res.state==200){
- uni.showToast({
- title:res.msg,
- icon:'none'
- })
- this.getInfo()
- this.getUserPoints()
- }else{
- uni.showToast({
- title:'签到活动已结束',
- icon:'none'
- })
- this.getInfo()
- }
- })
- },
- goShare(){
-
-
- // #ifdef H5
- if(this.isWeiXinBrower){
- this.share_model = true
- }else{
- this.showWeiXinBrowerTip = true
- }
- // #endif
-
- // #ifdef MP-WEIXIN || APP-PLUS
- this.share_model = true
- // #endif
-
-
- },
-
- sldShareBrower() {
- this.showWeiXinBrowerTip = true;
- this.share_model = false;
- },
- sldShare: function(type, scene) {
- let shareData = {};
- if (type == 0) {
- shareData.href = getApp().globalData.apiUrl + '/standard/signIn/signIn';
- shareData.title = this.signInfo.shareTitle;
- shareData.summary = this.signInfo.shareDesc;
- shareData.imageUrl =this.signInfo.shareImgUrl;
- } else if (type == 2) {
- shareData.imageUrl = '';
- }
- this.$weiXinAppShare(type, scene, shareData);
- this.closeShareModel(); //关闭分享
- },
- closeShareModel() {
- this.share_model = false;
- this.showWeiXinBrowerTip = false;
- this.poster = false;
- },
- }
- }
- </script>
- <style lang="scss">
- page{
-
- }
-
-
- .main_content2{
- width: 750rpx;
- margin: 0 auto;
- background-repeat: no-repeat;
- background-position: center center;
- background-size: 100% 100%;
- position: relative;
- height: 100vh;
- .top_bar {
- width: 750rpx;
- // height: 178rpx;
- padding-top: 42rpx;
- /* #ifdef APP-PLUS||MP-WEIXIN */
- padding-top: calc(var(--status-bar-height) + 42rpx);
- /* #endif */
- padding-right: 20rpx;
- width: 750rpx;
- z-index: 50;
-
- .top_header {
- display: flex;
- align-items: center;
- justify-content: space-between;
-
- .top_header_left {
- padding-left: 20rpx;
-
- image {
- width: 17rpx;
- height: 29rpx;
- }
- }
-
- .top_header_cen {
- margin: 0 50rpx;
- font-size: 36rpx;
- font-family: PingFang SC;
- color: #FFFFFF;
- }
-
- .top_white_space {
- width: 30rpx;
- height: 29rpx;
- padding-right: 20rpx;
- }
- }
-
- .top_category {
- margin-top: 40rpx;
-
- .cate_wrap {
- display: -webkit-box;
- align-items: center;
- overflow-x: scroll;
-
- .category_item {
- color: #FFFFFF;
- padding: 0 20rpx;
- margin-left: 20rpx;
- height: 54rpx;
-
- &.boWhite {
- border-bottom: 4rpx solid #fff;
- }
- }
- }
- }
- }
- .mid_banner{
- padding: 24rpx;
- .banner_tip{
- margin-top: 20rpx;
- width: 100%;
- position: relative;
- height: 69rpx;
- .s_sign_tip{
- position: absolute;
- top: 0;
- right: -24rpx;
- width: 189rpx;
- height: 69rpx;
- background: rgba(0,0,0,0.1);
- border-bottom-left-radius: 35rpx;
- border-top-left-radius: 35rpx;
- display: flex;
- justify-content: center;
- align-items: center;
- text{
- font-size: 30rpx;
- font-family: PingFang;
- font-weight: bold;
- color: #fff;
- opacity: 0.9;
- }
- image{
- width:37rpx;
- height:34rpx;
- margin-right: 10rpx;
- }
- }
- }
- .banner_b_title{
- margin-top:26rpx;
- text-align: center;
- text{
- font-size: 98rpx;
- font-family: SourceHanSerifCN;
- font-weight: 800;
- color: #FFFFFF;
- text-shadow: #FF771E 2rpx 12rpx 2rpx;
- }
- }
- .banner_s_title{
- margin-top: 30rpx;
- display: flex;
- align-items: center;
- image{
- width:178rpx;
- height:10rpx
- }
- text{
- font-size: 26rpx;
- font-family: SourceHanSansCN;
- font-weight: 500;
- color: #FFFFFF;
- margin: 0 10rpx;
- }
- }
- .banner_time{
- margin-top: 36rpx;
- color: #fff;
- .banner_time_tip{
- font-size: 26rpx;
- font-family: PingFang;
- font-weight: bold;
- text-align: center;
- }
- .banner_time_count{
- margin-top: 10rpx;
- font-size: 44rpx;
- font-family: PingFang;
- text-align: center;
- font-weight: bold;
- text{
- font-size: 28rpx;
- }
- }
- }
- }
- .sign_ac_con{
- padding: 42rpx 24rpx 0;
- margin: 0 auto;
- width: 700rpx;
- height: 720rpx;
- background: #FFFFFF;
- box-shadow: 0px 10rpx 26rpx 0px rgba(255, 130, 25, 0.18);
- border-radius: 20rpx;
- position: relative;
- .ac_con_top{
- .cur_int{
- text-align: center;
- font-size: 36rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #2D2D2D;
- text{
- color: #FF8118;
- }
- }
- .cur_int_tip{
- margin-top: 27rpx;
- font-size: 26rpx;
- font-family: PingFang;
- font-weight: bold;
- color: #000000;
- opacity: 0.3;
- text-align: center;
- }
- }
- .ac_con_bottom{
- margin-top: 30rpx;
- height: 500rpx;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
-
- }
- .sign_ac_day{
- width: 100%;
- .sign_ac_day_line1{
- display: flex;
- flex-wrap: wrap;
- justify-content: space-around;
- margin-bottom: 20rpx;
- }
- .day_bonus_img{
- display: flex;
- flex-direction: column;
- align-items: center;
- image{
- width: 90rpx;
- height: 90rpx;
- }
- text{
- margin-top: 10rpx;
- font-size: 24rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #333333;
- }
- }
-
-
- }
-
- .sign_ac_but{
- width: 580rpx;
- height: 80rpx;
- white-space: pre-wrap;
- border-radius: 40rpx;
- text-align: center;
- line-height: 80rpx;
- font-size: 34rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #FFFFFF;
- margin: 20rpx auto 0;
- &.sign_on{
- background: #FF6F1A;
- box-shadow: 0px 6rpx 30rpx 0px rgba(170, 170, 170, 0.18);
- }
- &.sign_off{
- background: #999999;
- }
-
- &.sign_al{
- border: 1px solid #F65A0E;
- box-shadow: 0px 3px 15px 0px rgba(170, 170, 170, 0.18);
- color: #F65A0E;
- }
- }
- .sign_fini{
- margin: 20rpx;
- text-align: center;
- font-size: 24rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #FF6F1A;
- }
- .signAc_off{
- position: relative;
- top: 20%;
- text-align: center;
- font-size: 60rpx;
- color: #FF6F1A;
- }
- .signAc_off_but{
- position: relative;
- top: 60%;
- width: 580rpx;
- height: 80rpx;
- white-space: pre-wrap;
- border-radius: 40rpx;
- text-align: center;
- line-height: 80rpx;
- font-size: 34rpx;
- background: #FF6F1A;
- margin: auto;
- color: #fff;
- }
-
- }
- .sign_ac_bottom{
- position: relative;
- width: 750rpx;
- margin-top: -100rpx;
- // bottom: -106rpx;
- height: 230rpx;
- background-repeat: no-repeat;
- background-size: 100% 100%;
- background-position: center center;
- .share_con{
- position: absolute;
- bottom: 34rpx;
- right: 42rpx;
-
- .share_con_top{
- display: flex;
- align-items: center;
- text{
- font-size: 56rpx;
- font-style: italic;
- font-weight: bold;
- color: #fff;
- text-shadow: #FF771E 4rpx 0rpx 6rpx;
- margin-right: 20rpx;
- letter-spacing:6rpx
- }
- .share_but{
- width: 130rpx;
- height: 40rpx;
- background: #FFFFFF;
- border-radius: 20rpx;
- display: flex;
- align-items: center;
- justify-content: space-evenly;
- font-size: 28rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #FF8016;
- image{
- width: 30rpx;
- height: 24rpx;
- }
- }
- }
-
- &>text{
- font-size: 24rpx;
- font-family: SourceHanSansCN;
- font-weight: 400;
- color: rgba(255, 255, 255, 0.8);
- }
- }
- }
- }
-
- .popMask{
- width: 750rpx;
- height: calc(100vh + 210rpx - 106rpx);
- margin: 0 auto;
- position: absolute;
- background: rgba(0, 0, 0, 0.4);
- top: 0;
- left: 0;
- z-index: 10;
- .sign_rule{
- width: 600rpx;
- height: 760rpx;
- background: #FFFFFF;
- box-shadow: 0px 0px 27rpx 6rpx rgba(85, 85, 85, 0.3);
- border-radius: 20rpx;
- margin: 40% auto 0;
- padding-top: 36rpx;
- padding-left: 36rpx;
- padding-right: 36rpx;
- position: relative;
- .sign_rule_title{
- text-align: center;
- font-size: 36rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #FF7C19;
- }
- .sign_rule_one{
- margin-top: 38rpx;
- display: flex;
- align-items: center;
-
- text{
- font-size: 28rpx;
- font-family: PingFang;
- font-weight: 500;
- color: #FF7C19;
- }
- image{
- margin-right: 10rpx;
- width:39rpx;
- height:35rpx;
- }
- }
- .sign_rule_one_text{
- margin-top: 21rpx;
- font-size: 24rpx;
- font-family: PingFang;
- font-weight: 400;
- color: #333333;
- line-height: 44rpx;
- word-break: break-all;
- }
- .sign_but_rule{
- width: 320rpx;
- height: 80rpx;
- background: #FF7C19;
- border-radius: 40rpx;
- line-height: 80rpx;
- text-align: center;
- color: #fff;
- // position: absolute;
- margin: 30rpx auto;
- }
- .sign_but_rule_already{
- width: 320rpx;
- height: 80rpx;
- border: 2rpx solid #FF7C19;
- color: #FF7C19;
- line-height: 80rpx;
- text-align: center;
- margin: 30rpx auto;
- border-radius: 40rpx;
- }
- }
- .sign_ac_off{
- width:600rpx;
- height:740rpx;
- }
- }
-
- .swiper-box{
- height: 330rpx;
- }
- .opa_class{
- opacity: 0.5;
- }
-
- .share_model {
- width: 750rpx;
- height: 100%;
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- margin: 0 auto;
- background: rgba(0, 0, 0, 0.6);
- z-index: 100;
- }
-
- .share_model_list {
- display: flex;
- justify-content: space-around;
- padding: 0 50rpx;
- box-sizing: border-box;
- position: fixed;
- bottom: 150rpx;
- z-index: 110;
- width: 750rpx;
-
- .share_model_pre {
- display: flex;
- flex-direction: column;
- align-items: center;
- background: transparent;
- border-radius: 0;
- height: auto;
- line-height: auto;
-
- &::after {
- border-width: 0;
- }
-
- image {
- width: 105rpx;
- height: 105rpx;
- }
-
- text {
- font-size: 24rpx;
- font-family: PingFang SC;
- font-weight: 500;
- color: #FFFFFF;
- line-height: 36rpx;
- margin-top: 30rpx;
- }
- }
- }
-
- .share_model_close {
- width: 46rpx;
- height: 46rpx;
- bottom: 60rpx;
- position: fixed;
- z-index: 110;
- left: 0;
- right: 0;
- margin: 0 auto;
-
- image {
- width: 46rpx;
- height: 46rpx;
- }
- }
- /* 微信浏览器分享提示 start */
- .wx_brower_share_mask {
- width: 750rpx;
- height: 100vh;
- background-color: rgba(0, 0, 0, 0.45);
- position: fixed;
- z-index: 99999;
- top: 0;
- }
-
- .wx_brower_share_top_wrap {
- width: 100%;
- height: 100%;
- display: flex;
- justify-content: flex-end;
- align-items: flex-start;
- margin-top: 150rpx;
- }
-
- .wx_brower_share_top_wrap .wx_brower_share_img {
- width: 450rpx;
- height: 150rpx;
- margin-right: 80rpx;
- }
-
- .share_h5 {
- width: 100% !important;
- height: 100% !important
- }
-
- uni-image>img{
- opacity: unset;
- object-fit: contain;
- }
-
- .share_h5_operate_img {
- width: 440rpx !important;
- height: 120rpx !important;
- }
-
- .share_h5_close_img {
- width: 50rpx !important;
- height: 50rpx !important;
- }
-
- .share_h5_img_bottom {
- width: 50rpx !important;
- height: 200rpx !important;
- }
-
- /* 微信浏览器分享提示 end */
- </style>
|