病例

src/api/cases.js

@@ -0,0 +1,39 @@
+import request from '@/utils/request'
+
+export function sel(data) {
+  return request({
+    url: '/case/cases',
+    method: 'post',
+    data
+  })
+}
+
+export function insert(data) {
+  return request({
+    url: '/case/case',
+    method: 'post',
+    data
+  })
+}
+
+export function updatee(data) {
+  return request({
+    url: '/case/case',
+    method: 'put',
+    data
+  })
+}
+
+export function dele(data) {
+  return request({
+    url: '/case/case/' + data,
+    method: 'Delete'
+  })
+}
+
+export function sele(data) {
+  return request({
+    url: '/case/sele/' + data,
+    method: 'post'
+  })
+}

src/router/index.js

@@ -1,11 +1,10 @@
 import Vue from 'vue'
 import Router from 'vue-router'
-
-Vue.use(Router)
-
 /* Layout */
 import Layout from '@/layout'
 
+Vue.use(Router)
+
 /**
  * Note: sub-menu only appear when route children.length >= 1
  * Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html
@@ -90,6 +89,18 @@ export const constantRoutes = [
     ]
   },
 
+  {
+    path: '/case',
+    component: Layout,
+    children: [
+      {
+        path: 'index',
+        name: 'Form',
+        component: () => import('@/views/case/index'),
+        meta: { title: '病例信息', icon: 'form' }
+      }
+    ]
+  },
   {
     path: '/nested',
     component: Layout,

src/views/case/index.vue

@@ -0,0 +1,157 @@
+<template>
+  <div>
+    <template>
+      <el-table :data="tableData" style="width: 100%">
+        <el-table-column label="病例ID" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.caseId }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="病名" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.caseName }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="得病时间" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.caseTime }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="病情详情" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.caseMessage }}</span>
+          </template>
+        </el-table-column>
+
+
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button size="mini" @click="handleEdit(scope.row.caseId)">编辑</el-button>
+            <el-button size="mini" type="danger" @click="handleDelete(scope.row.caseId)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </template>
+    <el-dialog
+      title="提示"
+      :visible.sync="centerDialogVisible"
+      width="30%"
+      center>
+      <span>
+        <el-form ref="form" :model="aaa" label-width="80px">
+          <el-form-item label="病例ID">
+            <el-input v-model="aaa.caseId"></el-input>
+          </el-form-item>
+
+          <el-form-item label="病名">
+            <el-input v-model="aaa.caseName"></el-input>
+          </el-form-item>
+
+          <el-form-item label="得病时间">
+            <el-input v-model="aaa.caseTime"></el-input>
+          </el-form-item>
+
+          <el-form-item label="病情详情">
+            <el-input v-model="aaa.caseMessage"></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button @click="centerDialogVisible = false">取 消</el-button>
+            <el-button type="primary" @click="onSubmit">确 定</el-button>
+          </el-form-item>
+        </el-form>
+      </span>
+      <span slot="footer" class="dialog-footer">
+
+
+  </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {dele, sel, sele, updatee} from "@/api/cases";
+
+export default {
+  //import引入的组件需要注入到对象中才能使用"
+  components: {},
+  props: {},
+  data() {
+    //这里存放数据"
+    return {
+      form: {
+        pageSize: 3,
+        pageNum: 1
+      },
+      tableData: [],
+      table: [],
+      centerDialogVisible: false,
+      aaa: {
+        caseId: '',
+        caseName: '',
+        caseTime: '',
+        caseMessage: ''
+      }
+    };
+  },
+  //计算属性 类似于data概念",
+  computed: {},
+  //监控data中的数据变化",
+  watch: {},
+  //方法集合",
+  methods: {
+    onSubmit(){
+      updatee(this.aaa).then(res=>{
+        this.$message.success("成功")
+        window.location.reload()
+      })
+    },
+    show() {
+      sel(this.form).then(res => {
+        console.log(res)
+        this.tableData = res.data.list
+      })
+    },
+    handleEdit(id) {
+      sele(id).then(res => {
+        console.log(res)
+        this.aaa = res.data
+      })
+      this.centerDialogVisible = true
+    },
+    handleDelete(id) {
+      dele(id).then(res => {
+        console.log(res)
+        this.$message.success("删除成功")
+        window.location.reload()
+      })
+    }
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）",
+  created() {
+    this.show()
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）",
+  mounted() {
+  },
+  beforeCreate() {
+  }, //生命周期 - 创建之前",
+  beforeMount() {
+  }, //生命周期 - 挂载之前",
+  beforeUpdate() {
+  }, //生命周期 - 更新之前",
+  updated() {
+  }, //生命周期 - 更新之后",
+  beforeDestroy() {
+  }, //生命周期 - 销毁之前",
+  destroyed() {
+  }, //生命周期 - 销毁完成",
+  activated() {
+  } //如果页面有keep-alive缓存功能，这个函数会触发",
+};
+</script>
+<style scoped>
+
+</style>