EOC-UI/src/views/right/index.vue

<template>
  <div class="right_container">
    <reportHandle v-if="commonStore.activeIndex == 0"></reportHandle>
    <handleProcess v-if="commonStore.activeIndex == 1"></handleProcess>
    <warningDialog/>
  </div>
</template>
<script setup>
import { ref, watch, reactive, toRefs, onBeforeMount, onMounted } from "vue";
import reportHandle from "./components/reportHandle/index.vue";
import handleProcess from "./components/handleProcess/index.vue";
import warningDialog from "./components/warningDialog.vue";
import { useCommonStore } from "@/store/common.js";
let commonStore = useCommonStore();

//activeIndex: 0表示报告处置 1处置进展
watch(
  () => commonStore.activeIndex,
  (newActiveIndex, oldActiveIndex) => {
    console.log(newActiveIndex, "newActiveIndex");
  },
  {
    deep: true,
    // immediate: true
  }
);
</script>
<style lang="scss" scoped>
.right_container {
  box-sizing: border-box;
  color: aliceblue;
  * {
    box-sizing: border-box;
  }
}
</style>