<template>
  <schema-table :schema="schema">
    <div
      v-if="more"
      class="l-flex__none l-flex--row has-top-padding"
    >
      <div class="l-flex__auto" />
      <button
        class="l-flex__none c-sibling-item o-button"
        @click="onNext"
      >
        {{ btnMsg }}
      </button>
    </div>
    <schedule-dialog ref="scheduleDialog" />
  </schema-table>
</template>

<script>
import { State } from '@/constant'
import mixin from './mixin'

export default {
  name: 'WorkflowReviewRecurPrograms',
  mixins: [mixin],
  data () {
    return {
      type: 'carousel'
    }
  },
  computed: {
    schema () {
      return {
        condition: { pageSize: this.list.length },
        list: this.getList,
        cols: [
          { prop: 'name', label: '轮播名称' },
          { prop: 'resolutionRatio', label: '分辨率' },
          ...this.reviewCol
        ]
      }
    }
  },
  created () {
    this.list = this.transform(this.workflow.carousels)
    if (!this.list.some(({ pass }) => !pass)) {
      this.$emit('next')
    }
  },
  methods: {
    transform (arr) {
      return arr.map(this.transformItem)
    },
    transformItem ({ id, status, name, resolutionRatio }) {
      return {
        pass: status !== State.SUBMITTED,
        id, status, name, resolutionRatio
      }
    },
    onView ({ id }) {
      this.$refs.scheduleDialog.show(id)
    }
  }
}
</script>
