<template>
  <div id="q-app">
    <router-view />
  </div>
</template>

<script>
export default {
  name: "App",
  methods: {
    disableZoom(event){
      if ((event.metaKey||event.ctrlKey) && (event.key === '+' || event.key === '-' || event.key === '=')) {
        event.preventDefault(); // 阻止默认行为
        console.log('缩放功能已禁用');
      }
    },
    disableZoomByWheel(event) {
      if (event.metaKey||event.ctrlKey) {
        event.preventDefault(); // 阻止缩放
        console.log('鼠标滚轮缩放功能已禁用');
      }
    },
    adjustZoom() {
      console.log('execute...')
      if(window.innerWidth>768){
        const scale = this.$q.platform.is.win?window.devicePixelRatio:1; // 获取用户的系统缩放比例
        document.body.style.zoom = 1 / scale; // 设置缩放以抵消系统缩放

        // 获取实际视口高度和宽度
        const vh = window.innerHeight * scale;
        const vw = window.innerWidth * scale;

        // 将计算结果应用为 CSS 自定义属性

        document.documentElement.style.setProperty('--vh', `${vh}px`);
        document.documentElement.style.setProperty('--vw', `${vw}px`);
      }
    }
  },
  mounted() {
    window.addEventListener('keydown', (event) => this.disableZoom(event));
    window.onload = this.adjustZoom();
    window.addEventListener('wheel', (event) => this.disableZoomByWheel(event), { passive: false });
    window.addEventListener('resize',()=> this.adjustZoom())
  },
  unmounted() {
    window.removeEventListener('keydown', (event) => this.disableZoom(event));
    window.removeEventListener('wheel', (event) => this.disableZoomByWheel(event), { passive: false });
    window.removeEventListener('resize', ()=>this.adjustZoom())
  }
};

</script>
<style>
@import url("//at.alicdn.com/t/c/font_1890699_3sxjt5uqjme.css");
@font-face {
  font-family: "oswald";
  src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf");
}
@font-face{
  font-family: 'FZDBSJW';
  src: local('FZDaBiaoSong-B06S')
}
@font-face {
  font-family: "Cormorant Garamond";
  /* src: url("https://im.oytour.com/tripfont/44b867578f7c49ddaf62f490fcb30264.woff"); */
  src: url("https://im.oytour.com/tripfont/a0ac58046d4c41449843e82f73257d96.woff");
}
@font-face {
  font-family: "Cormorant Garamond2";
  src: url("https://im.oytour.com/tripfont/383f0760bec54bdc8134c7d150a1cd49.otf");
  /* src: url("https://im.oytour.com/tripfont/f5b638796ca24f5da16a5da9e78a6937.woff"); */
}
.text-shadow{
  text-shadow: rgb(0 0 0 / 50%) 2px 2px 5px;
}
.text-subtitle1 {
  font-size: 1.25rem !important;
}
.content-page{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
    Helvetica Neue, Arial, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol,
    Noto Color Emoji, MicrosoftJhengHeiBoldFix, "\5FAE\8EDF\6B63\9ED1\9AD4",
    Microsoft JhengHei;
  font-family:  Roboto, Arial,微軟正黑體修正, 微軟正黑體, "Microsoft JhengHei","Microsoft JhengHei UI", sans-serif !important;
  background-color: #f6f6f6;
}
.rounded-borders{
  border-radius: 8px !important;
}
.section-block {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.f12{
  font-size: 12px !important;
  font-family: "Noto Sans SC", 微软雅黑, "Microsoft YaHei", sans-serif !important;
  font-weight: 400 !important;
}
.fz13{
    font-size: 13px;
}
.fz14{
    font-size: 14px;
}
.fz15{
    font-size: 15px;
}
.fz16{
    font-size: 16px;
}
.fz17{
    font-size: 17px;
}
.fz18{
    font-size: 18px;
}
.fz20{
    font-size: 20px;
}
.fz28{
    font-size: 28px;
}
.text-middle{
  display: flex;
    align-items: center;
}

.BMap_cpyCtrl {
    display: none;
}

.anchorBL {
    display: none;
}
@media only screen and (max-width: 1200px) {
  .section-block {
    max-width: 768px !important;
    padding:0 20px !important;
  }
}
.light-shadow{
  box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.2) !important
}
.product-price {
    font-family: Arial Rounded MT Bold,Arial Rounded MT,sans-serif;
    letter-spacing: 0;
    text-align: right;
}
/************************************ 重新Tree样式  BEGIN************************************/
.q-tree__node-header{
  padding:8px 16px !important;
  position: relative;
  border-radius: unset;
}
body.desktop .q-tree__node .q-focusable:focus > .q-focus-helper,
body.desktop .q-tree__node .q-manual-focusable--focused > .q-focus-helper,
body.desktop .q-tree__node .q-hoverable:hover > .q-focus-helper{
  background: none !important;
  opacity: 1 !important;
}
body.desktop .q-tree__node .q-focus-helper:before,
body.desktop .q-tree__node .q-focus-helper:after{
  background: none !important;
}
.q-tree__node-header:hover{
  background:  #E3F2FD;
}
.q-tree__arrow{
  position: absolute;
  top:50%;
  margin-top: -8px;
  right: 16px;
  color:transparent;
}
.q-tree__arrow::after{
  content: 'keyboard_arrow_down' !important;
  margin-left: -16px;
  font-size: 20px;
  color:#666;
}
.q-tree__arrow--rotate{
  transform: rotate3d(0, 0, 1, 180deg) !important;
}
.q-checkbox__bg{
  border: 1px solid currentColor !important;
}
.q-checkbox__inner{
  color: rgb(0 0 0 / 72%) !important;
}
.q-menu{
  box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.2) !important
}
/************************************ 重新Tree样式  END************************************/
</style>
