Files
laws_weilai/jero-web/src/views/businessSupport/technologyAssessment/components/evaluationResultsClause.vue
T

435 lines
13 KiB
Java

<template>
<div class="doc-detail">
<div class="doc-detail-wrap">
<div class="doc-detail-header" style="position: fixed;top: 0">
<div class="doc-detail-title">
<!-- <span style="line-height: 66px;display: inline-block;float: left">-->
<!-- <a-icon type="home" style="margin-right: 6px;"/>-->
<!-- </span>-->
{{$route.query.serialNumber +' '+$t('regulatoryTechnicalEvaluationResults')}}
</div>
</div>
<div style="padding-top: 68px;background: #fff">
<div class="detail-content">
<div class="content-box">
<div class="header-text">
{{$t('processBackground')}}
<a-button class="box-button-top" type="primary" @click="CurrentStandard">
{{$t('initiateProcessForCurrentStandard')}}
</a-button>
</div>
<div class="processBackground-text">
{{$route.query.processBackground}}
</div>
<div class="header-text">
{{$t('engineerFeedbackResults')}}
</div>
<a-card :bordered="false" class="box-clause">
<div class="table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
<a-col :md="6" :sm="8">
<div class="box-title-text">
<div class="title-text" :title="$t('Assessor')">
<span>{{$t('Assessor')}}</span>
</div>
<PersonnelSelection class="box-input"
:personneQuery="queryParam"
:query="{db_field_name:'evaluators',db_field_txt:$t('Assessor')}"
:isInput="true"
@change="PersonnelSelectionChange"
v-model="queryParam.evaluatorsName"/>
</div>
</a-col>
<a-col :md="6" :sm="8">
<div class="box-title-text">
<div class="title-text" :title="$t('complianceResults')">
<span>{{$t('complianceResults')}}</span>
</div>
<a-select :placeholder="$t('PleaseSelect')+$t('complianceResults')"
class="box-input"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
v-model="queryParam.complianceResult">
<a-select-option v-for="(item, key) in complianceResultsList"
:key="key"
:value="item.value">
<span style="display: inline-block;width: 100%" :title="item.name ">
{{ item.name }}
</span>
</a-select-option>
</a-select>
</div>
</a-col>
<span style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
<a-col :md="6" :sm="24">
<a-button class="box-button" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
<a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
</a-col>
</span>
</a-row>
</a-form>
</div>
<div class="table-operator">
<div @click="fileExportClick" class="operator-text">
<a-icon type="export" :rotate="-90"/>
{{$t('fileExport')}}
</div>
</div>
<div>
<a-table
ref="table"
size="middle"
:loading="loading"
:pagination="false"
:scroll="{x: '100%',y:'calc(100vh - 100px)'}"
rowKey="id"
:data-source="dataSource"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:columns="columns"
>
<div slot="clauseContent" slot-scope="text,result">
<a-tooltip placement="topLeft">
<template slot="title">
<span v-html="text"></span>
</template>
<div class="clauseContent-text" v-html="text"></div>
</a-tooltip>
</div>
<span slot="accessoryFile" slot-scope="text,result">
<a v-if="text" @click="accessoryFileClick(text)">
{{ $t('viewFile') }}
</a>
<span v-else>--</span>
</span>
</a-table>
</div>
</a-card>
</div>
</div>
</div>
</div>
<viewFileModel ref="viewFileModelRef"/>
</div>
</template>
<script>
import PersonnelSelection from '@/components/PersonnelSelection/index'
import { getAction, postAction, downloadFile } from '@/api/manage'
import viewFileModel from '@/components/viewFileModel/index'
export default {
name: 'evaluationResultsClause',
components: {
PersonnelSelection,
viewFileModel
},
data() {
return {
queryParam: {},
dataSource: [],
selectedRowKeys: [],
complianceResultsList: [
{
name: this.$t('accord'),
value: 'Compliance'
},
{
name: this.$t('nonConformity'),
value: 'Non-Compliance'
}
],
loading: false,
url: {
list: '/lawsTechnologyEvaluation/lawsTechnologyEvaluationItemResultEO/list',
exportData: '/lawsTechnologyEvaluation/lawsTechnologyEvaluationItemResultEO/exportZip'
},
columns: [
{
title: this.$t('clauseNo'),
dataIndex: 'itemNum',
align: 'center',
ellipsis: true,
width: 160
},
{
title: this.$t('clauseName'),
dataIndex: 'itemName',
align: 'center',
ellipsis: true,
width: 160
},
{
title: this.$t('clauseContent'),
dataIndex: 'itemContent',
align: 'center',
width: 260,
scopedSlots: { customRender: 'clauseContent' }
},
{
title: this.$t('Assessor'),
dataIndex: 'Assessor',
align: 'center',
ellipsis: true,
width: 160
},
{
title: this.$t('evaluationMethod'),
dataIndex: 'evaluationMethodsName',
align: 'center',
ellipsis: true,
width: 160
},
{
title: this.$t('nameTechnicalDocument'),
dataIndex: 'technicalFileName',
align: 'center',
ellipsis: true,
width: 260
},
{
title: this.$t('chapter'),
dataIndex: 'section',
align: 'center',
ellipsis: true,
width: 260
},
{
title: this.$t('complianceResults'),
dataIndex: 'complianceResultName',
align: 'center',
ellipsis: true,
width: 160
},
{
title: this.$t('opinion'),
dataIndex: 'opinion',
align: 'center',
ellipsis: true,
width: 260
},
{
title: this.$t('enclosure'),
dataIndex: 'accessoryFile',
align: 'center',
ellipsis: true,
width: 160,
scopedSlots: { customRender: 'accessoryFile' }
},
{
title: this.$t('feedbackTime'),
dataIndex: 'createTime',
align: 'center',
ellipsis: true,
width: 160
}
]
}
},
mounted() {
this.getList()
},
methods: {
CurrentStandard() {
let query = {
firstInitiation: '2',
whetherTobring: '1'
}
let newUrl = this.$router.resolve({
path: '/evaluationInitiationProcess',
query: query
})
window.open(newUrl.href, '_blank')
},
onSelectChange(value) {
this.selectedRowKeys = value
},
searchQuery() {
this.getList()
},
searchReset() {
this.queryParam = {}
this.getList()
},
getList() {
let query = {
lawsTechnologyEvaluationId: this.$route.query.id,
...this.queryParam
}
this.loading = true
getAction(this.url.list, query).then((res) => {
if (res.success) {
this.dataSource = res.result || []
this.loading = false
} else {
this.dataSource = []
this.loading = false
}
})
},
fileExportClick() {
let selectedRowKeys = JSON.parse(JSON.stringify(this.selectedRowKeys))
let query = {
...this.queryParam,
ids: selectedRowKeys.join(','),
lawsTechnologyEvaluationId: this.$route.query.id
}
downloadFile(this.url.exportData, this.$route.query.serialNumber + ' ' + this.$t('regulatoryTechnicalEvaluationResults') + '.zip',
query, this.Deselect)
},
Deselect() {
this.selectedRowKeys = []
},
PersonnelSelectionChange(value, id) {
this.queryParam[value] = id
this.queryParam = { ...this.queryParam }
},
accessoryFileClick(item) {
this.$refs.viewFileModelRef.clickButtonToUpload(item)
}
}
}
</script>
<style lang="less" scoped>
@import '~@assets/less/common.less';
.doc-detail {
background: #fff;
height: 100%;
.doc-detail-wrap {
.doc-detail-header {
width: 100%;
height: 68px;
line-height: 68px;
padding: 0 0 0 32px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
border-bottom: 2px #eff1f3 solid;
z-index: 1000;
background: #fff;
.doc-detail-title {
display: inline-block;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 20px;
font-weight: 400;
color: #040B29;
line-height: 68px;
}
.doc-detail-right {
width: 800px;
line-height: 68px;
display: flex;
.doc-detail-btn {
margin-left: 10px;
}
}
}
.content-box {
padding: 0 32px;
box-sizing: border-box;
}
.header-text {
font-size: 16px;
font-weight: 400;
height: 80px;
color: #000F16;
line-height: 80px;
}
.processBackground-text {
font-size: 16px;
color: #000F16;
}
}
}
.box-button-top {
float: right;
margin-top: 28px;
height: 38px;
}
.page {
text-align: right;
margin-top: 20px;
}
.box-title-text {
line-height: 1.4;
display: flex;
align-items: center;
margin-bottom: 10px;
}
.title-text {
width: 70px;
color: #000F16;
display: inline-block;
font-weight: 500;
font-size: 14px;
margin-right: 16px;
margin-top: 3px;
text-align: right;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.box-input {
display: inline-block;
width: 70%;
height: 38px;
margin-top: 2px;
}
.box-button {
height: 38px;
/*margin-top: 2px;*/
}
.text-operation {
margin-right: 8px;
}
.itemModel {
width: calc(100% - 130px);
display: inline-block;
margin-top: 2px;
}
.clauseContent-text {
width: 100%;
overflow: hidden;
display: -webkit-box;
text-overflow: ellipsis;
/*! autoprefixer: off */
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
/*! autoprefixer: on;*/
text-justify: inter-ideograph;
word-break: break-all
}
</style>
<style>
.box-clause .ant-card-body {
padding: 0;
}
.box-input .ant-select-selection--single {
height: 38px;
}
.box-input .ant-select-selection__rendered {
line-height: 38px;
height: 38px;
}
</style>