From a3b4eb017a0f948348ef7732267c7ed0d4bca8c0 Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期二, 12 三月 2024 16:15:27 +0800
Subject: [PATCH] bug修改

---
 src/views/operate/message/myIndex/index.vue |  328 ++++++++++++++++++++++++------------------------------
 1 files changed, 148 insertions(+), 180 deletions(-)

diff --git a/src/views/operate/message/myIndex/index.vue b/src/views/operate/message/myIndex/index.vue
index 0bfa339..cda0e44 100644
--- a/src/views/operate/message/myIndex/index.vue
+++ b/src/views/operate/message/myIndex/index.vue
@@ -3,26 +3,30 @@
         <header>
             <div class="header-nav">
                 <span class="nav-left">鏁版嵁绛涢��</span>
-                <span class="nav-right" @click="showMoreParamsDialog">楂樼骇鎼滅储</span>
             </div>
             <div class="header-content">
                 <div class="search">
                     <span>杈撳叆鏌ヨ:</span>
                     <el-input placeholder="娑堟伅鏍囬" v-model="context"></el-input>
                 </div>
-                <div class="message-status">
+                <div class="search">
                     <span>娑堟伅鐘舵��:</span>
                     <el-select v-model="messageStatus" placeholder="璇烽�夋嫨娑堟伅鐘舵��">
                         <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value">
                         </el-option>
                     </el-select>
                 </div>
-                <div class="message-kind">
+                <div class="search">
                     <span>娑堟伅鍒嗙被:</span>
                     <el-select v-model="messageType" placeholder="璇烽�夋嫨娑堟伅鍒嗙被">
                         <el-option v-for="item in typeList" :key="item.id" :label="item.columnName" :value="item.id">
                         </el-option>
                     </el-select>
+                </div>
+                <div class="search">
+                    <span>鍒涘缓鏃堕棿:</span>
+                    <el-date-picker style="width: 200px" type="datetimerange" v-model="datetime"
+                        value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
                 </div>
                 <div class="find">
                     <el-button type="primary" icon="el-icon-search" @click="handleSearch">鏌ヨ</el-button>
@@ -34,13 +38,16 @@
             <div class="mainContent">
                 <div class="main-nav">
                     <span>鏁版嵁鍒楄〃</span>
-                    <el-button type="primary" icon="el-icon-plus" @click="dialogCreate = true">娣诲姞</el-button>
+                    <el-button class="button-addition" type="primary" icon="el-icon-plus"
+                        @click="handleOpera(null, 'create')">娣诲姞</el-button>
                 </div>
                 <!-- 鏁版嵁灞曠ず -->
-                <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
+                    border
+                    stripe
+                    ref="multipleTable"
+                    :header-cell-style="{  'background':'#F5F5F5', '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="5">
@@ -48,28 +55,24 @@
                     </el-table-column>
                     <el-table-column prop="head" label="鏍囬" min-width="10">
                     </el-table-column>
-                    <el-table-column prop="updateTime" label="淇敼鏃堕棿" min-width="10">
-                        <template slot-scope="scope">
-                            <span>{{changeTime(scope.row)}}</span>
-                        </template>
+                    <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10">
                     </el-table-column>
                     <el-table-column prop="targetFrom" label="鍙戝竷浜哄憳" min-width="15">
                     </el-table-column>
-                    <el-table-column prop="channelCode" label="娑堟伅鍒嗙被" min-width="10">
-                        <template slot-scope="scope">
-                            <span>{{ getMessageType(scope.row.channelCode) }}</span>
-                        </template>
+                    <el-table-column prop="messageTypeName" label="娑堟伅鏍忕洰" min-width="10">
                     </el-table-column>
                     <el-table-column prop="status" label="鍙戝竷鐘舵��" min-width="5">
                         <template slot-scope="scope">
-                            {{scope.row.status === 0 ? '鏈彂甯�' :'宸插彂甯�'}}
+                            {{ scope.row.status == 0 ? '鏈彂甯�' : '宸插彂甯�' }}
                         </template>
                     </el-table-column>
                     <el-table-column prop="operation" label="鎿嶄綔" min-width="15">
                         <template slot-scope="scope">
                             <div class="operation">
