mirror of https://github.com/veops/cmdb.git
style 新建属性行错乱
This commit is contained in:
wang-liang0615
parent
095d3b2cfb
commit
3d3453e257
|
|
@ -1,130 +1,137 @@
|
||||||
<template>
|
<template>
|
||||||
<a-form :form="form" class="create-new-attribute">
|
<a-form :form="form" class="create-new-attribute">
|
||||||
<a-divider style="font-size:14px;margin-top:6px;">基础设置</a-divider>
|
<a-divider style="font-size:14px;margin-top:6px;">基础设置</a-divider>
|
||||||
<a-col :span="12">
|
<a-row>
|
||||||
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="属性名(英文)">
|
<a-col :span="12">
|
||||||
<a-input
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="属性名(英文)">
|
||||||
name="name"
|
|
||||||
placeholder="英文"
|
|
||||||
v-decorator="[
|
|
||||||
'name',
|
|
||||||
{
|
|
||||||
rules: [
|
|
||||||
{ required: true, message: '请输入属性名' },
|
|
||||||
{ message: '不能以数字开头，可以是英文 数字以及下划线 (_)', pattern: RegExp('^(?!\\d)[a-zA-Z_0-9]+$') },
|
|
||||||
{ message: '内置字段', pattern: RegExp('^(?!(id|_id|ci_id|type|_type|ci_type)$).*$') },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="12">
|
|
||||||
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="别名">
|
|
||||||
<a-input name="alias" v-decorator="['alias', { rules: [] }]" />
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="12">
|
|
||||||
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="数据类型">
|
|
||||||
<a-select
|
|
||||||
name="value_type"
|
|
||||||
style="width: 100%"
|
|
||||||
v-decorator="['value_type', { rules: [{ required: true }], initialValue: '2' }]"
|
|
||||||
@change="handleChangeValueType"
|
|
||||||
>
|
|
||||||
<a-select-option :value="key" :key="key" v-for="(value, key) in valueTypeMap">{{ value }}</a-select-option>
|
|
||||||
</a-select>
|
|
||||||
</a-form-item>
|
|
||||||
</a-col>
|
|
||||||
<a-col :span="currentValueType === '6' ? 24 : 12">
|
|
||||||
<a-form-item
|
|
||||||
:label-col="{ span: currentValueType === '6' ? 4 : 8 }"
|
|
||||||
:wrapper-col="{ span: currentValueType === '6' ? 18 : 12 }"
|
|
||||||
label="默认值"
|
|
||||||
>
|
|
||||||
<template>
|
|
||||||
<a-select
|
|
||||||
v-if="form.getFieldValue('is_list')"
|
|
||||||
mode="tags"
|
|
||||||
:style="{ width: '100%' }"
|
|
||||||
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
|
||||||
>
|
|
||||||
</a-select>
|
|
||||||
<a-input-number
|
|
||||||
style="width: 100%"
|
|
||||||
v-else-if="currentValueType === '1'"
|
|
||||||
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
|
||||||
>
|
|
||||||
</a-input-number>
|
|
||||||
<a-select
|
|
||||||
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
|
||||||
mode="tags"
|
|
||||||
v-else-if="currentValueType === '0'"
|
|
||||||
@select="selectIntDefaultValue"
|
|
||||||
>
|
|
||||||
<a-select-option key="$auto_inc_id">
|
|
||||||
自增ID
|
|
||||||
</a-select-option>
|
|
||||||
</a-select>
|
|
||||||
<a-input
|
<a-input
|
||||||
style="width: 100%"
|
name="name"
|
||||||
v-else-if="currentValueType === '2' || currentValueType === '5'"
|
placeholder="英文"
|
||||||
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
v-decorator="[
|
||||||
>
|
'name',
|
||||||
</a-input>
|
{
|
||||||
<a-select
|
rules: [
|
||||||
allowClear
|
{ required: true, message: '请输入属性名' },
|
||||||
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
{
|
||||||
v-else-if="currentValueType === '3' && defaultForDatetime !== '$custom_time'"
|
message: '不能以数字开头，可以是英文 数字以及下划线 (_)',
|
||||||
@select="changeDefaultForDatetime"
|
pattern: RegExp('^(?!\\d)[a-zA-Z_0-9]+$'),
|
||||||
>
|
},
|
||||||
<a-select-option key="$created_at">
|
{ message: '内置字段', pattern: RegExp('^(?!(id|_id|ci_id|type|_type|ci_type)$).*$') },
|
||||||
创建时间
|
],
|
||||||
</a-select-option>
|
},
|
||||||
<a-select-option key="$updated_at">
|
]"
|
||||||
更新时间
|
|
||||||
</a-select-option>
|
|
||||||
<a-select-option key="$custom_time">
|
|
||||||
自定义时间
|
|
||||||
</a-select-option>
|
|
||||||
</a-select>
|
|
||||||
<template v-else-if="currentValueType === '4' || currentValueType === '3'">
|
|
||||||
<a-date-picker
|
|
||||||
style="width: 100%"
|
|
||||||
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
|
||||||
:format="currentValueType === '4' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss'"
|
|
||||||
:showTime="currentValueType === '4' ? false : { format: 'HH:mm:ss' }"
|
|
||||||
/>
|
|
||||||
<a-dropdown
|
|
||||||
:style="{ position: 'absolute', right: '-15px', top: '-10px' }"
|
|
||||||
:trigger="['click']"
|
|
||||||
v-if="currentValueType === '3'"
|
|
||||||
>
|
|
||||||
<a><a-icon type="down" /> </a>
|
|
||||||
<a-menu slot="overlay" @click="onClick">
|
|
||||||
<a-menu-item key="$created_at">
|
|
||||||
<a>创建时间</a>
|
|
||||||
</a-menu-item>
|
|
||||||
<a-menu-item key="$updated_at">
|
|
||||||
<a>更新时间</a>
|
|
||||||
</a-menu-item>
|
|
||||||
</a-menu>
|
|
||||||
</a-dropdown>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<vue-json-editor
|
|
||||||
v-else-if="currentValueType === '6'"
|
|
||||||
:style="{ '--custom-height': `${200}px` }"
|
|
||||||
v-model="default_value_json"
|
|
||||||
:showBtns="false"
|
|
||||||
:mode="'code'"
|
|
||||||
lang="zh"
|
|
||||||
@json-change="onJsonChange"
|
|
||||||
@has-error="onJsonError"
|
|
||||||
/>
|
/>
|
||||||
</template>
|
</a-form-item>
|
||||||
</a-form-item>
|
</a-col>
|
||||||
</a-col>
|
<a-col :span="12">
|
||||||
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="别名">
|
||||||
|
<a-input name="alias" v-decorator="['alias', { rules: [] }]" />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="12">
|
||||||
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="数据类型">
|
||||||
|
<a-select
|
||||||
|
name="value_type"
|
||||||
|
style="width: 100%"
|
||||||
|
v-decorator="['value_type', { rules: [{ required: true }], initialValue: '2' }]"
|
||||||
|
@change="handleChangeValueType"
|
||||||
|
>
|
||||||
|
<a-select-option :value="key" :key="key" v-for="(value, key) in valueTypeMap">{{ value }}</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="currentValueType === '6' ? 24 : 12">
|
||||||
|
<a-form-item
|
||||||
|
:label-col="{ span: currentValueType === '6' ? 4 : 8 }"
|
||||||
|
:wrapper-col="{ span: currentValueType === '6' ? 18 : 12 }"
|
||||||
|
label="默认值"
|
||||||
|
>
|
||||||
|
<template>
|
||||||
|
<a-select
|
||||||
|
v-if="form.getFieldValue('is_list')"
|
||||||
|
mode="tags"
|
||||||
|
:style="{ width: '100%' }"
|
||||||
|
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
||||||
|
>
|
||||||
|
</a-select>
|
||||||
|
<a-input-number
|
||||||
|
style="width: 100%"
|
||||||
|
v-else-if="currentValueType === '1'"
|
||||||
|
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
||||||
|
>
|
||||||
|
</a-input-number>
|
||||||
|
<a-select
|
||||||
|
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
||||||
|
mode="tags"
|
||||||
|
v-else-if="currentValueType === '0'"
|
||||||
|
@select="selectIntDefaultValue"
|
||||||
|
>
|
||||||
|
<a-select-option key="$auto_inc_id">
|
||||||
|
自增ID
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
<a-input
|
||||||
|
style="width: 100%"
|
||||||
|
v-else-if="currentValueType === '2' || currentValueType === '5'"
|
||||||
|
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
||||||
|
>
|
||||||
|
</a-input>
|
||||||
|
<a-select
|
||||||
|
allowClear
|
||||||
|
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
||||||
|
v-else-if="currentValueType === '3' && defaultForDatetime !== '$custom_time'"
|
||||||
|
@select="changeDefaultForDatetime"
|
||||||
|
>
|
||||||
|
<a-select-option key="$created_at">
|
||||||
|
创建时间
|
||||||
|
</a-select-option>
|
||||||
|
<a-select-option key="$updated_at">
|
||||||
|
更新时间
|
||||||
|
</a-select-option>
|
||||||
|
<a-select-option key="$custom_time">
|
||||||
|
自定义时间
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
<template v-else-if="currentValueType === '4' || currentValueType === '3'">
|
||||||
|
<a-date-picker
|
||||||
|
style="width: 100%"
|
||||||
|
v-decorator="['default_value', { rules: [{ required: false }] }]"
|
||||||
|
:format="currentValueType === '4' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss'"
|
||||||
|
:showTime="currentValueType === '4' ? false : { format: 'HH:mm:ss' }"
|
||||||
|
/>
|
||||||
|
<a-dropdown
|
||||||
|
:style="{ position: 'absolute', right: '-15px', top: '-10px' }"
|
||||||
|
:trigger="['click']"
|
||||||
|
v-if="currentValueType === '3'"
|
||||||
|
>
|
||||||
|
<a><a-icon type="down" /> </a>
|
||||||
|
<a-menu slot="overlay" @click="onClick">
|
||||||
|
<a-menu-item key="$created_at">
|
||||||
|
<a>创建时间</a>
|
||||||
|
</a-menu-item>
|
||||||
|
<a-menu-item key="$updated_at">
|
||||||
|
<a>更新时间</a>
|
||||||
|
</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</a-dropdown>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<vue-json-editor
|
||||||
|
v-else-if="currentValueType === '6'"
|
||||||
|
:style="{ '--custom-height': `${200}px` }"
|
||||||
|
v-model="default_value_json"
|
||||||
|
:showBtns="false"
|
||||||
|
:mode="'code'"
|
||||||
|
lang="zh"
|
||||||
|
@json-change="onJsonChange"
|
||||||
|
@has-error="onJsonError"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
|
||||||
<a-col :span="6">
|
<a-col :span="6">
|
||||||
<a-form-item
|
<a-form-item
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue