上传代码

app.js

@@ -6,6 +6,9 @@ App({
     this.setMenuHeight()
   },
   onShow(e){
+		//隐藏系统tabbar
+		wx.hideTabBar();
+		
     var query = {};
     if(e.query.q){
       //通过扫码进来获取二维码上的参数并存入storage
@@ -34,6 +37,7 @@ App({
         // console.log(res)
         this.globalData.navTopHeight = res.statusBarHeight;
         this.globalData.CustomBar = res.statusBarHeight + 45;
+				this.globalData.systemInfo = res;
       }
     });
     let menuButtonObj = wx.getMenuButtonBoundingClientRect();
@@ -41,7 +45,22 @@ App({
     // console.log(menuButtonObj)
     this.globalData.menuHeight = menuButtonObj.height;
     this.globalData.navHeight = menuButtonObj.height + (menuButtonObj.top - this.globalData.navTopHeight);
+		
   },
+	editTabbar: function () {
+	  var tabbar = this.globalData.tabBar;
+	  var currentPages = getCurrentPages();
+	  var that = currentPages[currentPages.length - 1];
+	  var pagePath = that.route;
+	  (pagePath.indexOf('/') != 0) && (pagePath = '/' + pagePath);
+	  for (var i in tabbar.list) {
+	    tabbar.list[i].selected = false;
+	    (tabbar.list[i].pagePath == pagePath) && (tabbar.list[i].selected = true);
+	  }
+	  that.setData({
+	    tabbar: tabbar
+	  });
+	},
   getToken(){
     // console.log('getToken')
     var tokentime = wx.getStorageSync('tokentime') || '';//过期时间
@@ -73,7 +92,6 @@ App({
     })
   },
   getInfo(){
-
     this.http('get','userinfo').then((res)=>{
       if(res.data.success){
         wx.setStorageSync('userInfo',res.data.data)
@@ -133,5 +151,43 @@ App({
     menuHeight: 0,
     CustomBar: 0,
     inviterId: null , //分享码
+		systemInfo: null, //客户端设备信息
+		tabBar: {
+		  "backgroundColor": "#ffffff",
+		  "color": "#979795",
+		  "selectedColor": "#1c1c1b",
+		  "list": [
+		    {
+		      "pagePath": "/pages/index/index",
+		      "iconPath": "icon/icon_home.png",
+		      "selectedIconPath": "icon/icon_home_HL.png",
+		      "text": "首页"
+		    },
+		    {
+		      "pagePath": "/pages/demandHall/index",
+		      "iconPath": "icon/icon_home.png",
+		      "selectedIconPath": "icon/icon_home_HL.png",
+		      "text": "供需大厅"
+		    },
+		    {
+		      "pagePath": "/pages/release/index",
+		      "iconPath": "icon/icon_release.png",
+		      "isSpecial": true,
+		      "text": "发布"
+		    },
+		    {
+		      "pagePath": "/pages/life/index",
+		      "iconPath": "icon/icon_mine.png",
+		      "selectedIconPath": "icon/icon_mine_HL.png",
+		      "text": "购物车"
+		    },
+		    {
+		      "pagePath": "/pages/user/index",
+		      "iconPath": "icon/icon_mine.png",
+		      "selectedIconPath": "icon/icon_mine_HL.png",
+		      "text": "我的"
+		    }
+		  ]
+		}
   }
 })

app.json

@@ -1,19 +1,63 @@
 {
   "pages":[
-    "pages/user/agreement/index",
     "pages/user/index",
+    "pages/demandHall/needsDetail/index",
+    "pages/demandHall/resourcesDetail/index",
+    "pages/demandHall/companyDetail/index",
+    "pages/demandHall/index",
+    "pages/release/index",
+    "pages/release/personAuth/index",
+    "pages/release/companyAuth/index",
+    "pages/release/perfectPersonInfo/index",
+    "pages/release/perfectCompanyInfo/index",
+    "pages/index/index",
+		"pages/life/index",
+    "pages/user/mine/index",
+    
+    "pages/user/agreement/index",
     "pages/user/incomeDetail/index",
     "pages/user/profession/index",
-    "pages/index/index",
+    
     "pages/user/completeData/index",
     "pages/user/personalData/index",
 		"pages/user/industry/index"
   ],
   "window":{
     "backgroundTextStyle":"light",
-    "navigationBarBackgroundColor": "#212226",
+    "navigationBarBackgroundColor": "#fff",
     "navigationBarTitleText": "禅易云生态",
-    "navigationBarTextStyle":"white"
+    "navigationBarTextStyle":"black"
+  },
+  "tabBar": {
+    "backgroundColor": "#ffffff",
+    "color": "#D4D4D4",
+    "selectedColor": "#FF6F34",
+    "list": [
+      {
+        "pagePath": "pages/index/index",
+        "text": "首页",
+        "iconPath": "tabbarComponent/icon/icon_home.png",
+        "selectedIconPath": "tabbarComponent/icon/icon_home_HL.png"
+      },
+      {
+        "pagePath": "pages/demandHall/index",
+        "text": "供需大厅",
+        "iconPath": "tabbarComponent/icon/icon_home.png",
+        "selectedIconPath": "tabbarComponent/icon/icon_home_HL.png"
+      },
+      {
+        "pagePath": "pages/life/index",
+        "text": "生活",
+        "iconPath": "tabbarComponent/icon/icon_mine.png",
+        "selectedIconPath": "tabbarComponent/icon/icon_mine_HL.png"
+      },
+      {
+        "pagePath": "pages/user/index",
+        "text": "我的",
+        "iconPath": "tabbarComponent/icon/icon_mine.png",
+        "selectedIconPath": "tabbarComponent/icon/icon_mine_HL.png"
+      }
+    ]
   },
   "style": "v2",
   "sitemapLocation": "sitemap.json"

app.wxss

@@ -93,3 +93,31 @@ image {
   width: 100%;
   height: 100%;
 } 
+
+
+
+radio .wx-radio-input.wx-radio-input-checked {
+  border-color: #cc0000;
+  background: #cc0000;
+}
+radio .wx-radio-input {
+  height: 33rpx;
+  width: 33rpx;
+  margin-top: -4rpx;
+  border-radius: 50%;
+  border: 2rpx solid #999;
+  background: transparent;
+}
+radio .wx-radio-input.wx-radio-input-checked::before {
+  border-radius: 50%; /* 圆角 */
+  width: 35rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
+  height: 35rpx; /* 选中后对勾大小，不要超过背景的尺寸 */
+  line-height: 35rpx;
+  text-align: center;
+  font-size: 28rpx; /* 对勾大小 30rpx */
+  color: #fff; /* 对勾颜色 白色 */
+  background: #FF5100;
+  border: 2rpx solid #FF5100;
+  transform: translate(-50%, -50%) scale(1);
+  -webkit-transform: translate(-50%, -50%) scale(1);
+}

pages/demandHall/companyDetail/index.js

@@ -0,0 +1,81 @@
+// pages/demandHall/companyDetail/index.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    tabActive: 3,
+    swiperImgUrls: [
+      '../../../images/home/item-bg.png',
+      '../../../images/home/company-top-bg.png'
+    ],
+    swiperIndex: 0
+  },
+  tabClick(e){
+    this.setData({
+      tabActive: e.currentTarget.dataset.i
+    })
+  },
+  swiperChange(e) {
+    const that = this;
+    that.setData({
+      swiperIndex: e.detail.current,
+    })
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/demandHall/companyDetail/index.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "企业首页"
+}

pages/demandHall/companyDetail/index.wxml

@@ -0,0 +1,138 @@
+<!--pages/demandHall/companyDetail/index.wxml-->
+<view class="companyDetail-page">
+  <view class="top-box">
+    <image class="top-bg-img" src="../../../images/home/company-top-bg.png"></image>
+    <view class="top-bg"></view>
+    <view class="top-content">
+      <view class="company-info-box acea-row">
+        <image src="../../../images/home/company-img.png" class="company-logo"></image>
+        <view class="info">
+          <view class="company-name">楚牛科技</view>
+          <view class="slogan">让全世界牛起来。</view>
+          <view class="tags-box">
+            <view class="tag-item">网站建设</view>
+            <view class="tag-item bgG">IT软件</view>
+          </view>
+        </view>
+      </view>
+      <view class="company-contact-box">
+        <view class="contact-item">
+          <image src="../../../images/home/c-location.png"></image>
+          <text>武汉市CBD国际大厦A座</text>
+        </view>
+        <view class="contact-item">
+          <image src="../../../images/home/c-site.png"></image>
+          <text>武汉市CBD国际大厦A座</text>
+        </view>
+        <view class="contact-item">
+          <image src="../../../images/home/c-phone.png"></image>
+          <text>9466-9466</text>
+        </view>
+      </view>
+    </view>
+  </view>
+  <view class="tabs-box acea-row row-between">
+    <view class="tab {{tabActive == 1 ? 'tab-a' : ''}}"data-i="1" bindtap="tabClick">首页</view>
+    <view class="tab {{tabActive == 2 ? 'tab-a' : ''}}"data-i="2" bindtap="tabClick">资源</view>
+    <view class="tab {{tabActive == 3 ? 'tab-a' : ''}}" data-i="3" bindtap="tabClick">需求</view>
+  </view>
+  <view class="tab-content-box">
+    <!-- 首页 -->
+    <view class="home-box" wx:if="{{tabActive == 1}}">
+      <view class="title-box acea-row row-middle">
+        <view class="col-line"></view>
+        <text>基本信息</text>
+      </view>
+      <view class="info-box">
+        <view class="info-item acea-row-nowrap">
+          <view class="">企业名称</view>
+          <view class="colG">湖北楚牛科技有限公司</view>
+        </view>
+        <view class="info-item acea-row-nowrap">
+          <view class="">所属类型</view>
+          <view class="colG">企业</view>
+        </view>
+        <view class="info-item acea-row-nowrap">
+          <view class="">法定代表</view>
+          <view class="colG">张三</view>
+        </view>
+        <view class="info-item acea-row-nowrap">
+          <view class="">企业规模</view>
+          <view class="colG">300人</view>
+        </view>
+        <view class="info-item acea-row-nowrap">
+          <view class="">经营范围</view>
+          <view class="colG">计算机系统服务；软件开发；游戏开发；会议会展服务；广告设计；设计服务；计算机软硬件及配件、电子产品设计。</view>
+        </view>
+      </view>
+      <view class="about-box">
+        <view class="title-box acea-row row-middle">
+          <view class="col-line"></view>
+          <text>关于我们</text>
+        </view>
+        <view class="about">
+          <text class="">湖北楚牛科技有限公司成立于2010年3月，核心团队成员均来自业内相关的顶尖公司。楚牛的愿景是让我们的技术和产品能与合作伙伴一起拥抱全球化！公司法定代表人为刘戴辉，注册资本为200万元人民币，统一社会信用代码为946946946694464T，企业地址位于湖北省武汉市江汉区东风路街道蚌塘街37号航线大厦2811号，所属行业为商务服务业，经营范围包含计算机系统服务；软件开发；游戏开发；会议会展服务；广告设计；设计服务；计算机软硬件及配件、电子产品设计。</text>
+        </view>
+      </view>
+      <view class="company-show-box">
+        <view class="title-box acea-row row-middle">
+          <view class="col-line"></view>
+          <text>公司展示</text>
+        </view>
+        <view class="">
+          <swiper class='swiper-block' autoplay='true' circular='true' previous-margin='90rpx' next-margin='90rpx' current='0' bindchange='swiperChange'>
+            <block wx:key='img' wx:for='{{swiperImgUrls}}'>
+              <swiper-item class='swiper-item'>
+                <image mode='aspectFill' src='{{item}}' class='slide-image {{swiperIndex == index ? "active" : ""}}' />
+              </swiper-item>
+            </block>
+          </swiper>
+        </view>
+      </view>
+      <view class="toSite"><text>更多信息请见官网></text></view>
+    </view>
+    <!-- 资源 -->
+    <view class="resources-box" wx:if="{{tabActive == 2}}">
+      <view class="resources-list">
+        <view class="resources-item">
+          <view class="item-top acea-row-nowrap">
+            <image src="../../../images/home/welfare2.png"></image>
+            <view class="info">
+              <view class="r-title line1">教育类学校教育类学校官网网站建设官网网站建设</view>
+              <view class="r-price">资金需求:100万</view>
+              <view class="r-tips">针对中小学教育机构、课外培训辅导机构，提供官网升级优化和专业的网站建设定制化服务。</view>
+            </view>
+          </view>
+          <view class="btn-box acea-row row-middle row-between">
+            <view>
+              <view>发布日期 2021.8.30 </view>
+              <view>武汉市江汉区滨江国际A座-楚牛科技</view>
+            </view>
+            <view class="toMore-btn">了解详情</view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <!-- 需求 -->
+    <view class="needs-box" wx:if="{{tabActive == 3}}">
+      <view class="company-list">
+        <view class="company-item">
+          <view class="title-box acea-row row-between">
+            <view class="title line1">我需要公司官网设计需要公司官网设计需要公司官网设计</view>
+            <view class="price">¥20,000</view>
+          </view>
+          <view class="tags-box">
+            <view class="tag-item">网站建设</view>
+            <view class="tag-item bgG">IT软件</view>
+            <view class="tag-item bgO">APP开发</view>
+          </view>
+          <view class="desc line2">针对中小学教育机构、课外培训辅导机构。</view>
+          <view class="btn-box acea-row row-between row-middle">
+            <view class="end-time">2021.8.30截止报名</view>
+            <view class="toMore-btn">了解详情</view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
+</view>

pages/demandHall/companyDetail/index.wxss

@@ -0,0 +1,301 @@
+/* pages/demandHall/companyDetail/index.wxss */
+.top-box{
+  width: 100%;
+  height: 406rpx;
+  position: relative;
+}
+.top-bg-img{
+  width: 100%;
+  height: 406rpx;
+  position: absolute;
+  z-index: 1;
+}
+.top-bg{
+  width: 100%;
+  height: 406rpx;
+  background: rgba(0,0,0,.4);
+  position: absolute;
+  z-index: 2;
+}
+.top-content{
+  width: 100%;
+  height: 406rpx;
+  position: absolute;
+  top: 0;
+  z-index: 3;
+  color: #fff;
+  padding: 80rpx 0 0 22rpx;
+}
+.company-logo{
+  width: 150rpx;
+  height: 150rpx;
+  margin-right: 20rpx;
+}
+.name{
+  font-size: 32rpx;
+  line-height: 44rpx;
+}
+.slogan{
+  font-size: 24rpx;
+  line-height: 34rpx;
+  margin: 4rpx 0 12rpx;
+}
+.tags-box{
+  margin: 6rpx 0 10rpx;
+}
+.tag-item{
+  width: 112rpx;
+  height: 36rpx;
+  display: inline-block;
+  line-height: 36rpx;
+  text-align: center;
+  font-size: 20rpx;
+  background: linear-gradient(312deg, #FFB788 0%, #F9C8A7 100%);
+  color: #fff;
+  border-radius: 4rpx;
+  margin-right: 8rpx;
+}
+.bgG{
+  background: linear-gradient(134deg, #AEC8F6 0%, #76A6FA 100%);
+}
+.company-contact-box{
+  margin-top: 20rpx;
+}
+.contact-item{
+  display: flex;
+  align-items: center;
+  font-size: 24rpx;
+  line-height: 34rpx;
+}
+.contact-item image{
+  width: 20rpx;
+  height: 20rpx;
+  margin-right: 12rpx;
+}
+.tabs-box{
+  width: 100%;
+  padding: 18rpx 40rpx;
+  background: #fff;
+  
+box-shadow: 0px -6px 20px rgba(0, 0, 0, 0.11);
+}
+.tab{
+  width: 116rpx;
+  text-align: center;
+  font-size: 28rpx;
+  color: #BFBFBF;
+  position: relative;
+}
+.tab::after{
+  display: block;
+  content: '';
+  width: 100%;
+  height: 8rpx;
+  border-radius: 8rpx;
+  background: #FF5100;
+  position: absolute;
+  bottom: -22rpx;
+  left: 50%;
+  margin-left: -58rpx;
+  opacity: 0;
+  transform:scaleX(0);
+  transition: all .2s cubic-bezier(.18,.89,.17,.88),opacity .15s ease;
+}
+.tab-a{
+  color: #FF7942;
+}
+.tab-a::after{
+  opacity: 1;
+  transform: scaleX(1);
+}
+.tab-content-box{
+  width: 100%;
+}
+.home-box{
+  width: 100%;
+  padding-bottom: 34rpx;
+}
+.info-box,.about-box{
+  padding-bottom: 34rpx;
+  border-bottom: 2rpx solid #BFBFBF;
+}
+.title-box{
+  padding: 34rpx 40rpx;
+}
+.col-line{
+  width: 8rpx;
+  height: 36rpx;
+  background: #FF7942;
+  border-radius: 4rpx;
+  margin-right: 14rpx;
+}
+.info-item{
+  padding-left: 40rpx;
+  margin-bottom: 20rpx;
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #1D1D1D;
+}
+.colG{
+  width: 496rpx;
+  color: #707070;
+  margin-left: 56rpx;
+}
+.about{
+  padding: 0rpx 40rpx;
+}
+.about text{
+  font-size: 28rpx;
+  color: #707070;
+  line-height: 40rpx;
+}
+
+.swiper-block {
+  height: 300rpx;
+  width: 100%;
+}
+  
+.swiper-item {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  overflow: unset;
+}
+.slide-image {
+  height: 250rpx;
+  width: 520rpx;
+  border-radius: 9rpx;
+  margin: 0rpx 30rpx;
+  z-index: 1;
+}
+.active {
+  transform: scale(1.14);
+  transition: all 0.2s ease-in 0s;
+  z-index: 20;
+}
+.toSite{
+  text-align: center;
+  font-size: 24rpx;
+  color: #BFBFBF;
+  margin-top: 40rpx;
+}
+
+.resources-box,.needs-box{
+  width: 100%;
+  min-height: 1000rpx;
+  padding: 40rpx;
+  background: #EFEFEF;
+}
+.resources-item{
+  width: 100%;
+  background: #fff;
+}
+.item-top{
+  width: 100%;
+  padding: 32rpx 40rpx 18rpx;
+  border-bottom: 2rpx solid #F0F0F0;
+}
+.item-top image{
+  width: 196rpx;
+  height: 196rpx;
+  margin-right: 24rpx;
+}
+.info{
+  width: 370rpx;
+}
+.r-title{
+  color: #1D1D1D;
+  font-size: 34rpx;
+  line-height: 44rpx;
+}
+.r-price{
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #FF680C;
+  margin-top: 24rpx;
+}
+.r-tips{
+  width: 370rpx;
+  background: #EEEEEE;
+  border-radius: 8rpx;
+  padding: 4rpx 10rpx;
+  color: #ADADAD;
+  font-size: 20rpx;
+}
+.btn-box{
+  width: 100%;
+  height: 102rpx;
+  padding: 0 40rpx;
+  font-size: 20rpx;
+  line-height: 28rpx;
+  color: #A7A7A7;
+}
+.toMore-btn{
+  width: 164rpx;
+  height: 54rpx;
+  background: linear-gradient(141deg, #FFA782 0%, #FF6D31 100%);
+  border-radius: 8rpx;
+  font-size: 28rpx;
+  font-weight: bold;
+  line-height: 54rpx;
+  color: #FFFFFF;
+  text-align: center;
+}
+
+.company-list{
+  width: 100%;
+  background: #fff;
+}
+.company-item{
+  width: 100%;
+  padding: 26rpx;
+  border-bottom: 2rpx solid #EEEEEE;
+}
+.company-item .title-box{
+  padding: 0;
+}
+.title-box .title{
+  width: 430rpx;
+}
+.title-box .price{
+  margin: 0;
+  color: #FF5100;
+  line-height: 40rpx;
+  font-weight: 600;
+}
+.company-item .tags-box{
+  margin: 20rpx 0;
+}
+.company-item .tags-box .tag-item{
+  width: 112rpx;
+  height: 36rpx;
+  display: inline-block;
+  line-height: 34rpx;
+  text-align: center;
+  font-size: 20rpx;
+  border: 1rpx solid #FFAA00;
+  color: #FFAA00;
+  background: #fff;
+  border-radius: 4rpx;
+  margin-right: 8rpx;
+}
+.company-item .tags-box .bgG{
+  border: 1rpx solid #3A9EFA;
+  color: #3A9EFA;
+}
+.company-item .tags-box .bgO{
+  border: 1rpx solid #FC9367;
+  color: #FC9367;
+}
+.desc{
+  font-size: 24rpx;
+  line-height: 32rpx;
+  color: #666666;
+}
+.company-item .btn-box{
+  margin-top: 0rpx;
+  font-size: 24rpx;
+  color: #707070;
+  padding: 0;
+}

pages/demandHall/index.js

@@ -0,0 +1,89 @@
+// pages/demandHall/index.js
+const app = getApp();
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    tabbar: {},
+    active: 2,
+    tabActive: 2,
+    showScreenDialog: false
+  },
+  topTabClick(e){
+    this.setData({
+      active: e.currentTarget.dataset.i
+    })
+  },
+  tabClick(e){
+    this.setData({
+      tabActive: e.currentTarget.dataset.i
+    })
+  },
+  showDialog(){
+    this.setData({
+      showScreenDialog: true
+    })
+  },
+  finishClick(){
+    this.setData({
+      showScreenDialog: false
+    })
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    app.editTabbar();
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/demandHall/index.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "tabbar": "../../tabbarComponent/tabbar"
+  },
+  "navigationBarTitleText": "供需大厅"
+}

pages/demandHall/index.wxml

@@ -0,0 +1,139 @@
+<view class="dmandhall-page">
+  <view class="top-box acea-row row-between-wrapper">
+    <view class="top-l-box acea-row">
+      <view class="tab-item {{active == 1 ? 'tab-item-a' : ''}}" data-i="1" bindtap="topTabClick">资源供应</view>
+      <view class="tab-item {{active == 2 ? 'tab-item-a' : ''}}" data-i="2" bindtap="topTabClick">需求广场</view>
+    </view>
+    <view class="top-r-box acea-row">
+      <image src="../../images/home/search2.png"></image>
+      <image src="../../images/home/message2.png"></image>
+    </view>
+  </view>
+  <!-- 资源供应 -->
+  <view class="resource-box" wx:if="{{active == 1}}">
+    <view class="resource-tabs acea-row row-around">
+      <view class="tab {{tabActive == 1 ? 'tab-a' : ''}}"data-i="1" bindtap="tabClick">资源列表</view>
+      <view class="tab {{tabActive == 2 ? 'tab-a' : ''}}" data-i="2" bindtap="tabClick">企业列表</view>
+    </view>
+    <view class="screen-box acea-row row-between-wrapper">
+      <view class="screen-result">IT软件 · 企业网站</view>
+      <view class="screen acea-row row-middle" bindtap="showDialog">
+        <text>筛选</text>
+        <image src="../../images/home/screen.png"></image>
+      </view>
+    </view>
+    <view class="resource-list">
+      <view class="resource-item acea-row-nowrap" wx:for="{{3}}" wx:key="index" wx:if="{{tabActive == 1}}">
+        <image src="../../images/home/welfare2.png"></image>
+        <view class="resource-info">
+          <view class="title">教育类学校官网网站建设</view>
+          <view class="tags-box">
+            <view class="tag-item">网站建设</view>
+          </view>
+          <view class="desc line1">针对中小学教育机构、课外培训辅导机构。</view>
+          <view class="price">¥20,000</view>
+          <view class="company-info">
+            <text>出牛科技</text>
+            <text>武汉</text>
+          </view>
+          <view class="toMore-btn">了解详情</view>
+        </view>
+      </view>
+      <view class="resource-item acea-row-nowrap" wx:if="{{tabActive == 2}}" wx:for="{{3}}" wx:key="index">
+        <image src="../../images/home/welfare2.png"></image>
+        <view class="resource-info">
+          <view class="title">教育类学校官网网站建设</view>
+          <view class="tags-box">
+            <view class="tag-item">网站建设</view>
+            <view class="tag-item bgG">IT软件</view>
+            <view class="tag-item bgO">APP开发</view>
+          </view>
+          <view class="desc line2">针对中小学教育机构、课外培训辅导教育机构、课学教育机构、课外培训辅导教育机构、课外培训辅导机构。</view>
+          <view class="anli-list acea-row row-between">
+            <view class="anli-item acea-row row-column">
+              <image src="../../images/home/item-bg.png"></image>
+              <text>购物商城优秀资源</text>
+            </view>
+            <view class="anli-item acea-row row-column">
+              <image src="../../images/home/item-bg.png"></image>
+              <text>购物商城优秀资源</text>
+            </view>
+          </view>
+          <view class="comment">“非常有责任心” , “老板阅历和经验很丰富”,“很好”</view>
+        </view>
+      </view>
+    </view>
+  </view>
+  <!-- 企业列表 -->
+  <view class="company-list-box">
+    <view class="screen-box acea-row row-between-wrapper">
+      <view class="screen-result">IT软件 · 企业网站</view>
+      <view class="screen acea-row row-middle" bindtap="showDialog">
+        <text>筛选</text>
+        <image src="../../images/home/screen.png"></image>
+      </view>
+    </view>
+    <view class="company-list">
+      <view class="company-item">
+        <view class="title-box acea-row row-between">
+          <view class="title line1">我需要公司官网设计需要公司官网设计需要公司官网设计</view>
+          <view class="price">¥20,000</view>
+        </view>
+        <view class="tags-box">
+          <view class="tag-item">网站建设</view>
+          <view class="tag-item bgG">IT软件</view>
+          <view class="tag-item bgO">APP开发</view>
+        </view>
+        <view class="desc line2">针对中小学教育机构、课外培训辅导机构。</view>
+        <view class="btn-box acea-row row-between row-middle">
+          <view class="end-time">2021.8.30截止报名</view>
+          <view class="toMore-btn">了解详情</view>
+        </view>
+      </view>
+    </view>
+  </view>
+  <view class="mask-box" wx:if="{{showScreenDialog}}">
+    <view class="screen-dialog-box {{showScreenDialog ? 'move' : ''}}">
+      <view class="screen-list">
+        <view class="screen-item">
+          <view class="screen-title">所有服务</view>
+          <view class="acea-row">
+            <view class="item" wx:for="{{9}}" wx:key="index">IT软件</view>
+          </view>
+        </view>
+        <view class="screen-item">
+          <view class="screen-title">主题</view>
+          <view class="acea-row">
+            <view class="item" wx:for="{{9}}" wx:key="index">网站开发</view>
+          </view>
+        </view>
+        <view class="screen-item">
+          <view class="screen-title">选择城市</view>
+          <view class="acea-row">
+            <view class="item" wx:for="{{5}}" wx:key="index">武汉</view>
+          </view>
+        </view>
+        <view class="screen-item">
+          <view class="screen-title">区间价格</view>
+          <view class="price-box acea-row row-middle">
+            <view class="low-price"><input type="text" placeholder="最低价" /></view>
+            <view class="across-line"></view>
+            <view class="low-price"><input type="text" placeholder="最高价" /></view>
+          </view>
+        </view>
+        <view class="screen-item">
+          <view class="screen-title">商家身份<text class="fz20">(所有商家均实名认证)</text></view>
+          <view class="acea-row">
+            <view class="item">个人认证</view>
+            <view class="item">企业认证</view>
+          </view>
+        </view>
+        <view class="submit-box acea-row">
+          <view class="btn reset">重置</view>
+          <view class="btn finish" bindtap="finishClick">完成</view>
+        </view>
+      </view>
+    </view>
+  </view>
+  <tabbar tabbar="{{tabbar}}"></tabbar>
+</view>

pages/demandHall/index.wxss

@@ -0,0 +1,313 @@
+/* pages/demandHall/index.wxss */
+.dmandhall-page{
+  padding-bottom: 130rpx;
+  min-height: 100vh;
+  font-size: 28rpx;
+  background: #F5F5F5;
+}
+.top-box{
+  width: 100%;
+  padding: 0 40rpx;
+  background: #fff;
+}
+.top-l-box{
+
+}
+.tab-item{
+  width: 162rpx;
+  height: 40rpx;
+  line-height: 40rpx;
+  text-align: center;
+  margin-right: 12rpx;
+  font-size: 28rpx;
+  color: #BFBFBF;
+}
+.tab-item-a{
+  font-size: 36rpx;
+  color: #FF5100;
+}
+.top-r-box image{
+  width: 36rpx;
+  height: 36rpx;
+  margin-left: 30rpx;
+}
+.resource-tabs{
+  width: 100%;
+  padding-top: 40rpx;
+  background: #fff;
+  border-bottom: 2rpx solid #EEEEEE;
+}
+.tab{
+  width: 162rpx;
+  padding: 26rpx 0;
+  font-size: 28rpx;
+  color: #BFBFBF;
+  position: relative;
+}
+.tab::after{
+  display: block;
+  content: '';
+  width: 50rpx;
+  height: 16rpx;
+  border-radius: 8rpx;
+  background: #FF5100;
+  position: absolute;
+  bottom: -8rpx;
+  left: 50%;
+  margin-left: -50rpx;
+  opacity: 0;
+  transform:scaleX(0);
+  transition: all .2s cubic-bezier(.18,.89,.17,.88),opacity .15s ease;
+}
+.tab-a{
+  color: #333;
+}
+.tab-a::after{
+  opacity: 1;
+  transform: scaleX(1);
+}
+
+.screen-box{
+  width: 100%;
+  height: 94rpx;
+  padding: 0 38rpx;
+  color: #666;
+  background: #fff;
+}
+.screen-result{
+  font-size: 28rpx;
+  color: #FF5100;
+}
+.screen image{
+  width: 27rpx;
+  height: 27rpx;
+  margin-left: 6rpx;
+}
+
+.resource-list{
+  width: 100%;
+  padding: 24rpx 40rpx;
+}
+.resource-item{
+  width: 100%;
+  min-height: 302rpx;
+  background: #fff;
+  border-radius: 12rpx;
+  padding: 20rpx;
+  margin-bottom: 20rpx;
+  position: relative;
+}
+.resource-item image{
+  width: 154rpx;
+  height: 154rpx;
+  margin-right: 20rpx;
+}
+.resource-info{
+  width: calc(100% - 170rpx);
+}
+.resource-item .title{
+  font-size: 32rpx;
+  font-weight: 500;
+  line-height: 44rpx;
+  color: #1D1D1D;
+}
+.desc{
+  font-size: 24rpx;
+  color: #666666;
+  line-height: 34rpx;
+}
+.price{
+  color: #FF5100;
+  line-height: 40rpx;
+  font-weight: 600;
+  margin: 10rpx 0 40rpx;
+}
+.company-info{
+  color: #A7A7A7;
+  font-size: 24rpx;
+}
+.company-info text{
+  display: inline-block;
+  margin-right: 18rpx;
+}
+.tags-box{
+  margin: 6rpx 0 10rpx;
+}
+.tag-item{
+  width: 112rpx;
+  height: 36rpx;
+  display: inline-block;
+  line-height: 34rpx;
+  text-align: center;
+  font-size: 20rpx;
+  border: 1rpx solid #FFAA00;
+  color: #FFAA00;
+  border-radius: 4rpx;
+  margin-right: 8rpx;
+}
+.bgG{
+  border: 1rpx solid #3A9EFA;
+  color: #3A9EFA;
+}
+.bgO{
+  border: 1rpx solid #FC9367;
+  color: #FC9367;
+}
+.toMore-btn{
+  width: 164rpx;
+  height: 44rpx;
+  background: linear-gradient(141deg, #FFA782 0%, #FF6D31 100%);
+  border-radius: 8rpx;
+  font-size: 28rpx;
+  font-weight: bold;
+  line-height: 40rpx;
+  color: #FFFFFF;
+  text-align: center;
+  line-height: 44rpx;
+  position: absolute;
+  right: 20rpx;
+  bottom: 20rpx;
+}
+.anli-list{
+  font-size: 24rpx;
+  color: #666;
+  margin: 24rpx 0 20rpx;
+}
+.anli-item image{
+  width: 222rpx;
+  height: 136rpx;
+  margin-right: 0rpx;
+}
+.comment{
+  font-size: 20rpx;
+  color: #FF6D31;
+}
+.company-list-box{
+  width: 100%;
+  background: #fff;
+}
+.company-list{
+  width: 100%;
+  border-top: 2rpx solid #EEEEEE;
+}
+.company-item{
+  width: 100%;
+  padding: 40rpx;
+  border-bottom: 2rpx solid #EEEEEE;
+}
+.title-box .title{
+  width: 550rpx;
+}
+.title-box .price{
+  margin: 0;
+}
+.company-item .tags-box{
+  margin: 20rpx 0;
+}
+.btn-box{
+  margin-top: 20rpx;
+  font-size: 24rpx;
+  color: #707070;
+}
+.btn-box .toMore-btn{
+  position: static;
+}
+
+.mask-box{
+  width: 100%;
+  height: 100vh;
+  background: rgba(0,0,0,.6);
+  position:fixed;
+  top: 0;
+  left: 0;
+}
+.screen-dialog-box{
+  width: 602rpx;
+  height: 100%;
+  padding-bottom: 160rpx;
+  overflow-y: scroll;
+  background-color: #fff;
+  position: absolute;
+  top: 0;
+  right: 0rpx;
+  /* transform: translateX(800rpx); */
+  /* transition: all 1000ms ease; */
+  animation: move 200ms ease;
+}
+/* .move{
+  right: 0rpx;
+} */
+@keyframes move{
+  0%{
+    transform: translateX(800rpx);
+  }
+  100%{
+    transform: translateX(0rpx);
+  }
+}
+.screen-item{
+  width: 100%;
+  padding: 0 38rpx;
+  padding-bottom: 22rpx;
+  border-bottom: 2rpx solid #EEEEEE;
+}
+.screen-title{
+  font-size: 24rpx;
+  color: #000;
+  margin-bottom: 32rpx;
+}
+.screen-item{
+  padding-top: 40rpx;
+}
+
+.screen-item .item{
+  width: 162rpx;
+  height: 48rpx;
+  line-height: 48rpx;
+  text-align: center;
+  font-size: 24rpx;
+  color: #666666;
+  background: #F6F6F6;
+  border-radius: 4rpx;
+  margin-bottom: 20rpx;
+  margin-right: 20rpx;
+}
+.screen-item .item:nth-child(3n){
+  margin-right: 0;
+}
+.across-line{
+  width: 44rpx;
+  height: 2rpx;
+  background: #ACABAB;
+  margin: 0 12rpx;
+}
+.low-price{
+  width: 228rpx;
+  height: 60rpx;
+  background: #F6F5F5;
+  border-radius: 4rpx;
+}
+.low-price input{
+  width: 100%;
+  height: 100%;
+  text-align: center;
+}
+.fz20{
+  font-size: 20rpx;
+  color: #393939;
+}
+.submit-box{
+  width: 100%;
+  height: 100rpx;
+  box-shadow: 2rpx 0px 12rpx rgba(0, 0, 0, 0.16);
+}
+.submit-box .btn{
+  width: 50%;
+  height: 100%;
+  line-height: 100rpx;
+  text-align: center;
+}
+.submit-box .finish{
+  background: #FF660C;
+  color: #fff;
+}

pages/demandHall/needsDetail/index.js

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

pages/demandHall/needsDetail/index.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "需求详情",
+  "navigationBarBackgroundColor": "#FF5100",
+  "navigationBarTextStyle": "white"
+}

pages/demandHall/needsDetail/index.wxml

@@ -0,0 +1,75 @@
+<!--pages/demandHall/needsDetail/index.wxml-->
+<view class="needsDetail-box">
+  <view class="top-box">
+    <view class="count-down-box">10天20小时60分60秒后截止报名</view>
+    <view class="needs-info">
+      <view class="info-item">
+        <view class="item-l">需求标题:</view>
+        <view class="item-r">我需要举办大型会议的场地</view>
+      </view>
+      <view class="info-item">
+        <view class="item-l">需求类型:</view>
+        <view class="item-r">场地租赁</view>
+      </view>
+      <view class="info-item">
+        <view class="item-l">需求预算:</view>
+        <view class="item-r">10000元</view>
+      </view>
+      <view class="info-item">
+        <view class="item-l">需求描述:</view>
+        <view class="item-r">本人于十一期间（10.1-10.4）需要武汉周边能够举办百人大型会议的场地。需要酒水食品供应与住宿供应。</view>
+      </view>
+    </view>
+  </view>
+  <view class="content-box">
+    <view class="company-info-box" wx:if="{{isCompany}}">
+      <view class="title-box acea-row row-middle">
+        <view class="col-line"></view>
+        <text>发布公司</text>
+      </view>
+      <view class="company-card-box acea-row-nowrap row-middle">
+        <image src="../../../images/home/company-img.png" class="company-logo"></image>
+        <view class="info">
+          <view class="company-name">楚牛科技</view>
+          <view class="tags-box">
+            <view class="tag-item">网站建设</view>
+            <view class="tag-item bgG">IT软件</view>
+          </view>
+          <!-- <view class="slogan">让全世界全世界牛起全世界牛起全世界牛起牛起来。</view> -->
+        </view>
+      </view>
+    </view>
+    <view class="company-info-box" wx:if="{{!isCompany}}">
+      <view class="title-box acea-row row-middle">
+        <view class="col-line"></view>
+        <text>发布人</text>
+      </view>
+      <view class="company-card-box acea-row-nowrap row-middle">
+        <image src="../../../images/home/company-img.png" class="header-img"></image>
+        <view class="info">
+          <view class="user-name acea-row">
+            <view>禅易家人</view>
+            <image class="" src="../../../images/home/cyrz.png"></image>
+            <image class="tyg-tag" src="../../../images/home/tyg.png"></image>
+          </view>
+          <view class="slogan">广州·能量大使</view>
+        </view>
+      </view>
+    </view>
+    <view class="">
+      <view class="title-box mt40 acea-row row-middle">
+        <view class="col-line"></view>
+        <text>补充内容</text>
+      </view>
+    </view>
+    <view class="">
+      <view class="title-box mt40 acea-row row-middle">
+        <view class="col-line"></view>
+        <text>有关问答</text>
+      </view>
+    </view>
+  </view>
+  <view class="btn-box">
+    <view class="contact-btn">立即报名</view>
+  </view>
+</view>

pages/demandHall/needsDetail/index.wxss

@@ -0,0 +1,143 @@
+/* pages/demandHall/needsDetail/index.wxss */
+.top-box{
+  width: 100%;
+  padding: 0 40rpx 40rpx;
+  background: linear-gradient(180deg, #FF5100 0%, #FFA782 100%);
+}
+.count-down-box{
+  text-align: right;
+  color: #FFFFFF;
+  font-size: 24rpx;
+  padding: 30rpx 0;
+}
+.needs-info{
+  width: 100%;
+  padding: 24rpx 20rpx;
+  background: #fff;
+  font-size: 28rpx;
+  color: #1D1D1D;
+  line-height: 34rpx;
+  border-radius: 12rpx;
+}
+.info-item{
+  display: flex;
+  align-items: top;
+  margin-bottom: 20rpx;
+}
+.item-l{
+  color: #707070;
+}
+.item-r{
+  width: 484rpx;
+  margin-left: 16rpx;
+}
+.content-box{
+  width: 100%;
+  padding: 40rpx;
+}
+.tag{
+  width: 216rpx;
+  height: 48rpx;
+  line-height: 48rpx;
+  text-align: center;
+  font-size: 24rpx;
+  color: #fff;
+  background: linear-gradient(314deg, #FF5100 0%, #FF8800 100%);
+  border-radius: 8rpx;
+  margin: 16rpx 0;
+}
+.col-line{
+  width: 8rpx;
+  height: 36rpx;
+  background: #FF7942;
+  border-radius: 4rpx;
+  margin-right: 14rpx;
+}
+
+.colG{
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #707070;
+  margin-left: 20rpx;
+}
+.mt40{
+  margin-top: 40rpx;
+}
+.company-card-box {
+  padding: 30rpx 12rpx;
+  margin-top: 34rpx;
+  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);
+}
+.company-logo{
+  width: 150rpx;
+  height: 150rpx;
+  margin-right: 20rpx;
+}
+.name{
+  font-size: 32rpx;
+  line-height: 44rpx;
+}
+.slogan{
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #666;
+  margin: 4rpx 0 12rpx;
+}
+.tags-box{
+  margin: 6rpx 0 10rpx;
+}
+.tag-item{
+  width: 112rpx;
+  height: 36rpx;
+  display: inline-block;
+  line-height: 36rpx;
+  text-align: center;
+  font-size: 20rpx;
+  background: linear-gradient(312deg, #FFB788 0%, #F9C8A7 100%);
+  color: #fff;
+  border-radius: 4rpx;
+  margin-right: 8rpx;
+}
+.bgG{
+  background: linear-gradient(134deg, #AEC8F6 0%, #76A6FA 100%);
+}
+.user-name{
+
+}
+.header-img{
+  width: 120rpx;
+  height: 120rpx;
+  border-radius: 50%;
+  margin-right: 20rpx;
+}
+.user-name image{
+  width: 134rpx;
+  height: 38rpx;
+  margin-left: 12rpx;
+}
+.user-name .tyg-tag{
+  width: 164rpx;
+}
+.btn-box{
+  width: 100%;
+  height: 150rpx;
+  line-height: 150rpx;
+  align-self: center;
+  background: #fff;
+  border-top: 1rpx solid #ececec;
+  text-align: right;
+  padding-right: 52rpx;
+  position: fixed;
+  bottom: 0;
+}
+.contact-btn{
+  display: inline-block;
+  width: 240rpx;
+  height: 88rpx;
+  text-align: center;
+  line-height: 88rpx;
+  background: linear-gradient(134deg, #FFA782 0%, #FF6D31 100%);
+  border-radius: 12rpx;
+  font-size: 32rpx;
+  color: #fff;
+}

pages/demandHall/resourcesDetail/index.js

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

pages/demandHall/resourcesDetail/index.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "资源详情"
+}

pages/demandHall/resourcesDetail/index.wxml

@@ -0,0 +1,53 @@
+<!--pages/demandHall/resourcesDetail/index.wxml-->
+<view class="resourcesDetail-page">
+  <view class="img-box">
+    <image src="../../../images/home/company-top-bg.png" mode="aspectFill"></image>
+  </view>
+  <view class="detail-box">
+    <view class="r-name">教育类学校官网网站建设</view>
+    <view class="tag">IT开发·网站建设</view>
+    <view class="title-box acea-row row-middle">
+      <view class="col-line"></view>
+      <text>基本信息</text>
+    </view>
+    <view class="info-box">
+      <view class="info-item acea-row-nowrap">
+        <view class="label">标题</view>
+        <view class="colG">教育类学校官网网站建设</view>
+      </view>
+      <view class="info-item acea-row-nowrap">
+        <view class="label">资金需求</view>
+        <view class="colG">100万~150万</view>
+      </view>
+    </view>
+    <view class="title-box mt40 acea-row row-middle">
+      <view class="col-line"></view>
+      <text>发布信息</text>
+    </view>
+    <view class="company-card-box acea-row-nowrap">
+      <image src="../../../images/home/company-img.png" class="company-logo"></image>
+      <view class="info">
+        <view class="company-name">楚牛科技</view>
+        <view class="tags-box">
+          <view class="tag-item">网站建设</view>
+          <view class="tag-item bgG">IT软件</view>
+        </view>
+        <view class="slogan">让全世界全世界牛起全世界牛起全世界牛起牛起来。</view>
+      </view>
+    </view>
+    <view class="title-box mt40 acea-row row-middle">
+      <view class="col-line"></view>
+      <text>详细描述</text>
+    </view>
+    <view class="desc-box">
+      <text>湖北楚牛科技有限公司成立于2010年3月，核心团队成员均来自业内相关的顶尖公司。楚牛的愿景是让我们的技术和产品能与合作伙伴一起拥抱全球化！\n\n\n本项目仅为有网站建设需求的中小学教育机构、幼儿课外培训辅导机构提供服务，对网站业务人群存在要求。本公司也提供其他业务，请另咨询客服。</text>
+    </view>
+    <view class="title-box mt40 acea-row row-middle">
+      <view class="col-line"></view>
+      <text>补充内容</text>
+    </view>
+  </view>
+  <view class="btn-box">
+    <view class="contact-btn">立即沟通</view>
+  </view>
+</view>

pages/demandHall/resourcesDetail/index.wxss

@@ -0,0 +1,127 @@
+/* pages/demandHall/resourcesDetail/index.wxss */
+.resourcesDetail-page{
+  padding-bottom: 150rpx;
+  position: relative;
+}
+.btn-box{
+  width: 100%;
+  height: 150rpx;
+  line-height: 150rpx;
+  align-self: center;
+  background: #fff;
+  border-top: 1rpx solid #ececec;
+  text-align: right;
+  padding-right: 52rpx;
+  position: fixed;
+  bottom: 0;
+}
+.contact-btn{
+  display: inline-block;
+  width: 240rpx;
+  height: 88rpx;
+  text-align: center;
+  line-height: 88rpx;
+  background: linear-gradient(134deg, #FFA782 0%, #FF6D31 100%);
+  border-radius: 12rpx;
+  font-size: 32rpx;
+  color: #fff;
+}
+.img-box{
+  width: 100%;
+  height: 392rpx;
+}
+.img-box image{
+  width: 100%;
+  height: 100%;
+}
+.detail-box{
+  padding: 34rpx 40rpx;
+}
+.r-name{
+  font-size: 40rpx;
+  line-height: 56rpx;
+  color: #1D1D1D;
+}
+.tag{
+  width: 216rpx;
+  height: 48rpx;
+  line-height: 48rpx;
+  text-align: center;
+  font-size: 24rpx;
+  color: #fff;
+  background: linear-gradient(314deg, #FF5100 0%, #FF8800 100%);
+  border-radius: 8rpx;
+  margin: 16rpx 0;
+}
+.col-line{
+  width: 8rpx;
+  height: 36rpx;
+  background: #FF7942;
+  border-radius: 4rpx;
+  margin-right: 14rpx;
+}
+.info-item{
+  margin-top: 20rpx;
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #1D1D1D;
+}
+.label{
+  width: 144rpx;
+}
+.colG{
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #707070;
+  margin-left: 20rpx;
+}
+.mt40{
+  margin-top: 40rpx;
+}
+.company-card-box {
+  padding: 30rpx 12rpx;
+  margin-top: 34rpx;
+  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);
+}
+.company-logo{
+  width: 150rpx;
+  height: 150rpx;
+  margin-right: 20rpx;
+}
+.name{
+  font-size: 32rpx;
+  line-height: 44rpx;
+}
+.slogan{
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #666;
+  margin: 4rpx 0 12rpx;
+}
+.tags-box{
+  margin: 6rpx 0 10rpx;
+}
+.tag-item{
+  width: 112rpx;
+  height: 36rpx;
+  display: inline-block;
+  line-height: 36rpx;
+  text-align: center;
+  font-size: 20rpx;
+  background: linear-gradient(312deg, #FFB788 0%, #F9C8A7 100%);
+  color: #fff;
+  border-radius: 4rpx;
+  margin-right: 8rpx;
+}
+.bgG{
+  background: linear-gradient(134deg, #AEC8F6 0%, #76A6FA 100%);
+}
+.desc-box{
+  /* padding: 0rpx 40rpx; */
+  margin-top: 34rpx;
+}
+.desc-box text{
+  font-size: 28rpx;
+  color: #707070;
+  line-height: 40rpx;
+}

pages/index/index.js

@@ -4,61 +4,36 @@ const app = getApp()
 
 Page({
   data: {
-    motto: 'Hello World',
+    tabbar: {},
-    userInfo: {},
+    menuList:[
-    hasUserInfo: false,
+      { icon:'../../images/home/menu1.png',text: 'IT制作'},
-    canIUse: wx.canIUse('button.open-type.getUserInfo'),
+      { icon:'../../images/home/menu2.png', text: 'logo设计' },
-    canIUseGetUserProfile: false,
+      { icon:'../../images/home/menu3.png', text: '文案策划' },
-    // canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName') // 如需尝试获取用户信息可改为false
+      { icon:'../../images/home/menu4.png', text: 'app开发' },
-		canIUseOpenData:false
+      { icon:'../../images/home/menu5.png', text: '装修服务' },
+      { icon:'../../images/home/menu6.png', text: '软件定制' },
+      { icon:'../../images/home/menu7.png', text: '法律服务' },
+      { icon:'../../images/home/menu8.png', text: '小程序' },
+      { icon:'../../images/home/menu9.png', text: '网络营销' },
+      { icon:'../../images/home/menu10.png', text: '全部分类' }
+    ],
+    CustomBar: app.globalData.CustomBar,
+    menuHeight: app.globalData.menuHeight,
+    navHeight: app.globalData.navHeight,
+    menuTop: app.globalData.menuTop,
+    active: 2
   },
   onLoad() {
-    if (wx.getUserProfile) {
+    app.editTabbar();
-      this.setData({
-        canIUseGetUserProfile: true
-      })
-    }
   },
-  getUserProfile(e) {
+  tabClick(e){
-    // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认，开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
+    this.setData({
-    wx.getUserProfile({
+      active: e.currentTarget.dataset.i
-      desc: '展示用户信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
-      success: (response) => {
-        console.log('response',response)
-				wx.login({
-				  success: res => {
-				    // 发送 res.code 到后台换取 openId, sessionKey, unionId
-				    console.log('code:',res.code)
-						let data = {
-							code: res.code,
-							iv: response.iv,
-							encryptedData:response.encryptedData,
-							spread: 0,
-							login_type: 0
-						}
-				    app.http('POST','wxapp/auth',data).then(
-				      result =>{
-				        if(result.data.isSuccess){
-				          wx.setStorageSync('token', 'Bearer '+ result.data.data.token);
-				        } else{
-				          wx.showToast({
-				            title: result.data.msg,
-				            icon : 'none'
-				          })
-				        }
-				      } 
-				    )
-				  }
-				})
-      }
     })
   },
-  getUserInfo(e) {
+  toTab2(){
-    // 不推荐使用getUserInfo获取用户信息，预计自2021年4月13日起，getUserInfo将不再弹出弹窗，并直接返回匿名的用户个人信息
+    wx.switchTab({
-    console.log('e',e)
+      url: '/pages/demandHall/index',
-    this.setData({
-      userInfo: e.detail.userInfo,
-      hasUserInfo: true
     })
-  }
+  },
 })

pages/index/index.json

@@ -1,3 +1,6 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "tabbar": "../../tabbarComponent/tabbar"
+  },
+  "navigationStyle": "custom"
 }

pages/index/index.wxml

@@ -1,23 +1,152 @@
-<!--index.wxml-->
+<view class="home-page">
-<view class="container">
+  <view class="page-top-box">
-  <view class="userinfo">
+    <image src="../../images/home/top-bg.png" class="top-bg"></image>
-    <block wx:if="{{canIUseOpenData}}">
+    <view class="page-title" style="top:{{menuTop}}px;height:{{menuHeight}}px;line-height: {{menuHeight}}px;">禅意云生态</view>
-      <view class="userinfo-avatar" bindtap="bindViewTap">
+    <view class="top-box-content" style="top: {{CustomBar + menuHeight}}rpx;">
-        <open-data type="userAvatarUrl"></open-data>
+      <view class="search-box acea-row row-between-wrapper">
+        <view class="localtion-box acea-row row-middle">
+          <image src="../../images/home/localtion.png"></image>
+          <text>定位</text>
+        </view>
+        <view class="search acea-row row-middle">
+          <image src="../../images/home/search.png"></image>
+          <text>大家都在搜 APP开发</text>
+        </view>
+        <image class="message-icon" src="../../images/home/message.png"></image>
       </view>
-      <open-data type="userNickName"></open-data>
+      <view class="home-menu-box">
-    </block>
+        <view class="menu-list acea-row row-between">
-    <block wx:elif="{{!hasUserInfo}}">
+          <view class="menu-item acea-row row-column row-middle" wx:for="{{menuList}}" wx:key="index">
-      <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
+            <image src="{{item.icon}}"></image>
-      <button wx:elif="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
+            <text>{{item.text}}</text>
-      <view wx:else> 请使用1.4.4及以上版本基础库 </view>
+          </view>
-    </block>
+        </view>
-    <block wx:else>
+      </view>
-      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
+    </view>
-      <text class="userinfo-nickname">{{userInfo.nickName}}</text>
+  </view>
-    </block>
+  <!-- 招商会 -->
+  <view class="investment-box">
+    <view class="investment-title-box acea-row row-between-wrapper">
+      <view class="acea-row">
+        <text class="fz32">2021秋季招商会</text>
+        <view class="hot">热</view>
+      </view>
+      <view class="more acea-row row-middle">
+        <text>全部</text>
+        <image src="../../images/home/arrow-r.png"></image>
+      </view>
+    </view>
+    <view class="investement-list">
+      <scroll-view class="scroll-view_H" scroll-x="true">
+        <view class="investment-item" wx:for="{{4}}" wx:key="index">
+          <image class="item-bg" src="../../images/home/item-bg.png"></image>
+          <view class="tips-box acea-row row-right">
+            <view class="tips-item">人工智能</view>
+            <view class="tips-item bg2">人工智能</view>
+          </view>
+          <view class="item-info-box acea-row row-column row-center">
+            <view class="address-box">
+              <image src="../../images/home/localtion.png"></image>
+              <text>武汉国际会展中心</text>
+            </view>
+            <view class="time-box">
+              <image src="../../images/home/time.png"></image>
+              <text>2021.07.31 - 2022-11-30</text>
+            </view>
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+  </view>
+  <!-- 尊享福利 -->
+  <view class="welfare-box">
+    <view class="welfare-title">尊享福利</view>
+    <view class="welfare-list-box">
+      <scroll-view class="scroll-view_H" scroll-x="true">
+        <view class="welfare-item" wx:for="{{3}}" wx:key="index">
+          <view class="item-box acea-row">
+            <image src="../../images/home/welfare1.png"></image>
+            <view class="welfare-info-box acea-row row-column row-between">
+              <view>
+                <view class="w-name">保时捷Porsche-Panamera 4S E-Hybrid 行政加长版</view>
+                <view class="w-address">武汉光谷保时捷中心</view>
+              </view>
+              <view>
+                <view class="w-price">140万</view>
+                <view class="w-oldPrice">市场价约为￥157万</view>
+              </view>
+            </view>
+            <view class="buy-btn">立即抢购</view>
+          </view>
+          <view class="item-box acea-row">
+            <image src="../../images/home/welfare2.png"></image>
+            <view class="welfare-info-box acea-row row-column row-between">
+              <view>
+                <view class="w-name">保时捷Porsche-Panamera 4S E-Hybrid 行政加长版</view>
+                <view class="w-address">武汉光谷保时捷中心</view>
+              </view>
+              <view>
+                <view class="w-price">140万</view>
+                <view class="w-oldPrice">市场价约为￥157万</view>
+              </view>
+            </view>
+            <view class="buy-btn">立即抢购</view>
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+  </view>
+  <!-- 供需模块 -->
+  <view class="demandhall-box">
+    <view class="tabs-box acea-row row-between-wrapper">
+      <view class="tab-item {{active == 1 ? 'tab-item-a' : ''}}" data-i="1" bindtap="tabClick">最新供应</view>
+      <view class="tab-item {{active == 2 ? 'tab-item-a' : ''}}" data-i="2" bindtap="tabClick">需求广场</view>
+      <view class="tab-item {{active == 3 ? 'tab-item-a' : ''}}" data-i="3" bindtap="tabClick">金牌投资人</view>
+    </view>
+    <view class="list-box" wx:if="{{active == 1}}">
+      <view class="item">
+        <view class="item-top">
+          <view class="project-name">公司企业网站建设 wab网站...</view>
+          <view class="tag">IT软件·网站建设</view>
+          <view class="desc">可在现有网站基础上进行界面与功能的优化升级，多种视觉风格可供挑选。</view>
+          <view class="buy-btn">了解详情</view>
+       </view>
+        <view class="company-box acea-row">
+          <image src="../../images/home/company-img.png"></image>
+          <view class="company-info acea-row row-column row-between">
+            <view class="company-name fz28">焦点科技</view>
+            <view class="company-name fz24">成为奋斗者的家园</view>
+            <view class="tags-box acea-row">
+              <view class="tag-item fz20">网站建设</view>
+              <view class="tag-item fz20 bgG">网站建设</view>
+              <view class="tag-item fz20 bgO">网站建设</view>
+            </view>
+          </view>
+          <view class="into-btn acea-row row-center-wrapper">
+            <image src="../../images/home/company-icon.png"></image>
+            <text>进入企业</text>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="list-box" wx:if="{{active == 2}}">
+      <view class="item">
+        <view class="item-top">
+          <view class="project-name">公司企业网站建设 wab网站...</view>
+          <view class="desc">可在现有网站基础上进行界面与功能的优化升级，多种视觉风格可供挑选。</view>
+          <view class="tags-box tags-box2 acea-row">
+              <view class="tag-item fz20">网站建设</view>
+              <view class="tag-item fz20 bgG">网站建设</view>
+              <view class="tag-item fz20 bgO">网站建设</view>
+            </view>
+          <view class="price">¥20,000</view>
+       </view>
+      </view>
+    </view>
   </view>
-  <view class="usermotto">
+  <view class="to-demandhall acea-row row-center row-middle" bindtap="toTab2">
-    <text class="user-motto">{{motto}}</text>
+    <text>更多内容去供需大厅</text>
+    <image src="../../images/home/arrow-r.png"></image>
   </view>
+  <tabbar tabbar="{{tabbar}}"></tabbar>
 </view>

pages/index/index.wxss

@@ -1,19 +1,380 @@
-/**index.wxss**/
+
-.userinfo {
+.home-page{
-  display: flex;
+  padding-bottom: 130rpx;
-  flex-direction: column;
+}
-  align-items: center;
+.page-top-box{
-  color: #aaa;
+  width: 100%;
+  height: 598rpx;
+  position: relative;
+}
+.page-title{
+  width: 100%;
+  color: #fff;
+  text-align: center;
+  position: relative;
+}
+.top-bg{
+  width: 100%;
+  height: 598rpx;
+  position: absolute;
+}
+.top-box-content{
+  position: relative;
+}
+.search-box{
+  color: #fff;
+  font-size: 32rpx;
+  padding: 0 60rpx 0 40rpx;
+}
+.localtion-box image{
+  width: 26rpx;
+  height: 31rpx;
+  margin-right: 10rpx;
+}
+.search{
+  width: 448rpx;
+  height: 68rpx;
+  font-size: 28rpx;
+  padding: 16rpx 20rpx;
+  background: rgba(255, 255, 255, 0.38);
+  border-radius: 8rpx;
+}
+.search image{
+  width: 35rpx;
+  height: 35rpx;
+  margin-right: 16rpx;
+}
+.message-icon{
+  width: 36rpx;
+  height: 36rpx;
+}
+.home-menu-box{
+  width: 670rpx;
+  height: 286rpx;
+  background: #FFFFFF;
+  box-shadow: 0px 6rpx 20rpx rgba(151, 69, 34, 0.28);
+  border-radius: 12rpx;
+  margin: 38rpx auto 0;
+  padding: 42rpx;
+}
+.menu-list{
+  color: #1D1D1D;
+  font-size: 24rpx;
+}
+.menu-item{
+  width: 98rpx;
+  margin-right:16rpx;
+  margin-bottom: 34rpx;
+}
+.menu-item:nth-child(5n){
+  margin-right: 0;
+}
+.menu-item image{
+  width: 52rpx;
+  height: 52rpx;
+}
+
+.investment-box{
+  width: 100%;
+  padding-left: 40rpx;
+}
+.investment-title-box{
+  width: 100%;
+  padding-right: 40rpx;
+}
+.fz32{
+  font-size: 32rpx;
+  color: #1D1D1D;
+}
+.hot{
+  width: 26rpx;
+  height: 26rpx;
+  text-align: center;
+  line-height: 26rpx;
+  background: linear-gradient(147deg, #FB7E4A 0%, #FF5100 100%);
+  border-radius: 8rpx 0px 8rpx 0px;
+  font-size: 18rpx;
+  color: #fff;
+  margin-left: 16rpx;
+}
+.more{
+  font-size: 24rpx;
+  color: #999999;
+}
+.more image{
+  width: 9rpx;
+  height: 16rpx;
+  margin-left: 12rpx;
+  margin-top: 2rpx;
+}
+.investement-list{
+  width: 100%;
+  margin-top: 34rpx;
+}
+.scroll-view_H{
+  white-space: nowrap;
+  width: 100%;
+}
+.investment-item{
+  display: inline-block;
+  width: 324rpx;
+  height: 408rpx;
+  margin-right:20rpx;
+  box-shadow: 0px 6rpx 12rpx rgba(0, 0, 0, 0.16);
+  border-radius: 8rpx;
+  position: relative;
+}
+.investment-item .item-bg{
+  width: 324rpx;
+  height: 408rpx;
+  position: absolute;
+}
+.tips-box{
+  position: relative;
+  top: 20rpx;
+}
+.tips-item{
+  padding: 6rpx 10rpx;
+  line-height: 28rpx;
+  font-size: 20rpx;
+  color: #fff;
+  background: rgba(255, 81, 0, 0.63);
+  border-radius: 8rpx;
+  margin-right: 14rpx;
+}
+.bg2{
+  background: rgba(255, 170, 0, 0.63);
+}
+.item-info-box{
+  width: 300rpx;
+  height: 102rpx;
+  background: rgba(255, 255, 255, 0.8);
+  box-shadow: 0px 6rpx 12rpx rgba(0, 0, 0, 0.2);
+  border-radius: 8rpx;
+  position: absolute;
+  bottom: 18rpx;
+  left: 50%;
+  margin-left: -150rpx;
+  font-size: 22rpx;
+  color: #404040;
+}
+.item-info-box image{
+  width: 14rpx;
+  height: 17rpx;
+  margin: 0 12rpx 0 12rpx;
 }
 
-.userinfo-avatar {
+.welfare-box{
+  width: 100%;
+  padding-left: 40rpx;
+  margin-top: 52rpx;
+}
+.welfare-title{
+  font-size: 32rpx;
+  color: #1D1D1D;
+  margin-bottom: 38rpx;
+}
+.welfare-list-box{
+  width: 100%;
+}
+.welfare-item{
+  display: inline-block;
+  margin-right: 6rpx;
+  padding: 12rpx;
+}
+.item-box{
+  width: 650rpx;
+  height: 248rpx;
+  background: #FFFFFF;
+  box-shadow: 0px 0rpx 12rpx rgba(0, 0, 0, 0.16);
+  padding: 22rpx 16rpx;
+  border-radius: 12rpx;
+  margin-bottom: 20rpx;
+  position: relative;
+}
+.buy-btn{
+  width: 144rpx;
+  height: 52rpx;
+  text-align: center;
+  line-height: 52rpx;
+  background: linear-gradient(315deg, #FB966C 0%, #FFC2AA 100%);
+  border-radius: 12rpx;
+  color: #fff;
+  font-size: 24rpx;
+  position: absolute;
+  bottom: 30rpx;
+  right: 30rpx;
+}
+.item-box image{
+  width: 198rpx;
+  height: 204rpx;
+  margin-right: 12rpx;
+}
+.welfare-info-box{
+  width: 394rpx;
+}
+.w-name{
+  width: 390rpx;
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #1D1D1D;
+  overflow: hidden;
+  text-overflow: ellipsis; 
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+.w-address{
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #707070;
+  margin: 8rpx 0 14rpx;
+}
+.w-price{
+  font-size: 28rpx;
+  font-weight: bold;
+  line-height: 40rpx;
+  color: #FF7942;
+}
+.w-oldPrice{
+  font-size: 20rpx;
+  color: #BCBCBC;
+  text-decoration: line-through;
+}
+
+.demandhall-box{
+  width: 100%;
+  padding: 40rpx;
+}
+.tabs-box{
+  padding-left: 30rpx;
+  padding-right: 12rpx;
+}
+.tab-item{
+  font-size: 28rpx;
+  color: #9C9C9C;
+  padding-bottom: 8rpx;
+}
+.tab-item-a{
+  color: #1D1D1D;
+  border-bottom: 4rpx solid #FF7942;
+}
+.list-box{
+  width: 100%;
+  margin-top: 36rpx;
+}
+.item{
+  width: 670rpx;
+  background: #FFFFFF;
+  box-shadow: 0px 6rpx 12rpx rgba(190, 190, 190, 0.3);
+  border-radius: 12rpx;
+  padding: 28rpx 20rpx 18rpx;
+}
+.item-top{
+  padding-bottom: 24rpx;
+  position: relative;
+}
+.project-name{
+  width: 400rpx;
   overflow: hidden;
+  text-overflow: ellipsis; 
+  display: -webkit-box;
+  font-size: 28rpx;
+  line-height: 40rpx;
+  color: #1D1D1D;
+}
+.tags-box2{
+  margin-top: 12rpx;
+}
+.price{
+  color: #FF5100;
+  font-size: 28rpx;
+  position: absolute;
+  top: 0;
+  right: 0rpx;
+}
+.tag{
+  color: #74BDF7;
+  font-size: 20rpx;
+  line-height: 28rpx;
+  margin: 12rpx 0 20rpx;
+}
+.desc{
+  font-size: 24rpx;
+  line-height: 34rpx;
+  color: #666666;
+}
+.company-box{
+  padding-top: 12rpx;
+  position: relative;
+
+  border-top: 2rpx solid #ECECEC;
+}
+.company-box image{
   width: 128rpx;
   height: 128rpx;
-  margin: 20rpx;
-  border-radius: 50%;
 }
-
+.fz28{
-.usermotto {
+  font-size: 28rpx;
-  margin-top: 200px;
+  line-height: 40rpx;
+  color: #1D1D1D;
+}
+.fz24{
+  font-size: 24rpx;
+  line-height: 34rpx;
+}
+.fz20{
+  font-size: 20rpx;
+  line-height: 28rpx;
+}
+.company-info{
+  margin-left: 12rpx;
+}
+.item-top .buy-btn{
+  top: 0;
+}
+.into-btn{
+  font-size: 20rpx;
+  color: #FF5100;
+  width: 144rpx;
+  height: 40rpx;
+  border: 1rpx solid #FF5100;
+  opacity: 1;
+  border-radius: 20rpx;
+  position: absolute;
+  top: 18rpx;
+  right: 0rpx;
+}
+.into-btn image{
+  width: 21rpx;
+  height: 19rpx;
+  margin-right: 6rpx;
+}
+.tag-item{
+  width: 112rpx;
+  height: 36rpx;
+  line-height: 34rpx;
+  text-align: center;
+  border: 1rpx solid #FFAA00;
+  color: #FFAA00;
+  border-radius: 4rpx;
+  margin-right: 8rpx;
+}
+.bgG{
+  border: 1rpx solid #3A9EFA;
+  color: #3A9EFA;
+}
+.bgO{
+  border: 1rpx solid #FC9367;
+  color: #FC9367;
+}
+.to-demandhall{
+  font-size: 28rpx;
+  color: #A7A7A7;
+  margin-bottom: 28rpx;
+}
+.to-demandhall image{
+  width: 13rpx;
+  height: 23rpx;
+  margin-left: 15rpx;
 }