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.
400 lines
10 KiB
400 lines
10 KiB
<template> |
|
<!--pages/release/perfectCompanyInfo/index.wxml--> |
|
<view class="perfect-companyInfo-page"> |
|
<view class="title acea-row row-middle"> 企业简介 </view> |
|
<view class="form-box"> |
|
<form @submit="submit"> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>企业地址<text class="red">*</text></view> |
|
<!-- <view class="chose">去选择地址</view> --> |
|
<button @tap="showMap" class="chose">去选择地址</button> |
|
</view> |
|
<view class="inp-box"> |
|
<input type="text" placeholder="企业详细地址" name="enterpriseAddress" :value="form.enterpriseAddress"> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>企业logo<text class="red">*</text></view> |
|
</view> |
|
<view class="upload-box"> |
|
<image src="/static/images/upload.png" v-if="form.enterpriseLogo == ''" @tap="uploadImg" data-type="logo"></image> |
|
<image :src="form.enterpriseLogo" v-else @tap="uploadImg" data-type="logo" mode="aspectFill"></image> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>企业slogan<text class="red">*</text></view> |
|
</view> |
|
<view class="inp-box"> |
|
<input type="text" placeholder="企业slogan" name="enterpriseTitle" :value="form.enterpriseTitle"> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>企业经营范围<text class="red">*</text></view> |
|
</view> |
|
<view class="inp-box"> |
|
<input type="text" placeholder="请填写企业经营范围" :value="form.businessNature" name="businessNature"> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>企业网站<text class="red">*</text></view> |
|
</view> |
|
<view class="inp-box"> |
|
<input type="text" placeholder="https://*******" :value="form.enterpriseNet" name="enterpriseNet"> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>客服电话<text class="red">*</text></view> |
|
</view> |
|
<view class="inp-box"> |
|
<input type="text" placeholder="客服电话" :value="form.enterprisePhone" name="enterprisePhone"> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>关于我们</view> |
|
</view> |
|
<view class="textarea-box"> |
|
<textarea :value="form.resourceIntroduction" name="resourceIntroduction"></textarea> |
|
</view> |
|
</view> |
|
<view class="form-item"> |
|
<view class="label-box acea-row row-between-wrapper"> |
|
<view>公司展示</view> |
|
</view> |
|
<view class="upload-box acea-row"> |
|
<view v-for="(item, index) in form.imgPaths" :key="index" class="img-box"> |
|
<image :src="item"></image> |
|
<view class="del" @tap="delImg" :data-idx="index"><image src="/static/images/del.png"></image></view> |
|
</view> |
|
<image src="/static/images/upload.png" @tap="upImgs"></image> |
|
</view> |
|
</view> |
|
<button form-type="submit" class="submit-btn">保存并提交</button> |
|
<!-- <view class="submit-btn" bindtap="submit">保存并提交</view> --> |
|
</form> |
|
</view> |
|
|
|
|
|
</view> |
|
</template> |
|
|
|
<script> |
|
// pages/release/perfectCompanyInfo/index.js |
|
const util = require("../../../utils/util.js"); |
|
const app = getApp(); |
|
import WxValidate from '../../../utils/WxValidate.js'; |
|
|
|
export default { |
|
data() { |
|
return { |
|
form: { |
|
enterpriseType: 1, |
|
enterpriseAddress: '', |
|
businessNature: '', |
|
latitude: '', |
|
longitude: '', |
|
enterpriseLogo: '', |
|
enterpriseTitle: '', |
|
enterpriseLabel: '', |
|
enterpriseNet: '', |
|
enterprisePhone: '', |
|
resourceIntroduction: '', |
|
imgPaths: [] |
|
} |
|
}; |
|
}, |
|
|
|
components: {}, |
|
props: {}, |
|
|
|
/** |
|
* 生命周期函数--监听页面加载 |
|
*/ |
|
onLoad: function (options) { |
|
this.initValidate(); //验证规则函数 |
|
|
|
console.log(options); |
|
|
|
if (options.isEdit) { |
|
this.getEnterpriseInfo(); |
|
} |
|
}, |
|
methods: { |
|
//获取详情 |
|
getEnterpriseInfo() { |
|
app.http('GET', 'Enterprise/getEnterpriseInfo').then(res => { |
|
if (res.data.success) { |
|
let data = res.data.data; |
|
this.form.imgPaths = data.imgPaths; |
|
this.form.resourceIntroduction = data.resourceIntroduction; |
|
this.form.enterprisePhone = data.enterprisePhone; |
|
this.form.enterpriseNet = data.enterpriseNet; |
|
this.form.enterpriseLabel = data.enterpriseLabel; |
|
this.form.enterpriseTitle = data.enterpriseTitle; |
|
this.form.enterpriseLogo = data.enterpriseLogo; |
|
this.form.longitude = data.longitude; |
|
this.form.latitude = data.latitude; |
|
this.form.businessNature = data.businessNature; |
|
this.form.enterpriseAddress = data.enterpriseAddress; |
|
} |
|
}); |
|
}, |
|
|
|
initValidate() { |
|
const rules = { |
|
enterpriseAddress: { |
|
required: true |
|
}, |
|
enterpriseLogo: { |
|
required: true |
|
}, |
|
enterpriseTitle: { |
|
required: true |
|
}, |
|
businessNature: { |
|
required: true |
|
}, |
|
enterpriseNet: { |
|
required: true |
|
}, |
|
enterprisePhone: { |
|
required: true |
|
} |
|
}; |
|
const messages = { |
|
enterpriseAddress: { |
|
required: '请选择或填写地址' |
|
}, |
|
enterpriseLogo: { |
|
required: '请上传企业Logo' |
|
}, |
|
enterpriseTitle: { |
|
required: '请填写企业slogan' |
|
}, |
|
businessNature: { |
|
required: '请填写企业经营范围' |
|
}, |
|
enterpriseNet: { |
|
required: '请填写企业网站' |
|
}, |
|
enterprisePhone: { |
|
required: '请填写客服电话' |
|
} |
|
}; |
|
this.WxValidate = new WxValidate(rules, messages); |
|
}, |
|
|
|
showMap() { |
|
let that = this; |
|
uni.getLocation({ |
|
type: 'gcj02', |
|
//返回可以用于wx.openLocation的经纬度 |
|
success: function (res) { |
|
uni.chooseLocation({ |
|
latitude: res.latitude, |
|
longitude: res.longitude, |
|
scale: 28, |
|
success: result => { |
|
that.form.longitude = result.longitude; |
|
that.form.latitude = result.latitude; |
|
that.form.enterpriseAddress = result.address; |
|
} |
|
}); |
|
} |
|
}); |
|
}, |
|
|
|
uploadImg(e) { |
|
let type = e.currentTarget.dataset.type; |
|
util.chooseImages(img => { |
|
if (type == 'logo') { |
|
this.form.enterpriseLogo = img; |
|
} |
|
}); |
|
}, |
|
|
|
upImgs() { |
|
util.chooseImages2(img => { |
|
let imgs = this.form.imgPaths; |
|
imgs.push(img); |
|
this.form.imgPaths = imgs; |
|
}); |
|
}, |
|
|
|
delImg(e) { |
|
let idx = e.currentTarget.dataset.idx; |
|
let imgPaths = this.form.imgPaths; |
|
imgPaths.splice(idx, 1); |
|
this.form.imgPaths = imgPaths; |
|
}, |
|
|
|
submit(e) { |
|
let that = this; |
|
console.log(e.detail.value); |
|
uni.showModal({ |
|
title: '提示！', |
|
content: '是否确认提交？', |
|
|
|
success(res) { |
|
if (res.confirm) { |
|
const params = e.detail.value; |
|
params.enterpriseType = 1; |
|
params.latitude = that.form.latitude; |
|
params.longitude = that.form.longitude; |
|
params.enterpriseLogo = that.form.enterpriseLogo; |
|
params.imgPaths = that.form.imgPaths; |
|
|
|
if (!that.WxValidate.checkForm(params)) { |
|
const error = that.WxValidate.errorList[0]; |
|
that.showModal(error); |
|
return false; |
|
} |
|
|
|
app.http('post', 'Enterprise/completeEnterprise', params).then(res => { |
|
if (res.data.success) { |
|
uni.showToast({ |
|
title: '提交成功', |
|
duration: 2000 |
|
}); |
|
setTimeout(() => { |
|
uni.navigateBack({ |
|
delta: 1 |
|
}); |
|
}, 2000); |
|
} |
|
}); |
|
} else { |
|
console.log('已取消'); |
|
} |
|
} |
|
|
|
}); |
|
}, |
|
|
|
showModal(error) { |
|
uni.showModal({ |
|
content: error.msg, |
|
showCancel: false |
|
}); |
|
} |
|
|
|
} |
|
}; |
|
</script> |
|
<style> |
|
/* pages/release/perfectCompanyInfo/index.wxss */ |
|
.perfect-companyInfo-page{ |
|
width: 100%; |
|
padding: 24rpx 40rpx; |
|
border-top: 2rpx solid #EEEEEE; |
|
} |
|
.title{ |
|
color: #1D1D1D; |
|
font-size: 32rpx; |
|
} |
|
.title::before{ |
|
content: ''; |
|
display: inline-block; |
|
width: 8rpx; |
|
height: 42rpx; |
|
background: #FF7942; |
|
border-radius: 4rpx; |
|
margin-right: 10rpx; |
|
} |
|
.form-box{ |
|
font-size: 28rpx; |
|
color: #666666; |
|
} |
|
.form-item{ |
|
margin-top: 22rpx; |
|
} |
|
.chose{ |
|
padding: 0 !important; |
|
margin: 0 !important; |
|
width: auto !important; |
|
background: #fff; |
|
font-size: 26rpx; |
|
color: #666; |
|
font-weight: normal; |
|
} |
|
.chose::after{ |
|
border: none; |
|
} |
|
.red{ |
|
color: #FF0000; |
|
} |
|
.inp-box{ |
|
width: 100%; |
|
height: 60rpx; |
|
background: #EEEEEE; |
|
border-radius: 4rpx; |
|
padding-left: 22rpx; |
|
margin-top: 20rpx; |
|
} |
|
.inp-box input{ |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.upload-box{ |
|
width: 100%; |
|
margin-top: 20rpx; |
|
padding-bottom: 24rpx; |
|
border-bottom: 2rpx solid #EEEEEE; |
|
} |
|
.upload-box image{ |
|
width: 120rpx; |
|
height: 120rpx; |
|
margin-right: 20rpx; |
|
} |
|
.img-box{ |
|
width: 120rpx; |
|
height: 120rpx; |
|
position: relative; |
|
margin-right: 14rpx; |
|
margin-bottom: 20rpx; |
|
border-radius: 8rpx; |
|
} |
|
.img-box .del{ |
|
width: 32rpx; |
|
height: 32rpx; |
|
position: absolute; |
|
top: -16rpx; |
|
right: -12rpx; |
|
font-weight: bold; |
|
} |
|
.del image{ |
|
width: 100%; |
|
height: 100%; |
|
} |
|
.textarea-box{ |
|
width: 100%; |
|
height: 352rpx; |
|
background: #EEEEEE; |
|
border-radius: 4rpx; |
|
padding: 22rpx; |
|
margin-top: 20rpx; |
|
} |
|
.textarea-box textarea{ |
|
width: 100%; |
|
height: 100%; |
|
line-height: 40rpx; |
|
} |
|
.submit-btn{ |
|
width: 670rpx !important; |
|
height: 76rpx !important; |
|
background: linear-gradient(144deg, #FFA782 0%, #FF5100 100%); |
|
border-radius: 38rpx; |
|
color: #fff; |
|
font-size: 28rpx !important; |
|
line-height: 76rpx !important; |
|
text-align: center; |
|
margin:40rpx auto !important; |
|
padding: 0 !important; |
|
} |
|
</style> |