feat: 完成任务中心modbus指令生成&&设备详情任务是否允许任务执行

@@ -14,9 +14,9 @@ VITE_GLOB_PUBLIC_PATH = /
 # VITE_PROXY = [["/api","http://101.133.234.90:8080/api"]]
 # 线上测试环境
 # VITE_PROXY = [["/api","http://localhost:8080/api"],["/thingskit-drawio","http://localhost:3000/"]]
-VITE_PROXY = [["/api","http://222.180.200.114:48080/api"],["/thingskit-drawio","http://localhost:3000/"],["/large-designer", "http://localhost:5555/large-designer/"]]
+# VITE_PROXY = [["/api","http://222.180.200.114:48080/api"],["/thingskit-drawio","http://localhost:3000/"],["/large-designer", "http://localhost:5555/large-designer/"]]
 # VITE_PROXY = [["/api","http://121.37.251.8:8080/api"],["/thingskit-drawio","http://localhost:3000/"]]
-# VITE_PROXY = [["/api","http://192.168.10.125:8080/api"],["/thingskit-drawio","http://192.168.10.125:8080/api"]]
+VITE_PROXY = [["/api","http://192.168.10.114:8080/api"],["/thingskit-drawio","http://192.168.10.125:8080/api"]]
 
 # 实时数据的ws地址
 # VITE_WEB_SOCKET = ws://localhost:8080/api/ws/plugins/telemetry?token=

-import { CreateTaskRecordType, GetTaskListParamsType, TaskRecordType } from './model';
+import {
+  CreateTaskRecordType,
+  GenModbusCommandType,
+  GetTaskListParamsType,
+  TaskRecordType,
+} from './model';
 import { PaginationResult } from '/#/axios';
 import { defHttp } from '/@/utils/http/axios';
 
@@ -9,6 +14,8 @@ enum Api {
   DELETE_TASK = '/task_center',
   UPDATE_TASK = '/task_center/update',
   CANCEL_TASK = '/task_center',
+
+  GEN_MODBUS_COMMAND = '/js/modbus',
 }
 
 export const getTaskCenterList = (params: GetTaskListParamsType) => {
@@ -45,8 +52,27 @@ export const updateTask = (data: CreateTaskRecordType & Record<'id', string>) =>
   });
 };
 
