|
|
@@ -60,6 +60,16 @@
|
|
|
<p class="imageSize"
|
|
|
v-if="imageSize">上传图片尺寸为：{{ imageSize }}</p>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item v-if="type == 7"
|
|
|
+ label="知识类别"
|
|
|
+ prop="subType">
|
|
|
+ <el-select v-model="form.subType">
|
|
|
+ <el-option label="演奏小技巧" :value="1"></el-option>
|
|
|
+ <el-option label="乐理基础" :value="2"></el-option>
|
|
|
+ <el-option label="乐器保养" :value="3"></el-option>
|
|
|
+ <el-option label="乐曲演奏展示" :value="4"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="内容"
|
|
|
prop="content">
|
|
|
<!-- bidirectional data binding（双向数据绑定） -->
|
|
|
@@ -97,9 +107,25 @@
|
|
|
:rules="dialogFormRules">
|
|
|
<el-form-item label="封面图地址"
|
|
|
label-width="90px">
|
|
|
- <el-input v-model="dialogForm.poster"
|
|
|
+ <!-- <el-input v-model="dialogForm.poster"
|
|
|
style="width: 100%;"
|
|
|
- autocomplete="off"></el-input>
|
|
|
+ autocomplete="off"></el-input> -->
|
|
|
+ <el-upload class="avatar-uploader"
|
|
|
+ style="line-height: 0;display: inline-block"
|
|
|
+ action="/api-web/uploadFile"
|
|
|
+ :headers="headers"
|
|
|
+ :show-file-list="false"
|
|
|
+ v-loading="uploadImgLoading"
|
|
|
+ accept=".jpg, .jpeg, .png"
|
|
|
+ :on-success="handleImgSuccess"
|
|
|
+ :on-error="handleUploadImgError"
|
|
|
+ :before-upload="beforeImgUpload">
|
|
|
+ <img v-if="dialogForm.poster"
|
|
|
+ :src="dialogForm.poster"
|
|
|
+ class="avatar" />
|
|
|
+ <i v-else
|
|
|
+ class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
+ </el-upload>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="视频类型"
|
|
|
label-width="90px">
|
|
|
@@ -285,6 +311,7 @@ export default {
|
|
|
videoUrl: null
|
|
|
},
|
|
|
uploadLoading: false,
|
|
|
+ uploadImgLoading: false,
|
|
|
fileList: [],
|
|
|
dialogFormRules: {
|
|
|
url: [{ required: true, message: "请输入视频地址", trigger: "blur" }],
|
|
|
@@ -299,6 +326,7 @@ export default {
|
|
|
status: 1,
|
|
|
content: null,
|
|
|
tenantId: null,
|
|
|
+ subType: null,
|
|
|
},
|
|
|
rules: {
|
|
|
title: [
|
|
|
@@ -312,7 +340,8 @@ export default {
|
|
|
{ required: true, message: "请选择封面图", trigger: "blur" }
|
|
|
],
|
|
|
content: [{ required: true, message: "请编辑内容", trigger: "blur" }],
|
|
|
- tenantId: [{ required: true, message: "请选择适用范围", trigger: "change" }]
|
|
|
+ tenantId: [{ required: true, message: "请选择适用范围", trigger: "change" }],
|
|
|
+ subType: [{ required: true, message: "请选择知识类别", trigger: "change" }],
|
|
|
},
|
|
|
imageSize: null
|
|
|
};
|
|
|
@@ -333,6 +362,7 @@ export default {
|
|
|
status: 1,
|
|
|
content: null,
|
|
|
tenantId: null,
|
|
|
+ subType: null
|
|
|
};
|
|
|
this.$refs["form"].resetFields();
|
|
|
|
|
|
@@ -513,13 +543,41 @@ export default {
|
|
|
status: result.status,
|
|
|
memo: result.memo,
|
|
|
content: result.content,
|
|
|
- tenantId: result.tenantId.toString()
|
|
|
+ tenantId: result.tenantId.toString(),
|
|
|
+ subType: result.subType ? result.subType : null
|
|
|
};
|
|
|
this.dataInfo.updateTime = result.updateTime
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
+ handleUploadImgError(file) {
|
|
|
+ this.uploadImgLoading = false
|
|
|
+ this.$message.error('上传失败')
|
|
|
+ },
|
|
|
+ handleImgSuccess(res, file) {
|
|
|
+ this.uploadImgLoading = false
|
|
|
+ this.dialogForm.poster = res.data.url
|
|
|
+ },
|
|
|
+ beforeImgUpload (file) {
|
|
|
+ const imageType = {
|
|
|
+ "image/png": true,
|
|
|
+ "image/jpeg": true
|
|
|
+ };
|
|
|
+ const isImage = imageType[file.type];
|
|
|
+ const isLt2M = file.size / 1024 / 1024 < 2;
|
|
|
+ console.log(isImage, isLt2M)
|
|
|
+ if (!isImage) {
|
|
|
+ this.$message.error("只能上传图片格式!");
|
|
|
+ }
|
|
|
+ if (!isLt2M) {
|
|
|
+ this.$message.error("上传图片大小不能超过 2MB!");
|
|
|
+ }
|
|
|
+ if(isImage && isLt2M) {
|
|
|
+ this.uploadImgLoading = true
|
|
|
+ }
|
|
|
+ return isImage && isLt2M;
|
|
|
+ },
|
|
|
handleAvatarSuccess (res, file) {
|
|
|
this.form.coverImage = res.data.url;
|
|
|
},
|
|
|
@@ -535,7 +593,7 @@ export default {
|
|
|
this.$message.error("只能上传图片格式!");
|
|
|
}
|
|
|
if (!isLt2M) {
|
|
|
- this.$message.error("上传头像图片大小不能超过 2MB!");
|
|
|
+ this.$message.error("上传图片大小不能超过 2MB!");
|
|
|
}
|
|
|
return isImage && isLt2M;
|
|
|
},
|
