<template>
  <div class="personnel-status">
    <ChannelOpeningSituation :channelCountInfo="channelCountData" />
    <PersonnelOnDutySituation :personnelCountInfo="personnelCountData" />
  </div>
  <div class="information-details">
    <WorkDetails v-model="detailsInfo" />
  </div>

</template>

<script setup>
import { ref } from 'vue';
import { getChannelStatistics } from '@/api/item/items'
import {
  ChannelOpeningSituation,
  PersonnelOnDutySituation,
  WorkDetails
} from './index';
import { useTimeOut } from './useTimeOut'

const channelCountData = ref({
  allData: 0, // 全部通道
  openRate: 0, // 开放率
  openData: 0,  // 开放通道数
  closeData: 0, // 未开放通道数
  barGrounp: [ 'T2航站楼', 'T1航站楼' ],
  barOpenData: [ 0, 0 ],
  barCloseData: [ -0, -0 ],
  hasValidData: true
})

const personnelCountData = ref({
  allData: 0, // 全部人数
  openRate: 0, // 在岗率
  openData: 0,  // 在岗人数
  closeData: 0, // 空闲人数
  barGrounp: [ 'T2航站楼', 'T1航站楼' ],
  barOpenData: [ 0, 0 ],
  barCloseData: [ -0, -0 ],
  hasValidData: true
})

const detailsInfo = ref([])


const setChannelCountInfo = (result) => {
  const { channelCount, maintainCount, onDutyCount, terminlDetail } = result;
  const channelCountInfo = {
    barGrounp: [ 'T2航站楼', 'T1航站楼' ],
  }
  // 开放通道信息 饼图数据
  channelCountInfo.allData = channelCount
  channelCountInfo.openData = terminlDetail.reduce((item, cur) => {
    return item + cur.onDutyChannelCount;
  }, 0);
  channelCountInfo.openRate = Math.round((channelCountInfo.openData / channelCountInfo.allData) * 10000) / 100;

  channelCountInfo.closeData = channelCountInfo.allData - channelCountInfo.openData;
  // 检查数据是否有效
  channelCountInfo.hasValidData = channelCountInfo.openData > 0 || channelCountInfo.closeData > 0;
  // 开放通道信息 柱状图数据
  let barT1 = terminlDetail && Array.isArray(terminlDetail)
    ? terminlDetail.filter(item => item.terminlName === channelCountInfo.barGrounp[ 1 ])[ 0 ]
    : null;
  let barT2 = terminlDetail && Array.isArray(terminlDetail)
    ? terminlDetail.filter(item => item.terminlName === channelCountInfo.barGrounp[ 0 ])[ 0 ]
    : null;

  let batT1Open = barT1?.onDutyChannelCount;//T1航站楼开放人数
  let batT2Open = barT2?.onDutyChannelCount;//T2航站楼开放人数
  let batT1Close = barT1 ? barT1.channelCount - barT1.onDutyChannelCount : 0;//T1航站楼未开放人数
  let batT2Close = barT2 ? barT2.channelCount - barT2.onDutyChannelCount : 0;//T2航站楼未开放人数
  channelCountInfo.barOpenData = [ batT2Open > 0 ? -batT2Open : 0, batT1Open > 0 ? -batT1Open : 0 ]
  channelCountInfo.barCloseData = [ batT2Close, batT1Close ]
  
  channelCountData.value = channelCountInfo

}
const setPersonnelCountInfo = (result) => {
  const { channelCount, maintainCount, onDutyCount, terminlDetail } = result;
  const personnelCountInfo = {
    barGrounp: [ 'T2航站楼', 'T1航站楼' ],
  }
  // 开放通道信息 饼图数据
  personnelCountInfo.allData = maintainCount

  personnelCountInfo.openData = terminlDetail.reduce((item, cur) => {
    return item + cur.onDutyCount;
  }, 0);
  personnelCountInfo.openRate = Math.floor((personnelCountInfo.openData / personnelCountInfo.allData) * 10000) / 100;

  personnelCountInfo.closeData = personnelCountInfo.allData - personnelCountInfo.openData;
  // 检查数据是否有效
  personnelCountInfo.hasValidData = personnelCountInfo.openData > 0 || personnelCountInfo.closeData > 0;
  // 开放通道信息 柱状图数据
  let barT1 = terminlDetail && Array.isArray(terminlDetail)
    ? terminlDetail.filter(item => item.terminlName === personnelCountInfo.barGrounp[ 1 ])[ 0 ]
    : null;
  let barT2 = terminlDetail && Array.isArray(terminlDetail)
    ? terminlDetail.filter(item => item.terminlName === personnelCountInfo.barGrounp[ 0 ])[ 0 ]
    : null;
  let batT1NormalPerson = barT1?.onDutyCount;//T1航站楼在岗人数
  let batT2NormalPerson = barT2?.onDutyCount;//T2航站楼在岗人数
  let batT1FreePerson = barT1 ? barT1.openChannelCount - barT1.onDutyCount : 0;//T1航站楼空闲人数
  let batT2FreePerson = barT2 ? barT2.openChannelCount - barT2.onDutyCount : 0;//T2航站楼空闲人数
  personnelCountInfo.barOpenData = [
    batT2NormalPerson > 0 ? -batT2NormalPerson : 0,
    batT1NormalPerson > 0 ? -batT1NormalPerson : 0 
  ]
  personnelCountInfo.barCloseData = [ batT2FreePerson, batT1FreePerson ]

  personnelCountData.value = personnelCountInfo
}

useTimeOut(() => {
  getChannelStatistics(2).then((result) => {
    detailsInfo.value = result.terminlDetail.map(acc => {
      const itemDataOptions = (acc.region || []).map(item => ({
        label: item.regionalName,
        value: item.regionalCode,
        data: item.detailList || []
      }))
      return {
        onDutyChannelCount: acc.onDutyChannelCount,
        name: acc.terminlName,
        options: itemDataOptions,
        stateOptions: [ '在岗', '空闲' ],
        stateActive: '在岗',
        active: itemDataOptions[ 0 ] ? itemDataOptions[ 0 ].value : '',
        data: itemDataOptions[ 0 ] ? itemDataOptions[ 0 ].data : [],
        waitList: acc.waitList
      }
    })
    setChannelCountInfo(result)
    setPersonnelCountInfo(result)
  })
})

</script>

<style lang="scss" scoped>
.public-inheritance-style {
  width: 100%;
  display: flex;
  column-gap: 10px;
}

.personnel-status {
  @extend .public-inheritance-style;
  min-height: 420px;
  height: 40%;

}

.information-details {
  @extend .public-inheritance-style;
  flex: 1;
  overflow: hidden;
}
</style>