{"remainingRequest":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/node_modules/vue-loader/lib/index.js??vue-loader-options!/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/src/views/user/message.vue?vue&type=style&index=0&id=0c8d7d46&scoped=true&lang=css&","dependencies":[{"path":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/src/views/user/message.vue","mtime":1617946848000},{"path":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/usr/local/develop/php/www/waibao/NN2024071001/NN2024071001/addons/admin/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCg0KLmVsZS11c2VyLW1lc3NhZ2UgPj4+IC5lbC1tZW51IHsNCiAgZmxleC1zaHJpbms6IDA7DQp9DQoNCi5lbGUtdXNlci1tZXNzYWdlIC5lbGUtY2VsbC1jb250ZW50IHsNCiAgcGFkZGluZzogMjBweCAxNXB4Ow0KICBib3gtc2l6aW5nOiBib3JkZXItYm94Ow0KICBvdmVyZmxvdzogYXV0bzsNCn0NCg0KLmVsZS11c2VyLW1lc3NhZ2UgLmVsZS1iYWRnZS1zdGF0aWMgew0KICBtYXJnaW4tbGVmdDogMTBweDsNCn0NCg0KQG1lZGlhIHNjcmVlbiBhbmQgKG1pbi13aWR0aDogNzY4cHgpIHsNCiAgLmVsZS11c2VyLW1lc3NhZ2UgPj4+IC5lbC1tZW51LWl0ZW0gew0KICAgIG1pbi13aWR0aDogMTUwcHg7DQogICAgdGV4dC1hbGlnbjogcmlnaHQ7DQogICAgYm9yZGVyLXJpZ2h0OiAycHggc29saWQgdHJhbnNwYXJlbnQ7DQogIH0NCg0KICAuZWxlLXVzZXItbWVzc2FnZSA+Pj4gLmVsLW1lbnUtaXRlbTpmaXJzdC1jaGlsZCB7DQogICAgbWFyZ2luLXRvcDogMTVweDsNCiAgfQ0KfQ0KDQpAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiA3NjhweCkgew0KICAuZWxlLXVzZXItbWVzc2FnZSB7DQogICAgZGlzcGxheTogYmxvY2s7DQogIH0NCg0KICAuZWxlLXVzZXItbWVzc2FnZSA+Pj4gLmVsLW1lbnUtaXRlbSB7DQogICAgaGVpZ2h0OiA0NXB4Ow0KICAgIGxpbmUtaGVpZ2h0OiA0NXB4Ow0KICAgIHBhZGRpbmc6IDAgNXB4Ow0KICAgIGRpc3BsYXk6IGlubGluZS1ibG9jazsNCiAgICBmbG9hdDogbm9uZTsNCiAgfQ0KDQogIC5lbGUtdXNlci1tZXNzYWdlID4+PiAuZWwtbWVudSB7DQogICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7DQogICAgb3ZlcmZsb3c6IGF1dG87DQogIH0NCg0KICAuZWxlLXVzZXItbWVzc2FnZSAuZWxlLWJhZGdlLXN0YXRpYyB7DQogICAgbWFyZ2luLWxlZnQ6IDNweDsNCiAgfQ0KfQ0K"},{"version":3,"sources":["message.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0KA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA","file":"message.vue","sourceRoot":"src/views/user","sourcesContent":["<template>\r\n  <div class=\"ele-body\">\r\n    <el-card shadow=\"never\" body-style=\"padding:0;\">\r\n      <div class=\"ele-cell ele-cell-align-top ele-user-message\">\r\n        <el-menu :default-active=\"active\" :mode=\"mode\" @select=\"query\">\r\n          <el-menu-item index=\"0\">\r\n            <span>全部消息</span>\r\n            <el-badge v-if=\"allUnReadNum\" :value=\"allUnReadNum\" class=\"ele-badge-static\"/>\r\n          </el-menu-item>\r\n          <el-menu-item index=\"1\">\r\n            <span>系统通知</span>\r\n            <el-badge v-if=\"unReadNum1\" :value=\"unReadNum1\" class=\"ele-badge-static\"/>\r\n          </el-menu-item>\r\n          <el-menu-item index=\"2\">\r\n            <span>用户私信</span>\r\n            <el-badge v-if=\"unReadNum2\" :value=\"unReadNum2\" class=\"ele-badge-static\"/>\r\n          </el-menu-item>\r\n          <el-menu-item index=\"3\">\r\n            <span>代办事项</span>\r\n            <el-badge v-if=\"unReadNum3\" :value=\"unReadNum3\" class=\"ele-badge-static\"/>\r\n          </el-menu-item>\r\n        </el-menu>\r\n        <div class=\"ele-cell-content\">\r\n          <!-- 操作按钮 -->\r\n          <div class=\"ele-table-tool\">\r\n            <el-button size=\"small\" @click=\"read\" type=\"primary\" plain>标记已读</el-button>\r\n            <el-button size=\"small\" @click=\"readAll\" type=\"primary\" plain>全部已读</el-button>\r\n            <el-button size=\"small\" @click=\"remove()\" type=\"danger\" plain>删除消息</el-button>\r\n          </div>\r\n          <!-- 数据表格 -->\r\n          <ele-data-table ref=\"table\" :data=\"data\" :choose.sync=\"choose\" height=\"calc(100vh - 265px)\" :border=\"false\">\r\n            <template slot-scope=\"{index}\">\r\n              <el-table-column type=\"selection\" width=\"45\" align=\"center\" fixed=\"left\"/>\r\n              <el-table-column type=\"index\" :index=\"index\" width=\"45\" align=\"center\" fixed=\"left\"\r\n                               show-overflow-tooltip/>\r\n              <el-table-column prop=\"title\" label=\"标题内容\" show-overflow-tooltip min-width=\"110\"/>\r\n              <el-table-column prop=\"time\" label=\"时间\" show-overflow-tooltip width=\"140px\" align=\"center\"/>\r\n              <el-table-column label=\"状态\" width=\"80px\" align=\"center\">\r\n                <template slot-scope=\"{row}\">\r\n                  <span :class=\"['ele-text-danger','ele-text-info'][row.state]\">{{ ['未读', '已读'][row.state] }}</span>\r\n                </template>\r\n              </el-table-column>\r\n              <el-table-column label=\"操作\" width=\"140px\" align=\"center\" :resizable=\"false\" fixed=\"right\">\r\n                <template slot-scope=\"{row}\">\r\n                  <el-link @click=\"view(row)\" icon=\"el-icon-view\" type=\"primary\" :underline=\"false\">查看</el-link>\r\n                  <el-popconfirm title=\"确定要删除此消息吗？\" @onConfirm=\"remove(row)\" class=\"ele-action\">\r\n                    <el-link slot=\"reference\" icon=\"el-icon-delete\" type=\"danger\" :underline=\"false\">删除</el-link>\r\n                  </el-popconfirm>\r\n                </template>\r\n              </el-table-column>\r\n            </template>\r\n          </ele-data-table>\r\n        </div>\r\n      </div>\r\n    </el-card>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: \"UserMessage\",\r\n  data() {\r\n    return {\r\n      active: '0',  // 导航选中\r\n      data: [],  // 列表显示数据\r\n      choose: [],  // 列表选中数据\r\n      allData: [  // 全部数据\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 0},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 0},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 0},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 0},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 1},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 1},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 1},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 1},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 1},\r\n        {title: '你有两条任务待完成，不要忘了哦~', type: 3, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 0},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 0},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 0},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI给你发来了一条私信', type: 2, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 0},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 0},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1},\r\n        {title: 'Laravel8.x+Vue+ElementUI新版本发布，欢迎体验', type: 1, time: '2020-07-24 11:35', state: 1}\r\n      ]\r\n    }\r\n  },\r\n  computed: {\r\n    /* 小屏幕水平导航 */\r\n    mode() {\r\n      return this.$store.state.theme.screenWidth < 768 ? 'horizontal' : 'vertical';\r\n    },\r\n    /* 全部未读数量 */\r\n    allUnReadNum() {\r\n      return this.allData.filter(d => d.state === 0).length;\r\n    },\r\n    /* 通知未读数量 */\r\n    unReadNum1() {\r\n      return this.allData.filter(d => d.state === 0 && d.type === 1).length;\r\n    },\r\n    /* 私信未读数量 */\r\n    unReadNum2() {\r\n      return this.allData.filter(d => d.state === 0 && d.type === 2).length;\r\n    },\r\n    /* 代办未读数量 */\r\n    unReadNum3() {\r\n      return this.allData.filter(d => d.state === 0 && d.type === 3).length;\r\n    }\r\n  },\r\n  mounted() {\r\n    this.query();\r\n  },\r\n  methods: {\r\n    /* 查询数据 */\r\n    query(index) {\r\n      this.active = index || '0';\r\n      if (this.active === '0') this.data = this.allData;\r\n      else this.data = this.allData.filter(d => String(d.type) === this.active);\r\n    },\r\n    /* 查看 */\r\n    view(row) {\r\n      console.log(row);\r\n      this.$message('点击了查看');\r\n    },\r\n    /* 删除 */\r\n    remove(row) {\r\n      if (row) {  // 单个删除\r\n        this.data.splice(this.data.indexOf(row), 1);\r\n        this.$message({type: 'success', message: '删除成功'});\r\n      } else {  // 批量删除\r\n        if (this.choose.length === 0) return this.$message.error('请至少选择一条数据');\r\n        this.$confirm('确定要删除选中的消息吗?', '提示', {type: 'warning'}).then(() => {\r\n          this.choose.forEach(d => {\r\n            this.data.splice(this.data.indexOf(d), 1);\r\n          });\r\n          this.$message({type: 'success', message: '删除成功'});\r\n        }).catch(() => 0);\r\n      }\r\n    },\r\n    /* 标记已读 */\r\n    read() {\r\n      if (this.choose.length === 0) return this.$message.error('请至少选择一条数据');\r\n      this.choose.forEach(d => {\r\n        this.data[this.data.indexOf(d)].state = 1;\r\n      });\r\n    },\r\n    /* 全部标记已读 */\r\n    readAll() {\r\n      this.data.forEach(d => {\r\n        d.state = 1;\r\n      });\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.ele-user-message >>> .el-menu {\r\n  flex-shrink: 0;\r\n}\r\n\r\n.ele-user-message .ele-cell-content {\r\n  padding: 20px 15px;\r\n  box-sizing: border-box;\r\n  overflow: auto;\r\n}\r\n\r\n.ele-user-message .ele-badge-static {\r\n  margin-left: 10px;\r\n}\r\n\r\n@media screen and (min-width: 768px) {\r\n  .ele-user-message >>> .el-menu-item {\r\n    min-width: 150px;\r\n    text-align: right;\r\n    border-right: 2px solid transparent;\r\n  }\r\n\r\n  .ele-user-message >>> .el-menu-item:first-child {\r\n    margin-top: 15px;\r\n  }\r\n}\r\n\r\n@media screen and (max-width: 768px) {\r\n  .ele-user-message {\r\n    display: block;\r\n  }\r\n\r\n  .ele-user-message >>> .el-menu-item {\r\n    height: 45px;\r\n    line-height: 45px;\r\n    padding: 0 5px;\r\n    display: inline-block;\r\n    float: none;\r\n  }\r\n\r\n  .ele-user-message >>> .el-menu {\r\n    text-align: center;\r\n    white-space: nowrap;\r\n    overflow: auto;\r\n  }\r\n\r\n  .ele-user-message .ele-badge-static {\r\n    margin-left: 3px;\r\n  }\r\n}\r\n</style>"]}]}