water_maintenance/src/components/ThreeWorldEventQingXiCheAndQv/DemoEvent.vue

<script setup>
import { QingXiCheAndQvMyThreeWorldStore } from "./store/QingXiCheAndQvMyThreeWorldStore.js";
import { QingXiCheAndQvCarEvent } from "./js/QingXiCheAndQvCarEvent.js";
import { QingXiCheAndQvThreeWorldEventMain } from "./js/QingXiCheAndQvThreeWorldEventMain.js";
import { QingXiCheAndQvProcessEventStore } from "./event/store/QingXiCheAndQvProcessEventStore.js";

/**
 * 切换菜单，触发不同逻辑
 * name         切换的菜单
 */
const menuEvent = (name) => {

    for (let key in QingXiCheAndQvMyThreeWorldStore().obj.menu) {
        QingXiCheAndQvMyThreeWorldStore().obj.menu[key] = false;
    }

    QingXiCheAndQvMyThreeWorldStore().obj.menu[name] = true;

    // console.log(
    //     "QingXiCheAndQvMyThreeWorldStore().obj.menu", QingXiCheAndQvMyThreeWorldStore().obj.menu
    // );
    
    // 城市供水管道巡查调度虚拟仿真
    if (QingXiCheAndQvMyThreeWorldStore().obj.menu.mapGps == true) {

        return;
    }

    // 城市供水管道维护清洗虚拟仿真
    if (QingXiCheAndQvMyThreeWorldStore().obj.menu.waterPipe == true) {
        // QingXiCheAndQvCarEvent.find().evnetInit_1();

        // 自动触发到第1个步骤
        QingXiCheAndQvProcessEventStore().obj.listIndex = 0;
        // 进入触发当前步骤的逻辑
        QingXiCheAndQvCarEvent.find().typeEvent(
            QingXiCheAndQvProcessEventStore().obj.list[QingXiCheAndQvProcessEventStore().obj.listIndex].name
        );

        // 上一步按钮是否展示
        QingXiCheAndQvCarEvent.find().tipsBtnsUpOpenEventCallback = function(openBool) {
            QingXiCheAndQvProcessEventStore().obj.btnUp = openBool;
        };

        // 下一步按钮是否展示
        QingXiCheAndQvCarEvent.find().tipsBtnsDownOpenEventCallback = function(openBool) {
            QingXiCheAndQvProcessEventStore().obj.btnDown = openBool;
        };

        setTimeout(function() {
            QingXiCheAndQvThreeWorldEventMain.find().commonBirthplaceUpdate();
        }, 1600);
        
        return;
    }

    // 城市供水管道检测虚拟仿真
    if (QingXiCheAndQvMyThreeWorldStore().obj.menu.look == true) {

        return;
    }

    // 城市供水管道数智修复虚拟仿真
    if (QingXiCheAndQvMyThreeWorldStore().obj.menu.repair == true) {

        return;
    }

    // 回到人物视角
    if (QingXiCheAndQvMyThreeWorldStore().obj.menu.roleLook == true) {
        QingXiCheAndQvThreeWorldEventMain.find().toRoleEvent();
        return;
    }
    
}

</script>

<template>
    
    <div class="DemoEvent">
        
        <div class="main">

            <div class="btnDemo" v-on:click="menuEvent('mapGps')" >城市供水管道巡查调度虚拟仿真</div>
            <div class="btnDemo" v-on:click="menuEvent('waterPipe')" >城市供水管道维护清洗虚拟仿真</div>
            <div class="btnDemo" v-on:click="menuEvent('look')" >城市供水管道检测虚拟仿真</div>
            <div class="btnDemo" v-on:click="menuEvent('repair')" >城市供水管道数智修复虚拟仿真</div>
            <div class="btnDemo" v-on:click="menuEvent('roleLook')" >回到人物视角</div>

        </div>

    </div>

</template>

<style lang="less" scoped>

.DemoEvent * {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;
    user-select: none;
}

.DemoEvent {

    position: fixed;
    top: 0px;
    right: 0px;
    width: 0px;
    height: 0px;

    .main {

        position: fixed;
        top: 10px;
        left: 10px;
        z-index: 30;
        
        .btnDemo {
            float: left;
            margin: 5px;
            font-size: 16px;
            padding: 5px;
            background-color: #ffffff;
            border-radius: 3px;
            display: inline-flex;
            cursor:pointer;
        }

    }

}

</style>