开发材料管理功能
parent
48daa70fcd
commit
7d67e0f2ef
|
|
@ -211,6 +211,24 @@ const materGetConcreteOrderDetailsInfoService=data=>{
|
|||
})
|
||||
}
|
||||
|
||||
//材料销号制-工单运输信息
|
||||
const materGetConcreteOrderMSSelectService=data=>{
|
||||
return request({
|
||||
url: '/manage/bgscreen/machMater/materGetConcreteOrderMSSelectService',
|
||||
method: 'get',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
|
||||
//材料销号制-工单人员信息
|
||||
const materGetFlowInfo2LogInfoByBusibessIdPageService=data=>{
|
||||
return request({
|
||||
url: '/manage/bgscreen/machMater/materGetFlowInfo2LogInfoByBusibessIdPageService',
|
||||
method: 'get',
|
||||
params: data
|
||||
})
|
||||
}
|
||||
|
||||
export default{
|
||||
machGetManageQuota,
|
||||
machGetEquipmentOverview,
|
||||
|
|
@ -231,5 +249,8 @@ export default{
|
|||
materGetProjectChaoHaoStatisticsRPTService,
|
||||
materGetReportConcreteExceedReasonService,
|
||||
materGetReportConcreteExceedMaterielTopService,
|
||||
materGetConcreteOrderDetailsInfoService
|
||||
materGetConcreteOrderDetailsInfoService,
|
||||
materGetConcreteOrderMSSelectService,
|
||||
materGetFlowInfo2LogInfoByBusibessIdPageService
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,221 @@
|
|||
<template>
|
||||
<div style="width:100%;height:100%" ref="chart"> </div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
width: {
|
||||
type: Number,
|
||||
default: 100,
|
||||
},
|
||||
dataList: {
|
||||
type: [Array, Object],
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
option: {}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.getChartData()
|
||||
},
|
||||
//分类及工时情况
|
||||
getChartData() {
|
||||
var chChartBar = echarts.init(this.$refs.chart);
|
||||
this.echartBar(chChartBar, this.dataList || [])
|
||||
},
|
||||
echartBar(chChart, chartData) {
|
||||
let newPromise = new Promise((resolve) => {
|
||||
resolve()
|
||||
})
|
||||
//然后异步执行echarts的初始化函数
|
||||
newPromise.then(() => {
|
||||
|
||||
let is1K = this.$dpi() == "1K";
|
||||
let is2K = this.$dpi() == "2K";
|
||||
var value = [];
|
||||
var prop = [];
|
||||
var text = [];
|
||||
var zero = []
|
||||
var bgd = []
|
||||
var total = 0;
|
||||
for (let i = chartData.length - 1; i >= 0; i--) {
|
||||
total += chartData[i].value;
|
||||
value.push(chartData[i].value)
|
||||
prop.push(chartData[i].prop)
|
||||
text.push(chartData[i].text)
|
||||
bgd.push(100)
|
||||
zero.push(0)
|
||||
}
|
||||
|
||||
|
||||
var data = []
|
||||
var data_all = new Array(prop.length)
|
||||
for (let i = 0; i < prop.length; i++) {
|
||||
let tmp = new Array(prop.length).fill(0)
|
||||
tmp[i] = prop[i]
|
||||
data.push(tmp)
|
||||
let tmp_all = 0
|
||||
|
||||
for (let j = i; j < prop.length; j++) {
|
||||
tmp_all += prop[j];
|
||||
}
|
||||
data_all[i] = tmp_all.toFixed(1);
|
||||
}
|
||||
|
||||
data_all.splice(0, 1)
|
||||
data_all.push(0)
|
||||
|
||||
var series = [
|
||||
//背景色--------------------我是分割线君------------------------------//
|
||||
{
|
||||
show: true,
|
||||
type: 'bar',
|
||||
barGap: '-100%',
|
||||
barWidth: is1K ? 6 : is2K ? 8 : 10, //统计条宽度
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: 'rgba(27, 61, 133,0.5)',
|
||||
},
|
||||
|
||||
},
|
||||
z: 1,
|
||||
data: bgd
|
||||
},
|
||||
//数据条--------------------我是分割线君------------------------------//
|
||||
{
|
||||
show: true,
|
||||
type: 'bar',
|
||||
xAxisIndex: 1, //代表使用第二个X轴刻度!!!!!!!!!!!!!!!!!!!!!!!!
|
||||
barGap: '-100%',
|
||||
barWidth: is1K ? 6 : is2K ? 8 : 10, //统计条宽度
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: 'rgba(22,203,115,0.05)'
|
||||
},
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
//label 的position位置可以是top bottom left,right,也可以是固定值
|
||||
//在这里需要上下统一对齐,所以用固定值
|
||||
position: [0, is1K ? -25 : is2K ? -30 : -40],
|
||||
rich: { //富文本
|
||||
prop: { //自定义颜色
|
||||
color: '#c6d9fa',
|
||||
fontSize: is1K ? 16 : is2K ? 18 : 28,
|
||||
},
|
||||
index: {
|
||||
color: '#fcbc02',
|
||||
fontStyle: 'italic',
|
||||
padding: [0, 0, 0, 5],
|
||||
fontSize: is1K ? 14 : is2K ? 16 : 20,
|
||||
},
|
||||
name: {
|
||||
width: this.width,
|
||||
color: '#c6d9fa',
|
||||
padding: [0, 0, 0, 10],
|
||||
fontSize: is1K ? 16 : is2K ? 18 : 28,
|
||||
},
|
||||
color: {
|
||||
color: '#8ca2be',
|
||||
fontSize: is1K ? 14 : is2K ? 16 : 20,
|
||||
},
|
||||
arrow: {
|
||||
width: is1K ? 12 : is2K ? 16 : 18,
|
||||
height: is1K ? 8 : is2K ? 10 : 12,
|
||||
backgroundColor: {
|
||||
image: "/cdn/images/WEB_2B7C06210CD44D55BFEE6205A35DE4A7.png",
|
||||
},
|
||||
},
|
||||
|
||||
},
|
||||
formatter: function (data) {
|
||||
//富文本固定格式{colorName|这里填你想要写的内容}
|
||||
return '{arrow|}{index|No.' + (chartData.length - data.dataIndex) + '}{name|' + text[data.dataIndex] + '}{prop|' + prop[data.dataIndex] + '} {color| %}';
|
||||
},
|
||||
}
|
||||
},
|
||||
data: value
|
||||
},
|
||||
]
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
series.push({
|
||||
type: "bar",
|
||||
barWidth: is1K ? 6 : is2K ? 8 : 10,
|
||||
stack: "总",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#41adf5",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#175eac",
|
||||
},
|
||||
]),
|
||||
barBorderRadius: [5, 5, 5, 5],
|
||||
},
|
||||
},
|
||||
data: data[i]
|
||||
})
|
||||
}
|
||||
|
||||
this.option = {
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '2%',
|
||||
bottom: '-8%',
|
||||
top: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
axisLabel: {
|
||||
show: false, //让Y轴数据不显示
|
||||
},
|
||||
itemStyle: {
|
||||
|
||||
},
|
||||
axisTick: {
|
||||
show: false, //隐藏Y轴刻度
|
||||
},
|
||||
axisLine: {
|
||||
show: false, //隐藏Y轴线段
|
||||
},
|
||||
data: text,
|
||||
},
|
||||
|
||||
xAxis: [{
|
||||
show: false,
|
||||
},
|
||||
//由于下边X轴已经是百分比刻度了,所以需要在顶部加一个X轴,刻度是金额,也隐藏掉
|
||||
{
|
||||
show: false,
|
||||
}
|
||||
],
|
||||
series: series
|
||||
};
|
||||
console.log(series,JSON.stringify(this.option) )
|
||||
chChart.setOption(this.option);
|
||||
window.onresize = chChart.resize;
|
||||
})
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
dataList: function () {
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
|
|
@ -221,7 +221,7 @@ export default {
|
|||
},
|
||||
},
|
||||
watch: {
|
||||
data: function () {
|
||||
dataList: function () {
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,384 @@
|
|||
<template>
|
||||
<MyDialog v-if="show" v-model="show" width="60vw" height="65vh" class="app-form-dlg">
|
||||
<template slot="title">
|
||||
{{ title }}
|
||||
</template>
|
||||
|
||||
<div class="popup-project-introduction-details" v-loading="loading">
|
||||
<div class="popup-xhz-title">
|
||||
<table>
|
||||
<tr>
|
||||
<td >项目名称：</td>
|
||||
<td>{{ applyOrder.projectName }}</td>
|
||||
<td >领料日期：</td>
|
||||
<td>{{ applyOrder.addTime }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>申领单类型：</td>
|
||||
<td>{{ applyOrder.applyTypeName }}</td>
|
||||
<td>用料单位：</td>
|
||||
<td>{{ applyOrder.labourName }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>工号全称：</td>
|
||||
<td>{{ applyOrder.applyName }}</td>
|
||||
<td>拌和站名称：</td>
|
||||
<td>{{ applyOrder.makerName }}</td>
|
||||
</tr>
|
||||
<tr v-if="applyOrder.applyName == '56bf890f465311ebba7b7cd30aeb749e'">
|
||||
<td>超耗类型：</td>
|
||||
<td>{{ applyOrder.causeType }}</td>
|
||||
<td>具体原因：</td>
|
||||
<td>{{ applyOrder.causeNote }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="xhz-quality-table">
|
||||
<el-table :data="concreteTableData.data" style="width: 100%" :max-height="table1Height">
|
||||
<el-table-column v-for="(item, idx) in concreteTableData.label" :key="idx" :width="item.width"
|
||||
:label="item.label">
|
||||
<template slot-scope="scope">
|
||||
<div :style="{ 'color': item.color }">{{ scope.row[item.data] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="xhz-quality-table">
|
||||
<el-table :data="concretePersonTableData.data" style="width: 100%" :max-height="table2Height">
|
||||
<el-table-column v-for="(item, idx) in concretePersonTableData.label" :key="idx" :width="item.width"
|
||||
:label="item.label">
|
||||
<template slot-scope="scope">
|
||||
<div :style="{ 'color': scope.row[item.color] }">{{ scope.row[item.data] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="xhz-quality-table">
|
||||
<el-table :data="concretePersonTableDataCarList.data" style="width: 100%" max-height="136">
|
||||
<el-table-column v-for="(item, idx) in concretePersonTableDataCarList.label" :key="idx"
|
||||
:width="item.width" :label="item.label">
|
||||
<template slot-scope="scope">
|
||||
<div :style="{ 'color': scope.row[item.color] }">{{ scope.row[item.data] }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</MyDialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dpi: "",
|
||||
show: false,
|
||||
title: "混凝土申请单",
|
||||
row: null,
|
||||
projectId: "",
|
||||
loading: true,
|
||||
table1Height: 181,
|
||||
table2Height: 226,
|
||||
applyOrder: {
|
||||
projectName: "",
|
||||
addTime: "",
|
||||
applyTypeName: "",
|
||||
labourName: "",
|
||||
applyName: "",
|
||||
makerName: "",
|
||||
causeType: "",
|
||||
causeNote: ""
|
||||
},
|
||||
concreteTableData: {
|
||||
label: [
|
||||
{
|
||||
label: '材料名称',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'materName',
|
||||
},
|
||||
{
|
||||
label: '规格型号',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'materielModel',
|
||||
},
|
||||
{
|
||||
label: '材料单位',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'unit',
|
||||
},
|
||||
{
|
||||
label: '初始设计量',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'initialQuantity',
|
||||
},
|
||||
{
|
||||
label: '损耗系数(%)',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'planLossParam',
|
||||
},
|
||||
{
|
||||
label: '应耗量',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'applyQuantity',
|
||||
},
|
||||
{
|
||||
label: '申请量',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'actQuantity',
|
||||
},
|
||||
{
|
||||
label: '申请原因',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'causeNote',
|
||||
},
|
||||
],
|
||||
data: []
|
||||
},
|
||||
concretePersonTableData: {
|
||||
label: [
|
||||
{
|
||||
label: '流转公司',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'nodeName',
|
||||
},
|
||||
{
|
||||
label: '负责人',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'approvalUserName',
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
width: '',
|
||||
color: 'color',
|
||||
data: 'approvalStatus',
|
||||
},
|
||||
{
|
||||
label: '审核时间',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'approvalTime',
|
||||
},
|
||||
],
|
||||
data: []
|
||||
},
|
||||
concretePersonTableDataCarList: {
|
||||
label: [
|
||||
{
|
||||
label: '发货时间',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'sendTime',
|
||||
},
|
||||
{
|
||||
label: '本车方量',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'bcfl',
|
||||
},
|
||||
{
|
||||
label: '车牌号',
|
||||
width: '',
|
||||
color: 'color',
|
||||
data: 'carNo',
|
||||
},
|
||||
{
|
||||
label: '载重（t)',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'load',
|
||||
},
|
||||
{
|
||||
label: '附件',
|
||||
width: '',
|
||||
color: '',
|
||||
data: 'files',
|
||||
},
|
||||
],
|
||||
data: []
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
||||
showDialog(prjId, row) {
|
||||
this.projectId = prjId;
|
||||
this.row = row;
|
||||
this.loading = true;
|
||||
this.dpi = this.$dpi();
|
||||
window.addEventListener("resize", () => {
|
||||
if (this.dpi != this.$dpi()) {
|
||||
this.dpi = this.$dpi();
|
||||
this.resize();
|
||||
}
|
||||
});
|
||||
this.resize();
|
||||
this.show = true;
|
||||
this.loadData();
|
||||
},
|
||||
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);
|
||||
},
|
||||
loadData() {
|
||||
this.applyOrder = {
|
||||
projectName: "",
|
||||
addTime: "",
|
||||
applyTypeName: "",
|
||||
labourName: "",
|
||||
applyName: "",
|
||||
makerName: "",
|
||||
causeType: "",
|
||||
causeNote: ""
|
||||
};
|
||||
this.concreteTableData.data = [];
|
||||
this.concretePersonTableData.data = [];
|
||||
this.concretePersonTableDataCarList.data = []
|
||||
let param = {
|
||||
projectId: this.projectId,
|
||||
initialId: this.row.initialId,
|
||||
businessId: this.row.initialId
|
||||
};
|
||||
let ajaxs = [
|
||||
this.$api.machMater.materGetConcreteOrderMSSelectService(param),
|
||||
this.$api.machMater.materGetFlowInfo2LogInfoByBusibessIdPageService(param),
|
||||
];
|
||||
Promise.all(ajaxs).then((res) => {
|
||||
this.loading = false;
|
||||
let result = res[0].data;
|
||||
if (result && result.code == "000000") {
|
||||
let materialDataTemp = []
|
||||
let data = result.data[0]
|
||||
let materialItem = {
|
||||
materName: data.materName,
|
||||
materielModel: data.materielModel,
|
||||
unit: '立方米',
|
||||
initialQuantity: data.initialQuantity,
|
||||
planLossParam: data.planLossParam,
|
||||
applyQuantity: data.applyQuantity,
|
||||
actQuantity: data.actQuantity,
|
||||
causeNote: data.causeNote ? data.causeNote : '',
|
||||
}
|
||||
materialDataTemp.push(materialItem)
|
||||
this.concreteTableData.data = materialDataTemp
|
||||
this.applyOrder = {
|
||||
projectName: data.projectName,
|
||||
addTime: data.addTime,
|
||||
applyTypeName: data.applyTypeName,
|
||||
labourName: data.labourName,
|
||||
applyName: data.applyName,
|
||||
makerName: data.makerName,
|
||||
causeType: data.causeTypeName,
|
||||
causeNote: data.causeNote
|
||||
}
|
||||
}
|
||||
result = res[1].data;
|
||||
if (result && result.code == "000000") {
|
||||
let data = result.data || []
|
||||
let tempApprovalData = []
|
||||
this.concretePersonTableDataCarList.data = []
|
||||
data.forEach((item, index) => {
|
||||
tempApprovalData.push({
|
||||
nodeName: item.nodeName,
|
||||
approvalUserName: item.approvalUserName,
|
||||
approvalStatus: item.approvalUserName == '免审批' ? '免审批' : item.approvalStatus == 1 ? '审批通过' : item.approvalStatus == 2 ? '审批驳回' : item.approvalStatus == 4 ? '自主撤单' : '未审批',
|
||||
approvalTime: this.getApprovalTime(data, index),
|
||||
color: item.approvalUserName == '免审批' ? '#0ebd82' : item.approvalStatus == 1 ? '#0ebd82' : item.approvalStatus == 2 ? '#ff0000' : '#cccccc'
|
||||
})
|
||||
|
||||
for (let i = 0; i < item.receipt; i++) {
|
||||
this.concretePersonTableDataCarList.data.push({
|
||||
"sendTime": item.addTime,
|
||||
"bcfl": "8",
|
||||
"carNo": this.carList[Math.floor(Math.random() * (19)) + 1],
|
||||
"load": "19.9",
|
||||
"files": ""
|
||||
})
|
||||
}
|
||||
})
|
||||
this.concretePersonTableData.data = tempApprovalData
|
||||
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
getApprovalTime(data, index) {
|
||||
if (data[index].approvalUserName != '免审批') {
|
||||
return data[index].approvalTime
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
if (data[index - i].approvalUserName != '免审批') {
|
||||
return data[index - i].approvalTime
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.app-form-dlg {
|
||||
.popup-project-introduction-min {
|
||||
transform: translateY(20%);
|
||||
min-width: 960px;
|
||||
min-height: 550px;
|
||||
|
||||
.popup-project-introduction-details {
|
||||
padding: 0px;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@media (min-width: 1921px) and (max-width: 2560px) {
|
||||
.machine-info-dlg {
|
||||
.popup-project-introduction-min {
|
||||
.popup-project-introduction-details {
|
||||
* {
|
||||
font-size: 24px;
|
||||
line-height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2561px) {
|
||||
.app-form-dlg {
|
||||
.popup-project-introduction-min {
|
||||
.popup-project-introduction-details {
|
||||
* {
|
||||
font-size: 32px;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
.popup-xhz-title {
|
||||
td:nth-child(odd) {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import manyBarChart from './manyBarChart.vue'
|
||||
import manyBarChart from '../../../components/manyBarChart.vue'
|
||||
export default {
|
||||
components: {
|
||||
'material-many-bar-chart': manyBarChart
|
||||
|
|
@ -99,7 +99,7 @@ export default {
|
|||
.many-chart-text {
|
||||
font-size: 18px;
|
||||
position: relative;
|
||||
top: -10px;
|
||||
top: -4px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,8 @@
|
|||
<el-col :span="18" class="h100">
|
||||
<module-one-2-3 label="近期工单" class="h66 order-data-module">
|
||||
<div class="element-table-ranking" :key="orderDataKey">
|
||||
<el-table :data="todaysWorkOrderData.data" class="scroll mytable" :height="orderDataHeight">
|
||||
<el-table :data="todaysWorkOrderData.data" class="scroll mytable" :height="orderDataHeight"
|
||||
@row-click="onInspectionPopup">
|
||||
<el-table-column v-for="(st, idx) in todaysWorkOrderData.labels" :prop="st.data" :key="idx"
|
||||
:width="st.width" :label="st.label" show-overflow-tooltip></el-table-column>
|
||||
</el-table>
|
||||
|
|
@ -42,8 +43,88 @@
|
|||
</el-col>
|
||||
|
||||
<el-col :span="6" class="h100">
|
||||
<module-one-3-1 label="超耗情况" class="labor-base h100" style="height: cacl(100% - 20px)"></module-one-3-1>
|
||||
<module-one-3-1 label="超耗情况" class="labor-base h100" style="height: cacl(100% - 20px)">
|
||||
<div class="xhz-device-data">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="xhz-device-data-min">
|
||||
<div class="survey_content">
|
||||
<div class="survey_content_img xhz-education_bgd">
|
||||
<img :src="'./images/education_icon_1.png'">
|
||||
</div>
|
||||
</div>
|
||||
<div class="xhz-current-value-data">
|
||||
<div>销号设计量</div>
|
||||
<p><span class="led-number">{{ finishGhBaseUseTired.finishGhSjl }}</span>{{ unit }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="xhz-device-data-min">
|
||||
<div class="survey_content">
|
||||
<div class="survey_content_img xhz-education_bgd">
|
||||
<img :src="'./images/education_icon_2.png'">
|
||||
</div>
|
||||
</div>
|
||||
<div class="xhz-current-value-data">
|
||||
<div>销号实耗</div>
|
||||
<p><span class="led-number">{{ finishGhBaseUseTired.finishGhshl }}</span>{{ unit }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="xhz-device-data-min">
|
||||
<div class="survey_content">
|
||||
<div class="survey_content_img xhz-education_bgd">
|
||||
<img :src="'./images/education_icon_3.png'">
|
||||
</div>
|
||||
</div>
|
||||
<div class="xhz-current-value-data">
|
||||
<div>节超量</div>
|
||||
<p><span class="led-number">{{ finishGhBaseUseTired.finishGhJcl }}</span>{{ unit }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="xhz-device-data-min">
|
||||
<div class="survey_content">
|
||||
<div class="survey_content_img xhz-education_bgd">
|
||||
<img :src="'./images/education_icon_4.png'">
|
||||
</div>
|
||||
</div>
|
||||
<div class="xhz-current-value-data">
|
||||
<div>节超率</div>
|
||||
<p><span class="led-number">{{ finishGhBaseUseTired.finishGhJclRate }}</span> %</p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
|
||||
<div class="excess-rate" :key="excessRateDataKey">
|
||||
<div class="rank-chart" style="padding: 15px;">
|
||||
<div class="rank-chart-title xhz-rank-chart-title">超耗率TOP5材料</div>
|
||||
<div class="consume-chart" :style="{ height: erHeight * excessRateData.length + 'px' }">
|
||||
<consume-chart :dataList="excessRateData" :width="excessNameWidth"></consume-chart>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="excess-reason" :key="excessReasonKey">
|
||||
<div class="rank-chart">
|
||||
<div class="rank-chart-title xhz-rank-chart-title">超耗原因分析 <span>混凝土（m³）</span></div>
|
||||
</div>
|
||||
<div class="excess-chart">
|
||||
<project-overview-chart :htmlShow="true" :key="'ai1' + excessReasonKey" :sp="''" :fn="changeChart3"
|
||||
:maintitle="excessTitle" :legend-opt="excessReasonLegendOpt" :typedata="typEreasonData" text="超耗总量"
|
||||
:height="chart3Height"></project-overview-chart>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</module-one-3-1>
|
||||
</el-col>
|
||||
<app-form-dialog ref="appFormDialog"></app-form-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -51,15 +132,21 @@
|
|||
import debounce from "lodash.debounce";
|
||||
import moreButton from "./components/moreButton.vue";
|
||||
import manyChart from "./components/manyChart.vue";
|
||||
import consumeChart from "@/components/consumeChart.vue";
|
||||
import appFormDialog from "./components/appFormDialog.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
moreButton,
|
||||
manyChart,
|
||||
consumeChart,
|
||||
appFormDialog,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dpi: "",
|
||||
selProject: null,
|
||||
unit: 'm³', //混凝土:m³,钢筋:t
|
||||
//今日工单
|
||||
todaysWorkOrderData: {
|
||||
labels: [],
|
||||
|
|
@ -78,6 +165,25 @@ export default {
|
|||
moreData: [],
|
||||
workerOrderKey: 0,
|
||||
workerOrderLoading: false,
|
||||
//项目开累应用情况
|
||||
finishGhBaseUseTired: {
|
||||
finishGhSjl: 0,
|
||||
finishGhshl: 0,
|
||||
finishGhJcl: 0,
|
||||
finishGhJclRate: 0.0
|
||||
},
|
||||
//超耗情况 超耗率TOP5材料
|
||||
excessRateData: [],
|
||||
excessRateDataKey: 0,
|
||||
excessNameWidth: 100,
|
||||
erHeight: 30,
|
||||
//超耗情况 超耗原因分析
|
||||
typEreasonData: [],
|
||||
excessReasonKey: 100000,
|
||||
excessTitle: 100,
|
||||
excessReasonLegendOpt: {},
|
||||
chart3Height: 300,
|
||||
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
|
|
@ -110,18 +216,191 @@ export default {
|
|||
this.chartKey++;
|
||||
this.orderDataKey++;
|
||||
this.workerOrderKey++;
|
||||
this.excessNameWidth = is1K ? 250 : is2K ? 150 : 650;
|
||||
this.excessRateDataKey++;
|
||||
this.excessReasonKey++;
|
||||
this.chart3Height = is1K ? 250 : is2K ? 400 : 600;
|
||||
this.erHeight = is1K ? 20 : is2K ? 30 : 150;
|
||||
|
||||
},
|
||||
init() {
|
||||
|
||||
if (!this.selProject) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.initExcessReasonLegendOpt();
|
||||
//今日工单
|
||||
this.loadTodaysWorkOrderData();
|
||||
|
||||
//获取工号信息
|
||||
this.loadWorkOrderData();
|
||||
|
||||
//获取用量情况统计服务
|
||||
this.getProjectChaoHaoStatisticsRPTService();
|
||||
|
||||
//超耗率TOP5材料
|
||||
this.getReportExceedMaterielTopService();
|
||||
|
||||
//超耗原因分析
|
||||
this.getReportConcreteExceedReasonService();
|
||||
|
||||
},
|
||||
onInspectionPopup(row) {
|
||||
console.log(row)
|
||||
|
||||
this.$refs.appFormDialog.showDialog(this.selProject.id, row)
|
||||
},
|
||||
initExcessReasonLegendOpt() {
|
||||
let is1K = this.$dpi() == "1K";
|
||||
let is2K = this.$dpi() == "2K";
|
||||
this.excessReasonLegendOpt = {
|
||||
icon: "rect",
|
||||
orient: "vertical",
|
||||
itemWidth: "50%",
|
||||
|
||||
itemWidth: 20,
|
||||
itemGap: 20,
|
||||
itemHeight: 20,
|
||||
type: "scroll",
|
||||
pageTextStyle: {
|
||||
color: "#c3dbfd",
|
||||
fontSize: is1K ? 12 : is2K ? 16 : 24,
|
||||
},
|
||||
scroll: {
|
||||
y: is1K ? 300 : is2K ? 500 : 600,
|
||||
bar: {
|
||||
show: true,
|
||||
width: 5,
|
||||
height: 10,
|
||||
},
|
||||
},
|
||||
textStyle: {
|
||||
padding: [0, 0, 0, 0],
|
||||
fontSize: is1K ? 12 : is2K ? 16 : 24,
|
||||
color: "#c3dbfd",
|
||||
align: "center",
|
||||
rich: {
|
||||
name: {
|
||||
fontSize: is1K ? 12 : is2K ? 16 : 24,
|
||||
color: "#c3dbfd",
|
||||
padding: [5, 2, 5, 2],
|
||||
},
|
||||
percent: {
|
||||
fontSize: is1K ? 12 : is2K ? 16 : 24,
|
||||
color: "#4676FD",
|
||||
padding: [0, 2, 0, 2],
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
changeChart3(opt) {
|
||||
if (this.$dpi() == "1K") {
|
||||
opt.legend[0].left = 200;
|
||||
return opt;
|
||||
} else if (this.$dpi() == "2K") {
|
||||
opt.legend[0].left = 290;
|
||||
return opt;
|
||||
} else {
|
||||
opt.legend[0].left = 500;
|
||||
return opt;
|
||||
}
|
||||
},
|
||||
getReportConcreteExceedReasonService() {
|
||||
this.$api.machMater.materGetReportConcreteExceedReasonService({
|
||||
projectId: this.selProject.id
|
||||
}).then(d => {
|
||||
this.excessTitle = 0;
|
||||
let result = d.data;
|
||||
if (result && result.code == '000000' && result.data) {
|
||||
var temp = {}
|
||||
let datas2 = []
|
||||
for (let i = 0; i < result.data.length; i++) {
|
||||
if (result.data[i].causeName.indexOf('其他') != -1) {
|
||||
for (let k in result.data[i]) {
|
||||
temp[k] = result.data[i][k]
|
||||
}
|
||||
temp.name = "其它原因"
|
||||
temp.value = Number(temp.chActQuantity).toFixed(1);
|
||||
result.data.splice(i, 1)
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
for (let i = 0; i < result.data.length; i++) {
|
||||
if (i < 5) {
|
||||
result.data[i].value = Number(result.data[i].chActQuantity).toFixed(1);
|
||||
result.data[i].name = result.data[i].causeName;
|
||||
datas2.push(
|
||||
result.data[i]
|
||||
)
|
||||
} else {
|
||||
temp.value = Number(Number(temp.value) + Number(Number(result.data[i].chActQuantity).toFixed(1))).toFixed(1)
|
||||
}
|
||||
}
|
||||
|
||||
datas2 = datas2.sort((next, prev) => prev.value - next.value)
|
||||
if (Object.keys(temp).length > 0) {
|
||||
datas2.push(temp)
|
||||
}
|
||||
this.typEreasonData = datas2;
|
||||
}
|
||||
this.typEreasonData.forEach(item => {
|
||||
this.excessTitle += item.value * 1;
|
||||
});
|
||||
this.excessReasonKey++;
|
||||
this.excessTitle = Number(this.excessTitle).toFixed(1);
|
||||
|
||||
});
|
||||
},
|
||||
getReportExceedMaterielTopService() {
|
||||
this.$api.machMater.materGetReportConcreteExceedMaterielTopService({
|
||||
projectId: this.selProject.id,
|
||||
top: 5
|
||||
}).then(d => {
|
||||
let res = d.data;
|
||||
if (res && res.code == '000000') {
|
||||
let objs = res.data || [];
|
||||
objs = objs;
|
||||
this.excessRateData = objs.map((item, index) => {
|
||||
return {
|
||||
value: index + 1,
|
||||
prop: parseFloat(parseFloat(item.chPer || "0").toFixed(1)),
|
||||
text: item.materielName + '(' + item.materielModel + ')'
|
||||
}
|
||||
}).sort((a, b) => a.prop - b.prop);
|
||||
this.excessRateDataKey++;
|
||||
console.log("+++++>", this.excessRateData)
|
||||
}
|
||||
});
|
||||
},
|
||||
getProjectChaoHaoStatisticsRPTService() {
|
||||
this.$api.machMater.materGetProjectChaoHaoStatisticsRPTService({
|
||||
projectId: this.selProject.id,
|
||||
}).then(d => {
|
||||
let res = d.data;
|
||||
this.finishGhBaseUseTired = {
|
||||
finishGhSjl: 0,
|
||||
finishGhshl: 0,
|
||||
finishGhJcl: 0,
|
||||
finishGhJclRate: 0.0
|
||||
}
|
||||
|
||||
if (res && res.code == '000000' && res.data && res.data.length > 0) {
|
||||
let tmp = res.data[0];
|
||||
if (!tmp) {
|
||||
return;
|
||||
}
|
||||
//完工工号设计量(混凝土)
|
||||
this.finishGhBaseUseTired.finishGhSjl = parseFloat(tmp.concrete_finish_designtotal_not_loss).toFixed(1);
|
||||
//完工工号实耗量(混凝土)
|
||||
this.finishGhBaseUseTired.finishGhshl = parseFloat(tmp.concrete_real_consume).toFixed(1);
|
||||
//完工工号节超量(混凝土)
|
||||
this.finishGhBaseUseTired.finishGhJcl = parseFloat(tmp.concrete_deviation_not_loss).toFixed(1);
|
||||
//完工工号节超率(混凝土)
|
||||
this.finishGhBaseUseTired.finishGhJclRate = isNaN(parseFloat((tmp.concrete_deviation_not_loss / tmp.concrete_finish_designtotal_not_loss) * 100).toFixed(1)) ? '0.0' : parseFloat((tmp.concrete_deviation_not_loss / tmp.concrete_finish_designtotal_not_loss) * 100).toFixed(1);
|
||||
}
|
||||
});
|
||||
},
|
||||
//获取材料销号制混凝土楼号维度信息
|
||||
async getConcreteMaterialActQuantityBuildingNoInfoService(type) {
|
||||
|
|
@ -517,7 +796,7 @@ export default {
|
|||
}
|
||||
|
||||
&.h33 {
|
||||
height: calc(33% - 20px);
|
||||
height: calc(33% - 11px);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -567,6 +846,39 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.excess-rate {
|
||||
height: 400px;
|
||||
|
||||
.rank-chart {
|
||||
height: 100%;
|
||||
|
||||
.rank-chart-title {}
|
||||
|
||||
.consume-chart {
|
||||
height: calc(100% - 40px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-reason {
|
||||
.rank-chart {
|
||||
.rank-chart-title {}
|
||||
}
|
||||
|
||||
.excess-chart {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
|
||||
.chart-gif,
|
||||
.chart-text {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
left: 44px;
|
||||
top: 65px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1920px) {
|
||||
.order-data-module {
|
||||
.element-table-ranking {
|
||||
|
|
@ -583,5 +895,160 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1921px) and (max-width: 2560px) {
|
||||
.xhz-device-data {
|
||||
.xhz-device-data-min {
|
||||
.survey_content {
|
||||
.xhz-education_bgd {
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
background-size: 90px 70px;
|
||||
|
||||
img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-top: 25px
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.xhz-current-value-data {
|
||||
font-size: 24px;
|
||||
|
||||
.led-number {
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-rate {
|
||||
height: 520px;
|
||||
|
||||
.rank-chart {
|
||||
height: 100%;
|
||||
|
||||
.rank-chart-title {
|
||||
font-size: 24px;
|
||||
|
||||
}
|
||||
|
||||
.consume-chart {
|
||||
height: calc(100% - 40px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-reason {
|
||||
margin-top: 30px;
|
||||
|
||||
.rank-chart {
|
||||
.rank-chart-title {
|
||||
font-size: 24px;
|
||||
|
||||
span {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-chart {
|
||||
position: relative;
|
||||
top: -10px;
|
||||
|
||||
.chart-gif,
|
||||
.chart-text {
|
||||
width: 190px;
|
||||
height: 190px;
|
||||
left: 49px;
|
||||
top: 106px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2561px) {
|
||||
.xhz-device-data {
|
||||
.xhz-device-data-min {
|
||||
.survey_content {
|
||||
.xhz-education_bgd {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
background-size: 130px 110px;
|
||||
|
||||
img {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
margin-top: 45px
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.xhz-current-value-data {
|
||||
font-size: 32px;
|
||||
|
||||
.led-number {
|
||||
font-size: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-rate {
|
||||
height: 920px;
|
||||
|
||||
.rank-chart {
|
||||
height: 100%;
|
||||
|
||||
.rank-chart-title {
|
||||
font-size: 32px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.consume-chart {
|
||||
height: calc(100% - 40px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-reason {
|
||||
margin-top: 60px;
|
||||
|
||||
.rank-chart {
|
||||
.rank-chart-title {
|
||||
font-size: 32px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
|
||||
span {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.excess-chart {
|
||||
position: relative;
|
||||
top: -30px;
|
||||
|
||||
.chart-gif,
|
||||
.chart-text {
|
||||
width: 290px;
|
||||
height: 290px;
|
||||
left: 78px;
|
||||
top: 155px !important;
|
||||
|
||||
.chart-text-title {
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
.chart-text-sub-title {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
@ -393,4 +393,48 @@ public class MachMaterController extends BaseController {
|
|||
return AjaxResult.success(JSONObject.parseObject(result));
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 材料销号制-工单运输信息
|
||||
*/
|
||||
@GetMapping("/materGetConcreteOrderMSSelectService")
|
||||
public AjaxResult materGetConcreteOrderMSSelectService(Long projectId, String initialId, String businessId) throws Exception {
|
||||
Map<String, Object> map = getConfig(projectId, "mater");
|
||||
String url = map.get("url").toString();
|
||||
url += "/MklBaseController/getService";
|
||||
JSONObject paramJson = (JSONObject) map.get("obj");
|
||||
if (StringUtils.isNotEmpty(initialId)) {
|
||||
paramJson.put("initialId", initialId);
|
||||
}
|
||||
if (StringUtils.isNotEmpty(businessId)) {
|
||||
paramJson.put("businessId", businessId);
|
||||
}
|
||||
paramJson.put("service", "getConcreteOrderMSSelectService");
|
||||
HttpUtils httpUtils = new HttpUtils();
|
||||
|
||||
String result = httpUtils.sendGet(url, HttpUtils.jsonToGetParams(paramJson));
|
||||
return AjaxResult.success(JSONObject.parseObject(result));
|
||||
}
|
||||
|
||||
/**
|
||||
* 材料销号制-工单人员信息
|
||||
*/
|
||||
@GetMapping("/materGetFlowInfo2LogInfoByBusibessIdPageService")
|
||||
public AjaxResult materGetFlowInfo2LogInfoByBusibessIdPageService(Long projectId, String initialId, String businessId) throws Exception {
|
||||
Map<String, Object> map = getConfig(projectId, "mater");
|
||||
String url = map.get("url").toString();
|
||||
url += "/MklBaseController/getService";
|
||||
JSONObject paramJson = (JSONObject) map.get("obj");
|
||||
if (StringUtils.isNotEmpty(initialId)) {
|
||||
paramJson.put("initialId", initialId);
|
||||
}
|
||||
if (StringUtils.isNotEmpty(businessId)) {
|
||||
paramJson.put("businessId", businessId);
|
||||
}
|
||||
paramJson.put("service", "getFlowInfo2LogInfoByBusibessIdPageService");
|
||||
HttpUtils httpUtils = new HttpUtils();
|
||||
|
||||
String result = httpUtils.sendGet(url, HttpUtils.jsonToGetParams(paramJson));
|
||||
return AjaxResult.success(JSONObject.parseObject(result));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue