幼教产品B2B生态平台小程序端
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.
 
 
 
 

309 lines
9.2 KiB

<template>
<view class="page">
<view class="block">
<view class="form-list edit-form">
<view class="line with-arrow">
<view class="name">LOGO</view>
<image class="avatar" :src="form.logoUrl" @click="uploadLogo"></image>
</view>
<view class="line with-arrow">
<view class="name">{{ platformName }}名称</view>
<input type="text" :placeholder="'请输入' + platformName + '幼儿园名称'" v-model="form.classificationName" :disabled="info.authenticationStatus !== 0" />
</view>
<view v-if="info.platformSource === '6'" class="line with-arrow">
<view class="name">供应商分类</view>
<view class="inline">
<uni-data-picker class="picker-input" :clear-icon="false" placeholder="请选择供应商分类" popup-title="请选择供应商分类" preload :localdata="classifications" :map="{text: 'classificationName', value: 'id'}" v-model="classificationId"></uni-data-picker>
</view>
</view>
<view class="line textarea-line">
<view class="name">{{ platformName }}slogan</view>
<textarea :placeholder="'请输入' + platformName + 'slogan'" v-model="form.slogan"></textarea>
</view>
<view class="line with-arrow">
<view class="name">省份</view>
<view class="inline">
<uni-data-picker class="picker-input" :clear-icon="false" placeholder="请选择省份" popup-title="请选择省份" preload :localdata="provinces" :map="{text: 'provinceName', value: 'provinceName'}" v-model="form.province" @change="getCity"></uni-data-picker>
</view>
</view>
<view class="line with-arrow">
<view class="name">城市</view>
<view class="inline">
<uni-data-picker class="picker-input" :clear-icon="false" :readonly="!form.province" placeholder="请选择城市" popup-title="请选择城市" preload :localdata="cities" :map="{text: 'cityName', value: 'cityName'}" v-model="form.city"></uni-data-picker>
</view>
</view>
<view class="line textarea-line">
<view class="name">地址</view>
<textarea placeholder="请输入详细地址" v-model="form.address"></textarea>
</view>
<view class="line with-arrow">
<view class="name">联系电话</view>
<input type="text" placeholder="请输入联系电话" v-model="form.phone" />
</view>
<view class="line textarea-line no-bd">
<view class="name">{{ platformName }}简介</view>
<textarea :placeholder="'请输入' + platformName + '简介'" v-model="form.briefIntroduction"></textarea>
</view>
<view class="py">
<uni-file-picker v-model="desPics" limit="3" title="最多选择3张图片" :auto-upload="false" @select="uploadDes"></uni-file-picker>
</view>
</view>
</view>
<view class="block">
<view class="form-list edit-form">
<view class="line with-arrow no-bd">
<view class="name">二维码描述一</view>
<input type="text" placeholder="输入二维码描述一" v-model="form.qrCodeOneName" />
<uni-icons type="right" size="18" color="#ababab"></uni-icons>
</view>
<view class="py">
<uni-file-picker v-model="qrCodeOne" limit="1" title="上传二维码一" :auto-upload="false" @select="e => uploadQrcode(e, 'qrCodeOne')" ></uni-file-picker>
</view>
</view>
</view>
<view class="block">
<view class="form-list edit-form">
<view class="line with-arrow no-bd">
<view class="name">二维码描述二</view>
<input type="text" placeholder="输入二维码描述二" v-model="form.qrCodeTwoName" />
<uni-icons type="right" size="18" color="#ababab"></uni-icons>
</view>
<view class="py">
<uni-file-picker v-model="qrCodeTwo" limit="1" title="上传二维码二" :auto-upload="false" @select="e => uploadQrcode(e, 'qrCodeTwo')" ></uni-file-picker>
</view>
</view>
</view>
<view class="block">
<view class="form-list edit-form">
<view class="line with-arrow no-bd">
<view class="name">二维码描述三</view>
<input type="text" placeholder="输入二维码描述三" v-model="form.qrCodeThreeName" />
<uni-icons type="right" size="18" color="#ababab"></uni-icons>
</view>
<view class="py">
<uni-file-picker v-model="qrCodeThree" limit="1" title="上传二维码三" :auto-upload="false" @select="e => uploadQrcode(e, 'qrCodeThree')" ></uni-file-picker>
</view>
</view>
</view>
<view class="btn-wrap">
<view class="btn" @click="submit">保存</view>
</view>
</view>
</template>
<script>
import { queryProvince, queryCity, queryTeamInfo, updateTeamInfo, enterpriseCertificationStatus } from '@/apis/modules/user.js'
import { treeStructureList, saveSupplierClassification } from '@/apis/modules/supplier.js'
import OSS from '@/libs/Oss/upload'
import Common from '@/config/common'
export default {
data() {
return {
openId: uni.getStorageSync('openId'),
info: {},
form: {
address: '',
briefIntroduction: '',
city: '',
classificationName: '',
id: uni.getStorageSync('teamId'),
logoUrl: '',
pictureUrl: '',
province: '',
qrCodeOneName: '',
qrCodeOneUrl: '',
qrCodeThreeName: '',
qrCodeThreeUrl: '',
qrCodeTwoName: '',
qrCodeTwoUrl: '',
slogan: '',
},
qrCodeOne: [],
qrCodeTwo: [],
qrCodeThree: [],
qrcodeLen: 1,
provinces: [],
cities: [],
desPics: [],
submiting: false,
uploading: false,
classifications: [],
classificationId: ''
}
},
computed: {
// 平台名字
platformName() {
return this.info.platformSource === '6' ? '供应商' : this.info.platformSource === '5' ? '幼儿园' : ''
},
},
onLoad() {
this.getEnterInfo()
this.getProvince()
},
methods: {
// 企业认证信息
async getEnterInfo() {
const { data } = await enterpriseCertificationStatus(this.openId)
if (data) {
this.info = data
data.platformSource === '6' && this.getClassification()
}
},
// 获取个人信息
getInfo() {
queryTeamInfo({
teamId: this.form.id
}).then(res => {
const data = res.teamInfo
if (!data.logoUrl) data.logoUrl = Common.avatar
// 分类回显
const type = res.supplierClassification
if (type && type.length) {
this.classificationId = type[0].supplierClassificationId
}
if (data.pictureUrl) {
const pics = data.pictureUrl.split(',')
const result = []
pics.forEach(url => {
result.push({
url
})
})
this.desPics = result
}
// 二维码回显
if (data.qrCodeOneUrl) {
this.qrCodeOne = [{
url: data.qrCodeOneUrl
}]
}
if (data.qrCodeTwoUrl) {
this.qrCodeTwo = [{
url: data.qrCodeTwoUrl
}]
}
if (data.qrCodeThreeUrl) {
this.qrCodeThree = [{
url: data.qrCodeThreeUrl
}]
}
this.form = data
this.$nextTick(() => {
data.province && this.getCity()
})
}).catch(e => {})
},
// 供应商分类
async getClassification() {
const { list } = await treeStructureList()
this.classifications = list
},
// 获取省份
async getProvince() {
const { list } = await queryProvince()
this.provinces = list
this.getInfo()
},
// 获取城市
async getCity() {
const { list } = await queryCity({
provinceId: this.provinces.find(e => e.provinceName == this.form.province).provinceId
})
this.cities = list
this.cityId = ''
},
// 上传logo
uploadLogo() {
const that = this
uni.chooseImage({
success: (res) => {
const file = res.tempFilePaths[0];
OSS(file, ({ url }) => {
that.form.logoUrl = url
})
}
});
},
// 上传描述图片
uploadDes(e){
OSS(e.tempFilePaths[0], (res) => {
this.desPics.push({
name: res.name,
extname: res.ext,
url: res.url,
})
})
},
// 上传二维码
uploadQrcode(e, field){
OSS(e.tempFilePaths[0], (res) => {
this[field].push({
name: res.name,
extname: res.ext,
url: res.url,
})
})
},
// 提交
async submit() {
if (this.submiting) return false
const { form } = this
if (!form.classificationName) return this.$util.errMsg(`请输入幼儿园名称!`)
this.submiting = true
form.pictureUrl = this.desPics.map(e => e.url).join()
form.qrCodeOneUrl = this.qrCodeOne.length ? this.qrCodeOne[0].url : ''
form.qrCodeTwoUrl = this.qrCodeTwo.length ? this.qrCodeTwo[0].url : ''
form.qrCodeThreeUrl = this.qrCodeThree.length ? this.qrCodeThree[0].url : ''
try {
// 选择了供应商分类,则保存分类
if (this.classificationId) {
form.supplierClassificationConfigs = [
{
classificationId: this.classificationId
}
]
}
await updateTeamInfo(form)
this.$util.sucMsg('保存成功!')
setTimeout(() => {
uni.navigateBack()
}, 1500)
} catch(e) {
this.submiting = false
}
}
}
}
</script>
<style scoped lang="scss">
.page {
padding-bottom: 170rpx;
-webkit-overflow-scrolling: touch;
}
.avatar {
width: 80rpx;
height: 80rpx;
border: 0;
border-radius: 50%;
}
/deep/.picker-input {
.arrow-area {
display: none;
}
.input-value, .selected-list {
padding: 0;
}
}
</style>