|
|
<template>
|
|
|
<div class="icdConfigBox">
|
|
|
<div class="configHead">
|
|
|
<div class="upgradeBox">
|
|
|
<h3 class="lableBox">文件上传：</h3>
|
|
|
<el-upload
|
|
|
class="upload-demo"
|
|
|
ref="upload"
|
|
|
action="/cac-api/iecserver/upload"
|
|
|
:limit="1"
|
|
|
:file-list="fileList"
|
|
|
:data="reportData"
|
|
|
:auto-upload="false"
|
|
|
:on-success="handleAvatarSuccess"
|
|
|
@before-upload="beforeAvatarUpload"
|
|
|
>
|
|
|
<el-button slot="trigger" size="small" type="primary"
|
|
|
>选取文件</el-button
|
|
|
>
|
|
|
</el-upload>
|
|
|
</div>
|
|
|
<el-button
|
|
|
class="uploadBtn"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="submitUpload"
|
|
|
>上传到服务器</el-button
|
|
|
>
|
|
|
</div>
|
|
|
<div class="iedContain">
|
|
|
<div class="icdTableBox" v-if="icdTableData.length !== 0">
|
|
|
<el-table
|
|
|
v-loading="icdLoading"
|
|
|
:data="icdTableData"
|
|
|
stripe
|
|
|
border
|
|
|
style="width: 100%"
|
|
|
height="calc(100% - 40px)"
|
|
|
>
|
|
|
<el-table-column prop="filename" label="文件名称"> </el-table-column>
|
|
|
<el-table-column prop="md5" label="md5"> </el-table-column>
|
|
|
<el-table-column prop="start" label="是否启用">
|
|
|
<template slot-scope="scope">
|
|
|
<el-tag type="success" v-if="scope.row.start == 1">启用</el-tag>
|
|
|
<el-tag type="danger" v-else>未启用</el-tag>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="操作" class-name="editClass">
|
|
|
<template slot-scope="scope">
|
|
|
<el-link
|
|
|
type="danger"
|
|
|
@click="deleteServer(scope.row)"
|
|
|
size="small"
|
|
|
icon="el-icon-delete"
|
|
|
>删除</el-link
|
|
|
>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div class="icdTableBox" v-else>
|
|
|
<el-empty description="暂无数据"></el-empty>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { ieclistFileApi, serverDeleteApi } from "@/utils/api/index";
|
|
|
|
|
|
export default {
|
|
|
components: {},
|
|
|
data() {
|
|
|
return {
|
|
|
fileList: [], //上传列表
|
|
|
reportData: {},
|
|
|
icdTableData: [], //表格数据
|
|
|
icdLoading: true,
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
this.geticdList(); //获取iedName列表
|
|
|
},
|
|
|
methods: {
|
|
|
//点击升级确定
|
|
|
beforeAvatarUpload(file) {
|
|
|
console.log(this.reportData.title);
|
|
|
console.log(file);
|
|
|
},
|
|
|
//上传apk
|
|
|
submitUpload() {
|
|
|
this.$refs.upload.submit();
|
|
|
},
|
|
|
handleAvatarSuccess(res, file) {
|
|
|
console.log(res);
|
|
|
if (res.success) {
|
|
|
this.$message({
|
|
|
duration: 1500,
|
|
|
showClose: true,
|
|
|
message: "文件上传成功",
|
|
|
type: "success",
|
|
|
});
|
|
|
|
|
|
this.$refs.upload.clearFiles();
|
|
|
this.geticdList(); //获取iedName列表
|
|
|
} else {
|
|
|
this.$message({
|
|
|
duration: 1500,
|
|
|
showClose: true,
|
|
|
message: res.errorMsg,
|
|
|
type: "error",
|
|
|
});
|
|
|
this.$refs.upload.clearFiles();
|
|
|
}
|
|
|
},
|
|
|
//获取ied左侧列表
|
|
|
geticdList() {
|
|
|
ieclistFileApi()
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.icdTableData = res.data;
|
|
|
this.icdLoading = false;
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.log(err); //代码错误、请求失败捕获
|
|
|
});
|
|
|
},
|
|
|
//删除服务器
|
|
|
deleteServer(row) {
|
|
|
serverDeleteApi({ fileId: row.id })
|
|
|
.then((res) => {
|
|
|
if (res.success) {
|
|
|
console.log(res);
|
|
|
this.geticdList();
|
|
|
} else {
|
|
|
this.$message({
|
|
|
duration: 1500,
|
|
|
showClose: true,
|
|
|
type: "error",
|
|
|
message: res.errorMsg,
|
|
|
});
|
|
|
}
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
console.log(err); //代码错误、请求失败捕获
|
|
|
});
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less">
|
|
|
.icdConfigBox {
|
|
|
width: calc(100% - 24px);
|
|
|
overflow-x: hidden;
|
|
|
background: rgba(8, 9, 36, 0.28);
|
|
|
|
|
|
box-shadow: inset 0 4px 44px 0 #106cde;
|
|
|
padding: 0px 12px;
|
|
|
height: 100%;
|
|
|
.configHead {
|
|
|
width: 100%;
|
|
|
height: 40px;
|
|
|
line-height: 40px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
|
|
|
.upgradeBox {
|
|
|
display: flex;
|
|
|
.lableBox {
|
|
|
font-size: 14px;
|
|
|
font-weight: normal;
|
|
|
width: 78px;
|
|
|
}
|
|
|
.upload-demo {
|
|
|
position: relative;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
flex-direction: row-reverse;
|
|
|
margin-right: 16px;
|
|
|
.el-upload-list {
|
|
|
width: 320px;
|
|
|
height: 32px;
|
|
|
line-height: 32px;
|
|
|
border: 1px solid #dcdfe6;
|
|
|
background: #fff;
|
|
|
margin-right: 12px;
|
|
|
border-radius: 4px;
|
|
|
.el-upload-list__item {
|
|
|
transition: none;
|
|
|
font-size: 14px;
|
|
|
color: #606266;
|
|
|
position: relative;
|
|
|
box-sizing: border-box;
|
|
|
border-radius: 4px;
|
|
|
width: 100%;
|
|
|
height: 32px;
|
|
|
line-height: 32px;
|
|
|
margin-top: 0px !important;
|
|
|
.el-icon-close {
|
|
|
top: 10px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.uploadBtn {
|
|
|
}
|
|
|
.grouprpt {
|
|
|
margin-left: auto;
|
|
|
}
|
|
|
// .clearBtn {
|
|
|
// }
|
|
|
}
|
|
|
.iedContain {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
background: #fff;
|
|
|
margin-top: 10px;
|
|
|
height: calc(100% - 60px);
|
|
|
display: flex;
|
|
|
.leftMenu {
|
|
|
width: 200px;
|
|
|
//padding: 0px 10px 0px 10px;
|
|
|
height: calc(100% - 2px);
|
|
|
border: 1px solid #dcdfe6;
|
|
|
overflow-y: auto;
|
|
|
.iedame {
|
|
|
line-height: 28px;
|
|
|
height: 28px;
|
|
|
color: #333;
|
|
|
font-size: 14px;
|
|
|
padding-left: 10px;
|
|
|
padding-right: 10px;
|
|
|
cursor: pointer;
|
|
|
i {
|
|
|
margin-right: 4px;
|
|
|
}
|
|
|
&:hover {
|
|
|
// background: #3889cf;
|
|
|
color: #3889cf;
|
|
|
}
|
|
|
}
|
|
|
.is-selected {
|
|
|
background: #3889cf;
|
|
|
color: #fff;
|
|
|
&:hover {
|
|
|
color: #fff;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.el-empty {
|
|
|
height: 100%;
|
|
|
.el-empty__image {
|
|
|
width: 100px;
|
|
|
}
|
|
|
}
|
|
|
.icdTableBox {
|
|
|
flex: 1;
|
|
|
min-width: 0;
|
|
|
margin-left: 12px;
|
|
|
//border: 1px solid #dcdfe6;
|
|
|
height: calc(100% - 2px);
|
|
|
h3 {
|
|
|
height: 32px;
|
|
|
line-height: 32px;
|
|
|
margin-bottom: 8px;
|
|
|
color: #333;
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
.el-table {
|
|
|
.editClass {
|
|
|
.el-link.el-link--primary {
|
|
|
margin-right: 14px;
|
|
|
}
|
|
|
.el-link.el-link--success {
|
|
|
margin-right: 14px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.editDialogBox {
|
|
|
.el-dialog {
|
|
|
margin-top: 0 !important;
|
|
|
position: absolute;
|
|
|
left: 50%;
|
|
|
top: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
.el-select {
|
|
|
width: 376px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</style>
|