改组件圆角为直角

smsb-plus-ui/src/views/smsb/itemProgram/component/CanvasBoard.vue

@@ -46,7 +46,7 @@ const canvasStyle = computed(() => {
       justifyContent: 'center',
       fontSize: '20px',
       color: '#aaa',
-      borderRadius: '12px',
+      borderRadius: '0px',
       boxShadow: '0 2px 8px rgba(0,0,0,0.08)'
     };
   } else if (isImg) {
@@ -63,7 +63,7 @@ const canvasStyle = computed(() => {
       justifyContent: 'center',
       fontSize: '20px',
       color: '#aaa',
-      borderRadius: '12px',
+      borderRadius: '0px',
       boxShadow: '0 2px 8px rgba(0,0,0,0.08)'
     };
   } else if (imgUrl) {
@@ -80,7 +80,7 @@ const canvasStyle = computed(() => {
       justifyContent: 'center',
       fontSize: '20px',
       color: '#aaa',
-      borderRadius: '12px',
+      borderRadius: '0px',
       boxShadow: '0 2px 8px rgba(0,0,0,0.08)'
     };
   } else {
@@ -94,7 +94,7 @@ const canvasStyle = computed(() => {
       justifyContent: 'center',
       fontSize: '20px',
       color: '#aaa',
-      borderRadius: '12px',
+      borderRadius: '0px',
       boxShadow: '0 2px 8px rgba(0,0,0,0.08)'
     };
   }

smsb-plus-ui/src/views/smsb/itemProgram/component/LiveBoard.vue

@@ -8,7 +8,8 @@
     justifyContent: 'center',
     background: '#f8fafc',
     boxSizing: 'border-box',
-    border: selected ? '2px solid #409eff' : '1px solid #ddd'
+    border: selected ? '2px solid #409eff' : '1px solid #ddd',
+    borderRadius: props.borderRadius + 'px'
   }">
     <div class="live-board-content">
       <div class="live-icon">
@@ -38,13 +39,15 @@ interface Props {
   liveUrl?: string;
   playAudio?: boolean;
   selected?: boolean;
+  borderRadius?: number;
 }
 const props = withDefaults(defineProps<Props>(), {
   width: 200,
   height: 120,
   liveUrl: '',
   playAudio: true,
-  selected: false
+  selected: false,
+  borderRadius: 0
 });
 const selected = computed(() => !!props.selected);
 const width = computed(() => props.width);
@@ -91,7 +94,7 @@ function select() {
   -moz-user-select: none;
   -ms-user-select: none;
   background: #f8fafc;
-  border-radius: 10px;
+  border-radius: 0px;
   transition: border-color 0.2s;
   position: relative;
   box-sizing: border-box;

smsb-plus-ui/src/views/smsb/itemProgram/component/MediaAssetBoard.vue

@@ -9,7 +9,8 @@
     overflow: 'hidden',
     flexDirection: 'column',
     gap: '8px',
-    padding: '8px'
+    padding: '8px',
+    borderRadius: props.borderRadius + 'px'
   }" @click="$emit('click', $event)">
     <!-- 预览窗口 -->
     <div v-if="mediaItems.length > 0" class="preview-container">
@@ -62,11 +63,13 @@ const props = withDefaults(
     selected?: boolean;
     readonly?: boolean;
     modelValue?: any;
+    borderRadius?: number;
   }>(),
   {
     selected: false,
     readonly: false,
-    modelValue: null
+    modelValue: null,
+    borderRadius: 0
   }
 );
 
@@ -263,8 +266,9 @@ function onResizeMouseDown(dir: string, e: MouseEvent) {
 <style scoped>
 .media-asset-board-wrapper {
   background: #f9fbfd;
+  border-radius: inherit;
   border: 2px dashed #b3c7e6;
-  border-radius: 10px;
+  border-radius: 0px;
   transition: border-color 0.2s;
   position: relative;
   overflow: hidden;
@@ -288,6 +292,8 @@ function onResizeMouseDown(dir: string, e: MouseEvent) {
   display: flex;
   align-items: center;
   justify-content: center;
+  border-radius: inherit;
+  overflow: hidden;
 }
 
 .media-item {
@@ -297,6 +303,7 @@ function onResizeMouseDown(dir: string, e: MouseEvent) {
   display: flex;
   align-items: center;
   justify-content: center;
+  border-radius: inherit;
   opacity: 0;
   transition: opacity 0.5s ease-in-out;
 }
@@ -309,6 +316,7 @@ function onResizeMouseDown(dir: string, e: MouseEvent) {
   max-width: 100%;
   max-height: 100%;
   object-fit: contain;
+  border-radius: inherit;
 }
 
 .media-asset-icon {

smsb-plus-ui/src/views/smsb/itemProgram/component/ScrollingTextBoard.vue

@@ -24,6 +24,7 @@ interface Props {
   height?: number;
   selected?: boolean;
   speed?: number; // 滚动速度，px/秒
+  borderRadius?: number;
 }
 const props = defineProps<Props>();
 const selected = computed(() => !!props.selected);
@@ -42,7 +43,8 @@ const textStyle = computed(() => ({
   justifyContent: props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : 'center',
   wordBreak: 'break-all',
   overflow: 'hidden',
-  position: 'relative'
+  position: 'relative',
+  borderRadius: props.borderRadius ? `${props.borderRadius}px` : '0',
 }));
 const scrollStyle = ref<any>({ position: 'absolute', transform: 'translateX(0px)', whiteSpace: 'nowrap' });
 let reqId: number | null = null;

smsb-plus-ui/src/views/smsb/itemProgram/component/TextBoard.vue

@@ -21,6 +21,7 @@ interface Props {
   width?: number;
   height?: number;
   selected?: boolean;
+  borderRadius?: number;
 }
 const props = defineProps<Props>();
 const selected = computed(() => !!props.selected);
@@ -35,6 +36,8 @@ const textStyle = computed(() => ({
   alignItems: 'center',
   justifyContent: props.align === 'left' ? 'flex-start' : props.align === 'right' ? 'flex-end' : 'center',
   userSelect: 'none',
+  borderRadius: props.borderRadius ? `${props.borderRadius}px` : '0',
+  overflow: 'hidden',
 }));
 
 function onResizeMouseDown(e: MouseEvent, dir: string) {

smsb-plus-ui/src/views/smsb/itemProgram/component/WebPageBoard.vue

@@ -5,7 +5,8 @@
     position: 'relative',
     display: 'flex',
     alignItems: 'center',
-    justifyContent: 'center'
+    justifyContent: 'center',
+    borderRadius: props.borderRadius + 'px'
   }">
     <div class="web-page-icon">
       <svg width="32" height="32" viewBox="0 0 32 32" fill="none">
@@ -30,11 +31,13 @@ interface Props {
   height?: number;
   url?: string;
   selected?: boolean;
+  borderRadius?: number;
 }
 const props = withDefaults(defineProps<Props>(), {
   width: 120,
   height: 120,
-  url: ''
+  url: '',
+  borderRadius: 0
 });
 const selected = computed(() => !!props.selected);
 

smsb-plus-ui/src/views/smsb/itemProgram/component/propNameMaps.ts

@@ -13,7 +13,8 @@ export const textPropNameMap = {
   x: '横坐标',
   y: '纵坐标',
   width: '宽度',
-  height: '高度'
+  height: '高度',
+  borderRadius: '圆角半径'
 };
 
 export const scrollingTextPropNameMap = {
@@ -26,7 +27,8 @@ export const scrollingTextPropNameMap = {
   x: '横坐标',
   y: '纵坐标',
   width: '宽度',
-  height: '高度'
+  height: '高度',
+  borderRadius: '圆角半径'
 };
 
 export const mediaAssetPropNameMap = {
@@ -34,7 +36,8 @@ export const mediaAssetPropNameMap = {
   width: '宽度',
   height: '高度',
   x: '横坐标',
-  y: '纵坐标'
+  y: '纵坐标',
+  borderRadius: '圆角半径'
 };
 
 export const webPagePropNameMap = {
@@ -42,7 +45,8 @@ export const webPagePropNameMap = {
   width: '宽度',
   height: '高度',
   x: '横坐标',
-  y: '纵坐标'
+  y: '纵坐标',
+  borderRadius: '圆角半径'
 };
 
 export const clockPropNameMap = {
@@ -50,7 +54,8 @@ export const clockPropNameMap = {
   width: '宽度',
   height: '高度',
   x: '横坐标',
-  y: '纵坐标'
+  y: '纵坐标',
+  borderRadius: '圆角半径'
 };
 
 export const livePropNameMap = {
@@ -59,5 +64,6 @@ export const livePropNameMap = {
   width: '宽度',
   height: '高度',
   x: '横坐标',
-  y: '纵坐标'
+  y: '纵坐标',
+  borderRadius: '圆角半径'
 };