cief/shipping-portal
1
0
Fork 0
mirror of https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal.git synced 2026-08-19 04:24:12 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
e7c0e17ee499d4b7515a8db5e8f426b432d1aff6
shipping-portal/resources/assets/vue/components/orders/elements/OrderComponent.vue
T
edmondlang e7c0e17ee4 Merge branch 'master' of https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal into multi-payment-final 
# Conflicts:
# app/Classes/Modules/Segments/ControllersLogic/UpdateConstantPostcodeLogic.php
# app/Classes/ValueObjects/Constants/TransactionType.php
# routes/api.php
# routes/web.php
2023-04-28 18:20:42 +08:00

169 lines
11 KiB
Vue
Raw Blame History

<template>
<div class="row m-l-0 m-r-0 m-b-30 parentContainer">
<div class="col bg-white">
<div class="row align-items-center">
<div class="col-6 no-padding">
<div class="row">
<div class="col">
<a :href="route('order.qr.download', item.id)" target="_blank">
<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-6">
<div class="row m-b-5">
<div class="col">
<div class="row">
<div class="col">
<small class="fs-10 all-caps muted">Order No</small>
</div>
</div>
<div class="row">
<div class="col-9 p-r-0">
<h6 class="no-margin small" style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{{item.reference}}</h6>
</div>
<div class="col p-l-0" v-if="item.remarks.length >= 1">
<i class="fa fa-info-circle m-l-5" data-html="true" v-tooltip:right="'<h6 class=\'text-white text-left fs-13 m-t-0 m-b-5 semi-bold\'>Remarks</h6><p class=\'text-white text-left lh-17 no-margin\'>'+item.remarks[0].content+'</p>'" ></i>
</div>
</div>
</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.name}} {{$store.getters.isAdmin ? item.warehouse.reference : ''}}</h6>
</div>
</div>
<div class="row m-b-5">
<div class="col">
<div class="row">
<div class="col">
<small class="fs-10 all-caps muted">Delivery Address</small>
</div>
</div>
<div class="row">
<div class="col-9 p-r-0">
<h6 class="no-margin small" style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{{item.address.reference}}</h6>
</div>
<div class="col p-l-0">
<div class="row"><div class="col"><div class="row"><div class="col"></div></div><div class="row"><div class="col"></div></div></div></div>
<i class="fa fa-info-circle m-l-5" data-html="true" v-tooltip:right="'<h6 class=\'text-white text-left fs-13 m-t-0 m-b-5 semi-bold\'>'+item.address.reference+'</h6><p class=\'text-white text-left lh-17 no-margin\'>'+item.address.street_one+' '+(item.address.street_two ? item.address.street_two : '')+', '+ item.address.district.name+', '+item.address.post_code+' '+item.address.state.name+', '+item.address.country.name+'</p>'" ></i>
</div>
</div>
</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" v-if="item.parcels" >{{item.parcels.received_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
<h6 class="bold no-margin text-info" v-else > - </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" v-if="item.parcels" >{{item.parcels.in_transit_packages.flatMap(packing_list => packing_list.packages).concat(item.parcels.destination_warehouse_packages.flatMap(packing_list => packing_list.packages)).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
<h6 class="bold no-margin text-info" v-else > - </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" v-if="item.parcels" >{{item.parcels.delivered_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
<h6 class="bold no-margin text-info" v-else > - </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" v-if="$store.getters.isAdmin">
<small class="fs-10 all-caps muted">Marking</small>
<a :href="route('customer.profile', item.company_module.marking)">
<h6 class="no-margin small">{{item.company_module.marking}}</h6>
</a>
</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" v-if="item.parcels">{{(Math.ceil((item.parcels.origin_warehouse_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.in_transit_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.destination_warehouse_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.delivered_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0)) * 10000) / 10000).toFixed(3)}}</h6>
<h6 class="bold no-margin text-info" v-else > - </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 requestModal" v-if="item.status !== 5" data-type="cancelOrder">
<div class="col">
<h6 class="light no-margin fs-13 text-danger"><i class="fa fa-times m-r-10"></i>Cancel Order</h6>
</div>
</div>
<div class="row p-t-15 p-b-15 b-b b-grey pointer requestModal" v-if="item.status === 5" data-type="restoreOrder">
<div class="col">
<h6 class="light no-margin fs-13 text-success"><i class="fa fa-history m-r-10"></i>Restore Order</h6>
</div>
</div>
<a :href="route('order.qr.download', item.id)" target="_blank">
<div class="row p-t-15 p-b-15 b-b b-grey pointer">
<div class="col">
<h6 class="light no-margin fs-13"><i class="fa fa-cloud-download m-r-10"></i>Download QR Cod PDF</h6>
</div>
</div>
</a>
</div>
</div>
</div>
</transition-component>
</div>
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="cancelOrder">
<cancel-order-form-component :data="item" section="oderList" class="text-center"></cancel-order-form-component>
</modal-component>
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="restoreOrder">
<restore-order-form-component :data="item" section="oderList" class="text-center"></restore-order-form-component>
</modal-component>
</div>
</template>
<script>
import componentHandler from '../../../general/mixins/componentHandler';
export default {
created(){
$('[data-toggle="tooltip"]').tooltip()
},
data(){
return {
expanded: false
}
},
mixins: [componentHandler]
}
</script>
Reference in New Issue View Git Blame Copy Permalink