diff --git a/src/assets/css/index.less b/src/assets/css/index.less
index 74d70a3..9abab2f 100644
--- a/src/assets/css/index.less
+++ b/src/assets/css/index.less
@@ -65,7 +65,6 @@ body #app {
   &-center3{
     align-items: flex-start;
   }
-  
   &-mean{
     justify-content: space-around;
   }
@@ -75,6 +74,9 @@ body #app {
   &-fend{
     justify-content: flex-end;
   }
+  &-wrap{
+    flex-wrap: wrap;
+  }
 }
 .m{
   &-left12{
@@ -113,6 +115,12 @@ body #app {
   &-bot50{
     margin-bottom: 50px;
   }
+  &-bot10{
+    margin-bottom:10px;
+  }
+  &-top16{
+    margin-top:16px;
+  }
 }
 
 .p{
@@ -181,6 +189,10 @@ body #app {
   &_round{
     border-radius: 5px;
   }
+  &_33{
+    width: 33px;
+    height: 33px;
+  }
 }
 .font-size13{
   font-size: 13px;
@@ -202,3 +214,7 @@ body #app {
   width: 100%;
   right: 0;
 }
+.content{
+  width: calc(100% - 20px);
+  margin: 0 auto;
+}
\ No newline at end of file
diff --git a/src/assets/images/houseQR/1.png b/src/assets/images/houseQR/1.png
new file mode 100644
index 0000000..2f49284
Binary files /dev/null and b/src/assets/images/houseQR/1.png differ
diff --git a/src/assets/images/houseQR/2.png b/src/assets/images/houseQR/2.png
new file mode 100644
index 0000000..ebb6ac6
Binary files /dev/null and b/src/assets/images/houseQR/2.png differ
diff --git a/src/assets/images/houseQR/3.png b/src/assets/images/houseQR/3.png
new file mode 100644
index 0000000..eee7ddb
Binary files /dev/null and b/src/assets/images/houseQR/3.png differ
diff --git a/src/assets/images/houseQR/4.png b/src/assets/images/houseQR/4.png
new file mode 100644
index 0000000..5b54acf
Binary files /dev/null and b/src/assets/images/houseQR/4.png differ
diff --git a/src/assets/images/houseQR/5.png b/src/assets/images/houseQR/5.png
new file mode 100644
index 0000000..d9c8618
Binary files /dev/null and b/src/assets/images/houseQR/5.png differ
diff --git a/src/assets/images/houseQR/6.png b/src/assets/images/houseQR/6.png
new file mode 100644
index 0000000..7c15167
Binary files /dev/null and b/src/assets/images/houseQR/6.png differ
diff --git a/src/assets/images/houseQR/7.png b/src/assets/images/houseQR/7.png
new file mode 100644
index 0000000..7470e39
Binary files /dev/null and b/src/assets/images/houseQR/7.png differ
diff --git a/src/assets/images/houseQR/8.png b/src/assets/images/houseQR/8.png
new file mode 100644
index 0000000..3f6ef18
Binary files /dev/null and b/src/assets/images/houseQR/8.png differ
diff --git a/src/assets/images/houseQR/bot_1.png b/src/assets/images/houseQR/bot_1.png
new file mode 100644
index 0000000..f044c90
Binary files /dev/null and b/src/assets/images/houseQR/bot_1.png differ
diff --git a/src/assets/images/houseQR/bot_2.png b/src/assets/images/houseQR/bot_2.png
new file mode 100644
index 0000000..6bbe9e9
Binary files /dev/null and b/src/assets/images/houseQR/bot_2.png differ
diff --git a/src/assets/images/houseQR/bot_3.png b/src/assets/images/houseQR/bot_3.png
new file mode 100644
index 0000000..7a13d0c
Binary files /dev/null and b/src/assets/images/houseQR/bot_3.png differ
diff --git a/src/assets/images/houseQR/bot_4.png b/src/assets/images/houseQR/bot_4.png
new file mode 100644
index 0000000..65ffffe
Binary files /dev/null and b/src/assets/images/houseQR/bot_4.png differ
diff --git a/src/assets/images/houseQR/header_bg.png b/src/assets/images/houseQR/header_bg.png
new file mode 100644
index 0000000..002bcb9
Binary files /dev/null and b/src/assets/images/houseQR/header_bg.png differ
diff --git a/src/assets/images/houseQR/header_bg_mask.png b/src/assets/images/houseQR/header_bg_mask.png
new file mode 100644
index 0000000..2ae20f0
Binary files /dev/null and b/src/assets/images/houseQR/header_bg_mask.png differ
diff --git a/src/assets/images/houseQR/house.png b/src/assets/images/houseQR/house.png
new file mode 100644
index 0000000..384d1e6
Binary files /dev/null and b/src/assets/images/houseQR/house.png differ
diff --git a/src/assets/images/houseQR/house_bg.png b/src/assets/images/houseQR/house_bg.png
new file mode 100644
index 0000000..e69938e
Binary files /dev/null and b/src/assets/images/houseQR/house_bg.png differ
diff --git a/src/assets/images/icons/community.png b/src/assets/images/icons/community.png
new file mode 100644
index 0000000..78b883e
Binary files /dev/null and b/src/assets/images/icons/community.png differ
diff --git a/src/assets/images/icons/grid.png b/src/assets/images/icons/grid.png
new file mode 100644
index 0000000..506ac8b
Binary files /dev/null and b/src/assets/images/icons/grid.png differ
diff --git a/src/assets/images/icons/tel.png b/src/assets/images/icons/tel.png
new file mode 100644
index 0000000..c6c4311
Binary files /dev/null and b/src/assets/images/icons/tel.png differ
diff --git a/src/router/router.config.js b/src/router/router.config.js
index cd1f57b..9aeff6f 100644
--- a/src/router/router.config.js
+++ b/src/router/router.config.js
@@ -6,7 +6,7 @@ export const constantRouterMap = [
   {
     path: '/',
     name: 'home',
-    component: () => import('@/views/home'),
+    component: () => import('@/views/houseQR'),
     meta: { title: '首页', keepAlive: false }
   },
   {
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 909602e..6072fd1 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -173,7 +173,7 @@ export default {
             }
             let res = await communityActivity(parm)
             if (res) {
-                this.activityList = res.list
+                this.activityList = res.list.slice(0, 2);
             }
         },
         handelClickJump(path) {
diff --git a/src/views/houseQR/index.less b/src/views/houseQR/index.less
new file mode 100644
index 0000000..f18d56e
--- /dev/null
+++ b/src/views/houseQR/index.less
@@ -0,0 +1,81 @@
+.header{
+    background:url('@/assets/images/houseQR/header_bg.png');
+    background-size: 100%;
+    width: 100%;
+    height: 180px;
+    z-index: 1;
+}
+.mask{
+    background:url('@/assets/images/houseQR/header_bg_mask.png');
+    background-size: 100%;
+    position: fixed;
+    width: 100%;
+    top: 0;
+    left: 0;
+    height: 180px; 
+    z-index: 2;
+}
+section{
+    position: relative;
+    top: -40px;
+    z-index: 3;
+    .house_base{
+        position: relative;
+        height: 80px;
+        background: url('@/assets/images/houseQR/house_bg.png') no-repeat;
+        background-size: 85% 100% ;
+        background-position: center center;
+        font-size: 18px;
+        font-weight: bold;
+        padding: 0 30px 0 0 ;
+        box-sizing: border-box;
+        img{
+            width: 115px;
+            height: 102px;
+            position: relative;
+            top: -20px;
+        }
+    }
+}
+.basi_content{
+    border-radius: 0 0 8px 8px;
+    position: relative;
+    &::after{
+            content: '';
+            position: absolute;
+            left: 0;
+            top: -13px;
+            width: 0;
+            height: 0;
+            border-left:9px solid transparent;
+            border-right:12px solid transparent;
+            border-bottom:12px solid #dfe9ef;
+    }
+    &::before{
+        content: '';
+        position: absolute;
+        right: 0;
+        top: -13px;
+        width: 0;
+        height: 0;
+        border-left:9px solid transparent;
+        border-right:12px solid transparent;
+        border-bottom:12px solid #dfe9ef;
+}
+}
+a{
+    padding: 5px 17px;
+    color: #ffffff;
+    background: #3974f6;
+    border-radius: 30px;
+    height: 28px;
+    text-align: center;
+    line-height: 18px;
+    font-size: 14px;
+    box-sizing: border-box;
+}
+.my_community{
+    padding-top: 8px;
+    box-sizing: border-box;
+    font-family: pingfang-bold;
+}
\ No newline at end of file
diff --git a/src/views/houseQR/index.vue b/src/views/houseQR/index.vue
index 94cd4e4..fc8b220 100644
--- a/src/views/houseQR/index.vue
+++ b/src/views/houseQR/index.vue
@@ -1,7 +1,68 @@
 <template>
-   <div class="container">
-        
-   </div>
+    <div class="">
+        <div class="header">
+            <div class="mask"></div>
+        </div>
+        <section>
+            <div class="flex flex-y m-bot10">
+                <div class="house_base flex">
+                    <img src="@/assets/images/houseQR/house.png" alt="">
+                    <div class="flex flex-y flex-center1 flex1">
+                        <div class="van-multi-ellipsis--l2">青岛市市北区重青岛市市北区重庆南路青岛市市北区重庆南路庆南路青岛市市北区重庆南路</div>
+                        <div>120号205户</div>
+                    </div>
+                </div>
+                <div class="card flex flex-y basi_content content">
+                    <div class="flex flex-center">
+                        <div class="label">
+                            <img src="@/assets/images/icons/community.png" class="img_16 m-right10" alt="">
+                            <span class="gray">所属社区：</span>
+                        </div>
+                        <div class="value flex1">市北区</div>
+                    </div>
+                    <div class="flex flex-center m-top15">
+                        <div class="label">
+                            <img src="@/assets/images/icons/grid.png" class="img_16 m-right10" alt="">
+                            <span class="gray">所属网格：</span>
+                        </div>
+                        <span class="value flex1">第一网格</span>
+                    </div>
+                    <div class="flex flex-center2 flex-end m-top15">
+                        <div class="flex">
+                            <div class="label">
+                                <img src="@/assets/images/icons/grid.png" class="img_16 m-right10" alt="">
+                                <span class="gray">社区电话：</span>
+                            </div>
+                            <div class="value ">0532-66778080</div>
+                        </div>
+                        <a :href='`tel:0532-66778080`'>拨打</a>
+                    </div>
+                </div>
+            </div>
+            <div class="content card ">
+                <div class="title">
+                    <span>我的社区</span>
+                </div>
+                <div class="my_community flex flex-wrap">
+                    <div style="width: 25%;" class="flex flex-y flex-center1 flex-center2"
+                        v-for="(item, index) in myCommunity" :key="index">
+                        <img :src="item.imgSrc" class="img_33 m-top16" alt="">
+                        <span class="font-size14 m-top10">{{ item.title }}</span>
+                    </div>
+                </div>
+            </div>
+            <div class="content card" style="margin-top: 10px;">
+                <div class="title"><span>服务矩阵</span></div>
+                <div class="my_community flex flex-wrap">
+                    <div style="width: 25%;" class="flex flex-y flex-center1 flex-center2"
+                        v-for="(item, index) in serverList" :key="index">
+                        <img :src="item.imgSrc" class="img_33 m-top16" alt="">
+                        <span class="font-size14 m-top10">{{ item.title }}</span>
+                    </div>
+                </div>
+            </div>
+        </section>
+    </div>
 </template>
 
 <script>
@@ -9,11 +70,54 @@ export default {
     name: 'houseQR',
     data() {
         return {
-               houesId:this.$route.query.houseId,
-            }
+            houesId: this.$route.query.houseId,
+            myCommunity: [
+                {
+                    imgSrc: require('@/assets/images/houseQR/1.png'),
+                    title: '二维码下载'
+                },
+                {
+                    imgSrc: require('@/assets/images/houseQR/2.png'),
+                    title: '我有诉求'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/3.png'),
+                    title: '社区讯息'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/4.png'),
+                    title: '社区活动'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/5.png'),
+                    title: '居民议事'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/6.png'),
+                    title: '满意度测评'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/7.png'),
+                    title: '可享服务'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/8.png'),
+                    title: '身边网格员'
+                }
+            ],
+            serverList: [
+                {
+                    imgSrc: require('@/assets/images/houseQR/bot_1.png'),
+                    title: '户政服务'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/bot_2.png'),
+                    title: '身份证业务'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/bot_3.png'),
+                    title: '公积金'
+                }, {
+                    imgSrc: require('@/assets/images/houseQR/bot_4.png'),
+                    title: '电子社保'
+                },
+            ]
+        }
     },
-    created(){
-        console.log(this.houesId,'房屋Id');
+    created() {
+        console.log(this.$route, '房屋Id');
     },
     mounted() {
 
@@ -21,6 +125,6 @@ export default {
 }
 </script>
 
-<style scoped lang="less">
-
+<style scoped lang="less" scoped>
+@import './index';
 </style>
\ No newline at end of file