Skip to content

D
dexfilter-web-nuxt3
Commit b16cb9c6 by lei
Options

1

parent 302f989e
Showing with 312 additions and 324 deletions
nuxt.config.ts
import viteCompression from 'vite-plugin-compression';
import viteCompression from "vite-plugin-compression";
// import visualizer from 'rollup-plugin-visualizer';
// 筛选接口地址
let filterApi = 'http://156.247.9.93:9501/';
let loginApi = 'http://156.247.9.93:8001/';
let filterApi = "http://156.247.9.93:9501/";
let loginApi = "http://156.247.9.93:8001/";
export default defineNuxtConfig({
// plugins: [],
modules: ['nuxt-svgo', '@nuxtjs-alt/proxy'],
modules: ["nuxt-svgo", "@nuxtjs-alt/proxy"],
proxy: {
enableProxy: true,
proxies: {
'/score': {
"/score": {
target: filterApi,
changeOrigin: true,
},
'/v1': {
"/v1": {
target: filterApi,
changeOrigin: true,
},
'/search': {
"/search": {
target: filterApi,
changeOrigin: true,
},
'/favorites': {
"/favorites": {
target: filterApi,
changeOrigin: true,
},
//api-ip是另外滴
'/api': {
"/api": {
target: loginApi,
changeOrigin: true,
},
......@@ -40,9 +40,9 @@ export default defineNuxtConfig({
// },
vite: {
plugins: [viteCompression()],
envDir: '~/env',
envDir: "~/env",
build: {
minify: 'terser', // 混淆器，terser构建后文件体积更小
minify: "terser", // 混淆器，terser构建后文件体积更小
// 构建后是否生成 source map 文件
// sourcemap: 'hidden',
cssCodeSplit: true, // 如果设置为false，整个项目中的所有 CSS 将被提取到一个 CSS 文件中
......@@ -60,8 +60,8 @@ export default defineNuxtConfig({
rollupOptions: {
output: {
manualChunks: {
TdesignVueNext: ['tdesign-vue-next'],
CustomEcharts: ['echarts'],
TdesignVueNext: ["tdesign-vue-next"],
CustomEcharts: ["echarts"],
},
},
},
......@@ -72,11 +72,11 @@ export default defineNuxtConfig({
// vendor-已被弃用
// 第三方插件转es5
transpile:
process.env.NODE_ENV === 'production'
? ['tdesign-vue-next', 'echarts', 'vue-i18n']
: ['echarts'],
process.env.NODE_ENV === "production"
? ["tdesign-vue-next", "echarts", "vue-i18n"]
: ["echarts"],
// cssSourceMap: true,
// analyze: true,
},
css: ['@/style/font-family.css'],
css: ["@/style/font-family.css"],
});
views/token/CustomTokenList.vue
......@@ -442,7 +442,7 @@ const getBaseUrl = () => {
// if (process.dev) {
// return "http://156.247.9.93:9501";
// }
return "http://apiv1.dexfilter.com/";
return "https://apiv1.dexfilter.com/";
} else {
return "/v1";
}
......
views/token/RightDetail.vue
......@@ -46,7 +46,7 @@
:currentPath="currentPath"
:chat="tokenInfo.chat"
></token-social-list>
<SubmitSocialInfo></SubmitSocialInfo>
<submit-social-info></submit-social-info>
<t-tabs
class="info-tabs"
v-model="currentTab"
......@@ -108,7 +108,7 @@
</div> -->
<div></div>
</template>
<script setup lang="ts">
<script setup lang="tsx">
import request from "@/utils/request";
import { parsePercent, parseCoinAmount } from "@/utils/tool";
import TimeTab from "./TimeTab.vue";
......@@ -123,7 +123,7 @@ import Detailsicon from "/public/images/svg/rightDetail/detailsicon.svg";
import Favo from "/public/images/svg/rightDetail/favo.svg";
import CollectionSvg from "/public/images/svg/rightDetail/colection.svg";
import { useI18n } from "vue-i18n";
import RightDetailHeader from "./rightDetailHeader";
import RightDetailHeader from "./rightDetailHeader.vue";
import SubmitSocialInfo from "./SubmitSocialInfo";
import Collection from "./collection";
const router = useRouter();
......
views/token/SubmitSocialInfo/index.tsx
import { defineComponent, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import './index.less';
import SubmitSvg from '/public/images/svg/rightDetail/submit.svg';
import ConnectCloseSvg from '/public/images/svg/rightDetail/connectClose.svg';
import { submitInfoLink } from '@/constants/global';
import { defineComponent, ref } from "vue";
import { useI18n } from "vue-i18n";
import "./index.less";
import SubmitSvg from "/public/images/svg/rightDetail/submit.svg";
import ConnectCloseSvg from "/public/images/svg/rightDetail/connectClose.svg";
import { submitInfoLink } from "@/constants/global";
export default defineComponent({
setup() {
const visible = ref(false);
......@@ -36,21 +36,21 @@ export default defineComponent({
>
<div class="custom-set-message-popup-box">
<div class="message-popup-title">
{t('home.updatemessageTitle')}
{t("home.updatemessageTitle")}
</div>
<div class="message-popup-body">
<p>{t('home.message1')}</p>
<p>{t('home.message2')}</p>
<p>{t('home.message3')}</p>
<p>{t('home.message4')}</p>
<p>{t('home.message5')}</p>
<p>{t("home.message1")}</p>
<p>{t("home.message2")}</p>
<p>{t("home.message3")}</p>
<p>{t("home.message4")}</p>
<p>{t("home.message5")}</p>
</div>
<div class="message-popup-footer">
<t-button class="clear-btn" onClick={closeDialog}>
{t('user.Cancel')}
{t("user.Cancel")}
</t-button>
<t-button class="submit-btn" onClick={submit}>
{t('home.toSubmit')}
{t("home.toSubmit")}
</t-button>
</div>
</div>
......
views/token/rightDetailHeader.vue 0 → 100644
<template>
<div class="">
<div class="header-token-box">
<div class="header-token-info">
<div class="pro-tokeninfo-header">
<div class="left-token-name">
<div class="token-name-child">
<img :src="getImg" alt="swap" />
<span class="title">{{ tokenInfo.symbol }}</span>
</div>
<div class="address-info">
<span class="address-info-item">
<span>{{ $t("TableList.token") }}</span>
<span class="address">：{{ tokenInfo.tokenSub }}</span>
<span @click="doCopy(tokenInfo.token)">
<CopySvg></CopySvg>
</span>
</span>
</div>
<div class="address-info margin">
<span class="address-info-item">
<span>{{ $t("TableList.pool") }}</span>
<span class="address">：{{ tokenInfo.tbnameSub }}</span>
<span @click="doCopy(tokenInfo.n_tb)">
<CopySvg></CopySvg>
</span>
</span>
</div>
</div>
<div class="token-price-cl">
<div class="left-info">
<div class="price">
<div
class="price-box"
:style="{
color: r24hColor(),
}"
>
<Price tokenInfo="{props.tokenInfo}"></Price>
{{ getPrice() }}
</div>
<div
class="r24h-cl"
:style="{
color: r24hColor(),
}"
>
{{ numR24h }} ({{ r24h }})
</div>
<div class="filled-star-box">
<span>
<span v-show="isInCollection" @click="collectData">
<CollectionSvg3 class="filled-star" />
</span>
<span v-show="!isInCollection" @click="collectData">
<CollectionSvg2 class="filled-star-on"></CollectionSvg2>
</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script lang="ts" setup>
import { defineComponent, computed } from "vue";
import { useI18n } from "vue-i18n";
import CopySvg from "/public/images/svg/rightDetail/copy.svg";
import useCopy from "@/hooks/useCopy";
import * as Cache from "@/utils/cache";
import CollectionSvg2 from "/public/images/svg/rightDetail/colection2.svg";
import CollectionSvg3 from "/public/images/svg/rightDetail/collection-yes.svg";
import { parseCoinAmount } from "@/utils/tool";
const props = defineProps<{
tokenInfo: any;
numR24h: string;
r24h: string;
isInCollection: boolean;
tb: string;
currentPath: string;
}>();
const emit = defineEmits(["update:isInCollection"]);
const { t } = useI18n();
// 收藏表格是否更新
const CollectionCl = CollectionChange();
const { doCopy } = useCopy();
const getPrice = () => {
try {
const { tokenInfo } = props;
if (tokenInfo) {
if ("up" in tokenInfo) {
let up = parseCoinAmount(tokenInfo.up);
if (up.indexOf("{") !== -1) {
up = up.slice(0, up.length - 2);
}
return up;
} else {
return "";
}
}
} catch (e) {
console.log(e);
return "";
}
};
const collectData = () => {
const { tokenInfo, isInCollection, tb, currentPath } = props;
if (isInCollection) {
if (tb) {
Cache.deleteCollection([
{
tb: tb,
},
]);
}
emit("update:isInCollection", false);
} else {
Cache.setCollection({
hash: tb,
symbol: tokenInfo.symbol,
path: currentPath,
});
emit("update:isInCollection", true);
}
// 通知select中的收藏数据更新
CollectionCl.value += 1;
};
const r24hColor = () => {
if (props.r24h) {
if (props.r24h[0] === "-") {
return "#f85260";
} else {
return "#23ab94";
}
}
};
const getImg = computed(() => {
const { tokenInfo } = props;
try {
if (Object.keys(tokenInfo).length) {
if ("chat" in tokenInfo) {
return tokenInfo.chat.img;
} else {
return "/images/img/default-avatar.png";
}
}
} catch (e) {
console.log(e);
return "/images/img/default-avatar.png";
}
});
</script>
<style lang="less">
@import "@/style/flex.less";
.header-token-box {
margin-top: -1px;
box-sizing: border-box;
.header-token-info {
border-top: var(--new-border-2);
border-bottom: var(--new-border-2);
border-left: 1px solid var(--new-border-8);
border-right: 1px solid var(--new-border-8);
border-top-left-radius: 3px;
border-top-right-radius: 3px;
padding: 8px 12px;
background-color: var(--td--right-back-color-2);
.filled-star-box {
.dja(flex-end);
margin-top: 4px;
.filled-star {
color: var(--td-brand-color);
cursor: pointer;
}
.filled-star-on {
cursor: pointer;
fill: #7b7d87;
}
}
.pro-tokeninfo-header {
display: flex;
box-sizing: border-box;
.left-token-name {
width: 70%;
height: 100%;
.token-name-child {
.da();
max-width: 176px;
color: var(--td-right-detail-font-color-1);
line-height: 47px;
min-height: 47px;
.title {
font-weight: 700;
font-size: 26px;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-family: "bold";
}
img {
width: 38px;
height: 38px;
border-radius: 50%;
}
:not(:first-child) {
margin-left: 10px;
}
}
.address-info {
display: flex;
color: var(--new-color-7);
font-family: "Regular";
margin-top: 1px;
.address-info-item {
font-size: var(--font-size);
.address {
margin-right: 4px;
}
}
}
.margin {
margin-top: 2px;
}
:hover.address-info {
cursor: pointer;
}
}
}
.token-price-cl {
flex: 1;
.left-info {
font-size: 16px;
color: var(--td-text-color-secondary);
white-space: nowrap;
.price {
font-size: 16px;
font-weight: bold;
color: var(--new-color-4);
.price-box {
.dja(flex-end);
height: 50px;
font-weight: 700;
font-size: 28px;
min-height: 50px;
font-family: "bold";
color: var(--td-Search-info-color-1);
}
.r24h-cl {
font-size: 13px;
font-weight: normal;
margin-top: -3px;
text-align: right;
font-family: "Medium";
}
}
.kline-btn {
margin-left: 16px;
width: 24px;
height: 24px;
.t-icon {
font-size: 24px;
color: #fff;
}
}
}
.t-avatar {
margin-left: auto;
}
}
}
}
</style>
views/token/rightDetailHeader/index.less deleted 100644 → 0
@import '@/style/flex.less';
.header-token-box {
margin-top: -1px;
box-sizing: border-box;
.header-token-info {
border-top: var(--new-border-2);
border-bottom: var(--new-border-2);
border-left: 1px solid var(--new-border-8);
border-right: 1px solid var(--new-border-8);
border-top-left-radius: 3px;
border-top-right-radius: 3px;
padding: 8px 12px;
background-color: var(--td--right-back-color-2);
.filled-star-box {
.dja(flex-end);
margin-top: 4px;
.filled-star {
color: var(--td-brand-color);
cursor: pointer;
}
.filled-star-on {
cursor: pointer;
fill: #7b7d87;
}
}
.pro-tokeninfo-header {
display: flex;
box-sizing: border-box;
.left-token-name {
width: 70%;
height: 100%;
.token-name-child {
.da();
max-width: 176px;
color: var(--td-right-detail-font-color-1);
line-height: 47px;
min-height: 47px;
.title {
font-weight: 700;
font-size: 26px;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-family: 'bold';
}
img {
width: 38px;
height: 38px;
border-radius: 50%;
}
:not(:first-child) {
margin-left: 10px;
}
}
.address-info {
display: flex;
color: var(--new-color-7);
font-family: 'Regular';
margin-top: 1px;
.address-info-item {
font-size: var(--font-size);
.address {
margin-right: 4px;
}
}
}
.margin {
margin-top: 2px;
}
:hover.address-info {
cursor: pointer;
}
}
}
.token-price-cl {
flex: 1;
.left-info {
font-size: 16px;
color: var(--td-text-color-secondary);
white-space: nowrap;
.price {
font-size: 16px;
font-weight: bold;
color: var(--new-color-4);
.price-box {
.dja(flex-end);
height: 50px;
font-weight: 700;
font-size: 28px;
min-height: 50px;
font-family: 'bold';
color: var(--td-Search-info-color-1);
}
.r24h-cl {
font-size: 13px;
font-weight: normal;
margin-top: -3px;
text-align: right;
font-family: 'Medium';
}
}
.kline-btn {
margin-left: 16px;
width: 24px;
height: 24px;
.t-icon {
font-size: 24px;
color: #fff;
}
}
}
.t-avatar {
margin-left: auto;
}
}
}
}
views/token/rightDetailHeader/index.tsx deleted 100644 → 0
import { defineComponent, computed } from "vue";
import { useI18n } from "vue-i18n";
import CopySvg from "/public/images/svg/rightDetail/copy.svg";
import useCopy from "@/hooks/useCopy";
import * as Cache from "@/utils/cache";
import "./index.less";
import CollectionSvg2 from "/public/images/svg/rightDetail/colection2.svg";
import CollectionSvg3 from "/public/images/svg/rightDetail/collection-yes.svg";
import Price from "./price.vue";
export default defineComponent({
props: {
tokenInfo: Object as any,
numR24h: String,
r24h: String,
isInCollection: Boolean,
tb: String,
currentPath: String,
},
emits: ["update:isInCollection"],
setup(props, { emit }) {
const { t } = useI18n();
// 收藏表格是否更新
const CollectionCl = CollectionChange();
const { doCopy } = useCopy();
const collectData = () => {
const { tokenInfo, isInCollection, tb, currentPath } = props;
if (isInCollection) {
if (tb) {
Cache.deleteCollection([
{
tb: tb,
},
]);
}
emit("update:isInCollection", false);
} else {
Cache.setCollection({
hash: tb,
symbol: tokenInfo.symbol,
path: currentPath,
});
emit("update:isInCollection", true);
}
// 通知select中的收藏数据更新
CollectionCl.value += 1;
};
const r24hColor = () => {
if (props.r24h) {
if (props.r24h[0] === "-") {
return "#f85260";
} else {
return "#23ab94";
}
}
};
const getImg = computed(() => {
const { tokenInfo } = props;
try {
if (Object.keys(tokenInfo).length) {
if ("chat" in tokenInfo) {
return tokenInfo.chat.img;
} else {
return "/images/img/default-avatar.png";
}
}
} catch (e) {
console.log(e);
return "/images/img/default-avatar.png";
}
});
return () => (
<div class="header-token-box">
<div class="header-token-info">
<div class="pro-tokeninfo-header">
<div class="left-token-name">
<div class="token-name-child">
<img src={getImg.value} alt="swap" />
<span class="title">{props.tokenInfo.symbol}</span>
</div>
<div class="address-info">
<span class="address-info-item">
<span>{t("TableList.token")}</span>
<span class="address">：{props.tokenInfo.tokenSub}</span>
<span onClick={doCopy.bind(this, props.tokenInfo.token)}>
<CopySvg></CopySvg>
</span>
</span>
</div>
<div class="address-info margin">
<span class="address-info-item">
<span>{t("TableList.pool")}</span>
<span class="address">：{props.tokenInfo.tbnameSub}</span>
<span onClick={doCopy.bind(this, props.tokenInfo.n_tb)}>
<CopySvg></CopySvg>
</span>
</span>
</div>
</div>
<div class="token-price-cl">
<div class="left-info">
<div class="price">
<div
class="price-box"
style={{
color: r24hColor(),
}}
>
<Price tokenInfo={props.tokenInfo}></Price>
</div>
<div
class="r24h-cl"
style={{
color: r24hColor(),
}}
>
{props.numR24h}
{`(${props.r24h})`}
</div>
<div class="filled-star-box">
<span>
{props.isInCollection ? (
<span onClick={collectData}>
<CollectionSvg3 class="filled-star" />
</span>
) : (
<span onClick={collectData}>
<CollectionSvg2 class="filled-star-on"></CollectionSvg2>
</span>
)}
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
},
});
views/token/rightDetailHeader/price.vue deleted 100644 → 0
<template>
<div class="">{{ getPrice() }}</div>
</template>
<script lang="ts" setup>
import { parseCoinAmount } from '@/utils/tool';
const props = defineProps<{
tokenInfo: any;
}>();
const getPrice = () => {
try {
const { tokenInfo } = props;
if (tokenInfo) {
if ('up' in tokenInfo) {
let up = parseCoinAmount(tokenInfo.up);
if (up.indexOf('{') !== -1) {
up = up.slice(0, up.length - 2);
}
return up;
} else {
return '';
}
}
} catch (e) {
console.log(e);
return '';
}
};
</script>
<style lang="less"></style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment