Merge branch 'master' into dev_zxc

package.json

@@ -5,8 +5,13 @@
   "main": "index.js",
   "dependencies": {
     "bluebird": "^3.5.5",
+    "echarts": "^4.7.0",
     "es3ify-loader": "^0.2.0",
+    "install": "^0.13.0",
     "jquery": "^1.12.4",
+    "jquery-templates": "^1.0.0",
+    "js-md5": "^0.7.3",
+    "uninstall": "0.0.0",
     "webpack-cli": "^3.3.1"
   },
   "devDependencies": {

src/css/console.less

@@ -0,0 +1,28 @@
+.echarts {
+  width: 400px;
+  height: 500px;
+}
+.partWrap {
+  margin-top: 30px;
+  .partLi {
+    float: left;
+    border: 1px solid #ccc;
+    padding: 20px;
+    border-radius: 5px;
+    margin: 15px;
+    p {
+      padding: 10px 0;
+      font-size: 16px;
+    }
+    .btm {
+      img {
+        float: left;
+      }
+      span {
+        float: right;
+        font-size: 28px;
+        color: blue;
+      }
+    }
+  }
+}

src/css/index.less

@@ -1,49 +1,152 @@
 @import './reset.less';
+
+@headerHt:50px;
+@menuLiHt:40px;
+@menuWt:300px;
+@activeColor:#5A8EEE;
+@activeBg:#EEF4FF;
+
 .container{
   height: 100%;
 }
 .header{
   position: fixed;
   width: 100%;
-  height:40px;
+  height:@headerHt;
+  line-height: @headerHt;
   top:0;
-  background: #267FD7;
-  text-indent: 15px;
-  line-height: 40px;
+  background:linear-gradient(123deg,rgba(90,142,238,1) 0%,rgba(126,171,255,1) 100%);;
+  text-indent: 20px;
   color: #fff;
   font-size: 16px;
-  a{
+  .login{
+    margin-right: 20px;
+    height: @headerHt;
+    line-height: @headerHt;
+    position: relative;
+    &:after{
+      content: " ";
+      display: inline-block;
+      position: absolute;
+      right: 0;
+      top:22px;
+      width: 10px;
+      height: 6px;
+      background: url("../images/icon_wdown.png") no-repeat;
+    }
+    //设置
+    .userAction {
+      background-color: #fff;
+      border-radius: 2px;
+      display: none;
+      text-indent: 0;
+      width: 100px;
+      position: absolute;
+      right: 0;
+      top:42px;
+      box-shadow:0px 4px 20px -3px rgba(59,89,126,0.3);
+      li {
+        line-height: 36px;
+        text-align: center;
+        cursor: pointer;
+        color: #777777;
+        a{
+          color: #777777;
+        }
+        &:hover,a:hover{
+          color: @activeColor;
+        }
+      }
+    }
+  }
+  .setting{
+    display: inline-block;
+    height:26px;
+    line-height: 26px;
+    margin: 12px 0 0 0;
+    background: url("../images/head.png") no-repeat;
+    padding:0 22px 0 15px;
     color: #fff;
     text-decoration: none;
-    margin-right: 15px;
   }
   img{
     vertical-align: middle;
     margin-right: 10px;
   }
+  .title span{
+    display: inline-block;
+    border-left: 1px #fff solid;
+    height: 20px;
+    line-height: 20px;
+    color: #fff;
+  }
 }
 .main-body{
   height: 100%;
-  margin-top:40px;
+  margin-top:@headerHt+20px;
 }
 .menu{
-  width: 200px;
+  width: @menuWt;
   height: 100%;
-  border-right:1px #267FD7 solid;
   .active{
-    color: #267FD7;
+    color: @activeColor;
+    background: @activeBg;
+    border-right: 3px @activeColor solid;
+  }
+  .slide-up{
+    color: @activeColor;
+  }
+  .list-1{
+    position: relative;
+    &:after{
+      content: " ";
+      display: inline-block;
+      position: absolute;
+      left: 270px;
+      top:18px;
+      width: 10px;
+      height: 6px;
+      background: url("../images/icon_down.png") no-repeat;
+    }
+    &.slide-up:after{
+      transform: rotate(180deg);
+      -webkit-transform: rotate(180deg);
+    }
+    ul{
+      display: none;
+      li.page{
+        text-indent: 30px;
+      }
+    }
   }
   li{
-    line-height: 34px;
-    padding: 0 15px;
+    line-height: @menuLiHt;
+    text-indent: 15px;
     cursor: pointer;
   }
 }
-iframe{
-  width: 100%;
-  height: 890px;
-  position: absolute;
-  top: 40px;
-  left: 200px;
-  overflow-y: auto;
+.main{
+  margin-left:215px;
+  height: 100%;
+  iframe{
+    width: 100%;
+    height: 100%;
+  }
+}
+//修改密码
+.modalAction {
+  position: fixed;
+  width: 200px;
+  height: 200px;
+  left: 50%;
+  top: 50%;
+  margin-left: -100px;
+  margin-top: -100px;
+  padding: 20px;
+  background-color: #ccc;
+  display: none;
+  .waring {
+    color: red;
+    display: none;
+  }
 }

src/css/login.less

@@ -0,0 +1,10 @@
+input {
+  border: 1px solid #ccc;
+}
+.login {
+  margin: 100px;
+  .waring {
+    color: red;
+    display: none;
+  }
+}

src/css/reset.less

@@ -29,12 +29,14 @@ input {
   border: 0;
   font-size: 14px;
   font-style: normal;
+  color: #333333;
+  text-decoration: none;
 }
 
 html,
 body {
   font-family: 'Microsoft YaHei', arial, tahoma, sans-serif;
-  color: #000;
+  color: #333333;
   height: 100%;
   overflow: hidden;
 }

src/html/console.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Document</title>
+</head>
+<body>
+  <div class="partWrap">
+    <ul class="clearfix">
+      <li class="partLi">
+        <div>
+          <p class="top">本月病例数</p>
+          <p class="btm clearfix">
+            <img src="../images/jianb.png" alt="">
+            <span>33</span>
+          </p>
+        </div>
+      </li>
+      <li>sds</li>
+      <li>sds</li>
+    </ul>
+  </div>
+  <div id="main" class="echarts">
+    
+  </div>
+  
+</body>
+</html>

src/html/index.html

@@ -6,7 +6,21 @@
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <title>AI病例质控-首页</title>
 </head>
-
+<script type="text/html" id="menuTmpl">
+    <ul>
+        {{if subMenuList.length}}
+            <li class="list-1">${name}
+        {{else}}
+            <li class="page" code="${code}">${name}
+        {{/if}}
+            <ul>
+                {{each subMenuList}}
+                <li class="page" code="${code}">${name}</li>
+                {{/each}}
+            </ul>
+        </li>
+    </ul>
+</script>
 <body>
   <div class="container">
       <div class="header clearfix">
@@ -15,25 +29,25 @@
               <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>
+              <a class="setting" id="userName" href="javascript:void(0);">***</a>
+              <ul class="userAction">
+                  <li id="changeWord">修改密码</li>
+                  <li><a class="login-out" href="./login.html">退出</a></li>
+              </ul>
           </div>
       </div>
-      <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 class="main-body clearfix">
+          <div class="menu fl"></div>
+          <div class="main">
+              <iframe src="./console.html" frameborder="0" id="contentIframe"></iframe>
           </div>
-        <iframe src="./moduleManager.html"  scrolling="yes"></iframe> 
+      </div>
+      <div class="modalAction">
+          <p><span>原始密码：</span><input type="text" class="oldword"></p>
+          <p><span>新密码：</span><input type="text" class="newword"></p>
+          <p><span>确认密码：</span><input type="text" class="sureword"></p>
+          <p class="waring"></p>
+          <span class="sureChange">确认修改</span>
       </div>
   </div>
 </body>

src/html/login.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <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>登录页</title>
+</head>
+<body>
+  <div class="login">
+    <div class="loginForm">
+      <div class="name">
+        <span>用户名：</span>
+        <input type="text" placeholder="请输入用户名称" id="username" value="h1">
+      </div>
+      <div class="word">
+        <span>密码：</span>
+        <input type="text" placeholder="请输入密码" id="password" value="a123456">
+      </div>
+      <p class="waring">*****错误 </p>
+      <div class="sureLogin">登录</div>
+    </div>
+  </div>
+</body>
+</html>

src/html/qcScore.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <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>质控评分</title>
+    <script type="text/html" id="infoTmpl">
+        <span>${number}</span>
+        <span>${name}</span>
+        <span>${sex}</span>
+        <span>${birthday}</span>
+        <span>${deptName}</span>
+        <span>${level}</span>
+        <span>${score}</span>
+    </script>
+</head>
+<body>
+    <div class="patient-info"></div>
+    <div class="main-part">
+
+    </div>
+</body>
+</html>

src/js/console.js

@@ -0,0 +1,77 @@
+const $ = require('jquery');
+require("../css/reset.less")
+require("../css/console.less")
+require("../images/logo.png")
+// import 'zrender/lib/svg/svg';
+const echarts = require('echarts');
+console.log(echarts)
+$(function(){
+  // var myChart = echarts.init(document.getElementById('echarts'));
+  var myChart = echarts.init(document.getElementById('main'));
+  // 绘制图表
+  let app = {}
+  let option = {
+    title: {
+        text: '饼图程序调用高亮示例',
+        left: 'center'
+    },
+    tooltip: {
+        trigger: 'item',
+        formatter: '{a} <br/>{b} : {c} ({d}%)'
+    },
+    legend: {
+        orient: 'vertical',
+        left: 'left',
+        data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
+    },
+    series: [
+          {
+              name: '访问来源',
+              type: 'pie',
+              radius: '55%',
+              center: ['50%', '60%'],
+              data: [
+                  {value: 335, name: '直接访问'},
+                  {value: 310, name: '邮件营销'},
+                  {value: 234, name: '联盟广告'},
+                  {value: 135, name: '视频广告'},
+                  {value: 1548, name: '搜索引擎'}
+              ],
+              emphasis: {
+                  itemStyle: {
+                      shadowBlur: 10,
+                      shadowOffsetX: 0,
+                      shadowColor: 'rgba(0, 0, 0, 0.5)'
+                  }
+              }
+          }
+      ]
+  };
+
+  app.currentIndex = -1;
+
+  setInterval(function () {
+      var dataLen = option.series[0].data.length;
+      // 取消之前高亮的图形
+      myChart.dispatchAction({
+          type: 'downplay',
+          seriesIndex: 0,
+          dataIndex: app.currentIndex
+      });
+      app.currentIndex = (app.currentIndex + 1) % dataLen;
+      // 高亮当前图形
+      myChart.dispatchAction({
+          type: 'highlight',
+          seriesIndex: 0,
+          dataIndex: app.currentIndex
+      });
+      // 显示 tooltip
+      myChart.dispatchAction({
+          type: 'showTip',
+          seriesIndex: 0,
+          dataIndex: app.currentIndex
+      });
+  }, 1000);
+  myChart.setOption(option);
+})
+

src/js/index.js

@@ -1,5 +1,82 @@
-const $ = require('jquery');
 require("../css/index.less");
-$(function(){
+const $ = require('jquery');
+require('jquery-templates');
+const md5 = require('js-md5');
+const {api,post,pageMap} = require('./utils.js');
 
+$(function(){
+  getMenu();
+  //菜单展开收起
+  sureChangeWord()
 });
+
+function initMenu(data,userInfo){
+  //菜单数据填充
+  $("#menuTmpl").tmpl(data).appendTo(".menu");
+  //用户数据填充
+  $("#userName").text(userInfo.linkman);
+  //菜单收起展开
+  $(".list-1").on("click",function(){
+    $(".list-1 .slide-up").removeClass('slide-up');
+    $(this).toggleClass('slide-up');
+    $(this).find("ul").slideToggle();
+  });
+  $(".list-1 li").on("click",function(e){
+    e.stopPropagation();
+  });
+  //右侧页面切换
+  $(".page").on("click",function(){
+    $(".menu .active").removeClass('active');
+    $(this).addClass("active");
+    const code = $(this).attr("code");
+    const url = './'+pageMap[code];
+    $("#contentIframe").attr("src",url);
+  });
+}
+
+function getMenu(){
+  post(api.getMenu).then(function(res){
+    if(res.data.code==='0'){
+      const data = res.data.data;
+      initMenu(data.menuWrappers,data.userLoginDTO);
+    }
+  });
+};
+
+function sureChangeWord(){
+  $('.container').on('click','.sureChange',function(){
+    let oldword = $(".oldword").val()
+    let newword = $(".newword").val()
+    let sureword = $(".sureword").val()
+    if(newword != sureword){
+      $(".modalAction .waring").css('display','block').html('两次密码不一致')
+      return
+    }
+    changeWord(oldword,newword)
+  })
+}
+function changeWord(oldword,newword){
+  post(api.midifyPassword,{
+    "modifyPassword": md5(newword),
+    "password": md5(oldword)
+  }).then(function(res){
+    const data = res.data;
+    if(data.code==='0'){
+      console.log(data)
+      window.location.href = './login.html'
+    }else{
+      $(".modalAction .waring").css('display','block').html(data.msg)
+      return
+    }
+  });
+}
+//用户信息下拉事件
+$(".setting").click(function(){
+  $(".userAction").slideToggle();
+})
+//点击修改密码
+$(".container").on('click','#changeWord',function(){
+  const status = $(".modalAction").css("display")
+  $(".userAction").hide();
+  $(".modalAction").css('display',status=='block'?'none':'block')
+})

src/js/login.js

@@ -0,0 +1,25 @@
+const $ = require('jquery');
+require("../css/reset.less")
+require("../css/login.less")
+const {post,setCookie} = require('../js/utils.js');
+const url = '/sys/user/getJwt';
+const md5 = require('js-md5');
+$(function(){
+  $(".sureLogin").click(()=>{
+    let username = $("#username").val();
+    let password = md5($("#password").val());
+    post(url,{
+      username:username,
+      password:password
+    }).then((res)=>{
+      const data = res.data;
+      if(data.code == 0){
+        setCookie('accessToken',data.data.accessToken)
+        alert('登录成功')
+        window.location.href = '/index.html'
+      }else{
+        $(".login .waring").css('display','block').html(data.msg)
+      }
+    })
+  })
+});

webpack.config.js

@@ -10,6 +10,9 @@ const proxyHost = "http://192.168.2.236:5858";
 module.exports = {
   entry: {
     index: path.resolve(__dirname, 'src/js', 'index.js'),
+    qcScore:path.resolve(__dirname, 'src/js', 'qcScore.js'),
+    login:path.resolve(__dirname, 'src/js', 'login.js'),
+    console:path.resolve(__dirname, 'src/js', 'console.js'),
     moduleManager: path.resolve(__dirname, 'src/js', 'moduleManager.js'),
     itemManager: path.resolve(__dirname, 'src/js', 'itemManager.js'),
     qcList: path.resolve(__dirname, 'src/js', 'qcList.js'),
@@ -24,7 +27,7 @@ module.exports = {
     extensions: [".js", ".css", ".json"],
     alias: {} //配置别名可以加快webpack查找模块的速度
   },
-  plugins: [// 多入口的html文件用chunks这个参数来区分
+  plugins: [//多入口的html文件用chunks这个参数来区分
     new HtmlWebpackPlugin({
       title: 'index',
       template: path.resolve(__dirname, 'src/html', 'index.html'),
@@ -42,7 +45,7 @@ module.exports = {
       title: 'console.html',
       template: path.resolve(__dirname, 'src/html', 'console.html'),
       filename: 'console.html',
-      chunks: ['index', 'vendor', 'common'],
+      chunks: ['console', 'vendor', 'common'],
       hash: true, //防止缓存
       inject: true,
       minify: {
@@ -81,7 +84,7 @@ module.exports = {
       title: 'login.html',
       template: path.resolve(__dirname, 'src/html', 'login.html'),
       filename: 'login.html',
-      chunks: ['index', 'vendor', 'common'],
+      chunks: ['login', 'vendor', 'common'],
       hash: true, //防止缓存
       inject: true,
       minify: {
@@ -107,7 +110,7 @@ module.exports = {
       title: 'qcScore.html',
       template: path.resolve(__dirname, 'src/html', 'qcScore.html'),
       filename: 'qcScore.html',
-      chunks: ['index', 'vendor', 'common'],
+      chunks: ['index', 'vendor', 'common','qcScore'],
       hash: true, //防止缓存
       inject: true,
       minify: {
@@ -200,16 +203,7 @@ module.exports = {
         use: [{
             loader: MiniCssExtractPlugin.loader
           },
-          {
-            loader: 'css-loader',
-            options: {
-              modules: true,
-              getLocalIdent: (context, localIdentName, localName, options) =>{
-                  return localName
-              }
-          }
-          
-          }
+          'css-loader'
         ]
       },
       {
@@ -252,7 +246,7 @@ module.exports = {
       '/': proxyHost
     },
     hot: true,
-    // openPage:'index.html'
-    openPage:'moduleManager.html'
+    openPage:'index.html'
+    
   }
 }