244 lines
5.4 KiB
Vue
244 lines
5.4 KiB
Vue
|
<template>
|
||
|
<view class="dynamic-follow">
|
||
|
<fixed>
|
||
|
<view>
|
||
|
<search @input="toSearch" type="input" :padding="30" :radius="0" backgroundColor="#fff"
|
||
|
:placeholder="'请输入'+$t('action.attendantName')+'姓名'">
|
||
|
</search>
|
||
|
</view>
|
||
|
</fixed>
|
||
|
<view @tap.stop="toCheck(index)" class="list-item flex-center mt-md ml-md mr-md"
|
||
|
v-for="(item,index) in list.data" :key="index">
|
||
|
<i class="iconfont mr-md"
|
||
|
:class="[{'icon-xuanze':coach_info.id != item.id},{'icon-radio-fill':coach_info.id == item.id}]"
|
||
|
:style="{color:coach_info.id == item.id?primaryColor:'#BEC3CE'}"></i>
|
||
|
<view class="flex-1 flex-center fill-base pd-lg radius-16">
|
||
|
<image mode="aspectFill" class="avatar radius" :src="item.work_img"></image>
|
||
|
<view class="flex-1 flex-between ml-md">
|
||
|
<view class="f-title c-black text-bold max-200 ellipsis">{{item.coach_name}}
|
||
|
</view>
|
||
|
<view class="flex-center f-desc c-black"> <i class="iconfont iconjuli"
|
||
|
:style="{color:primaryColor}"></i>
|
||
|
{{item.distance}}
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<load-more :noMore="list.current_page>=list.last_page&&list.data.length>0" :loading="loading" v-if="loading">
|
||
|
</load-more>
|
||
|
<abnor v-if="!loading&&list.data.length<=0&&list.current_page==1"></abnor>
|
||
|
<view class="space-max-footer"></view>
|
||
|
|
||
|
<fix-bottom-button @confirm="submit" :text="[{text:'确定选择',type:'confirm'}]" bgColor="#fff">
|
||
|
</fix-bottom-button>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import {
|
||
|
mapState,
|
||
|
mapActions,
|
||
|
mapMutations
|
||
|
} from "vuex"
|
||
|
export default {
|
||
|
data() {
|
||
|
return {
|
||
|
coach_info: {},
|
||
|
loading: true,
|
||
|
param: {
|
||
|
page: 1
|
||
|
},
|
||
|
list: {
|
||
|
data: []
|
||
|
},
|
||
|
lockTap: false
|
||
|
}
|
||
|
},
|
||
|
computed: mapState({
|
||
|
primaryColor: state => state.config.configInfo.primaryColor,
|
||
|
subColor: state => state.config.configInfo.subColor,
|
||
|
userInfo: state => state.user.userInfo,
|
||
|
location: state => state.user.location,
|
||
|
}),
|
||
|
onLoad() {
|
||
|
let {
|
||
|
coach_info = {}
|
||
|
} = this.$util.getPage(-1)
|
||
|
this.coach_info = coach_info
|
||
|
this.$util.setNavigationBarColor({
|
||
|
bg: this.primaryColor
|
||
|
})
|
||
|
uni.setNavigationBarTitle({
|
||
|
title: '选择' + this.$t('action.attendantName')
|
||
|
})
|
||
|
this.$util.showLoading()
|
||
|
this.initIndex()
|
||
|
},
|
||
|
onPullDownRefresh() {
|
||
|
// #ifndef APP-PLUS
|
||
|
uni.showNavigationBarLoading()
|
||
|
// #endif
|
||
|
this.initRefresh();
|
||
|
uni.stopPullDownRefresh()
|
||
|
},
|
||
|
onReachBottom() {
|
||
|
if (this.list.current_page >= this.list.last_page || this.loading) return;
|
||
|
this.param.page = this.param.page + 1;
|
||
|
this.loading = true;
|
||
|
this.getList();
|
||
|
},
|
||
|
methods: {
|
||
|
...mapMutations(['updateUserItem']),
|
||
|
async initIndex(refresh = false) {
|
||
|
// #ifdef H5
|
||
|
if (!refresh && this.$jweixin.isWechat()) {
|
||
|
await this.$jweixin.initJssdk();
|
||
|
this.$jweixin.wxReady(() => {
|
||
|
this.$jweixin.hideOptionMenu()
|
||
|
})
|
||
|
}
|
||
|
// #endif
|
||
|
this.getList();
|
||
|
},
|
||
|
handerTabChange(index) {
|
||
|
this.activeIndex = index
|
||
|
this.param.status = index
|
||
|
this.getList();
|
||
|
},
|
||
|
initRefresh() {
|
||
|
this.param.page = 1
|
||
|
this.initIndex(true)
|
||
|
},
|
||
|
async getList() {
|
||
|
let {
|
||
|
list: oldList,
|
||
|
param,
|
||
|
location
|
||
|
} = this
|
||
|
if (!location.lat) {
|
||
|
// #ifdef H5
|
||
|
if (this.$jweixin.isWechat()) {
|
||
|
this.$util.showLoading()
|
||
|
await this.$jweixin.wxReady2();
|
||
|
let {
|
||
|
latitude: lat = 0,
|
||
|
longitude: lng = 0
|
||
|
} = await this.$jweixin.getWxLocation()
|
||
|
location = {
|
||
|
lng,
|
||
|
lat,
|
||
|
address: '定位失败',
|
||
|
province: '',
|
||
|
city: '',
|
||
|
district: ''
|
||
|
}
|
||
|
if (lat && lng) {
|
||
|
let key = `${lat},${lng}`
|
||
|
let data = await this.$api.base.getMapInfo({
|
||
|
location: key
|
||
|
})
|
||
|
let {
|
||
|
status,
|
||
|
result
|
||
|
} = JSON.parse(data)
|
||
|
if (status == 0) {
|
||
|
let {
|
||
|
address,
|
||
|
address_component
|
||
|
} = result
|
||
|
let {
|
||
|
province,
|
||
|
city,
|
||
|
district
|
||
|
} = address_component
|
||
|
location = {
|
||
|
lng,
|
||
|
lat,
|
||
|
address,
|
||
|
province,
|
||
|
city,
|
||
|
district
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
// #endif
|
||
|
// #ifndef H5
|
||
|
location = await this.$util.getBmapLocation()
|
||
|
// #endif
|
||
|
this.updateUserItem({
|
||
|
key: 'location',
|
||
|
val: location
|
||
|
})
|
||
|
}
|
||
|
let {
|
||
|
lat = 0, lng = 0
|
||
|
} = location
|
||
|
param.lat = lat
|
||
|
param.lng = lng
|
||
|
|
||
|
let newList = await this.$api.mine.coachList(param)
|
||
|
if (this.param.page == 1) {
|
||
|
this.list = newList
|
||
|
} else {
|
||
|
newList.data = oldList.data.concat(newList.data)
|
||
|
this.list = newList
|
||
|
}
|
||
|
this.loading = false
|
||
|
this.$util.hideAll()
|
||
|
},
|
||
|
toSearch(val) {
|
||
|
this.param.coach_name = val
|
||
|
this.getList(1)
|
||
|
},
|
||
|
toCheck(index) {
|
||
|
let item = this.list.data[index]
|
||
|
this.coach_info = item
|
||
|
},
|
||
|
submit() {
|
||
|
let {
|
||
|
id = 0
|
||
|
} = this.coach_info
|
||
|
if (!id) {
|
||
|
this.$util.showToast({
|
||
|
title: `请选择${this.$t('action.attendantName')}`
|
||
|
})
|
||
|
return
|
||
|
}
|
||
|
this.$util.getPage(-1).coach_info = this.coach_info
|
||
|
setTimeout(() => {
|
||
|
this.$util.goUrl({
|
||
|
url: 1,
|
||
|
openType: `navigateBack`
|
||
|
})
|
||
|
}, 1000)
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss">
|
||
|
.dynamic-follow {
|
||
|
.list-item {
|
||
|
|
||
|
.iconfont {
|
||
|
font-size: 40rpx;
|
||
|
}
|
||
|
|
||
|
.avatar {
|
||
|
width: 90rpx;
|
||
|
height: 90rpx;
|
||
|
}
|
||
|
|
||
|
.text {
|
||
|
color: #4D4D4D;
|
||
|
margin-top: 6rpx;
|
||
|
}
|
||
|
|
||
|
.iconjuli {
|
||
|
font-size: 26rpx;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</style>
|