<template>
  <view>
    <view class="header">
      <view class="header_tabs">
        <hs-tabs :list="tablist" :current="useModel?.currentTabs?.value" @onChange="method?.handleChangeTabs" />
      </view>

      <view class="search">
        <up-search :show-action="false" @search="method?.handleSearch" v-model="useModel.formData.value.keyword"
          placeholder="搜索房屋名称/仪表名称" />
      </view>
      <view class="filter">
        <view>
          <hs-popup-project @change="method?.handleChangeFilter" />
        </view>
        <view>
          <hs-popup-building :params="useModel.formData.value" @change="method?.handleChangeFilter" />
        </view>
      </view>

    </view>
    <view class="work_contents">
      <cc-scroll-loading :meta="useModel?.metaData?.value" @load="method?.handleLoad">
        <view class="work_item" v-for="(i, index) in useModel?.listData?.value" :key="`items_${index}`"
          @click="method?.handleToDetail(i)">
          <view class="work_item_header">
            <view>
              <view v-if="i?.house_meter?.usage_type === 'WaterMeter'" class="table_tab water">
                <image src="/static/svg/water_meter_icon.svg" mode="widthFix" /> <text>水表</text>
              </view>
              <view v-if="i?.house_meter?.usage_type === 'ElectricMeter'" class="table_tab electricity">
                <image src="/static/svg/electricity_meter.svg" mode="widthFix" /> <text>电表</text>
              </view>
            </view>
            <view class="name">
              <text v-for="(res, index) in i?.house_meter?.house_meter_has_houses" :key="`house_${index}`">{{
                res?.full_name
              }}</text>
            </view>
          </view>
          <view>
            <view class="work_item_cell">
              仪表名称：{{ i?.house_meter?.name }}
            </view>
            <view class="work_item_cell">
              抄表读数：{{ i?.current_reading }}
            </view>
            <view class="work_item_cell">
              抄表时间：{{ i?.reading_time }}
            </view>
            <view class="work_item_cell">
              抄表人：{{ i?.company_employee?.name }}
            </view>

          </view>
        </view>
      </cc-scroll-loading>
    </view>
  </view>
</template>
<script setup lang="ts">
import { onLoad } from '@dcloudio/uni-app'
import method from './method'
import useModel from './model'
const tablist = [
  { label: '住户仪表', value: 'HouseMeter' },
  { label: '公共仪表', value: 'CommonMeter' },
]
onLoad(() => {
  useModel.formData.value.page = 1
  useModel.listData.value = []
  method?.getList()
})
</script>
<style lang="scss">
@import './style.scss';
</style>
