shaogen1995 před 3 roky
rodič
revize
d2dd770afd

+ 0 - 19
README.md

@@ -1,19 +0,0 @@
-# shou_bo
-
-## Project setup
-```
-npm install
-```
-
-### Compiles and hot-reloads for development
-```
-npm run serve
-```
-
-### Compiles and minifies for production
-```
-npm run build
-```
-
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).

+ 0 - 5
babel.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  presets: [
-    '@vue/cli-plugin-babel/preset'
-  ]
-}

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 25959
package-lock.json


+ 0 - 27
package.json

@@ -1,27 +0,0 @@
-{
-  "name": "shou_bo",
-  "version": "0.1.0",
-  "private": true,
-  "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build"
-  },
-  "dependencies": {
-    "core-js": "^3.6.5",
-    "vue": "^2.6.11",
-    "vue-router": "^3.2.0"
-  },
-  "devDependencies": {
-    "@vue/cli-plugin-babel": "~4.5.13",
-    "@vue/cli-plugin-router": "~4.5.13",
-    "@vue/cli-service": "~4.5.13",
-    "less": "^3.0.4",
-    "less-loader": "^5.0.0",
-    "vue-template-compiler": "^2.6.11"
-  },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions",
-    "not dead"
-  ]
-}

binární
public/favicon.ico


+ 0 - 17
public/index.html

@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html lang="">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title><%= htmlWebpackPlugin.options.title %></title>
-  </head>
-  <body>
-    <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
-</html>

+ 0 - 32
src/App.vue

@@ -1,32 +0,0 @@
-<template>
-  <div id="app">
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
-    </div>
-    <router-view/>
-  </div>
-</template>
-
-<style lang="less">
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
-
-#nav {
-  padding: 30px;
-
-  a {
-    font-weight: bold;
-    color: #2c3e50;
-
-    &.router-link-exact-active {
-      color: #42b983;
-    }
-  }
-}
-</style>

binární
src/assets/logo.png


+ 0 - 58
src/components/HelloWorld.vue

@@ -1,58 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'HelloWorld',
-  props: {
-    msg: String
-  }
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="less">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

+ 0 - 10
src/main.js

@@ -1,10 +0,0 @@
-import Vue from 'vue'
-import App from './App.vue'
-import router from './router'
-
-Vue.config.productionTip = false
-
-new Vue({
-  router,
-  render: h => h(App)
-}).$mount('#app')

+ 0 - 29
src/router/index.js

@@ -1,29 +0,0 @@
-import Vue from 'vue'
-import VueRouter from 'vue-router'
-import Home from '../views/Home.vue'
-
-Vue.use(VueRouter)
-
-const routes = [
-  {
-    path: '/',
-    name: 'Home',
-    component: Home
-  },
-  {
-    path: '/about',
-    name: 'About',
-    // route level code-splitting
-    // this generates a separate chunk (about.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
-    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
-  }
-]
-
-const router = new VueRouter({
-  mode: 'history',
-  base: process.env.BASE_URL,
-  routes
-})
-
-export default router

+ 0 - 5
src/views/About.vue

@@ -1,5 +0,0 @@
-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>

+ 0 - 18
src/views/Home.vue

@@ -1,18 +0,0 @@
-<template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png">
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
-  </div>
-</template>
-
-<script>
-// @ is an alias to /src
-import HelloWorld from '@/components/HelloWorld.vue'
-
-export default {
-  name: 'Home',
-  components: {
-    HelloWorld
-  }
-}
-</script>

+ 139 - 7
web/package-lock.json

@@ -9,6 +9,7 @@
       "version": "0.1.0",
       "dependencies": {
         "core-js": "^3.6.5",
+        "element-ui": "^2.15.6",
         "vue": "^2.6.11",
         "vue-router": "^3.2.0"
       },
@@ -3020,6 +3021,14 @@
       "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==",
       "dev": true
     },
