<template>
  <div class="mesBusLog-container">
    <el-dialog v-model="state.isShowDialog" v-if="state.isShowDialog" width="30%" draggable="" :close-on-click-modal="false">
      <template #header>
        <div style="color: #fff">
          <span>{{ props.title }}</span>
        </div>
      </template>
      <div style="width:100%;">
        <el-form :model="ruleForm" ref="ruleFormRef" label-width="auto" :rules="rules">
          <el-row :gutter="35">
            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
              <el-form-item label="扫描生产看板" prop="batchNo">
                <el-input v-model="ruleForm.batchNo" placeholder=" "  clearable @keyup.enter="submit" >
                  <template #append>
                    <el-icon class="el-input__icon" style="cursor: pointer" @click="submit">
                      <ele-FullScreen />
                    </el-icon>
                  </template>
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="cancel">取 消</el-button>
          <el-button type="primary" @click="submit">确 定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
        <style lang="scss" scoped>
:deep(.el-select),
:deep(.el-input-number) {
	width: 100%;
}
</style>
        <script lang="ts" setup>
import { ref, onMounted, reactive } from 'vue';
import { ElMessage } from 'element-plus';
import type { FormRules } from 'element-plus';
import { formatDate } from '/@/utils/formatTime';
import {getWorkRecord} from "/@/api/mes/mesControlBoard";

//父级传递来的参数
var props = defineProps({
	title: {
		type: String,
		default: '',
	},
  getBatchInfo:{
    type: Function,
    default: ()=>{},
  },
});

//自行添加其他规则
const rules = ref<FormRules>({
  batchNo: [{ required: true, message: '请输入批次号！', trigger: 'blur' }],
});

//父级传递来的函数，用于回调
const emit = defineEmits(['reloadTable','startWork']);
const ruleFormRef = ref();
const handleQuery = () => {};

const ruleForm = ref<any>({});
const state = reactive({
	isShowDialog: false,
});

// 页面加载时
onMounted(() => {});

// 打开弹窗
const openDialog = async (row: any) => {
	// 改用detail获取最新数据来编辑
	let rowData = JSON.parse(JSON.stringify(row));
	state.isShowDialog = true;
};

// 关闭弹窗
const closeDialog = () => {
	emit('reloadTable');
	state.isShowDialog = false;
};

// 取消
const cancel = () => {
	state.isShowDialog = false;
};

// 提交
const submit = async () => {
	ruleFormRef.value.validate(async (isValid: boolean, fields?: any) => {
		if (isValid) {
      let res = await getWorkRecord({
        batchNo:ruleForm.value.batchNo
      })?.data?.result || {}
      props.getBatchInfo(res)
      emit("startWork",{
        preBatchNo:ruleForm.value.batchNo
      });
      closeDialog();
		}
	});

};

//将属性或者函数暴露给父组件
defineExpose({ openDialog });
</script>




