|
|
@@ -8,6 +8,12 @@
|
|
|
<el-input v-model="queryParams.title" placeholder="请输入小节名称" clearable size="small"
|
|
|
@keyup.enter.native="handleQuery" />
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="排序" prop="sorting" clearable size="small">
|
|
|
+ <el-select v-model="queryParams.sorting" >
|
|
|
+ <el-option label="升序" value="1" />
|
|
|
+ <el-option label="降序" value="2" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item>
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
@@ -418,7 +424,8 @@ export default {
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
courseId: null,
|
|
|
- title: null
|
|
|
+ title: null,
|
|
|
+ sorting:"1",
|
|
|
},
|
|
|
addBatchData: {
|
|
|
open: false,
|
|
|
@@ -654,19 +661,19 @@ export default {
|
|
|
}
|
|
|
return true;
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 验证缩略图尺寸
|
|
|
validateThumbnailImage(imageUrl) {
|
|
|
if (!imageUrl) {
|
|
|
this.thumbnailValidation.show = false;
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
console.log('开始验证缩略图尺寸:', imageUrl);
|
|
|
-
|
|
|
+
|
|
|
const img = new Image();
|
|
|
const config = this.thumbnailSizeConfig;
|
|
|
-
|
|
|
+
|
|
|
// 设置超时处理
|
|
|
const timeoutId = setTimeout(() => {
|
|
|
this.thumbnailValidation = {
|
|
|
@@ -676,23 +683,23 @@ export default {
|
|
|
};
|
|
|
console.log('图片加载超时');
|
|
|
}, 10000);
|
|
|
-
|
|
|
+
|
|
|
img.onload = () => {
|
|
|
clearTimeout(timeoutId);
|
|
|
const { width: actualWidth, height: actualHeight } = img;
|
|
|
const { width: expectedWidth, height: expectedHeight, tolerance } = config;
|
|
|
-
|
|
|
+
|
|
|
console.log(`实际尺寸: ${actualWidth}x${actualHeight}px, 期望尺寸: ${expectedWidth}x${expectedHeight}px`);
|
|
|
-
|
|
|
+
|
|
|
// 计算比例差异
|
|
|
const expectedRatio = expectedWidth / expectedHeight;
|
|
|
const actualRatio = actualWidth / actualHeight;
|
|
|
const ratioDiff = Math.abs(actualRatio - expectedRatio) / expectedRatio;
|
|
|
-
|
|
|
+
|
|
|
console.log(`期望比例: ${expectedRatio.toFixed(3)}, 实际比例: ${actualRatio.toFixed(3)}, 差异: ${(ratioDiff * 100).toFixed(2)}%`);
|
|
|
-
|
|
|
+
|
|
|
this.thumbnailValidation.show = true;
|
|
|
-
|
|
|
+
|
|
|
if (ratioDiff <= tolerance) {
|
|
|
this.thumbnailValidation.type = 'success';
|
|
|
this.thumbnailValidation.message = `✓ 尺寸符合要求 (实际: ${actualWidth}x${actualHeight}px)`;
|
|
|
@@ -703,11 +710,11 @@ export default {
|
|
|
console.log('尺寸验证失败');
|
|
|
}
|
|
|
};
|
|
|
-
|
|
|
+
|
|
|
img.onerror = (error) => {
|
|
|
clearTimeout(timeoutId);
|
|
|
console.error('图片加载失败:', error);
|
|
|
-
|
|
|
+
|
|
|
// 检查URL格式和可访问性
|
|
|
this.checkImageUrl(imageUrl).then(isValid => {
|
|
|
if (!isValid) {
|
|
|
@@ -725,27 +732,27 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
-
|
|
|
+
|
|
|
// 处理完整的图片URL
|
|
|
const fullImageUrl = this.getFullImageUrl(imageUrl);
|
|
|
img.crossOrigin = 'anonymous'; // 尝试处理跨域
|
|
|
img.src = fullImageUrl;
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 获取完整的图片URL
|
|
|
getFullImageUrl(imageUrl) {
|
|
|
if (!imageUrl) return '';
|
|
|
-
|
|
|
+
|
|
|
// 如果已经是完整URL(http/https开头)
|
|
|
if (imageUrl.startsWith('http://') || imageUrl.startsWith('https://')) {
|
|
|
return imageUrl;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 如果是base64
|
|
|
if (imageUrl.startsWith('data:image/')) {
|
|
|
return imageUrl;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 如果是相对路径,拼接基础URL
|
|
|
const baseUrl = process.env.VUE_APP_BASE_API || '';
|
|
|
if (imageUrl.startsWith('/')) {
|
|
|
@@ -754,7 +761,7 @@ export default {
|
|
|
return baseUrl + '/' + imageUrl;
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 检查图片URL有效性
|
|
|
async checkImageUrl(imageUrl) {
|
|
|
try {
|
|
|
@@ -766,7 +773,7 @@ export default {
|
|
|
return false;
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
getDetails(courseId, courseName, isPrivate) {
|
|
|
this.isPrivate = isPrivate
|
|
|
this.courseName = courseName
|
|
|
@@ -892,14 +899,14 @@ export default {
|
|
|
setTimeout(() => {
|
|
|
this.$refs.videoUpload.resetUpload();
|
|
|
}, 500);
|
|
|
-
|
|
|
+
|
|
|
// 如果有缩略图,验证其尺寸
|
|
|
if (this.form.thumbnail) {
|
|
|
setTimeout(() => {
|
|
|
this.validateThumbnailImage(this.form.thumbnail);
|
|
|
}, 1000);
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
this.open = true;
|
|
|
this.title = "修改课堂视频";
|
|
|
});
|