Merge branch 'develop' of https://gitlab.redhtc.com/Berlincen/DA-Platform into develop

DAPlatform-front/src/assets/scss/mixin.scss

@@ -9,3 +9,39 @@
   background-color: white;
   box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
 }
+@mixin taskhall-container {
+  @include container;
+  .taskhall-left{
+    padding: 30px 20px 30px 20px;
+    @include whiteBoard;
+    .tasklist-container{
+      .tasklist{
+        .task-item{
+          border-bottom: 1px solid $divider-color;
+          text-align: left;
+          padding: 10px 0px 22px;
+          position: relative;
+          div:first-of-type{
+            font-size: 18px;
+            margin-bottom: 7px;
+            font-weight: bold;
+          }
+          div:last-of-type{
+            font-size: 14px;
+            color: #959595;
+          }
+          .task-enter-btn1{
+            position: absolute;
+            right: 10px;
+            bottom: 10px;
+          }
+          .task-enter-btn2{
+            position: absolute;
+            right: 120px;
+            bottom: 10px;
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file

DAPlatform-front/src/components/CheckTask.vue

@@ -10,45 +10,28 @@
             <el-button class="task-enter-btn1" type="primary" @click="detail(item)" plain>审核任务</el-button>
           </div>
         </div>
-        <div class="page-navigator">
-          <el-pagination
-            :page-size="pageSize"
-            :page-count="pageNum"
-            :current-page="currentPage"
-            layout="prev, pager, next">
-          </el-pagination>
-        </div>
+        <navigator v-model="tasks" :condition="condition"></navigator>
       </div>
     </div>
   </div>
 </template>
 
 <script>
+import Navigator from './Navigator'
 export default {
   name: 'checktask',
+  components: {
+    Navigator
+  },
   data () {
     return {
       activeName: '待审核任务',
       tasks: [],
-      pageSize: 10,
-      currentPage: 1,
-      pageNum: 0
-    }
-  },
-  beforeMount () {
-    var self = this
-    this.axios.get('/task/getTasks', {
-      params: {
-        pageSize: self.pageSize,
-        currentPage: self.currentPage,
-        creator: self.$store.state.userInfo.userId,
+      condition: {
+        creator: this.$store.state.userInfo.userId,
         state: 'checking'
       }
-    }).then(res => {
-      console.log(res)
-      self.tasks = res.data.tasks
-      self.pageNum = res.data.pageNum
-    })
+    }
   },
   methods: {
     detail (task) {
@@ -63,44 +46,9 @@ export default {
 
 <!-- Add 'scoped' attribute to limit CSS to this component only -->
 <style scoped lang='scss'>
-  @import '@/assets/scss/config.scss';
-  .taskhall-container{
-    padding: 40px 10% 100px 10%;
-    min-width: $min-width;
-    min-height: 600px;
-    overflow:hidden;
-    background-color: $bg-color;
-    .taskhall-left{
-      background-color: white;
-      padding: 30px 20px 30px 20px;
-      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-      .tasklist-container{
-        .tasklist{
-          .task-item{
-            border-bottom: 1px solid $divider-color;
-            text-align: left;
-            padding: 10px 0px 22px;
-            position: relative;
-            div:first-of-type{
-              font-size: 18px;
-              margin-bottom: 7px;
-              font-weight: bold;
-            }
-            div:last-of-type{
-              font-size: 14px;
-              color: #959595;
-            }
-            .task-enter-btn1{
-              position: absolute;
-              right: 10px;
-              bottom: 10px;
-            }
-          }
-        }
-      }
-      .page-navigator{
-        margin-top: 30px;
-      }
-    }
-  }
+@import '@/assets/scss/config.scss';
+@import '@/assets/scss/mixin.scss';
+.taskhall-container{
+  @include taskhall-container
+}
 </style>

DAPlatform-front/src/components/CompletedTask.vue

@@ -7,49 +7,32 @@
             <div>{{item.name}}</div>
             <div>发布者:{{item.creator}}&emsp;&emsp;发布时间：{{item.date|formatDate}}&emsp;&emsp;任务状态：已完成
             </div>
-            <el-button class="task-enter-btn1" type="primary" @click="detail(item)" plain>查看任务</el-button>
-            <el-button class="task-enter-btn2" type="primary" plain>导出任务</el-button>
+            <el-button class="task-enter-btn2" type="primary" @click="detail(item)" plain>查看任务</el-button>
+            <el-button class="task-enter-btn1" type="primary" plain>导出任务</el-button>
           </div>
         </div>
-        <div class="page-navigator">
-          <el-pagination
-            :page-size="pageSize"
-            :page-count="pageNum"
-            :current-page="currentPage"
-            layout="prev, pager, next">
-          </el-pagination>
-        </div>
+        <navigator v-model="tasks" :condition="condition"></navigator>
       </div>
     </div>
   </div>
 </template>
 
 <script>
+import Navigator from './Navigator'
 export default {
   name: 'ongoingtask',
+  components: {
+    Navigator
+  },
   data () {
     return {
       activeName: '我的任务',
       tasks: [],
-      pageSize: 10,
-      currentPage: 1,
-      pageNum: 0
-    }
-  },
-  beforeMount () {
-    var self = this
-    this.axios.get('/task/getTasks', {
-      params: {
-        pageSize: self.pageSize,
-        currentPage: self.currentPage,
-        executor: self.$store.state.userInfo.userId,
+      condition: {
+        executor: this.$store.state.userInfo.userId,
         state: 'completed'
       }
-    }).then(res => {
-      console.log(res)
-      self.tasks = res.data.tasks
-      self.pageNum = res.data.pageNum
-    })
+    }
   },
   methods: {
     detail (task) {
@@ -64,49 +47,9 @@ export default {
 
 <!-- Add 'scoped' attribute to limit CSS to this component only -->
 <style scoped lang='scss'>
-  @import '@/assets/scss/config.scss';
-  .taskhall-container{
-    padding: 40px 10% 100px 10%;
-    min-width: $min-width;
-    min-height: 600px;
-    overflow:hidden;
-    background-color: $bg-color;
-    .taskhall-left{
-      background-color: white;
-      padding: 30px 20px 30px 20px;
-      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-      .tasklist-container{
-        .tasklist{
-          .task-item{
-            border-bottom: 1px solid $divider-color;
-            text-align: left;
-            padding: 10px 0px 22px;
-            position: relative;
-            div:first-of-type{
-              font-size: 18px;
-              margin-bottom: 7px;
-              font-weight: bold;
-            }
-            div:last-of-type{
-              font-size: 14px;
-              color: #959595;
-            }
-            .task-enter-btn1{
-              position: absolute;
-              right: 120px;
-              bottom: 10px;
-            }
-            .task-enter-btn2{
-              position: absolute;
-              right: 0px;
-              bottom: 10px;
-            }
-          }
-        }
-      }
-      .page-navigator{
-        margin-top: 30px;
-      }
-    }
-  }
+@import '@/assets/scss/config.scss';
+@import '@/assets/scss/mixin.scss';
+.taskhall-container{
+  @include taskhall-container
+}
 </style>

DAPlatform-front/src/components/Navigator.vue

+<template>
+    <div class="page-navigator">
+        <el-pagination
+            :page-size="pageSize"
+            :page-count="pageNum"
+            :current-page="currentPage"
+            @current-change="change"
+            layout="prev, pager, next">
+        </el-pagination>
+    </div>
+</template>
+
+<script>
+export default {
+  name: 'navigator',
+  props: {
+    value: Array,
+    condition: Object
+  },
+  data () {
+    return {
+      pageSize: 10, // 页面尺寸
+      pageNum: 0, // 页面总页数
+      currentPage: 1, // 当前页码
+      tasks: Array
+    }
+  },
+  watch: {
+    // 条件发生改变，重新请求任务
+    condition () {
+      this.currentPage = 1
+      this.getTasks()
+    }
+  },
+  beforeMount () {
+    this.getTasks()
+  },
+  methods: {
+    // 任务列表更新
+    pageChange () {
+      this.$emit('input', this.tasks)
+    },
+    // 请求任务
+    getTasks () {
+      var self = this
+      this.axios.get('/task/getTasks', {
+        params: {
+          pageSize: self.pageSize,
+          currentPage: self.currentPage,
+          ...self.condition
+        }
+      }).then(res => {
+        console.log(res)
+        self.tasks = res.data.tasks
+        self.pageNum = res.data.pageNum
+        self.pageChange()
+      })
+    },
+    // 页码变化
+    change (current) {
+      this.currentPage = current
+      this.getTasks()
+    }
+  }
+}
+</script>
+<style scoped>
+.page-navigator{
+    margin-top: 30px;
+}
+</style>

DAPlatform-front/src/components/PublishTask.vue

@@ -7,49 +7,32 @@
             <div>{{item.name}}</div>
             <div>发布者：{{item.creator}}&emsp;&emsp;发布时间：{{item.date|formatDate}}&emsp;&emsp;任务状态：已发布
             </div>
-            <el-button class="task-enter-btn1" type="primary" plain @click="revise">修改</el-button>
-            <el-button class="task-enter-btn2" @click="deleteRow(index, tasks)" type="primary" plain>删除</el-button>
+            <el-button class="task-enter-btn2" type="primary" plain @click="revise">修改</el-button>
+            <el-button class="task-enter-btn1" @click="deleteRow(index, tasks)" type="primary" plain>删除</el-button>
           </div>
         </div>
-        <div class="page-navigator">
-          <el-pagination
-            :page-size="pageSize"
-            :page-count="pageNum"
-            :current-page="currentPage"
-            layout="prev, pager, next">
-          </el-pagination>
-        </div>
+        <navigator v-model="tasks" :condition="condition"></navigator>
       </div>
     </div>
     </div>
 </template>
 
 <script>
+import Navigator from './Navigator'
 export default {
   name: 'publishtask',
+  components: {
+    Navigator
+  },
   data () {
     return {
       activeName: '我的发布',
       tasks: [],
-      pageSize: 10,
-      currentPage: 1,
-      pageNum: 0
-    }
-  },
-  beforeMount () {
-    var self = this
-    this.axios.get('/task/getTasks', {
-      params: {
-        pageSize: self.pageSize,
-        currentPage: self.currentPage,
-        creator: self.$store.state.userInfo.userId,
+      condition: {
+        creator: this.$store.state.userInfo.userId,
         state: ''
       }
-    }).then(res => {
-      console.log(res)
-      self.tasks = res.data.tasks
-      self.pageNum = res.data.pageNum
-    })
+    }
   },
   methods: {
     deleteRow (index, rows) { // 删除改行
@@ -71,49 +54,12 @@ export default {
 
 <!-- Add 'scoped' attribute to limit CSS to this component only -->
 <style scoped lang='scss'>
-  @import '@/assets/scss/config.scss';
-  .taskhall-container{
-    padding: 40px 10% 100px 10%;
-    min-width: $min-width;
-    min-height: 600px;
-    overflow:hidden;
-    background-color: $bg-color;
-    .taskhall-left{
-      background-color: white;
-      padding: 30px 20px 30px 20px;
-      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-      .tasklist-container{
-        .tasklist{
-          .task-item{
-            border-bottom: 1px solid $divider-color;
-            text-align: left;
-            padding: 10px 0px 22px;
-            position: relative;
-            div:first-of-type{
-              font-size: 18px;
-              margin-bottom: 7px;
-              font-weight: bold;
-            }
-            div:last-of-type{
-              font-size: 14px;
-              color: #959595;
-            }
-            .task-enter-btn1{
-              position: absolute;
-              right: 80px;
-              bottom: 10px;
-            }
-            .task-enter-btn2{
-              position: absolute;
-              right: 0px;
-              bottom: 10px;
-            }
-          }
-        }
-      }
-      .page-navigator{
-        margin-top: 30px;
-      }
-    }
-  }
+@import '@/assets/scss/config.scss';
+@import '@/assets/scss/mixin.scss';
+.taskhall-container{
+  @include taskhall-container;
+}
+.taskhall-container .taskhall-left .tasklist-container .tasklist .task-item .task-enter-btn2{
+  right: 100px;
+}
 </style>

DAPlatform-front/src/components/TaskHall.vue

@@ -16,17 +16,10 @@
           <div class="task-item" v-for="(item, index) in tasks" :key='index'>
             <div>{{item.name}}</div>
             <div>发布人：{{item.creator}}&emsp;&emsp;发布时间：{{item.date|formatDate}}</div>
-            <el-button class="task-enter-btn" type="primary" plain @click="enterTask(item)">进入任务</el-button>
+            <el-button class="task-enter-btn1" type="primary" plain @click="enterTask(item)">进入任务</el-button>
           </div>
         </div>
-        <div class="page-navigator">
-          <el-pagination
-            :page-size="pageSize"
-            :page-count="pageNum"
-            :current-page="currentPage"
-            layout="prev, pager, next">
-          </el-pagination>
-        </div>
+        <navigator v-model="tasks" :condition="condition"></navigator>
       </div>
     </div>
     <div class="taskhall-right">
@@ -47,31 +40,20 @@
 </template>
 
 <script>
+import Navigator from './Navigator'
 export default {
   name: 'taskhall',
+  components: {
+    Navigator
+  },
   data () {
     return {
       activeName: '任务大厅',
       tasks: [],
       keyword: '',
-      pageSize: 10,
-      currentPage: 1,
-      pageNum: 0
+      condition: {}
     }
   },
-  beforeMount () {
-    var self = this
-    this.axios.get('/task/getTasks', {
-      params: {
-        pageSize: self.pageSize,
-        currentPage: self.currentPage
-      }
-    }).then(res => {
-      console.log(res)
-      self.tasks = res.data.tasks
-      self.pageNum = res.data.pageNum
-    })
-  },
   methods: {
     handleClick (tab, event) {
       console.log(tab, event)
@@ -83,18 +65,11 @@ export default {
       })
     },
     search () {
-      var self = this
-      this.axios.get('/task/getTasks', {
-        params: {
-          pageSize: self.pageSize,
-          currentPage: self.currentPage,
-          keyword: self.keyword
+      if (this.keyword) {
+        this.condition = {keyword: this.keyword}
+      } else {
+        this.condition = {}
       }
-      }).then(res => {
-        console.log(res)
-        self.tasks = res.data.tasks
-        self.pageNum = res.data.pageNum
-      })
     }
   }
 }
@@ -105,12 +80,10 @@ export default {
 @import '@/assets/scss/config.scss';
 @import '@/assets/scss/mixin.scss';
 .taskhall-container{
-  @include container;
+  @include taskhall-container;
   .taskhall-left{
     float: left;
     width: 70%;
-    padding: 30px 20px 30px 20px;
-    @include whiteBoard;
     .filter-container{
       .filter-item{
         display: flex;
@@ -122,33 +95,6 @@ export default {
         }
       }
     }
-    .tasklist-container{
-      .tasklist{
-        .task-item{
-          border-bottom: 1px solid $divider-color;
-          text-align: left;
-          padding: 10px 0px 22px;
-          position: relative;
-          div:first-of-type{
-            font-size: 18px;
-            margin-bottom: 7px;
-            font-weight: bold;
-          }
-          div:last-of-type{
-            font-size: 14px;
-            color: #959595;
-          }
-          .task-enter-btn{
-            position: absolute;
-            right: 0px;
-            bottom: 10px;
-          }
-        }
-      }
-    }
-    .page-navigator{
-      margin-top: 30px;
-    }
   }
   .taskhall-right{
     float: right;

DAPlatform-front/src/components/ongoingtask.vue

@@ -10,44 +10,27 @@
             <el-button class="task-enter-btn1" @click="detail(item)" type="primary" plain>查看任务详情</el-button>
           </div>
         </div>
-        <div class="page-navigator">
-          <el-pagination
-            :page-size="pageSize"
-            :page-count="pageNum"
-            :current-page="currentPage"
-            layout="prev, pager, next">
-          </el-pagination>
-        </div>
+        <navigator v-model="tasks" :condition="condition"></navigator>
       </div>
     </div>
   </div>
 </template>
 
 <script>
+import Navigator from './Navigator'
 export default {
   name: 'ongoingtask',
+  components: {
+    Navigator
+  },
   data () {
     return {
       activeName: '我的任务',
       tasks: [],
-      pageSize: 10,
-      currentPage: 1,
-      pageNum: 0
+      condition: {
+        executor: this.$store.state.userInfo.userId
       }
-  },
-  beforeMount () {
-    var self = this
-    this.axios.get('/task/getTasks', {
-      params: {
-        pageSize: self.pageSize,
-        currentPage: self.currentPage,
-        executor: self.$store.state.userInfo.userId
     }
-    }).then(res => {
-      console.log(res)
-      self.tasks = res.data.tasks
-      self.pageNum = res.data.pageNum
-    })
   },
   methods: {
     detail (task) {
@@ -62,44 +45,9 @@ export default {
 
 <!-- Add 'scoped' attribute to limit CSS to this component only -->
 <style scoped lang='scss'>
-  @import '@/assets/scss/config.scss';
-  .taskhall-container{
-    padding: 40px 10% 100px 10%;
-    min-width: $min-width;
-    min-height: 600px;
-    overflow:hidden;
-    background-color: $bg-color;
-    .taskhall-left{
-      background-color: white;
-      padding: 30px 20px 30px 20px;
-      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-      .tasklist-container{
-        .tasklist{
-          .task-item{
-            border-bottom: 1px solid $divider-color;
-            text-align: left;
-            padding: 10px 0px 22px;
-            position: relative;
-            div:first-of-type{
-              font-size: 18px;
-              margin-bottom: 7px;
-              font-weight: bold;
-            }
-            div:last-of-type{
-              font-size: 14px;
-              color: #959595;
-            }
-            .task-enter-btn1{
-              position: absolute;
-              right: 10px;
-              bottom: 10px;
-            }
-          }
-        }
-      }
-      .page-navigator{
-        margin-top: 30px;
-      }
-    }
-  }
+@import '@/assets/scss/config.scss';
+@import '@/assets/scss/mixin.scss';
+.taskhall-container{
+  @include taskhall-container
+}
 </style>