aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

111

Browse Source
This commit is contained in:
李志鹏
2026-04-08 15:19:21 +08:00
parent fe93b375c4
commit dbb9d5f3bc
12 changed files with 271 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/assets/icons/seller/arrow_right_solid.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="10" height="11" viewBox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9 4.46552C9.66667 4.85042 9.66667 5.81267 9 6.19757L1.5 10.5277C0.833332 10.9126 -1.90735e-06 10.4315 -1.90735e-06 9.66167V1.00142C-1.90735e-06 0.231615 0.833331 -0.24951 1.5 0.13539L9 4.46552Z" fill="#999999"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 325 B

3
src/assets/icons/seller/back.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="12" height="24" viewBox="0 0 12 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.3489 24C10.2173 24.0008 10.0869 23.9755 9.96503 23.9258C9.84319 23.876 9.73238 23.8027 9.63894 23.71L1.46894 15.54C1.00331 15.0755 0.633877 14.5238 0.381813 13.9163C0.129748 13.3089 0 12.6577 0 12C0 11.3423 0.129748 10.6911 0.381813 10.0837C0.633877 9.47621 1.00331 8.92446 1.46894 8.46L9.63894 0.290002C9.73218 0.196764 9.84287 0.122803 9.96469 0.0723426C10.0865 0.0218822 10.2171 -0.00408935 10.3489 -0.00408936C10.4808 -0.00408936 10.6114 0.0218822 10.7332 0.0723426C10.855 0.122803 10.9657 0.196764 11.0589 0.290002C11.1522 0.383241 11.2261 0.493931 11.2766 0.615753C11.3271 0.737575 11.353 0.868143 11.353 1C11.353 1.13186 11.3271 1.26243 11.2766 1.38425C11.2261 1.50607 11.1522 1.61676 11.0589 1.71L2.88894 9.88C2.32714 10.4425 2.01158 11.205 2.01158 12C2.01158 12.795 2.32714 13.5575 2.88894 14.12L11.0589 22.29C11.1527 22.383 11.2271 22.4936 11.2778 22.6154C11.3286 22.7373 11.3547 22.868 11.3547 23C11.3547 23.132 11.3286 23.2627 11.2778 23.3846C11.2271 23.5064 11.1527 23.617 11.0589 23.71C10.9655 23.8027 10.8547 23.876 10.7328 23.9258C10.611 23.9755 10.4805 24.0008 10.3489 24Z" fill="black"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/assets/images/seller/success-0.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
src/assets/images/seller/success-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

2
src/lang/cn.ts
View File

