提交一下准备安装下载图片

1

src/router/index.js

@@ -532,6 +532,8 @@ export const asyncRoutes = {
   liveClassManager:()=>import('@/views/liveClassManager'),
   // 新建直播课
   createLiveClass:()=>import('@/views/liveClassManager/newLiveClass'),
+  // 直播课详情
+  liveClassDetail:()=>import('@/views/liveClassManager/liveClassDetail'),
 }
 
 export default router

src/router/notKeepAliveList.js

@@ -114,5 +114,6 @@ export default [
   '/business/studentPaySet',
   '/staffPlatManager',
   '/infoOAMananger',
-  '/business/createLiveClass'
+  '/business/createLiveClass',
+  '/business/liveClassDetail'
 ]

src/store/modules/permission.js

@@ -561,6 +561,18 @@ function setDetailRoute(accessedRoutes) {
             activeMenu: '/liveClassManager'
           }
         },
+        {
+          name: '直播课详情',
+          path: 'liveClassDetail',
+          component: () => import('@/views/liveClassManager/liveClassDetail'),
+          hidden: true,
+          meta: {
+            noCache: '1',
+            title: '直播课详情',
+            belongTopMenu: "/business",
+            activeMenu: '/liveClassManager'
+          }
+        },
         // /otherManager/reaplceMusicPlayer /reaplceMusicPlayer/answer
 
       ])

src/views/liveClassManager/index.vue

@@ -6,7 +6,12 @@
       直播课管理
     </h2>
     <div class="m-core">
-      <el-button @click="newLiveClass" type="primary" style="margin-bottom:20px">新建直播课</el-button>
+      <el-button
+        @click="newLiveClass"
+        type="primary"
+        style="margin-bottom: 20px"
+        >新建直播课</el-button
+      >
       <save-form
         :inline="true"
         :model="searchForm"
@@ -91,8 +96,12 @@
             <template slot-scope="scope">
               <div>
                 <el-button type="text">关闭直播</el-button>
-                <el-button type="text">直播详情</el-button>
-                <el-button type="text">分享</el-button>
+                <el-button type="text" @click="gotoDetail(scope.row)"
+                  >直播详情</el-button
+                >
+                <el-button type="text" @click="shareLive(scope.row)"
+                  >分享</el-button
+                >
                 <el-button type="text">修改</el-button>
                 <el-button type="text">删除</el-button>
               </div>
@@ -109,6 +118,15 @@
         />
       </div>
     </div>
+    <el-dialog
+      title="分享"
+      width="510px"
+      append-to-body
+      :visible.sync="shareVisible"
+      v-if="shareVisible"
+    >
+    <shareDetail :row="activeRow"/>
+    </el-dialog>
   </div>
 </template>
 
@@ -116,9 +134,10 @@
 import axios from "axios";
 import { getToken } from "@/utils/auth";
 import pagination from "@/components/Pagination/index";
