395 lines
13 KiB
Java
395 lines
13 KiB
Java
<template>
|
|
<div class='diolag-area'>
|
|
<a-spin :spinning='spinLoading'>
|
|
<a-form-model
|
|
class='tag-module'
|
|
ref='ruleForm'
|
|
:model='formInline'
|
|
:rules='rules'
|
|
>
|
|
<a-row :gutter='24'>
|
|
<a-col :span='24'>
|
|
<div class="box-title-text">
|
|
<div class="title-text">
|
|
<span class="Required">*</span>
|
|
<span class="title-text-text" :title="$t('from')">{{$t('from')}}</span>
|
|
</div>
|
|
<a-form-model-item class="itemModel" prop="sourceConfigId">
|
|
<a-select :placeholder="$t('PleaseSelect')+$t('controlVerification')"
|
|
style="width: calc(100% - 90px)"
|
|
v-model="formInline.sourceConfigId" allowClear>
|
|
<a-select-option v-for="(item, key) in fromDate" :key="key" :value="item.value">
|
|
<span :title=" item.label ">
|
|
{{ item.label }}
|
|
</span>
|
|
</a-select-option>
|
|
</a-select>
|
|
<span style='width: 90px;line-height: 29px;margin-top: 8px'> {{ $t('configure') }}</span>
|
|
</a-form-model-item>
|
|
|
|
</div>
|
|
<!-- <a-form-model-item style='line-height: 31.9999px;' prop='sourceConfigId' class='aform'>-->
|
|
<!-- <div style='display: flex; justify-content: center'>-->
|
|
<!-- <span class="Requireditem">*</span>-->
|
|
<!-- <div style='width: 107px;line-height: 29px;'>{{ $t('from') }} </div>-->
|
|
<!-- <a-select :placeholder="$t('PleaseSelect')+$t('controlVerification')" v-model="formInline.sourceConfigId" allowClear style='width: 140%'>-->
|
|
<!-- <a-select-option v-for="(item, key) in fromDate" :key="key" :value="item.value" style='width: 140%'>-->
|
|
<!-- <span style="display: inline-block;width: 140%" :title=" item.label ">-->
|
|
<!-- {{ item.label }}-->
|
|
<!-- </span>-->
|
|
<!-- </a-select-option>-->
|
|
<!-- </a-select>-->
|
|
<!-- <div style='width: 90px;line-height: 29px;'> {{ $t('configure') }}</div>-->
|
|
<!-- </div>-->
|
|
<!-- </a-form-model-item>-->
|
|
</a-col>
|
|
<a-col :span='24'>
|
|
<div class="box-title-text">
|
|
<div class="title-text">
|
|
<span class="Required">*</span>
|
|
<span class="title-text-text" :title="$t('ReferenceTo')">{{$t('ReferenceTo')}}</span>
|
|
</div>
|
|
<a-form-model-item class="itemModel" prop="targetConfigIds">
|
|
<a-select :placeholder="$t('PleaseSelect')+$t('controlVerification')"
|
|
style="width: calc(100% - 90px)"
|
|
v-model="formInline.targetConfigIds" allowClear mode="multiple">
|
|
<a-select-option v-for="(item, key) in fromDateTo" :key="key" :value="item.value">
|
|
<span class="itemOption" :title=" item.label ">
|
|
{{ item.label }}
|
|
</span>
|
|
</a-select-option>
|
|
</a-select>
|
|
<span
|
|
style='width: 90px;line-height: 29px;float: right'> {{ $t('configure') }}</span>
|
|
</a-form-model-item>
|
|
</div>
|
|
<!-- <a-form-model-item style='line-height: 31.9999px;' prop='targetConfigIds' class='aform'>-->
|
|
<!-- <span class="Requireditem">*</span>-->
|
|
<!-- <span style='line-height: 29px;width: 107px;display: inline-block'>{{ $t('ReferenceTo') }} </span>-->
|
|
<!-- <a-select :placeholder="$t('PleaseSelect')+$t('controlVerification')"-->
|
|
<!-- style="width: calc(100%);display: inline-block"-->
|
|
<!-- v-model="formInline.targetConfigIds" allowClear mode="multiple">-->
|
|
<!-- <a-select-option v-for="(item, key) in fromDateTo" :key="key" :value="item.value">-->
|
|
<!-- <span class="itemOption" :title=" item.label ">-->
|
|
<!-- {{ item.label }}-->
|
|
<!-- </span>-->
|
|
<!-- </a-select-option>-->
|
|
<!-- </a-select>-->
|
|
<!-- <span style='width: 90px;line-height: 29px;display: inline-block'> {{ $t('configure') }}</span>-->
|
|
<!-- </a-form-model-item>-->
|
|
</a-col>
|
|
</a-row>
|
|
</a-form-model>
|
|
</a-spin>
|
|
<div class='drawer-bootom-button' style="margin-top: 4px">
|
|
<a-button style='margin-right: .8rem' @click='handleCancel'>{{ $t('cancel') }}</a-button>
|
|
<a-button @click='handleSubmit' type='primary' :loading='confirmLoading'>{{ $t('submit') }}</a-button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { putAction, postAction, getAction, deleteAction } from '@/api/manage'
|
|
import axios from 'axios'
|
|
import Vue from 'vue'
|
|
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
|
|
|
export default {
|
|
name: 'diolagArea',
|
|
components: {},
|
|
data() {
|
|
return {
|
|
token: Vue.ls.get(ACCESS_TOKEN),
|
|
selectedRowKeysDate: {},
|
|
loading: false,
|
|
editId: '',
|
|
newVisible: false,
|
|
labelCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 7 }
|
|
},
|
|
wrapperCol: {
|
|
xs: { span: 24 },
|
|
sm: { span: 14 }
|
|
},
|
|
formInline: {},
|
|
rules: {
|
|
sourceConfigId: [
|
|
{ required: true, message: this.$t('pleaseSelect') + this.$t('controlVerification'), trigger: 'change' }
|
|
],
|
|
targetConfigIds: [
|
|
{ required: true, message: this.$t('pleaseSelect') + this.$t('controlVerification'), trigger: 'change' }
|
|
]
|
|
},
|
|
areaTable: [],
|
|
flag: false, //表单提交标识
|
|
spinLoading: false,
|
|
confirmLoading: false,
|
|
selectedRowKeys: [],
|
|
fromDate: [],
|
|
fromDateTo: []
|
|
}
|
|
},
|
|
props: {
|
|
paramsManifest: {
|
|
type: Object,
|
|
default: {},
|
|
require: true
|
|
},
|
|
selectedRowKeysArray: {
|
|
type: String,
|
|
default: '',
|
|
require: true
|
|
}
|
|
},
|
|
mounted() {
|
|
this.loadData(),
|
|
this.loadDataTo()
|
|
},
|
|
methods: {
|
|
loadData() {
|
|
let _this = this
|
|
let param = { paramsManifestId: this.paramsManifest.id, configFlag: 1 }
|
|
axios({
|
|
url: '/jero-boot/params/collectManifest/getConfigLableListR',
|
|
method: 'post',
|
|
data: param,
|
|
transformRequest: [function(data) {
|
|
let ret = ''
|
|
for (let it in data) {
|
|
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
|
|
}
|
|
return ret
|
|
}],
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
'X-Access-Token': _this.token
|
|
}
|
|
})
|
|
.then((res) => {
|
|
console.log(res)
|
|
if (res.data.success) {
|
|
this.fromDate = res.data.result
|
|
} else {
|
|
_this.$message.warning(res.data.message)
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
},
|
|
loadDataTo() {
|
|
let _this = this
|
|
let param = { paramsManifestId: this.paramsManifest.id, configFlag: 2 }
|
|
axios({
|
|
url: '/jero-boot/params/collectManifest/getConfigLableListR',
|
|
method: 'post',
|
|
data: param,
|
|
transformRequest: [function(data) {
|
|
let ret = ''
|
|
for (let it in data) {
|
|
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
|
|
}
|
|
return ret
|
|
}],
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
'X-Access-Token': _this.token
|
|
}
|
|
})
|
|
.then((res) => {
|
|
console.log(res)
|
|
if (res.data.success) {
|
|
this.fromDateTo = res.data.result
|
|
} else {
|
|
_this.$message.warning(res.data.result)
|
|
}
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
},
|
|
searchQuery() {
|
|
this.loadData()
|
|
},
|
|
searchReset() {
|
|
this.form = {}
|
|
this.loadData()
|
|
},
|
|
handleCancel() {
|
|
this.$emit('areaVisibleAssignedbyflag', false)
|
|
},
|
|
onSelectChange(selectedRowKeys, selectedRowKeysDate) {
|
|
this.selectedRowKeysDate = selectedRowKeysDate
|
|
this.selectedRowKeys = selectedRowKeys
|
|
},
|
|
handleTableChange(val) {
|
|
},
|
|
// 引用参数确定
|
|
handleSubmit() {
|
|
this.$refs.ruleForm.validate(valid => {
|
|
if (valid) {
|
|
let formInline = JSON.parse(JSON.stringify(this.formInline))
|
|
if (formInline.targetConfigIds instanceof Array) {
|
|
formInline.targetConfigIds = formInline.targetConfigIds.join(',')
|
|
}
|
|
let param = { ids: this.selectedRowKeysArray, ...formInline }
|
|
this.confirmLoading = true
|
|
postAction('params/collectManifest/referParams', param).then((res) => {
|
|
if (res.success) {
|
|
this.$message.success(this.$t('OperationSuccessful'))
|
|
this.$emit('areaVisibleAssignedbyflag', false)
|
|
this.$emit('GetgetTableList')
|
|
this.confirmLoading = false
|
|
} else {
|
|
this.$message.warning(res.message)
|
|
this.confirmLoading = false
|
|
}
|
|
})
|
|
}
|
|
})
|
|
// axios({
|
|
// url: '/jero-boot/params/collectManifest/referParams',
|
|
// method: 'post',
|
|
// data: param,
|
|
// transformRequest: [function (data) {
|
|
// let ret = ''
|
|
// for (let it in data) {
|
|
// ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
|
|
// }
|
|
// return ret
|
|
// }],
|
|
// headers: {
|
|
// 'Content-Type': 'application/x-www-form-urlencoded',
|
|
// 'X-Access-Token':_this.token
|
|
// }
|
|
// })
|
|
// .then( (res) =>{
|
|
// console.log(res,'res')
|
|
// if (res.data.success) {
|
|
// _this.$message.success(res.data.message)
|
|
// this.$emit('areaVisibleAssignedbyflag', false)
|
|
// }else{
|
|
// _this.$message.warning(res.data.message)
|
|
// }
|
|
// })
|
|
// .catch( (error) =>{
|
|
// console.log(error);
|
|
// });
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang='less' scoped>
|
|
@import '~@assets/less/common.less';
|
|
|
|
/*/deep/ .ant-form-explain {*/
|
|
/* padding-left: 62px;*/
|
|
/*}*/
|
|
|
|
.diolag-area {
|
|
.table-area {
|
|
margin: 20px 0;
|
|
|
|
.action-edit {
|
|
margin-right: 10px;
|
|
}
|
|
}
|
|
|
|
.table-del {
|
|
color: red;
|
|
}
|
|
}
|
|
|
|
.drawer-bootom-button {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.aform {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.itemOption {
|
|
display: inline-block;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
-o-text-overflow: ellipsis;
|
|
}
|
|
.itemModel {
|
|
width: calc(100% - 130px);
|
|
display: inline-block;
|
|
margin-top: 2px;
|
|
height: 40px;
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.page {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.Requireditem {
|
|
color: red;
|
|
line-height: 24px;
|
|
}
|
|
|
|
.box-title-text {
|
|
line-height: 1.4;
|
|
display: flex;
|
|
/*align-items: center;*/
|
|
}
|
|
|
|
.title-text {
|
|
width: 114px;
|
|
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: 42px;
|
|
}
|
|
|
|
.box-input {
|
|
display: inline-block;
|
|
height: 38px;
|
|
width: 100%;
|
|
}
|
|
|
|
.itemModel-text {
|
|
width: calc(100% - 130px);
|
|
display: inline-block;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.Required {
|
|
color: red;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.title-text-text {
|
|
margin-top: 9px;
|
|
}
|
|
</style>
|
|
<style lang='less'>
|
|
.area-module {
|
|
.ant-modal-wrap {
|
|
.ant-modal {
|
|
.ant-modal-content {
|
|
.ant-modal-footer {
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |