From 5f22ad31f92b939ca3a1ee54bd690104a0a318e2 Mon Sep 17 00:00:00 2001
From: markma <750975972@qq.com>
Date: Fri, 28 Jan 2022 11:54:20 +0800
Subject: [PATCH] 08 debug and beautiful

---
 src/views/OuterAppDetail.vue     | 10 ++---
 src/views/OuterHistory.vue       | 14 +++----
 src/views/StudentAppForm.vue     | 48 ++++++++++++++++------
 src/views/StudentApplication.vue | 68 +++++++++++++++++++++++---------
 src/views/StudentHistory.vue     | 59 +++++++++++++++++++++------
 src/views/TeacherApplication.vue | 27 ++++++-------
 src/views/TeacherHistory.vue     | 16 ++++----
 7 files changed, 168 insertions(+), 74 deletions(-)

diff --git a/src/views/OuterAppDetail.vue b/src/views/OuterAppDetail.vue
index 0fe7a0c..ae2baa0 100644
--- a/src/views/OuterAppDetail.vue
+++ b/src/views/OuterAppDetail.vue
@@ -80,9 +80,9 @@ export default {
       let id = window.location.pathname.split('/')[3];
       let school_id = $_GET('school_id', window.location.href);
       console.log(school_id);
-      axios.get('http://localhost:8181/leaveDetail/findFromSIDTimeLimit/' + school_id + "/" + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findFromSIDTimeLimit/' + school_id + "/" + (currentPage) + '/20').then(function (resp) {
         _this.tableData = resp.data
-        _this.pageSize = 6
+        _this.pageSize = 20
         _this.total = resp.data.length
       })
     },
