<template>
  <view class="chuZu" :class="{'chuZu--elder':$uiStyle==='elder'}">
    <image class="image" src="/subPages/static/images/rent/publish.png" mode="scaleToFill"/>
    <view class="content">
      <view class="cell" @click="publishHouse">
        <image class="left-icon" mode="aspectFit" src="/static/images/common/icon_home.png" />
        <view class="text">发布房屋</view>
        <image class="right-icon" mode="aspectFit" src="/static/images/common/forward.png" />
      </view>
      <view class="cell" @click="publishRecord">
        <image class="left-icon" mode="aspectFit" src="/subPages/static/images/common/history-selected@2x.png" />
        <view class="text">已发布房屋</view>
        <image class="right-icon" mode="aspectFit" src="/static/images/common/forward.png" />
      </view>
    </view>
  </view>
</template>

<script>
import { FWZL_DIC } from '@/utils/const';
import { getDicByNameList } from '@/api/system';
const app = getApp();

export default {
  name: "chuZu",
  components: {},
  props: {},
  data() {
    return {
    }
  },
  onLoad() {
    this.getDicByNameList();
  },
  methods: {
    // 查询字典
    getDicByNameList () {
      getDicByNameList({ dicName: Object.values(FWZL_DIC).join(',') }).then(res => {
        app.globalData.fwzlDicList = res.data;
      })
    },
    // 发布房屋
    publishHouse () {
      uni.navigateTo({
        url: '/subPages/pages/rent/chuZu/publishHouse'
      });
    },
    // 查询房屋列表
    publishRecord () {
      uni.navigateTo({
        url: '/subPages/pages/rent/chuZu/publishRecord'
      });
    }
  },
} 
</script>

<style lang="scss" scoped>
.chuZu {
  .image {
    width: 100%;
    height: 30vh;
  }
  .content {
    .cell {
      height: 50px;
      background-color: #fff;
      padding: 0 10px;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      .left-icon {
        width: 23px;
        height: 23px;
        margin-right: 8px;
      }
      .text {
        width: calc(100% - 60px);
        font-size: 16px;
        color: #333333;
      }
      .right-icon {
        width: 20px;
        height: 20px;
      }
    }
  }
}

.chuZu--elder {
  .content {
    .cell {
      padding: 5px 10px;
      .left-icon {
        width: calc(20px * $zlb-elder-font-scale);
        height: calc(20px * $zlb-elder-font-scale);
        margin-right: 8px;
      }
      .text {
        font-size: calc(15px * $zlb-elder-font-scale);
      }
      .right-icon {
        width: calc(15px * $zlb-elder-font-scale);
        height: calc(15px * $zlb-elder-font-scale);
      }
    }
  }
}
</style>