瀏覽代碼

仓库初始化

Funny 3 年之前
當前提交
439563256c
共有 47 個文件被更改,包括 3213 次插入0 次删除
  1. 24 0
      .gitignore
  2. 3 0
      .vscode/extensions.json
  3. 16 0
      README.md
  4. 13 0
      index.html
  5. 8 0
      liebao-website.code-workspace
  6. 2633 0
      package-lock.json
  7. 25 0
      package.json
  8. 二進制
      public/favicon.ico
  9. 二進制
      public/favicon1.ico
  10. 14 0
      src/App.vue
  11. 二進制
      src/assets/images/1-1.png
  12. 二進制
      src/assets/images/1.png
  13. 二進制
      src/assets/images/2-1.png
  14. 二進制
      src/assets/images/2.png
  15. 二進制
      src/assets/images/3-1.png
  16. 二進制
      src/assets/images/3-2.png
  17. 二進制
      src/assets/images/4-1.png
  18. 二進制
      src/assets/images/4-2.png
  19. 二進制
      src/assets/images/4-3.png
  20. 二進制
      src/assets/images/4-4.png
  21. 二進制
      src/assets/images/5.png
  22. 二進制
      src/assets/images/6.png
  23. 二進制
      src/assets/images/7-1.png
  24. 二進制
      src/assets/images/7-10.png
  25. 二進制
      src/assets/images/7-11.png
  26. 二進制
      src/assets/images/7-12.png
  27. 二進制
      src/assets/images/7-13.png
  28. 二進制
      src/assets/images/7-14.png
  29. 二進制
      src/assets/images/7-15.png
  30. 二進制
      src/assets/images/7-2.png
  31. 二進制
      src/assets/images/7-3.png
  32. 二進制
      src/assets/images/7-4.png
  33. 二進制
      src/assets/images/7-5.png
  34. 二進制
      src/assets/images/7-6.png
  35. 二進制
      src/assets/images/7-7.png
  36. 二進制
      src/assets/images/7-8.png
  37. 二進制
      src/assets/images/7-9.png
  38. 二進制
      src/assets/logo.png
  39. 8 0
      src/env.d.ts
  40. 9 0
      src/main.ts
  41. 19 0
      src/router/index.ts
  42. 13 0
      src/store/index.ts
  43. 4 0
      src/util/pubUse.ts
  44. 380 0
      src/views/home/index.vue
  45. 22 0
      tsconfig.json
  46. 9 0
      tsconfig.node.json
  47. 13 0
      vite.config.ts

+ 24 - 0
.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

+ 3 - 0
.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["johnsoncodehk.volar"]
+}

+ 16 - 0
README.md

@@ -0,0 +1,16 @@
+# Vue 3 + TypeScript + Vite
+
+This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+
+## Recommended IDE Setup
+
+- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
+
+## Type Support For `.vue` Imports in TS
+
+Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases this is fine if you don't really care about component prop types outside of templates. However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can enable Volar's Take Over mode by following these steps:
+
+1. Run `Extensions: Show Built-in Extensions` from VS Code's command palette, look for `TypeScript and JavaScript Language Features`, then right click and select `Disable (Workspace)`. By default, Take Over mode will enable itself if the default TypeScript extension is disabled.
+2. Reload the VS Code window by running `Developer: Reload Window` from the command palette.
+
+You can learn more about Take Over mode [here](https://github.com/johnsoncodehk/volar/discussions/471).

+ 13 - 0
index.html

@@ -0,0 +1,13 @@
+<!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.ts"></script>
+  </body>
+</html>

+ 8 - 0
liebao-website.code-workspace

@@ -0,0 +1,8 @@
+{
+	"folders": [
+		{
+			"path": "."
+		}
+	],
+	"settings": {}
+}

文件差異過大導致無法顯示
+ 2633 - 0
package-lock.json


+ 25 - 0
package.json

@@ -0,0 +1,25 @@
+{
+  "name": "liebao-website",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "dev": "vite --host",
+    "build": "vue-tsc --noEmit && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "ant-design-vue": "^3.2.2",
+    "node-sass": "^7.0.1",
+    "sass": "^1.49.9",
+    "sass-loader": "^7.3.1",
+    "vue": "^3.2.25",
+    "vue-router": "^4.0.13",
+    "vuex": "^4.0.2"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^2.3.1",
+    "typescript": "^4.5.4",
+    "vite": "^2.9.5",
+    "vue-tsc": "^0.34.7"
+  }
+}

