You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
192 lines
4.2 KiB
192 lines
4.2 KiB
<template> |
|
<image class="topimg" mode="widthFix" src="../../static/logo1.png"></image> |
|
<view class="maxbox"> |
|
<view class="xianbox"> |
|
<view class="titl">项目类型</view> |
|
<picker @change="xzlx" range-key="name" :range="list"> |
|
<view class="input">{{xzlistval==-1?'请选择项目类型':list[xzlistval]}}</view> |
|
</picker> |
|
<view class="titl">总建筑面积</view> |
|
<view class="shurukbox"> |
|
<input v-model="area" placeholder="请输入总建筑面积(平米)"/> |
|
</view> |
|
<view class="titl">联系方式</view> |
|
<view class="shurukbox"> |
|
<input v-model="phone" placeholder="请输入您的手机号"/> |
|
</view> |
|
<view class="titl">验证码</view> |
|
<view class="shurukbox"> |
|
<input v-model="code" placeholder="请输入验证码"/> |
|
<view @click="huoqu">{{hqyzm}}</view> |
|
</view> |
|
<view class="xian"></view> |
|
<view class="wtyx" @click="fasonwt">发送委托意向</view> |
|
<view class="tis">提示：请确认您发布的是非测试项目,提交后项目经理会致电给您确认项目信息。</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import { getconfig,sendcode,consultingservice } from '@/api/user.js' |
|
import { reactive, toRefs } from "vue" |
|
export default { |
|
setup(){ |
|
let details=reactive({ |
|
list:[], |
|
xzlistval:-1, |
|
hqyzm:'获取验证码', |
|
area:'', |
|
phone:'', |
|
code:'' |
|
}) |
|
getconfig({config:'projectType'}).then(res=>{ |
|
console.log(res.data); |
|
details.list=res.data |
|
}) |
|
function xzlx(e){ |
|
details.xzlistval=e.detail.value |
|
} |
|
function huoqu(){ |
|
let test=/^1[3-9][0-9]{9}$/ |
|
if(!test.test(details.phone)){ |
|
uni.showToast({ |
|
title:'请正确输入手机号', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
sendcode({phone:details.phone}).then(res=>{ |
|
if(res.code==200){ |
|
details.hqyzm=60 |
|
let daojs=setInterval(()=>{ |
|
if(details.hqyzm==0){ |
|
details.hqyzm='获取验证码' |
|
clearInterval(daojs) |
|
return |
|
} |
|
details.hqyzm-- |
|
},1000) |
|
} |
|
}) |
|
} |
|
function fasonwt(){ |
|
if(details.area==''||details.xzlistval==-1||details.code==''){ |
|
uni.showToast({ |
|
title:'请确认已经全部填写完成', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
let test=/^1[3-9][0-9]{9}$/ |
|
if(!test.test(details.phone)){ |
|
uni.showToast({ |
|
title:'请正确输入手机号', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
let data={ |
|
phone:details.phone, |
|
area:details.area, |
|
project_type:details.list[details.xzlistval], |
|
code:details.code |
|
} |
|
consultingservice(data).then(res=>{ |
|
if(res.code==200){ |
|
uni.showToast({ |
|
title:'提交成功', |
|
icon:'none' |
|
}) |
|
}else{ |
|
uni.showToast({ |
|
title:res.msg, |
|
icon:'none' |
|
}) |
|
} |
|
}) |
|
} |
|
return { |
|
fasonwt, |
|
huoqu, |
|
xzlx, |
|
...toRefs(details) |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
// page{ |
|
// background-color: #c1c1c1; |
|
// } |
|
.tis{ |
|
padding: 30upx; |
|
color: #666; |
|
font-size: 24upx; |
|
} |
|
.xian{ |
|
width: 680upx; |
|
height: 1upx; |
|
// background-color:rgba(0,0,0,0.1); |
|
margin-top: 20upx; |
|
margin-bottom: 50upx; |
|
} |
|
.wtyx{ |
|
width: 560upx; |
|
padding: 20upx; |
|
box-sizing: border-box; |
|
margin: auto; |
|
text-align: center; |
|
background-color: #F06746; |
|
margin-top: 20upx; |
|
color: #ffffff; |
|
border-radius: 10upx; |
|
} |
|
.topimg{ |
|
width: 100%; |
|
} |
|
.maxbox{ |
|
width: 100%; |
|
height: 600upx; |
|
background-image: url('../../static/beijin.png'); |
|
background-repeat: no-repeat; |
|
background-size: 100% 100%; |
|
padding-top: 300upx; |
|
} |
|
.xianbox{ |
|
width: 680upx; |
|
// padding: 30upx; |
|
box-sizing: border-box; |
|
background-color: #ffffff; |
|
margin: auto; |
|
border-radius: 20upx; |
|
// margin-top: 100upx; |
|
padding-bottom: 20upx; |
|
>.titl{ |
|
font-size: 32upx; |
|
// margin-bottom: 40upx; |
|
padding:30upx 30upx; |
|
padding-bottom: 15upx; |
|
} |
|
.input{ |
|
font-size: 29upx; |
|
padding:20upx 30upx; |
|
padding-bottom: 15upx; |
|
} |
|
>.shurukbox{ |
|
padding: 20upx 30upx; |
|
padding-bottom: 15upx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: space-between; |
|
>input{ |
|
flex: 1; |
|
} |
|
>view{ |
|
color: #DC4732; |
|
font-size: 30upx; |
|
font-weight: bold; |
|
} |
|
} |
|
} |
|
</style>
|
|
|