newReport.vue 48 KB

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