<template>
  <div class="page_editRole">
    <div class="editRoleTitle">
      <i class="iconfont icon-zuojiantou jiantou" @click="$router.go(-1)"></i>
      <span class="titleName">模块权限配置</span>
    </div>

    <div class="disposeBox">
      <p class="disposeTitle">模块权限配置</p>

      <div v-for="(item, index) in allPurview" :key="index">
        <div class="disposeOne" v-if="!item.no_sub" @click="toSubPurview(item)">
          <van-cell :title="item.name" is-link center />
  
        </div>
        <van-cell center :title="item.name" v-if="item.no_sub">
          <template #right-icon>
            <van-switch
              @change="changePurviewStatus(item)"
              v-model="item.isCheck"
              class="switch"
            />
          </template>
        </van-cell>
      </div>
    </div>

    <van-overlay :show="loading" type="spinner" size="30px">
      <div class="wrapper">
        <van-loading size="24px" vertical>正在加载中...</van-loading>
      </div>
    </van-overlay>
  </div>
</template>


<script>
  import {setRem} from "@/libs/functionRem";
  import {DeleteRoleInfo, EditPurview, EditRoleInfo, GetAllRole, GetNewPurview, GetRoleInfo} from "@/api/admin_user";
  import {Dialog} from "vant";

  export default {
    data() {
      return {
        desc: "",
        name: "",
        loading: false,
        checked: false,
        allPurview: [],
        rolePurview: null,
        is_system: 0,
        ids: [],
        isShow: false,
      };
    }, created() {
      setRem()
      this.GetAllPurview()


    }, methods: {
      changePurviewStatus(value) {
        let purview_ids = ""
        let type = 0
        if (value.pid == 0) { //当前页面只存在pid为0的数据，而且会出现开关按钮的情况只会是拥有一个子节点

          if (value.sub_purview.length > 0) {

            purview_ids = value.id + "," + value.sub_purview[0].id
          } else {
            purview_ids = value.id
          }
        }
        if (value.isCheck) {
          type = 1 //打开
        } else {
          type = 2 //关闭
        }


        let params = {
          id: this.$route.query.id,
          purview_id: purview_ids,
          type: type,
        }

        EditPurview(params).then(response => {
          if (response.data.state === 1) {
            if (type == 1) {
              value.isCheck = true
            } else {
              value.isCheck = false
            }
          } else {
            if (type == 1) {
              value.isCheck = false
            } else {
              value.isCheck = true
            }
            this.$toast({
              message: response.data.msg
            });
          }
        });


      },
      toSubPurview(purview) {
        if (purview.module == 3) {
          if(purview.name == '透析记录'){
            this.$router.push({path:"/role/functionpurview?id="+this.$route.query.id+"&pid="+purview.id})
          }else{
            this.$router.push({path: "/role/subpurview?id=" + this.$route.query.id + "&pid=" + purview.id + "&module=" + purview.module + "&title=" + purview.name})
          }
        } else if (purview.module == 4 || purview.module == 6) {
          this.$router.push({path: "/role/otherpurview?id=" + this.$route.query.id + "&pid=" + purview.id + "&module=" + purview.module + "&title=" + purview.name})

        }

      },
      del() {
        Dialog.confirm({
          message: "是否删除该角色？"
        }).then(() => {
          let params = {
            role_id: this.$route.query.id,
            enable: false,
          }
          DeleteRoleInfo(params).then(response => {
            if (response.data.state === 1) {
              this.$toast({
                message: "删除成功"
              });
              this.$router.go(-1)
            } else {
              this.$toast({
                message: response.data.msg
              });
            }
          });

        });
      },

      GetRoleInfo(role_id) {
        let params = {
          id: role_id,
        }
        GetRoleInfo(params).then(response => {
          if (response.data.state === 1) {
            this.rolePurview = response.data.data.role_purview
            this.name = response.data.data.role.name
            this.desc = response.data.data.role.intro
            this.is_system = response.data.data.role.is_system

            this.ids = this.rolePurview.PurviewIds.split(',')

            for (let a = 0; a < this.ids.length; a++) {
              for (let i = 0; i < this.allPurview.length; i++) {
                if (parseInt(this.ids[a]) == this.allPurview[i].id) {
                  this.allPurview[i].isCheck = true
                }
              }
            }

            this.loading = false


          } else {
            this.loading = false

            this.$toast({
              message: response.data.msg
            });
          }
        }).catch(error => {
          this.loading = false

        });
        ;

      }, GetAllPurview() {
        let params = {
          url: this.$route.query.url
        }
        this.loading = true
        GetNewPurview(params).then(response => {
          if (response.data.state === 1) {
            this.loading = false
            // console.log( this.$route.query.url == '/config/manage')

            for (let i = 0; i < response.data.data.purviews.length; i++) {
              var purview = response.data.data.purviews[i].sub_purview
              if(this.$route.query.url == '/patinets/ele'){
                response.data.data.purviews[i]['no_sub'] = true
                this.allPurview.push(response.data.data.purviews[i])
              }else if( this.$route.query.url == '/dialysis/manage' ||this.$route.query.url == '/stock/manage'  ){
                response.data.data.purviews[i]['no_sub'] = false
                this.allPurview.push(response.data.data.purviews[i])
              }else if( this.$route.query.url == '/config/manage' ){
                if(response.data.data.purviews[i].urlfor == "/role/admin/manage"
                  || response.data.data.purviews[i].urlfor == "/role/manage"
                  || response.data.data.purviews[i].urlfor == "/data/showconfig"
                  ||response.data.data.purviews[i].urlfor == "/data/print"){
                  response.data.data.purviews[i]['no_sub'] = true
                }else{
                  response.data.data.purviews[i]['no_sub'] = false
                }
                this.allPurview.push(response.data.data.purviews[i])

              } else{
                if (purview.length > 1) {
                  response.data.data.purviews[i]['no_sub'] = false
                } else {
                  response.data.data.purviews[i]['no_sub'] = true
                }
                response.data.data.purviews[i]['isCheck'] = false
                this.allPurview.push(response.data.data.purviews[i])
              }
            }
            // }
          } else {
            this.loading = false

            this.$toast({
              message: response.data.msg
            });
          }
        });

      },


    }
  };
