<template>
  <el-drawer v-model="drawerVisible" size="1000">
    <div>
      <DetailCom ref="detailComRef"></DetailCom>
    </div>

    <el-form
      ref="remarkRef"
      :model="remark"
      label-width="150"
      :rules="rules1"
      style="max-width: 600px; margin-left: 80px; margin-top: 20px"
    >
      <el-form-item label="是否通过" prop="state">
        <el-radio-group v-model="remark.state">
          <el-radio :value="0">同意</el-radio>
          <el-radio :value="1">不同意</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>

    <template #footer>
      <div class="drawer-bottom">
        <el-button @click="cancelClick">取消</el-button>
        <el-button type="primary" @click="confirmClick">提交</el-button>
      </div>
    </template>
  </el-drawer>
</template>

<script setup>
import DetailCom from "@/views/statistic/inspectionReport/DetailCom.vue";
import {
  dealFeedback,
  getSignaturebyName,
} from "@/api/statistic/inspectionReport";
import { useUserStore } from "@/store";
import FilesUpload from "@/components/Upload/FilesUpload.vue";
const drawerVisible = ref(false);
const detailComRef = ref(null);
const saleModel = ref({});
const userStore = useUserStore();
const disabledDate = (time) => {
  //选择今天以及今天之后的日期
  return time.getTime() < Date.now() - 8.64e7; //如果没有后面的-8.64e7就是不可以选择
  //选择今天以及今天之前的日期
  //return time.getTime() > Date.now() - 8.64e7;//如果没有后面的-8.64e7就是不可以选择今天的
};
const showDrawer = (row) => {
  drawerVisible.value = true;
  saleModel.value = row;

  nextTick(() => {
    detailComRef.value && detailComRef.value.refreshView(row);
  });

  getUserInfo();
};

const getSignature = async (name) => {
  const res = await getSignaturebyName(name);
  return res.data;
};

const rules1 = {
  content: [
    { required: true, message: "请输入投诉或建议处置意见", trigger: "blur" },
    { min: 2, max: 200, message: "长度在 2 到 200 个字符", trigger: "blur" },
  ],
  user: [
    { required: true, message: "请输入姓名", trigger: "blur" },
    { min: 2, max: 20, message: "长度在 2 到 20 个字符", trigger: "blur" },
  ],
  time: [{ required: true, message: "请选择日期", trigger: "change" }],
  nextRemarkUser: [
    { required: true, message: "请选择处理人", trigger: "change" },
    { min: 2, max: 20, message: "长度在 2 到 20 个字符", trigger: "blur" },
  ],
};

defineExpose({ showDrawer });

const remarkRef = ref(null);

const remark = reactive({
  content: "",
  user: "",
  time: "",
  nextRemarkUser: "",
  state: 0,
  fileUrl: "",
});
const fileNameList = ref([]);

const cancelClick = () => {
  drawerVisible.value = false;

  remarkRef.value.resetFields();
};

const feedBackEmit = defineEmits(["finish"]);

// 用户信息
// const userInfo = ref({});
// const userList = ref([]);
// const getUserInfo = async () => {
//   getUserTree().then((data) => {
//     userList.value = data.data;
//   });
// };

const confirmClick = async () => {
  // 改为async函数
  const date = new Date();
  const now =
    date.getFullYear() +
    "年" +
    (date.getMonth() + 1) +
    "月" +
    date.getDate() +
    "日";
  remark.user = userStore.user.username;

  try {
    const valid = await remarkRef.value.validate(); // 使用await验证表单
    if (!valid) {
      console.log("remarkRef invalid");
      return false;
    }

    let queryName = "质量检验签章";
    let prefix = import.meta.env.VITE_APP_MES_FILE_URL.replace(/'/g, "");

    let remark5Copy = {
      content: remark.state == 0 ? "同意" : "",
      user: remark.user,
      time: now,
      state: remark.state,
      sinature:
        remark.state == 0 ? prefix + (await getSignature(queryName)) : "",
    };

    let p = {
      id: saleModel.value.id,
      remark5: JSON.stringify(remark5Copy),
      state: remark.state,
      currentUserName: remark.nextRemarkUser,
      step: 3, //步骤 2 审核人 3 批准人
    };

    // 等待反馈处理完成
    await dealFeedback(p);
    feedBackEmit("finish");
    cancelClick();
  } catch (error) {
    console.error("处理过程中出错:", error);
  }
};
</script>

<style scoped lang="scss">
@media print {
  #print {
    position: absolute; /* 或 absolute, fixed, 根据需要调整 */
    top: 20px; /* 调整顶部位置 */
    margin: 0; /* 重置边距 */
    width: 1000px;
  }
}
</style>
