flat: 地图
This commit is contained in:
史典卓
6
App.vue
6
App.vue
@@ -16,11 +16,7 @@
|
||||
export default {
|
||||
onLaunch: function(options) {
|
||||
this.$store.dispatch('InitArea')
|
||||
if (options.query.token) {
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/blank?token=' + options.query.token
|
||||
})
|
||||
} else if (this.$store.state.user.token) {
|
||||
if (this.$store.state.user.token) {
|
||||
this.$store.dispatch('startRefreshTokenTimer')
|
||||
this.$store.dispatch('startRefreshNewsTimer')
|
||||
this.$store.dispatch('refreshAuthState')
|
||||
|
||||
@@ -1,230 +1,254 @@
|
||||
<template>
|
||||
<view class="body" @click="goInfo(companyitem)">
|
||||
<view class="heads">
|
||||
<view class="head_left">
|
||||
<rich-text :nodes="string">
|
||||
</rich-text>
|
||||
</view>
|
||||
|
||||
<view class="head_right">
|
||||
{{ companyitem.wage }}{{ wageUnit[companyitem.wageUnitCategory] }}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="ask">
|
||||
<view class="askList">
|
||||
{{ companyitem.tradeNames }}
|
||||
</view>
|
||||
<view class="askList" v-for="(item, index) in skillNames" :key="index">
|
||||
{{ item }}
|
||||
</view>
|
||||
<view style="flex:1;"></view>
|
||||
<u-tag text="零工岗位" v-if="companyitem.type == 0" plain size="mini" type="warning"></u-tag>
|
||||
<u-tag text="全职岗位" v-if="companyitem.type == 1" plain size="mini"></u-tag>
|
||||
<u-tag text="招工" v-if="companyitem.type == 2" plain size="mini"></u-tag>
|
||||
</view>
|
||||
<view style="width: 100%;height: 1rpx;background-color: #999;margin: 0 auto;opacity: .5;"></view>
|
||||
<view class="timeAddress" style="position: relative;">
|
||||
<view style="display: flex;align-items: center;">
|
||||
<image src="../../static/img/city.png" style="width: 40rpx;height: 40rpx;margin-right: 10rpx;" mode="">
|
||||
</image>
|
||||
<view style="font-size: 26rpx;color:#333;">{{ companyitem.missionCompanyName }}</view>
|
||||
</view>
|
||||
<view style="display: flex;align-items: center;position:absolute;right:0;">
|
||||
<image src="../../static/img/location_new.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
|
||||
<view>--km</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="comment" v-if='comment' @tap.stop="goComment(companyitem.missionNo)">
|
||||
<view class="comment_content commentimg" v-if='companyitem.scoreAll > 0'>
|
||||
<image class="commentimg_image" src="../../static/img/star.full.svg"
|
||||
v-for="index1 in companyitem.scoreAll" mode="" :key="index1"></image>
|
||||
<image class="commentimg_image" src="../../static/img/star.empty.svg"
|
||||
v-for="index2 in (5 - companyitem.scoreAll)" mode="" :key="index2"></image>
|
||||
</view>
|
||||
<view class="comment_content allName gocomment" v-else>
|
||||
评价
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
toDoller,
|
||||
dateFormat
|
||||
} from "../../untils/format.js";
|
||||
import dictionary from '@/common/textdata.js';
|
||||
|
||||
export default {
|
||||
beforeCreate: function() {},
|
||||
props: {
|
||||
companyitem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
comment: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
noApply: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
near: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
...dictionary,
|
||||
string: "<div style='overflow: hidden;white-space: nowrap;text-overflow: ellipsis;'>" + this.companyitem
|
||||
.missionTitle +
|
||||
"</div>"
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
skillNames() {
|
||||
return this.companyitem.skillNames?.split(',')
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goComment: function(no) {
|
||||
uni.navigateTo({
|
||||
url: `../../pageMy/mycomment/mycomment?missionNo=${encodeURIComponent(no)}`
|
||||
})
|
||||
},
|
||||
goInfo: function(item) {
|
||||
// const isCan = this.noApply === false ? '0' : '1'
|
||||
if (item.type == 0) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/projectInfo?missionNo=${encodeURIComponent(item.missionNo)}&isCan=1`
|
||||
})
|
||||
} else if (item.type == 1) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`
|
||||
})
|
||||
}
|
||||
},
|
||||
getCity: function(val) {
|
||||
if (val) {
|
||||
let areas = this.$store.getters.getAreaParents(val)
|
||||
if (areas.length === 3) {
|
||||
return areas[0].label + '-' + areas[1].label + '-' + areas[2].label
|
||||
}
|
||||
}
|
||||
},
|
||||
toDoller,
|
||||
dateFormat
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.commentimg_image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.commentimg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.gocomment {
|
||||
font-size: 26rpx !important;
|
||||
border-radius: 5rpx;
|
||||
border: 1rpx solid #c3c3c3;
|
||||
width: 160rpx;
|
||||
text-align: center;
|
||||
float: right;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.timeAddress {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin: 10rpx 0;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.allName {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.askList {
|
||||
/* width: 14%; */
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
background-color: #f6f6f6;
|
||||
padding: 5rpx 15rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.ask {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.head_right {
|
||||
ont-family: PingFangSC-Medium;
|
||||
font-size: 28rpx;
|
||||
color: #F46161;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.head_left {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
width: 350rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
/*不换行*/
|
||||
text-overflow: ellipsis;
|
||||
/*超出部分文字以...显示*/
|
||||
}
|
||||
|
||||
.highlight {
|
||||
color: #F46161;
|
||||
}
|
||||
|
||||
.body {
|
||||
width: 690rpx;
|
||||
margin: 0rpx auto;
|
||||
background-color: #fefefe;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
padding-bottom: 0;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.heads {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
<template>
|
||||
<view class="body" @click="goInfo(companyitem)">
|
||||
<view class="heads">
|
||||
<view class="head_left">
|
||||
<rich-text :nodes="string">
|
||||
</rich-text>
|
||||
</view>
|
||||
|
||||
<view class="head_right">
|
||||
{{ companyitem.wage }}{{ wageUnit[companyitem.wageUnitCategory] }}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="ask">
|
||||
<view class="askList">
|
||||
{{ companyitem.tradeNames }}
|
||||
</view>
|
||||
<view class="askList" v-for="(item, index) in skillNames" :key="index">
|
||||
{{ item }}
|
||||
</view>
|
||||
<view style="flex:1;"></view>
|
||||
<u-tag text="零工岗位" v-if="companyitem.type == 0" plain size="mini" type="warning"></u-tag>
|
||||
<u-tag text="全职岗位" v-if="companyitem.type == 1" plain size="mini"></u-tag>
|
||||
<u-tag text="招工" v-if="companyitem.type == 2" plain size="mini"></u-tag>
|
||||
</view>
|
||||
<view style="width: 100%;height: 1rpx;background-color: #999;margin: 0 auto;opacity: .5;"></view>
|
||||
<view class="timeAddress" style="position: relative;">
|
||||
<view style="display: flex;align-items: center;">
|
||||
<image src="../../static/img/city.png" style="width: 40rpx;height: 40rpx;margin-right: 10rpx;" mode="">
|
||||
</image>
|
||||
<view style="font-size: 26rpx;color:#333;">{{ companyitem.missionCompanyName }}</view>
|
||||
</view>
|
||||
<view style="display: flex;align-items: center;position:absolute;right:0;">
|
||||
<image src="../../static/img/location_new.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
|
||||
<view>{{distance(companyitem)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="comment" v-if='comment' @tap.stop="goComment(companyitem.missionNo)">
|
||||
<view class="comment_content commentimg" v-if='companyitem.scoreAll > 0'>
|
||||
<image class="commentimg_image" src="../../static/img/star.full.svg"
|
||||
v-for="index1 in companyitem.scoreAll" mode="" :key="index1"></image>
|
||||
<image class="commentimg_image" src="../../static/img/star.empty.svg"
|
||||
v-for="index2 in (5 - companyitem.scoreAll)" mode="" :key="index2"></image>
|
||||
</view>
|
||||
<view class="comment_content allName gocomment" v-else>
|
||||
评价
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
toDoller,
|
||||
dateFormat
|
||||
} from "../../untils/format.js";
|
||||
import dictionary from '@/common/textdata.js';
|
||||
import {
|
||||
addZeroPrefix,
|
||||
getDistanceFromLatLonInKm
|
||||
} from '@/untils/tools.js'
|
||||
export default {
|
||||
beforeCreate: function() {},
|
||||
props: {
|
||||
companyitem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
comment: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
noApply: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
near: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
position: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
...dictionary,
|
||||
string: "<div style='overflow: hidden;white-space: nowrap;text-overflow: ellipsis;'>" + this.companyitem
|
||||
.missionTitle +
|
||||
"</div>"
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
skillNames() {
|
||||
return this.companyitem.skillNames?.split(',')
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
distance(item) {
|
||||
const {
|
||||
lon,
|
||||
lat
|
||||
} = item
|
||||
if (this.position && lon > 0) {
|
||||
const {
|
||||
longitude,
|
||||
latitude
|
||||
} = this.position
|
||||
const {
|
||||
m,
|
||||
km
|
||||
} = getDistanceFromLatLonInKm(lat, lon, latitude, longitude)
|
||||
return m > 1000 ? `${km.toFixed(2)}km` : `${m.toFixed(2)}m`
|
||||
}
|
||||
return '--km'
|
||||
},
|
||||
goComment: function(no) {
|
||||
uni.navigateTo({
|
||||
url: `../../pageMy/mycomment/mycomment?missionNo=${encodeURIComponent(no)}`
|
||||
})
|
||||
},
|
||||
goInfo: function(item) {
|
||||
// const isCan = this.noApply === false ? '0' : '1'
|
||||
if (item.type == 0) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/projectInfo?missionNo=${encodeURIComponent(item.missionNo)}&isCan=1`
|
||||
})
|
||||
} else if (item.type == 1) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`
|
||||
})
|
||||
}
|
||||
},
|
||||
getCity: function(val) {
|
||||
if (val) {
|
||||
let areas = this.$store.getters.getAreaParents(val)
|
||||
if (areas.length === 3) {
|
||||
return areas[0].label + '-' + areas[1].label + '-' + areas[2].label
|
||||
}
|
||||
}
|
||||
},
|
||||
toDoller,
|
||||
dateFormat
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.commentimg_image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.commentimg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.gocomment {
|
||||
font-size: 26rpx !important;
|
||||
border-radius: 5rpx;
|
||||
border: 1rpx solid #c3c3c3;
|
||||
width: 160rpx;
|
||||
text-align: center;
|
||||
float: right;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.timeAddress {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin: 10rpx 0;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.allName {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.askList {
|
||||
/* width: 14%; */
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
background-color: #f6f6f6;
|
||||
padding: 5rpx 15rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.ask {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.head_right {
|
||||
ont-family: PingFangSC-Medium;
|
||||
font-size: 28rpx;
|
||||
color: #F46161;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.head_left {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
width: 350rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
/*不换行*/
|
||||
text-overflow: ellipsis;
|
||||
/*超出部分文字以...显示*/
|
||||
}
|
||||
|
||||
.highlight {
|
||||
color: #F46161;
|
||||
}
|
||||
|
||||
.body {
|
||||
width: 690rpx;
|
||||
margin: 0rpx auto;
|
||||
background-color: #fefefe;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
padding-bottom: 0;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.heads {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
||||
@@ -1,244 +1,268 @@
|
||||
<template>
|
||||
<view class="body" @click="goInfo(companyitem)">
|
||||
<view class="heads">
|
||||
<view class="head_left">
|
||||
<rich-text :nodes="string">
|
||||
</rich-text>
|
||||
</view>
|
||||
|
||||
<view class="head_right">
|
||||
{{ companyitem.wage }}{{ wageUnit[companyitem.wageUnitCategory] }}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="ask">
|
||||
<view class="askList">
|
||||
{{ companyitem.tradeNames }}
|
||||
</view>
|
||||
<view class="askList" v-for="(item, index) in skillNames" :key="index">
|
||||
{{ item }}
|
||||
</view>
|
||||
<view style="flex:1;"></view>
|
||||
<u-tag text="零工岗位" v-if="companyitem.type == 0" plain size="mini" type="warning"></u-tag>
|
||||
<u-tag text="全职岗位" v-if="companyitem.type == 1" plain size="mini"></u-tag>
|
||||
<u-tag text="招工" v-if="companyitem.type == 2" plain size="mini"></u-tag>
|
||||
</view>
|
||||
<view style="width: 100%;height: 1rpx;background-color: #999;margin: 0 auto;opacity: .5;"></view>
|
||||
<view class="timeAddress" style="position: relative;">
|
||||
<view style="display: flex;align-items: center;">
|
||||
<image src="../../static/img/city.png" style="width: 40rpx;height: 40rpx;margin-right: 10rpx;" mode="">
|
||||
</image>
|
||||
<view style="font-size: 26rpx;color:#333;">{{ companyitem.missionCompanyName }}</view>
|
||||
</view>
|
||||
<view style="display: flex;align-items: center;position:absolute;right:0;">
|
||||
<image src="../../static/img/location_new.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
|
||||
<view>--km</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="comment" v-if='comment' @tap.stop="goComment(companyitem.missionNo)">
|
||||
<view class="comment_content commentimg" v-if='companyitem.scoreAll > 0'>
|
||||
<image class="commentimg_image" src="../../static/img/star.full.svg"
|
||||
v-for="index1 in companyitem.scoreAll" mode="" :key="index1"></image>
|
||||
<image class="commentimg_image" src="../../static/img/star.empty.svg"
|
||||
v-for="index2 in (5 - companyitem.scoreAll)" mode="" :key="index2"></image>
|
||||
</view>
|
||||
<view class="comment_content allName gocomment" v-else>
|
||||
评价
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
toDoller,
|
||||
dateFormat
|
||||
} from "../../untils/format.js";
|
||||
import dictionary from '@/common/textdata.js';
|
||||
import {
|
||||
defaults
|
||||
} from "lodash";
|
||||
|
||||
export default {
|
||||
beforeCreate: function() {},
|
||||
props: {
|
||||
companyitem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
comment: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
noApply: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
near: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
...dictionary,
|
||||
string: "<div style='overflow: hidden;white-space: nowrap;text-overflow: ellipsis;'>" + this.companyitem
|
||||
.missionTitle +
|
||||
"</div>"
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
skillNames() {
|
||||
if (this.companyitem.skillNames) {
|
||||
return this.companyitem.skillNames?.split(',')
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goComment: function(no) {
|
||||
uni.navigateTo({
|
||||
url: `../../pageMy/mycomment/mycomment?missionNo=${encodeURIComponent(no)}`
|
||||
})
|
||||
},
|
||||
goInfo: function(item) {
|
||||
// const isCan = this.noApply === false ? '0' : '1'
|
||||
switch (item.type) {
|
||||
case 0:
|
||||
this.navTo(
|
||||
`/pages/projectInfo/projectInfo?missionNo=${encodeURIComponent(item.missionNo)}&isCan=1`
|
||||
)
|
||||
break
|
||||
case 1:
|
||||
this.navTo(`/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`)
|
||||
break
|
||||
case 2:
|
||||
this.navTo(`/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`)
|
||||
break
|
||||
default:
|
||||
this.navTo(`/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`)
|
||||
}
|
||||
|
||||
},
|
||||
getCity: function(val) {
|
||||
if (val) {
|
||||
let areas = this.$store.getters.getAreaParents(val)
|
||||
if (areas.length === 3) {
|
||||
return areas[0].label + '-' + areas[1].label + '-' + areas[2].label
|
||||
}
|
||||
}
|
||||
},
|
||||
toDoller,
|
||||
dateFormat
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.commentimg_image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.commentimg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.gocomment {
|
||||
font-size: 26rpx !important;
|
||||
border-radius: 5rpx;
|
||||
border: 1rpx solid #c3c3c3;
|
||||
width: 160rpx;
|
||||
text-align: center;
|
||||
float: right;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.timeAddress {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin: 10rpx 0;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.allName {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.askList {
|
||||
/* width: 14%; */
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
background-color: #f6f6f6;
|
||||
padding: 5rpx 15rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.ask {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.head_right {
|
||||
ont-family: PingFangSC-Medium;
|
||||
font-size: 28rpx;
|
||||
color: #F46161;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.head_left {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
width: 350rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
/*不换行*/
|
||||
text-overflow: ellipsis;
|
||||
/*超出部分文字以...显示*/
|
||||
}
|
||||
|
||||
.highlight {
|
||||
color: #F46161;
|
||||
}
|
||||
|
||||
.body {
|
||||
width: 690rpx;
|
||||
margin: 0rpx auto;
|
||||
background-color: #fefefe;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
padding-bottom: 0;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.heads {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
<template>
|
||||
<view class="body" @click="goInfo(companyitem)">
|
||||
<view class="heads">
|
||||
<view class="head_left">
|
||||
<rich-text :nodes="string">
|
||||
</rich-text>
|
||||
</view>
|
||||
|
||||
<view class="head_right">
|
||||
{{ companyitem.wage }}{{ wageUnit[companyitem.wageUnitCategory] }}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
<view class="ask">
|
||||
<view class="askList">
|
||||
{{ companyitem.tradeNames }}
|
||||
</view>
|
||||
<view class="askList" v-for="(item, index) in skillNames" :key="index">
|
||||
{{ item }}
|
||||
</view>
|
||||
<view style="flex:1;"></view>
|
||||
<u-tag text="零工岗位" v-if="companyitem.type == 0" plain size="mini" type="warning"></u-tag>
|
||||
<u-tag text="全职岗位" v-if="companyitem.type == 1" plain size="mini"></u-tag>
|
||||
<u-tag text="招工" v-if="companyitem.type == 2" plain size="mini"></u-tag>
|
||||
</view>
|
||||
<view style="width: 100%;height: 1rpx;background-color: #999;margin: 0 auto;opacity: .5;"></view>
|
||||
<view class="timeAddress" style="position: relative;">
|
||||
<view style="display: flex;align-items: center;">
|
||||
<image src="../../static/img/city.png" style="width: 40rpx;height: 40rpx;margin-right: 10rpx;" mode="">
|
||||
</image>
|
||||
<view style="font-size: 26rpx;color:#333;">{{ companyitem.missionCompanyName }}</view>
|
||||
</view>
|
||||
<view style="display: flex;align-items: center;position:absolute;right:0;">
|
||||
<image src="../../static/img/location_new.png" style="width: 30rpx;height: 30rpx;" mode=""></image>
|
||||
<view>{{distance(companyitem)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="comment" v-if='comment' @tap.stop="goComment(companyitem.missionNo)">
|
||||
<view class="comment_content commentimg" v-if='companyitem.scoreAll > 0'>
|
||||
<image class="commentimg_image" src="../../static/img/star.full.svg"
|
||||
v-for="index1 in companyitem.scoreAll" mode="" :key="index1"></image>
|
||||
<image class="commentimg_image" src="../../static/img/star.empty.svg"
|
||||
v-for="index2 in (5 - companyitem.scoreAll)" mode="" :key="index2"></image>
|
||||
</view>
|
||||
<view class="comment_content allName gocomment" v-else>
|
||||
评价
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
toDoller,
|
||||
dateFormat
|
||||
} from "../../untils/format.js";
|
||||
import dictionary from '@/common/textdata.js';
|
||||
import {
|
||||
defaults
|
||||
} from "lodash";
|
||||
import {
|
||||
addZeroPrefix,
|
||||
getDistanceFromLatLonInKm
|
||||
} from '@/untils/tools.js'
|
||||
export default {
|
||||
beforeCreate: function() {},
|
||||
props: {
|
||||
companyitem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
comment: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
noApply: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
near: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
position: {
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
...dictionary,
|
||||
string: "<div style='overflow: hidden;white-space: nowrap;text-overflow: ellipsis;'>" + this.companyitem
|
||||
.missionTitle +
|
||||
"</div>"
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
skillNames() {
|
||||
if (this.companyitem.skillNames) {
|
||||
return this.companyitem.skillNames?.split(',')
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
distance(item) {
|
||||
const {
|
||||
lon,
|
||||
lat
|
||||
} = item
|
||||
if (this.position && lon > 0) {
|
||||
const {
|
||||
longitude,
|
||||
latitude
|
||||
} = this.position
|
||||
const {
|
||||
m,
|
||||
km
|
||||
} = getDistanceFromLatLonInKm(lat, lon, latitude, longitude)
|
||||
return m > 1000 ? `${km.toFixed(2)}km` : `${m.toFixed(2)}m`
|
||||
}
|
||||
return '--km'
|
||||
},
|
||||
goComment: function(no) {
|
||||
uni.navigateTo({
|
||||
url: `../../pageMy/mycomment/mycomment?missionNo=${encodeURIComponent(no)}`
|
||||
})
|
||||
},
|
||||
goInfo: function(item) {
|
||||
// const isCan = this.noApply === false ? '0' : '1'
|
||||
switch (item.type) {
|
||||
case 0:
|
||||
this.navTo(
|
||||
`/pages/projectInfo/projectInfo?missionNo=${encodeURIComponent(item.missionNo)}&isCan=1`
|
||||
)
|
||||
break
|
||||
case 1:
|
||||
this.navTo(`/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`)
|
||||
break
|
||||
case 2:
|
||||
this.navTo(`/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`)
|
||||
break
|
||||
default:
|
||||
this.navTo(`/pages/projectInfo/workInfo?workId=${encodeURIComponent(item.id)}&isCan=1`)
|
||||
}
|
||||
|
||||
},
|
||||
getCity: function(val) {
|
||||
if (val) {
|
||||
let areas = this.$store.getters.getAreaParents(val)
|
||||
if (areas.length === 3) {
|
||||
return areas[0].label + '-' + areas[1].label + '-' + areas[2].label
|
||||
}
|
||||
}
|
||||
},
|
||||
toDoller,
|
||||
dateFormat
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.commentimg_image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.commentimg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.gocomment {
|
||||
font-size: 26rpx !important;
|
||||
border-radius: 5rpx;
|
||||
border: 1rpx solid #c3c3c3;
|
||||
width: 160rpx;
|
||||
text-align: center;
|
||||
float: right;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.timeAddress {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin: 10rpx 0;
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.allName {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.askList {
|
||||
/* width: 14%; */
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
background-color: #f6f6f6;
|
||||
padding: 5rpx 15rpx;
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.ask {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.head_right {
|
||||
ont-family: PingFangSC-Medium;
|
||||
font-size: 28rpx;
|
||||
color: #F46161;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.head_left {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
width: 350rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
/*不换行*/
|
||||
text-overflow: ellipsis;
|
||||
/*超出部分文字以...显示*/
|
||||
}
|
||||
|
||||
.highlight {
|
||||
color: #F46161;
|
||||
}
|
||||
|
||||
.body {
|
||||
width: 690rpx;
|
||||
margin: 0rpx auto;
|
||||
background-color: #fefefe;
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
padding-bottom: 0;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.heads {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
||||
@@ -5,46 +5,6 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'ol/ol.css';
|
||||
import Map from 'ol/Map';
|
||||
import View from 'ol/View';
|
||||
import TileLayer from 'ol/layer/Tile';
|
||||
import SourceVector from 'ol/source/Vector';
|
||||
import LayerVector from 'ol/layer/Vector';
|
||||
import * as control from 'ol/control';
|
||||
import {
|
||||
toLonLat
|
||||
} from 'ol/proj';
|
||||
import Overlay from 'ol/Overlay';
|
||||
import {
|
||||
toStringHDMS
|
||||
} from 'ol/coordinate';
|
||||
import {
|
||||
Select
|
||||
} from 'ol/interaction'
|
||||
import {
|
||||
GeoJSON
|
||||
} from 'ol/format';
|
||||
import {
|
||||
Style,
|
||||
Circle,
|
||||
Fill,
|
||||
Stroke,
|
||||
Icon,
|
||||
Text
|
||||
} from 'ol/style';
|
||||
import Feature from 'ol/Feature';
|
||||
import {
|
||||
Point,
|
||||
Polygon
|
||||
} from 'ol/geom';
|
||||
import {
|
||||
Logo,
|
||||
TileSuperMapRest,
|
||||
FeatureService,
|
||||
GetFeaturesByGeometryParameters
|
||||
} from '@supermap/iclient-ol';
|
||||
const geoJSONParser = new GeoJSON();
|
||||
let mypoint = require('@/static/img/mypoint.png');
|
||||
export default {
|
||||
name: "uMapView",
|
||||
@@ -114,297 +74,12 @@
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
if (this.init) {
|
||||
this.initMap()
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
initMap(options) {
|
||||
let lat, lon;
|
||||
if (options) {
|
||||
lat = options.lat
|
||||
lon = options.lon
|
||||
} else {
|
||||
lat = this.latitude
|
||||
lon = this.longitude
|
||||
}
|
||||
this.map = new Map({
|
||||
target: 'map',
|
||||
controls: control.defaults({
|
||||
attribution: false,
|
||||
zoom: this.ScaleZoom,
|
||||
}),
|
||||
layers: [
|
||||
new TileLayer({ // 使用瓦片
|
||||
source: new TileSuperMapRest({
|
||||
url: this.MapUrl,
|
||||
wrapX: true,
|
||||
}),
|
||||
projection: 'EPSG:4326',
|
||||
}),
|
||||
],
|
||||
view: new View({
|
||||
center: [lon, lat],
|
||||
maxZoom: this.maxZoom,
|
||||
minZoom: this.minZoom,
|
||||
zoom: this.zoom,
|
||||
projection: 'EPSG:4326',
|
||||
})
|
||||
});
|
||||
//添加查询结果图层
|
||||
this.vectorSource = new SourceVector({
|
||||
wrapX: false
|
||||
});
|
||||
const resultLayer = new LayerVector({
|
||||
source: this.vectorSource,
|
||||
});
|
||||
|
||||
//添加点图层
|
||||
this.addPointsSource = new SourceVector({
|
||||
wrapX: false
|
||||
});
|
||||
const addPointsLayer = new LayerVector({
|
||||
source: this.addPointsSource,
|
||||
});
|
||||
this.map.addLayer(addPointsLayer);
|
||||
this.map.addLayer(resultLayer);
|
||||
this.map.on('pointermove', (e) => {
|
||||
if (this.isShowToolTip) {
|
||||
this.helpTooltip.setPosition(undefined);
|
||||
this.helpTooltipElement.classList.add('hidden');
|
||||
}
|
||||
this.$emit('regionchange', e.pixel)
|
||||
});
|
||||
this.map.on('singleclick', (e) => {
|
||||
this.$emit('clickMap', e.coordinate)
|
||||
});
|
||||
|
||||
if (this.open) {
|
||||
this.addFeature([{
|
||||
id: 1,
|
||||
latitude: lat,
|
||||
longitude: lon,
|
||||
iconPath: mypoint,
|
||||
title: '',
|
||||
width: 20,
|
||||
height: 20
|
||||
}])
|
||||
}
|
||||
|
||||
if (this.flagTip) {
|
||||
this.createHelpTooltip()
|
||||
}
|
||||
|
||||
},
|
||||
addMarker(point) {
|
||||
console.log('point', point)
|
||||
// this.ceateMarker([104.404419, 31.133980])
|
||||
},
|
||||
addFeature(covers) {
|
||||
console.log(covers)
|
||||
const features = covers.map((item) => ({
|
||||
type: 'Feature',
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [item.longitude, item.latitude],
|
||||
},
|
||||
properties: {
|
||||
iconPath: item.iconPath,
|
||||
text: item.title,
|
||||
value: JSON.stringify(item),
|
||||
scale: item.id === 1 ? [0.15, 0.15] : [0.1, 0.1]
|
||||
}
|
||||
}))
|
||||
this.careateFeature(features)
|
||||
|
||||
},
|
||||
ceateMarker(point) {
|
||||
// 创建一个坐标点
|
||||
const pointed = new Point(point); // 这里的[0, 0]应该替换为您的经度和纬度
|
||||
|
||||
// 创建一个特征
|
||||
const pointFeature = new Feature({
|
||||
geometry: pointed,
|
||||
name: 'My Point'
|
||||
});
|
||||
|
||||
pointFeature.setStyle(new Style({
|
||||
image: new Circle({
|
||||
fill: new Fill({
|
||||
color: [255, 0, 0, 0.5]
|
||||
}),
|
||||
stroke: new Stroke({
|
||||
color: 'red',
|
||||
width: 2
|
||||
}),
|
||||
radius: 8
|
||||
})
|
||||
}));
|
||||
|
||||
pointFeature.setProperties({
|
||||
POP: 1,
|
||||
CAPITAL: 'test'
|
||||
});
|
||||
this.addPointsSource.clear()
|
||||
// 将特征添加到矢量图层
|
||||
this.addPointsSource.addFeature(pointFeature);
|
||||
// 确保更新地图视图以显示新的标点
|
||||
this.map.getView().fit(this.addPointsSource.getExtent());
|
||||
// // 或者移动视图
|
||||
// _this.map.getView().animate({
|
||||
// duration: 850,
|
||||
// zoom: 5,
|
||||
// center: point,
|
||||
// });
|
||||
|
||||
},
|
||||
careateFeature(result) {
|
||||
if (this.vectorSourceIcon) {
|
||||
this.vectorSourceIcon.clear()
|
||||
const geojsonObject = {
|
||||
type: 'FeatureCollection',
|
||||
features: result,
|
||||
};
|
||||
this.vectorSourceIcon.addFeatures(geoJSONParser.readFeatures(geojsonObject))
|
||||
this.vectorSourceIcon.changed()
|
||||
return
|
||||
}
|
||||
|
||||
const geojsonObject = {
|
||||
type: 'FeatureCollection',
|
||||
features: result,
|
||||
};
|
||||
// 创建一个图层作为点位
|
||||
this.vectorSourceIcon = new SourceVector({
|
||||
features: geoJSONParser.readFeatures(geojsonObject)
|
||||
});
|
||||
this.vectorLayerIcon = new LayerVector({
|
||||
source: this.vectorSourceIcon,
|
||||
style: feature => {
|
||||
return new Style({
|
||||
image: new Icon({
|
||||
anchor: [0.5, 0.9],
|
||||
scale: feature.get('scale'),
|
||||
src: feature.get('iconPath'),
|
||||
}),
|
||||
text: new Text({
|
||||
text: feature.get('text'),
|
||||
fill: new Fill({
|
||||
color: '#000'
|
||||
}),
|
||||
stroke: new Stroke({
|
||||
color: '#fff',
|
||||
width: 3
|
||||
}),
|
||||
font: 'normal 12px Calibri, sans-serif',
|
||||
textAlign: 'center', // 文本对齐
|
||||
offsetX: 0,
|
||||
offsetY: 15,
|
||||
rotation: 0, // 文本旋转
|
||||
}),
|
||||
});
|
||||
}
|
||||
});
|
||||
this.map.addLayer(this.vectorLayerIcon);
|
||||
// 添加事件
|
||||
this.selectInteraction = new Select({
|
||||
layers: [this.vectorLayerIcon]
|
||||
});
|
||||
this.selectInteraction.on('select', (event) => {
|
||||
const selectedFeatures = event.selected;
|
||||
if (selectedFeatures.length) {
|
||||
const select = selectedFeatures[0].values_
|
||||
this.$emit('markertap', JSON.parse(select.value))
|
||||
// tooltip
|
||||
if (this.flagTip) {
|
||||
const coordinate = selectedFeatures[0].values_.geometry.flatCoordinates;
|
||||
this.helpTooltipElement.innerHTML = select.text;
|
||||
console.log(this.helpTooltip)
|
||||
this.helpTooltip.setPosition(coordinate);
|
||||
this.helpTooltipElement.classList.remove('hidden');
|
||||
this.map.addOverlay(this.helpTooltip);
|
||||
this.isShowToolTip = true
|
||||
}
|
||||
}
|
||||
});
|
||||
this.map.addInteraction(this.selectInteraction);
|
||||
},
|
||||
createHelpTooltip() {
|
||||
this.helpTooltipElement
|
||||
if (this.helpTooltipElement) {
|
||||
this.helpTooltipElement.parentNode.removeChild(this.helpTooltipElement);
|
||||
}
|
||||
this.helpTooltipElement = document.createElement('div');
|
||||
this.helpTooltipElement.className = 'tooltip hidden';
|
||||
this.helpTooltip = new Overlay({
|
||||
element: this.helpTooltipElement,
|
||||
offset: [-30, 20],
|
||||
positioning: 'center-left'
|
||||
});
|
||||
}
|
||||
}
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-content {}
|
||||
|
||||
.editPane {
|
||||
position: absolute;
|
||||
right: 65px;
|
||||
top: 8px;
|
||||
text-align: center;
|
||||
background: #FFF;
|
||||
z-index: 1000;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.ol-popup {
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
-webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
|
||||
filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #cccccc;
|
||||
bottom: 12px;
|
||||
left: -50px;
|
||||
min-width: 120px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.ol-popup:after,
|
||||
.ol-popup:before {
|
||||
top: 100%;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.ol-popup:after {
|
||||
border-top-color: white;
|
||||
border-width: 10px;
|
||||
left: 48px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
|
||||
.ol-popup:before {
|
||||
border-top-color: #cccccc;
|
||||
border-width: 11px;
|
||||
left: 48px;
|
||||
margin-left: -11px;
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
position: relative;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 4px;
|
||||
color: white;
|
||||
padding: 4px 8px;
|
||||
opacity: 0.7;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
410
components/uMapView/uMapViewcopy.vue
Normal file
410
components/uMapView/uMapViewcopy.vue
Normal file
@@ -0,0 +1,410 @@
|
||||
<template>
|
||||
<view class="app-content">
|
||||
<view id="map" style="width: 100%;height: 100%;"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'ol/ol.css';
|
||||
import Map from 'ol/Map';
|
||||
import View from 'ol/View';
|
||||
import TileLayer from 'ol/layer/Tile';
|
||||
import SourceVector from 'ol/source/Vector';
|
||||
import LayerVector from 'ol/layer/Vector';
|
||||
import * as control from 'ol/control';
|
||||
import {
|
||||
toLonLat
|
||||
} from 'ol/proj';
|
||||
import Overlay from 'ol/Overlay';
|
||||
import {
|
||||
toStringHDMS
|
||||
} from 'ol/coordinate';
|
||||
import {
|
||||
Select
|
||||
} from 'ol/interaction'
|
||||
import {
|
||||
GeoJSON
|
||||
} from 'ol/format';
|
||||
import {
|
||||
Style,
|
||||
Circle,
|
||||
Fill,
|
||||
Stroke,
|
||||
Icon,
|
||||
Text
|
||||
} from 'ol/style';
|
||||
import Feature from 'ol/Feature';
|
||||
import {
|
||||
Point,
|
||||
Polygon
|
||||
} from 'ol/geom';
|
||||
import {
|
||||
Logo,
|
||||
TileSuperMapRest,
|
||||
FeatureService,
|
||||
GetFeaturesByGeometryParameters
|
||||
} from '@supermap/iclient-ol';
|
||||
const geoJSONParser = new GeoJSON();
|
||||
let mypoint = require('@/static/img/mypoint.png');
|
||||
export default {
|
||||
name: "uMapView",
|
||||
props: {
|
||||
latitude: {
|
||||
required: true,
|
||||
},
|
||||
longitude: {
|
||||
required: true,
|
||||
},
|
||||
zoom: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 10,
|
||||
},
|
||||
maxZoom: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 20,
|
||||
},
|
||||
minZoom: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 0,
|
||||
},
|
||||
ScaleZoom: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
MapUrl: { // 瓦片地图URL
|
||||
type: String,
|
||||
required: true,
|
||||
default: '',
|
||||
},
|
||||
flagTip: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
open: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
init: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: true,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 实例化对象
|
||||
map: null,
|
||||
addPointsSource: null,
|
||||
vectorSource: null,
|
||||
vectorSourceIcon: null,
|
||||
vectorLayerIcon: null,
|
||||
selectInteraction: null,
|
||||
helpTooltipElement: null,
|
||||
helpTooltip: null,
|
||||
isclearPoint: null,
|
||||
overlay: null,
|
||||
// 控制参数
|
||||
isShowToolTip: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
if (this.init) {
|
||||
this.initMap()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initMap(options) {
|
||||
let lat, lon;
|
||||
if (options) {
|
||||
lat = options.lat
|
||||
lon = options.lon
|
||||
} else {
|
||||
lat = this.latitude
|
||||
lon = this.longitude
|
||||
}
|
||||
this.map = new Map({
|
||||
target: 'map',
|
||||
controls: control.defaults({
|
||||
attribution: false,
|
||||
zoom: this.ScaleZoom,
|
||||
}),
|
||||
layers: [
|
||||
new TileLayer({ // 使用瓦片
|
||||
source: new TileSuperMapRest({
|
||||
url: this.MapUrl,
|
||||
wrapX: true,
|
||||
}),
|
||||
projection: 'EPSG:4326',
|
||||
}),
|
||||
],
|
||||
view: new View({
|
||||
center: [lon, lat],
|
||||
maxZoom: this.maxZoom,
|
||||
minZoom: this.minZoom,
|
||||
zoom: this.zoom,
|
||||
projection: 'EPSG:4326',
|
||||
})
|
||||
});
|
||||
//添加查询结果图层
|
||||
this.vectorSource = new SourceVector({
|
||||
wrapX: false
|
||||
});
|
||||
const resultLayer = new LayerVector({
|
||||
source: this.vectorSource,
|
||||
});
|
||||
|
||||
//添加点图层
|
||||
this.addPointsSource = new SourceVector({
|
||||
wrapX: false
|
||||
});
|
||||
const addPointsLayer = new LayerVector({
|
||||
source: this.addPointsSource,
|
||||
});
|
||||
this.map.addLayer(addPointsLayer);
|
||||
this.map.addLayer(resultLayer);
|
||||
this.map.on('pointermove', (e) => {
|
||||
if (this.isShowToolTip) {
|
||||
this.helpTooltip.setPosition(undefined);
|
||||
this.helpTooltipElement.classList.add('hidden');
|
||||
}
|
||||
this.$emit('regionchange', e.pixel)
|
||||
});
|
||||
this.map.on('singleclick', (e) => {
|
||||
this.$emit('clickMap', e.coordinate)
|
||||
});
|
||||
|
||||
if (this.open) {
|
||||
this.addFeature([{
|
||||
id: 1,
|
||||
latitude: lat,
|
||||
longitude: lon,
|
||||
iconPath: mypoint,
|
||||
title: '',
|
||||
width: 20,
|
||||
height: 20
|
||||
}])
|
||||
}
|
||||
|
||||
if (this.flagTip) {
|
||||
this.createHelpTooltip()
|
||||
}
|
||||
|
||||
},
|
||||
addMarker(point) {
|
||||
console.log('point', point)
|
||||
// this.ceateMarker([104.404419, 31.133980])
|
||||
},
|
||||
addFeature(covers) {
|
||||
console.log(covers)
|
||||
const features = covers.map((item) => ({
|
||||
type: 'Feature',
|
||||
geometry: {
|
||||
type: 'Point',
|
||||
coordinates: [item.longitude, item.latitude],
|
||||
},
|
||||
properties: {
|
||||
iconPath: item.iconPath,
|
||||
text: item.title,
|
||||
value: JSON.stringify(item),
|
||||
scale: item.id === 1 ? [0.15, 0.15] : [0.1, 0.1]
|
||||
}
|
||||
}))
|
||||
this.careateFeature(features)
|
||||
|
||||
},
|
||||
ceateMarker(point) {
|
||||
// 创建一个坐标点
|
||||
const pointed = new Point(point); // 这里的[0, 0]应该替换为您的经度和纬度
|
||||
|
||||
// 创建一个特征
|
||||
const pointFeature = new Feature({
|
||||
geometry: pointed,
|
||||
name: 'My Point'
|
||||
});
|
||||
|
||||
pointFeature.setStyle(new Style({
|
||||
image: new Circle({
|
||||
fill: new Fill({
|
||||
color: [255, 0, 0, 0.5]
|
||||
}),
|
||||
stroke: new Stroke({
|
||||
color: 'red',
|
||||
width: 2
|
||||
}),
|
||||
radius: 8
|
||||
})
|
||||
}));
|
||||
|
||||
pointFeature.setProperties({
|
||||
POP: 1,
|
||||
CAPITAL: 'test'
|
||||
});
|
||||
this.addPointsSource.clear()
|
||||
// 将特征添加到矢量图层
|
||||
this.addPointsSource.addFeature(pointFeature);
|
||||
// 确保更新地图视图以显示新的标点
|
||||
this.map.getView().fit(this.addPointsSource.getExtent());
|
||||
// // 或者移动视图
|
||||
// _this.map.getView().animate({
|
||||
// duration: 850,
|
||||
// zoom: 5,
|
||||
// center: point,
|
||||
// });
|
||||
|
||||
},
|
||||
careateFeature(result) {
|
||||
if (this.vectorSourceIcon) {
|
||||
this.vectorSourceIcon.clear()
|
||||
const geojsonObject = {
|
||||
type: 'FeatureCollection',
|
||||
features: result,
|
||||
};
|
||||
this.vectorSourceIcon.addFeatures(geoJSONParser.readFeatures(geojsonObject))
|
||||
this.vectorSourceIcon.changed()
|
||||
return
|
||||
}
|
||||
|
||||
const geojsonObject = {
|
||||
type: 'FeatureCollection',
|
||||
features: result,
|
||||
};
|
||||
// 创建一个图层作为点位
|
||||
this.vectorSourceIcon = new SourceVector({
|
||||
features: geoJSONParser.readFeatures(geojsonObject)
|
||||
});
|
||||
this.vectorLayerIcon = new LayerVector({
|
||||
source: this.vectorSourceIcon,
|
||||
style: feature => {
|
||||
return new Style({
|
||||
image: new Icon({
|
||||
anchor: [0.5, 0.9],
|
||||
scale: feature.get('scale'),
|
||||
src: feature.get('iconPath'),
|
||||
}),
|
||||
text: new Text({
|
||||
text: feature.get('text'),
|
||||
fill: new Fill({
|
||||
color: '#000'
|
||||
}),
|
||||
stroke: new Stroke({
|
||||
color: '#fff',
|
||||
width: 3
|
||||
}),
|
||||
font: 'normal 12px Calibri, sans-serif',
|
||||
textAlign: 'center', // 文本对齐
|
||||
offsetX: 0,
|
||||
offsetY: 15,
|
||||
rotation: 0, // 文本旋转
|
||||
}),
|
||||
});
|
||||
}
|
||||
});
|
||||
this.map.addLayer(this.vectorLayerIcon);
|
||||
// 添加事件
|
||||
this.selectInteraction = new Select({
|
||||
layers: [this.vectorLayerIcon]
|
||||
});
|
||||
this.selectInteraction.on('select', (event) => {
|
||||
const selectedFeatures = event.selected;
|
||||
if (selectedFeatures.length) {
|
||||
const select = selectedFeatures[0].values_
|
||||
this.$emit('markertap', JSON.parse(select.value))
|
||||
// tooltip
|
||||
if (this.flagTip) {
|
||||
const coordinate = selectedFeatures[0].values_.geometry.flatCoordinates;
|
||||
this.helpTooltipElement.innerHTML = select.text;
|
||||
console.log(this.helpTooltip)
|
||||
this.helpTooltip.setPosition(coordinate);
|
||||
this.helpTooltipElement.classList.remove('hidden');
|
||||
this.map.addOverlay(this.helpTooltip);
|
||||
this.isShowToolTip = true
|
||||
}
|
||||
}
|
||||
});
|
||||
this.map.addInteraction(this.selectInteraction);
|
||||
},
|
||||
createHelpTooltip() {
|
||||
this.helpTooltipElement
|
||||
if (this.helpTooltipElement) {
|
||||
this.helpTooltipElement.parentNode.removeChild(this.helpTooltipElement);
|
||||
}
|
||||
this.helpTooltipElement = document.createElement('div');
|
||||
this.helpTooltipElement.className = 'tooltip hidden';
|
||||
this.helpTooltip = new Overlay({
|
||||
element: this.helpTooltipElement,
|
||||
offset: [-30, 20],
|
||||
positioning: 'center-left'
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.app-content {}
|
||||
|
||||
.editPane {
|
||||
position: absolute;
|
||||
right: 65px;
|
||||
top: 8px;
|
||||
text-align: center;
|
||||
background: #FFF;
|
||||
z-index: 1000;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.ol-popup {
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
-webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
|
||||
filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid #cccccc;
|
||||
bottom: 12px;
|
||||
left: -50px;
|
||||
min-width: 120px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.ol-popup:after,
|
||||
.ol-popup:before {
|
||||
top: 100%;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.ol-popup:after {
|
||||
border-top-color: white;
|
||||
border-width: 10px;
|
||||
left: 48px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
|
||||
.ol-popup:before {
|
||||
border-top-color: #cccccc;
|
||||
border-width: 11px;
|
||||
left: 48px;
|
||||
margin-left: -11px;
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
position: relative;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 4px;
|
||||
color: white;
|
||||
padding: 4px 8px;
|
||||
opacity: 0.7;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
@@ -3,7 +3,7 @@ module.exports = {
|
||||
// 图片地址
|
||||
imageUrl: '',
|
||||
// 天地图tk
|
||||
apiKey: 'e4266a5e84fe6c10f60c559967f0a03f',
|
||||
apiKey: 'aa9b92683ff22363aa17baa16599cff8',
|
||||
// 显示标题
|
||||
showTitle: false,
|
||||
// map 1、黑色模块 2、白色模块
|
||||
|
||||
9
main.js
9
main.js
@@ -16,6 +16,10 @@ import {
|
||||
|
||||
import empty from '@/components/empty/empty.vue'
|
||||
|
||||
function haslogin() {
|
||||
return !!store.state.user.token
|
||||
}
|
||||
|
||||
function navTo(url, needLogin) {
|
||||
console.log(url)
|
||||
if (needLogin) {
|
||||
@@ -46,11 +50,12 @@ Vue.component('jl-button', JlButton)
|
||||
Vue.component('jl-form', JlForm)
|
||||
Vue.component('jl-form-item', JlFormItem)
|
||||
Vue.component('cs-button', CSButton)
|
||||
Vue.component('super-map', superMapView)
|
||||
// Vue.component('super-map', superMapView)
|
||||
Vue.component('empty', empty)
|
||||
Vue.prototype.$api = {
|
||||
msg,
|
||||
sleep
|
||||
sleep,
|
||||
haslogin
|
||||
}
|
||||
Vue.prototype.tools = tools
|
||||
Vue.prototype.$config = config
|
||||
|
||||
@@ -65,11 +65,7 @@
|
||||
},
|
||||
"h5": {
|
||||
"sdkConfigs": {
|
||||
"maps": {
|
||||
"qqmap": {
|
||||
"key": "FW3BZ-6JTK6-GCUS5-MZCRR-3GPR5-HJFEI"
|
||||
}
|
||||
}
|
||||
"maps": {}
|
||||
},
|
||||
"template": "index.html",
|
||||
"router": {
|
||||
|
||||
@@ -1,153 +1,158 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<!-- <view class="tab">
|
||||
<v-tabs :tabs="['全部任务','全部岗位']" v-model="activeTab" color="#999" activeColor="#000" fontSize="36rx"
|
||||
activeFontSize="36rpx" @change='changeTab' />
|
||||
</view> -->
|
||||
<block v-for="(page, pIndex) in data" :key="pIndex">
|
||||
<block v-for="(item, index) in page" :key="item.id">
|
||||
<view class="probody">
|
||||
<company-list :companyitem="item" :noApply="false"></company-list>
|
||||
<view class="baddd"></view>
|
||||
<!-- <block>
|
||||
<image src="/static/img/tab.orange.svg" mode="" v-if="item.status === 1"></image>
|
||||
<image src="/static/img/tab.blue.svg" mode="" v-else-if="item.status === 2"></image>
|
||||
<image src="/static/img/tab.green.svg" mode="" v-else-if="item.status === 3"></image>
|
||||
<image src="/static/img/tab.gray.svg" mode="" v-else></image>
|
||||
</block> -->
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<view class="nothing" v-if="data.length === 0">
|
||||
<image src="/static/img/pic_notask.svg" mode=""></image>
|
||||
<view class="nothingContnt">
|
||||
暂无收藏信息
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vTabs from '@/components/v-tabs/v-tabs.vue';
|
||||
import companyList from '@/components/companyList/collectionList.vue';
|
||||
import {
|
||||
myCollection
|
||||
} from '@/api/mission.js';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
vTabs,
|
||||
companyList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
activeTab: 0,
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
onLoad: function() {
|
||||
this.init()
|
||||
},
|
||||
/*页面滚动到底部 换页*/
|
||||
onReachBottom: function() {
|
||||
if (this.current <= Math.ceil(this.total / this.size)) {
|
||||
this.getData();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
},
|
||||
/*下拉刷新*/
|
||||
onPullDownRefresh:function(){
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init(){
|
||||
this.current = 1
|
||||
this.data = []
|
||||
this.getData()
|
||||
},
|
||||
getData() {
|
||||
var status = Number(this.activeTab) + 1
|
||||
myCollection(this.current, this.size, status).then(res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (this.current === 1) {
|
||||
this.data = [];
|
||||
}
|
||||
this.current += 1;
|
||||
this.total = res.data.data.total;
|
||||
if (res.data.data && res.data.data.records.length) {
|
||||
this.data.push(res.data.data.records);
|
||||
}
|
||||
})
|
||||
},
|
||||
gomap: function() {
|
||||
uni.navigateTo({
|
||||
url: '../mapSeach/mapSeach'
|
||||
})
|
||||
},
|
||||
changeTab: function(e) {
|
||||
this.activeTab = e;
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tab {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.probody image {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.probody {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.baddd {
|
||||
background: #f6f6f6;
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
.nothing {
|
||||
height: 100%;
|
||||
padding-top: 50%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.nothing image {
|
||||
width: 400rpx;
|
||||
height: 200rpx;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nothingContnt {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-top: 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="body">
|
||||
<!-- <view class="tab">
|
||||
<v-tabs :tabs="['全部任务','全部岗位']" v-model="activeTab" color="#999" activeColor="#000" fontSize="36rx"
|
||||
activeFontSize="36rpx" @change='changeTab' />
|
||||
</view> -->
|
||||
<block v-for="(page, pIndex) in data" :key="pIndex">
|
||||
<block v-for="(item, index) in page" :key="item.id">
|
||||
<view class="probody">
|
||||
<company-list :companyitem="item" :position="userLocation" :noApply="false"></company-list>
|
||||
<view class="baddd"></view>
|
||||
<!-- <block>
|
||||
<image src="/static/img/tab.orange.svg" mode="" v-if="item.status === 1"></image>
|
||||
<image src="/static/img/tab.blue.svg" mode="" v-else-if="item.status === 2"></image>
|
||||
<image src="/static/img/tab.green.svg" mode="" v-else-if="item.status === 3"></image>
|
||||
<image src="/static/img/tab.gray.svg" mode="" v-else></image>
|
||||
</block> -->
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<view class="nothing" v-if="data.length === 0">
|
||||
<image src="/static/img/pic_notask.svg" mode=""></image>
|
||||
<view class="nothingContnt">
|
||||
暂无收藏信息
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vTabs from '@/components/v-tabs/v-tabs.vue';
|
||||
import companyList from '@/components/companyList/collectionList.vue';
|
||||
import {
|
||||
myCollection
|
||||
} from '@/api/mission.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
export default {
|
||||
components: {
|
||||
vTabs,
|
||||
companyList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
activeTab: 0,
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['userLocation']),
|
||||
},
|
||||
onLoad: function() {
|
||||
this.init()
|
||||
},
|
||||
/*页面滚动到底部 换页*/
|
||||
onReachBottom: function() {
|
||||
if (this.current <= Math.ceil(this.total / this.size)) {
|
||||
this.getData();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
},
|
||||
/*下拉刷新*/
|
||||
onPullDownRefresh: function() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.current = 1
|
||||
this.data = []
|
||||
this.getData()
|
||||
},
|
||||
getData() {
|
||||
var status = Number(this.activeTab) + 1
|
||||
myCollection(this.current, this.size, status).then(res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (this.current === 1) {
|
||||
this.data = [];
|
||||
}
|
||||
this.current += 1;
|
||||
this.total = res.data.data.total;
|
||||
if (res.data.data && res.data.data.records.length) {
|
||||
this.data.push(res.data.data.records);
|
||||
}
|
||||
})
|
||||
},
|
||||
gomap: function() {
|
||||
uni.navigateTo({
|
||||
url: '../mapSeach/mapSeach'
|
||||
})
|
||||
},
|
||||
changeTab: function(e) {
|
||||
this.activeTab = e;
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tab {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.probody image {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.probody {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.baddd {
|
||||
background: #f6f6f6;
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
.nothing {
|
||||
height: 100%;
|
||||
padding-top: 50%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.nothing image {
|
||||
width: 400rpx;
|
||||
height: 200rpx;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nothingContnt {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-top: 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@@ -1,153 +1,158 @@
|
||||
<template>
|
||||
<view class="body">
|
||||
<!-- <view class="tab">
|
||||
<v-tabs :tabs="['全部任务','全部岗位']" v-model="activeTab" color="#999" activeColor="#000" fontSize="36rx"
|
||||
activeFontSize="36rpx" @change='changeTab' />
|
||||
</view> -->
|
||||
<block v-for="(page, pIndex) in data" :key="pIndex">
|
||||
<block v-for="(item, index) in page" :key="item.id">
|
||||
<view class="probody">
|
||||
<company-list :companyitem="item" :noApply="false"></company-list>
|
||||
<view class="baddd"></view>
|
||||
<!-- <block>
|
||||
<image src="/static/img/tab.orange.svg" mode="" v-if="item.status === 1"></image>
|
||||
<image src="/static/img/tab.blue.svg" mode="" v-else-if="item.status === 2"></image>
|
||||
<image src="/static/img/tab.green.svg" mode="" v-else-if="item.status === 3"></image>
|
||||
<image src="/static/img/tab.gray.svg" mode="" v-else></image>
|
||||
</block> -->
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<view class="nothing" v-if="data.length === 0">
|
||||
<image src="/static/img/pic_notask.svg" mode=""></image>
|
||||
<view class="nothingContnt">
|
||||
暂无申请信息
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vTabs from '@/components/v-tabs/v-tabs.vue';
|
||||
import companyList from '@/components/companyList/applyList.vue';
|
||||
import {
|
||||
myMission
|
||||
} from '@/api/mission.js';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
vTabs,
|
||||
companyList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
activeTab: 0,
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
onLoad: function() {
|
||||
this.init()
|
||||
},
|
||||
/*页面滚动到底部 换页*/
|
||||
onReachBottom: function() {
|
||||
if (this.current <= Math.ceil(this.total / this.size)) {
|
||||
this.getData();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
},
|
||||
/*下拉刷新*/
|
||||
onPullDownRefresh:function(){
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init(){
|
||||
this.current = 1
|
||||
this.data = []
|
||||
this.getData()
|
||||
},
|
||||
getData() {
|
||||
var status = Number(this.activeTab) + 1
|
||||
myMission(this.current, this.size, status).then(res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (this.current === 1) {
|
||||
this.data = [];
|
||||
}
|
||||
this.current += 1;
|
||||
this.total = res.data.data.total;
|
||||
if (res.data.data && res.data.data.records.length) {
|
||||
this.data.push(res.data.data.records);
|
||||
}
|
||||
})
|
||||
},
|
||||
gomap: function() {
|
||||
uni.navigateTo({
|
||||
url: '../mapSeach/mapSeach'
|
||||
})
|
||||
},
|
||||
changeTab: function(e) {
|
||||
this.activeTab = e;
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tab {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.probody image {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.probody {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.baddd {
|
||||
background: #f6f6f6;
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
.nothing {
|
||||
height: 100%;
|
||||
padding-top: 50%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.nothing image {
|
||||
width: 400rpx;
|
||||
height: 200rpx;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nothingContnt {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-top: 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="body">
|
||||
<!-- <view class="tab">
|
||||
<v-tabs :tabs="['全部任务','全部岗位']" v-model="activeTab" color="#999" activeColor="#000" fontSize="36rx"
|
||||
activeFontSize="36rpx" @change='changeTab' />
|
||||
</view> -->
|
||||
<block v-for="(page, pIndex) in data" :key="pIndex">
|
||||
<block v-for="(item, index) in page" :key="item.id">
|
||||
<view class="probody">
|
||||
<company-list :companyitem="item" :position="userLocation" :noApply="false"></company-list>
|
||||
<view class="baddd"></view>
|
||||
<!-- <block>
|
||||
<image src="/static/img/tab.orange.svg" mode="" v-if="item.status === 1"></image>
|
||||
<image src="/static/img/tab.blue.svg" mode="" v-else-if="item.status === 2"></image>
|
||||
<image src="/static/img/tab.green.svg" mode="" v-else-if="item.status === 3"></image>
|
||||
<image src="/static/img/tab.gray.svg" mode="" v-else></image>
|
||||
</block> -->
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<view class="nothing" v-if="data.length === 0">
|
||||
<image src="/static/img/pic_notask.svg" mode=""></image>
|
||||
<view class="nothingContnt">
|
||||
暂无申请信息
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import vTabs from '@/components/v-tabs/v-tabs.vue';
|
||||
import companyList from '@/components/companyList/applyList.vue';
|
||||
import {
|
||||
myMission
|
||||
} from '@/api/mission.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
export default {
|
||||
components: {
|
||||
vTabs,
|
||||
companyList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
data: [],
|
||||
activeTab: 0,
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
onLoad: function() {
|
||||
this.init()
|
||||
},
|
||||
/*页面滚动到底部 换页*/
|
||||
onReachBottom: function() {
|
||||
if (this.current <= Math.ceil(this.total / this.size)) {
|
||||
this.getData();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
},
|
||||
/*下拉刷新*/
|
||||
onPullDownRefresh: function() {
|
||||
this.init()
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['userLocation']),
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.current = 1
|
||||
this.data = []
|
||||
this.getData()
|
||||
},
|
||||
getData() {
|
||||
var status = Number(this.activeTab) + 1
|
||||
myMission(this.current, this.size, status).then(res => {
|
||||
uni.stopPullDownRefresh();
|
||||
if (this.current === 1) {
|
||||
this.data = [];
|
||||
}
|
||||
this.current += 1;
|
||||
this.total = res.data.data.total;
|
||||
if (res.data.data && res.data.data.records.length) {
|
||||
this.data.push(res.data.data.records);
|
||||
}
|
||||
})
|
||||
},
|
||||
gomap: function() {
|
||||
uni.navigateTo({
|
||||
url: '../mapSeach/mapSeach'
|
||||
})
|
||||
},
|
||||
changeTab: function(e) {
|
||||
this.activeTab = e;
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tab {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
.body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.probody image {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.probody {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.baddd {
|
||||
background: #f6f6f6;
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
.nothing {
|
||||
height: 100%;
|
||||
padding-top: 50%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.nothing image {
|
||||
width: 400rpx;
|
||||
height: 200rpx;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.nothingContnt {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-top: 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@@ -12,10 +12,10 @@
|
||||
<view v-if="loading" class="btn nocheck" loading="true"></view>
|
||||
<view v-else-if="validate" class="btn" @click="login">立即登录</view>
|
||||
<view v-else class="btn nocheck">立即登录</view>
|
||||
<!-- <view class="changeLogintype">
|
||||
<view class="" @click="goReg">手机注册</view>
|
||||
<view class="" @click="goForget">忘记密码</view>
|
||||
</view> -->
|
||||
<view class="changeLogintype">
|
||||
<view class="" @click="goReg">手机注册</view>
|
||||
<view class="" @click="goForget">忘记密码</view>
|
||||
</view>
|
||||
</login-template>
|
||||
</template>
|
||||
|
||||
@@ -74,8 +74,8 @@
|
||||
},
|
||||
login(e) {
|
||||
if (this.validate) {
|
||||
this.userChecked = true;
|
||||
console.log(this.userChecked)
|
||||
// this.userChecked = true;
|
||||
// console.log(this.userChecked)
|
||||
// if (!this.userChecked) {
|
||||
// uni.showToast({
|
||||
// title:'请先阅读并同意《服务及隐私协议》',
|
||||
@@ -169,4 +169,15 @@
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.changeLogintype {
|
||||
margin: 0 auto;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 14px;
|
||||
color: #1B66FF;
|
||||
margin-top: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -1,106 +1,113 @@
|
||||
<template>
|
||||
<view class="login-body">
|
||||
<view class="nothing" style="height: 100rpx;"></view>
|
||||
<view class="titleText">{{title}}</view>
|
||||
<slot></slot>
|
||||
<view v-if="!hideBottom" class="bottomt">
|
||||
<view class="bottomt-box">
|
||||
<!-- <view class="check-icon" @click="checkChanged">
|
||||
<image v-if="userChecked" src="../../static/img/checkOk.png" style="width: 30rpx;height:30rpx;"></image>
|
||||
<view class="noneCheck" v-else></view>
|
||||
</view>
|
||||
已阅读并同意<text class="bottomtText" @click="goMent">《服务及隐私协议》</text> -->
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
export default {
|
||||
|
||||
data(){
|
||||
return{
|
||||
|
||||
}
|
||||
},
|
||||
props: {
|
||||
title: String,
|
||||
hideBottom: Boolean
|
||||
},
|
||||
methods: {
|
||||
goMent() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/user/agreement'
|
||||
})
|
||||
},
|
||||
checkChanged(){
|
||||
let checkedValue=!this.userChecked;
|
||||
this.$store.dispatch('UserCheckedBtn',checkedValue)
|
||||
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
...mapGetters(['userChecked'])
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.login-body {
|
||||
min-height: 880rpx;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.titleText {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 46rpx;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.bottomtText {
|
||||
color: #151515;
|
||||
}
|
||||
|
||||
.bottomt {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
position: absolute;
|
||||
bottom: 80rpx;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
.bottomt-box{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.check-icon{
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
align-items: center;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 12rpx;
|
||||
.noneCheck{
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #999999;
|
||||
margin-right:12rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="login-body">
|
||||
<view class="nothing" style="height: 100rpx;"></view>
|
||||
<view class="titleText">{{title}}</view>
|
||||
<slot></slot>
|
||||
<view v-if="!hideBottom" class="bottomt">
|
||||
<view class="bottomt-box">
|
||||
<view class="check-icon" @click="checkChanged">
|
||||
<image v-if="userChecked" :src="checked" style="width: 30rpx;height:30rpx;">
|
||||
</image>
|
||||
<view class="noneCheck" v-else></view>
|
||||
</view>
|
||||
已阅读并同意<text class="bottomtText" @click="goMent">《服务及隐私协议》</text>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import checked from '../../static/img/checkOk.png'
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
checked
|
||||
}
|
||||
},
|
||||
props: {
|
||||
title: String,
|
||||
hideBottom: Boolean
|
||||
},
|
||||
methods: {
|
||||
goMent() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/user/agreement'
|
||||
})
|
||||
},
|
||||
checkChanged() {
|
||||
let checkedValue = !this.userChecked;
|
||||
this.$store.dispatch('UserCheckedBtn', checkedValue)
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['userChecked'])
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.login-body {
|
||||
min-height: 880rpx;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.titleText {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 46rpx;
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.bottomtText {
|
||||
color: #151515;
|
||||
}
|
||||
|
||||
.bottomt {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
position: absolute;
|
||||
bottom: 80rpx;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
.bottomt-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.check-icon {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
align-items: center;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 12rpx;
|
||||
|
||||
.noneCheck {
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #999999;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -133,7 +133,7 @@
|
||||
getLocation: function() {
|
||||
var that = this;
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
type: 'wgs84',
|
||||
success: function(res) {
|
||||
//初始化当前点
|
||||
var point = {
|
||||
|
||||
@@ -1,404 +1,417 @@
|
||||
<template>
|
||||
<view class="app_container">
|
||||
<view class="app-top">
|
||||
<view class="top-search">
|
||||
<view class="top-input">
|
||||
<input class="put" type="text" placeholder-class="put-pla" v-model="searchValue"
|
||||
placeholder="搜索附近岗位或任务">
|
||||
<button class="input-btn" @tap="search">搜索</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="view-map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:zoom="14" :min-zoom="10" :max-zoom="20" @markertap="clickmark" @regionchange="show = false"
|
||||
:MapUrl="$config.supperMap" :flag-tip="false"></super-map>
|
||||
<!-- <view id="map" ></view> -->
|
||||
<!-- <map style="width: 100%;height: 100%;" scale="16" :latitude="latitude" :longitude="longitude"
|
||||
:markers="covers" @markertap="clickmark" @regionchange="show = false"></map> -->
|
||||
<view class="position-bottom" v-if="show">
|
||||
<view class="uni-margin-wrap">
|
||||
<swiper class="swiper" circular :interval="2000" :duration="500">
|
||||
<swiper-item class="wiperItem">
|
||||
<view class="swiper-item uni-bg-red">
|
||||
<view class="item-content">
|
||||
<view class="content-title"> {{productInfo.missionTitle}} </view>
|
||||
<view class="color_999999 fs_12 mar_top5">
|
||||
<uni-icons type="location" color="#999999" size="12"></uni-icons>
|
||||
{{ productInfo.cityId }} ｜ {{productInfo.address}} ｜ 距离：{{distance}}
|
||||
</view>
|
||||
<view class="color_999999 fs_12 mar_top5">
|
||||
<uni-icons type="map-pin-ellipse" color="#999999" size="12"></uni-icons>
|
||||
招聘时间: {{productInfo.stime}}-{{productInfo.etime}}
|
||||
</view>
|
||||
<view class="color_999999 fs_12 mar_top5">
|
||||
<uni-icons type="map-pin-ellipse" color="#999999" size="12"></uni-icons>
|
||||
{{productInfo.experienceDesc}} | {{education[productInfo.education]}}
|
||||
</view>
|
||||
<button class="btns" hover-class="active" @tap="openMap">
|
||||
<image class="btn-img" src="../../static/img/direction2.png" />查看详情
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
addZeroPrefix,
|
||||
getDistanceFromLatLonInKm
|
||||
} from '@/untils/tools.js'
|
||||
import testData from '@/common/textdata.js';
|
||||
import {
|
||||
geQueryJobsByNearby
|
||||
} from '@/api/map.js'
|
||||
let taskpoint = require('../../static/img/taskpoint.png');
|
||||
let gwpoint = require('../../static/img/gwpoint.png');
|
||||
let mypoint = require('../../static/img/mypoint.png');
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
education: testData.education,
|
||||
show: false,
|
||||
ID: 1,
|
||||
searchValue: '',
|
||||
latitude: 31.133980,
|
||||
longitude: 104.404419,
|
||||
covers: [],
|
||||
rateValue: 2,
|
||||
productInfo: {},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
distance() {
|
||||
const {
|
||||
lon,
|
||||
lat
|
||||
} = this.productInfo
|
||||
if (lon) {
|
||||
const {
|
||||
m,
|
||||
km
|
||||
} = getDistanceFromLatLonInKm(lat, lon, this.latitude, this.longitude)
|
||||
return m > 1000 ? `${km.toFixed(2)}km` : `${m.toFixed(2)}m`
|
||||
}
|
||||
return '无'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const _this = this
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: function(res) {
|
||||
const {
|
||||
longitude,
|
||||
latitude
|
||||
} = res
|
||||
_this.latitude = latitude
|
||||
_this.longitude = longitude
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$refs.uMap.addFeature(covers)
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
_this.$api.msg('无法获得周边信息')
|
||||
},
|
||||
complete: function(e) {}
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
// const _this = this
|
||||
// this.mockGetLocation().then((myPoint) => {
|
||||
// this.latitude = myPoint.latitude
|
||||
// this.longitude = myPoint.longitude
|
||||
// _this.getList(_this.longitude, _this.latitude).then((covers) => {
|
||||
// _this.$api.msg('成功获得周边信息')
|
||||
// console.log(covers)
|
||||
// _this.$refs.uMap.addFeature(covers)
|
||||
// })
|
||||
// })
|
||||
},
|
||||
methods: {
|
||||
openMap(lon, lat) {
|
||||
//打开地图，并将门店位置传入
|
||||
// type: post 岗位 mission 任务
|
||||
switch (this.productInfo.type) {
|
||||
case 'post':
|
||||
const no = encodeURIComponent(1)
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/workInfo?workId=${encodeURIComponent(no)}&isCan=${1}`
|
||||
})
|
||||
break
|
||||
case 'mission':
|
||||
const no1 = encodeURIComponent(this.productInfo.missionNo)
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/projectInfo?missionNo=${no1}&isCan=${1}`
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
search() {
|
||||
const _this = this
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: function(res) {
|
||||
const {
|
||||
longitude,
|
||||
latitude
|
||||
} = res
|
||||
_this.latitude = latitude
|
||||
_this.longitude = longitude
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$api.msg('成功获得周边信息')
|
||||
_this.$refs.uMap.addFeature(covers)
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
_this.$api.msg('无法获得周边信息')
|
||||
},
|
||||
complete: function(e) {}
|
||||
})
|
||||
// this.getList(this.longitude, this.latitude).then((covers) => {
|
||||
// this.$api.msg('成功获得周边信息')
|
||||
// console.log(covers)
|
||||
// this.$refs.uMap.addFeature(covers)
|
||||
// })
|
||||
},
|
||||
clickmark(cover) {
|
||||
if (cover.markerId === 1) return
|
||||
this.show = true;
|
||||
this.productInfo = cover.info
|
||||
},
|
||||
mockGetLocation() {
|
||||
return new Promise((resolve) => {
|
||||
resolve({
|
||||
"longitude": 104.40632,
|
||||
"latitude": 31.122989,
|
||||
"altitude": null,
|
||||
"accuracy": 25.998,
|
||||
"altitudeAccuracy": null,
|
||||
"heading": null,
|
||||
"speed": null,
|
||||
"errMsg": "getLocation:ok",
|
||||
"verticalAccuracy": 0,
|
||||
"horizontalAccuracy": 25.998
|
||||
})
|
||||
})
|
||||
},
|
||||
async getList(lon, lat) {
|
||||
return new Promise(async (resolve) => {
|
||||
let params = {
|
||||
lon,
|
||||
lat,
|
||||
distanceRange: 20,
|
||||
taskTitle: this.searchValue
|
||||
}
|
||||
let resData = await geQueryJobsByNearby(params)
|
||||
if (resData.data.code === 200) {
|
||||
const arr = resData.data.data.map((item) => ({
|
||||
id: item.id,
|
||||
longitude: item.lon,
|
||||
latitude: item.lat,
|
||||
iconPath: item.type === 'post' ? gwpoint : taskpoint,
|
||||
width: 20,
|
||||
height: 20,
|
||||
title: item.missionTitle,
|
||||
callout: {
|
||||
content: item.missionTitle,
|
||||
fontSize: 10,
|
||||
borderColor: 'blue',
|
||||
},
|
||||
info: item
|
||||
}))
|
||||
arr.push({
|
||||
id: 1,
|
||||
latitude: lat,
|
||||
longitude: lon,
|
||||
iconPath: mypoint,
|
||||
title: '我的位置',
|
||||
width: 20,
|
||||
height: 20
|
||||
})
|
||||
resolve(arr)
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.color_999999 {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.fs_12 {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.mar_top5 {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #EAEAEA !important;
|
||||
color: #AFAFAF;
|
||||
}
|
||||
|
||||
.card_mark {
|
||||
.mark_l {
|
||||
width: 56rpx;
|
||||
height: 28rpx;
|
||||
border-radius: 12rpx 0 12rpx 12rpx;
|
||||
background: linear-gradient(157deg, #A043C1 0%, #4133A2 100%);
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang-SC-Bold, PingFang-SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.position-bottom {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 406rpx;
|
||||
bottom: 50rpx;
|
||||
|
||||
.uni-margin-wrap {
|
||||
height: 406rpx;
|
||||
|
||||
.swiper {
|
||||
height: 406rpx;
|
||||
|
||||
.wiperItem {
|
||||
padding-left: 50rpx;
|
||||
height: 406rpx;
|
||||
width: 660rpx !important;
|
||||
|
||||
.swiper-item {
|
||||
width: 660rpx;
|
||||
height: 406rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 2rpx 4rpx 0rpx rgba(0, 0, 0, 0.5);
|
||||
border-radius: 27rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.item-top {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.top-img {
|
||||
width: 215rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-content {
|
||||
padding: 15rpx 33rpx;
|
||||
|
||||
.content-title {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.btns {
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 223rpx;
|
||||
height: 64rpx;
|
||||
background: linear-gradient(to right, #A043C1 0%, #4133A2 100%);
|
||||
border-radius: 15rpx;
|
||||
color: #FFFFFF;
|
||||
font-size: 26rpx;
|
||||
font-weight: 800;
|
||||
color: #FFFFFF;
|
||||
line-height: 64rpx;
|
||||
|
||||
.btn-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.app_container {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.app-top {
|
||||
display: flex;
|
||||
background: linear-gradient(to right, #e8e8e8, #e8e8e8);
|
||||
padding-bottom: 16rpx;
|
||||
padding-top: 24rpx;
|
||||
|
||||
.top-search {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.top-input {
|
||||
width: 710rpx;
|
||||
|
||||
.put {
|
||||
padding-left: 30rpx;
|
||||
height: 72rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 36rpx;
|
||||
}
|
||||
|
||||
/deep/ .put-pla {
|
||||
height: 33rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
line-height: 33rpx;
|
||||
}
|
||||
|
||||
.input-btn {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
color: #FFFFFF;
|
||||
width: 120rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
font-size: 28rpx;
|
||||
background: linear-gradient(157deg, #A043C1 0%, #4133A2 100%);
|
||||
border-radius: 29rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.view-map {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="app_container">
|
||||
<view class="app-top">
|
||||
<view class="top-search">
|
||||
<view class="top-input">
|
||||
<input
|
||||
class="put"
|
||||
type="text"
|
||||
placeholder-class="put-pla"
|
||||
v-model="searchValue"
|
||||
placeholder="搜索附近岗位或任务"
|
||||
/>
|
||||
<button class="input-btn" @tap="search">搜索</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="view-map">
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:zoom="14" :min-zoom="10" :max-zoom="20" @markertap="clickmark" @regionchange="show = false"
|
||||
:MapUrl="$config.supperMap" :flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper
|
||||
ref="tMap"
|
||||
@onSelect="clickmark"
|
||||
:api-key="$config.apiKey"
|
||||
></zhuo-tianditu-MultiPoint-Mapper>
|
||||
|
||||
<!-- <view id="map" ></view> -->
|
||||
<!-- <map style="width: 100%;height: 100%;" scale="16" :latitude="latitude" :longitude="longitude"
|
||||
:markers="covers" @markertap="clickmark" @regionchange="show = false"></map> -->
|
||||
<view class="position-bottom" v-if="show">
|
||||
<view class="uni-margin-wrap">
|
||||
<swiper class="swiper" circular :interval="2000" :duration="500">
|
||||
<swiper-item class="wiperItem">
|
||||
<view class="swiper-item uni-bg-red">
|
||||
<view class="item-content">
|
||||
<view class="content-title">{{ productInfo.missionTitle }}</view>
|
||||
<view class="color_999999 fs_12 mar_top5">
|
||||
<uni-icons type="location" color="#999999" size="12"></uni-icons>
|
||||
{{ productInfo.cityId }} ｜ {{ productInfo.address }} ｜ 距离：{{ distance }}
|
||||
</view>
|
||||
<view class="color_999999 fs_12 mar_top5">
|
||||
<uni-icons type="map-pin-ellipse" color="#999999" size="12"></uni-icons>
|
||||
招聘时间: {{ productInfo.stime }}-{{ productInfo.etime }}
|
||||
</view>
|
||||
<view class="color_999999 fs_12 mar_top5">
|
||||
<uni-icons type="map-pin-ellipse" color="#999999" size="12"></uni-icons>
|
||||
{{ productInfo.experienceDesc }} | {{ education[productInfo.education] }}
|
||||
</view>
|
||||
<button class="btns" hover-class="active" @tap="openMap">
|
||||
<image class="btn-img" src="../../static/img/direction2.png" />
|
||||
查看详情
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { addZeroPrefix, getDistanceFromLatLonInKm } from '@/untils/tools.js';
|
||||
import testData from '@/common/textdata.js';
|
||||
import { geQueryJobsByNearby } from '@/api/map.js';
|
||||
import { mapGetters } from 'vuex';
|
||||
let taskpoint = require('../../static/img/taskpoint.png');
|
||||
let gwpoint = require('../../static/img/gwpoint.png');
|
||||
let mypoint = require('../../static/img/mypoint.png');
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
education: testData.education,
|
||||
show: false,
|
||||
ID: 1,
|
||||
searchValue: '',
|
||||
latitude: 31.13398,
|
||||
longitude: 104.404419,
|
||||
covers: [],
|
||||
rateValue: 2,
|
||||
productInfo: {},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['userLocation']),
|
||||
distance() {
|
||||
const { lon, lat } = this.productInfo;
|
||||
if (lon) {
|
||||
const { m, km } = getDistanceFromLatLonInKm(lat, lon, this.latitude, this.longitude);
|
||||
return m > 1000 ? `${km.toFixed(2)}km` : `${m.toFixed(2)}m`;
|
||||
}
|
||||
return '无';
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
const _this = this;
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function (res) {
|
||||
console.log(res, '成功获得周边信息');
|
||||
const { longitude, latitude } = res;
|
||||
_this.latitude = latitude;
|
||||
_this.longitude = longitude;
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.covers = covers;
|
||||
_this.$nextTick(() => {
|
||||
_this.$refs.tMap.addFeature(covers);
|
||||
});
|
||||
});
|
||||
},
|
||||
fail: function (err) {
|
||||
console.log(err, '无法获得周边信息');
|
||||
_this.$api.msg('无法获得周边信息');
|
||||
},
|
||||
complete: function (e) {},
|
||||
});
|
||||
console.log('userLocation', this.userLocation);
|
||||
if (this.userLocation) {
|
||||
const { longitude, latitude } = this.userLocation;
|
||||
this.$refs.tMap.open(longitude, latitude);
|
||||
} else {
|
||||
this.$store.dispatch('getUserLocation');
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
// const _this = this
|
||||
// this.mockGetLocation().then((myPoint) => {
|
||||
// this.latitude = myPoint.latitude
|
||||
// this.longitude = myPoint.longitude
|
||||
// _this.getList(_this.longitude, _this.latitude).then((covers) => {
|
||||
// _this.$api.msg('成功获得周边信息')
|
||||
// console.log(covers)
|
||||
// _this.$refs.uMap.addFeature(covers)
|
||||
// })
|
||||
// })
|
||||
},
|
||||
methods: {
|
||||
onSelect(item) {},
|
||||
openMap(lon, lat) {
|
||||
//打开地图，并将门店位置传入
|
||||
// type: post 岗位 mission 任务
|
||||
switch (this.productInfo.type) {
|
||||
case 'post':
|
||||
const no = encodeURIComponent(this.productInfo.id);
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/workInfo?workId=${encodeURIComponent(no)}&isCan=${1}`,
|
||||
});
|
||||
break;
|
||||
case 'mission':
|
||||
const no1 = encodeURIComponent(this.productInfo.missionNo);
|
||||
uni.navigateTo({
|
||||
url: `/pages/projectInfo/projectInfo?missionNo=${no1}&isCan=${1}`,
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
search() {
|
||||
const _this = this;
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function (res) {
|
||||
const { longitude, latitude } = res;
|
||||
_this.latitude = latitude;
|
||||
_this.longitude = longitude;
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$api.msg('成功获得周边信息');
|
||||
_this.$refs.uMap.addFeature(covers);
|
||||
});
|
||||
},
|
||||
fail: function (err) {
|
||||
_this.$api.msg('无法获得周边信息');
|
||||
},
|
||||
complete: function (e) {},
|
||||
});
|
||||
// this.getList(this.longitude, this.latitude).then((covers) => {
|
||||
// this.$api.msg('成功获得周边信息')
|
||||
// console.log(covers)
|
||||
// this.$refs.uMap.addFeature(covers)
|
||||
// })
|
||||
},
|
||||
clickmark(cover) {
|
||||
if (cover.markerId === 1) return;
|
||||
this.show = true;
|
||||
this.productInfo = cover.info;
|
||||
},
|
||||
mockGetLocation() {
|
||||
return new Promise((resolve) => {
|
||||
resolve({
|
||||
longitude: 104.40632,
|
||||
latitude: 31.122989,
|
||||
altitude: null,
|
||||
accuracy: 25.998,
|
||||
altitudeAccuracy: null,
|
||||
heading: null,
|
||||
speed: null,
|
||||
errMsg: 'getLocation:ok',
|
||||
verticalAccuracy: 0,
|
||||
horizontalAccuracy: 25.998,
|
||||
});
|
||||
});
|
||||
},
|
||||
async getList(lon, lat) {
|
||||
return new Promise(async (resolve) => {
|
||||
let params = {
|
||||
lon,
|
||||
lat,
|
||||
distanceRange: 20,
|
||||
taskTitle: this.searchValue,
|
||||
};
|
||||
let resData = await geQueryJobsByNearby(params);
|
||||
if (resData.data.code === 200) {
|
||||
const arr = resData.data.data.map((item) => ({
|
||||
id: item.id,
|
||||
longitude: item.lon,
|
||||
latitude: item.lat,
|
||||
lon: item.lon,
|
||||
lat: item.lat,
|
||||
label: item.missionTitle,
|
||||
iconPath: item.type === 'post' ? gwpoint : taskpoint,
|
||||
width: 20,
|
||||
height: 20,
|
||||
title: item.missionTitle,
|
||||
callout: {
|
||||
content: item.missionTitle,
|
||||
fontSize: 10,
|
||||
borderColor: 'blue',
|
||||
},
|
||||
info: item,
|
||||
}));
|
||||
arr.push({
|
||||
id: 1,
|
||||
latitude: lat,
|
||||
longitude: lon,
|
||||
iconPath: mypoint,
|
||||
title: '我的位置',
|
||||
width: 20,
|
||||
height: 20,
|
||||
lon: lat,
|
||||
lat: lon,
|
||||
label: '我的位置',
|
||||
});
|
||||
resolve(arr);
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.color_999999 {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.fs_12 {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.mar_top5 {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #eaeaea !important;
|
||||
color: #afafaf;
|
||||
}
|
||||
|
||||
.card_mark {
|
||||
.mark_l {
|
||||
width: 56rpx;
|
||||
height: 28rpx;
|
||||
border-radius: 12rpx 0 12rpx 12rpx;
|
||||
background: linear-gradient(157deg, #a043c1 0%, #4133a2 100%);
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang-SC-Bold, PingFang-SC;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.position-bottom {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 406rpx;
|
||||
bottom: 50rpx;
|
||||
|
||||
.uni-margin-wrap {
|
||||
height: 406rpx;
|
||||
|
||||
.swiper {
|
||||
height: 406rpx;
|
||||
|
||||
.wiperItem {
|
||||
padding-left: 50rpx;
|
||||
height: 406rpx;
|
||||
width: 660rpx !important;
|
||||
|
||||
.swiper-item {
|
||||
width: 660rpx;
|
||||
height: 406rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 2rpx 4rpx 0rpx rgba(0, 0, 0, 0.5);
|
||||
border-radius: 27rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.item-top {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.top-img {
|
||||
width: 215rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-content {
|
||||
padding: 15rpx 33rpx;
|
||||
|
||||
.content-title {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.btns {
|
||||
margin-top: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 223rpx;
|
||||
height: 64rpx;
|
||||
background: linear-gradient(to right, #a043c1 0%, #4133a2 100%);
|
||||
border-radius: 15rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
font-weight: 800;
|
||||
color: #ffffff;
|
||||
line-height: 64rpx;
|
||||
|
||||
.btn-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.app_container {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.app-top {
|
||||
display: flex;
|
||||
background: linear-gradient(to right, #e8e8e8, #e8e8e8);
|
||||
padding-bottom: 16rpx;
|
||||
padding-top: 24rpx;
|
||||
|
||||
.top-search {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.top-input {
|
||||
width: 710rpx;
|
||||
|
||||
.put {
|
||||
padding-left: 30rpx;
|
||||
height: 72rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 36rpx;
|
||||
}
|
||||
|
||||
/deep/ .put-pla {
|
||||
height: 33rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
line-height: 33rpx;
|
||||
}
|
||||
|
||||
.input-btn {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
color: #ffffff;
|
||||
width: 120rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
font-size: 28rpx;
|
||||
background: linear-gradient(157deg, #a043c1 0%, #4133a2 100%);
|
||||
border-radius: 29rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.view-map {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -31,7 +31,7 @@
|
||||
<block v-if="activeTab == 0">
|
||||
<view v-if="newList.length > 0">
|
||||
<block v-for="(item, index) in newList" :key="index">
|
||||
<companyList :companyitem="item"></companyList>
|
||||
<companyList :companyitem="item" :position="userLocation"></companyList>
|
||||
</block>
|
||||
</view>
|
||||
<view v-else>
|
||||
@@ -51,7 +51,7 @@
|
||||
|
||||
<view v-if="companyList.length > 0">
|
||||
<block v-for="(item, index) in companyList" :key="item.id">
|
||||
<workList :companyitem="item" :near="activeTab === 0"></workList>
|
||||
<workList :companyitem="item" :position="userLocation" :near="activeTab === 0"></workList>
|
||||
</block>
|
||||
</view>
|
||||
<view v-else>
|
||||
@@ -109,7 +109,9 @@
|
||||
getcoder
|
||||
} from "@/api/map.js";
|
||||
import verticalMenu from '@/components/vertical-menu/vertical-menu.vue';
|
||||
|
||||
import {
|
||||
mapGetters
|
||||
} from 'vuex'
|
||||
export default {
|
||||
components: {
|
||||
vTabs,
|
||||
@@ -117,15 +119,16 @@
|
||||
verticalMenu,
|
||||
workList
|
||||
},
|
||||
|
||||
computed: {
|
||||
...mapGetters(['userLocation']),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
policyContentList: [],
|
||||
activeTab: 0,
|
||||
activeTab: '0',
|
||||
companyList: [],
|
||||
recommendList: [],
|
||||
newList: [],
|
||||
|
||||
nearPage: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
@@ -142,10 +145,7 @@
|
||||
total: 0
|
||||
},
|
||||
currentAddress: '',
|
||||
currentPoint: {
|
||||
latitude: 0,
|
||||
longitude: 0
|
||||
},
|
||||
|
||||
key: 'FW3BZ-6JTK6-GCUS5-MZCRR-3GPR5-HJFEI',
|
||||
open: false,
|
||||
showPopUp: false,
|
||||
@@ -157,10 +157,11 @@
|
||||
if (option.tabIndex) {
|
||||
this.activeTab = option.tabIndex
|
||||
}
|
||||
this.getData()
|
||||
this.getPolicy()
|
||||
this.$store.dispatch('getUserLocation')
|
||||
this.download()
|
||||
},
|
||||
onShow: function() {
|
||||
|
||||
const enumTitle = {
|
||||
"0": '最新零工岗位',
|
||||
"1": '最新全职岗位',
|
||||
@@ -169,7 +170,7 @@
|
||||
uni.setNavigationBarTitle({
|
||||
title: enumTitle[this.activeTab]
|
||||
})
|
||||
if (this.$store.state.user.token) {
|
||||
if (this.$api.haslogin()) {
|
||||
this.$store.dispatch('refreshAuthState').then((e) => {
|
||||
var auth = this.$store.state.auth
|
||||
if (!auth.bankCardState) {
|
||||
@@ -177,7 +178,6 @@
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const value = uni.getStorageSync('active');
|
||||
if (value) {
|
||||
this.activeTab = value;
|
||||
@@ -190,13 +190,7 @@
|
||||
},
|
||||
/*下拉刷新*/
|
||||
onPullDownRefresh: function() {
|
||||
if (!this.$store.state.user.token) {
|
||||
uni.redirectTo({
|
||||
url: "/pages/login/login"
|
||||
});
|
||||
} else {
|
||||
this.download();
|
||||
}
|
||||
this.download();
|
||||
},
|
||||
methods: {
|
||||
step() {
|
||||
@@ -228,30 +222,6 @@
|
||||
url: '/pageMy/my/resume/addSkill'
|
||||
})
|
||||
},
|
||||
/*定位*/
|
||||
getLocation: function() {
|
||||
var that = this;
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: function(res) {
|
||||
that.currentPoint = {
|
||||
latitude: res.latitude,
|
||||
longitude: res.longitude
|
||||
}
|
||||
// that.getAddrByPoint(res);
|
||||
that.getNearList(that.currentPoint)
|
||||
},
|
||||
complete: function(e) {}
|
||||
});
|
||||
},
|
||||
/*逆地址解析*/
|
||||
getAddrByPoint: function(point) {
|
||||
var that = this;
|
||||
var location = point.latitude + ',' + point.longitude
|
||||
getcoder(location, encodeURI(that.key), 0).then(res => {
|
||||
that.currentAddress = res.data.result.address
|
||||
});
|
||||
},
|
||||
goSeach: function() {
|
||||
uni.navigateTo({
|
||||
url: '../seach/seach'
|
||||
@@ -271,8 +241,8 @@
|
||||
this.activeTab = e;
|
||||
},
|
||||
//附近任务；
|
||||
getNearList: function(point) {
|
||||
nearMission(this.nearPage.current, this.nearPage.size).then(res => {
|
||||
getNearList: function() {
|
||||
nearMission(this.nearPage.current, this.nearPage.size, 1).then(res => {
|
||||
if (this.nearPage.current === 1) {
|
||||
this.companyList = [];
|
||||
}
|
||||
@@ -313,7 +283,7 @@
|
||||
},
|
||||
//最新任务；
|
||||
getNewList: function() {
|
||||
newMissionAll(this.newPage.current, this.newPage.size, '').then(res => {
|
||||
newMissionAll(this.newPage.current, this.newPage.size, '', 1).then(res => {
|
||||
if (this.newPage.current === 1) {
|
||||
this.newList = [];
|
||||
}
|
||||
@@ -326,32 +296,31 @@
|
||||
},
|
||||
//上拉加载
|
||||
upLoad: function() {
|
||||
if (this.activeTab === 0) {
|
||||
if (this.nearPage.current <= Math.ceil(this.nearPage.total / this.nearPage.size)) {
|
||||
this.getNearList(this.currentPoint);
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.activeTab === 1) {
|
||||
if (this.recommendPage.current <= Math.ceil(this.recommendPage.total / this.recommendPage
|
||||
.size)) {
|
||||
this.getRecommendList();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.activeTab === 2) {
|
||||
if (this.activeTab === '0') {
|
||||
if (this.newPage.current <= Math.ceil(this.newPage.total / this.newPage.size)) {
|
||||
this.getNewList();
|
||||
this.getNewList()
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.activeTab === '1') {
|
||||
if (this.nearPage.current <= Math.ceil(this.nearPage.total / this.nearPage.size)) {
|
||||
this.getNearList();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '已经是最后一页',
|
||||
})
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.activeTab === '2') {
|
||||
if (this.newPage.current <= Math.ceil(this.newPage.total / this.newPage.size)) {
|
||||
this.getPolicy();
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
@@ -365,25 +334,24 @@
|
||||
download: function() {
|
||||
console.log(this.activeTab)
|
||||
if (this.activeTab === '0') {
|
||||
this.nearPage.current = 1;
|
||||
console.log('123123')
|
||||
this.getLocation();
|
||||
this.newPage.current = 1;
|
||||
this.getNewList();
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 1000);
|
||||
return
|
||||
}
|
||||
if (this.activeTab === '1') {
|
||||
this.recommendPage.current = 1;
|
||||
this.getRecommendList();
|
||||
this.nearPage.current = 1;
|
||||
this.getNearList();
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 1000);
|
||||
return
|
||||
}
|
||||
if (this.activeTab === '2') {
|
||||
this.newPage.current = 1;
|
||||
this.getNewList();
|
||||
// this.newPage.current = 1;
|
||||
this.getPolicy();
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 1000);
|
||||
@@ -391,20 +359,13 @@
|
||||
}
|
||||
},
|
||||
getData: function() {
|
||||
if (!this.$store.state.user.token) {
|
||||
uni.redirectTo({
|
||||
url: "/pages/login/login"
|
||||
});
|
||||
} else {
|
||||
uni.$emit('newsReadChange');
|
||||
this.nearPage.current = 1;
|
||||
this.recommendPage.current = 1;
|
||||
this.newPage.current = 1;
|
||||
this.getLocation();
|
||||
this.getRecommendList();
|
||||
this.getNewList();
|
||||
this.getNearList();
|
||||
}
|
||||
uni.$emit('newsReadChange');
|
||||
this.nearPage.current = 1;
|
||||
this.recommendPage.current = 1;
|
||||
this.newPage.current = 1;
|
||||
this.getRecommendList();
|
||||
this.getNewList();
|
||||
this.getNearList();
|
||||
},
|
||||
|
||||
|
||||
@@ -442,7 +403,8 @@
|
||||
.content {
|
||||
background-color: #f3f4f8;
|
||||
padding-top: 20rpx;
|
||||
min-height: 80vh;
|
||||
/* min-height: 80vh; */
|
||||
min-height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
|
||||
}
|
||||
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -101,9 +101,10 @@
|
||||
工作地址：{{info.address || '暂无'}}
|
||||
</view>
|
||||
<view class="map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" :MapUrl="$config.supperMap" :init="false"
|
||||
:flag-tip="false"></super-map>
|
||||
:flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
<!-- <map class="map" :latitude="latitude" :longitude="longitude" :markers="covers"></map> -->
|
||||
</view>
|
||||
@@ -324,6 +325,8 @@
|
||||
detail(self.missionNo).then(res => {
|
||||
self.info = res.data.data;
|
||||
self.status = res.data.data.detailStatus;
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
|
||||
// AddressToLocation({
|
||||
// smart_address: res.data.data.address
|
||||
// }).then((result) => {
|
||||
@@ -337,13 +340,18 @@
|
||||
// self.longitude = self.info.lon;
|
||||
// self.covers[0].latitude = self.info.lat;
|
||||
// self.covers[0].longitude = self.info.lon;
|
||||
if (!(self.info.lat && self.info.lat === -1)) {
|
||||
self.$refs.uMap.initMap({
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
self.$nextTick(() => {
|
||||
self.$api.sleep(500).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.missionTitle,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
self.showDetail = true;
|
||||
self.getCollectStatus();
|
||||
if (self.type === 1) {
|
||||
|
||||
@@ -105,9 +105,10 @@
|
||||
</view>
|
||||
<view class="map">
|
||||
<!-- <seeLocation ref="cMap" :apikey="$config.apiKey"></seeLocation> -->
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" :MapUrl="$config.supperMap" :init="false"
|
||||
:flag-tip="false"></super-map>
|
||||
:flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
<!-- <map class="map" :latitude="latitude" :longitude="longitude" :markers="covers"></map> -->
|
||||
</view>
|
||||
@@ -332,14 +333,21 @@
|
||||
self.info = resData.data.data;
|
||||
self.status = resData.data.data.status;
|
||||
self.missionNo = resData.data.data.missionNo;
|
||||
self.latitude = self.info.lat;
|
||||
self.longitude = self.info.lon;
|
||||
self.covers[0].latitude = self.info.lat;
|
||||
self.covers[0].longitude = self.info.lon;
|
||||
if (!(self.info.lat && self.info.lat === -1)) {
|
||||
self.$refs.uMap.initMap({
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
// self.latitude = self.info.lat;
|
||||
// self.longitude = self.info.lon;
|
||||
// self.covers[0].latitude = self.info.lat;
|
||||
// self.covers[0].longitude = self.info.lon;
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
this.$nextTick(() => {
|
||||
self.$api.sleep(1000).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.jobName,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
// this.$refs.cMap.open()
|
||||
|
||||
@@ -109,9 +109,10 @@
|
||||
工作地址：{{info.address || '暂无'}}
|
||||
</view>
|
||||
<view class="map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" @regionchange="show = false" :init="false"
|
||||
:MapUrl="$config.supperMap" :flag-tip="false"></super-map>
|
||||
:MapUrl="$config.supperMap" :flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
<!-- <map class="map" :latitude="latitude" :longitude="longitude" :markers="covers"></map> -->
|
||||
</view>
|
||||
@@ -338,10 +339,17 @@
|
||||
self.longitude = self.info.lon;
|
||||
self.covers[0].latitude = self.info.lat;
|
||||
self.covers[0].longitude = self.info.lon;
|
||||
if (!(self.info.lat && self.info.lat === -1)) {
|
||||
self.$refs.uMap.initMap({
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
self.$nextTick(() => {
|
||||
self.$api.sleep(1000).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.jobName,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
self.showDetail = true;
|
||||
|
||||
@@ -106,9 +106,10 @@
|
||||
工作地址：{{info.address || '暂无'}}
|
||||
</view>
|
||||
<view class="map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" @regionchange="show = false" :init="false"
|
||||
:MapUrl="$config.supperMap" :flag-tip="false"></super-map>
|
||||
:MapUrl="$config.supperMap" :flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
</view>
|
||||
<view class="" style="height:200rpx;background-color: #f6f6f6;" v-if="isShow!=='0'"></view>
|
||||
@@ -272,6 +273,7 @@
|
||||
this.id = option.id; //消息id
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
onShow: function() {
|
||||
this.showDetail = true
|
||||
this.getData();
|
||||
@@ -316,14 +318,22 @@
|
||||
self.info = res.data.data;
|
||||
self.status = res.data.data.status;
|
||||
self.missionNo = res.data.data.missionNo;
|
||||
self.latitude = self.info.lat;
|
||||
self.longitude = self.info.lon;
|
||||
self.covers[0].latitude = self.info.lat;
|
||||
self.covers[0].longitude = self.info.lon;
|
||||
if (!(self.info.lat && self.info.lat === -1)) {
|
||||
self.$refs.uMap.initMap({
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
|
||||
// self.latitude = self.info.lat;
|
||||
// self.longitude = self.info.lon;
|
||||
// self.covers[0].latitude = self.info.lat;
|
||||
// self.covers[0].longitude = self.info.lon;
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
self.$nextTick(() => {
|
||||
self.$api.sleep(1000).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.jobName,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
self.showDetail = true;
|
||||
|
||||
@@ -87,9 +87,10 @@
|
||||
任务地址：{{ info.address }}
|
||||
</view>
|
||||
<view class="map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" :MapUrl="$config.supperMap"
|
||||
:flag-tip="false"></super-map>
|
||||
:flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
<!-- <map class="map" :latitude="latitude" :longitude="longitude" :markers="covers"></map> -->
|
||||
</view>
|
||||
@@ -282,10 +283,23 @@
|
||||
recruit_missionDetail(self.missionNo, self.type).then(res => {
|
||||
self.info = res.data.data;
|
||||
self.status = res.data.data.detailStatus;
|
||||
self.latitude = self.info.lat;
|
||||
self.longitude = self.info.lon;
|
||||
self.covers[0].latitude = self.info.lat;
|
||||
self.covers[0].longitude = self.info.lon;
|
||||
// self.latitude = self.info.lat;
|
||||
// self.longitude = self.info.lon;
|
||||
// self.covers[0].latitude = self.info.lat;
|
||||
// self.covers[0].longitude = self.info.lon;
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
self.$nextTick(() => {
|
||||
self.$api.sleep(1000).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.missionTitle,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
self.showDetail = true;
|
||||
if (self.type === 1) {
|
||||
// 设置已读
|
||||
|
||||
@@ -95,9 +95,10 @@
|
||||
岗位地址：{{ info.address }}
|
||||
</view>
|
||||
<view class="map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" :MapUrl="$config.supperMap"
|
||||
:flag-tip="false"></super-map>
|
||||
:flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
<!-- <map class="map" :latitude="latitude" :longitude="longitude" :markers="covers"></map> -->
|
||||
</view>
|
||||
@@ -263,10 +264,23 @@
|
||||
self.info = resData.data.data;
|
||||
self.status = resData.data.data.status;
|
||||
self.missionNo = resData.data.data.missionNo;
|
||||
self.latitude = self.info.lat;
|
||||
self.longitude = self.info.lon;
|
||||
self.covers[0].latitude = self.info.lat;
|
||||
self.covers[0].longitude = self.info.lon;
|
||||
// self.latitude = self.info.lat;
|
||||
// self.longitude = self.info.lon;
|
||||
// self.covers[0].latitude = self.info.lat;
|
||||
// self.covers[0].longitude = self.info.lon;
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
self.$nextTick(() => {
|
||||
self.$api.sleep(1000).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.jobName,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
self.showDetail = true;
|
||||
}
|
||||
},
|
||||
|
||||
@@ -95,9 +95,10 @@
|
||||
岗位地址：{{ info.address }}
|
||||
</view>
|
||||
<view class="map">
|
||||
<super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
<!-- <super-map ref="uMap" style="width: 100%;height: 100%;" :latitude="latitude" :longitude="longitude"
|
||||
:open="true" :zoom="14" :min-zoom="10" :max-zoom="20" :MapUrl="$config.supperMap"
|
||||
:flag-tip="false"></super-map>
|
||||
:flag-tip="false"></super-map> -->
|
||||
<zhuo-tianditu-MultiPoint-Mapper ref="tMap" :api-key="$config.apiKey"></zhuo-tianditu-MultiPoint-Mapper>
|
||||
</view>
|
||||
<!-- <map class="map" :latitude="latitude" :longitude="longitude" :markers="covers"></map> -->
|
||||
</view>
|
||||
@@ -250,10 +251,23 @@
|
||||
self.info = res.data.data;
|
||||
self.status = res.data.data.status;
|
||||
self.missionNo = res.data.data.missionNo;
|
||||
self.latitude = self.info.lat;
|
||||
self.longitude = self.info.lon;
|
||||
self.covers[0].latitude = self.info.lat;
|
||||
self.covers[0].longitude = self.info.lon;
|
||||
// self.latitude = self.info.lat;
|
||||
// self.longitude = self.info.lon;
|
||||
// self.covers[0].latitude = self.info.lat;
|
||||
// self.covers[0].longitude = self.info.lon;
|
||||
this.$refs.tMap.open(self.info.lon, self.info.lat)
|
||||
if (self.info.lon > 1 && self.info.lat > 1) {
|
||||
self.$nextTick(() => {
|
||||
self.$api.sleep(1000).then(() => {
|
||||
this.$refs.tMap.addFeature([{
|
||||
id: self.info.id,
|
||||
label: self.info.jobName,
|
||||
lat: self.info.lat,
|
||||
lon: self.info.lon,
|
||||
}])
|
||||
})
|
||||
})
|
||||
}
|
||||
self.showDetail = true;
|
||||
}, error => {
|
||||
console.log(error);
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -1,290 +1,290 @@
|
||||
import {
|
||||
isURL,
|
||||
validatenull
|
||||
} from '@/untils/validate.js'
|
||||
import website from '@/config/website'
|
||||
import {
|
||||
loginByUsername,
|
||||
getUserInfo,
|
||||
logout,
|
||||
refreshToken,
|
||||
mobileIsCms
|
||||
} from '@/api/user'
|
||||
import md5 from 'js-md5'
|
||||
import {
|
||||
getStore,
|
||||
setStore
|
||||
} from '@/untils/store.js'
|
||||
import {
|
||||
calcDate
|
||||
} from '@/untils/date.js'
|
||||
|
||||
let refreshTimer = null;
|
||||
|
||||
function startRefreshToken(dispatch) {
|
||||
refreshTimer = setInterval(() => {
|
||||
const token =
|
||||
getStore({
|
||||
name: "token",
|
||||
debug: true
|
||||
}) || {};
|
||||
const date = calcDate(token.datetime, new Date().getTime());
|
||||
if (validatenull(date)) return;
|
||||
if (date.seconds >= website.tokenTime) {
|
||||
dispatch("refreshToken")
|
||||
.then(() => {})
|
||||
.catch(() => {});
|
||||
}
|
||||
}, 10000);
|
||||
}
|
||||
|
||||
function stopRefreshToken() {
|
||||
clearInterval(refreshTimer)
|
||||
}
|
||||
|
||||
const user = {
|
||||
state: {
|
||||
tenantId: getStore({
|
||||
name: 'tenantId'
|
||||
}) || '',
|
||||
userInfo: getStore({
|
||||
name: 'userInfo'
|
||||
}) || [],
|
||||
token: getStore({
|
||||
name: 'token'
|
||||
}) || '',
|
||||
refreshToken: getStore({
|
||||
name: 'refreshToken'
|
||||
}) || '',
|
||||
userChecked: getStore({
|
||||
name: 'setUserCheckValue'
|
||||
}) || false,
|
||||
sendTimes: getStore({ //用户发送短信次数
|
||||
name: 'setUserSendTimes'
|
||||
}) || 0,
|
||||
seeEnterprise: getStore({ //用户发送短信次数
|
||||
name: 'enterprise'
|
||||
}) || 0, // 0 个体招工 ； 企业招工
|
||||
userLocation: null,
|
||||
userIsCms: false,
|
||||
},
|
||||
actions: {
|
||||
getMobileIsCms({
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
mobileIsCms().then((res) => {
|
||||
commit('setIsCms', {
|
||||
val: res.data.data
|
||||
})
|
||||
})
|
||||
},
|
||||
getUserLocation({
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
console.log('getUserLocation null1')
|
||||
// commit('setLocation', {
|
||||
// latitude: 31.133980,
|
||||
// longitude: 104.404419,
|
||||
// })
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: function(res) {
|
||||
const {
|
||||
longitude,
|
||||
latitude
|
||||
} = res
|
||||
commit('setLocation', {
|
||||
longitude,
|
||||
latitude
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
commit('setLocation', null)
|
||||
},
|
||||
complete: function(e) {}
|
||||
})
|
||||
},
|
||||
//用户点击radio按钮
|
||||
UserCheckedBtn({
|
||||
commit
|
||||
}, val) {
|
||||
commit('SET_USER_CHECKED', val);
|
||||
},
|
||||
//根据用户名登录
|
||||
LoginByUsername({
|
||||
commit,
|
||||
dispatch
|
||||
}, userInfo) {
|
||||
return new Promise((resolve, reject) => {
|
||||
loginByUsername(userInfo.tenantId, userInfo.username, md5(userInfo.password), userInfo.type,
|
||||
userInfo.key,
|
||||
userInfo.code, userInfo.token).then(res => {
|
||||
|
||||
const data = res.data;
|
||||
if (data.error_description) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: data.error_description,
|
||||
})
|
||||
} else {
|
||||
commit('SET_TOKEN', data.access_token);
|
||||
commit('SET_REFRESH_TOKEN', data.refresh_token);
|
||||
commit('SET_TENANT_ID', data.tenant_id);
|
||||
commit('SET_USER_INFO', data);
|
||||
dispatch('refreshAuthState')
|
||||
dispatch('startRefreshNewsTimer')
|
||||
startRefreshToken();
|
||||
}
|
||||
resolve(res);
|
||||
}).catch(error => {
|
||||
reject(error);
|
||||
})
|
||||
})
|
||||
},
|
||||
//根据手机号登录
|
||||
LoginByPhone({
|
||||
commit
|
||||
}, userInfo) {
|
||||
return new Promise((resolve) => {
|
||||
loginByUsername(userInfo.phone, userInfo.code).then(res => {
|
||||
const data = res.data.data;
|
||||
commit('SET_TOKEN', data);
|
||||
resolve();
|
||||
})
|
||||
})
|
||||
},
|
||||
GetUserInfo({
|
||||
commit
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getUserInfo().then((res) => {
|
||||
const data = res.data.data;
|
||||
resolve(data);
|
||||
}).catch(err => {
|
||||
reject(err);
|
||||
})
|
||||
})
|
||||
},
|
||||
//刷新token
|
||||
refreshToken({
|
||||
state,
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
refreshToken(state.refreshToken, state.tenantId).then(res => {
|
||||
const data = res.data;
|
||||
dispatch('refreshAuthState')
|
||||
commit('SET_TOKEN', data.access_token);
|
||||
commit('SET_REFRESH_TOKEN', data.refresh_token);
|
||||
resolve();
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
// 登出
|
||||
LogOut({
|
||||
dispatch,
|
||||
commit
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout();
|
||||
stopRefreshToken();
|
||||
commit('SET_TOKEN', '');
|
||||
commit('SET_VIPCODE', '0');
|
||||
resolve();
|
||||
})
|
||||
},
|
||||
//注销session
|
||||
FedLogOut({
|
||||
commit
|
||||
}) {
|
||||
return new Promise(resolve => {
|
||||
commit('SET_TOKEN', '');
|
||||
resolve();
|
||||
})
|
||||
},
|
||||
startRefreshTokenTimer({
|
||||
state,
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
if (state.token) {
|
||||
dispatch('refreshToken').then(() => {
|
||||
startRefreshToken(dispatch);
|
||||
})
|
||||
}
|
||||
},
|
||||
//更新用户接收短信次数
|
||||
UpdateUserSendTimes({
|
||||
commit
|
||||
}, data) {
|
||||
commit('SET_USER_SENDTIMES', data);
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
setIsCms(state, payload) {
|
||||
state.userIsCms = payload.val
|
||||
},
|
||||
setLocation(state, val) {
|
||||
state.userLocation = val
|
||||
},
|
||||
setEnterprise(state, val) { // 0 个体招工 ； 企业招工
|
||||
state.seeEnterprise = val;
|
||||
setStore({
|
||||
name: 'enterprise',
|
||||
content: val,
|
||||
})
|
||||
},
|
||||
SET_TOKEN: (state, token) => {
|
||||
state.token = token;
|
||||
setStore({
|
||||
name: 'token',
|
||||
content: state.token,
|
||||
type: 'session'
|
||||
})
|
||||
},
|
||||
SET_REFRESH_TOKEN: (state, refreshToken) => {
|
||||
state.refreshToken = refreshToken;
|
||||
setStore({
|
||||
name: 'refreshToken',
|
||||
content: state.refreshToken,
|
||||
type: 'session'
|
||||
})
|
||||
},
|
||||
SET_TENANT_ID: (state, tenantId) => {
|
||||
state.tenantId = tenantId;
|
||||
setStore({
|
||||
name: 'tenantId',
|
||||
content: state.tenantId,
|
||||
type: 'session'
|
||||
})
|
||||
},
|
||||
SET_USER_INFO: (state, userInfo) => {
|
||||
state.userInfo = userInfo;
|
||||
setStore({
|
||||
name: 'userInfo',
|
||||
content: state.userInfo
|
||||
})
|
||||
},
|
||||
SET_USER_CHECKED: (state, val) => {
|
||||
state.userChecked = val;
|
||||
setStore({
|
||||
name: 'setUserCheckValue',
|
||||
content: state.userChecked
|
||||
})
|
||||
},
|
||||
SET_USER_SENDTIMES: (state, val) => {
|
||||
state.sendTimes = val;
|
||||
setStore({
|
||||
name: 'setUserSendTimes',
|
||||
content: state.sendTimes
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
import {
|
||||
isURL,
|
||||
validatenull
|
||||
} from '@/untils/validate.js'
|
||||
import website from '@/config/website'
|
||||
import {
|
||||
loginByUsername,
|
||||
getUserInfo,
|
||||
logout,
|
||||
refreshToken,
|
||||
mobileIsCms
|
||||
} from '@/api/user'
|
||||
import md5 from 'js-md5'
|
||||
import {
|
||||
getStore,
|
||||
setStore
|
||||
} from '@/untils/store.js'
|
||||
import {
|
||||
calcDate
|
||||
} from '@/untils/date.js'
|
||||
|
||||
let refreshTimer = null;
|
||||
|
||||
function startRefreshToken(dispatch) {
|
||||
refreshTimer = setInterval(() => {
|
||||
const token =
|
||||
getStore({
|
||||
name: "token",
|
||||
debug: true
|
||||
}) || {};
|
||||
const date = calcDate(token.datetime, new Date().getTime());
|
||||
if (validatenull(date)) return;
|
||||
if (date.seconds >= website.tokenTime) {
|
||||
dispatch("refreshToken")
|
||||
.then(() => {})
|
||||
.catch(() => {});
|
||||
}
|
||||
}, 10000);
|
||||
}
|
||||
|
||||
function stopRefreshToken() {
|
||||
clearInterval(refreshTimer)
|
||||
}
|
||||
|
||||
const user = {
|
||||
state: {
|
||||
tenantId: getStore({
|
||||
name: 'tenantId'
|
||||
}) || '',
|
||||
userInfo: getStore({
|
||||
name: 'userInfo'
|
||||
}) || [],
|
||||
token: getStore({
|
||||
name: 'token'
|
||||
}) || '',
|
||||
refreshToken: getStore({
|
||||
name: 'refreshToken'
|
||||
}) || '',
|
||||
userChecked: getStore({
|
||||
name: 'setUserCheckValue'
|
||||
}) || false,
|
||||
sendTimes: getStore({ //用户发送短信次数
|
||||
name: 'setUserSendTimes'
|
||||
}) || 0,
|
||||
seeEnterprise: getStore({ //用户发送短信次数
|
||||
name: 'enterprise'
|
||||
}) || 0, // 0 个体招工 ； 企业招工
|
||||
userLocation: null,
|
||||
userIsCms: false,
|
||||
},
|
||||
actions: {
|
||||
getMobileIsCms({
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
mobileIsCms().then((res) => {
|
||||
commit('setIsCms', {
|
||||
val: res.data.data
|
||||
})
|
||||
})
|
||||
},
|
||||
getUserLocation({
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
console.log('getUserLocation null1')
|
||||
// commit('setLocation', {
|
||||
// latitude: 31.133980,
|
||||
// longitude: 104.404419,
|
||||
// })
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: function(res) {
|
||||
const {
|
||||
longitude,
|
||||
latitude
|
||||
} = res
|
||||
commit('setLocation', {
|
||||
longitude,
|
||||
latitude
|
||||
})
|
||||
},
|
||||
fail: function(err) {
|
||||
commit('setLocation', null)
|
||||
},
|
||||
complete: function(e) {}
|
||||
})
|
||||
},
|
||||
//用户点击radio按钮
|
||||
UserCheckedBtn({
|
||||
commit
|
||||
}, val) {
|
||||
commit('SET_USER_CHECKED', val);
|
||||
},
|
||||
//根据用户名登录
|
||||
LoginByUsername({
|
||||
commit,
|
||||
dispatch
|
||||
}, userInfo) {
|
||||
return new Promise((resolve, reject) => {
|
||||
loginByUsername(userInfo.tenantId, userInfo.username, md5(userInfo.password), userInfo.type,
|
||||
userInfo.key,
|
||||
userInfo.code, userInfo.token).then(res => {
|
||||
|
||||
const data = res.data;
|
||||
if (data.error_description) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: data.error_description,
|
||||
})
|
||||
} else {
|
||||
commit('SET_TOKEN', data.access_token);
|
||||
commit('SET_REFRESH_TOKEN', data.refresh_token);
|
||||
commit('SET_TENANT_ID', data.tenant_id);
|
||||
commit('SET_USER_INFO', data);
|
||||
dispatch('refreshAuthState')
|
||||
dispatch('startRefreshNewsTimer')
|
||||
startRefreshToken();
|
||||
}
|
||||
resolve(res);
|
||||
}).catch(error => {
|
||||
reject(error);
|
||||
})
|
||||
})
|
||||
},
|
||||
//根据手机号登录
|
||||
LoginByPhone({
|
||||
commit
|
||||
}, userInfo) {
|
||||
return new Promise((resolve) => {
|
||||
loginByUsername(userInfo.phone, userInfo.code).then(res => {
|
||||
const data = res.data.data;
|
||||
commit('SET_TOKEN', data);
|
||||
resolve();
|
||||
})
|
||||
})
|
||||
},
|
||||
GetUserInfo({
|
||||
commit
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getUserInfo().then((res) => {
|
||||
const data = res.data.data;
|
||||
resolve(data);
|
||||
}).catch(err => {
|
||||
reject(err);
|
||||
})
|
||||
})
|
||||
},
|
||||
//刷新token
|
||||
refreshToken({
|
||||
state,
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
refreshToken(state.refreshToken, state.tenantId).then(res => {
|
||||
const data = res.data;
|
||||
dispatch('refreshAuthState')
|
||||
commit('SET_TOKEN', data.access_token);
|
||||
commit('SET_REFRESH_TOKEN', data.refresh_token);
|
||||
resolve();
|
||||
}).catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
},
|
||||
// 登出
|
||||
LogOut({
|
||||
dispatch,
|
||||
commit
|
||||
}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout();
|
||||
stopRefreshToken();
|
||||
commit('SET_TOKEN', '');
|
||||
commit('SET_VIPCODE', '0');
|
||||
resolve();
|
||||
})
|
||||
},
|
||||
//注销session
|
||||
FedLogOut({
|
||||
commit
|
||||
}) {
|
||||
return new Promise(resolve => {
|
||||
commit('SET_TOKEN', '');
|
||||
resolve();
|
||||
})
|
||||
},
|
||||
startRefreshTokenTimer({
|
||||
state,
|
||||
commit,
|
||||
dispatch
|
||||
}) {
|
||||
if (state.token) {
|
||||
dispatch('refreshToken').then(() => {
|
||||
startRefreshToken(dispatch);
|
||||
})
|
||||
}
|
||||
},
|
||||
//更新用户接收短信次数
|
||||
UpdateUserSendTimes({
|
||||
commit
|
||||
}, data) {
|
||||
commit('SET_USER_SENDTIMES', data);
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
setIsCms(state, payload) {
|
||||
state.userIsCms = payload.val
|
||||
},
|
||||
setLocation(state, val) {
|
||||
state.userLocation = val
|
||||
},
|
||||
setEnterprise(state, val) { // 0 个体招工 ； 企业招工
|
||||
state.seeEnterprise = val;
|
||||
setStore({
|
||||
name: 'enterprise',
|
||||
content: val,
|
||||
})
|
||||
},
|
||||
SET_TOKEN: (state, token) => {
|
||||
state.token = token;
|
||||
setStore({
|
||||
name: 'token',
|
||||
content: state.token,
|
||||
type: 'session'
|
||||
})
|
||||
},
|
||||
SET_REFRESH_TOKEN: (state, refreshToken) => {
|
||||
state.refreshToken = refreshToken;
|
||||
setStore({
|
||||
name: 'refreshToken',
|
||||
content: state.refreshToken,
|
||||
type: 'session'
|
||||
})
|
||||
},
|
||||
SET_TENANT_ID: (state, tenantId) => {
|
||||
state.tenantId = tenantId;
|
||||
setStore({
|
||||
name: 'tenantId',
|
||||
content: state.tenantId,
|
||||
type: 'session'
|
||||
})
|
||||
},
|
||||
SET_USER_INFO: (state, userInfo) => {
|
||||
state.userInfo = userInfo;
|
||||
setStore({
|
||||
name: 'userInfo',
|
||||
content: state.userInfo
|
||||
})
|
||||
},
|
||||
SET_USER_CHECKED: (state, val) => {
|
||||
state.userChecked = val;
|
||||
setStore({
|
||||
name: 'setUserCheckValue',
|
||||
content: state.userChecked
|
||||
})
|
||||
},
|
||||
SET_USER_SENDTIMES: (state, val) => {
|
||||
state.sendTimes = val;
|
||||
setStore({
|
||||
name: 'setUserSendTimes',
|
||||
content: state.sendTimes
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
export default user
|
||||
@@ -0,0 +1,226 @@
|
||||
<template>
|
||||
<view style="width: 100%;height: 100%;">
|
||||
<view id="mapDiv" class="mapDiv" :apikey="apiKey" :prop="option" :change:prop="Trenderjs.initTMap"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import tools from '../../tools.js'
|
||||
import iconPath from '../../static/point.png'
|
||||
export default {
|
||||
name: 'TianDiTu-Map',
|
||||
data() {
|
||||
return {
|
||||
Tmap: null,
|
||||
option: {
|
||||
type: '',
|
||||
apikey: '',
|
||||
cover: null,
|
||||
lng: '',
|
||||
lat: '',
|
||||
png: iconPath
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
apiKey: {
|
||||
type: String,
|
||||
require: true,
|
||||
default: ''
|
||||
},
|
||||
customIcon: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
compliteonLoadTianDiTu() {
|
||||
this.$emit('onLoadTianDiTu')
|
||||
},
|
||||
initCharts(lng, lat) {
|
||||
this.option = {
|
||||
...this.option,
|
||||
apikey: this.apiKey,
|
||||
lng,
|
||||
lat,
|
||||
png: this.customIcon || this.option.png,
|
||||
type: 'open'
|
||||
}
|
||||
},
|
||||
upDataCharts(lng, lat) {
|
||||
this.option = {
|
||||
...this.option,
|
||||
type: 'Icon',
|
||||
lng,
|
||||
lat,
|
||||
png: this.customIcon || this.option.png,
|
||||
type: 'update'
|
||||
}
|
||||
},
|
||||
addFeature(cover) {
|
||||
this.option = {
|
||||
...this.option,
|
||||
type: 'Icon',
|
||||
cover,
|
||||
png: this.customIcon || this.option.png,
|
||||
type: 'addFeature'
|
||||
}
|
||||
},
|
||||
selectItem(info) {
|
||||
this.$emit('onSelect', info)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<script module="Trenderjs" lang="renderjs">
|
||||
var Tmap = null;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
options: {},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// if (typeof window.T === 'object') {
|
||||
// console.warn('--------天地图已加载--------');
|
||||
// } else {
|
||||
// if (this.apiKey) {
|
||||
// const script = document.createElement('script')
|
||||
// script.src = 'http://api.tianditu.gov.cn/api?v=4.0&tk=' + this.apiKey
|
||||
// script.onload = this.initChartsRender.bind(this)
|
||||
// document.head.appendChild(script)
|
||||
// }
|
||||
// }
|
||||
},
|
||||
methods: {
|
||||
initTMap(newValue, oldValue, ownerInstance, instance) {
|
||||
this.options = newValue
|
||||
if (newValue.type === 'open' && newValue.apikey) {
|
||||
if (!window.T) {
|
||||
const script = document.createElement('script')
|
||||
script.src = 'http://api.tianditu.gov.cn/api?v=4.0&tk=' + this.options.apikey
|
||||
script.onload = this.initChartsRender.bind(this)
|
||||
document.head.appendChild(script)
|
||||
console.log('open')
|
||||
} else {
|
||||
const {
|
||||
lng,
|
||||
lat
|
||||
} = this.options
|
||||
|
||||
Tmap = null;
|
||||
Tmap = new T.Map('mapDiv', {
|
||||
projection: 'EPSG:4326',
|
||||
});
|
||||
this.upDataChartsRender(lng, lat)
|
||||
}
|
||||
} else {
|
||||
const {
|
||||
lng,
|
||||
lat,
|
||||
cover
|
||||
} = newValue
|
||||
|
||||
switch (newValue.type) {
|
||||
case 'update':
|
||||
this.upDataChartsRender(lng, lat)
|
||||
break;
|
||||
case 'addFeature':
|
||||
Tmap.clearOverLays()
|
||||
cover.map((item, index) => {
|
||||
this.setIcon(item.lon, item.lat, false, true, false, item)
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
initChartsRender() {
|
||||
this.$ownerInstance.callMethod('compliteonLoadTianDiTu')
|
||||
const {
|
||||
lng,
|
||||
lat
|
||||
} = this.options
|
||||
var that = this;
|
||||
Tmap = new T.Map('mapDiv', {
|
||||
projection: 'EPSG:4326',
|
||||
});
|
||||
this.upDataChartsRender(lng, lat)
|
||||
},
|
||||
upDataChartsRender(lng, lat, zoom = 15) {
|
||||
if (!Tmap) return
|
||||
Tmap.centerAndZoom(new T.LngLat(lng, lat), zoom);
|
||||
},
|
||||
setIcon(lng, lat, isClear, isClick = false, isLabel = false, item) {
|
||||
if (isClear) {
|
||||
Tmap.clearOverLays()
|
||||
}
|
||||
const latlng = new T.LngLat(lng, lat)
|
||||
const icon = new T.Icon({
|
||||
iconUrl: this.options.png,
|
||||
iconSize: new T.Point(30, 30),
|
||||
iconAnchor: new T.Point(15, 30)
|
||||
});
|
||||
if (isLabel) {
|
||||
const label = new T.Label({
|
||||
text: `<div style="max-width: 50px; overflow: hidden">${item.label}</div>`,
|
||||
position: latlng,
|
||||
offset: new T.Point(-50, 0)
|
||||
});
|
||||
Tmap.addOverLay(label);
|
||||
}
|
||||
const marker = new T.Marker(latlng, {
|
||||
icon
|
||||
});
|
||||
|
||||
if (isClick) {
|
||||
this.removeMarkerClick(marker);
|
||||
//注册标注的点击事件
|
||||
marker.addEventListener("click", this.MarkerClick.bind(null, item));
|
||||
}
|
||||
|
||||
Tmap.addOverLay(marker);
|
||||
},
|
||||
removeMarkerClick(marker) {
|
||||
//移除标注的点击事件
|
||||
marker.removeEventListener("click", this.MarkerClick);
|
||||
},
|
||||
MarkerClick(item, e) {
|
||||
this.openInfo(item.label, e)
|
||||
this.$ownerInstance.callMethod('selectItem', item)
|
||||
},
|
||||
openInfo(content, e) {
|
||||
const point = e.lnglat;
|
||||
const marker = new T.Marker(point); // 创建标注
|
||||
const markerInfoWin = new T.InfoWindow(content, {
|
||||
offset: new T.Point(0, -30)
|
||||
}); // 创建信息窗口对象
|
||||
Tmap.openInfoWindow(markerInfoWin, point); //开启信息窗口
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#mapDiv {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/deep/ .tdt-control-copyright {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/ .tdt-label {
|
||||
/* background: transparent;
|
||||
box-shadow: none;
|
||||
border: 0; */
|
||||
}
|
||||
|
||||
/deep/ .tdt-pane {
|
||||
z-index: 0;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<view style="width: 100%; height: 100%;">
|
||||
<view class="mask" style="width: 100%; height: 100%;">
|
||||
<tiandituMap ref="tiandituMapRefs" @onLoadTianDiTu="initMaps" @onSelect="selectPoint" :apiKey="apiKey"
|
||||
:customIcon="icon">
|
||||
</tiandituMap>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import tiandituMap from './tianditu-map.vue'
|
||||
import tools from '../../tools.js'
|
||||
export default {
|
||||
name: 'zhuozhuoTiandituPlugin',
|
||||
components: {
|
||||
tiandituMap,
|
||||
},
|
||||
props: {
|
||||
apiKey: {
|
||||
type: String,
|
||||
require: true,
|
||||
default: ''
|
||||
},
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
winWidth: 0,
|
||||
winHeight: 0,
|
||||
winTop: 0,
|
||||
visible: false,
|
||||
datalist: [],
|
||||
selectItem: {},
|
||||
iStatusBarHeight: 0,
|
||||
option: {
|
||||
apikey: 123123,
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
var that = this
|
||||
// #ifdef APP
|
||||
// 44 + 10 44: search Input height
|
||||
const searchHeight = this.search ? 54 : 10
|
||||
const {
|
||||
statusBarHeight,
|
||||
screenHeight,
|
||||
windowHeight
|
||||
} = uni.getSystemInfoSync()
|
||||
if (screenHeight === windowHeight) {
|
||||
that.iStatusBarHeight = statusBarHeight + searchHeight;
|
||||
} else {
|
||||
that.iStatusBarHeight = 0;
|
||||
}
|
||||
// #endif
|
||||
uni.getSystemInfo({
|
||||
success: function(res) {
|
||||
that.winWidth = res.windowWidth
|
||||
that.winHeight = res.windowHeight
|
||||
that.winTop = res.windowTop
|
||||
}
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
open(lon, lat) {
|
||||
if (lon && lat) {
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.tiandituMapRefs.initCharts(lon, lat)
|
||||
})
|
||||
} else {
|
||||
console.error('请传入lon, lat')
|
||||
}
|
||||
},
|
||||
upDateLonLat(cover) {
|
||||
if (lon && lat) {
|
||||
this.$refs.tiandituMapRefs.upDataCharts(lon && lat)
|
||||
} else {
|
||||
console.error('请传入lon, lat')
|
||||
}
|
||||
},
|
||||
addFeature(cover) {
|
||||
if (cover && Array.isArray(cover) && cover.length) {
|
||||
this.$refs.tiandituMapRefs.addFeature(cover)
|
||||
} else {
|
||||
console.error('请传入 cover', cover)
|
||||
}
|
||||
},
|
||||
selectPoint(e) {
|
||||
this.$emit('onSelect', e)
|
||||
},
|
||||
initMaps() {
|
||||
console.warn('--------天地图加载完成--------');
|
||||
this.$emit('onLoad')
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scope>
|
||||
.mask {
|
||||
/* overflow: hidden; */
|
||||
/* position: fixed;
|
||||
left: 0;
|
||||
z-index: 399; */
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
/* footer */
|
||||
.list-boxd {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 401;
|
||||
right: 0;
|
||||
border-radius: 14px 14px 0 0;
|
||||
background: #FFFFFF;
|
||||
transition: all 1s;
|
||||
}
|
||||
|
||||
.list-header {
|
||||
height: 20px;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #f3f4f6;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.list-header::after {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
content: '';
|
||||
height: 6px;
|
||||
width: 60px;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
}
|
||||
|
||||
.list-content {
|
||||
max-height: 50vh;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.card {
|
||||
min-height: 44px;
|
||||
padding: 12px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.card-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.card-right {
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
border-top: 2px solid #666666;
|
||||
border-right: 2px solid #666666;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
|
||||
.card:active {
|
||||
background-color: #f3f4f6;
|
||||
}
|
||||
|
||||
|
||||
.card::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
bottom: 0;
|
||||
height: 1px;
|
||||
background-color: #e8e8e8;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.card:last-child::after {
|
||||
height: 0;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.card-text {
|
||||
color: #e8e8e8;
|
||||
font-size: 13px;
|
||||
}
|
||||
</style>
|
||||
83
uni_modules/zhuo-tianditu-MultiPoint-Mapper/package.json
Normal file
83
uni_modules/zhuo-tianditu-MultiPoint-Mapper/package.json
Normal file
@@ -0,0 +1,83 @@
|
||||
{
|
||||
"id": "zhuo-tianditu-MultiPoint-Mapper",
|
||||
"displayName": "zhuo-tianditu-MultiPoint-Mapper",
|
||||
"version": "1.0.0",
|
||||
"description": "zhuo-tianditu-MultiPoint-Mapper",
|
||||
"keywords": [
|
||||
"zhuo-tianditu-MultiPoint-Mapper"
|
||||
],
|
||||
"repository": "",
|
||||
"engines": {
|
||||
"HBuilderX": "^3.1.0"
|
||||
},
|
||||
"dcloudext": {
|
||||
"type": "component-vue",
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "",
|
||||
"data": "",
|
||||
"permissions": ""
|
||||
},
|
||||
"npmurl": ""
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "u",
|
||||
"aliyun": "u",
|
||||
"alipay": "u"
|
||||
},
|
||||
"client": {
|
||||
"Vue": {
|
||||
"vue2": "u",
|
||||
"vue3": "u"
|
||||
},
|
||||
"App": {
|
||||
"app-vue": "u",
|
||||
"app-nvue": "u",
|
||||
"app-uvue": "u"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "u",
|
||||
"Android Browser": "u",
|
||||
"微信浏览器(Android)": "u",
|
||||
"QQ浏览器(Android)": "u"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "u",
|
||||
"IE": "u",
|
||||
"Edge": "u",
|
||||
"Firefox": "u",
|
||||
"Safari": "u"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "u",
|
||||
"阿里": "u",
|
||||
"百度": "u",
|
||||
"字节跳动": "u",
|
||||
"QQ": "u",
|
||||
"钉钉": "u",
|
||||
"快手": "u",
|
||||
"飞书": "u",
|
||||
"京东": "u"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
1
uni_modules/zhuo-tianditu-MultiPoint-Mapper/readme.md
Normal file
1
uni_modules/zhuo-tianditu-MultiPoint-Mapper/readme.md
Normal file
@@ -0,0 +1 @@
|
||||
# zhuo-tianditu-MultiPoint-Mapper
|
||||
BIN
uni_modules/zhuo-tianditu-MultiPoint-Mapper/static/point.png
Normal file
BIN
uni_modules/zhuo-tianditu-MultiPoint-Mapper/static/point.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
106
uni_modules/zhuo-tianditu-MultiPoint-Mapper/tools.js
Normal file
106
uni_modules/zhuo-tianditu-MultiPoint-Mapper/tools.js
Normal file
@@ -0,0 +1,106 @@
|
||||
/**
|
||||
* @param title String，提示的内容
|
||||
* @param duration String，提示的延迟时间，单位毫秒，默认：1500
|
||||
* @param mask Boolean，是否显示透明蒙层，防止触摸穿透，默认：false
|
||||
* @param icon String，图标：success、error、fail、exception、loading、none，默认：none
|
||||
**/
|
||||
export function createMessage(title, duration = 1500, mask = false, icon = "none") {
|
||||
uni.showToast({
|
||||
title,
|
||||
duration: duration,
|
||||
mask,
|
||||
icon
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @param url String，请求的地址，默认：none
|
||||
* @param data Object，请求的参数，默认：{}
|
||||
* @param method String，请求的方式，默认：GET
|
||||
* @param loading Boolean，是否需要loading ，默认：false
|
||||
* @param header Object，headers，默认：{}
|
||||
* @returns promise
|
||||
**/
|
||||
export function createRequest(url, data = {}, loading = false, method = 'GET', header = {}) {
|
||||
if (loading) {
|
||||
uni.showLoading({
|
||||
title: '请稍后',
|
||||
mask: true
|
||||
})
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
url: url,
|
||||
method: method,
|
||||
data: data,
|
||||
header: header,
|
||||
success: res => {
|
||||
if (res.statusCode === 200) {
|
||||
resolve(res.data)
|
||||
} else {
|
||||
if (res.data.msg) {
|
||||
const str = typeof res.data.resolve === 'string' ? ',' + res.data.resolve :
|
||||
''
|
||||
createMessage(res.data.msg + str)
|
||||
}
|
||||
throw new Error('请求错误 ' + url)
|
||||
reject()
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(err)
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading();
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 数据格式化
|
||||
* @param obj Object，响应的数据
|
||||
* @param type Number 0 ｜ 1，处理类型
|
||||
* @returns Object {address = string, name = string, location = {lon, lat }, infomation = {}}
|
||||
*/
|
||||
export function formatterAdressLocation(obj, type) {
|
||||
switch (type) {
|
||||
case 1:
|
||||
return {
|
||||
address: obj.formatted_address,
|
||||
name: '',
|
||||
location: obj.location,
|
||||
infomation: obj.addressComponent
|
||||
}
|
||||
break;
|
||||
case 2:
|
||||
const [lon, lat] = obj.lonlat.split(',')
|
||||
return {
|
||||
address: obj.address,
|
||||
name: obj.name,
|
||||
location: {
|
||||
lon,
|
||||
lat
|
||||
},
|
||||
infomation: obj
|
||||
}
|
||||
break
|
||||
case 3:
|
||||
return {
|
||||
address: obj.location.keyWord,
|
||||
name: '',
|
||||
location: {
|
||||
lon: obj.location.lon,
|
||||
lat: obj.location.lat,
|
||||
},
|
||||
infomation: obj.location
|
||||
}
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
export default {
|
||||
createMessage,
|
||||
createRequest,
|
||||
formatterAdressLocation
|
||||
}
|
||||
@@ -190,24 +190,24 @@ export function Promisify(func) {
|
||||
export function GoLogin() {
|
||||
if (showModal) {
|
||||
showModal = false
|
||||
location.href = "https://dy12333.org.cn/h5/"
|
||||
// uni.showModal({
|
||||
// title: "提示",
|
||||
// content: "您还未登录，点击确认去登录",
|
||||
// success({
|
||||
// confirm
|
||||
// }) {
|
||||
// if (confirm) {
|
||||
// uni.redirectTo({
|
||||
// url: "/pages/login/login"
|
||||
// });
|
||||
// }
|
||||
// showModal = true
|
||||
// },
|
||||
// fail() {
|
||||
// showModal = true
|
||||
// }
|
||||
// })
|
||||
// location.href = "https://dy12333.org.cn/h5/"
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "您还未登录，点击确认去登录",
|
||||
success({
|
||||
confirm
|
||||
}) {
|
||||
if (confirm) {
|
||||
uni.redirectTo({
|
||||
url: "/pages/login/login"
|
||||
});
|
||||
}
|
||||
showModal = true
|
||||
},
|
||||
fail() {
|
||||
showModal = true
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@ module.exports = {
|
||||
port: 1887,
|
||||
proxy: {
|
||||
'/api': {
|
||||
target: 'http://10.165.0.173:8000',
|
||||
target: 'http://39.98.184.58:8000',
|
||||
ws: true,
|
||||
pathRewrite: {
|
||||
'^/api': '/'
|
||||
|
||||
Reference in New Issue
Block a user