canrd-main / canrud-nuxt-front · Files

Blame view

pages/index.vue 6.75 KB
Edit Raw Normal View History
feat: 海外官网服务端渲染重构
aa1ded8a
 
sanmu authored 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
 
<template>
  <v-rows class="tw-w-full">
    <v-carousel hide-delimiter-background show-arrows="hover" height="auto" v-if="!isMobile()">
      <v-carousel-item v-for="banner in banners" :src="banner" cover alt="canrud" :key="banner">
      </v-carousel-item>
    </v-carousel>
    <v-carousel hide-delimiter-background show-arrows="hover" height="auto" v-if="isMobile()">
      <v-carousel-item v-for="banner in mobileBanners" :src="banner" cover alt="canrud" :key="banner">
      </v-carousel-item>
    </v-carousel>
  </v-rows>
  <!-- 能源材料 -->
  <div class="tw-py-8 py-sm-16">
    <v-container>
      <MainTitleListOdd title="Material Reagents" :list="materials"
        desc="Leading global provider of energy storage research materials and providing other professional/universal experimental materials. " />
    </v-container>
  </div>

  <!-- 设备 -->
  <div class="bg-grey-lighten-5 tw-py-8 py-sm-16">
    <v-container>
      <MainTitleList title="Lab Device" listType="equipment"
        :list="lab.list.map((item) => ({ ...item, href: '/products' }))"
        desc="Self-built High-precision Machining Center with Powerful Design and Manufacturing Capabilities. "
        href="/equipment" />
    </v-container>
  </div>

  <!-- Customized Battery -->
  <div class="tw-py-8 py-sm-16">
    <v-container>
      <MainTitleList :title="('Customized Battery')" :list="batteries" href="/customize"
        desc="200mAh~10Ah, Winding/Stacking, Unfilled/Filled Electrolyte Cells, Three-Electrode, and More. " />
    </v-container>
  </div>
  <!-- Testing -->
  <div class="bg-grey-lighten-5 tw-py-8 py-sm-16">
    <v-container>
      <MainTitleList title="Testing" :list="tests" href="/test"
        desc="Self built testing center and signed strategic cooperation with ATL, Tsinghua and other units. " />
    </v-container>
  </div>
  <!-- Pack -->
  <div class="pt-8 pb-8 pt pt-sm-16 pb-sm-32">
    <v-container>
      <MainTitleList title="Pack" href="/pack" :list="packs"
        desc="Focusing on energy materials/new energy storage systems/modules and other fields, mastering advanced technologies to provide high-quality services. " />
    </v-container>
  </div>
</template>

<script setup lang="ts">
import MainTitleList from '../components/MainTitleList.vue'
import MainTitleListOdd from '../components/MainTitleListOdd.vue'
import { useCategoryStore } from '../stores/category'
import { computed } from 'vue'
import { isMobile } from '../utils'
feat: 更新标题&图片alt&keyword&h4
29276e29
 
sanmu authored 
59
60
 
onMounted(() => {
  console.log('%c [ onMounted ]-10', 'font-size:13px; background:pink; color:#bf2c9f;', 111)
feat: 海外官网服务端渲染重构
aa1ded8a
 
sanmu authored 
61
62
63
64
65
66
67
 
})
useHead({
  title: 'canrud',
  meta: [
    {
      name: 'title',
      content: "科路得,助您科研之路势在必得。Canrd aims to be the world's leading one-stop service provider in new energy research. With a dedication to excellence, we offer Material Reagents, Lab Devices, Customized Batteries, Testing, and Advanced Packaging for energy materials and storage systems. We master advanced technologies to provide high-quality solutions. Our team's quick responses ensure tailored and professional services to meet your unique needs. Contact us at contact@canrd.com or call +86 19867737979 to explore our innovative offerings. Together, let's shape a greener, brighter world!"
feat: 更新标题&图片alt&keyword&h4
29276e29
 
sanmu authored 
68
 
    }, {
feat: 海外官网服务端渲染重构
aa1ded8a
 
sanmu authored 
69
70
 
      name: 'keywords',
      content:
feat: 更新标题&图片alt&keyword&h4
29276e29
 
sanmu authored 
71
72
73
 
        '科路得,canrd,canrud,Energy Storage Research,Lithium Batteries Research,Material Reagents,Lab Device,Customized Battery,Testing,Pack',
    }, {
      name: "description",
feat: 海外官网服务端渲染重构
aa1ded8a
 
sanmu authored 
74
 
      content:
feat: 更新标题&图片alt&keyword&h4
29276e29
 
sanmu authored 
75
76
77
78
79
 
        "科路得,助您科研之路势在必得。Canrd aims to be the world's leading one-stop service provider in new energy research. With a dedication to excellence, we offer Material Reagents, Lab Devices, Customized Batteries, Testing, and Advanced Packaging for energy materials and storage systems. We master advanced technologies to provide high-quality solutions. Our team's quick responses ensure tailored and professional services to meet your unique needs. Contact us at contact@canrd.com or call +86 19867737979 to explore our innovative offerings. Together, let's shape a greener, brighter world!"
    }],
  link: [
    { rel: 'preload', href: '/banner/banner1.jpg', as: 'image' }
  ]
feat: 海外官网服务端渲染重构
aa1ded8a
 
sanmu authored 
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
 
})

