| | |
| | | <template> |
| | | <el-dialog v-model="centerDialogVisible" title="文档管理" width="500" center> |
| | | <el-form |
| | | ref="ruleFormRef" |
| | | style="max-width: 600px" |
| | | :model="ruleForm" |
| | | :rules="rules" |
| | | label-width="auto" |
| | | ref="ruleFormRef" |
| | | style="max-width: 600px" |
| | | :model="ruleForm" |
| | | :rules="rules" |
| | | label-width="auto" |
| | | > |
| | | <el-form-item label="名称" prop="name"> |
| | | <el-input v-model="ruleForm.name" placeholder="请输入文档名称" /> |
| | | <el-input v-model="ruleForm.name" placeholder="请输入文档名称"/> |
| | | </el-form-item> |
| | | <el-form-item label="请输入文档类型" prop="type"> |
| | | <el-select v-model="ruleForm.type" placeholder="请输入文档类型"> |
| | | <el-option label="合同" value="合同" /> |
| | | <el-option label="报告" value="报告" /> |
| | | <el-option label="合同" value="合同"/> |
| | | <el-option label="报告" value="报告"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="请输入文档状态" prop="status"> |
| | | <el-select v-model="ruleForm.status" placeholder="请输入文档状态"> |
| | | <el-option |
| | | v-for="option in options" |
| | | :key="option.value" |
| | | :label="option.label" |
| | | :value="option.value" |
| | | v-for="option in options" |
| | | :key="option.value" |
| | | :label="option.label" |
| | | :value="option.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | <el-row> |
| | | <el-col :span="24" style="text-align: right"> |
| | | <el-button @click="centerDialogVisible = false">取 消</el-button> |
| | | <el-button type="primary" @click="submit"> 确 定 </el-button> |
| | | <el-button type="primary" @click="submit"> 确 定</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | </template> |
| | | <fileUpload |
| | | ref="fileUploadRef" |
| | | :fileSize="1024" |
| | | :fileType="['pdf', 'docx', 'txt', 'xlsx', 'pptx....']" |
| | | :limit="10" |
| | | v-model:modelValue="modelValue" |
| | | ref="fileUploadRef" |
| | | :fileSize="1024" |
| | | :fileType="['pdf', 'docx', 'txt', 'xlsx', 'pptx....']" |
| | | :limit="10" |
| | | :drag="false" |
| | | v-model:modelValue="modelValue" |
| | | /> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { ref, watch } from "vue"; |
| | | import { addOrEditArchive } from "@/api/archiveManagement"; |
| | | import {ref, watch, nextTick} from "vue"; |
| | | import {addOrEditArchive} from "@/api/archiveManagement"; |
| | | import fileUpload from "@/components/FileUpload/index.vue"; |
| | | import { ElMessage } from "element-plus"; |
| | | import {ElMessage} from "element-plus"; |
| | | |
| | | const centerDialogVisible = defineModel("centerDialogVisible", { |
| | | type: Boolean, |
| | |
| | | const copyForm = ref(); |
| | | // 监听 row 的变化,更新 ruleForm |
| | | watch( |
| | | () => props.row, |
| | | (newRow) => { |
| | | copyForm.value = initFormData(newRow); |
| | | ruleForm.value = JSON.parse(JSON.stringify(copyForm.value)); |
| | | }, |
| | | { deep: true } |
| | | () => props.row, |
| | | (newRow) => { |
| | | copyForm.value = initFormData(newRow); |
| | | ruleForm.value = JSON.parse(JSON.stringify(copyForm.value)); |
| | | }, |
| | | {deep: true} |
| | | ); |
| | | const rules = { |
| | | name: [{ required: true, message: "请输入文档名称", trigger: "blur" }], |
| | | type: [{ required: true, message: "请选择文档类型", trigger: "blur" }], |
| | | status: [{ required: true, message: "请选择文档状态", trigger: "blur" }], |
| | | name: [{required: true, message: "请输入文档名称", trigger: "blur"}], |
| | | type: [{required: true, message: "请选择文档类型", trigger: "blur"}], |
| | | status: [{required: true, message: "请选择文档状态", trigger: "blur"}], |
| | | }; |
| | | const fileUploadRef = ref(null); |
| | | const initForm = () => { |
| | | ruleForm.value = {} |
| | | fileUploadRef.value.init() |
| | | ruleForm.value = {}; |
| | | nextTick(() => { |
| | | fileUploadRef.value.init(); |
| | | }); |
| | | }; |
| | | const editForm = (val) => { |
| | | ruleForm.value = copyForm.value; |
| | | // fileUploadRef.value.editInit(ruleForm.value); |
| | | nextTick(() => { |
| | | // console.log("编辑表单数据:", fileUploadRef.value); |
| | | fileUploadRef.value.editInit(val); |
| | | |
| | | fileUploadRef.value.editInit(val); |
| | | }); |
| | | }; |
| | | defineExpose({ |
| | |
| | | editForm, |
| | | }); |
| | | const options = [ |
| | | { value: "有效", label: "有效" }, |
| | | { value: "无效", label: "无效" }, |
| | | { value: "作废", label: "作废" }, |
| | | {value: "有效", label: "有效"}, |
| | | {value: "无效", label: "无效"}, |
| | | {value: "作废", label: "作废"}, |
| | | ]; |
| | | const emit = defineEmits(["submitForm", "update:modelValue"]); |
| | | const modelValue = ref([]); |
| | |
| | | // 调用 API |
| | | try { |
| | | const res = await addOrEditArchive(ruleForm.value); |
| | | ElMessage({ |
| | | type: "success", |
| | | message: res.msg || "操作成功", |
| | | }); |
| | | emit("submitForm", res); |
| | | } catch (error) { |
| | | ElMessage({ |
| | | type: "error", |
| | | message: error.msg || "操作失败", |
| | | }); |
| | | console.error("API 调用失败:", error); |
| | | return; |
| | | } |
| | | // 发送 emit 事件 |
| | | |
| | | |
| | | // 关闭对话框 |
| | | ElMessage.success("操作成功"); |
| | | centerDialogVisible.value = false; |
| | | } catch (error) { |
| | | console.error("表单验证失败或API调用失败:", error); |
| | | ElMessage({ |
| | | type: "error", |
| | | message: error.msg || "操作失败", |
| | | }); |
| | | } |
| | | }; |
| | | </script> |