📦 挖掘发现我的页面样式修改

src/App.vue

@@ -20,6 +20,9 @@ const redirectThrottle = new MemoryTimeOut('RedirectThrottle', 50000);
 onLaunch(async () => {
   console.log('App Launch');
 
+  //加载字体
+  loadFontFace();
+
   //加载登录信息
   const loginState = await authStore.loadLoginState();
   if (AppConfig.requireLogin) {
@@ -61,12 +64,27 @@ RequestApiConfig.setConfig({
   EnableApiDataLog: false,
 })
 
+function loadFontFace() {
+  uni.loadFontFace({
+    global: true,
+    family: "SongtiSCBlack",
+    source: 'url("https://mncdn.wenlvti.net/assets/fonts/STSongti-SC-Black.woff")',
+  });
+  uni.loadFontFace({
+    global: true,
+    family: "HUNdin1451",
+    source: 'url("https://mncdn.wenlvti.net/app_static/minnan/fonts/HUN-din1451.woff")',
+  });
+}
+
 //修改默认主题颜色
 configTheme(false, (theme, defaultDarkTheme) => {
   theme.colorConfigs.default.primary = '#e19579';
   theme.colorConfigs.pressed.primary = '#fbce7a';
   theme.colorConfigs.default.button = '#f6e9d9';
   theme.colorConfigs.background.primary = '#fef2e8';
+  theme.colorConfigs.background.secondary = '#f7f8f9';
+  theme.colorConfigs.background.tertiary = '#fff7f1';
 
   theme.varOverrides['ImageDefaultImage'] = 'https://mncdn.wenlvti.net/app_static/xiangyuan/EmptyImage.png';
   return [theme, defaultDarkTheme];
@@ -81,6 +99,6 @@ IconUtils.loadDefaultIcons('https://mncdn.wenlvti.net/app_static/xiangyuan/data/
   @import "@/components/index.scss";
 
   page {
-    background: #f7f8f9;
+    background: #fef2e8;
   }
 </style>

src/common/components/parts/HomeLargeTitle.vue

@@ -0,0 +1,30 @@
+<template>
+  <FlexRow center :padding="[25, 0, 20, 0]">
+    <Image :src="icon" :width="75" :height="46" mode="widthFix" />
+    <Width :width="15" />
+    <Text :text="title" fontConfig="h4" fontFamily="SongtiSCBlack" color="#5f3f2c" />
+  </FlexRow>
+</template>
+
+<script setup lang="ts">
+import Image from '@/components/basic/Image.vue';
+import Text from '@/components/basic/Text.vue';
+import FlexRow from '@/components/layout/FlexRow.vue';
+import Width from '@/components/layout/space/Width.vue';
+import { computed } from 'vue';
+
+const props = defineProps({
+  title: {
+    type: String,
+    default: '',
+  },
+  icon: {
+    type: String,
+    default: '/static/images/home/HomeTitleIcon.png',
+  },
+  lightCount: {
+    type: Number,
+    default: 2,
+  },
+});
+</script>

src/common/components/parts/HomeTitle.vue

@@ -2,7 +2,7 @@
   <SubTitle 
     :title="title" 
     :showMore="showMore" 
-    :padding="[25, 0, 15, 0]"
+    :padding="[25, 0, 20, 0]"
     @moreClicked="emit('moreClicked')"
   >
     <template #icon>
@@ -13,8 +13,8 @@
     </template>
     <template #title> 
       <FlexRow align="center">
-        <Text :text="titleBegin2" fontConfig="h4" color="#55989a" />
-        <Text v-if="titleEnd" :text="titleEnd" fontConfig="h4" color="#5f3f2c" />
+        <Text :text="titleBegin2" fontConfig="h4" fontFamily="SongtiSCBlack" color="#55989a" />
+        <Text v-if="titleEnd" :text="titleEnd" fontConfig="h4" fontFamily="SongtiSCBlack" color="#5f3f2c" />
       </FlexRow>
     </template>
   </SubTitle>

src/components/layout/masonry/MasonryGrid.vue

@@ -1,5 +1,5 @@
 <template>
-  <FlexView v-bind="props" :innerStyle="{
+  <!-- <FlexView v-if="supportsGridMasonry" v-bind="props" :innerStyle="{
     display: 'grid',
     gridTemplateColumns: `repeat(${columnCount}, 1fr)`, /* 定义3列 */
     gridTemplateRows: 'masonry', /* 行方向采用瀑布流布局 */
@@ -8,6 +8,14 @@
     ...(innerStyle || {}),
   }">
     <slot />
+  </FlexView> -->
+  <FlexView v-bind="props" :innerStyle="{
+    display: 'block',
+    columnCount: columnCount, 
+    columnGap: resolveThemeSize(columnSpacing),
+    ...(innerStyle || {}),
+  }">
+    <slot />
   </FlexView>
 </template>
 
@@ -15,13 +23,14 @@
 import { useTheme } from '@/components/theme/ThemeDefine';
 import FlexView, { type FlexProps } from '../FlexView.vue';
 
-export interface MasonryGridProps extends FlexProps {
+export interface MasonryGridProps extends Omit<FlexProps, 'justify' | 'align' | 'direction'> {
   columnCount?: number;
   columnSpacing?: number;
   rowSpacing?: number;
-  itemHeight?: number;
 }
 
+// const supportsGridMasonry = CSS.supports('grid-template-rows', 'masonry');
+
 const props = withDefaults(defineProps<MasonryGridProps>(), {
   columnCount: 2,
   columnSpacing: 10,

src/components/layout/masonry/MasonryGridItem.vue

@@ -0,0 +1,20 @@
+<template>
+  <FlexView v-bind="props" :innerStyle="{
+    breakInside: 'avoid',
+    pageBreakInside: 'avoid', /* For older browsers */
+    ...(innerStyle || {}),
+  }">
+    <slot />
+  </FlexView>
+</template>
+
+<script setup lang="ts">
+import FlexView, { type FlexProps } from '../FlexView.vue';
+
+export interface MasonryGridItemProps extends FlexProps {
+}
+
+const props = withDefaults(defineProps<MasonryGridItemProps>(), {
+});
+
+</script>

src/pages.json

@@ -239,8 +239,8 @@
   "globalStyle": {
     "navigationBarTextStyle": "white",
     "navigationBarTitleText": "uni-app",
-    "navigationBarBackgroundColor": "#00ca76",
-    "backgroundColor": "#F8F8F8"
+    "navigationBarBackgroundColor": "#e19579",
+    "backgroundColor": "#fef2e8"
   },
   "uniIdRouter": {}
 }

src/pages/dig/index.vue

@@ -1,12 +1,18 @@
 <template>
   <FlexCol>
-    <Image 
-      mode="aspectFill" 
-      src="https://mn.wenlvti.net/app_static/xiangyuan/images/index-banner.jpg"
-      width="100%"
-    />
     <FlexCol :padding="30">
-      <SubTitle title="我的村社" />
+      <HomeLargeTitle title="挖掘" />
+      <Image 
+        mode="aspectFill" 
+        src="/static/images/dig/IntrodBanner.png"
+        width="100%"
+        :height="300"
+        radius="20"
+        :innerStyle="{
+          border: '1px solid #fff',
+        }"
+      />
+      <HomeTitle title="我的村社" />
       <RequireLogin unLoginMessage="欢迎您成为志愿者！在这之前您需要登录或者注册完善基础信息后才能投稿和查看我认领的村社哦">
         <Result
           v-if="notVolunteerError"
@@ -32,11 +38,13 @@
             <FlexRow 
               v-for="item in villageListLoader.content.value"
               :key="item.id"
-              backgroundColor="white"
               :radius="20"
               :padding="20"
               align="center"
               justify="space-between"
+              :innerStyle="{
+                border: '1px solid #fff',
+              }"
             >
               <FlexRow align="center" :gap="20">
                 <Image 
@@ -90,7 +98,7 @@
       </RequireLogin>
 
       <Height :height="20" />
-      <SubTitle v-if="authStore.isLogged" title="我的贡献" />
+      <HomeTitle v-if="authStore.isLogged" title="我的贡献" />
       <FlexRow v-if="authStore.isLogged" backgroundColor="white" :radius="20" :padding="[40,20]">
         <FlexCol :flex="1" :gap="10" center>
           <Text :fontSize="60" fontFamily="Rockwell" color="primary">{{ volunteerInfoLoader.content.value?.points || 0 }}</Text>
@@ -138,6 +146,8 @@ import ButtonGroup from '@/components/basic/ButtonGroup.vue';
 import BubbleBox from '@/components/feedback/BubbleBox.vue';
 import Result from '@/components/feedback/Result.vue';
 import Dialog from '@/components/dialog/Dialog.vue';
+import HomeTitle from '@/common/components/parts/HomeTitle.vue';
+import HomeLargeTitle from '@/common/components/parts/HomeLargeTitle.vue';
 
 const showOnlinePreviewDialog = ref(false);
 const authStore = useAuthStore();

src/pages/home/discover/index.vue

@@ -1,44 +1,51 @@
 <template>
-  <FlexCol :gap="20" :padding="20">
-    <Box title="导览" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/home/icon-compass.png">
-      <ProvideVar :vars="{
-        GridItemIconSize: 90,
-        GridItemBackgroundColor: 'transparent',
-        GridItemPaddingHorizontal: 0,
-      }">
-        <Grid :borderGrid="false" :mainAxisCount="4">
-          <GridItem title="全部" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-all.png" touchable @click="goList('')" />
-          <!-- <GridItem title="历史文化" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-history.png" touchable @click="goList('历史文化')" /> -->
-          <GridItem title="环境格局" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-envirounment.png" touchable @click="goList('环境格局')" />
-          <GridItem title="传统建筑" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-buliding.png" touchable @click="goList('传统建筑')" />
-          <GridItem title="民俗文化" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-location.png" touchable @click="goList('民俗文化')" />
-          <GridItem title="地道美食" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-foods.png" touchable @click="goList('美食物产')" />
-          <GridItem title="物产资源" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-resource.png" touchable @click="goList('历史人物')" />
-          <!-- <GridItem title="旅游线路" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-route.png" touchable @click="goList('旅游线路')" /> -->
-        </Grid>
-      </ProvideVar>
-    </Box>
-    <Box title="最新推荐" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/home/icon-article.png">  
-      <SimplePageContentLoader :loader="discoverLoader">
-        <FlexCol :gap="25">
-          <ImageBlock2 
-            v-for="(item, i) in discoverLoader.content.value"
-            :key="i"
-            :src="item.image"
-            :title="item.title"
-            :desc="item.desc"
-            :imageHeight="400"
-            :imageRadius="15"
-            width="100%"
-            @click="goDetails(item)"
-          > 
-            <template #extra>
-              <Tag scheme="light" :text="item.villageName" type="primary" />
-            </template>
-          </ImageBlock2>
-        </FlexCol>
-      </SimplePageContentLoader>
-    </Box>
+  <FlexCol :gap="20" :padding="30">
+    <HomeLargeTitle title="发现" />
+    <Image
+      mode="aspectFill" 
+      src="/static/images/dig/IntrodBanner.png"
+      width="100%"
+      :height="300"
+      radius="20"
+      :innerStyle="{
+        border: '1px solid #fff',
+      }"
+    />
+    
+    <HomeTitle title="主题导览" />
+    <ProvideVar :vars="{
+      GridItemIconSize: 90,
+      GridItemBackgroundColor: 'transparent',
+      GridItemPaddingHorizontal: 0,
+    }">
+      <Grid :borderGrid="false" :mainAxisCount="3">
+        <GridItem title="全部" icon="/static/images/discover/IconAll.png" touchable @click="goList('')" />
+        <GridItem title="优秀案例" icon="/static/images/discover/IconExamples.png" touchable @click="goList('环境格局')" />
+        <GridItem title="经验分享" icon="/static/images/discover/IconShare.png" touchable @click="goList('传统建筑')" />
+        <GridItem title="常见问题" icon="/static/images/discover/IconQuestions.png" touchable @click="goList('民俗文化')" />
+        <GridItem title="挖掘技巧" icon="/static/images/discover/IconTrick.png" touchable @click="goList('美食物产')" />
+        <GridItem title="认知基础" icon="/static/images/discover/IconBase.png" touchable @click="goList('历史人物')" />
+      </Grid>
+    </ProvideVar>
+    
+    <HomeTitle title="最新推荐" />
+    <SimplePageContentLoader :loader="discoverLoader">
+      <FlexCol :gap="25" backgroundColor="background.tertiary" :radius="20" :padding="30">
+        <ImageBlock3 
+          v-for="(item, i) in discoverLoader.content.value"
+          :key="i"
+          backgroundColor="transparent"
+          :src="item.image"
+          :title="item.title"
+          :desc="item.desc"
+          :imageRadius="15"
+          :imageWidth="200"
+          :imageHeight="140"
+          @click="goDetails(item)"
+        />
+      </FlexCol>
+    </SimplePageContentLoader>
+    
     <Loadmore status="nomore" />
     <Height :height="150" />
   </FlexCol>
