师傅圈展示其他城市师傅

This commit is contained in:
donqi 2022-12-28 23:32:27 +08:00
parent cc229f3cfb
commit 29eb03800e
4 changed files with 198 additions and 71 deletions

View File

@ -90,7 +90,7 @@ export default {
let curLocation = uni.getStorageSync('curLocation');
if (curLocation && curLocation.updateTimes) {
let curTimes = new Date().getTime();
let deltaSeconds = curTimes - Number(curLocation.updateTimes);
let deltaSeconds = curTimes - curLocation.updateTimes;
if (deltaSeconds >= 15 * 60 * 1000) {
// 设定重新获取定位的时间间隔为15分钟
await this.wxGetLocation();

View File

@ -89,7 +89,11 @@
<vertical-card :list="hotServCategory" :multiPicMode="true" title="大家都在买"></vertical-card>
</view>
<!-- 当前城市服务列表 -->
<view class="text-gray text-lg text-center margin">当前城市</view>
<view class="text-gray text-lg text-center margin flex align-center">
<view class="divider"/>
<text class="margin-lr-sm" style="flex-basis: 50%;">当前城市</text>
<view class="divider"/>
</view>
<view>
<view class="margin-top-sm margin-lr-sm waterfall-grid">
<view @click="showDetails(item)" v-for="(item, index) in productList" class="waterfall-grid-item">
@ -99,7 +103,11 @@
<load-status-bar ref="loadStatusBar1" @loadMore="loadProductPage"></load-status-bar>
</view>
<!-- 其他城市服务列表 -->
<view class="text-gray text-lg text-center margin">其他城市</view>
<view class="text-gray text-lg text-center margin flex align-center">
<view class="divider"/>
<text class="margin-lr-sm" style="flex-basis: 50%;">其他城市</text>
<view class="divider"/>
</view>
<view>
<view class="margin-top-sm margin-lr-sm waterfall-grid">
<view @click="showDetails(item)" v-for="(item, index) in otherCityProductList" class="waterfall-grid-item">

View File

@ -29,13 +29,15 @@
</view>
</view>
</view>
<!-- 当前定位城市师傅 -->
<view>
<!-- 师傅卡片 -->
<view v-for="(item, index) in workerInfos" class="bg-white padding margin-lr-sm margin-tb-sm shadow-warp">
<!-- 师傅信息 -->
<view class="solid-bottom padding-bottom-sm">
<view class="flex justify-start">
<view class="cu-avatar round" :style="'background-image:url(' + item.workerLogoUrl + '); width: 130rpx; height: 130rpx;'"></view>
<view class="margin-left-sm flex-column-between">
<view class="margin-left-sm flex-column-between text-beside-avatar">
<view class="text-black text-xl">{{item.name}}</view>
<view class="text-sm">
<view>
@ -99,7 +101,88 @@
class="text-bold cuIcon-right"></text></view>
</view>
</view>
<load-status-bar ref="loadStatusBar" @loadMore="loadWorkerPage"></load-status-bar>
<load-status-bar ref="loadStatusBar1" @loadMore="loadWorkerPage"></load-status-bar>
</view>
<!-- 其他城市师傅 -->
<view class="text-gray text-lg text-center margin flex align-center">
<view class="divider"/>
<text class="margin-lr-sm" style="flex-basis: 85%;">其他城市师傅</text>
<view class="divider"/>
</view>
<view>
<!-- 师傅卡片 -->
<view v-for="(item, index) in otherCityWorkers" class="bg-white padding margin-lr-sm margin-tb-sm shadow-warp">
<!-- 师傅信息 -->
<view class="solid-bottom padding-bottom-sm">
<view class="flex justify-start">
<view class="cu-avatar round" :style="'background-image:url(' + item.workerLogoUrl + '); width: 130rpx; height: 130rpx;'"></view>
<view class="margin-left-sm flex-column-between text-beside-avatar">
<view class="text-black text-xl">{{item.name}}</view>
<view class="text-sm">
<view>
<text class="margin-right-xs">服务技能:</text>
<text v-for="(skill, skillArrIndex) in item.goodsCategories">
<text>{{skill.goodsCategoryName}}</text>
<text v-if="skillArrIndex !== item.goodsCategories.length - 1"></text>
</text>
</view>
<view>
<text class="margin-right-xs">服务范围:</text>
<text v-for="(area, areaArrIndex) in item.workerAreas">
<text>{{getLastSplitAreaName(area.mergerName)}}</text>
<text v-if="areaArrIndex !== item.workerAreas.length - 1"></text>
</text>
</view>
</view>
</view>
</view>
<view class="text-sm padding-top">
<view class="flex justify-between">
<text>总评分<text class="text-red text-xl margin-left-xs">5.0</text> /5.0</text>
<uni-rate :readonly="true" allow-half :value="5" />
</view>
<view class="flex justify-between">
<view>
<text v-if="vCard.rateInfo.ratePoint" v-for="(ratePoint, index) in vCard.rateInfo.ratePoint">
<text>{{ratePoint.name}}</text><text class="margin-lr-xs">{{ratePoint.score}}</text>
</text>
</view>
<view class="text-sm" v-if="vCard.rateInfo.commentNum">评价({{vCard.rateInfo.commentNum}})<text
class="text-bold text-gray cuIcon-right"></text></view>
</view>
</view>
</view>
<!-- 服务列表 -->
<view class="padding-top-sm padding-bottom-xl grid text-center col-4 grid-square">
<view v-for="(product,index) in item.goodsList" :key="index" class="bg-img"
:style="[{ backgroundImage:'url(' + product.goodsImgUrl + ')' }]" v-if="index < 3">
<view class="pic-down-text">
<view class="text-grey text-cut text-sm">{{product.goodsName}}</view>
<!-- <view class="text-price text-red text-cut">{{product.price}}</view> -->
</view>
</view>
<view v-if="item.goodsList && item.goodsList.length > 3">
<view v-for="(item, index) in 3" class="circle-point margin-right-xs bg-grey"></view>
</view>
</view>
<!-- 进店看看 -->
<view class="flex justify-between align-end margin-top-xs">
<view class="cu-capsule">
<view class='cu-tag bg-main-color'>
<text class='cuIcon-shopfill'></text>
</view>
<view class="cu-tag line-main-color">
{{item.deptName}}
</view>
</view>
<!-- <view class="margin-right-sm text-black">{{item.shopName}}</view> -->
<view class='cu-tag light bg-main-color radius' @click="showShopDetail(item)">进店看看<text
class="text-bold cuIcon-right"></text></view>
</view>
</view>
<load-status-bar ref="loadStatusBar2" @loadMore="loadOtherCityWorkerPage"></load-status-bar>
</view>
</view>
</template>
@ -116,9 +199,11 @@
data() {
return {
workerInfos: [],
otherCityWorkers: [],
loadMoreStatus: '',
hasMoreData: false,
pageNum: 0,
otherCityWorkersPageNum: 0,
pageSize: 0,
stickyTop: this.CustomBar,
searchInfo: {},
@ -154,11 +239,14 @@
this.pageNum = this.$globalData.initPageNum;
this.workerInfos = [];
this.loadWorkerPage(params);
this.otherCityWorkers = [];
this.loadOtherCityWorkerPage();
},
async loadWorkerPage(params = {}) {
params.pageNum = this.pageNum;
params.pageSize = this.pageSize;
this.$refs.loadStatusBar.showLoading();
this.$refs.loadStatusBar1.showLoading();
try {
let res = await this.$request.getWorkerList(params);
let rowsLength = res.rows.length;
@ -166,13 +254,34 @@
this.workerInfos = this.workerInfos.concat(res.rows);
this.pageNum++;
if (rowsLength === this.pageSize) {
this.$refs.loadStatusBar.showLoadMore();
this.$refs.loadStatusBar1.showLoadMore();
}
}
this.$refs.loadStatusBar.showLoadOver();
this.$refs.loadStatusBar1.showLoadOver();
} catch (e) {
console.error(e)
this.$refs.loadStatusBar.showLoadErr();
this.$refs.loadStatusBar1.showLoadErr();
}
},
async loadOtherCityWorkerPage(params = {}) {
params.pageNum = this.otherCityWorkersPageNum;
params.pageSize = this.pageSize;
params.exceptParentAreaId = this.searchInfo.area && this.searchInfo.area.length ? this.searchInfo.area[1].areaId : null;
this.$refs.loadStatusBar2.showLoading();
try {
let res = await this.$request.getWorkerList(params);
let rowsLength = res.rows.length;
if (rowsLength > 0) {
this.otherCityWorkers = this.otherCityWorkers.concat(res.rows);
this.otherCityWorkersPageNum++;
if (rowsLength === this.pageSize) {
this.$refs.loadStatusBar2.showLoadMore();
}
}
this.$refs.loadStatusBar2.showLoadOver();
} catch (e) {
console.error(e)
this.$refs.loadStatusBar2.showLoadErr();
}
},
async loadCategoryList(idArr) {
@ -384,4 +493,8 @@
border-radius: 50%;
margin-top: 50%;
}
.text-beside-avatar {
width: 75%;
}
</style>

View File

@ -130,3 +130,9 @@
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.divider {
background: #E0E3DA;
width: 100%;
height: 5rpx;
}