From c110cc60944003c6980b4c43e88a1327b44553d1 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Mon, 16 Oct 2023 10:48:10 +0800
Subject: [PATCH] Merge branch 'feature_1.0'
---
babel.config.js | 1
package-lock.json | 60 ++++++++++++++++++++
package.json | 1
src/views/charts/index.vue | 69 ++++++++++++++++-------
.babelrc | 8 ++
5 files changed, 118 insertions(+), 21 deletions(-)
diff --git a/.babelrc b/.babelrc
new file mode 100644
index 0000000..65f75d7
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,8 @@
+{
+ "presets": [
+ "@babel/preset-env"
+ ],
+ "plugins": [
+ "@babel/plugin-proposal-optional-chaining"
+ ]
+}
\ No newline at end of file
diff --git a/babel.config.js b/babel.config.js
index ba17966..e67517e 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,4 +1,5 @@
module.exports = {
+ plugins: ['@babel/plugin-proposal-optional-chaining'],
presets: [
'@vue/app'
]
diff --git a/package-lock.json b/package-lock.json
index a62ed5f..c1d113b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -308,6 +308,12 @@
"@babel/types": "^7.12.13"
}
},
+ "@babel/helper-string-parser": {
+ "version": "7.22.5",
+ "resolved": "https://registry.npmmirror.com/@babel/helper-string-parser/-/helper-string-parser-7.22.5.tgz",
+ "integrity": "sha512-mM4COjgZox8U+JcXQwPijIZLElkgEpO5rsERVDJTc2qfCDfERyob6k5WegS14SX18IIjv+XD+GrqNumY5JRCDw==",
+ "dev": true
+ },
"@babel/helper-validator-identifier": {
"version": "7.12.11",
"resolved": "https://registry.npm.taobao.org/@babel/helper-validator-identifier/download/@babel/helper-validator-identifier-7.12.11.tgz",
@@ -425,6 +431,51 @@
"@babel/plugin-syntax-optional-catch-binding": "^7.8.3"
}
},
+ "@babel/plugin-proposal-optional-chaining": {
+ "version": "7.21.0",
+ "resolved": "https://registry.npmmirror.com/@babel/plugin-proposal-optional-chaining/-/plugin-proposal-optional-chaining-7.21.0.tgz",
+ "integrity": "sha512-p4zeefM72gpmEe2fkUr/OnOXpWEf8nAgk7ZYVqqfFiyIG7oFfVZcCrU64hWn5xp4tQ9LkV4bTIa5rD0KANpKNA==",
+ "dev": true,
+ "requires": {
+ "@babel/helper-plugin-utils": "^7.20.2",
+ "@babel/helper-skip-transparent-expression-wrappers": "^7.20.0",
+ "@babel/plugin-syntax-optional-chaining": "^7.8.3"
+ },
+ "dependencies": {
+ "@babel/helper-plugin-utils": {
+ "version": "7.22.5",
+ "resolved": "https://registry.npmmirror.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz",
+ "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==",
+ "dev": true
+ },
+ "@babel/helper-skip-transparent-expression-wrappers": {
+ "version": "7.22.5",
+ "resolved": "https://registry.npmmirror.com/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.22.5.tgz",
+ "integrity": "sha512-tK14r66JZKiC43p8Ki33yLBVJKlQDFoA8GYN67lWCDCqoL6EMMSuM9b+Iff2jHaM/RRFYl7K+iiru7hbRqNx8Q==",
+ "dev": true,
+ "requires": {
+ "@babel/types": "^7.22.5"
+ }
+ },
+ "@babel/helper-validator-identifier": {
+ "version": "7.22.20",
+ "resolved": "https://registry.npmmirror.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz",
+ "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==",
+ "dev": true
+ },
+ "@babel/types": {
+ "version": "7.23.0",
+ "resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.23.0.tgz",
+ "integrity": "sha512-0oIyUfKoI3mSqMvsxBdclDwxXKXAUA8v/apZbc+iSyARYou1o8ZGDxbUYyLFoW2arqS2jDGqJuZvv1d/io1axg==",
+ "dev": true,
+ "requires": {
+ "@babel/helper-string-parser": "^7.22.5",
+ "@babel/helper-validator-identifier": "^7.22.20",
+ "to-fast-properties": "^2.0.0"
+ }
+ }
+ }
+ },
"@babel/plugin-proposal-unicode-property-regex": {
"version": "7.12.13",
"resolved": "https://registry.npm.taobao.org/@babel/plugin-proposal-unicode-property-regex/download/@babel/plugin-proposal-unicode-property-regex-7.12.13.tgz",
@@ -498,6 +549,15 @@
"@babel/helper-plugin-utils": "^7.8.0"
}
},
+ "@babel/plugin-syntax-optional-chaining": {
+ "version": "7.8.3",
+ "resolved": "https://registry.npmmirror.com/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.8.3.tgz",
+ "integrity": "sha512-KoK9ErH1MBlCPxV0VANkXW2/dw4vlbGDrFgz8bmUsBGYkFRcbRwMh6cIJubdPrkxRwuGdtCk0v/wPTKbQgBjkg==",
+ "dev": true,
+ "requires": {
+ "@babel/helper-plugin-utils": "^7.8.0"
+ }
+ },
"@babel/plugin-transform-arrow-functions": {
"version": "7.13.0",
"resolved": "https://registry.npm.taobao.org/@babel/plugin-transform-arrow-functions/download/@babel/plugin-transform-arrow-functions-7.13.0.tgz?cache=0&sync_timestamp=1614034822229&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Fplugin-transform-arrow-functions%2Fdownload%2F%40babel%2Fplugin-transform-arrow-functions-7.13.0.tgz",
diff --git a/package.json b/package.json
index 2d6487c..505c898 100644
--- a/package.json
+++ b/package.json
@@ -59,6 +59,7 @@
},
"devDependencies": {
"@babel/core": "7.0.0",
+ "@babel/plugin-proposal-optional-chaining": "^7.21.0",
"@babel/register": "7.0.0",
"@vue/cli-plugin-babel": "3.6.0",
"@vue/cli-plugin-eslint": "3.6.0",
diff --git a/src/views/charts/index.vue b/src/views/charts/index.vue
index 50a1083..40d8e50 100644
--- a/src/views/charts/index.vue
+++ b/src/views/charts/index.vue
@@ -40,17 +40,23 @@
</div>
<LineChart :chart-data="lineChartData" style="height: 40rem" />
<div style="padding: 0px 10px;margin-bottom: 50px;">
- <el-table v-if="searchData.length>0" :data="tableData" border size="mini" style="width: 100%" max-height="250" tooltip-effect>
- <el-table-column prop="rankingTitle" label="������" width="150" align="center">
+ <el-table v-if="searchData.length>0" :data="tableData" border size="mini" style="width: 100%" max-height="250" tooltip-effect="dark">
+ <el-table-column prop="rankingTitle" label="������" width="100" align="center" fixed="left">
<el-table-column
prop="rankingTitle"
+ class-name="rankingTitle"
label="������"
align="center"
- width="150"
+ width="100"
+ fixed="left"
/>
</el-table-column>
<template v-for="(th, thIndex) in thArr">
- <el-table-column :key="thIndex" align="center" :label="th.label" :prop="th.prop" />
+ <el-table-column :key="thIndex" align="center" :label="th.label" :prop="th.prop" :show-overflow-tooltip="true" min-width="120">
+ <template slot-scope="scope">
+ <div style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;" v-html="scope.row[th.prop]" />
+ </template>
+ </el-table-column>
</template>
</el-table>
</div>
@@ -176,17 +182,14 @@
},
tableData() {
const data = []
- const souceData = []
- const firstData = []
const fobj = {}
const sobj = {}
if (this.searchData.length > 0) {
this.searchData.forEach((item, index) => {
fobj['souceData' + index] = this.sortFind(item.deviceData)[0].name
- sobj['souceData' + index] = this.sortFind(item.deviceData)[1].name
+ sobj['souceData' + index] = this.sortFind(item.deviceData)[1]?.name ? this.sortFind(item.deviceData)[1]?.name : '--'
})
}
- const a = [...firstData]
data.push({ ...fobj, rankingTitle: '������������' }, { ...sobj, rankingTitle: '������������' })
console.log('firstData', fobj)
console.log('souceData', sobj)
@@ -303,7 +306,7 @@
const secondeDateList = []
console.log('originalValue', originalValue)
if ((Number(originalValue[0].sensorValue) === Number(0))) {
- return [{ name: '/' }, { name: '/' }]
+ return [{ name: '--' }, { name: '--' }]
}
originalValue.forEach((value, inx) => {
if ((Number(originalValue[0].sensorValue) === Number(value.sensorValue))) {
@@ -312,9 +315,11 @@
})
if (firstIndex.length > 1) {
- firstIndex.forEach(item => {
- a += (originalValue[item].name).replace(/\s+/g, '') + '(' + originalValue[item].sensorValue + ')' + ','
+ a = "<span class='numColor'>" + originalValue[firstIndex[0]].sensorValue + '</span> ' + "<span class='numName'>("
+ firstIndex.forEach((item, index) => {
+ a += (originalValue[item].name).replace(/\s+/g, '') + (index === firstIndex.length - 1 ? '' : ',')
})
+ a += ')</span>'
fiestDateList.push({
name: a
})
@@ -325,15 +330,17 @@
secondeIndex.push(inx)
}
})
- secondeIndex.forEach(item => {
- b += (originalValue[item].name).replace(/\s+/g, '') + '(' + originalValue[item].sensorValue + ')' + ','
+ b = "<span class='numColor'>" + originalValue[secondeIndex[0]].sensorValue + '</span> ' + "<span class='numName'>("
+ secondeIndex.forEach((item, index) => {
+ b += (originalValue[item].name).replace(/\s+/g, '') + (index === secondeIndex.length - 1 ? '' : ',')
})
+ b += ')</span>'
secondeDateList.push({
name: b
})
} else if (firstIndex.length <= 1) {
fiestDateList.push({
- name: (originalValue[0].name).replace(/\s+/g, '') + '(' + originalValue[0].sensorValue + ')'
+ name: "<span class='numColor'>" + originalValue[0].sensorValue + '</span> (' + (originalValue[0].name).replace(/\s+/g, '') + ')'
})
if (originalValue.length > 1) {
originalValue.forEach((value, inx) => {
@@ -341,9 +348,11 @@
secondeIndex.push(inx)
}
})
- secondeIndex.forEach(item => {
- b += (originalValue[item].name).replace(/\s+/g, '') + '(' + originalValue[item].sensorValue + ')' + ','
+ b = "<span class='numColor'>" + originalValue[secondeIndex[0]].sensorValue + '</span> ' + "<span class='numName'>("
+ secondeIndex.forEach((item, index) => {
+ b += (originalValue[item].name).replace(/\s+/g, '') + (index === secondeIndex.length - 1 ? '' : ',')
})
+ b += ')</span>'
secondeDateList.push({
name: b
})
@@ -567,8 +576,7 @@
background-color: grey;
opacity: 0.2;
display: block;
- transform: rotate(-43deg); /*���������������������*/
- transform: rotate(-70deg); /*���������������������*/
+ transform: rotate(299deg); /*���������������������*/
-webkit-transform-origin: top;
transform-origin: top;
}
@@ -583,13 +591,32 @@
background-color: grey;
opacity: 0.2;
display: block;
- transform: rotate(-45deg); /*���������������������*/
- transform: rotate(-70deg); /*���������������������*/
+ transform: rotate(299deg); /*���������������������*/
-webkit-transform-origin: bottom;
transform-origin: bottom;
}
::v-deep .el-table thead.is-group th {
height: 27.4px;
}
-
+::v-deep .el-table thead{
+ color: #000;
+ font-size: 15px;
+}
+::v-deep .el-table tr{
+ font-size: 15px;
+}
+/deep/.numColor{
+ color: red;
+ display: inline-block;
+ margin-right: 8px;
+}
+/deep/.rankingTitle{
+ font-weight: 700;
+ color: #000;
+}
+</style>
+<style>
+.el-tooltip__popper{
+ font-size: 16px!important;
+}
</style>
--
Gitblit v1.8.0