Jelajahi Sumber

仓库初始化

Funny 3 tahun lalu
melakukan
439563256c
47 mengubah file dengan 3213 tambahan dan 0 penghapusan
  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. TEMPAT SAMPAH
      public/favicon.ico
  9. TEMPAT SAMPAH
      public/favicon1.ico
  10. 14 0
      src/App.vue
  11. TEMPAT SAMPAH
      src/assets/images/1-1.png
  12. TEMPAT SAMPAH
      src/assets/images/1.png
  13. TEMPAT SAMPAH
      src/assets/images/2-1.png
  14. TEMPAT SAMPAH
      src/assets/images/2.png
  15. TEMPAT SAMPAH
      src/assets/images/3-1.png
  16. TEMPAT SAMPAH
      src/assets/images/3-2.png
  17. TEMPAT SAMPAH
      src/assets/images/4-1.png
  18. TEMPAT SAMPAH
      src/assets/images/4-2.png
  19. TEMPAT SAMPAH
      src/assets/images/4-3.png
  20. TEMPAT SAMPAH
      src/assets/images/4-4.png
  21. TEMPAT SAMPAH
      src/assets/images/5.png
  22. TEMPAT SAMPAH
      src/assets/images/6.png
  23. TEMPAT SAMPAH
      src/assets/images/7-1.png
  24. TEMPAT SAMPAH
      src/assets/images/7-10.png
  25. TEMPAT SAMPAH
      src/assets/images/7-11.png
  26. TEMPAT SAMPAH
      src/assets/images/7-12.png
  27. TEMPAT SAMPAH
      src/assets/images/7-13.png
  28. TEMPAT SAMPAH
      src/assets/images/7-14.png
  29. TEMPAT SAMPAH
      src/assets/images/7-15.png
  30. TEMPAT SAMPAH
      src/assets/images/7-2.png
  31. TEMPAT SAMPAH
      src/assets/images/7-3.png
  32. TEMPAT SAMPAH
      src/assets/images/7-4.png
  33. TEMPAT SAMPAH
      src/assets/images/7-5.png
  34. TEMPAT SAMPAH
      src/assets/images/7-6.png
  35. TEMPAT SAMPAH
      src/assets/images/7-7.png
  36. TEMPAT SAMPAH
      src/assets/images/7-8.png
  37. TEMPAT SAMPAH
      src/assets/images/7-9.png
  38. TEMPAT SAMPAH
      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": {}
+}

File diff ditekan karena terlalu besar
+ 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"
+  }
+}

TEMPAT SAMPAH
public/favicon.ico


TEMPAT SAMPAH
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>

TEMPAT SAMPAH
src/assets/images/1-1.png


TEMPAT SAMPAH
src/assets/images/1.png


TEMPAT SAMPAH
src/assets/images/2-1.png


TEMPAT SAMPAH
src/assets/images/2.png


TEMPAT SAMPAH
src/assets/images/3-1.png


TEMPAT SAMPAH
src/assets/images/3-2.png


TEMPAT SAMPAH
src/assets/images/4-1.png


TEMPAT SAMPAH
src/assets/images/4-2.png


TEMPAT SAMPAH
src/assets/images/4-3.png


TEMPAT SAMPAH
src/assets/images/4-4.png


TEMPAT SAMPAH
src/assets/images/5.png


TEMPAT SAMPAH
src/assets/images/6.png


TEMPAT SAMPAH
src/assets/images/7-1.png


TEMPAT SAMPAH
src/assets/images/7-10.png


TEMPAT SAMPAH
src/assets/images/7-11.png


TEMPAT SAMPAH
src/assets/images/7-12.png


TEMPAT SAMPAH
src/assets/images/7-13.png


TEMPAT SAMPAH
src/assets/images/7-14.png


TEMPAT SAMPAH
src/assets/images/7-15.png


TEMPAT SAMPAH
src/assets/images/7-2.png


TEMPAT SAMPAH
src/assets/images/7-3.png


TEMPAT SAMPAH
src/assets/images/7-4.png


TEMPAT SAMPAH
src/assets/images/7-5.png


TEMPAT SAMPAH
src/assets/images/7-6.png


TEMPAT SAMPAH
src/assets/images/7-7.png


TEMPAT SAMPAH
src/assets/images/7-8.png


TEMPAT SAMPAH
src/assets/images/7-9.png


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