392 lines
8.5 KiB
Vue
392 lines
8.5 KiB
Vue
<template>
|
||
<view class="page">
|
||
<u-navbar title="商家合作" :border-bottom="false" :background="bgc" title-color='#fff' back-icon-color="#fff" title-size='36'
|
||
height='50'></u-navbar>
|
||
<image src="https://api.ccttiot.com/smartmeter/img/static/u22jKujzqJ82mSVfXhgG" class="bj" mode=""></image>
|
||
<view class="video">
|
||
<video src="https://api.ccttiot.com/smartmeter/img/static/ubSSfeAihTk6WgtvSbLL"></video>
|
||
</view>
|
||
<view class="box">
|
||
<view class="one">
|
||
<view class="name">
|
||
1.您已经有设备了吗？
|
||
</view>
|
||
<u-dropdown>
|
||
<u-dropdown-item v-model="value1" :title="txt1" @change="btnsb" :options="options1"></u-dropdown-item>
|
||
</u-dropdown>
|
||
</view>
|
||
<view class="one" style="margin-top: 48rpx;">
|
||
<view class="name">
|
||
2.你想做的经营模式是？
|
||
</view>
|
||
<u-dropdown>
|
||
<u-dropdown-item v-model="value2" :title="txt2" @change="btnjy" :options="options2"></u-dropdown-item>
|
||
</u-dropdown>
|
||
</view>
|
||
<view class="one" style="margin-top: 48rpx;">
|
||
<view class="name">
|
||
3.你打算将设备投放到哪里？
|
||
</view>
|
||
<u-checkbox-group @change="checkboxGroupChange">
|
||
<u-checkbox
|
||
@change="checkboxChange"
|
||
v-model="item.checked"
|
||
v-for="(item, index) in list" shape="circle" :key="index"
|
||
:name="item.name"
|
||
>{{item.name}}</u-checkbox>
|
||
</u-checkbox-group>
|
||
</view>
|
||
<view class="one" style="margin-top: 48rpx;">
|
||
<view class="name">
|
||
4.您的姓名
|
||
</view>
|
||
<input type="text" v-model="name" placeholder="请输入您的真实姓名"/>
|
||
</view>
|
||
<view class="one" style="margin-top: 48rpx;">
|
||
<view class="name">
|
||
5.您的联系方式
|
||
</view>
|
||
<input type="text" v-model="tel" placeholder="请输入您的手机号"/>
|
||
</view>
|
||
<view class="one" style="margin-top: 48rpx;">
|
||
<view class="name">
|
||
6.您想了解的消息
|
||
</view>
|
||
<input type="text" v-model="xiaoxi" placeholder="请输入您想知道的消息"/>
|
||
</view>
|
||
</view>
|
||
<view class="bot">
|
||
<view class="wz">
|
||
请输入您的真实有效信息，我们将在第一时间联系您
|
||
</view>
|
||
<view class="anniu" @click="btnjiameng">
|
||
马上加盟 立即赚钱
|
||
</view>
|
||
</view>
|
||
<image style="margin-top: 30rpx;width: 750rpx;height: 4100rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uPu2TqvZV8RElX42HYp1" mode=""></image>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
bgc: {
|
||
backgroundColor: "#D9DAF5",
|
||
},
|
||
txt1:'请选择有无设备',
|
||
value1: '',
|
||
options1: [{
|
||
label: '已有设备，想合作',
|
||
value: 1,
|
||
},
|
||
{
|
||
label: '没有设备,打算开始',
|
||
value: 2,
|
||
}
|
||
],
|
||
txt2:'请选择经营模式',
|
||
value2: '',
|
||
options2: [{
|
||
label: '个体经营',
|
||
value: 1,
|
||
},
|
||
{
|
||
label: '企业经营',
|
||
value: 2,
|
||
},{
|
||
label: '政府经营',
|
||
value: 3,
|
||
},{
|
||
label: '机构经营',
|
||
value: 4,
|
||
}
|
||
],
|
||
list: [
|
||
{
|
||
name: '麻将房',
|
||
checked: false,
|
||
disabled: false
|
||
},
|
||
{
|
||
name: '棋牌室',
|
||
checked: false,
|
||
disabled: false
|
||
},
|
||
{
|
||
name: '台球桌',
|
||
checked: false,
|
||
disabled: false
|
||
},{
|
||
name: '加水器',
|
||
checked: false,
|
||
disabled: false
|
||
},
|
||
{
|
||
name: '按摩椅',
|
||
checked: false,
|
||
disabled: false
|
||
},{
|
||
name: '洗衣机',
|
||
checked: false,
|
||
disabled: false
|
||
},
|
||
{
|
||
name: '卡丁车',
|
||
checked: false,
|
||
disabled: false
|
||
},
|
||
{
|
||
name: '充电桩',
|
||
checked: false,
|
||
disabled: false
|
||
},{
|
||
name: '其他',
|
||
checked: false,
|
||
disabled: false
|
||
}
|
||
],
|
||
name:'',
|
||
tel:'',
|
||
xiaoxi:'',
|
||
toufanglist:[]
|
||
}
|
||
},
|
||
// 分享到好友（会话）
|
||
onShareAppMessage: function () {
|
||
return {
|
||
title: '创想物联',
|
||
path: '/pages/shouye/index'
|
||
}
|
||
},
|
||
|
||
// 分享到朋友圈
|
||
onShareTimeline: function () {
|
||
return {
|
||
title: '创想物联',
|
||
query: '',
|
||
path: '/pages/shouye/index'
|
||
}
|
||
},
|
||
onShow() {
|
||
this.getuserinfo()
|
||
},
|
||
methods: {
|
||
// 点击加盟
|
||
btnjiameng(){
|
||
if(this.value1 == ''){
|
||
uni.showToast({
|
||
title: '请选择有无设备',
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}else if(this.value2 == ''){
|
||
uni.showToast({
|
||
title: '请选择经营模式',
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}else if(this.toufanglist.length == 0){
|
||
uni.showToast({
|
||
title: '请勾选投放哪里',
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}else if(this.name == ''){
|
||
uni.showToast({
|
||
title: '请输入您的姓名',
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}else if(this.tel == ''){
|
||
uni.showToast({
|
||
title: '请输入您的手机号',
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}else if(this.xiaoxi == ''){
|
||
uni.showToast({
|
||
title: '请输入您想知道的消息',
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}else{
|
||
let flag = ''
|
||
if(this.value1 == 2){
|
||
flag = false
|
||
}else if(this.value1 == 1){
|
||
flag = true
|
||
}
|
||
let data = {
|
||
name:this.name,
|
||
mobile:this.tel,
|
||
content:this.xiaoxi,
|
||
hasDevice:flag,
|
||
operateMode:this.value2,
|
||
scenes:this.toufanglist
|
||
}
|
||
console.log(data);
|
||
this.$u.post(`/app/mchApply/submit`,data).then(res =>{
|
||
if(res.code == 200){
|
||
uni.showToast({
|
||
title: '申请成功',
|
||
icon: 'success',
|
||
duration:2000
|
||
})
|
||
// setTimeout(()=>{
|
||
// uni.reLaunch({
|
||
// url:'/pages/shouye/index'
|
||
// })
|
||
// },2000)
|
||
}else{
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none',
|
||
duration:2000
|
||
})
|
||
}
|
||
})
|
||
}
|
||
},
|
||
|
||
// 选择使用场景
|
||
checkboxChange(e) {
|
||
//console.log(e);
|
||
},
|
||
// 选中任一checkbox时，由checkbox-group触发
|
||
checkboxGroupChange(e) {
|
||
console.log(e);
|
||
this.toufanglist = e
|
||
},
|
||
// 选择经营模式
|
||
btnjy(){
|
||
this.txt2 = this.options2[this.value2 - 1].label
|
||
},
|
||
// 选择是否拥有设备
|
||
btnsb(){
|
||
console.log(this.value1);
|
||
this.txt1 = this.options1[this.value1 - 1].label
|
||
},
|
||
// 获取个人信息
|
||
getuserinfo() {
|
||
this.$u.get("/app/user/userInfo").then((res) => {
|
||
if (res.code == 200) {
|
||
|
||
} else {
|
||
uni.navigateTo({
|
||
url:'/pages/login/login'
|
||
})
|
||
}
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.bj{
|
||
width: 100%;
|
||
height: 100vh;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: -1;
|
||
}
|
||
/deep/ .u-dropdown__content__mask{
|
||
background: transparent !important;
|
||
}
|
||
/deep/ .u-title{
|
||
padding-bottom: 22rpx;
|
||
}
|
||
/deep/ .uicon-nav-back{
|
||
padding-bottom: 22rpx;
|
||
}
|
||
/deep/ .u-dropdown__menu{
|
||
z-index: 0 !important;
|
||
}
|
||
/deep/ .u-dropdown__menu__item{
|
||
background-color: #f0f0f0;
|
||
border-radius: 10rpx;
|
||
justify-content: end !important;
|
||
padding: 0 48rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
/deep/ .u-dropdown__menu__item__text{
|
||
width: 500rpx;
|
||
}
|
||
/deep/ .u-checkbox__icon-wrap--checked{
|
||
background-color: rgb(150,149,242) !important;
|
||
border-color: rgb(150,149,242) !important;
|
||
}
|
||
/deep/ .u-checkbox{
|
||
margin-right: 30rpx;
|
||
}
|
||
.bot{
|
||
margin: auto;
|
||
margin-top: 60rpx;
|
||
.wz{
|
||
width: 100%;
|
||
text-align: center;
|
||
font-size: 28rpx;
|
||
color: #3731BE;
|
||
}
|
||
.anniu{
|
||
width: 676rpx;
|
||
height: 101rpx;
|
||
background: #A3A0FF;
|
||
border-radius: 54rpx 54rpx 54rpx 54rpx;
|
||
line-height: 101rpx;
|
||
font-weight: 500;
|
||
font-size: 40rpx;
|
||
color: #FFFFFF;
|
||
margin: auto;
|
||
margin-top: 20rpx;
|
||
text-align: center;
|
||
}
|
||
}
|
||
.box{
|
||
width: 694rpx;
|
||
max-height: 1462rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||
margin: auto;
|
||
margin-top: 30rpx;
|
||
padding: 44rpx 36rpx;
|
||
box-sizing: border-box;
|
||
.one{
|
||
.name{
|
||
font-weight: 600;
|
||
font-size: 34rpx;
|
||
color: #3D3D3D;
|
||
margin-bottom: 32rpx;
|
||
}
|
||
input{
|
||
width: 626rpx;
|
||
height: 90rpx;
|
||
background: #F0F0F0;
|
||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||
line-height: 90rpx;
|
||
padding-left: 48rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
}
|
||
}
|
||
.video{
|
||
width: 694rpx;
|
||
height: 390rpx;
|
||
margin: auto;
|
||
border-radius: 20rpx;
|
||
overflow: hidden;
|
||
video{
|
||
width: 694rpx;
|
||
height: 390rpx;
|
||
}
|
||
}
|
||
page {
|
||
background: #D9DAF5;
|
||
max-height: 200vh;
|
||
overflow: scroll;
|
||
padding-bottom: 60rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
</style> |