@@ -47,7 +54,6 @@
 <script setup lang="ts">
 import { navTo } from '@/components/utils/PageAction';
 import { useSimpleDataLoader } from '@/common/composeabe/SimpleDataLoader';
-import Box from '@/common/components/parts/Box.vue';
 import SimplePageContentLoader from '@/common/components/SimplePageContentLoader.vue';
 import Loadmore from '@/components/display/loading/Loadmore.vue';
 import FlexCol from '@/components/layout/FlexCol.vue';
@@ -57,7 +63,10 @@ import Grid from '@/components/layout/grid/Grid.vue';
 import GridItem from '@/components/layout/grid/GridItem.vue';
 import VillageInfoApi from '@/api/inhert/VillageInfoApi';
 import Tag from '@/components/display/Tag.vue';
-import ImageBlock2 from '@/components/display/block/ImageBlock2.vue';
+import Image from '@/components/basic/Image.vue';
+import HomeLargeTitle from '@/common/components/parts/HomeLargeTitle.vue';
+import HomeTitle from '@/common/components/parts/HomeTitle.vue';
+import ImageBlock3 from '@/components/display/block/ImageBlock3.vue';
 
 function goList(keywords: string) {
   navTo('/pages/home/discover/list', {

src/pages/home/index.vue

@@ -43,30 +43,34 @@
 
     <HomeTitle title="精选记忆" showMore />
     <MasonryGrid>
-      <ImageBlock2
+      <MasonryGridItem
         v-for="(item, i) in recommendLoader.content.value"
         :key="i"
-        :src="item.image"
-        :title="item.title"
-        :desc="item.desc"
         :width="340"
-        :imageWidth="340"
-        :imageRadius="15"
-        backgroundColor="transparent"
       >
-        <template #footer> 
-          <FlexRow justify="space-between" align="center" :padding="[10,0]" :margin="[10,0,0,0]">
-            <FlexRow align="center" :gap="10">
-              <Avatar :url="item.image" :size="40" />
-              <Text :text="item.userName" :fontSize="24" color="gray" />
+        <ImageBlock2
+          :src="item.image"
+          :title="item.title"
+          :desc="item.desc"
+          :width="340"
+          :imageWidth="340"
+          :imageRadius="15"
+          backgroundColor="transparent"
+        >
+          <template #footer> 
+            <FlexRow justify="space-between" align="center" :padding="[10,0]" :margin="[10,0,0,0]">
+              <FlexRow align="center" :gap="10">
+                <Avatar :url="item.image" :size="40" />
+                <Text :text="item.userName" :fontSize="24" color="gray" />
+              </FlexRow>
+              <FlexRow align="center" :gap="10">
+                <Icon icon="favorite" :color="item.isLike ? 'primary' : 'gray'" :size="30" />
+                <Text :text="item.likes" :fontSize="30" :color="item.isLike ? 'primary' : 'gray'" />
+              </FlexRow>
             </FlexRow>
-            <FlexRow align="center" :gap="10">
-              <Icon icon="favorite" :color="item.isLike ? 'primary' : 'gray'" :size="30" />
-              <Text :text="item.likes" :fontSize="30" :color="item.isLike ? 'primary' : 'gray'" />
-            </FlexRow>
-          </FlexRow>
-        </template>
-      </ImageBlock2>
+          </template>
+        </ImageBlock2>
+      </MasonryGridItem>
     </MasonryGrid>
 
     <Loadmore status="nomore" />
@@ -89,12 +93,13 @@ import Button from '@/components/basic/Button.vue';
 import HomeTitle from '@/common/components/parts/HomeTitle.vue';
 import VillageRankList from './components/VillageRankList.vue';
 import VillageUserRankList from './components/VillageUserRankList.vue';
-import MasonryGrid from '@/components/layout/masonry/MasonryGrid.vue';
 import ImageBlock2 from '@/components/display/block/ImageBlock2.vue';
 import VillageInfoApi from '@/api/inhert/VillageInfoApi';
 import Avatar from '@/components/display/Avatar.vue';
 import Icon from '@/components/basic/Icon.vue';
 import Text from '@/components/basic/Text.vue';
+import MasonryGrid from '@/components/layout/masonry/MasonryGrid.vue';
+import MasonryGridItem from '@/components/layout/masonry/MasonryGridItem.vue';
 
 const themeContext = useTheme();
 const searchKeywords = ref('');
@@ -104,7 +109,7 @@ const recommendLoader = useSimpleDataLoader(async () => {
     1, 20, 
     '', 
   ));
-  return res.list.concat(res.list).map((item) => ({
+  return res.list.concat(res.list,res.list, res.list, res.list).sort(() => Math.random() - 0.5).map((item) => ({
     ...item,
     isLike: Math.random() > 0.5,
     likes: Math.floor(Math.random() * 1000),

src/pages/home/store/index.vue

@@ -1,107 +0,0 @@
-<template>
-  <FlexCol :gap="20" :padding="20">
-    <SearchBar placeholder="输入关键词搜索" @search="goList(undefined, '知识库 · 全部', $event)" />
-    <FlexCol :radius="15" overflow="hidden">
-      <ImageSwiper 
-        :height="300"
-        :images="[
-          'https://mncdn.wenlvti.net/app_static/xiangyuan/images/causel/B1.jpg',
-          'https://mncdn.wenlvti.net/app_static/xiangyuan/images/causel/B2.jpg',
-        ]"
-      />
-    </FlexCol>
-    <Box title="主题导览" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/home/icon-compass.png">
-      <ProvideVar :vars="{
-        GridItemIconSize: 70,
-        GridItemBackgroundColor: 'transparent',
-        GridItemPaddingHorizontal: 0,
-      }">
-        <Grid :borderGrid="false" :mainAxisCount="3">
-          <GridItem title="全部" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-all.png" touchable @click="goList(undefined, '知识库 · 全部')" />
-          <GridItem title="优秀案例" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-camera.png" touchable @click="goList(359, '知识库 · 优秀案例')" />
-          <GridItem title="经验分享" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-rules.png" touchable @click="goList(358, '知识库 · 经验分享')" />
-          <GridItem title="常见问题" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-mark.png" touchable @click="goList(357, '知识库 · 常见问题')" />
-          <GridItem title="挖掘技巧" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-pac.png" touchable @click="goList(356, '知识库 · 挖掘技巧')" />
-          <GridItem title="认知基础" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/icons/icon-route.png" touchable @click="goList(355, '知识库 · 认知基础')" />
-        </Grid>
-      </ProvideVar>
-    </Box>
-    <Box title="最新" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/home/icon-shining.png" showMore @moreClicked="goList(undefined, '知识库 · 全部')">  
-      <SimplePageContentLoader :loader="discoverLoader">
-        <FlexCol :gap="20">
-          <Touchable 
-            v-for="(item, i) in discoverLoader.content.value"
-            :key="i"
-            justify="space-between"
-            align="center"
-            direction="row"
-            @click="goDetail(item)"
-          > 
-            <FlexCol flex="1" :gap="10">
-              <Text :text="item.title" fontConfig="h5" />
-              <Text :text="item.desc" fontConfig="subText" />
-              <FlexRow :gap="10">
-                <Tag v-for="tag in item.keywords" :key="tag" :text="tag" size="small" type="primary" scheme="light" />
-              </FlexRow>
-            </FlexCol>
-            <Width :width="25" />
-            <Image 
-              :src="item.thumbnail || item.image" 
-              :width="120" 
-              :height="120" 
-              :radius="15" 
-              mode="aspectFill"
-            />
-          </Touchable>
-        </FlexCol>
-      </SimplePageContentLoader>
-    </Box>
-    <Loadmore status="nomore" />
-    <Height :height="150" />
-  </FlexCol>
-</template>
-
-<script setup lang="ts">
-import CommonContent, { GetContentListItem, GetContentListParams } from '@/api/CommonContent';
-import Box from '@/common/components/parts/Box.vue';
-import ImageSwiper from '@/common/components/parts/ImageSwiper.vue';
-import SimplePageContentLoader from '@/common/components/SimplePageContentLoader.vue';
-import { useSimpleDataLoader } from '@/common/composeabe/SimpleDataLoader';
-import Image from '@/components/basic/Image.vue';
-import Text from '@/components/basic/Text.vue';
-import Loadmore from '@/components/display/loading/Loadmore.vue';
-import Tag from '@/components/display/Tag.vue';
-import Touchable from '@/components/feedback/Touchable.vue';
-import SearchBar from '@/components/form/SearchBar.vue';
-import FlexCol from '@/components/layout/FlexCol.vue';
-import FlexRow from '@/components/layout/FlexRow.vue';
-import Grid from '@/components/layout/grid/Grid.vue';
-import GridItem from '@/components/layout/grid/GridItem.vue';
-import Height from '@/components/layout/space/Height.vue';
-import Width from '@/components/layout/space/Width.vue';
-import ProvideVar from '@/components/theme/ProvideVar.vue';
-import { navTo } from '@/components/utils/PageAction';
-
-const discoverLoader = useSimpleDataLoader(async () => {
-  return (await CommonContent.getContentList(new GetContentListParams()
-    .setModelId(18)
-    .setMainBodyColumnId(354)
-  , 1, 30)).list
-});
-
-function goDetail(item: GetContentListItem) {
-  navTo('/pages/article/details', {
-    modelId: item.modelId,
-    mainBodyColumnId: item.mainBodyColumnId,
-    id: item.id,
-  });
-}
-function goList(mainBodyColumnId: number|undefined, title: string, search?: string) {
-  navTo('/pages/article/common/list', {
-    modelId: 18,
-    mainBodyColumnId,
-    title,
-    search: search || '',
-  });
-}
-</script>

src/pages/home/village/index.vue

@@ -0,0 +1,3 @@
+<template>
+  
+</template>

src/pages/index.vue

@@ -1,18 +1,23 @@
 <template>
-	<view class="index">
+	<view class="index" :style="{
+    backgroundImage: tabIndex === 4 ? `url('/static/images/mine/TopBanner.png')` : `url('/static/images/dig/TopBanner.png')`,
+    backgroundRepeat: 'no-repeat',
+    backgroundSize: '100% auto',
+    backgroundPosition: 'top center',
+    backgroundColor: themeContext.resolveThemeColor('background.primary'),
+  }">
     <CommonRoot>
       <StatusBarSpace backgroundColor="transparent" />
-      <NavBar 
-        :title="title"
+      <NavBar
         :titleScroll="false"
         backgroundColor="transparent"
         textColor="whweixinite"
         align="left"
       />
-      <HomeIndex v-if="tabIndex === 0" @goDiscover="tabIndex = 1" />
-      <DiscoverIndex v-else-if="tabIndex === 1" />
+      <HomeIndex v-if="tabIndex === 0" />
+      <VillageIndex v-else-if="tabIndex === 1" />
       <DigIndex v-else-if="tabIndex === 2" />
-      <StoreIndex v-else-if="tabIndex === 3" />
+      <DiscoverIndex v-else-if="tabIndex === 3" />
       <UserIndex v-else-if="tabIndex === 4" @goSubmit="tabIndex = 2" />
       <TabBar
         v-model:selectedTabIndex="tabIndex"
@@ -33,7 +38,9 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { ref } from 'vue';
+import { onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app';
+import { useTheme } from '@/components/theme/ThemeDefine';
 import StatusBarSpace from '@/components/layout/space/StatusBarSpace.vue';
 import NavBar from '@/components/nav/NavBar.vue';
 import TabBar from '@/components/nav/TabBar.vue';
@@ -42,26 +49,11 @@ import DigIndex from './dig/index.vue';
 import UserIndex from './user/index.vue';
 import HomeIndex from './home/index.vue';
 import DiscoverIndex from './home/discover/index.vue';
-import StoreIndex from './home/store/index.vue';
+import VillageIndex from './home/village/index.vue';
 import CommonRoot from '@/components/dialog/CommonRoot.vue';
-import { onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app';
 
-const title = computed(() => {
-  switch (tabIndex.value) {
-    case 0:
-      return '';
-    case 1:
-      return '发现·村社文化资源挖掘平台';
-    case 2:
-      return '挖掘·村社文化资源挖掘平台';
-    case 3:
-      return '知识库·村社文化资源挖掘平台';
-    case 4:
-      return '我的·村社文化资源挖掘平台';
-  }
-  return '';
-});
 const tabIndex = ref(0);
+const themeContext = useTheme();
 
 onShareAppMessage(() => {
   return {

src/pages/user/index.vue

@@ -1,42 +1,62 @@
 <template>
   <FlexCol :padding="[40,30,50,30]">
+    <HomeLargeTitle title="我的" />
     <Touchable 
-      direction="column"
-      justify="center" 
-      align="center"  
+      direction="row"
+      align="center"
+      justify="space-between"
       touchable 
       :gap="25"
+      :padding="[0,30]"
       @click="goUserProfile"
     >
-      <Image 
-        :src="userInfo?.avatar || UserHead"
-        :defaultImage="UserHead"
-        :failedImage="UserHead"
-        mode="aspectFill" 
-        class="avatar" 
-        width="100rpx"
-        height="100rpx"
-        :showFailed="false"
-        round
-      />
-      <H4 v-if="userInfo">{{ userInfo.nickname }}</H4>
-      <H4 v-else>欢迎登录</H4>
-      <H4 v-if="userInfo">{{ userInfo.mobile }}</H4>
+      <FlexRow align="center" :gap="25">
+        <Image 
+          :src="userInfo?.avatar || UserHead"
+          :defaultImage="UserHead"
+          :failedImage="UserHead"
+          mode="aspectFill" 
+          class="avatar" 
+          width="100rpx"
+          height="100rpx"
+          :showFailed="false"
+          round
+        />
+        <H4 v-if="userInfo">{{ userInfo.nickname }}</H4>
+        <H4 v-else>欢迎登录</H4>
+        <H4 v-if="userInfo">{{ userInfo.mobile }}</H4>
+      </FlexRow>
+      <Icon icon="arrow-right" size="30" />
     </Touchable>
-    <Height :height="50" />
-    <CellGroup round>
-      <Cell v-if="userInfo" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/icon-edit.png" title="我的投稿" showArrow touchable @click="navTo('/pages/dig/forms/submits', { 
-        villageVolunteerId: volunteerInfoLoader.content.value?.id || 0 
-      })" />
-      <Cell v-if="userInfo" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/icon-profile.png" title="编辑资料" showArrow touchable @click="goUserProfile" />
-      <Cell v-if="userInfo && !isBindWx" icon="wechat" title="绑定微信" showArrow touchable @click="navTo('/pages/dig/sharereg/bind-wx')" />
-      <Cell icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/icon-function.png" title="关于我们" showArrow touchable @click="navTo('/pages/home/about/about')" />
-      <button open-type="contact" class="remove-button-style">
-        <Cell icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/icon-service.png" title="联系客服" showArrow touchable />
-      </button>
-      <Cell icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/icon-chat.png" title="商务合作" showArrow touchable @click="navTo('/pages/home/about/contract')" />
-      <Cell v-if="userInfo" icon="https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/icon-quit.png" title="退出登录" showArrow touchable @click="doLogout" />
-    </CellGroup>
+    <ProvideVar :vars="{
+      GridItemIconSize: 90,
+      GridItemBackgroundColor: 'transparent',
+      GridItemPaddingHorizontal: 0,
+    }">
+      <Grid :borderGrid="false" :mainAxisCount="4">
+        <GridItem title="乡源等级" icon="/static/images/mine/IconLevel.png" touchable />
+        <GridItem title="我的成就" icon="/static/images/mine/IconArchive.png" touchable />
+        <GridItem title="任务中心" icon="/static/images/mine/IconTask.png" touchable />
+        <GridItem title="积分商城" icon="/static/images/mine/IconShop.png" touchable />
+      </Grid>
+    </ProvideVar>
+    <ProvideVar :vars="{
+      CellBackground: 'background.tertiary',
+      CellBottomBorder: false,
+    }">
+      <CellGroup round>
+        <Cell v-if="userInfo" icon="/static/images/mine/IconMyArticle.png" title="我的投稿" showArrow touchable @click="navTo('/pages/dig/forms/submits', { 
+          villageVolunteerId: volunteerInfoLoader.content.value?.id || 0 
+        })" />
+        <Cell icon="/static/images/mine/IconMyRecord.png" title="福泽记录" showArrow touchable />
+        <Cell icon="/static/images/mine/IconMyReward.png" title="兑换记录" showArrow touchable />
+        <Cell icon="/static/images/mine/IconAbout.png" title="关于我们" showArrow touchable @click="navTo('/pages/home/about/about')" />
+        <button open-type="contact" class="remove-button-style">
+          <Cell icon="/static/images/mine/IconContract.png" title="联系客服" showArrow touchable />
+        </button>
+        <Cell v-if="userInfo" icon="/static/images/mine/IconQuit.png" title="退出登录" showArrow touchable @click="doLogout" />
+      </CellGroup>
+    </ProvideVar>
     <DebugButton />
   </FlexCol>
 </template>
@@ -57,12 +77,17 @@ import FlexCol from '@/components/layout/FlexCol.vue';
 import AppCofig from '@/common/config/AppCofig';
 import VillageApi from '@/api/inhert/VillageApi';
 import DebugButton from './debug/DebugButton.vue';
+import FlexRow from '@/components/layout/FlexRow.vue';
+import Icon from '@/components/basic/Icon.vue';
+import HomeLargeTitle from '@/common/components/parts/HomeLargeTitle.vue';
+import ProvideVar from '@/components/theme/ProvideVar.vue';
+import Grid from '@/components/layout/grid/Grid.vue';
+import GridItem from '@/components/layout/grid/GridItem.vue';
 
 const UserHead = 'https://mncdn.wenlvti.net/app_static/xiangyuan/images/user/avatar.png';
 
 const authStore = useAuthStore();
 const userInfo = computed(() => authStore.isLogged ? authStore.userInfo : null);
-const isBindWx = computed(() => Boolean(userInfo.value?.openId));
 const volunteerInfoLoader = useSimpleDataLoader(async () => await VillageApi.getVolunteerInfo(), true);
 
 function goUserProfile() {