<template>
  <!-- 添加或修改项目信息对话框 -->
  <el-dialog title="投产" height="400px" v-model="visible" width="800px" append-to-body draggable>
    <div class="form-container">
      <el-form ref="productRef" class="master-container" :model="form" :rules="rules" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="生产计划单号" prop="productionPlanNo">
              <span>{{ form.productionPlanNo }}</span>
            </el-form-item>
            <el-form-item label="当前投产批数" prop="lotNumber">
              <el-input-number v-if="editStatus" v-model="form.lotNumber" :min="1" controls-position="right" style="width: 150px" />
              <span v-else>{{ form.lotNumber }}</span>
            </el-form-item>
            <el-form-item label="下达日期" prop="issuanceDate">
              <el-date-picker v-if="editStatus" clearable v-model="form.issuanceDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择实际开始 时间" style="width: 150px" />
              <span v-else>{{ form.issuanceDate }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="产品描述" prop="productDescription">
              <span>{{ form.productDescription }}</span>
            </el-form-item>
            <el-form-item label="当前投产量" prop="productionVolume">
              <span>{{ form.productionVolume }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <template #footer>
      <el-button v-if="editStatus" type="primary" icon="Finished" @click="submitForm">保存</el-button>
    </template>
  </el-dialog>
</template>
<script setup>
import { listProduct } from '@/api/business/product'
import { savePlanDetailSubDetail, listPlanDetailSubDetail } from '@/api/business/planDetailSubDetail.js'
const { proxy } = getCurrentInstance()
/** 父组件传参 */
const props = defineProps({
  getList: {
    type: Function,
    default: null
  }
})
const { getList } = toRefs(props)
/** 字典数组区 */

/** 表单抽屉 页变量 */
const loading = ref(false)
const ids = ref([])
const equipmentSingle = ref(false)
const equipmentMultiple = ref(false)
const multiple = ref(true)
const visible = ref(false)
const equipmentList = ref([])
const processList = ref([])
const editStatus = ref(false)
const technologicalOptions = ref([])
const product = ref({})
const isFullscreen = ref(false)
const webHost = import.meta.env.VITE_APP_BASE_API
const data = reactive({
  form: {},
  rules: {}
})
const { form, rules } = toRefs(data)
/***********************  方法区  ****************************/
/** 打开抽屉 */
function open(row) {
  reset()
  visible.value = true
  editStatus.value = true
  if (row) {
    form.value = row
    listProduct({ id: form.value.productId }).then((res) => {
      product.value = res.rows[0]
      technologicalOptions.value = product.value.technologicalProcessList
    })
  }
}

/** 取消按钮 */
function cancel() {
  visible.value = false
  reset()
}
/**图纸版本选择 */
function currentSeqenceChange(val) {
  //将选择的label也赋值给technologyVersion
  const item = technologicalOptions.value.filter((item) => item.value == val)
  form.value.technologyVersion = item[0].label
  console.log(form.value.technologyVersion)
}
/** 表单重置 */
function reset() {
  form.value = {
    id: null,
    productionPlanId: null,
    productionPlanDetailId: null,
    productionQuantity: null,
    productId: null,
    technologicalProcessId: null,
    technologyVersion: null,
    lotNumber: null,
    issuanceDate: null,
    remark: null
  }
  proxy.resetForm('productRef')
}

/** 全屏缩放 */
function handleScreen() {
  const dom = document.querySelector('.column-container > .el-drawer__wrapper > .el-overlay')
  isFullscreen.value = !isFullscreen.value
  dom.style.position = isFullscreen.value ? 'fixed' : 'absolute'
}

/** 提交按钮 */
function submitForm() {
  proxy.$refs['productRef'].validate((valid) => {
    if (valid) {
      savePlanDetailSubDetail(form.value).then((res) => {
        if (res.code == 200) {
          proxy.$modal.msgSuccess('保存成功！')
          visible.value = false
          props.getList()
        }
      })
      //
    }
  })
}
// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map((item) => item.id)
  equipmentSingle.value = selection.length != 1
  equipmentMultiple.value = !selection.length
}

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