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) { export function EditProject(id, data, token) {
return request({ return request({
url: '/project/edit/', url: '/project/edit',
method: 'put', method: 'put',
params:{ id }, params:{ id },
data, data,

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

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

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

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