06-03 02点28分

app.json

@@ -5,8 +5,15 @@
     "pages/index/index",
     "pages/calculation/calculation",
     "pages/ucenter/ucenter",
-    "pages/message/message"
+    "pages/message/message",
+    "pages/look-list/look-list",
+    "pages/look-detail/look-detail"
   ],
+  "permission": {
+    "scope.userLocation": {
+      "desc": "你的位置信息将用于小程序位置接口的效果展示"
+    }
+  },
   "window":{
     "backgroundTextStyle":"light",
     "navigationBarBackgroundColor": "#fff",

app.wxss

@@ -86,3 +86,33 @@
 .gsz{
   background-color: #02D775;
 }
+
+.look-top {
+  padding: 14rpx 30rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.look-search {
+  width: 110rpx;
+  height: 62rpx;
+  background: #ECECEC;
+  border-radius: 30rpx;
+}
+
+.look-s-icon {
+  width: 32rpx;
+  height: 32rpx;
+}
+
+.look-top-tag {
+  width: 30rpx;
+  height: 30rpx;
+}
+
+.look-top-text {
+  font-size: 32rpx;
+  color: #222222;
+  text-indent: 10rpx;
+}

pages/look-detail/look-detail.js

@@ -0,0 +1,79 @@
+// pages/look-detail/look-detail.js
+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})
+    }
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+    if (typeof this.getTabBar === 'function' &&
+        this.getTabBar()) {
+        this.getTabBar().setData({
+          selected: 1
+        })
+      }
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/look-detail/look-detail.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/look-detail/look-detail.wxml

@@ -0,0 +1,150 @@
+<!--pages/look-detail/look-detail.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="看地"></mp-navigation-bar>
+  <view class="main">
+    <view class="look-top">
+      <view class="look-search center">
+        <image class="look-s-icon" src="../../assets/images/search.png"></image>
+      </view>
+      <view class="look-top-right flex-center">
+        <image class="look-top-tag" src="../../assets/images/s-icon.png"></image>
+        <text class="look-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-detail/look-detail.wxss

@@ -0,0 +1,139 @@
+/* pages/look-detail/look-detail.wxss */
+
+.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%;
+}

pages/look-list/look-list.js

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

pages/look-list/look-list.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/look-list/look-list.wxml

@@ -0,0 +1,2 @@
+<!--pages/look-list/look-list.wxml-->
+<text>pages/look-list/look-list.wxml</text>

pages/look-list/look-list.wxss

@@ -0,0 +1 @@
+/* pages/look-list/look-list.wxss */

pages/look/look.js

