更新修改

This commit is contained in:
熊丽君
2022-01-22 16:33:17 +08:00
parent 0007b23b1e
commit 24501b0ac0
5 changed files with 262 additions and 258 deletions

View File

@ -1,93 +1,94 @@
{ {
"name": "ruoyi", "name": "ruoyi",
"version": "3.7.0", "version": "3.7.0",
"description": "科研生产展示平台", "description": "科研生产展示平台",
"author": "商挈", "author": "商挈",
"license": "MIT", "license": "MIT",
"scripts": { "scripts": {
"dev": "vue-cli-service serve", "dev": "vue-cli-service serve",
"build:prod": "vue-cli-service build", "build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging", "build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview", "preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src" "lint": "eslint --ext .js,.vue src"
}, },
"husky": { "husky": {
"hooks": { "hooks": {
"pre-commit": "lint-staged" "pre-commit": "lint-staged"
} }
}, },
"lint-staged": { "lint-staged": {
"src/**/*.{js,vue}": [ "src/**/*.{js,vue}": [
"eslint --fix", "eslint --fix",
"git add" "git add"
] ]
}, },
"keywords": [ "keywords": [
"vue", "vue",
"admin", "admin",
"dashboard", "dashboard",
"element-ui", "element-ui",
"boilerplate", "boilerplate",
"admin-template", "admin-template",
"management-system" "management-system"
], ],
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://gitee.com/y_project/RuoYi-Vue.git" "url": "https://gitee.com/y_project/RuoYi-Vue.git"
}, },
"dependencies": { "dependencies": {
"@antv/g2plot": "^2.3.40", "@antv/g2plot": "^2.3.40",
"@riophae/vue-treeselect": "0.4.0", "@riophae/vue-treeselect": "0.4.0",
"axios": "0.21.0", "axios": "0.21.0",
"clipboard": "2.0.6", "clipboard": "2.0.6",
"core-js": "3.8.1", "core-js": "3.8.1",
"echarts": "4.9.0", "echarts": "4.9.0",
"echarts-liquidfill": "^2.0.2", "echarts-liquidfill": "^2.0.2",
"element-ui": "2.15.6", "echarts5": "npm:echarts@^5.2.2",
"file-saver": "2.0.5", "element-ui": "2.15.6",
"flv.js": "^1.6.2", "file-saver": "2.0.5",
"fuse.js": "6.4.3", "flv.js": "^1.6.2",
"highlight.js": "9.18.5", "fuse.js": "6.4.3",
"js-beautify": "1.13.0", "highlight.js": "9.18.5",
"js-cookie": "2.2.1", "js-beautify": "1.13.0",
"js-md5": "^0.7.3", "js-cookie": "2.2.1",
"jsencrypt": "3.0.0-rc.1", "js-md5": "^0.7.3",
"nprogress": "0.2.0", "jsencrypt": "3.0.0-rc.1",
"quill": "1.3.7", "nprogress": "0.2.0",
"screenfull": "5.0.2", "quill": "1.3.7",
"sortablejs": "1.10.2", "screenfull": "5.0.2",
"vue": "2.6.12", "sortablejs": "1.10.2",
"vue-count-to": "1.0.13", "vue": "2.6.12",
"vue-cropper": "0.5.5", "vue-count-to": "1.0.13",
"vue-meta": "^2.4.0", "vue-cropper": "0.5.5",
"vue-router": "3.4.9", "vue-meta": "^2.4.0",
"vue-seamless-scroll": "^1.1.23", "vue-router": "3.4.9",
"vuedraggable": "2.24.3", "vue-seamless-scroll": "^1.1.23",
"vuex": "3.6.0" "vuedraggable": "2.24.3",
}, "vuex": "3.6.0"
"devDependencies": { },
"@vue/cli-plugin-babel": "4.4.6", "devDependencies": {
"@vue/cli-plugin-eslint": "4.4.6", "@vue/cli-plugin-babel": "4.4.6",
"@vue/cli-service": "4.4.6", "@vue/cli-plugin-eslint": "4.4.6",
"babel-eslint": "10.1.0", "@vue/cli-service": "4.4.6",
"chalk": "4.1.0", "babel-eslint": "10.1.0",
"connect": "3.6.6", "chalk": "4.1.0",
"eslint": "7.15.0", "connect": "3.6.6",
"eslint-plugin-vue": "7.2.0", "eslint": "7.15.0",
"lint-staged": "10.5.3", "eslint-plugin-vue": "7.2.0",
"runjs": "4.4.2", "lint-staged": "10.5.3",
"sass": "1.32.13", "runjs": "4.4.2",
"sass-loader": "10.1.1", "sass": "1.32.13",
"script-ext-html-webpack-plugin": "2.1.5", "sass-loader": "10.1.1",
"svg-sprite-loader": "5.1.1", "script-ext-html-webpack-plugin": "2.1.5",
"vue-template-compiler": "2.6.12" "svg-sprite-loader": "5.1.1",
}, "vue-template-compiler": "2.6.12"
"engines": { },
"node": ">=8.9", "engines": {
"npm": ">= 3.0.0" "node": ">=8.9",
}, "npm": ">= 3.0.0"
"browserslist": [ },
"> 1%", "browserslist": [
"last 2 versions" "> 1%",
] "last 2 versions"
]
} }

