From 7b803f4c1d2b94f4a6421d400038bfe77136521f Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期二, 09 十一月 2021 14:01:39 +0800 Subject: [PATCH] Merge branch 'master' of http://192.168.5.5:10010/r/web/vue-smart-ai --- src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue | 177 +++++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 123 insertions(+), 54 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue b/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue index 611813b..e43bbdf 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/lkgManage.vue @@ -1,13 +1,20 @@ <template> <div class="lkg-manage"> <div class="import-btn"> - <label> 涓婁紶 LKJ 鏁版嵁鏂囦欢: </label> - <el-button + <!-- <label> : </label> --> + <!-- <el-button size="mini" type="primary" @click="uploadDirectoryTrigger" :loading="uploading" - >鐐瑰嚮涓婁紶</el-button> + >涓婁紶 LKJ 鏁版嵁鏂囦欢</el-button + > --> + <span + class="icon iconfont" + @click="uploadDirectoryTrigger" + style="font-size: 34px; color: #92abd1" + ></span + > <input ref="directoryInput" @change="importDirectory" @@ -19,8 +26,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 +49,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 +63,136 @@ </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; + .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