update: [UiField] 實作 displayDevice api

Tomas

2021-11-06 54f9eba1c719ccad8e05a318f33fdf39e53531fb

update: [UiField] 實作 displayDevice api

 PAMapp/assets/ts/device.ts

@@ -1,5 +1,4 @@
export function isMobileDevice() {
    let mobileDevices = ['Android', 'webOS', 'iPhone', 'iPad', 'iPod', 'BlackBerry', 'Windows Phone'];
    console.log(navigator.userAgent);
export function isMobileDevice(): boolean {
    const mobileDevices = ['Android', 'webOS', 'iPhone', 'iPad', 'iPod', 'BlackBerry', 'Windows Phone'];
    return mobileDevices.some(e => navigator.userAgent.match(e));
}
}

 PAMapp/components/Ui/UiField.vue

@@ -13,9 +13,10 @@

<script lang="ts">
import { Vue, Component, Prop } from 'vue-property-decorator';
import { isMobileDevice } from '~/assets/ts/device';

@Component
export default class UiCarousel extends Vue {
export default class UiField extends Vue {

  @Prop() span!: number;
  @Prop() icon!: string;
@@ -25,6 +26,10 @@

  currentDevice: 'MOBILE' | 'DESKTOP' = 'MOBILE';

  mounted(): void {
    this.currentDevice = isMobileDevice() ? 'MOBILE' : 'DESKTOP';
  }

  get fieldSpan(): number {
    return this.span || 24;
  }