Merge branch 'ft' into 'main_dev'

fix: 修改Teambition上的问题

See merge request yunteng/thingskit-front!535

(cherry picked from commit b8da6b5459e02e32e7e4e8a832c845ec9d7fc27b)

8c259679 pref: 脚本管理，移除上报数据类型和下行数据解析
68707d7b fix: DEFECT-1133 修复产品从最后一页分页查询,然后查询出来17条,但是显示第二页,界面显示为第一页的数据,点第一页界面不变
5618db44 fix: DEFECT-1118 只修复PC端，tcp命令下发输入内容验证字母和数字
7f595afd pref: 修改TCP脚本
2d3fda8c fix: DEFECT-1149 报表配置,新增填入数据后,再去编辑,数据未回显(执行方式为立即执行时)
4524080e fix: DEFECT-1076 修复暗黑模式下新增通知白色显示框问题
2405426e fix: DEFECT-1148 websocket测试,先正常选择,测试有数据,然后把参数设置清空,再执行测试请求,依然有数据显示(应该是有缓存)

-import { defHttp } from '/@/utils/http/axios';
-import { ScriptParam, ScriptQueryParam, ScriptRecord } from './model/scriptModel';
-import { PaginationResult } from '/#/axios';
-
-enum ScriptManagerApi {
-  SCRIPT_POST_URL = '/js',
-  SCRIPT_GET_URL = '/js',
-  SCRIPT_DELETE_URL = '/js',
-  SCRIPT_MELIST_URL = '/js/me/list',
-  SCRIPT_TEST_URL = '/js/test',
-  SCRIPT_STATUS = '/js',
-}
-
-export const ScriptPage = (params: ScriptQueryParam) => {
-  return defHttp.get<PaginationResult<ScriptRecord>>({
-    url: ScriptManagerApi.SCRIPT_GET_URL,
-    params,
-  });
-};
-
-/**
- * 改变转换函数状态
- * @param params id status
- */
-export const scriptPagePutApi = (id, status) =>
-  defHttp.post({
-    url: ScriptManagerApi.SCRIPT_STATUS + '/' + id + '/' + status,
-  });
-
-//删除脚本
-export const deleteScriptManage = (ids: string[]) => {
-  return defHttp.delete({
-    url: ScriptManagerApi.SCRIPT_DELETE_URL,
-    data: {
-      ids: ids,
-    },
-  });
-};
-
-// 创建或编辑脚本
-export const createOrEditScriptManage = (data) => {
-  return defHttp.post<ScriptParam>({
-    url: ScriptManagerApi.SCRIPT_POST_URL,
-    data,
-  });
-};
-
-// 查询脚本详情
-export const getScriptManageDetail = (id: string) => {
-  return defHttp.get({
-    url: ScriptManagerApi.SCRIPT_GET_URL + `/${id}`,
-  });
-};
-
-// 获取脚本选项列表
-export const getScriptManageMeList = () => {
-  return defHttp.get<ScriptRecord[]>({
-    url: ScriptManagerApi.SCRIPT_MELIST_URL,
-  });
-};
-
-// 测试脚本执行结果
-export const testScriptManage = (data) => {
-  return defHttp.post<ScriptParam>({
-    url: ScriptManagerApi.SCRIPT_TEST_URL,
-    data,
-  });
-};
+import { defHttp } from '/@/utils/http/axios';
+import { ScriptParam, ScriptQueryParam, ScriptRecord } from './model/scriptModel';
+import { PaginationResult } from '/#/axios';
+
+enum ScriptManagerApi {
+  SCRIPT_POST_URL = '/js',
+  SCRIPT_GET_URL = '/js',
+  SCRIPT_DELETE_URL = '/js',
+  SCRIPT_MELIST_URL = '/js/me/list',
+  SCRIPT_TEST_URL = '/js/test',
+  SCRIPT_STATUS = '/js',
+}
+
+export const ScriptPage = (params: ScriptQueryParam) => {
+  return defHttp.get<PaginationResult<ScriptRecord>>({
+    url: ScriptManagerApi.SCRIPT_GET_URL,
+    params,
+  });
+};
+
+/**
+ * 改变转换函数状态
+ * @param params id status
+ */
+export const scriptPagePutApi = (id, status) =>
+  defHttp.post({
+    url: ScriptManagerApi.SCRIPT_STATUS + '/' + id + '/' + status,
+  });
+
+//删除脚本
+export const deleteScriptManage = (ids: string[]) => {
+  return defHttp.delete({
+    url: ScriptManagerApi.SCRIPT_DELETE_URL,
+    data: {
+      ids: ids,
+    },
+  });
+};
+
+// 创建或编辑脚本
+export const createOrEditScriptManage = (data) => {
+  return defHttp.post<ScriptParam>({
+    url: ScriptManagerApi.SCRIPT_POST_URL,
+    data,
+  });
+};
+
+// 查询脚本详情
+export const getScriptManageDetail = (id: string) => {
+  return defHttp.get({
+    url: ScriptManagerApi.SCRIPT_GET_URL + `/${id}`,
+  });
+};
+
+// 获取脚本选项列表
+export const getScriptManageMeList = (params) => {
+  return defHttp.get<ScriptRecord[]>({
+    url: ScriptManagerApi.SCRIPT_MELIST_URL,
+    params,
+  });
+};
+
+// 测试脚本执行结果
+export const testScriptManage = (data) => {
+  return defHttp.post<ScriptParam>({
+    url: ScriptManagerApi.SCRIPT_TEST_URL,
+    data,
+  });
+};

