更新地图

gaosp

2024-03-12 6b6a9ce33453a5ec9ca8346df39a7a610042424c

更新地图

 src/container/Map/Map.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-11 07:45:57
 * @LastEditTime: 2024-03-12 20:46:54
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/Map/Map.vue
-->
<template>
@@ -48,7 +48,7 @@
                                    <img @click="addDevice($event, v)" @mousedown="e => e.stopPropagation()"
                                        v-if="v.type === 2 && !v.id" src="./img/+.png" alt="添加机床"
                                        title="添加机床">
                                    <Device v-if="v.id" :id="v.id" style="width: 100%;height: 100%;"
                                    <Device v-if="v.id" :id="v.id"
                                        :deviceList="deviceList" :plantDeviceList="plantDeviceList" ::info="info"></Device>
                                </div>
                            </td>

 src/container/mapPreview/Map.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-08 09:12:55
 * @LastEditTime: 2024-03-12 20:18:34
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/mapPreview/Map.vue
-->
<template>
@@ -16,7 +16,7 @@
                                :width="v.colspan * height + 'px'" :height="v.rowspan * height + 'px'" v-for="v in item"
                                :rowspan="v.rowspan" :colspan="v.colspan" :key="v.rowIndex + '-' + v.colIndex">
                                <div class="td-div" :style="{width:v.colspan * height - 2 + 'px',height: v.rowspan * height - 2 + 'px',overflow:'hidden'}">
                                    <Device @toDetail="toDetail(v)" v-if="v.id" :id="v.id" style="width: 100%;height: 100%;"
                                    <Device @toDetail="toDetail(v)" v-if="v.id" :id="v.id"
                                        :deviceList="deviceList" :plantDeviceList="plantDeviceList"></Device>
                                </div>
                            </td>

 src/container/mapPreview/mapPreview.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-08 09:12:51
 * @LastEditTime: 2024-03-12 20:47:05
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/mapPreview/mapPreview.vue
-->
<template>
@@ -69,7 +69,7 @@
                                        </ul>
                                    </div>
                                </div> -->
                                <Device v-if="v.id" :id="v.id" style="width: 100%;height: 100%;"></Device>
                                <Device v-if="v.id" :id="v.id"></Device>
                            </td>
                        </tr>
                    </table>

 src/container/mapPreviewDetail/index.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-05 22:26:22
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-08 09:07:05
 * @LastEditTime: 2024-03-12 21:10:54
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/mapPreviewDetail/index.vue
-->
<template>
@@ -294,7 +294,7 @@
            } catch (error) {
                this.deviceInfo = {}
            }
            this.name = `车间列表 / ${this.$route.query.name} / ${this.deviceInfo.machineName}`
            this.name = `车间列表 / ${this.$route.query.name ? this.$route.query.name + '/'  : ''} ${this.deviceInfo.machineName}`
        },
        formatSeconds(value) {
            var secondTime = parseInt(value)// 秒

 src/container/workshop/device.vue

@@ -1,13 +1,13 @@
<!--
 * @Date: 2024-01-13 20:46:33
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-11 19:20:55
 * @LastEditTime: 2024-03-12 21:38:38
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/workshop/device.vue
-->
<template>
    <div class="device-item">
        <el-checkbox v-show="canconcern" class="care" v-model="concern" @change="change"></el-checkbox>
        <p>{{ machineName }}</p>
        <p class="device-item-title">{{ machineName }}</p>
        <div class="device-item-box" @click="toDetail">
            <div class="img">
                <span class="img-status" v-if="item.status === 'STOP'">停机</span>
@@ -45,6 +45,7 @@
<script>
import { getRequest, getUrl } from '@/api/Api'
import devicePng from './img/machine.png'
// import { transform } from 'babel-core'
export default {
    props: {
        canconcern: {
@@ -76,7 +77,7 @@
    data() {
        return {
            devicePng,
            scale: 1,
            scale: 'scale(1)',
            concern: false,
            item: {}
        }
@@ -139,11 +140,14 @@
    },
    mounted () {
        this.concern = !!this.info.concern
        console.log(this.$el.getBoundingClientRect().width,'/////',this.$el.getBoundingClientRect().width / 200)
        // console.log(this.$el.getBoundingClientRect(),'>>>>>>>')
        // this.scale = `scale(${Math.min(this.$el.getBoundingClientRect().width,this.$el.getBoundingClientRect().height) / 394})`
        // console.log(this.$el.parent().getBoundingClientRect().width,this.$el.parent().getBoundingClientRect().heightm,'/////',`transform:scale(${Math.min(this.$el.getBoundingClientRect().width,this.$el.getBoundingClientRect().height) / 394})`)
        this.$nextTick(() => {
            //if (this.$el.getBoundingClientRect().width <  400) {
                //this.$el.querySelector('.device-item-box').style = `transform:scale(${this.$el.getBoundingClientRect().width / 360})`
            //}
            if (this.$el) {
                
                // console.log('????',this.scale)
            }
        })
        
        
@@ -169,15 +173,20 @@
.device-item {
    width: 100%;
    height: 100%;
    max-width: 394px;
    max-height: 394px;
    // max-width: 394px;
    // max-height: 394px;
    border-radius: 10px;
    border: 1px solid #3C4249;
    padding: 20px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    position: relative;
    p {
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    &-title {
        font-size: 20px;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
@@ -222,17 +231,19 @@
    }

    &>div.device-item-box {
        min-width: 100px;
        width: 100%;
        // min-width: 100px;
        flex: 1 1 auto;
        margin-top: 20px;
        // margin-top: 20px;
        display: flex;
        align-items: center;
        margin-bottom: 20px;
        // margin-bottom: 20px;
        overflow: hidden;
        .img {
            // min-width: 100px;
            width: 60%;
            width: 50%;
            height: 150px;
            border: 1px solid #444C55;
            // border: 1px solid #444C55;
            border-radius: 10px;
            position: relative;
            flex: 0 0 auto;
@@ -283,6 +294,7 @@
            flex-direction: column;
            align-items: center;
            justify-content: space-around;
            overflow: hidden;

            li {
                width: 100%;
@@ -291,11 +303,15 @@
                align-items: center;

                &>div {
                    margin-left: 10px;
                    ;
                    padding-left: 10px;
                    flex:  1 1 auto;
                }

                p {
                    width: 100%;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    color: #E9FFFF;
                    text-shadow: 0px 1px 11px #549BD4;
                }

 src/container/workshop/index.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-06 17:40:19
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-11 19:15:23
 * @LastEditTime: 2024-03-11 19:38:21
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/workshop/index.vue
-->
<template>