Merge remote-tracking branch 'origin/master'

cuilei

2025-06-13 1e653db94c24389cc7615fd4a7ef1d63b00af534

 src/views/dnc/base/TerminalIndex.vue

@@ -10,7 +10,8 @@
        <template v-for="(item,index) in buttonList">
          <a-col :span="6" v-if="index<4">
            <div :class="'button button'+(index+1)" @click="navigateTo(item)">
              <img :src="require(`@/assets/terminal/${item.routePath}.svg`)"/>
              <!--<img :src="require(`@/assets/terminal/${item.routePath}.svg`)"/>-->
              <i :class="'iconfont icon-'+item.routePath"/>
              <div>{{item.label}}</div>
            </div>
          </a-col>
@@ -21,7 +22,7 @@
        <template v-for="(item,index) in buttonList">
          <a-col :span="6" v-if="index>=4">
            <div :class="'button button'+(index+1)" @click="navigateTo(item)">
              <img :src="require(`@/assets/terminal/${item.routePath}.svg`)"/>
              <i :class="'iconfont icon-'+item.routePath"/>
              <div>{{item.label}}</div>
            </div>
          </a-col>
@@ -97,18 +98,20 @@
  }
</script>

<style scoped lang="less">
<style scoped>
  @import '~@assets/terminal/iconfont.css';

  .page-header {
    font-size: 2vw;
    color: #000;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1vw;
  }

    span {
      font-size: 1.3vw;
      color: #999;
    }
  .page-header span {
    font-size: 1.3vw;
    color: #999;
  }

  .content-container {
@@ -117,78 +120,79 @@
    flex-direction: column;
    padding: 3% 10%;

    .ant-row {
      flex: 1;
  }

      .ant-col {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
  .ant-row {
    flex: 1;
  }

        .button {
          width: 9.63vw;
          height: 9.38vw;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          font-size: 1.3vw;
          color: #fff;
          border-radius: 1vw;
          cursor: pointer;
          transition: all .1s ease-in-out;
  .ant-col {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

          img {
            width: 2.6vw;
            margin-bottom: 0.8vw;
          }
  img {
    width: 2.6vw;
    margin-bottom: 0.8vw;
  }

          &:hover {
            transform: scale(1.05);
          }
  .button {
    width: 9.63vw;
    height: 9.38vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 1.3vw;
    color: #fff;
    border-radius: 1vw;
    cursor: pointer;
    transition: all .1s ease-in-out;
  }

          &.button1 {
            background: linear-gradient(top, #5ADEAD, #3BC3A6);
            background: -webkit-linear-gradient(top, #5ADEAD, #3BC3A6);
          }
  .button:hover {
    transform: scale(1.05);
  }

          &.button2 {
            background: linear-gradient(top, #76A9FA, #5B8CF3);
            background: -webkit-linear-gradient(top, #76A9FA, #5B8CF3);
          }
  .button1 {
    background: linear-gradient(to bottom, #5ADEAD, #3BC3A6);
    background: -webkit-linear-gradient(to bottom, #5ADEAD, #3BC3A6);
  }

          &.button3 {
            background: linear-gradient(top, #FAB976, #FB9557);
            background: -webkit-linear-gradient(top, #FAB976, #FB9557);
          }
  .button2 {
    background: linear-gradient(to bottom, #76A9FA, #5B8CF3);
    background: -webkit-linear-gradient(to bottom, #76A9FA, #5B8CF3);
  }

          &.button4 {
            background: linear-gradient(top, #5FC2F9, #45A4F4);
            background: -webkit-linear-gradient(top, #5FC2F9, #45A4F4);
          }
  .button3 {
    background: linear-gradient(to bottom, #FAB976, #FB9557);
    background: -webkit-linear-gradient(to bottom, #FAB976, #FB9557);
  }

          &.button5 {
            background: linear-gradient(top, #62F2EA, #55D6CE);
            background: -webkit-linear-gradient(top, #62F2EA, #55D6CE);
          }
  .button4 {
    background: linear-gradient(to bottom, #5FC2F9, #45A4F4);
    background: -webkit-linear-gradient(to bottom, #5FC2F9, #45A4F4);
  }

          &.button6 {
            background: linear-gradient(top, #91A0F5, #6D7CF7);
            background: -webkit-linear-gradient(top, #91A0F5, #6D7CF7);
          }
  .button5 {
    background: linear-gradient(to bottom, #62F2EA, #55D6CE);
    background: -webkit-linear-gradient(to bottom, #62F2EA, #55D6CE);
  }

          &.button7 {
            background: linear-gradient(top, #FF6A5A, #DB5A50);
            background: -webkit-linear-gradient(top, #FF6A5A, #DB5A50);
          }
  .button6 {
    background: linear-gradient(to bottom, #91A0F5, #6D7CF7);
    background: -webkit-linear-gradient(to bottom, #91A0F5, #6D7CF7);
  }

          &.button8 {
            background: linear-gradient(top, #FFF248, #EADE46);
            background: -webkit-linear-gradient(top, #FFF248, #EADE46);
          }
        }
      }
    }
  .button7 {
    background: linear-gradient(to bottom, #FF6A5A, #DB5A50);
    background: -webkit-linear-gradient(to bottom, #FF6A5A, #DB5A50);
  }

  .button8 {
    background: linear-gradient(to bottom, #FFF248, #EADE46);
    background: -webkit-linear-gradient(to bottom, #FFF248, #EADE46);
  }
</style>