<template>
  <div :class="[$style.wrapHeight, $style.dataclass]">
    <div :class="$style.rowHeight">
      <div :class="$style.rightcard">
        <a-card>
          <audit-advanced-query
            :expand="expand"
            :ref-name="searchform"
            :search-data="formData"
            :search-style="{ height: '150px', left: '20px', top: '57px' }"
            :search-fun="handleSearch"
            @searchedClick="searchedClick"
          >
            <template>
              <a-col :span="16">
                <a-form-model-item :label="'操作时间'" prop="time">
                  <a-range-picker v-model="formData.time" />
                </a-form-model-item>
              </a-col>
            </template>
          </audit-advanced-query>
          <SdDataTableEx
            ref="dataTable"
            form-id="iamOperationAssociationRecord"
            data-url="api/xcoa-mobile/v1/iam-page/businessList"
            :columns="columns"
            :actions="actions"
            :filter-expressions="expressions"
            :editnode="editnode"
            :projectlist="true"
            :show-advance-query="true"
            @searchbtnClick="searchbtnClick"
          >
          <div slot="source" slot-scope="text">
            <span v-if="text === 1" >自定义数据</span>
            <span v-else>系统数据</span>
          </div>

          </SdDataTableEx>
        </a-card>
      </div>
    </div>
  </div>
</template>

<script>
import SdDataTableEx from '@/common/components/sd-data-table-ex.vue'
import SdDataTable from '@/common/components/sd-data-table.vue'
import TableColumnTypes from '@/common/services/table-column-types'
import auditAdvancedQuery from '../../components/audit-advanced-query.vue'
import auditAdvancedQueryMixins from '../../components/audit-advanced-query-mixins'
import masterDataService from './master-data-service'
import { Modal, Message } from 'ant-design-vue'

export default {
  name: 'MasterDataOperate',
  metaInfo: {
    title: '关联操作记录',
  },
  components: {
    SdDataTableEx,
    auditAdvancedQuery,
  },
  mixins: [auditAdvancedQueryMixins],
  data() {
    return {
      editnode: true,
      searchform: 'searchform',
      formData: {
        startTime: '',
        endTime: '',
        time: [],
      },
      actions: [],
      columns: [
        {
          dataIndex: 'id',
          sdHidden: true,
        },
        {
          dataIndex: 'groupId',
          sdHidden: true,
        },
        {
          title: '系统名称',
          dataIndex: 'sysName',
        },
        {
          title: '代码',
          dataIndex: 'code',
        },
        {
          title: '名称',
          dataIndex: 'name',
        },
        {
          title: '级别',
          dataIndex: 'level',
        },
        {
          title: '类型',
          dataIndex: 'source',
          scopedSlots: { customRender: 'source' },
        },
        {
          title: '操作人',
          dataIndex: 'operation',
        },

        {
          title: '操作时间',
          dataIndex: 'operationTime',
          sdRender: TableColumnTypes.date,
        },
        {
          title: '操作',
          dataIndex: 'opt',
          aligen: 'center',
          width: '150px',
          customRender: (text, record, index) => {
            return (
              <span>
                <a
                  vOn:click={(evt) => {
                    this.revokeClick(record.id)
                  }}
                >
                  撤销
                </a>
              </span>
            )
          },
        },
      ],
      expressions: [
        // id
        {
          dataType: 'str',
          name: 'groupId',
          op: 'eq',
          stringValue: this.$route.query.id,
        },
      ],
    }
  },
  methods: {
    handleSearch() {
      this.expressions = [
        {
          dataType: 'str',
          name: 'groupId',
          op: 'eq',
          stringValue: this.$route.query.id,
        },
      ]
      if (this.formData.time.length === 2) {
        this.formData.time.forEach((item, index) => {
          this.expressions.push({
            dataType: 'long',
            name: 'operationTime',
            op: index === 0 ? 'ge' : 'lt',
            longValue: item._d.getTime(),
          })
        })
      }
    },
    // 撤销关联记录
    revokeClick(id) {
      const that = this
      Modal.confirm({
        title: '提示',
        content: '确定要删除这条记录吗?',
        onOk() {
          masterDataService.revokeOrgData(id).then((res) => {
            if (res.data) {
              Message.success('删除成功', 1).then((flag) => {
                if (flag) {
                  that.$refs.dataTable.refresh()
                }
              })
            }
          })
        },
        onCancel() {},
      })
    },
  },
}
</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%;
    }
  }
}

.dataclass {
  :global(.projectlist .ant-table-empty .ant-table-body) {
    overflow-x: hidden !important;
  }

  :global(span > .ant-btn:nth-child(2)) {
    color: #fff;
    background-color: #1890ff;
    border-color: #1890ff;
  }

  // :global(.ant-table-placeholder) {
  //   width: auto;
  // }
}
</style>
