|
|
@@ -0,0 +1,205 @@
|
|
|
+<template>
|
|
|
+ <div class="scene-layer">
|
|
|
+ <iframe :src="url" ></iframe>
|
|
|
+ <div class="deteil-layer" :class="{hide: !showInfo}">
|
|
|
+ <div class="ctrl" @click="showInfo = !showInfo">
|
|
|
+ <img src="@/assets/image/decoration_collect@2x.png" alt="">
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="deteil">
|
|
|
+
|
|
|
+
|
|
|
+ <h2>火调详情</h2>
|
|
|
+
|
|
|
+ <div class="block">
|
|
|
+ <h3>基本信息</h3>
|
|
|
+
|
|
|
+ <div class="base-info">
|
|
|
+ <div>
|
|
|
+ <span>项目编号:</span>
|
|
|
+ <p>{{detail.projectSn}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>起火地址:</span>
|
|
|
+ <p>{{detail.projectAddress}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>起火场所:</span>
|
|
|
+ <p>{{detail.projectSite}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>承办单位:</span>
|
|
|
+ <p>{{detail.organizerDeptName}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>起火对象:</span>
|
|
|
+ <p>{{detail.projectName}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>承办人员:</span>
|
|
|
+ <p>{{detail.organizerUsers}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>事故日期:</span>
|
|
|
+ <p>{{detail.accidentDate}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>火灾原因:</span>
|
|
|
+ <p>{{detail.fireReason}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>项目状态:</span>
|
|
|
+ <p>{{detail.status === 0 ? '未认定' : '已认定'}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>是否教学项目:</span>
|
|
|
+ <p>{{detail.isTeached ? '是' : '否'}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>创建人:</span>
|
|
|
+ <p>{{detail.creatorName}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>编辑人:</span>
|
|
|
+ <p>{{detail.editorName}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>创建时间:</span>
|
|
|
+ <p>{{detail.createTime}}</p>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <span>最新编辑时间:</span>
|
|
|
+ <p>{{detail.editTime}}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="block">
|
|
|
+ <h3>火灾档案</h3>
|
|
|
+
|
|
|
+ <div class="attach">
|
|
|
+ <div
|
|
|
+ v-for="item in tableData"
|
|
|
+ :key="item._title"
|
|
|
+ class="type-item">
|
|
|
+ <h4>{{ item.title }}</h4>
|
|
|
+ <div class="addpend">
|
|
|
+ <span v-for="item in item.children" :key="item.id" @click="goto(item)" >
|
|
|
+ {{ item.fileName }}
|
|
|
+ <img src="@/assets/image/goto.png" alt="">
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <com-dialog title="访问密码" enterText="确 定" v-model:show="confirm.show" @submit="loadData()" width="480" :showClose="false">
|
|
|
+ <el-input v-model="confirm.psw" placeholder="请输入访问密码" @keydown.enter="loadData"></el-input>
|
|
|
+ </com-dialog>
|
|
|
+
|
|
|
+ <div v-if="showImg" class="img-layer">
|
|
|
+ <i class="el-icon-close" @click="showImg = ''"></i>
|
|
|
+ <img :src="showImg" alt="">
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { fireDetailByPsw, getAttachListByPsw } from '@/request/config'
|
|
|
+import axios from 'axios';
|
|
|
+import comDialog from "@/components/dialog";
|
|
|
+import { types } from '@/constant'
|
|
|
+
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ detail: {
|
|
|
+
|
|
|
+ },
|
|
|
+ showImg: '',
|
|
|
+ confirm: {show: false, psw: ''},
|
|
|
+ list: [],
|
|
|
+ showInfo: false,
|
|
|
+ loadSuccess: false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ 'confirm.show'() {
|
|
|
+ console.log(this.confirm.show, !this.showInfo)
|
|
|
+ if (this.confirm.show || !this.showInfo) {
|
|
|
+ this.$router.back()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ url() {
|
|
|
+ const {sceneNum,id} = this.$route.query
|
|
|
+ if (sceneNum && id) {
|
|
|
+ return process.env.VUE_APP_DOMAIN + '/fire-rtc-live.html?m=' + sceneNum +'&p_id='+id
|
|
|
+ // return 'https://test.4dkankan.com/fire-rtc-live.html?m=t-3fp7zQl&p_id=PROJECT01456470052986503168#/?mode=2&name=test&role=leader&roomId=9c4Q2rbL9ZP0Pxf1ReXLekBN&userId=9RYJ5jgQYvnP'
|
|
|
+ } else {
|
|
|
+ console.log('url获取=>',this.$route)
|
|
|
+ return 'javascript:void(0)'
|
|
|
+ // return process.env.VUE_APP_DOMAIN + '/spc.html?m=' + this.detail.sceneNum
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tableData() {
|
|
|
+ let dataList = this.list || [];
|
|
|
+ let cache = [];
|
|
|
+ let data = types.reduce((t, c) => {
|
|
|
+ let children = dataList.filter(
|
|
|
+ (item) => c.name === item.attachmentType
|
|
|
+ );
|
|
|
+ t.push({ title: c.name, children });
|
|
|
+ cache.push(...children);
|
|
|
+ return t;
|
|
|
+ }, []);
|
|
|
+
|
|
|
+ data[data.length - 1].children.push(
|
|
|
+ ...dataList.filter((item) => !cache.includes(item))
|
|
|
+ );
|
|
|
+ return data;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async loadData() {
|
|
|
+ // if (!this.confirm.psw || this.confirm.psw.length === 0) return this.$message.error('请输入访问密码', '提示')
|
|
|
+ let {data: detail} = await axios.get(fireDetailByPsw, {params: {projectId: this.$route.params.projectId, randCode: this.confirm.psw,type:1}})
|
|
|
+ this.detail = detail
|
|
|
+
|
|
|
+ let {data: list} = await axios.get(getAttachListByPsw, {params: {projectId: this.$route.params.projectId, randCode: this.confirm.psw,type:1}})
|
|
|
+ this.list = list
|
|
|
+
|
|
|
+ this.loadSuccess = true
|
|
|
+ this.confirm.show = false
|
|
|
+ this.showInfo = false //不默认开启
|
|
|
+ },
|
|
|
+ goto(item) {
|
|
|
+ if (item.type !== 1) {
|
|
|
+ window.open(item.fileOssUrl)
|
|
|
+ } else {
|
|
|
+ this.showImg = item.fileOssUrl
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleMessage(event){
|
|
|
+ console.log('handleMessage===>',event)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.loadData()
|
|
|
+ window.addEventListener('message',this.handleMessage)
|
|
|
+ },
|
|
|
+ beforeDestroyed(){
|
|
|
+ window.removeEventListener("message", this.handleMessage);
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ "com-dialog": comDialog,
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+@import "./style.scss";
|
|
|
+</style>
|
