89 lines
2.1 KiB
Vue
89 lines
2.1 KiB
Vue
|
<script setup lang="ts">
|
|||
|
|
import { ref } from 'vue';
|
|||
|
|
|
|||
|
|
import { useVbenModal } from '@vben/common-ui';
|
|||
|
|
|
|||
|
|
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
|||
|
|
import { postDeviceThingModelManagementCommandPageAsync } from '#/api-client';
|
|||
|
|
import { $t } from '#/locales';
|
|||
|
|
|
|||
|
|
defineOptions({
|
|||
|
|
name: 'DeviceThingModelCommandModal',
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const deviceThingModelId = ref<string>('');
|
|||
|
|
const deviceModelName = ref<string>('');
|
|||
|
|
|
|||
|
|
const [Grid, gridApi] = useVbenVxeGrid({
|
|||
|
|
formOptions: {
|
|||
|
|
schema: [],
|
|||
|
|
showDefaultActions: false,
|
|||
|
|
},
|
|||
|
|
gridOptions: {
|
|||
|
|
columns: [
|
|||
|
|
{
|
|||
|
|
field: 'commandName',
|
|||
|
|
title: '指令名称',
|
|||
|
|
minWidth: 160,
|
|||
|
|
showOverflow: 'tooltip',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'identifier',
|
|||
|
|
title: '标识符',
|
|||
|
|
minWidth: 140,
|
|||
|
|
showOverflow: 'tooltip',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
field: 'action',
|
|||
|
|
title: $t('common.action'),
|
|||
|
|
width: 200,
|
|||
|
|
fixed: 'right',
|
|||
|
|
slots: { default: 'action' },
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
height: 400,
|
|||
|
|
pagerConfig: {},
|
|||
|
|
proxyConfig: {
|
|||
|
|
ajax: {
|
|||
|
|
query: async ({ page }) => {
|
|||
|
|
if (!deviceThingModelId.value) {
|
|||
|
|
return { items: [], totalCount: 0 };
|
|||
|
|
}
|
|||
|
|
const { data } = await postDeviceThingModelManagementCommandPageAsync({
|
|||
|
|
body: {
|
|||
|
|
pageIndex: page.currentPage,
|
|||
|
|
pageSize: page.pageSize,
|
|||
|
|
deviceThingModelId: deviceThingModelId.value,
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
return data || { items: [], totalCount: 0 };
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
const [Modal, modalApi] = useVbenModal({
|
|||
|
|
onOpenChange(isOpen: boolean) {
|
|||
|
|
if (isOpen) {
|
|||
|
|
const data = modalApi.getData<Record<string, any>>();
|
|||
|
|
deviceThingModelId.value = data?.deviceThingModelId || '';
|
|||
|
|
deviceModelName.value = data?.deviceModelName || '';
|
|||
|
|
if (gridApi && gridApi.reload) {
|
|||
|
|
gridApi.reload();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<Modal :title="`指令管理 - ${deviceModelName || ''}`" class="w-[900px]">
|
|||
|
|
<Grid>
|
|||
|
|
<!-- 这里后续可以加 toolbar-actions：新增指令、编辑、删除等 -->
|
|||
|
|
</Grid>
|
|||
|
|
</Modal>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
|