18cefccdba74918442d22658134ecf8eb9bc22c1.svn-base 53 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185
  1. <template>
  2. <div class="app-container">
  3. <!-- <h1>集团</h1> -->
  4. <div class="search">
  5. <el-select v-model="table.getdataListParm.parammaps.pastureid" placeholder="牧场" class="filter-item" style="width: 120px;">
  6. <el-option v-for="item in pastureList" :key="item.pastureid" :label="item.pasturename" :value="item.pastureid" />
  7. </el-select>
  8. <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" />
  9. <!-- <el-button class="el-icon-arrow-left elIconArrowLeft" :disabled="Beforedisabled" @click="handleBefore" />
  10. <el-button class="el-icon-arrow-right elIconArrowRight" :disabled="Nextdisabled" @click="handleNext" /> -->
  11. <el-select v-model="table.getdataListParm.parammaps.lpplantype" placeholder="计划类型" class="filter-item" style="width: 120px;" clearable>
  12. <el-option v-for="item in planTypeList" :key="item.value" :label="item.lable" :value="item.value" />
  13. </el-select>
  14. <el-input v-model="table.getdataListParm.parammaps.tmrtname" placeholder="TMR名称" style="width: 180px;" class="filter-item" clearable />
  15. <el-select v-model="table.getdataListParm.parammaps.iscompleted" placeholder="工作状态" class="filter-item" style="width: 120px;" clearable>
  16. <el-option v-for="item in workingConditionList" :key="item.id" :label="item.name" :value="item.id" />
  17. </el-select>
  18. <el-button class="successBorder" @click="handleSearch">查询</el-button>
  19. <el-button class="successBorder" @click="handleRefresh">重置</el-button>
  20. </div>
  21. <el-row :gutter="20">
  22. <el-col :span="8">
  23. <h4>TMR设备列表</h4>
  24. <div class="table">
  25. <el-table
  26. :key="table.tableKey"
  27. v-loading="table.listLoading"
  28. element-loading-text="给我一点时间"
  29. :data="table.list"
  30. border
  31. fit
  32. highlight-current-row
  33. style="width: 100%;"
  34. :row-style="rowStyle"
  35. :cell-style="cellStyle"
  36. class="elTable table-fixed"
  37. height="970px"
  38. @row-click="rowClick"
  39. >
  40. <el-table-column sortable label="牧场" min-width="80px" align="center" prop="pastureName" />
  41. <el-table-column sortable label="开始时间" min-width="100px" align="center" prop="intime" />
  42. <el-table-column sortable label="计划类型" min-width="80px" align="center" prop="lpplantype" />
  43. <el-table-column sortable label="描述" min-width="90px" align="center" prop="remark" />
  44. <el-table-column sortable label="TMR名称" min-width="80px" align="center" prop="tmrtname" />
  45. </el-table>
  46. </div>
  47. </el-col>
  48. <!-- 预混计划 -->
  49. <el-col v-if="isPremixedPlan" :span="16">
  50. <div class="title">
  51. <b>过程详情</b>
  52. <span>&nbsp;({{ title }})</span>
  53. </div>
  54. <div class="detail">
  55. <div v-if="table2.list.length !== 0">
  56. <b>{{ table2.list[0].proesstime }}</b>
  57. <span>过程时间</span>
  58. </div>
  59. <div v-if="table2.list.length !== 0">
  60. <b>{{ table2.list[0].proesstime }}</b>
  61. <span>混料时间</span>
  62. </div>
  63. <div v-if="table2.list.length !== 0">
  64. <b>{{ table2.list[0].iscompleted }}</b>
  65. <span>工作状态</span>
  66. </div>
  67. <div v-if="table2.list.length !== 0">
  68. <b>{{ table2.list[0].Hdif }}kg</b>
  69. <span>混料误差值</span>
  70. </div>
  71. <div v-if="table2.list.length !== 0">
  72. <b>{{ table2.list[0].HdifRate }}</b>
  73. <span>混料准确率</span>
  74. </div>
  75. </div>
  76. <div class="Mixture">
  77. <h4>混料详情</h4>
  78. <el-table
  79. :key="table3.tableKey"
  80. v-loading="table3.listLoading"
  81. element-loading-text="给我一点时间"
  82. :data="table3.list"
  83. border
  84. fit
  85. highlight-current-row
  86. style="width: 100%;"
  87. :row-style="rowStyle"
  88. :cell-style="cellStyle"
  89. class="elTable table-fixed"
  90. >
  91. <el-table-column label="操作编号" min-width="70px" align="center" prop="sort" />
  92. <el-table-column label="饲料名称" min-width="70px" align="center" prop="fname" />
  93. <el-table-column label="计划重量" min-width="50px" align="center" prop="lweight" />
  94. <el-table-column label="实际重量" min-width="70px" align="center" prop="actualweightminus" />
  95. <el-table-column label="误差值" min-width="70px" align="center" prop="diff" />
  96. <el-table-column label="准确率" min-width="70px" align="center" prop="diffRate" />
  97. <el-table-column label="完成时间" min-width="70px" align="center" prop="intime" />
  98. <el-table-column label="过程时间" min-width="70px" align="center" prop="proesstime" />
  99. <el-table-column label="跳转方式" min-width="70px" align="center" prop="buttontype" />
  100. <el-table-column label="开始重量" min-width="70px" align="center" prop="lastactualweight" />
  101. <el-table-column label="结束重量" min-width="70px" align="center" prop="actualweight" />
  102. </el-table>
  103. </div>
  104. </el-col>
  105. <!-- 撒料计划 -->
  106. <el-col v-if="isSpreadingPlan" :span="16">
  107. <div class="title">
  108. <b>过程详情</b>
  109. <span>&nbsp;({{ title }})</span>
  110. </div>
  111. <div class="detail">
  112. <div v-if="table2.list.length !== 0">
  113. <b>{{ table2.list[0].proesstime }}</b>
  114. <span>过程时间</span>
  115. </div>
  116. <div v-if="table2.list.length !== 0">
  117. <b>{{ table2.list[0].proesstime }}</b>
  118. <span>混料时间</span>
  119. </div>
  120. <div v-if="table2.list.length !== 0">
  121. <b>{{ table2.list[0].iscompleted }}</b>
  122. <span>工作状态</span>
  123. </div>
  124. <div v-if="table2.list.length !== 0">
  125. <b>{{ table2.list[0].Hdif }}kg</b>
  126. <span>混料误差值</span>
  127. </div>
  128. <div v-if="table2.list.length !== 0">
  129. <b>{{ table2.list[0].HdifRate }}</b>
  130. <span>混料准确率</span>
  131. </div>
  132. <div v-if="table2.list.length !== 0">
  133. <b>{{ table2.list[0].Sdif }}kg</b>
  134. <span>撒料误差值</span>
  135. </div>
  136. <div v-if="table2.list.length !== 0">
  137. <b>{{ table2.list[0].SdifRate }}</b>
  138. <span>撒料准确率</span>
  139. </div>
  140. </div>
  141. <div class="Mixture">
  142. <h4>混料详情</h4>
  143. <el-table
  144. :key="table3.tableKey"
  145. v-loading="table3.listLoading"
  146. element-loading-text="给我一点时间"
  147. :data="table3.list"
  148. border
  149. fit
  150. highlight-current-row
  151. style="width: 100%;"
  152. :row-style="rowStyle"
  153. :cell-style="cellStyle"
  154. class="elTable table-fixed"
  155. >
  156. <el-table-column label="操作编号" min-width="110px" align="center" prop="sort" />
  157. <el-table-column label="饲料名称" min-width="110px" align="center" prop="fname" />
  158. <el-table-column label="计划重量" min-width="110px" align="center" prop="lweight" />
  159. <el-table-column label="实际重量" min-width="110px" align="center" prop="actualweightminus" />
  160. <el-table-column label="误差值" min-width="110px" align="center" prop="diff" />
  161. <el-table-column label="准确率" min-width="110px" align="center" prop="diffRate" />
  162. <el-table-column label="完成时间" min-width="110px" align="center" prop="intime" />
  163. <el-table-column label="过程时间" min-width="110px" align="center" prop="proesstime" />
  164. <el-table-column label="跳转方式" min-width="110px" align="center" prop="buttontype" />
  165. <el-table-column label="开始重量" min-width="110px" align="center" prop="lastactualweight" />
  166. <el-table-column label="结束重量" min-width="110px" align="center" prop="actualweight" />
  167. </el-table>
  168. </div>
  169. <div class="SpreadingMaterials">
  170. <h4>撒料详情</h4>
  171. <el-table
  172. :key="table4.tableKey"
  173. v-loading="table4.listLoading"
  174. element-loading-text="给我一点时间"
  175. :data="table4.list"
  176. border
  177. fit
  178. highlight-current-row
  179. style="width: 100%;"
  180. :row-style="rowStyle"
  181. :cell-style="cellStyle"
  182. class="elTable table-fixed"
  183. height="200px"
  184. >
  185. <el-table-column label="操作编号" min-width="70px" align="center" prop="sort" />
  186. <el-table-column label="栏舍名称" min-width="70px" align="center" prop="fname" />
  187. <el-table-column label="计划重量" min-width="70px" align="center" prop="lweight" />
  188. <el-table-column label="实际重量" min-width="70px" align="center" prop="actualweightminus" />
  189. <el-table-column label="误差值" min-width="70px" align="center" prop="diff" />
  190. <el-table-column label="准确率" min-width="70px" align="center" prop="diffRate" />
  191. <el-table-column label="完成时间" min-width="70px" align="center" prop="intime" />
  192. <el-table-column label="过程时间" min-width="70px" align="center" prop="proesstime" />
  193. <el-table-column label="跳转方式" min-width="70px" align="center" prop="buttontype" />
  194. <el-table-column label="开始重量" min-width="70px" align="center" prop="lastactualweight" />
  195. <el-table-column label="结束重量" min-width="70px" align="center" prop="actualweight" />
  196. </el-table>
  197. </div>
  198. <div class="ControlChart">
  199. <h4>监控图</h4>
  200. <div id="chartLine" style="width: 100%;height:300px;" />
  201. </div>
  202. </el-col>
  203. <!-- 剩料计划 -->
  204. <el-col v-if="isResidualMaterialPlan" :span="16">
  205. <div class="title">
  206. <b>过程详情</b>
  207. <span>&nbsp;({{ title }})</span>
  208. </div>
  209. <div class="detail">
  210. <div v-if="table2.list.length !== 0">
  211. <b>{{ table2.list[0].proesstime }}</b>
  212. <span>过程时间</span>
  213. </div>
  214. <div v-if="table2.list.length !== 0">
  215. <b>{{ table2.list[0].iscompleted }}</b>
  216. <span>工作状态</span>
  217. </div>
  218. </div>
  219. <div class="Mixture">
  220. <h4>剩料收集详情</h4>
  221. <el-table
  222. :key="table3.tableKey"
  223. v-loading="table3.listLoading"
  224. element-loading-text="给我一点时间"
  225. :data="table3.list"
  226. border
  227. fit
  228. highlight-current-row
  229. style="width: 100%;"
  230. :row-style="rowStyle"
  231. :cell-style="cellStyle"
  232. class="elTable table-fixed"
  233. height="200px"
  234. >
  235. <el-table-column label="操作编号" min-width="110px" align="center" prop="sort" />
  236. <el-table-column label="栏舍名称" min-width="110px" align="center" prop="fname" />
  237. <el-table-column label="剩料采集重量(kg)" min-width="110px" align="center" prop="sweight" />
  238. </el-table>
  239. </div>
  240. <div class="SpreadingMaterials">
  241. <h4>撒料详情</h4>
  242. <el-table
  243. :key="table4.tableKey"
  244. v-loading="table4.listLoading"
  245. :span-method="objectSpanMethod"
  246. element-loading-text="给我一点时间"
  247. :data="table4.list"
  248. border
  249. fit
  250. highlight-current-row
  251. style="width: 100%;"
  252. :row-style="rowStyle"
  253. :cell-style="cellStyle"
  254. class="elTable table-fixed"
  255. height="200px"
  256. >
  257. <el-table-column label="操作编号" min-width="110px" align="center" prop="sort" />
  258. <el-table-column label="转投栏舍" min-width="110px" align="center" prop="fname" />
  259. <el-table-column label="允许分配剩料量" min-width="110px" align="center" prop="lweight" />
  260. <el-table-column label="实际分配重量(kg)" min-width="110px" align="center" prop="actualweightminus" />
  261. <el-table-column label="废弃剩料重量" min-width="110px" align="center" prop="aweight" />
  262. </el-table>
  263. </div>
  264. </el-col>
  265. <!-- 撒料计划-混料 -->
  266. <el-col v-if="isSpreadingPlanSH" :span="16">
  267. <div class="title">
  268. <b>过程详情</b>
  269. <span>&nbsp;({{ title }})</span>
  270. </div>
  271. <div class="detail">
  272. <div v-if="table2.list.length !== 0">
  273. <b>{{ table2.list[0].proesstime }}</b>
  274. <span>过程时间</span>
  275. </div>
  276. <div v-if="table2.list.length !== 0">
  277. <b>{{ table2.list[0].proesstime }}</b>
  278. <span>混料时间</span>
  279. </div>
  280. <div v-if="table2.list.length !== 0">
  281. <b>{{ table2.list[0].iscompleted }}</b>
  282. <span>工作状态</span>
  283. </div>
  284. <div v-if="table2.list.length !== 0">
  285. <b>{{ table2.list[0].Hdif }}kg</b>
  286. <span>混料误差值</span>
  287. </div>
  288. <div v-if="table2.list.length !== 0">
  289. <b>{{ table2.list[0].HdifRate }}</b>
  290. <span>混料准确率</span>
  291. </div>
  292. <div v-if="table2.list.length !== 0">
  293. <b>{{ table2.list[0].Sdif }}kg</b>
  294. <span>撒料误差值</span>
  295. </div>
  296. <div v-if="table2.list.length !== 0">
  297. <b>{{ table2.list[0].SdifRate }}</b>
  298. <span>撒料准确率</span>
  299. </div>
  300. </div>
  301. <div class="Mixture">
  302. <h4>混料详情</h4>
  303. <el-table
  304. :key="table3.tableKey"
  305. v-loading="table3.listLoading"
  306. element-loading-text="给我一点时间"
  307. :data="table3.list"
  308. border
  309. fit
  310. highlight-current-row
  311. style="width: 98%;"
  312. :row-style="rowStyle"
  313. :cell-style="cellStyle"
  314. class="elTable table-fixed"
  315. >
  316. <el-table-column label="操作编号" min-width="60px" align="center" prop="sort" />
  317. <el-table-column label="饲料名称" min-width="60px" align="center" prop="fname" />
  318. <el-table-column label="计划重量" min-width="60px" align="center" prop="lweight" />
  319. <el-table-column label="实际重量" min-width="60px" align="center" prop="actualweightminus" />
  320. <el-table-column label="误差值" min-width="60px" align="center" prop="diff" />
  321. <el-table-column label="准确率" min-width="60px" align="center" prop="diffRate" />
  322. <el-table-column label="完成时间" min-width="60px" align="center" prop="intime" />
  323. <el-table-column label="过程时间" min-width="60px" align="center" prop="proesstime" />
  324. <el-table-column label="跳转方式" min-width="60px" align="center" prop="buttontype" />
  325. <el-table-column label="开始重量" min-width="60px" align="center" prop="lastactualweight" />
  326. <el-table-column label="结束重量" min-width="60px" align="center" prop="actualweight" />
  327. </el-table>
  328. </div>
  329. <div class="SpreadingMaterials">
  330. <h4>撒料详情</h4>
  331. <el-table
  332. :key="table4.tableKey"
  333. v-loading="table4.listLoading"
  334. element-loading-text="给我一点时间"
  335. :data="table4.list"
  336. border
  337. fit
  338. highlight-current-row
  339. style="width: 98%;"
  340. :row-style="rowStyle"
  341. :cell-style="cellStyle"
  342. class="elTable table-fixed"
  343. max-height="200px"
  344. >
  345. <el-table-column label="操作编号" min-width="60px" align="center" prop="sort" />
  346. <el-table-column label="撒料车辆" min-width="60px" align="center" prop="fname" />
  347. <el-table-column label="计划重量" min-width="60px" align="center" prop="lweight" />
  348. <el-table-column label="实际重量" min-width="60px" align="center" prop="actualweightminus" />
  349. <el-table-column label="误差值" min-width="60px" align="center" prop="diff" />
  350. <el-table-column label="准确率" min-width="60px" align="center" prop="diffRate" />
  351. <el-table-column label="完成时间" min-width="60px" align="center" prop="intime" />
  352. <el-table-column label="过程时间" min-width="60px" align="center" prop="proesstime" />
  353. <el-table-column label="跳转方式" min-width="60px" align="center" prop="buttontype" />
  354. <el-table-column label="开始重量" min-width="60px" align="center" prop="lastactualweight" />
  355. <el-table-column label="结束重量" min-width="60px" align="center" prop="actualweight" />
  356. </el-table>
  357. </div>
  358. <div class="ControlChart">
  359. <h4>监控图</h4>
  360. <div id="chartLine" style="width: 100%;height:300px;" />
  361. </div>
  362. </el-col>
  363. <!-- 撒料计划-撒料 -->
  364. <el-col v-if="isSpreadingPlanSS" :span="16">
  365. <div class="title">
  366. <b>过程详情</b>
  367. <span>&nbsp;({{ title }})</span>
  368. </div>
  369. <div class="detail">
  370. <div v-if="table2.list.length !== 0">
  371. <b>{{ table2.list[0].proesstime }}</b>
  372. <span>过程时间</span>
  373. </div>
  374. <div v-if="table2.list.length !== 0">
  375. <b>{{ table2.list[0].proesstime }}</b>
  376. <span>混料时间</span>
  377. </div>
  378. <div v-if="table2.list.length !== 0">
  379. <b>{{ table2.list[0].iscompleted }}</b>
  380. <span>工作状态</span>
  381. </div>
  382. <div v-if="table2.list.length !== 0">
  383. <b>{{ table2.list[0].Hdif }}kg</b>
  384. <span>混料误差值</span>
  385. </div>
  386. <div v-if="table2.list.length !== 0">
  387. <b>{{ table2.list[0].HdifRate }}</b>
  388. <span>混料准确率</span>
  389. </div>
  390. <div v-if="table2.list.length !== 0">
  391. <b>{{ table2.list[0].Sdif }}kg</b>
  392. <span>撒料误差值</span>
  393. </div>
  394. <div v-if="table2.list.length !== 0">
  395. <b>{{ table2.list[0].SdifRate }}</b>
  396. <span>撒料准确率</span>
  397. </div>
  398. </div>
  399. <div class="Mixture">
  400. <h4>混料详情</h4>
  401. <el-table
  402. :key="table3.tableKey"
  403. v-loading="table3.listLoading"
  404. element-loading-text="给我一点时间"
  405. :data="table3.list"
  406. border
  407. fit
  408. highlight-current-row
  409. style="width: 98%;"
  410. :row-style="rowStyle"
  411. :cell-style="cellStyle"
  412. class="elTable table-fixed"
  413. >
  414. <el-table-column label="操作编号" min-width="60px" align="center" prop="sort" />
  415. <el-table-column label="撒料车辆" min-width="60px" align="center" prop="fname" />
  416. <el-table-column label="计划重量" min-width="60px" align="center" prop="lweight" />
  417. <el-table-column label="实际重量" min-width="60px" align="center" prop="actualweightminus" />
  418. <el-table-column label="误差值" min-width="60px" align="center" prop="diff" />
  419. <el-table-column label="准确率" min-width="60px" align="center" prop="diffRate" />
  420. <el-table-column label="完成时间" min-width="60px" align="center" prop="intime" />
  421. <el-table-column label="过程时间" min-width="60px" align="center" prop="proesstime" />
  422. <el-table-column label="跳转方式" min-width="60px" align="center" prop="buttontype" />
  423. <el-table-column label="开始重量" min-width="60px" align="center" prop="lastactualweight" />
  424. <el-table-column label="结束重量" min-width="60px" align="center" prop="actualweight" />
  425. </el-table>
  426. </div>
  427. <div class="SpreadingMaterials">
  428. <h4>撒料详情</h4>
  429. <el-table
  430. :key="table4.tableKey"
  431. v-loading="table4.listLoading"
  432. element-loading-text="给我一点时间"
  433. :data="table4.list"
  434. border
  435. fit
  436. highlight-current-row
  437. style="width: 98%;"
  438. :row-style="rowStyle"
  439. :cell-style="cellStyle"
  440. class="elTable table-fixed"
  441. max-height="200px"
  442. >
  443. <el-table-column label="操作编号" min-width="70px" align="center" prop="sort" />
  444. <el-table-column label="撒料车辆" min-width="70px" align="center" prop="fname" />
  445. <el-table-column label="计划重量" min-width="70px" align="center" prop="lweight" />
  446. <el-table-column label="实际重量" min-width="70px" align="center" prop="actualweightminus" />
  447. <el-table-column label="误差值" min-width="70px" align="center" prop="diff" />
  448. <el-table-column label="准确率" min-width="70px" align="center" prop="diffRate" />
  449. <el-table-column label="完成时间" min-width="70px" align="center" prop="intime" />
  450. <el-table-column label="过程时间" min-width="70px" align="center" prop="proesstime" />
  451. <el-table-column label="跳转方式" min-width="70px" align="center" prop="buttontype" />
  452. <el-table-column label="开始重量" min-width="70px" align="center" prop="lastactualweight" />
  453. <el-table-column label="结束重量" min-width="70px" align="center" prop="actualweight" />
  454. </el-table>
  455. </div>
  456. <div class="ControlChart">
  457. <h4>监控图</h4>
  458. <div id="chartLine" style="width: 100%;height:300px;" />
  459. </div>
  460. </el-col>
  461. </el-row>
  462. </div>
  463. </template>
  464. <script>
  465. import echarts from 'echarts'
  466. require('echarts/theme/macarons')
  467. import { GetDataByName, GetReportform, GetDataByNames } from '@/api/common'
  468. import Cookies from 'js-cookie'
  469. import { parseTime } from '@/utils/index.js'
  470. export default {
  471. name: 'GroupProcessAnalysis',
  472. data() {
  473. return {
  474. title: '',
  475. isPremixedPlan: '', // 预混计划
  476. isSpreadingPlan: '', // 撒料计划
  477. isResidualMaterialPlan: '', // 剩料计划,
  478. isSpreadingPlanSH: '', // 撒料计划-混料
  479. isSpreadingPlanSS: '', // 撒料计划-撒料
  480. pickerMinDate: '',
  481. Beforedisabled: false,
  482. Nextdisabled: false,
  483. pickerOptions: {
  484. onPick: ({ maxDate, minDate }) => {
  485. this.pickerMinDate = minDate.getTime()
  486. if (maxDate) {
  487. this.pickerMinDate = ''
  488. }
  489. },
  490. // 限制不能选择今天之后的日期
  491. disabledDate: (time) => {
  492. if (this.pickerMinDate !== '') {
  493. const one = 31 * 24 * 3600 * 1000
  494. const minTime = this.pickerMinDate - one
  495. let maxTime = this.pickerMinDate + one
  496. if (maxTime > new Date()) {
  497. maxTime = new Date()
  498. }
  499. return time.getTime() < minTime || time.getTime() > maxTime
  500. }
  501. return time.getTime() > Date.now()
  502. }
  503. },
  504. requestParams: [
  505. { name: 'getPastureListJT', offset: 0, pagecount: 0, parammaps: { pastureid: Cookies.get('pastureid'), pasturename: '' }}
  506. ],
  507. pastureList: [], // 牧场
  508. planTypeList: [{ lable: '预混计划', value: '4' }, { lable: '撒料计划', value: '0' }, { lable: '剩料计划', value: '3' }, { lable: '撒料计划-混料', value: '1' }, { lable: '撒料计划-撒料', value: '2' }, { lable: '预称重计划', value: '5' }], // 计划类型
  509. workingConditionList: [{ id: '0', name: '进行中' }, { id: '1', name: '已完成' }], // 工作状态
  510. // TMR设备列表
  511. table: {
  512. getdataListParm: {
  513. name: 'getprocessAnalysis',
  514. page: 1,
  515. offset: 1,
  516. pagecount: '',
  517. returntype: 'Map',
  518. parammaps: {
  519. pastureid: '',
  520. startTime: parseTime(new Date(), '{y}-{m}-{d}'),
  521. stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
  522. inputDatetime: [new Date(), new Date()],
  523. // startTime: '2021-07-07',
  524. // stopTime: '2021-07-07',
  525. // inputDatetime: ['2021-07-07', '2021-07-07'],
  526. iscompleted: '',
  527. tmrtname: '',
  528. lpplantype: ''
  529. }
  530. },
  531. tableKey: 0,
  532. list: [],
  533. total: 0,
  534. listLoading: false
  535. },
  536. // 过程详情
  537. table2: {
  538. getdataListParm: {
  539. name: 'getprocessAnalysisStr',
  540. page: 1,
  541. offset: 1,
  542. pagecount: 1,
  543. returntype: 'Map',
  544. parammaps: {
  545. pastureid: Cookies.get('pastureid'),
  546. id: ''
  547. }
  548. },
  549. tableKey: 0,
  550. list: [],
  551. total: 0,
  552. listLoading: true
  553. },
  554. // 混料详情
  555. table3: {
  556. getdataListParm: {
  557. name: 'getprocessAnalysisHL',
  558. page: 1,
  559. offset: 1,
  560. pagecount: '',
  561. returntype: 'Map',
  562. parammaps: {
  563. pastureid: Cookies.get('pastureid'),
  564. id: ''
  565. }
  566. },
  567. tableKey: 0,
  568. list: [],
  569. total: 0,
  570. listLoading: true
  571. },
  572. // 撒料详情
  573. table4: {
  574. getdataListParm: {
  575. name: 'getprocessAnalysisSL',
  576. page: 1,
  577. offset: 1,
  578. pagecount: '',
  579. returntype: 'Map',
  580. parammaps: {
  581. pastureid: Cookies.get('pastureid'),
  582. id: ''
  583. }
  584. },
  585. tableKey: 0,
  586. list: [],
  587. total: 0,
  588. listLoading: true
  589. },
  590. chart1: {
  591. getdataListParm: {
  592. name: 'getprocessAnalysisTB',
  593. page: 1,
  594. offset: 1,
  595. pagecount: '',
  596. returntype: 'Map',
  597. parammaps: {
  598. pastureid: Cookies.get('pastureid'),
  599. id: ''
  600. }
  601. },
  602. tableKey: 0,
  603. list: [],
  604. total: 0,
  605. listLoading: false,
  606. chartLine_data: []
  607. },
  608. chartLine: null,
  609. chartLine_data: {},
  610. rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
  611. cellStyle: { padding: 0 + 'px' }
  612. }
  613. },
  614. created() {
  615. this.getDownList()
  616. // this.getTimeFn()
  617. },
  618. methods: {
  619. getDownList() {
  620. GetDataByNames(this.requestParams).then(response => {
  621. this.pastureList = response.data.getPastureListJT.list
  622. this.table.getdataListParm.parammaps.pastureid = response.data.getPastureListJT.list[0].pastureid
  623. this.getList()
  624. })
  625. },
  626. // TMR设备列表
  627. getList() {
  628. this.table.listLoading = true
  629. GetDataByName(this.table.getdataListParm).then(response => {
  630. console.log('TMR设备列表table数据', response.data.list)
  631. if (response.data.list !== null) {
  632. this.table.list = response.data.list
  633. if (response.data.list[0].lpplantype == '预混计划') {
  634. this.isPremixedPlan = true
  635. this.isSpreadingPlan = false
  636. this.isResidualMaterialPlan = false
  637. this.isSpreadingPlanSH = false
  638. this.isSpreadingPlanSS = false
  639. this.table2.getdataListParm.parammaps.id = response.data.list[0].id
  640. this.table2.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  641. this.table3.getdataListParm.parammaps.pid = response.data.list[0].id
  642. this.table3.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  643. this.getList2()
  644. this.getList3()
  645. } else if (response.data.list[0].lpplantype == '剩料计划') {
  646. this.isResidualMaterialPlan = true
  647. this.isPremixedPlan = false
  648. this.isSpreadingPlan = false
  649. this.isSpreadingPlanSH = false
  650. this.isSpreadingPlanSS = false
  651. this.table2.getdataListParm.name = 'getprocessAnalysisStrSH'
  652. this.table3.getdataListParm.name = 'getprocessAnalysisHLSH'
  653. this.table4.getdataListParm.name = 'getprocessAnalysisSLSH'
  654. this.table2.getdataListParm.parammaps.id = response.data.list[0].id
  655. this.table2.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  656. this.table3.getdataListParm.parammaps.pid = response.data.list[0].id
  657. this.table3.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  658. this.table4.getdataListParm.parammaps.pid = response.data.list[0].id
  659. this.table4.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  660. this.getList2()
  661. this.getList3()
  662. this.getList4()
  663. } else if (response.data.list[0].lpplantype == '撒料计划-混料') {
  664. // 撒料计划-混料
  665. this.isSpreadingPlan = false
  666. this.isResidualMaterialPlan = false
  667. this.isPremixedPlan = false
  668. this.isSpreadingPlanSH = true
  669. this.isSpreadingPlanSS = false
  670. this.table2.getdataListParm.parammaps.id = response.data.list[0].id
  671. this.table2.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  672. this.table3.getdataListParm.parammaps.pid = response.data.list[0].id
  673. this.table3.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  674. this.table4.getdataListParm.parammaps.pid = response.data.list[0].id
  675. this.table4.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  676. this.getList2()
  677. this.getList3()
  678. this.getList4()
  679. this.chart1.getdataListParm.parammaps.pid = response.data.list[0].id
  680. this.chart1.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  681. this.getChart1()
  682. } else if (response.data.list[0].lpplantype == '撒料计划-撒料') {
  683. // 撒料计划-撒料
  684. this.isSpreadingPlan = false
  685. this.isResidualMaterialPlan = false
  686. this.isPremixedPlan = false
  687. this.isSpreadingPlanSH = false
  688. this.isSpreadingPlanSS = true
  689. this.table2.getdataListParm.parammaps.id = response.data.list[0].id
  690. this.table2.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  691. this.table3.getdataListParm.parammaps.pid = response.data.list[0].id
  692. this.table3.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  693. this.table4.getdataListParm.parammaps.pid = response.data.list[0].id
  694. this.table4.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  695. this.getList2()
  696. this.getList3()
  697. this.getList4()
  698. this.chart1.getdataListParm.parammaps.pid = response.data.list[0].id
  699. this.chart1.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  700. this.getChart1()
  701. } else if (response.data.list[0].lpplantype == '预称重计划') {
  702. // 撒料计划-混料
  703. this.isSpreadingPlan = false
  704. this.isResidualMaterialPlan = false
  705. this.isPremixedPlan = false
  706. this.isSpreadingPlanSH = true
  707. this.isSpreadingPlanSS = false
  708. this.table2.getdataListParm.parammaps.id = response.data.list[0].id
  709. this.table2.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  710. this.table3.getdataListParm.parammaps.pid = response.data.list[0].id
  711. this.table3.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  712. this.table4.getdataListParm.parammaps.pid = response.data.list[0].id
  713. this.table4.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  714. this.getList2()
  715. this.getList3()
  716. this.getList4()
  717. this.chart1.getdataListParm.parammaps.pid = response.data.list[0].id
  718. this.chart1.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  719. this.getChart1()
  720. } else {
  721. // 撒料
  722. this.isSpreadingPlan = true
  723. this.isResidualMaterialPlan = false
  724. this.isPremixedPlan = false
  725. this.isSpreadingPlanSH = false
  726. this.isSpreadingPlanSS = false
  727. this.table2.getdataListParm.parammaps.id = response.data.list[0].id
  728. this.table2.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  729. this.table3.getdataListParm.parammaps.pid = response.data.list[0].id
  730. this.table3.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  731. this.table4.getdataListParm.parammaps.pid = response.data.list[0].id
  732. this.table4.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  733. this.getList2()
  734. this.getList3()
  735. this.getList4()
  736. this.chart1.getdataListParm.parammaps.pid = response.data.list[0].id
  737. this.chart1.getdataListParm.parammaps.pastureid = response.data.list[0].pastureid
  738. this.getChart1()
  739. }
  740. this.title = response.data.list[0].lpplantype
  741. } else {
  742. this.table.list = []
  743. this.table2.list = []
  744. this.table3.list = []
  745. this.table2.listLoading = false
  746. this.table3.listLoading = false
  747. this.table4.listLoading = false
  748. this.chart1.listLoading = false
  749. }
  750. setTimeout(() => {
  751. this.table.listLoading = false
  752. }, 100)
  753. })
  754. },
  755. handleSearch() {
  756. console.log('点击了查询')
  757. if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) {
  758. this.table.getdataListParm.parammaps.startTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  759. this.table.getdataListParm.parammaps.stopTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  760. } else {
  761. this.table.getdataListParm.parammaps.inputDatetime = ''
  762. this.table.getdataListParm.parammaps.startTime = ''
  763. this.table.getdataListParm.parammaps.stopTime = ''
  764. }
  765. this.table.getdataListParm.offset = 1
  766. this.getList()
  767. },
  768. handleRefresh() {
  769. console.log('点击了重置')
  770. this.table.getdataListParm.parammaps.tmrtname = ''
  771. this.table.getdataListParm.parammaps.iscompleted = ''
  772. this.table.getdataListParm.parammaps.lpplantype = ''
  773. this.table.getdataListParm.parammaps.startTime = ''
  774. this.table.getdataListParm.parammaps.stopTime = ''
  775. this.table.getdataListParm.parammaps.inputDatetime = ''
  776. this.table.getdataListParm.offset = 1
  777. this.getList()
  778. },
  779. handleBefore() {
  780. if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) {
  781. var start = new Date(this.table.getdataListParm.parammaps.inputDatetime[0].setDate(this.table.getdataListParm.parammaps.inputDatetime[0].getDate() - 1))
  782. var stop = new Date(this.table.getdataListParm.parammaps.inputDatetime[1].setDate(this.table.getdataListParm.parammaps.inputDatetime[1].getDate() - 1))
  783. if (stop > Date.now()) {
  784. this.Nextdisabled = true
  785. this.Beforedisabled = false
  786. } else {
  787. this.Nextdisabled = false
  788. this.Beforedisabled = false
  789. }
  790. this.table.getdataListParm.parammaps.inputDatetime.length = 0
  791. this.table.getdataListParm.parammaps.inputDatetime.push(start, stop)
  792. this.$forceUpdate()
  793. }
  794. this.table.getdataListParm.parammaps.startTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  795. this.table.getdataListParm.parammaps.stopTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  796. this.getList()
  797. },
  798. handleNext() {
  799. if (this.table.getdataListParm.parammaps.inputDatetime !== '' && this.table.getdataListParm.parammaps.inputDatetime !== null) {
  800. var start2 = new Date(this.table.getdataListParm.parammaps.inputDatetime[0].setDate(this.table.getdataListParm.parammaps.inputDatetime[0].getDate() + 1))
  801. var stop2 = new Date(this.table.getdataListParm.parammaps.inputDatetime[1].setDate(this.table.getdataListParm.parammaps.inputDatetime[1].getDate() + 1))
  802. if (stop2 > Date.now()) {
  803. this.Nextdisabled = true
  804. this.Beforedisabled = false
  805. } else {
  806. this.Nextdisabled = false
  807. this.Beforedisabled = false
  808. }
  809. this.table.getdataListParm.parammaps.inputDatetime.length = 0
  810. this.table.getdataListParm.parammaps.inputDatetime.push(start2, stop2)
  811. this.$forceUpdate()
  812. }
  813. this.table.getdataListParm.parammaps.startTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  814. this.table.getdataListParm.parammaps.stopTime = parseTime(this.table.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  815. this.getList()
  816. },
  817. rowClick(row, column, event) {
  818. this.table2.getdataListParm.parammaps.id = row.id
  819. this.table3.getdataListParm.parammaps.pid = row.id
  820. this.table4.getdataListParm.parammaps.pid = row.id
  821. this.chart1.getdataListParm.parammaps.pid = row.id
  822. this.chartName = row.tmrtname
  823. if (row.lpplantype == '预混计划') {
  824. this.isPremixedPlan = true
  825. this.isResidualMaterialPlan = false
  826. this.isSpreadingPlan = false
  827. this.isSpreadingPlanSH = false
  828. this.isSpreadingPlanSS = false
  829. this.table2.getdataListParm.name = 'getprocessAnalysisStr'
  830. this.table3.getdataListParm.name = 'getprocessAnalysisHL'
  831. this.table2.getdataListParm.parammaps.pastureid = row.pastureid
  832. this.table3.getdataListParm.parammaps.pastureid = row.pastureid
  833. this.getList2()
  834. this.getList3()
  835. } else if (row.lpplantype == '剩料计划') {
  836. this.isResidualMaterialPlan = true
  837. this.isPremixedPlan = false
  838. this.isSpreadingPlan = false
  839. this.isSpreadingPlanSH = false
  840. this.isSpreadingPlanSS = false
  841. this.table2.getdataListParm.name = 'getprocessAnalysisStrSH'
  842. this.table3.getdataListParm.name = 'getprocessAnalysisHLSH'
  843. this.table4.getdataListParm.name = 'getprocessAnalysisSLSH'
  844. this.table2.getdataListParm.parammaps.pastureid = row.pastureid
  845. this.table3.getdataListParm.parammaps.pastureid = row.pastureid
  846. this.table4.getdataListParm.parammaps.pastureid = row.pastureid
  847. this.getList2()
  848. this.getList3()
  849. this.getList4()
  850. } else if (row.lpplantype == '撒料计划-混料') {
  851. this.isSpreadingPlan = false
  852. this.isPremixedPlan = false
  853. this.isResidualMaterialPlan = false
  854. this.isSpreadingPlanSH = true
  855. this.isSpreadingPlanSS = false
  856. this.table2.getdataListParm.name = 'getprocessAnalysisStr'
  857. this.table3.getdataListParm.name = 'getprocessAnalysisHL'
  858. this.table4.getdataListParm.name = 'getprocessAnalysisSL'
  859. this.table2.getdataListParm.parammaps.pastureid = row.pastureid
  860. this.table3.getdataListParm.parammaps.pastureid = row.pastureid
  861. this.table4.getdataListParm.parammaps.pastureid = row.pastureid
  862. this.chart1.getdataListParm.parammaps.pastureid = row.pastureid
  863. this.getList2()
  864. this.getList3()
  865. this.getList4()
  866. this.getChart1()
  867. } else if (row.lpplantype == '撒料计划-撒料') {
  868. this.isSpreadingPlan = false
  869. this.isPremixedPlan = false
  870. this.isResidualMaterialPlan = false
  871. this.isSpreadingPlanSH = false
  872. this.isSpreadingPlanSS = true
  873. this.table2.getdataListParm.name = 'getprocessAnalysisStr'
  874. this.table3.getdataListParm.name = 'getprocessAnalysisHL'
  875. this.table4.getdataListParm.name = 'getprocessAnalysisSL'
  876. this.table2.getdataListParm.parammaps.pastureid = row.pastureid
  877. this.table3.getdataListParm.parammaps.pastureid = row.pastureid
  878. this.table4.getdataListParm.parammaps.pastureid = row.pastureid
  879. this.chart1.getdataListParm.parammaps.pastureid = row.pastureid
  880. this.getList2()
  881. this.getList3()
  882. this.getList4()
  883. this.getChart1()
  884. } else if (row.lpplantype == '预称重计划') {
  885. this.isSpreadingPlan = false
  886. this.isPremixedPlan = false
  887. this.isResidualMaterialPlan = false
  888. this.isSpreadingPlanSH = true
  889. this.isSpreadingPlanSS = false
  890. this.table2.getdataListParm.name = 'getprocessAnalysisStr'
  891. this.table3.getdataListParm.name = 'getprocessAnalysisHL'
  892. this.table4.getdataListParm.name = 'getprocessAnalysisSL'
  893. this.table2.getdataListParm.parammaps.pastureid = row.pastureid
  894. this.table3.getdataListParm.parammaps.pastureid = row.pastureid
  895. this.table4.getdataListParm.parammaps.pastureid = row.pastureid
  896. this.chart1.getdataListParm.parammaps.pastureid = row.pastureid
  897. this.getList2()
  898. this.getList3()
  899. this.getList4()
  900. this.getChart1()
  901. } else {
  902. this.isSpreadingPlan = true
  903. this.isPremixedPlan = false
  904. this.isResidualMaterialPlan = false
  905. this.isSpreadingPlanSH = false
  906. this.isSpreadingPlanSS = false
  907. this.table2.getdataListParm.name = 'getprocessAnalysisStr'
  908. this.table3.getdataListParm.name = 'getprocessAnalysisHL'
  909. this.table4.getdataListParm.name = 'getprocessAnalysisSL'
  910. this.table2.getdataListParm.parammaps.pastureid = row.pastureid
  911. this.table3.getdataListParm.parammaps.pastureid = row.pastureid
  912. this.table4.getdataListParm.parammaps.pastureid = row.pastureid
  913. this.chart1.getdataListParm.parammaps.pastureid = row.pastureid
  914. this.getList2()
  915. this.getList3()
  916. this.getList4()
  917. this.getChart1()
  918. }
  919. this.title = '' + row.lpplantype
  920. },
  921. // 过程详情
  922. getList2() {
  923. this.table2.listLoading = false
  924. GetDataByName(this.table2.getdataListParm).then(response => {
  925. console.log('过程详情table数据', response.data.list)
  926. if (response.data.list !== null) {
  927. this.table2.list = response.data.list
  928. } else {
  929. this.table2.list = []
  930. }
  931. setTimeout(() => {
  932. this.table2.listLoading = false
  933. }, 100)
  934. })
  935. },
  936. // 混料详情
  937. getList3() {
  938. this.table3.listLoading = false
  939. GetDataByName(this.table3.getdataListParm).then(response => {
  940. console.log('混料详情table数据', response.data.list)
  941. if (response.data.list !== null) {
  942. this.table3.list = response.data.list
  943. } else {
  944. this.table3.list = []
  945. }
  946. setTimeout(() => {
  947. this.table3.listLoading = false
  948. }, 100)
  949. })
  950. },
  951. // 撒料详情
  952. getList4() {
  953. this.table4.listLoading = false
  954. GetDataByName(this.table4.getdataListParm).then(response => {
  955. console.log('撒料详情table数据', response.data.list)
  956. if (response.data.list !== null) {
  957. this.table4.list = response.data.list
  958. this.rowspan()
  959. } else {
  960. this.table4.list = []
  961. }
  962. setTimeout(() => {
  963. this.table4.listLoading = false
  964. }, 100)
  965. })
  966. },
  967. rowspan() {
  968. this.spanArr = []
  969. this.table4.list.forEach((item, index) => {
  970. if (index == 0) {
  971. this.spanArr.push(1)
  972. this.position = 0
  973. } else {
  974. console.log(item, index, '======')
  975. if (this.table4.list[index].aweight == this.table4.list[index - 1].aweight) {
  976. this.spanArr[this.position] += 1
  977. this.spanArr.push(0)
  978. } else {
  979. this.spanArr.push(1)
  980. this.position = index
  981. }
  982. }
  983. })
  984. },
  985. objectSpanMethod({ row, column, rowIndex, columnIndex }) {
  986. if (columnIndex == 4) {
  987. const _row = this.spanArr[rowIndex]
  988. const _col = _row > 0 ? 1 : 0
  989. return {
  990. rowspan: _row,
  991. colspan: _col
  992. }
  993. }
  994. },
  995. getChart1() {
  996. this.chart1.listLoading = true
  997. GetReportform(this.chart1.getdataListParm).then(response => {
  998. if (response.data.list !== null) {
  999. this.chart1.list = response.data.data
  1000. console.log('实时监控', response.data.list)
  1001. // console.log('实时监控', response.data.list.data4)
  1002. var evenNumbers = []// 偶数
  1003. var oddNumbers = []// 奇数
  1004. for (let i = 0; i < response.data.list.data4.length; i++) {
  1005. console.log(response.data.list.data4[i])
  1006. if (i == 0) {
  1007. oddNumbers.push(response.data.list.data4[i])
  1008. } else {
  1009. if (i % 2 == 0) {
  1010. evenNumbers.push(response.data.list.data4[i])
  1011. } else {
  1012. oddNumbers.push(response.data.list.data4[i])
  1013. }
  1014. }
  1015. }
  1016. response.data.list.data4 = oddNumbers
  1017. response.data.list.data5 = evenNumbers
  1018. // 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'],
  1019. // response.data.list.data2 = [
  1020. // { 'value': '141.6', 'myname': 'A1' },
  1021. // { 'value': '141.6', 'myname': 'A1' },
  1022. // { 'value': '141.6', 'myname': 'A1' },
  1023. // { 'value': '141.6', 'myname': 'A1' },
  1024. // { 'value': '141.6', 'myname': 'A1' },
  1025. // { 'value': '141.6', 'myname': 'A1' },
  1026. // { 'value': '141.6', 'myname': 'A1' },
  1027. // { 'value': '141.6', 'myname': 'A1' },
  1028. // { 'value': '141.6', 'myname': 'A1' },
  1029. // { 'value': '141.6', 'myname': 'A1' },
  1030. // { 'value': '141.6', 'myname': 'A1' },
  1031. // { 'value': '141.6', 'myname': 'A1' },
  1032. // { 'value': '141.6', 'myname': 'A1' },
  1033. // { 'value': '141.6', 'myname': 'A1' },
  1034. // { 'value': '141.6', 'myname': 'A1' },
  1035. // { 'value': '141.6', 'myname': 'A1' },
  1036. // { 'value': '141.6', 'myname': 'A1' },
  1037. // { 'value': '141.6', 'myname': 'A1' },
  1038. // { 'value': '141.6', 'myname': 'A1' },
  1039. // { 'value': '141.6', 'myname': 'A1' },
  1040. // { 'value': '141.6', 'myname': 'A1' },
  1041. // { 'value': '141.6', 'myname': 'A1' },
  1042. // { 'value': '141.6', 'myname': 'A1' },
  1043. // { 'value': '141.6', 'myname': 'A1' },
  1044. // { 'value': '141.6', 'myname': 'A1' },
  1045. // { 'value': '141.6', 'myname': 'A1' },
  1046. // { 'value': '141.6', 'myname': 'A1' },
  1047. // { 'value': '141.6', 'myname': 'A1' },
  1048. // { 'value': '341.46', 'myname': 'B1' },
  1049. // { 'value': '341.46', 'myname': 'B1' },
  1050. // { 'value': '341.46', 'myname': 'B1' },
  1051. // { 'value': '341.46', 'myname': 'B1' },
  1052. // { 'value': '341.46', 'myname': 'B1' },
  1053. // { 'value': '341.46', 'myname': 'B1' },
  1054. // { 'value': '341.46', 'myname': 'B1' },
  1055. // { 'value': '437.73', 'myname': 'C1' },
  1056. // { 'value': '437.73', 'myname': 'C1' },
  1057. // { 'value': '437.73', 'myname': 'C1' },
  1058. // { 'value': '437.73', 'myname': 'C1' },
  1059. // { 'value': '437.73', 'myname': 'C1' },
  1060. // { 'value': '437.73', 'myname': 'C1' },
  1061. // { 'value': '437.73', 'myname': 'C1' },
  1062. // { 'value': '687.33', 'myname': 'C1' },
  1063. // { 'value': '687.33', 'myname': 'C1' },
  1064. // { 'value': '687.33', 'myname': 'C1' },
  1065. // { 'value': '687.33', 'myname': 'C1' },
  1066. // { 'value': '687.33', 'myname': 'C1' },
  1067. // { 'value': '687.33', 'myname': 'C1' },
  1068. // { 'value': '687.33', 'myname': 'C1' },
  1069. // { 'value': '959.24', 'myname': 'D1' },
  1070. // { 'value': '959.24', 'myname': 'D1' },
  1071. // { 'value': '959.24', 'myname': 'D1' },
  1072. // { 'value': '959.24', 'myname': 'D1' },
  1073. // { 'value': '959.24', 'myname': 'D1' },
  1074. // { 'value': '959.24', 'myname': 'D1' },
  1075. // { 'value': '959.24', 'myname': 'D1' },
  1076. // { 'value': '959.24', 'myname': 'D1' },
  1077. // { 'value': '1107.6', 'myname': 'D1' },
  1078. // { 'value': '1107.6', 'myname': 'D1' },
  1079. // { 'value': '1107.6', 'myname': 'D1' },
  1080. // { 'value': '1107.6', 'myname': 'D1' },
  1081. // { 'value': '1107.6', 'myname': 'D1' },
  1082. // { 'value': '1107.6', 'myname': 'D1' },
  1083. // { 'value': '1107.6', 'myname': 'D1' },
  1084. // { 'value': '1107.6', 'myname': 'D1' }
  1085. // ]
  1086. // 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],
  1087. this.chart1.chartLine_data = response.data.list
  1088. this.chart1.total = response.data.total
  1089. this.roadChartLine1(this.chart1.chartLine_data)
  1090. } else {
  1091. this.chart1.list = []
  1092. }
  1093. setTimeout(() => {
  1094. this.chart1.listLoading = false
  1095. }, 100)
  1096. })
  1097. },
  1098. roadChartLine1(chartLine_data) {
  1099. console.log(chartLine_data, 'chartLine_data')
  1100. if (this.chartLine != null) {
  1101. this.chartLine.dispose()
  1102. }
  1103. this.chartLine = echarts.init(document.getElementById('chartLine'))
  1104. var option = {
  1105. title: { text: '', subtext: '' },
  1106. color: ['#38c193', '#5199e5', '#fdb06a', '#fb8b73'], // 关键加上这句话,legend的颜色和折线的自定义颜色就一致了
  1107. legend: [{
  1108. itemWidth: 15, itemHeight: 7, right: '25%', textStyle: { fontSize: 12 },
  1109. data: [{ name: '设计重量' }, { name: '实际重量' }]
  1110. }, {
  1111. itemWidth: 15, itemHeight: 15, right: '0', textStyle: { fontSize: 12 },
  1112. data: [{ name: '开始重量', icon: 'image://https://kptyun.cn:8081/file/pic/3.png' }, { name: '结束重量', icon: 'image://https://kptyun.cn:8081/file/pic/4.png' }]
  1113. }],
  1114. tooltip: {
  1115. trigger: 'axis',
  1116. formatter: function(params) {
  1117. // console.log(params, 'params')
  1118. var tip = params[0].name
  1119. for (let i = 0; i < params.length; i++) {
  1120. tip += '<br>' + params[i].seriesName + ': '
  1121. if (params[i].value[0] == params[0].name) {
  1122. tip += params[i].value[1]
  1123. } else {
  1124. tip += params[i].value
  1125. }
  1126. }
  1127. tip += '<br>' + params[0].data[2] + params[0].data[3]
  1128. console.log(tip, 'tip')
  1129. return tip
  1130. }
  1131. },
  1132. calculable: true,
  1133. xAxis: [
  1134. { type: 'category', splitLine: { show: false }, name: '时间', data: chartLine_data.data1, axisLabel: { show: true, textStyle: { color: '#666' }}}
  1135. ],
  1136. yAxis: [{ type: 'value' }],
  1137. series: [
  1138. { symbol: 'none', name: '实际重量', type: 'line', data: chartLine_data.data3, smooth: true, barWidth: '37', itemStyle: { normal: { lineStyle: { color: '#38c193' }}}},
  1139. { symbol: 'none', name: '设计重量', type: 'line', step: 'middle', data: chartLine_data.data2 },
  1140. { name: '开始重量', symbol: 'image://https://kptyun.cn:8081/file/pic/3.png', symbolSize: 10, type: 'scatter', data: chartLine_data.data4 },
  1141. { name: '结束重量', symbol: 'image://https://kptyun.cn:8081/file/pic/4.png', symbolSize: 10, type: 'scatter', data: chartLine_data.data5 }
  1142. ]
  1143. }
  1144. this.chartLine.setOption(option)
  1145. window.onresize = function() {
  1146. this.chartLine.resize()
  1147. }
  1148. }
  1149. }
  1150. }
  1151. </script>
  1152. <style lang="scss" scoped>
  1153. .search{padding-top:10px;clear: both;}
  1154. .table{margin-top:10px;}
  1155. .detail{
  1156. height:84px;padding:0 10px;font:16px/32px '';color:#333;background: #F9F9F9;display: flex; align-items: center;text-align: center;
  1157. div{
  1158. height: 15px;width: 20%;border-right: 1px solid #E0E0E0;color: #333;
  1159. b{line-height: 20px;font-size: 16px;display: block;margin-top: -10px;height: 20px;color: #009A69;}
  1160. span{font-size: 14px;}
  1161. }
  1162. div:last-child{border-right:none}
  1163. }
  1164. .title{height: 50px;line-height: 50px;}
  1165. </style>