| | |
| | | <!-- 物资管理=>消耗统计=>钢筋消耗 -->
|
| | | <template> |
| | | <div class="main"> |
| | | <div class="main_header"> |
| | | <div class="header_item"> |
| | | <span class="header_label">型号:</span> |
| | | <el-select v-model="search.steelId" placeholder="请选择型号" clearable> |
| | | <el-option |
| | | v-for="item in optionRebar" |
| | | :key="item.steelId" |
| | | :label="item.steelName" |
| | | <el-option v-for="item in optionRebar" :key="item.steelId" :label="item.steelName"
|
| | | :value="item.steelId"> |
| | | </el-option> |
| | | </el-select> |
| | |
| | | </div> |
| | | <div class="header_item" v-if="showTimes"> |
| | | <span class="header_label">选择时间:</span> |
| | | <el-date-picker |
| | | v-model="search.dayData" |
| | | :picker-options="pickerOptionsDay" |
| | | :clearable="false" |
| | | type="daterange" |
| | | value-format="yyyy-MM-dd" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | <el-date-picker v-model="search.dayData" :picker-options="pickerOptionsDay" :clearable="false"
|
| | | type="daterange" value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期"
|
| | | end-placeholder="结束日期"> |
| | | </el-date-picker> |
| | | </div> |
| | | <div class="header_item" v-if="!showTimes"> |
| | | <span class="header_label">选择月份:</span> |
| | | <el-date-picker |
| | | v-model="search.monthData" |
| | | :picker-options="pickerOptionsMonth" |
| | | :clearable="false" |
| | | type="monthrange" |
| | | value-format="yyyy-MM" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | <el-date-picker v-model="search.monthData" :picker-options="pickerOptionsMonth" :clearable="false"
|
| | | type="monthrange" value-format="yyyy-MM" range-separator="至" start-placeholder="开始日期"
|
| | | end-placeholder="结束日期"> |
| | | </el-date-picker> |
| | | </div> |
| | | <div class="header_item"> |
| | | <el-button v-if="showButton('search')" icon="el-icon-search" @click="searchButtonInfo()">查询</el-button> |
| | | <el-button v-if="showButton('export')" icon="el-icon-download" @click="exportBearExcel()">导出Excel</el-button> |
| | | <el-button v-if="showButton('export')" icon="el-icon-download"
|
| | | @click="exportBearExcel()">导出Excel</el-button>
|
| | | </div> |
| | | </div> |
| | | <div class="main_middle"> |
| | |
| | | } |
| | | }, |
| | | mounted() { |
| | | // this.searchButtonInfo() |
| | | this.searchButtonInfo()
|
| | | this.getAllTypes() |
| | | }, |
| | | methods: { |
| | |
| | | res.data.forEach(item=>{ |
| | | let xtitle = item.betweenDate |
| | | let showStock = [] |
| | | item.steelStatisticsDtos.forEach(ite=>{ |
| | | xtitle.forEach(iten=>{ |
| | | if(iten === ite.getDate){ |
| | | showStock.push({ |
| | | getDate:iten, |
| | | changeStock:ite.changeStock |
| | | }) |
| | | }else{ |
| | | showStock.push({ |
| | | getDate:iten, |
| | | changeStock:0 |
| | | }) |
| | | let _steelStatisticsDtos = {}
|
| | | item.steelStatisticsDtos.forEach(val => {
|
| | | if (!_steelStatisticsDtos[val.getDate]) {
|
| | | _steelStatisticsDtos[val.getDate] = val
|
| | | } |
| | | })
|
| | | xtitle.forEach(val => {
|
| | | let value = _steelStatisticsDtos[val]
|
| | | showStock.push({
|
| | | getDate: val,
|
| | | changeStock: value ? value.changeStock : 0
|
| | | }) |
| | | }) |
| | | this.$nextTick(() => { |
| | |
| | | position: relative; |
| | | padding: 10px 15px; |
| | | border-bottom:1px solid #1B50AE ; |
| | |
|
| | | &::before{ |
| | | content: ""; |
| | | position: absolute; |
| | |
| | | background-color: #18F6F8; |
| | | } |
| | | } |
| | |
|
| | | .main_middle_matter{ |
| | | padding-top: 15px; |
| | | width: 100%; |
| | |
| | | justify-content: center; |
| | | align-items: center; |
| | | flex-direction: column; |
| | |
|
| | | .middle_items_text{ |
| | | color: #E1E5EB; |
| | | } |
| | |
|
| | | .middle_items_datas{ |
| | | color: #18F6F8; |
| | | font-size: 18px; |
| | |
| | | padding-top: 10px; |
| | | padding-bottom: 15px; |
| | | margin-bottom: 20px; |
| | |
|
| | | .main_echart_titles{ |
| | | width: 97%; |
| | | color: #18F6F8; |
| | |
| | | padding-left: 15px; |
| | | border-bottom: 1px solid #1C51B1; |
| | | position: relative; |
| | |
|
| | | &::before{ |
| | | width: 2px; |
| | | height: 15px; |
| | |
| | | background-color: #18F6F8; |
| | | } |
| | | } |
| | |
|
| | | .main_content_chart { |
| | | height: 100%; |
| | | } |
| | | } |
| | |
|
| | | /deep/.el-radio-button__orig-radio:checked + .el-radio-button__inner{ |
| | | color: #19F7F9; |
| | | border-color: #18F6F8; |
| | | background-color: #0D4573!important; |
| | | } |
| | |
|
| | | /deep/.el-radio-button__inner{ |
| | | background-color: #0D4573; |
| | | border-color:#18F6F8; |