无等级网格版合并

src/apps/AppGridManagement/AddUser.vue

@@ -1,11 +1,11 @@
 <template>
-  <div class="AddGird">
+  <section class="AddGird">
     <div class="item-flex">
       <div class="label">
         <span class="tips">*</span>姓名
       </div>
       <div class="value">
-        <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="name" maxlength="50" />
+        <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="name" maxlength="50"/>
       </div>
     </div>
     <div class="item-flex">
@@ -13,25 +13,26 @@
         <span class="tips">*</span>手机号
       </div>
       <div class="value">
-        <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="phone" maxlength="50" />
+        <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="phone" maxlength="50"/>
       </div>
     </div>
     <div class="item-flex">
       <div class="label">
         <span class="tips">*</span>所属网格
       </div>
-      <div class="value" @click="linkTo('./SelectGird?formType=2')">
-        
-        <span v-if="selectGird.girdName">{{selectGird.girdName}}</span>
-        <span style="color:#999;" v-else>请选择</span>
-        <img src="./components/img/right-icon.png" alt="" /></div>
+      <div class="value">
+        <AiPagePicker type="custom" v-model="selectGird" valueObj nodeKey="id" :ops="{url:'./SelectGird',label: 'girdName'}" formType="2">
+          <AiMore v-model="selectGird.girdName"/>
+        </AiPagePicker>
+      </div>
+      <div class="footer" @click="confirm">确认添加</div>
     </div>
-    <div class="footer" @click="confirm">确认添加</div>
-  </div>
+  </section>
 </template>
 
 <script>
 import {mapState} from 'vuex'
+
 export default {
   data() {
     return {
@@ -42,25 +43,21 @@ export default {
   },
   computed: {...mapState(['user'])},
   onLoad() {
-    console.log(this.user)
     this.name = this.user.name || ''
     this.phone = this.user.phone || ''
-    uni.$on('goback', (res) => {
-      this.selectGird = res
-    })
   },
   onShow() {
     document.title = '网格员信息申报'
   },
   methods: {
     confirm() {
-      if(!this.name){
+      if (!this.name) {
         return this.$u.toast('请输入姓名')
       }
-      if(!this.phone){
+      if (!this.phone) {
         return this.$u.toast('请输入手机号')
       }
-      if(!this.selectGird.girdName){
+      if (!this.selectGird.girdName) {
         return this.$u.toast('请选择所属网格')
       }
       this.$http.post(`/app/appgirdmemberapply/girdMemberCheck?name=${this.name}&phone=${this.phone}&girdName=${this.selectGird.girdName}`).then((res) => {
@@ -74,7 +71,7 @@ export default {
     },
 
     linkTo(url) {
-      uni.navigateTo({ url })
+      uni.navigateTo({url})
     },
   }
 }
@@ -82,42 +79,48 @@ export default {
 
 <style lang="scss" scoped>
 .AddGird {
-  .item-flex{
+  .item-flex {
     display: flex;
     padding: 34px 32px;
     background-color: #fff;
     font-size: 32px;
     font-family: PingFangSC-Regular, PingFang SC;
     margin-bottom: 16px;
-    .label{
+
+    .label {
       font-weight: 400;
       color: #333333;
       line-height: 22px;
       width: 150px;
-      .tips{
+
+      .tips {
         display: inline-block;
         width: 16px;
         color: #F46;
         line-height: 44px;
       }
     }
-    .value{
+
+    .value {
       width: calc(100% - 150px);
       line-height: 44px;
       text-align: right;
       color: #666;
-      img{
+
+      img {
         width: 32px;
         height: 32px;
         vertical-align: middle;
         margin-left: 8px;
       }
     }
-    .color-999{
+
+    .color-999 {
       color: #999;
     }
   }
-  .footer{
+
+  .footer {
     width: 100%;
     height: 112px;
     line-height: 112px;