12 changed files with 1142 additions and 25 deletions
@ -0,0 +1,392 @@ |
|||||||
|
<template> |
||||||
|
<view class="view"> |
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
企业名称 |
||||||
|
</view> |
||||||
|
<view class="value"> |
||||||
|
<input |
||||||
|
class="input-value" |
||||||
|
type="text" |
||||||
|
placeholder-class="txt" |
||||||
|
placeholder="请输入企业名称" |
||||||
|
v-model="form.enterpriseName" |
||||||
|
@blur="proofName" |
||||||
|
/> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
企业地址 |
||||||
|
</view> |
||||||
|
<view class="value" @tap="chooseAddress"> |
||||||
|
<input |
||||||
|
class="input-value" |
||||||
|
type="text" |
||||||
|
placeholder-class="txt" |
||||||
|
placeholder="请选择企业地址" |
||||||
|
v-model="form.address" |
||||||
|
disabled |
||||||
|
/> |
||||||
|
<u-icon name="map"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
企业介绍 |
||||||
|
</view> |
||||||
|
<view class="value" @tap="goIntruduce"> |
||||||
|
<view class="input-textarea" v-if="form.introduce"> |
||||||
|
{{ form.introduce }} |
||||||
|
</view> |
||||||
|
<view class="input-textarea" style="color: #808080" v-else> |
||||||
|
请输入企业介绍 |
||||||
|
</view> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="upload-wrapper"> |
||||||
|
<view |
||||||
|
class="wd-flex" |
||||||
|
style=" |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
width: 100%; |
||||||
|
" |
||||||
|
> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
企业照片 |
||||||
|
</view> |
||||||
|
<view style="color: #808080">最多可传3张</view> |
||||||
|
</view> |
||||||
|
<u-upload |
||||||
|
:fileList="form.photo" |
||||||
|
@afterRead="addEnterprisePhoto" |
||||||
|
@delete="delEnterprisePhoto" |
||||||
|
multiple |
||||||
|
:maxCount="3" |
||||||
|
width="101" |
||||||
|
height="101" |
||||||
|
></u-upload> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
企业标签 |
||||||
|
</view> |
||||||
|
<view class="value" @tap="goTags"> |
||||||
|
<view class="input-textarea" v-if="form.introduce"> |
||||||
|
{{ form.tags }} |
||||||
|
</view> |
||||||
|
<view class="input-textarea" style="color: #808080" v-else> |
||||||
|
请选择企业标签 |
||||||
|
</view> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
企业负责人 |
||||||
|
</view> |
||||||
|
<view class="value"> |
||||||
|
<input |
||||||
|
class="input-value" |
||||||
|
type="text" |
||||||
|
placeholder-class="txt" |
||||||
|
placeholder="请输入企业负责人" |
||||||
|
v-model="form.contactName" |
||||||
|
/> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
负责人电话 |
||||||
|
</view> |
||||||
|
<view class="value"> |
||||||
|
<input |
||||||
|
class="input-value" |
||||||
|
type="text" |
||||||
|
placeholder-class="txt" |
||||||
|
placeholder="请输入负责人电话" |
||||||
|
v-model="form.environmentalContactPhone" |
||||||
|
@blur="proofName" |
||||||
|
/> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="upload-wrapper"> |
||||||
|
<view |
||||||
|
class="wd-flex" |
||||||
|
style=" |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
width: 100%; |
||||||
|
" |
||||||
|
> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
相关资质 |
||||||
|
</view> |
||||||
|
<view |
||||||
|
class="wd-flex" |
||||||
|
style="color: #17c653; gap: 4px; align-items: center" |
||||||
|
@tap="addProve" |
||||||
|
> |
||||||
|
<u-icon name="plus-circle" color="#17C653" size="14"></u-icon> |
||||||
|
<text style="line-height: 1rem">新增资质</text> |
||||||
|
</view> |
||||||
|
<view |
||||||
|
class="wd-flex" |
||||||
|
style="justify-content: space-between" |
||||||
|
v-for="(p, index) in prove" |
||||||
|
:key="index" |
||||||
|
v-if="prove.length > 0" |
||||||
|
> |
||||||
|
<image |
||||||
|
src="@/static/images/enterprise/zz.png" |
||||||
|
style="width: 90px; height: 70px" |
||||||
|
mode="widthFix" |
||||||
|
></image> |
||||||
|
<view |
||||||
|
style="flex: 1; justify-content: space-between" |
||||||
|
class="wd-flex wd-flex-col" |
||||||
|
> |
||||||
|
<view class="wd-flex" style="gap: 8px; align-items: center"> |
||||||
|
<text class="label">资质名称</text> |
||||||
|
<view> |
||||||
|
{{ |
||||||
|
$dict.echoDicValue( |
||||||
|
dictMap.enterprise_qua, |
||||||
|
prove.qualificationName.toString() |
||||||
|
) |
||||||
|
}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="wd-flex" style="gap: 8px; align-items: center"> |
||||||
|
<text class="label">资质编号</text> |
||||||
|
<view> |
||||||
|
{{ prove.enterpriseAuth }} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="wd-flex" style="gap: 8px; align-items: center"> |
||||||
|
<text class="label">资质到期</text> |
||||||
|
<view> |
||||||
|
{{ $util.formatDate(prove.expiryDate, 'YYYY/M/D') }} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<cs-bottom-wrapper> |
||||||
|
<view class="operation"> |
||||||
|
<button class="btn green">提交审核</button> |
||||||
|
</view> |
||||||
|
</cs-bottom-wrapper> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { uploadFile } from '@/api/system/file.js' |
||||||
|
import { getDictBatchByType } from '@/api/system/dict.js' |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
form: { |
||||||
|
enterpiseName: undefined, |
||||||
|
address: undefined, |
||||||
|
gpsLocation: undefined, |
||||||
|
introduce: '', |
||||||
|
photo: [], |
||||||
|
tags: {} |
||||||
|
}, |
||||||
|
dictMap: {}, |
||||||
|
prove: [], |
||||||
|
inviteId: undefined |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(res) { |
||||||
|
this.inviteId = res.inviteId |
||||||
|
this.getDict() |
||||||
|
}, |
||||||
|
onShow() { |
||||||
|
uni.$on('enterpriseIntroduce', data => { |
||||||
|
this.form.introduce = data.introduce |
||||||
|
}) |
||||||
|
uni.$on('enterpriseTag', data => { |
||||||
|
this.form.tags = data |
||||||
|
}) |
||||||
|
uni.$on('prove', data => { |
||||||
|
this.prove.push(data) |
||||||
|
}) |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
proofName(v) { |
||||||
|
console.log(v.detail.value) |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 获取字典 |
||||||
|
*/ |
||||||
|
async getDict() { |
||||||
|
const dict = await getDictBatchByType({ |
||||||
|
type: ['enterprise_qua'].join(',') |
||||||
|
}) |
||||||
|
this.dictMap = { |
||||||
|
...dict.data |
||||||
|
} |
||||||
|
}, |
||||||
|
chooseAddress() { |
||||||
|
uni.chooseLocation({ |
||||||
|
success: res => { |
||||||
|
this.form.address = res.address |
||||||
|
this.form.gpsLocation = res.latitude + ',' + res.longitude |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
goIntruduce() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: `/sub/invite/enterpriseIntroduce?introduce=${this.form.introduce}` |
||||||
|
}) |
||||||
|
}, |
||||||
|
goTags() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: `/sub/invite/enterpriseTags?tags=${this.form.tags}` |
||||||
|
}) |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 选择图片并上传 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
async addEnterprisePhoto(e) { |
||||||
|
e.file.forEach(p => { |
||||||
|
this.form.photo.push({ |
||||||
|
...p, |
||||||
|
status: 'uploading', |
||||||
|
message: '上传中' |
||||||
|
}) |
||||||
|
}) |
||||||
|
// 使用promise.all()方法上传到后端做统一接收 |
||||||
|
await Promise.all( |
||||||
|
this.form.photo.map(async (p, i) => { |
||||||
|
if (p.status == 'uploading') { |
||||||
|
const res = await uploadFile({ name: `file`, filePath: p.url }) |
||||||
|
return { |
||||||
|
...res.data, |
||||||
|
status: 'success', |
||||||
|
message: '' |
||||||
|
} |
||||||
|
} |
||||||
|
return p |
||||||
|
}) |
||||||
|
).then(res => { |
||||||
|
this.form.photo = res |
||||||
|
}) |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 删除图片 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
delEnterprisePhoto(e) { |
||||||
|
this.form.photo.splice(e.index, 1) |
||||||
|
}, |
||||||
|
addProve() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '/sub/invite/prove' |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.view { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
flex-flow: column nowrap; |
||||||
|
gap: 12px; |
||||||
|
overflow: hidden; |
||||||
|
overflow-y: scroll; |
||||||
|
max-height: 100vh; |
||||||
|
padding-bottom: 12vh; |
||||||
|
} |
||||||
|
.block { |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
background-color: #fff; |
||||||
|
padding: 12px; |
||||||
|
border-radius: 8px; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
gap: 12px; |
||||||
|
.value { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
justify-content: space-between; |
||||||
|
gap: 4px; |
||||||
|
.input-value { |
||||||
|
flex: 1; |
||||||
|
text-align: right; |
||||||
|
white-space: nowrap; |
||||||
|
text-overflow: ellipsis; |
||||||
|
} |
||||||
|
.input-textarea { |
||||||
|
flex: 1; |
||||||
|
display: -webkit-box; |
||||||
|
overflow: hidden; |
||||||
|
text-align: right; |
||||||
|
max-height: 3rem; |
||||||
|
line-height: 1rem; |
||||||
|
text-overflow: ellipsis; |
||||||
|
-webkit-line-clamp: 3; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
word-break: break-all; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.upload-wrapper { |
||||||
|
display: flex; |
||||||
|
flex-flow: column nowrap; |
||||||
|
background-color: #fff; |
||||||
|
padding: 12px; |
||||||
|
border-radius: 8px; |
||||||
|
gap: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.operation { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
gap: 12px; |
||||||
|
.btn { |
||||||
|
flex: 1; |
||||||
|
border-radius: 8px; |
||||||
|
display: flex; |
||||||
|
padding: 12px 0; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.green { |
||||||
|
background-color: $cs-color-main; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,79 @@ |
|||||||
|
<template> |
||||||
|
<view class="view"> |
||||||
|
<u--textarea |
||||||
|
v-model="introduce" |
||||||
|
placeholder="请输入..." |
||||||
|
maxlength="500" |
||||||
|
count |
||||||
|
:autoHeight="true" |
||||||
|
></u--textarea> |
||||||
|
<cs-bottom-wrapper> |
||||||
|
<view class="operation"> |
||||||
|
<button class="btn green" @tap="submit">保存</button> |
||||||
|
</view> |
||||||
|
</cs-bottom-wrapper> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
introduce: '' |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(res) { |
||||||
|
this.introduce = res.introduce |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
submit() { |
||||||
|
if (!this.introduce) { |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: '请填写介绍' |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
uni.$emit('enterpriseIntroduce', { introduce: this.introduce }) |
||||||
|
uni.navigateBack() |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.view { |
||||||
|
background-color: #fff; |
||||||
|
padding: 12px; |
||||||
|
height: 100vh; |
||||||
|
} |
||||||
|
::v-deep .u-textarea { |
||||||
|
min-height: 400rpx; |
||||||
|
background-color: #f9f9f9 !important; |
||||||
|
border: 1px solid #f9f9f9; |
||||||
|
border-radius: 12px; |
||||||
|
.u-textarea__count { |
||||||
|
background-color: #f9f9f9 !important; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.operation { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
gap: 12px; |
||||||
|
.btn { |
||||||
|
flex: 1; |
||||||
|
border-radius: 8px; |
||||||
|
display: flex; |
||||||
|
padding: 12px 0; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.green { |
||||||
|
background-color: $cs-color-main; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,177 @@ |
|||||||
|
<template> |
||||||
|
<view class="view"> |
||||||
|
<view class="block" v-for="(tag, index) in data" :key="index"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
{{ tag.name }} |
||||||
|
</view> |
||||||
|
<view class="value" @click="showPicker(tag)"> |
||||||
|
<view class="input-value" v-if="form[tag.name]"> |
||||||
|
{{ form[tag.name].name }} |
||||||
|
</view> |
||||||
|
<view class="input-value" style="color: #808080" v-else> |
||||||
|
{{ `请选择${tag.name}` }} |
||||||
|
</view> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<u-picker |
||||||
|
:show="picker.show" |
||||||
|
:columns="picker.data" |
||||||
|
@cancel="closePicker" |
||||||
|
closeOnClickOverlay |
||||||
|
keyName="name" |
||||||
|
ref="uPicker" |
||||||
|
@close="closePicker" |
||||||
|
@confirm="confirmPicker" |
||||||
|
></u-picker> |
||||||
|
<cs-bottom-wrapper> |
||||||
|
<view class="operation"> |
||||||
|
<button class="btn green" @tap="submit">提交审核</button> |
||||||
|
</view> |
||||||
|
</cs-bottom-wrapper> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
data: [], |
||||||
|
form: {}, |
||||||
|
// 选择器 |
||||||
|
picker: { |
||||||
|
show: false, |
||||||
|
// 做表单中键的缓存用 |
||||||
|
key: null, |
||||||
|
data: [] |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(res) { |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getData() { |
||||||
|
this.data = new Array(5).fill(1).map((i, index) => { |
||||||
|
this.form[`Tag${index + 1}`] = '' |
||||||
|
return { |
||||||
|
name: `Tag${index + 1}`, |
||||||
|
label: `标签${index + 1}`, |
||||||
|
value: index, |
||||||
|
children: new Array(10).fill(1).map((c, cIndex) => { |
||||||
|
return { |
||||||
|
name: `subTag${cIndex + 1}`, |
||||||
|
value: cIndex * 10 |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
console.log(this.data) |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 选择器确认回调 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
confirmPicker(e) { |
||||||
|
const { value } = e |
||||||
|
this.form[this.picker.key] = value[0].value |
||||||
|
this.closePicker() |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 关闭选择器 |
||||||
|
*/ |
||||||
|
closePicker() { |
||||||
|
this.picker = { |
||||||
|
show: false, |
||||||
|
key: '', |
||||||
|
data: [] |
||||||
|
} |
||||||
|
}, |
||||||
|
showPicker(tag) { |
||||||
|
this.picker.data.push(tag.children) |
||||||
|
this.picker.key = tag.name |
||||||
|
this.picker.show = true |
||||||
|
}, |
||||||
|
submit() { |
||||||
|
const msg = Object.keys(this.form).filter(k => { |
||||||
|
if (this.form[k] == '') { |
||||||
|
return this.data.find(d => d.name == k).label |
||||||
|
} |
||||||
|
}) |
||||||
|
if (msg.length > 0) { |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: `${msg.join('\n')}不能为空` |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
uni.$emit('enterpriseTag', this.form) |
||||||
|
console.log(this.form) |
||||||
|
uni.navigateBack() |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.view { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
flex-flow: column nowrap; |
||||||
|
gap: 12px; |
||||||
|
overflow: hidden; |
||||||
|
overflow-y: scroll; |
||||||
|
max-height: 100vh; |
||||||
|
padding-bottom: 12vh; |
||||||
|
} |
||||||
|
.input-value { |
||||||
|
flex: 1; |
||||||
|
text-align: right; |
||||||
|
white-space: nowrap; |
||||||
|
text-overflow: ellipsis; |
||||||
|
} |
||||||
|
.block { |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
background-color: #fff; |
||||||
|
padding: 12px; |
||||||
|
border-radius: 8px; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
gap: 12px; |
||||||
|
.value { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
justify-content: space-between; |
||||||
|
gap: 4px; |
||||||
|
.input-value { |
||||||
|
flex: 1; |
||||||
|
text-align: right; |
||||||
|
white-space: nowrap; |
||||||
|
text-overflow: ellipsis; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.operation { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
gap: 12px; |
||||||
|
.btn { |
||||||
|
flex: 1; |
||||||
|
border-radius: 8px; |
||||||
|
display: flex; |
||||||
|
padding: 12px 0; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.green { |
||||||
|
background-color: $cs-color-main; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,55 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<scroll-view direction="vertical"></scroll-view> |
||||||
|
<cs-bottom-wrapper> |
||||||
|
<view class="operation"> |
||||||
|
<button class="btn green" @tap="addEnterprise">新增企业</button> |
||||||
|
</view> |
||||||
|
</cs-bottom-wrapper> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
inviteId: '' |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(res) { |
||||||
|
console.log(res) |
||||||
|
if (res.inviteId) { |
||||||
|
this.inviteId = res.inviteId |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
addEnterprise() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: `/sub/invite/addEnterprise?inviteId=${this.inviteId}` |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.operation { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
gap: 12px; |
||||||
|
.btn { |
||||||
|
flex: 1; |
||||||
|
border-radius: 8px; |
||||||
|
display: flex; |
||||||
|
padding: 12px 0; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.green { |
||||||
|
background-color: $cs-color-main; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,369 @@ |
|||||||
|
<template> |
||||||
|
<view class="view"> |
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
资质名称 |
||||||
|
</view> |
||||||
|
<view |
||||||
|
class="value" |
||||||
|
@tap="showPicker('enterprise_qua', 'qualificationName')" |
||||||
|
> |
||||||
|
<view class="input-textarea" v-if="prove.qualificationName"> |
||||||
|
{{ |
||||||
|
$dict.echoDicValue( |
||||||
|
dictMap.enterprise_qua, |
||||||
|
prove.qualificationName |
||||||
|
) |
||||||
|
}} |
||||||
|
</view> |
||||||
|
<view class="input-textarea" style="color: #808080" v-else> |
||||||
|
请输入资质名称 |
||||||
|
</view> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
资质编号 |
||||||
|
</view> |
||||||
|
<view class="value"> |
||||||
|
<input |
||||||
|
class="input-value" |
||||||
|
type="text" |
||||||
|
placeholder-class="txt" |
||||||
|
placeholder="请输入资质编号" |
||||||
|
v-model="prove.enterpriseAuth" |
||||||
|
/> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<!-- <view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
办理时间 |
||||||
|
</view> |
||||||
|
<view class="value" @tap="showCalendar('handleDate')"> |
||||||
|
<view class="input-textarea" v-if="prove.handleDate"> |
||||||
|
{{ prove.handleDate }} |
||||||
|
</view> |
||||||
|
<view class="input-textarea" style="color: #808080" v-else> |
||||||
|
请选择办理时间 |
||||||
|
</view> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> --> |
||||||
|
|
||||||
|
<view class="block"> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
到期时间 |
||||||
|
</view> |
||||||
|
<view class="value" @tap="showCalendar('expiryDate')"> |
||||||
|
<view class="input-textarea" v-if="prove.expiryDate"> |
||||||
|
{{ prove.expiryDate }} |
||||||
|
</view> |
||||||
|
<view class="input-textarea" style="color: #808080" v-else> |
||||||
|
请选择到期时间 |
||||||
|
</view> |
||||||
|
<u-icon name="arrow-right"></u-icon> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="upload-wrapper"> |
||||||
|
<view |
||||||
|
class="wd-flex" |
||||||
|
style=" |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
width: 100%; |
||||||
|
" |
||||||
|
> |
||||||
|
<view style=""> |
||||||
|
<text style="color: #f8285a; margin-right: 4px">*</text> |
||||||
|
资质照片 |
||||||
|
</view> |
||||||
|
<view style="color: #808080">要求清晰有效</view> |
||||||
|
</view> |
||||||
|
<u-upload |
||||||
|
:fileList="prove.photo" |
||||||
|
@afterRead="addPhoto" |
||||||
|
@delete="delPhoto" |
||||||
|
:maxCount="1" |
||||||
|
width="101" |
||||||
|
height="101" |
||||||
|
></u-upload> |
||||||
|
</view> |
||||||
|
|
||||||
|
<cs-bottom-wrapper> |
||||||
|
<view class="operation"> |
||||||
|
<button class="btn green" @tap="submit">保存</button> |
||||||
|
</view> |
||||||
|
</cs-bottom-wrapper> |
||||||
|
<u-picker |
||||||
|
:show="picker.show" |
||||||
|
:columns="picker.data" |
||||||
|
@cancel="closePicker" |
||||||
|
closeOnClickOverlay |
||||||
|
keyName="label" |
||||||
|
ref="uPicker" |
||||||
|
@close="closePicker" |
||||||
|
@confirm="confirmPicker" |
||||||
|
></u-picker> |
||||||
|
<uni-calendar |
||||||
|
ref="calendarRef" |
||||||
|
:insert="false" |
||||||
|
@confirm="confirmCalendar" |
||||||
|
/> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { uploadFile } from '@/api/system/file.js' |
||||||
|
import { getDictBatchByType } from '@/api/system/dict.js' |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
prove: { |
||||||
|
id: '', |
||||||
|
qualificationName: '', |
||||||
|
expiryDate: '', |
||||||
|
enterpriseAuth: '', |
||||||
|
photo: [] |
||||||
|
}, |
||||||
|
dictMap: {}, |
||||||
|
// 选择器 |
||||||
|
picker: { |
||||||
|
show: false, |
||||||
|
// 做表单中键的缓存用 |
||||||
|
key: null, |
||||||
|
data: [] |
||||||
|
}, |
||||||
|
// 日历控件 |
||||||
|
calendar: { |
||||||
|
// 做表单中键的缓存用 |
||||||
|
key: null |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(res) { |
||||||
|
uni.setNavigationBarTitle({ |
||||||
|
title: !res ? '编辑资质' : '新增资质' |
||||||
|
}) |
||||||
|
this.getDict() |
||||||
|
}, |
||||||
|
onShow() {}, |
||||||
|
methods: { |
||||||
|
/** |
||||||
|
* 获取字典 |
||||||
|
*/ |
||||||
|
async getDict() { |
||||||
|
const dict = await getDictBatchByType({ |
||||||
|
type: ['enterprise_qua'].join(',') |
||||||
|
}) |
||||||
|
this.dictMap = { |
||||||
|
...dict.data |
||||||
|
} |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 选择图片并上传 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
async addPhoto(e) { |
||||||
|
e.file.forEach(p => { |
||||||
|
this.prove.photo.push({ |
||||||
|
...p, |
||||||
|
status: 'uploading', |
||||||
|
message: '上传中' |
||||||
|
}) |
||||||
|
}) |
||||||
|
// 使用promise.all()方法上传到后端做统一接收 |
||||||
|
await Promise.all( |
||||||
|
this.prove.photo.map(async (p, i) => { |
||||||
|
if (p.status == 'uploading') { |
||||||
|
const res = await uploadFile({ name: `file`, filePath: p.url }) |
||||||
|
return { |
||||||
|
...res.data, |
||||||
|
status: 'success', |
||||||
|
message: '' |
||||||
|
} |
||||||
|
} |
||||||
|
return p |
||||||
|
}) |
||||||
|
).then(res => { |
||||||
|
this.prove.photo = res |
||||||
|
}) |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 删除图片 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
delPhoto(e) { |
||||||
|
this.prove.photo.splice(e.index, 1) |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 选择器确认回调 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
confirmPicker(e) { |
||||||
|
const { value } = e |
||||||
|
this.prove[this.picker.key] = value[0].value |
||||||
|
this.closePicker() |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 关闭选择器 |
||||||
|
*/ |
||||||
|
closePicker() { |
||||||
|
this.picker = { |
||||||
|
show: false, |
||||||
|
key: '', |
||||||
|
data: [] |
||||||
|
} |
||||||
|
}, |
||||||
|
showPicker(dict, key) { |
||||||
|
this.picker.data.push(this.dictMap[dict]) |
||||||
|
this.picker.key = key |
||||||
|
this.picker.show = true |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 显示日历 |
||||||
|
* @param {Object} key 表单中需要赋值的键 |
||||||
|
*/ |
||||||
|
showCalendar(key) { |
||||||
|
this.$refs.calendarRef.open() |
||||||
|
this.calendar = { |
||||||
|
key |
||||||
|
} |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 日历选中之后的回调 |
||||||
|
* @param {Object} e |
||||||
|
*/ |
||||||
|
confirmCalendar(e) { |
||||||
|
this.prove[this.calendar.key] = e.fulldate |
||||||
|
|
||||||
|
this.closeCalendar() |
||||||
|
}, |
||||||
|
/** |
||||||
|
* 关闭日历 |
||||||
|
*/ |
||||||
|
closeCalendar() { |
||||||
|
this.calendar = { |
||||||
|
key: null |
||||||
|
} |
||||||
|
}, |
||||||
|
async submit() { |
||||||
|
const valide = await this.verifyForm() |
||||||
|
if (!valide) return |
||||||
|
uni.$emit('prove', this.prove) |
||||||
|
uni.navigateBack() |
||||||
|
}, |
||||||
|
async verifyForm() { |
||||||
|
const msgMap = { |
||||||
|
qualificationName: '请填写资质名称', |
||||||
|
expiryDate: '请选择到期日期', |
||||||
|
enterpriseAuth: '请填写资质编号', |
||||||
|
photo: '请上传资质照片' |
||||||
|
} |
||||||
|
const keys = Object.keys(this.prove).filter(i => { |
||||||
|
if (!this.prove[i] && i != 'id') return i |
||||||
|
if (typeof this.prove[i] == 'object' && this.prove[i].length == 0) |
||||||
|
return i |
||||||
|
}) |
||||||
|
if (keys.length > 0) { |
||||||
|
const msg = keys |
||||||
|
.map(i => { |
||||||
|
return msgMap[i] |
||||||
|
}) |
||||||
|
.join('\n') |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: msg |
||||||
|
}) |
||||||
|
return false |
||||||
|
} |
||||||
|
return true |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.view { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
flex-flow: column nowrap; |
||||||
|
gap: 12px; |
||||||
|
overflow: hidden; |
||||||
|
overflow-y: scroll; |
||||||
|
max-height: 100vh; |
||||||
|
padding-bottom: 12vh; |
||||||
|
} |
||||||
|
.block { |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
background-color: #fff; |
||||||
|
padding: 12px; |
||||||
|
border-radius: 8px; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
gap: 12px; |
||||||
|
.value { |
||||||
|
flex: 1; |
||||||
|
display: flex; |
||||||
|
flex-flow: row nowrap; |
||||||
|
justify-content: space-between; |
||||||
|
gap: 4px; |
||||||
|
.input-value { |
||||||
|
flex: 1; |
||||||
|
text-align: right; |
||||||
|
white-space: nowrap; |
||||||
|
text-overflow: ellipsis; |
||||||
|
} |
||||||
|
.input-textarea { |
||||||
|
flex: 1; |
||||||
|
display: -webkit-box; |
||||||
|
overflow: hidden; |
||||||
|
text-align: right; |
||||||
|
max-height: 3rem; |
||||||
|
line-height: 1rem; |
||||||
|
text-overflow: ellipsis; |
||||||
|
-webkit-line-clamp: 3; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
word-break: break-all; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.upload-wrapper { |
||||||
|
display: flex; |
||||||
|
flex-flow: column nowrap; |
||||||
|
background-color: #fff; |
||||||
|
padding: 12px; |
||||||
|
border-radius: 8px; |
||||||
|
gap: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.operation { |
||||||
|
padding: 12px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
gap: 12px; |
||||||
|
.btn { |
||||||
|
flex: 1; |
||||||
|
border-radius: 8px; |
||||||
|
display: flex; |
||||||
|
padding: 12px 0; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.green { |
||||||
|
background-color: $cs-color-main; |
||||||
|
color: #fff; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue