src/api/level.js

@@ -0,0 +1,24 @@
+import request from '@/utils/request'
+
+export function getLevelList() {
+  return request({
+    url: '/showLevel',
+    method: 'get'
+  }) 
+}
+
+export function addLevel(data) {
+  return request({
+    url: '/insertOneLevel',
+    method: 'post',
+    data
+  }) 
+}
+
+export function deleteLevel(params) {
+  return request({
+    url: '/delOneLevel',
+    method: 'get',
+    params
+  }) 
+}

src/utils/request.js

@@ -45,31 +45,32 @@ service.interceptors.response.use(
   response => {
     const res = response.data
 
-    // if the custom code is not 20000, it is judged as an error.
-    if (res.code !== 20000) {
-      Message({
-        message: res.message || 'Error',
-        type: 'error',
-        duration: 5 * 1000
-      })
+    // // if the custom code is not 20000, it is judged as an error.
+    // if (res.code !== 20000) {
+    //   Message({
+    //     message: res.message || 'Error',
+    //     type: 'error',
+    //     duration: 5 * 1000
+    //   })
 
-      // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
-      if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
-        // to re-login
-        MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
-          confirmButtonText: 'Re-Login',
-          cancelButtonText: 'Cancel',
-          type: 'warning'
-        }).then(() => {
-          store.dispatch('user/resetToken').then(() => {
-            location.reload()
-          })
-        })
-      }
-      return Promise.reject(new Error(res.message || 'Error'))
-    } else {
-      return res
-    }
+    //   // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
+    //   if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
+    //     // to re-login
+    //     MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
+    //       confirmButtonText: 'Re-Login',
+    //       cancelButtonText: 'Cancel',
+    //       type: 'warning'
+    //     }).then(() => {
+    //       store.dispatch('user/resetToken').then(() => {
+    //         location.reload()
+    //       })
+    //     })
+    //   }
+    //   return Promise.reject(new Error(res.message || 'Error'))
+    // } else {
+    //   return res
+    // }
+    return res
   },
   error => {
     console.log('err' + error) // for debug

src/views/level/addLevel.vue

@@ -2,10 +2,10 @@
   <div>
     <h1 class="list-title">添加等级</h1>
     <el-form :model="addLevelRuleForm" ref="addLevelRuleForm" label-width="100px" class="demo-addLevelRuleForm">
-      <el-form-item label="等级名称" prop="age" :rules="[
+      <el-form-item label="等级名称" prop="levelname" :rules="[
         { required: true, message: '等级名称不能为空' }
       ]">
-        <el-input v-model.number="addLevelRuleForm.age" autocomplete="off"></el-input>
+        <el-input v-model="addLevelRuleForm.levelname" autocomplete="off"></el-input>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="submitForm('addLevelRuleForm')">提交</el-button>
@@ -16,11 +16,13 @@
 </template>
 
 <script>
+import {addLevel} from '@/api/level'
+
 export default {
   data() {
     return {
       addLevelRuleForm: {
-        age: ''
+        levelname: ''
       }
     };
   },
@@ -28,7 +30,23 @@ export default {
     submitForm(formName) {
       this.$refs[formName].validate((valid) => {
         if (valid) {
-          alert('submit!');
+          addLevel({
+            levelname: this.addLevelRuleForm.levelname
+          }).then(res => {
+            if (res.code == 101) {
+              this.$message({
+                message: res.message,
+                type: 'success'
+              })
+              this.$router.push({
+                path: '/level/levelList'
+              })
+            } else {
+              this.$message.error(res.message);
+            }
+          }).catch(err => {
+            this.$message.error(err.message);
+          })
         } else {
           console.log('error submit!!');
           return false;

src/views/level/levelList.vue

@@ -2,90 +2,70 @@
   <div>
     <h1 class="list-title">等级列表</h1>
     <hr>
-    <el-table :data="tableData" style="width: 1000px" max-height="250" class="list-table">
-      <el-table-column fixed prop="date" label="日期" width="150">
-      </el-table-column>
-      <el-table-column prop="name" label="姓名" width="120">
-      </el-table-column>
-      <el-table-column prop="province" label="省份" width="120">
-      </el-table-column>
-      <el-table-column prop="city" label="市区" width="120">
-      </el-table-column>
-      <el-table-column prop="address" label="地址" width="300">
-      </el-table-column>
-      <el-table-column prop="zip" label="邮编" width="120">
-      </el-table-column>
-      <el-table-column fixed="right" label="操作" width="120">
-        <template slot-scope="scope">
-          <el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small">
-            移除
-          </el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+    <div v-show="isShow">
+      <el-table :data="tableData" style="width: 500px" max-height="250" class="list-table">
+        <el-table-column fixed prop="jrid" label="等级ID" width="150">
+        </el-table-column>
+        <el-table-column prop="levelname" label="等级名称" width="120">
+        </el-table-column>
+        <el-table-column fixed="right" label="操作" width="120">
+          <template slot-scope="scope">
+            <el-button @click.native.prevent="deleteRow(scope.row)" type="text" size="small">
+              移除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <div v-show="!isShow">
+      <p>暂时没有等级</p>
+    </div>
   </div>
 </template>
 
 <script>
+import { getLevelList, deleteLevel } from '@/api/level';
+
 export default {
   methods: {
-    deleteRow(index, rows) {
-      rows.splice(index, 1);
+    deleteRow(row) {
+      deleteLevel({
+        levelid: row.jrid
+      }).then(res => {
+        if (res.code == 101) {
+          this.$message({
+            message: res.message,
+            type: 'success'
+          })
+          this.showLevelList()
+        }else {
+          this.$message.error(res.message);
+        }
+      }).catch(err => {
+        this.$message.error(err.message);
+      })
+    },
+    showLevelList() {
+      getLevelList().then(res => {
+        console.log('res', res)
+        if (res.code == 101) {
+          this.tableData = res.data
+        } else {
+          this.isShow = false  
+        }
+      }).catch(err => {
+        console.log('err', err)
+      })
     }
   },
   data() {
     return {
-      tableData: [{
-        date: '2016-05-03',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }, {
-        date: '2016-05-02',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }, {
-        date: '2016-05-04',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }, {
-        date: '2016-05-01',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }, {
-        date: '2016-05-08',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }, {
-        date: '2016-05-06',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }, {
-        date: '2016-05-07',
-        name: '王小虎',
-        province: '上海',
-        city: '普陀区',
-        address: '上海市普陀区金沙江路 1518 弄',
-        zip: 200333
-      }]
+      tableData: [],
+      isShow: true
     }
+  },
+  created() {
+    this.showLevelList()
   }
 }
 </script>
@@ -96,6 +76,7 @@ export default {
   color: #4f4e4e;
   font-weight: normal;
 }
+
 .list-table {
   margin: 0 auto;
 }