二進制
public/favicon.ico


二進制
public/favicon1.ico


+ 14 - 0
src/App.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+</script>
+
+<template>
+  <router-view></router-view>
+</template>
+
+<style>
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+</style>

二進制
src/assets/images/1-1.png


二進制
src/assets/images/1.png


二進制
src/assets/images/2-1.png


二進制
src/assets/images/2.png


二進制
src/assets/images/3-1.png


二進制
src/assets/images/3-2.png


二進制
src/assets/images/4-1.png


二進制
src/assets/images/4-2.png


二進制
src/assets/images/4-3.png


二進制
src/assets/images/4-4.png


二進制
src/assets/images/5.png


二進制
src/assets/images/6.png


二進制
src/assets/images/7-1.png


二進制
src/assets/images/7-10.png


二進制
src/assets/images/7-11.png


二進制
src/assets/images/7-12.png


二進制
src/assets/images/7-13.png


二進制
src/assets/images/7-14.png


二進制
src/assets/images/7-15.png


二進制
src/assets/images/7-2.png


二進制
src/assets/images/7-3.png


二進制
src/assets/images/7-4.png


二進制
src/assets/images/7-5.png


二進制
src/assets/images/7-6.png


二進制
src/assets/images/7-7.png


二進制
src/assets/images/7-8.png


二進制
src/assets/images/7-9.png


二進制
src/assets/logo.png


+ 8 - 0
src/env.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue'
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}

+ 9 - 0
src/main.ts

@@ -0,0 +1,9 @@
+import { createApp } from 'vue'
+import Antd from 'ant-design-vue';
+import App from './App.vue'
+import 'ant-design-vue/dist/antd.css';
+import router from './router'
+import store from './store'
+const app = createApp(App);
+
+app.use(Antd).use(router).use(store).mount('#app')

+ 19 - 0
src/router/index.ts

@@ -0,0 +1,19 @@
+import { createRouter, createWebHistory } from "vue-router";
+import home from '@/views/home/index.vue'
+// 路由信息
+const routes = [
+  {
+    path: "/",
+    name: "home",
+    component: home,
+  }
+];
+
+// 导出路由
+const router = createRouter({
+  history: createWebHistory(),
+  routes
+});
+
+export default router;
+

+ 13 - 0
src/store/index.ts

@@ -0,0 +1,13 @@
+import { createStore } from 'vuex'
+
+// 获取modules文件夹下所有ts文件
+const files: any = import.meta.globEager("./modules/*.ts")
+let modules: any = {}
+Object.keys(files).forEach((key) => {
+  // 将获取到结果按照 key:value 的形式存放到modules对象中
+  modules[key.replace(/(\.\/|\modules\/|\.ts)/g, '')] = files[key].default
+})
+console.log('模块',modules)
+export default createStore({
+  modules
+})

+ 4 - 0
src/util/pubUse.ts

@@ -0,0 +1,4 @@
+// 获取assets静态资源
+export default function getAssetsFile(url: string) {
+  return new URL(`../assets/images/${url}`, import.meta.url).href
+}

+ 380 - 0
src/views/home/index.vue

