<template>
|
<view class="container">
|
<cu-custom :bgColor="NavBarColor" :isBack="true" backRouterName="productionTask">
|
<block slot="backText">返回</block>
|
<block slot="content">设备详情</block>
|
</cu-custom>
|
<view class="container">
|
|
|
<uni-forms ref="form" :modelValue="formData" validate-trigger="bind" err-show-type="undertext">
|
<uni-group top="1">
|
|
<uni-forms-item :label-width="100" required name="num" label="设备编号:">
|
<uni-easyinput v-model="formData.equipmentCode" :disabled="true" />
|
</uni-forms-item>
|
|
<uni-forms-item :label-width="100" name="remark" label="设备名称:">
|
<uni-easyinput v-model="formData.equipmentName" :disabled="true" />
|
</uni-forms-item>
|
<!-- <uni-forms-item :label-width="100" name="outNum" label="关键设备标识:">
|
<uni-easyinput v-model="formData.equipmentImportance" :disabled="true" />
|
</uni-forms-item> -->
|
<view class="text-gray margin-bottom-lg">—————————— 基本信息 ——————————</view>
|
<uni-forms-item :label-width="100" name="taskCode" label="维修状态:">
|
<uni-easyinput :disabled="true" v-model="formData.repairStatus_dictText" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="endLocation" label="保养状态:">
|
<uni-easyinput :disabled="true" v-model="formData.maintenanceStatus_dictText" />
|
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="endLocation" label="使用车间:">
|
<uni-easyinput :disabled="true" v-model="formData.orgId_dictText" />
|
|
</uni-forms-item>
|
|
<uni-forms-item :label-width="100" name="endLocation" label="安装位置:">
|
<uni-easyinput :disabled="true" v-model="formData.installationPosition" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="endLocation" label="技术状态:">
|
<uni-easyinput :disabled="true" v-model="formData.technologyStatus_dictText" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="endLocation" label="设备管理员:">
|
<uni-easyinput :disabled="true" v-model="formData.equipmentManager_dictText" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="endLocation" label="出厂日期:">
|
<uni-easyinput :disabled="true" v-model="formData.leaveFactoryDate" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="outNum" label="设备文档:">
|
<uni-file-picker v-model="fileLists" :extension="['.pdf']" @fail="uploadFail"
|
:list-styles="listStyles" :delIcon="del" :max-count="5" file-mediatype="all"
|
@downloadFile="downloadFile" @select="onFileSelect" @delete="onFileDelete">
|
<button size="mini" type="primary">点击上传</button>
|
</uni-file-picker>
|
</uni-forms-item>
|
</uni-group>
|
</uni-forms>
|
|
|
<view class="file-list margin-sm">
|
<view class="file-item" v-for="(file, index) in this.selectedFiles" :key="index">
|
<view class="file-icon">
|
<!-- 文件图标 -->
|
<image src="/static/icon_file.png" style="height: 25px; width: 25px; margin-right: 10px;"
|
mode='aspectFit' class="zai-logo "></image>
|
|
</view>
|
<view class="file-name">
|
<!-- 文件名 -->
|
{{file.fileName}}
|
</view>
|
<view class="file-actions">
|
<!-- 下载按钮 -->
|
<image v-show="showBtn" src="/static/icon_down.png" @click="downloadFile(file)"
|
style="height: 25px; width: 25px; margin-right: 10px;"></image>
|
<!-- <button size="mini" @click="downloadFile(file)">
|
<view class="icon-download">下载</view>
|
</button> -->
|
<!-- 删除按钮 -->
|
<image v-show="showBtn" src="/static/icon_del.png" @click="deleteFile(index)"
|
style="height: 25px; width: 25px;"></image>
|
</button>
|
</view>
|
</view>
|
</view>
|
<view class="flex margin-bottom-xs">
|
<button class="flex-sub cu-btn bg-blue margin-sm lg" hover-class="is-hover"
|
@click="goReportRepair()">报修</button>
|
<button class="flex-sub cu-btn bg-blue margin-sm lg" hover-class="is-hover"
|
@click="goCheck()">点检</button>
|
<button class="flex-sub cu-btn bg-blue margin-sm lg" hover-class="is-hover"
|
@click="goBaoZhou()">周保</button>
|
<button class="flex-sub cu-btn bg-blue margin-sm lg" hover-class="is-hover"
|
@click="goMaintenance()">维修</button>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
|
import {
|
saveAs
|
} from 'file-saver'; // 引入 file-saver 库
|
export default {
|
mixins: [MescrollMixin], // 使用mixin
|
data() {
|
return {
|
showBtn: true,
|
listStyles: {
|
"borderStyle": {
|
"width": "0", // 边框宽度
|
},
|
"border": false, // 是否显示边框
|
"dividline": false
|
},
|
|
del: true,
|
scrollLeft: 0,
|
searchValue: '',
|
NavBarColor: this.NavBarColor,
|
url: {
|
fileList: 'eam/equipmentAttachment/list',
|
stallList: "/eam/equipment/queryById",
|
upload: "/eam/sysFiles/batch_upload",
|
add: 'eam/equipmentAttachment/add',
|
downloadFile: 'eam/equipmentAttachment/downloadFile'
|
},
|
uploading: false, // 是否正在上传
|
selectedFiles: [],
|
formData: {
|
fileLists: []
|
},
|
fileLists: [],
|
id: '',
|
upOption: {
|
page: {
|
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
|
size: 10 // 每页数据的数量
|
},
|
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
|
empty: {
|
tip: '~ 暂无数据 ~', // 提示
|
},
|
loading: '',
|
text: '全部',
|
isShowNoMore: false,
|
textNoMore: '我是有底线的 >_<'
|
},
|
styles: {
|
color: '#2979FF',
|
borderColor: '#2979FF'
|
},
|
msg1Count: 0,
|
msg2Count: 0,
|
msg1Title: ""
|
}
|
},
|
computed: {
|
top() {
|
return this.CustomBar * 2 + 160
|
},
|
style() {
|
var StatusBar = this.StatusBar;
|
var CustomBar = this.CustomBar;
|
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
|
return style
|
},
|
},
|
|
|
onShow() {
|
|
},
|
|
onLoad: function(option) {
|
const annItem = JSON.parse(decodeURIComponent(option.item));
|
this.id = annItem.id
|
},
|
created() {
|
this.upCallback()
|
this.getFileList()
|
},
|
methods: {
|
downloadFile(item) {
|
uni.showModal({
|
title: '提示',
|
content: '确认要下载吗',
|
cancelText: '取消',
|
confirmText: '确认',
|
success: res => {
|
if (res.confirm) {
|
this.downFile(item)
|
}
|
}
|
})
|
|
},
|
|
|
downFile(item) {
|
this.$http.download(this.url.downloadFile, {
|
params: {
|
id: item.id
|
},
|
responseType: 'blob' // 确保响应类型为 blob
|
}).then(response => {
|
console.log('Response:', response); // 查看完整响应结构
|
|
// 获取 tempFilePath(Blob URL)
|
const tempFilePath = response.tempFilePath;
|
|
if (!tempFilePath) {
|
uni.showToast({
|
title: '文件下载失败',
|
icon: 'none'
|
});
|
return;
|
}
|
|
let fileName = item.fileName;
|
|
// 创建 <a> 标签并触发下载
|
const link = document.createElement('a');
|
link.href = tempFilePath;
|
link.setAttribute('download', fileName);
|
link.style.display = 'none';
|
|
document.body.appendChild(link);
|
link.click();
|
|
// 清理资源
|
document.body.removeChild(link);
|
|
}).catch(err => {
|
console.error('Download error:', err);
|
uni.showToast({
|
title: '文件下载失败',
|
icon: 'none'
|
});
|
});
|
},
|
|
|
|
|
// downFile(item) {
|
// this.$http.download(this.url.downloadFile, {
|
// params: {
|
// id:item.id
|
// },
|
// }).then(res => {
|
// if (!res) {
|
// this.$message.warning('文件下载失败')
|
// return
|
// } else {
|
// let fileName = item.fileName;
|
// if (typeof window.navigator.msSaveBlob !== 'undefined') {
|
// window.navigator.msSaveBlob(new Blob([res]), fileName);
|
// } else {
|
// let url = window.URL.createObjectURL(new Blob([res]));
|
// let link = document.createElement('a');
|
// link.style.display = 'none';
|
// link.href = url;
|
// link.setAttribute('download', fileName);
|
// document.body.appendChild(link);
|
// link.click()
|
// document.body.removeChild(link) //下载完成移除元素
|
// window.URL.revokeObjectURL(url) //释放掉blob对象
|
// }
|
// }
|
// }).catch((err) => {
|
// uni.showToast({
|
// title: '获取文件列表失败',
|
// icon: 'none'
|
// });
|
// });
|
// },
|
|
|
getFileList() {
|
this.$http.get(this.url.fileList, {
|
params: {
|
equipmentId: this.id,
|
pageNo: 1,
|
pageSize: 999,
|
column: 'createTime',
|
order: 'desc'
|
},
|
}).then(res => {
|
if (res.data.success) {
|
this.selectedFiles = res.data.result.records || [];
|
|
}
|
}).catch(() => {
|
uni.showToast({
|
title: '获取文件列表失败',
|
icon: 'none'
|
});
|
});
|
},
|
uploadFail(e) {
|
console.log('上传失败:', e)
|
},
|
|
|
|
onFileSelect(e) {
|
const tempFilePaths = e.tempFilePaths;
|
|
uni.showLoading({
|
title: '上传中...'
|
});
|
|
const uploadPromises = tempFilePaths.map((filePath, index) => {
|
return new Promise((resolve, reject) => {
|
this.$http.upload(this.url.upload, {
|
filePath: filePath,
|
name: 'file'
|
})
|
.then(uploadRes => {
|
const serverFile = uploadRes.data.result[0];
|
console.log(serverFile);
|
// 提取fileSuffix并拼接
|
if (serverFile.fileSuffix && serverFile.fileName && !serverFile
|
.fileName.includes('.')) {
|
serverFile.fileName += '.' + serverFile.fileSuffix;
|
}
|
this.fileLists = [];
|
// 防止重复添加(根据 id 或 fileName 判断)
|
if (!this.fileLists.some(file => file.id === serverFile.id)) {
|
this.fileLists.push(serverFile);
|
}
|
resolve();
|
})
|
.catch(err => {
|
console.error(`文件 ${index + 1} 上传失败`, err);
|
uni.showToast({
|
title: `第 ${index + 1} 个文件上传失败`,
|
icon: 'none'
|
});
|
reject(err);
|
});
|
});
|
});
|
|
Promise.all(uploadPromises)
|
.then(() => {
|
uni.hideLoading();
|
uni.showToast({
|
title: '全部上传成功,正在提交...'
|
});
|
this.submitFileList(); // 自动提交所有文件
|
})
|
.catch(() => {
|
uni.hideLoading();
|
uni.showToast({
|
title: '部分上传失败',
|
icon: 'none'
|
});
|
});
|
},
|
// 文件删除回调
|
onFileDelete(e) {
|
console.log('删除文件:', e.index);
|
},
|
|
// 删除单个文件
|
deleteFile(index) {
|
this.fileLists.splice(index, 1);
|
},
|
|
|
submitFileList() {
|
if (!this.fileLists.length) {
|
uni.showToast({
|
title: '没有可提交的文件',
|
icon: 'none'
|
});
|
return;
|
}
|
console.log(this.fileLists)
|
this.$http.post(this.url.add, {
|
equipmentId: this.id,
|
fileList: this.fileLists
|
}).then(res => {
|
if (res.data.success) {
|
uni.showToast({
|
title: '提交成功'
|
});
|
this.getFileList();
|
} else {
|
uni.showToast({
|
title: '提交失败',
|
icon: 'none'
|
});
|
}
|
}).catch(err => {
|
uni.showToast({
|
title: '提交异常',
|
icon: 'none'
|
});
|
console.error('提交失败:', err);
|
});
|
},
|
/**
|
* 报修
|
*/
|
goReportRepair() {
|
console.log('getSera 方法被调用');
|
uni.redirectTo({
|
url: `/pages/reportRepair/reportRepair?equipmentId=${encodeURIComponent(this.id)}`
|
});
|
},
|
/**
|
* 点检
|
*/
|
goCheck() {
|
uni.redirectTo({
|
// url: '/pages/checkList/checkList',
|
url: `/pages/checkList/checkList?equipmentId=${encodeURIComponent(this.id)}`
|
});
|
},
|
/**
|
* 周保
|
*/
|
goBaoZhou() {
|
uni.redirectTo({
|
// url: '/pages/baoZhou/baoZhou',
|
url: `/pages/baoZhou/baoZhou?equipmentId=${encodeURIComponent(this.id)}`
|
});
|
},
|
/**
|
* 维修
|
*/
|
goMaintenance() {
|
uni.redirectTo({
|
// url: '/pages/maintenanceReport/maintenanceReport',
|
url: `/pages/maintenanceReport/maintenanceReport?equipmentId=${encodeURIComponent(this.id)}`
|
});
|
},
|
|
|
upCallback() {
|
this.$http.get(this.url.stallList, {
|
params: {
|
pageNo: 999,
|
pageSize: 1,
|
order: 'asc',
|
column: 'createTime',
|
id: this.id
|
|
},
|
|
}).then(res => {
|
this.announcement1 = res.data.result
|
console.log("url", res)
|
//设置列表数据
|
if (res.data.success) {
|
console.log("res", res.data.result.equipmentCode)
|
this.formData = this.announcement1
|
}
|
}).catch(() => {
|
//联网失败, 结束加载
|
})
|
},
|
|
|
|
/* 检索 */
|
getSera(res) {
|
this.msgList = [];
|
if (keyword == 0) {
|
this.$http.get(this.url.stallList, {
|
params: {
|
pageNo: 1,
|
pageSize: 999,
|
order: "desc",
|
column: "createTime",
|
equipmentCode: res
|
}
|
}).then(res => {
|
//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
|
|
this.announcement1 = res.data.result.records
|
this.mescroll.endSuccess(this.announcement1.length);
|
console.log("url", res)
|
//设置列表数据
|
if (res.data.success) {
|
console.log("res", res.data)
|
this.msg1Count = res.data.result.total
|
this.msg1Title = "通知(" + res.data.result.total + ")";
|
for (let annItem of this.announcement1) {
|
this.msgList.push(annItem)
|
}
|
}
|
if (page.num == 1) {
|
this.msgList = []; //如果是第一页需手动制空列表
|
this.msgList = this.msgList.concat(this.announcement1); //追加新数据
|
}
|
|
}).catch(() => {
|
//联网失败, 结束加载
|
this.mescroll.endErr();
|
})
|
}
|
},
|
|
mescrollInit(mescroll) {
|
console.log('mescrollInit')
|
this.mescroll = mescroll;
|
},
|
},
|
|
}
|
</script>
|
|
<style>
|
.file-list {
|
margin-top: 20px;
|
}
|
|
.file-item {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
padding: 10px;
|
border-bottom: 1px solid #eee;
|
}
|
|
.file-item text {
|
flex: 1;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
}
|
|
.is-hover {
|
color: rgba(255, 255, 255, 0.6);
|
background-color: #55aaff;
|
border-color: #55aaff;
|
}
|
|
|
|
.content {
|
margin-top: 5px;
|
}
|
|
.content scroll-view {
|
scrollIndicator: "none"
|
}
|
|
.popupView {
|
margin-top: 85px;
|
height: auto;
|
}
|
|
.file-list {
|
display: flex;
|
flex-direction: column;
|
gap: 10px;
|
}
|
|
.file-item {
|
display: flex;
|
align-items: center;
|
padding: 10px;
|
border: 1px solid #ddd;
|
border-radius: 4px;
|
}
|
|
.file-icon img {
|
width: 32px;
|
height: 32px;
|
margin-right: 10px;
|
}
|
|
.file-name {
|
flex: 1;
|
font-size: 16px;
|
}
|
|
.file-actions button {
|
background: none;
|
border: none;
|
cursor: pointer;
|
margin-left: 10px;
|
}
|
|
.file-actions .icon-download,
|
.file-actions .icon-delete {
|
font-size: 18px;
|
color: #555;
|
}
|
|
.file-actions .icon-download:hover,
|
.file-actions .icon-delete:hover {
|
color: #007bff;
|
}
|
</style>
|