Ver código fonte

仓库初始化

Funny 3 anos atrás
commit
439563256c

+ 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": {}
+}

Diferenças do arquivo suprimidas por serem muito extensas
+ 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"
+  }
+}

BIN
public/favicon.ico


BIN
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>

BIN
src/assets/images/1-1.png


BIN
src/assets/images/1.png


BIN
src/assets/images/2-1.png


BIN
src/assets/images/2.png


BIN
src/assets/images/3-1.png


BIN
src/assets/images/3-2.png


BIN
src/assets/images/4-1.png


BIN
src/assets/images/4-2.png


BIN
src/assets/images/4-3.png


BIN
src/assets/images/4-4.png


BIN
src/assets/images/5.png


BIN
src/assets/images/6.png


BIN
src/assets/images/7-1.png


BIN
src/assets/images/7-10.png


BIN
src/assets/images/7-11.png


BIN
src/assets/images/7-12.png


BIN
src/assets/images/7-13.png


BIN
src/assets/images/7-14.png


BIN
src/assets/images/7-15.png


BIN
src/assets/images/7-2.png


BIN
src/assets/images/7-3.png


BIN
src/assets/images/7-4.png


BIN
src/assets/images/7-5.png


BIN
src/assets/images/7-6.png


BIN
src/assets/images/7-7.png


BIN
src/assets/images/7-8.png


BIN
src/assets/images/7-9.png


BIN
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")
+    }
+  }
+})