<template>
  <table-template :soul="this">
    <template #action="{ record }">
      <a @click="editRow(record)">编辑</a>
    </template>
    <template #tags="{ value }">
      <a-tag>{{ codeMapping['SYS0005'][value] }}</a-tag>
    </template>
    <template #value="{ record }">
      <span>{{ getValue(record) }}</span>
    </template>
    <template #free>
      <SysParamEdit ref="SysParamEdit" @onSuccess="reset" />
    </template>
  </table-template>
</template>

<script>
import dayjs from 'dayjs'
import { TableTemplate, TableScript, SearchType } from '@/components/table'
import { getPage } from '@/api/base/sysParam'
import SysParamEdit from './SysParamEdit.vue'

const columns = [
  {
    title: '参数名称',
    dataIndex: 'name',
    width: 200,
    filter: { type: SearchType.STRING }
  },
  {
    title: '参数类型',
    dataIndex: 'type',
    width: 100,
    scopedSlots: { customRender: 'tags' },
    filter: { type: SearchType.ENUM },
    enum: 'SYS0005'
  },
  { title: '参数值', key: 'value', scopedSlots: { customRender: 'value' } },
  { title: '备注', width: 100, dataIndex: 'remark' },
  { title: '排序号', width: 110, dataIndex: 'showOrder', sorter: true },
  { title: '修改人', width: 110, dataIndex: 'username' },
  {
    title: '修改时间',
    dataIndex: 'lmDate',
    width: 180,
    sorter: true,
    customRender: (text) => dayjs(text).format('YYYY-MM-DD HH:mm:ss')
  },
  {
    title: '操作',
    key: 'operation',
    width: 90,
    scopedSlots: { customRender: 'action' }
  }
]

export default {
  name: 'SysParamList',
  components: { TableTemplate, SysParamEdit },
  mixins: [TableScript],
  data() {
    return {
      title: '系统参数',
      columns,
      codes: [['SYS0005'], []]
    }
  },
  methods: {
    queryData: getPage,
    getValue(record) {
      if (record.type == 3) {
        return '[点击编辑查看]'
      }
      return record.value
    },
    editRow(row) {
      this.$refs.SysParamEdit.show(row)
    }
  }
}
</script>
