添加删除

gaosp

2024-03-10 124fcd3d7827fc42e01e21682eeb9c3767311d41

添加删除

 src/container/Map/Map.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-03-08 09:11:52
 * @LastEditTime: 2024-03-10 19:48:38
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/Map/Map.vue
-->
<template>
@@ -24,11 +24,13 @@
                <!-- <el-button class="input" size="mini" type="primary" v-show="status !== 2" @click="createMap">生成地图</el-button> -->
            </div>
            <div class="table" :class="$route.name === 'preview' ? 'active' : ''">
                <div class="table-actions" :style="position" v-show="showAction && status !== 2">
                <div class="table-actions" :style="position" v-show="showAction">
                    <div @click="merge">合并</div>
                    <div @click="split">拆分</div>
                    <div @click="addRow">增加行</div>
                    <div @click="addCol">增加列</div>
                    <div @click="delRow">删除行</div>
                    <div @click="delCol">删除列</div>
                    <div @click="sign(1)">过道</div>
                    <div @click="sign(2)">设备</div>
                    <div @click="sign(0)">移除</div>
@@ -44,7 +46,7 @@
                                <div class="td-div"
                                    :style="{ width: v.colspan * height - 2 + 'px', height: v.rowspan * height - 2 + 'px', overflow: 'hidden' }">
                                    <img @click="addDevice($event, v)" @mousedown="e => e.stopPropagation()"
                                        v-if="v.type === 2 && status !== 2 && !v.id" src="./img/+.png" alt="添加机床"
                                        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%;"
                                        :deviceList="deviceList" :plantDeviceList="plantDeviceList" ::info="info"></Device>
@@ -246,7 +248,7 @@
    mounted() {
        this.$el.querySelector('table').addEventListener('contextmenu', this.contextmenu)
        this.$el.addEventListener('mouseup', e => {
            if (this.status === 2) return
            // if (this.status === 2) return
            this.tdMounseDown = false
        })
        try {
@@ -271,6 +273,53 @@
        }
    },
    methods: {
        delRow ()  {
            console.log(this.selection,this.select,this.map)
            if (this.selection.length  == 1 && this.selection[0].rowspan ==1 && this.selection[0].colspan == 1) {
                let rowIndex = this.selection[0].rowIndex
                let flag = this.map[rowIndex].some(v => v.rowspan != 1 || v.colspan != 1)
                if (flag) {
                    this.$message({
                        type: 'error',
                        message: '有合并行不可删除'
                    });
                } else {
                    this.map.splice(rowIndex,1)
                    this.map.forEach((v,i) =>  {
                        if (i>=rowIndex) {
                            v.forEach((c,j) => {
                                c.rowIndex -= 1
                            })
                        }
                    })
                    this.showAction = false
                }
            }
        },
        delCol ()  {
            if (this.selection.length  == 1 && this.selection[0].rowspan ==1 && this.selection[0].colspan == 1) {
                let colIndex = this.selection[0].colIndex
                let flag = this.map.some(v => v[colIndex].rowspan != 1 || v[colIndex].colspan != 1)
                if (flag) {
                    this.$message({
                        type: 'error',
                        message: '有合并行不可删除'
                    });
                } else {
                    this.map.forEach(v=>{
                        v.splice(colIndex,1)
                    })
                    this.map.forEach((v,i) =>  {
                        v.forEach((c,j) => {
                            if (j >= colIndex) {
                                c.colIndex -= 1
                            }
                        })
                    })
                    this.showAction = false
                }
            }
        },
        back() {
            this.$router.push({
                name: 'mapList'
@@ -346,7 +395,7 @@
        },
        contextmenu(e) {
            console.log(e)
            if (this.status === 2) return
            // if (this.status === 2) return
            if (this.range.x === undefined) return
            // if (this.range.x !=='') return 
            e.preventDefault()
@@ -365,7 +414,9 @@
                    top: top + 10 + 'px'
                }
            }

            if (window.innerHeight - top < 300) {
                this.position.top = window.innerHeight -  300 + 'px'
            }
        },
        onMousedown(e, v) {
            console.log('-----', v)
@@ -375,7 +426,7 @@
            this.selection = [v]
        },
        onMouseMove(e, v) {
            if (this.status === 2) return
            // if (this.status === 2) return
            if (!this.tdMounseDown) return
            this.$set(this.selection, 1, v)
        },