Merge branch 'master' of http://47.103.154.90:83/r/IEE/Web.V1

gerson

2025-02-13 00d0b83bde14f733c4698c97dbc04f40680f6909

 src/App.vue

@@ -1,87 +1,48 @@
<template>
   <div>
      <el-button type="primary" class="wjj" @click="btnClick">你好啊啊</el-button>
   </div>
   <div>
      <div class="flex flex-col gap-3">
         <div class="flex gap-2">
            <div class="bg-primary-dark-2 size-10"></div>
            <div class="bg-primary size-10"></div>
            <div class="bg-primary-light-3 size-10"></div>
            <div class="bg-primary-light-5 size-10"></div>
            <div class="bg-primary-light-7 size-10"></div>
            <div class="bg-primary-light-9 size-10"></div>

            <div class="test size-10"></div>
   <div class="h-full bg-gray-50 flex flex-col">
      <template v-if="!isLoginPage">
         <AppHeader class="flex-0" />
         <div class="flex-auto !overflow-y-auto bg-[#f4f4f4]" ref="containerRef">
            <div class="w-[63%] mx-auto">
               <router-view></router-view>
            </div>
            <AppFooter></AppFooter>
         </div>
         <div class="flex gap-2">
            <div class="bg-success-dark-2 size-10"></div>
            <div class="bg-success size-10"></div>
            <div class="bg-success-light-3 size-10"></div>
            <div class="bg-success-light-5 size-10"></div>
            <div class="bg-success-light-7 size-10"></div>
            <div class="bg-success-light-9 size-10"></div>
         </div>
         <div class="flex gap-2">
            <div class="bg-warning-dark-2 size-10"></div>
            <div class="bg-warning size-10"></div>
            <div class="bg-warning-light-3 size-10"></div>
            <div class="bg-warning-light-5 size-10"></div>
            <div class="bg-warning-light-7 size-10"></div>
            <div class="bg-warning-light-9 size-10"></div>
         </div>
         <div class="flex gap-2">
            <div class="bg-info-dark-2 size-10"></div>
            <div class="bg-info size-10"></div>
            <div class="bg-info-light-3 size-10"></div>
            <div class="bg-info-light-5 size-10"></div>
            <div class="bg-info-light-7 size-10"></div>
            <div class="bg-info-light-9 size-10"></div>
         </div>
         <the-welcome></the-welcome>
      </div>
      <AChart :style="{ width: '100%', height: '300px' }" :options="chartOptions" @chartReady="onChartReady" :theme="AlloyTheme.isDark.value ? 'dark' : 'light'" :extended-config="{ enableNumberFormat: true }" />
      </template>
      <template v-else>
         <router-view></router-view>
      </template>
   </div>
</template>

<script setup lang="ts">
import { AChart } from '@/alloy/components/charts';
import { ref } from 'vue';
import type { ECOption } from './alloy/components/charts/src/types';
import { AlloyTheme } from './alloy/helper/AlloyTheme';
import { computed, ref, watch } from 'vue';
import { useRoute } from 'vue-router';
import AppFooter from './components/AppFooter.vue';
import AppHeader from './components/AppHeader.vue';

const btnClick = () => {
   AlloyTheme.isDark.value = !AlloyTheme.isDark.value;
   ElMessage.success('你好啊啊');
};
const route = useRoute();
const containerRef = ref<HTMLDivElement | null>(null);

const chartOptions = ref<ECOption>({
   title: {
      text: '示例图表',
   },
   xAxis: {
      type: 'category',
      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
   },
   yAxis: {
      name: '值',
      type: 'value',
   },
   series: [
      {
         name: '值',
         data: [1, 2000, 1500, 80000, 70, 110, 130],
         type: 'bar',
      },
   ],
// 判断是否是登录页面
const isLoginPage = computed(() => {
   return route.path === '/login';
});

const onChartReady = (chart: any) => {
   console.log('图表已准备就绪', chart);
};
// 监听路由变化，滚动到顶部
watch(
   () => route.path,
   () => {
      if (containerRef.value) {
         containerRef.value.scrollTop = 0;
      }
   }
);
</script>
<style scoped lang="scss">
.test {
   background-color: var(--el-color-primary-light-9);

<style>
#app {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}
</style>