媒体报道&联系我们

src/pages/my-account/account-info.vue

@@ -48,7 +48,7 @@
 			icon: 'icon-address'
 		},
 		{
-			path: '/my-account/methods',
+			path: '/my-account/payment-methods',
 			label: 'Payment methods',
 			icon: 'icon-duidiaojiaohuanduihuan'
 		},

src/pages/my-account/address.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="address">
+		<div class="tip">The following addresses will be used on the checkout page by default.</div>
+		<h2>Billing address</h2>
+		<div class="header">
+			<router-link to="/my-account/edit-address">Edit Billing address</router-link>
+		</div>
+	</div>
+</template>
+<script setup lang="ts">
+	import { computed, ref } from 'vue'
+	import tipBox from './tip-box.vue'
+</script>
+
+<style scoped lang="less">
+	.address {
+		width: 100%;
+		> .tip {
+			margin-bottom: 20px;
+		}
+		> h2 {
+			text-transform: uppercase;
+			margin-bottom: 10px;
+		}
+		> .header {
+			text-transform: uppercase;
+			border-bottom: 1px solid #e1e1e1;
+			height: 18px;
+			> a {
+				color: #222;
+				font-size: 14px;
+				text-decoration: none;
+				float: right;
+			}
+		}
+	}
+</style>

src/pages/my-account/payment-methods.vue

@@ -0,0 +1,28 @@
+<template>
+	<div class="payment-methods">
+		<tip-box type="warning" title="No saved methods found." :is-show-link="false" />
+		<router-link to="#">
+			<button custom>Add payment method</button>
+		</router-link>
+	</div>
+</template>
+<script setup lang="ts">
+	import { computed, ref } from 'vue'
+	import tipBox from './tip-box.vue'
+</script>
+
+<style scoped lang="less">
+	.payment-methods {
+		width: 100%;
+		> a {
+			display: block;
+			margin-top: 22px;
+			width: auto;
+			> button {
+				width: auto;
+				padding: 0 30px;
+				text-transform: uppercase;
+			}
+		}
+	}
+</style>