通知管理 列表

src/api/system/logs.js

@@ -9,4 +9,47 @@ export function warnRemark(data) {
   })
 }
 
-export default { warnRemark }
+// ------通知管理-------
+// 获取表格
+export function getNoticeList(params) {
+  return request({
+    url: 'api/notice/list',
+    method: 'get',
+    params
+  })
+}
+
+// 获取用户
+export function getAllUser(params) {
+  return request({
+    url: 'api/users/all',
+    method: 'get',
+    params
+  })
+}
+
+// 获取设备
+export function getAllDev(params) {
+  return request({
+    url: 'api/device/all',
+    method: 'get',
+    params
+  })
+}
+
+// 发布
+export function noticeCreate(data) {
+  return request({
+    url: 'api/notice/create',
+    method: 'post',
+    data
+  })
+}
+
+export default {
+  warnRemark,
+  noticeCreate,
+  getNoticeList,
+  getAllUser,
+  getAllDev
+}

src/views/system/notifyManage/index.vue

@@ -16,23 +16,37 @@
         ref="table"
         :data="tableData"
         style="width: 100%;"
-        height="calc(100vh - 245px)"
+        height="calc(100vh - 294px)"
         @row-click="clickRowHandler"
         @selection-change="selectionChangeHandler"
       >
         <el-table-column type="selection" width="55" align="center" />
         <el-table-column type="index" label="序号" width="100" align="center" />
-        <el-table-column prop="notification" :show-overflow-tooltip="true" label="通知内容" min-width="500" align="center" />
-        <el-table-column prop="msgType" label="消息类型" align="center" min-width="150" />
-        <el-table-column prop="pushObj" label="推送对象" align="center" min-width="150" />
-        <el-table-column prop="sendRole" label="推送人" align="center" min-width="150" />
-        <el-table-column prop="sendTime" label="推送时间" align="center" min-width="180" />
+        <el-table-column prop="noticeContent" :show-overflow-tooltip="true" label="通知内容" min-width="200" align="center" />
+        <el-table-column prop="noticeType" label="消息类型" align="center" min-width="150" />
+        <el-table-column prop="pushTo" label="推送对象" align="center" min-width="150" />
+        <el-table-column prop="update_by" label="推送人" align="center" min-width="150" />
+        <el-table-column prop="create_time" label="推送时间" align="center" min-width="180">
+          <template slot-scope="scope">
+            <div>{{ scope.row.create_time | parseTime }}</div>
+          </template>
+        </el-table-column>
         <!-- <el-table-column prop="bindState" label="绑定状态" align="center">
           <template slot-scope="scope">
             <span class="clear" style="width:76px">{{ scope.row.bindState }}</span>
           </template>
         </el-table-column> -->
       </el-table>
+      <!-- <pagination /> -->
+      <el-pagination
+        :page-size.sync="page.size"
+        :total="page.total"
+        :current-page.sync="page.page"
+        style="margin-top: 8px;"
+        layout="total, prev, pager, next, sizes"
+        @size-change="sizeChangeHandler($event)"
+        @current-change="pageChangeHandler"
+      />
       <!-- 发布 -->
       <el-dialog append-to-body :close-on-click-modal="false" :visible.sync="sendVisible" title="发布通知" @close="handleClose">
         <span class="dialog-right-top" />
@@ -53,7 +67,7 @@
             <el-form-item label="发布内容" prop="notification" style="margin-bottom:8px">
               <textarea v-model="sendForm.notification" cols="38" rows="6" />
             </el-form-item>
-            <el-form-item label="推送对象" prop="pushObj">
+            <el-form-item label="推送对象" prop="">
               <el-radio-group v-model="pushObj" @change="pushObjChange">
                 <el-radio label="用户">用户</el-radio>
                 <el-radio label="设备">设备</el-radio>
@@ -87,9 +101,25 @@
 </template>
 
 <script>
