yd-yunxing-web/src/views/knowledge/dataset-form/components/edit-doc.vue

118 lines
3.2 KiB
Vue

<!--
- Copyright (c) 2024 LangChat. TyCoding All Rights Reserved.
-
- Licensed under the GNU Affero General Public License, Version 3 (the "License");
- you may not use this file except in compliance with the License.
- You may obtain a copy of the License at
-
- https://www.gnu.org/licenses/agpl-3.0.html
-
- Unless required by applicable law or agreed to in writing, software
- distributed under the License is distributed on an "AS IS" BASIS,
- WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- See the License for the specific language governing permissions and
- limitations under the License.
-->
<script setup lang="ts">
import { nextTick, ref } from 'vue'
import { DocsApi } from '@/api/new-ai/docs'
import { ElMessage } from 'element-plus'
import { FormSchema } from '@/types/form'
import { isNullOrWhitespace } from '@/utils/is'
import { useForm } from '@/hooks/web/useForm'
import { useRoute } from 'vue-router'
const route = useRoute()
const emit = defineEmits(['reload'])
const showModal = ref(false)
const loading = ref(false)
const { methods, elFormRef, register } = useForm()
const formRef = ref()
const editFlag = ref(false)
const formSchema = ref<FormSchema[]>([
{
label: '文档名称',
field: 'name',
component: 'Input',
componentProps: {
placeholder: '请输入文档名称'
},
formItemProps: {
rules: [{ required: true, message: '请输入文档名称', trigger: ['blur'] }]
}
},
{
label: '文档内容',
field: 'content',
component: 'Input',
componentProps: {
placeholder: '请输入文档内容',
type: 'textarea',
autosize: {
minRows: 10,
maxRows: 20
}
},
formItemProps: {
rules: [{ required: true, message: '请输入文档内容', trigger: ['blur'] }]
}
}
])
async function show(knowledgeId: string, id?: string) {
showModal.value = true
await nextTick()
if (id) {
editFlag.value = true
const res = await DocsApi.getDocsById(id)
methods.setValues(res)
}
}
async function handleSubmit() {
await elFormRef.value?.validate()
const formData =await methods.getFormData() as Record<string, any>
console.log(formData)
formData.knowledgeId = route.params.id as string
if (!formData.name) {
ElMessage.error('请完善表单')
return
}
try {
if (isNullOrWhitespace(formData.id)) {
await DocsApi.addDocs(formData)
ElMessage.success('新增成功')
} else {
await DocsApi.updateDocs(formData)
ElMessage.success('修改成功')
}
showModal.value = false
emit('reload')
} catch (error) {
ElMessage.error('操作失败')
}
}
defineExpose({ show })
</script>
<template>
<el-dialog
v-model="showModal"
:title="editFlag ? '编辑文档' : '新增文档'"
width="500px"
:close-on-click-modal="!loading"
:close-on-press-escape="!loading"
destroy-on-close
>
<Form :schema="formSchema" ref="formRef" @register="register" />
<template #footer>
<el-button @click="showModal = false" :loading="loading">取消</el-button>
<el-button type="primary" @click="handleSubmit" :loading="loading">确定</el-button>
</template>
</el-dialog>
</template>
<style lang="scss" scoped></style>