<template>
  <div class="analysis-container page-container">
    <div class="toolbar" style="margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;">
      <a-radio-group v-model="period" type="button" @change="fetchReport">
        <a-radio value="day">今日分析</a-radio>
        <a-radio value="month">本月分析</a-radio>
      </a-radio-group>
      
      <a-button type="primary" :loading="loading" @click="fetchReport">
        <template #icon><IconRobot /></template>
        重新生成分析报告
      </a-button>
    </div>

    <a-card :bordered="false" class="report-card">
      <a-skeleton v-if="loading" :animation="true">
        <a-space direction="vertical" :style="{width:'100%'}" size="large">
          <a-skeleton-line :rows="3" />
          <a-skeleton-line :rows="5" />
        </a-space>
      </a-skeleton>
      <MarkdownViewer v-else :content="reportContent" />
    </a-card>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { Message } from '@arco-design/web-vue';
import { IconRobot } from '@arco-design/web-vue/es/icon';
import MarkdownViewer from '../../components/MarkdownViewer.vue';

const period = ref<'day' | 'month'>('day');
const loading = ref(false);
const reportContent = ref('');

const fetchReport = async () => {
  loading.value = true;
  try {
    // 模拟API调用延迟
    await new Promise(resolve => setTimeout(resolve, 1500));
    
    // 模拟返回的Markdown数据
    reportContent.value = generateMockReport(period.value);
  } catch (error) {
    Message.error('获取分析报告失败');
  } finally {
    loading.value = false;
  }
};

const generateMockReport = (p: 'day' | 'month') => {
  const timeStr = p === 'day' ? '今日' : '本月';
  return `
# 🤖 AI 能耗分析报告 (${timeStr})

## 1. 总体概况
**${timeStr}** 能耗整体表现平稳，但在特定时段出现了**异常波动**。

- 总用电量：**1,245.8 kWh**
- 碳排放量：**850.2 kg**
- 相比上周期：<span style="color: green">↓ 5.2%</span>

## 2. 关键发现
1. **空调系统**在 14:00 - 16:00 期间能耗激增，建议检查温控策略。
2. **照明系统**夜间待机能耗略高，存在 12% 的节能空间。
3. B区2号产线设备运行效率最佳，能效比提升 **3.4%**。

## 3. 节能建议
> 基于历史数据分析，我们为您推荐以下节能方案：

| 优先级 | 建议措施 | 预计节能 | 实施难度 |
| :--- | :--- | :--- | :--- |
| 🔴 高 | 调整中央空调出水温度 | 8% - 12% | 低 |
| 🟡 中 | 优化夜间照明定时任务 | 3% - 5% | 低 |
| 🔵 低 | 升级老旧变频器设备 | 15% | 高 |

## 4. 趋势预测
根据 LSTM 模型预测，未来 24 小时能耗将呈现**先升后降**趋势，峰值预计出现在明日 10:00 左右。

---
*此报告由 AI 自动生成，仅供参考。*
  `;
};

onMounted(() => {
  fetchReport();
});
</script>

<style scoped>
.page-container {
  padding: 20px;
}
.report-card {
  min-height: 600px;
}
</style>
