huangjinming/CounterFireGames
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改页面

Browse Source
This commit is contained in:
yuyongdong 2024-06-28 19:07:29 +08:00
parent 7883a066b9
commit 492beda405
8 changed files with 114 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/Dialogs/buyDialog.vue
View File

@ -72,8 +72,6 @@ const props = defineProps({
close: Function,
});
console.log(props.buyDataArr);
const totalPrice = computed(() => {
let total = 0n;
props.buyDataArr.forEach((item) => {
@ -90,12 +88,11 @@ const handleOk = (e) => {
const buyConfirm = async () => {
const lists = toRaw(props.buyDataArr);
const ids = lists.map((item) => item.event.data.id);
// console.log(lists, ids)
// return
const bc = new BlockChain()
try {
await bc.market.batchBuy(ids)
console.log('buy success ')
let res = await bc.market.batchBuy(ids)
console.log('buy success ',res,ids)
hideModal({errcode: 0});
} catch (err) {
console.log("buy fail", err.message);

11
src/components/common/searchView/Price.vue
View File

@ -11,24 +11,21 @@
</div>
</template>
<script setup>
import { ref, watch, } from "vue";
import { ref, watch, defineEmits } from "vue";
import { useMarketplaceStore } from "@/store/marketplace"
const marketplaceList = useMarketplaceStore()
const emit = defineEmits(['clickPriceChild'])
const handleChange = (value) => {
// ToDo
optionValue.value = value
console.log(`selected ${optionValue.value} ${value}`);
};
const minPriceValue = ref()
const maxPriceValue = ref()
const priceApply = (e) => {
const priceApply = () => {
marketplaceList.minPrice = minPriceValue.value
marketplaceList.maxPrice = maxPriceValue.value
}
watch(marketplaceList, () => {
minPriceValue.value = marketplaceList.minPrice
maxPriceValue.value = marketplaceList.maxPrice
emit('clickPriceChild',marketplaceList.minPrice,marketplaceList.maxPrice)
});
</script>

2
src/components/common/searchView/gold.vue
View File

@ -17,6 +17,7 @@ import { ref, reactive } from "vue";
import { SettingOutlined } from "@ant-design/icons-vue";
import { useMarketplaceStore } from "@/store/marketplace"
const marketplaceList = useMarketplaceStore()
const emit = defineEmits(['clickGoldChild'])
const goldList = [
{ label: "Gold Card", value: "10017" },
{ label: "Black Gold Card", value: "10018" },
@ -33,6 +34,7 @@ const handleClick = (event) => {
const onChangeValue = (e) => {
// ToDo: 筛选
marketplaceList.gold = e
emit('clickGoldChild', e)
};
</script>

1
src/components/common/searchView/hero.vue
View File

@ -51,7 +51,6 @@ const onChangeValue = (e) => {
// ToDo: 筛选
state.value = e
// marketplaceList.hero = e
console.log(e,state.value)
emit('clickHeroChild',state.value)
};
</script>

13
src/components/common/searchView/rank.vue
View File

@ -12,13 +12,15 @@
import { ref, reactive } from "vue";
import { SettingOutlined } from "@ant-design/icons-vue";
import { useMarketplaceStore } from "@/store/marketplace"
// import { emit } from "process";
const emit = defineEmits(['clickHeroChild'])
const marketplaceList = useMarketplaceStore()
const heroList = [
{ label: "Tier1", value: "Tier1" },
{ label: "Tier2", value: "Tier2" },
{ label: "Tier3", value: "Tier3" },
{ label: "Tier4", value: "Tier4" },
{ label: "Tier5", value: "Tier5" },
{ label: "Tier1", value: "0" },
{ label: "Tier2", value: "1" },
{ label: "Tier3", value: "2" },
{ label: "Tier4", value: "3" },
{ label: "Tier5", value: "4" },
];
const state = reactive({
value: [],
@ -26,6 +28,7 @@ const state = reactive({
const expandIconPosition = ref("end");
const onChange = (e) => {
marketplaceList.rank = e
emit('clickRankChild',e)
}
</script>

102
src/components/marketplace/mktContent.vue
View File

@ -3,11 +3,11 @@
<div class="mkt-content-left">
<OverView :overviewValue="marketplaceList.overview" @clickOverviewChild="overviewChild" />
<Sort />
<Price />
<Price @clickPriceChild="priceChild" />
<h2>Type</h2>
<Hero :heroValue="marketplaceList.hero" @clickHeroChild="heroChild" />
<Rank />
<Gold />
<Rank @clickRankChild="rankChild" />
<Gold @clickGoldChild="goldChild" />
</div>
<div class="mkt-content-right">
<div class="mkt-content-right-header">
@ -44,7 +44,7 @@
<li v-if="marketplaceList.rank.length != undefined && marketplaceList.rank.length > 0">
<span v-if="marketplaceList.rank.length != undefined && marketplaceList.rank.length > 0">Tier: </span>
<span v-for="item in marketplaceList.rank" :key="item">
{{ item }}
{{ searchName(item) }}
<span v-if="marketplaceList.rank.length != index+1">/</span>
</span>
<span v-if="marketplaceList.rank != undefined && marketplaceList.rank.length > 0" @click="clearRankAll">×</span>
@ -73,7 +73,7 @@
</template>
<script setup>
import { ref, reactive, onMounted, onUnmounted, getCurrentInstance } from "vue";
import { ref, reactive, toRaw, onMounted, onUnmounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
import OverView from "@/components/common/searchView/Overview.vue"
import Sort from "@/components/common/searchView/Sort.vue"
@ -88,46 +88,22 @@ import {apiMarketplaceState} from "@/utils/marketplace.js"
import { useMarketplaceStore } from "@/store/marketplace"
const marketplaceList = useMarketplaceStore()
const loadingDialogVisible = ref(false)
const nftList = ref([])
// ref([
// {
// name: '1111',
// id: '1111',
// },
// {
// name: '2222',
// id: '2222',
// },
// {
// name: '3333',
// id: '3333',
// },
// {
// name: '4444',
// id: '4444',
// },
// {
// name: '5555',
// id: '5555',
// },
// {
// name: '6666',
// id: '6666',
// },
// {
// name: '7777',
// id: '7777',
// }
// ])
const filterList = ref([])
const clearOverviewAll = () => {
marketplaceList.overview = ''
toRaw(marketplaceList.getParamsData).search.name = ''
getHeroData()
}
const overviewChild = (val) => {
marketplaceList.overview = val
toRaw(marketplaceList.getParamsData).search.name = val
getHeroData()
}
const clearSortAll = () => {
@ -136,20 +112,47 @@ const clearSortAll = () => {
const clearPriceAll = () => {
marketplaceList.minPrice = ''
marketplaceList.maxPrice = ''
toRaw(marketplaceList.getParamsData).filter.price_min = ''
toRaw(marketplaceList.getParamsData).filter.price_max = ''
getHeroData()
}
const priceChild = (minPrice, maxPrice) => {
toRaw(marketplaceList.getParamsData).filter.price_min = minPrice
toRaw(marketplaceList.getParamsData).filter.price_max = maxPrice
getHeroData()
}
const clearHeroAll = () => {
marketplaceList.hero = []
toRaw(marketplaceList.getParamsData).filter.item_ids = [...marketplaceList.gold,...marketplaceList.hero]
getHeroData()
}
const heroChild = (val) => {
marketplaceList.hero = val
toRaw(marketplaceList.getParamsData).filter.item_ids = [...marketplaceList.gold,...marketplaceList.hero]
getHeroData()
}
const clearRankAll = () => {
marketplaceList.rank = []
toRaw(marketplaceList.getParamsData).filter.hero_ranks = []
getHeroData()
}
const rankChild = (val) => {
marketplaceList.rank = val
toRaw(marketplaceList.getParamsData).filter.hero_ranks = val
getHeroData()
}
const clearGoldAll = () => {
marketplaceList.gold = []
toRaw(marketplaceList.getParamsData).filter.item_ids = [...marketplaceList.gold,...marketplaceList.hero]
getHeroData()
}
const goldChild = (val) => {
marketplaceList.gold = val
toRaw(marketplaceList.getParamsData).filter.item_ids = [...marketplaceList.gold,...marketplaceList.hero]
getHeroData()
}
const searchName = (id) => {
@ -165,33 +168,12 @@ const renewNft = async() => {
}
const getHeroData = async () => {
let data = {
page_size: 20, //TODO:: 根据实际情况修改该值
cursor: '',
search: {
name: '',
},
filter: {
price_min: '',
price_max: '',
item_ids: [],
hero_ranks: []
},
sort: {
fields: [
{
name: '',
type: 0,
}
]
}
}
loadingDialogVisible.value = false;
loadingDialogVisible.value = true;
try {
let res = await marketplaceList.getMarketplaceState(data)
let res = await marketplaceList.getMarketplaceState(marketplaceList.getParamsData)
nftList.value = res.rows
console.log(res,'-----')
// loadingDialogVisible.value = false;
loadingDialogVisible.value = false;
} catch(e) {
// console.log(e)
// loadingDialogVisible.value = false;

30
src/configs/item.json
View File

@ -1,4 +1,34 @@
{
"0": {
"id": 0,
"name": "Tier1",
"type": 31,
"sub_type": 1
},
"1": {
"id": 1,
"name": "Tier2",
"type": 31,
"sub_type": 1
},
"2": {
"id": 2,
"name": "Tier3",
"type": 31,
"sub_type": 1
},
"3": {
"id": 3,
"name": "Tier4",
"type": 31,
"sub_type": 1
},
"4": {
"id": 4,
"name": "Tier5",
"type": 31,
"sub_type": 1
},
"10017": {
"id": 10017,
"name": "Gold card",

26
src/store/marketplace.js
View File

@ -13,6 +13,29 @@ export const useMarketplaceStore = defineStore('marketplace', () => {
const status = ref([])
const getCartList = ref([])
const currencyPrice = ref([])
//TODO:: 根据实际情况修改该值
const getParamsData = ref({
page_size: 20, // 每页大小
cursor: '', // 游标
search: {
name: '', // 名字查询
},
filter: {
price_min: '', // 最低价
price_max: '', // 最高价
item_ids: [], // 道具ID
hero_ranks: [] // 品阶
},
sort: {
fields: [
{
name: '',
type: 0,
}
]
}
})
const updateOverviewStatus = (_connected) => {
overview.value = _connected;
}
@ -59,6 +82,7 @@ export const useMarketplaceStore = defineStore('marketplace', () => {
}
return {
getParamsData,
overview, updateOverviewStatus,
sort, updateSortStatus,
minPrice, updateMinPriceStatus,
@ -71,7 +95,7 @@ export const useMarketplaceStore = defineStore('marketplace', () => {
getCartList, getCartListState,
addCartListState,
delCartListState,
currencyPrice,priceDatas
currencyPrice,priceDatas,
}
},
{