Browse Source

chore: 修复图片裁减响应式

master
wangxiang 2 years ago
parent
commit
012a45ea44
No known key found for this signature in database
GPG Key ID: 1BA7946AB6B232E4
  1. 5
      src/components/Cropper/src/CopperModal.vue
  2. 5
      src/utils/index.ts
  3. 3
      src/views/system/user/sso/SsoModal.vue
  4. 9
      src/views/system/user/sso/index.vue

5
src/components/Cropper/src/CopperModal.vue

@ -113,7 +113,7 @@ @@ -113,7 +113,7 @@
<script lang="ts">
import type { CropendResult, Cropper } from './typing';
import { defineComponent, ref } from 'vue';
import {defineComponent, ref, watchEffect} from 'vue';
import CropperImage from './Cropper.vue';
import { Space, Upload, Avatar, Tooltip } from 'ant-design-vue';
import { useDesign } from '/@/hooks/web/useDesign';
@ -148,6 +148,9 @@ @@ -148,6 +148,9 @@
const { prefixCls } = useDesign('cropper-am');
const [register, { closeModal, setModalProps }] = useModalInner();
const { t } = useI18n();
watchEffect(() => {
src.value = props.src as string;
});
// Block upload
function handleBeforeUpload(file: File) {

5
src/utils/index.ts

@ -9,7 +9,7 @@ @@ -9,7 +9,7 @@
import type { RouteLocationNormalized, RouteRecordNormalized } from 'vue-router';
import type { App, Component } from 'vue';
import { unref } from 'vue';
import { isObject } from '/@/utils/is';
import {isObject, isUrl} from '/@/utils/is';
import { isEmpty, cloneDeep } from 'lodash-es';
import { isDevMode } from '/@/utils/env';
import { useGlobSetting } from '/@/hooks/setting';
@ -145,3 +145,6 @@ export function getCloudProxyUrl(): string { @@ -145,3 +145,6 @@ export function getCloudProxyUrl(): string {
}
return baseUrl;
}
/** 获取OSS代理地址 */
export const getOSSProxyUrl = (url: string) => isUrl(url) ? url : `${apiUrl}${url}`;

3
src/views/system/user/sso/SsoModal.vue

@ -42,6 +42,7 @@ @@ -42,6 +42,7 @@
import { Col, Row } from 'ant-design-vue';
import { CropperAvatar } from '/@/components/Cropper';
import { commonUpload } from '/@/api/platform/core/controller/upload';
import { getOSSProxyUrl } from '/@/utils';
/** 类型规范统一声明定义区域 */
interface WindowState {
@ -116,7 +117,7 @@ @@ -116,7 +117,7 @@
props.title = '编辑用户';
const ssoUser = await getSsoUser(id);
await setFieldsValue(ssoUser);
ssoUser.avatar && (state.avatar = ssoUser.avatar);
ssoUser.avatar && (state.avatar = getOSSProxyUrl(ssoUser.avatar));
break;
}
// :

9
src/views/system/user/sso/index.vue

@ -44,7 +44,7 @@ @@ -44,7 +44,7 @@
/>
</template>
<template v-else-if="column.key === 'avatar'">
<TableImg :size="60" :simpleShow="true" :imgList="getOssImgUrl(text)"/>
<TableImg :size="60" :simpleShow="true" :imgList="[getOSSProxyUrl(text)]"/>
</template>
</template>
</BasicTable>
@ -69,7 +69,7 @@ @@ -69,7 +69,7 @@
import SsoModal from './SsoModal.vue';
import { columns, searchFormSchema } from './sso.data';
import { useMessage } from '/@/hooks/web/useMessage';
import { isUrl } from '/@/utils/is';
import { getOSSProxyUrl } from '/@/utils';
import { useGlobSetting } from '/@/hooks/setting';
interface TableState {
@ -120,14 +120,13 @@ @@ -120,14 +120,13 @@
clickToRowSelect: false,
showIndexColumn: false,
actionColumn: {
width: 220,
width: 240,
title: '操作',
dataIndex: 'action',
fixed: false
},
handleSearchInfoFn: () => clearSelectedRowKeys()
});
const getOssImgUrl = (url: string) => isUrl(url) ? [url] : [apiUrl + url];
/** 处理多选框选中数据 */
function handleSelectionChange(selection?: Recordable) {
@ -185,7 +184,7 @@ @@ -185,7 +184,7 @@
handleSelectionChange,
handleRefreshTable,
handleResetPassword,
getOssImgUrl
getOSSProxyUrl
};
}
});

Loading…
Cancel
Save