From 5173f8e31d106abd003e123c8679cf53c7940b33 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期一, 30 一月 2023 11:54:12 +0800
Subject: [PATCH] 网格绘制

---
 src/views/systemSetting/device/handheldTerminal/index.vue |  158 ++++++++++++++++++++++++++++------------------------
 1 files changed, 86 insertions(+), 72 deletions(-)

diff --git a/src/views/systemSetting/device/handheldTerminal/index.vue b/src/views/systemSetting/device/handheldTerminal/index.vue
index 03d856f..004e3ae 100644
--- a/src/views/systemSetting/device/handheldTerminal/index.vue
+++ b/src/views/systemSetting/device/handheldTerminal/index.vue
@@ -23,20 +23,17 @@
     <main>
       <div class="main-content">
         <div class="main-title">
-          <el-button
-            class="el-icon-plus"
-            type="primary"
-            @click="dialogCreate = true"
+          <el-button class="el-icon-plus button-addition" type="primary" @click="handleAdd"
             >娣诲姞</el-button
           >
         </div>
         <!-- 鏁版嵁灞曠ず -->
         <el-table
+            border
+            stripe
           ref="multipleTable"
           :header-cell-style="{
-            background: '#06122c',
-            'font-size': '12px',
-            color: '#4b9bb7',
+          'background':'#F5F5F5',
             'font-weight': '650',
             'line-height': '45px',
           }"
@@ -53,7 +50,7 @@
           </el-table-column>
           <el-table-column prop="phone" label="鑱旂郴鏂瑰紡" min-width="10">
           </el-table-column>
-          <el-table-column prop="pDepartName" label="鎵�灞為儴闂�" min-width="10">
+          <el-table-column prop="pdepartName" label="鎵�灞為儴闂�" min-width="10">
           </el-table-column>
           <el-table-column prop="departName" label="鎵�灞炲ぇ闃�" min-width="10">
           </el-table-column>
@@ -68,7 +65,7 @@
 
           <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
             <template slot-scope="scope">
-              <div class="btn">
+              <div class="operation">
                 <span @click="handleEdit(scope.row)">缂栬緫</span>
                 <span class="line">|</span>
                 <span @click="handleDelete(scope.row)">鍒犻櫎</span>
@@ -105,7 +102,7 @@
         width="60%"
         :before-close="handleClose"
       >
-        <MyForm :info="handheldTerminal" :closeDialog="setTableData"></MyForm>
+        <MyForm :info="handheldTerminal" @closeDialog="handleCallBack"></MyForm>
       </el-dialog>
     </footer>
   </div>
@@ -142,31 +139,47 @@
       pageSize: 10,
       currentPage: 1,
       renderFlag: false,
