<script setup lang="ts">
import { computed, onActivated, onMounted, ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { getServiceDictEntries, isIndustryEnabledByType, getIndustryTypeValue } from '@/sql'
import XmFactorGrid from '@/features/shared/components/XmFactorGrid.vue'
import { useKvStore } from '@/pinia/kv'

interface XmBaseInfoState {
  projectIndustry?: string
}

type ServiceItem = {
  code: string
  name: string
  defCoe: number | null
  desc?: string | null
  notshowByzxflxs?: boolean
}

const PROJECT_INFO_KEY = 'xm-base-info-v1'
const projectIndustry = ref('')
const kvStore = useKvStore()
const { t } = useI18n()

const loadProjectIndustry = async () => {
  try {
    const data = await kvStore.getItem<XmBaseInfoState>(PROJECT_INFO_KEY)
    projectIndustry.value =
      typeof data?.projectIndustry === 'string' ? data.projectIndustry.trim() : ''
  } catch (error) {
    console.error('loadProjectIndustry failed:', error)
    projectIndustry.value = ''
  }
}

const filteredServiceDict = computed<Record<string, ServiceItem>>(() => {
  const industry = projectIndustry.value
  if (!industry) return {}
  const entries = getServiceDictEntries()
    .filter(({ item }) => isIndustryEnabledByType(item, getIndustryTypeValue(industry))
    )
    .map(({ id, item }) => [id, item as ServiceItem] as const)
  return Object.fromEntries(entries)
})

onMounted(() => {
  void loadProjectIndustry()
})

onActivated(() => {
  void loadProjectIndustry()
})
</script>

<template>
  <XmFactorGrid :title="t('htFactors.consultCategoryTitle')" storage-key="xm-consult-category-factor-v1" :dict="filteredServiceDict"
    :disable-budget-edit-when-standard-null="true" :exclude-notshow-by-zxflxs="true"
    :init-budget-value-from-standard="true" />
</template>
