sdz/ks-app-employment-service
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

flat: 暂存

Browse Source
This commit is contained in:
史典卓
2025-05-13 11:10:38 +08:00
parent 582e432e6a
commit fd74b7d4df
109 changed files with 8644 additions and 5205 deletions
Download Patch File Download Diff File Expand all files Collapse all files

650
pages/login/login.vue
View File

@@ -1,239 +1,240 @@
<template>
<view class="container">
<view :style="{ height: statusBarHeight + 'px' }"></view>
<AppLayout title="AI+就业服务程序">
<tabcontrolVue :current="tabCurrent">
<!-- tab0 -->
<template v-slot:tab0>
<view class="login-content">
<image class="logo" src="../../static/logo.png"></image>
<view class="logo-title">就业</view>
</view>
<view class="btns">
<button class="wxlogin" @click="loginTest">登录</button>
<!-- <button open-type="getUserInfo" @getuserinfo="getuserinfo" class="wxlogin">登录</button> -->
<button class="wxlogin" @click="loginTest">内测登录</button>
<view class="wxaddress">青岛市公共就业和人才服务中心</view>
</view>
</template>
<!-- tab1 -->
<template v-slot:tab1>
<view class="tabtwo">
<view class="tabtwo-top">
<view class="color_FFFFFF fs_30">选择您的性别1/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="fl_box fl_justmiddle fl_1 fl_alstart">
<view class="tabtwo-sex" @click="changeSex(1)">
<image class="sex-img" src="../../static/icon/woman.png"></image>
<view class="mar_top5">女</view>
<view v-if="fromValue.sex === 1" class="dot doted"></view>
<view v-else class="dot"></view>
<view class="content-one">
<view>
<view class="content-title">
<view class="title-lf">
<view class="lf-h1">请您完善求职名片</view>
<view class="lf-text">个人信息仅用于推送优质内容</view>
</view>
<view class="title-ri">
<text style="color: #256bfa">1</text>
<text>/2</text>
</view>
</view>
<view class="tabtwo-sex" @click="changeSex(0)">
<image class="sex-img" src="../../static/icon/man.png"></image>
<view class="mar_top5">男</view>
<view v-if="fromValue.sex === 0" class="dot doted"></view>
<view v-else class="dot"></view>
<view class="content-input" @click="changeExperience">
<view class="input-titile">工作经验</view>
<input
class="input-con"
v-model="state.experienceText"
disabled
placeholder="请选择您的工作经验"
/>
</view>
<view class="content-sex">
<view class="sex-titile">求职区域</view>
<view class="sext-ri">
<view
class="sext-box"
:class="{ 'sext-boxactive': fromValue.sex === 0 }"
@click="changeSex(0)"
>
男
</view>
<view
class="sext-box"
:class="{ 'sext-boxactive': fromValue.sex === 1 }"
@click="changeSex(1)"
>
女
</view>
</view>
</view>
<view class="content-input" @click="changeEducation">
<view class="input-titile">学历</view>
<input class="input-con" v-model="state.educationText" disabled placeholder="本科" />
</view>
</view>
<view class="nextstep" @tap="nextStep">下一步</view>
<view class="next-btn" @tap="nextStep">下一步</view>
</view>
</template>
<!-- tab2 -->
<template v-slot:tab2>
<view class="tabtwo">
<view class="tabtwo-top">
<view class="color_FFFFFF fs_30">选择您的年龄断段2/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="fl_box fl_deri fl_almiddle">
<!-- <view class="agebtn agebtned">30岁以下</view> -->
<view
class="agebtn"
:class="{ agebtned: item.value === fromValue.age }"
v-for="item in state.ageList"
:key="item.value"
@click="changeAge(item.value)"
>
{{ item.label }}
<view class="content-one">
<view>
<view class="content-title">
<view class="title-lf">
<view class="lf-h1">请您完善求职名片</view>
<view class="lf-text">个人信息仅用于推送优质内容</view>
</view>
<view class="title-ri">
<text style="color: #256bfa">2</text>
<text>/2</text>
</view>
</view>
<view class="content-input" @click="changeArea">
<view class="input-titile">求职区域</view>
<input
class="input-con"
v-model="state.areaText"
disabled
placeholder="请选择您的求职区域"
/>
</view>
<view class="content-input" @click="changeJobs">
<view class="input-titile">求职岗位</view>
<input
class="input-con"
disabled
v-if="!state.jobsText.length"
placeholder="请选择您的求职岗位"
/>
<view class="input-nx" @click="changeJobs" v-else>
<view class="nx-item" v-for="item in state.jobsText">{{ item }}</view>
</view>
</view>
<view class="content-input" @click="changeSalay">
<view class="input-titile">期望薪资</view>
<input
class="input-con"
v-model="state.salayText"
disabled
placeholder="请选择您的期望薪资"
/>
</view>
</view>
<view class="fl_box fl_justmiddle"></view>
<view class="nextstep" @tap="nextStep">下一步</view>
</view>
</template>
<!-- tab3 -->
<template v-slot:tab3>
<view class="tabtwo">
<view class="tabtwo-top">
<view class="color_FFFFFF fs_30">选择您的学历3/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="eduction-content">
<view
class="eductionbtn"
:class="{ eductionbtned: item.value === fromValue.education }"
v-for="item in oneDictData('education')"
@click="changeEducation(item.value)"
:key="item.value"
>
{{ item.label }}
</view>
</view>
<view class="nextstep" @tap="nextStep">下一步</view>
</view>
</template>
<!-- tab4 -->
<template v-slot:tab4>
<view class="tabtwo">
<view class="tabtwo-top">
<view class="color_FFFFFF fs_30">您期望的薪资范围4/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="salary">
<picker-view
indicator-style="height: 140rpx;"
:value="state.salayData"
@change="bindChange"
class="picker-view"
>
<picker-view-column>
<view class="item" v-for="(item, index) in state.lfsalay" :key="index">
<view class="item-child" :class="{ 'item-childed': state.salayData[0] === index }">
{{ item }}k
</view>
</view>
</picker-view-column>
<view class="item-center">至</view>
<picker-view-column>
<view class="item" v-for="(item, index) in state.risalay" :key="index">
<view class="item-child" :class="{ 'item-childed': state.salayData[2] === index }">
{{ item }}k
</view>
</view>
</picker-view-column>
</picker-view>
</view>
<view class="fl_box fl_justmiddle"></view>
<view class="nextstep" @tap="nextStep">下一步</view>
</view>
</template>
<!-- tab5 -->
<template v-slot:tab5>
<view class="tabtwo">
<view class="tabtwo-top">
<view class="color_FFFFFF fs_30">您期望的求职区域5/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="eduction-content">
<!-- <view class="eductionbtn eductionbtned">市南区</view> -->
<view
class="eductionbtn"
:class="{ eductionbtned: item.value === fromValue.area }"
v-for="item in oneDictData('area')"
:key="item.value"
@click="changeArea(item.value)"
>
{{ item.label }}
</view>
<!-- <view class="eductionbtn">不限区域</view> -->
</view>
<view class="nextstep" @tap="nextStep">下一步</view>
</view>
</template>
<!-- tab6 -->
<template v-slot:tab6>
<view class="tabtwo sex-two">
<view class="tabtwo-top mar_top25 mar_le25">
<view class="color_FFFFFF fs_30">您的期望岗位6/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="sex-content fl_1">
<expected-station @onChange="changeJobTitleId" :station="state.station"></expected-station>
</view>
<button class="nextstep confirmStep" @click="complete">完成</button>
<!-- <navigator url="/pages/index/index" open-type="reLaunch" hover-class="other-navigator-hover">
<button class="nextstep confirmStep" @click="complete">完成</button>
</navigator> -->
<view class="next-btn" @tap="complete">开启求职之旅</view>
</view>
</template>
</tabcontrolVue>
</view>
<SelectJobs ref="selectJobsModel"></SelectJobs>
</AppLayout>
</template>
<script setup>
import tabcontrolVue from './components/tabcontrol.vue';
import { reactive, inject, watch, ref } from 'vue';
import SelectJobs from '@/components/selectJobs/selectJobs.vue';
import { reactive, inject, watch, ref, onMounted } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import useUserStore from '@/stores/useUserStore';
import useDictStore from '@/stores/useDictStore';
const { statusBarHeight } = inject('deviceInfo');
const { $api, navTo } = inject('globalFunction');
const { loginSetToken, getUserResume } = useUserStore();
const { getDictSelectOption, oneDictData } = useDictStore();
const openSelectPopup = inject('openSelectPopup');
// status
const selectJobsModel = ref();
const tabCurrent = ref(0);
const salay = [2, 5, 10, 15, 20, 25, 30, 50, 80, 100];
const state = reactive({
station: [],
stationCateLog: 1,
ageList: [],
lfsalay: [2, 5, 10, 15, 20, 25, 30, 50],
risalay: JSON.parse(JSON.stringify(salay)),
salayData: [0, 0, 0],
areaText: '',
educationText: '',
experienceText: '',
salayText: '',
jobsText: [],
});
const fromValue = reactive({
sex: 1,
age: '0',
education: '4',
salaryMin: 2000,
salaryMax: 2000,
area: 0,
jobTitleId: '',
experience: '1',
});
onLoad((parmas) => {
getDictSelectOption('age').then((data) => {
state.ageList = data;
});
getTreeselect();
});
// 选择薪资
function bindChange(val) {
state.salayData = val.detail.value;
const copyri = JSON.parse(JSON.stringify(salay));
const [lf, _, ri] = val.detail.value;
state.risalay = copyri.slice(lf, copyri.length);
fromValue.salaryMin = copyri[lf] * 1000;
fromValue.salaryMax = state.risalay[ri] * 1000;
}
onMounted(() => {});
function changeSex(sex) {
fromValue.sex = sex;
}
function changeAge(age) {
fromValue.age = age;
function changeExperience() {
openSelectPopup({
title: '工作经验',
maskClick: true,
data: [oneDictData('experience')],
success: (_, [value]) => {
fromValue.experience = value.value;
state.experienceText = value.label;
},
change(_, [value]) {
// this.setColunm(1, [123, 123]);
console.log(this);
},
});
}
function changeEducation(education) {
fromValue.education = education;
function changeEducation() {
openSelectPopup({
title: '学历',
maskClick: true,
data: [oneDictData('education')],
success: (_, [value]) => {
fromValue.area = value.value;
state.educationText = value.label;
},
});
}
function changeArea(area) {
fromValue.area = area;
function changeArea() {
openSelectPopup({
title: '区域',
maskClick: true,
data: [oneDictData('area')],
success: (_, [value]) => {
fromValue.area = value.value;
state.areaText = '青岛市-' + value.label;
},
});
}
function changeJobTitleId(jobTitleId) {
fromValue.jobTitleId = jobTitleId;
function changeSalay() {
let leftIndex = 0;
openSelectPopup({
title: '薪资',
maskClick: true,
data: [state.lfsalay, state.risalay],
unit: 'k',
success: (_, [min, max]) => {
fromValue.salaryMin = min.value * 1000;
fromValue.salaryMax = max.value * 1000;
state.salayText = `${fromValue.salaryMin}-${fromValue.salaryMax}`;
},
change(e) {
const salayData = e.detail.value;
if (leftIndex !== salayData[0]) {
const copyri = JSON.parse(JSON.stringify(salay));
const [lf, ri] = e.detail.value;
const risalay = copyri.slice(lf, copyri.length);
this.setColunm(1, risalay);
leftIndex = salayData[0];
}
},
});
}
// 行为
// function changeStationLog(item) {
// state.stationCateLog = item.value;
// }
function changeJobs() {
selectJobsModel.value?.open({
title: '添加岗位',
success: (ids, labels) => {
fromValue.jobTitleId = ids;
state.jobsText = labels.split(',');
},
});
}
function nextStep() {
tabCurrent.value += 1;
}
// function handleScroll(event) {
// console.log('滚动条滚动', event.detail.scrollTop);
// console.log(Math.round(event.detail.scrollTop / 75));
// // this.activeIndex = Math.round(event.detail.scrollTop / 75);
// }
// 获取职位
function getTreeselect() {
@@ -276,12 +277,55 @@ function complete() {
</script>
<style lang="stylus" scoped>
.input-nx
position: relative
border-bottom: 2rpx solid #EBEBEB
padding-bottom: 30rpx
display: flex
flex-wrap: wrap
.nx-item
padding: 20rpx 28rpx
width: fit-content
border-radius: 12rpx 12rpx 12rpx 12rpx;
border: 2rpx solid #E8EAEE;
margin-right: 24rpx
margin-top: 24rpx
.nx-item::before
position: absolute;
right: 20rpx;
top: 60rpx;
content: '';
width: 4rpx;
height: 18rpx;
border-radius: 2rpx
background: #697279;
transform: translate(0, -50%) rotate(-45deg) ;
.nx-item::after
position: absolute;
right: 20rpx;
top: 61rpx;
content: '';
width: 4rpx;
height: 18rpx;
border-radius: 2rpx
background: #697279;
transform: rotate(45deg)
.container
background: linear-gradient(#4778EC, #002979);
// background: linear-gradient(#4778EC, #002979);
width: 100%;
height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
position: fixed;
background: url('@/static/icon/background2.png') 0 0 no-repeat;
background-size: 100% 728rpx;
display: flex;
flex-direction: column
.container-hader
height: 88rpx;
text-align: center;
line-height: 88rpx;
color: #000000;
font-weight: bold
font-size: 32rpx
.login-content
position: absolute;
@@ -296,7 +340,7 @@ function complete() {
height: 182rpx;
.logo-title
font-size: 88rpx;
color: #FFFFFF;
color: #22c984;
width: 180rpx;
.btns
position: absolute;
@@ -316,179 +360,97 @@ function complete() {
color: #BBBBBB;
margin-top: 70rpx;
text-align: center;
// 2
.tabtwo
padding: 40rpx;
.content-one
padding: 60rpx 28rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
height: calc(100% - 40rpx);
.tabtwo-top
margin: 222rpx 0 0 0;
width: 100%;
.tabtwo-sex
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: #FFFFFF;
font-size: 40rpx;
margin: 200rpx 60rpx 0 60rpx;
.sex-img
width: 184rpx;
height: 184rpx;
.dot
width: 68rpx;
height: 68rpx;
border-radius: 50%;
background: #d1d1d6;
position: relative;
.dot:before
content: '';
width: 44rpx;
height: 44rpx;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-radius: 50%;
background: #1e4baa;
.doted
background: #13C57C;
.doted:after{
content: '';
width: 34rpx;
height: 34rpx;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-radius: 50%
background: #13C57C;
}
.agebtn
width: 630rpx;
height: 108rpx;
border-radius: 20rpx;
background: #d9d9d9;
text-align: center;
line-height: 108rpx;
font-size: 40rpx;
margin-top: 50rpx;
color: #606060;
.agebtned
background: #13C57C;
color: #FFFFFF;
.nextstep
width: 630rpx;
height: 98rpx;
border-radius: 20rpx;
background: #13C57C;
text-align: center;
line-height: 98rpx;
font-size: 36rpx;
color: #FFFFFF;
margin-bottom: 150rpx;
.confirmStep
margin-bottom: 50rpx;
.eduction-content
width: fit-content;
display: grid;
grid-template-columns: 300rpx 300rpx;
grid-gap: 20rpx;
margin-top: 50rpx;
.eductionbtn
width: 300rpx;
height: 108rpx;
border-radius: 20rpx;
background: #d9d9d9;
text-align: center;
line-height: 108rpx;
font-size: 36rpx;
color: #606060;
.eductionbtned
background: #13C57C;
color: #FFFFFF;
.salary
width: fit-content;
display: grid;
grid-template-columns: 640rpx;
grid-gap: 20rpx;
margin-top: 50rpx;
.picker-view {
justify-content: space-between
height: calc(100% - 120rpx)
.content-title
display: flex
justify-content: space-between;
align-items: center
margin-bottom: 70rpx
.title-lf
font-size: 44rpx;
color: #000000;
font-weight: 600;
.lf-text
font-weight: 400;
font-size: 28rpx;
color: #6C7282;
.title-ri
font-size: 36rpx;
color: #000000;
font-weight: 600;
.content-input
margin-bottom: 52rpx
.input-titile
font-weight: 400;
font-size: 28rpx;
color: #6A6A6A;
.input-con
font-weight: 400;
font-size: 32rpx;
color: #333333;
line-height: 80rpx;
height: 80rpx;
border-bottom: 2rpx solid #EBEBEB
position: relative;
.input-con::before
position: absolute;
right: 20rpx;
top: calc(50% - 2rpx);
content: '';
width: 4rpx;
height: 18rpx;
border-radius: 2rpx
background: #697279;
transform: translate(0, -50%) rotate(-45deg) ;
.input-con::after
position: absolute;
right: 20rpx;
top: 50%;
content: '';
width: 4rpx;
height: 18rpx;
border-radius: 2rpx
background: #697279;
transform: rotate(45deg)
.content-sex
height: 110rpx;
display: flex
justify-content: space-between;
align-items: flex-start;
border-bottom: 2rpx solid #EBEBEB
margin-bottom: 52rpx
.sex-titile
line-height: 80rpx;
.sext-ri
display: flex
align-items: center;
.sext-box
height: 76rpx;
width: 152rpx;
text-align: center;
line-height: 80rpx;
border-radius: 12rpx 12rpx 12rpx 12rpx
border: 2rpx solid #E8EAEE;
margin-left: 28rpx
font-weight: 400;
font-size: 28rpx;
.sext-boxactive
color: #256BFA
background: rgba(37,107,250,0.1);
border: 2rpx solid #256BFA;
.next-btn
width: 100%;
height: 600rpx;
margin-top: 20rpx;
.uni-picker-view-mask{
background: rgba(0,0,0,0);
}
}
.item {
.item-child{
line-height: 90rpx;
font-size: 38rpx;
color: #606060;
text-align: center;
background: #D9D9D9;
border-radius: 20rpx;
margin: 20rpx 10rpx 20rpx 10rpx;
}
.item-childed{
line-height: 105rpx;
margin: 10rpx 5rpx 10rpx 5rpx;
background: #13C57C;
color: #FFFFFF;
}
}
.item-center{
width: 40rpx;
line-height: 600rpx;
width: 51rpx;
height: 47rpx;
font-family: Inter, Inter;
font-weight: 400;
font-size: 28rpx;
height: 90rpx;
background: #256BFA;
border-radius: 12rpx 12rpx 12rpx 12rpx;
font-weight: 500;
font-size: 32rpx;
color: #FFFFFF;
text-align: center;
font-style: normal;
text-transform: none;
}
.uni-picker-view-indicator:after{
border: 0
}
.uni-picker-view-indicator:before{
border: 0
}
.center-text
color: #FFFFFF;
text-align: center;
line-height: 400rpx;
.salary-content
width: 300rpx;
height: 380rpx;
.salary-content-item
height: 104rpx;
line-height: 104rpx;
margin: 20rpx 10rpx 20rpx 10rpx;
border-radius: 20rpx;
background: #d9d9d9;
text-align: center;
font-size: 38rpx;
.salary-content-item-selected
margin: 10rpx 5rpx 10rpx 5rpx;
background: #13C57C;
color: #FFFFFF;
.sex-two
padding-left: 0;
padding-right: 0;
background: #4678ec;
.sex-content
border-radius: 20rpx;
width: 100%;
margin-top: 20rpx;
margin-bottom: 40rpx;
display: flex;
overflow: hidden;
height: 100%
line-height: 90rpx
</style>