<template>
  <div class="form-wrap">
    <el-form
      class="search-box"
      ref="form"
      :model="form"
      :inline="true"
    >
      <div class="block-title">
        查询条件
      </div>
      <el-form-item
        label="统计标识"
        prop="statKey">
        <el-select v-model="form.statKey" placeholder="请选择统计字段标识">
          <el-option
            label="售票统计"
            value="orderSaleStatistics">
          </el-option>
          <el-option
            label="报表明细"
            value="orderDetail">
          </el-option>
        </el-select>
      </el-form-item>
      <div class="btn-wrap">
        <el-button
          @click="reset">
          重置
        </el-button>
        <el-button
          type="primary"
          @click="getList(true)">
          搜索
        </el-button>
      </div>
    </el-form>

    <div class="table-box">
      <!-- <div class="block-title">
        数据权限列表
      </div> -->
      <el-table
        border
        v-loading="loading"
        :data="tableData">
        <el-table-column
          prop="fieldKey"
          label="字段属性标识">
        </el-table-column>
        <el-table-column
          prop="fieldName"
          label="字段属性名称">
        </el-table-column>
        <el-table-column
          prop="isShow"
          label="是否显示">
          <template slot-scope="scope">
            {{ scope.row.isShow === 1 ? '是' : '否' }}
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 弹框 -->
  </div>
</template>

<script>
import { getFiledByStatKey } from '@/api/checker'

export default {
  data () {
    return {
      form: {
        statKey: 'orderSaleStatistics'
      },
      loading: false,
      tableData: [],
      total: 0,
      dialogVisible: false,
      configDialogVisible: false,
      currentItem: {},
      adminList: [],
      ticketTypeList: [],
      scenicList: [],
      payChannelList: [],
      deviceList: []
    }
  },
  created () {
    this.getList()
  },
  components: {
  },
  methods: {
    reset () {
      this.$refs.form.resetFields()
    },
    handleSizeChange (size) {
      this.form.pageSize = size
      this.getList()
    },
    // 获取通道列表
    getList (goFirst) {
      let params = { ...this.form }

      goFirst && (params.pageNum = 1)
      this.loading = true
      getFiledByStatKey(params).then(res => {
        console.log('res', res)
        this.tableData = res.data || []
        this.loading = false
      })
    },
    // 打开弹框
    openAddDialog () {
      this.currentItem = {
        id: '',
        name: ''
      }
      this.dialogVisible = true
    },
    openEditDialog (item) {
      this.currentItem = {
        id: item.id,
        name: item.name,
        adminIds: item.admins ? item.admins.map(adm => adm.id) || [] : [],
        ticketTypeIds: item.ticketTypes ? item.ticketTypes.map(tt => tt.id) || [] : [],
        scenicIds: item.scenicList ? item.scenicList.map(sc => sc.id) || [] : [],
        payChannelIds: item.payChannelList ? item.payChannelList.map(pc => pc.id) || [] : [],
        checkerIds: item.checkerList ? item.checkerList.map(ch => ch.id) || [] : []
      }
      this.dialogVisible = true
    },
    getNameList (list, key = 'name') {
      if (!list) return ''
      return list.map(item => item[key]).join(',')
    }
  }
}
</script>

<style scoped>

</style>
