perf: 设备命令下发放入命令下发记录中

@@ -719,9 +719,6 @@ export const CommandSchemas = (transportType: TransportTypeEnum): FormSchema[] =
       field: 'commandType',
       component: 'RadioGroup',
       label: '下发类型',
-      colProps: {
-        span: 8,
-      },
       defaultValue: 'OneWay',
       componentProps: {
         options: [

@@ -25,9 +25,9 @@
       <TabPane key="7" tab="历史数据" v-if="deviceDetail?.deviceType !== 'GATEWAY'">
         <HistoryData :deviceDetail="deviceDetail" />
       </TabPane> -->
-      <TabPane key="5" tab="命令下发" v-if="deviceDetail?.deviceType !== 'SENSOR'">
+      <!-- <TabPane key="5" tab="命令下发" v-if="deviceDetail?.deviceType !== 'SENSOR'">
         <CommandIssuance :deviceDetail="deviceDetail" />
-      </TabPane>
+      </TabPane> -->
       <TabPane key="3" tab="告警"><Alarm :id="deviceDetail.id" /></TabPane>
       <TabPane key="4" tab="子设备" v-if="deviceDetail?.deviceType === 'GATEWAY'">
         <ChildDevice
@@ -36,7 +36,7 @@
         />
       </TabPane>
       <TabPane key="7" tab="命令下发记录">
-        <CommandRecord :fromId="deviceDetail?.tbDeviceId" />
+        <CommandRecord :deviceDetail="deviceDetail" :fromId="deviceDetail?.tbDeviceId" />
       </TabPane>
       <!-- 网关设备并且场家是TBox -->
       <TabPane
@@ -67,7 +67,6 @@
   import Alarm from '../tabs/Alarm.vue';
   import ChildDevice from '../tabs/ChildDevice.vue';
   import TBoxDetail from '../tabs/TBoxDetail.vue';
-  import CommandIssuance from '../tabs/CommandIssuance.vue';
   import { CommandRecord } from '../tabs/commandRecord/index';
   import { getDeviceDetail } from '/@/api/device/deviceManager';
   // import HistoryData from '../tabs/HistoryData.vue';
@@ -86,7 +85,6 @@
       // RealTimeData,
       Alarm,
       ChildDevice,
-      CommandIssuance,
       TBoxDetail,
       // HistoryData,
       ModelOfMatter,

@@ -12,10 +12,10 @@
           </div>
         </template>
       </BasicForm>
-      <div>
+      <Space class="w-full justify-end" justify="end">
         <Button :disabled="disable" type="primary" @click="handleOk" class="mr-2">确定</Button>
         <Button type="default" @click="handleCancel" class="mr-2">重置</Button>
-      </div>
+      </Space>
     </div>
   </div>
 </template>
@@ -29,7 +29,7 @@
   import jsoneditor from 'jsoneditor';
   import 'jsoneditor/dist/jsoneditor.min.css';
   import { QuestionCircleOutlined } from '@ant-design/icons-vue';
-  import { Tooltip } from 'ant-design-vue';
+  import { Space, Tooltip } from 'ant-design-vue';
   import { DeviceRecord } from '/@/api/device/model/deviceModel';
   import { TransportTypeEnum } from '../../../profiles/components/TransportDescript/const';
 
@@ -42,7 +42,7 @@
   }
 
   export default defineComponent({
-    components: { BasicForm, Button, QuestionCircleOutlined, Tooltip },
+    components: { BasicForm, Button, QuestionCircleOutlined, Tooltip, Space },
     props: {
       deviceDetail: {
         type: Object as PropType<DeviceRecord>,
@@ -56,7 +56,7 @@
       const disable = ref(false);
 
       const [registerForm, { getFieldsValue, validate, resetFields }] = useForm({
-        labelWidth: 100,
+        labelWidth: 120,
         schemas: CommandSchemas(
           props.deviceDetail.deviceProfile.transportType as TransportTypeEnum
         ),

 <template>
   <BasicTable class="command-record-table" @register="registerTable">
+    <template #toolbar>
+      <Space>
+        <Button type="primary" @click="openModal(true)">命令下发</Button>
+      </Space>
+    </template>
     <template #recordContent="{ record }">
-      <a-button type="link" class="ml-2" @click="handleRecordContent(record)"> 查看 </a-button>
+      <Button type="link" class="ml-2" @click="handleRecordContent(record)"> 查看 </Button>
     </template>
     <template #responseContent="{ record }">
       <div v-if="!record.request?.oneway">
-        <a-button v-if="record?.response === null" type="text" class="ml-2"> 未响应 </a-button>
-        <a-button v-else type="link" class="ml-2" @click="handleRecordResponseContent(record)">
+        <Button v-if="record?.response === null" type="text" class="ml-2"> 未响应 </Button>
+        <Button v-else type="link" class="ml-2" @click="handleRecordResponseContent(record)">
           查看
-        </a-button>
+        </Button>
       </div>
       <div v-else>--</div>
     </template>
   </BasicTable>
+
+  <BasicModal
+    @register="registerCommandIssuanceModal"
+    width="600px"
+    title="命令下发"
+    :showOkBtn="false"
+    cancelText="关闭"
+    footer=""
+  >
+    <CommandIssuance :deviceDetail="deviceDetail" />
+  </BasicModal>
 </template>
 <script lang="ts" setup>
   import { h } from 'vue';
   import { configColumns, searchFormSchema } from './config';
   import { deviceCommandRecordGetQuery } from '/@/api/device/deviceConfigApi';
   import { BasicTable, useTable } from '/@/components/Table';
-  import { Modal } from 'ant-design-vue';
+  import { Button, Modal, Space } from 'ant-design-vue';
   import { JsonPreview } from '/@/components/CodeEditor';
+  import { DeviceRecord } from '/@/api/device/model/deviceModel';
+  import { BasicModal, useModal } from '/@/components/Modal';
+  import CommandIssuance from '../CommandIssuance.vue';
 
   const props = defineProps({
     fromId: {
       type: String,
       default: '',
     },
+    deviceDetail: {
+      type: Object as PropType<DeviceRecord>,
+      required: true,
+    },
   });
+
+  const [registerCommandIssuanceModal, { openModal }] = useModal();
+
   const [registerTable] = useTable({
     api: deviceCommandRecordGetQuery,
     columns: configColumns,