feat(app): 升级 wot-design-uni 并优化个人主页功能

packages/app/package.json

@@ -109,7 +109,7 @@
     "radash": "^12.1.0",
     "vue": "^3.4.21",
     "vue-i18n": "^9.1.9",
-    "wot-design-uni": "^1.2.26",
+    "wot-design-uni": "^1.3.12",
     "z-paging": "^2.7.10"
   },
   "devDependencies": {

packages/app/src/components/bottom-app-bar.vue

@@ -3,7 +3,7 @@ import { getRect, addUnit } from 'wot-design-uni/components/common/util'
 
 const props = defineProps<{
   'safe-area-inset-bottom'?: boolean
-  fixed: boolean
+  fixed?: boolean
   placeholder?: boolean
 }>()
 

packages/app/src/core/themes/default.scss

@@ -4,3 +4,6 @@ page {
 .wd-button {
   line-height: 0;
 }
+.wd-tabs__nav {
+  background-color: transparent !important;
+}

packages/app/src/core/themes/default.ts

@@ -14,4 +14,5 @@ export const defaultThemeVars: ConfigProviderThemeVars = {
   tagRoundRadius: '8rpx',
   colorTheme: 'black',
   // navbarTitleColor: '#fff',
+  tabsNavBg: 'red',
 }

packages/app/src/pages.json

@@ -390,6 +390,14 @@
       }
     },
     {
+      "path": "pages/mine/homepage/edit/index",
+      "type": "page",
+      "style": {
+        "navigationBarTitleText": "编辑",
+        "navigationBarBackgroundColor": "#fff"
+      }
+    },
+    {
       "path": "pages/mine/orders/detail/index",
       "type": "page",
       "style": {

packages/app/src/pages/mine/homepage/edit/index.vue

@@ -0,0 +1,101 @@
+<route lang="json">
+{ "style": { "navigationBarTitleText": "编辑", "navigationBarBackgroundColor": "#fff" } }
+</route>
+<script setup lang="ts">
+import BottomAppBar from '@/components/bottom-app-bar.vue'
+import Card from '@/components/card.vue'
+import SectionHeading from '@/components/section-heading.vue'
+
+const action = ref(`${import.meta.env.VITE_SERVER_BASEURL}/app-api/infra/file/upload`)
+
+const tab = ref()
+const tabs = ref([{ label: '商品优惠券' }, { label: '销售积分券' }])
+const data = ref([{}])
+const handleChange = () => {}
+</script>
+<template>
+  <div class="flex-grow flex flex-col gap-6 px-3.5 py-6">
+    <Card>
+      <div>
+        <SectionHeading title="主页封面图"></SectionHeading>
+        <div
+          class="mt-4.5 mb-2.5 text-black/40 text-xs font-normal font-['PingFang SC'] leading-snug"
+        >
+          用于主页形象封面图，请上传体现个人艺术设计风格的图片，建议竖图尺寸750x1920，也可上传自己的视频介绍
+        </div>
+        <wd-upload
+          :file-list="[]"
+          image-mode="aspectFill"
+          :action="action"
+          @change="handleChange"
+        ></wd-upload>
+      </div>
+    </Card>
+    <Card>
+      <div>
+        <SectionHeading title="分享封面图"></SectionHeading>
+        <div
+          class="mt-4.5 mb-2.5 text-black/40 text-xs font-normal font-['PingFang SC'] leading-snug"
+        >
+          用于分享到微信好友的卡片封面图，尺寸1920x1080；
+        </div>
+        <wd-upload
+          :file-list="[]"
+          image-mode="aspectFill"
+          :action="action"
+          @change="handleChange"
+        ></wd-upload>
+      </div>
+    </Card>
+    <SectionHeading title="个人信息"></SectionHeading>
+    <Card>
+      <div>
+        <SectionHeading title="设计理念" subtitle="请输入设计理念"></SectionHeading>
+        <div
+          class="mt-4.5 mx--3.5 text-black/40 text-xs font-normal font-['PingFang SC'] leading-snug"
+        >
+          <wd-textarea
+            placeholder="例：设计没有风格，设计是对生活的一种诠释，不是所谓的造型与装饰！"
+          />
+        </div>
+        <div class="text-end text-black/40 text-xs font-normal font-['PingFang SC'] leading-snug">
+          0/100
+        </div>
+      </div>
+    </Card>
+    <Card>
+      <div>
+        <SectionHeading title="个人信息" subtitle="请输入关于自己身份体现"></SectionHeading>
+        <div
+          class="mt-4.5 mx--3.5 text-black/40 text-xs font-normal font-['PingFang SC'] leading-snug"
+        >
+          <wd-textarea
+            placeholder="例：中国室内装饰协会会员、 xxx 空间设计事务所创始人、筑巢奖金奖设计师等等"
+          />
+        </div>
+        <div class="text-end text-black/40 text-xs font-normal font-['PingFang SC'] leading-snug">
+          0/100
+        </div>
+      </div>
+    </Card>
+    <Card>
+      <div>
+        <SectionHeading title="设计费"></SectionHeading>
+      </div>
+    </Card>
+    <Card>
+      <div>
+        <SectionHeading title="服务客户数"></SectionHeading>
+      </div>
+    </Card>
+    <Card>
+      <div>
+        <SectionHeading title="从业年限"></SectionHeading>
+      </div>
+    </Card>
+    <!-- <BottomAppBar>
+      
+    </BottomAppBar> -->
+    <div class=""><wd-button block :round="false">保存</wd-button></div>
+  </div>
+</template>

packages/app/src/pages/mine/homepage/index.vue

@@ -13,7 +13,10 @@ import { storeToRefs } from 'pinia'
 import { NetImages } from '../../../core/libs/net-images'
 import PageHelper from '@/components/page-helper.vue'
 import BottomAppBar from '@/components/bottom-app-bar.vue'
+import { useRouter } from '../../../core/utils/router'
+import NavbarEvo from '@/components/navbar-evo.vue'
 
+const router = useRouter()
 const userStore = useUserStore()
 const { userInfo } = storeToRefs(userStore)
 const id = ref()
@@ -56,6 +59,7 @@ defineExpose({
 </script>
 <template>
   <div class="flex-grow flex flex-col">
+    <NavbarEvo transparent></NavbarEvo>
     <div class="relative">
       <wd-img
         width="100%"
@@ -117,7 +121,9 @@ defineExpose({
     <BottomAppBar fixed placeholder>
       <div class="flex gap-7.5">
         <div class="flex-1" v-if="userInfo.userId === Number(id)">
-          <wd-button block :round="false">编辑</wd-button>
+          <wd-button block :round="false" @click="router.push(`/pages/mine/homepage/edit/index`)">
+            编辑
+          </wd-button>
         </div>
         <div class="flex-1" v-if="userInfo.userId === Number(id)">
           <wd-button block :round="false" open-type="share">分享</wd-button>

packages/app/src/types/uni-pages.d.ts

@@ -45,6 +45,7 @@ interface NavigateToOptions {
        "/pages/home/spread/case-shooting/index" |
        "/pages/home/spread/design-awards/index" |
        "/pages/home/spread/wx-agent-operation/index" |
+       "/pages/mine/homepage/edit/index" |
        "/pages/mine/orders/detail/index" |
        "/pages/home/spread/case-shooting/photographer/index" |
        "/pages/mine/authentication/submit/success/index";

pnpm-lock.yaml

@@ -86,8 +86,8 @@ importers:
         specifier: ^9.1.9
         version: 9.14.1(vue@3.4.21(typescript@4.9.5))
       wot-design-uni:
-        specifier: ^1.2.26
+        specifier: ^1.3.12
-        version: 1.3.11(vue@3.4.21(typescript@4.9.5))
+        version: 1.3.12(vue@3.4.21(typescript@4.9.5))
       z-paging:
         specifier: ^2.7.10
         version: 2.7.12
@@ -8659,6 +8659,12 @@ packages:
     peerDependencies:
       vue: '>=3.2.47'
 
+  wot-design-uni@1.3.12:
+    resolution: {integrity: sha512-aF4ReRTqLLQ7/JcQQvBZJBivoprX9xrvI0b+xWakis5xDSF7tfz1ndPSCBgPtPdTzIaEG5RAT18x0ueRSUbixQ==}
+    engines: {HBuilderX: ^3.8.7}
+    peerDependencies:
+      vue: '>=3.2.47'
+
   wrap-ansi@6.2.0:
     resolution: {integrity: sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==}
     engines: {node: '>=8'}
@@ -19787,6 +19793,10 @@ snapshots:
     dependencies:
       vue: 3.4.21(typescript@4.9.5)
 
+  wot-design-uni@1.3.12(vue@3.4.21(typescript@4.9.5)):
+    dependencies:
+      vue: 3.4.21(typescript@4.9.5)
+
   wrap-ansi@6.2.0:
     dependencies:
       ansi-styles: 4.3.0