vue如何快速画出这种表格,怎么写最方便?

Question

Answer 1

框架帮你搭好，宽度什么你调整下就好了

<table width="100%" border="1">
    <tbody>
        <tr>
            <td>&nbsp;费别</td>
            <td colspan="3">&nbsp;自保，医保，新农合</td>
            <td>&nbsp;No</td>
            <td colspan="3">&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;科室</td>
            <td colspan="3">&nbsp;</td>
            <td>&nbsp;就诊日期</td>
            <td colspan="3">&nbsp;</td>
        </tr>
        <tr>
            <td rowspan="2">&nbsp;病人姓名</td>
            <td rowspan="2">&nbsp;</td>
            <td>&nbsp;病人性别</td>
            <td colspan="2">&nbsp;</td>
            <td>&nbsp;病人年龄</td>
            <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;手机号</td>
            <td colspan="2">&nbsp;</td>
            <td>&nbsp;门诊病历号</td>
            <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
            <td colspan="2">单位地址</td>
            <td colspan="6"></td>
        </tr>
        <tr>
            <td colspan="2">临床诊断</td>
            <td colspan="6">&nbsp;</td>
        </tr>
        <tr>
            <td colspan="8">药方说明</td>
        </tr>
        <tr>
            <td>医师</td>
            <td colspan="3"></td>
            <td>药品金额</td>
            <td colspan="3">&nbsp;</td>
        </tr>
        <tr>
            <td>审核</td>
            <td>&nbsp;</td>
            <td>调配</td>
            <td>&nbsp;</td>
            <td>黑对</td>
            <td>&nbsp;</td>
            <td>发药</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>医嘱</td>
            <td colspan="7">&nbsp;</td>
        </tr>
        <tr>
            <td colspan="8" align="center"><textarea style="width: 80%; margin: 10px auto;"></textarea></td>
        </tr>

        <tr>
            <td colspan="4" align="center"><button>提交</button></td>
            <td colspan="4" align="center"><button>重置</button></td>
        </tr>
    </tbody>
</table>