供需

pages/tabbar-pages/supplyAndDemand/particulars.js

@@ -11,6 +11,8 @@ Page({
     data: {
         recommendationList: [], //推荐列表
         particulars: {}, //详情
+        ceiling: false, //是否吸顶
+        Heitop: 0, //吸顶高度
     },
 
     /**
@@ -27,10 +29,16 @@ Page({
                 "tsupplyanddemandid": options.tsupplyanddemandid
             }
         }).then(res => {
+            console.log(res)
+            if (res.msg != '成功') return wx.showToast({
+                title: res.data,
+                icon: "none"
+            });
             let checkdate = res.data[0].checkdate;
-            res.data[0].checkdate = checkdate.slice(0, checkdate.lastIndexOf('.'));
+            if (checkdate != '' && checkdate != null && checkdate != undefined) res.data[0].checkdate = checkdate.slice(0, checkdate.lastIndexOf('.'));
+            const particulars = handleList.imageType(res.data[0], "default");
             this.setData({
-                particulars: res.data[0]
+                particulars
             })
         });
         /* 获取推荐列表 */
@@ -40,15 +48,20 @@ Page({
             "method": "query_supplyanddemandList",
             "content": {
                 "getdatafromdbanyway": true,
-                "pageNumber": 1,
+                "pageNumber": 2,
                 "pageSize": 10,
                 "where": {}
             }
         }).then(res => {
+            console.log("查询列表", res)
+            if (res.msg != '成功') return wx.showToast({
+                title: res.data,
+                icon: "none"
+            });
             const data = handleList.checkdate(res.data)
-            const productList = handleList.listOrdering(data);
+            const recommendationList = handleList.imageType(data, "default");
             this.setData({
-                recommendationList: productList
+                recommendationList
             })
         })
     },
@@ -132,5 +145,44 @@ Page({
      */
     onShareAppMessage: function () {
 
+    },
+    /* 页面滑动 */
+    onPageScroll: function (e) {
+        const that = this;
+        const query = wx.createSelectorQuery()
+        query.select('#Description').boundingClientRect(function (fres) {
+            if (fres.top > that.data.Heitop) that.setData({
+                Heitop: fres.top
+            });
+            if (that.data.ceiling) {
+                if (fres.top > 15) {
+                    that.setData({
+                        ceiling: false
+                    })
+                    if (!that.data.ceiling) console.log('false', fres.top)
+                }
+            } else {
+                if (fres.top < 15) {
+                    that.setData({
+                        ceiling: true
+                    })
+                    if (that.data.ceiling) console.log('true', fres.top)
+                }
+            }
+        })
+        query.selectViewport().scrollOffset()
+        query.exec(function (res) {
+            // console.log(res)
+        })
+
+        /*         if (this.data.ceiling) {
+                    if (e.scrollTop == 0) this.setData({
+                        ceiling: false
+                    })
+                } else {
+                    if (e.scrollTop != 0) this.setData({
+                        ceiling: true
+                    })
+                } */
     }
 })

pages/tabbar-pages/supplyAndDemand/particulars.wxml

@@ -1,30 +1,36 @@
 <view class="header-box">
     <!-- 供需标题和用户信息 -->
     <view class="title-and-usercenter">
-        <view class="title-and-userMessage">
-            <view class="header-title">{{particulars.ftitle}}</view>
+        <view class="title-and-userMessage {{ceiling?'box-ceiling':''}}">
+            <view class="header-title {{ceiling?'u-line-1':''}}">【{{particulars.ftype}}】{{particulars.ftitle}}</view>
             <view class="header-userMessage">
                 <view class="header-userMessage-img">
-                    <image src="{{particulars.headportraiturl}}" mode="aspectFit"></image>
+                    <image wx:if="{{particulars.headportraiturl}}" src="{{particulars.headportraiturl}}" mode="aspectFit"></image>
+                    <image wx:else src="/static/tacitly-approve/MRuserImg.png" mode="aspectFit"></image>
                 </view>
                 <view class="header-userMessage-textMsg">{{particulars.createby}} {{particulars.checkdate}}</view>
             </view>
+            <view class="but-box">
+                <van-button wx:if="{{particulars.fstatus == '待对接'}}" color="#4DC2D4" style="margin-left: 16rpx;" custom-class="custom-slotBut details-custom-slotBut">一键联系</van-button>
+                <van-button wx:else color="#4DC2D4" style="margin-left: 16rpx;" custom-class="custom-NoSlotBut details-custom-slotBut">{{particulars.fstatus}}</van-button>
+            </view>
         </view>
+        <view style="height: {{ceiling?Heitop+20:0}}rpx;"></view>
         <!-- 产品详情 -->
-        <view style="overflow-wrap: break-word; margin-bottom: 15rpx;">{{particulars.fcontent}}</view>
-        <view class="detailed-description">
-            <image wx:for="{{particulars.attinfos}}" src="{{item.fobsurl}}" mode="widthFix" catchtap="previewImage"></image>
+        <view id='Description' style="margin-top: 15px;">
+            <view style="overflow-wrap: break-word; margin-bottom: 15rpx;">{{particulars.fcontent}}</view>
+            <view class="detailed-description">
+                <image wx:for="{{particulars.attinfos}}" src="{{item.fobsurl}}" mode="widthFix" catchtap="previewImage"></image>
+            </view>
         </view>
-        <!-- <van-button color="#4DC2D4" style="margin-left: 16rpx;" custom-class="custom-slotBut">一键联系</van-button> -->
-        <van-button wx:if="{{particulars.fstatus == '待对接'}}" color="#4DC2D4" style="margin-left: 16rpx;" custom-class="custom-slotBut details-custom-slotBut">一键联系</van-button>
-        <van-button wx:else color="#4DC2D4" style="margin-left: 16rpx;" custom-class="custom-NoSlotBut details-custom-slotBut">{{particulars.fstatus}}</van-button>
     </view>
 </view>
+
 <!-- 更多推荐 -->
 <My_CenterTheTitle title='其他推荐'></My_CenterTheTitle>
 
 <!-- 列表 -->
-<My_SupplyAndDemandItemBox wx:for="{{recommendationList}}" title="【{{item.ftitle}}】{{item.fcontent}}" time="{{item.checkdate}}" imageList="{{item.attinfos}}" data-index="{{index}}" bindtap="jumpForDetails">
+<My_SupplyAndDemandItemBox wx:for="{{recommendationList}}" title="【{{item.ftype}}】{{item.ftitle}}" time="{{item.checkdate}}" imageList="{{item.attinfos}}" data-index="{{index}}" bindtap="jumpForDetails">
     <!-- 内容信息插槽 -->
     <view slot="dataAndBut">
         <view class="dataAndBut">

pages/tabbar-pages/supplyAndDemand/particulars.wxss

@@ -7,12 +7,40 @@
     box-sizing: border-box;
 }
 
