no message

src/api/riskPrevention/planManage.ts

@@ -203,3 +203,10 @@ export const getDoc = (data) => {
     data: data
   });
 };
+export const importDocXls = (data) => {
+  return request({
+    url: '/api/emergency_plan/doc/import',
+    method: 'post',
+    data: data
+  });
+};

src/views/riskPrevention/planManage/DocRecord.vue

@@ -71,13 +71,27 @@
             </el-tab-pane>
         </el-tabs>
     </el-card>
+
+    <el-dialog ref="formDialogRef" v-model="showImportDlg"  title="导入结构化文档" width="500px" append-to-body>
+        <el-form ref="formRef" :model="form" :rules="rules">
+            <FileUpload v-model="form.filename" :file-type="['xls', 'xlsx']" :limit="1" />
+        </el-form>
+        <template #footer>
+            <div class="dialog-footer">
+                <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
+                <el-button @click="cancel">取 消</el-button>
+            </div>
+        </template>
+    </el-dialog>
 </template>
 
 
 <script setup lang="ts">
 import { ref } from 'vue';
 import type { TabsPaneContext } from 'element-plus';
-import { getDoc } from '@/api/riskPrevention/planManage';
+import { getDoc, importDocXls } from '@/api/riskPrevention/planManage';
+
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
 // const containerRef = ref<HTMLElement | null>(null);
 const doc_items = ref([]);
@@ -116,11 +130,55 @@ const getData = () => {
     })
 }
 
+const showImportDlg = ref(false);
+const formDialogRef = ref(null);
+const formRef = ref<ElFormInstance>();
+const buttonLoading = ref(false);
+
+const form = ref({
+    filename: ''
+});
+
+const rules = reactive({
+    filename: [{ required: true, message: '导入文件不能为空', trigger: 'blur' }]
+});
 
 const importDoc = () => {
+    resetForm();
+    showImportDlg.value = true;
+}
 
+const resetForm = () => {
+    form.value = {
+        filename:''
+    }
+    formRef.value?.resetFields();
+    formRef.value?.clearValidate();
 }
 
+/**提交按钮 */
+const submitForm = () => {
+    formRef.value?.validate(async (valid) => {
+        if (valid) {
+            try {
+                buttonLoading.value = true;
+                await importDocXls({ ...form.value, plan_id: props.id })
+                proxy?.$modal.msgSuccess('导入成功');
+                showImportDlg.value = false;
+                getData();
+            } finally {
+                buttonLoading.value = false;
+            }
+        }
+    })
+}
+
+
+/** 取消按钮 */
+const cancel = () => {
+  resetForm();
+  showImportDlg.value = false;
+};
 </script>