立即申请页面画写和接口联调

apis/baseApi.js

@@ -1,4 +1,4 @@
-const BaseApi = ''
+const BaseApi = 'http://192.168.3.13:9031' //徐涛
 
 export {
 	BaseApi

pages.json

@@ -20,7 +20,14 @@
 		{
 			"path": "pages/consult/index",
 			"style": {
-				"navigationBarTitleText": "在线咨询",
+				"navigationBarTitleText": "联系我们",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/consult/apply",
+			"style": {
+				"navigationBarTitleText": "申请专项演示方案",
 				"navigationStyle": "custom"
 			}
 		}

pages/consult/apply.vue

@@ -0,0 +1,207 @@
+<template>
+	<view class="content">
+		<view class="top">
+			<image src="../../static/imgs/icon_left_jt.png" @click="back"></image>
+			<text>申请专项演示方案</text>
+		</view>
+		<view class="contact">
+			<view class="title">请留下您的联系方式</view>
+			<view class="item first">
+				<view class="name"><span>*</span>公司名称</view>
+				<view class="inp">
+					<input type="text" placeholder="请输入公司名称" v-model="info.companyName">
+				</view>
+			</view>
+			<view class="item">
+				<view class="name"><span>*</span>联系电话</view>
+				<view class="inp">
+					<input type="tel" placeholder="请输入联系电话" v-model="info.linkPhone">
+				</view>
+			</view>
+			<view class="item">
+				<view class="name"><span>*</span>姓名</view>
+				<view class="inp">
+					<input type="text" placeholder="请输入您的姓名" v-model="info.realName">
+				</view>
+			</view>
+			<view class="item last">
+				<view class="name"><span>*</span>企业需求</view>
+				<view class="inp">
+					<textarea maxlength="-1" placeholder="请输入企业需求" v-model="info.requirement"></textarea>
+				</view>
+			</view>
+		</view>
+		<view class="apply" @click="apply">立即申请</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return {
+				info:{
+					companyName:'',
+					linkPhone:'',
+					realName:'',
+					requirement:''
+				},
+				canApply:true,
+			}
+		},
+		methods:{
+			back(){
+				uni.navigateBack();
+			},
+			apply(){
+				if(!this.canApply) return;
+				if(!this.info.companyName) return this.$showToast('请输入公司名称');
+				if(!this.$reg.mobile(this.info.linkPhone)) return this.$showToast('请输入正确的联系电话');
+				if(!this.info.realName) return this.$showToast('请输入您的姓名');
+				if(!this.info.requirement) return this.$showToast('请输入企业需求');
+				
+				this.canApply = false;
+				this.$api.post('/specialcrowd-admin/contactus',this.info).then(res=>{
+					this.canApply = true;
+					if(res.data.code===0){
+						this.$showToast('申请成功');
+					}else this.$showToast(res.data.msg);
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped lang="less">
+	.content{
+		background: #fff;
+		
+		.top{
+			margin-top: 24rpx;
+			width: 100%;
+			height: 42rpx;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			position: relative;
+			text{
+				font-family: PingFangSC, PingFang SC;
+				font-weight: 400;
+				font-size: 30rpx;
+				color: #111111;
+				line-height: 42rpx;
+			}
+			image{
+				width: 42rpx;
+				height: 42rpx;
+				position: absolute;
+				top: 0;
+				left: 30rpx;
+			}
+		}
+	
+		.contact{
+			width: calc(100% - 48rpx);
+			margin: 44rpx 24rpx 0;
+			padding: 36rpx 0 24rpx;
+			box-sizing: border-box;
+			background: #FFFFFF;
+			box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(0,0,0,0.06);
+			border-radius: 12rpx;
+			
+			.title{
+				font-family: PingFang-SC, PingFang-SC;
+				font-weight: bold;
+				font-size: 32rpx;
+				color: #111111;
+				line-height: 45rpx;
+				padding-left: 28rpx;
+				position: relative;
+				&:before{
+					content: '';
+					width: 12rpx;
+					height: 24rpx;
+					background: #1460CA;
+					position: absolute;
+					left: 0;
+					top: 50%;
+					margin-top: -12rpx;
+				}
+			}
+			
+			.item{
+				width: calc(100% - 60rpx);
+				height: 90rpx;
+				box-shadow: inset 0rpx -2rpx 0rpx 0rpx #F0F1F4;
+				margin: 0 30rpx 0;
+				display: flex;
+				align-items: center;
+				&.first{
+					margin-top: 63rpx;
+				}
+				&.last{
+					height: 300rpx;
+					align-items: flex-start;
+					padding: 25rpx 0;
+					box-sizing: border-box;
+				}
+				
+				.name{
+					width: 176rpx;
+					padding-left: 22rpx;
+					box-sizing: border-box;
+					font-family: PingFangSC, PingFang SC;
+					font-weight: 400;
+					font-size: 28rpx;
+					color: #666666;
+					line-height: 40rpx;
+					position: relative;
+					span{
+						width: 24rpx;
+						height: 40rpx;
+						font-family: PingFangSC, PingFang SC;
+						font-weight: 400;
+						font-size: 28rpx;
+						color: #F61B1B;
+						line-height: 40rpx;
+						position: absolute;
+						left: 0;
+					}
+				}
+				
+				.inp{
+					width: calc(100% - 176rpx);
+					height: 100%;
+					input,textarea{
+						width: 100%;
+						height: 100%;
+						border: none;
+						outline: none;
+						font-family: PingFangSC, PingFang SC;
+						font-weight: 400;
+						font-size: 26rpx;
+						color: #666666;
+						line-height: 37rpx;
+						&::placeholder{
+							color: #CCCCCC;
+						}
+					}
+				}
+			}
+		}
+	
+		.apply{
+			width: calc(100% - 80rpx);
+			height: 80rpx;
+			background: #1460CA;
+			border-radius: 12rpx;
+			margin: 194rpx 40rpx 0;
+			text-align: center;
+			line-height: 80rpx;
+			font-family: PingFang-SC, PingFang-SC;
+			font-weight: bold;
+			font-size: 32rpx;
+			color: #FFFFFF;
+			letter-spacing: 2rpx;
+		}
+	}
+</style>