+/* 吸顶样式 */
+.box-ceiling {
+    position: fixed !important;
+    top: 0;
+    left: 0;
+    padding: 10rpx 24rpx 5rpx !important;
+    background-color: #ffffff;
+    box-sizing: border-box;
+    box-shadow: 0 3rpx 8rpx 0rpx rgba(0, 0, 0, .2);
+    margin-left: 0 !important;
+    z-index: 999999;
+}
+
+.box-ceiling .but-box {
+    bottom: 5rpx;
+}
+
+.box-ceiling .details-custom-slotBut {
+    margin-right: 34rpx !important;
+}
+
 .title-and-userMessage {
+    position: relative;
     width: 100%;
     margin-left: 6rpx;
     margin-bottom: 15rpx;
 }
 
+.but-box {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+}
+
 .header-title {
     font-size: 32rpx;
     color: #000000;
@@ -22,7 +50,7 @@
     display: flex;
     align-items: center;
     height: 28rpx;
-    margin-top: 10rpx;
+    margin-top: 25rpx;
 }
 
 .header-userMessage-img {
@@ -78,7 +106,7 @@
 
 .custom-slotBut {
     height: 44rpx !important;
-    background: linear-gradient(180deg, #84E3EC 0%, #4DC2D4 100%) !important;
+    background: #FFB600 !important;
     box-shadow: 0px 0px 12rpx 0px rgba(0, 0, 0, 0.1) !important;
     border-radius: 10rpx !important;
     color: 20rpx !important;
@@ -93,7 +121,7 @@
 /* 按钮 */
 .custom-slotBut {
     height: 44rpx !important;
-    background: linear-gradient(180deg, #84E3EC 0%, #4DC2D4 100%) !important;
+    background: #FFB600 !important;
     box-shadow: 0px 0px 12rpx 0px rgba(0, 0, 0, 0.1) !important;
     border-radius: 10rpx !important;
     color: 20rpx !important;