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

feat:新增二维码弹窗

Browse Source
This commit is contained in:
dongwug
2022-10-13 17:14:07 +08:00
parent d4fb59f123
commit adc6191e28
1 changed files with 138 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -772,7 +772,7 @@
</div>
</div>
</a-modal>
<!-- 面授课程管理查看详情页面 -->
<!-- 操作管理面授课程管理查看详情页面 -->
<!-- 操作授权页面 -->
<a-modal
v-model:visible="gpm_hs"
@@ -866,7 +866,7 @@
</div>
</div>
</div>
</a-modal>
</a-modal>
<!--操作授权页面 -->
<!--开课页面 -->
<a-modal
@@ -1265,6 +1265,32 @@
</div>
</a-modal>
<!--新建开课学员管理页面页面 -->
<!--新建二维码页面 -->
<a-modal v-model:visible="QR_hs" :footer="null" :closable="closableQR" style="margin-top: 400px">
<div
class="QR"
:style="{ display: QR_hs ? 'block' : 'none' }"
>
<div class="qr_header"></div>
<div class="qr_main">
<div class="qrm_header">
<div class="qr_icon"></div>
<span>二维码</span>
<div class="close_exit" @click="qr_exit"></div>
</div>
<div class="qrm_body"><div class="QR_img"></div></div>
<div class="qrm_btnbox">
<div class="qrm_btn btn1">
<div class="btnText">取消</div>
</div>
<div class="qrm_btn btn2">
<div class="btnText" @click="qr_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!--新建二维码页面 -->
</div>
</template>
<script>
@@ -1933,6 +1959,8 @@ export default defineComponent({
stm_hs: false,
cstm_hs: false,
sm_hs: false,
QR_hs:false,
closableQR: false,
value:"",
valueE:"",
});
@@ -2176,6 +2204,17 @@ export default defineComponent({
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option
value="二维码"
label="二维码"
style="padding-left:35px"
>
<div
onClick={() => {
state.QR_hs = true;
}}
>二维码</div>
</a-select-option>
<a-select-option
value="复制"
label="复制"
@@ -2573,6 +2612,9 @@ export default defineComponent({
state.bs_hs = false;
state.valueE = "";
}
const qr_exit = () => {
state.QR_hs = false;
}
return {
onftvalue,
current,
@@ -2609,6 +2651,7 @@ export default defineComponent({
cstm_exit,
sm_exit,
clear_valueE,
qr_exit,
};
},
});
@@ -2775,7 +2818,6 @@ export default defineComponent({
}
}
}
.modalStyle {
.ant-modal{
.modalHeader {
@@ -3091,7 +3133,7 @@ export default defineComponent({
}
}
}
}
}
.createschooltime {
z-index: 999;
width: 679px;
@@ -3205,6 +3247,98 @@ export default defineComponent({
}
}
}
.ant-modal{
.ant-modal-content{
width:479px !important;
.ant-modal-body{
.QR{
z-index: 999;
width: 100%;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
position: absolute;
left: 50%;
top: 10%;
transform: translate(-50%, -50%);
.qr_header {
position: absolute;
width: calc(100%);
height: 40px;
background: linear-gradient(
rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%
);
}
.qr_main {
width: 100%;
position: relative;
.qrm_header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
.qr_icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/add1.png);
background-size: 100% 100%;
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
}
.qrm_body{
width: 100%;
.QR_img{
width:176px;
height:176px;
margin:1px auto;
background-color: red;
}
}
.qrm_btnbox{
display:flex;
margin:30px auto;
justify-content: center;
.qrm_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
}
}
}
.modalStyle {
.ant-modal{
.modalHeader {