+    "node_modules/async-validator": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmmirror.com/async-validator/-/async-validator-1.8.5.tgz",
+      "integrity": "sha512-tXBM+1m056MAX0E8TL2iCjg8WvSyXu0Zc8LNtYqrVeyoL3+esHRZ4SieE9fKQyyU09uONjnMEjrNBMqT0mbvmA==",
+      "dependencies": {
+        "babel-runtime": "6.x"
+      }
+    },
     "node_modules/asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmmirror.com/asynckit/-/asynckit-0.4.0.tgz",
@@ -3071,6 +3080,11 @@
       "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
       "dev": true
     },
+    "node_modules/babel-helper-vue-jsx-merge-props": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmmirror.com/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-2.0.3.tgz",
+      "integrity": "sha512-gsLiKK7Qrb7zYJNgiXKpXblxbV5ffSwR0f5whkPAaBAR4fhi6bwRZxX9wBlIc5M/v8CCkXUbXZL4N/nSE97cqg=="
+    },
     "node_modules/babel-loader": {
       "version": "8.2.4",
       "resolved": "https://registry.npmmirror.com/babel-loader/-/babel-loader-8.2.4.tgz",
@@ -3138,6 +3152,26 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
+      "dependencies": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      }
+    },
+    "node_modules/babel-runtime/node_modules/core-js": {
+      "version": "2.6.12",
+      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
+      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
+      "deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js."
+    },
+    "node_modules/babel-runtime/node_modules/regenerator-runtime": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -5121,7 +5155,6 @@
       "version": "1.5.2",
       "resolved": "https://registry.npmmirror.com/deepmerge/-/deepmerge-1.5.2.tgz",
       "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -5596,6 +5629,22 @@
       "integrity": "sha512-z1Axg0Fu54fse8wN4fd+GAINdU5mJmLtcl6bqIcYyzNVGONcfHAeeJi88KYMQVKalhXlYuVPzKkFIU5VD0raUw==",
       "dev": true
     },
+    "node_modules/element-ui": {
+      "version": "2.15.6",
+      "resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.6.tgz",
+      "integrity": "sha512-rcYXEKd/j2G0AgficAOk1Zd1AsnHRkhmrK4yLHmNOiimU2JfsywgfKUjMoFuT6pQx0luhovj8lFjpE4Fnt58Iw==",
+      "dependencies": {
+        "async-validator": "~1.8.1",
+        "babel-helper-vue-jsx-merge-props": "^2.0.0",
+        "deepmerge": "^1.2.0",
+        "normalize-wheel": "^1.0.1",
+        "resize-observer-polyfill": "^1.5.0",
+        "throttle-debounce": "^1.0.1"
+      },
+      "peerDependencies": {
+        "vue": "^2.5.17"
+      }
+    },
     "node_modules/elliptic": {
       "version": "6.5.4",
       "resolved": "https://registry.npmmirror.com/elliptic/-/elliptic-6.5.4.tgz",
@@ -8944,6 +8993,11 @@
         "node": ">=4"
       }
     },
+    "node_modules/normalize-wheel": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmmirror.com/normalize-wheel/-/normalize-wheel-1.0.1.tgz",
+      "integrity": "sha512-1OnlAPZ3zgrk8B91HyRj+eVv+kS5u+Z0SCsak6Xil/kmgEia50ga7zfkumayonZrImffAxPU/5WcyGhzetHNPA=="
+    },
     "node_modules/npm-run-path": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/npm-run-path/-/npm-run-path-2.0.2.tgz",
@@ -10877,6 +10931,11 @@
       "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
       "dev": true
     },
+    "node_modules/resize-observer-polyfill": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmmirror.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
+      "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
+    },
     "node_modules/resolve": {
       "version": "1.22.0",
       "resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.0.tgz",
@@ -12405,6 +12464,14 @@
         "node": ">=4.0.0"
       }
     },
+    "node_modules/throttle-debounce": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmmirror.com/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
+      "integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg==",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/through2": {
       "version": "2.0.5",
       "resolved": "https://registry.npmmirror.com/through2/-/through2-2.0.5.tgz",
