update

gaosp

2024-01-14 48bc1beba0c69524a9c716f1a205e83a58c8171d

 src/container/Map/Map.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-13 23:22:52
 * @LastEditTime: 2024-01-14 15:07:18
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/Map/Map.vue
-->
<template>
@@ -16,13 +16,14 @@
                <div class="plant-name" v-if="status===2">{{plantName}}</div>
                <el-input class="plant-name" v-if="status!==2" v-model="plantName" placeholder="请输入厂名"/>
            </div>
            <div class="table" >
            <div class="table" :class="$route.name ==='preview' ? 'active' : ''" >
                <div class="table-action" :style="position" v-show="showAction && status !== 2">
                    <div @click="merge">合并</div>
                    <div @click="split">拆分</div>
                    <div @click="sign(1)">过道</div>
                    <div @click="sign(2)">机床</div>
                    <div @click="sign(0)">取消</div>
                    <div @click="edit" v-if="showEdit">修改机床</div>
                    <!-- <div>增加行</div> -->
                    <!-- <div>删除行</div> -->
                    <!-- <div>增加列</div> -->
@@ -70,16 +71,12 @@
                                </div> -->
                                <Device v-if="v.id" :id="v.id" style="width: 100%;height: 100%;"></Device>
                            </td>
                            <!-- <td></td> -->
                        </tr>
                        <!-- <tr>
                            <td></td>
                        </tr> -->
                    </table>
                </div>
            </div>
        </div>
        <addMachine :id="id" @setmachineId="setmachineId" v-else @close="close"/>
        <addMachine :id="id" :machineid="machineid" @setmachineId="setmachineId" v-else @close="close"/>
    </div>
    
</template>
@@ -114,6 +111,34 @@
        },
        id: {
            type: [Number,String]
        }
    },
    computed: {
        showEdit() {
            try {
                const { x, x1, y, y1 } = this.range
                if (this.range && x && x1 && y && y1) {
                    let start = this.map[x][y]
                    return this.map[x][y].id && (start.rowIndex + start.rowspan -1) === x1 && (start.colIndex + start.colspan -1) === y1
                }
            } catch (error) {
                return false
            }
        },
        machineid () {
            try {
                const { x, x1, y, y1 } = this.range
                if (this.range && x && x1 && y && y1) {
                    let start = this.map[x][y]
                     if (this.map[x][y].id && (start.rowIndex + start.rowspan -1) === x1 && (start.colIndex + start.colspan -1) === y1) {
                        return start.id
                    } else {
                        return ''
                    }
                }
            } catch (error) {
                return ''
            }
        }
    },
    data() {
@@ -180,6 +205,15 @@
                if (this.currentMap.length > 0) this.map = this.currentMap
                this.rows = this.currentMap.length;
                this.cols = this.currentMap[0].length;
                if (this.$route.name === 'preview') {
                    this.$nextTick(() => {
                            let {width} = document.querySelector('.table div').getBoundingClientRect()
                            console.log(document.querySelector('.table div').getBoundingClientRect())
                                // document.querySelector('.table').scrollLeft
                                // document.querySelector('.table').scrollTo({left: })
                    })
                }
               
            },
            immediate: true
        },
@@ -196,9 +230,8 @@
        try {
            this.height = (document.querySelector('.table').getBoundingClientRect().height - 30) / 20
        } catch (error) {
            
        }
        
        console.log(this.$route.name)
    },
    beforeUpdate() {
        try {
@@ -235,7 +268,8 @@
        },
        contextmenu(e) {
            console.log(e)
            if(this.status ===2) return 
            if(this.status ===2) return
            if (!this.range.x) return
            // if (this.range.x !=='') return 
            e.preventDefault()
            e.stopPropagation()
@@ -359,6 +393,11 @@
        close () {
            this.addStatus = false
        },
        edit (e) {
            if(this.status ===2) return 
            e.stopPropagation()
            this.addStatus = true
        },
        setmachineId (id) {
            console.log(id)
            if (!id) return
@@ -373,6 +412,19 @@
}
</script>
<style lang="scss" scoped>

@keyframes move {
    0% {
        // left: 100%;
        // transform: translate(0,0);
        // scrollTop: 0
    }
    100% {
        // left: 100%;
        // transform: translate(-100%,0);
        // scrollTop: 100%
    }
}
.map {
    width: 100%;
    height: 100%;
@@ -413,6 +465,11 @@
    }
}

.table.active {
    // position: relative;
    // left: 100%;
    // animation: move 6s infinite alternate;
}
.table {
    // margin-top: 10px;
    // display: flex;
@@ -421,6 +478,7 @@
    height: 100%;
    position: relative;
    overflow-x: scroll;
   
    .table-action {
        position: absolute;
        z-index: 999;