fix: 修改
时启龙
parent
54ab4606c0
commit
604549b6a5
|
|
@ -1,6 +1,6 @@
|
|||
.DS_Store
|
||||
node_modules
|
||||
/screen-web
|
||||
/scr-web
|
||||
|
||||
|
||||
# local env files
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
{
|
||||
"name": "cmp-screen",
|
||||
"name": "scr-web",
|
||||
"version": "5.6.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
|
|
|
|||
|
|
@ -1,22 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
||||
<link rel="icon" href="<%= BASE_URL %>static/img/logo.png" />
|
||||
<title>高性能数值模拟实验平台</title>
|
||||
</head>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>static/img/shortcut.png">
|
||||
<title>
|
||||
<%= htmlWebpackPlugin.options.title %>
|
||||
</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 888 B |
|
|
@ -1,15 +1,18 @@
|
|||
html,
|
||||
body,
|
||||
#app {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
overflow: hidden !important;
|
||||
font-family: Microsoft YaHei, Hiragino Sans GB;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 16px;
|
||||
overflow: hidden !important;
|
||||
font-family: Microsoft YaHei, Hiragino Sans GB;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-size: 13px;
|
||||
font-size: 13px;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -1,336 +1,335 @@
|
|||
/*边距共有样式*/
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.pull-left {
|
||||
float: left;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.p-none {
|
||||
padding: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.m-xxs {
|
||||
margin: 2px 4px;
|
||||
margin: 2px 4px;
|
||||
}
|
||||
|
||||
.m-xs {
|
||||
margin: 5px;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.m-sm {
|
||||
margin: 10px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.m {
|
||||
margin: 15px;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.m-md {
|
||||
margin: 20px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.m-lg {
|
||||
margin: 30px;
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
.m-xl {
|
||||
margin: 50px;
|
||||
margin: 50px;
|
||||
}
|
||||
|
||||
.m-n {
|
||||
margin: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.m-l-none {
|
||||
margin-left: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.m-l-xs {
|
||||
margin-left: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.m-l-sm {
|
||||
margin-left: 10px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.m-l {
|
||||
margin-left: 15px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.m-l-md {
|
||||
margin-left: 20px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.m-l-lg {
|
||||
margin-left: 30px;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.m-l-xl {
|
||||
margin-left: 40px;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.m-l-xxl {
|
||||
margin-left: 50px;
|
||||
margin-left: 50px;
|
||||
}
|
||||
|
||||
.m-l-n-xxs {
|
||||
margin-left: -1px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.m-l-n-xs {
|
||||
margin-left: -5px;
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
.m-l-n-sm {
|
||||
margin-left: -10px;
|
||||
margin-left: -10px;
|
||||
}
|
||||
|
||||
.m-l-n {
|
||||
margin-left: -15px;
|
||||
margin-left: -15px;
|
||||
}
|
||||
|
||||
.m-l-n-md {
|
||||
margin-left: -20px;
|
||||
margin-left: -20px;
|
||||
}
|
||||
|
||||
.m-l-n-lg {
|
||||
margin-left: -30px;
|
||||
margin-left: -30px;
|
||||
}
|
||||
|
||||
.m-l-n-xl {
|
||||
margin-left: -40px;
|
||||
margin-left: -40px;
|
||||
}
|
||||
|
||||
.m-l-n-xxl {
|
||||
margin-left: -50px;
|
||||
margin-left: -50px;
|
||||
}
|
||||
|
||||
.m-t-none {
|
||||
margin-top: 0 !important;
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.m-t-xxs {
|
||||
margin-top: 1px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.m-t-xs {
|
||||
margin-top: 5px !important;
|
||||
margin-top: 5px !important;
|
||||
}
|
||||
|
||||
.m-t-sm {
|
||||
margin-top: 10px !important;
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
|
||||
.m-t {
|
||||
margin-top: 15px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.m-t-md {
|
||||
margin-top: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.m-t-lg {
|
||||
margin-top: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.m-t-xl {
|
||||
margin-top: 40px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.m-t-xxl {
|
||||
margin-top: 50px;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
.m-t-n-xxs {
|
||||
margin-top: -1px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
.m-t-n-xs {
|
||||
margin-top: -5px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
.m-t-n-7 {
|
||||
margin-top: -7px;
|
||||
margin-top: -7px;
|
||||
}
|
||||
|
||||
.m-t-n-sm {
|
||||
margin-top: -10px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
.m-t-n {
|
||||
margin-top: -15px;
|
||||
margin-top: -15px;
|
||||
}
|
||||
|
||||
.m-t-n-md {
|
||||
margin-top: -20px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.m-t-n-lg {
|
||||
margin-top: -30px;
|
||||
margin-top: -30px;
|
||||
}
|
||||
|
||||
.m-t-n-xl {
|
||||
margin-top: -40px;
|
||||
margin-top: -40px;
|
||||
}
|
||||
|
||||
.m-t-n-xxl {
|
||||
margin-top: -50px;
|
||||
margin-top: -50px;
|
||||
}
|
||||
|
||||
.m-t-n-xxxl {
|
||||
margin-top: -60px;
|
||||
margin-top: -60px;
|
||||
}
|
||||
|
||||
.m-r-none {
|
||||
margin-right: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
|
||||
.m-r-xxs {
|
||||
margin-right: 1px;
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.m-r-xs {
|
||||
margin-right: 5px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.m-r-sm {
|
||||
margin-right: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.m-r {
|
||||
margin-right: 15px !important;
|
||||
margin-right: 15px !important;
|
||||
}
|
||||
|
||||
.m-r-md {
|
||||
margin-right: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.m-r-lg {
|
||||
margin-right: 30px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.m-r-xl {
|
||||
margin-right: 40px;
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.m-r-xxl {
|
||||
margin-right: 50px;
|
||||
margin-right: 50px;
|
||||
}
|
||||
|
||||
.m-r-n-xxs {
|
||||
margin-right: -1px;
|
||||
margin-right: -1px;
|
||||
}
|
||||
|
||||
.m-r-n-xs {
|
||||
margin-right: -5px;
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
.m-r-n-sm {
|
||||
margin-right: -10px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
|
||||
.m-r-n {
|
||||
margin-right: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
|
||||
.m-r-n-md {
|
||||
margin-right: -20px;
|
||||
margin-right: -20px;
|
||||
}
|
||||
|
||||
.m-r-n-lg {
|
||||
margin-right: -30px;
|
||||
margin-right: -30px;
|
||||
}
|
||||
|
||||
.m-r-n-xl {
|
||||
margin-right: -40px;
|
||||
margin-right: -40px;
|
||||
}
|
||||
|
||||
.m-r-n-xxl {
|
||||
margin-right: -50px;
|
||||
margin-right: -50px;
|
||||
}
|
||||
|
||||
.m-b-none {
|
||||
margin-bottom: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.m-b-xxs {
|
||||
margin-bottom: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.m-b-xs {
|
||||
margin-bottom: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.m-b-sm {
|
||||
margin-bottom: 10px !important;
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
|
||||
.m-b {
|
||||
margin-bottom: 15px !important;
|
||||
margin-bottom: 15px !important;
|
||||
}
|
||||
|
||||
.m-b-md {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.m-b-lg {
|
||||
margin-bottom: 30px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.m-b-xl {
|
||||
margin-bottom: 40px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.m-b-xxl {
|
||||
margin-bottom: 50px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.m-b-n-xxs {
|
||||
margin-bottom: -1px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
.m-b-n-xs {
|
||||
margin-bottom: -5px;
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
.m-b-n-sm {
|
||||
margin-bottom: -10px;
|
||||
margin-bottom: -10px;
|
||||
}
|
||||
|
||||
.m-b-n {
|
||||
margin-bottom: -15px;
|
||||
margin-bottom: -15px;
|
||||
}
|
||||
|
||||
.m-b-n-md {
|
||||
margin-bottom: -20px;
|
||||
margin-bottom: -20px;
|
||||
}
|
||||
|
||||
.m-b-n-lg {
|
||||
margin-bottom: -30px;
|
||||
margin-bottom: -30px;
|
||||
}
|
||||
|
||||
.m-b-n-xl {
|
||||
margin-bottom: -40px;
|
||||
margin-bottom: -40px;
|
||||
}
|
||||
|
||||
.m-b-n-xxl {
|
||||
margin-bottom: -50px;
|
||||
margin-bottom: -50px;
|
||||
}
|
||||
|
||||
|
||||
/*颜色共有样式*/
|
||||
|
||||
.btn-info {
|
||||
color: #ffffff !important;
|
||||
background-color: #497edf;
|
||||
border-color: #497edf;
|
||||
color: #ffffff !important;
|
||||
background-color: #497edf;
|
||||
border-color: #497edf;
|
||||
}
|
||||
|
||||
.btn-info:hover,
|
||||
|
|
@ -338,15 +337,15 @@
|
|||
.btn-info:active,
|
||||
.btn-info.active,
|
||||
.open .dropdown-toggle.btn-info {
|
||||
color: #ffffff !important;
|
||||
background-color: #2059c1;
|
||||
border-color: #2059c1;
|
||||
color: #ffffff !important;
|
||||
background-color: #2059c1;
|
||||
border-color: #2059c1;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
color: #ffffff !important;
|
||||
background-color: #27c24c;
|
||||
border-color: #27c24c;
|
||||
color: #ffffff !important;
|
||||
background-color: #27c24c;
|
||||
border-color: #27c24c;
|
||||
}
|
||||
|
||||
.btn-success:hover,
|
||||
|
|
@ -354,15 +353,15 @@
|
|||
.btn-success:active,
|
||||
.btn-success.active,
|
||||
.open .dropdown-toggle.btn-success {
|
||||
color: #ffffff !important;
|
||||
background-color: #23ad44;
|
||||
border-color: #20a03f;
|
||||
color: #ffffff !important;
|
||||
background-color: #23ad44;
|
||||
border-color: #20a03f;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
color: #ffffff !important;
|
||||
background-color: #f05050;
|
||||
border-color: #f05050;
|
||||
color: #ffffff !important;
|
||||
background-color: #f05050;
|
||||
border-color: #f05050;
|
||||
}
|
||||
|
||||
.btn-danger:hover,
|
||||
|
|
@ -370,90 +369,94 @@
|
|||
.btn-danger:active,
|
||||
.btn-danger.active,
|
||||
.open .dropdown-toggle.btn-danger {
|
||||
color: #ffffff !important;
|
||||
background-color: #ee3939;
|
||||
border-color: #ed2a2a;
|
||||
color: #ffffff !important;
|
||||
background-color: #ee3939;
|
||||
border-color: #ed2a2a;
|
||||
}
|
||||
|
||||
.text-info {
|
||||
color: #00aeef !important;
|
||||
color: #00aeef !important;
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: #27c24c !important;
|
||||
color: #27c24c !important;
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
color: #fad733 !important;
|
||||
color: #fad733 !important;
|
||||
}
|
||||
|
||||
.text-danger {
|
||||
color: #f05050;
|
||||
color: #f05050;
|
||||
}
|
||||
|
||||
.text-white {
|
||||
color: #FFF !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.text-left {
|
||||
text-align: left !important;
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center !important;
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right !important;
|
||||
text-align: right !important;
|
||||
}
|
||||
|
||||
|
||||
/*宽度样式*/
|
||||
|
||||
.w-xxs {
|
||||
width: 60px;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.w-xs {
|
||||
width: 90px;
|
||||
width: 90px;
|
||||
}
|
||||
|
||||
.w-110 {
|
||||
width: 110px;
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.w-ss {
|
||||
width: 120px;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.w-sm {
|
||||
width: 150px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.w {
|
||||
width: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.w-md {
|
||||
width: 240px;
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.w-lg {
|
||||
width: 280px;
|
||||
width: 280px;
|
||||
}
|
||||
|
||||
.w-xl {
|
||||
width: 320px;
|
||||
width: 320px;
|
||||
}
|
||||
|
||||
.w-xxl {
|
||||
width: 360px;
|
||||
width: 360px;
|
||||
}
|
||||
|
||||
.w-full {
|
||||
width: 100% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.w-auto {
|
||||
width: auto;
|
||||
width: auto;
|
||||
}
|
||||
.tips {
|
||||
font-size: 16px;
|
||||
color: #d7d6d6;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -13,17 +13,52 @@ export default {
|
|||
timer: null,
|
||||
tableData7: [
|
||||
{
|
||||
data: 50,
|
||||
name: 1621300392
|
||||
data: 52,
|
||||
name: 1680307200
|
||||
},
|
||||
|
||||
{
|
||||
data: 90,
|
||||
name: 1691300392
|
||||
data: 60,
|
||||
name: 1682899200
|
||||
},
|
||||
{
|
||||
data: 58,
|
||||
name: 1685577600
|
||||
},
|
||||
{
|
||||
data: 59,
|
||||
name: 1688169600
|
||||
},
|
||||
{
|
||||
data: 75,
|
||||
name: 1690848000
|
||||
},
|
||||
{
|
||||
data: 59,
|
||||
name: 1693526400
|
||||
},
|
||||
{
|
||||
data: 57,
|
||||
name: 1696118400
|
||||
},
|
||||
{
|
||||
data: 63,
|
||||
name: 1698796800
|
||||
},
|
||||
{
|
||||
data: 71,
|
||||
name: 1701388800
|
||||
},
|
||||
{
|
||||
data: 82,
|
||||
name: 1704067200
|
||||
},
|
||||
{
|
||||
data: 78,
|
||||
name: 1706745600
|
||||
},
|
||||
{
|
||||
data: 70,
|
||||
name: 1729300392
|
||||
name: 1709251200
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -42,7 +77,7 @@ export default {
|
|||
async getQueryRangeData() {
|
||||
const res = await getAverageUtilizationTrend()
|
||||
if (res.status !== 'success') return
|
||||
this.tableData7 = res.data?.result?.[0]?.values?.map(v => {
|
||||
this.tableData7 = res.data?.result?.[0]?.values?.map((v) => {
|
||||
return {
|
||||
name: v[0],
|
||||
data: v[1]
|
||||
|
|
@ -51,8 +86,8 @@ export default {
|
|||
this.getQueryRangeView()
|
||||
},
|
||||
getQueryRangeView() {
|
||||
const ydata = this.tableData7.map(v => parseFloat(v.data).toFixed(2))
|
||||
const xdata = this.tableData7.map(v => {
|
||||
const ydata = this.tableData7.map((v) => parseFloat(v.data).toFixed(2))
|
||||
const xdata = this.tableData7.map((v) => {
|
||||
const date = new Date(v.name * 1000)
|
||||
const year = date.getFullYear()
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0')
|
||||
|
|
@ -60,13 +95,13 @@ export default {
|
|||
const hours = String(date.getHours()).padStart(2, '0')
|
||||
const minutes = String(date.getMinutes()).padStart(2, '0')
|
||||
const seconds = String(date.getSeconds()).padStart(2, '0')
|
||||
return `${year}-${month}-${day}`
|
||||
return `${year}.${month}`
|
||||
})
|
||||
const option = {
|
||||
grid: {
|
||||
left: '0%', // 将 left 设置为 0 确保左边没有留白
|
||||
right: '0%',
|
||||
top: '20%',
|
||||
top: '10%',
|
||||
bottom: '0%',
|
||||
containLabel: true, // 确保标签不会被裁剪
|
||||
show: false
|
||||
|
|
@ -95,7 +130,7 @@ export default {
|
|||
xAxis: {
|
||||
type: 'category',
|
||||
data: xdata,
|
||||
boundaryGap: false,
|
||||
boundaryGap: true,
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
|
|
@ -110,18 +145,20 @@ export default {
|
|||
lineStyle: {
|
||||
color: 'rgba(0,0,0,0.06)'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
padding: [10, 0, 0, 0], // 左、上、右、下的内边距，这里设置左内边距为10
|
||||
rotate: 45,
|
||||
interval: 0, // 强制显示所有标签
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
color: '#fff'
|
||||
}
|
||||
}
|
||||
// axisLabel: {
|
||||
// rotate: 45,
|
||||
// textStyle: {
|
||||
// color: '#fff'
|
||||
// }
|
||||
// }
|
||||
},
|
||||
yAxis: {
|
||||
// name: '出勤人数',
|
||||
nameTextStyle: {
|
||||
color: '#666'
|
||||
color: '#fff'
|
||||
},
|
||||
type: 'value',
|
||||
min: 0,
|
||||
|
|
@ -131,11 +168,11 @@ export default {
|
|||
show: true,
|
||||
interval: 'auto',
|
||||
lineStyle: {
|
||||
color: 'rgba(0,0,0,0.06)'
|
||||
color: '#0079B7'
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: false
|
||||
show: true
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
|
|
@ -143,9 +180,9 @@ export default {
|
|||
}
|
||||
},
|
||||
axisLabel: {
|
||||
margin: 1,
|
||||
margin: 10,
|
||||
textStyle: {
|
||||
fontSize: 10,
|
||||
fontSize: 14,
|
||||
color: '#FFF'
|
||||
}
|
||||
}
|
||||
|
|
@ -153,9 +190,8 @@ export default {
|
|||
series: [
|
||||
{
|
||||
type: 'line',
|
||||
showSymbol: false,
|
||||
symbol: 'emptyCircle',
|
||||
symbolSize: 2,
|
||||
symbolSize: 5,
|
||||
symbol: 'circle',
|
||||
data: ydata,
|
||||
areaStyle: {
|
||||
normal: {
|
||||
|
|
@ -179,26 +215,9 @@ export default {
|
|||
}
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderWidth: 2,
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(0, 82, 212,0.7)'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(0, 82, 212,0.4)'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
}
|
||||
color: '#41FA80', // 使用纯绿色
|
||||
borderColor: '#41FA80', // 边框颜色与填充色相同
|
||||
borderWidth: 1 // 设置较细的边框
|
||||
},
|
||||
lineStyle: {
|
||||
globalCoord: false, // 缺省为 false
|
||||
|
|
@ -212,33 +231,11 @@ export default {
|
|||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(0, 82, 212,0.7)'
|
||||
color: '#41FA80'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(0, 82, 212,0.4)'
|
||||
}
|
||||
],
|
||||
false
|
||||
)
|
||||
}
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
borderWidth: 2,
|
||||
borderColor: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(245,166,35,1)'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(245,166,35,0.8)'
|
||||
color: '#41FA80'
|
||||
}
|
||||
],
|
||||
false
|
||||
|
|
@ -259,6 +256,6 @@ export default {
|
|||
</script>
|
||||
<style scoped>
|
||||
#UsedTrend {
|
||||
height: 100%;
|
||||
height: 90%;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="full-screen-container" :style="style">
|
||||
<slot></slot>
|
||||
<div class="loading" v-if="loading">
|
||||
<dv-decoration-9 style="width:300px;height:300px;">数据加载中</dv-decoration-9>
|
||||
<dv-decoration-9 style="width: 300px; height: 300px">数据加载中</dv-decoration-9>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -28,24 +28,23 @@ export default {
|
|||
},
|
||||
setup(props, context) {
|
||||
const state = reactive({
|
||||
scale: null
|
||||
scale: {
|
||||
wRatio: 1,
|
||||
hRatio: 1
|
||||
}
|
||||
})
|
||||
const style = computed(() => {
|
||||
// 标品: 始终保持1920*1080的宽高比
|
||||
// 改动后: 始终保持占满屏幕, 最宽1920
|
||||
const innerWidth = window.innerWidth > 1920 ? 1920 : window.innerWidth
|
||||
return {
|
||||
width: `${props.width}px`,
|
||||
height: `${props.height}px`,
|
||||
transform: `scale(${innerWidth / 1920},${state.scale})`
|
||||
transform: `scale(${state.scale.wRatio},${state.scale.hRatio})`
|
||||
}
|
||||
})
|
||||
function getScale() {
|
||||
const { width, height } = props
|
||||
const wRatio = window.innerWidth / width
|
||||
const hRatio = window.innerHeight / height
|
||||
// return 1;
|
||||
return wRatio < hRatio ? wRatio : hRatio
|
||||
return { wRatio, hRatio }
|
||||
}
|
||||
function setScale() {
|
||||
state.scale = getScale()
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@
|
|||
{{ title }}
|
||||
</span>
|
||||
<span class="pull-right">
|
||||
<span class="m-r-lg tips">系统使用手册下载</span>
|
||||
<span class="btn m-r">登录入口</span>
|
||||
<a class="m-r-lg tips" href="https://www.baidu.com/" target="_blank">系统使用手册下载</a>
|
||||
<a class="btn m-r" href="https://www.baidu.com/" target="_blank">登录入口</a>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -86,11 +86,6 @@ export default {
|
|||
text-transform: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.tips {
|
||||
font-size: 16px;
|
||||
color: #b7b7b7;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn {
|
||||
padding: 5px;
|
||||
width: 30px;
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ export default {
|
|||
}
|
||||
.table-body {
|
||||
height: calc(100% - 50px);
|
||||
overflow-y: auto;
|
||||
overflow-y: hidden;
|
||||
|
||||
.table-tr {
|
||||
display: flex;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
|
|
@ -50,8 +50,8 @@
|
|||
<img class="intro-img m-t" src="./images/plateform.png" />
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
中科院高性能数值模拟实验平台是低碳智能燃煤发电与超净排放全国重点实验室的核心实验平台之-，以设计标准化、部署模块化，管理可视化，运维智能化为依托，打造满足中国机房设计标准、美国机房设计标准和Uptime
|
||||
Institue的创新性平台，致力于拓展科研手段、深化生产服务，为火力发电、新能源等领域的关键技术、核心装备、系统集成等相关科技研发提供有力支撑。
|
||||
电科院高性能数值模拟实验平台是低碳智能燃煤发电与超净排放全国重点实验室的核心实验平台之一，以设计标准化、部署模块化、管理可视化、运维智能化为依托，打造满足中国机房设计标准、美国机房设计标准和Uptime
|
||||
Institute的创新性平台，致力于拓展科研手段、深化生产服务，为火力发电、新能源等领域的关键技术、核心装备、系统集成等相关科技研发提供有力支撑。
|
||||
</div>
|
||||
<div>平台建筑面积200余平方米，硬件设施智能完善、软件系统高效便捷，主要开展火力发电固体燃料热解与燃烧、气体燃料燃烧、污染物生成与脱除、物质流能量流、全过程控制优化的数值模拟，以及综合能源系统仿真研究等八大研究方向。</div>
|
||||
</div>
|
||||
|
|
@ -107,7 +107,13 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="card mini-card card-border3">
|
||||
<div class="card-title card-title-border1">应用软件集成需求</div>
|
||||
<div class="card-title card-title-border1">
|
||||
应用软件集成需求
|
||||
<div class="btn-group">
|
||||
<a class="tips" href="https://www.baidu.com/" target="_blank">需求提交</a>
|
||||
<a class="tips" href="https://www.baidu.com/" target="_blank">问题建议</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ScrollTable :data="appDemandList" :column-width="['80px']" :columns="['排名', '软件名称', '需求频次']" :options="{ singleHeight: 32 }">
|
||||
<template v-slot="scope">
|
||||
|
|
@ -185,12 +191,14 @@ export default {
|
|||
state.departTrend = res.data.map((item, index) => {
|
||||
return { ...item, rank: index + 1 }
|
||||
})
|
||||
if (state.departTrend.length > 7) state.departTrend.length = 7
|
||||
}
|
||||
const getSoftwareDurationList = async () => {
|
||||
const res = await getSoftwareDuration()
|
||||
state.appTrend = res.data.map((item, index) => {
|
||||
return { ...item, rank: index + 1 }
|
||||
})
|
||||
if (state.appTrend.length > 4) state.appTrend.length = 4
|
||||
}
|
||||
|
||||
const getInUseSoftwareList = async () => {
|
||||
|
|
@ -205,17 +213,19 @@ export default {
|
|||
state.userUseTrend = res.data.map((item, index) => {
|
||||
return { ...item, rank: index + 1 }
|
||||
})
|
||||
if (state.userUseTrend.length > 7) state.userUseTrend.length = 7
|
||||
}
|
||||
const getDemandList = async () => {
|
||||
const res = await getSoftwareIntegrate()
|
||||
state.appDemandList = res.data.map((item, index) => {
|
||||
return { ...item, rank: index + 1 }
|
||||
})
|
||||
if (state.appTrend.length > 4) state.appTrend.length = 4
|
||||
}
|
||||
const getPlateformSumList = async () => {
|
||||
const res = await getPlateformSum()
|
||||
|
||||
res.data.map(item => {
|
||||
res.data.map((item) => {
|
||||
if (item.keyName === 'userNum') {
|
||||
state.introItems[0].value = item.numValue
|
||||
}
|
||||
|
|
@ -308,6 +318,7 @@ export default {
|
|||
.card-title-border2 {
|
||||
background: url('./images/item-header1.png');
|
||||
background-position-x: -33px !important;
|
||||
padding-left: 80px !important;
|
||||
}
|
||||
.p-l-lg {
|
||||
padding-left: 55px;
|
||||
|
|
@ -323,6 +334,7 @@ export default {
|
|||
margin-bottom: 13px;
|
||||
}
|
||||
.card-title {
|
||||
position: relative;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding-left: 70px;
|
||||
|
|
@ -336,6 +348,25 @@ export default {
|
|||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
.btn-group {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
a {
|
||||
background-image: url('./images/buttons.png');
|
||||
background-repeat: no-repeat;
|
||||
width: 115px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
background-size: 100% 220px;
|
||||
background-position: 0px -110px;
|
||||
margin-right: -5px;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.intro-card {
|
||||
height: 680px;
|
||||
.intro-img {
|
||||
|
|
|
|||
Binary file not shown.
Loading…
Reference in New Issue