@@ -15988,7 +16055,8 @@
       "version": "4.5.16",
       "resolved": "https://registry.npmmirror.com/@vue/cli-plugin-vuex/-/cli-plugin-vuex-4.5.16.tgz",
       "integrity": "sha512-cj9x7zaoc81Nz14cUUwQ3+niSJWBulTRPA5TeVIPyhxp0+Nk32xeBsc8JuVK9GmvLF6FQRizM94KvJWIyPAHVA==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "@vue/cli-service": {
       "version": "4.5.16",
@@ -16125,7 +16193,8 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmmirror.com/@vue/preload-webpack-plugin/-/preload-webpack-plugin-1.1.2.tgz",
       "integrity": "sha512-LIZMuJk38pk9U9Ur4YzHjlIyMuxPlACdBIHH9/nGYVTsaGKOSnSuELiE8vS9wa+dJpIYspYUOqk+L1Q4pgHQHQ==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "@vue/web-component-wrapper": {
       "version": "1.3.0",
@@ -16364,13 +16433,15 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/ajv-errors/-/ajv-errors-1.0.1.tgz",
       "integrity": "sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "ajv-keywords": {
       "version": "3.5.2",
       "resolved": "https://registry.npmmirror.com/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
       "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
-      "dev": true
+      "dev": true,
+      "requires": {}
     },
     "alphanum-sort": {
       "version": "1.0.2",
@@ -16576,6 +16647,14 @@
       "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ==",
       "dev": true
     },
+    "async-validator": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmmirror.com/async-validator/-/async-validator-1.8.5.tgz",
+      "integrity": "sha512-tXBM+1m056MAX0E8TL2iCjg8WvSyXu0Zc8LNtYqrVeyoL3+esHRZ4SieE9fKQyyU09uONjnMEjrNBMqT0mbvmA==",
+      "requires": {
+        "babel-runtime": "6.x"
+      }
+    },
     "asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmmirror.com/asynckit/-/asynckit-0.4.0.tgz",
@@ -16615,6 +16694,11 @@
       "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==",
       "dev": true
     },
+    "babel-helper-vue-jsx-merge-props": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmmirror.com/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-2.0.3.tgz",
+      "integrity": "sha512-gsLiKK7Qrb7zYJNgiXKpXblxbV5ffSwR0f5whkPAaBAR4fhi6bwRZxX9wBlIc5M/v8CCkXUbXZL4N/nSE97cqg=="
+    },
     "babel-loader": {
       "version": "8.2.4",
       "resolved": "https://registry.npmmirror.com/babel-loader/-/babel-loader-8.2.4.tgz",
@@ -16666,6 +16750,27 @@
         "@babel/helper-define-polyfill-provider": "^0.3.1"
       }
     },
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmmirror.com/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g==",
+      "requires": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "2.6.12",
+          "resolved": "https://registry.npmmirror.com/core-js/-/core-js-2.6.12.tgz",
+          "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
+        },
+        "regenerator-runtime": {
+          "version": "0.11.1",
+          "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+          "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
+        }
+      }
+    },
     "balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -18349,8 +18454,7 @@
     "deepmerge": {
       "version": "1.5.2",
       "resolved": "https://registry.npmmirror.com/deepmerge/-/deepmerge-1.5.2.tgz",
-      "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ==",
-      "dev": true
+      "integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ=="
     },
     "default-gateway": {
       "version": "5.0.5",
@@ -18745,6 +18849,19 @@
       "integrity": "sha512-z1Axg0Fu54fse8wN4fd+GAINdU5mJmLtcl6bqIcYyzNVGONcfHAeeJi88KYMQVKalhXlYuVPzKkFIU5VD0raUw==",
       "dev": true
     },
+    "element-ui": {
+      "version": "2.15.6",
+      "resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.6.tgz",
+      "integrity": "sha512-rcYXEKd/j2G0AgficAOk1Zd1AsnHRkhmrK4yLHmNOiimU2JfsywgfKUjMoFuT6pQx0luhovj8lFjpE4Fnt58Iw==",
+      "requires": {
+        "async-validator": "~1.8.1",
+        "babel-helper-vue-jsx-merge-props": "^2.0.0",
+        "deepmerge": "^1.2.0",
+        "normalize-wheel": "^1.0.1",
+        "resize-observer-polyfill": "^1.5.0",
+        "throttle-debounce": "^1.0.1"
+      }
+    },
     "elliptic": {
       "version": "6.5.4",
       "resolved": "https://registry.npmmirror.com/elliptic/-/elliptic-6.5.4.tgz",
@@ -21486,6 +21603,11 @@
         "sort-keys": "^1.0.0"
       }
     },