+import shareDetail from "./modals/shareDetail.vue"
 import load from "@/utils/loading";
 export default {
-  components: { pagination },
+  components: { pagination,shareDetail },
   data() {
     return {
       searchForm: {
@@ -134,6 +153,8 @@ export default {
         total: 0, // 总条数
         page_size: [10, 20, 40, 50], // 选择限制显示条数
       },
+      shareVisible:false,
+      activeRow:null
     };
   },
   //生命周期 - 创建完成（可以访问当前this实例）
@@ -152,8 +173,17 @@ export default {
       this.getList();
     },
     onReSet() {},
-    newLiveClass(){
-      this.$router.push('/business/createLiveClass')
+    newLiveClass() {
+      this.$router.push("/business/createLiveClass");
+      //liveClassDetail
+    },
+    gotoDetail(row) {
+      this.$router.push("/business/liveClassDetail");
+    },
+    shareLive(row) {
+      this.activeRow = row;
+      this.activeRow.preTemplate =1
+      this.shareVisible = true;
     },
   },
 };

src/views/liveClassManager/liveClassDetail.vue

@@ -0,0 +1,144 @@
+<template>
+  <div class="m-container">
+    <h2>
+      <el-page-header @back="onCancel" content="直播详情"></el-page-header>
+    </h2>
+    <div class="m-core">
+      <div class="titleWrap">
+        <h2>2022大师直播第五期</h2>
+        <el-button type="primary">直播回放</el-button>
+      </div>
+      <p class="teacherName">主讲人：唐老师</p>
+      <p class="liveRemark">
+        直播内容：如何在校管乐团中锻炼孩子的自我管理及团队协作意识
+      </p>
+      <div class="infoWrap">
+        <statistic class="statistic" :cols="0">
+          <statistic-item>
+            <span> 参与学员 </span>
+            <span>1736</span>
+          </statistic-item>
+          <statistic-item>
+            <span> 累计点赞 </span>
+            <span>1736</span>
+          </statistic-item>
+          <statistic-item>
+            <span> 直播时长(分钟) </span>
+            <span>60</span>
+          </statistic-item>
+        </statistic>
+      </div>
+      <save-form
+        :inline="true"
+        :model="searchForm"
+        @submit="search"
+        @reset="onReSet"
+      >
+        <el-form-item>
+          <el-input
+            v-model.trim="searchForm.search"
+            clearable
+            @keyup.enter.native="search"
+            placeholder="直播间编号/标题"
+          ></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button native-type="submit" type="primary">搜索</el-button>
+          <el-button native-type="reset" type="danger">重置</el-button>
+        </el-form-item>
+      </save-form>
+      <div class="tableWrap">
+        <el-table
+          style="width: 100%"
+          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+          :data="tableList"
+        >
+          <el-table-column
+            align="center"
+            prop="studentId"
+            label="学员编号"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="studentId"
+            label="学员姓名"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="studentId"
+            label="手机号"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="studentId"
+            label="声部"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="studentId"
+            label="进入时间"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="studentId"
+            label="观看时长"
+          ></el-table-column>
+        </el-table>
+        <pagination
+          sync
+          :total.sync="rules.total"
+          :page.sync="rules.page"
+          :limit.sync="rules.limit"
+          :page-sizes="rules.page_size"
+          @pagination="getList"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import pagination from "@/components/Pagination/index";
+export default {
+  components: { pagination },
+  data() {
+    return {
+      searchForm: {},
+      tableList: [],
+            rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50], // 选择限制显示条数
+      },
+    };
+  },
+  mounted() {},
+  methods: {
+    onCancel() {},
+    search() {},
+    onReSet() {},
+    getList(){}
+  },
+};
+</script>
+<style lang="scss" scoped>
+.infoWrap {
+  width: 500px;
+}
+.teacherName,
+.liveRemark {
+  line-height: 30px;
+}
+.titleWrap {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  h2 {
+    margin-right: 10px;
+  }
+}
+.statistic .statistic-content > span {
+  font-size: 18px;
+}
+</style>

src/views/liveClassManager/modals/preview.vue

