feat: 首页样式调整

dev-deviceSetting
JINGYJ 1 year ago
parent b2189f9c94
commit 2cf846a88b

@ -1,4 +1,5 @@
<svg width="265" height="172" viewBox="0 0 265 172" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="265" height="172" viewBox="0 0 265 172" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect x="1" y="1" width="263" height="169" stroke="#FFCF5F" stroke-opacity="0.4" stroke-width="2"/>
<rect y="1" width="265" height="171" fill="url(#paint0_linear_9937_75626)"/> <rect y="1" width="265" height="171" fill="url(#paint0_linear_9937_75626)"/>
<path d="M248 170.228H264V156.052" stroke="#FFCF5F" stroke-width="2"/> <path d="M248 170.228H264V156.052" stroke="#FFCF5F" stroke-width="2"/>
<path d="M17 170.228H1V156.052" stroke="#FFCF5F" stroke-width="2"/> <path d="M17 170.228H1V156.052" stroke="#FFCF5F" stroke-width="2"/>

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

@ -71,15 +71,23 @@ setOptions(
itemHeight: 8, itemHeight: 8,
data: [ data: [
{ {
name: "间隙告警", name: "螺纹缺陷",
icon: "bar" // icon: "bar" //
}, },
{ {
name: "表面缺陷", name: "PIN间距",
icon: "bar" icon: "bar"
}, },
{ {
name: "厚度达标", name: "压板缺陷",
icon: "bar"
},
{
name: "划伤缺陷",
icon: "bar"
},
{
name: "工件尺寸",
icon: "bar" icon: "bar"
} }
] ]
@ -150,7 +158,7 @@ setOptions(
// }, // },
{ {
//线() //线()
name: "间隙告警", name: "螺纹缺陷",
type: "line", type: "line",
yAxisIndex: 0, yAxisIndex: 0,
data: [246, 246, 246, 180, 160], data: [246, 246, 246, 180, 160],
@ -183,7 +191,7 @@ setOptions(
}, },
{ {
//线() //线()
name: "表面缺陷", name: "PIN间距",
type: "line", type: "line",
yAxisIndex: 0, yAxisIndex: 0,
data: [160, 246, 450, 100, 246], data: [160, 246, 450, 100, 246],
@ -214,7 +222,7 @@ setOptions(
}, },
{ {
//线() //线()
name: "厚度达标", name: "压板缺陷",
type: "line", type: "line",
yAxisIndex: 0, yAxisIndex: 0,
data: [100, 200, 400, 150, 306], data: [100, 200, 400, 150, 306],
@ -242,6 +250,68 @@ setOptions(
emphasis: { emphasis: {
focus: "series" focus: "series"
} }
},
{
//线()
name: "划伤缺陷",
type: "line",
yAxisIndex: 0,
data: [10, 20, 400, 150, 206],
smooth: true,
// showSymbol: false,/
symbolSize: 8,
zlevel: 3,
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "rgba(73,194,245,1)"
},
{
offset: 1,
color: "rgba(73,194,245,0)"
}
])
},
itemStyle: {
//线
color: "#49C2F5"
},
emphasis: {
focus: "series"
}
},
{
//线()
name: "工件尺寸",
type: "line",
yAxisIndex: 0,
data: [150, 250, 500, 50, 36],
smooth: true,
// showSymbol: false,/
symbolSize: 8,
zlevel: 3,
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "rgba(193,133,252,1)"
},
{
offset: 1,
color: "rgba(193,133,252,0)"
}
])
},
itemStyle: {
//线
color: "#972EFF"
},
emphasis: {
focus: "series"
}
} }
], ],
addTooltip: true addTooltip: true

@ -60,8 +60,8 @@
.mid_box { .mid_box {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
width: 205px; width: 210px;
height: 94px; height: 96px;
background: url("@/assets/svg/screenSmallBgCommon.svg") no-repeat; background: url("@/assets/svg/screenSmallBgCommon.svg") no-repeat;
.mid_box_icon { .mid_box_icon {
width: 76px; width: 76px;

Loading…
Cancel
Save