<template>
	<div ref="burt" class="white_bg burt-container">
		<Goback ref="goback" title="回款详情" />
		<a-tabs v-model="activeKey" @change="paneChange">
			<a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title">
				<a-form-model ref="ruleForm" :model="form" :rules="rules">
					<a-row :gutter="30">
						<template v-if="activeKey === '0'">
							<a-col :lg="7" :sm="12">
								<a-form-model-item label="保险公司" prop="payorCode">
									<a-select
										v-model="form.payorCode"
										placeholder="请选择保险公司"
										allow-clear
										show-search
										:disabled="!isEdit"
										style="min-width: 200px; max-width: 250px"
										@change="changePayor"
										:filterOption="filterCode"
									>
										<a-select-option v-for="item in companyOptions" :key="item.payorCode" :value="item.payorCode">
											{{ item.longName }}
										</a-select-option>
									</a-select>
								</a-form-model-item>
							</a-col>
							<a-col :lg="5" :sm="12">
								<a-form-model-item label="回款日期" prop="backDate">
									<a-date-picker
										format="YYYY-MM-DD"
										format-value="YYYY-MM-DD 00:00:00"
										v-model="form.backDate"
										placeholder="选择日期"
										allow-clear
										:disabled="!isEdit"
									/>
								</a-form-model-item>
							</a-col>
							<a-col :lg="6" :sm="12">
								<a-form-model-item label="回款金额(人民币)" prop="backAmountCny">
									<a-input
										class="fixed_width"
										type="number"
										v-model="form.backAmountCny"
										placeholder="请输入金额"
										allow-clear
										:disabled="!isEdit"
									/>
								</a-form-model-item>
							</a-col>
							<a-col :lg="5" :sm="12">
								<a-form-model-item label="可核销余额">
									<a-input class="fixed_width" v-model="residueBackAmount" disabled />
								</a-form-model-item>
							</a-col>
							<a-col :lg="7" :sm="12">
								<a-form-model-item label="回款金额(美元)">
									<a-input
										class="fixed_width"
										type="number"
										v-model="form.backAmountUsd"
										placeholder="请输入金额"
										allow-clear
										:disabled="!isEdit"
									/>
								</a-form-model-item>
							</a-col>
							<a-col :lg="5" :sm="12">
								<a-form-model-item label="汇率差">
									<a-input v-model="form.backExchangeRate" placeholder="请输入金额" allow-clear :disabled="!isEdit" />
								</a-form-model-item>
							</a-col>
							<a-col :lg="6" :sm="12">
								<a-form-model-item label="EOB编号">
									<a-input v-model="form.eobNos" placeholder="请输入EOB编号" allow-clear :disabled="!isEdit" />
								</a-form-model-item>
							</a-col>
							<a-col :lg="5" :sm="12">
								<a-form-model-item label="EOB备注">
									<a-input v-model="form.eobRemark" placeholder="请输入EOB备注" allow-clear :disabled="!isEdit" />
								</a-form-model-item>
							</a-col>
							<a-col :lg="5" :sm="12">
								<a-form-model-item label="上传附件">
									<a-upload
										name="file"
										:multiple="false"
										:showUploadList="true"
										:disabled="!isEdit"
										:fileList="fileList"
										:customRequest="(file) => uploadFile(file)"
										:beforeUpload="() => beforeUpload()"
										:remove="(file) => removeFile(file)"
									>
										<a-button type="primary"> <Icon name="ssiupload" :size="18" />上传文件 </a-button>
									</a-upload>
								</a-form-model-item>
							</a-col>
						</template>
						<template v-else>
							<a-col :lg="6" :sm="12">
								<a-form-model-item label="保险公司" prop="payorCode">
									<a-select
										v-model="form.payorCode"
										placeholder="请选择保险公司"
										allow-clear
										show-search
										:disabled="!isEdit"
										style="min-width: 200px"
										@change="changePayor"
										:filterOption="filterCode"
									>
										<a-select-option v-for="item in companyOptions" :key="item.payorCode" :value="item.payorCode">
											{{ item.longName }}
										</a-select-option>
									</a-select>
								</a-form-model-item>
							</a-col>
							<a-col :lg="6" :sm="12">
								<a-form-model-item label="回款金额(人民币)" prop="backAmountCny">
									<a-input
										class="fixed_width"
										type="number"
										v-model="form.backAmountCny"
										placeholder="请输入金额"
										allow-clear
										:disabled="!isEdit"
									/>
								</a-form-model-item>
							</a-col>
							<a-col :lg="6" :sm="12">
								<a-form-model-item label="本次账单回款金额合计">
									<!-- <div class="blue-text">{{ ciReceiptTotalVo.backAmountTotal || 0 }}</div> -->
									<div class="blue-text">{{ accuracy.subtract(form.backAmountCny, residueBackAmount) || 0 }}</div>
								</a-form-model-item>
								
							</a-col>
							<a-col :lg="6" :sm="12">
								<a-form-model-item label="可核销余额">
									<a-input class="fixed_width" v-model="residueBackAmount" disabled />
								</a-form-model-item>
							</a-col>
						</template>
					</a-row>
				</a-form-model>
				<template v-if="activeKey === '1'">
					<div class="bill-content">
						<div class="checked-count">
							<a-button type="primary" size="small" @click="selectAllList">全选</a-button>
							已勾选账单：<span class="blue-text">{{ selectedRowKeys.length || 0 }}</span> 条
							<span v-if="selectedRows.filter(v=> v.status == 2).length != 0">，其中：无效 <span style="color: red;">{{ selectedRows.filter(v=> v.status == 2).length || 0 }}</span> 条</span>
						</div>
						<a-tabs type="card" v-model="activeKey1">
							<a-tab-pane v-for="pane in panes1" :key="pane.key" :tab="pane.title">
								<div>
									<a-row type="flex" align="middle" class="search-form">
										<a-form-model
											ref="searchForm"
											layout="inline"
											:labelCol="{ span: 8 }"
											:wrapperCol="{ span: 16 }"
											:model="searchForm"
										>
											<a-row>
												<a-col :lg="4" :sm="12">
													<a-form-model-item label="账单日期">
														<a-range-picker
															format="YYYY-MM-DD"
															value-format="YYYY-MM-DD"
															v-model="searchForm.billDate"
															:placeholder="['开始时间', '结束时间']"
														/>
													</a-form-model-item>
												</a-col>
												<a-col :lg="4" :sm="12">
													<a-form-model-item label="病历号">
														<a-input
															v-model="searchForm.mrnNo"
															placeholder="请输入病历号"
															allow-clear
															:disabled="!isEdit"
														/>
													</a-form-model-item>
												</a-col>
												<a-col :lg="4" :sm="12">
													<a-form-model-item label="客户名称">
														<a-input
															v-model="searchForm.patientName"
															placeholder="请输入客户名称"
															allow-clear
															:disabled="!isEdit"
														/>
													</a-form-model-item>
												</a-col>
												<a-col :lg="4" :sm="12">
													<a-form-model-item label="状态" :labelCol="{ span: 7 }" :wrapperCol="{ span: 14 }">
														<a-select v-model="searchForm.rStatus" placeholder="请选择状态" allowClear>
															<a-select-option v-for="item in statusOptions" :key="item.code" :value="item.code">
																{{ item.name }}
															</a-select-option>
														</a-select>
													</a-form-model-item>
												</a-col>
												<a-col :lg="4" :sm="12">
													<a-form-model-item label="账单编号">
														<a-input
															v-model="searchForm.receiptNo"
															placeholder="请输入账单编号"
															allow-clear
															:disabled="!isEdit"
														/>
													</a-form-model-item>
												</a-col>
												<a-col class="flex-col" :lg="4" :sm="12">
													<div>
														<a-button type="primary" @click="searchData">
															<Icon name="ssisearch_active" :size="14" />查询
														</a-button>
													</div>
													<div v-if="activeKey1 === '0' && selectedRows.length > 0">
														<a-button type="primary" @click="exportExcel">
															<Icon name="ssidaochu" :size="14" />导出
														</a-button>
													</div>
												</a-col>
											</a-row>
										</a-form-model>
									</a-row>
								</div>
								<!-- 已关联账单 -->
								<template v-if="activeKey1 === '0'">
									<template v-if="selectedRows.length > 0">
										<div class="all-list_box">
											<a-table
												class="table-content"
												:rowClassName="rowClassName"
												:columns="selectedColumns"
												:data-source="selectedRows"
												:rowKey="'id'"
												:scroll="{ x: '100%', y: tableHeight }"
												:pagination="false"
											>
												<template slot="status" slot-scope="text">
													<span :style="{ color: text == 2 ? 'red' : '' }">{{
														text == 1 ? '有效' : text == 2 ? '无效' : ''
													}}</span>
												</template>
												<template slot="patientName" slot-scope="text">
													<a-tooltip placement="top">
														<template slot="title">
															<span>{{ text }}</span>
														</template>
														<span class="ellipsis_">{{ text }}</span>
													</a-tooltip>
												</template>
												<template slot="operation" slot-scope="text, record, index">
													<a-button type="link" class="danger" @click.stop="delRecord(record, index)">删除</a-button>
												</template>
											</a-table>
										</div>
									</template>
									<div class="all-list_box no-data" v-else><a-empty :image="simpleImage" /></div>
								</template>
								<template v-else>
									<!-- table -->
									<template v-if="isEdit">
										<div class="all-list_box">
											<a-table
												class="table-content all-list"
												:columns="columns"
												:data-source="dataList"
												:scroll="{ x: '100%', y: tableHeight1 }"
												:pagination="false"
												:rowKey="'id'"
												:row-selection="{
													selectedRowKeys: selectedRowKeys,
													onSelect: onSelectChange,
													onSelectAll: onSelectAll
												}"
											>
												<template slot="status" slot-scope="text">
													<span :style="{ color: text == 2 ? 'red' : '' }">{{
														text == 1 ? '有效' : text == 2 ? '无效' : ''
													}}</span>
												</template>
												<template slot="patientName" slot-scope="text">
													<a-tooltip placement="top">
														<template slot="title">
															<span>{{ text }}</span>
														</template>
														<span class="ellipsis_">{{ text }}</span>
													</a-tooltip>
												</template>
											</a-table>
											<BurtPagination class="pagination" :pagination="pagination" @pageChange="pageChange" />
										</div>
									</template>
								</template>
							</a-tab-pane>
						</a-tabs>
					</div>
				</template>
			</a-tab-pane>
			<div v-if="isEdit" slot="tabBarExtraContent">
				<a-button class="mar-left10" type="primary" @click="addNewEvt(0)">
					<Icon :name="backMoneyNo ? 'ssibaocun' : 'ssiadd'" :size="14" />暂存
				</a-button>
				<a-button class="mar-left10" type="primary" @click="addNewEvt(1)">
					<Icon :name="backMoneyNo ? 'ssibaocun' : 'ssiadd'" :size="14" />结案
				</a-button>
			</div>
		</a-tabs>
	</div>
