修复飞行器保险记录附件无法查看的问题
This commit is contained in:
parent
b6cd4462f2
commit
656ffdc971
@ -116,7 +116,7 @@
|
|||||||
:auto-upload="false"
|
:auto-upload="false"
|
||||||
:on-change="handleFileChange"
|
:on-change="handleFileChange"
|
||||||
:on-remove="handleFileRemove"
|
:on-remove="handleFileRemove"
|
||||||
list-type="text"
|
:on-preview="handlePreview"
|
||||||
multiple
|
multiple
|
||||||
:disabled="isView"
|
:disabled="isView"
|
||||||
>
|
>
|
||||||
@ -132,6 +132,16 @@
|
|||||||
<el-button v-if="!isView" type="primary" @click="submitForm">确 定</el-button>
|
<el-button v-if="!isView" type="primary" @click="submitForm">确 定</el-button>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
<!-- 图片预览弹窗 -->
|
||||||
|
<el-dialog
|
||||||
|
:visible.sync="previewVisible"
|
||||||
|
append-to-body
|
||||||
|
:title="previewTitle"
|
||||||
|
width="60%"
|
||||||
|
class="image-preview-dialog"
|
||||||
|
>
|
||||||
|
<img :src="previewUrl" style="width: 100%; height: auto;" />
|
||||||
|
</el-dialog>
|
||||||
</el-card>
|
</el-card>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -169,6 +179,9 @@ export default {
|
|||||||
dialogTitle: "新增保险",
|
dialogTitle: "新增保险",
|
||||||
uploadDisabled: false,
|
uploadDisabled: false,
|
||||||
isView: false, // 是否为查看模式
|
isView: false, // 是否为查看模式
|
||||||
|
previewVisible: false, // 图片预览弹窗显示状态
|
||||||
|
previewUrl: '', // 预览图片的URL
|
||||||
|
previewTitle: '', // 预览图片的标题
|
||||||
form: {
|
form: {
|
||||||
id: null,
|
id: null,
|
||||||
name: "",
|
name: "",
|
||||||
@ -209,7 +222,7 @@ export default {
|
|||||||
value: item.dictSort,
|
value: item.dictSort,
|
||||||
label: item.value
|
label: item.value
|
||||||
}))
|
}))
|
||||||
console.log(this.insuranceTypes)
|
// console.log(this.insuranceTypes)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('获取保险类型失败:', error)
|
console.error('获取保险类型失败:', error)
|
||||||
this.$message.error('获取保险类型失败')
|
this.$message.error('获取保险类型失败')
|
||||||
@ -284,6 +297,30 @@ export default {
|
|||||||
this.$message.error('获取保险详情失败');
|
this.$message.error('获取保险详情失败');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
// 处理文件预览
|
||||||
|
handlePreview(file) {
|
||||||
|
// 获取文件扩展名(转换为小写)
|
||||||
|
const fileExt = file.name.split('.').pop().toLowerCase();
|
||||||
|
|
||||||
|
// 判断文件类型
|
||||||
|
if(['jpg', 'jpeg', 'png', 'gif'].includes(fileExt)) {
|
||||||
|
// 图片预览
|
||||||
|
this.previewUrl = file.url;
|
||||||
|
this.previewTitle = file.name;
|
||||||
|
this.previewVisible = true;
|
||||||
|
} else if (fileExt === 'pdf') {
|
||||||
|
// PDF预览 - 在新窗口打开
|
||||||
|
window.open(file.url, '_blank');
|
||||||
|
} else {
|
||||||
|
// 其他文件类型 - 提示下载
|
||||||
|
this.$message.info('该文件类型不支持在线预览,请下载后查看');
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = file.url;
|
||||||
|
link.download = file.name;
|
||||||
|
link.click();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
handleDelete(row) {
|
handleDelete(row) {
|
||||||
this.$confirm('此操作将永久删除该保险记录, 是否继续?', '提示', {
|
this.$confirm('此操作将永久删除该保险记录, 是否继续?', '提示', {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
@ -461,6 +498,10 @@ export default {
|
|||||||
margin-left: 2px;
|
margin-left: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::v-deep .el-dialog__body{
|
||||||
|
padding: 0 20px 10px 20px !important;
|
||||||
|
}
|
||||||
|
|
||||||
.dialog-footer {
|
.dialog-footer {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding-top: 20px;
|
padding-top: 20px;
|
||||||
|
Loading…
Reference in New Issue
Block a user