对接项目当前状态
This commit is contained in:
@@ -826,4 +826,10 @@ module.exports = {
|
||||
refuse:'Refuse',
|
||||
taskTermination:'Task termination',
|
||||
projectStatusAndProgress:'Project status and progress',
|
||||
listConfirmationProgress:'List confirmation progress',
|
||||
taskConfirmationProgress:'Task confirmation progress',
|
||||
designComplianceConfirmationProgress:'Design Compliance Confirmation Progress',
|
||||
preHomeConfirmProgress:'Pre-Home confirm progress',
|
||||
verificationComplianceConfirmationProgress:'Verification compliance confirmation progress',
|
||||
totalTable:'Total',
|
||||
}
|
||||
@@ -831,4 +831,10 @@ module.exports = {
|
||||
refuse:'拒绝',
|
||||
taskTermination:'任务终止',
|
||||
projectStatusAndProgress:'项目状态进度',
|
||||
listConfirmationProgress:'清单确认进度',
|
||||
taskConfirmationProgress:'任务确认进度',
|
||||
designComplianceConfirmationProgress:'设计符合性确认进度',
|
||||
preHomeConfirmProgress:'Pre-Home确认进度',
|
||||
verificationComplianceConfirmationProgress:'验证符合性确认进度',
|
||||
totalTable:'总数',
|
||||
}
|
||||
@@ -4,7 +4,20 @@
|
||||
<div id="main-left"></div>
|
||||
</div>
|
||||
<div class="box-content-right">
|
||||
<div id="main-right"></div>
|
||||
<div id="main-right">
|
||||
<a-table
|
||||
ref="table"
|
||||
:loading="loading"
|
||||
:pagination="false"
|
||||
:scroll="{x: true}"
|
||||
:data-source="dataSource"
|
||||
:columns="columns"
|
||||
>
|
||||
<template slot="footer" slot-scope="currentPageData">
|
||||
{{$t('totalTable')}}
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -15,7 +28,37 @@
|
||||
export default {
|
||||
name: 'certificationProgress',
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
loading:false,
|
||||
dataSource:[],
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('notInvolved'),
|
||||
align: 'center',
|
||||
dataIndex: 'nonConformity',
|
||||
},
|
||||
{
|
||||
title: this.$t('toBeStarted'),
|
||||
align: 'center',
|
||||
dataIndex: 'Tracked',
|
||||
},
|
||||
{
|
||||
title: this.$t('inProgress'),
|
||||
align: 'center',
|
||||
dataIndex: 'accord',
|
||||
},
|
||||
{
|
||||
title: this.$t('experimentFailed'),
|
||||
align: 'center',
|
||||
dataIndex: 'notEvaluated',
|
||||
},
|
||||
{
|
||||
title: this.$t('experimentPassed'),
|
||||
align: 'center',
|
||||
dataIndex: 'notEvaluatedOne',
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.mainLeftEcharts()
|
||||
@@ -59,11 +102,14 @@
|
||||
},
|
||||
mainLeftEcharts() {
|
||||
let data = [
|
||||
{ value: 1048, name: '待审查' },
|
||||
{ value: 735, name: '审查中' },
|
||||
{ value: 580, name: '审查完成' }
|
||||
{ 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') }
|
||||
]
|
||||
this.getEcharts('main-left', '内部审查进度', ['#00BEBE', '#FDB033', '#2F8DF3'], data)
|
||||
let color = ['#9DB9D4', '#FDB033', '#37CED1', '#FF8543', '#2F8DF3', ]
|
||||
this.getEcharts('main-left', this.$t('CertificationProgress'), color, data)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
+68
-22
@@ -1,5 +1,11 @@
|
||||
<template>
|
||||
<div class="box-content">
|
||||
<div class="headerText">
|
||||
{{this.$t('redSchedule')}};
|
||||
{{this.$t('yellowSchedule')}};
|
||||
{{this.$t('greenRequirements')}};
|
||||
{{this.$t('blueUndeterminedState')}};
|
||||
</div>
|
||||
<div class="box-content-left">
|
||||
<div id="main-left"></div>
|
||||
</div>
|
||||
@@ -13,6 +19,9 @@
|
||||
:data-source="dataSource"
|
||||
:columns="columns"
|
||||
>
|
||||
<template slot="footer" slot-scope="currentPageData">
|
||||
{{$t('totalTable')}}:{{currentProjectStatusTotal}}
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
</div>
|
||||
@@ -29,46 +38,45 @@
|
||||
return {
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
currentProjectStatusTotal: 0,
|
||||
url: {
|
||||
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('nonConformity'),
|
||||
title: this.$t('red'),
|
||||
align: 'center',
|
||||
dataIndex: 'nonConformity',
|
||||
scopedSlots: { customRender: 'titleName' }
|
||||
dataIndex: 'redCount'
|
||||
},
|
||||
{
|
||||
title: this.$t('Tracked'),
|
||||
title: this.$t('yellow'),
|
||||
align: 'center',
|
||||
dataIndex: 'Tracked',
|
||||
scopedSlots: { customRender: 'titleName' }
|
||||
dataIndex: 'yellowCount'
|
||||
},
|
||||
{
|
||||
title: this.$t('accord'),
|
||||
title: this.$t('green'),
|
||||
align: 'center',
|
||||
dataIndex: 'accord',
|
||||
scopedSlots: { customRender: 'titleName' }
|
||||
dataIndex: 'greenCount'
|
||||
},
|
||||
{
|
||||
title: this.$t('notEvaluated'),
|
||||
title: this.$t('blue'),
|
||||
align: 'center',
|
||||
dataIndex: 'notEvaluated',
|
||||
scopedSlots: { customRender: 'titleName' }
|
||||
dataIndex: 'blueCount'
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.mainLeftEcharts()
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
getAction(this.url.getProjectDetailsStatistics, { id: this.$route.query.id }).then((res) => {
|
||||
if (res.success) {
|
||||
|
||||
this.dataSource = [{}]
|
||||
let dataSource = res.result.currentProjectStatusMap.currentProjectStatusMapList || []
|
||||
this.mainLeftEcharts(dataSource)
|
||||
this.currentProjectStatusTotal = res.result.currentProjectStatusMap.currentProjectStatusTotal
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -108,14 +116,43 @@
|
||||
]
|
||||
})
|
||||
},
|
||||
mainLeftEcharts() {
|
||||
let data = [
|
||||
{ value: 1048, name: this.$t('nonConformity') },
|
||||
{ value: 735, name: this.$t('Tracked') },
|
||||
{ value: 580, name: this.$t('accord') },
|
||||
{ value: 580, name: this.$t('notEvaluated') }
|
||||
]
|
||||
this.getEcharts('main-left', this.$t('CurrentStatusOfTheProject'), ['#2F8DF3', '#FF8543', '#37CED1', '#FDB033', '#9DB9D4'], data)
|
||||
mainLeftEcharts(dataSource) {
|
||||
let data = []
|
||||
let color = []
|
||||
if (dataSource && dataSource.length > 0) {
|
||||
dataSource.forEach(res => {
|
||||
if (res.color == '0') {
|
||||
data.push({
|
||||
value: res.conditionAssessmentCount,
|
||||
name: this.$t('blue')
|
||||
})
|
||||
color.push('#00B3BE')
|
||||
this.dataSource[0].blueCount = res.conditionAssessmentCount
|
||||
} else if (res.color == '1') {
|
||||
data.push({
|
||||
value: res.conditionAssessmentCount,
|
||||
name: this.$t('red')
|
||||
})
|
||||
color.push('#E83030')
|
||||
this.dataSource[0].redCount = res.conditionAssessmentCount
|
||||
} else if (res.color == '2') {
|
||||
data.push({
|
||||
value: res.conditionAssessmentCount,
|
||||
name: this.$t('yellow')
|
||||
})
|
||||
color.push('#FDA71C')
|
||||
this.dataSource[0].yellowCount = res.conditionAssessmentCount
|
||||
} else if (res.color == '3') {
|
||||
data.push({
|
||||
value: res.conditionAssessmentCount,
|
||||
name: this.$t('green')
|
||||
})
|
||||
this.dataSource[0].greenCount = res.conditionAssessmentCount
|
||||
color.push('#26BD4B')
|
||||
}
|
||||
})
|
||||
}
|
||||
this.getEcharts('main-left', this.$t('CurrentStatusOfTheProject'), color, data)
|
||||
}
|
||||
|
||||
}
|
||||
@@ -130,6 +167,7 @@
|
||||
|
||||
.box-content-left {
|
||||
width: calc(50% - 12px);
|
||||
margin-top: 30px;
|
||||
height: 398px;
|
||||
border: 2px #eff1f3 solid;
|
||||
|
||||
@@ -143,6 +181,7 @@
|
||||
|
||||
.box-content-right {
|
||||
width: calc(50% - 12px);
|
||||
margin-top: 30px;
|
||||
height: 398px;
|
||||
border: 2px #eff1f3 solid;
|
||||
|
||||
@@ -154,4 +193,11 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.headerText {
|
||||
margin-left: 30px;
|
||||
color: #040B29;
|
||||
font-weight: 400;
|
||||
position: absolute;
|
||||
}
|
||||
</style>
|
||||
@@ -1,27 +1,59 @@
|
||||
<template>
|
||||
<div class="box-content">
|
||||
<div class="box-content-left">
|
||||
<div id="main-left"></div>
|
||||
<div>
|
||||
<div class="box-content">
|
||||
<div class="box-content-left">
|
||||
<div id="main-left"></div>
|
||||
</div>
|
||||
<div class="box-content-right">
|
||||
<div id="main-right"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-content-right">
|
||||
<div id="main-right"></div>
|
||||
<div class="box-content">
|
||||
<div class="box-content-left">
|
||||
<div id="main-left-content"></div>
|
||||
</div>
|
||||
<div class="box-content-right">
|
||||
<div id="main-right-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-content">
|
||||
<div class="box-content-left">
|
||||
<div id="main-bottom"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'DeliverableStatusEchart',
|
||||
data() {
|
||||
return {}
|
||||
return {
|
||||
url: {
|
||||
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.mainLeftEcharts()
|
||||
this.mainLeftContentEcharts()
|
||||
this.mainRightEcharts()
|
||||
this.mainRightContentEcharts()
|
||||
this.mainBottomEcharts()
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
getAction(this.url.getProjectDetailsStatistics, { id: this.$route.query.id }).then((res) => {
|
||||
if (res.success) {
|
||||
let listingToConfirmMap = res.result.listingToConfirmMap.listingToConfirmMapList || []
|
||||
this.mainLeftEcharts(listingToConfirmMap)
|
||||
}
|
||||
})
|
||||
},
|
||||
getEcharts(chart, title, color, data) {
|
||||
var myChart = echarts.init(document.getElementById(chart))
|
||||
myChart.setOption({
|
||||
@@ -60,19 +92,51 @@
|
||||
},
|
||||
mainLeftEcharts() {
|
||||
let data = [
|
||||
{ value: 1048, name: '待审查' },
|
||||
{ value: 735, name: '审查中' },
|
||||
{ value: 580, name: '审查完成' }
|
||||
{ value: 1048, name: this.$t('notLaunch') },
|
||||
{ value: 735, name: this.$t('toBeConfirmed') },
|
||||
{ value: 580, name: this.$t('accept') },
|
||||
{ value: 580, name: this.$t('refuse') }
|
||||
]
|
||||
this.getEcharts('main-left', '内部审查进度', ['#00BEBE', '#FDB033', '#2F8DF3'], data)
|
||||
this.getEcharts('main-left', this.$t('listConfirmationProgress'), ['#00BEBE', '#FDB033', '#2F8DF3', '#9DB9D4'], data)
|
||||
},
|
||||
mainRightEcharts() {
|
||||
let data = [
|
||||
{ value: 1048, name: '待审查' },
|
||||
{ value: 735, name: '审查中' },
|
||||
{ value: 580, name: '审查完成' }
|
||||
{ value: 1048, name: this.$t('notLaunch') },
|
||||
{ value: 735, name: this.$t('toBeConfirmed') },
|
||||
{ value: 580, name: this.$t('accept') },
|
||||
{ value: 580, name: this.$t('refuse') }
|
||||
]
|
||||
this.getEcharts('main-right', '法规握手进度', ['#00BEBE', '#FDB033', '#2F8DF3'], data)
|
||||
this.getEcharts('main-right', this.$t('taskConfirmationProgress'), ['#00BEBE', '#FDB033', '#2F8DF3', '#9DB9D4'], data)
|
||||
},
|
||||
mainLeftContentEcharts() {
|
||||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -83,6 +147,7 @@
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.box-content-left {
|
||||
width: calc(50% - 12px);
|
||||
@@ -95,6 +160,20 @@
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#main-left-content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#main-bottom {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.box-content-right {
|
||||
@@ -108,6 +187,13 @@
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#main-right-content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -44,7 +44,7 @@
|
||||
size="middle"
|
||||
:loading="loading"
|
||||
:pagination="false"
|
||||
:scroll="{x: true}"
|
||||
:scroll="{x: true,y:500}"
|
||||
:data-source="dataSource"
|
||||
:columns="columns"
|
||||
>
|
||||
@@ -83,6 +83,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: 'index',
|
||||
data() {
|
||||
@@ -90,6 +92,9 @@
|
||||
queryParam: {},
|
||||
loading: false,
|
||||
dataSource: [],
|
||||
url: {
|
||||
list: '/project/ProjectStatusBoardController/scheduleInfoList'
|
||||
},
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('entryName'),
|
||||
@@ -101,47 +106,47 @@
|
||||
{
|
||||
title: this.$t('targetMarket'),
|
||||
align: 'center',
|
||||
dataIndex: 'targetMarket_dictText',
|
||||
dataIndex: 'targetMarket',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
dataIndex: 'projectStatus_dictText',
|
||||
dataIndex: 'projectStatus',
|
||||
scopedSlots: { title: 'projectStatusTitle' },
|
||||
width: 240
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
dataIndex: 'studioEngineerName',
|
||||
dataIndex: 'certificationProgress',
|
||||
width: 340,
|
||||
scopedSlots: { title: 'CertificationProgressTitle' }
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
dataIndex: 'certificationEngineerName',
|
||||
dataIndex: 'inventory',
|
||||
width: 340,
|
||||
scopedSlots: { title: 'listConfirmationStatusTitle' }
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
dataIndex: 'vehiclePlatform_dictText',
|
||||
dataIndex: 'task',
|
||||
width: 340,
|
||||
scopedSlots: { title: 'taskAffirmStatusTitle' }
|
||||
},
|
||||
{
|
||||
align: 'center',
|
||||
dataIndex: 'digitalPlatform_dictText',
|
||||
dataIndex: 'design',
|
||||
width: 440,
|
||||
scopedSlots: { title: 'designComplianceReviewTitle' }
|
||||
},
|
||||
{
|
||||
dataIndex: 'digitalPlatform',
|
||||
dataIndex: 'pre',
|
||||
align: 'center',
|
||||
width: 440,
|
||||
scopedSlots: { title: 'preHomeConfirmationTitle' }
|
||||
},
|
||||
{
|
||||
dataIndex: 'digitalPlatform',
|
||||
dataIndex: 'verify',
|
||||
align: 'center',
|
||||
width: 440,
|
||||
scopedSlots: { title: 'verificationComplianceReviewTitle' }
|
||||
@@ -150,6 +155,7 @@
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
searchQuery() {
|
||||
@@ -157,6 +163,15 @@
|
||||
},
|
||||
searchReset() {
|
||||
|
||||
},
|
||||
getList() {
|
||||
getAction(this.url.list, {}).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource = res.result || []
|
||||
} else {
|
||||
this.dataSource = []
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user