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;
display: flex;
overflow-y: scroll;
// display: flex;
// flex: 1 1 auto;
width: calc(100% - 40px);
// margin-bottom: 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;
}
//表格下拉框-------------------------------------------
//抽屉--------------------------------------------------------
.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: "管理",
href: "",
},
];
}
if (n === "/certificatecenter" || n === "/CertificateCenter") {
state.list = [
{
name: "证书中心",
},
];
}
if (n === "/systemmanage" || n === "/SystemManage") {

View File

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

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

View File

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