From 7cc9eb96be42323b6d68e966397f916342a27758 Mon Sep 17 00:00:00 2001 From: alimy Date: Sat, 16 Jul 2022 11:41:15 +0800 Subject: [PATCH] web: support custom config enable/allow module/feature in web frontend when vite build --- Dockerfile | 2 +- README.md | 12 ++-- web/.env | 14 ++++- web/src/components/compose.vue | 26 ++++++++- web/src/components/sidebar.vue | 103 +++++++++++++++++---------------- web/src/vite-env.d.ts | 16 ++++- 6 files changed, 111 insertions(+), 62 deletions(-) diff --git a/Dockerfile b/Dockerfile index 7378fd8b..2a52418f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -6,7 +6,7 @@ ARG EMBED_UI=yes ARG USE_DIST=no WORKDIR /web COPY web/ ./ -RUN [ $EMBED_UI != yes ] || [ $USE_API_HOST != yes ] || echo "VITE_HOST='$API_HOST'">.env +RUN [ $EMBED_UI != yes ] || [ $USE_API_HOST != yes ] || echo "VITE_HOST='$API_HOST'">.env.local RUN [ $EMBED_UI != yes ] || [ $USE_DIST != no ] || (yarn && yarn build) RUN [ $EMBED_UI = yes ] || mkdir dist || echo "" diff --git a/README.md b/README.md index d73af039..2873073c 100644 --- a/README.md +++ b/README.md @@ -127,11 +127,11 @@ PaoPao主要由以下优秀的开源项目/工具构建 #### 前端 -1. 进入前端目录 `web`，编辑 `.env` 文件中后端服务地址，下载依赖包 +1. 进入前端目录 `web`，拷贝`.env` 到 `.env.local`，编辑 `.env.local ` 文件中后端服务地址及其他配置项，下载依赖包 ```sh - cd ./web - vim .env + cd ./web && cp .env .env.local + vim .env.local yarn ``` @@ -145,11 +145,11 @@ PaoPao主要由以下优秀的开源项目/工具构建 #### 桌面端 -1. 进入前端目录 `web`，编辑 `.env` 文件中后端服务地址，下载依赖包 +1. 进入前端目录 `web`，拷贝`.env` 到 `.env.local`，编辑 `.env.local ` 文件中后端服务地址及其他配置项，下载依赖包 ```sh - cd ./web - vim .env + cd ./web && cp .env .env.local + vim .env.local yarn ``` diff --git a/web/.env b/web/.env index 90a3290e..efd7ee10 100644 --- a/web/.env +++ b/web/.env @@ -1 +1,13 @@ -VITE_HOST="https://api.paopao.info" \ No newline at end of file +VITE_HOST="https://api.paopao.info" + +# 模块开启 +VITE_ENABLE_WALLET=true + +# 功能开启 +VITE_ALLOW_TWEET_ATTACHMENT=true +VITE_ALLOW_TWEET_ATTACHMENT_PRICE=true +VITE_ALLOW_TWEET_VIDEO=true +VITE_ALLOW_TWEET_VISIBILITY=true + +# 局部参数 +VITE_DEFAULT_TWEET_VISIBILITY=public diff --git a/web/src/components/compose.vue b/web/src/components/compose.vue index ca4409b6..c98fbf29 100644 --- a/web/src/components/compose.vue +++ b/web/src/components/compose.vue @@ -73,7 +73,9 @@ - + + ([]); const videoContents = ref([]); const attachmentContents = ref([]); const visitType = ref(VisibilityEnum.PUBLIC); +const defaultVisitType = ref(VisibilityEnum.FRIEND) const visibilities = [ {value: VisibilityEnum.PUBLIC, label: "公开"} , {value: VisibilityEnum.PRIVATE, label: "私密"} , {value: VisibilityEnum.FRIEND, label: "好友可见"} ]; +const allowTweetVideo = (import.meta.env.VITE_ALLOW_TWEET_VIDEO.toLocaleLowerCase() === 'true') +const allowTweetAttachment = (import.meta.env.VITE_ALLOW_TWEET_ATTACHMENT.toLocaleLowerCase() === 'true') +const allowTweetAttachmentPrice = (import.meta.env.VITE_ALLOW_TWEET_ATTACHMENT_PRICE.toLocaleLowerCase() === 'true') +const allowTweetVisibility = (import.meta.env.VITE_ALLOW_TWEET_VISIBILITY.toLocaleLowerCase() === 'true') const uploadGateway = import.meta.env.VITE_HOST + '/v1/attachment'; const uploadToken = ref(); @@ -572,7 +583,7 @@ const submitPost = () => { imageContents.value = []; videoContents.value = []; attachmentContents.value = []; - visitType.value = VisibilityEnum.PUBLIC; + visitType.value = defaultVisitType.value;; }) .catch((err) => { submitting.value = false; @@ -583,6 +594,15 @@ const triggerAuth = (key: string) => { store.commit('triggerAuthKey', key); }; onMounted(() => { + if (import.meta.env.VITE_DEFAULT_TWEET_VISIBILITY.toLowerCase() === 'friend') { + defaultVisitType.value = VisibilityEnum.FRIEND + } else if (import.meta.env.VITE_DEFAULT_TWEET_VISIBILITY.toLowerCase() === 'public') { + defaultVisitType.value = VisibilityEnum.PUBLIC + } else { + defaultVisitType.value = VisibilityEnum.PRIVATE + } + + visitType.value = defaultVisitType.value; uploadToken.value = 'Bearer ' + localStorage.getItem('PAOPAO_TOKEN'); }); diff --git a/web/src/components/sidebar.vue b/web/src/components/sidebar.vue index bde6a712..041af5b1 100644 --- a/web/src/components/sidebar.vue +++ b/web/src/components/sidebar.vue @@ -151,57 +151,60 @@ onMounted(() => { }; }); const menuOptions = computed(() => { + const options = [ + { + label: '广场', + key: 'home', + icon: () => h(HomeOutline), + href: '/', + }, + { + label: '话题', + key: 'topic', + icon: () => h(Hash), + href: '/topic', + }, + { + label: '主页', + key: 'profile', + icon: () => h(LeafOutline), + href: '/profile', + }, + { + label: '提醒', + key: 'notification', + icon: () => h(NotificationsOutline), + href: '/notification', + }, + { + label: '收藏', + key: 'collection', + icon: () => h(BookmarkOutline), + href: '/collection', + }, + { + label: '点赞', + key: 'star', + icon: () => h(HeartOutline), + href: '/star', + } + ]; + if (import.meta.env.VITE_ENABLE_WALLET.toLocaleLowerCase() === 'true') { + options.push({ + label: '钱包', + key: 'wallet', + icon: () => h(WalletOutline), + href: '/wallet', + }); + } + options.push({ + label: '设置', + key: 'setting', + icon: () => h(SettingsOutline), + href: '/setting', + }); return store.state.userInfo.id > 0 - ? [ - { - label: '广场', - key: 'home', - icon: () => h(HomeOutline), - href: '/', - }, - { - label: '话题', - key: 'topic', - icon: () => h(Hash), - href: '/topic', - }, - { - label: '主页', - key: 'profile', - icon: () => h(LeafOutline), - href: '/profile', - }, - { - label: '提醒', - key: 'notification', - icon: () => h(NotificationsOutline), - href: '/notification', - }, - { - label: '收藏', - key: 'collection', - icon: () => h(BookmarkOutline), - href: '/collection', - }, - { - label: '点赞', - key: 'star', - icon: () => h(HeartOutline), - href: '/star', - }, - { - label: '钱包', - key: 'wallet', - icon: () => h(WalletOutline), - href: '/wallet', - }, - { - label: '设置', - key: 'setting', - icon: () => h(SettingsOutline), - href: '/setting', - }, - ] + ? options : [ { label: '广场', diff --git a/web/src/vite-env.d.ts b/web/src/vite-env.d.ts index abc9e1bf..4df44c83 100644 --- a/web/src/vite-env.d.ts +++ b/web/src/vite-env.d.ts @@ -1,4 +1,18 @@ /// /// /// -/// \ No newline at end of file +/// + +interface ImportMetaEnv { + readonly VITE_HOST: string + readonly VITE_ENABLE_WALLET: string + readonly VITE_ALLOW_TWEET_ATTACHMENT: string + readonly VITE_ALLOW_TWEET_ATTACHMENT_PRICE: string + readonly VITE_ALLOW_TWEET_VIDEO: string + readonly VITE_ALLOW_TWEET_VISIBILITY: string + readonly VITE_DEFAULT_TWEET_VISIBILITY: string +} + +interface ImportMeta { + readonly env: ImportMetaEnv +} \ No newline at end of file