Commit d8f77d935aafcb836d51bfc478a0aca40c37d904
1 parent
7b924d4e
feat: device list create device modal add refresh clientID button
Showing
3 changed files
with
29 additions
and
3 deletions
@@ -421,6 +421,7 @@ export const step2Schemas: FormSchema[] = [ | @@ -421,6 +421,7 @@ export const step2Schemas: FormSchema[] = [ | ||
421 | field: 'clientId', | 421 | field: 'clientId', |
422 | required: true, | 422 | required: true, |
423 | ifShow: false, | 423 | ifShow: false, |
424 | + slot: 'clientId', | ||
424 | componentProps: { | 425 | componentProps: { |
425 | maxLength: 36, | 426 | maxLength: 36, |
426 | placeholder: '请输入客户端ID', | 427 | placeholder: '请输入客户端ID', |
@@ -12,7 +12,9 @@ | @@ -12,7 +12,9 @@ | ||
12 | <template #clientId="{ field, model }"> | 12 | <template #clientId="{ field, model }"> |
13 | <div class="flex items-center"> | 13 | <div class="flex items-center"> |
14 | <Input v-model:value="model[field]" placeholder="请输入客户端ID" /> | 14 | <Input v-model:value="model[field]" placeholder="请输入客户端ID" /> |
15 | - <ReloadOutlined class="ml-3 !text-blue-600" @click="handleCreateUUID" /> | 15 | + <Tooltip title="刷新客户端ID"> |
16 | + <ReloadOutlined class="ml-3 !text-blue-600" @click="handleCreateUUID" /> | ||
17 | + </Tooltip> | ||
16 | </div> | 18 | </div> |
17 | </template> | 19 | </template> |
18 | </BasicForm> | 20 | </BasicForm> |
@@ -26,7 +28,7 @@ | @@ -26,7 +28,7 @@ | ||
26 | import { TokenSchemas, credentialTypeEnum } from '../../config/data'; | 28 | import { TokenSchemas, credentialTypeEnum } from '../../config/data'; |
27 | import { saveDeviceToken } from '/@/api/device/deviceManager'; | 29 | import { saveDeviceToken } from '/@/api/device/deviceManager'; |
28 | import { useMessage } from '/@/hooks/web/useMessage'; | 30 | import { useMessage } from '/@/hooks/web/useMessage'; |
29 | - import { Input } from 'ant-design-vue'; | 31 | + import { Input, Tooltip } from 'ant-design-vue'; |
30 | import { buildUUID } from '/@/utils/uuid'; | 32 | import { buildUUID } from '/@/utils/uuid'; |
31 | import { ReloadOutlined } from '@ant-design/icons-vue'; | 33 | import { ReloadOutlined } from '@ant-design/icons-vue'; |
32 | export default defineComponent({ | 34 | export default defineComponent({ |
@@ -35,6 +37,7 @@ | @@ -35,6 +37,7 @@ | ||
35 | BasicForm, | 37 | BasicForm, |
36 | Input, | 38 | Input, |
37 | ReloadOutlined, | 39 | ReloadOutlined, |
40 | + Tooltip, | ||
38 | }, | 41 | }, |
39 | emits: ['register'], | 42 | emits: ['register'], |
40 | setup() { | 43 | setup() { |
@@ -4,6 +4,18 @@ | @@ -4,6 +4,18 @@ | ||
4 | <template #addAgree="{ model, field }"> | 4 | <template #addAgree="{ model, field }"> |
5 | <Checkbox v-model:checked="model[field]" @change="checkedChange">添加协议</Checkbox> | 5 | <Checkbox v-model:checked="model[field]" @change="checkedChange">添加协议</Checkbox> |
6 | </template> | 6 | </template> |
7 | + <template #clientId="{ model, field }"> | ||
8 | + <div class="flex justify-center items-center"> | ||
9 | + <Input v-model:value="model[field]" placeholder="请输入客户端ID" /> | ||
10 | + <Tooltip title="刷新客户端ID"> | ||
11 | + <Icon | ||
12 | + class="ml-3 cursor-pointer !text-blue-600" | ||
13 | + icon="ant-design:reload-outlined" | ||
14 | + @click="handleGenerateClientId" | ||
15 | + /> | ||
16 | + </Tooltip> | ||
17 | + </div> | ||
18 | + </template> | ||
7 | </BasicForm> | 19 | </BasicForm> |
8 | <div> | 20 | <div> |
9 | <a-button @click="prevStep">上一步</a-button> | 21 | <a-button @click="prevStep">上一步</a-button> |
@@ -13,13 +25,18 @@ | @@ -13,13 +25,18 @@ | ||
13 | <script lang="ts"> | 25 | <script lang="ts"> |
14 | import { defineComponent } from 'vue'; | 26 | import { defineComponent } from 'vue'; |
15 | 27 | ||
16 | - import { Checkbox } from 'ant-design-vue'; | 28 | + import { Checkbox, Input, Tooltip } from 'ant-design-vue'; |
17 | import { BasicForm, useForm } from '/@/components/Form'; | 29 | import { BasicForm, useForm } from '/@/components/Form'; |
18 | import { step2Schemas } from '../../config/data'; | 30 | import { step2Schemas } from '../../config/data'; |
31 | + import { Icon } from '/@/components/Icon'; | ||
32 | + import { buildUUID } from '/@/utils/uuid'; | ||
19 | export default defineComponent({ | 33 | export default defineComponent({ |
20 | components: { | 34 | components: { |
21 | BasicForm, | 35 | BasicForm, |
22 | Checkbox, | 36 | Checkbox, |
37 | + Input, | ||
38 | + Icon, | ||
39 | + Tooltip, | ||
23 | }, | 40 | }, |
24 | 41 | ||
25 | emits: ['prev', 'next'], | 42 | emits: ['prev', 'next'], |
@@ -105,6 +122,10 @@ | @@ -105,6 +122,10 @@ | ||
105 | validate(); | 122 | validate(); |
106 | } | 123 | } |
107 | 124 | ||
125 | + const handleGenerateClientId = () => { | ||
126 | + setFieldsValue({ clientId: buildUUID() }); | ||
127 | + }; | ||
128 | + | ||
108 | return { | 129 | return { |
109 | prevStep, | 130 | prevStep, |
110 | registerForm, | 131 | registerForm, |
@@ -113,6 +134,7 @@ | @@ -113,6 +134,7 @@ | ||
113 | validate, | 134 | validate, |
114 | resetFieldsValueAndStatus, | 135 | resetFieldsValueAndStatus, |
115 | validateStep2Method, | 136 | validateStep2Method, |
137 | + handleGenerateClientId, | ||
116 | }; | 138 | }; |
117 | }, | 139 | }, |
118 | }); | 140 | }); |