|
|
@@ -3,8 +3,12 @@
|
|
|
<van-sticky>
|
|
|
<div class="padding-safe-top">
|
|
|
<div class="page_top_one">
|
|
|
- <img :src="require('../../assets/icon-back@3x.png')" alt="" class="page_top_one_img"
|
|
|
- @click="$router.go(-1)" />
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/icon-back@3x.png')"
|
|
|
+ alt=""
|
|
|
+ class="page_top_one_img"
|
|
|
+ @click="$router.go(-1)"
|
|
|
+ />
|
|
|
RID元域名买卖市场
|
|
|
</div>
|
|
|
<!-- <div class="page_top_two">
|
|
|
@@ -33,11 +37,17 @@
|
|
|
>
|
|
|
</van-tab>
|
|
|
</van-tabs> -->
|
|
|
- <van-field v-model="value" :clearable="false" enterkeyhint="search" ref="fieldRef"
|
|
|
- :left-icon="require('@assets/icon_sosuo@3x.png')" placeholder="搜索该类目下的元域名" extra @keyup="onInput">
|
|
|
- <template #extra>
|
|
|
- <div class="flex_text">.nft</div>
|
|
|
- </template>>
|
|
|
+ <van-field
|
|
|
+ v-model="value"
|
|
|
+ :clearable="false"
|
|
|
+ enterkeyhint="search"
|
|
|
+ ref="fieldRef"
|
|
|
+ :left-icon="require('@assets/icon_sosuo@3x.png')"
|
|
|
+ placeholder="搜索该类目下的元域名"
|
|
|
+ extra
|
|
|
+ @keyup="onInput"
|
|
|
+ >
|
|
|
+ <template #extra> <div class="flex_text">.nft</div> </template>>
|
|
|
</van-field>
|
|
|
<div class="page_top_three_btn" @click="screening">
|
|
|
<div class="page_top_three_btn_con">筛选</div>
|
|
|
@@ -55,20 +65,41 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</van-sticky>
|
|
|
- <van-pull-refresh v-if="domainList.length == 0" success-text="加载成功" success-duration="500" class="search"
|
|
|
- v-model="isLoading" :head-height="80" @refresh="onRefresh">
|
|
|
- <van-list style="padding-bottom: 100px" class="box-list" v-model:loading="loading" :finished="finished"
|
|
|
- finished-text="" @load="getList">
|
|
|
+ <van-pull-refresh
|
|
|
+ v-if="domainList.length == 0"
|
|
|
+ success-text="加载成功"
|
|
|
+ success-duration="500"
|
|
|
+ class="search"
|
|
|
+ v-model="isLoading"
|
|
|
+ :head-height="80"
|
|
|
+ @refresh="onRefresh"
|
|
|
+ >
|
|
|
+ <van-list
|
|
|
+ style="padding-bottom: 100px"
|
|
|
+ class="box-list"
|
|
|
+ v-model:loading="loading"
|
|
|
+ :finished="finished"
|
|
|
+ finished-text=""
|
|
|
+ @load="getList"
|
|
|
+ >
|
|
|
<template v-for="(item, index) in list" :key="item.id">
|
|
|
<product-info v-model:info="list[index]" domain></product-info>
|
|
|
</template>
|
|
|
- <van-empty :image="require('@assets/empty_img_asset_dark.png')" v-if="empty" description="没有任何藏品哦~" />
|
|
|
+ <van-empty
|
|
|
+ :image="require('@assets/empty_img_asset_dark.png')"
|
|
|
+ v-if="empty"
|
|
|
+ description="没有任何藏品哦~"
|
|
|
+ />
|
|
|
</van-list>
|
|
|
</van-pull-refresh>
|
|
|
<div class="meta_domain_name_list" v-else>
|
|
|
<div class="meta_domain_name_list_con" v-for="(item, index) in domainList" :key="item.id">
|
|
|
<div class="meta_domain_name_list_con_left">
|
|
|
- <img :src="item.sold ? registered : unregistered" alt="" class="meta_domain_name_list_con_left_img" />
|
|
|
+ <img
|
|
|
+ :src="item.sold ? registered : unregistered"
|
|
|
+ alt=""
|
|
|
+ class="meta_domain_name_list_con_left_img"
|
|
|
+ />
|
|
|
<div>
|
|
|
<div class="meta_domain_name_list_con_left_one">{{ item.domain }}</div>
|
|
|
<div class="meta_domain_name_list_con_left_con">
|
|
|
@@ -81,9 +112,11 @@
|
|
|
</div>
|
|
|
<div class="meta_domain_name_list_con_right" @click="buy(index)">
|
|
|
<div class="meta_domain_name_list_con_right_one">{{ item.sold ? '超链' : '购买' }}</div>
|
|
|
- <div :class="
|
|
|
- item.sold ? 'meta_domain_name_list_con_right_three' : 'meta_domain_name_list_con_right_two'
|
|
|
- "></div>
|
|
|
+ <div
|
|
|
+ :class="
|
|
|
+ item.sold ? 'meta_domain_name_list_con_right_three' : 'meta_domain_name_list_con_right_two'
|
|
|
+ "
|
|
|
+ ></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -92,41 +125,77 @@
|
|
|
<div class="select-right padding-safe-top">
|
|
|
<div class="select-right_classification">
|
|
|
<div class="select-right_classification_title">
|
|
|
- <img :src="require('../../assets/png-mingcheng@3x.png')" alt=""
|
|
|
- class="select-right_classification_title_img" />
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/png-mingcheng@3x.png')"
|
|
|
+ alt=""
|
|
|
+ class="select-right_classification_title_img"
|
|
|
+ />
|
|
|
<div class="select-right_classification_title_text">元域名分类</div>
|
|
|
</div>
|
|
|
<div class="select-right_classification_list">
|
|
|
- <div v-for="(item, index) in domainNameList" :key="index"
|
|
|
- class="select-right_classification_list_con" @click="domainNameType = item.type"
|
|
|
- :class="domainNameType === item.type ? 'select-right_classification_list_cons' : ''">
|
|
|
- <img :src="require('../../assets/png-da-zi@3x.png')" alt=""
|
|
|
- class="select-right_classification_list_con_img" />
|
|
|
- <div class="select-right_classification_list_con_text"
|
|
|
- :class="domainNameType === item.type ? 'select-right_classification_list_con_texts' : ''">{{
|
|
|
- item.name }}</div>
|
|
|
- <img :src="require('../../assets/xingzhuangjiehe@3x.png')" alt=""
|
|
|
- class="select-right_classification_list_con_imgTwo" v-if="domainNameType === item.type" />
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in domainNameList"
|
|
|
+ :key="index"
|
|
|
+ class="select-right_classification_list_con"
|
|
|
+ @click="domainNameType = item.type"
|
|
|
+ :class="domainNameType === item.type ? 'select-right_classification_list_cons' : ''"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/png-da-zi@3x.png')"
|
|
|
+ alt=""
|
|
|
+ class="select-right_classification_list_con_img"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ class="select-right_classification_list_con_text"
|
|
|
+ :class="
|
|
|
+ domainNameType === item.type ? 'select-right_classification_list_con_texts' : ''
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/xingzhuangjiehe@3x.png')"
|
|
|
+ alt=""
|
|
|
+ class="select-right_classification_list_con_imgTwo"
|
|
|
+ v-if="domainNameType === item.type"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="select-right_classification select-right_classifications">
|
|
|
<div class="select-right_classification_title">
|
|
|
- <img :src="require('../../assets/png-xiyoudu@3x.png')" alt=""
|
|
|
- class="select-right_classification_title_img" />
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/png-xiyoudu@3x.png')"
|
|
|
+ alt=""
|
|
|
+ class="select-right_classification_title_img"
|
|
|
+ />
|
|
|
<div class="select-right_classification_title_text">稀有度分类</div>
|
|
|
</div>
|
|
|
<div class="select-right_classification_list">
|
|
|
- <div v-for="(item, index) in rarityList" :key="index" class="select-right_classification_list_con"
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in rarityList"
|
|
|
+ :key="index"
|
|
|
+ class="select-right_classification_list_con"
|
|
|
@click="rarityType = item.type"
|
|
|
- :class="rarityType === item.type ? 'select-right_classification_list_conss' : ''">
|
|
|
- <img :src="require('../../assets/png-da-lv@3x.png')" alt=""
|
|
|
- class="select-right_classification_list_con_img" />
|
|
|
- <div class="select-right_classification_list_con_text"
|
|
|
- :class="rarityType === item.type ? 'select-right_classification_list_con_textss' : ''">{{
|
|
|
- item.name }}</div>
|
|
|
- <img :src="require('../../assets/xingzhuangjiehe@3x@3x (1).png')" alt=""
|
|
|
- class="select-right_classification_list_con_imgTwo" v-if="rarityType === item.type" />
|
|
|
+ :class="rarityType === item.type ? 'select-right_classification_list_conss' : ''"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/png-da-lv@3x.png')"
|
|
|
+ alt=""
|
|
|
+ class="select-right_classification_list_con_img"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ class="select-right_classification_list_con_text"
|
|
|
+ :class="rarityType === item.type ? 'select-right_classification_list_con_textss' : ''"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </div>
|
|
|
+ <img
|
|
|
+ :src="require('../../assets/xingzhuangjiehe@3x@3x (1).png')"
|
|
|
+ alt=""
|
|
|
+ class="select-right_classification_list_con_imgTwo"
|
|
|
+ v-if="rarityType === item.type"
|
|
|
+ />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -138,276 +207,280 @@
|
|
|
<!-- </van-popup> -->
|
|
|
</div>
|
|
|
<div class="page_listone_bg" v-if="show" @click="showStatus"></div>
|
|
|
+ <img src="../../assets/icon_zhiding.png" @click="goTop" class="goTop" v-if="bodyScroll > 100" alt="" />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import ProductInfo from '../../components/product/productInfo.vue';
|
|
|
export default {
|
|
|
- name: 'metaDomain',
|
|
|
- inject: ['setKeeps', 'scrollWrapper', 'changeScroll'],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- domainWidth: '0px',
|
|
|
- domainNameType: 'LIKE',
|
|
|
- scrollTop: 0,
|
|
|
- rarityType: '',
|
|
|
- show: false,
|
|
|
- domainPrice: false,
|
|
|
- source: true,
|
|
|
- domainNameList: [
|
|
|
- {
|
|
|
- name: '热度排行',
|
|
|
- type: 'LIKE'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '最新发布',
|
|
|
- type: 'RELEASE'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '寄售中',
|
|
|
- type: 'SELL'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '仅展示',
|
|
|
- type: 'SEE'
|
|
|
- }
|
|
|
- ],
|
|
|
- rarityList: [
|
|
|
- {
|
|
|
- name: '1个字符',
|
|
|
- type: 'RID1'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '2个字符',
|
|
|
- type: 'RID2'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '3个字符',
|
|
|
- type: 'RID3'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '4个字符',
|
|
|
- type: 'RID4'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '5个字符',
|
|
|
- type: 'RID5'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '6个字符及以上',
|
|
|
- type: 'RID'
|
|
|
- }
|
|
|
- ],
|
|
|
- loading: false,
|
|
|
- finished: false,
|
|
|
- page: 0,
|
|
|
- empty: false,
|
|
|
- list: [],
|
|
|
- domainList: [],
|
|
|
- dressing: false,
|
|
|
- search: '',
|
|
|
- value: '',
|
|
|
- unregistered: require('@assets/png-da-lv@3x.png'),
|
|
|
- registered: require('@assets/png-da-zi@3x.png')
|
|
|
- };
|
|
|
- },
|
|
|
- components: {
|
|
|
- ProductInfo
|
|
|
- },
|
|
|
- methods: {
|
|
|
- onInput(e) {
|
|
|
- if (e.key === 'Enter') {
|
|
|
- this.$nextTick(() => {
|
|
|
- this.getSearch();
|
|
|
- });
|
|
|
- this.$refs.fieldRef.blur();
|
|
|
- }
|
|
|
- },
|
|
|
- priceOrder() {
|
|
|
- this.source = !this.source;
|
|
|
- this.getList(true);
|
|
|
- },
|
|
|
- showStatus() {
|
|
|
- this.show = false;
|
|
|
- this.domainWidth = '0px';
|
|
|
- },
|
|
|
- screening() {
|
|
|
- this.show = true;
|
|
|
- this.domainWidth = 'calc(84vw + 1px)';
|
|
|
- this.search = '';
|
|
|
- this.value = '';
|
|
|
- },
|
|
|
- domainName(value) {
|
|
|
- this.payType = value;
|
|
|
- },
|
|
|
- getSearch(value) {
|
|
|
- this.search = this.value;
|
|
|
- let matching = /^[A-Za-z0-9]+$/;
|
|
|
- if (matching.test(this.search)) {
|
|
|
- this.getList(true);
|
|
|
- } else {
|
|
|
- if (this.search == '') {
|
|
|
- this.refreash();
|
|
|
- } else {
|
|
|
- this.$toast('只能由数字和字母组成');
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- refreash() {
|
|
|
- (this.domainNameType = 'LIKE'), (this.rarityType = '');
|
|
|
- this.dressing = false;
|
|
|
- this.domainPrice = false;
|
|
|
- this.getList(true);
|
|
|
- },
|
|
|
- submit() {
|
|
|
- this.domainWidth = '0px';
|
|
|
- this.show = false;
|
|
|
- this.dressing = true;
|
|
|
- this.getList(true);
|
|
|
- if (this.domainNameType == 'SELL') {
|
|
|
- this.domainPrice = true;
|
|
|
- } else {
|
|
|
- this.domainPrice = false;
|
|
|
- }
|
|
|
- },
|
|
|
- getList(isFirst = false) {
|
|
|
- if (isFirst) {
|
|
|
- this.page = 0;
|
|
|
- this.list = [];
|
|
|
- }
|
|
|
- this.loading = true;
|
|
|
- this.finished = false;
|
|
|
- this.empty = false;
|
|
|
- let query = {
|
|
|
- type: 'DOMAIN'
|
|
|
- };
|
|
|
- let sort = 'likes,desc';
|
|
|
- if (this.dressing) {
|
|
|
- if (this.rarityType != '') {
|
|
|
- query = {
|
|
|
- ...query,
|
|
|
- prefixName: this.rarityType
|
|
|
- };
|
|
|
- }
|
|
|
- if (this.domainNameType == 'SELL') {
|
|
|
- query = {
|
|
|
- ...query,
|
|
|
- salable: true
|
|
|
- };
|
|
|
- if (this.source) {
|
|
|
- sort = 'price,desc';
|
|
|
- } else {
|
|
|
- sort = 'price,asc';
|
|
|
- }
|
|
|
- }
|
|
|
- if (this.domainNameType == 'SEE') {
|
|
|
- query = {
|
|
|
- ...query,
|
|
|
- salable: false
|
|
|
- };
|
|
|
- }
|
|
|
- if (this.domainNameType == 'RELEASE') {
|
|
|
- query = {
|
|
|
- ...query
|
|
|
- };
|
|
|
- sort = 'createdAt,desc';
|
|
|
- }
|
|
|
- }
|
|
|
- let url = 'collection/all';
|
|
|
- return this.$http
|
|
|
- .post(
|
|
|
- url,
|
|
|
- {
|
|
|
- page: this.page,
|
|
|
- size: 20,
|
|
|
- query: query,
|
|
|
- sort: sort,
|
|
|
- search: this.search
|
|
|
- },
|
|
|
- { body: 'json' }
|
|
|
- )
|
|
|
- .then(res => {
|
|
|
- if (res.first) {
|
|
|
- this.list = [];
|
|
|
- this.page = 0;
|
|
|
- }
|
|
|
- this.list = [...this.list, ...res.content];
|
|
|
- this.empty = res.empty;
|
|
|
- if (this.search != '' && res.empty == true) {
|
|
|
- this.empty = false;
|
|
|
- this.getDomain();
|
|
|
- } else {
|
|
|
- this.domainList = [];
|
|
|
- }
|
|
|
- this.loading = false;
|
|
|
- this.finished = res.last;
|
|
|
- if (!this.finished) {
|
|
|
- this.page = this.page + 1;
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- buy(index) {
|
|
|
- if (!this.domainList[index].sold) {
|
|
|
- this.$router.push({
|
|
|
- path: '/domainSubmit',
|
|
|
- query: {
|
|
|
- domain: this.domainList[index].domain
|
|
|
- }
|
|
|
- });
|
|
|
- } else {
|
|
|
- this.$toast('持有人超链暂未开启');
|
|
|
- }
|
|
|
- },
|
|
|
- pad(n, width, z) {
|
|
|
- z = z || '0';
|
|
|
- n = n + '';
|
|
|
- return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
|
|
|
- },
|
|
|
- getDomain() {
|
|
|
- this.$http
|
|
|
- .post('/domainOrder/search', {
|
|
|
- domain: this.search
|
|
|
- })
|
|
|
- .then(res => {
|
|
|
- res.forEach(item => {
|
|
|
- if (item.endTime) {
|
|
|
- item.endTime = this.dayjs(item.endTime).diff(this.dayjs(), 'second');
|
|
|
- item.endTime =
|
|
|
- Math.floor(item.endTime / 24 / 3600) +
|
|
|
- '天' +
|
|
|
- this.pad(parseInt(item.endTime / 3600) % 24, 2) +
|
|
|
- '时' +
|
|
|
- this.pad(parseInt(item.endTime / 60) % 60, 2) +
|
|
|
- '分';
|
|
|
- }
|
|
|
- });
|
|
|
- this.domainList = res;
|
|
|
- })
|
|
|
- .catch(e => {});
|
|
|
- },
|
|
|
- onRefresh() {
|
|
|
- this.getList(true).then(() => {
|
|
|
- this.isLoading = false;
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- activated() {
|
|
|
- this.$nextTick(() => {
|
|
|
- this.changeScroll(this.scrollTop);
|
|
|
- });
|
|
|
- },
|
|
|
- beforeRouteLeave(to, from, next) {
|
|
|
- if (to.name === 'productDetail') {
|
|
|
- console.log('fahsdasdcffad');
|
|
|
- this.scrollTop = this.scrollWrapper.scrollTop;
|
|
|
- this.setKeeps(['metaDomain']);
|
|
|
- } else {
|
|
|
- this.scrollTop = 0;
|
|
|
- this.setKeeps(['metaDomain'], false);
|
|
|
- }
|
|
|
- next();
|
|
|
- }
|
|
|
+ name: 'metaDomain',
|
|
|
+ inject: ['setKeeps', 'scrollWrapper', 'changeScroll', 'bodyScroll'],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ domainWidth: '0px',
|
|
|
+ domainNameType: 'LIKE',
|
|
|
+ scrollTop: 0,
|
|
|
+ rarityType: '',
|
|
|
+ show: false,
|
|
|
+ domainPrice: false,
|
|
|
+ source: true,
|
|
|
+ domainNameList: [
|
|
|
+ {
|
|
|
+ name: '热度排行',
|
|
|
+ type: 'LIKE'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '最新发布',
|
|
|
+ type: 'RELEASE'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '寄售中',
|
|
|
+ type: 'SELL'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '仅展示',
|
|
|
+ type: 'SEE'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ rarityList: [
|
|
|
+ {
|
|
|
+ name: '1个字符',
|
|
|
+ type: 'RID1'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '2个字符',
|
|
|
+ type: 'RID2'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '3个字符',
|
|
|
+ type: 'RID3'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '4个字符',
|
|
|
+ type: 'RID4'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '5个字符',
|
|
|
+ type: 'RID5'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '6个字符及以上',
|
|
|
+ type: 'RID'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ loading: false,
|
|
|
+ finished: false,
|
|
|
+ page: 0,
|
|
|
+ empty: false,
|
|
|
+ list: [],
|
|
|
+ domainList: [],
|
|
|
+ dressing: false,
|
|
|
+ search: '',
|
|
|
+ value: '',
|
|
|
+ unregistered: require('@assets/png-da-lv@3x.png'),
|
|
|
+ registered: require('@assets/png-da-zi@3x.png')
|
|
|
+ };
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ ProductInfo
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onInput(e) {
|
|
|
+ if (e.key === 'Enter') {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.getSearch();
|
|
|
+ });
|
|
|
+ this.$refs.fieldRef.blur();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ goTop() {
|
|
|
+ this.changeScroll(0, true);
|
|
|
+ },
|
|
|
+ priceOrder() {
|
|
|
+ this.source = !this.source;
|
|
|
+ this.getList(true);
|
|
|
+ },
|
|
|
+ showStatus() {
|
|
|
+ this.show = false;
|
|
|
+ this.domainWidth = '0px';
|
|
|
+ },
|
|
|
+ screening() {
|
|
|
+ this.show = true;
|
|
|
+ this.domainWidth = 'calc(84vw + 1px)';
|
|
|
+ this.search = '';
|
|
|
+ this.value = '';
|
|
|
+ },
|
|
|
+ domainName(value) {
|
|
|
+ this.payType = value;
|
|
|
+ },
|
|
|
+ getSearch(value) {
|
|
|
+ this.search = this.value;
|
|
|
+ let matching = /^[A-Za-z0-9]+$/;
|
|
|
+ if (matching.test(this.search)) {
|
|
|
+ this.getList(true);
|
|
|
+ } else {
|
|
|
+ if (this.search == '') {
|
|
|
+ this.refreash();
|
|
|
+ } else {
|
|
|
+ this.$toast('只能由数字和字母组成');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ refreash() {
|
|
|
+ (this.domainNameType = 'LIKE'), (this.rarityType = '');
|
|
|
+ this.dressing = false;
|
|
|
+ this.domainPrice = false;
|
|
|
+ this.getList(true);
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ this.domainWidth = '0px';
|
|
|
+ this.show = false;
|
|
|
+ this.dressing = true;
|
|
|
+ this.getList(true);
|
|
|
+ if (this.domainNameType == 'SELL') {
|
|
|
+ this.domainPrice = true;
|
|
|
+ } else {
|
|
|
+ this.domainPrice = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getList(isFirst = false) {
|
|
|
+ if (isFirst) {
|
|
|
+ this.page = 0;
|
|
|
+ this.list = [];
|
|
|
+ }
|
|
|
+ this.loading = true;
|
|
|
+ this.finished = false;
|
|
|
+ this.empty = false;
|
|
|
+ let query = {
|
|
|
+ type: 'DOMAIN'
|
|
|
+ };
|
|
|
+ let sort = 'likes,desc';
|
|
|
+ if (this.dressing) {
|
|
|
+ if (this.rarityType != '') {
|
|
|
+ query = {
|
|
|
+ ...query,
|
|
|
+ prefixName: this.rarityType
|
|
|
+ };
|
|
|
+ }
|
|
|
+ if (this.domainNameType == 'SELL') {
|
|
|
+ query = {
|
|
|
+ ...query,
|
|
|
+ salable: true
|
|
|
+ };
|
|
|
+ if (this.source) {
|
|
|
+ sort = 'price,desc';
|
|
|
+ } else {
|
|
|
+ sort = 'price,asc';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.domainNameType == 'SEE') {
|
|
|
+ query = {
|
|
|
+ ...query,
|
|
|
+ salable: false
|
|
|
+ };
|
|
|
+ }
|
|
|
+ if (this.domainNameType == 'RELEASE') {
|
|
|
+ query = {
|
|
|
+ ...query
|
|
|
+ };
|
|
|
+ sort = 'createdAt,desc';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let url = 'collection/all';
|
|
|
+ return this.$http
|
|
|
+ .post(
|
|
|
+ url,
|
|
|
+ {
|
|
|
+ page: this.page,
|
|
|
+ size: 20,
|
|
|
+ query: query,
|
|
|
+ sort: sort,
|
|
|
+ search: this.search
|
|
|
+ },
|
|
|
+ { body: 'json' }
|
|
|
+ )
|
|
|
+ .then(res => {
|
|
|
+ if (res.first) {
|
|
|
+ this.list = [];
|
|
|
+ this.page = 0;
|
|
|
+ }
|
|
|
+ this.list = [...this.list, ...res.content];
|
|
|
+ this.empty = res.empty;
|
|
|
+ if (this.search != '' && res.empty == true) {
|
|
|
+ this.empty = false;
|
|
|
+ this.getDomain();
|
|
|
+ } else {
|
|
|
+ this.domainList = [];
|
|
|
+ }
|
|
|
+ this.loading = false;
|
|
|
+ this.finished = res.last;
|
|
|
+ if (!this.finished) {
|
|
|
+ this.page = this.page + 1;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ buy(index) {
|
|
|
+ if (!this.domainList[index].sold) {
|
|
|
+ this.$router.push({
|
|
|
+ path: '/domainSubmit',
|
|
|
+ query: {
|
|
|
+ domain: this.domainList[index].domain
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$toast('持有人超链暂未开启');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ pad(n, width, z) {
|
|
|
+ z = z || '0';
|
|
|
+ n = n + '';
|
|
|
+ return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n;
|
|
|
+ },
|
|
|
+ getDomain() {
|
|
|
+ this.$http
|
|
|
+ .post('/domainOrder/search', {
|
|
|
+ domain: this.search
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ res.forEach(item => {
|
|
|
+ if (item.endTime) {
|
|
|
+ item.endTime = this.dayjs(item.endTime).diff(this.dayjs(), 'second');
|
|
|
+ item.endTime =
|
|
|
+ Math.floor(item.endTime / 24 / 3600) +
|
|
|
+ '天' +
|
|
|
+ this.pad(parseInt(item.endTime / 3600) % 24, 2) +
|
|
|
+ '时' +
|
|
|
+ this.pad(parseInt(item.endTime / 60) % 60, 2) +
|
|
|
+ '分';
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.domainList = res;
|
|
|
+ })
|
|
|
+ .catch(e => {});
|
|
|
+ },
|
|
|
+ onRefresh() {
|
|
|
+ this.getList(true).then(() => {
|
|
|
+ this.isLoading = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ activated() {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.changeScroll(this.scrollTop);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ beforeRouteLeave(to, from, next) {
|
|
|
+ if (to.name === 'productDetail') {
|
|
|
+ console.log('fahsdasdcffad');
|
|
|
+ this.scrollTop = this.scrollWrapper.scrollTop;
|
|
|
+ this.setKeeps(['metaDomain']);
|
|
|
+ } else {
|
|
|
+ this.scrollTop = 0;
|
|
|
+ this.setKeeps(['metaDomain'], false);
|
|
|
+ }
|
|
|
+ next();
|
|
|
+ }
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
@@ -917,4 +990,15 @@ export default {
|
|
|
z-index: 2001;
|
|
|
background: rgba(0, 0, 0, 0.2);
|
|
|
}
|
|
|
+
|
|
|
+.goTop {
|
|
|
+ position: fixed;
|
|
|
+ right: 16px;
|
|
|
+ bottom: 70px;
|
|
|
+ bottom: calc(env(safe-area-inset-bottom) + 70px);
|
|
|
+ width: 44px;
|
|
|
+ height: 44px;
|
|
|
+ display: block;
|
|
|
+ z-index: 20;
|
|
|
+}
|
|
|
</style>
|
