<template>
    <el-dialog
        title="核对开票信息"
        :visible.sync="isOpenCardeds"
        :destroy-on-close="true"
        width="30%"
        custom-class="my-reader-card"
        :show-close="true"
        :close-on-click-modal="false"
    >
        <div class="medtihuj">
            <div style="font-weight: 600">温馨提示</div>
            <div>请确认发票信息和手机号</div>
        </div>
        <div style="margin-top: 20px">
            <el-form :model="outinvoicform" ref="formRef" label-width="150" class="header-search-label-styles filter-form">
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="身份证号/单位税号" prop="idCard">
                            <el-input v-model="outinvoicform.id_card" placeholder="体检类型" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="交款人类型">
                            <el-select v-model="outinvoicform.payerType" placeholder="请选择">
                                <el-option label="个人" value="1" />
                                <el-option label="单位" value="2" />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="结算号">
                            <el-input v-model="outinvoicform.jshId" placeholder="税号" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="手机号" prop="mobile">
                            <el-input v-model="outinvoicform.mobile" placeholder="手机号" />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="患者姓名/单位名称" prop="name">
                            <el-input v-model="outinvoicform.name" placeholder="总金额" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="患者ID">
                            <el-input disabled v-model="outinvoicform.patientId" placeholder="患者ID" />
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="开票总金额">
                            <el-input disabled v-model="outinvoicform.totalAmount" placeholder="开票总金额" />
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="InvoicingFun" type="primary">开票</el-button>
                <el-button @click="isOpenCardeds = false" type="danger" plain>取消</el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script>
import { outinvoicing } from '@/api/changeFree'
export default {
    components: {},
    props: {
        isOpenCarded: Boolean,
        patientData: {
            type: Object,
            default() {
                return ''
            },
        },
    },
    data() {
        return {
            formRef: null,
            isOpenCardeds: false,
            outinvoicform: {
                patient:{
                    name: '',
                    his_id: '',
                    id_card: '',

                },
                payerType: '1',
                id_card: '',
                jshId: '',
                mobile: '',
                name: '',
                patientId: '',
                totalAmount: '',
            },
        }
    },
    watch: {
        isOpenCarded: {
            handler(v) {
                this.isOpenCardeds = v
                if (v === true) {
                    this.$nextTick(() => {
                        this.outinvoicform.jshId = this.patientData.jshid
                        this.outinvoicform.id_card = this.patientData.id_card_number
                        this.outinvoicform.mobile = this.patientData.patient.phone
                        this.outinvoicform.name = this.patientData.patient.name
                        this.outinvoicform.patientId = this.patientData.patient.his_id
                        this.outinvoicform.totalAmount = this.patientData.patient_burden
                         this.outinvoicform.rcpt_no = this.patientData.rcpt_no
                    })
                } else {
                    return false
                }
            },
        },
    },
    methods: {
        // 开票
        async InvoicingFun() {
            let param = {
                cardNo: this.outinvoicform.patientId,
                idCard:this.outinvoicform.id_card,
                jobNumber: localStorage.getItem('jobNumber') ?? '',
                jshId: this.outinvoicform.jshId,
                mobile: this.outinvoicform.mobile,
                name: this.outinvoicform.name,
                patientId: this.outinvoicform.patientId,
                payerType: this.outinvoicform.payerType,
                rcptNo: this.outinvoicform.rcpt_no,
                totalAmount: this.outinvoicform.totalAmount,
            }

            const res = await outinvoicing(param)
            if (res.code == 200) {
                this.$message({
                    message: '开票成功',
                    type: 'success',
                })
                this.isOpenCardeds = false
            }
            else {
                this.$message({
                    message: res.msg,
                    type: 'error',
                })
            }
        },
        // // 关闭弹窗
        // handleCloseModal() {
        //     this.$emit('closeReadcard', false)
        //     this.PatientInfo = {}
        // },
        closeWebSocket() {
            this.websocket.close()
        },
    },
}
</script>
<style lang="scss" scoped>
::v-deep {
    .el-form-item {
        // display: flex;
        display: inline-block;
    }
}
.medtihuj {
    font-size: 16px;
    background-color: #e3f2ff;
    color: #2e6dff;
    border: 1px #2e6dff solid;
    padding: 6px;
    border-radius: 9px;
}
</style>