-import data1 from './data1.json'
+import { presenter, crud } from '@crud/crud'
+// import pagination from '@crud/Pagination'
+import { getAllDev, getAllUser, getNoticeList } from '@/api/system/logs'
+
 export default {
   name: 'NotifyManage',
+  // components: { pagination },
+  mixins: [presenter(), crud()],
+  // cruds() {
+  //   return CRUD({
+  //     url: '/api/notice/list'
+  //     // optShow: {
+  //     //   add: false,
+  //     //   edit: false,
+  //     //   del: false,
+  //     //   download: true
+  //     // }
+  //   })
+  // },
   data() {
     return {
       tableData: [],
@@ -105,26 +135,26 @@ export default {
       pushObj: '用户',
       checked: '',
       msgTypeOptions: [
-        { value: 1, label: '系统通知' },
-        { value: 2, label: '报警消息', disabled: true },
-        { value: 3, label: '借还消息', disabled: true },
-        { value: 4, label: '下载消息', disabled: true }
+        { value: 1, label: '系统通知' }
+        // { value: 2, label: '报警消息', disabled: true },
+        // { value: 3, label: '借还消息', disabled: true },
+        // { value: 4, label: '下载消息', disabled: true }
       ],
-      personOptions: [
-        { value: 0, label: '全部用户' },
-        { value: 1, label: '部门名称 - 张三' },
-        { value: 2, label: '部门名称 - 李四' },
-        { value: 3, label: '部门名称 - 王五' },
-        { value: 4, label: '部门名称 - 张三' },
-        { value: 5, label: '部门名称 - 李四' },
-        { value: 6, label: '部门名称 - 王五' },
-        { value: 7, label: '部门名称 - 王五' }
+      userOptions: [
+        // { value: 0, label: '全部用户' },
+        // { value: 1, label: '部门名称 - 张三' },
+        // { value: 2, label: '部门名称 - 李四' },
+        // { value: 3, label: '部门名称 - 王五' },
+        // { value: 4, label: '部门名称 - 张三' },
+        // { value: 5, label: '部门名称 - 李四' },
+        // { value: 6, label: '部门名称 - 王五' },
+        // { value: 7, label: '部门名称 - 王五' }
       ],
       devOptions: [
-        { value: 0, label: '全部设备' },
-        { value: 1, label: '设备1' },
-        { value: 2, label: '设备2' },
-        { value: 3, label: '设备3' }
+        // { value: 0, label: '全部设备' },
+        // { value: 1, label: '设备1' },
+        // { value: 2, label: '设备2' },
+        // { value: 3, label: '设备3' }
       ],
       selectOptions: [],
       oldSelect: null,
@@ -139,24 +169,136 @@ export default {
         pushObj: [
           { required: true, message: '请选择推送对象', trigger: 'blur' }
         ]
+      },
+      allUser: null,
+      allDev: null,
+      page: {
+        total: 0,
+        size: 10,
+        page: 1
       }
     }
   },
   computed: {
     sendObjOptions() {
       if (this.pushObj === '用户') {
-        return this.personOptions
+        return this.userOptions
       } else {
         return this.devOptions
       }
     }
   },
-  created() {
-    this.getData()
+  async created() {
+    await this.getUser()
+    await this.getDev()
+    this.getTableData()
   },
   methods: {
-    getData() {
-      this.tableData = data1.rows
+    getParams() {
+      const params = {
+        page: null,
+        size: null
+      }
+      params.page = this.page.page - 1
+      params.size = this.page.size
+      return params
+    },
+    getTableData() {
+      getNoticeList(this.getParams()).then(res => { // 获取列表
+        console.log(res, 'res')
+        const table = res.content
+        this.page.total = res.totalElements
+        table.forEach(item => {
+          item.pushTo = null
+          if (item.noticeDevices.length > 0) { // 推送对象为设备
+            if (item.noticeDevices.length === this.devOptions.length - 1) {
+              item.pushTo = '全部设备'
+            } else {
+              // let push
+              item.pushTo = item.noticeDevices.map(i => {
+                let dev = null
+                this.devOptions.forEach(val => {
+                  if (val.value === i.deviceInfoId) {
+                    dev = val.label
+                  }
+                })
+                return dev
+              })
+            }
+          } else if (item.noticeUsers.length > 0) { // 推送对象为用户
+            // pushArr = item.noticeDevices
+            if (item.noticeUsers.length === this.devOptions.length - 1) {
+              item.pushTo = '全部用户'
+            } else {
+              // let push
+              item.pushTo = item.noticeUsers.map(i => {
+                let user = null
+                this.userOptions.forEach(val => {
+                  if (val.value === i.userId) {
+                    user = val.label
+                  }
+                })
+                return user
+              })
+            }
+          }
+        })
+        console.log(table, 'table')
+        this.tableData = table
+      })
+    },
+    // 获取用户
+    async getUser() {
+      await getAllUser().then(res => {
+        console.log(res, '用户')
+        const arr0 = [{ value: 0, label: '全部用户' }]
+        const arr = res.map(item => {
+          const val = item.id
+          const lab = item.dept.name + '-' + item.username
+          const obj = {
+            value: val,
+            label: lab
+          }
+          return obj
+        })
+        this.userOptions = arr0.concat(arr)
+        console.log(this.userOptions, '---用户')
+      })
+    },
+    // 获取设备
+    async getDev() {
+      await getAllDev().then(res => {
+        console.log(res, '设备')
+        const arr0 = [{ value: 0, label: '全部设备' }]
+        const arr = res.map(item => {
+          const val = item.id
+          const lab = item.deviceName
+          const obj = {
+            value: val,
+            label: lab
+          }
+          return obj
+        })
+        this.devOptions = arr0.concat(arr)
+        console.log(this.devOptions, '---设备')
+      })
+    },
+    // 每页条数改变
+    sizeChangeHandler(e) {
+      this.loading = true
+      this.page.size = e
+      this.page.page = 1
+      this.getTableData(this.getParams())
+      this.loading = false
+    },
+    // 当前页改变
+    pageChangeHandler(e) {
+      this.loading = true
+      this.page.page = e
+      this.params.page = e - 1
+      this.getTableData(this.getParams())
+
+      this.loading = false
     },
     clickRowHandler(row) {
       // this.$refs.table.clearSelection()
@@ -178,6 +320,13 @@ export default {
     handleSave() {
       this.$refs.formDom.validate((valid) => {
         if (valid) {
+          // noticeCreate(params).then(res => {
+          //   if (res === SUCCESS) {
+          //     this.sendVisible = false
+          //     this.$refs.formDom.resetFields()
+          //     this.$refs.formDom.clearValidate()
+          //   }
+          // })
           this.sendVisible = false
           this.$refs.formDom.resetFields()
           this.$refs.formDom.clearValidate()