From 5bd66255ccd4e995337b9039094964d2677db4cc Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期二, 22 二月 2022 17:19:06 +0800
Subject: [PATCH] 完善日志监控模块, 需要配合valog-server使用
---
src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue | 183 ++++++++++++++++++++++++++++++++-------------
1 files changed, 128 insertions(+), 55 deletions(-)
diff --git a/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue b/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue
index d082523..d684bb0 100644
--- a/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue
+++ b/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue
@@ -1,13 +1,23 @@
<template>
<div class="lkg-manage">
<div class="import-btn">
- <label>涓婁紶LKG鏁版嵁鏂囦欢</label>
- <el-button
+ <!-- <label> : </label> -->
+ <!-- <el-button
size="mini"
type="primary"
@click="uploadDirectoryTrigger"
:loading="uploading"
- >鐐瑰嚮涓婁紶</el-button>
+ >涓婁紶 LKJ 鏁版嵁鏂囦欢</el-button
+ > -->
+ <el-tooltip class="item" effect="dark" content="涓婁紶 LKJ 鏁版嵁鏂囦欢" placement="bottom">
+ <span
+ class="icon iconfont"
+ @click="uploadDirectoryTrigger"
+ style="font-size: 34px; color: #92abd1"
+ ></span
+ >
+ </el-tooltip>
+
<input
ref="directoryInput"
@change="importDirectory"
@@ -19,8 +29,21 @@
</div>
<div class="lkg-list">
- <el-table :data="lkgData" stripe style="width: 100%">
- <el-table-column type="index" width="100" label="搴忓彿"></el-table-column>
+ <el-table
+ :data="lkgData"
+ stripe
+ style="width: 100%"
+ :header-cell-style="{
+ background: '#2D52D7',
+ color: '#fff',
+ height: '50px',
+ }"
+ >
+ <el-table-column
+ type="index"
+ width="120"
+ label="搴忓彿"
+ ></el-table-column>
<el-table-column prop="CarNumber" label="鏈鸿溅鍙�"></el-table-column>
<el-table-column prop="TrainNumber" label="杞︽"></el-table-column>
<el-table-column prop="Driver1" label="鍙告満"></el-table-column>
@@ -29,7 +52,12 @@
<el-table-column prop="EndTime" label="缁撴潫鏃堕棿"></el-table-column>
<el-table-column label="鎿嶄綔">
<template slot-scope="scope">
- <i class="el-icon-delete del-icon" @click="delLKG(scope.row)"></i>
+ <div class="icon-wrap">
+ <span class="iconfont icon del-icon" @click="delLKG(scope.row)"
+ ></span
+ >
+ </div>
+ <!-- <i class="el-icon-delete del-icon" ></i> -->
</template>
</el-table-column>
</el-table>
@@ -38,92 +66,137 @@
</template>
<script>
-import { uploadLKG, getLKGData, delLKGData } from "@/api/shuohuang"
+import { uploadLKG, getLKGData, delLKGData } from "@/api/shuohuang";
export default {
data() {
return {
uploading: false,
- lkgData: []
- }
+ lkgData: [],
+ };
},
mounted() {
this.fetchLKGData();
},
methods: {
uploadDirectoryTrigger() {
- this.$refs['directoryInput'].click();
+ this.$refs["directoryInput"].click();
},
importDirectory() {
let _this = this;
_this.uploading = true;
- let formData = new FormData;
- for (let i = 0; i < this.$refs['directoryInput'].files.length; i++) {
- formData.append('files', this.$refs['directoryInput'].files[i])
+ let formData = new FormData();
+ for (let i = 0; i < this.$refs["directoryInput"].files.length; i++) {
+ formData.append("files", this.$refs["directoryInput"].files[i]);
}
- uploadLKG(formData).then(res => {
- if (res && res.success) {
- this.$message.success("涓婁紶鎴愬姛")
- }
- _this.uploading = false;
- this.fetchLKGData();
- }).catch(err => {
- this.$message.warning("涓婁紶澶辫触", err)
- _this.uploading = false;
- })
+ uploadLKG(formData)
+ .then((res) => {
+ if (res && res.success) {
+ this.$message.success("涓婁紶鎴愬姛");
+ }
+ _this.uploading = false;
+ this.fetchLKGData();
+ })
+ .catch((err) => {
+ this.$message.warning("涓婁紶澶辫触", err);
+ _this.uploading = false;
+ });
},
fetchLKGData() {
- getLKGData().then(rsp => {
+ getLKGData().then((rsp) => {
if (rsp && rsp.success) {
this.lkgData = rsp.data;
}
- })
+ });
},
delLKG(row) {
+ this.$confirm("姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ユ枃浠�, 鏄惁缁х画?", "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning",
+ })
+ .then(() => {
+ delLKGData({ id: row.ID })
+ .then((rsp) => {
+ if (rsp && rsp.success) {
+ this.$message.success("鍒犻櫎鎴愬姛");
+ } else {
+ this.$message.warning("鍒犻櫎澶辫触");
+ }
- this.$confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ユ枃浠�, 鏄惁缁х画?', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
- }).then(() => {
-
- delLKGData({ id: row.ID }).then(rsp => {
- if (rsp && rsp.success) {
- this.$message.success("鍒犻櫎鎴愬姛")
- } else {
- this.$message.warning("鍒犻櫎澶辫触")
- }
-
- this.fetchLKGData()
- }).catch(err => {
- this.$message.warning("鍒犻櫎澶辫触")
+ this.fetchLKGData();
+ })
+ .catch((err) => {
+ this.$message.warning("鍒犻櫎澶辫触");
+ });
})
- }).catch(() => {
- this.$message({
- type: 'info',
- message: '宸插彇娑堝垹闄�'
+ .catch(() => {
+ this.$message({
+ type: "info",
+ message: "宸插彇娑堝垹闄�",
+ });
});
- });
- }
- }
-}
+ },
+ },
+};
</script>
<style lang="scss">
.lkg-manage {
+ background: #fff;
+ padding: 25px 33px;
+ box-shadow: 0px 3px 6px rgba(160, 174, 230, 0.56);
+ border-radius: 10px;
.import-btn {
text-align: left;
- margin: 10px 20px;
+ margin-bottom: 10px;
+ span {
+ cursor: pointer;
+ }
+ button {
+ span {
+ color: #fff;
+ }
+ }
}
.lkg-list {
- margin: 10px 20px;
+ // margin: 10px 20px;
+ .el-table--striped
+ .el-table__body
+ tr.el-table__row--striped
+ td.el-table__cell {
+ background: #f4f6f9;
+ }
+ .el-table__row > td {
+ border: none;
+ }
+ .el-table th.is-leaf {
+ border: none;
+ }
+ .el-table {
+ margin-top: 15px;
+ border: none;
+ }
+ th.el-table__cell > .cell {
+ color: #fff;
+ }
}
-
- .del-icon {
- color: red;
- cursor: pointer;
+ .icon-wrap {
+ background: #9dabc1;
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ text-align: center;
+ .del-icon {
+ color: #fff;
+ font-size: 21px;
+ cursor: pointer;
+ }
+ }
+ .icon-wrap:hover {
+ background: #d94141;
}
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0