<template>
    <div class="all">
        <el-form ref="loginref" :model="form" label-width="110px" :inline="true">
            <div class="search">
                <div class="search_left">
                    <div class="search_left_1">

                        <!-- <el-form-item label="发生时间" prop="fysfsj_date">
                            <el-date-picker v-model="form.fysfsj_date" placeholder="选择日期时间" @change="upload_timeChange"> </el-date-picker>
                        </el-form-item> -->
                        <el-form-item label="姓名" prop="p_xm">
                            <el-input v-model="form.p_xm"></el-input>
                        </el-form-item>
                        <el-form-item label="住院流水号" prop="his_inpatient_no">
                            <el-input v-model="form.his_inpatient_no"></el-input>
                        </el-form-item>
                        <el-form-item label="操作人" prop="his_inpatient_no">
                            <el-input v-model="form.job_number"></el-input>
                        </el-form-item>
                        <el-form-item label="备注" prop="his_inpatient_no">
                            <el-input v-model="form.remark"></el-input>
                        </el-form-item>
                        <el-form-item label="状态" prop="his_inpatient_no">
                            <el-select v-model="form.type" placeholder="请选择上传状态" @change="changeStatus">
                                <el-option v-for="item in uploadStatusArr" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                            </el-select>
                        </el-form-item>
                        <!-- <el-form-item label="结算单号" prop="jshid">
                            <el-input v-model="form.jshid"></el-input>
                        </el-form-item> -->
                        <el-form-item label="病区" prop="nurse_cell_code">
                            <el-select v-model="form.nurse_cell_code" filterable placeholder="选择或搜索病区" @change="changeApart">
                                <el-option  label="请选择病区" value=""> </el-option>
                                <el-option v-for="(item, index) in apartArr" :key="index" :label="item.nurse_cell_name" :value="item.nurse_cell_code"> </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="费用发生时间" prop="brjsrq">
                            <el-date-picker v-model="settleTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="fysfsjChange"> </el-date-picker>
                        </el-form-item>
                        <!-- <el-form-item label="上传状态" prop="status">
                            <el-select v-model="form.status" placeholder="请选择上传状态" @change="changeStatus">
                                <el-option v-for="item in uploadStatusArr" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                            </el-select>
                        </el-form-item> -->
                        <!-- <el-form-item label="是否医保患者" label-width="105px">
                            <el-select v-model="form.if_yb" placeholder="请选择是否医保患者" @change="changeYb">
                                <el-option
                                    v-for="item in medicareArr"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                    >
                                </el-option>
                            </el-select>
                        </el-form-item> -->
                        <!-- <el-form-item label="医保类型">
                            <el-select v-model="form.yb_type" placeholder="请选择类别" @change="changeYbtype">
                                <el-option
                                    v-for="item in medicareTypeArr"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                    >
                                </el-option>
                            </el-select>
                        </el-form-item> -->
                    </div>
                </div>
                <div class="search_middle">
                    <div class="search_middle_1 search_middle_1_top" style="">
                        <el-button type="primary" @click="getList" style="margin-right: 10px;">查询</el-button>
                        <el-button type="primary" @click="resetForm('loginref')" style="margin-left: 0; margin-top: 10px">重置</el-button>
                        <!-- <el-button type="primary">导出</el-button> -->
                        <!-- <el-button type="primary" style="margin-top: 10px; margin-left: -1px">按时间段上传结算清单</el-button> -->
                    </div>
                </div>
            </div>
        </el-form>
        <div class="medim">
            <el-button type="primary" @click.stop="uploadMore">批量上传</el-button>
            <!-- <el-button type="primary" @click.stop="uploadToday"
                >上传当日
                取当天时间未上传的费用清单
            </el-button> -->
            <el-button type="danger" @click.stop="withdrawMore">批量撤销</el-button>
            <!-- <el-button type="primary" @click.stop="withdrawToday"
                >撤销当日
                取当天时间未上传的费用清单
            </el-button> -->
        </div>

        <el-card shadow="never" style="min-height: calc(100vh - 35vh)">
            <el-table
                v-loading="loading"
                ref="multipleTable"
                class="eltable"
                :data="list"
                style="width: 100%"
                :header-cell-style="{  background: '#5490ff', color: 'white' }"
                element-loading-text="拼命加载中"
                :row-key="getRowKeys"
                @select="selectSignle"
                @select-all="selectAll"
            >
                <el-table-column type="selection" :reserve-selection="true" width="50"></el-table-column>
                <el-table-column align="left" property="his_inpatient_no" label="医保住院流水号" width="150px" sortable></el-table-column>
                <el-table-column align="center" property="patient.p_xm" label="姓名" sortable></el-table-column>
                <!-- <el-table-column align="center" property="his_patient_id" label="医保类型"></el-table-column> -->
                <el-table-column align="center" property="created_at" label="上传时间" sortable width="160px"></el-table-column>
                <el-table-column align="center" property="fysfsj_date" label="费用时间" sortable width="100px"></el-table-column>
                <el-table-column align="center" property="job_number" label="操作人"></el-table-column>
                <el-table-column align="center" property="remark" label="备注"></el-table-column>
                <el-table-column align="center" property="type" label="状态">
                    <template slot-scope="scope">
                        <div>
                            {{ scope.row.type.name }}
                        </div>
                    </template>
                </el-table-column>
                <!-- <el-table-column align="center" property="his_patient_id" label="失败原因" width="250px"></el-table-column> -->
                <el-table-column align="center" property="err_msg" label="错误信息" width="150px">
                    <template slot-scope="scope">
                        <div>
                            <el-tooltip class="item" effect="dark" :content="scope.row.err_msg" placement="top-start" style="width: 500px">
                                <span> {{ scope.row.err_msg == '' ? '' : scope.row.err_msg.substr(0, 5) + '........' }}</span>
                            </el-tooltip>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column align="center" property="" label="操作" width="300px">
                    <template slot-scope="scope">
                        <div>
                            <el-button type="danger" size="mini" @click.stop="goDetail(scope.row)">详情</el-button>

                            <!-- <el-button type="danger" size="mini" @click.stop="goDetail(scope.row)">修改比例</el-button> -->
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <pagination v-show="total > 0" :total="total" :page.sync="pageInfo.page" :limit.sync="pageInfo.limit" @pagination="getList()" />
        </el-card>
        <!-- 详情 -->
        <detail :visible.sync="showDetail" :data="currentList" @editSelfPay="editSelfPay" @withdrawToday="withdrawToday" @uploadToday="uploadToday"> </detail>
        <!-- 详情 -->
        <!-- 自付比例 -->
        <el-dialog title="自付比例" :visible.sync="showSelfpay">
            <el-form label-width="110px" :inline="true">
                <el-form-item label="自付比例">
                    <el-select v-model="selfpay" placeholder="请选择比例">
                        <el-option v-for="item in selfPayArr" :key="item.value" :label="item.label" :value="item.value"> </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="showSelfpay = false">取 消</el-button>
                <el-button type="primary" @click="selfPayFun">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import { formatDate, getDay } from '@/utils/utils'
