feat:二维码

src/views/projectcenter/TaskPage.vue

@@ -372,6 +372,7 @@
                               ? 'flex'
                               : 'none',
                         }"
+                        @click="showCopyModal"
                       >
                         二维码
                       </div>
@@ -1538,6 +1539,34 @@
       </a-modal>
     </div>
     <!-- 删除弹窗 -->
+    <!-- 面授管理二维码 -->
+    <a-modal
+      v-model:visible="copyModal"
+      :footer="null"
+      :closable="closeCopy"
+      wrapClassName="CopyModal"
+      centered="true"
+    >
+      <div class="delete">
+        <div class="del_header"></div>
+        <div class="del_main">
+          <div class="header">
+            <div class="icon"></div>
+            <span>面授管理</span>
+            <div class="close_exit" @click="closeCopyModal"></div>
+          </div>
+          <div class="body">
+            <div><img src="../../assets/images/taskpage/erweima.png"/></div>
+          </div>
+          <div class="footerr">
+            <div class="onload">下载二维码</div>
+            <div class="onloadpx">200*200</div>
+            <div class="onloadpx">400*400</div>
+            <div class="onloadpx">800*800</div>
+          </div>
+        </div>
+      </div>
+    </a-modal>
   </div>
 </template>
 <script>
@@ -1670,6 +1699,8 @@ export default {
       Changevisible: false, //学员换组
       edit_hs: false, //编辑弹窗
       delete_hs: false, //删除弹窗
+      copyModal: false, //面授二维码弹窗
+      closeCopy: false, //面授二维码关闭图标
       pubproject: false,
       stugroup: false,
       canclestu: false,
@@ -2233,6 +2264,12 @@ export default {
     const closeModal2 = () => {
       state.stugroup = false;
     };
+    const showCopyModal = () => {
+      state.copyModal = true;
+    };
+    const closeCopyModal = () => {
+      state.copyModal = false;
+    };
     const showFaceIn = () => {
       state.TaskFaceImpStuvisible = true;
     };
@@ -2484,6 +2521,8 @@ export default {
       closeModal1,
       showModal2,
       closeModal2,
+      showCopyModal,
+      closeCopyModal,
       showTime,
       showFace,
       showSubset,
@@ -2888,6 +2927,108 @@ export default {
   }
 }
 
+.CopyModal {
+  .ant-modal {
+    width: 532px !important;
+    height: 428px !important;
+    .ant-modal-content {
+      width: 532px !important;
+      height: 428px !important;
+      .ant-modal-body {
+        width: 532px !important;
+        height: 428px !important;
+        padding: 0 !important;
+        .delete {
+          z-index: 999;
+          width: 532px;
+          height: 428px;
+          background: #ffffff;
+          box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
+          border-radius: 4px;
+          // position: absolute;
+          // left: 50%;
+          // top: 10%;
+          // transform: translate(-50%, -50%);
+          .del_header {
+            position: absolute;
+            width: calc(100%);
+            height: 68px;
+            background: linear-gradient(
+              rgba(78, 166, 255, 0.2) 0%,
+              rgba(78, 166, 255, 0) 100%
+            );
+          }
+          .del_main {
+            width: 100%;
+            position: relative;
+            .header {
+              display: flex;
+              align-items: center;
+              padding-top: 20px;
+              padding-left: 26px;
+              font-size: 16px;
+              .icon {
+                width: 16px;
+                height: 16px;
+                margin-right: 10px;
+                background-image: url(@/assets/images/coursewareManage/QR.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%;
+              }
+            }
+            .body {
+              width: 100%;
+              margin: 34px auto 56px auto;
+              display: flex;
+              justify-content: center;
+              align-items: center;
+              flex-direction: column;
+              // background-color: red;
+              position: relative;
+              .back {
+                position: absolute;
+                top: 30px;
+                font-size: 12px;
+                font-weight: 400;
+                color: #666666;
+              }
+            }
+            .footerr {
+              display: flex;
+              justify-content: center;
+              align-items: center;
+              .onload {
+                color: rgba(51, 51, 51, 1);
+                font-size: 14px;
+              }
+              .onloadpx {
+                width: 80px;
+                height: 32px;
+                border: 1px solid rgba(56, 125, 247, 1);
+                border-radius: 4px;
+                color: rgba(56, 125, 247, 1);
+                margin-left: 20px;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                cursor: pointer;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
 .taskpage {
   width: 100%;
   display: flex;