<template>
  <div style="padding-top: 13vw">
    <TopNav navTitle="应用中心" :showRight="false" :showLeft="false" />
    <YyzxItem title="置顶" :list="zdList.list" />
    <!-- <YyzxItem title="勤务中心" :list="qwzxList.list" />
    <YyzxItem title="预警中心" :list="yjzxList.list" />
    <YyzxItem title="指令中心" :list="zlzxList.list" /> -->
    <!-- <YyzxItem title="警情中心" :list="wqList.list" /> -->
    <!-- <YyzxItem title="核查中心" :list="hcList.list" /> -->
    <!-- <YyzxItem title="任务中心" :list="rwzxList.list" /> -->
    <!-- <YyzxItem title="公共应用" :list="ggyyList.list" /> -->
    <!-- 底部tas -->
    <BottomTabs type="yyzx" />
    <!-- 盘人 -->
    <checkedPeople ref="peo" :key="zdgzKey + 'pr'" />
    <!-- 盘车 -->
    <checkedCar ref="car" :key="zdgzKey + 'pc'" />

    <PcModel ref="dhcr" :key="zdgzKey + 'dhcr'"></PcModel>
    <div style="height: 14.8666vw"></div>
  </div>
</template>

<script setup>
import { ref, reactive, onMounted, onUnmounted, onActivated } from "vue";
import checkedCar from "../spsHome/components/checkCar.vue";
import checkedPeople from "../spsHome/components/checkPeople.vue";
import YyzxItem from "../../components/yyzxItem.vue";
import BottomTabs from "../../components/bottomTabs.vue";
import TopNav from "../../components/topNav.vue";
import PcModel from "../../components/pcModel.vue";
import emitter from "../../utils/eventBus.js";
import { onBeforeRouteLeave } from "vue-router";

const peo = ref(); //盘查人员组件对象
const car = ref(); //盘查车辆组件对象
const dhcr = ref(); //电话查人组件对象
const zdgzKey = ref(1);
const hcList = reactive({
  list: [
    {
      name: "人员盘查",
      imgUrl: require("../../assets/images/menu-yyhc.png"),
      path: "pr",
    },
    {
      name: "车辆盘查",
      imgUrl: require("../../assets/images/menu-clhc.png"),
      path: "pc",
    },
    {
      name: "人员盘查列表",
      imgUrl: require("../../assets/images/rypclb.png"),
      path: "/yyzx/views/pcry",
    },
    {
      name: "车辆盘查列表",
      imgUrl: require("../../assets/images/clpclb.png"),
      path: "/yyzx/views/clpc",
    },
    {
      name: "巡访管理",
      imgUrl: require("../../assets/images/11.png"),
      path: "/Declaration",
    },
  ],
});
const wqList = reactive({
  list: [
    {
      name: "警情统计",
      imgUrl: require("../../assets/images/menu-yjzl.png"),
      path: "/jqfx",
    },
    {
      name: "警情列表",
      imgUrl: require("../../assets/images/menu-yjzl.png"),
      path: "/yyzx/jqxx/index",
    },
  ],
});
const rwzxList = reactive({
  list: [
    {
      name: "任务统计",
      imgUrl: require("../../assets/images/rwtj.png"),
      path: "/yyzx/rwzx",
    },
    {
      name: "任务列表",
      imgUrl: require("../../assets/images/rwtj.png"),
      path: "/rwlist",
    },
  ],
});
const zlzxList = reactive({
  list: [
    {
      name: "指令统计",
      imgUrl: require("../../assets/images/menu-zlzx.png"),
      path: "/yyzx/zlzx/zlTotal",
    },
    {
      name: "指令列表",
      imgUrl: require("../../assets/images/menu-zlzx.png"),
      path: "/yyzx/zlzx/zlzxIndex",
    },
  ],
});
const yjzxList = reactive({
  list: [
    {
      name: "预警统计",
      imgUrl: require("../../assets/images/yjtj.png"),
      path: "/yyzx/yjxx/yjTotal",
    },
    {
      name: "预警列表",
      imgUrl: require("../../assets/images/menu-yjzx.png"),
      path: "/yyzx/yjxx/index",
    },
  ],
});
const qwzxList = reactive({
  list: [
    {
      name: "今日勤务",
      imgUrl: require("../../assets/images/qwtj.png"),
      path: "/qwCenter",
    },
    // 存在问题
    // {
    //   name: "历史勤务",
    //   imgUrl: require("../../assets/images/qwtj.png"),
    //   path: "/hisQwCenter",
    // },
    {
      name: "巡防报备",
      imgUrl: require("../../assets/images/menu-rwzx.png"),
      path: "/yyzx/xfbb/addXfbb",
    },
    {
      name: "临时勤务报备",
      imgUrl: require("../../assets/images/menu-rwzx.png"),
      path: "/yyzx/xfbb/addtsXfbb",
    },
    {
      name: "值班报备",
      imgUrl: require("../../assets/images/zbbb.png"),
      path: "/yyzx/views/addZbbb",
    },
    {
      name: "我的巡防",
      imgUrl: require("../../assets/images/xfbbqd.png"),
      path: "/calendar",
    },
    {
      name: "我的值班",
      imgUrl: require("../../assets/images/zbbb.png"),
      path: "/zbbbCalendar",
    },
    {
      name: "临时勤务列表",
      imgUrl: require("../../assets/images/menu-rwzx.png"),
      path: "/yyzx/xfbb/tsXfbbList",
    },
    {
      name: "部门值班",
      imgUrl: require("../../assets/images/zbbb.png"),
      path: "/deptzbbbCalendar",
    },
    {
      name: "部门巡防",
      imgUrl: require("../../assets/images/xfbbqd.png"),
      path: "/deptxfbbCalendar",
    },
    {
      name: "人员休假",
      imgUrl: require("../../assets/images/xfbbqd.png"),
      path: "/deptryxjCalendar",
    },
  ],
});
//置顶
const zdList = reactive({
  list: [
    {
      name: "人员盘查",
      imgUrl: require("../../assets/images/menu-yyhc.png"),
      path: "pr",
    },
    {
      name: "车辆盘查",
      imgUrl: require("../../assets/images/menu-clhc.png"),
      path: "pc",
    },
    {
      name: "打卡",
      imgUrl: require("../../assets/images/menu-dk.png"),
      path: "/clock",
    },
  ],
});
//公共应用
const ggyyList = reactive({
  list: [
    {
      name: "意见反馈",
      imgUrl: require("../../assets/yyzx/yjsj.png"),
      path: "/yjsj",
    },
    {
      name: "意见反馈统计",
      imgUrl: require("../../assets/images/yjfktj.png"),
      path: "/xttj",
    },
  ],
});
onActivated(() => {
  zdgzKey.value++;
});
onMounted(() => {
  zdgzKey.value++;
  //点击盘查功能
  emitter.on("onClickPc", (res) => {
    if (res == "pr") {
      checkPeople();
    } else if (res == "/dhcr") {
      checkDhcr();
    } else {
      checkCar();
    }
  });
});
onUnmounted(() => {
  emitter.off("onClickPc");
  localStorage.removeItem('XF_Active')
});
//点击盘人
function checkPeople() {
  peo.value.handleOpen();
}
//点击盘车
function checkCar() {
  car.value.handleOpen();
}
// 点击电弧查人
function checkDhcr() {
  dhcr.value.peoplePopupShow = true;
}
</script>

<style lang="scss" scoped>
</style>
