Pad_New/src/pages/console/managementConsole/index.vue

<template>
  <div class="page_managementConsole">
    <div class="managementConsoleTitle">
      <i class="iconfont icon-zuojiantou jiantou" @click="$router.go(-1)"></i>
      <span class="titleName">管理控制台</span>
    </div>
    <div class="consoleBox">
      <div class="consoleOne" @click="toStaffManage()">
        <img src="../../../assets/images/A1.jpg" alt />
        <div class="consoleRight">
          <div>
            <p class="rightName">员工管理</p>
            <p class="rightTip">添加员工加入医院/组织/团队</p>
          </div>
          <van-icon name="arrow" />
        </div>
      </div>
      <div class="consoleOne" @click="toPermissionManage()">
        <img src="../../../assets/images/A2.jpg" alt />
        <div class="consoleRight">
          <div>
            <p class="rightName">权限管理</p>
            <p class="rightTip">管理员可以设置角色并分配对应的权限</p>
          </div>
          <van-icon name="arrow" />
        </div>
      </div>
      <!--<div class="consoleOne">-->
      <!--<img src="../../../assets/images/A3.jpg" alt="" />-->
      <!--<div class="consoleRight">-->
      <!--<div>-->
      <!--<p class="rightName">应用管理</p>-->
      <!--<p class="rightTip">管理员可以添加或者停用应用</p>-->
      <!--</div>-->
      <!--<van-icon name="arrow" />-->
      <!--</div>-->
      <!--</div>-->
      <div class="consoleOne" @click="toOrgSetting()">
        <img src="../../../assets/images/A4.jpg" alt="" />
        <div class="consoleRight">
          <div>
            <p class="rightName">机构设置</p>
            <p class="rightTip">管理员可以修改医院/组织/团队信息</p>
          </div>
          <van-icon name="arrow" />
        </div>
      </div>
      <div class="consoleOne" @click="toSettingManage()">
        <img src="../../../assets/images/A4.jpg" alt="" />
        <div class="consoleRight">
          <div>
            <p class="rightName">配置管理</p>
            <p class="rightTip">管理员可以配置相关数据</p>
          </div>
          <van-icon name="arrow" />
        </div>
      </div>
    </div>
    <!--<div class="transfer">-->
    <!--<img src="../../../assets/images/A6.jpg" alt="" />-->
    <!--<div class="transferRight">-->
    <!--<p class="rightName">员工管理</p>-->
    <!--<van-icon name="arrow" />-->
    <!--</div>-->
    <!--</div>-->
  </div>
</template>
<script>
// import "../libs/rem.js";
import { setRem } from "@/libs/functionRem";

export default {
  methods: {
    toStaffManage() {
      this.$router.push({ path: "/manageconsole/staff" });
    },
    toPermissionManage() {
      this.$router.push({ path: "/manageconsole/role" });
    },
    toOrgSetting() {
      this.$router.push({ path: "" });
    },
    toSettingManage() {
      this.$router.push({ path: "/configurecenter" });
    }
  },
  create() {
    setRem();
  }
};
</script>

<style lang="scss" scoped>
.page_managementConsole {
  height: 100%;
  background: #f6f6f6;
  overflow: hidden;
  .managementConsoleTitle {
    height: 3.125rem;
    line-height: 3.125rem;
    display: flex;
    align-items: center;
    background: #fff;
  }
  .jiantou {
    margin-left: 1.25rem;
    font-size: 1.5rem;
    font-weight: 600;
    margin-right: 6.4rem;
  }
  .titleName {
    font-size: 1.125rem;
    font-weight: 600;
  }
  .consoleBox {
    margin-top: 0.8125rem;
    background: #fff;
    >div:last-child{
      border: none;
    }
  }
  .consoleOne {
    padding: 0 0.8125rem;
    height: 4.0625rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e5e5e5;
    img {
      width: 2rem;
      height: 2rem;
    }
    .consoleRight {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 88%;
    }
    .rightName {
      font-size: 1rem;
      color: #313234;
      margin-bottom: 0.375rem;
    }
    .rightTip {
      color: #9b9b9b;
      font-size: 0.8125rem;
    }
    .van-icon-arrow {
      color: #9f9f9f;
      font-size: 1rem;
    }
  }
  .transfer {
    margin-top: 0.8125rem;
    background: #fff;
    padding: 0 0.8125rem;
    height: 3.125rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    img {
      width: 2rem;
      height: 2rem;
    }
    .transferRight {
      width: 88%;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .van-icon-arrow {
      color: #9f9f9f;
    }
  }
}
</style>