flat:来源标红
This commit is contained in:
Apcallover
@@ -1,390 +1,386 @@
|
||||
<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
|
||||
console.log(this.$store.state.user.userLocation)
|
||||
if (this.$store.state.user.userLocation) {
|
||||
const {
|
||||
latitude,
|
||||
longitude
|
||||
} = this.$store.state.user.userLocation
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$refs.uMap.addFeature(covers)
|
||||
})
|
||||
} else {
|
||||
_this.$api.msg('无法获得周边信息')
|
||||
}
|
||||
},
|
||||
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
|
||||
if (this.$store.state.user.userLocation) {
|
||||
const {
|
||||
latitude,
|
||||
longitude
|
||||
} = this.$store.state.user.userLocation
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$refs.uMap.addFeature(covers)
|
||||
})
|
||||
} else {
|
||||
_this.$api.msg('无法获得周边信息')
|
||||
}
|
||||
// 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>
|
||||
<!-- <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.13398,
|
||||
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;
|
||||
console.log(this.$store.state.user.userLocation);
|
||||
if (this.$store.state.user.userLocation) {
|
||||
const { latitude, longitude } = this.$store.state.user.userLocation;
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$refs.uMap.addFeature(covers);
|
||||
});
|
||||
} else {
|
||||
_this.$api.msg('无法获得周边信息');
|
||||
}
|
||||
},
|
||||
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;
|
||||
if (this.$store.state.user.userLocation) {
|
||||
const { latitude, longitude } = this.$store.state.user.userLocation;
|
||||
_this.getList(longitude, latitude).then((covers) => {
|
||||
_this.$refs.uMap.addFeature(covers);
|
||||
});
|
||||
} else {
|
||||
_this.$api.msg('无法获得周边信息');
|
||||
}
|
||||
// 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;
|
||||
}
|
||||
|
||||
::v-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>
|
||||
|
||||
@@ -1,174 +1,172 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="sealBox">
|
||||
<view style="height: 70rpx;"></view>
|
||||
<view class="name">签名</view>
|
||||
<view v-if="src" class="sealContent">
|
||||
<image class="img" mode="aspectFit" :src="src"></image>
|
||||
</view>
|
||||
<view v-else class="sealContent" @click="go">
|
||||
<view class="contentFont">点击输入手写签名</view>
|
||||
</view>
|
||||
<view class="list" v-if="src">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">签名密码</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view class="rightContent nochoose">
|
||||
<view v-if="src" class="uni-input">已设置</view>
|
||||
<view v-else class="uni-input">未设置</view>
|
||||
</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!src" class="sealAgreement">
|
||||
<checkbox :checked="status" @click="checkClick"/>
|
||||
<view>我已阅读并同意</view>
|
||||
<view class="agreement" @click="goAgreement('/pages/user/sealAgreement')">《申请证书协议》</view>
|
||||
</view>
|
||||
<view class="btn">
|
||||
<view v-if="src" @click="next" class="bottombtn">完成</view>
|
||||
<view v-if="!src" class="bottombtn nocheck">完成</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="sealBox">
|
||||
<view style="height: 70rpx"></view>
|
||||
<view class="name">签名</view>
|
||||
<view v-if="src" class="sealContent">
|
||||
<image class="img" mode="aspectFit" :src="src"></image>
|
||||
</view>
|
||||
<view v-else class="sealContent" @click="go">
|
||||
<view class="contentFont">点击输入手写签名</view>
|
||||
</view>
|
||||
<view class="list" v-if="src">
|
||||
<view class="listLeft">
|
||||
<view class="listTitle">签名密码</view>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<view class="rightContent nochoose">
|
||||
<view v-if="src" class="uni-input">已设置</view>
|
||||
<view v-else class="uni-input">未设置</view>
|
||||
</view>
|
||||
<image src="@/static/img/right.svg" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!src" class="sealAgreement">
|
||||
<checkbox :checked="status" @click="checkClick" />
|
||||
<view>我已阅读并同意</view>
|
||||
<view class="agreement" @click="goAgreement('/pages/user/sealAgreement')">《申请证书协议》</view>
|
||||
</view>
|
||||
<view class="btn">
|
||||
<view v-if="src" @click="next" class="bottombtn">完成</view>
|
||||
<view v-if="!src" class="bottombtn nocheck">完成</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters} from 'vuex'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
status:false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.$store.dispatch('setAutograph')
|
||||
},
|
||||
methods: {
|
||||
goAgreement (url) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
},
|
||||
checkClick(){
|
||||
this.status = !this.status
|
||||
},
|
||||
next () {
|
||||
uni.navigateBack()
|
||||
// uni.switchTab({
|
||||
// url: '/pages/index/index'
|
||||
// })
|
||||
},
|
||||
go(url){
|
||||
if (!this.status){
|
||||
uni.showToast({
|
||||
title: '请先阅读并同意《申请证书协议》',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: `/pageMy/setUserBase/seal/sealCanvas?path=/pageMy/setUserBase/seal/sealCanvas`
|
||||
})
|
||||
},
|
||||
getInpCode: function(e) {
|
||||
console.log(e)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['autograph']),
|
||||
src(){
|
||||
if (this.autograph.data && this.autograph.data.signSrcUrl){
|
||||
return this.autograph.data.signSrcUrl
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
import { mapGetters } from 'vuex';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
status: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// this.$store.dispatch('setAutograph')
|
||||
},
|
||||
methods: {
|
||||
goAgreement(url) {
|
||||
uni.navigateTo({
|
||||
url,
|
||||
});
|
||||
},
|
||||
checkClick() {
|
||||
this.status = !this.status;
|
||||
},
|
||||
next() {
|
||||
uni.navigateBack();
|
||||
// uni.switchTab({
|
||||
// url: '/pages/index/index'
|
||||
// })
|
||||
},
|
||||
go(url) {
|
||||
if (!this.status) {
|
||||
uni.showToast({
|
||||
title: '请先阅读并同意《申请证书协议》',
|
||||
icon: 'none',
|
||||
});
|
||||
return;
|
||||
}
|
||||
uni.navigateTo({
|
||||
url: `/pageMy/setUserBase/seal/sealCanvas?path=/pageMy/setUserBase/seal/sealCanvas`,
|
||||
});
|
||||
},
|
||||
getInpCode: function (e) {
|
||||
console.log(e);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['autograph']),
|
||||
src() {
|
||||
if (this.autograph.data && this.autograph.data.signSrcUrl) {
|
||||
return this.autograph.data.signSrcUrl;
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.sealAgreement{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 30rpx;
|
||||
font-size: 32rpx;
|
||||
.agreement{
|
||||
color: #007AFF;
|
||||
}
|
||||
/deep/ .uni-checkbox-input{
|
||||
border-radius: 22px!important;
|
||||
}
|
||||
}
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
.bottombtn {
|
||||
background-color: #1B66FF;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #fefefe;
|
||||
padding: 70rpx 80rpx;
|
||||
}
|
||||
.sealBox{
|
||||
background-color: #FFFFFF;
|
||||
padding: 0 15px 0 15px;
|
||||
.name{
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
line-height: 45rpx;
|
||||
.sealAgreement {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 30rpx;
|
||||
font-size: 32rpx;
|
||||
.agreement {
|
||||
color: #007aff;
|
||||
}
|
||||
::v-deep .uni-checkbox-input {
|
||||
border-radius: 22px !important;
|
||||
}
|
||||
}
|
||||
.nocheck {
|
||||
opacity: 0.3;
|
||||
}
|
||||
.bottombtn {
|
||||
background-color: #1b66ff;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 10rpx;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 32rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
}
|
||||
.listRight {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.listRight image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
.list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
height: 88rpx;
|
||||
}
|
||||
.sealContent{
|
||||
background: #F6F6F6;
|
||||
padding: 16rpx;
|
||||
margin-top: 14rpx;
|
||||
position:relative;
|
||||
.img{
|
||||
width: 100%;
|
||||
height: 312rpx;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
.contentFont{
|
||||
height: 312rpx;
|
||||
line-height: 312rpx;
|
||||
font-size: 30rpx;
|
||||
color: #999999;
|
||||
background: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #fefefe;
|
||||
padding: 70rpx 80rpx;
|
||||
}
|
||||
.sealBox {
|
||||
background-color: #ffffff;
|
||||
padding: 0 15px 0 15px;
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
line-height: 45rpx;
|
||||
}
|
||||
.listRight {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.listRight image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
.list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
height: 88rpx;
|
||||
}
|
||||
.sealContent {
|
||||
background: #f6f6f6;
|
||||
padding: 16rpx;
|
||||
margin-top: 14rpx;
|
||||
position: relative;
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 312rpx;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
.contentFont {
|
||||
height: 312rpx;
|
||||
line-height: 312rpx;
|
||||
font-size: 30rpx;
|
||||
color: #999999;
|
||||
background: #ffffff;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -54,7 +54,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 技能标签 end -->
|
||||
<view v-if="info.jobSources" class="prolist">来源：{{ info.jobSources || '暂无' }}</view>
|
||||
<view v-if="info.jobSources" style="color: red" class="prolist">来源：{{ info.jobSources || '暂无' }}</view>
|
||||
</view>
|
||||
<view class="head">
|
||||
<view style="display: flex; align-items: center">
|
||||
|
||||
@@ -59,7 +59,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 技能标签 end -->
|
||||
<view v-if="info.jobSources" class="prolist">来源：{{ info.jobSources || '暂无' }}</view>
|
||||
<view v-if="info.jobSources" style="color: red" class="prolist">来源：{{ info.jobSources || '暂无' }}</view>
|
||||
</view>
|
||||
<view class="head">
|
||||
<!-- <view class="proname proneed">
|
||||
|
||||
@@ -13,7 +13,9 @@
|
||||
行业类型：{{ info.tradeNames ? info.tradeNames : info.jobCompanyIndustry || '暂无' }}
|
||||
</view>
|
||||
<view class="prolist">岗位工种：{{ info.skillNames || '暂无' }}</view>
|
||||
<view class="prolist">参考工资：{{info.wage}}～{{info.wageUpper}}{{wageUnit[info.wageUnitCategory]}}</view>
|
||||
<view class="prolist">
|
||||
参考工资：{{ info.wage }}～{{ info.wageUpper }}{{ wageUnit[info.wageUnitCategory] }}
|
||||
</view>
|
||||
<!-- <view class="fee">
|
||||
{{info.wage}}{{wageUnit[info.wageUnitCategory]}}
|
||||
</view> -->
|
||||
@@ -49,7 +51,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 技能标签 end -->
|
||||
<view v-if="info.jobSources" class="prolist">来源：{{ info.jobSources || '暂无' }}</view>
|
||||
<view v-if="info.jobSources" style="color: red" class="prolist">来源：{{ info.jobSources || '暂无' }}</view>
|
||||
</view>
|
||||
<view class="head">
|
||||
<!-- <view class="proname proneed">
|
||||
@@ -189,7 +191,11 @@
|
||||
</view>
|
||||
<view style="text-align: center; font-size: 28rpx; margin-top: 30rpx">
|
||||
{{ info.callName || '联系人 ' }} :
|
||||
<span style="color: blue" v-if="info.callNumber" @click="tools.onDialingPhoneNumber(info.callNumber)">
|
||||
<span
|
||||
style="color: blue"
|
||||
v-if="info.callNumber"
|
||||
@click="tools.onDialingPhoneNumber(info.callNumber)"
|
||||
>
|
||||
{{ info.callNumber }}
|
||||
</span>
|
||||
<span style="color: #333333" v-else>无联系方式</span>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -38,7 +38,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 技能标签 end -->
|
||||
<view v-if="info.jobSources" class="prolist">来源：{{ info.jobSources }}</view>
|
||||
<view v-if="info.jobSources" style="color: red" class="prolist">来源：{{ info.jobSources }}</view>
|
||||
</view>
|
||||
<view class="head">
|
||||
<!-- <view class="proname proneed">
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user