|
@@ -1,304 +0,0 @@
|
|
|
-<route lang="yaml">
|
|
|
-style:
|
|
|
- navigationBarTitleText: 个人主页
|
|
|
- navigationBarBackgroundColor: '#fff'
|
|
|
-</route>
|
|
|
-
|
|
|
-<script setup lang="ts">
|
|
|
-import {
|
|
|
- vipIcon,
|
|
|
- shareIcon,
|
|
|
- praiseIcon,
|
|
|
- messageIcon,
|
|
|
- yinyongIcon,
|
|
|
- homepageBg,
|
|
|
- videoEyeIcon,
|
|
|
- videoPlayIcon,
|
|
|
-} from '@designer-hub/assets/src/svgs'
|
|
|
-const tab = ref(0)
|
|
|
-const tabs = ref([
|
|
|
- { label: '案例', value: 'integral' },
|
|
|
- { label: '动态', value: 'system' },
|
|
|
- { label: '视频', value: 'interact' },
|
|
|
-])
|
|
|
-</script>
|
|
|
-
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <div class="aspect-[1.13/1] absolute left-0 right-0 top-0">
|
|
|
- <wd-img width="100%" height="100%" :src="homepageBg" custom-class="vertical-top"></wd-img>
|
|
|
- </div>
|
|
|
- <div class="flex flex-col relative mt-[180px]">
|
|
|
- <div class="rounded-2xl flex items-center p-4">
|
|
|
- <div>
|
|
|
- <img class="w-16 h-16 rounded-full" src="https://via.placeholder.com/64x64" />
|
|
|
- </div>
|
|
|
- <div class="flex-1 ml-[11px]">
|
|
|
- <div class="flex flex-col w-[100%]">
|
|
|
- <div class="flex-row flex items-center justify-between w-full">
|
|
|
- <div class="flex-row flex items-center">
|
|
|
- <div class="text-white text-2xl font-normal font-['PingFang_SC'] leading-normal">
|
|
|
- 苏小萌
|
|
|
- </div>
|
|
|
-
|
|
|
- <div
|
|
|
- class="h-4 bg-neutral-100 rounded-[20px] justify-start items-center inline-flex flex-row ml-[9px]"
|
|
|
- >
|
|
|
- <wd-img width="17" height="17" :src="vipIcon"></wd-img>
|
|
|
-
|
|
|
- <div
|
|
|
- class="text-black/40 text-[10px] font-normal font-['PingFang_SC'] px-[7px] leading-none"
|
|
|
- >
|
|
|
- 白银会员
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="mt-[12px] flex items-center">
|
|
|
- <div
|
|
|
- class="text-center text-white text-[10px] font-normal font-['PingFang_SC'] leading-normal"
|
|
|
- >
|
|
|
- 创设空间事务所创始人
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="bg-white rounded-tl-2xl rounded-tr-2xl border-2 pa-[11px]">
|
|
|
- <div class="flex items-center justify-start gap-[6px]">
|
|
|
- <div class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-[26.98px]">
|
|
|
- 10
|
|
|
- </div>
|
|
|
- <div class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-[26.98px]">
|
|
|
- 从业年限
|
|
|
- </div>
|
|
|
- <div style="width: 1px; height: 10px; background-color: black"></div>
|
|
|
- <div class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-[26.98px]">
|
|
|
- 10
|
|
|
- </div>
|
|
|
- <div class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-[26.98px]">
|
|
|
- 客户
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="w-[347px] h-10 text-black/40 text-sm font-normal font-['PingFang_SC'] leading-normal mt-[21px]"
|
|
|
- >
|
|
|
- “设计没有风格,设计是对生活的一种诠释,不是所谓的造型与装饰!”
|
|
|
- </div>
|
|
|
- <div class="mt-[26px]">
|
|
|
- <div
|
|
|
- class="h-7 px-3 py-0.5 bg-[#e6e6e6]/40 rounded-[30px] justify-center items-center gap-2.5 inline-flex"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="text-center text-black/60 text-xs font-normal font-['PingFang_SC'] leading-normal"
|
|
|
- >
|
|
|
- 日本设计游学
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <wd-tabs v-model="tab">
|
|
|
- <block v-for="(item, index) in tabs" :key="item">
|
|
|
- <wd-tab :title="`${item.label}`">
|
|
|
- <view class="content ma-[15px]" v-if="index === 0">
|
|
|
- <div class="bg-white rounded-2xl shadow pa-[15px] mt-[20px] flex-col gap-2 flex">
|
|
|
- <div class="flex items-center justify-between">
|
|
|
- <div class="flex items-center">
|
|
|
- <img
|
|
|
- class="w-[35px] h-[35px] rounded-full"
|
|
|
- src="https://via.placeholder.com/35x35"
|
|
|
- />
|
|
|
- <div
|
|
|
- class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-[10.18px] ml-[11px]"
|
|
|
- >
|
|
|
- 苏小萌
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-[10.18px]"
|
|
|
- >
|
|
|
- 4小时前
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/60 text-sm font-normal font-['PingFang_SC'] leading-normal mr-[15px] mt-[29px]"
|
|
|
- >
|
|
|
- 和周老师在工作碰了环球项目,选了瓷砖款式,后天客户交定金,订单金额初步为 304958
|
|
|
- </div>
|
|
|
- <div class="mt-[15px]">
|
|
|
- <img
|
|
|
- class="w-[319px] h-[194px] rounded-lg"
|
|
|
- src="https://via.placeholder.com/319x194"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black text-lg font-normal font-['PingFang_SC'] leading-[10.18px] mt-[20px]"
|
|
|
- >
|
|
|
- 现代 | 日星花园
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-[10.18px] mt-[18px]"
|
|
|
- >
|
|
|
- 龙湖狮山天街生活广场三期·780 m²·全案定制
|
|
|
- </div>
|
|
|
- <div class="flex items-center justify-between mt-[19px]">
|
|
|
- <div class="flex items-center gap-[8px]">
|
|
|
- <wd-img width="17" height="17" :src="shareIcon"></wd-img>
|
|
|
- <div
|
|
|
- class="text-black/90 text-sm font-normal font-['D-DIN Exp'] leading-snug"
|
|
|
- >
|
|
|
- 232
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="flex items-center gap-[8px]">
|
|
|
- <wd-img width="17" height="17" :src="messageIcon"></wd-img>
|
|
|
- <div
|
|
|
- class="text-black/90 text-sm font-normal font-['D-DIN Exp'] leading-snug"
|
|
|
- >
|
|
|
- 232
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="flex items-center gap-[8px]">
|
|
|
- <wd-img width="17" height="17" :src="praiseIcon"></wd-img>
|
|
|
- <div
|
|
|
- class="text-black/90 text-sm font-normal font-['D-DIN Exp'] leading-snug"
|
|
|
- >
|
|
|
- 232
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-[10.18px]"
|
|
|
- >
|
|
|
- 删除x
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </view>
|
|
|
- <view class="content ma-[15px]" v-if="index === 1">
|
|
|
- <div class="bg-white rounded-2xl shadow pa-[15px] mt-[20px] flex-col gap-2 flex">
|
|
|
- <div class="flex items-center justify-between">
|
|
|
- <div class="flex items-center">
|
|
|
- <img
|
|
|
- class="w-[35px] h-[35px] rounded-full"
|
|
|
- src="https://via.placeholder.com/35x35"
|
|
|
- />
|
|
|
- <div
|
|
|
- class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-[10.18px] ml-[11px]"
|
|
|
- >
|
|
|
- 苏小萌
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="h-4 bg-neutral-100 rounded-[20px] justify-start items-center inline-flex flex-row ml-[9px]"
|
|
|
- >
|
|
|
- <wd-img width="17" height="17" :src="vipIcon"></wd-img>
|
|
|
-
|
|
|
- <div
|
|
|
- class="text-black/40 text-[10px] font-normal font-['PingFang_SC'] px-[7px] leading-none"
|
|
|
- >
|
|
|
- 白银会员
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/40 text-sm font-normal font-['PingFang_SC'] leading-[10.18px]"
|
|
|
- >
|
|
|
- 4小时前
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="mt-[15px]">
|
|
|
- <img
|
|
|
- class="w-[70px] h-[70px] rounded-lg"
|
|
|
- src="https://via.placeholder.com/70x70"
|
|
|
- />
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-[10.18px] mt-[30px]"
|
|
|
- >
|
|
|
- 用心做好设计,为客户创造美好家居环境
|
|
|
- </div>
|
|
|
-
|
|
|
- <div
|
|
|
- class="h-7 py-1.5 rounded-[50px] border border-black/20 justify-start items-center gap-[5px] inline-flex mt-[29px]"
|
|
|
- >
|
|
|
- <wd-img width="17" height="17" :src="yinyongIcon"></wd-img>
|
|
|
-
|
|
|
- <div
|
|
|
- class="text-black/60 text-xs font-normal font-['PingFang_SC'] leading-none"
|
|
|
- >
|
|
|
- 意大利游学设计班
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="flex items-center justify-between mt-[19px]">
|
|
|
- <div class="flex items-center gap-[8px]">
|
|
|
- <wd-img width="17" height="17" :src="shareIcon"></wd-img>
|
|
|
- <div
|
|
|
- class="text-black/90 text-sm font-normal font-['D-DIN Exp'] leading-snug"
|
|
|
- >
|
|
|
- 232
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="flex items-center gap-[8px]">
|
|
|
- <wd-img width="17" height="17" :src="messageIcon"></wd-img>
|
|
|
- <div
|
|
|
- class="text-black/90 text-sm font-normal font-['D-DIN Exp'] leading-snug"
|
|
|
- >
|
|
|
- 232
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="flex items-center gap-[8px]">
|
|
|
- <wd-img width="17" height="17" :src="praiseIcon"></wd-img>
|
|
|
- <div
|
|
|
- class="text-black/90 text-sm font-normal font-['D-DIN Exp'] leading-snug"
|
|
|
- >
|
|
|
- 232
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-[10.18px]"
|
|
|
- >
|
|
|
- 删除x
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </view>
|
|
|
- <view class="content" v-if="index === 2">
|
|
|
- <div class="pa-[15px] mt-[0px] flex-col gap-2">
|
|
|
- <div class="grid-cols-2 gap-2.5 grid">
|
|
|
- <div class="relative">
|
|
|
- <img
|
|
|
- class="w-[168px] h-[220px] rounded-lg"
|
|
|
- src="https://via.placeholder.com/168x220"
|
|
|
- />
|
|
|
- <div style="position: absolute; top: 10px; left: 10px">
|
|
|
- <wd-img width="17" height="17" :src="videoPlayIcon"></wd-img>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- style="position: absolute; right: 10px; bottom: 10px"
|
|
|
- class="flex items-center gap-[2px]"
|
|
|
- >
|
|
|
- <div
|
|
|
- class="text-[#cacaca] text-xs font-normal font-['PingFang_SC'] leading-normal"
|
|
|
- >
|
|
|
- 315
|
|
|
- </div>
|
|
|
- <wd-img width="17" height="17" :src="videoEyeIcon"></wd-img>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </view>
|
|
|
- </wd-tab>
|
|
|
- </block>
|
|
|
- </wd-tabs>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<style scoped lang="scss">
|
|
|
-:deep(.wd-tabs) {
|
|
|
- background: transparent;
|
|
|
-}
|
|
|
-</style>
|