样式修改

common/styles/global/components.scss

@@ -309,6 +309,7 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 	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:60rpx;}
+	.form-radio-picker{width:auto!important;flex: unset!important;display: flex;align-items: center;}
 	.form-radio-select{
 		display: flex;align-items: center;
 		icon{width: 30rpx;height: 30rpx;@include ezy-no-repeat-cover;
@@ -331,5 +332,5 @@ margin-right: 18rpx;display: inline-block;vertical-align: middle;}
 	width: 100px;height: 100px;border: 1rpx dashed #ccc;margin: 0 auto;
 	display: flex;align-items: center;justify-content: center;border-radius: 8rpx;
 	text{font-size: 42rpx;color:#d7d7d7;}
-	.bottom-text {font-size: 12px;color: #bdbdbd;}
-}
+}
+.upload-bottom-text {font-size: 24rpx;color: #666;text-align: center;margin-top: 10rpx;}

common/styles/global/pages.scss

@@ -463,4 +463,16 @@
 		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;}
 	}
+	// 照片资料
+	.ziliao-upload-box{
+		background-color: #fff;display: flex;padding: 32rpx;
+		view + view{margin-left: 16rpx;}
+	}
+	.zpzl-tip-box{
+		background-color: #fff;padding:24rpx 38rpx;font-size: 30rpx;color: #333;
+		.red-tip{font-size: 24rpx;color: #ff0101;margin: 16rpx 0;}
+		.scbg-tip{text-align: center;font-size: 28rpx;color: #555;
+		padding: 42rpx 0 24rpx;border-top: 1rpx solid #f8f9fd;margin-top: 24rpx;}
+		.scbg-btn{font-size: 28rpx;margin: 20rpx 8rpx 10rpx;}
+	}
 }

pages/admin/Jiazheng/common/jiazhengUpload.vue

@@ -2,10 +2,10 @@
 	<view v-if="changjingType =='shenfenzheng'" class="admin-upload-btn-box" @click="showActionSheet">
 		<text>+</text>
 	</view>
-	<view v-else class="upload-btn" @click="showActionSheet">
+	<view v-else class="admin-upload-btn-box" @click="showActionSheet">
 		<text>+</text>
 	</view>
-	<view v-if="bottomText" class="bottom-text">
+	<view v-if="bottomText" class="upload-bottom-text">
 		{{bottomText}}
 	</view>
 </template>

pages/admin/Jiazheng/zhaopianZiliao.vue

@@ -1,43 +1,32 @@
 <template>
-	<view>
-		<view class="zhaopianZiliao-touxiang">
+	<view class="jz-content-box">
+		<view class="upload-img-box">
 			<jiazhengUpload bottomText="上传头像和生活照"></jiazhengUpload>
 		</view>
-		<view class="zhaopianZiliao-shenfenzheng">
-			<view>
-				身份证照片
-			</view>
-			<switch @change="switchSfzChange" />
+		<view class="form-label-switch">
+			<view class="phone-form-label"><text class="form-label-require"></text>身份证照片</view>
+			<switch @change="switchSfzChange" color="#3fd2a1" style="transform:scale(0.7)"/>
 		</view>
-		<view class="zhaopianZiliao-shenfenzhengImg">
-			<view class="zhaopianZiliao-shenfenzhengImg-first">
-				<jiazhengUpload bottomText="上传身份证头像面"></jiazhengUpload>
-			</view>
-			<view class="zhaopianZiliao-shenfenzhengImg-two">
-				<jiazhengUpload bottomText="上传身份证国徽面"></jiazhengUpload>
-			</view>
-
+		<view class="ziliao-upload-box">
+			<view><jiazhengUpload bottomText="上传身份证头像面"></jiazhengUpload></view>
+			<view><jiazhengUpload bottomText="上传身份证国徽面"></jiazhengUpload></view>
 		</view>
-		<view class="zhaopianZiliao-shenfenzheng">
-			<view>
-				工作生活照
-			</view>
-			<switch @change="switchGzChange" />
+		<view class="form-label-switch form-top-margin">
+			<view class="phone-form-label"><text class="form-label-require"></text>工作生活照</view>
+			<switch @change="switchGzChange" color="#3fd2a1" style="transform:scale(0.7)"/>
 		</view>
 		<view class="zhaopianZiliao-shenfenzhengImg">
-			<view class="zhaopianZiliao-shenfenzhengImg-first">
-				<jiazhengUpload></jiazhengUpload>
+			<view class="ziliao-upload-box">
+				<view><jiazhengUpload></jiazhengUpload></view>
 			</view>
 		</view>
-		<view class="zhaopianZiliao-shenfenzheng">
-			<view>
-				资格类照片
-			</view>
-			<switch @change="switchZgChange" />
+		<view class="form-label-switch form-top-margin">
+			<view class="phone-form-label"><text class="form-label-require"></text>资格类照片</view>
+			<switch @change="switchZgChange" color="#3fd2a1" style="transform:scale(0.7)"/>
 		</view>
 		<view class="zhaopianZiliao-shenfenzhengImg">
-			<view class="zhaopianZiliao-shenfenzhengImg-first">
-				<jiazhengUpload></jiazhengUpload>
+			<view class="ziliao-upload-box">
+				<view><jiazhengUpload></jiazhengUpload></view>
 			</view>
 		</view>
 		<!-- 	<view class="list-row"  @click="clickTijianriqi">
@@ -45,46 +34,42 @@
 			<text>最近体检日期</text>
 		</view> -->
 		<!-- <uni-datetime-picker ref="datePicker" type="date" placeholder="选择日期121231233"   :clear-icon="false" v-model="single" @maskClick="maskClick" /> -->
+		<view 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="single" type="date" @change="changeTijian">
+				<view class="form-radio-select">
+					<view></view><icon></icon>
+				</view>
+			</uni-datetime-picker>
+		</view>
 
-		<uni-datetime-picker v-model="single" type="date" @change="changeTijian">
-			<view class="list-row">
-				<icon class="list-icon error-icon"></icon>
-				<text>最近体检日期123</text>
-			</view>
-		</uni-datetime-picker>
-
-		<uni-datetime-picker v-model="single" type="date" @change="changeTijian">
-			<view class="list-row">
-				<icon class="list-icon error-icon"></icon>
-				<text>健康证日期</text>
-			</view>
-		</uni-datetime-picker>
+		<view 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="single" type="date" @change="changeTijian">
+				<view class="form-radio-select">
+					<view></view><icon></icon>
+				</view>
+			</uni-datetime-picker>
+		</view>
 
-		<view>
-			<view>
-				体检报告文件
-				（*如未经同意，体检报告均不展示在简历中;在系统中预约的体检，如有电子报告，会自动关联到简历中）
-			</view>
+		<view class="zpzl-tip-box form-top-margin">
+			<view>体检报告文件</view>
+			<view class="red-tip">（*如未经同意，体检报告均不展示在简历中;在系统中预约的体检，如有电子报告，会自动关联到简历中） </view>
 			<view>
 				<checkbox-group>
-
-					<checkbox value="cb" checked="true" />已经{{name}}同意，上传个人体检报告
+					<checkbox value="cb" checked="true" color="#3fd2a1" style="transform:scale(0.65)"/>已经{{name}}同意，上传个人体检报告
 				</checkbox-group>
 			</view>
+			<view class="scbg-tip">
+				还没有上传的体验报告<br>
+				可点击下方上传体检报告
+			</view>
+		<button type="default" class="phone-green-btn scbg-btn">＋从手机上传体检报告(pdf)</button>
 		</view>
-
-
-		<view>
-			还没有上传的体验报告
-			可点击下方上传体检报告
-		</view>
-		<view>
-			＋从手机上传体检报告(pdf)
-		</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>
@@ -134,32 +119,4 @@
 
 		},
 	};
-</script>
-<style scoped>
-	.zhaopianZiliao-touxiang {
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		flex-direction: column;
-	}
-
-	.zhaopianZiliao-shenfenzhengImg {
-		display: flex;
-
-	}
-
-	.zhaopianZiliao-shenfenzheng {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 10px;
-	}
-
-	.zhaopianZiliao-shenfenzhengImg-first {
-		margin-left: 20px;
-	}
-
-	.zhaopianZiliao-shenfenzhengImg-two {
-		margin-left: 20px;
-	}
-</style>
+</script>