// 引入Day.js库 const dayjs = require('dayjs'); // 获取本月日期列表的函数 function getDatesInMonth() { let year = dayjs().year() let month = dayjs().month() const dates = []; const startDate = dayjs(new Date(year, month, 1)); const endDate = dayjs(new Date(year, month + 1, 1)).subtract(1, 'day'); let currentDate = startDate; while (currentDate.isBefore(endDate) || currentDate.isSame(endDate, 'day')) { dates.push(currentDate.format('YYYY-MM-DD')); currentDate = currentDate.add(1, 'day'); } return dates; } export const columns = [ { prop: 'name', minWidth: '120', label: '里程碑名称', align: 'center', showOverflowTooltip: true, }, { prop: 'name', minWidth: '120', label: '计划进度', align: 'center', showOverflowTooltip: true, }, { prop: 'name1', minWidth: '120', label: '实际进度', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '状态', minWidth: '120', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '执行者', minWidth: '120', align: 'center', showOverflowTooltip: true, }, { prop: 'name12', minWidth: '120', label: '延期天数', align: 'center', showOverflowTooltip: true, } ]; export const columns1 = [ { prop: 'name', minWidth: '120', label: '任务名称', align: 'center', showOverflowTooltip: true, }, { prop: 'name', minWidth: '150', label: '计划开始时间', align: 'center', showOverflowTooltip: true, }, { prop: 'name1', minWidth: '150', label: '计划结束时间', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '计划进度', minWidth: '120', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '实际进度', minWidth: '120', align: 'center', showOverflowTooltip: true, }, { prop: 'name12', minWidth: '120', label: '状态', align: 'center', showOverflowTooltip: true, }, { prop: 'name12', minWidth: '120', label: '执行者', align: 'center', showOverflowTooltip: true, }, { prop: 'name12', minWidth: '120', label: '延期天数', align: 'center', showOverflowTooltip: true, } ]; export const columns2 = [ { prop: 'name', minWidth: '120', label: '任务名称', align: 'center', showOverflowTooltip: true, }, { prop: 'name', minWidth: '150', label: '计划开始时间', align: 'center', showOverflowTooltip: true, }, { prop: 'name1', minWidth: '150', label: '计划结束时间', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '计划进度', minWidth: '120', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '实际进度', minWidth: '120', align: 'center', showOverflowTooltip: true, }, { prop: 'name12', minWidth: '120', label: '状态', align: 'center', showOverflowTooltip: true, }, { prop: 'name12', minWidth: '120', label: '执行者', align: 'center', showOverflowTooltip: true, } ]; export const columns3 = [ { prop: 'name', minWidth: '120', label: '名称', align: 'center', showOverflowTooltip: true, }, { prop: 'name', minWidth: '150', label: '任务数量', align: 'center', showOverflowTooltip: true, }, { prop: 'name1', minWidth: '150', label: '未完成任务数量', align: 'center', showOverflowTooltip: true, }, { prop: 'qualified', label: '延期任务数量', minWidth: '120', align: 'center', showOverflowTooltip: true, }, ]; export const lineOption = (data, itemStyle = {}) => { return { tooltip: { formatter: (item) => { return item.name + ":" + item.seriesName + " " + item.value }, trigger: 'item' }, legend: { // bottom: '2%', itemGap: window.innerHeight * 0.014, textStyle: { fontSize: window.innerHeight * 0.013, } }, grid: { left: 40, bottom: "13%"//也可设置left和right设置距离来控制图表的大小 }, color: ['#1890ff'], xAxis: { type: 'category', data: ['10/2', '10/3', '10/4', '10/5', '10/6', '10/7', '10/8'], axisLabel: { fontSize: window.innerHeight * 0.012, } }, yAxis: [ { type: 'value', max: 100, min: 0, axisLabel: { show: true, formatter: "{value}%", //右侧Y轴文字显示 }, nameTextStyle: { align: 'center', color: "#333", fontSize: window.innerHeight * 0.012, padding: [0, 20, -3, 0] }, }, ], series: [ { name: '过程控', symbolSize: 10, data: data[0], type: 'line', itemStyle: { // color: '#ffab08' }, }, { name: '产品控', symbolSize: 10, data: data[1], type: 'line', itemStyle: { // color: '#ffab08' }, } ] } } export const barOption = ( xData,series) => { return { tooltip: { formatter: (item) => { return item.name + ":" + item.seriesName + " " + item.value }, trigger: 'item' }, legend: { // bottom: '2%', itemGap: window.innerHeight * 0.014, textStyle: { fontSize: window.innerHeight * 0.013, } }, grid: { left: 40, right: 55, bottom: "13%"//也可设置left和right设置距离来控制图表的大小 }, color: ['#1890ff'], xAxis: { type: 'category', data:xData , axisLabel: { fontSize: window.innerHeight * 0.012, } }, yAxis: [ { type: 'value', // name: '(个)', nameTextStyle: { align: 'center', color: "#333", fontSize: window.innerHeight * 0.012, padding: [0, 20, -3, 0] }, }, { type: 'value', max: 100, min: 0, axisLabel: { show: true, formatter: "{value}%", //右侧Y轴文字显示 } } ], series } } export const pieOption = (data) => { return { color: ['#fd625e','#458ef7'], tooltip: { // formatter: '{b}:{c}' + '%', trigger: 'item' }, // legend: { // orient: 'horizontal', // left: 'right', // right: '15%', // bottom: '5%', // itemGap: window.innerHeight * 0.018, // textStyle: { // fontSize: window.innerHeight * 0.014, // } // }, series: [ { center: ['50%', '50%'], label: { position: 'outside', show: true, formatter: (item) => { return item.name + ":" + item.value+'/'+item.percent +'%' }, fontSize: window.innerHeight * 0.014, // color:"#fff" }, labelLine: { show: true, }, type: 'pie', radius: '70%', itemStyle: { borderWidth: 0, shadowBlur: 10, shadowColor: 'rgba(0, 0, 0, 0.5)' }, data } ] } }