<template>
  <view class="add_page">
    <view class="add_page_header">
      <view class="hande_name_info">
        <view v-if="useModel?.showData?.value?.usage_type === 'WaterMeter'" class="table_tab water">
          <image src="/static/svg/water_meter_icon.svg" mode="widthFix" /> <text>水表</text>
        </view>
        <view v-if="useModel?.showData?.value?.usage_type === 'ElectricMeter'" class="table_tab electricity">
          <image src="/static/svg/electricity_meter.svg" mode="widthFix" /> <text>电表</text>
        </view>
        <view v-if="useModel?.showData?.value?.usage_type === 'GasMeter'" class="table_tab gas">
          <image src="/static/svg/gas_meter_icon.svg" mode="widthFix" /> <text>燃气表</text>
        </view>

        <view v-if="useModel?.showData?.value?.usage_type === 'HeatingMeter'" class="table_tab heating">
          <image src="/static/svg/HeatingIcon.svg" mode="widthFix" /> <text>暖气表</text>
        </view>

        <view class="name">
          <text v-for="(res, index) in useModel?.showData?.value?.house_meter_has_houses" :key="`house_${index}`">{{
            res?.full_name }}
          </text>
        </view>
      </view>
      <view class="header_cell">
        仪表名称：{{ useModel?.showData?.value?.name || '-' }}
      </view>
      <view class="header_cell">
        上次读数：{{ useModel?.showData?.value?.latest_value || '-' }}
      </view>
      <view class="header_cell">
        上次抄表：{{ showDay(useModel?.showData?.value?.latest_time) }}
      </view>
    </view>
    <view class="add_page_form_content">
      <view class="card_form">
        <view class="current_reading">
          <view class="title">
            本期读数
            <view class="time">
              更新时间：{{ getDay() }}
            </view>
          </view>
          <view class="input_reading">
            <input placeholder="输入读数" v-model="useModel.formData.value.current_reading"
              placeholder-style="font-size: 28rpx;color: #ccc;" />
          </view>
        </view>
        <!-- <hs-day-picker borderTop title="更新时间" required v-model:valueModel="useModel.formData.value.update_time" /> -->
        <hs-upload title="上传图片" :count="6" v-model:valueModel="useModel.formData.value.image" />
        <hs-cell-textarea borderTop title="备注（选填）" placeholder="请输入此次抄表的备注，选填"
          v-model:valueModel="useModel.formData.value.remark" />
      </view>
    </view>

    <hs-footer btnParimaryName="提交" @handleParmaryClick="method?.handleSubmit" />
  </view>
</template>

<script setup lang="ts">
import { getDay, showDay } from '@/common/libraries/day'
import { onLoad, onUnload } from '@dcloudio/uni-app'
import method from './method'
import useModel from './model'

onLoad((e) => {
  method?.init(e)
  method?.getShow(e)
})

onUnload(() => {
  useModel.formData.value = { is_anonymous: false }
})
</script>
<style lang="scss">
@import './style.scss';
</style>
