Vue_New/src/xt_pages/stock/drugs/inventory.vue

<template>
    <div>
        <div style="display: flex;align-items: center;justify-content: space-between;margin-bottom:10px;">
            <div>
                <el-select v-model="value" size="small" placeholder="请选择">
                    <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
                <el-input
                size="small"
                style="width: 200px;margin-left:10px;"
                class="filter-item"
                v-model.trim="searchKey"
                placeholder=""
                />
                <el-button
                size="small"
                class="filter-item"
                type="primary"
                icon="el-icon-search"
                @click="search"
                >搜索</el-button
                >
                <el-date-picker
                size="small"
                v-model="value1"
                type="date"
                style="margin-left:5px;width:140px;"
                placeholder="选择日期">
                </el-date-picker>
                <el-date-picker
                size="small"
                v-model="value2"
                type="date"
                style="margin-left:5px;width:140px;"
                placeholder="选择日期">
                </el-date-picker>
            </div>
            <div>
                <el-button size="small" type="primary" @click="dialogVisible = true">新增</el-button>
                <el-button size="small" type="primary">核对</el-button>
                <el-button size="small" type="primary" @click="print">打印</el-button>
                <el-button size="small" type="primary">导出</el-button>
            </div>
        </div>
        <el-table :data="tableData" border :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)' }">
            <el-table-column
            prop="date"
            label="盘点编号">
            </el-table-column>
            <el-table-column
            prop="date"
            label="盘点日期">
            </el-table-column>
            <el-table-column
            prop="name"
            label="盘点人">
            </el-table-column>
            <el-table-column
            prop="name"
            label="审核日期">
            </el-table-column>
            <el-table-column
            prop="name"
            label="审核人">
            </el-table-column>
            <el-table-column
            prop="name"
            label="状态">
            </el-table-column>
            <el-table-column
            label="操作">
                <template slot-scope="scope">
                    <el-button type="text" size="small">删除</el-button>
                    <el-button type="text" size="small">编辑</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :page-sizes="[5, 10, 50, 100]"
            :page-size="5"
            background
            style="margin-top:20px;text-align: right"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total"
        >
        </el-pagination>
        <el-dialog
        title="库房调价"
        :visible.sync="dialogVisible"
        width="1200px"
        :before-close="handleClose">
            <el-form :model="form" class="modifyDialog" label-width="120px">
                <el-form-item label="耗材ID">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="药品名称">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="规格">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="单位">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="进货价">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="零售价">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="报损数量">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="库存">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="产地">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="批准文号">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="生产厂商">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="备注">
                    <div style="display:flex;">
                        <el-input v-model="form.name"></el-input>
                        <el-button style="margin-left:5px;" type="primary">添加</el-button>
                    </div>
                </el-form-item>
            </el-form>
            <el-table :data="tableData" border :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)' }">
                <el-table-column
                prop="date"
                label="耗材ID"
                width="100">
                </el-table-column>
                <el-table-column
                prop="date"
                label="耗材名称"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="规格"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="单位"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="调价数量"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="原进货价"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="原零售价"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="新零售价"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="生产厂商"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="产地"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="批准文号"
                width="100">
                </el-table-column>
                <el-table-column
                prop="name"
                label="备注"
                width="100">
                </el-table-column>
                <el-table-column
                fixed="right"
                width="100"
                label="操作">
                    <template slot-scope="scope">
                        <el-button type="text" size="small">删除</el-button>
                        <el-button type="text" size="small">编辑</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
export default {
    name: "drugInventory",
    data() {
        return{
            searchKey:'',
            value1:'',
            value2:'',
            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 弄'
            }],
            dialogVisible:false,
            form: {
                name: '',
            },
            total: 0,
            
        }
    },
    methods:{
        search(){

        },
        print(){
            this.$router.push({path:'/stock/stockModifyPricePrint'})
            
        },
        handleSizeChange(){},
        handleCurrentChange(){}

    },
    created(){
    },
    mounted() {
    },
};
</script>