WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

对接项目库详情的项目状态

Browse Source
This commit is contained in:
范强强
2023-04-25 18:01:02 +08:00
parent fe1391f0b4
commit 03953ea255
9 changed files with 463 additions and 279 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/common/lang/en-us.js
+6
View File
@@ -1816,4 +1816,10 @@ module.exports = {
selectTime:'Select Time',
designCompliance:'Design Compliance',
verifyCompliance:'Verify Compliance',
stateExport:'State Export',
completeVehicle:'Complete Vehicle',
components:'Components',
componentReportNotSubmitted:'Component report not submitted',
componentReportSubmitted:'Component report submitted',
componentReportHasBeenStored:'Component report has been stored',
}
jero-web/src/common/lang/zh-cn.js
+6
View File
@@ -1918,4 +1918,10 @@ module.exports = {
selectTime:'选择时间',
designCompliance:'设计符合性',
verifyCompliance:'验证符合性',
stateExport:'状态导出',
completeVehicle:'整车',
components:'零部件',
componentReportNotSubmitted:'部件报告未提交',
componentReportSubmitted:'部件报告已提交',
componentReportHasBeenStored:'部件报告已入库',
}
jero-web/src/views/projectManagement/components/ProjectDetails.vue
+48 -22
View File
@@ -42,14 +42,19 @@
</div>
<div class="text-field">
<span class="text-field-left" style="float: left;margin-top: 3px" :title="$t('ListOfRelevantPersonnel')">{{$t('ListOfRelevantPersonnel')}}</span>
<span class="text-field-right"
<span class="text-field-right text-field-right-color"
>
<a-button type="primary" v-has="'projectRelatedPersonnel:page'"
:title="$t('ListOfRelevantPersonnel')"
class="button-text"
@click="ListOfRelevantPersonnelClick">
{{$t('ListOfRelevantPersonnel')}}
</a-button>
<span v-has="'projectRelatedPersonnel:page'"
@click="ListOfRelevantPersonnelClick">
<a-icon type="eye" />
{{$t('ListOfRelevantPersonnel')}}
</span>
<!-- <a-button type="primary" v-has="'projectRelatedPersonnel:page'"-->
<!-- :title="$t('ListOfRelevantPersonnel')"-->
<!-- class="button-text"-->
<!-- >-->
<!-- {{$t('ListOfRelevantPersonnel')}}-->
<!-- </a-button>-->
</span>
</div>
</div>
@@ -85,13 +90,13 @@
@click="urlClick(queryForm.attestationPlan)"
>{{queryForm.attestationPlan}}</span>
</div>
<div class="text-field">
<span class="text-field-left" :title="$t('configurationInformation')">{{$t('configurationInformation')}}</span>
<span class="text-field-right text-field-right-color"
:title="queryForm.ipdInfo"
@click="urlClick(queryForm.ipdInfo)"
>{{queryForm.ipdInfo}}</span>
</div>
<div class="text-field">
<span class="text-field-left" :title="$t('configurationInformation')">{{$t('configurationInformation')}}</span>
<span class="text-field-right text-field-right-color"
:title="queryForm.ipdInfo"
@click="urlClick(queryForm.ipdInfo)"
>{{queryForm.ipdInfo}}</span>
</div>
</div>
<div class="content-text">
<div class="text-field-content">
@@ -127,8 +132,22 @@
</div>
<div class="process-content-right-xian"></div>
</div>
<projectStatus />
<div class="box-text">
<div class="header-text">
{{$t('projectStatus')}}
</div>
<div class="header-tight">
<a-button class="box-button"
style="line-height: 32px"
@click="settingClick">{{$t('stateExport')}}
</a-button>
<a-button class="box-button"
style="line-height: 32px"
@click="settingClick">{{$t('versionStatistics')}}
</a-button>
</div>
</div>
<projectStatus/>
<listOfRelevantPersonnel ref="listOfRelevantPersonnelRef"/>
<addModel :url="url" ref="addModelRef" @addModelList="addModelList"/>
@@ -156,8 +175,8 @@
data() {
return {
queryForm: {},
cut:'',
administrators:false,
cut: '',
administrators: false,
activeKey: this.$t('CurrentStatusOfTheProject'),
url: {
queryById: 'project/projectLibraryBase/queryById',
@@ -190,9 +209,9 @@
if (res.success) {
this.cut = res.cut
this.queryForm = res.result[0] || {}
if(this.cut == 'en'){
if (this.cut == 'en') {
this.queryForm.brandText = this.queryForm.brandTextEn
}else{
} else {
this.queryForm.brandText = this.queryForm.brandText
}
} else {
@@ -247,7 +266,7 @@
.header-text {
font-size: 16px;
font-weight: 400;
font-weight: bold;
color: #000F16;
}
@@ -391,11 +410,18 @@
.box-text {
display: flex;
justify-content: space-between;
height: 80px;
height: 72px;
line-height: 80px;
}
.header-tight {
line-height: 90px;
}
.button-text {
padding: 0 13px;
}
.box-button{
margin-left: 12px;
}
</style>
jero-web/src/views/projectManagement/components/certificationActivity.vue
+228 -129
View File
@@ -10,6 +10,17 @@
</div>
<div class="box-content">
<div class="box-content-bottom">
<div class="box-content-text">
<div class="box-content-text-text" @click="boxContentClick(0)">
{{$t('whole')}}
</div>
<div class="box-content-text-text" @click="boxContentClick(1)">
{{$t('completeVehicle')}}
</div>
<div class="box-content-text-text" @click="boxContentClick(2)">
{{$t('components')}}
</div>
</div>
<div id="main-bottom"></div>
</div>
</div>
@@ -38,11 +49,19 @@
return {
url: {
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
}
},
certificationProgressMap:{},
}
},
mounted() {
this.mainRightEcharts()
let boxContentTextColor = document.getElementsByClassName('box-content-text-color')
if (boxContentTextColor && boxContentTextColor.length > 0) {
boxContentTextColor[0].classList.remove('box-content-text-color')
}
let boxContentTextText = document.getElementsByClassName('box-content-text-text')
if (boxContentTextText && boxContentTextText.length > 0) {
boxContentTextText[0].classList.add('box-content-text-color')
}
this.mainBottomEcharts()
this.getData()
},
@@ -57,122 +76,155 @@
getAction(this.url.getProjectDetailsStatistics, { id: id }).then((res) => {
if (res.success) {
if (res.result) {
let listingToConfirmMap = res.result.listingToConfirmMap ? res.result.listingToConfirmMap.listingToConfirmMapList : []
let taskToConfirmMap = res.result.taskToConfirmMap ? res.result.taskToConfirmMap.taskToConfirmMapList : []
let designComplianceMap = res.result.designComplianceMap ? res.result.designComplianceMap.designComplianceMapList : []
let prehomoMap = res.result.prehomoMap ? res.result.prehomoMap.prehomoMapList : []
let verifyComplianceMap = res.result.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)
let rzTaskToConfirmMapList = res.result.rzTaskToConfirmMap ? res.result.rzTaskToConfirmMap.rzTaskToConfirmMapList : []
let prehomoMapList = res.result.prehomoMap ? res.result.prehomoMap.prehomoMapList : []
this.certificationProgressMap = res.result.certificationProgressMap
let allMapList = res.result.certificationProgressMap ? res.result.certificationProgressMap.allMapList : []
this.dataEcharts(rzTaskToConfirmMapList)
this.mainRightEcharts(prehomoMapList)
this.mainBottomEcharts(allMapList)
}
}
})
},
dataEcharts(val, num) {
dataEcharts(dataSource) {
let data = []
let color = []
if (val && val.length > 0) {
val.forEach((res) => {
if (res.inventoryAffirmStatus == 'Not started' || res.taskAffirmStatus == 'Not started') {
if (dataSource && dataSource.length > 0) {
this.dataSource = [{}]
dataSource.forEach(res => {
if (res.taskAffirmStatus == 'Not started') {
data.push({
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
value: res.taskAffirmStatusCount,
name: this.$t('notLaunch'),
status: res.inventoryAffirmStatus || res.taskAffirmStatus
})
color.push('#707486')
} else if (res.inventoryAffirmStatus == 'List to confirm' || res.taskAffirmStatus == 'List to confirm') {
data.push({
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
name: this.$t('toBeConfirmed'),
status: res.inventoryAffirmStatus || res.taskAffirmStatus
color: '#00B3BE'
})
color.push('#00B3BE')
} else if (res.inventoryAffirmStatus == 'Accepted' || res.taskAffirmStatus == 'Accepted') {
} else if (res.taskAffirmStatus == 'List to confirm') {
data.push({
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
name: this.$t('accept'),
status: res.inventoryAffirmStatus || res.taskAffirmStatus
value: res.taskAffirmStatusCount,
name: this.$t('listToConfirm'),
color: '#FDA71C'
})
color.push('#26BD4B')
} else if (res.inventoryAffirmStatus == 'Rejected' || res.taskAffirmStatus == 'Rejected') {
color.push('#FDA71C')
} else if (res.taskAffirmStatus == 'Accepted') {
data.push({
value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
value: res.taskAffirmStatusCount,
name: this.$t('accept'),
color: '#26BC4B'
})
color.push('#26BC4B')
} else if (res.taskAffirmStatus == 'Rejected') {
data.push({
value: res.taskAffirmStatusCount,
name: this.$t('refuse'),
status: res.inventoryAffirmStatus || res.taskAffirmStatus
color: '#E83030'
})
color.push('#E83030')
}
})
}
if (num == 1) {
this.mainLeftEcharts(data, color)
} else {
this.mainRightEcharts(data, color)
}
this.getEcharts('main-left', this.$t('regulatoryTaskConfirmation'), color, data)
},
dataEchartsOne(val, num) {
mainRightEcharts(dataSource){
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'),
status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
})
color.push('#00B3BE')
} else if (res.designFlowTaskStatus == 'Compliance' || res.prehomoFlowTaskStatus == 'Compliance' || res.verifyFlowTaskStatus == 'Compliance') {
data.push({
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
name: this.$t('accord'),
status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
})
color.push('#26BD4B')
} 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'),
status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
})
color.push('#E83030')
} 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'),
status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
})
color.push('#FDA71C')
} else if (res.designFlowTaskStatus == 'NA' || res.prehomoFlowTaskStatus == 'NA' || res.verifyFlowTaskStatus == 'NA') {
data.push({
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
name: this.$t('notInvolved'),
status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
})
color.push('#707486')
} else if (res.designFlowTaskStatus == 'Termination of task' || res.prehomoFlowTaskStatus == 'Termination of task' || res.verifyFlowTaskStatus == 'Termination of task') {
data.push({
value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
name: this.$t('taskTermination'),
status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
})
color.push('#E83030')
}
if (dataSource && dataSource.length > 0) {
this.dataSource = [{}]
dataSource.forEach(res => {
if (res.taskAffirmStatus == 'Not started') {
data.push({
value: res.taskAffirmStatusCount,
name: this.$t('notLaunch'),
color: '#00B3BE'
})
color.push('#00B3BE')
} else if (res.taskAffirmStatus == 'List to confirm') {
data.push({
value: res.taskAffirmStatusCount,
name: this.$t('listToConfirm'),
color: '#FDA71C'
})
color.push('#FDA71C')
} else if (res.taskAffirmStatus == 'Review and pass') {
data.push({
value: res.taskAffirmStatusCount,
name: this.$t('reviewAndPass'),
color: '#26BC4B'
})
color.push('#26BC4B')
} else if (res.taskAffirmStatus == 'Review and return') {
data.push({
value: res.taskAffirmStatusCount,
name: this.$t('reviewAndReturn'),
color: '#E83030'
})
color.push('#E83030')
}
)
}
if (num == 1) {
this.mainLeftContentEcharts(data, color)
} else if (num == 2) {
this.mainRightContentEcharts(data, color)
} else if (num == 3) {
this.mainBottomEcharts(data, color)
})
}
this.getEcharts('main-right', this.$t('preHomoFlow'), color, data)
},
getEcharts(chart, title, color, data, num) {
mainBottomEcharts(dataSource){
let data = []
let color = []
if (dataSource && dataSource.length > 0) {
dataSource.forEach(res => {
if (res.certificationProgress == 'Not start') {
data.push({
value: res.certificationProgressCount,
name: this.$t('Notatthe'),
color: '#00B3BE'
})
color.push('#00B3BE')
} else if (res.certificationProgress == 'In progress') {
data.push({
value: res.certificationProgressCount,
name: this.$t('inProgress'),
color: '#FDA71C'
})
color.push('#FDA71C')
} else if (res.certificationProgress == 'Test passed') {
data.push({
value: res.certificationProgressCount,
name: this.$t('experimentPassed'),
color: '#26BC4B'
})
color.push('#26BC4B')
} else if (res.certificationProgress == 'Test failed') {
data.push({
value: res.certificationProgressCount,
name: this.$t('experimentFailed'),
color: '#E83030'
})
color.push('#E83030')
}else if (res.certificationProgress == 'Component report not submitted') {
data.push({
value: res.certificationProgressCount,
name: this.$t('componentReportNotSubmitted'),
color: '#FDA71C'
})
color.push('#FDA71C')
}else if (res.certificationProgress == 'Component report submitted') {
data.push({
value: res.certificationProgressCount,
name: this.$t('componentReportSubmitted'),
color: '#6FD682'
})
color.push('#6FD682')
}else if (res.certificationProgress == 'Component report has been stored') {
data.push({
value: res.certificationProgressCount,
name: this.$t('componentReportHasBeenStored'),
color: '#26BC4B'
})
color.push('#26BC4B')
}
})
}
this.getEcharts('main-bottom', this.$t('CertificationProgress'), color, data)
},
getEcharts(chart, title, color, data) {
var myChart = echarts.init(document.getElementById(chart))
myChart.setOption({
title: {
@@ -207,44 +259,50 @@
}
]
})
myChart.on('click', (params) => {
let query = {
title: params.seriesName,
projectLibraryId: this.$route.query.id
}
if (num === 1) {
query.operatorType = 'queryListingToConfirmStatistics'
query.inventoryAffirmStatus = params.data.status
} else if (num === 2) {
query.operatorType = 'queryTaskToConfirmStatistics'
query.taskAffirmStatus = params.data.status
} else if (num === 3) {
query.operatorType = 'queryDesignStatistics'
query.designFlowTaskStatus = params.data.status
} else if (num === 4) {
query.operatorType = 'queryPrehomoStatistics'
query.prehomoFlowTaskStatus = params.data.status
} else if (num === 5) {
query.operatorType = 'queryVerifyStatistics'
query.verifyFlowTaskStatus = params.data.status
}
this.$refs.responsibilityListRef.getData(query)
})
}
,
mainLeftEcharts(data, color) {
this.getEcharts('main-left', this.$t('certificationTaskConfirmation'), color, data, 1)
}
,
mainRightEcharts(data, color) {
this.getEcharts('main-right', this.$t('preHomoFlow'), color, data, 2)
}
,
mainBottomEcharts(data, color) {
this.getEcharts('main-bottom', this.$t('CertificationProgress'), color, data, 5)
// myChart.on('click', (params) => {
// let query = {
// title: params.seriesName,
// projectLibraryId: this.$route.query.id
// }
// if (num === 1) {
// query.operatorType = 'queryListingToConfirmStatistics'
// query.inventoryAffirmStatus = params.data.status
// } else if (num === 2) {
// query.operatorType = 'queryTaskToConfirmStatistics'
// query.taskAffirmStatus = params.data.status
// } else if (num === 3) {
// query.operatorType = 'queryDesignStatistics'
// query.designFlowTaskStatus = params.data.status
// } else if (num === 4) {
// query.operatorType = 'queryPrehomoStatistics'
// query.prehomoFlowTaskStatus = params.data.status
// } else if (num === 5) {
// query.operatorType = 'queryVerifyStatistics'
// query.verifyFlowTaskStatus = params.data.status
// }
// this.$refs.responsibilityListRef.getData(query)
// })
},
responsibility(item) {
this.$emit('currentStatus', item)
},
boxContentClick(num) {
let boxContentTextColor = document.getElementsByClassName('box-content-text-color')
if (boxContentTextColor && boxContentTextColor.length > 0) {
boxContentTextColor[0].classList.remove('box-content-text-color')
}
let boxContentTextText = document.getElementsByClassName('box-content-text-text')
if (boxContentTextText && boxContentTextText.length > 0) {
boxContentTextText[num].classList.add('box-content-text-color')
}
if (num == 0){
this.mainBottomEcharts( this.certificationProgressMap.allMapList || [])
}else if(num == 1){
this.mainBottomEcharts( this.certificationProgressMap.carMapList || [])
}else if(num == 2){
this.mainBottomEcharts( this.certificationProgressMap.partMapList || [])
}
}
}
}
@@ -263,6 +321,7 @@
border: 2px #eff1f3 solid;
border-radius: 6px;
margin-top: 4px;
#main-left {
width: 100%;
height: 100%;
@@ -277,6 +336,7 @@
border: 2px #eff1f3 solid;
border-radius: 6px;
margin-top: 4px;
#main-right {
width: 100%;
height: 100%;
@@ -284,11 +344,49 @@
box-sizing: border-box;
}
}
.box-content-bottom{
.box-content-bottom {
width: 100%;
height: 346px;
border: 2px #eff1f3 solid;
position: relative;
border-radius: 6px;
.box-content-text {
height: 30px;
background: #F5F6F7;
border-radius: 4px;
position: absolute;
right: 24px;
top: 20px;
display: flex;
z-index: 100;
justify-content: space-between;
padding: 0 2px 0 2px;
.box-content-text-text {
display: inline-block;
font-size: 12px;
color: #6F7385;
line-height: 30px;
margin-right: 10px;
cursor: pointer;
margin-left: 10px;
}
.box-content-text-color {
box-shadow: 0px 1px 2px rgba(0, 0, 60, 0.01), 0px 2px 4px rgba(0, 22, 60, 0.02), 0px 4px 6px rgba(0, 22, 60, 0.0229458);
border-radius: 4px;
padding: 4px 6px;
background: #FFFFFF;
border: 1px solid #E6E7EC;
color: #01A0AC;
line-height: normal;
margin-right: 0;
margin-left: 0;
}
}
#main-bottom {
width: 100%;
height: 100%;
@@ -297,4 +395,5 @@
}
}
}
</style>
jero-web/src/views/projectManagement/components/certificationList/index.vue
+7 -4
View File
@@ -560,9 +560,9 @@
'In progress': 'TrackedColor',
'NA': 'notInvolvedColor',
'Not start': 'submittedColor',
'25181c5a4c044001b4beca539c77a5c8': 'accordColor',
'0a384b5475554ae8886b950730a3bff7': 'accordColor',
'7cba3c71fd24421eade54c685e3b4444': 'TrackedColor'
'Component report submitted': 'componentColor',
'Component report has been stored': 'accordColor',
'Component report not submitted': 'TrackedColor'
},
fieldList: [
{
@@ -2499,7 +2499,10 @@
background: #dbf6e2;
color: #26BD4B;
}
.componentColor{
background: #EDFCEF;
color: #6FD682;
}
.nonConformityColor {
background: #f3dddd;
color: #E83030;
jero-web/src/views/projectManagement/components/nonConformance.vue
+22 -22
View File
@@ -73,18 +73,18 @@
</span>
</a-table>
</div>
<div class="page" v-if="dataSource.length > 0">
<a-pagination
:show-total="total => $t('total')+` ${total} `+$t('strip')"
show-quick-jumper
show-size-changer
:page-size.sync="pageSize"
:total="total"
:current="pageNo"
@change="pageOnChange"
@showSizeChange="SizeChange"
/>
</div>
<!-- <div class="page" v-if="dataSource.length > 0">-->
<!-- <a-pagination-->
<!-- :show-total="total => $t('total')+` ${total} `+$t('strip')"-->
<!-- show-quick-jumper-->
<!-- show-size-changer-->
<!-- :page-size.sync="pageSize"-->
<!-- :total="total"-->
<!-- :current="pageNo"-->
<!-- @change="pageOnChange"-->
<!-- @showSizeChange="SizeChange"-->
<!-- />-->
<!-- </div>-->
</a-card>
</template>
@@ -124,7 +124,7 @@
{
title: this.$t('ProcessType'),
align: 'left',
dataIndex: 'flowType',
dataIndex: 'flowTypeName',
scopedSlots: { customRender: 'ProcessType' },
ellipsis: true,
sorter:true,
@@ -133,7 +133,7 @@
{
title: this.$t('areaOfResponsibility'),
align: 'left',
dataIndex: 'dutyTerritory',
dataIndex: 'dutyTerritory_dictText',
ellipsis: true,
sorter:true,
width: 100
@@ -141,7 +141,7 @@
{
title: this.$t('problemType'),
align: 'left',
dataIndex: 'problemType',
dataIndex: 'flowStatusName',
ellipsis: true,
sorter:true,
width: 150
@@ -149,7 +149,7 @@
{
title: this.$t('Sponsor'),
align: 'left',
dataIndex: 'initiator',
dataIndex: 'regulationOwnerIdName',
ellipsis: true,
sorter:true,
width: 100
@@ -157,7 +157,7 @@
{
title: this.$t('personLiable'),
align: 'left',
dataIndex: 'duty',
dataIndex: 'dutyIdName',
ellipsis: true,
sorter:true,
width: 100
@@ -167,7 +167,7 @@
pageSize: 10,
pageNo: 1,
url: {
page: '/project/ncrTrackController/queryPageInfo',
page: '/project/projectLawsInventoryEO/queryNotComplianList',
exportData: '/project/ncrTrackController/exportDataInfo'
}
}
@@ -242,8 +242,8 @@
},
getList() {
let query = {
pageNo: this.pageNo,
pageSize: this.pageSize,
// pageNo: this.pageNo,
// pageSize: this.pageSize,
projectLibraryId: this.$route.query.id,
orderBy: this.orderBy,
orderByField: this.orderByField,
@@ -252,8 +252,8 @@
this.loading = true
getAction(this.url.page, query).then((res) => {
if (res.success) {
this.dataSource = res.result.records || []
this.total = res.result.total
this.dataSource = res.result || []
// this.total = res.result.total
this.loading = false
} else {
this.dataSource = []
jero-web/src/views/projectManagement/components/parameterCollectionProgress.vue
+119 -83
View File
@@ -4,19 +4,29 @@
<a-form layout="inline">
<a-row :gutter="24">
<a-col :md="6" :sm="10">
<a-form-item :label="$t('Collectlist')">
<a-select v-model="queryParam.ctype" @change="getonChange" style='width: 183px' :getPopupContainer="triggerNode => triggerNode.parentNode" :popper-append-to-body="false">
<a-select-option v-for="d in options" :key="d.value" :value="d.value" >
<div class="box-title-text">
<div class="title-text" :title="$t('Collectlist')">
<span>{{ $t('Collectlist') }}</span>
</div>
<a-select v-model="queryParam.ctype"
class="box-input"
@change="getonChange"
:getPopupContainer="triggerNode => triggerNode.parentNode" :popper-append-to-body="false">
<a-select-option v-for="d in options" :key="d.value" :value="d.value">
<span style="display: inline-block;width: 80%" :title=" d.label">
{{ d.label }}
</span>
</a-select-option>
</a-select>
</a-form-item>
</div>
</a-col>
<a-col :md="6" :sm="14">
<a-form-model-item :label="$t('Statisticalmodels')" prop="value" style='width: 388px' class="process-form-item">
<a-radio-group v-model="queryParam.value" @change="onChange" style='width: 253px'>
<a-col :md="6" :sm="10">
<div class="box-title-text">
<div class="title-text" :title="$t('Statisticalmodels')">
<span>{{ $t('Statisticalmodels') }}</span>
</div>
<a-radio-group class="box-input"
v-model="queryParam.value" @change="onChange">
<a-radio :value="1">
{{$t('Thepercentage')}}
</a-radio>
@@ -24,9 +34,8 @@
{{$t('Quantity')}}
</a-radio>
</a-radio-group>
</a-form-model-item>
</div>
</a-col>
</a-row>
</a-form>
</div>
@@ -44,7 +53,7 @@
import * as echarts from 'echarts'
import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
import responsibilityList from './responsibilityList'
import "echarts/lib/component/dataZoom"
import 'echarts/lib/component/dataZoom'
export default {
name: 'DeliverableStatusEchart',
@@ -59,28 +68,28 @@
},
data() {
return {
queryParam:{
value:1,
ctype:''
queryParam: {
value: 1,
ctype: ''
},
options:[],
collecting:[],
notStart:[],
submit:[],
syncReport:[],
collectingdata:[],
notStartdata:[],
submitdata:[],
syncReportdata:[],
dutyTerritory:[],
collectingpercentage:[],
collectingquantity:[],
notStartpercentage:[],
notStartquantity:[],
submitpercentage:[],
submitquantity:[],
syncReportpercentage:[],
syncReportquantity:[],
options: [],
collecting: [],
notStart: [],
submit: [],
syncReport: [],
collectingdata: [],
notStartdata: [],
submitdata: [],
syncReportdata: [],
dutyTerritory: [],
collectingpercentage: [],
collectingquantity: [],
notStartpercentage: [],
notStartquantity: [],
submitpercentage: [],
submitquantity: [],
syncReportpercentage: [],
syncReportquantity: [],
url: {
getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatisticsCollectManifestData'
}
@@ -97,18 +106,18 @@
if (res.success) {
if (res.result) {
this.collecting = res.result.collecting ? res.result.collecting : []
this.notStart = res.result.notStart ? res.result.notStart: []
this.notStart = res.result.notStart ? res.result.notStart : []
this.submit = res.result.submit ? res.result.submit : []
this.syncReport = res.result.syncReport ? res.result.syncReport : []
this.dutyTerritory = res.result.dutyTerritory ? res.result.dutyTerritory : []
this.getEcharts()
this.getEcharts()
}
}
})
},
getoptions(){
getoptions() {
let id = ''
if (this.idList && this.idList.length > 0) {
id = this.idList.join(',')
@@ -116,7 +125,7 @@
id = this.$route.query.parentId ? this.$route.query.parentId : this.$route.query.id
// id = this.$route.query.id
}
getAction('project/projectLibraryBase/getProjectDetailsStatisticsCollectManifestLabel', {id:id}).then((res) => {
getAction('project/projectLibraryBase/getProjectDetailsStatisticsCollectManifestLabel', { id: id }).then((res) => {
if (res.success) {
this.options = res.result
this.queryParam.ctype = this.options[0].value
@@ -125,7 +134,7 @@
}
})
},
getonChange(value){
getonChange(value) {
this.collectingpercentage = []
this.collectingquantity = []
this.notStartpercentage = []
@@ -136,7 +145,7 @@
this.syncReportquantity = []
this.getData(value)
},
onChange(value){
onChange(value) {
this.collectingpercentage = []
this.collectingquantity = []
this.notStartpercentage = []
@@ -149,53 +158,53 @@
},
getEcharts(chart, title, color, data, num) {
this.collecting.forEach((item,index) => {
this.collecting.forEach((item, index) => {
this.collectingpercentage.push(item.percentage)
this.collectingquantity.push(item.quantity)
})
this.notStart.forEach((item,index) => {
this.notStart.forEach((item, index) => {
this.notStartpercentage.push(item.percentage)
this.notStartquantity.push(item.quantity)
})
this.submit.forEach((item,index) => {
this.submit.forEach((item, index) => {
this.submitpercentage.push(item.percentage)
this.submitquantity.push(item.quantity)
})
this.syncReport.forEach((item,index) => {
this.syncReport.forEach((item, index) => {
this.syncReportpercentage.push(item.percentage)
this.syncReportquantity.push(item.quantity)
})
if(this.queryParam.value == 1){
if (this.queryParam.value == 1) {
this.collectingdata = this.collectingpercentage
this.notStartdata = this.notStartpercentage
this.submitdata = this.submitpercentage
this.syncReportdata = this.syncReportpercentage
}else if(this.queryParam.value == 2){
} else if (this.queryParam.value == 2) {
this.collectingdata = this.collectingquantity
this.notStartdata = this.notStartquantity
this.submitdata = this.submitquantity
this.syncReportdata = this.syncReportquantity
}
var chartDom = document.getElementById('main-left');
var myChart = echarts.init(chartDom);
var option;
var option1;
var chartDom = document.getElementById('main-left')
var myChart = echarts.init(chartDom)
var option
var option1
let xAxisData = [];
let xAxisData = []
// let data1 = [];
// let data2 = [];
// let data3 = [];
// let data4 = [];
xAxisData = this.dutyTerritory
// data1.push(+(Math.random() * 2).toFixed(2));
// data2.push(+(Math.random() * 100).toFixed(2));
// data3.push(+(Math.random() + 0.3).toFixed(2));
// data4.push(+Math.random().toFixed(2));
// data1.push(+(Math.random() * 2).toFixed(2));
// data2.push(+(Math.random() * 100).toFixed(2));
// data3.push(+(Math.random() + 0.3).toFixed(2));
// data4.push(+Math.random().toFixed(2));
let yAxis=[];
let tooltip= {};
let yAxis = []
let tooltip = {}
let _this = this
if(this.queryParam.value === 1){
if (this.queryParam.value === 1) {
yAxis = [
{
type: 'value',
@@ -203,15 +212,15 @@
show: true,
interval: 'auto',
formatter: '{value} %'
},
},
}
}
]
}else{
yAxis=[
} else {
yAxis = [
{
type: 'value',
},
];
type: 'value'
}
]
}
option = {
legend: {
@@ -227,21 +236,21 @@
// }
},
tooltip: {
trigger:'axis',
trigger: 'axis',
// axisPointer: { // 坐标轴指示器，坐标轴触发有效
// type: 'line'// 默认为直线，可选为：'line' | 'shadow'
// },
formatter: function (params) {
var html = params[0].name + "<br>";
formatter: function(params) {
var html = params[0].name + '<br>'
for (var i = 0; i < params.length; i++) {
html += params[i].marker + params[i].seriesName + ":" + params[i].value;
html += params[i].marker + params[i].seriesName + ':' + params[i].value
if (_this.queryParam.value == 1) {
html += "%" + "<br>";
}else{
html +="<br>";
html += '%' + '<br>'
} else {
html += '<br>'
}
}
return html;
return html
}
},
@@ -250,11 +259,11 @@
// name: 'X Axis',
axisLabel: {
interval: 0,
rotate:25,
rotate: 25
// formatter: function(value) {
// return value.split("").join("\n");
// }
},
}
// axisLine: { onZero: true },
// splitLine: { show: false },
// splitArea: { show: false }
@@ -272,7 +281,7 @@
barWidth: 40,
barGap: '-100%',
itemStyle: {
color: "#707486",
color: '#00B3BE'
},
data: this.notStartdata
},
@@ -283,7 +292,7 @@
barWidth: 40,
barGap: '-100%',
itemStyle: {
color: "#00B3BE",
color: '#FDA71C'
},
data: this.collectingdata
},
@@ -294,7 +303,7 @@
barWidth: 40,
barGap: '-100%',
itemStyle: {
color: "#26BD4B",
color: '#26BD4B'
},
data: this.submitdata
},
@@ -305,13 +314,12 @@
barWidth: 40,
barGap: '-100%',
itemStyle: {
color: "#E83030",
color: '#2F8DF3'
},
data: this.syncReportdata
}
],
dataZoom:[
dataZoom: [
{
type: 'slider',//给x轴设置滚动条
show: true, //flase直接隐藏图形
@@ -322,14 +330,13 @@
startValue: 0,//滚动条的起始位置
endValue: 9 //滚动条的截止位置（按比例分割你的柱状图x轴长度）
}
],
};
option && myChart.setOption(option, true);
]
}
option && myChart.setOption(option, true)
},
mainLeftEcharts(data, color) {
this.getEcharts('main-left', this.$t('Parametercollection'), color, data, 1)
this.getEcharts('main-left', this.$t('Parametercollection'), color, data, 1)
},
responsibility(item) {
this.$emit('currentStatus', item)
@@ -371,6 +378,7 @@
box-sizing: border-box;
}
}
.box-input {
display: inline-block;
width: calc(70% - 100px);
@@ -398,4 +406,32 @@
}
}
}
.box-title-text {
line-height: 1.4;
display: flex;
align-items: center;
margin-bottom: 16px;
}
.title-text {
color: #000F16;
display: inline-block;
font-weight: 500;
font-size: 14px;
margin-right: 16px;
margin-top: 3px;
text-align: left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.box-input {
display: inline-block;
width: calc(100% - 126px);
height: 38px;
margin-top: 2px;
line-height: 38px;
}
</style>
jero-web/src/views/projectManagement/components/projectStatus.vue
+13 -13
View File
@@ -1,17 +1,17 @@
<template>
<a-card :bordered="false">
<div class="table-operator" style="margin-bottom: 10px">
<div @click="versionStatisticsClick"
v-if="!this.$route.query.parentId && $t('Parametercollection')!= activeKey"
class="operator-text">
<a-icon type="plus"/>
{{$t('versionStatistics')}}
</div>
<div v-else
class="operator-text">
</div>
</div>
<a-tabs v-model="activeKey" class="ant-tabs">
<!-- <div class="table-operator" style="margin-bottom: 10px">-->
<!-- <div @click="versionStatisticsClick"-->
<!-- v-if="!this.$route.query.parentId && $t('Parametercollection')!= activeKey"-->
<!-- class="operator-text">-->
<!-- <a-icon type="plus"/>-->
<!-- {{$t('versionStatistics')}}-->
<!-- </div>-->
<!-- <div v-else-->
<!-- class="operator-text">-->
<!-- </div>-->
<!-- </div>-->
<a-tabs type="card" v-model="activeKey" class="ant-tabs">
<a-tab-pane :key="$t('regulatoryComplianceManagement')" :tab="$t('regulatoryComplianceManagement')">
<regulatoryCompliance @currentStatus="currentStatus"
:idList="idList"
@@ -86,6 +86,6 @@
<style scoped>
@import '~@assets/less/common.less';
::v-deep .ant-card-body{
padding: 24px 0 ;
padding: 0 0 24px 0 ;
}
</style>
jero-web/src/views/projectManagement/projectStatusBoard/index.vue
+14 -6
View File
@@ -99,6 +99,7 @@
<div class="box-top-content-right-bottom">
<div class="process-content" v-for="(item,index) in timeData" :key="index">
<div class="process-content-right-xian"></div>
<div class="process-content-right-xian-color"></div>
<div class="process-content-right-xian-one"></div>
<div class="process-content-content" :style="val.left"
v-for="(val,indexOne) in item.data[0]" :key="indexOne">
@@ -625,7 +626,7 @@
.box-top-content {
width: 100%;
height: 500px;
height: calc(100vh - 264px);
margin-bottom: 20px;
padding: 0 0 20px 10px;
box-sizing: border-box;
@@ -733,7 +734,7 @@
/*overflow:hidden;*/
.process-content-content {
background: #fff;
background: transparent;
z-index: 98;
/*padding: 0 6px;*/
position: absolute;
@@ -789,7 +790,7 @@
}
.process-content-contentOne {
background: #fff;
background: transparent;
z-index: 98;
/*padding: 0 6px;*/
position: absolute;
@@ -847,15 +848,22 @@
.process-content-right-xian {
height: 1px;
width: 100%;
background: #E6E6E9;
background: #00B3BE;
position: absolute;
top: 48px;
}
.process-content-right-xian-color{
height: 28px;
width: 100%;
position: absolute;
top: 48px;
background: linear-gradient(90deg, rgba(0, 179, 190, 0.12) 0%, rgba(4, 11, 41, 0.02) 100%);
transform: matrix(-1, 0, 0, 1, 0, 0);
}
.process-content-right-xian-one {
height: 1px;
width: 100%;
background: #E6E6E9;
background: #00B3BE;
position: absolute;
top: 74px;
}