admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改资源管理页面

Browse Source
This commit is contained in:
yjl 2023-01-04 18:34:22 +08:00
parent 219bfcf2b7
commit 85f678f59f
14 changed files with 191 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/videoModule/videoModule.less
View File

@ -1,6 +1,6 @@
.videoOverview{
position: relative;
background-color: #03112b;
// background-color: #03112b;
height: 100%;
.videoTop{
position: absolute;

15
src/views/projectAdmin/common/jChart/bar/JBarChart.vue
View File

@ -29,6 +29,11 @@ export default {
type: Array,
default: () => []
},
legend: {
required: true,
type: Array,
default: () => []
},
yData: {
type: Array,
default: () => []
@ -66,12 +71,12 @@ export default {
},
methods: {
createChart() {
const { title, tooltip, grid, color, xData, yData, series } = this
const { title, tooltip, grid, color, xData, yData, series,legend } = this
const configSeries = (series => {
console.log(series[0].data,'=========================yyyyyyyyyy')
console.log(series[1].data,'=========================yyyyyyyyyy')
// console.log(series[3].data,'=========================yyyyyyyyyy')
// console.log(series[1].data,'=========================yyyyyyyyyy')
if (series.length) {
return series.map(item => ({ name: item.name, type: 'bar', data: item.data, barWidth: 20, itemStyle: item.itemStyle }))
return series.map(item => ({ name: item.name, type: item.type, data: item.data, barWidth: 20, itemStyle: item.itemStyle }))
} else {
return [{ data: yData, type: 'bar', barWidth: 15 }]
}
@ -93,7 +98,7 @@ export default {
left: 20,
itemWidth: 8,
textStyle: { color: '#fff' },
data: [{ name: '计划用量' }, { name: '实际用量' }]
data: legend
},
tooltip,
grid: {

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/bottom1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/bottom2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/bottom3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/bottom4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/top1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/top2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/top3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

BIN
src/views/projectAdmin/fourEngin/assets/images/carbon/top4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

81
src/views/projectAdmin/fourEngin/sourse/leftCenter.vue
View File

@ -14,16 +14,7 @@ export default {
components: { Card, CarTable },
data() {
return {
list: [
{ name: '钢筋', number: '100' },
{ name: '加砌块', number: '50' },
{ name: '混凝土', number: '50' },
{ name: '钢构', number: '100' },
{ name: '砂浆', number: '20' },
{ name: '幕墙', number: '10' },
{ name: '水泥', number: '50' },
{ name: '瓷砖', number: '50' }
]
}
},
mounted() {
@ -58,8 +49,8 @@ export default {
// backgroundColor: '#100c29',
grid: {
top:'0',
left: '15%',
right: '15%',
left: '10%',
right: '10%',
bottom: '0',
containLabel: true
},
@ -80,17 +71,16 @@ export default {
}
},
yAxis: {
type: 'category',
inverse: true,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
inside: true
show: true,
textStyle: {
color: '#FFFFFF', //y轴字体颜色
fontSize:'15px'
},
},
splitLine: {show: false}, //横向的线
axisTick: {show: false}, //y轴的端点
axisLine: {show: false}, //y轴的线
data: ["钢筋","混凝土","砂浆","水泥"]
},
series: [
@ -106,7 +96,7 @@ export default {
}
},
z: 9999,
data: data
data: data,
},
{
type: 'bar',
@ -118,7 +108,18 @@ export default {
color: '#30373f'
}
},
data: [100,100,100,100]
label: {
show: true,
offset: [30, 0],
position: 'right',
align: 'right',
formatter: function(data) {
for (let i = 0; i < data.length; i++) {
return data[i] + '%'
}
}
},
data: data
},
{
// 分隔
@ -171,8 +172,8 @@ export default {
// backgroundColor: '#100c29',
grid: {
top:'0',
left: '15%',
right: '15%',
left: '10%',
right: '10%',
bottom: '0',
containLabel: true
},
@ -193,17 +194,16 @@ export default {
}
},
yAxis: {
type: 'category',
inverse: true,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
inside: true
show: true,
textStyle: {
color: '#FFFFFF', //y轴字体颜色
fontSize:'15px'
},
},
splitLine: {show: false}, //横向的线
axisTick: {show: false}, //y轴的端点
axisLine: {show: false}, //y轴的线
data: ["加砌块","钢构","幕墙","瓷砖"]
},
series: [
@ -231,7 +231,18 @@ export default {
color: '#30373f'
}
},
data: [100,100,100,100]
label: {
show: true,
offset: [30, 0],
position: 'right',
align: 'right',
formatter: function(data) {
for (let i = 0; i < data.length; i++) {
return data[i] + '%'
}
}
},
data: data
},
{
// 分隔

56
src/views/projectAdmin/fourEngin/sourse/leftTop.vue
View File

@ -2,9 +2,17 @@
<Card title="材料统计">
<div class="contentBox">
<div class="person">
<div>材料类别</div>
<div>下拉框一</div>
<div>下拉框二</div>
<div class="typeName">材料类别</div>
<div>
<el-select v-model="typeValue" placeholder="请选择" style="background:transparent;width: 100px;">
<el-option v-for="item in typesList" :key="item" :label="item" :value="item"> </el-option>
</el-select>
</div>
<div style="margin-left: 20px;">
<el-select v-model="yearValue" placeholder="请选择" style="background:transparent;width: 100px;">
<el-option v-for="item in dateList" :key="item" :label="item" :value="item"> </el-option>
</el-select>
</div>
</div>
<div class="carbonEmission">
<div class="photovoltaicOne">
@ -36,7 +44,11 @@ export default {
data(){
return{
messageList:[],
sn:''
sn:'',
typesList:["水泥","钢筋","玻璃"],
dateList:["2021","2022"],
typeValue:"钢筋",
yearValue:"2021"
}
},
mounted(){
@ -88,29 +100,17 @@ export default {
margin-left: 10px;
color: #fff;
.person {
margin-top: 4%;
margin-left: 46%;
height: 20px;
line-height: 25px;
display: flex;
justify-content: end;
div:nth-child(2),div:nth-child(3) {
margin: 5px 5px 10px 0px;
display: inline-block;
width: 88px;
.typeName{
width: 65px;
height: 40px;
text-align: center;
font-weight: 500;
line-height: 40px;
font-size: 16px;
background-image: url(../assets/images/common/num_bg.png);
background-repeat: no-repeat;
background-size: 100%;
color: #6ee4f0;
}
div:nth-child(1){
margin: 5px 5px 10px 0px;
display: inline-block;
width: 88px;
height: 40px;
text-align: center;
line-height: 40px;
font-size: 16px;
margin: 0 20px 0 0;
}
}
@ -223,7 +223,7 @@ export default {
// height: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 25px;
margin-top: 50px;
align-items: center;
justify-content: center;
.photovoltaicOne {
@ -273,4 +273,10 @@ export default {
margin: 79px 0 0 0;
}
}
::v-deep .el-input--suffix .el-input__inner {
background: transparent !important;
color: #fff !important;
border: 1px solid #66D3D8 !important ;
z-index: 999;
}
</style>

52
src/views/projectAdmin/fourEngin/sourse/rightBottom.vue
View File

@ -1,9 +1,12 @@
<template>
<Card title="物资管理">
<div class="list-group">
<div class="list"><MaterialTable title="材料订单" /></div>
<div class="list"><MaterialTable title="材料运单" /></div>
<!-- <div class="list"><MaterialTable title="采购合同" /></div> -->
<Card title="主材累计消耗量">
<div class="flexOutside">
<div v-for="(item, index) in list" :key="index">
<div :style="'background-image:url(' + item.url + ')'" class="item">
<div>{{ item.name }}</div>
<div>{{ item.number }}</div>
</div>
</div>
</div>
</Card>
</template>
@ -14,16 +17,45 @@ import MaterialTable from './components/MaterialTable.vue'
export default {
components: { Card, MaterialTable },
data() {
return {
list: [
{ name: '混凝土', number: '1000t', url: require('../assets/images/carbon/top1.png') },
{ name: '钢筋', number: '500t', url: require('../assets/images/carbon/top2.png') },
{ name: '水泥', number: '100t', url: require('../assets/images/carbon/top3.png') },
{ name: '幕墙', number: '100㎡', url: require('../assets/images/carbon/top4.png') },
{ name: '砂浆', number: '600t', url: require('../assets/images/carbon/bottom1.png') },
{ name: '加砌块', number: '5000t', url: require('../assets/images/carbon/bottom2.png') },
{ name: '瓷砖', number: '200㎡', url: require('../assets/images/carbon/bottom3.png') },
{ name: '钢构', number: '200t', url: require('../assets/images/carbon/bottom4.png') }
]
}
}
}
</script>
<style lang="less" scoped>
.list-group {
height: 100%;
.flexOutside {
display: flex;
justify-content: space-around;
.list {
width: 28%;
flex-wrap: wrap;
justify-content: space-evenly;
}
.item {
width: 280px;
height: 85px;
background-repeat: no-repeat;
background-size: 100%;
text-align: center;
margin-top: 20px;
div:nth-child(1){
font-size: 14px;
color: rgb(91, 183, 222);
padding: 18px 64px 0 0;
}
div:nth-child(2){
font-size: 23px;
font-weight: bold;
margin: 3px 50px 0 0;
}
}
</style>

65
src/views/projectAdmin/fourEngin/sourse/rightTop.vue
View File

@ -1,5 +1,5 @@
<template>
<Card title="主材计划与实际用量对比图">
<Card title="主材进场和消耗对比图">
<div class="typedata">
<div class="containbox">
<!-- <span>物料类型</span>
@ -11,14 +11,20 @@
:value="item.value"
></el-option>
</el-select> -->
<div class="typeName">材料类别</div>
<div style="margin-left:20px;">
<el-select v-model="yearValue" placeholder="请选择" style="background:transparent">
<el-select v-model="typeValue" placeholder="请选择" style="background:transparent;width: 100px;">
<el-option v-for="item in typeList" :key="item" :label="item.label" :value="item"> </el-option>
</el-select>
</div>
<div style="margin-left:20px;">
<el-select v-model="yearValue" placeholder="请选择" style="background:transparent;width: 100px;">
<el-option v-for="item in yearsList" :key="item" :label="item" :value="item"> </el-option>
</el-select>
</div>
</div>
<div class="myChart">
<JBarChart v-if="isblock" :grid="grid" :xData="xData" :series="series" :tooltip="tooltip" />
<JBarChart v-if="isblock" :grid="grid" :xData="xData" :legend="legend" :series="series" :tooltip="tooltip" />
</div>
<div class="dataImg" v-if="yearsList.length==0">
<img src="@/assets/images/noData3.png" alt srcset />
@ -40,6 +46,7 @@ export default {
data() {
return {
time1: [],
typeValue:'水泥',
typeList: [
{
value: '1',
@ -68,6 +75,7 @@ export default {
label: '日'
}
],
legend:["计划用量","实际用量","偏差比例"],
value1: '1',
value2: '1',
grid: ['18%', '2%', '2%', '2%'],
@ -75,6 +83,7 @@ export default {
series: [
{
name: '计划用量',
type:'bar',
data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@ -85,6 +94,7 @@ export default {
},
{
name: '实际用量',
type:'bar',
data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@ -92,7 +102,44 @@ export default {
{ offset: 1, color: '#DE5F2A24' }
])
}
}
},
{
name: "偏差比例",
type: "line",
symbolSize: 10,
symbol: "circle",
smooth: true,
itemStyle: {
normal: {
color: "rgb(206, 190, 69)",
barBorderRadius: 0,
},
},
lineStyle: {
normal: {
width: 4,
color: {
type: "linear",
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0,
color: "rgba(255, 195, 3, 1)", // 0% 处的颜色
},
{
offset: 1,
color: "rgba(255, 195, 3, 1)", // 100% 处的颜色
},
],
global: false, // 缺省为 false
},
},
},
data: [10, 0, 20, 0, 0, 0, 0, 40, 0, 50, 0, 0],
},
],
tooltip: {
trigger: 'axis',
@ -155,15 +202,21 @@ export default {
.containbox {
margin-top: 2%;
margin-left: 80%;
margin-left: 75%;
height: 20px;
line-height: 25px;
display: flex;
span {
margin-left: 15px;
margin-right: 5px;
font-size: 14px;
}
.typeName{
width: 65px;
height: 40px;
font-weight: 500;
line-height: 40px;
}
}
.dataImg{
width: 200px;