Sfoglia il codice sorgente

Merge branch 'xiaoqin' into mergeBranch

codeMan 3 anni fa
parent
commit
b02522b9d8

+ 1 - 0
src/SManagement/archives_ad/components/list.vue

@@ -84,6 +84,7 @@ export default {
 .list-box .list {
   width: 168px;
   margin: 0 30px 30px 0;
+  border-radius: 4px;
   transition: all 0.2s ease-out;
   cursor: pointer;
 }

+ 43 - 26
src/SManagement/user/role-edit/components/RolePowerSelect.vue

@@ -7,7 +7,9 @@
       <el-col :span="11" style="margin-right:16px">
         <div class="handle">
           <search @searchActive="searchActive" @clearData="clearData"></search>
-          
+          <el-select size="small" clearable @clear="clearCategory" v-model="power.content.where.systemclientname" placeholder="筛选端口" @change="categoryChange()">
+            <el-option v-for="(item,index) in selectList" :label="item" :value="item" :key="index"></el-option>
+          </el-select>
         </div>
         <table-layout :layout="tablecols" :data="powerList" @rowClick="rowClick"></table-layout>
         <div class="page">
@@ -30,7 +32,7 @@
                 </template>
               </el-checkbox-group>
               <div class="footer padd">
-                <el-checkbox label="" :checked="allCheck"  v-if="bbb" @change="allCheckClick">{{checkAll}}</el-checkbox>
+                <el-checkbox label="" :checked="allCheck" v-if="bbb" @change="allCheckClick">{{checkAll}}</el-checkbox>
               </div>
             </div>
           </el-col>
@@ -60,7 +62,7 @@ export default {
   data () {
     return {
       aaa: true,
-      bbb:true,
+      bbb: true,
       power: {
         "classname": "sale.role.role",
         "method": "query_appselect_web",
@@ -69,7 +71,8 @@ export default {
           "pageSize": 10,
           "roleid": parseInt(window.sessionStorage.getItem('currentEditRole')) == 0 ? 0 : JSON.parse(window.sessionStorage.getItem('currentEditRole')).roleid,
           "where": {
-            "condition": ""
+            "condition": "",
+            "systemclientname":''
           }
         }
       },
@@ -78,8 +81,10 @@ export default {
       total: 2,
       //应用表数据
       powerList: [],
+      //端口分类列表
+      selectList:[],
       //存储上一次临时应用表数据
-      tempPowerList:[],
+      tempPowerList: [],
       //注册表
       tablecols: [],
       //当前选中权限
@@ -87,7 +92,7 @@ export default {
       //选中权限集合
       systemapps: [],
       currentItem: [],
-      allCheck:false
+      allCheck: false,
     };
   },
   props: [],
@@ -103,7 +108,7 @@ export default {
         }
       }
     },
-    checkAll() {
+    checkAll () {
       let count = this.currentItem.optionids ? this.currentItem.optionids.length : 0
       let all = this.currentItem.options ? this.currentItem.options.length : 0
       return count + '/' + all
@@ -120,8 +125,8 @@ export default {
   },
   methods: {
     //当编辑逻辑时 拉取所有数据 储存所有已授权数据
-    getAllHavePower() {
-      if(parseInt(window.sessionStorage.getItem('currentEditRole')) != 0) {
+    getAllHavePower () {
+      if (parseInt(window.sessionStorage.getItem('currentEditRole')) != 0) {
         this.$api.requested({
           "classname": "sale.role.role",
           "method": "query_appselect_web",
@@ -131,14 +136,14 @@ export default {
               "condition": ""
             }
           }
-        }).then( res => {
+        }).then(res => {
           let data = res.data.filter(item => item.optionids.length > 0)
           let result
-          this.tempPowerList.forEach((item,index) => {
+          this.tempPowerList.forEach((item, index) => {
             result = data.find(item2 => item2.systemappid == item.systemappid)
             this.tempPowerList.push(result)
-          }) 
-          this.getPowerList()         
+          })
+          this.getPowerList()
         })
       } else {
         this.getPowerList()
@@ -147,7 +152,10 @@ export default {
     //获取授权列表
     getPowerList () {
       this.$api.requested(this.power).then(res => {
+        this.selectList = res.tips.client
         this.powerList = res.data
+        console.log(this.selectList);
+        
         this.handleHavePower()
         this.calcHavePower(this.powerList)
         this.currentItem = this.powerList[0]
@@ -157,14 +165,14 @@ export default {
       })
     },
     //抓取所有操作过的数据
-    handleHavePower() {
-      if(this.tempPowerList.length == 0) {
+    handleHavePower () {
+      if (this.tempPowerList.length == 0) {
         this.tempPowerList.push(...this.powerList)
       } else {
         let result
-        for(let i=0;i<this.powerList.length;i++) {
+        for (let i = 0; i < this.powerList.length; i++) {
           let result = this.tempPowerList.find(item => item.systemappid == this.powerList[i].systemappid)
-          if(result != undefined) {
+          if (result != undefined) {
             continue
           } else {
             this.tempPowerList.push(this.powerList[i])
@@ -173,12 +181,12 @@ export default {
       }
     },
     //同步上一次获取的选中数据信息
-    calcHavePower(data) {
-      if(this.tempPowerList.length > 0) {
+    calcHavePower (data) {
+      if (this.tempPowerList.length > 0) {
         let result
         for (let i = 0; i < data.length; i++) {
           result = this.tempPowerList.find(item2 => item2.systemappid == data[i].systemappid)
-          if(result != undefined) {
+          if (result != undefined) {
             data[i] = result
           }
         }
@@ -207,11 +215,11 @@ export default {
         this.bbb = true
       })
     },
-    allCheckClick() {
+    allCheckClick () {
       this.allCheck = !this.allCheck
-      if(this.allCheck) {
+      if (this.allCheck) {
         this.currentItem.options.forEach(item => {
-          if(this.currentItem.optionids.find(item2 => item2 == item.optionid) == undefined) {
+          if (this.currentItem.optionids.find(item2 => item2 == item.optionid) == undefined) {
             this.currentItem.optionids.push(item.optionid)
           }
         })
@@ -239,18 +247,25 @@ export default {
       this.getPowerList()
     },
     //重新渲染checkbox
-    refreshItem(target) {
+    refreshItem (target) {
       target.bbb = false
       setTimeout(() => {
         target.bbb = true
       })
+    },
+    categoryChange() {
+      this.getPowerList()      
+    },
+    clearCategory() {
+      this.power.content.where.systemclientname = ''
+      this.getPowerList()
     }
   },
 };
 </script>
 
 <style scoped>
-*{
+* {
   box-sizing: border-box;
 }
 .role-power-select {
@@ -265,7 +280,9 @@ export default {
   color: #333333;
   margin-bottom: 30px;
 }
-.search {
+.role-power-select .handle {
+  display: flex;
+  align-items: center;
   margin-bottom: 16px;
 }
 .role-power-select .power-block {

+ 1 - 1
src/components/layout/index.vue

@@ -9,7 +9,7 @@
            <img width="30" src="../../assets/nav_icon/work_station.svg" alt="">
            <p>工作台</p>
         </div>
-        <div class="item">
+        <div class="item" @click="$router.push('/message')">
            <img width="30" src="../../assets/nav_icon/work_station.svg" alt="">
            <p>消息</p>
         </div>

+ 205 - 202
src/router/HManagement.js

@@ -15,15 +15,16 @@ const HManagement = [
       ast_nav: true
     },
     component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_ad/dataAnalysis/index.vue')
-  }, {
-    path: '/archives_adclass',
-    name: 'archives_adclass',
-    meta: {
-      title: '素材分类',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_ad/archives_adclass/index.vue')
   },
+  // }, {
+  //   path: '/archives_adclass',
+  //   name: 'archives_adclass',
+  //   meta: {
+  //     title: '素材分类',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_ad/archives_adclass/index.vue')
+  // },
 
   {
     path: '/role_manage',
@@ -41,7 +42,8 @@ const HManagement = [
       ast_nav: true
     },
     component: () => import(/* webpackChunkName: "about" */ '@/HManagement/roleManage/modules/role_details.vue')
-  }, {
+  }, 
+  {
     path: '/roleEdit',
     name: 'roles',
     meta: {
@@ -65,199 +67,200 @@ const HManagement = [
       ast_nav: true
     },
     component: resolve => require(['@/HManagement/accountManage/modules/account_detail'], resolve)
-  }, {
-    path: '/depManage',
-    name: 'depManage',
-    meta: {
-      title: '组织架构',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/department/index.vue'),
-  }, {
-    path: '/depManage/staffDetail',
-    name: 'depManage',
-    meta: {
-      title: '员工详情',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/department/staff/detail/index.vue')
-  }, {
-    path: '/salermag',
-    name: 'salermag',
-    meta: {
-      title: '营销组织',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/index.vue')
-  }, {
-    path: '/add_saler',
-    name: 'salermag',
-    meta: {
-      title: '新建业务员',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/saler/modules/add_saler.vue')
-  }, {
-    path: '/saler_detail',
-    name: 'salermag',
-    meta: {
-      title: '业务员详情',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/saler/modules/saler_detail.vue')
-  }, {
-    path: '/add_agent',
-    name: 'salermag',
-    meta: {
-      title: '新建经销商',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/agent/modules/add_agent.vue')
-  }, {
-    path: '/edit_agent',
-    name: 'salermag',
-    meta: {
-      title: '编辑经销商',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/agent/modules/edit_agent.vue')
-  }, {
-    path: '/agent_detail',
-    name: 'salermag',
-    meta: {
-      title: '经销商详情',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/agent/modules/agent_detail.vue')
-  },{
-    path: '/notice_mag_list',
-    name: 'noticemag',
-    meta: {
-      title: '通告管理',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/index.vue')
-  },{
-    path: '/notice_add',
-    name: 'noticemag',
-    meta: {
-      title: '编辑通告',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/list/modules/add_notice.vue')
-  },{
-    path: '/notice_edit',
-    name: 'noticemag',
-    meta: {
-      title: '编辑通告',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/list/modules/edit_notice.vue')
-  },{
-    path: '/noticeclass',
-    name: 'noticeclass',
-    meta: {
-      title: '通告板块',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/pate/index.vue')
-  },{
-    path: '/notice_analysis',
-    name: 'noticemag',
-    meta: {
-      title: '数据分析',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/dataAnalysis/index.vue')
-  },{
-    path: '/submit_mag',
-    name: 'submit_mag',
-    meta: {
-      title: '提报管理',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/index.vue')
-  },{
-    path: '/submit_add',
-    name: 'submit_mag',
-    meta: {
-      title: '提报管理',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/list/modules/submit_add.vue')
-  },{
-    path: '/submit_edit',
-    name: 'submit_mag',
-    meta: {
-      title: '提报管理',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/list/modules/submit_edit.vue')
-  },{
-    path: '/submit_detail',
-    name: 'submit_mag',
-    meta: {
-      title: '提报明细',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/list/modules/content.vue')
-  },{
-    path: '/submit_statistics',
-    name: 'submit_mag',
-    meta: {
-      title: '数据分析',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/dataAnalysis/index.vue')
-  },{
-    path: '/archvies_mag',
-    name: 'archvies_mag',
-    meta: {
-      title: ' 营销物料',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archvies_mag/index.vue')
-  },{
-    path: '/archives_scmag',
-    name: 'archives_scmag',
-    meta: {
-      title: '商学院管理',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/index.vue')
-  }, {
-    path: '/archives_scadd',
-    name: 'archives_scmag',
-    meta: {
-      title: '编辑课程',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/list/modules/add.vue')
-  }, {
-    path: '/archives_scedit',
-    name: 'archives_scmag',
-    meta: {
-      title: '编辑课程',
-      ast_nav: true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/list/modules/edit.vue')
-  },{
-    path: '/archives_scdetails',
-    name: 'archives_scmag',
-    meta: {
-      title: '课程详情',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/list/modules/details.vue')
-  },{
-    path: '/archives_scclass',
-    name: 'archives_scclass',
-    meta: {
-      title: '课程分类',
-      ast_nav:true
-    },
-    component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/archives_scclass/index.vue')
-  },
+  }, 
+  // {
+  //   path: '/depManage',
+  //   name: 'depManage',
+  //   meta: {
+  //     title: '组织架构',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/department/index.vue'),
+  // }, {
+  //   path: '/depManage/staffDetail',
+  //   name: 'depManage',
+  //   meta: {
+  //     title: '员工详情',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/department/staff/detail/index.vue')
+  // }, {
+  //   path: '/salermag',
+  //   name: 'salermag',
+  //   meta: {
+  //     title: '营销组织',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/index.vue')
+  // }, {
+  //   path: '/add_saler',
+  //   name: 'salermag',
+  //   meta: {
+  //     title: '新建业务员',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/saler/modules/add_saler.vue')
+  // }, {
+  //   path: '/saler_detail',
+  //   name: 'salermag',
+  //   meta: {
+  //     title: '业务员详情',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/saler/modules/saler_detail.vue')
+  // }, {
+  //   path: '/add_agent',
+  //   name: 'salermag',
+  //   meta: {
+  //     title: '新建经销商',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/agent/modules/add_agent.vue')
+  // }, {
+  //   path: '/edit_agent',
+  //   name: 'salermag',
+  //   meta: {
+  //     title: '编辑经销商',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/agent/modules/edit_agent.vue')
+  // }, {
+  //   path: '/agent_detail',
+  //   name: 'salermag',
+  //   meta: {
+  //     title: '经销商详情',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/marketing/agent/modules/agent_detail.vue')
+  // },{
+  //   path: '/notice_mag_list',
+  //   name: 'noticemag',
+  //   meta: {
+  //     title: '通告管理',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/index.vue')
+  // },{
+  //   path: '/notice_add',
+  //   name: 'noticemag',
+  //   meta: {
+  //     title: '编辑通告',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/list/modules/add_notice.vue')
+  // },{
+  //   path: '/notice_edit',
+  //   name: 'noticemag',
+  //   meta: {
+  //     title: '编辑通告',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/list/modules/edit_notice.vue')
+  // },{
+  //   path: '/noticeclass',
+  //   name: 'noticeclass',
+  //   meta: {
+  //     title: '通告板块',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/pate/index.vue')
+  // },{
+  //   path: '/notice_analysis',
+  //   name: 'noticemag',
+  //   meta: {
+  //     title: '数据分析',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/notice/dataAnalysis/index.vue')
+  // },{
+  //   path: '/submit_mag',
+  //   name: 'submit_mag',
+  //   meta: {
+  //     title: '提报管理',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/index.vue')
+  // },{
+  //   path: '/submit_add',
+  //   name: 'submit_mag',
+  //   meta: {
+  //     title: '提报管理',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/list/modules/submit_add.vue')
+  // },{
+  //   path: '/submit_edit',
+  //   name: 'submit_mag',
+  //   meta: {
+  //     title: '提报管理',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/list/modules/submit_edit.vue')
+  // },{
+  //   path: '/submit_detail',
+  //   name: 'submit_mag',
+  //   meta: {
+  //     title: '提报明细',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/list/modules/content.vue')
+  // },{
+  //   path: '/submit_statistics',
+  //   name: 'submit_mag',
+  //   meta: {
+  //     title: '数据分析',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/submit/dataAnalysis/index.vue')
+  // },{
+  //   path: '/archvies_mag',
+  //   name: 'archvies_mag',
+  //   meta: {
+  //     title: ' 营销物料',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archvies_mag/index.vue')
+  // },{
+  //   path: '/archives_scmag',
+  //   name: 'archives_scmag',
+  //   meta: {
+  //     title: '商学院管理',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/index.vue')
+  // }, {
+  //   path: '/archives_scadd',
+  //   name: 'archives_scmag',
+  //   meta: {
+  //     title: '编辑课程',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/list/modules/add.vue')
+  // }, {
+  //   path: '/archives_scedit',
+  //   name: 'archives_scmag',
+  //   meta: {
+  //     title: '编辑课程',
+  //     ast_nav: true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/list/modules/edit.vue')
+  // },{
+  //   path: '/archives_scdetails',
+  //   name: 'archives_scmag',
+  //   meta: {
+  //     title: '课程详情',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/list/modules/details.vue')
+  // },{
+  //   path: '/archives_scclass',
+  //   name: 'archives_scclass',
+  //   meta: {
+  //     title: '课程分类',
+  //     ast_nav:true
+  //   },
+  //   component: () => import(/* webpackChunkName: "about" */ '@/HManagement/archives_sc/archives_scclass/index.vue')
+  // },
     {path: '/archives_sc_analysis',
     name: 'archives_scmag',
     meta: {

+ 8 - 0
src/router/SManagement.js

@@ -131,6 +131,14 @@ const SManagement = [{
     ast_nav: true
   },
   component: () => import(/* webpackChunkName: "about" */ '@/SManagement/user/role-edit/RoleEdit')
+},{
+  path: '/message',
+  name: 'message',
+  meta: {
+    title: '消息中心',
+    ast_nav: false
+  },
+  component: () => import(/* webpackChunkName: "about" */ '@/views/message/index')
 }
 ]
 export default SManagement

+ 141 - 0
src/views/message/components/list.vue

@@ -0,0 +1,141 @@
+<template>
+  <div class="list">
+    <div class="item-box" v-for="(item,index) in list" :key="index" @click="detailClick(item)">
+      <div class="item">
+        <div class="left">
+          <p class="title">{{item.title}}</p>
+          <p class="message">{{item.message}}</p>
+          <div class="info">
+            <div class="tag">{{item.objectname}}</div>
+            <p class="time">{{item.createdate}}</p>
+          </div>
+        </div>
+        <div class="right">
+          <div class="read" v-if="item.isread == 1">已读</div>
+          <div class="no-read" v-else>未读</div>
+        </div>
+      </div>
+    </div>
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      width="960px"
+      :before-close="handleClose">
+      <p>{{message}}</p>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose()">关闭</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { log } from '@antv/g2plot/lib/utils';
+export default {
+  name: 'list',
+  data () {
+    return {
+      dialogVisible:false,
+      message: ''
+    };
+  },
+  props:['list'],
+  computed: {
+  },
+  watch: {
+  },
+  methods: {
+    handleClose() {
+      this.dialogVisible = false
+    },
+    async detailClick(item) {
+      let result = await this.$api.requested({
+        "classname": "system.message.Message",
+        "method": "readMessage",
+        "content": {
+            "messageid":item.messageid
+        }
+      })
+      item.isread = 1
+      this.message = item.message
+      this.dialogVisible = true
+    }
+  },
+};
+</script>
+
+<style scoped>
+*{
+  box-sizing: border-box;
+}
+.list {
+  width: 100%;
+  min-height: 100%;
+  margin-top: 10px;
+}
+.list .item-box {
+  padding: 0 30px;
+  cursor: pointer;
+}
+.list .item-box:hover {
+  background: #fafafa;
+}
+.list .item-box .item {
+  border-bottom: 1px solid #eeeeee;
+  display: flex;
+  justify-content: space-between;
+  padding: 20px 0;
+}
+.list .item-box .item:last-child {
+}
+.list .item-box .item .left {
+}
+.list .item-box .item .left .title {
+  margin-bottom: 10px;
+  font-size: 14px;
+  font-weight: 500;
+  color: #333333;
+}
+.list .item-box .item .left .message {
+  margin-bottom: 10px;
+  font-size: 12px;
+  font-weight: 400;
+  color: #666666;
+}
+.list .item-box .item .left .info {
+  display: flex;
+  align-items: center;
+}
+.list .item-box .item .left .info .tag {
+  padding: 4px 6px;
+  border: 1px solid #3874F6;
+  color: #3874F6;
+  font-size: 12px;
+  border-radius: 2px;
+  margin-right: 10px;
+}
+.list .item-box .item .left .info .time {
+  font-size: 12px;
+  font-weight: 400;
+  color: #999999;
+}
+.list .item-box .item .right .read {
+  background: #FFEBEA;
+  border-radius: 4px 4px 4px 4px;
+  padding: 6px 16px;
+  color: #FF3B30;
+  font-size: 14px;
+}
+.list .item-box .item .right .no-read {
+  background: #EEEEEE;
+  border-radius: 4px 4px 4px 4px;
+  padding: 6px 16px;
+  color: #999999;
+  font-size: 14px;
+}
+.dialog-footer {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+</style>

+ 114 - 0
src/views/message/index.vue

@@ -0,0 +1,114 @@
+<template>
+  <div class="message">
+    <div class="select">
+      <div @click="selectFun('系统')"
+        :style="currentItem==0 ? 'background:#3874F6;color:#ffffff' : 'border:1px solid #cccccc'">系统消息</div>
+      <div @click="selectFun('应用')"
+        :style="currentItem==1 ? 'background:#3874F6;color:#ffffff' : 'border:1px solid #cccccc'">应用消息</div>
+    </div>
+    <list :list="list"></list>
+    <pagination :total="total" :pageSize="param.content.pageSize" :currentPage="param.content.pageNumber"
+      @pageChange="pageChange">
+    </pagination>
+  </div>
+</template>
+
+<script>
+import list from '@/views/message/components/list'
+
+import pagination from '@/components/pagination/Pagination'
+import { log } from '@antv/g2plot/lib/utils';
+export default {
+  name: '',
+  data () {
+    return {
+      currentItem: 0,
+      param: {
+        "classname": "system.message.Message",
+        "method": "queryMessage",
+        "content": {
+          "nocache": true,
+          "pageNumber": 1,
+          "pageSize": 10,
+          "type": ''
+        }
+      },
+      list: [],
+      total:0
+    };
+  },
+  components: { list ,pagination },
+  computed: {
+  },
+  watch: {
+  },
+  created () {
+    this.getMessageList()
+  },
+  methods: {
+    getMessageList () {
+      this.param.content.type = this.currentItem == 0 ? '系统' : '应用'
+      this.$api.requested(this.param).then(res => {
+        this.list = res.data
+        this.total = res.total
+        console.log(this.list);
+
+      })
+    },
+    selectFun (data) {
+      this.param.content.pageNumber = 1
+      this.currentItem = data == '系统' ? 0 : 1
+      this.getMessageList()
+    },
+    pageChange(n) {
+      this.param.content.pageNumber = n
+      this.getMessageList()
+    }
+  },
+};
+</script>
+
+<style scoped>
+* {
+  box-sizing: border-box;
+}
+.message {
+  width: 1200px;
+  min-height: 100%;
+  margin: 0 auto;
+  background: #ffffff;
+  padding-top: 30px;
+  position: relative;
+}
+.message .select {
+  width: 200px;
+  height: 36px;
+  border-radius: 4px;
+  display: flex;
+  justify-content: space-between;
+  line-height: 36px;
+  font-size: 14px;
+  margin-left: 30px;
+}
+.message .select div {
+  width: 50%;
+  height: 34px;
+  text-align: center;
+  cursor: pointer;
+  transition: background 0.2s ease-in-out;
+}
+.message .select div:first-child {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+.message .select div:last-child {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+.el-pagination {
+  position: absolute;
+  right: 30px;
+  bottom: 0;
+  margin-top: 16px;
+}
+</style>