1031

DESKTOP-QATJ4FN\Administrator

2022-10-31 74555b20fb93491ee3761df8aeb1082e15a9c36c

1031

 config/index.js

@@ -24,7 +24,7 @@
    },

    // Various Dev Server settings
    host: '0.0.0.0', // can be overwritten by process.env.HOST
    host: 'localhost', // can be overwritten by process.env.HOST
    port: 80, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
    autoOpenBrowser: true,
    errorOverlay: true,

 src/App.vue

@@ -4,7 +4,7 @@
      <mt-header :title="title">
        <mt-button icon="back" slot="left" @click="$router.go(-1)"></mt-button>
        <template v-if="iconRight == 'search'">
          <img slot="right" class="search-right" src="./assets/ico/fangdajing.png" alt="">
          <img slot="right" class="search-right" src="./assets/ico/fangdajing.png" alt />
        </template>
        <template v-else>
          <mt-button icon="more" slot="right"></mt-button>
@@ -12,114 +12,121 @@
      </mt-header>
    </div>
    <div class="body-box">
      <router-view></router-view>
      <transition
        :duration="1000"
        mode="out-in"
        appear
        enter-active-class="animated fadeInRight"
        leave-active-class="animated fadeOut"
        appear-active-class="animated zoomInDown"
      >
        <router-view></router-view>
      </transition>
    </div>
  </div>
</template>

<script>

export default {
  name: 'App',
  created () {
    let title = this.$route.meta.title || '首页'
    this.title = title
  name: "App",
  created() {
    let title = this.$route.meta.title || "首页";
    this.title = title;

    if (this.$route.meta.hasHeader) {
      this.hasHeader = true
    } else{
      this.hasHeader = false
      this.hasHeader = true;
    } else {
      this.hasHeader = false;
    }
    if (this.$route.meta.iconRight) {
      this.iconRight = this.$route.meta.iconRight
    } else{
      this.iconRight = 'default'
      this.iconRight = this.$route.meta.iconRight;
    } else {
      this.iconRight = "default";
    }
    // this.$store.state.className = window.localStorage.getItem('styleName')?window.localStorage.getItem('styleName'):'red'
  },
  watch: {
    $route(val) {
      let title = val.meta.title || '首页'
      this.title = title
      let title = val.meta.title || "首页";
      this.title = title;

      if (val.meta.iconRight) {
        this.iconRight = val.meta.iconRight
      } else{
        this.iconRight = 'default'
        this.iconRight = val.meta.iconRight;
      } else {
        this.iconRight = "default";
      }
      if (val.meta.hasHeader) {
        this.hasHeader = true
      } else{
        this.hasHeader = false
        this.hasHeader = true;
      } else {
        this.hasHeader = false;
      }
    }
  },
  data() {
    return {
      title: '首页',
      title: "首页",
      hasHeader: false,
      iconRight:'default'
    }
      iconRight: "default"
    };
  }
}
};
</script>

<style lang="less" scoped>
  #app{
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    font-family: 'rubik';
    .header-box{
      width: 100%;
      height: 1rem;
      /deep/.mint-header{
        height: 100%;
        background-color: rgba(20,45,55,0.3);
        .is-left{
          .mintui{
            font-size: 20px;
          }
        }
        .mint-header-title{
          font-size: 0.36rem;
          color:rgba(255,255,255,1);
        }
        
      }
      button{
        outline: none;
      }
    }
    .body-box{
      width: 100%;
      height: calc(100% - 1rem);
      box-sizing: border-box;
      overflow-y: auto;
    }
    &.red-theme{
      background: #E9E9E9;
      /deep/.mint-header{
        background: none;
        .mint-header-title{
          font-size: 0.36rem;
          color:#212121;
        }
        .mintui{
          color:#212121;
#app {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  font-family: "rubik";
  .header-box {
    width: 100%;
    height: 1rem;
    /deep/.mint-header {
      height: 100%;
      background-color: rgba(20, 45, 55, 0.3);
      .is-left {
        .mintui {
          font-size: 20px;
        }
      }
      .mint-header-title {
        font-size: 0.36rem;
        color: rgba(255, 255, 255, 1);
      }
    }
    &.black-theme{
      // background: #16171d;
      background: rgb(14,14,15);
    button {
      outline: none;
    }
  }
  .search-right {
    width: .3rem;
    height: .3rem;
  .body-box {
    width: 100%;
    height: calc(100% - 1rem);
    box-sizing: border-box;
    overflow-y: auto;
  }
.mint-search-list{
    position: relative !important;
  &.red-theme {
    background: #e9e9e9;
    /deep/.mint-header {
      background: none;
      .mint-header-title {
        font-size: 0.36rem;
        color: #212121;
      }
      .mintui {
        color: #212121;
      }
    }
  }
  &.black-theme {
    // background: #16171d;
    background: rgb(14, 14, 15);
  }
}
.search-right {
  width: 0.3rem;
  height: 0.3rem;
}
.mint-search-list {
  position: relative !important;
}
</style>

 src/page/home/home.vue

@@ -143,7 +143,7 @@
    <!-- tab -->

    <GoToLogin />
    <foot></foot>
    <!-- <foot></foot> -->
  </div>
</template>


 src/router/index.js

@@ -120,7 +120,7 @@
      meta: {
        title: '行情',
        requireAuth: false,
        hasHeader: true
        hasHeader: false
      },
      component: List
    }, {