feat：【antd】【mall】diy-editor 的整体继续迁移

apps/web-antd/src/views/mall/promotion/components/app-link-input/index.vue

@@ -1,14 +1,14 @@
 <script lang="ts" setup>
 import { ref, watch } from 'vue';
 
-import { Button, Input, InputGroup } from 'ant-design-vue';
+import { Button, Input } from 'ant-design-vue';
 
 import AppLinkSelectDialog from './app-link-select-dialog.vue';
 
 /** APP 链接输入框 */
 defineOptions({ name: 'AppLinkInput' });
 
-// 定义属性
+/** 定义属性 */
 const props = defineProps({
   modelValue: {
     type: String,
@@ -23,8 +23,16 @@ const emit = defineEmits<{
 const dialogRef = ref(); // 选择对话框
 
 const appLink = ref(''); // 当前的链接
-const handleOpenDialog = () => dialogRef.value?.open(appLink.value); // 处理打开对话框
-const handleLinkSelected = (link: string) => (appLink.value = link); // 处理 APP 链接选中
+
+/** 处理打开对话框 */
+function handleOpenDialog() {
+  return dialogRef.value?.open(appLink.value);
+}
+
+/** 处理 APP 链接选中 */
+function handleLinkSelected(link: string) {
+  appLink.value = link;
+}
 
 watch(
   () => props.modelValue,
@@ -38,14 +46,19 @@ watch(
 );
 </script>
 <template>
-  <InputGroup compact>
-    <Input
-      v-model:value="appLink"
-      placeholder="输入或选择链接"
-      class="flex-1"
-    />
-    <Button @click="handleOpenDialog">选择</Button>
-  </InputGroup>
+  <Input v-model:value="appLink" placeholder="输入或选择链接">
+    <template #addonAfter>
+      <Button @click="handleOpenDialog" class="!border-none">选择</Button>
+    </template>
+  </Input>
 
   <AppLinkSelectDialog ref="dialogRef" @change="handleLinkSelected" />
 </template>
+
+<style scoped lang="scss">
+:deep(.ant-input-group-addon) {
+  padding: 0;
+  background: transparent;
+  border: 0;
+}
+</style>