<template>
  <aside class="layout-talking-item center cursor-pointer" @click="openDetail(item)"
         :class="{
            'layout-talking-clear-right': (index+1) % nth === 0,
            ['layout-talking-'+type]:true
         }"
  >
    <div class="layout-talking-width row">
      <div v-if="item.category_name" class="layout-talking-button center line-1">{{item.category_name}}</div>
    </div>
    <v-image class="layout-talking-avatar" backgroundColor="transparent" :src="item.room_cover" radius="50%"></v-image>
    <div class="layout-talking-title line-1">{{item.room_name}}</div>
    <div class="rowACenter layout-talking-message">
      <img src="@/assets/images/icon.gif" class="layout-talking-icon" />
      <div class="layout-talking-number">{{item.visitor_num || 0}}</div>
      <div>人正在语聊中</div>
    </div>
  </aside>
</template>

<script>
import {
  vImage
} from '$components';
import props from '../props';
import personalDetail,{OpenType} from '$utils/control/personal-detail';
export default {
  name: "layout-talking",
  components: {
    vImage
  },
  methods:{

    openDetail(item){
      if (item.rid) {
        return personalDetail.openDetail(item,OpenType.room);
      }

    }

  },
  props
}
</script>

<style scoped lang="scss" src="../style.scss"></style>