0725
This commit is contained in:
parent
21f43237bf
commit
d5124852d0
@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
|
||||
|
||||
<el-form-item label="保险公司名称" prop="company">
|
||||
<el-input
|
||||
v-model="queryParams.company"
|
||||
@ -34,7 +33,8 @@
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
>新增
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
@ -44,7 +44,8 @@
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
>删除
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
@ -53,24 +54,36 @@
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
>导出
|
||||
</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="insuranceList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="负责人1" align="center" prop="userName" />
|
||||
<el-table-column label="负责人2" align="center" prop="userNames" />
|
||||
<!-- <el-table-column label="车辆" align="center" prop="carName" />-->
|
||||
<el-table-column label="车牌号" align="carNo" prop="carNo" />
|
||||
<el-table-column label="保险公司名称" align="center" prop="company" />
|
||||
<el-table-column type="selection" width="55" align="center"/>
|
||||
<el-table-column label="负责人1" align="center" prop="userName"/>
|
||||
<el-table-column label="负责人2" align="center" prop="userNames"/>
|
||||
<el-table-column label="车牌号" align="carNo" prop="carNo"/>
|
||||
<el-table-column label="保险公司名称" align="center" prop="company"/>
|
||||
<el-table-column label="内容" align="center" prop="content">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="viewContentFun(scope.row.content)" type="text" slot="reference">查看</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="保险金额" align="center" prop="money" />
|
||||
<el-table-column label="附件" align="center" prop="attachments">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-if="scope.row.attachments"
|
||||
@click="previewAttachments(scope.row.attachments)"
|
||||
type="text"
|
||||
>
|
||||
{{ getAttachmentButtonText(scope.row.attachments) }}
|
||||
</el-button>
|
||||
<span v-else>无附件</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="保险金额" align="center" prop="money"/>
|
||||
<el-table-column label="保险到期时间" align="center" prop="insuranceTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.insuranceTime, '{y}-{m}-{d}') }}</span>
|
||||
@ -83,13 +96,15 @@
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
>修改
|
||||
</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
>删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@ -106,42 +121,40 @@
|
||||
<el-dialog :title="title" :visible.sync="open" width="750px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<el-form-item label="负责人1" prop="userName">
|
||||
<el-input v-model="form.userName" placeholder="请输入负责人1" />
|
||||
<el-input v-model="form.userName" placeholder="请输入负责人1"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="负责人2" prop="userNames">
|
||||
<el-input v-model="form.userNames" placeholder="请输入负责人2" />
|
||||
<el-input v-model="form.userNames" placeholder="请输入负责人2"/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="车辆" prop="carId">
|
||||
<template>
|
||||
<el-select v-model="form.carId" placeholder="请选择车辆">
|
||||
<el-option
|
||||
v-for="item in carLists"
|
||||
:key="item.id"
|
||||
:label="item.carModel"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-form-item>-->
|
||||
<el-form-item label="车牌号" prop="carNo">
|
||||
<el-input v-model="form.carNo" placeholder="请输入车牌号" />
|
||||
<el-input v-model="form.carNo" placeholder="请输入车牌号"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="保险公司名称" prop="company">
|
||||
<el-input v-model="form.company" placeholder="请输入保险公司名称" />
|
||||
<el-input v-model="form.company" placeholder="请输入保险公司名称"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="保险内容" prop="content">
|
||||
<editor v-model="form.content" :min-height="192"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="附件" prop="attachments">
|
||||
<drive-file-upload
|
||||
:fileSize="5"
|
||||
:limit="10"
|
||||
:fileType="['doc', 'xls', 'ppt', 'txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif', 'docx', 'xlsx', 'pptx', 'wps']"
|
||||
v-model="form.attachments"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="保险金额" prop="money">
|
||||
<el-input v-model="form.money" placeholder="请输入保险金额" />
|
||||
<el-input v-model="form.money" placeholder="请输入保险金额"/>
|
||||
</el-form-item>
|
||||
<el-form-item label="保险到期时间" prop="insuranceTime">
|
||||
<el-date-picker clearable
|
||||
v-model="form.insuranceTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择保险到期时间">
|
||||
v-model="form.insuranceTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择保险到期时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -150,42 +163,87 @@
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<el-dialog title="查看" :visible.sync="viewFlag" width="65%" append-to-body>
|
||||
|
||||
<el-dialog title="查看" :visible.sync="viewFlag" width="65%" append-to-body>
|
||||
<div style="box-sizing: border-box;padding: 15px;overflow: hidden" v-html="viewContent"></div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 附件预览对话框 -->
|
||||
<el-dialog
|
||||
:title="'附件预览 - ' + currentFileName"
|
||||
:visible.sync="isShowFile"
|
||||
width="80%"
|
||||
append-to-body
|
||||
@closed="handlePreviewClose"
|
||||
>
|
||||
|
||||
<div class="preview-container">
|
||||
<!-- 统一使用 iframe 预览 -->
|
||||
<iframe
|
||||
v-if="currentFileUrl"
|
||||
:src="currentFileUrl"
|
||||
frameborder="0"
|
||||
class="preview-content"
|
||||
/>
|
||||
|
||||
<!-- 文件列表 -->
|
||||
<div class="file-list">
|
||||
<el-table
|
||||
:data="attachmentList"
|
||||
height="100%"
|
||||
@row-click="handleFileClick"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="附件列表"
|
||||
min-width="180"
|
||||
>
|
||||
<template #default="{row}">
|
||||
<div :class="{'active-file': row.originalUrl === currentOriginalUrl}">
|
||||
<i :class="getFileIcon(row.name)"></i>
|
||||
{{ row.name }}
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="downloadCurrentFile">
|
||||
<i class="el-icon-download"></i> 下载
|
||||
</el-button>
|
||||
<el-button type="primary" @click="isShowFile = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listInsurance, getInsurance, delInsurance, addInsurance, updateInsurance ,listCards} from "./api/insurance";
|
||||
import { listInsurance, getInsurance, delInsurance, addInsurance, updateInsurance, listCards } from './api/insurance'
|
||||
import editor from '@/components/Editor/index.vue'
|
||||
import driveFileUpload from '@/components/FileUpload/index.vue'
|
||||
import ImagePreview from '@/components/ImagePreview'
|
||||
|
||||
export default {
|
||||
name: "Insurance",
|
||||
components: {editor},
|
||||
name: 'Insurance',
|
||||
components: { editor, driveFileUpload, ImagePreview },
|
||||
data() {
|
||||
return {
|
||||
viewContent:"",
|
||||
viewFlag:false,
|
||||
carLists:[],
|
||||
// 遮罩层
|
||||
inspectionFileUrl: process.env.VUE_APP_INSPECTION_FILE_URL,
|
||||
viewContent: '',
|
||||
viewFlag: false,
|
||||
carLists: [],
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 保险管理表格数据
|
||||
insuranceList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
title: '',
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
@ -195,67 +253,227 @@ export default {
|
||||
company: null,
|
||||
content: null,
|
||||
money: null,
|
||||
insuranceTime: null,
|
||||
insuranceTime: null
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
form: {
|
||||
attachments: null
|
||||
},
|
||||
isShowFile: false,
|
||||
attachmentList: [],
|
||||
currentFileUrl: '',
|
||||
currentOriginalUrl: '',
|
||||
currentFileName: '',
|
||||
currentFileType: '',
|
||||
rules: {
|
||||
userName: [
|
||||
{ required: true, message: "负责人不能为空", trigger: "blur" }
|
||||
{ required: true, message: '负责人不能为空', trigger: 'blur' }
|
||||
],
|
||||
carId: [
|
||||
{ required: true, message: "车辆id不能为空", trigger: "blur" }
|
||||
{ required: true, message: '车辆id不能为空', trigger: 'blur' }
|
||||
],
|
||||
company: [
|
||||
{ required: true, message: "保险公司名称不能为空", trigger: "blur" }
|
||||
{ required: true, message: '保险公司名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
content: [
|
||||
{ required: true, message: "保险内容不能为空", trigger: "blur" }
|
||||
{ required: true, message: '保险内容不能为空', trigger: 'blur' }
|
||||
],
|
||||
money: [
|
||||
{ required: true, message: "保险金额不能为空", trigger: "blur" }
|
||||
{ required: true, message: '保险金额不能为空', trigger: 'blur' }
|
||||
],
|
||||
insuranceTime: [
|
||||
{ required: true, message: "保险到期时间不能为空", trigger: "blur" }
|
||||
{ required: true, message: '保险到期时间不能为空', trigger: 'blur' }
|
||||
],
|
||||
carNo: [
|
||||
{ required: true, message: "保险到期时间不能为空", trigger: "blur" }
|
||||
],
|
||||
{ required: true, message: '车牌号不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isImage() {
|
||||
return ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'].includes(this.currentFileType)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.listCards();
|
||||
this.getList()
|
||||
this.listCards()
|
||||
},
|
||||
methods: {
|
||||
|
||||
viewContentFun(data){
|
||||
this.viewContent =data;
|
||||
this.viewFlag = true;
|
||||
viewContentFun(data) {
|
||||
this.viewContent = data
|
||||
this.viewFlag = true
|
||||
},
|
||||
|
||||
listCards(){
|
||||
// 预览附件
|
||||
previewAttachments(attachments) {
|
||||
try {
|
||||
const attachmentUrls = this.parseAttachmentString(attachments)
|
||||
console.log('attachmentUrls', attachmentUrls)
|
||||
|
||||
this.attachmentList = attachmentUrls.map(url => ({
|
||||
name: this.getFileNameFromPath(url),
|
||||
url: this.getOfficeOnlinePreviewUrl(url),
|
||||
originalUrl: url,
|
||||
fileType: this.getFileExtension(url)
|
||||
}))
|
||||
|
||||
if (this.attachmentList.length > 0) {
|
||||
this.currentFileUrl = this.attachmentList[0].url
|
||||
this.currentOriginalUrl = this.attachmentList[0].originalUrl
|
||||
this.currentFileName = this.attachmentList[0].name
|
||||
this.currentFileType = this.attachmentList[0].fileType.toLowerCase()
|
||||
this.isShowFile = true
|
||||
} else {
|
||||
this.$message.warning('未找到可预览的附件')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('附件预览错误:', error)
|
||||
this.$message.error(`预览失败: ${error.message}`)
|
||||
}
|
||||
},
|
||||
// 生成 Office Online 预览 URL
|
||||
getOfficeOnlinePreviewUrl(fileUrl) {
|
||||
|
||||
const ext = this.getFileExtension(fileUrl).toLowerCase()
|
||||
const supportedTypes = ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'csv', 'rtf']
|
||||
|
||||
const previewUrl = fileUrl.includes('http') ? this.inspectionFileUrl + fileUrl.replace(/^.*?uploads\//, 'uploads/') : this.previewUrl + fileUrl
|
||||
if (ext == 'pdf' || ext == 'txt') {
|
||||
console.log('pdf', previewUrl)
|
||||
return previewUrl
|
||||
} else {
|
||||
return `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(fileUrl)}`
|
||||
}
|
||||
|
||||
return fileUrl
|
||||
},
|
||||
|
||||
// 从路径中提取文件名
|
||||
getFileNameFromPath(url) {
|
||||
if (!url) return '未命名文件'
|
||||
|
||||
try {
|
||||
// 处理URL编码的文件名（如中文）
|
||||
const pathname = new URL(url).pathname
|
||||
const decoded = decodeURIComponent(pathname)
|
||||
return decoded.split('/').pop() || '未命名文件'
|
||||
} catch {
|
||||
// 如果不是标准URL，尝试直接处理
|
||||
const cleanUrl = url.split('?')[0].split('#')[0]
|
||||
return cleanUrl.split('/').pop() || cleanUrl.split('\\').pop() || '未命名文件'
|
||||
}
|
||||
},
|
||||
|
||||
// 获取文件扩展名
|
||||
getFileExtension(filename) {
|
||||
return filename.split('.').pop().toLowerCase()
|
||||
},
|
||||
|
||||
// 处理文件点击
|
||||
handleFileClick(row) {
|
||||
console.log('当前文件预览地址:', row.url)
|
||||
this.currentFileUrl = row.url
|
||||
this.currentOriginalUrl = row.originalUrl
|
||||
this.currentFileName = row.name
|
||||
this.currentFileType = row.fileType.toLowerCase()
|
||||
},
|
||||
|
||||
// 下载当前文件
|
||||
downloadCurrentFile() {
|
||||
if (!this.currentOriginalUrl) return
|
||||
|
||||
const link = document.createElement('a')
|
||||
link.href = this.currentOriginalUrl
|
||||
link.target = '_blank'
|
||||
link.download = this.currentFileName
|
||||
document.body.appendChild(link)
|
||||
link.click()
|
||||
document.body.removeChild(link)
|
||||
},
|
||||
|
||||
// 关闭预览时的清理
|
||||
handlePreviewClose() {
|
||||
this.currentFileUrl = ''
|
||||
this.currentFileName = ''
|
||||
this.attachmentList = []
|
||||
},
|
||||
|
||||
// 解析附件字符串
|
||||
parseAttachmentString(attachments) {
|
||||
const isValidUrl = url => /^https?:\/\/[^\s]+$/.test(url)
|
||||
|
||||
if (
|
||||
Array.isArray(attachments) &&
|
||||
attachments.length === 1 &&
|
||||
typeof attachments[0] === 'string' &&
|
||||
attachments[0].includes(',') &&
|
||||
attachments[0].includes('http')
|
||||
) {
|
||||
attachments = attachments[0] // 解包为字符串
|
||||
}
|
||||
|
||||
if (!attachments) return []
|
||||
|
||||
if (Array.isArray(attachments)) {
|
||||
return attachments.filter(item => typeof item === 'string' && isValidUrl(item))
|
||||
}
|
||||
|
||||
if (typeof attachments === 'string') {
|
||||
return attachments.split(',')
|
||||
.map(item => item.trim())
|
||||
.filter(isValidUrl)
|
||||
}
|
||||
|
||||
return []
|
||||
},
|
||||
|
||||
getAttachmentButtonText(attachments) {
|
||||
const count = this.parseAttachmentString(attachments).length
|
||||
return count > 0 ? `查看附件(${count})` : '无附件'
|
||||
},
|
||||
|
||||
listCards() {
|
||||
listCards().then(response => {
|
||||
this.carLists = response.data;
|
||||
});
|
||||
this.carLists = response.data
|
||||
})
|
||||
},
|
||||
|
||||
/** 查询保险管理列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
this.loading = true
|
||||
listInsurance(this.queryParams).then(response => {
|
||||
this.insuranceList = response.data.records;
|
||||
this.total = response.data.total;
|
||||
this.loading = false;
|
||||
});
|
||||
this.insuranceList = response.data.records.map(item => {
|
||||
item.attachments = this.parseAttachmentString(item.attachments)
|
||||
return item
|
||||
})
|
||||
this.total = response.data.total
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// 取消按钮
|
||||
|
||||
// 获取文件图标
|
||||
getFileIcon(filename) {
|
||||
const ext = this.getFileExtension(filename)
|
||||
const iconMap = {
|
||||
pdf: 'el-icon-document-pdf',
|
||||
doc: 'el-icon-document-word',
|
||||
docx: 'el-icon-document-word',
|
||||
xls: 'el-icon-document-excel',
|
||||
xlsx: 'el-icon-document-excel',
|
||||
ppt: 'el-icon-document-ppt',
|
||||
pptx: 'el-icon-document-ppt',
|
||||
jpg: 'el-icon-picture',
|
||||
png: 'el-icon-picture',
|
||||
gif: 'el-icon-picture',
|
||||
txt: 'el-icon-document'
|
||||
}
|
||||
return iconMap[ext] || 'el-icon-document'
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
this.open = false
|
||||
this.reset()
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
id: null,
|
||||
@ -269,78 +487,123 @@ export default {
|
||||
createTime: null,
|
||||
createBy: null,
|
||||
updateTime: null,
|
||||
updateBy: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
updateBy: null,
|
||||
attachments: null
|
||||
}
|
||||
this.resetForm('form')
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
this.resetForm('queryForm')
|
||||
this.handleQuery()
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.id)
|
||||
this.single = selection.length!==1
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加保险管理";
|
||||
this.reset()
|
||||
this.open = true
|
||||
this.title = '添加保险管理'
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
this.reset()
|
||||
const id = row.id || this.ids
|
||||
getInsurance(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改保险管理";
|
||||
});
|
||||
this.form = response.data
|
||||
if (!this.form.attachments) {
|
||||
this.form.attachments = []
|
||||
}
|
||||
this.open = true
|
||||
this.title = '修改保险管理'
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
let attachments = []
|
||||
if (Array.isArray(this.form.attachments)) {
|
||||
attachments = this.form.attachments.map(item => item.url || item)
|
||||
} else if (this.form.attachments) {
|
||||
attachments = [this.form.attachments.url || this.form.attachments]
|
||||
}
|
||||
|
||||
const formData = {
|
||||
...this.form,
|
||||
attachments: attachments.join(',')
|
||||
}
|
||||
|
||||
if (this.form.id != null) {
|
||||
updateInsurance(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
updateInsurance(formData).then(response => {
|
||||
this.$modal.msgSuccess('修改成功')
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
} else {
|
||||
addInsurance(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
addInsurance(formData).then(response => {
|
||||
this.$modal.msgSuccess('新增成功')
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
const ids = row.id || this.ids
|
||||
this.$modal.confirm('是否确认删除保险管理编号为"' + ids + '"的数据项？').then(function() {
|
||||
return delInsurance(ids);
|
||||
return delInsurance(ids)
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('drivingSchool/system/insurance/export', {
|
||||
...this.queryParams
|
||||
}, `insurance_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.preview-container {
|
||||
display: flex;
|
||||
height: 70vh;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.preview-content {
|
||||
flex: 3;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 4px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
iframe[type="application/pdf"] {
|
||||
background-color: #525659; /* PDF查看器的背景色 */
|
||||
}
|
||||
|
||||
.file-list {
|
||||
flex: 1;
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
.active-file {
|
||||
color: #409EFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -70,7 +70,8 @@
|
||||
<div v-if="item.type == 2">
|
||||
<img src="../../../assets/images/wenjian.png" style="width: 100px;height: 100px;" v-if="!item.isImage">
|
||||
<img :src="item.filePath.includes('http') ? item.filePath : imageUrl + item.filePath"
|
||||
style="width: 100px;height: 100px;" v-else>
|
||||
style="width: 100px;height: 100px;" v-else
|
||||
>
|
||||
|
||||
<div>{{ item.fileName }}</div>
|
||||
</div>
|
||||
@ -94,7 +95,8 @@
|
||||
v-for="item in staffList"
|
||||
:key="item.userId"
|
||||
:label="item.name"
|
||||
:value="item.userId">
|
||||
:value="item.userId"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
@ -108,7 +110,8 @@
|
||||
<audio v-if="isAudioType" class="preview-iframe" controls>
|
||||
<source :src="selectFile.filePath.includes('http')
|
||||
? inspectionFileUrl + selectFile.filePath.replace(/^.*?uploads\//, 'uploads/')
|
||||
: imageUrl + selectFile.filePath"/>
|
||||
: imageUrl + selectFile.filePath"
|
||||
/>
|
||||
</audio>
|
||||
<!-- 左侧预览区域 -->
|
||||
<iframe
|
||||
@ -123,7 +126,8 @@
|
||||
:src="selectFile.filePath.includes('http')
|
||||
? inspectionFileUrl + selectFile.filePath.replace(/^.*?uploads\//, 'uploads/')
|
||||
: imageUrl + selectFile.filePath"
|
||||
v-if="isImage">
|
||||
v-if="isImage"
|
||||
>
|
||||
</image-preview>
|
||||
|
||||
<!-- 如果selectFile.filePath包含http就不拼接imageUrl -->
|
||||
@ -146,11 +150,13 @@
|
||||
:data="inspectionFileList.filter(file => file.type !== '1')"
|
||||
height="100%"
|
||||
@row-click="handleFileClick"
|
||||
:row-class-name="getRowClassName">
|
||||
:row-class-name="getRowClassName"
|
||||
>
|
||||
<el-table-column
|
||||
prop="fileName"
|
||||
label="文件列表"
|
||||
min-width="180">
|
||||
min-width="180"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<!-- 仅当 type 不是 '1' 时才显示 -->
|
||||
<div class="file-item">
|
||||
@ -204,7 +210,8 @@
|
||||
:fileSize="30"
|
||||
:limit="1"
|
||||
:fileType="['doc', 'xls', 'ppt', 'txt', 'pdf','png','jpg','jpeg','gif','docx','xlsx','pptx','wps']"
|
||||
v-model="form.filePath"/>
|
||||
v-model="form.filePath"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-cascader
|
||||
@ -228,7 +235,8 @@
|
||||
v-model="form.warnTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择提醒时间">
|
||||
placeholder="请选择提醒时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -251,7 +259,8 @@
|
||||
:on-success="handleUploadSuccess"
|
||||
:before-upload="handleUpload"
|
||||
:headers="headers"
|
||||
:file-list="fileList">
|
||||
:file-list="fileList"
|
||||
>
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
@ -261,7 +270,8 @@
|
||||
v-model="form.warnTime"
|
||||
type="date"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="请选择提醒时间">
|
||||
placeholder="请选择提醒时间"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<!-- 上传进度 -->
|
||||
@ -288,19 +298,19 @@ import {
|
||||
listByPermission,
|
||||
getFileRecord,
|
||||
addBatchInspectionFile, queryTreeFolder
|
||||
} from "./api/file";
|
||||
} from './api/file'
|
||||
import driveFileUpload from '@/components/FileUpload/index.vue'
|
||||
import {getAccessToken} from "@/utils/auth";
|
||||
import { getAccessToken } from '@/utils/auth'
|
||||
// import cos from "@/utils/cosUpload"
|
||||
import cos from "@/utils/cos"
|
||||
import cos from '@/utils/cos'
|
||||
|
||||
export default {
|
||||
name: "DriveFile",
|
||||
components: {driveFileUpload},
|
||||
name: 'DriveFile',
|
||||
components: { driveFileUpload },
|
||||
data() {
|
||||
return {
|
||||
uploadProgress: 0,
|
||||
uploadFileUrl: process.env.VUE_APP_BASE_API + "/admin-api/infra/file/cosUpload",
|
||||
uploadFileUrl: process.env.VUE_APP_BASE_API + '/admin-api/infra/file/cosUpload',
|
||||
imageUrl: process.env.VUE_APP_FILE_API,
|
||||
previewUrl: process.env.VUE_APP_PREVIEW_URL,
|
||||
inspectionFileUrl: process.env.VUE_APP_INSPECTION_FILE_URL,
|
||||
@ -309,7 +319,7 @@ export default {
|
||||
// 选中数组
|
||||
ids: [],
|
||||
fileList: [],
|
||||
headers: {Authorization: "Bearer " + getAccessToken()}, // 设置上传的请求头部
|
||||
headers: { Authorization: 'Bearer ' + getAccessToken() }, // 设置上传的请求头部
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
@ -321,7 +331,7 @@ export default {
|
||||
// inspectionFile表格数据
|
||||
inspectionFileList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
title: '',
|
||||
selectFile: {
|
||||
isImage: false
|
||||
},
|
||||
@ -342,7 +352,7 @@ export default {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: null,
|
||||
fatherId: null,
|
||||
fatherId: null
|
||||
},
|
||||
fatherId: '',
|
||||
oldFatherId: '',
|
||||
@ -354,18 +364,18 @@ export default {
|
||||
fileList: [
|
||||
{
|
||||
required: false,
|
||||
message: "文件路径不能为空",
|
||||
trigger: "blur"
|
||||
message: '文件路径不能为空',
|
||||
trigger: 'blur'
|
||||
},
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || value.length === 0) {
|
||||
callback(new Error("请至少上传一个文件"));
|
||||
callback(new Error('请至少上传一个文件'))
|
||||
} else {
|
||||
callback();
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: "change"
|
||||
trigger: 'change'
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -377,13 +387,13 @@ export default {
|
||||
fileUrl: '',
|
||||
isImage: false,
|
||||
folderList: []
|
||||
};
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isAudioType() {
|
||||
const audioExtensions = ['mp3', 'wav', 'ogg', 'aac', 'm4a', 'flac'];
|
||||
const fileExtension = this.selectFile.fileType;
|
||||
return audioExtensions.includes(fileExtension);
|
||||
const audioExtensions = ['mp3', 'wav', 'ogg', 'aac', 'm4a', 'flac']
|
||||
const fileExtension = this.selectFile.fileType
|
||||
return audioExtensions.includes(fileExtension)
|
||||
|
||||
// 或者如果已有 fileType 字段（根据 MIME type 判断）：
|
||||
// return this.fileType.startsWith('audio/');
|
||||
@ -396,11 +406,11 @@ export default {
|
||||
servicePackageId: 'jiaxiao',
|
||||
dictType: 'drive_file_role',
|
||||
fatherId: this.$route.query.folderId || null // 明确初始状态
|
||||
};
|
||||
}
|
||||
|
||||
this.fatherId = this.queryParams.fatherId;
|
||||
this.getList();
|
||||
this.queryTreeFolder();
|
||||
this.fatherId = this.queryParams.fatherId
|
||||
this.getList()
|
||||
this.queryTreeFolder()
|
||||
},
|
||||
methods: {
|
||||
queryTreeFolder() {
|
||||
@ -418,9 +428,9 @@ export default {
|
||||
// this.form.fatherId = e[e.length - 1]
|
||||
},
|
||||
formatDate(timestamp) {
|
||||
if (!timestamp) return "";
|
||||
const date = new Date(timestamp);
|
||||
return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, "0")}-${date.getDate().toString().padStart(2, "0")}`;
|
||||
if (!timestamp) return ''
|
||||
const date = new Date(timestamp)
|
||||
return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`
|
||||
},
|
||||
/* backFile() {
|
||||
if (this.fatherId) {
|
||||
@ -440,12 +450,12 @@ export default {
|
||||
}, */
|
||||
backFile() {
|
||||
// 获取当前文件夹的父文件夹ID
|
||||
const currentFatherId = this.fatherId;
|
||||
const currentFatherId = this.fatherId
|
||||
|
||||
if (currentFatherId) {
|
||||
// 如果有当前文件夹ID，查询其父文件夹
|
||||
getInspectionFile(currentFatherId).then(response => {
|
||||
const newFatherId = response.data.fatherId;
|
||||
const newFatherId = response.data.fatherId
|
||||
|
||||
// 更新查询参数
|
||||
this.queryParams = {
|
||||
@ -453,32 +463,32 @@ export default {
|
||||
fatherId: newFatherId,
|
||||
pageNum: 1,
|
||||
fileName: newFatherId ? '' : this.queryParams.fileName // 在根目录保留文件名搜索
|
||||
};
|
||||
}
|
||||
|
||||
this.fatherId = newFatherId;
|
||||
this.fatherId = newFatherId
|
||||
|
||||
// 获取文件夹列表
|
||||
this.getFolderList({
|
||||
fatherId: newFatherId,
|
||||
servicePackageId: 'jiaxiao', // 确保带上服务包ID
|
||||
dictType: 'drive_file_role' // 确保带上字典类型
|
||||
});
|
||||
})
|
||||
}).catch(error => {
|
||||
console.error("获取父文件夹失败:", error);
|
||||
});
|
||||
console.error('获取父文件夹失败:', error)
|
||||
})
|
||||
} else {
|
||||
// 如果已经在根目录，刷新当前列表
|
||||
this.queryParams = {
|
||||
...this.queryParams,
|
||||
fatherId: null, // 明确设置为null
|
||||
pageNum: 1
|
||||
};
|
||||
}
|
||||
|
||||
this.getFolderList({
|
||||
fatherId: null,
|
||||
servicePackageId: 'jiaxiao',
|
||||
dictType: 'drive_file_role'
|
||||
});
|
||||
})
|
||||
}
|
||||
},
|
||||
//预览文件
|
||||
@ -487,8 +497,7 @@ export default {
|
||||
this.fileUrl = 'https://view.officeapps.live.com/op/view.aspx?src=' +
|
||||
(item.filePath.includes('http')
|
||||
? this.inspectionFileUrl + item.filePath.replace(/^.*?uploads\//, 'uploads/')
|
||||
: this.previewUrl + item.filePath);
|
||||
|
||||
: this.previewUrl + item.filePath)
|
||||
|
||||
// this.fileUrl = 'https://view.xdocin.com/view?src=' + this.imageUrl + item.filePath
|
||||
console.log(this.fileUrl)
|
||||
@ -511,10 +520,10 @@ export default {
|
||||
})
|
||||
}
|
||||
},
|
||||
getRowClassName({row}) {
|
||||
getRowClassName({ row }) {
|
||||
console.log('返回的class', row.id === this.selectFile.id ? 'highlight-row' : '')
|
||||
// 如果当前行是选中的文件，添加高亮样式
|
||||
return row.id === this.selectFile.id ? 'highlight-row' : '';
|
||||
return row.id === this.selectFile.id ? 'highlight-row' : ''
|
||||
},
|
||||
clickStaff(fileId) {
|
||||
this.fileId = fileId
|
||||
@ -545,20 +554,20 @@ export default {
|
||||
// },
|
||||
/** 查询inspectionFile列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
this.loading = true
|
||||
const params = {
|
||||
...this.queryParams,
|
||||
servicePackageId: 'jiaxiao',
|
||||
dictType: 'drive_file_role'
|
||||
};
|
||||
}
|
||||
|
||||
listByPermission(params).then(response => {
|
||||
this.inspectionFileList = response.data;
|
||||
this.inspectionFileList = response.data
|
||||
if (response.data.length > 0) {
|
||||
this.queryParams.fatherId = response.data[0].fatherId;
|
||||
this.queryParams.fatherId = response.data[0].fatherId
|
||||
}
|
||||
this.loading = false;
|
||||
});
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
/* getFolderList(data) {
|
||||
this.loading = true;
|
||||
@ -574,22 +583,22 @@ export default {
|
||||
});
|
||||
}, */
|
||||
getFolderList(data) {
|
||||
this.loading = true;
|
||||
this.loading = true
|
||||
|
||||
// 确保包含必要的查询参数
|
||||
const params = {
|
||||
...data,
|
||||
servicePackageId: data.servicePackageId || 'jiaxiao',
|
||||
dictType: data.dictType || 'drive_file_role'
|
||||
};
|
||||
}
|
||||
|
||||
listByPermission(params).then(response => {
|
||||
this.inspectionFileList = response.data;
|
||||
this.loading = false;
|
||||
this.inspectionFileList = response.data
|
||||
this.loading = false
|
||||
}).catch(error => {
|
||||
console.error("获取文件夹列表失败:", error);
|
||||
this.loading = false;
|
||||
});
|
||||
console.error('获取文件夹列表失败:', error)
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
fatherji(id) {
|
||||
this.fatherId = id
|
||||
@ -627,25 +636,25 @@ export default {
|
||||
// const link = document.createElement('a');
|
||||
// 判断filePath中是否包含http
|
||||
if (item.filePath.includes('http')) {
|
||||
window.open(item.filePath);
|
||||
return;
|
||||
window.open(item.filePath)
|
||||
return
|
||||
}
|
||||
let href = "https://www.nuoyunr.com/minio/" + item.filePath; // 文件路径
|
||||
let href = 'https://www.nuoyunr.com/minio/' + item.filePath // 文件路径
|
||||
// var lastIndexOf = item.filePath.lastIndexOf(".");
|
||||
// link.download = item.fileName+item.filePath.substr(lastIndexOf); // 下载的文件名
|
||||
window.open(href);
|
||||
window.open(href)
|
||||
// // 触发下载
|
||||
// link.click();
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
this.open = false
|
||||
this.reset()
|
||||
},
|
||||
// 取消按钮
|
||||
cancelBatch() {
|
||||
this.openBatch = false;
|
||||
this.resetBatch();
|
||||
this.openBatch = false
|
||||
this.resetBatch()
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
@ -661,8 +670,8 @@ export default {
|
||||
createBy: null,
|
||||
updateTime: null,
|
||||
updateBy: null
|
||||
};
|
||||
this.resetForm("form");
|
||||
}
|
||||
this.resetForm('form')
|
||||
},
|
||||
// 表单重置
|
||||
resetBatch() {
|
||||
@ -678,21 +687,21 @@ export default {
|
||||
createBy: null,
|
||||
updateTime: null,
|
||||
updateBy: null
|
||||
};
|
||||
}
|
||||
this.fileList = []
|
||||
this.resetForm("formBatch");
|
||||
this.resetForm('formBatch')
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
console.log('查询参数', this.queryParams)
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.daterangeWarnTime = [];
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
this.daterangeWarnTime = []
|
||||
this.resetForm('queryForm')
|
||||
this.handleQuery()
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
@ -702,86 +711,86 @@ export default {
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "新增";
|
||||
this.reset()
|
||||
this.open = true
|
||||
this.title = '新增'
|
||||
},
|
||||
/** 批量新增按钮操作 */
|
||||
handleAddBatch() {
|
||||
this.resetBatch();
|
||||
this.openBatch = true;
|
||||
this.title = "新增";
|
||||
this.resetBatch()
|
||||
this.openBatch = true
|
||||
this.title = '新增'
|
||||
},
|
||||
handleE(item) {
|
||||
this.reset(item);
|
||||
this.form = item;
|
||||
this.open = true;
|
||||
this.title = "修改";
|
||||
this.reset(item)
|
||||
this.form = item
|
||||
this.open = true
|
||||
this.title = '修改'
|
||||
console.log(item)
|
||||
//判断文件夹树中是否有item的id或者item子类的id如果有禁用
|
||||
this.folderList = this.disableIfExistsInTree(this.folderList, item.id)
|
||||
this.folderList = this.disableIfExistsInTree(this.folderList, item.id)
|
||||
},
|
||||
disableIfExistsInTree(treeData, targetId) {
|
||||
console.log(treeData, targetId, '执行');
|
||||
console.log(treeData, targetId, '执行')
|
||||
|
||||
function traverse(nodes, parentDisabled = false) {
|
||||
return nodes.map(node => {
|
||||
let newNode = { ...node };
|
||||
let newNode = { ...node }
|
||||
|
||||
// 递归处理子节点，同时传递父级的禁用状态
|
||||
if (newNode.children && newNode.children.length > 0) {
|
||||
newNode.children = traverse(newNode.children, newNode.value === targetId || parentDisabled);
|
||||
newNode.children = traverse(newNode.children, newNode.value === targetId || parentDisabled)
|
||||
}
|
||||
|
||||
// 只禁用目标节点及其子节点，不影响兄弟节点
|
||||
if (newNode.value === targetId || parentDisabled) {
|
||||
newNode.disabled = true;
|
||||
newNode.disabled = true
|
||||
}
|
||||
|
||||
return newNode;
|
||||
});
|
||||
return newNode
|
||||
})
|
||||
}
|
||||
|
||||
return traverse(treeData);
|
||||
return traverse(treeData)
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset();
|
||||
this.reset()
|
||||
const id = row.id || this.ids
|
||||
getInspectionFile(id).then(response => {
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改inspectionFile";
|
||||
});
|
||||
this.form = response.data
|
||||
this.open = true
|
||||
this.title = '修改inspectionFile'
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
this.$refs['form'].validate(valid => {
|
||||
console.log(this.form, '内容')
|
||||
if (!this.form.filePath && this.form.type == "2") {
|
||||
this.$modal.msgError("请上传文件");
|
||||
return false;
|
||||
if (!this.form.filePath && this.form.type == '2') {
|
||||
this.$modal.msgError('请上传文件')
|
||||
return false
|
||||
}
|
||||
if (valid) {
|
||||
if (this.form.id != null) {
|
||||
updateInspectionFile(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.$modal.msgSuccess('修改成功')
|
||||
this.form = {}
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
} else {
|
||||
this.form.fatherId = this.fatherId
|
||||
this.form.servicePackageId = 'jiaxiao'
|
||||
addInspectionFile(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.$modal.msgSuccess('新增成功')
|
||||
this.form = {}
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitBatchForm() {
|
||||
@ -795,21 +804,21 @@ export default {
|
||||
item.warnTime = this.form.warnTime
|
||||
})
|
||||
addBatchInspectionFile(this.fileList).then(res => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.$modal.msgSuccess('新增成功')
|
||||
this.openBatch = false
|
||||
this.resetBatch()
|
||||
this.getList();
|
||||
this.getList()
|
||||
})
|
||||
},
|
||||
/** 分配文件权限给对应用户 */
|
||||
saveStaff() {
|
||||
console.log(this.selectStaffList, "66666666666666")
|
||||
console.log(this.selectStaffList, '66666666666666')
|
||||
const data = {
|
||||
userIds: this.selectStaffList,
|
||||
fileId: this.fileId
|
||||
}
|
||||
assignAuthority(data).then(res => {
|
||||
this.$modal.msgSuccess("分配权限成功")
|
||||
this.$modal.msgSuccess('分配权限成功')
|
||||
})
|
||||
this.selectStaffList = []
|
||||
this.isShow = false
|
||||
@ -821,28 +830,28 @@ export default {
|
||||
},
|
||||
//新建删除
|
||||
Deleteanniu(id) {
|
||||
this.$modal.confirm('是否确认删除inspectionFile编号为"' + id + '"的数据项？').then(function () {
|
||||
return delInspectionFile(id);
|
||||
this.$modal.confirm('是否确认删除inspectionFile编号为"' + id + '"的数据项？').then(function() {
|
||||
return delInspectionFile(id)
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
}).catch(() => {
|
||||
});
|
||||
})
|
||||
},
|
||||
getFileNameWithoutExtension(filename) {
|
||||
if (!filename.includes('.')) return filename; // 没有后缀直接返回
|
||||
return filename.substring(0, filename.lastIndexOf('.'));
|
||||
if (!filename.includes('.')) return filename // 没有后缀直接返回
|
||||
return filename.substring(0, filename.lastIndexOf('.'))
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const ids = row.id || this.ids;
|
||||
this.$modal.confirm('是否确认删除inspectionFile编号为"' + ids + '"的数据项？').then(function () {
|
||||
return delInspectionFile(ids);
|
||||
const ids = row.id || this.ids
|
||||
this.$modal.confirm('是否确认删除inspectionFile编号为"' + ids + '"的数据项？').then(function() {
|
||||
return delInspectionFile(ids)
|
||||
}).then(() => {
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
}).catch(() => {
|
||||
});
|
||||
})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
@ -885,45 +894,45 @@ export default {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$nextTick(() => {
|
||||
|
||||
this.uploadProgress = 0; // 初始化进度条
|
||||
console.log("uploadProgress:", this.uploadProgress)
|
||||
});
|
||||
this.uploadProgress = 0 // 初始化进度条
|
||||
console.log('uploadProgress:', this.uploadProgress)
|
||||
})
|
||||
// 生成 COS 上传路径
|
||||
const fileName = `${Date.now()}_${file.name}`;
|
||||
const uploadPath = `files/${fileName}`; // 自定义 COS 存储路径
|
||||
const fileName = `${Date.now()}_${file.name}`
|
||||
const uploadPath = `files/${fileName}` // 自定义 COS 存储路径
|
||||
|
||||
// 腾讯云 COS SDK 上传
|
||||
cos.putObject(
|
||||
{
|
||||
Bucket: "lanan-1319802091",
|
||||
Region: "ap-chengdu",
|
||||
Bucket: 'lanan-1319802091',
|
||||
Region: 'ap-chengdu',
|
||||
Key: uploadPath,
|
||||
Body: file,
|
||||
onProgress: (progressData) => {
|
||||
// console.log("上传进度:", progressData);
|
||||
this.$nextTick(() => {
|
||||
this.uploadProgress = Math.round(progressData.percent * 100); // 更新进度
|
||||
console.log("uploadProgress2:", this.uploadProgress)
|
||||
});
|
||||
},
|
||||
this.uploadProgress = Math.round(progressData.percent * 100) // 更新进度
|
||||
console.log('uploadProgress2:', this.uploadProgress)
|
||||
})
|
||||
}
|
||||
},
|
||||
(err, data) => {
|
||||
this.$modal.closeLoading();
|
||||
this.uploadProgress = null; // 上传完成后隐藏进度条
|
||||
this.$modal.closeLoading()
|
||||
this.uploadProgress = null // 上传完成后隐藏进度条
|
||||
if (err) {
|
||||
this.$message.error("上传失败：" + err.message);
|
||||
return reject();
|
||||
this.$message.error('上传失败：' + err.message)
|
||||
return reject()
|
||||
}
|
||||
this.$message.success("上传成功：" + data.Location);
|
||||
this.fileList.push({name: file.name, url: data.Location});
|
||||
resolve();
|
||||
this.$message.success('上传成功：' + data.Location)
|
||||
this.fileList.push({ name: file.name, url: data.Location })
|
||||
resolve()
|
||||
}
|
||||
);
|
||||
});
|
||||
)
|
||||
})
|
||||
},
|
||||
// 直接使用 cos-js-sdk 进行上传
|
||||
async uploadToCOS({file}) {
|
||||
const fileName = `files/${file.name}`; // 你的存储路径
|
||||
async uploadToCOS({ file }) {
|
||||
const fileName = `files/${file.name}` // 你的存储路径
|
||||
cos.putObject(
|
||||
{
|
||||
Bucket: 'lanan-1319802091', // 你的存储桶名称
|
||||
@ -933,20 +942,20 @@ export default {
|
||||
},
|
||||
(err, data) => {
|
||||
if (err) {
|
||||
console.error('上传失败', err);
|
||||
console.error('上传失败', err)
|
||||
} else {
|
||||
console.log('上传成功', data);
|
||||
console.log('上传成功', data)
|
||||
}
|
||||
}
|
||||
);
|
||||
)
|
||||
},
|
||||
// 触发文件上传
|
||||
async handleUpload(file) {
|
||||
this.$modal.loading("正在上传文件，请稍候...");
|
||||
this.$modal.loading('正在上传文件，请稍候...')
|
||||
try {
|
||||
this.totalUploadCount += 1
|
||||
console.log('开始上传:', file);
|
||||
const fileKey = `uploads/${Date.now()}_${file.name}`; // 防止重名
|
||||
console.log('开始上传:', file)
|
||||
const fileKey = `uploads/${Date.now()}_${file.name}` // 防止重名
|
||||
|
||||
const data = await cos.uploadFile({
|
||||
Bucket: 'lanan-1319802091',
|
||||
@ -955,75 +964,74 @@ export default {
|
||||
Body: file,
|
||||
SliceSize: 1024 * 1024 * 5, // 5MB 触发分块上传
|
||||
onProgress: progressData => {
|
||||
console.log('上传进度:', progressData);
|
||||
console.log('上传进度:', progressData)
|
||||
},
|
||||
onTaskReady: id => {
|
||||
this.taskId = id;
|
||||
},
|
||||
});
|
||||
this.taskId = id
|
||||
}
|
||||
})
|
||||
|
||||
console.log('上传成功:', data);
|
||||
console.log('上传成功:', data)
|
||||
this.uploadProgress++
|
||||
if (this.uploadProgress === this.totalUploadCount) {
|
||||
this.$message.success('上传成功');
|
||||
this.uploadProgress = 0;
|
||||
this.$message.success('上传成功')
|
||||
this.uploadProgress = 0
|
||||
this.totalUploadCount = 0
|
||||
this.$modal.closeLoading();
|
||||
this.$modal.closeLoading()
|
||||
}
|
||||
|
||||
// 手动修改fileList的值，需要在befoupload中添加
|
||||
if (!this.fileList) {
|
||||
this.fileList = [];
|
||||
this.fileList = []
|
||||
}
|
||||
|
||||
// 上传成功后手动更新 fileList
|
||||
this.fileList.push({
|
||||
name: file.name,
|
||||
url: `https://${data.Location}` // 腾讯云返回的 URL
|
||||
});
|
||||
})
|
||||
|
||||
// return this.fileList
|
||||
|
||||
} catch (error) {
|
||||
console.error('上传失败:', error);
|
||||
this.$modal.closeLoading();
|
||||
console.error('上传失败:', error)
|
||||
this.$modal.closeLoading()
|
||||
}
|
||||
|
||||
return false; // 阻止 el-upload 默认上传
|
||||
return false // 阻止 el-upload 默认上传
|
||||
},
|
||||
|
||||
|
||||
// 暂停上传
|
||||
pauseUpload() {
|
||||
if (this.taskId) {
|
||||
cos.pauseTask(this.taskId);
|
||||
console.log('上传已暂停:', this.taskId);
|
||||
cos.pauseTask(this.taskId)
|
||||
console.log('上传已暂停:', this.taskId)
|
||||
}
|
||||
},
|
||||
|
||||
// 继续上传
|
||||
resumeUpload() {
|
||||
if (this.taskId) {
|
||||
cos.restartTask(this.taskId);
|
||||
console.log('上传已继续:', this.taskId);
|
||||
cos.restartTask(this.taskId)
|
||||
console.log('上传已继续:', this.taskId)
|
||||
}
|
||||
},
|
||||
|
||||
// 取消上传
|
||||
cancelUpload() {
|
||||
if (this.taskId) {
|
||||
cos.cancelTask(this.taskId);
|
||||
console.log('上传已取消:', this.taskId);
|
||||
cos.cancelTask(this.taskId)
|
||||
console.log('上传已取消:', this.taskId)
|
||||
}
|
||||
},
|
||||
|
||||
// 文件个数超出
|
||||
handleExceed() {
|
||||
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`);
|
||||
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`)
|
||||
},
|
||||
// 上传失败
|
||||
handleUploadError(err) {
|
||||
this.$modal.msgError("上传图片失败，请重试");
|
||||
this.$modal.msgError('上传图片失败，请重试')
|
||||
this.$modal.closeLoading()
|
||||
},
|
||||
// 上传成功回调
|
||||
@ -1032,7 +1040,7 @@ export default {
|
||||
// if (res.code === 0) {
|
||||
// // edit by 芋道源码
|
||||
// this.uploadList.push({name: res.data.name, url: res.data.url});
|
||||
this.uploadedSuccessfully();
|
||||
this.uploadedSuccessfully()
|
||||
// } else {
|
||||
// this.number--;
|
||||
// this.$modal.closeLoading();
|
||||
@ -1045,15 +1053,15 @@ export default {
|
||||
uploadedSuccessfully() {
|
||||
console.log('这是上传结束')
|
||||
if (this.number > 0 && this.uploadList.length === this.number) {
|
||||
this.fileList = this.fileList.concat(this.uploadList);
|
||||
this.uploadList = [];
|
||||
this.number = 0;
|
||||
this.fileList = this.fileList.concat(this.uploadList)
|
||||
this.uploadList = []
|
||||
this.number = 0
|
||||
// this.$emit("input", this.listToString(this.fileList));
|
||||
this.$modal.closeLoading();
|
||||
this.$modal.closeLoading()
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.content-box {
|
||||
@ -1109,7 +1117,7 @@ export default {
|
||||
/* 时间样式 */
|
||||
.step-time {
|
||||
font-size: 14px;
|
||||
//color: #666;
|
||||
//color: #666;
|
||||
}
|
||||
|
||||
/* 文件名称高亮 */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user