This commit is contained in:
songwc
2022-10-11 15:32:46 +08:00
10 changed files with 1908 additions and 1324 deletions

View File

@@ -76,6 +76,8 @@ export default defineComponent({
// flex-shrink: 0; // flex-shrink: 0;
display: flex; display: flex;
overflow-y: scroll; overflow-y: scroll;
// display: flex;
// flex: 1 1 auto;
width: calc(100% - 40px); width: calc(100% - 40px);
// margin-bottom: 20px; // margin-bottom: 20px;
margin: 0px 20px 20px 20px; margin: 0px 20px 20px 20px;

Binary file not shown.

After

Width:  |  Height:  |  Size: 787 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 596 B

View File

@@ -192,3 +192,73 @@ display: none;
width: 100px !important; 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;
}
}
}
//弹窗--------------------------------------------------------

View File

@@ -144,7 +144,15 @@ export default {
{ {
name: "管理", name: "管理",
href: "", href: "",
},
];
} }
if (n === "/certificatecenter" || n === "/CertificateCenter") {
state.list = [
{
name: "证书中心",
},
]; ];
} }
if (n === "/systemmanage" || n === "/SystemManage") { if (n === "/systemmanage" || n === "/SystemManage") {

View File

@@ -144,7 +144,8 @@
src="../assets/images/navleft/certificate.png" src="../assets/images/navleft/certificate.png"
/> />
</div> </div>
<span>证书中心</span>
<router-link to="/certificatecenter">证书中心</router-link>
</a-menu-item> </a-menu-item>
<a-menu-item key="sub9" @titleClick="titleClick"> <a-menu-item key="sub9" @titleClick="titleClick">
<div class="imgBox"> <div class="imgBox">
@@ -293,6 +294,13 @@ export default {
selectedKeys: "sub3-2", selectedKeys: "sub3-2",
pagename: "课程管理", pagename: "课程管理",
}, },
{
href: "/certificatecenter",
openKeys: "sub8",
selectedKeys: "sub8",
pagename: "证书中心",
},
{ {
href: "/systemmanage", href: "/systemmanage",
openKeys: "sub9", openKeys: "sub9",

View File

@@ -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

View File

@@ -61,7 +61,6 @@
<div class="search"></div> <div class="search"></div>
<div class="btnText">重置</div> <div class="btnText">重置</div>
</div> </div>
<router-link to="/leveladddetail"> <router-link to="/leveladddetail">
<div class="btn btn3" @click="handleOut"> <div class="btn btn3" @click="handleOut">
<div class="search"></div> <div class="search"></div>
@@ -176,7 +175,6 @@
><span style="color: #4ea6ff">1</span><span>-</span ><span style="color: #4ea6ff">1</span><span>-</span
><span style="color: #4ea6ff">4</span><span>关内容</span> ><span style="color: #4ea6ff">4</span><span>关内容</span>
</div> </div>
<br /> <br />
</div> </div>
</div> </div>
@@ -262,7 +260,6 @@
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { ref, reactive, toRefs } from "vue"; import { ref, reactive, toRefs } from "vue";
export default { export default {
@@ -357,7 +354,6 @@ export default {
}, },
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.clearfix:before, .clearfix:before,
.clearfix:after { .clearfix:after {
@@ -440,7 +436,6 @@ export default {
margin-top: 5px; margin-top: 5px;
margin-right: 60px; margin-right: 60px;
} }
.more { .more {
position: relative; position: relative;
margin-right: 30px; margin-right: 30px;
@@ -496,12 +491,10 @@ export default {
.pub { .pub {
margin-right: 10px; margin-right: 10px;
} }
.more { .more {
margin-right: 10px; margin-right: 10px;
} }
} }
.more:hover .moreArrow { .more:hover .moreArrow {
background-image: url("../../assets/images/navtop/up.png"); background-image: url("../../assets/images/navtop/up.png");
} }
@@ -510,7 +503,6 @@ export default {
} }
} }
} }
.split { .split {
width: 100%; width: 100%;
height: 20px; height: 20px;
@@ -774,7 +766,6 @@ export default {
.onemain { .onemain {
margin-top: 20px; margin-top: 20px;
margin-left: 55px; margin-left: 55px;
color: #6f6f6f; color: #6f6f6f;
font-size: 14px; font-size: 14px;
.checkcon { .checkcon {

View File

@@ -25,7 +25,7 @@
v-model:visible="visible" v-model:visible="visible"
class="drawerStyle" class="drawerStyle"
style="color: red" style="color: red"
width="70%" width="80%"
title="添加投票" title="添加投票"
placement="right" placement="right"
@after-visible-change="afterVisibleChange" @after-visible-change="afterVisibleChange"
@@ -39,6 +39,7 @@
@click="closeDrawer" @click="closeDrawer"
/> />
</div> </div>
<div class="contentMain">
<!-- 投票名称 --> <!-- 投票名称 -->
<div class="vote"> <div class="vote">
<div class="votebox"> <div class="votebox">
@@ -103,6 +104,82 @@
</div> </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>
</div> </div>
</a-drawer> </a-drawer>
</div> </div>
@@ -142,21 +219,7 @@ export default {
width: 100%; width: 100%;
} }
.drawerStyle { .drawerStyle {
.ant-drawer-content-wrapper {
max-width: 1000px;
.ant-drawer-header {
display: none !important;
}
.ant-drawer-body {
padding: 0;
}
}
.drawerMain { .drawerMain {
min-width: 600px;
margin: 0px 32px 0px 32px;
overflow-x: scroll;
display: flex;
flex-direction: column;
.header { .header {
height: 73px; height: 73px;
border-bottom: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8;
@@ -171,6 +234,7 @@ export default {
margin-left: 24px; margin-left: 24px;
} }
} }
.contentMain {
.vote { .vote {
display: flex; display: flex;
align-items: center; align-items: center;
@@ -222,4 +286,5 @@ export default {
} }
} }
} }
}
</style> </style>