<template>
  <div class="page_home">
    <!-- <div class="top">
      <div class="header">
        <img src="../../assets/images/hospital.png" alt />
        <van-dropdown-menu>
          <van-dropdown-item v-model="value" :options="hospitals" />
        </van-dropdown-menu>
      </div>
      <div class="search" @click="ToSearch()">
        <el-input
          placeholder=" 姓名 / 首拼 / 透析号"
          prefix-icon="el-icon-search"
          v-model="searchVal"
        ></el-input>
      </div>
      <div class="banner">
        <img src="../../assets/images/homebanner.jpg" alt />
      </div>
      <div class="myDesk">
        <h2>我的工作台</h2>
        <div class="list">
          <ul class="all">
            <li class="one">
              <img src="../../assets/images/m09.png" alt />
              <p @click="patientManagement()">病人管理</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m02.png" alt />
              <p>透析记录</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m04.png" alt />
              <p>质控分析</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m05.png" alt />
              <p>院感管理</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m06.png" alt />
              <p>微商城</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m07.png" alt />
              <p>微官网</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m08.png" alt />
              <p>医院二维码</p>
            </li>
            <li class="one">
              <img src="../../assets/images/m03.png" alt />
              <p>基础配置</p>
            </li>
          </ul>
        </div>
      </div>
    </div>

    <div class="tab">
      <div class="btn">
        <i class="iconfont icon-zhuye"></i>
        <span>首页</span>
      </div>
      <div class="btn">
        <i class="iconfont icon-wode"></i>
        <span>我的</span>
      </div>
    </div> -->
    <div class="page-home">
      <router-view />

      <van-tabbar class="tab" v-model="active">
        <router-link to="/homeIndex" class="link">
          <van-tabbar-item>
            <i class="iconfont icon-zhuye iconOne"></i>
            <div>首页</div>
          </van-tabbar-item>
        </router-link>
        <router-link to="/study">
          <van-tabbar-item>
            <i class="iconfont icon-jishiben iconOne"></i>
            <div>学习</div>
          </van-tabbar-item>
        </router-link>
        <router-link to="/service">
          <van-tabbar-item>
            <i class="iconfont icon-fuwu2 iconOne"></i>
            <div>服务</div>
          </van-tabbar-item>
        </router-link>
        <router-link to="/shop">
          <van-tabbar-item>
            <i class="iconfont icon-shangcheng iconOne"></i>
            <div>商城</div>
          </van-tabbar-item>
        </router-link>
        <router-link to="/my">
          <van-tabbar-item>
            <i class="iconfont icon-wode iconOne"></i>
            <div>我的</div>
          </van-tabbar-item>
        </router-link>
      </van-tabbar>
    </div>
  </div>
</template>

//
<script>
import { getAllOrgName } from "@/api/login/login";
export default {
  data() {
    return {
      active: 0,
      value: "",
      hospitals: [
        {
          text: "",
          value: 0
        }
      ],
      searchVal: ""
    };
  }
  // methods: {
  //   getAllOrgName(id) {
  //     getAllOrgName(id).then(response => {
  //       if (response.data.state === 1) {
  //         var org = response.data.data.org;
  //         const arr = [];
  //         org.map(item => {
  //           const obj = {};
  //           obj.text = item.org_name;
  //           obj.value = item.id;
  //           arr.push(obj);
  //         });
  //         this.hospitals = arr;
  //         for (let index = 0; index < this.hospitals.length; index++) {
  //           this.value = this.hospitals[index].value;
  //         }
  //         console.log("this.hospitals是什么", this.hospitals);
  //       }
  //     });
  //   },
  //   patientManagement() {
  //     var id = this.$route.query.id;
  //     this.$router.push("/patientmanagement?id=" + id);
  //   },
  //   ToSearch() {
  //     this.$router.push("/search");
  //   }
  // },
  // created() {
  //   const id = this.$route.query.id;
  //   this.getAllOrgName(id);
  // }
};
</script>

