修复html属性的bug!
This commit is contained in:
		@@ -36,6 +36,7 @@ module.exports = {
 | 
			
		||||
    ],
 | 
			
		||||
    rules: {
 | 
			
		||||
        indent: ["warn", 4,],
 | 
			
		||||
        "space-in-parens": ["error", "always", { exceptions: ["empty",], },],
 | 
			
		||||
        "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
 | 
			
		||||
        "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
 | 
			
		||||
        "no-unused-vars": "warn",
 | 
			
		||||
 
 | 
			
		||||
@@ -18,58 +18,59 @@ import { reactive, onMounted } from "vue";
 | 
			
		||||
import * as echarts from "echarts";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
  name: "ArchievementChartComponent",
 | 
			
		||||
  props: {
 | 
			
		||||
    chartData: {
 | 
			
		||||
      type: Array,
 | 
			
		||||
      require: true,
 | 
			
		||||
      default: () => [],
 | 
			
		||||
    name: "ArchievementChartComponent",
 | 
			
		||||
    props: {
 | 
			
		||||
        chartData: {
 | 
			
		||||
            type: Array,
 | 
			
		||||
            require: true,
 | 
			
		||||
            default: () => [],
 | 
			
		||||
        },
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
  setup (props)
 | 
			
		||||
  {
 | 
			
		||||
    const ui = reactive({
 | 
			
		||||
      chart_data: props.chartData,
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    // 设置图表
 | 
			
		||||
    const initCharts = () =>
 | 
			
		||||
    setup( props )
 | 
			
		||||
    {
 | 
			
		||||
      const chartDom = document.getElementById("chartWrapper");
 | 
			
		||||
      const myChart = echarts.init(chartDom as HTMLDivElement);
 | 
			
		||||
      const option = {
 | 
			
		||||
        xAxis: {
 | 
			
		||||
          type: "category",
 | 
			
		||||
          data: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二",],
 | 
			
		||||
        },
 | 
			
		||||
        yAxis: {
 | 
			
		||||
          type: "value",
 | 
			
		||||
          data: [200, 400, 600, 800, 1000,],
 | 
			
		||||
        },
 | 
			
		||||
        series: [
 | 
			
		||||
          {
 | 
			
		||||
            data: props.chartData,
 | 
			
		||||
            type: "line",
 | 
			
		||||
          },
 | 
			
		||||
        ],
 | 
			
		||||
      };
 | 
			
		||||
        const ui = reactive( {
 | 
			
		||||
        } );
 | 
			
		||||
 | 
			
		||||
      option && myChart.setOption(option);
 | 
			
		||||
        // 设置图表
 | 
			
		||||
        const initCharts = () =>
 | 
			
		||||
        {
 | 
			
		||||
            const chartDom = document.getElementById( "chartWrapper" );
 | 
			
		||||
            const myChart = echarts.init( chartDom as HTMLDivElement );
 | 
			
		||||
            const option = {
 | 
			
		||||
                xAxis: {
 | 
			
		||||
                    type: "category",
 | 
			
		||||
                    data: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二",],
 | 
			
		||||
                },
 | 
			
		||||
                yAxis: {
 | 
			
		||||
                    type: "value",
 | 
			
		||||
                    data: [200, 400, 600, 800, 1000,],
 | 
			
		||||
                },
 | 
			
		||||
                series: [
 | 
			
		||||
                    {
 | 
			
		||||
                        data: props.chartData,
 | 
			
		||||
                        type: "line",
 | 
			
		||||
                    },
 | 
			
		||||
                ],
 | 
			
		||||
            };
 | 
			
		||||
 | 
			
		||||
      window.onresize = function ()
 | 
			
		||||
      {
 | 
			
		||||
        // 自适应大小
 | 
			
		||||
        myChart.resize();
 | 
			
		||||
      };
 | 
			
		||||
    };
 | 
			
		||||
            option && myChart.setOption( option );
 | 
			
		||||
 | 
			
		||||
    onMounted(() =>
 | 
			
		||||
    {
 | 
			
		||||
      initCharts();
 | 
			
		||||
    });
 | 
			
		||||
            window.onresize = function ()
 | 
			
		||||
            {
 | 
			
		||||
                // 自适应大小
 | 
			
		||||
                myChart.resize();
 | 
			
		||||
            };
 | 
			
		||||
        };
 | 
			
		||||
 | 
			
		||||
    return { ui, initCharts, };
 | 
			
		||||
  },
 | 
			
		||||
        onMounted( () =>
 | 
			
		||||
        {
 | 
			
		||||
            initCharts();
 | 
			
		||||
        } );
 | 
			
		||||
 | 
			
		||||
        console.log( props );
 | 
			
		||||
 | 
			
		||||
        return { ui, initCharts, props, };
 | 
			
		||||
    },
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -4,8 +4,8 @@
 | 
			
		||||
 * @LastEditors: Kane
 | 
			
		||||
 * @FilePath: /task_schedule/src/components/HonorListComponent.vue
 | 
			
		||||
 * @Description: 光荣榜组件
 | 
			
		||||
 * 
 | 
			
		||||
 * Copyright (c) ${2022} by Kane, All Rights Reserved. 
 | 
			
		||||
 *
 | 
			
		||||
 * Copyright (c) ${2022} by Kane, All Rights Reserved.
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
    <div class="honorlist-wrapper">
 | 
			
		||||
@@ -40,17 +40,17 @@ export default {
 | 
			
		||||
        month: {
 | 
			
		||||
            type: String,
 | 
			
		||||
            require: true,
 | 
			
		||||
            default:()=>"本",
 | 
			
		||||
            default: () => "本",
 | 
			
		||||
        },
 | 
			
		||||
        leadingReward: {
 | 
			
		||||
            type: String,
 | 
			
		||||
            require: true,
 | 
			
		||||
            default:()=>"",
 | 
			
		||||
            default: () => "",
 | 
			
		||||
        },
 | 
			
		||||
        advanceReward: {
 | 
			
		||||
            type: String,
 | 
			
		||||
            require: true,
 | 
			
		||||
            default:()=>"",
 | 
			
		||||
            default: () => "",
 | 
			
		||||
        },
 | 
			
		||||
    },
 | 
			
		||||
    setup()
 | 
			
		||||
@@ -102,7 +102,6 @@ export default {
 | 
			
		||||
            width: 165px;
 | 
			
		||||
            height: 100%;
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        .advance-reward-wrapper {
 | 
			
		||||
@@ -134,4 +133,4 @@ export default {
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -28,8 +28,7 @@
 | 
			
		||||
                </div>
 | 
			
		||||
                <div class="total-archievement-charts-wrapper">
 | 
			
		||||
                    <ArchievementChart
 | 
			
		||||
                        total_archievement="435220"
 | 
			
		||||
                        :chart_data="ui.chartData"
 | 
			
		||||
                        :chart-data="ui.chartData"
 | 
			
		||||
                    />
 | 
			
		||||
                </div>
 | 
			
		||||
            </div>
 | 
			
		||||
@@ -71,35 +70,35 @@ export default {
 | 
			
		||||
    {
 | 
			
		||||
        const router = useRouter();
 | 
			
		||||
        const staffInfo = loadStaffInfo();
 | 
			
		||||
        const ui = reactive({
 | 
			
		||||
        const ui = reactive( {
 | 
			
		||||
            chartData: [200, 230, 224, 218, 135, 147, 260, 800,],
 | 
			
		||||
            totalArchievement: 120000000,
 | 
			
		||||
            dishonorPersons: ["张三", "李四",],
 | 
			
		||||
        });
 | 
			
		||||
        } );
 | 
			
		||||
 | 
			
		||||
        const getTotalArchievement = computed(() =>
 | 
			
		||||
        const getTotalArchievement = computed( () =>
 | 
			
		||||
        {
 | 
			
		||||
            const cnyFormat = new Intl.NumberFormat("zh-cn",
 | 
			
		||||
            const cnyFormat = new Intl.NumberFormat( "zh-cn",
 | 
			
		||||
                {
 | 
			
		||||
                    style: "currency",
 | 
			
		||||
                    currency: "CNY",
 | 
			
		||||
                    minimumFractionDigits: 0,
 | 
			
		||||
                });
 | 
			
		||||
            const archievement = cnyFormat.format(ui.totalArchievement);
 | 
			
		||||
                } );
 | 
			
		||||
            const archievement = cnyFormat.format( ui.totalArchievement );
 | 
			
		||||
 | 
			
		||||
            return archievement;
 | 
			
		||||
        });
 | 
			
		||||
        } );
 | 
			
		||||
 | 
			
		||||
        // 检查存储的登录信息,不存在则返回登录页面
 | 
			
		||||
        if (staffInfo.P13UID === "")
 | 
			
		||||
        if ( staffInfo.P13UID === "" )
 | 
			
		||||
        {
 | 
			
		||||
            ElMessage({
 | 
			
		||||
            ElMessage( {
 | 
			
		||||
                message: "登录信息失效,请重新登录!",
 | 
			
		||||
                type: "success",
 | 
			
		||||
                center: true,
 | 
			
		||||
            });
 | 
			
		||||
            } );
 | 
			
		||||
 | 
			
		||||
            router.push("/login");
 | 
			
		||||
            router.push( "/login" );
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        return { ui, getTotalArchievement, };
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user