@@ -160,6 +160,9 @@
           skin_url: publicPath + 'resource/tinymce/skins/ui/' + skinName.value,
           content_css:
             publicPath + 'resource/tinymce/skins/ui/' + skinName.value + '/content.min.css',
+          content_style: `.mce-content-body {background: ${
+            skinName.value === 'oxide' ? '#ffffff' : '#222f3e'
+          };}`,
           ...options,
           setup: (editor) => {
             editorRef.value = editor;

@@ -104,7 +104,13 @@
     if (isWebSocketType.value === '2') {
       socketUrls.value = url;
       socketMessage.server = `${socketUrls.value}?token=${token}`;
-      websocketRequest(params);
+      const list = Object.values(params);
+      const isEmpty = list.some((it) => it === '' || null || undefined);
+      if (!isEmpty) {
+        websocketRequest(params);
+      } else {
+        resetValue(false);
+      }
     } else {
       const resp = await otherHttpRequest(apiType, apiUrl?.split('{?')[0], headers, params, body);
       if (!resp) return;

@@ -765,6 +765,21 @@ export const CommandSchemas = (transportType: TransportTypeEnum): FormSchema[] =
           minRows: 6,
         },
       },
+      dynamicRules: () => {
+        return [
+          {
+            required: false,
+            validator: (_, value) => {
+              const zg = /^[0-9a-zA-Z]*$/;
+              if (!zg.test(value)) {
+                return Promise.reject('输入的内容只能是字母和数字的组合');
+              } else {
+                return Promise.resolve();
+              }
+            },
+          },
+        ];
+      },
     },
     {
       field: 'commandValue',

@@ -53,6 +53,7 @@
     baseColProps: { span: 8 },
     schemas: searchFormSchema,
     submitFunc: async () => {
+      pagination.current = 1;
       getDataSource({ pageSize: pagination.pageSize, page: 1 });
     },
   });

-import { FormSchema } from '/@/components/Form';
-
-export const tcpSchemas: FormSchema[] = [
-  {
-    field: 'script',
-    label: '转换脚本',
-    component: 'Input',
-    slot: 'script',
-    colProps: { span: 24 },
-  },
-];
-
-// 新增编辑配置
-export const formSchema: FormSchema[] = [
-  {
-    field: 'name',
-    label: '输入参数',
-    colProps: { span: 24 },
-    required: true,
-    component: 'Input',
-    componentProps: {
-      maxLength: 255,
-      placeholder: '请输入输入参数',
-    },
-  },
-  {
-    field: 'scriptContent',
-    label: '脚本内容',
-    required: true,
-    component: 'Input',
-    slot: 'scriptContent',
-    colProps: { span: 24 },
-  },
-  {
-    field: 'remark',
-    label: '输出参数',
-    colProps: { span: 24 },
-    component: 'InputTextArea',
-    componentProps: {
-      rows: 6,
-      maxLength: 255,
-      placeholder: '请输入输出参数',
-    },
-  },
-];
+import { FormSchema } from '/@/components/Form';
+
+export const tcpSchemas: FormSchema[] = [
+  {
+    field: 'upScriptId',
+    label: '上行脚本',
+    component: 'Input',
+    slot: 'upScriptId',
+    colProps: { span: 24 },
+  },
+  {
+    field: 'authScriptId',
+    label: '鉴权脚本',
+    component: 'Input',
+    slot: 'authScriptId',
+    colProps: { span: 24 },
+  },
+];
+
+// 新增编辑配置
+export const formSchema: FormSchema[] = [
+  {
+    field: 'name',
+    label: '输入参数',
+    colProps: { span: 24 },
+    required: true,
+    component: 'Input',
+    componentProps: {
+      maxLength: 255,
+      placeholder: '请输入输入参数',
+    },
+  },
+  {
+    field: 'scriptContent',
+    label: '脚本内容',
+    required: true,
+    component: 'Input',
+    slot: 'scriptContent',
+    colProps: { span: 24 },
+  },
+  {
+    field: 'remark',
+    label: '输出参数',
+    colProps: { span: 24 },
+    component: 'InputTextArea',
+    componentProps: {
+      rows: 6,
+      maxLength: 255,
+      placeholder: '请输入输出参数',
+    },
+  },
+];

