newReport.vue 45 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932
  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==1?"btn-active":""' @click="changeWeight(1)">
  181. 折算纯重
  182. </view>
  183. <view class="btn-in" :class='btnIndex==2?"btn-active":""' @click="changeWeight(2)">
  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>