@@ -110,7 +110,7 @@ export default {
   },
   data() {
     return {
-      pageSize: 6,
+      pageSize: 20,
       total: 11,
       tableData: [{}]
     }
@@ -120,9 +120,9 @@ export default {
     let id = window.location.pathname.split('/')[3];
     let school_id = $_GET('school_id', window.location.href);
     console.log(school_id);
-    axios.get('http://localhost:8181/leaveDetail/findFromSIDTimeLimit/' + school_id + '/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findFromSIDTimeLimit/' + school_id + '/1/20').then(function (resp) {
       _this.tableData = resp.data
-      _this.pageSize = 6
+      _this.pageSize = 20
       _this.total = resp.data.length
     })
   }
diff --git a/src/views/OuterHistory.vue b/src/views/OuterHistory.vue
index a2785da..d16547b 100644
--- a/src/views/OuterHistory.vue
+++ b/src/views/OuterHistory.vue
@@ -73,18 +73,18 @@ export default {
     page(currentPage) {
       const _this = this
       let id = window.location.pathname.split('/')[3];
-      axios.get('http://localhost:8181/outDetail/findAndReturnOLDs/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/outDetail/findAndReturnOLDs/' + (currentPage) + '/20').then(function (resp) {
         _this.tableData = resp.data
-        _this.pageSize = 6
+        _this.pageSize = 20
       })
-      axios.get('http://localhost:8181/outDetail/findAndReturnOLDsNum/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/outDetail/findAndReturnOLDsNum/' + (currentPage) + '/20').then(function (resp) {
         _this.total = resp.data
       })
     }
   },
   data() {
     return {
-      pageSize: 6,
+      pageSize: 20,
       total: 1,
       tableData: [{
         id: 1,
@@ -102,11 +102,11 @@ export default {
   created() {
     const _this = this
     let id = window.location.pathname.split('/')[3];
-    axios.get('http://localhost:8181/outDetail/findAndReturnOLDs/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/outDetail/findAndReturnOLDs/1/20').then(function (resp) {
       _this.tableData = resp.data
-      _this.pageSize = 6
+      _this.pageSize = 20
     })
-    axios.get('http://localhost:8181/outDetail/findAndReturnOLDsNum/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/outDetail/findAndReturnOLDsNum/1/20').then(function (resp) {
       _this.total = resp.data
     })
   }
diff --git a/src/views/StudentAppForm.vue b/src/views/StudentAppForm.vue
index bc42637..55889fb 100644
--- a/src/views/StudentAppForm.vue
+++ b/src/views/StudentAppForm.vue
@@ -3,8 +3,7 @@
 
   <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
     <h4>默认您已经遵守防疫规定。</h4>
-    <div class="block">
-      <span class="demonstration">离开时间</span>
+    <el-form-item label="离开时间" prop="leave_time">
       <el-date-picker
           v-model="ruleForm.leave_time"
           type="datetime"
@@ -12,9 +11,8 @@
           :picker-options="pickerOptions"
           placeholder="选择日期时间">
       </el-date-picker>
-    </div>
-    <div class="block">
-      <span class="demonstration">返回时间</span>
+    </el-form-item>
+    <el-form-item label="返回时间" prop="back_time">
       <el-date-picker
           v-model="ruleForm.back_time"
           type="datetime"
@@ -22,10 +20,16 @@
           :picker-options="pickerOptions"
           placeholder="选择日期时间">
       </el-date-picker>
-    </div>
+    </el-form-item>
     <el-form-item label="外出地点" prop="place">
-      <el-input v-model="ruleForm.place"></el-input>
+      <el-autocomplete
+          v-model="ruleForm.place"
+          :fetch-suggestions="querySearch"
+          placeholder="请输入内容"
+          @select="handleSelect"
+      ></el-autocomplete>
     </el-form-item>
+    <p></p>
     <el-form-item label="外出理由" prop="reason">
       <el-input v-model="ruleForm.reason"></el-input>
     </el-form-item>
@@ -49,6 +53,7 @@ export default {
         reason: '',
         type: '审核中'
       },
+      places: [],
       pickerOptions: {
         shortcuts: [{
           text: '今早八点',
@@ -116,22 +121,43 @@ export default {
                   _this.$router.push('/user/student/' + id + '/history')
                 }
               })
-            }
-            else if(resp.data == 'time failed'){
+            } else if (resp.data == 'time failed') {
               _this.$alert('时间错误', '消息', {
                 confirmButtonText: '确定',
               })
             }
           })
-        }
-        else {
+        } else {
           return false;
         }
       });
     },
     resetForm(formName) {
       this.$refs[formName].resetFields();
+    },
+    querySearch(queryString, cb) {
+      var places = this.places;
+      var results = queryString ? places.filter(this.createFilter(queryString)) : places;
+      // 调用 callback 返回建议列表的数据
+      cb(results);
+    },
+    createFilter(queryString) {
+      return (places) => {
+        return (places.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
+      };
+    },
+    loadAll() {
+      return [
+        {"value": "一号院"},
+        {"value": "万家丽"}
+      ]
+    },
+    handleSelect(item) {
+      console.log(item);
     }
+  },
+  mounted() {
+    this.places = this.loadAll();
   }
 }
 </script>
diff --git a/src/views/StudentApplication.vue b/src/views/StudentApplication.vue
index dcd45af..a7384d0 100644
--- a/src/views/StudentApplication.vue
+++ b/src/views/StudentApplication.vue
@@ -1,11 +1,15 @@
 <template>
   <div>
     <el-table
+        ref="multipleTable"
         :data="tableData"
         border
         :default-sort="{prop: 'date', order: 'descending'}"
         stripe
         style="width: 90%">
+      <el-table-column
+          type="selection">
+      </el-table-column>
       <el-table-column
           fixed
           prop="id"
@@ -35,15 +39,24 @@
           prop="reason"
           label="外出原因"
           sortable
-          width="300">
+          width="150">
       </el-table-column>
       <el-table-column
           prop="type"
           label="状态"
           sortable>
       </el-table-column>
