diff --git a/pages/index/index.js b/pages/index/index.js
index b3d7d59..65187cb 100644
--- a/pages/index/index.js
+++ b/pages/index/index.js
@@ -44,8 +44,6 @@ Page({
      */
     timer: null,
     onLoad: function (options) {
-        console.log("articles", this.data.articles);
-
         this.getLocationData()
 
         wx.showLoading()
@@ -86,6 +84,8 @@ Page({
             })
             this.getTopTitle()
 
+            this.ratio = app.globalData.screen_data['windowWidth'] / 750
+
         } else {
             setTimeout(function () {
                 that.get_config()
@@ -407,20 +407,101 @@ Page({
                 listData: data
             })
 
-            this.calculate()
+            this.query = wx.createSelectorQuery();
+            this.calculateProcessingCenter()
         })
     },
 
+    listDataIndex: 0,
+    leftHeight: 0, // px 单位
+    rightHeight: 0,
+    ratio: 0,
+    query: null,
     // 计算
     calculateProcessingCenter() {
-        // let
+        if (this.listDataIndex >= this.data.listData.length) {
+
+            this.setData({
+                listDataLeft: this.data.listDataLeft,
+                listDataRight: this.data.listDataRight
+            })
+            return
+        }
+
+
+        let ratio = this.ratio
+
+        if (this.ratio) this.ratio = this.data.screen_data['windowWidth'] / 750
+        let targetData = this.data.listData[this.listDataIndex]
+        let type = targetData['type']
+        if (type == 'adv') {
+            this.getPictureHeight(targetData.image).then(res => {
+                this.whichSide(res, targetData)
+            })
+        } else {
+            let altitude = 0 // rpx
+
+            if (type == 'apartment') {
+                altitude = 105
+                if (targetData['specifications'].length > 2) altitude += 100
+                else altitude += 64 * targetData['specifications'].length
+            } else {
+                altitude = 141
+            }
+
+            altitude = altitude * ratio // 转 px
+
+            this.setData({
+                targetData
+            })
+
+            this.getPictureHeight(targetData.image).then(res => {
+                altitude += res
+                let select = type == 'apartment' ? '#apartment' : '#general'
+
+                this.query.select(select).boundingClientRect(rect => {
+                    let height = rect.height;
+                    altitude += height
+                    this.whichSide(altitude, targetData)
+                }).exec();
+
+            })
+        }
+
+        console.log(this.data.listDataLeft, this.data.listDataRight);
+    },
+
+    // 判断在哪边的
+    whichSide(res, targetData) {
+        console.log(this.leftHeight <= this.rightHeight, this.leftHeight, this.rightHeight);
+        if (this.leftHeight <= this.rightHeight) {
+            this.leftHeight = this.leftHeight + res
+            this.data.listDataLeft.push(targetData)
+        } else {
+            this.rightHeight = this.rightHeight + res
+            this.data.listDataRight.push(targetData)
+        }
+
+        this.setData({
+            targetData: null
+        })
+        this.listDataIndex++
+        this.calculateProcessingCenter()
     },
 
     // 获取图片高度
-    getPictureHeight() {
-        new Promise((resolve, reject) => {
+    getPictureHeight(src) {
+        return new Promise((resolve, reject) => {
             wx.getImageInfo({
-                src: '',
+                src,
+                success: res => {
+                    let {
+                        width,
+                        height
+                    } = res
+                    let actual = height / width * 337 * this.ratio
+                    resolve(actual)
+                }
             })
         })
     }
diff --git a/pages/index/index.wxml b/pages/index/index.wxml
index 2d1b6e5..be81788 100644
--- a/pages/index/index.wxml
+++ b/pages/index/index.wxml
@@ -1,4 +1,13 @@
 <view class="container" wx:if="{{ !loding }}">
+    <view class="">
+    
+    </view>
+    <view class="" id="apartment">
+        <view class="apartment1-name">{{ targetData['title'] }}</view>
+        <view class="apartment1-introduce">{{ targetData['propaganda'] }}</view>
+    </view>
+    <view class="general-name flexacenter" id="general">{{ targetData['title'] }}</view>
+
     <!-- <header-nav inner-text="Some text" isIndexPage="index">寄托港校租房</header-nav> -->
     <header-nav inner-text="Some text" isIndexPage="index">{{ topTitle }}</header-nav>
 
@@ -146,57 +155,33 @@
     </view>
     <!-- 列表 -->
     <view class="pinterest-list flexflex" wx:if="{{ envVersionState && true }}">
-        <block wx:for="{{ listData }}" wx:key="index">
-            <!-- 广告 -->
-            <image wx:if="{{ item.type == 'adv' }}" class="pinterest-list-item" mode="widthFix" src="{{ item.image }}" bindtap="handleSwiper" data-id="{{ item.id }}" data-url="{{ item.url }}"></image>
+        <view class="pinterest-list-left flex1">
+            <block wx:for="{{ listDataLeft }}" wx:key="index">
+                <block wx:if="{{item.type == 'adv'}}">
+                    <template is="adv" data="{{ item }}"></template>
+                </block>
+                <block wx:elif="{{item.type == 'apartment'}}">
+                    <template is="apartment" data="{{ item }}"></template>
+                </block>
+                <block wx:else>
+                    <template is="general" data="{{ item }}"></template>
+                </block>
+            </block>
+        </view>
 
-            <!-- 公寓 -->
-            <view wx:elif="{{ item.type == 'apartment' }}" class="pinterest-list-item apartment">
-                <view class="apartment-top flexcenter">
-                    <image class="apartment-icon" mode="widthFix" src="/img/apartment-icon.png"></image>
-                    <image class="apartment-text" mode="widthFix" src="/img/apartment-text.png"></image>
-                </view>
-                <image class="apartment-img" mode="widthFix" src="{{ item.image }}"></image>
-                <view class="apartment-name">{{ item.title }}</view>
-                <view class="apartment-introduce">{{ item.propaganda }}</view>
-                <view class="apartment-price">
-                    <block wx:for="{{ item.specifications }}" wx:for-item="it" wx:key="index">
-                        <view wx:if="{{ index < 2 }}" class="apartment-price-item flexacenter">
-                            <view class="apartment-price-name">{{ it.title }}</view>
-                            <view class="apartment-price-cost flex1 flexacenter">
-                                <view class="apartment-price-unit">HK$</view>
-                                <view class="apartment-price-number">{{ it.value }}</view>
-                                /月
-                            </view>
-                        </view>
-                    </block>
-                </view>
-                <view wx:if="{{ item.specifications.length > 2 }}" class="apartment-price-more flexcenter">更多</view>
-            </view>
-
-            <!-- 普通 -->
-            <view wx:else class="pinterest-list-item general">
-                <view class="top-right-corner flexcenter" wx:if="{{ item.gptype }}">{{ item.gptype }}</view>
-                <image class="general-img" mode="widthFix" src="{{ item.image }}"></image>
-                <view class="general-name" wx:if="{{ item.title }}">
-                    <view class="general-tag flexcenter" wx:if="{{ item.leaseterm }}">{{ item.leaseterm }}</view>
-                    {{ item.title }}
-                </view>
-
-                <view class="label-list flexacenter">
-                    <view class="label-item" wx:if="{{ item.housingtype }}">{{ item.housingtype }}</view>
-                    <view class="label-item" wx:if="{{ item.gender }}">{{ item.gender }}</view>
-                    <view class="label-item" wx:if="{{ item.leaseterm }}">{{ item.leaseterm }}</view>
-                </view>
-
-                <view class="general-cost flex1 flexacenter">
-                    <view class="general-unit">HK$</view>
-                    <view class="general-number">{{ item.rent }}</view>
-                    /月
-                </view>
-            </view>
-
-        </block>
+        <view class="pinterest-list-left flex1" style="display:flex;flex-direction:column;align-items: flex-end;">
+            <block wx:for="{{ listDataRight }}" wx:key="index">
+                <block wx:if="{{item.type == 'adv'}}">
+                    <template is="adv" data="{{ item }}"></template>
+                </block>
+                <block wx:elif="{{item.type == 'apartment'}}">
+                    <template is="apartment" data="{{ item }}"></template>
+                </block>
+                <block wx:else>
+                    <template is="general" data="{{ item }}"></template>
+                </block>
+            </block>
+        </view>
 
     </view>
 
@@ -378,4 +363,59 @@
     </page-container>
 
     <announcement-popup interface="home" init="{{ initState }}"></announcement-popup>
-</view>
\ No newline at end of file
+</view>
+
+<!-- 广告 -->
+<template name="adv">
+    <image class="pinterest-list-item" mode="widthFix" src="{{ item.image }}" bindtap="handleSwiper" data-id="{{ item.id }}" data-url="{{ item.url }}"></image>
+</template>
+
+<!-- 公寓 -->
+<template name="apartment">
+    <view class="pinterest-list-item apartment">
+        <view class="apartment-top flexcenter">
+            <image class="apartment-icon" mode="widthFix" src="/img/apartment-icon.png"></image>
+            <image class="apartment-text" mode="widthFix" src="/img/apartment-text.png"></image>
+        </view>
+        <image class="apartment-img" mode="widthFix" src="{{ item.image }}"></image>
+        <view class="apartment-name">{{ item.title }}</view>
+        <view class="apartment-introduce">{{ item.propaganda }}</view>
+        <view class="apartment-price">
+            <block wx:for="{{ item.specifications }}" wx:for-item="it" wx:key="index">
+                <view wx:if="{{ index < 2 }}" class="apartment-price-item flexacenter">
+                    <view class="apartment-price-name one-line-display">{{ it.title }}</view>
+                    <view class="apartment-price-cost flex1 flexacenter">
+                        <view class="apartment-price-unit">HK$</view>
+                        <view class="apartment-price-number">{{ it.value }}</view>
+                        /月
+                    </view>
+                </view>
+            </block>
+        </view>
+        <view wx:if="{{ item.specifications.length > 2 }}" class="apartment-price-more flexcenter">更多</view>
+    </view>
+</template>
+
+<!-- 普通 -->
+<template name="general">
+    <view class="pinterest-list-item general">
+        <view class="top-right-corner flexcenter" wx:if="{{ item.gptype }}">{{ item.gptype }}</view>
+        <image class="general-img" mode="widthFix" src="{{ item.image }}"></image>
+        <view class="general-name flexacenter" wx:if="{{ item.title }}">
+            <view class="general-tag flexcenter" wx:if="{{ item.leaseterm }}">{{ item.leaseterm }}</view>
+            {{ item.title }}
+        </view>
+
+        <view class="label-list flexacenter">
+            <view class="label-item" wx:if="{{ item.housingtype }}">{{ item.housingtype }}</view>
+            <view class="label-item" wx:if="{{ item.gender }}">{{ item.gender }}</view>
+            <view class="label-item" wx:if="{{ item.leaseterm }}">{{ item.leaseterm }}</view>
+        </view>
+
+        <view class="general-cost flex1 flexacenter">
+            <view class="general-unit">HK$</view>
+            <view class="general-number">{{ item.rent }}</view>
+            /月
+        </view>
+    </view>
+</template>
\ No newline at end of file
diff --git a/pages/index/index.wxss b/pages/index/index.wxss
index 99ce70c..cd4a0cb 100644
--- a/pages/index/index.wxss
+++ b/pages/index/index.wxss
@@ -824,6 +824,13 @@
     color: #000000;
     line-height: 48rpx;
     padding: 0 15rpx;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    /* display: flex; */
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 .pinterest-list .pinterest-list-item.general .general-tag {
@@ -943,4 +950,31 @@
 
 .waterfall-item {
     width: 300rpx;
-  }
\ No newline at end of file
+}
+
+.apartment1-name {
+    font-size: 27rpx;
+    color: #000000;
+    font-weight: 650;
+    padding: 13.5rpx 15rpx;
+}
+
+.apartment1-introduce {
+    color: #aaaaaa;
+    font-size: 21rpx;
+    padding: 0 15rpx;
+}
+
+.general-name1 {
+    font-size: 27rpx;
+    color: #000000;
+    line-height: 48rpx;
+    padding: 0 15rpx;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    /* display: flex; */
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
\ No newline at end of file
diff --git a/pages/personList/personList.js b/pages/personList/personList.js
index b2c2ce5..9bfbb4b 100644
--- a/pages/personList/personList.js
+++ b/pages/personList/personList.js
@@ -373,6 +373,7 @@ Page({
           }
         }
       }
+      
       if (ishere) {
         searchindex = i;
         this.setData({