Compare commits
2 Commits
7d67e0f2ef
...
a3d2ab897b
Author | SHA1 | Date |
---|---|---|
|
a3d2ab897b | |
|
b97647a711 |
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div :style="{ 'height': height + 'px' }" ref="chart"> </div>
|
||||
<div style="height: 100%;" ref="chart"> </div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -11,9 +11,6 @@ export default {
|
|||
},
|
||||
yaxis: {
|
||||
type: Boolean
|
||||
},
|
||||
height: {
|
||||
type: Number
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
@ -46,7 +43,8 @@ export default {
|
|||
if (objs.unit) {
|
||||
unit = '单位:' + objs.unit
|
||||
}
|
||||
|
||||
let is1K = this.$dpi() == "1K";
|
||||
let is2K = this.$dpi() == "2K";
|
||||
var yAxis = []
|
||||
var grid = ''
|
||||
if (state == true) {
|
||||
|
@ -55,26 +53,27 @@ export default {
|
|||
name: unit,
|
||||
nameTextStyle: { //Y轴那么的样式
|
||||
color: '#42d0ff',
|
||||
fontSize: 14,
|
||||
fontSize: is1K ? 14 : is2K ? 16 : 24,
|
||||
},
|
||||
max: objs.max,
|
||||
type: "value",
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: "#cbdaff",
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 20,
|
||||
},
|
||||
formatter: "{value}",
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#2f4472",
|
||||
color: "#2f4472"
|
||||
},
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#2f4472",
|
||||
color: "#2f4472"
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -90,7 +89,7 @@ export default {
|
|||
{
|
||||
nameTextStyle: { //Y轴那么的样式
|
||||
color: '#42d0ff',
|
||||
fontSize: 14,
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 20,
|
||||
},
|
||||
max: objs.max,
|
||||
type: "value",
|
||||
|
@ -120,10 +119,14 @@ export default {
|
|||
this.option = {
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
textStyle: {
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 20,
|
||||
},
|
||||
axisPointer: {
|
||||
type: "shadow",
|
||||
label: {
|
||||
show: true,
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 20,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
@ -145,7 +148,7 @@ export default {
|
|||
show: true,
|
||||
textStyle: {
|
||||
color: "#cbdaff", //X轴文字颜色
|
||||
fontSize: 14,
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 22,
|
||||
},
|
||||
interval: 0,
|
||||
|
||||
|
@ -156,13 +159,14 @@ export default {
|
|||
{
|
||||
name: objs.legend[0],
|
||||
type: "bar",
|
||||
barWidth: 10,
|
||||
barWidth: is1K ? 10 : is2K ? 10 : 14,
|
||||
barGap: 2,
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#fff"
|
||||
color: "#fff",
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 20,
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
|
@ -184,13 +188,15 @@ export default {
|
|||
{
|
||||
name: objs.legend[1],
|
||||
type: "bar",
|
||||
barWidth: 10,
|
||||
barWidth: is1K ? 10 : is2K ? 10 : 14,
|
||||
barGap: 2,
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: "inside",
|
||||
color: "#fff"
|
||||
color: "#fff",
|
||||
fontSize: is1K ? 14 : is2K ? 14 : 18,
|
||||
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
}
|
||||
<template>
|
||||
<MyDialog v-if="show" v-model="show" width="60vw" height="65vh" class="app-form-dlg">
|
||||
<template slot="title">
|
||||
|
@ -8,9 +9,9 @@
|
|||
<div class="popup-xhz-title">
|
||||
<table>
|
||||
<tr>
|
||||
<td >项目名称:</td>
|
||||
<td>项目名称:</td>
|
||||
<td>{{ applyOrder.projectName }}</td>
|
||||
<td >领料日期:</td>
|
||||
<td>领料日期:</td>
|
||||
<td>{{ applyOrder.addTime }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
|
@ -54,7 +55,7 @@
|
|||
</el-table>
|
||||
</div>
|
||||
<div class="xhz-quality-table">
|
||||
<el-table :data="concretePersonTableDataCarList.data" style="width: 100%" max-height="136">
|
||||
<el-table :data="concretePersonTableDataCarList.data" style="width: 100%" :max-height="table1Height">
|
||||
<el-table-column v-for="(item, idx) in concretePersonTableDataCarList.label" :key="idx"
|
||||
:width="item.width" :label="item.label">
|
||||
<template slot-scope="scope">
|
||||
|
@ -229,8 +230,8 @@ export default {
|
|||
resize() {
|
||||
let is1K = this.$dpi() == "1K";
|
||||
let is2K = this.$dpi() == "2K";
|
||||
this.table1Height = is1K ? 181 : (is2K ? 181 : 181);
|
||||
this.table2Height = is1K ? 136 : (is2K ? 226 : 442);
|
||||
this.table1Height = is1K ? 181 : (is2K ? 181 : 188);
|
||||
this.table2Height = is1K ? 136 : (is2K ? 226 : 470);
|
||||
},
|
||||
loadData() {
|
||||
this.applyOrder = {
|
||||
|
@ -368,7 +369,7 @@ export default {
|
|||
.popup-project-introduction-details {
|
||||
* {
|
||||
font-size: 32px;
|
||||
line-height: 60px;
|
||||
line-height: 90px;
|
||||
}
|
||||
|
||||
.popup-xhz-title {
|
||||
|
@ -377,6 +378,14 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.el-table__row {
|
||||
.cell {
|
||||
height: 90px;
|
||||
}
|
||||
}
|
||||
.el-table__empty-text{
|
||||
height: 90px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,9 +1,8 @@
|
|||
<template>
|
||||
<div class="many-chart-max" ref="process" @mouseover="MouseEnter" @mouseout="MouseLeave" :key="chartWidht">
|
||||
<div class="many-chart-min" :style="{ 'width': (dataList.length * chartWidht) + 'px' }">
|
||||
<div v-for="(item, i) in forData" :key="i" :style="{ 'width': chartWidht + 'px' }">
|
||||
<material-many-bar-chart :yaxis="i == 0 ? true : false" :height="200"
|
||||
:dataList="item"></material-many-bar-chart>
|
||||
<div class="many-chart-min" :style="{ 'width': dataList.length * chartWidht + 'px' }">
|
||||
<div v-for="(item, i) in forData" :key="i" :style="{ 'width': chartWidht + 'px' }" class="many-chart-item">
|
||||
<material-many-bar-chart :yaxis="i == 0 ? true : false" :dataList="item"></material-many-bar-chart>
|
||||
<div class="many-chart-text" style="text-align: center ">{{ item.text }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -40,10 +39,12 @@ export default {
|
|||
setTimeout(() => {
|
||||
let is1K = this.$dpi() == "1K";
|
||||
let is2K = this.$dpi() == "2K";
|
||||
this.count = is1K ? 4 : is2K ? 6 : 8;
|
||||
this.count = is1K ? 4 : is2K ? 4 : 4;
|
||||
|
||||
let width = this.$el.clientWidth
|
||||
this.chartWidht = width / this.count;
|
||||
console.log("chartWidth:", this.chartWidht,width,this.count)
|
||||
|
||||
}, 800);
|
||||
},
|
||||
methods: {
|
||||
|
@ -96,10 +97,33 @@ export default {
|
|||
</script>
|
||||
<style lang="less">
|
||||
.many-chart-max {
|
||||
width: 100% !important;
|
||||
height: 100%;
|
||||
|
||||
.many-chart-text {
|
||||
font-size: 18px;
|
||||
position: relative;
|
||||
top: -4px;
|
||||
}
|
||||
|
||||
.many-chart-min {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 1921px) and (max-width: 2560px) {
|
||||
.many-chart-item {
|
||||
height: calc(100% - 40px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2561px) {
|
||||
.many-chart-item {
|
||||
height: calc(100% - 50px);
|
||||
}
|
||||
|
||||
.many-chart-text {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -216,11 +216,11 @@ export default {
|
|||
this.chartKey++;
|
||||
this.orderDataKey++;
|
||||
this.workerOrderKey++;
|
||||
this.excessNameWidth = is1K ? 250 : is2K ? 150 : 650;
|
||||
this.excessNameWidth = is1K ? 250 : is2K ? 400 : 650;
|
||||
this.excessRateDataKey++;
|
||||
this.excessReasonKey++;
|
||||
this.chart3Height = is1K ? 250 : is2K ? 400 : 600;
|
||||
this.erHeight = is1K ? 20 : is2K ? 30 : 150;
|
||||
this.erHeight = is1K ? 80 : is2K ? 100 : 150;
|
||||
|
||||
},
|
||||
init() {
|
||||
|
@ -415,6 +415,7 @@ export default {
|
|||
this.workerOrderLoading = true
|
||||
let result = await this.$api.machMater.materGetConcreteMaterialActQuantityBuildingNoInfoService(postData)
|
||||
result = result.data;
|
||||
this.workerOrderLoading = false
|
||||
if (result && result.code == '000000' && result.data) {
|
||||
let moreDataTemp = []
|
||||
result.data.forEach(item => {
|
||||
|
@ -464,7 +465,7 @@ export default {
|
|||
} else {
|
||||
this.moreData = []
|
||||
}
|
||||
this.workerOrderLoading = false
|
||||
|
||||
this.workerOrderKey++;
|
||||
|
||||
},
|
||||
|
@ -482,6 +483,7 @@ export default {
|
|||
this.workerOrderLoading = true
|
||||
let result = await this.$api.machMater.materGetConcreteMaterialActQuantityFloorLevelInfoService(postData);
|
||||
result = result.data;
|
||||
this.workerOrderLoading = false
|
||||
if (result && result.code == '000000' && result.data) {
|
||||
let moreDataTemp = []
|
||||
result.data.forEach(item => {
|
||||
|
@ -520,7 +522,7 @@ export default {
|
|||
})
|
||||
})
|
||||
this.moreData = moreDataTemp.sort((prev, next) => prev.time - next.time)
|
||||
this.workerOrderLoading = false
|
||||
|
||||
this.workerOrderKey++;
|
||||
|
||||
}
|
||||
|
@ -897,6 +899,36 @@ export default {
|
|||
}
|
||||
|
||||
@media (min-width: 1921px) and (max-width: 2560px) {
|
||||
.screen-module {
|
||||
&.h33 {
|
||||
height: calc(33% - 7px);
|
||||
}
|
||||
}
|
||||
|
||||
.concrete-module {
|
||||
.xhz-concrete-nav {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.xhz-concrete-chart {
|
||||
|
||||
height: calc(100% - 40px);
|
||||
margin-top: 0px;
|
||||
|
||||
.no-data {
|
||||
|
||||
.no-data-img {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.no-data-text {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.xhz-device-data {
|
||||
.xhz-device-data-min {
|
||||
.survey_content {
|
||||
|
@ -906,9 +938,9 @@ export default {
|
|||
background-size: 90px 70px;
|
||||
|
||||
img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-top: 25px
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-top: 35px
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -969,6 +1001,82 @@ export default {
|
|||
}
|
||||
|
||||
@media (min-width: 2561px) {
|
||||
|
||||
.screen-module {
|
||||
&.h33 {
|
||||
height: calc(33% + 1px);
|
||||
}
|
||||
}
|
||||
|
||||
.concrete-module {
|
||||
.xhz-concrete-nav {
|
||||
margin-top: 0px;
|
||||
|
||||
.sjk-chart-line-title {
|
||||
div {
|
||||
font-size: 30px;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.xhz-concrete-legend {
|
||||
font-size: 28px;
|
||||
|
||||
button {
|
||||
width: 40px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.sjk-chart-line-title-tz {
|
||||
button {
|
||||
font-size: 30px;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.more-btn {
|
||||
font-size: 30px;
|
||||
padding: 10px 20px;
|
||||
|
||||
}
|
||||
|
||||
.header-btn-list {
|
||||
top: 40px;
|
||||
|
||||
.header-btn-list-item {
|
||||
width: 1030px !important;
|
||||
|
||||
.header-btn-list-padding {
|
||||
button {
|
||||
width: 315px !important;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.xhz-concrete-chart {
|
||||
|
||||
height: calc(100% - 120px);
|
||||
margin-top: 30px;
|
||||
|
||||
.no-data {
|
||||
|
||||
.no-data-img {
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.no-data-text {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.xhz-device-data {
|
||||
.xhz-device-data-min {
|
||||
.survey_content {
|
||||
|
|
Loading…
Reference in New Issue