admin

10_vuecli/vueadmin/src/api/level.js

@@ -23,3 +23,12 @@ export function saveOrUpdateLevel(data) {
         data
     })
 }
+// 定义删除等级的方法
+export function deleteLevel(data) {
+    return request({
+        url:"/levelController/deleteLevel",
+        method:"delete",
+        // delete 请求传递的是data对象    
+        data
+    })
+}

10_vuecli/vueadmin/src/views/level/LevelAdd.vue

@@ -32,7 +32,7 @@ export default {
             this.$refs[formName].validate((valid) => {
                 // 校验通过后 提交表单
                 if (valid) {
-                    alert('submit!');
+                    // alert('submit!');
                     // 调用添加等级的方法
                     // 定义传递的参数
                     let levelName = {
@@ -40,6 +40,12 @@ export default {
                     }
                     saveOrUpdateLevel(levelName).then(res => {
                         console.log(res)
+                        // 添加等级成功回调函数
+                        this.$message({
+                            message: '添加等级成功!',
+                            type: 'success'
+                        });
+                        this.$router.push("/level/levellist")
                     })
                 } else {
                     // 校验不通过后 提示用户
@@ -59,6 +65,6 @@ export default {
 <style scoped>
 .leveladd {
     width: 400px;
-    margin:200px auto;
+    margin: 200px auto;
 }
 </style>

10_vuecli/vueadmin/src/views/level/LevelList.vue

@@ -3,7 +3,7 @@
         <!-- 等级列表页面 -->
         <div class="level-content">
             <div class="btn-content">
-                <el-button type="primary">添加等级</el-button>
+                <el-button @click="goAddPage" type="primary">添加等级</el-button>
             </div>
             <div class="table-content">
                 <!-- 表格 -->
@@ -15,8 +15,13 @@
                         <el-table-column label="操作">
                             <template slot-scope="scope">
                                 <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
-                                <el-button size="mini" type="danger"
-                                    @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+                                <!-- <el-button size="mini" type="danger"
+                                    @click="handleDelete(scope.$index, scope.row)">删除</el-button> -->
+                                <template>
+                                    <el-popconfirm title="这是一段内容确定删除吗？" @onConfirm="handleDelete(scope.row)">
+                                        <el-button size="mini" type="danger" slot="reference">删除</el-button>
+                                    </el-popconfirm>
+                                </template>
                             </template>
                         </el-table-column>
                     </el-table>
@@ -27,7 +32,7 @@
 </template>
 <script>
 // 引入获取等级列表的方法 通过解构赋值接收相应的方法
-import { getLevelList } from '@/api/level'
+import { getLevelList, deleteLevel } from '@/api/level'
 export default {
     name: 'LevelList',
     data() {
@@ -42,6 +47,11 @@ export default {
         this.getLevelHandle()
     },
     methods: {
+        // 跳转添加等级页面
+        goAddPage() {
+            // 跳转添加等级页面
+            this.$router.push('/level/leveladd')
+        },
         // 获取等级函数
         getLevelHandle() {
             // 调用获取等级列表的方法
@@ -54,8 +64,13 @@ export default {
         handleEdit(index, row) {
             console.log(index, row);
         },
-        handleDelete(index, row) {
-            console.log(index, row);
+        // 删除等级函数
+        handleDelete(row) {
+            console.log(row.jrid, row.levelname);
+            // 调用删除等级的方法
+            deleteLevel([row.jrid]).then(res => {
+                console.log(res.msg)
+            })
         }
     }
 }