<template>
  <div>
    <div class="utable" v-if="props.uitem.regular != undefined || props.uitem.escalation != undefined">
      <div class="utabletitle" v-if="props.uitem.regular.second != null">{{ props.uitem.regular.second.areaName
      }}二手房成交情况表
      </div>
      <div class="utabletitle" v-else>{{ props.uitem.escalation.second.areaName }}二手房成交情况表</div>
      <div class="utabletop">
        <div>单位名称：{{ props.uitem.regular.second != null ? props.uitem.regular.second.areaName :
          props.uitem.escalation.second.areaName
        }}
        </div>
        <div>{{ props.uitem.regular.second != null ? props.uitem.regular.second.date : props.uitem.escalation.second.date
        }}</div>
      </div>
      <el-card shadow="hover" class="layout-padding-auto mb10">
        <div class="ctitle">
          <div class="title">手动上传</div>
        </div>
        <div v-if="state.handitem != null">
          <handTemple :udata="state.handitem"></handTemple>
        </div>
        <div v-else class="errornone">
          <el-empty description="暂无手动上传数据"></el-empty>
        </div>
      </el-card>
      <el-card shadow="hover" class="layout-padding-auto mb10">
        <div class="ctitle">
          <div class="title">自动上传</div>
        </div>
        <div v-if="state.autoitem != null">
          <autoTemple :udata="state.autoitem"></autoTemple>
        </div>
        <div v-else class="errornone">
          <el-empty description="暂无自动上传数据"></el-empty>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script setup lang="ts">
import {
  defineAsyncComponent,
  reactive,
  watch,
} from "vue";
import { ElMessage } from "element-plus";
import { getCons } from "/@/api/report/construct";

// 自动
const autoTemple = defineAsyncComponent(
  () => import("/@/views/report/construct/components/tablecomponents/sixtable/auto.vue")
);

// 手动
const handTemple = defineAsyncComponent(
  () => import("/@/views/report/construct/components/tablecomponents/sixtable/hand.vue")
);

const state = reactive({
  autoitem: {} as any,
  handitem: {} as any
})


const props = defineProps({
  uitem: {
    type: Object,
    default: {},
  }
});
watch(
  () => props.uitem,
  (newVal) => {
    let _regular = newVal.regular.second;
    let _escalation = newVal.escalation.second;
    if (_regular != null && _escalation != null) {
      for (const [key, value] of Object.entries(_regular)) {
        if (_escalation != null) {
          for (const [keys, values] of Object.entries(_escalation)) {
            if (keys == key) {
              !Object.is(value, values) ? _escalation[`${keys}tag`] = 1 : _escalation[`${keys}tag`] = 0
            }
          }
        }
      }
    }
    state.autoitem = _regular
    state.handitem = _escalation
  },
)
</script>
<style lang="scss"></style>

