newReport.vue 45 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933
  1. <template>
  2. <view class="content">
  3. <view class="status_bar"></view>
  4. <view class="top-nav">
  5. <uni-icons class="back" type="back" size="25" @click="back"></uni-icons>
  6. <view class="right" :class="index==2?'nav-active':''" @click="navClick(2)">
  7. 新季
  8. </view>
  9. <view class="left" :class="index==1?'nav-active':''" @click="navClick(1)">
  10. 全部
  11. </view>
  12. </view>
  13. <view class="content1 content-item">
  14. <view class="title">
  15. 收支核算
  16. </view>
  17. <uni-transition ref="ani" custom-class="transition" :mode-class="modeClass" :styles="styles"
  18. :show="isSHowContent1">
  19. <u-line color="#EEEEEE" />
  20. <view class="row1 mtb40">
  21. <view class="left">
  22. <view class="">
  23. {{ym1Change}}
  24. </view>
  25. <view class="" style="font-size: 12px; color:#9E9E9E; margin-top: 10rpx;">
  26. 单位:万元
  27. </view>
  28. </view>
  29. <view class="right" v-if="index!=2">
  30. <text class="text" :class="textIndex==1?'text-active':''" @click="accounting(1)">
  31. 按月
  32. </text>
  33. <text class="text" :class="textIndex==2?'text-active':''" @click="accounting(2)">按年</text>
  34. </view>
  35. </view>
  36. <view class="row2" @click='godetail(2)'>
  37. <view class="text">
  38. 收入(万元)
  39. </view>
  40. <view class="price">
  41. {{sr?Number(sr).toFixed(2):0}}
  42. </view>
  43. </view>
  44. <view class="row3" @click='godetail(2)'>
  45. <view class="left">
  46. <view class="text">
  47. 支出(万元)
  48. </view>
  49. <view class="number">
  50. {{zc?Number(zc).toFixed(2):0}}
  51. </view>
  52. </view>
  53. <view class="center">
  54. </view>
  55. <view class="right">
  56. <view class="text">
  57. 差额(万元)
  58. </view>
  59. <view class="number">
  60. {{Number(sr-zc).toFixed(2)}}
  61. </view>
  62. </view>
  63. </view>
  64. <view class="row5 flex alc">
  65. <view class="left">
  66. <text class="point-left flex alc"></text>收入(万元):<text
  67. class="text-left">{{Number(sr).toFixed(2)}}</text>
  68. <!-- <text class="point-left flex alc"></text>收入(万元):<text class="text-left">2000.00</text> -->
  69. </view>
  70. <view class="right">
  71. <text class="point-right"></text>支出(万元):<text
  72. class="text-right">{{Number(zc).toFixed(2)}}</text>
  73. <!-- <text class="point-left flex alc"></text>收入(万元):<text class="text-left">2000.00</text> -->
  74. </view>
  75. </view>
  76. <view class="row4">
  77. <qiun-data-charts type="area" :opts="opts" :chartData="chartData" :ontouch="true"
  78. @getIndex="getIndex" />
  79. </view>
  80. </uni-transition>
  81. <view class="zd flex alc" @click="foldClcik('fade',1)">
  82. {{this.isSHowContent1?'点击收起':'点击展开'}}
  83. <image v-if="this.isSHowContent1" src="../../static/sq.png" mode="widthFix"
  84. style="width: 30rpx;margin-left: 10rpx;"></image>
  85. <image v-else src="../../static/zk.png" mode="widthFix" style="width: 30rpx;margin-left: 10rpx;">
  86. </image>
  87. </view>
  88. </view>
  89. <view class="content2 content-item">
  90. <view class="title">
  91. 合同数据
  92. </view>
  93. <uni-transition ref="ani" custom-class="transition" :mode-class="modeClass" :styles="styles"
  94. :show="isSHowContent2">
  95. <u-line color="#EEEEEE" />
  96. <view class="row1 flex jcsb" style="margin-top: 40rpx;">
  97. <view class="left title-lv2">
  98. 数量统计
  99. </view>
  100. <view @click='godetail(0)' class="right-btn" style="position: relative;z-index: 999;">
  101. 合同明细
  102. </view>
  103. </view>
  104. <!-- <view class="row2 flex jcse">
  105. <view class="left flex alc">
  106. <view class="color1"></view>
  107. <text class="text">{{index==1?'过去12个月累计签订数量':'本季累计签订合同数量'}}</text>
  108. </view>
  109. <view class="right flex alc">
  110. <view class="color2"></view>
  111. <text class="text">{{index==1?'当前执行中数量':'本季执行中数量'}}</text>
  112. </view>
  113. </view> -->
  114. <view class="row3">
  115. <qiun-data-charts type="bar" :opts="opts2" :chartData="chartData1" />
  116. </view>
  117. <view class="row4 flex jcsb mtb40">
  118. <view class="left title-lv2">
  119. 利润核算
  120. </view>
  121. <view @click='godetail(1)' class="right-btn">
  122. 利润明细
  123. </view>
  124. </view>
  125. <view class="row5">
  126. <view class="left flex">
  127. <view class="" v-if="index==1">
  128. <u-icon name="arrow-left" size="26" style="margin-right: 10rpx;" color="#969696"
  129. @click="yearClick('1')">
  130. </u-icon>
  131. <text @click="showYear=true">{{year}}年</text>
  132. <u-icon name="arrow-right" size="26" style="margin-left: 10rpx;"
  133. :color="nowYear!=year?'#969696':'#DBDBDB'" @click="yearClick('2')" v-if="nowYear!=year">
  134. </u-icon>
  135. <u-icon name="arrow-right" size="26" style="margin-left: 10rpx;"
  136. :color="nowYear!=year?'#969696':'#DBDBDB'" v-if="nowYear==year">
  137. </u-icon>
  138. </view>
  139. <view class="" v-else>
  140. 新季利润
  141. </view>
  142. </view>
  143. <view class="right">
  144. 单位:元
  145. </view>
  146. </view>
  147. <view class="row6" v-if="isHaveData3">
  148. <qiun-data-charts type="column" :opts="opts3" :chartData="chartData3" />
  149. </view>
  150. </uni-transition>
  151. <view class="zd flex alc" @click="foldClcik('fade',2)">
  152. {{this.isSHowContent2?'点击收起':'点击展开'}}
  153. <image v-if="this.isSHowContent2" src="../../static/sq.png" mode="widthFix"
  154. style="width: 30rpx;margin-left: 10rpx;"></image>
  155. <image v-else src="../../static/zk.png" mode="widthFix" style="width: 30rpx;margin-left: 10rpx;">
  156. </image>
  157. </view>
  158. </view>
  159. <view class="content3 content-item">
  160. <view class="title flex jcsb">
  161. <view class="">
  162. 仓储数据
  163. </view>
  164. <view @click='goToPage(5)' class="right-btn">
  165. 库存明细
  166. </view>
  167. </view>
  168. <uni-transition ref="ani" custom-class="transition" :mode-class="modeClass" :styles="styles"
  169. :show="isSHowContent3">
  170. <u-line color="#EEEEEE" />
  171. <view class="row1 flex jcsb mtb40">
  172. <view class="left title-lv2">
  173. 库存储量
  174. </view>
  175. <view class="right">
  176. 单位:吨
  177. </view>
  178. </view>
  179. <view class="btn">
  180. <view class="btn-in" :class='btnIndex==2?"btn-active":""' @click="changeWeight(2)">
  181. 实际重量
  182. </view>
  183. <view class="btn-in" :class='btnIndex==1?"btn-active":""' @click="changeWeight(1)">
  184. 折算纯重
  185. </view>
  186. </view>
  187. <view class="row2">
  188. <view class="" v-for="(item,index) in clList">
  189. <view class="name">
  190. {{item.name}}
  191. </view>
  192. <view class="bottom flex alc jcsb">
  193. <u-line-progress :percent="item.percent" :active-color="color4(index)" :show-percent='false'
  194. class='left' height='12'>
  195. </u-line-progress>
  196. <view class="weight">
  197. {{item.weight}}
  198. </view>
  199. </view>
  200. </view>
  201. <!-- <qiun-data-charts type="bar" :opts="opts4" :chartData="chartData4" :ontouch="true" /> -->
  202. </view>
  203. <view class="row3">
  204. <view class="list-item flex jcsb" v-for="(item,index) in InventoryList">
  205. <view class="flex alc">
  206. <image :src="item.src" mode="widthFix" style="width: 40rpx;margin-right: 20rpx;"></image>
  207. <text style="color:#707575;">{{item.name}}</text>
  208. </view>
  209. <view class="number">
  210. {{item.number}}
  211. </view>
  212. </view>
  213. </view>
  214. <view class="row5 flex jcsb mtb40">
  215. <view class="left title-lv2">
  216. 当期货值
  217. </view>
  218. <view class="right">
  219. 单位:万元
  220. </view>
  221. </view>
  222. <view class="row6">
  223. <qiun-data-charts type="column" :opts="opts5" :chartData="chartData5" :ontouch="true" />
  224. </view>
  225. <view class="row7">
  226. <view class="left title-lv2" style="margin: 30rpx;">
  227. 平均成本
  228. </view>
  229. <view class="list-item" v-for="item in averageCostList">
  230. <view class="flex jcsb alc">
  231. <view class="left" style="color: #7A7A7A;">
  232. {{item.name}}
  233. </view>
  234. <view class="">
  235. {{Number(item.result).toFixed(0)}}
  236. </view>
  237. </view>
  238. </view>
  239. </view>
  240. </uni-transition>
  241. <view class="zd flex alc" @click="foldClcik('fade',3)">
  242. {{this.isSHowContent3?'点击收起':'点击展开'}}
  243. <image v-if="this.isSHowContent3" src="../../static/sq.png" mode="widthFix"
  244. style="width: 30rpx;margin-left: 10rpx;"></image>
  245. <image v-else src="../../static/zk.png" mode="widthFix" style="width: 30rpx;margin-left: 10rpx;">
  246. </image>
  247. </view>
  248. </view>
  249. <view class="content4 content-item">
  250. <view class="title flex jcsb">
  251. <view class="">
  252. 今日入库
  253. </view>
  254. <view @click='godetail(3)' class="right-btn">
  255. 入库明细
  256. </view>
  257. </view>
  258. <uni-transition ref="ani" custom-class="transition" :mode-class="modeClass" :styles="styles"
  259. :show="isSHowContent4">
  260. <u-line color="#EEEEEE" />
  261. <view class="" style="color: #9E9E9E;margin: 30rpx 0 0 30rpx; font-size: 12px;">
  262. 单位:吨
  263. </view>
  264. <view class="flex alc">
  265. <view class="" style="width:40%;height: 160px;">
  266. <qiun-data-charts type="ring" :opts="opts6" :chartData="chartData6" class='opts6' />
  267. </view>
  268. <view class="zt-right">
  269. <view class="flex jcsb alc" v-for="item in rkList" style="font-weight: 700;">
  270. <view class="left">
  271. <text :style="item.style"></text>{{item.name}}
  272. </view>
  273. <view class="right">
  274. {{Number(item.value).toFixed(2)}}
  275. </view>
  276. </view>
  277. </view>
  278. </view>
  279. </uni-transition>
  280. <view class="zd flex alc" @click="foldClcik('fade',4)">
  281. {{this.isSHowContent4?'点击收起':'点击展开'}}
  282. <image v-if="this.isSHowContent4" src="../../static/sq.png" mode="widthFix"
  283. style="width: 30rpx;margin-left: 10rpx;"></image>
  284. <image v-else src="../../static/zk.png" mode="widthFix" style="width: 30rpx;margin-left: 10rpx;">
  285. </image>
  286. </view>
  287. </view>
  288. <view class="content5 content-item">
  289. <view class="title">
  290. 在途数据
  291. </view>
  292. <uni-transition ref="ani" custom-class="transition" :mode-class="modeClass" :styles="styles"
  293. :show="isSHowContent5">
  294. <u-line color="#EEEEEE" />
  295. <view class="row1 days-nav">
  296. <view class="item" :class="carIndex==index?'item-active':''" v-for="(item, index) in dayList"
  297. @click="clickNav(index)">
  298. {{item}}
  299. </view>
  300. </view>
  301. <view class="flex alc">
  302. <view class="" style="width:40%;height: 160px;">
  303. <qiun-data-charts type="ring" :opts="opts7" :chartData="chartData7" />
  304. </view>
  305. <view class="zt-right">
  306. <view class="flex jcsb alc" v-for="item in ztList" style="font-weight: 700;">
  307. <view class="left">
  308. <text :style="item.style"></text>{{item.name}}
  309. </view>
  310. <view class="right">
  311. {{item.value}}
  312. </view>
  313. </view>
  314. </view>
  315. </view>
  316. </uni-transition>
  317. <view class="zd flex alc" @click="foldClcik('fade',5)">
  318. {{this.isSHowContent5?'点击收起':'点击展开'}}
  319. <image v-if="this.isSHowContent5" src="../../static/sq.png" mode="widthFix"
  320. style="width: 30rpx;margin-left: 10rpx;"></image>
  321. <image v-else src="../../static/zk.png" mode="widthFix" style="width: 30rpx;margin-left: 10rpx;">
  322. </image>
  323. </view>
  324. </view>
  325. <view class="content6 content-item">
  326. <view class="title">
  327. 用户增长
  328. </view>
  329. <uni-transition ref="ani" custom-class="transition" :mode-class="modeClass" :styles="styles"
  330. :show="isSHowContent6">
  331. <u-line color="#EEEEEE" />
  332. <view class="row1 flex jcsb" style="padding:0 12rpx 0 5rpx;">
  333. <view class="left">
  334. app注册
  335. </view>
  336. <view class="right">
  337. <text>合计:</text>
  338. <text style="color: #EC6666;">{{appTotal}}</text>
  339. <text>人</text>
  340. </view>
  341. </view>
  342. <view class="row2">
  343. <qiun-data-charts type="area" :opts="opts8" :chartData="chartData8" />
  344. </view>
  345. <view class="row1 flex jcsb" style="margin-top: 90rpx;padding:0 12rpx 0 5rpx;">
  346. <view class="left">
  347. 粮脉入驻
  348. </view>
  349. <view class="right">
  350. <text>合计:</text>
  351. <text style="color: #22C572;">{{lmTotal}}</text>
  352. <text>人</text>
  353. </view>
  354. </view>
  355. <view class="row2">
  356. <qiun-data-charts type="area" :opts="opts9" :chartData="chartData9" />
  357. </view>
  358. </uni-transition>
  359. <view class="zd flex alc" @click="foldClcik('fade',6)">
  360. {{this.isSHowContent6?'点击收起':'点击展开'}}
  361. <image v-if="this.isSHowContent6" src="../../static/sq.png" mode="widthFix"
  362. style="width: 30rpx;margin-left: 10rpx;"></image>
  363. <image v-else src="../../static/zk.png" mode="widthFix" style="width: 30rpx;margin-left: 10rpx;">
  364. </image>
  365. </view>
  366. </view>
  367. <u-picker v-model="showYear" mode="selector" :range="selector" :default-selector="[2]"></u-picker>
  368. </view>
  369. </template>
  370. <script>
  371. export default {
  372. data() {
  373. return {
  374. btnIndex: "2",
  375. rkList: [],
  376. ztList: [],
  377. ztColor: ['#38CA80', '#8D9EE9', '#FFBB6E'],
  378. color: ['#FFBB6E', '#8D9EE9', '#FF8B95', '#38CA80', '#FFDD85', "#1890FF", "#91CB74", "#FAC858", "#EE6666",
  379. "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
  380. "#ea7ccc"
  381. ],
  382. clList: [],
  383. isHaveData3: true,
  384. val: 1000,
  385. carIndex: 0,
  386. appTotal: '',
  387. lmTotal: '',
  388. ym1: '',
  389. ym1Change: '',
  390. sr: '',
  391. zc: '',
  392. seachYear: '',
  393. seachMoth: '2022-10-10',
  394. dayList: ['1天', '7天', '30天'],
  395. averageCostList: [{
  396. name: '玉米',
  397. number: '2000.00'
  398. },
  399. {
  400. name: '玉米(潮粮)',
  401. number: '2000.00'
  402. },
  403. {
  404. name: '高粱',
  405. number: '2000.00'
  406. },
  407. {
  408. name: '高粱(潮粮)',
  409. number: '2000.00'
  410. },
  411. {
  412. name: '小麦',
  413. number: '2000.00'
  414. },
  415. {
  416. name: '大豆',
  417. number: '2000.00'
  418. },
  419. ],
  420. InventoryList: [{
  421. name: '合计储量',
  422. number: '1000.00',
  423. src: '../../static/img/cl.png'
  424. }, {
  425. name: '采购待执行',
  426. number: '1000.00',
  427. src: '../../static/img/cg.png'
  428. },
  429. {
  430. name: '销待执行售',
  431. number: '1000.00',
  432. src: '../../static/img/xs.png'
  433. },
  434. {
  435. name: '头寸',
  436. number: '1000.00',
  437. src: '../../static/img/tc.png'
  438. },
  439. ],
  440. year: 2022,
  441. selector: [2020, 2021, 2022],
  442. showYear: false,
  443. iconName1: 'arrow-up',
  444. iconName2: 'arrow-up',
  445. iconName3: 'arrow-up',
  446. iconName4: 'arrow-up',
  447. iconName5: 'arrow-up',
  448. iconName6: 'arrow-up',
  449. styles: {},
  450. modeClass: 'fade',
  451. isSHowContent1: true,
  452. isSHowContent2: true,
  453. isSHowContent3: true,
  454. isSHowContent4: true,
  455. isSHowContent5: true,
  456. isSHowContent6: true,
  457. chartData: {},
  458. chartData1: {},
  459. chartData3: {},
  460. chartData4: {},
  461. chartData5: {},
  462. chartData6: {},
  463. chartData7: {},
  464. chartData8: {},
  465. chartData9: {},
  466. opts: {
  467. enableScroll: true,
  468. color: ["#E84A55", "#22C572"],
  469. padding: [15, 15, 0, 15],
  470. dataPointShapeType: "hollow",
  471. legend: {
  472. show: false
  473. },
  474. xAxis: {
  475. gridType: "dash",
  476. disableGrid: true,
  477. itemCount: 6,
  478. },
  479. yAxis: {
  480. // gridType: "dash",
  481. gridType: 'solid',
  482. gridColor: "#E9E9E9",
  483. splitNumber: 5,
  484. data: [{
  485. // disabled: true,
  486. axisLine: false,
  487. fontColor: "#BEBEBE",
  488. textAlign: 'right'
  489. }],
  490. },
  491. extra: {
  492. area: {
  493. type: "straight",
  494. opacity: 0.3,
  495. addLine: true,
  496. width: 2,
  497. gradient: true
  498. },
  499. tooltip: {
  500. showBox: false,
  501. showArrow: true,
  502. showCategory: false,
  503. borderWidth: 0,
  504. borderRadius: 0,
  505. borderColor: "#000000",
  506. borderOpacity: 0.7,
  507. bgColor: "#000000",
  508. bgOpacity: 0.7,
  509. gridType: "dash",
  510. dashLength: 4,
  511. gridColor: "#E9E9E9",
  512. fontColor: "#FFFFFF",
  513. splitLine: true,
  514. horizentalLine: false,
  515. xAxisLabel: false,
  516. yAxisLabel: false,
  517. labelBgColor: "#FFFFFF",
  518. labelBgOpacity: 0.7,
  519. labelFontColor: "#666666"
  520. }
  521. },
  522. },
  523. opts2: {
  524. color: ["#D2F3E2", "#22C572"],
  525. padding: [15, 20, 0, 5],
  526. legend: {
  527. fontSize: 12,
  528. position: 'top',
  529. itemGap: 20,
  530. padding: 20
  531. },
  532. xAxis: {
  533. boundaryGap: "justify",
  534. disableGrid: false,
  535. axisLine: false,
  536. gridType: "dash",
  537. dashLength: 10,
  538. },
  539. extra: {
  540. // tooltip: {
  541. // showBox: false,
  542. // },
  543. bar: {
  544. type: "group",
  545. width: 10,
  546. meterBorde: 1,
  547. meterFillColor: "#FFFFFF",
  548. activeBgColor: "#000000",
  549. activeBgOpacity: 0.08,
  550. // linearType: "custom",
  551. barBorderCircle: true,
  552. seriesGap: 2,
  553. categoryGap: 6
  554. }
  555. }
  556. },
  557. opts3: {
  558. color: ["#8D9EE9"],
  559. padding: [15, 15, 0, 5],
  560. legend: {
  561. show: false
  562. },
  563. xAxis: {
  564. disableGrid: true,
  565. gridType: "dash",
  566. },
  567. yAxis: {
  568. gridType: "dash",
  569. data: [{
  570. min: 0,
  571. fontColor: '#BEBEBE',
  572. textAlign: 'right'
  573. }]
  574. },
  575. extra: {
  576. column: {
  577. type: "group",
  578. width: 15,
  579. activeBgColor: "#000000",
  580. activeBgOpacity: 0.08,
  581. linearType: "custom",
  582. seriesGap: 5,
  583. linearOpacity: 0.5,
  584. barBorderCircle: true,
  585. customColor: [
  586. "#8D9EE9",
  587. "#8D9EE9"
  588. ]
  589. }
  590. }
  591. },
  592. opts4: {
  593. enableScroll: true,
  594. color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
  595. "#ea7ccc"
  596. ],
  597. padding: [15, 30, 0, 5],
  598. legend: {
  599. show: false,
  600. },
  601. xAxis: {
  602. boundaryGap: "justify",
  603. disableGrid: false,
  604. axisLine: false,
  605. itemCount: 4,
  606. },
  607. yAxis: {
  608. },
  609. extra: {
  610. bar: {
  611. type: "group",
  612. width: 15,
  613. meterBorde: 1,
  614. meterFillColor: "#FFFFFF",
  615. activeBgColor: "#000000",
  616. activeBgOpacity: 0.08,
  617. // linearType: "custom",
  618. barBorderCircle: true,
  619. seriesGap: 2,
  620. categoryGap: 6
  621. }
  622. }
  623. },
  624. opts5: {
  625. enableScroll: true,
  626. color: ["#8D9EE9"],
  627. padding: [15, 15, 0, 5],
  628. legend: {
  629. show: false,
  630. },
  631. xAxis: {
  632. disableGrid: true,
  633. itemCount: 4,
  634. gridType: "dash",
  635. },
  636. yAxis: {
  637. gridType: "dash",
  638. data: [{
  639. min: 0,
  640. fontColor: "#BEBEBE",
  641. axisLine: false
  642. }]
  643. },
  644. extra: {
  645. column: {
  646. type: "group",
  647. width: 15,
  648. activeBgColor: "#000000",
  649. activeBgOpacity: 0.08,
  650. // linearType: "custom",
  651. seriesGap: 5,
  652. // linearOpacity: 0.5,
  653. barBorderCircle: true,
  654. customColor: [
  655. "#8D9EE9",
  656. "#8D9EE9"
  657. ]
  658. }
  659. }
  660. },
  661. opts6: {
  662. dataLabel: false,
  663. rotate: false,
  664. rotateLock: false,
  665. color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
  666. "#ea7ccc"
  667. ],
  668. legend: {
  669. show: false,
  670. position: "right",
  671. lineHeight: 25
  672. },
  673. title: {
  674. name: "",
  675. fontSize: 15,
  676. color: "#666666"
  677. },
  678. subtitle: {
  679. name: "",
  680. fontSize: 25,
  681. color: "#7cb5ec"
  682. },
  683. extra: {
  684. ring: {
  685. ringWidth: 10,
  686. activeOpacity: 0.5,
  687. activeRadius: 10,
  688. offsetAngle: 0,
  689. labelWidth: 15,
  690. border: false,
  691. borderWidth: 3,
  692. borderColor: "#FFFFFF"
  693. }
  694. }
  695. },
  696. opts7: {
  697. dataLabel: false,
  698. rotate: false,
  699. rotateLock: false,
  700. color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
  701. "#ea7ccc"
  702. ],
  703. legend: {
  704. show: false,
  705. position: "right",
  706. lineHeight: 25
  707. },
  708. title: {
  709. name: "",
  710. fontSize: 15,
  711. color: "#666666"
  712. },
  713. subtitle: {
  714. name: "",
  715. fontSize: 25,
  716. color: "#7cb5ec"
  717. },
  718. extra: {
  719. ring: {
  720. ringWidth: 10,
  721. activeOpacity: 0.5,
  722. activeRadius: 10,
  723. offsetAngle: 0,
  724. labelWidth: 15,
  725. border: false,
  726. borderWidth: 3,
  727. borderColor: "#FFFFFF"
  728. }
  729. }
  730. },
  731. opts8: {
  732. color: ["#EC6666"],
  733. padding: [15, 15, 0, 15],
  734. legend: {
  735. show: false,
  736. },
  737. xAxis: {
  738. disableGrid: true
  739. },
  740. yAxis: {
  741. gridType: "dash",
  742. dashLength: 2,
  743. data: [{
  744. // disabled: true,
  745. axisLine: false,
  746. fontColor: "#BEBEBE",
  747. }],
  748. },
  749. extra: {
  750. area: {
  751. type: "curve",
  752. opacity: 0.2,
  753. addLine: true,
  754. width: 2,
  755. gradient: true
  756. },
  757. tooltip: {
  758. showBox: false,
  759. showArrow: true,
  760. showCategory: false,
  761. borderWidth: 0,
  762. borderRadius: 0,
  763. borderColor: "#000000",
  764. borderOpacity: 0.7,
  765. bgColor: "#000000",
  766. bgOpacity: 0.7,
  767. gridType: "dash",
  768. dashLength: 4,
  769. gridColor: "#E9E9E9",
  770. fontColor: "#FFFFFF",
  771. splitLine: true,
  772. horizentalLine: false,
  773. xAxisLabel: false,
  774. yAxisLabel: false,
  775. labelBgColor: "#FFFFFF",
  776. labelBgOpacity: 0.7,
  777. labelFontColor: "#666666"
  778. }
  779. }
  780. },
  781. opts9: {
  782. color: ["#22C572"],
  783. padding: [15, 15, 0, 15],
  784. legend: {
  785. show: false,
  786. },
  787. xAxis: {
  788. disableGrid: true
  789. },
  790. yAxis: {
  791. gridType: "dash",
  792. dashLength: 2,
  793. data: [{
  794. // disabled: true,
  795. axisLine: false,
  796. fontColor: "#BEBEBE",
  797. }],
  798. },
  799. extra: {
  800. area: {
  801. type: "curve",
  802. opacity: 0.2,
  803. addLine: true,
  804. width: 2,
  805. gradient: true
  806. },
  807. tooltip: {
  808. showBox: false,
  809. showArrow: true,
  810. showCategory: false,
  811. borderWidth: 0,
  812. borderRadius: 0,
  813. borderColor: "#000000",
  814. borderOpacity: 0.7,
  815. bgColor: "#000000",
  816. bgOpacity: 0.7,
  817. gridType: "dash",
  818. dashLength: 4,
  819. gridColor: "#E9E9E9",
  820. fontColor: "#FFFFFF",
  821. splitLine: true,
  822. horizentalLine: false,
  823. xAxisLabel: false,
  824. yAxisLabel: false,
  825. labelBgColor: "#FFFFFF",
  826. labelBgOpacity: 0.7,
  827. labelFontColor: "#666666"
  828. }
  829. }
  830. },
  831. textIndex: 1,
  832. index: 2,
  833. background: {
  834. backgroundColor: '#2E303A',
  835. backgroundColor: 'red',
  836. },
  837. nowYear: ''
  838. }
  839. },
  840. onLoad: function(option) {
  841. this.nowYear = new Date().getFullYear()
  842. },
  843. destroyed() {
  844. },
  845. onUnload() {
  846. },
  847. onReady() {
  848. this.getServerData();
  849. },
  850. methods: {
  851. changeWeight(index) {
  852. this.btnIndex = index
  853. this.makeDate4(this.chartList, index)
  854. },
  855. color4(index) {
  856. console.log(index)
  857. index = index + 1
  858. switch (index) {
  859. case 1:
  860. return '#FFBB6E'
  861. case 2:
  862. return '#8D9EE9'
  863. case 3:
  864. return '#FF8B95'
  865. case 4:
  866. return '#38CA80'
  867. case 5:
  868. return '#FFDD85'
  869. case 6:
  870. return '#FFBB6E'
  871. case 7:
  872. return '#FFBB6E'
  873. case 8:
  874. return '#FFBB6E'
  875. case 9:
  876. return '#FFBB6E'
  877. case 10:
  878. return '#FFBB6E'
  879. }
  880. },
  881. goToPage(index) {
  882. uni.navigateTo({
  883. url: '/pages/user/contractLook/inventoryCost?searchMonth=' + this.seachMoth
  884. })
  885. },
  886. clickNav(index) {
  887. this.carIndex = index
  888. let _data = ""
  889. if (index == 0) {
  890. _data = 1
  891. } else if (index == 1) {
  892. _data = 7
  893. } else {
  894. _data = 30
  895. }
  896. this.$api.doRequest('get', '/biInfoController/getTranCountWai', {
  897. seachMoth: _data,
  898. }).then(res => {
  899. console.log(res.data)
  900. this.selectMakeDate7(res.data.data[0])
  901. })
  902. },
  903. yearClick(type) {
  904. if (type == 1) {
  905. this.year--
  906. } else {
  907. this.year++
  908. }
  909. this.$api.doRequest('get', '/biInfoController/profitAccount', {
  910. compId: uni.getStorageSync('pcUserInfo').compId,
  911. seachYear: this.year,
  912. // biViewInfoList: {weight:''}
  913. }).then(res => {
  914. console.log("利润切换", res.data.data[0])
  915. // this.makeDate3(res.data[0])
  916. this.chartData3.series = [];
  917. let _categorieslr = []
  918. let _countlr = []
  919. if (res.data.data[0].biViewInfoList.length > 0) {
  920. for (let i = 0; i < res.data.data[0].biViewInfoList.length; i++) {
  921. _categorieslr.push(res.data.data[0].biViewInfoList[i].name)
  922. _countlr.push(res.data.data[0].biViewInfoList[i].weight ? res.data.data[0]
  923. .biViewInfoList[
  924. i].weight :
  925. 0)
  926. //利润核算
  927. }
  928. }
  929. let res3 = {
  930. categories: _categorieslr,
  931. series: [{
  932. name: "利润金额",
  933. data: _countlr
  934. }]
  935. };
  936. this.chartData3 = JSON.parse(JSON.stringify(res3));
  937. })
  938. },
  939. godetail(status) {
  940. var url = ''
  941. switch (status) {
  942. case 0:
  943. url = '/pages/dataReport/contractdetails/contractdetails'
  944. break;
  945. case 1:
  946. url = '/pages/dataReport/breakdownofprofit'
  947. break;
  948. case 2:
  949. url = '/pages/dataReport/costbreakdown?data=' + this.ym1 + '&type=' + this.index
  950. break;
  951. case 3:
  952. url = '/pages/dataReport/Inventoryentrydetails'
  953. break;
  954. }
  955. uni.navigateTo({
  956. url: url
  957. })
  958. },
  959. foldClcik(type, index) {
  960. switch (index) {
  961. case 1:
  962. this.isSHowContent1 = !this.isSHowContent1
  963. this.iconName1 = this.isSHowContent1 ? "arrow-up" : 'arrow-down'
  964. break;
  965. case 2:
  966. this.isSHowContent2 = !this.isSHowContent2
  967. this.iconName2 = this.isSHowContent2 ? "arrow-up" : 'arrow-down'
  968. break;
  969. case 3:
  970. this.isSHowContent3 = !this.isSHowContent3
  971. this.iconName3 = this.isSHowContent3 ? "arrow-up" : 'arrow-down'
  972. break;
  973. case 4:
  974. this.isSHowContent4 = !this.isSHowContent4
  975. this.iconName4 = this.isSHowContent4 ? "arrow-up" : 'arrow-down'
  976. break;
  977. case 5:
  978. this.isSHowContent5 = !this.isSHowContent5
  979. this.iconName5 = this.isSHowContent5 ? "arrow-up" : 'arrow-down'
  980. break;
  981. case 6:
  982. this.isSHowContent6 = !this.isSHowContent6
  983. this.iconName6 = this.isSHowContent6 ? "arrow-up" : 'arrow-down'
  984. break;
  985. }
  986. this.modeClass = type
  987. },
  988. getIndex(e) {
  989. console.log(e)
  990. // 点击图表
  991. if (this.textIndex == 1) {
  992. this.ym1 = this.chartList[0].biViewInfoList[e.currentIndex.index].name
  993. this.ym1Change = this.chartList[0].biViewInfoList[e.currentIndex.index].name.replace(/-/g, ".");
  994. this.sr = this.chartList[0].biViewInfoList[e.currentIndex.index].weight
  995. this.zc = this.chartList[2].biViewInfoList[e.currentIndex.index].weight
  996. } else {
  997. this.ym1 = this.chartList[1].biViewInfoList[e.currentIndex.index].name
  998. this.ym1Change = this.chartList[1].biViewInfoList[e.currentIndex.index].name.replace(/-/g, ".");
  999. this.sr = this.chartList[1].biViewInfoList[e.currentIndex.index].weight
  1000. this.zc = this.chartList[3].biViewInfoList[e.currentIndex.index].weight
  1001. }
  1002. },
  1003. makeYData(max) {
  1004. if (max <= 100) {
  1005. return Math.ceil(max * 1.05 / 20) * 20
  1006. } else if (max <= 1000) {
  1007. return Math.ceil(max * 1.05 / 100) * 100
  1008. } else if (max > 1000) {
  1009. console.log(111)
  1010. return Math.ceil(max * 1.05 / 500) * 500
  1011. }
  1012. // Math.ceil(_max * 1.05 / 500) * 500
  1013. },
  1014. makeDate1(val) {
  1015. console.log("val", val)
  1016. // 按月1
  1017. let _categories = []
  1018. let _price1 = []
  1019. let _price2 = []
  1020. this.chartData.series = [];
  1021. // 设置x轴数据
  1022. let _ySRPriceMax = 0
  1023. let _yZCPriceMax = 0
  1024. let _max = 0
  1025. if (this.textIndex == 1) {
  1026. if (val[0].biViewInfoList && val[0].biViewInfoList.length > 0) {
  1027. for (let i = 0; i < val[0].biViewInfoList.length; i++) {
  1028. val[0].biViewInfoList[i].weight = Number(val[0].biViewInfoList[i].weight).toFixed(2)
  1029. _price1.push(val[0].biViewInfoList[i].weight)
  1030. }
  1031. //月收入最大值
  1032. _ySRPriceMax = Math.max(..._price1)
  1033. for (let i = 0; i < val[2].biViewInfoList.length; i++) {
  1034. val[2].biViewInfoList[i].weight = Number(val[2].biViewInfoList[i].weight).toFixed(2)
  1035. _price2.push(val[2].biViewInfoList[i].weight)
  1036. _categories.push(new Date(val[2].biViewInfoList[i].name).getMonth() + 1)
  1037. }
  1038. //月收入最大值
  1039. _yZCPriceMax = Math.max(..._price2)
  1040. // 判断收入支出最大值构建y坐标轴刻度
  1041. _max = _ySRPriceMax > _yZCPriceMax ? _ySRPriceMax : _yZCPriceMax
  1042. this.ym1 = val[0].biViewInfoList[val[0].biViewInfoList.length - 1].name
  1043. this.ym1Change = val[0].biViewInfoList[val[0].biViewInfoList.length - 1].name.replace(/-/g, ".");
  1044. this.sr = val[0].biViewInfoList[val[0].biViewInfoList.length - 1].weight
  1045. this.zc = val[2].biViewInfoList[val[2].biViewInfoList.length - 1].weight
  1046. }
  1047. } else {
  1048. if (val[1].biViewInfoList && val[1].biViewInfoList.length > 0) {
  1049. this.ym1Change = val[1].biViewInfoList[val[1].biViewInfoList.length - 1].name.replace(/-/g, ".");
  1050. this.ym1 = val[1].biViewInfoList[val[1].biViewInfoList.length - 1].name
  1051. this.sr = val[1].biViewInfoList[val[1].biViewInfoList.length - 1].weight
  1052. this.zc = val[3].biViewInfoList[val[3].biViewInfoList.length - 1].weight
  1053. for (let i = 0; i < val[1].biViewInfoList.length; i++) {
  1054. _categories.push(val[1].biViewInfoList[i].name)
  1055. _price1.push(val[1].biViewInfoList[i].weight)
  1056. }
  1057. for (let i = 0; i < val[3].biViewInfoList.length; i++) {
  1058. _price2.push(val[3].biViewInfoList[i].weight)
  1059. }
  1060. }
  1061. _max = _price1 > _price2 ? _price1 : _price2
  1062. }
  1063. let res = {
  1064. categories: _categories,
  1065. series: [{
  1066. name: "收入",
  1067. data: _price1,
  1068. textColor: "transparent"
  1069. }, {
  1070. name: "支出",
  1071. data: _price2,
  1072. textColor: "transparent"
  1073. }
  1074. ]
  1075. };
  1076. // this.opts.yAxis.data[0].max = Math.ceil(_max / 1000) * 1000
  1077. // 处理y轴最大值
  1078. console.log("max1", _max)
  1079. let _newMax = this.makeYData(_max)
  1080. console.log('max1', _newMax)
  1081. // this.opts.yAxis.data[0].max = Math.ceil(_max * 1.05 / 500) * 500
  1082. this.opts.yAxis.data[0].max = _newMax
  1083. this.chartData = JSON.parse(JSON.stringify(res));
  1084. },
  1085. makeDate2(val) {
  1086. let _categories = []
  1087. let _count1 = []
  1088. let _count2 = []
  1089. let _xMax1 = 0
  1090. let _xMax2 = 0
  1091. let _max = 0
  1092. if (val[4].biViewInfoList && val[4].biViewInfoList.length > 0) {
  1093. for (let i = 0; i < val[4].biViewInfoList.length; i++) {
  1094. _categories.push(val[4].biViewInfoList[i].name.substring(0, 2))
  1095. _count1.push(Number(val[4].biViewInfoList[i].weight).toFixed(0))
  1096. _count2.push(val[4].biViewInfoList[i].count ? Number(val[4].biViewInfoList[i].count).toFixed(0) :
  1097. 0)
  1098. }
  1099. }
  1100. _xMax1 = Math.max(..._count1)
  1101. _xMax2 = Math.max(..._count2)
  1102. _max = _xMax1 > _xMax2 ? _xMax1 : _xMax2
  1103. console.log(_xMax1)
  1104. console.log(_xMax2)
  1105. // this.opts2.xAxis.max = Math.ceil(_max / 100) * 100
  1106. let _newMax = this.makeYData(_max)
  1107. console.log('max2', _newMax)
  1108. this.opts2.xAxis.max = _newMax
  1109. let res1 = {
  1110. categories: _categories,
  1111. series: [{
  1112. name: this.index == 1 ? '过去12个月累计签订数量' : '本季累计签订合同数量',
  1113. data: _count1,
  1114. legendShape: "circle",
  1115. textColor: "transparent"
  1116. },
  1117. {
  1118. name: this.index == 1 ? '当前执行中数量' : '本季执行中数量',
  1119. data: _count2,
  1120. legendShape: "circle",
  1121. textColor: "transparent"
  1122. }
  1123. ]
  1124. };
  1125. this.chartData1 = JSON.parse(JSON.stringify(res1));
  1126. },
  1127. makeDate3(val) {
  1128. let _max = 0
  1129. let _categorieslr = []
  1130. let _countlr = []
  1131. if (val[5].biViewInfoList.length > 0) {
  1132. for (let i = 0; i < val[5].biViewInfoList.length; i++) {
  1133. _categorieslr.push(val[5].biViewInfoList[i].name.substring(0, 2))
  1134. _countlr.push(val[5].biViewInfoList[i].weight ? val[5].biViewInfoList[i].weight : 0)
  1135. }
  1136. _max = Math.max(..._countlr)
  1137. } else {
  1138. this.isHaveData3 = false
  1139. }
  1140. let _newMax = this.makeYData(_max)
  1141. console.log('max3', _newMax)
  1142. this.opts3.yAxis.data[0].max = _newMax
  1143. //利润核算
  1144. let res3 = {
  1145. categories: _categorieslr,
  1146. series: [{
  1147. name: "利润金额",
  1148. data: _countlr
  1149. }]
  1150. };
  1151. this.chartData3 = JSON.parse(JSON.stringify(res3));
  1152. },
  1153. makeDate4(val, type) {
  1154. let _data = []
  1155. // 合计储量
  1156. let _count = 0
  1157. this.clList = []
  1158. if (type == 1) {
  1159. _data = val[14].biViewInfoList
  1160. } else {
  1161. _data = val[8].biViewInfoList
  1162. }
  1163. let _categorieslr = []
  1164. let _countlr = []
  1165. // this.clList =
  1166. let _weightList = []
  1167. let _maxWeight = ''
  1168. if (_data && _data.length > 0) {
  1169. for (let i = 0; i < _data.length; i++) {
  1170. _weightList.push(Number(_data.weight).toFixed(0) ? Number(_data[i]
  1171. .weight).toFixed(0) : 0)
  1172. }
  1173. _maxWeight = Math.max(..._weightList) + Math.max(..._weightList) * 0.05
  1174. for (let i = 0; i < _data.length; i++) {
  1175. console.log("_data", _data)
  1176. _count += _data[i].weight
  1177. let _obj = {
  1178. percent: Number(_data[i].weight).toFixed(0) / _maxWeight * 100,
  1179. name: _data[i].name,
  1180. weight: Number(_data[i].weight).toFixed(0)
  1181. }
  1182. console.log("库存储量", _obj)
  1183. this.clList.push(_obj)
  1184. }
  1185. }
  1186. let _tc = Number(_count) + Number(val[6].biViewInfoList[1].count) - Number(
  1187. val[6].biViewInfoList[2].count)
  1188. this.InventoryList = [{
  1189. name: '合计储量',
  1190. number: Number(_count).toFixed(3),
  1191. src: '../../static/img/cl.png'
  1192. }, {
  1193. name: '采购待执行',
  1194. number: Number(val[6].biViewInfoList[1].count).toFixed(3),
  1195. src: '../../static/img/cg.png'
  1196. },
  1197. {
  1198. name: '销待执行售',
  1199. number: Number(val[6].biViewInfoList[2].count).toFixed(3),
  1200. src: '../../static/img/xs.png'
  1201. },
  1202. {
  1203. name: '头寸',
  1204. number: Number(_tc).toFixed(3),
  1205. src: '../../static/img/tc.png'
  1206. },
  1207. ]
  1208. },
  1209. makeDate5(val) {
  1210. let _max = 0
  1211. let _categorieslr = []
  1212. let _count = []
  1213. let count = []
  1214. if (val[7].biViewInfoList && val[9].biViewInfoList.length > 0) {
  1215. for (let i = 0; i < val[9].biViewInfoList.length; i++) {
  1216. let _obj = {
  1217. value: Number(val[9].biViewInfoList[i].weight ? val[9].biViewInfoList[i].weight : 0)
  1218. .toFixed(
  1219. 0),
  1220. color: this.color[i]
  1221. }
  1222. _categorieslr.push(val[9].biViewInfoList[i].name)
  1223. _count.push(_obj)
  1224. count.push(Number(val[9].biViewInfoList[i].weight ? val[9].biViewInfoList[i].weight : 0))
  1225. }
  1226. _max = Math.max(...count)
  1227. }
  1228. let _newMax = this.makeYData(_max)
  1229. console.log('max5', _newMax)
  1230. this.opts5.yAxis.data[0].max = _newMax
  1231. // data: [{
  1232. // value: 10000,
  1233. // color: "#FFBB6E"
  1234. // },
  1235. // {
  1236. // value: 40000,
  1237. // color: "#8D9EE9"
  1238. // }, {
  1239. // value: 70000,
  1240. // color: "#FF8B95"
  1241. // }, {
  1242. // value: 90000,
  1243. // color: "#38CA80"
  1244. // },
  1245. // {
  1246. // value: 100000,
  1247. // color: "#FFDD85"
  1248. // }
  1249. // ]
  1250. let res5 = {
  1251. categories: _categorieslr,
  1252. series: [{
  1253. name: "货值(万元)",
  1254. data: _count
  1255. }]
  1256. };
  1257. this.chartData5 = JSON.parse(JSON.stringify(res5));
  1258. this.averageCostList = val[9].biViewInfoList
  1259. },
  1260. makeDate6(val) {
  1261. let _data = []
  1262. if (val[10].biViewInfoList && val[10].biViewInfoList.length > 0) {
  1263. for (let i = 0; i < val[10].biViewInfoList.length; i++) {
  1264. let _obj = {
  1265. name: val[10].biViewInfoList[i].name,
  1266. value: val[10].biViewInfoList[i].weight,
  1267. color: this.color[i],
  1268. style: {
  1269. 'background': this.color[i],
  1270. 'border-radius': '50%',
  1271. 'width': '20rpx',
  1272. 'height': '20rpx',
  1273. 'display': 'inline-block',
  1274. 'margin-right': '10rpx'
  1275. },
  1276. }
  1277. _data.push(_obj)
  1278. this.rkList = _data
  1279. }
  1280. }
  1281. let res6 = {
  1282. width: 200,
  1283. series: [{
  1284. data: _data
  1285. }]
  1286. };
  1287. this.chartData6 = JSON.parse(JSON.stringify(res6));
  1288. },
  1289. selectMakeDate7(val) {
  1290. console.log(11)
  1291. console.log(val)
  1292. this.chartData7.series = [];
  1293. let _data = []
  1294. this.ztList = []
  1295. for (let i = 0; i < val.biViewInfoList.length; i++) {
  1296. let _obj = {
  1297. name: val.biViewInfoList[i].name,
  1298. value: Number(val.biViewInfoList[i].count),
  1299. color: this.ztColor[i],
  1300. style: {
  1301. 'background': this.ztColor[i],
  1302. 'border-radius': '50%',
  1303. 'width': '20rpx',
  1304. 'height': '20rpx',
  1305. 'display': 'inline-block',
  1306. 'margin-right': '10rpx'
  1307. },
  1308. }
  1309. _data.push(_obj)
  1310. this.ztList = _data
  1311. }
  1312. console.log(_data)
  1313. let res7 = {
  1314. series: [{
  1315. data: _data
  1316. }]
  1317. };
  1318. this.chartData7 = JSON.parse(JSON.stringify(res7));
  1319. },
  1320. makeDate7(val) {
  1321. let _data = []
  1322. this.ztList = []
  1323. if (val[11].biViewInfoList && val[11].biViewInfoList.length) {
  1324. for (let i = 0; i < val[11].biViewInfoList.length; i++) {
  1325. let _obj = {
  1326. name: val[11].biViewInfoList[i].name,
  1327. value: Number(val[11].biViewInfoList[i].count),
  1328. color: this.ztColor[i],
  1329. style: {
  1330. 'background': this.ztColor[i],
  1331. 'border-radius': '50%',
  1332. 'width': '20rpx',
  1333. 'height': '20rpx',
  1334. 'display': 'inline-block',
  1335. 'margin-right': '10rpx'
  1336. },
  1337. }
  1338. _data.push(_obj)
  1339. this.ztList = _data
  1340. }
  1341. }
  1342. console.log(_data)
  1343. let res7 = {
  1344. series: [{
  1345. data: _data
  1346. }]
  1347. };
  1348. this.chartData7 = JSON.parse(JSON.stringify(res7));
  1349. },
  1350. makeDate8(val) {
  1351. let _categories = []
  1352. let _data = []
  1353. let _categories1 = []
  1354. let _data1 = []
  1355. this.appTotal = val[12].count
  1356. this.lmTotal = val[13].count
  1357. let _max1 = 0
  1358. let _max2 = 0
  1359. if (val[12].biViewInfoList && val[12].biViewInfoList.length) {
  1360. for (let i = 0; i < val[12].biViewInfoList.length; i++) {
  1361. _categories.push(new Date(val[12].biViewInfoList[i].name).getMonth() + 1 + '月')
  1362. _data.push(val[12].biViewInfoList[i].weight)
  1363. }
  1364. }
  1365. _max1 = Math.max(..._data)
  1366. if (val[13].biViewInfoList && val[13].biViewInfoList.length > 0) {
  1367. for (let i = 0; i < val[13].biViewInfoList.length; i++) {
  1368. _categories1.push(new Date(val[13].biViewInfoList[i].name).getMonth() + 1 + '月')
  1369. _data1.push(val[13].biViewInfoList[i].weight)
  1370. }
  1371. }
  1372. _max2 = Math.max(..._data1)
  1373. let _newMax1 = this.makeYData(_max1)
  1374. console.log('max8', _newMax1)
  1375. this.opts8.yAxis.data[0].max = _newMax1
  1376. let _newMax2 = this.makeYData(_max2)
  1377. console.log('max9', _newMax2)
  1378. this.opts9.yAxis.data[0].max = _newMax2
  1379. let res8 = {
  1380. categories: _categories,
  1381. series: [{
  1382. name: "成交量A",
  1383. data: _data,
  1384. // textColor: "transparent"
  1385. }]
  1386. }
  1387. let res9 = {
  1388. categories: _categories1,
  1389. series: [{
  1390. name: "成交量A",
  1391. data: _data1,
  1392. // textColor: "transparent"
  1393. }]
  1394. }
  1395. this.chartData8 = JSON.parse(JSON.stringify(res8))
  1396. this.chartData9 = JSON.parse(JSON.stringify(res9))
  1397. },
  1398. isShowChart(val, index) {
  1399. if (val.length == 0) {
  1400. return false
  1401. switch (index) {
  1402. case 3:
  1403. this.isHaveData3 = false
  1404. }
  1405. }
  1406. return true
  1407. },
  1408. getServerData() {
  1409. uni.showLoading({
  1410. title: "加载中",
  1411. mask: true
  1412. })
  1413. this.$api.doRequest('get', '/biInfoController/selectPhoneBiInfo?compId=' + uni.getStorageSync(
  1414. 'pcUserInfo')
  1415. .compId + '&seachMoth=' + this.seachMoth + '&seachYear=' + this.seachYear).then(
  1416. res => {
  1417. console.log("数据报表", res)
  1418. uni.hideLoading()
  1419. this.chartList = res.data.data
  1420. // 收支核算数据处理
  1421. this.makeDate1(res.data.data)
  1422. //合同数据
  1423. this.makeDate2(res.data.data)
  1424. //利润核算
  1425. this.makeDate3(res.data.data)
  1426. //库存储量
  1427. this.makeDate4(res.data.data)
  1428. //当期货值
  1429. this.makeDate5(res.data.data)
  1430. //今日入库
  1431. this.makeDate6(res.data.data)
  1432. //在途数据
  1433. this.makeDate7(res.data.data)
  1434. //APP注册
  1435. this.makeDate8(res.data.data)
  1436. // uni.hideLoading()
  1437. })
  1438. },
  1439. back() {
  1440. uni.navigateBack()
  1441. },
  1442. navClick(val) {
  1443. this.clList = []
  1444. this.index = val
  1445. if (val == 1) {
  1446. this.seachMoth = ''
  1447. } else {
  1448. this.seachMoth = '2022-10-10'
  1449. }
  1450. this.getServerData();
  1451. },
  1452. accounting(val) {
  1453. this.textIndex = val
  1454. if (val == 1) {
  1455. console.log("按月")
  1456. } else {
  1457. console.log("按年")
  1458. }
  1459. this.makeDate1(this.chartList)
  1460. }
  1461. }
  1462. }
  1463. </script>
  1464. <style scoped lang="scss">
  1465. .flex {
  1466. display: flex;
  1467. }
  1468. .alc {
  1469. align-items: center;
  1470. }
  1471. .jcse {
  1472. justify-content: space-evenly;
  1473. }
  1474. .jcsb {
  1475. justify-content: space-between;
  1476. }
  1477. .mtb40 {
  1478. margin: 40rpx 0;
  1479. }
  1480. .title-lv2 {
  1481. font-weight: bold;
  1482. color: #333333;
  1483. }
  1484. .status_bar {
  1485. height: var(--status-bar-height);
  1486. width: 100%;
  1487. }
  1488. .top-nav {
  1489. display: flex;
  1490. align-items: center;
  1491. justify-content: space-evenly;
  1492. position: fixed;
  1493. top: 0;
  1494. width: 100%;
  1495. z-index: 1;
  1496. }
  1497. .back {
  1498. position: absolute;
  1499. left: 20rpx;
  1500. top: 25%;
  1501. bottom: 0;
  1502. margin: auto;
  1503. }
  1504. .zd {
  1505. color: #969696;
  1506. margin-top: 20rpx;
  1507. justify-content: center;
  1508. }
  1509. .top-nav {
  1510. font-size: 36rpx;
  1511. background: white;
  1512. padding: 20rpx;
  1513. }
  1514. .nav-active {
  1515. font-weight: 700;
  1516. position: relative;
  1517. }
  1518. .nav-active:after {
  1519. content: "";
  1520. position: absolute;
  1521. bottom: -20rpx;
  1522. left: 0;
  1523. right: 0;
  1524. margin: auto;
  1525. height: 10rpx;
  1526. width: 60%;
  1527. background: #262626;
  1528. border-radius: 40rpx;
  1529. }
  1530. .content-item {
  1531. background: white;
  1532. margin: 20rpx 25rpx 0 25rpx;
  1533. border-radius: 20rpx;
  1534. padding: 20rpx;
  1535. box-sizing: border-box;
  1536. }
  1537. .title {
  1538. margin-bottom: 22rpx;
  1539. font-size: 32rpx;
  1540. font-weight: 700;
  1541. color: #343434;
  1542. }
  1543. .right-btn {
  1544. width: 120rpx;
  1545. height: 42rpx;
  1546. display: flex;
  1547. align-items: center;
  1548. justify-content: center;
  1549. background: #F1F1F1;
  1550. border-radius: 30px;
  1551. font-size: 22rpx;
  1552. color: #707575;
  1553. }
  1554. .content1 {
  1555. margin-top: 100rpx;
  1556. .content1-wrap {}
  1557. .row1 {
  1558. display: flex;
  1559. justify-content: space-between;
  1560. align-items: center;
  1561. .left {
  1562. color: #868686;
  1563. }
  1564. .text {
  1565. margin-left: 38rpx;
  1566. color: #2E303A;
  1567. height: 60rpx;
  1568. display: inline-block;
  1569. line-height: 60rpx;
  1570. padding: 0 26rpx;
  1571. }
  1572. .text-active {
  1573. // margin-left: 38rpx;
  1574. color: #FFF;
  1575. background: #2E303A;
  1576. // padding: 1rpx 26rpx;
  1577. height: 60rpx;
  1578. display: inline-block;
  1579. line-height: 60rpx;
  1580. padding: 0 26rpx;
  1581. border-radius: 10rpx;
  1582. }
  1583. }
  1584. .row2 {
  1585. display: flex;
  1586. flex-direction: column;
  1587. align-items: center;
  1588. .text {
  1589. color: #636363;
  1590. margin-bottom: 10rpx
  1591. }
  1592. .price {
  1593. font-size: 56rpx;
  1594. font-weight: 700;
  1595. color: #D79C58;
  1596. }
  1597. }
  1598. .row3 {
  1599. display: flex;
  1600. justify-content: space-between;
  1601. margin-top: 27rpx;
  1602. align-items: center;
  1603. .center {
  1604. width: 2px;
  1605. height: 61rpx;
  1606. border: 2rpx solid #EEEEEE;
  1607. }
  1608. .left,
  1609. .right {
  1610. // background: green;
  1611. width: calc(50% - 1px);
  1612. text-align: center;
  1613. .text {
  1614. color: #636363
  1615. }
  1616. .number {
  1617. margin-top: 12rpx;
  1618. font-size: 34rpx;
  1619. font-weight: 700;
  1620. color: #343434;
  1621. }
  1622. }
  1623. }
  1624. .row4 {
  1625. margin-top: 20rpx;
  1626. }
  1627. .row5 {
  1628. background: #F6F6F6;
  1629. border-radius: 8px;
  1630. padding: 16rpx 0;
  1631. box-sizing: border-box;
  1632. margin: 20rpx 0;
  1633. .left,
  1634. .right {
  1635. width: 50%;
  1636. text-align: center;
  1637. }
  1638. .point-left {
  1639. width: 11rpx;
  1640. height: 11rpx;
  1641. background: #E84A55;
  1642. display: inline-block;
  1643. border-radius: 50%;
  1644. margin: 6rpx;
  1645. }
  1646. .point-right {
  1647. width: 11rpx;
  1648. height: 11rpx;
  1649. background: #22C572;
  1650. display: inline-block;
  1651. border-radius: 50%;
  1652. margin: 6rpx;
  1653. }
  1654. .text-left {
  1655. color: #E84A55;
  1656. font-weight: 700;
  1657. }
  1658. .text-right {
  1659. color: #22C572;
  1660. font-weight: 700;
  1661. }
  1662. }
  1663. }
  1664. .content2 {
  1665. .row1 {}
  1666. .row2 {
  1667. color: #707575;
  1668. font-size: 22rpx;
  1669. .color1 {
  1670. width: 16rpx;
  1671. height: 12rpx;
  1672. background: #D2F3E2;
  1673. border-radius: 7rpx;
  1674. margin-right: 10rpx;
  1675. }
  1676. .color2 {
  1677. width: 16rpx;
  1678. height: 12rpx;
  1679. background: #2CC778;
  1680. border-radius: 7rpx;
  1681. margin-right: 10rpx;
  1682. }
  1683. }
  1684. .row3 {
  1685. position: relative;
  1686. top: -40rpx;
  1687. }
  1688. .row5 {
  1689. display: flex;
  1690. justify-content: space-between;
  1691. color: #9E9E9E;
  1692. margin-bottom: 20rpx;
  1693. .left {}
  1694. }
  1695. }
  1696. .content3 {
  1697. .btn {
  1698. display: flex;
  1699. font-size: 24rpx;
  1700. background: #F5F6FA;
  1701. padding: 8rpx;
  1702. border-radius: 10rpx;
  1703. width: 332rpx;
  1704. .btn-in {
  1705. text-align: center;
  1706. width: 400rpx;
  1707. padding: 10rpx 0;
  1708. }
  1709. .btn-active {
  1710. padding: 10rpx 0;
  1711. text-align: center;
  1712. width: 400rpx;
  1713. background: #fff;
  1714. font-weight: 700;
  1715. border-radius: 12rpx;
  1716. }
  1717. }
  1718. .right {
  1719. color: #9E9E9E;
  1720. }
  1721. .row2 {
  1722. .name {
  1723. color: #7A7A7A;
  1724. margin: 17rpx 0;
  1725. }
  1726. .bottom {
  1727. display: flex;
  1728. }
  1729. .left {
  1730. width: 80%;
  1731. }
  1732. .weight {
  1733. margin-left: 20rpx;
  1734. }
  1735. }
  1736. .row3 {
  1737. padding: 31rpx 25rpx 51rpx 25rpx;
  1738. border-radius: 15rpx;
  1739. margin-top: 31rpx;
  1740. background: #FAFAFA;
  1741. .list-item {
  1742. margin-top: 20rpx;
  1743. .number {
  1744. font-weight: 700;
  1745. }
  1746. }
  1747. }
  1748. .row7 {
  1749. .list-item {
  1750. font-size: 24rpx;
  1751. display: inline-block;
  1752. padding: 20rpx;
  1753. box-sizing: border-box;
  1754. background: #FAFAFA;
  1755. width: calc(50% - 40rpx);
  1756. margin: 20rpx;
  1757. border-radius: 8rpx;
  1758. }
  1759. }
  1760. }
  1761. .content4 {
  1762. .row1 {
  1763. display: flex;
  1764. .opts6 uni-canvas {
  1765. width: 200px;
  1766. }
  1767. }
  1768. }
  1769. .content5 {
  1770. .days-nav {
  1771. display: flex;
  1772. justify-content: space-evenly;
  1773. }
  1774. }
  1775. .zt-right {
  1776. flex-direction: column;
  1777. justify-content: space-evenly;
  1778. height: 100px;
  1779. display: flex;
  1780. width: 100%;
  1781. }
  1782. .content6 {
  1783. .row1 {
  1784. margin: 20rpx 0;
  1785. }
  1786. .left {
  1787. // font-weight: 700;
  1788. // margin
  1789. }
  1790. }
  1791. .days-nav {
  1792. margin: 20rpx;
  1793. background: #F5F6FA;
  1794. border-radius: 8rpx;
  1795. padding: 4rpx 0;
  1796. .item {
  1797. width: 33%;
  1798. display: flex;
  1799. justify-content: center;
  1800. padding: 6px 0;
  1801. }
  1802. .item-active {
  1803. background: #fff;
  1804. }
  1805. }
  1806. </style>