hz/fe-manage
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git synced 2025-12-15 05:46:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat:修改调研基础信息

Browse Source
This commit is contained in:
李晓鸽
2022-10-18 15:18:09 +08:00
parent d7b1eb4a05 00ebdd7b72
commit 08119c504a
11 changed files with 4182 additions and 1360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

544
src/views/projectcenter/TaskAdd.vue
View File

@@ -2,7 +2,12 @@
<div class="allCon">
<div class="left clearfix">
<div class="leftmain">
<div class="tit">阶段<img src="../../assets/images/projectadd/right.png" style="margin-left: 10px"/></div>
<div class="tit">
阶段<img
src="../../assets/images/projectadd/right.png"
style="margin-left: 10px"
/>
</div>
<div class="btn btn3" @click="showModal" style="margin-left: 19px">
<div class="search"></div>
<div class="btnText">添加阶段</div>
@@ -29,7 +34,10 @@
<div class="filt">
<div class="le">
<div class="leftimg">
<img class="img" src="../../assets/images/projectadd/picture.png" />
<img
class="img"
src="../../assets/images/projectadd/picture.png"
/>
</div>
<div class="imgfor">
<div class="forz" style="font-weight: 700">管理者进阶-腾飞班</div>
@@ -62,12 +70,17 @@
</div>
<div class="mid">
<div class="item">
<div class="itcon">
<div class="itcon" @click="showDrawerOnline">
<div class="img">
<img src="../../assets/images/leveladd/zai.png" />
</div>
<div class="text">在线</div>
</div>
<!-- 添加在线侧弹窗 -->
<div>
<add-online v-model:addonlineVisible="visible" />
</div>
<!-- 添加在线侧弹窗 -->
<div class="lin"></div>
</div>
<div class="item">
@@ -172,12 +185,15 @@
<div class="boom">
<div class="boomcen">
<div class="onerow">
<div class="taskmain">任务列表</div>
<button class="btn">移动到任务阶段</button>
<div class="edit">
<img class="editimg" src="../../assets/images/projectadd/delete.png"/>
<span class="editext">批量删除</span>
</div>
<div class="taskmain">任务列表</div>
<button class="btn">移动任务到阶段</button>
<div class="edit">
<img
class="editimg"
src="../../assets/images/projectadd/delete.png"
/>
<span class="editext">批量删除</span>
</div>
</div>
<div class="talk">
<img class="im" src="../../assets/images/leveladd/gan.png" />
@@ -220,43 +236,12 @@
/>
</div>
</div>
</div>
</div>
<div class="draw" style="position: relative">
<a-drawer
v-model:visible="visible"
class="drawerStyle"
title="关联项目"
placement="right"
width="80%"
@after-visible-change="afterVisibleChange"
>
<div class="drawerMain">
<div class="header">
<div class="headerTitle">关联项目</div>
<img
style="width: 29px; height: 29px; cursor: pointer"
src="../../assets/images/basicinfo/close.png"
@click="showDrawer"
/>
</div>
<div class="drawerbox">
<a-table
:columns="drawercolumns"
:data-source="drawertableData"
:loading="tableDataTotal === -1 ? true : false"
:scroll="{ x: 700 }"
@expand="expandTable"
:pagination="false"
>
</a-table>
</div>
<div class="btnn">
<button @click="showDrawer" class="btn1">取消</button>
<button @click="showDrawer" class="btn2">确定</button>
</div>
<!-- 编辑在线侧弹窗 -->
<div>
<add-online v-model:addonlineVisible="visible" />
</div>
</a-drawer>
<!-- 编辑在线侧弹窗 -->
</div>
</div>
</div>
<div>
@@ -270,45 +255,97 @@
width="624px"
height="388px"
>
<div class="modalHeader"
style="width: 100%;height: 68px;display: flex;align-items: center;justify-content: space-between;background:linear-gradient(0deg,rgba(78, 166, 255, 0) 0%,rgba(78, 166, 255, 0.2000) 100%)"
>
<div
class="modalHeader"
style="
width: 100%;
height: 68px;
display: flex;
align-items: center;
justify-content: space-between;
background: linear-gradient(
0deg,
rgba(78, 166, 255, 0) 0%,
rgba(78, 166, 255, 0.2) 100%
);
"
>
<div class="headerLeft" style="margin-left: 32px">
<span class="headerLeftText" style="font-size: 16px">添加阶段</span>
</div>
<div style="cursor: pointer;margin-right:32px" @click="closeModal">
<div style="cursor: pointer; margin-right: 32px" @click="closeModal">
<img
style="width: 22px; height: 22px"
src="../../assets/images/basicinfo/close22.png"
/>
</div>
</div>
<div class="modalMain"
style="width: 100%;"
>
<div class="modalMain" style="width: 100%">
<div class="name">
<div class="namebox">
<div class="inname">阶段名称：</div>
</div>
<div class="in">
<a-input v-model:value="valueE" show-count :maxlength="20" placeholder="请输入阶段名称" />
</div>
<div class="namebox">
<div class="inname">阶段名称：</div>
</div>
<div class="in">
<a-input
v-model:value="valueE"
show-count
:maxlength="20"
placeholder="请输入阶段名称"
/>
</div>
</div>
<div class="name" style="display: flex; align-items: flex-start">
<div class="namebox">
<div class="inname">阶段说明：</div>
</div>
<div class="intext" style="margin-left: 14px">
<a-textarea v-model:value="value" style="height: 88px" show-count :maxlength="100" placeholder="请输入阶段说明" />
</div>
<div class="namebox">
<div class="inname">阶段说明：</div>
</div>
<div class="intext" style="margin-left: 14px">
<a-textarea
v-model:value="value"
style="height: 88px"
show-count
:maxlength="100"
placeholder="请输入阶段说明"
/>
</div>
</div>
<div style="display: flex;width: 100%;justify-content: center;margin-top: 40px">
<button @click="closeModal"
style=" cursor: pointer;height: 40px;width: 100px;border: 1px solid #409EFF;border-radius: 4px;color: #409EFF;background-color: #FFFFFF"
>取消</button>
<button @click="closeModal"
style=" cursor: pointer;margin-left: 16px;margin-bottom: 40px;height: 40px;width: 100px;border: 1px solid #409EFF;border-radius: 4px;color: #FFFFFF;background-color: #409EFF"
>确定</button>
<div
style="
display: flex;
width: 100%;
justify-content: center;
margin-top: 40px;
"
>
<button
@click="closeModal"
style="
cursor: pointer;
height: 40px;
width: 100px;
border: 1px solid #409eff;
border-radius: 4px;
color: #409eff;
background-color: #ffffff;
"
>
取消
</button>
<button
@click="closeModal"
style="
cursor: pointer;
margin-left: 16px;
margin-bottom: 40px;
height: 40px;
width: 100px;
border: 1px solid #409eff;
border-radius: 4px;
color: #ffffff;
background-color: #409eff;
"
>
确定
</button>
</div>
</div>
</a-modal>
@@ -318,6 +355,7 @@
<script>
import { reactive, toRefs, onMounted, onUnmounted } from "vue";
import AddOnline from "../../components/drawers/AddOnline.vue";
const drawercolumns = [
{
title: "项目名称",
@@ -358,6 +396,9 @@ const drawercolumns = [
];
export default {
name: "LevelAddDetail",
components: {
AddOnline,
},
setup() {
const state = reactive({
projectNameList: [
@@ -523,7 +564,6 @@ export default {
key: "1-1",
projectName: "管理者进阶-腾飞班",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
children: [
@@ -549,7 +589,6 @@ export default {
key: "2-1",
projectName: "管理者进阶-腾飞班",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
children: [
@@ -564,12 +603,10 @@ export default {
},
],
},
{
key: 3,
projectName: "管理者进阶-腾飞班K1",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
},
@@ -577,7 +614,6 @@ export default {
key: 4,
projectName: "管理者进阶-腾飞班K1",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
},
@@ -585,7 +621,6 @@ export default {
key: 5,
projectName: "管理者进阶-腾飞班K1",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
},
@@ -593,7 +628,6 @@ export default {
key: 6,
projectName: "管理者进阶-腾飞班K1",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
},
@@ -601,7 +635,6 @@ export default {
key: 7,
projectName: "管理者进阶-腾飞班K1",
manager: "黄华 刘俊",
creater: "毛继禹",
time: "2022-07-20 14:00:03",
},
@@ -610,6 +643,7 @@ export default {
tableDataTotal: 100,
pageSize: 10,
visible: false,
visible2: false,
stage: false,
selectedRowKeys: [],
});
@@ -619,9 +653,6 @@ export default {
const selectProjectName2 = (value, index) => {
console.log("value", value, index);
};
const showDrawer = () => {
state.visible = !state.visible;
};
const afterVisibleChange = (bool) => {
console.log("visible", bool);
};
@@ -635,7 +666,7 @@ export default {
width: 60,
align: "left",
className: "classify",
scopedSlots: { customRender: "action" }, //引入的插槽
scopedSlots: { customRender: "action" },
customRender: (text) => {
// console.log(text.record.checked1);
return (
@@ -650,11 +681,11 @@ export default {
<span> {text.record.lei}</span>
{/**
<div class="img"></div>
<a-checkbox class="ch" checked={text.record.checkedd}>
{text.record.lei}
</a-checkbox>
*/}
<div class="img"></div>
<a-checkbox class="ch" checked={text.record.checkedd}>
{text.record.lei}
</a-checkbox>
*/}
</div>
);
},
@@ -675,7 +706,7 @@ export default {
// width: 100,
align: "center",
className: "h",
scopedSlots: { customRender: "action" }, //引入的插槽
scopedSlots: { customRender: "action" },
customRender: (text) => {
// console.log(text.record.checked1);
return (
@@ -722,12 +753,17 @@ export default {
key: "opacation",
// width: 100,
align: "center",
scopedSlots: { customRender: "action" }, //引入的插槽
scopedSlots: { customRender: "action" },
customRender: () => {
return (
<div class="opa">
<div class="opacation">
<span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
<span
onClick={() => {
state.visible2 = true;
}}
style="color:#4EA6FF;margin-right:25px;cursor:pointer"
>
编辑
</span>
<span style="color:#4EA6FF;cursor:pointer">删除</span>
@@ -739,12 +775,10 @@ export default {
];
return columns;
};
const onSelectChange = (selectedRowKeys) => {
console.log("selectedRowKeys changed: ", selectedRowKeys);
state.selectedRowKeys = selectedRowKeys;
};
// const getClientHeight = () => {
// state.rightheight =
// document.getElementsByClassName("addhead")[0].offsetHeight +
@@ -769,6 +803,9 @@ export default {
document.getElementsByTagName("main")[0].style.boxShadow =
"0px 1px 35px 0px rgba(118, 136, 166, 0.07)";
});
const showDrawerOnline = () => {
state.visible = true;
};
return {
...toRefs(state),
selectProjectName,
@@ -776,138 +813,137 @@ export default {
tableDataFunc,
showModal,
closeModal,
showDrawer,
// showDrawer,
afterVisibleChange,
drawercolumns,
onSelectChange,
showDrawerOnline,
};
},
};
</script>
<style lang="scss">
.ant-input {
border-radius: 8px;
// height: 120%;
width: 384px;
height: 88px;
border-radius: 8px;
// height: 120%;
width: 384px;
height: 88px;
}
.addstage {
.ant-modal {
.ant-modal-body {
padding: 0 !important;
padding: 0 !important;
.modalMain {
.ant-input-textarea-show-count {
position: relative;
height: 88px;
}
.ant-input-textarea-show-count::after {
position: absolute;
right: 10px;
bottom: 5px;
}
}
}
}
}
.info {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 30px;
// align-items: center;
// height: 40px;
// border: 1px solid black;
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 26px;
margin-top: 15px;
}
.in {
margin-left: 14px;
width: 81%;
position: relative;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 130px;
resize: none;
.ant-input-textarea-show-count {
position: relative;
height: 88px;
}
.ant-input-textarea-show-count::after {
position: absolute;
right: 10px;
bottom: 5px;
}
}
}
}
}
.info {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 30px;
// align-items: center;
// height: 40px;
// border: 1px solid black;
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 26px;
margin-top: 15px;
}
.in {
margin-left: 14px;
width: 81%;
position: relative;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 130px;
resize: none;
}
}
}
.name {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 20px;
align-items: center;
//height: 40px;
// border: 1px solid black;
.namebox {
width: 120px;
display: flex;
align-items: center;
justify-content: flex-end;
flex-shrink: 0;
.nameimg {
width: 10px;
height: 10px;
}
}
.d {
margin-top: 8px;
font-size: 25px;
color: #ff4e4e;
}
.box {
position: relative;
margin-left: 14px;
.box1 {
position: absolute;
left: 50%;
top: 50%;
width: 50px;
margin-left: -25px;
margin-top: -5px;
border-top: 2px solid rgba(78, 166, 255, 1);
}
.box2 {
position: absolute;
left: 50%;
top: 50%;
height: 50px;
//margin-left: -5px;
margin-top: -25px;
border-left: 2px solid rgba(78, 166, 255, 1);
}
}
.inname {
color: #000000;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
flex: 1;
.ant-radio-wrapper {
}
.ant-input-affix-wrapper {
width: 384px;
border-radius: 8px;
}
.ant-input {
border-radius: 8px;
// height: 120%;
//width: 384px;
height: 30px;
}
}
}
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 20px;
align-items: center;
//height: 40px;
// border: 1px solid black;
.namebox {
width: 120px;
display: flex;
align-items: center;
justify-content: flex-end;
flex-shrink: 0;
.nameimg {
width: 10px;
height: 10px;
}
}
.d {
margin-top: 8px;
font-size: 25px;
color: #ff4e4e;
}
.box {
position: relative;
margin-left: 14px;
.box1 {
position: absolute;
left: 50%;
top: 50%;
width: 50px;
margin-left: -25px;
margin-top: -5px;
border-top: 2px solid rgba(78, 166, 255, 1);
}
.box2 {
position: absolute;
left: 50%;
top: 50%;
height: 50px;
//margin-left: -5px;
margin-top: -25px;
border-left: 2px solid rgba(78, 166, 255, 1);
}
}
.inname {
color: #000000;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
flex: 1;
.ant-radio-wrapper {
}
.ant-input-affix-wrapper {
width: 384px;
border-radius: 8px;
}
.ant-input {
border-radius: 8px;
// height: 120%;
//width: 384px;
height: 30px;
}
}
}
.drawerStyle {
.ant-drawer-content-wrapper {
// max-width: 1000px;
@@ -1172,7 +1208,7 @@ export default {
margin-right: 18px;
}
.pub {
color: #57C887;
color: #57c887;
font-size: 14px;
margin-top: 5px;
margin-right: 30px;
@@ -1302,56 +1338,56 @@ export default {
// height: 100%;
// background-color: #bfa;
.onerow {
width: 100%;
display: flex;
width: 100%;
display: flex;
height: 40px;
position: relative;
margin-top: 20px;
.taskmain {
font-size: 18px;
color: #000000;
margin-top: 10px;
}
.btn {
position: absolute;
top: 0;
right: 130px;
background-color: #409eff;
width: 130px;
height: 40px;
position: relative;
margin-top: 20px;
.taskmain {
font-size: 18px;
color: #000000;
margin-top: 10px;
border-radius: 8px;
border: 1px solid #409eff;
color: #ffffff;
cursor: pointer;
}
.edit {
position: absolute;
right: 0;
top: 0;
color: #409eff;
width: 120px;
height: 40px;
border: 1px solid #409eff;
border-radius: 8px;
.editimg {
width: 15px;
height: 15px;
margin-top: -2px;
margin-left: 25px;
margin-right: 5px;
}
.btn {
position: absolute;
top: 0;
right: 130px;
background-color: #409EFF;
width: 130px;
height: 40px;
border-radius: 8px;
border: 1px solid #409EFF;
color: #FFFFFF;
cursor: pointer;
.editext {
line-height: 40px;
}
.edit {
position: absolute;
right: 0;
top: 0;
color: #409EFF;
width: 120px;
height: 40px;
border: 1px solid #409EFF;
border-radius: 8px;
.editimg {
width: 15px;
height: 15px;
margin-top: -2px;
margin-left: 25px;
margin-right: 5px;
}
.editext {
line-height: 40px;
}
}
.edit:hover {
color: #FFFFFF;
background-color: #409EFF;
cursor: pointer;
.editimg {
background-image: url("../../assets/images/projectadd/delete1.png");
}
}
.edit:hover {
color: #ffffff;
background-color: #409eff;
cursor: pointer;
.editimg {
background-image: url("../../assets/images/projectadd/delete1.png");
}
}
}
.talk {
margin-top: 24px;
@@ -1497,4 +1533,4 @@ export default {
}
}
}
</style>
</style>