<style lang="scss">
.page_home {
  overflow: hidden;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  // background: rgba(188, 188, 188, 0.1);
  > div:first-child {
    flex: 1;
    overflow: auto;
  }
  .van-tabbar-item {
    height: 100%;
  }
  .van-tabbar-item__text {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
  }
  .van-tabbar {
    display: flex;
    justify-content: space-around;
    border-top: 1px solid #c5c5c5;
  }
  .iconOne {
    font-size: 1.25rem;
  }

  // .header {
  //   padding: 0 15px;
  //   box-sizing: border-box;
  //   height: 3.125rem;
  //   width: 100%;
  //   line-height: 3.125rem;
  //   img {
  //     float: left;
  //     width: 1.375rem;
  //     height: 1.375rem;
  //     margin-top: 0.625rem;
  //   }
  //   .van-dropdown-menu {
  //     width: 8.5rem;
  //     height: 3.125rem;
  //   }
  //   .van-dropdown-menu__item {
  //     flex: none;
  //   }
  //   .van-ellipsis {
  //     width: 6.25rem;
  //     height: 3.125rem;
  //     line-height: 3.125rem;
  //     font-size: 0.875rem;
  //     white-space: nowrap;
  //     text-overflow: ellipsis;
  //     overflow: hidden;
  //   }
  // }
  // .search {
  //   width: 21.5625rem;
  //   height: 2.125rem;
  //   padding: 0 15px;
  //   box-sizing: border-box;
  //   .el-input__inner {
  //     width: 21.5625rem;
  //     height: 2.125rem;
  //     border: none;
  //     background: rgba(244, 244, 244, 1);
  //     border-radius: 17px;
  //     color: #999999;
  //   }
  //   .el-input__prefix {
  //     margin-top: -0.125rem;
  //     color: #999999;
  //   }
  // }
  // .banner {
  //   overflow: hidden;
  //   margin-top: 1.25rem;
  //   // width: 21.4375rem;
  //   // height: 8.3125rem;
  //   // border-radius: 10px;
  //   width: 23.4375rem;
  //   height: 8.3125rem;
  //   // background: rgba(188, 188, 188, 0.1);
  //   // opacity: 0.2;
  //   img {
  //     margin: 0 15px;
  //     width: 21.4375rem;
  //     height: 8.3125rem;
  //     box-sizing: border-box;
  //   }
  // }
  // .myDesk {
  //   padding: 0 15px;
  //   box-sizing: border-box;
  //   padding-top: 1.5625rem;
  //   width: 23.4375rem;
  //   height: 17.0625rem;
  //   // background: rgba(188, 188, 188, 0.1);
  //   h2 {
  //     height: 1.1875rem;
  //     font-size: 1.25rem;
  //     font-weight: 600;
  //     color: rgba(0, 0, 0, 1);
  //     line-height: 0.9375rem;
  //   }
  //   .list {
  //     margin-top: 0.9375rem;
  //     width: 21.4375rem;
  //     height: 14rem;
  //     background: rgba(255, 255, 255, 1);
  //     border-radius: 10px;
  //     box-shadow: 0px 3px 12px 0px rgba(188, 188, 188, 0.2);
  //     display: flex;
  //     align-items: center;
  //     .all {
  //       display: flex;
  //       justify-content: space-around;
  //       flex-wrap: wrap;
  //     }
  //     .one {
  //       width: 25%;
  //       display: flex;
  //       flex-direction: column;
  //       align-items: center;
  //       justify-content: space-around;
  //       height: 6.25rem;
  //       img {
  //         width: 2.8125rem;
  //         height: 2.8125rem;
  //       }
  //       p {
  //         margin-top: -0.625rem;
  //         height: 0.8125rem;
  //         font-size: 0.8125rem;
  //         color: rgba(60, 60, 60, 1);
  //         line-height: 0.9375rem;
  //       }
  //     }
  //   }
  // }
  // .tab {
  //   display: flex;
  //   width: 23.4375rem;
  //   height: 3.0625rem;
  //   background: rgba(255, 255, 255, 1);
  //   justify-content: space-around;
  //   box-shadow: 3px 0px 12px 3px rgba(188, 188, 188, 0.2);

  //   > div:last-child {
  //     span {
  //       color: #bfbfbf;
  //     }
  //   }
  //   .btn {
  //     display: flex;
  //     flex-direction: column;
  //     align-items: center;
  //     align-self: center;
  //     i {
  //       font-size: 1.5rem;
  //       color: rgba(79, 115, 254, 1);
  //     }
  //     .icon-wode {
  //       color: #bfbfbf;
  //     }

  //     span {
  //       font-size: 0.75rem;
  //       color: rgba(79, 115, 254, 1);
  //       margin-top: 0.25rem;
  //     }
  //   }
  // }
}
</style>
