Commit c10019bb by liuyong

修改bug

1 parent 21e89caf
Showing with 28 additions and 28 deletions
......@@ -53,8 +53,8 @@
<el-table-column prop="content" label="描述" align="center" width="200" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="图标" align="center">
<template slot-scope="scope">
<!-- <img :src="scope.row.icon" alt="" style="width: 100px;height: 100px;"> -->
<div v-html="scope.row.icon" style="display: flex;justify-content: center;"></div>
<img :src="scope.row.icon" alt="" :style="{ 'width': scope.row.width, 'height': scope.row.height }">
<!-- <div v-html="scope.row.icon" style="display: flex;justify-content: center;"></div> -->
</template>
</el-table-column>
<el-table-column prop="version" label="版本" align="center"></el-table-column>
......@@ -1008,34 +1008,34 @@ export default {
result.data.records.map(item => {
if(item.icon.includes("svg+xml")) {
// const item_icon = item.icon.split("base64,")[1];
// const decode_item_icon = window.atob(item_icon);//svg解码,为字符串
// const svgDocument = new DOMParser().parseFromString(decode_item_icon, 'text/xml');//svg字符串转标签
// // console.log(svgDocument)
// const path = svgDocument.getElementsByTagName('path')[0];
// const rect = svgDocument.getElementsByTagName('rect')[0];
// const ellipse = svgDocument.getElementsByTagName('ellipse')[0];
// const svgTag = svgDocument.getElementsByTagName('svg')[0];
// const svgWidth = Number(svgTag.getAttribute('width').split('px')[0])/2;
// const svgHeight = Number(svgTag.getAttribute('height').split('px')[0])/2;
// item['width'] = svgWidth + 'px';
// item['height'] = svgHeight + 'px';
const item_icon = item.icon.split("base64,")[1];
const decode_item_icon = window.atob(item_icon);//svg解码,为字符串
const svgDocument = new DOMParser().parseFromString(decode_item_icon, 'text/xml');//svg字符串转标签
// console.log(svgDocument)
const path = svgDocument.getElementsByTagName('path')[0];
const rect = svgDocument.getElementsByTagName('rect')[0];
const ellipse = svgDocument.getElementsByTagName('ellipse')[0];
const svgTag = svgDocument.getElementsByTagName('svg')[0];
const svgWidth = Number(svgTag.getAttribute('width').split('px')[0])/2;
const svgHeight = Number(svgTag.getAttribute('height').split('px')[0])/2;
item['width'] = svgWidth + 'px';
item['height'] = svgHeight + 'px';
// if(path) {
// path.setAttribute('fill', item.color);
// }
// if(rect) {
// rect.setAttribute('fill', item.color);
// }
// if(ellipse) {
// ellipse.setAttribute('fill', item.color);
// }
// const svgToString = new XMLSerializer().serializeToString(svgDocument);//svg标签转化为字符串
// const encode_item_icon = window.btoa(svgToString);//base64编码
// item.icon = 'data:image/svg+xml;base64,'+ encode_item_icon;
if(path) {
path.setAttribute('fill', item.color);
}
if(rect) {
rect.setAttribute('fill', item.color);
}
if(ellipse) {
ellipse.setAttribute('fill', item.color);
}
const svgToString = new XMLSerializer().serializeToString(svgDocument);//svg标签转化为字符串
const encode_item_icon = window.btoa(svgToString);//base64编码
item.icon = 'data:image/svg+xml;base64,'+ encode_item_icon;
const svgToString = '<svg style="left: 1px; top: 1px; width: 32px; height: 30px; display: block; position: relative; overflow: hidden; pointer-events: none;"><g style="pointer-events: none;"><g style="pointer-events: none;"></g><g style="pointer-events: none;"><g transform="translate(0.5,0.5)" style="visibility: visible; pointer-events: none;"><rect x="1" y="7.5" width="30" height="15" fill="none" stroke="white" visibility="hidden" stroke-width="9" style="pointer-events: none;"></rect><rect x="1" y="7.5" width="30" height="15" fill="none" stroke="none" style="pointer-events: none;"></rect></g><g style="pointer-events: none;"><g transform="scale(0.5)" style="pointer-events: none;"><foreignObject width="200%" height="200%" style="overflow: visible; text-align: left; pointer-events: none;"><div style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 30px; margin-left: 3px; pointer-events: none;"><div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center; pointer-events: none;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">Text</div></div></div></foreignObject></g></g></g><g style="pointer-events: none;"></g><g style="pointer-events: none;"></g></g></svg>';
item.icon = svgToString;
// const svgToString = '<svg style="left: 1px; top: 1px; width: 32px; height: 30px; display: block; position: relative; overflow: hidden; pointer-events: none;"><g style="pointer-events: none;"><g style="pointer-events: none;"></g><g style="pointer-events: none;"><g transform="translate(0.5,0.5)" style="visibility: visible; pointer-events: none;"><rect x="1" y="7.5" width="30" height="15" fill="none" stroke="white" visibility="hidden" stroke-width="9" style="pointer-events: none;"></rect><rect x="1" y="7.5" width="30" height="15" fill="none" stroke="none" style="pointer-events: none;"></rect></g><g style="pointer-events: none;"><g transform="scale(0.5)" style="pointer-events: none;"><foreignObject width="200%" height="200%" style="overflow: visible; text-align: left; pointer-events: none;"><div style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 58px; height: 1px; padding-top: 30px; margin-left: 3px; pointer-events: none;"><div data-drawio-colors="color: rgb(0, 0, 0); " style="box-sizing: border-box; font-size: 0px; text-align: center; pointer-events: none;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(0, 0, 0); line-height: 1.2; pointer-events: none; white-space: normal; overflow-wrap: normal;">Text</div></div></div></foreignObject></g></g></g><g style="pointer-events: none;"></g><g style="pointer-events: none;"></g></g></svg>';
// item.icon = svgToString;
}else {
item['width'] = 0;
item['height'] = 0;
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!