WxxyDeveloper/Jsl-OA-Web-Re
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(业务): 我负责的页面完善1

Browse Source
This commit is contained in:
GUjiYN 2024-04-22 19:48:29 +08:00
parent ab4a3d85c0
commit 8af2d5501e
3 changed files with 271 additions and 309 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/project.js
View File

@ -49,7 +49,7 @@ export function DeleteProject(id, token) {
//编辑项目
export function EditProject(id, data, token) {
return request({
url: '/project/edit/',
url: '/project/edit',
method: 'put',
params:{ id },
data,

548
src/views/personal/project/charge.vue
View File

@ -1,5 +1,6 @@
<template>
<div>
<!--顶部卡片-->
<el-card style="max-width: 100vw;margin: 1.5vw;">
<template #header>
<div class="card-header">
@ -35,6 +36,8 @@
</div>
<template #footer>Footer content</template>
</el-card>
<!--表格卡片-->
<el-card style="max-width: 100vw;margin: 1.5vw;">
<template #header>
<div class="card-header" style="display: flex; justify-content: space-between; align-items: center;">
@ -118,9 +121,6 @@
<el-button link type="primary" size="small" @click="toggleEditDialog(row)">编辑</el-button>
<el-button link type="primary" size="small" @click="toggleDeleteDialog(row)">删除</el-button>
</div>
<div style="margin-bottom: 4px">
<el-button link type="primary" size="small" @click="toggleAppointDialog(row)">指定项目负责人</el-button>
</div>
<div style="margin-bottom: 4px">
<el-button link type="primary" size="small" @click="toChildSystem(row.id)">查看详情</el-button>
</div>
@ -129,158 +129,161 @@
</el-table>
<div style="display: flex; justify-content: center;margin-top: 2vh">
<el-pagination
background
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-size="pageSize"
:total="total"
layout="prev, pager, next"
:total="totalItems"
/>
background
style="display: flex; justify-content: center; margin-top: 20px;">
</el-pagination>
</div>
</el-card>
<!--新增项目对话框-->
<el-dialog v-model="AddDialogVisible" title="新增项目" width="500">
<el-form label-width="auto" style="max-width: 600px">
<el-form-item
label="项目名称"
:rules="{
<!--新增项目对话框-->
<el-dialog v-model="AddDialogVisible" title="新增项目" width="500">
<el-form label-width="auto" style="max-width: 600px">
<el-form-item
label="项目名称"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.name" />
</el-form-item>
<el-form-item
label="周期"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.name" />
</el-form-item>
<el-form-item
label="周期"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.cycle"/>
</el-form-item>
<el-form-item
label="工作量"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.workLoad" />
</el-form-item>
<el-form-item
label="截止时间"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<div class="block">
<el-date-picker
v-model="AddFormData.deadLine"
type="date"
placeholder="Pick a day"
/>
</div>
</el-form-item>
<el-form-item
label="项目简介"
:rules="{
trigger: 'blur',
}"
>
<el-input type="textarea" v-model="AddFormData.description" />
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item
label="负责人"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.principalId" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="标签"
:rules="{
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.tags" />
</el-form-item>
</el-col>
</el-row>
<el-form-item>
>
<el-input v-model="AddFormData.cycle"/>
</el-form-item>
<el-form-item
label="工作量"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.workLoad" />
</el-form-item>
<el-form-item
label="截止时间"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<div class="block">
<el-date-picker
v-model="AddFormData.deadLine"
type="date"
placeholder="Pick a day"
/>
</div>
</el-form-item>
<el-form-item
label="项目简介"
:rules="{
trigger: 'blur',
}"
>
<el-input type="textarea" v-model="AddFormData.description" />
</el-form-item>
<el-row>
<el-col :span="20">
<el-col :span="12">
<el-form-item
label="状态"
label="负责人"
:rules="{
required: true,
message: 'Please select a status',
trigger: 'blur',
}"
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-select v-model="AddFormData.status">
<el-option value="未开始">未开始</el-option>
<el-option value="进行中">进行中</el-option>
<el-option value="已完成">已完成</el-option>
<el-option value="已暂停">已暂停</el-option>
</el-select>
<el-input v-model="AddFormData.principalId" />
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-upload
v-model="AddFormData.fakeFile"
multiple
style=" margin-right: 13px;"
>
<el-button type="success">
<el-icon><UploadFilled /></el-icon>
上传文档
</el-button>
</el-upload>
<el-col :span="12">
<el-form-item
label="标签"
:rules="{
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="AddFormData.tags" />
</el-form-item>
</el-col>
</el-row>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="CancelAdd()">取消</el-button>
<el-button type="primary" @click="addProject()">
确认
</el-button>
</div>
</template>
</el-dialog>
<el-form-item>
<el-row>
<el-col :span="20">
<el-form-item
label="状态"
:rules="{
required: true,
message: 'Please select a status',
trigger: 'blur',
}"
>
<el-select v-model="AddFormData.status">
<el-option value="未开始">未开始</el-option>
<el-option value="进行中">进行中</el-option>
<el-option value="已完成">已完成</el-option>
<el-option value="已暂停">已暂停</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-upload
v-model="AddFormData.fakeFile"
multiple
style=" margin-right: 13px;"
>
<el-button type="success">
<el-icon><UploadFilled /></el-icon>
上传文档
</el-button>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="CancelAdd()">取消</el-button>
<el-button type="primary" @click="addProject()">
确认
</el-button>
</div>
</template>
</el-dialog>
<!--删除多个项目对话框-->
<el-dialog
title="删除项目"
width="450"
align-center
v-model="DeleteMulDialogVisible"
>
<span>确认删除该项目吗?</span>
<template #footer>
<div class="dialog-footer">
<el-button type="danger" @click="deleteMultipleProjects()">删除</el-button>
<el-button @click="CancelMulDelete()">取消</el-button>
</div>
</template>
</el-dialog>
<!--删除多个项目对话框-->
<el-dialog
title="删除项目"
width="450"
align-center
v-model="DeleteMulDialogVisible"
>
<span>确认删除该项目吗?</span>
<template #footer>
<div class="dialog-footer">
<el-button type="danger" @click="deleteMultipleProjects()">删除</el-button>
<el-button @click="CancelMulDelete()">取消</el-button>
</div>
</template>
</el-dialog>
<!--删除单个项目对话框-->
<el-dialog
@ -298,131 +301,110 @@
</template>
</el-dialog>
<!--编辑项目对话框-->
<el-dialog v-model="EditDialogVisible" title="编辑项目" width="500">
<el-form label-width="auto" style="max-width: 600px">
<el-form-item
label="项目名称"
:rules="{
<!--编辑项目对话框-->
<el-dialog v-model="EditDialogVisible" title="编辑项目" width="500">
<el-form label-width="auto" style="max-width: 600px">
<el-form-item
label="项目名称"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.name"/>
</el-form-item>
<el-form-item
label="项目简介"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.name"/>
</el-form-item>
<el-form-item
label="项目简介"
:rules="{
>
<el-input v-model="EditFormData.description"/>
</el-form-item>
<el-form-item
label="项目Id"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.projectId"/>
</el-form-item>
<el-form-item
label="标签"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.tags"/>
</el-form-item>
<el-form-item
label="状态"
:rules="{
required: true,
message: 'Please select a status',
trigger: 'blur',
}"
>
<el-select v-model="EditFormData.status">
<el-option value="未开始">未开始</el-option>
<el-option value="进行中">进行中</el-option>
<el-option value="已完成">已完成</el-option>
<el-option value="已暂停">已暂停</el-option>
</el-select>
</el-form-item>
<el-form-item
label="工作量"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.description"/>
</el-form-item>
<el-form-item
label="项目Id"
:rules="{
>
<el-input v-model="EditFormData.workLoad"/>
</el-form-item>
<el-form-item
label="周期"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.projectId"/>
</el-form-item>
<el-form-item
label="标签"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.tags"/>
</el-form-item>
<el-form-item
label="状态"
:rules="{
required: true,
message: 'Please select a status',
trigger: 'blur',
}"
>
<el-select v-model="EditFormData.status">
<el-option value="未开始">未开始</el-option>
<el-option value="进行中">进行中</el-option>
<el-option value="已完成">已完成</el-option>
<el-option value="已暂停">已暂停</el-option>
</el-select>
</el-form-item>
<el-form-item
label="工作量"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.workLoad"/>
</el-form-item>
<el-form-item
label="周期"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<el-input v-model="EditFormData.cycle"/>
</el-form-item>
<el-form-item
label="截止时间"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<div class="block">
<el-date-picker
v-model="EditFormData.deadLine"
type="date"
placeholder="Pick a day"
/>
>
<el-input v-model="EditFormData.cycle"/>
</el-form-item>
<el-form-item
label="截止时间"
:rules="{
required: true,
message: 'domain can not be null',
trigger: 'blur',
}"
>
<div class="block">
<el-date-picker
v-model="EditFormData.deadLine"
type="date"
placeholder="Pick a day"
/>
</div>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="CancelEdit()">取消</el-button>
<el-button type="primary" @click="editProject()">
确认
</el-button>
</div>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="CancelEdit()">取消</el-button>
<el-button type="primary" @click="editProject()">
确认
</el-button>
</div>
</template>
</el-dialog>
<!--指定项目负责人对话框-->
<el-dialog v-model="AppointDialogVisible" title="指定项目负责人">
<el-table :data="[currentRowData]" style="width: 100%">
<el-table-column prop="id" label="序号"></el-table-column>
<el-table-column prop="principalUser" label="项目负责人"></el-table-column>
<el-table-column label="选择新负责人">
<el-select v-model="selectedPrincipal" placeholder="请选择项目负责人">
<el-option v-for="option in appointOptions.option" :value="option.username">
{{option.username}}
</el-option>
</el-select>
</el-table-column>
</el-table>
<template #footer>
<div class="dialog-footer">
<el-button @click="CancelAppoint()">取消</el-button>
<el-button type="primary" @click="confirmAppointment()">确认</el-button>
</div>
</template>
</el-dialog>
</template>
</el-dialog>
</div>
</template>
<script lang="ts" setup>
@ -444,8 +426,9 @@ const tableData = ref([]);
const listLoading = ref(false);
const token = getToken();
const page = ref('');
const pageSize = ref('');
const totalItems = ref(0);
const currentPage = ref(1);
const pageSize = ref(10); // 你可以根据需要设置默认的页面大小
const total = ref(0);
const editId = reactive({ id:'', })
const searchData = reactive({ name:'', });
const deleteDatas = reactive({ ids: '' });
@ -512,38 +495,46 @@ async function getList() {
console.log("use token:", token);
listLoading.value = true;
try {
// 确保这里传递了 page 和 pageSize 参数
const response = await GetProject(page.value, pageSize.value, token);
console.log("完整响应内容:", response);
if (response.data.list) {
const list = response.data.list;
tableData.value = list.map(item => parseData(item));
totalItems.value = response.data.total;
if (response.data && response.data.list) {
tableData.value = response.data.list.map(item => parseData(item));
total.value = response.data.total; // 设置总项目数
} else {
console.error("未获取到预期数据，响应内容:", response);
tableData.value = [];
total.value = 0;
}
} catch (error) {
console.error('请求失败:', error);
tableData.value = [];
total.value = 0;
} finally {
listLoading.value = false;
}
}
function handleCurrentChange(newPage) {
page.value = newPage;
getList(); // 重新获取当前页的数据
}
//新增项目
function toggleAddDialog() {
AddDialogVisible.value = !AddDialogVisible.value;
}
async function addProject() {
console.log("add token:", token);
try {
const res = await AddProject(AddFormData, token);
if (res.data) {
getList();
if (res.code===200) {
listLoading.value = true;
ElMessage({
message: '新增成功',
type: 'success',
})
getList();
} else {
console.error("未获取到预期数据，响应内容:", res);
}
@ -688,45 +679,6 @@ function reset() {
getList();
}
//指定项目负责人
async function getAppointOptions() {
try {
const response = await GetAppointOptions(token);
if (response.code === 200) {
appointOptions.option = response.data;
} else {
console.error("无数据");
}
} catch (error) {
console.error('Error fetching status options:', error);
}
};
function toggleAppointDialog(row) {
currentRowData.value = row;
AppointDialogVisible.value = true;
}
function confirmAppointment() {
console.log("指定新负责人:", selectedPrincipal.value);
// 在这里添加将确认结果发送到服务器的代码
AppointDialogVisible.value = false;
ElMessage({
message: '项目负责人更新成功',
type: 'success',
duration: 3000
});
getList();
}
function CancelAppoint() {
AppointDialogVisible.value = false;
}
onMounted(async () => {
await getList(); // 确保数据加载完成
await getAppointOptions();

30
src/views/personal/project/childSystem/charge.vue
View File

@ -403,7 +403,7 @@ import {
AddChildSystem,
DeleteChildSystem,
DeleteProject,
EditChildSystem, GetAppointOptions,
EditChildSystem, EditProject, GetAppointOptions,
GetChildSysById,
GetProjectByName
} from '@/api/project';
@ -496,7 +496,6 @@ function toggleAddDialog() {
}
async function addChildSystem() {
console.log("add token:", token);
try {
const res = await AddChildSystem(AddFormData, token);
if (res.code===200) {
@ -650,17 +649,28 @@ function toggleAppointDialog(row) {
}
function confirmAppointment() {
async function confirmAppointment() {
console.log("指定新负责人:", selectedPrincipal.value);
AppointDialogVisible.value = false;
ElMessage({
message: '子系统负责人更新成功',
type: 'success',
duration: 3000
});
getChildSysById();
const response = await EditChildSystem(editId, EditFormData, token);
if (response.code===200){
console.log("指定负责人Result:", response);
AppointDialogVisible.value = false;
ElMessage({
message: '子系统负责人更新成功',
type: 'success',
duration: 3000
});
getChildSysById();
} else {
ElMessage({
message:'子系统负责人更新失败',
type: 'warning',
duration: 3000
})
}
}
function CancelAppoint() {
AppointDialogVisible.value = false;
}