yijianbao_user_uniapp/pages_im/pages/contact/index/index.vue

<template>
  <view class="contact_container">
    <custom-nav-bar>
		  <view @click="routeBack" class="contact_title" slot="left">
			 <image class="back_icon" src="https://bjyjb-1362704775.cos.ap-chongqing.myqcloud.com/shop/image/common_left_arrow.png" style="width: 12px; height: 20px" alt="" srcset="" />
		  </view>
		  <view class="contact_action" slot="more">
			<view class="search_icon" @click="toSearch">
			  <image src="https://bjyjb-1362704775.cos.ap-chongqing.myqcloud.com/shop/image/common_search.png" alt="" srcset="" />
			</view>
			<!-- <view @click="contactAddClick" class="search_icon">
			  <image src="https://bjyjb-1362704775.cos.ap-chongqing.myqcloud.com/shop/image/common_add.png" alt="" srcset="" />
			</view> -->
		  </view>
    </custom-nav-bar>

    <contact-menus />

    <orgnization-row v-if="storeSelfInfo.members.length" ref="orgnizationRef" />
	
  </view>
</template>

<script>
import { mapGetters } from "vuex";
import CustomNavBar from "../../../components/CustomNavBar/index.vue";
import ContactMenus from "./components/ContactMenus.vue";
import OrgnizationRow from "./components/OrgnizationRow.vue";
import UserItem from "../../../components/UserItem/index.vue";

export default {
  components: {
    CustomNavBar,
    ContactMenus,
    OrgnizationRow,
    UserItem
  },
  data() {
    return {
      frequentContacts: [],
    };
  },
  onShow() {
    this.getFrequentContacts();
    this.$nextTick(() => this.$refs.orgnizationRef.getOrganizationData());
  },
  computed: {
    ...mapGetters(["storeSelfInfo"]),
  },
  methods: {
    contactAddClick() {
      uni.navigateTo({
        url: "/pages_im/pages/contact/contactAdd/index",
      });
    },
	routeBack(){
		uni.switchTab({
			url: '/pages_im/pages/conversation/conversationList/index'
		});
	},
    getFrequentContacts() {
      const tmpData =
        uni.getStorageSync(
          `${this.$store.getters.storeCurrentUserID}_frequentContacts`,
        ) || [];
      console.log(tmpData);
      this.frequentContacts = [...tmpData].sort((a, b) => b - a);
    },
    userClick(item) {
      uni.navigateTo({
        url: `/pages_im/pages/common/userCard/index?sourceID=${item.userID}`,
      });
    },
    toSearch() {
      uni.$u.route("/pages_im/pages/common/globalSearch/index");
    },
  },
};
</script>

<style lang="scss" scoped>
.contact_container {
  @include colBox(false);
  height: 100vh;
  background-color: #f6f6f6;
  .contact_title {
    padding-left: 0rpx;
    font-size: 40rpx;
    font-weight: 600;
    color: #0c1c33;
  }
  
  .back_icon {
  	padding: 24rpx;
  	margin-left: 20rpx;
  }

  .contact_action {
    padding-right: 36rpx;
    display: flex;
    .search_icon {
      margin: 0 16rpx;
      image {
        width: 56rpx;
        height: 56rpx;
      }
    }
  }
  
  

  .list_title {
    font-size: 24rpx;
    color: #999;
    margin-left: 44rpx;
  }

  .user_list {
    flex: 1;
    margin-top: 24rpx;
    background-color: #fff;
  }
}
</style>