fix 修复图片展示太大的问题
This commit is contained in:
parent
356b80b075
commit
681e0b4875
@ -1,7 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="overflow-overlay h-full m-4 bg-white rounded-2 shadow-lg p-8 flex flex-col justify-between space-y-4">
|
<div class="overflow-overlay h-full m-4 bg-white rounded-2 shadow-lg p-8 flex flex-col justify-between space-y-4">
|
||||||
<div class="border-solid border-2 border-gray-100 rounded-lg p-4 flex space-x-8">
|
<div class="border-solid border-2 border-gray-100 rounded-lg p-4 flex space-x-8 items-center">
|
||||||
<a-image :src="data.image" :width="100"></a-image>
|
<div class="w-100px">
|
||||||
|
<a-image :src="data.image" ></a-image>
|
||||||
|
</div>
|
||||||
<div class="flex justify-between w-full pr-16">
|
<div class="flex justify-between w-full pr-16">
|
||||||
<div class="p-4 flex flex-col justify-between">
|
<div class="p-4 flex flex-col justify-between">
|
||||||
<div class="text-xl font-bold">名称:{{data.name}}</div>
|
<div class="text-xl font-bold">名称:{{data.name}}</div>
|
||||||
|
@ -12,7 +12,9 @@
|
|||||||
<a-table :dataSource="data.list" :columns="columns" :pagination="false" :scroll="{y:1000}" @change="tableChange" rowKey="id">
|
<a-table :dataSource="data.list" :columns="columns" :pagination="false" :scroll="{y:1000}" @change="tableChange" rowKey="id">
|
||||||
<template #bodyCell="{ column, record }">
|
<template #bodyCell="{ column, record }">
|
||||||
<template v-if="column.key === 'image'">
|
<template v-if="column.key === 'image'">
|
||||||
<a-image :width="75" :src="record.image"/>
|
<div class="w-75px h-75px">
|
||||||
|
<a-image :src="record.image"/>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="column.key === 'name'">
|
<template v-else-if="column.key === 'name'">
|
||||||
<router-link target="_blank" :to="{ path: '/article/detail', query: {id: record.id} }">
|
<router-link target="_blank" :to="{ path: '/article/detail', query: {id: record.id} }">
|
||||||
@ -47,7 +49,7 @@
|
|||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
|
|
||||||
import {computed, h, onMounted, reactive, ref, watch} from "vue";
|
import {computed, h, onMounted, reactive, ref} from "vue";
|
||||||
import {LoadingOutlined} from "@ant-design/icons-vue";
|
import {LoadingOutlined} from "@ant-design/icons-vue";
|
||||||
import {message} from "ant-design-vue";
|
import {message} from "ant-design-vue";
|
||||||
import {ListArticles, UpdateArticle} from "@/api/articles.js";
|
import {ListArticles, UpdateArticle} from "@/api/articles.js";
|
||||||
|
Loading…
Reference in New Issue
Block a user