主数据申请接口变更+统计图表整合

 Source/UBCS-WEB/src/api/GetItem.js

@@ -45,6 +45,22 @@
    data
  })
}
//申请
export function applySaveCode(data) {
  return request({
    url: 'api/ubcs-code/mdmEngineController/addSaveBZ',
    method: 'post',
    data
  })
}
//修订
export function amendEditCode(data) {
  return request({
    url: 'api/ubcs-code/mdmEngineController/addSaveBZ',
    method: 'post',
    data
  })
}
//已发布数据更改
export function upSaveCode(data) {
  return request({

 Source/UBCS-WEB/src/components/MasterCrud/VciMasterCrud.vue

@@ -72,7 +72,7 @@
                                 align="center">
                </el-table-column>
                <!--               å‚照数据-->
                <el-table-column v-for="(item,index) in referArray" key="index" v-if="Object.keys(item.referConfig).length > 0 && !item.hidden" :label="item.title" prop="jiliangdw"
                <el-table-column v-for="(item,index) in referArray" :key="index" v-if="item.referConfig && Object.keys(item.referConfig).length > 0 && !item.hidden" :label="item.title" prop="jiliangdw"
                                 :show-overflow-tooltip="true" :sortable="item.sortable" :width="item.width"
                                 align="center">
                  <template slot-scope="scope">
@@ -176,7 +176,8 @@
  deleteCode,
  upSaveCode,
  applyGroupCode,
  receiveEditApply
  receiveEditApply,
  applySaveCode
} from "@/api/GetItem";
import {processTS, changeStatus} from "@/api/template/setPersonnel"
import {listCodeAttributeByClassId} from "@/api/integration/integration.js";
@@ -553,10 +554,28 @@
        this.applyvisible = true;
      });
    },
    applySumbit(){

    applySumbit(val){
      // console.log('val',val)
      if(func.notEmpty(val.ts)) {
        val.ts = func.formattedDateTime(val.ts);
        //console.log(val.ts);
      }
      applySaveCode(val).then(res => {
        this.$nextTick(() => {
          this.applyvisible = false;
          this.$message.success("保存成功");
          this.onLoad()
        })
      })
    },
    amendSumbit(){
    amendSumbit(val){
      applySaveCode(val).then(res => {
        this.$nextTick(() => {
          this.amendvisible = false;
          this.$message.success("保存成功");
          this.onLoad()
        })
      })

    },
    //标准修订

 Source/UBCS-WEB/src/components/StatisticsComponent/ColumnarChart.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,121 @@
<template>
  <basic-container>
    <v-chart id="chart" :auto-resize="true" :options="chartOptions"></v-chart>
  </basic-container>

</template>

<script>
import 'echarts'
import 'echarts/lib/chart/line'
import 'echarts/lib/chart/pie'
import 'echarts/lib/chart/bar'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/title'
import 'echarts/lib/component/legend'

var data = [
  [120, 132, 101, 134, 90, 230, 210, 130, 0, 122, 100, 80],
  [220, 232, 301, 334, 290, 330, 410, 330, 212, 322, 200, 234],
];

// æ‰¾åˆ°æ¯ä¸€é¡¹æ•°æ®ä¸­çš„最大值并保存到数组
var maxValues = data[0].map(function (_, i) {
  return Math.max.apply(null, data.map(function (item) {
    return item[i];
  }));
});

var colors = ['#91CC75', '#5470C6'];
// ç”ŸæˆæŸ±çŠ¶å›¾çš„ series æ•°æ®
var seriesData = [];
for (var i = 0; i < data.length; i++) {
  var curSeriesData = [];
  // è®¡ç®—数据中的每组数据的最大值
  for (var j = 0; j < data[i].length; j++) {
    var borderRadius = [0, 0, 0, 0];  // é»˜è®¤ä¸è®¾ç½®åœ†è§’
    if (data[i][j] === maxValues[j]) {  // å¦‚果当前柱子的值等于对应列的最大值，设置圆角
      borderRadius = [50, 50, 0, 0];  // è®¾ç½®å››ä¸ªè§’都为圆角
    }
    curSeriesData.push({
      value: data[i][j],
      itemStyle: {
        normal: {
          barBorderRadius: borderRadius,  // è®¾ç½®åœ†è§’
          color: colors[i],
          show: function (params) {
            // æ ¹æ®æ•°æ®å€¼çš„大小来判断是否显示 label
            return params.value > 30;
          }
        }
      }
    });
  }
  var seriesName = '';
  if (i === 0) {
    seriesName = '总量';
  } else if (i === 1) {
    seriesName = '新增';
  }
  seriesData.push({
    name: seriesName,
    type: 'bar',
    stack: '总量',
    data: curSeriesData,
    label: {
      show: true,
      position: 'top'
    },
    itemStyle: {
      color: colors[i]  // è®¾ç½®æŸ±å­çš„颜色
    },
    emphasis: {
      focus: 'series'
    }
  });
}

export default {
  name: "ColumnarChart",
  data() {
    return {
      chartOptions: {
        title: {
          text: '人员主数据统计'
        },
        grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        legend: {
          data: ['总量', '新增'],
          left: 'center'
        },
        xAxis: {
          type: 'category',
          data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
        },
        yAxis: {
          type: 'value'
        },
        series: seriesData,
      }
    }
  }
}
</script>

<style scoped lang="scss">
#chart {
  width: 1280px;
  height: 800px;
}
</style>

 Source/UBCS-WEB/src/components/StatisticsComponent/lineChart.vue

@@ -1,103 +1,78 @@
<template>
  <div id="main">
    <basic-container>
      <v-chart :options="option" ref="chart" style="width: 100%;"></v-chart>
      <v-chart id="chart" :auto-resize="true" :options="chartOptions"></v-chart>
    </basic-container>
  </div>
</template>

<script>
import 'echarts'
import 'echarts/lib/chart/line';
import 'echarts/lib/component/tooltip';
import 'echarts/lib/component/title';
import 'echarts/lib/component/legend';
import 'echarts/lib/chart/line'
import 'echarts/lib/chart/pie'
import 'echarts/lib/chart/bar'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/title'
import 'echarts/lib/component/legend'

export default {
  name: "statisticPage",
  name: "lineChart",
  data() {
    return {
      option: {
        color: ['red','black'],
        legend: {
          data: ['图例1', '图例2', '图例3'],
        },
        dataset: [
          {
            id: 'dataset_raw',
            source: [
              { month: 1, total: 1000, newly: 800 },
              { month: 2, total: 5000, newly: 1000 },
              { month: 3, total: 1800, newly: 1400 },
              { month: 4, total: 1500, newly: 1200 },
              { month: 5, total: 1000, newly: 1200 },
              { month: 6, total: 1500, newly: 1200 },
              { month: 7, total: 1500, newly: 1200 },
              { month: 8, total: 1500, newly: 1000 },
              { month: 9, total: 1500, newly: 1200 },
              { month: 10, total: 1500, newly: 1200 },
              { month: 11, total: 1500, newly: 1200 },
              { month: 12, total: 1500, newly: 1200 },
            ],
          },
        ],
      chartOptions: {
        color:['#2eadd6  ','#FFA500 '],
        title: {
          text: '主数据统计分析',
          left:'center',
          textAlign:'center'
          text: '物品主数据统计'
        },
        tooltip: {
          trigger: 'axis',
          trigger: 'axis'
        },
        legend: {
          data: ['总量', '新增']
        },
        xAxis: {
          boundaryGap: true, // æŽ§åˆ¶åæ ‡è½´ä¸¤ä¾§ç•™ç™½
          type: 'category',
          nameLocation: 'middle',
          name:'month',
          // data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] // æœˆä»½æ•°æ®
          data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
        },
        yAxis: {
          name: 'Number',
          type: 'value',
          type: 'value'
        },
        series: [
          {
            name: '总量',
            type: 'line',
            datasetId: 'dataset_raw',
            showSymbol: false,
            encode: {
              x: 'month',
              y: 'total',
              itemName: 'month',
              tooltip: ['total'],
            smooth: true,
            stack: 'Total',
            label: {
              show: true,
              position: 'top'
            },
            data: [5000, 2000, 3600, 1000, 1000, 2000, 500, 2000, 500, 2000, 500, 2000]
          },
          {
            name: '新增',
            type: 'line',
            datasetId: 'dataset_raw',
            showSymbol: false,
            encode: {
              x: 'month',
              y: 'newly',
              itemName: 'month',
              tooltip: ['newly'],
            smooth: true,
            stack: 'Total',
            label: {
              show: true,
              position: 'top'
            },
          },
        ],
      }
            data: [1510, 1010, 2610, 2010, 3010, 1010, 1510, 3010, 1010, 1510, 3010, 2000]
          }
        ]
      },
    };
  },
  mounted() {
    import('echarts').then((echarts) => {
      // console.log(echarts)
      this.$nextTick(() => {
        const chartDom = this.$refs.chart.$el;
        const myChart = echarts.init(chartDom);
        myChart.setOption(this.option);
      });
    });
  },
}
</script>

<style scoped>
<style lang="scss" scoped>
#chart {
  width: 1280px;
}

