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

Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage

Browse Source
This commit is contained in:
dongwug
2022-10-14 18:35:53 +08:00
parent 60ea2d833e 0b12ac79e0
commit 8a2e2dbd9a
13 changed files with 1063 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@@ -36,7 +36,7 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
LearningPath.vue:学习路径页面
LevelAdd.vue:关卡页面
LevelAddDetail.vue:创建关卡页面
LevelCheck.vue查看页面
```
### 二、projectcenter:项目文件夹

17
src/components/BreadCrumb.vue
View File

@@ -68,6 +68,21 @@ export default {
},
];
}
if (n === "/levelcheck" || n === "/LevelCheck") {
state.list = [
{
name: "学习路径",
href: "/learningpath",
},
{
name: "关卡",
href: "/leveladd",
},
{
name: "查看",
},
];
}
if (n === "/projectmanage" || n === "/ProjectManage") {
state.list = [
{
@@ -117,7 +132,7 @@ export default {
},
{
name: "添加任务",
}
},
];
}
if (n === "/templatelibrary" || n === "/TemplateLibrary") {

6
src/components/NavLeft.vue
View File

@@ -258,6 +258,12 @@ export default {
selectedKeys: "sub1",
pagename: "关卡",
},
{
href: "/levelcheck",
openKeys: "sub1",
selectedKeys: "sub1",
pagename: "查看",
},
{
href: "/leveladddetail",
openKeys: "sub1",

246
src/components/drawers/AddVote.vue Normal file
View File

@@ -0,0 +1,246 @@
<template>
<a-drawer
:visible="addvoteVisible"
class="drawerStyle"
style="color: red"
width="80%"
title="添加投票"
placement="right"
@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="closeDrawer"
/>
</div>
<div class="contentMain">
<!-- 投票名称 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">投票名称：</div>
</div>
<div style="width: 424px">
<a-input v-model:value="value" placeholder="请输入投票名称" />
</div>
</div>
<!-- 投票名称 -->
<!-- 创建投票 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">创建投票：</div>
</div>
<div class="votebtn">创建投票</div>
</div>
<!-- 创建投票 -->
<!-- 起止时间 -->
<div class="vote">
<div class="votebox">
<div class="voteimg"></div>
<div class="votename">起止时间：</div>
</div>
<div class="votedate">
<a-range-picker />
</div>
</div>
<!-- 起止时间 -->
<!-- 基础投票数 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">基础投票数：</div>
</div>
<div>
<div class="votebtn">点击上传</div>
<div class="voteclassify">支持：xls.xlsx</div>
</div>
</div>
<!-- 基础投票数 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
</div>
</div>
</a-drawer>
</template>
<script>
import { reactive, toRefs } from "vue";
export default {
name: "AddVote",
props: {
addvoteVisible: {
type: Boolean,
default: false,
},
},
setup(props, ctx) {
const state = reactive({});
const closeDrawer = () => {
ctx.emit("update:addvoteVisible", false);
};
const afterVisibleChange = (bool) => {
console.log("state", bool);
};
const showDrawer = () => {
state.visible = true;
};
return {
...toRefs(state),
afterVisibleChange,
showDrawer,
closeDrawer,
// change,
};
},
};
</script>
<style lang="scss">
.addvote {
}
.drawerStyle {
.drawerMain {
.header {
height: 73px;
border-bottom: 1px solid #e8e8e8;
display: flex;
justify-content: space-between;
align-items: center;
.headerTitle {
font-size: 18px;
font-weight: 600;
color: #333333;
line-height: 25px;
margin-left: 24px;
}
}
.contentMain {
.vote {
display: flex;
align-items: center;
margin-top: 32px;
margin-left: 20px;
.votebox {
width: 100px;
display: flex;
align-items: center;
justify-content: flex-end;
// background-color: pink;
.voteimg {
width: 10px;
height: 10px;
margin-right: 5px;
}
.votename {
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 20px;
}
}
.votebtn {
width: 130px;
height: 40px;
background: #388be1;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 20px;
}
.voteclassify {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
margin-top: 16px;
}
.ant-picker {
width: 424px;
}
}
}
}
}
</style>

341
src/views/learningpath/LearningPath.vue
View File

@@ -92,9 +92,9 @@
<a-modal
:closable="sh"
centered="true"
v-model:visible="out"
:footer="null"
style="margin-top: 400px"
>
<div class="out">
<div class="top">
@@ -572,170 +572,183 @@ export default {
};
</script>
<style lang="scss">
.out {
display: block;
position: absolute;
top: 90px;
width: 680px;
// height: 525px;
background-color: #fff;
box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
.top {
width: 100%;
height: 68px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
display: flex;
align-items: center;
.topimg {
width: 18px;
height: 18px;
margin-left: 27px;
margin-top: -2px;
}
.topc {
color: #000000;
font-size: 16px;
margin-left: 8px;
}
}
.mid {
width: 100%;
height: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
.d {
// margin-top: 8px;
// color: #ff4e4e;
margin-left: -5px;
}
.name {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 20px;
align-items: center;
height: 40px;
// border: 1px solid black;
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
width: 81%;
position: relative;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 40px;
}
.showcount {
position: absolute;
right: 10px;
color: #c7cbd2;
bottom: 5px;
}
}
}
.bac {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 30px;
// border: 1px solid black;
.d {
margin-top: 18px;
color: #ff4e4e;
}
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 7px;
margin-top: 15px;
}
.in {
margin-left: 14px;
width: 81%;
height: 110px;
// background-color: red;
display: flex;
justify-content: space-between;
.im {
border-radius: 8px;
width: 140px;
height: 110px;
cursor: pointer;
}
}
}
.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;
}
.showcount {
position: absolute;
right: 10px;
color: #c7cbd2;
bottom: 5px;
}
}
}
.btn {
width: 33%;
margin-top: 30px;
display: flex;
justify-content: space-between;
margin-bottom: 30px;
.samtn {
width: 100px;
height: 40px;
font-size: 14px;
border: 1px solid #4ea6ff;
border-radius: 8px;
cursor: pointer;
}
.btn1 {
.ant-modal {
width: 680px !important;
height: 528px !important;
.ant-modal-content {
width: 680px !important;
height: 528px !important;
.ant-modal-body {
width: 680px !important;
height: 528px !important;
padding: 0 !important;
.out {
display: block;
position: absolute;
top: 90px;
width: 680px;
// height: 525px;
background-color: #fff;
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #fff;
box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
.top {
width: 100%;
height: 68px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
display: flex;
align-items: center;
.topimg {
width: 18px;
height: 18px;
margin-left: 27px;
margin-top: -2px;
}
.topc {
color: #000000;
font-size: 16px;
margin-left: 8px;
}
}
.mid {
width: 100%;
height: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
.d {
// margin-top: 8px;
// color: #ff4e4e;
margin-left: -5px;
}
.name {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 20px;
align-items: center;
height: 40px;
// border: 1px solid black;
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
width: 81%;
position: relative;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 40px;
}
.showcount {
position: absolute;
right: 10px;
color: #c7cbd2;
bottom: 5px;
}
}
}
.bac {
width: 78%;
// background-color: lightcoral;
display: flex;
margin-top: 30px;
// border: 1px solid black;
.d {
margin-top: 18px;
color: #ff4e4e;
}
.inname {
color: #6f6f6f;
font-size: 14px;
margin-left: 7px;
margin-top: 15px;
}
.in {
margin-left: 14px;
width: 81%;
height: 110px;
// background-color: red;
display: flex;
justify-content: space-between;
.im {
border-radius: 8px;
width: 140px;
height: 110px;
cursor: pointer;
}
}
}
.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;
}
.showcount {
position: absolute;
right: 10px;
color: #c7cbd2;
bottom: 5px;
}
}
}
.btn {
width: 33%;
margin-top: 30px;
display: flex;
justify-content: space-between;
margin-bottom: 30px;
.samtn {
width: 100px;
height: 40px;
font-size: 14px;
border: 1px solid #4ea6ff;
border-radius: 8px;
cursor: pointer;
}
.btn1 {
background-color: #fff;
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #fff;
}
}
}
}
}
}

64
src/views/learningpath/LevelAdd.vue
View File

@@ -355,7 +355,7 @@
</div>
<div class="mid">
<div class="inher">
<div class="cur">当前关卡：关卡1</div>
<div class="cur">当前关卡：</div>
<div class="select">
<a-select
v-model:value="projectName"
@@ -512,9 +512,6 @@ export default {
cur: "关卡2",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 2,
@@ -524,9 +521,6 @@ export default {
cur: "关卡2",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 3,
@@ -536,69 +530,51 @@ export default {
cur: "关卡2",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 4,
name: "张三",
com: "产研部",
gang: "产品经理",
cur: "关卡2",
cur: "关卡1",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 5,
name: "张三",
com: "产研部",
gang: "产品经理",
cur: "关卡2",
cur: "关卡1",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 5,
key: 6,
name: "张三",
com: "产研部",
gang: "产品经理",
cur: "关卡2",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 5,
key: 7,
name: "张三",
com: "产研部",
gang: "产品经理",
cur: "关卡2",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
{
key: 5,
key: 8,
name: "张三",
com: "产研部",
gang: "产品经理",
cur: "关卡2",
jin: "2/10",
time: "2022-07-15 14:00",
haspub: false,
checked1: false,
checkedd: false,
},
],
});
@@ -691,16 +667,19 @@ export default {
width: 110,
align: "center",
scopedSlots: { customRender: "action" }, //引入的插槽
customRender: () => {
customRender: (text) => {
return (
<div class="opa">
<div class="opacation">
<span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
查看
</span>
<routerLink to="/levelcheck">
<span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
查看
</span>
</routerLink>
<span
onClick={() => {
state.visible = true;
console.log(text.record.cur);
}}
style="color:#4EA6FF;margin-right:25px;cursor:pointer"
>
@@ -743,8 +722,11 @@ export default {
clear: both;
}
.ant-modal {
width: 549px !important;
height: 245px !important;
.ant-modal-content {
width: 549px !important;
height: 245px !important;
.ant-modal-body {
padding: 0 !important;
width: 549px !important;
@@ -1341,6 +1323,20 @@ export default {
cursor: pointer;
margin-right: 20px;
}
.select {
.ant-select {
//
// border: 0 !important;
border-radius: 11px;
.ant-select-selector {
border: 1px solid #4ea6ff !important;
.ant-select-selection-placeholder {
padding-left: 15px;
color: #4ea6ff;
}
}
}
}
}
.talk {
margin-top: 24px;

196
src/views/learningpath/LevelAddDetail.vue
View File

@@ -5,7 +5,7 @@
<div class="tit" style="margin-left: 18px">关卡</div>
<div class="btn btn3" style="margin-left: 19px">
<div class="search"></div>
<div class="btnText">添加关卡</div>
<div class="btnText" @click="showModal">添加关卡</div>
</div>
<div class="maincon" style="background-color: #fff">
<div class="item" v-for="item in level" :key="item.id">
@@ -24,6 +24,52 @@
</div>
</div>
</div>
<a-modal
v-model:visible="modal"
centered="true"
:footer="null"
:closable="clos"
>
<div class="header">
<div class="headmain">
<div class="add">添加关卡</div>
<div class="img" style="cursor: pointer" @click="closeModal"></div>
</div>
</div>
<div class="main">
<div class="inma">
<div class="name">
<div class="fir">关卡名称：</div>
<div class="input">
<a-input
style="width: 100%"
v-model:value="value1"
:maxlength="20"
placeholder="请输入关卡名称"
/>
</div>
<div class="co">{{ value1.length }}/20</div>
</div>
<div class="name">
<div class="fir">关卡说明：</div>
<div class="input">
<a-textarea
style="width: 100%"
v-model:value="value2"
:maxlength="100"
placeholder="请输入关卡说明"
:rows="5"
/>
</div>
<div class="co1">{{ value2.length }}/100</div>
</div>
<div class="btn">
<button class="btn1">取消</button>
<button class="btn2">确定</button>
</div>
</div>
</div>
</a-modal>
<div class="right">
<div class="addhead">
<div class="filt">
@@ -587,6 +633,10 @@ export default {
tableDataTotal: 100,
pageSize: 10,
visible: false,
modal: false,
clos: false,
value1: "",
value2: "",
selectedRowKeys: [],
});
const selectProjectName = (value, index) => {
@@ -596,7 +646,13 @@ export default {
console.log("value", value, index);
};
const showDrawer = () => {
state.visible = !state.visible;
state.visible = true;
};
const showModal = () => {
state.modal = true;
};
const closeModal = () => {
state.modal = false;
};
const afterVisibleChange = (bool) => {
console.log("visible", bool);
@@ -746,6 +802,8 @@ export default {
selectProjectName2,
tableDataFunc,
showDrawer,
showModal,
closeModal,
afterVisibleChange,
drawercolumns,
onSelectChange,
@@ -761,7 +819,141 @@ export default {
display: block;
clear: both;
}
.ant-modal {
width: 624px !important;
height: 388px !important;
.ant-modal-content {
width: 624px !important;
height: 388px !important;
border-radius: 4px !important;
.ant-modal-body {
// background-color: blue;
width: 100% !important;
height: 100% !important;
padding: 0 !important;
.header {
width: 624px;
height: 68px;
background: linear-gradient(
180deg,
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
display: flex;
justify-content: center;
.headmain {
width: 90%;
height: 100%;
display: flex;
align-items: center;
justify-content: space-between;
.add {
font-size: 16px;
font-weight: 600;
color: #333333;
}
.img {
width: 20px;
height: 20px;
background-image: url(../../assets/images/basicinfo/close22.png);
background-size: 100% 100%;
}
}
}
.main {
width: 100%;
height: calc(100% - 68px);
// background-color: #bfa;
display: flex;
justify-content: center;
.inma {
width: 75%;
height: 100%;
// background-color: lightblue;
.name {
display: flex;
position: relative;
margin-top: 30px;
.fir {
font-size: 14px;
font-weight: 400;
color: rgba(0, 0, 0, 0.85);
white-space: nowrap;
margin-top: 3px;
}
.input {
width: 100%;
.ant-input {
border-radius: 8px;
border: 1px solid #c7cbd2;
&::placeholder {
font-size: 12px;
position: absolute;
top: 5px;
}
}
.ant-textarea {
border-radius: 8px;
border: 1px solid #c7cbd2;
&::placeholder {
font-size: 12px;
position: absolute;
top: 5px;
}
}
}
.co {
position: absolute;
right: 10px;
top: 4px;
font-size: 14px;
font-weight: 400;
color: #c7cbd2;
}
.co1 {
position: absolute;
right: 10px;
bottom: 8px;
font-size: 14px;
font-weight: 400;
color: #c7cbd2;
}
}
.btn {
margin-top: 40px;
width: 100%;
display: flex;
justify-content: center;
.btn1 {
width: 100px;
height: 40px;
border-radius: 4px;
border: 1px solid #387df7;
font-size: 14px;
color: #387df7;
cursor: pointer;
background: #ffffff;
margin-right: 20px;
}
.btn2 {
width: 100px;
height: 40px;
border-radius: 4px;
font-size: 14px;
color: #fff;
cursor: pointer;
border: 0;
background: #388be1;
}
}
}
}
}
}
}
.drawerStyle {
.ant-drawer-content-wrapper {
// max-width: 1000px;

354
src/views/learningpath/LevelCheck.vue Normal file
View File

@@ -0,0 +1,354 @@
<template>
<div class="checkwrapper">
<div class="header">
<div class="left">
<div class="img"></div>
<div class="msg">
<div class="name">哈哈</div>
<div class="cur">产研部门-产品经理</div>
</div>
</div>
<div class="right">
<div class="lne"></div>
<div class="jin">
<div class="jint">进度排行</div>
<div class="jinc">
<span style="color: #ff90ae">2&nbsp;</span>/&nbsp;10
</div>
</div>
<div class="lne"></div>
<div class="jin">
<div class="jint">完成必修</div>
<div class="jinc">
<span style="color: #a497ff">3&nbsp;</span>/&nbsp;5
</div>
</div>
<div class="lne"></div>
<div class="jin">
<div class="jint">已获取证书</div>
<div class="jinc">
<span style="color: #ffb64e">1</span>
</div>
</div>
<div class="lne"></div>
<div class="return">
<div class="im"></div>
<div class="fan">返回</div>
</div>
</div>
</div>
<div class="pad"></div>
<div class="bottom">
<div class="padd"></div>
<div class="bomcen">
<div class="centop">
<div class="d"></div>
<div class="topinf">产品经理进阶路径</div>
<div class="infor">
<div class="sy">说明 &nbsp;></div>
</div>
</div>
<div class="item">
<div v-for="item in gq" :key="item.id">
<div class="minc">
<div class="itmtit">关卡{{ item.id }}名称：{{ item.title }}</div>
</div>
<div :class="item.haschild ? 'show' : 'i'">
<div v-for="it in item.child" :key="it.id" class="ite">
<div class="title">{{ it.title }}</div>
<div class="btn">
<button
:class="it.done ? 'btnoo' : 'btno'"
style="z-index: 999"
>
已完成
</button>
<button :class="it.done ? 'btntt' : 'btnt'">未完成</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="padd"></div>
</div>
</div>
</template>
<script>
import { toRefs, reactive } from "vue";
export default {
name: "LevelCheck",
setup() {
const state = reactive({
gq: [
{
id: 1,
title: "初级产品经理",
haschild: true,
child: [
{
id: 1 - 1,
done: true,
title: "「课程」如何成为一个产品经理",
},
{
id: 1 - 2,
done: false,
title: "「作业」产品作业",
},
{
id: 1 - 3,
done: false,
title: "「考试」产品考试",
},
],
},
{
id: 2,
title: "中级产品经理",
},
],
});
return {
...toRefs(state),
};
},
};
</script>
<style lang="scss" >
.clearfix:before,
.clearfix:after {
content: "";
display: table;
clear: both;
}
.checkwrapper {
width: 100%;
height: 100%;
.header {
display: flex;
width: 100%;
// background-color: #bfa;
justify-content: space-between;
flex-wrap: wrap;
padding: 20px;
.left {
display: flex;
height: 100%;
align-items: center;
.img {
width: 90px;
height: 90px;
background-color: red;
border-radius: 50%;
border: 8px solid #e7f2ff;
background-image: url(../../assets/px.jpg);
background-size: 100% 100%;
}
.msg {
height: 100%;
margin-left: 27px;
.name {
font-size: 16px;
font-weight: 500;
color: #363636;
}
.cur {
margin-top: 20px;
font-size: 14px;
font-weight: 400;
color: #878b92;
}
}
}
.right {
display: flex;
height: 100%;
align-items: center;
.lne {
width: 1px;
height: 82px;
background: #e8effa;
}
.jin {
display: flex;
flex-direction: column;
align-items: center;
margin-left: 50px;
margin-right: 50px;
.jint {
font-size: 16px;
font-weight: 400;
color: #333330;
}
.jinc {
font-size: 18px;
font-weight: 600;
color: #959595;
}
}
.return {
display: flex;
align-items: center;
cursor: pointer;
margin-left: 30px;
margin-right: 40px;
.im {
width: 42px;
height: 42px;
background-size: 100% 100%;
background-image: url(../../assets/images/leveladd/back.png);
}
.fan {
font-size: 14px;
font-weight: 400;
color: #4ea6ff;
margin-left: 20px;
}
}
}
}
.pad {
// #EFF4FC
width: 100%;
height: 20px;
// background-color: #edf0f5;
background-image: linear-gradient(90deg, #edf0f5, #eff4fc);
}
.bottom {
width: 100%;
height: 100%;
// background-color: #bfa;
display: flex;
.padd {
width: 40px;
height: 100%;
}
.bomcen {
// 内容区
width: 100%;
height: 100%;
// background-color: lavenderblush;
.centop {
margin-top: 25px;
display: flex;
align-items: center;
.d {
width: 4px;
height: 13px;
background: #4ea6ff;
border-radius: 2px;
}
.topinf {
font-size: 16px;
font-weight: 500;
color: #333333;
margin-left: 16px;
}
.infor {
display: flex;
margin-top: 4px;
margin-left: 17px;
cursor: pointer;
.sy {
font-size: 14px;
font-weight: 400;
color: #4ea6ff;
text-align: center;
}
}
}
.item {
width: 100%;
margin-top: 30px;
.minc {
width: 100%;
height: 50px;
background: #eff4fc;
display: flex;
align-items: center;
.itmtit {
font-size: 14px;
font-weight: 400;
color: #409eff;
margin-left: 20px;
}
}
.show {
.ite {
width: 100%;
height: 49px;
border: 1px solid #f0f4fe;
border-top: 0;
display: flex;
align-items: center;
position: relative;
.title {
font-size: 14px;
font-weight: 400;
color: #6f6f6f;
margin-left: 22px;
}
.btn {
position: absolute;
// background-color: red;
left: 550px;
.btno {
width: 73px;
height: 23px;
border-radius: 4px;
top: -12px;
border: 0;
color: #ffffff;
background: #5dc988;
position: absolute;
z-index: 999;
}
.btnoo {
width: 73px;
height: 23px;
border-radius: 4px;
top: -12px;
border: 0;
color: #ffffff;
background: #5dc988;
position: absolute;
z-index: 998;
}
.btnt {
width: 73px;
height: 23px;
border-radius: 4px;
top: -12px;
border: 0;
position: absolute;
background: #f2f6fc;
color: #5dc988;
z-index: 999;
}
.btntt {
width: 73px;
height: 23px;
border-radius: 4px;
top: -12px;
border: 0;
position: absolute;
background: #f2f6fc;
color: #5dc988;
z-index: 998;
}
}
}
}
.i {
display: none;
}
}
}
}
}
</style>

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

@@ -291,23 +291,23 @@
<div class="inname">阶段名称：</div>
</div>
<div class="in">
<a-input v-model:value="valueE" show-count :maxlength="20" placeholder="请输入阶段名称" />
<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="in">
<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 #387DF7;border-radius: 4px;color: #387DF7;background-color: #FFFFFF"
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 #388BE1;border-radius: 4px;color: #FFFFFF;background-color: #388BE1"
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>
@@ -791,7 +791,7 @@ export default {
border-radius: 8px;
// height: 120%;
width: 384px;
height: 40px;
height: 88px;
}
.addstage {
.ant-modal {
@@ -806,7 +806,7 @@ export default {
.ant-input-textarea-show-count::after {
position: absolute;
right: 10px;
bottom: 10px;
bottom: 5px;
}
}
}

1
src/views/projectcenter/TaskPage.vue
View File

@@ -479,6 +479,7 @@
}
.progress {
width: 168px;
margin-left: 10px;
margin-right: 50px;
flex-grow: 1;
.progresstext {

2
src/views/research/ManagePage.vue
View File

@@ -209,7 +209,7 @@ export default {
font-weight: 500;
}
.messagebox {
width: 100%;
//width: 100%;
//display: flex;
margin-top: 20px;
margin-left: 38px;

28
src/views/research/ResearchAdd.vue
View File

@@ -64,7 +64,7 @@
<img class="pictureimg" src="../../assets/images/research/picture.png"/>
<div class="picturename">图片名称1.jpg</div>
<img
style="width: 20px; height: 20px;position: absolute;right: 0;top:0"
style="cursor: pointer; width: 20px; height: 20px;position: absolute;right: 0;top:0"
src="../../assets/images/basicinfo/close.png"
/>
</div>
@@ -91,15 +91,16 @@
<div class="scoretext">非常满意</div>
<div class="number">
<a-button class="btn" style="margin-left:10px">1</a-button>
<a-button class="btn">2</a-button>
<a-button class="btn">3</a-button>
<a-button class="btn">4</a-button>
<a-button class="btn">5</a-button>
<a-button class="btn">6</a-button>
<a-button class="btn">7</a-button>
<a-button class="btn">8</a-button>
<a-button class="btn">9</a-button>
<a-button class="btn" style="margin-right: 10px;">10</a-button>
<a-button class="btn">2</a-button>
<a-button class="btn">3</a-button>
<a-button class="btn">4</a-button>
<a-button class="btn">5</a-button>
<a-button class="btn">6</a-button>
<a-button class="btn">7</a-button>
<a-button class="btn">8</a-button>
<a-button class="btn">9</a-button>
<a-button class="btn" style="display: flex;align-items:center;margin-right: 10px;justify-content: center">10</a-button>
</div>
<div class="scoretext">非常不满意</div>
</div>
@@ -181,6 +182,7 @@
border: 1px solid #D7E5FD;
border-radius: 5px;
margin: 0 10px;
padding: 5px;
.btn {
border: 1px solid #56A3F9;
border-radius: 5px;
@@ -214,7 +216,8 @@
display:flex;
}
.delete {
margin-top: 27px;
cursor: pointer;
margin-top: 32px;
margin-left: 20px;
float: right;
color: #4EA6FF;
@@ -225,7 +228,7 @@
// background-color: lightcoral;
display: flex;
margin-top: 20px;
align-items: center;
//align-items: center;
//height: 40px;
// border: 1px solid black;
.namebox {
@@ -248,6 +251,7 @@
margin-left: 14px;
flex: 1;
.addimg {
cursor:pointer;
color: rgba(78, 166, 255, 1);
font-size: 14px;
}

187
src/views/system/SystemManage.vue
View File

@@ -21,195 +21,30 @@
添加投票
</div>
<div>
<a-drawer
v-model:visible="visible"
class="drawerStyle"
style="color: red"
width="80%"
title="添加投票"
placement="right"
@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="closeDrawer"
/>
</div>
<div class="contentMain">
<!-- 投票名称 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">投票名称：</div>
</div>
<div style="width: 424px">
<a-input v-model:value="value" placeholder="请输入投票名称" />
</div>
</div>
<!-- 投票名称 -->
<!-- 创建投票 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">创建投票：</div>
</div>
<div class="votebtn">创建投票</div>
</div>
<!-- 创建投票 -->
<!-- 起止时间 -->
<div class="vote">
<div class="votebox">
<div class="voteimg"></div>
<div class="votename">起止时间：</div>
</div>
<div class="votedate">
<a-range-picker />
</div>
</div>
<!-- 起止时间 -->
<!-- 基础投票数 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">基础投票数：</div>
</div>
<div>
<div class="votebtn">点击上传</div>
<div class="voteclassify">支持：xls.xlsx</div>
</div>
</div>
<!-- 基础投票数 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea
:rows="4"
placeholder="请输入投票说明"
:maxlength="6"
/>
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea
:rows="4"
placeholder="请输入投票说明"
:maxlength="6"
/>
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea
:rows="4"
placeholder="请输入投票说明"
:maxlength="6"
/>
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea
:rows="4"
placeholder="请输入投票说明"
:maxlength="6"
/>
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea
:rows="4"
placeholder="请输入投票说明"
:maxlength="6"
/>
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea
:rows="4"
placeholder="请输入投票说明"
:maxlength="6"
/>
</div>
</div>
<!-- 投票说明 -->
</div>
</div>
</a-drawer>
<add-vote v-model:addvoteVisible="visible" />
</div>
</div>
</template>
<script>
import { reactive, toRefs } from "vue";
import AddVote from "../../components/drawers/AddVote";
export default {
name: "SystemManage",
components: {
AddVote,
},
setup() {
const state = reactive({
visible: true,
visible: false,
});
const afterVisibleChange = (bool) => {
console.log("visible", bool);
};
const showDrawer = () => {
state.visible = true;
};
const closeDrawer = () => {
state.visible = false;
};
return {
...toRefs(state),
afterVisibleChange,
showDrawer,
closeDrawer,
};
},
};
@@ -217,6 +52,14 @@ export default {
<style lang="scss">
.systemManage {
width: 100%;
.ant-input-textarea-show-count {
position: relative;
}
.ant-input-textarea-show-count::after {
position: absolute;
right: 0px;
bottom: 0px;
}
}
.drawerStyle {
.drawerMain {