fix: 配置参数输入框充满

This commit is contained in:
TsMask
2023-11-06 17:28:57 +08:00
parent 33f16f6173
commit 0580fdf941
4 changed files with 203 additions and 185 deletions

View File

@@ -11,7 +11,7 @@ VITE_APP_NAME = "核心网管理平台"
VITE_APP_CODE = "CoreNet" VITE_APP_CODE = "CoreNet"
# 应用版本 # 应用版本
VITE_APP_VERSION = "1.23.0" VITE_APP_VERSION = "2.2311.7"
# 接口基础URL地址-不带/后缀 # 接口基础URL地址-不带/后缀
VITE_API_BASE_URL = "/omc-api" VITE_API_BASE_URL = "/omc-api"

View File

@@ -11,7 +11,7 @@ VITE_APP_NAME = "核心网管理平台"
VITE_APP_CODE = "CoreNet" VITE_APP_CODE = "CoreNet"
# 应用版本 # 应用版本
VITE_APP_VERSION = "1.23.1101" VITE_APP_VERSION = "2.2311.7.1106"
# 接口基础URL地址-不带/后缀 # 接口基础URL地址-不带/后缀
VITE_API_BASE_URL = "/omc-api" VITE_API_BASE_URL = "/omc-api"

View File

@@ -1148,54 +1148,62 @@ onMounted(() => {
" "
class="editable-cell__input-wrapper" class="editable-cell__input-wrapper"
> >
<a-space :size="16" align="center" direction="horizontal"> <a-input
<a-input v-if="
v-if=" ['string', 'ipv6', 'ipv4', 'regex'].includes(
['string', 'ipv6', 'ipv4', 'regex'].includes( record['type']
record['type'] )
) "
" v-model:value="tableState.editRecord['value']"
v-model:value="tableState.editRecord['value']" ></a-input>
></a-input> <a-input-number
<a-input-number v-else-if="record['type'] === 'int'"
v-else-if="record['type'] === 'int'" v-model:value="tableState.editRecord['value']"
v-model:value="tableState.editRecord['value']" :min="0"
:min="0" :max="65535"
:max="65535" style="width: 100%"
style="min-width: 180px;" ></a-input-number>
></a-input-number> <a-switch
<a-switch v-else-if="record['type'] === 'bool'"
v-else-if="record['type'] === 'bool'" v-model:checked="tableState.editRecord['value']"
v-model:checked="tableState.editRecord['value']" :checked-children="t('common.switch.open')"
:checked-children="t('common.switch.open')" :un-checked-children="t('common.switch.shut')"
:un-checked-children="t('common.switch.shut')" ></a-switch>
></a-switch> <a-select
<a-select v-else-if="record['type'] === 'enum'"
v-else-if="record['type'] === 'enum'" v-model:value="tableState.editRecord['value']"
v-model:value="tableState.editRecord['value']" :allow-clear="true"
:allow-clear="true" style="width: 100%"
style="min-width: 180px;" >
<a-select-option
:value="+v"
:key="+v"
v-for="(k, v) in JSON.parse(record['filter'])"
> >
<a-select-option {{ k }}
:value="+v" </a-select-option>
:key="+v" </a-select>
v-for="(k, v) in JSON.parse(record['filter'])"
>
{{ k }}
</a-select-option>
</a-select>
<a-space :size="16" align="center">
<a-popconfirm <a-popconfirm
title="确认更新该属性值吗?" title="确认更新该属性值吗?"
placement="top" placement="top"
@confirm="listEditOk()" @confirm="listEditOk()"
> >
<CheckOutlined class="editable-cell__icon-edit" /> <a-button
type="text"
class="editable-cell__icon-edit"
>
<template #icon><CheckOutlined /></template>
</a-button>
</a-popconfirm> </a-popconfirm>
<CloseOutlined <a-button
type="text"
class="editable-cell__icon-edit" class="editable-cell__icon-edit"
@click="listEditClose()" @click="listEditClose()"
/> >
<template #icon><CloseOutlined /></template>
</a-button>
</a-space> </a-space>
</div> </div>
<div v-else class="editable-cell__text-wrapper"> <div v-else class="editable-cell__text-wrapper">
@@ -1269,18 +1277,23 @@ onMounted(() => {
placement="left" placement="left"
@confirm="arrayEditOk()" @confirm="arrayEditOk()"
> >
<CheckOutlined class="editable-cell__icon-edit" /> <a-button type="text" class="editable-cell__icon-edit">
<template #icon><CheckOutlined /></template>
</a-button>
</a-popconfirm> </a-popconfirm>
</a-tooltip> </a-tooltip>
<a-tooltip> <a-tooltip>
<template #title>取消</template> <template #title>取消</template>
<CloseOutlined <a-button
type="text"
class="editable-cell__icon-edit" class="editable-cell__icon-edit"
@click="arrayEditClose()" @click.prevent="arrayEditClose()"
/> >
<template #icon><CloseOutlined /></template>
</a-button>
</a-tooltip> </a-tooltip>
</a-space> </a-space>
<a-space :size="8" align="center" v-else> <a-space :size="16" align="center" v-else>
<a-tooltip> <a-tooltip>
<template #title>{{ t('common.editText') }}</template> <template #title>{{ t('common.editText') }}</template>
<a-button type="link" @click.prevent="arrayEdit(record)"> <a-button type="link" @click.prevent="arrayEdit(record)">
@@ -1312,51 +1325,49 @@ onMounted(() => {
" "
class="editable-cell__input-wrapper" class="editable-cell__input-wrapper"
> >
<a-space :size="16" align="center" direction="horizontal"> <a-input
<a-input v-if="
v-if=" ['string', 'ipv6', 'ipv4', 'regex'].includes(
['string', 'ipv6', 'ipv4', 'regex'].includes( text['type']
text['type'] )
) "
" v-model:value="
v-model:value=" tableState.editRecord[text.name]['value']
tableState.editRecord[text.name]['value'] "
" style="width: 100%"
style="width: 100%" ></a-input>
></a-input> <a-input-number
<a-input-number v-else-if="text['type'] === 'int'"
v-else-if="text['type'] === 'int'" v-model:value="
v-model:value=" tableState.editRecord[text.name]['value']
tableState.editRecord[text.name]['value'] "
" :min="0"
:min="0" :max="65535"
:max="65535" style="width: 100%"
style="width: 100%" ></a-input-number>
></a-input-number> <a-switch
<a-switch v-else-if="text['type'] === 'bool'"
v-else-if="text['type'] === 'bool'" v-model:checked="
v-model:checked=" tableState.editRecord[text.name]['value']
tableState.editRecord[text.name]['value'] "
" :checked-children="t('common.switch.open')"
:checked-children="t('common.switch.open')" :un-checked-children="t('common.switch.shut')"
:un-checked-children="t('common.switch.shut')" ></a-switch>
></a-switch> <a-select
<a-select v-else-if="text['type'] === 'enum'"
v-else-if="text['type'] === 'enum'" v-model:value="
v-model:value=" tableState.editRecord[text.name]['value']
tableState.editRecord[text.name]['value'] "
" style="width: 100%"
style="min-width: 180px;" >
<a-select-option
:value="+v"
:key="+v"
v-for="(k, v) in JSON.parse(text['filter'])"
> >
<a-select-option {{ k }}
:value="+v" </a-select-option>
:key="+v" </a-select>
v-for="(k, v) in JSON.parse(text['filter'])"
>
{{ k }}
</a-select-option>
</a-select>
</a-space>
</div> </div>
<a-button <a-button
type="link" type="link"
@@ -1430,15 +1441,23 @@ onMounted(() => {
placement="left" placement="left"
@confirm="arrayChildEditOk()" @confirm="arrayChildEditOk()"
> >
<CheckOutlined class="editable-cell__icon-edit" /> <a-button
type="text"
class="editable-cell__icon-edit"
>
<template #icon><CheckOutlined /></template>
</a-button>
</a-popconfirm> </a-popconfirm>
</a-tooltip> </a-tooltip>
<a-tooltip> <a-tooltip>
<template #title>取消</template> <template #title>取消</template>
<CloseOutlined <a-button
type="text"
class="editable-cell__icon-edit" class="editable-cell__icon-edit"
@click="arrayChildEditClose()" @click.prevent="arrayChildEditClose()"
/> >
<template #icon><CloseOutlined /></template>
</a-button>
</a-tooltip> </a-tooltip>
</a-space> </a-space>
<a-space :size="8" align="center" v-else> <a-space :size="8" align="center" v-else>
@@ -1479,64 +1498,58 @@ onMounted(() => {
" "
class="editable-cell__input-wrapper" class="editable-cell__input-wrapper"
> >
<a-space <a-input
:size="16" v-if="
align="center" ['string', 'ipv6', 'ipv4', 'regex'].includes(
direction="horizontal" text['type']
)
"
v-model:value="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
style="width: 100%"
></a-input>
<a-input-number
v-else-if="text['type'] === 'int'"
v-model:value="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
:min="0"
:max="65535"
style="width: 100%"
></a-input-number>
<a-switch
v-else-if="text['type'] === 'bool'"
v-model:checked="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
:checked-children="t('common.switch.open')"
:un-checked-children="t('common.switch.shut')"
></a-switch>
<a-select
v-else-if="text['type'] === 'enum'"
v-model:value="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
:allow-clear="true"
style="width: 100%"
> >
<a-input <a-select-option
v-if=" :value="+v"
['string', 'ipv6', 'ipv4', 'regex'].includes( :key="+v"
text['type'] v-for="(k, v) in JSON.parse(text['filter'])"
)
"
v-model:value="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
style="width: 100%;"
></a-input>
<a-input-number
v-else-if="text['type'] === 'int'"
v-model:value="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
:min="0"
:max="65535"
style="width: 100%;"
></a-input-number>
<a-switch
v-else-if="text['type'] === 'bool'"
v-model:checked="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
:checked-children="t('common.switch.open')"
:un-checked-children="t('common.switch.shut')"
></a-switch>
<a-select
v-else-if="text['type'] === 'enum'"
v-model:value="
tableState.arrayChildEditRecord[text.name][
'value'
]
"
:allow-clear="true"
style="min-width: 180px;"
> >
<a-select-option {{ k }}
:value="+v" </a-select-option>
:key="+v" </a-select>
v-for="(k, v) in JSON.parse(text['filter'])"
>
{{ k }}
</a-select-option>
</a-select>
</a-space>
</div> </div>
<a-button <a-button
type="link" type="link"
@@ -1583,5 +1596,10 @@ onMounted(() => {
&__text-wrapper:hover &__icon { &__text-wrapper:hover &__icon {
display: inline-block; display: inline-block;
} }
&__input-wrapper {
display: flex;
justify-content: start;
align-items: center;
}
} }
</style> </style>

View File

@@ -1429,7 +1429,7 @@ let modalArrayChildState: ModalArrayChildStateType = reactive({
</a-space> </a-space>
</div> </div>
<div v-else class="editable-cell__text-wrapper"> <div v-else class="editable-cell__text-wrapper">
{{ `${text}` || '&nbsp;' }} {{ `${record.value}` || '&nbsp;' }}
<EditOutlined <EditOutlined
class="editable-cell__icon" class="editable-cell__icon"
v-if="record.access !== 'read'" v-if="record.access !== 'read'"
@@ -1490,42 +1490,42 @@ let modalArrayChildState: ModalArrayChildStateType = reactive({
" "
class="editable-cell__input-wrapper" class="editable-cell__input-wrapper"
> >
<a-space :size="16" align="center" direction="horizontal"> <a-input
<a-input v-if="
v-if=" ['string', 'ipv6', 'ipv4', 'regex'].includes(
['string', 'ipv6', 'ipv4', 'regex'].includes( item['type']
item['type'] )
) "
" v-model:value="state.editRecord[item.name]['value']"
v-model:value="state.editRecord[item.name]['value']" style="width: 100%"
></a-input> ></a-input>
<a-input-number <a-input-number
v-else-if="item['type'] === 'int'" v-else-if="item['type'] === 'int'"
v-model:value="state.editRecord[item.name]['value']" v-model:value="state.editRecord[item.name]['value']"
:min="0" :min="0"
:max="65535" :max="65535"
></a-input-number> style="width: 100%"
<a-switch ></a-input-number>
v-else-if="item['type'] === 'bool'" <a-switch
v-model:checked="state.editRecord[item.name]['value']" v-else-if="item['type'] === 'bool'"
:checked-children="t('common.switch.open')" v-model:checked="state.editRecord[item.name]['value']"
:un-checked-children="t('common.switch.shut')" :checked-children="t('common.switch.open')"
></a-switch> :un-checked-children="t('common.switch.shut')"
<a-select ></a-switch>
v-else-if="item['type'] === 'enum'" <a-select
v-model:value="state.editRecord[item.name]['value']" v-else-if="item['type'] === 'enum'"
:allow-clear="true" v-model:value="state.editRecord[item.name]['value']"
style="width: 100%" :allow-clear="true"
style="width: 100%"
>
<a-select-option
:value="+v"
:key="+v"
v-for="(k, v) in JSON.parse(item['filter'])"
> >
<a-select-option {{ k }}
:value="+v" </a-select-option>
:key="+v" </a-select>
v-for="(k, v) in JSON.parse(item['filter'])"
>
{{ k }}
</a-select-option>
</a-select>
</a-space>
</div> </div>
<a-button <a-button
type="link" type="link"