</style>

 Source/UBCS-WEB/src/components/StatisticsComponent/pieChart.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,84 @@
<template>
  <basic-container>
    <v-chart :options="chartOptions" :auto-resize="true" id="chart"></v-chart>
  </basic-container>
</template>

<script>
import 'echarts'
import 'echarts/lib/chart/pie'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/legend'
export default {
  name: "pieChart",
  data() {
    return {
      chartOptions: {
        title: {
          text: '供应商主数据统计',
          left: 'center'
        },
        tooltip: {
          trigger: 'item',
          formatter: function (params) {
            var result = '';
            if (params.componentType === 'series') {
              result += params.name + '<br/>';
              result += '新增：' + params.data.newValue + '<br/>';
              result += '总量：' + params.data.value + '<br/>';
              result += '百分比：' + params.percent + '%';
            }
            return result;
          }
        },
        legend: {
          orient: 'vertical',
          right: 10,
          top: 'middle',
          data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
        },
        series: [
          {
            name: '',
            type: 'pie',
            radius: ['40%', '70%'],
            avoidLabelOverlap:false,
            label: {
              formatter: '{b}\n{d}%',
              fontSize:14
            },
            itemStyle: {
              color: function(params) {
                // æ ¹æ®å…·ä½“需求设置颜色
                var colorList = ['#5470C6', '#91CC75', '#fac858', '#EE6666', '#3BA272', '#FC8452', '#9A60B4', '#e34d4d', '#b3e9b9', '#eaaaed', '#1bc6e4', '#c6b3e9'];
                return colorList[params.dataIndex % colorList.length];
              }
            },
            data: [
              { value: 110, name: '一月', newValue: 10, totalValue: 110 },
              { value: 220, name: '二月', newValue: 20, totalValue: 220 },
              { value: 330, name: '三月', newValue: 30, totalValue: 330 },
              { value: 440, name: '四月', newValue: 40, totalValue: 440 },
              { value: 550, name: '五月', newValue: 50, totalValue: 550 },
              { value: 660, name: '六月', newValue: 60, totalValue: 660 },
              { value: 770, name: '七月', newValue: 70, totalValue: 770 },
              { value: 880, name: '八月', newValue: 80, totalValue: 880 },
              { value: 990, name: '九月', newValue: 90, totalValue: 990 },
              { value: 1100, name: '十月', newValue: 100, totalValue: 1100 },
              { value: 1210, name: '十一月', newValue: 110, totalValue: 1210 },
              { value: 1320, name: '十二月', newValue: 120, totalValue: 1320 }
            ]
          }
        ]
      },
    }
  }
}
</script>

<style scoped lang="scss">
#chart {
  width: 800px;
  height: 600px;
}
</style>

 Source/UBCS-WEB/src/views/statistic/statisticPage.vue

@@ -6,21 +6,30 @@
    </div>
    <!--  æ–°å¢žå¯¹è¯æ¡†-->
    <el-dialog
      title="新增数据统计分析"
      :visible.sync="addVisible"
      append-to-body
      title="新增数据统计分析"
    >
    </el-dialog>
    <!--    echarts组件-->
    <div>
            <lineChart></lineChart>
            <pieChart></pieChart>
            <ColumnarChart></ColumnarChart>
    </div>
  </div>

</template>

<script>
import lineChart from "../../components/StatisticsComponent/lineChart"
import pieChart from "../../components/StatisticsComponent/pieChart"
import ColumnarChart from "../../components/StatisticsComponent/ColumnarChart"

export default {
  components: {
    lineChart
    lineChart,
    pieChart,
    ColumnarChart
  },
  name: "statisticPage",
  data() {