index.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. <template>
  2. <Page title="消息">
  3. <template v-slot:body>
  4. <div v-for="item in messageList">
  5. <div class="p-[10px] bg-white my-[8px]" @click="toDetail(item)">
  6. <span :class="`${item.checked ? 'text-[#07C160]' : 'themeTextColor'}`">{{ item.msg }}</span>
  7. </div>
  8. </div>
  9. </template>
  10. <template v-slot:footer>
  11. <Footer />
  12. </template>
  13. </Page>
  14. </template>
  15. <script setup>
  16. import { ref } from "vue";
  17. import { useLifecycle } from "@hooks/useCommon.js";
  18. import { GET_MESSAGE_LIST, ONE_CLICK_READ } from "@hooks/useApi";
  19. import useShowToast from "@hooks/useToast";
  20. import useRouterStore from "@store/useRouterStore.js";
  21. import useInfoStore from "@store/useInfoStore.js";
  22. import requests from "@common/requests";
  23. import { routingInfos } from "@utility/generalVariables"
  24. const { toastLoading, toastSuccess, toastFail } = useShowToast();
  25. const router = useRouterStore()
  26. const userInfo = useInfoStore()
  27. const messageList = ref([]);
  28. function getMessageList() {
  29. requests.post(GET_MESSAGE_LIST, {}).then(({ data = [] }) => {
  30. messageList.value = data || []
  31. userInfo.updateState({
  32. numberOfMessages: data.filter((item) => !item.checked)?.length || ''
  33. })
  34. })
  35. }
  36. function toDetail(item) {
  37. requests.post(READ_MESSAGE, { id: item.id }).then(() => {
  38. getMessageList()
  39. })
  40. const jumpTo = routingInfos[item.path.replace('/', '')]
  41. router.navigateTo({
  42. pathName: 'moduleList',
  43. success: () => {
  44. router.emit('moduleListDetailParameter', {
  45. row: JSON.stringify(jumpTo)
  46. })
  47. }
  48. })
  49. }
  50. // 一键已读
  51. function oneClickRead() {
  52. requests.post(ONE_CLICK_READ, {}).then(() => {
  53. getMessageList()
  54. })
  55. }
  56. useLifecycle({
  57. load: () => {
  58. getMessageList()
  59. }
  60. });
  61. function longPress(row, item) {
  62. console.log('长按', row, item);
  63. }
  64. </script>
  65. <style lang="scss" scoped></style>