+    "normalize-wheel": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmmirror.com/normalize-wheel/-/normalize-wheel-1.0.1.tgz",
+      "integrity": "sha512-1OnlAPZ3zgrk8B91HyRj+eVv+kS5u+Z0SCsak6Xil/kmgEia50ga7zfkumayonZrImffAxPU/5WcyGhzetHNPA=="
+    },
     "npm-run-path": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/npm-run-path/-/npm-run-path-2.0.2.tgz",
@@ -23124,6 +23246,11 @@
       "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
       "dev": true
     },
+    "resize-observer-polyfill": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmmirror.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
+      "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
+    },
     "resolve": {
       "version": "1.22.0",
       "resolved": "https://registry.npmmirror.com/resolve/-/resolve-1.22.0.tgz",
@@ -24421,6 +24548,11 @@
         }
       }
     },
+    "throttle-debounce": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmmirror.com/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
+      "integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg=="
+    },
     "through2": {
       "version": "2.0.5",
       "resolved": "https://registry.npmmirror.com/through2/-/through2-2.0.5.tgz",

+ 1 - 0
web/package.json

@@ -8,6 +8,7 @@
   },
   "dependencies": {
     "core-js": "^3.6.5",
+    "element-ui": "^2.15.6",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0"
   },

+ 125 - 21
web/src/assets/css/base.css

@@ -1,51 +1,155 @@
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed, 
-figure, figcaption, footer, header, hgroup, 
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
     margin: 0;
     padding: 0;
     border: 0;
     font-size: 100%;
     font: inherit;
     vertical-align: baseline;
+    box-sizing: border-box;
 }
+
 /* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure, 
-footer, header, hgroup, menu, nav, section {
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
     display: block;
 }
+
 body {
     line-height: 1;
 }
-ol, ul {
+
+ol,
+ul {
     list-style: none;
 }
-blockquote, q {
+
+blockquote,
+q {
     quotes: none;
 }
-blockquote:before, blockquote:after,
-q:before, q:after {
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
     content: '';
     content: none;
 }
+
 table {
     border-collapse: collapse;
     border-spacing: 0;
 }
-a{
+
+a {
     color: #000;
     text-decoration: none;
 }
-a:hover{
+
+a:hover {
     color: #000;
     text-decoration: none;
+}
+
+/* element 输入框样式 */
+.el-input {
+    height: 30px;
+}
+.el-input__inner{
+    height: 30px;
+    border-radius: 15px;
+    line-height: 30px;
+}
+
+.el-input.is-active .el-input__inner, .el-input__inner:focus{
+    border-color:#ca000a;
 }

binární
web/src/assets/images/code.png


binární
web/src/assets/images/dh1.png


binární
web/src/assets/images/footer_bg.png


binární
web/src/assets/images/game.png


binární
web/src/assets/images/index_ewm.jpg


binární
web/src/assets/images/index_ewm1.png


binární
web/src/assets/images/swiper1.jpg


binární
web/src/assets/images/swiper2.jpg


binární
web/src/assets/images/swiper3.jpg


binární
web/src/assets/images/swiper4.jpg


+ 4 - 2
web/src/main.js

@@ -1,11 +1,13 @@
 import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
-
-Vue.config.productionTip = false
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css';
 //引入初始化样式
 import './assets/css/base.css'
+Vue.use(ElementUI);
 
+Vue.config.productionTip = false
 new Vue({
   router,
   render: h => h(App)

+ 1 - 0
web/src/router/index.js

@@ -14,6 +14,7 @@ const routes = [
         path:'Home',
         name:'Home',
         component: () => import( '../views/Home/index.vue'),
+        meta: { myName: 'Home' },
       }
     ]
   }

+ 8 - 2
web/src/views/Home/index.vue

