<template>
  <a-card :bordered="false">
    <x-form-table
      title="示例表单查询"
      :queryParamsName="queryParamsName"
      :fixedAddForm="fixedAddForm"
      serviceName="af-his"
      @action="action"
      ref="xFormTable">
    </x-form-table>
    <a-button @click="navigateToAnotherPage">跳转到另一个页面</a-button> <!-- 使用方法进行跳转 -->
    <a-drawer
      title="详情信息"
      placement="right"
      :destroy-on-close="true"
      width="85vw"
      :closable="false"
      :visible="detailVisible"
      @close="onClose">
      <span>
        详情表单内容
      </span>
    </a-drawer>
  </a-card>
</template>

<script>
import XFormTable from '@vue2-client/base-client/components/common/XFormTable/XFormTable.vue'
import { mapState } from 'vuex'

export default {
  name: 'ChargeQuery',
  components: {
    XFormTable
  },
  data () {
    return {
      // 查询配置名称
      queryParamsName: 'infusionExecutionCRUD',
      // queryParamsName: '1CRUD',
      // 新增表单固定值
      fixedAddForm: {},
      // 是否显示详情抽屉
      detailVisible: false,
      // 当前记录
      record: {}
    }
  },
  created () {
  },
  mounted () {
    console.log('==当前登录人', this.currUser)
  },
  methods: {
    action (record, id, actionType) {
      this.detailVisible = true
      console.log('触发了详情操作', record, id, actionType)
    },
    onClose () {
      this.detailVisible = false
      // 关闭详情之后重新查询表单
      this.$refs.xFormTable.refreshTable(true)
    },
    navigateToAnotherPage () {
      this.$router.replace({ path: 'sub-example', query: { message: 'Hello from DefaultExample' } })
    }
  },
  computed: {
    ...mapState('account', { currUser: 'user' }),
    ...mapState('setting', { isMobile: 'isMobile' })
  },
}
</script>

<style scoped>

</style>
