diantou/src_product/iam/audit/dsc/iam-audit-dsc-main.vue

<template>
  <a-layout :class="$style.mainDiv">
    <a-layout-header :class="$style.header">
      <div :class="$style.title"> 决策支持中心 </div>

      <div :class="$style.rightDiv">
        <div :class="$style.year">
          <a-date-picker
            v-model="planYear"
            :class="$style.yearSelect"
            allow-clear
            mode="year"
            picker="YYYY"
            format="YYYY"
            :input-read-only="true"
            :open="yearOpen"
            placeholder="选择年份"
            @panelChange="panelChange"
            @openChange="openChange"
          />
        </div>
        <div :class="$style.group">
          <div v-show="auditOrg.length === 0" :class="$style.holder" @click="holderClick"
            >审计机构
          </div>
          <a-form-model-item :label="null" prop="auditOrg">
            <!-- <sd-group-picker v-model="auditOrg" :single="true" :root-node="rootNode" /> -->
            <audit-group-picker
              v-model="auditOrg"
              :single="true"
              :read-only="false"
              :root-node="rootNode"
            />
          </a-form-model-item>
        </div>
        <!--
          需求确认去掉关闭按钮
           <div :class="$style.close" @click="closeWindow">
          <a-icon type="close"></a-icon>
        </div> -->
      </div>
    </a-layout-header>
    <a-layout-content :class="$style.contentDiv">
      <!-- 上部div -->
      <iam-audit-dsc-top-div
        :class="$style.topDiv"
        :unid-id="auditOrg"
        :plan-year="planYear"
      ></iam-audit-dsc-top-div>
      <!-- 中部div -->
      <iam-audit-dsc-center-div
        :unid-id="auditOrg"
        :plan-year="planYear"
        :class="$style.centerDiv"
      ></iam-audit-dsc-center-div>
      <!-- 底部div -->
      <iam-audit-dsc-bottom-div
        :key="key"
        :unid-id="auditOrg"
        :plan-year="planYear"
        :class="$style.bottomDiv"
      ></iam-audit-dsc-bottom-div>
    </a-layout-content>
  </a-layout>
</template>

<script>
import auditGroupPicker from '@product/iam/components/picker/audit-group-picker.vue'
import axios from '@/common/services/axios-instance'
import { getUserInfo } from '@/common/store-mixin'
import iamAuditDscService from './components/iam-audit-dsc-service'
import components from './_import-components/iam-audit-dsc-main-import'

export default {
  name: 'IamAuditDscMain',
  metaInfo: {
    title: '决策支持中心',
  },
  components: {
    auditGroupPicker,
    ...components,
  },
  data() {
    return {
      yearOpen: false,
      key: 0,
      auditOrg: [],
      options: [],
      planYear: undefined,
      rootNode: {},
    }
  },
  watch: {
    // 监听数据，更新之后需要刷新图标
    planYear() {
      this.key++
    },
    auditOrg() {
      this.key++
    },
  },

  created() {
    // this.options = []
    // let curYear = new Date().getFullYear() - 5
    // for (let i = 0; i < 10; i++) {
    //   this.options.push({
    //     value: curYear + '',
    //     label: curYear,
    //   })
    //   curYear++
    // }
    let userInfo = getUserInfo()
    const params = {
      orgId: userInfo.deptId,
    }
    // iamAuditDscService.getUserInfo(params).then((res) => {
    //   this.id = res.data
    //   const deptCode = userInfo.deptId.toString()
    //   const deptName = userInfo.deptName
    //   this.rootNode = { code: deptCode, name: deptName, id: this.id }
    // })
    axios({
      url: 'api/xcoa-mobile/v1/iamorg/getCurrentUserGroup',
      method: 'get',
    }).then((res) => {
      userInfo = res.data
      params.orgId = res.data.id
      axios({
        url: 'api/xcoa-mobile/v1/iamorg/findIamOrgId',
        method: 'post',
        params,
      }).then((res) => {
        this.id = res.data
        const deptCode = userInfo.id.toString()
        const deptName = userInfo.name
        this.rootNode = { code: deptCode, name: deptName, id: this.id }
        // bug22421 默认统计机构设置到本机构及一下
        const currNoe = {
          id: userInfo.id,
          // oldId: 0,
          text: deptName,
          name: deptName,
          title: deptName,
          code: deptCode,
          leaf: false,
          isleaf: false,
          props: {},
          children: [],
          differentDisplay: false,
          expandable: true,
          type: 'Group',
        }
        this.auditOrg.push(currNoe)
      })
    })
    // 22738 年份默认为当年
    this.planYear = new Date().getFullYear().toString()
  },
  methods: {
    /**
     * 关闭当前窗口
     */
    closeWindow() {
      window.opener = window
      const win = window.open('', '_self')
      win.close()
    },
    holderClick() {
      document.querySelector('.group_iam-audit-dsc-main_product .ant-select').click()
    },
    /**
     * 打开或关闭年度选择
     */
    openChange(open) {
      this.yearOpen = open
    },
    /**
     * 年份选择时，关闭弹窗
     */
    panelChange(value) {
      this.planYear = value.format('YYYY')
      this.yearOpen = !this.yearOpen
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
$header-height: 60px;
.main-div {
  min-height: 100%;
  .header {
    display: flex;
    height: 60px;
    padding: 0 30px;
    font-size: 25px;
    line-height: 60px;
    color: #fff;
    background: #1489fc;
    .title {
      float: left;
      width: 50%;
    }
    .right-div {
      display: flex;
      justify-content: flex-end;
      width: 50%;
      :global(.ant-form-item-control) {
        :global(.ant-select) {
          width: 200px;
          margin-top: 11px;
          vertical-align: baseline;
          cursor: pointer;
        }
        :global(.ant-select-selection--multiple) {
          cursor: pointer;
        }
        :global(.ant-select-search__field) {
          display: none;
        }
      }
      .year {
        margin-right: 15px;
        .year-select {
          display: block;
          width: 120px;
          margin-top: 15px;
          :global(.ant-calendar-picker-input) {
            cursor: pointer;
          }
        }
      }
      .group {
        position: relative;
        .holder {
          position: absolute;
          left: 10px;
          z-index: 1;
          font-size: 16px;
          color: #bfbfbf;
          cursor: pointer;
        }
        :global(.ant-select-selection) {
          overflow-y: hidden;
        }
      }
      .close {
        margin-left: 15px;
        font-size: 22px;
        cursor: pointer;
      }
    }
  }
  .content-div {
    margin: 20px;
  }
  .top-div {
    background: transparent;
  }
  .center-div {
    margin-top: 20px;
  }
  .bottom-div {
    margin-top: 20px;
  }
}
</style>