-export const cancelTask = (data: Record<'id' | 'tbDeviceId', string>) => {
+/**
+ * @description 取消任务
+ * @param data
+ * @returns
+ */
+export const cancelTask = (
+  data: Record<'id' | 'tbDeviceId', string> & Record<'allow', boolean>
+) => {
   return defHttp.put({
-    url: `${Api.CANCEL_TASK}/${data.id}/cancel/${data.tbDeviceId}`,
+    url: `${Api.CANCEL_TASK}/${data.id}/update/${data.tbDeviceId}/${data.allow}`,
+  });
+};
+
+/**
+ * @description 生成modbus指令
+ * @param data
+ * @returns {string}
+ */
+export const genModbusCommand = (data: GenModbusCommandType) => {
+  return defHttp.post<string>({
+    url: Api.GEN_MODBUS_COMMAND,
+    data,
   });
 };

@@ -3,13 +3,14 @@ import {
   ExecuteTimeTypeEnum,
   PeriodTypeEnum,
   PushWayEnum,
-} from '/@/views/task/center/components/CreateModal/config';
+} from '/@/views/task/center/components/DetailModal/config';
 import { TaskTypeEnum } from '/@/views/task/center/config';
 
 export interface GetTaskListParamsType {
   page: number;
   pageSize: number;
   state?: string;
+  tbDeviceId?: string;
 }
 
 export interface CreateTaskRecordType {
@@ -45,4 +46,19 @@ export interface TaskRecordType extends CreateTaskRecordType {
   creator: string;
   enabled: boolean;
   state: number;
+  lastExecuteTime?: number;
+  tkDeviceTaskCenter?: {
+    allowState: number;
+    taskCenterId: string;
+    tbDeviceId: string;
+  };
+}
+
+export interface GenModbusCommandType {
+  crc: string;
+  deviceCode: string;
+  method: string;
+  registerAddr: string;
+  registerNum?: number;
+  registerValues?: number[];
 }

@@ -6,7 +6,6 @@
   import { onMounted } from 'vue';
   import { computed } from '@vue/reactivity';
   import { onUnmounted } from 'vue';
-  import { watch } from 'vue';
 
   enum EventEnum {
     UPDATE_VALUE = 'update:value',
@@ -64,15 +63,15 @@
     editoreRef.value = new JSONEditor(unref(jsonEditorElRef), unref(getOptions));
   };
 
-  watch(
-    () => props.value,
-    (target) => {
-      unref(editoreRef)?.setText(target || '');
-    },
-    {
-      immediate: true,
-    }
-  );
+  // watch(
+  //   () => props.value,
+  //   (target) => {
+  //     unref(editoreRef)?.setText(target || '');
+  //   },
+  //   {
+  //     immediate: true,
+  //   }
+  // );
 
   const get = (): string => {
     return unref(editoreRef)?.getText() || '';
@@ -84,6 +83,7 @@
 
   onMounted(() => {
     initialize();
+    unref(editoreRef)?.setText(props.value || '');
   });
 
   onUnmounted(() => {

@@ -11,7 +11,7 @@
   import { getBoundingClientRect } from '/@/utils/domUtils';
   import { TaskRecordType } from '/@/api/task/model';
 
-  defineProps<{
+  const props = defineProps<{
     tbDeviceId: string;
   }>();
 
@@ -48,6 +48,7 @@
       const { items } = await getTaskCenterList({
         page: pagination.current,
         pageSize: pagination.pageSize,
+        tbDeviceId: props.tbDeviceId,
         ...pagination.params,
       });
       dataSource.value = items;

@@ -13,6 +13,7 @@ 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';
 
 useComponentRegister('DevicePicker', DevicePicker);
 useComponentRegister('PollCommandInput', PollCommandInput);
@@ -64,9 +65,9 @@ export enum ExecuteTimeTypeNameEnum {
 }
 
 export enum PeriodTypeEnum {
-  MONTH,
-  WEEK,
-  DAY,
+  MONTH = 'MONTH',
+  WEEK = 'WEEK',
+  DAY = 'DAY',
 }
 
 export enum PeriodTypeNameEnum {
@@ -197,7 +198,7 @@ export const formSchemas: FormSchema[] = [
     field: FormFieldsEnum.PUSH_WAY,
     component: 'RadioGroup',
     label: '推送方式',
-    defaultValue: PushWayEnum.MQTT,
+    defaultValue: PushWayEnum.TCP,
     show: false,
     componentProps: {
       options: [
@@ -317,6 +318,7 @@ export const formSchemas: FormSchema[] = [
     componentProps: {
       getPopupContainer: () => document.body,
       valueFormat: 'HH:mm:ss',
+      defaultOpenValue: dateUtil('00:00:00', 'HH:mm:ss'),
     },
   },
   {

@@ -31,7 +31,6 @@
       resetFields();
       if (record && mode === DataActionModeEnum.UPDATE) {
         const res = parseData(record);
-        console.log({ record, res });
         setFieldsValue({ ...res });
       }
     }

@@ -6,8 +6,7 @@ import { DeviceCascadePickerValueType } from '../DevicePicker';
 import { TaskTargetEnum } from '../../config';
 import { TimeUnitEnum } from '/@/enums/toolEnum';
 
-export interface FormValueType
-  extends Partial<Record<Exclude<FormFieldsEnum, FormFieldsEnum.TRANSPORT_TYPE>, any>> {
+export interface FormValueType extends Partial<Record<FormFieldsEnum, any>> {
   [FormFieldsEnum.EXECUTE_TARGET_DATA]: DeviceCascadePickerValueType;
 }
 
@@ -106,7 +105,7 @@ export const composeData = (result: Required<FormValueType>): CreateTaskRecordTy
     targetType,
     executeContent: {
       pushContent: {
-        rpcCommand: pushWay === PushWayEnum.MQTT ? JSON.parse(rpcCommand) : pushWay,
+        rpcCommand: pushWay === PushWayEnum.MQTT ? JSON.parse(rpcCommand) : rpcCommand,
       },
       pushWay,
       type: executeContentType,
@@ -138,7 +137,8 @@ export const parseData = (result: TaskRecordType): Required<FormValueType> => {
   return {
     name,
     targetType,
-    rpcCommand: pushWay === PushWayEnum.MQTT ? JSON.stringify(rpcCommand) : rpcCommand,
+    rpcCommand: pushWay === PushWayEnum.MQTT ? JSON.stringify(rpcCommand, null, 2) : rpcCommand,
+    transportType: pushWay,
     pushWay,
     executeContentType,
     executeTargetData: {

 <script lang="ts" setup>
-  import { Button } from 'ant-design-vue';
+  import { Button, Spin } from 'ant-design-vue';
   import { BasicForm, useForm } from '/@/components/Form';
   import { BasicModal, useModal } from '/@/components/Modal';
   import { formSchemas } from './config';
   import { ref } from 'vue';
   import { unref } from 'vue';
+  import { composeModbusModalData } from './util';
+  import { ModbusCommandValueType } from './type';
+  import { genModbusCommand } from '/@/api/task';
 
   const emit = defineEmits(['update:value']);
 
@@ -19,9 +22,29 @@
 
   const commandValue = ref('');
 
+  const loading = ref(false);
   const handleGetValue = async () => {
-    const value = getFieldsValue();
-    console.log(value);
+    try {
+      const value = getFieldsValue();
+      const record = composeModbusModalData(value as ModbusCommandValueType);
+      loading.value = true;
+      const result = await genModbusCommand(record);
+      console.log(result);
+      commandValue.value = result;
+    } catch (error) {
+    } finally {
+      loading.value = false;
+    }
+  };
+
+  const formatCommand = (command: string, subNumber: number) => {
+    const list = command.split('');
+    let index = 0;
+    const arr: string[][] = [];
+    while (index <= list.length) {
+      arr.push(list.slice(index, (index += subNumber)));
+    }
+    return arr.reduce((prev, next) => `${prev} ${next.join('')}`, '');
   };
 
   const handleOk = () => {
@@ -30,13 +53,22 @@
 </script>
 
 <template>
-  <BasicModal @register="registerModal" title="配置操作" @ok="handleOk">
+  <BasicModal
+    @register="registerModal"
+    :okButtonProps="{ loading }"
+    title="配置操作"
+    @ok="handleOk"
+  >
     <BasicForm @register="registerForm" class="create-tcp-command-form" />
     <section>
       <Button @click="handleGetValue" type="link" class="!px-0">生成预览</Button>
-      <div v-if="commandValue">
+      <div>
         <div class="text-gray-400">Modbus 指令预览</div>
-        <code class="bg-dark-50 text-light-50 p-1 w-full block mt-1">{{ commandValue }}</code>
+        <Spin :spinning="loading" size="small">
+          <div class="bg-dark-50 text-light-50 p-1 w-full block mt-1 min-h-8">{{
+            formatCommand(commandValue, 2)
+          }}</div>
+        </Spin>
       </div>
     </section>
   </BasicModal>

 <script lang="ts" setup>
   import { InputGroup, InputNumber, Select, Input } from 'ant-design-vue';
-  import { watch } from 'vue';
   import { unref } from 'vue';
   import { computed } from 'vue';
   import { ref } from 'vue';
@@ -14,13 +13,13 @@
 
   const DEC_MAX_VALUE = parseInt('0xffff', 16);
 
-  const props = withDefaults(
+  withDefaults(
     defineProps<{
-      value?: string;
+      value?: number | string;
       inputProps?: Recordable;
     }>(),
     {
-      value: '0',
+      value: 0,
       inputProps: () => ({}),
     }
   );
@@ -44,23 +43,24 @@
     return (inputValue.value as number) > DEC_MAX_VALUE ? '0x0000' : formatValue;
   });
 
+  const toDEC = (value: number | string) => {
+    return unref(type) === AddressTypeEnum.DEC
+      ? isNaN(value as number)
+        ? 0
+        : Number(value)
+      : parseInt(value, 16);
+  };
+
   const handleEmit = () => {
-    const syncValue = unref(type) === AddressTypeEnum.DEC ? unref(getDecValue) : unref(getHexValue);
+    const syncValue = toDEC(unref(inputValue));
     emit('update:value', syncValue);
   };
 
   const handleChange = (value: AddressTypeEnum) => {
     const syncValue = value === AddressTypeEnum.DEC ? unref(getHexValue) : unref(getDecValue);
     inputValue.value = syncValue;
-    emit('update:value', syncValue);
+    emit('update:value', toDEC(syncValue));
   };
-
-  watch(
-    () => props.value,
-    (targetValue) => {
-      inputValue.value = targetValue || 0;
-    }
-  );
 </script>
 
 <template>
@@ -76,10 +76,10 @@
       v-model:value="inputValue"
       :step="1"
       class="flex-1"
-      @change="handleEmit"
       v-bind="inputProps"
+      @change="handleEmit"
     />
-    <Input v-if="type === AddressTypeEnum.HEX" v-model:value="inputValue" />
+    <Input v-if="type === AddressTypeEnum.HEX" v-model:value="inputValue" @change="handleEmit" />
     <div class="text-center h-8 leading-8 px-2 bg-gray-200 cursor-pointer rounded-1 w-20">
       <div v-if="type === AddressTypeEnum.DEC">{{ getDecValue }}</div>
       <div v-if="type === AddressTypeEnum.HEX">{{ getHexValue }}</div>

@@ -6,10 +6,14 @@ import { createPickerSearch } from '/@/utils/pickerSearch';
 import { ControlGroup } from '../ControlGroup';
 
 export enum FormFieldsEnum {
-  ADDRESS = 'address',
-  FUNCTION_CODE = 'functionCode',
-  START_REGISTER_ADDRESS = 'startRegisterAddress',
-  DATA_VALID = 'dataValid',
+  // 设备地址码
+  DEVICE_CODE = 'deviceCode',
+  // 功能码
+  METHOD = 'method',
+  // 寄存器地址
+  REGISTER_ADDR = 'registerAddr',
+  // 数据校验算法
+  CRC = 'crc',
   // 线圈个数
   COIL_NUMBER = 'coilNumber',
   // 寄存器个数
@@ -27,7 +31,7 @@ export enum FormFieldsEnum {
 useComponentRegister('RegisterAddressInput', RegisterAddressInput);
 useComponentRegister('ControlGroup', ControlGroup);
 
-enum FunctionCodeEnum {
+export enum FunctionCodeEnum {
   // 读取线圈状态01
   READ_COIL_STATE_01 = '01',
   // 读取输入状态02
@@ -46,35 +50,45 @@ enum FunctionCodeEnum {
   WRITE_MULTIPLE_KEEP_REGISTER_16 = '16',
 }
 
-const showCoilNumber = (value: FunctionCodeEnum) =>
+export enum CRCValidTypeEnum {
+  CRC_32_HIGH = 'CRC_32_HIGH',
+  CRC_32_LOWER = 'CRC_32_LOWER',
+  AND_TOTAL_XOR = 'AND_TOTAL_XOR',
+  TOTAL_AND_SUM = 'TOTAL_AND_SUM',
+  CRC_8 = 'CRC_8',
+  CRC_16_HIGH = 'CRC_16_HIGH',
+  CRC_16_LOWER = 'CRC_16_LOWER',
+}
+
+export const showCoilNumber = (value: FunctionCodeEnum) =>
   [
     FunctionCodeEnum.READ_COIL_STATE_01,
     FunctionCodeEnum.READ_INPUT_STATE_02,
     FunctionCodeEnum.WRITE_MULTIPLE_COIL_STATE_15,
   ].includes(value);
 
-const showRegisterNumber = (value: FunctionCodeEnum) =>
+export const showRegisterNumber = (value: FunctionCodeEnum) =>
   [
     FunctionCodeEnum.READ_KEEP_REGISTER_03,
     FunctionCodeEnum.READ_INPUT_REGISTER_04,
     FunctionCodeEnum.WRITE_MULTIPLE_KEEP_REGISTER_16,
   ].includes(value);
 
-const showCoilValue = (value: FunctionCodeEnum) =>
+export const showCoilValue = (value: FunctionCodeEnum) =>
   [FunctionCodeEnum.WRITE_SINGLE_COIL_REGISTER_05].includes(value);
 
-const showRegisterValue = (value: FunctionCodeEnum) =>
+export const showRegisterValue = (value: FunctionCodeEnum) =>
   [FunctionCodeEnum.WRITE_SINGLE_KEEP_COIL_REGISTER_06].includes(value);
 
-const isWriteCoilGroup = (value: FunctionCodeEnum) =>
+export const isWriteCoilGroup = (value: FunctionCodeEnum) =>
   [FunctionCodeEnum.WRITE_MULTIPLE_COIL_STATE_15].includes(value);
 
-const isWriteRegisterGroup = (value: FunctionCodeEnum) =>
+export const isWriteRegisterGroup = (value: FunctionCodeEnum) =>
   [FunctionCodeEnum.WRITE_MULTIPLE_KEEP_REGISTER_16].includes(value);
 
 export const formSchemas: FormSchema[] = [
   {
-    field: FormFieldsEnum.ADDRESS,
+    field: FormFieldsEnum.DEVICE_CODE,
     component: 'ApiSelect',
     label: '从机地址',
     rules: [{ required: true, message: '请选择从机地址' }],
@@ -103,7 +117,7 @@ export const formSchemas: FormSchema[] = [
     },
   },
   {
-    field: FormFieldsEnum.FUNCTION_CODE,
+    field: FormFieldsEnum.METHOD,
     component: 'ApiSelect',
     label: '功能码',
     defaultValue: '01',
@@ -121,18 +135,18 @@ export const formSchemas: FormSchema[] = [
     },
   },
   {
-    field: FormFieldsEnum.START_REGISTER_ADDRESS,
+    field: FormFieldsEnum.REGISTER_ADDR,
     label: '起始寄存器地址',
     component: 'RegisterAddressInput',
     valueField: 'value',
     changeEvent: 'update:value',
-    defaultValue: '0',
+    defaultValue: 0,
   },
   {
     field: FormFieldsEnum.REGISTER_NUMBER,
     label: '寄存器个数',
     component: 'InputNumber',
-    ifShow: ({ model }) => showRegisterNumber(model[FormFieldsEnum.FUNCTION_CODE]),
+    ifShow: ({ model }) => showRegisterNumber(model[FormFieldsEnum.METHOD]),
     defaultValue: 1,
     rules: [{ required: true, message: '请输入寄存器个数' }],
     componentProps: {
@@ -146,7 +160,7 @@ export const formSchemas: FormSchema[] = [
     field: FormFieldsEnum.COIL_NUMBER,
     label: '线圈个数',
     component: 'InputNumber',
-    ifShow: ({ model }) => showCoilNumber(model[FormFieldsEnum.FUNCTION_CODE]),
+    ifShow: ({ model }) => showCoilNumber(model[FormFieldsEnum.METHOD]),
     defaultValue: 1,
     rules: [{ required: true, message: '请输入线圈个数' }],
     componentProps: {
@@ -162,7 +176,7 @@ export const formSchemas: FormSchema[] = [
     component: 'RegisterAddressInput',
     valueField: 'value',
     changeEvent: 'update:value',
-    ifShow: ({ model }) => showCoilValue(model[FormFieldsEnum.FUNCTION_CODE]),
+    ifShow: ({ model }) => showCoilValue(model[FormFieldsEnum.METHOD]),
     defaultValue: '0',
     rules: [{ required: true, message: '请输入线圈值' }],
     componentProps: {
@@ -175,7 +189,7 @@ export const formSchemas: FormSchema[] = [
     component: 'RegisterAddressInput',
     valueField: 'value',
     changeEvent: 'update:value',
-    ifShow: ({ model }) => showRegisterValue(model[FormFieldsEnum.FUNCTION_CODE]),
+    ifShow: ({ model }) => showRegisterValue(model[FormFieldsEnum.METHOD]),
     defaultValue: '0',
     rules: [{ required: true, message: '请输入寄存器值' }],
     componentProps: {
@@ -189,7 +203,7 @@ export const formSchemas: FormSchema[] = [
     colProps: { span: 24 },
     valueField: 'value',
     changeEvent: 'update:value',
-    ifShow: ({ model }) => isWriteRegisterGroup(model[FormFieldsEnum.FUNCTION_CODE]),
+    ifShow: ({ model }) => isWriteRegisterGroup(model[FormFieldsEnum.METHOD]),
     componentProps: ({ formModel }) => {
       const length = formModel[FormFieldsEnum.REGISTER_NUMBER];
       return {
@@ -213,7 +227,7 @@ export const formSchemas: FormSchema[] = [
     colProps: { span: 24 },
     valueField: 'value',
     changeEvent: 'update:value',
-    ifShow: ({ model }) => isWriteCoilGroup(model[FormFieldsEnum.FUNCTION_CODE]),
+    ifShow: ({ model }) => isWriteCoilGroup(model[FormFieldsEnum.METHOD]),
     componentProps: ({ formModel }) => {
       const length = formModel[FormFieldsEnum.COIL_NUMBER];
       return {
@@ -235,11 +249,12 @@ export const formSchemas: FormSchema[] = [
     },
   },
   {
-    field: FormFieldsEnum.DATA_VALID,
+    field: FormFieldsEnum.CRC,
     label: '数据校验',
     component: 'ApiSelect',
     colProps: { span: 24 },
     rules: [{ required: true, message: '请选择数据校验方式' }],
+    defaultValue: CRCValidTypeEnum.CRC_16_LOWER,
     componentProps: () => {
       return {
         api: findDictItemByCode,

@@ -4,11 +4,10 @@
   import { SettingOutlined } from '@ant-design/icons-vue';
   import { ModeEnum } from './index';
   import { computed } from '@vue/reactivity';
-  import CreateTCPCommandModal from './CreateTCPCommandModal.vue';
+  import GenModbusCommandModal from './GenModbusCommandModal.vue';
   import { useModal } from '/@/components/Modal';
   import { ref } from 'vue';
   import { unref } from 'vue';
-  import JSONEditorType from 'jsoneditor';
 
   const props = withDefaults(
     defineProps<{
@@ -54,8 +53,7 @@
     }
   };
 
-  const handleEditorBlur = (_event: Event, instance: JSONEditorType) => {
-    const value = instance.getText();
+  const handleUpdateEditorValue = (value: string) => {
     handleEmit(value);
   };
 </script>
@@ -74,7 +72,11 @@
         <SettingOutlined class="cursor-pointer" @click="handleClick" />
       </template>
     </Input>
-    <JSONEditor v-if="mode === ModeEnum.JSON" :value="getJSONValue" @blur="handleEditorBlur" />
-    <CreateTCPCommandModal @register="registerCreateTCPCommandModal" @update:value="handleEmit" />
+    <JSONEditor
+      v-if="mode === ModeEnum.JSON"
+      :value="getJSONValue"
+      @update:value="handleUpdateEditorValue"
+    />
+    <GenModbusCommandModal @register="registerCreateTCPCommandModal" @update:value="handleEmit" />
   </section>
 </template>

+import { FormFieldsEnum } from './config';
+
+type ValuesItem = { value: any };
+
+export interface ModbusCommandValueType extends Record<FormFieldsEnum, any> {
+  [FormFieldsEnum.REGISTER_VALUES]: ValuesItem[];
+  [FormFieldsEnum.COIL_VALUES]: ValuesItem[];
+}

+import { FunctionCodeEnum } from './config';
+import { ModbusCommandValueType } from './type';
+import { GenModbusCommandType } from '/@/api/task/model';
+
+const registerInfo = (record: ModbusCommandValueType): Partial<GenModbusCommandType> => {
+  const {
+    method,
+    registerNumber,
+    registerValue,
+    registerValues,
+    coilNumber,
+    coilValue,
+    coilValues,
+  } = record;
+  switch (method) {
+    case FunctionCodeEnum.READ_COIL_STATE_01 || FunctionCodeEnum.READ_INPUT_STATE_02:
+      return { registerNum: coilNumber };
+    case FunctionCodeEnum.READ_KEEP_REGISTER_03 || FunctionCodeEnum.READ_INPUT_REGISTER_04:
+      return { registerNum: registerNumber };
+    case FunctionCodeEnum.WRITE_SINGLE_COIL_REGISTER_05:
+      return { registerValues: [coilValue] };
+    case FunctionCodeEnum.WRITE_SINGLE_KEEP_COIL_REGISTER_06:
+      return { registerValues: [registerValue] };
+    case FunctionCodeEnum.WRITE_MULTIPLE_COIL_STATE_15:
+      return {
+        registerNum: coilNumber,
+        registerValues: coilValues.map((item) => (item.value ? 1 : 0)),
+      };
+    case FunctionCodeEnum.WRITE_MULTIPLE_KEEP_REGISTER_16:
+      return {
+        registerNum: registerNumber,
+        registerValues: registerValues.map((item) => item.value),
+      };
+    default:
+      return {};
+  }
+};
+
+export const composeModbusModalData = (record: ModbusCommandValueType): GenModbusCommandType => {
+  const { crc, deviceCode, method, registerAddr } = record;
+  return {
+    crc,
+    deviceCode,
+    method,
+    registerAddr,
+    ...registerInfo(record),
+  };
+};

@@ -14,6 +14,8 @@
   import { computed } from '@vue/reactivity';
   import { unref } from 'vue';
   import { ref } from 'vue';
+  import { dateUtil } from '/@/utils/dateUtil';
+  import { DEFAULT_DATE_FORMAT } from '/@/views/visual/board/detail/config/util';
 
   enum DropMenuEvent {
     DELETE = 'DELETE',
@@ -43,9 +45,9 @@
   });
 
   const getCancelState = computed(() => {
-    const { executeTarget } = unref(getRecord);
-    const { cancelExecuteDevices } = executeTarget;
-    return !!(cancelExecuteDevices && cancelExecuteDevices.length);
+    return !!(
+      unref(getRecord).tkDeviceTaskCenter && unref(getRecord).tkDeviceTaskCenter?.allowState
+    );
   });
 
   const handleDelete = async () => {
@@ -76,7 +78,11 @@
     try {
       if (!props.tbDeviceId) return;
       loading.value = true;
-      await cancelTask({ id: unref(getRecord).id, tbDeviceId: props.tbDeviceId });
+      await cancelTask({
+        id: unref(getRecord).id,
+        tbDeviceId: props.tbDeviceId,
+        allow: !unref(getCancelState),
+      });
       createMessage.success('设置成功');
       props.reload?.();
     } catch (error) {
@@ -85,6 +91,31 @@
       loading.value = false;
     }
   };
+
+  const getTwoDateDiff = (date: number, now = dateUtil()) => {
+    const unitList = [
+      { radix: null, unitName: '年', unit: 'year' },
+      { radix: 11, unitName: '月', unit: 'month' },
+      { radix: 30, unitName: '日', unit: 'day' },
+      { radix: 23, unitName: '时', unit: 'hour' },
+      { radix: 59, unitName: '分', unit: 'minute' },
+      { radix: 59, unitName: '秒', unit: 'second' },
+    ];
+
+    for (let i = unitList.length - 1; i >= 0; i--) {
+      const { unit, radix, unitName } = unitList[i];
+      const lastDate = dateUtil(date);
+      const diffValue = now.diff(lastDate, unit as any);
+      if (!radix || diffValue <= radix) {
+        return { value: diffValue, unit, unitName };
+      }
+    }
+  };
+
+  const getLastExecuteTime = computed(() => {
+    if (!unref(getRecord).lastExecuteTime) return;
+    return getTwoDateDiff(unref(getRecord).lastExecuteTime!);
+  });
 </script>
 
 <template>
@@ -155,10 +186,15 @@
           <span>运行任务</span>
         </div>
       </Button>
-      <Tooltip title="最后运行时间:">
+      <Tooltip
+        v-if="getLastExecuteTime"
+        overlay-class-name="task-last-execute-time-tooltip"
+        placement="topLeft"
+        :title="`最后运行时间: ${dateUtil(getRecord.lastExecuteTime).format(DEFAULT_DATE_FORMAT)}`"
+      >
         <div class="text-gray-400 text-xs truncate">
           <span class="mr-2">间隔时间重复</span>
-          <span>三分钟前</span>
+          <span>{{ `${getLastExecuteTime.value}${getLastExecuteTime.unitName}前` }}</span>
         </div>
       </Tooltip>
     </div>
@@ -184,3 +220,9 @@
     </section>
   </Card>
 </template>
+
+<style>
+  .task-last-execute-time-tooltip {
+    max-width: 300px;
+  }
+</style>

@@ -52,19 +52,6 @@ export const formSchemas: FormSchema[] = [
       getPopupContainer: () => document.body,
     },
   },
-  // {
-  //   label: '',
-  //   component: 'Select',
-  //   field: FormFieldsEnum.TASK_TYPE,
-  //   defaultValue: TaskTypeEnum.ALL,
-  //   componentProps: {
-  //     options: [
-  //       { label: TaskTypeNameEnum.CUSTOM, value: TaskTypeEnum.CUSTOM },
-  //       { label: TaskTypeNameEnum.MODBUS_RTU, value: TaskTypeEnum.MODBUS_RTU },
-  //     ],
-  //     getPopupContainer: () => document.body,
-  //   },
-  // },
   {
     label: '状态',
     component: 'Select',

@@ -5,7 +5,7 @@
   import { formSchemas } from './config';
   import { TaskCard } from './components/TaskCard';
   import { getTaskCenterList } from '/@/api/task';
-  import { ref } from 'vue';
+  import { ref, unref } from 'vue';
   import { onMounted } from 'vue';
   import { DetailModal } from './components/DetailModal';
   import { useModal } from '/@/components/Modal';
@@ -14,6 +14,8 @@
   import { ReloadOutlined } from '@ant-design/icons-vue';
   import { DataActionModeEnum } from '/@/enums/toolEnum';
   import { ModalParamsType } from '/#/utils';
+  import { Authority } from '/@/components/Authority';
+  import { getBoundingClientRect } from '/@/utils/domUtils';
 
   const [registerModal, { openModal }] = useModal();
 
@@ -61,7 +63,28 @@
 
   const reload = () => getDataSource();
 
+  const listElRef = ref<Nullable<ComponentElRef>>(null);
+
+  const setListHeight = () => {
+    const clientHeight = document.documentElement.clientHeight;
+    const rect = getBoundingClientRect(unref(listElRef)!.$el!) as DOMRect;
+    // margin-top 24 height 24
+    const paginationHeight = 24 + 24 + 8;
+    // list pading top 8 maring-top 8 extra slot 56
+    const listContainerMarginBottom = 8 + 8 + 56;
+    const listContainerHeight =
+      clientHeight - rect.top - paginationHeight - listContainerMarginBottom;
+    const listContainerEl = (unref(listElRef)!.$el as HTMLElement).querySelector(
+      '.ant-spin-container'
+    ) as HTMLElement;
+    listContainerEl &&
+      (listContainerEl.style.height = listContainerHeight + 'px') &&
+      (listContainerEl.style.overflowY = 'auto') &&
+      (listContainerEl.style.overflowX = 'hidden');
+  };
+
   onMounted(() => {
+    setListHeight();
     getDataSource();
   });
 </script>
@@ -72,11 +95,13 @@
       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>
-      <Button
-        type="primary"
-        @click="openModal(true, { mode: DataActionModeEnum.CREATE } as ModalParamsType)"
-        >创建任务</Button
-      >
+      <Authority>
+        <Button
+          type="primary"
+          @click="openModal(true, { mode: DataActionModeEnum.CREATE } as ModalParamsType)"
+          >创建任务
+        </Button>
+      </Authority>
     </section>
     <section
       class="form-container bg-light-50 px-4 pt-4 mt-4 x dark:text-gray-300 dark:bg-dark-900"
@@ -85,6 +110,7 @@
     </section>
     <section class="bg-light-50 mt-4 p-4 x dark:text-gray-300 dark:bg-dark-900">
       <List
+        ref="listElRef"
         :dataSource="dataSource"
         :pagination="pagination"
         :grid="{ gutter: 16, xs: 1, sm: 1, md: 2, lg: 3, xl: 3, xxl: 4, column: 4 }"
@@ -92,7 +118,6 @@
       >
         <template #header>
           <section class="flex justify-end gap-4">
-            <!-- <CardLayoutButton /> -->
             <Tooltip title="刷新">
               <Button type="primary" @click="getDataSource">
                 <ReloadOutlined :spin="loading" />