<template>
	<div class="content-main">
		<el-row :id="$route.query.state == 'export' ? 'tjcbData' : ''">
			<el-row class="titles" id="protectedItems"
				>市级储备粮进销存表</el-row
			>
			<div id="reportDataReview"></div>
			<el-row class="titlesMor">
				上报单位:{{ detailData.sskdmc }}

				<span style="float: right"
					>上报期数:{{ detailData.sbqs
					}}<span style="margin: 0 10px 0 50px">单位:吨</span></span
				>
			</el-row>
			<el-row>
				<el-form :model="detailData" ref="detailData" :rules="rules">
					<el-table
						:data="detailData.tjmxs"
						stripe
						border
						fit
						highlight-current-row
						style="width: 100%"
					>
						<!-- show-summary
            :summary-method="getSummaries" -->
						<el-table-column
							prop="pzmc"
							align="center"
							label="细目"
						>
						</el-table-column>
						<el-table-column
							prop="qckc"
							align="center"
							label="期初库存"
						>
							<template slot-scope="scope">
								{{
									String(scope.row.qckc).indexOf('.') > -1
										? Number(scope.row.qckc).toFixed(3)
										: scope.row.qckc
								}}
							</template>
						</el-table-column>
						<el-table-column align="center" label="本期收入">
							<el-table-column
								prop="bqsr"
								align="center"
								label="小计"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.bqsr).indexOf('.') > -1
											? Number(scope.row.bqsr).toFixed(3)
											: scope.row.bqsr
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="grsl"
								align="center"
								label="购入"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.grsl).indexOf('.') > -1
											? Number(scope.row.grsl).toFixed(3)
											: scope.row.grsl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="bksl"
								align="center"
								label="补库"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.bksl).indexOf('.') > -1
											? Number(scope.row.bksl).toFixed(3)
											: scope.row.bksl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="zrsl"
								align="center"
								label="移入"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.zrsl).indexOf('.') > -1
											? Number(scope.row.zrsl).toFixed(3)
											: scope.row.zrsl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="lrsl"
								align="center"
								label="轮入"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.lrsl).indexOf('.') > -1
											? Number(scope.row.lrsl).toFixed(3)
											: scope.row.lrsl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="qtsrsl"
								align="center"
								label="转入"
								width="120"
							>
								<template slot-scope="scope">
									<span>{{
										String(scope.row.qtsrsl).indexOf('.') >
										-1
											? Number(scope.row.qtsrsl).toFixed(
													3
											  )
											: scope.row.qtsrsl
									}}</span>
								</template>
							</el-table-column>
						</el-table-column>
						<el-table-column align="center" label="本期支出">
							<el-table-column
								prop="bqzc"
								align="center"
								label="小计"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.bqzc).indexOf('.') > -1
											? Number(scope.row.bqzc).toFixed(3)
											: scope.row.bqzc
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="xssl"
								align="center"
								label="销售"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.xssl).indexOf('.') > -1
											? Number(scope.row.xssl).toFixed(3)
											: scope.row.xssl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="zcsl"
								align="center"
								label="移出"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.zcsl).indexOf('.') > -1
											? Number(scope.row.zcsl).toFixed(3)
											: scope.row.zcsl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="shsl"
								align="center"
								label="损耗"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.shsl).indexOf('.') > -1
											? Number(scope.row.shsl).toFixed(3)
											: scope.row.shsl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="lcsl"
								align="center"
								label="轮出"
							>
								<template slot-scope="scope">
									{{
										String(scope.row.lcsl).indexOf('.') > -1
											? Number(scope.row.lcsl).toFixed(3)
											: scope.row.lcsl
									}}
								</template>
							</el-table-column>
							<el-table-column
								prop="qtzcsl"
								align="center"
								label="转出"
								width="120"
							>
								<template slot-scope="scope">
									<span>{{
										String(scope.row.qtzcsl).indexOf('.') >
										-1
											? Number(scope.row.qtzcsl).toFixed(
													3
											  )
											: scope.row.qtzcsl
									}}</span>
								</template>
							</el-table-column>
						</el-table-column>
						<el-table-column
							prop="qmkc"
							align="center"
							label="期末库存"
						>
							<template slot-scope="scope">
								{{
									String(scope.row.qmkc).indexOf('.') > -1
										? Number(scope.row.qmkc).toFixed(3)
										: scope.row.qmkc
								}}
							</template>
						</el-table-column>
					</el-table>
					<el-row style="margin-top: 10px">
						<el-col :span="24">
							<el-form-item
								prop="remark"
								label="备注"
								label-width="100px"
							>
								<el-input
									class="inputWidBz"
									disabled
									placeholder="请输入"
									v-model="detailData.remark"
								></el-input>
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="8">
							<el-form-item
								prop="tbr"
								label="填报人"
								label-width="100px"
							>
								<el-input
									class="inputWid"
									disabled
									placeholder="请输入"
									v-model="detailData.tbr"
								></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item
								prop="shry"
								label="审核人"
								label-width="100px"
							>
								<el-input
									:disabled="detailF"
									class="inputWid"
									placeholder="请输入"
									v-model="detailData.shry"
								></el-input>
							</el-form-item>
						</el-col>
						<el-col :span="8">
							<el-form-item
								prop="dwfzr"
								label="单位负责人"
								label-width="100px"
							>
								<el-input
									disabled
									class="inputWid"
									placeholder="请输入"
									v-model="detailData.dwfzr"
								></el-input>
							</el-form-item>
						</el-col>
					</el-row>
				</el-form>
			</el-row>
		</el-row>

		<span class="detail-footer">
			<el-button
				v-if="!detailF"
				type="primary"
				size="small"
				class="iconfont icontijiao"
				@click="saveChange()"
				>通过</el-button
			>
			<el-button
				v-if="!detailF"
				type="primary"
				size="small"
				@click="reject"
				class="iconfont iconbohui"
				>驳回</el-button
			>

			<el-button
				v-if="$route.query.state == 'export'"
				type="primary"
				size="small"
				class="iconfont icondaochu11"
				@click="exportTable"
				>导出</el-button
			>
			<el-button
				type="primary"
				size="small"
				class="iconfont iconfanhui"
				@click="returnList"
				>返回</el-button
			>
		</span>
	</div>
