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

feat:增加抽屉样式

Browse Source
This commit is contained in:
李晓鸽
2022-10-11 10:59:04 +08:00
parent e26fdbd49a
commit 6fea7a649a
5 changed files with 1512 additions and 1323 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/App.vue
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;

24
src/assets/scss/common.scss
View File

@@ -191,4 +191,26 @@ display: none;
.tabledropdown {
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;
}}
//抽屉--------------------------------------------------------

2502
src/views/courselibrary/CoursewareManage.vue
View File

File diff suppressed because it is too large Load Diff

10
src/views/learningpath/LevelAdd.vue
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>
@@ -173,7 +172,6 @@
><span style="color: #4ea6ff">1</span><span>关-第</span
><span style="color: #4ea6ff">4</span><span>关内容</span>
</div>
<br />
</div>
</div>
@@ -259,7 +257,6 @@
</div>
</div>
</template>
<script>
import { ref, reactive, toRefs } from "vue";
export default {
@@ -354,7 +351,6 @@ export default {
},
};
</script>
<style scoped lang="scss">
.clearfix:before,
.clearfix:after {
@@ -437,11 +433,9 @@ export default {
margin-top: 5px;
margin-right: 60px;
}
.more {
position: relative;
margin-right: 30px;
.moreArrow {
width: 13px;
height: 7px;
@@ -491,12 +485,10 @@ export default {
.pub {
margin-right: 10px;
}
.more {
margin-right: 10px;
}
}
.more:hover .moreArrow {
background-image: url("../../assets/images/navtop/up.png");
}
@@ -505,7 +497,6 @@ export default {
}
}
}
.split {
width: 100%;
height: 20px;
@@ -753,7 +744,6 @@ export default {
.onemain {
margin-top: 20px;
margin-left: 55px;
color: #6f6f6f;
font-size: 14px;
.checkcon {

297
src/views/system/SystemManage.vue
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,70 +39,147 @@
@click="closeDrawer"
/>
</div>
<!-- 投票名称 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">投票名称：</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 style="width: 424px">
<a-input v-model:value="value" placeholder="请输入投票名称" />
<!-- 投票名称 -->
<!-- 创建投票 -->
<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 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>
</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,53 +234,55 @@ export default {
margin-left: 24px;
}
}
.vote {
display: flex;
align-items: center;
margin-top: 32px;
margin-left: 20px;
.votebox {
width: 100px;
.contentMain {
.vote {
display: flex;
align-items: center;
justify-content: flex-end;
// background-color: pink;
.voteimg {
width: 10px;
height: 10px;
margin-right: 5px;
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;
}
}
.votename {
.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: #333333;
color: #ffffff;
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;
.voteclassify {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
margin-top: 16px;
}
.ant-picker {
width: 424px;
}
}
}
}