334 lines
11 KiB
Vue
334 lines
11 KiB
Vue
<!--设计工程师评估-->
|
||
<template>
|
||
<div>
|
||
<!--项目评估-->
|
||
<div class="process-part-title">{{ $t('workCenter.standardCompliance.projectAppraisal') }}</div>
|
||
<!--上一节点处理人-->
|
||
<div class="info-form-item">
|
||
<label class="info-form-item-label">{{ $t('workCenter.projectComplianceEvaluationProcess.preNodePeople') }}：</label>
|
||
<div class="info-form-item-text">{{ preNodeUser }}</div>
|
||
</div>
|
||
<div>
|
||
<a-table
|
||
:bordered="false"
|
||
:scroll="{x: '100%'}"
|
||
:pagination="ipagination"
|
||
:columns="columns"
|
||
:data-source="dataSource"
|
||
@change="handleTableChange">
|
||
|
||
<template slot="text" slot-scope="text">
|
||
<a-tooltip overlay-class-name="tooltip-style">
|
||
<template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
|
||
<div class="table-text">{{ text || text === 0 ? text : global.emptyLine }}</div>
|
||
</a-tooltip>
|
||
</template>
|
||
|
||
<!--条文内容-->
|
||
<template v-slot:clauseContent="text">
|
||
<div class="table-text" style="cursor: pointer" @click="showContent(text)" v-if="text">
|
||
{{ text && text !== 'null' ? text.replace(/<.*?>/ig, ' ') : '' }}
|
||
</div>
|
||
<div class="table-text" v-else>{{ global.emptyLine }}</div>
|
||
</template>
|
||
|
||
<!--评估结果-->
|
||
<template v-slot:evaluationResult="text,record">
|
||
<j-dict-select-tag :placeholder="$t('pleaseSelect') + $t('projectLibrary.vehicleItemLibrary.evaluationResult')"
|
||
dict-code="standards_assess_results"
|
||
style="width: 100%"
|
||
:value="record.assessResults"
|
||
@change="value => handleEvaluationResultChange(value, record, record.dataSourceIndex)" />
|
||
</template>
|
||
|
||
<!--展开的部分-->
|
||
<template v-slot:expandedRowRender="record">
|
||
<a-form-model :model="record" :rules="record.assessResults === inconformity ? rules : null" :ref="`ruleForm${record.dataSourceIndex}`">
|
||
<!--不符合-->
|
||
<template v-if="record.assessResults === inconformity">
|
||
<!--是否与车型强关联-->
|
||
<a-form-model-item :label="$t('workCenter.standardCompliance.stronglyRelatedVehicleType')"
|
||
:labelCol="{span: 4}"
|
||
:wrapperCol="{span: 18}"
|
||
prop="isRelate">
|
||
<j-dict-select-tag v-model="record.isRelate"
|
||
dict-code="yn"
|
||
type="radio" />
|
||
</a-form-model-item>
|
||
<!--不符合车型系列-->
|
||
<a-form-model-item :label="$t('workCenter.standardCompliance.doesNotFitModel')"
|
||
:labelCol="{span: 4}"
|
||
:wrapperCol="{span: 18}"
|
||
prop="modelSeries"
|
||
v-if="record.isRelate === yesValue">
|
||
<a-select :placeholder="$t('pleaseSelect') + $t('workCenter.standardCompliance.doesNotFitModel')"
|
||
v-model="record.modelSeries"
|
||
mode="multiple"
|
||
show-search
|
||
:filter-option="filterOption">
|
||
<a-select-option v-for="item in carTypeList" :key="item.id">{{ item.projectName }}</a-select-option>
|
||
</a-select>
|
||
</a-form-model-item>
|
||
</template>
|
||
<template v-if="record.assessResults === inconformity || record.assessResults === accordWith">
|
||
<!--依据描述-->
|
||
<a-form-model-item :label="$t('projectLibrary.specialProjectLibrary.basisDescription')"
|
||
:labelCol="{span: 4}"
|
||
:wrapperCol="{span: 18}"
|
||
prop="description">
|
||
<a-input type="textarea" :maxLength="500" v-model="record.description" />
|
||
</a-form-model-item>
|
||
<!--佐证材料-->
|
||
<a-form-model-item :label="$t('projectLibrary.specialProjectLibrary.supportingMaterial')"
|
||
:labelCol="{span: 4}"
|
||
:wrapperCol="{span: 18}"
|
||
prop="supportingMaterial">
|
||
<j-upload return-id
|
||
v-model="record.fileId"
|
||
file-type="pdf,doc,docx,pptx,ppt,jpg,jpeg,png,xls,xlsx,bmp" />
|
||
</a-form-model-item>
|
||
</template>
|
||
</a-form-model>
|
||
</template>
|
||
</a-table>
|
||
</div>
|
||
|
||
<!--条文内容-->
|
||
<split-clause-detail ref="clauseDetail" />
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { StandardEvaluationResultType, YesOrNoEnum } from '../../../../enums/commonEnums'
|
||
import { getCarTypeProjectList } from '../../../../api/projectLibraryApi'
|
||
import SplitClauseDetail from '../../../documentTool/documentSplit/modules/SplitClauseDetail'
|
||
import JTable from '../../../../components/jero/JTable'
|
||
|
||
export default {
|
||
name: 'DesignEngineerAssess',
|
||
components: { JTable, SplitClauseDetail },
|
||
props: {
|
||
// 回显的数据
|
||
displayDataSource: {
|
||
type: Array,
|
||
required: false,
|
||
default: () => {
|
||
return []
|
||
}
|
||
},
|
||
// 上一节点处理人
|
||
preNodeUser: {
|
||
type: String,
|
||
required: false,
|
||
default: ''
|
||
}
|
||
},
|
||
data () {
|
||
return {
|
||
columns: [
|
||
// 标准编号/条款号
|
||
{
|
||
dataIndex: 'termNumber',
|
||
title: this.$t('projectLibrary.vehicleItemLibrary.standardNumberClauseNumber'),
|
||
width: 150,
|
||
align: 'center'
|
||
},
|
||
// 标准名称/条款名称
|
||
{
|
||
dataIndex: 'termName',
|
||
title: this.$t('workCenter.projectComplianceEvaluationProcess.standardNameClauseName'),
|
||
width: 150,
|
||
align: 'center'
|
||
},
|
||
// 条款内容
|
||
{
|
||
dataIndex: 'termText',
|
||
title: this.$t('workCenter.projectComplianceEvaluationProcess.terms'),
|
||
width: 250,
|
||
align: 'center',
|
||
scopedSlots: { customRender: 'clauseContent' }
|
||
},
|
||
// 实施日期
|
||
{
|
||
title: this.$t('dashboard.advancedSearch.materialDate'),
|
||
align: 'center',
|
||
width: 180,
|
||
dataIndex: 'implementationDate',
|
||
scopedSlots: { customRender: 'text' }
|
||
},
|
||
// 评估结果
|
||
{
|
||
dataIndex: 'assessResults_dictText',
|
||
title: this.$t('projectLibrary.vehicleItemLibrary.evaluationResult'),
|
||
width: 120,
|
||
align: 'center',
|
||
scopedSlots: { customRender: 'evaluationResult' }
|
||
}
|
||
],
|
||
dataSource: [],
|
||
form: {},
|
||
rules: {
|
||
// 依据描述
|
||
description: {
|
||
required: true,
|
||
message: this.$t('pleaseEnter') + this.$t('projectLibrary.specialProjectLibrary.basisDescription'),
|
||
trigger: 'blur'
|
||
},
|
||
// 是否与车型强关联
|
||
isRelate: {
|
||
required: true,
|
||
message: this.$t('pleaseSelect') + this.$t('workCenter.standardCompliance.stronglyRelatedVehicleType'),
|
||
trigger: 'change'
|
||
},
|
||
// 不符合车型系列
|
||
modelSeries: {
|
||
required: true,
|
||
message: this.$t('pleaseSelect') + this.$t('workCenter.standardCompliance.doesNotFitModel'),
|
||
trigger: 'change'
|
||
}
|
||
},
|
||
carTypeList: [], // 车型下拉数据
|
||
/* 分页参数 */
|
||
ipagination: {
|
||
current: 1,
|
||
pageSize: 10,
|
||
pageSizeOptions: ['10', '30', '50', '100', '150', '200'],
|
||
showTotal: (total, range) => {
|
||
return range[0] + '-' + range[1] + ' ' + this.$t('total') + total + this.$t('strip')
|
||
},
|
||
showQuickJumper: true,
|
||
showSizeChanger: true,
|
||
total: 0
|
||
}
|
||
}
|
||
},
|
||
watch: {
|
||
displayDataSource: {
|
||
handler (value) {
|
||
this.dataSource = []
|
||
if (value) {
|
||
this.dataSource = value.map((item, index) => {
|
||
return {
|
||
...item,
|
||
dataSourceIndex: index,
|
||
modelSeries: item.modelSeries ? item.modelSeries.split(',') : undefined
|
||
}
|
||
})
|
||
}
|
||
},
|
||
deep: true,
|
||
immediate: true
|
||
}
|
||
},
|
||
computed: {
|
||
// 符合
|
||
accordWith () {
|
||
return StandardEvaluationResultType.accordWith.value
|
||
},
|
||
// 不符合
|
||
inconformity () {
|
||
return StandardEvaluationResultType.inconformity.value
|
||
},
|
||
yesValue () {
|
||
return YesOrNoEnum.YES.value
|
||
}
|
||
},
|
||
created () {
|
||
this.getCarTypeList()
|
||
},
|
||
methods: {
|
||
/**
|
||
* 获取车型下拉数据
|
||
*/
|
||
getCarTypeList () {
|
||
getCarTypeProjectList().then(res => {
|
||
if (res.success) {
|
||
this.carTypeList = res.result || []
|
||
}
|
||
})
|
||
},
|
||
handleEvaluationResultChange (value, record, index) {
|
||
const data = JSON.parse(JSON.stringify(this.dataSource))
|
||
data[index].assessResults = value
|
||
this.dataSource.splice(0, this.dataSource.length, ...data)
|
||
},
|
||
async submit () {
|
||
let flag = true
|
||
for (const index in this.dataSource) {
|
||
console.log(index)
|
||
const record = this.dataSource[index]
|
||
// 没选评估结果，不需要继续校验了
|
||
if (!record.assessResults) {
|
||
flag = false
|
||
continue
|
||
}
|
||
// 选了评估结果，且可以读取到表单，根据表单校验结果走即可
|
||
if (this.$refs[`ruleForm${index}`]) {
|
||
const valid = await this.validateForm(index)
|
||
if (!valid) {
|
||
flag = false
|
||
}
|
||
continue
|
||
}
|
||
// 选了评估结果，读不到表单，符合，没有必填项，直接跳出
|
||
if (record.assessResults === this.accordWith) {
|
||
continue
|
||
}
|
||
// 选了评估结果，读不到表单，不符合，校验
|
||
if (record.assessResults === this.inconformity) {
|
||
// 是否与车型强关联、依据描述有没写的
|
||
if (!record.isRelate || !record.description) {
|
||
flag = false
|
||
} else if (!record.modelSeries || record.modelSeries.length === 0) {
|
||
flag = false
|
||
}
|
||
}
|
||
}
|
||
if (!flag) {
|
||
return false
|
||
}
|
||
const data = JSON.parse(JSON.stringify(this.dataSource))
|
||
return data.map(item => {
|
||
return { ...item, modelSeries: item.modelSeries ? item.modelSeries.join(',') : null }
|
||
})
|
||
},
|
||
validateForm (index) {
|
||
return new Promise(resolve => {
|
||
this.$refs[`ruleForm${index}`].validate(valid => {
|
||
resolve(valid)
|
||
})
|
||
})
|
||
},
|
||
filterOption (input, option) {
|
||
const text = option.componentOptions.children[0].text || option.componentOptions.children[0].data.attrs.title
|
||
return text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
||
},
|
||
showContent (text) {
|
||
this.$refs.clauseDetail.open(text)
|
||
},
|
||
handleTableChange (pagination) {
|
||
this.ipagination = pagination
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
@import '~@assets/less/common.less';
|
||
|
||
.process-part-title:first-child {
|
||
margin-top: 32px;
|
||
}
|
||
|
||
.info-form-item {
|
||
display: flex;
|
||
margin-bottom: 20px;
|
||
|
||
&-text {
|
||
flex: 1;
|
||
width: 0;
|
||
word-break: break-word;
|
||
}
|
||
}
|
||
</style>
|