Refactor:分包
This commit is contained in:
@@ -0,0 +1,165 @@
|
||||
<template>
|
||||
<view class="evaluate-list" ref="container">
|
||||
<view class="header">
|
||||
<view class="generalComment acea-row row-between-wrapper">
|
||||
<view class="acea-row row-middle font-color-red">
|
||||
<text class="evaluate">评分</text>
|
||||
<view class="start" :class="'star' + replyData.replyStar"></view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="font-color-red">{{ isTravelGroup ? replyData.replyChance || 0 : replyData.replyChance + '%' || 0 }}</text>
|
||||
<text> {{ ` 好评率` }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="nav acea-row row-middle">
|
||||
<view
|
||||
class="acea-row row-center-wrapper"
|
||||
v-for="(item, navListIndex) in navList"
|
||||
:key="navListIndex"
|
||||
@click="changeType(navListIndex)"
|
||||
>
|
||||
<view
|
||||
class="item"
|
||||
:class="currentActive === navListIndex ? 'bg-color-red' : ''"
|
||||
v-if="item.num"
|
||||
>
|
||||
<text>{{ item.evaluate }}({{ item.num }})</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<UserEvaluation :reply="reply"></UserEvaluation>
|
||||
<Loading :loaded="loadend" :loading="loading"></Loading>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import UserEvaluation from "@/components/UserEvaluation";
|
||||
import { getReplyConfig, getReplyList } from "@/api/store";
|
||||
import { getJiaLouProductReply, getJiaLouProductReplyCount } from "@/api/qianxian";
|
||||
import Loading from "@/components/Loading";
|
||||
|
||||
export default {
|
||||
name: "EvaluateList",
|
||||
components: {
|
||||
UserEvaluation,
|
||||
Loading
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
product_id: 0,
|
||||
isTravelGroup: false,
|
||||
replyData: {},
|
||||
navList: [
|
||||
{ evaluate: "全部", num: 0 },
|
||||
{ evaluate: "好评", num: 0 },
|
||||
{ evaluate: "中评", num: 0 },
|
||||
{ evaluate: "差评", num: 0 }
|
||||
],
|
||||
currentActive: 0,
|
||||
page: 1,
|
||||
limit: 8,
|
||||
reply: [],
|
||||
loadTitle: "",
|
||||
loading: false,
|
||||
loadend: false
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
this.product_id = this.$yroute.query.id;
|
||||
this.isTravelGroup = String(this.$yroute.query.isTravelGroup || '') === '1';
|
||||
this.getProductReplyCount();
|
||||
this.getProductReplyList();
|
||||
},
|
||||
onReachBottom() {
|
||||
!this.loading && this.getProductReplyList();
|
||||
},
|
||||
methods: {
|
||||
getProductReplyCount: function() {
|
||||
let that = this;
|
||||
if (that.isTravelGroup) {
|
||||
getJiaLouProductReplyCount({
|
||||
travelGroupProductId: that.product_id
|
||||
}).then(res => {
|
||||
const data = res.data || {};
|
||||
that.$set(that, "replyData", data);
|
||||
that.navList[0].num = data.sumCount || 0;
|
||||
that.navList[1].num = data.goodCount || 0;
|
||||
that.navList[2].num = data.inCount || 0;
|
||||
that.navList[3].num = data.poorCount || 0;
|
||||
});
|
||||
} else {
|
||||
getReplyConfig(that.product_id).then(res => {
|
||||
const data = res.data || {};
|
||||
that.$set(that, "replyData", data);
|
||||
that.navList[0].num = data.sumCount || 0;
|
||||
that.navList[1].num = data.goodCount || 0;
|
||||
that.navList[2].num = data.inCount || 0;
|
||||
that.navList[3].num = data.poorCount || 0;
|
||||
});
|
||||
}
|
||||
},
|
||||
getProductReplyList: function() {
|
||||
let that = this;
|
||||
if (that.loading) return;
|
||||
if (that.loadend) return;
|
||||
that.loading = true;
|
||||
let q = { page: that.page, limit: that.limit, type: that.currentActive };
|
||||
if (that.isTravelGroup) {
|
||||
getJiaLouProductReply({
|
||||
travelGroupProductId: that.product_id,
|
||||
type: q.type,
|
||||
page: q.page,
|
||||
limit: q.limit
|
||||
}).then(res => {
|
||||
that.loading = false;
|
||||
const pageData = res.data || {};
|
||||
const rawList = Array.isArray(pageData.records) ? pageData.records : [];
|
||||
const list = rawList.map(item => {
|
||||
const productScore = Number(item.productScore) || 0;
|
||||
const serviceScore = Number(item.serviceScore) || 0;
|
||||
let star = productScore || serviceScore || 5;
|
||||
const skuText = '默认';
|
||||
const picturesArr = Array.isArray(item.pics) ? item.pics : [];
|
||||
return {
|
||||
...item,
|
||||
star,
|
||||
sku: item.travelGroupProductName || skuText,
|
||||
picturesArr
|
||||
};
|
||||
});
|
||||
that.reply.push.apply(that.reply, list);
|
||||
that.loadend = list.length < that.limit || !pageData.pages || that.page >= pageData.pages;
|
||||
that.page = that.page + 1;
|
||||
}).catch(() => {
|
||||
that.loading = false;
|
||||
});
|
||||
} else {
|
||||
getReplyList(that.product_id, q).then(res => {
|
||||
that.loading = false;
|
||||
const data = res.data || [];
|
||||
that.reply.push.apply(that.reply, data);
|
||||
that.loadend = data.length < that.limit;
|
||||
that.page = that.page + 1;
|
||||
}).catch(() => {
|
||||
that.loading = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
changeType: function(index) {
|
||||
let that = this;
|
||||
that.currentActive = index;
|
||||
that.page = 1;
|
||||
that.loadend = false;
|
||||
that.$set(that, "reply", []);
|
||||
that.getProductReplyList();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.noCommodity {
|
||||
height: 8*100rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<view ref="container">
|
||||
<view class="collectionGoods" v-if="collectProductList.length > 0">
|
||||
<view
|
||||
class="item acea-row row-between-wrapper"
|
||||
v-for="(item, collectProductListIndex) in collectProductList"
|
||||
:key="collectProductListIndex"
|
||||
@click="goGoodsCon(item)"
|
||||
>
|
||||
<view class="pictrue">
|
||||
<image :src="item.image" />
|
||||
</view>
|
||||
<view class="text acea-row row-column-between">
|
||||
<view class="infor line1">{{ item.storeName }}</view>
|
||||
<view class="acea-row row-between-wrapper">
|
||||
<view class="money font-color-red">¥{{ item.price }}</view>
|
||||
<view class="delete" @tap.stop="delCollection(collectProductListIndex)">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<Loading :loaded="loadend" :loading="loading"></Loading>
|
||||
<view
|
||||
class="noCommodity"
|
||||
style="background-color:#fff;"
|
||||
v-if="collectProductList.length < 1 && page > 1"
|
||||
>
|
||||
<view class="noPictrue">
|
||||
<image :src="webUrl+'/20210203154659687348.png'" class="image" />
|
||||
</view>
|
||||
<Recommend></Recommend>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import Recommend from "@/components/Recommend";
|
||||
import { getCollectUser, getCollectDel } from "@/api/user";
|
||||
import Loading from "@/components/Loading";
|
||||
export default {
|
||||
name: "GoodsCollection",
|
||||
components: {
|
||||
Recommend,
|
||||
Loading
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
webUrl:this.$VUE_APP_RESOURCES_URL,
|
||||
page: 1,
|
||||
limit: 20,
|
||||
collectProductList: [],
|
||||
loadTitle: "",
|
||||
loading: false,
|
||||
loadend: false
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
this.get_user_collect_product();
|
||||
},
|
||||
onReachBottom() {
|
||||
!this.loading && this.get_user_collect_product();
|
||||
},
|
||||
methods: {
|
||||
goGoodsCon(item) {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/shop/GoodsCon/index",
|
||||
query: { id: item.pid }
|
||||
});
|
||||
},
|
||||
get_user_collect_product: function() {
|
||||
let that = this;
|
||||
if (that.loading) return; //阻止下次请求(false可以进行请求);
|
||||
if (that.loadend) return; //阻止结束当前请求(false可以进行请求);
|
||||
that.loading = true;
|
||||
getCollectUser(that.page, that.limit).then(res => {
|
||||
that.loading = false;
|
||||
//apply();js将一个数组插入另一个数组;
|
||||
that.collectProductList.push.apply(that.collectProductList, res.data);
|
||||
that.loadend = res.data.length < that.limit; //判断所有数据是否加载完成;
|
||||
that.page = that.page + 1;
|
||||
});
|
||||
},
|
||||
//删除收藏;
|
||||
delCollection: function(index) {
|
||||
let that = this,
|
||||
id = that.collectProductList[index].pid,
|
||||
category = that.collectProductList[index].category;
|
||||
getCollectDel(id, category).then(function() {
|
||||
uni.showToast({
|
||||
title: "删除成功",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
complete: () => {
|
||||
that.collectProductList.splice(index, 1);
|
||||
that.$set(that, "collectProductList", that.collectProductList);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,258 @@
|
||||
<template>
|
||||
<view class="evaluate-con">
|
||||
<view
|
||||
v-if="isTravelGroup && travelOrderInfo && travelOrderInfo.travelGroupOrderInfo && travelOrderInfo.travelGroupOrderInfo.travelGroupProduct"
|
||||
class="goodsStyle acea-row row-between"
|
||||
>
|
||||
<view class="pictrue">
|
||||
<image :src="travelOrderInfo.travelGroupOrderInfo.travelGroupProduct.mainImage" class="image"/>
|
||||
</view>
|
||||
<view class="text acea-row row-between">
|
||||
<view class="name line2">{{ travelOrderInfo.travelGroupOrderInfo.travelGroupProduct.name }}</view>
|
||||
<view class="money">
|
||||
<view>¥{{ travelOrderInfo.travelGroupOrderInfo.travelGroupProduct.price }}</view>
|
||||
<view class="num">x1</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
v-else-if="orderCon.productInfo"
|
||||
class="goodsStyle acea-row row-between"
|
||||
>
|
||||
<view class="pictrue">
|
||||
<image :src="orderCon.productInfo.image" class="image"/>
|
||||
</view>
|
||||
<view class="text acea-row row-between">
|
||||
<view class="name line2">{{ orderCon.productInfo.storeName }}</view>
|
||||
<view class="money">
|
||||
<view>¥{{ orderCon.productInfo.price }}</view>
|
||||
<view class="num">x{{ orderCon.cartNum }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="score">
|
||||
<view
|
||||
v-for="(item, scoreListIndexw) in scoreList"
|
||||
:key="scoreListIndexw"
|
||||
class="item acea-row row-middle"
|
||||
>
|
||||
<view>{{ item.name }}</view>
|
||||
<view class="starsList">
|
||||
<text
|
||||
v-for="(itemn, starsIndexn) in item.stars"
|
||||
:key="starsIndexn"
|
||||
:class="item.index >= starsIndexn ? 'icon-shitixing font-color-red' : 'icon-kongxinxing'"
|
||||
class="iconfont"
|
||||
@click="stars(starsIndexn, scoreListIndexw)"
|
||||
/>
|
||||
</view>
|
||||
<text class="evaluate">{{ item.index === -1 ? "" : item.index + 1 + "分" }}</text>
|
||||
</view>
|
||||
<view class="textarea">
|
||||
<textarea
|
||||
v-model="expect"
|
||||
placeholder="商品满足你的期待么?说说你的想法,分享给想买的他们吧~"
|
||||
:maxlength="140"
|
||||
/>
|
||||
<view class="v12-px-4 v12-font-24 v12-dark1-text v12-mb-3">{{ expect.length || 0 }} / 140</view>
|
||||
<view class="upload-title">
|
||||
添加视频/图片
|
||||
<text class="txt">
|
||||
({{ videoArr.length + picArr.length }}/9)
|
||||
</text>
|
||||
</view>
|
||||
<view class="upload-wrapper">
|
||||
<view v-show="picArr.length < 9" class="video-upload">
|
||||
<tm-upload
|
||||
:upload_img_wh="uploadImgWH"
|
||||
:upload_max="1"
|
||||
:upload_count="1"
|
||||
:url="uploadUrl"
|
||||
:header="uploadHeader"
|
||||
type='video'
|
||||
@change="uploadedVideoChange"
|
||||
/>
|
||||
</view>
|
||||
<view class="pic-upload">
|
||||
<tm-upload
|
||||
:upload_img_wh="uploadImgWH"
|
||||
:upload_max="9 - videoArr.length"
|
||||
:upload_count="9 - videoArr.length"
|
||||
:url="uploadUrl"
|
||||
:header="uploadHeader"
|
||||
:showBlankPlaceholder="picArr.length !== 9"
|
||||
type='image'
|
||||
@change="uploadedPicChange"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="evaluateBnt bg-color-red" @click="submit">立即评价</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { postOrderComment, postOrderProduct } from '@/api/store'
|
||||
import { fetchSojoumOrderDetail, sojoumOrderComment } from '@/api/sojoumOrder'
|
||||
import { trim } from '@/utils'
|
||||
import { required } from '@/utils/validate'
|
||||
import { validatorDefaultCatch } from '@/utils/dialog'
|
||||
import tmUpload from '@/components/tm-upload/tm-upload.vue'
|
||||
import {
|
||||
VUE_APP_API_URL
|
||||
} from '@/config'
|
||||
|
||||
export default {
|
||||
name: 'GoodsEvaluate',
|
||||
components: {
|
||||
tmUpload
|
||||
},
|
||||
props: {},
|
||||
data: function () {
|
||||
return {
|
||||
uploadUrl: VUE_APP_API_URL + '/api/upload',
|
||||
uploadImgWH: (750 - 3 * 16 - 2 * 32 - 16) / 3.0,
|
||||
uploadHeader: {
|
||||
Authorization: "Bearer " + this.$store.getters.token
|
||||
},
|
||||
orderCon: {
|
||||
cartProduct: {
|
||||
productInfo: {}
|
||||
}
|
||||
},
|
||||
isTravelGroup: false,
|
||||
travelOrderInfo: null,
|
||||
scoreList: [
|
||||
{
|
||||
name: '商品质量',
|
||||
stars: ['', '', '', '', ''],
|
||||
index: -1
|
||||
},
|
||||
{
|
||||
name: '服务态度',
|
||||
stars: ['', '', '', '', ''],
|
||||
index: -1
|
||||
}
|
||||
],
|
||||
uploadPictures: [],
|
||||
expect: '',
|
||||
unique: '',
|
||||
picArr: [],
|
||||
videoArr: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.unique = this.$yroute.query.id
|
||||
this.isTravelGroup = this.$yroute.query.isTravelGroup === '1'
|
||||
if (this.isTravelGroup) {
|
||||
this.getTravelOrderDetail()
|
||||
} else {
|
||||
this.getOrderProduct()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getTravelOrderDetail() {
|
||||
fetchSojoumOrderDetail({ key: this.unique }).then(res => {
|
||||
this.travelOrderInfo = res.data
|
||||
})
|
||||
},
|
||||
getOrderProduct() {
|
||||
postOrderProduct(this.unique).then(res => {
|
||||
this.orderCon = res.data
|
||||
})
|
||||
},
|
||||
stars: function (indexn, indexw) {
|
||||
this.scoreList[indexw].index = indexn
|
||||
},
|
||||
uploadedVideoChange(uploadList) {
|
||||
this.videoArr = uploadList
|
||||
},
|
||||
uploadedPicChange(uploadList) {
|
||||
this.picArr = uploadList
|
||||
},
|
||||
async submit() {
|
||||
const expect = trim(this.expect).substring(0, 140)
|
||||
const product_score = this.scoreList[0].index + 1 === 0 ? "" : this.scoreList[0].index + 1
|
||||
const service_score = this.scoreList[1].index + 1 === 0 ? "" : this.scoreList[1].index + 1
|
||||
try {
|
||||
await this.$validator({
|
||||
product_score: [
|
||||
required('请选择商品质量分数', {
|
||||
type: 'number'
|
||||
})
|
||||
],
|
||||
service_score: [
|
||||
required('请选择服务态度分数', {
|
||||
type: 'number'
|
||||
})
|
||||
]
|
||||
}).validate({
|
||||
product_score,
|
||||
service_score
|
||||
})
|
||||
} catch (e) {
|
||||
return validatorDefaultCatch(e)
|
||||
}
|
||||
const pics = this.picArr
|
||||
const video = this.videoArr[0] || ''
|
||||
const request = this.isTravelGroup
|
||||
? sojoumOrderComment({
|
||||
orderId: this.unique,
|
||||
comment: expect,
|
||||
pics,
|
||||
video,
|
||||
productScore: product_score,
|
||||
serviceScore: service_score
|
||||
})
|
||||
: postOrderComment({
|
||||
productScore: product_score,
|
||||
serviceScore: service_score,
|
||||
unique: this.unique,
|
||||
pics: this.picArr.join(','),
|
||||
comment: expect,
|
||||
video: this.videoArr.join(',')
|
||||
})
|
||||
request.then(() => {
|
||||
uni.showToast({
|
||||
title: '评价成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
})
|
||||
this.$yrouter.back()
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg || err.response.data.message,
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.upload-title {
|
||||
padding: 0 0 20rpx 16rpx;
|
||||
.txt {
|
||||
color: #999;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
.upload-wrapper {
|
||||
position: relative;
|
||||
padding: 0 0 0 16rpx;
|
||||
.video-upload {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 16rpx;
|
||||
z-index: 5;
|
||||
}
|
||||
.pic-upload {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
.evaluate-con .score .textarea .list .pictrue.uploadBnt {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,78 @@
|
||||
<template>
|
||||
<view class="quality-recommend">
|
||||
<!-- <view class="slider-banner swiper">
|
||||
<swiper indicatorDots="true" v-if="banner.length > 0">
|
||||
<block v-for="(item, imgUrlsIndex) in imgUrls" :key="imgUrlsIndex">
|
||||
<swiper-item>
|
||||
<image :src="item.img" class="slide-image" />
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view> -->
|
||||
<view class="title acea-row row-center-wrapper">
|
||||
<view class="line"></view>
|
||||
<view class="name">
|
||||
<text class="iconfont icon-cuxiaoguanli"></text>促销单品
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
</view>
|
||||
<Promotion-good :benefit="goodsList"></Promotion-good>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
// import { swiper, swiperSlide } from "vue-awesome-swiper";
|
||||
|
||||
import PromotionGood from "@/components/PromotionGood";
|
||||
import {
|
||||
getGroomList
|
||||
} from "@/api/store";
|
||||
export default {
|
||||
name: "GoodsPromotion",
|
||||
components: {
|
||||
// swiper,
|
||||
// swiperSlide,
|
||||
PromotionGood
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
imgUrls: [],
|
||||
goodsList: [],
|
||||
RecommendSwiper: {
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
clickable: true
|
||||
},
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
}
|
||||
};
|
||||
},
|
||||
mounted: function() {
|
||||
this.getIndexGroomList();
|
||||
},
|
||||
methods: {
|
||||
getIndexGroomList: function() {
|
||||
let that = this;
|
||||
getGroomList(4)
|
||||
.then(res => {
|
||||
that.imgUrls = res.data.banner;
|
||||
that.goodsList = res.data.list;
|
||||
})
|
||||
.catch((err) => {
|
||||
uni.showToast({
|
||||
title: err.msg || err.response.data.msg|| err.response.data.message,
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,196 @@
|
||||
<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>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Loading from "@/components/Loading";
|
||||
import {storeListApi} from "@/api/store";
|
||||
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", "goName"]),
|
||||
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: {
|
||||
showMaoLocation(data) {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/map/index",
|
||||
query: data
|
||||
});
|
||||
},
|
||||
// 选中门店
|
||||
checked(e) {
|
||||
if (this.goName === "orders") {
|
||||
this.$store.commit("get_store", e);
|
||||
this.$yrouter.back();
|
||||
}
|
||||
},
|
||||
// 获取门店列表数据
|
||||
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>
|
||||
Reference in New Issue
Block a user