修改标题错误

yangys

2024-01-16 c5488b34876f863558219f998e75c798c34af3cd

 src/container/Map/Map.vue

@@ -1,20 +1,24 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-14 15:07:18
 * @LastEditTime: 2024-01-16 01:03:35
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/Map/Map.vue
-->
<template>
    <div class="map">
        <div class="map-container" v-if="!addStatus">
            <div class="table-tool" v-if="status !== 2">
                <el-button style="width: 150px;" type="primary" size="mini" @click="save">保存</el-button>
                <el-button style="width: 150px;" size="mini" @click="out">退出</el-button>
                <el-input v-show="status !==2" v-model="rows" />
                <el-input v-show="status !==2" v-model="cols" />
                <el-button size="mini" v-show="status !==2" @click="createMap">生成地图</el-button>
                <div class="plant-name" v-if="status===2">{{plantName}}</div>
                <el-input class="plant-name" v-if="status!==2" v-model="plantName" placeholder="请输入厂名"/>
        <div class="map-container">
            <div class="table-tool">
                <slot name="tool"></slot>
                <el-button v-show="!id" class="input" type="primary" size="mini" @click="out">退出</el-button>
                <el-button class="input" type="primary" size="mini" @click="save">保存</el-button>
                <el-button v-show="id" class="input" type="primary" size="mini" @click="del">删除</el-button>
                <el-button class="input" size="mini" type="primary" v-show="status !==2" @click="createMap">生成地图</el-button>
                <span>行数:</span>
                <el-input class="input" v-show="status !==2" v-model="rows" />
                <span>列数:</span>
                <el-input class="input" v-show="status !==2" v-model="cols" />
                <!-- <div class="plant-name" v-if="status===2">{{plantName}}</div> -->
                <el-input class="plant-name" v-model="plantName" placeholder="请输入厂名"/>
            </div>
            <div class="table" :class="$route.name ==='preview' ? 'active' : ''" >
                <div class="table-action" :style="position" v-show="showAction && status !== 2">
@@ -23,11 +27,6 @@
                    <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> -->
                    <!-- <div>删除列</div> -->
                </div>
                <div :style="{width: (cols * height + 'px'),height: rows * height + 'px'}">
                    <table >
@@ -37,48 +36,29 @@
                            :height="v.rowspan* height + 'px'"
                            :class="{'active': (range.x !=='' && v.rowIndex >=range.x && v.rowIndex<=range.x1 && v.colIndex>=range.y && v.colIndex<=range.y1),aisle: v.type ===1}" @mousedown="e => onMousedown(e, v)" @mousemove="e => onMouseMove(e, v)" v-for="v in item"
                                :rowspan="v.rowspan" :colspan="v.colspan" :key="v.rowIndex + '-' + v.colIndex">
                                <img @click="addDevice($event,v)" @mousedown="e => e.stopPropagation()" v-if="v.type ===2 && status!==2 && !v.id" src="./img/+.png" alt="">
                                <!-- <div  v-show="v.id" class="machine">
                                    <p>YKX123123213</p>
                                    <div>
                                        <div class="img">
                                            <img src="./img/machine.png" alt="">
                                        </div>
                                        <ul>
                                            <li>
                                                <img src="./img/sd.png" alt="">
                                                <div>
                                                    <p>0.00%</p>
                                                    <p>能力利用率</p>
                                                </div>
                                            </li>
                                            <li>
                                                <img src="./img/sd.png" alt="">
                                                <div>
                                                    <p>0.00%</p>
                                                    <p>能力利用率</p>
                                                </div>
                                            </li>
                                            <li>
                                                <img src="./img/sd.png" alt="">
                                                <div>
                                                    <p>0.00%</p>
                                                    <p>能力利用率</p>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div> -->
                                <Device v-if="v.id" :id="v.id" style="width: 100%;height: 100%;"></Device>
                                <img @click="addDevice($event,v)" @mousedown="e => e.stopPropagation()" v-if="v.type ===2 && status!==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>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
        <addMachine :id="id" :machineid="machineid" @setmachineId="setmachineId" v-else @close="close"/>
        <el-dialog
        title="添加设备"
        :close-on-click-modal="false"
        width="20%"
        :visible.sync="addStatus">
        <el-select class="wkshoplist" clearable v-model="deviceId" placeholder="请选择">
            <el-option v-for="item in deviceList" :key="item.machineId" :label="item.machineName" :value="item.machineId">
            </el-option>
        </el-select>
        <span slot="footer" class="dialog-footer">
            <el-button size="mini" type="primary" style="background-color: #409EFF;" @click="saveDevice">保存</el-button>
        </span>
      </el-dialog>
    </div>
    
