From ba823ee5052df2879ddbb53a70a20b1e562d576f Mon Sep 17 00:00:00 2001
From: fanluyan <754122931@qq.com>
Date: Tue, 14 Nov 2023 16:55:32 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=E5=9B=BE=E7=89=87=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E7=BC=BA=E5=B0=91=E6=8E=A5=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LayoutTabs.vue      | 17 +++++++++
 src/views/realTimeSearch/index.vue | 56 ++++++++++++++++++++++++++++++
 2 files changed, 73 insertions(+)

diff --git a/src/components/LayoutTabs.vue b/src/components/LayoutTabs.vue
index 4aec1bc..8fe387a 100644
--- a/src/components/LayoutTabs.vue
+++ b/src/components/LayoutTabs.vue
@@ -221,11 +221,28 @@ export default {
     border: 1px solid #dcdfe6;
     box-shadow: none;
   }
+  .el-icon-refresh {
+    margin: 0px 8px 0px 4px;
+  }
+  .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
+    color: #fff;
+    background-color: #169e8c;
+  }
+  .el-tabs--border-card
+    > .el-tabs__header
+    .el-tabs__item:not(.is-disabled):hover {
+    color: #fff;
+    background-color: #169e8c;
+  }
+  .el-tabs__item .el-icon-close {
+    transition: none;
+  }
 
   .el-tabs__item {
     height: 30px;
     line-height: 30px;
     font-size: 12px;
+    padding: 0 10px !important;
   }
   .el-tabs__content {
     display: none;
diff --git a/src/views/realTimeSearch/index.vue b/src/views/realTimeSearch/index.vue
index 14b0106..4ff5101 100644
--- a/src/views/realTimeSearch/index.vue
+++ b/src/views/realTimeSearch/index.vue
@@ -147,6 +147,14 @@
                   }}
                 </p>
               </div>
+              <div class="deleteBox">
+                <el-button
+                  title="删除照片"
+                  type="primary"
+                  icon="el-icon-delete"
+                  @click.stop="deletePic(item)"
+                ></el-button>
+              </div>
             </div>
             <div class="bigpic" v-else>
               <!-- <el-image :src="item.path" lazy></el-image> -->
@@ -397,6 +405,28 @@ export default {
       this.pageSize = val;
       this.getPicData();
     },
+    deletePic(val) {
+      console.log(val);
+      this.$confirm("此操作将永久删除该图片, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.$message({
+            type: "success",
+            showClose: true,
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            showClose: true,
+            message: "已取消删除",
+          });
+        });
+    },
   },
 };
 </script>
@@ -453,6 +483,11 @@ export default {
             height: 200px;
           }
         }
+        &:hover {
+          .deleteBox {
+            display: block;
+          }
+        }
       }
       .caption {
         position: absolute;
@@ -478,6 +513,27 @@ export default {
           padding-right: 5px;
         }
       }
+      .deleteBox {
+        position: absolute;
+        right: 4px;
+        top: 4px;
+        z-index: 2;
+        display: none;
+        .el-button {
+          width: auto;
+          background: rgba(0, 0, 0, 0.5);
+          border: 1px solid transparent;
+          color: #fff;
+          font-size: 16px;
+          padding: 3px;
+        }
+        &:hover {
+          .el-button {
+            background: #f56c6c;
+            //color: #f56c6c;
+          }
+        }
+      }
     }
     .noPicBox {
       display: flex;