diff --git a/src/apps/AppResidentDocument/AppResidentDocument.vue b/src/apps/AppResidentDocument/AppResidentDocument.vue
index a34d0033..66531c65 100644
--- a/src/apps/AppResidentDocument/AppResidentDocument.vue
+++ b/src/apps/AppResidentDocument/AppResidentDocument.vue
@@ -1,8 +1,15 @@
 <template>
   <div class="AppResidentDocument">
     <div class="areatop">
-      <div>区域选择</div>
+      <!-- <div>区域选择</div>
       <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="seachObj"></AiAreaPicker>
+      <u-icon name="photo"></u-icon> -->
+      <!-- @select="areaSelect" -->
+      <u-form label-width="auto">
+        <u-form-item label="区域选择" right-icon="arrow-right" class="areaIds">
+          <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="seachObj"></AiAreaPicker>
+        </u-form-item>
+      </u-form>
     </div>
 
     <div class="line"></div>
@@ -70,7 +77,7 @@ export default {
     this.getList()
   },
   onShow() {
-    document.title =  '居民列表'
+    document.title = '居民列表'
   },
   methods: {
     getList() {
@@ -149,6 +156,34 @@ export default {
     border-top: 2px solid #f5f5f5;
     padding: 20px 32px;
   }
+  ::v-deep .u-form {
+    width: 100%;
+    .areaIds {
+      .u-form-item__body {
+        .u-form-item--right {
+          .u-form-item--right__content {
+            display: flex;
+            align-items: center;
+            .u-form-item--right__content__slot {
+              .AiAreaPicker {
+                width: 100%;
+                display: flex;
+                justify-content: flex-end;
+                .areaSelector {
+                  .location {
+                    opacity: 0;
+                  }
+                }
+              }
+            }
+            .u-form-item--right__content__icon {
+              margin-bottom: 8px;
+            }
+          }
+        }
+      }
+    }
+  }
   .datas {
     .datass {
       display: flex;