import detail from './components/detail'
import { settleList, uploadSett, cancelSett,nurse_cell_list } from '@/api/inned'
import { basic } from '@/api/bed'
let that
export default {
    components: {
        detail,
    },
    props: {},
    data() {
        return {
            showEdit: false, //
            total: 0,
            pageInfo: {
                page: 1,
                limit: 10,
                sort: undefined,
                order: undefined,
            },
            loading: false,
            form: {
                remark:'',
                job_number:'',
                type:'',
                p_xm:'',
                // brjsrq: '', //结算时间
                fysfsj_date_end: getDay(0, 0),
                fysfsj_date_start: getDay(0, 0),
                // fysfsj_date: '', //发生时间
                his_inpatient_no: '', //流水号
                // jshid: '', //结算单号
                nurse_cell_code:'', //科室
                // status: '2', //上传状态
                // if_yb: '', //是否是医保患者
                // yb_type: '', //医保类型
            },
            settleTime: [getDay(0, 0), getDay(0, 0)], //结算时间
            searchData: {
                order: 'one',
            },
            list: [],
            uploadStatusArr: [
            {
                    value: '',
                    label: '全部',
                },
                {
                    value: 'UNKNOWN',
                    label: '未知',
                },
                {
                    value: 'UPLOAD',
                    label: '上传',
                },
                {
                    value: 'CANCEL',
                    label: '作废',
                },
                {
                    value: 'UPDATE',
                    label: '更新',
                },
                {
                    value: 'FAIL',
                    label: '上传失败',
                },
            ], //上传状态数组
            medicareArr: [
                {
                    value: '0',
                    label: '否',
                },
                {
                    value: '1',
                    label: '是',
                },
            ], //是否医保患者数组
            medicareTypeArr: [
                {
                    value: '0',
                    label: '油田医保',
                },
                {
                    value: '1',
                    label: '东营市医保',
                },
                {
                    value: '2',
                    label: '省内异地',
                },
                {
                    value: '3',
                    label: '省外异地',
                },
            ], //医保类型数组
            apartArr: [], //科室数组
            showDetail: false, //详情蒙层
            current: null, // 当前编辑数据
            currentList: [], // 当前编辑数据 - 数组
            showSelfpay: false, //详情蒙层
            selfPayArr: [
                {
                    value: '0',
                    label: '50%',
                },
                {
                    value: '1',
                    label: '75%',
                },
            ],
            selfpay: '', //自付比例
            selectedList: [], //选中的数据
            isToday: 0, //是否上传当日 1 当日
            today: '', //
        }
    },
    created() {
        this.today = getDay(0, 3600000)
        this.getList()
        this.getApart()
    },
    methods: {

        // 重置
        resetForm(formName) {
            this.$refs.loginref.resetFields()
            this.settleTime = ''
            // this.$refs[formName].resetFields()
            this.getList()
        },
        getList() {
            this.loading = true
            this.list = []
            const qyparams = {
                ...this.pageInfo,
                ...this.form,
            }

            settleList(qyparams)
                .then(response => {
                    this.list = response.data
                    this.total = response.meta.total
                })
                .finally(() => {
                    this.loading = false
                })
        },
        onSubmit() {
            console.log('submit!')
        },

        handleClick(tab, event) {
            this.getList()
        },
        getRowKeys(row) {
            return row.id
        },
        //科室列表
        getApart() {
            nurse_cell_list()
                .then(response => {
                    this.apartArr = response.data
                })
                .finally(() => {})
        },
        //详情
        goDetail(row) {
            this.currentList = []
            this.showDetail = true
            this.current = row
            this.currentList.push(this.current)
        },
        //自付比例 蒙层
        edit() {
            this.showSelfpay = true
        },
        //修改自付比例
        selfPayFun() {
            ;(this.showDetail = false), (this.showSelfpay = false)
        },
        editSelfPay() {
            this.showSelfpay = true
        },
        fysfsjChange(e) {
            if (e.length > 1) {
                var arr = []
                for (var i = 0; i < e.length; i++) {
                    arr.push(formatDate(e[i], 'yyyy-MM-dd'))
                }
                console.log(arr)
                this.form.fysfsj_date_start = arr[0]
                this.form.fysfsj_date_end = arr[1]
                // this.form.brjsrq = arr.toString()
            }
        },
        upload_timeChange(e) {
            var arr = []
            arr.push(formatDate(e, 'yyyy-MM-dd'))
            this.form.fysfsj_date = arr[0]
        },
        //行
        selectSignle(selection, row) {
            this.selectedList = selection
        },
        //全选
        selectAll(selection) {
            this.selectedList = selection
        },
        //批量上传
        uploadMore() {
            console.log(this.selectedList,'lklkllkll')
            // uploadSett
            var that = this
            that.isToday = 0
            if (that.selectedList.length == 0) {
                that.$message('至少选择一条清单')
                return false
            }
            var hisInpatientNoArr = []
            that.selectedList.forEach((element, index) => {
                if (element.type.value == "FAIL") {
                    let x={
                        his_inpatient_no:element.his_inpatient_no,
                        day:element.fysfsj_date
                    }
                    hisInpatientNoArr.push(x)

                }
            })
            if (hisInpatientNoArr.length == 0) {
                that.$message('暂无可上传清单')
                return false
            }
            this.loading = true
            console.log(hisInpatientNoArr)
            uploadSett(hisInpatientNoArr)
                .then(() => {
                    that.getList()
                })
                .finally(() => {
                    this.loading = false
                })
        },
        //上传当日
        uploadToday(x) {
            console.log(x)
            var that = this
            // if (x) {
                this.loading = true
                const qyparams = {
                    his_inpatient_no: this.current.his_inpatient_no,
                    day: this.current.fysfsj_date,
                }
                console.log([qyparams])
                uploadSett([qyparams])
                    .then(response => {
                        that.getList()
                    })
                    .finally(() => {
                        this.loading = false
                    })
            // } else {
            //     var hisInpatientNoArr = []
            //     that.selectedList.forEach((element, index) => {
            //         // if (element.fysfsj_date == that.today) {
            //             if (element.type.value == "FAIL") {
            //                 hisInpatientNoArr.his_inpatient_no.push(element.his_inpatient_no)
            //                 hisInpatientNoArr.day.push(element.fysfsj_date)
            //             }
            //         // }
            //     })
            //     if (hisInpatientNoArr.length == 0) {
            //         that.$message('暂无当日结算清单')
            //         return false
            //     }
            //     this.loading = true
            //     return false
            //     const qyparams = {
            //         his_inpatient_no: hisInpatientNoArr,
            //         day: that.today,
            //     }
            //     uploadSett(qyparams)
            //         .then(response => {
            //             that.getList()
            //         })
            //         .finally(() => {
            //             this.loading = false
            //         })
            // }

        },
        //批量撤销
        withdrawMore() {
            // uploadSett
            var that = this
            if (that.selectedList.length == 0) {
                that.$message('至少选择一条清单')
                return false
            }
            that.isToday = 0
            var hisInpatientNoArr = []
            that.selectedList.forEach((element, index) => {
                if (element.type.value == "UPLOAD") {
                    let x={
                        his_inpatient_no:element.his_inpatient_no,
                        day:element.fysfsj_date
                    }
                    hisInpatientNoArr.push(x)
                }
            })
            if (hisInpatientNoArr.length == 0) {
                that.$message('暂无可撤销清单')
                return false
            }
            this.loading = true
            const qyparams = {
                his_inpatient_no: hisInpatientNoArr,
                day: '',
            }
            cancelSett(hisInpatientNoArr)
                .then(response => {
                    that.getList()
                })
                .finally(() => {
                    this.loading = false
                })
        },
        //批量当日
        withdrawToday() {
            var that = this
            this.loading = true
            const qyparams = {
                his_inpatient_no: this.current.his_inpatient_no,
                    day: this.current.fysfsj_date,
            }
            cancelSett([qyparams])
                .then(response => {
                    that.getList()
                })
                .finally(() => {
                    this.loading = false
                })
        },
        //科室切换
        changeApart(e) {
            this.form.nurse_cell_code = e
            this.getList()
        },
        changeStatus(e) {
            // this.form.status = e
            this.getList()
        },
        changeYb() {},
        changeYbtype() {},
    },
}
</script>

