refactor: migrate playground deprecated antdv-next APIs

- Modal: destroyOnClose → destroyOnHidden
- Card: body-style → styles.body
- Alert: message prop/slot → title
- Spin: tip → description, wrapper-class-name → classes.root

playground/src/views/examples/layout/col-page.vue

@@ -87,7 +87,7 @@ const leftMaxWidth = ref(props.leftMaxWidth || 100);
             @after-change="(value) => (props.leftMaxWidth = value as number)"
           />
         </div>
-        <Alert message="实验性的组件" show-icon type="warning">
+        <Alert title="实验性的组件" show-icon type="warning">
           <template #description>
             <p>
               双列布局组件是一个在Page组件上扩展的相对基础的布局组件，支持左侧折叠（当拖拽导致左侧宽度比最小宽度还要小时，还可以进入折叠状态）、拖拽调整宽度等功能。

playground/src/views/examples/loading/index.vue

@@ -18,7 +18,7 @@ const loadingV = refAutoReset(false, 3000);
   >
     <Card title="Antd Spin">
       <template #actions>这是Antd 组件库自带的Spin组件演示</template>
-      <Spin :spinning="spinning" tip="加载中...">
+      <Spin :spinning="spinning" description="加载中...">
         <Button type="primary" @click="spinning = true">显示Spin</Button>
       </Spin>
     </Card>
@@ -71,9 +71,11 @@ const loadingV = refAutoReset(false, 3000);
       title="Vben Spinner"
       v-spinning="spinningV"
       class="mt-4 overflow-hidden"
-      :body-style="{
-        position: 'relative',
-        overflow: 'hidden',
+      :styles="{
+        body: {
+          position: 'relative',
+          overflow: 'hidden',
+        },
       }"
     >
       <template #extra>

playground/src/views/examples/motion/index.vue

@@ -64,7 +64,7 @@ function openDocPage() {
       <span>一个易于使用的为其它组件赋予动画效果的组件。</span>
       <Button type="link" @click="openDocPage">查看文档</Button>
     </template>
-    <Card title="使用指令" :body-style="{ minHeight: '5rem' }">
+    <Card title="使用指令" :styles="{ body: { minHeight: '5rem' } }">
       <template #extra>
         <Button type="primary" @click="showCard1 = false">重载</Button>
       </template>
@@ -82,7 +82,7 @@ function openDocPage() {
     <Card
       class="mt-2"
       title="使用组件（将内部作为一个整体添加动画）"
-      :body-style="{ padding: 0 }"
+      :styles="{ body: { padding: 0 } }"
     >
       <div class="relative flex-center min-h-32 gap-2 overflow-hidden">
         <Motion
@@ -147,7 +147,7 @@ function openDocPage() {
     <Card
       class="mt-2"
       title="分组动画（每个子元素都会应用相同的独立动画）"
-      :body-style="{ padding: 0 }"
+      :styles="{ body: { padding: 0 } }"
     >
       <div class="relative flex-center min-h-32 gap-2 overflow-hidden">
         <MotionGroup v-bind="motionGroupProps" v-if="showCard3">