feat: 自提点

server/controllers/activity.js

@@ -79,3 +79,37 @@ exports.checkActivityDetail = async ctx => {
   };
   ctx.body = await req(ctx, opts);
 };
+
+// 获取自提点列表
+exports.getPlaceList = async ctx => {
+  const url = `${ACTIVITY_URI}/marketing/background/take_place_list`;
+  const opts = {
+    url,
+    method: "GET"
+  };
+  ctx.body = await req(ctx, opts);
+};
+
+// 添加自提点
+exports.addPlace = async ctx => {
+  const url = `${ACTIVITY_URI}/marketing/background/add_take_place"`;
+  const opts = {
+    url,
+    method: "POST",
+    json: true,
+    body: ctx.request.body
+  };
+  ctx.body = await req(ctx, opts);
+};
+
+//删除自提点
+exports.deletePlace = async ctx => {
+  const url = `${ACTIVITY_URI}/marketing/background/delete_take_place`;
+  const opts = {
+    url,
+    method: "POST",
+    json: true,
+    body: ctx.request.body
+  };
+  ctx.body = await req(ctx, opts);
+};

server/router.js

@@ -67,6 +67,10 @@ router.get(`${API_VERSION}/marketing/background/marketing_list`, activity.getAct
 router.post(`${API_VERSION}/goods/background/edit_goods`, activity.editGoodsDetail)
 router.post(`${API_VERSION}/marketing/background/update_marketing`, activity.updateActivity)
 router.post(`${API_VERSION}/marketing/background/marketing_info`, activity.checkActivityDetail)
+//
+router.get(`${API_VERSION}/marketing/background/take_place_list`, activity.getPlaceList)
+router.post(`${API_VERSION}/marketing/background/add_take_place`, activity.addPlace)
+router.post(`${API_VERSION}/marketing/background/delete_take_place`, activity.deletePlace)
 
 //活动管理 
 router.get(`${API_VERSION}/goods/background/ota_list`, activity.getBusinessList);

src/main.js

@@ -14,7 +14,6 @@ import { redirectToLogin } from "./utils/util";
 
 // 处理路由权限
 router.beforeResolve(async (to, from, next) => {
-
   if (!to.meta.requireAuth) {
     next();
     return true;
@@ -22,9 +21,9 @@ router.beforeResolve(async (to, from, next) => {
 
   if (!store.state.permissions) {
     const { status, user } = await fetchCurrentUser();
-    if (status === 'success') {
-      store.commit('updateUserInfo', user);
-      await store.dispatch('updateUserPermission', { email: user.email })
+    if (status === "success") {
+      store.commit("updateUserInfo", user);
+      await store.dispatch("updateUserPermission", { email: user.email });
     } else {
       redirectToLogin();
       return false;
@@ -32,11 +31,11 @@ router.beforeResolve(async (to, from, next) => {
   }
 
   if (!checkPathAuth(to.path)) {
-    router.push({name: 'Forbidden'})
+    router.push({ name: "Forbidden" });
   } else {
-    next()
+    next();
   }
-})
+});
 
 createApp(App)
   .use(router)

src/pages/Activity/ActivityDetail/index.vue

@@ -107,6 +107,7 @@ export default {
         ElMessage.error("加载失败");
       }
     },
+
     // 时间差转时分秒
     getTimeout(timeCount) {
       if (timeCount > 0) {

src/pages/Activity/releaseProduc/components/myMap.vue

+<template>
+  <div id="map" class="mapContainer">
+    <!-- map -->
+    <div class="mapWrapper">
+      <div class="search" v-if="placeSearch">
+        <input type="text" placeholder="请输入关键字" v-model="searchKey" />
+        <button type="button" @click="handleSearch">搜索</button>
+      </div>
+      <div id="js-container" @drag="dragMap" class="myMap">
+        正在加载数据 ...
+      </div>
+    </div>
+    <!-- info -->
+
+    <div class="mapInfo">
+      <h3 class="title">拖拽选址</h3>
+      <ul class="info">
+        <li><span>经度：</span>{{ dragData.lng }}</li>
+        <li><span>纬度：</span>{{ dragData.lat }}</li>
+        <li><span>地址：</span>{{ dragData.address }}</li>
+        <li><span>最近的路口：</span>{{ dragData.nearestJunction }}</li>
+        <li><span>最近的路：</span>{{ dragData.nearestRoad }}</li>
+        <li><span>最近的POI：</span>{{ dragData.nearestPOI }}</li>
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script>
+import remoteLoad from "@/utils/remoteLoad.js";
+export default {
+  name: "app",
+  data() {
+    return {
+      MapCityName: "北京",
+      dragData: {
+        lng: null,
+        lat: null,
+        address: null,
+        nearestJunction: null,
+        nearestRoad: null,
+        nearestPOI: null
+      }
+    };
+  },
+  methods: {
+    dragMap(data) {
+      this.dragData = {
+        lng: data.position.lng,
+        lat: data.position.lat,
+        address: data.address,
+        nearestJunction: data.nearestJunction,
+        nearestRoad: data.nearestRoad,
+        nearestPOI: data.nearestPOI
+      };
+    },
+
+    // 初始化地图
+    initMap() {
+      // 加载PositionPicker，loadUI的路径参数为模块名中 'ui/' 之后的部分
+      let AMapUI = (this.AMapUI = window.AMapUI);
+      let AMap = (this.AMap = window.AMap);
+      AMapUI.loadUI(["misc/PositionPicker"], PositionPicker => {
+        let mapConfig = {
+          zoom: 16,
+          cityName: this.MapCityName
+        };
+        if (this.lat && this.lng) {
+          mapConfig.center = [this.lng, this.lat];
+        }
+        let map = new AMap.Map("js-container", mapConfig);
+        // 加载地图搜索插件
+        AMap.service("AMap.PlaceSearch", () => {
+          this.placeSearch = new AMap.PlaceSearch({
+            pageSize: 5,
+            pageIndex: 1,
+            citylimit: true,
+            city: this.MapCityName,
+            map: map,
+            panel: "js-result"
+          });
+        });
+        // 启用工具条
+        AMap.plugin(["AMap.ToolBar"], function() {
+          map.addControl(
+            new AMap.ToolBar({
+              position: "RB"
+            })
+          );
+        });
+        // 创建地图拖拽
+        let positionPicker = new PositionPicker({
+          mode: "dragMap", // 设定为拖拽地图模式，可选'dragMap'、'dragMarker'，默认为'dragMap'
+          map: map // 依赖地图对象
+        });
+        // 拖拽完成发送自定义 drag 事件
+        positionPicker.on("success", positionResult => {
+          // 过滤掉初始化地图后的第一次默认拖放
+          if (!this.dragStatus) {
+            this.dragStatus = true;
+          } else {
+            console.log(positionResult);
+            this.$emit("drag", positionResult);
+          }
+        });
+        // 启动拖放
+        positionPicker.start();
+      });
+    }
+  },
+  async created() {
+    console.log("niohao");
+    // 已载入高德地图API，则直接初始化地图
+    if (window.AMap && window.AMapUI) {
+      this.initMap();
+      // 未载入高德地图API，则先载入API再初始化
+    } else {
+      await remoteLoad(
+        `http://webapi.amap.com/maps?v=1.3&key=16fe8e3f4c4a6f4981626ef2cf7c759d`
+      );
+      await remoteLoad("http://webapi.amap.com/ui/1.0/main.js");
+      this.initMap();
+    }
+  }
+};
+</script>
+
+<style lang="less" scoped>
+.mapContainer {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  .mapWrapper {
+    width: 80%;
+    height: 500px;
+    .myMap {
+      height: 100%;
+      height: 500px;
+    }
+  }
+  .mapInfo {
+    width: 20%;
+  }
+}
+
+.g-wraper {
+  width: 1000px;
+  margin: 0 auto;
+  color: #666;
+  font-size: 16px;
+  line-height: 30px;
+}
+.m-part {
+  margin-bottom: 30px;
+}
+.m-part::after {
+  content: "";
+  display: block;
+  clear: both;
+}
+.m-part .title {
+  font-size: 30px;
+  line-height: 60px;
+  margin-bottom: 10px;
+  color: #333;
+}
+.m-part .mapbox {
+  width: 600px;
+  height: 400px;
+  margin-bottom: 20px;
+  float: left;
+}
+.m-part .info {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  line-height: 30px;
+  margin-left: 620px;
+}
+.m-part .info span {
+  display: block;
+  color: #999;
+}
+.m-part ol {
+  line-height: 40px;
+  margin-left: 0;
+  padding-left: 0;
+}
+.m-part pre {
+  padding: 10px 20px;
+  line-height: 30px;
+  border-radius: 3px;
+  box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
+}
+.m-footer {
+  background: #eee;
+  line-height: 60px;
+  text-align: center;
+  color: #999;
+  font-size: 12px;
+}
+.m-footer a {
+  margin: 0 5px;
+  color: #999;
+  text-decoration: none;
+}
+</style>

src/pages/Activity/releaseProduc/index.vue

@@ -41,12 +41,12 @@ export default {
   components: {
     infoEditing,
     addProduc,
-    spellOrderSet,
+    spellOrderSet
   },
   data() {
     return {
-      active: 1, // 步骤条状态
-      infoEditArr: [], // 信息编辑数据
+      active: 3, // 步骤条状态
+      infoEditArr: [] // 信息编辑数据
     };
   },
 
@@ -81,9 +81,9 @@ export default {
     // 确认发布
     confirmRelease() {
       this.$router.push({ path: "/op/activity/manage" });
+    }
   },
-  },
-  created() {},
+  created() {}
 };
 </script>
 
@@ -111,7 +111,7 @@ export default {
 }
 .content,
 .stepsBtn {
-  width: 64%;
+  width: 100%;
   margin: 20px auto;
 }
 .stepsBtn {

src/service/Activity/index.js

@@ -58,6 +58,39 @@ class ActivityService {
     );
     return res;
   }
+
+  // 获取自提点列表
+  static async getPlaceList(params) {
+    const res = await axios.get(
+      "/api/v1/marketing/background/take_place_list",
+      {
+        params
+      }
+    );
+    return res;
+  }
+
+  // 添加自提点
+  static async addPlace(query) {
+    const res = await axios.post(
+      "/api/v1/marketing/background/add_take_place",
+      {
+        ...query
+      }
+    );
+    return res;
+  }
+
+  //删除自提点
+  static async deletePlace(query) {
+    const res = await axios.post(
+      "/api/v1/marketing/background/delete_take_place",
+      {
+        ...query
+      }
+    );
+    return res;
+  }
 }
 
 export default ActivityService;

src/utils/remoteLoad.js

+export default function remoteLoad(url, hasCallback) {
+  return createScript(url);
+  /**
+   * 创建script
+   * @param url
+   * @returns {Promise}
+   */
+  function createScript(url) {
+    let scriptElement = document.createElement("script");
+    document.body.appendChild(scriptElement);
+    let promise = new Promise((resolve, reject) => {
+      scriptElement.addEventListener(
+        "load",
+        e => {
+          removeScript(scriptElement);
+          if (!hasCallback) {
+            resolve(e);
+          }
+        },
+        false
+      );
+
+      scriptElement.addEventListener(
+        "error",
+        e => {
+          removeScript(scriptElement);
+          reject(e);
+        },
+        false
+      );
+
+      if (hasCallback) {
+        window.____callback____ = function() {
+          resolve();
+          window.____callback____ = null;
+        };
+      }
+    });
+
+    if (hasCallback) {
+      url += "&callback=____callback____";
+    }
+
+    scriptElement.src = url;
+
+    return promise;
+  }
+
+  /**
+   * 移除script标签
+   * @param scriptElement script dom
+   */
+  function removeScript(scriptElement) {
+    document.body.removeChild(scriptElement);
+  }
+}