mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-10 11:26:45 +08:00
cc1af6a11e
- 新增 AudioComp.vue 组件，支持音频播放与设置 - 新增 EditorComp.vue 组件，集成富文本编辑器用于图文内容 - 修改 chooseFileList.vue，增加文件上传功能与类型适配 - 更新 createCourse.vue，完善课程章节内容管理逻辑 - 升级 useCourseData.js 和 useCreateCourseMaps.js，增强类型映射与数据结构 - 优化 BasicTable.vue，移除调试日志并调整样式 - 引入 quill 及相关插件依赖以支持富文本编辑功能
107 lines
2.8 KiB
Vue
107 lines
2.8 KiB
Vue
<script setup>
|
|
import {
|
|
ElForm,
|
|
ElFormItem,
|
|
ElInput,
|
|
ElInputNumber,
|
|
ElRadio,
|
|
ElRadioGroup,
|
|
} from "element-plus";
|
|
defineOptions({
|
|
resType: 20,
|
|
});
|
|
const props = defineProps({
|
|
dialogVideoForm: {
|
|
type: Object,
|
|
default: () => ({
|
|
name: "",
|
|
filePath: "",
|
|
isDrag: true,
|
|
completeSetup: 0,
|
|
setupTage: 0,
|
|
}),
|
|
},
|
|
isPreview: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
});
|
|
|
|
import { ref, watch } from "vue";
|
|
// Create a reactive copy of the prop for local modifications
|
|
const localDialogVideoForm = ref({ ...props.dialogVideoForm });
|
|
|
|
// Watch for changes in the prop and update the local copy
|
|
watch(
|
|
() => props.dialogVideoForm,
|
|
(newVal) => {
|
|
Object.assign(localDialogVideoForm.value, newVal);
|
|
},
|
|
{ deep: true }
|
|
);
|
|
|
|
// Emit updates to parent component
|
|
const emit = defineEmits(["update:dialogVideoForm"]);
|
|
|
|
// Update form values and emit changes
|
|
const updateFormValue = (field, value) => {
|
|
localDialogVideoForm.value[field] = value;
|
|
emit("update:dialogVideoForm", { ...localDialogVideoForm.value });
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<el-form>
|
|
<el-form-item label="视频名称" v-if="!isPreview">
|
|
<el-input
|
|
v-model="localDialogVideoForm.name"
|
|
@update:modelValue="(val) => updateFormValue('name', val)"
|
|
></el-input>
|
|
</el-form-item>
|
|
<!-- Added video type prop -->
|
|
<audio
|
|
controls
|
|
style="width: 100%; max-height: 400px"
|
|
class="mb10"
|
|
:key="localDialogVideoForm.filePath"
|
|
:src="'http://home.hzer.xyz:9960/upload/' + localDialogVideoForm.filePath"
|
|
>
|
|
您的浏览器不支持video
|
|
</audio>
|
|
<el-form-item label="是否允许拖拽" v-if="!isPreview">
|
|
<el-radio-group
|
|
:model-value="localDialogVideoForm.isDrag"
|
|
@update:modelValue="(val) => updateFormValue('isDrag', val)"
|
|
size="small"
|
|
>
|
|
<el-radio :label="true" border>是</el-radio>
|
|
<el-radio :label="false" border>否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="完成规则设置" v-if="!isPreview">
|
|
<el-radio-group
|
|
:model-value="localDialogVideoForm.completeSetup"
|
|
@update:modelValue="(val) => updateFormValue('completeSetup', val)"
|
|
>
|
|
<el-radio :label="0">默认(系统自动控制)</el-radio>
|
|
<el-radio :label="1">
|
|
按进度
|
|
<el-input-number
|
|
:disabled="localDialogVideoForm.completeSetup === 0"
|
|
:model-value="localDialogVideoForm.setupTage"
|
|
@update:modelValue="(val) => updateFormValue('setupTage', val)"
|
|
size="mini"
|
|
:min="0"
|
|
:max="100"
|
|
label="描述文字"
|
|
controls-position="right"
|
|
></el-input-number>
|
|
%
|
|
</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-form>
|
|
</template>
|
|
|
|
<style scoped lang="scss"></style>
|