<!--
 * @Date: 2023-10-10 17:38:30
 * @LastEditors: JinxChen
 * @LastEditTime: 2023-10-11 17:05:31
 * @FilePath: \TelpoH5FrontendWeb\src\components\tables\index.vue
 * @description:
-->
<template>
    <div class="table-container">
         <table>
            <thead>
                <tr>
                <th
                    v-for="(item, key) in columns"
                    :key="key"
                >{{ item.title }}</th>
                </tr>
            </thead>
            <tbody>
                <tr
                v-for="(row, key1) in data"
                :key="key1"
                >
                <td
                    v-for="(col, key2) in columns"
                    :key="key2"
                    :style="{'width': col.width}"
                >
                    {{ row[col.key] }}
                </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script>
export default {
  name: '',
  props: {
    height: {
        type: String,
        default: '',
    },
    columns: {
      type: Array,
      require: true,
      default(){
        return []
      }
    },
    data: {
        type: Array,
        require: true,
        default(){
            return []
        }
    }
    /* row: {
        type: Array,
        default: []
    } */

  },
  data(){
   return {
   }
  }
}
</script>

<style scoped lang="scss">
@import "./index.scss";
</style>
