<!--
@ 作者: 秦东
@ 时间: 2025-01-14 13:33:45
@ 备注: 添加班组轮询规则
-->
<script lang="ts" setup>
import { workTimeInfo, ruleInfo, TimesClassInfo } from "@/api/hr/people/type";
import { teamcontlist } from "@/api/hr/org/index";
import { addTeamTime } from "@/api/hr/people/index";
const props = defineProps({
  open: {
    type: Boolean,
    default: false,
  },
  teamInfo: {
    type: Object,
    default() {
      return {};
    },
  },
});
const tiemList = ref<string[]>([]);
const emits = defineEmits(["update:open", "restdata"]);
const sunmitBut = ref(false);
const formInfo = reactive({
  name: "",
});
const worktimeList = ref<workTimeInfo[]>([
  {
    title: "",
    startTime: "",
    endTime: "",
  },
]);
let countNum = 1;
const ruleList = ref<ruleInfo[]>([
  {
    teamid: "",
    sort: countNum,
  },
]);
/**
 * 弹窗显示控制
 */
const isShow = computed({
  get: () => {
    if (props.open) {
      getTimeClassList();
    }
    return props.open;
  },
  set: (val) => {
    emits("update:open", val);
  },
});
/**
@ 作者: 秦东
@ 时间: 2025-01-14 13:57:36
@ 功能: 关闭弹窗
*/
const closeDialog = () => {
  emits("update:open", false);
  countNum = 1;
  worktimeList.value = [
    {
      title: "",
      startTime: "",
      endTime: "",
    },
  ];
  ruleList.value = [
    {
      teamid: "",
      sort: countNum,
    },
  ];
  formInfo.name = "";
  sunmitBut.value = false;
  emits("restdata");
};
/**
@ 作者: 秦东
@ 时间: 2025-01-14 11:34:57
@ 功能: 获取班次列表
*/
const getTimeClassList = () => {
  teamcontlist().then((data: any) => {
    tiemList.value = data.data.list;
  });
};
/**
@ 作者: 秦东
@ 时间: 2025-01-14 15:16:33
@ 功能: 添加工作时间段安排
*/
const addTimeSet = () => {
  worktimeList.value.push({
    title: "",
    startTime: "",
    endTime: "",
  });
};
/**
@ 作者: 秦东
@ 时间: 2025-01-14 15:34:42
@ 功能: 删除时间片段
*/
const delTimeSet = (val: any) => {
  console.log("删除时间片段", val.$index, worktimeList.value.length);
  if (worktimeList.value.length > 1) {
    worktimeList.value.splice(val.$index, 1);
    console.log("删除时间片段", val.$index);
  } else {
    val.title = "";
    val.startTime = "";
    val.title = "";
  }
};

/**
@ 作者: 秦东
@ 时间: 2025-01-14 16:00:54
@ 功能: 添加轮询规则
*/
const addTimeRuleSet = () => {
  countNum++;
  ruleList.value.push({
    sort: countNum,
    teamid: "",
  });
};
/**
@ 作者: 秦东
@ 时间: 2025-01-14 16:06:44
@ 功能: 删除轮询规则
*/
const delTimeRuleSet = (val: any) => {
  if (ruleList.value.length > 1) {
    ruleList.value.splice(val.$index, 1);
  } else {
    val.sort = 1;
    val.titteamidle = "";
  }
};
/**
@ 作者: 秦东
@ 时间: 2025-01-14 16:19:51
@ 功能: 提交数据
*/
const addContsubmit = () => {
  sunmitBut.value = true;
  if (!formInfo.name) {
    ElMessage.error("请输入名称");
    sunmitBut.value = false;
    return false;
  } else {
    if (formInfo.name == "" || formInfo.name == null) {
      ElMessage.error("请输入名称");
      sunmitBut.value = false;
      return false;
    }
  }
  let workList = new Array();
  let ruleAry = new Array();
  if (worktimeList.value.length < 1) {
    ElMessage.error("请输入工作时间安排！");
    sunmitBut.value = false;
    return false;
  } else {
    let isTrue = false;
    worktimeList.value.forEach((item: any) => {
      if (!item.title) {
        isTrue = true;
      } else {
        if (item.title == "" || item.title == null) {
          isTrue = true;
        }
      }
      if (!item.startTime) {
        isTrue = true;
      } else {
        if (item.startTime == "" || item.startTime == null) {
          isTrue = true;
        }
      }
      if (!item.endTime) {
        isTrue = true;
      } else {
        if (item.endTime == "" || item.endTime == null) {
          isTrue = true;
        }
      }
      workList.push(item);
    });
    if (isTrue) {
      ElMessage.error("请输入工作时间安排！");
      sunmitBut.value = false;
      return false;
    }
  }

  if (ruleList.value.length < 1) {
    ElMessage.error("请输入轮询规则！");
    sunmitBut.value = false;
    return false;
  } else {
    let isOk = false;
    ruleList.value.forEach((item: any) => {
      //   if (!item.id) {
      //     isOk = true;
      //   } else {
      //     if (item.id == "" || item.id == null) {
      //       isOk = true;
      //     }
      //   }
      if (!item.teamid) {
        isOk = true;
      } else {
        if (item.teamid == "" || item.teamid == null) {
          isOk = true;
        }
      }
      ruleAry.push({
        sort: item.sort,
        teamid: item.teamid.toString(),
      });
    });
    if (isOk) {
      ElMessage.error("请输入轮询规则！");
      sunmitBut.value = false;
      return false;
    }
  }
  var sendData = {
    name: formInfo.name,
    rule: ruleAry,
    list: workList,
  };
  console.log("上传规则", sendData);
  addTeamTime(sendData)
    .then((data) => {
      console.log("上传规则-------<", data);
      if (data.code == 0) {
        ElMessageBox.confirm("新增成功！是否继续添加？", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            countNum = 1;
            worktimeList.value = [
              {
                title: "",
                startTime: "",
                endTime: "",
              },
            ];
            ruleList.value = [
              {
                teamid: "",
                sort: countNum,
              },
            ];
            formInfo.name = "";
            sunmitBut.value = false;
          })
          .catch(() => {
            closeDialog();
          });
      } else {
        ElMessage.error(data.msg || "添加失败！");
        closeDialog();
      }
    })
    .finally(() => {
      sunmitBut.value = false;
    });
};
</script>
<template>
  <el-dialog
    v-model="isShow"
    width="60%"
    title="添加班组轮询规则"
    append-to-body
    :before-close="closeDialog"
  >
    <el-form ref="addForm" :model="formInfo" label-width="120px" class="demo-ruleForm">
      <el-form-item label="名称" prop="name">
        <el-input v-model="formInfo.name" placeholder="请输入名称"></el-input>
      </el-form-item>
      <el-form-item label="工作时间段安排" prop="rule">
        <el-table :data="worktimeList" border style="width: 100%">
          <el-table-column align="center" prop="title" label="时段名称" width="180">
            <template #default="scope">
              <el-input v-model="scope.row.title" placeholder="请输入时段名称"></el-input>
            </template>
          </el-table-column>
          <el-table-column align="center" label="开始与结束时间">
            <template #default="scope">
              <el-time-select
                style="width: 120px"
                placeholder="起始时间"
                v-model="scope.row.startTime"
                start="00:00"
                step="00:01"
                end="23:59"
              >
              </el-time-select>
              至
              <el-time-select
                style="width: 120px"
                placeholder="结束时间"
                v-model="scope.row.endTime"
                :min-time="scope.row.startTime"
                start="00:00"
                step="00:01"
                end="23:59"
              >
              </el-time-select>
            </template>
          </el-table-column>
          <el-table-column align="center" width="100">
            <template #header>
              <el-button type="primary" size="small" @click="addTimeSet()"
                ><i class="fa fa-plus iconLeft"></i> 新增</el-button
              >
            </template>
            <template #default="scope">
              <el-button
                v-if="worktimeList.length > 1"
                type="danger"
                size="small"
                @click="delTimeSet(scope)"
                ><i class="fa fa-trash-o iconLeft"></i>删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
      <el-form-item label="轮询规则" prop="rule">
        <el-table :data="ruleList" border style="width: 100%">
          <el-table-column align="center" prop="sort" label="排序" width="180">
            <template #default="scope">
              <el-input
                v-model="scope.row.sort"
                placeholder="请输入序号"
                disabled
              ></el-input>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="name" label="班组">
            <template #default="scope">
              <el-select v-model="scope.row.teamid" clearable placeholder="请选择">
                <el-option
                  v-for="item in tiemList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column align="center" width="100">
            <template #header>
              <el-button type="primary" size="small" @click="addTimeRuleSet()"
                ><i class="fa fa-plus iconLeft"></i> 新增</el-button
              >
            </template>
            <template #default="scope">
              <el-button
                v-if="ruleList.length > 1"
                type="danger"
                size="small"
                @click="delTimeRuleSet(scope)"
                ><i class="fa fa-trash-o iconLeft"></i>删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
    </el-form>
    <template #footer class="el_dialog__footer">
      <div class="dialog-footer">
        <el-button size="small" type="primary" @click="addContsubmit" :loading="sunmitBut"
          >确 定</el-button
        >
        <el-button size="small" @click="closeDialog">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<style lang="scss" scoped>
.iconLeft {
  margin-right: 10px;
}
</style>
