home主页和AiTools页
This commit is contained in:
125
pages/AIHub/AITools.vue
Normal file
125
pages/AIHub/AITools.vue
Normal file
@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<div class="tools-container">
|
||||
<div class="card" v-for="item in 6">
|
||||
<div class="left">
|
||||
<img src="" />
|
||||
</div>
|
||||
<div class="right">
|
||||
<div>
|
||||
<div class="title-text">
|
||||
AI Diagnostic Tool Analyzes 10M+ Medical Images with 99.5% Accuracy
|
||||
</div>
|
||||
<div class="content-text">
|
||||
Revolutionary AI system detects diseases from X-rays, MRIs, and CT scans using a database of 10
|
||||
million annotated images, supporting early diagnosis in 150 countries.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom-info">
|
||||
<div class="first">
|
||||
<div>
|
||||
<img src="/logo/logo_xs.png" />
|
||||
<span>AI toolkit</span>
|
||||
</div>
|
||||
|
||||
<div class="praise">
|
||||
<img src="/logo/praise.png" />
|
||||
<span>{{praise_count}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="time">
|
||||
<img src="/logo/clock.png" />
|
||||
<span>2025-07-12</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<Pagination :current-page="currentPage" :total-pages="totalPages" @page-change="handlePageChange" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
praise_count: 12,
|
||||
currentPage: 1,
|
||||
totalPages: 10, // 假设总页数为 10
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handlePageChange(pageNumber) {
|
||||
this.currentPage = pageNumber;
|
||||
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card {
|
||||
background: $white;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
padding: 40px 30px;
|
||||
display: flex;
|
||||
margin-bottom: 30px;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.left {
|
||||
img {
|
||||
width: 440px;
|
||||
height: 220px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bottom-info,
|
||||
.right {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
}
|
||||
|
||||
.right {
|
||||
flex-direction: column;
|
||||
|
||||
.title-text {
|
||||
margin-bottom: 14px;
|
||||
font-weight: 600;
|
||||
font-size: $normal-font-size;
|
||||
color: #3A4A65;
|
||||
}
|
||||
|
||||
.content-text {
|
||||
font-weight: 400;
|
||||
font-size: $mid-font-size;
|
||||
color: $grey-color;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-info {
|
||||
color: #C8CFD7;
|
||||
font-size: 15px;
|
||||
|
||||
.first {
|
||||
width: 30%;
|
||||
display: flex;
|
||||
justify-content: space-between
|
||||
}
|
||||
|
||||
img {
|
||||
margin-right: 8px
|
||||
}
|
||||
|
||||
div {
|
||||
@include display-flex;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
22
pages/AIHub/Frameworks.vue
Normal file
22
pages/AIHub/Frameworks.vue
Normal file
@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 组件内容 -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 数据项
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 方法
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
72
pages/AIHub/index.vue
Normal file
72
pages/AIHub/index.vue
Normal file
@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div id="normal-container">
|
||||
<IntegratedLayout>
|
||||
<div class="bread-menu">
|
||||
<span>AI Hub</span>
|
||||
<i class="el-icon-arrow-right"></i>
|
||||
<span class="crumbs gradient-color">{{$route.name}}</span>
|
||||
</div>
|
||||
<div class="top-text">
|
||||
<div class="title">
|
||||
{{$route.name}}
|
||||
</div>
|
||||
<div class="description">
|
||||
A comprehensive collection of cutting-edge AI tools, featuring detailed explanations of their
|
||||
functionalities, practical usage, and real-world application scenarios. Quickly grasp emerging
|
||||
product trends and learn how each tool can be leveraged for work, research, or creative projects.
|
||||
</div>
|
||||
</div>
|
||||
<div class="input">
|
||||
<div class="input-container">
|
||||
<input type="text" placeholder="Please enter the key words">
|
||||
<i class="el-icon-search gradient-color search-icon pointer"></i>
|
||||
</div>
|
||||
</div>
|
||||
<nuxt-child />
|
||||
</IntegratedLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
created() {
|
||||
console.log(this.$route)
|
||||
},
|
||||
methods: {
|
||||
// 方法
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bread-menu {
|
||||
font-size: $mid-font-size;
|
||||
margin: 100px 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: bold;
|
||||
font-size: $huge-font-size1;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: $big-font-size;
|
||||
color: $grey-color;
|
||||
}
|
||||
|
||||
.input {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
.input-container {
|
||||
margin-top: 100px;
|
||||
margin-bottom:60px;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
146
pages/About/About.vue
Normal file
146
pages/About/About.vue
Normal file
@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<div class="text-container">
|
||||
<div class="top">
|
||||
<div class="title">
|
||||
About AIToolsFinder
|
||||
</div>
|
||||
<div class="date">
|
||||
Last updated April 4, 2024
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
How do we process your information?
We process your information to provide, improve, and administer our
|
||||
Services, communicate with you for security and fraud prevention, and comply with the law. We may also
|
||||
process your information for other purposes with your consent. We process your information only when we have
|
||||
a valid legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.
|
||||
How do we process your information?
We process your information to provide, improve, and administer our
|
||||
Services, communicate with you for security and fraud prevention, and comply with the law. We may also
|
||||
process your information for other purposes with your consent. We process your information only when we have
|
||||
a valid legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 数据项
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 方法
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
146
pages/About/Privacy.vue
Normal file
146
pages/About/Privacy.vue
Normal file
@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<div class="text-container">
|
||||
<div class="top">
|
||||
<div class="title">
|
||||
Privacy Policy
|
||||
</div>
|
||||
<div class="date">
|
||||
Last updated April 4, 2024
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
How do we process your information?
We process your information to provide, improve, and administer our
|
||||
Services, communicate with you for security and fraud prevention, and comply with the law. We may also
|
||||
process your information for other purposes with your consent. We process your information only when we have
|
||||
a valid legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.
|
||||
How do we process your information?
We process your information to provide, improve, and administer our
|
||||
Services, communicate with you for security and fraud prevention, and comply with the law. We may also
|
||||
process your information for other purposes with your consent. We process your information only when we have
|
||||
a valid legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 数据项
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 方法
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
146
pages/About/Service.vue
Normal file
146
pages/About/Service.vue
Normal file
@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<div class="text-container">
|
||||
<div class="top">
|
||||
<div class="title">
|
||||
Terms Of Service
|
||||
</div>
|
||||
<div class="date">
|
||||
Last updated April 4, 2024
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
How do we process your information?
We process your information to provide, improve, and administer our
|
||||
Services, communicate with you for security and fraud prevention, and comply with the law. We may also
|
||||
process your information for other purposes with your consent. We process your information only when we have
|
||||
a valid legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.
|
||||
How do we process your information?
We process your information to provide, improve, and administer our
|
||||
Services, communicate with you for security and fraud prevention, and comply with the law. We may also
|
||||
process your information for other purposes with your consent. We process your information only when we have
|
||||
a valid legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.How do we
|
||||
process your information?
We process your information to provide, improve, and administer our Services,
|
||||
communicate with you for security and fraud prevention, and comply with the law. We may also process your
|
||||
information for other purposes with your consent. We process your information only when we have a valid
|
||||
legal reason to do so. Learn more about how we process your information.How do we process your
|
||||
information?
We process your information to provide, improve, and administer our Services, communicate with
|
||||
you for security and fraud prevention, and comply with the law. We may also process your information for
|
||||
other purposes with your consent. We process your information only when we have a valid legal reason to do
|
||||
so. Learn more about how we process your information.How do we process your information?
We process your
|
||||
information to provide, improve, and administer our Services, communicate with you for security and fraud
|
||||
prevention, and comply with the law. We may also process your information for other purposes with your
|
||||
consent. We process your information only when we have a valid legal reason to do so. Learn more about how
|
||||
we process your information.How do we process your information?
We process your information to provide,
|
||||
improve, and administer our Services, communicate with you for security and fraud prevention, and comply
|
||||
with the law. We may also process your information for other purposes with your consent. We process your
|
||||
information only when we have a valid legal reason to do so. Learn more about how we process your
|
||||
information.How do we process your information?
We process your information to provide, improve, and
|
||||
administer our Services, communicate with you for security and fraud prevention, and comply with the law. We
|
||||
may also process your information for other purposes with your consent. We process your information only
|
||||
when we have a valid legal reason to do so. Learn more about how we process your information.
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 数据项
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 方法
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
17
pages/About/index.vue
Normal file
17
pages/About/index.vue
Normal file
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<div id="normal-container">
|
||||
<IntegratedLayout>
|
||||
<nuxt-child />
|
||||
</IntegratedLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'About',
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
71
pages/Home/ToolList.vue
Normal file
71
pages/Home/ToolList.vue
Normal file
@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<div class="list">
|
||||
<div v-for="item in list" class="tools" @click="checkTool(item)">
|
||||
<span class="tool-card" :class="item.active?'checkedBg':''">
|
||||
<span class="content">
|
||||
<img :src="`/logo/${item.img}_${item.active ? 'checkd' : 'un'}.png`" />
|
||||
<span>{{ item.name }}</span>
|
||||
</span>
|
||||
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['list'],
|
||||
data() {
|
||||
return {
|
||||
ischeck: 'check',
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.list.forEach(item => {
|
||||
this.$set(item, 'active', false)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
checkTool(item) {
|
||||
this.list.forEach(i => this.$set(i, 'active', false)) // 重置其他项
|
||||
this.$set(item, 'active', true)
|
||||
this.$emit('tool-selected', item.name) // 发送工具名称
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr); // 4列布局
|
||||
gap: 20px; // 网格间距
|
||||
|
||||
.tools {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.tool-card {
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
padding: 10px 16px;
|
||||
display: inline-block;
|
||||
|
||||
.content {
|
||||
@include display-flex;
|
||||
|
||||
img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tools .checkedBg {
|
||||
color: $white;
|
||||
background: linear-gradient(90deg, $linear-gradient-start 22%, $linear-gradient-end 73%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
153
pages/Home/Toolbar.vue
Normal file
153
pages/Home/Toolbar.vue
Normal file
@ -0,0 +1,153 @@
|
||||
<template>
|
||||
<div :id="id">
|
||||
<div class="bar-list">
|
||||
<div class="top-box">
|
||||
<div>
|
||||
<img :src="`/logo/${tool.img}_check.png`" />
|
||||
<span class="title-text .gradient-color">
|
||||
{{tool.name}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="more pointer" v-if="!tagList.length">
|
||||
View more<i class="el-icon-arrow-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="tagList.length">
|
||||
<div class="tags" ref="tagsContainer" @mousedown="startDrag" @mousemove="onDrag" @mouseup="stopDrag"
|
||||
@mouseleave="stopDrag">
|
||||
<div class="tag-item" v-for="(item,index) in 10">
|
||||
AI Image & illustration Generation
|
||||
</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="more pointer" v-if="tagList.length">
|
||||
View more<i class="el-icon-arrow-right"></i>
|
||||
</div>
|
||||
<div class="item-card">
|
||||
<div class="card-caontainer" v-for="(item,index) in 8">
|
||||
<div class="title">
|
||||
<img src="/logo/collect.png" />
|
||||
<span>
|
||||
Skywork
|
||||
</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
Latest ToolsLatest ToolsLatest ToolsLatest Tools
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['tool','id'],
|
||||
data() {
|
||||
return {
|
||||
isDragging: false,
|
||||
startX: 0,
|
||||
scrollLeft: 0,
|
||||
tagList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
startDrag(e) {
|
||||
this.isDragging = true;
|
||||
this.startX = e.pageX - this.$refs.tagsContainer.offsetLeft;
|
||||
this.scrollLeft = this.$refs.tagsContainer.scrollLeft;
|
||||
},
|
||||
onDrag(e) {
|
||||
if (!this.isDragging) return;
|
||||
e.preventDefault();
|
||||
const x = e.pageX - this.$refs.tagsContainer.offsetLeft;
|
||||
const walk = (x - this.startX) * 2; // 调整滑动速度
|
||||
this.$refs.tagsContainer.scrollLeft = this.scrollLeft - walk;
|
||||
},
|
||||
stopDrag() {
|
||||
this.isDragging = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bar-list {
|
||||
margin: 50px 0;
|
||||
}
|
||||
|
||||
.top-box {
|
||||
@include display-flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.title-text {
|
||||
|
||||
font-weight: 600;
|
||||
font-size: $larg-font-size;
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
gap: 12px;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
// cursor: grab;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
.tag-item {
|
||||
flex-shrink: 0;
|
||||
padding: 10px;
|
||||
@include gradient-border($linear-gradient-start, $linear-gradient-end);
|
||||
// cursor: grab;
|
||||
/* 显示抓取手势 */
|
||||
|
||||
&:active {
|
||||
// cursor: grabbing;
|
||||
/* 抓取中状态 */
|
||||
}
|
||||
}
|
||||
|
||||
.more {
|
||||
text-align: right;
|
||||
color: $grey-color;
|
||||
font-size: $mid-font-size;
|
||||
}
|
||||
|
||||
.item-card {
|
||||
display: grid;
|
||||
gap: 20px;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.card-caontainer {
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
border: 1px solid #E2E8F0;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
color: $main-font-color;
|
||||
font-size: $big-font-size;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
color: $grey-color;
|
||||
// line-height: 30px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
305
pages/Home/index.vue
Normal file
305
pages/Home/index.vue
Normal file
@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<div id="home-page">
|
||||
<IntegratedLayout>
|
||||
<div class="top-title">
|
||||
<div class="first-text gradient-color">
|
||||
AIToolsFinder
|
||||
</div>
|
||||
<div class="second-text">
|
||||
Get global AI tools in one stop
|
||||
</div>
|
||||
<div class="third-text">
|
||||
It includes over a <span class="special">thousand global AI tools</span>, covering writing, images,
|
||||
videos, audio, programming,
|
||||
music, design, chatting, etc., and recommends learning platforms, frameworks and models
|
||||
</div>
|
||||
<div class="input-container">
|
||||
<input type="text" placeholder="Please enter the key words">
|
||||
<i class="el-icon-search gradient-color search-icon pointer"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card flex">
|
||||
<div class="left-card card-box">
|
||||
<el-carousel indicator-position="outside">
|
||||
<el-carousel-item v-for="item in 4" :key="item">
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
|
||||
</div>
|
||||
<div class="right-card card-box">
|
||||
<div class="clearfix">
|
||||
<img src="/logo/hot.png" />
|
||||
Popular Tools
|
||||
</div>
|
||||
<div class="line">
|
||||
|
||||
</div>
|
||||
<div class="pop-item">
|
||||
<div v-for="item in pop_tools" class="box">
|
||||
<div class="img-box">
|
||||
<img src="/logo/bottom-logo.png" />
|
||||
</div>
|
||||
<div>
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tool-list">
|
||||
<ToolList :list="list" @tool-selected="scrollToTool"></ToolList>
|
||||
</div>
|
||||
<div class="line">
|
||||
</div>
|
||||
<div class="toolbar" v-for="tool in list">
|
||||
<Toolbar :tool="tool" :id="`tool-${tool.name}`"></Toolbar>
|
||||
</div>
|
||||
|
||||
</IntegratedLayout>
|
||||
<!-- <el-backtop target=".scroll-container" :bottom="100">
|
||||
<div>
|
||||
<img src="/logo/back-top.png" />
|
||||
</div>
|
||||
</el-backtop> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ToolList from './ToolList.vue'
|
||||
import Toolbar from './Toolbar.vue'
|
||||
export default {
|
||||
name: 'Home',
|
||||
components: {
|
||||
ToolList,
|
||||
Toolbar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pop_tools: [{
|
||||
name: 'Gemini',
|
||||
src: ''
|
||||
},
|
||||
{
|
||||
name: 'Gemini',
|
||||
src: ''
|
||||
},
|
||||
{
|
||||
name: 'Gemini',
|
||||
src: ''
|
||||
},
|
||||
{
|
||||
name: 'Gemini',
|
||||
src: ''
|
||||
},
|
||||
{
|
||||
name: 'Gemini',
|
||||
src: ''
|
||||
},
|
||||
{
|
||||
name: 'Gemini',
|
||||
src: ''
|
||||
},
|
||||
],
|
||||
list: [{
|
||||
name: 'AI Image Tool',
|
||||
img: 'image'
|
||||
},
|
||||
{
|
||||
name: 'AI Office Tools',
|
||||
img: 'office'
|
||||
},
|
||||
{
|
||||
name: 'AI Video Tool',
|
||||
img: 'Video'
|
||||
},
|
||||
{
|
||||
name: 'AI Programming Tools',
|
||||
img: 'program'
|
||||
},
|
||||
{
|
||||
name: 'AI Chat Assistant',
|
||||
img: 'chat'
|
||||
},
|
||||
{
|
||||
name: 'AI Writing Tool',
|
||||
img: 'write'
|
||||
},
|
||||
{
|
||||
name: 'AI learning Website',
|
||||
img: 'learn'
|
||||
},
|
||||
{
|
||||
name: 'AI Design Tool',
|
||||
img: 'design'
|
||||
},
|
||||
{
|
||||
name: 'AI Search Engine',
|
||||
img: 'search'
|
||||
},
|
||||
{
|
||||
name: 'AI Development Platform',
|
||||
img: 'develop'
|
||||
},
|
||||
{
|
||||
name: 'AI Audio Tool',
|
||||
img: 'audio'
|
||||
},
|
||||
{
|
||||
name: 'AI Model Evaluation',
|
||||
img: 'model'
|
||||
},
|
||||
{
|
||||
name: 'AI Prompt Command',
|
||||
img: 'prompt'
|
||||
},
|
||||
{
|
||||
name: 'AI Content Detection',
|
||||
img: 'content'
|
||||
},
|
||||
{
|
||||
name: 'AI Agent',
|
||||
img: 'agent'
|
||||
},
|
||||
{
|
||||
name: 'Model Training',
|
||||
img: 'train'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
scrollToTool(toolName) {
|
||||
const target = document.getElementById(`tool-${toolName}`)
|
||||
if (target) {
|
||||
target.scrollIntoView({
|
||||
behavior: 'smooth',
|
||||
block: 'start'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#home-page {
|
||||
flex: 1;
|
||||
overflow-y: auto; // 必须启用滚动
|
||||
position: relative; // 添加相对定位
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain; // 控制图片自适应
|
||||
background-position: top center;
|
||||
background-image: url('/logo/mask.png');
|
||||
}
|
||||
|
||||
|
||||
|
||||
.top-title {
|
||||
@include flex-center;
|
||||
flex-direction: column;
|
||||
font-weight: bold;
|
||||
height: 400px;
|
||||
margin-top: 180px;
|
||||
|
||||
div {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.first-text {
|
||||
line-height: 90px;
|
||||
font-size: $huge-font-size2;
|
||||
}
|
||||
|
||||
.second-text {
|
||||
margin: 18px 0;
|
||||
font-size: $huge-font-size3;
|
||||
}
|
||||
|
||||
.third-text {
|
||||
width: 716px;
|
||||
height: 81px;
|
||||
font-weight: 500;
|
||||
color: $grey-color;
|
||||
font-size: $normal-font-size;
|
||||
|
||||
.special {
|
||||
color: $main-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.card {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr; // 4列布局
|
||||
gap: 20px; // 网格间距
|
||||
margin: 0 auto;
|
||||
height: 366px;
|
||||
|
||||
.card-box {
|
||||
background: $white;
|
||||
box-shadow: 0px 18px 33px 0px rgba(0, 0, 0, 0.05);
|
||||
border-radius: 12px;
|
||||
border: 1px solid #FFFFFF;
|
||||
}
|
||||
|
||||
.left-card {
|
||||
// min-width: 805px;
|
||||
}
|
||||
|
||||
.right-card {
|
||||
padding: 20px;
|
||||
// min-width: 372px;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
font-size: $larg-font-size;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin: 15px 0;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #E2E8F0;
|
||||
@include flex-center;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.15);
|
||||
cursor: pointer;
|
||||
@include gradient-border($linear-gradient-start, $linear-gradient-end);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.pop-item {
|
||||
display: grid;
|
||||
grid-auto-rows: 1fr;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 10px; // 新增间距控制
|
||||
|
||||
.box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tool-list {
|
||||
margin: 40px 0;
|
||||
}
|
||||
|
||||
.input-container {
|
||||
margin: 60px auto;
|
||||
}
|
||||
</style>
|
||||
18
pages/Login/index.vue
Normal file
18
pages/Login/index.vue
Normal file
@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<div id="login-container">
|
||||
登录
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Login',
|
||||
layout:"login"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#login-container{
|
||||
|
||||
}
|
||||
</style>
|
||||
17
pages/User/index.vue
Normal file
17
pages/User/index.vue
Normal file
@ -0,0 +1,17 @@
|
||||
<template>
|
||||
<div id="user-container">
|
||||
用户
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'User',
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
#user-container{
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user