mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal.git
synced 2026-08-19 04:24:12 +00:00
omair saleh
121 lines
5.8 KiB
Vue
121 lines
5.8 KiB
Vue
<template>
|
|
<div class="row m-l-0 m-r-0 m-b-30">
|
|
<div class="col bg-white">
|
|
<div class="row align-items-center">
|
|
<div class="col no-padding">
|
|
<div class="row">
|
|
<div class="col">
|
|
<a :href="route('order.qr.download', item.id)">
|
|
<div class="peelable-corner overflow-hidden relative">
|
|
<img :src="'https://chart.googleapis.com/chart?chs=150x150&cht=qr&chl={id:'+item.id+'}'" class="w-100">
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<div class="row m-b-5">
|
|
<div class="col">
|
|
<small class="fs-10 all-caps muted">Order No.</small>
|
|
<h6 class="no-margin small">{{item.reference}}</h6>
|
|
</div>
|
|
</div>
|
|
<div class="row m-b-5">
|
|
<div class="col">
|
|
<small class="fs-10 all-caps muted">Warehouse</small>
|
|
<h6 class="no-margin small">{{item.warehouse === 3 ? 'Guang Zhou' : 'Yiwu'}}</h6>
|
|
</div>
|
|
</div>
|
|
<div class="row m-b-5">
|
|
<div class="col">
|
|
<small class="fs-10 all-caps muted">Delivery Address</small>
|
|
<h6 class="no-margin small">{{item.address.reference}}</h6>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row b-t b-grey">
|
|
<div class="col">
|
|
<div class="row text-center">
|
|
<div class="col b-r b-grey text-info p-t-5 p-b-10">
|
|
<small class="fs-10 all-caps bold">Received</small>
|
|
<h6 class="bold no-margin text-info">0</h6>
|
|
</div>
|
|
<div class="col b-r b-grey text-primary p-t-5 p-b-10">
|
|
<small class="fs-10 all-caps bold">In Transit</small>
|
|
<h6 class="bold no-margin text-primary">0</h6>
|
|
</div>
|
|
<div class="col text-success p-t-5 p-b-10">
|
|
<small class="fs-10 all-caps bold">Delivered</small>
|
|
<h6 class="bold no-margin text-success">0</h6>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row p-t-5 p-b-15 b-t b-grey">
|
|
<div class="col">
|
|
<div class="row">
|
|
<div class="col-auto">
|
|
<small class="fs-10 all-caps muted">Marking</small>
|
|
<h6 class="no-margin small">{{item.company_module.marking}}</h6>
|
|
</div>
|
|
<div class="col">
|
|
<small class="fs-10 all-caps muted">Date</small>
|
|
<h6 class="no-margin small">{{item.created_at}}</h6>
|
|
</div>
|
|
<div class="col-auto text-right">
|
|
<small class="fs-10 all-caps muted">Total CBM</small>
|
|
<h6 class="no-margin semi-bold">0.00</h6>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col no-padding">
|
|
<div class="row">
|
|
<div class="col">
|
|
<a :href="route('order.show', item.reference)">
|
|
<div class="btn btn-sm btn-default bg-master-lighter no-border btn-block b-rad-none">More Details</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto no-padding">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="btn btn-sm btn-default bg-master-light text-info btn-block b-rad-none no-border" @click="expanded = !expanded">
|
|
<i class="fa fa-fw" :class="{'fa-ellipsis-v': !expanded, 'fa-times': expanded}"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<transition-component group enter-class="animate__animated animate__flipInX animate__fast" leave-class="animate__animated animate__fadeOut animate__faster">
|
|
<div class="absolute w-50" style="bottom: 32px; right: 15px;" key="1" v-if="expanded">
|
|
<div class="row">
|
|
<div class="col bg-master-lightest b-a b-grey">
|
|
<div class="row p-t-15 p-b-15 b-b b-grey pointer">
|
|
<div class="col">
|
|
<a :href="route('order.qr.download', item.id)" target="_blank">
|
|
<h6 class="light no-margin fs-13"><i class="fa fa-cloud-download m-r-10"></i>Download QR Cod PDF</h6>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</transition-component>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import componentHandler from '../../../general/mixins/componentHandler';
|
|
export default {
|
|
data(){
|
|
return {
|
|
expanded: false
|
|
}
|
|
},
|
|
mixins: [componentHandler]
|
|
}
|
|
</script> |