-<template>
-  <div>
-    <BasicForm :showResetButton="false" :showSubmitButton="false" @register="register">
-      <template #script>
-        <div style="display: flex; align-items: center">
-          <div>
-            <Select
-              placeholder="请选择转换脚本"
-              v-model:value="selectScript.script"
-              style="width: 305px"
-              show-search
-              :options="selectOptions"
-              :filter-option="handleSearch"
-              allowClear
-            />
-          </div>
-          <div>
-            <span
-              @click="handleCreateOrEdit('add')"
-              class="ml-2"
-              style="color: #409eff; cursor: pointer"
-              size="small"
-              >新建转换脚本</span
-            >
-          </div>
-        </div>
-        <a-button @click="handleCreateOrEdit('test')" class="mt-4" type="primary"
-          >测试脚本</a-button
-        >
-      </template>
-    </BasicForm>
-    <ConverScriptModal @register="registerModal" @success="handleSuccess" />
-  </div>
-</template>
-<script lang="ts" setup>
-  import { ref, Ref, reactive, onMounted } from 'vue';
-  import { BasicForm, useForm } from '/@/components/Form';
-  import { tcpSchemas } from './config';
-  import { SelectTypes } from 'ant-design-vue/es/select';
-  import { Select } from 'ant-design-vue';
-  import { useModal } from '/@/components/Modal';
-  import { getScriptManageMeList } from '/@/api/scriptmanage/scriptManager';
-  import ConverScriptModal from '/@/views/scriptmanage/converscript/ConverScriptModal.vue';
-
-  const selectScript = reactive<Record<'script', Nullable<string>>>({
-    script: null,
-  });
-  const selectOptions: Ref<SelectTypes['options']> = ref([]);
-  onMounted(async () => {
-    const res = await getScriptManageMeList();
-    selectOptions.value = res.map((m) => {
-      return {
-        label: m.name,
-        value: m.id,
-      };
-    });
-  });
-  const handleSuccess = async (opt) => {
-    if (opt.text !== 'test') {
-      selectScript.script = opt?.res?.id;
-      const res = await getScriptManageMeList();
-      selectOptions.value = res.map((m) => {
-        return {
-          label: m.name,
-          value: m.id,
-        };
-      });
-    }
-  };
-
-  const [register] = useForm({
-    labelWidth: 180,
-    schemas: tcpSchemas,
-    actionColOptions: {
-      span: 14,
-    },
-  });
-  const [registerModal, { openModal }] = useModal();
-
-  // 新增或编辑
-  const handleCreateOrEdit = (c) => {
-    if (c === 'add') {
-      openModal(true, {
-        isUpdate: true,
-        isView: false,
-        isTest: false,
-        isText: 'confirm',
-        isTitle: 'add',
-      });
-    } else {
-      console.log(selectScript);
-      openModal(true, {
-        isUpdate: false,
-        isTest: true,
-        record: selectScript.script,
-        isText: 'test',
-        isTitle: 'test',
-      });
-    }
-  };
-
-  const getFormData = () => {
-    const value = {
-      ...{
-        scriptId: selectScript.script,
-        dataFormat: 'HEX',
-        type: 'TCP',
-      },
-    };
-    return value;
-  };
-  const resetFormData = () => {
-    selectScript.script = null;
-  };
-  const setFormData = (v) => {
-    selectScript.script = v?.scriptId;
-  };
-
-  const handleSearch = (inputValue: string, option: Record<'label' | 'value', string>) => {
-    return option.label.includes(inputValue);
-  };
-
-  defineExpose({
-    getFormData,
-    resetFormData,
-    setFormData,
-  });
-</script>
-<style lang="less" scoped></style>
+<template>
+  <div>
+    <BasicForm :showResetButton="false" :showSubmitButton="false" @register="register">
+      <template #upScriptId="{ model, field }">
+        <div style="display: flex; align-items: center">
+          <div>
+            <Select
+              @change="handleUpChange"
+              placeholder="请选择"
+              v-model:value="model[field]"
+              style="width: 305px"
+              show-search
+              :options="selectUpOptions"
+              :filter-option="handleSearch"
+              allowClear
+            />
+          </div>
+          <div>
+            <span
+              @click="handleCreateOrEdit('add')"
+              class="ml-2"
+              style="color: #409eff; cursor: pointer"
+              size="small"
+              >新建转换脚本</span
+            >
+          </div>
+        </div>
+        <a-button @click="handleCreateOrEdit('test')" class="mt-4" type="primary"
+          >测试脚本</a-button
+        >
+      </template>
+      <template #authScriptId="{ model, field }">
+        <div style="display: flex; align-items: center">
+          <div>
+            <Select
+              @change="handleAuthChange"
+              placeholder="请选择"
+              v-model:value="model[field]"
+              style="width: 305px"
+              show-search
+              :options="selectAuthOptions"
+              :filter-option="handleAuthSearch"
+              allowClear
+            />
+          </div>
+          <div>
+            <span
+              @click="handleCreateOrEditAuth('add')"
+              class="ml-2"
+              style="color: #409eff; cursor: pointer"
+              size="small"
+              >新建转换脚本</span
+            >
+          </div>
+        </div>
+        <a-button @click="handleCreateOrEditAuth('test')" class="mt-4" type="primary"
+          >测试脚本</a-button
+        >
+      </template>
+    </BasicForm>
+    <ConverScriptModal @register="registerModal" @success="handleSuccess" />
+    <ConverScriptModal @register="registerAuthModal" @success="handleAuthSuccess" />
+  </div>
+</template>
+<script lang="ts" setup name="index">
+  import { ref, Ref, onMounted } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { tcpSchemas } from './config';
+  import { SelectTypes } from 'ant-design-vue/es/select';
+  import { Select } from 'ant-design-vue';
+  import { useModal } from '/@/components/Modal';
+  import { getScriptManageMeList } from '/@/api/scriptmanage/scriptManager';
+  import ConverScriptModal from '/@/views/scriptmanage/converscript/ConverScriptModal.vue';
+  import { useMessage } from '/@/hooks/web/useMessage';
+
+  const selectUpOptions: Ref<SelectTypes['options']> = ref([]);
+
+  const selectAuthOptions: Ref<SelectTypes['options']> = ref([]);
+
+  const { createMessage } = useMessage();
+
+  const upScriptIdStr = ref('');
+
+  const authScriptIdStr = ref('');
+
+  onMounted(async () => {
+    selectUpOptions.value = await getAllScriptType('TRANSPORT_TCP_UP');
+    selectAuthOptions.value = await getAllScriptType('TRANSPORT_TCP_AUTH');
+  });
+
+  const getAllScriptType = async (type) => {
+    const rest = await getScriptManageMeList({ scriptType: type });
+    return rest.map((m) => ({ label: m.name, value: m.id }));
+  };
+
+  const handleSuccess = async ({ res, text }) => {
+    if (text !== 'test') {
+      const rest = await getAllScriptType('TRANSPORT_TCP_UP');
+      selectUpOptions.value = rest;
+      setFieldsValue({ upScriptId: res?.id });
+      upScriptIdStr.value = res?.id;
+    }
+  };
+
+  const handleAuthSuccess = async ({ res, text }) => {
+    if (text !== 'test') {
+      const rest = await getAllScriptType('TRANSPORT_TCP_AUTH');
+      selectAuthOptions.value = rest;
+      setFieldsValue({ authScriptId: res?.id });
+      authScriptIdStr.value = res?.id;
+    }
+  };
+
+  const [register, { getFieldsValue, resetFields, setFieldsValue }] = useForm({
+    labelWidth: 180,
+    schemas: tcpSchemas,
+    actionColOptions: {
+      span: 14,
+    },
+  });
+
+  const handleUpChange = (v) => (upScriptIdStr.value = v);
+
+  const handleAuthChange = (v) => (authScriptIdStr.value = v);
+
+  const [registerModal, { openModal }] = useModal();
+
+  const [registerAuthModal, { openModal: openAuthModel }] = useModal();
+
+  //TODO: 待优化
+
+  const handleCreateOrEditAuth = (c) => {
+    if (c === 'add') {
+      openAuthModel(true, {
+        isUpdate: true,
+        isView: false,
+        isTest: false,
+        isText: 'confirm',
+        isTitle: 'add',
+      });
+    } else {
+      if (!authScriptIdStr.value) return createMessage.error('请先选择对应脚本');
+      openAuthModel(true, {
+        isUpdate: false,
+        isTest: true,
+        record: authScriptIdStr.value,
+        isText: 'test',
+        isTitle: 'test',
+      });
+    }
+  };
+
+  const handleCreateOrEdit = (c) => {
+    if (c === 'add') {
+      openModal(true, {
+        isUpdate: true,
+        isView: false,
+        isTest: false,
+        isText: 'confirm',
+        isTitle: 'add',
+      });
+    } else {
+      if (!upScriptIdStr.value) return createMessage.error('请先选择对应脚本');
+      openModal(true, {
+        isUpdate: false,
+        isTest: true,
+        record: upScriptIdStr.value,
+        isText: 'test',
+        isTitle: 'test',
+      });
+    }
+  };
+
+  const getFormData = () => {
+    const values = getFieldsValue();
+    return {
+      ...values,
+      type: 'TCP',
+    };
+  };
+
+  const resetFormData = () => {
+    resetFields();
+  };
+
+  const setFormData = (v) => {
+    setFieldsValue(v);
+    upScriptIdStr.value = v?.upScriptId;
+    authScriptIdStr.value = v?.authScriptId;
+  };
+
+  const handleSearch = (inputValue: string, option: Record<'label' | 'value', string>) => {
+    return option.label.includes(inputValue);
+  };
+
+  const handleAuthSearch = (inputValue: string, option: Record<'label' | 'value', string>) => {
+    return option.label.includes(inputValue);
+  };
+
+  defineExpose({
+    getFormData,
+    resetFormData,
+    setFormData,
+  });
+</script>
+<style lang="less" scoped></style>

