smsb-web-develop/src/components/Schedule/index.vue

<script>
import { mapGetters } from 'vuex'
import { getSchedule } from '@/api/calendar'
import ScheduleCalendar from './ScheduleCalendar'
import ScheduleSwiper from './ScheduleSwiper'

export default {
  name: 'Schedule',
  components: {
    ScheduleCalendar,
    ScheduleSwiper
  },
  props: {
    schedule: {
      type: String,
      required: true
    },
    editable: {
      type: [Boolean, String],
      default: false
    }
  },
  data () {
    return {
      options: null
    }
  },
  computed: {
    ...mapGetters(['isSuperAdmin', 'tenant', 'userId'])
  },
  watch: {
    schedule: {
      handler () {
        this.getSchedule()
      },
      immediate: true
    }
  },
  methods: {
    getSchedule () {
      const options = {
        loading: true,
        error: false,
        detail: null
      }
      this.options = options
      getSchedule(this.schedule).then(
        schedule => {
          if (schedule) {
            const { rejectIds } = schedule
            if (this.editable && rejectIds?.length) {
              this.ask(schedule, options)
            } else {
              options.detail = schedule
              options.loading = false
            }
          } else {
            options.loading = false
          }
        },
        () => {
          options.error = true
          options.loading = false
        }
      )
    },
    ask (schedule, options) {
      this.$confirm(
        '节目若已完成修改可选择保留',
        '存在被驳回的节目',
        {
          type: 'info',
          showClose: false,
          confirmButtonText: '保留',
          cancelButtonText: '移除',
          closeOnClickModal: false,
          closeOnPressEscape: false
        }
      ).catch(action => {
        if (action === 'cancel') {
          const { type } = schedule
          ;[val => val, this.removeRejectedFromSwiper, this.removeRejectedFromCalendar][type - 1](schedule)
        }
      }).finally(() => {
        options.detail = schedule
        options.loading = false
      })
    },
    removeRejectedFromCalendar (schedule) {
      const { events, rejectIds } = schedule
      let length = events.length
      for (let i = 0; i < length; i++) {
        if (rejectIds.includes(events[i].target.id)) {
          events.splice(i, 1)
          i -= 1
          length -= 1
        }
      }
    },
    removeRejectedFromSwiper (schedule) {
      const { events, rejectIds } = schedule
      let length = events.length
      for (let i = 0; i < length; i++) {
        if (rejectIds.includes(events[i].programId)) {
          events.splice(i, 1)
          i -= 1
          length -= 1
        }
      }
    }
  },
  render (h) {
    if (this.options.loading) {
      return h('div', {
        directives: [
          {
            name: 'loading',
            value: true
          }
        ]
      })
    }

    if (this.options.error) {
      return h('Warning', {
        props: {
          error: true
        },
        on: {
          click: this.getSchedule
        }
      })
    }

    const { detail } = this.options

    if (!detail) {
      return h('el-result', {
        props: {
          icon: 'warning',
          subTitle: '数据不存在'
        }
      })
    }

    if (!this.isSuperAdmin && detail.tenant !== this.tenant) {
      return h('el-result', {
        props: {
          icon: 'warning',
          subTitle: '无权限'
        }
      })
    }

    return h([null, 'ScheduleSwiper', 'ScheduleCalendar'][detail.type - 1], {
      props: {
        detail,
        editable: this.editable && (this.isSuperAdmin || detail.createBy === this.userId),
        ...this.$attrs
      },
      on: this.$listeners
    })
  }
}
</script>