init

Corrs · May 5, 2017 · c435fb9 · c435fb9
1 parent 20523dc
commit c435fb9
Show file tree

Hide file tree

Showing 9 changed files with 216 additions and 11 deletions.
diff --git a/package.json b/package.json
@@ -54,14 +54,11 @@
     "vue-loader": "^11.3.4",
     "vue-style-loader": "^2.0.5",
     "vue-template-compiler": "^2.2.6",
-    "vux": "^2.2.1-rc.8",
-    "vux-loader": "^1.0.57",
     "webpack": "^2.3.3",
     "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-middleware": "^1.10.0",
     "webpack-hot-middleware": "^2.18.0",
-    "webpack-merge": "^4.1.0",
-    "yaml-loader": "^0.4.0"
+    "webpack-merge": "^4.1.0"
   },
   "engines": {
     "node": ">= 4.0.0",

diff --git a/src/module/index/App.vue b/src/module/index/App.vue
@@ -1,6 +1,5 @@
 <template>
   <div id="app">
-    <p>index页面</p>
     <router-view></router-view>
   </div>
 </template>
@@ -11,13 +10,41 @@ export default {
 }
 </script>
 
-<style>
+<style lang="less">
+  @base: 37.5rem;
+  @multiple: 2;
+  @borderColorBottom: #f2f2f2;
   #app {
-    font-family: 'Avenir', Helvetica, Arial, sans-serif;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
     text-align: center;
     color: #2c3e50;
-    margin-top: 60px;
+  }
+  a{
+    text-decoration: none;
+  }
+  header {
+    display: -webkit-flex;
+    display: flex;
+    line-height: 48/@base;
+    border-bottom: 1px solid @borderColorBottom;
+  > a {
+      width: 7%;
+      font-size: 20px;
+      text-align: center;
+    }
+  img {
+    width: 100%;
+    vertical-align: middle;
+  }
+  div:nth-child(1) {
+    width: auto;
+  }
+  div:nth-child(2) {
+    width: 90%;
+    text-align: center;
+  }
+  div:nth-child(3) {
+    width: 5%;
+    text-align: right;
+  }
   }
 </style>
diff --git a/src/module/index/index.html b/src/module/index/index.html
@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
+  <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
     <title>Title</title>
 </head>
 <body>

diff --git a/src/module/index/index.js b/src/module/index/index.js
@@ -3,7 +3,7 @@
 import Vue from 'vue'
 import App from './App'
 import VueRouter from 'vue-router'
