设计师招募

src/views/storeManagement/addDesignerPage.vue

@@ -1,10 +1,16 @@
 <template>
   <div class="addDesignerPage">
     <div class="header">
-      <van-nav-bar class="navBar" title="设计师招募" left-arrow @click-left="onClickLeft" />
+      <van-nav-bar
+        class="navBar"
+        title="设计师招募"
+        left-arrow
+        @click-left="onClickLeft"
+        right-text="保存"
+        @click-right="onSubmit" />
     </div>
     <div class="content">
-      <van-form ref="tabstoreVal" @submit="onSubmit" :scroll-to-error="true" :show-error="false">
+      <van-form ref="tabstoreVal" :scroll-to-error="true" :show-error="false">
         <van-field readonly :value="fromData.storeCode" label="客户编号">
           <template #left-icon>
             <span class="van-f-red"></span>
@@ -47,7 +53,13 @@
               :value="fromData.chainName"
               label="经销商名称"
               placeholder="点击选择经销商名称"
-              @click="showPickerChainsList = true">
+              @click="showPickerChainsList = true"
+              :rules="[
+                {
+                  required: true,
+                  message: '请选择经销商',
+                },
+              ]">
               <template #left-icon>
                 <span class="van-f-red">*</span>
               </template>
@@ -160,11 +172,17 @@
         <van-field
           v-model="fromData.addressLine"
           label="地址"
-          placeholder="地址"
+          placeholder="请输入地址"
           rows="1"
           autosize
           type="textarea"
-          @blur="addressFn">
+          @blur="addressFn"
+          :rules="[
+            {
+              required: true,
+              message: '请输入地址',
+            },
+          ]">
           <template #left-icon>
             <span class="van-f-red">*</span>
           </template>
@@ -174,6 +192,7 @@
             >
           </template>
         </van-field>
+        <van-field v-model="fromData.remark" label="备注" placeholder="请输入备注"> </van-field>
       </van-form>
     </div>
     <!--经销商-->
@@ -332,7 +351,7 @@ import {
 } from '@/api/index';
 import { validatePhone } from '@/utils';
 import { jsonp } from 'vue-jsonp';
-import { getPosition, getTicketFun, getGeocoder } from '@/utils/TXApiFun';
+import { getPosition, getTicketFun, getMapPoi, getkeywordPoi, getGeocoder } from '@/utils/TXApiFun';
 export default {
   data() {
     return {
@@ -351,6 +370,7 @@ export default {
         addressLine: '',
         lat: '',
         lon: '',
+        remark: '',
       },
       showPickerChainsList: false, //经销商列表弹框
       ChainsList: [], //经销商列表
@@ -578,19 +598,30 @@ export default {
     },
     fns() {
       this.search = '';
-      this.showmap = true;
-      jsonp(
-        'https://apis.map.qq.com/ws/place/v1/search?boundary=nearby(' +
-          this.location.lat1 +
-          ',' +
-          this.location.lon1 +
-          ',1000,0)&page_size=10&page_index=1&orderby=_distance&output=jsonp&key=WLCBZ-HRM6L-YOMPV-ME62B-AQOG6-JUBW6'
-      ).then((res) => {
-        this.maplist = res.data;
-        setTimeout(() => {
-          this.addVisits1();
+      getPosition()
+        .then((res) => {
+          let { TXisBD, resData } = res;
+          this.pLat = resData.latitude;
+          this.pLot = resData.longitude;
+          if (this.fromValue.lon == '') {
+            this.fromValue.lon = TXisBD.lon;
+            this.fromValue.lat = TXisBD.lat;
+          }
+          this.showmap = true;
+          // 地点搜索 获取500米范围poi点
+          getMapPoi({ latitude: this.pLat, longitude: this.pLot }).then((res) => {
+            console.log(res);
+            this.maplist = res.data;
+            setTimeout(() => {
+              this.addVisits1('1');
+            });
+          });
+        })
+        .catch((error) => {
+          this.$dialog.alert({
+            message: error,
+          });
         });
-      });
       this.addresssb = -1;
     },
     addVisits1() {
@@ -674,18 +705,18 @@ export default {
     },
     searchFn(val) {
       this.searchSHow = false;
-      jsonp(
-        'https://apis.map.qq.com/ws/place/v1/suggestion?keyword=' +
-          val +
-          '&location=' +
-          this.location.lat1 +
-          ',' +
-          this.location.lon1 +
-          '&output=jsonp&key=WLCBZ-HRM6L-YOMPV-ME62B-AQOG6-JUBW6&page_size=20&region_fix=1'
-      ).then((res) => {
-        this.searchSHow = true;
-        this.mapsearchlist = res.data;
-      });
+      getkeywordPoi({ latitude: this.location.lat1, longitude: this.location.lon1 }, val).then(
+        (res) => {
+          // 不显示下拉选择
+          if (!res.data.length && !val) {
+            this.searchSHow = false;
+          } else {
+            this.searchSHow = true;
+          }
+          // 联想下拉选
+          this.mapsearchlist = res.data;
+        }
+      );
     },
     addressFns(val) {
       var that = this;
@@ -746,7 +777,9 @@ export default {
     addressFn() {
       localStorage.setItem('locationRemark', this.fromData.addressLine);
     },
-    onSubmit() {},
+    onSubmit() {
+      this.$refs.tabstoreVal.submit();
+    },
     onClickLeft() {
       this.$router.go(-1);
     },
@@ -757,11 +790,14 @@ export default {
 .addDesignerPage {
   display: flex;
   flex-direction: column;
+  width: 100%;
+  height: 100%;
   .header {
     height: 46px;
   }
   .content {
     flex: 1;
+    overflow-y: auto;
   }
 }
 </style>