hir_web/src/views/system/dicomAE/components/edit-dicom.vue

376 lines
10 KiB
Vue

<template>
<el-dialog
:visible.sync="visible"
:close-on-click-modal="false"
:title="title"
width="600px"
custom-class="base-dialog-wrapper"
append-to-body
:before-close="handleCancel"
v-dialogDrag
>
<el-form
ref="editVisitForm"
:model="form"
:rules="rules"
size="small"
label-width="150px"
>
<div class="base-dialog-body">
<!--PacsTypeEnum-->
<el-form-item
:label="$t('system:dicom:form:PacsTypeEnum')"
prop="PacsTypeEnum"
>
<el-select
v-model="form.PacsTypeEnum"
placeholder=""
style="width: 100%"
>
<el-option
v-for="item in $d.PacsType"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<!--AE Title-->
<el-form-item :label="$t('system:dicom:form:AETitle')" prop="CalledAE">
<el-input v-model.trim="form.CalledAE" clearable maxlength="16" />
</el-form-item>
<!--IP-->
<el-form-item :label="$t('system:dicom:form:IP')" prop="IP">
<el-input v-model.trim="form.IP" clearable />
</el-form-item>
<!--Port-->
<el-form-item :label="$t('system:dicom:form:Port')" prop="Port">
<el-input v-model.number="form.Port" type="number" clearable />
</el-form-item>
<!--Modality-->
<el-form-item
:label="$t('system:dicom:form:Modality')"
prop="ModalityList"
>
<el-select
v-model="form.ModalityList"
placeholder=""
style="width: 100%"
clearable
multiple
>
<el-option
v-for="item in $d.modalType"
:key="item.id"
:label="item.label"
:value="item.label"
/>
</el-select>
</el-form-item>
<!--影像时间范围-->
<el-form-item
:label="$t('system:dicom:form:timeFrame')"
prop="PacsSearchMaxDays"
>
<el-input
v-model.number="form.PacsSearchMaxDays"
type="number"
clearable
/>
</el-form-item>
<!--最大拉取数量-->
<el-form-item
:label="$t('system:dicom:form:MaxStudyCount')"
prop="MaxStudyCount"
>
<el-input
v-model.number="form.MaxStudyCount"
type="number"
clearable
/>
</el-form-item>
<!--Description-->
<el-form-item
:label="$t('system:dicom:form:Description')"
prop="Description"
>
<el-input v-model="form.Description" clearable />
</el-form-item>
<!--是否支持多模态-->
<el-form-item
:label="$t('system:dicom:form:IsSupportMutiModality')"
prop="IsSupportMutiModality"
>
<el-switch
v-model="form.IsSupportMutiModality"
:active-text="$fd('YesOrNo', true)"
:inactive-text="$fd('YesOrNo', false)"
:active-value="true"
:inactive-value="false"
>
</el-switch>
</el-form-item>
</div>
<div
class="base-dialog-footer"
style="text-align: right; margin-top: 10px"
>
<el-form-item style="text-align: right">
<el-button
size="small"
type="primary"
:disabled="btnLoading"
@click="handleCancel"
>
{{ $t('common:button:cancel') }}
</el-button>
<el-button
size="small"
type="primary"
:loading="btnLoading"
@click="setAE"
>
{{ $t('common:button:save') }}
</el-button>
</el-form-item>
</div>
</el-form>
</el-dialog>
</template>
<script>
import { setDiicomAE } from '@/api/dicomAE.js'
export default {
name: 'editDicom',
props: {
visible: {
require: true,
default: false,
},
title: {
require: true,
default: '',
},
dicom: {
type: Object,
default: () => {
return {}
},
},
},
data() {
return {
form: {
CalledAE: null,
IP: null,
Port: null,
ModalityList: null,
Description: null,
Id: null,
PacsTypeEnum: null,
PacsSearchMaxDays: null,
MaxStudyCount: null,
IsSupportMutiModality: false
},
rules: {
PacsTypeEnum: [
{
required: true,
message: this.$t('common:ruleMessage:select'),
trigger: 'blur',
},
],
ModalityList: [
{
required: true,
message: this.$t('common:ruleMessage:select'),
trigger: 'blur',
},
{
validator: (rule, value, callback) => {
if (!value || (Array.isArray(value) && value.length <= 0)) {
callback(new Error(this.$t('common:ruleMessage:select')))
} else {
callback()
}
},
},
],
CalledAE: [
{
required: true,
message: this.$t('common:ruleMessage:specify'),
trigger: 'blur',
},
{
pattern: /[a-zA-Z0-9]/,
message: this.$t('common:ruleMessage:CalledAEPattern'),
trigger: 'blur',
},
{
min: 1,
max: 16,
message: this.$t('common:ruleMessage:CalledAEPattern'),
trigger: 'blur',
},
],
IP: [
{
required: true,
message: this.$t('common:ruleMessage:specify'),
trigger: 'blur',
},
{
validator: (rule, value, callback) => {
if (
value === '' ||
typeof value === 'undefined' ||
value == null
) {
callback(new Error(this.$t('common:ruleMessage:ipPattern')))
} else {
const reg =
/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
if (!reg.test(value) && value !== '') {
callback(new Error(this.$t('common:ruleMessage:ipPattern')))
} else {
callback()
}
}
},
message: this.$t('common:ruleMessage:ipPattern'),
trigger: 'blur',
},
],
PacsSearchMaxDays: [
{
required: true,
message: this.$t('common:ruleMessage:PacsSearchMaxDaysPattern'),
trigger: 'blur',
},
{
type: 'number',
min: 0,
max: 365,
message: this.$t('common:ruleMessage:PacsSearchMaxDaysPattern'),
trigger: 'blur',
},
{
validator: (rule, value, callback) => {
if (
value &&
(String(value).includes('.') ||
new RegExp(/\D/g).test(String(value)))
) {
callback(
new Error(
this.$t('common:ruleMessage:PacsSearchMaxDaysPattern')
)
)
} else {
callback()
}
},
trigger: 'blur',
},
],
MaxStudyCount: [
// {
// required: true,
// message: this.$t('common:ruleMessage:MaxStudyCountPattern'),
// trigger: 'blur',
// },
{
validator: (rule, value, callback) => {
if (
value &&
(String(value).includes('.') ||
new RegExp(/\D/g).test(String(value)))
) {
callback(
new Error(this.$t('common:ruleMessage:MaxStudyCountPattern'))
)
} else {
callback()
}
},
trigger: 'blur',
},
],
Port: [
{
required: true,
message: this.$t('common:ruleMessage:portPattern'),
trigger: 'blur',
},
{
type: 'number',
min: 0,
max: 65535,
message: this.$t('common:ruleMessage:portPattern'),
trigger: 'blur',
},
{
validator: (rule, value, callback) => {
if (
value &&
(String(value).includes('.') ||
new RegExp(/\D/g).test(String(value)))
) {
callback(new Error(this.$t('common:ruleMessage:portPattern')))
} else {
callback()
}
},
trigger: 'blur',
},
],
},
btnLoading: false,
}
},
watch: {
dicom: {
handler() {
Object.keys(this.form).forEach((key) => {
this.form[key] = this.dicom[key]
})
},
deep: true,
immediate: true,
},
},
methods: {
handleCancel() {
Object.keys(this.form).forEach((key) => {
this.form[key] = null
})
this.$refs.editVisitForm.clearValidate()
this.$emit('update:visible', false)
},
// 新增或修改
async setAE() {
try {
let validate = await this.$refs.editVisitForm.validate()
if (!validate) return
this.btnLoading = true
let res = await setDiicomAE(this.form)
if (res.IsSuccess) {
if (this.form.Id) {
this.$message.success(this.$t('common:message:updatedSuccessfully'))
} else {
this.$message.success(this.$t('common:message:addedSuccessfully'))
}
this.btnLoading = false
this.handleCancel()
this.$emit('getList')
} else {
this.$message.error(res.errorMessage)
}
} catch (err) {
this.btnLoading = false
console.log(err)
}
},
},
}
</script>