完成结项操作和已结项项目列表与后端的对接

src/utils/request.js

@@ -31,6 +31,7 @@ request.interceptors.response.use(
             localStorage.removeItem('token')
             localStorage.removeItem('staffFullname')
             localStorage.removeItem('staffUsername')
+            localStorage.removeItem('staffId')
             router.push({path: '/login'})
         }
 

src/views/ClosedProject.vue

@@ -11,18 +11,18 @@
           class="projectTable"
           :height="tableHeight"
           :data="tableData">
-        <el-table-column prop="name" label="项目名称" min-width="15%"/>
+        <el-table-column prop="projectName" label="项目名称" min-width="15%"/>
-        <el-table-column prop="price" label="合同额（万）" min-width="10%"/>
+        <el-table-column prop="contractAmount" label="合同额" min-width="10%" :formatter="priceFormatter"/>
-        <el-table-column prop="important" label="重要程度" min-width="10%"/>
+        <el-table-column prop="projectImportance" label="重要程度" min-width="10%"/>
-        <el-table-column prop="classification" label="项目分类" min-width="10%"/>
+        <el-table-column prop="projectClassName" label="项目分类" min-width="10%"/>
-        <el-table-column prop="type" label="项目类型" min-width="10%"/>
+        <el-table-column prop="projectSubclassName" label="项目类型" min-width="10%"/>
-        <el-table-column label="项目进度" min-width="35%">
+        <el-table-column label="项目进度" min-width="35%" >
           <template #default="scope">
-            <el-progress :text-inside="true" :stroke-width="18" :status="scope.row.schedule === 100 ? 'success' : ''"
+            <el-progress :text-inside="true" :stroke-width="18" :status="scope.row.completeNum===scope.row.totalNum ? 'success' : ''"
-                         :percentage="scope.row.schedule"></el-progress>
+                         :percentage="scope.row.completeNum*100/scope.row.totalNum"></el-progress>
           </template>
         </el-table-column>
-        <el-table-column prop="closeDate" label="结项日期" min-width="10%" align="right"/>
+        <el-table-column prop="projectCloseTime" label="结项日期" min-width="10%" align="right" :formatter="dateFormatter"/>
       </el-table>
 
       <!-- 分页 -->
@@ -31,9 +31,9 @@
           @size-change="handleSizeChange"
           v-model:currentPage ="currentPage"
           :page-sizes="[5, 10, 15, 20]"
-          :page-size="perPage"
+          v-model:page-size="pageSize"
           layout="total, sizes, prev, pager, next, jumper"
-          :total="count"
+          :total="total"
           style="float: right;margin-top: 20px;">
       </el-pagination>
     </div>