@@ -5,22 +5,174 @@ Page({
    * 页面的初始数据
    */
   data: {
-    tabList: [{id:1,name:'公告信息'},{id:2,name:'成交信息'},{id:3,name:'呈现项目'}],
+    satellite: 1,
-    active: 1,
+    scale: 13,
+    latitude: 29.543812,
+    longitude: 106.434042,
+    markers: [],
+    once: {
+      id: '001',
+      name: '已出让',
+      state: false
+    },
+    tabs: [{
+      id: '002',
+      name: '挂牌中',
+      state: false
+    }, {
+      id: '003',
+      name: '待挂牌',
+      state: false
+    }, {
+      id: '004',
+      name: '地块信息',
+      state: false
+    }, {
+      id: '005',
+      name: 'MORE',
+      state: false
+    }, {
+      id: '006',
+      name: '配套',
+      state: true
+    }, {
+      id: '007',
+      name: '控规',
+      state: false
+    }, {
+      id: '008',
+      name: '环线',
+      state: false
+    }, {
+      id: '009',
+      name: '行政区',
+      state: true
+    }, {
+      id: '010',
+      name: '大板块',
+      state: false
+    }, {
+      id: '011',
+      name: '小版块',
+      state: false
+    }]
   },
 
-  tabDowm(e){
+  checkBtn(e) {
-    let active = e.currentTarget.dataset.id
+    let id = e.currentTarget.dataset.id
-    if(active!==this.data.active){
+    this.setMore();
-      this.setData({active})
+    if (id === '001') {
+      let {
+        once
+      } = this.data
+      once.state = !once.state
+      this.setData({
+        once
+      })
+    } else {
+      let {tabs} = this.data
+      tabs.forEach(item=>{
+        if(item.id===id){
+          item.state = !item.state
+        }
+      })
+      this.setData({tabs})
     }
   },
 
+  setMore() {
+    let {
+      markers
+    } = this.data
+    let makeArr = [{
+      id: 1,
+      latitude: 29.627668,
+      longitude: 106.511395,
+      iconPath: "../../assets/images/more.png",
+      width: 40,
+      height: 50,
+    }, {
+      id: 2,
+      latitude: 29.607063,
+      longitude: 106.550777,
+      iconPath: "../../assets/images/more.png",
+      width: 40,
+      height: 50,
+    }];
+    if (markers.length < 3) {
+      markers = markers.concat(makeArr)
+      this.setData({
+        markers
+      })
+    }
+  },
+
+  mapTabItem(e) {
+    let satellite = e.currentTarget.dataset.id
+    if (satellite !== this.data.satellite) {
+      this.setData({
+        satellite
+      })
+    }
+  },
+
+  scaleDown(e) {
+    let type = e.currentTarget.dataset.type
+    let {
+      scale
+    } = this.data
+    if (type === 'add' && scale < 20) {
+      this.setData({
+        scale: ++scale
+      })
+    } else if (type === 'reduce' && scale > 3) {
+      this.setData({
+        scale: --scale
+      })
+    }
+  },
+  //定位当前
+  scaleBack() {
+    let that = this;
+    wx.getLocation({
+      type: 'gcj02',
+      success: function (res) {
+        let latitude = res.latitude
+        let longitude = res.longitude
+        let {
+          markers
+        } = that.data
+        let mark = {
+          id: res.accuracy,
+          latitude,
+          longitude,
+          iconPath: "../../assets/images/user-address.png",
+          width: 40,
+          height: 50,
+        }
+        markers.push(mark)
+        that.setData({
+          latitude: latitude,
+          longitude: longitude,
+          markers: markers
+        })
+      }
+    })
+  },
+
+  //点击标记点
+  markertap(e) {
+    let id = e.detail.markerId
+    wx.navigateTo({
+      url: '/pages/look-list/look-list?id=' + id,
+    })
+  },
+
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
-
+    this.scaleBack()
   },
 
   /**
@@ -35,11 +187,11 @@ Page({
    */
   onShow: function () {
     if (typeof this.getTabBar === 'function' &&
-        this.getTabBar()) {
+      this.getTabBar()) {
-        this.getTabBar().setData({
+      this.getTabBar().setData({
-          selected: 1
+        selected: 1
-        })
+      })
-      }
+    }
   },
 
   /**

pages/look/look.wxml

@@ -25,126 +25,49 @@
 <view class="pages">
   <mp-navigation-bar ext-class="set-bar" title="看地" back="{{false}}"></mp-navigation-bar>
   <view class="main">
-    <view class="top">
+    <view class="look-top">
-      <view class="search center">
+      <view class="look-search center">
-        <image class="s-icon" src="../../assets/images/search.png"></image>
+        <image class="look-s-icon" src="../../assets/images/search.png"></image>
       </view>
-      <view class="top-right flex-center">
+      <view class="look-top-right flex-center">
-        <image class="top-tag" src="../../assets/images/s-icon.png"></image>
+        <image class="look-top-tag" src="../../assets/images/s-icon.png"></image>
-        <text class="top-text">土地池</text>
+        <text class="look-top-text">土地池</text>
       </view>
     </view>
-    <map class="map">
+
-      <cover-view slot="callout">
+    <map class="map" enable-satellite="{{satellite==1?true:false}}" scale="{{scale}}" markers="{{markers}}"
-        <cover-view marker-id="1"></cover-view>
+      latitude="{{latitude}}" longitude="{{longitude}}" bindmarkertap="markertap">
-        <cover-view marker-id="2"></cover-view>
+      <cover-view class="map-tab">
+        <cover-view data-id="1" class="map-tab-item {{satellite==1?'active':''}}" bindtap="mapTabItem">卫星图</cover-view>
+        <cover-view data-id="2" class="map-tab-item {{satellite==2?'active':''}}" bindtap="mapTabItem">平面图</cover-view>
+      </cover-view>
+      <cover-image data-type="add" bindtap="scaleDown" class="map-scale map-scale-add"
+        src="../../assets/images/add.png"></cover-image>
+      <cover-image data-type="reduce" bindtap="scaleDown" class="map-scale map-scale-reduce"
+        src="../../assets/images/reduce.png"></cover-image>
+      <cover-image bindtap="scaleBack" class="map-back" src="../../assets/images/myback.png"></cover-image>
+      <cover-view class="list-head">
+        <cover-view class="list-top">
+          <cover-view class="list-item" data-id="{{once.id}}" bindtap="checkBtn">
+            <cover-view class="check-box {{once.state?'check-active':''}}">
+              <cover-image class="check-icon" src="../../assets/images/check.png"></cover-image>
+            </cover-view>
+            <cover-view class="item-name">{{once.name}}</cover-view>
+          </cover-view>
+          <cover-view class="timer">20XX年 - 20XX年</cover-view>
+        </cover-view>
       </cover-view>
+      <cover-view class="hidden"></cover-view>
     </map>
-    <view class="gener">
+    <view class="list-foot">
-      <view class="gener-top">
+      <view class="list-item {{item.id=='008'?'w50':''}} {{item.id=='005'?'pl30':''}}" wx:for="{{tabs}}" wx:key="id"
-        <view class="gener-tag center {{filter.setTag(2).sname}}">{{filter.setTag(2).text}}</view>
+        data-id="{{item.id}}" bindtap="checkBtn">
-        <text class="gener-title">高新区大杨石组团H分区06-2324242423342号宗地</text>
+        <view class="check-box {{item.state?'check-active':''}}">
-      </view>
+          <image class="check-icon" src="../../assets/images/check.png"></image>
-      <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 class="item-name">{{item.name}}</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,168 +1,159 @@
 /* pages/look/look.wxss */
-.top {
+.main{
-  padding: 14rpx 30rpx;
+  padding-bottom: 0;
-  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;
+  height: 1042rpx;
 }
 
-.tab {
+.map-tab {
-  display: flex;
+  width: 168rpx;
-  align-items: center;
+  height: 54rpx;
-  padding: 20rpx 30rpx 0 30rpx;
+  background: #FFFFFF;
-}
+  box-shadow: 0 2rpx 23rpx 0 rgba(191, 191, 191, 0.15);
-
+  border-radius: 4rpx;
-.tab-item {
   display: flex;
-  flex-direction: column;
+  justify-content: space-between;
   align-items: center;
-  margin-right: 54rpx;
+  position: absolute;
+  right: 46rpx;
+  top: 28rpx;
+  padding: 0 20rpx;
 }
 
-.tab-title {
+.map-tab-item {
-  font-size: 30rpx;
+  font-size: 20rpx;
   font-weight: bold;
-  color: #565A6B;
+  color: #262936;
+
 }
 
-.tab-tag {
+.map-tab .active {
-  width: 44rpx;
+  color: #F08E20;
-  height: 10rpx;
-  display: none;
 }
 
-.active .tab-title {
+.map-scale {
-  font-size: 34rpx;
+  width: 100rpx;
-  color: #262936;
+  height: 100rpx;
+  position: absolute;
+  right: 20rpx;
 }
 
-.active .tab-tag {
+.map-scale-add {
-  display: block;
+  bottom: 234rpx;
 }
 
-.gener {
+.map-scale-reduce {
-  padding: 20rpx 30rpx;
+  bottom: 146rpx;
-  background-color: #ffffff;
 }
 
-.gener-tag {
+.map-back {
-  width: 90rpx;
+  width: 100rpx;
-  height: 34rpx;
+  height: 100rpx;
-  background: #666A7A;
+  position: absolute;
-  border-radius: 4rpx;
+  left: 20rpx;
-  font-size: 22rpx;
+  bottom: 146rpx;
-  font-weight: bold;
-  color: #FFFFFF;
 }
 
-.gener-top {
+.list-head {
+  position: absolute;
+  left: 33rpx;
+  bottom: 0rpx;
+  width: 687rpx;
+  height: 90rpx;
+  background: #FFFFFF;
+  box-shadow: 0 2rpx 23rpx 0 rgba(191, 191, 191, 0.15);
+  border-radius: 18rpx 18rpx 0 0;
+  padding: 0 30rpx;
+  box-sizing: border-box;
   display: flex;
   align-items: center;
 }
 
-.gener-title {
+.list-top {
-  flex: 1;
+  display: flex;
-  text-indent: 10rpx;
+  width: 100%;
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  font-size: 34rpx;
-  font-weight: bold;
-  color: #262936;
 }
 
-.gener-info {
+.list-item {
+  width: 25%;
   display: flex;
-  flex-wrap: wrap;
+  align-items: center;
 }
 
-.gener-item {
+.timer {
-  line-height: 56rpx;
+  line-height: 43rpx;
-  min-width: 33.3%;
+  background: #BBBCC8;
-  font-size: 26rpx;
+  border: 1px solid #BBBCC8;
+  opacity: 0.4;
+  border-radius: 4rpx;
+  display: flex;
+  justify-content: center;
+  font-size: 28rpx;
+  color: #262936;
+  padding: 0 30rpx;
 }
 
-.gener-lable {
+.check-box {
-  color: #262936;
+  width: 24rpx;
-  font-weight: bold;
+  height: 24rpx;
+  background: #FFFFFF;
+  border: 2rpx solid #009CFF;
+  border-radius: 4rpx;
+  box-sizing: border-box;
 }
 
-.pl-14{
+.check-active {
-  padding-left: 14rpx;
+  background: #009CFF;
 }
 
-.gener-text {
+.check-icon {
-  color: #565A6B;
+  display: none;
+  width: 100%;
+  height: 100%;
 }
 
-.list{
+.check-active .check-icon {
-  background-color: #FFFFFF;
+  display: block;
-  margin-top: 22rpx;
-  padding: 0 30rpx 30rpx;
 }
 
-.list-title{
+.item-name {
-  font-size: 30rpx;
+  padding-left: 16rpx;
-  line-height: 80rpx;
   font-weight: bold;
-  color: #F69F06;
+  font-size: 28rpx;
+  color: #262936;
 }
 
-.list-info{
+.list-foot {
+  padding: 0 30rpx 30rpx 30rpx;
+  box-sizing: border-box;
+  width: 687rpx;
+  margin-left: 33rpx;
   display: flex;
   flex-wrap: wrap;
+  background-color: #FFFFFF;
+  border-radius: 0 0 18rpx 18rpx;
 }
 
-.list-info-once{
+.list-foot .list-item {
-  display: flex;
+  padding-bottom: 10rpx;
-  flex-direction: column;
-}
-
-.list-info-item{
-  line-height: 48rpx;
-  font-size: 24rpx;
-  color: #838B99;
 }
 
-.list-item-once{
+.w50 {
-  line-height: 48rpx;
+  width: 50%;
-  font-size: 24rpx;
-  color: #838B99;
-  display: block;
 }
 
-.list-info .list-info-item:nth-child(odd){
+.pl30 {
-  width: 60%;
+  padding-left: 30rpx;
+  box-sizing: border-box;
 }
 
-.list-info .list-info-item:nth-child(even){
+.hidden{
-  width: 40%;
+  position: absolute;
+  left: 33rpx;
+  bottom: 0rpx;
+  width: 687rpx;
+  height: 20rpx;
+  background: #FFFFFF;
 }