From bde48be8af5a6191e3c0f31c42afadfe75e2fd77 Mon Sep 17 00:00:00 2001 From: "Ng Wing Tat, David" Date: Mon, 25 Nov 2024 23:36:57 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=90=9B=20Fix=20gifting=20edition=20se?= =?UTF-8?q?lection?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/NFTBook/GiftDialog.vue | 4 +- src/components/NFTEditionSelect.vue | 8 +++- src/pages/nft/class/_classId/index.vue | 39 ++++++++++--------- .../nft/collection/_collectionId/index.vue | 4 +- 4 files changed, 31 insertions(+), 24 deletions(-) diff --git a/src/components/NFTBook/GiftDialog.vue b/src/components/NFTBook/GiftDialog.vue index 7c134f86f..c2650cfb2 100644 --- a/src/components/NFTBook/GiftDialog.vue +++ b/src/components/NFTBook/GiftDialog.vue @@ -154,6 +154,9 @@ export default { }; }, watch: { + value() { + this.selectedValue = this.value; + }, prefillGiftInfo: { handler(newVal) { this.fromName = newVal.fromName; @@ -179,7 +182,6 @@ export default { if (this.selectedValue === value) return; this.selectedValue = value; this.$emit('change', value); - this.$emit('update:value', value); }, }, }; diff --git a/src/components/NFTEditionSelect.vue b/src/components/NFTEditionSelect.vue index 9478e9680..7abd4262c 100644 --- a/src/components/NFTEditionSelect.vue +++ b/src/components/NFTEditionSelect.vue @@ -109,9 +109,14 @@ export default { return this.selectedItem?.priceLabel; }, }, + watch: { + value() { + this.selectedValue = this.value; + }, + }, mounted() { if (this.selectedValue !== this.value) { - this.$emit('update:value', this.selectedValue); + this.$emit('change', this.selectedValue); } }, methods: { @@ -119,7 +124,6 @@ export default { if (this.selectedValue === value) return; this.selectedValue = value; this.$emit('change', value); - this.$emit('update:value', value); this.$emit('reset-custom-price'); }, handleClickGiftButton() { diff --git a/src/pages/nft/class/_classId/index.vue b/src/pages/nft/class/_classId/index.vue index c97df56f9..4fd640376 100644 --- a/src/pages/nft/class/_classId/index.vue +++ b/src/pages/nft/class/_classId/index.vue @@ -59,7 +59,7 @@ class="w-full !h-[32px] !rounded-[10px] border-[#EBEBEB]" size="tiny" :is-disabled="isAllSoldOut" - @click="handleGiftFromEditionSelector" + @click="handleGiftButtonClick" >

Date: Tue, 26 Nov 2024 12:25:48 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=A5=85=20Disable=20gifting=20for=20ph?= =?UTF-8?q?ysical=20book?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/NFTBook/GiftDialog.vue | 36 +++++++++++++++-------- src/components/NFTEditionSelect.vue | 7 ++--- src/components/NFTEditionSelectItemV2.vue | 14 ++++++++- src/pages/nft/class/_classId/index.vue | 21 ++++++++++--- 4 files changed, 56 insertions(+), 22 deletions(-) diff --git a/src/components/NFTBook/GiftDialog.vue b/src/components/NFTBook/GiftDialog.vue index c2650cfb2..efa1532d0 100644 --- a/src/components/NFTBook/GiftDialog.vue +++ b/src/components/NFTBook/GiftDialog.vue @@ -25,6 +25,7 @@ :stock="item.stock" :is-selected="item.value === selectedValue" :current-price="item.price" + :is-disabled="item.isPhysicalOnly" :default-price="item.defaultPrice" preset="dialog" @click="handleClickPriceSelectItem(item)" @@ -136,26 +137,35 @@ export default { }, }, data() { - // NOTE: If the selected item is out of stock, select another item. - let selectedItem = this.items.find(item => item.value === this.value); - if (!selectedItem || selectedItem.stock <= 0) { - selectedItem = this.items.find( - item => - selectedItem && item.index !== selectedItem.index && item.stock > 0 - ); - } - return { fromName: this.prefillGiftInfo?.fromName, toName: this.prefillGiftInfo?.toName, toEmail: this.prefillGiftInfo?.toEmail, message: this.prefillGiftInfo?.message, - selectedValue: selectedItem?.value || this.value, + selectedValue: this.value, }; }, watch: { - value() { - this.selectedValue = this.value; + open(open) { + if (open) { + // NOTE: If the selected item is out of stock or is physical only, select another item. + let selectedItem = this.items.find(item => item.value === this.value); + if ( + !selectedItem || + selectedItem.stock <= 0 || + selectedItem.isPhysicalOnly + ) { + selectedItem = this.items.find( + item => + item.index !== selectedItem.index && + !item.isPhysicalOnly && + item.stock > 0 + ); + this.selectedValue = selectedItem?.value ?? this.value; + } else { + this.selectedValue = this.value; + } + } }, prefillGiftInfo: { handler(newVal) { @@ -170,6 +180,7 @@ export default { methods: { submitGiftInfo() { this.$emit('submit', { + selectedValue: this.selectedValue, giftInfo: { fromName: this.fromName, toName: this.toName, @@ -181,7 +192,6 @@ export default { handleClickPriceSelectItem({ value }) { if (this.selectedValue === value) return; this.selectedValue = value; - this.$emit('change', value); }, }, }; diff --git a/src/components/NFTEditionSelect.vue b/src/components/NFTEditionSelect.vue index 7abd4262c..7eb69864e 100644 --- a/src/components/NFTEditionSelect.vue +++ b/src/components/NFTEditionSelect.vue @@ -86,16 +86,15 @@ export default { }, data() { // NOTE: If the selected item is out of stock, select another item. - const items = [...this.items]; - let selectedItem = items.find(item => item.value === this.value); + let selectedItem = this.items.find(item => item.value === this.value); if (!selectedItem || selectedItem.stock <= 0) { - selectedItem = items.find( + selectedItem = this.items.find( item => selectedItem && item.index !== selectedItem.index && item.stock > 0 ); } return { - selectedValue: selectedItem?.value || this.value, + selectedValue: selectedItem?.value ?? this.value, }; }, computed: { diff --git a/src/components/NFTEditionSelectItemV2.vue b/src/components/NFTEditionSelectItemV2.vue index e8c0c0ea0..e99b64517 100644 --- a/src/components/NFTEditionSelectItemV2.vue +++ b/src/components/NFTEditionSelectItemV2.vue @@ -14,8 +14,9 @@ : 'ring-[1px] ring-shade-gray hover:ring-[#d1d1d1] transition-all duration-75', 'flex items-center justify-between gap-[16px]', 'min-h-[82px]', + { 'pointer-events-none opacity-50': isDisabled }, ]" - @click="$emit('click', $event)" + @click="handleClick" >

@@ -97,6 +98,10 @@ export default { type: String, default: PRESET_TYPE.PRIMARY, }, + isDisabled: { + type: Boolean, + default: false, + }, }, computed: { isInStock() { @@ -147,5 +152,12 @@ export default { }; }, }, + methods: { + handleClick(event) { + if (!this.isDisabled) { + this.$emit('click', event); + } + }, + }, }; diff --git a/src/pages/nft/class/_classId/index.vue b/src/pages/nft/class/_classId/index.vue index 4fd640376..4787bfee0 100644 --- a/src/pages/nft/class/_classId/index.vue +++ b/src/pages/nft/class/_classId/index.vue @@ -56,9 +56,15 @@
@@ -1005,6 +1011,13 @@ export default { item => item.stock === 0 || item.priceLabel === undefined ); }, + isGiftingDisabled() { + return ( + this.isAllSoldOut || + this.nftEditions.find(item => item.value === this.selectedValue) + ?.isPhysicalOnly + ); + }, compareButtonText() { return this.$t( this.nftEditions?.length === 1 @@ -1469,7 +1482,7 @@ export default { ); this.checkTippingAvailability(selectedValue); }, - async handleGiftSubmit({ giftInfo }) { + async handleGiftSubmit({ giftInfo, selectedValue }) { logTrackerEvent( this, 'NFT', @@ -1477,7 +1490,7 @@ export default { this.classId, 1 ); - await this.handleCollectFromEdition(this.selectedValue, giftInfo); + await this.handleCollectFromEdition(selectedValue, giftInfo); this.isGiftDialogOpen = false; }, handleGiftButtonClick() {