admin

10-vuecli/vueapp/vueadmin/src/views/level/LevelAdd.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="level-add">
+    <h1 v-if="ruleForm.id">添加等级</h1>
     <div class="form-content">
       <!-- model 绑定数据 对应data中的变量 -->
       <!-- rules 表单验证规则 -->
@@ -33,12 +34,20 @@ export default {
     return {
       ruleForm: {
         name: "",
+        id:""
       },
       rules: {
         name: [{ required: true, message: "请输入等级名称", trigger: "blur" }],
       },
     };
   },
+  //   组件创建完成后生命周函数
+  created() {
+    console.log(this.$route.query.id);
+    console.log(this.$route.query.name);
+    this.ruleForm.name = this.$route.query.name;
+    this.ruleForm.id = this.$route.query.id;
+  },
   methods: {
     // 定义一个函数添加等级
     addFun() {
@@ -57,8 +66,8 @@ export default {
             message: "恭喜你，这是一条成功消息",
             type: "success",
           });
-        //   跳转页面
-        this.$router.push("/level/list");
+          //   跳转页面
+          this.$router.push("/level/list");
         })
         .catch((res) => {
           console.log(res);

10-vuecli/vueapp/vueadmin/src/views/level/LevelList.vue

@@ -2,7 +2,7 @@
   <div class="level-list">
     <!-- 按钮区域 -->
     <div class="input-content">
-      <el-button type="primary">添加等级</el-button>
+      <el-button type="primary" @click="goPage">添加等级</el-button>
     </div>
     <!-- 表格区域 -->
     <div class="table-content">
@@ -69,6 +69,10 @@ export default {
     this.getData();
   },
   methods: {
+    // 跳转添加等级页面
+    goPage(){
+      this.$router.push("/level/add");
+    },
     // 定义一个函数 用来获取数据
     getData() {
       // 发送请求
@@ -87,10 +91,19 @@ export default {
           console.log(err);
         });
     },
+    // 编辑按钮事件
     handleEdit(index, row) {
       console.log(index, row);
+      this.$router.push({
+        name:"LevelAdd",
+        query:{
+          id:row.jrid,
+          name:row.levelname
+        }
+      });
 
     },
+    // 删除按钮事件
     handleDelete(index, row) {
       // 删除等级
       axios({