// useAsyncData(async ({ app }) => {
//   console.log('%c [ app ]-70', 'font-size:13px; background:pink; color:#bf2c9f;', app)
//   app.head.title = 'canrud'
//   app.head.meta = [
//     {
//       name: 'description',
//       content: "科路得,助您科研之路势在必得。Canrd aims to be the world's leading one-stop service provider in new energy research. With a dedication to excellence, we offer Material Reagents, Lab Devices, Customized Batteries, Testing, and Advanced Packaging for energy materials and storage systems. We master advanced technologies to provide high-quality solutions. Our team's quick responses ensure tailored and professional services to meet your unique needs. Contact us at    
//     }]
// })
console.log(11)

const store = useCategoryStore()

const lab = computed(
  () =>
    store?.list?.[3] || {
      categoryDisplayName: '',
      list: []
    }
)

const banners = [
  '/banner/banner1.jpg',
  '/banner/banner2.jpg',
  '/banner/banner3.jpg',
feat: 更新标题&图片alt&keyword&h4
29276e29
 
sanmu authored 
107
 
  '/banner/banner5.jpg'
feat: 海外官网服务端渲染重构
aa1ded8a
 
sanmu authored 
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
 
]

const mobileBanners = [
  '/mobile/banner-index1.png',
  '/mobile/banner-index2.png',
  '/mobile/banner-index3.png'
]

const materials = [
  { name: 'Energy materials', imageUrl: '/home/1.jpg', href: '/products' },
  {
    name: 'Laboratory consumables',
    imageUrl: '/home/2-Universal-consumables.png',
    href: '/products'
  },
  {
    name: 'Low-dimensional materials',
    imageUrl: '/home/3-Low-dimensional-materials.png',
    href: '/products'
  }
]

const tests = [
  {
    name: 'Electrochemical performance',
    imageUrl: '/home/8_Electrochemical_performance.svg',
    href: '/test'
  },
  { name: 'Reliability testing', imageUrl: '/home/9 Reliability testing.svg', href: '/test' },
  { name: 'Material testing', imageUrl: '/home/10 Material testing.svg', href: '/test' },
  { name: 'Calibration', imageUrl: '/home/11 Calibration.svg', href: '/test' }
]
const batteries = [
  { name: 'Material evaluation', imageUrl: '/home/4-Material-evaluation.png', href: '/customize' },
  { name: 'R&D foundry', imageUrl: '/home/5-R&D-foundry.png', href: '/customize' },
  { name: 'Chemical system', imageUrl: '/home/6-Chemical-system.png', href: '/customize' },
  {
    name: 'Semi product customization',
    imageUrl: '/home/7-Semi-product-customization.png',
    href: '/customize'
  }
]
const packs = [
  { name: 'Power bank', imageUrl: '/home/12-power-bank.png', href: '/pack' },
  { name: 'Energy storage', imageUrl: '/home/13-Energy-storage.png', href: '/pack' },
  { name: 'power tool', imageUrl: '/home/3-powertool.png', href: '/pack' },
  {
    name: 'portable energy storage',
    imageUrl: '/home/4-portableenergystorage.png',
    href: '/pack'
  }
]
</script>