<template>
<div class="app-container">
<h1>牧场</h1>
<el-tabs v-model="activeName" @tab-click="handleTabClick">
<el-tab-pane label="效率统计" name="first">
<div class="search">
<el-date-picker v-model="tab.table.getdataListParm.parammaps.date" :clearable="false" type="date" placeholder="选择日期" style="width: 150px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" />
<span style="margin-left: 10px;">统计类型：</span>
<el-radio v-model="tab.radio" label="1" @change="changeRadio">配方</el-radio>
<el-radio v-model="tab.radio" label="2" @change="changeRadio">栏舍</el-radio>
<el-radio v-model="tab.radio" label="3" @change="changeRadio">牲畜类别</el-radio>
<el-input v-if="tab.isFormulaName" v-model="tab.table.getdataListParm.parammaps.ftname" class="filter-item" style="width: 245px;" placeholder="配方模板" />
<el-input v-if="tab.isHouseName" v-model="tab.table.getdataListParm.parammaps.barname" class="filter-item" style="width: 150px;" placeholder="栏舍" />
<el-input v-if="tab.isHouseName" v-model="tab.table.getdataListParm.parammaps.ftname" class="filter-item" style="width: 150px;" placeholder="配方模板" />
<el-input v-if="tab.isLivestockType" v-model="tab.table.getdataListParm.parammaps.cowclass" class="filter-item" style="width: 150px;" placeholder="牲畜类别" />
<el-button class="successBorder" @click="handleSearch">查询</el-button>
<el-button class="export" @click="handleDownload">导出</el-button>
<svg-icon icon-class="down" style="width: 40px;height: 40px;float: right;" @click="handleQuickJumpChart" />
</div>
<div class="table">
<el-table
:key="tab.table.tableKey"
v-loading="tab.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.table.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column v-if="tab.isFormulaName" label="配方模板" min-width="90px" align="center" prop="配方模板" />
<el-table-column v-if="tab.isHouseName" label="栏舍" min-width="90px" align="center" prop="栏舍" />
<el-table-column v-if="tab.isHouseName" label="配方模板" min-width="90px" align="center" prop="配方模板" />
<el-table-column v-if="tab.isLivestockType" label="牲畜类别" min-width="90px" align="center" prop="牲畜类别" />
<el-table-column label="实际牛头数" min-width="70px" align="center" prop="实际牛头数" />
<el-table-column label="应混料量（kg）" min-width="80px" align="center" prop="应混料量" />
<el-table-column label="实际混料量（kg）" min-width="95px" align="center" prop="实际混料量" />
<el-table-column label="撒料量（kg）" min-width="80px" align="center" prop="撒料量" />
<el-table-column label="混料时间" min-width="90px" align="center" prop="混料时间" />
<el-table-column label="转投剩料量（kg）" min-width="95px" align="center" prop="转投剩料量" />
<el-table-column label="今日剩料量（kg）" min-width="95px" align="center" prop="今日剩料量" />
<el-table-column label="剩料率（%）" min-width="80px" align="center" prop="剩料率" />
<el-table-column label="TMR干物质（%）" min-width="95px" align="center" prop="TMR干物质" />
<el-table-column label="配方干物质采食量（kg/头）" min-width="90px" align="center" prop="配方干物质采食量" />
<el-table-column label="实际干物质采食量（kg/头）" min-width="90px" align="center" prop="实际干物质采食量" />
<el-table-column label="采食率（%）" min-width="80px" align="center" prop="采食率" />
<el-table-column label="配方成本(元/头)" min-width="95px" align="center" prop="配方成本" />
<el-table-column label="实际成本(元/头)" min-width="95px" align="center" prop="实际成本" />
<el-table-column label="产奶量（kg/头）" min-width="85px" align="center" prop="产奶量" />
<el-table-column label="饲料转化率(%)" min-width="80px" align="center" prop="饲料转化率" />
<el-table-column label="公斤奶饲料成本" min-width="90px" align="center" prop="公斤奶饲料成本" />
</el-table>
<!-- <pagination v-show="tab.table.total>=0" :total="tab.table.total" :page.sync="tab.table.getdataListParm.offset" :limit.sync="tab.table.getdataListParm.pagecount" @pagination="getTabList" /> -->
</div>
<div id="chartDate" style="height: 90px;" />
<div class="AnalysisChart">
<el-row :gutter="10">
<el-col :span="2"><h4>图表查询时间:</h4></el-col>
<el-col :span="22" style="margin-top: 10px;">
<el-date-picker v-model="tab.chartDate" :clearable="false" style="width: 250px;margin-right: 10px;" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" />
<el-button class="successBorder" @click="handleChartDate">确认</el-button>
<svg-icon icon-class="Up" style="width: 40px;height: 40px;float: right;" @click="handleQuickJumpTop" />
</el-col>
</el-row>
<el-row :gutter="10">
<!-- 泌乳牛干物质采食量 -->
<el-col :span="12" style="position: relative;">
<h4 style="text-align:center;">泌乳牛干物质采食量</h4>
<div>
<el-date-picker v-model="tab.chart1.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart1')" />
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart1')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleTable('chart1')">切换表格</el-button>
</div>
<div id="chartLine1" style="width:100%;height:430px;" />
<div v-if="tab.chart1.isTable" class="table" style="width: 100%;position: absolute;top:19px;right: 0;">
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart1')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleChart('chart1')">切换图表</el-button>
<el-table
:key="tab.chart1.table.tableKey"
v-loading="tab.chart1.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.chart1.table.list"
border
fit
highlight-current-row
style="width: 100%;"
height="430"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="日期" sortable min-width="110px" align="center" prop="日期" />
<el-table-column label="泌乳牛采食量（kg）" sortable min-width="110px" align="center" prop="field1" />
<el-table-column label="泌乳牛产奶量（kg）" sortable min-width="110px" align="center" prop="field2" />
</el-table>
</div>
</el-col>
<!-- 牛栏剩料率 -->
<el-col :span="12" style="position: relative;">
<h4 style="text-align:center;">牛栏剩料率</h4>
<div>
<el-select v-model="tab.chart2.getdataListParm.parammaps.statisticsList" style="width: 200px;margin-right: 5px;" multiple collapse-tags placeholder="请选择统计参数" @visible-change="changeStatisticChart2()">
<el-option v-for="item in tab.chart2.statisticsList" :key="item.id" :label="item.name" :value="item.name" />
</el-select>
<el-date-picker v-model="tab.chart2.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart2')" />
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart2')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleTable('chart2')">切换表格</el-button>
</div>
<div id="chartLine2" style="width:100%;height:430px;" />
<div v-if="tab.chart2.isTable" class="table" style="width: 100%;z-index:1;position: absolute;top:19px;right: 0;">
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart2')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleChart('chart2')">切换图表</el-button>
<el-table
:key="tab.chart2.table.tableKey"
v-loading="tab.chart2.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.chart2.table.list"
border
fit
highlight-current-row
style="width: 100%;"
height="430"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="日期" sortable min-width="110px" align="center" prop="日期" />
<el-table-column label="栏舍名称" sortable min-width="110px" align="center" prop="名称" />
<el-table-column label="剩料量" sortable min-width="110px" align="center" prop="剩料量" />
<el-table-column label="撒料量" sortable min-width="110px" align="center" prop="撒料量" />
<el-table-column label="剩料率" sortable min-width="110px" align="center" prop="准确率" />
</el-table>
</div>
</el-col>
</el-row>
<el-row :gutter="10">
<!-- 混料时间统计 -->
<el-col :span="12" style="position: relative;">
<h4 style="text-align:center;">混料时间统计</h4>
<div>
<el-date-picker v-model="tab.chart3.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart3')" />
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart3')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleTable('chart3')">切换表格</el-button>
</div>
<div id="chartLine3" style="width:100%;height:430px;" />
<div v-if="tab.chart3.isTable" class="table" style="width: 100%;position: absolute;top:19px;right: 0;">
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart3')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleChart('chart3')">切换图表</el-button>
<el-table
:key="tab.chart3.table.tableKey"
v-loading="tab.chart3.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.chart3.table.list"
border
fit
highlight-current-row
style="width: 100%;"
height="430"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="日期" min-width="110px" align="center" prop="日期" />
<el-table-column label="混料时间（分钟）" min-width="110px" align="center" prop="field1" />
</el-table>
</div>
</el-col>
<!-- 转化率 -->
<el-col :span="12" style="position: relative;">
<h4 style="text-align:center;">转化率</h4>
<div>
<el-select v-model="tab.chart4.getdataListParm.parammaps.statisticsList" style="width: 200px;margin-right: 5px;" multiple collapse-tags placeholder="请选择统计参数" @visible-change="changeStatisticChart4()">
<el-option v-for="item in tab.chart4.statisticsList" :key="item.id" :label="item.name" :value="item.name" />
</el-select>
<el-date-picker v-model="tab.chart4.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart4')" />
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart4')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleTable('chart4')">切换表格</el-button>
</div>
<div id="chartLine4" style="width:100%;height:430px;" />
<div v-if="tab.chart4.isTable" class="table" style="width: 100%;z-index:1;position: absolute;top:19px;right: 0;">
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart4')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleChart('chart4')">切换图表</el-button>
<el-table
:key="tab.chart4.table.tableKey"
v-loading="tab.chart4.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.chart4.table.list"
border
fit
highlight-current-row
style="width: 100%;"
height="430"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="日期" min-width="110px" align="center" prop="日期" />
<el-table-column label="配方名称" min-width="110px" align="center" prop="名称" />
<el-table-column label="饲料转化率" min-width="110px" align="center" prop="准确率" />
</el-table>
</div>
</el-col>
</el-row>
<el-row :gutter="10">
<!-- 成本分析 -->
<el-col :span="24" style="position: relative;">
<h4 style="text-align:center;">成本分析</h4>
<div>
<el-select v-model="tab.chart5.getdataListParm.parammaps.statisticsList" style="width: 200px;margin-right: 5px;" multiple collapse-tags placeholder="请选择统计参数" @visible-change="changeStatisticChart5()">
<el-option v-for="item in tab.chart5.statisticsList" :key="item.id" :label="item.name" :value="item.name" />
</el-select>
<el-date-picker v-model="tab.chart5.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart5')" />
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart5')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleTable('chart5')">切换表格</el-button>
</div>
<div id="chartLine5" style="width:100%;height:430px;" />
<div v-if="tab.chart5.isTable" class="table" style="width: 100%;z-index:1;position: absolute;top:19px;right: 0;">
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleExport('chart5')">导出</el-button>
<el-button type="text" style="float: right;margin-right: 5px;" @click="handleChart('chart5')">切换图表</el-button>
<el-table
:key="tab.chart5.table.tableKey"
v-loading="tab.chart5.table.listLoading"
element-loading-text="给我一点时间"
:data="tab.chart5.table.list"
border
fit
highlight-current-row
style="width: 100%;"
height="430"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
>
<el-table-column label="日期" min-width="110px" align="center" prop="日期" />
<el-table-column label="牲畜类别" min-width="110px" align="center" prop="名称" />
<el-table-column label="公斤奶饲料成本（元）" min-width="110px" align="center" prop="准确率" />
</el-table>
</div>
</el-col>
</el-row>
</div>
</el-tab-pane>
<el-tab-pane label="牛群评估" name="second">
<div class="search">
<el-date-picker v-model="tab2.table.getdataListParm.parammaps.date" :clearable="false" type="date" placeholder="选择日期" style="width: 150px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" @change="changeTab2Date" />
</div>
<div class="table">
<el-row :gutter="10">
<!-- 宾州筛分析 -->
<el-col :span="12">
<h4 style="text-align:center;">宾州筛分析</h4>
<el-table
:key="tab2.table.tableKey"
v-loading="tab2.table.listLoading"
element-loading-text="给我一点时间"
:data="tab2.table.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
height="400px"
>
<el-table-column label="宾州筛" min-width="110px" align="center" prop="barname" />
<el-table-column label="第一层重量" min-width="110px" align="center" prop="oneweight" />
<el-table-column label="第一层百分比" min-width="110px" align="center" prop="onerate" />
<el-table-column label="第二层重量" min-width="110px" align="center" prop="twoweight" />
<el-table-column label="第二层百分比" min-width="110px" align="center" prop="tworate" />
<el-table-column label="第三层重量" min-width="110px" align="center" prop="threeweight" />
<el-table-column label="第三层百分比" min-width="110px" align="center" prop="threerate" />
<el-table-column label="第四层重量" min-width="110px" align="center" prop="fourweight" />
<el-table-column label="第四层百分比" min-width="110px" align="center" prop="fourrate" />
<el-table-column label="参考标准" min-width="110px" align="center" prop="standard" />
</el-table>
</el-col>
<!-- 粪便筛分析 -->
<el-col :span="12">
<h4 style="text-align:center;">粪便筛分析</h4>
<el-table
:key="tab2.table2.tableKey"
v-loading="tab2.table2.listLoading"
element-loading-text="给我一点时间"
:data="tab2.table2.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
height="400px"
>
<el-table-column label="粪便筛" min-width="150px" align="center" prop="barname" />
<el-table-column label="第一层重量" min-width="110px" align="center" prop="oneweight" />
<el-table-column label="第一层百分比" min-width="110px" align="center" prop="onerate" />
<el-table-column label="第二层重量" min-width="110px" align="center" prop="twoweight" />
<el-table-column label="第二层百分比" min-width="110px" align="center" prop="tworate" />
<el-table-column label="第三层重量" min-width="110px" align="center" prop="threeweight" />
<el-table-column label="第三层百分比" min-width="110px" align="center" prop="threerate" />
<el-table-column label="参考标准" min-width="110px" align="center" prop="standard" />
</el-table>
</el-col>
</el-row>
<el-row :gutter="10">
<!-- BCS评分 -->
<el-col :span="12">
<h4 style="text-align:center;">BCS评分</h4>
<el-table
:key="tab2.table3.tableKey"
v-loading="tab2.table3.listLoading"
element-loading-text="给我一点时间"
:data="tab2.table3.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
height="400px"
>
<el-table-column label="栏舍" min-width="110px" align="center" prop="barname" />
<el-table-column label="抽查样本数" min-width="110px" align="center" prop="sumcowcount" />
<el-table-column label="单产" min-width="110px" align="center" prop="product" />
<el-table-column label="干物质采食量" min-width="110px" align="center" prop="dryweight" />
<el-table-column label="泌乳天数" min-width="110px" align="center" prop="avgdim" />
<el-table-column label="标准分数" min-width="110px" align="center" prop="standardscore" />
<el-table-column label="2.75-分（数量、百分比）" min-width="110px" align="center" prop="score25" />
<el-table-column label="2.75分（数量、百分比" min-width="110px" align="center" prop="score275" />
<el-table-column label="3分（数量、百分比）" min-width="110px" align="center" prop="score3" />
<el-table-column label="3.25分（数量、百分比）" min-width="110px" align="center" prop="score325" />
<el-table-column label="3.5分（数量、百分比）" min-width="110px" align="center" prop="score35" />
<el-table-column label="3.75分（数量、百分比）" min-width="110px" align="center" prop="score375" />
<el-table-column label="4+分（数量、百分比）" min-width="110px" align="center" prop="score4" />
</el-table>
</el-col>
<!-- 粪便评分 -->
<el-col :span="12">
<h4 style="text-align:center;">粪便评分</h4>
<el-table
:key="tab2.table4.tableKey"
v-loading="tab2.table4.listLoading"
element-loading-text="给我一点时间"
:data="tab2.table4.list"
border
fit
highlight-current-row
style="width: 100%;"
:row-style="rowStyle"
:cell-style="cellStyle"
class="elTable table-fixed"
height="400px"
>
<el-table-column label="栏舍" min-width="110px" align="center" prop="barname" />
<el-table-column label="抽查样本数" min-width="110px" align="center" prop="sumcowcount" />
<el-table-column label="单产" min-width="110px" align="center" prop="product" />
<el-table-column label="干物质采食量" min-width="110px" align="center" prop="dryweight" />
<el-table-column label="泌乳天数" min-width="110px" align="center" prop="avgdim" />
<el-table-column label="标准分数" min-width="110px" align="center" prop="standardscore" />
<el-table-column label="1分（数量、百分比）" min-width="110px" align="center" prop="score1" />
<el-table-column label="2分（数量、百分比）" min-width="110px" align="center" prop="score2" />
<el-table-column label="3分（数量、百分比）" min-width="110px" align="center" prop="score3" />
<el-table-column label="4分（数量、百分比）" min-width="110px" align="center" prop="score4" />
<el-table-column label="5分（数量、百分比）" min-width="110px" align="center" prop="score5" />
</el-table>
</el-col>
</el-row>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import echarts from 'echarts'
require('echarts/theme/macarons')
import { GetDataByName, GetReportform } from '@/api/common'
import Cookies from 'js-cookie'
import { parseTime } from '@/utils/index.js'
import Pagination from '@/components/Pagination'
import { json2excel } from '@/utils/index.js'
import { MessageBox } from 'element-ui'
export default {
name: 'PastureFeedingEfficiency',
components: { Pagination },
data() {
return {
pickerMinDate: '',
pickerOptions: {
onPick: ({ maxDate, minDate }) => {
this.pickerMinDate = minDate.getTime()
if (maxDate) {
this.pickerMinDate = ''
}
},
// 限制不能选择今天之后的日期
disabledDate: (time) => {
if (this.pickerMinDate !== '') {
const one = 31 * 24 * 3600 * 1000
const minTime = this.pickerMinDate - one
let maxTime = this.pickerMinDate + one
if (maxTime > new Date()) {
maxTime = new Date()
}
return time.getTime() < minTime || time.getTime() > maxTime
}
return time.getTime() > Date.now()
}
},
activeName: 'first',
tab: {
radio: '1',
isFormulaName: true, // 配方名称
isHouseName: false, // 栏舍名称
isLivestockType: false, // 牲畜类别
chartDate: [],
table: {
getdataListParm: {
name: 'getFeedEfficiencyFT',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
date: parseTime(new Date(), '{y}-{m}-{d}'),
ftname: '',
barname: '',
cowclass: ''
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
temp: {}
},
chart1: {
chartLine: null,
chartLine_data: {},
getdataListParm: {
name: 'getFeedEffMR',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: parseTime(new Date(), '{y}-{m}-{d}'),
stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
inputDatetime: [new Date(), new Date()]
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
isChart: true,
isTable: false,
table: {
tableKey: 1,
list: [],
total: 0,
listLoading: false
}
},
chart2: {
chartLine: null,
chartLine_data: {},
getdataListParm: {
name: 'getFeedEffSL',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: parseTime(new Date(), '{y}-{m}-{d}'),
stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
inputDatetime: [new Date(), new Date()]
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
statisticsList: [],
chart2Data3: [],
isChart: true,
isTable: false,
table: {
tableKey: 1,
list: [],
total: 0,
listLoading: false
}
},
chart3: {
chartLine: null,
chartLine_data: {},
getdataListParm: {
name: 'getFeedEffHL',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: parseTime(new Date(), '{y}-{m}-{d}'),
stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
inputDatetime: [new Date(), new Date()]
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
isChart: true,
isTable: false,
table: {
tableKey: 1,
list: [],
total: 0,
listLoading: false
}
},
chart4: {
chartLine: null,
chartLine_data: {},
getdataListParm: {
name: 'getFeedEffZH',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: parseTime(new Date(), '{y}-{m}-{d}'),
stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
inputDatetime: [new Date(), new Date()]
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
statisticsList: [],
chart4Data3: [],
isChart: true,
isTable: false,
table: {
tableKey: 1,
list: [],
total: 0,
listLoading: false
}
},
chart5: {
chartLine: null,
chartLine_data: {},
getdataListParm: {
name: 'getFeedEffCBFT',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
startTime: parseTime(new Date(), '{y}-{m}-{d}'),
stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
inputDatetime: [new Date(), new Date()]
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
statisticsList: [],
chart5Data3: [],
isChart: true,
isTable: false,
table: {
tableKey: 1,
list: [],
total: 0,
listLoading: false
}
}
},
tab2: {
table: {
getdataListParm: {
name: 'getAssessCowPenn',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
date: parseTime(new Date(), '{y}-{m}-{d}')
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
temp: {}
},
table2: {
getdataListParm: {
name: 'getAssessCowDung',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
date: ''
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
temp: {}
},
table3: {
getdataListParm: {
name: 'getAssessBodyscore',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
date: ''
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
temp: {}
},
table4: {
getdataListParm: {
name: 'getAssessDungscore',
page: 1,
offset: 1,
pagecount: '',
returntype: 'Map',
parammaps: {
pastureid: Cookies.get('pastureid'),
date: ''
}
},
tableKey: 1,
list: [],
total: 0,
listLoading: true,
temp: {}
}
},
rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
cellStyle: { padding: 0 + 'px' }
}
},
created() {
this.getTabList()
this.getTimeFn()
this.getChart1()
this.getChart2()
this.getChart3()
this.getChart4()
this.getChart5()
},
mounted() {
},
methods: {
getTimeFn() {
const that = this
const end = new Date()
const start = new Date()
const start2 = new Date()
start2.setTime(start2.getTime() - 3600 * 1000 * 24 * 1)
that.tab.table.getdataListParm.parammaps.date = parseTime(start2, '{y}-{m}-{d}')
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
that.tab.chartDate[0] = parseTime(start, '{y}-{m}-{d}')
that.tab.chartDate[1] = parseTime(end, '{y}-{m}-{d}')
that.tab.chart1.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
that.tab.chart1.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
that.tab.chart1.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
that.tab.chart1.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
that.tab.chart2.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
that.tab.chart2.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
that.tab.chart2.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
that.tab.chart2.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
that.tab.chart3.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
that.tab.chart3.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
that.tab.chart3.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
that.tab.chart3.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
that.tab.chart4.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
that.tab.chart4.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
that.tab.chart4.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
that.tab.chart4.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
that.tab.chart5.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
that.tab.chart5.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
that.tab.chart5.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
that.tab.chart5.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
},
// 导出
handleDownload() {
if (this.tab.radio == '1') {
var excelDatas = [
{
tHeader: ['配方模板', '实际牛头数', '应混料量（kg）', '实际混料量（kg）', '撒料量（kg）', '混料时间（min）', '转投剩料量（kg）', '今日剩料量（kg）', '剩料率（%）', 'TMR干物质（%）', '配方干物质采食量（kg/头）', '实际干物质采食量（kg/头）', '采食率（%）', '配方成本(元/头 )', '实际成本(元/ 头)', '产奶量（kg /头）', '饲料转化率', '公斤奶饲料成本'],
filterVal: ['配方模板', '实际牛头数', '应混料量', '实际混料量', '撒料量', '混料时间', '转投剩料量', '今日剩料量', '剩料率', 'TMR干物质', '配方干物质采食量', '实际干物质采食量', '采食率', '配方成本', '实际成本', '产奶量', '饲料转化率', '公斤奶饲料成本'],
tableDatas: this.tab.table.list,
sheetName: '配方'
}
]
json2excel(excelDatas, '效率统计-配方', true, 'xlsx')
} else if (this.tab.radio == '2') {
var excelDatas2 = [
{
tHeader: ['栏舍', '配方模板', '实际牛头数', '应混料量（kg）', '实际混料量（kg）', '撒料量（kg）', '混料时间（min）', '转投剩料量（kg）', '今日剩料量（kg）', '剩料率（%）', 'TMR干物质（%）', '配方干物质采食量（kg/头）', ' 实际干物质采食量（ kg/头）', '采食率 （%）', '配方成本( 元/头)', '实际成本 (元/头)', '产奶量（kg/头）', '饲料转化率', '公斤奶饲料成本'],
filterVal: ['栏舍', '配方模板', '实际牛头数', '应混料量', '实际混料量', '撒料量', '混料时间', '转投剩料量', '今日剩料量', '剩料率', 'TMR干物质', '配方干物质采食量', '实际干物质采食量', '采食率', '配方成本', '实际成本', '产奶量', '饲料转化率', '公斤奶饲料成本'],
tableDatas: this.tab.table.list,
sheetName: '栏舍'
}
]
json2excel(excelDatas2, '效率统计-栏舍', true, 'xlsx')
} else if (this.tab.radio == '3') {
var excelDatas3 = [
{
tHeader: ['牲畜类别', '实际牛头数', '应混料量（kg）', '实际混料量（kg）', '撒料量（kg）', '混料时间（min）', '转投剩料量（kg）', '今日剩料量（kg）', '剩料率（%）', 'TMR干物质（%）', '配方 物质采食量（kg/ 头）', '实际干物质采 食量（kg/头）', ' 采食率（%）', '配方 成本(元/头)', '实际成本(元/头)', '产奶量（kg/头）', '饲料转化率', '公斤奶饲料成本'],
filterVal: ['牲畜类别', '实际牛头数', '应混料量', '实际混料量', '撒料量', '混料时间', '转投剩料量', '今日剩料量', '剩料率', 'TMR干物质', '配方干物质采食量', '实际干物质采食量', ' 采食率', '配方成本', '实际成本', '产奶量', '饲料转化率', '公斤奶饲料成本'],
tableDatas: this.tab.table.list,
sheetName: '牲畜类别'
}
]
json2excel(excelDatas3, '效率统计-牲畜类别', true, 'xlsx')
}
},
// Tab切换
handleTabClick() {
if (this.activeName == 'first') {
const start2 = new Date()
start2.setTime(start2.getTime() - 3600 * 1000 * 24 * 1)
this.tab.table.getdataListParm.parammaps.date = parseTime(start2, '{y}-{m}-{d}')
this.getTabList()
this.getChart1()
this.getChart2()
this.getChart3()
this.getChart4()
this.getChart5()
} else if (this.activeName == 'second') {
const start2 = new Date()
start2.setTime(start2.getTime() - 3600 * 1000 * 24 * 1)
this.tab2.table.getdataListParm.parammaps.date = parseTime(start2, '{y}-{m}-{d}')
this.getTab2List()
this.getTab2List2()
this.getTab2List3()
this.getTab2List4()
}
},
// 切换统计类型
changeRadio() {
console.log(this.tab.radio)
if (this.tab.radio == '1') {
console.log('配方名称')
this.tab.isFormulaName = true
this.tab.isHouseName = false
this.tab.isLivestockType = false
this.tab.table.getdataListParm.parammaps.ftname = ''
this.tab.table.getdataListParm.parammaps.barname = ''
this.tab.table.getdataListParm.parammaps.ftname = ''
this.tab.table.getdataListParm.parammaps.cowclass = ''
this.tab.table.getdataListParm.name = 'getFeedEfficiencyFT'
this.getTabList()
this.tab.chart5.statisticsList = []
this.tab.chart5.getdataListParm.name = 'getFeedEffCBFT'
this.getChart5()
this.tab.chart4.getdataListParm.name = 'getFeedEffZH'
this.getChart4()
} else if (this.tab.radio == '2') {
console.log('栏舍名称')
this.tab.isFormulaName = false
this.tab.isHouseName = true
this.tab.isLivestockType = false
this.tab.table.getdataListParm.parammaps.ftname = ''
this.tab.table.getdataListParm.parammaps.barname = ''
this.tab.table.getdataListParm.parammaps.ftname = ''
this.tab.table.getdataListParm.parammaps.cowclass = ''
this.tab.table.getdataListParm.name = 'getFeedEfficiencyLS'
this.getTabList()
this.tab.chart5.statisticsList = []
this.tab.chart5.getdataListParm.name = 'getFeedEffCBLS'
this.getChart5()
this.tab.chart4.getdataListParm.name = 'getFeedEffZHLS'
this.getChart4()
} else if (this.tab.radio == '3') {
console.log(' 牲畜类别')
this.tab.isFormulaName = false
this.tab.isHouseName = false
this.tab.isLivestockType = true
this.tab.table.getdataListParm.parammaps.ftname = ''
this.tab.table.getdataListParm.parammaps.barname = ''
this.tab.table.getdataListParm.parammaps.ftname = ''
this.tab.table.getdataListParm.parammaps.cowclass = ''
this.tab.table.getdataListParm.name = 'getFeedEfficiencySC'
this.getTabList()
this.tab.chart5.statisticsList = []
this.tab.chart5.getdataListParm.name = 'getFeedEffCB'
this.getChart5()
this.tab.chart4.getdataListParm.name = 'getFeedEffZHSC'
this.getChart4()
}
},
// 效率统计
getTabList() {
this.tab.table.listLoading = true
GetDataByName(this.tab.table.getdataListParm).then(response => {
console.log('汇总统计/混料table数据', response.data.list)
if (response.data.list !== null) {
this.tab.table.list = response.data.list
this.tab.table.total = response.data.total
} else {
this.tab.table.list = []
}
setTimeout(() => {
this.tab.table.listLoading = false
}, 100)
})
},
// 查询
handleSearch() {
if (this.tab.radio == '1') {
console.log('配方名称/查询')
this.tab.isFormulaName = true
this.tab.isHouseName = false
this.tab.isLivestockType = false
this.tab.table.getdataListParm.name = 'getFeedEfficiencyFT'
this.getTabList()
} else if (this.tab.radio == '2') {
console.log('栏舍名称/查询')
this.tab.isFormulaName = false
this.tab.isHouseName = true
this.tab.isLivestockType = false
this.tab.table.getdataListParm.name = 'getFeedEfficiencyLS'
this.getTabList()
} else if (this.tab.radio == '3') {
console.log(' 牲畜类别/查询')
this.tab.isFormulaName = false
this.tab.isHouseName = false
this.tab.isLivestockType = true
this.tab.table.getdataListParm.name = 'getFeedEfficiencySC'
this.getTabList()
}
},
// 快速跳转到图表
handleQuickJumpChart() {
console.log(document.querySelector('#chartDate'))
document.querySelector('#chartDate').scrollIntoView()
},
// 快速回到顶部
handleQuickJumpTop() {
window.scrollTo(0, 0)
},
// 图表总查询
handleChartDate() {
console.log('点击了确认时间')
MessageBox.confirm('是否调整以下所有图表查询时间?', {
confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning'
}).then(() => {
var that = this
var startTime = parseTime(this.tab.chartDate[0], '{y}-{m}-{d}')
var stopTime = parseTime(this.tab.chartDate[1], '{y}-{m}-{d}')
that.tab.chart1.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
that.tab.chart1.getdataListParm.parammaps.startTime = startTime
that.tab.chart1.getdataListParm.parammaps.stopTime = stopTime
that.getChart1()
that.tab.chart2.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
that.tab.chart2.getdataListParm.parammaps.startTime = startTime
that.tab.chart2.getdataListParm.parammaps.stopTime = stopTime
that.getChart2()
that.tab.chart3.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
that.tab.chart3.getdataListParm.parammaps.startTime = startTime
that.tab.chart3.getdataListParm.parammaps.stopTime = stopTime
that.getChart3()
that.tab.chart4.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
that.tab.chart4.getdataListParm.parammaps.startTime = startTime
that.tab.chart4.getdataListParm.parammaps.stopTime = stopTime
that.getChart4()
that.tab.chart5.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
that.tab.chart5.getdataListParm.parammaps.startTime = startTime
that.tab.chart5.getdataListParm.parammaps.stopTime = stopTime
that.getChart5()
})
},
// 泌乳牛干物质采食量
getChart1() {
this.tab.chart1.listLoading = true
GetReportform(this.tab.chart1.getdataListParm).then(response => {
console.log('泌乳牛干物质采食量图表数据', response.data.list)
if (response.data.list !== null) {
this.tab.chart1.table.list = response.data.data
this.tab.chart1.chartLine_data = response.data.list
// this.tab.chart1.total = response.data.total
this.roadChartLine1(this.tab.chart1.chartLine_data)
} else {
this.tab.chart1.list = []
}
setTimeout(() => {
this.tab.chart1.listLoading = false
}, 100)
})
},
roadChartLine1(chartLine_data) {
if (this.tab.chart1.chartLine != null) {
this.tab.chart1.chartLine.dispose()
}
this.tab.chart1.chartLine = echarts.init(document.getElementById('chartLine1'))
var option = {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['泌乳牛干物质采食量', '泌乳牛产奶量'],
right: 10
},
grid: {
top: '20%',
left: '5%',
right: '8%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: chartLine_data.data1
}
],
yAxis: [
{
type: 'value',
name: '泌乳牛干物质采食量',
axisLabel: {
formatter: '{value} '
}
}, {
type: 'value',
name: '泌乳牛产奶量',
axisLabel: {
formatter: '{value} '
}
}
],
series: [{
name: '泌乳牛干物质采食量',
type: 'bar',
itemStyle: { /* 设置柱状颜色*/
normal: {
color: '#61a5e8'
}
},
data: chartLine_data.data2
}, {
name: '泌乳牛产奶量',
type: 'line',
itemStyle: { /* 设置折线颜色*/
normal: {
color: '#ff2d2d'
}
},
yAxisIndex: 1,
data: chartLine_data.data3
}]
}
this.tab.chart1.chartLine.setOption(option)
window.onresize = function() {
this.tab.chart1.chartLine.resize()
}
},
// 牛栏剩料率
changeStatisticChart2() {
var arrData3 = []
for (let i = 0; i < this.tab.chart2.getdataListParm.parammaps.statisticsList.length; i++) {
const myId = this.tab.chart2.statisticsList.find(obj => obj.name == this.tab.chart2.getdataListParm.parammaps.statisticsList[i]).id
for (let j = 0; j < this.tab.chart2.chart2Data3.length; j++) {
if (j == myId) {
arrData3.push(this.tab.chart2.chart2Data3[j])
}
}
}
this.tab.chart2.chartLine_data.data3 = arrData3
this.tab.chart2.chartLine_data.data1 = this.tab.chart2.getdataListParm.parammaps.statisticsList
this.roadChartLine2(this.tab.chart2.chartLine_data)
},
getChart2() {
this.tab.chart2.listLoading = true
GetReportform(this.tab.chart2.getdataListParm).then(response => {
console.log('转化率图表数据', response.data.list)
if (response.data.list !== null) {
this.tab.chart2.table.list = response.data.data
this.tab.chart2.chartLine_data = response.data.list
this.tab.chart2.total = response.data.total
this.tab.chart2.statisticsList = []
this.tab.chart2.getdataListParm.parammaps.statisticsList = []
for (let i = 0; i < response.data.list.data1.length; i++) {
if (i < 10) {
this.tab.chart2.getdataListParm.parammaps.statisticsList.push(response.data.list.data1[i])
}
var obj = {}
obj.id = i
obj.name = response.data.list.data1[i]
this.tab.chart2.statisticsList.push(obj)
}
this.tab.chart2.chart2Data3 = response.data.list.data3
this.tab.chart2.total = response.data.total
console.log('牛栏剩料率图数据', this.tab.chart2.chartLine_data)
console.log('牛栏剩料率表数据', this.tab.chart2.table.list)
var arrData3 = []
for (let i = 0; i < this.tab.chart2.getdataListParm.parammaps.statisticsList.length; i++) {
const myId = this.tab.chart2.statisticsList.find(obj => obj.name == this.tab.chart2.getdataListParm.parammaps.statisticsList[i]).id
for (let j = 0; j < this.tab.chart2.chart2Data3.length; j++) {
if (j == myId) {
arrData3.push(this.tab.chart2.chart2Data3[j])
}
}
}
this.tab.chart2.chartLine_data.data3 = arrData3
this.tab.chart2.chartLine_data.data1 = this.tab.chart2.getdataListParm.parammaps.statisticsList
this.roadChartLine2(this.tab.chart2.chartLine_data)
} else {
this.tab.chart2.list = []
}
setTimeout(() => {
this.tab.chart2.listLoading = false
}, 100)
})
},
roadChartLine2(chartLine_data) {
if (this.tab.chart2.chartLine != null) {
this.tab.chart2.chartLine.dispose()
}
this.tab.chart2.chartLine = echarts.init(document.getElementById('chartLine2'))
var option = {
title: {
text: ''
},
tooltip: {
trigger: 'axis'
},
legend: {
data: chartLine_data.data1,
right: 10
},
grid: {
top: '20%',
left: '3%',
right: '8%',
containLabel: true
},
toolbox: {
show: true,
right: '2%',
feature: {}
},
xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
yAxis: {
type: 'value', name: '剩料率', axisLabel: { formatter: '{value} %' }
},
series: (function() {
var serie = []
for (var i = 0; i < chartLine_data.data3.length; i++) {
var item = {
name: chartLine_data.data1[i],
type: 'line',
data: chartLine_data.data3[i].data
}
serie.push(item)
}
return serie
}())
}
this.tab.chart2.chartLine.setOption(option)
window.onresize = function() {
this.tab.chart2.chartLine.resize()
}
},
// 混料时间统计
getChart3() {
this.tab.chart3.listLoading = true
GetReportform(this.tab.chart3.getdataListParm).then(response => {
console.log('混料时间统计图表数据', response.data.list)
if (response.data.list !== null) {
this.tab.chart3.table.list = response.data.data
this.tab.chart3.chartLine_data = response.data.list
this.tab.chart3.total = response.data.total
this.tab.chart3.total = response.data.total
this.roadChartLine3(this.tab.chart3.chartLine_data)
} else {
this.tab.chart3.list = []
}
setTimeout(() => {
this.tab.chart3.listLoading = false
}, 100)
})
},
roadChartLine3(chartLine_data) {
if (this.tab.chart3.chartLine != null) {
this.tab.chart3.chartLine.dispose()
}
this.tab.chart3.chartLine = echarts.init(document.getElementById('chartLine3'))
var option = {
title: {
text: ''
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['混料时间'],
right: 10
},
grid: {
top: '20%',
left: '5%',
right: '8%',
containLabel: true
},
toolbox: {
show: true,
right: '2%',
feature: {}
},
xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data1, name: '日期' },
yAxis: {
type: 'value', name: '分钟',
axisLabel: {
formatter: '{value}min'
}
},
series: [
{
name: '混料时间',
type: 'line',
stack: '总量',
data: chartLine_data.data2
}
]
}
this.tab.chart3.chartLine.setOption(option)
window.onresize = function() {
this.tab.chart3.chartLine.resize()
}
},
// 转化率
changeStatisticChart4() {
var arrData3 = []
for (let i = 0; i < this.tab.chart4.getdataListParm.parammaps.statisticsList.length; i++) {
const myId = this.tab.chart4.statisticsList.find(obj => obj.name == this.tab.chart4.getdataListParm.parammaps.statisticsList[i]).id
for (let j = 0; j < this.tab.chart4.chart4Data3.length; j++) {
if (j == myId) {
arrData3.push(this.tab.chart4.chart4Data3[j])
}
}
}
this.tab.chart4.chartLine_data.data3 = arrData3
this.tab.chart4.chartLine_data.data1 = this.tab.chart4.getdataListParm.parammaps.statisticsList
this.roadChartLine4(this.tab.chart4.chartLine_data)
},
getChart4() {
this.tab.chart4.listLoading = true
GetReportform(this.tab.chart4.getdataListParm).then(response => {
console.log('转化率图表数据', response.data.list)
if (response.data.list !== null) {
this.tab.chart4.table.list = response.data.data
this.tab.chart4.chartLine_data = response.data.list
this.tab.chart4.total = response.data.total
this.tab.chart4.statisticsList = []
this.tab.chart4.getdataListParm.parammaps.statisticsList = []
for (let i = 0; i < response.data.list.data1.length; i++) {
if (i < 10) {
this.tab.chart4.getdataListParm.parammaps.statisticsList.push(response.data.list.data1[i])
}
var obj = {}
obj.id = i
obj.name = response.data.list.data1[i]
this.tab.chart4.statisticsList.push(obj)
}
this.tab.chart4.chart4Data3 = response.data.list.data3
this.tab.chart4.total = response.data.total
console.log('转化率图数据', this.tab.chart4.chartLine_data)
console.log('转化率表数据', this.tab.chart4.table.list)
var arrData3 = []
for (let i = 0; i < this.tab.chart4.getdataListParm.parammaps.statisticsList.length; i++) {
const myId = this.tab.chart4.statisticsList.find(obj => obj.name == this.tab.chart4.getdataListParm.parammaps.statisticsList[i]).id
for (let j = 0; j < this.tab.chart4.chart4Data3.length; j++) {
if (j == myId) {
arrData3.push(this.tab.chart4.chart4Data3[j])
}
}
}
this.tab.chart4.chartLine_data.data3 = arrData3
this.tab.chart4.chartLine_data.data1 = this.tab.chart4.getdataListParm.parammaps.statisticsList
this.roadChartLine4(this.tab.chart4.chartLine_data)
} else {
this.tab.chart4.list = []
}
setTimeout(() => {
this.tab.chart4.listLoading = false
}, 100)
})
},
roadChartLine4(chartLine_data) {
if (this.tab.chart4.chartLine != null) {
this.tab.chart4.chartLine.dispose()
}
this.tab.chart4.chartLine = echarts.init(document.getElementById('chartLine4'))
var option = {
title: {
text: ''
},
tooltip: {
trigger: 'axis'
},
legend: {
data: chartLine_data.data1,
right: 10
},
grid: {
top: '20%',
left: '3%',
right: '8%',
containLabel: true
},
toolbox: {
show: true,
right: '2%',
feature: {}
},
xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
yAxis: {
type: 'value', name: '百分比', axisLabel: { formatter: '{value} %' }
},
series: (function() {
var serie = []
for (var i = 0; i < chartLine_data.data3.length; i++) {
var item = {
name: chartLine_data.data1[i],
type: 'line',
data: chartLine_data.data3[i].data
}
serie.push(item)
}
return serie
}())
}
this.tab.chart4.chartLine.setOption(option)
window.onresize = function() {
this.tab.chart4.chartLine.resize()
}
},
// 成本分析
changeStatisticChart5() {
var arrData3 = []
for (let i = 0; i < this.tab.chart5.getdataListParm.parammaps.statisticsList.length; i++) {
const myId = this.tab.chart5.statisticsList.find(obj => obj.name == this.tab.chart5.getdataListParm.parammaps.statisticsList[i]).id
for (let j = 0; j < this.tab.chart5.chart5Data3.length; j++) {
if (j == myId) {
arrData3.push(this.tab.chart5.chart5Data3[j])
}
}
}
this.tab.chart5.chartLine_data.data3 = arrData3
this.tab.chart5.chartLine_data.data1 = this.tab.chart5.getdataListParm.parammaps.statisticsList
this.roadChartLine5(this.tab.chart5.chartLine_data)
},
getChart5() {
this.tab.chart5.listLoading = true
GetReportform(this.tab.chart5.getdataListParm).then(response => {
console.log('转化率图表数据', response.data.list)
if (response.data.list !== null) {
this.tab.chart5.table.list = response.data.data
this.tab.chart5.chartLine_data = response.data.list
this.tab.chart5.total = response.data.total
this.tab.chart5.statisticsList = []
this.tab.chart5.getdataListParm.parammaps.statisticsList = []
for (let i = 0; i < response.data.list.data1.length; i++) {
if (i < 10) {
this.tab.chart5.getdataListParm.parammaps.statisticsList.push(response.data.list.data1[i])
}
var obj = {}
obj.id = i
obj.name = response.data.list.data1[i]
this.tab.chart5.statisticsList.push(obj)
}
this.tab.chart5.chart5Data3 = response.data.list.data3
this.tab.chart5.total = response.data.total
console.log('转化率图数据', this.tab.chart5.chartLine_data)
console.log('转化率表数据', this.tab.chart5.table.list)
var arrData3 = []
for (let i = 0; i < this.tab.chart5.getdataListParm.parammaps.statisticsList.length; i++) {
const myId = this.tab.chart5.statisticsList.find(obj => obj.name == this.tab.chart5.getdataListParm.parammaps.statisticsList[i]).id
for (let j = 0; j < this.tab.chart5.chart5Data3.length; j++) {
if (j == myId) {
arrData3.push(this.tab.chart5.chart5Data3[j])
}
}
}
this.tab.chart5.chartLine_data.data3 = arrData3
this.tab.chart5.chartLine_data.data1 = this.tab.chart5.getdataListParm.parammaps.statisticsList
this.roadChartLine5(this.tab.chart5.chartLine_data)
} else {
this.tab.chart5.list = []
}
setTimeout(() => {
this.tab.chart5.listLoading = false
}, 100)
})
},
roadChartLine5(chartLine_data) {
if (this.tab.chart5.chartLine != null) {
this.tab.chart5.chartLine.dispose()
}
this.tab.chart5.chartLine = echarts.init(document.getElementById('chartLine5'))
var option = {
title: {
text: ''
},
tooltip: {
trigger: 'axis'
},
legend: {
data: chartLine_data.data1,
right: 10
},
grid: {
top: '20%',
left: '5%',
right: '8%',
containLabel: true
},
toolbox: {
show: true,
right: '2%',
feature: {}
},
xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
yAxis: {
type: 'value', name: '公斤奶饲料成本（元）'
},
series: (function() {
var serie = []
for (var i = 0; i < chartLine_data.data3.length; i++) {
var item = {
name: chartLine_data.data1[i],
type: 'line',
data: chartLine_data.data3[i].data
}
serie.push(item)
}
return serie
}())
}
this.tab.chart5.chartLine.setOption(option)
window.onresize = function() {
this.tab.chart5.chartLine.resize()
}
},
// 时间
changeChartDate(item) {
console.log(item)
if (item == 'chart1') {
if (this.tab.chart1.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart1.getdataListParm.parammaps.inputDatetime !== null) {
this.tab.chart1.getdataListParm.parammaps.startTime = parseTime(this.tab.chart1.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
this.tab.chart1.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart1.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
this.getChart1()
} else {
this.tab.chart1.getdataListParm.parammaps.inputDatetime = ''
this.tab.chart1.getdataListParm.parammaps.startTime = ''
this.tab.chart1.getdataListParm.parammaps.stopTime = ''
this.getChart1()
}
} else if (item == 'chart2') {
if (this.tab.chart2.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart2.getdataListParm.parammaps.inputDatetime !== null) {
this.tab.chart2.getdataListParm.parammaps.startTime = parseTime(this.tab.chart2.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
this.tab.chart2.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart2.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
this.getChart2()
} else {
this.tab.chart2.getdataListParm.parammaps.inputDatetime = ''
this.tab.chart2.getdataListParm.parammaps.startTime = ''
this.tab.chart2.getdataListParm.parammaps.stopTime = ''
this.getChart2()
}
} else if (item == 'chart3') {
if (this.tab.chart3.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart3.getdataListParm.parammaps.inputDatetime !== null) {
this.tab.chart3.getdataListParm.parammaps.startTime = parseTime(this.tab.chart3.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
this.tab.chart3.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart3.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
this.getChart3()
} else {
this.tab.chart3.getdataListParm.parammaps.inputDatetime = ''
this.tab.chart3.getdataListParm.parammaps.startTime = ''
this.tab.chart3.getdataListParm.parammaps.stopTime = ''
this.getChart3()
}
} else if (item == 'chart4') {
if (this.tab.chart4.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart4.getdataListParm.parammaps.inputDatetime !== null) {
this.tab.chart4.getdataListParm.parammaps.startTime = parseTime(this.tab.chart4.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
this.tab.chart4.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart4.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
this.getChart4()
} else {
this.tab.chart4.getdataListParm.parammaps.inputDatetime = ''
this.tab.chart4.getdataListParm.parammaps.startTime = ''
this.tab.chart4.getdataListParm.parammaps.stopTime = ''
this.getChart4()
}
} else if (item == 'chart5') {
if (this.tab.chart5.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart5.getdataListParm.parammaps.inputDatetime !== null) {
this.tab.chart5.getdataListParm.parammaps.startTime = parseTime(this.tab.chart5.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
this.tab.chart5.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart5.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
this.getChart5()
} else {
this.tab.chart5.getdataListParm.parammaps.inputDatetime = ''
this.tab.chart5.getdataListParm.parammaps.startTime = ''
this.tab.chart5.getdataListParm.parammaps.stopTime = ''
this.getChart5()
}
}
},
// 导出
handleExport(item) {
if (item == 'chart1') {
console.log('泌乳牛干物质采食量导出')
var excelDatasTabChart1 = [
{
tHeader: ['日期', '泌乳牛采食量', '泌乳牛产奶量'],
filterVal: ['日期', 'field1', 'field2'],
tableDatas: this.tab.chart1.table.list,
sheetName: '泌乳牛采食量'
}
]
json2excel(excelDatasTabChart1, '泌乳牛采食量', true, 'xlsx')
} else if (item == 'chart2') {
console.log('牛栏剩料率导出')
var excelDatasTabChart2 = [
{
tHeader: ['日期', '栏舍名称', '剩料量', '撒料量', '剩料率'],
filterVal: ['日期', '名称', '剩料量', '撒料量', '准确率'],
tableDatas: this.tab.chart2.table.list,
sheetName: '牛栏剩料率'
}
]
json2excel(excelDatasTabChart2, '牛栏剩料率', true, 'xlsx')
} else if (item == 'chart3') {
console.log('混料时间统计导出')
var excelDatasTabChart3 = [
{
tHeader: ['日期', '混料时间（分钟）'],
filterVal: ['日期', 'field1'],
tableDatas: this.tab.chart3.table.list,
sheetName: '混料时间统计'
}
]
json2excel(excelDatasTabChart3, '混料时间统计', true, 'xlsx')
} else if (item == 'chart4') {
console.log('转化率导出')
var excelDatasTabChart4 = [
{
tHeader: ['日期', '配方名称', '饲料转化率'],
filterVal: ['日期', '名称', '准确率'],
tableDatas: this.tab.chart4.table.list,
sheetName: '转化率统计'
}
]
json2excel(excelDatasTabChart4, '转化率', true, 'xlsx')
} else if (item == 'chart5') {
console.log('成本分析导出')
var excelDatasTabChart5 = [
{
tHeader: ['日期', '牲畜类别', '公斤奶饲料成本（元）'],
filterVal: ['日期', '名称', '准确率'],
tableDatas: this.tab.chart5.table.list,
sheetName: '成本分析'
}
]
json2excel(excelDatasTabChart5, '成本分析', true, 'xlsx')
}
},
// 切换表格
handleTable(item) {
// 显示切换表格
if (item == 'chart1') {
console.log('泌乳牛采食量表格')
this.tab.chart1.isTable = true
this.tab.chart1.isChart = false
} else if (item == 'chart2') {
console.log('牛栏剩料率表格')
this.tab.chart2.isTable = true
this.tab.chart2.isChart = false
} else if (item == 'chart3') {
console.log('混料时间统计表格')
this.tab.chart3.isTable = true
this.tab.chart3.isChart = false
} else if (item == 'chart4') {
console.log('转化率表格')
this.tab.chart4.isTable = true
this.tab.chart4.isChart = false
} else if (item == 'chart5') {
console.log('成本分析表格')
this.tab.chart5.isTable = true
this.tab.chart5.isChart = false
}
},
// 切换图表
handleChart(item) {
// 显示切换图表
if (item == 'chart1') {
console.log('泌乳牛采食量图表')
this.tab.chart1.isTable = false
this.tab.chart1.isChart = true
} else if (item == 'chart2') {
console.log('牛栏剩料率图表')
this.tab.chart2.isTable = false
this.tab.chart2.isChart = true
} else if (item == 'chart3') {
console.log('混料时间统计图表')
this.tab.chart3.isTable = false
this.tab.chart3.isChart = true
} else if (item == 'chart4') {
console.log('转化率图表')
this.tab.chart4.isTable = false
this.tab.chart4.isChart = true
} else if (item == 'chart5') {
console.log('成本分析图表')
this.tab.chart5.isTable = false
this.tab.chart5.isChart = true
}
},
// 切换tab2日期
changeTab2Date() {
this.getTab2List()
this.getTab2List2()
this.getTab2List3()
this.getTab2List4()
},
// 宾州筛分析
getTab2List() {
this.tab2.table.listLoading = true
GetDataByName(this.tab2.table.getdataListParm).then(response => {
console.log('宾州筛分析table数据', response.data.list)
if (response.data.list !== null) {
this.tab2.table.list = response.data.list
this.tab2.table.total = response.data.total
} else {
this.tab2.table.list = []
}
setTimeout(() => {
this.tab2.table.listLoading = false
}, 100)
})
},
// 粪便筛分析
getTab2List2() {
this.tab2.table2.listLoading = true
this.tab2.table2.getdataListParm.parammaps.date = this.tab2.table.getdataListParm.parammaps.date
GetDataByName(this.tab2.table2.getdataListParm).then(response => {
console.log('粪便筛分析table数据', response.data.list)
if (response.data.list !== null) {
this.tab2.table2.list = response.data.list
this.tab2.table2.total = response.data.total
} else {
this.tab2.table2.list = []
}
setTimeout(() => {
this.tab2.table2.listLoading = false
}, 100)
})
},
// BCS评分
getTab2List3() {
this.tab2.table3.listLoading = true
this.tab2.table3.getdataListParm.parammaps.date = this.tab2.table.getdataListParm.parammaps.date
GetDataByName(this.tab2.table3.getdataListParm).then(response => {
console.log('BCS评分table数据', response.data.list)
if (response.data.list !== null) {
this.tab2.table3.list = response.data.list
this.tab2.table3.total = response.data.total
} else {
this.tab2.table3.list = []
}
setTimeout(() => {
this.tab2.table3.listLoading = false
}, 100)
})
},
// 粪便评分
getTab2List4() {
this.tab2.table4.listLoading = true
this.tab2.table4.getdataListParm.parammaps.date = this.tab2.table.getdataListParm.parammaps.date
GetDataByName(this.tab2.table4.getdataListParm).then(response => {
console.log('成本分析table数据', response.data.list)
if (response.data.list !== null) {
this.tab2.table4.list = response.data.list
this.tab2.table4.total = response.data.total
} else {
this.tab2.table4.list = []
}
setTimeout(() => {
this.tab2.table4.listLoading = false
}, 100)
})
}
}
}
</script>
<style lang="scss" scoped>
.search{margin-bottom:10px;}
</style>