@@ -58,77 +58,64 @@ onMounted(() => {
 
 </script>
 <script>
+import request from "../utils/request";
+import moment from "moment";
+
 export default {
-  name: "OngoingProject",
+  name: "ClosedProject",
   data() {
     return {
 
-      count: 100,
+      total: 0,
       currentPage: 1,
-      perPage: 10,
+      pageSize: 10,
 
-      tableData: [{
+      tableData: []
-        name: 'OTC研发项目',
-        price: 100,
-        important: '非A类',
-        classification: '外包项目',
-        type: '工作量结算类',
-        schedule: 0,
-        closeDate: '2022-6-30'
-      },
-        {
-          name: 'OTC研发项目',
-          price: 100,
-          important: '非A类',
-          classification: '研发项目',
-          type: '纯研发类',
-          schedule: 50,
-          closeDate: '2022-6-30'
-
-        },
-        {
-          name: 'OTC研发项目',
-          price: 100,
-          important: '非A类',
-          classification: '研发项目',
-          type: '纯研发类',
-          schedule: 100,
-          closeDate: '2022-6-30'
-        },
-        {
-          name: 'OTC研发项目',
-          price: 100,
-          important: '非A类',
-          classification: '研发项目',
-          type: '纯研发类',
-          schedule: 100,
-          closeDate: '2022-6-30'
-        },
-
-        {
-          name: '教育电商项目',
-          price: 100,
-          important: '非A类',
-          classification: '研发项目',
-          type: '纯研发类',
-          schedule: 100,
-          closeDate: '2022-6-30'
-        },
-
-
-      ]
     }
   },
+  mounted() {
+    this.getClosedProjects();
+  },
   methods: {
     // 选择一页显示多少条数据
     handleSizeChange(val) {
-
+      this.getClosedProjects()
     },
     // 选择当前的是第几页
     handleCurrentChange(val) {
-
+      this.getClosedProjects()
+    },
+    getClosedProjects() {
+      const that = this;
+      request({
+        url: 'project',
+        method: 'get',
+        params: {
+          pageCurrent: this.currentPage,
+          pageSize: this.pageSize,
+          completed: true
+        }
+      }).then(response => {
+        if(response.data.code===200) {
+          //console.log(response.data.data.records)
+          that.total =  response.data.data.total
+          that.tableData = response.data.data.records
+        }
+      }).catch(function (error) {
+        console.log(error)
+      })
+    },
+    priceFormatter(row, column) {
+      return row[column.property]/10000 + '万';
+    },
+    dateFormatter(row, column) {
+      const moment = require('moment');
+      const date = row[column.property];
+      if (date === undefined || date===null) {
+        return ''
+      }
+      return moment(date*1000).format("yyyy-MM-DD")
     },
-    onCloseProject(row) {}
   }
 }
 </script>

src/views/Home.vue

@@ -69,11 +69,13 @@ export default {
     return {
       staffFullname: '',
       staffUsername: '',
+      staffId: ''
     }
   },
   mounted() {
     this.staffFullname = localStorage.getItem('staffFullname');
     this.staffUsername = localStorage.getItem('staffUsername');
+    this.staffId = localStorage.getItem('staffId');
   },
   methods: {
 

src/views/Login.vue

@@ -58,6 +58,7 @@ const onSubmit = () => {
       localStorage.setItem('token', response.data.data.Token)
       localStorage.setItem('staffFullname', response.data.data.staffFullname)
       localStorage.setItem('staffUsername', response.data.data.staffUsername)
+      localStorage.setItem('staffId', response.data.data.staffId)
       router.push({path: '/'})
     } else {
       console.log(response.data)

src/views/OngoingProject.vue

@@ -27,7 +27,7 @@
         </el-table-column>
         <el-table-column min-width="10%" align="right">
           <template #default="scope">
-            <el-button type="primary" plain @click="onCloseProject(scope.row)">结项</el-button>
+            <el-button :v-show="staffId===scope.row.projectCreator" type="primary" plain @click="onCloseProject(scope.row)">结项</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -36,7 +36,7 @@
           @current-change="handleCurrentChange"
           @size-change="handleSizeChange"
           v-model:currentPage="currentPage"
-          :page-sizes="[2, 10, 15, 20]"
+          :page-sizes="[5, 10, 15, 20]"
           v-model:page-size="pageSize"
           layout="total, sizes, prev, pager, next, jumper"
           :total="total"
@@ -65,6 +65,7 @@ onMounted(() => {
 <script>
 import router from "../router";
 import request from "../utils/request";
+import {ElMessage} from "element-plus";
 
 export default {
   name: "OngoingProject",
@@ -72,13 +73,16 @@ export default {
     return {
       total: 0,
       currentPage: 1,
-      pageSize: 2,
+      pageSize: 10,
 
       projectClass: [],
-      tableData: []
+      tableData: [],
+
+      staffId: Number
     }
   },
   mounted() {
+    this.staffId = localStorage.getItem('staffId');
     this.getProjects();
 
 
@@ -95,7 +99,24 @@ export default {
       this.getProjects();
     },
     onCloseProject(row) {
-
+      request({
+        url: 'project/complete',
+        method: 'post',
+        data: {
+          projectId: row.projectId,
+        }
+      }).then(response => {
+        if(response.data.code===200) {
+          //console.log(response.data.data.records)
+          ElMessage({
+            message: '结项成功',
+            type: 'success',
+          })
+          this.getProjects();
+        }
+      }).catch(function (error) {
+        console.log(error)
+      })
     },
     getProjects() {
       const that = this;