feat: device list create device modal add refresh clientID button

@@ -421,6 +421,7 @@ export const step2Schemas: FormSchema[] = [
     field: 'clientId',
     required: true,
     ifShow: false,
+    slot: 'clientId',
     componentProps: {
       maxLength: 36,
       placeholder: '请输入客户端ID',

@@ -12,7 +12,9 @@
       <template #clientId="{ field, model }">
         <div class="flex items-center">
           <Input v-model:value="model[field]" placeholder="请输入客户端ID" />
-          <ReloadOutlined class="ml-3 !text-blue-600" @click="handleCreateUUID" />
+          <Tooltip title="刷新客户端ID">
+            <ReloadOutlined class="ml-3 !text-blue-600" @click="handleCreateUUID" />
+          </Tooltip>
         </div>
       </template>
     </BasicForm>
@@ -26,7 +28,7 @@
   import { TokenSchemas, credentialTypeEnum } from '../../config/data';
   import { saveDeviceToken } from '/@/api/device/deviceManager';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { Input } from 'ant-design-vue';
+  import { Input, Tooltip } from 'ant-design-vue';
   import { buildUUID } from '/@/utils/uuid';
   import { ReloadOutlined } from '@ant-design/icons-vue';
   export default defineComponent({
@@ -35,6 +37,7 @@
       BasicForm,
       Input,
       ReloadOutlined,
+      Tooltip,
     },
     emits: ['register'],
     setup() {

@@ -4,6 +4,18 @@
       <template #addAgree="{ model, field }">
         <Checkbox v-model:checked="model[field]" @change="checkedChange">添加协议</Checkbox>
       </template>
+      <template #clientId="{ model, field }">
+        <div class="flex justify-center items-center">
+          <Input v-model:value="model[field]" placeholder="请输入客户端ID" />
+          <Tooltip title="刷新客户端ID">
+            <Icon
+              class="ml-3 cursor-pointer !text-blue-600"
+              icon="ant-design:reload-outlined"
+              @click="handleGenerateClientId"
+            />
+          </Tooltip>
+        </div>
+      </template>
     </BasicForm>
     <div>
       <a-button @click="prevStep">上一步</a-button>
@@ -13,13 +25,18 @@
 <script lang="ts">
   import { defineComponent } from 'vue';
 
-  import { Checkbox } from 'ant-design-vue';
+  import { Checkbox, Input, Tooltip } from 'ant-design-vue';
   import { BasicForm, useForm } from '/@/components/Form';
   import { step2Schemas } from '../../config/data';
+  import { Icon } from '/@/components/Icon';
+  import { buildUUID } from '/@/utils/uuid';
   export default defineComponent({
     components: {
       BasicForm,
       Checkbox,
+      Input,
+      Icon,
+      Tooltip,
     },
 
     emits: ['prev', 'next'],
@@ -105,6 +122,10 @@
         validate();
       }
 
+      const handleGenerateClientId = () => {
+        setFieldsValue({ clientId: buildUUID() });
+      };
+
       return {
         prevStep,
         registerForm,
@@ -113,6 +134,7 @@
         validate,
         resetFieldsValueAndStatus,
         validateStep2Method,
+        handleGenerateClientId,
       };
     },
   });