<template>
  <a-card :bordered="false" v-if="currUserInfo">
    <x-form-table
      title="工单记录查询"
      :queryParamsName="queryParamsName"
      :fixedQueryForm="fixedQueryForm"
      @action="action"
      service-name="af-revenue"
      ref="xFormTable">
    </x-form-table>
  </a-card>
</template>

<script>
import { mapState } from 'vuex'

export default {
  name: 'TelephoneV3RecordQuery',
  components: {
    XFormTable: () => import('@vue2-client/base-client/components/common/XFormTable/XFormTable.vue')
  },
  data () {
    return {
      // 查询配置名称
      queryParamsName: 'TelephoneRecordQueryCRUD',
      // 查询表单固定值
      fixedQueryForm: { ts_f_userinfo_id: this.currUserInfo.f_userinfo_id },
      // 是否显示详情抽屉
      detailVisible: false,
      // 当前记录
      record: {}
    }
  },
  props: {
    currUserInfo: {
      type: Object,
      default: () => undefined
    }
  },
  mounted () {
    this.$refs.xFormTable.refresh(true)
  },
  methods: {
    action (record, id, actionType) {
      this.detailVisible = true
      console.log('触发了详情操作', record, id, actionType)
    },
    onClose () {
      this.detailVisible = false
      // 关闭详情之后重新查询表单
      this.$refs.xFormTable.refreshTable(true)
    }
  },

  computed: {
    ...mapState('account', { currUser: 'user' }),
    ...mapState('setting', { isMobile: 'isMobile' })
  },
}
</script>

<style scoped>

</style>
