Tmr-Admin/src/views/statisticalAnalysis/processAnalysis/group/index.vue

<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-button
        class="el-icon-arrow-left elIconArrowLeft"
        :disabled="Beforedisabled"
        @click="handleBefore"
      />
      <el-button
        class="el-icon-arrow-right elIconArrowRight"
        :disabled="Nextdisabled"
        @click="handleNext"
      />
      <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="form_search">查询</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
              sortable
              label="牧场"
              min-width="80px"
              align="center"
              prop="pastureName"
            />
            <el-table-column
              sortable
              label="开始时间"
              min-width="100px"
              align="center"
              prop="intime"
            />
            <el-table-column
              sortable
              label="计划类型"
              min-width="80px"
              align="center"
              prop="lpplantype"
            />
            <el-table-column
              sortable
              label="描述"
              min-width="90px"
              align="center"
              prop="remark"
            />
            <el-table-column
              sortable
              label="TMR名称"
              min-width="80px"
              align="center"
              prop="tmrtname"
            />
          </el-table>
        </div>
      </el-col>
      <!-- 预混计划 -->
      <el-col v-if="isPremixedPlan" :span="16">
        <div class="title">
          <b>过程详情</b>
          <span>&nbsp;({{ title }})</span>
        </div>
        <div class="detail">
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>过程时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>混料时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].iscompleted }}</b>
            <span>工作状态</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Hdif }}kg</b>
            <span>混料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].HdifRate }}</b>
            <span>混料准确率</span>
          </div>
        </div>
        <div class="Mixture">
          <h4>混料详情11</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"
            max-height="270px"
          >
            <el-table-column
              label="操作编号"
              min-width="70px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="饲料名称"
              min-width="70px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="50px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="70px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="70px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="70px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="70px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="70px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="70px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="70px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="70px"
              align="center"
              prop="actualweight"
            />
            <el-table-column fixed="right" label="操作" width="100">
              <template slot-scope="scope">
                <el-button
                  @click="handleClick(scope.row)"
                  type="text"
                  size="small"
                  >编辑</el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </div>
      </el-col>
      <!-- 撒料计划 -->
      <el-col v-if="isSpreadingPlan" :span="16">
        <div class="title">
          <b>过程详情</b>
          <span>&nbsp;({{ title }})</span>
        </div>
        <div class="detail">
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>过程时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>混料时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].iscompleted }}</b>
            <span>工作状态</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Hdif }}kg</b>
            <span>混料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].HdifRate }}</b>
            <span>混料准确率</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Sdif }}kg</b>
            <span>撒料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].SdifRate }}</b>
            <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"
            max-height="200px"
          >
            <el-table-column
              label="操作编号"
              min-width="110px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="饲料名称"
              min-width="110px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="110px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="110px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="110px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="110px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="110px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="110px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="110px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="110px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="110px"
              align="center"
              prop="actualweight"
            />
          </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="70px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="栏舍名称"
              min-width="70px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="70px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="70px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="70px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="70px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="70px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="70px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="70px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="70px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="70px"
              align="center"
              prop="actualweight"
            />
          </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">
        <div class="title">
          <b>过程详情</b>
          <span>&nbsp;({{ title }})</span>
        </div>
        <div class="detail">
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>过程时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].iscompleted }}</b>
            <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"
              prop="sort"
            />
            <el-table-column
              label="栏舍名称"
              min-width="110px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="剩料采集重量（kg）"
              min-width="110px"
              align="center"
              prop="sweight"
            />
          </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"
              prop="sort"
            />
            <el-table-column
              label="转投栏舍"
              min-width="110px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="允许分配剩料量"
              min-width="110px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际分配重量（kg）"
              min-width="110px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="废弃剩料重量"
              min-width="110px"
              align="center"
              prop="aweight"
            />
          </el-table>
        </div>
      </el-col>
      <!-- 撒料计划-混料 -->
      <el-col v-if="isSpreadingPlanSH" :span="16">
        <div class="title">
          <b>过程详情</b>
          <span>&nbsp;({{ title }})</span>
        </div>
        <div class="detail">
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>过程时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>混料时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].iscompleted }}</b>
            <span>工作状态</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Hdif }}kg</b>
            <span>混料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].HdifRate }}</b>
            <span>混料准确率</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Sdif }}kg</b>
            <span>撒料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].SdifRate }}</b>
            <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: 98%"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
            max-height="270px"
          >
            <el-table-column
              label="操作编号"
              min-width="60px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="饲料名称"
              min-width="60px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="60px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="60px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="60px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="60px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="60px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="60px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="60px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="60px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="60px"
              align="center"
              prop="actualweight"
            />
          </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: 98%"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
            max-height="200px"
          >
            <el-table-column
              label="操作编号"
              min-width="60px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="撒料车辆"
              min-width="60px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="60px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="60px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="60px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="60px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="60px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="60px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="60px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="60px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="60px"
              align="center"
              prop="actualweight"
            />
          </el-table>
        </div>
        <div class="ControlChart">
          <h4>监控图</h4>
          <div id="chartLine" style="width: 100%; height: 300px" />
        </div>
      </el-col>
      <!-- 撒料计划-撒料 -->
      <el-col v-if="isSpreadingPlanSS" :span="16">
        <div class="title">
          <b>过程详情</b>
          <span>&nbsp;({{ title }})</span>
        </div>
        <div class="detail">
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>过程时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].proesstime }}</b>
            <span>混料时间</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].iscompleted }}</b>
            <span>工作状态</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Hdif }}kg</b>
            <span>混料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].HdifRate }}</b>
            <span>混料准确率</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].Sdif }}kg</b>
            <span>撒料误差值</span>
          </div>
          <div v-if="table2.list.length !== 0">
            <b>{{ table2.list[0].SdifRate }}</b>
            <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: 98%"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
            max-height="270px"
          >
            <el-table-column
              label="操作编号"
              min-width="60px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="撒料车辆"
              min-width="60px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="60px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="60px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="60px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="60px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="60px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="60px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="60px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="60px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="60px"
              align="center"
              prop="actualweight"
            />
          </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: 98%"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
            max-height="200px"
          >
            <el-table-column
              label="操作编号"
              min-width="70px"
              align="center"
              prop="sort"
            />
            <el-table-column
              label="撒料车辆"
              min-width="70px"
              align="center"
              prop="fname"
            />
            <el-table-column
              label="计划重量"
              min-width="70px"
              align="center"
              prop="lweight"
            />
            <el-table-column
              label="实际重量"
              min-width="70px"
              align="center"
              prop="actualweightminus"
            />
            <el-table-column
              label="误差值"
              min-width="70px"
              align="center"
              prop="diff"
            />
            <el-table-column
              label="准确率"
              min-width="70px"
              align="center"
              prop="diffRate"
            />
            <el-table-column
              label="完成时间"
              min-width="70px"
              align="center"
              prop="intime"
            />
            <el-table-column
              label="过程时间"
              min-width="70px"
              align="center"
              prop="proesstime"
            />
            <el-table-column
              label="跳转方式"
              min-width="70px"
              align="center"
              prop="buttontype"
            />
            <el-table-column
              label="开始重量"
              min-width="70px"
              align="center"
              prop="lastactualweight"
            />
            <el-table-column
              label="结束重量"
              min-width="70px"
              align="center"
              prop="actualweight"
            />
          </el-table>
        </div>
        <div class="ControlChart">
          <h4>监控图</h4>
          <div id="chartLine" style="width: 100%; height: 300px" />
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import echarts from "echarts";

