<template>
    <div>
        <el-card class="el-card">
            <div>
                <el-form
                    :inline="true"
                    :model="query"
                    style="display: flex"
                    label-width="480px"
                    size="mini"
                >
                    <el-form-item class="query-form-item" label-width="100px">
                        <el-input
                            v-model="query.code"
                            placeholder="UDI码"
                            style="width: 500px"
                            @keyup.enter.native="keyup_submit($event)"
                        ></el-input>
                    </el-form-item>

                    <el-form-item style="display: flex">
                        <el-button type="primary" icon="search" @click="getList"
                        >查询
                        </el-button
                        >
                    </el-form-item>
                </el-form>

                <el-table
                    :data="list"
                    style="width: 100%"
                    highlight-current-row="true"
                    v-loading="erpLloading"
                >
                    <el-table-column label="序号" type="index"></el-table-column>
                    <el-table-column
                        label="UDI码"
                        prop="code"  width="200"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="订单号"  width="150"
                        prop="orderIdFk"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="产品名称"
                        width="150"
                        prop="cpmctymc"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="注册人名称"
                        width="200"
                        prop="ylqxzcrbarmc"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="注册证号"
                        prop="zczbhhzbapzbh"
                        width="150"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="批次号"
                        prop="batchNo"
                        width="120"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="生产日期"
                        width="120"
                        show-overflow-tooltip
                        prop="produceDate"
                    ></el-table-column>
                    <el-table-column
                        label="失效日期"
                        prop="expireDate"
                        width="120"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="序列号"
                        prop="serialNo"
                        width="120"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        label="数量"
                        width="100"
                        prop="count"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column label="操作" fixed="right" width="120">
                        <template slot-scope="scope">
                            <el-button
                                type="text"
                                size="small"
                                @click.native.stop="deleteDialog(scope.row)"
                            >删除
                            </el-button
                            >
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                    :page-size="query.limit"
                    @current-change="handleCurrentChange"
                    layout="prev, pager, next"
                    :total="pageTotal"
                ></el-pagination>
            </div>
        </el-card>
    </div>
</template>

<script>
    import {getNeedCodes, delNeedCodes} from "../../api/warehouse/codeNeedRl";

    export default {
        data() {
            return {
                query: {
                    code: null,

                    page: 1,
                    limit: 10,
                },

                list: [],
                pageTotal: 1,
                total: 1,
                currentRow: null,
                loading: false,
                erpLloading: false,
                multipleUdiSelection: [],
            };
        },
        methods: {
            getList() {
                if (this.query.code == null || this.query.code == "") {
                    this.$message.warning("请输入条码查询！");
                    return;
                }
                this.loading = true;
                getNeedCodes(this.query)
                    .then((response) => {
                        if (response.code == 20000) {
                            this.loading = false;
                            this.list = response.data.list || [];
                            this.total = response.data.total || 0;
                        } else {
                            this.$message.error(response.message);
                        }
                    })
                    .catch(() => {
                        this.loading = false;
                        this.list = [];
                        this.total = 0;
                    });
            },

            checkSelectable(row, index) {
                return !row.check;
            },
            handleCurrentChange(val) {
                this.query.page = val;
                this.getList();
            },

            intentDetail(row) {
                this.$emit("productInfo", row);
                this.closeDialog();
            },

            keyup_submit(event) {
                console.log("全选----");
                this.getList();
                event.target.select();
            },
            deleteDialog(row) {
                this.$confirm("此操作将永久删除该条码, 是否继续?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                })
                    .then(() => {
                        this.deleteCode(row.id);
                    })
                    .catch(() => {
                    });
            },
            deleteCode(data) {
                this.loading = true;
                let query = {
                    id: data
                };
                delNeedCodes(query)
                    .then((response) => {
                        if (response.code == 20000) {
                            this.getList();
                            this.$message({
                                type: "success",
                                message: "删除成功！",
                            });
                        }

                    })
                    .catch(() => {
                    });
            },
        },
    };
</script>

<style scoped>
    .checkitemTag {
        float: left;
        text-align: left;
        margin-top: 5px;
        width: 100%;
    }
</style>
