2 years ago · 94e914271b
--- a/.gitignore
+++ b/.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?
			
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -0,0 +1,3 @@
 
				+{
			
 
				+  "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
			
 
				+}
			
--- a/README.md
+++ b/README.md
@@ -0,0 +1,18 @@
 
				+# 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=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
			
 
				+
			
 
				+## Type Support For `.vue` Imports in TS
			
 
				+
			
 
				+TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
			
 
				+
			
 
				+If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
			
 
				+
			
 
				+1. Disable the built-in TypeScript Extension
			
 
				+   1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
			
 
				+   2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
			
 
				+2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
			
--- a/index.html
+++ b/index.html
@@ -0,0 +1,13 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+  <head>
			
 
				+    <meta charset="UTF-8" />
			
 
				+    <link rel="icon" type="image/svg+xml" href="/image/school-s.png" />
			
 
				+    <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>
			
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -0,0 +1,26 @@
 
				+{
			
 
				+  "name": "smart-school-map",
			
 
				+  "private": true,
			
 
				+  "version": "0.0.0",
			
 
				+  "type": "module",
			
 
				+  "scripts": {
			
 
				+    "dev": "vite",
			
 
				+    "build": "vue-tsc && vite build",
			
 
				+    "preview": "vite preview"
			
 
				+  },
			
 
				+  "dependencies": {
			
 
				+    "ant-design-vue": "^4.0.7",
			
 
				+    "lucide-vue-next": "^0.294.0",
			
 
				+    "vue": "^3.3.8",
			
 
				+    "vue-router": "^4.2.5"
			
 
				+  },
			
 
				+  "devDependencies": {
			
 
				+    "@vitejs/plugin-vue": "^4.5.0",
			
 
				+    "autoprefixer": "^10.4.16",
			
 
				+    "postcss": "^8.4.32",
			
 
				+    "tailwindcss": "^3.3.6",
			
 
				+    "typescript": "^5.2.2",
			
 
				+    "vite": "^5.0.0",
			
 
				+    "vue-tsc": "^1.8.22"
			
 
				+  }
			
 
				+}
			
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -0,0 +1,6 @@
 
				+export default {
			
 
				+  plugins: {
			
 
				+    tailwindcss: {},
			
 
				+    autoprefixer: {},
			
 
				+  },
			
 
				+}
			
--- a/public/image/b1.png
+++ b/public/image/b1.png
--- a/public/image/b2.png
+++ b/public/image/b2.png
--- a/public/image/bg.png
+++ b/public/image/bg.png
--- a/public/image/school-l.png
+++ b/public/image/school-l.png
--- a/public/image/school-m.png
+++ b/public/image/school-m.png
--- a/public/image/school-s.png
+++ b/public/image/school-s.png
--- a/public/vite.svg
+++ b/public/vite.svg
--- a/src/App.vue
+++ b/src/App.vue
@@ -0,0 +1,7 @@
 
				+<script setup lang="ts"></script>
			
 
				+
			
 
				+<template>
			
 
				+  <RouterView></RouterView>
			
 
				+</template>
			
 
				+
			
 
				+<style scoped></style>
			
--- a/src/assets/vue.svg
+++ b/src/assets/vue.svg
@@ -0,0 +1 @@
 
				+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
			
--- a/src/components/BackButton.vue
+++ b/src/components/BackButton.vue
@@ -0,0 +1,29 @@
 
				+<script setup lang="ts">
			
 
				+import { ChevronLeft } from "lucide-vue-next";
			
 
				+</script>
			
 
				+<template>
			
 
				+  <div class="cursor-pointer">
			
 
				+    <div
			
 
				+      class="btn w-24 md:w-48 h-16 flex justify-between items-center bg-[#03B3FF] bg-opacity-10 px-3 rounded-lg"
			
 
				+    >
			
 
				+      <div>
			
 
				+        <ChevronLeft :size="40" />
			
 
				+      </div>
			
 
				+      <div class="text">返回</div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<style scoped>
			
 
				+.btn {
			
 
				+  border: 0.58px solid #038dff;
			
 
				+}
			
 
				+.text {
			
 
				+  font-size: 24px;
			
 
				+  font-weight: 400;
			
 
				+  letter-spacing: 0px;
			
 
				+  line-height: 42.34px;
			
 
				+  text-align: center;
			
 
				+  vertical-align: top;
			
 
				+}
			
 
				+</style>
			
