<script setup lang="ts">
import { ref, computed } from 'vue'
import DetailHeader from '@/components/Layout/DetailHeader/DetailHeader.vue'
import ToolDetail from '@/components/Layout/ToolDetail/ToolDetail.vue'
import { copy } from '@/utils/string'

const title = "Emoji表情大全"

// 状态管理
const searchKeyword = ref('')
const selectedCategory = ref('all')

// Emoji分类
const emojiCategories = [
  { id: 'all', name: '全部' },
  { id: 'smileys', name: '表情符号与情感' },
  { id: 'people', name: '人物与身体' },
  { id: 'animals', name: '动物与自然' },
  { id: 'food', name: '食物与饮料' },
  { id: 'travel', name: '旅行与地点' },
  { id: 'activities', name: '活动' },
  { id: 'objects', name: '物体' },
  { id: 'symbols', name: '符号' },
  { id: 'flags', name: '旗帜' }
]

// Emoji数据
const emojis = [
  // 表情符号与情感
  { emoji: '😀', name: '笑脸', category: 'smileys' },
  { emoji: '😂', name: '笑哭', category: 'smileys' },
  { emoji: '😍', name: '爱心眼', category: 'smileys' },
  { emoji: '😎', name: '墨镜', category: 'smileys' },
  { emoji: '🤔', name: '思考', category: 'smileys' },
  { emoji: '😢', name: '哭泣', category: 'smileys' },
  { emoji: '😡', name: '愤怒', category: 'smileys' },
  { emoji: '😱', name: '惊讶', category: 'smileys' },
  { emoji: '😴', name: '睡觉', category: 'smileys' },
  { emoji: '😵', name: '晕', category: 'smileys' },
  { emoji: '🤢', name: '恶心', category: 'smileys' },
  { emoji: '🤠', name: '牛仔', category: 'smileys' },
  { emoji: '😈', name: '恶魔', category: 'smileys' },
  { emoji: '👼', name: '天使', category: 'smileys' },
  { emoji: '👻', name: '幽灵', category: 'smileys' },
  { emoji: '💩', name: '便便', category: 'smileys' },
  { emoji: '😊', name: '微笑', category: 'smileys' },
  { emoji: '😃', name: '大笑', category: 'smileys' },
  { emoji: '😄', name: '露齿笑', category: 'smileys' },
  { emoji: '😁', name: '开心', category: 'smileys' },
  { emoji: '😆', name: '眯眼笑', category: 'smileys' },
  { emoji: '😅', name: '汗笑', category: 'smileys' },
  { emoji: '🤣', name: '大笑', category: 'smileys' },
  { emoji: '😇', name: '天使笑', category: 'smileys' },
  { emoji: '🥰', name: '可爱', category: 'smileys' },
  { emoji: '😘', name: '飞吻', category: 'smileys' },
  { emoji: '😗', name: '亲吻', category: 'smileys' },
  { emoji: '😙', name: '亲亲', category: 'smileys' },
  { emoji: '😚', name: '闭眼亲吻', category: 'smileys' },
  { emoji: '😋', name: '美味', category: 'smileys' },
  { emoji: '😛', name: '调皮', category: 'smileys' },
  { emoji: '😝', name: '吐舌', category: 'smileys' },
  { emoji: '😜', name: '眨眼吐舌', category: 'smileys' },
  { emoji: '🤪', name: '疯狂', category: 'smileys' },
  { emoji: '😏', name: '得意', category: 'smileys' },
  { emoji: '😒', name: '无奈', category: 'smileys' },
  { emoji: '🙄', name: '白眼', category: 'smileys' },
  { emoji: '😬', name: '尴尬', category: 'smileys' },
  { emoji: '😌', name: '放松', category: 'smileys' },
  { emoji: '😔', name: '难过', category: 'smileys' },
  { emoji: '😪', name: '疲惫', category: 'smileys' },
  { emoji: '🤤', name: '流口水', category: 'smileys' },
  { emoji: '😷', name: '口罩', category: 'smileys' },
  { emoji: '🤒', name: '发烧', category: 'smileys' },
  { emoji: '🤕', name: '受伤', category: 'smileys' },
  { emoji: '🤢', name: '呕吐', category: 'smileys' },
  { emoji: '🤮', name: '恶心', category: 'smileys' },
  { emoji: '🤧', name: '打喷嚏', category: 'smileys' },
  { emoji: '🥵', name: '热', category: 'smileys' },
  { emoji: '🥶', name: '冷', category: 'smileys' },
  { emoji: '🥴', name: '醉', category: 'smileys' },
  { emoji: '😵‍💫', name: '头晕', category: 'smileys' },
  { emoji: '🤯', name: '震惊', category: 'smileys' },
  { emoji: '🤠', name: '牛仔', category: 'smileys' },
  { emoji: '🥳', name: '庆祝', category: 'smileys' },
  { emoji: '😎', name: '酷', category: 'smileys' },
  { emoji: '🤓', name: '书呆子', category: 'smileys' },
  { emoji: '😕', name: '困惑', category: 'smileys' },
  { emoji: '😟', name: '担忧', category: 'smileys' },
  { emoji: '🙁', name: '不高兴', category: 'smileys' },
  { emoji: '😮', name: '惊讶', category: 'smileys' },
  { emoji: '😯', name: '震惊', category: 'smileys' },
  { emoji: '😲', name: '惊讶', category: 'smileys' },
  { emoji: '😳', name: '害羞', category: 'smileys' },
  { emoji: '🥺', name: '恳求', category: 'smileys' },
  { emoji: '😦', name: '震惊', category: 'smileys' },
  { emoji: '😧', name: '担心', category: 'smileys' },
  { emoji: '😨', name: '害怕', category: 'smileys' },
  { emoji: '😰', name: '恐慌', category: 'smileys' },
  { emoji: '😥', name: '难过', category: 'smileys' },
  { emoji: '😢', name: '哭泣', category: 'smileys' },
  { emoji: '😭', name: '大哭', category: 'smileys' },
  { emoji: '😱', name: '恐惧', category: 'smileys' },
  { emoji: '😖', name: '痛苦', category: 'smileys' },
  { emoji: '😣', name: '压力', category: 'smileys' },
  { emoji: '😞', name: '失望', category: 'smileys' },
  { emoji: '😓', name: '汗', category: 'smileys' },
  { emoji: '😩', name: '疲惫', category: 'smileys' },
  { emoji: '😫', name: '无奈', category: 'smileys' },
  { emoji: '🥱', name: '打哈欠', category: 'smileys' },
  { emoji: '😤', name: '愤怒', category: 'smileys' },
  { emoji: '😡', name: '生气', category: 'smileys' },
  { emoji: '😠', name: '愤怒', category: 'smileys' },
  { emoji: '🤬', name: '暴怒', category: 'smileys' },
  { emoji: '😈', name: '恶魔', category: 'smileys' },
  { emoji: '👿', name: '魔鬼', category: 'smileys' },
  { emoji: '💀', name: '骷髅', category: 'smileys' },
  { emoji: '💩', name: '便便', category: 'smileys' },
  { emoji: '🤡', name: '小丑', category: 'smileys' },
  { emoji: '👹', name: '妖怪', category: 'smileys' },
  { emoji: '👺', name: '小鬼', category: 'smileys' },
  { emoji: '👻', name: '幽灵', category: 'smileys' },
  { emoji: '💋', name: '吻', category: 'smileys' },
  { emoji: '💌', name: '情书', category: 'smileys' },
  { emoji: '💘', name: '爱心箭', category: 'smileys' },
  { emoji: '💝', name: '礼物', category: 'smileys' },
  { emoji: '💖', name: '爱心', category: 'smileys' },
  { emoji: '💗', name: '爱心', category: 'smileys' },
  { emoji: '💓', name: '心跳', category: 'smileys' },
  { emoji: '💞', name: '双心', category: 'smileys' },
  { emoji: '💕', name: '双心', category: 'smileys' },
  { emoji: '💟', name: '心形', category: 'smileys' },
  { emoji: '💔', name: '破碎的心', category: 'smileys' },
  { emoji: '❤️', name: '红心', category: 'smileys' },
  { emoji: '🧡', name: '橙心', category: 'smileys' },
  { emoji: '💛', name: '黄心', category: 'smileys' },
  { emoji: '💚', name: '绿心', category: 'smileys' },
  { emoji: '💙', name: '蓝心', category: 'smileys' },
  { emoji: '💜', name: '紫心', category: 'smileys' },
  { emoji: '🖤', name: '黑心', category: 'smileys' },
  
  // 人物与身体
  { emoji: '👍', name: '点赞', category: 'people' },
  { emoji: '👎', name: '踩', category: 'people' },
  { emoji: '👋', name: '挥手', category: 'people' },
  { emoji: '🤝', name: '握手', category: 'people' },
  { emoji: '🙏', name: '祈祷', category: 'people' },
  { emoji: '👌', name: 'OK', category: 'people' },
  { emoji: '✌️', name: '胜利', category: 'people' },
  { emoji: '🤘', name: '摇滚', category: 'people' },
  { emoji: '🤙', name: '打电话', category: 'people' },
  { emoji: '👊', name: '拳头', category: 'people' },
  { emoji: '✊', name: '举起拳头', category: 'people' },
  { emoji: '👆', name: '向上指', category: 'people' },
  { emoji: '👇', name: '向下指', category: 'people' },
  { emoji: '👈', name: '向左指', category: 'people' },
  { emoji: '👉', name: '向右指', category: 'people' },
  
  // 动物与自然
  { emoji: '🐶', name: '狗', category: 'animals' },
  { emoji: '🐱', name: '猫', category: 'animals' },
  { emoji: '🐭', name: '老鼠', category: 'animals' },
  { emoji: '🐹', name: '仓鼠', category: 'animals' },
  { emoji: '🐰', name: '兔子', category: 'animals' },
  { emoji: '🦊', name: '狐狸', category: 'animals' },
  { emoji: '🐻', name: '熊', category: 'animals' },
  { emoji: '🐼', name: '熊猫', category: 'animals' },
  { emoji: '🐨', name: '考拉', category: 'animals' },
  { emoji: '🐯', name: '老虎', category: 'animals' },
  { emoji: '🦁', name: '狮子', category: 'animals' },
  { emoji: '🐮', name: '牛', category: 'animals' },
  { emoji: '🐷', name: '猪', category: 'animals' },
  { emoji: '🐸', name: '青蛙', category: 'animals' },
  { emoji: '🐵', name: '猴子', category: 'animals' },
  { emoji: '🐔', name: '鸡', category: 'animals' },
  { emoji: '🐧', name: '企鹅', category: 'animals' },
  { emoji: '🐦', name: '鸟', category: 'animals' },
  { emoji: '🐤', name: '小鸡', category: 'animals' },
  { emoji: '🐣', name: '破壳小鸡', category: 'animals' },
  { emoji: '🐥', name: '黄小鸡', category: 'animals' },
  { emoji: '🦆', name: '鸭子', category: 'animals' },
  { emoji: '🦅', name: '鹰', category: 'animals' },
  { emoji: '🦉', name: '猫头鹰', category: 'animals' },
  { emoji: '🦇', name: '蝙蝠', category: 'animals' },
  { emoji: '🐺', name: '狼', category: 'animals' },
  { emoji: '🐗', name: '野猪', category: 'animals' },
  { emoji: '🐴', name: '马', category: 'animals' },
  { emoji: '🦄', name: '独角兽', category: 'animals' },
  { emoji: '🐝', name: '蜜蜂', category: 'animals' },
  { emoji: '🐛', name: '毛毛虫', category: 'animals' },
  { emoji: '🦋', name: '蝴蝶', category: 'animals' },
  { emoji: '🐌', name: '蜗牛', category: 'animals' },
  { emoji: '🐞', name: '瓢虫', category: 'animals' },
  { emoji: '🐜', name: '蚂蚁', category: 'animals' },
  { emoji: '🐢', name: '乌龟', category: 'animals' },
  { emoji: '🐍', name: '蛇', category: 'animals' },
  { emoji: '🦎', name: '蜥蜴', category: 'animals' },
  { emoji: '🦖', name: '霸王龙', category: 'animals' },
  { emoji: '🦕', name: '雷龙', category: 'animals' },
  { emoji: '🐙', name: '章鱼', category: 'animals' },
  { emoji: '🐚', name: '贝壳', category: 'animals' },
  { emoji: '🐌', name: '蜗牛', category: 'animals' },
  { emoji: '🌱', name: '发芽', category: 'animals' },
  { emoji: '🌿', name: '草', category: 'animals' },
  { emoji: '🍃', name: '叶子', category: 'animals' },
  { emoji: '🍂', name: '落叶', category: 'animals' },
  { emoji: '🍁', name: '枫叶', category: 'animals' },
  { emoji: '🌾', name: '稻穗', category: 'animals' },
  { emoji: '🌴', name: '棕榈树', category: 'animals' },
  { emoji: '🌵', name: '仙人掌', category: 'animals' },
  { emoji: '🌷', name: '郁金香', category: 'animals' },
  { emoji: '🌺', name: '花朵', category: 'animals' },
  { emoji: '🌸', name: '樱花', category: 'animals' },
  { emoji: '🌹', name: '玫瑰', category: 'animals' },
  { emoji: '🌻', name: '向日葵', category: 'animals' },
  { emoji: '🌼', name: '雏菊', category: 'animals' },
  
  // 食物与饮料
  { emoji: '🍎', name: '苹果', category: 'food' },
  { emoji: '🍏', name: '青苹果', category: 'food' },
  { emoji: '🍐', name: '梨', category: 'food' },
  { emoji: '🍊', name: '橘子', category: 'food' },
  { emoji: '🍋', name: '柠檬', category: 'food' },
  { emoji: '🍌', name: '香蕉', category: 'food' },
  { emoji: '🍉', name: '西瓜', category: 'food' },
  { emoji: '🍇', name: '葡萄', category: 'food' },
  { emoji: '🍓', name: '草莓', category: 'food' },
  { emoji: '🍈', name: '瓜', category: 'food' },
  { emoji: '🍒', name: '樱桃', category: 'food' },
  { emoji: '🍑', name: '桃子', category: 'food' },
  { emoji: '🍍', name: '菠萝', category: 'food' },
  { emoji: '🥥', name: '椰子', category: 'food' },
  { emoji: '🥝', name: '猕猴桃', category: 'food' },
  { emoji: '🍅', name: '番茄', category: 'food' },
  { emoji: '🥑', name: '牛油果', category: 'food' },
  { emoji: '🥦', name: '西兰花', category: 'food' },
  { emoji: '🥬', name: '生菜', category: 'food' },
  { emoji: '🥒', name: '黄瓜', category: 'food' },
  { emoji: '🥜', name: '花生', category: 'food' },
  { emoji: '🌰', name: '栗子', category: 'food' },
  { emoji: '🍞', name: '面包', category: 'food' },
  { emoji: '🥐', name: '羊角面包', category: 'food' },
  { emoji: '🥖', name: '法棍', category: 'food' },
  { emoji: '🥨', name: '椒盐卷饼', category: 'food' },
  { emoji: '🥯', name: '百吉饼', category: 'food' },
  { emoji: '🧀', name: '奶酪', category: 'food' },
  { emoji: '🍖', name: '肉', category: 'food' },
  { emoji: '🍗', name: '鸡肉', category: 'food' },
  { emoji: '🍔', name: '汉堡', category: 'food' },
  { emoji: '🍟', name: '薯条', category: 'food' },
  { emoji: '🍕', name: '披萨', category: 'food' },
  { emoji: '🌭', name: '热狗', category: 'food' },
  { emoji: '🥪', name: '三明治', category: 'food' },
  { emoji: '🌮', name: '墨西哥卷', category: 'food' },
  { emoji: '🌯', name: '墨西哥饼', category: 'food' },
  { emoji: '🥙', name: '皮塔饼', category: 'food' },
  { emoji: '🍱', name: '便当', category: 'food' },
  { emoji: '🍘', name: '米饼', category: 'food' },
  { emoji: '🍙', name: '饭团', category: 'food' },
  { emoji: '🍚', name: '米饭', category: 'food' },
  { emoji: '🍛', name: '咖喱饭', category: 'food' },
  { emoji: '🍜', name: '拉面', category: 'food' },
  { emoji: '🍝', name: '意大利面', category: 'food' },
  { emoji: '🍠', name: '红薯', category: 'food' },
  { emoji: '🍢', name: '烤串', category: 'food' },
  { emoji: '🍣', name: '寿司', category: 'food' },
  { emoji: '🍤', name: '虾', category: 'food' },
  { emoji: '🍥', name: '鱼板', category: 'food' },
  { emoji: '🥮', name: '月饼', category: 'food' },
  { emoji: '🍡', name: '丸子', category: 'food' },
  { emoji: '🍧', name: '刨冰', category: 'food' },
  { emoji: '🍨', name: '冰淇淋', category: 'food' },
  { emoji: '🍩', name: '甜甜圈', category: 'food' },
  { emoji: '🍪', name: '饼干', category: 'food' },
  { emoji: '🎂', name: '蛋糕', category: 'food' },
  { emoji: '🍰', name: '甜点', category: 'food' },
  { emoji: '🧁', name: '纸杯蛋糕', category: 'food' },
  { emoji: '🍫', name: '巧克力', category: 'food' },
  { emoji: '🍬', name: '糖果', category: 'food' },
  { emoji: '🍭', name: '棒棒糖', category: 'food' },
  { emoji: '🍮', name: '布丁', category: 'food' },
  { emoji: '🍯', name: '蜂蜜', category: 'food' },
  { emoji: '🥛', name: '牛奶', category: 'food' },
  { emoji: '🍼', name: '奶瓶', category: 'food' },
  { emoji: '☕', name: '咖啡', category: 'food' },
  { emoji: '🍵', name: '茶', category: 'food' },
  { emoji: '🍶', name: '清酒', category: 'food' },
  { emoji: '🍾', name: '香槟', category: 'food' },
  { emoji: '🍷', name: '红酒', category: 'food' },
  { emoji: '🍸', name: '鸡尾酒', category: 'food' },
  { emoji: '🍹', name: '果汁', category: 'food' },
  { emoji: '🍺', name: '啤酒', category: 'food' },
  { emoji: '🍻', name: '干杯', category: 'food' },
  { emoji: '🥂', name: '碰杯', category: 'food' },
  
  // 旅行与地点
  { emoji: '🌍', name: '地球', category: 'travel' },
  { emoji: '🌎', name: '西半球', category: 'travel' },
  { emoji: '🌏', name: '东半球', category: 'travel' },
  { emoji: '🌐', name: '全球', category: 'travel' },
  { emoji: '🗺️', name: '地图', category: 'travel' },
  { emoji: '🗾', name: '日本地图', category: 'travel' },
  { emoji: '🧭', name: '指南针', category: 'travel' },
  { emoji: '🏔️', name: '雪山', category: 'travel' },
  { emoji: '🏕️', name: '露营', category: 'travel' },
  { emoji: '🏖️', name: '沙滩', category: 'travel' },
  { emoji: '🏜️', name: '沙漠', category: 'travel' },
  { emoji: '🏝️', name: '荒岛', category: 'travel' },
  { emoji: '🏞️', name: '风景', category: 'travel' },
  { emoji: '🌋', name: '火山', category: 'travel' },
  { emoji: '💧', name: '水滴', category: 'travel' },
  { emoji: '🌊', name: '海浪', category: 'travel' },
  { emoji: '🌅', name: '日出', category: 'travel' },
  { emoji: '🌄', name: '日落', category: 'travel' },
  { emoji: '🌠', name: '流星', category: 'travel' },
  { emoji: '⭐', name: '星星', category: 'travel' },
  { emoji: '🌟', name: '闪亮星星', category: 'travel' },
  { emoji: '🌙', name: '月亮', category: 'travel' },
  { emoji: '🌝', name: '满月', category: 'travel' },
  { emoji: '🌚', name: '新月', category: 'travel' },
  { emoji: '🌛', name: '弯月', category: 'travel' },
  { emoji: '🌜', name: '残月', category: 'travel' },
  { emoji: '🌞', name: '太阳', category: 'travel' },
  { emoji: '🌡️', name: '温度计', category: 'travel' },
  { emoji: '🌤️', name: '晴', category: 'travel' },
  { emoji: '⛅', name: '多云', category: 'travel' },
  { emoji: '🌥️', name: '阴天', category: 'travel' },
  { emoji: '☁️', name: '云', category: 'travel' },
  { emoji: '🌧️', name: '下雨', category: 'travel' },
  { emoji: '⛈️', name: '雷雨', category: 'travel' },
  { emoji: '🌩️', name: '闪电', category: 'travel' },
  { emoji: '❄️', name: '雪花', category: 'travel' },
  { emoji: '☃️', name: '雪人', category: 'travel' },
  { emoji: '⛄', name: '雪⼈', category: 'travel' },
  { emoji: '🌬️', name: '风', category: 'travel' },
  { emoji: '💨', name: '大风', category: 'travel' },
  { emoji: '🕐', name: '1点', category: 'travel' },
  { emoji: '🕑', name: '2点', category: 'travel' },
  { emoji: '🕒', name: '3点', category: 'travel' },
  { emoji: '🕓', name: '4点', category: 'travel' },
  { emoji: '🕔', name: '5点', category: 'travel' },
  { emoji: '🕕', name: '6点', category: 'travel' },
  { emoji: '🕖', name: '7点', category: 'travel' },
  { emoji: '🕗', name: '8点', category: 'travel' },
  { emoji: '🕘', name: '9点', category: 'travel' },
  { emoji: '🕙', name: '10点', category: 'travel' },
  { emoji: '🕚', name: '11点', category: 'travel' },
  { emoji: '🕛', name: '12点', category: 'travel' },
  
  // 活动
  { emoji: '⚽', name: '足球', category: 'activities' },
  { emoji: '🏀', name: '篮球', category: 'activities' },
  { emoji: '🏈', name: '橄榄球', category: 'activities' },
  { emoji: '⚾', name: '棒球', category: 'activities' },
  { emoji: '🥎', name: '垒球', category: 'activities' },
  { emoji: '🏐', name: '排球', category: 'activities' },
  { emoji: '🏉', name: '橄榄球', category: 'activities' },
  { emoji: '🎾', name: '网球', category: 'activities' },
  { emoji: '🥏', name: '飞盘', category: 'activities' },
  { emoji: '🏐', name: '排球', category: 'activities' },
  { emoji: '🏏', name: '板球', category: 'activities' },
  { emoji: '🏑', name: '曲棍球', category: 'activities' },
  { emoji: '🥍', name: '长曲棍球', category: 'activities' },
  { emoji: '🏒', name: '冰球', category: 'activities' },
  { emoji: '🥅', name: '球门', category: 'activities' },
  { emoji: '⛳', name: '高尔夫', category: 'activities' },
  { emoji: '⛸️', name: '滑冰', category: 'activities' },
  { emoji: '🎿', name: '滑雪', category: 'activities' },
  { emoji: '🛷', name: '雪橇', category: 'activities' },
  { emoji: '🏂', name: '单板滑雪', category: 'activities' },
  { emoji: '🏋️', name: '举重', category: 'activities' },
  { emoji: '🏌️', name: '高尔夫', category: 'activities' },
  { emoji: '🚣', name: '划船', category: 'activities' },
  { emoji: '🏊', name: '游泳', category: 'activities' },
  { emoji: '🏄', name: '冲浪', category: 'activities' },
  { emoji: '🏇', name: '赛马', category: 'activities' },
  { emoji: '🚴', name: '骑行', category: 'activities' },
  { emoji: '🚵', name: '山地自行车', category: 'activities' },
  { emoji: '🏹', name: '射箭', category: 'activities' },
  { emoji: '🎣', name: '钓鱼', category: 'activities' },
  { emoji: '🤿', name: '潜水', category: 'activities' },
  { emoji: '🎿', name: '滑雪', category: 'activities' },
  { emoji: '🎽', name: '运动衫', category: 'activities' },
  { emoji: '🎯', name: '靶心', category: 'activities' },
  { emoji: '🎱', name: '台球', category: 'activities' },
  { emoji: '🎮', name: '游戏手柄', category: 'activities' },
  { emoji: '🎰', name: '老虎机', category: 'activities' },
  { emoji: '🎲', name: '骰子', category: 'activities' },
  { emoji: '🎯', name: '靶心', category: 'activities' },
  { emoji: '🎭', name: '面具', category: 'activities' },
  { emoji: '🎪', name: '马戏团', category: 'activities' },
  { emoji: '🎫', name: '票', category: 'activities' },
  { emoji: '🎟️', name: '门票', category: 'activities' },
  { emoji: '🎨', name: '调色板', category: 'activities' },
  { emoji: '🎬', name: '电影', category: 'activities' },
  { emoji: '🎤', name: '麦克风', category: 'activities' },
  { emoji: '🎧', name: '耳机', category: 'activities' },
  { emoji: '🎼', name: '乐谱', category: 'activities' },
  { emoji: '🎵', name: '音符', category: 'activities' },
  { emoji: '🎶', name: '音乐', category: 'activities' },
  { emoji: '🎹', name: '钢琴', category: 'activities' },
  { emoji: '🥁', name: '鼓', category: 'activities' },
  { emoji: '🎷', name: '萨克斯', category: 'activities' },
  { emoji: '🎺', name: '小号', category: 'activities' },
  { emoji: '🎸', name: '吉他', category: 'activities' },
  { emoji: '🎻', name: '小提琴', category: 'activities' },
  { emoji: '🎪', name: '马戏团', category: 'activities' },
  { emoji: '🎭', name: '戏剧', category: 'activities' },
  { emoji: '🎨', name: '艺术', category: 'activities' },
  { emoji: '🎯', name: '目标', category: 'activities' },
  
  // 物体
  { emoji: '💻', name: '电脑', category: 'objects' },
  { emoji: '📱', name: '手机', category: 'objects' },
  { emoji: '📞', name: '电话', category: 'objects' },
  { emoji: '📟', name: '寻呼机', category: 'objects' },
  { emoji: '📠', name: '传真', category: 'objects' },
  { emoji: '💽', name: '光盘', category: 'objects' },
  { emoji: '💾', name: '软盘', category: 'objects' },
  { emoji: '💿', name: 'CD', category: 'objects' },
  { emoji: '📀', name: 'DVD', category: 'objects' },
  { emoji: '📼', name: '录像带', category: 'objects' },
  { emoji: '📷', name: '相机', category: 'objects' },
  { emoji: '📸', name: '拍照', category: 'objects' },
  { emoji: '📹', name: '摄像机', category: 'objects' },
  { emoji: '🎥', name: '电影摄像机', category: 'objects' },
  { emoji: '📺', name: '电视', category: 'objects' },
  { emoji: '📻', name: '收音机', category: 'objects' },
  { emoji: '📟', name: '寻呼机', category: 'objects' },
  { emoji: '🔋', name: '电池', category: 'objects' },
  { emoji: '🔌', name: '插头', category: 'objects' },
  { emoji: '💡', name: '灯泡', category: 'objects' },
  { emoji: '🔦', name: '手电筒', category: 'objects' },
  { emoji: '📔', name: '笔记本', category: 'objects' },
  { emoji: '📕', name: '书', category: 'objects' },
  { emoji: '📖', name: '打开的书', category: 'objects' },
  { emoji: '📗', name: '绿书', category: 'objects' },
  { emoji: '📘', name: '蓝书', category: 'objects' },
  { emoji: '📙', name: '黄书', category: 'objects' },
  { emoji: '📚', name: '书架', category: 'objects' },
  { emoji: '📓', name: '笔记本', category: 'objects' },
  { emoji: '📒', name: '笔记本', category: 'objects' },
  { emoji: '📃', name: '文件', category: 'objects' },
  { emoji: '📜', name: '卷轴', category: 'objects' },
  { emoji: '📄', name: '纸张', category: 'objects' },
  { emoji: '📰', name: '报纸', category: 'objects' },
  { emoji: '📞', name: '电话', category: 'objects' },
  { emoji: '☎️', name: '电话', category: 'objects' },
  { emoji: '📟', name: '寻呼机', category: 'objects' },
  { emoji: '📠', name: '传真', category: 'objects' },
  { emoji: '📡', name: '天线', category: 'objects' },
  { emoji: '💾', name: '软盘', category: 'objects' },
  { emoji: '💿', name: 'CD', category: 'objects' },
  { emoji: '📀', name: 'DVD', category: 'objects' },
  { emoji: '📼', name: '录像带', category: 'objects' },
  { emoji: '🔍', name: '放大镜', category: 'objects' },
  { emoji: '🔎', name: '搜索', category: 'objects' },
  { emoji: '🕯️', name: '蜡烛', category: 'objects' },
  { emoji: '💣', name: '炸弹', category: 'objects' },
  { emoji: '🔫', name: '枪', category: 'objects' },
  { emoji: '🔪', name: '刀', category: 'objects' },
  { emoji: '💊', name: '药丸', category: 'objects' },
  { emoji: '💉', name: '注射器', category: 'objects' },
  { emoji: '🔬', name: '显微镜', category: 'objects' },
  { emoji: '🔭', name: '望远镜', category: 'objects' },
  { emoji: '🧪', name: '试管', category: 'objects' },
  { emoji: '🧫', name: '培养皿', category: 'objects' },
  { emoji: '🧬', name: 'DNA', category: 'objects' },
  
  // 符号
  { emoji: '❤️', name: '红心', category: 'symbols' },
  { emoji: '🧡', name: '橙心', category: 'symbols' },
  { emoji: '💛', name: '黄心', category: 'symbols' },
  { emoji: '💚', name: '绿心', category: 'symbols' },
  { emoji: '💙', name: '蓝心', category: 'symbols' },
  { emoji: '💜', name: '紫心', category: 'symbols' },
  { emoji: '🖤', name: '黑心', category: 'symbols' },
  { emoji: '💔', name: '破碎的心', category: 'symbols' },
  { emoji: '💓', name: '心跳', category: 'symbols' },
  { emoji: '💗', name: '爱心', category: 'symbols' },
  { emoji: '💖', name: '闪亮的心', category: 'symbols' },
  { emoji: '💘', name: '丘比特之箭', category: 'symbols' },
  { emoji: '💝', name: '礼物', category: 'symbols' },
  { emoji: '💞', name: '双心', category: 'symbols' },
  { emoji: '💟', name: '心形', category: 'symbols' },
  { emoji: '❣️', name: '感叹号', category: 'symbols' },
  { emoji: '💕', name: '双心', category: 'symbols' },
  { emoji: '💌', name: '情书', category: 'symbols' },
  { emoji: '💋', name: '吻', category: 'symbols' },
  { emoji: '💯', name: '满分', category: 'symbols' },
  { emoji: '💢', name: '生气', category: 'symbols' },
  { emoji: '💥', name: '爆炸', category: 'symbols' },
  { emoji: '💫', name: '星星', category: 'symbols' },
  { emoji: '💦', name: '水滴', category: 'symbols' },
  { emoji: '💨', name: '风', category: 'symbols' },
  { emoji: '🕳️', name: '洞', category: 'symbols' },
  { emoji: '💣', name: '炸弹', category: 'symbols' },
  { emoji: '💬', name: '对话', category: 'symbols' },
  { emoji: '💭', name: '思考', category: 'symbols' },
  { emoji: '💤', name: '打鼾', category: 'symbols' },
  { emoji: '💡', name: '灯泡', category: 'symbols' },
  { emoji: '💢', name: '生气', category: 'symbols' },
  { emoji: '🔔', name: '铃铛', category: 'symbols' },
  { emoji: '🔕', name: '静音', category: 'symbols' },
  { emoji: '📣', name: '喇叭', category: 'symbols' },
  { emoji: '📢', name: '扩音器', category: 'symbols' },
  { emoji: '🔊', name: '音量', category: 'symbols' },
  { emoji: '🔉', name: '音量', category: 'symbols' },
  { emoji: '🔈', name: '音量', category: 'symbols' },
  { emoji: '🔇', name: '静音', category: 'symbols' },
  { emoji: '✅', name: '对勾', category: 'symbols' },
  { emoji: '❌', name: '叉号', category: 'symbols' },
  { emoji: '❓', name: '问号', category: 'symbols' },
  { emoji: '❗', name: '感叹号', category: 'symbols' },
  { emoji: '❔', name: '问号', category: 'symbols' },
  { emoji: '❕', name: '感叹号', category: 'symbols' },
  { emoji: '💯', name: '100分', category: 'symbols' },
  { emoji: '🔟', name: '10', category: 'symbols' },
  { emoji: '🔢', name: '数字', category: 'symbols' },
  { emoji: '🔣', name: '符号', category: 'symbols' },
  { emoji: '🔤', name: '字母', category: 'symbols' },
  { emoji: '🔡', name: '小写', category: 'symbols' },
  { emoji: '🔠', name: '大写', category: 'symbols' },
  { emoji: '🔸', name: '菱形', category: 'symbols' },
  { emoji: '🔹', name: '蓝色菱形', category: 'symbols' },
  { emoji: '🔺', name: '三角形', category: 'symbols' },
  { emoji: '🔻', name: '倒三角形', category: 'symbols' },
  { emoji: '💠', name: '钻石', category: 'symbols' },
  { emoji: '🔘', name: '圆形', category: 'symbols' },
  { emoji: '🔴', name: '红圆', category: 'symbols' },
  { emoji: '🔵', name: '蓝圆', category: 'symbols' },
  { emoji: '🔺', name: '三角形', category: 'symbols' },
  { emoji: '🔻', name: '倒三角形', category: 'symbols' },
  { emoji: '🔸', name: '橙色菱形', category: 'symbols' },
  { emoji: '🔹', name: '蓝色菱形', category: 'symbols' },
  { emoji: '🔶', name: '橙色六边形', category: 'symbols' },
  { emoji: '🔷', name: '蓝色六边形', category: 'symbols' },
  { emoji: '🔳', name: '白色正方形', category: 'symbols' },
  { emoji: '🔲', name: '黑色正方形', category: 'symbols' },
  
  // 旗帜
  { emoji: '🇨🇳', name: '中国国旗', category: 'flags' },
  { emoji: '🇺🇸', name: '美国国旗', category: 'flags' },
  { emoji: '🇯🇵', name: '日本国旗', category: 'flags' },
  { emoji: '🇰🇷', name: '韩国国旗', category: 'flags' },
  { emoji: '🇬🇧', name: '英国国旗', category: 'flags' },
  { emoji: '🇫🇷', name: '法国国旗', category: 'flags' },
  { emoji: '🇩🇪', name: '德国国旗', category: 'flags' },
  { emoji: '🇮🇹', name: '意大利国旗', category: 'flags' },
  { emoji: '🇷🇺', name: '俄罗斯国旗', category: 'flags' },
  { emoji: '🇺🇾', name: '乌拉圭国旗', category: 'flags' },
  { emoji: '🇧🇪', name: '比利时国旗', category: 'flags' },
  { emoji: '🇳🇱', name: '荷兰国旗', category: 'flags' },
  { emoji: '🇪🇸', name: '西班牙国旗', category: 'flags' },
  { emoji: '🇵🇹', name: '葡萄牙国旗', category: 'flags' },
  { emoji: '🇮🇪', name: '爱尔兰国旗', category: 'flags' },
  { emoji: '🇦🇺', name: '澳大利亚国旗', category: 'flags' },
  { emoji: '🇨🇦', name: '加拿大国旗', category: 'flags' },
  { emoji: '🇮🇱', name: '以色列国旗', category: 'flags' },
  { emoji: '🇵🇰', name: '巴基斯坦国旗', category: 'flags' },
  { emoji: '🇮🇳', name: '印度国旗', category: 'flags' },
  { emoji: '🇮🇩', name: '印度尼西亚国旗', category: 'flags' },
  { emoji: '🇹🇭', name: '泰国国旗', category: 'flags' },
  { emoji: '🇻🇳', name: '越南国旗', category: 'flags' },
  { emoji: '🇸🇦', name: '沙特阿拉伯国旗', category: 'flags' },
  { emoji: '🇦🇪', name: '阿联酋国旗', category: 'flags' },
  { emoji: '🇹🇷', name: '土耳其国旗', category: 'flags' },
  { emoji: '🇲🇾', name: '马来西亚国旗', category: 'flags' },
  { emoji: '🇸🇬', name: '新加坡国旗', category: 'flags' },
  { emoji: '🇭🇰', name: '香港特别行政区区旗', category: 'flags' },
  { emoji: '🇲🇴', name: '澳门特别行政区区旗', category: 'flags' },
  { emoji: '🇳🇴', name: '挪威国旗', category: 'flags' },
  { emoji: '🇸🇪', name: '瑞典国旗', category: 'flags' },
  { emoji: '🇫🇮', name: '芬兰国旗', category: 'flags' },
  { emoji: '🇩🇰', name: '丹麦国旗', category: 'flags' },
  { emoji: '🇮🇸', name: '冰岛国旗', category: 'flags' },
  { emoji: '🇨🇭', name: '瑞士国旗', category: 'flags' },
  { emoji: '🇦🇹', name: '奥地利国旗', category: 'flags' },
  { emoji: '🇭🇺', name: '匈牙利国旗', category: 'flags' },
  { emoji: '🇵🇱', name: '波兰国旗', category: 'flags' },
  { emoji: '🇨🇿', name: '捷克国旗', category: 'flags' },
  { emoji: '🇸🇰', name: '斯洛伐克国旗', category: 'flags' },
  { emoji: '🇭🇷', name: '克罗地亚国旗', category: 'flags' },
  { emoji: '🇧🇦', name: '波黑国旗', category: 'flags' },
  { emoji: '🇸🇮', name: '斯洛文尼亚国旗', category: 'flags' },
  { emoji: '🇲🇰', name: '北马其顿国旗', category: 'flags' },
  { emoji: '🇧🇬', name: '保加利亚国旗', category: 'flags' },
  { emoji: '🇷🇴', name: '罗马尼亚国旗', category: 'flags' },
  { emoji: '🇺🇦', name: '乌克兰国旗', category: 'flags' },
  { emoji: '🇧🇾', name: '白俄罗斯国旗', category: 'flags' },
  { emoji: '🇰🇿', name: '哈萨克斯坦国旗', category: 'flags' },
  { emoji: '🇺🇿', name: '乌兹别克斯坦国旗', category: 'flags' },
  { emoji: '🇰🇬', name: '吉尔吉斯斯坦国旗', category: 'flags' },
  { emoji: '🇹🇯', name: '塔吉克斯坦国旗', category: 'flags' },
  { emoji: '🇦🇲', name: '亚美尼亚国旗', category: 'flags' },
  { emoji: '🇦🇿', name: '阿塞拜疆国旗', category: 'flags' },
  { emoji: '🇮🇶', name: '伊拉克国旗', category: 'flags' },
  { emoji: '🇮🇷', name: '伊朗国旗', category: 'flags' },
  { emoji: '🇱🇧', name: '黎巴嫩国旗', category: 'flags' },
  { emoji: '🇸🇾', name: '叙利亚国旗', category: 'flags' },
  { emoji: '🇯🇴', name: '约旦国旗', category: 'flags' },
  { emoji: '🇵🇸', name: '巴勒斯坦国旗', category: 'flags' },
  { emoji: '🇰🇼', name: '科威特国旗', category: 'flags' },
  { emoji: '🇴🇲', name: '阿曼国旗', category: 'flags' },
  { emoji: '🇶🇦', name: '卡塔尔国旗', category: 'flags' },
  { emoji: '🇧🇭', name: '巴林国旗', category: 'flags' },
  { emoji: '🇾🇪', name: '也门国旗', category: 'flags' },
  { emoji: '🇲🇦', name: '摩洛哥国旗', category: 'flags' },
  { emoji: '🇩🇿', name: '阿尔及利亚国旗', category: 'flags' },
  { emoji: '🇹🇳', name: '突尼斯国旗', category: 'flags' },
  { emoji: '🇪🇬', name: '埃及国旗', category: 'flags' },
  { emoji: '🇸🇩', name: '苏丹国旗', category: 'flags' },
  { emoji: '🇪🇷', name: '厄立特里亚国旗', category: 'flags' },
  { emoji: '🇩🇯', name: '吉布提国旗', category: 'flags' },
  { emoji: '🇸🇴', name: '索马里国旗', category: 'flags' },
  { emoji: '🇰🇪', name: '肯尼亚国旗', category: 'flags' },
  { emoji: '🇺🇬', name: '乌干达国旗', category: 'flags' },
  { emoji: '🇹🇿', name: '坦桑尼亚国旗', category: 'flags' },
  { emoji: '🇷🇼', name: '卢旺达国旗', category: 'flags' },
  { emoji: '🇧🇮', name: '布隆迪国旗', category: 'flags' },
  { emoji: '🇨🇩', name: '刚果民主共和国国旗', category: 'flags' },
  { emoji: '🇨🇬', name: '刚果共和国国旗', category: 'flags' },
  { emoji: '🇦🇴', name: '安哥拉国旗', category: 'flags' },
  { emoji: '🇲🇿', name: '莫桑比克国旗', category: 'flags' },
  { emoji: '🇿🇦', name: '南非国旗', category: 'flags' },
  { emoji: '🇳🇦', name: '纳米比亚国旗', category: 'flags' },
  { emoji: '🇧🇼', name: '博茨瓦纳国旗', category: 'flags' },
  { emoji: '🇿🇲', name: '赞比亚国旗', category: 'flags' },
  { emoji: '🇲🇼', name: '马拉维国旗', category: 'flags' },
  { emoji: '🇲🇺', name: '毛里求斯国旗', category: 'flags' },
  { emoji: '🇸🇨', name: '塞舌尔国旗', category: 'flags' },
  { emoji: '🇨🇺', name: '古巴国旗', category: 'flags' },
  { emoji: '🇲🇽', name: '墨西哥国旗', category: 'flags' },
  { emoji: '🇧🇷', name: '巴西国旗', category: 'flags' },
  { emoji: '🇦🇷', name: '阿根廷国旗', category: 'flags' },
  { emoji: '🇨🇱', name: '智利国旗', category: 'flags' },
  { emoji: '🇵🇪', name: '秘鲁国旗', category: 'flags' },
  { emoji: '🇪🇨', name: '厄瓜多尔国旗', category: 'flags' },
  { emoji: '🇧🇴', name: '玻利维亚国旗', category: 'flags' },
  { emoji: '🇵🇾', name: '巴拉圭国旗', category: 'flags' },
  { emoji: '🇨🇺', name: '古巴国旗', category: 'flags' },
  { emoji: '🇩🇴', name: '多米尼加共和国国旗', category: 'flags' },
  { emoji: '🇵🇭', name: '菲律宾国旗', category: 'flags' },
  { emoji: '🇻🇺', name: '瓦努阿图国旗', category: 'flags' },
  { emoji: '🇫🇯', name: '斐济国旗', category: 'flags' },
  { emoji: '🇵🇳', name: '帕劳国旗', category: 'flags' },
  { emoji: '🇲🇵', name: '马绍尔群岛国旗', category: 'flags' },
  { emoji: '🇫🇲', name: '密克罗尼西亚联邦国旗', category: 'flags' },
  { emoji: '🇰🇮', name: '基里巴斯国旗', category: 'flags' },
  { emoji: '🇹🇻', name: '图瓦卢国旗', category: 'flags' },
  { emoji: '🇨🇰', name: '库克群岛国旗', category: 'flags' },
  { emoji: '🇳🇺', name: '纽埃国旗', category: 'flags' },
  { emoji: '🇲🇲', name: '缅甸国旗', category: 'flags' },
  { emoji: '🇱🇰', name: '斯里兰卡国旗', category: 'flags' },
  { emoji: '🇲🇻', name: '马尔代夫国旗', category: 'flags' },
  { emoji: '🇧🇩', name: '孟加拉国国旗', category: 'flags' },
  { emoji: '🇳🇵', name: '尼泊尔国旗', category: 'flags' },
  { emoji: '🇱🇦', name: '老挝国旗', category: 'flags' },
  { emoji: '🇰🇭', name: '柬埔寨国旗', category: 'flags' }
]