@@ -1,5 +1,7 @@
 <template>
-<div class='Home'>Home</div>
+<div class='Home'>
+
+</div>
 </template>
 
 <script>
@@ -38,6 +40,10 @@ activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
 }
 </script>
 <style lang='less' scoped>
-//@import url(); 引入公共css类
+.Home{
+  width: 100%;
+  height: calc(100% - 45px);
+  background-color: black;
+}
 
 </style>

+ 86 - 0
web/src/views/layout/data.js

@@ -0,0 +1,86 @@
+export const topData = [
+  { id: 1, name: "Home", url: "Home" },
+  {
+    id: 2,
+    name: "Visit",
+    url: "Visit",
+    children: [
+      { id: 2.1, name: "Hours, Direction & Admission" },
+      { id: 2.2, name: "Reservation" },
+      { id: 2.3, name: "Floor Plans" },
+      { id: 2.4, name: "Audio Guide & Tour" },
+      { id: 2.5, name: "Accessibility" },
+      { id: 2.6, name: "Café & Shop" },
+      { id: 2.7, name: "Visitor Guidelines" },
+    ],
+  },
+  {
+    id: 3,
+    name: "Exhibitions",
+    url: "Exhibitions",
+    children: [
+      { id: 3.1, name: "Current Exhibitions" },
+      { id: 3.2, name: "Permanent Exhibitions" },
+      { id: 3.3, name: "Past Exhibitions" },
+      { id: 3.4, name: "Overseas Exhibitions" },
+    ],
+  },
+  {
+    id: 4,
+    name: "Collections",
+    url: "Collections",
+    children: [
+      { id: 4.1, name: "Bronzes" },
+      { id: 4.2, name: "Ceramics" },
+      { id: 4.3, name: "Buddhist Statues" },
+      { id: 4.4, name: "Jadewares" },
+      { id: 4.5, name: "Calligraphies" },
+      { id: 4.6, name: "Paintings" },
+      { id: 4.7, name: "Gold & Silverwares" },
+      { id: 4.8, name: "Coins & Banknotes" },
+      { id: 4.9, name: "Brocades & Embroideries" },
+      { id: 4.10, name: "Cultural Supplies" },
+      { id: 4.11, name: "Miscellaneous" },
+    ],
+  },
+  {
+    id: 5,
+    name: "Learn & Engage",
+    url: "LearnEngage",
+    children: [
+      { id: 5.1, name: "For Students" },
+      { id: 5.2, name: "For Adults" },
+      { id: 5.3, name: "For Families & Children" },
+    ],
+  },
+  {
+    id: 6,
+    name: "Publications",
+    url: "Publications",
+    children: [
+      { id: 6.1, name: "Magazines" },
+      { id: 6.2, name: "Exhibition Catalogues" },
+      { id: 6.3, name: "Exhibition Brochures" },
+    ],
+  },
+  {
+    id: 7,
+    name: "Join & Support",
+    url: "JoinSupport",
+    children: [
+      { id: 7.1, name: "Ways to Volunteer" },
+      { id: 7.2, name: "Ways to Give" },
+    ],
+  },
+  {
+    id: 8,
+    name: "About",
+    url: "About",
+    children: [
+      { id: 8.1, name: "From the Director" },
+      { id: 8.2, name: "History" },
+      { id: 8.3, name: "Partners & Connections" },
+      { id: 8.4, name: "Contact" },
+    ],
+  },
+]

+ 198 - 88
web/src/views/layout/index.vue

@@ -7,108 +7,83 @@
           <img src="@/assets/images/logo.png" alt="" />
         </h1>
         <ul class="mainbav">
-          <li class=""></li>
+          <li
+            :class="{ active: $route.meta.myName === item.name }"
+            v-for="item in topData"
+            :key="item.id"
+          >
+            <span>{{ item.name }}</span>
+            <ul class="mainbav_sub">
+              <li v-for="(val, index) in item.children" :key="index">
+                {{ val.name }}
+              </li>
+            </ul>
+          </li>
+          <!-- 中文网 -->
+          <li class="language">
+            <a href="http://www.capitalmuseum.org.cn/" target="_blank">中文</a>
+          </li>
+          <!-- 爱心模式 -->
+          <li class="love">
+            <span>Caring Mode</span>&nbsp;
+            <el-switch v-model="loveFalg" active-color="#AB3434"> </el-switch>
+          </li>
         </ul>
       </div>
