<template>
  <view class="publish-record" :class="{'publish-record--elder':$uiStyle==='elder'}">
    <view class="records">
      <view class="list" v-for="item in houseList" :key="item.uuid" @tap="checkHouseDetail(item.uuid)">
        <image class="image" mode="aspectFill" :src="item.picHomeUrl"/>
        <view class="info">
          <view class="desc1">{{item.type}}|{{item.mc}}</view>
          <view class="desc2">{{item.shiNum}}室{{item.tingNum}}厅{{item.weiNum}}卫.{{item.areaSquare}}平.{{item.orientation}}.{{item.mc}}</view>
          <view class="desc3">
            <uni-tag :text="fwzlCostDic[item.costType]" size="small" :inverted="true"/>
            <uni-tag v-if="item.decoration" :text="item.decoration" size="small" :inverted="true"/>
            <uni-tag v-if="item.lookPeriod" :text="item.lookPeriod" size="small" :inverted="true"/>
            <uni-tag v-for="(item,index) in item.lightSpotList" :key="index" :text="item" size="small" :inverted="true"/>
            <uni-tag v-for="(item,index) in item.requirementList" :key="index" :text="item" size="small" :inverted="true"/>
          </view>
          <view class="desc4">{{item.costMonthly}} 元/月</view>
        </view>
      </view>
    </view>
    <view class="page" v-if="total > pageSize">
      <uni-pagination :total="total" :current="pageIndex" :pageSize="pageSize" @change="handelPageChanged"/>
    </view>
  </view>
</template>

<script>
import { downloadFile } from '@/api/system';
import { getPushRecordList } from '@/api/rent';
import { httpApi } from '@/common/js/baseUrl'; 
const app = getApp();

export default {
  name: "publishRecord",
  components: {},
  props: {},
  data() {
    return {
      userInfo: {},
      houseList: [],
      fwzlCostDic: {},
      pageIndex: 1,
      pageSize: 10,
      total: 0,
    }
  },
  onLoad() {
    this.userInfo = uni.getStorageSync('userInfo') || {};
    const globalData = app.globalData;
    this.fwzlDicList = globalData.fwzlDicList;
    this.parserDicData();
    this.getPushRecordList();
  },
  
  methods: {
    // 解析相关字典数据
    parserDicData () {
      this.fwzlDicList.fwzlCostType.forEach(item =>{
        this.fwzlCostDic[item.code] = item.name;
      })
    },
    // 获取发布的房屋列表
    getPushRecordList () {
      const data = {
        userInfoId: this.userInfo.uuid,
        createUserId: this.userInfo.uuid,
        current: this.pageIndex,
        size: this.pageSize,
      }
      getPushRecordList(data).then(res =>{
        this.total = res.total;
        this.houseList = res.data;
        this.getImageUrl();
      })
    },
    // 获取图片链接
		getImageUrl() {
      this.houseList.forEach((item, index) => {
        item.lightSpotList = item.lightspot.split(',');
        item.requirementList = item.requirement.split(',');
        if (item.picHome) {
          if (item.picHome.startsWith("https")) {
            item.picHomeUrl = item.picHome;
            this.$set(this.houseList[index], item);
          } else {
            item.picHomeUrl = `${httpApi}/file/download?fileUuid=${item.picHome}`
            this.$set(this.houseList[index], item);
          }
        } else {
          item.picHomeUrl = "https://img1.baidu.com/it/u=2775822367,355751974&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1661533200&t=1a670011c7c4c59444955487c4b46704";
          this.$set(this.houseList[index], item);
        }
      });
		},

    // 查看房屋详情
    checkHouseDetail (val) {
      uni.navigateTo({
        url: `/subPages/pages/rent/houseDetail?uuid=${val}`
      });
    },

    /* 修改页码 */
    handelPageChanged(event) {
      this.pageIndex = event.current;
      this.getPushRecordList();
    },

  },
} 
</script>

<style lang="scss" scoped>
.publish-record {
  height: calc(100% - 40px);
  background-color: #fff;
  position: relative;
  overflow: auto;
  .records {
    height: calc(100% - 50px);
    .list {
      display: flex;
      padding: 7px 10px;
      background-color: #fff;
      .image {
        width: 35%;
        height: 90px;
        border-radius: 5px;
      }
      .info {
        width: 65%;
        padding-left: 10px;
        .desc1 {
          margin-bottom: 3px;
          font-size: 14px;
          font-weight: 500;
          color: #333333;
        }
        .desc2 {
          margin-bottom: 2px;
          font-size: 12px;
          font-weight: 200;
          color: #666666;
        }
        .desc3 {
          height: 32px;
          width: 100%;
          overflow: hidden;
          display: flex;
          flex-wrap: wrap;
        }
        .desc4 {
          font-size: 16px;
          color: #f85858;
          margin-bottom: 3px;
        }
      }
    }
  }
  .page {
    position: fixed;
    left: 20px;
    right: 20px;
    bottom: 10px;
  }
}

.publish-record--elder {
  .records {
    .list {
      .info {
        .desc1 {
          font-size: calc(12px * $zlb-elder-font-scale);
        }
        .desc2 {
          font-size: calc(11px * $zlb-elder-font-scale);
        }
        .desc4 {
          font-size: calc(14px * $zlb-elder-font-scale);
        }
      }
    }
  }
}
</style>

<style>
.uni-tag {
  line-height: 20px !important;
  margin-bottom: 10px;
  margin-right: 5px !important;
  border-color: #e6e2e2 !important;
  color: #3a78f5 !important;
}
</style>