uniIM/pages/pub/user.vue

<template>
	<page-meta :page-font-size="fontValue+'px'" :root-font-size="fontValue+'px'"></page-meta>
  <view v-if="user">
    <cu-custom bgImage="/static/bg.png" :isBack="true">
      <template v-slot:content>
		  <text class="text-black">用户信息</text>
      </template>
    </cu-custom>
    <view class="bg-white flex align-center justify-center bg-img-mine margin-bottom-sm" v-if="user">
      <view class="padding-xl text-white">
        <view class="padding text-center">
          <vim-avatar :img="user.avatar" :name="user.name" />
        </view>
      </view>
    </view>
    <view class="cu-list menu menu-margin">
      <view class="cu-item">
        <navigator class="content" hover-class="none" url="/pages/mine/orderList" navigateTo>
          <text class="cuIcon-people text-pink"></text>
          <text class="text-black">名字</text>
        </navigator>
        <view class="action">
          <text class="text-black">
            {{ user.name }}
          </text>
        </view>
      </view>
      <view class="cu-item">
        <view class="content">
          <text class="cuIcon-mobile text-pink"></text>
          <text class="text-black">手机</text>
        </view>
        <view class="action">
          <text class="text-black">
            {{ user.mobile }}
          </text>
        </view>
      </view>
      <view class="cu-item">
        <view class="content">
          <text class="cuIcon-mail text-pink"></text>
          <text class="text-black">邮箱</text>
        </view>
        <view class="action">
          <text class="text-black">
            {{ user.email }}
          </text>
        </view>
      </view>
      <!-- <view class="cu-item">
        <view class="content">
          <text class="cuIcon-community text-cyan"></text>
          <text class="text-grey">部门</text>
        </view>
        <view class="action">
          <text class="text-grey" v-for="(item) in dept" :key="item.id">{{ item.name }},</text>
        </view>
      </view> -->
      <view v-if="isFriend" class="cu-item" hover-class="none" @tap="history()">
        <view class="content">
          <text class="cuIcon-text text-cyan"></text>
          <text class="text-black">聊天记录</text>
        </view>
        <view class="action">
          <text class="text-black cuIcon-right"/>
        </view>
      </view>
    </view>
    <chat-setting :chat-id='user.id' ></chat-setting>
    <view class="padding flex flex-direction">
      <view v-if="isFriend || userSetting.canSendMessage" class="cu-btn bg-zblue radius margin-tb-sm lg" @tap="send()"
            hover-class="none">发消息
      </view>
      <view class="cu-btn bg-cyan margin-tb-sm lg" v-if="!isFriend && userSetting.canAddFriend"
            @tap="addFriendHandle()">
        加为好友
      </view>
    </view>

    <view class="cu-modal" :class="show?'show':''">
      <view class="cu-dialog">
        <view class="cu-bar bg-white justify-end">
          <view class="content">添加好友</view>
          <view class="action" @tap="show = false">
            <text class="cuIcon-close text-red"></text>
          </view>
        </view>

        <view class="padding-xl bg-gray" v-if="userSetting.addFriendValidate">
          <textarea v-model="message" rows="5" class="border" placeholder="请输入验证消息"></textarea>
        </view>
        <view class="cu-bar bg-white">
          <view class="action margin-0 flex-sub text-green solid-left" @tap="show = false">取消</view>
          <view class="action margin-0 flex-sub  solid-left" @tap="addFriend">确定</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import CuCustom from '@/colorui/components/cu-custom.vue'
import UserApi from '@/api/UserApi';
import DeptApi from '@/api/DeptApi';
import FriendApi from '@/api/FriendApi';
import {onLoad} from '@dcloudio/uni-app';
import type User from '@/mode/User';
import type Dept from '@/mode/Dept';
import {reactive, ref, toRefs} from "vue";
import {useChatStore} from "@/store/chatStore";
import ChatType from '@/utils/ChatType';
import MessageUtils from '@/utils/MessageUtils';
import {useUserStore} from "@/store/userStore";
import SettingApi from "@/api/SettingApi";
import ChatSetting from '@/components/ChatSetting.vue'
import VimAvatar from "@/components/VimAvatar.vue";
import Auth from "@/api/Auth";
const fontValue=ref(Auth.getfontSize());


const chatStore = useChatStore();
const isFriend = ref(true);
//添加好友验证消息展示
const show = ref(false);
//添加好友验证消息
const message = ref("");

interface IData {
  user: User | null;
  dept: Array<Dept>;
}

const data = reactive<IData>({
  user: null,
  dept: new Array<Dept>(),
});

const userSetting = reactive({
  canAddFriend: false,
  addFriendValidate: false,
  canSendMessage: false,
  canSoundRemind: false,
  canVoiceRemind: false,
});
//当前用户
const YES = "1";
const currentUser = useUserStore().getUser();
onLoad((opt) => {
  const userId = opt?.id;
  UserApi.getUser(userId)
      .then((res) => {
        data.user = res.data;
        return DeptApi.parent(res.data.deptId);
      })
      .then((res) => {
        res.data.forEach((item: Dept) => {
          data.dept.push(item);
        });
        return FriendApi.isFriend(userId)
      })
      .then((res) => {
        isFriend.value = (userId === currentUser?.id || res.data)
        return SettingApi.get(userId);
      })
      .then((res) => {
        const setting_ = res.data;
        userSetting.canAddFriend = setting_.canAddFriend === YES;
        userSetting.addFriendValidate = setting_.addFriendValidate === YES;
        userSetting.canSendMessage = setting_.canSendMessage === YES;
        userSetting.canSoundRemind = setting_.canSoundRemind === YES;
        userSetting.canVoiceRemind = setting_.canVoiceRemind === YES;
      })
      .catch((err) => {
        MessageUtils.error(err)
      })
})

/**
 * 到聊天页面
 */
const send = () => {
  if (data.user) {
    chatStore.openChat({
      id: data.user.id,
      name: data.user.name,
      avatar: data.user.avatar,
      type: ChatType.FRIEND,
      lastMessage: "",
      unreadCount: 0,
      isLoading: false,
      loaded: true,
    });
	console.log('/chat/chat',useUserStore().getUser())
    uni.navigateTo({
      url: '/pages/chat/chat?id=' + data.user.id + '&type=' + ChatType.FRIEND
    })
  }
};
const addFriendHandle = () => {
  show.value = true;
}
const addFriend = () => {
  if (data.user) {
    FriendApi.add({friendId: data.user.id, message: message.value})
        .then((res) => {
          if (res.msg === "添加成功") {
            isFriend.value = true;
          }
          MessageUtils.message(res.msg);
        })
        .catch(() => {
          MessageUtils.message("添加失败");
        })
        .finally(() => {
          show.value = false;
        })
  }
}

const history = () => {
  if (data.user) {
	  console.log('history');
    uni.navigateTo({
      url: '/pages/chat/history?chatId=' + data.user.id + '&type=' + ChatType.FRIEND
    })
  }
};

const {user, dept} = toRefs(data);
</script>

<style>

</style>