2020-2021暑期项目实训第四周——消息通知功能实现以及主要代码

本文链接：https://blog.csdn.net/qq_43502432/article/details/118996871

本文介绍了一个暑期项目实训中第四周的内容，主要实现了消息通知功能。消息分为个人和企业两种类型，个人消息包括邀请加入、邀请入会和设为管理员，企业消息涉及用户申请加入会议和退出企业。不同类型的的消息会进行相应的处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

消息分为个人消息和企业消息，普通用户和企业员工只能收到个人消息，企业创始人可以查看并处理企业消息。

在这里插入图片描述
个人消息为企业邀请加入、邀请入会、设为管理员的消息，企业消息为用户申请加入会议，用户退出企业的消息。
消息根据不同类型进行不同处理。

    <a-tabs default-active-key="1" v-if="isRouterAlive">
      <a-tab-pane key="1" v-if="role === 'founder' || role === 'admin'">
        <span slot="tab" @click="searchCompanyNotice">企业消息 </span>
        <!-- 管理员消息列表 -->
        <a-list
          item-layout="vertical"
          size="large"
          :pagination="pagination"
          :data-source="list"
        >
          <a-list-item slot="renderItem" key="item.title" slot-scope="item">
            <a-list-item-meta>
              <span slot="title"
                ><a-icon type="bell" />
                {{ item.theme }}
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '同意拒绝'"
                  @click="deal(item.id, false, item.fromType)"
                  >拒绝</a-button
                >
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '同意拒绝'"
                  @click="deal(item.id, true, item.fromType)"
                  >接受</a-button
                >
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '只读通知'"
                  @click="deal(item.id, false, item.fromType)"
                  >确认</a-button
                >
              </span>
            </a-list-item-meta>
          </a-list-item>
        </a-list>
      </a-tab-pane>
      <a-tab-pane key="2">
        <span slot="tab" @click="searchUserNotice">个人消息 </span>
        <a-list
          item-layout="vertical"
          size="large"
          :pagination="pagination"
          :data-source="listData"
        >
          <a-list-item slot="renderItem" key="item.title" slot-scope="item">
            <a-list-item-meta>
              <span slot="title"
                ><a-icon type="bell" />
                {{ item.theme }}
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '同意拒绝'"
                  @click="deal(item.id, false, item.fromType)"
                  >拒绝</a-button
                >
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '同意拒绝'"
                  @click="deal(item.id, true, item.fromType)"
                  >接受</a-button
                >
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '只读通知'"
                  @click="deal(item.id, true, item.fromType)"
                  >确认</a-button
                >
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '加入会议'"
                  @click="deal(item.id, true, item.fromType)"
                  >去开会</a-button
                >
                <a-button
                  type="link"
                  style="float: right"
                  v-if="item.isDealt != '已处理' && item.type == '加入会议'"
                  @click="deal(item.id, false, item.fromType)"
                  >忽略</a-button
                >
              </span>
            </a-list-item-meta>
          </a-list-item>
        </a-list>
      </a-tab-pane>
    </a-tabs>

created() {
    this.role = this.roles[0].id;
    this.searchUserNotice();
    this.searchCompanyNotice();
  },
  methods: {
    reload() {
      this.isRouterAlive = false;
      this.$nextTick(function () {
        this.isRouterAlive = true;
      });
    },
    ...mapMutations("account", [
      "setUserName",
      "setUserId",
      "setCompanyName",
      "setCompanyId",
      "setSex",
      "setTelephone",
      "setRoles",
    ]),
    searchUserNotice() {
      userNotice(this.userId).then(this.showListData);
    },
    showListData(res) {
      this.listData = res.data.data;
    },
    searchCompanyNotice() {
      companyNotice(this.companyId).then(this.showList);
    },
    showList(res) {
      this.list = res.data.data;
    },
    deal(id, result, type) {
      if (type == "个人") {
        dealApplication(id, result).then(this.afterDealApplication);
      } else {
        dealInvitation(id, result).then(this.afterDeal);
      }
    },

    afterDeal(res) {
      const dealRes = res.data;
      if (dealRes.code == 200) {
        this.$message.success("已处理该消息！");
        let roles = [{ id: "employee" }];
        this.setRoles(roles);
        this.$router.push({ path: "/resourceManagement/information" });
      }
    },
    afterDealApplication(res) {
      const dealRes = res.data;
      if (dealRes.code == 200) {
        this.$message.success("已处理该消息！");
        this.reload();
      }
    },