mirror of
https://github.com/FatttSnake/Pinnacle-OA.git
synced 2026-04-06 07:21:24 +08:00
ggb commit first progress in 2023/5/1 02:53
This commit is contained in:
GGB
147
ui/src/pages/work/AllTask.vue
Normal file
147
ui/src/pages/work/AllTask.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="main-table">
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column fixed prop="id" label="工作事项ID" width="150" />
|
||||
<el-table-column prop="publisher_id" label="发布者ID" width="120" />
|
||||
<el-table-column prop="taskContent" label="内容" width="800" />
|
||||
<el-table-column prop="worker" label="工作人员" width="200">
|
||||
<template #default="{ row }">
|
||||
<span v-for="item in row.worker" :key="item.userID">
|
||||
{{ item.userName }},
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deadLine" label="结束时间" width="200">
|
||||
<template #default="scope">
|
||||
{{ formatDate(scope.row.deadLine) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="taskStatus" label="状态" width="150" />
|
||||
<el-table-column prop="progress" label="进度" width="250">
|
||||
<template #default>
|
||||
<el-progress :text-inside="true" :stroke-width="20" :percentage="70" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="240">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" size="large" @click="handleClick"
|
||||
>编辑</el-button
|
||||
>
|
||||
<el-popconfirm
|
||||
width="220"
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
:icon="InfoFilled"
|
||||
icon-color="#00d4ff"
|
||||
title="是否确定删除？"
|
||||
@confirm="deleteConfirmEvent(scope.row)"
|
||||
@cancel="deleteCancelEvent"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button link type="primary" size="default">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
<el-popconfirm
|
||||
width="220"
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
:icon="InfoFilled"
|
||||
icon-color="#00d4ff"
|
||||
title="是否确认完成？"
|
||||
@confirm="completeConfirmEvent"
|
||||
@cancel="completeCancelEvent"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button link type="primary" size="default">完成</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="main-add-content">
|
||||
<div class="main-add-box">
|
||||
<el-button @click="dialogFormVisible = true">添加</el-button>
|
||||
</div>
|
||||
<el-dialog v-model="dialogFormVisible" width="60%">
|
||||
<edit-work @setDialogVisible="setDialogVisible"></edit-work>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
import EditWork from '@/components/EditWork.vue'
|
||||
|
||||
export default {
|
||||
name: 'AllTaskPage',
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
dialogFormVisible: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatDate(deadLine) {
|
||||
console.log(new Date(deadLine).toLocaleString())
|
||||
return new Date(deadLine).toLocaleString()
|
||||
},
|
||||
handleClick() {
|
||||
console.log('click')
|
||||
},
|
||||
deleteConfirmEvent(row) {
|
||||
this.deleteTableData(row)
|
||||
location.reload()
|
||||
console.log('delete confirm!')
|
||||
},
|
||||
deleteCancelEvent() {
|
||||
console.log('delete cancel!')
|
||||
},
|
||||
completeConfirmEvent() {
|
||||
console.log('complete confirm!')
|
||||
},
|
||||
completeCancelEvent() {
|
||||
console.log('complete cancel!')
|
||||
},
|
||||
getTableData() {
|
||||
axios
|
||||
.get('http://localhost:8080/work')
|
||||
.then((response) => {
|
||||
console.log(response.data)
|
||||
this.tableData = response.data
|
||||
console.log(this.tableData)
|
||||
})
|
||||
.catch((reportError) => {
|
||||
console.log(reportError)
|
||||
})
|
||||
},
|
||||
deleteTableData(row) {
|
||||
axios
|
||||
.delete('http://localhost:8080/work/' + row.id)
|
||||
.then((response) => {
|
||||
console.log(response.data)
|
||||
})
|
||||
.catch((reportError) => {
|
||||
console.log(reportError)
|
||||
})
|
||||
},
|
||||
setDialogVisible(dialogVisible) {
|
||||
console.log(dialogVisible)
|
||||
this.dialogFormVisible = dialogVisible
|
||||
location.reload()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData()
|
||||
},
|
||||
components: {
|
||||
EditWork
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import '@/assets/css/work/work.css';
|
||||
</style>
|
||||
102
ui/src/pages/work/Complete.vue
Normal file
102
ui/src/pages/work/Complete.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="main-table">
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column fixed prop="id" label="工作事项ID" width="150" />
|
||||
<el-table-column prop="publisher_id" label="发布者ID" width="120" />
|
||||
<el-table-column prop="taskContent" label="内容" width="800" />
|
||||
<el-table-column prop="worker" label="工作人员" width="200">
|
||||
<template #default="{ row }">
|
||||
<span v-for="item in row.worker" :key="item.userID">
|
||||
{{ item.userName }},
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deadLine" label="结束时间" width="200">
|
||||
<template #default="scope">
|
||||
{{ formatDate(scope.row.deadLine) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="240">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" size="large">查看</el-button>
|
||||
<el-popconfirm
|
||||
width="220"
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
:icon="InfoFilled"
|
||||
icon-color="#00d4ff"
|
||||
title="是否确认完成？"
|
||||
@confirm="todoConfirmEvent(scope.row)"
|
||||
@cancel="todoCancelEvent"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button link type="primary" size="default">未完成</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'CompletePage',
|
||||
data() {
|
||||
return {
|
||||
tableData: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatDate(deadLine) {
|
||||
console.log(new Date(deadLine).toLocaleString())
|
||||
return new Date(deadLine).toLocaleString()
|
||||
},
|
||||
todoConfirmEvent(row) {
|
||||
console.log(row)
|
||||
this.setTaskTodo(row)
|
||||
console.log('complete confirm!')
|
||||
location.reload()
|
||||
},
|
||||
todoCancelEvent() {
|
||||
console.log('complete cancel!')
|
||||
},
|
||||
getTableData() {
|
||||
axios
|
||||
.get('http://localhost:8080/work/complete')
|
||||
.then((response) => {
|
||||
console.log(response.data)
|
||||
this.tableData = response.data
|
||||
console.log(this.tableData)
|
||||
})
|
||||
.catch((reportError) => {
|
||||
console.log(reportError)
|
||||
})
|
||||
},
|
||||
setTaskTodo(row) {
|
||||
var workDo = new Object()
|
||||
workDo.id = row.id
|
||||
workDo.taskStatus = false
|
||||
axios
|
||||
.put('http://localhost:8080/work', workDo)
|
||||
.then((response) => {
|
||||
console.log(response.data)
|
||||
})
|
||||
.catch((reportError) => {
|
||||
console.log(reportError)
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@import '@/assets/css/work/work.css';
|
||||
</style>
|
||||
29
ui/src/pages/work/Task.vue
Normal file
29
ui/src/pages/work/Task.vue
Normal file
@@ -0,0 +1,29 @@
|
||||
<template>
|
||||
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal">
|
||||
<el-menu-item index="1"
|
||||
><router-link to="/todo" style="text-decoration: none"
|
||||
>待办工作</router-link
|
||||
></el-menu-item
|
||||
>
|
||||
<el-menu-item index="2"
|
||||
><router-link to="complete" style="text-decoration: none"
|
||||
>已办工作</router-link
|
||||
></el-menu-item
|
||||
>
|
||||
</el-menu>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TaskPage',
|
||||
data() {
|
||||
return {
|
||||
activeIndex: '1'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$router.push('/todo')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,9 +1,101 @@
|
||||
<template><div></div></template>
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="main-table">
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column fixed prop="id" label="工作事项ID" width="150" />
|
||||
<el-table-column prop="publisher_id" label="发布者ID" width="120" />
|
||||
<el-table-column prop="taskContent" label="内容" width="800" />
|
||||
<el-table-column prop="worker" label="工作人员" width="200">
|
||||
<template #default="{ row }">
|
||||
<span v-for="item in row.worker" :key="item.userID">
|
||||
{{ item.userName }},
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="deadLine" label="结束时间" width="200">
|
||||
<template #default="scope">
|
||||
{{ formatDate(scope.row.deadLine) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="240">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" size="large">查看</el-button>
|
||||
<el-popconfirm
|
||||
width="220"
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
:icon="InfoFilled"
|
||||
icon-color="#00d4ff"
|
||||
title="是否确认完成？"
|
||||
@confirm="completeConfirmEvent(scope.row)"
|
||||
@cancel="completeCancelEvent"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button link type="primary" size="default">完成</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
name: 'TodoPage'
|
||||
name: 'TodoPage',
|
||||
data() {
|
||||
return {
|
||||
tableData: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatDate(deadLine) {
|
||||
console.log(new Date(deadLine).toLocaleString())
|
||||
return new Date(deadLine).toLocaleString()
|
||||
},
|
||||
completeConfirmEvent(row) {
|
||||
console.log(row)
|
||||
this.setTaskComplete(row)
|
||||
console.log('complete confirm!')
|
||||
location.reload()
|
||||
},
|
||||
completeCancelEvent() {
|
||||
console.log('complete cancel!')
|
||||
},
|
||||
getTableData() {
|
||||
axios
|
||||
.get('http://localhost:8080/work/todo')
|
||||
.then((response) => {
|
||||
console.log(response.data)
|
||||
this.tableData = response.data
|
||||
console.log(this.tableData)
|
||||
})
|
||||
.catch((reportError) => {
|
||||
console.log(reportError)
|
||||
})
|
||||
},
|
||||
setTaskComplete(row) {
|
||||
var workDo = new Object()
|
||||
workDo.id = row.id
|
||||
workDo.taskStatus = true
|
||||
axios
|
||||
.put('http://localhost:8080/work', workDo)
|
||||
.then((response) => {
|
||||
console.log(response.data)
|
||||
})
|
||||
.catch((reportError) => {
|
||||
console.log(reportError)
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
<style scoped>
|
||||
@import '@/assets/css/work/work.css';
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user