-
+import './iconfont.css'
 Vue.config.productionTip = false
 Vue.use(VueRouter)
 const routes = [{
@@ -32,3 +32,8 @@ new Vue({
   render: h => h(App)
 }).$mount('#app')
 
+Vue.component('header-item', {
+  props: ['message', 'backUrl'],
+  template: `<header class="evaluate-header"><router-link :to="backUrl"><span><i class="iconfont">&#xe697;</i></span></router-link> <div><span>{{message}}</span></div> </header>`
+})
+
diff --git a/static/font/iconfont.eot b/static/font/iconfont.eot
diff --git a/static/font/iconfont.js b/static/font/iconfont.js
@@ -0,0 +1,132 @@
+;(function(window) {
+
+  var svgSprite = '<svg>' +
+    '' +
+    '<symbol id="icon-back" viewBox="0 0 1024 1024">' +
+    '' +
+    '<path d="M363.840919 472.978737C336.938714 497.358861 337.301807 537.486138 364.730379 561.486138L673.951902 832.05497C682.818816 839.813519 696.296418 838.915012 704.05497 830.048098 711.813519 821.181184 710.915012 807.703582 702.048098 799.94503L392.826577 529.376198C384.59578 522.174253 384.502227 511.835287 392.492414 504.59418L702.325747 223.807723C711.056111 215.895829 711.719614 202.404616 703.807723 193.674252 695.895829 184.943889 682.404617 184.280386 673.674253 192.192278L363.840919 472.978737Z"  ></path>' +
+    '' +
+    '</symbol>' +
+    '' +
+    '<symbol id="icon-more" viewBox="0 0 1024 1024">' +
+    '' +
+    '<path d="M642.174253 504.59418C650.164439 511.835287 650.070886 522.174253 641.84009 529.376198L332.618569 799.94503C323.751654 807.703582 322.853148 821.181184 330.611697 830.048098 338.370249 838.915012 351.847851 839.813519 360.714765 832.05497L669.936288 561.486138C697.36486 537.486138 697.727953 497.358861 670.825747 472.978737L360.992414 192.192278C352.26205 184.280386 338.770837 184.943889 330.858944 193.674252 322.947053 202.404616 323.610556 215.895829 332.340919 223.807723L642.174253 504.59418Z"  ></path>' +
+    '' +
+    '</symbol>' +
+    '' +
+    '</svg>'
+  var script = function() {
+    var scripts = document.getElementsByTagName('script')
+    return scripts[scripts.length - 1]
+  }()
+  var shouldInjectCss = script.getAttribute("data-injectcss")
+
+  /**
+   * document ready
+   */
+  var ready = function(fn) {
+    if (document.addEventListener) {
+      if (~["complete", "loaded", "interactive"].indexOf(document.readyState)) {
+        setTimeout(fn, 0)
+      } else {
+        var loadFn = function() {
+          document.removeEventListener("DOMContentLoaded", loadFn, false)
+          fn()
+        }
+        document.addEventListener("DOMContentLoaded", loadFn, false)
+      }
+    } else if (document.attachEvent) {
+      IEContentLoaded(window, fn)
+    }
+
+    function IEContentLoaded(w, fn) {
+      var d = w.document,
+        done = false,
+        // only fire once
+        init = function() {
+          if (!done) {
+            done = true
+            fn()
+          }
+        }
+        // polling for no errors
+      var polling = function() {
+        try {
+          // throws errors until after ondocumentready
+          d.documentElement.doScroll('left')
+        } catch (e) {
+          setTimeout(polling, 50)
+          return
+        }
+        // no errors, fire
+
+        init()
+      };
+
+      polling()
+        // trying to always fire before onload
+      d.onreadystatechange = function() {
+        if (d.readyState == 'complete') {
+          d.onreadystatechange = null
+          init()
+        }
+      }
+    }
+  }
+
+  /**
+   * Insert el before target
+   *
+   * @param {Element} el
+   * @param {Element} target
+   */
+
+  var before = function(el, target) {
+    target.parentNode.insertBefore(el, target)
+  }
+
+  /**
+   * Prepend el to target
+   *
+   * @param {Element} el
+   * @param {Element} target
+   */
+
+  var prepend = function(el, target) {
+    if (target.firstChild) {
+      before(el, target.firstChild)
+    } else {
+      target.appendChild(el)
+    }
+  }
+
+  function appendSvg() {
+    var div, svg
+
+    div = document.createElement('div')
+    div.innerHTML = svgSprite
+    svgSprite = null
+    svg = div.getElementsByTagName('svg')[0]
+    if (svg) {
+      svg.setAttribute('aria-hidden', 'true')
+      svg.style.position = 'absolute'
+      svg.style.width = 0
+      svg.style.height = 0
+      svg.style.overflow = 'hidden'
+      prepend(svg, document.body)
+    }
+  }
+
+  if (shouldInjectCss && !window.__iconfont__svg__cssinject__) {
+    window.__iconfont__svg__cssinject__ = true
+    try {
+      document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>");
+    } catch (e) {
+      console && console.log(e)
+    }
+  }
+
+  ready(appendSvg)
+
+
+})(window)
diff --git a/static/font/iconfont.svg b/static/font/iconfont.svg
diff --git a/static/font/iconfont.ttf b/static/font/iconfont.ttf
diff --git a/static/font/iconfont.woff b/static/font/iconfont.woff