nprasad2077/MyIP
1
0 Fork 0
mirror of https://github.com/jason5ng32/MyIP.git synced 2026-11-04 08:55:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improvements

Browse Source
This commit is contained in:
jason5ng32 committed 2024-01-28 19:47:31 +08:00
1 parent 49800a9391
commit f61ca832ad
4 files changed
+502 -10
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

README.md
+1 -1
View File
@@ -9,7 +9,7 @@
👉 Demo: [https://ipcheck.ing](https://ipcheck.ing)
Notes: You can use my demo, but please don't use it for commercial purposes. If you want to use it for commercial purposes, please deploy it yourself.
Notes: You can use my demo for free, and you can also deploy it yourself.
[![Deploy with Vercel](https://raw.githubusercontent.com/jason5ng32/MyIP/main/public/Vercel.svg)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fjason5ng32%2FMyIP&project-name=MyIP&repository-name=MyIP)
[![Deploy with Docker](https://raw.githubusercontent.com/jason5ng32/MyIP/main/public/Docker.svg)](https://hub.docker.com/r/jason5ng32/myip)
src/components/footer.vue
+117 -9
View File
@@ -1,12 +1,108 @@
<template>
<footer>
<p class="text-center">{{ $t('page.footerName') }} <a :href="$t('page.footerLink')" class="link-dark"
target="_blank"><i class="bi bi-github" :class="{ 'dark-mode': isDarkMode }"></i></a>
</p>
<p v-if="!siteValidate" class="text-center fs-6 fw-light" style="opacity: 0.5;">
{{ $t('page.copyRightName') }} <a :href="$t('page.copyRightLink')" class="link-underline-light" target="_blank"
:class="[isDarkMode ? 'dark-mode link-light' : 'link-dark']">{{ $t('page.copyRightLinkName') }}</a>
</p>
<div id="copyleft">
<p class="text-center">{{ $t('page.footerName') }} <a :href="$t('page.footerLink')" class="link-dark"
target="_blank"><i class="bi bi-github" :class="{ 'dark-mode': isDarkMode }"></i></a>
</p>
</div>
<div id="about" class="text-center">
<a class="link link-underline-offset link-underline-opacity-0" :class="[isDarkMode ? 'link-info' : 'link-dark']"
data-bs-toggle="offcanvas" href="#About" role="button" aria-controls="About">
{{ $t('about.Title') }} <i class="bi bi-arrow-left-circle-fill"></i>
</a>
</div>
<div class="offcanvas offcanvas-end mt-5" tabindex="-1" id="About" aria-labelledby="AboutLabel"
:data-bs-theme="isDarkMode ? 'dark' : 'light'">
<div class="offcanvas-header mt-3">
<div class="btn-group" role="group">
<button type="button" class="btn" @click="toggleContent('about')"
:class="[showAbout ? 'btn-primary' : 'btn-outline-secondary']">{{ $t('about.Title') }}</button>
<button type="button" class="btn" @click="toggleContent('changlog')"
:class="[showChanglog ? 'btn-primary' : 'btn-outline-secondary']">
{{ $t('changelog.Title') }}
</button>
</div>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<div v-if="showAbout">
<div class="mb-3">
<p>
{{ $t('about.product1') }}
</p>
<p>
{{ $t('about.product2') }}
</p>
<p>
{{ $t('about.product3') }}
</p>
</div>
<h5>{{ $t('about.meTitle') }}</h5>
<div class="mb-3">
<p>
{{ $t('about.me1') }}
</p>
<p>
{{ $t('about.me2') }}
</p>
<p>
{{ $t('about.me3') }}
</p>
</div>
<div class="mb-3 mx-2">
<p>
<a href="https://wujiaxian.com" class="link-success link-underline-opacity-0" target="_blank"><i
class="bi bi-browser-safari"></i> {{ $t('about.personal') }}</a>
</p>
<p>
<a href="https://kenengba.com" class="link-success link-underline-opacity-0" target="_blank"><i
class="bi bi-browser-safari"></i> {{ $t('about.blog') }}</a>
</p>
<p>
<a href="https://retire.money" class="link-success link-underline-opacity-0" target="_blank"><i
class="bi bi-browser-safari"></i> {{ $t('about.retiremoney') }}</a>
</p>
<p>
<a href="https://twitter.com/jason5ng32" class="link-success link-underline-opacity-0" target="_blank"><i
class="bi bi-browser-safari"></i> {{ $t('about.twitter') }}</a>
</p>
</div>
<h5>{{ $t('about.contactTitle') }}</h5>
<div v-html="$t('about.contact')" class="mb-3">
</div>
</div>
<div v-if="showChanglog">
<div v-for="(version, index) in changelog.slice().reverse()" :key="index" class="mb-4">
<div class="row align-items-center">
<div class="col-6 fw-bold fs-5">{{ version.version }}</div>
<div class="col-6 row flex-row-reverse text-secondary">{{ version.date }}</div>
</div>
<hr>
<div v-for="(item, idx) in version.content" :key="idx" class="pb-1 ">
<span v-if="item.type === 'add'" class="badge rounded-pill bg-success fw-normal ">{{ $t('changelog.add')
}}</span>
<span v-else-if="item.type === 'improve'" class="badge rounded-pill bg-info fw-normal">{{
$t('changelog.improve') }}</span>
<span v-else-if="item.type === 'fix'" class="badge rounded-pill bg-danger fw-normal">{{ $t('changelog.fix')
}}</span>
<span class="mx-2">{{ item.change }}</span>
</div>
</div>
</div>
</div>
</div>
<div id="copyright" v-if="!siteValidate">
<p class="text-center fs-6 fw-light" style="opacity: 0.5;">
{{ $t('page.copyRightName') }} <a :href="$t('page.copyRightLink')" class="link-underline-light" target="_blank"
:class="[isDarkMode ? 'dark-mode link-light' : 'link-dark']">{{ $t('page.copyRightLinkName') }}</a>
</p>
</div>
</footer>
</template>
@@ -40,10 +136,22 @@ export default {
data() {
return {
showAbout: true,
showChanglog: false,
changelog: this.$tm('changelog.versions'),
}
},
methods: {
toggleContent(contentType) {
this.showAbout = contentType === 'about';
this.showChanglog = contentType === 'changlog';
}
}
}
</script>
<style scoped></style>
<style scoped>
#About {
z-index: 1051;
}
</style>
src/locales/en.json
+192
View File
@@ -163,5 +163,197 @@
},
"helpModal": {
"Title": "Shortcuts"
},
"about": {
"Title": "About",
"product1": "IPCheck.ing is a free IP toolbox that helps you check your IP information, test website availability, examine DNS exit information, perform speed tests, global latency tests, MTR tests, and more.",
"product2": "This is an open-source project, and you can view the source code by clicking on the GitHub icon at the bottom of the page.",
"product3": "Initially, this was a personal project for me to learn Vue.js and how to write code using ChatGPT. Over time, it gained more stars on GitHub, so I did a lot of refactoring and added many useful features. I hope you will enjoy it.",
"meTitle": "About Me",
"me1": "My name is Jason Ng, also known as Achán online. I'm not a professional programmer, but I love coding, open-source, and sharing.",
"me2": "Most of the time, I work as a product manager, a blogger, a motorcyle rider and a geek.",
"me3": "You can find a more detailed introduction about me in the following link:",
"contactTitle": "Contact Me",
"contact": "If you have any questions or suggestions, please contact me via email: jason[AT]kenengba.com.",
"personal": "Personal Website",
"blog": "My Blog",
"retiremoney": "Future Planner",
"twitter": "Twitter"
},
"changelog": {
"Title": "Changelog",
"add": "Added",
"improve": "Improved",
"fix": "Fixed",
"versions": [
{
"version": "v1.0.0",
"date": "Nov 06, 2020",
"content": [
{
"type": "add",
"change": "Display user's IP information"
},
{
"type": "add",
"change": "Display IP information before and after proxy"
},
{
"type": "add",
"change": "Check website availability"
}
]
},
{
"version": "v2.0.0",
"date": "Nov 24, 2023",
"content": [
{
"type": "add",
"change": "Refactored the entire project using Vue2"
},
{
"type": "improve",
"change": "Refactored UI using Bootstrap v5"
}
]
},
{
"version": "v2.1.0",
"date": "Nov 25, 2023",
"content": [
{
"type": "add",
"change": "Added WebRTC test"
},
{
"type": "improve",
"change": "Optimized program logic"
}
]
},
{
"version": "v2.2.0",
"date": "Nov 26, 2023",
"content": [
{
"type": "add",
"change": "Added DNS leak test"
},
{
"type": "add",
"change": "Support displaying Bing maps in the frontend"
},
{
"type": "improve",
"change": "Multiple logic optimizations"
}
]
},
{
"version": "v2.3.0",
"date": "Nov 27, 2023 ",
"content": [
{
"type": "add",
"change": "Added dark mode"
},
{
"type": "add",
"change": "Added minimalist mode for mobile"
},
{
"type": "improve",
"change": "Optimized file structure"
}
]
},
{
"version": "v2.4.0",
"date": "Dec 1, 2023",
"content": [
{
"type": "add",
"change": "Added support for English language"
},
{
"type": "add",
"change": "Added information masking feature"
},
{
"type": "add",
"change": "Support PWA, can be installed on mobile and desktop"
}
]
},
{
"version": "v2.5.0",
"date": "Dec 20, 2023",
"content": [
{
"type": "add",
"change": "Added support for keyboard shortcuts"
},
{
"type": "add",
"change": "Added website speed test feature"
},
{
"type": "improve",
"change": "Support deployment using Docker"
},
{
"type": "improve",
"change": "Support retrieving IP geolocation information from multiple sources"
}
]
},
{
"version": "v2.6.0",
"date": "Jan 25, 2024",
"content": [
{
"type": "add",
"change": "Added global latency test feature"
},
{
"type": "improve",
"change": "Optimized map display in dark mode"
},
{
"type": "fix",
"change": "Fixed some issues"
}
]
},
{
"version": "v3.0.0",
"date": "Jan 28, 2024",
"content": [
{
"type": "add",
"change": "Refactored the entire project using Vue3"
},
{
"type": "improve",
"change": "Multiple performance and user experience optimizations"
}
]
},
{
"version": "v3.1.0",
"date": "Jan 29, 2024",
"content": [
{
"type": "add",
"change": "Added MTR test feature"
},
{
"type": "add",
"change": "Added global latency test map mode"
}
]
}
]
}
}
src/locales/zh.json
+192
View File
@@ -163,5 +163,197 @@
},
"helpModal": {
"Title": "快捷键"
},
"about": {
"Title": "关于",
"product1": "IPCheck.ing 是一个免费的 IP 工具箱，可以帮助你查看自己的 IP 信息，检测网站的可用性，查看 DNS 出口信息，进行网速测试，全球延迟测试，MTR 测试等。",
"product2": "这是一个开源项目，你可以点击页面底部的 GitHub 图标查看源代码。",
"product3": "最早的时候，这是我的一个用来学习 Vue.js 和学习如何使用 ChatGPT 写代码的练手项目，后来在 GitHub 上获得的星星数量越来越多，于是我进行了大量的重构和添加了许多非常有用的功能，希望你会喜欢。",
"meTitle": "关于我",
"me1": "我的名字叫阿禅，通常在网上使用 Jason Ng 作为英文名，我并不是一个专业的程序员，但是我喜欢编程，我喜欢开源，我喜欢分享。",
"me2": "在大多数时候，我是一名产品经理、一名博客作者、一个摩托车骑士以及一名极客。",
"me3": "你可以在下面的链接里找到我更详细的介绍：",
"contactTitle": "联系我",
"contact": "如果你有任何问题或建议，请通过邮箱联系我： jason[AT]kenengba.com 。",
"personal": "个人网站",
"blog": "可能吧博客",
"retiremoney": "躺平计算器",
"twitter": "Twitter"
},
"changelog": {
"Title": "更新日志",
"add": "新增",
"improve": "优化",
"fix": "修复",
"versions": [
{
"version": "v1.0.0",
"date": "Nov 06, 2020",
"content": [
{
"type": "add",
"change": "显示用户的 IP 信息"
},
{
"type": "add",
"change": "显示代理前后的 IP 信息"
},
{
"type": "add",
"change": "检查网站可用性"
}
]
},
{
"version": "v2.0.0",
"date": "Nov 24, 2023",
"content": [
{
"type": "add",
"change": "使用 Vue2 重构了整个项目"
},
{
"type": "improve",
"change": "使用 Bootstrap v5 重构了 UI"
}
]
},
{
"version": "v2.1.0",
"date": "Nov 25, 2023",
"content": [
{
"type": "add",
"change": "添加了 WebRTC 测试"
},
{
"type": "improve",
"change": "优化了程序的一些逻辑"
}
]
},
{
"version": "v2.2.0",
"date": "Nov 26, 2023",
"content": [
{
"type": "add",
"change": "添加了 DNS 泄漏测试"
},
{
"type": "add",
"change": "支持在前端显示 Bing 地图"
},
{
"type": "improve",
"change": "多个逻辑优化"
}
]
},
{
"version": "v2.3.0",
"date": "Nov 27, 2023 ",
"content": [
{
"type": "add",
"change": "添加了黑暗模式"
},
{
"type": "add",
"change": "增加移动版简约模式"
},
{
"type": "improve",
"change": "优化了文件结构"
}
]
},
{
"version": "v2.4.0",
"date": "Dec 1, 2023",
"content": [
{
"type": "add",
"change": "支持英文语言"
},
{
"type": "add",
"change": "添加信息遮罩功能"
},
{
"type": "add",
"change": "支持 PWA，可以安装到手机和桌面上"
}
]
},
{
"version": "v2.5.0",
"date": "Dec 20, 2023",
"content": [
{
"type": "add",
"change": "支持快捷键操作"
},
{
"type": "add",
"change": "添加网速测试功能"
},
{
"type": "improve",
"change": "支持使用 Docker 部署"
},
{
"type": "improve",
"change": "支持从多个来源获取 IP 归属地等信息"
}
]
},
{
"version": "v2.6.0",
"date": "Jan 25, 2024",
"content": [
{
"type": "add",
"change": "增加全球延迟测试功能"
},
{
"type": "improve",
"change": "优化黑暗模式下的地图展示"
},
{
"type": "fix",
"change": "修复一些问题"
}
]
},
{
"version": "v3.0.0",
"date": "Jan 28, 2024",
"content": [
{
"type": "add",
"change": "使用 Vue3 重构了整个项目"
},
{
"type": "improve",
"change": "多个性能优化和体验优化"
}
]
},
{
"version": "v3.1.0",
"date": "Jan 29, 2024",
"content": [
{
"type": "add",
"change": "添加 MTR 测试功能"
},
{
"type": "add",
"change": "添加全球延迟测试地图模式"
}
]
}
]
}
}