卡片预览

src/views/demo/form-design/components/VFormCreate/components/FormRender.vue

@@ -95,6 +95,31 @@
       </a-tab-pane>
     </a-tabs>
   </template>
+  <template v-else-if="['CardGroup'].includes(schema.component)">
+    <div style="width: 100%">
+      <div style="display: flex">
+        {{ schema.label }}
+        <div style="margin-left: 10px">
+          <a-radio-group
+            v-model:value="noTitleKey"
+            :options="schema.componentProps.options"
+          />
+        </div>
+      </div>
+      <template v-for="(item, index) in schema.componentProps.options" :key="index">
+        <a-card style="width: 100%" v-show="noTitleKey === item.value">
+          <FormRender
+            v-for="(childItem, k) in item.children"
+            :key="k"
+            :schema="childItem"
+            :formData="formData"
+            :formConfig="formConfig"
+            :setFormModel="setFormModel"
+          />
+        </a-card>
+      </template>
+    </div>
+  </template>
   <template v-else>
     <VFormItem
       v-if="(isCreateOrModifyComponent && schema.display) || !isCreateOrModifyComponent"
@@ -162,6 +187,10 @@
   let subTableId = ref(null);
   let subTableData = ref([]);
   let subTableList = ref([]);
+  const noTitleKey = ref('0')
+  if(props.schema.component === 'CardGroup'){
+    noTitleKey.value = props.schema.componentProps.options[0].value
+  }
 
   // if (props.formConfig.schemas) {
   //   props.formConfig.schemas.forEach((item) => {