update

src/components/live/CurMaterial.vue

@@ -1,11 +1,18 @@
 <template>
   <el-dialog
-    class="cur-material"
+    :class="['cur-material', { 'align-left': !isAlignCenter }]"
     :visible="dialogVisibleMaterial"
+    :modal="false"
     width="900px"
-    title="当前推送课件"
     @close="dialogMaterialClose"
   >
+    <div slot="title" class="dialog-header">
+      <span class="dialog-header-title">当前推送课件</span>
+      <span @click="isAlignCenter = !isAlignCenter">
+        <svg-icon :icon-class="isAlignCenter ? 'align-center' : 'align-left'" />
+      </span>
+    </div>
+
     <div class="material-name">{{ materialName }}</div>
 
     <template v-if="materialType === 'COURSEWARE'">
@@ -84,7 +91,8 @@ export default {
       file_relative_path: '',
       file_url_https: '',
       pdfSrc: '',
-      numPages: 1
+      numPages: 1,
+      isAlignCenter: true
     };
   },
   computed: {
@@ -194,6 +202,30 @@ export default {
 .cur-material {
   @include dialog;
 
+  &.align-left {
+    .el-dialog {
+      margin-left: 20px;
+    }
+  }
+
+  .el-dialog__header {
+    .dialog-header {
+      display: flex;
+      justify-content: space-between;
+      padding-right: 24px;
+
+      &-title {
+        font-weight: bold;
+        font-size: 18px;
+        line-height: 24px;
+      }
+
+      .svg-icon {
+        cursor: pointer;
+      }
+    }
+  }
+
   .material-name {
     font-size: 16px;
     font-weight: 700;

src/icons/svg/align-center.svg

@@ -0,0 +1,9 @@
+<svg width="1024" height="1024" xmlns="http://www.w3.org/2000/svg" class="icon">
+<g>
+  <rect fill="none" id="canvas_background" height="402" width="582" y="-1" x="-1"/>
+</g>
+<g>
+  <path id="svg_1" d="m1024,0l0,1024l-1024,0l0,-1024l1024,0zm-73.14286,73.14286l-877.71428,0l0,877.71428l877.71428,0l0,-877.71428z" fill="#91949A"/>
+  <path id="svg_2" d="m658.285721,228.42857l0,585.14286l-292.57143,0l0,-585.14286l292.57143,0zm-73.14286,73.14286l-146.28571,0l0,438.85714l146.28571,0l0,-438.85714z" fill="#91949A"/>
+</g>
+</svg>

src/icons/svg/align-left.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path fill="#91949A" d="M1024 0v1024H0V0h1024z m-73.142857 73.142857H73.142857v877.714286h877.714286V73.142857z"  /><path fill="#91949A" d="M512 219.428571v585.142858H219.428571V219.428571h292.571429zM438.857143 292.571429H292.571429v438.857142h146.285714V292.571429z"  /></svg>

src/views/live/teacher/CompleteList.vue

@@ -1,12 +1,19 @@
 <template>
   <el-dialog
-    class="complete-list"
+    :class="['complete-list', { 'align-left': !isAlignCenter }]"
     :visible="dialogVisibleComplete"
     width="900px"
-    title="答题统计"
+    :modal="false"
     :close-on-click-modal="false"
     @close="dialogCompleteClose"
   >
+    <div slot="title" class="dialog-header">
+      <span class="dialog-header-title">答题统计</span>
+      <span @click="isAlignCenter = !isAlignCenter">
+        <svg-icon :icon-class="isAlignCenter ? 'align-center' : 'align-left'" />
+      </span>
+    </div>
+
     <div class="complete-list-top">
       <div class="material-name">{{ material_name }}</div>
       <div class="student-list">
@@ -121,7 +128,8 @@ export default {
       curStudentID: '',
       curStudentName: '',
       listTimer: null,
-      marginLeft: 0
+      marginLeft: 0,
+      isAlignCenter: true
     };
   },
   computed: {
@@ -283,6 +291,30 @@ export default {
 .complete-list {
   @include dialog;
 
+  &.align-left {
+    .el-dialog {
+      margin-left: 20px;
+    }
+  }
+
+  .el-dialog__header {
+    .dialog-header {
+      display: flex;
+      justify-content: space-between;
+      padding-right: 24px;
+
+      &-title {
+        font-weight: bold;
+        font-size: 18px;
+        line-height: 24px;
+      }
+
+      .svg-icon {
+        cursor: pointer;
+      }
+    }
+  }
+
   &-top {
     .material-name {
       font-size: 16px;