完成工作项列表显示
parent
75ad491e55
commit
8defdff039
|
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1657075218554" class="icon" viewBox="0 0 1044 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2223" xmlns:xlink="http://www.w3.org/1999/xlink" width="522" height="512"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
|
||||
</style></defs><path d="M840.454 62.442h-638.605c-76.445 0-139.409 63.68-139.409 141.007v614.048c0 77.326 62.963 141.007 139.408 141.007h638.605c76.454 0 139.408-63.68 139.408-141.007v-614.048c0-77.326-58.454-141.007-139.408-141.007zM912.409 822.050c0 40.931-31.473 72.772-71.954 72.772h-638.605c-40.473 0-71.954-31.84-71.954-72.772v-618.603c0-40.931 31.481-72.772 71.954-72.772h638.605c40.481 0 71.954 31.84 71.954 72.772v618.603zM399.73 285.32l-98.936 100.065-44.973-45.477c-13.5-13.647-35.981-13.647-44.973 0-13.5 13.638-13.5 36.386 0 45.477l71.954 72.781c4.5 4.546 13.492 9.092 26.981 9.092 13.5 0 13.5-4.546 26.981-9.092l121.426-122.813c13.5-13.647 13.5-36.386 0-45.487-26.981-13.638-44.973-13.638-58.463-4.546zM813.473 339.908h-310.308c-22.481 0-31.481 13.638-31.481 31.84 0 22.739 13.5 31.84 31.481 31.84h310.316c22.481 0 31.473-13.647 31.473-31.84 0-18.202-13.5-31.84-31.481-31.84zM318.775 544.584c-58.463 0-103.436 45.487-103.436 104.62 0 59.125 44.973 104.611 103.436 104.611 58.473 0 103.436-45.487 103.436-104.611 0-63.68-49.463-104.62-103.436-104.62zM318.775 681.043c-22.481 0-35.973-13.647-35.973-36.386 0-22.747 13.492-36.395 35.973-36.395 22.492 0 35.981 13.647 35.981 36.395 0 22.739-17.992 36.386-35.981 36.386zM813.473 612.808h-310.308c-22.481 0-31.481 13.647-31.481 31.849 0 18.184 13.5 31.84 31.481 31.84h310.316c22.481 0 31.473-13.647 31.473-31.84 0-18.202-13.5-31.84-31.481-31.84z" p-id="2224" fill="#409EFF"></path></svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
|
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1657078438192" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4560" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
|
||||
</style></defs><path d="M716.8 780.8V102.4H243.2A140.8 140.8 0 0 0 102.4 243.2v537.6A140.8 140.8 0 0 0 243.2 921.6h332.8A140.8 140.8 0 0 0 716.8 780.8zM243.2 179.2h396.8v601.6c0 35.328-28.672 64-64 64h-332.8c-35.328 0-64-28.672-64-64V243.2c0-35.328 28.672-64 64-64z" fill="#F56C6C" p-id="4561"></path><path d="M780.8 102.4a140.8 140.8 0 0 0-140.8 140.8V486.4h140.8A140.8 140.8 0 0 0 921.6 345.6v-102.4A140.8 140.8 0 0 0 780.8 102.4z m0 76.8c35.328 0 64 28.672 64 64v102.4l-0.3072 6.5536A64 64 0 0 1 780.8 409.6H716.8V243.2c0-35.328 28.672-64 64-64z" fill="#F56C6C" p-id="4562"></path><path d="M716.8 102.4h51.2v51.2h-51.2z" fill="#F56C6C" p-id="4563"></path><path d="M409.6 358.4a38.4 38.4 0 0 1 38.4 38.4v128a38.4 38.4 0 0 1-76.8 0V396.8A38.4 38.4 0 0 1 409.6 358.4z" fill="#F56C6C" p-id="4564"></path><path d="M409.6 627.2m-51.2 0a51.2 51.2 0 1 0 102.4 0 51.2 51.2 0 1 0-102.4 0Z" fill="#F56C6C" p-id="4565"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
|
|
@ -0,0 +1,2 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1657075012424" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2153" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
|
||||
</style></defs><path d="M726.613333 187.086667c-57.333333-57.326667-133.566667-88.906667-214.646667-88.906667-81.086667 0-157.306667 31.58-214.646667 88.906667-57.326667 57.333333-88.906667 133.566667-88.906667 214.646667 0 54.146667 14.44 107.313333 41.766667 153.726667 24.1 40.96 57.64 75.84 97.506667 101.566667l0 150.726667c0 37.473333 30.48 67.96 67.953333 67.96l192.26 0c37.473333 0 67.973333-30.486667 67.973333-67.96l0-150.506667c39.953333-25.686667 73.58-60.573333 97.766667-101.58 27.393333-46.473333 41.866667-99.713333 41.866667-153.94C815.513333 320.653333 783.953333 244.426667 726.613333 187.086667zM607.913333 827.166667 415.653333 827.166667c-10.706667 0-19.42-8.706667-19.42-19.42l0-65.966667 231.12 0 0 65.966667C627.353333 818.466667 618.62 827.166667 607.913333 827.166667zM731.82 531.006667c-22.34 37.9-54.273333 69.58-92.366667 91.62l-12.106667 7.013333 0 63.593333L396.233333 693.233333l0-63.793333-12.08-7.02c-37.993333-22.066667-69.846667-53.733333-92.133333-91.58-22.933333-38.98-35.053333-83.62-35.053333-129.12 0-68.12 26.52-132.153333 74.693333-180.32s112.2-74.68 180.306667-74.68c68.12 0 132.166667 26.52 180.326667 74.693333 48.16 48.173333 74.68 112.2 74.68 180.32C766.98 447.3 754.82 492.006667 731.82 531.006667zM605.06 905.92 418.88 905.92c-13.413333 0-24.273333 10.86-24.273333 24.273333 0 13.4 10.86 24.26 24.273333 24.26l186.18 0c13.413333 0 24.286667-10.86 24.286667-24.26C629.34 916.78 618.46 905.92 605.06 905.92z" p-id="2154" fill="#E6A23C" data-spm-anchor-id="a313x.7781069.0.i0" class="selected"></path></svg>
|
||||
|
After Width: | Height: | Size: 2.2 KiB |
|
|
@ -5,14 +5,15 @@
|
|||
<el-menu
|
||||
router
|
||||
style="height: 100%"
|
||||
default-active="1">
|
||||
:default-active="menuDefaultActive">
|
||||
<div
|
||||
style="width: 100%;height: 60px;margin: 30px 0 20px 20px; display: flex; flex-direction: row; align-items: center">
|
||||
<svg-icon style="width: 52px;height: 52px;margin: 10px" icon-class="logo"></svg-icon>
|
||||
<p style="font-family: 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">项目<br/>管理系统</p>
|
||||
</div>
|
||||
<el-button style="width: 100%;height: 40px;display: flex;flex-direction: row;justify-content: flex-start"
|
||||
text :icon="ArrowLeft" @click="this.router.push({path: '/'})">返回</el-button>
|
||||
text :icon="ArrowLeft" @click="this.router.push({path: '/'})">返回
|
||||
</el-button>
|
||||
|
||||
<el-menu-item index="1" :route="'/project/'+$route.params.projectId">
|
||||
<span>概览</span>
|
||||
|
|
@ -20,10 +21,7 @@
|
|||
<el-menu-item index="2" :route="'/project/'+$route.params.projectId+'/workitem'">
|
||||
<span>工作项</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="3" :route="'/project/'+$route.params.projectId+'/demand'">
|
||||
<span>需求</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="4" :route="'/project/'+$route.params.projectId+'/group'">
|
||||
<el-menu-item index="3" :route="'/project/'+$route.params.projectId+'/group'">
|
||||
<span>团队</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
|
|
@ -33,18 +31,23 @@
|
|||
<div style="height: 60px; margin: 30px 30px 30px 30px; background-color: white; border-radius: 10px;
|
||||
display: flex; flex-direction: row; align-items: center;justify-content: space-between">
|
||||
<logout-button></logout-button>
|
||||
<span style="font-family: 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">{{project.projectName}}</span>
|
||||
<span
|
||||
style="font-family: 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">{{ project.projectName }}</span>
|
||||
<div style="margin: 0 30px 0 30px; ;
|
||||
display: flex; flex-direction: row-reverse; align-items: center">
|
||||
<div style="width: 42px;height: 42px; background-color: #409EFF; border-radius: 21px;
|
||||
display: flex; justify-content: center;align-items: center;">
|
||||
<span style="color: white">{{ this.$store.state.staff===null? this.$store.state.staff:this.$store.state.staff.staffFullname[0] }}</span>
|
||||
<span style="color: white">{{
|
||||
this.$store.state.staff === null ? this.$store.state.staff : this.$store.state.staff.staffFullname[0]
|
||||
}}</span>
|
||||
</div>
|
||||
<div style="height: 100%; margin-right: 10px;
|
||||
display: flex; flex-direction: column;justify-content: center;align-items: flex-end;">
|
||||
<span
|
||||
style="color: #606266; font-family: 'Segoe UI',sans-serif;font-size: 14px;font-weight: bold; ">
|
||||
{{ this.$store.state.staff===null? this.$store.state.staff: this.$store.state.staff.staffFullname }}</span>
|
||||
{{
|
||||
this.$store.state.staff === null ? this.$store.state.staff : this.$store.state.staff.staffFullname
|
||||
}}</span>
|
||||
<span style="color: #606266; font-family: 'Segoe UI',sans-serif;font-size: 12px;">{{
|
||||
staffJob
|
||||
}}</span>
|
||||
|
|
@ -76,17 +79,30 @@ export default {
|
|||
projectName: ''
|
||||
},
|
||||
staffJob: '项目经理',
|
||||
menuDefaultActive: '1',
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
switch (this.$route.path.split('/').pop()) {
|
||||
case 'workitem':
|
||||
this.menuDefaultActive = '2';
|
||||
break
|
||||
case 'group':
|
||||
this.menuDefaultActive = '3';
|
||||
break
|
||||
default:
|
||||
this.menuDefaultActive = '1';
|
||||
break
|
||||
}
|
||||
|
||||
this.getProjectInfo();
|
||||
},
|
||||
methods: {
|
||||
getProjectInfo() {
|
||||
const that = this
|
||||
request({
|
||||
url: 'project/'+this.$route.params.projectId,
|
||||
url: 'project/' + this.$route.params.projectId,
|
||||
method: 'get'
|
||||
|
||||
}).then(response => {
|
||||
|
|
|
|||
|
|
@ -1,13 +1,139 @@
|
|||
<template>
|
||||
<div>工作项</div>
|
||||
</template>
|
||||
<div style="width: 100%;height: 100%;display: flex;flex-direction: column;align-items: stretch;overflow: auto">
|
||||
|
||||
<div style="margin: 0 40px 0 40px;
|
||||
display: flex;flex-direction: row;justify-content: space-between">
|
||||
<p style="font-family: 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">工作项</p>
|
||||
</div>
|
||||
<div style="flex: 1; margin: 30px 30px 10px 30px; background-color: white; border-radius: 10px;padding: 20px;
|
||||
display: flex;flex-direction: column;justify-content: space-between">
|
||||
|
||||
<el-table
|
||||
ref="tableRef"
|
||||
class="projectTable"
|
||||
row-key="taskId"
|
||||
lazy
|
||||
:load="loadChildren"
|
||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
||||
@row-click="onRowClick"
|
||||
:height="tableHeight"
|
||||
:data="workitems">
|
||||
<el-table-column prop="taskName" label="            标题"
|
||||
min-width="15%">
|
||||
<template #default="scope">
|
||||
<div style="display: inline-block;">
|
||||
<div style="display: flex;align-items: center">
|
||||
<div v-if="!scope.row.hasChildren" style="width: 20px"></div>
|
||||
<div style="width: 24px;display: flex;justify-content: center">
|
||||
<svg-icon v-if="scope.row.taskType==='任务'" style="width: 20px;height: 20px;"
|
||||
icon-class="assignment"></svg-icon>
|
||||
<svg-icon v-if="scope.row.taskType==='需求'" style="width: 24px;height: 24px;"
|
||||
icon-class="demand"></svg-icon>
|
||||
<svg-icon v-if="scope.row.taskType==='缺陷'" style="width: 20px;height: 20px;"
|
||||
icon-class="defect"></svg-icon>
|
||||
</div>
|
||||
<span style="margin-left: 5px">{{ scope.row.taskName }}</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="taskId" label="编号" min-width="10%"/>
|
||||
<el-table-column prop="taskStatus" label="状态" min-width="10%">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.taskStatus" class="m-2" placeholder="Select" size="large">
|
||||
<el-option
|
||||
label="待进行"
|
||||
value="待进行"
|
||||
/>
|
||||
<el-option
|
||||
label="进行中"
|
||||
value="进行中"
|
||||
/>
|
||||
<el-option
|
||||
label="已完成"
|
||||
value="已完成"
|
||||
/>
|
||||
<el-option
|
||||
label="关闭"
|
||||
value="关闭"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="taskHolderId" label="负责人" min-width="10%"/>
|
||||
<el-table-column prop="taskCreatedTime" label="创建时间" min-width="10%" :formatter="dateFormatter"/>
|
||||
<el-table-column prop="taskEndTime" label="截止时间" min-width="10%" :formatter="dateFormatter"/>
|
||||
<el-table-column prop="taskPriority" label="优先级" min-width="10%"/>
|
||||
|
||||
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
<script>
|
||||
import request from "../utils/request";
|
||||
import moment from "moment";
|
||||
|
||||
export default {
|
||||
name: "ProjectWorkitem"
|
||||
name: "ProjectWorkitem",
|
||||
data() {
|
||||
return {
|
||||
|
||||
workitems: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getWorkitems()
|
||||
},
|
||||
methods: {
|
||||
getWorkitems() {
|
||||
const that = this;
|
||||
request({
|
||||
url: 'project/' + this.$route.params.projectId + '/task/0/subtask',
|
||||
method: 'get',
|
||||
}).then(response => {
|
||||
if (response.data.code === 200) {
|
||||
//console.log(response.data.records)
|
||||
that.workitems = response.data.data.records
|
||||
}
|
||||
}).catch(function (error) {
|
||||
console.log(error)
|
||||
})
|
||||
},
|
||||
loadChildren(row, treeNode, resolve) {
|
||||
const that = this;
|
||||
request({
|
||||
url: 'project/' + this.$route.params.projectId + '/task/' + row.taskId + '/subtask',
|
||||
method: 'get',
|
||||
}).then(response => {
|
||||
if (response.data.code === 200) {
|
||||
resolve(response.data.data.records)
|
||||
}
|
||||
}).catch(function (error) {
|
||||
console.log(error)
|
||||
})
|
||||
|
||||
},
|
||||
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 HH:mm")
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
::v-deep .cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue