push
This commit is contained in:
xuziqiang
223
lib/component/form/input/input-address.vue
Normal file
223
lib/component/form/input/input-address.vue
Normal file
@@ -0,0 +1,223 @@
|
||||
<template>
|
||||
<div style="">
|
||||
<ns-input
|
||||
class="ns-input-area"
|
||||
:disabled="true"
|
||||
placeholder="请选择"
|
||||
@click="chose"
|
||||
:value="floorName"
|
||||
>
|
||||
<template #addonAfter>
|
||||
<a-button class="ns-area" style="background: #5cc0d1; height: 32px" @click="chose"
|
||||
>{{ addonAfter }}
|
||||
</a-button>
|
||||
</template>
|
||||
</ns-input>
|
||||
</div>
|
||||
<a-modal
|
||||
v-model:visible="visible"
|
||||
:maskClosable="false"
|
||||
@ok="handleOkAddress"
|
||||
@cancel="cancelModel"
|
||||
width="900px"
|
||||
style="top: 3%"
|
||||
>
|
||||
<p class="title">地址选择</p>
|
||||
<ns-view-list-table v-bind="tableConfigAddress" :row-selection="rowSelectionAddress" />
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
|
||||
// let rowSelection='';
|
||||
export default defineComponent({
|
||||
name: 'NsInputAddress',
|
||||
// props: {
|
||||
// addonAfter: {
|
||||
// type: String,
|
||||
// default: '',
|
||||
// },
|
||||
// },
|
||||
// eslint-disable-next-line vue/require-prop-types
|
||||
props: ['size', 'id', 'field', 'formModel', 'allowClear', 'value', 'addonAfter', 'disabled'],
|
||||
emits: ['change', 'blur'],
|
||||
setup() {
|
||||
const pra = {
|
||||
pageSize: 10,
|
||||
regionType: 2,
|
||||
};
|
||||
let resData = ref();
|
||||
http.get('/api/community/community/objs/Region', pra).then((res) => {
|
||||
// console.log(res.data.data);
|
||||
resData.value = res.data.data;
|
||||
});
|
||||
return { resData };
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeKey: '1',
|
||||
//地址选择
|
||||
tableConfigAddress: {
|
||||
api: '/api/community/community/objs/BedChoose/Inspection?regionType=2',
|
||||
defaultPageSize: 5,
|
||||
columns: [
|
||||
{
|
||||
title: '楼栋单元',
|
||||
dataIndex: 'floorName',
|
||||
fixed: 'left',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '楼层',
|
||||
dataIndex: 'floorNum',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '房间',
|
||||
dataIndex: 'roomName',
|
||||
width: 200,
|
||||
},
|
||||
],
|
||||
formConfig: {
|
||||
schemas: [
|
||||
///api/community/community/objs/Region?regionType=2
|
||||
{
|
||||
field: 'regionUuid',
|
||||
component: 'nsSelectApi',
|
||||
label: '楼栋单元',
|
||||
// addLink: ['regionName', 'regionUuid'],
|
||||
autoAddLink: true,
|
||||
componentProps: {
|
||||
autoSelectFirst: false,
|
||||
api: '/api/community/community/objs/Region',
|
||||
params: {
|
||||
pageSize: 10,
|
||||
regionType: 2,
|
||||
},
|
||||
resultField: 'data.data',
|
||||
labelField: 'regionName',
|
||||
valueField: 'regionUuid',
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'floorUuid',
|
||||
label: '楼层',
|
||||
dynamicParams: {
|
||||
regionUuid: 'fieldLink.regionUuid.regionUuid',
|
||||
},
|
||||
defaultParams: {
|
||||
regionType: 2,
|
||||
pageSize: 10,
|
||||
},
|
||||
component: 'nsSelectApi',
|
||||
defaultValue: '',
|
||||
componentProps: {
|
||||
autoSelectFirst: false,
|
||||
api: '/api/community/community/objs/Region',
|
||||
resultField: 'data.data',
|
||||
labelField: 'regionName',
|
||||
valueField: 'regionUuid',
|
||||
// options: [
|
||||
// {
|
||||
// label: '全部',
|
||||
// value: 'all',
|
||||
// },
|
||||
// ],
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
// columnActions: {
|
||||
// width: 0,
|
||||
// title: '',
|
||||
// actions: [
|
||||
// {
|
||||
// label: '启动',
|
||||
// name: 'start',
|
||||
// ifShow: true,
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
rowKey: 'roomUuid',
|
||||
},
|
||||
visible: false,
|
||||
regionUuid: '',
|
||||
roomUuid: '',
|
||||
floorName: '',
|
||||
rootLevelCode: '',
|
||||
rowSelectionAddress: {
|
||||
type: 'radio',
|
||||
onSelect: (record: DataItem, selected: boolean, selectedRows: DataItem[]) => {
|
||||
this.roomUuid = selectedRows[0].roomUuid;
|
||||
this.queryName = selectedRows[0].floorName;
|
||||
this.spliceAddress =
|
||||
selectedRows[0].floorName +
|
||||
'-' +
|
||||
selectedRows[0].floorNum +
|
||||
'-' +
|
||||
selectedRows[0].roomName;
|
||||
// console.log(selectedRows[0]);
|
||||
// console.log("type");
|
||||
// console.log(this.floorName);
|
||||
// console.log(this.type);
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
chose() {
|
||||
this.visible = true;
|
||||
},
|
||||
cancelModel() {
|
||||
this.floorName = '';
|
||||
},
|
||||
handleOkAddress() {
|
||||
this.floorName = this.spliceAddress;
|
||||
// console.log(this.resData);
|
||||
this.resData.forEach((item) => {
|
||||
for (let val in item) {
|
||||
if (item[val] == this.queryName) {
|
||||
this.rootLevelCode = item['rootLevelCode'];
|
||||
return;
|
||||
}
|
||||
}
|
||||
});
|
||||
this.$emit('change', { address: this.floorName, rootLevelCode: this.rootLevelCode });
|
||||
this.visible = false;
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.ns-area:hover,
|
||||
:focus {
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.ns-area {
|
||||
color: white;
|
||||
}
|
||||
|
||||
:deep(.ant-input) {
|
||||
background: rgba(223, 227, 233, 0.5);
|
||||
}
|
||||
|
||||
:deep(.ant-input:focus) {
|
||||
border-color: rgba(223, 227, 233, 0.5);
|
||||
border-right-width: 0px !important;
|
||||
outline: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
:deep(.ant-input) {
|
||||
border-right: 0px;
|
||||
}
|
||||
|
||||
:deep(.ns-area) {
|
||||
border: 0px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user