</template>
<script>
import {
	selectInvAdjSummary,
	save,
	update,
	selectDetail,
} from '@/api/unregulatedReserves/reportDataReview/index'
import htmlToPdf from '@/utils/htmlToPdf'
export default {
	data() {
		return {
			cFlag: false,
			detailData: {
				tjmxs: [],
				sskdmc: sessionStorage.getItem('orgName'),
			},
			rules: {
				shry: {
					required: true,
					trigger: 'blur',
					message: '请输入',
				},
			},
			detailF: false,
		}
	},
	created() {
		if (
			this.$route.query.state == 'detail' ||
			this.$route.query.state == 'export'
		) {
			this.detailF = true //禁用内容
			this.getDetail()
		} else if (this.$route.query.state == 'audit') {
			this.detailF = false 
			this.getDetail()
		}
	},
	methods: {
		exportTable() {
			let _this = this
			setTimeout(function () {
				htmlToPdf.downloadPDF(
					document.querySelector('#tjcbData'),
					'市级储备粮实际库存管理平衡表-调节储备.pdf',
					1,
					'1550px'
				)
			}, 100)
		},
		getDetail() {
			selectDetail({ id: this.$route.query.id }).then((res) => {
				if (res.infoCode == '200') {
					this.detailData = res.data
					this.detailData.tjmxs = res.data.tjmxs
					if (this.detailData.gz) {
						if (this.detailData.gz.indexOf('newSeal') == -1) {
							this.$nextTick(() => {
								this.$ShowSeal('reportDataReview', 1)
								this.$SetSealData(
									this.detailData.gz,
									0,
									'lingdao',
									1
								)
							})
						} else {
							this.$nextTick(() => {
								this.$signatureOnload(
									'reportDataReview',
									this.detailData.gz.substring(7)
								)
							})
						}
					}
					if (this.$route.query.state == 'audit') {
						this.detailData.shry =
							sessionStorage.getItem('userName')
					}
				}
			})
		},
		//驳回
		reject() {
			this.$refs.detailData.validate((valid) => {
				if (valid) {
					this.$confirm('是否确认驳回？', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning',
					})
						.then(() => {
							this.doRejectTodo()
						})
						.catch(() => {
							this.$message({
								type: 'info',
								message: '已取消驳回',
							})
						})
				}
			})
		},
		doRejectTodo() {
			let data = {
				...this.detailData,
				id: this.$route.query.id,
				zt: '91000004',
				ztmc: '上报驳回',
			}
			update(data)
				.then((res) => {
					if (res.infoCode == '200') {
						this.$message({
							message: '驳回成功',
							type: 'success',
						})
						this.returnList()
					} else {
						this.$message({
							message: '驳回失败',
							type: 'error',
						})
					}
				})
				.catch((res) => {
					this.$message({
						message: res.msg,
						type: 'error',
					})
				})
		},
		returnList() {
			this.$router.go(-1)
		},
		saveChange() {
			this.$refs.detailData.validate((valid) => {
				if (valid) {
					let data = {
						...this.detailData,
						id: this.$route.query.id,
						zt: '91000005', //审核通过
						ztmc: '审核通过',
					}
					update(data).then((res) => {
						if (res.infoCode == '200') {
							this.$message({
								message: '审核成功',
								type: 'success',
							})
							this.returnList()
						} else {
							this.$message({
								message: '审核失败',
								type: 'error',
							})
						}
					})
				}
			})
		},
	},
}
</script>
<style scoped>
.titles {
	width: 100%;
	text-align: center;
	font-size: 18px;
}
.titlesMor {
	font-size: 16px;
	margin-left: 10px;
	margin-bottom: 50px;
}
.inputWid {
	width: 80%;
}
.inputWidBz {
	width: 94.5%;
}
#tjcbData {
	padding: 20px 50px;
	font-size: 18px;
}
</style>
<style>
#reportDataReview {
	position: relative;
}

#reportDataReview > div {
	top: -20px !important;
	left: 255px !important;
}
</style>