sc

src/views/Home/CloseRate.vue

@@ -0,0 +1,7 @@
+<template>
+  <div> 成交率 </div>
+</template>
+
+<script setup name="CloseRate"></script>
+
+<style lang="scss" scoped></style>

src/views/SchoolManagement/Place/index.vue

@@ -71,7 +71,8 @@
     </div>
 
     <!-- 左侧场地弹框 -->
-    <el-card v-if="placeDialogShow" class="place-dialog" :body-style="{ padding: '10px' }">
+    <div class="place-dialog">
+      <el-card v-if="placeDialogShow" :body-style="{ padding: '10px' }">
         <template #header>
           <div class="clearfix">
             <div class="map-card-title">场地设置</div>
@@ -86,7 +87,12 @@
           <el-tab-pane label="场地信息" name="info">
             <el-form ref="FormPlace" :model="placeForm" label-width="70px">
               <el-form-item label="所属驾校" prop="schoolId">
-              <el-select v-model="placeForm.schoolId" placeholder="请选择" clearable class="w-full">
+                <el-select
+                  v-model="placeForm.schoolId"
+                  placeholder="请选择"
+                  clearable
+                  class="w-full"
+                >
                   <el-option
                     v-for="dict in schoolList"
                     :key="dict.schoolId"
@@ -109,10 +115,22 @@
                 <el-input v-model="placeForm.address" placeholder="输入地址" />
               </el-form-item>
               <el-form-item label="经度" prop="lng">
-              <el-input v-model="placeForm.lng" placeholder="输入经度" />
+                <el-input-number
+                  v-model="placeForm.lng"
+                  :min="1"
+                  :controls="false"
+                  placeholder="输入经度"
+                  style="width: 100%"
+                />
               </el-form-item>
               <el-form-item label="纬度" prop="lat">
-              <el-input v-model="placeForm.lat" placeholder="输入纬度" />
+                <el-input-number
+                  v-model="placeForm.lat"
+                  :min="1"
+                  :controls="false"
+                  placeholder="输入纬度"
+                  style="width: 100%"
+                />
               </el-form-item>
               <el-form-item label="所属区域" prop="area">
                 <el-select v-model="placeForm.area" placeholder="请选择" clearable class="w-full">
@@ -130,10 +148,10 @@
               <el-form-item label="负责人" prop="contact">
                 <el-input v-model="placeForm.contact" placeholder="输入负责人" />
               </el-form-item>
-            <el-form-item label="是否推荐" prop="contact">
+              <!-- <el-form-item label="是否推荐" prop="contact">
               <el-radio v-model="placeForm.recommend" :label="true">是</el-radio>
               <el-radio v-model="placeForm.recommend" :label="false">否</el-radio>
-            </el-form-item>
+            </el-form-item> -->
             </el-form>
           </el-tab-pane>
           <el-tab-pane label="描述" name="desc">
@@ -145,6 +163,15 @@
           <el-button @click="closePlaceDialog">取消</el-button>
         </div>
       </el-card>
+      <el-autocomplete
+        class="ml-10px"
+        v-model="areaValue"
+        clearable
+        placeholder="输入并搜索位置"
+        :fetch-suggestions="remoteMethod"
+        @select="currentSelect"
+      />
+    </div>
 
     <!-- 底部驾校场地列表 -->
     <el-card
@@ -234,6 +261,7 @@
 
 <script setup name="Place">
 import * as PlaceApi from '@/api/school/place'
+import { getConfigByConfigKey } from '@/api/system/set'
 import { getAreaSimpleList } from '@/api/school/setting/area'
 import { checkPermi } from '@/utils/permission'
 
@@ -267,18 +295,35 @@ const mapHelpText = ref('')
 const tipPostion = ref({})
 const placeTab = ref('info')
 
-function initMap() {
+const defaultLatLng = ref({
+  lat: 31.86119,
+  lng: 117.283042
+})
+const defaultCity = ref('合肥')
+
+let AutoComplete = ref(null)
+async function initMap() {
+  const data = await getConfigByConfigKey({ configKey: 'defaultLocation' })
+  const cityInfo = JSON.parse(data.configValue)
+  defaultLatLng.value = {
+    lat: cityInfo.lat,
+    lng: cityInfo.lng
+  }
+  defaultCity.value = cityInfo.locationName
   AMapLoader.load({
     key: '713d839ff505943b0f18e6df45f3b0dc', //设置您的key
     version: '2.0',
-    plugins: ['AMap.Geocoder']
+    plugins: ['AMap.Geocoder', 'AMap.AutoComplete']
   }).then((AMap) => {
     aMap.value = AMap
     geoCoder.value = new AMap.Geocoder()
     dialogMap.value = new AMap.Map('dialogMap', {
       zoom: 12,
       zooms: [2, 22],
-      center: [117.283042, 31.86119]
+      center: [defaultLatLng.value.lng, defaultLatLng.value.lat]
+    })
+    AutoComplete.value = new AMap.AutoComplete({
+      city: defaultCity.value
     })
     locationMarker.value = new AMap.Marker({
       icon: FlagRed
@@ -313,6 +358,32 @@ function initMap() {
   })
 }
 
+const areaValue = ref('')
+function remoteMethod(searchValue, cb) {
+  if (searchValue) {
+    AutoComplete.value?.search(searchValue, (status, result) => {
+      if (result.tips?.length) {
+        // areaList.value = result?.tips
+        const list = result.tips.map((it) => ({
+          ...it,
+          value: it.name
+        }))
+        cb(list)
+      } else {
+        cb([])
+      }
+    })
+  } else {
+    cb([])
+  }
+}
+
+function currentSelect(val) {
+  if (val) {
+    dialogMap.value.setCenter([val.location?.lng, val.location?.lat], true)
+  }
+}
+
 function regeoCode() {
   geoCoder.value.getAddress([placeForm.value.lng, placeForm.value.lat], (status, result) => {
     if (status === 'complete' && result.regeocode) {
@@ -678,7 +749,8 @@ onMounted(() => {
   position: absolute;
   left: 20px;
   top: 20px;
-  width: 350px;
+  width: 500px;
+  display: flex;
 }
 
 .map-tip {