添加暂停

gaosp

2024-01-20 e1d305b8308402c7ba985a243a123c09df66b0d9

添加暂停

 src/container/mapPreview/Map.vue

@@ -1,14 +1,14 @@
<!--
 * @Date: 2024-01-05 23:47:53
 * @LastEditors: Sneed
 * @LastEditTime: 2024-01-20 20:44:04
 * @LastEditTime: 2024-01-20 20:51:28
 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/mapPreview/Map.vue
-->
<template>
    <div class="map">
        <div class="map-container">
            <div class="table" :class="$route.name ==='preview' ? 'active' : ''" >
                <div :style="{width: (cols * height + 'px'),height: rows * height + 'px',marginLeft: -marginLeft + 'px'}">
                <div @mouseenter="mouseenter" @mouseleave="mouseleave" :style="{width: (cols * height + 'px'),height: rows * height + 'px',marginLeft: -marginLeft + 'px'}">
                    <table >
                        <tr v-for="(item, index) in map" :key="index">
                            <td v-if="v.rowspan !==0 && v.colspan!==0"
@@ -70,7 +70,8 @@
            cols: 50,
            map: null, // 地图数据
            leftMax: 0,
            marginLeft: 0
            marginLeft: 0,
            direction: true
        }
    },
    watch: {
@@ -114,18 +115,34 @@
    },
    methods: {
        moveFn () {
            if (this.marginLeft < this.leftMax) {
                this.marginLeft += 5
            if (this.marginLeft <= this.leftMax && this.marginLeft >= -5) {
                if (this.direction) {
                    this.marginLeft += 5
                } else {
                    this.marginLeft -= 5
                }
                
                timer = setTimeout(() => {
                    this.moveFn()
                }, 30)
            } else if (this.marginLeft >= this.leftMax){
                this.marginLeft = 0
            } else {
                this.direction = !this.direction
                if (this.direction) {
                    this.marginLeft += 5
                } else {
                    this.marginLeft -= 5
                }
                timer = setTimeout(() => {
                    this.moveFn()
                }, 30)
            }
        },
        mouseenter () {
            clearTimeout(timer)
        },
        mouseleave () {
            this.moveFn()
        },
        toDetail (v) {
            this.$router.push({
                name: 'mapPreviewDetail',