// 过滤后的Emoji
const filteredEmojis = computed(() => {
  let result = emojis
  
  // 按分类过滤
  if (selectedCategory.value !== 'all') {
    result = result.filter(emoji => emoji.category === selectedCategory.value)
  }
  
  // 按关键词搜索
  if (searchKeyword.value) {
    const keyword = searchKeyword.value.toLowerCase()
    result = result.filter(emoji => emoji.name.toLowerCase().includes(keyword))
  }
  
  return result
})

// 复制Emoji
const copyEmoji = (emoji: string) => {
  copy(emoji)
}
</script>

<template>
  <div class="flex flex-col mt-3 flex-1">
    <DetailHeader :title="title"></DetailHeader>

    <div class="p-4 rounded-2xl bg-white">
      <!-- 搜索和分类 -->
      <div class="mb-4">
        <el-input
          v-model="searchKeyword"
          placeholder="搜索Emoji"
          class="mb-4"
        />
        
        <div class="flex flex-wrap gap-2 mb-4">
          <el-button
            v-for="category in emojiCategories"
            :key="category.id"
            :type="selectedCategory === category.id ? 'primary' : 'default'"
            @click="selectedCategory = category.id"
            size="small"
          >
            {{ category.name }}
          </el-button>
        </div>
      </div>
      
      <!-- Emoji列表 -->
      <div class="grid grid-cols-6 sm:grid-cols-8 md:grid-cols-10 lg:grid-cols-12 gap-4">
        <div
          v-for="emoji in filteredEmojis"
          :key="emoji.emoji + emoji.name"
          class="flex flex-col items-center p-2 border rounded hover:bg-gray-50 cursor-pointer"
          @click="copyEmoji(emoji.emoji)"
        >
          <div class="text-3xl mb-1">{{ emoji.emoji }}</div>
          <div class="text-xs text-center">{{ emoji.name }}</div>
        </div>
      </div>
    </div>

    <!-- desc -->
    <ToolDetail title="描述">
      <el-text>
        在线Emoji表情大全，提供各种分类的Emoji表情，点击即可复制到剪贴板，方便在聊天、文档中使用。
      </el-text>
    </ToolDetail>

  </div>
</template>

<style scoped>

</style>