Merge branch 'Dev' of http://www.origtek.com:2999/nelson.kai/ShowEasyFrontEnd into Dev

FrontEnd/components/booking/BookingInfo.vue

@@ -15,12 +15,12 @@
           }}</span>
       </div>
       <div class="tw-flex tw-items-center tw-mb-[11px] md:tw-mb-[18px]">
-        <div class="tw-body-4 tw-text-neutrals-800 tw-mr-[11px] md:tw-body-3">
+        <div id="copyText" class="tw-body-4 tw-text-neutrals-800 tw-mr-[11px] md:tw-body-3">
           {{ BookingOrder.BookingNo }}
         </div>
         <button 
           class="tw-body-5 tw-py-[4px] tw-px-[10px] tw-rounded-[12px] tw-bg-complementary-3 tw-text-complementary-1 md:tw-body-4 hover:tw-text-[#A0B5FF] no-print"
-          @click="copy(BookingOrder.BookingNo)"
+          @click="copyEvent('copyText')"
         >
           {{ $t("Copy") }}
         </button>
@@ -66,7 +66,7 @@
         >
           Go to Pay
         </button> -->
-        <button v-if="BookingOrder.OnSiteService.Provider.ProviderStatus"
+        <button v-if="BookingOrder.OnSiteService.Provider.ProviderStatus != '04' || BookingOrder.OnSiteService.Provider.ProviderStatus != '03'"
           class="tw-py-[10px] tw-px-[19px] tw-rounded-[12px] tw-text-neutrals-400 tw-border-solid tw-border-neutrals-400 tw-border-[1px] xl:tw-col-span-2 hover:tw-bg-neutrals-100 no-print"
           @click="$emit('cancel-booking')"
         >
@@ -122,9 +122,18 @@ import { runInThisContext } from 'vm';
       mybookingStatusMap,
       mypaymentStatusMap,
       bookingColor,
+      copyEvent(id) {
+        var str = document.getElementById(id);
+        window.getSelection().selectAllChildren(str);
+        document.execCommand("Copy")
+      },
       async copy(copyText){
+        if (navigator.clipboard == undefined) {
+          console.log('clipboard is undefined');
+        }else{
           window.navigator.clipboard.writeText(copyText);
         }
+      }
     },
     updated() {
       console.log(this.BookingOrder);