📦 村社分享二维码功能

src/api/light/LightVillageApi.ts

@@ -485,6 +485,32 @@ export class LightVillageApi extends AppServerRequestModule<DataModel> {
   }
 
   /**
+   * 生成小程序二维码
+   * POST /village/village/inviteQrcode
+   */
+  async getInviteQrcode(params: {
+    /** 场景值，最大32个可见字符 */
+    scene: string;
+    /** 页面路径，默认主页 */
+    page?: string;
+    /** 检查page是否存在，默认true */
+    check_path?: boolean;
+    /** 小程序版本: release=正式版, trial=体验版, develop=开发版 */
+    env_version?: 'release' | 'trial' | 'develop';
+    /** 二维码宽度(px)，280~1280，默认430 */
+    width?: number;
+    /** 自动配置线条颜色，默认false */
+    auto_color?: boolean;
+    /** 线条颜色，auto_color为false时生效 */
+    line_color?: { r: number; g: number; b: number };
+    /** 是否透明底色，默认false */
+    is_hyaline?: boolean;
+  }) {
+    const res = await this.post<{ img_url: string }>('/village/village/inviteQrcode', '生成小程序二维码', params);
+    return res.requireData();
+  }
+
+  /**
    * 修改本志愿者在本村的昵称
    * POST /village/volunteer/nicknameSave
    */

src/pages/home/village/dialogs/ShareQRDialog.vue

@@ -0,0 +1,51 @@
+<template>
+  <CommonDialog v-model:show="show" title="分享二维码">
+    <template #titleHeader>    
+      <SimplePageContentLoader :loader="loader">
+        <Image v-if="loader.isLoaded.value" :src="loader.content.value?.img_url" :width="500" :height="500" showMenuByLongpress />
+      </SimplePageContentLoader>
+    </template>
+    <FlexCol gap="gap.md">  
+      <FlexCol padding="padding.md" center>
+        <Text
+          text="您可长按下载二维码，进行线下分享和推广"
+          fontConfig="contentText" :fontSize="30" textAlign="center" 
+        />
+      </FlexCol>
+    </FlexCol>
+  </CommonDialog>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { useSimpleDataLoader } from '@/components/composeabe/loader/SimpleDataLoader';
+import { envVersion } from '@/common/config/AppCofig';
+import CommonDialog from '@/common/components/CommonDialog.vue';
+import Image from '@/components/basic/Image.vue';
+import FlexCol from '@/components/layout/FlexCol.vue';
+import Text from '@/components/basic/Text.vue';
+import SimplePageContentLoader from '@/components/loader/SimplePageContentLoader.vue';
+import LightVillageApi from '@/api/light/LightVillageApi';
+
+const show = ref(false);
+const props = defineProps<{
+  villageId: number,
+}>();
+
+const loader = useSimpleDataLoader(async () => {
+  const scense = `invg:${props.villageId}`;
+  return await LightVillageApi.getInviteQrcode({
+    scene: scense,
+    width: 430,
+    page: '/pages/index',
+    env_version: envVersion as 'trial'|'release'|'develop',
+    auto_color: true,
+  });
+});
+
+defineExpose({
+  show: () => {
+    show.value = true;
+  },
+});
+</script>

src/pages/home/village/introd/card.vue

@@ -24,6 +24,7 @@
             wordBreak="break-all"
             fontConfig="primaryTitle"
           />
+          <IconButton icon="cascades" :size="40" @click="shareQRDialog?.show()" />
         </FlexRow>
         <FlexRow center gap="gap.lg">
           <BubbleTip
@@ -314,6 +315,11 @@
     :staffTimeType="staffInfo.staffTimeType"
     ref="staffInfoRef"
   />  
+  <ShareQRDialog 
+    v-if="villageStore.currentVillage"
+    :villageId="villageStore.currentVillage.id"
+    ref="shareQRDialog"
+  /> 
   <Popup 
     :show="showUnLight"
     :zIndex="100"
@@ -358,7 +364,7 @@ import { useFollow } from '../composeabe/Follow';
 import { useGetNotice } from '../composeabe/GetNotice';
 import { assertNotNull, FormatUtils, waitTimeOut } from '@imengyu/imengyu-utils';
 import { navTo } from '@/components/utils/PageAction';
-import { confirm } from '@/components/dialog/CommonRoot';
+import { alert, confirm } from '@/components/dialog/CommonRoot';
 import HomeTitle from '@/common/components/parts/HomeTitle.vue';
 import Icon from '@/components/basic/Icon.vue';
 import Text from '@/components/basic/Text.vue';
@@ -392,6 +398,7 @@ import Image from '@/components/basic/Image.vue';
 import Avatar from '@/components/display/Avatar.vue';
 import ChangeNickDialog from '../dialogs/ChangeNickDialog.vue';
 import StaffInfoDialog from '../dialogs/StaffInfoDialog.vue';
+import ShareQRDialog from '../dialogs/ShareQRDialog.vue';
 
 const emit = defineEmits<{
   (e: 'goTree'): void;
@@ -457,6 +464,8 @@ const staffInfo = computed(() => extraInfoInList.value ? {
 } : null);
 const isStaff = computed(() => staffInfo.value?.type === 'staff');
 
+const shareQRDialog = ref<InstanceType<typeof ShareQRDialog>>();
+
 const rankActiveTag = ref('文化积分');
 const listActiveTag = ref('广场');
 
@@ -556,19 +565,25 @@ async function checkIsStaff(needTopic?: boolean) {
     await OfficialApi.checkTopicRule(villageStore.currentVillage.id)
     : (authStore.isAdmin || isStaff.value);
   if (!isAdmin) {
-    const goUpgrade = await confirm({
-      title: '提示',
-      content: '您还不是管理员' 
-        + (needTopic ? '/或暂无管理贴图权限' : '') 
-        + '，无法管理贴图哦。' 
-        + '您可以联系村社管理员将你添加为管理员，若当前村社暂无管理员，您可以点击“去升级”将您升级为管理员。',
-      confirmText: '去升级',
-      cancelText: '取消',
-    });
-    if (goUpgrade) {
-      navTo('/pages/home/village/upgrade/my-upgrade-management', {
-        villageId: villageStore.currentVillage.id,
+    if (needTopic && (isStaff.value || authStore.isAdmin)) {
+      alert({
+        title: '提示',
+        content: '您暂无管理贴图权限，无法管理贴图哦。可联系客服询问原因。',
+        icon: 'none',
+        duration: 3000
+      });
+    } else {
+      const goUpgrade = await confirm({
+        title: '提示',
+        content: '您还不是管理员，无法管理贴图哦。您可以联系村社管理员将你添加为管理员，若当前村社暂无管理员，您可以点击“去升级”将您升级为管理员。',
+        confirmText: '去升级',
+        cancelText: '取消',
       });
+      if (goUpgrade) {
+        navTo('/pages/home/village/upgrade/my-upgrade-management', {
+          villageId: villageStore.currentVillage.id,
+        });
+      }
     }
     return false;
   }