Browse Source

feat(app): 新增个人中心功能和材料商家入驻页面

EvilDragon 5 tháng trước cách đây
mục cha
commit
eedb7bc3b7

+ 5 - 1
packages/app/src/components/card-menu.vue

@@ -19,16 +19,20 @@ defineProps({
         rowEnd?: number
         iconSize?: number
         gridItemClass?: string
+        path?: string
       }[]
     >,
     default: () => [],
   },
 })
+const handleCilck = async ({ path }: any) => {
+  path && uni.navigateTo({ url: path })
+}
 </script>
 <template>
   <view class="my-6 grid grid-gap-2.5" :class="customClass">
     <template v-for="it of items" :key="it.title">
-      <div :class="it.gridItemClass">
+      <div :class="it.gridItemClass" @click="handleCilck(it)">
         <card
           :custom-class="
             [

+ 29 - 0
packages/app/src/pages.json

@@ -238,6 +238,13 @@
       }
     },
     {
+      "path": "pages/material/settled-in/index",
+      "type": "page",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
       "path": "pages/mine/authentication/index",
       "type": "page",
       "style": {
@@ -246,6 +253,21 @@
       }
     },
     {
+      "path": "pages/mine/convention/index",
+      "type": "page",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/mine/coupons/index",
+      "type": "page",
+      "style": {
+        "navigationBarTitleText": "优惠券包",
+        "navigationBarBackgroundColor": "#fff"
+      }
+    },
+    {
       "path": "pages/mine/homepage/index",
       "type": "page",
       "layout": "back",
@@ -254,6 +276,13 @@
       }
     },
     {
+      "path": "pages/mine/points/index",
+      "type": "page",
+      "style": {
+        "navigationStyle": "custom"
+      }
+    },
+    {
       "path": "pages/mine/setting/index",
       "type": "page",
       "style": {

+ 26 - 0
packages/app/src/pages/material/settled-in/index.vue

@@ -0,0 +1,26 @@
+<route lang="json">
+{ "style": { "navigationStyle": "custom" } }
+</route>
+<script setup lang="ts">
+const imgs = ref([
+  'https://image.zhuchaohui.com/zhucaohui/35d920447457fde77faf216fabaeca9215c474f4b5d5aa2270bf42a0a7894733.jpg',
+])
+const handleClickLeft = () => {
+  uni.navigateBack()
+}
+</script>
+<template>
+  <div>
+    <wd-navbar
+      left-arrow
+      fixed
+      safe-area-inset-top
+      custom-class="bg-transparent"
+      title="材料商入驻"
+      @click-left="handleClickLeft"
+    ></wd-navbar>
+    <template v-for="(it, i) in imgs" :key="i">
+      <wd-img width="100%" :src="it" mode="widthFix"></wd-img>
+    </template>
+  </div>
+</template>

+ 26 - 0
packages/app/src/pages/mine/convention/index.vue

@@ -0,0 +1,26 @@
+<route lang="json">
+{ "style": { "navigationStyle": "custom" } }
+</route>
+<script setup lang="ts">
+const imgs = ref([
+  'https://image.zhuchaohui.com/zhucaohui/3014480570bd7b81a64eb1ca598c7e017f7952eb982e47aae4eb23de9d7de9f2.jpg',
+])
+const handleClickLeft = () => {
+  uni.navigateBack()
+}
+</script>
+<template>
+  <div>
+    <wd-navbar
+      left-arrow
+      fixed
+      safe-area-inset-top
+      custom-class="bg-transparent"
+      title="筑巢荟公约"
+      @click-left="handleClickLeft"
+    ></wd-navbar>
+    <template v-for="(it, i) in imgs" :key="i">
+      <wd-img width="100%" :src="it" mode="widthFix"></wd-img>
+    </template>
+  </div>
+</template>

+ 39 - 0
packages/app/src/pages/mine/coupons/index.vue

@@ -0,0 +1,39 @@
+<route lang="json">
+{ "style": { "navigationBarTitleText": "优惠券包", "navigationBarBackgroundColor": "#fff" } }
+</route>
+<script setup lang="ts">
+import Card from '@/components/card.vue'
+
+const tab = ref()
+const tabs = ref([{ label: '商品优惠券' }, { label: '销售积分券' }])
+const data = ref([{}])
+</script>
+<template>
+  <div class="flex-grow flex flex-col gap-4">
+    <wd-tabs v-model="tab">
+      <block v-for="({ label }, i) in tabs" :key="i">
+        <wd-tab :title="label"></wd-tab>
+      </block>
+    </wd-tabs>
+    <template v-for="(it, i) of data" :key="i">
+      <Card custom-class="mx-3.5">
+        <div class="flex gap-3">
+          <div class="w-[94px] h-[94px] bg-[#f6f6f6] rounded-[10px]"></div>
+          <div class="flex flex-col justify-around">
+            <div class="text-black text-sm font-normal font-['PingFang SC'] leading-normal">
+              GELATO咖啡兑换券
+            </div>
+            <div
+              class="text-center text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal"
+            >
+              有效期:2024/04/01-2024/05/30
+            </div>
+            <div class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal">
+              使用说明
+            </div>
+          </div>
+        </div>
+      </Card>
+    </template>
+  </div>
+</template>

+ 5 - 2
packages/app/src/pages/mine/index.vue

@@ -31,8 +31,8 @@ const { data: taskData, run: getTaskData } = useRequest(() => getTasks({}), {
   initialData: { list: [] },
 })
 const menus = ref([
-  { title: '积分明细', icon: integral },
-  { title: '优惠券包', icon: coupon },
+  { title: '积分明细', icon: integral, path: '/pages/mine/points/index' },
+  { title: '优惠券包', icon: coupon, path: '/pages/mine/coupons/index' },
   { title: '我的订单', icon: order },
   { title: '专属客服', icon: agent },
   { title: '个人设置', icon: setting, path: '/pages/mine/setting/index' },
@@ -53,6 +53,7 @@ const pieces = ref([
     class: 'flex-row! pb-0 pr-0',
     iconSize: 68,
     gridItemClass: 'col-start-2 row-start-1',
+    path: '/pages/material/settled-in/index',
   },
   {
     title: '筑巢荟公约',
@@ -61,8 +62,10 @@ const pieces = ref([
     class: 'col-start-2 row-start-2 flex-row! pb-0',
     iconSize: 44,
     gridItemClass: 'col-start-2 row-start-2',
+    path: '/pages/mine/convention/index',
   },
 ])
+
 const avatar = computed(() =>
   !isEmpty(userInfo.value.avatar) ? userInfo.value.avatar : 'https://via.placeholder.com/72x72',
 )

+ 62 - 0
packages/app/src/pages/mine/points/index.vue

@@ -0,0 +1,62 @@
+<route lang="json">
+{ "style": { "navigationStyle": "custom" } }
+</route>
+<script setup lang="ts">
+import { pageHeaderBg, pageHeaderFilter } from '@designer-hub/assets/src'
+import { back } from '../../../core/utils/router'
+import Card from '@/components/card.vue'
+</script>
+<template>
+  <div class="flex-grow">
+    <wd-navbar
+      left-arrow
+      safe-area-inset-top
+      fixed
+      title="积分明细"
+      :bordered="false"
+      custom-class="bg-transparent!"
+      @leftClick="back()"
+    ></wd-navbar>
+    <div class="relative aspect-[3/1]">
+      <div class="aspect-[1.69/1] absolute top-0 w-full">
+        <div class="relative w-full h-full">
+          <div class="absolute top-0 left-0 right-0">
+            <wd-img
+              width="100%"
+              src="https://image.zhuchaohui.com/zhucaohui/033c6d899ea6ab7b042cc11a93b44f000274b48c5be38874c1f43de93ac90751.png"
+              mode="widthFix"
+              custom-class=""
+            ></wd-img>
+          </div>
+          <div class="absolute top-0 left-0 right-0">
+            <wd-img
+              width="100%"
+              src="https://image.zhuchaohui.com/zhucaohui/f3571650a267343e33316f4a6ca02dc423a3ce17ad7504caaca7ff2ac61e2465.png"
+              mode="widthFix"
+            ></wd-img>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="relative px-3.5">
+      <div class="flex items-end px-3.5 mb-5">
+        <div class="text-white text-sm font-normal font-['PingFang SC'] leading-relaxed">
+          当前积分
+        </div>
+        <div>
+          <span class="text-[#ffefd8] text-4xl font-normal font-['D-DIN Exp'] leading-9">615</span>
+        </div>
+        <div class="flex-1"></div>
+        <div></div>
+        <div class="text-[#b6b6b6] text-sm font-normal font-['PingFang SC'] leading-relaxed">
+          2024
+        </div>
+      </div>
+      <Card custom-class="relative">
+        <div class="flex flex-col">
+          <wd-status-tip image="content" tip="暂无"></wd-status-tip>
+        </div>
+      </Card>
+    </div>
+  </div>
+</template>

+ 4 - 0
packages/app/src/types/uni-pages.d.ts

@@ -25,8 +25,12 @@ interface NavigateToOptions {
        "/pages/material/detail/index" |
        "/pages/material/mini-class/index" |
        "/pages/material/recommend/index" |
+       "/pages/material/settled-in/index" |
        "/pages/mine/authentication/index" |
+       "/pages/mine/convention/index" |
+       "/pages/mine/coupons/index" |
        "/pages/mine/homepage/index" |
+       "/pages/mine/points/index" |
        "/pages/mine/setting/index" |
        "/pages/publish/moment/index" |
        "/pages/publish/tags/index" |