Explorar o código

页面大框架

zhouna %!s(int64=5) %!d(string=hai) anos
pai
achega
de12ddffcb
Modificáronse 6 ficheiros con 77 adicións e 19 borrados
  1. 1 0
      package.json
  2. 40 0
      src/css/index.less
  3. 8 0
      src/css/reset.less
  4. 25 9
      src/html/index.html
  5. 3 2
      src/js/index.js
  6. 0 8
      webpack.config.js

+ 1 - 0
package.json

@@ -27,6 +27,7 @@
     "raw-loader": "^4.0.0",
     "style-loader": "^0.23.1",
     "uglifyjs-webpack-plugin": "^2.1.2",
+    "url-loader": "^4.1.0",
     "webpack": "^4.31.0",
     "webpack-dev-middleware": "^3.6.2",
     "webpack-dev-server": "^3.3.1"

+ 40 - 0
src/css/index.less

@@ -1 +1,41 @@
 @import './reset.less';
+.container{
+  height: 100%;
+}
+.header{
+  position: fixed;
+  width: 100%;
+  height:40px;
+  top:0;
+  background: #267FD7;
+  text-indent: 15px;
+  line-height: 40px;
+  color: #fff;
+  font-size: 16px;
+  a{
+    color: #fff;
+    text-decoration: none;
+    margin-right: 15px;
+  }
+  img{
+    vertical-align: middle;
+    margin-right: 10px;
+  }
+}
+.main-body{
+  height: 100%;
+  margin-top:40px;
+}
+.menu{
+  width: 200px;
+  height: 100%;
+  border-right:1px #267FD7 solid;
+  .active{
+    color: #267FD7;
+  }
+  li{
+    line-height: 34px;
+    padding: 0 15px;
+    cursor: pointer;
+  }
+}

+ 8 - 0
src/css/reset.less

@@ -35,6 +35,8 @@ html,
 body {
   font-family: 'Microsoft YaHei', arial, tahoma, sans-serif;
   color: #000;
+  height: 100%;
+  overflow: hidden;
 }
 
 ol,
@@ -79,3 +81,9 @@ textarea {
   zoom: 1; 
 }
 
+.fl{
+  float: left;
+}
+.fr{
+  float: right;
+}

+ 25 - 9
src/html/index.html

@@ -4,19 +4,35 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
-  <title><%= htmlWebpackPlugin.options.title %></title>
+  <title>AI病例质控-首页</title>
 </head>
 
 <body>
-  <div class="bodyWrap">
-      <div class="iframeWrap">
-        <div class="recommendWrap"></div>
-        <p class="responsibility"></p>
+  <div class="container">
+      <div class="header clearfix">
+          <div class="title fl">
+              <img src="../images/logo.png" alt="logo" />
+              <span>AI病例质控平台</span>
+          </div>
+          <div class="login fr">
+              <a class="setting" href="javascript:void(0);">设置</a>
+              <a class="login-out" href="javascript:void(0);">退出</a>
+          </div>
       </div>
-      <div class="disclaimer clearfix">
-        <span class="version-tip">版本信息: <a href="javascript:void(0);"></a> </span>
-        <b class="logo">&copy朗通医疗</b>
-        <span class="disclaimerInfo">免责声明</span>
+      <div class="main-body">
+          <div class="menu">
+              <ul>
+                  <li class="active">控制台</li>
+                  <li>基础数据
+                      <ul>
+                          <li>模块维护</li>
+                          <li>条目数据维护</li>
+                      </ul>
+                  </li>
+                  <li>病例质控</li>
+                  <li>统计分析</li>
+              </ul>
+          </div>
       </div>
   </div>
 </body>

+ 3 - 2
src/js/index.js

@@ -1,4 +1,5 @@
-
+const $ = require('jquery');
+require("../css/index.less");
 $(function(){
-  alert(2)
+
 });

+ 0 - 8
webpack.config.js

@@ -100,14 +100,6 @@ module.exports = {
           }
         }
       },
-      {
-        test: /\.css$/,
-        use: [{
-            loader: MiniCssExtractPlugin.loader
-          },
-          'css-loader'
-        ]
-      },
       {
         test: /\.less$/,
         use: [