243 lines
6.7 KiB
243 lines
6.7 KiB
<template> |
|
<view class="wrap"> |
|
<view class="form"> |
|
<u--form :model="form" ref="uForm" labelWidth="80"> |
|
<!-- 企业名称 --> |
|
<u-form-item label="企业名称" prop="name" borderBottom> |
|
<u-input v-model="form.name" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
<!-- 企业类型 --> |
|
<u-form-item label="企业类型" prop="type" borderBottom @tap="showType = true;"> |
|
<u--input v-model="form.type" placeholder="请选择" border="none"></u--input> |
|
<u-icon slot="right" name="arrow-right"></u-icon> |
|
</u-form-item> |
|
<!-- 企业地址 --> |
|
<u-form-item label="企业地址" prop="addr" borderBottom> |
|
<u-input v-model="form.addr" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
<!-- 企业简介 --> |
|
<u-form-item label="企业简介" prop="info" borderBottom> |
|
<u--textarea v-model="form.info" placeholder="请输入" border="none" count="true"></u--textarea> |
|
</u-form-item> |
|
<!-- 企业照片 --> |
|
<u-form-item label="企业照片" borderBottom> |
|
<u-upload :fileList="form.photo" @afterRead="addPhoto" @delete="delPhoto" multiple |
|
:maxCount="6"></u-upload> |
|
</u-form-item> |
|
<!-- 环保负责人 --> |
|
<u-form-item label="环保负责人" prop="manager" borderBottom> |
|
<u-input v-model="form.manager" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
<!-- 联系方式 --> |
|
<u-form-item label="联系方式" prop="phone" borderBottom> |
|
<u-input v-model="form.phone" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
|
|
<!-- 成立时间 --> |
|
<u-form-item label="成立时间" prop="regtime" borderBottom @tap="showRegtime = true"> |
|
<u-datetime-picker :show="showRegtime" v-model="defTime" mode="date" @confirm="regtime" |
|
@cancel="showRegtime = false"></u-datetime-picker> |
|
<u-input :value="form.regtime" border="none" placeholder="请输入" /> |
|
<u-icon slot="right" name="arrow-right"></u-icon> |
|
</u-form-item> |
|
|
|
|
|
<u-form-item label="zzlx" prop="hblicense" borderBottom labelPosition="top"> |
|
<u-input v-model="form.hblicense" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
|
|
<u-form-item label="bh" prop="pwlicense" borderBottom labelPosition="top"> |
|
<u-input v-model="form.pwlicense" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
|
|
<u-form-item label="bh" prop="pwlicense" borderBottom labelPosition="top"> |
|
<u-input v-model="form.pwlicense" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
|
|
|
|
</u--form> |
|
|
|
<!-- <view v-if='isEdit'> |
|
<view class="" v-for="zz in zzlist" :key="zz.uid" @tap="edit(zz)"> |
|
<view class=""> |
|
<label for="">zzlx</label><text>{{zz.zzlx}}</text> |
|
</view> |
|
</view> |
|
</view> --> |
|
|
|
<!-- <u--form :model="zzform" v-else> |
|
|
|
|
|
<u-form-item label="zzlx" prop="hblicense" borderBottom labelPosition="top"> |
|
<u-input v-model="form.hblicense" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
|
|
<u-form-item label="bh" prop="pwlicense" borderBottom labelPosition="top"> |
|
<u-input v-model="form.pwlicense" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
<u-form-item label="sj" prop="pwlicense" borderBottom labelPosition="top"> |
|
<u-input v-model="form.pwlicense" border="none" placeholder="请输入" /> |
|
</u-form-item> |
|
<u-form-item> |
|
<button @tap='savazz'>save</button> |
|
</u-form-item> |
|
</u--form> --> |
|
|
|
<u-action-sheet :show="showType" :actions="types" title="请选择企业类型" @close="showType = false" |
|
@select="typeSelect"> |
|
</u-action-sheet> |
|
|
|
</view> |
|
<u-button @tap="submit">提交</u-button> |
|
</view> |
|
|
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return { |
|
form: { |
|
name: '', // 企业名称 |
|
type: '', // 企业类型 |
|
info: '', // 企业地址 |
|
addr: '', // 企业简介 |
|
photo: [], // 企业照片 |
|
manager: '', // 环保负责人 |
|
phone: '', // 联系方式 |
|
regtime: '', // 成立时间 |
|
hblicense: '', // 环保许可证 |
|
pwlicense: '', // 排污许可证 |
|
}, |
|
defTime: Number(new Date()), // 初始化日期 |
|
showType: false, |
|
showRegtime: false, |
|
types: [{ |
|
name: '小型', |
|
}, |
|
{ |
|
name: '中型', |
|
}, |
|
{ |
|
name: '大型', |
|
}, |
|
], |
|
|
|
rules: { |
|
name: { |
|
required: true, |
|
message: '请输入企业名称', |
|
trigger: ['blur'] |
|
}, |
|
type: { |
|
type: 'string', |
|
required: true, |
|
message: '请选择企业类型', |
|
trigger: ['blur'] |
|
}, |
|
info: { |
|
type: 'string', |
|
min: 3, |
|
required: true, |
|
message: '不低于3个字', |
|
trigger: ['change'] |
|
}, |
|
addr: { |
|
required: true, |
|
message: '请输入企业地址', |
|
trigger: ['blur'] |
|
}, |
|
manager: { |
|
required: true, |
|
message: '请输入环保负责人', |
|
trigger: ['blur'] |
|
}, |
|
phone: { |
|
required: true, |
|
message: '请输入联系方式', |
|
trigger: ['blur'] |
|
}, |
|
}, |
|
zzform: {}, |
|
zzList: [], |
|
isEdit: false |
|
} |
|
}, |
|
methods: { |
|
// 提交数据 |
|
submit() { |
|
this.$refs.uForm.validate().then(res => { |
|
uni.$u.toast('校验通过') |
|
// 提交时上传照片 |
|
this.uploadPhoto(this.form.photo) |
|
}).catch(errors => { |
|
uni.$u.toast('校验失败') |
|
}) |
|
}, |
|
// 企业成立时间 |
|
regtime(e) { |
|
this.form.regtime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd'); |
|
this.showRegtime = false |
|
}, |
|
// 选择企业类型 |
|
typeSelect(e) { |
|
this.form.type = e.name |
|
this.$refs.uForm.validateField('type') |
|
}, |
|
// 新增图片 |
|
addPhoto(e) { |
|
this.form.photo = e.file.map(item => { |
|
return { |
|
url: item.url |
|
} |
|
}); |
|
}, |
|
// 删除图片 |
|
delPhoto(e) { |
|
this.form.photo.splice(e.index, 1); |
|
}, |
|
// 提交时上传图片 |
|
async uploadPhoto(photo) { |
|
// 遍历图片数组并上传每张图片 |
|
for (let i = 0; i < photo.length; i++) { |
|
try { |
|
// 获取每张图片的 URL |
|
const url = photo[i].url; |
|
const res = await uni.$u.http.upload('http://192.168.2.101:8080/api/common_file/upload', { |
|
filePath: url, |
|
name: 'file', |
|
}); |
|
console.log(`照片 ${i + 1} 上传结果`, res); |
|
} catch (err) { |
|
console.log(`上传照片 ${i + 1} 失败`, err); |
|
} |
|
} |
|
}, |
|
savazz() { |
|
const data = this.zzform |
|
data.uid = '' |
|
this.zzList.push(data) |
|
} |
|
}, |
|
onReady() { |
|
//如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则。 |
|
this.$refs.uForm.setRules(this.rules) |
|
}, |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
.wrap { |
|
background-color: #F9F9F9; |
|
min-height: 100vh; |
|
|
|
.form { |
|
padding: 48rpx; |
|
|
|
.u-textarea { |
|
background-color: inherit; |
|
padding: 0; |
|
} |
|
} |
|
} |
|
</style> |