<template>
  <div class="home-container">
    <div class="quick-tips">
      <v-chip variant="outlined" color="#9C27B0" @click="router.push('/chat')">
        🤖 你好！让我来帮你解决问题
      </v-chip>
      <v-chip variant="outlined" color="#2196F3" @click="router.push('/chat')">
        💡 需要编程帮助吗？
      </v-chip>
      <v-chip variant="outlined" color="#4CAF50" @click="router.push('/chat')">
        📚 有什么想学习的知识？
      </v-chip>
      <v-chip variant="outlined" color="#FF9800" @click="router.push('/chat')">
        🎨 需要创意灵感吗？
      </v-chip>
    </div>
    <!-- 其他内容 -->
  </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router'
const router = useRouter()
</script>

<style scoped>
.quick-tips {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 24px;
}

.v-chip {
  cursor: pointer;
  transition: transform 0.2s;
}

.v-chip:hover {
  transform: translateY(-2px);
}
</style>