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.
387 lines
9.3 KiB
387 lines
9.3 KiB
<template> |
|
<scroll-view class="detail-container" scroll-y> |
|
<view class="box detail"> |
|
<view> |
|
<text class="wd-font-800 wd-text-16" style="margin-bottom: 8rpx"> |
|
{{ detail.enterprisesName }} |
|
</text> |
|
</view> |
|
<view class="address" @click="goView(detail)"> |
|
<u-icon name="map" size="28rpx" color="#17C653"></u-icon> |
|
<text |
|
style=" |
|
text-decoration: underline; |
|
color: #071437; |
|
font-size: 26rpx; |
|
padding-right: 3rem; |
|
white-space: nowrap; |
|
text-overflow: ellipsis; |
|
width: 528rpx; |
|
overflow: hidden; |
|
" |
|
> |
|
{{ detail.address }} |
|
</text> |
|
</view> |
|
<view class="tagList"> |
|
<view class="tag"> |
|
{{ $dict.echoDicValue(dictMap.enterprises_area, detail.region) }} |
|
</view> |
|
<view |
|
class="tag" |
|
v-for="(tag, index) in detail.tagList" |
|
:key="index" |
|
> |
|
{{ tag }} |
|
</view> |
|
</view> |
|
<view class="wd-flex" style="align-items: center"> |
|
<text class="address" style="margin-right: 24rpx">环保负责人</text> |
|
<text style="margin-right: 24rpx; color: #071437"> |
|
{{ detail.contactName }} |
|
</text> |
|
<text class="address" style="margin-right: 24rpx">联系方式</text> |
|
<text |
|
style="text-decoration: underline; color: #071437" |
|
@click="callPhone(detail.environmentalContactPhone)" |
|
> |
|
{{ detail.environmentalContactPhone }} |
|
</text> |
|
</view> |
|
<view |
|
class="images-box" |
|
@click="$util.perviewImage(detail.files.map(i => i.url))" |
|
> |
|
<image |
|
v-for="(src, index) in detail.files" |
|
:key="index" |
|
:src="src.url" |
|
mode="aspectFill" |
|
class="image" |
|
></image> |
|
</view> |
|
<cs-text-more :value="detail.introduction"></cs-text-more> |
|
<!-- <view class="status"> |
|
<cs-dict-tag |
|
:dict="dictMap.enterprises_status" |
|
:value="detail.enterprisesStatus" |
|
></cs-dict-tag> |
|
</view> --> |
|
</view> |
|
|
|
<view |
|
class="box wd-text-12 prove" |
|
v-for="prove in detail.qualificationList" |
|
:key="prove.id" |
|
> |
|
<view class="wd-flex" style="gap: 18rpx; position: relative"> |
|
<image |
|
:src="prove.files[0].url" |
|
style="width: 180rpx; height: 140rpx" |
|
mode="aspectFill" |
|
@click="$util.perviewImage([prove.files[0].url])" |
|
></image> |
|
<view |
|
style="flex: 1; justify-content: space-between" |
|
class="wd-flex wd-flex-col" |
|
> |
|
<view class="wd-flex" style="gap: 18rpx; align-items: center"> |
|
<text class="label" style="color: #78829d">资质名称</text> |
|
<view style="color: #071437"> |
|
{{ |
|
$dict.echoDicValue( |
|
dictMap.enterprise_qua, |
|
prove.qualificationName.toString() |
|
) |
|
}} |
|
</view> |
|
</view> |
|
<view class="wd-flex" style="gap: 18rpx; align-items: center"> |
|
<text class="label">资质编号</text> |
|
<view style="color: #071437"> |
|
{{ prove.enterpriseAuth }} |
|
</view> |
|
</view> |
|
<view class="wd-flex" style="gap: 18rpx; align-items: center"> |
|
<text class="label">资质时限</text> |
|
<view style="color: #071437"> |
|
{{ $util.formatDate(prove.expiryDate, 'YYYY年M月D日') }} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="status"> |
|
<cs-dict-tag |
|
:dict="dictMap.enterprise_qualification_status" |
|
:value="prove.status" |
|
></cs-dict-tag> |
|
</view> |
|
</view> |
|
|
|
<cs-bottom-wrapper v-if="isView"> |
|
<view class="operation"> |
|
<view |
|
class="btn green" |
|
@tap="showModel = true" |
|
v-if="!detail.isAudit" |
|
> |
|
确认审核 |
|
</view> |
|
<view |
|
:class="['btn', total > 0 ? 'green' : 'grey']" |
|
@tap="goInspections" |
|
v-else |
|
> |
|
执法记录 |
|
<text v-if="total > 0">({{ total }})</text> |
|
</view> |
|
</view> |
|
</cs-bottom-wrapper> |
|
|
|
<cs-bottom-wrapper v-if="isChange"> |
|
<view class="operation"> |
|
<view class="btn green">认领该企业</view> |
|
</view> |
|
</cs-bottom-wrapper> |
|
|
|
<u-modal |
|
:show="showModel" |
|
confirmText="返回" |
|
showCancelButton |
|
cancel-text="确认" |
|
cancel-color="#17C653" |
|
confirm-color="#071437" |
|
@confirm="showModel = false" |
|
@cancel="postApi" |
|
> |
|
<view class="wd-flex wd-flex-col wd-flex-center" style="gap: 10px"> |
|
<view style="font-size: 32rpx; color: #071437; font-weight: 800"> |
|
是否审核? |
|
</view> |
|
<view class="">请确保企业信息真实性</view> |
|
</view> |
|
</u-modal> |
|
</scroll-view> |
|
</template> |
|
|
|
<script> |
|
import { |
|
getEnterPrise, |
|
checkEnterprise, |
|
getTaskList |
|
} from '@/api/enterprise/index.js' |
|
import { getDictBatchByType } from '@/api/system/dict.js' |
|
export default { |
|
data() { |
|
return { |
|
detail: { |
|
id: '', |
|
type: '', |
|
region: '' |
|
}, |
|
showModel: false, |
|
dictMap: {}, |
|
total: 0, |
|
isView: true, |
|
isChange: false |
|
} |
|
}, |
|
onLoad(res) { |
|
if (res.id) { |
|
this.detail.id = res.id |
|
} |
|
if (res.view) { |
|
this.isView = false |
|
} |
|
if (res.change) { |
|
this.isView = false |
|
this.isChange = true |
|
} |
|
this.getDict() |
|
this.init() |
|
}, |
|
methods: { |
|
/** |
|
* 获取字典 |
|
*/ |
|
async getDict() { |
|
const dict = await getDictBatchByType({ |
|
type: [ |
|
'enterprises_type', |
|
'enterprises_area', |
|
'enterprises_status', |
|
'enterprise_qualification_status', |
|
'enterprise_qua' |
|
].join(',') |
|
}) |
|
this.dictMap = { |
|
...dict.data |
|
} |
|
}, |
|
callPhone(number) { |
|
uni.makePhoneCall({ |
|
phoneNumber: number |
|
}) |
|
}, |
|
async init() { |
|
const res = await getEnterPrise(this.detail.id) |
|
this.detail = res.data |
|
this.getTaskLength() |
|
}, |
|
goBack() { |
|
uni.switchTab({ |
|
url: '/pages/enterprise' |
|
}) |
|
}, |
|
goView(enterprise) { |
|
if (!enterprise.gpsLocation) { |
|
uni.showToast({ |
|
icon: 'none', |
|
title: '暂无gps信息' |
|
}) |
|
return |
|
} |
|
const position = enterprise.gpsLocation.split(',') |
|
this.$util.viewPosition({ |
|
lat: position[0], |
|
lng: position[1], |
|
name: enterprise.enterprisesName, |
|
address: enterprise.address |
|
}) |
|
}, |
|
postApi() { |
|
checkEnterprise(this.detail.id).then(() => { |
|
uni.showToast({ |
|
icon: 'none', |
|
title: '操作成功' |
|
}) |
|
this.showModel = false |
|
this.init() |
|
}) |
|
}, |
|
getTaskLength() { |
|
const data = { |
|
enterpriseId: this.detail.id, |
|
pageNo: 1, |
|
pageSize: 10 |
|
} |
|
getTaskList(data).then(res => { |
|
this.total = res.data.total |
|
}) |
|
}, |
|
goInspections() { |
|
if (this.total > 0) { |
|
uni.navigateTo({ |
|
url: `/sub/inspection/detail?enterprisesId=${this.detail.id}&enterprisesName=${this.detail.enterprisesName}` |
|
}) |
|
} |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.detail-container { |
|
padding: 24rpx; |
|
position: relative; |
|
.box { |
|
margin-bottom: 24rpx; |
|
background-color: #fff; |
|
border-radius: $cs-border-radius; |
|
padding: 24rpx; |
|
} |
|
.detail { |
|
display: flex; |
|
flex-flow: column nowrap; |
|
gap: 24rpx; |
|
.address { |
|
display: flex; |
|
flex-flow: row nowrap; |
|
gap: 10rpx; |
|
color: $uni-text-color-grey; |
|
} |
|
.tagList { |
|
display: flex; |
|
gap: 8rpx; |
|
flex-flow: row wrap; |
|
color: $uni-text-color-grey; |
|
.tag { |
|
font-size: 24rpx; |
|
display: flex; |
|
padding: 4rpx 12rpx; |
|
justify-content: center; |
|
align-items: center; |
|
border-radius: 4rpx; |
|
background: #f9f9f9; |
|
} |
|
} |
|
.status { |
|
position: absolute; |
|
right: -38rpx; |
|
top: 12rpx; |
|
transform: rotateZ(45deg) translateX(40rpx) translateY(-40rpx); |
|
transform-origin: 50% 50%; |
|
padding: 8rpx 40rpx; |
|
font-size: 24rpx; |
|
text-align: center; |
|
} |
|
} |
|
.prove { |
|
position: relative; |
|
overflow: hidden; |
|
.status { |
|
position: absolute; |
|
right: 0; |
|
top: 0; |
|
transform: rotateZ(45deg) translateX(60rpx) translateY(-41rpx); |
|
transform-origin: 50% 50%; |
|
} |
|
} |
|
.images-box { |
|
display: flex; |
|
flex-flow: row nowrap; |
|
gap: 24rpx; |
|
.image { |
|
width: 196rpx; |
|
height: 196rpx; |
|
border-radius: $cs-border-radius; |
|
flex-shrink: 0; |
|
} |
|
} |
|
} |
|
|
|
.label { |
|
color: $uni-text-color-grey; |
|
} |
|
.icon-box { |
|
position: absolute; |
|
left: 0; |
|
} |
|
.operation { |
|
padding: 24rpx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
gap: 24rpx; |
|
.red { |
|
background: var(--LightMode-Danger-Danger-Light, #ffeef3); |
|
color: var(--LightMode-Danger-Danger, #f8285a); |
|
} |
|
.btn { |
|
flex: 1; |
|
border-radius: 18rpx; |
|
display: flex; |
|
padding: 24rpx 0; |
|
align-items: center; |
|
justify-content: center; |
|
} |
|
.green { |
|
background-color: $cs-color-main; |
|
color: #fff; |
|
} |
|
.grey { |
|
background: #f1f1f4; |
|
color: #99a1b7; |
|
} |
|
} |
|
</style>
|
|
|