| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010 | 
<template>  <div class="app-container">    <h1>集团</h1>    <div class="search">      <el-select v-model="table.getdataListParm.parammaps.pastureid" placeholder="牧场" class="filter-item" style="width: 120px;">        <el-option v-for="item in pastureList" :key="item.pastureid" :label="item.pasturename" :value="item.pastureid" />      </el-select>      <el-date-picker v-model="table.getdataListParm.parammaps.inputDatetime" :clearable="false" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 250px;" :picker-options="pickerOptions" />      <el-select v-model="table.getdataListParm.parammaps.lpplantype" placeholder="计划类型" class="filter-item" style="width: 120px;" clearable>        <el-option v-for="item in planTypeList" :key="item.value" :label="item.lable" :value="item.value" />      </el-select>      <el-input v-model="table.getdataListParm.parammaps.tmrtname" placeholder="TMR名称" style="width: 180px;" class="filter-item" clearable />      <el-select v-model="table.getdataListParm.parammaps.iscompleted" placeholder="工作状态" class="filter-item" style="width: 120px;" clearable>        <el-option v-for="item in workingConditionList" :key="item.id" :label="item.name" :value="item.id" />      </el-select>      <el-button class="successBorder" @click="handleSearch">查询</el-button>      <el-button class="successBorder" @click="handleRefresh">重置</el-button>    </div>    <el-row :gutter="20">      <el-col :span="8">        <h4>TMR设备列表</h4>        <div class="table">          <el-table            :key="table.tableKey"            v-loading="table.listLoading"            element-loading-text="给我一点时间"            :data="table.list"            border            fit            highlight-current-row            style="width: 100%;"            :row-style="rowStyle"            :cell-style="cellStyle"            class="elTable table-fixed"            height="970px"            @row-click="rowClick"          >            <el-table-column label="牧场" min-width="100px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.pastureName }}</span>              </template>            </el-table-column>            <el-table-column label="开始时间" min-width="100px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.intime }}</span>              </template>            </el-table-column>            <el-table-column label="计划类型" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lpplantype }}</span>              </template>            </el-table-column>            <el-table-column label="描述" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.remark }}</span>              </template>            </el-table-column>            <el-table-column label="TMR名称" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.tmrtname }}</span>              </template>            </el-table-column>          </el-table>        </div>      </el-col>      <!-- 预混计划 -->      <el-col v-if="isPremixedPlan" :span="16">        <h4>过程详情-预混计划</h4>        <div class="detail">          <div class="detail-t">            过程时间:<span v-if="table2.list.length !== 0">{{ table2.list[0].proesstime }}</span>;            工作状态:<span v-if="table2.list.length !== 0">{{ table2.list[0].iscompleted }}</span>          </div>          <div class="detail-b">            <span>混料误差值:<span v-if="table2.list.length !== 0">{{ table2.list[0].Hdif }}kg</span>;</span>            <span>混料准确率:<span v-if="table2.list.length !== 0">{{ table2.list[0].HdifRate }}</span>;</span>          </div>        </div>        <div class="Mixture">          <h4>混料详情</h4>          <el-table            :key="table3.tableKey"            v-loading="table3.listLoading"            element-loading-text="给我一点时间"            :data="table3.list"            border            fit            highlight-current-row            style="width: 100%;"            :row-style="rowStyle"            :cell-style="cellStyle"            class="elTable table-fixed"            height="200px"          >            <el-table-column label="操作编号" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.sort }}</span>              </template>            </el-table-column>            <el-table-column label="饲料名称" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.fname }}</span>              </template>            </el-table-column>            <el-table-column label="计划重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lweight }}</span>              </template>            </el-table-column>            <el-table-column label="实际重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweightminus }}</span>              </template>            </el-table-column>            <el-table-column label="误差值" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.diff }}</span>              </template>            </el-table-column>            <el-table-column label="准确率" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.diffRate }}</span>              </template>            </el-table-column>            <el-table-column label="完成时间" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.intime }}</span>              </template>            </el-table-column>            <el-table-column label="过程时间" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.proesstime }}</span>              </template>            </el-table-column>            <el-table-column label="跳转方式" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.buttontype }}</span>              </template>            </el-table-column>            <el-table-column label="开始重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lastactualweight }}</span>              </template>            </el-table-column>            <el-table-column label="结束重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweight }}</span>              </template>            </el-table-column>          </el-table>        </div>      </el-col>      <!-- 撒料计划 -->      <el-col v-if="isSpreadingPlan" :span="16">        <h4>过程详情-撒料计划</h4>        <div class="detail">          <div class="detail-t">            过程时间:<span v-if="table2.list.length !== 0">{{ table2.list[0].proesstime }}</span>;            工作状态:<span v-if="table2.list.length !== 0">{{ table2.list[0].iscompleted }}</span>          </div>          <div class="detail-b">            <span>混料误差值:<span v-if="table2.list.length !== 0">{{ table2.list[0].Hdif }}kg</span>;</span>            <span>混料准确率:<span v-if="table2.list.length !== 0">{{ table2.list[0].HdifRate }}</span>;</span>            <span>撒料误差值:<span v-if="table2.list.length !== 0">{{ table2.list[0].Sdif }}kg</span>;</span>            <span>撒料准确率:<span v-if="table2.list.length !== 0">{{ table2.list[0].SdifRate }}</span></span>          </div>        </div>        <div class="Mixture">          <h4>混料详情</h4>          <el-table            :key="table3.tableKey"            v-loading="table3.listLoading"            element-loading-text="给我一点时间"            :data="table3.list"            border            fit            highlight-current-row            style="width: 100%;"            :row-style="rowStyle"            :cell-style="cellStyle"            class="elTable table-fixed"            height="200px"          >            <el-table-column label="操作编号" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.sort }}</span>              </template>            </el-table-column>            <el-table-column label="饲料名称" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.fname }}</span>              </template>            </el-table-column>            <el-table-column label="计划重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lweight }}</span>              </template>            </el-table-column>            <el-table-column label="实际重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweightminus }}</span>              </template>            </el-table-column>            <el-table-column label="误差值" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.diff }}</span>              </template>            </el-table-column>            <el-table-column label="准确率" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.diffRate }}</span>              </template>            </el-table-column>            <el-table-column label="完成时间" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.intime }}</span>              </template>            </el-table-column>            <el-table-column label="过程时间" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.proesstime }}</span>              </template>            </el-table-column>            <el-table-column label="跳转方式" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.buttontype }}</span>              </template>            </el-table-column>            <el-table-column label="开始重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lastactualweight }}</span>              </template>            </el-table-column>            <el-table-column label="结束重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweight }}</span>              </template>            </el-table-column>          </el-table>        </div>        <div class="SpreadingMaterials">          <h4>撒料详情</h4>          <el-table            :key="table4.tableKey"            v-loading="table4.listLoading"            element-loading-text="给我一点时间"            :data="table4.list"            border            fit            highlight-current-row            style="width: 100%;"            :row-style="rowStyle"            :cell-style="cellStyle"            class="elTable table-fixed"            height="200px"          >            <el-table-column label="操作编号" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.sort }}</span>              </template>            </el-table-column>            <el-table-column label="栏舍名称" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.fname }}</span>              </template>            </el-table-column>            <el-table-column label="计划重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lweight }}</span>              </template>            </el-table-column>            <el-table-column label="实际重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweightminus }}</span>              </template>            </el-table-column>            <el-table-column label="误差值" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.diff }}</span>              </template>            </el-table-column>            <el-table-column label="准确率" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.diffRate }}</span>              </template>            </el-table-column>            <el-table-column label="完成时间" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.intime }}</span>              </template>            </el-table-column>            <el-table-column label="过程时间" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.proesstime }}</span>              </template>            </el-table-column>            <el-table-column label="跳转方式" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.buttontype }}</span>              </template>            </el-table-column>            <el-table-column label="开始重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lastactualweight }}</span>              </template>            </el-table-column>            <el-table-column label="结束重量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweight }}</span>              </template>            </el-table-column>          </el-table>        </div>        <div class="ControlChart">          <h4>监控图</h4>          <div id="chartLine" style="width: 100%;height:300px;" />        </div>      </el-col>      <!-- 剩料计划 -->      <el-col v-if="isResidualMaterialPlan" :span="16">        <h4>过程详情-剩料计划</h4>        <div class="detail">          <div class="detail-t">            过程时间:<span v-if="table2.list.length !== 0">{{ table2.list[0].proesstime }}</span>;            工作状态:<span v-if="table2.list.length !== 0">{{ table2.list[0].iscompleted }}</span>          </div>          <div class="detail-b" />        </div>        <div class="Mixture">          <h4>剩料收集详情</h4>          <el-table            :key="table3.tableKey"            v-loading="table3.listLoading"            element-loading-text="给我一点时间"            :data="table3.list"            border            fit            highlight-current-row            style="width: 100%;"            :row-style="rowStyle"            :cell-style="cellStyle"            class="elTable table-fixed"            height="200px"          >            <el-table-column label="操作编号" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.sort }}</span>              </template>            </el-table-column>            <el-table-column label="栏舍名称" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.fname }}</span>              </template>            </el-table-column>            <el-table-column label="剩料采集重量(kg)" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.sweight }}</span>              </template>            </el-table-column>          </el-table>        </div>        <div class="SpreadingMaterials">          <h4>撒料详情</h4>          <el-table            :key="table4.tableKey"            v-loading="table4.listLoading"            :span-method="objectSpanMethod"            element-loading-text="给我一点时间"            :data="table4.list"            border            fit            highlight-current-row            style="width: 100%;"            :row-style="rowStyle"            :cell-style="cellStyle"            class="elTable table-fixed"            height="200px"          >            <el-table-column label="操作编号" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.sort }}</span>              </template>            </el-table-column>            <el-table-column label="转投栏舍" min-width="90px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.fname }}</span>              </template>            </el-table-column>            <el-table-column label="允许分配剩料量" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.lweight }}</span>              </template>            </el-table-column>            <el-table-column label="实际分配重量(kg)" min-width="110px" align="center">              <template slot-scope="scope">                <span>{{ scope.row.actualweightminus }}</span>              </template>            </el-table-column>            <el-table-column label="废弃剩料重量" min-width="110px" align="center" prop="aweight">              <template slot-scope="scope">                <span>{{ scope.row.aweight }}</span>              </template>            </el-table-column>          </el-table>        </div>      </el-col>    </el-row>  </div></template><script>import echarts from 'echarts'require('echarts/theme/macarons')import { GetDataByName, GetReportform, GetDataByNames } from '@/api/common'import Cookies from 'js-cookie'import { parseTime } from '@/utils/index.js'export default {  name: 'GroupProcessAnalysis',  data() {    return {      isPremixedPlan: '', // 预混计划      isSpreadingPlan: '', // 撒料计划      isResidualMaterialPlan: '', // 剩料计划      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()        }      },      requestParams: [        { name: 'getPastureListJT', offset: 0, pagecount: 0, parammaps: { pastureid: Cookies.get('pastureid'), pasturename: '' }}      ],      pastureList: [], // 牧场      planTypeList: [{ lable: '预混计划', value: '4' }, { lable: '撒料计划', value: '0' }, { lable: '剩料计划', value: '3' }, { lable: '撒料计划-混料', value: '1' }, { lable: '撒料计划-撒料', value: '2' }, { lable: '预称重计划', value: '5' }], // 计划类型      workingConditionList: [{ id: '0', name: '进行中' }, { id: '1', name: '已完成' }], // 工作状态      // TMR设备列表      table: {        getdataListParm: {          name: 'getprocessAnalysis',          page: 1,          offset: 1,          pagecount: '',          returntype: 'Map',          parammaps: {            pastureid: '',            startTime: parseTime(new Date(), '{y}-{m}-{d}'),            stopTime: parseTime(new Date(), '{y}-{m}-{d}'),            // startTime: '2020-09-15',            // stopTime: '2020-09-16',            inputDatetime: [new Date(), new Date()],            iscompleted: '',            tmrtname: '',            lpplantype: ''          }        },        tableKey: 0,        list: [],        total: 0,        listLoading: true      },      // 过程详情      table2: {        getdataListParm: {          name: 'getprocessAnalysisStr',          page: 1,          offset: 1,          pagecount: 1,          returntype: 'Map',          parammaps: {            pastureid: Cookies.get('pastureid'),            id: ''          }        },        tableKey: 0,        list: [],        total: 0,        listLoading: true      },      // 混料详情      table3: {        getdataListParm: {          name: 'getprocessAnalysisHL',          page: 1,          offset: 1,          pagecount: '',          returntype: 'Map',          parammaps: {            pastureid: Cookies.get('pastureid'),            id: ''          }        },        tableKey: 0,        list: [],        total: 0,        listLoading: true      },      // 撒料详情      table4: {        getdataListParm: {          name: 'getprocessAnalysisSL',          page: 1,          offset: 1,          pagecount: '',          returntype: 'Map',          parammaps: {            pastureid: Cookies.get('pastureid'),            id: ''          }        },        tableKey: 0,        list: [],        total: 0,        listLoading: true      },      chart1: {        getdataListParm: {          name: 'getprocessAnalysisTB',          page: 1,          offset: 1,          pagecount: '',          returntype: 'Map',          parammaps: {            pastureid: Cookies.get('pastureid'),            id: ''          }        },        tableKey: 0,        list: [],        total: 0,        listLoading: false,        chartLine_data: []      },      chartLine: null,      chartLine_data: {},      rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },      cellStyle: { padding: 0 + 'px' }    }  },  created() {    this.getDownList()    // this.getTimeFn()  },  methods: {    getDownList() {      GetDataByNames(this.requestParams).then(response => {        this.pastureList = response.data.getPastureListJT.list        this.table.getdataListParm.parammaps.pastureid = response.data.getPastureListJT.list[0].pastureid        this.getList()      })    },    // getTimeFn() {    //   const that = this    //   const start2 = new Date()    //   const end2 = new Date()    //   start2.setTime(start2.getTime() - 3600 * 1000 * 24 * 1)    //   end2.setTime(end2.getTime() - 3600 * 1000 * 24 * 1)    //   that.table.getdataListParm.parammaps.inputDatetime[0] = parseTime(start2, '{y}-{m}-{d}')    //   that.table.getdataListParm.parammaps.inputDatetime[1] = parseTime(end2, '{y}-{m}-{d}')    //   that.table.getdataListParm.parammaps.startTime = parseTime(start2, '{y}-{m}-{d}')    //   that.table.getdataListParm.parammaps.stopTime = parseTime(end2, '{y}-{m}-{d}')    // },    // TMR设备列表    getList() {      this.table.listLoading = true      GetDataByName(this.table.getdataListParm).then(response => {        console.log('TMR设备列表table数据', response.data.list)        if (response.data.list !== null) {          this.table.list = response.data.list          if (response.data.list[0].lpplantype == '预混计划') {            this.isPremixedPlan = true            this.isSpreadingPlan = false            this.isResidualMaterialPlan = false            this.table2.getdataListParm.parammaps.id = response.data.list[0].id            this.table3.getdataListParm.parammaps.pid = response.data.list[0].id            this.getList2()            this.getList3()          } else if (response.data.list[0].lpplantype == '剩料计划') {            this.isResidualMaterialPlan = true            this.isPremixedPlan = false            this.isSpreadingPlan = false            this.table2.getdataListParm.name = 'getprocessAnalysisStrSH'            this.table3.getdataListParm.name = 'getprocessAnalysisHLSH'            this.table4.getdataListParm.name = 'getprocessAnalysisSLSH'            this.table2.getdataListParm.parammaps.id = response.data.list[0].id            this.table3.getdataListParm.parammaps.pid = response.data.list[0].id            this.table4.getdataListParm.parammaps.pid = response.data.list[0].id            this.getList2()            this.getList3()            this.getList4()          } else {            // 撒料            this.isSpreadingPlan = true            this.isResidualMaterialPlan = false            this.isPremixedPlan = false            this.table2.getdataListParm.parammaps.id = response.data.list[0].id            this.table3.getdataListParm.parammaps.pid = response.data.list[0].id            this.table4.getdataListParm.parammaps.pid = response.data.list[0].id            this.getList2()            this.getList3()            this.getList4()            this.chart1.getdataListParm.parammaps.pid = response.data.list[0].id            this.getChart1()          }        } else {          this.table.list = []          this.table2.list = []          this.table3.list = []          this.table2.listLoading = false          this.table3.listLoading = false          this.table4.listLoading = false          this.chart1.listLoading = false        }        setTimeout(() => {          this.table.listLoading = false        }, 100)      })    },    handleSearch() {      console.log('点击了查询')      if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) {        this.table.getdataListParm.parammaps.startTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')        this.table.getdataListParm.parammaps.stopTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')      } else {        this.table.getdataListParm.parammaps.inputDatetime = ''        this.table.getdataListParm.parammaps.startTime = ''        this.table.getdataListParm.parammaps.stopTime = ''      }      this.table.getdataListParm.offset = 1      this.getList()    },    handleRefresh() {      console.log('点击了重置')      this.table.getdataListParm.parammaps.tmrtname = ''      this.table.getdataListParm.parammaps.iscompleted = ''      this.table.getdataListParm.parammaps.lpplantype = ''      this.table.getdataListParm.parammaps.startTime = ''      this.table.getdataListParm.parammaps.stopTime = ''      this.table.getdataListParm.parammaps.inputDatetime = ''      this.table.getdataListParm.offset = 1      this.getList()    },    rowClick(row, column, event) {      this.table2.getdataListParm.parammaps.id = row.id      this.table3.getdataListParm.parammaps.pid = row.id      this.table4.getdataListParm.parammaps.pid = row.id      this.chart1.getdataListParm.parammaps.pid = row.id      if (row.lpplantype == '预混计划') {        this.isPremixedPlan = true        this.isResidualMaterialPlan = false        this.isSpreadingPlan = false        this.table2.getdataListParm.name = 'getprocessAnalysisStr'        this.table3.getdataListParm.name = 'getprocessAnalysisHL'        this.getList2()        this.getList3()      } else if (row.lpplantype == '剩料计划') {        this.isResidualMaterialPlan = true        this.isPremixedPlan = false        this.isSpreadingPlan = false        this.table2.getdataListParm.name = 'getprocessAnalysisStrSH'        this.table3.getdataListParm.name = 'getprocessAnalysisHLSH'        this.table4.getdataListParm.name = 'getprocessAnalysisSLSH'        this.getList2()        this.getList3()        this.getList4()      } else {        this.isSpreadingPlan = true        this.isPremixedPlan = false        this.isResidualMaterialPlan = false        this.table2.getdataListParm.name = 'getprocessAnalysisStr'        this.table3.getdataListParm.name = 'getprocessAnalysisHL'        this.table4.getdataListParm.name = 'getprocessAnalysisSL'        this.getList2()        this.getList3()        this.getList4()        this.getChart1()      }    },    // 过程详情    getList2() {      this.table2.listLoading = false      GetDataByName(this.table2.getdataListParm).then(response => {        console.log('过程详情table数据', response.data.list)        if (response.data.list !== null) {          this.table2.list = response.data.list        } else {          this.table2.list = []        }        setTimeout(() => {          this.table2.listLoading = false        }, 100)      })    },    // 混料详情    getList3() {      this.table3.listLoading = false      GetDataByName(this.table3.getdataListParm).then(response => {        console.log('混料详情table数据', response.data.list)        if (response.data.list !== null) {          this.table3.list = response.data.list        } else {          this.table3.list = []        }        setTimeout(() => {          this.table3.listLoading = false        }, 100)      })    },    // 撒料详情    getList4() {      this.table4.listLoading = false      GetDataByName(this.table4.getdataListParm).then(response => {        console.log('撒料详情table数据', response.data.list)        if (response.data.list !== null) {          this.table4.list = response.data.list          this.rowspan()        } else {          this.table4.list = []        }        setTimeout(() => {          this.table4.listLoading = false        }, 100)      })    },    rowspan() {      this.spanArr = []      this.table4.list.forEach((item, index) => {        if (index == 0) {          this.spanArr.push(1)          this.position = 0        } else {          console.log(item, index, '======')          if (this.table4.list[index].aweight == this.table4.list[index - 1].aweight) {            this.spanArr[this.position] += 1            this.spanArr.push(0)          } else {            this.spanArr.push(1)            this.position = index          }        }      })    },    objectSpanMethod({ row, column, rowIndex, columnIndex }) {      if (columnIndex == 4) {        const _row = this.spanArr[rowIndex]        const _col = _row > 0 ? 1 : 0        return {          rowspan: _row,          colspan: _col        }      }    },    getChart1() {      this.chart1.listLoading = true      GetReportform(this.chart1.getdataListParm).then(response => {        if (response.data.list !== null) {          this.chart1.list = response.data.data          console.log('实时监控', response.data.list)          // console.log('实时监控', response.data.list.data4)          var evenNumbers = []// 偶数          var oddNumbers = []// 奇数          for (let i = 0; i < response.data.list.data4.length; i++) {            console.log(response.data.list.data4[i])            if (i == 0) {              oddNumbers.push(response.data.list.data4[i])            } else {              if (i % 2 == 0) {                evenNumbers.push(response.data.list.data4[i])              } else {                oddNumbers.push(response.data.list.data4[i])              }            }          }          response.data.list.data4 = oddNumbers          response.data.list.data5 = evenNumbers          // response.data.list.data1 = ['06:34:10', '06:34:11', '06:34:12', '06:34:13', '06:34:14', '06:34:14', '06:34:15', '06:34:16', '06:34:17', '06:34:18', '06:34:19', '06:34:20', '06:34:21', '06:34:22', '06:34:23', '06:34:29', '06:34:44', '06:34:59', '06:35:14', '06:35:29', '06:35:44', '06:35:59', '06:36:14', '06:36:29', '06:36:44', '06:36:59', '06:37:14', '06:37:28', '06:37:29', '06:37:44', '06:37:59', '06:38:14', '06:38:29', '06:38:44', '06:38:59', '06:38:59', '06:39:14', '06:39:29', '06:39:44', '06:39:59', '06:40:08', '06:40:14', '06:40:29', '06:40:44', '06:40:59', '06:41:14', '06:41:29', '06:41:40', '06:41:44', '06:41:59', '06:42:14', '06:42:29', '06:42:44', '06:42:59', '06:43:09', '06:43:14', '06:43:29', '06:43:44', '06:43:59', '06:44:14', '06:44:29', '06:44:44'],          // response.data.list.data2 = [          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '141.6', 'myname': 'A1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '341.46', 'myname': 'B1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '437.73', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '687.33', 'myname': 'C1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '959.24', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' },          //   { 'value': '1107.6', 'myname': 'D1' }          // ]          // response.data.list.data3 = [-8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -8, -11, -9, -4, -8, -10, -8, -8, 0, -1, 32, 88, 142, 143, 141, 154, 215, 250, 256, 338, 337, 329, 325, 409, 420, 438, 434, 432, 447, 439, 496, 655, 680, 678, 670, 669, 741, 752, 924],          this.chart1.chartLine_data = response.data.list          this.chart1.total = response.data.total          this.roadChartLine1(this.chart1.chartLine_data)        } else {          this.chart1.list = []        }        setTimeout(() => {          this.chart1.listLoading = false        }, 100)      })    },    roadChartLine1(chartLine_data) {      if (this.chartLine != null) {        this.chartLine.dispose()      }      this.chartLine = echarts.init(document.getElementById('chartLine'))      var option = {        title: {          text: '',          subtext: ''        },        color: ['#ff3131', '#61a5e8', '#ff3131', '#61a5e8'], // 关键加上这句话,legend的颜色和折线的自定义颜色就一致了        legend: {          data: [            { name: '设计重量', icon: 'rectangle' },            { name: '实际重量', icon: 'rectangle' },            // { name: '饲料名称', icon: 'rectangle' },            { name: '开始重量', icon: 'triangle' },            { name: '结束重量', icon: 'triangle' }          ],          right: '20%',          textStyle: {            fontSize: 12,            color: '#666'          }        },        /* grid:{y:15},*/        tooltip: {          trigger: 'axis'          // formatter: function(params) {          //   if (params.length > 0) {          //     console.log(params)          //     for (let i = 0; i < params.length; i++) {          //       if (params.length == 1 && params[0].seriesName == '设计重量') {          //         return params[0].name + '<br>' + params[i].seriesName + ':' + params[i].value + '<br>饲料名称:' + params[0].data.myname          //       } else if (params.length > 1 && params[1].seriesName == '设计重量') {          //         return params[0].name + '<br>' + params[i].seriesName + ':' + params[i].value + '<br>饲料名称:' + params[1].data.myname          //       } else {          //         return params[0].name + '<br>' + params[i].seriesName + ':' + params[i].value          //       }          //     }          //   }          // }        },        calculable: true,        yAxis: [          {            type: 'value',            name: '重量(kg)',            splitLine: { show: false }, // 去除网格线            axisLabel: {              show: true,              textStyle: {                color: '#666' // 这里用参数代替了              }            }          }        ],        xAxis: [          {            type: 'category',            splitLine: { show: false }, // 去除网格线            name: '时间',            data: chartLine_data.data1,            axisLabel: {              show: true,              textStyle: {                color: '#666' // 这里用参数代替了              }            }          }        ],        series: [{          symbol: 'none',          name: '实际重量',          type: 'line',          // step: 'end',          data: chartLine_data.data3,          smooth: true,          barWidth: '37',          itemStyle: {            normal: {              lineStyle: { color: '#ff3131' }            }          }        }, {          symbol: 'none',          name: '设计重量',          type: 'line',          barWidth: '37',          data: chartLine_data.data2,          itemStyle: {            normal: {              lineStyle: { color: '#61a5e8' }            }          }        }, {          name: '开始重量',          symbol: 'triangle',          symbolSize: 10,          type: 'scatter',          data: chartLine_data.data4        }, {          name: '结束重量',          symbol: 'triangle',          symbolSize: 10,          type: 'scatter',          data: chartLine_data.data5        }]      }      this.chartLine.setOption(option)      window.onresize = function() {        this.chartLine.resize()      }    }  }}</script><style lang="scss" scoped>  .search{padding-top:10px;clear: both;}  .table{margin-top:10px;}  .detail{    height:84px;border: 1px solid #EBEEF5;padding-left:10px;font:16px/32px '';color:#333;    .detail-t{margin-top: 10px;}    .detail-b{margin-bottom: 10px;}  }</style>
 |