Commit 307db5b4 by lei

1

parent a0bbd5f4
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -2,14 +2,12 @@ import { defineNuxtPlugin } from "#app";
import {
HeadMenu as THeadMenu,
MenuItem as TMenuItem,
Icon as TIcon,
Button as TButton,
Header as Theader,
Footer as TFooter,
Content as TContent,
Layout as Tlayout,
Input as TInput,
Drawer as TDrawer,
Loading as TLoading,
TabPanel as TTabPanel,
Tabs as TTabs,
......@@ -22,7 +20,6 @@ import {
Option as TOption,
Switch as TSwitch,
RadioGroup as TRadioGroup,
Pagination as TPagination,
RadioButton as TRadioButton,
InputNumber as TInputNumber,
DatePicker as TDatePicker,
......@@ -37,14 +34,12 @@ import {
const components = [
THeadMenu,
TMenuItem,
TIcon,
TButton,
Theader,
TFooter,
TContent,
Tlayout,
TInput,
TDrawer,
TLoading,
TTabPanel,
TTabs,
......@@ -57,7 +52,6 @@ const components = [
TOption,
TSwitch,
TRadioGroup,
TPagination,
TRadioButton,
TInputNumber,
TDatePicker,
......@@ -69,11 +63,8 @@ const components = [
TSwiper,
TSwiperItem,
];
// 无法循环挂载的组件--单独拎出来
// const oncomponents = [TTable];
export default defineNuxtPlugin((nuxtApp) => {
components.forEach((item: any) => {
nuxtApp.vueApp.use(item);
});
// nuxtApp.vueApp.component('t-table', oncomponents[0]);
});
......@@ -11,7 +11,7 @@
<div class="input-icon">
<SearchSvg class="icon1"></SearchSvg>
</div>
<div class="circular-box">{{ $t('Search.search') }}</div>
<div class="circular-box">{{ $t("Search.search") }}</div>
</template>
</t-input>
<ClientOnly>
......@@ -40,7 +40,7 @@
</template>
<template #suffixIcon>
<div class="Cancel" @click="selectDialogVisible = false">
{{ $t('user.Cancel') }}
{{ $t("user.Cancel") }}
</div>
</template>
</t-input>
......@@ -55,7 +55,7 @@
@onChange="onChange"
></SearchRecords>
<div class="TopSearch">
{{ $t('tokenInfo.TopSearch') }}
{{ $t("tokenInfo.TopSearch") }}
</div>
<SearchList :options="topList"></SearchList>
<div v-if="isLoading" class="loading-center2">
......@@ -89,22 +89,22 @@
</template>
<script setup lang="ts">
import request from '@/utils/request';
import request from "@/utils/request";
import {
parseCoinAmount,
parsePercent,
RemoveSpaces,
debounce,
} from '@/utils/tool';
import SearchSvg from '/public/images/svg/header/searchIcon.svg';
import SearchSvg2 from '/public/images/svg/search/search.svg';
import { WebS } from '@/utils/TokenTrans';
import SearchRecords from './searchRecords.vue';
import SearchList from './searchList.vue';
import * as Cache from '@/utils/cache';
const keyword = ref('');
const inputPlaceholder = ref('');
const visible = ref(false);
} from "@/utils/tool";
import SearchSvg from "/public/images/svg/header/searchIcon.svg";
import SearchSvg2 from "/public/images/svg/search/search.svg";
import { WebS } from "@/utils/TokenTrans";
import SearchRecords from "./searchRecords.vue";
import SearchList from "./searchList.vue";
import * as Cache from "@/utils/cache";
import { Drawer as TDrawer } from "tdesign-vue-next";
const keyword = ref("");
const inputPlaceholder = ref("");
const selectDialogVisible = ref(false);
const autofocus = ref(false);
// 搜索结果是否还有其他页数
......@@ -116,25 +116,25 @@ const chooseSearchTwo = ref(false);
// 加载更多样式显示隐藏
const loadingMore = ref(false);
// 成功发起搜索请求的value
const successValue = ref('');
const successValue = ref("");
// 当前显示的列表状态--search-top
const currentSearchType = ref('top');
const currentSearchType = ref("top");
const showSelect = () => {
selectDialogVisible.value = true;
// 显示第二个搜索框
chooseSearchTwo.value = true;
};
const current = ref('all');
const current = ref("all");
const resultList = ref([]);
const topList = ref([]);
const isLoading = ref(false);
const isFirst = ref(true);
const darg = () => {
let dom = document.getElementById('search-token-list');
let dom = document.getElementById("search-token-list");
if (dom !== null) {
dom.addEventListener('scroll', () => {
dom.addEventListener("scroll", () => {
let domHeight = dom.scrollHeight;
let domTop = dom.scrollTop;
let cliheight = dom.clientHeight;
......@@ -167,7 +167,7 @@ const onChange = (value: string) => {
getTokenList();
};
const getTokenList = () => {
if (keyword.value.trim() === '' || keyword.value.length == 1) {
if (keyword.value.trim() === "" || keyword.value.length == 1) {
return;
}
if (!loadingMore.value) {
......@@ -176,7 +176,7 @@ const getTokenList = () => {
defalutPage.value = 1;
}
successValue.value = keyword.value;
currentSearchType.value = 'search';
currentSearchType.value = "search";
//
let obj = WebS(RemoveSpaces(keyword.value));
request
......@@ -229,10 +229,10 @@ watch(
() => keyword.value,
(v) => {
if (!v) {
currentSearchType.value = 'top';
currentSearchType.value = "top";
isLoading.value = false;
} else {
currentSearchType.value = 'search';
currentSearchType.value = "search";
}
}
);
......@@ -241,26 +241,26 @@ const resultFilter = (list) => {
let newList = list;
newList.forEach((item, index) => {
if (item.name.length >= 20) {
item.name = item.name.substring(0, 20) + '...';
item.name = item.name.substring(0, 20) + "...";
}
item.up = '$' + parseCoinAmount(item.up);
item.up = "$" + parseCoinAmount(item.up);
item.Newr24h = parsePercent(item.r24h);
item.r24h = item.r24h.toFixed(3);
// 将token转换为常用样式
item.filterToken =
item.token.substring(0, 6) +
'...' +
"..." +
item.token.substring(item.token.length - 4);
item.filterPool =
item.tb_name.substring(0, 6) +
'...' +
"..." +
item.tb_name.substring(item.tb_name.length - 4);
if (item.Newr24h[0] !== '-') {
item.Newr24h = '+' + item.Newr24h;
if (item.Newr24h[0] !== "-") {
item.Newr24h = "+" + item.Newr24h;
}
// 判断当前token是否已收藏
let res = localStorage.getItem('COLLECTION_LIST');
let res = localStorage.getItem("COLLECTION_LIST");
if (!res) {
item.isStar = false;
} else {
......@@ -278,25 +278,25 @@ const doSeach = debounce(getTokenList, 500);
const getPopularList = async () => {
try {
isLoading.value = true;
let res: any = await request.get('/score');
let res: any = await request.get("/score");
if (res.list.length) {
res.list.forEach((item: PopularItem) => {
// 增加一个带省略号的格式
item.filterPool =
item.pool.substring(0, 4) +
'...' +
"..." +
item.pool.substring(item.pool.length - 4);
//
item.tb_name = item.pool;
item.pool = item.pSymbol;
item.filterToken =
item.token.substring(0, 4) +
'...' +
"..." +
item.token.substring(item.token.length - 4);
item.up = '$' + parseCoinAmount(item.price);
item.up = "$" + parseCoinAmount(item.price);
item.Newr24h = parsePercent(item.radio);
if (item.Newr24h[0] !== '-') {
item.Newr24h = '+' + item.Newr24h;
if (item.Newr24h[0] !== "-") {
item.Newr24h = "+" + item.Newr24h;
}
// 判断当前token是否已收藏
let res = Cache.getCollectionList();
......@@ -342,8 +342,8 @@ watch(
);
</script>
<style lang="less">
@import '@/style/variables.less';
@import '@/style/flex.less';
@import "@/style/variables.less";
@import "@/style/flex.less";
.header-menu-search {
display: flex;
margin-left: 16px;
......@@ -359,7 +359,7 @@ watch(
margin: 0 1rem 0 0.6rem;
color: var(--td-Search-info-color-2);
font-size: @font-size-s;
font-family: 'Regular';
font-family: "Regular";
}
.header-search {
margin-left: 20px;
......@@ -428,7 +428,7 @@ watch(
.Cancel {
width: 60px;
height: 100%;
font-family: 'Medium';
font-family: "Medium";
font-weight: 500;
font-size: 14px;
border-left: var(--new-border-2);
......
<template>
<header class="login-header">
<logo-full-icon class="logo" />
<div class="operations-container">
<t-button
theme="default"
shape="square"
variant="text"
@click="navToGitHub"
>
<t-icon name="logo-github" class="icon" />
</t-button>
<t-button
theme="default"
shape="square"
variant="text"
@click="navToHelper"
>
<t-icon name="help-circle" class="icon" />
</t-button>
<t-button
theme="default"
shape="square"
variant="text"
@click="toggleSettingPanel"
>
<t-icon name="setting" class="icon" />
</t-button>
</div>
</header>
</template>
<script setup lang="ts">
import LogoFullIcon from '@/assets/assets-logo-full.svg?component';
const toggleSettingPanel = () => {
// store.commit('setting/toggleSettingPanel', true);
};
const navToGitHub = () => {
window.open('https://github.com/tencent/tdesign-vue-next-starter');
};
const navToHelper = () => {
window.open('http://tdesign.tencent.com/starter/docs/get-started');
};
</script>
<style lang="less" scoped>
@import '@/style/variables.less';
@import '@/style/flex.less';
.login-header {
height: 64px;
padding: 0 24px;
.dja(space-between, center);
backdrop-filter: blur(5px);
color: @text-color-primary;
.logo {
width: 138px;
height: 48px;
}
.operations-container {
.da();
.t-button {
margin-left: 16px;
}
.icon {
height: 20px;
width: 20px;
padding: 6px;
box-sizing: content-box;
&:hover {
cursor: pointer;
}
}
}
}
</style>
<template>
<div class="form-container">
<div class="title-box">
<span class="span1">{{ $t('login.SignIn') }}</span>
<span class="span1">{{ $t("login.SignIn") }}</span>
</div>
<div class="Forgot-box" @click="findPwd">{{ $t('login.forgot') }}</div>
<div class="Forgot-box" @click="findPwd">{{ $t("login.forgot") }}</div>
<t-form
class="login-form"
ref="form"
......@@ -53,14 +53,14 @@
type="submit"
class="custom_button_back_border"
>
{{ $t('login.loginBtn') }}
{{ $t("login.loginBtn") }}
</t-button>
</t-form-item>
<div class="go-find">
<div class="register">
{{ $t('login.noAccount') }}
{{ $t("login.noAccount") }}
<span class="link" @click="goRegister">{{
$t('login.goRegister')
$t("login.goRegister")
}}</span>
</div>
</div>
......@@ -69,11 +69,12 @@
</template>
<script setup lang="ts">
import { LoadingPlugin, MessagePlugin } from 'tdesign-vue-next';
import md5 from 'md5';
import request from '@/utils/request';
import { LoadingPlugin, MessagePlugin } from "tdesign-vue-next";
import md5 from "md5";
import request from "@/utils/request";
import { Icon as TIcon } from "tdesign-vue-next";
const emit = defineEmits(['registerSuccess', 'go']);
const emit = defineEmits(["registerSuccess", "go"]);
// 用户token
const userToken = useUserToken();
interface FormData {
......@@ -81,18 +82,18 @@ interface FormData {
password?: string;
}
const formData = ref<FormData>({
email: '',
password: '',
email: "",
password: "",
});
const Cookie = useCookie('userCookie');
const Cookie = useCookie("userCookie");
const formRules = computed(() => {
let rules = {
email: [
{ required: true, message: 'email required', type: 'error' },
{ email: true, message: 'email error', type: 'error' },
{ required: true, message: "email required", type: "error" },
{ email: true, message: "email error", type: "error" },
],
password: [
{ required: true, message: 'password required', type: 'error' },
{ required: true, message: "password required", type: "error" },
// { min: 6, message: '至少需要6位', type: 'error' },
],
};
......@@ -112,30 +113,30 @@ const onSubmit = async ({ validateResult }) => {
LoadingPlugin(true);
let data: any;
try {
data = await request.post('/api/auth/login', params);
data = await request.post("/api/auth/login", params);
userToken.value = data.data.access_token;
// 再存到cookie中
Cookie.value = data.data.access_token;
LoadingPlugin(false);
MessagePlugin.success('success');
MessagePlugin.success("success");
router.push({
path: '/',
path: "/",
});
} catch (e) {
LoadingPlugin(false);
MessagePlugin.warning(data.msg ?? '登录失败');
MessagePlugin.warning(data.msg ?? "登录失败");
}
}
};
const findPwd = () => {
emit('go', 'reset');
emit("go", "reset");
};
const goRegister = () => {
emit('go', 'register');
emit("go", "register");
};
</script>
<style lang="less" scoped>
@import '@/style/flex.less';
@import "@/style/flex.less";
.form-container {
.title-box {
width: 70%;
......
......@@ -8,7 +8,7 @@
@submit="onSubmit"
>
<div class="title-box">
<span class="span1">{{ $t('login.RegisterAccount') }}</span>
<span class="span1">{{ $t("login.RegisterAccount") }}</span>
</div>
<t-form-item name="email">
<t-input
......@@ -71,7 +71,7 @@
:disabled="countDown > 0"
>{{
countDown == 0
? $t('login.SendVerificationCode')
? $t("login.SendVerificationCode")
: `${countDown}秒后可重发`
}}</t-button
>
......@@ -98,9 +98,9 @@
<t-form-item class="check-container" name="checked">
<t-checkbox v-model="formData.checked"
>{{ $t('login.haveRead') }}
>{{ $t("login.haveRead") }}
</t-checkbox>
<span class="link">{{ $t('login.UserPrivacy') }}</span>
<span class="link">{{ $t("login.UserPrivacy") }}</span>
</t-form-item>
<t-form-item class="submit">
<t-button
......@@ -109,22 +109,24 @@
type="submit"
class="custom_button_back_border"
>
{{ $t('login.registerBtn') }}
{{ $t("login.registerBtn") }}
</t-button>
</t-form-item>
<div class="go-login" @click="goLogin">
{{ $t('login.haveAccount') }},
<span class="go-login-span">{{ $t('login.goLogin') }}</span>
{{ $t("login.haveAccount") }},
<span class="go-login-span">{{ $t("login.goLogin") }}</span>
</div>
</t-form>
</template>
<script setup lang="ts">
import { MessagePlugin, LoadingPlugin } from 'tdesign-vue-next';
import request from '@/utils/request';
import md5 from 'md5';
import { useCounter } from '@/hooks';
import { MessagePlugin, LoadingPlugin } from "tdesign-vue-next";
import request from "@/utils/request";
import md5 from "md5";
import { useCounter } from "@/hooks";
import { Icon as TIcon } from "tdesign-vue-next";
const [countDown, handleCounter] = useCounter();
const props = defineProps({
InvitCode: String,
......@@ -135,25 +137,25 @@ onMounted(() => {
}
});
const INITIAL_DATA = {
email: '',
password: '',
code: '',
password2: '',
email: "",
password: "",
code: "",
password2: "",
checked: false,
invite_code: '',
invite_code: "",
};
const formData = ref({ ...INITIAL_DATA });
const showPsw = ref(false);
const showPsw2 = ref(false);
const form = ref(null);
const emit = defineEmits(['go']);
const emit = defineEmits(["go"]);
// 数据校验
const repasswordValidator = (value) => {
if (formData.value.password === value) {
return { result: true };
} else {
return { result: false, message: '两次密码输入不一致', type: 'error' };
return { result: false, message: "两次密码输入不一致", type: "error" };
}
};
// 发送验证码
......@@ -170,20 +172,20 @@ const sendCode = () => {
/[a-zA-Z0-9]+([-_.][A-Za-zd]+)*@([a-zA-Z0-9]+[-.])+[A-Za-zd]{2,5}$/;
if (!reg.test(formData.value.email)) {
MessagePlugin.closeAll();
MessagePlugin.warning('请输入正确的邮箱');
MessagePlugin.warning("请输入正确的邮箱");
return;
}
handleCounter();
request
.post('api/send/email', {
.post("api/send/email", {
email: formData.value.email,
scenes: 'reg',
scenes: "reg",
})
.then((res: any) => {
if (res.msg === 'success') {
MessagePlugin.success('验证码发送成功,请注意查收');
if (res.msg === "success") {
MessagePlugin.success("验证码发送成功,请注意查收");
} else {
MessagePlugin.warning('发送失败,请稍后再试');
MessagePlugin.warning("发送失败,请稍后再试");
}
});
} catch (e) {
......@@ -192,35 +194,35 @@ const sendCode = () => {
};
const FORM_RULES = {
email: [
{ required: true, message: 'email required', type: 'error' },
{ email: true, message: 'email error', type: 'error' },
{ required: true, message: "email required", type: "error" },
{ email: true, message: "email error", type: "error" },
],
password: [
{ required: true, message: 'password required', type: 'error' },
{ required: true, message: "password required", type: "error" },
// { min: 6, message: '至少需要6位', type: 'error' },
],
password2: [
{ required: true, message: 'confirm password required', type: 'error' },
{ required: true, message: "confirm password required", type: "error" },
{ validator: repasswordValidator },
],
};
const onSubmit = async ({ validateResult }) => {
if (validateResult === true) {
if (!formData.value.checked) {
MessagePlugin.error('请同意用户隐私政策');
MessagePlugin.error("请同意用户隐私政策");
return;
}
try {
LoadingPlugin(true);
const data: any = await request.post('/api/auth/register', {
const data: any = await request.post("/api/auth/register", {
email: formData.value.email,
code: formData.value.code,
password: md5(formData.value.password),
invite_code: formData.value.invite_code,
});
if (data.status) {
MessagePlugin.success('注册成功');
emit('go', 'login');
MessagePlugin.success("注册成功");
emit("go", "login");
} else {
MessagePlugin.warning(data.msg);
}
......@@ -233,7 +235,7 @@ const onSubmit = async ({ validateResult }) => {
};
const goLogin = (val) => {
emit('go', 'login');
emit("go", "login");
};
</script>
......
<template>
<div class="login-box-header">
<div class="back" @click="goBack">
<arrow-left-icon /><span>{{ $t('login.backBtn') }}</span>
<arrow-left-icon /><span>{{ $t("login.backBtn") }}</span>
</div>
<div class="title">{{ $t('login.PasswordReset') }}</div>
<div class="title">{{ $t("login.PasswordReset") }}</div>
</div>
<t-form
ref="form"
......@@ -41,7 +41,7 @@
>
{{
countDown == 0
? $t('login.SendVerificationCode')
? $t("login.SendVerificationCode")
: `${countDown}秒后可重发`
}}
</t-button>
......@@ -89,33 +89,35 @@
<t-form-item class="check-container" name="checked">
<t-checkbox v-model="formData.checked"
>{{ $t('login.readAndAgree') }}
>{{ $t("login.readAndAgree") }}
</t-checkbox>
<span class="link" @click="goStatement">{{
$t('login.UserPrivacy')
$t("login.UserPrivacy")
}}</span>
</t-form-item>
<t-form-item class="submit">
<t-button block size="large" type="submit">
{{ $t('login.ConfirmReset') }}
{{ $t("login.ConfirmReset") }}
</t-button>
</t-form-item>
</t-form>
</template>
<script setup lang="ts">
import { MessagePlugin, LoadingPlugin } from 'tdesign-vue-next';
import { useCounter } from '@/hooks';
import { ArrowLeftIcon } from 'tdesign-icons-vue-next';
import request from '@/utils/request';
import md5 from 'md5';
import { useI18n } from 'vue-i18n';
import { MessagePlugin, LoadingPlugin } from "tdesign-vue-next";
import { useCounter } from "@/hooks";
import { ArrowLeftIcon } from "tdesign-icons-vue-next";
import request from "@/utils/request";
import md5 from "md5";
import { useI18n } from "vue-i18n";
import { Icon as TIcon } from "tdesign-vue-next";
const { t } = useI18n();
const INITIAL_DATA = {
email: '',
vcCode: '',
password: '',
password2: '',
email: "",
vcCode: "",
password: "",
password2: "",
checked: false,
};
......@@ -129,7 +131,7 @@ const router = useRouter();
const btnLoading = ref(false);
const [countDown, handleCounter] = useCounter();
const sendVerfiyCode = async () => {
const res = await form.value.validate({ fields: ['email'] });
const res = await form.value.validate({ fields: ["email"] });
if (res !== true) {
return;
}
......@@ -139,9 +141,9 @@ const sendVerfiyCode = async () => {
btnLoading.value = true;
// 重置验证码
request
.post('/api/send/email', {
.post("/api/send/email", {
email: formData.value.email,
scenes: 'reset',
scenes: "reset",
})
.then((data) => {
handleCounter();
......@@ -157,43 +159,43 @@ const repasswordValidator = (value) => {
if (formData.value.password === value) {
return { result: true };
} else {
return { result: false, message: t('login.notMatch'), type: 'error' };
return { result: false, message: t("login.notMatch"), type: "error" };
}
};
const FORM_RULES = {
email: [
{ required: true, message: t('login.EMailRequired'), type: 'error' },
{ email: true, message: t('login.entercorrectemail'), type: 'error' },
{ required: true, message: t("login.EMailRequired"), type: "error" },
{ email: true, message: t("login.entercorrectemail"), type: "error" },
],
vcCode: [
{ required: true, message: t('login.Verificatioquired'), type: 'error' },
{ min: 4, message: t('login.Captchaerror'), type: 'error' },
{ required: true, message: t("login.Verificatioquired"), type: "error" },
{ min: 4, message: t("login.Captchaerror"), type: "error" },
],
password: [
{ required: true, message: t('login.PasswordRequired'), type: 'error' },
{ min: 6, message: t('login.Ateeded'), type: 'error' },
{ required: true, message: t("login.PasswordRequired"), type: "error" },
{ min: 6, message: t("login.Ateeded"), type: "error" },
],
password2: [
{
required: true,
message: t('login.ConfirmPasswordRequired'),
type: 'error',
message: t("login.ConfirmPasswordRequired"),
type: "error",
},
{ validator: repasswordValidator },
],
};
const emit = defineEmits(['go']);
const emit = defineEmits(["go"]);
const onSubmit = async ({ validateResult }) => {
if (validateResult === true) {
if (!formData.value.checked) {
MessagePlugin.error('请同意用户隐私政策');
MessagePlugin.error("请同意用户隐私政策");
return;
}
try {
LoadingPlugin(true);
const data: any = await request.post('/api/password/reset', {
const data: any = await request.post("/api/password/reset", {
email: formData.value.email,
code: formData.value.vcCode,
password: md5(formData.value.password),
......@@ -202,7 +204,7 @@ const onSubmit = async ({ validateResult }) => {
if (data.code == 0) {
MessagePlugin.success(data.data);
}
emit('go', 'login');
emit("go", "login");
} catch (e) {
console.log(e);
} finally {
......@@ -211,15 +213,15 @@ const onSubmit = async ({ validateResult }) => {
}
};
const goBack = () => {
emit('go', 'login');
emit("go", "login");
};
const goStatement = () => {
console.log(1);
};
</script>
<style lang="less" scoped>
@import '@/style/flex.less';
@import '@/style/variables.less';
@import "@/style/flex.less";
@import "@/style/variables.less";
.login-box-header {
width: 360px;
height: 60px;
......
......@@ -24,7 +24,9 @@
</div>
</template>
<script setup lang="tsx">
import CollectionTable from './collectionTable.vue';
import CollectionTable from "./collectionTable.vue";
import { Drawer as TDrawer } from "tdesign-vue-next";
const props = defineProps({
visible: Boolean,
token: String,
......@@ -36,9 +38,9 @@ watch(
dialogVisible.value = v;
}
);
const emit = defineEmits(['update:visible']);
const emit = defineEmits(["update:visible"]);
const doClose = () => {
emit('update:visible', false);
emit("update:visible", false);
};
</script>
<style lang="less" scoped>
......
......@@ -41,6 +41,7 @@ import request from "@/utils/request";
import { MessagePlugin } from "tdesign-vue-next";
import { useI18n } from "vue-i18n";
import { Table as TTable } from "tdesign-vue-next";
import { Pagination as TPagination } from "tdesign-vue-next";
const { t } = useI18n();
const columns = computed(() => [
{
......
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