<template>
    <div>
        <el-card class="el-card">
            <el-form :inline="true" :model="filterQuery" class="query-form" size="mini">
                <el-form-item class="query-form-item">
                    <el-input
                        v-model="filterQuery.code"
                        placeholder="DI产品标识" clearable
                        @keyup.enter.native="keyupErp_submit($event)"
                    ></el-input>
                </el-form-item>
                <el-form-item class="query-form-item">
                    <el-input
                        v-model="filterQuery.name" clearable
                        placeholder="产品名称"
                    ></el-input>
                </el-form-item>
                <el-form-item class="query-form-item">
                    <el-input
                        v-model="filterQuery.spec" clearable
                        placeholder="规格型号"
                    ></el-input>
                </el-form-item>
                <el-form-item class="query-form-item">
                    <el-input
                        v-model="filterQuery.registerNo" clearable
                        placeholder="注册/备案凭证"
                    ></el-input>
                </el-form-item>
                <el-form-item class="query-form-item">
                    <el-select v-model="filterQuery.checkStatus" placeholder="审核状态">
                        <el-option label="全部" value=""></el-option>
                        <el-option label="已审核" value="2"></el-option>
                        <el-option label="未审核" value="1"></el-option>
                        <el-option label="未通过" value="3"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button-group style="display:flex;">
                        <el-button type="primary" icon="el-icon-refresh" @click="onReset"></el-button>
                        <el-button type="primary" icon="search" @click="search">查询</el-button>
                        <el-button type="primary" @click="addDiProductVisible=true">新增</el-button>
                    </el-button-group>
                </el-form-item>
            </el-form>

            <el-table
                :data="list"
                style="width: 100%"
                v-loading="loading"
                highlight-current-row="true"
            >
                <el-table-column label="序号" type="index"></el-table-column>
                <el-table-column
                    label="产品标识"
                    prop="nameCode"
                    show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                    label="产品名称"
                    prop="cpmctymc"
                    show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                    label="规格型号"
                    prop="ggxh"
                    show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                    label="医疗器械注册人"
                    prop="ylqxzcrbarmc"
                    show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                    label="注册证编号"
                    prop="zczbhhzbapzbh"
                    show-overflow-tooltip
                ></el-table-column>
                <el-table-column label="审核状态" prop="status" show-overflow-tooltip>
                    <template slot-scope="scope">
                        <span>{{ checkMap[scope.row.status] }}</span>
                    </template>
                </el-table-column>

                <el-table-column label="操作" fixed="right">
                    <template slot-scope="scope">
                        <el-button
                            type="text"
                            size="small"
                            @click="detail(scope.row)"
                        >详情
                        </el-button>
                        <el-button
                            type="text"
                            size="small"
                            :disabled="scope.row.status ==2"
                            @click="deleteProduct(scope.row.id)"
                        >删除
                        </el-button>
                    </template>
                </el-table-column>

            </el-table>
            <el-pagination
                :page-size="filterQuery.limit"
                @current-change="handleCurrentChange"
                layout="prev, pager, next"
                :total="total"
                :current-page="filterQuery.page"
            ></el-pagination>
        </el-card>

        <el-dialog
            title="新增配送产品"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :visible.sync="addDiProductVisible"
            width="85%"
            append-to-body
            v-if="addDiProductVisible"
        >
            <thrAddDiProductSelectUdi
                :closeDialog="closeDialog"
                :relId="relId"
                :isImportUdi="isImportUdi"
                :data="thisData"
                @closeUdi="closeUdi"
            >
            </thrAddDiProductSelectUdi>
        </el-dialog>

        <el-dialog
            title="器械信息详情"
            :close-on-click-modal="false"
            :close-on-press-escape="false"
            :visible.sync="detailDialog"
            width="65%"
            append-to-body
            v-if="detailDialog"
        >
            <selectDiDetail :editQuery="diDetails">
            </selectDiDetail>
        </el-dialog>

    </div>
</template>
<script>

import {getThrDiProducts, delThrDiProducts, getDiProductDetail} from "@/api/thrsys/thrProductsAddDi";
import thrAddDiProductSelectUdi from "@/views/thrsys/ThrAddDiProductSelectUdi";
import selectDiDetail from "../basic/SelectDIDetailDialog"

export default {
    data() {
        return {
            filterQuery: {
                code: null,
                name: null,
                spec: null,
                registerNo: null,
                manufactory: null,
                checkStatus: null,
                page: 1,
                limit: 20,
            },
            total: 0,
            thirdSys: [],
            thirdSysDetail: null,
            list: [],
            addDiProductVisible: false,
            checkVisible: false,
            newType: 2,
            thrProductsDetailVisible: false,
            isImportUdi: false,
            relId: null,
            thisData: {
                nameCode: null,
                cpmctymc: null,
                ggxh: null
            },
            loading: false,
            checkMap: {
                1: "未审核",
                2: "已审核",
                3: "未通过",
            },
            curRow: null,
            diDetails: null,
            detailDialog: false
        };
    },

    methods: {
        onReset() {
            this.$router.push({
                path: "",
            });
            this.filterQuery = {
                code: null,
                spec: null,
                registerNo: null,
                manufactory: null,
                checkStatus: null,
                name: null,
                page: 1,
                limit: 20,
            };
            this.getList();
        },
        search() {
            this.filterQuery.page = 1;
            this.getList();
        },
        checDialog(row) {
            this.checkVisible = true;
            this.curRow = row;
        },
        getList() {
            this.loading = true;
            getThrDiProducts(this.filterQuery)
                .then((response) => {
                    if (response.code == 20000) {
                        this.list = response.data.list || [];
                        this.total = response.data.total || 0;
                    } else {
                        this.$message.error(response.message);
                    }
                    this.loading = false;
                })
                .catch(() => {
                    this.loading = false;
                    this.list = [];
                    this.total = 0;
                });
        },
        handleCurrentChange(val) {
            this.filterQuery.page = val;
            this.getList();
        },
        detail(row) {
            let query = {uuid: row.uuid};
            getDiProductDetail(query).then((res) => {
                if (res.code === 20000) {
                    this.diDetails = res.data;
                    this.detailDialog = true;
                } else {
                    this.$message.error("参数错误");
                }
            })
        },
        deleteProduct(id) {
            let query = {
                id: id
            };
            delThrDiProducts(query).then((res) => {
                if (res.code === 20000) {
                    this.$message.success("删除成功");
                    this.getList();
                } else {
                    this.$message.error("删除失败")
                }
            })
        },
        closeDialog() {
            this.selectErpDialogVisible = false;
            this.selectLocalVisible = false;
            this.selectVersionVisible = false;
        },
        closeUdi(val) {
            this.addDiProductVisible = false;
            if (val) {
                this.getList();
            }
        },
    },
    components: {
        thrAddDiProductSelectUdi, selectDiDetail
    },
    mounted() {
    },
    created() {
        this.getList();
    },
};
</script>