</script>

<style lang="scss" scoped>
  .page_editRole {
    height: 100%;
    overflow-y: auto;
    background: #fafafa;

  .editRoleTitle {
    background: #fff;
    padding: 0 1.125rem;
    height: 3.125rem;
    display: flex;
    align-items: center;
    // justify-content: space-between;

  span {
    font-size: 1rem;
  }

  }

  .jiantou {
    font-size: 1.5rem;
    font-weight: 600;
    margin-right: 6rem;
  }

  .titleName {
    font-size: 1.125rem !important;
    font-weight: 600;
  }

  .roleDescription {
    margin: 0.875rem 0;

  .van-cell {
    font-size: 1rem;
  }

  .input1 {

  .van-field__body {
    width: 100%;
  }

  }
  }
  .disposeBox {
    margin-bottom: 1.25rem;

  .disposeTitle {
    height: 2.8125rem;
    line-height: 2.8125rem;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
    font-weight: bold;
    color: #313234;
    padding-left: 1.125rem;
    font-size: 1rem;
  }

  .disposeOne {
    display: flex;
    justify-content: space-between;
    // height: 4.0625rem;
    background: #fff;

  .disposeImg {
    width: 12%;
    padding-left: 1.125rem;
    padding-top: 1.125rem;

  img {
    width: 1.5rem;
    height: 1.5rem;
  }

  }
  .disposeTxt {
    width: 86%;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 0.875rem;
  }

  .noTxt {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.1);
  }

  .disposeName {
    font-size: 1rem;
    color: #313234;
    margin-top: 0.375rem;
  }

  .disposeTip {
    font-size: 0.8125rem;
    color: #9b9b9b;
    margin-top: 0.375rem;
  }

  .arrow {
    color: #9f9f9f;
    font-size: 1rem;
  }

  }
  .disposeTwo {
    display: flex;
    justify-content: space-between;
    height: 3.125rem;
    background: #fff;
    align-items: center;

  .disposeImg1 {
    width: 12%;
    padding-left: 1.125rem;
    display: flex;
    align-items: center;

  img {
    width: 1.5rem;
    height: 1.5rem;
  }

  }
  .disposeTxt {
    width: 86%;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 0.875rem;
    height: 100%;
  }

  .noTxt {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.1);
  }

  .disposeName {
    font-size: 1rem;
    color: #313234;
  }

  }
  }
  .switch {
    font-size: 1.5rem;
  }

  }
  ::-webkit-scrollbar {
    width: 0;
  }
</style>
<style lang="scss">
  .page_editRole {
    .van-cell__title {
    display: flex;
    align-items: center;
    font-size: 1rem;
    color: #313234;
  }

  .van-field__control {
    font-size: 1rem;
  }

  .van-field__body {
    width: 100%;
  }
  .van-cell::after {
    position: absolute;
    box-sizing: border-box;
    content: ' ';
    pointer-events: none;
    right: 16px;
    bottom: 0;
    left: 16px;
    border-bottom: 1px solid #ebedf0;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}


  .van-button {
    color: #f44746;
    border: none;
    text-align: right;
    font-size: 1rem;
    padding: 0;
  }

  .roleDescription {

  .van-cell__value {
    display: flex;
    align-items: center;
  }

  }
  }
</style>

<style lang="scss">
  .page_editRole {

  .wrapper {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .input1 {
    font-size: 1rem;



  }
  .van-button--default {
    border: none;
  }

  .van-button__text {
    font-size: 1rem;
  }

  .van-field__body {
    width: 100%;
  }

  }
</style>