@@ -218,7 +218,7 @@
       editResData = await reportEditDetailPage(data.record.id);
       //回显基础数据
       editId.value = editResData.data.id;
-      const spanDisance = editResData.data.executeContent.split(' ');
+      const spanDisance = editResData.data.executeContent?.split(' ');
       await setFieldsValue(editResData.data);
       //回显嵌套数据
       await setFieldsValue({

@@ -28,15 +28,6 @@
         />
       </a-form-item>
       <a-form-item
-        label="上报数据类型"
-        name="dataType"
-        :rules="[{ required: false, message: '请选择上报数据类型' }]"
-      >
-        <a-space direction="vertical">
-          <a-radio-group v-model:value="scriptForm.dataType" :options="typeOptions" />
-        </a-space>
-      </a-form-item>
-      <a-form-item
         label="脚本类型"
         name="scriptType"
         :rules="[{ required: true, message: '请选择脚本类型' }]"
@@ -66,7 +57,6 @@
               <QuestionCircleOutlined style="font-size: 1rem" />
             </Tooltip>
           </template>
-          {{ getAceClass }}
           <div ref="aceRef" class="overflow-hidden"></div>
         </Card>
         <Button @click="handleCopy" class="mt-4">
@@ -88,7 +78,8 @@
           :maxlength="255"
         />
         <a-textarea
-          :rows="3"
+          disabled
+          :rows="5"
           v-else
           v-model:value="scriptForm.output"
           placeholder="输出参数为服务端返回的内容"
@@ -126,18 +117,16 @@
     script: '',
     params: '',
     output: '',
-    dataType: 'HEX',
     scriptType: 'TRANSPORT_TCP_UP',
     saveOriginalData: 'true',
   });
 
   const reportTypeOptions = reactive({
-    typeOptions: [],
     originalOptions: [],
     scriptTypeOptions: [],
   });
 
