<template>
<div class="yjclqkBox" id="yjqktj">
    <div class="asideTitle">
        <span class="title">预警处理情况统计</span>
        <span style="color:#00B7FF;" class="f12 pointer">查看更多 》</span>
    </div>
    <div class="asideCnt">
        <MyTable  :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger"/>
      </div>
</div>
</template>

<script setup>
import MyTable from "@/components/aboutTable/DarkTable.vue";
import { reactive, ref,onMounted } from "vue";
const pageData = reactive({
  tableData: [
    { mc: "聚集事件", rs: "30", sj: "2024-10-10" },
    { mc: "聚集事件", rs: "30", sj: "2024-10-10" },


  ],
  keyCount: 0,
  tableConfiger: {
    loading: false,
    rowHieght: 61,
    haveControls: false,
    showSelectType: "null",
    stripe:true
  },
  total: 0,
  pageConfiger: {
    pageSize: 20,
    pageNum: 1
  }, //分页
  tableColumn: [
    { label: "任务名称", prop: "mc", showOverflowTooltip: true },
    { label: "已稳控人数", prop: "rs",showOverflowTooltip: true },
    { label: "时间", prop: "sj",showOverflowTooltip: true },
  ]
});
onMounted(() => {
  tabHeightFn();
  window.onresize = function () {
    tabHeightFn();
  };
});

const changeDate = (val) =>{
    active.value = val;
}
// 滚动分页加载
const changePage = () =>{

}
// 表格高度计算
const tabHeightFn = () => {
  pageData.tableHeight =  document.getElementById('yjqktj').offsetHeight - 40;
};

</script>
<style lang="scss" scoped>
@import "@/assets/css/homeScreen.scss";
.homeBox .home-contant .home-aside .asideTitle{
 padding:  0 0 0 10px;
}
.yjclqkBox{
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0 10px;
    box-sizing: border-box;
    ::v-deep .el-input__inner{
        background: rgba(0,22,83,0.4);
        border-radius: 0;
        border: 1px solid #0072FF;
        color: #fff;
        height: 40px;
    }

}

</style>
