Merge remote-tracking branch 'origin/Vue健康'

# Conflicts:
#	src/store/modules/user.js

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/api/health.js

@@ -0,0 +1,30 @@
+import request from '@/utils/request'
+
+export function healthList(data) {
+  return request({
+    url: '/health/health/list',
+    method: 'post',
+    data
+  })
+}
+export function healthAdd(data) {
+  return request({
+    url: '/health/health/addHealth',
+    method: 'post',
+    data
+  })
+}
+export function healthUpdate(data) {
+  return request({
+    url: '/health/health/updateHealth',
+    method: 'post',
+    data
+  })
+}
+export function healthDelete(healthId) {
+  return request({
+    url: '/health/health/deleteHealth?healthId='+healthId,
+    method: 'post'
+  })
+}
+

src/api/manage.js

@@ -0,0 +1,34 @@
+import request from '@/utils/request'
+
+export function List(data) {
+  return request({
+    url: '/manage/list',
+    method: 'post',
+    data
+  })
+}
+
+export function addAdd2(data) {
+  return request({
+    url: '/manage/add',
+    method: 'post',
+    data
+  })
+}
+
+
+export function updAll(data) {
+  return request({
+    url: '/manage/upd',
+    method: 'post',
+    data
+  })
+}
+
+
+export function delAll(manageId) {
+  return request({
+    url: '/manage/del?manageId='+manageId,
+    method: 'post',
+  })
+}

src/api/trees.js