@@ -24,6 +24,8 @@ export default {
SubscribeNow: '立即订阅',
TaskList: '任务列表',
ViewOrders: '查询订单',
BecomeSeller: '成为卖家',
SellerDashboard: '卖家中心',
toolsToProduct: '转产品图',
toolsRelight: '产品图编辑',
toolsToTransferPose: '产品图视频',

2
src/lang/en.ts
View File

@@ -24,6 +24,8 @@ export default {
SubscribeNow: 'Subscribe now',
TaskList: 'Task List',
ViewOrders: 'View Orders',
BecomeSeller: 'Become a Seller',
SellerDashboard: 'Seller Dashboard',
toolsToProduct: 'To product image',
toolsRelight: 'Edit product image',
toolsToTransferPose: 'To product video',

2
src/router/index.ts
View File

@@ -174,7 +174,7 @@ const routes: Array<RouteRecordRaw> = [
path: "becomeSeller",
name: "becomeSeller",
meta: { enter: "all" },
component: () => import("@/views/SellerDashboard/becomeSeller.vue"),
component: () => import("@/views/SellerDashboard/BecomeSeller/index.vue"),
},
{
path: "seller",

4
src/views/HomeMain.vue
View File

@@ -375,11 +375,11 @@
</div>
<div class="select_item" @click="onBecomeSeller">
<span class="icon"><svg-icon name="seller-sellerIndex" /></span>
<span class="select_item_des">Become a Seller</span>
<span class="select_item_des">{{ $t('Header.BecomeSeller') }}</span>
</div>
<div class="select_item" @click="onSellerDashboard">
<span class="icon"><svg-icon name="seller-sellerIndex" /></span>
<span class="select_item_des">Seller Dashboard</span>
<span class="select_item_des">{{ $t('Header.SellerDashboard') }}</span>
<a-badge :dot="true"></a-badge>
</div>
<router-link

37
src/views/SellerDashboard/BecomeSeller/index.vue Normal file
View File

@@ -0,0 +1,37 @@
<template>
<div class="become-seller">
<seller-header
title="Apply to Become a Seller"
tip="Join the Stylish Parade and start selling your design work"
/>
<div class="content">
<sellerReview v-if="isSubmit"></sellerReview>
<sellerReview v-else></sellerReview>
</div>
</div>
</template>
<script setup>
import { ref, computed } from "vue"
import sellerHeader from "../seller-header.vue"
import sellerReview from "./sellerReview.vue"
import { useRoute, useRouter } from "vue-router"
const route = useRoute()
const router = useRouter()
const isSubmit = ref(false)
</script>
<style scoped lang="less">
.become-seller {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
display: flex;
flex-direction: column;
> .content {
margin-top: 4rem;
flex: 1;
overflow: hidden;
}
}
</style>

126
src/views/SellerDashboard/BecomeSeller/sellerReview.vue Normal file
View File

@@ -0,0 +1,126 @@
<template>
<div class="seller-review">
<img class="success" src="@/assets/images/seller/success-1.png" />
<div class="title">Application Submitted</div>
<div class="tip">
Our team will review your application and get back to you within 1–3 business days.
You'll receive a notification in your email once a decision has been made.
</div>
<div class="step-list">
<div v-for="v in list" :key="v.title" class="step-item">
<img v-show="!v.active" src="@/assets/images/seller/success-0.png" />
<img v-show="v.active" src="@/assets/images/seller/success-1.png" />
<div class="content">
<div class="title">{{ v.title }}</div>
<div class="tip">{{ v.tip }}</div>
</div>
</div>
</div>
<button class="home-btn" @click="onBackToHome">Back to Homepage</button>
</div>
</template>
<script setup>
import { ref, computed } from "vue"
import { useRoute, useRouter } from "vue-router"
const route = useRoute()
const router = useRouter()
const list = ref([
{
title: "Step 1: Submit Application",
tip: "Fill out the seller information form and agree to our terms",
active: true
},
{
title: "Step 2: Review & Verification",
tip: "Our team will review your application (typically 1-3 business days)",
active: false
},
{
title: "Step 3: Start Selling",
tip: "Once approved, access your seller dashboard and start listing products ",
active: false
}
])
const onBackToHome = () => {
router.push({ name: "home" })
}
</script>
<style scoped lang="less">
.seller-review {
margin: 0 auto;
width: 60rem;
height: 90%;
overflow-y: auto;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 2.4rem;
> .success {
width: 10rem;
height: 10rem;
padding: 1.2rem;
}
> .title {
font-size: 2.2rem;
line-height: 130%;
text-align: center;
color: #000;
}
> .tip {
font-family: pingfang_medium;
font-size: 1.8rem;
line-height: 170%;
text-align: center;
color: #585858;
}
> .step-list {
margin: 2.6rem 0;
width: 100%;
padding: 1.6rem;
background-color: #f9f9f9;
display: flex;
flex-direction: column;
gap: 1.4rem;
border-radius: 1.2rem;
> .step-item {
display: flex;
> img {
width: 2rem;
height: 2rem;
margin: 0.2rem;
margin-right: 1.2rem;
}
> .content {
flex: 1;
font-size: 1.4rem;
> .title {
font-style: Bold;
color: #000;
line-height: 150%;
}
> .tip {
font-family: "pingfang_medium";
line-height: 170%;
color: #737373;
}
}
}
}
> .home-btn {
width: 31rem;
height: 6rem;
border-radius: 4rem;
font-size: 1.6rem;
color: #fff;
background-color: #000;
border: none;
cursor: pointer;
outline: none;
&:active {
opacity: 0.8;
}
}
}
</style>

22
src/views/SellerDashboard/becomeSeller.vue
View File

@@ -1,22 +0,0 @@
<template>
<div class="become-seller"></div>
</template>
<script setup>
import { ref, computed } from "vue"
import { useRoute, useRouter } from "vue-router"
const route = useRoute()
const router = useRouter()
const activePath = computed(() => route.path)
</script>
<style scoped lang="less">
.become-seller {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
display: flex;
flex-direction: column;
}
</style>

95
src/views/SellerDashboard/seller-header.vue Normal file
View File

@@ -0,0 +1,95 @@
<template>
<div class="seller-header">
<div class="back" @click="() => router.back()">
<svg-icon name="seller-back" size="24" />
</div>
<div class="content">
<span class="title" v-show="title">{{ title }}</span>
<span class="tip" v-show="tip">{{ tip }}</span>
<div class="breadcrumbs" v-show="breadcrumbs.length > 0">
<template v-for="(v, i) in breadcrumbs" :key="i">
<span
class="title"
:class="{
last: i === breadcrumbs.length - 1
}"
@click="() => router.push({ name: v.name })"
>{{ v.title }}</span
>
<span class="icon" v-show="i < breadcrumbs.length - 1">
<svg-icon name="seller-arrow_right_solid" size="10" />
</span>
</template>
</div>
</div>
<div class="right">
<slot name="right"></slot>
</div>
</div>
</template>
<script setup>
import { ref, computed } from "vue"
import { useRoute, useRouter } from "vue-router"
const props = defineProps({
title: {
type: String,
default: ""
},
tip: {
type: String,
default: ""
},
breadcrumbs: {
type: Array, // { title: string, name: string }
default: () => []
}
})
const route = useRoute()
const router = useRouter()
</script>
<style scoped lang="less">
.seller-header {
width: 100%;
display: flex;
align-items: center;
gap: 2.4rem;
> .back {
width: 5rem;
height: 5rem;
border-radius: 1.2rem;
border: 1px solid #d7d7d7;
cursor: pointer;
}
> .content {
flex: 1;
display: flex;
flex-direction: column;
> .title {
line-height: 130%;
font-size: 2.4rem;
color: #000;
}
> .tip {
font-family: "pingfang_medium";
font-size: 1.4rem;
line-height: 150%;
color: #888;
}
> .breadcrumbs {
display: flex;
align-items: center;
gap: 1rem;
> .title {
font-family: "pingfang_regular";
color: #999;
font-size: 1.4rem;
cursor: pointer;
&:not(.last) {
text-decoration: underline;
}
}
}
}
}
</style>