From 204ea408b8b5200bca7dbb2272b010ebbc61ae86 Mon Sep 17 00:00:00 2001
From: Gao xiaosong <704041637@qq.com>
Date: Mon, 15 Jun 2020 07:31:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=97=A8=E5=BA=97=E4=BF=A1?=
=?UTF-8?q?=E6=81=AF=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
api/store.js | 16 ++-
pages.json | 6 +
pages/shop/GoodsCon/index.vue | 7 +-
pages/shop/StoreList/index.vue | 210 +++++++++++++++++++++++++++++++++
pages/user/User/index.vue | 2 +-
5 files changed, 234 insertions(+), 7 deletions(-)
create mode 100644 pages/shop/StoreList/index.vue
diff --git a/api/store.js b/api/store.js
index 467b0b3..53fcdcf 100644
--- a/api/store.js
+++ b/api/store.js
@@ -56,11 +56,11 @@ export function toCollect(id, category) {
export function getHostProducts(page, limit) {
return request.get(
"/product/hot", {
- page: page,
- limit: limit
- }, {
- login: false
- }
+ page: page,
+ limit: limit
+ }, {
+ login: false
+ }
);
}
@@ -167,3 +167,9 @@ export function postOrderComment(data) {
login: true
});
}
+
+export function storeListApi(data) {
+ return request.get("store_list", data, {
+ login: false
+ });
+}
diff --git a/pages.json b/pages.json
index 7b051ae..e91d6e1 100644
--- a/pages.json
+++ b/pages.json
@@ -60,6 +60,12 @@
"navigationBarTitleText": "购物车"
}
},
+ {
+ "path": "pages/shop/StoreList/index",
+ "style": {
+ "navigationBarTitleText": "商家列表"
+ }
+ },
{
"path": "pages/shop/GoodsList/index",
"style": {
diff --git a/pages/shop/GoodsCon/index.vue b/pages/shop/GoodsCon/index.vue
index 84b0b67..c9a5722 100644
--- a/pages/shop/GoodsCon/index.vue
+++ b/pages/shop/GoodsCon/index.vue
@@ -46,7 +46,7 @@
<view class="store-info">
<view class="title acea-row row-between-wrapper">
<view>门店信息</view>
- <text @click="goEvaluateList(id)" class="praise">
+ <text @click="goStoreList()" class="praise">
更多
<text class="iconfont icon-jiantou"></text>
</text>
@@ -302,6 +302,11 @@ export default {
path: "/pages/user/CustomerList/index"
});
},
+ goStoreList() {
+ this.$yrouter.push({
+ path: "/pages/shop/StoreList/index"
+ });
+ },
goEvaluateList(id) {
this.$yrouter.push({
path: "/pages/shop/EvaluateList/index",
diff --git a/pages/shop/StoreList/index.vue b/pages/shop/StoreList/index.vue
new file mode 100644
index 0000000..b2c396f
--- /dev/null
+++ b/pages/shop/StoreList/index.vue
@@ -0,0 +1,210 @@
+<template>
+ <view>
+ <view class="storeBox" ref="container">
+ <view
+ class="storeBox-box"
+ v-for="(item, index) in storeList"
+ :key="index"
+ @click="checked(item)"
+ >
+ <view class="store-img">
+ <img :src="item.image" lazy-load="true" />
+ </view>
+ <view class="store-cent-left">
+ <text class="store-name">{{ item.name }}</text>
+ <text class="store-address line1">{{ item.address }}</text>
+ </view>
+ <view class="row-right">
+ <view>
+ <a class="store-phone" :href="'tel:' + item.phone">
+ <text class="iconfont icon-dadianhua01"></text>
+ </a>
+ </view>
+ <view class="store-distance" @click="showMaoLocation(item)">
+ <text class="addressTxt" v-if="item.distance">距离{{ item.distance }}千米</text>
+ <text class="addressTxt" v-else>查看地图</text>
+ <text class="iconfont icon-youjian"></text>
+ </view>
+ </view>
+ </view>
+ <Loading :loaded="loaded" :loading="loading"></Loading>
+ </view>
+ <!-- <div>
+ <iframe
+ v-if="locationShow && !isWeixin"
+ ref="geoPage"
+ width="0"
+ height="0"
+ frameborder="0"
+ style="display:none;"
+ scrolling="no"
+ :src="
+ 'https://apis.map.qq.com/tools/geolocation?key=' +
+ mapKey +
+ '&referer=myapp'
+ "
+ ></iframe>
+ </div>
+ <div class="geoPage" v-if="mapShow">
+ <iframe
+ width="100%"
+ height="100%"
+ frameborder="0"
+ scrolling="no"
+ :src="
+ 'https://apis.map.qq.com/uri/v1/geocoder?coord=' +
+ system_store.latitude +
+ ',' +
+ system_store.longitude +
+ '&referer=' +
+ mapKey
+ "
+ ></iframe>
+ </div> -->
+ </div>
+</template>
+
+<script>
+import Loading from "@/components/Loading";
+import { storeListApi } from "@/api/store";
+import { isWeixin } from "@/utils/index";
+import { wechatEvevt, wxShowLocation } from "@/libs/wechat";
+import { mapGetters } from "vuex";
+import cookie from "@/utils/store/cookie";
+const LONGITUDE = "user_longitude";
+const LATITUDE = "user_latitude";
+const MAPKEY = "mapKey";
+export default {
+ name: "storeList",
+ components: { Loading },
+ computed: mapGetters(["location"]),
+ data() {
+ return {
+ page: 1,
+ limit: 20,
+ loaded: false,
+ loading: false,
+ storeList: [],
+ mapShow: false,
+ system_store: {},
+ mapKey: cookie.get(MAPKEY),
+ locationShow: false
+ };
+ },
+ mounted() {
+ this.getList();
+ },
+ onReachBottom() {
+ !this.loading && this.getOrderList();
+ },
+ methods: {
+ // 选中门店
+ checked(e) {
+ if (this.goName === "orders") {
+ this.$router.go(-1); //返回上一层
+ this.$store.commit("GET_STORE", e);
+ }
+ },
+ // 获取门店列表数据
+ getList: function() {
+ if (this.loading || this.loaded) return;
+ this.loading = true;
+ let data = {
+ latitude: this.location.latitude, //纬度
+ longitude: this.location.longitude, //经度
+ page: this.page,
+ limit: this.limit
+ };
+ storeListApi(data)
+ .then(res => {
+ this.loading = false;
+ this.loaded = res.data.list.length < this.limit;
+ this.storeList.push.apply(this.storeList, res.data.list);
+ this.page = this.page + 1;
+ this.mapKey = res.data.mapKey;
+ })
+ .catch(err => {
+ this.$dialog.error(err.msg);
+ });
+ }
+ }
+};
+</script>
+
+<style scoped lang="less">
+.geoPage {
+ position: fixed;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ z-index: 10000;
+}
+.storeBox {
+ background-color: #fff;
+ padding: 0 0.3*100rpx;
+}
+.storeBox-box {
+ width: 100%;
+ height: auto;
+ display: flex;
+ align-items: center;
+ padding: 0.23*100rpx 0;
+ justify-content: space-between;
+ border-bottom: 1px solid #eee;
+}
+.store-cent {
+ display: flex;
+ align-items: center;
+ width: 80%;
+}
+.store-cent-left {
+ width: 45%;
+ text{
+ display: block;
+ }
+}
+.store-img {
+ width: 1.2*100rpx;
+ height: 1.2*100rpx;
+ border-radius: 0.06*100rpx;
+ margin-right: 0.22*100rpx;
+}
+.store-img img {
+ width: 100%;
+ height: 100%;
+}
+.store-name {
+ color: #282828;
+ font-size: 0.3*100rpx;
+ margin-bottom: 0.22*100rpx;
+ font-weight: 800;
+}
+.store-address {
+ color: #666666;
+ font-size: 0.24*100rpx;
+}
+.store-phone {
+ width: 0.5*100rpx;
+ height: 0.5*100rpx;
+ color: #fff;
+ border-radius: 50%;
+ display: block;
+ text-align: center;
+ line-height: 0.5*100rpx;
+ background-color: #e83323;
+ margin-bottom: 0.22*100rpx;
+}
+.store-distance {
+ font-size: 0.22*100rpx;
+ color: #e83323;
+}
+.iconfont {
+ font-size: 0.2*100rpx;
+}
+.row-right {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-end;
+ width: 33.5%;
+}
+</style>
diff --git a/pages/user/User/index.vue b/pages/user/User/index.vue
index 60064c9..1c5a564 100644
--- a/pages/user/User/index.vue
+++ b/pages/user/User/index.vue
@@ -186,7 +186,7 @@ export default {
},
computed: mapGetters(["userInfo"]),
methods: {
- ...mapMutations(["updateAuthorizationPage", "CHANGE_TABTAR"]),
+ ...mapMutations(["updateAuthorizationPage", ]),
goReturnList() {
this.$yrouter.push("/pages/order/ReturnList/index");
},