-  const { originalOptions, typeOptions, scriptTypeOptions } = toRefs(reportTypeOptions);
+  const { originalOptions, scriptTypeOptions } = toRefs(reportTypeOptions);
 
   const { createMessage } = useMessage();
 
@@ -151,8 +140,7 @@
 
   const getAceClass = computed((): string => userStore.getDarkMode);
 
-  const setDefaultRadio = (p1, p2, p3) => {
-    scriptForm.dataType = p1;
+  const setDefaultRadio = (p2, p3) => {
     scriptForm.saveOriginalData = p2;
     scriptForm.scriptType = p3;
   };
@@ -167,7 +155,6 @@
   };
 
   onMounted(async () => {
-    reportTypeOptions.typeOptions = (await getDictValue('report_data_type')) as never as any;
     reportTypeOptions.originalOptions = (await getDictValue('original_data')) as never as any;
     reportTypeOptions.scriptTypeOptions = (await getDictValue('script_type')) as never as any;
   });
@@ -199,12 +186,6 @@
   };
 
   const switchScriptTypeGetContent = (type) => {
-    if (type === 'TRANSPORT_TCP_DOWN')
-      Reflect.set(
-        defaultScriptTypeContent,
-        'TRANSPORT_TCP_DOWN',
-        `out.datas = "${scriptForm.params}";out.deviceName = "sensor";`
-      );
     aceEditor.value.setValue(defaultScriptTypeContent[type]);
   };
 