View File

@ -3,19 +3,19 @@
<div class="left1"> <div class="left1">
<left1></left1> <left1></left1>
</div> </div>
<!-- <div class="left2"> <div class="left2">
<left2></left2> <left2></left2>
</div> --> </div>
<!-- <div class="bg1"></div> --> <!-- <div class="bg1"></div> -->
<div class="center1"> <div class="center1">
<!-- <center1></center1> --> <center1></center1>
</div> </div>
<!-- <div class="center2"> <!-- <div class="center2">
<center2></center2> <center2></center2>
</div> --> </div> -->
<div class="right1"> <div class="right1">
<!-- <right1></right1> --> <right1></right1>
</div> </div>
<div class="right2"> <div class="right2">

View File

@ -644,6 +644,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep.el-pagination button { ::v-deep.el-pagination button {
display: none;
color: #fff !important; color: #fff !important;
background-color: unset !important; background-color: unset !important;
} }

View File

@ -96,6 +96,7 @@ import bigScreenTabs from "../components/bigScreenTabs/index.vue";
import colorList from "@/utils/colorPalette"; import colorList from "@/utils/colorPalette";
import echarts from "echarts"; import echarts from "echarts";
import * as echarts5 from "echarts5";
require("echarts/theme/macarons"); // echarts theme require("echarts/theme/macarons"); // echarts theme
import resize from "../../dashboard/mixins/resize"; import resize from "../../dashboard/mixins/resize";
export default { export default {
@ -305,6 +306,15 @@ export default {
} }
}); });
}, },
setXdata(list, item, i) {
// ["", "", "2021", ""];
let arr = [];
for (let i = 0; i < list.length; i++) {
arr.push("");
}
arr[i] = item;
return arr;
},
initChart2() { initChart2() {
this.request({ this.request({
url: "/hx/operating/getCivilIndustryPic", url: "/hx/operating/getCivilIndustryPic",
@ -318,7 +328,6 @@ export default {
// console.log(list.map(e=>(e.filter(e=> e.category == '其他')[0].realQuantity))) // console.log(list.map(e=>(e.filter(e=> e.category == '其他')[0].realQuantity)))
// console.log(list.filter(e => e.category == '其他').map(e => e.realQuantity)) // console.log(list.filter(e => e.category == '其他').map(e => e.realQuantity))
this.initChart3(categoryTotal); this.initChart3(categoryTotal);
var app = {}; var app = {};
var posList = [ var posList = [
"left", "left",
@ -407,7 +416,7 @@ export default {
}; };
var labelOption = { var labelOption = {
show: true, show: false,
position: app.config.position, position: app.config.position,
distance: app.config.distance, distance: app.config.distance,
align: app.config.align, align: app.config.align,
@ -421,8 +430,66 @@ export default {
}, },
}, },
}; };
let newData = [];
for (let i = 0; i < list.length; i++) {
const item = list[i];
const itemLength = item.length;
const listLength = list.length;
if (itemLength > listLength) listLength = itemLength;
for (let j = 0; j < itemLength; j++) {
let arr = Array.apply(null, Array(listLength)).map(() => "");
const item2 = item[j];
if (item2.realQuantity != 0 && item2.realQuantity != null) {
arr[i] = item2.realQuantity;
this.chart2 = echarts.init(this.$refs.chart2); newData.push({
barMaxWidth: 30,
name: item2.category,
type: "bar",
barGap: 0,
label: labelOption,
xAxisIndex: i,
data: arr.splice(0, i + 1),
});
}
}
}
let newRate = [[], [], []];
for (let i = 0; i < list.length; i++) {
const item = list[i];
for (let j = 0; j < item.length; j++) {
const item2 = item[j];
if (item2.category == "隔热") {
if (item2.quantityRate) {
newRate[0].push(item2.quantityRate);
} else {
newRate[0].push(0);
}
}
if (item2.category == "稀土") {
if (item2.quantityRate) {
newRate[1].push(item2.quantityRate);
} else {
newRate[1].push(0);
}
}
if (item2.category == "其他") {
if (item2.quantityRate) {
newRate[2].push(item2.quantityRate);
} else {
newRate[2].push(0);
}
}
// if (item2.realQuantity != 0 && item.planQuantity != 0) {
// const rate = (item2.realQuantity / item2.planQuantity) * 100;
// newRate[i].push(rate > 100 ? 100 : rate);
// } else {
// newRate[i].push(0);
// }
}
}
console.log(newRate);
this.chart2 = echarts5.init(this.$refs.chart2);
this.chart2.setOption({ this.chart2.setOption({
color: colorList, color: colorList,
tooltip: { tooltip: {
@ -457,94 +524,58 @@ export default {
textStyle: { textStyle: {
color: "#fff", color: "#fff",
}, },
data: ["Forest", "Steppe", "Desert"], data: [
}, "隔热",
toolbox: { "稀土",
show: true, "其他",
orient: "vertical", "隔热完成率",
left: "right", "稀土完成率",
top: "center", "其他完成率",
feature: { ],
mark: { show: true },
dataView: { show: true, readOnly: false },
magicType: {
show: true,
type: ["line", "bar", "stack", "tiled"],
},
restore: { show: true },
saveAsImage: { show: true },
},
}, },
// echars 转折线和 echars下载
// toolbox: {
// show: true,
// orient: "vertical",
// left: "right",
// top: "center",
// feature: {
// mark: { show: true },
// dataView: { show: true, readOnly: false },
// magicType: {
// show: true,
// type: ["line", "bar", "stack", "tiled"],
// },
// restore: { show: true },
// saveAsImage: { show: true },
// },
// },
dataZoom: { dataZoom: {
type: "slider", type: "slider",
start: 0, start: 0,
end: 50, end: 100,
textStyle: { textStyle: {
color: "#fff", color: "#fff",
}, },
}, },
xAxis: [ xAxis: [
{ ...monthList.map((e, i) => {
type: "category", return {
axisTick: { show: false }, type: "category",
position: "bottom", axisTick: { show: false },
data: ["2012", "", "", "", ""], position: "bottom",
axisLine: { data: this.setXdata(monthList, e, i),
lineStyle: { axisLine: {
color: "rgb(255, 255, 255)", lineStyle: {
color: "rgb(255, 255, 255)",
},
}, },
}, };
}, }),
{
type: "category",
axisTick: { show: false },
position: "bottom",
data: ["", "2013", "", "", ""],
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
{
type: "category",
axisTick: { show: false },
position: "bottom",
data: ["", "", "2014", "", ""],
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
{
type: "category",
axisTick: { show: false },
position: "bottom",
data: ["", "", "", "2015", ""],
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
{
type: "category",
axisTick: { show: false },
position: "bottom",
data: ["", "", "", "", "2016"],
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
], ],
yAxis: [ yAxis: [
{ {
min: 0, min: 0,
max: 100,
interval: 20,
splitLine: { splitLine: {
show: true, show: true,
// 改变轴线颜色 // 改变轴线颜色
@ -562,96 +593,67 @@ export default {
}, },
}, },
}, },
{
type: "value",
min: 0,
max: 100,
// interval: 5,
axisLabel: {
formatter: "{value} %",
},
splitLine: {
show: false, //不显示网格线
},
splitArea: {
show: false, //不显示网格区域
},
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
], ],
series: [ series: [
...newData,
{ {
name: "Forest", name: "隔热完成率",
type: "bar", type: "line",
barGap: 0, yAxisIndex: 1,
label: labelOption, smooth: false,
xAxisIndex: 0, data: newRate[0],
data: [320], itemStyle: {
normal: {
color: colorList[0],
},
},
symbol: "none",
}, },
{ {
name: "Steppe", name: "稀土完成率",
type: "bar", type: "line",
label: labelOption, yAxisIndex: 1,
xAxisIndex: 0, smooth: false,
data: [220], data: newRate[1],
itemStyle: {
normal: {
color: colorList[1],
},
},
symbol: "none",
}, },
{ {
name: "Desert", name: "其他完成率",
type: "bar", type: "line",
label: labelOption, yAxisIndex: 1,
xAxisIndex: 0, smooth: false,
data: [332], data: newRate[2],
}, itemStyle: {
{ normal: {
name: "Forest", color: colorList[2],
type: "bar", },
barGap: 0, },
label: labelOption, symbol: "none",
xAxisIndex: 1,
data: ["", 320],
},
{
name: "Steppe",
type: "bar",
label: labelOption,
xAxisIndex: 1,
data: ["", 220],
},
{
name: "Desert",
type: "bar",
label: labelOption,
xAxisIndex: 1,
data: ["", 232],
},
{
name: "Forest",
type: "bar",
barGap: 0,
label: labelOption,
xAxisIndex: 2,
data: ["", "", 320],
},
{
name: "Steppe",
type: "bar",
label: labelOption,
xAxisIndex: 2,
data: ["", "", 420],
},
{
name: "Desert",
type: "bar",
label: labelOption,
xAxisIndex: 2,
data: ["", "", 232],
},
{
name: "Forest",
type: "bar",
barGap: 0,
label: labelOption,
xAxisIndex: 3,
data: ["", "", "", 320],
},
{
name: "Forest",
type: "bar",
barGap: 0,
label: labelOption,
xAxisIndex: 4,
data: ["", "", "", "", 620],
},
{
name: "Steppe",
type: "bar",
label: labelOption,
xAxisIndex: 4,
data: ["", "", "", "", 290],
}, },
], ],
}); });

View File

@ -51,8 +51,8 @@
<div><span style="font-weight: bold">产品错漏检率</span></div> <div><span style="font-weight: bold">产品错漏检率</span></div>
<div class="box"> <div class="box">
<span <span
>{{ dataInfo.errorCheckRate.toFixed(2) }}%/{{ >{{ dataInfo.realErrorCheckRate }}%/{{
dataInfo.leakCheckRate.toFixed(2) dataInfo.targetErrorCheckRate
}}%</span }}%</span
> >
</div> </div>
@ -72,7 +72,7 @@
<div class="data-item"> <div class="data-item">
<div><span style="font-weight: bold">质量检查完成率</span></div> <div><span style="font-weight: bold">质量检查完成率</span></div>
<div class="box"> <div class="box">
<span>{{ dataInfo.checkCompleteRate }}</span <span>{{ dataInfo.checkCompleteRate.toFixed(2) }}</span
>%<span style="color: #55c5a2; margin: 0 5px; font-size: 16px">{{ >%<span style="color: #55c5a2; margin: 0 5px; font-size: 16px">{{
dataInfo.qualityNotificationCompleteTotal dataInfo.qualityNotificationCompleteTotal
}}</span> }}</span>