Skip to content

D
dexfilter-web-nuxt3
Commit 6785be23 by lei
Options

1

parent 5f138c83
Showing with 108 additions and 111 deletions
a-dist.zip 0 → 100644
File added
nuxt.config.ts
import viteCompression from 'vite-plugin-compression'; import viteCompression from "vite-plugin-compression";
import visualizer from 'rollup-plugin-visualizer'; // import visualizer from 'rollup-plugin-visualizer';
// 筛选接口地址 // 筛选接口地址
let filterApi = 'http://156.247.9.93:9501/'; let filterApi = "http://156.247.9.93:9501/";
let loginApi = 'http://156.247.9.93:8001/'; let loginApi = "http://156.247.9.93:8001/";
export default defineNuxtConfig({ export default defineNuxtConfig({
// plugins: [], // plugins: [],
modules: ['nuxt-svgo', '@nuxtjs-alt/proxy'], modules: ["nuxt-svgo", "@nuxtjs-alt/proxy"],
proxy: { proxy: {
enableProxy: true, enableProxy: true,
proxies: { proxies: {
'/score': { "/score": {
target: filterApi, target: filterApi,
changeOrigin: true, changeOrigin: true,
}, },
'/v1': { "/v1": {
target: filterApi, target: filterApi,
changeOrigin: true, changeOrigin: true,
}, },
'/search': { "/search": {
target: filterApi, target: filterApi,
changeOrigin: true, changeOrigin: true,
}, },
'/favorites': { "/favorites": {
target: filterApi, target: filterApi,
changeOrigin: true, changeOrigin: true,
}, },
//api-ip是另外滴 //api-ip是另外滴
'/api': { "/api": {
target: loginApi, target: loginApi,
changeOrigin: true, changeOrigin: true,
}, },
...@@ -39,10 +39,10 @@ export default defineNuxtConfig({ ...@@ -39,10 +39,10 @@ export default defineNuxtConfig({
// NODE_ENV: process.env.NODE_ENV, // NODE_ENV: process.env.NODE_ENV,
// }, // },
vite: { vite: {
plugins: [viteCompression(), visualizer({ open: true })], plugins: [viteCompression()],
envDir: '~/env', envDir: "~/env",
build: { build: {
minify: 'terser', // 混淆器，terser构建后文件体积更小 minify: "terser", // 混淆器，terser构建后文件体积更小
// 构建后是否生成 source map 文件 // 构建后是否生成 source map 文件
// sourcemap: 'hidden', // sourcemap: 'hidden',
cssCodeSplit: true, // 如果设置为false，整个项目中的所有 CSS 将被提取到一个 CSS 文件中 cssCodeSplit: true, // 如果设置为false，整个项目中的所有 CSS 将被提取到一个 CSS 文件中
...@@ -60,8 +60,8 @@ export default defineNuxtConfig({ ...@@ -60,8 +60,8 @@ export default defineNuxtConfig({
rollupOptions: { rollupOptions: {
output: { output: {
manualChunks: { manualChunks: {
TdesignVueNext: ['tdesign-vue-next'], TdesignVueNext: ["tdesign-vue-next"],
CustomEcharts: ['echarts'], CustomEcharts: ["echarts"],
}, },
}, },
}, },
...@@ -72,11 +72,11 @@ export default defineNuxtConfig({ ...@@ -72,11 +72,11 @@ export default defineNuxtConfig({
// vendor-已被弃用 // vendor-已被弃用
// 第三方插件转es5 // 第三方插件转es5
transpile: transpile:
process.env.NODE_ENV === 'production' process.env.NODE_ENV === "production"
? ['tdesign-vue-next', 'echarts', 'vue-i18n'] ? ["tdesign-vue-next", "echarts", "vue-i18n"]
: ['echarts'], : ["echarts"],
// cssSourceMap: true, // cssSourceMap: true,
// analyze: true, // analyze: true,
}, },
css: ['@/style/font-family.css'], css: ["@/style/font-family.css"],
}); });
stats.html
This source diff could not be displayed because it is too large. You can view the blob instead.
views/token/RightDetail.vue
...@@ -108,23 +108,23 @@ ...@@ -108,23 +108,23 @@
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import request from '@/utils/request'; import request from "@/utils/request";
import { parsePercent, parseCoinAmount } from '@/utils/tool'; import { parsePercent, parseCoinAmount } from "@/utils/tool";
import TimeTab from './TimeTab.vue'; import TimeTab from "./TimeTab.vue";
import SecurityCheck from './SecurityCheck.vue'; import SecurityCheck from "./SecurityCheck.vue";
import TokenInfo from './TokenInfo.vue'; import TokenInfo from "./TokenInfo.vue";
import TokenPool from './TokenPool.vue'; import TokenPool from "./TokenPool.vue";
import TokenSocialList from './TokenSocialList.vue'; import TokenSocialList from "./TokenSocialList.vue";
import * as Cache from '@/utils/cache'; import * as Cache from "@/utils/cache";
import { MessagePlugin } from 'tdesign-vue-next'; import { MessagePlugin } from "tdesign-vue-next";
import DetailsEcharts from '../analysis/detailsEcharts.vue'; import DetailsEcharts from "../analysis/detailsEcharts.vue";
import Detailsicon from '/public/images/svg/rightDetail/detailsicon.svg'; import Detailsicon from "/public/images/svg/rightDetail/detailsicon.svg";
import Favo from '/public/images/svg/rightDetail/favo.svg'; import Favo from "/public/images/svg/rightDetail/favo.svg";
import CollectionSvg from '/public/images/svg/rightDetail/colection.svg'; import CollectionSvg from "/public/images/svg/rightDetail/colection.svg";
import { useI18n } from 'vue-i18n'; import { useI18n } from "vue-i18n";
import RightDetailHeader from './rightDetailHeader'; import RightDetailHeader from "./rightDetailHeader";
import SubmitSocialInfo from './SubmitSocialInfo'; import SubmitSocialInfo from "./SubmitSocialInfo";
import Collection from './collection'; import Collection from "./collection";
const router = useRouter(); const router = useRouter();
const { t, locale } = useI18n(); const { t, locale } = useI18n();
// 通知表格收藏图表取消收藏 // 通知表格收藏图表取消收藏
...@@ -133,16 +133,16 @@ const CollectionDe = CollectionDelete(); ...@@ -133,16 +133,16 @@ const CollectionDe = CollectionDelete();
// const initEchart = computed(() => store.getters['echart/gethasInit']); // const initEchart = computed(() => store.getters['echart/gethasInit']);
const headerBtns = computed(() => [ const headerBtns = computed(() => [
{ {
label: t('securityCheck.details'), label: t("securityCheck.details"),
value: 'details', value: "details",
}, },
{ {
label: t('filter.Collection'), label: t("filter.Collection"),
value: 'collection', value: "collection",
}, },
{ {
label: t('securityCheck.analysis'), label: t("securityCheck.analysis"),
value: 'echart', value: "echart",
}, },
]); ]);
const props = defineProps({ const props = defineProps({
...@@ -154,52 +154,52 @@ const props = defineProps({ ...@@ -154,52 +154,52 @@ const props = defineProps({
mt: String, mt: String,
up: Number, up: Number,
}); });
const emit = defineEmits(['update:setPool', 'SettwitterRul']); const emit = defineEmits(["update:setPool", "SettwitterRul"]);
const r24h = ref(''); const r24h = ref("");
const numR24h = ref(''); const numR24h = ref("");
// 收藏列表是否首次加载 // 收藏列表是否首次加载
const CollectionOnload = ref(false); const CollectionOnload = ref(false);
// 判断当前路由，隐藏右侧详情box中的折线图模块 // 判断当前路由，隐藏右侧详情box中的折线图模块
const currentRouter = router.currentRoute.value.name; const currentRouter = router.currentRoute.value.name;
const currentTab = ref('info'); const currentTab = ref("info");
const isInCollection = ref(false); const isInCollection = ref(false);
// 默认选择detail按钮 // 默认选择detail按钮
const defaBtn = ref('details'); const defaBtn = ref("details");
const ifDetails = ref(false); const ifDetails = ref(false);
const WatchEcharts = useWatchEcharts(); const WatchEcharts = useWatchEcharts();
// 传给详情折线图的tbname // 传给详情折线图的tbname
const tb = ref(''); const tb = ref("");
// 点击pool才加载 // 点击pool才加载
const isPool = ref(false); const isPool = ref(false);
const PoolAddress = ref(''); const PoolAddress = ref("");
// 当前链 // 当前链
const chain = useChain(); const chain = useChain();
const tokenInfo: any = ref({ const tokenInfo: any = ref({
avatar: '', avatar: "",
token: '', token: "",
pool: [], pool: [],
}); });
const getPriceRange = () => { const getPriceRange = () => {
const { up, r24h: proR24h } = props; const { up, r24h: proR24h } = props;
if ((proR24h + '')[0] == '-') { if ((proR24h + "")[0] == "-") {
// -，跌 // -，跌
let newR24h = parseFloat((proR24h + '').replace('-', '')); let newR24h = parseFloat((proR24h + "").replace("-", ""));
// 原价 // 原价
let oldPrice = props.up / (1 - newR24h); let oldPrice = props.up / (1 - newR24h);
numR24h.value = oldPrice - props.up; numR24h.value = oldPrice - props.up;
numR24h.value = '-' + parseCoinAmount(numR24h.value); numR24h.value = "-" + parseCoinAmount(numR24h.value);
} else if (proR24h == 0) { } else if (proR24h == 0) {
numR24h.value = '+0'; numR24h.value = "+0";
} else { } else {
// +,涨 // +,涨
// 原价 // 原价
let oldPrice = props.up / (proR24h + 1); let oldPrice = props.up / (proR24h + 1);
numR24h.value = props.up - oldPrice; numR24h.value = props.up - oldPrice;
numR24h.value = '+' + parseCoinAmount(numR24h.value); numR24h.value = "+" + parseCoinAmount(numR24h.value);
} }
r24h.value = parsePercent(proR24h + ''); r24h.value = parsePercent(proR24h + "");
if (r24h.value[0] !== '-') { if (r24h.value[0] !== "-") {
r24h.value = '+' + r24h.value; r24h.value = "+" + r24h.value;
} }
}; };
watch( watch(
...@@ -213,13 +213,13 @@ watch( ...@@ -213,13 +213,13 @@ watch(
watch( watch(
() => props.r24h, () => props.r24h,
(v) => { (v) => {
if (typeof v !== 'undefined') { if (typeof v !== "undefined") {
getPriceRange(); getPriceRange();
} }
} }
); );
const btnLoad = (value: string) => { const btnLoad = (value: string) => {
if (currentRouter == 'tokenAnalysis' && value == 'echart') { if (currentRouter == "tokenAnalysis" && value == "echart") {
return false; return false;
} }
return true; return true;
...@@ -235,7 +235,7 @@ watch( ...@@ -235,7 +235,7 @@ watch(
); );
// 流动池tab改变 // 流动池tab改变
const changeTab = (value) => { const changeTab = (value) => {
if (value === 'pool') { if (value === "pool") {
isPool.value = true; isPool.value = true;
} }
}; };
...@@ -249,31 +249,31 @@ const getTokenInfo = async () => { ...@@ -249,31 +249,31 @@ const getTokenInfo = async () => {
}, },
}); });
result.marketCap = parseFloat(result.supply * result.up + '').toFixed(1); result.marketCap = parseFloat(result.supply * result.up + "").toFixed(1);
result.tokenSub = ''; result.tokenSub = "";
if (result.token) { if (result.token) {
result.tokenSub = result.tokenSub =
result.token.substr(0, 6) + result.token.substr(0, 6) +
'...' + "..." +
result.token.substr(result.token.length - 4, 4); result.token.substr(result.token.length - 4, 4);
} }
// tbname-掩码 // tbname-掩码
result.tbnameSub = ''; result.tbnameSub = "";
result.n_tb = ''; result.n_tb = "";
if (props.tb) { if (props.tb) {
// 先将d去掉 // 先将d去掉
result.n_tb = result.n_tb =
props.tb[0] == 'd' ? props.tb.slice(1, props.tb.length) : props.tb; props.tb[0] == "d" ? props.tb.slice(1, props.tb.length) : props.tb;
result.tbnameSub = result.tbnameSub =
result.n_tb.substr(0, 6) + result.n_tb.substr(0, 6) +
'...' + "..." +
result.n_tb.substr(result.n_tb.length - 4, 4); result.n_tb.substr(result.n_tb.length - 4, 4);
} }
isInCollection.value = Cache.hasSet(props.tb); isInCollection.value = Cache.hasSet(props.tb);
Object.assign(tokenInfo.value, result); Object.assign(tokenInfo.value, result);
// 如果有推特链接，提交给twitter组件解析 // 如果有推特链接，提交给twitter组件解析
if ('chat' in result) { if ("chat" in result) {
emit('SettwitterRul', result.chat.twitter); emit("SettwitterRul", result.chat.twitter);
} }
} catch (e) { } catch (e) {
console.log(e); console.log(e);
...@@ -283,7 +283,7 @@ const getTokenInfo = async () => { ...@@ -283,7 +283,7 @@ const getTokenInfo = async () => {
watch( watch(
() => locale.value, () => locale.value,
(v) => { (v) => {
if (defaBtn.value == 'echart') { if (defaBtn.value == "echart") {
WatchEcharts.value += 1; WatchEcharts.value += 1;
} }
} }
...@@ -291,16 +291,16 @@ watch( ...@@ -291,16 +291,16 @@ watch(
// 点击查看token详情信息 // 点击查看token详情信息
// v-if v-show同时使用，折线图第一次加载后，不在使用v-if，减少请求 // v-if v-show同时使用，折线图第一次加载后，不在使用v-if，减少请求
const gotoDetail = (value) => { const gotoDetail = (value) => {
if (value == 'collection' && !CollectionOnload.value) { if (value == "collection" && !CollectionOnload.value) {
CollectionOnload.value = true; CollectionOnload.value = true;
} }
// 先判断是否有token,没有则禁止打开折线图模块 // 先判断是否有token,没有则禁止打开折线图模块
if (!props.tb && value === 'echart') { if (!props.tb && value === "echart") {
MessagePlugin.closeAll(); MessagePlugin.closeAll();
MessagePlugin.warning(t('MessagePlugin.plToken')); MessagePlugin.warning(t("MessagePlugin.plToken"));
return; return;
} }
if (value === 'echart') { if (value === "echart") {
tb.value = props.tb; tb.value = props.tb;
ifDetails.value = true; ifDetails.value = true;
} }
...@@ -315,14 +315,14 @@ const monitor = computed((value) => { ...@@ -315,14 +315,14 @@ const monitor = computed((value) => {
// 接收右侧详情流动池address // 接收右侧详情流动池address
const changePool = (PoolValue) => { const changePool = (PoolValue) => {
PoolAddress.value = PoolValue; PoolAddress.value = PoolValue;
emit('update:setPool', PoolValue); emit("update:setPool", PoolValue);
}; };
watch( watch(
() => props.token, () => props.token,
(v) => { (v) => {
if (v) { if (v) {
//如果折线图为隐藏状态，需注销折线图模块 //如果折线图为隐藏状态，需注销折线图模块
if (defaBtn.value != 'echart') { if (defaBtn.value != "echart") {
ifDetails.value = false; ifDetails.value = false;
} }
tb.value = props.tb; tb.value = props.tb;
...@@ -332,8 +332,8 @@ watch( ...@@ -332,8 +332,8 @@ watch(
); );
</script> </script>
<style lang="less"> <style lang="less">
@import '@/style/flex.less'; @import "@/style/flex.less";
@import '@/style/variables.less'; @import "@/style/variables.less";
.right-detail-wrapper { .right-detail-wrapper {
height: calc(100vh - 70px); height: calc(100vh - 70px);
flex: 1; flex: 1;
...@@ -361,7 +361,7 @@ watch( ...@@ -361,7 +361,7 @@ watch(
font-size: 14px; font-size: 14px;
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: 'Regular'; font-family: "Regular";
.details-icon-cl { .details-icon-cl {
width: 30px; width: 30px;
fill: var(--td-search-btn-back-1); fill: var(--td-search-btn-back-1);
...@@ -437,7 +437,7 @@ watch( ...@@ -437,7 +437,7 @@ watch(
border-bottom-left-radius: @border-radius; border-bottom-left-radius: @border-radius;
border-bottom-right-radius: @border-radius; border-bottom-right-radius: @border-radius;
.t-tabs__nav-item-text-wrapper { .t-tabs__nav-item-text-wrapper {
font-family: 'Medium'; font-family: "Medium";
} }
.t-tabs__header { .t-tabs__header {
background-color: var(--td--right-back-color-2); background-color: var(--td--right-back-color-2);
......
views/token/rightDetailHeader/index.tsx
import { defineComponent, computed } from 'vue'; import { defineComponent, computed } from "vue";
import { useI18n } from 'vue-i18n'; import { useI18n } from "vue-i18n";
import { StarFilledIcon } from 'tdesign-icons-vue-next'; import CopySvg from "/public/images/svg/rightDetail/copy.svg";
import CopySvg from '/public/images/svg/rightDetail/copy.svg'; import useCopy from "@/hooks/useCopy";
import useCopy from '@/hooks/useCopy'; import * as Cache from "@/utils/cache";
import * as Cache from '@/utils/cache'; import "./index.less";
import './index.less'; import CollectionSvg2 from "/public/images/svg/rightDetail/colection2.svg";
import CollectionSvg2 from '/public/images/svg/rightDetail/colection2.svg'; import CollectionSvg3 from "/public/images/svg/rightDetail/collection-yes.svg";
import CollectionSvg3 from '/public/images/svg/rightDetail/collection-yes.svg'; import Price from "./price.vue";
import Price from './price.vue';
export default defineComponent({ export default defineComponent({
props: { props: {
tokenInfo: Object as any, tokenInfo: Object as any,
...@@ -17,7 +16,7 @@ export default defineComponent({ ...@@ -17,7 +16,7 @@ export default defineComponent({
tb: String, tb: String,
currentPath: String, currentPath: String,
}, },
emits: ['update:isInCollection'], emits: ["update:isInCollection"],
setup(props, { emit }) { setup(props, { emit }) {
const { t } = useI18n(); const { t } = useI18n();
// 收藏表格是否更新 // 收藏表格是否更新
...@@ -33,24 +32,24 @@ export default defineComponent({ ...@@ -33,24 +32,24 @@ export default defineComponent({
}, },
]); ]);
} }
emit('update:isInCollection', false); emit("update:isInCollection", false);
} else { } else {
Cache.setCollection({ Cache.setCollection({
hash: tb, hash: tb,
symbol: tokenInfo.symbol, symbol: tokenInfo.symbol,
path: currentPath, path: currentPath,
}); });
emit('update:isInCollection', true); emit("update:isInCollection", true);
} }
// 通知select中的收藏数据更新 // 通知select中的收藏数据更新
CollectionCl.value += 1; CollectionCl.value += 1;
}; };
const r24hColor = () => { const r24hColor = () => {
if (props.r24h) { if (props.r24h) {
if (props.r24h[0] === '-') { if (props.r24h[0] === "-") {
return '#f85260'; return "#f85260";
} else { } else {
return '#23ab94'; return "#23ab94";
} }
} }
}; };
...@@ -58,15 +57,15 @@ export default defineComponent({ ...@@ -58,15 +57,15 @@ export default defineComponent({
const { tokenInfo } = props; const { tokenInfo } = props;
try { try {
if (Object.keys(tokenInfo).length) { if (Object.keys(tokenInfo).length) {
if ('chat' in tokenInfo) { if ("chat" in tokenInfo) {
return tokenInfo.chat.img; return tokenInfo.chat.img;
} else { } else {
return '/images/img/default-avatar.png'; return "/images/img/default-avatar.png";
} }
} }
} catch (e) { } catch (e) {
console.log(e); console.log(e);
return '/images/img/default-avatar.png'; return "/images/img/default-avatar.png";
} }
}); });
return () => ( return () => (
...@@ -80,7 +79,7 @@ export default defineComponent({ ...@@ -80,7 +79,7 @@ export default defineComponent({
</div> </div>
<div class="address-info"> <div class="address-info">
<span class="address-info-item"> <span class="address-info-item">
<span>{t('TableList.token')}</span> <span>{t("TableList.token")}</span>
<span class="address">：{props.tokenInfo.tokenSub}</span> <span class="address">：{props.tokenInfo.tokenSub}</span>
<span onClick={doCopy.bind(this, props.tokenInfo.token)}> <span onClick={doCopy.bind(this, props.tokenInfo.token)}>
<CopySvg></CopySvg> <CopySvg></CopySvg>
...@@ -89,7 +88,7 @@ export default defineComponent({ ...@@ -89,7 +88,7 @@ export default defineComponent({
</div> </div>
<div class="address-info margin"> <div class="address-info margin">
<span class="address-info-item"> <span class="address-info-item">
<span>{t('TableList.pool')}</span> <span>{t("TableList.pool")}</span>
<span class="address">：{props.tokenInfo.tbnameSub}</span> <span class="address">：{props.tokenInfo.tbnameSub}</span>
<span onClick={doCopy.bind(this, props.tokenInfo.n_tb)}> <span onClick={doCopy.bind(this, props.tokenInfo.n_tb)}>
<CopySvg></CopySvg> <CopySvg></CopySvg>
...@@ -120,15 +119,13 @@ export default defineComponent({ ...@@ -120,15 +119,13 @@ export default defineComponent({
<div class="filled-star-box"> <div class="filled-star-box">
<span> <span>
{props.isInCollection ? ( {props.isInCollection ? (
<CollectionSvg3 <span onClick={collectData}>
class="filled-star" <CollectionSvg3 class="filled-star" />
onClick={collectData} </span>
/>
) : ( ) : (
<CollectionSvg2 <span onClick={collectData}>
onClick={collectData} <CollectionSvg2 class="filled-star-on"></CollectionSvg2>
class="filled-star-on" </span>
></CollectionSvg2>
)} )}
</span> </span>
</div> </div>
......
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