zhaojs
2023-07-31 848a169221668413691f44e1fcbd219e32c1431c
public/html/fengqiangbang.html
@@ -29,13 +29,28 @@
        
        var _config = {
            appKey: 'bkuibk',//此处替换成用户appKey
            jumpGoodsUrl: function (items,sourceType,faction) {   //默认直接转链
            jumpGoodsUrl: function (items,sourceType) {   //默认直接转链
                var url='';
                if(sourceType=="jd"||sourceType=="pdd"||sourceType=="dy")
                {
                    var itemsStr=Infoformat(JSON.stringify(items));
                    url='/pages/goods/goodsDetail?sourcefrom=fqb&info=' +  encodeURIComponent(itemsStr)
                }
                else{
                    url='/pages/goods/goodsDetail?id=' + items.goodsid
                }
                uni.navigateTo({
                  url: '/pages/goods/goodsDetail?id=' + items.goodsid+"&sourceType="+sourceType+"&faction="+faction
                  url: url
                });
              //  return '/pages/goods/goodsDetail?id=' + items.goodsid; //替换为详细页面的地址
            }
        };
        function Infoformat(info){
            info = info.replace(/\%/g,"%25")
            info = info.replace(/\#/g,"%23")
            info = info.replace(/\&/g,"%26")
            info = info.replace(/\?/g,"%3F")
            return info;
        }
    </script>
    <style>
        body{
@@ -44,7 +59,7 @@
        a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:transparent;box-sizing:border-box}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}html{font-family:Arial,PingFang SC,-apple-system,BlinkMacSystemFont,Segoe UI,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}
        .list-container{
            position: relative;
            padding-top: 10px;
            padding-top: 0.7rem;
        }
        .top-bg{
            width: 100%;position: absolute;top:0;
@@ -86,7 +101,7 @@
            height: .4rem;background: rgba(255,129,70,.9);border-radius: .2rem;display: table;margin: .3rem auto;padding: 0 .2rem;font-size: .22rem;color: #fff;line-height: .4rem;
        }
        .list-container .topThree{
            display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;
            display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center; margin-top: .3rem;
        }
        .list-container .topThree>div {
            width: 2.2rem;height: 3.4rem;background: #fff;border-radius: .14rem;padding: .1rem;position: relative;
@@ -226,7 +241,7 @@
            font-weight: 500;color: #fff;line-height: .65rem;text-align: center;
        }
        .list-container .card-block{
            padding-top: 15px;
        }
        .sys{
            width: 100%;
@@ -263,14 +278,55 @@
            font-size: .35rem;
            color: #333;
        }
        .contscore
        {
            overflow:scroll;
            height: 80vh;
        }
        .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%;
        }
        .reloadbg
        {
            display: flex;
            justify-content: center;
            height: 1.3rem;
        }
        .appback
        {
            height: 0.5rem;
            position: absolute;
            left: 0.4rem;
            z-index: 999;
            top:0.2rem;
        }
        .appback-img
        {
            height: 100%;
        }
    </style>
</head>
<body style="padding-top:30px">
<body>
   <div class="box">
    <div class="list"  id="fqList">
        <!-- <div class="appback">
            <image @click="topBack()" class="appback-img" src="https://yanfeiobpub.obs.cn-east-3.myhuaweicloud.com/dfg/h5return_backIcon.png"></image>
        </div> -->
    <img src="https://jpdy.ffquan.cn/static/header_bg.12963398.png" class="top-bg" alt="">
    <div class="list-container" id="fqList">
    <div class="list-container">
        <div  v-if="loading" class="loading">
            <span>加载中...</span>
        </div>
@@ -295,7 +351,7 @@
        <div class="swiper-container card-block">
            <div class="swiper-wrapper">
                <div class="swiper-slide swiper-no-swiping">
                <div class="swiper-slide swiper-no-swiping contscore">
                        <div class="topThree">
                                <div v-for="(item,index) in goodsList" :key = "index" v-if="index==1"  @click="handleCdetailFavorite(item)">
                                    <a>
