<template>
  <!-- 添加或修改项目信息对话框 -->
  <el-dialog
    title="周转区信息表单"
    v-model="visible"
    width="400px"
    append-to-body
    draggable
  >
    <div class="form-container">
      <el-form
        ref="turnoverFormRef"
        class="master-container"
        :rules="rules"
        v-loading="loading"
        :model="form"
        label-width="100px"
      >
        <el-form-item label="周转区名称" prop="code">
          <el-input v-model.trim="form.code" placeholder="请输入周转区名称" />
        </el-form-item>
        <el-form-item label="状态" prop="status">
          <el-select v-model="form.status" placeholder="请选择周转区状态">
            <el-option
              v-for="item in turnover_status"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model.trim="form.remark" placeholder="请输入备注" />
        </el-form-item>
      </el-form>
    </div>
    <template #footer>
      <el-button type="primary" icon="Check" @click="handleSave"
        >确 定</el-button
      >
      <el-button icon="Close" @click="handleCancel">取 消</el-button>
    </template>
  </el-dialog>
</template>
<script setup>
import { getTurnover, saveTurnover } from "@/api/business/turnover";
const { proxy } = getCurrentInstance();
const emit = defineEmits(["handleSaveSuccess"]);
/** 字典数组区 */
const { turnover_status } = proxy.useDict("turnover_status");
/**周转区表单变量 */
const loading = ref(false);
const visible = ref(false);
const form = ref({});
const rules = {
  code: [{ required: true, trigger: "blur", message: "周转区名称不能为空" }],
};

/***********************  方法区  ****************************/
/** 打开抽屉 */
const open = (data) => {
  reset();
  visible.value = true;
  loading.value = true;
  form.value.deptId = data.deptId;
  getTurnover(data.id || 0).then((res) => {
    if (res.data) {
      form.value = res.data;
      form.value.status = res.data.status + "";
    }
    loading.value = false;
  });
};

/** 表单重置 */
const reset = () => {
  form.value = {
    id: null,
    deptId: 0,
    code: "",
    status: "0",
    remark: "",
  };
  proxy.resetForm("turnoverFormRef");
};

/** 提交按钮 */
const handleSave = () => {
  proxy.$refs["turnoverFormRef"].validate((valid) => {
    if (valid) {
      saveTurnover(form.value).then((res) => {
        if (res.code === 601) {
          proxy.$modal.msgWarn(res.msg);
          return;
        }
        if (res.code === 200) {
          proxy.$modal.msgSuccess("操作成功");
          emit("handleSaveSuccess");
        }
        visible.value = false;
      });
    }
  });
};

/** 取消按钮 */
const handleCancel = () => {
  visible.value = false;
  reset();
};

/** 暴露给父组件的方法 */
defineExpose({
  open,
});
</script>
