帮我优化一下下面的代码，并实现行内容不足6行时，自动填充空行为横杠<uni-table emptyText="暂无更多数据"> <uni-tr> <uni-th align="center">号码/姓名</uni-th> <uni-th align="center">项目</uni-th> <uni-th align="center">诊室</uni-th> <uni-th align="center">状态</uni-th> </uni-tr> <uni-tr v-for="item in Now" :key="item.id" v-if="item.calltime>timenow && item.part === 0"> <uni-td align="center">{{ item.num }} {{ item.name }}</uni-td> <uni-td align="center">小部位-激光脱毛</uni-td> <uni-td align="center">{{ item.room }}号诊室</uni-td> <uni-td align="center">已叫号</uni-td> </uni-tr> <uni-tr v-for="item in Now" :key="item.id" v-if="item.calltime==null && item.part === 0"> <uni-td align="center">{{ item.num }} {{ item.name }}</uni-td> <uni-td align="center">小部位-激光脱毛</uni-td> <uni-td align="center">---</uni-td> <uni-td align="center">等待中</uni-td> </uni-table>

可以将重复的代码提取出来，将其封装为组件，并使用计算属性来自动填充空行。具体实现如下：

<template>
  <uni-table :empty-text="emptyText">
    <uni-tr>
      <uni-th align="center">号码/姓名</uni-th>
      <uni-th align="center">项目</uni-th>
      <uni-th align="center">诊室</uni-th>
      <uni-th align="center">状态</uni-th>
    </uni-tr>
    <uni-tr v-for="item in filteredNow" :key="item.id">
      <uni-td align="center">{{ item.num }} {{ item.name }}</uni-td>
      <uni-td align="center">小部位-激光脱毛</uni-td>
      <uni-td align="center">{{ item.room || '---' }}号诊室</uni-td>
      <uni-td align="center">{{ item.calltime ? '已叫号' : '等待中' }}</uni-td>
    </uni-tr>
  </uni-table>
</template>

<script>
export default {
  props: {
    now: {
      type: Array,
      default: () => []
    },
    emptyText: {
      type: String,
      default: '暂无更多数据'
    }
  },
  computed: {
    filteredNow() {
      const rows = Math.max(6, this.now.length);
      const emptyRows = Array(rows - this.now.length).fill({});
      return [...this.now, ...emptyRows];
    }
  }
};
</script>

使用时，将原来的代码替换为组件的引用即可：

<template>
  <div>
    <my-table :now="Now" />
  </div>
</template>

<script>
import MyTable from './components/MyTable.vue';

export default {
  components: { MyTable },
  data() {
    return {
      Now: []
    };
  }
};
</script>