--- a/src/components/SearchCard.vue
+++ b/src/components/SearchCard.vue
@@ -0,0 +1,15 @@
 
				+<script setup lang="ts">
			
 
				+import { Avatar } from "ant-design-vue";
			
 
				+</script>
			
 
				+<template>
			
 
				+  <div
			
 
				+    class="flex w-[607px] h-[94px] bg-white rounded-md mx-auto items-center px-3 gap-4 font-normal text-2xl select-none cursor-pointer"
			
 
				+  >
			
 
				+    <Avatar class="w-12 h-12">
			
 
				+      <img src="/vite.svg" class="w-12 h-12" />
			
 
				+    </Avatar>
			
 
				+    <div>张三</div>
			
 
				+    <div>2020202121</div>
			
 
				+    <div class="ml-36">七年级12班</div>
			
 
				+  </div>
			
 
				+</template>
			
--- a/src/main.ts
+++ b/src/main.ts
@@ -0,0 +1,9 @@
 
				+import { createApp } from "vue";
			
 
				+import "./style.css";
			
 
				+import App from "./App.vue";
			
 
				+import router from "./router";
			
 
				+
			
 
				+const app = createApp(App);
			
 
				+
			
 
				+app.use(router);
			
 
				+app.mount("#app");
			
--- a/src/pages/find/index.vue
+++ b/src/pages/find/index.vue
@@ -0,0 +1,51 @@
 
				+<script setup lang="ts">
			
 
				+import { Input } from "ant-design-vue";
			
 
				+import SearchCard from "@/components/SearchCard.vue";
			
 
				+import BackButton from "@/components/BackButton.vue";
			
 
				+import { ref } from "vue";
			
 
				+import { useRouter } from "vue-router";
			
 
				+const router = useRouter();
			
 
				+const inputValue = ref("");
			
 
				+</script>
			
 
				+<template>
			
 
				+  <div
			
 
				+    class="h-screen w-full bg-[url('/image/bg.png')] bg-cover flex text-white flex-col relative"
			
 
				+  >
			
 
				+    <!-- 返回按钮 -->
			
 
				+    <BackButton
			
 
				+      class="absolute top-3 md:top-[70px] left-9"
			
 
				+      @click="router.push('/')"
			
 
				+    />
			
 
				+
			
 
				+    <div class="w-[691px] mx-auto">
			
 
				+      <!-- 搜索框 -->
			
 
				+      <div
			
 
				+        class="h-[72px] backdrop-blur-sm mx-auto bg-gray-800 mt-[83px] bg-opacity-20 flex justify-between items-center rounded-xl overflow-hidden"
			
 
				+      >
			
 
				+        <div>
			
 
				+          <Input
			
 
				+            class="bg-transparent text-white text-lg px-4 placeholder:text-gray-100"
			
 
				+            :bordered="false"
			
 
				+            placeholder="请输入学生姓名"
			
 
				+            v-model:value="inputValue"
			
 
				+          />
			
 
				+        </div>
			
 
				+        <div
			
 
				+          class="h-full select-none w-[134px] bg-blue-400 flex justify-center items-center font-medium text-xl cursor-pointer"
			
 
				+        >
			
 
				+          搜索
			
 
				+        </div>
			
 
				+      </div>
			
 
				+
			
 
				+      <!-- 结果框 -->
			
 
				+      <div
			
 
				+        v-show="inputValue.length > 0"
			
 
				+        class="bg-[#c7dfeb] bg-opacity-70 backdrop-blur-sm rounded-xl mt-2 text-black flex flex-col py-8 gap-2 max-h-[400px] overflow-auto"
			
 
				+      >
			
 
				+        <SearchCard v-for="i in 3" :key="i" class="flex-none" />
			
 
				+      </div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
 
				+
			
 
				+<style scoped></style>
			
