Merge tag '首页猜你喜欢修复' into develop

zhaojs

2023-10-07 6c7bba2e05c011a3d640b6565a113204228e92e0

 public/html/freebuy.html

@@ -16,7 +16,7 @@
    <meta content="telephone=no,email=no" name="format-detection">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
    <script type="text/javascript" src="https://public.ffquan.cn/lib/jquery-1.12.4.min.js"></script>
    <script type="text/javascript" src="https://public.ffquan.cn/lib/vue/vue@2.6.11.min.js"></script>
    <script type="text/javascript" src="https://cdn.staticfile.org/vue/2.6.11/vue.min.js"></script>
    <script type="text/javascript" src="https://public.ffquan.cn/lib/vue-lazyload.js"></script>
    <script type="text/javascript" src="https://public.ffquan.cn/lib/swiper/js/swiper.min.js"></script>
    <script type="text/javascript" src="https://public.ffquan.cn/lib/taobaoCode/taobaoCode.js?v=1.2.1"></script>
@@ -40,10 +40,7 @@
            margin: auto; max-width: 800px; font-size: .28rem; overflow: hidden; position: relative; z-index: 1;
            overflow: hidden;
        }
        #appMain:before {
            content: "";display: block;position: absolute;top: 0;left: -20%;height: 3.88rem;width: 140%;background: linear-gradient(90deg,#fbe7e2,#fbe7e2) no-repeat;background-size: 100%;
            border-radius: 0 0 50% 50%;z-index: -1;
        }
    
       
        .h3bt {
            width: 1.66rem;
@@ -55,12 +52,14 @@
        .act_header{
            z-index: 200; width: 100%; background: no-repeat top; background-size: 100% auto;
            display: flex; align-items: center; justify-content: space-between;
            position: fixed;background: linear-gradient(90deg, #fbe7e2 0%, #fbe7e2 100%) 0% 0% / 100%;
            background: linear-gradient(#FF451F, #fbe7e2);
             color: #fff;
            max-width: 800px;
        }
        .act_header .centent{
            text-align: center;
           
            padding-top: 0.6rem;
        }
        .act_header .centent img{
            width:100%;
@@ -158,7 +157,7 @@


        .list-section{
            display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: space-between;justify-content: space-between;padding: 0 1.87%;
            display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;flex-wrap: wrap;-webkit-justify-content: space-between;justify-content: space-between;padding: 0 1.87%;margin-top: 0.05rem;
        }
        .list-section .listTmp{
            width: 49%;background: #fff;border-radius: .08rem;margin-bottom: .14rem;box-sizing: border-box;
@@ -218,7 +217,7 @@
        }

        .loading{
            line-height: 1rem; text-align: center; font-size: .3rem; color: #999;
            line-height: 2rem; text-align: center; font-size: .3rem; color: #999;
        }
        .sys{
            width: 100%;
@@ -230,33 +229,119 @@
            center center no-repeat;
            background-size: 2.4rem auto;
        }

    .sort {
        background-color: #ea2424;
        border-radius: .2rem .2rem 0 0;
        }

.sort-list {
    display: flex;
    border-bottom: .02rem solid #eb3a15;
    color: #ff8f78;
    justify-content: space-between
}

.sort-list>li {
    width: 25%;
    font-size: .26rem;
    font-weight: 500;
    color: #ff8f78;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .24rem 0
}

.sort-list>li.sort-active {
    color: #fff
}

.sort-list>li span {
    position: relative;
    height: .16rem;
    margin-left: .06rem
}

.sort-list>li span i {
    position: absolute;
    width: 0;
    height: 0;
    border-color: #b92709 transparent transparent;
    border-style: solid;
    border-width: .06rem .06rem 0
}

.sort-list>li span i:first-child {
    transform: rotate(180deg)
}

.sort-list>li span i:nth-child(2) {
    bottom: 0
}

.sort-list>li span i.arrow-active {
    border-color: #f2f2f2 transparent transparent
}
.appback
{
    height: 0.5rem;
    position: absolute;
    top: 0.5rem;
    left: 0.4rem;
}
.appback-img
{
    height: 100%;
}
.box
        {
            position:absolute;
            width: 100%;
            height: 100%;
            background: url(https://yanfeiobpub.obs.cn-east-3.myhuaweicloud.com/dfg/h5loading.gif) no-repeat fixed top;
            background-size: 70px 70px;
        }
        .list{
            position: relative;
            top: 0;
            width: 100%;
        }
    </style>
</head>

<body >
<body style="background: #fbe7e2;">
    <div class="box">
        <div class="list">
    <div id="appMain" >
        <div class="appback">
            <image v-on:click="topBack()" class="appback-img" src="https://yanfeiobpub.obs.cn-east-3.myhuaweicloud.com/dfg/h5return_backIcon.png"></image>
        </div>
    <header class="act_header">
        <div></div>
        <div class="centent"><img src="https://yanfeiobpub.obs.cn-east-3.myhuaweicloud.com/dfg/xinrengoubanner.png" alt=""></div>
        <div class="share">
            <!-- <a href="">分享</a> -->
        </div>
    </header>
   
    <div :style="{ height: (twoNav && twoNav.length > 0) ? '2.3rem' : '2.3rem'}"></div>
    <div class="sort">
        <ul class="sort-list">
          <li v-for="item in fristOrderSort" v-bind:class="{'sort-active': item.number == sortNumber}"
              v-on:click="handleSort(item)">
            {{ item.name }}
          </li>
        </ul>
      </div>
    <div v-if="loading" v-else class="loading">加载中...</div>
    
    <div v-if="!loading" style="min-height: 100vh;" class=" swiper-container swiper-container-initialized swiper-container-horizontal swiper-container-free-mode swiper-container-ios">
    <div v-else style="min-height: 100vh; background: #fbe7e2;" class=" swiper-container swiper-container-initialized swiper-container-horizontal swiper-container-free-mode swiper-container-ios">
            <div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px);">
                <div class="swiper-slide list-section">
                            <div class="listTmp " v-for="(data,key) in lists" :key="key" v-on:click="targetItem(data)">
                                    <div class="productImg">
                                        <img :src="data.mainPic + '_310x310.jpg'" class="fadeIn " height="200" width="200">
                                        <img :src="data.mainPic + (plat=='tb'?'_310x310.jpg':'')" class="fadeIn " height="200" width="200">
                                    </div>
                                    <div class="productInfo">
                                        <div class="title">
                                            <div class="shoplabel ">
                                                <img src="">
                                            </div>
                                        
                                         <div class="title">
                                           
                                            <span>{{data.dtitle}}</span>
                                        </div>
                                        
@@ -285,8 +370,9 @@
            <div class="swiper-pagination"></div>
            <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
    </div>
    <div v-else class="loading">加载中...</div>

   
</div>
    </div>
</div>
</body>

@@ -294,14 +380,17 @@
<script src="https://polyfill.io/v2/polyfill.min.js?features=IntersectionObserver"></script>
<script>
    (function(){
        var size = (document.body.clientWidth || document.documentElement.clientWidth);
        var size1=document.body.clientWidth;
        var size2=document.documentElement.clientWidth;
        var size=size1<=0?size2:size1;
        size=size<=0?400:size;
        document.documentElement.style.fontSize = (size > 750 ? 750 : size) / 7.5 + 'px';
    })();

    Vue.use(VueLazyload, {
        preLoad: 1.3,//
        error: 'https://sr.ffquan.cn/cms_pic/20200622/bro7s7f6vrkd3jat4ujg0.png',
        loading: 'https://sr.ffquan.cn/cms_pic/20200612/brhjkf76vrkcrfpi79eg0.png',
      //  loading: 'https://sr.ffquan.cn/cms_pic/20200612/brhjkf76vrkcrfpi79eg0.png',
        attempt: 1
    })
    new Vue({
@@ -312,19 +401,139 @@
                goodsList:[],
                robbingNum:0,
            },
            sortNumber:'tb',
            sortId:0,
            fristOrderSort: [
                    {
                    name: "淘宝",
                    bool: true,
                    max: "",
                    min: "",
                    number: 'tb'
                    },
                    {
                    name: "抖音",
                    bool: true,
                    max: "",
                    min: "",
                    number: 'dy'
                    },
                    {
                    name: "京东",
                    bool: true,
                    max: "",
                    min: "",
                    number: 'jd'
                    }
              ],
            goodsItem: [],
            lists:[],
            nav:[],
            active:0,
            twoNav:false,
            activeTwo:undefined,
            loading:false,
            isUniReady:false
            loading:true,
            isUniReady:false,
            plat:'tb',
            //posturl:"http://dfg.shop.com"
            //posturl:"http://appapitest.ushopvip.com"
            //posturl:"http://dfgapp.ushopvip.com"
        },
        methods: {
           
            topBack:function()
            {
                uni.postMessage({
                      data: {
                         action: 'back'
                      }
                     });
            },
            touch:function()
            {
                const box = document.querySelector('.box')
                const list = document.querySelector('.list');
                // 按下屏幕的位置
                let touchStartPosition = 0
            
                // touchstart事件
                box.addEventListener('touchstart', function (e) {
                    let touch = e.touches[0]
                    touchStartPosition = touch.pageY
                })
                // touchmove事件
                box.addEventListener('touchmove', function (e) {
                   
                    let touch = e.touches[0]
                    // 列表的top值等于列表相对于box的偏移量+滑动的距离
                    let pySize= list.offsetTop + touch.pageY - touchStartPosition;
                    if(pySize>=110)
                    {
                      return;
                    }
                    if(pySize<0)
                    {
                        return;
                    }
                    var scroll = document.getElementsByClassName('contscore')
                        var srollPos = $('.contscore').scrollTop(); //滚动条距顶部距离(页面超出窗口的高度)
                    if(srollPos>0)
                    {
                        return;
                    }
                    list.style.top =pySize + 'px';
                    // 实现平滑的滑动
                    touchStartPosition = touch.pageY
                })
                // touchend事件
                box.addEventListener('touchend', function (e) {
                    let top = list.offsetTop
                    if (top > 70) {
                        // 在此处调用刷新后的回调
                        console.log('刷新');
                        location.reload();
                    }
                    if(top<0)
                    {
                        list.style.top=0;
                    }
                    if (top > 0) {
                        // 通过定时器平滑的将list的top = 0
                        let timer = setInterval(() => {
                            top=top-5;
                        list.style.top = top + 'px'
                        if (top <= 0) {
                            list.style.top=0;
                            clearInterval(timer)
                        }
                        },1)
                    }
                })
            },
            Infoformat: function(info){
                info = info.replace(/\%/g,"%25")
            info = info.replace(/\#/g,"%23")
            info = info.replace(/\&/g,"%26")
            info = info.replace(/\?/g,"%3F")
            return info;
            },
            targetItem:function(item){
                if(this.isUniReady)
                switch(this.plat)
                {
                    case "tb":
                        uni.navigateTo({
                            url: '/pages/goods/goodsDetail?id=' + item.goodsId+'&frompage=freebuy'
                        });
                        break;
                    case "dy":
                    case "jd":
                        var itemsStr=this.Infoformat(JSON.stringify(item));
                        uni.navigateTo({
                            url: '/pages/goods/goodsDetail?sourcefrom=freebuy&info=' + itemsStr+'&frompage=freebuy'
                        });
                        break;
                }
              
                /* if(this.isUniReady)
                {
                    uni.postMessage({
                      data: {
@@ -332,9 +541,17 @@
                         data:item
                      }
                     });
                } */
            },
            handleSort: function(item) {
                if(this.sortNumber != item.number) {
                    this.loading=true;
                    this.lists=[];
                    this.getgoodsSwitch(item.number);
                    this.sortNumber = item.number;
                    this.plat=item.number;
                }
            },
            
            getUrlPar:function(name)
            {
                var reg=new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
@@ -342,44 +559,117 @@
                if(r !=null)return unescape(r[2]);
                 return null;
            },
            getGoodsList:function(){
             //获取京东商品
             getJdGoodsList:function(){
                var _this=this;
                $.ajax({
                            headers:{
                                "token":_this.getUrlPar("token")
                            },
                            url:'/api/taoke/get_first_free_jd_goods', 
                            type:"post",
                                dataType:"json",
                            data:{
                            }
                            }).done(function(res){
                            _this.lists=[].concat([],res.data.list);
                            _this.loading = false;
                     })
            },
            //获取抖音商品
            getDyGoodsList:function(){
                var _this=this;
                $.ajax({
                            headers:{
                                "token":_this.getUrlPar("token")
                            },
                            url:'/api/taoke/get_first_free_dy_goods', 
                            type:"post",
                                dataType:"json",
                            data:{
                            }
                            }).done(function(res){
                            _this.lists=[].concat([],res.data.list);
                            _this.loading = false;
                     })
            },
            //获取淘宝商品
            getTbGoodsList:function()
            {
                var _this=this;
                $.ajax({
                            headers:{
                                "token":_this.getUrlPar("token")
                            },
                            url:'/api/taoke/get_first_free_goods', 
                            type:"post",
                                dataType:"json",
                            data:{
                                page: 1,
                                pageSize:40,
                            }
                            }).done(function(res){
                            _this.lists=[].concat([],res.data.list);
                            _this.loading = false;
                     })
            },
            getgoodsSwitch:function(plat)
                {
                    switch(plat)
                        {
                            case "tb":
                                this.getTbGoodsList();
                                break;
                            case "dy":
                                this.getDyGoodsList();
                                break;
                            case"jd":
                                this.getJdGoodsList();
                                break;
                        }
                },
            //是否首单
            getIsSd:function(){
                var _this = this;
                this.loading=true;
                alert("进来了")
                alert(this.getUrlPar("token"))
                //判断是否首单
                $.ajax({
                    headers:{
                        "token":this.getUrlPar("token")
                        "token":_this.getUrlPar("token")
                    },
                    //url:'http://dfg.shop.com/index.php/api/taoke/get_first_free_goods', 
                   //url:'http://dfgapp.ushopvip.com/api/taoke/get_first_free_goods',
                   url:'http://appapitest.ushopvip.com/api/taoke/get_first_free_goods', 
                   url:'/api/user/check_isfirst_free',
                   type:"post",
                    dataType:"json",
                    data:{
                        nineCid:1,
                        page: 1,
                        pageSize:20,

                    }
                }).done(function(res){
                    alert(res)
                    var newlist=[];
                    res.data.list.map(function(r,k){
                        var buprice=r.actualPrice-r.topFanli;
                        if(buprice<=3)
                        {
                            newlist.push(r);
                        }
                    })
                    _this.lists=[].concat(_this.lists,newlist);
                    _this.loading = false;
                    if(res.msg.info==1)
                    {
                        _this.getgoodsSwitch(_this.plat);
                    }
                    else{
                        alert("您已下过首单，不可再次购买，请浏览其他商品吧~");
                      
                        setTimeout(function(){
                            if(_this.isUniReady)
                            {
                                uni.postMessage({
                                data: {
                                    action: 'back'
                                }
                                });
                           }
                        }, 1000 )
                    }
                })
            },
        },
      
        mounted: function () {
            alert("开始")
            this.getGoodsList();
            this.getIsSd();
            var that=this;
            this.touch();
            document.addEventListener('UniAppJSBridgeReady', function() {
            that.isUniReady=true;
            });