Commit 52dd6dee by lei

1

parent 7c51f718
...@@ -3,11 +3,10 @@ ...@@ -3,11 +3,10 @@
--font-size-s: 12px; --font-size-s: 12px;
--font-size-base: 14px; --font-size-base: 14px;
--font-size-l: 16px; --font-size-l: 16px;
--font-size-xxl: 36px;
} }
:root, :root,
:root[theme-mode='light'] { :root[theme-mode="light"] {
--td-brand-color-8: rgb(40, 126, 255); --td-brand-color-8: rgb(40, 126, 255);
--td-brand-color-btn-1: rgb(240, 243, 250); --td-brand-color-btn-1: rgb(240, 243, 250);
--td-brand-color-icon-1: rgb(77, 77, 77); --td-brand-color-icon-1: rgb(77, 77, 77);
...@@ -112,7 +111,7 @@ ...@@ -112,7 +111,7 @@
--new-color-9: #1a1a1a; --new-color-9: #1a1a1a;
} }
:root[theme-mode='dark'] { :root[theme-mode="dark"] {
--td-brand-color-btn-1: rgb(88, 88, 88); --td-brand-color-btn-1: rgb(88, 88, 88);
--td-brand-color-icon-1: white; --td-brand-color-icon-1: white;
--td-search-back-2: #29353d; --td-search-back-2: #29353d;
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="s-footer"> <div class="s-footer">
<div class="left-box"> <div class="left-box">
<div class="des-content"> <div class="des-content">
<logoSvg></logoSvg> <img src="/images/svg/footer/footerLogo.svg" alt="" />
<span>{{ $t("footer.Introduce") }} </span> <span>{{ $t("footer.Introduce") }} </span>
</div> </div>
</div> </div>
...@@ -37,7 +37,6 @@ ...@@ -37,7 +37,6 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { tgUrl, FooterImg } from "@/utils/open"; import { tgUrl, FooterImg } from "@/utils/open";
import logoSvg from "/public/images/svg/footer/footerLogo.svg";
import emailSvg from "/public/images/svg/footer/email.svg"; import emailSvg from "/public/images/svg/footer/email.svg";
import tgSvg from "/public/images/svg/footer/tg.svg"; import tgSvg from "/public/images/svg/footer/tg.svg";
</script> </script>
...@@ -55,6 +54,7 @@ import tgSvg from "/public/images/svg/footer/tg.svg"; ...@@ -55,6 +54,7 @@ import tgSvg from "/public/images/svg/footer/tg.svg";
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
overflow: hidden; overflow: hidden;
user-select: none;
.left-box { .left-box {
width: 30%; width: 30%;
.da(); .da();
...@@ -74,7 +74,7 @@ import tgSvg from "/public/images/svg/footer/tg.svg"; ...@@ -74,7 +74,7 @@ import tgSvg from "/public/images/svg/footer/tg.svg";
span { span {
line-height: 100px; line-height: 100px;
font-weight: bold; font-weight: bold;
color: black; color: var(--td-Search-info-color-1);
font-size: @font-size-xl; font-size: @font-size-xl;
font-family: "bold"; font-family: "bold";
} }
...@@ -101,7 +101,7 @@ import tgSvg from "/public/images/svg/footer/tg.svg"; ...@@ -101,7 +101,7 @@ import tgSvg from "/public/images/svg/footer/tg.svg";
.right-title { .right-title {
line-height: 100px; line-height: 100px;
font-weight: bold; font-weight: bold;
color: black; color: var(--td-Search-info-color-1);
font-size: @font-size-xl; font-size: @font-size-xl;
font-family: "bold"; font-family: "bold";
} }
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="custom-chose-chain-box"> <div class="custom-chose-chain-box">
<div class="custom-outer-layer" @click="PopupChange" ref="outerlayer"> <div class="custom-outer-layer" @click="PopupChange" ref="outerlayer">
<img :src="chain_options[ChainImgIndex].img" alt="" class="left-icon" /> <img :src="chain_options[ChainImgIndex].img" alt="" class="left-icon" />
<span class="current-chain-text">{{ chainName }}</span> <span class="current-chain-text">{{ ChainObj.name }}</span>
<span class="right-icon"> <span class="right-icon">
<ChevronDownIcon <ChevronDownIcon
:class="[ :class="[
...@@ -45,7 +45,6 @@ const route = useRoute(); ...@@ -45,7 +45,6 @@ const route = useRoute();
const ChainImgIndex = ref(0); const ChainImgIndex = ref(0);
const ChainObj = ref<any>({}); const ChainObj = ref<any>({});
const chain = useChain(); const chain = useChain();
const chainName = ref("");
// 弹窗隐藏状态 // 弹窗隐藏状态
const PopupVisible = ref(false); const PopupVisible = ref(false);
const outerlayer = ref<HTMLDivElement>(); const outerlayer = ref<HTMLDivElement>();
...@@ -111,13 +110,11 @@ if (Scopedchain) { ...@@ -111,13 +110,11 @@ if (Scopedchain) {
let Obj = filterChainObj("name", Scopedchain, true); let Obj = filterChainObj("name", Scopedchain, true);
if (Obj) { if (Obj) {
ChainObj.value = Obj; ChainObj.value = Obj;
chainName.value = ChainObj.value.name;
ChainImgIndex.value = ChainObj.value.index; ChainImgIndex.value = ChainObj.value.index;
chain.value = Obj.value; chain.value = Obj.value;
} }
} else { } else {
ChainObj.value = filterChainObj("value", chain.value, true); ChainObj.value = filterChainObj("value", chain.value, true);
chainName.value = ChainObj.value.name;
ChainImgIndex.value = ChainObj.value.index; ChainImgIndex.value = ChainObj.value.index;
chain.value = ChainObj.value.value; chain.value = ChainObj.value.value;
} }
...@@ -152,7 +149,6 @@ const selectChange = (v: string) => { ...@@ -152,7 +149,6 @@ const selectChange = (v: string) => {
// 当前链保存到本地 // 当前链保存到本地
window.localStorage.setItem("chain", v); window.localStorage.setItem("chain", v);
chain.value = ChainObj.value.value; chain.value = ChainObj.value.value;
chainName.value = ChainObj.value.name;
ChainImgIndex.value = ChainObj.value.index; ChainImgIndex.value = ChainObj.value.index;
PopupVisible.value = false; PopupVisible.value = false;
}; };
......
<template>
<div>
<ClientOnly>
<t-drawer
class="token-collection-drawer"
v-model:visible="dialogVisible"
attach="body"
:footer="false"
placement="right"
size="364px"
:on-close="doClose"
destroyOnClose
:header="$t('collection.header')"
:showOverlay="false"
:close-btn="true"
:preventScrollThrough="true"
:zIndex="6000"
>
<template #body>
<CollectionTable></CollectionTable>
</template>
</t-drawer>
</ClientOnly>
</div>
</template>
<script setup lang="tsx">
import CollectionTable from "./collectionTable.vue";
import { Drawer as TDrawer } from "tdesign-vue-next";
const props = defineProps({
visible: Boolean,
token: String,
});
const dialogVisible = ref(false);
watch(
() => props.visible,
(v) => {
dialogVisible.value = v;
}
);
const emit = defineEmits(["update:visible"]);
const doClose = () => {
emit("update:visible", false);
};
</script>
<style lang="less" scoped>
.token-collection-drawer {
:deep .t-drawer__content-wrapper {
.t-drawer__body {
padding: 0 !important;
}
}
:deep .t-drawer__close-btn {
z-index: 101;
}
}
</style>
...@@ -496,7 +496,7 @@ const getBaseUrl = () => { ...@@ -496,7 +496,7 @@ const getBaseUrl = () => {
//创建AbortController对象 //创建AbortController对象
const abortController = new AbortController(); const abortController = new AbortController();
// 预取数据 // 预取数据
const { data, refresh } = await useFetch(() => `/v1${chain.value}/indexV1`, { const { data }: any = await useFetch(() => `/v1${chain.value}/indexV1`, {
params: getParams(), params: getParams(),
lazy: true, lazy: true,
// method: "GET", // method: "GET",
......
.custom-submit-social-box {
height: 38px;
border-bottom: var(--new-border-2);
border-left: 1px solid var(--new-border-8);
border-right: 1px solid var(--new-border-8);
box-sizing: border-box;
background-color: var(--td--right-back-color-2);
font-size: 14px;
color: var(--new-color-3);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-family: 'Medium';
.span1 {
padding-left: 4px;
}
}
.custom-set-message-popup-box {
background: var(--custom-body-back-color);
border-radius: 10px;
box-sizing: border-box;
color: var(--td-Search-info-color-1);
.message-popup-title {
font-size: 18px;
}
.message-popup-body {
color: var(--td-Search-info-color-1);
margin-top: 10px;
p {
padding-top: 16px;
margin: 0;
}
}
.message-popup-footer {
text-align: right;
.clear-btn {
background: #9a9a9a;
margin-right: 12px;
}
.submit-btn {
background: #287eff;
}
.t-button {
height: 32px;
color: white;
border-radius: 5px;
border: none;
}
}
}
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 { Dialog as TDialog, Button as TButton } from "tdesign-vue-next";
export default defineComponent({
setup() {
const visible = ref(false);
const { t } = useI18n();
const OpenDialog = () => {
visible.value = true;
};
const closeDialog = () => {
visible.value = false;
};
const submit = () => {
//
window.open(submitInfoLink);
};
const closeBtn = () => {
return <ConnectCloseSvg></ConnectCloseSvg>;
};
return () => (
<div>
<div class="custom-submit-social-box" onClick={OpenDialog}>
<SubmitSvg></SubmitSvg>
<span class="span1">更新社区信息</span>
</div>
<TDialog
footer={false}
v-model:visible={visible.value}
placement="center"
attach="body"
closeBtn={closeBtn}
>
<div class="custom-set-message-popup-box">
<div class="message-popup-title">
{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>
</div>
<div class="message-popup-footer">
<TButton class="clear-btn" onClick={closeDialog}>
{t("user.Cancel")}
</TButton>
<TButton class="submit-btn" onClick={submit}>
{t("home.toSubmit")}
</TButton>
</div>
</div>
</TDialog>
</div>
);
},
});
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
height: height, height: height,
}" }"
> >
{{ getTokenInitials() }} {{ value ? value[0] : "" }}
</div> </div>
</template> </template>
...@@ -22,14 +22,6 @@ const props = withDefaults( ...@@ -22,14 +22,6 @@ const props = withDefaults(
height: "30px", height: "30px",
} }
); );
// 获取token首字母
const getTokenInitials = () => {
const { value } = props;
if (value) {
return value[0];
}
return "";
};
</script> </script>
<style lang="less"> <style lang="less">
......
<template>
<div class="coll-tab">
<t-table
row-key="index"
:data="list"
:columns="columns"
hover
:loading="loading"
@row-click="handleRowClick"
max-height="calc(100vh - 64px)"
>
<template #r24h="{ row }">
<div>
<span :style="{ color: ListenColor(row.r24h) }">
{{ row.r24h }}
</span>
<span class="delete-btn" @click.stop="deleteToken(row.tb)">
<DeleteIcon />
</span>
</div>
</template>
</t-table>
</div>
</template>
<script lang="ts" setup>
import { getCollectionList, deleteCollection } from "@/utils/cache";
import request from "@/utils/request";
import { parseCoinAmount, parsePercent } from "@/utils/tool";
import { DeleteIcon } from "tdesign-icons-vue-next";
import { useI18n } from "vue-i18n";
// import { goDetailK } from '@/utils/router/routerGo';
import { filterChainObj } from "@/constants/UnifiedManagementChain";
import { Table as TTable } from "tdesign-vue-next";
const i18n = useI18n();
const list = ref([]);
const loading = ref(false);
// 表格初始值,就代表数据需要更新
const TableDefault = ref(1);
// 收藏表格是否更新
const CollectionCl = CollectionChange();
// 通知表格收藏图表取消收藏
const CollectionDe = CollectionDelete();
// 当前链
const chain = useChain();
const getList = () => {
loading.value = true;
let collections = getCollectionList();
if (collections === false || collections.length == 0) {
list.value = [];
loading.value = false;
return;
}
let tags = collections.map((item) => item.hash);
request.post("/v1/coinnav/favorites", tags).then((res: any) => {
let tmp = (res || []).filter((item) => item);
tmp.forEach((item, index) => {
item.up = parseCoinAmount(item.up);
if (item.r24h.toString()[0] !== "-") {
item.r24h = "+" + parsePercent(item.r24h);
} else {
item.r24h = parsePercent(item.r24h);
}
item.index = index;
item.tb = collections[index].hash;
item.symbol = collections[index].symbol;
item.path = collections[index].path;
});
list.value = tmp;
loading.value = false;
});
};
watch(
() => CollectionCl.value.isOpen,
(v) => {
if (v) {
if (TableDefault.value !== CollectionCl.value.value) {
getList();
TableDefault.value = CollectionCl.value.value;
} else if (CollectionCl.value.value === 1) {
// 代表第一次请求
getList();
TableDefault.value = 0;
CollectionCl.value.value = 0;
}
}
},
{
immediate: true,
}
);
const deleteToken = (tb) => {
deleteCollection(tb);
getList();
// 通知右侧详情,取消收藏
CollectionDe.value += 1;
};
const ListenColor = computed((value) => {
return function (value) {
if (value[0] === "-") {
return "#f85260";
} else {
return "#23ab94";
}
};
});
const columns = computed(() => {
return [
{
title: i18n.t("collection.name"),
colKey: "tn",
},
{
title: i18n.t("collection.price"),
colKey: "up",
},
{
title: i18n.t("collection.r24h"),
colKey: "r24h",
slot: "r24h",
width: "108px",
},
];
});
const handleRowClick = (item) => {
let Obj = filterChainObj("value", chain.value, true);
let params: any = {
path: Obj.name,
tb:
item.row.tb[0] === "d"
? item.row.tb.slice(1, item.row.tb.length)
: item.row.tb,
};
// goDetailK(params);
};
</script>
<style scoped lang="less">
.coll-tab {
height: 100%;
:deep .t-table {
.t-table--full-height {
height: auto;
}
.t-table__content {
overflow: visible;
}
th,
td {
padding: 10px 12px;
}
tr {
cursor: pointer;
}
.up {
color: #23ab94;
}
.down {
color: #f85260;
}
.delete-btn {
float: right;
width: 22px;
text-align: right;
}
}
}
</style>
...@@ -48,7 +48,7 @@ watch(RightInfo.value, (v) => { ...@@ -48,7 +48,7 @@ watch(RightInfo.value, (v) => {
r24h.value = v.r24h; r24h.value = v.r24h;
up.value = v.up; up.value = v.up;
}); });
const changeChain = (chain) => { const changeChain = (chain: string) => {
currentPath.value = chain; currentPath.value = chain;
}; };
</script> </script>
......
<template>
<div>我加载了</div>
</template>
<script lang="ts" setup></script>
<template> <template>
<div class="personal-details"> <div class="personal-details narrow-scrollbar">
<div class="personal-title"> <div class="personal-title">
<h2>{{ $t("user.PersonalInfo") }}</h2> <h2>{{ $t("user.PersonalInfo") }}</h2>
<div class="personal-userinfo"> <div class="personal-userinfo">
...@@ -149,8 +149,12 @@ const changeUserName = async () => { ...@@ -149,8 +149,12 @@ const changeUserName = async () => {
@import "@/style/flex.less"; @import "@/style/flex.less";
.personal-details { .personal-details {
width: calc(100vw - 410px); width: calc(100vw - 410px);
.box-line { .box-line {
border: 1px solid var(--td-Search-info-border-bottom-2); border: 1px solid var(--td-Search-info-border-bottom-2);
padding: 30px 0 0 50px;
box-sizing: border-box;
overflow-y: auto;
} }
.personal-title { .personal-title {
border: 1px solid var(--td-Search-info-border-bottom-2); border: 1px solid var(--td-Search-info-border-bottom-2);
...@@ -185,8 +189,10 @@ const changeUserName = async () => { ...@@ -185,8 +189,10 @@ const changeUserName = async () => {
} }
} }
.redact-data { .redact-data {
padding: 30px 0 0 50px;
position: relative; position: relative;
& > :last-child {
margin-bottom: 20px;
}
h2 { h2 {
text-align: left; text-align: left;
} }
...@@ -233,10 +239,7 @@ const changeUserName = async () => { ...@@ -233,10 +239,7 @@ const changeUserName = async () => {
} }
} }
.change-btn { .change-btn {
position: absolute; .dj();
bottom: 12px;
left: 50%;
transform: translate(-50%);
.t-button { .t-button {
width: 150px; width: 150px;
height: 41px; height: 41px;
......
...@@ -175,12 +175,12 @@ const getUserInfo = async () => { ...@@ -175,12 +175,12 @@ const getUserInfo = async () => {
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; overflow: hidden;
height: 100%; height: 100%;
padding-top: 20px;
.userinfo-item { .userinfo-item {
width: 355px; width: 355px;
height: 150px; height: 150px;
border: 1px solid var(--td-Search-info-border-bottom-2); border: 1px solid var(--td-Search-info-border-bottom-2);
.da(); .da();
margin-top: 20px;
.userinfo-img { .userinfo-img {
.dja(); .dja();
width: 100px; width: 100px;
...@@ -265,7 +265,11 @@ const getUserInfo = async () => { ...@@ -265,7 +265,11 @@ const getUserInfo = async () => {
} }
.t-tab-panel { .t-tab-panel {
margin: -150px 0 0 40px; margin: -150px 0 0 40px;
height: calc(100vh - 70px); height: calc(100vh - 90px);
& > :first-child {
height: 100%;
overflow-y: auto;
}
} }
} }
} }
......
<template> <template>
<div class="welfare-data"> <div class="welfare-data narrow-scrollbar">
<div class="material-benefits"> <div class="material-benefits">
<h2>{{ $t("user.InvitationBenefits") }}</h2> <h2>{{ $t("user.InvitationBenefits") }}</h2>
<div class="invite-dataItem"> <div class="invite-dataItem">
...@@ -207,8 +207,6 @@ const closeRecordDialog = (value: boolean) => { ...@@ -207,8 +207,6 @@ const closeRecordDialog = (value: boolean) => {
@import "@/style/flex.less"; @import "@/style/flex.less";
.welfare-data { .welfare-data {
border: 1px solid var(--td-Search-info-border-bottom-2); border: 1px solid var(--td-Search-info-border-bottom-2);
width: calc(100vw - 410px);
height: calc(100vh - 70px);
border-radius: 5px; border-radius: 5px;
.credits-exchange { .credits-exchange {
:deep(.t-dialog) { :deep(.t-dialog) {
...@@ -297,7 +295,6 @@ const closeRecordDialog = (value: boolean) => { ...@@ -297,7 +295,6 @@ const closeRecordDialog = (value: boolean) => {
padding: 10px 40px; padding: 10px 40px;
position: relative; position: relative;
.invite-dataItem { .invite-dataItem {
height: 80px;
.dj(space-between); .dj(space-between);
flex-direction: column; flex-direction: column;
.invite-ItemData { .invite-ItemData {
...@@ -333,12 +330,9 @@ const closeRecordDialog = (value: boolean) => { ...@@ -333,12 +330,9 @@ const closeRecordDialog = (value: boolean) => {
} }
} }
.material-item { .material-item {
height: 78%;
.effectivity { .effectivity {
width: 100%;
height: 154px; height: 154px;
border: 1px solid #1890ff; border: 1px solid #1890ff;
border-radius: 5px;
.dj(); .dj();
.effectivity-item1 { .effectivity-item1 {
width: 50%; width: 50%;
...@@ -363,7 +357,6 @@ const closeRecordDialog = (value: boolean) => { ...@@ -363,7 +357,6 @@ const closeRecordDialog = (value: boolean) => {
} }
} }
.regulation { .regulation {
width: 100%;
height: calc(100% - 200px); height: calc(100% - 200px);
border: 1px solid #1890ff; border: 1px solid #1890ff;
border-radius: 5px; border-radius: 5px;
......
...@@ -153,8 +153,6 @@ const closePayDialog = (value: boolean) => { ...@@ -153,8 +153,6 @@ const closePayDialog = (value: boolean) => {
@import "@/style/variables.less"; @import "@/style/variables.less";
@import "@/style/flex.less"; @import "@/style/flex.less";
.Member-Center { .Member-Center {
height: calc(100vh - 70px);
overflow-x: auto;
.Member-item1 { .Member-item1 {
width: calc(100vw - 410px); width: calc(100vw - 410px);
.dj(space-between); .dj(space-between);
...@@ -190,12 +188,12 @@ const closePayDialog = (value: boolean) => { ...@@ -190,12 +188,12 @@ const closePayDialog = (value: boolean) => {
} }
.Member-invite { .Member-invite {
width: 74%; width: 74%;
min-width: 600px;
border-radius: 5px; border-radius: 5px;
border: 1px solid var(--td-Search-info-border-bottom-2); border: 1px solid var(--td-Search-info-border-bottom-2);
.dj(space-between); .dj(space-between);
padding: 20px; padding: 20px;
margin-left: 12px; margin-left: 12px;
position: relative;
.Member-center1 { .Member-center1 {
.dja(space-around,flex-start); .dja(space-around,flex-start);
flex-direction: column; flex-direction: column;
...@@ -229,22 +227,25 @@ const closePayDialog = (value: boolean) => { ...@@ -229,22 +227,25 @@ const closePayDialog = (value: boolean) => {
} }
} }
.Member-center2 { .Member-center2 {
text-align: right; position: absolute;
right: 12px;
top: 12px;
} }
} }
} }
.Member-item2 { .Member-item2 {
min-width: 860px;
margin-top: 30px; margin-top: 30px;
border: 1px solid var(--td-Search-info-border-bottom-2); border: 1px solid var(--td-Search-info-border-bottom-2);
padding: 15px 20px; padding: 15px 20px;
height: calc(80% - 88px); box-sizing: border-box;
h3 { h3 {
text-align: left; text-align: left;
} }
.Member-set-meal { .Member-set-meal {
margin-top: 70px; margin-top: 70px;
.dj(space-around); .dj(space-around);
flex-wrap: wrap;
row-gap: 12px;
.vip-item { .vip-item {
cursor: pointer; cursor: pointer;
width: 300px; width: 300px;
......
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