e3481ebc663380c771117d3df5dd24ffc7dc1bc2.svn-base 57 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343
  1. <template>
  2. <div class="app-container1">
  3. <div class="search">
  4. <el-date-picker v-model="tab.table.getdataListParm.parammaps.date" :clearable="false" type="date" placeholder="选择日期" style="width: 150px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" />
  5. <el-button class="el-icon-arrow-left elIconArrowLeft" @click="handleBefore" />
  6. <el-button class="el-icon-arrow-right elIconArrowRight" @click="handleNext" />
  7. <el-button class="successBorder" @click="handleSearch">查询</el-button>
  8. <el-button class="export" @click="handleDownload">导出</el-button>
  9. <svg-icon icon-class="Up" class="down" style="width: 40px;height: 40px;float: right;" @click="handleQuickJumpChart" />
  10. </div>
  11. <div id="table" class="table">
  12. <el-table
  13. :key="tab.table.tableKey"
  14. v-loading="tab.table.listLoading"
  15. element-loading-text="给我一点时间"
  16. :data="tab.table.list"
  17. border
  18. fit
  19. highlight-current-row
  20. style="width: 100%;"
  21. :row-style="rowStyle"
  22. :cell-style="tableCellStyle"
  23. class="elTable table-fixed"
  24. >
  25. <el-table-column label="牧场" min-width="110px" align="center">
  26. <template slot-scope="{row}">
  27. <a @click="clickPasture(row)">{{ row.pasturename }}</a>
  28. </template>
  29. </el-table-column>
  30. <el-table-column label="实际牛头数" min-width="90px" align="center" prop="实际牛头数" />
  31. <el-table-column label="应混料量(kg)" min-width="90px" align="center" prop="应混料量" />
  32. <el-table-column label="实际混料量(kg)" min-width="90px" align="center" prop="实际混料量" />
  33. <el-table-column label="撒料量(kg)" min-width="90px" align="center" prop="撒料量" />
  34. <el-table-column label="平均混料时间" min-width="90px" align="center" prop="混料时间" />
  35. <el-table-column label="转投剩料量(kg)" min-width="90px" align="center" prop="转投剩料量" />
  36. <el-table-column label="今日剩料量(kg)" min-width="90px" align="center" prop="今日剩料量" />
  37. <el-table-column label="剩料率(%)" min-width="90px" align="center" prop="剩料率" />
  38. <el-table-column label="TMR干物质(%)" min-width="90px" align="center" prop="TMR干物质" />
  39. <el-table-column label="配方干物质采食量(kg/头)" min-width="90px" align="center" prop="配方干物质采食量" />
  40. <el-table-column label="实际干物质采食量(kg/头)" min-width="90px" align="center" prop="实际干物质采食量" />
  41. <el-table-column label="采食率(%)" min-width="90px" align="center" prop="采食率" />
  42. <el-table-column label="配方成本(元/头)" min-width="90px" align="center" prop="配方成本" />
  43. <el-table-column label="实际成本(元/头)" min-width="90px" align="center" prop="实际成本" />
  44. <el-table-column label="产奶量(kg/头)" min-width="90px" align="center" prop="产奶量" />
  45. <el-table-column label="饲料转化率" min-width="90px" align="center" prop="饲料转化率" />
  46. <el-table-column label="公斤奶饲料成本" min-width="90px" align="center" prop="公斤奶饲料成本" />
  47. </el-table>
  48. <!-- <pagination v-show="tab.table.total>=0" :total="tab.table.total" :page.sync="tab.table.getdataListParm.offset" :limit.sync="tab.table.getdataListParm.pagecount" @pagination="getList" /> -->
  49. </div>
  50. <div class="AnalysisChart">
  51. <el-row :gutter="10">
  52. <el-col :span="24" style="margin-bottom: 10px;margin-top: 10px;">
  53. <span>图表查询时间:</span>
  54. <el-date-picker v-model="tab.chartDate" :clearable="false" style="margin-left: 10px;width: 250px;margin-right: 10px;" class="inputDatetime filter-item" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" />
  55. <el-button class="successBorder" @click="handleChartDate">确认</el-button>
  56. <svg-icon icon-class="Up" style="width: 40px;height: 40px;float: right;" @click="handleQuickJumpTop" />
  57. </el-col>
  58. </el-row>
  59. <el-row :gutter="10" class="dashboard-editor-container">
  60. <!-- 泌乳牛干物质采食量 -->
  61. <el-col :span="12">
  62. <div class="grid-content">
  63. <h4>泌乳牛干物质采食量</h4>
  64. <div v-if="tab.chart1.isChart" class="button">
  65. <el-date-picker v-model="tab.chart1.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart1')" />
  66. <div class="exportTable" @click="handleExport('chart1')">导出</div>
  67. <div class="exportTable" @click="handleTable('chart1')">切换表格</div>
  68. </div>
  69. <div v-if="tab.chart1.isChart" id="chartLine1" style="width:100%;height:400px;" />
  70. <div v-if="tab.chart1.isTable" class="table">
  71. <div class="button">
  72. <div class="exportTable" @click="handleExport('chart1')">导出</div>
  73. <div class="exportTable" @click="handleChart('chart1')">切换图表</div>
  74. </div>
  75. <el-table
  76. :key="tab.chart1.table.tableKey"
  77. v-loading="tab.chart1.table.listLoading"
  78. element-loading-text="给我一点时间"
  79. :data="tab.chart1.table.list"
  80. border
  81. fit
  82. highlight-current-row
  83. style="width: 100%;"
  84. height="400"
  85. :row-style="rowStyle"
  86. :cell-style="cellStyle"
  87. class="elTable table-fixed"
  88. >
  89. <el-table-column label="日期" sortable min-width="110px" align="center" prop="日期" />
  90. <el-table-column label="牧场" sortable min-width="110px" align="center" prop="名称" />
  91. <el-table-column label="泌乳牛干物质采食量(kg)" sortable min-width="110px" align="center" prop="准确率" />
  92. </el-table>
  93. </div>
  94. </div>
  95. </el-col>
  96. <!-- 剩料率 -->
  97. <el-col :span="12">
  98. <div class="grid-content">
  99. <h4>剩料率</h4>
  100. <div v-if="tab.chart2.isChart" class="button">
  101. <el-date-picker v-model="tab.chart2.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart2')" />
  102. <div class="exportTable" @click="handleExport('chart2')">导出</div>
  103. <div class="exportTable" @click="handleTable('chart2')">切换表格</div>
  104. </div>
  105. <div v-if="tab.chart2.isChart" id="chartLine2" style="width:100%;height:400px;" />
  106. <div v-if="tab.chart2.isTable" class="table">
  107. <div class="button">
  108. <div class="exportTable" @click="handleExport('chart2')">导出</div>
  109. <div class="exportTable" @click="handleChart('chart2')">切换图表</div>
  110. </div>
  111. <el-table
  112. :key="tab.chart2.table.tableKey"
  113. v-loading="tab.chart2.table.listLoading"
  114. element-loading-text="给我一点时间"
  115. :data="tab.chart2.table.list"
  116. border
  117. fit
  118. highlight-current-row
  119. style="width: 100%;"
  120. height="400"
  121. :row-style="rowStyle"
  122. :cell-style="cellStyle"
  123. class="elTable table-fixed"
  124. >
  125. <el-table-column label="日期" sortable min-width="110px" align="center" prop="日期" />
  126. <el-table-column label="牧场" sortable min-width="110px" align="center" prop="名称" />
  127. <el-table-column label="剩料量" sortable min-width="110px" align="center" prop="剩料量" />
  128. <el-table-column label="撒料量" sortable min-width="110px" align="center" prop="撒料量" />
  129. <el-table-column label="剩料率" sortable min-width="110px" align="center" prop="准确率" />
  130. </el-table>
  131. </div>
  132. </div>
  133. </el-col>
  134. </el-row>
  135. <el-row :gutter="10" class="dashboard-editor-container">
  136. <!-- 混料时间统计 -->
  137. <el-col :span="12">
  138. <div class="grid-content">
  139. <h4>混料时间统计</h4>
  140. <div v-if="tab.chart3.isChart" class="button">
  141. <el-date-picker v-model="tab.chart3.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart1')" />
  142. <div class="exportTable" @click="handleExport('chart3')">导出</div>
  143. <div class="exportTable" @click="handleTable('chart3')">切换表格</div>
  144. </div>
  145. <div v-if="tab.chart3.isChart" id="chartLine3" style="width:100%;height:400px;" />
  146. <div v-if="tab.chart3.isTable" class="table">
  147. <div class="button">
  148. <div class="exportTable" @click="handleExport('chart3')">导出</div>
  149. <div class="exportTable" @click="handleChart('chart3')">切换图表</div>
  150. </div>
  151. <el-table
  152. :key="tab.chart3.table.tableKey"
  153. v-loading="tab.chart3.table.listLoading"
  154. element-loading-text="给我一点时间"
  155. :data="tab.chart3.table.list"
  156. border
  157. fit
  158. highlight-current-row
  159. style="width: 100%;"
  160. height="400"
  161. :row-style="rowStyle"
  162. :cell-style="cellStyle"
  163. class="elTable table-fixed"
  164. >
  165. <el-table-column label="日期" min-width="110px" align="center" prop="日期" />
  166. <el-table-column label="牧场" min-width="110px" align="center" prop="名称" />
  167. <el-table-column label="混料时间(分钟)" min-width="110px" align="center" prop="准确率" />
  168. </el-table>
  169. </div>
  170. </div>
  171. </el-col>
  172. <!-- 转化率 -->
  173. <el-col :span="12" style="position: relative;">
  174. <div class="grid-content">
  175. <h4>转化率</h4>
  176. <div v-if="tab.chart4.isChart" class="button">
  177. <el-date-picker v-model="tab.chart4.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart1')" />
  178. <div class="exportTable" @click="handleExport('chart4')">导出</div>
  179. <div class="exportTable" @click="handleTable('chart4')">切换表格</div>
  180. </div>
  181. <div v-if="tab.chart4.isChart" id="chartLine4" style="width:100%;height:400px;" />
  182. <div v-if="tab.chart4.isTable" class="table">
  183. <div class="button">
  184. <div class="exportTable" @click="handleExport('chart4')">导出</div>
  185. <div class="exportTable" @click="handleChart('chart4')">切换图表</div>
  186. </div>
  187. <el-table
  188. :key="tab.chart4.table.tableKey"
  189. v-loading="tab.chart4.table.listLoading"
  190. element-loading-text="给我一点时间"
  191. :data="tab.chart4.table.list"
  192. border
  193. fit
  194. highlight-current-row
  195. style="width: 100%;"
  196. height="400"
  197. :row-style="rowStyle"
  198. :cell-style="cellStyle"
  199. class="elTable table-fixed"
  200. >
  201. <el-table-column label="日期" min-width="110px" align="center" prop="日期" />
  202. <el-table-column label="牧场" min-width="110px" align="center" prop="名称" />
  203. <el-table-column label="饲料转化率" min-width="110px" align="center" prop="准确率" />
  204. </el-table>
  205. </div>
  206. </div>
  207. </el-col>
  208. </el-row>
  209. <el-row :gutter="10" class="dashboard-editor-container">
  210. <!-- 成本分析 -->
  211. <el-col :span="24">
  212. <div class="grid-content">
  213. <h4>成本分析</h4>
  214. <div v-if="tab.chart5.isChart" class="button">
  215. <el-date-picker v-model="tab.chart5.getdataListParm.parammaps.inputDatetime" style="width: 250px;" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :clearable="false" :picker-options="pickerOptions" @change="changeChartDate('chart5')" />
  216. <div class="exportTable" @click="handleExport('chart5')">导出</div>
  217. <div class="exportTable" @click="handleTable('chart5')">切换表格</div>
  218. </div>
  219. <div v-if="tab.chart5.isChart" id="chartLine5" style="width:100%;height:400px;" />
  220. <div v-if="tab.chart5.isTable" class="table">
  221. <div class="button">
  222. <div class="exportTable" @click="handleExport('chart5')">导出</div>
  223. <div class="exportTable" @click="handleChart('chart5')">切换图表</div>
  224. </div>
  225. <el-table
  226. :key="tab.chart5.table.tableKey"
  227. v-loading="tab.chart5.table.listLoading"
  228. element-loading-text="给我一点时间"
  229. :data="tab.chart5.table.list"
  230. border
  231. fit
  232. highlight-current-row
  233. style="width: 100%;"
  234. height="430"
  235. :row-style="rowStyle"
  236. :cell-style="cellStyle"
  237. class="elTable table-fixed"
  238. >
  239. <el-table-column label="日期" min-width="110px" align="center" prop="日期" />
  240. <el-table-column label="牧场" min-width="110px" align="center" prop="名称" />
  241. <el-table-column label="公斤奶饲料成本(元)" min-width="110px" align="center" prop="准确率" />
  242. </el-table>
  243. </div>
  244. </div>
  245. </el-col>
  246. </el-row>
  247. </div>
  248. <el-dialog :title="textMap[pasture.dialogStatus]" :destroy-on-close="true" :visible.sync="pasture.dialogFormVisible" :close-on-click-modal="false" width="90%">
  249. <div class="app-pasture">
  250. <div class="search">
  251. <span style="margin-left: 10px;">统计类型:</span>
  252. <el-radio v-model="pasture.radio" label="1" @change="changeRadio">配方</el-radio>
  253. <el-radio v-model="pasture.radio" label="2" @change="changeRadio">栏舍</el-radio>
  254. <el-radio v-model="pasture.radio" label="3" @change="changeRadio">牲畜类别</el-radio>
  255. <el-input v-if="pasture.isFormulaName" v-model="pasture.table.getdataListParm.parammaps.ftname" class="filter-item" style="width: 245px;" placeholder="配方模板" />
  256. <el-input v-if="pasture.isHouseName" v-model="pasture.table.getdataListParm.parammaps.barname" class="filter-item" style="width: 150px;" placeholder="栏舍" />
  257. <el-input v-if="pasture.isHouseName" v-model="pasture.table.getdataListParm.parammaps.ftname" class="filter-item" style="width: 150px;" placeholder="配方模板" />
  258. <el-input v-if="pasture.isLivestockType" v-model="pasture.table.getdataListParm.parammaps.cowclass" class="filter-item" style="width: 150px;" placeholder="牲畜类别" />
  259. <el-button class="successBorder" @click="handlePastureSearch">查询</el-button>
  260. </div>
  261. <div class="table">
  262. <el-table
  263. :key="pasture.table.tableKey"
  264. v-loading="pasture.table.listLoading"
  265. element-loading-text="给我一点时间"
  266. :data="pasture.table.list"
  267. border
  268. fit
  269. highlight-current-row
  270. style="width: 100%;"
  271. :row-style="rowStyle"
  272. :cell-style="cellStyle"
  273. class="elTable table-fixed"
  274. >
  275. <el-table-column v-if="pasture.isFormulaName" label="配方模板" min-width="110px" align="center" prop="配方模板" />
  276. <el-table-column v-if="pasture.isHouseName" label="栏舍" min-width="110px" align="center" prop="栏舍" />
  277. <el-table-column v-if="pasture.isHouseName" label="配方模板" min-width="110px" align="center" prop="配方模板" />
  278. <el-table-column v-if="pasture.isLivestockType" label="牲畜类别" min-width="110px" align="center" prop="牲畜类别" />
  279. <el-table-column label="实际牛头数" min-width="110px" align="center" prop="实际牛头数" />
  280. <el-table-column label="应混料量(kg)" min-width="110px" align="center" prop="应混料量" />
  281. <el-table-column label="实际混料量(kg)" min-width="110px" align="center" prop="实际混料量" />
  282. <el-table-column label="撒料量(kg)" min-width="110px" align="center" prop="撒料量" />
  283. <el-table-column label="混料时间" min-width="110px" align="center" prop="混料时间" />
  284. <el-table-column label="转投剩料量(kg)" min-width="110px" align="center" prop="转投剩料量" />
  285. <el-table-column label="今日剩料量(kg)" min-width="110px" align="center" prop="今日剩料量" />
  286. <el-table-column label="剩料率(%)" min-width="110px" align="center" prop="剩料率" />
  287. <el-table-column label="TMR干物质(%)" min-width="110px" align="center" prop="TMR干物质" />
  288. <el-table-column label="配方干物质采食量(kg/头)" min-width="110px" align="center" prop="配方干物质采食量" />
  289. <el-table-column label="实际干物质采食量(kg/头)" min-width="110px" align="center" prop="实际干物质采食量" />
  290. <el-table-column label="采食率(%)" min-width="110px" align="center" prop="采食率" />
  291. <el-table-column label="配方成本(元/头)" min-width="110px" align="center" prop="配方成本" />
  292. <el-table-column label="实际成本(元/头)" min-width="110px" align="center" prop="实际成本" />
  293. <el-table-column label="产奶量(kg/头)" min-width="110px" align="center" prop="产奶量" />
  294. <el-table-column label="饲料转化率" min-width="110px" align="center" prop="饲料转化率" />
  295. <el-table-column label="公斤奶饲料成本" min-width="110px" align="center" prop="公斤奶饲料成本" />
  296. </el-table>
  297. </div>
  298. </div>
  299. <div slot="footer" class="dialog-footer" style="bottom: 10px;">
  300. <el-button class="cancelClose1" @click="pasture.dialogFormVisible = false; ">关闭</el-button>
  301. </div>
  302. </el-dialog>
  303. </div>
  304. </template>
  305. <script>
  306. import echarts from 'echarts'
  307. require('echarts/theme/macarons')
  308. import { GetDataByName, GetReportform } from '@/api/common'
  309. import Cookies from 'js-cookie'
  310. import { parseTime } from '@/utils/index.js'
  311. import Pagination from '@/components/Pagination'
  312. import { json2excel } from '@/utils/index.js'
  313. import { MessageBox } from 'element-ui'
  314. export default {
  315. name: 'GroupFeedingEfficiency',
  316. components: { Pagination },
  317. data() {
  318. return {
  319. pickerMinDate: '',
  320. pickerOptions: {
  321. onPick: ({ maxDate, minDate }) => {
  322. this.pickerMinDate = minDate.getTime()
  323. if (maxDate) {
  324. this.pickerMinDate = ''
  325. }
  326. },
  327. // 限制不能选择今天之后的日期
  328. disabledDate: (time) => {
  329. if (this.pickerMinDate !== '') {
  330. const one = 31 * 24 * 3600 * 1000
  331. const minTime = this.pickerMinDate - one
  332. let maxTime = this.pickerMinDate + one
  333. if (maxTime > new Date()) {
  334. maxTime = new Date()
  335. }
  336. return time.getTime() < minTime || time.getTime() > maxTime
  337. }
  338. return time.getTime() > Date.now()
  339. }
  340. },
  341. tab: {
  342. chartDate: [],
  343. table: {
  344. getdataListParm: {
  345. name: 'getFeedEfficiencyJT',
  346. page: 1,
  347. offset: 1,
  348. pagecount: '',
  349. returntype: 'Map',
  350. parammaps: {
  351. pastureid: Cookies.get('pastureid'),
  352. date: parseTime(new Date(), '{y}-{m}-{d}'),
  353. ftname: '',
  354. barname: '',
  355. cowclass: ''
  356. }
  357. },
  358. tableKey: 1,
  359. list: [],
  360. total: 0,
  361. listLoading: true,
  362. temp: {}
  363. },
  364. chart1: {
  365. chartLine: null,
  366. chartLine_data: {},
  367. getdataListParm: {
  368. name: 'getFeedEffMRJT',
  369. page: 1,
  370. offset: 1,
  371. pagecount: '',
  372. returntype: 'Map',
  373. parammaps: {
  374. pastureid: Cookies.get('pastureid'),
  375. startTime: parseTime(new Date(), '{y}-{m}-{d}'),
  376. stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
  377. inputDatetime: [new Date(), new Date()]
  378. }
  379. },
  380. tableKey: 1,
  381. list: [],
  382. total: 0,
  383. listLoading: true,
  384. isChart: true,
  385. isTable: false,
  386. table: {
  387. tableKey: 1,
  388. list: [],
  389. total: 0,
  390. listLoading: false
  391. }
  392. },
  393. chart2: {
  394. chartLine: null,
  395. chartLine_data: {},
  396. getdataListParm: {
  397. name: 'getFeedEffSLJT',
  398. page: 1,
  399. offset: 1,
  400. pagecount: '',
  401. returntype: 'Map',
  402. parammaps: {
  403. pastureid: Cookies.get('pastureid'),
  404. startTime: parseTime(new Date(), '{y}-{m}-{d}'),
  405. stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
  406. inputDatetime: [new Date(), new Date()]
  407. }
  408. },
  409. tableKey: 1,
  410. list: [],
  411. total: 0,
  412. listLoading: true,
  413. chart2Data3: [],
  414. isChart: true,
  415. isTable: false,
  416. table: {
  417. tableKey: 1,
  418. list: [],
  419. total: 0,
  420. listLoading: false
  421. }
  422. },
  423. chart3: {
  424. chartLine: null,
  425. chartLine_data: {},
  426. getdataListParm: {
  427. name: 'getFeedEffHLJT',
  428. page: 1,
  429. offset: 1,
  430. pagecount: '',
  431. returntype: 'Map',
  432. parammaps: {
  433. pastureid: Cookies.get('pastureid'),
  434. startTime: parseTime(new Date(), '{y}-{m}-{d}'),
  435. stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
  436. inputDatetime: [new Date(), new Date()]
  437. }
  438. },
  439. tableKey: 1,
  440. list: [],
  441. total: 0,
  442. listLoading: true,
  443. isChart: true,
  444. isTable: false,
  445. table: {
  446. tableKey: 1,
  447. list: [],
  448. total: 0,
  449. listLoading: false
  450. }
  451. },
  452. chart4: {
  453. chartLine: null,
  454. chartLine_data: {},
  455. getdataListParm: {
  456. name: 'getFeedEffZHJT',
  457. page: 1,
  458. offset: 1,
  459. pagecount: '',
  460. returntype: 'Map',
  461. parammaps: {
  462. pastureid: Cookies.get('pastureid'),
  463. startTime: parseTime(new Date(), '{y}-{m}-{d}'),
  464. stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
  465. inputDatetime: [new Date(), new Date()]
  466. }
  467. },
  468. tableKey: 1,
  469. list: [],
  470. total: 0,
  471. listLoading: true,
  472. chart4Data3: [],
  473. isChart: true,
  474. isTable: false,
  475. table: {
  476. tableKey: 1,
  477. list: [],
  478. total: 0,
  479. listLoading: false
  480. }
  481. },
  482. chart5: {
  483. chartLine: null,
  484. chartLine_data: {},
  485. getdataListParm: {
  486. name: 'getFeedEffCBAllJT',
  487. page: 1,
  488. offset: 1,
  489. pagecount: '',
  490. returntype: 'Map',
  491. parammaps: {
  492. pastureid: Cookies.get('pastureid'),
  493. startTime: parseTime(new Date(), '{y}-{m}-{d}'),
  494. stopTime: parseTime(new Date(), '{y}-{m}-{d}'),
  495. inputDatetime: [new Date(), new Date()]
  496. }
  497. },
  498. tableKey: 1,
  499. list: [],
  500. total: 0,
  501. listLoading: true,
  502. chart5Data3: [],
  503. isChart: true,
  504. isTable: false,
  505. table: {
  506. tableKey: 1,
  507. list: [],
  508. total: 0,
  509. listLoading: false
  510. }
  511. }
  512. },
  513. pasture: {
  514. dialogFormVisible: false,
  515. dialogStatus: '',
  516. radio: '1',
  517. isFormulaName: true, // 配方名称
  518. isHouseName: false, // 栏舍名称
  519. isLivestockType: false, // 牲畜类别
  520. table: {
  521. getdataListParm: {
  522. name: 'getFeedEfficiencyFT',
  523. page: 1,
  524. offset: 1,
  525. pagecount: '',
  526. returntype: 'Map',
  527. parammaps: {
  528. pastureid: Cookies.get('pastureid'),
  529. date: parseTime(new Date(), '{y}-{m}-{d}'),
  530. ftname: '',
  531. barname: '',
  532. cowclass: ''
  533. }
  534. },
  535. tableKey: 1,
  536. list: [],
  537. total: 0,
  538. listLoading: true,
  539. temp: {}
  540. }
  541. },
  542. textMap: {
  543. pasture: '牧场'
  544. },
  545. rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
  546. cellStyle: { padding: 0 + 'px' }
  547. }
  548. },
  549. created() {
  550. this.getList()
  551. this.getTimeFn()
  552. this.getChart1()
  553. this.getChart2()
  554. this.getChart3()
  555. this.getChart4()
  556. this.getChart5()
  557. },
  558. mounted() {
  559. },
  560. methods: {
  561. getTimeFn() {
  562. const that = this
  563. const end = new Date()
  564. const start = new Date()
  565. const start2 = new Date()
  566. start2.setTime(start2.getTime() - 3600 * 1000 * 24 * 1)
  567. that.tab.table.getdataListParm.parammaps.date = parseTime(start2, '{y}-{m}-{d}')
  568. start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
  569. that.tab.chartDate[0] = parseTime(start, '{y}-{m}-{d}')
  570. that.tab.chartDate[1] = parseTime(end, '{y}-{m}-{d}')
  571. that.tab.chart1.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  572. that.tab.chart1.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  573. that.tab.chart1.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  574. that.tab.chart1.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  575. that.tab.chart2.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  576. that.tab.chart2.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  577. that.tab.chart2.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  578. that.tab.chart2.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  579. that.tab.chart3.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  580. that.tab.chart3.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  581. that.tab.chart3.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  582. that.tab.chart3.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  583. that.tab.chart4.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  584. that.tab.chart4.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  585. that.tab.chart4.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  586. that.tab.chart4.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  587. that.tab.chart5.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  588. that.tab.chart5.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  589. that.tab.chart5.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  590. that.tab.chart5.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  591. },
  592. // 导出
  593. handleDownload() {},
  594. // 效率统计
  595. getList() {
  596. this.tab.table.listLoading = true
  597. this.tab.table.getdataListParm.parammaps.date = parseTime(this.tab.table.getdataListParm.parammaps.date, '{y}-{m}-{d}')
  598. GetDataByName(this.tab.table.getdataListParm).then(response => {
  599. console.log('汇总统计/混料table数据', response.data.list)
  600. if (response.data.list !== null) {
  601. this.tab.table.list = response.data.list
  602. this.tab.table.total = response.data.total
  603. } else {
  604. this.tab.table.list = []
  605. }
  606. setTimeout(() => {
  607. this.tab.table.listLoading = false
  608. }, 100)
  609. })
  610. },
  611. // 查询
  612. handleSearch() {
  613. this.getList()
  614. },
  615. handleBefore() {
  616. if (this.tab.table.getdataListParm.parammaps.date !== '' && this.tab.table.getdataListParm.parammaps.date !== null) {
  617. this.tab.table.getdataListParm.parammaps.date = new Date(this.tab.table.getdataListParm.parammaps.date)
  618. var start = new Date(this.tab.table.getdataListParm.parammaps.date.setDate(this.tab.table.getdataListParm.parammaps.date.getDate() - 1))
  619. this.tab.table.getdataListParm.parammaps.date = parseTime(start, '{y}-{m}-{d}')
  620. this.getList()
  621. }
  622. },
  623. handleNext() {
  624. if (this.tab.table.getdataListParm.parammaps.date !== '' && this.tab.table.getdataListParm.parammaps.date !== null) {
  625. this.tab.table.getdataListParm.parammaps.date = new Date(this.tab.table.getdataListParm.parammaps.date)
  626. var stop = new Date(this.tab.table.getdataListParm.parammaps.date.setDate(this.tab.table.getdataListParm.parammaps.date.getDate() + 1))
  627. this.tab.table.getdataListParm.parammaps.date = parseTime(stop, '{y}-{m}-{d}')
  628. this.getList()
  629. }
  630. },
  631. tableCellStyle({ row, column, rowIndex, columnIndex }) {
  632. if (columnIndex === 0 && row.pastureid !== '-1') {
  633. return {
  634. textDecoration: 'underline'
  635. }
  636. }
  637. return {
  638. textDecoration: 'none'
  639. }
  640. },
  641. clickPasture(row) {
  642. if (row.pastureid !== '-1') {
  643. this.pasture.dialogStatus = 'pasture'
  644. this.pasture.dialogFormVisible = true
  645. this.pasture.table.getdataListParm.parammaps.pastureid = row.pastureid
  646. this.getTabList()
  647. }
  648. },
  649. // 效率统计
  650. getTabList() {
  651. this.pasture.table.listLoading = true
  652. this.pasture.table.getdataListParm.parammaps.date = this.tab.table.getdataListParm.parammaps.date
  653. GetDataByName(this.pasture.table.getdataListParm).then(response => {
  654. console.log('汇总统计/混料table数据', response.data.list)
  655. if (response.data.list !== null) {
  656. this.pasture.table.list = response.data.list
  657. this.pasture.table.total = response.data.total
  658. } else {
  659. this.pasture.table.list = []
  660. }
  661. setTimeout(() => {
  662. this.pasture.table.listLoading = false
  663. }, 100)
  664. })
  665. },
  666. // 切换统计类型
  667. changeRadio() {
  668. console.log(this.pasture.radio)
  669. if (this.pasture.radio == '1') {
  670. console.log('配方名称')
  671. this.pasture.isFormulaName = true
  672. this.pasture.isHouseName = false
  673. this.pasture.isLivestockType = false
  674. this.pasture.table.getdataListParm.parammaps.ftname = ''
  675. this.pasture.table.getdataListParm.parammaps.barname = ''
  676. this.pasture.table.getdataListParm.parammaps.ftname = ''
  677. this.pasture.table.getdataListParm.parammaps.cowclass = ''
  678. this.pasture.table.getdataListParm.name = 'getFeedEfficiencyFT'
  679. this.getTabList()
  680. } else if (this.pasture.radio == '2') {
  681. console.log('栏舍名称')
  682. this.pasture.isFormulaName = false
  683. this.pasture.isHouseName = true
  684. this.pasture.isLivestockType = false
  685. this.pasture.table.getdataListParm.parammaps.ftname = ''
  686. this.pasture.table.getdataListParm.parammaps.barname = ''
  687. this.pasture.table.getdataListParm.parammaps.ftname = ''
  688. this.pasture.table.getdataListParm.parammaps.cowclass = ''
  689. this.pasture.table.getdataListParm.name = 'getFeedEfficiencyLS'
  690. this.getTabList()
  691. } else if (this.pasture.radio == '3') {
  692. console.log(' 牲畜类别')
  693. this.pasture.isFormulaName = false
  694. this.pasture.isHouseName = false
  695. this.pasture.isLivestockType = true
  696. this.pasture.table.getdataListParm.parammaps.ftname = ''
  697. this.pasture.table.getdataListParm.parammaps.barname = ''
  698. this.pasture.table.getdataListParm.parammaps.ftname = ''
  699. this.pasture.table.getdataListParm.parammaps.cowclass = ''
  700. this.pasture.table.getdataListParm.name = 'getFeedEfficiencySC'
  701. this.getTabList()
  702. }
  703. },
  704. handlePastureSearch() {},
  705. // 快速跳转到图表
  706. handleQuickJumpChart() {
  707. var myHeight = document.getElementById('table').offsetHeight + 120
  708. window.scrollTo(myHeight, myHeight)
  709. },
  710. // 快速回到顶部
  711. handleQuickJumpTop() {
  712. window.scrollTo(0, 0)
  713. },
  714. // 图表总查询
  715. handleChartDate() {
  716. console.log('点击了确认时间')
  717. MessageBox.confirm('是否调整以下所有图表查询时间?', {
  718. confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning'
  719. }).then(() => {
  720. var that = this
  721. var startTime = parseTime(this.tab.chartDate[0], '{y}-{m}-{d}')
  722. var stopTime = parseTime(this.tab.chartDate[1], '{y}-{m}-{d}')
  723. that.tab.chart1.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  724. that.tab.chart1.getdataListParm.parammaps.startTime = startTime
  725. that.tab.chart1.getdataListParm.parammaps.stopTime = stopTime
  726. that.getChart1()
  727. that.tab.chart2.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  728. that.tab.chart2.getdataListParm.parammaps.startTime = startTime
  729. that.tab.chart2.getdataListParm.parammaps.stopTime = stopTime
  730. that.getChart2()
  731. that.tab.chart3.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  732. that.tab.chart3.getdataListParm.parammaps.startTime = startTime
  733. that.tab.chart3.getdataListParm.parammaps.stopTime = stopTime
  734. that.getChart3()
  735. that.tab.chart4.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  736. that.tab.chart4.getdataListParm.parammaps.startTime = startTime
  737. that.tab.chart4.getdataListParm.parammaps.stopTime = stopTime
  738. that.getChart4()
  739. that.tab.chart5.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  740. that.tab.chart5.getdataListParm.parammaps.startTime = startTime
  741. that.tab.chart5.getdataListParm.parammaps.stopTime = stopTime
  742. that.getChart5()
  743. })
  744. },
  745. // 泌乳牛干物质采食量
  746. getChart1() {
  747. this.tab.chart1.listLoading = true
  748. GetReportform(this.tab.chart1.getdataListParm).then(response => {
  749. if (response.data !== null && response.data.list !== null) {
  750. console.log('泌乳牛干物质采食量图表数据', response.data.list)
  751. this.tab.chart1.table.list = response.data.data
  752. this.tab.chart1.chartLine_data = response.data.list
  753. // this.tab.chart1.chartLine_data = {
  754. // data1: ['1牧', '2牧', '3牧'], // 折线
  755. // data2: ['12/01', '12/02', '12/03'], // X轴
  756. // data3: [
  757. // { data: [1.5, 1.2, 1.7, 1.2] },
  758. // { data: [1.7, 0.8, 1.2, 1.8] },
  759. // { data: [1.3, 2.2, 1.9, 1.4] }
  760. // ]// 折线对应数据
  761. // }
  762. // this.tab.chart1.total = response.data.total
  763. } else {
  764. this.tab.chart1.list = []
  765. this.tab.chart1.chartLine_data = {}
  766. }
  767. this.roadChartLine1(this.tab.chart1.chartLine_data)
  768. setTimeout(() => {
  769. this.tab.chart1.listLoading = false
  770. }, 100)
  771. })
  772. },
  773. roadChartLine1(chartLine_data) {
  774. if (this.tab.chart1.chartLine != null) {
  775. this.tab.chart1.chartLine.dispose()
  776. }
  777. this.tab.chart1.chartLine = echarts.init(document.getElementById('chartLine1'))
  778. var option = {
  779. title: {
  780. text: ''
  781. },
  782. tooltip: {
  783. trigger: 'axis'
  784. },
  785. legend: {
  786. data: chartLine_data.data1,
  787. right: 10
  788. },
  789. grid: {
  790. top: '20%',
  791. left: '3%',
  792. right: '8%',
  793. containLabel: true
  794. },
  795. toolbox: {
  796. show: true,
  797. right: '2%',
  798. feature: {}
  799. },
  800. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  801. yAxis: {
  802. type: 'value', name: 'kg', axisLabel: { formatter: '{value}' }
  803. },
  804. series: (function() {
  805. if (chartLine_data.data3 !== undefined) {
  806. var serie = []
  807. for (var i = 0; i < chartLine_data.data3.length; i++) {
  808. var item = {
  809. name: chartLine_data.data1[i],
  810. type: 'line',
  811. data: chartLine_data.data3[i].data
  812. }
  813. serie.push(item)
  814. }
  815. return serie
  816. }
  817. }())
  818. }
  819. this.tab.chart1.chartLine.setOption(option)
  820. window.onresize = function() {
  821. this.tab.chart1.chartLine.resize()
  822. }
  823. },
  824. // 剩料率
  825. getChart2() {
  826. this.tab.chart2.listLoading = true
  827. GetReportform(this.tab.chart2.getdataListParm).then(response => {
  828. if (response.data !== null && response.data.list !== null) {
  829. console.log('剩料率图表数据', response.data.list)
  830. this.tab.chart2.table.list = response.data.data
  831. this.tab.chart2.chartLine_data = response.data.list
  832. // this.tab.chart2.chartLine_data = {
  833. // data1: ['1牧', '2牧', '3牧'], // 折线
  834. // data2: ['12/01', '12/02', '12/03'], // X轴
  835. // data3: [
  836. // { data: [1.5, 1.2, 1.7, 1.2] },
  837. // { data: [1.7, 0.8, 1.2, 1.8] },
  838. // { data: [1.3, 2.2, 1.9, 1.4] }
  839. // ]// 折线对应数据
  840. // }
  841. this.tab.chart2.total = response.data.total
  842. console.log('剩料率图数据', this.tab.chart2.chartLine_data)
  843. console.log('剩料率表数据', this.tab.chart2.table.list)
  844. } else {
  845. this.tab.chart2.list = []
  846. this.tab.chart2.chartLine_data = {}
  847. }
  848. this.roadChartLine2(this.tab.chart2.chartLine_data)
  849. setTimeout(() => {
  850. this.tab.chart2.listLoading = false
  851. }, 100)
  852. })
  853. },
  854. roadChartLine2(chartLine_data) {
  855. if (this.tab.chart2.chartLine != null) {
  856. this.tab.chart2.chartLine.dispose()
  857. }
  858. this.tab.chart2.chartLine = echarts.init(document.getElementById('chartLine2'))
  859. var option = {
  860. title: {
  861. text: ''
  862. },
  863. tooltip: {
  864. trigger: 'axis'
  865. },
  866. legend: {
  867. data: chartLine_data.data1,
  868. right: 10
  869. },
  870. grid: {
  871. top: '20%',
  872. left: '3%',
  873. right: '8%',
  874. containLabel: true
  875. },
  876. toolbox: {
  877. show: true,
  878. right: '2%',
  879. feature: {}
  880. },
  881. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  882. yAxis: {
  883. type: 'value', name: '剩料率', axisLabel: { formatter: '{value} %' }
  884. },
  885. series: (function() {
  886. if (chartLine_data.data3 !== undefined) {
  887. var serie = []
  888. for (var i = 0; i < chartLine_data.data3.length; i++) {
  889. var item = {
  890. name: chartLine_data.data1[i],
  891. type: 'line',
  892. data: chartLine_data.data3[i].data
  893. }
  894. serie.push(item)
  895. }
  896. return serie
  897. }
  898. }())
  899. }
  900. this.tab.chart2.chartLine.setOption(option)
  901. window.onresize = function() {
  902. this.tab.chart2.chartLine.resize()
  903. }
  904. },
  905. // 混料时间统计
  906. getChart3() {
  907. this.tab.chart3.listLoading = true
  908. GetReportform(this.tab.chart3.getdataListParm).then(response => {
  909. if (response.data !== null && response.data.list !== null) {
  910. console.log('混料时间统计图表数据', response.data.list)
  911. this.tab.chart3.table.list = response.data.data
  912. this.tab.chart3.chartLine_data = response.data.list
  913. // this.tab.chart3.chartLine_data = {
  914. // data1: ['1牧', '2牧', '3牧'], // 折线
  915. // data2: ['12/01', '12/02', '12/03'], // X轴
  916. // data3: [
  917. // { data: [1.5, 1.2, 1.7, 1.2] },
  918. // { data: [1.7, 0.8, 1.2, 1.8] },
  919. // { data: [1.3, 2.2, 1.9, 1.4] }
  920. // ]// 折线对应数据
  921. // }
  922. this.tab.chart3.total = response.data.total
  923. } else {
  924. this.tab.chart3.list = []
  925. this.tab.chart3.chartLine_data = {}
  926. }
  927. this.roadChartLine3(this.tab.chart3.chartLine_data)
  928. setTimeout(() => {
  929. this.tab.chart3.listLoading = false
  930. }, 100)
  931. })
  932. },
  933. roadChartLine3(chartLine_data) {
  934. if (this.tab.chart3.chartLine != null) {
  935. this.tab.chart3.chartLine.dispose()
  936. }
  937. this.tab.chart3.chartLine = echarts.init(document.getElementById('chartLine3'))
  938. var option = {
  939. title: {
  940. text: ''
  941. },
  942. tooltip: {
  943. trigger: 'axis'
  944. },
  945. legend: {
  946. data: chartLine_data.data1,
  947. right: 10
  948. },
  949. grid: {
  950. top: '20%',
  951. left: '3%',
  952. right: '8%',
  953. containLabel: true
  954. },
  955. toolbox: {
  956. show: true,
  957. right: '2%',
  958. feature: {}
  959. },
  960. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  961. yAxis: {
  962. type: 'value', name: '分钟', axisLabel: { formatter: '{value}min' }
  963. },
  964. series: (function() {
  965. if (chartLine_data.data3 !== undefined) {
  966. var serie = []
  967. for (var i = 0; i < chartLine_data.data3.length; i++) {
  968. var item = {
  969. name: chartLine_data.data1[i],
  970. type: 'line',
  971. data: chartLine_data.data3[i].data
  972. }
  973. serie.push(item)
  974. }
  975. return serie
  976. }
  977. }())
  978. }
  979. this.tab.chart3.chartLine.setOption(option)
  980. window.onresize = function() {
  981. this.tab.chart3.chartLine.resize()
  982. }
  983. },
  984. // 转化率
  985. getChart4() {
  986. this.tab.chart4.listLoading = true
  987. GetReportform(this.tab.chart4.getdataListParm).then(response => {
  988. if (response.data !== null && response.data.list !== null) {
  989. console.log('转化率图表数据', response.data.list)
  990. this.tab.chart4.table.list = response.data.data
  991. this.tab.chart4.chartLine_data = response.data.list
  992. this.tab.chart4.total = response.data.total
  993. console.log('转化率图数据', this.tab.chart4.chartLine_data)
  994. console.log('转化率表数据', this.tab.chart4.table.list)
  995. } else {
  996. this.tab.chart4.list = []
  997. this.tab.chart4.chartLine_data = {}
  998. }
  999. this.roadChartLine4(this.tab.chart4.chartLine_data)
  1000. setTimeout(() => {
  1001. this.tab.chart4.listLoading = false
  1002. }, 100)
  1003. })
  1004. },
  1005. roadChartLine4(chartLine_data) {
  1006. if (this.tab.chart4.chartLine != null) {
  1007. this.tab.chart4.chartLine.dispose()
  1008. }
  1009. this.tab.chart4.chartLine = echarts.init(document.getElementById('chartLine4'))
  1010. var option = {
  1011. title: {
  1012. text: ''
  1013. },
  1014. tooltip: {
  1015. trigger: 'axis'
  1016. },
  1017. legend: {
  1018. data: chartLine_data.data1,
  1019. right: 10
  1020. },
  1021. grid: {
  1022. top: '20%',
  1023. left: '3%',
  1024. right: '8%',
  1025. containLabel: true
  1026. },
  1027. toolbox: {
  1028. show: true,
  1029. right: '2%',
  1030. feature: {}
  1031. },
  1032. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  1033. yAxis: {
  1034. type: 'value', name: '饲料转化率', axisLabel: { formatter: '{value} %' }
  1035. },
  1036. series: (function() {
  1037. if (chartLine_data.data3 !== undefined) {
  1038. var serie = []
  1039. for (var i = 0; i < chartLine_data.data3.length; i++) {
  1040. var item = {
  1041. name: chartLine_data.data1[i],
  1042. type: 'line',
  1043. data: chartLine_data.data3[i].data
  1044. }
  1045. serie.push(item)
  1046. }
  1047. return serie
  1048. }
  1049. }())
  1050. }
  1051. this.tab.chart4.chartLine.setOption(option)
  1052. window.onresize = function() {
  1053. this.tab.chart4.chartLine.resize()
  1054. }
  1055. },
  1056. // 成本分析
  1057. getChart5() {
  1058. this.tab.chart5.listLoading = true
  1059. GetReportform(this.tab.chart5.getdataListParm).then(response => {
  1060. if (response.data !== null && response.data.list !== null) {
  1061. console.log('转化率图表数据', response.data.list)
  1062. this.tab.chart5.table.list = response.data.data
  1063. this.tab.chart5.chartLine_data = response.data.list
  1064. this.tab.chart5.total = response.data.total
  1065. console.log('转化率图数据', this.tab.chart5.chartLine_data)
  1066. console.log('转化率表数据', this.tab.chart5.table.list)
  1067. } else {
  1068. this.tab.chart5.list = []
  1069. this.tab.chart5.chartLine_data = {}
  1070. }
  1071. this.roadChartLine5(this.tab.chart5.chartLine_data)
  1072. setTimeout(() => {
  1073. this.tab.chart5.listLoading = false
  1074. }, 100)
  1075. })
  1076. },
  1077. roadChartLine5(chartLine_data) {
  1078. if (this.tab.chart5.chartLine != null) {
  1079. this.tab.chart5.chartLine.dispose()
  1080. }
  1081. this.tab.chart5.chartLine = echarts.init(document.getElementById('chartLine5'))
  1082. var option = {
  1083. title: {
  1084. text: ''
  1085. },
  1086. tooltip: {
  1087. trigger: 'axis'
  1088. },
  1089. legend: {
  1090. data: chartLine_data.data1,
  1091. right: 10
  1092. },
  1093. grid: {
  1094. top: '20%',
  1095. left: '5%',
  1096. right: '8%',
  1097. containLabel: true
  1098. },
  1099. toolbox: {
  1100. show: true,
  1101. right: '2%',
  1102. feature: {}
  1103. },
  1104. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  1105. yAxis: {
  1106. type: 'value', name: '公斤奶饲料成本(元)'
  1107. },
  1108. series: (function() {
  1109. if (chartLine_data.data3 !== undefined) {
  1110. var serie = []
  1111. for (var i = 0; i < chartLine_data.data3.length; i++) {
  1112. var item = {
  1113. name: chartLine_data.data1[i],
  1114. type: 'line',
  1115. data: chartLine_data.data3[i].data
  1116. }
  1117. serie.push(item)
  1118. }
  1119. return serie
  1120. }
  1121. }())
  1122. }
  1123. this.tab.chart5.chartLine.setOption(option)
  1124. window.onresize = function() {
  1125. this.tab.chart5.chartLine.resize()
  1126. }
  1127. },
  1128. // 时间
  1129. changeChartDate(item) {
  1130. console.log(item)
  1131. if (item == 'chart1') {
  1132. if (this.tab.chart1.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart1.getdataListParm.parammaps.inputDatetime !== null) {
  1133. this.tab.chart1.getdataListParm.parammaps.startTime = parseTime(this.tab.chart1.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1134. this.tab.chart1.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart1.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1135. this.getChart1()
  1136. } else {
  1137. this.tab.chart1.getdataListParm.parammaps.inputDatetime = ''
  1138. this.tab.chart1.getdataListParm.parammaps.startTime = ''
  1139. this.tab.chart1.getdataListParm.parammaps.stopTime = ''
  1140. this.getChart1()
  1141. }
  1142. } else if (item == 'chart2') {
  1143. if (this.tab.chart2.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart2.getdataListParm.parammaps.inputDatetime !== null) {
  1144. this.tab.chart2.getdataListParm.parammaps.startTime = parseTime(this.tab.chart2.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1145. this.tab.chart2.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart2.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1146. this.getChart2()
  1147. } else {
  1148. this.tab.chart2.getdataListParm.parammaps.inputDatetime = ''
  1149. this.tab.chart2.getdataListParm.parammaps.startTime = ''
  1150. this.tab.chart2.getdataListParm.parammaps.stopTime = ''
  1151. this.getChart2()
  1152. }
  1153. } else if (item == 'chart3') {
  1154. if (this.tab.chart3.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart3.getdataListParm.parammaps.inputDatetime !== null) {
  1155. this.tab.chart3.getdataListParm.parammaps.startTime = parseTime(this.tab.chart3.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1156. this.tab.chart3.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart3.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1157. this.getChart3()
  1158. } else {
  1159. this.tab.chart3.getdataListParm.parammaps.inputDatetime = ''
  1160. this.tab.chart3.getdataListParm.parammaps.startTime = ''
  1161. this.tab.chart3.getdataListParm.parammaps.stopTime = ''
  1162. this.getChart3()
  1163. }
  1164. } else if (item == 'chart4') {
  1165. if (this.tab.chart4.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart4.getdataListParm.parammaps.inputDatetime !== null) {
  1166. this.tab.chart4.getdataListParm.parammaps.startTime = parseTime(this.tab.chart4.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1167. this.tab.chart4.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart4.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1168. this.getChart4()
  1169. } else {
  1170. this.tab.chart4.getdataListParm.parammaps.inputDatetime = ''
  1171. this.tab.chart4.getdataListParm.parammaps.startTime = ''
  1172. this.tab.chart4.getdataListParm.parammaps.stopTime = ''
  1173. this.getChart4()
  1174. }
  1175. } else if (item == 'chart5') {
  1176. console.log(this.tab.chart5.getdataListParm.parammaps.inputDatetime, 'inputDatetime')
  1177. if (this.tab.chart5.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart5.getdataListParm.parammaps.inputDatetime !== null) {
  1178. this.tab.chart5.getdataListParm.parammaps.startTime = parseTime(this.tab.chart5.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1179. this.tab.chart5.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart5.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1180. this.getChart5()
  1181. } else {
  1182. this.tab.chart5.getdataListParm.parammaps.inputDatetime = ''
  1183. this.tab.chart5.getdataListParm.parammaps.startTime = ''
  1184. this.tab.chart5.getdataListParm.parammaps.stopTime = ''
  1185. this.getChart5()
  1186. }
  1187. }
  1188. },
  1189. // 导出
  1190. handleExport(item) {
  1191. if (item == 'chart1') {
  1192. console.log('泌乳牛采食量导出')
  1193. var excelDatasTabChart1 = [
  1194. {
  1195. tHeader: ['日期', '泌乳牛采食量', '泌乳牛产奶量'],
  1196. filterVal: ['日期', 'field1', 'field2'],
  1197. tableDatas: this.tab.chart1.table.list,
  1198. sheetName: '泌乳牛采食量'
  1199. }
  1200. ]
  1201. json2excel(excelDatasTabChart1, '泌乳牛采食量', true, 'xlsx')
  1202. } else if (item == 'chart2') {
  1203. console.log('剩料率导出')
  1204. var excelDatasTabChart2 = [
  1205. {
  1206. tHeader: ['日期', '栏舍名称', '剩料量', '撒料量', '剩料率'],
  1207. filterVal: ['日期', '名称', '剩料量', '撒料量', '准确率'],
  1208. tableDatas: this.tab.chart2.table.list,
  1209. sheetName: '牛栏剩料率'
  1210. }
  1211. ]
  1212. json2excel(excelDatasTabChart2, '牛栏剩料率', true, 'xlsx')
  1213. } else if (item == 'chart3') {
  1214. console.log('混料时间统计导出')
  1215. var excelDatasTabChart3 = [
  1216. {
  1217. tHeader: ['日期', '混料时间(分钟)'],
  1218. filterVal: ['日期', 'field1'],
  1219. tableDatas: this.tab.chart3.table.list,
  1220. sheetName: '混料时间统计'
  1221. }
  1222. ]
  1223. json2excel(excelDatasTabChart3, '混料时间统计', true, 'xlsx')
  1224. } else if (item == 'chart4') {
  1225. console.log('转化率导出')
  1226. var excelDatasTabChart4 = [
  1227. {
  1228. tHeader: ['日期', '配方名称', '饲料转化率'],
  1229. filterVal: ['日期', '名称', '准确率'],
  1230. tableDatas: this.tab.chart4.table.list,
  1231. sheetName: '转化率统计'
  1232. }
  1233. ]
  1234. json2excel(excelDatasTabChart4, '转化率', true, 'xlsx')
  1235. } else if (item == 'chart5') {
  1236. console.log('成本分析导出')
  1237. var excelDatasTabChart5 = [
  1238. {
  1239. tHeader: ['日期', '牲畜类别', '公斤奶饲料成本(元)'],
  1240. filterVal: ['日期', '名称', '准确率'],
  1241. tableDatas: this.tab.chart5.table.list,
  1242. sheetName: '成本分析'
  1243. }
  1244. ]
  1245. json2excel(excelDatasTabChart5, '成本分析', true, 'xlsx')
  1246. }
  1247. },
  1248. // 切换表格
  1249. handleTable(item) {
  1250. // 显示切换表格
  1251. if (item == 'chart1') {
  1252. console.log('泌乳牛采食量表格')
  1253. this.tab.chart1.isTable = true
  1254. this.tab.chart1.isChart = false
  1255. } else if (item == 'chart2') {
  1256. console.log('牛栏剩料率表格')
  1257. this.tab.chart2.isTable = true
  1258. this.tab.chart2.isChart = false
  1259. } else if (item == 'chart3') {
  1260. console.log('混料时间统计表格')
  1261. this.tab.chart3.isTable = true
  1262. this.tab.chart3.isChart = false
  1263. } else if (item == 'chart4') {
  1264. console.log('转化率表格')
  1265. this.tab.chart4.isTable = true
  1266. this.tab.chart4.isChart = false
  1267. } else if (item == 'chart5') {
  1268. console.log('成本分析表格')
  1269. this.tab.chart5.isTable = true
  1270. this.tab.chart5.isChart = false
  1271. }
  1272. },
  1273. // 切换图表
  1274. handleChart(item) {
  1275. // 显示切换图表
  1276. if (item == 'chart1') {
  1277. console.log('泌乳牛采食量图表')
  1278. this.tab.chart1.isTable = false
  1279. this.tab.chart1.isChart = true
  1280. this.getChart1()
  1281. } else if (item == 'chart2') {
  1282. console.log('牛栏剩料率图表')
  1283. this.tab.chart2.isTable = false
  1284. this.tab.chart2.isChart = true
  1285. this.getChart2()
  1286. } else if (item == 'chart3') {
  1287. console.log('混料时间统计图表')
  1288. this.tab.chart3.isTable = false
  1289. this.tab.chart3.isChart = true
  1290. this.getChart3()
  1291. } else if (item == 'chart4') {
  1292. console.log('转化率图表')
  1293. this.tab.chart4.isTable = false
  1294. this.tab.chart4.isChart = true
  1295. this.getChart4()
  1296. } else if (item == 'chart5') {
  1297. console.log('成本分析图表')
  1298. this.tab.chart5.isTable = false
  1299. this.tab.chart5.isChart = true
  1300. this.getChart5()
  1301. }
  1302. }
  1303. }
  1304. }
  1305. </script>
  1306. <style lang="scss" scoped>
  1307. .button{
  1308. height: 50px;
  1309. .exportTable{float: right;margin-right: 5px;}
  1310. }
  1311. .app-container1{padding-left: 10px;background-color: #F4F4F4;}
  1312. .dashboard-editor-container {
  1313. background-color: #F4F4F4;
  1314. .grid-content{
  1315. background-color:#fff;padding: 0 10px;
  1316. h4{text-align: center;line-height: 50px;}
  1317. }
  1318. }
  1319. // .table{margin-bottom: 50px;}
  1320. </style>