|
@@ -6,8 +6,8 @@
|
|
|
ref="searchAreaRef"
|
|
|
:navList="navList"
|
|
|
:tcid="tcid"
|
|
|
- :fileId="fileId"
|
|
|
- :recordType="recordType"
|
|
|
+ :fileId="fileId"
|
|
|
+ :recordType="recordType"
|
|
|
v-if="itemType == 1"
|
|
|
/>
|
|
|
<taskArea
|
|
@@ -17,31 +17,69 @@
|
|
|
:taskCount="taskCount"
|
|
|
:worksStudent="worksStudent"
|
|
|
ref="taskAreaRef"
|
|
|
- :fileId="fileId"
|
|
|
+ :fileId="fileId"
|
|
|
v-if="itemType == 2"
|
|
|
/>
|
|
|
<dialogArea
|
|
|
:courseDetail="courseDetail"
|
|
|
ref="dialogAreaRef"
|
|
|
- :fileId="fileId"
|
|
|
+ :fileId="fileId"
|
|
|
v-if="itemType == 3"
|
|
|
/>
|
|
|
</div>
|
|
|
<div class="ch_nav_box">
|
|
|
<div class="ch_nav_box_top">
|
|
|
- <div @click="$emit('backPage')">
|
|
|
- <el-tooltip class="item" effect="dark" content="返回" placement="top">
|
|
|
- <img :src="require('../../assets/icon/course/return.png')" alt="" />
|
|
|
- </el-tooltip>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div @click="$emit('refresh')">
|
|
|
- <el-tooltip class="item" effect="dark" content="刷新" placement="top">
|
|
|
+ <div @click="changeFold(!fold)">
|
|
|
+ <el-tooltip class="item" effect="dark" :content="fold?'折叠':'展开'" placement="top">
|
|
|
<img
|
|
|
- :src="require('../../assets/icon/course/refresh.png')"
|
|
|
+ :src="require('../../assets/icon/course/foldIcon.svg')"
|
|
|
alt=""
|
|
|
+ :style="`${fold?'transform: rotate(90deg);':''}`"
|
|
|
/>
|
|
|
</el-tooltip>
|
|
|
+ <div v-if="fold" class="itemFold">
|
|
|
+ <div @click="$emit('backPage')">
|
|
|
+ <el-tooltip
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ content="返回"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/icon/course/return.png')"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div @click="$emit('refresh')">
|
|
|
+ <el-tooltip
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ content="刷新"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/icon/course/refresh.png')"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div @click="$emit('authority')" v-if="tType == 1 || tType == 4">
|
|
|
+ <el-tooltip
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ content="权限"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/icon/course/setting.png')"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<div @click="$emit('review')" v-if="tType == 1">
|
|
@@ -53,53 +91,68 @@
|
|
|
/>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
- <div @click="$emit('authority')" v-if="tType == 1 || tType == 4">
|
|
|
- <!-- -->
|
|
|
- <el-tooltip class="item" effect="dark" content="权限" placement="top">
|
|
|
+
|
|
|
+ <div @click="$emit('startRecording')" v-if="!videoStart && (tType == 1 || tType == 4)">
|
|
|
+ <el-tooltip class="item" effect="dark" content="录制" placement="top">
|
|
|
<img
|
|
|
- :src="require('../../assets/icon/course/setting.png')"
|
|
|
+ :src="require('../../assets/icon/course/record.svg')"
|
|
|
alt=""
|
|
|
+ style="width: 22px;height: 22px;"
|
|
|
/>
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
+
|
|
|
+ <div @click="$emit('stopRecording')" v-else-if="(tType == 1 || tType == 4)" style="background:#f63564">
|
|
|
+ <el-tooltip class="item" effect="dark" content="下载" placement="top">
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/icon/course/record2.svg')"
|
|
|
+ alt=""
|
|
|
+ style="width: 22px;height: 22px;"
|
|
|
+ />
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
</div>
|
|
|
<div class="ch_nav_box_middle">
|
|
|
<div
|
|
|
:class="[
|
|
|
'ch_nav_box_middle_item',
|
|
|
- itemType == 1 ? 'ch_nav_box_middle_item_active' : ''
|
|
|
+ itemType == 2 ? 'ch_nav_box_middle_item_active' : ''
|
|
|
]"
|
|
|
- @click.stop="changeItemType(1)"
|
|
|
+ @click.stop="changeItemType(2)"
|
|
|
>
|
|
|
<img
|
|
|
- v-if="itemType == 1"
|
|
|
- :src="require('../../assets/icon/course/up_active.png')"
|
|
|
+ v-if="itemType == 2"
|
|
|
+ :src="require('../../assets/icon/course/task_active.png')"
|
|
|
/>
|
|
|
<img
|
|
|
- v-if="itemType != 1"
|
|
|
- :src="require('../../assets/icon/course/up.png')"
|
|
|
+ v-if="itemType != 2"
|
|
|
+ :src="require('../../assets/icon/course/task.png')"
|
|
|
/>
|
|
|
- <!-- <span :style="`background:url(${itemType==1?require('../../assets/icon/course/up_active.png'):require('../../assets/icon/course/up.png')});`"></span> -->
|
|
|
- <div>对话</div>
|
|
|
+ <!-- <span :style="`background:url(${itemType==2?require('../../assets/icon/course/task_active.png'):require('../../assets/icon/course/task.png')});`"></span> -->
|
|
|
+ <div>任务</div>
|
|
|
</div>
|
|
|
- <div
|
|
|
+
|
|
|
+ <div
|
|
|
:class="[
|
|
|
'ch_nav_box_middle_item',
|
|
|
- itemType == 2 ? 'ch_nav_box_middle_item_active' : ''
|
|
|
+ itemType == 1 ? 'ch_nav_box_middle_item_active' : ''
|
|
|
]"
|
|
|
- @click.stop="changeItemType(2)"
|
|
|
+ @click.stop="changeItemType(1)"
|
|
|
>
|
|
|
<img
|
|
|
- v-if="itemType == 2"
|
|
|
- :src="require('../../assets/icon/course/task_active.png')"
|
|
|
+ v-if="itemType == 1"
|
|
|
+ :src="require('../../assets/icon/course/up_active.png')"
|
|
|
/>
|
|
|
<img
|
|
|
- v-if="itemType != 2"
|
|
|
- :src="require('../../assets/icon/course/task.png')"
|
|
|
+ v-if="itemType != 1"
|
|
|
+ :src="require('../../assets/icon/course/up.png')"
|
|
|
/>
|
|
|
- <!-- <span :style="`background:url(${itemType==2?require('../../assets/icon/course/task_active.png'):require('../../assets/icon/course/task.png')});`"></span> -->
|
|
|
- <div>任务</div>
|
|
|
+ <!-- <span :style="`background:url(${itemType==1?require('../../assets/icon/course/up_active.png'):require('../../assets/icon/course/up.png')});`"></span> -->
|
|
|
+ <div>对话</div>
|
|
|
</div>
|
|
|
+
|
|
|
<div
|
|
|
:class="[
|
|
|
'ch_nav_box_middle_item',
|
|
@@ -120,6 +173,19 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="ch_nav_box_bottom">
|
|
|
+
|
|
|
+ <div @click.stop="startAssistant()" :class="[recordType==1?'ch_nav_box_middle_item_active':'']">
|
|
|
+ <el-tooltip
|
|
|
+ class="item"
|
|
|
+ effect="dark"
|
|
|
+ :content="recordType==0?'开启语音助手':'关闭语音助手'"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <img v-if="recordType!=1" :src="require('../../assets/icon/course/robot.svg')" />
|
|
|
+ <img v-else :src="require('../../assets/icon/course/robot2.svg')" />
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
+
|
|
|
<div @click.stop="$emit('goStep', 0)">
|
|
|
<el-tooltip
|
|
|
class="item"
|
|
@@ -166,7 +232,7 @@ import dialogArea from "./component/dialogArea.vue";
|
|
|
import levitatedSphere from "./component/levitatedSphere.vue";
|
|
|
import timepiece from "./component/timepiece.vue";
|
|
|
export default {
|
|
|
- emits: ["refresh", "goStep", "backPage", "authority", "review"],
|
|
|
+ emits: ["refresh", "goStep", "backPage", "authority", "review","stopRecording","startRecording"],
|
|
|
components: {
|
|
|
searchArea,
|
|
|
taskArea,
|
|
@@ -206,14 +272,21 @@ export default {
|
|
|
fileList: {
|
|
|
type: Array,
|
|
|
default: () => []
|
|
|
- }
|
|
|
+ },
|
|
|
+ videoStart:{
|
|
|
+ type:Boolean,
|
|
|
+ default:false,
|
|
|
+ },
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
type: 0,
|
|
|
itemType: 0, //0--无 1-搜索 2-任务 3-对话
|
|
|
fileId: [],
|
|
|
- recordType:0,
|
|
|
+ recordType: 0,
|
|
|
+ recordLoading:false,
|
|
|
+ fold: false,
|
|
|
+
|
|
|
getFileIdLoading: false
|
|
|
};
|
|
|
},
|
|
@@ -254,12 +327,12 @@ export default {
|
|
|
},
|
|
|
getFileId() {
|
|
|
if (this.getFileIdLoading) return;
|
|
|
- this.getFileIdLoading = true;
|
|
|
+ this.getFileIdLoading = true;
|
|
|
this.fileId = [];
|
|
|
- let _this = this;
|
|
|
+ let _this = this;
|
|
|
let _successFileUrl = [];
|
|
|
if (this.fileList.length <= 0) retrun;
|
|
|
- let addType = ["DOCX", "DOC", "PPT", "PPTX", "MD", "TXT","PDF"];
|
|
|
+ let addType = ["DOCX", "DOC", "PPT", "PPTX", "MD", "TXT", "PDF"];
|
|
|
this.fileList.forEach(i => {
|
|
|
if (
|
|
|
addType.includes(
|
|
@@ -282,7 +355,7 @@ export default {
|
|
|
if (_data.result && _data.result.id) {
|
|
|
this.fileId.push(_data.result.id);
|
|
|
}
|
|
|
- resolve();
|
|
|
+ resolve();
|
|
|
});
|
|
|
})
|
|
|
);
|
|
@@ -291,18 +364,28 @@ export default {
|
|
|
this.getFileIdLoading = false;
|
|
|
});
|
|
|
},
|
|
|
- startAssistant(){
|
|
|
- if(this.recordType==0){
|
|
|
- this.$refs.levitatedSphereRef.recordStart();
|
|
|
- }else if(this.recordType==1){
|
|
|
- this.$refs.levitatedSphereRef.stopRecord();
|
|
|
- }
|
|
|
- },
|
|
|
- changeRecordType(type){
|
|
|
- console.log("修改了")
|
|
|
- this.recordType = type;
|
|
|
- console.log(this.recordType)
|
|
|
- },
|
|
|
+ startAssistant() {
|
|
|
+ if(this.recordLoading)return this.$message.info("请稍等...")
|
|
|
+ this.recordLoading = true;
|
|
|
+ if (this.recordType == 0) {
|
|
|
+ this.$message.info("开启")
|
|
|
+ // this.changeRecordType(1)
|
|
|
+ this.$refs.levitatedSphereRef.recordStart();
|
|
|
+ } else if (this.recordType == 1) {
|
|
|
+ this.$message.info("关闭")
|
|
|
+ // this.changeRecordType(0)
|
|
|
+ this.$refs.levitatedSphereRef.stopRecord();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 展开
|
|
|
+ changeFold(newValue) {
|
|
|
+ // this.$message.info("展开");
|
|
|
+ this.fold = newValue;
|
|
|
+ },
|
|
|
+ changeRecordType(type) {
|
|
|
+ this.recordLoading = false;
|
|
|
+ this.recordType = type;
|
|
|
+ }
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
@@ -316,7 +399,6 @@ export default {
|
|
|
border-radius: 10px;
|
|
|
box-sizing: border-box;
|
|
|
right: 20px;
|
|
|
- /* overflow: hidden; */
|
|
|
display: flex;
|
|
|
top: 20px;
|
|
|
z-index: 1000;
|
|
@@ -327,10 +409,10 @@ export default {
|
|
|
width: 65px;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- /* justify-content: flex-end; */
|
|
|
- margin-top: auto;
|
|
|
align-items: center;
|
|
|
- overflow: auto;
|
|
|
+ /* overflow-y: auto; */
|
|
|
+ overflow-x: visible; /* 确保横向溢出内容可见 */
|
|
|
+ position: relative;
|
|
|
}
|
|
|
|
|
|
.ch_content_box {
|
|
@@ -341,18 +423,14 @@ export default {
|
|
|
|
|
|
.ch_nav_box_bottom {
|
|
|
width: 100%;
|
|
|
- height: auto;
|
|
|
box-sizing: border-box;
|
|
|
border-top: solid 1px #eaeaea;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
- /* justify-content: flex-end; */
|
|
|
}
|
|
|
|
|
|
.ch_nav_box_middle {
|
|
|
width: 100%;
|
|
|
- height: auto;
|
|
|
- display: flex;
|
|
|
box-sizing: border-box;
|
|
|
border-top: solid 1px #eaeaea;
|
|
|
flex-direction: column;
|
|
@@ -371,10 +449,6 @@ export default {
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
|
|
|
-/* .ch_nav_box_middle_item:hover{
|
|
|
- background-color: rgb(195, 215, 247);
|
|
|
- } */
|
|
|
-
|
|
|
.ch_nav_box_middle_item_active {
|
|
|
background-color: #3681fc;
|
|
|
color: white;
|
|
@@ -386,14 +460,6 @@ export default {
|
|
|
margin-bottom: 5px;
|
|
|
}
|
|
|
|
|
|
-/* .ch_nav_box_middle_item>span{
|
|
|
- width: 24px;
|
|
|
- height: 24px;
|
|
|
- background-size: 100% 100%;
|
|
|
- background-repeat: no-repeat;
|
|
|
- background-position: center;
|
|
|
- } */
|
|
|
-
|
|
|
.ch_nav_box_bottom > div {
|
|
|
width: 100%;
|
|
|
height: 65px;
|
|
@@ -403,6 +469,7 @@ export default {
|
|
|
align-items: center;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
.ch_nav_box_bottom > div > img {
|
|
|
width: 24px;
|
|
|
height: 24px;
|
|
@@ -410,9 +477,9 @@ export default {
|
|
|
|
|
|
.ch_nav_box_top {
|
|
|
width: 100%;
|
|
|
- height: auto;
|
|
|
margin-top: auto;
|
|
|
}
|
|
|
+
|
|
|
.ch_nav_box_top > div {
|
|
|
width: 100%;
|
|
|
height: 65px;
|
|
@@ -420,8 +487,38 @@ export default {
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
cursor: pointer;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
+
|
|
|
.ch_nav_box_top > div > img {
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ transition: .3s;
|
|
|
+}
|
|
|
+
|
|
|
+.itemFold {
|
|
|
+ position: absolute;
|
|
|
+ width: 65px;
|
|
|
+ left:-65px;
|
|
|
+ top: 0;
|
|
|
+ background: rgb(255, 255, 255);
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: solid 1px #eaeaea;
|
|
|
+ /* border-top: solid 1px #eaeaea; */
|
|
|
+ z-index: 1000; /* 确保二级菜单在主菜单上层 */
|
|
|
+ border-radius: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.itemFold > div {
|
|
|
+ width: 100%;
|
|
|
+ height: 65px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.itemFold > div > img {
|
|
|
width: 24px;
|
|
|
height: 24px;
|
|
|
}
|