<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.areaName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预算主体 </view>
            <view class="rightCss overflow-one-lines"> {{allData.entityName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 管理组织 </view>
            <view class="rightCss overflow-one-lines"> {{allData.accountingName || ""}} </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.administrativeVillage || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 自然村/小区 </view>
            <view class="rightCss overflow-one-lines"> {{allData.natureVillage || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 状态 </view>
            <view class="rightCss overflow-one-lines"> {{allData.statusName || ""}} </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.areaName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预算主体 </view>
            <view class="rightCss overflow-one-lines"> {{allData.entityName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 管理组织 </view>
            <view class="rightCss overflow-one-lines"> {{allData.accountingName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 客户名称 </view>
            <view class="rightCss overflow-one-lines"> {{allData.clientName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 状态 </view>
            <view class="rightCss overflow-one-lines">
              {{ getDictDataLabel(DICT_TYPE.SYS_POOL_INDUSTRY_AND_COMMERCE_STATUS, allData.status) || "" }}
            </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.areaName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预算主体 </view>
            <view class="rightCss overflow-one-lines"> {{allData.entityName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 管理组织 </view>
            <view class="rightCss overflow-one-lines"> {{allData.accountingName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 客户编号（来源于CRM系统） </view>
            <view class="rightCss overflow-one-lines"> {{allData.custNo || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 客户名称 </view>
            <view class="rightCss overflow-one-lines"> {{allData.custName || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 行业分类 </view>
            <view class="rightCss overflow-one-lines"> {{allData.industry || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 用户状态 </view>
            <view class="rightCss overflow-one-lines">
              {{ getDictDataLabel(DICT_TYPE.SYS_CUSTOMER_RECOVERY_PROGRESS_STATUS, allData.status) || "" }}
            </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_HOUSE_TYPE, allData.houseType) || "" }}
            </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines">市场类型 </view>
            <view class="rightCss overflow-one-lines">
              {{getDictDataLabel(DICT_TYPE.SYS_MARKET_TYPE, allData.marketType) || ""}}
            </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 业务类型 </view>
            <view class="rightCss overflow-one-lines">
              {{getDictDataLabel(DICT_TYPE.SYS_BUSINESS_TYPE, allData.businessType) || ""}}
            </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 签约方类型 </view>
            <view class="rightCss overflow-one-lines">
              {{ getDictDataLabel(DICT_TYPE.SYS_SIGN_TYPE, allData.signType) || "" }}
            </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 经营区域 </view>
            <view class="rightCss overflow-one-lines">
              {{ getDictDataLabel(DICT_TYPE.SYS_BUSINESS_AREA, allData.businessArea) || "" }}
            </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 合同户数 </view>
            <view class="rightCss overflow-one-lines"> {{ allData.signHousehold || 0 }} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 财务确认户数 </view>
            <view class="rightCss overflow-one-lines"> {{ allData.financeConfirm || 0 }} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 覆盖户数 </view>
            <view class="rightCss overflow-one-lines"> {{ allData.coveredHousehold || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 总户数 </view>
            <view class="rightCss overflow-one-lines"> {{ allData.totalHousehold || 0 }} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 回款状态/全款(户) </view>
            <view class="rightCss overflow-one-lines"> {{allData.fullAmount || 0}} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 回款状态/分期(户) </view>
            <view class="rightCss overflow-one-lines"> {{allData.byStages || 0}} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 回款状态/未回款(户) </view>
            <view class="rightCss overflow-one-lines"> {{allData.unpaid || 0}} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 实际进场（户） </view>
            <view class="rightCss overflow-one-lines"> {{allData.actual || 0}} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 不具备安装条件户数（户） </view>
            <view class="rightCss overflow-one-lines"> {{allData.noInstallCondition || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 具备双覆盖安装条件（户） </view>
            <view class="rightCss overflow-one-lines"> {{allData.installCondition || 0}} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 通气到表前户数 </view>
            <view class="rightCss overflow-one-lines"> {{allData.ventilation || 0}} </view>
          </view>
          <view class="flexCss" v-if="allData.statusName !== '完全未开发'">
            <view class="leftCss overflow-one-lines"> 实际点火户数 </view>
            <view class="rightCss overflow-one-lines"> {{allData.actualFire || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss"> 已纳入老旧管网改造户数（户） </view>
            <view class="rightCss"> {{allData.intoRemodel || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss "> 距现有中压管网距离（公里） </view>
            <view class="rightCss overflow-one-lines"> {{allData.distance || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> {{$dayjs().format('YYYY') + '年财务确认安装户数'}} </view>
            <view class="rightCss overflow-one-lines"> {{ allData.currentConfirm || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> {{$dayjs().add(1, 'year').format('YYYY') + '年财务确认安装户数'}} </view>
            <view class="rightCss overflow-one-lines"> {{ allData.afterConfirm || 0}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> {{$dayjs().add(2, 'year').format('YYYY') + '年财务确认安装户数'}} </view>
            <view class="rightCss overflow-one-lines"> {{ allData.lastConfirm || 0}} </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.taxpayerNumber || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 客户地址 </view>
            <view class="rightCss overflow-one-lines"> {{allData.clientAddress || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 客户性质 </view>
            <view class="rightCss overflow-one-lines">
              {{ getDictDataLabel(DICT_TYPE.SYS_CLIENT_QUALITY, allData.clientQuality) || "" }}
            </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 所属行业 </view>
            <view class="rightCss overflow-one-lines"> {{allData.industry || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预测日用气量（方/日） </view>
            <view class="rightCss overflow-one-lines"> {{allData.predictDay || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预测年用气量（方/年） </view>
            <view class="rightCss overflow-one-lines"> {{allData.predictYear || ""}} </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">
              {{ 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"> 预计最大开口气量（最大日用气量） </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">
              {{$u.timeFormat(allData.predictSign, 'yyyy年mm月dd日 hh:MM:ss') || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 预计安装日期 </view>
            <view class="rightCss overflow-one-lines">
              {{$u.timeFormat(allData.predictInstall, 'yyyy年mm月dd日 hh:MM:ss') || ""}} </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"> {{$u.timeFormat(allData.sysCtime, 'yyyy年mm月dd日 hh:MM:ss') || ""}}
            </view>
          </view> -->
        </view>
        <view class="" v-if="type == 2">
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 年度用气量（万m³） </view>
            <view class="rightCss overflow-one-lines"> {{allData.yearConsumption || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 流失时间 </view>
            <view class="rightCss overflow-one-lines"> {{$u.timeFormat(allData.lossTime, 'yyyy年mm月dd日') || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 流失原因 </view>
            <view class="rightCss overflow-one-lines"> {{allData.lossReason || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 计划追回时间 </view>
            <view class="rightCss overflow-one-lines"> {{$u.timeFormat(allData.recoverTime, 'yyyy年mm月dd日') || ""}}
            </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 工作计划 </view>
            <view class="rightCss overflow-one-lines"> {{allData.workPlan || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 完成情况更新 </view>
            <view class="rightCss overflow-one-lines"> {{allData.completion || ""}} </view>
          </view>
          <view class="flexCss">
            <view class="leftCss overflow-one-lines"> 备注 </view>
            <view class="rightCss overflow-one-lines"> {{allData.remark || ""}} </view>
          </view>
        </view>
      </view>
    </view>

  </view>
</template>


<script>
  import {
    getPoolResidentDetail,
    getPoolCommerceDetail,
    getPoolCustomerRecovery,
  } from '@/api/organize.js'
  export default {
    components: {},
    props: {

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

    },
    onLoad(data) {
      if (data) {
        this.type = data.type;
        this.id = data.id;
      }
      this.initData()
      console.log(this.type, this.id);
    },
    methods: {
      initData() {
        const titleArr = ['居民用户详情', '工商业用户详情', '流失大客户详情']
        this.title = titleArr[this.type]
        if (this.type === '0') {
          getPoolResidentDetail(this.id).then((res) => {
            this.allData = res.data;
          })
        } else if (this.type === '1') {
          getPoolCommerceDetail(this.id).then((res) => {
            this.allData = res.data;
          })
        } else if (this.type === '2') {
          getPoolCustomerRecovery(this.id).then((res) => {
            this.allData = res.data;
          })
        }
      },

    }
  }
</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: 58%;
    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: 42%;
    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>
