<template>
	<q-card flat class="q-pa-md" style="background:#080655;width:30vw;min-width: 375px;">
        <div class="row items-end">
          <img src="../assets/images/green_pic.jpg" style="width:100px;" />
          <div class="q-ml-md f12 text-grey-4 col text-right">水口支店　店番593</div>
        </div>
        <div class="q-mt-md">
          <div class="f12 text-grey-1" style="opacity:.3">帳戶名：</div>
          <div class="pf text-grey-4 text-weight-bolder text-subtitle1">株式会社ピースインターナショナル</div>
        </div>
        <div class="q-mt-md">
          <div class="f12 text-grey-1" style="opacity:.3">口座番號：</div>
          <div class="pf text-grey-4 text-weight-bolder text-subtitle1">
            593-1070078
            <span class="f12 text-grey-1  text-weight-400" style="opacity:.5">(レギュラー口座)</span>
          </div>
        </div>
        <div class="q-mt-md">
          <div class="f12 text-grey-1" style="opacity:.3">銀行住所</div>
          <div class="pf text-grey-1 text-weight-bolder f12" style="opacity:.5">滋賀県甲賀市水口町本綾野5－21 （0748－65－1011）</div>
        </div>
        <div class="q-mt-md text-right">
          <q-btn color="white" outline class="q-px-lg" style="opacity:.6" dense :label="$t('hotelorder.copy')"
            @click="setCopyHandler(null, '行名：京都銀行\n支店名：水口支店　店番593\n口座種別：レギュラー口座\n口座番号： 593-1070078\n账户名：株式会社ピースインターナショナル\n银行住所：滋賀県甲賀市水口町本綾野5－21\n银行邮变：〒528-0037\n電話番号：0748－65－1011\n')" />
        </div>
      </q-card>
</template>

<script lang="ts">
import { defineComponent, reactive,toRefs, PropType, computed, ref, toRef, Ref } from 'vue'
import { copyToClipboard, useQuasar } from 'quasar'
import { useI18n } from 'vue-i18n'
export default defineComponent({
	name: '',
	props: {
		
	},
	setup(props,context) {
    const { t } = useI18n()
    const data = reactive({
      copyId:0
    })
    const methods = {
      setCopyHandler(order: any, ctx?: string) {
        if (ctx) {
          data.copyId = -1
          copyToClipboard(ctx)
        } else {
          data.copyId = order.OrderId
          copyToClipboard(order.OrderNo)
        }

        setTimeout(() => {
          data.copyId = 0
        }, 2000)
        context.emit('change')
      },
    }
		return { 
      ...toRefs(data),
      ...methods, }
	}
})
</script>