<style lang="scss" scoped>
.eltable {
    ::v-deep .el-input__inner {
        height: 20px;
    }
    ::v-deep .el-table-column--selection {
        .cell {
            padding: 0 14px;
        }
    }
}

.el-card ::v-deep .el-card__body {
    padding: 10px 20px 10px 20px;
}

.el-form-item {
    margin-bottom: 8px;
}
.all {
    font-size: 14px;
    font-family: SourceHanSansCN-Regular;
    color: #666666;
}

::v-deep label {
    font-weight: normal;
}

.top {
    display: flex;
    justify-content: flex-start;
    padding-left: 20px;
}

.buttons {
    font-size: 14px;
    display: flex;
    flex-direction: column;
    padding: 10px 10px;
    margin: 0 5px;
    position: relative;
}

.boderright:after {
    position: absolute;
    top: 45%;
    transform: translateY(-40%);
    right: 0;
    content: '';
    width: 1px;
    height: 48px;
    background-color: black;
}

.rightlast {
    margin-left: 30px;
}

.search {
    background-color: #e3eefb;
    display: flex;
    justify-content: flex-start;
    padding-left: 20px;
    padding-top: 20px;
}

.search_left {
    display: flex;
    flex-direction: column;
}

.font-normal {
    padding-left: 10px;
}

.search_middle {
    display: flex;
    flex-direction: column;
}

.search_middle_1_top {
    margin-bottom: 8px;
    padding-right: 10px;
}

.search_middle .el-checkbox {
    margin-top: 8px;
}

.search_right {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.el-input {
    width: 200px;
}

.el-select {
    width: 200px;
}

.search_right .el-button {
    margin-bottom: 8px;
    width: 160px;
}
.pagination-container {
    margin-bottom: 25px;
}
.medim {
    margin-left: 20px;
    margin-top: 30px;
}
::v-deep .el-table__body-wrapper{
    overflow-y: auto !important;
    height: calc(100vh - 300px) !important;

}
</style>
