修复html属性的bug!
This commit is contained in:
parent
8053360878
commit
6f4dbdbd7e
|
@ -36,6 +36,7 @@ module.exports = {
|
||||||
],
|
],
|
||||||
rules: {
|
rules: {
|
||||||
indent: ["warn", 4,],
|
indent: ["warn", 4,],
|
||||||
|
"space-in-parens": ["error", "always", { exceptions: ["empty",], },],
|
||||||
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
|
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
|
||||||
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
|
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
|
||||||
"no-unused-vars": "warn",
|
"no-unused-vars": "warn",
|
||||||
|
|
|
@ -18,58 +18,59 @@ import { reactive, onMounted } from "vue";
|
||||||
import * as echarts from "echarts";
|
import * as echarts from "echarts";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "ArchievementChartComponent",
|
name: "ArchievementChartComponent",
|
||||||
props: {
|
props: {
|
||||||
chartData: {
|
chartData: {
|
||||||
type: Array,
|
type: Array,
|
||||||
require: true,
|
require: true,
|
||||||
default: () => [],
|
default: () => [],
|
||||||
|
},
|
||||||
},
|
},
|
||||||
},
|
setup( props )
|
||||||
setup (props)
|
|
||||||
{
|
|
||||||
const ui = reactive({
|
|
||||||
chart_data: props.chartData,
|
|
||||||
});
|
|
||||||
|
|
||||||
// 设置图表
|
|
||||||
const initCharts = () =>
|
|
||||||
{
|
{
|
||||||
const chartDom = document.getElementById("chartWrapper");
|
const ui = reactive( {
|
||||||
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",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
};
|
|
||||||
|
|
||||||
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 ()
|
option && myChart.setOption( option );
|
||||||
{
|
|
||||||
// 自适应大小
|
|
||||||
myChart.resize();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
onMounted(() =>
|
window.onresize = function ()
|
||||||
{
|
{
|
||||||
initCharts();
|
// 自适应大小
|
||||||
});
|
myChart.resize();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
return { ui, initCharts, };
|
onMounted( () =>
|
||||||
},
|
{
|
||||||
|
initCharts();
|
||||||
|
} );
|
||||||
|
|
||||||
|
console.log( props );
|
||||||
|
|
||||||
|
return { ui, initCharts, props, };
|
||||||
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -40,17 +40,17 @@ export default {
|
||||||
month: {
|
month: {
|
||||||
type: String,
|
type: String,
|
||||||
require: true,
|
require: true,
|
||||||
default:()=>"本",
|
default: () => "本",
|
||||||
},
|
},
|
||||||
leadingReward: {
|
leadingReward: {
|
||||||
type: String,
|
type: String,
|
||||||
require: true,
|
require: true,
|
||||||
default:()=>"",
|
default: () => "",
|
||||||
},
|
},
|
||||||
advanceReward: {
|
advanceReward: {
|
||||||
type: String,
|
type: String,
|
||||||
require: true,
|
require: true,
|
||||||
default:()=>"",
|
default: () => "",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
setup()
|
setup()
|
||||||
|
@ -102,7 +102,6 @@ export default {
|
||||||
width: 165px;
|
width: 165px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.advance-reward-wrapper {
|
.advance-reward-wrapper {
|
||||||
|
|
|
@ -28,8 +28,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="total-archievement-charts-wrapper">
|
<div class="total-archievement-charts-wrapper">
|
||||||
<ArchievementChart
|
<ArchievementChart
|
||||||
total_archievement="435220"
|
:chart-data="ui.chartData"
|
||||||
:chart_data="ui.chartData"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -71,35 +70,35 @@ export default {
|
||||||
{
|
{
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const staffInfo = loadStaffInfo();
|
const staffInfo = loadStaffInfo();
|
||||||
const ui = reactive({
|
const ui = reactive( {
|
||||||
chartData: [200, 230, 224, 218, 135, 147, 260, 800,],
|
chartData: [200, 230, 224, 218, 135, 147, 260, 800,],
|
||||||
totalArchievement: 120000000,
|
totalArchievement: 120000000,
|
||||||
dishonorPersons: ["张三", "李四",],
|
dishonorPersons: ["张三", "李四",],
|
||||||
});
|
} );
|
||||||
|
|
||||||
const getTotalArchievement = computed(() =>
|
const getTotalArchievement = computed( () =>
|
||||||
{
|
{
|
||||||
const cnyFormat = new Intl.NumberFormat("zh-cn",
|
const cnyFormat = new Intl.NumberFormat( "zh-cn",
|
||||||
{
|
{
|
||||||
style: "currency",
|
style: "currency",
|
||||||
currency: "CNY",
|
currency: "CNY",
|
||||||
minimumFractionDigits: 0,
|
minimumFractionDigits: 0,
|
||||||
});
|
} );
|
||||||
const archievement = cnyFormat.format(ui.totalArchievement);
|
const archievement = cnyFormat.format( ui.totalArchievement );
|
||||||
|
|
||||||
return archievement;
|
return archievement;
|
||||||
});
|
} );
|
||||||
|
|
||||||
// 检查存储的登录信息,不存在则返回登录页面
|
// 检查存储的登录信息,不存在则返回登录页面
|
||||||
if (staffInfo.P13UID === "")
|
if ( staffInfo.P13UID === "" )
|
||||||
{
|
{
|
||||||
ElMessage({
|
ElMessage( {
|
||||||
message: "登录信息失效,请重新登录!",
|
message: "登录信息失效,请重新登录!",
|
||||||
type: "success",
|
type: "success",
|
||||||
center: true,
|
center: true,
|
||||||
});
|
} );
|
||||||
|
|
||||||
router.push("/login");
|
router.push( "/login" );
|
||||||
}
|
}
|
||||||
|
|
||||||
return { ui, getTotalArchievement, };
|
return { ui, getTotalArchievement, };
|
||||||
|
|
Loading…
Reference in New Issue