@@ -0,0 +1,380 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import getAssetsFile from '@/util/pubUse'
+let isTop = ref(true)
+let activeIndex = ref(0)
+let menuList = ref(['首页', '优巨引擎官网', '文档中心', '管理中心'])
+let steps = ref([
+  {
+    name: '步骤一',
+    tip: '注册平台账号'
+  },
+  {
+    name: '步骤二',
+    tip: '填写资料'
+  },
+  {
+    name: '步骤三',
+    tip: '商务签合'
+  },
+  {
+    name: '步骤四',
+    tip: '接入'
+  },
+])
+let partners = ref([])
+onMounted(() => {
+  window.addEventListener('scroll', handleScrollY, true)
+})
+const container = ref()
+function handleScrollY() {
+  isTop.value = !container.value.getBoundingClientRect().top
+}
+</script>
+
+<template>
+  <div :class="isTop ? 'header' : 'header header-color'">
+    <div class="head-content">
+      <div class="left">
+        <img v-if="isTop" class="img" src="@/assets/images/1.png" alt="">
+        <img v-else class="img" src="@/assets/images/1-1.png" alt="">
+        <div class="name">优巨引擎·开放平台</div>
+      </div>
+      <div class="right">
+        <div @click="activeIndex = i" class="btn" v-for="(v, i) in menuList" :key="i"
+          :class="activeIndex === i && !isTop ? 'active-btn' : ''">
+          {{ v }}</div>
+        <div class="login">登录</div>
+      </div>
+    </div>
+  </div>
+  <div class="container" ref="container">
+    <div class="content">
+      <div class="top-con">
+        <div class="con">与伙伴一起共同成长</div>
+        <div class="con1">优巨引擎开放平台</div>
+        <div class="con2">猎豹AI提供丰富的开放能力和成熟的合作机制,助力合作伙伴在猎豹AI平台上构建本地数字化AI配送平台,焦距全网生态链。</div>
+      </div>
+      <!-- 接入流程 -->
+      <div class="access-process">
+        <div class="title">
+          <div class="title-en">ACCESS PROCESS</div>
+          <div class="title-ch">接入流程</div>
+          <div class="line"></div>
+        </div>
+        <div class="steps">
+          <div class="step" :class="i % 2 === 0 ? 'step1' : ''"
+            :style="`background: url(${getAssetsFile(`4-${i + 1}.png`)}) no-repeat`" v-for="(v, i) in steps" :key="i">
+            <div class="name">{{ v.name }}</div>
+            <div class="tip">{{ v.tip }}</div>
+          </div>
+        </div>
+        <div class="register">立即注册</div>
+        <img class="box" src="@/assets/images/5.png" alt="" srcset="">
+      </div>
+      <!-- 合作伙伴 -->
+      <div class="cooperative-partner">
+        <div class="title">
+          <div class="title-en">COOPERATIVE PARTNER</div>
+          <div class="title-ch">合作伙伴</div>
+          <div class="line"></div>
+        </div>
+        <div class="partners">
+          <img class="partner" :src="getAssetsFile(`7-${i + 1}.png`)" alt="" v-for="(v, i) in 16" :key="i">
+        </div>
+      </div>
+    </div>
+    <div class="footer">
+      <div class="name">优巨引擎</div>
+      <div class="agreement">
+        <div>开发者服务协议</div>
+        <div>&ensp;|&ensp;</div>
+        <div>用户服务协议</div>
+        <div>&ensp;|&ensp;</div>
+        <div>联系我们</div>
+      </div>
+      <div class="record-number">
+        备案号:苏ICP备2021010118号
+      </div>
+    </div>
+  </div>
+
+</template>
+
+<style lang="scss" scoped >
+.header {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 60px;
+  color: #FFFFFF;
+  z-index: 99;
+
+  .head-content {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    min-width: 600px;
+
+
+
+    .left {
+      display: flex;
+      align-items: center;
+
+      .img {
+        width: 30px;
+        height: 30px;
+        cursor: pointer;
+      }
+
+      .name {
+        font-size: 16px;
+        font-weight: bold;
+        cursor: pointer;
+        margin-left: 20px;
+      }
+    }
+
+    .right {
+      display: flex;
+      align-items: center;
+
+      .btn {
+        font-size: 15px;
+        margin-right: 20px;
+        cursor: pointer;
+      }
+
+      .active-btn {
+        color: #0077EE;
+        font-weight: bold;
+      }
+
+      .login {
+        width: 80px;
+        height: 32px;
+        line-height: 32px;
+        text-align: center;
+        background: linear-gradient(253deg, #84D3FF 0%, #2A4FAC 35%, #0F1E6C 100%);
+        border-radius: 16px 16px 16px 16px;
+        font-size: 14px;
+        color: #FFFFFF;
+        cursor: pointer;
+      }
+    }
+
+  }
+
+  @media (min-width: 544px) {
+    .head-content {
+      max-width: 576px;
+    }
+  }
+
+  @media (min-width: 768px) {
+    .head-content {
+      max-width: 720px;
+    }
+  }
+
+  @media (min-width: 992px) {
+    .head-content {
+      max-width: 940px;
+    }
+  }
+
+  @media (min-width: 1900px) {
+    .head-content {
+      max-width: 1500px;
+    }
+  }
+
+}
+
+.header-color {
+  background-color: #ffffff;
+  color: #222222;
+}
+
+.container {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  background: #020d4a;
+  min-height: 100vh;
+
+  .content {
+
+    .top-con {
+      background: url(@/assets/images/2-1.png) no-repeat;
+      background-position-x: center;
+      height: 900px;
+      padding: 110px 0 0 220px;
+      color: #ffffff;
+
+      .con {
+        font-size: 30px;
+        font-weight: bold;
+      }
+
+      .con1 {
+        font-size: 60px;
+        font-weight: bold;
+      }
+
+      .con2 {
+        width: 600px;
+        font-size: 16px;
+        font-weight: 500;
+        line-height: 23px;
+      }
+    }
+
+    .access-process,
+    .cooperative-partner {
+      position: relative;
+      width: 100%;
+      margin-top: -150px;
+
+      .box {
+        position: absolute;
+        top: 0;
+        right: 127px;
+      }
+
+      .title {
+        position: relative;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+
+        .title-en {
+          position: absolute;
+          left: 50%;
+          transform: translateX(-50%);
+          font-size: 50px;
+          font-weight: 500;
+          color: rgba(255, 255, 255, 0.2);
+          line-height: 59px;
+        }
+
+        .title-ch {
+          margin: 26px 0 10px;
+          font-size: 34px;
+          font-weight: bold;
+          color: #FFFFFF;
+          line-height: 40px;
+        }
+
+        .line {
+          width: 80px;
+          height: 8px;
+          background: #2A4FAC;
+          border-radius: 0px 0px 0px 0px;
+        }
+      }
+
+      .steps {
+        display: flex;
+        justify-content: space-evenly;
+        color: #ffffff;
+        margin-top: 25px;
+        padding: 0 100px;
+
+        .step {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: flex-end;
+          width: 200px;
+          height: 200px;
+          background-size: 200px !important;
+          cursor: pointer;
+
+          .name {
+            font-size: 18px;
+            font-weight: bold;
+            line-height: 23px;
+          }
+
+          .tip {
+            font-size: 14px;
+            font-weight: 400;
+            color: rgba(255, 255, 255, 0.6);
+            line-height: 19px;
+            margin-bottom: 30px;
+          }
+        }
+
+        .step1 {
+          margin-top: 120px;
+        }
+
+      }
+
+      .partners {
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: center;
+        padding: 0 100px 100px;
+
+        .partner {
+          // background-size: 100% 100%;
+          width: 380px;
+          height: 90px;
+          margin-top: 60px;
+        }
+      }
+
+      .register {
+        width: 200px;
+        height: 60px;
+        background: linear-gradient(253deg, #84D3FF 0%, #2A4FAC 35%, #0F1E6C 100%);
+        border-radius: 10px 10px 10px 10px;
+        font-size: 18px;
+        font-weight: 500;
+        color: #FFFFFF;
+        line-height: 60px;
+        text-align: center;
+        margin: 40px auto 0;
+        cursor: pointer;
+      }
+    }
+
+    .cooperative-partner {
+      margin-top: 73px;
+    }
+  }
+
+  .footer {
+    height: 110px;
+    padding: 10px 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: space-evenly;
+    background: #252525;
+    color: #FFFFFF;
+
+    .name {
+      font-size: 18px;
+      font-weight: bold;
+      cursor: pointer;
+    }
+
+    .agreement,
+    .record-number {
+      display: flex;
+      font-size: 12px;
+      font-weight: 400;
+      cursor: pointer;
+    }
+
+  }
+}
+</style>

+ 22 - 0
tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "useDefineForClassFields": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "strict": true,
+    "jsx": "preserve",
+    "sourceMap": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "lib": ["esnext", "dom"],
+    "skipLibCheck": true,
+    "baseUrl": "./",
+    "paths": {
+      "@/*": ["src/*"]
+    }
+  },
+  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

+ 9 - 0
tsconfig.node.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}

+ 13 - 0
vite.config.ts

@@ -0,0 +1,13 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import path from "path"
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [
+    vue()],
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "src")
+    }
+  }
+})