index.vue 1.64 KB
<template>
  <div class="bigScreen">
    <div class="bigScreen-con" ref="appRef">
      <dv-loading v-if="loading">Loading...</dv-loading>
      <div v-else>
        <div class="header">
          <div class="d-flex head">
            <dv-decoration-10 class="dv-dec-10" />
            <div class="d-flex">
              <dv-decoration-8 class="dv-dec-8" :color="decorationColor" />
              <div class="title">
                <span class="title-text">{{ products.name }}}</span>
                <dv-decoration-5
                  :dur="1"
                  class="dv-dec-5"
                  :color="decorationColor"
                />
              </div>
              <dv-decoration-8
                class="dv-dec-8"
                :reverse="true"
                :color="decorationColor"
              />
            </div>
            <dv-decoration-10 class="dv-dec-10-s" />
          </div>
        </div>
        <screencontent v-show="isshow"/>
      </div>
    </div>
  </div>
</template>
<script>
import drawMixin from "@/utils/drawMixin";
import screencontent from "./screencontent";
export default {
  mixins: [drawMixin],
  data() {
    return {
      isshow:true,
      loading: true,
      decorationColor: ["#568aea", "#568aea"],
    };
  },
  components: {
    screencontent,
  },
  mounted() {

    // this.timeFn();
    this.cancelLoading();
  },
  beforeDestroy() {
    clearInterval(this.timing);
  },
  methods: {
    cancelLoading() {
      setTimeout(() => {
        this.loading = false;
      }, 500);
    },
  },
  computed: {
    ...mapGetters(["products"]),
  },
};
</script>

<style scoped lang="scss">
@import "./index.scss";
</style>