feat: 完成任务中心立即实行实现

+import { DeviceRecord } from '../device/model/deviceModel';
 import {
   AddDataBoardParams,
   AddDataComponentParams,
@@ -183,7 +184,7 @@ export const getAllDeviceByOrg = (organizationId: string, deviceProfileId?: stri
  * @returns
  */
 export const getMeetTheConditionsDevice = (params: GetMeetTheConditionsDeviceParams) => {
-  return defHttp.get({
+  return defHttp.get<DeviceRecord[]>({
     url: DeviceUrl.GET_DEVICE,
     params,
   });

@@ -40,6 +40,11 @@ enum DeviceManagerApi {
   DEVICE_PUBLIC = '/customer/public/device',
 
   DEVICE_PRIVATE = '/customer/device',
+
+  /**
+   * @description 通过设备列表获取设备信息
+   */
+  QUERY_DEVICES = '/device/get/devices',
 }
 
 export const devicePage = (params: DeviceQueryParam) => {
@@ -330,3 +335,10 @@ export const privateDevice = (tbDeviceId: string) => {
     { joinPrefix: false }
   );
 };
+
+export const getDevicesByDeviceIds = (ids: string[]) => {
+  return defHttp.post<Record<'data', DeviceModel[]>>({
+    url: DeviceManagerApi.QUERY_DEVICES,
+    data: ids,
+  });
+};

@@ -2,6 +2,7 @@ import {
   CreateTaskRecordType,
   GenModbusCommandType,
   GetTaskListParamsType,
+  ImmediateExecuteTaskType,
   TaskRecordType,
 } from './model';
 import { PaginationResult } from '/#/axios';
@@ -16,6 +17,8 @@ enum Api {
   CANCEL_TASK = '/task_center',
 
   GEN_MODBUS_COMMAND = '/js/modbus',
+
+  IMMEDIATE_EXECUTE = '/task_center/immediate/execute',
 }
 
 export const getTaskCenterList = (params: GetTaskListParamsType) => {
@@ -76,3 +79,13 @@ export const genModbusCommand = (data: GenModbusCommandType) => {
     data,
   });
 };
+
+export const immediateExecute = (data: ImmediateExecuteTaskType) => {
+  return defHttp.post<Record<'data', boolean>>(
+    {
+      url: Api.IMMEDIATE_EXECUTE,
+      params: data,
+    },
+    { joinParamsToUrl: true }
+  );
+};

@@ -62,3 +62,11 @@ export interface GenModbusCommandType {
   registerNum?: number;
   registerValues?: number[];
 }
+
+export interface ImmediateExecuteTaskType {
+  executeTarget: TaskTargetEnum;
+  id: string;
+  cronExpression: string;
+  targetIds: string[];
+  name: string;
+}

@@ -124,6 +124,7 @@ export type ComponentType =
   | 'TransferTableModal'
   | 'ObjectModelValidateForm'
   | 'DevicePicker'
+  | 'ProductPicker'
   | 'PollCommandInput'
   | 'RegisterAddressInput'
   | 'ControlGroup';

@@ -9,13 +9,13 @@ import {
 import { PollCommandInput, ModeEnum } from '../PollCommandInput';
 import { DeviceProfileModel } from '/@/api/device/model/deviceModel';
 import { TransportTypeEnum } from '/@/views/device/profiles/components/TransportDescript/const';
-import { getDeviceProfile } from '/@/api/alarm/position';
 import { JSONEditorValidator } from '/@/components/CodeEditor/src/JSONEditor';
 import { TimeUnitEnum, TimeUnitNameEnum } from '/@/enums/toolEnum';
-import { createPickerSearch } from '/@/utils/pickerSearch';
 import { dateUtil } from '/@/utils/dateUtil';
+import { ProductPicker, validateProductPicker } from '../ProductPicker';
 
 useComponentRegister('DevicePicker', DevicePicker);
+useComponentRegister('ProductPicker', ProductPicker);
 useComponentRegister('PollCommandInput', PollCommandInput);
 
 export enum FormFieldsEnum {
@@ -108,27 +108,26 @@ export const formSchemas: FormSchema[] = [
   },
   {
     field: FormFieldsEnum.DEVICE_PROFILE,
-    component: 'ApiSelect',
+    component: 'ProductPicker',
     label: '产品',
     ifShow: ({ model }) => model[FormFieldsEnum.TARGET_TYPE] === TaskTargetEnum.PRODUCTS,
+    valueField: 'value',
+    changeEvent: 'update:value',
+    rules: [validateProductPicker()],
+    helpMessage: ['任务可以对目标产品按预设的时间策略执行任务。'],
     componentProps: ({ formActionType }) => {
       const { setFieldsValue } = formActionType;
       return {
-        api: getDeviceProfile,
-        placeholder: '请选择产品',
-        labelField: 'name',
-        valueField: 'id',
-        onChange(value: string, option: DeviceProfileModel) {
-          if (value) {
-            const isTCP = option.transportType === TransportTypeEnum.TCP;
+        onChange(key: string, _value: string | string[], option: DeviceProfileModel) {
+          if (key === DeviceCascadePickerFieldsEnum.DEVICE_PROFILE) {
+            const isTCP = (option || {}).transportType === TransportTypeEnum.TCP;
             setFieldsValue({
-              [FormFieldsEnum.TRANSPORT_TYPE]: isTCP ? PushWayEnum.TCP : PushWayEnum.MQTT,
+              [FormFieldsEnum.TRANSPORT_TYPE]: _value ? option.transportType : null,
               [FormFieldsEnum.PUSH_WAY]: isTCP ? PushWayEnum.TCP : PushWayEnum.MQTT,
               ...(isTCP ? {} : { [FormFieldsEnum.EXECUTE_CONTENT_TYPE]: TaskTypeEnum.CUSTOM }),
             });
           }
         },
-        ...createPickerSearch(),
         getPopupContainer: () => document.body,
       };
     },

@@ -5,9 +5,11 @@ import { CreateTaskRecordType, TaskRecordType } from '/@/api/task/model';
 import { DeviceCascadePickerValueType } from '../DevicePicker';
 import { TaskTargetEnum } from '../../config';
 import { TimeUnitEnum } from '/@/enums/toolEnum';
+import { ProductCascadePickerValueType } from '../ProductPicker';
 
 export interface FormValueType extends Partial<Record<FormFieldsEnum, any>> {
   [FormFieldsEnum.EXECUTE_TARGET_DATA]: DeviceCascadePickerValueType;
+  [FormFieldsEnum.DEVICE_PROFILE]: ProductCascadePickerValueType;
 }
 
 type CanWrite<T> = {
@@ -95,6 +97,12 @@ export const composeData = (result: Required<FormValueType>): CreateTaskRecordTy
 
   const { organizationId, deviceType, deviceId, deviceProfileId } = executeTargetData || {};
 
+  const {
+    organizationId: productOrg,
+    deviceProfileId: productId,
+    deviceType: productDeviceType,
+  } = deviceProfile || {};
+
   const { expression } = genCronExpression(time, period);
 
   const cron =
@@ -111,10 +119,10 @@ export const composeData = (result: Required<FormValueType>): CreateTaskRecordTy
       type: executeContentType,
     },
     executeTarget: {
-      data: targetType === TaskTargetEnum.PRODUCTS ? [deviceProfile] : (deviceId as string[]),
-      deviceType,
-      organizationId,
-      deviceProfileId: targetType === TaskTargetEnum.PRODUCTS ? deviceProfile : deviceProfileId,
+      data: targetType === TaskTargetEnum.PRODUCTS ? [productId] : (deviceId as string[]),
+      deviceType: targetType === TaskTargetEnum.PRODUCTS ? productDeviceType : deviceType,
+      organizationId: targetType === TaskTargetEnum.PRODUCTS ? productOrg : organizationId,
+      deviceProfileId: targetType === TaskTargetEnum.PRODUCTS ? productId : deviceProfileId,
     },
     executeTime: {
       type: executeTimeType,
@@ -147,7 +155,14 @@ export const parseData = (result: TaskRecordType): Required<FormValueType> => {
       deviceType,
       organizationId,
     },
-    deviceProfile: targetType === TaskTargetEnum.PRODUCTS ? data : null,
+    deviceProfile:
+      targetType === TaskTargetEnum.PRODUCTS
+        ? {
+            deviceProfileId: data[0],
+            deviceType,
+            organizationId,
+          }
+        : ({} as unknown as ProductCascadePickerValueType),
     executeTimeType,
     period,
     periodType: executeTimeType === ExecuteTimeTypeEnum.CUSTOM ? periodType : null,

+export { default as ProductPicker } from './index.vue';
+
+export enum FormFieldsEnum {
+  DEVICE_TYPE = 'deviceType',
+  DEVICE_PROFILE = 'deviceProfileId',
+  ORGANIZATION = 'organizationId',
+}
+
+export type ProductCascadePickerValueType = Record<FormFieldsEnum, string>;
+
+export { validateProductPicker } from './utils';

+<script lang="ts" setup>
+  import { getOrganizationList } from '/@/api/system/system';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { copyTransFun } from '/@/utils/fnUtils';
+  import { watch } from 'vue';
+  import { nextTick } from 'vue';
+  import { getDeviceProfile } from '/@/api/alarm/position';
+  import { findDictItemByCode } from '/@/api/system/dict';
+  import { DictEnum } from '/@/enums/dictEnum';
+  import { FormFieldsEnum } from '.';
+  import { isObject } from '/@/utils/is';
+  import { createPickerSearch } from '/@/utils/pickerSearch';
+
+  const props = withDefaults(
+    defineProps<{
+      value?: Recordable;
+    }>(),
+    {
+      value: () => ({}),
+    }
+  );
+
+  const emit = defineEmits(['update:value', 'change']);
+
+  const handleChange = (key: string, value: string | string[], option: Recordable) => {
+    emit('change', key, value, option);
+  };
+
+  const handleEmit = async (key: string, value: string | string[], option: Recordable) => {
+    await nextTick();
+    let _value = getFieldsValue();
+    _value = {
+      ..._value,
+
+      ...(key === FormFieldsEnum.DEVICE_TYPE
+        ? {
+            [FormFieldsEnum.DEVICE_PROFILE]: null,
+          }
+        : {}),
+    };
+    handleChange(key, value, option);
+    emit('update:value', { ..._value });
+  };
+
+  const [register, { setFieldsValue, getFieldsValue, resetFields }] = useForm({
+    schemas: [
+      {
+        field: FormFieldsEnum.DEVICE_TYPE,
+        component: 'ApiSelect',
+        label: '',
+        componentProps: () => {
+          return {
+            api: findDictItemByCode,
+            params: {
+              dictCode: DictEnum.DEVICE_TYPE,
+            },
+            labelField: 'itemText',
+            valueField: 'itemValue',
+            placeholder: '请选择设备类型',
+            onChange(value: string, option: Recordable) {
+              handleEmit(FormFieldsEnum.DEVICE_TYPE, value, option);
+            },
+            getPopupContainer: () => document.body,
+            ...createPickerSearch(),
+          };
+        },
+      },
+      {
+        field: FormFieldsEnum.ORGANIZATION,
+        component: 'ApiTreeSelect',
+        label: '',
+        componentProps: () => {
+          return {
+            api: async () => {
+              try {
+                const data = await getOrganizationList();
+                copyTransFun(data as any);
+                return data;
+              } catch (error) {
+                console.log(error);
+                return [];
+              }
+            },
+            placeholder: '请选择组织',
+            labelField: 'name',
+            valueField: 'id',
+            childField: 'children',
+            onChange(value: string, option: Recordable) {
+              handleEmit(FormFieldsEnum.ORGANIZATION, value, option);
+            },
+            getPopupContainer: () => document.body,
+          };
+        },
+      },
+      {
+        field: FormFieldsEnum.DEVICE_PROFILE,
+        component: 'ApiSelect',
+        label: '',
+        componentProps: ({ formModel }) => {
+          const deviceType = Reflect.get(formModel, FormFieldsEnum.DEVICE_TYPE);
+          return {
+            api: async () => {
+              try {
+                return await getDeviceProfile(deviceType);
+              } catch (error) {
+                return [];
+              }
+            },
+            placeholder: '请选择产品',
+            labelField: 'name',
+            valueField: 'id',
+            onChange(value: string, options: Recordable) {
+              handleEmit(FormFieldsEnum.DEVICE_PROFILE, value, options);
+            },
+            getPopupContainer: () => document.body,
+            ...createPickerSearch(),
+          };
+        },
+      },
+    ],
+    showActionButtonGroup: false,
+    layout: 'inline',
+    baseColProps: { span: 8 },
+  });
+
+  const setValue = async () => {
+    await nextTick();
+    if (!props.value || (isObject(props.value) && !Object.values(props.value).length)) {
+      resetFields();
+      return;
+    }
+    setFieldsValue(props.value);
+  };
+
+  watch(
+    () => props.value,
+    () => {
+      setValue();
+    },
+    {
+      immediate: true,
+    }
+  );
+</script>
+
+<template>
+  <BasicForm @register="register" class="device-picker" />
+</template>
+
+<style lang="less" scoped>
+  .device-picker {
+    :deep(.ant-row) {
+      width: 100%;
+    }
+
+    :deep(.ant-form-item-control-input-content) {
+      div > div {
+        width: 100%;
+      }
+    }
+  }
+</style>

+import { FormFieldsEnum } from '.';
+import { Rule } from '/@/components/Form';
+
+export const validateProductPicker = () => {
+  return {
+    required: true,
+    validateTrigger: 'blur',
+    validator(_rule: Recordable, value: Recordable, _callback: Fn) {
+      const product = Reflect.get(value || {}, FormFieldsEnum.DEVICE_PROFILE);
+      const org = Reflect.get(value || {}, FormFieldsEnum.ORGANIZATION);
+      if (!product) return Promise.reject('请选择产品');
+      if (!org) return Promise.reject('请选择组织');
+      return Promise.resolve();
+    },
+  } as Rule;
+};

 import { TaskTargetEnum } from '../../config';
+import { getMeetTheConditionsDevice } from '/@/api/dataBoard';
+import { getDevicesByDeviceIds } from '/@/api/device/deviceManager';
+import { TaskRecordType } from '/@/api/task/model';
 import { FormSchema } from '/@/components/Form';
+import { createPickerSearch } from '/@/utils/pickerSearch';
+
+export interface FormValue extends Record<FormFieldsEnum, any> {
+  [FormFieldsEnum.TASK_RECORD]: string;
+}
 
 export enum FormFieldsEnum {
-  RUN_TARGET_TYPE = 'runTargetType',
+  EXECUTE_TARGET_TYPE = 'executeTarget',
   TASK_TYPE = 'taskType',
-  ASSIGN_TARGET = 'assignTarget',
-  TASK_TARGET_TYPE = 'taskTargetType',
-  TASK_TARGET_VALUE = 'taskTargetValue',
+  TARGET_IDS = 'targetIds',
+  TASK_RECORD = 'taskRecord',
 }
 
 export enum TargetType {
@@ -33,26 +40,13 @@ export const formSchemas: FormSchema[] = [
     slot: 'taskType',
   },
   {
-    field: FormFieldsEnum.TASK_TARGET_TYPE,
-    component: 'Input',
-    label: '目标类型',
-    show: false,
-  },
-  {
-    field: FormFieldsEnum.TASK_TARGET_VALUE,
+    field: FormFieldsEnum.TASK_RECORD,
     component: 'Input',
-    label: '目标值',
-    show: false,
-  },
-  {
-    field: FormFieldsEnum.TASK_TYPE,
-    component: 'Input',
-    label: '任务类型',
-    renderComponentContent: 'taskType',
+    label: '任务详情',
     show: false,
   },
   {
-    field: FormFieldsEnum.RUN_TARGET_TYPE,
+    field: FormFieldsEnum.EXECUTE_TARGET_TYPE,
     component: 'RadioGroup',
     label: '选择目标类型',
     helpMessage: [
@@ -67,23 +61,36 @@ export const formSchemas: FormSchema[] = [
     },
   },
   {
-    field: FormFieldsEnum.ASSIGN_TARGET,
+    field: FormFieldsEnum.TARGET_IDS,
     component: 'ApiSelect',
     label: '制定目标设备',
-    ifShow: ({ model }) => model[FormFieldsEnum.RUN_TARGET_TYPE] === TargetType.ASSIGN,
+    ifShow: ({ model }) => model[FormFieldsEnum.EXECUTE_TARGET_TYPE] === TargetType.ASSIGN,
     componentProps: ({ formModel }) => {
-      const taskTargetType = formModel[FormFieldsEnum.TASK_TARGET_TYPE];
-      const isDevices = taskTargetType === TaskTargetEnum.DEVICES;
+      const record = JSON.parse(formModel[FormFieldsEnum.TASK_RECORD]) as TaskRecordType;
+      const isDevices = record.targetType === TaskTargetEnum.DEVICES;
+      const { executeTarget } = record;
+      const { organizationId, data } = executeTarget;
       return {
         api: async () => {
           try {
             if (isDevices) {
+              const result = await getDevicesByDeviceIds(data!);
+              return result.data;
             } else {
+              return await getMeetTheConditionsDevice({
+                organizationId,
+                deviceProfileId: data![0],
+              });
             }
           } catch (error) {
             return [];
           }
         },
+        mode: 'multiple',
+        labelField: 'name',
+        valueField: 'tbDeviceId',
+        ...createPickerSearch(),
+        placeholder: '请选择设备',
         getPopupContainer: () => document.body,
       };
     },

 <script lang="ts" setup>
   import { ref } from 'vue';
-  import { TaskRecordType } from '/@/api/task/model';
+  import { ImmediateExecuteTaskType, TaskRecordType } from '/@/api/task/model';
   import { BasicForm, useForm } from '/@/components/Form';
   import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { TaskTypeNameEnum } from '../../config';
-  import { formSchemas } from './config';
+  import { TaskTargetEnum, TaskTypeNameEnum } from '../../config';
+  import { FormValue, TargetType, formSchemas } from './config';
+  import { unref } from 'vue';
+  import { immediateExecute } from '/@/api/task';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  const props = defineProps<{
+    reload: Fn;
+  }>();
 
   defineEmits(['register']);
 
   const dataSource = ref<TaskRecordType>();
 
-  const [registerModal] = useModalInner((record: TaskRecordType) => {
+  const [registerModal, { closeModal }] = useModalInner((record: TaskRecordType) => {
+    resetFields();
     dataSource.value = record;
     if (record) {
-      setFieldsValue(record);
+      setFieldsValue({ taskRecord: JSON.stringify(record) } as FormValue);
     }
   });
 
-  const [registerForm, { setFieldsValue }] = useForm({
+  const [registerForm, { setFieldsValue, getFieldsValue, resetFields }] = useForm({
     schemas: formSchemas,
     showActionButtonGroup: false,
   });
+
+  const composeData = (record: FormValue): ImmediateExecuteTaskType => {
+    const { executeTarget, targetIds } = record;
+    return {
+      executeTarget:
+        executeTarget === TargetType.ASSIGN
+          ? TaskTargetEnum.DEVICES
+          : unref(dataSource)!.targetType,
+      id: unref(dataSource)!.id,
+      targetIds,
+      cronExpression: unref(dataSource)!.executeTime.cron,
+      name: unref(dataSource)!.name,
+    };
+  };
+
+  const loading = ref(false);
+  const { createMessage } = useMessage();
+  const handleOk = async () => {
+    const record = getFieldsValue() as FormValue;
+    const value = composeData(record);
+    try {
+      loading.value = true;
+      const { data } = await immediateExecute(value);
+      data ? createMessage.success('运行成功') : createMessage.error('运行失败');
+      if (data) {
+        closeModal();
+        props.reload?.();
+      }
+    } catch (error) {
+      throw error;
+    } finally {
+      loading.value = false;
+    }
+  };
 </script>
 
 <template>
-  <BasicModal @register="registerModal" title="运行任务">
+  <BasicModal
+    @register="registerModal"
+    title="运行任务"
+    :okButtonProps="{ loading }"
+    @ok="handleOk"
+  >
     <BasicForm @register="registerForm">
       <template #taskName>
         <div class="font-semibold">

@@ -100,7 +100,7 @@
     <section
       class="bg-light-50 flex p-4 justify-between items-center x dark:text-gray-300 dark:bg-dark-900"
     >
-      <div class="text-2xl">任务</div>
+      <div class="text-2xl">任务中心</div>
       <Authority :value="PermissionEnum.CREATE">
         <Button
           type="primary"
@@ -143,7 +143,7 @@
       </List>
     </section>
     <DetailModal @register="registerModal" :reload="reload" />
-    <RunTaskModal @register="registerRunTaskModal" />
+    <RunTaskModal :reload="reload" @register="registerRunTaskModal" />
   </PageWrapper>
 </template>