feat(details): 添加年度报告信息iframe展示功能

- 新增iframe用于展示年度报告信息页面
- 集成oauth认证获取iframe访问权限
- 实现iframeURL数据绑定和动态路径构建

style(details): 优化代码格式和注释缩进

- 修复注释块的缩进格式问题
- 统一代码缩进风格
- 格式化变量声明的空格

refactor(details): 重构标签页切换逻辑

- 在标签页切换时添加年度报告信息页面的数据获取逻辑
- 重新组织条件判断结构,提升代码可读性
- 添加iframe的动态加载控制
This commit is contained in:
chenxf 2026-01-15 11:51:41 +08:00
parent 3f79063bb5
commit 00c7ff633b
1 changed files with 50 additions and 40 deletions

View File

@ -92,12 +92,12 @@
广州天河科技股份有限公司 广州天河科技股份有限公司
</td> </td>
</tr> --> </tr> -->
<!-- <tr>--> <!-- <tr>-->
<!-- <th>联系电话</th>--> <!-- <th>联系电话</th>-->
<!-- <td>--> <!-- <td>-->
<!-- {{ entInfo.phone }}--> <!-- {{ entInfo.phone }}-->
<!-- </td>--> <!-- </td>-->
<!-- </tr>--> <!-- </tr>-->
<!-- <tr> <!-- <tr>
<th>手机号码</th> <th>手机号码</th>
<td> <td>
@ -566,7 +566,9 @@
<span v-if="eOtPermitList.length === 0" class="header-label">该企业暂没有行政许可信息</span> <span v-if="eOtPermitList.length === 0" class="header-label">该企业暂没有行政许可信息</span>
</div> </div>
</el-tab-pane> --> </el-tab-pane> -->
<el-tab-pane label="年度报告信息" name="fourth" /> <el-tab-pane label="年度报告信息" name="fourth">
<iframe v-if="activeName === 'fourth'" style="width: 100%;height: calc(100vh - 250px);" :src="iframeURL" frameborder="0" />
</el-tab-pane>
<el-tab-pane label="异常经营目录" name="abnormal"> <el-tab-pane label="异常经营目录" name="abnormal">
<div v-if="activeName === 'abnormal'" class="tab-pane"> <div v-if="activeName === 'abnormal'" class="tab-pane">
<table v-if="isAbnListDetails === true" class="apply-table" wdith="100%"> <table v-if="isAbnListDetails === true" class="apply-table" wdith="100%">
@ -870,7 +872,7 @@
</el-table> </el-table>
<span v-if="eAlterRecoder.length === 0" class="header-label">该企业暂没有变更记录</span> <span v-if="eAlterRecoder.length === 0" class="header-label">该企业暂没有变更记录</span>
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="showTab1" label="联系方式" name="contactInfoa"> <el-tab-pane v-if="showTab1" label="联系方式" name="contactInfoa">
<div style="display: flex; align-items: center; margin-bottom: 10px;"> <div style="display: flex; align-items: center; margin-bottom: 10px;">
<el-button style="margin-left: 0px" size="mini" type="primary" @click="showPone">查看号码</el-button> <el-button style="margin-left: 0px" size="mini" type="primary" @click="showPone">查看号码</el-button>
<span style="color: red; margin-left: 10px; font-size: 25px;">注意点击按钮查看联系电话</span> <span style="color: red; margin-left: 10px; font-size: 25px;">注意点击按钮查看联系电话</span>
@ -879,13 +881,13 @@
<el-table-column label="序号" type="index" width="60" /> <el-table-column label="序号" type="index" width="60" />
<el-table-column label="职务" prop="position" min-width="100" show-overflow-tooltip /> <el-table-column label="职务" prop="position" min-width="100" show-overflow-tooltip />
<el-table-column label="姓名" prop="name" show-overflow-tooltip /> <el-table-column label="姓名" prop="name" show-overflow-tooltip />
<el-table-column label="固定电话" show-overflow-tooltip /> <el-table-column label="固定电话" show-overflow-tooltip />
<el-table-column label="移动电话" show-overflow-tooltip /> <el-table-column label="移动电话" show-overflow-tooltip />
<el-table-column label="联系电话" show-overflow-tooltip /> <el-table-column label="联系电话" show-overflow-tooltip />
</el-table> </el-table>
<span v-if="contactList.length === 0" class="header-label">该企业暂没有联系方式信息</span> <span v-if="contactList.length === 0" class="header-label">该企业暂没有联系方式信息</span>
</el-tab-pane> </el-tab-pane>
<el-tab-pane v-if="showTab2" label="联系方式" name="contactInfo"> <el-tab-pane v-if="showTab2" label="联系方式" name="contactInfo">
<el-table v-if="contactList.length !== 0 " v-loading="loading" :data="contactList"> <el-table v-if="contactList.length !== 0 " v-loading="loading" :data="contactList">
<el-table-column label="序号" type="index" width="60" /> <el-table-column label="序号" type="index" width="60" />
<el-table-column label="职务" prop="position" min-width="100" show-overflow-tooltip /> <el-table-column label="职务" prop="position" min-width="100" show-overflow-tooltip />
@ -960,6 +962,7 @@ import { getAssignLogList } from '@/api/marketAssign'
import EasyForm from '@/components/EasyForm' import EasyForm from '@/components/EasyForm'
import dynamicSupervisionBase from '@/views/market/dynamicsupervision/index' import dynamicSupervisionBase from '@/views/market/dynamicsupervision/index'
import dailySupervisionBase from '@/views/market/dailysupervision/index' import dailySupervisionBase from '@/views/market/dailysupervision/index'
import { oauth } from '@/api/user'
export default { export default {
components: { components: {
@ -968,11 +971,11 @@ export default {
mixins: [dynamicSupervisionBase, dailySupervisionBase], mixins: [dynamicSupervisionBase, dailySupervisionBase],
data() { data() {
return { return {
isRead1 : false, isRead1: false,
isRead2 : false, isRead2: false,
isRead3 : false, isRead3: false,
isRead4 : false, isRead4: false,
isRead5 : false, isRead5: false,
isRead6: false, isRead6: false,
isRead7: false, isRead7: false,
showTab2: false, showTab2: false,
@ -1029,7 +1032,8 @@ export default {
readOnly: true readOnly: true
} }
}, },
fromPath: '' fromPath: '',
iframeURL: ''
} }
}, },
mounted() { mounted() {
@ -1082,7 +1086,7 @@ export default {
// // } // // }
// } // }
// }) // })
//const p5 = this.getRevokeListPage() // const p5 = this.getRevokeListPage()
// // // //
// const p6 = getAssignLogList(this.pripid).then(res => { // const p6 = getAssignLogList(this.pripid).then(res => {
@ -1096,7 +1100,7 @@ export default {
// //
// const p8 = this.getUsualInspectList() // const p8 = this.getUsualInspectList()
this.loading = true this.loading = true
Promise.all([p1]).finally(() => {//, p2, p3, p4, p5, p6, p7, p8 Promise.all([p1]).finally(() => { //, p2, p3, p4, p5, p6, p7, p8
this.loading = false this.loading = false
}) })
}, },
@ -1218,27 +1222,33 @@ export default {
handleClick(tab, event) { handleClick(tab, event) {
console.log(this.activeName) console.log(this.activeName)
this.loading = true this.loading = true
if((this.activeName === 'administrativeSanction' || this.activeName === 'bizSerIllegalRem') if (this.activeName === 'fourth') {
&& !this.isRead1){ oauth().then((res) => {
const { data } = res
const path = `/annualReportService/unifiedMGT/annualReportProgress/baseInfo/detail?pripid=${this.$route.query.pripid}&yearReportMode=1`
this.iframeURL = `${process.env.VUE_APP_AICEPS_SERVICE_URL || ''}/aiceps-service-web/#/oauthLogin?redirectUri=${encodeURIComponent(path)}&isIframe=1&encryptedData=${data}`
})
} else if ((this.activeName === 'administrativeSanction' || this.activeName === 'bizSerIllegalRem') &&
!this.isRead1) {
const p4 = queryEOtCaseDetails(this.pripid).then(res => { const p4 = queryEOtCaseDetails(this.pripid).then(res => {
if (res.code === 0) { if (res.code === 0) {
const data = res.data.tsSerIllegalList const data = res.data.tsSerIllegalList
this.eOtCaseList = res.data.eOtCase this.eOtCaseList = res.data.eOtCase
this.eOtPermitList = res.data.eOtPermit this.eOtPermitList = res.data.eOtPermit
const list = [] const list = []
data.forEach(each => { data.forEach(each => {
each.operationStatus = this.illeaglStatusFormat(each.operationStatus) each.operationStatus = this.illeaglStatusFormat(each.operationStatus)
list.push(each) list.push(each)
}) })
this.tsSerIllegalList = list this.tsSerIllegalList = list
// if (this.eOtPermit.candate !== null) { // if (this.eOtPermit.candate !== null) {
// this.eOtPermit.candate = this.$util.formatDate.format(new Date(Date.parse(this.eOtPermit.candate)), 'yyyy-MM-dd') // this.eOtPermit.candate = this.$util.formatDate.format(new Date(Date.parse(this.eOtPermit.candate)), 'yyyy-MM-dd')
// } // }
} }
}) })
this.isRead1 = true this.isRead1 = true
this.loading = false this.loading = false
}else if(this.activeName === 'abnormal' && !this.isRead2){ } else if (this.activeName === 'abnormal' && !this.isRead2) {
// //
const p3 = listAbnormalRecord(this.pripid).then(res => { const p3 = listAbnormalRecord(this.pripid).then(res => {
if (res.code === 0) { if (res.code === 0) {
@ -1255,11 +1265,11 @@ export default {
}) })
this.isRead2 = true this.isRead2 = true
this.loading = false this.loading = false
}else if(this.activeName === 'revoke' && !this.isRead3){ } else if (this.activeName === 'revoke' && !this.isRead3) {
const p5 = this.getRevokeListPage() const p5 = this.getRevokeListPage()
this.isRead3 = true this.isRead3 = true
this.loading = false this.loading = false
}else if(this.activeName === 'assign' && !this.isRead4){ } else if (this.activeName === 'assign' && !this.isRead4) {
const p6 = getAssignLogList(this.pripid).then(res => { const p6 = getAssignLogList(this.pripid).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.assignLogList = res.data this.assignLogList = res.data
@ -1267,7 +1277,7 @@ export default {
}) })
this.isRead4 = true this.isRead4 = true
this.loading = false this.loading = false
}else if (this.activeName === 'third' && !this.isRead5) { } else if (this.activeName === 'third' && !this.isRead5) {
// //
const p7 = this.getSueInspectList() const p7 = this.getSueInspectList()
@ -1276,7 +1286,7 @@ export default {
this.subActiveName = 'first' this.subActiveName = 'first'
this.isRead5 = true this.isRead5 = true
this.loading = false this.loading = false
}else if(this.activeName === 'basicInfo'){ } else if (this.activeName === 'basicInfo') {
this.loading = false this.loading = false
} else if (this.activeName === 'alterInfo' && !this.isRead6) { } else if (this.activeName === 'alterInfo' && !this.isRead6) {
this.loading = true this.loading = true
@ -1294,7 +1304,7 @@ export default {
}) })
this.isRead6 = true this.isRead6 = true
this.loading = false this.loading = false
}else if (this.activeName === 'contactInfo' && !this.isRead7) { } else if (this.activeName === 'contactInfo' && !this.isRead7) {
this.loading = true this.loading = true
queryContactByEntNo(this.pripid).then(res => { queryContactByEntNo(this.pripid).then(res => {
if (res.code === 0) { if (res.code === 0) {
@ -1309,7 +1319,7 @@ export default {
}) })
this.isRead7 = true this.isRead7 = true
this.loading = false this.loading = false
}else if (this.activeName === 'contactInfoa' && !this.isRead7) { } else if (this.activeName === 'contactInfoa' && !this.isRead7) {
this.loading = true this.loading = true
queryContactByEntNo(this.pripid).then(res => { queryContactByEntNo(this.pripid).then(res => {
if (res.code === 0) { if (res.code === 0) {