@@ -0,0 +1,14 @@
+import request from '@/utils/request'
+
+export function tree() {
+  return request({
+    url: '/trees/tress/selectOne',
+    method: 'post'
+  })
+}
+export function trees() {
+  return request({
+    url: '/trees/tress/selectTwo',
+    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
@@ -77,6 +76,19 @@ export const constantRoutes = [
     ]
   },
 
+  {
+    path: '/manage',
+    component: Layout,
+    children: [
+      {
+        path: 'index',
+        name: '疾病管理',
+        component: () => import('@/views/manage/index'),
+        meta: { title: '疾病管理', icon: 'el-icon-platform-eleme' }
+      }
+    ]
+  },
+
   {
     path: '/form',
     component: Layout,
@@ -89,7 +101,43 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/healthList',
+    component: Layout,
+    children: [
+      {
+        path: 'index',
+        name: 'HealthList',
+        component: () => import('@/views/healthList/index'),
+        meta: { title: 'HealthList', icon: 'form' }
+      }
+    ]
+  },
+  {
+    path: '/trees',
+    component: Layout,
+    children: [
+      {
+        path: 'index',
+        name: 'Trees',
+        component: () => import('@/views/trees/index'),
+        meta: { title: 'trees', icon: 'form' }
+      }
+    ]
+  },
 
+  {
+    path: '/case',
+    component: Layout,
+    children: [
+      {
+        path: 'index',
+        name: 'Form',
+        component: () => import('@/views/case/index'),
+        meta: { title: '病例信息', icon: 'form' }
+      }
+    ]
+  },
   {
     path: '/nested',
     component: Layout,

src/store/modules/user.js

@@ -43,26 +43,26 @@ const actions = {
     })
   },
 
-  // get user info
-  getInfo({ commit, state }) {
-    return new Promise((resolve, reject) => {
-      getInfo(state.token).then(response => {
-        const { data } = response
-
-        if (!data) {
-          return reject('Verification failed, please Login again.')
-        }
-
-        const { username, avatar } = data
-
-        commit('SET_NAME', name)
-        commit('SET_AVATAR', username)
-        resolve(data)
-      }).catch(error => {
-        reject(error)
-      })
-    })
-  },
+  // // get user info
+  // getInfo({ commit, state }) {
+  //   return new Promise((resolve, reject) => {
+  //     getInfo(state.token).then(response => {
+  //       const { data } = response
+  //
+  //       if (!data) {
+  //         return reject('Verification failed, please Login again.')
+  //       }
+  //
+  //       const { username, avatar } = data
+  //
+  //       commit('SET_NAME', name)
+  //       commit('SET_AVATAR', username)
+  //       resolve(data)
+  //     }).catch(error => {
+  //       reject(error)
+  //     })
+  //   })
+  // },
 
   // user logout
   logout({ commit, state }) {

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>

src/views/dashboard/index.vue

@@ -8,7 +8,7 @@
 import { mapGetters } from 'vuex'
 
 export default {
-  name: 'Dashboard',
+   name: 'Dashboard',
   computed: {
     ...mapGetters([
       'name'

src/views/healthList/index.vue

@@ -0,0 +1,279 @@
+<template>
+  <center>
+    <div>
+      <el-form :inline="true" :model="health" class="demo-form-inline">
+        <el-form-item label="健康教育标题">
+          <el-input v-model="health.healthTitle" placeholder="标题"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit">查询</el-button>
+        </el-form-item>
+      </el-form>
+    <div style="width: 100%">
+      <template>
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          height="500">
+          <el-table-column
+
+            prop="healthId"
+            label="健康教育ID"
+            width="150">
+          </el-table-column>
+          <el-table-column
+            prop="healthTitle"
+            label="健康教育标题"
+            width="120">
+          </el-table-column>
+          <el-table-column
+            prop="healthContent"
+            label="内容"
+            width="120">
+          </el-table-column>
+          <el-table-column
+            prop="healthDate"
+            label="发布时间"
+            width="120">
+          </el-table-column>
+          <el-table-column
+            prop="username"
+            label="发布人"
+            width="300">
+          </el-table-column>
+          <el-table-column label="操作">
+            <template slot-scope="scope">
+              <el-button type="text" @click="handlerClient(scope.row)">点击修改</el-button>
+              <el-button size="mini" type="danger"@click="handleDelete(scope.row.healthId)">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </template>
+      <div>
+        <el-dialog
+          title="提示"
+          :visible.sync="dialogVisible"
+          width="30%"
+          :before-close="handleCloses">
+          <el-form ref="formone" :model="formone" label-width="80px">
+            <el-form-item label="标题">
+              <el-input v-model="formone.healthTitle"></el-input>
+            </el-form-item>
+            <el-form-item label="内容">
+              <el-input v-model="formone.healthContent"></el-input>
+            </el-form-item>
+            <el-form-item label="发布时间">
+              <el-input v-model="formone.healthDate"></el-input>
+            </el-form-item>
+          </el-form>
+          <span slot="footer" class="dialog-footer">
+          <el-button @click="dialogVisible = false">取 消</el-button>
+          <el-button type="primary" @click="handlerSubmit">确 定</el-button>
+          </span>
+        </el-dialog>
+      </div>
+
+      <div class="block">
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page.sync="health.pageNum"
+          :page-sizes="[2, 3, 5, 7]"
+          :page-size=health.pageSize
+          layout="sizes, prev, pager, next"
+          :total=total>
+        </el-pagination>
+      </div>
+
+
+      <el-button type="text" @click="dialog = true">注入健康数据</el-button>
+      <el-drawer
+        title=" 注入健康教育 !"
+        :before-close="handleClose"
+        :visible.sync="dialog"
+        direction="ltr"
+        custom-class="demo-drawer"
+        ref="drawer"
+      >
+        <div class="demo-drawer__content">
+          <h1>发布人 :{{ name }}</h1>
+          <el-form :model="form">
+            <el-form-item label="健康教育标题" :label-width="formLabelWidth">
+              <el-input v-model="form.healthTitle" autocomplete="off"></el-input>
+            </el-form-item>
+            <el-form-item label="教育健康内容" :label-width="formLabelWidth">
+              <el-input v-model="form.healthContent" autocomplete="off"></el-input>
+            </el-form-item>
+            <el-form-item label="发布时间" :label-width="formLabelWidth">
+              <el-input v-model="form.healthDate" autocomplete="off"></el-input>
+            </el-form-item>
+          </el-form>
+
+          <div class="demo-drawer__footer">
+            <el-button @click="cancelForm">取 消</el-button>
+            <el-button type="primary" @click="$refs.drawer.closeDrawer()" :loading="loading">{{ loading ? '注入中 ...' : '确 定' }}</el-button>
+          </div>
+        </div>
+      </el-drawer>
+    </div>
+    </div>
+
+  </center>
+
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+import {healthAdd, healthDelete, healthList, healthUpdate} from "@/api/health";
+import {mapGetters} from "vuex";
+
+export default {
+    //import引入的组件需要注入到对象中才能使用"
+    components: {},
+    props: {},
+    data() {
+      //这里存放数据"
+
+      return {
+        dialogVisible: false,
+        centerDialogVisible: false,
+        dialog: false,
+        loading: false,
+        tableData:[],
+        health:{
+          pageNum:1,
+          pageSize:2
+        },
+        total:0,
+        form: {},
+        formLabelWidth:"120px",
+        timer:null,
+        formone:{}
+      };
+    },
+    //计算属性 类似于data概念",
+    computed: {
+      ...mapGetters([
+        'name'
+      ])
+    },
+    //监控data中的数据变化",
+    watch: {},
+    //方法集合",
+    methods: {
+
+      list() {
+        healthList(this.health).then(
+          res => {
+            console.log(res)
+            this.tableData = res.data.list
+            this.total = res.data.total
+          }
+        )
+      },
+      handleSizeChange(val) {
+        console.log(`每页 ${val} 条`)
+        this.health.pageSize = val
+        this.list()
+      },
+      handleCurrentChange(val) {
+        console.log(`当前页: ${val}`)
+        this.health.pageNum = val
+        this.list()
+      },
+      handleClose(done) {
+        if (this.loading) {
+          return;
+        }
+        this.$confirm('确定要提交表单吗？')
+          .then(_ => {
+            this.loading = true;
+            this.timer = setTimeout(() => {
+              done();
+              // 动画关闭需要一定的时间
+              setTimeout(() => {
+                this.loading = false;
+              }, 400);
+            }, 2000);
+            healthAdd(this.form)
+          })
+          .catch(_ => {
+          });
+      },
+      cancelForm() {
+        this.loading = false;
+        this.dialog = false;
+        clearTimeout(this.timer);
+      },
+      onSubmit(){
+        healthList(this.health).then(
+          res => {
+            console.log(res)
+            this.tableData = res.data.list
+            this.total = res.data.total
+          }
+        )
+      },
+
+      handleCloses(done) {
+        this.$confirm('确认关闭？')
+          .then(_ => {
+            done();
+          })
+          .catch(_ => {
+          });
+      },
+      handlerClient(healthValues) {
+        console.log(healthValues)
+        this.formone = healthValues
+        this.dialogVisible = true
+      },
+      handlerSubmit() {
+        healthUpdate(this.formone).then(
+          res => {
+            alert(res.msg)
+          }
+        )
+        this.dialogVisible = false
+      },
+      /*删除*/
+      handleDelete(healthId) {
+        healthDelete(healthId).then(
+          res => {
+            console.log(res)
+            alert(res.msg)
+            this.list()
+          }
+        )
+      },
+
+    },
+  //生命周期 - 创建完成（可以访问当前this实例）",
+  created: function () {
+    this.list()
+    this.form.healthDate = new Date().getFullYear() + "-" + new Date().getMonth() + "-" + new Date().getDay()
+    this.formone=this.health
+  },
+    //生命周期 - 挂载完成（可以访问DOM元素）",
+    mounted() {
+    },
+    beforeCreate() {
+    }, //生命周期 - 创建之前",
+    beforeMount() {
+    }, //生命周期 - 挂载之前",
+    beforeUpdate() {
+    }, //生命周期 - 更新之前",
+    updated() {
+    }, //生命周期 - 更新之后",
+    beforeDestroy() {
+    }, //生命周期 - 销毁之前",
+    destroyed() {
+    }, //生命周期 - 销毁完成",
+    activated() {
+    } //如果页面有keep-alive缓存功能，这个函数会触发",
+  };
+</script>
+<style scoped>
+
+</style>

src/views/login/index.vue

@@ -51,8 +51,8 @@
       </el-form-item>
 
       <el-button :loading="loading" type="primary" style="width:30%;margin-bottom:30px;" @click.native.prevent="handleLogin">登录</el-button>
-      <el-button :loading="loading" type="primary" style="width:30%;margin-bottom:30px;" @click="dialogFormVisible = true">注册</el-button>
-      <el-button :loading="loading"  type="primary" style="width:30%;margin-bottom:30px;" @click="From = true">找回密码</el-button>
+      <el-button  type="primary" style="width:30%;margin-bottom:30px;" @click="dialogFormVisible = true">注册</el-button>
+      <el-button   type="primary" style="width:30%;margin-bottom:30px;" @click="From = true">找回密码</el-button>
       <div class="tips">
         <span style="margin-right:20px;">username: admin</span>
         <span> password: any</span>

src/views/manage/index.vue

@@ -0,0 +1,204 @@
+<template>
+  <div>
+
+    <el-button type="primary" @click="addAll">添加病史人</el-button>
+
+    <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.manageId }}</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.caseMessage }}</span>
+        </template>
+      </el-table-column>
+
+      <el-table-column label="用户" width="180">
+        <template slot-scope="scope">
+          <span style="margin-left: 10px">{{ scope.row.username }}</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="操作">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            @click="handleEdit(scope.row)">修改病史人</el-button>
+          <el-button
+            size="mini"
+            type="danger"
+            @click="handleDelete(scope.row.manageId)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+
+    <el-dialog :title="title" :visible.sync="dialogFormVisible">
+      <el-form :model="manage">
+
+
+        <el-form-item label="病史id" :label-width="formLabelWidth">
+          <el-input v-model="manage.caseId" autocomplete="off"></el-input>
+        </el-form-item>
+
+
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="addAll1">确 定</el-button>
+      </div>
+    </el-dialog>
+
+
+
+    <el-dialog :title="title1" :visible.sync="dialogFormVisible1">
+      <el-form :model="manage">
+
+
+        <el-form-item label="病史id" :label-width="formLabelWidth">
+          <el-input v-model="manage.caseId" autocomplete="off"></el-input>
+        </el-form-item>
+
+        <el-form-item label="病史名称" :label-width="formLabelWidth">
+          <el-input v-model="manage.caseName" autocomplete="off"></el-input>
+        </el-form-item>
+
+        <el-form-item label="病史详情" :label-width="formLabelWidth">
+          <el-input v-model="manage.caseMessage" autocomplete="off"></el-input>
+        </el-form-item>
+
+        <el-form-item label="用户" :label-width="formLabelWidth">
+          <el-input v-model="manage.id" autocomplete="off"></el-input>
+        </el-form-item>
+
+
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="updAll">修改病史人</el-button>
+      </div>
+    </el-dialog>
+
+
+
+
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+import { addAdd2, delAll, List, updAll } from '@/api/manage'
+
+export default {
+    //import引入的组件需要注入到对象中才能使用"
+    components: {},
+    props: {},
+    data() {
+      //这里存放数据"
+
+      return {
+        tableData:[],
+        manage:{},
+        dialogFormVisible:false,
+        dialogFormVisible1:false,
+        formLabelWidth:'120px',
+        title:'添加病史人',
+        title1:'修改病史人',
+
+      };
+    },
+    //计算属性 类似于data概念",
+    computed: {},
+    //监控data中的数据变化",
+    watch: {},
+    //方法集合",
+    methods: {
+      handleDelete(manageId){
+        delAll(manageId).then(
+          res=>{
+            console.log(res)
+            this.$message.success(res.msg)
+            this.manageList()
+          }
+        )
+      },
+      updAll(){
+        updAll(this.manage).then(
+          res=>{
+            console.log(res)
+            this.$message.success(res.msg)
+            this.manageList()
+          }
+        )
+      },
+      handleEdit(obj){
+        this.manage=obj
+        this.title='修改病史人'
+        this.dialogFormVisible1=true
+
+      },
+      addAll1(){
+        addAdd2(this.manage).then(
+          res=>{
+            console.log(res)
+            this.$message.success(res.msg)
+            this.manageList()
+          }
+        )
+      },
+      addAll(){
+        this.manage={}
+        this.title='添加病史人'
+        this.dialogFormVisible=true
+      },
+      manageList(){
+        List().then(
+          res=>{
+            console.log(res)
+            this.$message.success(res.msg)
+            this.tableData=res.data
+          }
+        )
+      }
+    },
+    //生命周期 - 创建完成（可以访问当前this实例）",
+    created() {
+      this.manageList()
+    },
+    //生命周期 - 挂载完成（可以访问DOM元素）",
+    mounted() {
+    },
+    beforeCreate() {
+    }, //生命周期 - 创建之前",
+    beforeMount() {
+    }, //生命周期 - 挂载之前",
+    beforeUpdate() {
+    }, //生命周期 - 更新之前",
+    updated() {
+    }, //生命周期 - 更新之后",
+    beforeDestroy() {
+    }, //生命周期 - 销毁之前",
+    destroyed() {
+    }, //生命周期 - 销毁完成",
+    activated() {
+    } //如果页面有keep-alive缓存功能，这个函数会触发",
+  };
+</script>
+<style scoped>
+
+</style>

src/views/trees/index.vue

@@ -0,0 +1,90 @@
+<template>
+  <div>
+    <div style="width: 100%">
+    <template style="width: 100%"
+              height="500">
+      <el-table :data="tableData" stripe style="width: 100%">
+        <el-table-column prop="id" label="编号" width="180"></el-table-column>
+        <el-table-column prop="treesName" label="名称" width="180"></el-table-column>
+      </el-table>
+    </template>
+    </div>
+
+    <el-tree :data="tree" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
+  </div>
+</template>
+
+<script>
+//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
+//例如：import 《组件名称》 from '《组件路径》,
+import {tree,trees} from "@/api/trees";
+
+export default {
+    //import引入的组件需要注入到对象中才能使用"
+    components: {},
+    props: {},
+    data() {
+      //这里存放数据"
+
+      return {
+        tableData:[],
+        tree: [],
+        defaultProps: {
+          children: 'children',
+          label: 'treesName'
+        }
+      };
+    },
+    //计算属性 类似于data概念",
+    computed: {},
+    //监控data中的数据变化",
+    watch: {},
+    //方法集合",
+    methods: {
+      list(){
+        tree().then(
+          res=>{
+            console.log(res)
+            this.tableData = res.data
+          }
+        )
+      },
+      treeslist() {
+        trees().then(
+          res => {
+            console.log(res)
+            this.tree = res.data
+          }
+        )
+      },
+      handleNodeClick(tree) {
+        console.log('- - - '+JSON.stringify(tree));
+      }
+    },
+    //生命周期 - 创建完成（可以访问当前this实例）",
+    created() {
+      this.list()
+      this.treeslist()
+    },
+    //生命周期 - 挂载完成（可以访问DOM元素）",
+    mounted() {
+    },
+    beforeCreate() {
+    }, //生命周期 - 创建之前",
+    beforeMount() {
+    }, //生命周期 - 挂载之前",
+    beforeUpdate() {
+    }, //生命周期 - 更新之前",
+    updated() {
+    }, //生命周期 - 更新之后",
+    beforeDestroy() {
+    }, //生命周期 - 销毁之前",
+    destroyed() {
+    }, //生命周期 - 销毁完成",
+    activated() {
+    } //如果页面有keep-alive缓存功能，这个函数会触发",
+  };
+</script>
+<style scoped>
+
+</style>