<template>
  <div class="app-container">
    <el-card shadow="always" style="width: 55%; margin: 0 auto">
      <research-form ref="researchFormRef" v-model="form" is-add/>
      <div :style="{ marginLeft: labelWidth + 'px' }">
        <el-button @click="$router.go(-1)">取消</el-button>
        <el-button type="primary" @click="submitForm">提交</el-button>
      </div>
    </el-card>
  </div>
</template>
<script setup>
import ResearchForm from '@/views/components/ResearchForm'
import {reactive, ref, toRefs} from "vue";

const props = defineProps({
  labelWidth: {
    type: Number,
    default: 120
  }
})
const data = reactive({
  form: {
    industrys: [],
  }
})
const {form} = toRefs(data)
const researchFormRef = ref()
const submitForm = async () => {
  if (!researchFormRef.value) return
  const valid = await researchFormRef.value.validateForm()
  if (valid) {
    // TODO: submit laboratory
  }
}
</script>

<style lang="scss" scoped>

</style>