@@ -271,7 +252,6 @@
       nextTick(() => {
         setTimeout(() => {
           scriptForm.saveOriginalData = v.saveOriginalData === false ? 'false' : 'true';
-          scriptForm.dataType = v.dataType;
         }, 10);
       });
       aceEditor.value.setValue(v.convertJs);
@@ -294,7 +274,10 @@
     scriptForm.output = v;
   };
 
-  const handleFormat = () => beautify(aceEditor.value.session);
+  const handleFormat = () => {
+    beautify(aceEditor.value.session);
+    aceEditor.value.getSession().setUseWrapMode(true);
+  };
 
   defineExpose({
     initEditor,

@@ -57,7 +57,7 @@
           : '测试转换脚本';
       const okText = isText.value == 'test' ? '测试' : '确定';
       if (unref(isTitle) == 'add') {
-        converScriptRef.value?.setDefaultRadio('HEX', 'true', 'TRANSPORT_TCP_UP');
+        converScriptRef.value?.setDefaultRadio('true', 'TRANSPORT_TCP_UP');
       }
       if (unref(isTitle) == 'edit') {
         converScriptRef.value?.setFormData(data.record);
@@ -67,7 +67,7 @@
           const res = await getScriptManageDetail(data.record);
           converScriptRef.value?.setFormData(res);
         } else {
-          converScriptRef.value?.setDefaultRadio('HEX', 'true', 'TRANSPORT_TCP_UP');
+          converScriptRef.value?.setDefaultRadio('true', 'TRANSPORT_TCP_UP');
         }
       }
       setModalProps({ title, showOkBtn: true, showCancelBtn: true, okText });

@@ -79,9 +79,9 @@ export const defaultTitle = h('div', { style: 'background:#404040' }, [
   ]),
 ]);
 
+// TRANSPORT_TCP_DOWN: 'out.datas = "";out.deviceName = "sensor";',
 export const defaultScriptTypeContent = {
   TRANSPORT_TCP_UP:
     'var attrData = {};var teleData = {};teleData.source= params;out.datas = teleData;out.telemetry =true;out.ackMsg = params;out.deviceName = "sensor";out.ts = Date.now();',
-  TRANSPORT_TCP_DOWN: 'out.datas = "";out.deviceName = "sensor";',
   TRANSPORT_TCP_AUTH: 'out.password = params;out.success = params;',
 };