-                                <el-link icon="el-icon-view" :underline="false" @click="handleView(scope.row)">鏌ョ湅</el-link>
-                                <el-link icon="el-icon-edit" class="leftPx" :underline="false" @click="handleEdit(scope.row)">缂栬緫</el-link>
+                                <el-link icon="el-icon-view" :underline="false"
+                                    @click="handleOpera(scope.row, 'view')">鏌ョ湅</el-link>
+                                <el-link icon="el-icon-edit" class="leftPx" :underline="false"
+                                    @click="handleOpera(scope.row, 'update')">缂栬緫</el-link>
                                 <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false"
                                     @click="handleDelete([scope.row.id])">鍒犻櫎</el-link>
                             </div>
@@ -77,24 +80,15 @@
                     </el-table-column>
                 </el-table>
                 <!-- 鏂板缓娑堟伅 -->
-                <el-dialog title="鏂板缓娑堟伅" :visible.sync="dialogCreate" width="80%"
-                    :before-close="handleConfirmClose">
-                    <MyEdit @closeMyDialog="closeDialog" :type="'create'" :myDataRow="null"></MyEdit>
-                </el-dialog>
-                <!-- 娑堟伅璇︽儏 -->
-                <el-dialog title="娑堟伅璇︽儏" :visible.sync="dialogView" v-if="dialogView" width="45%"
-                    :before-close="handleClose">
-                    <MyView @closeDialog="closeDialog" :myDataRow="tableRowData">></MyView>
-                </el-dialog>
-                <!-- 缂栬緫椤甸潰 -->
-                <el-dialog title="缂栬緫娑堟伅" :visible.sync="dialogEdit" width="80%"
-                    :before-close="handleClose">
-                    <MyEdit  @closeDialog="closeDialog" :myDataRow="tableRowData" :type="'update'"></MyEdit>
+                <el-dialog :destroy-on-close="true" :key="dialogType" :title="getDialogTitle"
+                    :visible.sync="isShowDialog" width="80%">
+                    <my-edit v-if="isShowDialog" @closeMyDialog="closeDialog" :type="dialogType"
+                        :myDataRow="tableRowData"></my-edit>
                 </el-dialog>
                 <!-- tools -->
                 <div class="tools">
                     <div class="funs">
-                        <div class="funsItem funs-sp">
+                        <div class="funsItem funs-sp funs-first">
                             <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox>
                         </div>
                         <div class="funsItem funs-sp">
@@ -115,34 +109,39 @@
                     </div>
                 </div>
             </div>
-
-            <el-dialog
-                title="楂樼骇鍙傛暟"
-                :visible.sync="isShowMoreParams"
-                width="30%"
-                :before-close="handleClose">
-            </el-dialog>
         </main>
     </div>
 </template>
 <script>
-import helper from '@/utils/mydate'
 import MyView from './myview'
 import MyEdit from './update'
 import { deleteMessage, getMessageById, getMessageList } from "@/api/operate/messageManagement";
