<style lang="less">
.component-user-space-list {
  padding: 48rpx 58rpx 0;
}

.title {
  font-family: PingFang SC;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  line-height: 32rpx;
  color: rgba(9, 9, 61, 0.45);
}

.list {
  font-family: PingFang SC;
  font-style: normal;
  font-weight: normal;
}

.list .item {
  width: 100%;
  height: 112rpx;
  line-height: 112rpx;
  font-size: 14px;
  border-bottom: 1px solid rgba(2, 2, 82, 0.03);
}

.list .item .icon {
  width: 48rpx;
  height: 48rpx;
  vertical-align: middle;
}

.list .item .value {
  margin-left: 24rpx;
  color: rgba(13, 13, 61, 0.86);
}

.list .item .dot {
  margin-left: 16rpx;
  width: 2px;
  height: 2px;
  vertical-align: middle;
}

.list .item .space-name {
  margin-left: 16rpx;
  color: rgba(6, 6, 61, 0.3);
}
</style>

<template>
  <view class="component-user-space-list">
    <view class="title">
      <label>{{title}}</label>
    </view>
    <view class="list">
      <view class="item" v-for="(item, index) in list" v-on:click="toMapPage(item)" >
        <block wx:if="{{item.key == 'userName'}}">
          <image class="icon" src="{{h5StaticPath +'icon_user.svg'}}" />
          <label class="value">{{item.value}}</label>
          <image class="dot" src="{{h5StaticPath +'dot.svg'}}" />
          <label class="space-name">{{item.spaceName}}</label>
        </block>
        <block wx:if="{{item.key == 'title'}}">
          <image
            class="icon"
            src="{{item.roomFuncType==320?(h5StaticPath+'icon_meetingroom.svg'):(h5StaticPath+'icon_location.svg')}}"
          />
          <label class="value">{{item.value}}</label>
        </block>
      </view>
    </view>
  </view>
</template>

<script>
import wepy from '@wepy/core';
import config from '@/config';

let h5StaticPath = config.h5StaticPath + '/page-intelligent-control/';
wepy.component({
  data: {
    h5StaticPath
  },
  props: {
    title: String,
    list: Array,
    onClickItem: Function,
  },
  created() {},
  didUpdate() {},
  didUnmount() {},
  methods: {
    toMapPage(space) {
      this.$emit('component-user-space-list-click', space);
    }
  }
});
</script>