+      <!-- 右侧的输入框 -->
+      <div class="search">
+        <el-input
+          placeholder="search..."
+          suffix-icon="el-icon-search"
+          v-model="searchTxt"
+        >
+        </el-input>
+      </div>
+    </div>
+    <!-- 固定的二维码和游戏 -->
+    <div class="rightNav">
+      <ul class="rightIco">
+        <li title="game">
+          <img src="@/assets/images/game.png" alt="" />
+        </li>
+        <li>
+          <img src="@/assets/images/code.png" alt="" />
+          <div>
+            <img src="@/assets/images/index_ewm1.png" alt="" />
+            <img src="@/assets/images/index_ewm.jpg" alt="" />
+          </div>
+        </li>
+      </ul>
     </div>
     <!-- 嵌套路由 -->
     <Router-view />
+    <!-- 底部固定栏 -->
+    <div class="footer">
+      <div>
+        <span v-for="item in footerData" :key="item.name" v-html="item.name"></span>
+      </div>
+      <p>Capital Museum. China 16 Fuxingmenwai Street, Xicheng District, Beijing 100045, P.R.China.</p>
+    </div>
   </div>
 </template>
 
 <script>
+import { topData } from "./data";
 export default {
   name: "Layout",
   components: {},
   data() {
     //这里存放数据
     return {
-      topData: [
-        { id: 1, name: "Home", url: "Home" },
-        {
-          id: 2,
-          name: "Visit",
-          url: "Visit",
-          children: [
-            { id: 2.1, name: "Hours, Direction & Admission" },
-            { id: 2.2, name: "Reservation" },
-            { id: 2.3, name: "Floor Plans" },
-            { id: 2.4, name: "Audio Guide & Tour" },
-            { id: 2.5, name: "Accessibility" },
-            { id: 2.6, name: "Café & Shop" },
-            { id: 2.7, name: "Visitor Guidelines" },
-          ],
-        },
-        {
-          id: 3,
-          name: "Exhibitions",
-          url: "Exhibitions",
-          children: [
-            { id: 3.1, name: "Current Exhibitions" },
-            { id: 3.2, name: "Permanent Exhibitions" },
-            { id: 3.3, name: "Past Exhibitions" },
-            { id: 3.4, name: "Overseas Exhibitions" },
-          ],
-        },
-        {
-          id: 4,
-          name: "Collections",
-          url: "Collections",
-          children: [
-            { id: 4.1, name: "Bronzes" },
-            { id: 4.2, name: "Ceramics" },
-            { id: 4.3, name: "Buddhist Statues" },
-            { id: 4.4, name: "Jadewares" },
-            { id: 4.5, name: "Calligraphies" },
-            { id: 4.6, name: "Paintings" },
-            { id: 4.7, name: "Gold & Silverwares" },
-            { id: 4.8, name: "Coins & Banknotes" },
-            { id: 4.9, name: "Brocades & Embroideries" },
-            { id: 4.1, name: "Cultural Supplies" },
-            { id: 4.11, name: "Miscellaneous" },
-          ],
-        },
-        {
-          id: 5,
-          name: "Learn & Engage",
-          url: "LearnEngage",
-          children: [
-            { id: 5.1, name: "For Students" },
-            { id: 5.2, name: "For Adults" },
-            { id: 5.3, name: "For Families & Children" },
-          ],
-        },
-        {
-          id: 6,
-          name: "Publications",
-          url: "Publications",
-          children: [
-            { id: 6.1, name: "Magazines" },
-            { id: 6.2, name: "Exhibition Catalogues" },
-            { id: 6.3, name: "Exhibition Brochures" },
-          ],
-        },
-        {
-          id: 7,
-          name: "Join & Support",
-          url: "JoinSupport",
-          children: [
-            { id: 7.1, name: "Ways to Volunteer" },
-            { id: 7.2, name: "Ways to Give" },
-          ],
-        },
-        {
-          id: 8,
-          name: "About",
-          url: "About",
-          children: [
-            { id: 8.1, name: "From the Director" },
-            { id: 8.2, name: "History" },
-            { id: 8.3, name: "Partners & Connections" },
-            { id: 8.4, name: "Contact" },
-          ],
-        },
-      ],
+      topData,
+      loveFalg: false,
+      searchTxt: "",
+      footerData:[
+        {name:'|&emsp; Site Index',path:''},
+        {name:'|&emsp; Terms of Use',path:''},
+        {name:'|&emsp; Events',path:''},
+        {name:'|&emsp; Employment',path:''},
+      ]
     };
   },
   //监听属性 类似于data概念
@@ -145,7 +120,7 @@ export default {
   left: 0;
   z-index: 999;
   .mainbav_wrap {
-    width: 1200px;
+    width: 1300px;
     margin: 0 auto;
     & > h1 {
       float: left;
@@ -156,6 +131,141 @@ export default {
         vertical-align: top;
       }
     }
+    .mainbav {
+      font-size: 14px;
+      color: #fff;
+      line-height: 60px;
+      & > li {
+        cursor: pointer;
+        float: left;
+        display: inline;
+        margin-right: 25px;
+        position: relative;
+        &:hover {
+          & > span {
+            border-bottom: 2px solid #ca000a;
+          }
+          .mainbav_sub {
+            display: block;
+          }
+        }
+        .mainbav_sub {
+          display: none;
+          position: absolute;
+
+          & > li {
+            border-left: 2px solid #660005;
+            font-size: 14px;
+            color: #fff;
+            line-height: 40px;
+            background-color: rgba(0, 0, 0, 0.8);
+            white-space: nowrap;
+            float: none;
+            display: block;
+            margin: 0;
+            padding: 0 20px 0 10px;
+            &:hover {
+              background-color: rgba(204, 0, 3, 0.8);
+              border-left: 2px solid #cc0003;
+            }
+          }
+        }
+      }
+      .language {
+        background: url("../../assets/images/dh1.png") no-repeat 0 18px;
+        width: 73px;
+        text-indent: 41px;
+        & > a {
+          color: #fff;
+          text-decoration: none;
+          &:hover {
+            border-bottom: 2px solid #ca000a;
+          }
+        }
+      }
+      .love {
+        margin-right: 0;
+        &:hover {
+          & > span {
+            border-bottom: none;
+          }
+        }
+      }
+      .active {
+        & > span {
+          border-bottom: 2px solid #ca000a;
+        }
+      }
+    }
+  }
+  .search {
+    width: 240px;
+    height: 30px;
+    position: absolute;
+    top: 50%;
+    right: 40px;
+    transform: translateY(-50%);
+    ::-webkit-input-placeholder {
+      color: #000000;
+    }
+    /deep/.el-input__icon {
+      font-size: 20px;
+      line-height: 30px;
+      color: #ca000a;
+    }
+  }
+}
+.rightNav {
+  width: 60px;
+  height: 164px;
+  position: fixed;
+  bottom: 150px;
+  right: 0;
+  z-index: 999;
+  .rightIco {
+    width: 100%;
+    height: 100%;
+    & > li {
+      background-color: rgba(0, 0, 0, 0.8);
+      text-align: center;
+      width: 60px;
+      padding: 10px 0;
+      position: relative;
+      cursor: pointer;
+      & > div {
+        display: none;
+        width: 252px;
+        position: absolute;
+        top: 0;
+        right: 0;
+        & > img {
+          float: left;
+        }
+      }
+      &:hover {
+        background-color: #c20e11;
+        & > div {
+          display: block;
+        }
+      }
+    }
+  }
+}
+.footer {
+  padding: 0 100px;
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  height: 45px;
+  font-size: 14px;
+  color: #fff;
+  line-height: 45px;
+  background: url(../../assets/images/footer_bg.png) center top;
+  &>div{
+    &>span{
+      cursor: pointer;
+      margin-right: 15px;
+    }
   }
 }
 </style>