elizebeth/src/xt_pages/outpatientDoctorStation/components/inquiriesDetail.vue

<template>
    <el-dialog
        title="详情"
        width="1000px"
        :visible.sync="visible"
        :before-close="_close"
        class="detailDialog"
    >
        <el-tabs v-model="activeName">
            <el-tab-pane label="处方详情" name="first">
                <el-table :data="tableData" border height="350" :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> 
            </el-tab-pane>
            <el-tab-pane label="病历详情" name="second">
                <el-table :data="tableData" border height="350" :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> 
            </el-tab-pane>
        </el-tabs>
        <div slot="footer" class="dialog-footer">
            <el-button @click="hide">取 消</el-button>
            <el-button type="primary" :loading="submitLoading" @click="submitAction()">保 存</el-button>
        </div>
    </el-dialog>         
</template>

<script>
export default {
    data(){
        return{
            visible:false,
            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 弄'
            }],
            activeName:'first'
        }
    },
    methods:{
        _close: function(done) {
            // this.clear()
            done()
        },
        clear: function() {
            this.form.id = 0;
            this.form.name = "";
            this.form.intro = "";
        },
        show() {
            // this.clear()
            this.visible = true
        },
        hide() {
            // this.clear()
            this.visible = false
        },
    }
}
</script>

<style lang="scss">
.detailDialog{
    .el-dialog__body{
        padding: 0 20px 30px;
    }
}
</style>