From ef377f10efbf876bd5e8e9ffa65a5818c4969409 Mon Sep 17 00:00:00 2001
From: jiangping <jp@doumee.com>
Date: 星期三, 12 六月 2024 11:07:30 +0800
Subject: [PATCH] 最新版本
---
admin/src/components/common/ImageCropper.vue | 32 ++++++++++++++++++--------------
1 files changed, 18 insertions(+), 14 deletions(-)
diff --git a/admin/src/components/common/ImageCropper.vue b/admin/src/components/common/ImageCropper.vue
index d15179c..37517a2 100644
--- a/admin/src/components/common/ImageCropper.vue
+++ b/admin/src/components/common/ImageCropper.vue
@@ -19,7 +19,7 @@
></vue-cropper>
</div>
<div class="previews">
- <img style="width: 100px;height: 100px;border-radius: 50%;object-fit: cover" :src="cutImgSrc" alt="鍥剧墖">
+ <img style="width: 150px;height: 150px;border-radius1: 50%;object-fit: cover" :src="cutImgSrc" alt="鍥剧墖">
</div>
</div>
</div>
@@ -74,11 +74,11 @@
autoCrop: true,
canMove: false,
centerBox: true,
- height: 300,
- width: 300,
- outputSize:{width: 300, height: 300},
- autoCropWidth: 300,
- autoCropHeight: 300,
+ height: 500,
+ width: 500,
+ outputSize:{width: 500, height: 500 },
+ autoCropWidth: 500,
+ autoCropHeight: 500,
fixed: true,
fixedNumber: [1, 1]
},
@@ -171,10 +171,12 @@
.iconShot {
.icon-dialog {
.clip {
+ display: flex;
.img {
- height: 400px;
+ flex: 7.5;
+ height: 500px;
+ //float: left;
// display: inline-block;
-
.vue-cropper {
background-image: none;
}
@@ -187,13 +189,15 @@
}
.previews {
- width: 100%;
- height: 100px;
- position: relative;
+ //width: 100px;
+ flex: 2.5;
+ //float: right;
+ height: 200px;
+ //position: relative;
>img {
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
+ //position: absolute;
+ //left: 50%;
+ transform: translate(35%, 50px);
max-height: 100%;
}
}
--
Gitblit v1.9.3