|
|
@@ -44,7 +44,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 范围滑块 -->
|
|
|
- <view class="range-slider-container">
|
|
|
+ <!-- <view class="range-slider-container">
|
|
|
<view class="range-slider-track" @click="onTrackClick">
|
|
|
<view class="range-slider-progress" :style="progressStyle"></view>
|
|
|
<view
|
|
|
@@ -62,12 +62,12 @@
|
|
|
@touchend="onRightThumbEnd"
|
|
|
></view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<!-- 工作类型 -->
|
|
|
- <view class="form-item">
|
|
|
+ <!-- view class="form-item">
|
|
|
<text class="form-label">工作类型</text>
|
|
|
<view class="job-type-container">
|
|
|
<view
|
|
|
@@ -85,7 +85,7 @@
|
|
|
<text>兼职</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view> -->
|
|
|
|
|
|
<!-- 从事方向 -->
|
|
|
<view class="form-item">
|
|
|
@@ -96,18 +96,9 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="footer">
|
|
|
- <u-button
|
|
|
- type="primary"
|
|
|
- @click="saveWorkExperience"
|
|
|
- :customStyle="{
|
|
|
- height: '90rpx',
|
|
|
- fontSize: '32rpx',
|
|
|
- borderRadius: '45rpx',
|
|
|
- margin: '40rpx 0',
|
|
|
- }"
|
|
|
- >提交</u-button
|
|
|
- >
|
|
|
+
|
|
|
+ <view class="fixed-section">
|
|
|
+ <u-button type="primary" class="submit-btn" @click="saveWorkExperience">保存</u-button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
@@ -147,25 +138,25 @@ export default {
|
|
|
rightPercent() {
|
|
|
return ((this.maxValue - this.sliderMin) / (this.sliderMax - this.sliderMin)) * 100
|
|
|
},
|
|
|
- // 进度条样式
|
|
|
- progressStyle() {
|
|
|
- return {
|
|
|
- left: this.leftPercent + '%',
|
|
|
- width: (this.rightPercent - this.leftPercent) + '%'
|
|
|
- }
|
|
|
- },
|
|
|
- // 左侧滑块样式
|
|
|
- leftThumbStyle() {
|
|
|
- return {
|
|
|
- left: this.leftPercent + '%'
|
|
|
- }
|
|
|
- },
|
|
|
- // 右侧滑块样式
|
|
|
- rightThumbStyle() {
|
|
|
- return {
|
|
|
- left: this.rightPercent + '%'
|
|
|
- }
|
|
|
- }
|
|
|
+ // // 进度条样式
|
|
|
+ // progressStyle() {
|
|
|
+ // return {
|
|
|
+ // left: this.leftPercent + '%',
|
|
|
+ // width: (this.rightPercent - this.leftPercent) + '%'
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // // 左侧滑块样式
|
|
|
+ // leftThumbStyle() {
|
|
|
+ // return {
|
|
|
+ // left: this.leftPercent + '%'
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // // 右侧滑块样式
|
|
|
+ // rightThumbStyle() {
|
|
|
+ // return {
|
|
|
+ // left: this.rightPercent + '%'
|
|
|
+ // }
|
|
|
+ // }
|
|
|
},
|
|
|
methods: {
|
|
|
getData(){
|
|
|
@@ -211,106 +202,106 @@ export default {
|
|
|
url: '/package/jobIntention/preferenceSetting?jobId='+this.jobId+'&jobTitle='+this.jobTitle+'&selectedPreferences='+encodeURIComponent(JSON.stringify(this.industry==''||this.industry==null?[]:this.industry.split('/')))
|
|
|
})
|
|
|
},
|
|
|
- selectJobType(type) {
|
|
|
- this.jobType = type
|
|
|
- },
|
|
|
- // 获取滑块轨道宽度
|
|
|
- getTrackWidth() {
|
|
|
- uni.createSelectorQuery().in(this).select('.range-slider-track').boundingClientRect(data => {
|
|
|
- this.trackWidth = data.width
|
|
|
- }).exec()
|
|
|
- },
|
|
|
- // 将像素位置转换为数值
|
|
|
- pixelToValue(pixel) {
|
|
|
- const percent = (pixel / this.trackWidth) * 100
|
|
|
- const value = this.sliderMin + (percent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
- return Math.round(value / this.step) * this.step
|
|
|
- },
|
|
|
- // 左侧滑块开始拖拽
|
|
|
- onLeftThumbStart(e) {
|
|
|
- this.draggingThumb = 'left'
|
|
|
- this.startX = e.touches[0].clientX
|
|
|
- this.startValue = this.minValue
|
|
|
- e.preventDefault()
|
|
|
- },
|
|
|
- // 左侧滑块拖拽中
|
|
|
- onLeftThumbMove(e) {
|
|
|
- if (this.draggingThumb !== 'left') return
|
|
|
+ // selectJobType(type) {
|
|
|
+ // this.jobType = type
|
|
|
+ // },
|
|
|
+ // // 获取滑块轨道宽度
|
|
|
+ // getTrackWidth() {
|
|
|
+ // uni.createSelectorQuery().in(this).select('.range-slider-track').boundingClientRect(data => {
|
|
|
+ // this.trackWidth = data.width
|
|
|
+ // }).exec()
|
|
|
+ // },
|
|
|
+ // // 将像素位置转换为数值
|
|
|
+ // pixelToValue(pixel) {
|
|
|
+ // const percent = (pixel / this.trackWidth) * 100
|
|
|
+ // const value = this.sliderMin + (percent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
+ // return Math.round(value / this.step) * this.step
|
|
|
+ // },
|
|
|
+ // // 左侧滑块开始拖拽
|
|
|
+ // onLeftThumbStart(e) {
|
|
|
+ // this.draggingThumb = 'left'
|
|
|
+ // this.startX = e.touches[0].clientX
|
|
|
+ // this.startValue = this.minValue
|
|
|
+ // e.preventDefault()
|
|
|
+ // },
|
|
|
+ // // 左侧滑块拖拽中
|
|
|
+ // onLeftThumbMove(e) {
|
|
|
+ // if (this.draggingThumb !== 'left') return
|
|
|
|
|
|
- const deltaX = e.touches[0].clientX - this.startX
|
|
|
- const deltaPercent = (deltaX / this.trackWidth) * 100
|
|
|
- const deltaValue = (deltaPercent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
- let newValue = this.startValue + deltaValue
|
|
|
+ // const deltaX = e.touches[0].clientX - this.startX
|
|
|
+ // const deltaPercent = (deltaX / this.trackWidth) * 100
|
|
|
+ // const deltaValue = (deltaPercent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
+ // let newValue = this.startValue + deltaValue
|
|
|
|
|
|
- // 限制范围
|
|
|
- newValue = Math.max(this.sliderMin, Math.min(newValue, this.maxValue - this.step))
|
|
|
- newValue = Math.round(newValue / this.step) * this.step
|
|
|
+ // // 限制范围
|
|
|
+ // newValue = Math.max(this.sliderMin, Math.min(newValue, this.maxValue - this.step))
|
|
|
+ // newValue = Math.round(newValue / this.step) * this.step
|
|
|
|
|
|
- this.minValue = newValue
|
|
|
- this.minSalary = newValue.toString()
|
|
|
- e.preventDefault()
|
|
|
- },
|
|
|
- // 左侧滑块结束拖拽
|
|
|
- onLeftThumbEnd(e) {
|
|
|
- this.draggingThumb = null
|
|
|
- e.preventDefault()
|
|
|
- },
|
|
|
- // 右侧滑块开始拖拽
|
|
|
- onRightThumbStart(e) {
|
|
|
- this.draggingThumb = 'right'
|
|
|
- this.startX = e.touches[0].clientX
|
|
|
- this.startValue = this.maxValue
|
|
|
- e.preventDefault()
|
|
|
- },
|
|
|
- // 右侧滑块拖拽中
|
|
|
- onRightThumbMove(e) {
|
|
|
- if (this.draggingThumb !== 'right') return
|
|
|
+ // this.minValue = newValue
|
|
|
+ // this.minSalary = newValue.toString()
|
|
|
+ // e.preventDefault()
|
|
|
+ // },
|
|
|
+ // // 左侧滑块结束拖拽
|
|
|
+ // onLeftThumbEnd(e) {
|
|
|
+ // this.draggingThumb = null
|
|
|
+ // e.preventDefault()
|
|
|
+ // },
|
|
|
+ // // 右侧滑块开始拖拽
|
|
|
+ // onRightThumbStart(e) {
|
|
|
+ // this.draggingThumb = 'right'
|
|
|
+ // this.startX = e.touches[0].clientX
|
|
|
+ // this.startValue = this.maxValue
|
|
|
+ // e.preventDefault()
|
|
|
+ // },
|
|
|
+ // // 右侧滑块拖拽中
|
|
|
+ // onRightThumbMove(e) {
|
|
|
+ // if (this.draggingThumb !== 'right') return
|
|
|
|
|
|
- const deltaX = e.touches[0].clientX - this.startX
|
|
|
- const deltaPercent = (deltaX / this.trackWidth) * 100
|
|
|
- const deltaValue = (deltaPercent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
- let newValue = this.startValue + deltaValue
|
|
|
+ // const deltaX = e.touches[0].clientX - this.startX
|
|
|
+ // const deltaPercent = (deltaX / this.trackWidth) * 100
|
|
|
+ // const deltaValue = (deltaPercent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
+ // let newValue = this.startValue + deltaValue
|
|
|
|
|
|
- // 限制范围
|
|
|
- newValue = Math.max(this.minValue + this.step, Math.min(newValue, this.sliderMax))
|
|
|
- newValue = Math.round(newValue / this.step) * this.step
|
|
|
+ // // 限制范围
|
|
|
+ // newValue = Math.max(this.minValue + this.step, Math.min(newValue, this.sliderMax))
|
|
|
+ // newValue = Math.round(newValue / this.step) * this.step
|
|
|
|
|
|
- this.maxValue = newValue
|
|
|
- this.maxSalary = newValue.toString()
|
|
|
- e.preventDefault()
|
|
|
- },
|
|
|
- // 右侧滑块结束拖拽
|
|
|
- onRightThumbEnd(e) {
|
|
|
- this.draggingThumb = null
|
|
|
- e.preventDefault()
|
|
|
- },
|
|
|
- // 点击轨道
|
|
|
- onTrackClick(e) {
|
|
|
- if (this.draggingThumb) return
|
|
|
+ // this.maxValue = newValue
|
|
|
+ // this.maxSalary = newValue.toString()
|
|
|
+ // e.preventDefault()
|
|
|
+ // },
|
|
|
+ // // 右侧滑块结束拖拽
|
|
|
+ // onRightThumbEnd(e) {
|
|
|
+ // this.draggingThumb = null
|
|
|
+ // e.preventDefault()
|
|
|
+ // },
|
|
|
+ // // 点击轨道
|
|
|
+ // onTrackClick(e) {
|
|
|
+ // if (this.draggingThumb) return
|
|
|
|
|
|
- const rect = e.currentTarget.getBoundingClientRect()
|
|
|
- const clickX = e.detail.x - rect.left
|
|
|
- const clickPercent = (clickX / rect.width) * 100
|
|
|
- const clickValue = this.sliderMin + (clickPercent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
+ // const rect = e.currentTarget.getBoundingClientRect()
|
|
|
+ // const clickX = e.detail.x - rect.left
|
|
|
+ // const clickPercent = (clickX / rect.width) * 100
|
|
|
+ // const clickValue = this.sliderMin + (clickPercent / 100) * (this.sliderMax - this.sliderMin)
|
|
|
|
|
|
- // 判断点击位置更靠近哪个滑块
|
|
|
- const distanceToLeft = Math.abs(clickValue - this.minValue)
|
|
|
- const distanceToRight = Math.abs(clickValue - this.maxValue)
|
|
|
+ // // 判断点击位置更靠近哪个滑块
|
|
|
+ // const distanceToLeft = Math.abs(clickValue - this.minValue)
|
|
|
+ // const distanceToRight = Math.abs(clickValue - this.maxValue)
|
|
|
|
|
|
- if (distanceToLeft < distanceToRight) {
|
|
|
- // 更靠近左侧滑块
|
|
|
- let newValue = Math.round(clickValue / this.step) * this.step
|
|
|
- newValue = Math.max(this.sliderMin, Math.min(newValue, this.maxValue - this.step))
|
|
|
- this.minValue = newValue
|
|
|
- this.minSalary = newValue.toString()
|
|
|
- } else {
|
|
|
- // 更靠近右侧滑块
|
|
|
- let newValue = Math.round(clickValue / this.step) * this.step
|
|
|
- newValue = Math.max(this.minValue + this.step, Math.min(newValue, this.sliderMax))
|
|
|
- this.maxValue = newValue
|
|
|
- this.maxSalary = newValue.toString()
|
|
|
- }
|
|
|
- },
|
|
|
+ // if (distanceToLeft < distanceToRight) {
|
|
|
+ // // 更靠近左侧滑块
|
|
|
+ // let newValue = Math.round(clickValue / this.step) * this.step
|
|
|
+ // newValue = Math.max(this.sliderMin, Math.min(newValue, this.maxValue - this.step))
|
|
|
+ // this.minValue = newValue
|
|
|
+ // this.minSalary = newValue.toString()
|
|
|
+ // } else {
|
|
|
+ // // 更靠近右侧滑块
|
|
|
+ // let newValue = Math.round(clickValue / this.step) * this.step
|
|
|
+ // newValue = Math.max(this.minValue + this.step, Math.min(newValue, this.sliderMax))
|
|
|
+ // this.maxValue = newValue
|
|
|
+ // this.maxSalary = newValue.toString()
|
|
|
+ // }
|
|
|
+ // },
|
|
|
saveWorkExperience() {
|
|
|
if (!this.jobId) {
|
|
|
uni.showToast({ title: "请选择工作职位", icon: "none" });
|
|
|
@@ -320,6 +311,13 @@ export default {
|
|
|
uni.showToast({ title: "请选择城市", icon: "none" });
|
|
|
return;
|
|
|
}
|
|
|
+ // 限制最低工资不能高于最高工资
|
|
|
+ const minSalary = Number(this.minSalary) || 0
|
|
|
+ const maxSalary = Number(this.maxSalary) || 0
|
|
|
+ if (minSalary > maxSalary) {
|
|
|
+ uni.showToast({ title: "最低薪酬不能大于最高薪酬", icon: "none" });
|
|
|
+ return;
|
|
|
+ }
|
|
|
if (!this.industry) {
|
|
|
uni.showToast({ title: "请选择跨境标签", icon: "none" });
|
|
|
return;
|
|
|
@@ -365,10 +363,10 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
mounted() {
|
|
|
- // 初始化滑块轨道宽度
|
|
|
- this.$nextTick(() => {
|
|
|
- this.getTrackWidth()
|
|
|
- })
|
|
|
+ // // 初始化滑块轨道宽度
|
|
|
+ // this.$nextTick(() => {
|
|
|
+ // this.getTrackWidth()
|
|
|
+ // })
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
// 获取状态栏高度
|
|
|
@@ -405,9 +403,10 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+@import '../../common.scss';
|
|
|
+
|
|
|
.add-expectation {
|
|
|
min-height: 100vh;
|
|
|
- padding: 0 40rpx 40rpx 40rpx;
|
|
|
}
|
|
|
|
|
|
.nav-bar {
|
|
|
@@ -415,6 +414,7 @@ export default {
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
margin-bottom: 30rpx;
|
|
|
+ padding: 0 40rpx;
|
|
|
|
|
|
.nav-left {
|
|
|
display: flex;
|
|
|
@@ -436,6 +436,7 @@ export default {
|
|
|
background: #ffffff;
|
|
|
border-radius: 20rpx;
|
|
|
margin-top: 30rpx;
|
|
|
+ padding: 0 40rpx;
|
|
|
}
|
|
|
|
|
|
.form-item {
|
|
|
@@ -483,13 +484,12 @@ export default {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
margin: 20rpx 0 30rpx 0;
|
|
|
- gap: 50rpx;
|
|
|
|
|
|
.salary-input {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
flex: 1;
|
|
|
- padding: 20rpx;
|
|
|
+ padding: 30rpx 20rpx;
|
|
|
border-radius: 12rpx;
|
|
|
box-shadow: 0px 8px 150px 0px rgba(0, 0, 0, 0.06);
|
|
|
background: rgba(255, 255, 255, 1);
|
|
|
@@ -504,6 +504,9 @@ export default {
|
|
|
font-size: 28rpx;
|
|
|
}
|
|
|
}
|
|
|
+ .salary-input:first-child {
|
|
|
+ margin-right: 50rpx;
|
|
|
+ }
|
|
|
|
|
|
.salary-separator {
|
|
|
margin: 0 20rpx;
|
|
|
@@ -512,72 +515,85 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .range-slider-container {
|
|
|
- padding: 20rpx 10rpx;
|
|
|
- }
|
|
|
+ // .range-slider-container {
|
|
|
+ // padding: 20rpx 10rpx;
|
|
|
+ // }
|
|
|
|
|
|
- .range-slider-track {
|
|
|
- position: relative;
|
|
|
- height: 6rpx;
|
|
|
- background-color: #E5E5EA;
|
|
|
- border-radius: 3rpx;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
+ // .range-slider-track {
|
|
|
+ // position: relative;
|
|
|
+ // height: 6rpx;
|
|
|
+ // background-color: #E5E5EA;
|
|
|
+ // border-radius: 3rpx;
|
|
|
+ // cursor: pointer;
|
|
|
+ // }
|
|
|
|
|
|
- .range-slider-progress {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- height: 100%;
|
|
|
- background-color: #007AFF;
|
|
|
- border-radius: 3rpx;
|
|
|
- transition: all 0.1s ease;
|
|
|
- }
|
|
|
+ // .range-slider-progress {
|
|
|
+ // position: absolute;
|
|
|
+ // top: 0;
|
|
|
+ // height: 100%;
|
|
|
+ // background-color: #007AFF;
|
|
|
+ // border-radius: 3rpx;
|
|
|
+ // transition: all 0.1s ease;
|
|
|
+ // }
|
|
|
|
|
|
- .range-slider-thumb {
|
|
|
- position: absolute;
|
|
|
- top: 50%;
|
|
|
- width: 40rpx;
|
|
|
- height: 40rpx;
|
|
|
- background-color: #007AFF;
|
|
|
- border-radius: 50%;
|
|
|
- border: 4rpx solid #ffffff;
|
|
|
- box-shadow: 0 2rpx 8rpx rgba(0, 122, 255, 0.3);
|
|
|
- transform: translate(-50%, -50%);
|
|
|
- cursor: pointer;
|
|
|
- transition: all 0.1s ease;
|
|
|
- }
|
|
|
+ // .range-slider-thumb {
|
|
|
+ // position: absolute;
|
|
|
+ // top: 50%;
|
|
|
+ // width: 40rpx;
|
|
|
+ // height: 40rpx;
|
|
|
+ // background-color: #007AFF;
|
|
|
+ // border-radius: 50%;
|
|
|
+ // border: 4rpx solid #ffffff;
|
|
|
+ // box-shadow: 0 2rpx 8rpx rgba(0, 122, 255, 0.3);
|
|
|
+ // transform: translate(-50%, -50%);
|
|
|
+ // cursor: pointer;
|
|
|
+ // transition: all 0.1s ease;
|
|
|
+ // }
|
|
|
|
|
|
- .range-slider-thumb:active {
|
|
|
- transform: translate(-50%, -50%) scale(1.1);
|
|
|
- box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.4);
|
|
|
- }
|
|
|
+ // .range-slider-thumb:active {
|
|
|
+ // transform: translate(-50%, -50%) scale(1.1);
|
|
|
+ // box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.4);
|
|
|
+ // }
|
|
|
}
|
|
|
|
|
|
-.job-type-container {
|
|
|
- display: flex;
|
|
|
- gap: 50rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
+// .job-type-container {
|
|
|
+// display: flex;
|
|
|
+// gap: 50rpx;
|
|
|
+// margin-top: 20rpx;
|
|
|
|
|
|
- .job-type-btn {
|
|
|
- flex: 1;
|
|
|
- padding: 24rpx 20rpx;
|
|
|
- border: 1rpx solid #E5E5EA;
|
|
|
- border-radius: 42rpx;
|
|
|
- text-align: center;
|
|
|
+// .job-type-btn {
|
|
|
+// flex: 1;
|
|
|
+// padding: 24rpx 20rpx;
|
|
|
+// border: 1rpx solid #E5E5EA;
|
|
|
+// border-radius: 42rpx;
|
|
|
+// text-align: center;
|
|
|
|
|
|
- text {
|
|
|
- color: rgba(97, 110, 124, 1);
|
|
|
- font-size: 28rpx;
|
|
|
- }
|
|
|
+// text {
|
|
|
+// color: rgba(97, 110, 124, 1);
|
|
|
+// font-size: 28rpx;
|
|
|
+// }
|
|
|
|
|
|
- &.active {
|
|
|
- background: #016BF6;
|
|
|
+// &.active {
|
|
|
+// background: #016BF6;
|
|
|
|
|
|
- text {
|
|
|
- color: #FFFFFF;
|
|
|
- font-weight: 400;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+// text {
|
|
|
+// color: #FFFFFF;
|
|
|
+// font-weight: 400;
|
|
|
+// }
|
|
|
+// }
|
|
|
+// }
|
|
|
+// }
|
|
|
+
|
|
|
+// .footer {
|
|
|
+// position: fixed;
|
|
|
+// left: 0;
|
|
|
+// right: 0;
|
|
|
+// bottom: 0;
|
|
|
+// padding: 0 40rpx;
|
|
|
+// box-shadow: 0px -4px 16px 0px rgba(0, 0, 0, 0.04);
|
|
|
+// background-color: #fff;
|
|
|
+// .submit-btn {
|
|
|
+// background: linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1));
|
|
|
+// }
|
|
|
+// }
|
|
|
</style>
|