对接项目详情的图标
This commit is contained in:
@@ -14,7 +14,7 @@
|
|||||||
:columns="columns"
|
:columns="columns"
|
||||||
>
|
>
|
||||||
<template slot="footer" slot-scope="currentPageData">
|
<template slot="footer" slot-scope="currentPageData">
|
||||||
{{$t('totalTable')}}
|
{{$t('totalTable')}}:{{certificationProgressTotal}}
|
||||||
</template>
|
</template>
|
||||||
</a-table>
|
</a-table>
|
||||||
</div>
|
</div>
|
||||||
@@ -24,46 +24,108 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import * as echarts from 'echarts'
|
import * as echarts from 'echarts'
|
||||||
|
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'certificationProgress',
|
name: 'certificationProgress',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
loading:false,
|
loading: false,
|
||||||
dataSource:[],
|
dataSource: [],
|
||||||
|
certificationProgressTotal: 0,
|
||||||
|
url: {
|
||||||
|
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
|
||||||
|
},
|
||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
title: this.$t('notInvolved'),
|
title: this.$t('notInvolved'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
dataIndex: 'nonConformity',
|
dataIndex: 'notInvolved'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('toBeStarted'),
|
title: this.$t('toBeStarted'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
dataIndex: 'Tracked',
|
dataIndex: 'toBeStarted'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('inProgress'),
|
title: this.$t('inProgress'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
dataIndex: 'accord',
|
dataIndex: 'inProgress'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('experimentFailed'),
|
title: this.$t('experimentFailed'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
dataIndex: 'notEvaluated',
|
dataIndex: 'experimentFailed'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('experimentPassed'),
|
title: this.$t('experimentPassed'),
|
||||||
align: 'center',
|
align: 'center',
|
||||||
dataIndex: 'notEvaluatedOne',
|
dataIndex: 'experimentPassed'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.mainLeftEcharts()
|
this.mainLeftEcharts()
|
||||||
|
this.getData()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
getData() {
|
||||||
|
getAction(this.url.getProjectDetailsStatistics, { id: this.$route.query.id }).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
let certificationProgressMap = res.result.certificationProgressMap.certificationProgressMapList || []
|
||||||
|
this.certificationProgressTotal = res.result.certificationProgressMap.certificationProgressTotal
|
||||||
|
this.dataEcharts(certificationProgressMap)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
dataEcharts(val) {
|
||||||
|
let data = []
|
||||||
|
let color = []
|
||||||
|
this.dataSource = []
|
||||||
|
if (val && val.length > 0) {
|
||||||
|
this.dataSource = [{}]
|
||||||
|
val.forEach(res => {
|
||||||
|
if (res.certificationProgress == 'NA') {
|
||||||
|
data.push({
|
||||||
|
value: res.certificationProgressCount,
|
||||||
|
name: this.$t('notInvolved')
|
||||||
|
})
|
||||||
|
color.push('#9DB9D4')
|
||||||
|
this.dataSource[0].notInvolved = res.certificationProgressCount
|
||||||
|
} else if (res.certificationProgress == 'Not start') {
|
||||||
|
data.push({
|
||||||
|
value: res.certificationProgressCount,
|
||||||
|
name: this.$t('toBeStarted')
|
||||||
|
})
|
||||||
|
color.push('#FDB033')
|
||||||
|
this.dataSource[0].toBeStarted = res.certificationProgressCount
|
||||||
|
} else if (res.certificationProgress == 'In progress') {
|
||||||
|
data.push({
|
||||||
|
value: res.certificationProgressCount,
|
||||||
|
name: this.$t('inProgress')
|
||||||
|
})
|
||||||
|
color.push('#FF8543')
|
||||||
|
this.dataSource[0].inProgress = res.certificationProgressCount
|
||||||
|
} else if (res.certificationProgress == 'Test failed') {
|
||||||
|
data.push({
|
||||||
|
value: res.certificationProgressCount,
|
||||||
|
name: this.$t('experimentFailed')
|
||||||
|
})
|
||||||
|
color.push('#FF8543')
|
||||||
|
this.dataSource[0].experimentFailed = res.certificationProgressCount
|
||||||
|
} else if (res.certificationProgress == 'Test passed') {
|
||||||
|
data.push({
|
||||||
|
value: res.certificationProgressCount,
|
||||||
|
name: this.$t('experimentPassed')
|
||||||
|
})
|
||||||
|
color.push('#2F8DF3')
|
||||||
|
this.dataSource[0].experimentPassed = res.certificationProgressCount
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.mainLeftEcharts(data, color)
|
||||||
|
},
|
||||||
getEcharts(chart, title, color, data) {
|
getEcharts(chart, title, color, data) {
|
||||||
var myChart = echarts.init(document.getElementById(chart))
|
var myChart = echarts.init(document.getElementById(chart))
|
||||||
myChart.setOption({
|
myChart.setOption({
|
||||||
@@ -100,15 +162,7 @@
|
|||||||
]
|
]
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
mainLeftEcharts() {
|
mainLeftEcharts(data, color) {
|
||||||
let data = [
|
|
||||||
{ value: 1048, name: this.$t('notInvolved') },
|
|
||||||
{ value: 735, name: this.$t('toBeStarted') },
|
|
||||||
{ value: 580, name: this.$t('inProgress') },
|
|
||||||
{ value: 580, name: this.$t('experimentFailed') },
|
|
||||||
{ value: 580, name: this.$t('experimentPassed') }
|
|
||||||
]
|
|
||||||
let color = ['#9DB9D4', '#FDB033', '#37CED1', '#FF8543', '#2F8DF3', ]
|
|
||||||
this.getEcharts('main-left', this.$t('CertificationProgress'), color, data)
|
this.getEcharts('main-left', this.$t('CertificationProgress'), color, data)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -35,7 +35,7 @@
|
|||||||
return {
|
return {
|
||||||
url: {
|
url: {
|
||||||
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
|
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@@ -50,10 +50,103 @@
|
|||||||
getAction(this.url.getProjectDetailsStatistics, { id: this.$route.query.id }).then((res) => {
|
getAction(this.url.getProjectDetailsStatistics, { id: this.$route.query.id }).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
let listingToConfirmMap = res.result.listingToConfirmMap.listingToConfirmMapList || []
|
let listingToConfirmMap = res.result.listingToConfirmMap.listingToConfirmMapList || []
|
||||||
this.mainLeftEcharts(listingToConfirmMap)
|
let taskToConfirmMap = res.result.taskToConfirmMap.taskToConfirmMapList || []
|
||||||
|
let designComplianceMap = res.result.designComplianceMap.designComplianceMapList || []
|
||||||
|
let prehomoMap = res.result.prehomoMap.prehomoMapList || []
|
||||||
|
let verifyComplianceMap = res.result.verifyComplianceMap.verifyComplianceMapList || []
|
||||||
|
this.dataEcharts(listingToConfirmMap, 1)
|
||||||
|
this.dataEcharts(taskToConfirmMap, 2)
|
||||||
|
this.dataEchartsOne(designComplianceMap, 1)
|
||||||
|
this.dataEchartsOne(prehomoMap, 2)
|
||||||
|
this.dataEchartsOne(verifyComplianceMap, 3)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
dataEcharts(val, num) {
|
||||||
|
let data = []
|
||||||
|
let color = []
|
||||||
|
if (val && val.length > 0) {
|
||||||
|
val.forEach((res) => {
|
||||||
|
if (res.inventoryAffirmStatus == 'Not started' || res.taskAffirmStatus == 'Not started') {
|
||||||
|
data.push({
|
||||||
|
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
|
||||||
|
name: this.$t('notLaunch')
|
||||||
|
})
|
||||||
|
color.push('#00BEBE')
|
||||||
|
} else if (res.inventoryAffirmStatus == 'List to confirm' || res.taskAffirmStatus == 'List to confirm') {
|
||||||
|
data.push({
|
||||||
|
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
|
||||||
|
name: this.$t('toBeConfirmed')
|
||||||
|
})
|
||||||
|
color.push('#FDB033')
|
||||||
|
} else if (res.inventoryAffirmStatus == 'Accepted' || res.taskAffirmStatus == 'Accepted') {
|
||||||
|
data.push({
|
||||||
|
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
|
||||||
|
name: this.$t('accept')
|
||||||
|
})
|
||||||
|
color.push('#2F8DF3')
|
||||||
|
} else if (res.inventoryAffirmStatus == 'Rejected' || res.taskAffirmStatus == 'Rejected') {
|
||||||
|
data.push({
|
||||||
|
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
|
||||||
|
name: this.$t('refuse')
|
||||||
|
})
|
||||||
|
color.push('#9DB9D4')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (num == 1) {
|
||||||
|
this.mainLeftEcharts(data, color)
|
||||||
|
} else {
|
||||||
|
this.mainRightEcharts(data, color)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dataEchartsOne(val, num) {
|
||||||
|
let data = []
|
||||||
|
let color = []
|
||||||
|
if (val && val.length > 0) {
|
||||||
|
val.forEach((res) => {
|
||||||
|
if (res.designFlowTaskStatus == 'No rating' || res.prehomoFlowTaskStatus == 'No rating' || res.verifyFlowTaskStatus == 'No rating') {
|
||||||
|
data.push({
|
||||||
|
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
|
||||||
|
name: this.$t('toBeConfirmed')
|
||||||
|
})
|
||||||
|
color.push('#37CED1')
|
||||||
|
} else if (res.designFlowTaskStatus == 'Compliance' || res.prehomoFlowTaskStatus == 'Compliance' || res.verifyFlowTaskStatus == 'Compliance') {
|
||||||
|
data.push({
|
||||||
|
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
|
||||||
|
name: this.$t('accord')
|
||||||
|
})
|
||||||
|
color.push('#2F8DF3')
|
||||||
|
} else if (res.designFlowTaskStatus == 'Non-Compliance' || res.prehomoFlowTaskStatus == 'Non-Compliance' || res.verifyFlowTaskStatus == 'Non-Compliance') {
|
||||||
|
data.push({
|
||||||
|
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
|
||||||
|
name: this.$t('nonConformity')
|
||||||
|
})
|
||||||
|
color.push('#FF8543')
|
||||||
|
} else if (res.designFlowTaskStatus == 'To be tracked' || res.prehomoFlowTaskStatus == 'To be tracked' || res.verifyFlowTaskStatus == 'To be tracked') {
|
||||||
|
data.push({
|
||||||
|
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
|
||||||
|
name: this.$t('Tracked')
|
||||||
|
})
|
||||||
|
color.push('#FDB033')
|
||||||
|
} else if (res.designFlowTaskStatus == 'NA' || res.prehomoFlowTaskStatus == 'NA' || res.verifyFlowTaskStatus == 'NA') {
|
||||||
|
data.push({
|
||||||
|
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
|
||||||
|
name: this.$t('notInvolved')
|
||||||
|
})
|
||||||
|
color.push('#9DB9D4')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
if (num == 1) {
|
||||||
|
this.mainLeftContentEcharts(data, color)
|
||||||
|
} else if (num == 2) {
|
||||||
|
this.mainRightContentEcharts(data, color)
|
||||||
|
} else if (num == 3) {
|
||||||
|
this.mainBottomEcharts(data, color)
|
||||||
|
}
|
||||||
|
},
|
||||||
getEcharts(chart, title, color, data) {
|
getEcharts(chart, title, color, data) {
|
||||||
var myChart = echarts.init(document.getElementById(chart))
|
var myChart = echarts.init(document.getElementById(chart))
|
||||||
myChart.setOption({
|
myChart.setOption({
|
||||||
@@ -89,54 +182,26 @@
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
},
|
}
|
||||||
mainLeftEcharts() {
|
,
|
||||||
let data = [
|
mainLeftEcharts(data, color) {
|
||||||
{ value: 1048, name: this.$t('notLaunch') },
|
this.getEcharts('main-left', this.$t('listConfirmationProgress'), color, data)
|
||||||
{ value: 735, name: this.$t('toBeConfirmed') },
|
}
|
||||||
{ value: 580, name: this.$t('accept') },
|
,
|
||||||
{ value: 580, name: this.$t('refuse') }
|
mainRightEcharts(data, color) {
|
||||||
]
|
this.getEcharts('main-right', this.$t('taskConfirmationProgress'), color, data)
|
||||||
this.getEcharts('main-left', this.$t('listConfirmationProgress'), ['#00BEBE', '#FDB033', '#2F8DF3', '#9DB9D4'], data)
|
}
|
||||||
},
|
,
|
||||||
mainRightEcharts() {
|
mainLeftContentEcharts(data, color) {
|
||||||
let data = [
|
this.getEcharts('main-left-content', this.$t('designComplianceConfirmationProgress'), color, data)
|
||||||
{ value: 1048, name: this.$t('notLaunch') },
|
}
|
||||||
{ value: 735, name: this.$t('toBeConfirmed') },
|
,
|
||||||
{ value: 580, name: this.$t('accept') },
|
mainRightContentEcharts(data, color) {
|
||||||
{ value: 580, name: this.$t('refuse') }
|
this.getEcharts('main-right-content', this.$t('preHomeConfirmProgress'), color, data)
|
||||||
]
|
}
|
||||||
this.getEcharts('main-right', this.$t('taskConfirmationProgress'), ['#00BEBE', '#FDB033', '#2F8DF3', '#9DB9D4'], data)
|
,
|
||||||
},
|
mainBottomEcharts(data, color) {
|
||||||
mainLeftContentEcharts() {
|
this.getEcharts('main-bottom', this.$t('verificationComplianceConfirmationProgress'), color, data)
|
||||||
let data = [
|
|
||||||
{ value: 1048, name: this.$t('toBeConfirmed') },
|
|
||||||
{ value: 735, name: this.$t('accord') },
|
|
||||||
{ value: 580, name: this.$t('nonConformity') },
|
|
||||||
{ value: 580, name: this.$t('Tracked') },
|
|
||||||
{ value: 580, name: this.$t('notInvolved') }
|
|
||||||
]
|
|
||||||
this.getEcharts('main-left-content', this.$t('designComplianceConfirmationProgress'), ['#37CED1', '#2F8DF3', '#FF8543', '#FDB033', '#9DB9D4'], data)
|
|
||||||
},
|
|
||||||
mainRightContentEcharts() {
|
|
||||||
let data = [
|
|
||||||
{ value: 1048, name: this.$t('toBeConfirmed') },
|
|
||||||
{ value: 735, name: this.$t('accord') },
|
|
||||||
{ value: 580, name: this.$t('nonConformity') },
|
|
||||||
{ value: 580, name: this.$t('Tracked') },
|
|
||||||
{ value: 580, name: this.$t('notInvolved') }
|
|
||||||
]
|
|
||||||
this.getEcharts('main-right-content', this.$t('preHomeConfirmProgress'), ['#37CED1', '#2F8DF3', '#FF8543', '#FDB033', '#9DB9D4'], data)
|
|
||||||
},
|
|
||||||
mainBottomEcharts() {
|
|
||||||
let data = [
|
|
||||||
{ value: 1048, name: this.$t('toBeConfirmed') },
|
|
||||||
{ value: 735, name: this.$t('accord') },
|
|
||||||
{ value: 580, name: this.$t('nonConformity') },
|
|
||||||
{ value: 580, name: this.$t('Tracked') },
|
|
||||||
{ value: 580, name: this.$t('notInvolved') }
|
|
||||||
]
|
|
||||||
this.getEcharts('main-bottom', this.$t('verificationComplianceConfirmationProgress'), ['#37CED1', '#2F8DF3', '#FF8543', '#FDB033', '#9DB9D4'], data)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user