294 lines
7.6 KiB
Vue
294 lines
7.6 KiB
Vue
<template>
|
||
<view class="box fromClass">
|
||
<view class="lanBox">
|
||
<view class="lan border-bottom">
|
||
<view class="left">公司名称<text class="redcolor">*</text></view>
|
||
<view class="right">
|
||
<input name="name" type="text" v-model="userInfo.name" placeholder="公司名称" />
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">公司所在地区<text class="redcolor">*</text></view>
|
||
<view class="right">
|
||
<pickRegions @getRegion="handleGetRegion" class="regions" :isArea="true">
|
||
<view class="city" v-if="userInfo.province">
|
||
{{userInfo.province}}{{userInfo.city}}{{userInfo.area}}
|
||
</view>
|
||
<view v-else>请选择省/市/区</view>
|
||
<uni-icons type="forward" size="20" color="#999"></uni-icons>
|
||
</pickRegions>
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">详细地址<text class="redcolor">*</text></view>
|
||
<view class="right">
|
||
<input name="name" type="text" v-model="userInfo.address" placeholder="单元楼栋" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="lan border-bottom">
|
||
<view class="left">公司职位<text class="redcolor">*</text></view>
|
||
<view class="right">
|
||
<input name="name" type="text" v-model="userInfo.pos" placeholder="公司职位" />
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">公司logo</view>
|
||
<view class="right logo" v-if="userInfo.logourl">
|
||
<image :src="userInfo.logourl" class="headimage" mode="aspectFit" @click="handleimage(1)" />
|
||
<uni-icons type="close" size="26" class="uni-icons" @click="userInfo.logourl=''"
|
||
@click.stop></uni-icons>
|
||
</view>
|
||
<view class="right logo size20 bold" v-else @click="handleimage(1)">+</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">公司电话<text class="redcolor">*</text></view>
|
||
<view class="right">
|
||
<input name="name" type="text" v-model="userInfo.mobile" placeholder="请输入" />
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">企业年营收（万元）</view>
|
||
<view class="right">
|
||
<input name="name" type="digit" v-model="userInfo.yearlyincome" placeholder="请输入" />
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">企业年税收（万元）</view>
|
||
<view class="right">
|
||
<input name="name" type="digit" v-model="userInfo.yearlytax" placeholder="请输入" />
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">员工人数(人)</view>
|
||
<view class="right">
|
||
<input name="name" type="number" v-model="userInfo.staffcnt" placeholder="请输入" />
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">企业介绍</view>
|
||
<view class="right textarea">
|
||
<textarea v-model="userInfo.desc" name="content" maxlength="-1"/>
|
||
</view>
|
||
</view>
|
||
<view class="lan border-bottom">
|
||
<view class="left">企业照片</view>
|
||
<view class="picsImg">
|
||
<view class="pics" v-for="(img,ind) in urlList" v-if="urlList.length">
|
||
<image :src="img" mode="aspectFill" @click="handleimage(2)" />
|
||
<uni-icons type="close" size="26" class="uni-icons" @click="handleDel(ind)"
|
||
@click.stop></uni-icons>
|
||
</view>
|
||
<view v-if="urlList.length<4" @click="handleimage(2)" class="right pics size20">+</view>
|
||
<text class="size12 c999 desc">最多可上传4张，大小不超过2M</text>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="btn" @click="confirmInfo">保存</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapState
|
||
} from "vuex";
|
||
import pickRegions from "@/uni_modules/pick-regions/pick-regions.vue"
|
||
export default {
|
||
data() {
|
||
return {
|
||
userInfo: {
|
||
address: "",
|
||
area: "",
|
||
city: "",
|
||
desc: "",
|
||
logo: "",
|
||
logourl: "",
|
||
mobile: "",
|
||
name: "",
|
||
pics: [],
|
||
pos: "",
|
||
province: "",
|
||
staffcnt: "",
|
||
yearlyincome: "",
|
||
yearlytax: ""
|
||
},
|
||
urlList: [],
|
||
pathList: [],
|
||
};
|
||
},
|
||
components: {
|
||
pickRegions
|
||
},
|
||
computed: {
|
||
...mapState(['user'])
|
||
},
|
||
onLoad() {
|
||
let url = []
|
||
let path = []
|
||
this.userInfo = this.user.cominfo ? this.user.cominfo : {}
|
||
if (this.user.cominfo && this.user.cominfo.pics.length) {
|
||
this.user.cominfo.pics.forEach(item => {
|
||
url.push(item.url)
|
||
path.push(item.path)
|
||
})
|
||
}
|
||
this.urlList = url
|
||
this.pathList = path
|
||
console.log("this.user", this.user)
|
||
},
|
||
methods: {
|
||
// 提交
|
||
confirmInfo() {
|
||
let that = this
|
||
if (!this.userInfo.name) {
|
||
this.$tools.msg("请输入公司名称")
|
||
return;
|
||
}
|
||
if (!this.userInfo.province) {
|
||
this.$tools.msg("请选择公司所在地")
|
||
return;
|
||
}
|
||
if (!this.userInfo.address) {
|
||
this.$tools.msg("请输入公司详细地址")
|
||
return;
|
||
}
|
||
if (!this.userInfo.pos) {
|
||
this.$tools.msg("请输入公司职位")
|
||
return;
|
||
}
|
||
// if (!this.userInfo.logourl) {
|
||
// this.$tools.msg("请上传公司logo")
|
||
// return;
|
||
// }
|
||
if (!this.userInfo.mobile) {
|
||
this.$tools.msg("请输入公司电话")
|
||
return;
|
||
}
|
||
this.userInfo.pics = this.pathList
|
||
console.log("提交", this.userInfo)
|
||
that.$model.getSubmitCom(this.userInfo).then(res => {
|
||
if (res.code == 0) {
|
||
that.$tools.msg("提交成功");
|
||
that.$store.dispatch("getUserInfo")
|
||
uni.navigateBack({
|
||
delta: 2
|
||
})
|
||
} else {
|
||
that.$tools.msg(res.message);
|
||
}
|
||
});
|
||
},
|
||
handleimage(ind) {
|
||
let that = this
|
||
let imgArr = []
|
||
uni.chooseImage({
|
||
count: ind == 1 ? 1 : 6, //默认9
|
||
sourceType: ['album', 'camera'], //从相册选择
|
||
success: function(res) {
|
||
uni.showLoading({
|
||
title: '识别中...'
|
||
})
|
||
imgArr.push(res.tempFilePaths)
|
||
imgArr.forEach(ele => {
|
||
ele.forEach(item => {
|
||
that.$model.getUpLoadimg({
|
||
uploadpath: item
|
||
}).then(ress => {
|
||
uni.hideLoading()
|
||
if (ress.code == 0) {
|
||
if (ind == 1) { //公司logo
|
||
that.userInfo.logo = ress.data.path
|
||
that.userInfo.logourl = ress.data.url
|
||
} else { //企业照片
|
||
that.urlList.push(ress.data.url)
|
||
that.pathList.push(ress.data.path)
|
||
}
|
||
} else {
|
||
that.$tools.msg("不支持该图像")
|
||
}
|
||
})
|
||
})
|
||
})
|
||
}
|
||
})
|
||
},
|
||
handleDel(ind) {
|
||
let that = this
|
||
that.urlList.splice(ind, 1)
|
||
that.pathList.splice(ind, 1)
|
||
},
|
||
handleGetRegion(ite) {
|
||
console.log("省市区", ite)
|
||
this.userInfo.province = ite[0].name
|
||
this.userInfo.city = ite[1].name
|
||
this.userInfo.area = ite[2].name
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped="scoped" lang="scss">
|
||
.right {
|
||
|
||
/deep/picker,
|
||
.regions {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
.logo {
|
||
width: 145px !important;
|
||
height: 52px !important;
|
||
padding: 10px !important;
|
||
justify-content: center;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
uni-icons {
|
||
background: #fff;
|
||
border-radius: 50%;
|
||
top: -15px !important;
|
||
font-size: inherit !important;
|
||
}
|
||
}
|
||
|
||
.picsImg {
|
||
width: 100%;
|
||
height: auto;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.pics {
|
||
// width: 330rpx !important;
|
||
// height: 147rpx !important;
|
||
width: 208rpx !important;
|
||
height: 208rpx !important;
|
||
justify-content: center;
|
||
padding: 0 !important;
|
||
margin-top: 10px;
|
||
float: left;
|
||
border: 1px solid #dfdfdf;
|
||
border-radius: 5px;
|
||
position: relative;
|
||
|
||
.uni-icons {
|
||
background: #fff;
|
||
border-radius: 50%;
|
||
position: absolute;
|
||
right: 0;
|
||
top: -10px !important;
|
||
font-size: inherit !important;
|
||
}
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
</style> |