123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384 |
- <template>
- <!-- 待删除页面 -->
- <div class="box" ref="boxBody">
- <div class="content-box" v-for="(item,index) in pageData" :key="index">
- <div class="content-top">
- <div class="details">
- <h4>{{index | numTransformation(4)}}<el-badge value="待删除" class="item"></el-badge>
- </h4>
- <h4>{{`${item.buildingName || '**'}`}}-{{`${item.floorName || '**'}`}}-{{`${item.localName?item.localName:item.name}`}}</h4>
- <b>BIM ID:<span @dblclick="copyContent"
- id="copy">{{item.bimId | bimIdTransformation}}</span></b><span class="copy"
- @click="clickCopy">点击复制</span>
- <input id="copyContent" type="text" @dblclick="copyContent" style="border:none;opacity:0;position:absolute;top:0;left:0;">
- <!-- <p style="margin-top:30px;">Revit族:{{item.BIMFamilyName}}</p> -->
- <p>设计图纸中编码:{{item.cadId || '--'}}</p>
- <p><span>设备类型:{{item.codeName || '--'}}</span></p>
- <p>设备ID:{{item.id}}</p>
- <!-- <p><span v-if="item.Property && item.Property.FamilyName">资产族:{{item.Property.FamilyName.Name}}</span><span
- v-if="item.PropertyId">关联的资产ID:{{item.PropertyId}}</span></p> -->
- <p>现场任务ID:{{item.scanTaskBase && item.scanTaskBase[0]?item.scanTaskBase[0].TaskId:""}}</p>
- <p>
- <span>执行人:{{item.scanTaskBase && item.scanTaskBase[0]?item.scanTaskBase[0].WorkerName:''}}</span><span>确认人:{{item.scanTaskBase && item.scanTaskBase[0]?item.scanTaskBase[0].ConfirmingPersonName:''}}</span>
- </p>
- </div>
- <div class="plan">
- <p>平面图上的位置:<span>{{item.local | localTransformation}}</span></p>
- <div class="img-box">
- <canvas :id="'canvas'+index" :width="canvasWidth" :height="canvasHeight" ref="canvas" tabindex="0" :data-modelid="item.modelId"
- :data-equipid='item.id' :data-x="item.local.X" :data-y="item.local.Y"></canvas>
- </div>
- </div>
- </div>
- <div class="content-bottom">
- <div class="explain" v-if="item.scanTaskBase && item.scanTaskBase[0] && item.scanTaskBase[0].Note">
- <p>现场问题说明:</p>
- <el-scrollbar>
- <p class="explain-content">
- <el-scrollbar>
- {{item.scanTaskBase?item.scanTaskBase[0].Note:""}}
- </el-scrollbar>
- </p>
- </el-scrollbar>
- </div>
- <div class="photo" v-for="(it,ind) in item.scanTaskBase[0].TaskPicList" :key='ind' v-else-if="item.scanTaskBase && item.scanTaskBase[0]">
- <div class="img-box">
- <p>{{it.Name}}<span>拍摄时间:{{it.CreateTime | timeTransformation}}</span></p>
- <div class="img-content">
- <img :src="`/image-service/common/image_get?systemId=dataPlatform&key=${it.Key}`" alt="现场拍摄照片">
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </template>
- <script>
- import { mapGetters } from "vuex";
- import { toBeDelEquipPage } from "@/api/scan/request.js";
- import { LocationPointScene, FloorView } from "@saga-web/cad-engine/lib";
- export default {
- components: {
- },
- data() {
- return {
- pageData: [],
- count: 0,
- equipComDelList: null,
- canvasWidth: 400,
- canvasHeight: 280,
- i: 0,
- scene: '',
- view: '',
- page: {
- pageSize: 20,
- pageNumber: 1,
- total: 0
- }
- }
- },
- mounted() {
- this.queryToBelDelEquip();
- this.boxBody = this.$refs.boxBody;
- this.boxBody.addEventListener('scroll', () => {
- let clientHeight = this.boxBody.clientHeight;
- let scrollTop = this.boxBody.scrollTop;
- let scrollHeight = this.boxBody.scrollHeight;
- if (clientHeight + scrollTop === scrollHeight) {
- console.log(this.page.pageNumber * this.page.pageSize)
- if (this.page.pageNumber * this.page.pageSize < this.page.total) {
- this.page.pageNumber++;
- if (this.pageData.length < 20) {
- this.page.pageNumber = 1
- }
- this.queryToBelDelEquip();
- }
- }
- })
- },
- created() {
- this.equipComDelList = decodeURIComponent(this.$route.query.equipComDelList);
- },
- computed: {
- ...mapGetters('layout', ['projectId'])
- },
- filters: {
- numTransformation(num, length) {// 序列号转换为4位
- num = Number(num + 1)
- return (Array(length).join('0') + num).slice(-length);
- },
- bimIdTransformation(bimId) {// bimID转换
- let ary = bimId.split(":");
- return ary[1];
- },
- localTransformation(local) {// 转换坐标
- let str = "";
- for (let key in local) {
- if (key !== "Z") {
- str += key + ':' + local[key] + ',';
- } else {
- str += key + ':' + local[key];
- }
- }
- return str;
- },
- timeTransformation(time) {
- time = time.substring(0, 16)
- return time;
- }
- },
- methods: {
- copyContent(element) {
- // 双击复制
- let content = element.target.innerText;
- let inputObj = document.getElementById('copyContent');
- inputObj.value = content;
- inputObj.select();
- document.execCommand("Copy");
- this.$message({
- message: '复制成功',
- type: 'success',
- duration: 1000
- });
- },
- clickCopy() {
- // 点击复制
- let target = document.getElementById('copy');
- let content = target.innerText;
- let inputObj = document.getElementById('copyContent');
- inputObj.value = content;
- inputObj.select();
- document.execCommand("Copy");
- this.$message({
- message: '复制成功',
- type: 'success',
- duration: 1000
- });
- },
- queryToBelDelEquip() {// 请求待删除数据
- let params = {
- orders: "createTime desc ,id asc",
- filters: `modelId in ${this.equipComDelList}`,
- pageNumber: this.page.pageNumber,
- pageSize: this.page.pageSize
- }
- toBeDelEquipPage(params, res => {
- this.page.total = res.pageSize < 20 ? res.pageSize : res.total;
- res.content.forEach(item => {
- if (item.bimLocation) {
- let local = {};
- let ary = item.bimLocation.split(',');
- let localAry = ['X', 'Y', 'Z'];
- ary.forEach((item, index) => {
- local[localAry[index]] = ary[index];
- })
- item.local = local;
- }
- if (item.scanTaskBase && item.scanTaskBase.length > 1) {
- item.scanTaskBase = item.scanTaskBase.shift();
- }
- });
- if (this.page.pageNumber == 1) {
- this.pageData = res.content;
- this.$nextTick(() => {
- this.getGraphy();
- })
- } else {
- this.pageData = this.pageData.concat(res.content);
- console.log(this.pageData.length, 19)
- this.$nextTick(() => {
- this.getGraphy();
- })
- }
- this.pageData.forEach(item => {
- if (item.bimLocation) {
- let local = {};
- let ary = item.bimLocation.split(',');
- let localAry = ['X', 'Y', 'Z'];
- ary.forEach((item, index) => {
- local[localAry[index]] = ary[index];
- })
- item.local = local;
- }
- if (item.scanTaskBase && item.scanTaskBase.length > 1) {
- item.scanTaskBase = item.scanTaskBase.shift();
- }
- });
- })
- },
- getGraphy() {// 绘制空间位置图片
- console.log(this.i);
- let can = this.$refs.canvas;
- let modelId = can[this.i].dataset.modelid
- let that = this;
- that.clearGraphy(this.i)
- that.scene = new LocationPointScene();
- this.canvasLoading = true;
- that.scene.getFloorData('/modelapi/base-graph/query', { ModelId: modelId }).then(res => {
- that.canvasLoading = false;
- if (res == 'error') {
- this.FloorMap = '';
- console.log('数据解析异常');
- return;
- }
- let EquipID = can[this.i].dataset.equipid;
- let X = Number(can[this.i].dataset.x);
- let Y = can[this.i].dataset.y * -1;
- that.view.scene = that.scene;
- this.scene.addMarker({
- Id: EquipID,
- X: X,
- Y: Y
- })
- that.view.fitSceneToView();
- that.view.scalable = false;
- this.scene.isSpaceSelectable = false;
- this.i++;
- if (this.i !== this.pageData.length) {
- this.$nextTick(() => {
- this.getGraphy();
- })
- }
- })
- },
- clearGraphy(i) {
- // if (this.view && this.view.scene) {
- // this.view.scene = null;
- // return
- // }
- this.view = new FloorView(`canvas${i}`)
- }
- },
- watch: {}
- }
- </script>
- <style lang="less" scoped>
- // 取消打印功能默认的左右边距
- @media print {
- @page {
- margin-left: 0;
- margin-right: 0;
- }
- }
- .box {
- background: #f2f2f2;
- margin: 0 auto;
- height: 100%;
- overflow-y: auto;
- ul {
- .infinite-list-item {
- margin-bottom: 20px;
- }
- }
- .content-box {
- width: 1000px;
- margin: 0 auto;
- background: white;
- padding: 10px 4px 10px 20px;
- box-sizing: border-box;
- .content-top {
- display: flex;
- div {
- flex: 1;
- }
- .details {
- margin-right: 10px;
- .el-badge {
- margin: 10px 0 0 10px;
- }
- p {
- margin-top: 4px;
- span:nth-child(1) {
- display: inline-block;
- width: 200px;
- }
- }
- .copy {
- color: #409eff;
- margin-left: 20px;
- }
- }
- .plan {
- padding-left: 20px;
- box-sizing: border-box;
- p {
- width: 100%;
- margin: 10px 0 10px 0;
- span {
- float: right;
- padding-right: 20px;
- box-sizing: border-box;
- }
- }
- }
- }
- .content-bottom {
- width: 100%;
- margin-top: 20px;
- overflow: hidden;
- .photo,
- .explain {
- float: left;
- width: 50%;
- }
- .photo {
- box-sizing: border-box;
- margin-bottom: 24px;
- p {
- margin-bottom: 10px;
- }
- span {
- float: right;
- padding-right: 20px;
- box-sizing: border-box;
- }
- }
- .explain {
- padding-right: 20px;
- box-sizing: border-box;
- .el-scrollbar {
- background: #f2f2f2;
- }
- p {
- margin-bottom: 10px;
- }
- .explain-content {
- padding: 10px;
- width: 100%;
- height: 290px;
- box-sizing: border-box;
- }
- }
- }
- }
- }
- .img-box {
- width: 100%;
- .img-content {
- overflow: hidden;
- position: relative;
- width: calc(100%-20px);
- height: 300px;
- vertical-align: middle;
- text-align: center;
- background: #ebeef5;
- margin-right: 20px;
- img {
- position: absolute;
- left: 50%;
- top: 50%;
- transform: translate(-50%, -50%);
- width: 400px;
- vertical-align: middle;
- }
- }
- }
- canvas {
- position: static !important;
- }
- </style>
|