feat：【mall】diy editor 的 title-bar 优化

apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/config.ts

@@ -2,46 +2,28 @@ import type { ComponentStyle, DiyComponent } from '../../../util';
 
 /** 标题栏属性 */
 export interface TitleBarProperty {
-  // 背景图
+  bgImgUrl: string; // 背景图
-  bgImgUrl: string;
+  marginLeft: number; // 偏移
-  // 偏移
+  textAlign: 'center' | 'left'; // 显示位置
-  marginLeft: number;
+  title: string; // 主标题
-  // 显示位置
+  description: string; // 副标题
-  textAlign: 'center' | 'left';
+  titleSize: number; // 标题大小
-  // 主标题
+  descriptionSize: number; // 描述大小
-  title: string;
+  titleWeight: number; // 标题粗细
-  // 副标题
+  descriptionWeight: number; // 描述粗细
-  description: string;
+  titleColor: string; // 标题颜色
-  // 标题大小
+  descriptionColor: string; // 描述颜色
-  titleSize: number;
+  height: number; // 高度
-  // 描述大小
-  descriptionSize: number;
-  // 标题粗细
-  titleWeight: number;
-  // 描述粗细
-  descriptionWeight: number;
-  // 标题颜色
-  titleColor: string;
-  // 描述颜色
-  descriptionColor: string;
-  // 高度
-  height: number;
-  // 查看更多
   more: {
-    // 是否显示查看更多
+    show: false; // 是否显示查看更多
-    show: false;
+    text: string; // 自定义文字
-    // 自定义文字
+    type: 'all' | 'icon' | 'text'; // 样式选择
-    text: string;
+    url: string; // 链接
-    // 样式选择
+  }; // 查看更多
-    type: 'all' | 'icon' | 'text';
+  style: ComponentStyle; // 组件样式
-    // 链接
-    url: string;
-  };
-  // 组件样式
-  style: ComponentStyle;
 }
 
-// 定义组件
+/** 定义组件 */
 export const component = {
   id: 'TitleBar',
   name: '标题栏',

apps/web-ele/src/views/mall/promotion/components/diy-editor/components/mobile/title-bar/property.vue

@@ -24,15 +24,16 @@ import {
 
 import ComponentContainerProperty from '../../component-container-property.vue';
 
-// 导航栏属性面板
+/** 导航栏属性面板 */
 defineOptions({ name: 'TitleBarProperty' });
 
 const props = defineProps<{ modelValue: TitleBarProperty }>();
+
 const emit = defineEmits(['update:modelValue']);
+
 const formData = useVModel(props, 'modelValue', emit);
 
-// 表单校验
+const rules = {}; // 表单校验
-const rules = {};
 </script>
 <template>
   <ComponentContainerProperty v-model="formData.style">
@@ -167,5 +168,3 @@ const rules = {};
     </ElForm>
   </ComponentContainerProperty>
 </template>
-
-<style scoped lang="scss"></style>