ALOps_sys1/ALOps_sys_fe/alops-ui/src/views/index.vue

<template>
  <div class="dashboard-container">
    <div class="welcome-message">
      <h1>欢迎进入中国烟草</h1>
      <p>这里是中国烟草的主界面，您可以在这里进行各种操作和管理。</p>
    </div>
  </div>
</template><style scoped>
.dashboard-container {
  padding: 20px;
  text-align: center;
}

.welcome-message {
  margin-top: 50px;
}

.welcome-message h1 {
  font-size: 36px;
  color: #333;
  margin-bottom: 20px;
}

.welcome-message p {
  font-size: 18px;
  color: #666;
  max-width: 800px;
  margin: 0 auto;
}
</style><style scoped>
.dashboard-container {
  padding: 20px;
  text-align: center;
  background-color: #f8f9fa; /* 背景颜色 */
  /* 或者使用背景图片 */
  /* background-image: url('background.jpg');
  background-size: cover;
  background-position: center; */
}

.welcome-message {
  margin-top: 50px;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  background-color: #fff; /* 欢迎信息背景颜色 */
}

.welcome-message h1 {
  font-size: 36px;
  color: #333;
  margin-bottom: 20px;
}

.welcome-message p {
  font-size: 18px;
  color: #666;
  max-width: 800px;
  margin: 0 auto;
}
</style><template>
  <div class="dashboard-container">
    <div class="welcome-message">
      <h1><i class="el-icon-s-operation"></i> 欢迎进入中国烟草</h1>
      <p>这里是中国烟草的主界面，您可以在这里进行各种操作和管理。</p>
    </div>
  </div>
</template>

<style scoped>
.dashboard-container {
  padding: 20px;
  text-align: center;
}

.welcome-message {
  margin-top: 50px;
  animation: fadeIn 1s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.welcome-message h1 {
  font-size: 36px;
  color: #333;
  margin-bottom: 20px;
}

.welcome-message p {
  font-size: 18px;
  color: #666;
  max-width: 800px;
  margin: 0 auto;
}
</style>