企业详情

linwe

2024-11-07 cd52a0e51b6b87ace1376414d94301a0e721678a

企业详情

 public/images/wrapper-box-bg.png

 src/styles/page/index.scss

@@ -2,6 +2,7 @@

  .left-container,
  .right-container {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    position: absolute;

 src/views/companyInfo/components/centerContainer.vue

@@ -59,7 +59,7 @@
    
<style lang="scss" scoped >
.center-container {
    margin: -35px auto;
    margin: 10px auto;
    color: #fff;
    pointer-events: auto;
}
@@ -69,27 +69,25 @@
.center-name {
    font-size: 30px;
    margin: 10px 0;
    margin-left: 45px;
    font-family: YouSheBiaoTiHei;

}

.button-group {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: -6px 0;
    margin-top: 26px;
    cursor: pointer;

}

.button-group button {
    width: 120px;
    height: 40px;
    border: none;
    border-radius: 20px;
    background-color: transparent;
    color: #fff;
    font-size: 25px;
    font-size: 18px;
    font-family: YouSheBiaoTiHei;
    background-image: url(/images/mode-tab-ac.png);
}

.center-info {

 src/views/companyInfo/index.vue

@@ -21,7 +21,7 @@
<template>
    <div class="container page-container">
        <!-- <left-container></left-container> -->
        <centerContainer :button-index="buttonIndex" @childEvent="handleChildEvent"></centerContainer> <!-- 修改这里 -->
        <centerContainer :button-index="buttonIndex" @childEvent="handleChildEvent"></centerContainer>
        <right-container :button-index="buttonIndex"></right-container>
        <main-menu-vue></main-menu-vue>
    </div>
@@ -33,4 +33,70 @@
    width: 100%;
    height: 100%;
}

.page-container {

    .left-container,
    .right-container {
        margin-top: 60px;
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 0;
        width: 400px;
        height: calc(100% - 80px);
        pointer-events: auto;
        background: rgba(28, 115, 195, 0.2);
        margin-right: 40px;

        &>div {
            display: flex;
            flex-direction: column;

            .title-box {
                position: relative;
                height: 38px;
                line-height: 38px;
                background: url(/images/title-box.png) no-repeat center / 100% 100%;

                .title {
                    margin-left: 30px;
                    text-align: left;
                    font-size: 18px;
                    font-family: Alibaba PuHuiTi;
                    font-weight: bold;
                    font-style: italic;
                    color: transparent;
                    text-shadow: 0px 2px 8px rgba(5, 28, 55, 0.42);
                    background-image: linear-gradient(180deg, rgba(14, 197, 236, 0.36) 5%, rgba(49, 190, 255, 0.36) 20%, rgba(255, 255, 255, 1) 40%);
                    -webkit-background-clip: text;
                    -webkit-text-fill-color: transparen
                }

                .title-sub {
                    position: absolute;
                    right: 10px;
                    bottom: 4px;
                    line-height: 1;
                }
            }

            .content-box {
                display: flex;
                flex-direction: column;
                height: calc(100% - 38px);
            }
        }

        .chart-box {
            // background:  rgba(42,64,120,0.68);
        }
    }

    .left-container {}

    .right-container {
        right: 0;
    }
}
</style>

 src/views/layout/index.vue

@@ -12,7 +12,7 @@
  <div class="wrapper">
    <map-container ref="MapContainer">
      <template #content>
        <div v-if="showContent" class="main-content" id="MainContent">
        <div v-if="showContent" :class="[showSubLayout ? 'main-content-sub' : 'main-content']" id="MainContent">
          <main-search></main-search>
          <main-tool></main-tool>

@@ -179,5 +179,84 @@
      bottom: 40px;
    }
  }


  .main-content-sub {
    height: 1080px;
    background: url(/images/wrapper-box-bg.png) no-repeat center / 100% 100%,
      url(/images/pro-bg.png) no-repeat center / 100% 100%;

    pointer-events: none;

    .main-header {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 40px;
      pointer-events: auto;

      .title {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        width: 640px;
        height: 40px;
        font-size: 24px;
        font-family: YouSheBiaoTiHei;
        font-weight: 400;
        color: #eff8fc;
        line-height: 40px;
        text-align: center;
        letter-spacing: 8px;
        font-weight: bolder;
        background: linear-gradient(to bottom,
            #e2eaf0 0%,
            #aed1f1 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        // opacity: 0.89;
        // text-shadow: 0px 4px 1px rgba(19, 80, 143, 0.66);

        // background: linear-gradient(0deg, rgba(119, 186, 255, 0.45) 0%, rgba(233, 248, 255, 0.45) 73.3154296875%, rgba(255, 255, 255, 0.45) 100%);
        // -webkit-background-clip: text;
        // -webkit-text-fill-color: transparent;
      }


      .login-out {
        position: absolute;
        top: 10px;
        right: 40px;
        height: 36px;
        color: #fff;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;

        .img {
          width: 16px;
          height: 16px;
        }

        span {
          font-size: 13px;
        }
      }
    }

    .main-container {
      position: absolute;
      top: 40px;
      left: 40px;
      right: 40px;
      bottom: 40px;
    }
  }
}
</style>