yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

style: code style

pull/80/MERGE
xingyu4j 2025-04-23 17:05:51 +08:00
parent 7fdc4d91e9
commit b720cf049d
1 changed files with 18 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
apps/web-antd/src/components/cropper/cropper-modal.vue
View File

@ -1,16 +1,23 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from 'vue'; import type { PropType } from 'vue';
import type { CropendResult, Cropper } from './typing'; import type { CropendResult, Cropper } from './typing';
import { ref } from 'vue'; import { ref } from 'vue';
import { useVbenModal } from '@vben/common-ui'; import { useVbenModal } from '@vben/common-ui';
import { $t as t } from '@vben/locales'; import { $t as t } from '@vben/locales';
import { Avatar, message, Space, Tooltip, Upload, Button } from 'ant-design-vue';
import { dataURLtoBlob, isFunction } from '@vben/utils'; import { dataURLtoBlob, isFunction } from '@vben/utils';
import {
Avatar,
Button,
message,
Space,
Tooltip,
Upload,
} from 'ant-design-vue';
import CropperImage from './cropper.vue'; import CropperImage from './cropper.vue';
type apiFunParams = { file: Blob; filename: string; name: string }; type apiFunParams = { file: Blob; filename: string; name: string };
@ -139,10 +146,7 @@ async function handleOk() {
:file-list="[]" :file-list="[]"
accept="image/*" accept="image/*"
> >
<Tooltip <Tooltip :title="t('ui.cropper.selectImage')" placement="bottom">
:title="t('ui.cropper.selectImage')"
placement="bottom"
>
<Button size="small" type="primary"> <Button size="small" type="primary">
<template #icon> <template #icon>
<div class="flex items-center justify-center"> <div class="flex items-center justify-center">
@ -153,10 +157,7 @@ async function handleOk() {
</Tooltip> </Tooltip>
</Upload> </Upload>
<Space> <Space>
<Tooltip <Tooltip :title="t('ui.cropper.btn_reset')" placement="bottom">
:title="t('ui.cropper.btn_reset')"
placement="bottom"
>
<Button <Button
:disabled="!src" :disabled="!src"
size="small" size="small"
@ -209,10 +210,7 @@ async function handleOk() {
</template> </template>
</Button> </Button>
</Tooltip> </Tooltip>
<Tooltip <Tooltip :title="t('ui.cropper.btn_scale_x')" placement="bottom">
:title="t('ui.cropper.btn_scale_x')"
placement="bottom"
>
<Button <Button
:disabled="!src" :disabled="!src"
size="small" size="small"
@ -226,10 +224,7 @@ async function handleOk() {
</template> </template>
</Button> </Button>
</Tooltip> </Tooltip>
<Tooltip <Tooltip :title="t('ui.cropper.btn_scale_y')" placement="bottom">
:title="t('ui.cropper.btn_scale_y')"
placement="bottom"
>
<Button <Button
:disabled="!src" :disabled="!src"
size="small" size="small"
@ -243,10 +238,7 @@ async function handleOk() {
</template> </template>
</Button> </Button>
</Tooltip> </Tooltip>
<Tooltip <Tooltip :title="t('ui.cropper.btn_zoom_in')" placement="bottom">
:title="t('ui.cropper.btn_zoom_in')"
placement="bottom"
>
<Button <Button
:disabled="!src" :disabled="!src"
size="small" size="small"
@ -260,10 +252,7 @@ async function handleOk() {
</template> </template>
</Button> </Button>
</Tooltip> </Tooltip>
<Tooltip <Tooltip :title="t('ui.cropper.btn_zoom_out')" placement="bottom">
:title="t('ui.cropper.btn_zoom_out')"
placement="bottom"
>
<Button <Button
:disabled="!src" :disabled="!src"
size="small" size="small"
@ -321,7 +310,8 @@ async function handleOk() {
&-cropper { &-cropper {
height: 300px; height: 300px;
background: #eee; background: #eee;
background-image: linear-gradient( background-image:
linear-gradient(
45deg, 45deg,
rgb(0 0 0 / 25%) 25%, rgb(0 0 0 / 25%) 25%,
transparent 0, transparent 0,