06-02 01点28分

app.wxss

@@ -68,3 +68,21 @@
   font-size: 32rpx;
   color: #FFFFFF;
 }
+
+.see{
+  font-size: 24rpx;
+  color: #036EF3;
+  text-decoration: underline;
+}
+
+.ycj{
+  background-color: #FF652F;
+}
+
+.wcj{
+  background-color: #666A7A;
+}
+
+.gsz{
+  background-color: #02D775;
+}

custom-tab-bar/index.wxml

@@ -7,7 +7,7 @@
     <image src="{{selected === index ? item.selectedIconPath : item.iconPath}}" wx:if="{{item.text!=='首页'}}">
     </image>
     <image class="tab-index" src="{{item.selectedIconPath}}" wx:else></image>
-    <view style="color: {{selected === index ? selectedColor : color}}" wx:if="{{item.text!=='首页'}}">
+    <view class="tab-title" style="color: {{selected === index ? selectedColor : color}}" wx:if="{{item.text!=='首页'}}">
       {{item.text}}</view>
   </view>
 </view>

custom-tab-bar/index.wxss

@@ -45,7 +45,7 @@
   padding-bottom: 10rpx;
 }
 
-.tab-bar-item view {
+.tab-title{
-  font-size: 10px;
+  font-size: 22rpx;
-  line-height: 25px;
+  line-height: 72rpx;
 }

pages/calendar/calendar.js

@@ -1,10 +1,21 @@
 // pages/calendar/calendar.js
+const moment = require('../../utils/moment.min');
+moment.locale('en', {
+  longDateFormat: {
+    l: "YYYY-MM-DD",
+    L: "YYYY/MM/DD",
+  }
+});
+import {formatNumber} from '../../utils/util'
 Page({
 
   /**
    * 页面的初始数据
    */
   data: {
+    tabList: [{id:1,name:'本日挂牌'},{id:2,name:'本日拍卖'}],
+    timer:'',
+    active: 1,
     loading: false,
     color: '#000',
     background: '#f8f8f8',
@@ -12,18 +23,12 @@ Page({
     animated: false,
     isCalendarShow: 'block',
     calendarDisplayMonthNum: 1,
-    calendarDisplayTime: '2021-05',
+    calendarDisplayTime: '',
     calendarSelectedDate: new Date().toString(),
     calendarSelectedDateStr: '',
     region: ["500000", "500100"],
     cityName: '重庆',
-    list:[{
-      lable:'本日挂牌',
-      info:[{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'}]
-    },{
-      lable:'本日拍卖',
     info:[{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'},{id:1,name:'CQ210001'}]
-    }]
   },
 
   bindDateChange(res){
@@ -32,6 +37,12 @@ Page({
       calendarDisplayTime
     })
   },
+  tabDowm(e){
+    let active = e.currentTarget.dataset.id
+    if(active!==this.data.active){
+      this.setData({active})
+    }
+  },
   backToday(){
     let timer = new Date()
     let year = timer.getFullYear()
@@ -58,7 +69,9 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
-
+    this.backToday()
+    let timer =moment().format('L')
+    this.setData({timer})
   },
 
   /**
@@ -116,6 +129,8 @@ Page({
   },
 
   onCalendarDayTap(res){
-    let detail = res.detail;
+    let timer = res.detail;
+    timer = `${timer.year}/${formatNumber(timer.month)}/${formatNumber(timer.day)}`
+    this.setData({timer})
   }
 })

pages/calendar/calendar.wxml

@@ -43,12 +43,19 @@
         </view>
       </view>
     </view>
+    <view class="tab">
+      <view class="tab-item {{item.id===active?'active':''}}" wx:for="{{tabList}}" wx:for-index="i" wx:for-item="item"
+        wx:key="id" bindtap="tabDowm" data-id="{{item.id}}">
+        <text class="tab-title">{{item.name}}</text>
+        <image class="tab-tag" src="../../assets/images/tab-tag.png"></image>
+      </view>
+    </view>
     <!-- 展示部分 -->
     <view class="list">
-      <view class="item" wx:key="i" wx:for="{{list}}" wx:for-index="i" wx:for-item="ele">
+      <view class="item">
-        <text class="lable">{{ele.lable}}</text>
+        <text class="lable">{{timer}}</text>
         <view class="info">
-          <text class="info-item" wx:key="id" wx:for="{{ele.info}}" wx:for-index="id"
+          <text class="info-item" wx:key="id" wx:for="{{info}}" wx:for-index="id"
             wx:for-item="item">{{item.name}}</text>
         </view>
       </view>

pages/calendar/calendar.wxss

@@ -92,26 +92,60 @@
 }
 
 .item .lable {
-  font-size: 30rpx;
+  font-size: 32rpx;
   font-weight: bold;
-  color: #F69F06;
+  padding: 0 20rpx;
-}
+  line-height: 42rpx;
-
+  background: #FFCC00;
-.item:last-of-type .lable{
+  border-radius: 4rpx;
-  color: #37F492;
+  color: #ffffff;
 }
 
 .list .info {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
+  padding-top: 30rpx;
 }
 
 .list .info-item {
-  padding: 30rpx;
+  padding: 0 30rpx;
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #646464;
+  line-height: 80rpx;
+}
+
+.tab {
+  display: flex;
+  align-items: center;
+  padding: 0 30rpx;
+}
+
+.tab-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-right: 54rpx;
+}
+
+.tab-title {
   font-size: 30rpx;
   font-weight: bold;
-  color: #838B99;
+  color: #565A6B;
-  line-height: 36rpx;
+}
-  height: 36rpx;
+
+.tab-tag {
+  width: 44rpx;
+  height: 10rpx;
+  display: none;
+}
+
+.active .tab-title {
+  font-size: 34rpx;
+  color: #262936;
+}
+
+.active .tab-tag {
+  display: block;
 }

pages/index/index.wxss

@@ -76,18 +76,6 @@
   margin-top: 10rpx;
 }
 
-.ycj{
-  background-color: #FF652F;
-}
-
-.wcj{
-  background-color: #666A7A;
-}
-
-.gsz{
-  background-color: #02D775;
-}
-
 .list-timer{
   margin-top: 10rpx;
   font-size: 26rpx;

pages/look/look.js

@@ -5,7 +5,15 @@ Page({
    * 页面的初始数据
    */
   data: {
+    tabList: [{id:1,name:'公告信息'},{id:2,name:'成交信息'},{id:3,name:'呈现项目'}],
+    active: 1,
+  },
 
+  tabDowm(e){
+    let active = e.currentTarget.dataset.id
+    if(active!==this.data.active){
+      this.setData({active})
+    }
   },
 
   /**

pages/look/look.wxml

@@ -1,4 +1,150 @@
 <!--pages/look/look.wxml-->
+<wxs module="filter">
+  var setTag = function(state) {
+  var obj = {}
+  if(state===1){
+  obj = {
+  sname:'ycj',
+  text:'已成交'
+  }
+  }else if(state===2){
+  obj = {
+  sname:'wcj',
+  text:'未成交'
+  }
+  }else{
+  obj = {
+  sname:'gsz',
+  text:'公示中'
+  }
+  }
+  return obj
+  };
+  module.exports = {setTag:setTag};
+</wxs>
 <view class="pages">
+  <mp-navigation-bar ext-class="set-bar" title="看地" back="{{false}}"></mp-navigation-bar>
+  <view class="main">
+    <view class="top">
+      <view class="search center">
+        <image class="s-icon" src="../../assets/images/search.png"></image>
+      </view>
+      <view class="top-right flex-center">
+        <image class="top-tag" src="../../assets/images/s-icon.png"></image>
+        <text class="top-text">土地池</text>
+      </view>
+    </view>
+    <map class="map">
+      <cover-view slot="callout">
+        <cover-view marker-id="1"></cover-view>
+        <cover-view marker-id="2"></cover-view>
+      </cover-view>
+    </map>
+    <view class="gener">
+      <view class="gener-top">
+        <view class="gener-tag center {{filter.setTag(2).sname}}">{{filter.setTag(2).text}}</view>
+        <text class="gener-title">高新区大杨石组团H分区06-2324242423342号宗地</text>
+      </view>
+      <view class="gener-info">
+        <view class="gener-item">
+          <text class="gener-lable">【城 市】</text>
+          <text class="gener-text">重庆</text>
+        </view>
+        <view class="gener-item">
+          <text class="gener-lable">【公告号】</text>
+          <text class="gener-text">CQ4289</text>
+        </view>
+        <view class="gener-item">
+          <text class="gener-lable pl-14">【行政区】</text>
+          <text class="gener-text">巴南区</text>
+        </view>
+        <view class="gener-item">
+          <text class="gener-lable">【大组团】</text>
+          <text class="gener-text">大杨石</text>
+        </view>
+        <view class="gener-item">
+          <text class="gener-lable">【小组团】</text>
+          <text class="gener-text">杨家坪</text>
+        </view>
+      </view>
+    </view>
+    <view class="tab">
+      <view class="tab-item {{item.id===active?'active':''}}" wx:for="{{tabList}}" wx:for-index="i" wx:for-item="item"
+        wx:key="id" bindtap="tabDowm" data-id="{{item.id}}">
+        <text class="tab-title">{{item.name}}</text>
+        <image class="tab-tag" src="../../assets/images/tab-tag.png"></image>
+      </view>
+    </view>
+
+    <view class="list">
+      <view class="list-title">土地指标</view>
+      <view class="list-info">
+        <view class="list-info-item">占地面积：20344m(130亩)</view>
+        <view class="list-info-item">容积率：2.5</view>
+        <view class="list-info-item">计容面积：303956m</view>
+        <view class="list-info-item">绿地率：29%</view>
+        <view class="list-info-item">建筑限高：不大于30米</view>
+        <view class="list-info-item">建筑密度：28%</view>
+        <view class="list-info-item">起始总价：300000万元</view>
+        <view class="list-info-item">起始楼面价：4800元/m</view>
+        <view class="list-info-item">竟买保证金：30000万元</view>
+        <view class="list-info-item">公告日期：2021/03/01</view>
+        <view class="list-info-item">拍卖日期：2021/03/30</view>
+      </view>
+    </view>
+    <view class="list">
+      <view class="list-title">规划条件</view>
+      <view class="list-info">
+        <view class="list-info-item">商业面积：20344m</view>
+        <view class="list-info-item">商业占比：30%</view>
+        <view class="list-info-item">商务面积：303956m</view>
+        <view class="list-info-item">商务占比：29%</view>
+        <view class="list-info-item">配建-计容面积：不大于30米</view>
+        <view class="list-info-item">配建占比：28%</view>
+        <view class="list-info-item">配建-不计容面积：幼儿园2690m</view>
+      </view>
+    </view>
+    <view class="list">
+      <view class="list-title">建设条件</view>
+      <view class="list-info">
+        <view class="list-info-item">装配建筑：20344m</view>
+        <view class="list-info-item">绿色建筑：30%</view>
+        <view class="list-info-item">地质灾害：303956m</view>
+        <view class="list-info-item">人防还建：29%</view>
+        <view class="list-info-item">特殊条件：不大于30米</view>
+        <view class="list-info-item">其他条件：28%</view>
+      </view>
+    </view>
+    <view class="list">
+      <view class="list-title">竞买须知</view>
+      <view class="list-info-once">
+        <view class="list-item-once">竞买条件：这是一段文字说明介绍</view>
+        <view class="list-item-once">
+          付款节奏：这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍这是一段文字介绍</view>
+        <view class="list-item-once">出让人：这是一段文字介绍</view>
+      </view>
+    </view>
+
+    <view class="list">
+      <view class="list-title">挂牌资料</view>
+      <view class="list-info">
+        <view class="list-info-item">规划条件函：<text class="see">点击查看</text></view>
+        <view class="list-info-item">条件函附图：<text class="see">点击查看</text></view>
+        <view class="list-info-item">周报控规图：<text class="see">点击查看</text></view>
+        <view class="list-info-item">竞买须知：<text class="see">点击查看</text></view>
+        <view class="list-info-item">国土合同：无</view>
+        <view class="list-info-item">建设方案：无</view>
+        <view class="list-info-item">航拍全景：<text class="see">点击查看</text></view>
+      </view>
+    </view>
 
+    <view class="list">
+      <view class="list-title">土地研制</view>
+      <view class="list-info-once">
+        <view class="list-item-once">AIR可研： <text class="see">点击查看</text></view>
+        <view class="list-item-once">静态测算：<text class="see">开始测算</text></view>
+        <view class="list-item-once">看地导航：<text class="see">点击导航</text></view>
+      </view>
+    </view>
+  </view>
 </view>

pages/look/look.wxss

@@ -1 +1,168 @@
 /* pages/look/look.wxss */
+.top {
+  padding: 14rpx 30rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.search {
+  width: 110rpx;
+  height: 62rpx;
+  background: #ECECEC;
+  border-radius: 30rpx;
+}
+
+.s-icon {
+  width: 32rpx;
+  height: 32rpx;
+}
+
+.top-tag {
+  width: 30rpx;
+  height: 30rpx;
+}
+
+.top-text {
+  font-size: 32rpx;
+  color: #222222;
+  text-indent: 10rpx;
+}
+
+.map {
+  width: 750rpx;
+  height: 543rpx;
+}
+
+.tab {
+  display: flex;
+  align-items: center;
+  padding: 20rpx 30rpx 0 30rpx;
+}
+
+.tab-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-right: 54rpx;
+}
+
+.tab-title {
+  font-size: 30rpx;
+  font-weight: bold;
+  color: #565A6B;
+}
+
+.tab-tag {
+  width: 44rpx;
+  height: 10rpx;
+  display: none;
+}
+
+.active .tab-title {
+  font-size: 34rpx;
+  color: #262936;
+}
+
+.active .tab-tag {
+  display: block;
+}
+
+.gener {
+  padding: 20rpx 30rpx;
+  background-color: #ffffff;
+}
+
+.gener-tag {
+  width: 90rpx;
+  height: 34rpx;
+  background: #666A7A;
+  border-radius: 4rpx;
+  font-size: 22rpx;
+  font-weight: bold;
+  color: #FFFFFF;
+}
+
+.gener-top {
+  display: flex;
+  align-items: center;
+}
+
+.gener-title {
+  flex: 1;
+  text-indent: 10rpx;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  font-size: 34rpx;
+  font-weight: bold;
+  color: #262936;
+}
+
+.gener-info {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.gener-item {
+  line-height: 56rpx;
+  min-width: 33.3%;
+  font-size: 26rpx;
+}
+
+.gener-lable {
+  color: #262936;
+  font-weight: bold;
+}
+
+.pl-14{
+  padding-left: 14rpx;
+}
+
+.gener-text {
+  color: #565A6B;
+}
+
+.list{
+  background-color: #FFFFFF;
+  margin-top: 22rpx;
+  padding: 0 30rpx 30rpx;
+}
+
+.list-title{
+  font-size: 30rpx;
+  line-height: 80rpx;
+  font-weight: bold;
+  color: #F69F06;
+}
+
+.list-info{
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.list-info-once{
+  display: flex;
+  flex-direction: column;
+}
+
+.list-info-item{
+  line-height: 48rpx;
+  font-size: 24rpx;
+  color: #838B99;
+}
+
+.list-item-once{
+  line-height: 48rpx;
+  font-size: 24rpx;
+  color: #838B99;
+  display: block;
+}
+
+.list-info .list-info-item:nth-child(odd){
+  width: 60%;
+}
+
+.list-info .list-info-item:nth-child(even){
+  width: 40%;
+}

project.config.json

@@ -21,16 +21,15 @@
     "checkSiteMap": true,
     "uploadWithSourceMap": true,
     "compileHotReLoad": false,
-    "useMultiFrameRuntime": false,
+    "useMultiFrameRuntime": true,
-    "useApiHook": false,
+    "useApiHook": true,
-    "useApiHostProcess": false,
+    "useApiHostProcess": true,
     "babelSetting": {
       "ignore": [],
       "disablePlugins": [],
       "outputPath": ""
     },
     "enableEngineNative": false,
-    "bundle": false,
     "useIsolateContext": true,
     "useCompilerModule": true,
     "userConfirmedUseCompilerModuleSwitch": false,

project.private.config.json

@@ -35,6 +35,18 @@
           "pathName": "pages/calculation/calculation",
           "query": "",
           "scene": null
+        },
+        {
+          "name": "日历",
+          "pathName": "pages/calendar/calendar",
+          "query": "",
+          "scene": null
+        },
+        {
+          "name": "看地",
+          "pathName": "pages/look/look",
+          "query": "",
+          "scene": null
         }
       ]
     }

utils/util.js

@@ -15,5 +15,6 @@ const formatNumber = n => {
 }
 
 module.exports = {
-  formatTime
+  formatTime,
+  formatNumber
 }