|
@@ -1,35 +1,101 @@
|
|
|
<template>
|
|
|
<div class="detail-box">
|
|
|
<el-scrollbar style="height:100%;">
|
|
|
- <div class="attribute-detail"></div>
|
|
|
- <div class="implement-detail"></div>
|
|
|
+ <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.TaskId || '--' }}</el-form-item>
|
|
|
+ <el-form-item label="设备类:">{{ detail.EquipCategory.EquipName || '--' }}</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.Equipment.DpSupplierID || '--' }}</el-form-item>
|
|
|
+ <el-form-item label="型号:">{{ detail.Equipment.DpManufacturerID || '--' }}</el-form-item>
|
|
|
+ <el-form-item label="包含部件:">{{ detail.EquipId || '--' }}</el-form-item>
|
|
|
+ <el-form-item label="执行任务人:">{{ detail.WorkerName || '--' }}</el-form-item>
|
|
|
+ <el-form-item label="执行时间:">{{ detail.ProcessTime || '--' }}</el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="implement-detail detail-item">
|
|
|
+ <el-form :model="detail" label-width="150px">
|
|
|
+ <el-form-item label="未找到对象信息:"></el-form-item>
|
|
|
+ <el-form-item label="部件信息:">{{ '' || '--' }}</el-form-item>
|
|
|
+ <el-form-item label="全景图:">
|
|
|
+ <div class="img-item">
|
|
|
+ <div class="demo-image__preview">
|
|
|
+ <el-image style="width:100%;" @click="nowUrl = url1" :src="url1" :preview-src-list="srcList"></el-image>
|
|
|
+ <el-image style="width:100%;" @click="nowUrl = url2" :src="url2" :preview-src-list="srcList"></el-image>
|
|
|
+ <el-image style="width:100%;" @click="nowUrl = url3" :src="url3" :preview-src-list="srcList"></el-image>
|
|
|
+ </div>
|
|
|
+ <div class="img-hide">
|
|
|
+ <i class="el-icon-help" style="font-size:30px;"></i><br />
|
|
|
+ <span> 点击查看全景图 </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="部件照片:">
|
|
|
+
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="现场视频:">
|
|
|
+ <div class="img-item">
|
|
|
+ <img src="@/assets/house.jpg" style="width:100%;" alt="图片走丢了">
|
|
|
+ <div class="img-hide">
|
|
|
+ <i class="el-icon-help" style="font-size:30px;"></i><br />
|
|
|
+ <span> 点击查看视频 </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注信息:">{{ detail.Note || '--' }}</el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="operation-detail detail-item"></div>
|
|
|
</el-scrollbar>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { } from "@/api/scan/request"
|
|
|
+import { } from "@/api/scan/request"
|
|
|
import { mapGetters } from "vuex"
|
|
|
export default {
|
|
|
components: {
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapGetters("layout", ["projectId"])
|
|
|
+ ...mapGetters("layout", ["projectId"]),
|
|
|
+ srcList: function () {
|
|
|
+ let index = this.urls.indexOf(this.nowUrl) >= 1 ? this.urls.indexOf(this.nowUrl) : 0;
|
|
|
+ // let temp = this.urls.concat();
|
|
|
+ let temp = this.urls;
|
|
|
+ let tempArr1 = temp.slice(0, index);
|
|
|
+ let tempArr2 = temp.slice(index, temp.length);
|
|
|
+
|
|
|
+ let res = tempArr2.concat(tempArr1);
|
|
|
+ return res;
|
|
|
+ }
|
|
|
},
|
|
|
props: {
|
|
|
- id: String,
|
|
|
+ detail: Object,
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
+ nowUrl: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',//当前正在显示的图
|
|
|
+ url1: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
|
|
|
+ url2: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
|
|
|
+ url3: 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg',
|
|
|
+ urls: ['https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg', 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg', 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg']
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
-
|
|
|
+ console.log(this.detail);
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ handleClick(){
|
|
|
+ debugger
|
|
|
+ }
|
|
|
},
|
|
|
watch: {
|
|
|
id: {
|
|
@@ -44,28 +110,53 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
- .detail-box{
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
+.detail-box {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ /deep/ .el-scrollbar__wrap {
|
|
|
+ overflow-x: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .detail-item {
|
|
|
+ width: calc(100% - 30px);
|
|
|
+ margin: 15px 15px 10px;
|
|
|
+ padding: 10px;
|
|
|
box-sizing: border-box;
|
|
|
- /deep/ .el-scrollbar__wrap {
|
|
|
- overflow-x: hidden;
|
|
|
- }
|
|
|
- .attribute-detail{
|
|
|
- width: calc(100% - 30px);
|
|
|
- height: 500px;
|
|
|
- margin: 15px 15px 10px;
|
|
|
- box-sizing: border-box;
|
|
|
- border-left: 1px solid #eee;
|
|
|
- box-shadow: 0px 1px 5px 0px rgba(59, 66, 84, 0.15);
|
|
|
- }
|
|
|
- .implement-detail{
|
|
|
- width: calc(100% - 30px);
|
|
|
- height: 500px;
|
|
|
- margin: 15px 15px 10px;
|
|
|
- box-sizing: border-box;
|
|
|
- border-left: 1px solid #eee;
|
|
|
- box-shadow: 0px 1px 5px 0px rgba(59, 66, 84, 0.15);
|
|
|
+ border-left: 1px solid #eee;
|
|
|
+ box-shadow: 0px 1px 5px 0px rgba(59, 66, 84, 0.15);
|
|
|
+ }
|
|
|
+
|
|
|
+ .img-item {
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .img-item:hover {
|
|
|
+ .img-hide {
|
|
|
+ height: 100%;
|
|
|
+ transition: all 1s;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .img-hide {
|
|
|
+ color: white;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 400;
|
|
|
+ width: 100%;
|
|
|
+ height: 0px;
|
|
|
+ background: rgba(0, 0, 0, 0.2);
|
|
|
+ position: absolute;
|
|
|
+ top: 0px;
|
|
|
+ right: 0px;
|
|
|
+ display: flex;
|
|
|
+ overflow: hidden;
|
|
|
+ -webkit-align-items: center;
|
|
|
+ align-items: center;
|
|
|
+ -webkit-justify-content: center;
|
|
|
+ justify-content: center;
|
|
|
+ text-align: center;
|
|
|
+ cursor: pointer;
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|