x

src/components/imageQuery/index.vue

@@ -0,0 +1,96 @@
+<template>
+  <div class="image-dialog" v-if="screensa" @click="exitHandle">
+    <!-- <a @click="exitHandle"><i class="iconfont icon-left"></i>返回</a> -->
+    <div class="image-layout" @click.stop>
+      <i class="iconfont up" @click="current = current == 0 ? screensa.length - 1: --current" slot="up">&lt;</i>
+      <Slide :screens="screensa" :current="current">
+        <img slot="item" slot-scope="{data}" :src="data" class="image-item"  @click.stop>
+      </Slide>
+      <i class="iconfont next" @click="current = current == screensa.length - 1 ? 0: ++current" slot="next">&gt;</i>
+    </div>
+  </div>
+</template>
+
+<script>
+import Slide from '@/components/Slide'
+export default {
+  components: { Slide },
+  props: ['screens'],
+  data () {
+    return {
+      current: 0,
+      screensa: this.screens
+    }
+  },
+  watch: {
+    screens () {
+      this.screensa = this.screens
+    }
+  },
+  methods: {
+    exitHandle () {
+      this.screensa = null
+      this.$emit('exitHandle')
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+.image-dialog {
+  position: fixed;
+  z-index: 9999999999999999999;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0,0,0,0.8);
+}
+
+.image-dialog a {
+  position: absolute;
+  color: #fff;
+  background-color: #fa3800;
+  left: 10px;
+  top: 10px;
+  padding: 8px 15px;
+  cursor: pointer;
+  border-radius: 3px;
+}
+
+.image-layout {
+  width: 60%;
+  padding-left: 20px;
+  padding-right: 20px;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translateY(-50%) translateX(-50%);
+}
+
+.image-item {
+  width: 100%;
+  border: 10px solid #fff;
+  border-radius: 3px;
+}
+
+.iconfont {
+  color: #fff;
+  background-color: rgb(0,180,240);
+  padding: 8px 15px;
+  cursor: pointer;
+  border-radius: 3px;
+  position: absolute;
+}
+
+.iconfont.up {
+  left: -80px;
+  top: 50%;
+}
+
+.iconfont.next {
+  right: -80px;
+  top: 50%;
+}
+</style>

src/components/menu/index.vue

@@ -61,7 +61,7 @@ export default {
       this.$emit('hide')
     },
     sizeHandle () {
-      if (window.innerWidth < 1400) {
+      if (window.innerWidth < 1230) {
         this.isMobile = true
       } else {
         this.isMobile = false
@@ -113,7 +113,7 @@ export default {
     transform: rotateZ(-90deg);
     position: absolute;
     top: 30px;
-    right: 25px;
+    right: 20px;
     margin-top: -12px;
     transition: transform linear .3s;
     font-size: 25px;
@@ -129,7 +129,7 @@ export default {
     padding-left: 20px;
   }
 
-  @media screen and (min-width: 1400px) {
+  @media screen and (min-width: 1230px) {
     .child {
       padding-left: 0;
       overflow: hidden;
@@ -145,13 +145,26 @@ export default {
     .child > .a {
       background-color: #1a1a1a;
       text-align: left;
-      padding-left: 40px;
-      padding-right: 40px;
+      padding-left: 20px;
+      padding-right: 20px;
       white-space: nowrap;
     }
 
     .h-layout  {
       padding: 0
     }
+    .menu-componet span {
+      right: 5px;
+    }
+  }
+
+  @media screen and (min-width: 1400px) {
+    .child > .a {
+      padding-left: 40px;
+      padding-right: 40px;
+    }
+    .menu-componet span {
+      right: 25px;
+    }
   }
 </style>

src/components/recruit/index.vue

@@ -131,16 +131,16 @@ const data = [
     address: 'Zhuhai',
     count: 1,
     date: '2018-06-12',
-    desc: `1.	Responsible to develop and optimize 3D reconstruction algorithms of images;<br>
-           2.	Build new functionality based upon existing 3D reconstruction algorithms;<br>
+    desc: `1. Responsible to develop and optimize 3D reconstruction algorithms of images;<br>
+           2. Build new functionality based upon existing 3D reconstruction algorithms;<br>
            3.   Work closely with your teams to solve other problems.`,
-    req: `1.	MS or PhD degree in Pattern Recognition, Communications Engineering, Computer Science, Automation, Mathematics or related field; <br>
-          2.	Demonstrated knowledge on C++ and MATLAB and strong programming skills;<br>
-          3.	Experience with OpenCV/ceres-solver or related libraries;<br>
-          4.	Experience programming using Linux and Windows;<br>
-          5.	Fast learner, proficiency in English reading; <br>
-          6.  Proficiency in commonly used data structures and algorithms, ability to analyze and optimize calculation logic to improve performance<br>
-          7.  Post-graduate students with no work experience but are willing to engage in 3D reconstruction are also accepted.`,
+    req: `1. MS or PhD degree in Pattern Recognition, Communications Engineering, Computer Science, Automation, Mathematics or related field; <br>
+          2. Demonstrated knowledge on C++ and MATLAB and strong programming skills;<br>
+          3. Experience with OpenCV/ceres-solver or related libraries;<br>
+          4. Experience programming using Linux and Windows;<br>
+          5. Fast learner, proficiency in English reading; <br>
+          6. Proficiency in commonly used data structures and algorithms, ability to analyze and optimize calculation logic to improve performance<br>
+          7. Post-graduate students with no work experience but are willing to engage in 3D reconstruction are also accepted.`,
     bonus: `1. Experienced in related projects of feature extraction and matching, based on image 3D reconstruction (SFM) is preferred.`
   },
   {

src/pages/about/index.vue

@@ -29,24 +29,28 @@
           <p><span>2018.05</span>4DKanKan, the world's first consumer-grade 3D camera was launched, capable of reconstructing 100㎡ of space in five minutes – one twentieth of the time required for image acquisition by existing machines – and costing one-tenth the price of traditional 3D modeling equipment.</p>
           <p><span>2018.08</span>4DMuseum, the online exhibition platform, was launched. The first online art space created by 3D AI digital technology in China, the platform integrates online exhibitions, exhibition information, exhibition hall details and user comments.</p>
           <p><span>2018.11</span>The third China-Germany Artificial Intelligence Conference was held successfully. 4DAGE has shown the world its leading 3D digitization technology and its open platform for AI developers. It also released its 3D reconstruction technology at mobile end, and the updated version of its 3D camera, 4DKanKan.</p>
+          <p><span>2018.12</span>Granted approval by Guangdong Province to establish a Doctoral Workstation.</p>
+          <p><span>2019.01</span>Established a collaboration with Hetjens - German Museum of Ceramics, launched the Museum’s first online exhibition, and got featured in the Rheinische Post. </p>
+          <p><span>2019.04</span>The project with Hetjens Museum was demonstrated in the Belt and Road Forum, along with cases from Huawei, Ant Financial, Tencent, iFlytek, etc.</p>
+          <p><span>2019.05</span>Reached a strategic cooperation with C-trip in implementing the platform’s online 3D virtual tour function.</p>
+          <p><span>2019.05</span>Unveiled 4DKanKan Pro, the new generation 3D space camera.</p>
         </div>
       </div>
       <div class="product">
         <ImageShear :src="contentbg" :height="height" class="bg" />
       </div>
 
-      
       <div class="join-info">
 
         <div class="join-item">
-          <img src="@/assets/images/bg1.png" class="join-bg-1 join-bg-item-1">
+          <img src="http://video.cgaii.com/new4dage/images/images/bg1.png" class="join-bg-1 join-bg-item-1">
           <div class="join-content">
             <div class="join-img">
               <div class="img">
-                <img src="@/assets/images/item-1.jpg" alt="">
+                <img src="http://video.cgaii.com/new4dage/images/images/item-1.jpg" alt="">
               </div>
               <div class="img">
-                <img src="@/assets/images/item-2.jpg" alt="">
+                <img src="http://video.cgaii.com/new4dage/images/images/item-2.jpg" alt="">
               </div>
             </div>
             <div class="join-list">
@@ -58,18 +62,18 @@
               </ul>
             </div>
           </div>
-          <img src="@/assets/images/bg2.png" class="join-bg-2 join-bg-item-2">
+          <img src="http://video.cgaii.com/new4dage/images/images/bg2.png" class="join-bg-2 join-bg-item-2">
         </div>
 
         <div class="join-item">
-          <img src="@/assets/images/bg3.png" class="join-bg-1 join-bg-item-3">
+          <img src="http://video.cgaii.com/new4dage/images/images/bg3.png" class="join-bg-1 join-bg-item-3">
           <div class="join-content">
             <div class="join-img">
               <div class="img">
-                <img src="@/assets/images/item-3.jpg" alt="">
+                <img src="http://video.cgaii.com/new4dage/images/images/item-3.jpg" alt="">
               </div>
               <div class="img">
-                <img src="@/assets/images/item-4.jpg" alt="">
+                <img src="http://video.cgaii.com/new4dage/images/images/item-4.jpg" alt="">
               </div>
             </div>
             <div class="join-list">
@@ -81,17 +85,17 @@
               </ul>
             </div>
           </div>
-          <img src="@/assets/images/bg4.png" class="join-bg-2 join-bg-item-4">
+          <img src="http://video.cgaii.com/new4dage/images/images/bg4.png" class="join-bg-2 join-bg-item-4">
         </div>
 
         <div class="join-item">
           <div class="join-content">
             <div class="join-img">
               <div class="img">
-                <img src="@/assets/images/item-5.jpg" alt="">
+                <img src="http://video.cgaii.com/new4dage/images/images/item-5.jpg" alt="">
               </div>
               <div class="img">
-                <img src="@/assets/images/item-6.jpg" alt="">
+                <img src="http://video.cgaii.com/new4dage/images/images/item-6.jpg" alt="">
               </div>
             </div>
             <div class="join-list">

src/pages/home/index.vue

@@ -275,13 +275,24 @@ export default {
       courses: {
         data: [
           {
+            time: '2019',
+            title: 'Unshakeable Shoshin',
+            content: [
+              `Established a collaboration with Hetjens - German Museum of Ceramics, launched the Museum’s first online exhibition, and got featured in the Rheinische Post. `,
+              `The project with Hetjens Museum was demonstrated in the Belt and Road Forum, along with cases from Huawei, Ant Financial, Tencent, iFlytek, etc.`,
+              'Reached a strategic cooperation with C-trip in implementing the online 3D virtual tour function.',
+              `Unveiled 4DKanKan Pro, the new generation 3D space camera.`
+            ]
+          },
+          {
             time: '2018',
             title: 'Unshakeable Shoshin',
             content: [
               `Provided intelligent visual display supports for CCTV and Guangdong Spring Festival Gala.`,
               `Launched 4DKanKan, the world's first consumer-grade 3D camera, capable of reconstructing 100m2 of space in five minutes, and features easy operation, automation and high precision.`,
               'Released 4DMuseum, the first online platform for art spaces, integrating 3D exhibitions, informative services and user interactions.',
-              `The 3rd China-Germany Artificial Intelligence Conference was held successfully.`
+              `The 3rd China-Germany Artificial Intelligence Conference was held successfully.`,
+              `Granted approval by Guangdong Province to establish a Doctoral Workstation.`
             ]
           },
           {

src/pages/home/style.css

@@ -518,7 +518,7 @@
 .time-zhou span {
   font-size: 16px;
   color: #fff;
-  width: 20%;
+  width: 16%;
   float: left;
   text-align: center;
   line-height: 40px;
@@ -681,7 +681,7 @@
 
 
   .course-item {
-    width: 18%;
+    width: 14%;
     margin-right: 2.5% !important;
     margin-bottom: 60px;
   }

src/pages/information/news/details.vue

@@ -65,3 +65,11 @@ export default {
   text-align: left;
 }
 </style>
+
+<style>
+
+.new-content img,
+.new-content video {
+  max-width: 100% !important;
+}
+</style>

src/pages/information/news/index.vue

@@ -88,21 +88,38 @@ export default {
   color: #00b4ed;
 }
 
-@media screen and (min-width: 950px) {
+@media screen and (min-width: 700px) {
   .article {
-    padding-left: 330px;
+    padding-right: calc(100% - 330px);
     position: relative;
-    min-height: 240px;
     padding-bottom: 40px;
     margin-bottom: 40px;
   }
 
   .article img {
+    width: 300px;
+  }
+
+  .article div {
     position: absolute;
+    left: 330px;
+    right: 0;
     top: 0;
-    left: 0;
-    width: 300px;
-    max-height: calc(100% - 40px)
+    bottom: 40px;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .article h2,
+  .article a,
+  .article span {
+    flex: 0 0 auto;
+  }
+
+  .article p {
+    height: 88px;
+    flex: 0 0 auto;
+    overflow: hidden;
   }
 
   .article h2 {

src/pages/layout/footer.vue

@@ -31,7 +31,7 @@
         <p><span>Business Collaboration</span>sales@4dage.com</p>
         <p><span>Public Relations</span>pr@4dage.com</p>
         <p><span>Telephone</span>+86 400-6698-025</p>
-        <a href="http://show.4dage.com/brochure_en" target="_blank">4DAGE Broschüre herunterladen</a>
+        <a href="http://show.4dage.com/brochure_en" target="_blank">Download 4DAGE Brochure</a>
       </div>
       <div class="relevant">
         <div>

src/pages/layout/header.vue

@@ -171,7 +171,7 @@ export default {
       this.showMenu = !this.showMenu
     },
     sizeHandle () {
-      if (window.innerWidth < 1400) {
+      if (window.innerWidth < 1230) {
         this.mxHeight = window.innerHeight - 65
       } else {
         this.mxHeight = 0
@@ -337,7 +337,7 @@ export default {
   padding: 0 !important
 }
 
-@media screen and (min-width: 1400px) {
+@media screen and (min-width: 1230px) {
   .nav {
     text-align: right;
   }
@@ -358,7 +358,7 @@ export default {
 
   .menu .menu-item {
     height: 100%;
-    padding: 24px 40px;
+    padding: 24px 20px;
     display: inline-block;
   }
 
@@ -377,6 +377,12 @@ export default {
   }
 }
 
+@media screen and (min-width: 1400px) {
+  .menu .menu-item {
+    padding: 24px 40px;
+  }
+}
+
 @media screen and (min-width: 1660px) {
   .nav {
     padding: 0 150px;