require("echarts/theme/macarons");
import {
  GetDataByName,
  GetReportform,
  GetDataByNames,
  formatNum,
} from "@/api/common";
import Cookies from "js-cookie";
import { parseTime } from "@/utils/index.js";
export default {
  name: "GroupProcessAnalysis",
  data() {
    return {
      title: "",
      isPremixedPlan: "", // 预混计划
      isSpreadingPlan: "", // 撒料计划
      isResidualMaterialPlan: "", // 剩料计划,
      isSpreadingPlanSH: "", // 撒料计划-混料
      isSpreadingPlanSS: "", // 撒料计划-撒料
      pickerMinDate: "",
      Beforedisabled: false,
      Nextdisabled: false,
      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}"),
            inputDatetime: [new Date(), new Date()],
            iscompleted: "",
            tmrtname: "",
            lpplantype: "",
          },
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: false,
      },
      // 过程详情
      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: 30 + "px", height: 30 + "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();
      });
    },
    // 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.isSpreadingPlanSH = false;
            this.isSpreadingPlanSS = false;
            this.table2.getdataListParm.parammaps.id = response.data.list[0].id;
            this.table2.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table3.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table3.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getList2();
            this.getList3();
          } else if (response.data.list[0].lpplantype == "剩料计划") {
            this.isResidualMaterialPlan = true;
            this.isPremixedPlan = false;
            this.isSpreadingPlan = false;
            this.isSpreadingPlanSH = false;
            this.isSpreadingPlanSS = 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.table2.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table3.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table3.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table4.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table4.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getList2();
            this.getList3();
            this.getList4();
          } else if (response.data.list[0].lpplantype == "撒料计划-混料") {
            // 撒料计划-混料
            this.isSpreadingPlan = false;
            this.isResidualMaterialPlan = false;
            this.isPremixedPlan = false;
            this.isSpreadingPlanSH = true;
            this.isSpreadingPlanSS = false;
            this.table2.getdataListParm.parammaps.id = response.data.list[0].id;
            this.table2.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table3.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table3.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table4.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table4.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getList2();
            this.getList3();
            this.getList4();
            this.chart1.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.chart1.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getChart1();
          } else if (response.data.list[0].lpplantype == "撒料计划-撒料") {
            // 撒料计划-撒料
            this.isSpreadingPlan = false;
            this.isResidualMaterialPlan = false;
            this.isPremixedPlan = false;
            this.isSpreadingPlanSH = false;
            this.isSpreadingPlanSS = true;
            this.table2.getdataListParm.parammaps.id = response.data.list[0].id;
            this.table2.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table3.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table3.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table4.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table4.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getList2();
            this.getList3();
            this.getList4();
            this.chart1.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.chart1.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getChart1();
          } else if (response.data.list[0].lpplantype == "预称重计划") {
            // 撒料计划-混料
            this.isSpreadingPlan = false;
            this.isResidualMaterialPlan = false;
            this.isPremixedPlan = false;
            this.isSpreadingPlanSH = true;
            this.isSpreadingPlanSS = false;
            this.table2.getdataListParm.parammaps.id = response.data.list[0].id;
            this.table2.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table3.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table3.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table4.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table4.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getList2();
            this.getList3();
            this.getList4();
            this.chart1.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.chart1.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getChart1();
          } else {
            // 撒料
            this.isSpreadingPlan = true;
            this.isResidualMaterialPlan = false;
            this.isPremixedPlan = false;
            this.isSpreadingPlanSH = false;
            this.isSpreadingPlanSS = false;
            this.table2.getdataListParm.parammaps.id = response.data.list[0].id;
            this.table2.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table3.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table3.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.table4.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.table4.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getList2();
            this.getList3();
            this.getList4();
            this.chart1.getdataListParm.parammaps.pid =
              response.data.list[0].id;
            this.chart1.getdataListParm.parammaps.pastureid =
              response.data.list[0].pastureid;
            this.getChart1();
          }
          this.title = response.data.list[0].lpplantype;
        } 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);
      });
    },
    form_search() {
      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();
    },
    handleBefore() {
      if (
        this.table.getdataListParm.parammaps.inputDatetime !== "" &&
        this.table.getdataListParm.parammaps.inputDatetime !== null
      ) {
        var start = new Date(
          this.table.getdataListParm.parammaps.inputDatetime[0].setDate(
            this.table.getdataListParm.parammaps.inputDatetime[0].getDate() - 1
          )
        );
        var stop = new Date(
          this.table.getdataListParm.parammaps.inputDatetime[1].setDate(
            this.table.getdataListParm.parammaps.inputDatetime[1].getDate() - 1
          )
        );
        if (stop > Date.now()) {
          this.Nextdisabled = true;
          this.Beforedisabled = false;
        } else {
          this.Nextdisabled = false;
          this.Beforedisabled = false;
        }
        this.table.getdataListParm.parammaps.inputDatetime.length = 0;
        this.table.getdataListParm.parammaps.inputDatetime.push(start, stop);
        this.$forceUpdate();
      }
      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}"
      );
      this.getList();
    },
    handleNext() {
      if (
        this.table.getdataListParm.parammaps.inputDatetime !== "" &&
        this.table.getdataListParm.parammaps.inputDatetime !== null
      ) {
        var start2 = new Date(
          this.table.getdataListParm.parammaps.inputDatetime[0].setDate(
            this.table.getdataListParm.parammaps.inputDatetime[0].getDate() + 1
          )
        );
        var stop2 = new Date(
          this.table.getdataListParm.parammaps.inputDatetime[1].setDate(
            this.table.getdataListParm.parammaps.inputDatetime[1].getDate() + 1
          )
        );
        if (stop2 > Date.now()) {
          this.Nextdisabled = true;
          this.Beforedisabled = false;
        } else {
          this.Nextdisabled = false;
          this.Beforedisabled = false;
        }
        this.table.getdataListParm.parammaps.inputDatetime.length = 0;
        this.table.getdataListParm.parammaps.inputDatetime.push(start2, stop2);
        this.$forceUpdate();
      }
      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}"
      );
      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;
      this.chartName = row.tmrtname;
      if (row.lpplantype == "预混计划") {
        this.isPremixedPlan = true;
        this.isResidualMaterialPlan = false;
        this.isSpreadingPlan = false;

        this.isSpreadingPlanSH = false;
        this.isSpreadingPlanSS = false;
        this.table2.getdataListParm.name = "getprocessAnalysisStr";
        this.table3.getdataListParm.name = "getprocessAnalysisHL";
        this.table2.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table3.getdataListParm.parammaps.pastureid = row.pastureid;
        this.getList2();
        this.getList3();
      } else if (row.lpplantype == "剩料计划") {
        this.isResidualMaterialPlan = true;
        this.isPremixedPlan = false;
        this.isSpreadingPlan = false;

        this.isSpreadingPlanSH = false;
        this.isSpreadingPlanSS = false;
        this.table2.getdataListParm.name = "getprocessAnalysisStrSH";
        this.table3.getdataListParm.name = "getprocessAnalysisHLSH";
        this.table4.getdataListParm.name = "getprocessAnalysisSLSH";
        this.table2.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table3.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table4.getdataListParm.parammaps.pastureid = row.pastureid;
        this.getList2();
        this.getList3();
        this.getList4();
      } else if (row.lpplantype == "撒料计划-混料") {
        this.isSpreadingPlan = false;
        this.isPremixedPlan = false;
        this.isResidualMaterialPlan = false;
        this.isSpreadingPlanSH = true;
        this.isSpreadingPlanSS = false;
        this.table2.getdataListParm.name = "getprocessAnalysisStr";
        this.table3.getdataListParm.name = "getprocessAnalysisHL";
        this.table4.getdataListParm.name = "getprocessAnalysisSL";
        this.table2.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table3.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table4.getdataListParm.parammaps.pastureid = row.pastureid;
        this.chart1.getdataListParm.parammaps.pastureid = row.pastureid;
        this.getList2();
        this.getList3();
        this.getList4();
        this.getChart1();
      } else if (row.lpplantype == "撒料计划-撒料") {
        this.isSpreadingPlan = false;
        this.isPremixedPlan = false;
        this.isResidualMaterialPlan = false;
        this.isSpreadingPlanSH = false;
        this.isSpreadingPlanSS = true;
        this.table2.getdataListParm.name = "getprocessAnalysisStr";
        this.table3.getdataListParm.name = "getprocessAnalysisHL";
        this.table4.getdataListParm.name = "getprocessAnalysisSL";
        this.table2.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table3.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table4.getdataListParm.parammaps.pastureid = row.pastureid;
        this.chart1.getdataListParm.parammaps.pastureid = row.pastureid;
        this.getList2();
        this.getList3();
        this.getList4();
        this.getChart1();
      } else if (row.lpplantype == "预称重计划") {
        this.isSpreadingPlan = false;
        this.isPremixedPlan = false;
        this.isResidualMaterialPlan = false;
        this.isSpreadingPlanSH = true;
        this.isSpreadingPlanSS = false;
        this.table2.getdataListParm.name = "getprocessAnalysisStr";
        this.table3.getdataListParm.name = "getprocessAnalysisHL";
        this.table4.getdataListParm.name = "getprocessAnalysisSL";
        this.table2.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table3.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table4.getdataListParm.parammaps.pastureid = row.pastureid;
        this.chart1.getdataListParm.parammaps.pastureid = row.pastureid;
        this.getList2();
        this.getList3();
        this.getList4();
        this.getChart1();
      } else {
        this.isSpreadingPlan = true;
        this.isPremixedPlan = false;
        this.isResidualMaterialPlan = false;
        this.isSpreadingPlanSH = false;
        this.isSpreadingPlanSS = false;

        this.table2.getdataListParm.name = "getprocessAnalysisStr";
        this.table3.getdataListParm.name = "getprocessAnalysisHL";
        this.table4.getdataListParm.name = "getprocessAnalysisSL";
        this.table2.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table3.getdataListParm.parammaps.pastureid = row.pastureid;
        this.table4.getdataListParm.parammaps.pastureid = row.pastureid;
        this.chart1.getdataListParm.parammaps.pastureid = row.pastureid;
        this.getList2();
        this.getList3();
        this.getList4();
        this.getChart1();
      }
      this.title = "" + row.lpplantype;
    },
    // 过程详情
    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;
          var sumlweight = 0;
          var sumactualweightminus = 0;
          var sumsweight = 0;
          var sumproesstime = "";
          for (let i = 0; i < response.data.list.length; i++) {
            if (response.data.list[i].lweight == undefined) {
              response.data.list[i].lweight = 0;
            }
            if (response.data.list[i].actualweightminus == undefined) {
              response.data.list[i].actualweightminus = 0;
            }
            if (response.data.list[i].sweight == undefined) {
              response.data.list[i].sweight = 0;
            }
            sumlweight += parseFloat(response.data.list[i].lweight);
            sumactualweightminus += parseFloat(
              response.data.list[i].actualweightminus
            );
            sumsweight += parseFloat(response.data.list[i].sweight);
            sumproesstime = response.data.list[0].sumproesstime;
          }
          sumlweight = formatNum(sumlweight, 2);
          sumactualweightminus = formatNum(sumactualweightminus, 2);
          sumsweight = formatNum(sumsweight, 2);
          this.table3.list.push({
            sort: "合计",
            lweight: sumlweight,
            actualweightminus: sumactualweightminus,
            sweight: sumsweight,
            proesstime: sumproesstime,
          });
        } 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;
          var sumlweight = 0;
          var sumactualweightminus = 0;
          var sumsweight = 0;
          var sumproesstime = "";
          for (let i = 0; i < response.data.list.length; i++) {
            if (response.data.list[i].lweight == undefined) {
              response.data.list[i].lweight = 0;
            }
            if (response.data.list[i].actualweightminus == undefined) {
              response.data.list[i].actualweightminus = 0;
            }
            if (response.data.list[i].sweight == undefined) {
              response.data.list[i].sweight = 0;
            }
            sumlweight += parseFloat(response.data.list[i].lweight);
            sumactualweightminus += parseFloat(
              response.data.list[i].actualweightminus
            );
            sumsweight += parseFloat(response.data.list[i].sweight);
            sumproesstime = response.data.list[0].sumproesstime;
          }
          sumlweight = formatNum(sumlweight, 2);
          sumactualweightminus = formatNum(sumactualweightminus, 2);
          sumsweight = formatNum(sumsweight, 2);
          this.table4.list.push({
            sort: "合计",
            lweight: sumlweight,
            actualweightminus: sumactualweightminus,
            sweight: sumsweight,
            proesstime: sumproesstime,
          });

          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) {
      console.log(chartLine_data, "chartLine_data");
      if (this.chartLine != null) {
        this.chartLine.dispose();
      }
      this.chartLine = echarts.init(document.getElementById("chartLine"));

      var option = {
        title: { text: "", subtext: "" },
        color: ["#38c193", "#5199e5", "#fdb06a", "#fb8b73"], // 关键加上这句话，legend的颜色和折线的自定义颜色就一致了
        legend: [
          {
            itemWidth: 15,
            itemHeight: 7,
            right: "25%",
            textStyle: { fontSize: 12 },
            data: [{ name: "设计重量" }, { name: "实际重量" }],
          },
          {
            itemWidth: 15,
            itemHeight: 15,
            right: "0",
            textStyle: { fontSize: 12 },
            data: [{ name: "开始重量" }, { name: "结束重量" }],
          },
        ],
        tooltip: {
          trigger: "axis",
          formatter: function (params) {
            // console.log(params, 'params')
            var tip = params[0].name;
            for (let i = 0; i < params.length; i++) {
              tip += "<br>" + params[i].seriesName + ": ";
              if (params[i].value[0] == params[0].name) {
                tip += params[i].value[1];
              } else {
                tip += params[i].value;
              }
            }
            tip += "<br>" + params[0].data[2] + params[0].data[3];
            console.log(tip, "tip");
            return tip;
          },
        },
        calculable: true,
        xAxis: [
          {
            type: "category",
            splitLine: { show: false },
            name: "时间",
            data: chartLine_data.data1,
            axisLabel: { show: true, textStyle: { color: "#666" } },
          },
        ],
        yAxis: [{ type: "value" }],
        series: [
          {
            symbol: "none",
            name: "实际重量",
            type: "line",
            data: chartLine_data.data3,
            smooth: true,
            barWidth: "37",
            itemStyle: { normal: { lineStyle: { color: "#38c193" } } },
          },
          {
            symbol: "none",
            name: "设计重量",
            type: "line",
            step: "middle",
            data: chartLine_data.data2,
          },
          {
            name: "开始重量",
            symbolSize: 10,
            type: "scatter",
            data: chartLine_data.data4,
          },
          {
            name: "结束重量",
            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;
}

.detail {
  height: 84px;
  padding: 0 10px;
  font: 16px/32px "";
  color: #333;
  background: #f9f9f9;
  display: flex;
  align-items: center;
  text-align: center;
  div {
    height: 15px;
    width: 20%;
    border-right: 1px solid #e0e0e0;
    color: #333;
    b {
      line-height: 20px;
      font-size: 16px;
      display: block;
      margin-top: -10px;
      height: 20px;
      color: #009a69;
    }
    span {
      font-size: 14px;
    }
  }
  div:last-child {
    border-right: none;
  }
}
.title {
  height: 50px;
  line-height: 50px;
}
</style>