</template>
<script>
const getParent = (v, layout) => {
@@ -89,13 +69,13 @@
    }
}
import mixins  from '@/mixins/index'
import AddMachine from './addMachine.vue'
// import AddMachine from './addMachine.vue'
import Device from '../workshop/device.vue'
import  {mapGetters} from 'vuex'
export default {
    mixins: [mixins],
    components: {
        AddMachine,
        // AddMachine,
        Device
    },
    props: {
@@ -199,8 +179,23 @@
            },
            immediate: true
        },
        id (val) {
            if (!val) {
                this.map = []
            }else {
                // getRequest('machineList',{plantId: val}).then(res => {
                //         this.plantDeviceList = res.list.map(item => {
                //             return {
                //                 machineId: item.id,
                //                 machineName: item.machineName
                //             }
                //         }) || []
                //     })
            }
        },
        currentMap: {
            handler () {
                console.log(this.currentMap)
                if (!this.currentMap || this.currentMap.length === 0) return
                if (this.currentMap.length > 0) this.map = this.currentMap
                this.rows = this.currentMap.length;
@@ -249,27 +244,38 @@
        }
    },
    methods: {
        createMap() {
            let data = []
            for (var i = 0; i < this.rows; i++) {
                let arr = []
                for (var j = 0; j < this.cols; j++) {
                    arr.push({
                        rowspan: 1,
                        colspan: 1,
                        rowIndex: i,
                        colIndex: j,
                        type: ''
                    })
                }
                data.push(arr)
        async createMap() {
            let res=true
            if (this.id) {
                res = await this.$confirm('生成地图将覆盖当前所有设置，确定重新生成?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                })
                console.log(res)
            }
            this.map = data
            if (res || res === 'confirm') {
                let data = []
                for (var i = 0; i < this.rows; i++) {
                    let arr = []
                    for (var j = 0; j < this.cols; j++) {
                        arr.push({
                            rowspan: 1,
                            colspan: 1,
                            rowIndex: i,
                            colIndex: j,
                            type: ''
                        })
                    }
                    data.push(arr)
                }
                this.map = data
            }
        },
        contextmenu(e) {
            console.log(e)
            if(this.status ===2) return
            if (!this.range.x) return
            if (this.range.x === undefined) return
            // if (this.range.x !=='') return 
            e.preventDefault()
            e.stopPropagation()
@@ -279,12 +285,12 @@
            if (window.innerWidth - left < 100) {
                this.position = {
                    right: 0,
                    top: top - t + 10 + 'px'
                    top: top + 10 + 'px'
                }
            } else {
                this.position = {
                    left: left + 'px',
                    top: top -t + 10 + 'px'
                    top: top + 10 + 'px'
                }
            }
            
@@ -354,6 +360,7 @@
                for(var j=y;j<=y1;j++) {
                    let arr = [...(this.map[i])]
                    arr[j].type = type
                    arr[j].id = undefined
                    this.$set(this.map,i,arr)
                }
            }
@@ -361,26 +368,62 @@
            this.$forceUpdate()
        },
        addDevice (e,v) {
            if(this.status ===2) return 
            e.stopPropagation()
            this.addStatus = true
            this.deviceId = ''
            this.currentAdd =  v
        },
        del () {
            this.$confirm('确定要永久删除此厂房，关联的设备将重置?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(res => {
                this.$http.postJson('/plant/delete',{
                    ids: [this.id]
                }).then(res => {
                    this.$message({
                        type: 'info',
                        message: '删除成功'
                    })
                    this.$emit('out')
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '删除失败'
                    })
                })
            }, () => {
                this.$message({
                    type: 'info',
                    message: '取消删除'
                })
            })
            
        },
        save () {
            if (this.status === 0) {
            if (!this.id) {
                this.$http.postJson('/plant/save',{
                    name: this.plantName,
                    gridSetting: JSON.stringify(this.map)
                }).then(res => {
                    this.$message({
                    type: 'info',
                        message: '操作成功'
                    })
                    this.$emit('out')
                    console.log(res)
                })
            } else if(this.status === 1) {
            } else {
                this.$http.postJson('/plant/modify',{
                    name: this.plantName,
                    gridSetting: JSON.stringify(this.map),
                    id: this.id
                }).then(res => {
                    this.$message({
                    type: 'info',
                        message: '操作成功'
                    })
                    this.$emit('out')
                    console.log(res)
                })
@@ -393,20 +436,28 @@
        close () {
            this.addStatus = false
        },
        edit (e) {
            if(this.status ===2) return 
            e.stopPropagation()
            this.addStatus = true
        saveDevice () {
            this.setmachineId(this.deviceId)
        },
        setmachineId (id) {
            console.log(id)
            if (!id) return
            let i = this.currentAdd.rowIndex
            let j = this.currentAdd.colIndex
            let arr = [...(this.map[i])];
            arr[j].id = id
            this.$set(this.map,i,arr)
            this.close()
            try {
                let i = this.currentAdd.rowIndex
                let j = this.currentAdd.colIndex
                let arr = [...(this.map[i])];
                arr[j].id = id
                this.$set(this.map,i,arr)
                this.$message({
                    type: 'info',
                    message: '操作成功'
                })
            } catch (error) {
                this.$message({
                    type: 'info',
                    message: '操作失败，请重试'
                })
            }
            this.addStatus = false
        }
    },
}
@@ -444,15 +495,18 @@
    padding-bottom: 50px;
    display: flex;
    justify-content: flex-start;

    &>div {
        width: 80px;
    color: #fff;
    font-size: 12px;
    align-items: center;
    &>.input {
        min-width: 80px;
        max-width: 200px;
        margin-inline: 10px;
    }
    .plant-name {
        width: 120px;
        margin-left: auto;
        margin-right: 30px;
        margin-left: 20px;
        // margin-right: 30px;
        text-align: center;
        line-height: 28px;
        background: rgba(23,38,67,0.6);
@@ -480,7 +534,7 @@
    overflow-x: scroll;
   
    .table-action {
        position: absolute;
        position: fixed;
        z-index: 999;
        color: #fff;
        width: 100px;