<template>
    <div class="main-contain outpatientChargesManagement">
        <div class="position">
            <bread-crumb :crumbs='crumbs'></bread-crumb>
        </div>
        <div class="app-container">
            <div class="cell clearfix">
                <el-input size="small" @keyup.enter.native='searchAction' style="width:150px;" v-model.trim="search_input" class="filter-item"/>
                <el-button size="small" style="margin:0 10px;" class="filter-item" type="primary" @click="searchAction">搜索</el-button>
                <el-date-picker v-model="selected_date" prefix-icon="el-icon-date" @change="handleScheduleDateChange" :editable="false" :clearable="false" style="width: 196px;" type="date" placeholder="选择日期时间" align="right" size="small"></el-date-picker>
            </div>
            <el-table :data="tableData" border style="width: 100%;" :row-style="{ color: '#303133' }" :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
                <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">{{ 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>
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :page-sizes="[10, 50, 100]"
                :page-size="10"
                background
                style="margin-top:20px;float: right"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
            >
            </el-pagination>
        </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 弄'
            }],
        }
    },
    methods:{
    }
}
</script>

