From 85301c89946b27ef50300709117200b44e78b6fe Mon Sep 17 00:00:00 2001 From: yanghao05 Date: Wed, 16 Apr 2025 20:58:26 +0800 Subject: [PATCH] feat: init wechat --- frontend/wechat/.gitignore | 24 ++ frontend/wechat/.vscode/extensions.json | 3 + frontend/wechat/README.md | 5 + frontend/wechat/bun.lock | 333 ++++++++++++++++++ frontend/wechat/index.html | 17 + frontend/wechat/package.json | 29 ++ frontend/wechat/public/vite.svg | 1 + frontend/wechat/src/App.vue | 35 ++ frontend/wechat/src/assets/vue.svg | 1 + frontend/wechat/src/components/HelloWorld.vue | 39 ++ frontend/wechat/src/layouts/MainLayout.vue | 49 +++ frontend/wechat/src/main.js | 22 ++ frontend/wechat/src/router/index.js | 36 ++ frontend/wechat/src/stores/article.js | 35 ++ frontend/wechat/src/style.css | 5 + frontend/wechat/src/views/ArticleDetail.vue | 27 ++ frontend/wechat/src/views/ArticleList.vue | 61 ++++ .../wechat/src/views/PurchasedArticles.vue | 48 +++ frontend/wechat/src/views/UserProfile.vue | 29 ++ frontend/wechat/tailwind.config.js | 14 + frontend/wechat/vite.config.js | 23 ++ quyun.code-workspace | 6 +- 22 files changed, 841 insertions(+), 1 deletion(-) create mode 100644 frontend/wechat/.gitignore create mode 100644 frontend/wechat/.vscode/extensions.json create mode 100644 frontend/wechat/README.md create mode 100644 frontend/wechat/bun.lock create mode 100644 frontend/wechat/index.html create mode 100644 frontend/wechat/package.json create mode 100644 frontend/wechat/public/vite.svg create mode 100644 frontend/wechat/src/App.vue create mode 100644 frontend/wechat/src/assets/vue.svg create mode 100644 frontend/wechat/src/components/HelloWorld.vue create mode 100644 frontend/wechat/src/layouts/MainLayout.vue create mode 100644 frontend/wechat/src/main.js create mode 100644 frontend/wechat/src/router/index.js create mode 100644 frontend/wechat/src/stores/article.js create mode 100644 frontend/wechat/src/style.css create mode 100644 frontend/wechat/src/views/ArticleDetail.vue create mode 100644 frontend/wechat/src/views/ArticleList.vue create mode 100644 frontend/wechat/src/views/PurchasedArticles.vue create mode 100644 frontend/wechat/src/views/UserProfile.vue create mode 100644 frontend/wechat/tailwind.config.js create mode 100644 frontend/wechat/vite.config.js diff --git a/frontend/wechat/.gitignore b/frontend/wechat/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/frontend/wechat/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/frontend/wechat/.vscode/extensions.json b/frontend/wechat/.vscode/extensions.json new file mode 100644 index 0000000..a7cea0b --- /dev/null +++ b/frontend/wechat/.vscode/extensions.json @@ -0,0 +1,3 @@ +{ + "recommendations": ["Vue.volar"] +} diff --git a/frontend/wechat/README.md b/frontend/wechat/README.md new file mode 100644 index 0000000..1511959 --- /dev/null +++ b/frontend/wechat/README.md @@ -0,0 +1,5 @@ +# Vue 3 + Vite + +This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 ` + + + \ No newline at end of file diff --git a/frontend/wechat/package.json b/frontend/wechat/package.json new file mode 100644 index 0000000..ab516ef --- /dev/null +++ b/frontend/wechat/package.json @@ -0,0 +1,29 @@ +{ + "name": "wechat", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "vite build", + "preview": "vite preview" + }, + "dependencies": { + "@primeuix/themes": "^1.0.3", + "@tailwindcss/vite": "^4.1.4", + "@vueuse/core": "^13.1.0", + "pinia": "^3.0.2", + "primeicons": "^7.0.0", + "primevue": "^4.3.3", + "tailwindcss": "^4.1.4", + "vue": "^3.5.13", + "vue-router": "^4.5.0" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^5.2.2", + "autoprefixer": "^10.4.21", + "postcss": "^8.5.3", + "tailwindcss-primeui": "^0.6.1", + "vite": "^6.3.0" + } +} diff --git a/frontend/wechat/public/vite.svg b/frontend/wechat/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/frontend/wechat/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/wechat/src/App.vue b/frontend/wechat/src/App.vue new file mode 100644 index 0000000..d864673 --- /dev/null +++ b/frontend/wechat/src/App.vue @@ -0,0 +1,35 @@ + + + + + diff --git a/frontend/wechat/src/assets/vue.svg b/frontend/wechat/src/assets/vue.svg new file mode 100644 index 0000000..770e9d3 --- /dev/null +++ b/frontend/wechat/src/assets/vue.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/frontend/wechat/src/components/HelloWorld.vue b/frontend/wechat/src/components/HelloWorld.vue new file mode 100644 index 0000000..76bfda6 --- /dev/null +++ b/frontend/wechat/src/components/HelloWorld.vue @@ -0,0 +1,39 @@ + + + + + diff --git a/frontend/wechat/src/layouts/MainLayout.vue b/frontend/wechat/src/layouts/MainLayout.vue new file mode 100644 index 0000000..896003b --- /dev/null +++ b/frontend/wechat/src/layouts/MainLayout.vue @@ -0,0 +1,49 @@ + + + + + diff --git a/frontend/wechat/src/main.js b/frontend/wechat/src/main.js new file mode 100644 index 0000000..5032694 --- /dev/null +++ b/frontend/wechat/src/main.js @@ -0,0 +1,22 @@ +import Aura from '@primeuix/themes/aura' +import { createPinia } from 'pinia' +import PrimeVue from 'primevue/config' +import { createApp } from 'vue' +import App from './App.vue' +import { router } from './router' + +// Import only the required PrimeVue styles +import 'primeicons/primeicons.css'; // Icons +import './style.css' + +const app = createApp(App) + +app.use(createPinia()) +app.use(router) +app.use(PrimeVue, { + theme: { + preset: Aura + } +}) + +app.mount('#app') diff --git a/frontend/wechat/src/router/index.js b/frontend/wechat/src/router/index.js new file mode 100644 index 0000000..f35b039 --- /dev/null +++ b/frontend/wechat/src/router/index.js @@ -0,0 +1,36 @@ +import { createRouter, createWebHistory } from 'vue-router' + +const routes = [ + { + path: '/', + component: () => import('@/layouts/MainLayout.vue'), + children: [ + { + path: '', + name: 'home', + component: () => import('@/views/ArticleList.vue'), + meta: { keepAlive: true } + }, + { + path: 'purchased', + name: 'purchased', + component: () => import('@/views/PurchasedArticles.vue') + }, + { + path: 'profile', + name: 'profile', + component: () => import('@/views/UserProfile.vue') + } + ] + }, + { + path: '/article/:id', + name: 'article-detail', + component: () => import('@/views/ArticleDetail.vue') + } +] + +export const router = createRouter({ + history: createWebHistory(), + routes +}) diff --git a/frontend/wechat/src/stores/article.js b/frontend/wechat/src/stores/article.js new file mode 100644 index 0000000..5b28d94 --- /dev/null +++ b/frontend/wechat/src/stores/article.js @@ -0,0 +1,35 @@ +import { defineStore } from 'pinia' + +export const useArticleStore = defineStore('article', { + state: () => ({ + articles: [], + page: 1, + loading: false, + hasMore: true, + searchQuery: '' + }), + + actions: { + async fetchArticles() { + if (this.loading || !this.hasMore) return + this.loading = true + try { + const response = await fetch(`/api/articles?page=${this.page}&q=${this.searchQuery}`) + const data = await response.json() + this.articles = [...this.articles, ...data.items] + this.hasMore = data.hasMore + this.page++ + } finally { + this.loading = false + } + }, + + setSearchQuery(query) { + this.searchQuery = query + this.articles = [] + this.page = 1 + this.hasMore = true + this.fetchArticles() + } + } +}) diff --git a/frontend/wechat/src/style.css b/frontend/wechat/src/style.css new file mode 100644 index 0000000..f4e5499 --- /dev/null +++ b/frontend/wechat/src/style.css @@ -0,0 +1,5 @@ + +@import "tailwindcss"; +@import "tailwindcss-primeui"; + +@custom-variant dark (&:where(.my-app-dark, .my-app-dark *)); \ No newline at end of file diff --git a/frontend/wechat/src/views/ArticleDetail.vue b/frontend/wechat/src/views/ArticleDetail.vue new file mode 100644 index 0000000..52b8e30 --- /dev/null +++ b/frontend/wechat/src/views/ArticleDetail.vue @@ -0,0 +1,27 @@ + + + diff --git a/frontend/wechat/src/views/ArticleList.vue b/frontend/wechat/src/views/ArticleList.vue new file mode 100644 index 0000000..a5bacc9 --- /dev/null +++ b/frontend/wechat/src/views/ArticleList.vue @@ -0,0 +1,61 @@ + + + diff --git a/frontend/wechat/src/views/PurchasedArticles.vue b/frontend/wechat/src/views/PurchasedArticles.vue new file mode 100644 index 0000000..c7468c1 --- /dev/null +++ b/frontend/wechat/src/views/PurchasedArticles.vue @@ -0,0 +1,48 @@ + + + + + diff --git a/frontend/wechat/src/views/UserProfile.vue b/frontend/wechat/src/views/UserProfile.vue new file mode 100644 index 0000000..838a703 --- /dev/null +++ b/frontend/wechat/src/views/UserProfile.vue @@ -0,0 +1,29 @@ + + + diff --git a/frontend/wechat/tailwind.config.js b/frontend/wechat/tailwind.config.js new file mode 100644 index 0000000..e6ab898 --- /dev/null +++ b/frontend/wechat/tailwind.config.js @@ -0,0 +1,14 @@ +/** @type {import('tailwindcss').Config} */ +export default { + content: [ + "./index.html", + "./src/**/*.{vue,js,ts,jsx,tsx}", + "./node_modules/primevue/**/*.{vue,js,ts,jsx,tsx}" + ], + theme: { + extend: {}, + }, + plugins: [ + require('tailwindcss-primeui') + ], +} diff --git a/frontend/wechat/vite.config.js b/frontend/wechat/vite.config.js new file mode 100644 index 0000000..b247f30 --- /dev/null +++ b/frontend/wechat/vite.config.js @@ -0,0 +1,23 @@ +import tailwindcss from '@tailwindcss/vite'; +import vue from '@vitejs/plugin-vue'; +import { resolve } from 'path'; +import { defineConfig } from 'vite'; + +export default defineConfig({ + plugins: [ + vue(), + tailwindcss(), + ], + resolve: { + alias: { + '@': resolve(__dirname, 'src') + } + }, + server: { + port: 3000, + open: true, + proxy: { + '/v1': 'http://localhost:8088', + } + } +}); diff --git a/quyun.code-workspace b/quyun.code-workspace index a4bd356..e1e1e35 100644 --- a/quyun.code-workspace +++ b/quyun.code-workspace @@ -4,6 +4,10 @@ "path": "backend", "name": "Backend", }, + { + "path": "frontend/wechat", + "name": "WeChat" + } { "path": "frontend/admin", "name": "Admin" @@ -16,4 +20,4 @@ } ] } -} \ No newline at end of file +}