实现模板模块功能

src/views/template/Delete.vue

@@ -37,11 +37,7 @@
         </el-table-column>
         <el-table-column label="操作" width="150">
           <template #default="scope">
-            <el-button
-              link
-              type="danger"
-              @click="handleDelete(scope.row)"
-            >删除</el-button>
+            <el-button link type="danger" @click="handleDelete(scope.row)">删除</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -52,6 +48,7 @@
 <script setup>
 import { ref } from 'vue'
 import { ElMessageBox, ElMessage } from 'element-plus'
+import axios from 'axios';
 
 const searchForm = ref({
   templateName: '',
@@ -71,21 +68,21 @@ const typeMap = {
   hospitalization: '住院'
 }
 
-const tableData = ref([
-  {
-    templateName: '内科常规问诊模板',
-    department: 'internal',
-    type: 'first'
-  },
-  {
-    templateName: '儿科发热问诊模板',
-    department: 'pediatrics',
-    type: 'first'
-  }
-])
+const tableData = ref([])
 
-const onSearch = () => {
-  // 实现搜索逻辑
+const onSearch = async () => {
+  try {
+    const token = sessionStorage.getItem('token');
+    const response = await axios.get('http://localhost:8080/api/templates', {
+      params: searchForm.value,
+      headers: {
+        'Authorization': `Bearer ${token}`
+      }
+    });
+    tableData.value = response.data;
+  } catch (error) {
+    ElMessage.error('查询失败，请检查输入或联系管理员。');
+  }
 }
 
 const onReset = () => {
@@ -105,13 +102,23 @@ const handleDelete = (row) => {
       type: 'warning'
     }
   )
-    .then(() => {
-      // 实现删除逻辑
-      ElMessage.success('删除成功')
+    .then(async () => {
+      try {
+        const token = sessionStorage.getItem('token');
+        await axios.delete(`http://localhost:8080/api/templates/${row.id}`, {
+          headers: {
+            'Authorization': `Bearer ${token}`
+          }
+        });
+        ElMessage.success('删除成功');
+        onSearch();
+      } catch (error) {
+        ElMessage.error('删除失败');
+      }
     })
     .catch(() => {
-      ElMessage.info('已取消删除')
-    })
+      ElMessage.info('已取消删除');
+    });
 }
 </script>
 

src/views/template/Edit.vue

@@ -60,6 +60,7 @@
 <script setup>
 import { ref } from 'vue'
 import { ElMessage } from 'element-plus'
+import axios from 'axios'; // 导入axios
 
 const searchForm = ref({
   templateName: ''
@@ -75,21 +76,39 @@ const form = ref({
   remarks: ''
 })
 
-const onSearch = () => {
-  // 模拟查询到数据
-  form.value = {
-    templateName: searchForm.value.templateName,
-    department: 'internal',
-    type: 'first',
-    content: '1. 主诉：\n2. 现病史：\n3. 既往史：\n4. 体格检查：',
-    remarks: '适用于内科初诊患者'
+const onSearch = async () => {
+  try {
+    const token = sessionStorage.getItem('token'); // 从sessionStorage获取token
+    const response = await axios.get('http://localhost:8080/api/templates', {
+      params: { templateName: searchForm.value.templateName },
+      headers: {
+        'Authorization': `Bearer ${token}` // 添加Authorization头
+      }
+    });
+    if (response.data.length > 0) {
+      form.value = response.data[0]; // 假设返回的数据结构与form一致
+      showEditForm.value = true;
+    } else {
+      ElMessage.warning('未找到模板');
+    }
+  } catch (error) {
+    ElMessage.error('查询失败，请检查输入或联系管理员。');
   }
-  showEditForm.value = true
 }
 
-const onSubmit = () => {
-  ElMessage.success('修改成功')
-  showEditForm.value = false
+const onSubmit = async () => {
+  try {
+    const token = sessionStorage.getItem('token'); // 从sessionStorage获取token
+    await axios.put(`http://localhost:8080/api/templates/${form.value.id}`, form.value, {
+      headers: {
+        'Authorization': `Bearer ${token}` // 添加Authorization头
+      }
+    });
+    ElMessage.success('修改成功');
+    showEditForm.value = false;
+  } catch (error) {
+    ElMessage.error('修改失败');
+  }
 }
 </script>
 

src/views/template/Input.vue

@@ -49,6 +49,7 @@
 <script setup>
 import { ref } from 'vue'
 import { ElMessage } from 'element-plus'
+import axios from 'axios'; // 导入axios
 
 const form = ref({
   templateName: '',
@@ -58,8 +59,18 @@ const form = ref({
   remarks: ''
 })
 
-const onSubmit = () => {
-  ElMessage.success('模板提交成功')
+const onSubmit = async () => {
+  try {
+    const token = sessionStorage.getItem('token'); // 从sessionStorage获取token
+    await axios.post('http://localhost:8080/api/templates', form.value, {
+      headers: {
+        'Authorization': `Bearer ${token}` // 添加Authorization头
+      }
+    });
+    ElMessage.success('模板提交成功');
+  } catch (error) {
+    ElMessage.error('提交失败');
+  }
 }
 
 const onReset = () => {

src/views/template/Query.vue

@@ -62,6 +62,7 @@
 <script setup>
 import { ref } from 'vue'
 import { ElMessage } from 'element-plus'
+import axios from 'axios'; // 导入axios
 
 const searchForm = ref({
   templateName: '',
@@ -81,28 +82,24 @@ const typeMap = {
   hospitalization: '住院'
 }
 
-const tableData = ref([
-  {
-    templateName: '内科常规问诊模板',
-    department: 'internal',
-    type: 'first',
-    content: '1. 主诉：\n2. 现病史：\n3. 既往史：\n4. 体格检查：',
-    remarks: '适用于内科初诊患者'
-  },
-  {
-    templateName: '儿科发热问诊模板',
-    department: 'pediatrics',
-    type: 'first',
-    content: '1. 发热情况：\n2. 伴随症状：\n3. 用药情况：\n4. 体格检查：',
-    remarks: '适用于儿科发热患者初诊'
-  }
-])
+const tableData = ref([])
 
 const dialogVisible = ref(false)
 const currentTemplate = ref({})
 
-const onSearch = () => {
-  // 实现搜索逻辑
+const onSearch = async () => {
+  try {
+    const token = sessionStorage.getItem('token'); // 从sessionStorage获取token
+    const response = await axios.get('http://localhost:8080/api/templates', { // 确保使用正确的后端地址
+      params: searchForm.value,
+      headers: {
+        'Authorization': `Bearer ${token}` // 添加Authorization头
+      }
+    });
+    tableData.value = response.data; // 假设返回的数据结构与tableData一致
+  } catch (error) {
+    ElMessage.error('查询失败，请检查输入或联系管理员。'); // 添加错误提示
+  }
 }
 
 const onReset = () => {