-import {SUCCESS_CODE} from "@/utils";
 
 export default {
     components: { MyView, MyEdit },
+    computed: {
+        getDialogTitle() {
+            if (this.dialogType === 'create') {
+                return '鍒涘缓';
+            }
+
+            if (this.dialogType === 'update') {
+                return '鏇存柊';
+            }
+
+            if (this.dialogType === 'view') {
+                return '鏌ョ湅';
+            }
+        }
+    },
     data() {
         return {
             tableData: [],
             tableRowData: null,
             isShowMoreParams: false,
-            context: '',
-            dialogEdit: false,
-            dialogCreate: false,
-            dialogView: false,
+            context: null,
+            isShowDialog: false,
+            dialogType: false,
             totalNum: null,
             pageSize: 10,
             currentPage: 1,
@@ -150,20 +149,21 @@
             unsame: false,
             myIdx: 0,
             preMyIdx: 0,
+            datetime: null,
             options: [
                 {
                     value: 0,
                     label: '鎵归噺鎿嶄綔',
                     disabled: true,
                 },
-                {
-                    value: 1,
-                    label: '鎵归噺鍚敤',
-                },
-                {
-                    value: 2,
-                    label: '鎵归噺绂佺敤',
-                },
+                // {
+                //     value: 1,
+                //     label: '鎵归噺鍚敤',
+                // },
+                // {
+                //     value: 2,
+                //     label: '鎵归噺绂佺敤',
+                // },
                 {
                     value: 3,
                     label: '鎵归噺鍒犻櫎',
@@ -188,86 +188,83 @@
             ],
             typeList: [
                 {
-                    id:'00',
-                    columnName:'鍏ㄩ儴',
+                    id: '00',
+                    columnName: '鍏ㄩ儴',
                 },
                 {
-                    id:'01',
-                    columnName:'绔欏唴淇�',
+                    id: '01',
+                    columnName: '绔欏唴淇�',
                 },
                 {
-                    id:'02',
-                    columnName:'閭欢',
+                    id: '03',
+                    columnName: '閭欢',
                 },
                 {
-                    id:'03',
-                    columnName:'鐭俊',
+                    id: '02',
+                    columnName: '鐭俊',
                 }
             ]
         }
     },
     created() {
-      this.getMessageList();
+        this.getMessageList();
     },
 
     methods: {
         // 鏌ヨ
-        handleSearch(){         
+        handleSearch() {
             this.getMessageList();
         },
 
         // 閲嶇疆
-        handleReset(){
-          this.messageStatus = 2;
-          this.messageType = '00';
-          this.context = '';
+        handleReset() {
+            this.messageStatus = 2;
+            this.messageType = '00';
+            this.context = '';
+            this.getMessageList();
         },
 
         // 鏌ョ湅
-        handleView(data){
+        handleOpera(data, type) {
             this.tableRowData = data;
-            this.dialogView = true;
-        },
-
-         // 缂栬緫
-        handleEdit(data){
-            this.tableRowData = data;
-            this.dialogEdit = true;
+            this.dialogType = type;
+            this.isShowDialog = true;
         },
 
         // 鍒犻櫎淇℃伅
         handleDelete(idarr) {
             this.$confirm('纭鍒犻櫎?')
                 .then(() => {
-                  deleteMessage(idarr)
-                      .then(({ code, message }) => {
-                        if (code === SUCCESS_CODE) {
-                          this.getMessageList();
-                          this.$message({ type: 'success', message });
-                        } else {
-                          this.$message({ type: 'error', message });
-                        }
-                      })
-                      .catch(err => { this.$message({ type: 'error', message: err }) });
+                    deleteMessage({ ids: idarr.join(',') })
+                        .then(() => {
+                            this.getMessageList();
+                            this.$message.success('鎿嶄綔鎴愬姛');
+                        })
+                        .catch(err => { this.$message({ type: 'error', message: err }) });
                 })
         },
 
         // 鑾峰彇娑堟伅鏁版嵁
         getMessageList() {
-          const messageParam = {
-            current: this.currentPage,
-            size: this.pageSize,
-            channelCode: this.messageType,
-            status: this.messageStatus,
-            head: this.context
-          }
-          getMessageList(messageParam)
-              .then(({ data }) => {
-                this.tableData = [];
-              })
-              .catch(err => {
-                this.$message({ type: 'error', message: err });
-              });
+            const messageParam = {
+                current: this.currentPage,
+                pageSize: this.pageSize,
+                channelCode: this.messageType === '00' ? null : this.messageType,
+                status: this.messageStatus === 2 ? null : this.messageStatus,
+                head: this.context,
+                startTime: this.datetime ? this.datetime[0] : null,
+                endTime: this.datetime ? this.datetime[1] : null
+            }
+
+            getMessageList(messageParam)
+                .then(({ records, total, size }) => {
+                    this.tableData = records;
+                    this.totalNum = total;
+                    this.pageSize = size;
+                })
+                .catch(err => {
+                    this.$message({ type: 'error', message: err });
+                });
         },
 
         // 鎵归噺涓嬫媺妗嗘搷浣�
@@ -314,7 +311,7 @@
                             }
                         })
                 })
-                .catch(err => {  })
+                .catch(err => { })
         },
 
         // 琛ㄦ牸鐩戝惉
@@ -325,12 +322,6 @@
             })
             this.all = list.length === this.tableData.length;
         },
-
-        // 淇敼鏃堕棿鏍煎紡
-        changeTime({ updateTime }) {
-            return helper(updateTime);
-        },
-
         // 鍏ㄩ��
         selectAll() {
             this.$refs.multipleTable.toggleAllSelection();
@@ -358,37 +349,10 @@
             this.getMessageList();
         },
 
-        showMoreParamsDialog() {
-          this.isShowMoreParams = true;
-        },
-
-        // 鍏抽棴寮圭獥
-        handleClose(done) {
-            done();
-        },
-
-        // 纭鍏抽棴寮圭獥
-        handleConfirmClose(done) {
-            this.$confirm('纭鍏抽棴?')
-                .then(_ => {
-                    done();
-                })
-                .catch(err => {
-                })
-        },
-
         // 鑷畾涔夊叧闂脊绐�
