feat(house): 添加房屋信息表单中的单位字段支持
- 在房屋信息模型中添加了租金单位、月租金单位和面积单位字段 - 修改表单界面为面积、单价和总价字段添加单位输入框 - 更新字典选择器的代码配置从 premium 到 premium2 - 设置默认单位值为泰铢和泰铢/菜 - 修复表单提交时使用正确的租金字段映射
This commit is contained in:
@@ -5,7 +5,7 @@
|
|||||||
:show-search="true"
|
:show-search="true"
|
||||||
optionFilterProp="label"
|
optionFilterProp="label"
|
||||||
:options="data"
|
:options="data"
|
||||||
:value="value"
|
:value="innerValue"
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
@update:value="updateValue"
|
@update:value="updateValue"
|
||||||
:style="`width: ${width}px`"
|
:style="`width: ${width}px`"
|
||||||
@@ -15,13 +15,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import {ref} from 'vue';
|
import { ref, watch } from 'vue';
|
||||||
import {listDictData} from "@/api/system/dict-data";
|
import {listDictData} from "@/api/system/dict-data";
|
||||||
|
|
||||||
const data = ref<any[]>([]);
|
const data = ref<any[]>([]);
|
||||||
|
const innerValue = ref<string | number | undefined>(undefined);
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
(e: 'update:value', value: string): void;
|
(e: 'update:value', value: string | number | undefined): void;
|
||||||
(e: 'index', index: number): void;
|
(e: 'index', index: number): void;
|
||||||
(e: 'blur'): void;
|
(e: 'blur'): void;
|
||||||
(e: 'done', item: any): void;
|
(e: 'done', item: any): void;
|
||||||
@@ -29,39 +30,106 @@
|
|||||||
|
|
||||||
const props = withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
value?: string;
|
value?: string | number;
|
||||||
placeholder?: string;
|
placeholder?: string;
|
||||||
dictCode?: string;
|
dictCode?: string;
|
||||||
showSearch?: string;
|
showSearch?: string;
|
||||||
allowClear?: boolean;
|
allowClear?: boolean;
|
||||||
width?: number;
|
width?: number;
|
||||||
index?: number;
|
index?: number;
|
||||||
|
valueType?: 'id' | 'code' | 'name';
|
||||||
}>(),
|
}>(),
|
||||||
{
|
{
|
||||||
placeholder: '请选择服务器厂商'
|
placeholder: '请选择服务器厂商',
|
||||||
|
valueType: 'id'
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
innerValue.value = props.value as any;
|
||||||
|
|
||||||
|
const normalizeInnerValue = () => {
|
||||||
|
const raw = props.value;
|
||||||
|
if (raw === undefined || raw === null || raw === '') {
|
||||||
|
innerValue.value = raw as any;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const rawStr = String(raw);
|
||||||
|
const matchById = data.value.find((d) => String(d.dictDataId) === rawStr);
|
||||||
|
const matchByCode = data.value.find((d) => String(d.dictDataCode) === rawStr);
|
||||||
|
const matchByName = data.value.find((d) => String(d.dictDataName) === rawStr);
|
||||||
|
|
||||||
|
const setInnerValue = (next: string | number) => {
|
||||||
|
innerValue.value = next;
|
||||||
|
};
|
||||||
|
const emitIfChanged = (next: string | number) => {
|
||||||
|
if (String(raw) !== String(next)) {
|
||||||
|
emit('update:value', next);
|
||||||
|
emit('done', data.value.find((d) => String(d.value) === String(next)));
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (props.valueType === 'name') {
|
||||||
|
const next = matchByName?.dictDataName ?? matchById?.dictDataName ?? matchByCode?.dictDataName;
|
||||||
|
if (next !== undefined) {
|
||||||
|
setInnerValue(next);
|
||||||
|
emitIfChanged(next);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else if (props.valueType === 'code') {
|
||||||
|
const next = matchByCode?.dictDataCode ?? matchById?.dictDataCode ?? matchByName?.dictDataCode;
|
||||||
|
if (next !== undefined) {
|
||||||
|
setInnerValue(next);
|
||||||
|
emitIfChanged(next);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} else if (props.valueType === 'id') {
|
||||||
|
const next =
|
||||||
|
matchById?.dictDataId ??
|
||||||
|
matchByCode?.dictDataId ??
|
||||||
|
matchByName?.dictDataId ??
|
||||||
|
raw;
|
||||||
|
setInnerValue(next);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
innerValue.value = raw as any;
|
||||||
|
};
|
||||||
|
|
||||||
// 字典数据
|
// 字典数据
|
||||||
listDictData({dictCode: props.dictCode}).then(res => {
|
listDictData({dictCode: props.dictCode}).then(res => {
|
||||||
data.value = res.map(d => {
|
data.value = res.map(d => {
|
||||||
|
const optionValue =
|
||||||
|
props.valueType === 'name'
|
||||||
|
? d.dictDataName
|
||||||
|
: props.valueType === 'code'
|
||||||
|
? d.dictDataCode
|
||||||
|
: d.dictDataId;
|
||||||
return {
|
return {
|
||||||
dictDataId: d.dictDataId,
|
dictDataId: d.dictDataId,
|
||||||
dictDataCode: d.dictDataCode,
|
dictDataCode: d.dictDataCode,
|
||||||
dictDataName: d.dictDataName,
|
dictDataName: d.dictDataName,
|
||||||
key: d.dictDataCode,
|
key: d.dictDataCode,
|
||||||
value: d.dictDataId,
|
value: optionValue,
|
||||||
label: d.dictDataName,
|
label: d.dictDataName,
|
||||||
comments: d.comments
|
comments: d.comments
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
normalizeInnerValue();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.value,
|
||||||
|
() => {
|
||||||
|
normalizeInnerValue();
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
/* 更新选中数据 */
|
/* 更新选中数据 */
|
||||||
const updateValue = (value: string) => {
|
const updateValue = (value: string | number) => {
|
||||||
|
innerValue.value = value;
|
||||||
emit('update:value', value);
|
emit('update:value', value);
|
||||||
emit('index', Number(props.index));
|
emit('index', Number(props.index));
|
||||||
emit('done', data.value.find(d => d.value === value))
|
emit('done', data.value.find(d => String(d.value) === String(value)))
|
||||||
};
|
};
|
||||||
|
|
||||||
/* 失去焦点 */
|
/* 失去焦点 */
|
||||||
|
|||||||
@@ -150,6 +150,7 @@
|
|||||||
<DictSelect
|
<DictSelect
|
||||||
v-if="editStatus"
|
v-if="editStatus"
|
||||||
dict-code="premium"
|
dict-code="premium"
|
||||||
|
value-type="name"
|
||||||
v-model:value="form.premium"
|
v-model:value="form.premium"
|
||||||
placeholder="是否可溢价"
|
placeholder="是否可溢价"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -62,7 +62,7 @@
|
|||||||
v-model:value="form.extentUnit"
|
v-model:value="form.extentUnit"
|
||||||
/>
|
/>
|
||||||
</a-space>
|
</a-space>
|
||||||
<span v-else>{{ form.extent }}</span>
|
<span v-else>{{ form.extent }}{{ form.extentUnit }}</span>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="单价(莱)" name="rent">
|
<a-form-item label="单价(莱)" name="rent">
|
||||||
<a-space v-if="editStatus">
|
<a-space v-if="editStatus">
|
||||||
@@ -76,7 +76,7 @@
|
|||||||
v-model:value="form.rentUnit"
|
v-model:value="form.rentUnit"
|
||||||
/>
|
/>
|
||||||
</a-space>
|
</a-space>
|
||||||
<span v-else>{{ form.rent }}</span>
|
<span v-else>{{ form.rent }}{{ form.rentUnit }}</span>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="总价" name="monthlyRent">
|
<a-form-item label="总价" name="monthlyRent">
|
||||||
<a-space v-if="editStatus">
|
<a-space v-if="editStatus">
|
||||||
@@ -88,10 +88,10 @@
|
|||||||
/>
|
/>
|
||||||
<a-input
|
<a-input
|
||||||
placeholder="单位"
|
placeholder="单位"
|
||||||
v-model:value="form.rentUnit"
|
v-model:value="form.monthlyRentUnit"
|
||||||
/>
|
/>
|
||||||
</a-space>
|
</a-space>
|
||||||
<span v-else>{{ form.monthlyRent }}</span>
|
<span v-else>{{ form.monthlyRent }}{{form.monthlyRentUnit}}</span>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<!-- <a-form-item label="房号" name="roomNumber">-->
|
<!-- <a-form-item label="房号" name="roomNumber">-->
|
||||||
<!-- <a-input-->
|
<!-- <a-input-->
|
||||||
@@ -137,7 +137,7 @@
|
|||||||
<a-form-item label="是否可溢价" name="premium">
|
<a-form-item label="是否可溢价" name="premium">
|
||||||
<DictSelect
|
<DictSelect
|
||||||
v-if="editStatus"
|
v-if="editStatus"
|
||||||
dict-code="premium2"
|
dict-code="premium"
|
||||||
v-model:value="form.premium"
|
v-model:value="form.premium"
|
||||||
placeholder="是否可溢价"
|
placeholder="是否可溢价"
|
||||||
/>
|
/>
|
||||||
@@ -415,7 +415,7 @@ import {ref, reactive, watch, computed} from 'vue';
|
|||||||
rent: undefined,
|
rent: undefined,
|
||||||
rentUnit: '泰铢',
|
rentUnit: '泰铢',
|
||||||
monthlyRent: undefined,
|
monthlyRent: undefined,
|
||||||
monthlyRentUnit: undefined,
|
monthlyRentUnit: '泰铢',
|
||||||
extent: undefined,
|
extent: undefined,
|
||||||
extentUnit: '泰铢/菜',
|
extentUnit: '泰铢/菜',
|
||||||
floor: undefined,
|
floor: undefined,
|
||||||
|
|||||||
Reference in New Issue
Block a user