|
|
|
@ -75,14 +75,14 @@ |
|
|
|
<!-- 资源列表 --> |
|
|
|
<!-- 资源列表 --> |
|
|
|
<el-table |
|
|
|
<el-table |
|
|
|
:data="list" |
|
|
|
:data="list" |
|
|
|
height="calc(100vh - 264px)" |
|
|
|
height="calc(100vh - 280px)" |
|
|
|
:show-header="false" |
|
|
|
:show-header="false" |
|
|
|
> |
|
|
|
> |
|
|
|
<el-table-column |
|
|
|
<el-table-column |
|
|
|
label="内容" |
|
|
|
label="内容" |
|
|
|
prop="thumbnail_path" |
|
|
|
prop="thumbnail_path" |
|
|
|
align="center" |
|
|
|
align="left" |
|
|
|
width="250" |
|
|
|
width="140" |
|
|
|
> |
|
|
|
> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-image |
|
|
|
<el-image |
|
|
|
@ -103,14 +103,15 @@ |
|
|
|
</el-table-column> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
<el-table-column |
|
|
|
label="标题" |
|
|
|
label="标题" |
|
|
|
|
|
|
|
align="left" |
|
|
|
prop="title" |
|
|
|
prop="title" |
|
|
|
:show-overflow-tooltip="true" |
|
|
|
:show-overflow-tooltip="true" |
|
|
|
/> |
|
|
|
/> |
|
|
|
<el-table-column |
|
|
|
<el-table-column |
|
|
|
label="创建时间" |
|
|
|
label="创建时间" |
|
|
|
align="center" |
|
|
|
align="left" |
|
|
|
prop="create_time" |
|
|
|
prop="create_time" |
|
|
|
width="200" |
|
|
|
:show-overflow-tooltip="true" |
|
|
|
> |
|
|
|
> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<span>{{ parseTime(scope.row.create_time) }}上传</span> |
|
|
|
<span>{{ parseTime(scope.row.create_time) }}上传</span> |
|
|
|
@ -120,7 +121,7 @@ |
|
|
|
label="文件大小" |
|
|
|
label="文件大小" |
|
|
|
align="center" |
|
|
|
align="center" |
|
|
|
prop="file_size" |
|
|
|
prop="file_size" |
|
|
|
width="120" |
|
|
|
width="100" |
|
|
|
> |
|
|
|
> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<span>{{ formatfile_size(scope.row.file_size) }}</span> |
|
|
|
<span>{{ formatfile_size(scope.row.file_size) }}</span> |
|
|
|
@ -129,8 +130,8 @@ |
|
|
|
<el-table-column |
|
|
|
<el-table-column |
|
|
|
label="操作" |
|
|
|
label="操作" |
|
|
|
align="center" |
|
|
|
align="center" |
|
|
|
width="240" |
|
|
|
|
|
|
|
class-name="small-padding fixed-width" |
|
|
|
class-name="small-padding fixed-width" |
|
|
|
|
|
|
|
width="120" |
|
|
|
> |
|
|
|
> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button |
|
|
|
<el-button |
|
|
|
@ -138,7 +139,7 @@ |
|
|
|
icon="el-icon-share" |
|
|
|
icon="el-icon-share" |
|
|
|
@click="handleShare(scope.row)" |
|
|
|
@click="handleShare(scope.row)" |
|
|
|
> |
|
|
|
> |
|
|
|
分享 |
|
|
|
<!-- 分享 --> |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
<el-button |
|
|
|
<el-button |
|
|
|
v-if="scope.row.is_mine == 1" |
|
|
|
v-if="scope.row.is_mine == 1" |
|
|
|
@ -146,7 +147,7 @@ |
|
|
|
icon="el-icon-edit" |
|
|
|
icon="el-icon-edit" |
|
|
|
@click="handleUpdateFileName(scope.row)" |
|
|
|
@click="handleUpdateFileName(scope.row)" |
|
|
|
> |
|
|
|
> |
|
|
|
修改 |
|
|
|
<!-- 修改 --> |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
<el-button |
|
|
|
<el-button |
|
|
|
v-if="scope.row.is_mine == 1" |
|
|
|
v-if="scope.row.is_mine == 1" |
|
|
|
@ -154,7 +155,7 @@ |
|
|
|
icon="el-icon-delete" |
|
|
|
icon="el-icon-delete" |
|
|
|
@click="handleRightDelete(scope.row)" |
|
|
|
@click="handleRightDelete(scope.row)" |
|
|
|
> |
|
|
|
> |
|
|
|
删除 |
|
|
|
<!-- 删除 --> |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table-column> |
|
|
|
@ -175,7 +176,7 @@ |
|
|
|
<el-dialog |
|
|
|
<el-dialog |
|
|
|
title="自定义标签名称" |
|
|
|
title="自定义标签名称" |
|
|
|
:visible.sync="tagDialogVisible" |
|
|
|
:visible.sync="tagDialogVisible" |
|
|
|
width="400px" |
|
|
|
width="17%" |
|
|
|
destroy-on-close |
|
|
|
destroy-on-close |
|
|
|
> |
|
|
|
> |
|
|
|
<el-form |
|
|
|
<el-form |
|
|
|
@ -203,14 +204,14 @@ |
|
|
|
<el-dialog |
|
|
|
<el-dialog |
|
|
|
title="修改" |
|
|
|
title="修改" |
|
|
|
:visible.sync="fileNameDialogVisible" |
|
|
|
:visible.sync="fileNameDialogVisible" |
|
|
|
width="400px" |
|
|
|
width="17%" |
|
|
|
destroy-on-close |
|
|
|
destroy-on-close |
|
|
|
> |
|
|
|
> |
|
|
|
<el-form |
|
|
|
<el-form |
|
|
|
:model="fileNameForm" |
|
|
|
:model="fileNameForm" |
|
|
|
:rules="fileNameRules" |
|
|
|
:rules="fileNameRules" |
|
|
|
ref="fileNameFormRef" |
|
|
|
ref="fileNameFormRef" |
|
|
|
label-width="80px" |
|
|
|
label-width="70px" |
|
|
|
> |
|
|
|
> |
|
|
|
<el-form-item label="标题" prop="title"> |
|
|
|
<el-form-item label="标题" prop="title"> |
|
|
|
<el-input |
|
|
|
<el-input |
|
|
|
@ -231,17 +232,15 @@ |
|
|
|
<el-dialog |
|
|
|
<el-dialog |
|
|
|
title="请选择上传文件类型" |
|
|
|
title="请选择上传文件类型" |
|
|
|
:visible.sync="uploadTypeDialogVisible" |
|
|
|
:visible.sync="uploadTypeDialogVisible" |
|
|
|
width="400px" |
|
|
|
width="18%" |
|
|
|
:show-footer="false" |
|
|
|
:show-footer="false" |
|
|
|
> |
|
|
|
> |
|
|
|
<div class="upload-type-box"> |
|
|
|
<div class="upload-type-box"> |
|
|
|
<div class="type-item" @click="selectFileType('video')"> |
|
|
|
<div class="type-item" @click="selectFileType('video')"> |
|
|
|
<i class="el-icon-video-play" /> |
|
|
|
<img src="@/assets/images/knowledge/mp4.svg" alt="视频文件" /> |
|
|
|
<span>视频文件(MP4)</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="type-item" @click="selectFileType('pdf')"> |
|
|
|
<div class="type-item" @click="selectFileType('pdf')"> |
|
|
|
<i class="el-icon-document" /> |
|
|
|
<img src="@/assets/images/knowledge/pdf.svg" alt="PDF文件" /> |
|
|
|
<span>PDF 文件</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
</el-dialog> |
|
|
|
@ -660,12 +659,12 @@ export default { |
|
|
|
if (!file) return; |
|
|
|
if (!file) return; |
|
|
|
|
|
|
|
|
|
|
|
// 文件名校验 |
|
|
|
// 文件名校验 |
|
|
|
const validateResult = this.validateFileName(file.name); |
|
|
|
// const validateResult = this.validateFileName(file.name); |
|
|
|
if (!validateResult.valid) { |
|
|
|
// if (!validateResult.valid) { |
|
|
|
this.$modal.msgError(validateResult.message); |
|
|
|
// this.$modal.msgError(validateResult.message); |
|
|
|
event.target.value = ""; |
|
|
|
// event.target.value = ""; |
|
|
|
return; |
|
|
|
// return; |
|
|
|
} |
|
|
|
// } |
|
|
|
|
|
|
|
|
|
|
|
// 文件大小校验(可选,根据需求启用) |
|
|
|
// 文件大小校验(可选,根据需求启用) |
|
|
|
// const sizeResult = this.validateFileSize(file.size); |
|
|
|
// const sizeResult = this.validateFileSize(file.size); |
|
|
|
@ -698,7 +697,10 @@ export default { |
|
|
|
// 2. 检查文件名长度(不含扩展名最多20字符) |
|
|
|
// 2. 检查文件名长度(不含扩展名最多20字符) |
|
|
|
const nameWithoutExt = fileName.replace(/\.[^/.]+$/, ""); |
|
|
|
const nameWithoutExt = fileName.replace(/\.[^/.]+$/, ""); |
|
|
|
if (nameWithoutExt.length > 20) { |
|
|
|
if (nameWithoutExt.length > 20) { |
|
|
|
return { valid: false, message: "文件名(不含扩展名)不能超过20个字符" }; |
|
|
|
return { |
|
|
|
|
|
|
|
valid: false, |
|
|
|
|
|
|
|
message: "文件名(不含扩展名)不能超过20个字符", |
|
|
|
|
|
|
|
}; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 3. 检查是否以数字开头 |
|
|
|
// 3. 检查是否以数字开头 |
|
|
|
@ -715,7 +717,10 @@ export default { |
|
|
|
// 5. 检查是否包含特殊字符(Windows文件名限制) |
|
|
|
// 5. 检查是否包含特殊字符(Windows文件名限制) |
|
|
|
const invalidChars = /[\\/:*?"<>|]/; |
|
|
|
const invalidChars = /[\\/:*?"<>|]/; |
|
|
|
if (invalidChars.test(fileName)) { |
|
|
|
if (invalidChars.test(fileName)) { |
|
|
|
return { valid: false, message: "文件名不能包含 \\ / : * ? \" < > | 等特殊字符" }; |
|
|
|
return { |
|
|
|
|
|
|
|
valid: false, |
|
|
|
|
|
|
|
message: '文件名不能包含 \\ / : * ? " < > | 等特殊字符', |
|
|
|
|
|
|
|
}; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
return { valid: true, message: "" }; |
|
|
|
return { valid: true, message: "" }; |
|
|
|
@ -725,7 +730,13 @@ export default { |
|
|
|
// 例如:限制最大100MB |
|
|
|
// 例如:限制最大100MB |
|
|
|
const maxSize = 100 * 1024 * 1024; |
|
|
|
const maxSize = 100 * 1024 * 1024; |
|
|
|
if (size > maxSize) { |
|
|
|
if (size > maxSize) { |
|
|
|
return { valid: false, message: `文件大小不能超过100MB,当前文件大小:${(size / (1024 * 1024)).toFixed(2)}MB` }; |
|
|
|
return { |
|
|
|
|
|
|
|
valid: false, |
|
|
|
|
|
|
|
message: `文件大小不能超过100MB,当前文件大小:${( |
|
|
|
|
|
|
|
size / |
|
|
|
|
|
|
|
(1024 * 1024) |
|
|
|
|
|
|
|
).toFixed(2)}MB`, |
|
|
|
|
|
|
|
}; |
|
|
|
} |
|
|
|
} |
|
|
|
return { valid: true, message: "" }; |
|
|
|
return { valid: true, message: "" }; |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -914,8 +925,7 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
// 资源缩略图 |
|
|
|
// 资源缩略图 |
|
|
|
.resource-thumb { |
|
|
|
.resource-thumb { |
|
|
|
width: 230px; |
|
|
|
height: 62px; |
|
|
|
height: 80px; |
|
|
|
|
|
|
|
border-radius: 4px; |
|
|
|
border-radius: 4px; |
|
|
|
cursor: pointer; |
|
|
|
cursor: pointer; |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|
@ -930,29 +940,35 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
.upload-type-box { |
|
|
|
.upload-type-box { |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|
justify-content: space-around; |
|
|
|
justify-content: center; |
|
|
|
padding: 20px 0; |
|
|
|
gap: 40px; |
|
|
|
|
|
|
|
padding: 25px 0; |
|
|
|
|
|
|
|
|
|
|
|
.type-item { |
|
|
|
.type-item { |
|
|
|
width: 120px; |
|
|
|
width: 90px; |
|
|
|
height: 120px; |
|
|
|
height: 90px; |
|
|
|
border: 1px dashed #ccc; |
|
|
|
background: #009696; |
|
|
|
border-radius: 8px; |
|
|
|
border-radius: 12px; |
|
|
|
display: flex; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
justify-content: center; |
|
|
|
cursor: pointer; |
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
transition: transform 0.2s ease; |
|
|
|
|
|
|
|
|
|
|
|
i { |
|
|
|
img { |
|
|
|
font-size: 40px; |
|
|
|
width: 70px; |
|
|
|
color: #409eff; |
|
|
|
height: 70px; |
|
|
|
margin-bottom: 10px; |
|
|
|
margin-bottom: 10px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
span { |
|
|
|
|
|
|
|
color: #fff; |
|
|
|
|
|
|
|
font-size: 14px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
&:hover { |
|
|
|
border-color: #409eff; |
|
|
|
transform: scale(1.05); |
|
|
|
background: #f5f7fa; |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|