<!--
@ 作者: 秦东
@ 时间: 2025-12-02 16:17:37
@ 备注: 批量导入
-->
<script lang='ts' setup>
import { orgInfo } from "@/api/hr/org/type";
import {
  analysisRedisOrgExelect,
} from "@/api/hr/people/index";
import { ElScrollbar as ElScrollbarType } from "element-plus";
const uploadFFurl = import.meta.env.VITE_APP_BASE_API + "/hrapi/staff/uploadUserFilesRedis";
const props = defineProps({
    show: {
        type: Boolean,
        default: false
    },
    orgTree: {
        type: Array as PropType<orgInfo[]>,
        default: () => []
    }
})
const ubLockPage = computed(() => props.show)
const emit = defineEmits(['update:show','updateInfo'])
const closeUploadTemp = () => {
    emit('update:show', false)
    emit('updateInfo')
    tempForm.orgId = ""
    excelLoading.value = false;
    excelJiexi.value = false;
}
const orgTreeList = computed(() => props.orgTree) //行政组织树数据
const excelLoading = ref(false);
const excelJiexi = ref(false);
const tempForm = reactive({
  orgId: "",
});
const systemMenuTreeProps = {
  children: "child",
  label: "name",
  value:"id"
}
const excelUpload = ref<any>();
let peopleListAry = new Array();        //输出信息
const peopleMsg = ref<string[]>([]);
let jiBuQiVal = 0;
const progressSize = ref(0);
const meritsYearIng = ref<any>();
const rewPunYearsIng = ref<any>();
const redisListKey = ref<string>();
const totalNum = ref<number>();
const innerRef = ref<HTMLDivElement>();
const scrollbarRef = ref<InstanceType<typeof ElScrollbarType>>();
/**
@ 作者: 秦东
@ 时间: 2025-12-02 16:53:45
@ 功能: 上传前检查
*/
function handleExcelChangeTemp(file: UploadFile) {
  excelLoading.value = true;
  if (tempForm.orgId == 0 || tempForm.orgId == "") {
    ElMessage.warning("对不起！你没有选定上传的是哪个行政组织得人员信息！");
    excelLoading.value = false;
    return false;
  }
  if (!/\.(xlsx|xls|XLSX|XLS)$/.test(file.name)) {
    ElMessage.warning("上传Excel只能为xlsx、xls格式");
    excelLoading.value = false;
    return false;
  }
}
/**
@ 作者: 秦东
@ 时间: 2025-12-02 16:55:17
@ 功能: 上传失败
*/
const uploadError = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
  excelLoading.value = true;
  // console.log("1response",response);
  // console.log("1uploadFile",uploadFile);
  // console.log("1uploadFiles",uploadFiles);
  let msgAry = new Array();
  msgAry.push(
    "响应时间过长，系统自动转为后台静默处理，可先关闭窗口！完成时间大约90分钟。请于90分钟后刷新信息"
  );
  // errorMsg = ["响应时间过长，系统自动转为后台静默处理，可先关闭窗口！完成时间大约90分钟。请于90分钟后刷新信息"]
  peopleListAry.value = msgAry;
};
/**
@ 作者: 秦东
@ 时间: 2025-12-02 16:56:39
@ 功能: 上传成功
*/
const uploadTrue = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
    excelLoading.value = false;
    // console.log("response", response);
    // console.log("uploadFile",uploadFile);
    // console.log("uploadFiles",uploadFiles);
    peopleListAry.push("文件上传成功！开始解析数据并写入数据库！");
    peopleMsg.value.push("文件上传成功！开始解析数据并写入数据库！");
    // peopleListAry.value.push("文件上传成功！开始解析数据并写入数据库！")
    // console.log("上传成功",response.code)
    if (response.code == 0) {
        jiBuQiVal = 0;
        progressSize.value = 0;
        excelJiexi.value = true;
        meritsYearIng.value = response.data.meritsYearIng;
        rewPunYearsIng.value = response.data.rewPunYearsIng;
        redisListKey.value = response.data.redisListKey;
        totalNum.value = response.data.totalNum;
        // console.log("上传成功===>", staffChengji);
        insetPeopleCont();
    }
}
/**
@ 作者: 秦东
@ 时间: 2025-12-02 17:01:05
@ 功能: 写入数据库
*/
const insetPeopleCont = () => {
//   console.log("启动数据写入数据库===============》", jiBuQiVal, totalNum.value);
  if (jiBuQiVal < totalNum.value) {
    let sendData = {
      meritsYearIng: meritsYearIng.value,
      rewPunYearsIng: rewPunYearsIng.value,
      redisListKey: redisListKey.value,
      number: jiBuQiVal,
      orgId: tempForm.orgId.toString(),
    };
    // console.log("启动数据写入数据库", sendData);
    analysisRedisOrgExelect(sendData).then((data: any) => {
      // console.log("启动数据写入11111数据库",data,data.data.msgStr)
      peopleMsg.value.push(data.data.msgStr);
      jiBuQiVal++;
      // if (jibuq+ 1 >= totalNum.value){

      // }
      progressSize.value = Math.round((jiBuQiVal / totalNum.value) * 10000) / 100;
      insetPeopleCont();
      nextTick(() => {
        handleClick();
      });
    });
  } else {
    excelJiexi.value = false;
    progressSize.value = 100;
    excelUpload.value.clearFiles();
  }
};

