<template>
  <div class="auto select-overspread" style="overflow-y: hidden">
    <validator name='v'>
      <ul class="nav nav-tabs">
        <p class="bg-info text-center" style="padding: 8px;">角色信息</p>
      </ul>
      <!--sehgbanbn-->
      <div class="form-horizontal" style="margin-top:20px;flex: 1;">
        <div class="row">
          <div class="col-sm-6"  :class="[$v.f_role_id.required ? 'has-error' : '']">
            <label class="font_normal_body" >角色编号</label>
            <input type="text"
                   :disabled="look"
                  v-model="model.f_role_id" @blur="validateDul" v-validate:f_role_id='{required: true }' class="input_search" style="width:60%" placeholder="角色编号" v-next-el="name">
          </div>
          <div class="col-sm-6"   :class="[$v.name.required ? 'has-error' : '']">
            <label for="f_adjustable_name" class="font_normal_body" >角色名称</label>
            <input type="text"  v-model="model.name"
                   :disabled="look"
                   v-validate:name="{required: true }"  class="input_search" style="width:60%" placeholder="角色名称" v-el:name v-next-el="address">
          </div>
          <div class="col-sm-6"  :class="[$v.oname.required ? 'has-error' : '']">
            <label for="f_area" class="font_normal_body" >所属组织</label>
            <input type="text" v-model="model.oname"
                   v-validate:oname="{required: true }" class="input_search" style="width:45%" placeholder="所属组织" readonly >
            <button type="button" class="btn button_new btn-lg" style="width:13%"
                    :disabled='look'
                    @click="openOrgModal">
              <span class="glyphicon glyphicon-search"></span>
            </button>
          </div>
          <div class="col-sm-6"></div>
        </div>
      </div>
      <div style="text-align:right;height:auto;margin-top:6px;">
        <button  v-if="!look"  @click="confirm()"
                class="btn button_search " style="width: 70px"
                :disabled='!$v.valid'>
          <span class="glyphicon glyphicon-floppy-disk"></span>保存
        </button>
        <button @click='close()' class="btn button_clear"style="width: 70px">
          <span class=" glyphicon glyphicon-log-out"></span>取消
        </button>
      </div>
      <button  class="button_search button_spacing " style="width: max-content"
               v-if="!look"
               @click="openFunModal('func')"  type="button">
        <span class="glyphicon glyphicon-cog">功能权限</span>
      </button>
      <button  class="button_search button_spacing" style="width: max-content"
               v-if="!look"
               @click="openRoleModal('role')"  type="button">
        <span class="glyphicon glyphicon-cog">角色权限</span>
      </button>
    </validator>
    <organization-modal v-if="!look" :data="model" v-show="orgModalShow" :show.sync="orgModalShow" style="float: left" @org="getOrg"></organization-modal>
    <func-permissions-modal v-if="!look" :show.sync="funcPermissionsShow" v-show="funcPermissionsShow" :data="data" :roots.sync="funcPermissions" ></func-permissions-modal>
    <role-permissions-modal v-if="!look" :show.sync="rolePermissionsShow"  v-show="rolePermissionsShow":data="data" :roots.sync="rolePermissions" ></role-permissions-modal>
    <div class="row" v-if="look&&model.id&&model.id.length>0" style="height: 480px;overflow: auto;">
      <licensepolicy  v-if="look&&model.id&&model.id.length>0" :id="model.id"></licensepolicy>
    </div>  </div>
</template>

<script>

  export default {
    title: '添加角色',
    data () {
      return {
        model: {
          id: '',
          name: '',
          f_role_id:'',
          parentid: '',
          selfid: '',
          f_description: '',
          resourcetype: 'role',
          oname: ''
        },
        // 所属组织
        orgModalShow: false,
        funcPermissionsShow: false,
        funcPermissions: [],
        rolePermissionsShow: false,
        rolePermissions: [],
        // 功能权限
        permissionsType: 'function'
      }
    },
    props: ['data','look'],
    ready () {
      this.model = Object.assign({}, this.model, this.data)
    },
    watch: {
      'data' (val) {
        if (val) {
          this.model = Object.assign({}, this.model, this.data)
        } else {
          // 初始化角色组件
          // TODO
          this.initModel()
        }
        this.$resetValidation()
      }
    },
    methods: {
      initModel () {
        this.model = {
          id: '',
          name: '',
          f_role_id:'',
          parentid: '',
          selfid: '',
          f_description: '',
          resourcetype: 'role',
          oname: ''
        }
      },
      async confirm () {
        // 保存用户
        console.log('要保存用户了', this.data, this.model, this.permissions)
        // 保存角色
        this.model.f_create_date = this.$login.toStandardTimeString()
        let saveRole = await this.$resetpost('rs/data/save',{data:this.model},{resolveMsg: null, rejectMsg: '保存角色出错！！'})
        let roleId = this.model.id ? this.model.id : saveRole.data + ''
        // 保存权限
        console.log('开始保存权限', roleId)
        // 组织角色权限数据
        let param = {
          parentid: roleId,
          loginid: this.$login.f.id,
          licenses:[]
        }
        this.rolePermissions.forEach((item) => {
          item.parentid = roleId
          item.resourceid = roleId
          param.licenses.push(item)
        })
        this.funcPermissions.forEach((item) => {
          item.parentid = roleId
          item.resourceid = roleId
          param.licenses.push(item)
        })
        await this.$resetpost('rs/license/save', param, {resolveMsg: '保存成功', rejectMsg: '保存权限失败！请您重试！！'})
        this.$dispatch('success')
      },
      close () {
        this.$dispatch('cancel')
      },
      openOrgModal () {
        this.orgModalShow = true
      },
      openFunModal () {
        this.funcPermissionsShow = true
      },
      openRoleModal () {
        this.rolePermissionsShow = true
      },
      getOrg (val) {
        this.model.oname = val.name
        this.model.parentid = val.id
      },
      async validateDul () {
        // 判断是修改还是新增
        if (this.data) {
          if (this.model.f_role_id !== this.data.f_role_id ) {
            let validate = await this.$resetpost('rs/sql/ldap_getAllRole', {data: {condition: `f_role_id = '${this.model.f_role_id}'`}}, {rejectMsg: '验证角色编号重复出错！！', resolveMsg: null})
            if (validate.data.length > 0) {
              this.model.f_role_id = this.data.f_role_id
              this.$showAlert('编号重复，请重新输入！！', 'warning', 2000)
            }
          }
        } else {
          let validate = await this.$resetpost('rs/sql/ldap_getAllRole', {data: {condition: `f_role_id = '${this.model.f_role_id}'`}}, {rejectMsg: '验证角色编号重复出错！！', resolveMsg: null})
          if (validate.data.length > 0) {
            this.model.f_role_id = ''
            this.$showAlert('编号重复，请重新输入！！', 'warning', 2000)
          }
        }
      }
    }
  }

</script>

