国际化配置

QYF-GitLab1

2025-03-03 c2ddf632c8e642813c89e501d402f06c57369a22

 src/App.vue

@@ -1,19 +1,20 @@
<script setup lang="ts">
import { ref } from 'vue';
import Header from './layout/Header.vue';
import TreeMenu from './components/TreeMenu.vue';
import { ref } from "vue";
import Header from "./layout/Header.vue";
import TreeMenu from "./components/TreeMenu.vue";
import { ElConfigProvider } from "element-plus";
import zhCn from "element-plus/es/locale/lang/zh-cn";

const menuItem = ref('/')
const menuItem = ref("/");

const handMenu = (key: string) => {
  menuItem.value = key;
};

</script>

<template>
  <div class="common-layout">
    <el-container>
  <el-config-provider :locale="zhCn">
    <el-container class="common-layout">
      <el-header height="60px">
        <Header @selectMenu="handMenu"/>
      </el-header>
@@ -26,27 +27,5 @@
        </el-main>
      </el-container>
    </el-container>
  </div>
  </el-config-provider>
</template>

<style lang="less">
.common-layout {
  height: 100vh;
  .el-container {
    height: 100%;
  }
  .el-header {
    background-color: #fff;
    color: #333;
    line-height: 60px;
    border-bottom: 1px solid #eee;
  }
  .el-aside {
    background-color: #fff;
    border-right: 1px solid #eee;
  }
  .el-main {
    background-color: #f5f7fa;
  }
}
</style>