</template>

<script>
import { Empty } from 'ant-design-vue';
import Goback from '@/components/Customers/goback';
import BurtPagination from '@/components/Customers/pagation';
import { eobStatusOptions } from '@/assets/js/utilsdictOptions.js';
import { exportFile, accuracy } from '@/utils/index';
import moment from 'moment';
import mixins from '@/mixins';
const panes = [
	{ title: '基础信息', key: '0', show: true, content: 'PaymentClaims' },
	{ title: '账单列表', key: '1', show: false, content: 'Insurance' }
];
export default {
	data() {
		return {
			accuracy,
			isEdit: false,
			eobStatusOptions,
			dialogShow: false,
			ciReceiptTotalVo:{},
			form: {
				payorCode: undefined,
				backDate: null,
				backAmountCny: '',
				backAmountUsd: '',
				backExchangeRate: '',
				eobNos: '', // EOB编号
				eobRemark: '' // EOB备注
			},
			fileList: [], // 上传文件列表
			dataList: [],
			isEditNewEOB: false, //是否在新建回款
			companyOptions: [], //保险公司
			pagination: {
				pageNum: 1,
				pageSize: 5,
				total: 0
			},
			selectedRowKeys: [], // Check here to configure the default column
			selectedRows: [], // Check here to configure the default column
			backMoneyNo: '',
			rules: {
				payorCode: [{ required: true, message: '请选择保险公司', trigger: 'change' }],
				backDate: [{ required: true, message: '请选择回款日期', trigger: 'change' }],
				backAmountCny: [{ required: true, message: '请输入回款金额(人民币)', trigger: ['change', 'blur'] }]
			},

			searchForm: {
				billDate: [],
				mrnNo: '', // 病历号
				patientName: '' // 客户名字
			},
			savedStatus: false, //是否已保存
			relatedList: [],

			panes: Object.seal(panes),
			activeKey: '0',
			activeKey1: '0',
			statusOptions: [
				{
					name: '无效',
					code: 2
				},
				{
					name: '有效',
					code: 1
				}
			],
			tableHeight: 200, // 已关联账单表格高度
			tableHeight1: 200 // 全部账单表格高度
		};
	},
	mixins: [mixins],
	components: {
		Goback,
		BurtPagination
	},
	computed: {
		panes1() {
			const panes = [{ title: '已关联账单', key: '0', show: true, content: 'Associated' }];
			if (this.isEdit) {
				panes.push({ title: '全部账单', key: '1', show: false, content: 'Insurance' });
			}
			return panes;
		},
		columns() {
			const base = [
				{
					title: '账单日期',
					dataIndex: 'receiptDate',
					ellipsis: true,
					width: 160,
					fixed: 'left'
				},
				{
					title: '账单状态',
					dataIndex: 'status',
					ellipsis: true,
					width: 100,
					fixed: 'left',
					scopedSlots: { customRender: 'status' }
				},
				{
					title: '客户姓名',
					dataIndex: 'patientName',
					ellipsis: true,
					fixed: 'left',
					width: 180,
					scopedSlots: { customRender: 'patientName' }
				},
				{ title: '病历号', dataIndex: 'mrnNo', ellipsis: true, width: 195 },
				{ title: '保险公司', dataIndex: 'payorName', ellipsis: true, width: 195 },
				{
					title: '账单编号',
					dataIndex: 'receiptNo',
					ellipsis: true,
					width: 150
				},
				{
					title: '理赔账单金额',
					dataIndex: 'actualAmount',
					ellipsis: true,
					width: 150
				},
				{
					title: '回款金额',
					dataIndex: 'writeOffAmount',
					ellipsis: true,
					width: 150
				},
				{
					title: '未清余额',
					dataIndex: 'residueBackAmount',
					ellipsis: true,
					width: 150
				},
				{
					title: '个人欠费',
					dataIndex: 'arrearsAmountShow',
					ellipsis: true,
					width: 150,
					customRender: (val) => {
						return <span style="color: red;">{val}</span>;
					}
				},
				{
					title: '备注',
					dataIndex: 'remark',
					ellipsis: true,
					width: 200,
					customRender: (val) => {
						return <span style="color: red;">{val}</span>;
					}
				},
				{
					title: '收银',
					dataIndex: 'receiptTellerName',
					ellipsis: true,
					width: 120
				}
			];
			return base;
		},
		selectedColumns() {
			const base = JSON.parse(JSON.stringify(this.columns));
			const changeAmount = this.changeAmount;
			base[7] = {
				title: '回款金额',
				dataIndex: 'backAmount',
				ellipsis: true,
				width: 150,
				customRender: (val, row) => {
					return (
						<a-input-number
							v-model={row.backAmount}
							allow-clear
							disabled={!this.isEdit}
							style={{ color: row.backAmount == row.currentReceiptAmount ? '' : 'red' }}
							onBlur={() => {
								changeAmount(row, 'backAmount');
							}}
						/>
					);
				}
			};
			base[10].customRender = (val, row) => {
				return (
					<div>
						{this.isEdit ? (
							<a-popover title="备注" trigger="click">
								<template slot="content">
									<a-textarea
										class="remark_inp red_inp"
										v-model={row.remark}
										auto-size={{ minRows: 3, maxRows: 5 }}
										allow-clear
										disabled={!this.isEdit}
									></a-textarea>
								</template>
								<a-tooltip>
									<template slot="title">{row.remark}</template>
									<a-input class="red_inp" v-model={row.remark} allow-clear disabled={!this.isEdit} />
								</a-tooltip>
							</a-popover>
						) : (
							<a-tooltip>
								<template slot="title">{row.remark}</template>
								<a-input class="red_inp" v-model={row.remark} disabled />
							</a-tooltip>
						)}
					</div>
				);
			};
			base[8] = {
				title: '未清余额',
				dataIndex: 'residueBackAmount',
				ellipsis: true,
				width: 150,
				customRender: (val, row) => {
					const residueBackAmount =
						Number(row.currentReceiptAmount || 0) - Number(row.backAmount || 0) - Number(row.arrearsAmount || 0);
					return Number(residueBackAmount.toFixed(2));
				}
			};
			base[9] = {
				title: '个人欠费',
				dataIndex: 'arrearsAmount',
				ellipsis: true,
				width: 150,
				customRender: (val, row) => {
					return (
						<a-input-number
							class="red_inp"
							v-model={row.arrearsAmount}
							allow-clear
							disabled={!this.isEdit}
							onBlur={() => {
								changeAmount(row, 'arrearsAmount');
							}}
						/>
					);
				}
			};
			base.splice(7, 0, {
				title: '余末金额',
				dataIndex: 'currentReceiptAmount',
				ellipsis: true,
				width: 150
			});
			base.push({
				title: '回款日期',
				dataIndex: 'backDate',
				ellipsis: true,
				width: 150
			});
			if (this.isEdit) {
				base.push({
					title: '操作',
					dataIndex: 'operation',
					fixed: 'right',
					width: 100,
					scopedSlots: { customRender: 'operation' }
				});
			}
			return base;
		},
		// 可核销余额
		residueBackAmount() {
			let totalMoney = Number(this.form.backAmountCny || 0);
			this.selectedRows.forEach((item) => {
				totalMoney -= Number(item.backAmount);
			});
			return Number(totalMoney.toFixed(2));
		}
	},
	watch: {
		activeKey1() {
			this.searchForm = {
				billDate: [],
				mrnNo: '', // 病历号
				patientName: '' // 客户名字
			};
		}
	},
	created() {
		this.simpleImage = Empty.PRESENTED_IMAGE_SIMPLE;
		const { backMoneyNo, isEdit } = this.$route.query;
		this.backMoneyNo = backMoneyNo;
		this.isEdit = isEdit;
		this._getCompanyOptions();
		if (backMoneyNo) {
			const backMoneyDataDetail = JSON.parse(localStorage.getItem('backMoneyDataDetail') || '{}');
			this.form = backMoneyDataDetail;
			this.form.backDate = this.form.backDate ? moment(this.form.backDate).format('YYYY-MM-DD 00:00:00') : null;

			// 如果有上传附件则显示列表
			if (backMoneyDataDetail.fileList) {
				this.fileList = backMoneyDataDetail.fileList.map((d) => {
					const file = {
						uid: Math.random() * 10000,
						name: d.fileName,
						status: 'done',
						url: d.fileUrl
					};
					return file;
				});
			}
			this.getData();
		}
	},
	mounted() {
		this.calcTableHeight();
		this._getNewEOBList();
	},
	methods: {
		moment,
		// 获取未清余额合计
		getBackMoneyReportCount(params) {
			this.$apis.queryBackReceiptCount({
				...params,
				...this.pagination
			}).then((res) => {
				if (res.returnCode == '0000') {
					console.log(res.content)
					this.ciReceiptTotalVo = res.content
				}
			});
		},
		// 计算表格最大高度
		calcTableHeight() {
			const dom = this.$refs.burt;
			const containterH = dom.clientHeight;
			const gobackH = document.querySelector('.back-container').clientHeight;
			const style = window.getComputedStyle(dom, null);
			const paddingT = parseFloat(style.getPropertyValue('padding-top'));
			const paddingB = parseFloat(style.getPropertyValue('padding-bottom'));
			const paddingSum = paddingT + paddingB;
			this.tableHeight = containterH - 300 - gobackH - paddingSum;
			this.tableHeight1 = containterH - 340 - gobackH - paddingSum;
			// 设置每页展示条数
			const pageSize = Math.floor((this.tableHeight1 - 10) / 32);
			this.$set(this.pagination, 'pageSize', pageSize);
		},
		// 已关联账单表格行类名
		rowClassName(record) {
			return record.hidden ? 'hide_' : '';
		},
		// 账单查询
		searchData() {
			if (this.activeKey1 === '1') {
				this._getNewEOBList();
			} else {
				this.getData();
			}
		},
		// 选择框筛选
		filterCode(input, option) {
			return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
		},
		paneChange() {
			this.$refs.ruleForm[0].clearValidate();
			this.panes.forEach((item) => {
				item.show = false;
			});
			this.panes[Number(this.activeKey)].show = true;
		},
		changeAmount(row) {
			let totalMoney = Number(this.form.backAmountCny || 0);
			this.selectedRows.forEach((item) => {
				totalMoney -= Number(item.backAmount);
			});
			if (totalMoney < 0) {
				this.$message.error('可核销余额不足');
			}
			if (Number(row.actualAmount || 0) - Number(row.backAmount || 0) < 0) {
				this.$message.warning('录入账单回款金额大于账单金额');
			}
		},
		onSelectChange(selectedRow, selected) {
			selectedRow['backAmount'] =
				this.residueBackAmount > selectedRow.currentReceiptAmount
					? selectedRow.currentReceiptAmount
					: this.residueBackAmount;
			if (selected) {
				this.selectedRowKeys.push(selectedRow.id);
				this.selectedRows.push(selectedRow);
			} else {
				const index = this.selectedRowKeys.findIndex((item) => item === selectedRow.id);
				this.selectedRowKeys.splice(index, 1);
				this.selectedRows.splice(index, 1);
				this._confirmDelReceipt([selectedRow]);
			}
			this.addNewEvt(0);
		},
		onSelectAll(selected, selectedRows, changeRows) {
			if (selected) {
				this.selectedRowKeys = this.selectedRowKeys.concat(changeRows.map((item) => item.id));
				changeRows.forEach((item) => {
					const obj = {
						...item,
						backAmount:
							this.residueBackAmount > item.currentReceiptAmount ? item.currentReceiptAmount : this.residueBackAmount
					};
					this.selectedRows.push(obj);
				});
				// this.selectedRows = this.selectedRows.concat(chgRows);
			} else {
				changeRows.forEach((item) => {
					const findIndex = this.selectedRowKeys.findIndex((rowId) => rowId === item.id);
					this.selectedRowKeys.splice(findIndex, 1);
					this.selectedRows.splice(findIndex, 1);
				});
				this._confirmDelReceipt(changeRows);
			}
			this.addNewEvt(0);
		},
		// 全选
		selectAllList() {
			let billDate = this.searchForm.billDate || [];
			this.$apis
				.queryReceiptInfoList({
					pageNum: 1,
					pageSize: this.pagination.total,
					backMoneyNo: this.backMoneyNo,
					payorCode: this.form.payorCode,
					...this.searchForm,
					receiptEndDate: billDate[1] ? billDate[1] + ' 23:59:59' : undefined,
					receiptStartDate: billDate[0] ? billDate[0] + ' 00:00:00' : undefined
				})
				.then((res) => {
					if (res.returnCode == '0000') {
						let content = res.content || {};
						const dataList =
							content.list.map((item) => {
								item.arrearsAmountShow = item.arrearsAmount;
								item.arrearsAmount = '';
								return item;
							}) || [];
						// 
						this.selectedRowKeys = dataList.map(item => item.id)
						this.selectedRows = dataList
						this.addNewEvt(0);
					} else {
						this.$message.error(res.returnMsg);
					}
				});
		},
		delRecord(record, index) {
			this.selectedRowKeys.splice(index, 1);
			this.selectedRows.splice(index, 1);
			if (record.relationed) {
				// 已经关联的调用接口删除
				this._confirmDelReceipt([record]);
			}
		},
		_confirmDelReceipt(records) {
			if (!this.backMoneyNo) return;
			const receiptVoList = records
				.filter((item) => {
					const findIndex = this.relatedList.findIndex((rowId) => rowId === item.id);
					return findIndex > -1;
				})
				.map((item) => {
					return {
						id: item.id
					};
				});
			if (receiptVoList.length === 0) return;
			this.$apis
				.deleteReceiptRecord({
					backMoneyNo: this.backMoneyNo,
					receiptVoList
				})
				.then((res) => {
					if (res.returnCode == '0000') {
						this._getNewEOBList();
					} else {
						this.$message.error(res.returnMsg);
					}
				});
		},
		// 修改保险公司
		changePayor() {
			if (this.selectedRowKeys.length > 0 && (this.form.id || this.savedStatus)) {
				this.$modal.confirm({
					title: '提示',
					content: '是否解除已关联账单',
					okText: '确认',
					cancelText: '取消',
					onOk: () => {
						this.selectedRowKeys = [];
						this.selectedRows = [];
					},
					onCancel: () => {}
				});
			}
			this._getNewEOBList();
		},
		pageChange(pager) {
			this.pagination = {
				...this.pagination,
				...pager
			};
			this._getNewEOBList();
		},
		// 获取保险公司下拉选项
		_getCompanyOptions() {
			this.$apis.getCompanyOptions().then((res) => {
				this.companyOptions = res.content || [];
			});
		},
		// 获取已关联的账单
		getData() {
			if (!this.backMoneyNo) {
				if (this.activeKey1 === '0') {
					this.$message.error('暂未关联账单，请在全部账单中添加账单');
				}
				return;
			}
			let billDate = this.searchForm.billDate || [];
			this.$apis
				.queryBackReceiptList({
					pageNum: 1,
					pageSize: 999,
					backMoneyNo: this.backMoneyNo,
					...this.searchForm,
					receiptEndDate: billDate[1] ? billDate[1] + ' 23:59:59' : undefined,
					receiptStartDate: billDate[0] ? billDate[0] + ' 00:00:00' : undefined
				})
				.then((res) => {
					if (res.returnCode == '0000') {
						this.getBackMoneyReportCount({
							pageNum: 1,
							pageSize: 999,
							backMoneyNo: this.backMoneyNo,
							...this.searchForm,
							receiptEndDate: billDate[1] ? billDate[1] + ' 23:59:59' : undefined,
							receiptStartDate: billDate[0] ? billDate[0] + ' 00:00:00' : undefined
						})
						const list = res.content.list || [];
						let ids = [];
						this.selectedRows = list.map((item) => {
							item.relationed = true;
							ids.push(item.id);
							return item;
						});
						this.selectedRowKeys = this.$lodash.cloneDeep(ids);
						this.relatedList = this.$lodash.cloneDeep(ids);
					} else {
						this.$message.error(res.returnMsg);
					}
				});
		},
		// 获取所有账单
		_getNewEOBList() {
			let billDate = this.searchForm.billDate || [];
			this.$apis
				.queryReceiptInfoList({
					pageNum: this.pagination.pageNum,
					pageSize: this.pagination.pageSize,
					backMoneyNo: this.backMoneyNo,
					payorCode: this.form.payorCode,
					...this.searchForm,
					receiptEndDate: billDate[1] ? billDate[1] + ' 23:59:59' : undefined,
					receiptStartDate: billDate[0] ? billDate[0] + ' 00:00:00' : undefined
				})
				.then((res) => {
					if (res.returnCode == '0000') {
						this.getBackMoneyReportCount({
							pageNum: this.pagination.pageNum,
							pageSize: this.pagination.pageSize,
							backMoneyNo: this.backMoneyNo,
							payorCode: this.form.payorCode,
							...this.searchForm,
							receiptEndDate: billDate[1] ? billDate[1] + ' 23:59:59' : undefined,
							receiptStartDate: billDate[0] ? billDate[0] + ' 00:00:00' : undefined
						})
						let content = res.content || {};
						this.pagination.total = content.total || 0;
						this.dataList =
							content.list.map((item) => {
								item.arrearsAmountShow = item.arrearsAmount;
								item.arrearsAmount = '';
								return item;
							}) || [];
					} else {
						this.$message.error(res.returnMsg);
					}
				});
		},
		//新建/保存回款
		addNewEvt(backStatus) {
			if (!this.form.payorCode) {
				this.$message.warning('请选择保险公司');
				return;
			}
			if (!this.form.backDate) {
				this.$message.warning('请选择回款日期');
				return;
			}
			if (!this.form.backAmountCny && this.form.backAmountCny !== 0) {
				this.$message.warning('请输入回款金额(人民币)');
				return;
			}
			let receiptVoList = this.selectedRows.map((item) => {
				return {
					id: item.id,
					backAmount: item.backAmount,
					arrearsAmount: item.arrearsAmount,
					remark: item.remark
				};
			});
			const flag = receiptVoList.some((item) => {
				const exist = !item.backAmount && item.backAmount !== 0;
				return exist;
			});
			if (flag) {
				this.$message.warning('存在关联账单未输入回款金额');
				return;
			}

			const formData = {
				...this.form,
				receiptVoList,
				backDate: this.form.backDate ? moment(this.form.backDate).format('YYYY-MM-DD HH:mm:ss') : '',
				backMoneyNo: this.backMoneyNo, //回款编号
				backStatus // 0暂存 1结案
			};

			// 上传附件格式转换
			formData.fileList = this.fileList.map((d) => {
				const file = {
					fileName: d.name,
					fileUrl: d.url
				};
				return file;
			});

			this.$apis.saveBackMoney(formData).then((res) => {
				const msg = backStatus === 1 ? '结案' : '暂存';
				if (res.returnCode == '0000') {
					this.backMoneyNo = res.content;
					this.savedStatus = true;
					this.$message.success(`${msg}成功`);
					this.selectedRowKeys = [];
					this.getData();
					this._getNewEOBList();

					// this.$router.go(-1);
				} else {
					this.$message.error(res.returnMsg);
				}
			});
		},

		/* ======== 上传区域 ======== */
		// 上传之前
		beforeUpload() {
			const len = this.fileList.length;
			if (len >= 5) {
				this.$message.warning('不能超过5个文件');
				return false;
			}
			return true;
		},
		// 删除文件
		removeFile(file) {
			let index;
			this.fileList.forEach((item, i) => {
				if (item.uid == file.uid) {
					index = i;
				}
			});
			this.fileList.splice(index, 1);
			return true;
		},
		// 上传文件
		uploadFile(fileData) {
			let formData = new FormData();
			formData.append('file', fileData.file);
			this.$apis.uploadImg(formData).then((res) => {
				fileData.onSuccess();
				let tmp = {
					uid: Math.random() * 10000,
					name: res.original,
					status: 'done',
					url: res.url
				};
				this.fileList.push(tmp);

				this.$forceUpdate();
			});
		},
		//导出报表
		exportExcel() {
			let filter = {
				backMoneyNo: this.backMoneyNo,
				payorCode: this.form.payorCode
			};
			this.$apis.exportBackReceiptList(filter).then((res) => {
				exportFile(res, '已关联账单.xls');
			});
		},
		// 保险公司支持输入搜索
		filterOption(input, option) {
			return option.componentOptions.children[0].text.indexOf(input) >= 0;
		}
	}
};
</script>