@@ -0,0 +1,256 @@
+<template>
+  <div>
+    <!--  -->
+    <div class="first" v-if="form.preTemplate == 1">
+      <h2>{{ form.roomTitle }}</h2>
+      <p class="teacher">主讲人：{{ form.teacherName }}</p>
+      <img src="../images/icon1.png" class="icon" alt="" />
+      <div class="preCore">
+        <img src="../images/start.png" class="start" alt="" />
+        <p class="title">开播时间</p>
+        <p class="time">{{ form.liveStartTime }}</p>
+        <p class="title">直播内容</p>
+        <div class="content">
+          <img class="pre" src="../images/icon5.png" alt="" />
+          <img class="end" src="../images/icon4.png" alt="" />
+          {{ form.liveRemark }}
+        </div>
+      </div>
+      <div class="bottom">
+        <img class="logo" src="../images/logo.png" alt="" />
+        <div class="code">
+          <div>
+            <vue-qr :text="url" style="width: 100%" :margin="0"></vue-qr>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!--  -->
+    <div class="second" v-if="form.preTemplate == 2">
+      <h2>{{ form.roomTitle }}</h2>
+      <p class="teacher">主讲人：{{ form.teacherName }}</p>
+      <img src="../images/icon2.png" class="icon" alt="" />
+      <div class="preCore">
+        <img src="../images/start.png" class="start" alt="" />
+        <p class="title">开播时间</p>
+        <p class="time">{{ form.liveStartTime }}</p>
+        <p class="title">直播内容</p>
+        <div class="content">
+          <img class="pre" src="../images/icon5.png" alt="" />
+          <img class="end" src="../images/icon4.png" alt="" />
+          {{ form.liveRemark }}
+        </div>
+      </div>
+      <div class="bottom">
+        <img class="logo" src="../images/logo.png" alt="" />
+        <div class="code">
+          <div>
+            <vue-qr :text="url" style="width: 100%" :margin="0"></vue-qr>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="third" v-if="form.preTemplate == 3">
+      <h2>{{ form.roomTitle }}</h2>
+      <p class="teacher">主讲人：{{ form.teacherName }}</p>
+      <img src="../images/icon3.png" class="icon" alt="" />
+      <div class="preCore">
+        <img src="../images/start.png" class="start" alt="" />
+        <p class="title">开播时间</p>
+        <p class="time">{{ form.liveStartTime }}</p>
+        <p class="title">直播内容</p>
+        <div class="content">
+          <img class="pre" src="../images/icon5.png" alt="" />
+          <img class="end" src="../images/icon4.png" alt="" />
+          {{ form.liveRemark }}
+        </div>
+      </div>
+      <div class="bottom">
+        <img class="logo" src="../images/logo.png" alt="" />
+        <div class="code">
+          <div>
+            <vue-qr :text="url" style="width: 100%" :margin="0"></vue-qr>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import VueQr from "vue-qr";
+export default {
+  components: { VueQr },
+  props: ["form"],
+  data() {
+    return {
+      url: "http://www.baidu.com",
+    };
+  },
+  computed: {
+    type() {
+      if (form.isSaveUserInfo == 2) {
+        return "second";
+      } else if (form.isSaveUserInfo == 3) {
+        return "third";
+      } else {
+        return "first";
+      }
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.third {
+  position: relative;
+  background: linear-gradient(135deg, #8d8cff 0%, #9664ec 100%);
+  padding: 43px 20px 54px;
+  h2 {
+    width: 254px;
+    font-size: 30px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #ffffff;
+    line-height: 40px;
+    text-shadow: 0px 2px 4px #9366ee;
+  }
+  .preCore {
+    .title {
+      background: #fa912c;
+    }
+  }
+}
+.second {
+  position: relative;
+  background: linear-gradient(135deg, #ff9d9d 0%, #ff6d6d 100%);
+  padding: 43px 20px 54px;
+  h2 {
+    width: 254px;
+    font-size: 30px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #ffffff;
+    line-height: 40px;
+    text-shadow: 0px 2px 4px #ff5f5f;
+  }
+  .preCore {
+    .title {
+      background: #fa502c;
+    }
+  }
+}
+.first {
+  position: relative;
+  background: linear-gradient(135deg, #4f8dff 0%, #0055ee 100%);
+  padding: 43px 20px 54px;
+  h2 {
+    width: 254px;
+    font-size: 30px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #ffffff;
+    line-height: 40px;
+    text-shadow: 0px 2px 4px #1054f1;
+  }
+}
+.icon {
+  width: 231px;
+  height: 223px;
+  position: absolute;
+  right: 3px;
+  top: 36px;
+}
+
+.teacher {
+  font-size: 16px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #ffffff;
+  line-height: 20px;
+  margin-top: 15px;
+  margin-bottom: 67px;
+}
+.preCore {
+  position: relative;
+  z-index: 100;
+  padding: 12px;
+  background: #ffffff;
+  border-radius: 11px;
+  border-image: linear-gradient(
+      180deg,
+      rgba(255, 255, 255, 1),
+      rgba(255, 255, 255, 1)
+    )
+    1 1;
+  .start {
+    width: 50px;
+    height: 59px;
+    position: absolute;
+    top: 24px;
+    right: -11px;
+  }
+  .title {
+    width: 85px;
+    background: #faab2c;
+    border-radius: 7px;
+    padding: 2px;
+    font-size: 18px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #ffffff;
+    line-height: 25px;
+    text-align: center;
+  }
+  .time {
+    margin: 15px 0;
+    font-size: 18px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 600;
+    color: #000000;
+    line-height: 25px;
+    margin-left: 4px;
+  }
+  .content {
+    margin-top: 20px;
+    position: relative;
+    background: linear-gradient(49deg, #fff8e2 0%, #fff1d5 100%);
+    border-radius: 8px;
+    padding: 20px;
+    font-size: 14px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    font-weight: 400;
+    color: #000000;
+    line-height: 25px;
+    margin-bottom: 12px;
+    .pre {
+      width: 20px;
+      height: 20px;
+      position: absolute;
+      left: -3px;
+      top: -4px;
+    }
+    .end {
+      width: 20px;
+      height: 20px;
+      position: absolute;
+      bottom: -4px;
+      right: 10px;
+    }
+  }
+}
+.bottom {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  margin: 30px 8px 0;
+  .logo {
+    width: 202px;
+    height: 84px;
+  }
+  .code {
+    padding: 2px;
+    width: 80px;
+    height: 80px;
+    background-color: #fff;
+  }
+}
+</style>

src/views/liveClassManager/modals/shareDetail.vue

@@ -0,0 +1,112 @@
+<template>
+  <div>
+    <el-form :model="form" ref="form" class="form">
+      <el-form-item label="分享对象">
+        <el-radio v-model="form.shareTarget" label="1">主播</el-radio>
+        <el-radio v-model="form.shareTarget" label="2">学员</el-radio>
+      </el-form-item>
+      <el-form-item label="分享方式" v-if="form.shareTarget == 2">
+        <el-radio v-model="form.shareType" label="1">链接分享</el-radio>
+        <el-radio v-model="form.shareType" label="2">二维码分享</el-radio>
+        <el-radio v-model="form.shareType" label="3">群聊分享</el-radio>
+      </el-form-item>
+    </el-form>
+    <div>
+      <div class="linkWrap" v-if="form.shareType == 1">
+        <div class="shareWrap">
+          <h2>乐团老师邀请您参与直播课！</h2>
+          <h4>{{ row.roomTitle }}111</h4>
+          <p>直播时间:{{ row.liveStartTime }}</p>
+          <p>直播内容:{{ row.liveRemark }}</p>
+          <p>直播地址:</p>
+          <p v-if="form.shareTarget == 1">
+            请在电脑浏览器中打开以上链接进行直播
+          </p>
+        </div>
+        <div class="shareBtn" @click="copyText">复制分享内容</div>
+      </div>
+      <div class="codeWrap" v-if="form.shareType == 2">
+        <div class="shareWrap">
+          <preview :form="row" />
+        </div>
+        <div class="shareBtn" @click="copyText">复制分享内容</div>
+      </div>
+      <div class="groupWrap" v-if="form.shareType == 3"></div>
+    </div>
+  </div>
+</template>
+<script>
+import copy from "copy-to-clipboard";
+import preview from "./preview";
+export default {
+  props: ["row"],
+  components: { preview },
+  data() {
+    return {
+      form: {
+        shareTarget: "1",
+        shareType: "1",
+      },
+      content: "",
+    };
+  },
+  mounted() {},
+  methods: {
+    copyText(e) {
+      let text = `乐团老师邀请您参与直播课！\n${
+        this.row.roomTitle || ""
+      }\n直播时间:${this.row.liveStartTime || ""}\n直播内容:${
+        this.row.liveRemark || ""
+      }\n直播地址:地址\n`;
+      if (this.form.shareTarget == 1) {
+        text += "请在电脑浏览器中打开以上链接进行直播";
+      }
+      if (text) {
+        copy(text);
+        this.$message.success("复制成功");
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.shareWrap {
+  background: #f9f9f9;
+  padding: 16px;
+  h2 {
+    font-size: 18px;
+    font-family: PingFangSC-Semibold, PingFang SC;
+    font-weight: 600;
+    color: #333333;
+    line-height: 25px;
+    margin-bottom: 18px;
+  }
+  h4 {
+    font-size: 16px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #333333;
+    line-height: 28px;
+  }
+  p {
+    font-size: 16px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #333333;
+    line-height: 30px;
+  }
+}
+.shareBtn {
+  height: 48px;
+  background: #00a79d;
+  border-radius: 32px;
+  width: 192px;
+  color: #fff;
+  margin: 24px auto 0;
+  text-align: center;
+  line-height: 48px;
+  font-size: 20px;
+  cursor: pointer;
+}
+</style>

src/views/liveClassManager/newLiveClass.vue

@@ -6,7 +6,7 @@
     <div class="m-core">
       <el-form
         :model="form"
-        ref="topinfo"
+        ref="form"
         label-width="300px"
         :inline="true"
         label-position="left"
@@ -20,12 +20,14 @@
         <el-row class="row">
           <el-form-item
             label="直播课标题"
-            prop="name"
+            maxlength="12"
+            show-word-limit
+            prop="roomTitle"
             :rules="[{ required: true, message: '请输入直播课标题' }]"
           >
             <el-input
               placeholder="请输入直播课标题"
-              v-model.trim="form.name"
+              v-model.trim="form.roomTitle"
             ></el-input>
           </el-form-item>
           <el-form-item
@@ -40,14 +42,14 @@
           </el-form-item>
           <el-form-item
             label="直播开始时间"
-            prop="name"
+            prop="liveStartTime"
             :rules="[{ required: true, message: '请选择直播开始时间' }]"
           >
             <el-date-picker
-              v-model="form.timer"
+              v-model="form.liveStartTime"
               type="datetime"
-              format="yyyy-MM-dd HH:mm:ss"
-              value-format="yyyy-MM-dd HH:mm:ss"
+              format="yyyy-MM-dd HH:mm"
+              value-format="yyyy-MM-dd HH:mm"
               placeholder="请选择直播开始时间"
             >
             </el-date-picker>
@@ -56,13 +58,13 @@
         <el-row class="row">
           <el-form-item
             label="直播课内容"
-            prop="name"
+            prop="liveRemark"
             :rules="[{ required: true, message: '请输入直播课内容' }]"
           >
             <el-input
               :rows="3"
               placeholder="请输入直播课内容"
-              v-model.trim="form.cancot"
+              v-model.trim="form.liveRemark"
               type="textarea"
               maxlength="200"
               show-word-limit
@@ -72,34 +74,34 @@
         <el-row class="row">
           <el-form-item
             label="预热模板（模板使用与分享宣传图片）"
-            prop="isSaveUserInfo"
+            prop="preTemplate"
             :rules="[{ required: true, message: '请选择预热模板' }]"
           >
             <div class="chioseWrap">
-              <div class="chioseItem" @click="form.isSaveUserInfo = 1">
+              <div class="chioseItem" @click="form.preTemplate = 1">
                 <img src="./images/img1.png" alt="" />
                 <div class="remberBox">
                   <div
                     class="dotWrap"
-                    :class="[form.isSaveUserInfo == 1 ? 'checked' : '']"
+                    :class="[form.preTemplate == 1 ? 'checked' : '']"
                   ></div>
                 </div>
               </div>
-              <div class="chioseItem" @click="form.isSaveUserInfo = 2">
+              <div class="chioseItem" @click="form.preTemplate = 2">
                 <img src="./images/img2.png" alt="" />
                 <div class="remberBox">
                   <div
                     class="dotWrap"
-                    :class="[form.isSaveUserInfo == 2 ? 'checked' : '']"
+                    :class="[form.preTemplate == 2 ? 'checked' : '']"
                   ></div>
                 </div>
               </div>
-              <div class="chioseItem" @click="form.isSaveUserInfo = 3">
+              <div class="chioseItem" @click="form.preTemplate = 3">
                 <img src="./images/img3.png" alt="" />
                 <div class="remberBox">
                   <div
                     class="dotWrap"
-                    :class="[form.isSaveUserInfo == 3 ? 'checked' : '']"
+                    :class="[form.preTemplate == 3 ? 'checked' : '']"
                   ></div>
                 </div>
               </div>
@@ -114,36 +116,39 @@
         ></el-alert>
         <el-row class="row">
           <el-form-item
+            prop="whether_like"
             label-width="120px"
             class="mline"
             label="允许点赞"
-            :rules="[{ required: true, message: '请选择是否允许点赞' }]"
+            :rules="[{ required: true, message: '是否允许点赞' }]"
           >
-            <el-radio-group v-model="form.radio">
-              <el-radio :label="3">是</el-radio>
-              <el-radio :label="6">否</el-radio>
+            <el-radio-group v-model="form.whether_like">
+              <el-radio :label="1">是</el-radio>
+              <el-radio :label="0">否</el-radio>
             </el-radio-group>
           </el-form-item>
         </el-row>
         <el-row class="row">
           <el-form-item
+            prop="whether_chat"
             label-width="120px"
             class="mline"
             label="允许聊天互动"
-            :rules="[{ required: true, message: '请选择是否允许点赞' }]"
+            :rules="[{ required: true, message: '是否允许聊天互动' }]"
           >
-            <el-radio-group v-model="form.radio">
-              <el-radio :label="3">是</el-radio>
-              <el-radio :label="6">否</el-radio>
+            <el-radio-group v-model="form.whether_chat">
+              <el-radio :label="1">是</el-radio>
+              <el-radio :label="0">否</el-radio>
             </el-radio-group>
           </el-form-item>
         </el-row>
         <el-row class="row">
           <el-form-item
+            prop="radio"
             label-width="120px"
             class="mline"
             label="保存直播回放"
-            :rules="[{ required: true, message: '请选择是否允许点赞' }]"
+            :rules="[{ required: true, message: '请选择允许点赞' }]"
           >
             <el-radio-group v-model="form.radio">
               <el-radio :label="3">是</el-radio>
@@ -152,21 +157,41 @@
           </el-form-item>
         </el-row>
       </el-form>
-      <div class="button"></div>
+      <el-row class="row">
+        <el-button type="primary" @click="preLook">预览</el-button>
+        <el-button type="primary">提交</el-button>
+      </el-row>
     </div>
+
+    <el-dialog
+      title="预览"
+      width="415px"
+      :close-on-click-modal="false"
+      append-to-body
+      :visible.sync="preLookVisible"
+    >
+      <preview :form="form" />
+    </el-dialog>
   </div>
 </template>
 <script>
+import preview from "./modals/preview.vue";
 export default {
+  components: { preview },
   data() {
     return {
       name: "新建直播课",
+      preLookVisible: false,
       form: {
-        name: "",
+        roomTitle: "",
         teacherName: "",
-        timer: "",
-        cancot: "",
-        isSaveUserInfo: null,
+        speakerId:"",
+        liveStartTime: "",
+        liveRemark: "",
+        preTemplate: null,
+        whether_like: "",
+        whether_chat:"",
+        whether_video:""
       },
     };
   },
@@ -176,6 +201,15 @@ export default {
       this.$store.dispatch("delVisitedViews", this.$route);
       this.$router.push("/liveClassManager");
     },
+    preLook() {
+      console.log(this.form);
+      this.$refs.form.validate((flag) => {
+        if (flag) {
+          this.preLookVisible = true;
+          console.log("预览", this.form);
+        }
+      });
+    },
   },
 };
 </script>