uniIM/pages/group/announcement.vue

<template>
	<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
  <cu-custom bgImage="/static/bg.png" :isBack="true">
    <template v-slot:content>
      <text class="text-black">群公告</text>
    </template>
  </cu-custom>
  <view class="padding">
    <uni-forms ref="groupForm" :model="group" :rules="rules">
      <uni-forms-item name="announcement">
        <uni-easyinput placeholder="请输入群公告" type="textarea" v-model="group.announcement" rows="5"></uni-easyinput>
      </uni-forms-item>
      <view class="cu-bar bg-white">
        <button class="cu-btn bg-zblue border lg margin-top" style="width: 100%;" @tap="update">保存</button>
      </view>
    </uni-forms>
  </view>
</template>
<script setup lang="ts">
import {reactive, ref} from "vue";
import type Group from "@/mode/Group";
import UniForms from "@/uni_modules/uni-forms/components/uni-forms/uni-forms.vue";
import UniFormsItem from "@/uni_modules/uni-forms/components/uni-forms-item/uni-forms-item.vue";
import {onLoad} from "@dcloudio/uni-app";
import GroupApi from "@/api/GroupApi";
import MessageUtils from "@/utils/MessageUtils";
import SendCode from "@/utils/SendCode";
import ChatType from "@/utils/ChatType";
import MessageType from "@/utils/MessageType";
import {useWsStore} from "@/store/WsStore";
import UniEasyinput from "@/uni_modules/uni-easyinput/components/uni-easyinput/uni-easyinput.vue";
import CuCustom from "@/colorui/components/cu-custom.vue";
import Auth from "@/api/Auth";
const fontValue=ref(Auth.getfontSize());
const rules = {
  announcement: {
    rules: [
      {
        required: true,
        errorMessage: '请输入公告',
      },
      {
        minLength: 5,
        maxLength: 100,
        errorMessage: '公告长度在 {minLength} 到 {maxLength} 个字符',
      }
    ]
  }
}
const group = reactive<Group>({} as Group)
const groupForm = ref();

onLoad((opt) => {
  if (opt?.id) {
    group.id = opt.id;
    GroupApi.get(group.id)
        .then((res) => {
          group.id = res.data.id;
          group.name = res.data.name;
          group.master = res.data.master;
          group.avatar = res.data.avatar;
          group.openInvite = res.data.openInvite;
          group.inviteCheck = res.data.inviteCheck;
          group.prohibition = res.data.prohibition;
          group.prohibitFriend = res.data.prohibitFriend;
        })
  }
})

const update = () => {
  groupForm.value.validate().then(() => {
    GroupApi.update(group.id, group.name, group.avatar, group.openInvite, group.inviteCheck,group.prohibition,group.prohibitFriend, group.announcement)
        .then(() => {
          const sendInfo = {
            code: SendCode.MESSAGE,
            message: {
              mine: true,
              fromId: group.master,
              chatId: group.id,
              type: ChatType.GROUP,
              messageType: MessageType.text,
              content: `@[所有人] 群公告：${group.announcement}`,
              timestamp: new Date().getTime(),
              extend: {
                atAll: true
              }
            }
          }
          useWsStore().send(JSON.stringify(sendInfo))
          MessageUtils.message('更新成功')
          uni.navigateTo({
            url: '/pages/group/group?id=' + group.id
          })
        })
        .catch((err) => {
          MessageUtils.error(err)
        })
  })
}
</script>
<style scoped>

</style>