--- a/src/pages/home/inde.vue
+++ b/src/pages/home/inde.vue
@@ -0,0 +1,53 @@
 
				+<script setup lang="ts">
			
 
				+import BackButton from "@/components/BackButton.vue";
			
 
				+import { onMounted, ref } from "vue";
			
 
				+const current = ref("");
			
 
				+const getCurrentTime = () => {
			
 
				+  const currentDate = new Date();
			
 
				+  const year = currentDate.getFullYear();
			
 
				+  const month = currentDate.getMonth() + 1;
			
 
				+  const day = currentDate.getDate();
			
 
				+  const hours = currentDate.getHours();
			
 
				+  const minutes = currentDate.getMinutes();
			
 
				+  const s = currentDate.getSeconds();
			
 
				+  const res = `${year}.${month}.${day} ${hours}.${minutes}.${s}`;
			
 
				+  current.value = res;
			
 
				+};
			
 
				+
			
 
				+onMounted(() => {
			
 
				+  getCurrentTime();
			
 
				+  setInterval(getCurrentTime, 1000);
			
 
				+});
			
 
				+</script>
			
 
				+<template>
			
 
				+  <div class="relative w-full h-screen">
			
 
				+    <!-- <iframe
			
 
				+      class="w-full h-screen"
			
 
				+      :src="`https://www.720pai.net/tour/dfecea34bfc84088?Tid=`"
			
 
				+    ></iframe> -->
			
 
				+
			
 
				+    <div
			
 
				+      class="absolute top-0 left-0 flex justify-between flex-col h-screen w-full"
			
 
				+    >
			
 
				+      <!-- 上 -->
			
 
				+      <div class="p-10 flex justify-between">
			
 
				+        <BackButton />
			
 
				+        <div class="flex items-center">
			
 
				+          <img src="/image/school-l.png" :width="58" :height="58" />
			
 
				+          <div class="text-2xl ml-4">万载三中</div>
			
 
				+          <div class="font-medium ml-20 text-xl">{{ current }}</div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+      <!-- 中 -->
			
 
				+      <div class="flex justify-end px-10">
			
 
				+        <div>
			
 
				+          <div>1</div>
			
 
				+          <div>2</div>
			
 
				+          <div>3</div>
			
 
				+        </div>
			
 
				+      </div>
			
 
				+      <!-- 下  -->
			
 
				+      <div></div>
			
 
				+    </div>
			
 
				+  </div>
			
 
				+</template>
			
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -0,0 +1,21 @@
 
				+import { createWebHashHistory, RouteRecordRaw, createRouter } from "vue-router";
			
 
				+
			
 
				+const routes: RouteRecordRaw[] = [
			
 
				+  {
			
 
				+    name: "home",
			
 
				+    path: "/",
			
 
				+    component: () => import("@/pages/home/inde.vue"),
			
 
				+  },
			
 
				+  {
			
 
				+    name: "find",
			
 
				+    path: "/find",
			
 
				+    component: () => import("@/pages/find/index.vue"),
			
 
				+  },
			
 
				+];
			
 
				+
			
 
				+const router = createRouter({
			
 
				+  history: createWebHashHistory(),
			
 
				+  routes,
			
 
				+});
			
 
				+
			
 
				+export default router;
			
--- a/src/style.css
+++ b/src/style.css
@@ -0,0 +1,13 @@
 
				+@tailwind base;
			
 
				+@tailwind components;
			
 
				+@tailwind utilities;
			
 
				+html,
			
 
				+body {
			
 
				+  padding: 0;
			
 
				+  margin: 0;
			
 
				+  width: 100vw;
			
 
				+  height: 100vh;
			
 
				+  overflow: hidden;
			
 
				+  /* background-image: url("/public/image/bg.png");
			
 
				+  background-size: cover; */
			
 
				+}
			
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -0,0 +1 @@
 
				+/// <reference types="vite/client" />
			
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -0,0 +1,11 @@
 
				+/** @type {import('tailwindcss').Config} */
			
 
				+export default {
			
 
				+  content: ["./index.html", "./src/**/*.{vue,js,ts,jsx,tsx}"],
			
 
				+  theme: {
			
 
				+    extend: {},
			
 
				+  },
			
 
				+  plugins: [],
			
 
				+  corePlugins: {
			
 
				+    preflight: false,
			
 
				+  },
			
 
				+};
			
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,29 @@
 
				+{
			
 
				+  "compilerOptions": {
			
 
				+    "target": "ES2020",
			
 
				+    "useDefineForClassFields": true,
			
 
				+    "module": "ESNext",
			
 
				+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
			
 
				+    "skipLibCheck": true,
			
 
				+
			
 
				+    /* Bundler mode */
			
 
				+    "moduleResolution": "bundler",
			
 
				+    "allowImportingTsExtensions": true,
			
 
				+    "resolveJsonModule": true,
			
 
				+    "isolatedModules": true,
			
 
				+    "noEmit": true,
			
 
				+    "jsx": "preserve",
			
 
				+
			
 
				+    /* Linting */
			
 
				+    "strict": false,
			
 
				+    "noUnusedLocals": true,
			
 
				+    "noUnusedParameters": true,
			
 
				+    "noFallthroughCasesInSwitch": true,
			
 
				+    "baseUrl": ".",
			
 
				+    "paths": {
			
 
				+      "@/*": ["./src/*"]
			
 
				+    }
			
 
				+  },
			
 
				+  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"],
			
 
				+  "references": [{ "path": "./tsconfig.node.json" }]
			
 
				+}
			
--- a/tsconfig.node.json
+++ b/tsconfig.node.json
@@ -0,0 +1,10 @@
 
				+{
			
 
				+  "compilerOptions": {
			
 
				+    "composite": true,
			
 
				+    "skipLibCheck": true,
			
 
				+    "module": "ESNext",
			
 
				+    "moduleResolution": "bundler",
			
 
				+    "allowSyntheticDefaultImports": true
			
 
				+  },
			
 
				+  "include": ["vite.config.ts"]
			
 
				+}
			
--- a/vite.config.ts
+++ b/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"),
			
 
				+    },
			
 
				+  },
			
 
				+});