feat: init wechat

frontend/wechat/src/views/PurchasedArticles.vue

@@ -0,0 +1,48 @@
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const purchasedArticles = ref([])
+
+const showArticle = (id) => {
+    router.push(`/article/${id}`)
+}
+
+onMounted(async () => {
+    // TODO: Implement API call to fetch purchased articles
+    purchasedArticles.value = []
+})
+</script>
+
+<template>
+    <div class="purchased-articles">
+        <h2>已购买的文章</h2>
+        <div class="articles-list">
+            <div v-if="purchasedArticles.length === 0" class="empty-state">
+                暂无已购买的文章
+            </div>
+            <Card v-else v-for="article in purchasedArticles" :key="article.id" class="article-card"
+                @click="showArticle(article.id)">
+                <template #title>{{ article.title }}</template>
+                <template #content>{{ article.summary }}</template>
+            </Card>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+.purchased-articles {
+    padding: 1rem;
+}
+
+.empty-state {
+    text-align: center;
+    padding: 2rem;
+    color: #666;
+}
+
+.article-card {
+    margin-bottom: 1rem;
+}
+</style>