Browse Source

样式修改

tanxue 2 months ago
parent
commit
d4ef53c7c2

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

@@ -466,7 +466,7 @@
 	// 照片资料
 	.ziliao-upload-box{
 		background-color: #fff;display: flex;padding: 32rpx;
-		view + view{margin-left: 16rpx;}
+		.upload-item-box + .upload-item-box{margin-left: 16rpx;}
 	}
 	.zpzl-tip-box{
 		background-color: #fff;padding:24rpx 38rpx;font-size: 30rpx;color: #333;

+ 33 - 89
pages/admin/Jiazheng/banzhengXinxi.vue

@@ -1,82 +1,81 @@
 <template>
-	<view class="form-container">
+	<view class="jz-content-box">
 		<!-- 报证机构(picker 实现下拉选择) -->
-		<view class="form-item">
-			<text class="label">* 报证机构:</text>
+		<view class="form-label-select form-top-margin">
+			<view class="phone-form-label"><text class="form-label-require">*</text>报证机构</view>
 			<picker mode="selector" :range="jigouNames" @change="jigouChange">
-				<view class="picker">
-					{{ formData.baozhengJigouName || '请选择报证机构' }}
+				<view class="form-radio-select">
+					<view>{{ formData.baozhengJigouName || '请选择报证机构' }}</view><icon></icon>
 				</view>
 			</picker>
 		</view>
 		<!-- 职业名称(picker 实现下拉选择) -->
-		<view class="form-item">
-			<text class="label">* 职业名称:</text>
+		<view class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require">*</text>职业名称</view>
 			<picker mode="selector" :range="zhiyeNames" range-key="name" @change="zhiyeChange">
-				<view class="picker">
-					{{ formData.zhiyeName || '请选择职业名称' }}
+				<view class="form-radio-select">
+					<view>{{ formData.zhiyeName || '请选择职业名称' }}</view><icon></icon>
 				</view>
 			</picker>
 		</view>
 		<!-- 职业等级(picker 实现下拉选择) -->
-		<view class="form-item">
-			<text class="label">* 职业等级:</text>
+		<view class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require">*</text>职业等级</view>
 			<picker mode="selector" :range="zhiyeLevels" @change="levelChange">
-				<view class="picker">
-					{{ formData.zhiyeLevelName || '请选择等级' }}
+				<view class="form-radio-select">
+					<view>{{ formData.zhiyeLevelName || '请选择等级' }}</view><icon></icon>
 				</view>
 			</picker>
 		</view>
 
-		<view  v-if="formData.banzhengInfoFlag" class="form-item">
-			<text class="label">参训时间:</text>
-			<uni-datetime-picker v-model="formData.canxunShijian" type="date" @change="canxunShijianChange">
-				<view class="list-row">
-					<icon class="list-icon error-icon"></icon>
-					<text>{{formData.canxunShijian}}</text>
+		<view  v-if="formData.banzhengInfoFlag" class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require"></text>参训时间</view>
+			<uni-datetime-picker class="form-radio-picker" v-model="formData.canxunShijian" type="date" @change="canxunShijianChange">
+				<view class="form-radio-select">
+					<view>{{formData.canxunShijian}}</view><icon></icon>
 				</view>
 			</uni-datetime-picker>
 		</view>
 
-		<view  v-if="formData.banzhengInfoFlag" class="form-item">
-			<view>*实操成绩</view>
+		<view  v-if="formData.banzhengInfoFlag" class="form-label-input">
+			<view class="phone-form-label"><text class="form-label-require">*</text>实操成绩</view>
 			<input v-model="formData.shicaochengji" placeholder="请填写实操成绩" />
 		</view>
-		<view  v-if="formData.banzhengInfoFlag" class="form-item">
-			<view>*总课时</view>
+		<view  v-if="formData.banzhengInfoFlag" class="form-label-input">
+			<view class="phone-form-label"><text class="form-label-require">*</text>总课时</view>
 			<input v-model="formData.zongkeshi" placeholder="请填写总课时" />
 		</view>
 
 
-		<view  v-if="!formData.banzhengInfoFlag" class="form-item">
-			<text class="label">需要课程:</text>
+		<view  v-if="!formData.banzhengInfoFlag" class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require"></text>需要课程</view>
 			<radio-group @change="kechengChange">
 				<label class="radio-label">
-					<radio :value="'true'" :checked="formData.needKecheng == 'true'" />
+					<radio :value="'true'" :checked="formData.needKecheng == 'true'" color="#3fd2a1" style="transform:scale(0.65)"/>
 					<text>是</text>
 				</label>
 				<label class="radio-label">
-					<radio :value="'false'" :checked="formData.needKecheng == 'false'" />
+					<radio :value="'false'" :checked="formData.needKecheng == 'false'" color="#3fd2a1" style="transform:scale(0.65)"/>
 					<text>否</text>
 				</label>
 			</radio-group>
 		</view>
-		<view v-if="!formData.banzhengInfoFlag" class="form-item">
-			<text class="label">需要考试:</text>
+		<view v-if="!formData.banzhengInfoFlag" class="form-label-select">
+			<view class="phone-form-label"><text class="form-label-require"></text>需要考试</view>
 			<radio-group @change="kaoshiChange">
 				<label class="radio-label">
-					<radio :value="'true'" :checked="formData.needKaoshi == 'true'" />
+					<radio :value="'true'" :checked="formData.needKaoshi == 'true'" color="#3fd2a1" style="transform:scale(0.65)"/>
 					<text>是</text>
 				</label>
 				<label class="radio-label">
-					<radio :value="'false'" :checked="formData.needKaoshi == 'false'" />
+					<radio :value="'false'" :checked="formData.needKaoshi == 'false'" color="#3fd2a1" style="transform:scale(0.65)"/>
 					<text>否</text>
 				</label>
 			</radio-group>
 		</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>
 		<!-- 提交按钮 -->
 <!-- 		<button class="submit-btn" @click="submitForm">提交</button> -->
@@ -240,58 +239,3 @@
 		}
 	};
 </script>
