|
|
|
|
@ -2,31 +2,11 @@
|
|
|
|
|
<div style="width: 95%;height:100% ;background-color: #ffffff;margin-top: 2%;border-radius: 10px"> |
|
|
|
|
<div style="height: 20%;margin-left: 6%;padding-top: 2%"> |
|
|
|
|
<div style="font-size: 25px;margin-bottom: 5px;margin-bottom: 2%">公司成本 |
|
|
|
|
<span style="margin-left: 9%;margin-right: 2%"> <a-month-picker :disabled-date="disabledDate" placeholder="选择日期" /> </span> |
|
|
|
|
<j-dict-select-tag type="list" v-model="materialType" style="width: 30%;margin-left: 2%" |
|
|
|
|
<span style="margin-left: 9%;margin-right: 2%"> <a-month-picker :disabled-date="disabledDate" placeholder="选择日期" @change="disabledDate" v-model="formData.dateItem"/> </span> |
|
|
|
|
<j-dict-select-tag type="list" v-model="formData.materialType" style="width: 30%;margin-left: 2%" |
|
|
|
|
:trigger-change="true" dictCode="material_type" |
|
|
|
|
placeholder="请选择物资类型" @change="handleChange"/> |
|
|
|
|
</div> |
|
|
|
|
<!-- <div style="height: 25%;margin-left: 6%;padding-top: 2%">--> |
|
|
|
|
<!-- <div style="font-size: 25px;">公司成本--> |
|
|
|
|
<!-- <span style=""> <a-month-picker :disabled-date="disabledDate" placeholder="选择日期" /> </span>--> |
|
|
|
|
<!-- <j-dict-select-tag type="list" v-model="materialType" style="width: 30%"--> |
|
|
|
|
<!-- :trigger-change="true" dictCode="material_type"--> |
|
|
|
|
<!-- placeholder="请选择物资类型" @change="handleChange"/>--> |
|
|
|
|
<!-- </div>--> |
|
|
|
|
<!-- <div style="color: #ffffff;font-size: 19px;margin-bottom: 5px">公司成本</div>--> |
|
|
|
|
<!-- <div style="display: flex;align-items: center;justify-content: flex-start">--> |
|
|
|
|
<!-- <div class="xian">月</div>--> |
|
|
|
|
<!-- <div class="xian">季度</div>--> |
|
|
|
|
<!-- <div class="xian">半年</div>--> |
|
|
|
|
<!-- <div class="xian">年</div>--> |
|
|
|
|
<!-- </div>--> |
|
|
|
|
<!-- <div style="display: flex;align-items: center;justify-content: flex-start">--> |
|
|
|
|
<!-- <div class="zi">生产类物资</div>--> |
|
|
|
|
<!-- <div class="zi">非生产类物资</div>--> |
|
|
|
|
<!-- <div class="zi">科研类物资</div>--> |
|
|
|
|
<!-- <div class="zi">无形类资产</div>--> |
|
|
|
|
<!-- </div>--> |
|
|
|
|
</div> |
|
|
|
|
<div ref="myChartCon" style="width: 95%; height: 80%"></div> |
|
|
|
|
</div> |
|
|
|
|
@ -36,6 +16,9 @@
|
|
|
|
|
<script> |
|
|
|
|
|
|
|
|
|
import echarts from 'echarts' |
|
|
|
|
import moment from 'moment' |
|
|
|
|
import { getAction } from '@api/manage' |
|
|
|
|
import { FilterTime,GetRecentMonth } from '@/utils/costTime' |
|
|
|
|
|
|
|
|
|
// 引入基本模板 |
|
|
|
|
// let echarts = require('echarts/lib/echarts') |
|
|
|
|
@ -50,12 +33,59 @@ name: "Cost",
|
|
|
|
|
return { |
|
|
|
|
msg: '我的echarts图表', |
|
|
|
|
materialType: null, |
|
|
|
|
url:{ |
|
|
|
|
getSection: '/hy/processStatistics/getSection', |
|
|
|
|
}, |
|
|
|
|
timeNum:[], |
|
|
|
|
formData:{ |
|
|
|
|
dateItem: undefined, |
|
|
|
|
materialType: 3, |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
mounted() { |
|
|
|
|
this.drawLine() |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
created() { |
|
|
|
|
this.formData.dateItem = moment(new Date(), 'YYYY-MM'); |
|
|
|
|
this.getList(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
getList() { |
|
|
|
|
this.timeNum = []; |
|
|
|
|
// console.log( this.formData.dateItem,"===="); |
|
|
|
|
let date = new Date(this.formData.dateItem); |
|
|
|
|
this.timeNum = GetRecentMonth(date.getMonth() + 1,this.timeNum) |
|
|
|
|
|
|
|
|
|
// console.log(ss,"sdasDFsd"); |
|
|
|
|
let it ={ |
|
|
|
|
time: moment(this.formData.dateItem._d).format('YYYY-MM-DD HH:mm:ss'), |
|
|
|
|
materialsType : this.formData.materialType |
|
|
|
|
} |
|
|
|
|
// console.log("====",moment(this.formData.dateItem._d).format('YYYY-MM-DD HH:mm:ss')); |
|
|
|
|
getAction(this.url.getSection,it).then(res=>{ |
|
|
|
|
this.cost = res.result; |
|
|
|
|
console.log("===123132",res.result); |
|
|
|
|
let shuju = []; |
|
|
|
|
let dux= {} |
|
|
|
|
res.result.forEach(item =>{ |
|
|
|
|
// console.log("item",parseInt( item.createTime.substring(5,7) )); |
|
|
|
|
dux= { |
|
|
|
|
sj : parseInt( item.createTime.substring(5,7) ), |
|
|
|
|
lld : item.materialAmount |
|
|
|
|
} |
|
|
|
|
shuju.push(dux); |
|
|
|
|
}); |
|
|
|
|
// console.log(shuju); |
|
|
|
|
this.drawLine(shuju); |
|
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
disabledDate(current) { |
|
|
|
|
// Can not select days before today and today |
|
|
|
|
return current && current < moment().endOf('day'); |
|
|
|
|
|
