feat: 模板编辑,任务大纲,新增模板任务阶段页面

This commit is contained in:
王熙东
2022-11-21 18:17:41 +08:00
parent ed3d2f4627
commit 6bc5991774
4 changed files with 3674 additions and 851 deletions

View File

@@ -4,7 +4,7 @@ import http from "./config";
//编辑项目模板
export const templateEdit = (obj) => http.post('/admin/project/template/edit',obj);
// 模板详情
export const templateDetail = (id) => http.get(`/admin/project/template/edit?projectTemplateId=${id}`);
export const templateDetail = (id) => http.get(`/admin/project/template/detail?projectTemplateId=${id}`);
// 删除阶段
export const deleteStage = (id) => http.delete(`/admin/project/template/deleteStage`,{stageId:id});
//删除任务

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -6,7 +6,7 @@
<div
@click="backPage"
style="cursor: pointer"
to="/libraryAdd"
to="/manage/libraryAdd"
class="goback"
>
<span class="return"></span><span class="returntext">返回</span>
@@ -24,11 +24,10 @@
</div>
<div class="in">
<a-input
v-model:value="projectName"
v-model:value="projectInfo.name"
placeholder="请输入模板名称"
show-count
:maxlength="30"
:disabled="viewDetail ? true : false"
/>
</div>
</div>
@@ -47,14 +46,13 @@
return triggerNode.parentNode || document.body;
}
"
v-model:value="classifySelect"
placeholder="四个养成"
v-model:value="projectInfo.category"
placeholder="管理者"
style="width: 100%"
:options="classifyList"
@change="classificationChange"
allowClear
showSearch
:disabled="viewDetail ? true : false"
>
</a-select>
</div>
@@ -88,7 +86,6 @@
action="/api/file/upload"
:before-upload="beforeUpload"
@change="handleChange"
:disabled="viewDetail ? true : false"
>
<img
style="
@@ -126,8 +123,6 @@
:placeholder="[' 开始时间', ' 结束时间']"
v-model:value="rangevalue"
style="width: 100%; height: 40px; border-radius: 5px"
@change="onRangeChange"
:disabled="viewDetail ? true : false"
/>
</div>
</div>
@@ -146,7 +141,7 @@
return triggerNode.parentNode || document.body;
}
"
:value="classifySelect1"
:value="projectInfo.manager"
mode="multiple"
placeholder="请选择项目经理"
style="width: 100%"
@@ -154,7 +149,6 @@
@change="classificationChange1"
allowClear
showSearch
:disabled="viewDetail ? true : false"
>
</a-select>
</div>
@@ -175,11 +169,10 @@
return triggerNode.parentNode || document.body;
}
"
v-model:value="classifySelect2"
placeholder="自动带出 可修改"
v-model:value="projectInfo.sourceBelongId"
placeholder="项目一"
:options="classifyList2"
@change="classificationChange2"
:disabled="viewDetail ? true : false"
/>
</div>
</div>
@@ -189,12 +182,11 @@
</div>
<div class="in">
<a-textarea
v-model:value="remark"
v-model:value="projectInfo.remark"
style="height: 80px"
placeholder="请输入说明"
show-count
:maxlength="200"
:disabled="viewDetail ? true : false"
/>
</div>
</div>
@@ -205,8 +197,7 @@
<div class="in">
<a-radio
@click="changeChecked"
v-model:checked="checked"
:disabled="viewDetail ? true : false"
v-model:checked="projectInfo.courseSyncFlag"
><span
style="
width: 100%;
@@ -233,7 +224,7 @@
return triggerNode.parentNode || document.body;
}
"
v-model:value="classifySelect3"
v-model:value="projectInfo.level"
:options="classifyList3"
@change="classificationChange3"
placeholder="集团级/组织级/现地级/部门级"
@@ -256,7 +247,7 @@
return triggerNode.parentNode || document.body;
}
"
v-model:value="classifySelect4"
v-model:value="projectInfo.systemId"
:options="classifyList4"
@change="classificationChange4"
placeholder="集团级/组织级/现地级/部门级"
@@ -275,7 +266,7 @@
<div class="in">
<a-radio
@click="changeChecked1"
v-model:checked="checked1"
v-model:checked="projectInfo.boeFlag"
:disabled="viewDetail ? true : false"
><span
style="
@@ -308,46 +299,6 @@
</div>
</div> -->
</div>
<!-- 选择模板 ------------------------------ -->
<div class="template" style="display: none">
<div class="name">
<div class="inname" style="width: 50px">模版</div>
<div class="in select" style="margin-left: 2px">
<a-select
v-if="isEdit"
disabled="true"
:getPopupContainer="
(triggerNode) => {
return triggerNode.parentNode || document.body;
}
"
v-model:value="classifySelect5"
placeholder="请选择模版"
:size="size"
style="width: 100%"
:options="classifyList5"
@change="classificationChange5"
>
</a-select>
<a-select
v-else
:getPopupContainer="
(triggerNode) => {
return triggerNode.parentNode || document.body;
}
"
v-model:value="classifySelect5"
placeholder="请选择模版"
:size="size"
style="width: 100%"
:options="classifyList5"
@change="classificationChange5"
@popupScroll="templateScroll"
>
</a-select>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="btn">
@@ -363,10 +314,10 @@
import { reactive, toRefs, ref } from "vue";
import { message } from "ant-design-vue";
import { useRouter, useRoute } from "vue-router";
import dayjs from "dayjs";
import * as api from "../../api/index";
// import dayjs from "dayjs";
import * as api from "../../api/indexTemplate";
import { storage } from "../../api/storage";
import { toDate } from "../../api/method";
// import { toDate } from "../../api/method";
export default {
name: "projectAdd",
@@ -374,126 +325,16 @@ export default {
// 编辑页面跳转过来时候,自动填充表格
const routers = useRoute();
const isEdit = ref(false);
let peojectID = "";
// let peojectID = "";
if (routers.query.projectId) {
storage.set("projectAddId", routers.query.projectId);
isEdit.value = true;
peojectID = routers.query.projectId;
// 需要编辑
api
.getProjectDetail({ projectId: routers.query.projectId })
.then((res) => {
if (res.status == 200 && res.data.code == 200) {
let info = res.data.data.projectInfo;
console.log(info);
// projectName classifySelect imageUrl * classifySelect1 * remark checked classifySelect3 classifySelect4 changeChecked1 *
projectName.value = info.name;
state.classifySelect = classifyList.value[1]; // info.category
imageUrl.value = info.picUrl;
let start = toDate(info.beginTime / 1000, "YYYY/MM/DD");
let end = toDate(info.endTime / 1000, "YYYY/MM/DD");
state.rangevalue = [
dayjs(start, "YYYY/MM/DD"),
dayjs(end, "YYYY/MM/DD"),
];
let manageName = info.manager.split(",");
let manageValue = info.managerId.split(",");
let optionsManage = [];
for (let i = 0; i < manageName.length; i++) {
let obj = {
label: manageName[i],
value: manageValue[i],
};
optionsManage.push(obj);
}
console.log(optionsManage);
state.classifySelect1 = optionsManage;
state.classifySelect2 =
classifyList2.value[info.sourceBelongId - 1];
remark.value = info.remark;
state.checked = info.boeFlag ? info.boeFlag : false;
state.classifySelect3 = classifyList3.value[info.level];
state.classifySelect4 = classifyList4.value[info.systemId - 1];
state.checked1 = info.boeFlag ? info.boeFlag : false;
// fileList1.value = info.attach.split(",");
projectType = 1;
picUrl = info.picUrl;
beginTime = Number(info.beginTime / 1000);
endTime = Number(info.endTime / 1000);
manager = info.manager;
managerId = info.managerId;
sourceBelongIdC = Number(info.sourceBelongId);
courseSyncFlag = info.courseSyncFlag;
levels = info.level;
systemid = info.systemId;
boeFlag = info.boeFlag;
}
})
.catch((err) => {
console.log(err);
});
// peojectID = routers.query.projectId;
} else {
if (storage.get("projectAddId")) {
isEdit.value = true;
peojectID = storage.get("projectAddId");
// 需要编辑
api
.getProjectDetail({ projectId: storage.get("projectAddId") })
.then((res) => {
if (res.status == 200 && res.data.code == 200) {
let info = res.data.data.projectInfo;
console.log("我是从本地存储获取的id", info);
projectName.value = info.name;
state.classifySelect = classifyList.value[1]; // info.category
imageUrl.value = info.picUrl;
let start = toDate(info.beginTime / 1000, "YYYY/MM/DD");
let end = toDate(info.endTime / 1000, "YYYY/MM/DD");
state.rangevalue = [
dayjs(start, "YYYY/MM/DD"),
dayjs(end, "YYYY/MM/DD"),
];
let manageName = info.manager.split(",");
let manageValue = info.managerId.split(",");
let optionsManage = [];
for (let i = 0; i < manageName.length; i++) {
let obj = {
label: manageName[i],
value: manageValue[i],
};
optionsManage.push(obj);
}
console.log(optionsManage);
state.classifySelect1 = optionsManage;
state.classifySelect2 =
classifyList2.value[info.sourceBelongId - 1];
remark.value = info.remark;
state.checked = info.boeFlag ? info.boeFlag : false;
state.classifySelect3 = classifyList3.value[info.level];
state.classifySelect4 = classifyList4.value[info.systemId - 1];
state.checked1 = info.boeFlag ? info.boeFlag : false;
projectType = 1;
picUrl = info.picUrl;
beginTime = Number(info.beginTime / 1000);
endTime = Number(info.endTime / 1000);
manager = info.manager;
managerId = info.managerId;
sourceBelongIdC = Number(info.sourceBelongId);
courseSyncFlag = info.courseSyncFlag;
levels = info.level;
systemid = info.systemId;
boeFlag = info.boeFlag;
}
})
.catch((err) => {
console.log(err);
});
// peojectID = storage.get("projectAddId");
}
}
@@ -501,7 +342,7 @@ export default {
storage.remove("projectAddId");
setTimeout(() => {
router.push({
path: "/libraryAdd",
path: "/manage/libraryAdd",
});
}, 400);
};
@@ -526,6 +367,19 @@ export default {
pageSize: 10, //每页10条数据
totalPages: 0, //总页数
viewDetail: routers.query.viewDetail ? routers.query.viewDetail : null,
projectInfo:{
beginTime:null,
endTime:null,
name: null,
manager: null,
notice: null,
sourceBelongId: null,
remark: "",
courseSyncFlag: false,
level: null,
systemId: null,
boeFlag: false,
}
});
const projectName = ref("");
@@ -536,11 +390,11 @@ export default {
{ value: 3, label: "产业人" },
]);
let projectType = "";
// let projectType = "";
const classificationChange = (value) => {
console.log(`selected ${value}`);
projectType = value;
// projectType = value;
};
function getBase64(img, callback) {
@@ -553,7 +407,7 @@ export default {
const fileList1 = ref([]);
const loading = ref(false);
const imageUrl = ref("");
let picUrl = "";
// let picUrl = "";
const handleChange = (info) => {
if (info.file.status === "uploading") {
@@ -562,7 +416,7 @@ export default {
}
if (info.file.status === "done") {
console.log("上传图片返回的信息 %o", info);
picUrl = info.file.response.data;
// picUrl = info.file.response.data;
// Get this url from response in real world.
getBase64(info.file.originFileObj, (base64Url) => {
imageUrl.value = base64Url;
@@ -577,7 +431,7 @@ export default {
let uplodaFileCount = false;
let attach = "";
// let attach = "";
let attachData = "";
const handleChange1 = (info) => {
if (info.file.status === "uploading") {
@@ -602,7 +456,7 @@ export default {
}
}
console.log(attachStr);
attach = attachStr;
// attach = attachStr;
if (info.fileList.length > 5) {
uplodaFileCount = true;
@@ -639,8 +493,6 @@ export default {
});
};
let beginTime = "";
let endTime = "";
const dateFormatList = ["YYYY/MM/DD"];
const onRangeChange = (value, dateString) => {
@@ -651,8 +503,8 @@ export default {
"Formatted Selected TimeStamp",
new Date(dateString[0]).getTime()
);
beginTime = new Date(dateString[0]).getTime() / 1000;
endTime = new Date(dateString[1]).getTime() / 1000;
// beginTime = new Date(dateString[0]).getTime() / 1000;
// endTime = new Date(dateString[1]).getTime() / 1000;
};
// 项目经理 后续接口调用
@@ -662,8 +514,6 @@ export default {
{ value: 3, label: "刘孟君" },
]);
let manager = "";
let managerId = "";
const classificationChange1 = (key, options) => {
console.log(`selected ${key}`, options);
let mstr = "";
@@ -686,8 +536,8 @@ export default {
}
}
state.classifySelect1 = newoptions;
manager = mstr;
managerId = midstr;
// manager = mstr;
// managerId = midstr;
};
// 资源归属 sourceBelongId 后续给接口
@@ -697,10 +547,10 @@ export default {
{ value: 3, label: "项目三" },
]);
let sourceBelongIdC = "";
// let sourceBelongIdC = "";
const classificationChange2 = (key) => {
console.log(`selected ${key}`, classifyList2);
sourceBelongIdC = key;
// sourceBelongIdC = key;
};
// 项目级别
@@ -711,10 +561,10 @@ export default {
{ value: 4, label: "部门级" },
]);
let levels = "";
// let levels = "";
const classificationChange3 = (key) => {
console.log(`selected ${key}`, classifyList3);
levels = key;
// levels = key;
};
// 培训体系
@@ -725,112 +575,11 @@ export default {
{ value: 4, label: "部门级" },
]);
let systemid = "";
// let systemid = "";
const classificationChange4 = (key) => {
console.log(`selected ${key}`, classifyList4);
systemid = key;
// systemid = key;
};
// 模版
const classifyList5 = ref([
// { value: 1, label: "模版一" },
// { value: 2, label: "模版二" },
// { value: 3, label: "模版三" },
// { value: 4, label: "模版四" },
]);
const classificationChange5 = (key) => {
console.log(`selected ${key}`, classifyList5.value);
//获取模版信息
let obj = {
projectId: Number(key),
};
api
.getProjectDetail(obj)
.then((res) => {
console.log("获取项目详情", res);
if (res.status === 200) {
let info = res.data.data.projectInfo;
console.log(info);
// projectName classifySelect imageUrl * classifySelect1 * remark checked classifySelect3 classifySelect4 changeChecked1 *
projectName.value = info.name;
state.classifySelect = classifyList.value[1]; // info.category
imageUrl.value = info.picUrl;
let start = toDate(info.beginTime / 1000, "YYYY/MM/DD");
let end = toDate(info.endTime / 1000, "YYYY/MM/DD");
state.rangevalue = [
dayjs(start, "YYYY/MM/DD"),
dayjs(end, "YYYY/MM/DD"),
];
let manageName = info.manager.split(",");
let manageValue = info.managerId.split(",");
let optionsManage = [];
for (let i = 0; i < manageName.length; i++) {
let obj = {
label: manageName[i],
value: manageValue[i],
};
optionsManage.push(obj);
}
console.log(optionsManage);
state.classifySelect1 = optionsManage;
state.classifySelect2 =
classifyList2.value[info.sourceBelongId - 1];
remark.value = info.remark;
state.checked = info.boeFlag ? info.boeFlag : false;
state.classifySelect3 = classifyList3.value[info.level];
state.classifySelect4 = classifyList4.value[info.systemId - 1];
state.checked1 = info.boeFlag ? info.boeFlag : false;
// fileList1.value = info.attach.split(",");
projectType = 1;
picUrl = info.picUrl;
beginTime = Number(info.beginTime / 1000);
endTime = Number(info.endTime / 1000);
manager = info.manager;
managerId = info.managerId;
sourceBelongIdC = Number(info.sourceBelongId);
courseSyncFlag = info.courseSyncFlag;
levels = info.level;
systemid = info.systemId;
boeFlag = info.boeFlag;
}
})
.catch((err) => {
console.log("获取详情失败", err);
});
};
//获取模版列表
const getTemplate = () => {
let obj = {
pageNo: state.currentPage,
pageSize: state.pageSize,
// projectId:id?id:''
};
api
.getProjectList(obj)
.then((res) => {
console.log("获取模版列表", res);
state.totalPages = Number(res.data.data.pages);
if (res.status === 200) {
let arr = res.data.data.rows;
let array = classifyList5.value;
arr.map((value) => {
let obj = {
value: value.projectId,
label: value.name,
};
array.push(obj);
});
classifyList5.value = array;
}
})
.catch((err) => {
console.log("获取模版列表失败", err);
});
};
getTemplate();
//模版滚动加载信息
const templateScroll = (e) => {
// console.log("滚动", e, b);
@@ -845,48 +594,30 @@ export default {
if (state.currentPage < state.totalPages) {
// 如果滑到底部,则加载下一页
state.currentPage++;
getTemplate();
}
}
};
// 项目说明
const remark = ref("");
// const removeFile = (file) => {
// const index = fileList1.value.indexOf(file);
// const newFileList = fileList1.value.slice();
// newFileList.splice(index, 1);
// fileList1.value = newFileList;
let courseSyncFlag = 0;
const changeChecked = () => {
console.log(state.checked);
state.checked ? (state.checked = false) : (state.checked = true);
courseSyncFlag = state.checked ? 1 : 0;
};
let boeFlag = 0;
const changeChecked1 = () => {
console.log(state.checked1);
state.checked1 ? (state.checked1 = false) : (state.checked1 = true);
boeFlag = state.checked1 ? 1 : 0;
};
const removeFile = (file) => {
const index = fileList1.value.indexOf(file);
const newFileList = fileList1.value.slice();
newFileList.splice(index, 1);
fileList1.value = newFileList;
let attachStr = "";
if (newFileList.length == 0) {
attachStr = "";
}
for (let i = 0; i < fileList1["value"].length; i++) {
console.log(fileList1["value"][i].response.data);
if (fileList1["value"].length - 1 == i) {
attachStr += fileList1["value"][i].response.data;
} else {
attachStr += fileList1["value"][i].response.data + ",";
}
}
attach = attachStr;
};
// let attachStr = "";
// if (newFileList.length == 0) {
// attachStr = "";
// }
// for (let i = 0; i < fileList1["value"].length; i++) {
// console.log(fileList1["value"][i].response.data);
// if (fileList1["value"].length - 1 == i) {
// attachStr += fileList1["value"][i].response.data;
// } else {
// attachStr += fileList1["value"][i].response.data + ",";
// }
// }
// attach = attachStr;
// };
const errorMsgs = {
name: "请输入项目名称",
@@ -903,31 +634,25 @@ export default {
};
const createProject = () => {
console.log("我是否要编辑项目", isEdit.value);
if (isEdit.value) {
console.log("我要编辑项目", peojectID);
console.log("我要编辑项目", isEdit.value);
let obj = {
projectId: Number(peojectID),
name: projectName["value"],
category: projectType,
picUrl: picUrl,
beginTime: beginTime,
endTime: endTime,
manager: manager,
managerId: managerId,
sourceBelongId: sourceBelongIdC,
remark: remark["value"],
courseSyncFlag: courseSyncFlag,
level: levels,
systemId: systemid,
boeFlag: boeFlag,
attach: attach,
type: 3,
templateId: 0,
parentId: 0,
notice: "",
noticeFlag: 0,
status: 0,
"beginTime": 0,
"boeFlag": 0,
"category": 0,
"courseSyncFlag": 0,
"endTime": 0,
"level": 0,
"manager": "",
"managerId": "",
"name": "",
"notice": "",
"noticeFlag": 0,
"picUrl": "",
"projectTemplateId": 0,
"remark": "",
"sourceBelongId": 0,
"status": 0,
"systemId": 0
};
console.log(obj);
@@ -940,9 +665,8 @@ export default {
return;
}
}
api
.createProject(obj)
.templateEdit(obj)
.then((res) => {
console.log(res);
if (res.status == 200 && res.data.code == 200) {
@@ -950,7 +674,7 @@ export default {
message.success("编辑成功");
setTimeout(() => {
router.push({
path: "/projectmanage",
path: "/manage/projectmanage",
});
}, 1000);
} else {
@@ -963,64 +687,37 @@ export default {
message.destroy();
message.error("编辑失败,请检查当前网络状态。");
});
} else {
let obj = {
name: projectName["value"],
category: projectType,
picUrl: picUrl,
beginTime: beginTime,
endTime: endTime,
manager: manager,
managerId: managerId,
sourceBelongId: sourceBelongIdC,
remark: remark["value"],
courseSyncFlag: courseSyncFlag,
level: levels,
systemId: systemid,
boeFlag: boeFlag,
attach: attach,
type: 3,
templateId: 10,
parentId: 0,
notice: "",
noticeFlag: 0,
status: 0,
};
console.log("提交的数据格式 %o", obj);
for (let i in errorMsgs) {
console.log(obj[i]);
if (obj[i] === "" || obj[i] === undefined) {
message.destroy();
message.warning(errorMsgs[i]);
return;
}
}
api
.createProject(obj)
.then((res) => {
console.log(res);
if (res.status == 200 && res.data.code == 200) {
message.destroy();
message.success("创建成功");
setTimeout(() => {
router.push({
path: "/taskpage",
query: { id: res.data.data.projectId },
});
}, 1000);
} else {
message.destroy();
message.error("创建失败,请检查当前网络状态。");
}
})
.catch((err) => {
console.log(err);
message.destroy();
message.error("创建失败,请检查当前网络状态。");
});
}
};
// 编辑项目模板
const editTemplate = () => {
let obj = {
"beginTime": state.projectInfo.time,
"boeFlag": state.projectInfo.boeFlag,
"category": 0,
"courseSyncFlag": state.projectInfo.courseSyncFlag,
"endTime": state.projectInfo.time,
"level": state.projectInfo.level,
"manager": state.projectInfo.manager,
"managerId": "",
"name": state.projectInfo.name,
"notice": "",
"noticeFlag": 0,
"picUrl": "",
"projectTemplateId": 0,
"remark": state.projectInfo.remark,
"sourceBelongId": state.projectInfo.sourceBelongId,
"status": 0,
"systemId": state.projectInfo.systemId
};
api.templateEdit(obj).methods(obj).then(res => {
message.success("编辑成功")
console.log(res)
}).catch(err => {
message.error("编辑失败"+err)
console.log(err)
})
}
return {
...toRefs(state),
@@ -1031,7 +728,6 @@ export default {
classificationChange2,
classificationChange3,
classificationChange4,
classificationChange5,
fileList,
fileList1,
loading,
@@ -1045,18 +741,13 @@ export default {
classifyList2,
classifyList3,
classifyList4,
classifyList5,
remark,
changeChecked,
changeChecked1,
uplodaFileCount,
createProject,
removeFile,
// removeFile,
isEdit,
backPage,
dateFormatList,
editTemplate,
templateScroll,
};
},