提交 79fce440 authored 作者: 小陀螺's avatar 小陀螺

123

上级 203ea1f2
No preview for this file type
/* eslint-env node */
require('@rushstack/eslint-patch/modern-module-resolution')
module.exports = {
root: true,
'extends': [
'plugin:vue/vue3-essential',
'eslint:recommended',
'@vue/eslint-config-prettier/skip-formatting'
],
parserOptions: {
ecmaVersion: 'latest'
}
}
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
.DS_Store
dist
dist-ssr
coverage
*.local
/cypress/videos/
/cypress/screenshots/
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
*.tsbuildinfo
{
"$schema": "https://json.schemastore.org/prettierrc",
"semi": false,
"tabWidth": 2,
"singleQuote": true,
"printWidth": 100,
"trailingComma": "none"
}
\ No newline at end of file
{
"recommendations": [
"Vue.volar",
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode"
]
}
# official_js_website
This template should help get you started developing with Vue 3 in Vite.
## Recommended IDE Setup
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
## Customize configuration
See [Vite Configuration Reference](https://vitejs.dev/config/).
## Project Setup
```sh
npm install
```
### Compile and Hot-Reload for Development
```sh
npm run dev
```
### Compile and Minify for Production
```sh
npm run build
```
### Lint with [ESLint](https://eslint.org/)
```sh
npm run lint
```
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>雪盈策略</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
{
"compilerOptions": {
"paths": {
"@/*": ["./src/*"]
}
},
"exclude": ["node_modules", "dist"]
}
{
"name": "official_js_website",
"version": "0.0.0",
"private": true,
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview",
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore",
"format": "prettier --write src/"
},
"dependencies": {
"pinia": "^2.1.7",
"swiper": "^11.1.8",
"vant": "^4.9.3",
"vue": "^3.4.29",
"vue-i18n": "^9.4.1",
"vue-router": "^4.3.3"
},
"devDependencies": {
"@rushstack/eslint-patch": "^1.8.0",
"@vitejs/plugin-vue": "^5.0.5",
"@vue/eslint-config-prettier": "^9.0.0",
"eslint": "^8.57.0",
"eslint-plugin-vue": "^9.23.0",
"prettier": "^3.2.5",
"vite": "^5.3.1"
}
}
<script setup>
import { RouterLink, RouterView } from 'vue-router'
</script>
<template>
<div style="width: 100vw; height: 100vh">
<RouterView />
</div>
</template>
<style scoped></style>
/* color palette from <https://github.com/vuejs/theme> */
:root {
--vt-c-white: #ffffff;
--vt-c-white-soft: #f8f8f8;
--vt-c-white-mute: #f2f2f2;
--vt-c-black: #181818;
--vt-c-black-soft: #222222;
--vt-c-black-mute: #282828;
--vt-c-indigo: #2c3e50;
--vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
--vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
--vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
--vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
--vt-c-text-light-1: var(--vt-c-indigo);
--vt-c-text-light-2: rgba(60, 60, 60, 0.66);
--vt-c-text-dark-1: var(--vt-c-white);
--vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
}
/* semantic color variables for this project */
:root {
--color-background: var(--vt-c-white);
--color-background-soft: var(--vt-c-white-soft);
--color-background-mute: var(--vt-c-white-mute);
--color-border: var(--vt-c-divider-light-2);
--color-border-hover: var(--vt-c-divider-light-1);
--color-heading: var(--vt-c-text-light-1);
--color-text: var(--vt-c-text-light-1);
--section-gap: 160px;
}
@media (prefers-color-scheme: dark) {
:root {
--color-background: var(--vt-c-black);
--color-background-soft: var(--vt-c-black-soft);
--color-background-mute: var(--vt-c-black-mute);
--color-border: var(--vt-c-divider-dark-2);
--color-border-hover: var(--vt-c-divider-dark-1);
--color-heading: var(--vt-c-text-dark-1);
--color-text: var(--vt-c-text-dark-2);
}
}
*,
*::before,
*::after {
box-sizing: border-box;
margin: 0;
font-weight: normal;
}
body {
min-height: 100vh;
color: var(--color-text);
background: var(--color-background);
transition:
color 0.5s,
background-color 0.5s;
line-height: 1.6;
font-family:
Inter,
-apple-system,
BlinkMacSystemFont,
'Segoe UI',
Roboto,
Oxygen,
Ubuntu,
Cantarell,
'Fira Sans',
'Droid Sans',
'Helvetica Neue',
sans-serif;
font-size: 15px;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.baseBackGroundColor {
background-color: #d0e5ef;
}
.ContainerFather {
justify-content: start;
flex-direction: column;
align-items: start;
}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
/* @import './base.css';
#app {
max-width: 1280px;
font-weight: normal;
}
.green {
text-decoration: none;
color: hsla(160, 100%, 37%, 1);
transition: 0.4s;
padding: 3px;
}
@media (hover: hover) {
a:hover {
background-color: hsla(160, 100%, 37%, 0.2);
}
}
@media (min-width: 1024px) {
body {
display: flex;
place-items: center;
}
} */
<template>
<div class="bottomStyle">
<div class="text">
{{ $t('© 2021 版权所有 Snowy Strategies。保留一切权利。 京ICP备13019239号-1') }}
</div>
<img style="width: 20px; height: 20px" src="@/assets/images/guohui.png" alt="" />
<div class="text">{{ $t('京公网安备 11010502039167号') }}</div>
</div>
</template>
<script setup></script>
<style scoped>
.bottomStyle {
background-color: rgb(0, 36, 60);
width: 100%;
height: 70px;
justify-content: start;
align-items: center;
padding-left: 30px;
flex-direction: row;
display: flex;
}
.text {
color: #7ca1b5;
font-size: 13px;
font-weight: 400;
margin: 0 10px;
}
</style>
<template>
<div class="topContainer">
<img @click="tapImg" style="height: 60px" src="@/assets/images/xue_icon.png" alt="" />
<div class="rightContainer">
<a :href="urlApple" class="download">
<img style="width: 18px; height: 18px; margin-right: 8px" :src="appImg" alt="" />
{{ $t('下载') }}
</a>
<a :href="urlAndroid" style="margin-right: 150px; margin-left: 40px" class="download">
<img style="width: 18px; height: 18px; margin-right: 8px" :src="androidImg" alt="" />
{{ $t('下载') }}
</a>
<span @click="switchLanguage(langString)" style="padding-right: 40px; font-weight: 600">{{
currentLanguage
}}</span>
</div>
</div>
</template>
<script setup>
import { computed } from 'vue'
import { ref } from 'vue'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import appImg from '@/assets/images/apple.png'
import androidImg from '@/assets/images/android.png'
// 使用 vue-i18n 的 useI18n 钩子
const { locale } = useI18n()
// console.log(useI18n())
const urlApple =
'https://apps.apple.com/cn/app/%E9%9B%AA%E7%9B%88%E6%8A%95%E9%A1%BE-%E5%9F%BA%E7%A1%80%E7%9F%A5%E8%AF%86%E6%8E%8C%E6%8F%A1/id6618148867'
const urlAndroid = 'https://xueyingapp2he1download.s3.ap-east-1.amazonaws.com/index.html'
const language = ref('English')
const langString = ref('en-US')
const router = useRouter()
function tapImg() {
router.push({ path: '/' })
}
function switchLanguage(lang) {
if (lang === 'en-US') {
langString.value = 'zh-CN'
} else if (lang === 'zh-CN') {
langString.value = 'en-US'
}
locale.value = lang
}
const currentLanguage = computed(() => {
if (locale.value === 'zh-CN') {
language.value = 'English'
} else if (locale.value === 'en-US') {
language.value = '简体中文'
}
return language.value
})
</script>
<style scoped>
.topContainer {
width: 100%;
height: 90px;
background-image: url(@/assets/images/bg-header.gif);
justify-content: space-between;
padding-left: 40px;
align-items: center;
display: flex;
}
.rightContainer {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.download {
width: 150px;
height: 60px;
display: flex;
border: 1px solid white;
border-radius: 8px;
justify-content: center;
align-items: center;
/* padding: 15px 30px; */
flex-direction: row;
margin-left: 0px;
color: #fff;
text-decoration: none;
}
</style>
import China from '@/language/zh-CN'
import USA from '@/language/en-US'
export const langList = {
// 英文
'en-US': {
name: 'English',
code: 'English',
local: 'en-US',
message: USA
},
'zh-CN': {
name: '简体中文',
code: '简体中文',
local: 'zh-CN',
message: China
}
}
let messages = {}
for (let key in langList) {
messages[key] = langList[key].message
}
export default messages
export default {
关于我们: '关于我们',
投资领域: '投资领域',
业界荣誉: '业界荣誉',
'© 2021 版权所有 Snowy Strategies。保留一切权利。 京ICP备13019239号-1':
'© 2021 版权所有 Snowy Strategies。保留一切权利。 京ICP备13019239号-1',
'京公网安备 11010502039167号': '京公网安备 11010502039167号',
公司简介: '公司简介',
'雪盈策略提供方便快捷的 A 股开户与交易服务,并且享受全自动化跟单交易方式,让您的 资产持续滚动盈利,彻底解放您的双手,让您投资变得更有乐趣':
'雪盈策略提供方便快捷的 A 股开户与交易服务,并且享受全自动化跟单交易方式,让您的 资产持续滚动盈利,彻底解放您的双手,让您投资变得更有乐趣',
'雪盈策略是新西兰金融注册服务商,雪球集团成员企业,我们通过强大的互联网科技和雄厚 的金融实力,为全球华人提供证券经济服务':
'雪盈策略是新西兰金融注册服务商,雪球集团成员企业,我们通过强大的互联网科技和雄厚 的金融实力,为全球华人提供证券经济服务',
'经营范围:证券经济、证券投资咨询、证券自营、证券资产管理、融资融券、投资顾问服务、 投资组合管理、市场研究与分析、财务规划与咨询、风险评估与管理、投资教育与培训,与 证券交易证券投资活动有关的财务活动':
'经营范围:证券经济、证券投资咨询、证券自营、证券资产管理、融资融券、投资顾问服务、 投资组合管理、市场研究与分析、财务规划与咨询、风险评估与管理、投资教育与培训,与 证券交易证券投资活动有关的财务活动',
'经营范围:证券经济、证券投资咨询、证券自营、证券资产管理、融资融券、投资顾问服务、 雪盈策略立足长远,在企业的不同发展阶段为其提供较长期限的资金支持,既可以投资于初 创企业,也可以支持成长中的企业进一步发展,还能够引导大型成熟企业完成复杂的资本重 组或大规模收购。公司秉持企业家、有限合伙人和华平团队利益一致的投资理念,与被投企 业管理层共同制定战略、确立恰当的资本结构、分析并购候选企业、评估和招募人才并实施 数字化创新,帮助被投企业持续增长、做大做强。':
'经营范围:证券经济、证券投资咨询、证券自营、证券资产管理、融资融券、投资顾问服务、 雪盈策略立足长远,在企业的不同发展阶段为其提供较长期限的资金支持,既可以投资于初 创企业,也可以支持成长中的企业进一步发展,还能够引导大型成熟企业完成复杂的资本重 组或大规模收购。公司秉持企业家、有限合伙人和华平团队利益一致的投资理念,与被投企 业管理层共同制定战略、确立恰当的资本结构、分析并购候选企业、评估和招募人才并实施 数字化创新,帮助被投企业持续增长、做大做强。',
'价值创造, 赋能企业': '价值创造, 赋能企业',
'雪盈策略投资的价值创造团队为世界各地的被投企业提供全方位、高质量的专业服务和咨询,且不收取任何费用。在中国,我们的价值创造团队由来自于不同领域的资深专家组成,他们拥有深厚的行业知识和丰富的实战经验,竭尽所能帮助被投企业发展壮大。':
'雪盈策略投资的价值创造团队为世界各地的被投企业提供全方位、高质量的专业服务和咨询,且不收取任何费用。在中国,我们的价值创造团队由来自于不同领域的资深专家组成,他们拥有深厚的行业知识和丰富的实战经验,竭尽所能帮助被投企业发展壮大。',
'雪盈策略投资为企业提供价值创造领域包括:': '雪盈策略投资为企业提供价值创造领域包括:',
'- 商业化战略': '- 商业化战略',
'- 财务、运营和共享服务': '- 财务、运营和共享服务',
'- 被投企业人力资源管理': '- 被投企业人力资源管理',
'- 全球公共政策及公共关系': '- 全球公共政策及公共关系',
'- 企业可持续发展战略': '- 企业可持续发展战略',
可持续发展理念的践行者: '可持续发展理念的践行者',
'雪盈策略投资坚持以负责任的方式开展各项投资活动,促进环境可持续发展,践行企业社会责任和卓越的公司治理。秉承雪盈策略投资的核心价值观与文化,我们坚信负责任的环境、社会和公司治理(ESG)实践必将带来长期投资回报。':
'雪盈策略投资坚持以负责任的方式开展各项投资活动,促进环境可持续发展,践行企业社会责任和卓越的公司治理。秉承雪盈策略投资的核心价值观与文化,我们坚信负责任的环境、社会和公司治理(ESG)实践必将带来长期投资回报。',
'在整个投资过程中——从最初评估投资机会、公司尽职调查到加入被投企业董事会,我们均切实考虑环境、社会和公司治理(ESG)因素。我们在日常工作中注重减少对环境的影响,保证员工福祉与安全,力争在追求多元化文化的同时,以最高标准开展企业治理,确保企业合法合规开展经营活动。':
'在整个投资过程中——从最初评估投资机会、公司尽职调查到加入被投企业董事会,我们均切实考虑环境、社会和公司治理(ESG)因素。我们在日常工作中注重减少对环境的影响,保证员工福祉与安全,力争在追求多元化文化的同时,以最高标准开展企业治理,确保企业合法合规开展经营活动。',
'我们的环境、社会和公司治理委员会由公司高管组成,负责制定ESG工作战略,以帮助雪盈策略投资和被投企业更好地管理风险、提高效率、降低成本、减少环境影响,成为更有价值、更具竞争力和更可持续的企业。':
'我们的环境、社会和公司治理委员会由公司高管组成,负责制定ESG工作战略,以帮助雪盈策略投资和被投企业更好地管理风险、提高效率、降低成本、减少环境影响,成为更有价值、更具竞争力和更可持续的企业。',
'在中国,雪盈策略投资聚焦医疗健康/消费、新基建、金融服务、工业科技等领域,持续挖掘投资机会,培养行业龙头。':
'在中国,雪盈策略投资聚焦医疗健康/消费、新基建、金融服务、工业科技等领域,持续挖掘投资机会,培养行业龙头。',
中国私募股权投资机构TOP10: '中国私募股权投资机构TOP10',
中国私募股权投资机构TOP15: '中国私募股权投资机构TOP15',
中国股权投资市场二十年常青机构奖: '中国股权投资市场二十年常青机构奖',
最受LP关注私募机构TOP30: '最受LP关注私募机构TOP30',
最佳私募股权投资机构TOP10: '最佳私募股权投资机构TOP10',
私募股权投资最佳增值服务团队: '私募股权投资最佳增值服务团队',
私募股权投资机构二十年成就奖: '私募股权投资机构二十年成就奖',
最具影响力私募机构TOP10: '最具影响力私募机构TOP10',
最佳ESG实践投资机构TOP30: '最佳ESG实践投资机构TOP30',
最受创业者欢迎私募机构TOP50: '最受创业者欢迎私募机构TOP50',
最受LP认可私募机构TOP30: '最受LP认可私募机构TOP30',
最佳私募股权投资机构TOP30: '最佳私募股权投资机构TOP30',
最佳投后管理投资机构: '最佳投后管理投资机构',
最佳回报私募股权投资机构: '最佳回报私募股权投资机构',
最佳募资私募股权投资机构: '最佳募资私募股权投资机构',
最佳ESG投资机构: '最佳ESG投资机构',
最受市场化母基金关注GP: '最受市场化母基金关注GP',
创投与私募机构TOP30: '创投与私募机构TOP30',
ESG投资特殊贡献机构: 'ESG投资特殊贡献机构',
亚洲最佳私募股权机构: '亚洲最佳私募股权机构',
亚洲最佳募资机构: '亚洲最佳募资机构',
亚洲最佳数据中心投资机构: '亚洲最佳数据中心投资机构',
亚洲最佳私募股权机构: '亚洲最佳私募股权机构',
中国最佳私募股权机构: '中国最佳私募股权机构',
点击下载app: '点击下载app',
下载: '下载'
}
import './assets/main.css'
import './assets/base.css'
import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import { createI18n } from 'vue-i18n'
import messages from './language'
const i18n = createI18n({
legacy: false,
locale: 'zh-CN',
messages
})
const app = createApp(App)
app.use(createPinia())
app.use(router)
app.use(i18n)
// app.use(Lazyload, {
// lazyComponent: true //开启组件懒加载s
// })
app.mount('#app')
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import InvestmentView from '../views/InvestmentAreas.vue'
import IndustryView from '../views/IndustryHonors.vue'
import TotalView from '../views/TotalView.vue'
import AboutView from '../views/AboutView.vue'
const router = createRouter({
history: createWebHashHistory(import.meta.env.BASE_URL),
routes: [
{
path: '/',
name: 'home',
component: HomeView
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (About.[hash].js) for this route
// which is lazy-loaded when the route is visited.
// component: () => import('../views/AboutView.vue')
component: AboutView
},
{
path: '/investment',
name: 'investment',
component: InvestmentView
},
{
path: '/industry',
name: 'industry',
component: IndustryView
},
{
path: '/total',
name: 'total',
component: TotalView
}
]
})
export default router
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
export const useCounterStore = defineStore('counter', () => {
const count = ref(0)
const doubleCount = computed(() => count.value * 2)
function increment() {
count.value++
}
return { count, doubleCount, increment }
})
<template>
<td valign="top" id="page-content">
<p></p>
<p>
<strong style="font-weight: bold">{{ $t('公司简介') }}</strong>
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'雪盈策略提供方便快捷的 A 股开户与交易服务,并且享受全自动化跟单交易方式,让您的 资产持续滚动盈利,彻底解放您的双手,让您投资变得更有乐趣'
)
}}
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'雪盈策略是新西兰金融注册服务商,雪球集团成员企业,我们通过强大的互联网科技和雄厚 的金融实力,为全球华人提供证券经济服务'
)
}}
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'经营范围:证券经济、证券投资咨询、证券自营、证券资产管理、融资融券、投资顾问服务、 投资组合管理、市场研究与分析、财务规划与咨询、风险评估与管理、投资教育与培训,与 证券交易证券投资活动有关的财务活动'
)
}}
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'经营范围:证券经济、证券投资咨询、证券自营、证券资产管理、融资融券、投资顾问服务、 雪盈策略立足长远,在企业的不同发展阶段为其提供较长期限的资金支持,既可以投资于初 创企业,也可以支持成长中的企业进一步发展,还能够引导大型成熟企业完成复杂的资本重 组或大规模收购。公司秉持企业家、有限合伙人和华平团队利益一致的投资理念,与被投企 业管理层共同制定战略、确立恰当的资本结构、分析并购候选企业、评估和招募人才并实施 数字化创新,帮助被投企业持续增长、做大做强。'
)
}}
</p>
<p>&nbsp;</p>
<p>
<strong style="font-weight: bold">{{ $t('价值创造, 赋能企业') }}</strong>
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'雪盈策略投资的价值创造团队为世界各地的被投企业提供全方位、高质量的专业服务和咨询,且不收取任何费用。在中国,我们的价值创造团队由来自于不同领域的资深专家组成,他们拥有深厚的行业知识和丰富的实战经验,竭尽所能帮助被投企业发展壮大。'
)
}}
</p>
<p>&nbsp;</p>
<p>{{ $t('雪盈策略投资为企业提供价值创造领域包括:') }}</p>
<p>{{ $t('- 商业化战略') }}</p>
<p>{{ $t('- 财务、运营和共享服务') }}</p>
<p>{{ $t('- 被投企业人力资源管理') }}</p>
<p>{{ $t('- 全球公共政策及公共关系') }}</p>
<p>{{ $t('- 企业可持续发展战略') }}</p>
<p>&nbsp;</p>
<!--<P><img src="/img2020/20220721001.png" width="700" height="564" alt=""/ ></P>
<P>&nbsp;</P> -->
<p>
<strong style="font-weight: bold">{{ $t('可持续发展理念的践行者') }}</strong>
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'雪盈策略投资坚持以负责任的方式开展各项投资活动,促进环境可持续发展,践行企业社会责任和卓越的公司治理。秉承雪盈策略投资的核心价值观与文化,我们坚信负责任的环境、社会和公司治理(ESG)实践必将带来长期投资回报。'
)
}}
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'在整个投资过程中——从最初评估投资机会、公司尽职调查到加入被投企业董事会,我们均切实考虑环境、社会和公司治理(ESG)因素。我们在日常工作中注重减少对环境的影响,保证员工福祉与安全,力争在追求多元化文化的同时,以最高标准开展企业治理,确保企业合法合规开展经营活动。'
)
}}
</p>
<p>&nbsp;</p>
<p>
{{
$t(
'我们的环境、社会和公司治理委员会由公司高管组成,负责制定ESG工作战略,以帮助雪盈策略投资和被投企业更好地管理风险、提高效率、降低成本、减少环境影响,成为更有价值、更具竞争力和更可持续的企业。'
)
}}
</p>
<p>&nbsp;</p>
<p>
<!-- <strong style="font-weight: bold">投诉窗口入口</strong> -->
<!-- <a
href="https://www.warburgpincus.com.cn/DownLoad/Warburg%20Pincus%20China%20ESG%20Overview.pdf"
target="_blank"
>《雪盈策略投资ESG概览——打造可持续影响力》</a
> -->
</p>
<p>&nbsp;</p>
<p></p>
</td>
</template>
<script setup></script>
<style scoped>
.contentStyle {
width: 100%;
flex: 1;
display: flex;
}
#newscontent,
#page-content,
#tzcontent {
font-weight: 400;
vertical-align: top;
font-family: Arial, '微软雅黑';
font-size: 15px;
color: #000;
padding: 15px 20px 15px 25px;
line-height: 32px;
}
.p {
color: #000;
}
</style>
<script setup>
import '@/assets/home.css'
import { useRouter } from 'vue-router'
import 'swiper/swiper-bundle.css'
import 'swiper/css'
import 'swiper/css/navigation'
import 'swiper/css/pagination'
import 'swiper/css/scrollbar'
import BottomView from '@/components/BottomView.vue'
import TopView from '@/components/TopView.vue'
import { Autoplay, Pagination, Navigation } from 'swiper/modules'
// Import Swiper Vue.js components
import { Swiper, SwiperSlide } from 'swiper/vue'
import { useI18n } from 'vue-i18n'
import { computed } from 'vue'
import preSwipper1en from '@/assets/images/preSwipper1-en.png'
import preSwipper2en from '@/assets/images/preSwipper2-en.png'
import preSwipper3en from '@/assets/images/preSwipper3-en.png'
import preSwipper4en from '@/assets/images/preSwipper4-en.png'
import swiper1en from '@/assets/images/swiper1-en.png'
import swiper2en from '@/assets/images/swiper2-en.png'
import swiper3en from '@/assets/images/swiper3-en.png'
import swiper4en from '@/assets/images/swiper4-en.png'
import swiper5en from '@/assets/images/swiper5-en.png'
import swiper6en from '@/assets/images/swiper6-en.png'
import preSwipper1 from '@/assets/images/preSwipper1.png'
import preSwipper2 from '@/assets/images/preSwipper2.png'
import preSwipper3 from '@/assets/images/preSwipper3.png'
import preSwipper4 from '@/assets/images/preSwipper4.png'
import swiper1 from '@/assets/images/swiper1.png'
import swiper2 from '@/assets/images/swiper2.png'
import swiper3 from '@/assets/images/swiper3.png'
import swiper4 from '@/assets/images/swiper4.png'
import swiper5 from '@/assets/images/swiper5.png'
import swiper6 from '@/assets/images/swiper6.png'
const router = useRouter()
// 使用 vue-i18n 获取当前语言
const { locale } = useI18n()
// 根据当前语言选择不同的图片路径
const localizedImages = computed(() => {
const images = {
'en-US': [
preSwipper1en,
preSwipper2en,
preSwipper3en,
preSwipper4en,
swiper1en,
swiper2en,
swiper3en,
swiper4en,
swiper5en,
swiper6en
],
'zh-CN': [
preSwipper1,
preSwipper2,
preSwipper3,
preSwipper4,
swiper1,
swiper2,
swiper3,
swiper4,
swiper5,
swiper6
]
}
return images[locale.value] || images['zh-CN']
})
function tapItem(index) {
if (index === 1) {
router.push({ name: 'total', query: { selectedItem: '关于我们', selectEn: 'about' } })
} else if (index === 2) {
router.push({ name: 'total', query: { selectedItem: '投资领域', selectEn: 'investment' } })
} else {
router.push({ name: 'total', query: { selectedItem: '业界荣誉', selectEn: 'honor' } })
}
}
</script>
<template>
<TopView></TopView>
<div class="ContainerFather">
<div class="baseBackGroundColor TableContainer">
<div @click="tapItem(1)" class="TableText">{{ $t('关于我们') }}</div>
<div @click="tapItem(2)" class="TableText">{{ $t('投资领域') }}</div>
<div @click="tapItem(3)" class="TableText">{{ $t('业界荣誉') }}</div>
</div>
<!-- -->
<div class="swiper-container">
<swiper
:modules="[Autoplay, Pagination, Navigation]"
:autoplay="{ delay: 3000 }"
:loop="true"
:slides-per-view="1"
navigation
>
<swiper-slide v-for="(imgStr, index) in localizedImages" :key="index">
<img class="imgStyle" :src="imgStr" alt="" />
</swiper-slide>
</swiper>
<!-- <swiper
:modules="[Autoplay, Pagination, Navigation]"
:autoplay="{ delay: 3000 }"
:loop="true"
:slides-per-view="1"
navigation
>
<swiper-slide
><img class="imgStyle" src="@/assets/images/preSwipper1.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/preSwipper2.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/preSwipper3.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/preSwipper4.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/swiper1.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/swiper2.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/swiper3.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/swiper4.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/swiper5.png" alt=""
/></swiper-slide>
<swiper-slide
><img class="imgStyle" src="@/assets/images/swiper6.png" alt=""
/></swiper-slide>
</swiper> -->
</div>
<BottomView></BottomView>
</div>
</template>
<style scoped>
.ContainerFather {
background-color: #fff;
width: 100%;
height: 100%;
}
.TableContainer {
width: 100%;
height: 80px;
justify-content: space-around;
flex-direction: row;
align-items: center;
display: flex;
.TableText {
color: #035793;
font-size: 17px;
font-weight: bold;
}
.TableText:hover {
color: black; /* 鼠标悬停时的字体颜色 */
}
}
.swiper-container {
width: 100%;
height: 674px;
justify-content: center;
align-items: center;
/* background-color: yellow; */
display: flex;
}
.swiper-slide {
width: 90%;
display: flex;
justify-content: center;
align-items: center;
height: 474px;
}
.imgStyle {
width: 100%;
}
.swiper-button-next,
.swiper-button-prev {
color: white !important; /* 设置箭头颜色 */
background-color: white !important; /* 背景颜色 */
}
</style>
<template>
<td id="page-content" valign="top">
<table border="0" align="center" cellpadding="0" cellspacing="0" style="font-size: 13px">
<tbody>
<tr>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
</tr>
<tr>
<td width="220" height="110">
<img src="@/assets/images/tzw002.png" class="textStyle" alt="" />
</td>
<td width="50" height="110"></td>
<td width="220" height="110">
<img src="@/assets/images/tzw001.png" class="textStyle" alt="" />
</td>
<td width="50" height="110"></td>
<td width="220" height="110">
<img src="@/assets/images/tzw004.png" class="textStyle" alt="" />
</td>
</tr>
<tr>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
</tr>
<tr>
<td width="220" height="210" class="textStyle" valign="top">
{{ $t('中国私募股权投资机构TOP10') }}<br />
{{ $t('中国私募股权投资机构TOP15') }}<br />
{{ $t('中国股权投资市场二十年常青机构奖') }}
</td>
<td width="50" height="210"></td>
<td width="220" height="210" class="textStyle" valign="top">
{{ $t('最受LP关注私募机构TOP30') }}<br />
{{ $t('最佳私募股权投资机构TOP10') }}<br />
{{ $t('私募股权投资最佳增值服务团队') }}<br />
{{ $t('私募股权投资机构二十年成就奖') }}
</td>
<td width="50" height="210"></td>
<td width="220" height="210" class="textStyle" valign="top">
{{ $t('最具影响力私募机构TOP10') }}<br />
{{ $t('最佳ESG实践投资机构TOP30') }}<br />
{{ $t('最受创业者欢迎私募机构TOP50') }}<br />
{{ $t('最受LP认可私募机构TOP30') }}
</td>
</tr>
<tr>
<td width="220" height="110">
<img src="@/assets/images/tzw005.png" class="textStyle" alt="" />
</td>
<td width="50" height="110"></td>
<td width="220" height="110">
<img src="@/assets/images/tzw007.png" class="textStyle" alt="" />
</td>
<td width="50" height="110"></td>
<td width="220" height="110">
<img src="@/assets/images/tzw009.png" class="textStyle" alt="" />
</td>
</tr>
<tr>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
</tr>
<tr>
<td width="220" height="230" class="textStyle" valign="top">
{{ $t('最佳私募股权投资机构TOP30') }}<br />
{{ $t('最佳投后管理投资机构') }}<br />
{{ $t('最佳回报私募股权投资机构') }}<br />
{{ $t('最佳募资私募股权投资机构') }}<br />
{{ $t('最佳ESG投资机构') }}<br />
{{ $t('最受市场化母基金关注GP') }}
</td>
<td width="50" height="230"></td>
<td width="220" height="140" class="textStyle" valign="top">
{{ $t('创投与私募机构TOP30') }}<br />
{{ $t('ESG投资特殊贡献机构') }}
</td>
<td width="50" height="230"></td>
<td width="220" height="140" class="textStyle" valign="top">
{{ $t('亚洲最佳私募股权机构') }}<br />
{{ $t('亚洲最佳募资机构') }}<br />
{{ $t('亚洲最佳数据中心投资机构') }}
</td>
</tr>
<tr>
<td width="220" height="110">
<img src="@/assets/images/tzw003.png" class="textStyle" alt="" />
</td>
<td width="50" height="110"></td>
<td width="220" height="110">
<img src="@/assets/images/tzw008.png" class="textStyle" alt="" />
</td>
<td width="50" height="110"></td>
<td width="220" height="110"><img src="" class="textStyle" alt="" /></td>
</tr>
<tr>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
<td width="50" height="20"></td>
<td width="220" height="20"></td>
</tr>
<tr>
<td width="220" height="230" class="textStyle" valign="top">
{{ $t('亚洲最佳私募股权机构') }}
</td>
<td width="50" height="140"></td>
<td width="220" height="140" class="textStyle" valign="top">
{{ $t('中国最佳私募股权机构') }}
</td>
<td width="50" height="140"></td>
<td width="220" height="140" class="textStyle" valign="top"></td>
</tr>
</tbody>
</table>
</td>
</template>
<script setup></script>
<style scoped>
#newscontent,
#page-content,
#tzcontent {
font-family: Georgia, '微软雅黑';
font-size: 14px;
color: #012e4a;
padding: 15px 20px 15px 25px;
line-height: 25px;
}
.textStyle {
text-align: center;
}
</style>
<template>
<td valign="top" id="page-content">
<p></p>
<p>
{{
$t(
'在中国,雪盈策略投资聚焦医疗健康/消费、新基建、金融服务、工业科技等领域,持续挖掘投资机会,培养行业龙头。'
)
}}
</p>
<p>&nbsp;</p>
</td>
<img style="height: 820px; padding: 15px" src="@/assets/images/touzilingyu.png" alt="" />
</template>
<script setup></script>
<style scoped>
#newscontent,
#page-content,
#tzcontent {
font-family: Arial, '微软雅黑';
font-size: 15px;
color: #001e2e;
padding: 15px 20px 15px 25px;
line-height: 32px;
}
</style>
<template>
<div class="Container">
<TopView></TopView>
<div class="baseBackGroundColor titleContainer">{{ itemTitleStr }}</div>
<div class="main-container">
<!-- 左侧导航栏 -->
<nav class="sidebar">
<ul>
<div class="itemStyle" @click="selectTab('about')">
<li :class="{ active: selectedTab === 'about' }">{{ $t('关于我们') }}</li>
<img
style="width: 20px; height: 20px"
:src="selectedTab === 'about' ? downArrow : rightArrow"
/>
</div>
<!-- --------------------------- -->
<div class="itemStyle" @click="selectTab('investment')">
<li :class="{ active: selectedTab === 'investment' }">{{ $t('投资领域') }}</li>
<img
style="width: 20px; height: 20px"
:src="selectedTab === 'investment' ? downArrow : rightArrow"
/>
</div>
<!-- --------------------------- -->
<div class="itemStyle" @click="selectTab('honor')">
<li :class="{ active: selectedTab === 'honor' }">{{ $t('业界荣誉') }}</li>
<img
style="width: 20px; height: 20px"
:src="selectedTab === 'honor' ? downArrow : rightArrow"
/>
</div>
</ul>
</nav>
<!-- 右侧内容区域 -->
<div class="content">
<component :is="currentComponent" />
</div>
</div>
<BottomView></BottomView>
</div>
</template>
<script setup>
import { ref, computed } from 'vue'
import InvestmentView from '../views/InvestmentAreas.vue'
import IndustryView from '../views/IndustryHonors.vue'
import AboutView from '../views/AboutView.vue'
import BottomView from '@/components/BottomView.vue'
import TopView from '@/components/TopView.vue'
import { useRoute } from 'vue-router'
import { makeRequiredProp } from 'vant/lib/utils'
import { useI18n } from 'vue-i18n'
import downArrow from '@/assets/images/downArrow.png'
import rightArrow from '@/assets/images/rightArrow.png'
const { locale } = useI18n()
const route = useRoute()
const selectedTab = ref(route.query.selectEn)
const itemTitle = ref(route.query.selectedItem)
const selectTab = (tab) => {
selectedTab.value = tab
// if (tab === 'about') {
// itemTitle.value = '关于我们'
// } else if (tab === 'investment') {
// itemTitle.value = '投资领域'
// } else {
// itemTitle.value = '业界荣誉'
// }
}
const itemTitleStr = computed(() => {
if (locale.value === 'en-US') {
if (selectedTab.value === 'about') {
itemTitle.value = 'About Us'
} else if (selectedTab.value === 'investment') {
itemTitle.value = 'Investment Areas'
} else {
itemTitle.value = 'Industry Honors'
}
} else if (locale.value === 'zh-CN') {
if (selectedTab.value === 'about') {
itemTitle.value = '关于我们'
} else if (selectedTab.value === 'investment') {
itemTitle.value = '投资领域'
} else {
itemTitle.value = '业界荣誉'
}
}
return itemTitle.value
})
const currentComponent = computed(() => {
const components = {
about: AboutView,
investment: InvestmentView,
honor: IndustryView
}
return components[selectedTab.value]
})
</script>
<style scoped>
.Container {
width: 100%;
background-color: white;
}
.titleContainer {
width: 100%;
height: 80px;
display: flex;
justify-content: center;
align-items: center;
color: #00243c;
font-size: 16px 微软雅黑;
font-weight: bold;
}
.main-container {
display: flex;
}
.sidebar {
padding-top: 50px;
justify-content: end;
width: 300px;
/* height: 100%; */
border-right: 0.5px solid #ddd;
}
.sidebar ul {
list-style: none;
padding: 0;
}
.sidebar li {
padding: 15px 20px;
cursor: pointer;
color: #000;
text-align: end;
margin-right: 50px;
}
.sidebar li.active {
font-weight: bold;
color: #6fb600;
}
.content {
flex: 1;
padding: 20px;
}
.itemStyle {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: end;
padding-right: 40px;
justify-content: end;
text-align: end;
}
</style>
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
// '@': '/src' // 确保别名指向正确的目录
}
},
build: {
assetsDir: 'assets'
}
})
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论