elective-generation-master.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <div class="fx-column">
  3. <evaluation-empty v-if="isUnPassedStep" :shadow="false" :title="emptyTitle"></evaluation-empty>
  4. <template v-else>
  5. <slot :name="activeKey+'-header'" v-bind="chartBinding"></slot>
  6. <slot :name="activeKey" v-bind="chartBinding">
  7. <elective-generation-table :chart-binding="chartBinding"></elective-generation-table>
  8. </slot>
  9. <slot :name="activeKey+'-footer'" v-bind="chartBinding"></slot>
  10. </template>
  11. </div>
  12. </template>
  13. <script>
  14. import ElectiveGenerationTable from '@/views/elective/generation/components/elective-generation-table'
  15. export default {
  16. name: 'elective-generation-master',
  17. components: { ElectiveGenerationTable },
  18. props: {
  19. generation: {
  20. type: Object,
  21. default: () => ({})
  22. }
  23. },
  24. data() {
  25. return {
  26. emptyTitle: ''
  27. }
  28. },
  29. computed: {
  30. activeKey() {
  31. return this.generation.activeOpt?.key || ''
  32. },
  33. isUnPassedStep() {
  34. if (!this.generation.activeOpt) return false
  35. this.emptyTitle = this.generation.currentOpt == this.generation.options.init
  36. ? '选科还未开启'
  37. : `正在进行${this.generation.currentOpt.title || '{未知进程}'}, 还未进行至${this.generation.activeOpt.title}`
  38. return this.generation.active > this.generation.current
  39. },
  40. categories() {
  41. // summary - categories for display in table
  42. return this.generation.summary.filter(item => item.generation <= this.generation.active)
  43. },
  44. accumulates() {
  45. // summary - accumulate for display in charts
  46. return this.generation.summary.find(item => item.generation == this.generation.active && item.accumulates?.length)
  47. || this.generation.summary.find(item => item.generation == this.generation.active - 1)
  48. },
  49. chartBinding() {
  50. return {
  51. generation: this.generation,
  52. tableData: this.categories,
  53. chartData: this.accumulates
  54. }
  55. }
  56. },
  57. methods: {}
  58. }
  59. </script>
  60. <style scoped>
  61. </style>