lex 2 vuotta sitten
vanhempi
commit
5b330b4f6a

+ 215 - 198
src/api/vipSeting.js

@@ -1,484 +1,501 @@
-import request from '@/utils/request'
-import request2 from '@/utils/request2'
-import qs from 'qs'
-let api = '/api-web'
+import request from "@/utils/request";
+import request2 from "@/utils/request2";
+import qs from "qs";
+let api = "/api-web";
 // 获取vip 分类列表
 export function vipGroupCategory(data) {
   return request({
-    url: api + '/vipGroupCategory/queryAll',
-    method: 'get',
+    url: api + "/vipGroupCategory/queryAll",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // 获取vip 老师默认分类列表
 export function findTeacherDefaultSalary(data) {
   return request({
-    url: api + '/vipGroupCategory/findTeacherDefaultSalary',
-    method: 'post',
+    url: api + "/vipGroupCategory/findTeacherDefaultSalary",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 获取 vip循环列表
 export function getDefaultClassesCycle(data) {
   return request({
-    url: api + '/vipGroupDefaultClassesCycle/queryAll',
-    method: 'get',
-    params: data,
-  })
+    url: api + "/vipGroupDefaultClassesCycle/queryAll",
+    method: "get",
+    params: data
+  });
 }
 
 // 单个添加vip课程类型
 export function addVipGroupCategory(data) {
   return request({
-    url: api + '/vipGroupCategory/add',
-    method: 'post',
+    url: api + "/vipGroupCategory/add",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 单个修改vip课程类型
 export function resetVipGroupCategory(data) {
   return request({
-    url: api + '/vipGroupCategory/update',
-    method: 'post',
+    url: api + "/vipGroupCategory/update",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 // 删除单个vip类型
 export function removeVipGroupCategory(data) {
   return request({
-    url: api + '/vipGroupCategory/delete',
-    method: 'post',
+    url: api + "/vipGroupCategory/delete",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 新增排课周期
 export function addDefaultClassesCycle(data) {
   return request({
-    url: api + '/vipGroupDefaultClassesCycle/add',
-    method: 'post',
+    url: api + "/vipGroupDefaultClassesCycle/add",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 修改排课周期
 export function resetDefaultClassesCycle(data) {
   return request({
-    url: api + '/vipGroupDefaultClassesCycle/update',
-    method: 'post',
+    url: api + "/vipGroupDefaultClassesCycle/update",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 删除排课周期
 export function removeDefaultClassesCycle(data) {
   return request({
-    url: api + '/vipGroupDefaultClassesCycle/delete',
-    method: 'post',
+    url: api + "/vipGroupDefaultClassesCycle/delete",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 新增默认单价
 export function defaultClassesUnitPrice(data) {
   return request({
-    url: api + '/vipGroupDefaultClassesUnitPrice/add',
-    method: 'post',
+    url: api + "/vipGroupDefaultClassesUnitPrice/add",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
+}
+
+// 单个添加vip课程类型
+export function updatevipGroupDefaultClassesUnitPrice(data) {
+  return request({
+    url: api + "/vipGroupDefaultClassesUnitPrice/update",
+    method: "post",
+    data: qs.stringify(data)
+  });
 }
 
 // 查询活动方案列表
 export function vipGroupActivity(data) {
   return request({
-    url: api + '/vipGroupActivity/queryPage',
-    method: 'get',
+    url: api + "/vipGroupActivity/queryPage",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // 根据课程类型获取活动方案
 export function vipGroupActivityFind(data) {
   return request({
-    url: api + '/vipGroupActivity/findByVipGroupCategory',
-    method: 'get',
+    url: api + "/vipGroupActivity/findByVipGroupCategory",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // 新增vip课活动方案
 export function addVipActive(data) {
   return request({
-    url: api + '/vipGroupActivity/addVipGroupActivity',
-    method: 'POST',
+    url: api + "/vipGroupActivity/addVipGroupActivity",
+    method: "POST",
     data
-  })
+  });
 }
 // 修改vio课活动方案
 export function resetVipActive(data) {
   return request({
-    url: api + '/vipGroupActivity/update',
-    method: 'POST',
+    url: api + "/vipGroupActivity/update",
+    method: "POST",
     data
-  })
+  });
 }
 
 // 删除vip课
 
 export function removeVipActive(data) {
   return request({
-    url: api + '/vipGroupActivity/delete',
-    method: 'POST',
+    url: api + "/vipGroupActivity/delete",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 获取vip列表
 export function getVipList(data) {
   return request({
-    url: api + '/vipGroupManage/queryAll',
-    method: 'GET',
+    url: api + "/vipGroupManage/queryAll",
+    method: "GET",
     params: data
-  })
+  });
 }
 // 根据id获取vip详情
 export function getVipGroupDetail(data) {
   return request({
     url: api + `/vipGroupManage/getVipGroupDetail`,
-    method: 'GET',
+    method: "GET",
     params: data
-  })
+  });
 }
 
 // 根据id获取vip详情
 export function getVipGroupDetailForAudit(data) {
   return request({
     url: api + `/vipGroupManage/getVipGroupDetailForAudit`,
-    method: 'GET',
+    method: "GET",
     params: data
-  })
+  });
 }
 
 // 根据vipid获取学员
 export function findVipGroupStudents(data) {
   return request({
-    url: api + '/vipGroupManage/findVipGroupStudents',
-    method: 'GET',
+    url: api + "/vipGroupManage/findVipGroupStudents",
+    method: "GET",
     params: data
-  })
+  });
 }
 
 // 根据vipid和学生id 退学
 export function leaveSchool(data) {
   return request({
-    url: api + '/vipGroupManage/applyRefundForStudent',
-    method: 'POST',
+    url: api + "/vipGroupManage/applyRefundForStudent",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 获取vip教学记录
 export function findVipGroupTeachingRecord(data) {
   return request({
-    url: api + '/vipGroupManage/findVipGroupTeachingRecord',
-    method: 'get',
+    url: api + "/vipGroupManage/findVipGroupTeachingRecord",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // 获取vip财务信息
 export function getVipGroupSalarys(data) {
   return request({
-    url: api + '/vipGroupManage/findVipGroupSalarys',
-    method: 'get',
+    url: api + "/vipGroupManage/findVipGroupSalarys",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // 获取当前课程上课学员
 export function getStudyStudents(data) {
   return request({
-    url: api + '/vipGroupManage/findVipGroupAttendanceStudents',
-    method: 'get',
+    url: api + "/vipGroupManage/findVipGroupAttendanceStudents",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // vip课时调整
 export function resetVipClass(data) {
   return request({
-    url: api + '/vipGroupManage/classStartDateAdjust',
-    method: 'POST',
+    url: api + "/vipGroupManage/classStartDateAdjust",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 计算vip课酬
 export function getVipGroupCostCount(data) {
   return request({
-    url: api + '/vipGroupManage/getVipGroupCostCount',
-    method: 'POST',
+    url: api + "/vipGroupManage/getVipGroupCostCount",
+    method: "POST",
     data: data
-  })
+  });
 }
 
 // 计算网管课课酬
 export function getPracticeGroupCostCount(data) {
   return request({
-    url: api + '/practiceGroupManage/getPracticeGroupCostCount',
-    method: 'POST',
+    url: api + "/practiceGroupManage/getPracticeGroupCostCount",
+    method: "POST",
     data: data
-  })
+  });
 }
 // 网管课申请
 export function createPractice(data) {
   return request({
-    url: api + '/practiceGroupManage/practiceGroupApply',
-    method: 'POST',
+    url: api + "/practiceGroupManage/practiceGroupApply",
+    method: "POST",
     data
-  })
+  });
 }
 
 // 获取网管课单价 practiceGroupManage/queryPracticeGroupSellPrice
 export function getPracticeGroupSellPrice(data) {
   return request({
-    url: api + '/practiceGroupManage/queryPracticeGroupSellPrice',
-    method: 'GET',
-    params:data
-  })
+    url: api + "/practiceGroupManage/queryPracticeGroupSellPrice",
+    method: "GET",
+    params: data
+  });
 }
 // vip课申请
 export function createVip(data) {
   return request({
-    url: api + '/vipGroupManage/vipGroupApply',
-    method: 'POST',
+    url: api + "/vipGroupManage/vipGroupApply",
+    method: "POST",
     data
-  })
+  });
 }
 
 // 暂停vip
 export function closeVip(data) {
   return request({
-    url: api + '/vipGroupManage/stopVipGroup',
-    method: 'POST',
+    url: api + "/vipGroupManage/stopVipGroup",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 修改vip基本信息
 
 export function updateVipBaseInfo(data) {
   return request({
-    url: api + '/vipGroupManage/updateVipBaseInfo',
-    method: 'POST',
+    url: api + "/vipGroupManage/updateVipBaseInfo",
+    method: "POST",
     data
-  })
+  });
 }
 
 // 获取vip课程计划
 export function findVipGroupCourseSchedules(data) {
   return request({
-    url: api + '/courseSchedule/findVipGroupCourseSchedules',
-    method: 'POST',
+    url: api + "/courseSchedule/findVipGroupCourseSchedules",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 批量删除课程 删除vip
 export function bathDelete(data) {
   return request({
-
-    url: api + '/courseSchedule/batchDelete',
-    method: 'POST',
+    url: api + "/courseSchedule/batchDelete",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 // vip批量修改
 export function vipCourseAdjust(data) {
   return request({
-    url: api + '/courseSchedule/vipCourseAdjust',
-    method: 'POST',
+    url: api + "/courseSchedule/vipCourseAdjust",
+    method: "POST",
     data
-  })
+  });
 }
 
 // 新增vip课程计划
 export function appendVipGroupCourseSchedules(data) {
   return request({
-    url: api + '/vipGroupManage/appendVipGroupCourseSchedules',
-    method: 'POST',
+    url: api + "/vipGroupManage/appendVipGroupCourseSchedules",
+    method: "POST",
     data
-  })
+  });
 }
 
 // vip退费查询
 export function getStudentSurplusCourseFee(data) {
   return request({
-    url: api + '/vipGroupManage/getStudentSurplusCourseFee',
-    method: 'get',
+    url: api + "/vipGroupManage/getStudentSurplusCourseFee",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // vip搜索课程余额的学生
 export function getHaveCourseBalanceStudents(data) {
   return request({
-    url: api + '/vipGroupManage/findHaveCourseBalanceStudents',
-    method: 'get',
+    url: api + "/vipGroupManage/findHaveCourseBalanceStudents",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // vip添加学员 addVipGroupStudents
 export function addVipGroupStudents(data) {
   return request({
-    url: api + '/vipGroupManage/addVipGroupStudents',
-    method: 'post',
+    url: api + "/vipGroupManage/addVipGroupStudents",
+    method: "post",
     data
-  })
+  });
 }
 // /courseSchedule/batchAppendVipGroupCourses
 // vip课批量新增
 export function batchAppendVipGroupCourses(data) {
   return request({
-    url: api + '/courseSchedule/batchAppendVipGroupCourses',
-    method: 'POST',
+    url: api + "/courseSchedule/batchAppendVipGroupCourses",
+    method: "POST",
     data
-  })
+  });
 }
 
 // vip休学
 export function vipPauseForStudent(data) {
   return request({
-    url: api + '/vipGroupManage/pauseForStudent',
-    method: 'POST',
+    url: api + "/vipGroupManage/pauseForStudent",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 获取学生休学信息
 export function getStudentPauseInfo(data) {
   return request({
-    url: api + '/vipGroupManage/getStudentPauseInfo',
-    method: 'POST',
+    url: api + "/vipGroupManage/getStudentPauseInfo",
+    method: "POST",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 恢复休学
 export function recoverForStudent(data) {
   return request({
-    url: api + '/vipGroupManage/recoverForStudent',
-    method: 'POST',
+    url: api + "/vipGroupManage/recoverForStudent",
+    method: "POST",
     data
-  })
+  });
 }
 
 // 根据vip课所在部门与声部获取教师
 export function findTeacherWithVipGroupOrganAndSubject(data) {
   return request({
-    url: api + '/vipGroupManage/findTeacherWithVipGroupOrganAndSubject',
-    method: 'get',
+    url: api + "/vipGroupManage/findTeacherWithVipGroupOrganAndSubject",
+    method: "get",
     params: data
-  })
+  });
 }
 
 // 删除VIP课
 export function deleteVipGroup(data) {
   return request({
-    url: api + '/vipGroupManage/deleteVipGroup',
-    method: 'post',
+    url: api + "/vipGroupManage/deleteVipGroup",
+    method: "post",
     data: qs.stringify(data)
-  })
+  });
 }
 
 // 查询公用部分,分部
 export function getPublicOrgans(data) {
   return request({
-    url: api + '/vipGroupManage/getPublicOrgans',
-    method: 'get',
+    url: api + "/vipGroupManage/getPublicOrgans",
+    method: "get",
     params: data
-  })
+  });
 }
 // 修改vip课程组 vipGroupManageUpdate
 export function vipGroupManageUpdate(data) {
   return request({
-    url: api + '/vipGroupManage/update',
-    method: 'post',
+    url: api + "/vipGroupManage/update",
+    method: "post",
     data: qs.stringify(data)
-  })
-}
-export const getVipGroupActivity = data => request2({
-  url:api +  '/vipGroupActivity/get',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+  });
+}
+export const getVipGroupActivity = data =>
+  request2({
+    url: api + "/vipGroupActivity/get",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 // 启用停用活动方案
-export const enableVipGroupActivity = data => request2({
-  url:api +  '/vipGroupActivity/enable',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const enableVipGroupActivity = data =>
+  request2({
+    url: api + "/vipGroupActivity/enable",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 
 // 查询资格列表  权限
 
-export const getActivityUserMapperList = data => request2({
-  url:api +  '/activityUserMapper/queryActivityUserMapper',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const getActivityUserMapperList = data =>
+  request2({
+    url: api + "/activityUserMapper/queryActivityUserMapper",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 
 // 查询学生列表 studentManage/queryStudent
-export const getStudentList = data => request2({
-  url:api +  '/studentManage/queryStudent',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const getStudentList = data =>
+  request2({
+    url: api + "/studentManage/queryStudent",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 
 //添加排课资格
-export const addActivityUserMapperStudents= data => request2({
-  url:api +  '/activityUserMapper/add',
-  data:data,
-  method: 'post',
-  requestType: 'json'
-})
+export const addActivityUserMapperStudents = data =>
+  request2({
+    url: api + "/activityUserMapper/add",
+    data: data,
+    method: "post",
+    requestType: "json"
+  });
 
 // 获取学生资格详情
 
-export const getStudentactivityList = data => request2({
-  url:api +  '/activityUserMapper/queryPage',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const getStudentactivityList = data =>
+  request2({
+    url: api + "/activityUserMapper/queryPage",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 
 // 取消资格
-export const cutActivityrMapper = data => request2({
-  url:api +  '/activityUserMapper/cut',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const cutActivityrMapper = data =>
+  request2({
+    url: api + "/activityUserMapper/cut",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 
 // 资格记录
-export const activityrMapperInfo = data => request2({
-  url:api +  '/activityUserMapperAdjustLog/queryPage',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const activityrMapperInfo = data =>
+  request2({
+    url: api + "/activityUserMapperAdjustLog/queryPage",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });
 
 // 查询当前线上课数
-export const getOnlineMun = data => request2({
-  url:api +  '/tenantConfig/get',
-  params:data,
-  method: 'get',
-  requestType: 'form'
-})
+export const getOnlineMun = data =>
+  request2({
+    url: api + "/tenantConfig/get",
+    params: data,
+    method: "get",
+    requestType: "form"
+  });

+ 5 - 5
src/main.js

@@ -42,10 +42,10 @@ import "./utils/directive";
 import "@/icons"; // icon
 import "@/permission"; // permission control
 import { Message } from "element-ui";
-import VueCoreVideoPlayer from 'vue-core-video-player'
-Vue.use(VueCoreVideoPlayer,{
-  lang: 'zh-CN'
-})
+import VueCoreVideoPlayer from "vue-core-video-player";
+Vue.use(VueCoreVideoPlayer, {
+  lang: "zh-CN"
+});
 const showMessage = Symbol("showMessage");
 
 // imkit 为核心模块
@@ -181,7 +181,7 @@ Vue.mixin({
       }
       return val;
     },
-    keyupEvent(e, input) {
+    keyupEvent(e) {
       // 正数,小数2位 @keyup.native='keyupEvent($event)'
       e.target.value = e.target.value.replace(/[^\d.]/g, "");
       e.target.value = e.target.value.replace(/\.{2,}/g, ".");

+ 2 - 1
src/router/index.js

@@ -365,7 +365,7 @@ export const asyncRoutes = {
   // afterWorkList:()=>import('@/views/afterSchoolManager/afterWorkList'),
   // 课外管理
   afterSchoolManager: () => import("@/views/afterSchoolManager"),
-  examination:()=>import("@/views/afterSchoolManager/examination"),
+  examination: () => import("@/views/afterSchoolManager/examination"),
   afterSchoolDetail: () =>
     import("@/views/afterSchoolManager/afterSchoolDetail"),
   // 运营管理 学员列表
@@ -610,6 +610,7 @@ export const asyncRoutes = {
   liveClassManager: () => import("@/views/liveClassManager"),
   // 新建直播课
   createLiveClass: () => import("@/views/liveClassManager/newLiveClass"),
+  createLiveCourse: () => import("@/views/liveClassManager/createLiveClass"),
   // 直播课详情
   liveClassDetail: () => import("@/views/liveClassManager/liveClassDetail"),
   // 平台员工管理

Tiedoston diff-näkymää rajattu, sillä se on liian suuri
+ 209 - 179
src/store/modules/permission.js


+ 46 - 47
src/views/accompanyManager/index.vue

@@ -1,47 +1,46 @@
-<!--  -->
-<template>
-  <div class="m-container">
-    <h2>
-      <div class="squrt"></div>
-      网管课管理
-    </h2>
-    <div class="m-core">
-      <tab-router
-        v-model.trim="activeIndex"
-        type="card"
-        @tab-click="handleClick"
-      >
-        <el-tab-pane label="网管课管理" lazy name="1">
-          <accompanyList v-if="activeIndex === '1'" />
-        </el-tab-pane>
-        <el-tab-pane label="网管课购买" lazy name="2">
-          <accompanyBuys v-if="activeIndex === '2'" />
-        </el-tab-pane>
-      </tab-router>
-    </div>
-  </div>
-</template>
-
-<script>
-import accompanyList from "@/views/accompanyManager/accompanyList";
-import accompanyBuys from "@/views/accompanyManager/accompanyBuys";
-export default {
-  components: { accompanyList, accompanyBuys },
-  data() {
-    return {
-      activeIndex: "1",
-    };
-  },
-  //生命周期 - 创建完成(可以访问当前this实例)
-  created() {},
-  //生命周期 - 挂载完成(可以访问DOM元素)
-  mounted() {},
-  methods: {
-    handleClick(evt) {
-      // this.changeHash(evt.name);
-    },
-  },
-};
-</script>
-<style lang='scss' scoped>
-</style>
+<!--  -->
+<template>
+  <div class="m-container">
+    <h2>
+      <div class="squrt"></div>
+      网管课管理
+    </h2>
+    <div class="m-core">
+      <tab-router
+        v-model.trim="activeIndex"
+        type="card"
+        @tab-click="handleClick"
+      >
+        <el-tab-pane label="网管课管理" lazy name="1">
+          <accompanyList v-if="activeIndex === '1'" />
+        </el-tab-pane>
+        <el-tab-pane label="网管课购买" lazy name="2">
+          <accompanyBuys v-if="activeIndex === '2'" />
+        </el-tab-pane>
+      </tab-router>
+    </div>
+  </div>
+</template>
+
+<script>
+import accompanyList from "@/views/accompanyManager/accompanyList";
+import accompanyBuys from "@/views/accompanyManager/accompanyBuys";
+export default {
+  components: { accompanyList, accompanyBuys },
+  data() {
+    return {
+      activeIndex: "1"
+    };
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {},
+  methods: {
+    handleClick(evt) {
+      // this.changeHash(evt.name);
+    }
+  }
+};
+</script>
+<style lang="scss" scoped></style>

+ 158 - 264
src/views/baseRulesClassSetting/live-class-setting.vue

@@ -1,193 +1,121 @@
 <template>
   <div>
     <!-- 列表 -->
-    <div>
-      <el-alert
-        title="时长设置"
-        :closable="false"
-        type="info"
-        style="margin: 0px 0 20px"
-      />
-      <el-table
-        :data="topList"
-        :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+    <el-button
+      style="margin-bottom: 20px"
+      type="primary"
+      v-permission="'musicGroupOrganizationCourseSettings/add'"
+      @click="onChargeOperation('create')"
+      icon="el-icon-plus"
+      >添加</el-button
+    >
+    <el-table
+      :data="topList"
+      :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+    >
+      <el-table-column align="center" prop="id" label="编号"> </el-table-column>
+      <el-table-column
+        align="center"
+        prop="singleClassMinutes"
+        label="课程时长(分钟)"
       >
-        <el-table-column align="center" label="课程类型">
-          <template slot-scope="scope">
-            直播课
-          </template>
-        </el-table-column>
-        <el-table-column
-          align="center"
-          prop="singleClassMinutes"
-          label="课程时长(分钟)"
-        >
-        </el-table-column>
-        <el-table-column align="center" label="操作">
-          <template slot-scope="scope">
-            <el-button
-              v-permission="'vipGroupCategory/update'"
-              @click="resetGroupCategory(scope.row)"
-              type="text"
-              >修改</el-button
-            >
-          </template>
-        </el-table-column>
-      </el-table>
-    </div>
-
-    <div class="tableWrap">
-      <el-alert
-        title="收费设置"
-        :closable="false"
-        type="info"
-        style="margin: 20px 0"
-      />
-      <save-form
-        :inline="true"
-        ref="searchForm"
-        class="searchForm"
-        @submit="search"
-        :model.sync="searchForm"
-        save-key="/baseRulesClassSetting/vipChargeSetting"
+      </el-table-column>
+      <el-table-column
+        align="center"
+        prop="onlineClassesUnitPrice"
+        label="售价"
       >
-        <el-form-item prop="organId">
-          <el-select
-            class="multiple"
-            style="width: 180px !important"
-            v-model.trim="searchForm.organId"
-            filterable
-            placeholder="请选择分部"
-          >
-            <el-option
-              v-for="(item, index) in selects.branchs"
-              :key="index"
-              :label="item.name"
-              :value="item.id"
-            ></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item>
-          <el-button native-type="submit" type="primary">搜索</el-button>
-        </el-form-item>
-      </save-form>
-      <el-table
-        :data="tableList"
-        style="width: 100% !important"
-        :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+        <template slot-scope="scope">
+          <div>{{ scope.row.onlineClassesUnitPrice }}元/节</div>
+        </template>
+      </el-table-column>
+      <el-table-column
+        align="center"
+        prop="offlineClassesUnitPrice"
+        label="原价"
       >
-        <el-table-column prop="name" label="课程类型">
-          <template slot-scope="scope">
-            直播课
-          </template></el-table-column
-        >
-        <el-table-column prop="onlineClassesUnitPrice" label="售价">
-          <template slot-scope="scope">
-            <div>
-              <el-input v-model.trim="scope.row.onlineClassesUnitPrice">
-                <template slot="append"
-                  >元/节</template
-                >
-              </el-input>
-            </div>
-          </template>
-        </el-table-column>
-        <el-table-column prop="offlineClassesUnitPrice" label="原价">
-          <template slot-scope="scope">
-            <div>
-              <el-input v-model.trim="scope.row.offlineClassesUnitPrice">
-                <template slot="append"
-                  >元/节</template
-                ></el-input
-              >
-            </div>
-          </template>
-        </el-table-column>
-        <el-table-column label="操作">
-          <template slot-scope="scope">
-            <div>
-              <el-button
-                type="text"
-                v-if="
-                  $helpers.permission('vipGroupDefaultClassesUnitPrice/add')
-                "
-                @click="saveSeting(scope.row)"
-                >保存</el-button
-              >
-            </div>
-          </template>
-        </el-table-column>
-      </el-table>
-    </div>
+        <template slot-scope="scope">
+          <div>{{ scope.row.offlineClassesUnitPrice }}元/节</div>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="操作">
+        <template slot-scope="scope">
+          <el-button
+            v-permission="'vipGroupCategory/update'"
+            @click="onChargeOperation('update', scope.row)"
+            type="text"
+            >修改</el-button
+          >
+          <el-button
+            v-permission="'vipGroupCategory/update'"
+            @click="resetGroupCategory(scope.row)"
+            type="text"
+            >删除</el-button
+          >
+        </template>
+      </el-table-column>
+    </el-table>
 
     <!-- 课程类型新增弹窗 -->
     <el-dialog
-      title="修改直播课时长"
-      class="courseMask"
+      :title="liveForm.isAdd ? '添加直播课设置' : '修改直播课设置'"
       width="500px"
       @close="onVipStatusClose('vipStatus')"
       :visible.sync="liveStatus"
+      label-position="right"
+      :label-width="formLabelWidth"
     >
-      <el-form :model="liveStatusFrom" ref="vipStatus">
+      <el-form :model="liveForm" ref="vipStatus">
         <el-form-item
-          label="课程类型"
+          label="课程课时"
+          prop="singleClassMinutes"
           :rules="[
-            { required: true, message: '请输入课程形式', trigger: 'blur' }
+            {
+              required: true,
+              message: '请输入课程课时',
+              trigger: 'blur'
+            }
           ]"
-          :label-width="formLabelWidth"
-          prop="musicTheory"
         >
-          <el-select
-            v-model="liveStatusFrom.musicTheory"
-            style="width:100%!important"
-          >
-            <el-option label="直播课" :value="false"></el-option>
-          </el-select>
+          <el-input
+            :disabled="!liveForm.isAdd"
+            v-model.trim="liveForm.singleClassMinutes"
+            placeholder="请输入课程课时"
+          />
         </el-form-item>
         <el-form-item
-          label="课程课时"
-          prop="dynamicTags"
+          label="售价"
+          prop="onlineClassesUnitPrice"
           :rules="[
             {
               required: true,
-              message: '请输入课程课时',
-              trigger: 'blur, change'
+              message: '请输入售价',
+              trigger: 'blur'
             }
           ]"
-          :label-width="formLabelWidth"
         >
-          <el-tag
-            :key="index"
-            effect="dark"
-            type="info"
-            v-for="(tag, index) in liveStatusFrom.dynamicTags"
-            closable
-            :disable-transitions="false"
-            @close="handleClose(tag)"
-          >
-            {{ tag }}
-          </el-tag>
           <el-input
-            class="input-new-tag"
-            v-if="inputVisible"
-            v-model.trim="inputValue"
-            ref="saveTagInput"
-            style="width: 100px"
-            @keyup.enter.native="handleInputConfirm"
-          >
-          </el-input>
-          <el-button
-            v-if="!inputVisible"
-            class="button-new-tag"
-            @click="showInput"
-            >+ 添加</el-button
-          >
-          <el-button
-            v-if="inputVisible"
-            class="button-new-tag"
-            @click="handleInputConfirm"
-            >保存</el-button
-          >
+            @keyup.native="keyupEvent($event)"
+            v-model="liveForm.onlineClassesUnitPrice"
+            placeholder="请输入售价"
+          />
+        </el-form-item>
+        <el-form-item
+          label="原价"
+          prop="offlineClassesUnitPrice"
+          :rules="[
+            {
+              required: true,
+              message: '请输入原价',
+              trigger: 'blur'
+            }
+          ]"
+        >
+          <el-input
+            @keyup.native="keyupEvent($event)"
+            v-model="liveForm.offlineClassesUnitPrice"
+            placeholder="请输入原价"
+          />
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -200,103 +128,83 @@
   </div>
 </template>
 <script>
-import { Searchs } from "@/helpers";
 import {
   vipGroupCategory,
-  resetVipGroupCategory,
-  defaultClassesUnitPrice
+  updatevipGroupDefaultClassesUnitPrice,
+  addVipGroupCategory,
+  removeVipGroupCategory
 } from "@/api/vipSeting";
 export default {
   name: "practiceRules",
   data() {
     return {
-      formLabelWidth: "120px",
-      activeRow: null,
+      formLabelWidth: "100px",
       topList: [],
-      inputVisible: false,
-      inputValue: "",
       liveStatus: false,
-      liveStatusFrom: {
-        name: "",
-        num: "",
-        dynamicTags: [],
+      liveForm: {
         isAdd: true,
         musicTheory: false,
+        groupType: "LIVE",
+        onlineClassesUnitPrice: null, // 售价
+        offlineClassesUnitPrice: null, // 原价
+        singleClassMinutes: null,
         id: ""
-      }, // 弹窗内容
-      tableList: [],
-      searchForm: {
-        organId: null
-      }
+      } // 弹窗内容
     };
   },
   async mounted() {
     await this.$store.dispatch("setBranchs");
-    // 获取缓存的分部编号
-    const searchs = new Searchs(this.$route.fullPath);
-    const branchId = searchs.searchs[searchs.key]?.form.organId;
-    this.searchForm.organId = branchId
-      ? branchId
-      : this.selects?.branchs[0]["id"];
-
     this.getVipGroupCategoryList();
-    this.getList();
   },
   methods: {
-    resetGroupCategory(row) {
-      // 修改课程形式
-      const liveStatusFrom = this.liveStatusFrom;
-      this.$nextTick(() => {
-        liveStatusFrom.name = row.name;
-        liveStatusFrom.timer = row.singleClassMinutes.split(",");
-        liveStatusFrom.dynamicTags = row.singleClassMinutes.split(",");
-        liveStatusFrom.num = row.studentNum;
-        liveStatusFrom.id = row.id;
-        liveStatusFrom.isAdd = false;
-        liveStatusFrom.musicTheory = row.musicTheory;
+    async resetGroupCategory(row) {
+      this.$confirm("是否确认删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(async () => {
+        await removeVipGroupCategory({
+          id: row.id
+        }).then(res => {
+          if (res.code == 200) {
+            this.$message.success("删除成功");
+            this.getVipGroupCategoryList();
+          }
+        });
       });
-      this.liveStatus = true;
     },
     onVipStatusClose(formName) {
-      this.inputVisible = false;
-      this.inputValue = "";
       this.$refs[formName].resetFields();
     },
-    showInput() {
-      this.inputVisible = true;
-      this.$nextTick(_ => {
-        this.$refs.saveTagInput.$refs.input.focus();
-      });
-    },
-    handleInputConfirm() {
-      let inputValue = this.inputValue;
-      if (inputValue) {
-        this.liveStatusFrom.dynamicTags.push(inputValue);
-      }
-      this.inputVisible = false;
-      this.inputValue = "";
-    },
-    handleClose(tag) {
-      this.liveStatusFrom.dynamicTags.splice(
-        this.liveStatusFrom.dynamicTags.indexOf(tag),
-        1
-      );
-    },
     addLiveStatus(formName) {
       this.$refs[formName].validate(async valid => {
         if (valid) {
-          const liveStatusFrom = this.liveStatusFrom;
-          await resetVipGroupCategory({
-            name: liveStatusFrom.name,
-            singleClassMinutes: liveStatusFrom.dynamicTags.join(","),
-            studentNum: liveStatusFrom.num,
-            id: liveStatusFrom.id,
-            musicTheory: liveStatusFrom.musicTheory
-          }).then(res => {
-            this.$message.success("修改成功");
-            this.getVipGroupCategoryList();
-            this.liveStatus = false;
-          });
+          const liveForm = this.liveForm;
+          if (liveForm.isAdd) {
+            await addVipGroupCategory({
+              musicTheory: false,
+              groupType: "LIVE",
+              onlineClassesUnitPrice: liveForm.onlineClassesUnitPrice, // 售价
+              offlineClassesUnitPrice: liveForm.offlineClassesUnitPrice, // 原价
+              singleClassMinutes: liveForm.singleClassMinutes
+            }).then(res => {
+              if (res.code == 200) {
+                this.$message.success("添加成功");
+                this.getVipGroupCategoryList();
+                this.liveStatus = false;
+              }
+            });
+          } else {
+            await updatevipGroupDefaultClassesUnitPrice({
+              onlineClassesUnitPrice: liveForm.onlineClassesUnitPrice, // 售价
+              offlineClassesUnitPrice: liveForm.offlineClassesUnitPrice, // 原价
+              id: liveForm.id
+            }).then(res => {
+              this.$message.success("修改成功");
+              this.getVipGroupCategoryList();
+              this.liveStatus = false;
+            });
+          }
         }
       });
     },
@@ -310,36 +218,22 @@ export default {
         }
       });
     },
-    search() {
-      this.$refs.searchForm.validate(valid => {
-        this.getList();
-      });
-    },
-    saveSeting(row) {
-      defaultClassesUnitPrice({
-        offlineClassesUnitPrice: row.offlineClassesUnitPrice,
-        onlineClassesUnitPrice: row.onlineClassesUnitPrice,
-        organId: this.searchForm.organId,
-        vipGroupCategoryId: row.id
-      }).then(res => {
-        if (res.code == 200) {
-          // 保存成功提示=> 刷新列表
-          this.$message.success("保存成功");
-        } else {
-          // 保存失败
-          this.$message.error("保存失败,请重试");
-        }
-      });
-    },
-    getList() {
-      vipGroupCategory({
-        organId: this.searchForm.organId,
-        groupType: "live"
-      }).then(res => {
-        if (res.code == 200) {
-          this.tableList = res.data;
-        }
-      });
+    onChargeOperation(type, row) {
+      if (type == "update") {
+        this.liveForm = {
+          isAdd: false,
+          musicTheory: false,
+          groupType: "LIVE",
+          onlineClassesUnitPrice: row.onlineClassesUnitPrice, // 售价
+          offlineClassesUnitPrice: row.offlineClassesUnitPrice, // 原价
+          singleClassMinutes: row.singleClassMinutes,
+          id: row.id
+        };
+      } else {
+        this.rowDetail = null;
+        this.liveForm.isAdd = true;
+      }
+      this.liveStatus = true;
     }
   }
 };

+ 386 - 0
src/views/liveClassManager/createLiveClass.vue

@@ -0,0 +1,386 @@
+<template>
+  <div class="m-container">
+    <h2>
+      <el-page-header @back="onCancel" :content="name"></el-page-header>
+    </h2>
+    <div class="m-core">
+      <el-form ref="accountForm">
+        <el-alert
+          title="课程规划"
+          :closable="false"
+          type="info"
+          style="margin: 0 0 20px"
+        />
+        <el-row :gutter="20">
+          <el-col :span="10">
+            <el-form-item label="直播课标题" prop="memberId">
+              <el-input
+                placeholder="请输入直播课标题"
+                maxlength="25"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="直播课内容" prop="name">
+              <el-input
+                type="textarea"
+                placeholder="请输入直播课内容"
+                maxlength="200"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="分部" prop="name">
+              <el-input placeholder="请输入分部"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="声部" prop="name">
+              <el-input placeholder="请输入声部"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="指导老师" prop="name">
+              <el-input placeholder="请输入指导老师"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="乐团主管" prop="name">
+              <el-input placeholder="请输入乐团主管"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="课程购买时间" prop="name">
+              <el-date-picker
+                style="width: 100%"
+                :picker-options="{ firstDayOfWeek: 1 }"
+                type="datetimerange"
+                :default-time="['00:00:00', '23:59:59']"
+                range-separator="-"
+                start-placeholder="交易开始日期"
+                end-placeholder="交易结束日期"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="课时数" prop="name">
+              <el-input placeholder="请输入课时数"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="课程时长" prop="name">
+              <el-input placeholder="请输入课程时长"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="原价" prop="name">
+              <el-input placeholder="请输入原价"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item label="现价" prop="name">
+              <el-input placeholder="请输入现价"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-button type="danger">点击排课</el-button>
+        <el-table
+          style="width: 100%; margin-top: 20px;"
+          :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
+        >
+          <el-table-column
+            align="center"
+            prop="id"
+            label="课时"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="内容"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="技能/知识点掌握"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="时长"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="课程日期"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="开始时间"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="结束时间"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="id"
+            label="课程类型"
+          ></el-table-column>
+        </el-table>
+
+        <el-alert
+          title="直播课信息"
+          :closable="false"
+          type="info"
+          style="margin: 20px 0"
+        />
+
+        <el-row :gutter="20">
+          <el-col :span="10">
+            <el-form-item
+              label="直播设备"
+              prop="os"
+              :rules="[{ required: true, message: '请选择推广类型' }]"
+            >
+              <el-radio-group>
+                <el-radio label="pc">web</el-radio>
+                <el-radio label="client">客户端</el-radio>
+                <el-radio label="mobile">手机</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item
+              label="直播场景"
+              prop="useScene"
+              :rules="[{ required: true, message: '请选择直播场景' }]"
+            >
+              <el-radio-group>
+                <el-radio label="NORMAL">普通模式</el-radio>
+                <el-radio label="MUSIC">音乐模式</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="10">
+            <el-form-item
+              prop="roomConfig.whether_video"
+              label="保存直播回放"
+              :rules="[{ required: true, message: '是否保存直播回放' }]"
+            >
+              <el-radio-group>
+                <el-radio :label="0">是</el-radio>
+                <el-radio :label="1">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="10">
+            <el-form-item
+              prop="roomConfig.whether_view_shop_cart"
+              label="是否展示购物车"
+              :rules="[{ required: true, message: '是否展示购物车' }]"
+            >
+              <el-radio-group>
+                <el-radio :label="0">是</el-radio>
+                <el-radio :label="1">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="24">
+            <el-form-item
+              label="预热模板(模板使用于分享宣传图片)"
+              prop="preTemplate"
+              :rules="[{ required: true, message: '请选择预热模板' }]"
+            >
+              <el-checkbox-group v-model="checkList">
+                <div class="chioseWrap">
+                  <div class="chioseItem" @click="setPreTemplate(1)">
+                    <img src="./images/img1.png" alt="" />
+                    <div class="remberBox">
+                      <div class="wrap"></div>
+                      <el-checkbox
+                        class="chioseBox"
+                        :label="1"
+                        :checked="form.preTemplate == 1"
+                        ><br
+                      /></el-checkbox>
+                    </div>
+                  </div>
+                  <div class="chioseItem" @click="setPreTemplate(2)">
+                    <img src="./images/img2.png" alt="" />
+                    <div class="remberBox">
+                      <div class="wrap"></div>
+                      <el-checkbox
+                        name="2"
+                        class="chioseBox"
+                        :label="2"
+                        :checked="form.preTemplate == 2"
+                        ><br
+                      /></el-checkbox>
+                    </div>
+                  </div>
+                  <div class="chioseItem" @click="setPreTemplate(3)">
+                    <img src="./images/img3.png" alt="" />
+                    <div class="remberBox">
+                      <div class="wrap"></div>
+                      <el-checkbox
+                        class="chioseBox"
+                        :label="3"
+                        :checked="form.preTemplate == 3"
+                        ><br
+                      /></el-checkbox>
+                    </div>
+                  </div>
+                </div>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-col :span="24">
+            <el-button type="primary">确定</el-button>
+            <el-button type="primary">重置</el-button>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
+  </div>
+</template>
+<script>
+import preview from "./modals/preview.vue";
+import { getToken, getTenantId } from "@/utils/auth";
+import {
+  createLiveBroadcast,
+  resetLiveBroadcastRoomList,
+  getRoomInfo,
+  sysTenantConfigAll
+} from "./api";
+import { queryByOrganId } from "@/api/systemManage";
+import { getTeamList } from "@/api/teamServer";
+export default {
+  components: { preview },
+  data() {
+    return {
+      name: "新建直播课",
+      preLookVisible: false,
+      form: {
+        organIds: [],
+        schoolIds: [],
+        teamIds: [],
+        roomTitle: "",
+        useScene: "NORMAL",
+        speakerId: "",
+        liveStartTime: "",
+        liveRemark: "",
+        preTemplate: null,
+        popularizeType: "ALL",
+        clientType: "TEACHER",
+        os: "client",
+        roomConfig: {
+          whether_like: 0,
+          whether_chat: 0,
+          whether_video: 0,
+          whether_mic: 0,
+          whether_view_shop_cart: 0
+        },
+        checkList: [],
+        viewMode: "LOGIN"
+      },
+      serviceProvider: "tencentCloud",
+      remoteLoading: false,
+      teacherList: [],
+      checkList: [],
+      cooperationList: [],
+      teamList: [],
+      isinit: true,
+      pickerOptions: {
+        firstDayOfWeek: 1,
+        disabledDate(time) {
+          return time.getTime() + 86400000 <= new Date().getTime();
+        }
+      },
+      educationList: []
+    };
+  },
+  async mounted() {
+    this.$store.dispatch("setBranchs");
+  },
+  methods: {
+    onCancel() {
+      this.$store.dispatch("delVisitedViews", this.$route);
+      this.$router.push("/liveClassManager?tabrouter=2");
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.chioseWrap {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-start;
+  .chioseItem {
+    border-radius: 4px;
+    overflow: hidden;
+    position: relative;
+    margin-right: 10px;
+    width: 188px;
+    height: 188px;
+    cursor: pointer;
+    .remberBox {
+      .wrap {
+        width: 100px;
+        height: 100px;
+        z-index: 100;
+        position: absolute;
+      }
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      margin-bottom: 30px;
+      padding-top: 10px;
+      align-items: center;
+      position: relative;
+      color: #6d7278;
+      font-size: 16px;
+      position: absolute;
+      top: 1px;
+      right: 1px;
+      .chioseBox {
+        ::v-deep .el-checkbox__inner {
+          width: 20px;
+          height: 20px;
+          border-radius: 50%;
+          &::after {
+            height: 8px;
+            left: 6px;
+            position: absolute;
+            top: 3px;
+            width: 4px;
+          }
+        }
+      }
+      .dotWrap {
+        width: 21px;
+        height: 21px;
+        background: url("../../assets/images/icon_checkbox_default.png")
+          no-repeat center;
+        background-size: contain;
+        margin-right: 8px;
+        position: relative;
+        overflow: hidden;
+        &.checked {
+          background: url("../../assets/images/icon_checkbox.png") no-repeat
+            center;
+          background-size: contain;
+        }
+      }
+    }
+  }
+}
+</style>

+ 22 - 561
src/views/liveClassManager/index.vue

@@ -3,583 +3,44 @@
   <div class="m-container">
     <h2>
       <div class="squrt"></div>
-      直播管理
+      直播管理
     </h2>
     <div class="m-core">
-      <auth auths="imLiveBroadcastRoom/add">
-        <el-button @click="newLiveClass" type="primary" style="margin-bottom: 20px"
-          >新建直播课</el-button
-        >
-      </auth>
-      <save-form
-        :inline="true"
-        :model="searchForm"
-        @submit="search"
-        @reset="onReSet"
-        ref="searchForm"
+      <tab-router
+        v-model.trim="activeIndex"
+        type="card"
+        @tab-click="handleClick"
       >
-        <el-form-item prop="search">
-          <el-input
-            v-model.trim="searchForm.search"
-            clearable
-            @keyup.enter.native="
-              (e) => {
-                e.target.blur();
-                $refs.searchForm.save();
-                search();
-              }
-            "
-            placeholder="直播间编号/标题"
-          ></el-input>
-        </el-form-item>
-        <el-form-item prop="popularize">
-          <el-select placeholder="是否推广" v-model="searchForm.popularize" clearable>
-            <el-option label="否" value="0"></el-option>
-            <el-option label="是" value="1"></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item prop="liveState">
-          <el-select placeholder="直播状态" v-model="searchForm.liveState" clearable>
-            <el-option label="未开始" value="0"></el-option>
-            <el-option label="直播中" value="1"></el-option>
-            <el-option label="已结束" value="2"></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item prop="serviceProvider">
-          <el-select
-            placeholder="直播方案"
-            v-model="searchForm.serviceProvider"
-            clearable
-          >
-            <el-option label="融云" value="rongCloud"></el-option>
-            <el-option label="腾讯云" value="tencentCloud"></el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item prop="timer">
-          <el-date-picker
-            v-model.trim="searchForm.timer"
-            type="daterange"
-            value-format="yyyy-MM-dd"
-            range-separator="至"
-            start-placeholder="直播开始日期"
-            end-placeholder="直播结束日期"
-            :picker-options="{
-              firstDayOfWeek: 1,
-            }"
-          >
-          </el-date-picker>
-        </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="id" label="直播间编号"></el-table-column>
-          <el-table-column
-            align="center"
-            prop="roomTitle"
-            label="直播课标题"
-          ></el-table-column>
-          <el-table-column
-            align="center"
-            prop="speakerName"
-            label="主讲人"
-          ></el-table-column>
-          <el-table-column align="center" prop="liveStartTime" label="直播开始时间">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.liveStartTime | dateForMinFormat }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="popularize" label="直播设备">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.os | osFilter }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="popularize" label="观看权限">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.popularizeType == "ALL" ? "全员" : "部分" }}
-              </div>
-            </template>
-          </el-table-column>
-
-          <el-table-column align="center" prop="popularize" label="是否推广">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.popularize == 1 ? "是" : "否" }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="liveState" label="直播状态">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.liveState | liveState }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="serviceProvider" label="直播方案">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.serviceProvider | serviceProvider }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="viewMode" label="观看模式">
-            <template slot-scope="scope">
-              <div>
-                {{ scope.row.viewMode == "LOGIN" ? "登录" : "游客" }}
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column
-            align="center"
-            prop="createdByName"
-            label="创建人"
-          ></el-table-column>
-          <el-table-column align="center" prop="createdByName" label="预约人数">
-            <template slot-scope="scope">
-              <div>
-                <auth auths="imLiveBroadcastRoom/query/roomUser">
-                  <el-button type="text" @click="lookReservationDetail(scope.row)">
-                    {{ scope.row.roomReservationNum }}</el-button
-                  >
-                </auth>
-              </div>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" prop="studentId" label="操作">
-            <template slot-scope="scope">
-              <div>
-                <el-dropdown trigger="click" placement="bottom" :hide-on-click="false">
-                  <span class="el-dropdown-link">
-                    操作<i class="el-icon-arrow-down el-icon--right"></i>
-                  </span>
-                  <el-dropdown-menu slot="dropdown" style="width: 100px">
-                    <el-dropdown-item
-                      style="width: 100px"
-                      v-if="
-                        permission('imLiveBroadcastRoom/roomStart') &&
-                        scope.row.liveState == 0
-                      "
-                      @click.native="onStartLive(scope.row)"
-                    >
-                      <el-button type="text">开启直播</el-button>
-                    </el-dropdown-item>
-                    <el-dropdown-item
-                      style="width: 100px"
-                      v-if="
-                        permission('/liveStudentList') &&
-                        scope.row.popularizeType !== 'ALL'
-                      "
-                      @click.native="lookStudentDetail(scope.row)"
-                    >
-                      <el-button type="text">观看学员</el-button>
-                    </el-dropdown-item>
-                    <el-dropdown-item
-                      v-if="
-                        permission('imLiveBroadcastRoom/opsPopularize') &&
-                        scope.row.liveState != 2
-                      "
-                      @click.native="popularizeRoom(scope.row)"
-                    >
-                      <el-button type="text">{{
-                        scope.row.popularize == 1 ? "取消推广" : "首页推广"
-                      }}</el-button>
-                    </el-dropdown-item>
-
-                    <el-dropdown-item
-                      v-if="
-                        permission('imLiveBroadcastRoom/roomDestroy') &&
-                        scope.row.liveState == 1
-                      "
-                      @click.native="closeRoom(scope.row)"
-                    >
-                      <el-button type="text">关闭直播</el-button>
-                    </el-dropdown-item>
-
-                    <el-dropdown-item
-                      v-if="scope.row.liveState == 2"
-                      @click.native="gotoDetail(scope.row)"
-                    >
-                      <el-button type="text">直播详情</el-button>
-                    </el-dropdown-item>
-                    <auth auths="/liveBlackList">
-                      <el-dropdown-item @click.native="gotoBuylist(scope.row)">
-                        <el-button type="text">订单详情</el-button>
-                      </el-dropdown-item>
-                    </auth>
-                    <el-dropdown-item
-                      v-if="permission('liveGoodsMapper/page') && ishowCart(scope.row)"
-                      @click.native="setShop(scope.row)"
-                    >
-                      <el-button type="text">商品设置</el-button>
-                    </el-dropdown-item>
-                    <auth auths="imLiveBroadcastRoom/queryLiveRoomGoodsOrderList">
-                      <el-dropdown-item @click.native="gotoBlacklist(scope.row)">
-                        <el-button type="text">黑名单</el-button>
-                      </el-dropdown-item>
-                    </auth>
-                    <el-dropdown-item
-                      v-if="permission('imLiveBroadcastRoom/shareGroup')"
-                      @click.native="shareLive(scope.row)"
-                    >
-                      <el-button type="text">分享</el-button>
-                    </el-dropdown-item>
-
-                    <el-dropdown-item
-                      v-if="
-                        permission('imLiveBroadcastRoom/update') &&
-                        scope.row.liveState == 0
-                      "
-                    >
-                      <el-button type="text" @click.native="resetLive(scope.row)"
-                        >修改</el-button
-                      >
-                    </el-dropdown-item>
-
-                    <auth
-                      auths="imLiveBroadcastRoom/delete"
-                      v-if="scope.row.liveState == 0"
-                    >
-                      <el-dropdown-item>
-                        <el-button type="text" @click.native="deteleLive(scope.row)"
-                          >删除</el-button
-                        >
-                      </el-dropdown-item>
-                    </auth>
-                  </el-dropdown-menu>
-                </el-dropdown>
-
-                <!-- <auth
-                  auths="imLiveBroadcastRoom/opsPopularize"
-                  v-if="scope.row.liveState != 2"
-                >
-                  <el-button type="text" @click="popularizeRoom(scope.row)">{{
-                    scope.row.popularize == 1 ? "取消推广" : "首页推广"
-                  }}</el-button>
-                </auth>
-                <auth auths="imLiveBroadcastRoom/roomDestroy">
-                  <el-button
-                    type="text"
-                    v-if="scope.row.liveState == 1"
-                    @click="closeRoom(scope.row)"
-                    >关闭直播</el-button
-                  >
-                </auth>
-
-                <el-button
-                  type="text"
-                  v-if="scope.row.liveState == 2"
-                  @click="gotoDetail(scope.row)"
-                  >直播详情</el-button
-                >
-                <auth auths="liveGoodsMapper/page">
-                  <el-button type="text" @click="setShop(scope.row)"
-                    >商品设置</el-button
-                  >
-                </auth>
-
-                <auth auths="imLiveBroadcastRoom/shareGroup">
-                  <el-button type="text" @click="shareLive(scope.row)"
-                    >分享</el-button
-                  >
-                </auth>
-                <auth auths="imLiveBroadcastRoom/update">
-                  <el-button
-                    type="text"
-                    v-if="scope.row.liveState == 0"
-                    @click="resetLive(scope.row)"
-                    >修改</el-button
-                  >
-                </auth>
-                <auth auths="imLiveBroadcastRoom/delete">
-                  <el-button
-                    type="text"
-                    v-if="scope.row.liveState == 0"
-                    @click="deteleLive(scope.row)"
-                    >删除</el-button
-                  >
-                </auth>
-                <auth auths="imLiveBroadcastRoom/queryLiveRoomGoodsOrderList">
-                  <el-button type="text" @click="gotoBlacklist(scope.row)"
-                    >黑名单</el-button
-                  >
-                </auth>
-                <auth auths="/liveBlackList">
-                  <el-button type="text" @click="gotoBuylist(scope.row)"
-                    >订单详情</el-button
-                  >
-                </auth> -->
-              </div>
-            </template>
-          </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>
+        <el-tab-pane label="直播间管理" lazy name="1">
+          <liveRoomManager v-if="activeIndex === '1'" />
+        </el-tab-pane>
+        <el-tab-pane label="直播课管理" lazy name="2">
+          <liveClassManager v-if="activeIndex === '2'" />
+        </el-tab-pane>
+      </tab-router>
     </div>
-    <el-dialog
-      title="分享"
-      width="510px"
-      append-to-body
-      :visible.sync="shareVisible"
-      v-if="shareVisible"
-    >
-      <shareDetail @close="shareVisible = false" :row="activeRow" />
-    </el-dialog>
-    <popularizeRoom @getList="getList" ref="popularizeRoom" />
-    <reservationDetail ref="reservationDetail" />
-    <sellShopList ref="sellShopList" />
   </div>
 </template>
 
 <script>
-import axios from "axios";
-import { getToken } from "@/utils/auth";
-import { getTimes } from "@/utils";
-import pagination from "@/components/Pagination/index";
-import shareDetail from "./modals/shareDetail.vue";
-import load from "@/utils/loading";
-import popularizeRoom from "./modals/popularizeRoom.vue";
-import reservationDetail from "./modals/reservationDetail.vue";
-import sellShopList from "./modals/sellShopList";
-import { permission } from "@/utils/directivePage";
-import {
-  getLiveBroadcastList,
-  delLiveBroadcast,
-  closeBroadcastRoomList,
-  opsPopularize,
-  roomStart,
-} from "./api";
+import liveRoomManager from "./liveRoomManager";
+import liveClassManager from "./liveClassManager";
 export default {
-  components: {
-    pagination,
-    shareDetail,
-    popularizeRoom,
-    reservationDetail,
-    sellShopList,
-  },
+  components: { liveRoomManager, liveClassManager },
   data() {
     return {
-      searchForm: {
-        search: null,
-        timer: [],
-        serviceProvider: null,
-        liveState: null,
-        popularize: null,
-      },
-
-      tableList: [],
-      organList: [],
-      rules: {
-        // 分页规则
-        limit: 10, // 限制显示条数
-        page: 1, // 当前页
-        total: 0, // 总条数
-        page_size: [10, 20, 40, 50], // 选择限制显示条数
-      },
-      shareVisible: false,
-      activeRow: null,
+      activeIndex: "1"
     };
   },
   //生命周期 - 创建完成(可以访问当前this实例)
   created() {},
   //生命周期 - 挂载完成(可以访问DOM元素)
-  mounted() {
-    // 获取分部
-
-    this.init();
-  },
+  mounted() {},
   methods: {
-    permission,
-    init() {
-      this.getList();
-    },
-    async getList() {
-      const { timer, ...rest } = this.searchForm;
-      try {
-        const res = await getLiveBroadcastList({
-          ...rest,
-          ...getTimes(timer, ["startTime", "endTime"]),
-          rows: this.rules.limit,
-          page: this.rules.page,
-        });
-        this.tableList = res.data.rows;
-        this.rules.total = res.data.total;
-      } catch (e) {
-        console.log(e);
-      }
-    },
-    search() {
-      this.rules.page = 1;
-      this.getList();
-    },
-    onReSet() {
-      this.$refs.searchForm.resetFields();
-      this.search();
-    },
-    newLiveClass() {
-      let params = {
-        path: "/business/createLiveClass",
-      };
-      this.$router.push(params, (route) => {
-        route.meta.title = "新建直播课";
-      });
-      this.$router.push("/business/createLiveClass");
-      //liveClassDetail
-    },
-    gotoDetail(row) {
-      this.$router.push({
-        path: "/business/liveClassDetail",
-        query: { roomUid: row.roomUid },
-      });
-      //
-    },
-    shareLive(row) {
-      this.activeRow = row;
-      this.shareVisible = true;
-    },
-    resetLive(row) {
-      let params = {
-        path: "/business/createLiveClass",
-        query: { id: row.id, roomUid: row.roomUid },
-      };
-      //  ,
-      this.$router.push(params, (route) => {
-        route.meta.title = "修改直播课";
-      });
-    },
-    deteleLive(row) {
-      this.$confirm("您确定删除该直播间", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(async () => {
-          try {
-            const res = await delLiveBroadcast({ id: row.id });
-            this.$message.success("删除成功");
-            this.getList();
-          } catch (e) {
-            console.log(e);
-          }
-        })
-        .catch(() => {});
-    },
-    closeRoom(row) {
-      this.$confirm("您确定关闭直播间", "提示", {
-        confirmButtonText: "确定",
-        type: "warning",
-      }).then(async (res) => {
-        try {
-          const res = await closeBroadcastRoomList(row.id);
-          this.$message.success("关闭成功");
-          this.getList();
-        } catch (e) {}
-      });
-    },
-    async popularizeRoom(row) {
-      let popularize, str;
-      if (row.popularize) {
-        popularize = 0;
-        str = "取消推广";
-      } else {
-        popularize = 1;
-        str = "推广";
-        // this.$refs.popularizeRoom.openDioag(row);
-      }
-      this.$confirm(`您是否${str}直播间"${row.roomTitle}"`, "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
-      })
-        .then(async () => {
-          try {
-            const res = await opsPopularize({
-              popularize,
-              id: row.id,
-            });
-            this.$message.success(`${str}成功`);
-            this.getList();
-          } catch (e) {
-            console.log(e);
-          }
-        })
-        .catch(() => {});
-    },
-    setShop(row) {
-      this.$router.push({
-        path: "/business/liveShopControl",
-        query: { roomUid: row.roomUid },
-      });
-      //
-    },
-    lookReservationDetail(row) {
-      this.$refs.reservationDetail.openDioag(row);
-    },
-    gotoBlacklist(row) {
-      this.$router.push({
-        path: "/business/liveBlackList",
-        query: {
-          roomUid: row.roomUid,
-          name: row.roomTitle,
-          liveState: row.liveState,
-        },
-      });
-    },
-    gotoBuylist(row) {
-      this.$refs.sellShopList.openDioag(row);
-    },
-    lookStudentDetail(row) {
-      this.$router.push({
-        path: "/business/liveStudentList",
-        query: { roomUid: row.roomUid, name: row.roomTitle },
-      });
-    },
-    ishowCart(row) {
-      let json = JSON.parse(row.roomConfig);
-      if (json.whether_view_shop_cart == 0) {
-        return true;
-      } else {
-        return false;
-      }
-    },
-    async onStartLive(row) {
-      try {
-        await this.$confirm("确定开启直播?", "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        });
-        await roomStart(row.id);
-      } catch (e) {}
-    },
-  },
+    handleClick(evt) {
+      // this.changeHash(evt.name);
+    }
+  }
 };
 </script>
-<style lang="scss" scoped>
-::v-deep .el-dropdown-link {
-  cursor: pointer;
-  color: var(--color-primary);
-}
-::v-deep .el-icon-arrow-down {
-  font-size: 12px;
-}
-</style>
+<style lang="scss" scoped></style>

+ 242 - 0
src/views/liveClassManager/liveClassManager.vue

@@ -0,0 +1,242 @@
+<!--  -->
+<template>
+  <div>
+    <auth auths="imLiveBroadcastRoom/add">
+      <el-button
+        @click="newLiveClass"
+        type="primary"
+        style="margin-bottom: 20px"
+        >新建直播课</el-button
+      >
+    </auth>
+    <save-form
+      :inline="true"
+      :model="searchForm"
+      @submit="search"
+      @reset="onReSet"
+      ref="searchForm"
+    >
+      <el-form-item prop="search">
+        <el-input
+          v-model.trim="searchForm.search"
+          clearable
+          @keyup.enter.native="
+            e => {
+              e.target.blur();
+              $refs.searchForm.save();
+              search();
+            }
+          "
+          placeholder="课程名称"
+        ></el-input>
+      </el-form-item>
+      <el-form-item props="teacherId">
+        <remote-search
+          :commit="'setTeachers'"
+          v-model="searchForm.teacherId"
+          :isForzenWithQueryCondition="true"
+        />
+      </el-form-item>
+      <el-form-item prop="status">
+        <el-select
+          v-model.trim="searchForm.status"
+          filterable
+          clearable
+          placeholder="请选课程状态"
+        >
+          <el-option
+            v-for="(item, index) in statusList"
+            :key="index"
+            :label="item.lable"
+            :value="item.value"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item prop="serviceProvider">
+        <el-select
+          placeholder="课程类型"
+          v-model="searchForm.serviceProvider"
+          clearable
+        >
+          <el-option label="乐理" value="rongCloud"></el-option>
+          <el-option label="乐器" value="tencentCloud"></el-option>
+        </el-select>
+      </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="id"
+          label="课程编号"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="roomTitle"
+          label="课程名称"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="roomTitle"
+          label="课程类型"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="roomTitle"
+          label="课程状态"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="speakerName"
+          label="指导老师"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="speakerName"
+          label="乐员主管"
+        ></el-table-column>
+
+        <el-table-column
+          align="center"
+          prop="speakerName"
+          label="报名人数"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="speakerName"
+          label="课时数"
+        ></el-table-column>
+        <el-table-column
+          align="center"
+          prop="speakerName"
+          label="分部"
+        ></el-table-column>
+
+        <el-table-column align="center" prop="liveStartTime" label="开课时间">
+          <template slot-scope="scope">
+            <div>
+              {{ scope.row.liveStartTime | dateForMinFormat }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" prop="studentId" label="操作">
+          <template slot-scope="scope">
+            <div>
+              <auth auths="/liveBlackList">
+                <el-button type="text" @click="gotoBuylist(scope.row)"
+                  >详情</el-button
+                >
+              </auth>
+              <auth auths="/liveBlackList">
+                <el-button type="text" @click="gotoBuylist(scope.row)"
+                  >停止</el-button
+                >
+              </auth>
+            </div>
+          </template>
+        </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>
+</template>
+
+<script>
+import { getTimes } from "@/utils";
+import pagination from "@/components/Pagination/index";
+import { getLiveBroadcastList } from "./api";
+export default {
+  components: {
+    pagination
+  },
+  data() {
+    return {
+      searchForm: {
+        search: null,
+        teacherId: null,
+        serviceProvider: null,
+        liveState: null,
+        popularize: null
+      },
+      tableList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+      statusList: [
+        { lable: "未开始", value: "0" },
+        { lable: "报名中", value: "1" },
+        { lable: "报名结束", value: "5" },
+        { lable: "进行中", value: "2" },
+        { lable: "已结束", value: "4" },
+        { lable: "取消", value: "3" },
+        { lable: "暂停", value: "6" }
+      ]
+    };
+  },
+  mounted() {
+    // 获取分部
+  },
+  methods: {
+    newLiveClass() {
+      let params = {
+        path: "/business/createLiveCourse"
+      };
+      this.$router.push(params, route => {
+        route.meta.title = "新建直播课";
+      });
+    },
+    async getList() {
+      const { timer, ...rest } = this.searchForm;
+      try {
+        const res = await getLiveBroadcastList({
+          ...rest,
+          ...getTimes(timer, ["startTime", "endTime"]),
+          rows: this.rules.limit,
+          page: this.rules.page
+        });
+        this.tableList = res.data.rows;
+        this.rules.total = res.data.total;
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    search() {
+      this.rules.page = 1;
+      this.getList();
+    },
+    onReSet() {
+      this.$refs.searchForm.resetFields();
+      this.search();
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+::v-deep .el-dropdown-link {
+  cursor: pointer;
+  color: var(--color-primary);
+}
+::v-deep .el-icon-arrow-down {
+  font-size: 12px;
+}
+</style>

+ 626 - 0
src/views/liveClassManager/liveRoomManager.vue

@@ -0,0 +1,626 @@
+<!--  -->
+<template>
+  <div>
+    <!-- <h2>
+      <div class="squrt"></div>
+      直播课管理
+    </h2> -->
+    <div>
+      <auth auths="imLiveBroadcastRoom/add">
+        <el-button
+          @click="newLiveClass"
+          type="primary"
+          style="margin-bottom: 20px"
+          >新建直播课</el-button
+        >
+      </auth>
+      <save-form
+        :inline="true"
+        :model="searchForm"
+        @submit="search"
+        @reset="onReSet"
+        ref="searchForm"
+      >
+        <el-form-item prop="search">
+          <el-input
+            v-model.trim="searchForm.search"
+            clearable
+            @keyup.enter.native="
+              e => {
+                e.target.blur();
+                $refs.searchForm.save();
+                search();
+              }
+            "
+            placeholder="直播间编号/标题"
+          ></el-input>
+        </el-form-item>
+        <el-form-item prop="popularize">
+          <el-select
+            placeholder="是否推广"
+            v-model="searchForm.popularize"
+            clearable
+          >
+            <el-option label="否" value="0"></el-option>
+            <el-option label="是" value="1"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="liveState">
+          <el-select
+            placeholder="直播状态"
+            v-model="searchForm.liveState"
+            clearable
+          >
+            <el-option label="未开始" value="0"></el-option>
+            <el-option label="直播中" value="1"></el-option>
+            <el-option label="已结束" value="2"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="serviceProvider">
+          <el-select
+            placeholder="直播方案"
+            v-model="searchForm.serviceProvider"
+            clearable
+          >
+            <el-option label="融云" value="rongCloud"></el-option>
+            <el-option label="腾讯云" value="tencentCloud"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="timer">
+          <el-date-picker
+            v-model.trim="searchForm.timer"
+            type="daterange"
+            value-format="yyyy-MM-dd"
+            range-separator="至"
+            start-placeholder="直播开始日期"
+            end-placeholder="直播结束日期"
+            :picker-options="{
+              firstDayOfWeek: 1
+            }"
+          >
+          </el-date-picker>
+        </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="id"
+            label="直播间编号"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="roomTitle"
+            label="直播课标题"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="speakerName"
+            label="主讲人"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            prop="liveStartTime"
+            label="直播开始时间"
+          >
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.liveStartTime | dateForMinFormat }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="popularize" label="直播设备">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.os | osFilter }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="popularize" label="观看权限">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.popularizeType == "ALL" ? "全员" : "部分" }}
+              </div>
+            </template>
+          </el-table-column>
+
+          <el-table-column align="center" prop="popularize" label="是否推广">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.popularize == 1 ? "是" : "否" }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="liveState" label="直播状态">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.liveState | liveState }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            prop="serviceProvider"
+            label="直播方案"
+          >
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.serviceProvider | serviceProvider }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="viewMode" label="观看模式">
+            <template slot-scope="scope">
+              <div>
+                {{ scope.row.viewMode == "LOGIN" ? "登录" : "游客" }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            prop="createdByName"
+            label="创建人"
+          ></el-table-column>
+          <el-table-column align="center" prop="createdByName" label="预约人数">
+            <template slot-scope="scope">
+              <div>
+                <auth auths="imLiveBroadcastRoom/query/roomUser">
+                  <el-button
+                    type="text"
+                    @click="lookReservationDetail(scope.row)"
+                  >
+                    {{ scope.row.roomReservationNum }}</el-button
+                  >
+                </auth>
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column align="center" prop="studentId" label="操作">
+            <template slot-scope="scope">
+              <div>
+                <el-dropdown
+                  trigger="click"
+                  placement="bottom"
+                  :hide-on-click="false"
+                >
+                  <span class="el-dropdown-link">
+                    操作<i class="el-icon-arrow-down el-icon--right"></i>
+                  </span>
+                  <el-dropdown-menu slot="dropdown" style="width: 100px">
+                    <el-dropdown-item
+                      style="width: 100px"
+                      v-if="
+                        permission('imLiveBroadcastRoom/roomStart') &&
+                          scope.row.liveState == 0
+                      "
+                      @click.native="onStartLive(scope.row)"
+                    >
+                      <el-button type="text">开启直播</el-button>
+                    </el-dropdown-item>
+                    <el-dropdown-item
+                      style="width: 100px"
+                      v-if="
+                        permission('/liveStudentList') &&
+                          scope.row.popularizeType !== 'ALL'
+                      "
+                      @click.native="lookStudentDetail(scope.row)"
+                    >
+                      <el-button type="text">观看学员</el-button>
+                    </el-dropdown-item>
+                    <el-dropdown-item
+                      v-if="
+                        permission('imLiveBroadcastRoom/opsPopularize') &&
+                          scope.row.liveState != 2
+                      "
+                      @click.native="popularizeRoom(scope.row)"
+                    >
+                      <el-button type="text">{{
+                        scope.row.popularize == 1 ? "取消推广" : "首页推广"
+                      }}</el-button>
+                    </el-dropdown-item>
+
+                    <el-dropdown-item
+                      v-if="
+                        permission('imLiveBroadcastRoom/roomDestroy') &&
+                          scope.row.liveState == 1
+                      "
+                      @click.native="closeRoom(scope.row)"
+                    >
+                      <el-button type="text">关闭直播</el-button>
+                    </el-dropdown-item>
+
+                    <el-dropdown-item
+                      v-if="scope.row.liveState == 2"
+                      @click.native="gotoDetail(scope.row)"
+                    >
+                      <el-button type="text">直播详情</el-button>
+                    </el-dropdown-item>
+                    <auth auths="/liveBlackList">
+                      <el-dropdown-item @click.native="gotoBuylist(scope.row)">
+                        <el-button type="text">订单详情</el-button>
+                      </el-dropdown-item>
+                    </auth>
+                    <el-dropdown-item
+                      v-if="
+                        permission('liveGoodsMapper/page') &&
+                          ishowCart(scope.row)
+                      "
+                      @click.native="setShop(scope.row)"
+                    >
+                      <el-button type="text">商品设置</el-button>
+                    </el-dropdown-item>
+                    <auth
+                      auths="imLiveBroadcastRoom/queryLiveRoomGoodsOrderList"
+                    >
+                      <el-dropdown-item
+                        @click.native="gotoBlacklist(scope.row)"
+                      >
+                        <el-button type="text">黑名单</el-button>
+                      </el-dropdown-item>
+                    </auth>
+                    <el-dropdown-item
+                      v-if="permission('imLiveBroadcastRoom/shareGroup')"
+                      @click.native="shareLive(scope.row)"
+                    >
+                      <el-button type="text">分享</el-button>
+                    </el-dropdown-item>
+
+                    <el-dropdown-item
+                      v-if="
+                        permission('imLiveBroadcastRoom/update') &&
+                          scope.row.liveState == 0
+                      "
+                    >
+                      <el-button
+                        type="text"
+                        @click.native="resetLive(scope.row)"
+                        >修改</el-button
+                      >
+                    </el-dropdown-item>
+
+                    <auth
+                      auths="imLiveBroadcastRoom/delete"
+                      v-if="scope.row.liveState == 0"
+                    >
+                      <el-dropdown-item>
+                        <el-button
+                          type="text"
+                          @click.native="deteleLive(scope.row)"
+                          >删除</el-button
+                        >
+                      </el-dropdown-item>
+                    </auth>
+                  </el-dropdown-menu>
+                </el-dropdown>
+
+                <!-- <auth
+                  auths="imLiveBroadcastRoom/opsPopularize"
+                  v-if="scope.row.liveState != 2"
+                >
+                  <el-button type="text" @click="popularizeRoom(scope.row)">{{
+                    scope.row.popularize == 1 ? "取消推广" : "首页推广"
+                  }}</el-button>
+                </auth>
+                <auth auths="imLiveBroadcastRoom/roomDestroy">
+                  <el-button
+                    type="text"
+                    v-if="scope.row.liveState == 1"
+                    @click="closeRoom(scope.row)"
+                    >关闭直播</el-button
+                  >
+                </auth>
+
+                <el-button
+                  type="text"
+                  v-if="scope.row.liveState == 2"
+                  @click="gotoDetail(scope.row)"
+                  >直播详情</el-button
+                >
+                <auth auths="liveGoodsMapper/page">
+                  <el-button type="text" @click="setShop(scope.row)"
+                    >商品设置</el-button
+                  >
+                </auth>
+
+                <auth auths="imLiveBroadcastRoom/shareGroup">
+                  <el-button type="text" @click="shareLive(scope.row)"
+                    >分享</el-button
+                  >
+                </auth>
+                <auth auths="imLiveBroadcastRoom/update">
+                  <el-button
+                    type="text"
+                    v-if="scope.row.liveState == 0"
+                    @click="resetLive(scope.row)"
+                    >修改</el-button
+                  >
+                </auth>
+                <auth auths="imLiveBroadcastRoom/delete">
+                  <el-button
+                    type="text"
+                    v-if="scope.row.liveState == 0"
+                    @click="deteleLive(scope.row)"
+                    >删除</el-button
+                  >
+                </auth>
+                <auth auths="imLiveBroadcastRoom/queryLiveRoomGoodsOrderList">
+                  <el-button type="text" @click="gotoBlacklist(scope.row)"
+                    >黑名单</el-button
+                  >
+                </auth>
+                <auth auths="/liveBlackList">
+                  <el-button type="text" @click="gotoBuylist(scope.row)"
+                    >订单详情</el-button
+                  >
+                </auth> -->
+              </div>
+            </template>
+          </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>
+    <el-dialog
+      title="分享"
+      width="510px"
+      append-to-body
+      :visible.sync="shareVisible"
+      v-if="shareVisible"
+    >
+      <shareDetail @close="shareVisible = false" :row="activeRow" />
+    </el-dialog>
+    <popularizeRoom @getList="getList" ref="popularizeRoom" />
+    <reservationDetail ref="reservationDetail" />
+    <sellShopList ref="sellShopList" />
+  </div>
+</template>
+
+<script>
+import axios from "axios";
+import { getToken } from "@/utils/auth";
+import { getTimes } from "@/utils";
+import pagination from "@/components/Pagination/index";
+import shareDetail from "./modals/shareDetail.vue";
+import load from "@/utils/loading";
+import popularizeRoom from "./modals/popularizeRoom.vue";
+import reservationDetail from "./modals/reservationDetail.vue";
+import sellShopList from "./modals/sellShopList";
+import { permission } from "@/utils/directivePage";
+import {
+  getLiveBroadcastList,
+  delLiveBroadcast,
+  closeBroadcastRoomList,
+  opsPopularize,
+  roomStart
+} from "./api";
+export default {
+  components: {
+    pagination,
+    shareDetail,
+    popularizeRoom,
+    reservationDetail,
+    sellShopList
+  },
+  data() {
+    return {
+      searchForm: {
+        search: null,
+        timer: [],
+        serviceProvider: null,
+        liveState: null,
+        popularize: null
+      },
+
+      tableList: [],
+      organList: [],
+      rules: {
+        // 分页规则
+        limit: 10, // 限制显示条数
+        page: 1, // 当前页
+        total: 0, // 总条数
+        page_size: [10, 20, 40, 50] // 选择限制显示条数
+      },
+      shareVisible: false,
+      activeRow: null
+    };
+  },
+  //生命周期 - 创建完成(可以访问当前this实例)
+  created() {},
+  //生命周期 - 挂载完成(可以访问DOM元素)
+  mounted() {
+    // 获取分部
+
+    this.init();
+  },
+  methods: {
+    permission,
+    init() {
+      this.getList();
+    },
+    async getList() {
+      const { timer, ...rest } = this.searchForm;
+      try {
+        const res = await getLiveBroadcastList({
+          ...rest,
+          ...getTimes(timer, ["startTime", "endTime"]),
+          rows: this.rules.limit,
+          page: this.rules.page
+        });
+        this.tableList = res.data.rows;
+        this.rules.total = res.data.total;
+      } catch (e) {
+        console.log(e);
+      }
+    },
+    search() {
+      this.rules.page = 1;
+      this.getList();
+    },
+    onReSet() {
+      this.$refs.searchForm.resetFields();
+      this.search();
+    },
+    newLiveClass() {
+      let params = {
+        path: "/business/createLiveClass"
+      };
+      this.$router.push(params, route => {
+        route.meta.title = "新建直播课";
+      });
+      this.$router.push("/business/createLiveClass");
+      //liveClassDetail
+    },
+    gotoDetail(row) {
+      this.$router.push({
+        path: "/business/liveClassDetail",
+        query: { roomUid: row.roomUid }
+      });
+      //
+    },
+    shareLive(row) {
+      this.activeRow = row;
+      this.shareVisible = true;
+    },
+    resetLive(row) {
+      let params = {
+        path: "/business/createLiveClass",
+        query: { id: row.id, roomUid: row.roomUid }
+      };
+      //  ,
+      this.$router.push(params, route => {
+        route.meta.title = "修改直播课";
+      });
+    },
+    deteleLive(row) {
+      this.$confirm("您确定删除该直播间", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(async () => {
+          try {
+            const res = await delLiveBroadcast({ id: row.id });
+            this.$message.success("删除成功");
+            this.getList();
+          } catch (e) {
+            console.log(e);
+          }
+        })
+        .catch(() => {});
+    },
+    closeRoom(row) {
+      this.$confirm("您确定关闭直播间", "提示", {
+        confirmButtonText: "确定",
+        type: "warning"
+      }).then(async res => {
+        try {
+          const res = await closeBroadcastRoomList(row.id);
+          this.$message.success("关闭成功");
+          this.getList();
+        } catch (e) {}
+      });
+    },
+    async popularizeRoom(row) {
+      let popularize, str;
+      if (row.popularize) {
+        popularize = 0;
+        str = "取消推广";
+      } else {
+        popularize = 1;
+        str = "推广";
+        // this.$refs.popularizeRoom.openDioag(row);
+      }
+      this.$confirm(`您是否${str}直播间"${row.roomTitle}"`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(async () => {
+          try {
+            const res = await opsPopularize({
+              popularize,
+              id: row.id
+            });
+            this.$message.success(`${str}成功`);
+            this.getList();
+          } catch (e) {
+            console.log(e);
+          }
+        })
+        .catch(() => {});
+    },
+    setShop(row) {
+      this.$router.push({
+        path: "/business/liveShopControl",
+        query: { roomUid: row.roomUid }
+      });
+      //
+    },
+    lookReservationDetail(row) {
+      this.$refs.reservationDetail.openDioag(row);
+    },
+    gotoBlacklist(row) {
+      this.$router.push({
+        path: "/business/liveBlackList",
+        query: {
+          roomUid: row.roomUid,
+          name: row.roomTitle,
+          liveState: row.liveState
+        }
+      });
+    },
+    gotoBuylist(row) {
+      this.$refs.sellShopList.openDioag(row);
+    },
+    lookStudentDetail(row) {
+      this.$router.push({
+        path: "/business/liveStudentList",
+        query: { roomUid: row.roomUid, name: row.roomTitle }
+      });
+    },
+    ishowCart(row) {
+      let json = JSON.parse(row.roomConfig);
+      if (json.whether_view_shop_cart == 0) {
+        return true;
+      } else {
+        return false;
+      }
+    },
+    async onStartLive(row) {
+      try {
+        await this.$confirm("确定开启直播?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        });
+        await roomStart(row.id);
+      } catch (e) {}
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+::v-deep .el-dropdown-link {
+  cursor: pointer;
+  color: var(--color-primary);
+}
+::v-deep .el-icon-arrow-down {
+  font-size: 12px;
+}
+</style>

+ 49 - 40
src/views/liveClassManager/newLiveClass.vue

@@ -28,7 +28,9 @@
             <el-radio-group v-model="form.os" @input="changeOs">
               <!-- value="rongCloud"></el-option>
               <el-option label="腾讯云" value="tencentCloud" -->
-              <el-radio v-if="serviceProvider === 'rongCloud'" label="pc">web</el-radio>
+              <el-radio v-if="serviceProvider === 'rongCloud'" label="pc"
+                >web</el-radio
+              >
               <el-radio v-if="serviceProvider === 'tencentCloud'" label="client"
                 >客户端</el-radio
               >
@@ -125,7 +127,7 @@
               :disabled="form.os == 'mobile'"
               clearable
               @change="
-                (value) => {
+                value => {
                   form.speakerId = '';
                 }
               "
@@ -317,8 +319,8 @@
           <el-form-item
             v-if="
               form.popularizeType == 'SCHOOL' ||
-              form.popularizeType == 'ORGAN' ||
-              form.popularizeType == 'TEAM'
+                form.popularizeType == 'ORGAN' ||
+                form.popularizeType == 'TEAM'
             "
             label="分部"
             prop="organIds"
@@ -489,7 +491,7 @@ import {
   createLiveBroadcast,
   resetLiveBroadcastRoomList,
   getRoomInfo,
-  sysTenantConfigAll,
+  sysTenantConfigAll
 } from "./api";
 import { queryByOrganId } from "@/api/systemManage";
 import { getTeamList } from "@/api/teamServer";
@@ -517,10 +519,10 @@ export default {
           whether_chat: 0,
           whether_video: 0,
           whether_mic: 0,
-          whether_view_shop_cart: 0,
+          whether_view_shop_cart: 0
         },
         checkList: [],
-        viewMode: "LOGIN",
+        viewMode: "LOGIN"
       },
       serviceProvider: "tencentCloud",
       remoteLoading: false,
@@ -533,9 +535,9 @@ export default {
         firstDayOfWeek: 1,
         disabledDate(time) {
           return time.getTime() + 86400000 <= new Date().getTime();
-        },
+        }
       },
-      educationList: [],
+      educationList: []
     };
   },
   async mounted() {
@@ -543,14 +545,15 @@ export default {
 
     try {
       const findName = await sysTenantConfigAll({
-        group: "LIVE_CLIENT",
+        group: "LIVE_CLIENT"
       });
       if (findName.data && findName.data.length > 0) {
-        findName.data.forEach((item) => {
+        findName.data.forEach(item => {
           if (item.paramName == "live_client") {
             this.serviceProvider = item.paranValue;
 
-            this.form.os = this.serviceProvider == "tencentCloud" ? "client" : "pc";
+            this.form.os =
+              this.serviceProvider == "tencentCloud" ? "client" : "pc";
           }
         });
       }
@@ -620,19 +623,23 @@ export default {
           schoolIds: [],
           teamIds: [],
           catIds: [],
-          studentIds: [],
+          studentIds: []
         };
         this.form.roomConfig = JSON.parse(res.data.roomConfig);
         if (res.data.popularizeOrgIds) {
-          this.form.organIds = res.data.popularizeOrgIds.split(",").map((item) => {
-            return item * 1;
-          });
+          this.form.organIds = res.data.popularizeOrgIds
+            .split(",")
+            .map(item => {
+              return item * 1;
+            });
         }
 
         if (res.data.popularizeSchoolIds) {
-          this.form.schoolIds = res.data.popularizeSchoolIds.split(",").map((item) => {
-            return item * 1;
-          });
+          this.form.schoolIds = res.data.popularizeSchoolIds
+            .split(",")
+            .map(item => {
+              return item * 1;
+            });
         }
 
         if (res.data.popularizeTeamIds) {
@@ -659,14 +666,14 @@ export default {
       this.$router.push("/liveClassManager");
     },
     changeTeacher(val) {
-      this.teacherList.forEach((item) => {
+      this.teacherList.forEach(item => {
         if (val == item.id) {
           this.form.speakerName = item.realName;
         }
       });
     },
     preLook() {
-      this.$refs.form.validate((flag) => {
+      this.$refs.form.validate(flag => {
         if (flag) {
           this.preLookVisible = true;
           console.log("预览", this.form);
@@ -693,25 +700,25 @@ export default {
           method: "get",
           headers: {
             Authorization: getToken(),
-            tenantId: getTenantId(),
+            tenantId: getTenantId()
           },
           params: {
             rows: 9999,
             search: query,
             lockFlag: 0,
-            demissionFlag: false,
+            demissionFlag: false
           },
-          url,
+          url
         };
         this.remoteLoading = true;
         // this.studentList = []
-        axios(options).then((res) => {
+        axios(options).then(res => {
           this.remoteLoading = false;
           let result = res.data;
           if (result.code == 200) {
             // Array.prototype.splice.apply(this.studentList, result.data.rows);
             if (result.data && result.data.rows.length > 0) {
-              result.data.rows.forEach((item) => {
+              result.data.rows.forEach(item => {
                 this.teacherList.unshift(item);
               });
               this.teacherList = this.deweight(this.teacherList, "phone");
@@ -738,25 +745,25 @@ export default {
           method: "get",
           headers: {
             Authorization: getToken(),
-            tenantId: getTenantId(),
+            tenantId: getTenantId()
           },
           params: {
             rows: 9999,
             search: query,
             lockFlag: 0,
-            demissionFlag: false,
+            demissionFlag: false
           },
-          url,
+          url
         };
         this.remoteLoading = true;
 
-        axios(options).then((res) => {
+        axios(options).then(res => {
           this.remoteLoading = false;
           let result = res.data;
           if (result.code == 200) {
             // Array.prototype.splice.apply(this.studentList, result.data.rows);
             if (result.data && result.data.rows.length > 0) {
-              result.data.rows.forEach((item) => {
+              result.data.rows.forEach(item => {
                 this.educationList.unshift(item);
               });
               this.educationList = this.deweight(this.educationList, "phone");
@@ -768,9 +775,9 @@ export default {
     },
     deweight(arr, key) {
       let res = [];
-      arr.forEach((item) => {
+      arr.forEach(item => {
         let list = [];
-        res.forEach((resitem) => {
+        res.forEach(resitem => {
           list.push(resitem[key]);
         });
         if (list.indexOf(item[key]) === -1) {
@@ -789,7 +796,7 @@ export default {
       this.form.popularizeOrgIds = this.form.organIds.join(",");
       this.form.popularizeSchoolIds = this.form.schoolIds.join(",");
       this.form.popularizeTeamIds = this.form.teamIds.join(",");
-      this.$refs.form.validate(async (flag) => {
+      this.$refs.form.validate(async flag => {
         if (!flag) return;
         if (this.$route.query.id) {
           // 修改
@@ -828,7 +835,7 @@ export default {
       if (this.form.popularizeType == "SCHOOL" && val && val.length > 0) {
         let organId = val.join(",");
         try {
-          await queryByOrganId({ organId }).then((res) => {
+          await queryByOrganId({ organId }).then(res => {
             if (res.code == 200) {
               this.cooperationList = res.data;
             }
@@ -840,7 +847,7 @@ export default {
       if (this.form.popularizeType == "TEAM" && val && val.length > 0) {
         let organId = val.join(",");
         try {
-          await getTeamList({ organId, page: 1, rows: 9999 }).then((res) => {
+          await getTeamList({ organId, page: 1, rows: 9999 }).then(res => {
             if (res.code == 200) {
               this.teamList = res.data.rows;
             }
@@ -849,8 +856,8 @@ export default {
           console.log(e);
         }
       }
-    },
-  },
+    }
+  }
 };
 </script>
 <style lang="scss" scoped>
@@ -937,13 +944,15 @@ export default {
       .dotWrap {
         width: 21px;
         height: 21px;
-        background: url("../../assets/images/icon_checkbox_default.png") no-repeat center;
+        background: url("../../assets/images/icon_checkbox_default.png")
+          no-repeat center;
         background-size: contain;
         margin-right: 8px;
         position: relative;
         overflow: hidden;
         &.checked {
-          background: url("../../assets/images/icon_checkbox.png") no-repeat center;
+          background: url("../../assets/images/icon_checkbox.png") no-repeat
+            center;
           background-size: contain;
         }
       }

Kaikkia tiedostoja ei voida näyttää, sillä liian monta tiedostoa muuttui tässä diffissä