loulijun2021
2022-11-22 20ac76481e2748bec983dbf460cd44995ae08c0c
src/utils/myEcharts.js
@@ -399,6 +399,7 @@
      top: '10%',
      containLabel: true
    },
    // animation: false, // 取消动画
    xAxis: {
      show: false
    },
@@ -421,7 +422,7 @@
          color: function(value, index) {
            return value === '0' ? 'transparent' : '#fff'
          },
          fontSize: 18,
          fontSize: 20,
          // formatter: function(value, index) {
          //   return [
          //     '{lg|' + (index + 1) + '、   }' + '{title|' + value + '} '
@@ -494,7 +495,7 @@
            show: true,
            position: 'right',
            formatter: '{c}',
            fontSize: 14,
            fontSize: 20,
            color: '#fff'
            // formatter: '{c}%',
          }
@@ -933,34 +934,35 @@
        borderColor: '#fff'
      }
    },
    xAxis: [{
      type: 'category',
      boundaryGap: true,
      axisLabel: {
        interval: 0,
        formatter: '{value}',
        fontSize: 14,
        margin: 20,
        textStyle: {
          color: colorX
        }
      },
      axisLine: {
        lineStyle: {
          color: '#032c58'
        }
      },
      splitLine: {
        show: false,
        lineStyle: {
          color: '#032c58'
        }
      },
      axisTick: {
        show: false
      },
      data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
    }],
    xAxis: [
      {
        type: 'category',
        boundaryGap: true,
        axisLabel: {
          interval: 0,
          formatter: '{value}',
          fontSize: 18,
          margin: 20,
          textStyle: {
            color: colorX
          }
        },
        axisLine: {
          lineStyle: {
            color: '#032c58'
          }
        },
        splitLine: {
          show: false,
          lineStyle: {
            color: '#032c58'
          }
        },
        axisTick: {
          show: false
        },
        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
      }],
    yAxis: [
      {
        // max: 800,
@@ -969,7 +971,7 @@
        type: 'value',
        axisLabel: {
          textStyle: {
            fontSize: 14,
            fontSize: 18,
            color: colorY
          }
        },
@@ -1015,7 +1017,8 @@
          show: true,
          position: 'top',
          textStyle: {
            color: '#fff'
            color: '#fff',
            fontSize: 16
          }
        },
        itemStyle: {
@@ -1158,7 +1161,7 @@
          title: {
            width: 50,
            align: 'right',
            fontSize: 18
            fontSize: 20
          }
        }
      }
@@ -1183,7 +1186,7 @@
        align: 'left',
        verticalAlign: 'center',
        lineHeight: 40,
        fontSize: 18,
        fontSize: 20,
        formatter: function(value, index) {
          return data[index].value + ''
        }
@@ -1286,13 +1289,13 @@
      textStyle: {
        rich: {
          name: {
            fontSize: 18,
            fontSize: 22,
            fontWeight: 'normal',
            color: '#fff',
            padding: [10, 0]
          },
          val: {
            fontSize: 32,
            fontSize: 22,
            fontWeight: 'bold',
            color: '#fff'
          }
@@ -1374,11 +1377,11 @@
            padding: [0, -50, 25, -50],
            rich: {
              icon: {
                fontSize: 16,
                fontSize: 18,
                color: 'red'
              },
              name: {
                fontSize: 16,
                fontSize: 18,
                padding: [0, 10, 0, 4],
                color: '#fff'
              },
@@ -1394,3 +1397,131 @@
  }
  return option
}
// 车间生产  生产信息  生产进度 进度条
export function progress(param1, param2) {
//   param1  报工数量
  //  param2   任务数量
  // 拿到数据之后需要计算出相对长度  param2的相对长度为100
  let relativeValue = ''// 相对值  绿色背景
  relativeValue = (param1 / param2) * 100
  // 百分比数值的位置
  var position = 'right'
  // if (param1 >= 50) {
  //     position = 'inside';
  // } else if (param1 < 50) {
  //     position = 'right';
  // }
  var option = {
    // animation: false, // 取消动画
    // animationDuration: 5000,
    grid: {
      top: 'center',
      left: '0%',
      right: '0%',
      // height: '%',
      // containLabel: false
      containLabel: true
    },
    xAxis: {
      type: 'value',
      axisLabel: {
        show: false
      },
      max: 100,
      axisTick: {
        show: false
      },
      axisLine: {
        show: false
      },
      splitLine: {
        show: false
      }
    },
    yAxis: [{
      type: 'category',
      data: [],
      axisLabel: {
        show: false
      },
      axisTick: {
        show: false
      },
      axisLine: {
        show: false
      },
      splitLine: {
        show: false
      },
      z: 10
    }, {
      type: 'category',
      axisLabel: {
        show: false
      },
      axisTick: {
        show: false
      },
      axisLine: {
        show: false
      },
      splitLine: {
        show: false
      },
      data: []
    }],
    series: [{
      name: '',
      type: 'bar',
      barWidth: '100%',
      // barMaxWidth: '100%',
      label: {
        normal: {
          show: true,
          // position: ['24', '38%'],
          position: (param1.toString() + param2.toString()).length <= 6 ? ['24', '38%'] : 'insideLeft',
          // formatter: '{c} %',
          formatter: param1 + '/' + param2,
          textStyle: {
            color: '#FFFFFF',
            fontWeight: 'bold',
            fontFamily: 'Microsoft YaHei',
            fontSize: 18
          }
        }
      },
      itemStyle: {
        normal: {
          barBorderRadius: 5,
          shadowBlur: 10,
          shadowColor: '#111',
          color: '#2FD04F'
        }
      },
      // data: [param1],
      data: [relativeValue],
      z: 10
    }, {
      type: 'bar',
      barWidth: '100%',
      yAxisIndex: 1,
      silent: true,
      // barMaxWidth: '100%',
      itemStyle: {
        normal: {
          barBorderRadius: 5,
          color: '#42475B'
        }
      },
      // data: [param2]
      data: [100]
    }]
  }
  return option
}