index.vue 1.34 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42
<script>
  import {
    MarkdownCell,
    CodeCell,
  } from './cells';

  export default {
    components: {
      'code-cell': CodeCell,
      'markdown-cell': MarkdownCell,
    },
    props: {
      notebook: {
        type: Object,
        required: true,
      },
      codeCssClass: {
        type: String,
        required: false,
        default: '',
      },
    },
    computed: {
      cells() {
        if (this.notebook.worksheets) {
          const data = {
            cells: [],
          };

          return this.notebook.worksheets.reduce((cellData, sheet) => {
            const cellDataCopy = cellData;
            cellDataCopy.cells = cellDataCopy.cells.concat(sheet.cells);
            return cellDataCopy;
          }, data).cells;
        }

        return this.notebook.cells;
      },
      hasNotebook() {
        return Object.keys(this.notebook).length;
      },
    },
Filipa Lacerda's avatar
Filipa Lacerda committed
43 44 45 46 47
    methods: {
      cellType(type) {
        return `${type}-cell`;
      },
    },
48 49 50
  };
</script>

51 52 53 54 55 56 57 58 59 60 61
<template>
  <div v-if="hasNotebook">
    <component
      v-for="(cell, index) in cells"
      :is="cellType(cell.cell_type)"
      :cell="cell"
      :key="index"
      :code-css-class="codeCssClass" />
  </div>
</template>

62 63 64 65 66 67 68 69 70 71 72 73 74 75
<style>
.cell,
.input,
.output {
  display: flex;
  width: 100%;
  margin-bottom: 10px;
}

.cell pre {
  margin: 0;
  width: 100%;
}
</style>