供需详情

README.md

@@ -14,7 +14,7 @@
 
 ​	announceDemand -- 发布需求
 
-​	supplyAndDemand -- 供应与需求
+​	supplyAndDemand -- index-供应与需求  particulars-供需详情
 
 # 自定义组件：
 
@@ -56,6 +56,8 @@
 
 ​	My_VerticalBox -- 垂直盒子
 
+​	My_CenterTheTitle -- 居中标题 两侧带有居中蓝线
+
 # 缓存
 
 ​	userData -- 用户基本数据 -- 保存数据：index-用户列表下标，token，fisadministrator--是否主账号，tagentsid，tenterpriseid，userid

app.json

@@ -35,7 +35,8 @@
         "pages/tabbar-pages/customer-service-staff/index",
         "pages/tabbar-pages/supplyAndDemand/index",
         "pages/tabbar-pages/message/index",
-        "pages/tabbar-pages/user/index"
+        "pages/tabbar-pages/user/index",
+        "pages/tabbar-pages/supplyAndDemand/particulars"
     ],
     "usingComponents": {
         "van-button": "@vant/weapp/button/index",

components/My_CenterTheTitle/index.js

@@ -0,0 +1,23 @@
+// components/My_CenterTheTitle/index.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+
+    }
+})

components/My_CenterTheTitle/index.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

components/My_CenterTheTitle/index.wxml

@@ -0,0 +1,2 @@
+<!--components/My_CenterTheTitle/index.wxml-->
+<text>components/My_CenterTheTitle/index.wxml</text>

components/My_CenterTheTitle/index.wxss

@@ -0,0 +1 @@
+/* components/My_CenterTheTitle/index.wxss */

pages/tabbar-pages/supplyAndDemand/particulars.js

@@ -0,0 +1,66 @@
+// pages/tabbar-pages/supplyAndDemand/particulars.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/tabbar-pages/supplyAndDemand/particulars.json

@@ -0,0 +1,5 @@
+{
+  "usingComponents": {
+    "My_SupplyAndDemandItemBox": "/components/My_SupplyAndDemandItemBox/index"
+  }
+}

pages/tabbar-pages/supplyAndDemand/particulars.wxml

@@ -0,0 +1,33 @@
+<view class="header-box">
+    <!-- 供需标题和用户信息 -->
+    <view class="title-and-usercenter">
+        <view class="title-and-userMessage">
+            <view class="header-title">家纺城产业互联平台上线</view>
+            <view class="header-userMessage">
+                <view class="header-userMessage-img"></view>
+                <view class="header-userMessage-textMsg">家纺城-小布 12-07 12:24</view>
+            </view>
+        </view>
+    </view>
+</view>
+<!-- 更多推荐 -->
+<view class="venter-the-title">
+    <view></view><text>654654654654</text>
+    <view></view>
+</view>
+
+
+<!-- 列表 -->
+<My_SupplyAndDemandItemBox wx:for="{{3}}" title="【{{item.ftitle}}】{{item.fcontent}}" time="{{item.checkdate}}" imageList="{{item.attinfos}}">
+    <!-- 内容信息插槽 -->
+    <view slot="dataAndBut">
+        <view class="dataAndBut">
+            <view class="dataAndBut_data">
+                浏览次数:245次 意向沟通人数:134次
+            </view>
+            <view class="dataAndBut_but">
+                <van-button color="#4DC2D4" style="margin-left: 16rpx;" custom-class="custom-slotBut">一键联系</van-button>
+            </view>
+        </view>
+    </view>
+</My_SupplyAndDemandItemBox>

pages/tabbar-pages/supplyAndDemand/particulars.wxss

@@ -0,0 +1,108 @@
+/* 盒子 */
+.header-box {
+    width: 100vw;
+    background-color: #ffffff;
+    padding: 20rpx 24rpx 30rpx;
+    border-radius: 0px 0px 20rpx 20rpx;
+    box-sizing: border-box;
+}
+
+/* 居中标题 */
+.venter-the-title {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 44rpx;
+    width: 100%;
+    font-size: 32rpx;
+    text-align: center;
+    color: #000000;
+    margin: 30rpx 0 20rpx;
+}
+
+.venter-the-title>text {
+    display: inline-block;
+    padding: 0 20rpx;
+}
+
+.venter-the-title>view {
+    width: 44rpx;
+    height: 4rpx;
+    background: #4DC2D4;
+    border-radius: 2rpx;
+    opacity: 0.5;
+}
+
+
+
+.title-and-userMessage {
+    width: 100%;
+    margin-left: 6rpx;
+}
+
+.header-title {
+    font-size: 32rpx;
+    color: #000000;
+}
+
+.header-userMessage {
+    display: flex;
+    align-items: center;
+    height: 28rpx;
+    margin-top: 10rpx;
+}
+
+.header-userMessage-img {
+    width: 28rpx;
+    height: 28rpx;
+    background-color: aqua;
+    border-radius: 50%;
+}
+
+.header-userMessage-textMsg {
+    font-size: 20rpx;
+    color: #333333;
+    opacity: .7;
+    margin-left: 8rpx;
+}
+
+
+
+/* 数据，按钮 插槽样式 */
+.dataAndBut {
+    display: flex;
+    justify-content: space-between !important;
+    align-items: center;
+    flex-wrap: nowrap;
+    margin-top: 14rpx;
+}
+
+.dataAndBut_data {
+    flex: 1;
+    display: flex;
+    font-size: 24rpx;
+    color: #000000;
+    margin-left: 16rpx;
+}
+
+.dataAndBut_data>text {
+    color: #4DC2D4;
+    text-decoration: underline;
+    margin-left: 8rpx;
+}
+
+.dataAndBut_but {
+    display: flex;
+    align-items: center;
+    margin-right: 6rpx;
+}
+
+.custom-slotBut {
+    height: 44rpx !important;
+    background: linear-gradient(180deg, #84E3EC 0%, #4DC2D4 100%) !important;
+    box-shadow: 0px 0px 12rpx 0px rgba(0, 0, 0, 0.1) !important;
+    border-radius: 10rpx !important;
+    color: 20rpx !important;
+    padding: 0 14rpx !important;
+    border: 0 !important;
+}

project.private.config.json

@@ -77,6 +77,12 @@
                     "pathName": "pages/tabbar-pages/home/index",
                     "query": "",
                     "scene": null
+                },
+                {
+                    "name": "供需详情",
+                    "pathName": "pages/tabbar-pages/supplyAndDemand/particulars",
+                    "query": "",
+                    "scene": null
                 }
             ]
         }