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:
史典卓
2024-11-18 16:33:37 +08:00
parent cf8fc80b20
commit ad4eb162a5
83 changed files with 8250 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

179
pages/login/login.vue
View File

@@ -20,7 +20,7 @@
<view class="color_FFFFFF fs_30">选择您的性别1/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="fl_box fl_justmiddle">
<view class="fl_box fl_justmiddle fl_1 fl_alstart">
<view class="tabtwo-sex">
<image class="sex-img" src="../../static/icon/woman.png"></image>
<view class="mar_top5">女</view>
@@ -72,7 +72,6 @@
<view class="eductionbtn">留学-硕士</view>
<view class="eductionbtn">留学-博士</view>
</view>
<view class="fl_box fl_justmiddle"></view>
<view class="nextstep" @tap="nextStep">下一步</view>
</view>
</template>
@@ -86,7 +85,7 @@
<view class="salary">
<scroll-view class="salary-content" :show-scrollbar="false" :scroll-y="true">
<view class="salary-content-item">不限</view>
<view class="salary-content-item">2k</view>
<view class="salary-content-item salary-content-item-selected">2k</view>
<view class="salary-content-item">5k</view>
<view class="salary-content-item">10k</view>
<view class="salary-content-item">15k</view>
@@ -94,7 +93,7 @@
<view class="center-text">至</view>
<scroll-view class="salary-content" :show-scrollbar="false" :scroll-y="true">
<view class="salary-content-item">不限</view>
<view class="salary-content-item">2k</view>
<view class="salary-content-item salary-content-item-selected">2k</view>
<view class="salary-content-item">5k</view>
<view class="salary-content-item">10k</view>
<view class="salary-content-item">15k</view>
@@ -112,21 +111,59 @@
<view class="color_FFFFFF fs_30">您期望的求职区域5/6</view>
<view class="color_D9D9D9">个人信息仅用于推送优质内容</view>
</view>
<view class="fl_box fl_justmiddle"></view>
<view class="eduction-content">
<view class="eductionbtn eductionbtned">市南区</view>
<view class="eductionbtn">市北区</view>
<view class="eductionbtn">李沧区</view>
<view class="eductionbtn">崂山区</view>
<view class="eductionbtn">荒岛区</view>
<view class="eductionbtn">城阳区</view>
<view class="eductionbtn">即墨区</view>
<view class="eductionbtn">胶州市</view>
<view class="eductionbtn">平度市</view>
<view class="eductionbtn">莱西市</view>
<view class="eductionbtn">不限区域</view>
</view>
<view class="nextstep" @tap="nextStep">下一步</view>
</view>
</template>
<!-- tab6 -->
<template v-slot:tab6>
<view class="tabtwo">
<view class="tabtwo-top">
<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="fl_box fl_justmiddle"></view>
<!-- <view class="nextstep" @tap="complate">完成</view> -->
<view class="sex-search">
<uni-icons class="iconsearch" type="search" size="20"></uni-icons>
<input class="uni-input searchinput" confirm-type="search" />
</view>
<view class="sex-content fl_1">
<scroll-view :show-scrollbar="false" :scroll-y="true" class="sex-content-left">
<view
v-for="item in state.station"
:key="item.value"
class="left-list-btn"
:class="{ 'left-list-btned': item.value === state.stationCateLog }"
@click="changeStationLog(item)"
>
{{ item.label }}
</view>
</scroll-view>
<scroll-view :show-scrollbar="false" :scroll-y="true" class="sex-content-right">
<view class="grid-sex">
<view class="sex-right-btn sex-right-btned">客户经理</view>
<view class="sex-right-btn">客户经理</view>
<view class="sex-right-btn">客户经理</view>
<view class="sex-right-btn">客户经理</view>
<view class="sex-right-btn">客户经理</view>
<view class="sex-right-btn">客户经理</view>
<view class="sex-right-btn">客户经理</view>
</view>
</scroll-view>
</view>
<navigator url="/pages/index/index" open-type="reLaunch" hover-class="other-navigator-hover">
<button class="nextstep" @tap="complate">完成</button>
<button class="nextstep confirmStep">完成</button>
</navigator>
</view>
</template>
@@ -139,8 +176,30 @@ import tabcontrolVue from './components/tabcontrol.vue';
import { reactive, inject, watch, ref } from 'vue';
const { statusBarHeight } = inject('deviceInfo');
const { $api, navTo } = inject('globalFunction');
const tabCurrent = ref(4);
// 初始化
const station = [
{ label: '销售/商务拓展', value: 1 },
{ label: '人事/行政/财务/法务', value: 2 },
{ label: '互联网/通信及硬件', value: 3 },
{ label: '运维/测试', value: 4 },
{ label: '销售/商务拓展', value: 5 },
{ label: '人事/行政/财务/法务', value: 6 },
{ label: '互联网/通信及硬件', value: 7 },
{ label: '运维/测试', value: 8 },
{ label: '销售/商务拓展', value: 9 },
{ label: '人事/行政/财务/法务', value: 10 },
{ label: '互联网/通信及硬件', value: 11 },
{ label: '销售/商务拓展', value: 12 },
{ label: '人事/行政/财务/法务', value: 13 },
{ label: '互联网/通信及硬件', value: 14 },
];
// status
const tabCurrent = ref(0);
const state = reactive({
station: station,
stationCateLog: 1,
});
const fromValue = reactive({
sex: 1,
});
@@ -150,7 +209,10 @@ setTimeout(() => {
const getuserinfo = (e) => {
console.log(e);
};
// 行为
function changeStationLog(item) {
state.stationCateLog = item.value;
}
function nextStep() {
tabCurrent.value += 1;
}
@@ -161,11 +223,11 @@ function handleScroll(event) {
}
</script>
<style lang="stylus">
<style lang="stylus" scoped>
.container
width: 100%;
height: 100%
background: linear-gradient(#4778EC, #002979);
width: 100%;
height: calc(100vh - var(--window-top) - var(--status-bar-height) - var(--window-bottom));
position: relative;
.login-content
@@ -207,6 +269,8 @@ function handleScroll(event) {
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%;
@@ -264,10 +328,6 @@ function handleScroll(event) {
background: #13C57C;
color: #FFFFFF;
.nextstep
position: absolute;
top: 80%;
left: 50%;
transform: translate(-50%, 0)
width: 630rpx;
height: 98rpx;
border-radius: 20rpx;
@@ -276,6 +336,9 @@ function handleScroll(event) {
line-height: 98rpx;
font-size: 36rpx;
color: #FFFFFF;
margin-bottom: 150rpx;
.confirmStep
margin-bottom: 50rpx;
.eduction-content
width: fit-content;
display: grid;
@@ -297,7 +360,7 @@ function handleScroll(event) {
.salary
width: fit-content;
display: grid;
grid-template-columns: 300rpx auto 300rpx;
grid-template-columns: 300rpx 40rpx 300rpx;
// grid-gap: 20rpx;
margin-top: 50rpx;
.center-text
@@ -314,4 +377,80 @@ function handleScroll(event) {
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-search
width: calc(100% - 28rpx - 28rpx);
padding: 10rpx 28rpx;
display: grid;
// grid-template-columns: 50rpx auto;
position: relative;
.iconsearch
position: absolute;
left: 40rpx;
top: 20rpx;
.searchinput
border-radius: 10rpx;
background: #FFFFFF;
padding: 10rpx 0 10rpx 58rpx;
.sex-content
background: #FFFFFF;
border-radius: 20rpx;
width: 100%;
margin-top: 20rpx;
margin-bottom: 40rpx;
display: flex;
border-bottom: 2px solid #D9D9D9;
overflow: hidden
.sex-content-left
width: 250rpx;
.left-list-btn
padding: 0 24rpx;
display: grid;
place-items: center;
height: 100rpx;
text-align: center;
color: #606060;
font-size: 28rpx;
.left-list-btned
color: #4778EC;
position: relative;
.left-list-btned::after
position: absolute;
left: 20rpx;
content: '';
width: 7rpx;
height: 38rpx;
background: #4778EC;
border-radius: 0rpx 0rpx 0rpx 0rpx;
.sex-content-right
border-left: 2px solid #D9D9D9;
flex: 1;
.grid-sex
display: grid;
grid-template-columns: 50% 50%;
place-items: center;
.sex-right-btn
width: 211rpx;
height: 84rpx;
font-size: 35rpx;
line-height: 41rpx;
text-align: center;
display: grid;
place-items: center;
background: #D9D9D9;
border-radius: 20rpx;
margin-top:30rpx;
color: #606060;
.sex-right-btned
color: #FFFFFF;
background: #4778EC;
</style>