<template>
|
<div class="file-page">
|
<SectionTitle title="影像资料信息"></SectionTitle>
|
<ul class="file-ul">
|
<li v-for="item in menu" :key="item.typeNo">
|
<div class="file-section">
|
<p class="section-title">
|
<span v-if="isEdit && isRequiredUpload" class="require-dot">*</span>
|
<span>{{item.typeName}}</span>
|
<span
|
v-if="Array.isArray(item.list) && item.list.length > 0"
|
class="img-num"
|
>（{{item.list.length}}张）</span>
|
</p>
|
<div class="file-content">
|
<PhotoList
|
:list="item.list"
|
@action="init"
|
:isEdit="isEdit"
|
:info="item"
|
@getList="getList"
|
:imageEditStatus="$route.query.imageEditStatus"
|
></PhotoList>
|
</div>
|
</div>
|
</li>
|
</ul>
|
</div>
|
</template>
|
<script>
|
// 影像资料信息
|
import {
|
qryImageMenuContractList,
|
qryImageByType
|
} from '@comprehensive/serve/public'
|
import SectionTitle from '../SectionTitle'
|
import PhotoList from '../PhotoList'
|
export default {
|
components: {
|
SectionTitle,
|
PhotoList
|
},
|
props: {
|
// 申请编号
|
info: {
|
type: Object,
|
default: () => ({})
|
}
|
},
|
data() {
|
return {
|
menu: [],
|
query: {},
|
textList: [],
|
imgList: [],
|
newWindow: null,
|
isAddEvent: false,
|
isRequiredUpload: false
|
}
|
},
|
created() {
|
this.init()
|
},
|
methods: {
|
init() {
|
const { $route } = this
|
const { query } = $route
|
const { isRequiredUpload } = query
|
|
this.isRequiredUpload = parseInt(isRequiredUpload) === 1
|
this.query = this.$route.query
|
this.getMenu()
|
},
|
|
// 影像资料信息1==文本列表
|
async getMenu() {
|
this.loading = true
|
const { dirNo } = this.query
|
const res = await qryImageMenuContractList({
|
dirNo
|
})
|
this.loading = false
|
const { result } = res
|
this.menu = result
|
this.getList()
|
},
|
getList(item) {
|
const { menu } = this
|
menu.forEach(item => {
|
this.getItem(item)
|
})
|
},
|
async getItem(item) {
|
const { query, menu } = this
|
const { objectType, objectNo } = query
|
const { typeNo } = item
|
|
const { result } = await qryImageByType({
|
objectNo,
|
objectType,
|
typeNo
|
})
|
|
const menuIndex = menu.findIndex(menuItem => menuItem.typeNo === typeNo)
|
this.$set(menu, menuIndex, { ...menu[menuIndex], list: result })
|
}
|
},
|
computed: {
|
isEdit() {
|
const { info } = this
|
return info.edit === 'Y'
|
}
|
}
|
}
|
</script>
|
|
<style lang="postcss" scoped>
|
.file-page {
|
& .file-top-buttons {
|
padding: 0 0 20px 0;
|
& .top-button {
|
line-height: 23px;
|
border-radius: 2px;
|
padding: 0 8px;
|
border: 1px solid rgba(238, 238, 238, 1);
|
font-size: 12px;
|
font-weight: 400;
|
color: rgba(119, 119, 119, 1);
|
margin: 0 28px 0 0;
|
}
|
}
|
& .section-title {
|
font-size: 14px;
|
font-weight: 400;
|
color: rgba(51, 51, 51, 1);
|
line-height: 20px;
|
& .require-dot {
|
color: #f56c6c;
|
margin-right: 4px;
|
}
|
& .img-num {
|
font-weight: 400;
|
color: rgba(197, 197, 197, 1);
|
}
|
}
|
& .file-ul {
|
margin: 0;
|
padding: 0 40px 0 0;
|
list-style: none;
|
display: grid;
|
grid-column-gap: 165px;
|
grid-template-columns: 1fr 1fr;
|
& li {
|
margin-bottom: 10px;
|
}
|
& .file-content {
|
background: rgba(249, 249, 249, 1);
|
border-radius: 4px;
|
padding: 11px 11px 0 11px;
|
}
|
}
|
}
|
</style>
|
