|
@@ -20,7 +20,6 @@ import pptIcon from '../image/zy_ppt_icon.png';
|
|
|
import imgIcon from '../image/zy_img_icon.png';
|
|
|
import otherIcon from '../image/zy_more_icon.png';
|
|
|
|
|
|
-
|
|
|
import { Icon, Collapse, CollapseItem } from 'vant';
|
|
|
import { useRoute } from 'vue-router';
|
|
|
export default defineComponent({
|
|
@@ -30,15 +29,18 @@ export default defineComponent({
|
|
|
type: Array as any,
|
|
|
default: () => []
|
|
|
},
|
|
|
- kjId: { // 课件id
|
|
|
+ kjId: {
|
|
|
+ // 课件id
|
|
|
type: String,
|
|
|
default: ''
|
|
|
},
|
|
|
- zsdId: { // 知识点id
|
|
|
+ zsdId: {
|
|
|
+ // 知识点id
|
|
|
type: String,
|
|
|
default: ''
|
|
|
},
|
|
|
- currentCourse: { // 当前的课件
|
|
|
+ currentCourse: {
|
|
|
+ // 当前的课件
|
|
|
type: Object,
|
|
|
default: {}
|
|
|
},
|
|
@@ -54,7 +56,8 @@ export default defineComponent({
|
|
|
type: String,
|
|
|
default: ''
|
|
|
},
|
|
|
- itemName: { // 章节名称
|
|
|
+ itemName: {
|
|
|
+ // 章节名称
|
|
|
type: String,
|
|
|
default: ''
|
|
|
}
|
|
@@ -74,7 +77,7 @@ export default defineComponent({
|
|
|
THEORY: '乐理',
|
|
|
MUSIC_WIKI: '名曲',
|
|
|
INSTRUMENT: '乐器',
|
|
|
- MUSICIAN: '音乐家',
|
|
|
+ MUSICIAN: '音乐家'
|
|
|
};
|
|
|
const imgTypes: { [_: string]: string } = {
|
|
|
SONG: audioIcon,
|
|
@@ -87,7 +90,7 @@ export default defineComponent({
|
|
|
THEORY: otherIcon,
|
|
|
MUSIC_WIKI: otherIcon,
|
|
|
INSTRUMENT: otherIcon,
|
|
|
- MUSICIAN: otherIcon,
|
|
|
+ MUSICIAN: otherIcon
|
|
|
};
|
|
|
// 获取对应图片
|
|
|
const getImage = (item: any) => {
|
|
@@ -101,27 +104,28 @@ export default defineComponent({
|
|
|
return props.itemActive == item.id ? iconVideoActive : iconVideo;
|
|
|
}
|
|
|
};
|
|
|
-
|
|
|
+
|
|
|
const pointData = reactive({
|
|
|
allList: props.allList, // 章节下的所有课件
|
|
|
kjId: props.kjId, // 当前选中的课件id
|
|
|
zsdId: props.zsdId, // 当前选中的知识点id
|
|
|
- currentCourse: props.currentCourse as any, // 当前课件
|
|
|
+ currentCourse: props.currentCourse as any // 当前课件
|
|
|
});
|
|
|
watch(
|
|
|
() => props.allList,
|
|
|
() => {
|
|
|
- pointData.kjId = props.kjId
|
|
|
- pointData.zsdId = props.zsdId
|
|
|
+ pointData.kjId = props.kjId;
|
|
|
+ pointData.zsdId = props.zsdId;
|
|
|
}
|
|
|
);
|
|
|
watch(
|
|
|
() => props.popShow,
|
|
|
() => {
|
|
|
- console.log('刷新123',props.allList,props.currentCourse)
|
|
|
- pointData.currentCourse = props.currentCourse
|
|
|
- pointData.kjId = props.kjId
|
|
|
- pointData.zsdId = props.zsdId
|
|
|
+ console.log('刷新123', props.allList, props.currentCourse);
|
|
|
+ pointData.currentCourse = props.currentCourse;
|
|
|
+ pointData.kjId = props.kjId;
|
|
|
+ pointData.zsdId = props.zsdId;
|
|
|
+ pointData.allList = props.allList;
|
|
|
}
|
|
|
);
|
|
|
return () => (
|
|
@@ -135,16 +139,17 @@ export default defineComponent({
|
|
|
<img src={titleIcon} />
|
|
|
<span>{pointData.currentCourse?.name}</span>
|
|
|
</div>
|
|
|
- {
|
|
|
- pointData.allList?.length > 1 &&
|
|
|
- <img class={styles.kjRight} src={moreIcon}
|
|
|
+ {pointData.allList?.length > 1 && (
|
|
|
+ <img
|
|
|
+ class={styles.kjRight}
|
|
|
+ src={moreIcon}
|
|
|
onClick={() => {
|
|
|
- console.log(pointData.allList)
|
|
|
- emit('courseSelect')
|
|
|
+ console.log(pointData.allList);
|
|
|
+ emit('courseSelect');
|
|
|
}}
|
|
|
/>
|
|
|
- }
|
|
|
- </div>
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
<div class={styles.content}>
|
|
|
<Collapse
|
|
|
class={styles.collapse}
|
|
@@ -176,10 +181,12 @@ export default defineComponent({
|
|
|
<div
|
|
|
class={[
|
|
|
styles.matItem,
|
|
|
- props.itemActive == material.id ? styles.itemActive : ''
|
|
|
+ props.itemActive == material.id
|
|
|
+ ? styles.itemActive
|
|
|
+ : ''
|
|
|
]}
|
|
|
onClick={() => {
|
|
|
- console.log(pointData.allList)
|
|
|
+ console.log(pointData.allList);
|
|
|
emit('handleSelect', {
|
|
|
itemActive: material.id,
|
|
|
zsdId: know.id,
|
|
@@ -191,12 +198,15 @@ export default defineComponent({
|
|
|
</div>
|
|
|
<div class={styles.title}>
|
|
|
{/* <div class={styles.tag}>{types[material.type]}</div> */}
|
|
|
- <img class={styles.typeImg} src={imgTypes[material.type]} />
|
|
|
+ <img
|
|
|
+ class={styles.typeImg}
|
|
|
+ src={imgTypes[material.type]}
|
|
|
+ />
|
|
|
<div class={styles.tName}>{material.name}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
);
|
|
|
- })}
|
|
|
+ })}
|
|
|
</>
|
|
|
),
|
|
|
icon: () => (
|
|
@@ -213,8 +223,8 @@ export default defineComponent({
|
|
|
</CollapseItem>
|
|
|
))}
|
|
|
</Collapse>
|
|
|
-
|
|
|
- {/* {props.allList.length &&
|
|
|
+
|
|
|
+ {/* {props.allList.length &&
|
|
|
<Collapse
|
|
|
class={styles.collapse}
|
|
|
modelValue={pointData.kjId}
|
|
@@ -286,7 +296,7 @@ export default defineComponent({
|
|
|
</div>
|
|
|
</div>
|
|
|
);
|
|
|
- })}
|
|
|
+ })}
|
|
|
</>
|
|
|
),
|
|
|
icon: () => (
|
|
@@ -302,7 +312,7 @@ export default defineComponent({
|
|
|
}}
|
|
|
</CollapseItem>
|
|
|
))}
|
|
|
- </Collapse>
|
|
|
+ </Collapse>
|
|
|
</>
|
|
|
),
|
|
|
icon: () => (
|
|
@@ -318,10 +328,9 @@ export default defineComponent({
|
|
|
}}
|
|
|
</CollapseItem>
|
|
|
))}
|
|
|
- </Collapse>
|
|
|
+ </Collapse>
|
|
|
} */}
|
|
|
|
|
|
-
|
|
|
{/* {props.data.map((item, index: number) => {
|
|
|
return (
|
|
|
<div
|