登录页，首页配色

src/dashoo.cn/frontend_web/src/assets/styles/base/variables.scss

@@ -58,10 +58,10 @@ $white-darker:              #F0F1F3;
 $main-lighter:              #515e6a;
 $main-light:                #3e4c59;
 $main-dark:                 #283643;
-$main:                      #2B3B49;
-$main-darker:               #24313c;
-// $main:                      #001529;
-// $main-darker:               #002140;
+// $main:                      #2b3b49;
+// $main-darker:               #24313c;
+$main:                      #FFFFFF;
+$main-darker:               #BBBBBB;
 
 // - Brand color
 $primary:                   #20A0FF;
@@ -115,10 +115,10 @@ $header-height:                   2rem;
 $header-sub-width:                5rem;
 
 // - Sidebar
-$sidebar-width:                   10rem;
-$sidebar-min-width:               2.25rem;
-// $sidebar-width:                   12.5rem;  //大港
-// $sidebar-min-width:               3.5rem;
+// $sidebar-width:                   10rem;
+// $sidebar-min-width:               2.25rem;
+$sidebar-width:                   12.5rem;  //大港
+$sidebar-min-width:               3.5rem;
 $sidebar-sub-width:               5rem;
 $sidebar-item-height:             $sidebar-min-width;
 $sidebar-enable-arrow:            true;

src/dashoo.cn/frontend_web/src/assets/styles/modules/header.scss

@@ -4,9 +4,9 @@
 .header {
   display: flex;
   //padding: 0 .5rem;
-  padding: 0 0;
   //background-color:#2b3b49;
-  background-color:white;
+  padding: 0 0; 
+  background-color:#004EA2;
 
   > .brand {
     margin: 0 1rem 0 0;

src/dashoo.cn/frontend_web/src/components/Headbar.vue

@@ -1,23 +1,22 @@
 <template>
-  <header class="header">
-    <div v-if="!isMenuHidden" class="brand" style="background-color:#2B3B49;padding-top:7px;padding-left:20px;width:140px;">
-      <router-link to="/">
-        <img src="../assets/img/logo.png" style="height:35px;" />
-      </router-link>
+  <header class="header" style="background-color:#004EA2;">
+    <div v-if="!isMenuHidden" class="brand"
+      style="background-color:#004EA2;padding-top:7px;padding-left:20px;width:180px;">
+      <img src="../assets/img/logo.png" style="height:35px; margin-left: 20px" />
     </div>
-    <div v-if="isMenuHidden" class="brand" style="height:35px;">
-      <router-link to="/">
-        <img src="../assets/img/title.png" style="height:55px;" />
-      </router-link>
+
+    <div v-if="isMenuHidden" class="brand" style="background-color:#fff;padding-top:7px;width:56px;">
+      <img src="../assets/img/title.png" style="height:35px;" />
     </div>
-    <nav class="toolbar" style="margin-top: 3px;">
+
+    <nav class="toolbar" style="margin-top: 3px;background-color:#004EA2;">
       <img src="../assets/img/title_biobank.png" style="height:35px;padding-top:5px;" />
       <div style="margin: 10px 0px 0px 20px;"></div>
       <el-tag type="text" size="mini" style="margin-top:12px">{{department}}</el-tag>
 
-      <ul class="list" style="background: #FFF;color: blue">
-        <li class="item" style="background: #FFF">
-          <a style="font-size: 90%;background: #FFF;color: #1D8CE0; font-weight: bold" href="#" v-if="authUser">
+      <ul class="list" style="background: #004EA2;color: blue">
+        <li class="item" style="background: #004EA2">
+          <a style="font-size: 90%;background: #004EA2;color: white; font-weight: bold" href="#" v-if="authUser">
             <span style="margin-right: 20px;">
               <el-button type="text" icon="icon icon-shrink" v-if="fullscreen" @click="handleFullScreen"></el-button>
               <el-button type="text" icon="icon icon-enlarge" v-if="!fullscreen" @click="handleFullScreen"></el-button>
@@ -25,16 +24,16 @@
             您好, {{ authUser.Profile.Realname }}
             <img v-if="authUser.Profile.Photo" style="background: #FFF; border: hidden"
               :src="'http://'+authUser.Profile.Host+authUser.Profile.Photo" class="avatar">
-            <img v-else class="avatar" style="background: #FFF; border: hidden" src="~/assets/img/avatar.svg"
+            <img v-else class="avatar" style="background: white; border: hidden" src="~/assets/img/avatar.svg"
               :alt="authUser.name">
           </a>
-          <ul class="list" style="text-align: center;background: #FFF;">
+          <ul class="list" style="text-align: center;background: #004EA2;">
             <li class="item">
-              <router-link to="/system/usersetting" style="color: #1F2D3D; font-weight: bold">账户设置</router-link>
+              <router-link to="/system/usersetting" style="color: white; font-weight: bold">账户设置</router-link>
             </li>
             <li class="divider" style="color: ActiveBorder;"></li>
             <li class="item">
-              <a href="#" style="color: #1F2D3D; font-weight: bold" @click.prevent="logout">注销登录</a>
+              <a href="#" style="color: white; font-weight: bold" @click.prevent="logout">注销登录</a>
             </li>
           </ul>
         </li>
@@ -65,7 +64,8 @@
         department: '基础版'
       }
     },
-    created() {},
+    created() {
+    },
     methods: {
       handleFullScreen() {
         let element = document.documentElement;

src/dashoo.cn/frontend_web/src/components/Headbar2.vue

@@ -1,45 +1,48 @@
 <template>
-  <header class="header">
-    <h1 class="brand" style="text-align:center;margin-left:10px;margin-right:1px;">
+  <header class="header" style="background-color:#004EA2;">
+    <!-- <h1 class="brand" style="text-align:center;margin-left:10px;margin-right:1px;">
       <router-link to="/">
         <img src="~/assets/img/logo.png" style="height:32px;">
       </router-link>
-    </h1>
-    <!-- <h1 class="brand" style="text-align:center;margin-left:10px;margin-right:1px;margin-top:10px;">
-      <router-link to="/indexlims">
-        <img src="/img/logo_dagang.png" style="height:26px;">
-      </router-link>
     </h1> -->
-    <nav class="toolbar">
+    <div v-if="!isMenuHidden" class="brand" style="background-color:#004EA2;padding-top:7px;padding-left:20px;width:180px;">
+      <router-link to="/">
+        <img src="../assets/img/logo_dagang2.png" style="height:35px;" />
+      </router-link>
+    </div>
+    <div v-if="isMenuHidden" class="brand" style="background-color:#EAEDF1;padding-top:7px;padding-left:20px;width:36px;">
+      <router-link to="/">
+        <img src="../assets/img/title.png" style="height:35px;" />
+      </router-link>
+    </div>
+    <nav class="toolbar" style="margin-top: 3px;background-color:#004EA2;">
+      <img src="../assets/img/title_biobank.png" style="height:35px;padding-top:5px;" />
       <div style="margin: 10px 0px 0px 20px;"></div>
-      <!--<menu-list :items="header.menus"/>
-      <input type="text" class="headerseach" @keydown="show($event)"  v-model="sampcode" placeholder="样本搜索" >
-      <span class="headerseachclose" :class="{ headerclosehavetxt: sampcode != ''}" onclick="headclearsearch()">x</span>-->
-      <input type="text" class="headerseach" @keydown="show($event)" v-model="sampcode" placeholder="样本搜索">
-      <span class="headerseachclose" :class="{ headerclosehavetxt: sampcode != ''}" @click="headclearsearch()"></span>
-      <ul class="list">
-        <li class="item">
-          <a style="font-size: 90%" href="#" v-if="authUser">
+      <el-tag type="text" size="mini" style="margin-top:12px">{{department}}</el-tag>
+
+      <ul class="list" style="background: #004EA2;color: blue">
+        <li class="item" style="background: #004EA2">
+          <a style="font-size: 90%;background: #004EA2;color: white; font-weight: bold" href="#" v-if="authUser">
             <span style="margin-right: 20px;">
               <el-button type="text" icon="icon icon-shrink" v-if="fullscreen" @click="handleFullScreen"></el-button>
               <el-button type="text" icon="icon icon-enlarge" v-if="!fullscreen" @click="handleFullScreen"></el-button>
             </span>
-            您好, {{department}}{{ authUser.Profile.Realname }}
-            <img v-if="authUser.Profile.Photo" :src="'http://'+authUser.Profile.Host+authUser.Profile.Photo"
-              class="avatar">
-            <img v-else class="avatar" src="~/assets/img/avatar.svg" :alt="authUser.name">
+            您好, {{ authUser.Profile.Realname }}
+            <img v-if="authUser.Profile.Photo" style="background: #FFF; border: hidden" :src="'http://'+authUser.Profile.Host+authUser.Profile.Photo" class="avatar">
+            <img v-else class="avatar" style="background: white; border: hidden" src="~/assets/img/avatar.svg" :alt="authUser.name">
           </a>
-          <ul class="list" style="text-align: center;">
+          <ul class="list" style="text-align: center;background: #004EA2;">
             <li class="item">
-              <router-link to="/system/usersetting">账户设置</router-link>
+              <router-link to="/system/usersetting" style="color: white; font-weight: bold">账户设置</router-link>
             </li>
-            <li class="divider"></li>
+            <li class="divider" style="color: ActiveBorder;"></li>
             <li class="item">
-              <a href="#" @click.prevent="logout">注销登录</a>
+              <a href="#" style="color: white; font-weight: bold" @click.prevent="logout">注销登录</a>
             </li>
           </ul>
         </li>
       </ul>
+
     </nav>
   </header>
 </template>
@@ -59,103 +62,73 @@
     },
     data() {
       return {
+
         fullscreen: false,
         sampcode: '',
         department: ''
       }
     },
-    created() {},
+    created () {
+      this.getdepartment()
+    },
     methods: {
-      show: function (ev) {
-        let _this = this
-        if (process.env.appclient == 'lims') {
-          if (ev.keyCode === 13) {
-            if (_this.sampcode !== '') {
-              _this.$axios.get('testsample/judgesampleexist/' + _this.sampcode, {})
-                .then(res => {
-                  if (res.data.items === true) {
-                    _this.$router.push({
-                      path: `/positivereport/detectionresult?SampleCode=${_this.sampcode}`,
-                    })
-                  } else {
-                    _this.$message({
-                      type: 'warning',
-                      message: '该样本编码不存在！'
-                    })
-                  }
-                })
-                .catch(_ => {
-                  // handle error
-                  _this.$message({
-                    type: 'warning',
-                    message: '查询故障！请检查网络是否正常！'
-                  })
-                })
+       handleFullScreen(){
+                let element = document.documentElement;
+                if (this.fullscreen) {
+                    if (document.exitFullscreen) {
+                        document.exitFullscreen();
+                    } else if (document.webkitCancelFullScreen) {
+                        document.webkitCancelFullScreen();
+                    } else if (document.mozCancelFullScreen) {
+                        document.mozCancelFullScreen();
+                    } else if (document.msExitFullscreen) {
+                        document.msExitFullscreen();
+                    }
+                } else {
+                    if (element.requestFullscreen) {
+                        element.requestFullscreen();
+                    } else if (element.webkitRequestFullScreen) {
+                        element.webkitRequestFullScreen();
+                    } else if (element.mozRequestFullScreen) {
+                        element.mozRequestFullScreen();
+                    } else if (element.msRequestFullscreen) {
+                        // IE11
+                        element.msRequestFullscreen();
+                    }
+                }
+                this.fullscreen = !this.fullscreen;
+            },
+     getdepartment(){
+       this.department = '欢迎使用'
+         /*if (this.authUser.Profile.DepartmentId == "100000054") {
+          this.department = '欢迎使用'
+        } else{
+           this.$axios.get('/limsentrust/getshow')
+          .then(res => {
+            if(res.data.items === ''){
+              this.department = '欢迎使用'
+            } else if (res.data.items === 'yx') {
+              this.department = '宇信公司'
+            } else if  (res.data.items === 'tjz') {
+              this.department = '特检站'
+            } else if  (res.data.items === 'jlny') {
+              this.department = '计量能源站'
+            }else if  (res.data.items === 'gcjd') {
+              this.department = '工程监督中心'
+            }else if  (res.data.items === 'zj') {
+              this.department = '质检中心'
+            }else if  (res.data.items === 'zj') {
+              this.department = '物资商品检验所'
             }
-          }
-        } else {
-          if (ev.keyCode === 13) {
-            if (_this.sampcode !== '') {
-              _this.$axios.get('sampleoperation/getstationbycode?code=' + _this.sampcode, {})
-                .then(res => {
-                  if (res.data.code === 0) {
-                    let val = res.data.item
-                    let stationstr =
-                      `${val.ShelfX};${val.ShelfY};${val.BoxX};${val.BoxY};${val.Position};${val.Id}`
-                    _this.$router.push({
-                      path: `/equipment/${val.EquipmentId}/manage`,
-                      query: {
-                        station: stationstr
-                      }
-                    })
-                  } else {
-                    _this.$message({
-                      type: 'warning',
-                      message: res.data.message
-                    })
-                  }
-                })
-                .catch(_ => {
-                  // handle error
-                  _this.$message({
-                    type: 'warning',
-                    message: '查询故障！请检查网络是否正常！'
-                  })
-                })
-            }
-          }
-        }
-      },
+          })
+          .catch(err => {
+            console.error(err)
+          })
+        }*/
+       },
       headclearsearch() {
         this.sampcode = ''
-      },
-
-      handleFullScreen() {
-        let element = document.documentElement;
-        if (this.fullscreen) {
-          if (document.exitFullscreen) {
-            document.exitFullscreen();
-          } else if (document.webkitCancelFullScreen) {
-            document.webkitCancelFullScreen();
-          } else if (document.mozCancelFullScreen) {
-            document.mozCancelFullScreen();
-          } else if (document.msExitFullscreen) {
-            document.msExitFullscreen();
-          }
-        } else {
-          if (element.requestFullscreen) {
-            element.requestFullscreen();
-          } else if (element.webkitRequestFullScreen) {
-            element.webkitRequestFullScreen();
-          } else if (element.mozRequestFullScreen) {
-            element.mozRequestFullScreen();
-          } else if (element.msRequestFullscreen) {
-            // IE11
-            element.msRequestFullscreen();
-          }
-        }
-        this.fullscreen = !this.fullscreen;
-      },
+      }
     }
   })
   export default class Headbar extends Vue {

src/dashoo.cn/frontend_web/src/components/MenuList.vue

@@ -32,10 +32,6 @@
     },
     methods: {
       isActive (menu) {
-        // console.info("1:"+menu.url)
-        // console.info("2:"+this.$route.name)
-        // console.info("3:"+this.$route.path)
-        // console.info(this.$route.params)
         const objectEqual = (a, b) => (Object.keys(a).length !== Object.keys(b).length) || Object.keys(a).every(key => String(a[key]) === String(b[key]))
         const routeEqual = item => item.url === this.$route.path && (!item.params || objectEqual(item.params, this.$route.params))
         return routeEqual(menu) || (menu.children && menu.children.length && menu.children.some(item => routeEqual(item)))

src/dashoo.cn/frontend_web/src/components/MenuList2.vue

@@ -0,0 +1,45 @@
+<template>
+  <ul class="list">
+    <template v-for="item in items">
+      <li class="divider" v-if="item.divider" :key="item"></li>
+      <li class="title"  v-else-if="item.title" :key="item">{{ item.title }}</li>
+      <li class="item"   v-else :class="{ active: activeClass && isActive(item) }" :key="item">
+        <nuxt-link :to="item.url" onmouseover="onovermenu(this)" onmouseout="onoutmenu(this)" style="font-weight:800" :class="'icon-before icon-' + item.icon">{{ item.name }}</nuxt-link>
+        <ul class="list"  v-if="item.children" style="padding-left: 35px; width: 100px">
+          <template v-for="sub in item.children">
+            <li class="divider" style="font-weight:800" v-if="sub.divider && !sub.children" :key="sub"></li>
+            <li class="item"  v-if="!sub.children" :class="{ active: activeClass && isActive(sub) }" :key="sub"><nuxt-link :to="sub.url">{{ sub.name }}</nuxt-link></li>
+            <li class="item"  v-if="sub.children" :class="{ active: activeClass && isActive(sub) }" :key="sub"><nuxt-link :to="sub.url">{{ sub.name }}</nuxt-link></li>
+            <ul class="item"  v-if="sub.children" style="padding-left: 25px; width: 100px" :key="sub">
+              <template v-for="sub2 in sub.children">
+                <li class="divider" style="font-weight:800" v-if="sub2.divider" :key="sub2"></li>
+                <li class="item" style="font-size: 14px;list-style-type:none;" s v-else :class="{ active: activeClass && isActive(sub) }" ><nuxt-link :to="sub2.url">{{ sub2.name }}</nuxt-link></li>
+              </template>
+            </ul>
+          </template>
+        </ul>
+      </li>
+    </template>
+  </ul>
+</template>
+
+<script>
+  export default {
+    name: 'MenuList',
+    props: {
+      items: Array,
+      activeClass: Boolean
+    },
+    methods: {
+      isActive (menu) {
+        // console.info("1:"+menu.url)
+        // console.info("2:"+this.$route.name)
+        // console.info("3:"+this.$route.path)
+        // console.info(this.$route.params)
+        const objectEqual = (a, b) => (Object.keys(a).length !== Object.keys(b).length) || Object.keys(a).every(key => String(a[key]) === String(b[key]))
+        const routeEqual = item => item.url === this.$route.path && (!item.params || objectEqual(item.params, this.$route.params))
+        return routeEqual(menu) || (menu.children && menu.children.length && menu.children.some(item => routeEqual(item)))
+      }
+    }
+  }
+</script>

src/dashoo.cn/frontend_web/src/components/preoperation.vue

@@ -1,227 +0,0 @@
-<template>
-  <div>
-    <el-dialog title="选择预录入" :visible.sync="visible" top="5vh" width="90%">
-      <el-form :model="form" label-width="90px">
-        <el-row>
-          <el-col :span="8">
-            <el-form-item label="样本条码">
-              <el-input v-model="form.barcode" placeholder="请输入样本条码"></el-input>
-            </el-form-item>
-            <el-form-item label="录入人员">
-              <el-input v-model="form.operator" placeholder="请输入录入人"></el-input>
-            </el-form-item>
-            <el-form-item label="样本类型">
-              <el-select v-model="form.sampletype" clearable style="width:100%" placeholder="请选择">
-                <el-option v-for="item in model.typelist"
-                  :label="item.label"
-                  :value="item.value" :key="item">
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="样本编码">
-              <el-input v-model="form.number" placeholder="请输入样本编码"></el-input>
-            </el-form-item>
-            <el-form-item label="开始日期">
-              <el-date-picker style="width: 100%"
-                v-model="form.startdate"
-                type="date"
-                :clearable="false"
-                placeholder="请输入开始日期"
-                :picker-options="pickerOptions0">
-              </el-date-picker>
-            </el-form-item>
-            <el-form-item label="组织器官">
-              <el-cascader :options="model.cascade" style="width:100%" :props="sampleorganprops"
-              change-on-select :show-all-levels="false" v-model="selectedorgan"
-               placeholder="请选择" @change="choose"></el-cascader>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="样本名称">
-              <el-input v-model="form.name" placeholder="请输入名称"></el-input>
-            </el-form-item>
-            <el-form-item label="结束日期">
-              <el-date-picker style="width: 100%"
-                v-model="form.enddate"
-                type="date"
-                :clearable="false"
-                placeholder="请输入结束日期"
-                :picker-options="pickerOptions0">
-              </el-date-picker>
-            </el-form-item>
-            <el-form-item label="取材部位">
-              <el-select v-model="form.samplingsite" clearable style="width:100%" placeholder="请选择">
-                <el-option v-for="item in ssoption"
-                  :label="item.label"
-                  :value="item.value" :key="item">
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-      <div style="margin:-15px -5px 34px 0">
-        <el-pagination style="float: right;margin-top:0px;margin-bottom:2px"
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          layout="prev, pager, next"
-          :page-size="pagesize"
-          :total="currentItemCount">
-        </el-pagination>
-        <el-button style="float: right;margin:3px 15px 0 0;" type="primary" class="el-button--small" @click="seachdata">查询</el-button>
-      </div>
-      <el-table :data="sampleyulurulist" :stripe="true">
-        <el-table-column label="操作" width="80">
-          <template slot-scope="scope">
-            <el-button size="small" @click="handleselect(scope.row)" type="text" title="选择"><i class="icon icon-checkmark"></i> 选择</el-button>
-          </template>
-        </el-table-column>
-        <el-table-column prop="BarCode" label="样本条码" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="SampleCode" label="样本编码" width="120" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="SampleTypeName" label="样本类型" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="Capacity" label="可用容量" show-overflow-tooltip>
-          <template slot-scope="scope">
-            {{scope.row.Capacity}} {{scope.row.Unit}}
-          </template>
-        </el-table-column>
-        <el-table-column prop="SamplingOrganName" label="组织器官" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="SamplingSiteName" label="取材部位" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="SourceName" label="样本来源" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column prop="InnerCode" label="样本内码" show-overflow-tooltip>
-        </el-table-column>
-        <el-table-column label="有效日期" show-overflow-tooltip>
-          <template slot-scope="scope">
-            {{jstimehandle(scope.row.ValidityDate) === '5000-01-01' ? '永久' : jstimehandle(scope.row.ValidityDate) === '0001-01-01' ? '-----' : jstimehandle(scope.row.ValidityDate)}}
-          </template>
-        </el-table-column>
-        <el-table-column label="接收日期" show-overflow-tooltip>
-          <template slot-scope="scope">
-            {{jstimehandle(scope.row.ReceiveDate) === '5000-01-01' ? '永久' : jstimehandle(scope.row.ReceiveDate) === '0001-01-01' ? '-----' : jstimehandle(scope.row.ReceiveDate)}}
-          </template>
-        </el-table-column>
-      </el-table>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-  import {
-    mapGetters
-  } from 'vuex'
-  export default {
-    name: 'PreoperationDialog',
-    props: {
-      visible: {
-        type: Boolean,
-        default: false
-      }
-    },
-    created () {
-    },
-    computed: {
-      ...mapGetters({
-        model: 'sampleModel',
-        authUser: 'authUser'
-      })
-    },
-    watch: {
-      visible(val) {
-        this.selfVisible = val
-        if (this.visible) {
-          this.initData()
-          this.createoptions
-        }
-      },
-      selfVisible(val) {
-        this.$emit('update:visible', val)
-      }
-    },
-    data() {
-      return {
-        formLabelWidth: 120,
-        form: {
-          barcode: '',
-          operator: '',
-          sampletype: '',
-          sampleorgan: '',
-          number: '',
-          startdate: '',
-          enddate: '',
-          name: '',
-          samplingsite: ''
-        },
-        sampleyulurulist: [],
-        organdialog: '',
-        sampletype: '',
-        pickerOptions0: { //  日期选择
-          disabledDate(time) {
-            return time.getTime() < Date.now() - 8.64e7
-          }
-        },
-        currentPage: 1, // 分页
-        pagesize: 7,
-        currentItemCount: 0,
-        sampleorganprops: { // 级联
-          value: 'id',
-          label: 'name',
-          children: 'children'
-        },
-        selectedorgan: [],
-        ssoption: [],
-        selfVisible: this.visible // 避免vue双向绑定警告
-      }
-    },
-    methods: {
-      initData () {
-        let _this = this
-        // request
-        const params = { _currentPage: this.currentPage, _size: this.pagesize, keyword: this.keyword }
-        _this.$services.sampleinput.get('getlistajax', { params })
-          .then(res => {
-            _this.sampleyulurulist = res.data.items
-            _this.currentItemCount = res.data.currentItemCount
-          })
-          .catch(err => {
-            // handle error
-            console.error(err)
-          })
-      },
-      seachdata () {
-        this.currentPage = 1
-        this.initData()
-      },
-      handleCurrentChange (value) {
-        this.currentPage = value
-        this.initData()
-      },
-      // 组织器官和取材部位的连接
-      choose(value) {
-        this.ssoption = []
-        for (var i = 0; i < this.model.organlist.length; i++) {
-          if (this.model.organlist[i].TNodeParent === value[value.length - 1]) {
-            this.ssoption.push({label: this.model.organlist[i].Name, value: this.model.organlist[i].Code})
-          }
-        }
-        this.form.samplingsite = this.ssoption[0].value
-      },
-      jstimehandle (val) {
-        return val.substring(0, 10)
-      },
-      handleselect (val) {
-        this.$emit('close', val)
-        this.selfVisible = false
-      }
-    }
-  }
-</script>
-
-<style>
-</style>

src/dashoo.cn/frontend_web/src/components/sidebar.vue

@@ -1,11 +1,45 @@
 <template>
-  <aside class="sidebar" id="aside" :class="{ collapse: isMenuHidden }">
-    <nav class="menu" style="overflow:hidden;position: relative;">
-      <menu-list :items="menus" active-class />
-    </nav>
+  <aside class="sidebar-container sidebar" id="aside" :class="{ collapse: isMenuHidden }">
+    <el-scrollbar style="height: calc(100vh - 75px); overflow: hidden;" wrap-class="scrollbar-wrapper">
+      <el-menu :collapse="isCollapse" :router="true" default-active="/" :collapse-transition="false">
+        <template v-for="(item, index) in menus">
+          <el-menu-item v-if="!item.children" :index="item.url" :key="item.id">
+            <i :class="'icon-before icon-'+item.icon" style="padding-top: 5px; margin-right: 15px;"></i>
+            <span slot="title">{{ item.name }}</span>
+          </el-menu-item>
+
+          <el-submenu v-if="item.children" :index="item.name" :key="item.id" class="">
+            <template slot="title">
+              <i :class="'icon-before icon-'+item.icon" style="padding-top: 5px; margin-right: 15px;"></i>
+              <span slot="title">{{ item.name }}</span>
+            </template>
+            <template v-if="item.children" v-for="sub in item.children">
+              <el-menu-item v-if="!sub.children" :index="sub.url" :key="sub.id">
+                <i style="padding-top: 5px; margin-right: 15px;"></i>
+                <span slot="title">{{ sub.name }}</span>
+              </el-menu-item>
+              <el-submenu v-if="sub.children" :index="sub.name" :key="sub.id">
+                <template slot="title">
+                  <i :class="'icon-before icon-'+sub.icon" style="padding-top: 5px; margin-right: 15px;"></i>
+                  <span slot="title">{{ sub.name }}</span>
+                </template>
+                <el-menu-item v-for="sub2 in sub.children" :index="sub2.url" :key="sub2.id">
+                  <span slot="title">{{ sub2.name }}</span>
+                </el-menu-item>
+              </el-submenu>
+            </template>
+
+          </el-submenu>
+        </template>
+      </el-menu>
+    </el-scrollbar>
+
     <footer class="footer">
-      <a class="toggle icon-before icon-circle-left" title="Toggle navigation menu" @click="toggleMenu"></a>
-      <router-link class="copyright" :to="{ name: 'about' }"> </router-link>
+      <el-button size="mini" type="text" icon="icon-before icon-circle-right" circle v-if="isCollapse == true"
+        @click="floderMenu"></el-button>
+      <el-button size="mini" type="text" icon="icon-before icon-circle-left" circle v-if="isCollapse == false"
+        @click="floderMenu"></el-button>
+      <div v-if="!isCollapse" class="copyright">©大数华创</div>
     </footer>
   </aside>
 </template>
@@ -139,13 +173,246 @@
 
 </script>
 
-<style>
-  .test::-webkit-scrollbar {
-    opacity: 0.5;
+<style lang="scss">
+  // base color
+  $blue:#324157;
+  $light-blue:#3A71A8;
+  $red:#C03639;
+  $pink: #E65D6E;
+  $green: #30B08F;
+  $tiffany: #4AB7BD;
+  $yellow:#FEC171;
+  $panGreen: #30B08F;
+
+  //sidebar
+  /*$menuText:#bfcbd9;
+  $menuActiveText:#409EFF;
+  $subMenuActiveText:#f4f4f5; //https://github.com/ElemeFE/element/issues/12951*/
+
+  $menuBg:#E6F7FF;
+  $menuHover:#ECF5FF;
+
+  $subMenuBg:#E6F7FF;
+  $subMenuHover:#ECF5FF;
+
+  $sideBarWidth: 200px;
+
+  // 侧边栏 Sidebar container
+  .sidebar-container {
+    /*transition: width 0.28s;
+    width: $sideBarWidth !important;
+    height: 100%;
+    position: fixed;
+    font-size: 0px;
+    top: 0;
+    bottom: 0;
+    left: 0;*/
+    z-index: 1001;
+    overflow: hidden;
+
+    //reset element-ui css
+    .horizontal-collapse-transition {
+      transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
+    }
+
+    .scrollbar-wrapper {
+      overflow-x: hidden !important;
+
+      .el-scrollbar__view {
+        height: 100%;
+      }
+    }
+
+    .el-scrollbar__bar.is-vertical {
+      right: 0px;
+    }
+
+    .el-scrollbar {
+      height: 100%;
+    }
+
+    &.has-logo {
+      .el-scrollbar {
+        height: calc(100% - 50px);
+      }
+    }
+
+    .is-horizontal {
+      display: none;
+    }
+
+    a {
+      display: inline-block;
+      width: 100%;
+      overflow: hidden;
+    }
+
+    .svg-icon {
+      margin-right: 16px;
+    }
+
+    .el-menu {
+      border: none;
+      height: 100%;
+      width: 100% !important;
+    }
+
+    // menu hover
+    .submenu-title-noDropdown,
+    .el-submenu__title {
+      &:hover {
+        background-color: $menuHover !important;
+      }
+    }
+
+    //self-defined
+    .el-menu-item,
+    .el-submenu__title {
+      height: 40px;
+      line-height: 40px;
+    }
+
+    .is-active>.el-submenu__title {
+      /*color: $subMenuActiveText !important;*/
+    }
+
+    & .nest-menu .el-submenu>.el-submenu__title,
+    & .el-submenu .el-menu-item {
+      min-width: $sideBarWidth !important;
+      background-color: $subMenuBg !important;
+
+      &:hover {
+        background-color: $subMenuHover !important;
+      }
+    }
+  }
+
+  .hideSidebar {
+    .sidebar-container {
+      width: 54px !important;
+    }
+
+    .main-container {
+      margin-left: 54px;
+    }
+
+    .svg-icon {
+      margin-right: 0px;
+    }
+
+    .submenu-title-noDropdown {
+      padding: 0 !important;
+      position: relative;
+
+      .el-tooltip {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 20px;
+        }
+      }
+    }
+
+    .el-submenu {
+      overflow: hidden;
+
+      &>.el-submenu__title {
+        padding: 0 !important;
+
+        .svg-icon {
+          margin-left: 20px;
+        }
+
+        .el-submenu__icon-arrow {
+          display: none;
+        }
+      }
+    }
+
+    .el-menu--collapse {
+      .el-submenu {
+        &>.el-submenu__title {
+          &>span {
+            height: 0;
+            width: 0;
+            overflow: hidden;
+            visibility: hidden;
+            display: inline-block;
+          }
+        }
+      }
+    }
+  }
+
+  .el-menu--collapse .el-menu .el-submenu {
+    min-width: $sideBarWidth !important;
   }
 
-  .el-menu-vertical-demo:not(.el-menu--collapse) {
-    width: 200px;
+  // 适配移动端, Mobile responsive
+  .mobile {
+    .main-container {
+      margin-left: 0px;
+    }
+
+    .sidebar-container {
+      transition: transform .28s;
+      width: $sideBarWidth !important;
+    }
+
+    &.hideSidebar {
+      .sidebar-container {
+        pointer-events: none;
+        transition-duration: 0.3s;
+        transform: translate3d(-$sideBarWidth, 0, 0);
+      }
+    }
+  }
+
+  .withoutAnimation {
+
+    .main-container,
+    .sidebar-container {
+      transition: none;
+    }
+  }
+
+  // when menu collapsed
+  .el-menu--vertical {
+    &>.el-menu {
+      .svg-icon {
+        margin-right: 16px;
+      }
+    }
+
+    .nest-menu .el-submenu>.el-submenu__title,
+    .el-menu-item {
+      height: 30px;
+      line-height: 30px;
+
+      &:hover {
+        // you can use $subMenuHover
+        background-color: $menuHover !important;
+      }
+    }
+
+    // the scroll bar appears when the subMenu is too long
+    >.el-menu--popup {
+      max-height: 100vh;
+      overflow-y: auto;
+
+      &::-webkit-scrollbar-track-piece {
+        background: #d3dce6;
+      }
+
+      &::-webkit-scrollbar {
+        width: 6px;
+      }
+
+      &::-webkit-scrollbar-thumb {
+        background: #99a9bf;
+        border-radius: 20px;
+      }
+    }
   }
 
 </style>

src/dashoo.cn/frontend_web/src/components/sidebar1.vue

@@ -1,181 +0,0 @@
-<template>
-  <aside class="sidebar" id="aside" :class="{ collapse: isMenuHidden }">
-    <div style="height: calc(100vh - 75px); overflow-y: auto; overflow-x: hidden" class="test">
-    <el-menu
-      :collapse="isCollapse"
-      class="el-menu-vertical-demo"
-      :router="true"
-      default-active="/indexlims"
-      background-color="#001529"
-      text-color="#fff"
-      active-text-color="#1890FF"
-      :collapse-transition="false"
-    >
-      <template v-for="(item, index) in menus">
-        <el-menu-item v-if="!item.children" :index="item.url" :key="item" >
-          <i :class="'icon-before icon-'+item.icon" style="padding-top: 5px; margin-right: 10px;"></i>
-          <span slot="title">{{ item.name }}</span>
-        </el-menu-item>
-
-        <el-submenu v-if="item.children" :index="item.name" :key="item">
-          <template slot="title">
-            <i :class="'icon-before icon-'+item.icon" style="padding-top: 5px; margin-right: 10px;"></i>
-            <span slot="title">{{ item.name }}</span>
-          </template>
-          <template v-if="item.children" v-for="sub in item.children" >
-            <el-menu-item v-if="!sub.children"  :index="sub.url"  :key="sub">
-                <!--<i :class="'icon-before icon-'+sub.icon" style="padding-top: 5px; margin-right: 10px;"></i>-->
-                <span slot="title">{{ sub.name }}</span>
-            </el-menu-item>
-            <el-submenu v-if="sub.children" :index="sub.name" :key="sub">
-              <template slot="title">
-                <i :class="'icon-before icon-'+sub.icon" style="padding-top: 5px; margin-right: 10px;"></i>
-                <span slot="title">{{ sub.name }}</span>
-              </template>
-              <el-menu-item v-for="sub2 in sub.children" :index="sub2.url" :key="sub2">
-                <span slot="title">{{ sub2.name }}</span>
-              </el-menu-item>
-            </el-submenu>
-          </template>
-
-        </el-submenu>
-      </template>
-    </el-menu>
-    </div>
-    <footer class="footer">
-      <el-button size="mini" type="text" icon="icon-before icon-circle-right" circle v-if="isCollapse == true" @click="floderMenu"></el-button>
-      <el-button size="mini" type="text" icon="icon-before icon-circle-left" circle v-if="isCollapse == false" @click="floderMenu"></el-button>
-      <div v-if="!isCollapse" class="copyright">大数华创</div>
-    </footer>
-  </aside>
-</template>
-
-
-<script>
-import Vue from 'vue'
-import { mapActions } from 'vuex'
-import Component, {Getter, namespace } from 'class-component'
-import MenuList from '@/components/MenuList'
-
-const MenuGetter = namespace('menu', Getter)
-
-@Component({
-  components: {
-    MenuList
-  },
-  data() {
-    return {
-      isCollapse: false
-    }
-  },
-  methods: {
-    ...mapActions(['toggleMenu']),
-    toolfun_gettreejson(rows, idFieldName, pidFieldName, fileds) {
-      // 工具方法，将扁平数据转化成tree格式数据
-      function nodejsonexists(rows, ParentId) {
-        for (var i = 0; i < rows.length; i++) {
-          if (rows[i][idFieldName] === ParentId) {
-            return true
-          }
-        }
-        return false
-      }
-      let nodes = []
-      // get the top level nodes
-      for (let i = 0; i < rows.length; i++) {
-        let row = rows[i]
-        if (!nodejsonexists(rows, row[pidFieldName])) {
-          var data = {
-            id: row[idFieldName]
-          }
-          let arrFiled = fileds.split(',')
-          for (var j = 0; j < arrFiled.length; j++) {
-            if (arrFiled[j] !== idFieldName) {
-              data[arrFiled[j]] = row[arrFiled[j]]
-            }
-          }
-          nodes.push(data)
-        }
-      }
-      let toDo = []
-      for (let i = 0; i < nodes.length; i++) {
-        toDo.push(nodes[i])
-      }
-      while (toDo.length) {
-        let node = toDo.shift() // the parent node
-        // get the children nodes
-        for (let i = 0; i < rows.length; i++) {
-          let row = rows[i]
-          if (row[pidFieldName] === node.id) {
-            let child = {
-              id: row[idFieldName]
-            }
-            let arrFiled = fileds.split(',')
-            for (let j = 0; j < arrFiled.length; j++) {
-              if (arrFiled[j] !== idFieldName) {
-                child[arrFiled[j]] = row[arrFiled[j]]
-              }
-            }
-            if (node.children) {
-              node.children.push(child)
-            } else {
-              node.children = [child]
-            }
-            toDo.push(child)
-          }
-        }
-      }
-      return nodes
-    },
-    floderMenu() {
-      this.isCollapse = !this.isCollapse
-      this.toggleMenu()
-    }
-  },
-  watch: {
-    isMenuHidden: function (val) {
-      this.isCollapse = this.isMenuHidden
-    },
-  }
-})
-export default class Sidebar extends Vue {
-  @Getter isMenuHidden
-  @MenuGetter menus
-
-  async beforeMount () {
-    // 暂时从本地取菜单
-    let {data: menus1} = await this.$axios.get('users/getusermoduletree')
-    let menus = this.toolfun_gettreejson(menus1, 'id', 'pId', 'id,name,url,icon')
-    if (menus[0].id == '30000000') {
-      menus = menus[0].children
-    }
-    window.menusjson = menus
-    if (Array.isArray(menus) && menus.length) {
-      // 暂时菜单不加多语言处理
-      // this.$store.dispatch('menu/addAll', this.translateMenus(menus))
-      this.$store.dispatch('menu/addAll', menus)
-    }
-  }
-
-  //菜单多语言支持
-  translateMenus (menus) {
-    return menus.map((menu) => {
-      const subMenus = menu.children
-      if (Array.isArray(subMenus) && subMenus.length) {
-        this.translateMenus(subMenus)
-      }
-      menu.name = this.$t(menu.name + '' || '')
-      return menu
-    })
-  }
-}
-</script>
-
-<style>
-.test::-webkit-scrollbar {
-   opacity:0.5;
-}
-  .el-menu-vertical-demo:not(.el-menu--collapse) {
-    width: 200px;
-  }
-</style>

src/dashoo.cn/frontend_web/src/components/sidebar2.vue

@@ -0,0 +1,151 @@
+<template>
+  <aside class="sidebar" id="aside" :class="{ collapse: isMenuHidden }">
+    <nav class="menu" style="overflow:hidden;position: relative;">
+      <menu-list :items="menus" active-class />
+    </nav>
+    <footer class="footer">
+      <a class="toggle icon-before icon-circle-left" title="Toggle navigation menu" @click="toggleMenu"></a>
+      <router-link class="copyright" :to="{ name: 'about' }"> </router-link>
+    </footer>
+  </aside>
+</template>
+
+
+<script>
+  import Vue from 'vue'
+  import {
+    mapActions
+  } from 'vuex'
+  import Component, {
+    Getter,
+    namespace
+  } from 'class-component'
+  import MenuList from '@/components/MenuList'
+
+  const MenuGetter = namespace('menu', Getter)
+
+  @Component({
+    components: {
+      MenuList
+    },
+    data() {
+      return {
+        isCollapse: false
+      }
+    },
+    methods: {
+      ...mapActions(['toggleMenu']),
+      toolfun_gettreejson(rows, idFieldName, pidFieldName, fileds) {
+        // 工具方法，将扁平数据转化成tree格式数据
+        function nodejsonexists(rows, ParentId) {
+          for (var i = 0; i < rows.length; i++) {
+            if (rows[i][idFieldName] === ParentId) {
+              return true
+            }
+          }
+          return false
+        }
+        let nodes = []
+        // get the top level nodes
+        for (let i = 0; i < rows.length; i++) {
+          let row = rows[i]
+          if (!nodejsonexists(rows, row[pidFieldName])) {
+            var data = {
+              id: row[idFieldName]
+            }
+            let arrFiled = fileds.split(',')
+            for (var j = 0; j < arrFiled.length; j++) {
+              if (arrFiled[j] !== idFieldName) {
+                data[arrFiled[j]] = row[arrFiled[j]]
+              }
+            }
+            nodes.push(data)
+          }
+        }
+        let toDo = []
+        for (let i = 0; i < nodes.length; i++) {
+          toDo.push(nodes[i])
+        }
+        while (toDo.length) {
+          let node = toDo.shift() // the parent node
+          // get the children nodes
+          for (let i = 0; i < rows.length; i++) {
+            let row = rows[i]
+            if (row[pidFieldName] === node.id) {
+              let child = {
+                id: row[idFieldName]
+              }
+              let arrFiled = fileds.split(',')
+              for (let j = 0; j < arrFiled.length; j++) {
+                if (arrFiled[j] !== idFieldName) {
+                  child[arrFiled[j]] = row[arrFiled[j]]
+                }
+              }
+              if (node.children) {
+                node.children.push(child)
+              } else {
+                node.children = [child]
+              }
+              toDo.push(child)
+            }
+          }
+        }
+        return nodes
+      },
+      floderMenu() {
+        this.isCollapse = !this.isCollapse
+        this.toggleMenu()
+      }
+    },
+    watch: {
+      isMenuHidden: function (val) {
+        this.isCollapse = this.isMenuHidden
+      },
+    }
+  })
+  export default class Sidebar extends Vue {
+    @Getter isMenuHidden
+    @MenuGetter menus
+
+    async beforeMount() {
+      // 暂时从本地取菜单
+      let {
+        data: menus1
+      } = await this.$axios.get('users/getusermoduletree')
+      let menus = this.toolfun_gettreejson(menus1, 'id', 'pId', 'id,name,url,icon')
+      if (menus[0].id == '30000000') {
+        menus = menus[0].children
+      }
+      window.menusjson = menus
+      if (Array.isArray(menus) && menus.length) {
+        // 暂时菜单不加多语言处理
+        // this.$store.dispatch('menu/addAll', this.translateMenus(menus))
+        this.$store.dispatch('menu/addAll', menus)
+      }
+    }
+
+    //菜单多语言支持
+    translateMenus(menus) {
+      return menus.map((menu) => {
+        const subMenus = menu.children
+        if (Array.isArray(subMenus) && subMenus.length) {
+          this.translateMenus(subMenus)
+        }
+        menu.name = this.$t(menu.name + '' || '')
+        return menu
+      })
+    }
+  }
+
+</script>
+
+<style>
+  .test::-webkit-scrollbar {
+    opacity: 0.5;
+  }
+
+  .el-menu-vertical-demo:not(.el-menu--collapse) {
+    width: 200px;
+  }
+
+</style>

src/dashoo.cn/frontend_web/src/pages/index.vue

@@ -193,9 +193,13 @@
         EquipmentX: [],
         EquipmentY: [],
         tjdevicecolor: [
-          '#6A5ACD', '#B5C334', '#FCCE10', '#E87C25', '#27727B', '#FE8463', '#9BCA63', '#FAD860', '#F3A43B',
-          '#60C0DD', '#E87C25', '#27727B', '#FE8463'
+          '#F5B132', '#E56C5A', '#8B9F74', '#EEA7A3', '#E94648', '#918E90', '#bbc8e6', '#004EA2',
+          '#ffec47', '#c0a2c7', '#93ca76'
         ],
+        // tjdevicecolor: [
+        //   '#6A5ACD', '#B5C334', '#FCCE10', '#E87C25', '#27727B', '#FE8463', '#9BCA63', '#FAD860', '#F3A43B',
+        //   '#60C0DD', '#E87C25', '#27727B', '#FE8463'
+        // ],
         downloading: true,
         acc: '',
         RKList: [],
@@ -246,14 +250,12 @@
         this.$axios.get('users/getaccountinfo', {})
           .then(res => {
             _this.usertotal = res.data
-            console.log("----------------", res.data)
             _this.RKList = res.data.RKlist
             _this.CKList = res.data.CKlist
             _this.getBySampleType()
             _this.getByEquipment()
           })
           .catch(err => {
-            // handle error
             console.error(err)
           })
       },
@@ -276,13 +278,11 @@
             }
           })
           .catch(err => {
-            // handle error
             console.error(err)
           })
       },
