<template>
  <!-- 添加或修改项目信息对话框 -->
  <el-dialog title="生产计划表单" v-model="visible" width="800px" append-to-body draggable>
    <div class="form-container">
      <div style="margin: 20px 0 10px 0">
        <span>工艺版本</span>
        <span style="margin-left: 10px;color: red;">{{ detailsRow.technologyVersion }}</span>
      </div>
      <el-table
      ref="dialogTable"
      :data="technologyProcessDetailList"
      row-key="id"
      size="small"
      v-loading="loading"
      border
      height="360px"
      header-row-class-name="list-header-row"
      row-class-name="list-row"
    >
      <el-table-column type="index" label="行号" width="50" align="center" />
      <el-table-column label="工序步骤编号" width="100" align="center" prop="processStepNumber"/>
      <el-table-column label="工序编码" align="center" prop="processCode" />
      <el-table-column label="工序简称" align="center" prop="processAlias" />
    </el-table>
    </div>
    <template #footer>
      <el-button type="primary" icon="Check" @click="handleCancel">确 定</el-button>
    </template>
  </el-dialog>
</template>
<script setup>
import { ref } from 'vue'
const { proxy } = getCurrentInstance()
const emit = defineEmits(['handleUpdateSuccess'])
/**工艺版本变更变量 */
const loading = ref(false)
const total = ref(0)
const visible = ref(false)
const detailsRow = ref({})
const technologyProcessDetailList = ref([])

/***********************  方法区  ****************************/
/** 打开抽屉 */
const open = (data) => {
  visible.value = true
  detailsRow.value = proxy.deepClone(data);
  technologyProcessDetailList.value = detailsRow.value.technologicalProcessDetailList
}

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

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