|  | @@ -1,99 +1,99 @@
 | 
	
		
			
				|  |  | -import {
 | 
	
		
			
				|  |  | -  defineComponent,
 | 
	
		
			
				|  |  | -  onMounted,
 | 
	
		
			
				|  |  | -  ref,
 | 
	
		
			
				|  |  | -  computed,
 | 
	
		
			
				|  |  | -  onUnmounted,
 | 
	
		
			
				|  |  | -  reactive
 | 
	
		
			
				|  |  | -} from 'vue';
 | 
	
		
			
				|  |  | -import styles from './index.module.less';
 | 
	
		
			
				|  |  | -import DirectoryList from './components/directory-main';
 | 
	
		
			
				|  |  | -import LessonMain from './components/lesson-main';
 | 
	
		
			
				|  |  | -import ResourceMain from './components/resource-main';
 | 
	
		
			
				|  |  | -import { useResizeObserver } from '@vueuse/core';
 | 
	
		
			
				|  |  | -import { onBeforeRouteLeave } from 'vue-router';
 | 
	
		
			
				|  |  | -import { usePrepareStore } from '/src/store/modules/prepareLessons';
 | 
	
		
			
				|  |  | -import { storeToRefs } from 'pinia';
 | 
	
		
			
				|  |  | -import LessonsGuideIn from '@/custom-plugins/guide-page/lessons-guideIn';
 | 
	
		
			
				|  |  | -import { eventGlobal } from '/src/utils';
 | 
	
		
			
				|  |  | -import { setGuidance } from '/src/custom-plugins/guide-page/api';
 | 
	
		
			
				|  |  | -export default defineComponent({
 | 
	
		
			
				|  |  | -  name: 'prepare-lessons',
 | 
	
		
			
				|  |  | -  setup() {
 | 
	
		
			
				|  |  | -    const state = reactive({
 | 
	
		
			
				|  |  | -      sidebarShow: false
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    const prepareStore = usePrepareStore();
 | 
	
		
			
				|  |  | -    const resourceMainRef = ref();
 | 
	
		
			
				|  |  | -    // console.log(prepareStore, 'prepareStore');
 | 
	
		
			
				|  |  | -    const directroyRef = ref();
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -    const onSlideChange = (val: boolean) => {
 | 
	
		
			
				|  |  | -      console.log(val, 'val');
 | 
	
		
			
				|  |  | -      state.sidebarShow = val;
 | 
	
		
			
				|  |  | -      resourceMainRef.value?.resetTabPosition();
 | 
	
		
			
				|  |  | -    };
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -    onMounted(() => {
 | 
	
		
			
				|  |  | -      // 作业预设事件
 | 
	
		
			
				|  |  | -      eventGlobal.on('teacher-slideshow', onSlideChange);
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -      // // 课件编辑事件
 | 
	
		
			
				|  |  | -      // eventGlobal.on('courseware-slideshow', onSlideChange);
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    onUnmounted(() => {
 | 
	
		
			
				|  |  | -      eventGlobal.off('teacher-slideshow', onSlideChange);
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    onMounted(() => {
 | 
	
		
			
				|  |  | -      useResizeObserver(
 | 
	
		
			
				|  |  | -        document.querySelector('#lessons-height') as HTMLElement,
 | 
	
		
			
				|  |  | -        (entries: any) => {
 | 
	
		
			
				|  |  | -          const entry = entries[0];
 | 
	
		
			
				|  |  | -          const { height } = entry.contentRect;
 | 
	
		
			
				|  |  | -          document.documentElement.style.setProperty(
 | 
	
		
			
				|  |  | -            '--window-page-lesson-height',
 | 
	
		
			
				|  |  | -            height + 'px'
 | 
	
		
			
				|  |  | -          );
 | 
	
		
			
				|  |  | -        }
 | 
	
		
			
				|  |  | -      );
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -    // 当前页面离开时
 | 
	
		
			
				|  |  | -    onBeforeRouteLeave(() => {
 | 
	
		
			
				|  |  | -      // 离开时恢复默认
 | 
	
		
			
				|  |  | -      prepareStore.setTabType('courseware');
 | 
	
		
			
				|  |  | -      prepareStore.setSelectMusicStatus(false);
 | 
	
		
			
				|  |  | -      prepareStore.setSelectResourceStatus(false);
 | 
	
		
			
				|  |  | -      prepareStore.setIsAddResource(false);
 | 
	
		
			
				|  |  | -      prepareStore.setIsAddTrain(false);
 | 
	
		
			
				|  |  | -      prepareStore.setIsEditResource(false);
 | 
	
		
			
				|  |  | -      prepareStore.setIsEditTrain(false);
 | 
	
		
			
				|  |  | -      sessionStorage.removeItem('prepareLessonCourseWareSubjectIsNull');
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    onUnmounted(() => {
 | 
	
		
			
				|  |  | -      prepareStore.setSubjectId('');
 | 
	
		
			
				|  |  | -    });
 | 
	
		
			
				|  |  | -    return () => (
 | 
	
		
			
				|  |  | -      <div
 | 
	
		
			
				|  |  | -        class={[
 | 
	
		
			
				|  |  | -          styles.prepareLessons,
 | 
	
		
			
				|  |  | -          state.sidebarShow ? styles.showSideBar : styles.hideSideBar
 | 
	
		
			
				|  |  | -        ]}
 | 
	
		
			
				|  |  | -        id="lessons-height">
 | 
	
		
			
				|  |  | -        {/* 左侧目录 */}
 | 
	
		
			
				|  |  | -        <div class={styles.directoryMain} ref={directroyRef.value}>
 | 
	
		
			
				|  |  | -          <DirectoryList />
 | 
	
		
			
				|  |  | -        </div>
 | 
	
		
			
				|  |  | -        {/* 中间排课 */}
 | 
	
		
			
				|  |  | -        <div class={styles.lessonMain}>
 | 
	
		
			
				|  |  | -          <LessonMain />
 | 
	
		
			
				|  |  | -        </div>
 | 
	
		
			
				|  |  | -        {/* 资源 */}
 | 
	
		
			
				|  |  | -        <div class={[styles.resourceMain]}>
 | 
	
		
			
				|  |  | -          {state.sidebarShow && <ResourceMain ref={resourceMainRef} />}
 | 
	
		
			
				|  |  | -        </div>
 | 
	
		
			
				|  |  | -        {state.sidebarShow && <LessonsGuideIn></LessonsGuideIn>}
 | 
	
		
			
				|  |  | -      </div>
 | 
	
		
			
				|  |  | -    );
 | 
	
		
			
				|  |  | -  }
 | 
	
		
			
				|  |  | -});
 | 
	
		
			
				|  |  | +import {
 | 
	
		
			
				|  |  | +  defineComponent,
 | 
	
		
			
				|  |  | +  onMounted,
 | 
	
		
			
				|  |  | +  ref,
 | 
	
		
			
				|  |  | +  computed,
 | 
	
		
			
				|  |  | +  onUnmounted,
 | 
	
		
			
				|  |  | +  reactive
 | 
	
		
			
				|  |  | +} from 'vue';
 | 
	
		
			
				|  |  | +import styles from './index.module.less';
 | 
	
		
			
				|  |  | +import DirectoryList from './components/directory-main';
 | 
	
		
			
				|  |  | +import LessonMain from './components/lesson-main';
 | 
	
		
			
				|  |  | +import ResourceMain from './components/resource-main';
 | 
	
		
			
				|  |  | +import { useResizeObserver } from '@vueuse/core';
 | 
	
		
			
				|  |  | +import { onBeforeRouteLeave } from 'vue-router';
 | 
	
		
			
				|  |  | +import { usePrepareStore } from '/src/store/modules/prepareLessons';
 | 
	
		
			
				|  |  | +import { storeToRefs } from 'pinia';
 | 
	
		
			
				|  |  | +import LessonsGuideIn from '@/custom-plugins/guide-page/lessons-guideIn';
 | 
	
		
			
				|  |  | +import { eventGlobal } from '/src/utils';
 | 
	
		
			
				|  |  | +import { setGuidance } from '/src/custom-plugins/guide-page/api';
 | 
	
		
			
				|  |  | +export default defineComponent({
 | 
	
		
			
				|  |  | +  name: 'prepare-lessons',
 | 
	
		
			
				|  |  | +  setup() {
 | 
	
		
			
				|  |  | +    const state = reactive({
 | 
	
		
			
				|  |  | +      sidebarShow: false
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    const prepareStore = usePrepareStore();
 | 
	
		
			
				|  |  | +    const resourceMainRef = ref();
 | 
	
		
			
				|  |  | +    // console.log(prepareStore, 'prepareStore');
 | 
	
		
			
				|  |  | +    const directroyRef = ref();
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    const onSlideChange = (val: boolean) => {
 | 
	
		
			
				|  |  | +      console.log(val, 'val');
 | 
	
		
			
				|  |  | +      state.sidebarShow = val;
 | 
	
		
			
				|  |  | +      resourceMainRef.value?.resetTabPosition();
 | 
	
		
			
				|  |  | +    };
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    onMounted(() => {
 | 
	
		
			
				|  |  | +      // 作业预设事件
 | 
	
		
			
				|  |  | +      eventGlobal.on('teacher-slideshow', onSlideChange);
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +      // // 课件编辑事件
 | 
	
		
			
				|  |  | +      // eventGlobal.on('courseware-slideshow', onSlideChange);
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    onUnmounted(() => {
 | 
	
		
			
				|  |  | +      eventGlobal.off('teacher-slideshow', onSlideChange);
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    onMounted(() => {
 | 
	
		
			
				|  |  | +      useResizeObserver(
 | 
	
		
			
				|  |  | +        document.querySelector('#lessons-height') as HTMLElement,
 | 
	
		
			
				|  |  | +        (entries: any) => {
 | 
	
		
			
				|  |  | +          const entry = entries[0];
 | 
	
		
			
				|  |  | +          const { height } = entry.contentRect;
 | 
	
		
			
				|  |  | +          document.documentElement.style.setProperty(
 | 
	
		
			
				|  |  | +            '--window-page-lesson-height',
 | 
	
		
			
				|  |  | +            height + 'px'
 | 
	
		
			
				|  |  | +          );
 | 
	
		
			
				|  |  | +        }
 | 
	
		
			
				|  |  | +      );
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    // 当前页面离开时
 | 
	
		
			
				|  |  | +    onBeforeRouteLeave(() => {
 | 
	
		
			
				|  |  | +      // 离开时恢复默认
 | 
	
		
			
				|  |  | +      prepareStore.setTabType('courseware');
 | 
	
		
			
				|  |  | +      prepareStore.setSelectMusicStatus(false);
 | 
	
		
			
				|  |  | +      prepareStore.setSelectResourceStatus(false);
 | 
	
		
			
				|  |  | +      prepareStore.setIsAddResource(false);
 | 
	
		
			
				|  |  | +      prepareStore.setIsAddTrain(false);
 | 
	
		
			
				|  |  | +      prepareStore.setIsEditResource(false);
 | 
	
		
			
				|  |  | +      prepareStore.setIsEditTrain(false);
 | 
	
		
			
				|  |  | +      sessionStorage.removeItem('prepareLessonCourseWareSubjectIsNull');
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    onUnmounted(() => {
 | 
	
		
			
				|  |  | +      prepareStore.setSubjectId('');
 | 
	
		
			
				|  |  | +    });
 | 
	
		
			
				|  |  | +    return () => (
 | 
	
		
			
				|  |  | +      <div
 | 
	
		
			
				|  |  | +        class={[
 | 
	
		
			
				|  |  | +          styles.prepareLessons,
 | 
	
		
			
				|  |  | +          state.sidebarShow ? styles.showSideBar : styles.hideSideBar
 | 
	
		
			
				|  |  | +        ]}
 | 
	
		
			
				|  |  | +        id="lessons-height">
 | 
	
		
			
				|  |  | +        {/* 左侧目录 */}
 | 
	
		
			
				|  |  | +        <div class={styles.directoryMain} ref={directroyRef.value}>
 | 
	
		
			
				|  |  | +          <DirectoryList sidebarShow={state.sidebarShow} />
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +        {/* 中间排课 */}
 | 
	
		
			
				|  |  | +        <div class={styles.lessonMain}>
 | 
	
		
			
				|  |  | +          <LessonMain />
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +        {/* 资源 */}
 | 
	
		
			
				|  |  | +        <div class={[styles.resourceMain]}>
 | 
	
		
			
				|  |  | +          {state.sidebarShow && <ResourceMain ref={resourceMainRef} />}
 | 
	
		
			
				|  |  | +        </div>
 | 
	
		
			
				|  |  | +        {state.sidebarShow && <LessonsGuideIn></LessonsGuideIn>}
 | 
	
		
			
				|  |  | +      </div>
 | 
	
		
			
				|  |  | +    );
 | 
	
		
			
				|  |  | +  }
 | 
	
		
			
				|  |  | +});
 |