From 9ff66017debadfc89bc0c1b796684a4d1dbe2bc3 Mon Sep 17 00:00:00 2001
From: fangyuan <527392886@qq.com>
Date: 星期五, 16 十二月 2022 10:00:02 +0800
Subject: [PATCH] 已上报到市批量操作按钮隐藏

---
 src/views/systemSetting/device/grid/components/main/index.vue |  335 ++++++++++++++++++-------------------------------------
 1 files changed, 109 insertions(+), 226 deletions(-)

diff --git a/src/views/systemSetting/device/grid/components/main/index.vue b/src/views/systemSetting/device/grid/components/main/index.vue
index 9f53242..0ee4496 100644
--- a/src/views/systemSetting/device/grid/components/main/index.vue
+++ b/src/views/systemSetting/device/grid/components/main/index.vue
@@ -1,106 +1,85 @@
 <template>
-    <main>
-        <div class="mainContent">
-            <!-- 鏁版嵁灞曠ず -->
-            <el-table ref="multipleTable"
-                :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
-                :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"
-                @selection-change="tableChange">
-                <el-table-column type="selection" min-width="5">
-                </el-table-column>
-                <el-table-column label="鐢ㄦ埛ID" min-width="6">
-                    <template slot-scope="scope">{{ scope.row.id }}</template>
-                </el-table-column>
-                <el-table-column prop="nickName" label="鐢ㄦ埛鍚嶇О" min-width="10">
-                </el-table-column>
-                <el-table-column prop="username" label="鎵�灞炲鍚�" min-width="8">
-                </el-table-column>
-                <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="7">
-                </el-table-column>
-                <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="8">
-                    <template slot-scope="scope">
-                        <span>{{filterRole(scope.row.roles)}}</span>
-                    </template>
-                </el-table-column>
-                <!-- <el-table-column prop="departName" label="鎵�灞為儴闂�" min-width="8">
-                </el-table-column> -->
-                <el-table-column prop="jobTitle" label="鎵�灞炶亴鍔�" min-width="8">
-                </el-table-column>
-                <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10">
-                    <template slot-scope="scope">
-                        <span>{{changeTime(scope.row)}}</span>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="status" label="鍚敤" min-width="5">
-                    <template slot-scope="scope">
-                        <!-- @change="handleChangeStatus(scope.row)" -->
-                        <el-switch class="switchStyle" v-model="scope.row.status"
-                            active-color="#3fef9a" inactive-color="#000212" disabled>
-                        </el-switch>
-                    </template>
-                </el-table-column>
-                <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
-                    <!-- <template slot-scope="scope">
-                        <div class="operation">
-                            <span @click="handleChangeRole(scope.row,'role')">淇敼瑙掕壊</span>
-                            <span class="line">|</span>
-                            <span @click="handleFind(scope.row)">鏌ョ湅</span>
-                            <span class="line">|</span>
-                            <span @click="handleChangeRole(scope.row,'password')">淇敼瀵嗙爜</span>
-                            <span class="line">|</span>
-                            <span @click="handleDelete(scope.row)">鍒犻櫎</span>
-                            <span class="line">|</span>
-                            <span @click="handleChangeRole(scope.row,'depart')">淇敼閮ㄩ棬</span>
-                        </div>
-                    </template> -->
-                </el-table-column>
-            </el-table>
-            <!-- 鏌ョ湅椤甸潰 -->
-            <el-dialog :visible.sync="dialogView" width="45%" v-if="dialogView"
-                title="鏌ョ湅鐢ㄦ埛淇℃伅">
-                <MyView :userInfo=userInfo></MyView>
-            </el-dialog>
-            <!-- 淇敼椤甸潰 -->
-            <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate"
-                :title="updateFlag ? flag.role ? '淇敼鐢ㄦ埛瑙掕壊淇℃伅' : flag.depart ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅': '淇敼鐢ㄦ埛瀵嗙爜' :''"
-                :before-close="handleClose">
-                <updateUser :updateFlag="updateFlag" :userInfo=userInfo :flag=flag @closeDialog="closeDialog"
-                    :getUserList="getUserList" v-if="!flag.password" />
-                <MyPwd v-else :userInfo=userInfo @closeDialog="closeDialog"></MyPwd>
-            </el-dialog>
-            <!-- tools -->
-            <div class="tools">
-                <div class="funs">
-                    <div class="funsItem funs-sp">
-                        <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox>
-                    </div>
-                    <div class="funsItem funs-sp">
-                        <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox>
-                    </div>
-                    <div class="funsItem">
-                        <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange">
-                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"
-                                :disabled="item.disabled">
-                            </el-option>
-                        </el-select>
-                    </div>
-                </div>
-                <div class="pagination">
-                    <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum"
-                        :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev"
-                        @next-click="handleNext">
-                    </el-pagination>
-                </div>
-            </div>
+    <div class="mainContent">
+      <!-- <div class="aside">
+        <department-aside />
+      </div> -->
+      <div class="grid-content">
+        <!-- 鏁版嵁灞曠ず -->
+        <el-table ref="multipleTable"
+                  :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
+                  :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"
+                  @selection-change="tableChange">
+          <el-table-column type="selection" min-width="5">
+          </el-table-column>
+          <el-table-column label="鐢ㄦ埛ID" min-width="6">
+            <template slot-scope="scope">{{ scope.row.id }}</template>
+          </el-table-column>
+          <el-table-column prop="nickName" label="鐢ㄦ埛鍚嶇О" min-width="10">
+          </el-table-column>
+          <el-table-column prop="username" label="鎵�灞炲鍚�" min-width="8">
+          </el-table-column>
+          <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="7">
+          </el-table-column>
+          <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="8">
+            <template slot-scope="scope">
+              <span>{{filterRole(scope.row.roles)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="jobTitle" label="鎵�灞炶亴鍔�" min-width="8">
+          </el-table-column>
+          <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10">
+            <template slot-scope="scope">
+              <span>{{changeTime(scope.row)}}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="status" label="鍚敤" min-width="5">
+            <template slot-scope="scope">
+              <!-- @change="handleChangeStatus(scope.row)" -->
+              <el-switch class="switchStyle" v-model="scope.row.status"
+                         active-color="#3fef9a" inactive-color="#000212" disabled>
+              </el-switch>
+            </template>
+          </el-table-column>
+          <el-table-column prop="operation" label="鎿嶄綔" min-width="20">
+          </el-table-column>
+        </el-table>
+        <!-- 鏌ョ湅椤甸潰 -->
+        <el-dialog :visible.sync="dialogView" width="45%" v-if="dialogView"
+                   title="鏌ョ湅鐢ㄦ埛淇℃伅">
+          <MyView :userInfo=userInfo></MyView>
+        </el-dialog>
+        <!-- 淇敼椤甸潰 -->
+        <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate"
+                   :title="updateFlag ? flag.role ? '淇敼鐢ㄦ埛瑙掕壊淇℃伅' : flag.depart ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅': '淇敼鐢ㄦ埛瀵嗙爜' :''"
+                   :before-close="handleClose">
+          <updateUser :updateFlag="updateFlag" :userInfo=userInfo :flag=flag @closeDialog="closeDialog"
+                      :getUserList="getUserList" v-if="!flag.password" />
+          <MyPwd v-else :userInfo=userInfo @closeDialog="closeDialog"></MyPwd>
+        </el-dialog>
+        <!-- tools -->
+        <div class="tools">
+          <div class="funs">
+              <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox>
+              <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox>
+              <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange">
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"
+                           :disabled="item.disabled">
+                </el-option>
+              </el-select>
+          </div>
+          <el-pagination class="pagination" background :current-page="currentPage" layout="prev, pager, next" :total="totalNum"
+                         :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev"
+                         @next-click="handleNext">
+          </el-pagination>
         </div>
-    </main>
+      </div>
+    </div>
 </template>
 <script>
 import helper from '@/utils/mydate'
+import departmentAside from "@/views/operate/fivepack/threepack/components/aside";
 export default {
-    components: {
-      
-    },
+    components: { departmentAside },
     data() {
         return {
             tableData: [],
@@ -149,7 +128,6 @@
     },
     methods: {
         async selectChange(list) {
-            console.log(this.tempList);
             if (this.tempList.length !== 0) {
                 this.preMyIdx = list;
                 if (list === 3) {
@@ -173,15 +151,10 @@
             list.forEach(item => {
                 this.tempList.push(item.id);
             })
-            if (list.length === this.tableData.length) {
-                this.all = true;
-            } else {
-                this.all = false
-            }
+            this.all = list.length === this.tableData.length;
         },
         // 鎵归噺鍒犻櫎鐢ㄦ埛淇℃伅
         mulDelte(idArr) {
-            console.log(idArr);
             this.$confirm("鎮ㄧ‘瀹氳杩涜鎵归噺鍒犻櫎鐢ㄦ埛鍚�?")
                 .then(_ => {
                     this.$axios({
@@ -203,11 +176,10 @@
                             }
                         })
                 })
-                .catch(err => { console.log(err) })
+                .catch(err => {  })
         },
         // 鎵归噺淇敼璐﹀彿
         mulUpdateStatus(idArr, flag) {
-            console.log(flag);
             this.$confirm(flag === 1 ? "鎮ㄧ‘瀹氳杩涜鎵归噺鍚敤鐢ㄦ埛鍚�?" : '鎮ㄧ‘瀹氳杩涜鎵归噺绂佺敤鐢ㄦ埛鍚�?')
                 .then(_ => {
                     this.$axios({
@@ -229,7 +201,7 @@
                             }
                         })
                 })
-                .catch(err => { console.log(err) })
+                .catch(err => {  })
         },
         changeTime({ createTime }) {
             return helper(createTime);
@@ -294,7 +266,7 @@
             this.dialogUpdate = true;
             this.updateFlag = true;
             for (let key in this.flag) {
-                if (key == mykey) {
+                if (key === mykey) {
                     this.flag[key] = true;
                 } else {
                     this.flag[key] = false;
@@ -305,7 +277,7 @@
         // 淇敼鐢ㄦ埛鐘舵��
         handleChangeStatus(obj) {
             let { id, status } = obj;
-            status == true ? status = 1 : status = 0;
+            status === true ? status = 1 : status = 0;
             this.$axios.post(`sccg/admin/updateStatus/` + id + '?status=' + status).then(res => {
             })
         },
@@ -317,7 +289,7 @@
             this.$axios.get(`sccg/admin/list?keyword=${search}&current=${currentPage}&pageSize=${pageSize}`).then(res => {
                 if (res.code === 200) {
                     res.data.records.forEach(item => {
-                        item.status == 1 ? item.status = true : item.status = false;
+                        item.status === 1 ? item.status = true : item.status = false;
                     })
                     that.totalNum = res.data.total;
                     that.tableData = res.data.records;
@@ -332,12 +304,11 @@
         },
         // 璁剧疆琛ㄦ牸鏂戦┈绾�
         tableRowClassName({ row, rowIndex }) {
-            if ((rowIndex + 1) % 2 == 0) {
+            if ((rowIndex + 1) % 2 === 0) {
                 return 'warning-row';
             } else {
                 return 'success-row';
             }
-            return '';
         },
         // 澶勭悊鐢ㄦ埛鎵�灞炶鑹�
         filterRole(arr){
@@ -361,9 +332,9 @@
     watch: {
         refresh: {
             handler(newValue, oldValue) {
-                if (newValue == true) {
+                if (newValue) {
                     this.search = '';
-                    if (this.keyword != '') {
+                    if (this.keyword !== '') {
                         this.search = this.keyword;
                     }
                     this.currentPage = 1;
@@ -377,125 +348,37 @@
 }
 </script>
 <style lang="scss" scoped>
-main {
-    background-color: #09152f;
-    margin-top: 20px;
-    padding-bottom: 50px;
-    border: 1pox solid #fff;
+.mainContent {
+  display: flex;
+  justify-content: flex-start;
+  flex-wrap: nowrap;
 
-    .mainTitle {
-        line-height:60px;
-    }
-
+  .grid-content {
+    margin-left: 10px;
+    flex: 1;
     .tools {
-        display : flex;
-        justify-content: space-between;
-        align-items: center;
-        padding: 0 20px;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: nowrap;
 
-        .funs {
-            display: flex;
-            .funs-sp{
-                border: 1px solid #17324c;
-            }
-            .funsItem {
-                line-height: 28px;
-                display: flex;
-                align-items: center;
-                border-radius: 4px;
-                font-size: 12px;
-                margin-left: 10px;
+      .pagination {
+        margin-top: 55px;
+      }
 
-                .el-checkbox {
-                    width: 80px;
-                    padding: 0 10px;
-                }
-
-                .el-select {
-                    width: 120px;
-                }
-
-                &::v-deep .el-input__inner {
-                    border: none;
-                    background-color: #09152f;
-                }
-
-                &:hover {
-                    border: 1px solid #4b9bb7;
-                }
-
-                &:hover .el-checkbox {
-                    color: #4b9bb7;
-                }
-            }
-
+      .el-pagination {
+        &::v-deep li,
+        &::v-deep .btn-prev,
+        &::v-deep .btn-next {
+          background-color: #071f39;
+          color: #4b9bb7;
         }
 
-        .pagination {
-            margin-top: 50px;
-            display: flex;
-            line-height: 50px;
-            justify-content: center;
-
-            .el-pagination {
-
-                &::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;
         }
+      }
     }
-
-    .el-table {
-        color: #4b9bb7;
-        font-size: 10px;
-        .operation {
-            display: flex;
-            font-size: 10px;
-            .line {
-                padding: 0 1px;
-            }
-
-            span:hover {
-                cursor: pointer;
-            }
-        }
-    }
-    // &::v-deep .switchStyle .el-switch__label {
-    //     position: absolute;
-    //     display: none;
-    //     color: #fff;
-    // }
-
-    // &::v-deep .el-switch__core {
-    //     background-color: rgba(166, 166, 166, 1);
-    // }
-
-    // &::v-deep .switchStyle .el-switch__label--left {
-    //     z-index: 9;
-    //     left: 20px;
-    // }
-
-    // &::v-deep .switchStyle .el-switch__label--right {
-    //     z-index: 9;
-    //     left: 4px;
-    // }
-
-    // &::v-deep .switchStyle .el-switch__label.is-active {
-    //     display: block;
-    // }
-
-    // &::v-deep .switchStyle.el-switch .el-switch__core,
-    // &::v-deep .el-switch .el-switch__label {
-    //     width: 56px !important;
-    // }
+  }
 }
 </style>
\ No newline at end of file

--
Gitblit v1.8.0