feat: 提交页面

src/views/SellerDashboard/BrandProfile/image-clip-dialog.vue

@@ -15,14 +15,19 @@
 			<div class="header" :class="{ 'is-product': data.isProduct }">
 				<div class="title">{{ data.title }}</div>
 				<div class="right flex">
-					<div v-if="coverOrigin.length" class="origin-container flex align-center">
+					<div v-if="coverOrigin.length > 1" class="origin-container flex align-center">
 						<span>Crop from: </span>
 						<div class="origin-select flex align-center">
-							<div class="origin-item sketch" @click="handleChangeOrigin('sketch')">
+							<div
+								class="origin-item sketch"
+								:class="{ selected: currentOrigin === 'sketch' }"
+								@click="handleChangeOrigin('sketch')"
+							>
 								Sketch
 							</div>
 							<div
-								class="origin-item product selected"
+								class="origin-item product"
+								:class="{ selected: currentOrigin === 'mainProducImage' }"
 								@click="handleChangeOrigin('mainProductImage')"
 							>
 								Main product image
@@ -42,7 +47,7 @@
 						ref="imageClipRef"
 						v-bind="$attrs"
 						:ratio="data.ratio"
-						:fixedBox="data.isProduct ? type !== 'apparel' : false"
+						:isProduct="isProduct"
 						:url="data.url"
 						:type="type"
 						@change="(v) => (data.preview_url = v)"
@@ -112,8 +117,11 @@ const data = reactive({
 	callback: null,
 	isProduct: false // 是否商品编辑
 })
+
+const currentOrigin = ref("sketch")
 const coverOrigin = ref([])
 const handleChangeOrigin = (type) => {
+	currentOrigin.value = type
 	data.url = coverOrigin.value.filter((el) => el.type === type)[0].url
 }
 
@@ -132,7 +140,10 @@ const open = (url, callback, options, origin) => {
 		if (options.hasOwnProperty("isPreview")) data.isPreview = options.isPreview
 		data.isProduct = options.isProduct
 	}
-	if (origin) coverOrigin.value = origin
+	if (origin?.length) {
+		coverOrigin.value = origin
+		data.url = origin[0].url
+	}
 	console.log("-------", origin)
 	show.value = true
 }
@@ -303,7 +314,7 @@ defineExpose({
 				}
 				&.is-cover {
 					> .preview-image > img {
-						// width: 29.7rem;
+						width: 29.7rem;
 						height: 37.5rem;
 					}
 				}