-        closeDialog({ flag, index }) {
-            this.dialogCreate = flag;
-            this.dialogView = flag;
-            if (index === 1) {
-                this.getMessageList();
-            }
-        },
-
-        getMessageType(id) {
-          const result = this.typeList.find(item => item.id === id);
-          return result.columnName;
+        closeDialog() {
+            this.isShowDialog = false;
+            this.getMessageList();
         }
     }
 }
@@ -396,32 +360,31 @@
 <style lang="scss" scoped>
 .userList {
     text-align: left;
-    margin: 10px 20px;
-    color: #4b9bb7;
-
+    padding: 10px 20px;
+    color: #606266;
+  border: 1px solid #ccc;
     header {
-        background-color: #09152f;
+        background-color: white;
 
         .header-nav {
             line-height: 40px;
-            padding: 0 30px;
+            //padding: 0 30px;
             display: flex;
             justify-content: space-between;
             font-weight: 650;
         }
 
         .header-content {
-            padding: 0 40px;
+            padding: 0;
             display: flex;
             line-height: 100px;
             justify-content: space-between;
             align-items: center;
-
-            .search,
-            .message-status,
-            .message-kind {
+          flex-wrap: wrap;
+            .search {
                 display: flex;
-                justify-content: flex-start;
+                justify-content: space-between;
+                align-items: center;
 
                 span {
                     flex: 1;
@@ -432,8 +395,8 @@
                     color: #1d3f57;
 
                     &::v-deep .el-input__inner {
-                        background-color: #09152f;
-                        border: 1px solid #17324c;
+                        //background-color: #09152f;
+                        //border: 1px solid #17324c;
                     }
                 }
 
@@ -455,7 +418,7 @@
     }
 
     main {
-        background-color: #09152f;
+        background-color: white;
         margin-top: 20px;
         padding-bottom: 50px;
 
@@ -482,20 +445,22 @@
             display: flex;
             justify-content: space-between;
             align-items: center;
-            padding: 0 20px;
+            //padding: 0 20px;
 
             .funs {
                 display: flex;
-
+                .funs-first{
+                  margin-left: 0!important;
+                }
                 .funs-sp {
-                    border: 1px solid #17324c;
+                  //border: 1px solid #DCDFE6;
                 }
 
                 .funsItem {
                     line-height: 28px;
                     display: flex;
                     align-items: center;
-
+                  border: 1px solid #DCDFE6;
                     border-radius: 4px;
                     font-size: 12px;
                     margin-left: 10px;
@@ -511,7 +476,7 @@
 
                     &::v-deep .el-input__inner {
                         border: none;
-                        background-color: #09152f;
+                        //background-color: #09152f;
                     }
 
                     &:hover {
@@ -531,29 +496,29 @@
                 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;
-                    }
-                }
+                //.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;
+                //    }
+                //}
             }
         }
 
         .el-table {
-            color: #4b9bb7;
-            font-size: 10px;
+            // color: #606266;
+            // font-size: 10px;
 
             &::v-deep .el-table__empty-block {
-                background-color: #09152f;
+                //background-color: #09152f;
             }
 
             &::v-deep .el-table__empty-block {
@@ -566,7 +531,7 @@
                 .line {
                     padding: 0 5px;
                 }
-
+                color: var(--operation-color);
                 span:hover {
                     cursor: pointer;
                 }
@@ -574,11 +539,11 @@
         }
 
         .el-table::v-deep .warning-row {
-            background: #06122c;
+            //background: #06122c;
         }
 
         .el-table::v-deep .success-row {
-            background: #071f39;
+            //background: #071f39;
         }
 
         &::v-deep .switchStyle .el-switch__label {
@@ -613,7 +578,7 @@
 
     &::v-deep .el-dialog__header,
     &::v-deep .el-dialog__body {
-        background-color: #06122c;
+        //background-color: #06122c;
     }
 
     &::v-deep .el-dialog__header {
@@ -625,17 +590,20 @@
     }
 
     &::v-deep .el-dialog__title {
-        color: #4b9bb7;
+        color: #606266;
     }
 
     &::v-deep .el-dialog__close {
         width: 20px;
         height: 20px;
-        // color: #fff;
     }
 
     &::v-deep .el-dialog__body {
         padding: 0;
     }
+
+    :deep(.el-range-input) {
+        //background-color: #09152f;
+    }
 }
-</style>
\ No newline at end of file
+</style>

--
Gitblit v1.8.0