<template xmlns:v-slot="http://www.w3.org/1999/XSL/Transform">
	<div>
		<el-dialog
			:title="title"
			:close-on-click-modal="false"
			draggable
			append-to-body
			width="500px"
			@close="close"
			v-model="visible">
			<vxe-table
				border="inner"
				size="mini"
				max-height="1000px"
				:data="infoList">
				<vxe-column type="seq" width="60" title="序号"></vxe-column>
				<vxe-column min-width="160" align="center" title="修改时间" field="createTime">
					<template #default="scope">
						<el-link  type="primary" :underline="false" v-if="hasPermission('cw:reimbursement:info:view')" @click="view(scope.row.id)">{{scope.row.createTime}}</el-link>
					</template>
				</vxe-column>
				<vxe-column min-width="160" align="center" title="修改人" field="createName">
				</vxe-column>
			</vxe-table>
			<InfoFormDetail ref="infoFormDetail"></InfoFormDetail>

			<template #footer>
			<span class="dialog-footer">
			  <el-button @click="close()" icon="el-icon-circle-close">关闭</el-button>
			</span>
			</template>
		</el-dialog>
	</div>
</template>

<script>
	import ReimbursementService from '@/api/sys/ReimbursementService';
	import InfoFormDetail from "./InfoFormDetail";
	export default {
		data() {
			return {
				loading: false,
				visible: false,
				infoList: []
			}
		},

		ReimbursementService: null,

		created() {
			this.reimbursementService = new ReimbursementService()

		},
		props: {},
		components: {
			InfoFormDetail
		},
		computed: {

		},
		watch: {},
		methods: {
			init(id) {
				this.title = '报销修改历史'
				this.visible = true
				this.loading = false
				this.$nextTick(() => {
					this.loading = true
					this.reimbursementService.findHistory(id).then((data) => {
						this.infoList = data
						this.loading = false
					})
				})
			},
			close() {
				this.visible = false
			},
			view(id){
				this.$refs.infoFormDetail.init('view', id)
			}
		}
	}

</script>
<style scoped>

</style>
