更新全部数据
admin
parent
461785ac3c
commit
90b18acf44
|
|
@ -0,0 +1,99 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="排序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.number`" :rules="formRules.number" class="mb-0px!">
|
||||
<el-input v-model="row.number" placeholder="请输入排序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="取得的成果" min-width="400">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.achieContent`" :rules="formRules.achieContent" class="mb-0px!">
|
||||
<Editor v-model="row.achieContent" height="150px" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加验收其他成果</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { MainApi } from '@/api/acceptance/acceptance'
|
||||
|
||||
const props = defineProps<{
|
||||
acceptanceId: undefined // 验收主键ID（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
number: [{ required: true, message: '排序号不能为空', trigger: 'blur' }],
|
||||
achieContent: [{ required: true, message: '取得的成果不能为空', trigger: 'blur' }],
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.acceptanceId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getAchieListByAcceptanceId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
acceptanceId: undefined,
|
||||
number: undefined,
|
||||
achieContent: undefined,
|
||||
}
|
||||
row.acceptanceId = props.acceptanceId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,121 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.number`" :rules="formRules.number" class="mb-0px!">
|
||||
<el-input v-model="row.number" placeholder="请输入序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="考核指标" min-width="200">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.check`" :rules="formRules.check" class="mb-0px!">
|
||||
<el-input v-model="row.check" type="textarea" placeholder="请输入考核指标" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="实际完成情况" min-width="200">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.actual`" :rules="formRules.actual" class="mb-0px!">
|
||||
<el-input v-model="row.actual" type="textarea" placeholder="请输入实际完成情况" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否完成：0：未完成 1：完成" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.isComplete`" :rules="formRules.isComplete" class="mb-0px!">
|
||||
<el-select v-model="row.isComplete" placeholder="请选择是否完成：0：未完成 1：完成">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.IS_COMPLETE)"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加验收考核指标</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { getStrDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||
import { MainApi } from '@/api/acceptance/acceptance'
|
||||
|
||||
const props = defineProps<{
|
||||
acceptanceId: undefined // 验收主键ID（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.acceptanceId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getCheckListByAcceptanceId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
acceptanceId: undefined,
|
||||
number: undefined,
|
||||
check: undefined,
|
||||
actual: undefined,
|
||||
isComplete: undefined,
|
||||
}
|
||||
row.acceptanceId = props.acceptanceId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="排序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.number`" :rules="formRules.number" class="mb-0px!">
|
||||
<el-input v-model="row.number" placeholder="请输入排序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="论文标题" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.title`" :rules="formRules.title" class="mb-0px!">
|
||||
<el-input v-model="row.title" placeholder="请输入论文标题" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="发表日期" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.publicationDate`" :rules="formRules.publicationDate" class="mb-0px!">
|
||||
<el-date-picker
|
||||
v-model="row.publicationDate"
|
||||
type="date"
|
||||
value-format="x"
|
||||
placeholder="选择发表日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="发表论文的期刊名称" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.journalName`" :rules="formRules.journalName" class="mb-0px!">
|
||||
<el-input v-model="row.journalName" placeholder="请输入发表论文的期刊名称" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="期刊的卷号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.volumeNumbe`" :rules="formRules.volumeNumbe" class="mb-0px!">
|
||||
<el-input v-model="row.volumeNumbe" placeholder="请输入期刊的卷号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="期刊的期号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.issueNumber`" :rules="formRules.issueNumber" class="mb-0px!">
|
||||
<el-input v-model="row.issueNumber" placeholder="请输入期刊的期号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="作者" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.authors`" :rules="formRules.authors" class="mb-0px!">
|
||||
<el-input v-model="row.authors" placeholder="请输入作者" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加验收项目论文成果</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { MainApi } from '@/api/acceptance/acceptance'
|
||||
|
||||
const props = defineProps<{
|
||||
acceptanceId: undefined // 验收主键Id（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
number: [{ required: true, message: '排序号不能为空', trigger: 'blur' }],
|
||||
title: [{ required: true, message: '论文标题不能为空', trigger: 'blur' }],
|
||||
publicationDate: [{ required: true, message: '发表日期不能为空', trigger: 'blur' }],
|
||||
journalName: [{ required: true, message: '发表论文的期刊名称不能为空', trigger: 'blur' }],
|
||||
volumeNumbe: [{ required: true, message: '期刊的卷号不能为空', trigger: 'blur' }],
|
||||
issueNumber: [{ required: true, message: '期刊的期号不能为空', trigger: 'blur' }],
|
||||
authors: [{ required: true, message: '作者不能为空', trigger: 'blur' }],
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.acceptanceId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getPublicationsListByAcceptanceId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
acceptanceId: undefined,
|
||||
number: undefined,
|
||||
title: undefined,
|
||||
publicationDate: undefined,
|
||||
journalName: undefined,
|
||||
volumeNumbe: undefined,
|
||||
issueNumber: undefined,
|
||||
authors: undefined,
|
||||
}
|
||||
row.acceptanceId = props.acceptanceId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,121 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.number`" :rules="formRules.number" class="mb-0px!">
|
||||
<el-input v-model="row.number" placeholder="请输入序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="项目目标" min-width="200">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.target`" :rules="formRules.target" class="mb-0px!">
|
||||
<el-input v-model="row.target" type="textarea" placeholder="请输入项目目标" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="实际完成情况" min-width="200">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.actual`" :rules="formRules.actual" class="mb-0px!">
|
||||
<el-input v-model="row.actual" type="textarea" placeholder="请输入实际完成情况" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否完成：0：未完成 1：完成" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.isComplete`" :rules="formRules.isComplete" class="mb-0px!">
|
||||
<el-select v-model="row.isComplete" placeholder="请选择是否完成：0：未完成 1：完成">
|
||||
<el-option
|
||||
v-for="dict in getStrDictOptions(DICT_TYPE.IS_COMPLETE)"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加验收项目目标</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { getStrDictOptions, DICT_TYPE } from '@/utils/dict'
|
||||
import { MainApi } from '@/api/acceptance/acceptance'
|
||||
|
||||
const props = defineProps<{
|
||||
acceptanceId: undefined // 验收主键ID（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.acceptanceId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getTargetListByAcceptanceId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
acceptanceId: undefined,
|
||||
number: undefined,
|
||||
target: undefined,
|
||||
actual: undefined,
|
||||
isComplete: undefined,
|
||||
}
|
||||
row.acceptanceId = props.acceptanceId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.number`" :rules="formRules.number" class="mb-0px!">
|
||||
<el-input v-model="row.number" placeholder="请输入序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="考核指标" min-width="200">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.check`" :rules="formRules.check" class="mb-0px!">
|
||||
<el-input v-model="row.check" type="textarea" placeholder="请输入考核指标" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加任务书考核指标</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { MainApi } from '@/api/contract/contract'
|
||||
|
||||
const props = defineProps<{
|
||||
contractId: undefined // 任务书主键Id（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
contractId: [{ required: true, message: '任务书主键Id不能为空', trigger: 'blur' }],
|
||||
number: [{ required: true, message: '序号不能为空', trigger: 'blur' }],
|
||||
check: [{ required: true, message: '考核指标不能为空', trigger: 'blur' }],
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.contractId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getCheckListByContractId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
contractId: undefined,
|
||||
number: undefined,
|
||||
check: undefined,
|
||||
}
|
||||
row.contractId = props.contractId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="设备名称" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.name`" :rules="formRules.name" class="mb-0px!">
|
||||
<el-input v-model="row.name" placeholder="请输入设备名称" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="设备型号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.type`" :rules="formRules.type" class="mb-0px!">
|
||||
<el-select v-model="row.type" placeholder="请选择设备型号">
|
||||
<el-option label="请选择字典生成" value="" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="费用" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.expense`" :rules="formRules.expense" class="mb-0px!">
|
||||
<el-input v-model="row.expense" placeholder="请输入费用" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="生产厂家（供应商）" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.supplier`" :rules="formRules.supplier" class="mb-0px!">
|
||||
<el-input v-model="row.supplier" placeholder="请输入生产厂家（供应商）" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="作用" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.influence`" :rules="formRules.influence" class="mb-0px!">
|
||||
<el-input v-model="row.influence" placeholder="请输入作用" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="课题实施所需的其他配套条件" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.complement`" :rules="formRules.complement" class="mb-0px!">
|
||||
<el-input v-model="row.complement" placeholder="请输入课题实施所需的其他配套条件" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加项目所需设备</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { MainApi } from '@/api/contract/contract'
|
||||
|
||||
const props = defineProps<{
|
||||
contractId: undefined // 合同主键Id（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.contractId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getDeviceListByContractId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
contractId: undefined,
|
||||
name: undefined,
|
||||
type: undefined,
|
||||
expense: undefined,
|
||||
supplier: undefined,
|
||||
influence: undefined,
|
||||
complement: undefined,
|
||||
}
|
||||
row.contractId = props.contractId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.number`" :rules="formRules.number" class="mb-0px!">
|
||||
<el-input v-model="row.number" placeholder="请输入序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="项目目标" min-width="200">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.target`" :rules="formRules.target" class="mb-0px!">
|
||||
<el-input v-model="row.target" type="textarea" placeholder="请输入项目目标" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加任务书项目目标</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { MainApi } from '@/api/contract/contract'
|
||||
|
||||
const props = defineProps<{
|
||||
contractId: undefined // 任务书主键Id（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
contractId: [{ required: true, message: '任务书主键Id不能为空', trigger: 'blur' }],
|
||||
number: [{ required: true, message: '序号不能为空', trigger: 'blur' }],
|
||||
target: [{ required: true, message: '项目目标不能为空', trigger: 'blur' }],
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.contractId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getTargetListByContractId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
contractId: undefined,
|
||||
number: undefined,
|
||||
target: undefined,
|
||||
}
|
||||
row.contractId = props.contractId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,185 @@
|
|||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
v-loading="formLoading"
|
||||
label-width="0px"
|
||||
:inline-message="true"
|
||||
>
|
||||
<el-table :data="formData" class="-mt-10px">
|
||||
<el-table-column label="序号" type="index" width="100" />
|
||||
<el-table-column label="单位ID" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.deptId`" :rules="formRules.deptId" class="mb-0px!">
|
||||
<el-input v-model="row.deptId" placeholder="请输入单位ID" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="单位名称" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.deptName`" :rules="formRules.deptName" class="mb-0px!">
|
||||
<el-input v-model="row.deptName" placeholder="请输入单位名称" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="集团经费" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.groupFunds`" :rules="formRules.groupFunds" class="mb-0px!">
|
||||
<el-input v-model="row.groupFunds" placeholder="请输入集团经费" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="自筹" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.selfFunds`" :rules="formRules.selfFunds" class="mb-0px!">
|
||||
<el-input v-model="row.selfFunds" placeholder="请输入自筹" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="其他" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.otherFunds`" :rules="formRules.otherFunds" class="mb-0px!">
|
||||
<el-input v-model="row.otherFunds" placeholder="请输入其他" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="联系人" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.linkPerson`" :rules="formRules.linkPerson" class="mb-0px!">
|
||||
<el-input v-model="row.linkPerson" placeholder="请输入联系人" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="联系电话" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.phoneNo`" :rules="formRules.phoneNo" class="mb-0px!">
|
||||
<el-input v-model="row.phoneNo" placeholder="请输入联系电话" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="邮箱" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.email`" :rules="formRules.email" class="mb-0px!">
|
||||
<el-input v-model="row.email" placeholder="请输入邮箱" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="传真" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.fax`" :rules="formRules.fax" class="mb-0px!">
|
||||
<el-input v-model="row.fax" placeholder="请输入传真" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="邮编" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.postalCode`" :rules="formRules.postalCode" class="mb-0px!">
|
||||
<el-input v-model="row.postalCode" placeholder="请输入邮编" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="通讯地址" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.address`" :rules="formRules.address" class="mb-0px!">
|
||||
<el-input v-model="row.address" placeholder="请输入通讯地址" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="标识（1：承担单位，2：联合承担单位，3：参加单位）" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.sign`" :rules="formRules.sign" class="mb-0px!">
|
||||
<el-input v-model="row.sign" placeholder="请输入标识（1：承担单位，2：联合承担单位，3：参加单位）" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="排序号" min-width="150">
|
||||
<template #default="{ row, $index }">
|
||||
<el-form-item :prop="`${$index}.orderNo`" :rules="formRules.orderNo" class="mb-0px!">
|
||||
<el-input v-model="row.orderNo" placeholder="请输入排序号" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" fixed="right" label="操作" width="60">
|
||||
<template #default="{ $index }">
|
||||
<el-button @click="handleDelete($index)" link>—</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form>
|
||||
<el-row justify="center" class="mt-3">
|
||||
<el-button @click="handleAdd" round>+ 添加参加单位</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { MainApi } from '@/api/contract/contract'
|
||||
|
||||
const props = defineProps<{
|
||||
contractId: undefined // 任务书Id（主表的关联字段）
|
||||
}>()
|
||||
const formLoading = ref(false) // 表单的加载中
|
||||
const formData = ref([])
|
||||
const formRules = reactive({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 监听主表的关联字段的变化，加载对应的子表数据 */
|
||||
watch(
|
||||
() => props.contractId,
|
||||
async (val) => {
|
||||
// 1. 重置表单
|
||||
formData.value = []
|
||||
// 2. val 非空，则加载数据
|
||||
if (!val) {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
formLoading.value = true
|
||||
formData.value = await MainApi.getUnitListByContractId(val)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
const row = {
|
||||
id: undefined,
|
||||
contractId: undefined,
|
||||
deptId: undefined,
|
||||
deptName: undefined,
|
||||
groupFunds: undefined,
|
||||
selfFunds: undefined,
|
||||
otherFunds: undefined,
|
||||
linkPerson: undefined,
|
||||
phoneNo: undefined,
|
||||
email: undefined,
|
||||
fax: undefined,
|
||||
postalCode: undefined,
|
||||
address: undefined,
|
||||
sign: undefined,
|
||||
orderNo: undefined,
|
||||
}
|
||||
row.contractId = props.contractId
|
||||
formData.value.push(row)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = (index) => {
|
||||
formData.value.splice(index, 1)
|
||||
}
|
||||
|
||||
/** 表单校验 */
|
||||
const validate = () => {
|
||||
return formRef.value.validate()
|
||||
}
|
||||
|
||||
/** 表单值 */
|
||||
const getData = () => {
|
||||
return formData.value
|
||||
}
|
||||
|
||||
defineExpose({ validate, getData })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,151 @@
|
|||
<template>
|
||||
<Dialog :title="dialogTitle" v-model="dialogVisible">
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
label-width="100px"
|
||||
v-loading="formLoading"
|
||||
>
|
||||
<el-form-item label="用户姓名" prop="userName">
|
||||
<el-input v-model="formData.userName" placeholder="请输入用户姓名" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户联系方式" prop="userContact">
|
||||
<el-input v-model="formData.userContact" placeholder="请输入用户联系方式" />
|
||||
</el-form-item>
|
||||
<el-form-item label="预约日期" prop="reservationDate">
|
||||
<el-date-picker
|
||||
v-model="formData.reservationDate"
|
||||
type="date"
|
||||
value-format="x"
|
||||
placeholder="选择预约日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="预约时间" prop="reservationTime">
|
||||
<el-date-picker
|
||||
v-model="formData.reservationTime"
|
||||
type="date"
|
||||
value-format="x"
|
||||
placeholder="选择预约时间"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="实验室名称" prop="labName">
|
||||
<el-input v-model="formData.labName" placeholder="请输入实验室名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="参与人员" prop="joinPeople">
|
||||
<el-input v-model="formData.joinPeople" placeholder="请输入参与人员" />
|
||||
</el-form-item>
|
||||
<el-form-item label="实验内容及设备" prop="equipment">
|
||||
<el-input v-model="formData.equipment" placeholder="请输入实验内容及设备" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="reservationNotes">
|
||||
<el-input v-model="formData.reservationNotes" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单位ID" prop="deptId">
|
||||
<el-input v-model="formData.deptId" placeholder="请输入单位ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单位名称" prop="deptName">
|
||||
<el-input v-model="formData.deptName" placeholder="请输入单位名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="乐观锁" prop="revision">
|
||||
<el-input v-model="formData.revision" placeholder="请输入乐观锁" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { Api, VO } from '@/api/publicLab/publicLab'
|
||||
|
||||
/** 公共实验室信 表单 */
|
||||
defineOptions({ name: 'Form' })
|
||||
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
|
||||
const dialogVisible = ref(false) // 弹窗的是否展示
|
||||
const dialogTitle = ref('') // 弹窗的标题
|
||||
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
||||
const formType = ref('') // 表单的类型：create - 新增；update - 修改
|
||||
const formData = ref({
|
||||
id: undefined,
|
||||
userName: undefined,
|
||||
userContact: undefined,
|
||||
reservationDate: undefined,
|
||||
reservationTime: undefined,
|
||||
labName: undefined,
|
||||
joinPeople: undefined,
|
||||
equipment: undefined,
|
||||
reservationNotes: undefined,
|
||||
deptId: undefined,
|
||||
deptName: undefined,
|
||||
revision: undefined,
|
||||
})
|
||||
const formRules = reactive({
|
||||
})
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 打开弹窗 */
|
||||
const open = async (type: string, id?: number) => {
|
||||
dialogVisible.value = true
|
||||
dialogTitle.value = t('action.' + type)
|
||||
formType.value = type
|
||||
resetForm()
|
||||
// 修改时，设置数据
|
||||
if (id) {
|
||||
formLoading.value = true
|
||||
try {
|
||||
formData.value = await Api.get(id)
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
}
|
||||
}
|
||||
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
||||
|
||||
/** 提交表单 */
|
||||
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
|
||||
const submitForm = async () => {
|
||||
// 校验表单
|
||||
await formRef.value.validate()
|
||||
// 提交请求
|
||||
formLoading.value = true
|
||||
try {
|
||||
const data = formData.value as unknown as VO
|
||||
if (formType.value === 'create') {
|
||||
await Api.create(data)
|
||||
message.success(t('common.createSuccess'))
|
||||
} else {
|
||||
await Api.update(data)
|
||||
message.success(t('common.updateSuccess'))
|
||||
}
|
||||
dialogVisible.value = false
|
||||
// 发送操作成功的事件
|
||||
emit('success')
|
||||
} finally {
|
||||
formLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/** 重置表单 */
|
||||
const resetForm = () => {
|
||||
formData.value = {
|
||||
id: undefined,
|
||||
userName: undefined,
|
||||
userContact: undefined,
|
||||
reservationDate: undefined,
|
||||
reservationTime: undefined,
|
||||
labName: undefined,
|
||||
joinPeople: undefined,
|
||||
equipment: undefined,
|
||||
reservationNotes: undefined,
|
||||
deptId: undefined,
|
||||
deptName: undefined,
|
||||
revision: undefined,
|
||||
}
|
||||
formRef.value?.resetFields()
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in New Issue