-      handheldTerminal: {
-        id: 0,
-        name: "",
-        code: "",
-        user: "",
-        phone: "",
-        departId: 0,
-      },
+      handheldTerminal: {},
     };
   },
   created() {
     this.setTableData();
   },
   methods: {
-    ...mapActions([
-      "getHandheldTerminalList",
-      "saveHandheldTerminal",
-      "updateHandheldTerminal",
-    ]),
+    ...mapActions(["getHandheldTerminalList", "deleteHandheldTerminal"]),
+    handleAdd() {
+      this.handheldTerminal = {
+        id: 0,
+        name: "",
+        code: "",
+        user: "",
+        phone: "",
+        departId: 0,
+        departName: "",
+      };
+      this.dialogCreate = true;
+    },
     handleEdit(row) {
-      
       this.handheldTerminal = row;
       this.dialogCreate = true;
     },
-    handleDelete(row) {},
+    handleDelete(row) {
+      this.$confirm("纭鍒犻櫎锛�").then((_) => {
+        this.deleteHandheldTerminal(row.id).then((res) => {
+          this.$message({
+            type: "success",
+            message: "鍒犻櫎鎴愬姛锛�",
+          });
+          this.setTableData();
+        });
+      });
+    },
+
+    handleCallBack(e) {
+      this.currentPage = 1;
+      this.dialogCreate = false;
+      this.setTableData();
+    },
     formatSate(row, column) {
       return row.state == 1 ? "鍦ㄧ嚎" : "绂荤嚎";
     },
@@ -183,6 +196,7 @@
     // 寮圭獥鍏抽棴
     handleClose(done) {
       this.$confirm("纭鍏抽棴?").then((_) => {
+        this.dialogCreate = false;
         done();
       });
     },
@@ -194,8 +208,8 @@
         pageSize,
         state: context,
       }).then((res) => {
-          this.list = res.records;
-          this.totalNum = res.total;
+        this.list = res.records;
+        this.totalNum = res.total;
       });
     },
     handleStateChange(e) {
@@ -222,15 +236,15 @@
   <style lang="scss" scoped>
 .list {
   text-align: left;
-  margin: 10px 20px;
-  color: #4b9bb7;
-
+  padding: 10px 20px;
+  // color: #4b9bb7;
+  border: 1px solid #ccc;
   header {
-    background-color: #09152f;
-    border: 1pox solid #fff;
+    background-color: white;
+    // border: 1pox solid #fff;
 
     .header-content {
-      padding: 0 40px;
+      padding: 0;
       display: flex;
       line-height: 100px;
       justify-content: space-between;
@@ -246,26 +260,26 @@
 
         .el-input {
           flex: 2;
-          color: #1d3f57;
+          // color: #1d3f57;
 
-          &::v-deep .el-input__inner {
-            background-color: #09152f;
-            border: 1px solid #17324c;
-          }
+          // &::v-deep .el-input__inner {
+          //   background-color: #09152f;
+          //   border: 1px solid #17324c;
+          // }
         }
       }
     }
   }
 
   main {
-    background-color: #09152f;
-    margin-top: 20px;
+    // background-color: #09152f;
+    //margin-top: 20px;
     padding-bottom: 50px;
-    border: 1pox solid #fff;
+    //border: 1pox solid #fff;
 
     .main-title {
       line-height: 60px;
-      padding: 10px 20px;
+      padding:0px;
     }
 
     .tools {
@@ -281,7 +295,7 @@
           line-height: 28px;
           display: flex;
           align-items: center;
-          border: 1px solid #17324c;
+          // border: 1px solid #17324c;
           border-radius: 4px;
           font-size: 12px;
           margin-left: 10px;
@@ -295,18 +309,18 @@
             width: 120px;
           }
 
-          &::v-deep .el-input__inner {
-            border: none;
-            background-color: #09152f;
-          }
+          // &::v-deep .el-input__inner {
+          //   border: none;
+          //   background-color: #09152f;
+          // }
 
-          &:hover {
-            border: 1px solid #4b9bb7;
-          }
+          // &:hover {
+          //   border: 1px solid #4b9bb7;
+          // }
 
-          &:hover .el-checkbox {
-            color: #4b9bb7;
-          }
+          // &:hover .el-checkbox {
+          //   color: #4b9bb7;
+          // }
         }
       }
 
@@ -317,27 +331,27 @@
         justify-content: center;
 
         .el-pagination {
-          &::v-deep li,
-          &::v-deep .btn-prev,
-          &::v-deep .btn-next {
-            background-color: #071f39;
-            color: #4b9bb7;
-          }
+          // &::v-deep li,
+          // &::v-deep .btn-prev,
+          // &::v-deep .btn-next {
+          //   background-color: #071f39;
+          //   color: #4b9bb7;
+          // }
 
-          &::v-deep .active {
-            background-color: #409eff;
-            color: #fff;
-          }
+          // &::v-deep .active {
+          //   background-color: #409eff;
+          //   color: #fff;
+          // }
         }
       }
     }
-    &::v-deep .warning-row {
-      background-color: #06122c;
-    }
+    // &::v-deep .warning-row {
+    //   background-color: #06122c;
+    // }
 
-    &::v-deep .success-row {
-      background-color: #071f39;
-    }
+    // &::v-deep .success-row {
+    //   background-color: #071f39;
+    // }
 
     .operationBox {
       display: flex;
@@ -347,8 +361,8 @@
       background-color: #4b9bb7;
     }
     .el-table {
-      color: #4b9bb7;
-      font-size: 10px;
+      // color: #4b9bb7;
+      // font-size: 10px;
       .operation {
         display: flex;
 
@@ -363,4 +377,4 @@
     }
   }
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0