fix: bug#11013
This commit is contained in:
xieyonghong
parent
0ea4214ee3
commit
f11f5e1729
|
|
@ -1,132 +1,146 @@
|
|||
<!-- 绑定设备 -->
|
||||
<template>
|
||||
<j-modal :maskClosable="false" width="1100px" :visible="true" title="选择设备" okText="确定" cancelText="取消" @ok="handleOk"
|
||||
@cancel="handleCancel" :confirmLoading="btnLoading">
|
||||
<div style="margin-top: 10px">
|
||||
<pro-search :columns="columns" target="iot-card-bind-device" @search="handleSearch" type="simple" />
|
||||
<j-pro-table ref="bindDeviceRef" :columns="columns" :request="queryUnbounded" model="TABLE" :defaultParams="{
|
||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||
}" :rowSelection="{
|
||||
type: 'radio',
|
||||
selectedRowKeys: _selectedRowKeys,
|
||||
onSelect: onSelectChange,
|
||||
}" @cancelSelect="cancelSelect" :params="params">
|
||||
<template #registryTime="slotProps">
|
||||
{{
|
||||
slotProps.registryTime
|
||||
? moment(slotProps.registryTime).format(
|
||||
'YYYY-MM-DD HH:mm:ss',
|
||||
)
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<j-badge :text="slotProps.state.text" :status="statusMap.get(slotProps.state.value)" />
|
||||
</template>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
</j-modal>
|
||||
<j-modal :maskClosable='false' width='1100px' :visible='true' title='选择设备' okText='确定' cancelText='取消' @ok='handleOk'
|
||||
@cancel='handleCancel' :confirmLoading='btnLoading'>
|
||||
<div style='margin-top: 10px'>
|
||||
<pro-search :columns='columns' target='iot-card-bind-device' @search='handleSearch' type='simple' />
|
||||
<j-pro-table
|
||||
ref='bindDeviceRef'
|
||||
:columns='columns'
|
||||
:request='queryUnbounded'
|
||||
model='TABLE'
|
||||
:defaultParams="{
|
||||
pageSize: 10,
|
||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||
}"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
pageSizeOptions: ['10', '20', '50', '100'],
|
||||
}"
|
||||
:rowSelection="{
|
||||
type: 'radio',
|
||||
selectedRowKeys: _selectedRowKeys,
|
||||
onSelect: onSelectChange,
|
||||
}"
|
||||
@cancelSelect='cancelSelect'
|
||||
:params='params'
|
||||
>
|
||||
<template #registryTime='slotProps'>
|
||||
{{
|
||||
slotProps.registryTime
|
||||
? moment(slotProps.registryTime).format(
|
||||
'YYYY-MM-DD HH:mm:ss'
|
||||
)
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
<template #state='slotProps'>
|
||||
<j-badge :text='slotProps.state.text' :status='statusMap.get(slotProps.state.value)' />
|
||||
</template>
|
||||
</j-pro-table>
|
||||
</div>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { queryUnbounded, bind } from '@/api/iot-card/cardManagement';
|
||||
import moment from 'moment';
|
||||
import { message } from 'jetlinks-ui-components';
|
||||
<script setup lang='ts'>
|
||||
import { queryUnbounded, bind } from '@/api/iot-card/cardManagement'
|
||||
import moment from 'moment'
|
||||
import { message } from 'jetlinks-ui-components'
|
||||
|
||||
const emit = defineEmits(['change']);
|
||||
const emit = defineEmits(['change'])
|
||||
|
||||
const props = defineProps({
|
||||
cardId: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
cardId: {
|
||||
type: String
|
||||
}
|
||||
})
|
||||
|
||||
const bindDeviceRef = ref<Record<string, any>>({});
|
||||
const params = ref<Record<string, any>>({});
|
||||
const _selectedRowKeys = ref<string[]>([]);
|
||||
const btnLoading = ref<boolean>(false);
|
||||
const bindDeviceRef = ref<Record<string, any>>({})
|
||||
const params = ref<Record<string, any>>({})
|
||||
const _selectedRowKeys = ref<string[]>([])
|
||||
const btnLoading = ref<boolean>(false)
|
||||
|
||||
const statusMap = new Map();
|
||||
statusMap.set('online', 'processing');
|
||||
statusMap.set('offline', 'error');
|
||||
statusMap.set('notActive', 'warning');
|
||||
const statusMap = new Map()
|
||||
statusMap.set('online', 'processing')
|
||||
statusMap.set('offline', 'error')
|
||||
statusMap.set('notActive', 'warning')
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: 'ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
ellipsis: true,
|
||||
fixed: 'left',
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '注册时间',
|
||||
dataIndex: 'registryTime',
|
||||
key: 'registryTime',
|
||||
scopedSlots: true,
|
||||
search: {
|
||||
type: 'date',
|
||||
},
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
key: 'state',
|
||||
scopedSlots: true,
|
||||
search: {
|
||||
type: 'select',
|
||||
options: [
|
||||
{ label: '禁用', value: 'notActive' },
|
||||
{ label: '离线', value: 'offline' },
|
||||
{ label: '在线', value: 'online' },
|
||||
],
|
||||
},
|
||||
// filterMultiple: false,
|
||||
},
|
||||
];
|
||||
{
|
||||
title: 'ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
ellipsis: true,
|
||||
fixed: 'left',
|
||||
search: {
|
||||
type: 'string'
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'string'
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '注册时间',
|
||||
dataIndex: 'registryTime',
|
||||
key: 'registryTime',
|
||||
scopedSlots: true,
|
||||
search: {
|
||||
type: 'date'
|
||||
}
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
key: 'state',
|
||||
scopedSlots: true,
|
||||
search: {
|
||||
type: 'select',
|
||||
options: [
|
||||
{ label: '禁用', value: 'notActive' },
|
||||
{ label: '离线', value: 'offline' },
|
||||
{ label: '在线', value: 'online' }
|
||||
]
|
||||
}
|
||||
// filterMultiple: false,
|
||||
}
|
||||
]
|
||||
|
||||
const handleSearch = (e: any) => {
|
||||
params.value = e;
|
||||
};
|
||||
params.value = e
|
||||
}
|
||||
|
||||
const onSelectChange = (record: any) => {
|
||||
_selectedRowKeys.value = [record.id];
|
||||
};
|
||||
_selectedRowKeys.value = [record.id]
|
||||
}
|
||||
|
||||
const cancelSelect = () => {
|
||||
_selectedRowKeys.value = [];
|
||||
};
|
||||
_selectedRowKeys.value = []
|
||||
}
|
||||
|
||||
const handleOk = () => {
|
||||
btnLoading.value = true;
|
||||
bind(props.cardId, _selectedRowKeys.value[0])
|
||||
.then((resp: any) => {
|
||||
if (resp.status === 200) {
|
||||
message.success('操作成功')
|
||||
emit('change', true);
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
btnLoading.value = false;
|
||||
});
|
||||
};
|
||||
btnLoading.value = true
|
||||
bind(props.cardId, _selectedRowKeys.value[0])
|
||||
.then((resp: any) => {
|
||||
if (resp.status === 200) {
|
||||
message.success('操作成功')
|
||||
emit('change', true)
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
btnLoading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
const handleCancel = () => {
|
||||
emit('change', false);
|
||||
};
|
||||
emit('change', false)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
||||
<style scoped lang='less'></style>
|
||||
|
|
|
|||
|
|
@ -3700,8 +3700,8 @@ jetlinks-store@^0.0.3:
|
|||
|
||||
jetlinks-ui-components@^1.0.5:
|
||||
version "1.0.5"
|
||||
resolved "http://47.108.170.157:9013/jetlinks-ui-components/-/jetlinks-ui-components-1.0.5.tgz#531a7cd5cc4069dc299f0efcc92411a4eee369e7"
|
||||
integrity sha512-7VHsz5lVG9PlFkHoJvEown4QARuVuasR+jDa9NNQ+pJSHAtHAeiIO1bpVTQKfE5WCyhCKPnN8yIerJLLzmQ1fA==
|
||||
resolved "http://47.108.170.157:9013/jetlinks-ui-components/-/jetlinks-ui-components-1.0.5.tgz#031a300df4df31a353d738cacee8b4ff630ae2d0"
|
||||
integrity sha512-SfucQ7LzlE13VdyZsDhrhzwF9Le/NOke5F6UY3bNN1OJiRD/bZMJecGQxWBQGv567lKcV60SOPCMT8ExiZxUgw==
|
||||
dependencies:
|
||||
"@vueuse/core" "^9.12.0"
|
||||
ant-design-vue "^3.2.15"
|
||||
|
|
|
|||
Loading…
Reference in New Issue