This commit is contained in:
闫晓茹 2023-04-23 17:31:39 +08:00
parent e3d4203981
commit e673f6b069
2 changed files with 120 additions and 126 deletions

View File

@ -9,6 +9,7 @@
:show-file-list="false"
:headers="headers"
style="display: none"
:data="filetype"
ref="upload"
v-if="this.type == 'url'"
></el-upload>
@ -29,39 +30,47 @@ export default {
/* 编辑器的内容 */
value: {
type: String,
default: ""
default: "",
},
/* 高度 */
height: {
type: Number,
default: null
default: null,
},
/* 最小高度 */
minHeight: {
type: Number,
default: null
default: null,
},
/* 只读 */
readOnly: {
type: Boolean,
default: false
default: false,
},
// (MB)
fileSize: {
type: Number,
default: 5
default: 5,
},
/* 类型base64格式、url格式 */
type: {
type: String,
default: "url"
}
default: "url",
},
url: {
type: String,
default: "",
},
filetypes: {
type: String,
default: "",
},
},
data() {
return {
uploadUrl: process.env.VUE_APP_BASE_API + "/common/richTextPictureUrl", //
uploadUrl: process.env.VUE_APP_BASE_API, //
headers: {
Authorization: "Bearer " + getToken()
Authorization: "Bearer " + getToken(),
},
Quill: null,
currentValue: "",
@ -81,14 +90,23 @@ export default {
[{ color: [] }, { background: [] }], //
[{ align: [] }], //
["clean"], //
["link", "image"] //
]
["link", "image"], //
],
},
placeholder: "请输入内容",
readOnly: this.readOnly
}
readOnly: this.readOnly,
},
filetype: {
type: "",
},
};
},
created() {
this.uploadUrl = process.env.VUE_APP_BASE_API + this.url;
console.log(this.uploadUrl);
this.filetype.type = this.filetypes;
console.log(this.filetype);
},
computed: {
styles() {
let style = {};
@ -99,7 +117,7 @@ export default {
style.height = `${this.height}px`;
}
return style;
}
},
},
watch: {
value: {
@ -111,8 +129,8 @@ export default {
}
}
},
immediate: true
}
immediate: true,
},
},
mounted() {
this.init();
@ -127,7 +145,7 @@ export default {
//
if (this.type == "url") {
let toolbar = this.Quill.getModule("toolbar");
toolbar.addHandler("image", value => {
toolbar.addHandler("image", (value) => {
this.uploadType = "image";
if (value) {
this.$refs.upload.$children[0].$refs.input.click();
@ -189,8 +207,8 @@ export default {
},
handleUploadError() {
this.$message.error("图片插入失败");
}
}
},
},
};
</script>

View File

@ -364,90 +364,6 @@
>{{ form.trainingCategoryName }}</el-button
>
</el-form-item>
<el-form-item
label="项目视频"
prop="itemDirectoryUrl"
v-if="form.trainingItemType == 'VIDEO_LEARNING'"
>
<el-table
ref="trainingItemDirectoryList"
style="margin-top: 20px"
:data="form.trainingItemDirectoryList"
>
<el-table-column label="视频" align="center" width="300">
<template slot-scope="scope">
<stationAcatar
@imgUrl="imgUrl4"
@item="itemDirectoryUrl"
:tovideo="scope.row.itemDirectoryUrl"
:type="'itemDirectoryUrl'"
:item="scope.row"
/>
</template>
</el-table-column>
<el-table-column
label="培训项目章节名称"
align="center"
width="150"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectoryName"
placeholder="请输入培训项目章节名称"
></el-input>
</template>
</el-table-column>
<el-table-column
label="培训项目章节标题"
align="center"
width="150"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectoryTitle"
placeholder="请输入培训项目章节标题"
></el-input>
</template>
</el-table-column>
<el-table-column
label="培训项目章节内容简介"
align="center"
width="150"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectoryIntroduce"
placeholder="请输入培训项目章节内容简介"
></el-input>
</template>
</el-table-column>
<el-table-column
label="培训项目章节排序"
align="center"
width="150"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectorySort"
placeholder="请输入培训项目章节排序"
></el-input>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="250">
<template slot-scope="scope">
<el-button size="mini" type="text" @click="addPictureUrl"
>新增</el-button
>
<el-button
size="mini"
type="text"
@click="delPictureUrl(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item label="培训项目价格" prop="trainingItemPrice">
<el-input
@ -513,7 +429,7 @@
<el-input
type="textarea"
:rows="5"
style="width: 340px"
style="width: 840px"
placeholder="请输入培训项目详情"
v-model="form.trainingItemDetails"
></el-input>
@ -534,6 +450,8 @@
>
<editor
@imgs="imgs"
:url="'/system/trainingItem/uploadUrl'"
:filetypes="'trainingItemContentUrl'"
v-model="form.trainingItemContent"
:min-height="192"
/>
@ -630,6 +548,74 @@
placeholder="请输入培训项目排序"
/>
</el-form-item>
<el-form-item
label=""
prop="itemDirectoryUrl"
v-if="form.trainingItemType == 'VIDEO_LEARNING'"
>
<el-table
ref="trainingItemDirectoryList"
style="margin-top: 20px;"
:data="form.trainingItemDirectoryList"
>
<el-table-column label="章节视频" align="center" width="300">
<template slot-scope="scope">
<stationAcatar
@imgUrl="imgUrl4"
@item="itemDirectoryUrl"
:tovideo="scope.row.itemDirectoryUrl"
:type="'itemDirectoryUrl'"
:item="scope.row"
/>
</template>
</el-table-column>
<el-table-column label="章节名称" align="center" width="150">
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectoryName"
placeholder="请输入章节名称"
></el-input>
</template>
</el-table-column>
<el-table-column label="章节标题" align="center" width="150">
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectoryTitle"
placeholder="请输入章节标题"
></el-input>
</template>
</el-table-column>
<el-table-column label="章节内容简介" align="center" width="150">
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectoryIntroduce"
placeholder="请输入章节内容简介"
></el-input>
</template>
</el-table-column>
<el-table-column label="章节排序" align="center" width="150">
<template slot-scope="scope">
<el-input
v-model="scope.row.itemDirectorySort"
placeholder="请输入章节排序"
></el-input>
</template>
</el-table-column>
<el-table-column label="操作" align="center" width="250">
<template slot-scope="scope">
<el-button size="mini" type="text" @click="addPictureUrl"
>新增</el-button
>
<el-button
size="mini"
type="text"
@click="delPictureUrl(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
@ -852,25 +838,6 @@ export default {
this.form.trainingItemDirectoryList.splice(index, 1);
}
},
// delPictureUrl(item) {
// if (item.idd && !item.id) {
// if (this.form.trainingItemDirectoryList.length == 1) {
// this.$message.error("");
// } else {
// this.form.trainingItemDirectoryList =
// this.form.trainingItemDirectoryList.filter(
// (e) => e.idd != item.idd
// );
// }
// } else if (!item.idd && item.id) {
// if (this.form.trainingItemDirectoryList.length == 1) {
// this.$message.error("");
// } else {
// this.form.trainingItemDirectoryList =
// this.form.trainingItemDirectoryList.filter((e) => e.id != item.id);
// }
// }
// },
itemDirectoryUrl(item) {
let items = JSON.parse(item);
console.log(items);
@ -888,9 +855,7 @@ export default {
});
}
},
imgUrl4(imgUrl) {
// this.form.trainingItemDirectoryList.itemDirectoryUrl = imgUrl;
},
imgUrl4(imgUrl) {},
imgs(item) {
this.imgsurl.pictureUrlList.push(item);
},
@ -1039,6 +1004,17 @@ export default {
} else {
this.form.trainingItemStartTimeStr = "00:00:00";
}
this.form.trainingItemDirectoryList.forEach((e) => {
if (
e.itemDirectoryIntroduce == null &&
e.itemDirectoryName == null &&
e.itemDirectoryTitle == null &&
e.itemDirectoryUrl == null &&
e.itemDirectorySort == null
) {
this.form.trainingItemDirectoryList = [];
}
});
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.trainingItemId != null) {