<style lang="less" scoped>
.none-label {
	text-align: right;
	.ant-form-item-label {
		opacity: 0;
	}
}
.all-list_box {
	height: calc(100vh - 400px);
	overflow-y: auto;
	&.no-data {
		display: flex;
		justify-content: center;
		align-items: center;
		color: red;
	}
}
.table-content {
	::v-deep {
		tr.hide_ {
			display: none;
		}
		td {
			padding: 5px 16px !important;
		}
	}
}
.search-form {
	.ant-form .ant-form-item {
		margin-bottom: 4px;
	}
	.flex-col {
		display: flex;
		justify-content: space-around;
		align-items: center;
		height: 44px;
	}
}
.ant-btn .icon-class {
	.mg-r(10);
}
.success.ant-btn-link {
	color: #4cd964;
}
.danger.ant-btn-link {
	color: #ff3b30;
}
.burt-container {
	height: calc(100vh - 86px);
	display: flex;
	flex-direction: column;
	padding-bottom: 10px;
	::v-deep {
		.ant-form-item {
			display: flex;
			&.ant-form-item-with-help {
				margin-bottom: 0;
			}
		}
		.ant-tabs {
			flex: 1;
			min-height: 0;
		}
	}
	.fixed_width {
		max-width: 150px;
	}
}
.bill-content {
	overflow-y: auto;
	overflow-x: hidden;
	padding-right: 12px;
	position: relative;
	::v-deep {
		.ant-form-item {
			margin-right: 0;
		}
	}
	.pagination {
		margin-top: 10px;
		::v-deep .jump-page {
			height: 30px;
		}
	}
}
::v-deep .bill-form {
	.ant-form .ant-form-item {
		margin-bottom: 4px !important;
	}
}
.remark_inp {
	width: 300px;
}
.red_inp {
	color: red !important;
	::v-deep .ant-input {
		color: red;
	}
}
.ellipsis_ {
	display: block;
	max-width: 148px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

@media screen and (min-width: 1920px) {
	.all-list_box {
		height: calc(100vh - 420px);
	}
}
@media screen and (min-width: 1440px) {
	.all-list_box {
		height: calc(100vh - 400px);
	}
}
.checked-count{
	position: absolute;
	top: 14px;
	left: 210px;
	z-index: 10;
	button {
		margin-right: 6px;
	}
}
</style>