-
-<style scoped>
-	.form-container {
-		padding: 30rpx;
-		background-color: #f8f8f8;
-		min-height: 100vh;
-	}
-
-	.form-item {
-		background-color: #fff;
-		padding: 30rpx;
-		margin-bottom: 30rpx;
-		border-radius: 12rpx;
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-	}
-
-	.label {
-		font-size: 28rpx;
-		color: #333;
-		width: 200rpx;
-	}
-
-	.picker {
-		flex: 1;
-		font-size: 28rpx;
-		color: #999;
-		text-align: right;
-	}
-
-	.radio-label {
-		margin-left: 40rpx;
-		display: inline-flex;
-		align-items: center;
-	}
-
-	.radio-label text {
-		margin-left: 10rpx;
-		font-size: 28rpx;
-	}
-
-	.submit-btn {
-		margin-top: 60rpx;
-		background-color: #007aff;
-		color: #fff;
-		border-radius: 50rpx;
-	}
-
-	/* 选中样式 */
-	radio[checked] .wx-radio-input {
-		background-color: #007aff !important;
-		border-color: #007aff !important;
-	}
-</style>

+ 2 - 2
pages/admin/Jiazheng/zhaopianZiliao.vue

@@ -8,8 +8,8 @@
 			<switch @change="switchSfzChange" color="#3fd2a1" style="transform:scale(0.7)"/>
 		</view>
 		<view class="ziliao-upload-box">
-			<view><jiazhengUpload bottomText="上传身份证头像面"></jiazhengUpload></view>
-			<view><jiazhengUpload bottomText="上传身份证国徽面"></jiazhengUpload></view>
+			<view class="upload-item-box"><jiazhengUpload bottomText="上传身份证头像面"></jiazhengUpload></view>
+			<view class="upload-item-box"><jiazhengUpload bottomText="上传身份证国徽面"></jiazhengUpload></view>
 		</view>
 		<view class="form-label-switch form-top-margin">
 			<view class="phone-form-label"><text class="form-label-require"></text>工作生活照</view>