intelligentGroup/pageTwo/login/add.vue

391 lines
10 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="box fromClass">
<view class="lanBox">
<view class="lan border-bottom">
<view class="left">所属行业</view>
<view class="right">
<picker mode="selector" :range="industrylist" range-key="name" :value="content.industryname"
@change="changeIndustry">
<view class="uni-input">{{content.industryname?content.industryname:"请选择"}}</view>
<uni-icons type="forward" size="20" color="#999"></uni-icons>
</picker>
</view>
</view>
<view class="lan border-bottom">
<view class="left">姓名</view>
<view class="right">
<input name="name" type="text" v-model="content.name" placeholder="姓名" />
</view>
</view>
<view class="lan border-bottom">
<view class="left">手机号</view>
<view class="right">
<input name="name" type="text" v-model="content.phone" placeholder="手机号" />
</view>
</view>
<view class="lan border-bottom">
<view class="left">个人照片</view>
<view class="right touxiang" v-if="content.avatar">
<image :src="content.avatarurl" mode="aspectFit" @click="handleimage(1)" />
<uni-icons type="close" size="22" class="uni-icons" @click="content.avatarurl='',content.avatar=''"
@click.stop></uni-icons>
</view>
<view class="right touxiang size20 bold" v-else @click="handleimage(1)">+</view>
<text class="size12 c999 desc">请上传1寸蓝底照片大小不超过2M</text>
</view>
<view class="lan border-bottom">
<view class="left">性别</view>
<view class="right">
<picker mode="selector" :range="sexItem" @change="onsexArr">
<view class="uni-input">{{content.sex==0?'请选择':content.sex==1?'男':'女'}}</view>
<uni-icons type="forward" size="20" color="#999"></uni-icons>
</picker>
</view>
</view>
<view class="lan border-bottom">
<view class="left">出生年月</view>
<view class="right">
<picker class="picker" mode="date" :end="endDate" :value="birthday" @change="bindDateChange">
<view class="uni-input">{{content.birthday?content.birthday:"请选择"}}</view>
<uni-icons type="forward" size="20" color="#999"></uni-icons>
</picker>
</view>
</view>
<view class="lan border-bottom">
<view class="left">企业全称</view>
<view class="right">
<input name="name" type="text" v-model="content.comName" placeholder="企业全称" />
</view>
</view>
<view class="lan border-bottom">
<view class="left">公司职位</view>
<view class="right">
<input name="name" type="text" v-model="content.comPos" placeholder="公司职位" />
</view>
</view>
<view class="lan border-bottom">
<view class="left">营业执照</view>
<view class="right zhizhao" v-if="content.license">
<image :src="content.licenseurl" class="headimage" @click="handleimage(2)" mode="aspectFit" />
<uni-icons type="close" size="22" class="uni-icons"
@click="content.licenseurl='',content.license=''" @click.stop></uni-icons>
</view>
<view class="right zhizhao size20 bold" v-else @click="handleimage(2)">+</view>
<text class="size12 c999 desc">点击上传企业营业执照,仅用于资质审核</text>
</view>
<view class="lan border-bottom">
<view class="left">通过什么途径了解智造团?</view>
<view class="radio">
<label @click="radioChange('抖音')">
<icon class="iconfont radioimg"
:class="[source=='抖音'?'icon-yuanxingxuanzhongfill':'icon-yuanxingweixuanzhong']">
</icon>
抖 音
</label>
<label @click="radioChange('朋友圈')">
<icon class="iconfont radioimg"
:class="[source=='朋友圈'?'icon-yuanxingxuanzhongfill':'icon-yuanxingweixuanzhong']">
</icon>
朋友圈
</label>
<label>
<view @click="radioChange('介绍人')">
<icon class="iconfont radioimg"
:class="[source=='介绍人'?'icon-yuanxingxuanzhongfill':'icon-yuanxingweixuanzhong']">
</icon>
介绍人
</view>
<input type="text" v-model="sourceName" />
</label>
</view>
</view>
<view class="lan border-bottom">
<view class="left">加入智照团想收获什么?</view>
<checkbox-group @change="checkboxChange" class="checkbox">
<label>
<checkbox value="找客户资源" style="transform:scale(0.8)" />找客户资源
</label>
<label>
<checkbox value="扩大人脉圈子" style="transform:scale(0.8)" />扩大人脉圈子
</label>
<label>
<checkbox value="能力提升" style="transform:scale(0.8)" />能力提升
</label>
<label>
<checkbox value="为企业做品牌宣传" style="transform:scale(0.8)" />为企业做品牌宣传
</label>
<label>
<checkbox value="直播" style="transform:scale(0.8)" />直播
</label>
<label>
<checkbox value="个人IP打造" style="transform:scale(0.8)" />个人IP打造
</label>
<label>
<checkbox value="拍摄剪辑" style="transform:scale(0.8)" />拍摄剪辑
</label>
<label>
<checkbox value="学习新媒体运营" style="transform:scale(0.8)" />学习新媒体运营
</label>
<label>
<checkbox value="老板思维" style="transform:scale(0.8)" />老板思维
</label>
<label>
<checkbox value="团队打造" style="transform:scale(0.8)" />团队打造
</label>
<label>
<checkbox value="销售话术" style="transform:scale(0.8)" />销售话术
</label>
<label>
<checkbox value="外贸平台搭建" style="transform:scale(0.8)" />外贸平台搭建
</label>
<label>
<checkbox value="其他" style="transform:scale(0.8)" />其他
</label>
</checkbox-group>
</view>
<view class="lan border-bottom">
<view class="left">能给平台带来什么?</view>
<view class="right textarea">
<textarea v-model="content.provide" name="content" maxlength="-1"/>
</view>
</view>
<view class="lan c999 size12 mt-15">
所有上传的资料信息同意公开展示,最终解释权归智造团平台所有。
</view>
</view>
<view class="btn" @click="confirmInfo">申请加入</view>
</view>
</template>
<script>
import {
mapState
} from "vuex";
export default {
data() {
return {
sexItem: [
"男",
"女"
],
source: "",
sourceName: "",
content: {
sex: "",
name: "",
name: "",
avatar: "",
avatarurl: "",
source: "",
birthday: "",
industryid: "",
industryname: "",
comName: "",
comPos: "",
provide: "",
demand: "",
license: "",
licenseurl: ""
}
};
},
computed: {
...mapState(["HomeContent"]),
endDate() {
return this.$tools.getDate("start")
},
industrylist() {
return this.HomeContent.industrylist
},
},
methods: {
// 提交
confirmInfo() {
let that = this
if (!this.content.industryname) {
this.$tools.msg("请选择所属行业")
return;
}
if (!this.content.name) {
this.$tools.msg("请输入姓名")
return;
}
if (!this.content.phone) {
this.$tools.msg("请输入手机号")
return;
}
if (!this.content.avatarurl) {
this.$tools.msg("请上传个人照片")
return;
}
if (!this.content.sex) {
this.$tools.msg("请选择性别")
return;
}
if (!this.content.birthday) {
this.$tools.msg("请选择出生日期")
return;
}
if (!this.content.comName) {
this.$tools.msg("请输入公司全称")
return;
}
if (!this.content.comPos) {
this.$tools.msg("请输入公司职位")
return;
}
if (this.source == '介绍人' && !this.sourceName) {
this.$tools.msg("请输入介绍人姓名")
return;
}
this.content.source = this.sourceName ? this.sourceName : this.source
console.log('content', this.content)
that.$model.getApplyfor(this.content).then(res => {
if (res.code == 0) {
uni.showToast({
title: "提交成功",
duration: 2000
});
setTimeout(function() {
uni.switchTab({
url: "/pages/index/index"
})
}, 2000)
} else {
that.$tools.msg(res.message);
}
});
},
handleimage(ind) {
let that = this
uni.chooseImage({
count: 1, //默认9
sourceType: ['album', 'camera'], //从相册选择
success: function(res) {
uni.showLoading({
title: '识别中...'
})
that.$model.getUpLoadimg({
uploadpath: res.tempFilePaths[0]
}).then(res => {
uni.hideLoading()
if (res.code == 0) {
if (ind == 1) {
that.content.avatar = res.data.path
that.content.avatarurl = res.data.url
} else {
that.content.license = res.data.path
that.content.licenseurl = res.data.url
}
} else {
that.$tools.msg("不支持该图像")
}
})
}
})
},
//确定年龄
bindDateChange(e) {
this.content.birthday = e.target.value
},
//确定性别
onsexArr(e) {
this.content.sex = this.sexItem[e.target.value] == "男" ? 1 : 2
},
// 所属行业
changeIndustry(e) {
this.content.industryname = this.HomeContent.industrylist[e.target.value].name
this.content.industryid = this.HomeContent.industrylist[e.target.value].id
},
// 途径
radioChange(e) {
this.source = this.source == e ? '' : e
this.sourceName = this.source == '介绍人' ? this.sourceName : '';
},
// 收获
checkboxChange(e) {
this.content.demand = e.detail.value.join(',')
},
},
onLoad(options) {},
};
</script>
<style scoped="scoped" lang="scss">
.zhizhao,
.touxiang {
justify-content: center;
image {
width: 100%;
height: 100%;
}
}
.lan {
margin: 0 10px !important;
}
.right {
/deep/input {
width: 100%;
}
}
.radio {
width: 100%;
height: 40px;
line-height: 40px;
display: flex;
justify-content: space-between;
align-items: center;
label {
display: flex;
}
icon {
color: #dfdfdf;
font-size: 22px;
margin-right: 5px;
}
.icon-yuanxingxuanzhongfill {
color: $uni-color-success;
}
:nth-child(3) {
width: 50%;
view {
width: 50%;
display: flex;
}
/deep/input {
width: 50% !important;
border-bottom: 1px solid #dfdfdf;
}
}
}
.checkbox {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
label {
width: 33%;
display: flex;
font-size: 12px;
margin: 5px 0;
align-items: center;
}
}
</style>