定位加上loading和搜索按钮

ui/packages/tools/AiLocateDialog.vue

@@ -3,9 +3,11 @@
     <ai-dialog :visible.sync="dialog" :title="$attrs.dialogTitle||'标绘'" @closed="$emit('visible',false),selected={}"
                @opened="$nextTick(()=>initMap())"
                @onConfirm="handleConfirm" v-bind="$attrs">
-      <div id="amap" v-if="dialog"/>
+      <div id="amap" v-if="dialog" v-loading="searching" element-loading-text="搜索中.." element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.8)"/>
       <div class="poi">
-        <el-input ref="poiInput" v-model="search" size="small" clearable @change="handleSearch" placeholder="请输入地点"/>
+        <el-input ref="poiInput" v-model="search" size="small" clearable @change="handleSearch" placeholder="请输入地点">
+          <span slot="append" @click="handleSearch" class="el-icon-search"/>
+        </el-input>
       </div>
       <el-form class="selected" v-if="!!selected.location" id="result" size="mini" label-suffix="："
                label-position="left">
@@ -39,6 +41,7 @@ export default {
       map: null,
       AMap: null,
       selected: {},
+      searching: false
     }
   },
   watch: {
@@ -79,6 +82,8 @@ export default {
     },
     handleSearch(v) {
       if (v) {
+        this.searching = true
+        this.poi.on('complete', () => this.searching = false)
         this.poi.searchNearBy(v, this.map.getCenter(), 50000)
       }
     },
@@ -161,6 +166,13 @@ export default {
         margin: 0;
       }
     }
+
+    .el-input-group__append {
+      background: $primaryColor;
+      color: #fff;
+      padding: 0 12px;
+      cursor: pointer;
+    }
   }
 }
 </style>