预报名样式开发

common/styles/global/components.scss

@@ -211,7 +211,10 @@ view{box-sizing: border-box;}
 .dljt-page-content-box{width: 92%;margin: 0 auto 50rpx;background-color: #fff;
 box-shadow: 0 1rpx 3rpx 0 #227ECE;box-sizing: border-box;padding: 4rpx 10rpx 0;}
 /* 无限滚动区域 */
-.dljt-scroll-view .uni-scroll-view-content{height: calc(100vh - 420rpx)}
+.dljt-scroll-view{
+	height: calc(100vh - 410rpx);
+	.uni-scroll-view-content{height: calc(100vh - 410rpx);}
+} 
 
 /*左侧图片右侧内容列表区域*/
 .list-item-box{

common/styles/global/pages.scss

@@ -6,7 +6,10 @@
 
 // 专业建设
 .zhuanye-page{
-	.uni-scroll-view-content{height: calc(100vh - 640rpx);}
+	.dljt-scroll-view{
+		height: calc(100vh - 630rpx);
+		.uni-scroll-view-content{height: calc(100vh - 630rpx);}
+	} 
 	.zhuanye-list-box{
 	  display: flex;justify-content: space-between;margin: 24rpx 10rpx 36rpx;
 	   .zhuanye-item{
@@ -37,3 +40,30 @@
 	  .zhuanye-item:nth-child(5).active icon{background-image: url("@/static/images/jyjx/jyjx-icon5-a.png");}
 	}
 }
+
+
+// 招生就业
+.zsjy-page{
+	.dljt-form-box{height: calc(100vh - 446rpx);display: block;overflow-y: auto;padding-top: 36rpx;}
+	.dljt-input-row{
+		width: 80%;margin:0 auto 36rpx;
+		.input-title{color: #333;font-size: 30rpx;}
+		.form-input{
+			height: 70rpx;line-height: 70rpx;font-size: 26rpx;border: 1rpx solid #ccc;
+			border-radius: 6rpx;padding: 0 10rpx;margin-top: 10rpx;color: #333;
+			.uni-input-placeholder{color: #999;}
+			}
+		.form-select{
+			font-size: 26rpx;margin-top: 10rpx;
+			.uni-select{border: 1rpx solid #ccc;border-radius: 6rpx;padding: 0 10rpx;}
+			.uni-select__input-box{height: 70rpx;line-height: 1;}
+			.uni-select__input-placeholder{color: #999;font-size: 26rpx;}
+		}
+		.form-btn-box{
+			background-color: #01356e;color: #fff;font-size: 30rpx;margin: 82rpx 0;
+		}
+	}
+	.require-row{position: relative;}
+	.require-row::after{content: '*';color: red;
+	position: absolute;top: 66rpx;right: -30rpx;font-size: 36rpx;}
+}

pages/zsjyYubaoming/zsjyYubaoming.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="dljt-page-box">
+	<view class="dljt-page-box zsjy-page">
 		<MtaNavbar></MtaNavbar>
 		<view class="dljt-container-box">
 			<view class="dljt-page-title">招生就业</view>
@@ -12,42 +12,42 @@
 					<view class="breadcrumb-active">预报名</view>
 				</view>
 				<view>
-					<form @submit="formSubmit">
-						<view class="uni-form-item uni-column">
-							<view class="title">姓名</view>
-							<input class="uni-input" name="input" v-model="formData.name" placeholder="请输入姓名" />
+					<form @submit="formSubmit" class="dljt-form-box">
+						<view class="dljt-input-row require-row">
+							<view class="input-title">姓名</view>
+							<input class="form-input" name="input" v-model="formData.name" placeholder="请输入姓名" />
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">身份证号</view>
-							<input class="uni-input" name="input" v-model="formData.name" placeholder="请输入身份证号" />
+						<view class="dljt-input-row require-row">
+							<view class="input-title">身份证号</view>
+							<input class="form-input" name="input" v-model="formData.name" placeholder="请输入身份证号" />
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">预报专业</view>
-							<uni-data-select class="uni-input" v-model="formData.zhuanye" :localdata="range"
+						<view class="dljt-input-row require-row">
+							<view class="input-title">预报专业</view>
+							<uni-data-select class="form-select" v-model="formData.zhuanye" :localdata="range"
 								@change="change" placeholder="请选择预报专业"></uni-data-select>
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">联系电话</view>
-							<input class="uni-input" name="input" v-model="formData.dianhua" placeholder="请输入联系电话" />
+						<view class="dljt-input-row require-row">
+							<view class="input-title">联系电话</view>
+							<input class="form-input" name="input" v-model="formData.dianhua" placeholder="请输入联系电话" />
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">初中毕业学校</view>
-							<input class="uni-input" name="input" v-model="formData.xuexiao" placeholder="请输入初中毕业学校" />
+						<view class="dljt-input-row">
+							<view class="input-title">初中毕业学校</view>
+							<input class="form-input" name="input" v-model="formData.xuexiao" placeholder="请输入初中毕业学校" />
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">模拟考试分数</view>
-							<input class="uni-input" name="input" v-model="formData.fenshu" placeholder="请输入模拟考试分数" />
+						<view class="dljt-input-row">
+							<view class="input-title">模拟考试分数</view>
+							<input class="form-input" name="input" v-model="formData.fenshu" placeholder="请输入模拟考试分数" />
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">身高</view>
-							<input class="uni-input" name="input" v-model="formData.shengao" placeholder="请输入身高" />
+						<view class="dljt-input-row">
+							<view class="input-title">身高</view>
+							<input class="form-input" name="input" v-model="formData.shengao" placeholder="请输入身高" />
 						</view>
-						<view class="uni-form-item uni-column">
-							<view class="title">体重</view>
-							<input class="uni-input" name="input" v-model="formData.tizhong" placeholder="请输入体重" />
+						<view class="dljt-input-row">
+							<view class="input-title">体重</view>
+							<input class="form-input" name="input" v-model="formData.tizhong" placeholder="请输入体重" />
 						</view>
-						<view class="uni-btn-v">
-							<button form-type="submit">确认报名</button>
+						<view class="dljt-input-row">
+							<button class="form-btn-box" form-type="submit">确认报名</button>
 						</view>
 					</form>