+      <el-table-column>
+        <template slot-scope="scope">
+          <el-button size="small" type="danger" @click="deleteLD(scope.row.id)">删除</el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
+    <div style="margin-top: 20px">
+      <el-button type="danger" @click="allDeleteLD()">批量删除</el-button>
+      <el-button @click="toggleSelection()">取消选择</el-button>
+    </div>
     <el-pagination
         background
         layout="prev, pager, next"
@@ -57,41 +70,60 @@
 export default {
   name: "StudentApplication",
   methods:{
-    page(currentPage){
+    page(currentPage) {
       const _this = this
       let id = window.location.pathname.split('/')[3];
-      axios.get('http://localhost:8181/leaveDetail/findByNotType/已过期/' + id + '/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByNotType/已过期/' + id + '/' + (currentPage) + '/20').then(function (resp) {
         console.log(resp)
         _this.tableData = resp.data
       })
-      axios.get('http://localhost:8181/leaveDetail/findByNotTypeNum/已过期/' + id + '/1/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByNotTypeNum/已过期/' + id + '/1/20').then(function (resp) {
         _this.total = resp.data
       })
-    }
+    },
+    deleteLD(id) {
+      const _this = this
+      axios.get('http://localhost:8181/leaveDetail/delete/' + id).then(function (resp) {
+        location.reload();
+      })
+    },
+    allDeleteLD() {
+      let arrLength = this.$refs.multipleTable.selection.length;
+      for (let i = 0; i < arrLength; i++) {
+        axios.get('http://localhost:8181/leaveDetail/delete/' + this.$refs.multipleTable.selection[i].id)
+      }
+      location.reload();
+    },
+    toggleSelection(rows) {
+      if (rows) {
+        rows.forEach(row => {
+          this.$refs.multipleTable.toggleRowSelection(row);
+        });
+      } else {
+        this.$refs.multipleTable.clearSelection();
+      }
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
   },
   data() {
     return {
-      pageSize: 6,
+      pageSize: 20,
       total: 11,
-      tableData: [{
-        id: 1,
-        leave_time: '2021-12-20 16:59:15',
-        back_time: '2222-12-21 17:28:59',
-        place: '万家丽',
-        reason: '见导师',
-        type: '已过期'
-      }]
+      tableData: [],
+      multipleSelection: []
     }
   },
   created() {
     const _this = this
     let id = window.location.pathname.split('/')[3];
-    axios.get('http://localhost:8181/leaveDetail/findByNotType/已过期/' + id + '/1/6').then(function (resp) {
-      console.log(axios.get('http://localhost:8181/leaveDetail/findByNotTypeNum/已过期/' + id + '/1/6'))
+    axios.get('http://localhost:8181/leaveDetail/findByNotType/已过期/' + id + '/1/20').then(function (resp) {
+      console.log(axios.get('http://localhost:8181/leaveDetail/findByNotTypeNum/已过期/' + id + '/1/20'))
       _this.tableData = resp.data
-      _this.pageSize = 6
+      _this.pageSize = 20
     })
-    axios.get('http://localhost:8181/leaveDetail/findByNotTypeNum/已过期/' + id + '/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByNotTypeNum/已过期/' + id + '/1/20').then(function (resp) {
       _this.total = resp.data
     })
   }
diff --git a/src/views/StudentHistory.vue b/src/views/StudentHistory.vue
index 557529e..34579b9 100644
--- a/src/views/StudentHistory.vue
+++ b/src/views/StudentHistory.vue
@@ -1,11 +1,15 @@
 <template>
   <div>
     <el-table
+        ref="multipleTable"
         :data="tableData"
         border
         :default-sort="{prop: 'date', order: 'descending'}"
         stripe
         style="width: 90%">
+      <el-table-column
+          type="selection">
+      </el-table-column>
       <el-table-column
           fixed
           prop="id"
@@ -35,15 +39,23 @@
           prop="reason"
           label="外出原因"
           sortable
-          width="300">
+          width="150">
       </el-table-column>
       <el-table-column
           prop="type"
           label="状态"
           sortable>
       </el-table-column>
+      <el-table-column>
+        <template slot-scope="scope">
+          <el-button size="small" type="danger" @click="deleteLD(scope.row.id)">删除</el-button>
+        </template>
+      </el-table-column>
     </el-table>
-
+    <div style="margin-top: 20px">
+      <el-button type="danger" @click="allDeleteLD()">批量删除</el-button>
+      <el-button @click="toggleSelection()">取消选择</el-button>
+    </div>
     <el-pagination
         background
         layout="prev, pager, next"
@@ -61,23 +73,48 @@ export default {
     page(currentPage){
       const _this = this
       let id = window.location.pathname.split('/')[3];
-      axios.get('http://localhost:8181/leaveDetail/findByType/已过期/' + id + '/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByType/已过期/' + id + '/' + (currentPage) + '/20').then(function (resp) {
         console.log(resp)
         _this.tableData = resp.data
-        _this.pageSize = 6
+        _this.pageSize = 20
       })
-      axios.get('http://localhost:8181/leaveDetail/findByTypeNum/已过期/' + id + '/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByTypeNum/已过期/' + id + '/' + (currentPage) + '/20').then(function (resp) {
         _this.total = resp.data
       })
-    }
+    },
+    deleteLD(id) {
+      const _this = this
+      axios.get('http://localhost:8181/leaveDetail/delete/' + id).then(function (resp) {
+        location.reload();
+      })
+    },
+    allDeleteLD() {
+      let arrLength = this.$refs.multipleTable.selection.length;
+      for (let i = 0; i < arrLength; i++) {
+        axios.get('http://localhost:8181/leaveDetail/delete/' + this.$refs.multipleTable.selection[i].id)
+      }
+      location.reload();
+    },
+    toggleSelection(rows) {
+      if (rows) {
+        rows.forEach(row => {
+          this.$refs.multipleTable.toggleRowSelection(row);
+        });
+      } else {
+        this.$refs.multipleTable.clearSelection();
+      }
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
   },
   data() {
     return {
-      pageSize: 6,
+      pageSize: 20,
       total: 11,
       tableData: [{
         id: 1,
-        leave_time: '2021-12-20 16:59:15',
+        leave_time: '2021-12-20 15:59:15',
         back_time: '2222-12-21 17:28:59',
         place: '万家丽',
         reason: '见导师',
@@ -88,12 +125,12 @@ export default {
   created() {
     const _this = this
     let id = window.location.pathname.split('/')[3];
-    axios.get('http://localhost:8181/leaveDetail/findByType/已过期/' + id + '/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByType/已过期/' + id + '/1/20').then(function (resp) {
       console.log(resp.data)
       _this.tableData = resp.data
-      _this.pageSize = 6
+      _this.pageSize = 20
     })
-    axios.get('http://localhost:8181/leaveDetail/findByTypeNum/已过期/' + id + '/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByTypeNum/已过期/' + id + '/1/20').then(function (resp) {
       _this.total = resp.data
     })
   }
diff --git a/src/views/TeacherApplication.vue b/src/views/TeacherApplication.vue
index abedcb7..e553bbd 100644
--- a/src/views/TeacherApplication.vue
+++ b/src/views/TeacherApplication.vue
@@ -8,8 +8,7 @@
         stripe
         style="width: 100%">
       <el-table-column
-          type="selection"
-          width="55">
+          type="selection">
       </el-table-column>
       <el-table-column
           fixed
@@ -50,14 +49,14 @@
       </el-table-column>
       <el-table-column>
         <template slot-scope="scope">
-          <el-button type="success" @click="agree(scope.row.id)">同意</el-button>
-          <el-button type="danger" @click="disagree(scope.row.id)">拒绝</el-button>
+          <el-button size="small" type="success" @click="agree(scope.row.id)">同意</el-button>
+          <el-button size="small" type="danger" @click="disagree(scope.row.id)">拒绝</el-button>
         </template>
       </el-table-column>
     </el-table>
     <div style="margin-top: 20px">
-      <el-button type="success" @click="allAgree()">全部同意</el-button>
-      <el-button type="danger" @click="allDisagree()">全部拒绝</el-button>
+      <el-button type="success" @click="allAgree()">批量同意</el-button>
+      <el-button type="danger" @click="allDisagree()">批量拒绝</el-button>
       <el-button @click="toggleSelection()">取消选择</el-button>
     </div>
 
@@ -77,12 +76,12 @@ export default {
     page(currentPage) {
       const _this = this
       let id = window.location.pathname.split('/')[3];
-      axios.get('http://localhost:8181/leaveDetail/findByTypeNoID/审核中/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByTypeNoID/审核中/' + (currentPage) + '/20').then(function (resp) {
         console.log(resp)
         _this.tableData = resp.data
-        _this.pageSize = 6
+        _this.pageSize = 20
       })
-      axios.get('http://localhost:8181/leaveDetail/findByTypeNoIDNum/审核中/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByTypeNoIDNum/审核中/' + (currentPage) + '/20').then(function (resp) {
         _this.total = resp.data
       })
     },
@@ -128,11 +127,11 @@ export default {
   },
   data() {
     return {
-      pageSize: 6,
+      pageSize: 20,
       total: 11,
       tableData: [{
         id: 1,
-        leave_time: '2021-12-20 16:59:15',
+        leave_time: '2021-12-20 15:59:15',
         back_time: '2222-12-21 17:28:59',
         place: '万家丽',
         reason: '见导师',
@@ -144,11 +143,11 @@ export default {
   created() {
     const _this = this
     let id = window.location.pathname.split('/')[3];
-    axios.get('http://localhost:8181/leaveDetail/findByTypeNoID/审核中/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByTypeNoID/审核中/1/20').then(function (resp) {
       _this.tableData = resp.data
-      _this.pageSize = 6
+      _this.pageSize = 20
     })
-    axios.get('http://localhost:8181/leaveDetail/findByTypeNoIDNum/审核中/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByTypeNoIDNum/审核中/1/20').then(function (resp) {
       _this.total = resp.data
     })
   }
diff --git a/src/views/TeacherHistory.vue b/src/views/TeacherHistory.vue
index 741124a..d6a02e4 100644
--- a/src/views/TeacherHistory.vue
+++ b/src/views/TeacherHistory.vue
@@ -61,23 +61,23 @@ export default {
     page(currentPage) {
       const _this = this
       let id = window.location.pathname.split('/')[3];
-      axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoID/审核中/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoID/审核中/' + (currentPage) + '/20').then(function (resp) {
         console.log(resp)
         _this.tableData = resp.data
-        _this.pageSize = 6
+        _this.pageSize = 20
       })
-      axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoIDNum/审核中/' + (currentPage) + '/6').then(function (resp) {
+      axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoIDNum/审核中/' + (currentPage) + '/20').then(function (resp) {
         _this.total = resp.data
       })
     }
   },
   data() {
     return {
-      pageSize: 6,
+      pageSize: 20,
       total: 11,
       tableData: [{
         id: 1,
-        leave_time: '2021-12-20 16:59:15',
+        leave_time: '2021-12-20 15:59:15',
         back_time: '2222-12-21 17:28:59',
         place: '万家丽',
         reason: '见导师',
@@ -88,11 +88,11 @@ export default {
   created() {
     const _this = this
     let id = window.location.pathname.split('/')[3];
-    axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoID/审核中/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoID/审核中/1/20').then(function (resp) {
       _this.tableData = resp.data
-      _this.pageSize = 6
+      _this.pageSize = 20
     })
-    axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoIDNum/审核中/1/6').then(function (resp) {
+    axios.get('http://localhost:8181/leaveDetail/findByNotTypeNoIDNum/审核中/1/20').then(function (resp) {
       _this.total = resp.data
     })
   }