@xilonglab/vue-main 1.3.21 → 1.3.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xilonglab/vue-main",
-  "version": "1.3.21",
+  "version": "1.3.25",
   "description": "xilong vue main",
   "main": "packages/index.js",
   "scripts": {

package/packages/else/XlBoxImage.vue

@@ -0,0 +1,55 @@
+<script setup>
+defineOptions({ name: "XlBoxImage" })
+
+import { computed } from 'vue'
+
+const props = defineProps({
+    value: {
+        type: Object,
+        default: () => ({})
+    },
+    width: {
+        type: Number,
+        default: 100
+    },
+    height: {
+        type: Number,
+        default: 100
+    },
+})
+
+const imageSrc = computed(() => {
+    if (props.value && props.value.uri) {
+        return `/storage/${props.value.uri}`
+    }
+    return ''
+})
+
+const imageStyle = computed(() => {
+    const style = {}
+    if (props.value && props.value.width) {
+        style.width = `${props.value.width}px`
+    }
+    if (props.value && props.value.height) {
+        style.height = `${props.value.height}px`
+    }
+    style.maxWidth = `${props.width}px`
+    style.maxHeight = `${props.height}px`
+    return style
+})
+
+</script>
+
+<template>
+    <img v-if="imageSrc" 
+         class="xl-box-image" 
+         :src="imageSrc" 
+         :style="imageStyle" />
+</template>
+
+<style lang="less" scoped>
+.xl-box-image {
+    object-fit: contain;
+}
+</style>
+

package/packages/view/XlDialogColumns.vue

@@ -15,12 +15,8 @@ const props = defineProps({
 
 <template>
     <template v-for="col in columns" :key="col.prop">
-        <slot
-            v-if="col.slot"
-            :name="col.slot"
-        />
         <xl-form-col
-            v-else-if="col.form"
+            v-if="col.form"
             :span="col.form.span"
             :l="col.label"
             :p="col.prop"

package/packages/form/XlBoxImage.vue

@@ -1,59 +0,0 @@
-<script setup>
-defineOptions({ name: "XlBoxImage" })
-
-import { computed } from 'vue'
-
-const props = defineProps({
-    value: {
-        type: Object,
-        default: () => ({})
-    },
-    boxwidth: {
-        type: Number,
-        default: 100
-    },
-    boxheight: {
-        type: Number,
-        default: 100
-    },
-})
-
-const imageSrc = computed(() => {
-    if (props.value && props.value.uri) {
-        return `/storage/${props.value.uri}`
-    }
-    return ''
-})
-
-</script>
-
-<template>
-    <div class="xl-box-image" 
-         :style="{ 
-             width: `${boxwidth}px`, 
-             height: `${boxheight}px` 
-         }">
-        <img v-if="imageSrc" 
-             class="image" 
-             :src="imageSrc" />
-    </div>
-</template>
-
-<style lang="less" scoped>
-.xl-box-image {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    overflow: hidden;
-    border: 1px solid var(--el-border-color);
-    border-radius: 4px;
-
-    .image {
-        max-width: 100%;
-        max-height: 100%;
-        display: block;
-        object-fit: contain;
-    }
-}
-</style>
-