e8f64ca3abb7b22b7748ef222c89ef6fa8853360.svn-base 57 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346
  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. const end = '2021-07-07'
  568. const start = '2021-07-01'
  569. const start2 = '2021-07-07'
  570. that.tab.table.getdataListParm.parammaps.date = parseTime(start2, '{y}-{m}-{d}')
  571. // start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
  572. that.tab.chartDate[0] = parseTime(start, '{y}-{m}-{d}')
  573. that.tab.chartDate[1] = parseTime(end, '{y}-{m}-{d}')
  574. that.tab.chart1.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  575. that.tab.chart1.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  576. that.tab.chart1.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  577. that.tab.chart1.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  578. that.tab.chart2.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  579. that.tab.chart2.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  580. that.tab.chart2.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  581. that.tab.chart2.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  582. that.tab.chart3.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  583. that.tab.chart3.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  584. that.tab.chart3.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  585. that.tab.chart3.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  586. that.tab.chart4.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  587. that.tab.chart4.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  588. that.tab.chart4.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  589. that.tab.chart4.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  590. that.tab.chart5.getdataListParm.parammaps.inputDatetime[0] = parseTime(start, '{y}-{m}-{d}')
  591. that.tab.chart5.getdataListParm.parammaps.inputDatetime[1] = parseTime(end, '{y}-{m}-{d}')
  592. that.tab.chart5.getdataListParm.parammaps.startTime = parseTime(start, '{y}-{m}-{d}')
  593. that.tab.chart5.getdataListParm.parammaps.stopTime = parseTime(end, '{y}-{m}-{d}')
  594. },
  595. // 导出
  596. handleDownload() {},
  597. // 效率统计
  598. getList() {
  599. this.tab.table.listLoading = true
  600. this.tab.table.getdataListParm.parammaps.date = parseTime(this.tab.table.getdataListParm.parammaps.date, '{y}-{m}-{d}')
  601. GetDataByName(this.tab.table.getdataListParm).then(response => {
  602. console.log('汇总统计/混料table数据', response.data.list)
  603. if (response.data.list !== null) {
  604. this.tab.table.list = response.data.list
  605. this.tab.table.total = response.data.total
  606. } else {
  607. this.tab.table.list = []
  608. }
  609. setTimeout(() => {
  610. this.tab.table.listLoading = false
  611. }, 100)
  612. })
  613. },
  614. // 查询
  615. handleSearch() {
  616. this.getList()
  617. },
  618. handleBefore() {
  619. if (this.tab.table.getdataListParm.parammaps.date !== '' && this.tab.table.getdataListParm.parammaps.date !== null) {
  620. this.tab.table.getdataListParm.parammaps.date = new Date(this.tab.table.getdataListParm.parammaps.date)
  621. var start = new Date(this.tab.table.getdataListParm.parammaps.date.setDate(this.tab.table.getdataListParm.parammaps.date.getDate() - 1))
  622. this.tab.table.getdataListParm.parammaps.date = parseTime(start, '{y}-{m}-{d}')
  623. this.getList()
  624. }
  625. },
  626. handleNext() {
  627. if (this.tab.table.getdataListParm.parammaps.date !== '' && this.tab.table.getdataListParm.parammaps.date !== null) {
  628. this.tab.table.getdataListParm.parammaps.date = new Date(this.tab.table.getdataListParm.parammaps.date)
  629. var stop = new Date(this.tab.table.getdataListParm.parammaps.date.setDate(this.tab.table.getdataListParm.parammaps.date.getDate() + 1))
  630. this.tab.table.getdataListParm.parammaps.date = parseTime(stop, '{y}-{m}-{d}')
  631. this.getList()
  632. }
  633. },
  634. tableCellStyle({ row, column, rowIndex, columnIndex }) {
  635. if (columnIndex === 0 && row.pastureid !== '-1') {
  636. return {
  637. textDecoration: 'underline'
  638. }
  639. }
  640. return {
  641. textDecoration: 'none'
  642. }
  643. },
  644. clickPasture(row) {
  645. if (row.pastureid !== '-1') {
  646. this.pasture.dialogStatus = 'pasture'
  647. this.pasture.dialogFormVisible = true
  648. this.pasture.table.getdataListParm.parammaps.pastureid = row.pastureid
  649. this.getTabList()
  650. }
  651. },
  652. // 效率统计
  653. getTabList() {
  654. this.pasture.table.listLoading = true
  655. this.pasture.table.getdataListParm.parammaps.date = this.tab.table.getdataListParm.parammaps.date
  656. GetDataByName(this.pasture.table.getdataListParm).then(response => {
  657. console.log('汇总统计/混料table数据', response.data.list)
  658. if (response.data.list !== null) {
  659. this.pasture.table.list = response.data.list
  660. this.pasture.table.total = response.data.total
  661. } else {
  662. this.pasture.table.list = []
  663. }
  664. setTimeout(() => {
  665. this.pasture.table.listLoading = false
  666. }, 100)
  667. })
  668. },
  669. // 切换统计类型
  670. changeRadio() {
  671. console.log(this.pasture.radio)
  672. if (this.pasture.radio == '1') {
  673. console.log('配方名称')
  674. this.pasture.isFormulaName = true
  675. this.pasture.isHouseName = false
  676. this.pasture.isLivestockType = false
  677. this.pasture.table.getdataListParm.parammaps.ftname = ''
  678. this.pasture.table.getdataListParm.parammaps.barname = ''
  679. this.pasture.table.getdataListParm.parammaps.ftname = ''
  680. this.pasture.table.getdataListParm.parammaps.cowclass = ''
  681. this.pasture.table.getdataListParm.name = 'getFeedEfficiencyFT'
  682. this.getTabList()
  683. } else if (this.pasture.radio == '2') {
  684. console.log('栏舍名称')
  685. this.pasture.isFormulaName = false
  686. this.pasture.isHouseName = true
  687. this.pasture.isLivestockType = false
  688. this.pasture.table.getdataListParm.parammaps.ftname = ''
  689. this.pasture.table.getdataListParm.parammaps.barname = ''
  690. this.pasture.table.getdataListParm.parammaps.ftname = ''
  691. this.pasture.table.getdataListParm.parammaps.cowclass = ''
  692. this.pasture.table.getdataListParm.name = 'getFeedEfficiencyLS'
  693. this.getTabList()
  694. } else if (this.pasture.radio == '3') {
  695. console.log(' 牲畜类别')
  696. this.pasture.isFormulaName = false
  697. this.pasture.isHouseName = false
  698. this.pasture.isLivestockType = true
  699. this.pasture.table.getdataListParm.parammaps.ftname = ''
  700. this.pasture.table.getdataListParm.parammaps.barname = ''
  701. this.pasture.table.getdataListParm.parammaps.ftname = ''
  702. this.pasture.table.getdataListParm.parammaps.cowclass = ''
  703. this.pasture.table.getdataListParm.name = 'getFeedEfficiencySC'
  704. this.getTabList()
  705. }
  706. },
  707. handlePastureSearch() {},
  708. // 快速跳转到图表
  709. handleQuickJumpChart() {
  710. var myHeight = document.getElementById('table').offsetHeight + 120
  711. window.scrollTo(myHeight, myHeight)
  712. },
  713. // 快速回到顶部
  714. handleQuickJumpTop() {
  715. window.scrollTo(0, 0)
  716. },
  717. // 图表总查询
  718. handleChartDate() {
  719. console.log('点击了确认时间')
  720. MessageBox.confirm('是否调整以下所有图表查询时间?', {
  721. confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning'
  722. }).then(() => {
  723. var that = this
  724. var startTime = parseTime(this.tab.chartDate[0], '{y}-{m}-{d}')
  725. var stopTime = parseTime(this.tab.chartDate[1], '{y}-{m}-{d}')
  726. that.tab.chart1.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  727. that.tab.chart1.getdataListParm.parammaps.startTime = startTime
  728. that.tab.chart1.getdataListParm.parammaps.stopTime = stopTime
  729. that.getChart1()
  730. that.tab.chart2.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  731. that.tab.chart2.getdataListParm.parammaps.startTime = startTime
  732. that.tab.chart2.getdataListParm.parammaps.stopTime = stopTime
  733. that.getChart2()
  734. that.tab.chart3.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  735. that.tab.chart3.getdataListParm.parammaps.startTime = startTime
  736. that.tab.chart3.getdataListParm.parammaps.stopTime = stopTime
  737. that.getChart3()
  738. that.tab.chart4.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  739. that.tab.chart4.getdataListParm.parammaps.startTime = startTime
  740. that.tab.chart4.getdataListParm.parammaps.stopTime = stopTime
  741. that.getChart4()
  742. that.tab.chart5.getdataListParm.parammaps.inputDatetime = this.tab.chartDate
  743. that.tab.chart5.getdataListParm.parammaps.startTime = startTime
  744. that.tab.chart5.getdataListParm.parammaps.stopTime = stopTime
  745. that.getChart5()
  746. })
  747. },
  748. // 泌乳牛干物质采食量
  749. getChart1() {
  750. this.tab.chart1.listLoading = true
  751. GetReportform(this.tab.chart1.getdataListParm).then(response => {
  752. if (response.data !== null && response.data.list !== null) {
  753. console.log('泌乳牛干物质采食量图表数据', response.data.list)
  754. this.tab.chart1.table.list = response.data.data
  755. this.tab.chart1.chartLine_data = response.data.list
  756. // this.tab.chart1.chartLine_data = {
  757. // data1: ['1牧', '2牧', '3牧'], // 折线
  758. // data2: ['12/01', '12/02', '12/03'], // X轴
  759. // data3: [
  760. // { data: [1.5, 1.2, 1.7, 1.2] },
  761. // { data: [1.7, 0.8, 1.2, 1.8] },
  762. // { data: [1.3, 2.2, 1.9, 1.4] }
  763. // ]// 折线对应数据
  764. // }
  765. // this.tab.chart1.total = response.data.total
  766. } else {
  767. this.tab.chart1.list = []
  768. this.tab.chart1.chartLine_data = {}
  769. }
  770. this.roadChartLine1(this.tab.chart1.chartLine_data)
  771. setTimeout(() => {
  772. this.tab.chart1.listLoading = false
  773. }, 100)
  774. })
  775. },
  776. roadChartLine1(chartLine_data) {
  777. if (this.tab.chart1.chartLine != null) {
  778. this.tab.chart1.chartLine.dispose()
  779. }
  780. this.tab.chart1.chartLine = echarts.init(document.getElementById('chartLine1'))
  781. var option = {
  782. title: {
  783. text: ''
  784. },
  785. tooltip: {
  786. trigger: 'axis'
  787. },
  788. legend: {
  789. data: chartLine_data.data1,
  790. right: 10
  791. },
  792. grid: {
  793. top: '20%',
  794. left: '3%',
  795. right: '8%',
  796. containLabel: true
  797. },
  798. toolbox: {
  799. show: true,
  800. right: '2%',
  801. feature: {}
  802. },
  803. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  804. yAxis: {
  805. type: 'value', name: 'kg', axisLabel: { formatter: '{value}' }
  806. },
  807. series: (function() {
  808. if (chartLine_data.data3 !== undefined) {
  809. var serie = []
  810. for (var i = 0; i < chartLine_data.data3.length; i++) {
  811. var item = {
  812. name: chartLine_data.data1[i],
  813. type: 'line',
  814. data: chartLine_data.data3[i].data
  815. }
  816. serie.push(item)
  817. }
  818. return serie
  819. }
  820. }())
  821. }
  822. this.tab.chart1.chartLine.setOption(option)
  823. window.onresize = function() {
  824. this.tab.chart1.chartLine.resize()
  825. }
  826. },
  827. // 剩料率
  828. getChart2() {
  829. this.tab.chart2.listLoading = true
  830. GetReportform(this.tab.chart2.getdataListParm).then(response => {
  831. if (response.data !== null && response.data.list !== null) {
  832. console.log('剩料率图表数据', response.data.list)
  833. this.tab.chart2.table.list = response.data.data
  834. this.tab.chart2.chartLine_data = response.data.list
  835. // this.tab.chart2.chartLine_data = {
  836. // data1: ['1牧', '2牧', '3牧'], // 折线
  837. // data2: ['12/01', '12/02', '12/03'], // X轴
  838. // data3: [
  839. // { data: [1.5, 1.2, 1.7, 1.2] },
  840. // { data: [1.7, 0.8, 1.2, 1.8] },
  841. // { data: [1.3, 2.2, 1.9, 1.4] }
  842. // ]// 折线对应数据
  843. // }
  844. this.tab.chart2.total = response.data.total
  845. console.log('剩料率图数据', this.tab.chart2.chartLine_data)
  846. console.log('剩料率表数据', this.tab.chart2.table.list)
  847. } else {
  848. this.tab.chart2.list = []
  849. this.tab.chart2.chartLine_data = {}
  850. }
  851. this.roadChartLine2(this.tab.chart2.chartLine_data)
  852. setTimeout(() => {
  853. this.tab.chart2.listLoading = false
  854. }, 100)
  855. })
  856. },
  857. roadChartLine2(chartLine_data) {
  858. if (this.tab.chart2.chartLine != null) {
  859. this.tab.chart2.chartLine.dispose()
  860. }
  861. this.tab.chart2.chartLine = echarts.init(document.getElementById('chartLine2'))
  862. var option = {
  863. title: {
  864. text: ''
  865. },
  866. tooltip: {
  867. trigger: 'axis'
  868. },
  869. legend: {
  870. data: chartLine_data.data1,
  871. right: 10
  872. },
  873. grid: {
  874. top: '20%',
  875. left: '3%',
  876. right: '8%',
  877. containLabel: true
  878. },
  879. toolbox: {
  880. show: true,
  881. right: '2%',
  882. feature: {}
  883. },
  884. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  885. yAxis: {
  886. type: 'value', name: '剩料率', axisLabel: { formatter: '{value} %' }
  887. },
  888. series: (function() {
  889. if (chartLine_data.data3 !== undefined) {
  890. var serie = []
  891. for (var i = 0; i < chartLine_data.data3.length; i++) {
  892. var item = {
  893. name: chartLine_data.data1[i],
  894. type: 'line',
  895. data: chartLine_data.data3[i].data
  896. }
  897. serie.push(item)
  898. }
  899. return serie
  900. }
  901. }())
  902. }
  903. this.tab.chart2.chartLine.setOption(option)
  904. window.onresize = function() {
  905. this.tab.chart2.chartLine.resize()
  906. }
  907. },
  908. // 混料时间统计
  909. getChart3() {
  910. this.tab.chart3.listLoading = true
  911. GetReportform(this.tab.chart3.getdataListParm).then(response => {
  912. if (response.data !== null && response.data.list !== null) {
  913. console.log('混料时间统计图表数据', response.data.list)
  914. this.tab.chart3.table.list = response.data.data
  915. this.tab.chart3.chartLine_data = response.data.list
  916. // this.tab.chart3.chartLine_data = {
  917. // data1: ['1牧', '2牧', '3牧'], // 折线
  918. // data2: ['12/01', '12/02', '12/03'], // X轴
  919. // data3: [
  920. // { data: [1.5, 1.2, 1.7, 1.2] },
  921. // { data: [1.7, 0.8, 1.2, 1.8] },
  922. // { data: [1.3, 2.2, 1.9, 1.4] }
  923. // ]// 折线对应数据
  924. // }
  925. this.tab.chart3.total = response.data.total
  926. } else {
  927. this.tab.chart3.list = []
  928. this.tab.chart3.chartLine_data = {}
  929. }
  930. this.roadChartLine3(this.tab.chart3.chartLine_data)
  931. setTimeout(() => {
  932. this.tab.chart3.listLoading = false
  933. }, 100)
  934. })
  935. },
  936. roadChartLine3(chartLine_data) {
  937. if (this.tab.chart3.chartLine != null) {
  938. this.tab.chart3.chartLine.dispose()
  939. }
  940. this.tab.chart3.chartLine = echarts.init(document.getElementById('chartLine3'))
  941. var option = {
  942. title: {
  943. text: ''
  944. },
  945. tooltip: {
  946. trigger: 'axis'
  947. },
  948. legend: {
  949. data: chartLine_data.data1,
  950. right: 10
  951. },
  952. grid: {
  953. top: '20%',
  954. left: '3%',
  955. right: '8%',
  956. containLabel: true
  957. },
  958. toolbox: {
  959. show: true,
  960. right: '2%',
  961. feature: {}
  962. },
  963. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  964. yAxis: {
  965. type: 'value', name: '分钟', axisLabel: { formatter: '{value}min' }
  966. },
  967. series: (function() {
  968. if (chartLine_data.data3 !== undefined) {
  969. var serie = []
  970. for (var i = 0; i < chartLine_data.data3.length; i++) {
  971. var item = {
  972. name: chartLine_data.data1[i],
  973. type: 'line',
  974. data: chartLine_data.data3[i].data
  975. }
  976. serie.push(item)
  977. }
  978. return serie
  979. }
  980. }())
  981. }
  982. this.tab.chart3.chartLine.setOption(option)
  983. window.onresize = function() {
  984. this.tab.chart3.chartLine.resize()
  985. }
  986. },
  987. // 转化率
  988. getChart4() {
  989. this.tab.chart4.listLoading = true
  990. GetReportform(this.tab.chart4.getdataListParm).then(response => {
  991. if (response.data !== null && response.data.list !== null) {
  992. console.log('转化率图表数据', response.data.list)
  993. this.tab.chart4.table.list = response.data.data
  994. this.tab.chart4.chartLine_data = response.data.list
  995. this.tab.chart4.total = response.data.total
  996. console.log('转化率图数据', this.tab.chart4.chartLine_data)
  997. console.log('转化率表数据', this.tab.chart4.table.list)
  998. } else {
  999. this.tab.chart4.list = []
  1000. this.tab.chart4.chartLine_data = {}
  1001. }
  1002. this.roadChartLine4(this.tab.chart4.chartLine_data)
  1003. setTimeout(() => {
  1004. this.tab.chart4.listLoading = false
  1005. }, 100)
  1006. })
  1007. },
  1008. roadChartLine4(chartLine_data) {
  1009. if (this.tab.chart4.chartLine != null) {
  1010. this.tab.chart4.chartLine.dispose()
  1011. }
  1012. this.tab.chart4.chartLine = echarts.init(document.getElementById('chartLine4'))
  1013. var option = {
  1014. title: {
  1015. text: ''
  1016. },
  1017. tooltip: {
  1018. trigger: 'axis'
  1019. },
  1020. legend: {
  1021. data: chartLine_data.data1,
  1022. right: 10
  1023. },
  1024. grid: {
  1025. top: '20%',
  1026. left: '3%',
  1027. right: '8%',
  1028. containLabel: true
  1029. },
  1030. toolbox: {
  1031. show: true,
  1032. right: '2%',
  1033. feature: {}
  1034. },
  1035. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  1036. yAxis: {
  1037. type: 'value', name: '饲料转化率', axisLabel: { formatter: '{value} %' }
  1038. },
  1039. series: (function() {
  1040. if (chartLine_data.data3 !== undefined) {
  1041. var serie = []
  1042. for (var i = 0; i < chartLine_data.data3.length; i++) {
  1043. var item = {
  1044. name: chartLine_data.data1[i],
  1045. type: 'line',
  1046. data: chartLine_data.data3[i].data
  1047. }
  1048. serie.push(item)
  1049. }
  1050. return serie
  1051. }
  1052. }())
  1053. }
  1054. this.tab.chart4.chartLine.setOption(option)
  1055. window.onresize = function() {
  1056. this.tab.chart4.chartLine.resize()
  1057. }
  1058. },
  1059. // 成本分析
  1060. getChart5() {
  1061. this.tab.chart5.listLoading = true
  1062. GetReportform(this.tab.chart5.getdataListParm).then(response => {
  1063. if (response.data !== null && response.data.list !== null) {
  1064. console.log('转化率图表数据', response.data.list)
  1065. this.tab.chart5.table.list = response.data.data
  1066. this.tab.chart5.chartLine_data = response.data.list
  1067. this.tab.chart5.total = response.data.total
  1068. console.log('转化率图数据', this.tab.chart5.chartLine_data)
  1069. console.log('转化率表数据', this.tab.chart5.table.list)
  1070. } else {
  1071. this.tab.chart5.list = []
  1072. this.tab.chart5.chartLine_data = {}
  1073. }
  1074. this.roadChartLine5(this.tab.chart5.chartLine_data)
  1075. setTimeout(() => {
  1076. this.tab.chart5.listLoading = false
  1077. }, 100)
  1078. })
  1079. },
  1080. roadChartLine5(chartLine_data) {
  1081. if (this.tab.chart5.chartLine != null) {
  1082. this.tab.chart5.chartLine.dispose()
  1083. }
  1084. this.tab.chart5.chartLine = echarts.init(document.getElementById('chartLine5'))
  1085. var option = {
  1086. title: {
  1087. text: ''
  1088. },
  1089. tooltip: {
  1090. trigger: 'axis'
  1091. },
  1092. legend: {
  1093. data: chartLine_data.data1,
  1094. right: 10
  1095. },
  1096. grid: {
  1097. top: '20%',
  1098. left: '5%',
  1099. right: '8%',
  1100. containLabel: true
  1101. },
  1102. toolbox: {
  1103. show: true,
  1104. right: '2%',
  1105. feature: {}
  1106. },
  1107. xAxis: { type: 'category', boundaryGap: false, data: chartLine_data.data2, name: '日期' },
  1108. yAxis: {
  1109. type: 'value', name: '公斤奶饲料成本(元)'
  1110. },
  1111. series: (function() {
  1112. if (chartLine_data.data3 !== undefined) {
  1113. var serie = []
  1114. for (var i = 0; i < chartLine_data.data3.length; i++) {
  1115. var item = {
  1116. name: chartLine_data.data1[i],
  1117. type: 'line',
  1118. data: chartLine_data.data3[i].data
  1119. }
  1120. serie.push(item)
  1121. }
  1122. return serie
  1123. }
  1124. }())
  1125. }
  1126. this.tab.chart5.chartLine.setOption(option)
  1127. window.onresize = function() {
  1128. this.tab.chart5.chartLine.resize()
  1129. }
  1130. },
  1131. // 时间
  1132. changeChartDate(item) {
  1133. console.log(item)
  1134. if (item == 'chart1') {
  1135. if (this.tab.chart1.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart1.getdataListParm.parammaps.inputDatetime !== null) {
  1136. this.tab.chart1.getdataListParm.parammaps.startTime = parseTime(this.tab.chart1.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1137. this.tab.chart1.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart1.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1138. this.getChart1()
  1139. } else {
  1140. this.tab.chart1.getdataListParm.parammaps.inputDatetime = ''
  1141. this.tab.chart1.getdataListParm.parammaps.startTime = ''
  1142. this.tab.chart1.getdataListParm.parammaps.stopTime = ''
  1143. this.getChart1()
  1144. }
  1145. } else if (item == 'chart2') {
  1146. if (this.tab.chart2.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart2.getdataListParm.parammaps.inputDatetime !== null) {
  1147. this.tab.chart2.getdataListParm.parammaps.startTime = parseTime(this.tab.chart2.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1148. this.tab.chart2.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart2.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1149. this.getChart2()
  1150. } else {
  1151. this.tab.chart2.getdataListParm.parammaps.inputDatetime = ''
  1152. this.tab.chart2.getdataListParm.parammaps.startTime = ''
  1153. this.tab.chart2.getdataListParm.parammaps.stopTime = ''
  1154. this.getChart2()
  1155. }
  1156. } else if (item == 'chart3') {
  1157. if (this.tab.chart3.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart3.getdataListParm.parammaps.inputDatetime !== null) {
  1158. this.tab.chart3.getdataListParm.parammaps.startTime = parseTime(this.tab.chart3.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1159. this.tab.chart3.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart3.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1160. this.getChart3()
  1161. } else {
  1162. this.tab.chart3.getdataListParm.parammaps.inputDatetime = ''
  1163. this.tab.chart3.getdataListParm.parammaps.startTime = ''
  1164. this.tab.chart3.getdataListParm.parammaps.stopTime = ''
  1165. this.getChart3()
  1166. }
  1167. } else if (item == 'chart4') {
  1168. if (this.tab.chart4.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart4.getdataListParm.parammaps.inputDatetime !== null) {
  1169. this.tab.chart4.getdataListParm.parammaps.startTime = parseTime(this.tab.chart4.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1170. this.tab.chart4.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart4.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1171. this.getChart4()
  1172. } else {
  1173. this.tab.chart4.getdataListParm.parammaps.inputDatetime = ''
  1174. this.tab.chart4.getdataListParm.parammaps.startTime = ''
  1175. this.tab.chart4.getdataListParm.parammaps.stopTime = ''
  1176. this.getChart4()
  1177. }
  1178. } else if (item == 'chart5') {
  1179. console.log(this.tab.chart5.getdataListParm.parammaps.inputDatetime, 'inputDatetime')
  1180. if (this.tab.chart5.getdataListParm.parammaps.inputDatetime !== '' && this.tab.chart5.getdataListParm.parammaps.inputDatetime !== null) {
  1181. this.tab.chart5.getdataListParm.parammaps.startTime = parseTime(this.tab.chart5.getdataListParm.parammaps.inputDatetime[0], '{y}-{m}-{d}')
  1182. this.tab.chart5.getdataListParm.parammaps.stopTime = parseTime(this.tab.chart5.getdataListParm.parammaps.inputDatetime[1], '{y}-{m}-{d}')
  1183. this.getChart5()
  1184. } else {
  1185. this.tab.chart5.getdataListParm.parammaps.inputDatetime = ''
  1186. this.tab.chart5.getdataListParm.parammaps.startTime = ''
  1187. this.tab.chart5.getdataListParm.parammaps.stopTime = ''
  1188. this.getChart5()
  1189. }
  1190. }
  1191. },
  1192. // 导出
  1193. handleExport(item) {
  1194. if (item == 'chart1') {
  1195. console.log('泌乳牛采食量导出')
  1196. var excelDatasTabChart1 = [
  1197. {
  1198. tHeader: ['日期', '泌乳牛采食量', '泌乳牛产奶量'],
  1199. filterVal: ['日期', 'field1', 'field2'],
  1200. tableDatas: this.tab.chart1.table.list,
  1201. sheetName: '泌乳牛采食量'
  1202. }
  1203. ]
  1204. json2excel(excelDatasTabChart1, '泌乳牛采食量', true, 'xlsx')
  1205. } else if (item == 'chart2') {
  1206. console.log('剩料率导出')
  1207. var excelDatasTabChart2 = [
  1208. {
  1209. tHeader: ['日期', '栏舍名称', '剩料量', '撒料量', '剩料率'],
  1210. filterVal: ['日期', '名称', '剩料量', '撒料量', '准确率'],
  1211. tableDatas: this.tab.chart2.table.list,
  1212. sheetName: '牛栏剩料率'
  1213. }
  1214. ]
  1215. json2excel(excelDatasTabChart2, '牛栏剩料率', true, 'xlsx')
  1216. } else if (item == 'chart3') {
  1217. console.log('混料时间统计导出')
  1218. var excelDatasTabChart3 = [
  1219. {
  1220. tHeader: ['日期', '混料时间(分钟)'],
  1221. filterVal: ['日期', 'field1'],
  1222. tableDatas: this.tab.chart3.table.list,
  1223. sheetName: '混料时间统计'
  1224. }
  1225. ]
  1226. json2excel(excelDatasTabChart3, '混料时间统计', true, 'xlsx')
  1227. } else if (item == 'chart4') {
  1228. console.log('转化率导出')
  1229. var excelDatasTabChart4 = [
  1230. {
  1231. tHeader: ['日期', '配方名称', '饲料转化率'],
  1232. filterVal: ['日期', '名称', '准确率'],
  1233. tableDatas: this.tab.chart4.table.list,
  1234. sheetName: '转化率统计'
  1235. }
  1236. ]
  1237. json2excel(excelDatasTabChart4, '转化率', true, 'xlsx')
  1238. } else if (item == 'chart5') {
  1239. console.log('成本分析导出')
  1240. var excelDatasTabChart5 = [
  1241. {
  1242. tHeader: ['日期', '牲畜类别', '公斤奶饲料成本(元)'],
  1243. filterVal: ['日期', '名称', '准确率'],
  1244. tableDatas: this.tab.chart5.table.list,
  1245. sheetName: '成本分析'
  1246. }
  1247. ]
  1248. json2excel(excelDatasTabChart5, '成本分析', true, 'xlsx')
  1249. }
  1250. },
  1251. // 切换表格
  1252. handleTable(item) {
  1253. // 显示切换表格
  1254. if (item == 'chart1') {
  1255. console.log('泌乳牛采食量表格')
  1256. this.tab.chart1.isTable = true
  1257. this.tab.chart1.isChart = false
  1258. } else if (item == 'chart2') {
  1259. console.log('牛栏剩料率表格')
  1260. this.tab.chart2.isTable = true
  1261. this.tab.chart2.isChart = false
  1262. } else if (item == 'chart3') {
  1263. console.log('混料时间统计表格')
  1264. this.tab.chart3.isTable = true
  1265. this.tab.chart3.isChart = false
  1266. } else if (item == 'chart4') {
  1267. console.log('转化率表格')
  1268. this.tab.chart4.isTable = true
  1269. this.tab.chart4.isChart = false
  1270. } else if (item == 'chart5') {
  1271. console.log('成本分析表格')
  1272. this.tab.chart5.isTable = true
  1273. this.tab.chart5.isChart = false
  1274. }
  1275. },
  1276. // 切换图表
  1277. handleChart(item) {
  1278. // 显示切换图表
  1279. if (item == 'chart1') {
  1280. console.log('泌乳牛采食量图表')
  1281. this.tab.chart1.isTable = false
  1282. this.tab.chart1.isChart = true
  1283. this.getChart1()
  1284. } else if (item == 'chart2') {
  1285. console.log('牛栏剩料率图表')
  1286. this.tab.chart2.isTable = false
  1287. this.tab.chart2.isChart = true
  1288. this.getChart2()
  1289. } else if (item == 'chart3') {
  1290. console.log('混料时间统计图表')
  1291. this.tab.chart3.isTable = false
  1292. this.tab.chart3.isChart = true
  1293. this.getChart3()
  1294. } else if (item == 'chart4') {
  1295. console.log('转化率图表')
  1296. this.tab.chart4.isTable = false
  1297. this.tab.chart4.isChart = true
  1298. this.getChart4()
  1299. } else if (item == 'chart5') {
  1300. console.log('成本分析图表')
  1301. this.tab.chart5.isTable = false
  1302. this.tab.chart5.isChart = true
  1303. this.getChart5()
  1304. }
  1305. }
  1306. }
  1307. }
  1308. </script>
  1309. <style lang="scss" scoped>
  1310. .button{
  1311. height: 50px;
  1312. .exportTable{float: right;margin-right: 5px;}
  1313. }
  1314. .app-container1{padding-left: 10px;background-color: #F4F4F4;}
  1315. .dashboard-editor-container {
  1316. background-color: #F4F4F4;
  1317. .grid-content{
  1318. background-color:#fff;padding: 0 10px;
  1319. h4{text-align: center;line-height: 50px;}
  1320. }
  1321. }
  1322. // .table{margin-bottom: 50px;}
  1323. </style>