1 line
19 KiB
Plaintext
1 line
19 KiB
Plaintext
|
{"version":3,"file":"cases.vue2.mjs","sources":["../../../../pages/cases.vue"],"sourcesContent":["<template>\r\n <div>\r\n <!-- 页面标题 -->\r\n <HeroBanner \r\n title=\"客户案例\" \r\n subtitle=\"看看其他企业如何利用AWS云服务提升业务价值\"\r\n />\r\n\r\n <!-- 案例筛选 -->\r\n <section class=\"py-10\">\r\n <div class=\"container\">\r\n <div class=\"bg-white p-6 rounded-lg shadow-md\">\r\n <div class=\"flex flex-wrap items-center justify-between gap-4\">\r\n <div class=\"flex flex-wrap items-center gap-4\">\r\n <span class=\"text-gray-700 font-medium\">按行业筛选：</span>\r\n <div class=\"flex flex-wrap gap-2\">\r\n <button \r\n v-for=\"industry in industries\" \r\n :key=\"industry\"\r\n @click=\"toggleIndustryFilter(industry)\"\r\n :class=\"[\r\n 'px-4 py-2 rounded-full text-sm',\r\n selectedIndustries.includes(industry) \r\n ? 'bg-secondary text-white' \r\n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\r\n ]\"\r\n >\r\n {{ industry }}\r\n </button>\r\n <button \r\n @click=\"clearIndustryFilters\"\r\n class=\"px-4 py-2 rounded-full text-sm bg-gray-100 text-gray-700 hover:bg-gray-200\"\r\n >\r\n 全部\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"flex items-center\">\r\n <span class=\"text-gray-700 font-medium mr-4\">排序方式：</span>\r\n <select \r\n v-model=\"sortBy\"\r\n class=\"px-4 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-secondary focus:border-transparent\"\r\n >\r\n <option value=\"latest\">最新案例</option>\r\n <option value=\"default\">默认排序</option>\r\n </select>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <!-- 案例列表 -->\r\n <section class=\"py-12\">\r\n <div class=\"container\">\r\n <div v-if=\"filteredCases.length === 0\" class=\"text-center py-16\">\r\n <i class=\"fas fa-search text-4xl text-gray-300 mb-4\"></i>\r\n <p class=\"text-xl text-gray-500\">没有找到符合条件的案例</p>\r\n <button @click=\"clearIndustryFilters\" class=\"mt-4 text-secondary hover:text-secondary/90\">\r\n 清除筛选条件\r\n </button>\r\n </div>\r\n \r\n <div v-else class=\"grid md:grid-cols-2 lg:grid-cols-3 gap-8\">\r\n <div \r\n v-for=\"(case_item, index) in filteredCases\" \r\n :key=\"index\" \r\n class=\"bg-white rounded-lg shadow-lg overflow-hidden hover:shadow-xl transition-all duration-300 transform hover:-translate-y-1\"\r\n >\r\n <div class=\"h-48 bg-gray-200 relative overflow-hidden\">\r\n <div class=\"absolute top-0 right-0 bg-secondary text-white px-3 py-1 text-sm\">\r\n {{ case_item.industry }}\r\n </div>\r\n </div>\r\n <div class=\"p-6\">\r\n <h3 class=\"text-2xl font-semibold mb-4\">{{ case_item.title }}</h3>\r\n <p class=\"text-gray-600 mb-6\">{{ case_item.summary }}</p>\r\n <div class=\"flex justify-between items-center\">\r\n <button @click=\"openCaseDetail(case_item)\" class=\"text-secondary hover:text-secondary/90 flex items-center\">\r\n 阅读详情\r\n <i class=\"fas fa-arrow-right ml-2\"></i>\r\n </button>\r\n <span class=\"text-sm text-gray-500\">{{ case_item.date }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </sec
|