店铺信息

src/store/seller/index.ts

@@ -5,9 +5,20 @@ import { Https } from '@/tool/https'
 import { ApplyStatus } from "./index.d"
 
 import store from '../index'
+interface DesignerInfo {
+	shopName: string,
+	avatar: string,
+	brandBanner: string,
+	ownerName: string,
+	email: string,
+	mobile: string,
+	socialLinks: string,
+	description: string,
+}
 interface Seller {
 	isSeller: boolean,
 	applyStatus: number,
+	designerInfo: DesignerInfo,
 }
 
 const seller: Module<Seller, RootState> = {
@@ -15,6 +26,16 @@ const seller: Module<Seller, RootState> = {
 	state: {
 		isSeller: false,
 		applyStatus: null,
+		designerInfo: {
+			shopName: "--",
+			avatar: null,
+			brandBanner: null,
+			ownerName: "--",
+			email: "--",
+			mobile: "--",
+			socialLinks: ["--"],
+			description: "--"
+		},
 	},
 	mutations: {
 		set_isSeller(state: Seller, value: boolean) {
@@ -26,13 +47,24 @@ const seller: Module<Seller, RootState> = {
 				state.isSeller = true
 			}
 		},
+		set_designerInfo(state: Seller, value: DesignerInfo) {
+			state.designerInfo = {
+				...value,
+				socialLinks: JSON.parse(value.socialLinks)
+			}
+		},
 	},
 
 	actions: {
 		get_isSeller({ commit }) {
-			// Https.axiosGet(Https.httpUrls.checkSellerDesigner).then(rv => {
+			Https.axiosGet(Https.httpUrls.checkSellerDesigner).then(rv => {
-			// 	commit('set_isSeller', !!rv)
+				commit('set_isSeller', !!rv)
-			// })
+			})
+		},
+		async get_designerInfo({ commit }) {
+			const rv = await Https.axiosGet(Https.httpUrls.getDesignerInfo)
+			commit('set_designerInfo', rv)
+			return rv
 		},
 	}
 }

src/tool/https.js

@@ -477,6 +477,8 @@ export const Https = {
 		checkSellerDesigner: '/seller/designer/check', // 检查卖家是否为设计师
 		getSellerApplyStatus: '/seller/designer/apply/status', // 获取卖家申请状态
 		submitSellerApply: '/seller/designer/apply', // 提交卖家申请
+		getDesignerInfo: '/seller/designer/info', // 获取设计师信息
+		updateDesignerInfo: '/seller/designer/update', // 更新设计师信息
 		getSellerOrderSummary: '/seller/order/summary', // 获取卖家订单数据总览
 		getSellerOrderList: '/seller/order/page', // 获取卖家订单列表
 		getListingPopup: '/seller/listing/popup/check', // 获取是否勾选发布作品提示

src/views/SellerDashboard/BrandProfile/brand-info.vue

@@ -2,20 +2,20 @@
 	<div class="brand-info">
 		<a-form :model="formData" :rules="isEdit ? formRules : {}" layout="vertical" ref="formRef">
 			<div class="form-group">
-				<a-form-item label="Store Name" name="storeName">
+				<a-form-item label="Store Name" name="shopName">
 					<a-input
-						v-model:value="formData.storeName"
+						v-model:value="formData.shopName"
 						placeholder="Enter the store name"
 						:maxlength="80"
 						:readonly="!isEdit"
 					/>
 					<span v-show="isEdit" class="tip-length"
-						>{{ formData.storeName.length }}/80</span
+						>{{ formData.shopName.length }}/80</span
 					>
 				</a-form-item>
-				<a-form-item label="Owner’s Full Name" name="fullName">
+				<a-form-item label="Owner’s Full Name" name="ownerName">
 					<a-input
-						v-model:value="formData.fullName"
+						v-model:value="formData.ownerName"
 						placeholder="Enter store owner's full name"
 						:readonly="!isEdit"
 					/>
@@ -30,10 +30,10 @@
 						:readonly="!isEdit"
 					/>
 				</a-form-item>
-				<a-form-item label="Phone Number" name="phoneNumber">
+				<a-form-item label="Phone Number" name="mobile">
 					<a-input
 						type="tel"
-						v-model:value="formData.phoneNumber"
+						v-model:value="formData.mobile"
 						placeholder="Enter phone number"
 						:readonly="!isEdit"
 					/>
@@ -43,9 +43,9 @@
 				<a-form-item label="Portfoilo/Social Media Links">
 					<a-input
 						placeholder="https://"
-						v-for="(v, i) in formData.links"
+						v-for="(v, i) in formData.socialLinks"
-						:key="v + i"
+						:key="i"
-						v-model:value="formData.links[i]"
+						v-model:value="formData.socialLinks[i]"
 						:readonly="!isEdit"
 					>
 						<template #prefix>Link {{ i + 1 }}</template>
@@ -82,6 +82,9 @@
 <script setup>
 	import { ref, reactive, watch } from "vue"
 	import { useRoute, useRouter } from "vue-router"
+	import { useStore } from "vuex"
+	const store = useStore()
+	const designerInfo = computed(() => store.state.seller.designerInfo)
 	const route = useRoute()
 	const router = useRouter()
 	const props = defineProps({
@@ -91,42 +94,49 @@
 		}
 	})
 	const formRules = {
-		storeName: [{ required: true, message: "Enter the store name" }],
+		shopName: [{ required: true, message: "Enter the store name" }],
-		fullName: [{ required: true, message: "Enter store owner's full name" }],
+		ownerName: [{ required: true, message: "Enter store owner's full name" }],
 		email: [{ required: true, message: "Enter email" }],
-		phoneNumber: [{ required: true, message: "Enter phone number" }],
+		mobile: [{ required: true, message: "Enter phone number" }],
 		description: [{ required: true, message: "Enter store description" }]
 	}
 
 	const formRef = ref(null)
 	const formData = reactive({
-		storeName: "",
+		shopName: "",
-		fullName: "",
+		ownerName: "",
 		email: "",
-		phoneNumber: "",
+		mobile: "",
 		description: "",
-		links: ["", ""]
+		socialLinks: ["", ""]
 	})
 	const newLink = ref("")
 	const addLink = () => {
-		formData.links.push(newLink.value)
+		formData.socialLinks.push(newLink.value)
 		newLink.value = ""
 	}
+	watch(
+		() => designerInfo.value,
+		(v) => updateFormData()
+	)
+	const updateFormData = () => {
+		formData.shopName = designerInfo.value.shopName
+		formData.ownerName = designerInfo.value.ownerName
+		formData.email = designerInfo.value.email
+		formData.mobile = designerInfo.value.mobile
+		formData.description = designerInfo.value.description
+		formData.socialLinks = JSON.parse(JSON.stringify(designerInfo.value.socialLinks))
+	}
+	updateFormData()
+
 	watch(
 		() => props.isEdit,
 		(v) => (v ? edit() : cancel())
 	)
-	const edit = () => {
+	const edit = () => {}
-		formData.storeName = "测试"
-		formData.fullName = "测试"
-		formData.email = "测试"
-		formData.phoneNumber = "测试"
-		formData.description = "测试"
-		formData.links = ["https://www.baidu.com", "https://www.taobao.com"]
-	}
 	const cancel = () => {
 		formRef.value.clearValidate()
-		edit()
+		updateFormData()
 	}
 	const submit = async () => {
 		await formRef.value.validate()

src/views/SellerDashboard/BrandProfile/index.vue

@@ -41,11 +41,15 @@
 </template>
 
 <script setup>
-	import { ref } from "vue"
+	import { Https } from "@/tool/https"
+	import { ref, computed } from "vue"
 	import BrandInfo from "./brand-info.vue"
 	import ImageClipDialog from "./image-clip-dialog.vue"
-	const banner = ref("")
+	import { useStore } from "vuex"
-	const avatar = ref("")
+	const store = useStore()
+	const designerInfo = computed(() => store.state.seller.designerInfo)
+	const avatar = computed(() => designerInfo.value.avatar)
+	const banner = computed(() => designerInfo.value.brandBanner)
 	const isEdit = ref(false)
 	const brandInfoRef = ref(null)
 	const imageClipDialogRef = ref(null)
@@ -70,7 +74,8 @@
 			imageClipDialogRef.value.open(
 				url,
 				(file) => {
-					banner.value = URL.createObjectURL(file)
+					// banner.value = URL.createObjectURL(file)
+					console.log(URL.createObjectURL(file))
 				},
 				{ ratio: [40, 7], isPreview: false, title: "Crop Brand Banner" }
 			)
@@ -81,7 +86,8 @@
 			imageClipDialogRef.value.open(
 				url,
 				(file) => {
-					avatar.value = URL.createObjectURL(file)
+					// avatar.value = URL.createObjectURL(file)
+					console.log(URL.createObjectURL(file))
 				},
 				{ ratio: [1, 1], isPreview: true, title: "Crop Avatar" }
 			)
@@ -93,14 +99,17 @@
 	const onCancel = () => {
 		isEdit.value = false
 	}
-	const onSubmit = () => {
+	const onSubmit = async () => {
-		brandInfoRef.value
+		const res = await brandInfoRef.value.submit()
-			.submit()
+		const data = {
-			.then((res) => {
+			...designerInfo.value,
-				console.log(res)
+			...res,
-				isEdit.value = false
+			socialLinks: JSON.stringify(res.socialLinks)
-			})
+		}
-			.catch(() => {})
+		Https.axiosPut(Https.httpUrls.updateDesignerInfo, data).then((res) => {
+			isEdit.value = false
+			store.commit("seller/set_designerInfo", data)
+		})
 	}
 </script>
 <style scoped lang="less">

src/views/SellerDashboard/index.vue

@@ -19,10 +19,13 @@
 
 <script setup>
 	import { Https } from "@/tool/https"
-	import { ref, computed,onMounted,onUnmounted } from "vue"
+	import { ref, computed, onMounted, onUnmounted } from "vue"
 	import { useRoute, useRouter } from "vue-router"
 	import toolTipBox from "./toolTipBox.vue"
 	import myEvent from "@/tool/myEvents.js"
+	import { useStore } from "vuex"
+	const store = useStore()
+	store.dispatch("seller/get_designerInfo")
 	const route = useRoute()
 	const router = useRouter()
 	const visible = ref(false)
@@ -53,13 +56,13 @@
 		if (path === activePath.value) return
 		router.push(path)
 	}
-	onMounted(()=>{
+	onMounted(() => {
-		myEvent.add('newListing',()=>{
+		myEvent.add("newListing", () => {
 			visible.value = true
 		})
 	})
-	onUnmounted(()=>{
+	onUnmounted(() => {
-		myEvent.remove('newListing')
+		myEvent.remove("newListing")
 	})
 </script>
 <style scoped lang="less">