<template>
  <el-row>
    <el-steps class="progressBar" :value="value.status" :active="value.status" :align-center="true" process-status="wait" finish-status="success">
      <el-step title="Booking"/>
      <el-step title="Payment"/>
      <el-step title="Order Confirmation"/>
      <el-step title="Order Complete"/>
    </el-steps>
  </el-row>
</template>

<style type="text/css">
    @media screen and (max-width: 800px) {
		 .progressBar {
            width: 60%;
        }
		
	}
</style>

<script>
export default {
  props: ['value'],
  data: () => ({
  })
}
</script>