@@ -386,11 +442,9 @@
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</body>
<script>
@@ -418,7 +472,7 @@
            ss:0,
            cid:0,
            type:1,
            posturl:'http://dfg.shop.com',
           //posturl:'http://dfg.shop.com',
           // posturl:'http://dfgapp.ushopvip.com',
            //posturl:'http://appapitest.ushopvip.com',
            platlist:[
@@ -440,22 +494,141 @@
                }
            ],
            platid:'tb',
            scrollTop: 0,
         canScroll: false,
            nowPage:1,
            loadData:false
        },
        onload(options){
            console.log(options);
        },
        onReachBottom(){
            console.log("到底了111");
        },
        methods:{
            topBack:function()
            {
                uni.postMessage({
                      data: {
                         action: 'back'
                      }
                     });
            },
            getItemDetail:function(items)
            {
                var _this = this;
                $.ajax({
                        headers:{
                            "token":_this.getUrlPar("token")
                        },
                        url:'/api/Activity/fqb_goods_detail',
                        type:"post",
                        dataType:"json",
                        data:{
                            plat:_this.platid,
                            goodsid:items.goodsid
                        }
                    }).done(function(res){
                       _config.jumpGoodsUrl(res.data,_this.platid);
                    })
            },
            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)
                    }
                })
            },
            scrollLoad: function() {
            //
            var _this = this;
            var range = 800; //距下边界长度/单位px
            var totalheight = 0;
            $('.contscore').scroll(function() {
               var scroll = document.getElementsByClassName('contscore')
               var srollPos = $('.contscore').scrollTop(); //滚动条距顶部距离(页面超出窗口的高度)
               totalheight = parseFloat($('.contscore').height()) + parseFloat(srollPos);
               _this.scrollTop = srollPos
               var scrollH = scroll[0].scrollHeight
               // debugger
               // console.log('scrollH - range',scrollH - range,'srollPos',srollPos)
               if (scrollH - range <= srollPos) {
                  if (_this.canScroll&&_this.platid!='tb') {
                            _this.canScroll = false;
                     _this.loadData = true;
                     _this.nowPage++;
                     _this.getGoodsList(_this.cid);
                  }
               }
            });
         },
            handleCdetailFavorite: function (items) {
                if(_config.jumpGoodsUrl){
                    var faction='t';
                    switch(this.platid)
                    {
                        case "tb":faction="t";break;
                        case "jd":faction="j";break;
                        case "pdd":faction="p";break;
                        case "dy":faction="d";break;
                        case "tb":
                        case "pdd":
                        case "dy":
                            _config.jumpGoodsUrl(items,this.platid);
                            break;
                        case "jd":
                             this.getItemDetail(items);
                             break;
                    }
                    _config.jumpGoodsUrl(items,this.platid,faction);
                }
                return;
                var params = {
@@ -517,7 +690,9 @@
                })
            },
            chooseCate:function(index,cid,type){//选择分类
                mySwiper.slideTo(index-2, 1000, false)
                mySwiper.slideTo(index-2, 1000, false);
                this.nowPage=1;
                this.goodsList=[];
                this.actIndex = index;
                this.getGoodsList(cid,type)
                this.cid = cid;
@@ -526,11 +701,13 @@
            choosePlat:function(index,id)
            {//选择平台
                this.platid = id;
                this.goodsList=[];
                this.getCateList();
            },
            getCateList:function(){//获取分类列表
                var _this = this;
                //_this.loading=true;
                this.nowPage=1;
                if(this.platid=='tb')
                {
                    $.ajax({
@@ -557,7 +734,7 @@
                        headers:{
                            "token":this.getUrlPar("token")
                        },
                        url:this.posturl+'/api/Activity/fqb_plat_cate',
                        url:'/api/Activity/fqb_plat_cate',
                        type:"post",
                        dataType:"json",
                        data:{
@@ -641,7 +818,7 @@
                    headers:{
                        "token":this.getUrlPar("token")
                    },
                    url:this.posturl+'/api/Activity/fqn_goods_list',
                    url:'/api/Activity/fqn_goods_list',
                    type:"post",
                    dataType:"json",
                    data:{
@@ -649,11 +826,20 @@
                        cid:cid,
                        type:type,
                        app_key: _config.appKey,
                        mainid:_this.nowPage
                    }
                }).done(function(res){
                    _this.loading=false;
                    if(res.code == 0){
                        _this.goodsList =_this.platid=='tb'? res.data.data.data:res.data;
                        var resdata=_this.platid=='tb'? res.data.data.data:res.data;
                        _this.goodsList=_this.goodsList.concat(resdata);
                        if(resdata&&resdata.length>0)
                        {
                            _this.canScroll=true;
                        }
                        else{
                            _this.canScroll=false;
                        }
                      //  _this.sys = (res.data.data && res.data.data.sys) ? res.data.data.sys : null;
                    }
                    else {
@@ -734,6 +920,8 @@
        mounted:function(){
            this.getCateList();
            this.cateRender();
            this.scrollLoad();
            this.touch();
            // this.getDateNow();
            //this.getGoodsList();
           // this.getNowTime();