增加操作提示语

This commit is contained in:
yuyongdong 2024-06-29 19:57:34 +08:00
parent ae8ab187e1
commit 8a44e5da5e
12 changed files with 139 additions and 45 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

View File

@ -34,7 +34,7 @@
<div class="id">{{ item.nft.token_id }}</div>
<div class="price">
<!-- <div>{{ priceCalculated(buyDataArr[0].event.data.buy[0].amount) }}</div> -->
<div>{{ priceCalculated(item.amount) }}</div>
<div>{{ priceCalculated(item.event.data.buy[0].amount) }}</div>
<div class="price-img">
<img :src="item.icon" alt />
</div>
@ -59,8 +59,7 @@
</div>
</template>
<script setup>
import {ref, toRaw, defineEmits, computed, getCurrentInstance, inject } from "vue";
const message = inject('$message')
import {ref, toRaw, defineEmits, computed } from "vue";
import { priceCalculated } from "@/configs/priceCalculate"
import { BlockChain } from "@/components/chain/BlockChain"
@ -72,11 +71,11 @@ const props = defineProps({
visible: ref(Boolean),
close: Function,
});
console.log(props.buyDataArr)
const totalPrice = computed(() => {
let total = 0n;
props.buyDataArr.forEach((item) => {
total += item.amount;
total += item.event.data.buy[0].amount;
});
return priceCalculated(total);
});
@ -92,14 +91,12 @@ const buyConfirm = async () => {
const bc = new BlockChain()
try {
let res = await bc.market.batchBuy(ids)
if(res.result) {
message.success('Success! Buy.')
console.log('buy success ',res,ids)
if(res != undefined && res.length > 0) {
hideModal({errcode: 0});
}
} catch (err) {
console.log("buy fail", err.message);
message.error(err.message)
console.log("buy fail", err);
hideModal({errcode: 1,err});
}
};

View File

@ -24,7 +24,7 @@
<div class="content-nfts-top-right-price">
<li>
<div class="price-top-input">
<a-input v-model:value="priceValue" placeholder="Enter Listing Price">
<a-input v-model:value="priceValue" placeholder="Enter Listing Price" @pressEnter="sellConfirm">
</a-input>
</div>
<div class="net-price">
@ -171,6 +171,8 @@ const isPriceListShow = ref(false);
//
const currency = import.meta.env.VUE_APP_MARKET_CURRENCY;
const sellConfirm = async () => {
console.log(message)
return
if (priceValue.value) {
let curDate = new Date();
let orderData = new Date(curDate.getTime() + Number(optionDayValue.value));

View File

@ -10,11 +10,17 @@
<div class="results-total">{{ nftList.length }} Results</div>
</div>
<div class="content-right-content">
<div class="pages-horizontal">
<div class="pages-horizontal" v-show="nftList !== undefined && nftList.length > 0">
<li v-for="(item, index) in nftList" :key="index">
<Card v-if="nftList != undefined || nftList.length > 0" :nftData="item" @renewMyNft="getMyAssets" />
</li>
</div>
<div class="pages-no" v-show="nftList == undefined || nftList.length <= 0">
<div>
<img src="@/assets/img/marketplace/Empty state.png" alt="">
</div>
<p>No NFT yet</p>
</div>
</div>
</div>
</div>
@ -49,8 +55,8 @@ const getMyAssets = async () => {
const myADdress = localWalletStore.address
const data = {
type: statusValue.value,
page_size: '20',
cursor: '',
page_size: '200',
cursor: '0',
search_name: overviewValue.value
}
if(myADdress) {
@ -121,6 +127,29 @@ onMounted(() => {
}
}
}
.pages-no {
position: relative;
margin-top: 256px;
div {
margin: 0 auto;
width: 401px;
height: 322px;
img {
width: 100%;
height: 100%;
}
}
p {
position: absolute;
top: 260px;
left: 52%;
transform: translateX(-50%);
font-family: 'Poppins';
font-weight: bold;
font-size: 40px;
color: #8587B2;
}
}
.pages-vertical {
color: #fff;
}

View File

@ -29,6 +29,7 @@ const statusValue = ref('0')
const overviewChild = (val) => {
overviewValue.value = val
getHistoryList()
}
const statusChild = (val) => {
@ -41,6 +42,7 @@ const getHistoryList = async () => {
type: statusValue.value,
page_size: '20',
cursor: '',
search_name: overviewValue.value,
}
if(myAddress.value) {
let res = await apiHistoryState(myAddress.value,data)

View File

@ -193,15 +193,16 @@ const buyAll = async () => {
const confirmResult = await createModal(BuyDialog, {
buyDataArr: cartList.value,
}).show()
if(confirmResult.errcode) {
if(confirmResult.errcode == 1) {
console.log('buy fail')
message.error('buy fail')
return
}
} else {
getCartList()
message.success('success! Buy')
}
} catch (e) {
message.error(e)
message.error('buy fail')
}
}

View File

@ -191,6 +191,7 @@ export class ImtblMarket {
console.log(
`Fulfilling listings ${fulfillableOrders}, transaction expiry ${expiration}`
);
return fulfillableOrders
} else {
console.log('余额不足')
}

View File

@ -65,17 +65,16 @@ const buyDataArr = ref([])
//
const buyNft = async (val) => {
console.log(val)
return
buyDataArr.value = []
buyDataArr.value.push(val)
const buyResult = await createModal(BuyDialog, {
buyDataArr: buyDataArr.value,
}).show()
if(buyResult.errcode) {
console.log('buy fail')
message.success('buy fail')
return
console.log(buyResult)
if(buyResult.errcode == 0) {
message.success('Success! Buy.')
} else {
message.success('Buy fail.')
}
}
@ -131,18 +130,22 @@ const addCart = async (val) => {
const currentType = val.event?.data?.buy[0].item_type || ''
if (currency != currentCurrency || type != currentType) {
// TODO:
message.error('Please add the same type of item to the shopping cart')
return
}
}
const { errcode, errmsg } = await marketplaceList.addCartListState(data)
console.log(errcode, errmsg)
if(errcode == 0) {
message.success('success! Add from cart')
marketplaceList.getCartList = await marketplaceList.getCartListState()
}
}
} else {
const { errcode, errmsg } = await marketplaceList.addCartListState(data)
console.log(errcode, errmsg)
if(errcode == 0) {
message.success('success! Add from cart')
marketplaceList.getCartList = await marketplaceList.getCartListState()
}
}
} catch (e) {
message.error('fail! Add from cart')
}

View File

@ -15,6 +15,9 @@
<template #default="{ text: event }">
<div class="price">
{{ priceCalculated(event.data.buy[0].amount) }}
<div class="price-icon">
<img src="@/assets/img/marketplace/ETHicon.png" alt="">
</div>
</div>
</template>
</a-table-column>
@ -144,6 +147,15 @@ div {
display: flex;
align-items: center;
justify-content: center;
.price-icon {
width: 39px;
height: 39px;
margin-left: 10px;
img {
width: 100%;
height: 100%;
}
}
}
.event-btn {
width: 348px;

View File

@ -34,10 +34,13 @@ const onChangeValue = (e) => {
color: #bb7fff;
margin-bottom: 10px;
}
:deep(.ant-checkbox-group) {
:deep(.ant-radio-group) {
display: block;
.ant-checkbox-wrapper {
.ant-radio-wrapper {
display: block !important;
span {
color: #BB7FFF;
}
}
.ant-checkbox-group-item {
display: flex !important;

View File

@ -16,10 +16,12 @@
src="../../assets/img/home/gameWeb_p1_slogan.png"
alt="Game Background"
/> -->
<a href="https://mint.counterfire.games/" target="_blank" rel="noopener noreferrer">
<img
src="../../assets/img/home/new-img/gameWeb_p1_slogan.png"
alt="Game Background"
/>
</a>
</div>
<div class="download-buttons">

View File

@ -38,15 +38,15 @@
3购买
4
-->
<div v-if="myAddress != detailData.nft.owner_address && detailData.event">
<div v-if="(myAddress != detailData.nft.owner_address) && detailData.event">
<div class="buy" @click="buyNow">Buy Now</div>
<div class="add" @click="addCart">
<div class="add" v-if="detailData.in_shopcart == 0" @click="addCart">
<span>Add to cart </span>
<div>
<img src="@/assets/img/marketplace/Add shopping cart.png" alt="">
</div>
</div>
<div class="remove" v-if="!myAddress">
<div class="remove" v-if="detailData.in_shopcart == 1" @click="clearCart">
<span>Remove from cart</span>
<div>
<img src="@/assets/img/marketplace/Move out.png" alt="">
@ -81,7 +81,7 @@
</li>
<li>
<div>Metadata</div>
<div><a :href="detailData.meta_url" target="_blank">{{ sliceAddress(detailData.nft.meta_url) }}</a></div>
<div><a :href="detailData.nft.meta_url" target="_blank">{{ sliceAddress(detailData.nft.meta_url) }}</a></div>
</li>
<li>
<div>Royalties</div>
@ -176,7 +176,7 @@ const buyDataArr = ref([])
const buyNow = async () => {
// console.log(toRaw(detailData.value))
// return
debugger
// debugger
buyDataArr.value = []
buyDataArr.value.push(detailData.value)
const buyResult = await createModal(BuyDialog, {
@ -215,6 +215,7 @@ const addCart = async () => {
if(errcode == 0) {
message.success('success! Add from cart')
marketplaceList.getCartList = await marketplaceList.getCartListState()
getDetail()
}
} catch (e) {
message.error('fail! Add from cart')
@ -224,6 +225,25 @@ const addCart = async () => {
//
const clearCart = async () => {
// TODO:
const data = {
net_id: import.meta.env.VUE_APP_NET_ID,
tokens: [
{
token_id: detailData.value.nft.token_id,
contract_address: detailData.value.nft.contract_address,
}
]
}
try {
const { errcode, errmsg } = await marketplaceList.delCartListState(data)
if(errcode == 0) {
message.success('success! Remove from cart')
marketplaceList.getCartList = await marketplaceList.getCartListState()
getDetail()
}
} catch (e) {
console.log(e)
}
}
const lockToGame = async() => {
@ -521,6 +541,27 @@ onMounted(() => {
}
}
}
.remove {
span {
width: 269px;
height: 100%;
line-height: 57px;
border-radius: 12px;
text-align: center;
display: inline-block;
background: #1778f1;
}
div {
width: 76px;
height: 100%;
background: #1778f1;
margin-left: 2px;
img {
width: 43px;
height: 44px;
}
}
}
.sell {
width: 348px;
background: #6336d7;
@ -556,6 +597,7 @@ onMounted(() => {
margin-top: 10px;
a {
color: #B3B5DA;
cursor: pointer;
}
}
}