设计任务

This commit is contained in:
Teo
2025-08-21 01:39:29 +08:00
parent 10ed8585e3
commit c8cc1a329b
3 changed files with 284 additions and 451 deletions

View File

@ -5,24 +5,9 @@
<div v-show="showSearch" class="mb-[10px]">
<el-card shadow="hover">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item label="项目ID" prop="projectId">
<el-input v-model="queryParams.projectId" placeholder="请输入项目ID" clearable @keyup.enter="handleQuery" v-if="false" />
</el-form-item>
<el-form-item label="任务名称" prop="taskName">
<el-input v-model="queryParams.taskName" placeholder="请输入任务名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="任务描述" prop="describe">
<el-input v-model="queryParams.describe" placeholder="请输入任务描述" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="计划完成时间" prop="pcd">
<el-date-picker clearable v-model="queryParams.pcd" type="date" value-format="YYYY-MM-DD" placeholder="请选择计划完成时间" />
</el-form-item>
<el-form-item label="实际完成时间" prop="act">
<el-date-picker clearable v-model="queryParams.act" type="date" value-format="YYYY-MM-DD" placeholder="请选择实际完成时间" />
</el-form-item>
<el-form-item label="完成进度" prop="completionProgress">
<el-input v-model="queryParams.completionProgress" placeholder="请输入完成进度" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
@ -31,7 +16,6 @@
</el-card>
</div>
</transition>
<!-- 任务列表卡片 -->
<el-card shadow="never">
<template #header>
@ -39,21 +23,12 @@
<el-col :span="1.5">
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['patch:patch:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['patch:patch:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['patch:patch:remove']"
>删除</el-button
>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['patch:patch:export']">导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
</template>
<!-- 任务列表表格 -->
<el-table v-loading="loading" :data="masterList" @selection-change="handleSelectionChange" border>
<el-table-column type="selection" width="55" align="center" />
@ -91,22 +66,20 @@
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-tooltip content="修改" placement="top">
<!-- <el-tooltip content="修改" placement="top">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['patch:patch:edit']"></el-button>
</el-tooltip>
</el-tooltip> -->
<el-tooltip content="删除" placement="top">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['patch:patch:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
<!-- 进度详情弹窗 -->
<el-dialog :title="`进度详情(当前总进度:${currentTotalProgress}%`" v-model="progressDialogVisible" width="1000px" destroy-on-close>
<div class="mb-4">
<el-button type="primary" plain icon="Plus" size="small" @click="handleProgressAdd()" v-hasPermi="['patch:progress:add']">
新增进度
</el-button>
<!-- v-hasPermi="['patch:progress:add']" -->
<el-button type="primary" plain icon="Plus" size="small" @click="handleProgressAdd()"> 新增进度 </el-button>
</div>
<el-table v-loading="progressLoading" :data="progressList" border empty-text="暂无进度数据" style="width: 100%">
<el-table-column prop="slaveId" label="执行人ID" align="center" width="120" />
@ -144,21 +117,12 @@
</el-table-column>
</el-table>
</el-dialog>
<!-- 新增/修改进度弹窗 -->
<el-dialog :title="progressDialog.title" v-model="progressDialog.visible" width="500px" append-to-body destroy-on-close>
<el-form ref="progressFormRef" :model="progressForm" :rules="progressRules" label-width="120px">
<el-input v-model="progressForm.ordersId" placeholder="关联的任务ID" readonly style="color: #666; background: #f5f7fa" type="hidden" />
<el-input v-model="progressForm.projectId" type="hidden" />
<!-- 修改执行人姓名选择框 -->
<el-form-item label="执行人姓名" prop="slaveName">
<el-select v-model="progressForm.slaveName" placeholder="请选择执行人姓名" clearable style="width: 100%" @change="handleSlaveChange">
<el-option v-for="item in slaveOptions" :key="item.id" :label="item.name" :value="item.name" :data-id="item.id"></el-option>
</el-select>
</el-form-item>
<el-input v-model="progressForm.slaveId" placeholder="请输入执行人ID" v-if="false" />
<el-form-item label="进度" prop="progress">
<el-input v-model="progressForm.progress" placeholder="请输入进度0-100之间的数字" type="number" @input="handleProgressInput" />
</el-form-item>
@ -181,15 +145,14 @@
<!-- 新增/修改任务弹窗 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body destroy-on-close>
<el-form ref="masterFormRef" :model="form" :rules="rules" label-width="100px">
<el-form-item label="项目ID" prop="projectId">
<el-input v-model="form.projectId" placeholder="请输入项目ID" :readonly="!!currentProjectId" :disabled="!!currentProjectId" />
<template #help>
<span v-if="currentProjectId" class="text-success">已自动关联当前选中项目</span>
</template>
</el-form-item>
<el-form-item label="任务名称" prop="taskName">
<el-input v-model="form.taskName" placeholder="请输入任务名称" />
</el-form-item>
<el-form-item label="执行人姓名" prop="userId">
<el-select v-model="form.userId" placeholder="请选择执行人姓名" clearable style="width: 100%">
<el-option v-for="item in slaveOptions" :key="item.id" :label="item.nickName" :value="item.userId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="计划完成时间" prop="pcd">
<el-date-picker clearable v-model="form.pcd" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择计划完成时间" />
</el-form-item>
@ -197,10 +160,10 @@
<el-date-picker clearable v-model="form.act" type="datetime" value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择实际完成时间" />
</el-form-item>
<el-form-item label="任务描述" prop="describe">
<el-input v-model="form.describe" type="textarea" placeholder="请输入任务描述" rows="3" />
<el-input v-model="form.describe" type="textarea" placeholder="请输入任务描述" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" rows="3" />
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
</el-form-item>
</el-form>
<template #footer>
@ -241,37 +204,17 @@ const userStore = useUserStoreHook();
const currentProject = computed(() => userStore.selectedProject);
const currentProjectId = computed(() => currentProject.value?.id);
// 1. 调整类型定义,匹配接口返回的字段
const slaveOptions = ref<Array<{ id: number; name: string }>>([]);
// 在脚本中添加选择变化的处理函数
const handleSlaveChange = (name) => {
// 找到选中的用户对象
const selectedUser = slaveOptions.value.find((item) => item.name === name);
if (selectedUser) {
// 自动填充userId到slaveId
progressForm.slaveId = selectedUser.id;
} else {
// 未选中时清空ID
progressForm.slaveId = '';
}
};
const slaveOptions = ref([]);
const userMap = new Map();
async function initSlaveOptions() {
try {
const response = await getUserName();
// 确保获取到正确的数组数据接口返回在data字段中
const userDataList = Array.isArray(response?.data) ? response.data : [];
// 转换数据结构只提取需要的字段userId作为idnickName作为name
slaveOptions.value = userDataList
.filter((item) => item?.userId && item?.nickName) // 过滤有效数据
.map((item) => ({
id: item.userId, // 使用userId作为选项的id
name: item.nickName // 使用nickName作为显示名称
}));
console.log('slaveOptions 已更新:', slaveOptions.value);
console.log(response);
slaveOptions.value = response.data;
slaveOptions.value.forEach((item) => {
userMap.set(item.userId, item.nickName);
});
} catch (error) {
console.error('获取用户数据失败:', error);
slaveOptions.value = []; // 错误时重置为空数组
}
}
@ -344,7 +287,7 @@ const queryFormRef = ref<ElFormInstance>();
const masterFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({ visible: false, title: '' });
const initFormData: MasterForm = {
const initFormData = {
id: undefined,
projectId: currentProjectId.value,
taskName: undefined,
@ -353,7 +296,9 @@ const initFormData: MasterForm = {
act: undefined,
completionProgress: undefined,
taskStatus: undefined,
remark: undefined
remark: undefined,
userId: '',
userName: ''
};
const data = reactive<PageData<MasterForm, MasterQuery>>({
@ -372,6 +317,7 @@ const data = reactive<PageData<MasterForm, MasterQuery>>({
},
rules: {
projectId: [{ required: true, message: '请输入项目ID', trigger: 'blur' }],
userId: [{ required: true, message: '请选择执行人', trigger: 'blur' }],
taskName: [{ required: true, message: '请输入任务名称', trigger: 'blur' }],
completionProgress: [{ required: true, message: '请输入完成进度', trigger: 'blur' }]
}
@ -610,6 +556,7 @@ const submitForm = () => {
masterFormRef.value?.validate(async (valid: boolean) => {
if (!valid) return;
buttonLoading.value = true;
form.value.userName = userMap.get(form.value.userId);
try {
// 确保提交时使用当前项目ID
if (!form.value.id && currentProjectId.value) {