-<template>
-  <div>
-    <BasicTable :clickToRowSelect="false" @register="registerTable" :searchInfo="searchInfo">
-      <template #toolbar>
-        <Authority value="api:yt:js:post">
-          <a-button type="primary" @click="handleCreateOrEdit(null)"> 新增转换脚本 </a-button>
-        </Authority>
-        <Authority value="api:yt:js:delete">
-          <Popconfirm
-            title="您确定要批量删除数据"
-            ok-text="确定"
-            cancel-text="取消"
-            @confirm="handleDeleteOrBatchDelete(null)"
-          >
-            <a-button type="primary" color="error" :disabled="hasBatchDelete"> 批量删除 </a-button>
-          </Popconfirm>
-        </Authority>
-      </template>
-      <template #convertJs="{ record }">
-        <a-button type="text" @click="handleScriptView(record)">
-          <span style="color: #377dff">查看脚本</span>
-        </a-button>
-      </template>
-      <template #action="{ record }">
-        <TableAction
-          :actions="[
-            {
-              label: '测试',
-              icon: 'ant-design:font-size-outlined',
-              auth: 'api:yt:js:test',
-              onClick: handleBindTest.bind(null, record),
-            },
-            {
-              label: '编辑',
-              icon: 'clarity:note-edit-line',
-              auth: 'api:yt:js:update',
-              onClick: handleCreateOrEdit.bind(null, record),
-              ifShow: record.status == 0,
-            },
-            {
-              label: '删除',
-              icon: 'ant-design:delete-outlined',
-              auth: 'api:yt:js:delete',
-              color: 'error',
-              ifShow: record.status == 0,
-              popConfirm: {
-                title: '是否确认删除',
-                confirm: handleDeleteOrBatchDelete.bind(null, record),
-              },
-            },
-          ]"
-        />
-      </template>
-      <template #status="{ record }">
-        <Authority value="api:yt:js:update:status">
-          <Switch
-            :checked="record.status === 1"
-            :loading="record.pendingStatus"
-            checkedChildren="启用"
-            unCheckedChildren="禁用"
-            @change="(checked:boolean)=>statusChange(checked,record)"
-          />
-        </Authority>
-      </template>
-    </BasicTable>
-    <ConverScriptModal @register="registerModal" @success="handleSuccess" />
-  </div>
-</template>
-
-<script lang="ts" setup>
-  import { reactive, nextTick } from 'vue';
-  import { BasicTable, useTable, TableAction } from '/@/components/Table';
-  import { searchFormSchema, columns } from './config.data';
-  import { Authority } from '/@/components/Authority';
-  import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
-  import { Switch, Popconfirm } from 'ant-design-vue';
-  import { useModal } from '/@/components/Modal';
-  import ConverScriptModal from './ConverScriptModal.vue';
-  import {
-    ScriptPage,
-    deleteScriptManage,
-    scriptPagePutApi,
-  } from '/@/api/scriptmanage/scriptManager';
-  import { useMessage } from '/@/hooks/web/useMessage';
-
-  const searchInfo = reactive<Recordable>({});
-  const [registerTable, { reload, setProps, setSelectedRowKeys }] = useTable({
-    title: '转换脚本列表',
-    api: ScriptPage,
-    columns,
-    showIndexColumn: false,
-    clickToRowSelect: false,
-    formConfig: {
-      labelWidth: 120,
-      schemas: searchFormSchema,
-      fieldMapToTime: [['sendTime', ['startTime', 'endTime'], 'x']],
-    },
-    useSearchForm: true,
-    showTableSetting: true,
-    bordered: true,
-    rowKey: 'id',
-    actionColumn: {
-      width: 200,
-      title: '操作',
-      dataIndex: 'action',
-      slots: { customRender: 'action' },
-      fixed: 'right',
-    },
-  });
-
-  const handleSuccess = () => {
-    reload();
-  };
-
-  const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
-    useBatchDelete(deleteScriptManage, handleSuccess, setProps);
-  selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
-    // Demo:status为1的选择框禁用
-    if (record.status === 1) {
-      return { disabled: true };
-    } else {
-      return { disabled: false };
-    }
-  };
-
-  nextTick(() => {
-    setProps(selectionOptions);
-  });
-
-  const [registerModal, { openModal }] = useModal();
-
-  // 新增或编辑
-  const handleCreateOrEdit = (record: Recordable | null) => {
-    if (record) {
-      openModal(true, {
-        isUpdate: false,
-        record,
-        isView: false,
-        isTest: false,
-        isText: 'confirm',
-        isTitle: 'edit',
-      });
-    } else {
-      openModal(true, {
-        isUpdate: true,
-        isView: false,
-        isTest: false,
-        isText: 'confirm',
-        isTitle: 'add',
-      });
-    }
-  };
-  const handleBindTest = (record: Recordable | null) => {
-    if (record) {
-      openModal(true, {
-        isUpdate: false,
-        record: record.id,
-        isTest: true,
-        isText: 'test',
-        isTitle: 'test',
-      });
-    }
-  };
-  const handleScriptView = (record: Recordable | null) => {
-    if (record) {
-      openModal(true, {
-        isUpdate: true,
-        record,
-        isView: true,
-      });
-    }
-  };
-  const statusChange = async (checked, record) => {
-    setProps({
-      loading: true,
-    });
-    setSelectedRowKeys([]);
-    resetSelectedRowKeys();
-    const newStatus = checked ? 1 : 0;
-    const { createMessage } = useMessage();
-    try {
-      await scriptPagePutApi(record.id, newStatus);
-      if (newStatus) {
-        createMessage.success(`启用成功`);
-      } else {
-        createMessage.success('禁用成功');
-      }
-    } finally {
-      setProps({
-        loading: false,
-      });
-      reload();
-    }
-  };
-</script>
+<template>
+  <div>
+    <BasicTable :clickToRowSelect="false" @register="registerTable" :searchInfo="searchInfo">
+      <template #toolbar>
+        <Authority value="api:yt:js:post">
+          <a-button type="primary" @click="handleCreateOrEdit(null)"> 新增转换脚本 </a-button>
+        </Authority>
+        <Authority value="api:yt:js:delete">
+          <Popconfirm
+            title="您确定要批量删除数据"
+            ok-text="确定"
+            cancel-text="取消"
+            @confirm="handleDeleteOrBatchDelete(null)"
+          >
+            <a-button type="primary" color="error" :disabled="hasBatchDelete"> 批量删除 </a-button>
+          </Popconfirm>
+        </Authority>
+      </template>
+      <template #convertJs="{ record }">
+        <a-button type="text" @click="handleScriptView(record)">
+          <span style="color: #377dff">查看脚本</span>
+        </a-button>
+      </template>
+      <template #action="{ record }">
+        <TableAction
+          :actions="[
+            {
+              label: '测试',
+              icon: 'ant-design:font-size-outlined',
+              auth: 'api:yt:js:test',
+              onClick: handleBindTest.bind(null, record),
+            },
+            {
+              label: '编辑',
+              icon: 'clarity:note-edit-line',
+              auth: 'api:yt:js:update',
+              onClick: handleCreateOrEdit.bind(null, record),
+              ifShow: record.status == 0,
+            },
+            {
+              label: '删除',
+              icon: 'ant-design:delete-outlined',
+              auth: 'api:yt:js:delete',
+              color: 'error',
+              ifShow: record.status == 0,
+              popConfirm: {
+                title: '是否确认删除',
+                confirm: handleDeleteOrBatchDelete.bind(null, record),
+              },
+            },
+          ]"
+        />
+      </template>
+      <template #status="{ record }">
+        <Authority value="api:yt:js:update:status">
+          <Switch
+            :checked="record.status === 1"
+            :loading="record.pendingStatus"
+            checkedChildren="启用"
+            unCheckedChildren="禁用"
+            @change="(checked:boolean)=>statusChange(checked,record)"
+          />
+        </Authority>
+      </template>
+    </BasicTable>
+    <ConverScriptModal @register="registerModal" @success="handleSuccess" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { reactive, nextTick } from 'vue';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+  import { searchFormSchema, columns } from './config.data';
+  import { Authority } from '/@/components/Authority';
+  import { useBatchDelete } from '/@/hooks/web/useBatchDelete';
+  import { Switch, Popconfirm } from 'ant-design-vue';
+  import { useModal } from '/@/components/Modal';
+  import ConverScriptModal from './ConverScriptModal.vue';
+  import {
+    ScriptPage,
+    deleteScriptManage,
+    scriptPagePutApi,
+  } from '/@/api/scriptmanage/scriptManager';
+  import { useMessage } from '/@/hooks/web/useMessage';
+
+  const searchInfo = reactive<Recordable>({});
+  const [registerTable, { reload, setProps, setSelectedRowKeys }] = useTable({
+    title: '转换脚本列表',
+    api: ScriptPage,
+    columns,
+    showIndexColumn: false,
+    clickToRowSelect: false,
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+      fieldMapToTime: [['sendTime', ['startTime', 'endTime'], 'x']],
+    },
+    useSearchForm: true,
+    showTableSetting: true,
+    bordered: true,
+    rowKey: 'id',
+    actionColumn: {
+      width: 200,
+      title: '操作',
+      dataIndex: 'action',
+      slots: { customRender: 'action' },
+      fixed: 'right',
+    },
+  });
+
+  const handleSuccess = () => {
+    reload();
+  };
+
+  const { hasBatchDelete, handleDeleteOrBatchDelete, selectionOptions, resetSelectedRowKeys } =
+    useBatchDelete(deleteScriptManage, handleSuccess, setProps);
+  selectionOptions.rowSelection.getCheckboxProps = (record: Recordable) => {
+    // Demo:status为1的选择框禁用
+    if (record.status === 1) {
+      return { disabled: true };
+    } else {
+      return { disabled: false };
+    }
+  };
+
+  nextTick(() => {
+    setProps(selectionOptions);
+  });
+
+  const [registerModal, { openModal }] = useModal();
+
+  // 新增或编辑
+  const handleCreateOrEdit = (record: Recordable | null) => {
+    if (record) {
+      openModal(true, {
+        isUpdate: false,
+        record,
+        isAuth: '',
+        isView: false,
+        isTest: false,
+        isText: 'confirm',
+        isTitle: 'edit',
+      });
+    } else {
+      openModal(true, {
+        isAuth: '',
+        isUpdate: true,
+        isView: false,
+        isTest: false,
+        isText: 'confirm',
+        isTitle: 'add',
+      });
+    }
+  };
+  const handleBindTest = (record: Recordable | null) => {
+    if (record) {
+      openModal(true, {
+        isAuth: '',
+        isUpdate: false,
+        record: record.id,
+        isTest: true,
+        isText: 'test',
+        isTitle: 'test',
+      });
+    }
+  };
+  const handleScriptView = (record: Recordable | null) => {
+    if (record) {
+      openModal(true, {
+        isUpdate: true,
+        record,
+        isView: true,
+      });
+    }
+  };
+  const statusChange = async (checked, record) => {
+    setProps({
+      loading: true,
+    });
+    setSelectedRowKeys([]);
+    resetSelectedRowKeys();
+    const newStatus = checked ? 1 : 0;
+    const { createMessage } = useMessage();
+    try {
+      await scriptPagePutApi(record.id, newStatus);
+      if (newStatus) {
+        createMessage.success(`启用成功`);
+      } else {
+        createMessage.success('禁用成功');
+      }
+    } finally {
+      setProps({
+        loading: false,
+      });
+      reload();
+    }
+  };
+</script>