elizebeth/src/xt_pages/outpatientCharges/outpatientInvoice.vue

<template>
    <div class="main-contain outpatientChargesManagement">
        <div class="position">
            <bread-crumb :crumbs='crumbs'></bread-crumb>
        </div>
        <div class="app-container">
            <div style="display: flex;justify-content: space-between;margin-bottom:10px;">
                <div>
                    <el-input size="small" style="width:150px;" @keyup.enter.native='searchAction' v-model.trim="search_input" class="filter-item"/>
                    <el-button size="small" style="margin-left:10px;" class="filter-item" type="primary" @click="searchAction">搜索</el-button>
                </div>
                <el-button size="small" type="danger">删除</el-button>
            </div>
            <el-table :data="tableData" border height="500" style="width: 100%;" :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
                <el-table-column type="selection" width="55" align="center"></el-table-column>
                <el-table-column align="center" prop="name" label="序号">
                    <template slot-scope="scope">{{ scope.row.date }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="操作员">
                    <template slot-scope="scope">{{ scope.row.date }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="发票起">
                    <template slot-scope="scope">{{ scope.row.date }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="发票止">
                    <template slot-scope="scope">{{ scope.row.date }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="状态">
                    <template slot-scope="scope">{{ scope.row.date }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="备注">
                    <template slot-scope="scope">{{ scope.row.date }}</template>
                </el-table-column>
                <el-table-column align="center" prop="name" label="操作">
                    <template slot-scope="scope">
                        <el-button size="mini" type="danger">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>


<script>
import BreadCrumb from '@/xt_pages/components/bread-crumb'
export default {
    components:{
        BreadCrumb,
    },
    data(){
        return{
            crumbs: [
                { path: false, name: '门诊收费' },
                { path: false, name: '门诊发票' }
            ],
            tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄'
            }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄'
            }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄'
            }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄'
            }]
        }
    }
}
</script>