Jelajahi Sumber

求职信息 样式修改

tanxue 2 bulan lalu
induk
melakukan
5fe94b1ee4

+ 22 - 6
common/styles/global/components.scss

@@ -270,7 +270,7 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 
 // label-radio
 .form-label-radio{
-	width: 100%;display: flex;justify-content: space-between;
+	width: 100%;display: flex;justify-content: space-between;align-items: center;
 	background-color: #fff;font-size: 30rpx;color: #333;
 	padding: 6rpx 20rpx;box-sizing: border-box;margin-bottom: 2rpx;
 	.form-label-require{color: #ff0101;margin-right: 6rpx;width:16rpx;display: inline-block;}
@@ -278,12 +278,28 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 	.form-radio-group{display: flex;flex-wrap: wrap;flex: 1;}
 	.form-radio-double-group{justify-content: space-between;}
 	.form-radio-item{
-		width: 28%;height:60rpx;line-height:52rpx;border-radius: 6rpx;box-sizing: border-box;
+		width: 29%;height:60rpx;line-height:60rpx;border-radius: 6rpx;box-sizing: border-box;
 		background-color:#f5f5f5;text-align: center;margin:10rpx 2%;border:1rpx solid #f5f5f5;
+		box-sizing: border-box;padding: 0 6rpx;font-size: 26rpx;
 	}
-	.genderActive{
-		background-color:#e5f8f4;border:1rpx solid #6bccb0;
+	.genderActive{background-color:#e5f8f4;border:1rpx solid #6bccb0;}
+	// btn
+	.radio-add-btn{
+		width: 29%;height:60rpx;line-height:60rpx;border-radius: 6rpx;box-sizing: border-box;
+		text-align: center;margin:10rpx 2%;border:1rpx solid #6bccb0;color:#6bccb0;
+		box-sizing: border-box;padding: 0 6rpx;font-size: 26rpx;background-color:#e5f8f4;
+	}
+	.radio-btn-box{
+		width: 100%;display:block;text-align: center;
+		.radio-btn{color:#6bccb0;display:inline-block;margin: 16rpx 0;}
+		.radio-btn::after{
+			content: '';width: 30rpx;height: 30rpx;@include ezy-no-repeat-cover;
+			background-image: url("@/static/images/common/nav-bar-jt-bottom-green.svg");
+			display: inline-block;vertical-align: middle;margin-left: 10rpx;font-size: 30rpx;
+		}
+		.collapsed-btn::after{transform: rotate(180deg);}
 	}
+	.label-radio-btn-box{margin-right: 180rpx;}
 }
 
 // label-select
@@ -292,7 +308,7 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 	background-color: #fff;font-size: 30rpx;color: #333;
 	padding: 20rpx;box-sizing: border-box;margin-bottom: 2rpx;
 	.form-label-require{color: #ff0101;margin-right: 6rpx;width:16rpx;display: inline-block;}
-	.phone-form-label{min-width: 180rpx;line-height:52rpx;}
+	.phone-form-label{min-width: 180rpx;line-height:60rpx;}
 	.form-radio-select{
 		display: flex;align-items: center;
 		icon{width: 30rpx;height: 30rpx;@include ezy-no-repeat-cover;
@@ -303,7 +319,7 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 
 // label-switch
 .form-label-switch{
-	width: 100%;display: flex;justify-content: space-between;
+	width: 100%;display: flex;justify-content: space-between;align-items: center;
 	background-color: #fff;font-size: 30rpx;color: #333;
 	padding: 20rpx;box-sizing: border-box;margin-bottom: 2rpx;
 	.form-label-require{color: #ff0101;margin-right: 6rpx;width:16rpx;display: inline-block;}

+ 8 - 1
common/styles/global/pages.scss

@@ -450,10 +450,17 @@
 	.form-top-margin{margin-top: 20rpx;}
 	.upload-img-box{background-color: #fff;padding: 20rpx 0;margin: 20rpx 0;}
 	// 个人资料
-	.xxdz-label-input{align-items: flex-start;}
 	.form-textarea-box{width: 100%;height: 160rpx;padding: 10rpx;border: 1rpx solid #e5e5e5;border-radius: 4px;}
 	.agree-section-box{
 		background-color: #fff;padding: 30rpx;font-size: 28rpx;
 		.phone-green-btn{font-size: 28rpx;margin: 20rpx 8rpx 36rpx;}
 	}
+	.flex-start-row{
+		align-items: flex-start;
+		.phone-form-label{line-height: 70rpx;}
+	}
+	.page-btn-box{
+		margin: 20rpx 8rpx 0;display: flex;justify-content: center;padding: 32rpx 0;background-color: #fff;
+		.phone-white-btn,.phone-green-btn{width: 36%;font-size: 28rpx;margin: 0 16rpx;}
+	}
 }

+ 7 - 22
pages/admin/Jiazheng/common/dataChecked.vue

@@ -2,18 +2,21 @@
 	<view class="form-radio-group">
 		<!-- 技能块展示 -->
 		<view v-for="item in displayedList" :key="item.id" class="form-radio-item"
-			:class="{ selected: isSelected(item.id) }" @click="toggleSelect(item)">
+			:class="{ genderActive: isSelected(item.id) }" @click="toggleSelect(item)">
 			{{ item.name }}
 		</view>
 		<!-- 添加按钮 -->
-		<view v-if="showAddButton" class="add-block" @click="handleAdd">
+		<view v-if="showAddButton" class="radio-add-btn" @click="handleAdd">
 			+ 添加
 		</view>
 
 		<!-- 展开/收起按钮 -->
-		<view v-if="showExpandButton" class="expand-button" @click="toggleExpand">
-			{{ showAll ? '收起' : `展开` }}
+		<view class="radio-btn-box label-radio-btn-box">
+			<view v-if="showExpandButton" :class="[{ 'radio-btn': true }, showAll ? 'collapsed-btn' : 'expanded-btn']" @click="toggleExpand">
+				{{ showAll ? '收起' : `展开` }}
+			</view>
 		</view>
+		
 
 		<!-- 	<view v-if="showExpandButton" class="expand-button" @click="toggleExpand">
 			{{ showAll ? '收起' : `展开剩余${remainingCount}项` }}
@@ -164,24 +167,6 @@
 </script>
 
 <style scoped>
-	.skill-list {
-		display: flex;
-		flex-wrap: wrap;
-		gap: 20rpx;
-	}
-
-	.skill-block {
-		padding: 12rpx 24rpx;
-		background: #f5f5f5;
-		border-radius: 8rpx;
-		font-size: 28rpx;
-		color: #333;
-	}
-
-	.skill-block.selected {
-		background: #007aff;
-		color: #fff;
-	}
 
 	.add-block {
 		background: transparent;

+ 3 - 3
pages/admin/Jiazheng/gerenZiliao.vue

@@ -44,16 +44,16 @@
 						女</view>
 				</view>
 			</view>
-			<view class="form-label-radio form-top-margin">
+			<view class="form-label-radio form-top-margin flex-start-row">
 				<view class="phone-form-label"><text class="form-label-require"></text>学历</view>
 				<dataChecked :list="xueliList" mode="single" :showAdd="false" @change="selectChangeXueliList" />
 			</view>
-			<view class="form-label-radio">
+			<view class="form-label-radio flex-start-row">
 				<view class="phone-form-label"><text class="form-label-require"></text>婚姻 </view>
 				<dataChecked :list="hunyinList" mode="single" :showAdd="false" @change="selectChangeHunyinList" />
 			</view>
 
-			<view class="form-label-input form-top-margin xxdz-label-input">
+			<view class="form-label-input form-top-margin flex-start-row">
 				<view class="phone-form-label"><text class="form-label-require">*</text>详细地址</view>
 				<textarea v-model="formData.currentAddress" placeholder="请输入详细地址" class="form-textarea-box" />
 			</view>

+ 27 - 27
pages/admin/Jiazheng/qiuzhiXinxi.vue

@@ -1,41 +1,41 @@
 <template>
-	<view>
-		<view>
-			<view>
-				*类型
-			</view>
+	<view class="jz-content-box">
+		<view class="form-label-radio form-top-margin flex-start-row">
+			<view class="phone-form-label"> <text class="form-label-require"></text>类型</view>
 			<dataChecked :list="typeList" mode="multiple" :defaultCount="9" @change="selectChangeType" @add="addType" />
 		</view>
-		<view>
-			<view>经验</view>
+		<view class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require"></text>经验</view>
 		</view>
-		<view>
-			<view>
-				*技能
-			</view>
+		<view class="form-label-radio flex-start-row">
+			<view class="phone-form-label"><text class="form-label-require">*</text>技能</view>
 			<dataChecked :list="skillList" mode="multiple" :defaultCount="9" @change="selectChangeSkill"
 				@add="addSkill" />
 		</view>
-		<view>
-			<view>
-				状态
-			</view>
+		<view class="form-label-radio form-top-margin flex-start-row">
+			<view class="phone-form-label"><text class="form-label-require">*</text>状态</view>
 			<dataChecked :list="zhuangtaiList" mode="single" :showAdd="false" @change="selectChangeZhuangtai" />
 		</view>
-		<picker :range="xinziJibie" mode='selector' @change="xinziJibieChange" @cancel="xinziJibieCancel">
-			<view>薪资级别</view>
-		</picker>
-		<view>
-			<view>期望薪资</view>
-			  <input v-model="inputValue"  placeholder="面议" />
+		<view class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require"></text>薪资级别</view>
+			<picker :range="xinziJibie" mode='selector' @change="xinziJibieChange" @cancel="xinziJibieCancel">
+				<view class="form-radio-select">
+					<view></view><icon></icon>
+				</view>
+			</picker>
+		</view>
+		
+		<view class="form-label-input">
+			<view class="phone-form-label"><text class="form-label-require"></text>期望薪资</view>
+			<input v-model="inputValue"  placeholder="请输入期望薪资" />
 		</view>	
-		<view>
-			<view>工作经历</view>
-			  <input v-model="inputValue"  placeholder="请填写工作经历" />
+		<view class="form-label-input">
+			<view class="phone-form-label"><text class="form-label-require"></text>工作经历</view>
+			<input v-model="inputValue"  placeholder="请填写工作经历" />
 		</view>
-		<view>
-			<view>上一步</view>
-			<view>下一步</view>
+		<view class="page-btn-box">
+			<button type="default" class="phone-white-btn">上一步</button>
+			<button type="default" class="phone-green-btn">下一步</button>
 		</view>
 	</view>
 </template>

+ 1 - 0
static/images/common/nav-bar-jt-bottom-green.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1740467226332" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2034" width="60" height="60" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M512 704c8.288 0 15.776-3.232 21.456-8.4l0.064 0.08 352-320-0.08-0.08c6.448-5.856 10.56-14.208 10.56-23.6a32 32 0 0 0-32-32c-8.288 0-15.76 3.232-21.456 8.4l-0.08-0.08L512 628.752 181.536 328.32l-0.08 0.08A31.776 31.776 0 0 0 160 320a32 32 0 0 0-32 32c0 9.376 4.112 17.744 10.544 23.6l-0.08 0.08 352 320 0.08-0.08c5.68 5.168 13.168 8.4 21.456 8.4z" p-id="2035" data-spm-anchor-id="a313x.search_index.0.i1.23233a81kOTPLw" fill="#3fd2a1" class="selected"></path></svg>