const handleClick = () => {
  nextTick(() => {
    // console.log("滚动条长度",innerRef.value!.clientHeight)
    if (innerRef.value!.clientHeight > 300) {
      scrollbarRef.value!.setScrollTop(innerRef.value!.clientHeight);
    }
  });
};
</script>
<template>
    <el-dialog
        v-model="ubLockPage"
        title="批量导入人员信息"
        width="800"
        draggable
        :destroy-on-close="true"
        :before-close="closeUploadTemp"
    >   
        <el-row v-loading="excelLoading" element-loading-text="文档上传中，请稍候..."  style="width: 100%">
            <el-col :span="24">
                <el-form :model="tempForm" label-width="auto" style="width: 100%">
                    <el-form-item label="请选择上传那个公司的人员信息">
                        <el-tree-select
                            v-model="tempForm.orgId"
                            :data="orgTreeList"
                            check-strictly
                            :render-after-expand="false"
                            :props="systemMenuTreeProps" 
                            style="width: 100%"
                            clearable
                        />
                    </el-form-item>
                </el-form>
            </el-col>
            <el-col
                :span="24"
                v-loading="excelJiexi"
                element-loading-text="文档解析中，请稍候..."
            >
                <el-upload
                    ref="excelUpload"
                    class="upload-demo"
                    drag
                    :action="uploadFFurl"
                    :data="{ orgId: tempForm.orgId.toString() }"
                    :before-upload="handleExcelChangeTemp"
                    :on-success="uploadTrue"
                    :on-error="uploadError"
                    :show-file-list="false"
                    multiple
                >
                    <el-icon class="el-icon--upload"><upload-filled /></el-icon>
                    <div class="el-upload__text">将电子表格拖到此处或 <em>单击上载</em></div>
                </el-upload>
            </el-col>
        </el-row>
        <el-row style="width: 100%;">
            <el-col :span="24">
                <el-progress
                    :text-inside="true"
                    :stroke-width="20"
                    :percentage="progressSize"
                >
                    <span>已完成：{{ progressSize }}%</span>
                </el-progress>
            </el-col>
        </el-row>
        <el-scrollbar height="300px" ref="scrollbarRef" always style="padding:10px 20px;">
            <div ref="innerRef">
                <p
                    v-for="(item, index) in peopleMsg"
                    :key="index"
                    class="scrollbar-demo-item"
                >
                    {{ item }}
                </p>
            </div>
        </el-scrollbar>
    </el-dialog>
</template>
<style  lang='scss' scoped>
.app-content {
  
}
</style>
