<template>
  <div :class="$style.wrapHeight">
    <div :class="$style.rowHeight">
      <audit-maintain-dept-tree
        ref="auditMattersCatalogTree"
        :key="treekey"
        show-line
        top-node-text="审计模型"
        :is-select-dep="true"
        @treeSelect="treeSelect"
        @checkedKeys="getcheckedKeys"
      ></audit-maintain-dept-tree>
      <div :class="$style.rightcard">
        <a-card :class="$style.acard">
          <div style="float: left;margin-top: 15px;color: red;">
            <p>请注意：修改完下列动态数据后，需要点击保存，保存成功后才能生效！</p></div
          >
          <!-- 按钮区域 -->
          <div :class="$style.btndiv">
            <a-button type="primary" @click="saveForm">保存</a-button>
          </div>
          <!-- 数据授权页面 -->
          <audit-datasq-form
            ref="datasq"
            :record-id="frameRecordId"
            :read-only="formreadonly"
          ></audit-datasq-form>
        </a-card>
      </div>
    </div>
  </div>
</template>

<script>
import { getUserInfo } from '@/common/store-mixin'
import axios from '@/common/services/axios-instance'
import { Modal, Message } from 'ant-design-vue'
import crossWindowWatcher from '@/common/services/cross-window-watcher'
import auditDatasqForm from './audit-datasq-form.vue'
import auditMaintainDeptTree from './audit-maintain-dept-tree'
import auditMaintainService from './audit-maintain-service'
import components from './_import-components/audit-deptdatawarrant-from-import'

export default {
  name: 'AuditDeptdatawarrantFrom',
  metaInfo: {
    title: '数据授权',
  },
  components: {
    ...components,
    auditDatasqForm,
    auditMaintainDeptTree,
  },
  data() {
    return {
      treekey: 0,
      checkedKeys: [],
      formkey: 0,
      formreadonly: false, // 审计框架信息页面页面是否只读
      frameRecordId: null, // 审计框架信息页面recordId null为新建否则为查看
    }
  },
  methods: {
    getcheckedKeys(node, checkedNodes) {
      // this.checkedKeys = checkedNodes.map((node) => node.key)
      this.checkedKeys = checkedNodes.map((oneNode) => {
        return oneNode.data.props.props.orgId
      })
    },
    saveForm() {
      const udata = []
      const pdata = []
      let flag = true
      this.$refs.datasq.unitdata.forEach((item) => {
        if (item.id) {
          udata.push(item)
        } else {
          let sl = null
          let el = null
          if (!item.empowerType) {
            flag = false
          }
          if (item.empowerType === '0') {
            if (item.startDate !== undefined) {
              const s = new Date(item.startDate)
              const e = new Date(item.endDate)
              sl = s.getTime()
              el = e.getTime()
            }
          }
          udata.push({
            docType: 'date',
            empowerType: item.empowerType,
            startDate: sl,
            endDate: el,
            unitCode: item.unitCode,
            unitName: item.unitName,
            unitId: item.unitId,
          })
        }
      })
      this.$refs.datasq.personaldata.forEach((item) => {
        if (item.id) {
          pdata.push(item)
        } else {
          if (!item.empowerType) {
            flag = false
          }
          let sl = null
          let el = null
          if (item.empowerType === '0') {
            if (item.startDate !== undefined) {
              const s = new Date(item.startDate)
              const e = new Date(item.endDate)
              sl = s.getTime()
              el = e.getTime()
            }
          }
          pdata.push({
            docType: 'date',
            empowerType: item.empowerType,
            startDate: sl,
            endDate: el,
            userName: item.userName,
            userId: item.userId,
            userUnit: item.userUnit,
          })
        }
      })
      if (!flag) {
        Modal.warning({
          title: '提示',
          content: '请完善授权单位和授权人员表格信息!',
        })
        return false
      }
      if (this.checkedKeys.length === 0) {
        Modal.warning({
          title: '提示',
          content: '请勾选需要授权的单位!',
        })
        return false
      }
      const selectedRow = []
      this.checkedKeys.forEach((i) => selectedRow.push({ id: i }))
      const params = {
        iamModelMaintainEntitys: selectedRow,
        iamLicenseUnitEntitys: udata,
        iamLicensePeopleEntitys: pdata,
      }
      auditMaintainService.saveIamModelMaintain(params).then((res) => {
        if (res) {
          Message.success('保存成功', 1)
        }
      })
    },
    handleTreeSelect(groupCode) {
      if (groupCode.length > 0) {
        this.treeId = `${groupCode[0]}`
      }
    },
    changeRecord(node) {
      if (node) {
        this.selectedNode = node
      }
    },
    treeSelect(selectkey, info) {
      // 如果点击的是根节点
      // this.frameRecordId = info.node.dataRef.id.toString()
      this.frameRecordId = info.node.dataRef.props.orgId

      this.formkey++
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.wrap-height {
  height: 100%;
  .row-height {
    display: flex;
    flex: auto;
    height: 100%;
    .rightcard {
      flex: 1;
      width: calc(100% - 20%);
      height: 100%;
      .acard {
        min-height: 100%;
      }
      :global(.ant-card-body) {
        padding: 0 20px;
      }
    }
  }
}
// 按钮样式
.btndiv {
  float: right;
  // margin-bottom: 10px;
  margin: 10px;
  button {
    margin-left: 10px;
  }
}
.btnicon {
  margin-left: 3px !important;
  font-size: 12px;
}
// 右侧悬浮框样式
.right-user-div {
  position: absolute;
  top: 150px;
  right: 0;
  z-index: 6;
  width: 366px;
  overflow: hidden;
  white-space: nowrap;
  user-select: none;
  user-select: none;
  user-select: none;
  background: #fff;
  transition: all 0.1s ease-out;
}
.left-div {
  float: left;
  width: 40px;
  div {
    height: 40px;
    padding-top: 5px;
    padding-left: 10px;
    font-size: 20px;
    color: #1890ff;
    cursor: pointer;
    background: #d5d5d5;
  }
  .first-div {
    color: #fff;
    background: #1890ff;
    border-radius: 3px 0 0 0;
  }
  .last-div {
    background: #efefef;
    border-radius: 0 0 0 3px;
  }
}
.right-div {
  margin-left: 40px;
  border: 1px solid #dbdbdb;
  .right-top-div {
    height: 40px;
    margin: 0 10px;
    line-height: 40px;
    border-bottom: 1px solid #e1e1e1;
    .user-title {
      float: left;
    }
    .user-btn {
      float: right;
      margin-right: 10px;
      font-size: 12px;
      color: #999;
      span {
        margin-left: 8px;
      }
    }
  }
  .right-bottom-div {
    width: 320px;
    // height: 105px;
    margin: 10px 5px 10px 5px;
    white-space: normal;
    .user-icon {
      display: inline-block;
      padding: 0 10px 10px 10px;
      margin: 0 9px 10px 9px;
      font-size: 13px;
      vertical-align: top;
      cursor: pointer;
      border-radius: 5px;
      .user-icon-icon {
        position: relative;
        margin: 20px 10px 5px 10px;
        text-align: center;
        .nums {
          position: absolute;
          top: -5px;
          right: -6px;
          z-index: 22;
          width: 19px;
          height: 19px;
          font-size: 1px;
          color: #fff;
          background: #f1b55a;
          border-radius: 15px;
        }
      }
      .user-name {
        width: 5em;
        text-align: center;
      }
    }
    .user-icon:hover {
      background: #ededed;
    }
  }
}
</style>
