<template>
	<el-dialog title="订单详情" :visible.sync="isVisible">
		<el-form>
			<el-row>
				<el-col :span="12">
					<el-form-item label="订单号">
						<span>{{row.no}}</span>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="支付时间">
						<span>{{row.updTime}}</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="订单状态">
						<span v-if="row.status == '2'">取消</span>
						<span v-if="row.status == '3'">待付款</span>
						<span v-if="row.status == '4'">待出行</span>
						<span v-if="row.status == '5'">出行中</span>
						<span v-if="row.status == '6'">已完成</span>
						<span v-if="row.status == '-1'">定损中</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="用户ID/实名">
						<span>{{row.userId}}</span>/
						<span>{{row.username}}</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="配车">
						<span>{{row.vehicleNumberPlat}}</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="取车">
						<span>{{dateFormat(row.orderRentVehicleDetail.startTime)}}</span>
						<span>{{row.orderRentVehicleDetail.startCityName}}{{row.orderRentVehicleDetail.startAddr}}</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="交车公司">
						<span>{{row.startCompanyName}}</span>
						<span>({{row.orderRentVehicleDetail.startCityName}}{{row.orderRentVehicleDetail.startAddr}})</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="还车">
						<span>{{dateFormat(row.orderRentVehicleDetail.endTime)}}</span>
						<span>{{row.orderRentVehicleDetail.endCityName}}{{row.orderRentVehicleDetail.endAddr}}</span>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="收车公司">
						<span>{{row.endCompanyName}}</span>
						<!--<span>({{row.orderRentVehicleDetail.endCityName}}{{row.orderRentVehicleDetail.endAddr}})</span></span>-->
					</el-form-item>
				</el-col>
			</el-row>
			<!--<el-table :data="tableData" border fit highlight-current-row style="width: 100%">
        <el-table-column width="200" align="center" label="房车">
            <template scope="scope">
                <span>{{scope.no}}</span>
            </template>
        </el-table-column>
        
			</el-table>-->
		</el-form>

		<div slot="footer" class="dialog-footer">
			<el-button @click="cancel">取 消</el-button>
			<el-button type="primary" @click="sure">确 定</el-button>
		</div>
	</el-dialog>
</template>
<script>
import { page, saveOrderViolation } from 'api/order/rentVehicle'
import { mapGetters } from 'vuex'
import { formatDate } from '../../../utils/dateFormattor'
import { getToken } from '../../../utils/auth'
import { getOneIllegalRow } from 'api/order/rentVehicle'
import ElRow from 'element-ui/packages/row/src/row'
import ElInput from '../../../../node_modules/element-ui/packages/input/src/input.vue'
import ElCol from 'element-ui/packages/col/src/col'
import ElFormItem from '../../../../node_modules/element-ui/packages/form/src/form-item.vue'
import ElForm from '../../../../node_modules/element-ui/packages/form/src/form.vue'
export default {
	props: ['row'],
	name: 'illegalDialog',
	components: {
		ElForm,
		ElFormItem,
		ElCol,
		ElInput,
		ElRow
	},
	data() {
		return {
			isVisible: false,
			tableData: []
		}
	},
	created() {
		console.log(JSON.stringify(this.row))
	},
	watch: {
		isVisible(newValue, oldValue) {
			if (!newValue) {
				this.$emit('detailEvent', false)
			}
		}
	},
	mounted() {
		let that = this
		this.isVisible = true
	},
	computed: {
		...mapGetters(['elements']),
		getHeaderWithToken() {
			return { Authorization: getToken() }
		}
	},
	methods: {
		/**
		 * 弹框-取消
		 * */
		cancel() {
			this.$emit('detailEvent', false)
		},
		sure: function() {
			this.$emit('detailEvent', false)
		},
		/**
		 * 格式化时间
		 * @param timestamp
		 * @returns {*}
		 */
		dateFormat(timestamp) {
			let date = new Date(timestamp) //时间戳为10位需*1000，时间戳为13位的话不需乘1000
			return formatDate(date, 'yyyy-MM-dd hh:mm')
		}
	}
}
</script>
<style>
.el-form-item__content {
	display: inline-block;
}
</style>
