<template>
  <view class="ConCss">
    <u-navbar class="navBarCss" :title="title" :titleStyle="{'fontSize':'36rpx','color':'#333333','fontWeight':'700'}"
      leftClick="leftClick" :autoBack="true" safeAreaInsetTop placeholder />
    <view class="bodyCss">
      <view class="basisCss">
        <view class="titleCss">
          基本信息
        </view>
        <!-- 居民基本信息 -->
        <view class="" v-if="type == 0">
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 区域 </view>
            <view class="rightCss overflow-one-lines"> {{allData.area}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预算主体 </view>
            <view class="rightCss overflow-one-lines"> {{allData.budgetSubject}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 身份证号 </view>
            <view class="rightCss overflow-one-lines"> {{allData.idNumber}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋所在城市 </view>
            <view class="rightCss overflow-one-lines"> {{allData.city}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋所在街道 </view>
            <view class="rightCss overflow-one-lines"> {{allData.street}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋所在小区 </view>
            <view class="rightCss overflow-one-lines"> {{allData.communityName}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋所在楼层 </view>
            <view class="rightCss overflow-one-lines"> {{allData.floor}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋门牌号 </view>
            <view class="rightCss overflow-one-lines"> {{allData.houseNumber}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房主姓名 </view>
            <view class="rightCss overflow-one-lines"> {{allData.householdName}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房主年龄 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSEHOLD_AGE, allData.householdAge) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 联系电话 </view>
            <view class="rightCss overflow-one-lines"> {{allData.phoneNumber}} </view>
          </view>
        </view>
        <!-- 商业基本信息 -->
        <view class="" v-if="type == 1">
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 区域 </view>
            <view class="rightCss overflow-one-lines"> {{allData.area}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预算主体 </view>
            <view class="rightCss overflow-one-lines"> {{allData.budgetSubject}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 纳税人识别号 </view>
            <view class="rightCss overflow-one-lines"> {{allData.taxpayerNumber}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋所在城市 </view>
            <view class="rightCss overflow-one-lines"> {{allData.city}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋所在街道 </view>
            <view class="rightCss overflow-one-lines"> {{allData.street}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在场所门牌号 </view>
            <view class="rightCss overflow-one-lines"> {{allData.houseNumber}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在场所经营者姓名 </view>
            <view class="rightCss overflow-one-lines"> {{allData.householdName}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 经营业主年龄 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSEHOLD_AGE, allData.householdAge) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 联系电话 </view>
            <view class="rightCss overflow-one-lines"> {{allData.phoneNumber}} </view>
          </view>
        </view>
        <!-- 工业基本信息 -->
        <view class="" v-if="type == 2">
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 区域 </view>
            <view class="rightCss overflow-one-lines"> {{allData.area}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预算主体 </view>
            <view class="rightCss overflow-one-lines"> {{allData.budgetSubject}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 统一社会信息代码 </view>
            <view class="rightCss overflow-one-lines"> {{allData.taxpayerNumber}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 地址 </view>
            <view class="rightCss overflow-one-lines"> {{allData.address}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 客户联系人 </view>
            <view class="rightCss overflow-one-lines"> {{allData.contactPerson}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 职务 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_INDUSTRY_DUTIES, allData.duties) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 电话 </view>
            <view class="rightCss overflow-one-lines"> {{allData.phoneNumber}} </view>
          </view>
        </view>
      </view>
      <view class="housesCss">
        <view class="titleCss" v-if="type == 0">
          房屋信息
        </view>
        <view class="titleCss" v-else-if="type == 1">
          场所信息
        </view>
        <view class="titleCss" v-else-if="type == 2">
          房屋信息
        </view>
        <view class="" v-if="type == 0">
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 居住人口 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_LIVE_NO, allData.resideNumber) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋户型 </view>
            <view class="rightCss overflow-one-lines"> {{allData.houseType}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋面积 </view>
            <view class="rightCss overflow-one-lines"> {{allData.houseArea}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋建设年限 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_BUILD_YEAR, allData.houseYear) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋居住性质 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSE_NATURE, allData.houseNature) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 居住属性 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_LIVE_ATTRIBUTE, allData.resideAttribute) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋性质 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSE_ATTRIBUTE, allData.houseAttribute) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋结构类型 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSE_STRUCTURE, allData.houseStructure) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在房屋距离中压管道 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_DISTANCE, allData.distance) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在房屋是否有物业 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isExist?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 房屋是否列入拆迁规划 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isPlan?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 水/电表是否一户一表 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isSingleMeter?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 是否独立厨房 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isSingleKitchen?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 是否集中供暖 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isHeating?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 楼前立管是否安装 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isInstall?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 现使用能源 </view>
            <view class="rightCss overflow-one-lines"> {{allData.currentEnergy?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 现使用能源价格(元) </view>
            <view class="rightCss overflow-one-lines"> {{allData.currentPrice}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 用户报装意愿 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_INSTALL_INCLINATE, allData.inclinate) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 不报装原因 </view>
            <view class="rightCss overflow-one-lines"> {{allData.reason}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 创建时间 </view>
            <!-- {{$u.timeFormat(timestamp, 'yyyy年mm月dd日')}} -->
            <view class="rightCss overflow-one-lines"> {{allData.sysCtime}} </view>
          </view>
        </view>
        <view class="" v-if="type == 1">
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 场所面积 </view>
            <view class="rightCss overflow-one-lines"> {{allData.houseArea}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 经营范围 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_BUSINESS_SCOPE, allData.businessScope) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在场所房屋性质 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSE_NATURE, allData.houseNature) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在场所房屋类型 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_COMMERCE_ATTRIBUTE, allData.houseAttribute) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在场所房屋结构类型 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_HOUSE_STRUCTURE, allData.houseStructure) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在场所房屋建设年限 </view>
            <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_BUILD_YEAR, allData.houseYear) || "" }} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在房屋是否列入拆迁规划 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isPlan?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 水/电表是否一户一表 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isSingleMeter?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 是否有供暖需求 </view>
            <view class="rightCss overflow-one-lines"> {{allData.isHeating?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所在房屋距离中压管道 </view>
            <view class="rightCss overflow-one-lines"> {{allData.distance?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 现使用能源 </view>
            <view class="rightCss overflow-one-lines"> {{allData.currentEnergy?'是':'否'}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 现使用能源价格(元) </view>
            <view class="rightCss overflow-one-lines"> {{allData.currentPrice}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预计最大开口气量（最大日用气量） </view>
            <view class="rightCss overflow-one-lines"> {{allData.predictMax}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预计签约日期 </view>
            <view class="rightCss overflow-one-lines"> {{allData.predictSign}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预计安装日期 </view>
            <view class="rightCss overflow-one-lines"> {{allData.predictInstall}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预计日用气量 </view>
            <view class="rightCss overflow-one-lines"> {{allData.predictUse}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 更新时间 </view>
            <!-- {{$u.timeFormat(timestamp, 'yyyy年mm月dd日')}} -->
            <view class="rightCss overflow-one-lines"> {{allData.sysCtime}} </view>
          </view>
        </view>
        <view class="" v-if="type == 2">
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 是否已供气 </view>
              <view class="rightCss overflow-one-lines"> {{allData.isProvide?'是':'否'}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 商业状态 </view>
              <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_COMMERCIAL_STATUS, allData.commercialStatus) || "" }} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 项目类别 </view>
              <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_PROJECT_TYPE, allData.projectType) || "" }} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 行业分类 </view>
              <view class="rightCss overflow-one-lines"> {{allData.industryType}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 最近管道距离 </view>
              <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_DISTANCE, allData.distance) || "" }} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 预计最大开口气量 </view>
              <view class="rightCss overflow-one-lines"> {{allData.predictMax}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 预计签约日期 </view>
              <view class="rightCss overflow-one-lines"> {{ $dayjs().UTC(allData.predictSign).format('YYYY') || ""}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 预计安装日期 </view>
              <!-- <view class="rightCss overflow-one-lines"> {{ $dayjs(allData.predictInstall).format('yyyy') || ""}} </view> -->
              <view class="rightCss overflow-one-lines"> {{ allData.predictInstall || ""}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 预计日用气量 </view>
              <view class="rightCss overflow-one-lines"> {{allData.predictUse}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 耗能设备名称 </view>
              <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_MACHINE_NAME, allData.machineName) || "" }} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 耗能设备型号 </view>
              <view class="rightCss overflow-one-lines"> {{allData.machineModel}} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 用能类型 </view>
              <view class="rightCss overflow-one-lines"> {{ getDictDataLabel(DICT_TYPE.SYS_INDUSTRY_TYPE, allData.userType) || "" }} </view>
            </view>
            <view class="flexCss">
              <view class="leftCss overflow-one-lines"> 更新时间 </view>
              <view class="rightCss overflow-one-lines"> {{allData.sysCtime}} </view>
            </view>
        </view>

      </view>
    </view>

  </view>
</template>

<script>
  export default {
    components: {},
    props: {

    },
    data() {
      return {
        type: null,
        allData: {},
        title: "",
      }
    },
    computed: {

    },
    onLoad(data) {
      if (data) {
        this.type = data.type;
        this.allData = JSON.parse(data.details);
      }
      this.initData()
      console.log(this.allData);
    },
    methods: {
      initData() {
        const titleArr = ['居民用户详情', '商业用户详情', '工业用户详情']
        this.title = titleArr[this.type]
      }
    }
  }
</script>

<style lang="scss" scoped>
  .bodyCss {
    padding: 20rpx 0;
    background: #f2f4f3;
  }

  .titleCss {
    background-color: rgba(255, 255, 255, 0);
    box-sizing: border-box;
    font-family: '苹方 中等', '苹方', sans-serif;
    color: #333333;
    text-align: left;
    line-height: normal;
    font-size: 30rpx;
  }

  .basisCss {
    margin: 0 24rpx 20rpx 24rpx;
    padding: 40rpx 30rpx;
    border-radius: 20rpx;
    background-color: #ffffff;
    box-sizing: border-box;
  }

  .flexCss {
    display: flex;
    justify-content: space-between;
  }

  .leftCss {
    width: 50%;
    margin: 32rpx 0rpx;
    background-color: rgba(255, 255, 255, 0);
    box-sizing: border-box;
    font-family: '苹方 中等', '苹方', sans-serif;
    color: #999db0;
    text-align: left;
    line-height: normal;
    font-size: 26rpx;
  }

  .rightCss {
    display: flex;
    justify-content: flex-end;
    width: 50%;
    margin: 32rpx 0rpx;
    background-color: rgba(255, 255, 255, 0);
    box-sizing: border-box;
    font-family: '苹方 中等', '苹方', sans-serif;
    color: #2b3950;
    text-align: right;
    line-height: normal;
    font-size: 26rpx;
  }

  .housesCss {
    margin: 20rpx 24rpx;
    padding: 40rpx 30rpx;
    border-radius: 20rpx;
    background-color: #ffffff;
    box-sizing: border-box;
  }
</style>
