链接图片查询

This commit is contained in:
shenyanpei
2021-12-02 10:36:01 +08:00
parent 9dd767c50d
commit ec2091875f
3 changed files with 86 additions and 89 deletions
@@ -57,7 +57,7 @@
label="链接图标"> label="链接图标">
<template slot-scope="scope"> <template slot-scope="scope">
<img v-if="scope.row.icon !== ''" style="height: 50px;width: 50px" :src="scope.row.icon"> <img v-if="scope.row.icon !== ''" style="height: 50px;width: 50px" :src="scope.row.icon">
<span v-else>{{'-'}}</span> <span v-else>{{ '-' }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
@@ -154,7 +154,7 @@
<script> <script>
import Sortable from 'sortablejs' import Sortable from 'sortablejs'
import { getImg } from '@/api/linkApi.js' import {getImg} from '@/api/linkApi.js'
export default { export default {
name: "firstLink", name: "firstLink",
@@ -415,11 +415,12 @@ export default {
this.sarStandardsInfoEO.url = row.url this.sarStandardsInfoEO.url = row.url
this.sarStandardsInfoEO.sortId = row.sortId this.sarStandardsInfoEO.sortId = row.sortId
this.sarStandardsInfoEO.icon = row.icon this.sarStandardsInfoEO.icon = row.icon
if (row.id !== '') { if (row.icon !== '') {
let imgId = { let imgId = {
id: row.id id: row.id
} }
getImg(imgId).then(res=>{ // 图片转base64
getImg(imgId).then(res => {
if (res.ok) { if (res.ok) {
const src = const src =
"data:image/png;base64," + "data:image/png;base64," +
@@ -445,26 +446,25 @@ export default {
loading: 'Loading' loading: 'Loading'
}, res => { }, res => {
this.linkList = res.data this.linkList = res.data
res.data.forEach(item=>{ res.data.forEach(item => {
if (item.type === 1) { if (item.type === 1) {
this.linkListFirst.push(item) this.linkListFirst.push(item)
} }
}) })
this.linkListFirst.forEach(item=>{ this.linkListFirst.forEach(item => {
if (item.id !== '') { if (item.icon !== '') {
let imgId = { let imgId = {
id: item.id id: item.id
} }
getImg(imgId).then(res=>{ // 图片转base64
if (res.ok) { getImg(imgId).then(res => {
const src = const src =
"data:image/png;base64," + "data:image/png;base64," +
btoa( btoa(
new Uint8Array(res).reduce( new Uint8Array(res).reduce(
(data, byte) => data + String.fromCharCode(byte), "") (data, byte) => data + String.fromCharCode(byte), "")
) )
item.icon = src item.icon = src
}
}) })
} }
}) })
@@ -526,13 +526,16 @@ export default {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }
.avatar-uploader .el-upload:hover { .avatar-uploader .el-upload:hover {
margin-top: 10px; margin-top: 10px;
border-color: #409EFF; border-color: #409EFF;
} }
.avatar-uploader { .avatar-uploader {
margin-top: 10px; margin-top: 10px;
} }
.avatar-uploader-icon { .avatar-uploader-icon {
font-size: 28px; font-size: 28px;
color: #8c939d; color: #8c939d;
@@ -541,15 +544,18 @@ export default {
line-height: 100px; line-height: 100px;
text-align: center; text-align: center;
} }
.avatar { .avatar {
width: 100px; width: 100px;
height: 100px; height: 100px;
display: block; display: block;
} }
.filter-tree { .filter-tree {
height: calc(~'100% - 50px') height: calc(~'100% - 50px')
} }
/deep/.el-input.is-disabled .el-input__inner {
/deep/ .el-input.is-disabled .el-input__inner {
background-color: #fff; background-color: #fff;
} }
} }
@@ -56,7 +56,8 @@
prop="icon" prop="icon"
label="链接图标"> label="链接图标">
<template slot-scope="scope"> <template slot-scope="scope">
<img style="height: 50px;width: 50px" :src="scope.row.icon"> <img v-if="scope.row.icon !== ''" style="height: 50px;width: 50px" :src="scope.row.icon">
<span v-else>{{ '-' }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
@@ -131,7 +132,6 @@
:before-upload="beforeAvatarUpload"> :before-upload="beforeAvatarUpload">
<img v-if="imageUrl" :src="imageUrl" class="avatar"> <img v-if="imageUrl" :src="imageUrl" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i> <i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<el-form-item label="链接" prop="url" label-width="150px" class="add-form-item"> <el-form-item label="链接" prop="url" label-width="150px" class="add-form-item">
@@ -153,8 +153,9 @@
<script> <script>
import Sortable from 'sortablejs' import Sortable from 'sortablejs'
import { getImg } from '@/api/linkApi.js' import {getImg} from '@/api/linkApi.js'
import listOfCost from "../../../../regulatoryRepository/dataStatis/page/listOfCost"; import listOfCost from "../../../../regulatoryRepository/dataStatis/page/listOfCost";
export default { export default {
name: "secondLink", name: "secondLink",
data() { data() {
@@ -414,20 +415,19 @@ export default {
this.sarStandardsInfoEO.url = row.url this.sarStandardsInfoEO.url = row.url
this.sarStandardsInfoEO.sortId = row.sortId this.sarStandardsInfoEO.sortId = row.sortId
this.sarStandardsInfoEO.icon = row.icon this.sarStandardsInfoEO.icon = row.icon
if (row.id !== '') { if (row.icon !== '') {
let imgId = { let imgId = {
id: row.id id: row.id
} }
getImg(imgId).then(res=>{ // 图片转base64
if (res.ok) { getImg(imgId).then(res => {
const src = const src =
"data:image/png;base64," + "data:image/png;base64," +
btoa( btoa(
new Uint8Array(res).reduce( new Uint8Array(res).reduce(
(data, byte) => data + String.fromCharCode(byte), "") (data, byte) => data + String.fromCharCode(byte), "")
) )
item.icon = src this.imageUrl = src
}
}) })
} }
this.dialogTitle = '修改链接' this.dialogTitle = '修改链接'
@@ -444,17 +444,18 @@ export default {
loading: 'Loading' loading: 'Loading'
}, res => { }, res => {
this.linkList = res.data this.linkList = res.data
res.data.forEach(item=>{ res.data.forEach(item => {
if (item.type === 2) { if (item.type === 2) {
this.linkListSecond.push(item) this.linkListSecond.push(item)
} }
}) })
this.linkListSecond.forEach(item=>{ this.linkListSecond.forEach(item => {
if (item.id !== '') { if (item.icon !== '') {
let imgId = { let imgId = {
id: item.id id: item.id
} }
getImg(imgId).then(res=>{ // 图片转base64
getImg(imgId).then(res => {
if (res.ok) { if (res.ok) {
const src = const src =
"data:image/png;base64," + "data:image/png;base64," +
@@ -525,13 +526,16 @@ export default {
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }
.avatar-uploader .el-upload:hover { .avatar-uploader .el-upload:hover {
margin-top: 10px; margin-top: 10px;
border-color: #409EFF; border-color: #409EFF;
} }
.avatar-uploader { .avatar-uploader {
margin-top: 10px; margin-top: 10px;
} }
.avatar-uploader-icon { .avatar-uploader-icon {
font-size: 28px; font-size: 28px;
color: #8c939d; color: #8c939d;
@@ -540,15 +544,18 @@ export default {
line-height: 100px; line-height: 100px;
text-align: center; text-align: center;
} }
.avatar { .avatar {
width: 100px; width: 100px;
height: 100px; height: 100px;
display: block; display: block;
} }
.filter-tree { .filter-tree {
height: calc(~'100% - 50px') height: calc(~'100% - 50px')
} }
/deep/.el-input.is-disabled .el-input__inner {
/deep/ .el-input.is-disabled .el-input__inner {
background-color: #fff; background-color: #fff;
} }
} }
+36 -52
View File
@@ -57,7 +57,8 @@
</template> </template>
<script> <script>
import { getImg } from '@/api/linkApi.js' import {getImg} from '@/api/linkApi.js'
export default { export default {
name: 'Empennage', name: 'Empennage',
components: {}, components: {},
@@ -105,78 +106,61 @@ export default {
_this: this, _this: this,
loading: 'Loading' loading: 'Loading'
}, res => { }, res => {
/* let b = 0 /* let b = 0
let c = 0 let c = 0
for (let a = 0; a < res.data.length; a++) { for (let a = 0; a < res.data.length; a++) {
b += res.data[a].name.length * 14 + 100 b += res.data[a].name.length * 14 + 100
if (b > width) { if (b > width) {
c = a - 1 c = a - 1
} else { } else {
c = a c = a
} }
}*/ }*/
/*let list /*let list
list = res.data*/ list = res.data*/
res.data.forEach(item=>{ res.data.forEach(item => {
if (item.type === 1) { if (item.type === 1) {
this.linkListFirst.push(item) this.linkListFirst.push(item)
} else if(item.type === 2) { } else if (item.type === 2) {
this.linkListSecond.push(item) this.linkListSecond.push(item)
} }
}) })
this.linkListFirst.forEach(item=>{ this.linkListFirst.forEach(item => {
if (item.id !== '') { if (item.icon !== '') {
let imgId = { let imgId = {
id: item.id id: item.id
} }
getImg(imgId).then(res=>{ // 图片转base64
if (res.ok) { getImg(imgId).then(res => {
const src = const src =
"data:image/png;base64," + "data:image/png;base64," +
btoa( btoa(
new Uint8Array(res).reduce( new Uint8Array(res).reduce(
(data, byte) => data + String.fromCharCode(byte), "") (data, byte) => data + String.fromCharCode(byte), "")
) )
item.icon = src item.icon = src
}
}) })
} }
}) })
this.linkListSecond.forEach(item=>{ this.linkListSecond.forEach(item => {
if (item.id !== '') { if (item.icon !== '') {
let imgId = { let imgId = {
id: item.id id: item.id
} }
getImg(imgId).then(res=>{ // 图片转base64
if (res.ok) { getImg(imgId).then(res => {
const src = const src =
"data:image/png;base64," + "data:image/png;base64," +
btoa( btoa(
new Uint8Array(res).reduce( new Uint8Array(res).reduce(
(data, byte) => data + String.fromCharCode(byte), "") (data, byte) => data + String.fromCharCode(byte), "")
) )
item.icon = src item.icon = src
}
}) })
} }
}) })
}) })
}, },
getImgLink(row) {
let imgId = {
id: row.icon
}
getImg(imgId).then(res=>{
const src =
"data:image/png;base64," +
btoa(
new Uint8Array(res).reduce(
(data, byte) => data + String.fromCharCode(byte), "")
)
this.verifyImg = src;
})
}
}, },
} }