123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184 |
- <template>
- <div class="detail-box">
- <el-scrollbar style="height:100%;">
- <div class="attribute-detail detail-item">
- <el-form :model="detail" label-width="150px">
- <el-form-item label="资产基本信息"></el-form-item>
- <el-form-item label="任务创建时间:">{{ detail.CreateTime || '--' }}</el-form-item>
- <el-form-item label="任务当前状态:">{{ detail.TaskState || '--' }}</el-form-item>
- <el-form-item label="任务执行方案:">{{ detail.ScanScheme?detail.ScanScheme.SchemeName?detail.ScanScheme.SchemeName:'--':'--' }}</el-form-item>
- <el-form-item label="设备族:">{{ detail.EquipFamily?detail.EquipFamily.FamilyName?detail.EquipFamily.FamilyName:'--':'--' }}</el-form-item>
- <el-form-item label="全局名称:">{{ detail.EquipName || '--' }}</el-form-item>
- <el-form-item label="资产本地名称:">{{ detail.EquipLocalName || '--' }}</el-form-item>
- <el-form-item label="资产本地编码:">{{ detail.EquipLocalID || '--' }}</el-form-item>
- <el-form-item label="设计图纸中编码:">{{ detail.CadId || '--' }}</el-form-item>
- <el-form-item label="安装位置:">{{ detail.InstallLocation || '--' }}</el-form-item>
- <el-form-item label="生产厂家:">{{ detail.Manufacturer || '--' }}</el-form-item>
- <el-form-item label="型号:">{{ detail.Specification || '--' }}</el-form-item>
- <el-form-item label="供应商:">{{ detail.Supplier || '--' }}</el-form-item>
- </el-form>
- </div>
- <div class="implement-detail detail-item" v-if="detail.TaskState == '未找到'">
- <el-form :model="detail" label-width="150px">
- <el-form-item label="执行任务人:">{{ detail.WorkerName || '--' }}</el-form-item>
- <el-form-item label="执行时间:">{{ detail.ProcessTime || '--' }}</el-form-item>
- <el-form-item label="未找到对象信息"></el-form-item>
- <el-form-item label="资产名称:">{{ detail.EquipLocalName || detail.EquipName || '--' }}</el-form-item>
- <el-form-item label="全景图:" v-show="panoramaList && panoramaList.length">
- <div class="img-item" @click="dialogVisible = true" v-for="item in panoramaList" :key="item.Key">
- <img :src="`/image-service/common/image_get?systemId=dataPlatform&key=${item.Key}`" style="width:100%;" :alt="item.Name">
- </div>
- </el-form-item>
- <el-form-item label="资产照片:" v-show="imgList && imgList.length">
- <div class="img-item">
- <div class="demo-image__preview">
- <el-image style="width:100%;" v-for="item in imgList"
- :key="item.Key" :title="item.Name"
- @click="nowUrl = item.Key"
- :src="`/image-service/common/image_get?systemId=dataPlatform&key=${item.Key}&width=400`"
- :preview-src-list="srcList">
- </el-image>
- </div>
- </div>
- </el-form-item>
- <el-form-item label="现场视频:" v-show="videoList && videoList.length">
- <video controls style="width:100%;" v-for="item in videoList" :key="item.Key" :title="item.Name">
- <source :src="`/image-service/common/image_get?systemId=dataPlatform&key=${item.Key}`" type="video/mp4">
- 您的浏览器不支持 HTML5 video ,暂无法播放。
- </video>
- </el-form-item>
- <el-form-item label="备注信息:">{{ detail.Note || '--' }}</el-form-item>
- </el-form>
- </div>
- <div class="operation-detail detail-item">
- <el-form>
- <el-form-item label="操作信息:"></el-form-item>
- <div class="block">
- <el-timeline>
- <el-timeline-item timestamp="2018/4/12" placement="top">
- <el-card>
- <h4>更新 Github 模板</h4>
- <p>王小虎 提交于 2018/4/12 20:46</p>
- </el-card>
- </el-timeline-item>
- <el-timeline-item timestamp="2018/4/3" placement="top">
- <el-card>
- <h4>更新 Github 模板</h4>
- <p>王小虎 提交于 2018/4/3 20:46</p>
- </el-card>
- </el-timeline-item>
- <el-timeline-item timestamp="2018/4/2" placement="top">
- <el-card>
- <h4>更新 Github 模板</h4>
- <p>王小虎 提交于 2018/4/2 20:46</p>
- </el-card>
- </el-timeline-item>
- </el-timeline>
- </div>
- </el-form>
- </div>
- </el-scrollbar>
- <el-dialog title="全景图" :visible.sync="dialogVisible" width="70%" append-to-body>
- 一张图
- </el-dialog>
- </div>
- </template>
- <script>
- import { } from "@/api/scan/request"
- import { mapGetters } from "vuex"
- export default {
- components: {
- },
- computed: {
- ...mapGetters("layout", ["projectId"]),
- panoramaList(){
- if(this.detail && this.detail.TaskPicList && this.detail.TaskPicList.length){
- return this.detail.TaskPicList.filter(item => {
- return item.Type == 'panorama'
- })
- } else {
- return []
- }
- },
- imgList(){
- if(this.detail && this.detail.TaskPicList && this.detail.TaskPicList.length){
- return this.detail.TaskPicList.filter(item => {
- return item.Type == 'image'
- })
- } else {
- return []
- }
- },
- videoList(){
- if(this.detail && this.detail.TaskPicList && this.detail.TaskPicList.length){
- return this.detail.TaskPicList.filter(item => {
- return item.Type == 'video'
- })
- } else {
- return []
- }
- },
- srcList(){
- let nowIndex = this.imgList.findIndex(item => {return item.Key == this.nowUrl})
- let index = nowIndex >= 1 ? nowIndex : 0;
- let tempArr1 = this.imgList.slice(0, index);
- let tempArr2 = this.imgList.slice(index, this.imgList.length);
- let res = tempArr2.concat(tempArr1).map(item => {
- return `/image-service/common/image_get?systemId=dataPlatform&key=${item.Key}`
- });
- return res;
- }
- },
- props: {
- detail: Object
- },
- data() {
- return {
- dialogVisible: false,//全景图弹出框
- nowUrl: ''//当前正在显示的图
- };
- },
- methods: {
- },
- watch: {
- 'detail.TaskId'() {
- console.log(this.detail)
- }
- }
- };
- </script>
- <style lang="less" scoped>
- .detail-box {
- width: 100%;
- height: 100%;
- box-sizing: border-box;
- /deep/ .el-scrollbar__wrap {
- overflow-x: hidden;
- }
- /deep/ .el-icon-circle-close {
- color: white;
- }
- /deep/ .el-form-item__content {
- text-overflow: ellipsis;
- overflow: hidden;
- }
- .detail-item {
- width: calc(100% - 30px);
- margin: 15px 15px 10px;
- padding: 10px;
- box-sizing: border-box;
- border-left: 1px solid #eee;
- box-shadow: 0px 1px 5px 0px rgba(59, 66, 84, 0.15);
- }
- .img-item {
- position: relative;
- cursor: pointer;
- }
- }
- </style>
|