-      //获取编码规则疾病类型
+      //获取疾病类型
       getDiseasesList() {
-        // 获取疾病类型
         let _this = this
         _this.$axios.get('/sampletype/diseaseslist', {})
           .then(res => {
@@ -333,7 +333,6 @@
             _this.drawPieChart()
           })
           .catch(err => {
-            // handle error
             _this.downloading = false
             console.error(err)
           })
@@ -355,8 +354,11 @@
             itemWidth: 20,
             data: this.sampleTitle
           },
-          color: ['#D1EEEE', '#FFE1FF', '#FFA500', '#6A5ACD', '#D1EEEE', '#CAE1FF', '#C0FF3E', '#1E90FF',
-            '#000080'
+          color: [
+            '#F5B132', '#E56C5A', '#8B9F74', '#EEA7A3', '#E94648', '#918E90', '#bbc8e6', '#004EA2',
+            '#ffec47', '#c0a2c7', '#93ca76'
+            // '#D1EEEE', '#FFE1FF', '#FFA500', '#6A5ACD', '#D1EEEE', '#CAE1FF', '#C0FF3E', '#1E90FF',
+            // '#000080'
           ],
           series: [{
             name: '样本类型',
@@ -381,8 +383,8 @@
               if (res.data[i].Name === '') {
                 res.data[i].Name = '未知'
               }
-              if (i > 12) {
-                _this.tjdevicecolor.push(_this.tjdevicecolor[i % 12])
+              if (i > 10) {
+                _this.tjdevicecolor.push(_this.tjdevicecolor[i % 11])
               }
               _this.EquipmentX.push(res.data[i].Name)
               _this.EquipmentY.push(res.data[i].Num)

src/dashoo.cn/frontend_web/src/pages/login.vue

@@ -40,7 +40,7 @@
       </el-row>
     </div>
 
-    <div class="footer">
+    <div class="footer" style="height:calc(100vh - 500px);">
       <footer>
         <el-row>
           <el-col :span="12">
@@ -230,7 +230,7 @@
   .footer {
     min-width: 1100px;
     width: 100%;
-    height:calc(100vh - 500px);
+    
   }
 
   .footer a {