Files
laws_weilai/jero-web/src/views/businessSupport/technologyAssessment/components/initiatingProcess.vue
T
2022-07-12 16:16:07 +08:00

584 lines
19 KiB
Java
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div id="examineBox">
<headerProcess
:title="title"
/>
<div class="detail-box">
<div class="detail-content" style="padding: 20px">
<div class="table-page-search-wrapper">
<search ref="searchRef"
:flag="'1'"
:url="url"/>
</div>
<a-table
ref="table"
size="middle"
:loading="loading"
:pagination="false"
:scroll="{x: '100%'}"
rowKey="id"
:data-source="dataSource"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange ,columnTitle:' '}"
:columns="columns"
>
</a-table>
<div class="page" v-if="dataSource && dataSource.length > 0">
<a-pagination
:show-total="total => $t('total')+` ${total} `+$t('strip')"
show-quick-jumper
:page-size.sync="pageSize"
:total="total"
:current="pageNo"
@change="pageOnChange"
@showSizeChange="SizeChange"
/>
</div>
<a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
<a-row :gutter="24" style="margin-bottom: 10px">
<a-col :span="24">
<div class="box-title-text">
<div class="title-text">
<span class="title-text-text" :title="$t('selectedStandard')">{{$t('selectedStandard')}}</span>
</div>
<div class="title-text-content"
:class="{'title-text-content-one':!isTrue}">
{{selectedRowKeysRecord[0] ? selectedRowKeysRecord[0].serialNumber :''}}
</div>
<div class="title-text-right" v-if="isTrue">
<span @click="standardDecompositionDocumentClick">
{{$t('standardDecompositionDocument')}}
</span>
</div>
</div>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="12">
<div class="box-title-text">
<div class="title-text">
<span class="Required">*</span>
<span class="title-text-text" :title="$t('closingDate')">{{$t('closingDate')}}</span>
</div>
<a-form-model-item class="itemModel" prop="endTime">
<a-date-picker class="box-input"
:placeholder="$t('PleaseSelect')+$t('closingDate')"
@change="dateChange('endTime')"
:getCalendarContainer="(trigger) => trigger.parentNode"
format="YYYY-MM-DD"
v-model="formInline['endTime']"
style="width: 100%"/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12">
<div class="box-title-text">
<div class="title-text">
<span class="title-text-text"
:title="$t('uploadRelevantMaterials')">{{$t('uploadRelevantMaterials')}}</span>
</div>
<a-form-model-item class="itemModel" prop="accessory_id">
<a-button type="primary" class="button-text"
@click="clickButtonToUpload('relatedDataFileId')">
{{ (formInline.relatedDataFileId === 'null' || formInline.relatedDataFileId === '' ||
formInline.relatedDataFileId == null) ? $t('clickUpload') : $t('viewUploadedFiles')
}}
</a-button>
</a-form-model-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="24">
<div class="box-title-text">
<div class="title-text">
<span class="title-text-text" :title="$t('processBackground')">{{$t('processBackground')}}</span>
</div>
<a-form-model-item class="itemModel" prop="taskExplain">
<a-textarea :placeholder="$t('pleaseEnter')+$t('processBackground')"
v-model="formInline.processBackground"
:rows="4"/>
</a-form-model-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24">
<a-col :span="24">
<div class="box-title-text">
<div class="title-text">
<span class="title-text-text" :title="$t('remarks')">{{$t('remarks')}}</span>
</div>
<a-form-model-item class="itemModel" prop="remarks">
<a-textarea :placeholder="$t('pleaseEnter')+$t('remarks')"
v-model="formInline.remark"
:rows="4"/>
</a-form-model-item>
</div>
</a-col>
</a-row>
<a-row :gutter="24" v-if="!isTrue">
<a-col :span="12">
<div class="box-title-text">
<div class="title-text">
<span class="Required">*</span>
<span class="title-text-text" :title="$t('evaluationMethod')">{{$t('evaluationMethod')}}</span>
</div>
<a-form-model-item class="itemModel" prop="gatherResult">
<a-tree-select
tree-node-filter-prop="title"
v-model="formInline.evaluationMethods"
:maxTagCount="1"
:getPopupContainer="triggerNode=> triggerNode.parentNode"
class="box-input"
style="width: 100%"
:tree-data="gatherResultList"
tree-checkable
:placeholder="$t('PleaseSelect')+$t('evaluationMethod')"
/>
</a-form-model-item>
</div>
</a-col>
<a-col :span="12">
<div class="box-title-text">
<div class="title-text">
<span class="Required">*</span>
<span class="title-text-text" :title="$t('Assessor')">{{$t('Assessor')}}</span>
</div>
<a-form-model-item class="itemModel" prop="evaluatorsName">
<PersonnelSelection class="box-input"
:personneQuery="formInline"
:query="{db_field_name:'evaluators',db_field_txt:$t('Assessor')}"
:isInput="true"
@change="PersonnelSelectionChange"
v-model="formInline.evaluatorsName"/>
</a-form-model-item>
</div>
</a-col>
</a-row>
</a-form-model>
<TermInformation v-if="isTrue"/>
<footerProcess
@submit="submit"
:isSubmit="true"
/>
</div>
</div>
<JLoading :loading="JLoading">{{this.$t('pleaseWaitWhileRunning')}}</JLoading>
<uploadFile ref="uploadFile" @uploadSuccess="uploadSuccess"/>
<standardDecompositionSheet ref="standardDecompositionSheetRef"
@standardDecompositionSheetForm="standardDecompositionSheetForm"/>
</div>
</template>
<script>
import headerProcess from '../../../processCenter/components/headerProcess'
import search from '@/components/search/index'
import uploadFile from '@/components/uploadFile/file'
import PersonnelSelection from '@/components/PersonnelSelection/index'
import footerProcess from '../../../processCenter/components/footerProcess'
import standardDecompositionSheet from './standardDecompositionSheet'
import TermInformation from './TermInformation'
import { getAction, postAction } from '@/api/manage'
import moment from 'moment'
import eventBUs from '../../../../common/event'
import { mapGetters } from 'vuex'
export default {
name: 'evaluationInitiationProcess',
components: {
headerProcess,
search,
uploadFile,
footerProcess,
PersonnelSelection,
standardDecompositionSheet,
TermInformation
},
data() {
return {
title: this.$t('regulatoryEngineer') + this.$t('initiatingProcess'),
//url传参严格按照当前命名
url: {
seachList: 'document/bussDocumentLibraryEO/queryCondition', //搜索字段
addModelList: '/dummy/dummyInventoryInfoEO/queryPageDummy'
},
loading: false,
JLoading: false,
isTrue: false,
dataSource: [],
selectedRowKeys: [],
total: 0,
pageSize: 10,
pageNo: 1,
formInline: {},
gatherResultList: [],
rules: {
endTime: [
{
required: true,
message: this.$t('closingDate') + this.$t('cannotEmpty'),
trigger: 'change'
}
],
evaluatorsName: [
{
required: true,
message: this.$t('Assessor') + this.$t('cannotEmpty'),
trigger: 'change'
}
]
},
searchParmes: {},
selectedRowKeysRecord: [],
columns: [
{
title: this.$t('standard'),
align: 'center',
dataIndex: 'serial_number',
width: 170,
scopedSlots: { customRender: 'serial_number' }
},
{
title: this.$t('title'),
align: 'center',
dataIndex: 'title',
width: 170,
scopedSlots: { customRender: 'titleName' }
},
{
title: this.$t('status'),
align: 'center',
width: 140,
ellipsis: true,
dataIndex: 'state'
},
{
title: this.$t('zoneOfApplication'),
align: 'center',
width: 170,
ellipsis: true,
dataIndex: 'region'
},
{
title: this.$t('technicalField'),
align: 'center',
ellipsis: true,
width: 170,
dataIndex: 'technology_territory'
},
{
title: this.$t('correspondingStandard'),
align: 'center',
ellipsis: true,
width: 170,
dataIndex: 'corresponding_standard'
}
]
}
},
mounted() {
document.title = this.$t('regulatoryEngineer') + this.$t('initiatingProcess')
this.getList()
this.getEvaluationMethodTree()
if (this.$route.query.whetherTobring == '1') {
this.isTrue = true
} else {
this.isTrue = false
}
eventBUs.$on('searchQuery', search => {
Object.keys(search).forEach(res => {
if (search[res] instanceof Array) {
search[res] = search[res].join(',')
}
})
this.pageNo = 1
this.searchParmes = search
this.getList()
})
},
methods: {
...mapGetters(['userInfo']),
getEvaluationMethodTree() {
getAction('/sys/category/getEvaluationMethodTree').then((res) => {
if (res.success) {
this.gatherResultList = res.result
} else {
this.gatherResultList = []
}
})
},
pageOnChange(page) {
this.pageNo = page
this.getList()
},
SizeChange(pageSize) {
this.pageNo = 1
this.pageSize = pageSize
this.getList()
},
getList() {
let query = {
pageNo: this.pageNo,
pageSize: this.pageSize,
...this.searchParmes
}
this.loading = true
postAction(this.url.addModelList, query).then((res) => {
if (res.success) {
this.dataSource = res.result.records || []
this.total = res.result.total
this.loading = false
} else {
this.dataSource = []
this.total = 0
this.loading = false
}
})
},
onSelectChange(value, record) {
this.selectedRowKeys = value
this.selectedRowKeysRecord = []
if (this.selectedRowKeys.length > 1) {
this.selectedRowKeys.shift()
}
let content = record.filter(res => {
return res.id == this.selectedRowKeys[0]
})
if (content && content.length > 0) {
this.selectedRowKeysRecord.push({
standId: content[0].id,
serialNumber: content[0].serial_number,
title: content[0].title,
technologyTerritory: content[0].technology_territory
})
}
},
standardDecompositionDocumentClick() {
if (this.selectedRowKeysRecord && this.selectedRowKeysRecord.length > 0) {
this.$refs.standardDecompositionSheetRef.getData(JSON.parse(JSON.stringify(this.selectedRowKeysRecord[0])))
} else {
this.$message.warning(this.$t('pleaseSelectStandardFirst'))
}
},
standardDecompositionSheetForm(value) {
},
clickButtonToUpload(item) {
this.$refs.uploadFile.perentHandleFunc()
this.$refs.uploadFile.visible = true
this.uploadName = item
getAction('sys/common/getFileInfos', { id: this.formInline[item] }).then((res) => {
if (res.success) {
this.$refs.uploadFile.perentHandleFunc(res.result)
} else {
this.$refs.uploadFile.perentHandleFunc()
}
})
},
/** 上传文件的回调 */
uploadSuccess(data) {
let attIdList = []
if (data && data.length > 0) {
data.map(item => {
attIdList.push(item.id || data.name)
})
}
/** 赋值给当前对应的表单文件 */
this.formInline[this.uploadName] = attIdList.join(',')
this.formInline = { ...this.formInline }
},
PersonnelSelectionChange(value, id) {
this.formInline[value] = id
this.formInline = { ...this.formInline }
},
dateChange(item) {
this.formInline[item] = this.formInline[item] ? moment(this.formInline[item]).format('YYYY-MM-DD') : ''
},
getUUID() {
var str = []
var Chars = '0123456789abcdefghijklmnopqrstuvwxyz'
for (var i = 0; i < 36; i++) {
str[i] = Chars.substr(Math.floor(Math.random() * 16), 1)
}
str[0] = str[8] = str[13] = str[18] = str[23] = '-'
return str.join('')
},
submit(startTime) {
this.$refs.ruleForm.validate(valid => {
if (valid) {
if (this.selectedRowKeysRecord && this.selectedRowKeysRecord.length == 0) {
this.$message.warning(this.$t('pleaseSelectStandard'))
} else {
this.JLoading = true
let value = Object.assign(this.formInline, this.selectedRowKeysRecord[0])
if (this.isTrue) {
value.evaluationType = 'Item evaluation'
} else {
value.evaluationType = 'Feedback evaluation'
}
value.startTime = startTime
value.flowStatus = 'Underway'
value.taskAffirmDueDate = value.endTime
value.id = this.getUUID()
value.regulationOwnerId = this.userInfo().id
Object.keys(value).forEach(res => {
if (value[res] && value[res] instanceof Array) {
value[res] = value[res].join(',')
}
if (value[res] && value[res] instanceof String) {
value[res] = value[res].replace(/\"/g, '“')
value[res] = value[res].replace(/\'/g, '‘')
}
})
this.startProcess(value)
}
}
})
},
startProcess(value) {
let query = {
type: 6,
msg: JSON.stringify(value).replace(/\"/g, '\'')
}
postAction('/workFlow/startProcess', query).then((res) => {
if (res.success) {
this.completeTask(value, res.result)
} else {
this.JLoading = false
}
})
},
completeTask(value, taskId) {
let query = {
userid: this.userInfo().id,
taskId: taskId,
json: JSON.stringify(value).replace(/\"/g, '\'')
}
postAction('/workFlow/completeTask', query).then((res) => {
if (res.success) {
this.$message.success(this.$t('OperationSuccessful'))
this.JLoading = false
this.$router.push({
path: '/technologyAssessment'
})
} else {
this.JLoading = false
this.$message.warning(this.$t('operationFailed'))
}
})
}
}
}
</script>
<style scoped>
.detail-box {
padding: 67px 0 0 0;
background: #ffffff;
height: 100%;
overflow: auto;
}
#examineBox {
display: flex;
flex-direction: column;
background: #fff;
position: relative;
height: 100%;
overflow-y: auto;
}
.box-title-text {
line-height: 1.4;
display: flex;
/*align-items: center;*/
}
.title-text {
width: 88px;
text-align: right;
display: inline-block;
font-weight: 500;
font-size: 14px;
margin-right: 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 42px;
line-height: 48px;
color: #000F16;
}
.box-input {
display: inline-block;
height: 38px;
width: 100%;
}
.itemModel {
width: calc(100% - 130px);
display: inline-block;
margin-top: 2px;
margin-bottom: 12px;
}
.Required {
color: red;
margin-right: 4px;
}
.title-text-text {
margin-top: 9px;
}
.formAdd {
margin-top: 20px;
}
.button-text {
height: 38px;
width: calc(100% - 100px);
line-height: 38px;
background: #fff;
border: 1px #00B3BE solid;
color: #00B3BE;
}
.page {
text-align: right;
margin-top: 20px;
}
.title-text-content {
display: inline-block;
width: calc(100% - 334px);
text-align: center;
border: 1px solid #d9d9d9;
line-height: 38px;
border-bottom-left-radius: 5px;
border-top-left-radius: 5px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.title-text-right {
width: 200px;
text-align: center;
border: 1px solid #d9d9d9;
line-height: 38px;
border-bottom-right-radius: 5px;
border-top-right-radius: 5px;
border-left: none;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #21c9cc;
cursor: pointer;
}
.title-text-content-one {
border-bottom-right-radius: 5px;
border-top-right-radius: 5px;
width: calc(100% - 128px);
}
</style>