@zhangqingcq/vgce 0.1.31 → 0.1.33

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhangqingcq/vgce",
-  "version": "0.1.31",
+  "version": "0.1.33",
   "description": "Vector graphics configure editor. svg组态编辑器。基于vue3.3+ts+element-plus+vite",
   "publishConfig": {
     "access": "public"

package/src/components/svg-editor/index.vue

@@ -45,6 +45,7 @@
 			data?: string
 			saveFile?: boolean
 			mqtt?: { cover: boolean; url: string; user: string; pwd: string; topics: string }
+			slotBackground?: boolean
 		}>(),
 		{
 			saveFile: false,
@@ -54,7 +55,8 @@
 				user: '',
 				pwd: '',
 				topics: ''
-			})
+			}),
+			slotBackground: false
 		}
 	)
 	const globalStore = useGlobalStore(pinia)
@@ -198,7 +200,7 @@
 					style="border-left: 1px solid #efefef"
 				>
 					<el-scrollbar class="el-scroll-pc">
-						<right-panel></right-panel>
+						<right-panel :slotBackground="props.slotBackground"></right-panel>
 					</el-scrollbar>
 				</el-aside>
 			</el-container>

package/src/components/svg-editor/right-panel.vue

@@ -38,6 +38,7 @@
 	const globalStore = useGlobalStore(pinia)
 	const svgEditLayoutStore = useSvgEditLayoutStore(pinia)
 
+	const props = defineProps<{ slotBackground: boolean }>()
 	const activeName = ref('page')
 	const activeNameB = ref('style')
 
@@ -117,7 +118,7 @@
 	<el-tabs class="mx-2 rightTabs" v-if="globalStore.intention != EGlobalStoreIntention.Select" v-model="activeName">
 		<el-tab-pane label="图纸" name="page">
 			<el-form label-width="60px" label-position="left">
-				<el-form-item label="背景色" size="small">
+				<el-form-item label="背景色" size="small" v-if="!props.slotBackground">
 					<el-color-picker v-model="configStore.svg.background_color" />
 				</el-form-item>
 				<el-form-item label="画布" size="small">

package/src/config/files/common-table.vue

@@ -1,48 +1,48 @@
-<script setup lang="ts">
-	import { ElTable, ElTableColumn } from 'element-plus'
-
-	const props = withDefaults(
-		defineProps<{
-			colConfig: ICol[]
-			data: any[]
-			height?: number
-			maxHeight?: number
-			stripe?: boolean
-			border?: boolean
-			size?: string
-			fit?: boolean
-			operateDisplay?: boolean
-			selectionData?: any[]
-		}>(),
-		{
-			colConfig: () => [],
-			data: () => [],
-			height: 200,
-			stripe: false,
-			border: false,
-			fit: false,
-			operateDisplay: false,
-			selectionData: () => []
-		}
-	)
-	const table_props = ref({})
-	watchEffect(() => {
-		const { colConfig, ...temp_props } = props
-		table_props.value = temp_props
-	})
-
-	interface ICol {
-		prop: string
-		label: string
-		width: string
-		fixed: string | boolean
-		sortable: boolean
-		'show-overflow-tooltip': boolean
-	}
-</script>
-
-<template>
-	<el-table v-bind="table_props">
-		<el-table-column v-for="item in props.colConfig" :key="item.prop" v-bind="item"></el-table-column>
-	</el-table>
-</template>
+<script setup lang="ts">
+	import { ElTable, ElTableColumn } from 'element-plus'
+
+	const props = withDefaults(
+		defineProps<{
+			colConfig: ICol[]
+			data: any[]
+			height?: number
+			maxHeight?: number
+			stripe?: boolean
+			border?: boolean
+			size?: string
+			fit?: boolean
+			operateDisplay?: boolean
+			selectionData?: any[]
+		}>(),
+		{
+			colConfig: () => [],
+			data: () => [],
+			height: 200,
+			stripe: false,
+			border: false,
+			fit: false,
+			operateDisplay: false,
+			selectionData: () => []
+		}
+	)
+	const table_props = ref({})
+	watchEffect(() => {
+		const { colConfig, ...temp_props } = props
+		table_props.value = temp_props
+	})
+
+	interface ICol {
+		prop: string
+		label: string
+		width: string
+		fixed: string | boolean
+		sortable: boolean
+		'show-overflow-tooltip': boolean
+	}
+</script>
+
+<template>
+	<el-table v-bind="table_props">
+		<el-table-column v-for="item in props.colConfig" :key="item.prop" v-bind="item"></el-table-column>
+	</el-table>
+</template>

package/src/config/vue/component/common-table.ts

@@ -18,9 +18,9 @@ const t: IConfigItem = {
 			type: EConfigItemPropsType.JsonEdit,
 			val: [
 				{
-					prop: 'date',
+					prop: 'index',
 					label: '序号',
-					width: '120px',
+					'min-width': '80',
 					fixed: false,
 					sortable: false,
 					'show-overflow-tooltip': false
@@ -28,15 +28,15 @@ const t: IConfigItem = {
 				{
 					prop: 'name',
 					label: '名字',
-					width: '120px',
+					'min-width': '120',
 					fixed: false,
 					sortable: false,
 					'show-overflow-tooltip': false
 				},
 				{
-					prop: 'address',
+					prop: 'age',
 					label: '年龄',
-					width: '280px',
+					'min-width': '80',
 					fixed: false,
 					sortable: false,
 					'show-overflow-tooltip': false
@@ -48,31 +48,31 @@ const t: IConfigItem = {
 			type: EConfigItemPropsType.JsonEdit,
 			val: [
 				{
-					date: '1',
+					index: '1',
 					name: 'Jack',
-					address: '34'
+					age: '34'
 				},
 				{
-					date: '2',
+					index: '2',
 					name: 'Marry',
-					address: '18'
+					age: '18'
 				},
 				{
-					date: '3',
+					index: '3',
 					name: 'Lee',
-					address: '23'
+					age: '23'
 				},
 				{
-					date: '4',
+					index: '4',
 					name: 'Steve',
-					address: '31'
+					age: '31'
 				}
 			]
 		},
 		width: {
 			title: '宽度',
 			type: EConfigItemPropsType.InputNumber,
-			val: 350
+			val: 280
 		},
 		height: {
 			title: '高度',

package/types/index.d.ts

@@ -11,6 +11,7 @@ export declare const SvgEditor: DefineComponent<{
 	vueComp?: Record<string, any>
 	saveFile?: boolean
 	mqtt?: { cover: boolean; url: string; user: string; pwd: string; topics: string }
+	slotBackground?: boolean
 	onOnPreview?: (d: Record<string, any>) => void
 	onOnSave?: (d: Record<string, any>) => void
 	onOnReturn?: (d: Record<string, any>) => void