shenqilong 10 месяцев назад
Родитель
Сommit
6ffa38c649

+ 93 - 0
src/views/InterLaboratory/interStatistics/chartA.vue

@@ -0,0 +1,93 @@
+<template>
+    <div class="pieView">
+        <div style="height:14%;line-height:30px;text-align: left;padding-left: 10px;padding-top: 10px; margin-bottom: -50px;color: white;">
+            {{ info.title || "" }}
+        </div>
+        <div style="width: 100%; height: 95%; display: inline-block; overflow: hidden">
+            <div :id="info.id" style="width: 100%; height: 100%; overflow: hidden" />
+        </div>
+
+    </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+export default {
+    props: {
+        info: {
+            type: Object,
+            default: function () {
+                return {}
+            }
+        }
+    },
+    data () {
+        return {
+            showChart: true,
+            option: {
+                grid: {
+                    x: 50,
+                    y: 50,
+                    x2: 50,
+                    y2: 50
+                },
+                legend: {
+                    orient: 'vertical',
+                    left: 'center',
+                    bottom: 'bottom',
+                    textStyle: {
+                        color: '#ffff',
+                        fontSize: 12
+                    }
+                },
+                tooltip: {},
+                dataset: {
+                    source: [
+                        ['product', '2015', '2016', '2017'],
+                        ['Matcha Latte', 43.3, 85.8, 93.7],
+                        ['Milk Tea', 83.1, 73.4, 55.1],
+                        ['Cheese Cocoa', 86.4, 65.2, 82.5],
+                        ['Walnut Brownie', 72.4, 53.9, 39.1]
+                    ]
+                },
+                xAxis: { type: 'category' },
+                yAxis: {},
+                series: [{ barMaxWidth: 30, type: 'bar' }, { barMaxWidth: 30, type: 'bar' }, { barMaxWidth: 30, type: 'bar' }, { barMaxWidth: 30, type: 'bar' }]
+            }
+
+        }
+    },
+    watch: {
+        info: {
+            handler (newVal, oldVal) {
+                this.getMiddleLeft()
+            },
+            deep: true
+        }
+    },
+    mounted () {
+        const this_ = this
+        this.$nextTick(() => {
+            this_.getMiddleLeft()
+        })
+    },
+    methods: {
+        getMiddleLeft () {
+            this.option.dataset.source = this.info.numArr
+            const chartDom = document.getElementById(this.info.id)
+            var myChart = echarts.init(chartDom)
+            setTimeout(() => {
+                myChart.setOption(this.option)
+            }, 2000)
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.pieView {
+width: 100%;
+height: 100%;
+overflow: hidden;
+background-color: rgba(6, 30, 93, 0.5);
+}
+</style>

+ 196 - 0
src/views/InterLaboratory/interStatistics/chartB.vue

@@ -0,0 +1,196 @@
+<template>
+    <div class="pieView">
+        <div style="height:14%;line-height:30px;text-align: left;padding-left: 10px;padding-top: 10px; margin-bottom: -50px; color: white;">
+            {{ info.title || "" }}
+        </div>
+        <div style="width: 100%; height: 95%; display: inline-block; overflow: hidden">
+            <div :id="info.id" style="width: 100%; height: 100%; overflow: hidden;padding-right: 10px;" />
+        </div>
+
+    </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+export default {
+    props: {
+        info: {
+            type: Object,
+            default: function () {
+                return {}
+            }
+        }
+    },
+    data () {
+        return {
+            showChart: true,
+            option: {
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross',
+                        crossStyle: {
+                            color: '#999'
+                        }
+                    }
+                },
+                toolbox: {
+                    show: true,
+                    feature: {
+                        dataView: { show: true, readOnly: false,
+                            optionToContent: function (opt) {
+                                var axisData = opt.xAxis[0].data// x轴作为条件,y轴需改成yAxis[0].data;
+                                var series = opt.series
+                                var tdHeads = '<td  style="padding:0 10px">年份</td>'
+                                series.forEach(function (item) {
+                                    tdHeads += '<td style="padding: 0 10px">' + item.name + '</td>'
+                                })
+                                var table = '<table border="1" style="margin-left:20px;border-collapse:collapse;font-size:14px;text-align:center;color:#666"><tbody><tr>' + tdHeads + '</tr>'
+                                var tdBodys = ''
+                                for (var i = 0, l = axisData.length; i < l; i++) {
+                                    for (var j = 0; j < series.length; j++) {
+                                        if (typeof (series[j].data[i]) === 'object') {
+                                            tdBodys += '<td>' + series[j].data[i].value + '</td>'
+                                        } else {
+                                            tdBodys += '<td>' + series[j].data[i] + '</td>'
+                                        }
+                                    }
+                                    table += '<tr><td style="padding: 0 10px">' + axisData[i] + '</td>' + tdBodys + '</tr>'
+                                    tdBodys = ''
+                                }
+                                table += '</tbody></table>'
+                                return table
+                            }
+                        },
+                        magicType: { show: true, type: ['line', 'bar'] },
+                        restore: { show: true },
+                        saveAsImage: { show: true }
+                    },
+                    iconStyle: {
+                        borderColor: 'white'
+                    }
+                },
+                legend: {
+                    orient: 'vertical',
+                    left: 'center',
+                    bottom: 'bottom',
+                    data: [],
+                    textStyle: {
+                        color: '#ffff',
+                        fontSize: 12
+                    }
+
+                },
+                xAxis: [
+                    {
+                        type: 'category',
+                        data: [],
+                        axisPointer: {
+                            type: 'shadow'
+                        }
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: 'value',
+                        name: '个数',
+                        min: 0,
+                        // max: 100,
+                        // interval: 20,
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+                    {
+                        type: 'value',
+                        name: '百分比',
+                        min: 0,
+                        max: 100,
+                        // interval: 20,
+                        axisLabel: {
+                            formatter: '{value} %'
+                        }
+                    }
+                ],
+                series: [
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    }
+
+                ]
+            }
+        }
+    },
+    watch: {
+        info: {
+            handler (newVal, oldVal) {
+                this.getMiddleLeft()
+            },
+            deep: true
+        }
+    },
+    mounted () {
+        const this_ = this
+        this.$nextTick(() => {
+            this_.getMiddleLeft()
+        })
+    },
+    methods: {
+        getMiddleLeft () {
+            this.option.xAxis[0].data = this.info.yearArr
+            this.option.legend.data = ['比对率', '无室间质评计划项目数', '室间比对项目数']
+            this.option.series[1].name = '无室间质评计划项目数'
+            this.option.series[2].name = '室间比对项目数'
+            this.option.series[0].name = '比对率'
+            this.option.series[0].data = this.info.data3
+            this.option.series[1].data = this.info.data1
+            this.option.series[2].data = this.info.data2
+            // this.option.series[2].data = [1, 1, 1, 1, 1]
+            const chartDom = document.getElementById(this.info.id)
+            var myChart = echarts.init(chartDom)
+            setTimeout(() => {
+                myChart.setOption(this.option)
+            }, 2000)
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.pieView {
+width: 100%;
+height: 100%;
+overflow: hidden;
+background-color: rgba(6, 30, 93, 0.5);
+}
+</style>

+ 239 - 0
src/views/InterLaboratory/interStatistics/chartC.vue

@@ -0,0 +1,239 @@
+<template>
+    <div class="pieView">
+        <div style="height:14%;line-height:30px;text-align: left;padding-left: 10px;padding-top: 10px; margin-bottom: -50px; color: white;">
+            {{ info.title || "" }}
+        </div>
+        <div style="width: 100%; height: 95%; display: inline-block; overflow: hidden">
+            <div :id="info.id" style="width: 100%; height: 100%; overflow: hidden;padding-right: 10px;" />
+        </div>
+
+    </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+export default {
+    props: {
+        info: {
+            type: Object,
+            default: function () {
+                return {}
+            }
+        }
+    },
+    data () {
+        return {
+            showChart: true,
+            option: {
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross',
+                        crossStyle: {
+                            color: '#999'
+                        }
+                    }
+                },
+                toolbox: {
+                    show: true,
+                    feature: {
+                        dataView: { show: true, readOnly: false,
+                            optionToContent: function (opt) {
+                                var axisData = opt.xAxis[0].data// x轴作为条件,y轴需改成yAxis[0].data;
+                                var series = opt.series
+                                var tdHeads = '<td  style="padding:0 10px">年份</td>'
+                                series.forEach(function (item) {
+                                    tdHeads += '<td style="padding: 0 10px">' + item.name + '</td>'
+                                })
+                                var table = '<table border="1" style="margin-left:20px;border-collapse:collapse;font-size:14px;text-align:center;color:#666"><tbody><tr>' + tdHeads + '</tr>'
+                                var tdBodys = ''
+                                for (var i = 0, l = axisData.length; i < l; i++) {
+                                    for (var j = 0; j < series.length; j++) {
+                                        if (typeof (series[j].data[i]) === 'object') {
+                                            tdBodys += '<td>' + series[j].data[i].value + '</td>'
+                                        } else {
+                                            tdBodys += '<td>' + series[j].data[i] + '</td>'
+                                        }
+                                    }
+                                    table += '<tr><td style="padding: 0 10px">' + axisData[i] + '</td>' + tdBodys + '</tr>'
+                                    tdBodys = ''
+                                }
+                                table += '</tbody></table>'
+                                return table
+                            }
+                        },
+                        magicType: { show: true, type: ['line', 'bar'] },
+                        restore: { show: true },
+                        saveAsImage: { show: true }
+                    },
+                    iconStyle: {
+                        borderColor: 'white'
+                    }
+                },
+                legend: {
+                    orient: 'vertical',
+                    left: 'center',
+                    bottom: 'bottom',
+                    data: [],
+                    textStyle: {
+                        color: '#ffff',
+                        fontSize: 12
+                    }
+
+                },
+                xAxis: [
+                    {
+                        type: 'category',
+                        data: [],
+                        axisPointer: {
+                            type: 'shadow'
+                        }
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: 'value',
+                        name: '个数',
+                        min: 0,
+                        // max: 100,
+                        // interval: 20,
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+                    {
+                        type: 'value',
+                        name: '百分比',
+                        min: 0,
+                        max: 100,
+                        // interval: 20,
+                        axisLabel: {
+                            formatter: '{value} %'
+                        }
+                    }
+                ],
+                series: [
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    }
+
+                ]
+            }
+        }
+    },
+    watch: {
+        info: {
+            handler (newVal, oldVal) {
+                this.getMiddleLeft()
+            },
+            deep: true
+        }
+    },
+    mounted () {
+        const this_ = this
+        this.$nextTick(() => {
+            this_.getMiddleLeft()
+        })
+    },
+    methods: {
+        getMiddleLeft () {
+            // console.log(this.info)
+            this.option.xAxis[0].data = this.info.yearArr
+            this.option.legend.data = ['总项目数', '国家级不合格数', '省级不合格数', '国家级不合格率', '省级不合格率', '总不合格率']
+            this.option.series[0].name = '总项目数'
+            this.option.series[1].name = '国家级不合格数'
+            this.option.series[2].name = '省级不合格数'
+            this.option.series[3].name = '国家级不合格率'
+            this.option.series[4].name = '省级不合格率'
+            this.option.series[5].name = '总不合格率'
+
+            this.option.series[0].data = this.info.result1
+            this.option.series[1].data = this.info.result2
+            this.option.series[2].data = this.info.result3
+            this.option.series[3].data = this.info.result4
+            this.option.series[4].data = this.info.result5
+            this.option.series[5].data = this.info.result6
+            // this.option.series[2].data = [1, 1, 1, 1, 1]
+            const chartDom = document.getElementById(this.info.id)
+            var myChart = echarts.init(chartDom)
+            setTimeout(() => {
+                myChart.setOption(this.option)
+            }, 2000)
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.pieView {
+width: 100%;
+height: 100%;
+overflow: hidden;
+background-color: rgba(6, 30, 93, 0.5);
+}
+</style>

+ 253 - 0
src/views/InterLaboratory/interStatistics/chartD.vue

@@ -0,0 +1,253 @@
+<template>
+    <div class="pieView">
+        <div style="height:14%;line-height:30px;text-align: left;padding-left: 10px;padding-top: 10px; margin-bottom: -50px; color: white;">
+            {{ info.title || "" }}
+        </div>
+        <div style="width: 100%; height: 95%; display: inline-block; overflow: hidden">
+            <div :id="info.id" style="width: 100%; height: 100%; overflow: hidden;padding-right: 10px;" />
+        </div>
+
+    </div>
+</template>
+
+<script>
+import * as echarts from 'echarts'
+export default {
+    props: {
+        info: {
+            type: Object,
+            default: function () {
+                return {}
+            }
+        }
+    },
+    data () {
+        return {
+            showChart: true,
+            option: {
+                tooltip: {
+                    trigger: 'axis',
+                    axisPointer: {
+                        type: 'cross',
+                        crossStyle: {
+                            color: '#999'
+                        }
+                    }
+                },
+                toolbox: {
+                    show: true,
+                    feature: {
+                        dataView: { show: true, readOnly: false,
+                            optionToContent: function (opt) {
+                                var axisData = opt.xAxis[0].data// x轴作为条件,y轴需改成yAxis[0].data;
+                                var series = opt.series
+                                var tdHeads = '<td  style="padding:0 10px">年份</td>'
+                                series.forEach(function (item) {
+                                    tdHeads += '<td style="padding: 0 10px">' + item.name + '</td>'
+                                })
+                                var table = '<table border="1" style="margin-left:20px;border-collapse:collapse;font-size:14px;text-align:center;color:#666"><tbody><tr>' + tdHeads + '</tr>'
+                                var tdBodys = ''
+                                for (var i = 0, l = axisData.length; i < l; i++) {
+                                    for (var j = 0; j < series.length; j++) {
+                                        if (typeof (series[j].data[i]) === 'object') {
+                                            tdBodys += '<td>' + series[j].data[i].value + '</td>'
+                                        } else {
+                                            tdBodys += '<td>' + series[j].data[i] + '</td>'
+                                        }
+                                    }
+                                    table += '<tr><td style="padding: 0 10px">' + axisData[i] + '</td>' + tdBodys + '</tr>'
+                                    tdBodys = ''
+                                }
+                                table += '</tbody></table>'
+                                return table
+                            }
+                        },
+                        magicType: { show: true, type: ['line', 'bar'] },
+                        restore: { show: true },
+                        saveAsImage: { show: true }
+                    },
+                    iconStyle: {
+                        borderColor: 'white'
+                    }
+                },
+                legend: {
+                    orient: 'vertical',
+                    left: 'center',
+                    bottom: 'bottom',
+                    data: [],
+                    textStyle: {
+                        color: '#ffff',
+                        fontSize: 12
+                    }
+
+                },
+                xAxis: [
+                    {
+                        type: 'category',
+                        data: [],
+                        axisPointer: {
+                            type: 'shadow'
+                        }
+                    }
+                ],
+                yAxis: [
+                    {
+                        type: 'value',
+                        name: '个数',
+                        min: 0,
+                        // max: 100,
+                        // interval: 20,
+                        axisLabel: {
+                            formatter: '{value}'
+                        }
+                    },
+                    {
+                        type: 'value',
+                        name: '百分比',
+                        min: 0,
+                        max: 100,
+                        // interval: 20,
+                        axisLabel: {
+                            formatter: '{value} %'
+                        }
+                    }
+                ],
+                series: [
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'bar',
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    },
+                    {
+                        barMaxWidth: 30,
+                        name: '',
+                        type: 'line',
+                        yAxisIndex: 1,
+                        tooltip: {
+                            valueFormatter: function (value) {
+                                return value + ' %'
+                            }
+                        },
+                        data: []
+                    }
+
+                ]
+            }
+        }
+    },
+    watch: {
+        info: {
+            handler (newVal, oldVal) {
+                this.getMiddleLeft()
+            },
+            deep: true
+        }
+    },
+    mounted () {
+        const this_ = this
+        this.$nextTick(() => {
+            this_.getMiddleLeft()
+        })
+    },
+    methods: {
+        getMiddleLeft () {
+            console.log(this.info)
+
+            this.option.xAxis[0].data = this.info.yearArr
+            this.option.legend.data = ['国家级开展数', '国家级参加数', '省级开展数', '省级参加数', '国家级参加率', '省级参加率', '总参加率']
+            this.option.series[0].name = '国家级开展数'
+            this.option.series[1].name = '国家级参加数'
+            this.option.series[2].name = '省级开展数'
+            this.option.series[3].name = '省级参加数'
+            this.option.series[4].name = '国家级参加率'
+            this.option.series[5].name = '省级参加率'
+            this.option.series[6].name = '总参加率'
+
+            this.option.series[0].data = this.info.list1
+            this.option.series[1].data = this.info.list2
+            this.option.series[2].data = this.info.list3
+            this.option.series[3].data = this.info.list4
+            this.option.series[4].data = this.info.list5
+            this.option.series[5].data = this.info.list6
+            this.option.series[6].data = this.info.list7
+            // this.option.series[2].data = [1, 1, 1, 1, 1]
+            const chartDom = document.getElementById(this.info.id)
+            var myChart = echarts.init(chartDom)
+            setTimeout(() => {
+                myChart.setOption(this.option)
+            }, 2000)
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.pieView {
+width: 100%;
+height: 100%;
+overflow: hidden;
+background-color: rgba(6, 30, 93, 0.5);
+}
+</style>

+ 534 - 0
src/views/InterLaboratory/interStatistics/index(备份).vue

@@ -0,0 +1,534 @@
+<template>
+    <div class="personView">
+        <dv-full-screen-container>
+            <div class="topView" style="width: 100%; height: 11%">
+                <div class="jbd-title">
+                    <dv-decoration-8
+                        style="
+                            width: 20%;
+                            height: 50px;
+                            position: absolute;
+                            left: 0px;
+                            top: 0px;
+                        "
+                    />
+                    <div style="width: 100%">
+                        <div
+                            style="
+                                height: 40%;
+                                font-size: 22px;
+                                margin-top: 10px;
+                            "
+                        >
+                            室间质控看板
+                        </div>
+                        <dv-decoration-5
+                            style="width: 30%; height: 50%; margin: 0 auto"
+                        />
+                    </div>
+                    <dv-decoration-8
+                        :reverse="true"
+                        style="
+                            width: 20%;
+                            height: 50px;
+                            position: absolute;
+                            right: 0px;
+                            top: 0px;
+                        "
+                    />
+                </div>
+                <div class="contain">
+                    <div style="display: flex; text-align: center; height:38px; line-height: 38px;width: 25%;position: absolute; left: 3%;top:6%;">
+                        <div style="margin-right:10px;">选择年份</div>
+                        <yearrange st :year-values="yearValues" :size="size" :value-format="valueFormat" />
+                    </div>
+                    <div style="display: flex; text-align: center; height:38px; line-height: 38px;width: 25%;position: absolute; left: 33%;top:15%;z-index:1">
+                        <div style="margin-right:10px;font-size: 14px;">活动名称</div>
+                        <el-select v-model="activityValue" size="small" clearable filterable placeholder="请选择">
+                            <el-option
+                                v-for="item in activityList"
+                                :key="item.value"
+                                :label="item.value"
+                                :value="item.value"
+                            />
+                        </el-select>
+                    </div>
+                    <div
+
+                        style="width:12%; height:2.825rem; line-height:2.825rem; text-align:center;position: absolute; right: 3%; top:6%;color:white;"
+                        @click.prevent="goBack()"
+                    >
+                        <dv-border-box-8>返回</dv-border-box-8>
+                    </div>
+                </div>
+            </div>
+            <dv-border-box-1
+                style="
+                    width: 100%;
+                    height: 89%;
+                    box-sizing: border-box;
+                    overflow: hidden;
+                "
+            >
+                <div style="height: 3%" />
+                <div class="botView">
+                    <div class="viewTop">
+                        <div class="topleft">
+                            <topLeftChart :info="topLeftData" />
+                        </div>
+                        <dv-decoration-2
+                            :reverse="true"
+                            style="width: 2%; height: 100%"
+                        />
+                        <div class="topright">
+                            <topRightChart :info="topRightData" />
+                        </div>
+                    </div>
+                    <dv-decoration-10
+                        style="height: 2%; width: 100%; margin: 0 auto"
+                    />
+
+                    <div class="viewBot">
+                        <div class="botleft">
+                            <botChart :info="botLeftData" />
+                        </div>
+                        <dv-decoration-2
+                            :reverse="true"
+                            style="width: 2%; height: 100%"
+                        />
+                        <div class="botmidd">
+                            <botChart :info="botMiddData" />
+                        </div>
+                        <dv-decoration-2
+                            :reverse="true"
+                            style="width: 2%; height: 100%"
+                        />
+                        <div class="botright">
+                            <botChart :info="botRightData" />
+                        </div>
+
+                    </div>
+                </div>
+            </dv-border-box-1>
+        </dv-full-screen-container>
+    </div>
+</template>
+
+<script>
+import screenfull from 'screenfull'
+export default {
+
+    components: {
+
+        yearrange: () => import('../yearrange.vue'),
+        topLeftChart: () => import('./topLeftChart.vue'),
+        topRightChart: () => import('./topRightChart.vue'),
+        botChart: () => import('./botChart.vue')
+
+    },
+    data () {
+        return {
+            yearArr: [],
+            yearStr: '',
+            numArr: [],
+            result: [],
+            result1: [],
+            result2: [],
+            result3: [],
+            list1: [],
+            list2: [],
+            list3: [],
+            data1: [],
+            data2: [],
+            data3: [],
+            yearValues: [new Date().getFullYear() - 4 + '', new Date().getFullYear() + ''],
+            size: 'mini',
+            valueFormat: 'yyyy',
+            activityValue: '',
+            activityList: [],
+            topLeftData: {
+                id: 'topLeftChart',
+                title: '室间质评计划项目总数'
+            },
+            topRightData: {
+                id: 'topRightChart',
+                title: '项目验证类型统计'
+            },
+            botLeftData: {
+                id: 'botLeftChart',
+                title: '室间质评项目不合格率'
+            },
+            botMiddData: {
+                id: 'botMiddChart',
+                title: '室间质评项目覆盖率'
+            },
+            botRightData: {
+                id: 'botRightChart',
+                title: '实验室间比对率'
+            }
+
+        }
+    },
+    watch: {
+        yearValues: {
+            handler (newVal, oldVal) {
+                this.getData()
+            },
+            deep: true
+            // immediate: true
+        },
+        activityValue: {
+            handler (newVal, oldVal) {
+                this.topLeftData = {
+                    id: 'topLeftChart',
+                    title: '室间质评计划项目总数'
+                }
+                this.getList1()
+                this.topLeftData.yearArr = this.yearArr
+                this.topLeftData.numArr = this.numArr
+            },
+            deep: true
+            // immediate: true
+        }
+    },
+    created () {
+        if (screenfull.isEnabled && !screenfull.isFullscreen) {
+            screenfull.request()
+        }
+        this.getData()
+        this.getactivityList()
+    },
+    mounted () {
+
+    },
+    beforeDestroy () {
+        if (screenfull.isFullscreen) {
+            screenfull.toggle()
+        }
+    },
+
+    methods: {
+        // 返回
+        goBack () {
+            this.$router.back(-1)
+        },
+        getNumArr  (min, max) { return Array.from(Array(max - min + 1), (v, k) => k + min) },
+        // 所有活动
+        async getactivityList () {
+            // const sql = `select huo_dong_ming_che as value from	t_sjzphdjhylxqb GROUP BY huo_dong_ming_che`
+            const { variables: { data }} = await this.$common.request('query', {
+                key: 'interlabQualityBoard1',
+                params: [null]
+            })
+            this.activityList = data
+        },
+        getData () {
+            this.topLeftData = {
+                id: 'topLeftChart',
+                title: '室间质评计划项目总数'
+            }
+            this.topRightData = {
+                id: 'topRightChart',
+                title: '项目验证类型统计'
+            }
+            this.botLeftData = {
+                id: 'botLeftChart',
+                title: '室间质评项目不合格率'
+            }
+            this.botMiddData = {
+                id: 'botMiddChart',
+                title: '室间质评项目覆盖率'
+            }
+            this.botRightData = {
+                id: 'botRightChart',
+                title: '实验室间比对率'
+            }
+            this.yearArr = this.getNumArr(Number(this.yearValues[0]), Number(this.yearValues[1]))
+            this.yearStr = this.yearArr.join(',')
+
+            this.getList1()
+            this.topLeftData.yearArr = this.yearArr
+            this.topLeftData.numArr = this.numArr
+            this.getList2()
+            // this.topRightData.yearArr = this.yearArr
+            this.topRightData.numArr = this.result
+            this.getList3()
+            this.botLeftData.yearArr = this.yearArr
+            this.botLeftData.result1 = this.result1
+            this.botLeftData.result2 = this.result2
+            this.botLeftData.result3 = this.result3
+            this.getList4()
+            this.botMiddData.yearArr = this.yearArr
+            this.botMiddData.list1 = this.list1
+            this.botMiddData.list2 = this.list2
+            this.botMiddData.list3 = this.list3
+
+            this.getList5()
+            this.botRightData.yearArr = this.yearArr
+            this.botRightData.data1 = this.data1
+            this.botRightData.data2 = this.data2
+            this.botRightData.data3 = this.data3
+        },
+
+        async getList1 () {
+            this.numArr = []
+            // const activityStr = this.activityValue ? `= '${this.activityValue}'` : `is not null`
+            // const sql = `select left(zhu_biao_shi_jian, 4) as niandu, coalesce(count(*), 0) as count
+            // from t_sjzphdjhylxqb
+            // where left(zhu_biao_shi_jian, 4) in ${yearStr}
+            // group by left(zhu_biao_shi_jian, 4)`
+            const key = this.activityValue ? 'interlabQualityBoard3' : 'interlabQualityBoard2'
+            const params = this.activityValue ? [this.activityValue, this.yearStr] : [this.yearStr]
+            // const sql = `select e.ji_hua_nian_fen_ as niandu,COALESCE(COUNT(*), 0) AS count from (select a.huo_dong_ming_che,a.zu_zhi_dan_wei_,a.xu_hao_,a.shi_yan_shi_jian_,a.bi_dui_lei_xing_,b.ji_hua_nian_fen_ from t_sjzphdjhylxqb a join (select c.*, d.ji_hua_nian_fen_ from t_cjwbzlpjhdjhxqb c join  t_cjwbzlpjhdjhb d on c.parent_id_ =  d.id_ WHERE d.shi_fou_guo_shen_='已完成' and huo_dong_ming_che ${activityStr}) b on a.huo_dong_ming_che=b.huo_dong_ming_che and a.zu_zhi_dan_wei_ = b.zu_zhi_dan_wei_ and a.xu_hao_ = b.xu_hao_ and a.shi_yan_shi_jian_ = b.shi_yan_shi_jian_) e WHERE find_in_set(ji_hua_nian_fen_, '${this.yearStr}') GROUP BY e.ji_hua_nian_fen_`
+            await this.$common.request('query', { key, params }).then((res) => {
+                const data = res.variables.data
+                for (var item of this.yearArr) {
+                    const m = data.find((v) => { return v.niandu === item + '' })
+
+                    if (m) {
+                        this.numArr.push(m.count)
+                    } else {
+                        this.numArr.push(0)
+                    }
+                }
+            })
+        },
+        async getList2 () {
+            this.result = []
+            // const sql = `select LEFT(bi_dui_lei_xing_, 2) as leixing,LEFT(zhu_biao_shi_jian, 4) as niandu, COALESCE(COUNT(*), 0) as count FROM t_sjzphdjhylxqb where left(zhu_biao_shi_jian, 4) in ${this.yearStr} GROUP BY CONCAT(LEFT(zhu_biao_shi_jian, 4), ' ', LEFT(bi_dui_lei_xing_, 2))`
+            // this.$common.request('', sql).then((res) => {
+            //     const data = res.variables.data
+            //     // console.log(data)
+
+            //     this.result.push(['product', '能力验证', '室间质评'])
+
+            //     for (var item of this.yearArr) {
+            //         const arr = []
+
+            //         arr[0] = item
+
+            //         const m = data.find((v) => { return v.niandu === item + '' && v.leixing === '能力' })
+            //         const n = data.find((v) => { return v.niandu === item + '' && v.leixing === '室间' })
+            //         // console.log(m, n)
+
+            //         if (m) {
+            //             arr[1] = m.count
+            //         } else {
+            //             arr[1] = 0
+            //         }
+            //         if (n) {
+            //             arr[2] = n.count
+            //         } else {
+            //             arr[2] = 0
+            //         }
+
+            //         this.result.push(arr)
+            //     }
+            // })
+            let data1 = []
+            let data2 = []
+            // const sql1 = `select 年度 as niandu,LEFT(能力验证类型, 2) as leixing,COUNT(*) AS count FROM v_sjzpjgpj WHERE 状态 ='已完成' and find_in_set('年度', '${this.yearStr}') GROUP BY LEFT(能力验证类型, 2)`
+            // const sql2 = `select LEFT(bian_zhi_shi_jian, 4) as niandu,'实验室' as leixing, COALESCE(COUNT(*), 0) AS count from t_sysbdjlb bian_zhi_shi_jian where shi_fou_guo_shen_ = '已完成' and find_in_set(LEFT(bian_zhi_shi_jian, 4), '${this.yearStr}')`
+
+            await this.$common.request('query', { key: 'interlabQualityBoard4', params: [this.yearStr] }).then((res) => {
+                data1 = res.variables.data
+            })
+            await this.$common.request('query', { key: 'interlabQualityBoard5', params: [this.yearStr] }).then((res) => {
+                data2 = res.variables.data
+            })
+            this.result.push(['product', '能力验证', '室间质评', '实验室', '其它'])
+            for (var item of this.yearArr) {
+                const m = data1.find((v) => { return v.niandu === item + '' && v.leixing === '能力' })
+                const n = data1.find((v) => { return v.niandu === item + '' && v.leixing === '室间' })
+                const f = data2.find((v) => { return v.niandu === item + '' && v.leixing === '实验室' })
+                const g = data1.find((v) => { return v.niandu === item + '' && v.leixing !== '能力' && v.leixing !== '室间' })
+
+                const arr = []
+                arr[0] = item
+                arr[1] = m ? m.count : 0
+                arr[2] = n ? n.count : 0
+                arr[3] = f ? f.count : 0
+                arr[4] = g ? g.count : 0
+                this.result.push(arr)
+                console.log(this.result)
+            }
+        },
+
+        getList3 () {
+            this.result1 = []
+            this.result2 = []
+            this.result3 = []
+            // const sql = `select 年度 as niandu,评价结果 as jieguo, COALESCE(COUNT(*), 0) AS count FROM v_sjzpjgpj WHERE find_in_set('年度', '${this.yearStr}') and 状态 = '已完成' GROUP BY CONCAT(年度, ' ',评价结果)`
+            this.$common.request('query', { key: 'interlabQualityBoard6', params: [this.yearStr] }).then((res) => {
+                const data = res.variables.data
+                for (var item of this.yearArr) {
+                    const m = data.find((v) => { return v.niandu === item + '' && v.jieguo === '通过' })
+                    const n = data.find((v) => { return v.niandu === item + '' && v.jieguo === '不满意项目' })
+                    const f = data.find((v) => { return v.niandu === item + '' && v.jieguo === '不通过' })
+                    // 总数
+                    this.result1.push((m ? m.count : 0) + (n ? n.count : 0) + (f ? f.count : 0))
+                    // 不合格数
+                    this.result2.push((f ? f.count : 0) + (n ? n.count : 0))
+                    // 不合格率
+                    this.result3.push((((m ? m.count : 0) + (n ? n.count : 0) + (f ? f.count : 0)) === 0 ? 0 : ((f ? f.count : 0) + (n ? n.count : 0)) / ((m ? m.count : 0) + (n ? n.count : 0) + (f ? f.count : 0)) * 100).toFixed(2))
+                    // console.log(this.result1, this.result2, this.result3)
+                }
+            })
+        },
+
+        async getList4 () {
+            this.list1 = []
+            this.list2 = []
+            this.list3 = []
+            const yearStr = `('${this.yearArr.join("', '")}')`
+            let data1 = []
+            let data2 = []
+            // const sql1 = `select LEFT(zhu_biao_shi_jian, 4) as niandu, COUNT(*) AS count FROM t_sjzphdjhylxqb WHERE find_in_set(LEFT(zhu_biao_shi_jian, 4), '${this.yearStr}') GROUP BY LEFT(zhu_biao_shi_jian, 4)`
+            // const sql2 = `select e.ji_hua_nian_fen_ as niandu,COALESCE(COUNT(*), 0) AS count from (select a.huo_dong_ming_che,a.zu_zhi_dan_wei_,a.xu_hao_,a.shi_yan_shi_jian_,a.bi_dui_lei_xing_,b.ji_hua_nian_fen_ from t_sjzphdjhylxqb a join (select c.*, d.ji_hua_nian_fen_ from t_cjwbzlpjhdjhxqb c join  t_cjwbzlpjhdjhb d on c.parent_id_ =  d.id_ WHERE d.shi_fou_guo_shen_='已完成') b on a.huo_dong_ming_che=b.huo_dong_ming_che and a.zu_zhi_dan_wei_ = b.zu_zhi_dan_wei_ and a.xu_hao_ = b.xu_hao_ and a.shi_yan_shi_jian_ = b.shi_yan_shi_jian_) e WHERE find_in_set(ji_hua_nian_fen_, '${this.yearStr}') GROUP BY e.ji_hua_nian_fen_`
+            await this.$common.request('query', { key: 'interlabQualityBoard7', params: [this.yearStr] }).then((res) => {
+                data1 = res.variables.data
+            })
+            await this.$common.request('query', { key: 'interlabQualityBoard8', params: [this.yearStr] }).then((res) => {
+                data2 = res.variables.data
+            })
+
+            for (var item of this.yearArr) {
+                const m = data1.find((v) => { return v.niandu === item + '' })
+                const n = data2.find((v) => { return v.niandu === item + '' })
+
+                // 一览
+                this.list1.push(m ? m.count : 0)
+                // 计划
+                this.list2.push(n ? n.count : 0)
+                // 覆盖率率
+                this.list3.push(((m ? m.count : 0) === 0 ? 0 : (n ? n.count : 0) / (m ? m.count : 0) * 100).toFixed(2))
+            }
+        },
+
+        async getList5 () {
+            this.data1 = []
+            this.data2 = []
+            this.data3 = []
+            let data1 = []
+            let data2 = []
+            let data3 = []
+            // const sql1 = `select LEFT(zhu_biao_shi_jian, 4) as niandu, COUNT(*) AS count FROM t_sjzphdjhylxqb WHERE find_in_set(LEFT(zhu_biao_shi_jian, 4), '${this.yearStr}') GROUP BY LEFT(zhu_biao_shi_jian, 4)`
+            // const sql2 = `select e.ji_hua_nian_fen_ as niandu,COALESCE(COUNT(*), 0) AS count from (select a.huo_dong_ming_che,a.zu_zhi_dan_wei_,a.xu_hao_,a.shi_yan_shi_jian_,a.bi_dui_lei_xing_,b.ji_hua_nian_fen_ from t_sjzphdjhylxqb a join (select c.*, d.ji_hua_nian_fen_ from t_cjwbzlpjhdjhxqb c join  t_cjwbzlpjhdjhb d on c.parent_id_ =  d.id_ WHERE d.shi_fou_guo_shen_='已完成') b on a.huo_dong_ming_che=b.huo_dong_ming_che and a.zu_zhi_dan_wei_ = b.zu_zhi_dan_wei_ and a.xu_hao_ = b.xu_hao_ and a.shi_yan_shi_jian_ = b.shi_yan_shi_jian_) e WHERE find_in_set(ji_hua_nian_fen_, '${this.yearStr}') GROUP BY e.ji_hua_nian_fen_`
+            // const sql3 = `select LEFT(bian_zhi_shi_jian, 4) as niandu,'实验室' as leixing, COALESCE(COUNT(*), 0) AS count from t_sysbdjlb bian_zhi_shi_jian where shi_fou_guo_shen_ = '已完成' and find_in_set(LEFT(bian_zhi_shi_jian, 4), '${this.yearStr}')`
+
+            await this.$common.request('query', { key: 'interlabQualityBoard7', params: [this.yearStr] }).then((res) => {
+                data1 = res.variables.data
+            })
+            await this.$common.request('query', { key: 'interlabQualityBoard8', params: [this.yearStr] }).then((res) => {
+                data2 = res.variables.data
+            })
+            await this.$common.request('query', { key: 'interlabQualityBoard5', params: [this.yearStr] }).then((res) => {
+                data3 = res.variables.data
+            })
+
+            for (var item of this.yearArr) {
+                const m = data1.find((v) => { return v.niandu === item + '' })
+                const n = data2.find((v) => { return v.niandu === item + '' })
+                const f = data3.find((v) => { return v.niandu === item + '' })
+
+                // 无室间质评计划项目数
+                this.data1.push((m ? m.count : 0) - (n ? n.count : 0))
+                // 实验室比对项目数
+                this.data2.push(f ? f.count : 0)
+                // 比对率
+                this.data3.push(((m ? m.count : 0) - (n ? n.count : 0) === 0 ? 0 : (f ? f.count : 0) / ((m ? m.count : 0) - (n ? n.count : 0)) * 100).toFixed(2))
+            }
+            // console.log(this.data1, this.data2, this.data3)
+        }
+
+    }
+}
+</script>
+<style lang="less" scoped>
+.personView {
+  width: 100%;
+  //   height: calc(100vh - 100px);
+  height: 100%;
+  //   background-image: url("~@/assets/images/screen/bg.png");
+  z-index: 999;
+  #dv-full-screen-container {
+      background-image: url("~@/assets/images/screen/bg.png");
+      background-size: 100% 100%;
+      box-shadow: 0 0 3px blue;
+      display: flex;
+      flex-direction: column;
+      color: white;
+  }
+}
+.topView {
+  overflow: hidden;
+  box-sizing: border-box;
+  .jbd-title {
+      text-align: center;
+      font-weight: bold;
+      width: 100%;
+      color: white;
+      font-size: 18px;
+      height: 50%;
+  }
+
+}
+
+.botView {
+    height: 98%;
+    width: 98%;
+    margin: 0 auto;
+    overflow: hidden;
+    box-sizing: border-box;
+
+}
+
+.viewTop{
+  display: flex;
+  overflow: hidden;
+  box-sizing: border-box;
+  height: 40%;
+  width: 100%;
+
+  .topleft{
+    height: 100%;
+    width: 50%;
+    overflow: hidden;
+    box-sizing: border-box;
+
+  }
+  .topright{
+    height: 100%;
+    width: 50%;
+    overflow: hidden;
+    box-sizing: border-box;
+  }
+}
+.viewBot{
+  display: flex;
+  overflow: hidden;
+  box-sizing: border-box;
+  height: 52%;
+  width: 100%;
+  .botleft{
+    height: 100%;
+    width: 33%;
+    overflow: hidden;
+    box-sizing: border-box;
+
+  }
+  .botmidd{
+    height: 100%;
+    width: 33%;
+    overflow: hidden;
+    box-sizing: border-box;
+  }
+  .botright{
+    height: 100%;
+    width: 33%;
+    overflow: hidden;
+    box-sizing: border-box;
+  }
+}
+
+</style>

+ 198 - 222
src/views/InterLaboratory/interStatistics/index.vue

@@ -20,7 +20,7 @@
                                 margin-top: 10px;
                             "
                         >
-                            室间质控看板
+                            室间质控报表
                         </div>
                         <dv-decoration-5
                             style="width: 30%; height: 50%; margin: 0 auto"
@@ -42,17 +42,6 @@
                         <div style="margin-right:10px;">选择年份</div>
                         <yearrange st :year-values="yearValues" :size="size" :value-format="valueFormat" />
                     </div>
-                    <div style="display: flex; text-align: center; height:38px; line-height: 38px;width: 25%;position: absolute; left: 33%;top:15%;z-index:1">
-                        <div style="margin-right:10px;font-size: 14px;">活动名称</div>
-                        <el-select v-model="activityValue" size="small" clearable filterable placeholder="请选择">
-                            <el-option
-                                v-for="item in activityList"
-                                :key="item.value"
-                                :label="item.value"
-                                :value="item.value"
-                            />
-                        </el-select>
-                    </div>
                     <div
 
                         style="width:12%; height:2.825rem; line-height:2.825rem; text-align:center;position: absolute; right: 3%; top:6%;color:white;"
@@ -65,7 +54,7 @@
             <dv-border-box-1
                 style="
                     width: 100%;
-                    height: 89%;
+                    height: 90%;
                     box-sizing: border-box;
                     overflow: hidden;
                 "
@@ -74,37 +63,29 @@
                 <div class="botView">
                     <div class="viewTop">
                         <div class="topleft">
-                            <topLeftChart :info="topLeftData" />
+                            <chartA :info="chartAData" />
                         </div>
                         <dv-decoration-2
                             :reverse="true"
                             style="width: 2%; height: 100%"
                         />
                         <div class="topright">
-                            <topRightChart :info="topRightData" />
+                            <chartB :info="chartBData" />
                         </div>
                     </div>
                     <dv-decoration-10
                         style="height: 2%; width: 100%; margin: 0 auto"
                     />
-
                     <div class="viewBot">
                         <div class="botleft">
-                            <botChart :info="botLeftData" />
-                        </div>
-                        <dv-decoration-2
-                            :reverse="true"
-                            style="width: 2%; height: 100%"
-                        />
-                        <div class="botmidd">
-                            <botChart :info="botMiddData" />
+                            <chartC :info="chartCData" />
                         </div>
                         <dv-decoration-2
                             :reverse="true"
                             style="width: 2%; height: 100%"
                         />
                         <div class="botright">
-                            <botChart :info="botRightData" />
+                            <chartD :info="chartDData" />
                         </div>
 
                     </div>
@@ -121,9 +102,10 @@ export default {
     components: {
 
         yearrange: () => import('../yearrange.vue'),
-        topLeftChart: () => import('./topLeftChart.vue'),
-        topRightChart: () => import('./topRightChart.vue'),
-        botChart: () => import('./botChart.vue')
+        chartA: () => import('./chartA.vue'),
+        chartB: () => import('./chartB.vue'),
+        chartC: () => import('./chartC.vue'),
+        chartD: () => import('./chartD.vue')
 
     },
     data () {
@@ -135,36 +117,39 @@ export default {
             result1: [],
             result2: [],
             result3: [],
+            result4: [],
+            result5: [],
+            result6: [],
             list1: [],
             list2: [],
             list3: [],
+            list4: [],
+            list5: [],
+            list6: [],
+            list7: [],
             data1: [],
             data2: [],
             data3: [],
             yearValues: [new Date().getFullYear() - 4 + '', new Date().getFullYear() + ''],
             size: 'mini',
             valueFormat: 'yyyy',
-            activityValue: '',
+
             activityList: [],
-            topLeftData: {
-                id: 'topLeftChart',
-                title: '室间质评计划项目总数'
-            },
-            topRightData: {
-                id: 'topRightChart',
+            chartAData: {
+                id: 'chartA',
                 title: '项目验证类型统计'
             },
-            botLeftData: {
-                id: 'botLeftChart',
-                title: '室间质评项目不合格率'
+            chartBData: {
+                id: 'chartB',
+                title: '实验室间比对率'
             },
-            botMiddData: {
-                id: 'botMiddChart',
-                title: '室间质评项目覆盖率'
+            chartCData: {
+                id: 'chartC',
+                title: '检验项目不合格率'
             },
-            botRightData: {
-                id: 'botRightChart',
-                title: '实验室间比对率'
+            chartDData: {
+                id: 'chartD',
+                title: '检验项目参加率'
             }
 
         }
@@ -176,19 +161,6 @@ export default {
             },
             deep: true
             // immediate: true
-        },
-        activityValue: {
-            handler (newVal, oldVal) {
-                this.topLeftData = {
-                    id: 'topLeftChart',
-                    title: '室间质评计划项目总数'
-                }
-                this.getList1()
-                this.topLeftData.yearArr = this.yearArr
-                this.topLeftData.numArr = this.numArr
-            },
-            deep: true
-            // immediate: true
         }
     },
     created () {
@@ -223,119 +195,71 @@ export default {
             this.activityList = data
         },
         getData () {
-            this.topLeftData = {
-                id: 'topLeftChart',
-                title: '室间质评计划项目总数'
-            }
-            this.topRightData = {
-                id: 'topRightChart',
+            this.chartAData = {
+                id: 'chartA',
                 title: '项目验证类型统计'
             }
-            this.botLeftData = {
-                id: 'botLeftChart',
-                title: '室间质评项目不合格率'
+            this.chartBData = {
+                id: 'chartB',
+                title: '实验室间比对率'
             }
-            this.botMiddData = {
-                id: 'botMiddChart',
-                title: '室间质评项目覆盖率'
+            this.chartCData = {
+                id: 'chartC',
+                title: '检验项目不合格率'
             }
-            this.botRightData = {
-                id: 'botRightChart',
-                title: '实验室间比对率'
+            this.chartDData = {
+                id: 'chartD',
+                title: '检验项目参加率'
             }
+
             this.yearArr = this.getNumArr(Number(this.yearValues[0]), Number(this.yearValues[1]))
             this.yearStr = this.yearArr.join(',')
 
-            this.getList1()
-            this.topLeftData.yearArr = this.yearArr
-            this.topLeftData.numArr = this.numArr
-            this.getList2()
-            // this.topRightData.yearArr = this.yearArr
-            this.topRightData.numArr = this.result
-            this.getList3()
-            this.botLeftData.yearArr = this.yearArr
-            this.botLeftData.result1 = this.result1
-            this.botLeftData.result2 = this.result2
-            this.botLeftData.result3 = this.result3
-            this.getList4()
-            this.botMiddData.yearArr = this.yearArr
-            this.botMiddData.list1 = this.list1
-            this.botMiddData.list2 = this.list2
-            this.botMiddData.list3 = this.list3
-
-            this.getList5()
-            this.botRightData.yearArr = this.yearArr
-            this.botRightData.data1 = this.data1
-            this.botRightData.data2 = this.data2
-            this.botRightData.data3 = this.data3
+            this.getListA()
+            this.chartAData.yearArr = this.yearArr
+            this.chartAData.numArr = this.result
+
+            this.getListB()
+            this.chartBData.yearArr = this.yearArr
+            this.chartBData.data1 = this.data1
+            this.chartBData.data2 = this.data2
+            this.chartBData.data3 = this.data3
+
+            this.getListC()
+            this.chartCData.yearArr = this.yearArr
+            this.chartCData.result1 = this.result1
+            this.chartCData.result2 = this.result2
+            this.chartCData.result3 = this.result3
+            this.chartCData.result4 = this.result4
+            this.chartCData.result5 = this.result5
+            this.chartCData.result6 = this.result6
+
+            this.getListD()
+            this.chartDData.yearArr = this.yearArr
+            this.chartDData.list1 = this.list1
+            this.chartDData.list2 = this.list2
+            this.chartDData.list3 = this.list3
+            this.chartDData.list4 = this.list4
+            this.chartDData.list5 = this.list5
+            this.chartDData.list6 = this.list6
+            this.chartDData.list7 = this.list7
         },
 
-        async getList1 () {
-            this.numArr = []
-            // const activityStr = this.activityValue ? `= '${this.activityValue}'` : `is not null`
-            // const sql = `select left(zhu_biao_shi_jian, 4) as niandu, coalesce(count(*), 0) as count
-            // from t_sjzphdjhylxqb
-            // where left(zhu_biao_shi_jian, 4) in ${yearStr}
-            // group by left(zhu_biao_shi_jian, 4)`
-            const key = this.activityValue ? 'interlabQualityBoard3' : 'interlabQualityBoard2'
-            const params = this.activityValue ? [this.activityValue, this.yearStr] : [this.yearStr]
-            // const sql = `select e.ji_hua_nian_fen_ as niandu,COALESCE(COUNT(*), 0) AS count from (select a.huo_dong_ming_che,a.zu_zhi_dan_wei_,a.xu_hao_,a.shi_yan_shi_jian_,a.bi_dui_lei_xing_,b.ji_hua_nian_fen_ from t_sjzphdjhylxqb a join (select c.*, d.ji_hua_nian_fen_ from t_cjwbzlpjhdjhxqb c join  t_cjwbzlpjhdjhb d on c.parent_id_ =  d.id_ WHERE d.shi_fou_guo_shen_='已完成' and huo_dong_ming_che ${activityStr}) b on a.huo_dong_ming_che=b.huo_dong_ming_che and a.zu_zhi_dan_wei_ = b.zu_zhi_dan_wei_ and a.xu_hao_ = b.xu_hao_ and a.shi_yan_shi_jian_ = b.shi_yan_shi_jian_) e WHERE find_in_set(ji_hua_nian_fen_, '${this.yearStr}') GROUP BY e.ji_hua_nian_fen_`
-            await this.$common.request('query', { key, params }).then((res) => {
-                const data = res.variables.data
-                for (var item of this.yearArr) {
-                    const m = data.find((v) => { return v.niandu === item + '' })
-
-                    if (m) {
-                        this.numArr.push(m.count)
-                    } else {
-                        this.numArr.push(0)
-                    }
-                }
-            })
-        },
-        async getList2 () {
+        async getListA () {
             this.result = []
-            // const sql = `select LEFT(bi_dui_lei_xing_, 2) as leixing,LEFT(zhu_biao_shi_jian, 4) as niandu, COALESCE(COUNT(*), 0) as count FROM t_sjzphdjhylxqb where left(zhu_biao_shi_jian, 4) in ${this.yearStr} GROUP BY CONCAT(LEFT(zhu_biao_shi_jian, 4), ' ', LEFT(bi_dui_lei_xing_, 2))`
-            // this.$common.request('', sql).then((res) => {
-            //     const data = res.variables.data
-            //     // console.log(data)
-
-            //     this.result.push(['product', '能力验证', '室间质评'])
-
-            //     for (var item of this.yearArr) {
-            //         const arr = []
-
-            //         arr[0] = item
-
-            //         const m = data.find((v) => { return v.niandu === item + '' && v.leixing === '能力' })
-            //         const n = data.find((v) => { return v.niandu === item + '' && v.leixing === '室间' })
-            //         // console.log(m, n)
-
-            //         if (m) {
-            //             arr[1] = m.count
-            //         } else {
-            //             arr[1] = 0
-            //         }
-            //         if (n) {
-            //             arr[2] = n.count
-            //         } else {
-            //             arr[2] = 0
-            //         }
-
-            //         this.result.push(arr)
-            //     }
-            // })
+
             let data1 = []
             let data2 = []
-            // const sql1 = `select 年度 as niandu,LEFT(能力验证类型, 2) as leixing,COUNT(*) AS count FROM v_sjzpjgpj WHERE 状态 ='已完成' and find_in_set('年度', '${this.yearStr}') GROUP BY LEFT(能力验证类型, 2)`
-            // const sql2 = `select LEFT(bian_zhi_shi_jian, 4) as niandu,'实验室' as leixing, COALESCE(COUNT(*), 0) AS count from t_sysbdjlb bian_zhi_shi_jian where shi_fou_guo_shen_ = '已完成' and find_in_set(LEFT(bian_zhi_shi_jian, 4), '${this.yearStr}')`
+            const sql1 = `select LEFT(b.nian_du_, 4) as niandu, LEFT(a.bi_dui_lei_xing_, 2) as leixing ,COUNT(*) AS count from t_sjzphdjhylxqb a left join t_sjzphdjhylb b on a.parent_id_ = b.id_ WHERE find_in_set(LEFT(b.nian_du_, 4), '${this.yearStr}') GROUP BY LEFT(b.nian_du_, 4), LEFT(a.bi_dui_lei_xing_, 2)`
+            const sql2 = `select LEFT(bian_zhi_shi_jian, 4) as niandu,'实验室' as leixing, COALESCE(COUNT(*), 0) AS count from t_sysbdjlb bian_zhi_shi_jian where shi_fou_guo_shen_ = '已完成' and find_in_set(LEFT(bian_zhi_shi_jian, 4), '${this.yearStr}')`
 
-            await this.$common.request('query', { key: 'interlabQualityBoard4', params: [this.yearStr] }).then((res) => {
+            await this.$common.request('sql', sql1).then((res) => {
                 data1 = res.variables.data
             })
-            await this.$common.request('query', { key: 'interlabQualityBoard5', params: [this.yearStr] }).then((res) => {
+            await this.$common.request('sql', sql2).then((res) => {
                 data2 = res.variables.data
             })
+
             this.result.push(['product', '能力验证', '室间质评', '实验室', '其它'])
             for (var item of this.yearArr) {
                 const m = data1.find((v) => { return v.niandu === item + '' && v.leixing === '能力' })
@@ -350,79 +274,28 @@ export default {
                 arr[3] = f ? f.count : 0
                 arr[4] = g ? g.count : 0
                 this.result.push(arr)
-                console.log(this.result)
-            }
-        },
-
-        getList3 () {
-            this.result1 = []
-            this.result2 = []
-            this.result3 = []
-            // const sql = `select 年度 as niandu,评价结果 as jieguo, COALESCE(COUNT(*), 0) AS count FROM v_sjzpjgpj WHERE find_in_set('年度', '${this.yearStr}') and 状态 = '已完成' GROUP BY CONCAT(年度, ' ',评价结果)`
-            this.$common.request('query', { key: 'interlabQualityBoard6', params: [this.yearStr] }).then((res) => {
-                const data = res.variables.data
-                for (var item of this.yearArr) {
-                    const m = data.find((v) => { return v.niandu === item + '' && v.jieguo === '通过' })
-                    const n = data.find((v) => { return v.niandu === item + '' && v.jieguo === '不满意项目' })
-                    const f = data.find((v) => { return v.niandu === item + '' && v.jieguo === '不通过' })
-                    // 总数
-                    this.result1.push((m ? m.count : 0) + (n ? n.count : 0) + (f ? f.count : 0))
-                    // 不合格数
-                    this.result2.push((f ? f.count : 0) + (n ? n.count : 0))
-                    // 不合格率
-                    this.result3.push((((m ? m.count : 0) + (n ? n.count : 0) + (f ? f.count : 0)) === 0 ? 0 : ((f ? f.count : 0) + (n ? n.count : 0)) / ((m ? m.count : 0) + (n ? n.count : 0) + (f ? f.count : 0)) * 100).toFixed(2))
-                    // console.log(this.result1, this.result2, this.result3)
-                }
-            })
-        },
-
-        async getList4 () {
-            this.list1 = []
-            this.list2 = []
-            this.list3 = []
-            const yearStr = `('${this.yearArr.join("', '")}')`
-            let data1 = []
-            let data2 = []
-            // const sql1 = `select LEFT(zhu_biao_shi_jian, 4) as niandu, COUNT(*) AS count FROM t_sjzphdjhylxqb WHERE find_in_set(LEFT(zhu_biao_shi_jian, 4), '${this.yearStr}') GROUP BY LEFT(zhu_biao_shi_jian, 4)`
-            // const sql2 = `select e.ji_hua_nian_fen_ as niandu,COALESCE(COUNT(*), 0) AS count from (select a.huo_dong_ming_che,a.zu_zhi_dan_wei_,a.xu_hao_,a.shi_yan_shi_jian_,a.bi_dui_lei_xing_,b.ji_hua_nian_fen_ from t_sjzphdjhylxqb a join (select c.*, d.ji_hua_nian_fen_ from t_cjwbzlpjhdjhxqb c join  t_cjwbzlpjhdjhb d on c.parent_id_ =  d.id_ WHERE d.shi_fou_guo_shen_='已完成') b on a.huo_dong_ming_che=b.huo_dong_ming_che and a.zu_zhi_dan_wei_ = b.zu_zhi_dan_wei_ and a.xu_hao_ = b.xu_hao_ and a.shi_yan_shi_jian_ = b.shi_yan_shi_jian_) e WHERE find_in_set(ji_hua_nian_fen_, '${this.yearStr}') GROUP BY e.ji_hua_nian_fen_`
-            await this.$common.request('query', { key: 'interlabQualityBoard7', params: [this.yearStr] }).then((res) => {
-                data1 = res.variables.data
-            })
-            await this.$common.request('query', { key: 'interlabQualityBoard8', params: [this.yearStr] }).then((res) => {
-                data2 = res.variables.data
-            })
-
-            for (var item of this.yearArr) {
-                const m = data1.find((v) => { return v.niandu === item + '' })
-                const n = data2.find((v) => { return v.niandu === item + '' })
-
-                // 一览
-                this.list1.push(m ? m.count : 0)
-                // 计划
-                this.list2.push(n ? n.count : 0)
-                // 覆盖率率
-                this.list3.push(((m ? m.count : 0) === 0 ? 0 : (n ? n.count : 0) / (m ? m.count : 0) * 100).toFixed(2))
+                // console.log(this.result)
             }
         },
 
-        async getList5 () {
+        async getListB () {
             this.data1 = []
             this.data2 = []
             this.data3 = []
             let data1 = []
             let data2 = []
             let data3 = []
-            // const sql1 = `select LEFT(zhu_biao_shi_jian, 4) as niandu, COUNT(*) AS count FROM t_sjzphdjhylxqb WHERE find_in_set(LEFT(zhu_biao_shi_jian, 4), '${this.yearStr}') GROUP BY LEFT(zhu_biao_shi_jian, 4)`
-            // const sql2 = `select e.ji_hua_nian_fen_ as niandu,COALESCE(COUNT(*), 0) AS count from (select a.huo_dong_ming_che,a.zu_zhi_dan_wei_,a.xu_hao_,a.shi_yan_shi_jian_,a.bi_dui_lei_xing_,b.ji_hua_nian_fen_ from t_sjzphdjhylxqb a join (select c.*, d.ji_hua_nian_fen_ from t_cjwbzlpjhdjhxqb c join  t_cjwbzlpjhdjhb d on c.parent_id_ =  d.id_ WHERE d.shi_fou_guo_shen_='已完成') b on a.huo_dong_ming_che=b.huo_dong_ming_che and a.zu_zhi_dan_wei_ = b.zu_zhi_dan_wei_ and a.xu_hao_ = b.xu_hao_ and a.shi_yan_shi_jian_ = b.shi_yan_shi_jian_) e WHERE find_in_set(ji_hua_nian_fen_, '${this.yearStr}') GROUP BY e.ji_hua_nian_fen_`
-            // const sql3 = `select LEFT(bian_zhi_shi_jian, 4) as niandu,'实验室' as leixing, COALESCE(COUNT(*), 0) AS count from t_sysbdjlb bian_zhi_shi_jian where shi_fou_guo_shen_ = '已完成' and find_in_set(LEFT(bian_zhi_shi_jian, 4), '${this.yearStr}')`
+            const sql1 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and shi_yan_shi_ = '✓' GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql2 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and guo_can_jia_ = '✓' or sheng_can_jia_ ='✓'   GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql3 = `select LEFT(bian_zhi_shi_jian, 4) as niandu,'实验室' as leixing, COALESCE(COUNT(*), 0) AS count from t_sysbdjlb bian_zhi_shi_jian where shi_fou_guo_shen_ = '已完成' and find_in_set(LEFT(bian_zhi_shi_jian, 4), '${this.yearStr}')`
 
-            await this.$common.request('query', { key: 'interlabQualityBoard7', params: [this.yearStr] }).then((res) => {
+            await this.$common.request('sql', sql1).then((res) => {
                 data1 = res.variables.data
             })
-            await this.$common.request('query', { key: 'interlabQualityBoard8', params: [this.yearStr] }).then((res) => {
+            await this.$common.request('sql', sql2).then((res) => {
                 data2 = res.variables.data
             })
-            await this.$common.request('query', { key: 'interlabQualityBoard5', params: [this.yearStr] }).then((res) => {
+            await this.$common.request('sql', sql3).then((res) => {
                 data3 = res.variables.data
             })
 
@@ -438,7 +311,115 @@ export default {
                 // 比对率
                 this.data3.push(((m ? m.count : 0) - (n ? n.count : 0) === 0 ? 0 : (f ? f.count : 0) / ((m ? m.count : 0) - (n ? n.count : 0)) * 100).toFixed(2))
             }
-            // console.log(this.data1, this.data2, this.data3)
+        },
+
+        async getListC () {
+            this.result1 = []
+            this.result2 = []
+            this.result3 = []
+            this.result4 = []
+            this.result5 = []
+            this.result6 = []
+            let data1 = []
+            let data2 = []
+
+            const sql1 = `select suo_shu_nian_fen_ as niandu, can_jia_dan_wei_ as danwei, COUNT(*) AS count from v_zkjgtjb where find_in_set(suo_shu_nian_fen_, '${this.yearStr}') GROUP BY suo_shu_nian_fen_, can_jia_dan_wei_`
+            const sql2 = `select suo_shu_nian_fen_ as niandu, can_jia_dan_wei_ as danwei, COALESCE(NULLIF(ke_shi_xiu_zheng_, ''), nian_du_he_ge_) AS jieguo,  COUNT(*) AS count from v_zkjgtjb where find_in_set(suo_shu_nian_fen_, '${this.yearStr}') GROUP BY suo_shu_nian_fen_, can_jia_dan_wei_, COALESCE(NULLIF(ke_shi_xiu_zheng_, ''), nian_du_he_ge_)`
+            await this.$common.request('sql', sql1).then((res) => {
+                data1 = res.variables.data
+            })
+            await this.$common.request('sql', sql2).then((res) => {
+                data2 = res.variables.data
+            })
+            for (var item of this.yearArr) {
+                const gc = data1.find((v) => { return v.niandu === item + '' && v.danwei === '国家' })
+                const sc = data1.find((v) => { return v.niandu === item + '' && v.danwei === '省级' })
+
+                const gb = data2.find((v) => { return v.niandu === item + '' && v.danwei === '国家' && v.jieguo === '不合格' })
+                const sb = data2.find((v) => { return v.niandu === item + '' && v.danwei === '省级' && v.jieguo === '不合格' })
+                // console.log(gc, sc, gb, sb)
+                // 项目总数
+                this.result1.push((gc ? gc.count : 0) + (sc ? sc.count : 0))
+                // 国不合格数
+                this.result2.push(gb ? gb.count : 0)
+                // 省不合格数
+                this.result3.push(sb ? sb.count : 0)
+                // 国不合格率
+                this.result4.push((gc ? gc.count : 0) === 0 ? 0 : ((gb ? gb.count : 0) / (gc ? gc.count : 0) * 100).toFixed(2))
+                // 省不合格率
+                this.result5.push((sc ? sc.count : 0) === 0 ? 0 : ((sb ? sb.count : 0) / (sc ? sc.count : 0) * 100).toFixed(2) || 0)
+                // 总不合格率
+                this.result6.push(((gc ? gc.count : 0) + (sc ? sc.count : 0)) === 0 ? 0 : (((gb ? gb.count : 0) + (sb ? sb.count : 0)) / ((gc ? gc.count : 0) + (sc ? sc.count : 0)) * 100).toFixed(2) || 0)
+            }
+        },
+
+        async getListD () {
+            this.list1 = []
+            this.list2 = []
+            this.list3 = []
+            this.list4 = []
+            this.list5 = []
+            this.list6 = []
+            this.list7 = []
+
+            let data1 = []
+            let data2 = []
+            let data3 = []
+            let data4 = []
+            let data5 = []
+            let data6 = []
+
+            const sql1 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and guo_kai_zhan_ = '✓' GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql2 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and guo_can_jia_ = '✓' GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql3 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and sheng_kai_zhan_ = '✓' GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql4 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and sheng_can_jia_ = '✓' GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql5 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and (guo_kai_zhan_ = '✓' or sheng_kai_zhan_ = '✓') GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            const sql6 = `select LEFT(suo_shu_nian_fen_,4) as niandu, COUNT(*) AS count from t_zkxxtjbzb WHERE find_in_set(LEFT(suo_shu_nian_fen_,4), '${this.yearStr}') and (guo_can_jia_ = '✓' or sheng_can_jia_ = '✓') GROUP BY LEFT(suo_shu_nian_fen_,4)`
+            await this.$common.request('sql', sql1).then((res) => {
+                data1 = res.variables.data
+            })
+            await this.$common.request('sql', sql2).then((res) => {
+                data2 = res.variables.data
+            })
+            await this.$common.request('sql', sql3).then((res) => {
+                data3 = res.variables.data
+            })
+            await this.$common.request('sql', sql4).then((res) => {
+                data4 = res.variables.data
+            })
+            await this.$common.request('sql', sql5).then((res) => {
+                data5 = res.variables.data
+            })
+            await this.$common.request('sql', sql6).then((res) => {
+                data6 = res.variables.data
+            })
+            for (var item of this.yearArr) {
+                const gk = data1.find((v) => { return v.niandu === item + '' })
+                const gc = data2.find((v) => { return v.niandu === item + '' })
+                const sk = data3.find((v) => { return v.niandu === item + '' })
+                const sc = data4.find((v) => { return v.niandu === item + '' })
+                const zk = data5.find((v) => { return v.niandu === item + '' })
+                const zc = data6.find((v) => { return v.niandu === item + '' })
+
+                const gclv = (gk ? gk.count : 0) === 0 ? 0 : (((gc ? gc.count : 0) / (gk ? gk.count : 0)) * 100).toFixed(2)
+                const sclv = (sk ? sk.count : 0) === 0 ? 0 : (((sc ? gc.count : 0) / (sk ? sk.count : 0)) * 100).toFixed(2)
+                const zclv = (zk ? zk.count : 0) === 0 ? 0 : (((zc ? zc.count : 0) / (zk ? zk.count : 0)) * 100).toFixed(2)
+
+                // 国开展
+                this.list1.push(gk ? gk.count : 0)
+                // 国参加
+                this.list2.push(gc ? gc.count : 0)
+                // 省开展
+                this.list3.push(sk ? sk.count : 0)
+                // 省参加
+                this.list4.push(sc ? sc.count : 0)
+                // 国参加率
+                this.list5.push(gclv)
+                // 省参加率
+                this.list6.push(sclv)
+                // 总参加率
+                this.list7.push(zclv)
+            }
         }
 
     }
@@ -487,7 +468,7 @@ export default {
   display: flex;
   overflow: hidden;
   box-sizing: border-box;
-  height: 40%;
+  height: 45%;
   width: 100%;
 
   .topleft{
@@ -508,24 +489,19 @@ export default {
   display: flex;
   overflow: hidden;
   box-sizing: border-box;
-  height: 52%;
+  height: 45%;
   width: 100%;
+
   .botleft{
     height: 100%;
-    width: 33%;
+    width: 50%;
     overflow: hidden;
     box-sizing: border-box;
 
   }
-  .botmidd{
-    height: 100%;
-    width: 33%;
-    overflow: hidden;
-    box-sizing: border-box;
-  }
   .botright{
     height: 100%;
-    width: 33%;
+    width: 50%;
     overflow: hidden;
     box-sizing: border-box;
   }