Skip to content

GitLab

Commit a87efb77 authored by 吕 成东's avatar 吕 成东
Browse files

初始化项目

parent 800b45f3
Pipeline #3079 canceled with stages
Expand all Show whitespace changes
Inline Side-by-side
src/components/Education.vue 0 → 100644
View file @ a87efb77
<script setup lang="ts">
const educationItems = [
{
title: '职业培训学校',
titleEn: 'VOCATIONAL TRAINING SCHOOL',
text: '英泽职业培训学校是由合肥英泽信息科技有限公司与天源迪科集团共同出资举办，经合肥市人力资源与社会保障局批准，报主管部门备案的一所专业从事IT职业技能培训的学校，并与美国硅谷国际科技大学...'
},
{
title: '人才实训中心',
titleEn: 'TALENT TRAINING CENTER',
text: '英泽科技人才实训完成"IT就业最后一公里"，既为期望进入IT兴业的职场新鲜人完成最后一公里的冲刺，同事为企业提供人才规模化供应渠道，搭建政府教育改革、搞笑人才培养与行业人才需求的互动平台和桥梁...'
},
{
title: '企业定向培训',
titleEn: 'ENTERPRISE OR IENTATION TRAINING',
text: '针对于企业个性化需求，提供企业定向培训的解决方案，主要包括：',
list: [
'员工培训解决方案制订及实施',
'行业培训解决方案制订及实施',
'特定岗位的定制培训'
]
}
]
</script>
<template>
<div class="teach">
<div class="center-width teach-main">
<div class="title"></div>
<div style="clear: both;"></div>
<div class="dialog">专注于IT职业技能培训、IT人才实训和企业定向培训，与客户、合作伙伴及整个产业共同促进IT人力资源发展。</div>
<ul class="teach-ul">
<li v-for="(item, index) in educationItems" :key="index">
<i></i>
<div class="teach-ul-div">
<p class="title">{{ item.title }}</p>
<p class="title-two">{{ item.titleEn }}</p>
<div class="text">
<template v-if="item.list">
{{ item.text }}
<ul class="text-ul">
<li v-for="(listItem, listIndex) in item.list" :key="listIndex">
{{ listItem }}
</li>
</ul>
</template>
<template v-else>
{{ item.text }}
</template>
</div>
<span class="more">MORE</span>
<div style="clear: both;"></div>
</div>
</li>
</ul>
</div>
</div>
</template>
<style scoped>
.teach {
width: 100%;
}
</style>
\ No newline at end of file
src/components/EducationSection.vue 0 → 100644
View file @ a87efb77
<template>
<div class="teach">
<div class="center-width teach-main">
<div class="title"></div>
<div style="clear: both;"></div>
<div class="dialog">专注于IT职业技能培训、IT人才实训和企业定向培训，与客户、合作伙伴及整个产业共同促进IT人力资源发展。</div>
<ul class="teach-ul">
<li>
<i></i>
<div class="teach-ul-div">
<p class="title">职业培训学校</p>
<p class="title-two">VOCATIONAL TRAINING SCHOOL</p>
<p class="text">英泽职业培训学校是由合肥英泽信息科技有限公司与天源迪科集团共同出资举办，经合肥市人力资源与社会保障局批准，报主管部门备案的一所专业从事IT职业技能培训的学校，并与美国硅谷国际科技大学...</p>
<span class="more">MORE</span>
<div style="clear: both;"></div>
</div>
</li>
<li>
<i></i>
<div class="teach-ul-div">
<p class="title">人才实训中心</p>
<p class="title-two">TALENT TRAINING CENTER</p>
<p class="text">英泽科技人才实训完成"IT就业最后一公里"，既为期望进入IT兴业的职场新鲜人完成最后一公里的冲刺，同事为企业提供人才规模化供应渠道，搭建政府教育改革、搞笑人才培养与行业人才需求的互动平台和桥梁...</p>
<span class="more">MORE</span>
<div style="clear: both;"></div>
</div>
</li>
<li>
<i></i>
<div class="teach-ul-div">
<p class="title">企业定向培训</p>
<p class="title-two">ENTERPRISE OR IENTATION TRAINING</p>
<div class="text">
针对于企业个性化需求，提供企业定向培训的解决方案，主要包括：
<ul class="text-ul">
<li>员工培训解决方案制订及实施</li>
<li>行业培训解决方案制订及实施</li>
<li>特定岗位的定制培训</li>
</ul>
......
</div>
<span class="more">MORE</span>
<div style="clear: both;"></div>
</div>
</li>
</ul>
</div>
</div>
</template>
\ No newline at end of file
src/components/Footer.vue 0 → 100644
View file @ a87efb77
<script setup lang="ts">
const footerLinks = [
{
title: '信息技术服务',
items: ['顾问服务', '业务流程服务', 'IT工程服务']
},
// {
// title: 'IT教育及培训',
// items: ['职业培训学校', '人才实训中心', '企业定向培训']
// },
{
title: '行业经验',
items: ['通信行业', '金融行业', '汽车制造行业']
},
{
title: '关于英泽科技',
items: ['公司简介', '企业文化', '荣誉资质']
}
]
const baseInfo = ['网站首页', '招聘信息', '联系我们', '合肥英泽']
</script>
<template>
<div class="footer">
<div class="center-width footer-main">
<i class="logo"></i>
<ul v-for="(group, index) in footerLinks" :key="index" class="footer-ul" :class="{ first: index === 0 }">
<li class="title">{{ group.title }}</li>
<li v-for="(item, itemIndex) in group.items" :key="itemIndex">{{ item }}</li>
</ul>
<div class="map"></div>
<div style="clear: both;"></div>
<div class="base-info">
<span v-for="(item, index) in baseInfo" :key="index">{{ item }}</span>
</div>
<div class="legal-info">
2020-2021 © 合肥英泽信息科技有限公司版权所有
<a href="https://beian.miit.gov.cn/" style="color: #fff;" target="_blank">鄂ICP备2021010942号-1</a>
</div>
</div>
</div>
</template>
<style scoped>
.footer {
width: 100%;
}
</style>
\ No newline at end of file
src/components/Header.vue 0 → 100644
View file @ a87efb77
<script setup lang="ts">
import { onMounted } from 'vue'
import Swiper from 'swiper'
import { Navigation, Pagination, Autoplay } from 'swiper/modules'
import 'swiper/css'
import 'swiper/css/pagination'
import 'swiper/css/navigation'
onMounted(() => {
new Swiper('.swiper-container', {
modules: [Navigation, Pagination, Autoplay],
loop: true,
navigation: {
nextEl: '.left',
prevEl: '.right',
},
autoplay: {
delay: 5000,
disableOnInteraction: false
},
pagination: {
el: '.swiper-pagination',
clickable: true
}
})
})
</script>
<template>
<div class="header">
<div class="center-width header-top">
<i class="logo"></i>
<ul class="navigation">
<li class="active">首 页</li>
<li>产品技术</li>
<li>客户名录</li>
<li>新闻资讯</li>
<li>加入我们</li>
<li>关于我们</li>
</ul>
<div style="clear: both;"></div>
</div>
<div class="swiper-container use-swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="../assets/images/banner_one.png" alt="">
</div>
<div class="swiper-slide">
<img src="../assets/images/banner_one.png" alt="">
</div>
</div>
<div class="swiper-pagination"></div>
<div class="center-width btns">
<div class="btn right"></div>
<div class="cut"></div>
<div class="btn left"></div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</template>
<style scoped>
.header {
width: 100%;
}
</style>
\ No newline at end of file
src/components/Service.vue 0 → 100644
View file @ a87efb77
<script setup lang="ts">
const services = [
{ icon: '', text: '服务顾问' },
{ icon: '', text: '业务流程服务' },
{ icon: '', text: 'IT工程服务' },
{ icon: '', text: '产品工程服务' },
{ icon: '', text: '产品工程服务' }
]
</script>
<template>
<div class="serve">
<div class="center-width serve-main">
<div class="left">
<div class="title"></div>
<div class="img"></div>
</div>
<div class="right">
<p class="title">
<span class="text">以专业的技术和丰富的实践经验，为客户提供信息技术咨询、信息技术运维、设计开发与测试、数据处理、集成实施，以及信息系统增值等相关</span>
</p>
<ul class="examples">
<li v-for="(service, index) in services" :key="index">
<i></i>
<p class="text">{{ service.text }}</p>
</li>
</ul>
</div>
<div style="clear: both;"></div>
</div>
</div>
</template>
<style scoped>
.serve {
width: 100%;
}
</style>
\ No newline at end of file
src/components/ServiceSection.vue 0 → 100644
View file @ a87efb77
<template>
<div class="serve">
<div class="center-width serve-main">
<div class="left">
<div class="title"></div>
<div class="img"></div>
</div>
<div class="right">
<p class="title"><span class="text">以专业的技术和丰富的实践经验，为客户提供信息技术咨询、信息技术运维、设计开发与测试、数据处理、集成实施，以及信息系统增值等相关</span></p>
<ul class="examples">
<li>
<i></i>
<p class="text">服务顾问</p>
</li>
<li>
<i></i>
<p class="text">业务流程服务</p>
</li>
<li>
<i></i>
<p class="text">IT工程服务</p>
</li>
<li>
<i></i>
<p class="text">产品工程服务</p>
</li>
<li>
<i></i>
<p class="text">产品工程服务</p>
</li>
</ul>
</div>
<div style="clear: both;"></div>
</div>
</div>
</template>
\ No newline at end of file
src/components/Solution.vue 0 → 100644
View file @ a87efb77
<script setup lang="ts">
const solutions = [
{ icon: 'icon-tongxin', text: '通信行业' },
{ icon: 'icon-jinrong', text: '金融行业' },
{ icon: 'icon-qiche', text: '汽车制造行业' },
{ icon: 'icon-zhengfu', text: '政府及公共事业' },
{ icon: 'icon-ditu', text: 'GIS应用' }
]
const products = [
{ icon: 'icon-tongxin', text: '通信行业' },
{ icon: 'icon-jinrong', text: '金融行业' },
{ icon: 'icon-qiche', text: '汽车制造行业' },
{ icon: 'icon-zhengfu', text: '政府及公共事业' }
]
</script>
<template>
<div class="blue-print">
<div class="center-width print-main">
<div class="title"></div>
<div class="product">
<div class="left">依托在通信、金融、汽车制造、政府及公共事业等领域的长期积累 、以客户为核心延伸IT服务价值，由个性化向整体化迈进。</div>
<div class="right plan">
<div class="title-text">解决方案</div>
<div class="title-english">SOLUTION</div>
<div style="clear: both;"></div>
<ul class="print-ul">
<li v-for="(item, index) in solutions" :key="index">
<i :class="item.icon"></i>{{ item.text }}
</li>
</ul>
</div>
<div class="right">
<div class="title-text">软件产品</div>
<div class="title-english">SOFTWARE PRODUCTS</div>
<div style="clear: both;"></div>
<ul class="print-ul">
<li v-for="(item, index) in products" :key="index">
<i :class="item.icon"></i>{{ item.text }}
</li>
</ul>
</div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</template>
<style scoped>
.blue-print {
width: 100%;
}
</style>
\ No newline at end of file
src/components/SolutionsSection.vue 0 → 100644
View file @ a87efb77
<template>
<div class="blue-print">
<div class="center-width print-main">
<div class="title"></div>
<div class="product">
<div class="left">依托在通信、金融、汽车制造、政府及公共事业等领域的长期积累 、以客户为核心延伸IT服务价值，由个性化向整体化迈进。</div>
<div class="right plan">
<div class="title-text">解决方案</div>
<div class="title-english">SOLUTION</div>
<div style="clear: both;"></div>
<ul class="print-ul">
<li><i class="icon-tongxin"></i>通信行业</li>
<li><i class="icon-jinrong"></i>金融行业</li>
<li><i class="icon-qiche"></i>汽车制造行业</li>
<li><i class="icon-zhengfu"></i>政府及公共事业</li>
<li><i class="icon-ditu"></i>GIS应用</li>
</ul>
</div>
<div class="right">
<div class="title-text">软件产品</div>
<div class="title-english">SOFTWARE PRODUCTS</div>
<div style="clear: both;"></div>
<ul class="print-ul">
<li><i class="icon-tongxin"></i>通信行业</li>
<li><i class="icon-jinrong"></i>金融行业</li>
<li><i class="icon-qiche"></i>汽车制造行业</li>
<li><i class="icon-zhengfu"></i>政府及公共事业</li>
</ul>
</div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</template>
\ No newline at end of file
src/components/TheFooter.vue 0 → 100644
View file @ a87efb77
<script setup>
import { useRouter } from 'vue-router'
const router = useRouter()
const navigateHome = () => {
router.push('/')
}
</script>
<template>
<div class="footer">
<div class="center-width footer-main">
<i class="logo"></i>
<ul class="footer-ul first">
<li class="title">信息技术服务</li>
<li>顾问服务</li>
<li>业务流程服务</li>
<li>IT工程服务</li>
</ul>
<ul class="footer-ul">
<li class="title">IT教育及培训</li>
<li>职业培训学校</li>
<li>人才实训中心</li>
<li>企业定向培训</li>
</ul>
<ul class="footer-ul">
<li class="title">行业经验</li>
<li>通信行业</li>
<li>金融行业</li>
<li>汽车制造行业</li>
</ul>
<ul class="footer-ul">
<li class="title">关于英泽科技</li>
<li>公司简介</li>
<li>企业文化</li>
<li>荣誉资质</li>
</ul>
<div class="map"></div>
<div style="clear: both;"></div>
<div class="base-info">
<span @click="navigateHome">网站首页</span>
<span @click="router.push('/join')">招聘信息</span>
<span @click="router.push('/about')">联系我们</span>
<span>天源迪科</span>
</div>
<div class="legal-info">2020-2023 © 武汉天源迪科数据科技有限公司版权所有 <a href="https://beian.miit.gov.cn/" style="color: #fff;" target="_blank">鄂ICP备2021010942号-1</a></div>
</div>
</div>
</template>
\ No newline at end of file
src/components/TheHeader.vue 0 → 100644
View file @ a87efb77
<script setup>
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const activeIndex = ref(0)
const navItems = [
{ name: '首 页', route: '/' },
{ name: '产品技术', route: '/products' },
{ name: '客户名录', route: '/customers' },
{ name: '新闻资讯', route: '/news' },
{ name: '加入我们', route: '/join' },
{ name: '关于我们', route: '/about' }
]
const navigateTo = (route, index) => {
activeIndex.value = index
router.push(route)
}
onMounted(() => {
// Initialize Swiper
const script = document.createElement('script')
script.src = '@/js/swiper.min.js'
script.onload = () => {
new window.Swiper('.swiper-container', {
loop: true,
navigation: {
nextEl: '.left',
prevEl: '.right',
},
autoplay: {
delay: 5000,
disableOnInteraction: false
},
pagination: {
el: '.swiper-pagination',
clickable: true
}
})
}
document.head.appendChild(script)
})
</script>
<template>
<div class="header">
<div class="center-width header-top">
<i class="logo"></i>
<ul class="navigation">
<li
v-for="(item, index) in navItems"
:key="index"
:class="{ active: activeIndex === index }"
@click="navigateTo(item.route, index)"
>
{{ item.name }}
</li>
</ul>
<div style="clear: both;"></div>
</div>
<div class="swiper-container use-swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="@/assets/images/banner_one.png" alt="">
</div>
<div class="swiper-slide">
<img src="@/assets/images/banner_one.png" alt="">
</div>
</div>
<!-- 分页器 -->
<div class="swiper-pagination"></div>
<div class="center-width btns">
<div class="btn right"></div>
<div class="cut"></div>
<div class="btn left"></div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</template>
\ No newline at end of file
src/js/swiper.min.js 0 → 100644
View file @ a87efb77
This diff is collapsed.
src/main.js 0 → 100644
View file @ a87efb77
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
const app = createApp(App)
app.use(router)
app.mount('#app')
\ No newline at end of file
src/router/index.js 0 → 100644
View file @ a87efb77
import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
routes: [
{
path: '/',
name: 'home',
component: HomeView
},
{
path: '/products',
name: 'products',
component: () => import('../views/ProductsView.vue')
},
{
path: '/customers',
name: 'customers',
component: () => import('../views/CustomersView.vue')
},
{
path: '/news',
name: 'news',
component: () => import('../views/NewsView.vue')
},
{
path: '/join',
name: 'join',
component: () => import('../views/JoinView.vue')
},
{
path: '/about',
name: 'about',
component: () => import('../views/AboutView.vue')
}
]
})
export default router
\ No newline at end of file
src/styles/style.css 0 → 100644
View file @ a87efb77
body,
div,
p,
ul,
li {
padding: 0;
margin: 0;
}
body {
/* font-family: Microsoft YaHei; */
font-family: Source Han Sans CN;
}
.center-width {
width: 1200px;
margin: auto;
}
/* header */
.header {
position: relative;
width: 100%;
}
.header .header-top {
position: absolute;
left: 0;
right: 0;
top: 0;
margin: auto;
z-index: 10;
}
.header .logo {
float: left;
display: inline-block;
width: 100px;
height: 70px;
background-image: url("@/assets/images/icon_logo.png");
background-size: 100% 100%;
background-repeat: no-repeat;
}
.navigation {
float: right;
padding-top: 40px;
font-size: 20px;
list-style: none;
}
.navigation li {
position: relative;
display: inline-block;
margin-right: 26px;
color: #fff;
cursor: pointer;
}
.navigation li::after {
display: none;
content: "";
position: absolute;
left: 0;
bottom: -25px;
width: 100%;
height: 4px;
border-radius: 2px;
background: #76b3ff;
}
.navigation li:hover {
color: #76b3ff;
}
.navigation li:hover::after {
display: inline-block;
}
.navigation li.active {
color: #76b3ff;
}
.navigation li.active::after {
display: inline-block;
}
/* 服务 */
.serve {
width: 100%;
background: #fff;
}
.serve .serve-main {
padding: 104px 0 104px 0;
}
.serve .serve-main .left {
width: 370px;
float: left;
}
.serve .serve-main .right {
width: 700px;
padding: 118px 60px 0 0;
float: right;
}
.serve-main .left .title {
width: 367px;
height: 86px;
background: url("@/assets/images/serve_lefttop.png") 0 0 no-repeat;
}
.serve-main .left .img {
width: 306px;
height: 372px;
margin-top: 46px;
background: url("@/assets/images/serve_left.png") 0 0 no-repeat;
}
.serve-main .right .title {
position: relative;
font-size: 19px;
line-height: 36px;
height: 72px;
}
.serve-main .right .title .text {
position: absolute;
left: 0;
top: 0;
z-index: 10;
}
.serve-main .right .title::before {
content: "";
position: absolute;
left: 0;
top: -30px;
display: inline-block;
width: 53px;
height: 48px;
background: url("@/assets/images/icon_yinhao.png") 0 0 no-repeat;
z-index: 1;
}
.examples {
width: 100%;
margin-top: 76px;
list-style: none;
font-size: 0;
}
.examples > li {
width: 20%;
display: inline-block;
}
.examples > li > i {
display: block;
width: 67px;
height: 120px;
background: url("@/assets/images/icon_exa_one.png") 0 0 no-repeat;
margin: auto;
}
.examples > li:nth-child(2) > i {
width: 56px;
background: url("@/assets/images/icon_exa_two.png") 0 0 no-repeat;
}
.examples > li:nth-child(3) > i {
width: 62px;
background: url("@/assets/images/icon_exa_three.png") 0 0 no-repeat;
}
.examples > li:nth-child(4) > i {
width: 52px;
background: url("@/assets/images/icon_exa_four.png") 0 0 no-repeat;
}
.examples > li:nth-child(5) > i {
width: 59px;
background: url("@/assets/images/icon_exa_five.png") 0 0 no-repeat;
}
.examples > li .text {
margin-top: 40px;
text-align: center;
font-size: 16px;
color: #373737;
}
/* 培训 */
.teach {
width: 100%;
/* height: 999px; */
background: url("@/assets/images/teach_back.png");
}
.teach .teach-main {
padding: 65px 0 88px 0;
}
.teach .teach-main > .title {
float: right;
width: 281px;
height: 86px;
background: url("@/assets/images/iocn_title.png") 0 0 no-repeat;
}
.teach .dialog {
position: relative;
width: 716px;
font-size: 18px;
line-height: 36px;
color: #0e4991;
background: #fff;
padding: 24px 32px;
}
.teach .dialog::after {
content: "";
position: absolute;
width: 0;
height: 0;
border-top: 41px solid #3778c7;
border-left: 60px solid transparent;
left: 0;
bottom: -41px;
}
.teach .teach-ul {
margin-top: 72px;
list-style: none;
}
.teach .teach-ul > li {
width: 320px;
display: inline-block;
vertical-align: top;
margin-right: 100px;
}
.teach .teach-ul > li:last-child {
margin-right: 0;
}
.teach-ul > li > i {
display: inline-block;
width: 279px;
height: 212px;
background: url("@/assets/images/icon_team_one.png") 0 0 no-repeat;
}
.teach-ul > li:nth-child(2) > i {
display: inline-block;
width: 280px;
background: url("@/assets/images/icon_team_two.png") 0 0 no-repeat;
}
.teach-ul > li:nth-child(3) > i {
display: inline-block;
width: 280px;
background: url("@/assets/images/icon_team_three.png") 0 0 no-repeat;
}
.teach-ul .teach-ul-div {
position: relative;
margin-top: 20px;
padding: 26px 30px;
background: #fff;
border-radius: 5px;
}
.teach-ul .teach-ul-div::after {
content: "";
position: absolute;
left: 0;
top: 0;
display: inline-block;
width: 0;
height: 0;
border-top: 72px solid rgba(14, 73, 145, 0.3);
border-right: 72px solid transparent;
}
.teach-ul .teach-ul-div .title {
color: #1561be;
font-size: 20px;
font-weight: 700;
}
.teach-ul .teach-ul-div .title-two {
font-size: 14px;
color: #1561be;
margin-top: 12px;
font-family: "微软雅黑";
}
.teach-ul .teach-ul-div .text {
height: 153px;
font-size: 14px;
color: #737373;
line-height: 28px;
margin-top: 22px;
}
.teach-ul .teach-ul-div .more {
margin-top: 32px;
float: right;
position: relative;
display: inline-block;
width: 90px;
height: 42px;
padding-left: 30px;
background: #ff6600;
color: #fff;
text-align: left;
line-height: 42px;
cursor: pointer;
}
.teach-ul .teach-ul-div .more::after {
content: "";
position: absolute;
display: inline-block;
top: 0;
bottom: 0;
right: 24px;
margin: auto;
width: 12px;
height: 11px;
background: url("@/assets/images/icon_xiayi.png") 0 0 no-repeat;
}
.teach-ul .text-ul {
list-style: initial;
padding-left: 20px;
margin-top: 0;
}
/* 解决方案 */
.blue-print {
width: 100%;
background: #fff;
}
.print-main {
padding: 100px 0 130px 0;
}
.print-main > .title {
width: 212px;
height: 86px;
background: url("@/assets/images/icon_title_three.png") 0 0 no-repeat;
}
.product {
margin-top: 30px;
}
.product .left {
position: relative;
width: 263px;
font-size: 18px;
line-height: 36px;
padding-top: 40px;
float: left;
}
.product .right {
position: relative;
float: right;
width: 325px;
height: 347px;
padding: 40px 30px 0 90px;
margin-right: 10px;
background: url("@/assets/images/product_back_one.png") 0 0 no-repeat;
}
.product .right:nth-child(3) {
background: url("@/assets/images/product_back_two.png") 0 0 no-repeat;
}
.product .right::after {
content: "";
position: absolute;
left: 31px;
top: 24px;
display: inline-block;
width: 34px;
height: 34px;
background: url("@/assets/images/iocn_shui.png") 0 0 no-repeat;
z-index: 1;
}
.product .right::before {
content: "";
display: inline-block;
position: absolute;
left: 48px;
top: 37px;
width: 22px;
height: 24px;
background: url("@/assets/images/icon_ruanjian.png") 0 0 no-repeat;
z-index: 10;
}
.product .right.plan::before {
background: url("@/assets/images/icon_fangan.png") 0 0 no-repeat;
}
.product .right .title-text {
float: left;
color: #fff;
font-size: 18px;
font-weight: 700;
}
.product .right .title-english {
float: right;
font-size: 14px;
color: rgba(255, 255, 255, 0.2);
font-family: Arial;
}
.product .left::after {
content: "";
position: absolute;
left: 0;
top: 5px;
display: inline-block;
width: 120px;
height: 2px;
background: #0e4991;
}
.product .print-ul {
margin-top: 50px;
padding-left: 62px;
color: #fff;
list-style: none;
}
.product .print-ul > li {
position: relative;
padding-left: 36px;
margin-bottom: 33px;
cursor: pointer;
}
.product .print-ul > li > i {
position: absolute;
left: 0;
top: 0;
display: inline-block;
width: 18px;
height: 18px;
}
.icon-tongxin {
background: url("@/assets/images/icon_tongxin.png") 0 0 no-repeat;
}
.icon-jinrong {
background: url("@/assets/images/icon_jinrong.png") 0 0 no-repeat;
}
.product .print-ul > li > i.icon-qiche {
width: 22px;
}
.icon-qiche {
background: url("@/assets/images/icon_qiche.png") 0 5px no-repeat;
}
.icon-zhengfu {
background: url("@/assets/images/icon_zhengfu.png") 0 0 no-repeat;
}
.icon-ditu {
background: url("@/assets/images/icon_ditu.png") 0 0 no-repeat;
}
/* footer */
.footer {
width: 100%;
background: #000000;
}
.footer .footer-main {
position: relative;
padding: 72px 0 25px 0;
}
.footer .logo {
position: absolute;
left: 0;
top: 0;
display: inline-block;
width: 100px;
height: 70px;
background: url("@/assets/images/icon_logo.png") 0 0 no-repeat;
background-size: 100% 100%;
background-repeat: no-repeat;
}
.footer-main .footer-ul {
float: left;
width: 140px;
color: #fff;
font-size: 18px;
list-style: none;
margin-left: 80px;
}
.footer-main .footer-ul.first {
margin-left: 120px;
}
.footer-main .footer-ul > .title {
font-size: 22px;
font-weight: 700;
margin-bottom: 35px;
cursor: context-menu;
}
.footer-main .footer-ul > li {
cursor: pointer;
margin-bottom: 18px;
}
.footer-main .footer-ul > li:last-child {
margin-bottom: 0;
}
.footer-main .map {
float: right;
width: 195px;
height: 156px;
background: url("@/assets/images/icon_map.png") 0 0 no-repeat;
}
.base-info {
margin-top: 60px;
text-align: center;
border-top: 1px dashed #fff;
border-bottom: 1px dashed #fff;
font-size: 18px;
color: #fff;
line-height: 40px;
}
.base-info > span {
cursor: pointer;
}
.base-info > span::after {
content: "";
display: inline-block;
width: 1px;
height: 18px;
background: rgba(255, 255, 255, 0.6);
margin: 0 24px;
vertical-align: text-top;
}
.base-info > span:last-child::after {
display: none;
margin: 0;
}
.legal-info {
margin-top: 21px;
font-size: 18px;
color: #fff;
text-align: center;
}
/* swiper */
.swiper-container {
width: 100%;
height: 700px;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.use-swiper .swiper-pagination-bullet {
width: 55px;
height: 4px;
background: #fff;
border-radius: 2px;
}
.use-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {
background: #ff6600;
}
.use-swiper .btns {
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
z-index: 10;
}
.use-swiper .btns {
}
.use-swiper .btns .cut {
float: right;
width: 1px;
height: 43px;
padding-top: 17px;
background: rgba(0, 0, 0, 0.3);
}
.use-swiper .btns .cut::after {
content: "";
display: inline-block;
width: 1px;
height: 26px;
background: rgba(255, 255, 255, 0.3);
}
.use-swiper .btns .btn {
float: right;
display: inline-block;
width: 52px;
height: 39px;
padding: 21px 0 0 32px;
background: rgba(0, 0, 0, 0.3);
cursor: pointer;
}
.use-swiper .btns .left::after {
display: inline-block;
content: "";
width: 20px;
height: 19px;
background: url("@/assets/images/icon_left.png") 0 0 no-repeat;
}
.use-swiper .btns .right::after {
display: inline-block;
content: "";
width: 20px;
height: 19px;
background: url("@/assets/images/icon_right.png") 0 0 no-repeat;
}
src/styles/swiper.min.css 0 → 100644
View file @ a87efb77
This diff is collapsed.
src/views/AboutView.vue 0 → 100644
View file @ a87efb77
<script setup>
import TheHeader from '../components/TheHeader.vue'
import TheFooter from '../components/TheFooter.vue'
</script>
<template>
<div class="about">
<TheHeader />
<div class="center-width" style="padding: 50px 0; min-height: 400px;">
<h1>关于我们</h1>
<p>此页面正在开发中...</p>
</div>
<TheFooter />
</div>
</template>
\ No newline at end of file
src/views/CustomersView.vue 0 → 100644
View file @ a87efb77
<script setup>
import TheHeader from '../components/TheHeader.vue'
import TheFooter from '../components/TheFooter.vue'
</script>
<template>
<div class="customers">
<TheHeader />
<div class="center-width" style="padding: 50px 0; min-height: 400px;">
<h1>客户名录</h1>
<p>此页面正在开发中...</p>
</div>
<TheFooter />
</div>
</template>
\ No newline at end of file
src/views/HomeView.vue 0 → 100644
View file @ a87efb77
<script setup lang="ts">
import Header from '@/components/Header.vue'
import Service from '@/components/Service.vue'
import Education from '@/components/Education.vue'
import Solution from '@/components/Solution.vue'
import Footer from '@/components/Footer.vue'
</script>
<template>
<div class="home">
<Header />
<Service />
<!-- <Education /> -->
<Solution />
<Footer />
</div>
</template>
<style scoped>
.home {
width: 100%;
}
</style>
\ No newline at end of file
src/views/JoinView.vue 0 → 100644
View file @ a87efb77
<script setup>
import TheHeader from '../components/TheHeader.vue'
import TheFooter from '../components/TheFooter.vue'
</script>
<template>
<div class="join">
<TheHeader />
<div class="center-width" style="padding: 50px 0; min-height: 400px;">
<h1>加入我们</h1>
<p>此页面正在开发中...</p>
</div>
<TheFooter />
</div>
</template>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment