mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-09 02:46:45 +08:00
Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage
This commit is contained in:
岳佳鑫
@@ -34,6 +34,8 @@ See [Configuration Reference](https://cli.vuejs.org/config/).
|
||||
|
||||
```
|
||||
LearningPath.vue:学习路径页面
|
||||
LevelAdd.vue:关卡页面
|
||||
LevelAddDetail.vue:创建关卡页面
|
||||
|
||||
```
|
||||
|
||||
|
||||
@@ -76,6 +76,8 @@ export default defineComponent({
|
||||
// flex-shrink: 0;
|
||||
display: flex;
|
||||
overflow-y: scroll;
|
||||
// display: flex;
|
||||
// flex: 1 1 auto;
|
||||
width: calc(100% - 40px);
|
||||
// margin-bottom: 20px;
|
||||
margin: 0px 20px 20px 20px;
|
||||
|
||||
BIN
src/assets/images/basicinfo/add.png
Normal file
BIN
src/assets/images/basicinfo/add.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 787 B |
BIN
src/assets/images/basicinfo/close22.png
Normal file
BIN
src/assets/images/basicinfo/close22.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 596 B |
BIN
src/assets/images/coursewareManage/asterisk.png
Normal file
BIN
src/assets/images/coursewareManage/asterisk.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 360 B |
BIN
src/assets/images/coursewareManage/close.png
Normal file
BIN
src/assets/images/coursewareManage/close.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 695 B |
BIN
src/assets/images/coursewareManage/down.png
Normal file
BIN
src/assets/images/coursewareManage/down.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 199 B |
BIN
src/assets/images/coursewareManage/enclosure.png
Normal file
BIN
src/assets/images/coursewareManage/enclosure.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 628 B |
BIN
src/assets/images/coursewareManage/export.png
Normal file
BIN
src/assets/images/coursewareManage/export.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/images/coursewareManage/export1.png
Normal file
BIN
src/assets/images/coursewareManage/export1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 372 B |
BIN
src/assets/images/coursewareManage/givepower.png
Normal file
BIN
src/assets/images/coursewareManage/givepower.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 489 B |
BIN
src/assets/images/coursewareManage/scht.png
Normal file
BIN
src/assets/images/coursewareManage/scht.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 501 B |
BIN
src/assets/images/coursewareManage/stum.png
Normal file
BIN
src/assets/images/coursewareManage/stum.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 469 B |
BIN
src/assets/images/coursewareManage/up.png
Normal file
BIN
src/assets/images/coursewareManage/up.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 203 B |
BIN
src/assets/images/leveladd/1.png
Normal file
BIN
src/assets/images/leveladd/1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
BIN
src/assets/images/leveladd/2.png
Normal file
BIN
src/assets/images/leveladd/2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
BIN
src/assets/images/leveladd/3.png
Normal file
BIN
src/assets/images/leveladd/3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
@@ -192,3 +192,73 @@ display: none;
|
||||
width: 100px !important;
|
||||
}
|
||||
//表格下拉框-------------------------------------------
|
||||
|
||||
//抽屉--------------------------------------------------------
|
||||
.drawerStyle {
|
||||
.ant-drawer-content-wrapper {
|
||||
max-width: 1050px;
|
||||
.ant-drawer-header {
|
||||
display: none !important;
|
||||
}
|
||||
.ant-drawer-body {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.drawerMain {
|
||||
min-width: 700px;
|
||||
margin: 0px 32px 0px 32px;
|
||||
overflow-x: scroll;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
||||
}}
|
||||
//抽屉--------------------------------------------------------
|
||||
|
||||
//弹窗--------------------------------------------------------
|
||||
.modalStyle {
|
||||
height: 100%;
|
||||
.ant-modal {
|
||||
height: calc(100% - 200px);
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
// overflow-y: scroll;
|
||||
min-width: 900px;
|
||||
max-width: 1300px;
|
||||
padding: 0;
|
||||
.ant-modal-content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.ant-modal-body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.ant-modal-header {
|
||||
display: none;
|
||||
}
|
||||
.ant-modal-body {
|
||||
padding: 0px;
|
||||
}
|
||||
.modalHeader {
|
||||
width: 100%;
|
||||
height: 68px;
|
||||
background: linear-gradient(
|
||||
0deg,
|
||||
rgba(78, 166, 255, 0) 0%,
|
||||
rgba(78, 166, 255, 0.2) 100%
|
||||
);
|
||||
}
|
||||
.modalMain {
|
||||
height: 0px;
|
||||
flex: 1 1 auto;
|
||||
overflow-y: scroll;
|
||||
margin-top: 7px;
|
||||
margin: 0px 52px;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
//弹窗--------------------------------------------------------
|
||||
@@ -144,7 +144,15 @@ export default {
|
||||
{
|
||||
name: "管理",
|
||||
href: "",
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
if (n === "/certificatecenter" || n === "/CertificateCenter") {
|
||||
state.list = [
|
||||
{
|
||||
name: "证书中心",
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/systemmanage" || n === "/SystemManage") {
|
||||
|
||||
@@ -144,7 +144,8 @@
|
||||
src="../assets/images/navleft/certificate.png"
|
||||
/>
|
||||
</div>
|
||||
<span>证书中心</span>
|
||||
|
||||
<router-link to="/certificatecenter">证书中心</router-link>
|
||||
</a-menu-item>
|
||||
<a-menu-item key="sub9" @titleClick="titleClick">
|
||||
<div class="imgBox">
|
||||
@@ -293,6 +294,13 @@ export default {
|
||||
selectedKeys: "sub3-2",
|
||||
pagename: "课程管理",
|
||||
},
|
||||
{
|
||||
href: "/certificatecenter",
|
||||
openKeys: "sub8",
|
||||
selectedKeys: "sub8",
|
||||
pagename: "证书中心",
|
||||
},
|
||||
|
||||
{
|
||||
href: "/systemmanage",
|
||||
openKeys: "sub9",
|
||||
|
||||
@@ -0,0 +1,330 @@
|
||||
<template>
|
||||
<div class="certificateCenter">
|
||||
<div
|
||||
style="
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
background: #388be1;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
"
|
||||
@click="showModal"
|
||||
>
|
||||
新建面授课
|
||||
</div>
|
||||
<div>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
title="Title"
|
||||
@ok="closeModal"
|
||||
:footer="null"
|
||||
:closable="false"
|
||||
wrapClassName="modalStyle"
|
||||
width="80%"
|
||||
>
|
||||
<div class="modalHeader">
|
||||
<div class="headerLeft">
|
||||
<img
|
||||
style="width: 17px; height: 18px; margin-right: 8px"
|
||||
src="../../assets/images/basicinfo/add.png"
|
||||
/>
|
||||
<span class="headerLeftText">新建面授课</span>
|
||||
</div>
|
||||
<div style="margin-right: 57px; cursor: pointer">
|
||||
<img
|
||||
style="width: 22px; height: 22px"
|
||||
src="../../assets/images/basicinfo/close22.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modalMain">
|
||||
<div class="title">课程信息</div>
|
||||
<div style="display: flex; margin-top: 10px">
|
||||
<div class="modalMainLeft">
|
||||
<!-- 投票名称 -->
|
||||
<div class="vote">
|
||||
<div class="votebox">
|
||||
<img
|
||||
class="voteimg"
|
||||
src="../../assets/images/basicinfo/asterisk.png"
|
||||
/>
|
||||
<div class="votename">投票名称：</div>
|
||||
</div>
|
||||
<div class="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<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="modalMainInp">
|
||||
<a-input v-model:value="value" placeholder="请输入投票名称" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 投票名称 -->
|
||||
</div>
|
||||
<div class="modalMainLeft">
|
||||
<!-- 投票名称 -->
|
||||
<div class="vote">
|
||||
<div class="votebox">
|
||||
<img
|
||||
class="voteimg"
|
||||
src="../../assets/images/basicinfo/asterisk.png"
|
||||
/>
|
||||
<div class="votename">投票名称：</div>
|
||||
</div>
|
||||
<div class="modalMainInp">
|
||||
<a-input v-model:value="value" placeholder="请输入投票名称" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 投票名称 -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a-modal>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs, onMounted, onUnmounted } from "vue";
|
||||
|
||||
export default {
|
||||
name: "CertificateCenter",
|
||||
setup() {
|
||||
const state = reactive({
|
||||
visible: true,
|
||||
loading: false,
|
||||
screenHeight: document.body.clientHeight, // 屏幕高度
|
||||
});
|
||||
|
||||
const afterVisibleChange = (bool) => {
|
||||
console.log("visible", bool);
|
||||
};
|
||||
|
||||
const showModal = () => {
|
||||
state.visible = true;
|
||||
};
|
||||
const closeModal = () => {
|
||||
state.visible = false;
|
||||
};
|
||||
const getMousePosition = () => {
|
||||
state.screenHeight = document.body.clientHeight;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// console.log("11111", 1);
|
||||
window.addEventListener("resize", getMousePosition, false);
|
||||
// judgeUrl();
|
||||
});
|
||||
onUnmounted(() => {
|
||||
window.removeEventListener("resize", getMousePosition, false);
|
||||
});
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
afterVisibleChange,
|
||||
showModal,
|
||||
closeModal,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.certificateCenter {
|
||||
width: 100%;
|
||||
}
|
||||
.modalStyle {
|
||||
.ant-modal {
|
||||
.modalHeader {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.headerLeft {
|
||||
margin-left: 27px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.headerLeftText {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.modalMain {
|
||||
.title {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #4f5156;
|
||||
line-height: 36px;
|
||||
}
|
||||
.modalMainLeft {
|
||||
width: 50%;
|
||||
height: 300px;
|
||||
padding-left: 35px;
|
||||
padding-right: 44px;
|
||||
// background-color: red;
|
||||
|
||||
.vote {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 30px;
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.modalMainInp {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.modalMainRight {
|
||||
width: 50%;
|
||||
height: 300px;
|
||||
background-color: pink;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -113,7 +113,12 @@
|
||||
</div>
|
||||
<div class="inname">路径图名称</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" />
|
||||
<a-input
|
||||
v-model:value="valueE"
|
||||
maxlength="20"
|
||||
style="border-radius: 4px"
|
||||
/>
|
||||
<div class="showcount">{{ valuei.length }}/20</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bac">
|
||||
@@ -140,7 +145,8 @@
|
||||
<div class="info">
|
||||
<div class="inname">路径说明</div>
|
||||
<div class="in">
|
||||
<a-textarea v-model:value="valuei" />
|
||||
<a-textarea v-model:value="valuei" maxlength="150" />
|
||||
<div class="showcount">{{ valuei.length }}/150</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn">
|
||||
@@ -228,25 +234,25 @@ export default {
|
||||
imgData: [
|
||||
{
|
||||
id: 1,
|
||||
source: require("../../assets/px.jpg"),
|
||||
source: require("../../assets/images/leveladd/1.png"),
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
source: require("../../assets/px.jpg"),
|
||||
source: require("../../assets/images/leveladd/2.png"),
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
source: require("../../assets/px.jpg"),
|
||||
source: require("../../assets/images/leveladd/3.png"),
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
tableDataTotal: 100,
|
||||
pageSize: 10,
|
||||
value1: "",
|
||||
value2: ref(),
|
||||
valueE: ref(" "),
|
||||
valueEE: ref(" "),
|
||||
valuei: ref(" "),
|
||||
valueE: "",
|
||||
valueEE: "",
|
||||
valuei: "",
|
||||
});
|
||||
const tableDataFunc = () => {
|
||||
const columns = [
|
||||
@@ -314,38 +320,38 @@ export default {
|
||||
key: "opacation",
|
||||
width: 200,
|
||||
align: "center",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: (text) => {
|
||||
console.log(text);
|
||||
return (
|
||||
<div class="opa">
|
||||
<div class="opacation">
|
||||
<span class={text.record.haspub ? "activecls" : "errorCls"}>
|
||||
发布
|
||||
</span>
|
||||
<span style={{ "margin-left": "25px" }}>编辑</span>
|
||||
<router-link to="/leveladd">
|
||||
<span style={{ "margin-left": "25px" }}>关卡</span>
|
||||
</router-link>
|
||||
// scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
// customRender: (text) => {
|
||||
// console.log(text);
|
||||
// return (
|
||||
// <div class="opa">
|
||||
// <div class="opacation">
|
||||
// <span class={text.record.haspub ? "activecls" : "errorCls"}>
|
||||
// 发布
|
||||
// </span>
|
||||
// <span style={{ "margin-left": "25px" }}>编辑</span>
|
||||
// <router-link to="/leveladd">
|
||||
// <span style={{ "margin-left": "25px" }}>关卡</span>
|
||||
// </router-link>
|
||||
|
||||
<span style={{ "margin-left": "25px" }} class="more">
|
||||
<span>授权</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
// <div style={{ "margin-left": "25px" }} class="more">
|
||||
// <span>授权</span>
|
||||
// <div class="moreArrow"></div>
|
||||
// <div class="moreItems"></div>
|
||||
// </div>
|
||||
|
||||
<span
|
||||
style={{ "margin-left": "21px", "margin-right": "30px" }}
|
||||
class="more"
|
||||
>
|
||||
<span>更多</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
// <div
|
||||
// style={{ "margin-left": "21px", "margin-right": "30px" }}
|
||||
// class="more"
|
||||
// >
|
||||
// <span>更多</span>
|
||||
// <div class="moreArrow"></div>
|
||||
// <div class="moreItems"></div>
|
||||
// </div>
|
||||
// </div>
|
||||
// </div>
|
||||
// );
|
||||
// },
|
||||
},
|
||||
];
|
||||
return columns;
|
||||
@@ -366,6 +372,102 @@ export default {
|
||||
const chooseImg = (id) => {
|
||||
console.log(id);
|
||||
};
|
||||
const getTableDate = () => {
|
||||
let data = state.tableData;
|
||||
data.map((value) => {
|
||||
{
|
||||
//单层项目
|
||||
value.opacation = (
|
||||
<div class="operation">
|
||||
<div class="nSelect">
|
||||
{value.state === "草稿" ? (
|
||||
<div class="fb">
|
||||
<div class="jc">发布</div>
|
||||
<div class="jc">编辑</div>
|
||||
</div>
|
||||
) : (
|
||||
<div></div>
|
||||
)}
|
||||
{value.state === "已发布" ? (
|
||||
<div class="fb">
|
||||
<div class="jc">编辑</div>
|
||||
</div>
|
||||
) : (
|
||||
<div></div>
|
||||
)}
|
||||
{value.state === "已停用" ? (
|
||||
<div class="fb">
|
||||
<div class="jc">复制</div>
|
||||
</div>
|
||||
) : (
|
||||
<div></div>
|
||||
)}
|
||||
</div>
|
||||
<div class="tableSelect">
|
||||
<router-link to="/leveladd">
|
||||
<div class="g1">关卡</div>
|
||||
</router-link>
|
||||
|
||||
<a-select
|
||||
style="width: 50px;margin-top:2px;margin-left:25px"
|
||||
value="授权"
|
||||
// options={state.projectNameList}
|
||||
dropdownClassName="tabledropdown"
|
||||
>
|
||||
<a-select-option value="权限名单" label="权限名单">
|
||||
<div>权限名单</div>
|
||||
</a-select-option>
|
||||
<a-select-option value="归属权" label="归属权">
|
||||
<div
|
||||
onClick={() => {
|
||||
console.log("点击了");
|
||||
}}
|
||||
>
|
||||
归属权
|
||||
</div>
|
||||
</a-select-option>
|
||||
<a-select-option value="查看权" label="查看权">
|
||||
<div>查看权</div>
|
||||
</a-select-option>
|
||||
<a-select-option value="管理权" label="管理权">
|
||||
<div>管理权</div>
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
<a-select
|
||||
style="width: 50px;margin-top:2px;margin-left:25px"
|
||||
value="更多"
|
||||
// options={state.projectNameList}
|
||||
dropdownClassName="tabledropdown"
|
||||
>
|
||||
<a-select-option
|
||||
value="复制"
|
||||
label="复制"
|
||||
style="padding-left:35px"
|
||||
>
|
||||
<div>复制</div>
|
||||
</a-select-option>
|
||||
<a-select-option
|
||||
value="取消"
|
||||
label="取消"
|
||||
style="padding-left:35px"
|
||||
>
|
||||
<div
|
||||
onClick={() => {
|
||||
console.log("点击了");
|
||||
}}
|
||||
>
|
||||
取消
|
||||
</div>
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
state.tableData = data;
|
||||
};
|
||||
getTableDate();
|
||||
return {
|
||||
...toRefs(state),
|
||||
selectProjectName,
|
||||
@@ -505,6 +607,85 @@ export default {
|
||||
bottom: 20px;
|
||||
}
|
||||
}
|
||||
.operation {
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
.nSelect {
|
||||
.fb {
|
||||
display: flex;
|
||||
.jc {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableSelect {
|
||||
margin-right: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: right;
|
||||
.g1 {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
// .operation {
|
||||
// font-size: 14px;
|
||||
// font-weight: 400;
|
||||
// color: #4ea6ff;
|
||||
// // line-height: 36px;
|
||||
// .operation1 {
|
||||
// margin-left: 21px;
|
||||
// width: 28px;
|
||||
// display: inline-block;
|
||||
// }
|
||||
// .operation3 {
|
||||
// margin-left: 21px;
|
||||
// width: 70px;
|
||||
// display: inline-block;
|
||||
// text-align: center;
|
||||
// }
|
||||
// .more {
|
||||
// width: 50px;
|
||||
// display: inline-block;
|
||||
// margin-left: 21px;
|
||||
// position: relative;
|
||||
// text-align: left;
|
||||
// // z-index: 99999;
|
||||
// .moreArrow {
|
||||
// width: 13px;
|
||||
// height: 7px;
|
||||
// display: inline-block;
|
||||
// background-image: url("../../assets/images/navtop/down.png");
|
||||
// background-size: 100%;
|
||||
// margin: 2px;
|
||||
// margin-left: 7px;
|
||||
// }
|
||||
// .moreItems {
|
||||
// width: 80px;
|
||||
// padding: 5px;
|
||||
// display: none;
|
||||
// background: #ffffff;
|
||||
// box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
|
||||
// border-radius: 3px;
|
||||
// border: 0px solid #dcdcdc;
|
||||
// position: absolute;
|
||||
// left: 0px;
|
||||
// top: 28px;
|
||||
// z-index: 100;
|
||||
// text-align: center;
|
||||
// }
|
||||
// }
|
||||
// .more:hover .moreArrow {
|
||||
// background-image: url("../../assets/images/navtop/up.png");
|
||||
// }
|
||||
// .more:hover .moreItems {
|
||||
// display: block;
|
||||
// }
|
||||
// }
|
||||
|
||||
.out {
|
||||
display: block;
|
||||
position: absolute;
|
||||
@@ -531,6 +712,7 @@ export default {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 27px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
.topc {
|
||||
color: #000000;
|
||||
@@ -567,12 +749,19 @@ export default {
|
||||
.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 {
|
||||
@@ -624,6 +813,7 @@ export default {
|
||||
.in {
|
||||
margin-left: 14px;
|
||||
width: 81%;
|
||||
position: relative;
|
||||
.ant-input {
|
||||
border-radius: 5px;
|
||||
// height: 120%;
|
||||
@@ -631,6 +821,12 @@ export default {
|
||||
height: 130px;
|
||||
resize: none;
|
||||
}
|
||||
.showcount {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
color: #c7cbd2;
|
||||
bottom: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
@@ -669,6 +865,7 @@ export default {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #4ea6ff;
|
||||
display: flex;
|
||||
// line-height: 36px;
|
||||
.activecls {
|
||||
display: inline-block;
|
||||
@@ -678,6 +875,7 @@ export default {
|
||||
}
|
||||
.more {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
.moreArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
@@ -697,8 +895,8 @@ export default {
|
||||
border: 0px solid #dcdcdc;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 18px;
|
||||
z-index: 100;
|
||||
top: 30px;
|
||||
z-index: 999;
|
||||
}
|
||||
}
|
||||
.more:hover .moreArrow {
|
||||
|
||||
@@ -61,7 +61,6 @@
|
||||
<div class="search"></div>
|
||||
<div class="btnText">重置</div>
|
||||
</div>
|
||||
|
||||
<router-link to="/leveladddetail">
|
||||
<div class="btn btn3" @click="handleOut">
|
||||
<div class="search"></div>
|
||||
@@ -120,11 +119,14 @@
|
||||
<div class="linee"></div>
|
||||
<div class="itright">
|
||||
<span class="te">编辑</span>
|
||||
<span class="more">
|
||||
<span class="te" style="margin-left: 20px">更多</span>
|
||||
<div class="more">
|
||||
<div class="te" style="margin-left: 20px">更多</div>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
<div class="moreItems">
|
||||
<div class="roleItem">复制</div>
|
||||
<div class="roleItem">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -173,7 +175,6 @@
|
||||
><span style="color: #4ea6ff">1</span><span>关-第</span
|
||||
><span style="color: #4ea6ff">4</span><span>关内容</span>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
</div>
|
||||
</div>
|
||||
@@ -259,7 +260,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, reactive, toRefs } from "vue";
|
||||
export default {
|
||||
@@ -354,7 +354,6 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
@@ -437,11 +436,12 @@ export default {
|
||||
margin-top: 5px;
|
||||
margin-right: 60px;
|
||||
}
|
||||
|
||||
.more {
|
||||
position: relative;
|
||||
margin-right: 30px;
|
||||
|
||||
height: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.moreArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
@@ -461,7 +461,7 @@ export default {
|
||||
border: 0px solid #dcdcdc;
|
||||
position: absolute;
|
||||
left: -48px;
|
||||
top: 28px;
|
||||
top: 30px;
|
||||
z-index: 100;
|
||||
.sammo {
|
||||
text-align: center;
|
||||
@@ -491,12 +491,10 @@ export default {
|
||||
.pub {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.more {
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.more:hover .moreArrow {
|
||||
background-image: url("../../assets/images/navtop/up.png");
|
||||
}
|
||||
@@ -505,7 +503,6 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
@@ -611,6 +608,7 @@ export default {
|
||||
}
|
||||
.Lbom {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
.item {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
@@ -680,13 +678,15 @@ export default {
|
||||
.itright {
|
||||
position: absolute;
|
||||
right: 45px;
|
||||
display: flex;
|
||||
.te {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.more {
|
||||
position: relative;
|
||||
height: 30px;
|
||||
display: flex;
|
||||
.moreArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
@@ -695,6 +695,7 @@ export default {
|
||||
background-size: 100%;
|
||||
margin: 2px;
|
||||
margin-left: 7px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.moreItems {
|
||||
width: 80px;
|
||||
@@ -706,8 +707,19 @@ export default {
|
||||
border: 0px solid #dcdcdc;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 18px;
|
||||
top: 20px;
|
||||
z-index: 100;
|
||||
.roleItem {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(79, 81, 86, 1);
|
||||
line-height: 36px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.roleItem:hover {
|
||||
color: #4ea6ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.more:hover .moreArrow {
|
||||
@@ -721,6 +733,7 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.Gcon {
|
||||
display: flex;
|
||||
.pad {
|
||||
@@ -753,7 +766,6 @@ export default {
|
||||
.onemain {
|
||||
margin-top: 20px;
|
||||
margin-left: 55px;
|
||||
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
.checkcon {
|
||||
|
||||
@@ -57,13 +57,21 @@
|
||||
class="img2"
|
||||
src="../../assets/images/leveladd/more.png"
|
||||
/>
|
||||
<div class="more">
|
||||
<span style="color: #7096e3">更多</span>
|
||||
<!-- <div class="more">
|
||||
<div style="color: #7096e3">更多</div>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems">
|
||||
<div class="sammo">撤回</div>
|
||||
<div class="sammo">复制</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="role">
|
||||
<div>更多</div>
|
||||
<div class="roleArrow"></div>
|
||||
<div class="roleItems">
|
||||
<div class="roleItem">复制</div>
|
||||
<div class="roleItem">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<img class="img2" src="../../assets/images/leveladd/back.png" />
|
||||
@@ -257,21 +265,86 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="draw" style="position: relative">
|
||||
<a-drawer
|
||||
v-model:visible="visible"
|
||||
class="custom-class"
|
||||
class="drawerStyle"
|
||||
title="关联项目"
|
||||
placement="right"
|
||||
width="50%"
|
||||
@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>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
const drawercolumns = [
|
||||
{
|
||||
title: "项目名称",
|
||||
dataIndex: "projectName",
|
||||
key: "projectName",
|
||||
width: 200,
|
||||
// align: "center",
|
||||
ellipsis: true,
|
||||
// scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
// customRender: (text, record) => {
|
||||
// console.log(text, record);
|
||||
// return <span>{text.text}</span>;
|
||||
// },
|
||||
},
|
||||
{
|
||||
title: "项目经理",
|
||||
dataIndex: "manager",
|
||||
key: "manager",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "time",
|
||||
key: "time",
|
||||
width: 180,
|
||||
align: "center",
|
||||
},
|
||||
];
|
||||
export default {
|
||||
name: "LevelAddDetail",
|
||||
setup() {
|
||||
@@ -301,23 +374,18 @@ export default {
|
||||
projectNameList2: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
value: "批量操作",
|
||||
label: "批量操作",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
value: "删除任务",
|
||||
label: "删除任务",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
value: "移动任务到关卡",
|
||||
label: "移动任务到关卡",
|
||||
},
|
||||
],
|
||||
level: [
|
||||
@@ -389,6 +457,101 @@ export default {
|
||||
checkedd: false,
|
||||
},
|
||||
],
|
||||
drawertableData: [
|
||||
{
|
||||
key: 1,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: "1-1",
|
||||
projectName: "管理者进阶-腾飞班",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: "1-1-1",
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
projectName: "管理者进阶",
|
||||
manager: "黄华 刘俊",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: "2-1",
|
||||
projectName: "管理者进阶-腾飞班",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
children: [
|
||||
{
|
||||
key: "2-1-1",
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
key: 3,
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 6,
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
{
|
||||
key: 7,
|
||||
projectName: "管理者进阶-腾飞班K1",
|
||||
manager: "黄华 刘俊",
|
||||
|
||||
creater: "毛继禹",
|
||||
time: "2022-07-20 14:00:03",
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 100,
|
||||
pageSize: 10,
|
||||
@@ -401,7 +564,7 @@ export default {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const showDrawer = () => {
|
||||
state.visible = true;
|
||||
state.visible = !state.visible;
|
||||
};
|
||||
const afterVisibleChange = (bool) => {
|
||||
console.log("visible", bool);
|
||||
@@ -513,6 +676,7 @@ export default {
|
||||
tableDataFunc,
|
||||
showDrawer,
|
||||
afterVisibleChange,
|
||||
drawercolumns,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -526,6 +690,82 @@ export default {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.drawerStyle {
|
||||
.ant-drawer-content-wrapper {
|
||||
max-width: 1000px;
|
||||
.ant-drawer-header {
|
||||
display: none !important;
|
||||
}
|
||||
.ant-drawer-body {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.drawerMain {
|
||||
min-width: 600px;
|
||||
margin: 0px 32px 0px 32px;
|
||||
overflow-x: scroll;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.header {
|
||||
height: 73px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// background-color: red;
|
||||
margin-bottom: 20px;
|
||||
.headerTitle {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
line-height: 25px;
|
||||
// margin-left: 24px;
|
||||
}
|
||||
}
|
||||
.drawerbox {
|
||||
margin: 20px 38px 30px;
|
||||
th {
|
||||
background-color: #eff4fc !important;
|
||||
}
|
||||
|
||||
.ant-table-tbody
|
||||
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
|
||||
> td {
|
||||
background: #f6f9fd;
|
||||
}
|
||||
}
|
||||
.btnn {
|
||||
height: 72px;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
|
||||
.btn1 {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
border: 1px solid #4ea6ff;
|
||||
border-radius: 8px;
|
||||
color: #4ea6ff;
|
||||
background-color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn2 {
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
background: #4ea6ff;
|
||||
border-radius: 8px;
|
||||
border: 0;
|
||||
margin-left: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.allCon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@@ -719,49 +959,51 @@ export default {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.more {
|
||||
.role {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #333330;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
margin-right: 30px;
|
||||
|
||||
.moreArrow {
|
||||
margin-right: 20px;
|
||||
.roleArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
display: inline-block;
|
||||
background-image: url("../../assets/images/navtop/down.png");
|
||||
margin-left: 8px;
|
||||
background-image: url(../../assets/images/navtop/down.png);
|
||||
background-size: 100%;
|
||||
margin: 2px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.moreItems {
|
||||
width: 110px;
|
||||
height: 80px;
|
||||
display: none;
|
||||
.roleItems {
|
||||
width: 109px;
|
||||
height: 90px;
|
||||
padding-top: 10px;
|
||||
background: #ffffff;
|
||||
box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
|
||||
// border-radius: 3px;
|
||||
border: 0px solid #dcdcdc;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
|
||||
position: absolute;
|
||||
left: -48px;
|
||||
top: 28px;
|
||||
z-index: 100;
|
||||
.sammo {
|
||||
top: 35px;
|
||||
right: 0px;
|
||||
text-align: center;
|
||||
margin-top: 12px;
|
||||
display: none;
|
||||
z-index: 100;
|
||||
}
|
||||
.sammo:hover {
|
||||
.roleItem {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(79, 81, 86, 1);
|
||||
line-height: 36px;
|
||||
}
|
||||
.roleItem:hover {
|
||||
color: #4ea6ff;
|
||||
}
|
||||
}
|
||||
.moreItems:hover {
|
||||
.role:hover .roleItems {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.more:hover .moreArrow {
|
||||
background-image: url("../../assets/images/navtop/up.png");
|
||||
}
|
||||
.more:hover .moreItems {
|
||||
display: block;
|
||||
.role:hover .roleArrow {
|
||||
background-image: url(../../assets/images/navtop/up.png);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -879,7 +1121,24 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
// .drawerbox {
|
||||
// // margin: 20px 38px 30px;
|
||||
// th.h {
|
||||
// background-color: #eff4fc !important;
|
||||
// }
|
||||
|
||||
// .ant-table-tbody
|
||||
// > tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
|
||||
// > td {
|
||||
// background: #f6f9fd;
|
||||
// }
|
||||
// }
|
||||
.draw {
|
||||
.drawerbox {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.opat {
|
||||
.opacationt {
|
||||
display: flex;
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
v-model:visible="visible"
|
||||
class="drawerStyle"
|
||||
style="color: red"
|
||||
width="70%"
|
||||
width="80%"
|
||||
title="添加投票"
|
||||
placement="right"
|
||||
@after-visible-change="afterVisibleChange"
|
||||
@@ -39,6 +39,7 @@
|
||||
@click="closeDrawer"
|
||||
/>
|
||||
</div>
|
||||
<div class="contentMain">
|
||||
<!-- 投票名称 -->
|
||||
<div class="vote">
|
||||
<div class="votebox">
|
||||
@@ -103,6 +104,82 @@
|
||||
</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>
|
||||
</div>
|
||||
@@ -142,21 +219,7 @@ export default {
|
||||
width: 100%;
|
||||
}
|
||||
.drawerStyle {
|
||||
.ant-drawer-content-wrapper {
|
||||
max-width: 1000px;
|
||||
.ant-drawer-header {
|
||||
display: none !important;
|
||||
}
|
||||
.ant-drawer-body {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.drawerMain {
|
||||
min-width: 600px;
|
||||
margin: 0px 32px 0px 32px;
|
||||
overflow-x: scroll;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.header {
|
||||
height: 73px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
@@ -171,6 +234,7 @@ export default {
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
.contentMain {
|
||||
.vote {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -222,4 +286,5 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user