reportDetail.vue 166 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901
  1. <template>
  2. <div>
  3. <div class="page_main">
  4. <div class="download_box">
  5. <el-button
  6. size="small"
  7. class="ml20"
  8. @click="exportClick()"
  9. >下载报告</el-button>
  10. </div>
  11. <div class="page_header">
  12. <p>{{projectName}}环境管理周报告</p>
  13. <p>
  14. <span style="font-size:16px;display:inherit;text-align:right;padding-top:10px">
  15. 总第{{totalReportCount}}期,{{moment(this.endDate).format("YYYY")}}年第{{yearReportNum}}期
  16. <span style="margin:0 20px;font-size:16px"> {{this.startDate&&moment(this.startDate).format("YYYY.MM.DD")}}-{{this.endDate&&moment(this.endDate).format("YYYY.MM.DD")}}</span>
  17. </span>
  18. </p>
  19. </div>
  20. <!-- start 环境概况 -->
  21. <section class="env_module title_one_table mb16">
  22. <div class="sj_title title_one">环境概况</div>
  23. <el-table
  24. class="sj_table"
  25. :data="surveyTable.slice(0,5)"
  26. :row-class-name="tableRowClassName"
  27. :header-cell-style="{background:'#3399ff !important',color:'#ffffff',padding:'10px 0'}"
  28. >
  29. <el-table-column
  30. align="left"
  31. label=""
  32. width="30"
  33. ></el-table-column>
  34. <el-table-column
  35. align="left"
  36. prop="name"
  37. label="环境参数"
  38. ></el-table-column>
  39. <el-table-column
  40. align="left"
  41. prop="weeknormalProprotion"
  42. label="周达标率"
  43. >
  44. <template slot-scope='{row}'>
  45. {{row.weeknormalProprotion+'%'}}
  46. </template>
  47. </el-table-column>
  48. <el-table-column
  49. align="left"
  50. prop="weekAvg"
  51. label="周平均"
  52. >
  53. <template slot-scope='{row}'>
  54. {{row.weekAvg+row.unit}}
  55. </template>
  56. </el-table-column>
  57. <el-table-column
  58. align="left"
  59. prop="assess"
  60. label="评价"
  61. ></el-table-column>
  62. </el-table>
  63. <div class="title_tips big_tips"><i class="el-icon-warning-outline"></i>数据来源:物联网传感器数据监测备份</div>
  64. <!-- 用户调节 -->
  65. <userAdjust
  66. :projectId="projectId"
  67. :energyDate="surveyTable[6]"
  68. :userAdjust="surveyTable[5]"
  69. class="mp40"
  70. />
  71. </section>
  72. <!-- end 环境概况 -->
  73. <!-- 3.0.0添加各种参数类型 -->
  74. <!-- start 本周环境温度概况 -->
  75. <section class="env_module mb16">
  76. <!--可切换参数 -->
  77. <Tabs
  78. type="card"
  79. :data="envTypelistnow"
  80. v-model="envType"
  81. class="daytabs"
  82. />
  83. <div class="sj_title">本周环境概况</div>
  84. <envSurvey
  85. :surveyTable="surveyTable[currentEnv]"
  86. :envType="envType"
  87. ></envSurvey>
  88. <!-- 根据参数显示内容 -->
  89. <div
  90. class="pm_container"
  91. v-if="envType=='PM2d5'"
  92. >
  93. <p>各PM2.5浓度区间累计时长及占比</p>
  94. <div class="pm_table">
  95. <div class="left">
  96. <div class="pm_chart">
  97. <ringChart
  98. :chartId="'pm_chart'+exportPdf"
  99. :color-arr="pmchartColor"
  100. :chart-date="pmDate"
  101. />
  102. </div>
  103. <div class="pm_count">总空间数量:<span>{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}}</span>个</div>
  104. <div class="title_tips"><i class="el-icon-warning-outline"></i>各评价标准累计时长一定程度上反映出当前建筑的整体PM2.5浓度所处的水平</div>
  105. </div>
  106. <div class="right">
  107. <el-table
  108. size="mini"
  109. :data="pmDate"
  110. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  111. >
  112. <el-table-column
  113. align="left"
  114. label=""
  115. width="30"
  116. ></el-table-column>
  117. <!--{assessStandard:"WELL铂金级",range:"0~15"}, -->
  118. <el-table-column
  119. align="left"
  120. prop="name"
  121. label="评价标准"
  122. ></el-table-column>
  123. <el-table-column
  124. align="left"
  125. prop="evaluationScope"
  126. label="范围(μg/m3)"
  127. ></el-table-column>
  128. <el-table-column
  129. align="left"
  130. label="周累计时长(h)"
  131. prop="accumulatedTime"
  132. ></el-table-column>
  133. <el-table-column
  134. align="left"
  135. label="时长占比(%)"
  136. prop="proportion"
  137. ></el-table-column>
  138. </el-table>
  139. </div>
  140. </div>
  141. </div>
  142. <div
  143. class="title_tips"
  144. v-if="envType=='Tdb'"
  145. ><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div>
  146. <div class="content_title mp40"><span>{{contentTitle(envType)}}</span></div>
  147. <div class="content_title_noline mb32">{{seccontentTitle(envType)}}</div>
  148. <chartLegend
  149. class="charttext_p"
  150. :legend-type="envType"
  151. :num-type="false"
  152. />
  153. <!-- 折线图 -->
  154. <lineChart
  155. v-if="!isUserorEngry(envType)"
  156. :chart-id="chartId"
  157. :chart-date="chartweekDate"
  158. :env-type="envType"
  159. :xType="dayType"
  160. />
  161. <!-- 柱状图 -->
  162. <barChart
  163. :numberChart="isUserorEngry(envType)"
  164. :chart-id="chartId+'1'"
  165. :key="envType"
  166. :chart-date="chartweekDate"
  167. :env-type="envType"
  168. :xType="dayType"
  169. />
  170. <!-- 服务空间数 -->
  171. <div
  172. class="room_table"
  173. v-if="!isUserorEngry(envType)"
  174. >
  175. <div class="room_table_number">
  176. <div>服务空间数(总:{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}})</div>
  177. <div>
  178. <div
  179. v-for="(item,index) in chartweekDate.daySpaceNum"
  180. :key="index"
  181. >
  182. {{item}}
  183. </div>
  184. </div>
  185. </div>
  186. </div>
  187. <div
  188. class="room_table room_table_user"
  189. v-if="envType==='userAdjust'"
  190. >
  191. <div class="room_table_number">
  192. <div>异常热调节</div>
  193. <div>
  194. <div
  195. v-for="(item,index) in chartweekDate.feedbackAbnorHotNum"
  196. :key="index"
  197. >
  198. {{item}}
  199. </div>
  200. </div>
  201. </div>
  202. <div
  203. class="room_table_number"
  204. :style="{'margin-top':0}"
  205. >
  206. <div>异常冷调节</div>
  207. <div>
  208. <div
  209. v-for="(item,index) in chartweekDate.feedbackAbnorColdNum"
  210. :key="index"
  211. >
  212. {{item}}
  213. </div>
  214. </div>
  215. </div>
  216. <div
  217. class="room_table_number"
  218. :style="{'margin-top':0}"
  219. >
  220. <div>吹风调节</div>
  221. <div>
  222. <div
  223. v-for="(item,index) in chartweekDate.feedbackNoisyHotNum"
  224. :key="index"
  225. >
  226. {{item}}
  227. </div>
  228. </div>
  229. </div>
  230. </div>
  231. <section v-if="envType=='Tdb'">
  232. <div class="content_title_noline mb40"><span>逐刻平均温度及达标空间数量变化趋势</span></div>
  233. <chartLegend
  234. class="charttext_p charttext_mt mb40"
  235. :num-type="false"
  236. />
  237. <lineChart
  238. :chart-id="chartId+'zhou'"
  239. :contant="true"
  240. :chart-date="chartweekTemp"
  241. :xType="hourType"
  242. />
  243. <barChart
  244. :chart-id="chartId+'zhou1'"
  245. :chart-date="chartweekTemp"
  246. :xType="hourType"
  247. />
  248. <!-- <div class="title_tips"><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div> -->
  249. </section>
  250. <div
  251. class="addmark"
  252. :key="envType+'11'"
  253. >
  254. <div
  255. class="remarkshow remark_input"
  256. title="点击即可编辑"
  257. v-if="!quarterRemarkEdit"
  258. @click="toRemarkedit('quarterRemark')"
  259. >{{quarterRemark[envType]}}</div>
  260. <section v-else>
  261. <el-input
  262. class="remark_input"
  263. type="textarea"
  264. :rows="2"
  265. v-model="quarterRemark[envType]"
  266. placeholder="添加备注"
  267. ></el-input>
  268. <el-button
  269. type="primary"
  270. size="small"
  271. @click="saveRemark('quarterRemark')"
  272. >保存</el-button>
  273. <el-button
  274. @click="cancelRemark('quarterRemark')"
  275. size="small"
  276. >取消</el-button>
  277. </section>
  278. </div>
  279. <div
  280. class="hcho_parame"
  281. v-if="envType=='HCHO'"
  282. >
  283. <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
  284. <el-table
  285. size="mini"
  286. :data="hchogirdDate"
  287. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  288. >
  289. <el-table-column
  290. label='序号'
  291. prop
  292. width='80'
  293. type='index'
  294. align="left"
  295. ></el-table-column>
  296. <el-table-column
  297. property="spaceName"
  298. width='130'
  299. label="空间名称"
  300. align="left"
  301. ></el-table-column>
  302. <el-table-column
  303. property="abnormalProprotion"
  304. width='130'
  305. label="超标率(%)"
  306. align="left"
  307. ></el-table-column>
  308. <el-table-column
  309. property="hchoAbnormalTime"
  310. width='130'
  311. label="超标时长(h)"
  312. align="left"
  313. ></el-table-column>
  314. <el-table-column
  315. property="hchoMaxSolubility"
  316. width='150'
  317. label="峰值浓度(mg/m³)"
  318. align="left"
  319. ></el-table-column>
  320. <el-table-column
  321. property="assess"
  322. width='130'
  323. label="峰值浓度评价"
  324. align="left"
  325. >
  326. <template slot-scope='{row}'>
  327. <span :style="{color:row.assess=='较高'?'#C6322B':'#1F2329'}">{{row.assess}}</span>
  328. </template>
  329. </el-table-column>
  330. <el-table-column
  331. label="解释"
  332. align="center"
  333. >
  334. <template slot-scope='{row}'>
  335. <el-input
  336. v-model="row.hchoRemark"
  337. size="small"
  338. maxlength="24"
  339. @blur="changeInput(row,'hcho')"
  340. ></el-input>
  341. </template>
  342. </el-table-column>
  343. </el-table>
  344. </div>
  345. <div
  346. class="co2_parame"
  347. v-if="envType=='CO2'"
  348. >
  349. <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
  350. <el-table
  351. size="mini"
  352. :data="co2girdDate"
  353. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  354. >
  355. <el-table-column
  356. label='序号'
  357. prop
  358. width='80'
  359. type='index'
  360. align="left"
  361. ></el-table-column>
  362. <el-table-column
  363. property="spaceName"
  364. width='130'
  365. label="空间名称"
  366. align="left"
  367. ></el-table-column>
  368. <el-table-column
  369. property="abnormalProprotion"
  370. width='130'
  371. label="超标率(%)"
  372. align="left"
  373. ></el-table-column>
  374. <el-table-column
  375. property="co2AbnormalTime"
  376. width='130'
  377. label="超标时长(h)"
  378. align="left"
  379. ></el-table-column>
  380. <el-table-column
  381. property="co2MaxSolubility"
  382. width='150'
  383. label="峰值浓度(ppm)"
  384. align="left"
  385. ></el-table-column>
  386. <el-table-column
  387. property="assess"
  388. width='130'
  389. label="峰值浓度评价"
  390. align="left"
  391. >
  392. <template slot-scope='{row}'>
  393. <span :style="{color:row.assess=='较高'?'#DCAA04':'#1F2329'}">{{row.assess}}</span>
  394. </template>
  395. </el-table-column>
  396. <el-table-column
  397. label="解释"
  398. align="center"
  399. >
  400. <template slot-scope='{row}'>
  401. <el-input
  402. v-model="row.co2Remark"
  403. size="small"
  404. maxlength="24"
  405. @blur="changeInput(row,'co2')"
  406. ></el-input>
  407. </template>
  408. </el-table-column>
  409. </el-table>
  410. <div class="content_title_noline mp40 mb16">参数释义</div>
  411. <ul class="paramlist ft12">
  412. <li>
  413. <p><span><b>CO₂:</b>通常作为建筑空间新风是否充足的量化参数</span></p>
  414. <div>
  415. <el-table
  416. class="co2table ft12"
  417. :data="co2Date"
  418. border
  419. :header-cell-style="{background:'#ffffff!important',color:'#606266',padding:'6px 0'}"
  420. >
  421. <!-- <el-table-column width="30"></el-table-column> -->
  422. <el-table-column
  423. label="序号"
  424. type="index"
  425. width="60"
  426. align="left"
  427. ></el-table-column>
  428. <el-table-column
  429. label="CO₂浓度区间"
  430. prop="area"
  431. align="left"
  432. width="150"
  433. ></el-table-column>
  434. <el-table-column
  435. label="评价"
  436. prop="assess"
  437. align="left"
  438. width="200"
  439. ></el-table-column>
  440. <el-table-column
  441. label="环境感受"
  442. prop="feel"
  443. align="left"
  444. ></el-table-column>
  445. </el-table>
  446. <div class="title_tips"><i class="el-icon-warning-outline"></i>室外新鲜空气一般在 400~500ppm</div>
  447. </div>
  448. </li>
  449. </ul>
  450. </div>
  451. <div
  452. class="rh_parame"
  453. v-if="envType=='RH'"
  454. >
  455. <div class="content_title_noline mp40 mb16">参数解释</div>
  456. <ul class="paramlist ft12">
  457. <li>
  458. <p><i></i><span><b>相对湿度</b></span></p>
  459. <div style="margin-top:8px">评价空气中的水蒸气的相对含量</div>
  460. </li>
  461. <li>
  462. <p><i></i><span><b>舒适范围</b></span></p>
  463. <div>
  464. <div class="hum_list">
  465. <div><span>供暖季</span>30%~60%</div>
  466. <div><span>供冷季</span>40%~60%</div>
  467. <div><span>过渡季</span>30%~60%</div>
  468. </div>
  469. </div>
  470. </li>
  471. <li>
  472. <p><i></i><span><b>参数评价</b></span></p>
  473. <p class="rh_img"><img
  474. src="../../../../static/images/hot.png"
  475. alt=""
  476. />干燥:低于上述区间 </p>
  477. <p class="rh_img"><img
  478. src="../../../../static/images/cold.png"
  479. alt=""
  480. />偏湿:高于上述区间 </p>
  481. </li>
  482. <li>
  483. <p><i></i><span><b>相对湿度的影响</b><br></span></p>
  484. <div style="margin-top:8px">
  485. 高湿度可促进微生物病原体(如细菌、尘螨和霉菌)的聚集和生长,同时湿度过高可能会增加建筑材料释放气体:相对湿度增加 35%可使甲醛释放量增加 1.8-2.6 倍。 低湿度会导致气道、皮肤、眼 睛、咽喉和粘膜的干燥和刺激。也与病毒较长的存活率有关(活性失去较慢)
  486. </div>
  487. </li>
  488. </ul>
  489. </div>
  490. <div
  491. class="pm_parame"
  492. v-if="envType=='PM2d5'"
  493. >
  494. <div class="content_title_noline mp40 mb16"><span>参数释义</span></div>
  495. <ul class="paramlist ft12">
  496. <li>
  497. <p><i></i><span><b>PM2.5简介</b><br>大气中空气动力学当量直径小于或等于 2.5 微米的颗粒物,也称为可入肺颗粒物;</span></p>
  498. </li>
  499. <li>
  500. <p><i></i><span><b>达标率</b><br>参数良好级别及以上,浓度≤75 μg/m3;超出此数值记为超限。</span></p>
  501. </li>
  502. <li>
  503. <p><i></i><span>WELL标准中,对不同PM2.5浓度所在区间所能申请的标准(铂金级、金级、银级),均有对应的先决条件。如:在 PM2.5 浓度为 20μg/m3,最高只能达到 WELL 金级标准。</span></p>
  504. </li>
  505. </ul>
  506. </div>
  507. <div
  508. class="ad_parame"
  509. v-if="envType=='userAdjust'"
  510. >
  511. <div class="content_title_noline mp40 mb16"><span>解释说明</span>:用户异常反馈的几种情况</div>
  512. <ul class="paramlist ft12">
  513. <li>
  514. <p><i></i><span><b>环境温度高,用户反馈“热”</b></span></p>
  515. </li>
  516. <li>
  517. <p><i></i><span><b>用户2次反馈“热”</b></span></p>
  518. </li>
  519. <li>
  520. <p><i></i><span><b>用户1次反馈“吹风”</b></span></p>
  521. </li>
  522. <li>
  523. <p><i></i><span><b>环境温度低,用户反馈“冷”</b></span></p>
  524. </li>
  525. <li>
  526. <p><i></i><span><b>用户2次反馈“冷”</b></span></p>
  527. </li>
  528. <li>
  529. <p><span><b>用户通过app(小程序)调节空调,反馈冷热</b></span></p>
  530. </li>
  531. </ul>
  532. </div>
  533. <!-- start 环境温度分析 -->
  534. <section
  535. class="mb16"
  536. v-if="envType=='Tdb'"
  537. >
  538. <div class="content_title"><span>环境温度分析(空间维度)</span></div>
  539. <div class="sj_reminder mb32">
  540. <p>温馨提示:</p>
  541. <p>1.空间划分维度:内外区、朝向、楼层、新风机组各自服务的空间四个维度,分别进行周不达标率分析计算。</p>
  542. <p>2.数据表:每个空间划分维度均有对应的空间数量。</p>
  543. <p>3.朝向维度仅外区空间,其中内区空间无朝向。</p>
  544. </div>
  545. <div class="sj_chartbox">
  546. <div class="pr65">
  547. <div class="day_title mb32">内、外区</div>
  548. <barChart
  549. :chart-id="'echart_left_out'"
  550. :chart-date="localtionDate.regionsChart"
  551. :sjChartType="'regions'"
  552. class="daychart"
  553. />
  554. <div class="chart_sj_bottom mb40">
  555. <div>空间数量</div>
  556. <div class="chart_sj_bottom_main">
  557. <div
  558. v-for="(item,index) in localtionDate.regionsChart.spaceNum"
  559. :key="index"
  560. >{{item}}</div>
  561. </div>
  562. </div>
  563. </div>
  564. <div>
  565. <div class="day_title mb32">各个朝向
  566. <chartLegend
  567. :avgTemp="false"
  568. class="charttext"
  569. />
  570. </div>
  571. <barChart
  572. :chart-id="'echart_left_orientation'"
  573. :chart-date="localtionDate.orientationChart"
  574. :sjChartType="'orientation'"
  575. class="daychart"
  576. />
  577. <div class="chart_sj_bottom mb40">
  578. <div class="twoline">空间数量</div>
  579. <div class="chart_sj_bottom_main">
  580. <div
  581. v-for="(item,index) in localtionDate.orientationChart.spaceNum"
  582. :key="index"
  583. >{{item}}</div>
  584. </div>
  585. </div>
  586. </div>
  587. </div>
  588. <div class="sj_chartbox">
  589. <div class="pr65">
  590. <div class="day_title mb32">各个楼层</div>
  591. <barChart
  592. :chart-id="'echart_left_floor'"
  593. :chart-date="localtionDate.floorChart"
  594. :sjChartType="'localtion'"
  595. class="daychart"
  596. />
  597. <div class="chart_sj_bottom">
  598. <div class="twoline">空间数量</div>
  599. <div class="chart_sj_bottom_main">
  600. <div
  601. v-for="(item,index) in localtionDate.floorChart.spaceNum"
  602. :key="index"
  603. >{{item}}</div>
  604. </div>
  605. </div>
  606. </div>
  607. <div>
  608. <!-- <div class="day_title mb32">新风机组服务的空间</div>
  609. <barChart :chart-id="'echart_left_unit'" :chart-date="localtionDate.freshAirChart" :sjChartType="'freshAir'" class="daychart"/>
  610. <div class="chart_sj_bottom">
  611. <div class="twoline">空间数量</div>
  612. <div class="chart_sj_bottom_main">
  613. <div v-for="(item,index) in localtionDate.freshAirChart.spaceNum" :key="index">{{item}}</div>
  614. </div>
  615. </div> -->
  616. </div>
  617. </div>
  618. <div class="addmark">
  619. <div
  620. class="remarkshow remark_input"
  621. title="点击即可编辑"
  622. v-if="!typeRemarkEdit"
  623. @click="toRemarkedit('typeRemark')"
  624. >{{typeRemark}}</div>
  625. <section v-else>
  626. <el-input
  627. class="remark_input"
  628. type="textarea"
  629. :rows="2"
  630. v-model="typeRemark"
  631. placeholder="添加备注"
  632. ></el-input>
  633. <el-button
  634. type="primary"
  635. size="small"
  636. @click="saveRemark('typeRemark')"
  637. >保存</el-button>
  638. <el-button
  639. @click="cancelRemark('typeRemark')"
  640. size="small"
  641. >取消</el-button>
  642. </section>
  643. </div>
  644. </section>
  645. <!-- end 环境温度分析 -->
  646. <!-- start 各达标区间空间数量分布及异常冷热空间列表 -->
  647. <section
  648. class="mb16"
  649. v-show="envType=='Tdb'"
  650. >
  651. <div class="content_title"><span>各达标区间空间数量分布及异常冷热空间列表</span></div>
  652. <div class="content_title_noline mb16">各达标区间空间数量分布</div>
  653. <div class="up_distribution">
  654. <div class="up_distribution_text"><span></span>达标率偏低,亟待解决</div>
  655. <barChart
  656. :chart-id="'echart_left_week'"
  657. :chart-date="StandardList"
  658. :weekNormalChart="true"
  659. :y-type="yType"
  660. class="daychart"
  661. />
  662. </div>
  663. <div class="title_tips mb52"></div>
  664. <div class="content_body">
  665. <div class="body_title"><span>偏热空间</span><span class="tabletag taghot">偏热</span></div>
  666. <el-table
  667. size="mini"
  668. :data="hotgirdDate"
  669. :height="520"
  670. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  671. >
  672. <el-table-column
  673. label='序号'
  674. prop
  675. width='80'
  676. type='index'
  677. align="left"
  678. ></el-table-column>
  679. <el-table-column
  680. property="spaceName"
  681. width='130'
  682. label="空间名称"
  683. align="left"
  684. ></el-table-column>
  685. <el-table-column
  686. property="avgTemp"
  687. width='100'
  688. label="周均温度(°C)"
  689. align="left"
  690. ></el-table-column>
  691. <el-table-column
  692. property="hotProprotion"
  693. width='120'
  694. label="周偏热不达标(%)"
  695. align="left"
  696. ></el-table-column>
  697. <el-table-column
  698. property="serviceTime"
  699. width='110'
  700. label="周服务时长(h)"
  701. align="left"
  702. ></el-table-column>
  703. <el-table-column
  704. property="validProprotion"
  705. width='110'
  706. label="周有效数据(%)"
  707. align="left"
  708. ></el-table-column>
  709. <el-table-column
  710. property="hotNum"
  711. width='120'
  712. label="周累计热反馈数"
  713. align="left"
  714. ></el-table-column>
  715. <el-table-column
  716. label="解释"
  717. align="center"
  718. >
  719. <template slot-scope='{row}'>
  720. <el-input
  721. v-model="row.hotRemark"
  722. size="small"
  723. maxlength="24"
  724. @blur="changeInput(row,'hot')"
  725. ></el-input>
  726. </template>
  727. </el-table-column>
  728. </el-table>
  729. <div class="body_title body_coldtitle"><span>偏冷空间</span><span class="tabletag tagclod">偏冷</span></div>
  730. <el-table
  731. size="mini"
  732. :data="coldgirdDate"
  733. :height="520"
  734. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  735. >
  736. <el-table-column
  737. label='序号'
  738. prop
  739. width='80'
  740. type='index'
  741. align="left"
  742. ></el-table-column>
  743. <el-table-column
  744. property="spaceName"
  745. width='130'
  746. label="空间名称"
  747. align="left"
  748. ></el-table-column>
  749. <el-table-column
  750. property="avgTemp"
  751. width='100'
  752. label="周均温度(°C)"
  753. align="left"
  754. ></el-table-column>
  755. <el-table-column
  756. property="coldProprotion"
  757. width='120'
  758. label="周偏冷不达标(%)"
  759. align="left"
  760. ></el-table-column>
  761. <el-table-column
  762. property="serviceTime"
  763. width='110'
  764. label="周服务时长(h)"
  765. align="left"
  766. ></el-table-column>
  767. <el-table-column
  768. property="validProprotion"
  769. width='110'
  770. label="周有效数据(%)"
  771. align="left"
  772. ></el-table-column>
  773. <el-table-column
  774. property="coldNum"
  775. width='120'
  776. label="周累计冷反馈数"
  777. align="left"
  778. ></el-table-column>
  779. <el-table-column
  780. label="解释"
  781. align="center"
  782. >
  783. <template slot-scope='{row}'>
  784. <el-input
  785. v-model="row.coldRemark"
  786. maxlength="24"
  787. size="small"
  788. @blur="changeInput(row,'cold')"
  789. ></el-input>
  790. </template>
  791. </el-table-column>
  792. </el-table>
  793. </div>
  794. </section>
  795. <!-- end 各达标区间空间数量分布及异常冷热空间列表 -->
  796. <!-- start 每日环境详情 -->
  797. <section
  798. class="mb16"
  799. v-show="envType=='Tdb'"
  800. >
  801. <div class="content_title"><span>每日环境详情</span></div>
  802. <Tabs
  803. type="card"
  804. :data="dayData"
  805. v-model="tableItem"
  806. class="daytabs"
  807. />
  808. <div v-if="dataDeal">
  809. <div
  810. class="pageitem_box"
  811. v-for="(item,index) in daysDateCurrent"
  812. :key="index"
  813. :id="'list'+item.name"
  814. >
  815. <!-- <div class="content_title"><span>每日环境详情(周{{item.pname}})</span></div> -->
  816. <div class="content_body">
  817. <div class="day_title oneday_title">逐刻平均温度及达标空间数量变化趋势</div>
  818. <chartLegend
  819. class="charttext"
  820. :dot-line="true"
  821. />
  822. <lineChart
  823. :chart-id="'echart_top'+item.name"
  824. :chart-date="item.chartDate"
  825. :contant="true"
  826. :xType="hourType"
  827. />
  828. <barChart
  829. :chart-id="'echart_bottom'+item.name"
  830. :chart-date="item.chartDate"
  831. :numberChart="true"
  832. :x-type="hourType"
  833. :y-type="yType"
  834. />
  835. <div class="room_table">
  836. <div class="room_table_number">
  837. <div>室外温度(°C)</div>
  838. <div>
  839. <div
  840. v-for="(items,sgin) in item.chartDate.outSideTemp"
  841. :key="sgin"
  842. >
  843. {{items}}
  844. </div>
  845. </div>
  846. </div>
  847. </div>
  848. <div class="twochart_box">
  849. <div>
  850. <div class="day_title">各房间日均温度分布</div>
  851. <barChart
  852. :chart-id="'echart_left'+item.name"
  853. :temp-color="true"
  854. :chart-date="item.chartDateLeft"
  855. :normalChart="true"
  856. :y-type="yType"
  857. class="daychart"
  858. />
  859. </div>
  860. <div>
  861. <div class="day_title">各楼层日均温及偏冷(热)空间数量</div>
  862. <lineChart
  863. :x-type="floorType"
  864. :chart-id="'echart_righttop'+item.name"
  865. :chart-date="item.chartDateRight"
  866. :contant="true"
  867. class="daylinechart"
  868. />
  869. <barChart
  870. :chart-id="'echart_rightbottom'+item.name"
  871. :x-type="floorType"
  872. :y-type="yType"
  873. :numberChart="true"
  874. :chart-date="item.chartDateRight"
  875. class="daybarchart"
  876. />
  877. </div>
  878. </div>
  879. </div>
  880. </div>
  881. </div>
  882. </section>
  883. <!-- end 每日环境详情 -->
  884. <!-- start 用户及名词解释 -->
  885. <section
  886. class="mb16"
  887. v-show="envType=='Tdb'"
  888. >
  889. <div class="content_title"><span>用户活跃度统计(周)</span></div>
  890. <div class="user_total">
  891. <div v-if="projectId!=='Pj1101020002'">
  892. <div>用户总数量</div>
  893. <div><span>{{userDate.userRegistNum}}</span>人</div>
  894. </div>
  895. <div v-if="projectId!=='Pj1101020002'">
  896. <div>周活跃用户数量</div>
  897. <div><span>{{userDate.userActiveNum}}</span>人</div>
  898. </div>
  899. <div>
  900. <div>用户与系统互动数量</div>
  901. <div><span>{{userDate.userSysNum}}</span>次</div>
  902. </div>
  903. <div>
  904. <div>用户问题反馈数量</div>
  905. <div><span>{{userDate.UserFbNum}}</span>条</div>
  906. </div>
  907. <div>
  908. <div>帮用户解决问题</div>
  909. <div><span>{{userDate.solveFbNum}}</span>条</div>
  910. </div>
  911. </div>
  912. <div class="content_title"><span>环境管理周报数据解释</span></div>
  913. <section>
  914. <div class="content_title_noline mb16">名词解释</div>
  915. <ul class="paramlist ft12">
  916. <li
  917. v-for="(item,index) in expTerms"
  918. :key="index"
  919. >
  920. <p><i></i><span><b>{{item.name}}:</b>{{item.content}}。</span></p>
  921. </li>
  922. </ul>
  923. </section>
  924. <section>
  925. <div class="content_title_noline mb16">计算说明</div>
  926. <ul class="paramlist paramlist_explain ft12">
  927. <li>
  928. <p><i></i><span><b>温度评价</b></span></p>
  929. <p>“偏冷”、“舒适”、“偏热”。以平均温度的不同区间对应,区间对应如下:</p>
  930. <div>
  931. <div class="hum_list">
  932. <div><img
  933. src="../../../../static/images/cold.png"
  934. alt=""
  935. srcset=""
  936. /> &ensp;偏冷 &nbsp;&nbsp;&nbsp; 平均温度&lt;20°C</div>
  937. <div><img
  938. src="../../../../static/images/happy.png"
  939. alt=""
  940. srcset=""
  941. /> &ensp;舒适 &nbsp;&nbsp;&nbsp;平均温度 20°C~25°C</div>
  942. <div><img
  943. src="../../../../static/images/hot.png"
  944. alt=""
  945. srcset=""
  946. /> &ensp;偏热 &nbsp;&nbsp;&nbsp;平均温度&gt;25°C</div>
  947. </div>
  948. </div>
  949. </li>
  950. <li>
  951. <p><i></i><span><b>周达标率计算</b></span></p>
  952. <div class="ml17">
  953. <p>单个空间当前时刻是否达标的判断方法:min(当前时刻服务定制温度下限,合同约定 温度范围下限)&lt;当前环境温度&lt;max(当前时刻服务定制温度上限,合同约定温度范 围上限),满足上述区间内,视为达标;</p>
  954. <p>低于区间,视为偏冷;</p>
  955. <p>高于区间,视为偏热。</p>
  956. </div>
  957. <p class="ml17">所有空间一周时间达标率的判断方法:所有空间所有存在空调服务的累计时间中,判断为达标的时间占比,即周达标率。</p>
  958. <p class="ml17">偏冷(热)率的计算如上。</p>
  959. </li>
  960. </ul>
  961. </section>
  962. <section>
  963. <div class="content_title_noline mb16">合约与管控时间段</div>
  964. <el-table
  965. class="sj_table ft12"
  966. :data="custormList"
  967. :header-cell-style="{background:'#F8F9FA!important',padding:'6px 0'}"
  968. >
  969. <el-table-column
  970. align="left"
  971. width="40"
  972. ></el-table-column>
  973. <el-table-column
  974. align="left"
  975. prop="objectName"
  976. label="空间组"
  977. ></el-table-column>
  978. <el-table-column
  979. align="left"
  980. label="合同约定温度达标区间"
  981. >
  982. <template slot-scope='{row}'>
  983. {{row.minValue}}~{{row.maxValue}}
  984. </template>
  985. </el-table-column>
  986. <el-table-column
  987. align="left"
  988. label="环境保障时间段(工作日)"
  989. >
  990. <template slot-scope='{row}'>
  991. {{row.startTime&&(row.startTime.slice(0,2)+':'+row.startTime.slice(2,4))}}~{{row.endTime&&(row.endTime.slice(0,2)+':'+row.endTime.slice(2,4))}}
  992. </template>
  993. </el-table-column>
  994. <el-table-column
  995. align="left"
  996. prop="dayType"
  997. label="环境保障时间段(周末)"
  998. ></el-table-column>
  999. </el-table>
  1000. </section>
  1001. </section>
  1002. <!-- end 用户及名词解释 -->
  1003. </section>
  1004. <!-- end 本周环境温度概况 -->
  1005. </div>
  1006. <!-- 下载的页面 -->
  1007. <div
  1008. class="page_main"
  1009. id="exportPdf"
  1010. >
  1011. <div class="page_header">
  1012. <p>{{projectName}}环境管理周报告</p>
  1013. <p>
  1014. <span style="font-size:16px;display:inherit;text-align:right;padding-top:10px">
  1015. 总第{{totalReportCount}}期,{{moment(this.endDate).format("YYYY")}}年第{{yearReportNum}}期
  1016. <span style="margin:0 20px;font-size:16px"> {{this.startDate&&moment(this.startDate).format("YYYY.MM.DD")}}-{{this.endDate&&moment(this.endDate).format("YYYY.MM.DD")}}</span>
  1017. </span>
  1018. </p>
  1019. </div>
  1020. <!-- start 环境概况 -->
  1021. <section class="env_module title_one_table mb690">
  1022. <div class="sj_title title_one">环境概况</div>
  1023. <el-table
  1024. class="sj_table"
  1025. :data="surveyTable.slice(0,5)"
  1026. :row-class-name="tableRowClassName"
  1027. :header-cell-style="{background:'#3399ff !important',color:'#ffffff',padding:'10px 0'}"
  1028. >
  1029. <el-table-column
  1030. align="left"
  1031. label=""
  1032. width="30"
  1033. ></el-table-column>
  1034. <el-table-column
  1035. align="left"
  1036. prop="name"
  1037. label="环境参数"
  1038. ></el-table-column>
  1039. <el-table-column
  1040. align="left"
  1041. prop="weeknormalProprotion"
  1042. label="周达标率"
  1043. >
  1044. <template slot-scope='{row}'>
  1045. {{row.weeknormalProprotion+'%'}}
  1046. </template>
  1047. </el-table-column>
  1048. <el-table-column
  1049. align="left"
  1050. prop="weekAvg"
  1051. label="周平均"
  1052. >
  1053. <template slot-scope='{row}'>
  1054. {{row.weekAvg+row.unit}}
  1055. </template>
  1056. </el-table-column>
  1057. <el-table-column
  1058. align="left"
  1059. prop="assess"
  1060. label="评价"
  1061. ></el-table-column>
  1062. </el-table>
  1063. <div class="title_tips big_tips"><i class="el-icon-warning-outline"></i>数据来源:物联网传感器数据监测备份</div>
  1064. <!-- 用户调节 -->
  1065. <userAdjust
  1066. :projectId="projectId"
  1067. :energyDate="surveyTable[6]"
  1068. :userAdjust="surveyTable[5]"
  1069. class="mp40"
  1070. />
  1071. </section>
  1072. <!-- end 环境概况 -->
  1073. <!-- start 本周环境温度概况 -->
  1074. <!-- 循环生成环境参数 -->
  1075. <section
  1076. class="env_module"
  1077. :class="'mb'+mbList[index]"
  1078. v-for="(item,index) in surveyTablenow"
  1079. :key="index"
  1080. >
  1081. <div class="sj_title">{{item.name}}概况</div>
  1082. <envSurvey
  1083. :surveyTable="item"
  1084. :envType="item.id"
  1085. :pdf-id="item.id"
  1086. ></envSurvey>
  1087. <div
  1088. class="pm_container"
  1089. v-if="item.id=='PM2d5'&&pdfPmDateShow"
  1090. >
  1091. <p>各PM2.5浓度区间累计时长及占比</p>
  1092. <div class="pm_table">
  1093. <div class="left">
  1094. <div class="pm_chart">
  1095. <ringChart
  1096. :chartId="'pm_chart1'+exportPdf+item.id"
  1097. :color-arr="pmchartColor"
  1098. :chart-date="pmDate"
  1099. />
  1100. </div>
  1101. <div class="pm_count">总空间数量:<span>{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}}</span>个</div>
  1102. <div class="title_tips"><i class="el-icon-warning-outline"></i>各评价标准累计时长一定程度上反映出当前建筑的整体PM2.5浓度所处的水平</div>
  1103. </div>
  1104. <div class="right">
  1105. <el-table
  1106. size="mini"
  1107. :data="pmDate"
  1108. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  1109. >
  1110. <el-table-column
  1111. align="left"
  1112. label=""
  1113. width="30"
  1114. ></el-table-column>
  1115. <!--{assessStandard:"WELL铂金级",range:"0~15"}, -->
  1116. <el-table-column
  1117. align="left"
  1118. prop="name"
  1119. label="评价标准"
  1120. ></el-table-column>
  1121. <el-table-column
  1122. align="left"
  1123. prop="evaluationScope"
  1124. label="范围(μg/m3)"
  1125. ></el-table-column>
  1126. <el-table-column
  1127. align="left"
  1128. label="周累计时长(h)"
  1129. prop="accumulatedTime"
  1130. ></el-table-column>
  1131. <el-table-column
  1132. align="left"
  1133. label="时长占比(%)"
  1134. prop="proportion"
  1135. ></el-table-column>
  1136. </el-table>
  1137. </div>
  1138. </div>
  1139. </div>
  1140. <div
  1141. class="title_tips"
  1142. v-if="item.id=='Tdb'"
  1143. ><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div>
  1144. <div
  1145. v-if="item.id!=='Tdb'"
  1146. style="height:20px"
  1147. ></div>
  1148. <div class="content_title mp40"><span>{{contentTitle(item.id)}}</span></div>
  1149. <div class="content_title_noline mb32">{{seccontentTitle(item.id)}}</div>
  1150. <chartLegend
  1151. class="charttext_p"
  1152. :legend-type="item.id"
  1153. :num-type="false"
  1154. />
  1155. <!-- 折线图 -->
  1156. <lineChart
  1157. v-if="!isUserorEngry(item.id)"
  1158. :chart-id="chartId+item.id"
  1159. :chart-date="chartweekDate"
  1160. :env-type="item.id"
  1161. :xType="dayType"
  1162. />
  1163. <!-- 柱状图 -->
  1164. <barChart
  1165. :numberChart="isUserorEngry(item.id)"
  1166. :chart-id="chartId+item.id+'1'"
  1167. :key="item.id"
  1168. :chart-date="chartweekDate"
  1169. :env-type="item.id"
  1170. :xType="dayType"
  1171. />
  1172. <!-- 服务空间数 -->
  1173. <div
  1174. class="room_table"
  1175. v-if="!isUserorEngry(item.id)"
  1176. >
  1177. <div class="room_table_number">
  1178. <div>服务空间数(总:{{chartweekDate.registeredSpaceNum&&chartweekDate.registeredSpaceNum.filter(Boolean)[0]}})</div>
  1179. <div>
  1180. <div
  1181. v-for="(item,index) in chartweekDate.daySpaceNum"
  1182. :key="index"
  1183. >
  1184. {{item}}
  1185. </div>
  1186. </div>
  1187. </div>
  1188. </div>
  1189. <div
  1190. class="room_table room_table_user"
  1191. v-if="item.id==='userAdjust'"
  1192. >
  1193. <div class="room_table_number">
  1194. <div>异常热调节</div>
  1195. <div>
  1196. <div
  1197. v-for="(item,index) in chartweekDate.feedbackAbnorHotNum"
  1198. :key="index"
  1199. >
  1200. {{item}}
  1201. </div>
  1202. </div>
  1203. </div>
  1204. <div
  1205. class="room_table_number"
  1206. :style="{'margin-top':0}"
  1207. >
  1208. <div>异常冷调节</div>
  1209. <div>
  1210. <div
  1211. v-for="(item,index) in chartweekDate.feedbackAbnorColdNum"
  1212. :key="index"
  1213. >
  1214. {{item}}
  1215. </div>
  1216. </div>
  1217. </div>
  1218. <div
  1219. class="room_table_number"
  1220. :style="{'margin-top':0}"
  1221. >
  1222. <div>吹风调节</div>
  1223. <div>
  1224. <div
  1225. v-for="(item,index) in chartweekDate.feedbackNoisyHotNum"
  1226. :key="index"
  1227. >
  1228. {{item}}
  1229. </div>
  1230. </div>
  1231. </div>
  1232. </div>
  1233. <section v-if="item.id=='Tdb'">
  1234. <div class="content_title_noline mb40"><span>逐刻平均温度及达标空间数量变化趋势</span></div>
  1235. <chartLegend
  1236. class="charttext_p charttext_mt mb40"
  1237. :num-type="false"
  1238. />
  1239. <lineChart
  1240. :chart-id="chartId+'zhou'+item.id"
  1241. :contant="true"
  1242. :chart-date="chartweekTemp"
  1243. :xType="hourType"
  1244. />
  1245. <barChart
  1246. :chart-id="chartId+'zhou1'+item.id"
  1247. :chart-date="chartweekTemp"
  1248. :xType="hourType"
  1249. />
  1250. <!-- <div class="title_tips"><i class="el-icon-warning-outline"></i>评价标准、达标标准、计算方法见数据解释</div> -->
  1251. </section>
  1252. <div class="addmark">
  1253. <div class="remarkshow remark_input">{{quarterRemark[item.id]}}</div>
  1254. </div>
  1255. <div
  1256. class="hcho_parame"
  1257. v-if="item.id=='HCHO'"
  1258. >
  1259. <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
  1260. <el-table
  1261. size="mini"
  1262. :height="216"
  1263. :data="hchogirdDate"
  1264. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  1265. >
  1266. <el-table-column
  1267. label='序号'
  1268. prop
  1269. width='80'
  1270. type='index'
  1271. align="left"
  1272. ></el-table-column>
  1273. <el-table-column
  1274. property="spaceName"
  1275. width='130'
  1276. label="空间名称"
  1277. align="left"
  1278. ></el-table-column>
  1279. <el-table-column
  1280. property="abnormalProprotion"
  1281. width='130'
  1282. label="超标率(%)"
  1283. align="left"
  1284. ></el-table-column>
  1285. <el-table-column
  1286. property="hchoAbnormalTime"
  1287. width='130'
  1288. label="超标时长(h)"
  1289. align="left"
  1290. ></el-table-column>
  1291. <el-table-column
  1292. property="hchoMaxSolubility"
  1293. width='150'
  1294. label="峰值浓度(mg/m³)"
  1295. align="left"
  1296. ></el-table-column>
  1297. <el-table-column
  1298. width='130'
  1299. label="峰值浓度评价"
  1300. align="left"
  1301. >
  1302. <template slot-scope='{row}'>
  1303. <span :style="{color:row.assess=='较高'?'#C6322B':'#1F2329'}">{{row.assess}}</span>
  1304. </template>
  1305. </el-table-column>
  1306. <el-table-column
  1307. label="解释"
  1308. align="center"
  1309. >
  1310. <template slot-scope='{row}'>
  1311. {{row.hchoRemark}}
  1312. </template>
  1313. </el-table-column>
  1314. </el-table>
  1315. </div>
  1316. <div
  1317. class="co2_parame"
  1318. v-if="item.id=='CO2'"
  1319. >
  1320. <div class="content_title mp40"><span>异常空间</span><span>(超标率排序)</span></div>
  1321. <el-table
  1322. size="mini"
  1323. :height="216"
  1324. :data="co2girdDate"
  1325. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  1326. >
  1327. <el-table-column
  1328. label='序号'
  1329. prop
  1330. width='80'
  1331. type='index'
  1332. align="left"
  1333. ></el-table-column>
  1334. <el-table-column
  1335. property="spaceName"
  1336. width='130'
  1337. label="空间名称"
  1338. align="left"
  1339. ></el-table-column>
  1340. <el-table-column
  1341. property="abnormalProprotion"
  1342. width='130'
  1343. label="超标率(%)"
  1344. align="left"
  1345. ></el-table-column>
  1346. <el-table-column
  1347. property="co2AbnormalTime"
  1348. width='130'
  1349. label="超标时长(h)"
  1350. align="left"
  1351. ></el-table-column>
  1352. <el-table-column
  1353. property="co2MaxSolubility"
  1354. width='150'
  1355. label="峰值浓度(ppm)"
  1356. align="left"
  1357. ></el-table-column>
  1358. <el-table-column
  1359. property="assess"
  1360. width='130'
  1361. label="峰值浓度评价"
  1362. align="left"
  1363. >
  1364. <template slot-scope='{row}'>
  1365. <span :style="{color:row.assess=='较高'?'#DCAA04':'#1F2329'}">{{row.assess}}</span>
  1366. </template>
  1367. </el-table-column>
  1368. <el-table-column
  1369. label="解释"
  1370. align="center"
  1371. >
  1372. <template slot-scope='{row}'>
  1373. {{row.co2Remark}}
  1374. <!-- <el-input v-model="row.co2Remark" size="small" maxlength="24" @blur="changeInput(row,'co2')"></el-input> -->
  1375. </template>
  1376. </el-table-column>
  1377. </el-table>
  1378. <div class="content_title_noline mp40 mb16">参数释义</div>
  1379. <ul class="paramlist ft12">
  1380. <li>
  1381. <p><span><b>CO₂:</b>通常作为建筑空间新风是否充足的量化参数</span></p>
  1382. <div>
  1383. <el-table
  1384. class="co2table ft12"
  1385. :data="co2Date"
  1386. border
  1387. :header-cell-style="{background:'#ffffff!important',color:'#606266',padding:'6px 0'}"
  1388. >
  1389. <!-- <el-table-column width="30"></el-table-column> -->
  1390. <el-table-column
  1391. label="序号"
  1392. type="index"
  1393. width="60"
  1394. align="left"
  1395. ></el-table-column>
  1396. <el-table-column
  1397. label="CO₂浓度区间"
  1398. prop="area"
  1399. align="left"
  1400. width="150"
  1401. ></el-table-column>
  1402. <el-table-column
  1403. label="评价"
  1404. prop="assess"
  1405. align="left"
  1406. width="200"
  1407. ></el-table-column>
  1408. <el-table-column
  1409. label="环境感受"
  1410. prop="feel"
  1411. align="left"
  1412. ></el-table-column>
  1413. </el-table>
  1414. <div class="title_tips"><i class="el-icon-warning-outline"></i>室外新鲜空气一般在 400~500ppm</div>
  1415. </div>
  1416. </li>
  1417. </ul>
  1418. </div>
  1419. <div
  1420. class="rh_parame"
  1421. v-if="item.id=='RH'"
  1422. >
  1423. <div class="content_title_noline mp40 mb16">参数解释</div>
  1424. <ul class="paramlist ft12">
  1425. <li>
  1426. <p><i></i><span><b>相对湿度</b></span></p>
  1427. <div style="margin-top:8px">评价空气中的水蒸气的相对含量</div>
  1428. </li>
  1429. <li>
  1430. <p><i></i><span><b>舒适范围</b></span></p>
  1431. <div>
  1432. <div class="hum_list">
  1433. <div><span>供暖季</span>30%~60%</div>
  1434. <div><span>供冷季</span>40%~60%</div>
  1435. <div><span>过渡季</span>30%~60%</div>
  1436. </div>
  1437. </div>
  1438. </li>
  1439. <li>
  1440. <p><i></i><span><b>参数评价</b></span></p>
  1441. <p class="rh_img"><img
  1442. src="../../../../static/images/hot.png"
  1443. alt=""
  1444. />干燥:低于上述区间 </p>
  1445. <p class="rh_img"><img
  1446. src="../../../../static/images/cold.png"
  1447. alt=""
  1448. />偏湿:高于上述区间 </p>
  1449. </li>
  1450. <li>
  1451. <p><i></i><span><b>相对湿度的影响</b><br></span></p>
  1452. <div style="margin-top:8px">
  1453. 高湿度可促进微生物病原体(如细菌、尘螨和霉菌)的聚集和生长,同时湿度过高可能会增加建筑材料释放气体:相对湿度增加 35%可使甲醛释放量增加 1.8-2.6 倍。 低湿度会导致气道、皮肤、眼 睛、咽喉和粘膜的干燥和刺激。也与病毒较长的存活率有关(活性失去较慢)
  1454. </div>
  1455. </li>
  1456. </ul>
  1457. </div>
  1458. <div
  1459. class="pm_parame"
  1460. v-if="item.id=='PM2d5'"
  1461. >
  1462. <div class="content_title_noline mp40 mb16"><span>参数释义</span></div>
  1463. <ul class="paramlist ft12">
  1464. <li>
  1465. <p><i></i><span><b>PM2.5简介</b><br>大气中空气动力学当量直径小于或等于 2.5 微米的颗粒物,也称为可入肺颗粒物;</span></p>
  1466. </li>
  1467. <li>
  1468. <p><i></i><span><b>达标率</b><br>参数良好级别及以上,浓度≤75 μg/m3;超出此数值记为超限。</span></p>
  1469. </li>
  1470. <li>
  1471. <p><i></i><span>WELL标准中,对不同PM2.5浓度所在区间所能申请的标准(铂金级、金级、银级),均有对应的先决条件。如:在 PM2.5 浓度为 20μg/m3,最高只能达到 WELL 金级标准。</span></p>
  1472. </li>
  1473. </ul>
  1474. </div>
  1475. <!-- start 环境温度分析 -->
  1476. <section
  1477. class="mp400 mb730"
  1478. v-if="item.id=='Tdb'"
  1479. >
  1480. <div class="content_title"><span>环境温度分析(空间维度)</span></div>
  1481. <div class="sj_reminder mb16">
  1482. <p>温馨提示:</p>
  1483. <p>1.空间划分维度:内外区、朝向、楼层、新风机组各自服务的空间四个维度,分别进行周不达标率分析计算。</p>
  1484. <p>2.数据表:每个空间划分维度均有对应的空间数量。</p>
  1485. <p>3.朝向维度仅外区空间,其中内区空间无朝向。</p>
  1486. </div>
  1487. <div class="sj_chartbox">
  1488. <div class="pr65">
  1489. <div class="day_title mb32">内、外区</div>
  1490. <barChart
  1491. :chart-id="'echart_left_out'+exportPdf"
  1492. :chart-date="localtionDate.regionsChart"
  1493. :sjChartType="'regions'"
  1494. class="daychart"
  1495. />
  1496. <div class="chart_sj_bottom mb10">
  1497. <div>空间数量</div>
  1498. <div class="chart_sj_bottom_main">
  1499. <div
  1500. v-for="(item,index) in localtionDate.regionsChart.spaceNum"
  1501. :key="index"
  1502. >{{item}}</div>
  1503. </div>
  1504. </div>
  1505. </div>
  1506. <div>
  1507. <div class="day_title mb32">各个朝向
  1508. <chartLegend
  1509. :avgTemp="false"
  1510. class="charttext"
  1511. />
  1512. </div>
  1513. <barChart
  1514. :chart-id="'echart_left_orientation'+exportPdf"
  1515. :chart-date="localtionDate.orientationChart"
  1516. :sjChartType="'orientation'"
  1517. class="daychart"
  1518. />
  1519. <div class="chart_sj_bottom mb10">
  1520. <div class="twoline">空间数量</div>
  1521. <div class="chart_sj_bottom_main">
  1522. <div
  1523. v-for="(item,index) in localtionDate.orientationChart.spaceNum"
  1524. :key="index"
  1525. >{{item}}</div>
  1526. </div>
  1527. </div>
  1528. </div>
  1529. </div>
  1530. <div class="sj_chartbox mp40">
  1531. <div class="pr65">
  1532. <div class="day_title mb32">各个楼层</div>
  1533. <barChart
  1534. :chart-id="'echart_left_floor'+exportPdf"
  1535. :chart-date="localtionDate.floorChart"
  1536. :sjChartType="'localtion'"
  1537. class="daychart"
  1538. />
  1539. <div class="chart_sj_bottom">
  1540. <div class="twoline">空间数量</div>
  1541. <div class="chart_sj_bottom_main">
  1542. <div
  1543. v-for="(item,index) in localtionDate.floorChart.spaceNum"
  1544. :key="index"
  1545. >{{item}}</div>
  1546. </div>
  1547. </div>
  1548. </div>
  1549. <div>
  1550. <!-- <div class="day_title mb32">新风机组服务的空间</div>
  1551. <barChart :chart-id="'echart_left_unit'+exportPdf" :chart-date="localtionDate.freshAirChart" :sjChartType="'freshAir'" class="daychart"/>
  1552. <div class="chart_sj_bottom">
  1553. <div class="twoline">空间数量</div>
  1554. <div class="chart_sj_bottom_main">
  1555. <div v-for="(item,index) in localtionDate.freshAirChart.spaceNum" :key="index">{{item}}</div>
  1556. </div>
  1557. </div> -->
  1558. </div>
  1559. </div>
  1560. <div class="addmark addmarkhg">
  1561. <div
  1562. class="remarkshow remark_input"
  1563. v-show="typeRemark"
  1564. >{{typeRemark}}</div>
  1565. </div>
  1566. </section>
  1567. <!-- end 环境温度分析 -->
  1568. <!-- start 各达标区间空间数量分布及异常冷热空间列表 -->
  1569. <section
  1570. class="mb16"
  1571. v-if="item.id=='Tdb'"
  1572. >
  1573. <div class="content_title"><span>各达标区间空间数量分布及异常冷热空间列表</span></div>
  1574. <div class="content_title_noline mb16">各达标区间空间数量分布</div>
  1575. <div class="up_distribution">
  1576. <div class="up_distribution_text"><span></span>达标率偏低,亟待解决</div>
  1577. <barChart
  1578. :chart-id="'echart_left_week'+exportPdf"
  1579. :chart-date="StandardList"
  1580. :weekNormalChart="true"
  1581. :y-type="yType"
  1582. class="daychart"
  1583. />
  1584. </div>
  1585. <div class="title_tips mb52"></div>
  1586. <div class="content_body mb475">
  1587. <div class="body_title"><span>偏热空间</span><span class="tabletag taghot">偏热</span></div>
  1588. <el-table
  1589. size="mini"
  1590. :data="hotgirdDate"
  1591. :height="396"
  1592. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  1593. >
  1594. <el-table-column
  1595. label='序号'
  1596. prop
  1597. width='80'
  1598. type='index'
  1599. align="left"
  1600. ></el-table-column>
  1601. <el-table-column
  1602. property="spaceName"
  1603. width='130'
  1604. show-overflow-tooltip
  1605. label="空间名称"
  1606. align="left"
  1607. ></el-table-column>
  1608. <el-table-column
  1609. property="avgTemp"
  1610. width='100'
  1611. label="周均温度(°C)"
  1612. align="left"
  1613. ></el-table-column>
  1614. <el-table-column
  1615. property="hotProprotion"
  1616. width='120'
  1617. label="周偏热不达标(%)"
  1618. align="left"
  1619. ></el-table-column>
  1620. <el-table-column
  1621. property="serviceTime"
  1622. width='110'
  1623. label="周服务时长(h)"
  1624. align="left"
  1625. ></el-table-column>
  1626. <el-table-column
  1627. property="validProprotion"
  1628. width='110'
  1629. label="周有效数据(%)"
  1630. align="left"
  1631. ></el-table-column>
  1632. <el-table-column
  1633. property="hotNum"
  1634. width='120'
  1635. label="周累计热反馈数"
  1636. align="left"
  1637. ></el-table-column>
  1638. <el-table-column
  1639. label="解释"
  1640. align="left"
  1641. >
  1642. <template slot-scope='{row}'>
  1643. {{row.hotRemark}}
  1644. </template>
  1645. </el-table-column>
  1646. </el-table>
  1647. <div class="body_title body_coldtitle"><span>偏冷空间</span><span class="tabletag tagclod">偏冷</span></div>
  1648. <el-table
  1649. size="mini"
  1650. :data="coldgirdDate"
  1651. :height="396"
  1652. :header-cell-style="{background:'#F8F9FA!important',color:'#646A73',padding:'6px 0'}"
  1653. >
  1654. <el-table-column
  1655. label='序号'
  1656. prop
  1657. width='80'
  1658. type='index'
  1659. align="left"
  1660. ></el-table-column>
  1661. <el-table-column
  1662. property="spaceName"
  1663. width='130'
  1664. show-overflow-tooltip
  1665. label="空间名称"
  1666. align="left"
  1667. ></el-table-column>
  1668. <el-table-column
  1669. property="avgTemp"
  1670. width='100'
  1671. label="周均温度(°C)"
  1672. align="left"
  1673. ></el-table-column>
  1674. <el-table-column
  1675. property="coldProprotion"
  1676. width='120'
  1677. label="周偏冷不达标(%)"
  1678. align="left"
  1679. ></el-table-column>
  1680. <el-table-column
  1681. property="serviceTime"
  1682. width='110'
  1683. label="周服务时长(h)"
  1684. align="left"
  1685. ></el-table-column>
  1686. <el-table-column
  1687. property="validProprotion"
  1688. width='110'
  1689. label="周有效数据(%)"
  1690. align="left"
  1691. ></el-table-column>
  1692. <el-table-column
  1693. property="coldNum"
  1694. width='120'
  1695. label="周累计冷反馈数"
  1696. align="left"
  1697. ></el-table-column>
  1698. <el-table-column
  1699. label="解释"
  1700. align="left"
  1701. >
  1702. <template slot-scope='{row}'>
  1703. {{row.coldRemark}}
  1704. </template>
  1705. </el-table-column>
  1706. </el-table>
  1707. </div>
  1708. </section>
  1709. <!-- end 各达标区间空间数量分布及异常冷热空间列表 -->
  1710. <section
  1711. v-if="dataDeal&&item.id=='Tdb'"
  1712. class="pageitem_box_list"
  1713. >
  1714. <!-- -->
  1715. <div
  1716. class="pageitem_box"
  1717. v-for="(item,index) in daysDate"
  1718. :key="index"
  1719. >
  1720. <div class="content_title"><span>每日环境详情(周{{item.pname}})</span></div>
  1721. <div
  1722. class="content_body"
  1723. :key="item.pname"
  1724. >
  1725. <div class="day_title oneday_title">逐刻平均温度及达标空间数量变化趋势</div>
  1726. <!-- :key="index+'dot'" -->
  1727. <chartLegend
  1728. class="charttext"
  1729. :dot-line="true"
  1730. />
  1731. <lineChart
  1732. :chart-id="'echart_top'+item.name+exportPdf"
  1733. :chart-date="item.chartDate"
  1734. :contant="true"
  1735. :xType="hourType"
  1736. />
  1737. <barChart
  1738. :chart-id="'echart_bottom'+item.name+exportPdf"
  1739. :chart-date="item.chartDate"
  1740. :numberChart="true"
  1741. :x-type="hourType"
  1742. :y-type="yType"
  1743. />
  1744. <div class="room_table">
  1745. <div class="room_table_number">
  1746. <div>室外温度(°C)</div>
  1747. <div>
  1748. <div
  1749. v-for="(items,sgin) in item.chartDate.outSideTemp"
  1750. :key="sgin"
  1751. >
  1752. {{items}}
  1753. </div>
  1754. </div>
  1755. </div>
  1756. </div>
  1757. <div class="twochart_box">
  1758. <div>
  1759. <div class="day_title">各房间日均温度分布</div>
  1760. <barChart
  1761. :chart-id="'echart_left'+item.name+exportPdf"
  1762. :chart-date="item.chartDateLeft"
  1763. :normalChart="true"
  1764. :y-type="yType"
  1765. class="daychart"
  1766. />
  1767. </div>
  1768. <div>
  1769. <div class="day_title">各楼层日均温及偏冷(热)空间数量</div>
  1770. <!-- <chartLegend class="charttext" :dot-line="true"/> -->
  1771. <lineChart
  1772. :x-type="floorType"
  1773. :chart-id="'echart_righttop'+item.name+exportPdf"
  1774. :chart-date="item.chartDateRight"
  1775. :contant="true"
  1776. class="daylinechart"
  1777. />
  1778. <barChart
  1779. :chart-id="'echart_rightbottom'+item.name+exportPdf"
  1780. :x-type="floorType"
  1781. :y-type="yType"
  1782. :numberChart="true"
  1783. :chart-date="item.chartDateRight"
  1784. class="daybarchart"
  1785. />
  1786. </div>
  1787. </div>
  1788. </div>
  1789. </div>
  1790. </section>
  1791. <!-- start 用户及名词解释 -->
  1792. <div
  1793. v-if="item.id=='Tdb'"
  1794. :class="{'mp990':daysDate.length%2?true:false,'mp140':daysDate.length%2?false:true}"
  1795. >
  1796. <div class="content_title"><span>用户活跃度统计(周)</span></div>
  1797. <div class="user_total">
  1798. <div v-if="projectId!=='Pj1101020002'">
  1799. <div>用户总数量</div>
  1800. <div><span>{{userDate.userRegistNum}}</span>人</div>
  1801. </div>
  1802. <div v-if="projectId!=='Pj1101020002'">
  1803. <div>周活跃用户数量</div>
  1804. <div><span>{{userDate.userActiveNum}}</span>人</div>
  1805. </div>
  1806. <div>
  1807. <div>用户与系统互动数量</div>
  1808. <div><span>{{userDate.userSysNum}}</span>次</div>
  1809. </div>
  1810. <div>
  1811. <div>用户问题反馈数量</div>
  1812. <div><span>{{userDate.UserFbNum}}</span>条</div>
  1813. </div>
  1814. <div>
  1815. <div>帮用户解决问题</div>
  1816. <div><span>{{userDate.solveFbNum}}</span>条</div>
  1817. </div>
  1818. </div>
  1819. <div class="content_title"><span>环境管理周报数据解释</span></div>
  1820. <section>
  1821. <div class="content_title_noline mb16">名词解释</div>
  1822. <ul class="paramlist ft12">
  1823. <li
  1824. v-for="(item,index) in expTerms"
  1825. :key="index"
  1826. >
  1827. <p><i></i><span><b>{{item.name}}:</b>{{item.content}}。</span></p>
  1828. </li>
  1829. </ul>
  1830. </section>
  1831. <section>
  1832. <div class="content_title_noline mb16">计算说明</div>
  1833. <ul class="paramlist paramlist_explain ft12">
  1834. <li>
  1835. <p><i></i><span><b>温度评价</b></span></p>
  1836. <p>“偏冷”、“舒适”、“偏热”。以平均温度的不同区间对应,区间对应如下:</p>
  1837. <div>
  1838. <div class="hum_list">
  1839. <div><img
  1840. src="../../../../static/images/cold.png"
  1841. alt="偏冷"
  1842. /> &ensp;偏冷 &nbsp;&nbsp;&nbsp; 平均温度&lt;20°C</div>
  1843. <div><img
  1844. src="../../../../static/images/happy.png"
  1845. alt="舒适"
  1846. /> &ensp;舒适 &nbsp;&nbsp;&nbsp;平均温度 20°C~25°C</div>
  1847. <div><img
  1848. src="../../../../static/images/hot.png"
  1849. alt="偏热"
  1850. /> &ensp;偏热 &nbsp;&nbsp;&nbsp;平均温度&gt;25°C</div>
  1851. </div>
  1852. </div>
  1853. </li>
  1854. <li>
  1855. <p><i></i><span><b>周达标率计算</b></span></p>
  1856. <div class="ml17">
  1857. <p>单个空间当前时刻是否达标的判断方法:min(当前时刻服务定制温度下限,合同约定 温度范围下限)&lt;当前环境温度&lt;max(当前时刻服务定制温度上限,合同约定温度范 围上限),满足上述区间内,视为达标;</p>
  1858. <p>低于区间,视为偏冷;</p>
  1859. <p>高于区间,视为偏热。</p>
  1860. </div>
  1861. <p class="ml17">所有空间一周时间达标率的判断方法:所有空间所有存在空调服务的累计时间中,判断为达标的时间占比,即周达标率。</p>
  1862. <p class="ml17">偏冷(热)率的计算如上。</p>
  1863. </li>
  1864. </ul>
  1865. </section>
  1866. <section>
  1867. <div class="content_title_noline mb16">合约与管控时间段</div>
  1868. <el-table
  1869. class="sj_table ft12"
  1870. :height="620"
  1871. :data="custormList.slice(0,12)"
  1872. border
  1873. :header-cell-style="{background:'#F8F9FA!important',padding:'6px 0'}"
  1874. >
  1875. <!-- <el-table-column align="left" width="40" ></el-table-column> -->
  1876. <el-table-column
  1877. align="left"
  1878. prop="objectName"
  1879. label="空间组"
  1880. ></el-table-column>
  1881. <el-table-column
  1882. align="left"
  1883. label="合同约定温度达标区间"
  1884. >
  1885. <template slot-scope='{row}'>
  1886. {{row.minValue}}~{{row.maxValue}}
  1887. </template>
  1888. </el-table-column>
  1889. <el-table-column
  1890. align="left"
  1891. label="环境保障时间段(工作日)"
  1892. >
  1893. <template slot-scope='{row}'>
  1894. {{row.startTime&&(row.startTime.slice(0,2)+':'+row.startTime.slice(2,4))}}~{{row.endTime&&(row.endTime.slice(0,2)+':'+row.endTime.slice(2,4))}}
  1895. </template>
  1896. </el-table-column>
  1897. <el-table-column
  1898. align="left"
  1899. prop="dayType"
  1900. label="环境保障时间段(周末)"
  1901. ></el-table-column>
  1902. </el-table>
  1903. </section>
  1904. </div>
  1905. <!-- end 用户及名词解释 -->
  1906. </section>
  1907. <!-- end 本周环境温度概况 -->
  1908. </div>
  1909. <el-dialog
  1910. title="提示"
  1911. :visible.sync="emailVisible"
  1912. :modal='false'
  1913. :close-on-click-modal="false"
  1914. width="30%"
  1915. >
  1916. <div
  1917. class="nosend"
  1918. v-if="!checkSendEmail"
  1919. >
  1920. 是否将周报发送给
  1921. <span
  1922. v-for="(items,k) in emailData"
  1923. :key="k"
  1924. >
  1925. {{items.receiver}}:{{items.mailbox}}
  1926. </span>
  1927. </div>
  1928. <div
  1929. class="sended"
  1930. v-if="checkSendEmail"
  1931. >
  1932. <span>已将周报发送给</span>
  1933. <el-checkbox-group v-model="emailCheckList">
  1934. <el-checkbox
  1935. :label="items.id"
  1936. v-for="(items,k) in sendedUser"
  1937. :key="k"
  1938. >{{items.receiver}}</el-checkbox>
  1939. </el-checkbox-group>
  1940. <div v-show="noSendUser&&noSendUser.length">
  1941. <span>未将周报发送给</span>
  1942. <el-checkbox-group v-model="nosendCheckList">
  1943. <el-checkbox
  1944. :label="items.id"
  1945. v-for="(items,k) in noSendUser"
  1946. :key="k"
  1947. >{{items.receiver}}</el-checkbox>
  1948. </el-checkbox-group>
  1949. </div>
  1950. <span>是否继续发送</span>
  1951. </div>
  1952. <span
  1953. slot="footer"
  1954. class="dialog-footer"
  1955. >
  1956. <el-button
  1957. @click="emailVisible = false"
  1958. size="small"
  1959. >取 消</el-button>
  1960. <el-button
  1961. type="primary"
  1962. @click="sendEmail"
  1963. size="small"
  1964. > 确 定</el-button>
  1965. </span>
  1966. </el-dialog>
  1967. </div>
  1968. </template>
  1969. <script>
  1970. import { mapGetters } from "vuex"
  1971. import { Tabs } from 'meri-design'
  1972. import lineChart from "./lineChart.vue"
  1973. import barChart from "./barChart.vue"
  1974. import ringChart from "./ringChart.vue"
  1975. import chartLegend from "./chartLegend.vue"
  1976. import envSurvey from "./envSurvey.vue"
  1977. import userAdjust from "./userAdjust.vue"
  1978. import moment from "moment"
  1979. import { queryWeekday, querySubstandardList, queryDay, querysectionSpace, saveRemark, passEmail,
  1980. querysectionFloor, queryStandardList, queryWeekSpace, queryUserActivity, queryTempRate, explainSave,
  1981. querySeason, queryCustormList, queryEmail, queryPm2d5,queryWeekNumberHttp} from "@/api/ReportForm/ReportForm.js";
  1982. export default {
  1983. props: {
  1984. // comstartDate:{
  1985. // default:'',
  1986. // type:String
  1987. // },
  1988. // comendDate:{
  1989. // default:'',
  1990. // type:String
  1991. // },
  1992. // projectName:String
  1993. },
  1994. data() {
  1995. return {
  1996. totalReportCount: '',
  1997. yearReportNum: '',
  1998. pdfPmDateShow: false,
  1999. mbList: [200, 200, 600, 520, 300, 900, 0],
  2000. emailVisible: false,
  2001. checkSendEmail: false,
  2002. emailCheckList: [],
  2003. nosendCheckList: [],
  2004. chartweekDate: {},
  2005. chartweekTemp: {},
  2006. portDate: "",
  2007. exportPdf: "exportPdf",
  2008. co2Date: [
  2009. {
  2010. area: "400~800",
  2011. assess: "新鲜空气",
  2012. feel: "无,与室外接近"
  2013. },
  2014. {
  2015. area: "800~1000",
  2016. assess: "达标",
  2017. feel: "无,高强度脑力劳动者可能会有轻微头晕感觉"
  2018. },
  2019. {
  2020. area: "1000~1500",
  2021. assess: "新风轻微不足",
  2022. feel: "感觉轻微头晕,头胀,伴随工作效率下降"
  2023. },
  2024. {
  2025. area: "1500~2000",
  2026. assess: "新风明显不足",
  2027. feel: "会有轻微头疼的感觉,无法继续工作"
  2028. },
  2029. {
  2030. area: "≥2000",
  2031. assess: "新风严重不足",
  2032. feel: "属空气严重污染,通常无新风补给,不建议常驻"
  2033. }
  2034. ],
  2035. chartDate: {
  2036. "date": "20200810", //日期
  2037. "avgTemp": "",//平均温度
  2038. "hotProprotion": 0, //偏热占比
  2039. "coldProprotion": "",//偏冷占比
  2040. "normalProprotion": 0, //正常占比
  2041. "daySpaceNum": 0,//日服务空间数
  2042. "registeredSpaceNum": "",//总注册空间数
  2043. },
  2044. chartId: 'linechart',
  2045. dayType: "day",
  2046. hourType: "hour",
  2047. floorType: "floor",
  2048. yType: "number",
  2049. hotgirdDate: [],
  2050. coldgirdDate: [],
  2051. co2girdDate: [],
  2052. hchogirdDate: [],
  2053. daysDate: [],
  2054. dataDeal: false,
  2055. numIndex: 0,
  2056. startDate: '',
  2057. endDate: '',
  2058. pickerOptions: {
  2059. disabledDate(time) {
  2060. return time.getTime() > Date.now();
  2061. },
  2062. },
  2063. chartModel: {
  2064. },
  2065. expTerms: [
  2066. { name: '达标率', content: '按照合约范围约定的达标区间' },
  2067. { name: '环比', content: '相对上周的数据进行比较' },
  2068. { name: '时间维度', content: '日期、时刻等角度分析数据' },
  2069. { name: '空间维度', content: '空间自身固有属性的角度分析数据' },
  2070. { name: '内外区', content: '通常没有直接与室外关联的外窗的空间,划为内区,内区没有朝向之说' },
  2071. { name: '朝向', content: '实际交付有 16 个朝向(含东北偏东),最终划到四个朝向(东北偏东属于东)' },
  2072. { name: '新风机组服务的空间', content: '每个空间都有唯一的新风机组为其服务,一台新风机组服务多个空间' },
  2073. { name: '周偏热(冷)不达标率', content: '空调服务时间段内,偏热(冷)时长占比总时长' },
  2074. { name: '周有效数据', content: '反映数据质量好坏,空调服务时间段内,传感器刨除数据丢包的数据量占比' },
  2075. ],
  2076. dayData: [],
  2077. envType: 'Tdb',
  2078. envTypelist: [
  2079. {
  2080. name: '温度',
  2081. id: 'Tdb'
  2082. },
  2083. {
  2084. name: 'CO₂',
  2085. id: "CO2"
  2086. },
  2087. {
  2088. name: '甲醛',
  2089. id: "HCHO"
  2090. },
  2091. {
  2092. name: '相对湿度',
  2093. id: "RH"
  2094. },
  2095. {
  2096. name: 'PM2.5',
  2097. id: "PM2d5"
  2098. },
  2099. {
  2100. name: '用户调节',
  2101. id: "userAdjust"
  2102. },
  2103. {
  2104. name: '能源管理',
  2105. id: "energyManage"
  2106. }
  2107. ],
  2108. tableItem: '',
  2109. daysDateCurrent: [],
  2110. surveyTable: [
  2111. { name: "温度", id: 'Tdb', weeknormalProprotion: '', weekAvg: '--', img: 'happy', init: 1, assess: '', weekcoldProprotion: '', weekhotProprotion: '', unit: '°C', assessHotTable: [
  2112. { name: '偏冷', min: -50 }, { name: "舒适", min: 20 }, { name: "偏热", min: 25 }
  2113. ], assessColdTable: [
  2114. { name: '偏冷', min: -50 }, { name: "舒适", min: 20 }, { name: "偏热", min: 25 }
  2115. ] },
  2116. { name: "CO₂", id: "CO2", weeknormalProprotion: '', weekAvg: '', assess: '', img: 'happy', init: 0, unit: 'ppm', assessTable: [
  2117. { name: "新鲜空气", min: 400, type: "happy" }, { name: "达标", min: 800, type: "happy" }, { name: "新风轻微不足", min: 1000, type: "happy" }, { name: "新风明显不足", min: 1500, type: "hot" }, { name: "新风严重不足", min: 2000, type: "hot" }
  2118. ] },
  2119. { name: "甲醛", id: "HCHO", weeknormalProprotion: '', weekAvg: '', assess: '', img: 'happy', init: 2, unit: 'mg/m3', assessTable: [
  2120. { name: "符合国标", type: "happy", min: 0 }, { name: "超标", min: 0.1, type: "hot" }
  2121. ] },
  2122. { name: "相对湿度", id: "RH", weeknormalProprotion: '', weekAvg: '', init: 0, img: 'happy', assess: '', unit: '%', assessTable: [
  2123. { name: "干燥", type: "hot", min: 0 }, { name: "舒适", min: 30, type: "happy" }, { name: "湿润", min: 70, type: "cold" }
  2124. ] },
  2125. { name: "PM2.5", id: "PM2d5", weeknormalProprotion: '', weekAvg: '', assess: '', img: 'happy', init: 0, unit: 'ug/m3', assessTable: [
  2126. { name: "优", min: 0, type: "happy" }, { name: "良好", min: 50, type: "happy" }, { name: "轻度污染", min: 100, type: "hot" }, { name: "严重污染", min: 200, type: "hot" }
  2127. ] },
  2128. { name: "用户调节", id: "userAdjust", },
  2129. { name: "能源管理", id: "energyManage", },
  2130. ],
  2131. imgList: ["cold", "happy", "hot"],
  2132. StandardList: [],
  2133. userDate: {
  2134. "userRegistNum": 0,//注册用户数量
  2135. "userActiveNum": 0,//周活跃用户数量
  2136. "userSysNum": 0, //用户与系统互动数量
  2137. "UserFbNum": 0,//用户问题反馈数量
  2138. "solveFbNum": 0 //用户问题反馈数量
  2139. },
  2140. localtionTable: ['regionsChart', 'orientationChart', 'floorChart', 'freshAirChart'], //内外区 1 朝向 2 楼层 3 新风机组
  2141. localtionDate: {
  2142. regionsChart: {},
  2143. orientationChart: {},
  2144. floorChart: {},
  2145. freshAirChart: {}
  2146. },
  2147. seasonType: '',
  2148. hotStandardList: {},
  2149. custormList: [],
  2150. quarterRemark: {},
  2151. typeRemark: "",
  2152. typeRemarkEdit: false,
  2153. quarterRemarkEdit: false,
  2154. remarkId: {},
  2155. reportImg: null,
  2156. emailData: null,
  2157. noSendUser: [],
  2158. sendedUser: [],
  2159. noEmailuser: true,
  2160. isSpecialType: ["userAdjust", "energyManage"],
  2161. pmDate: [
  2162. { name: "WELL铂金级", range: "0~15" },
  2163. { name: "WELL金级", range: "15~25" },
  2164. { name: "优秀", range: "25~35" },
  2165. { name: "良好", range: "35~75" },
  2166. { name: "轻微污染", range: "75~115" },
  2167. { name: "中度污染", range: "115~150" },
  2168. { name: "重度污染", range: "150~250" },
  2169. { name: "严重污染", range: ">250" },
  2170. ],
  2171. pmchartColor: ['#2EA121', '#8EE085', '#B7EDB1', '#D9F5D6', '#F8E6AB', '#FAD355', '#DCAA04', '#AA8303'],
  2172. }
  2173. },
  2174. components: { lineChart, barChart, chartLegend, Tabs, ringChart, envSurvey, userAdjust },
  2175. beforeMount() {
  2176. // TODO 数据路由传参
  2177. // console.log(this.$route,"---------------------------------------")
  2178. // http://192.168.0.24:9906/weekpdf?startDate=20210118&endDate=20210124&projectName=你好&projectId=Pj1101080259
  2179. this.comstartDate = this.$route.query.startDate;
  2180. this.comendDate = this.$route.query.endDate;
  2181. this.projectName = this.$route.query.projectName;
  2182. this.projectId = this.$route.query.projectId;
  2183. this.dataChange([this.comstartDate, this.comendDate])
  2184. },
  2185. async mounted() {
  2186. this.indexMap = {
  2187. Tdb: 9,
  2188. RH: 10,
  2189. CO2: 11,
  2190. PM2d5: 12,
  2191. HCHO: 13,
  2192. userAdjust: 16,
  2193. energyManage: 17
  2194. }
  2195. this.timeArray = this.generateTime();
  2196. await this.getSeasontype();
  2197. this.getWeekSpace('floor');
  2198. this.getWeekSpace();
  2199. this.getUserActivity();
  2200. this.getTempRate();
  2201. this.getStandardList();
  2202. this.getCustormList();
  2203. // this.getEmailDate();
  2204. this.getPmdate();
  2205. this.getWeekNumber();
  2206. },
  2207. methods: {
  2208. moment,
  2209. contentTitle(value) {
  2210. if (value === "Tdb") {
  2211. return '环境温度分析(时间维度)'
  2212. }
  2213. if (this.isUserorEngry) {
  2214. return '趋势'
  2215. }
  2216. return '逐日详情'
  2217. },
  2218. seccontentTitle(value) {
  2219. if (value === "Tdb") {
  2220. return '逐14日环境达标率及平均温度变化趋势'
  2221. }
  2222. if (value == "userAdjust") {
  2223. return '逐14日用户调节空间数量变化趋势'
  2224. }
  2225. if (value == "energyManage") {
  2226. return '逐日电耗变化趋势'
  2227. }
  2228. return '逐日达标率及日浓度'
  2229. },
  2230. getPmdate() {
  2231. const getParams = {
  2232. "projectId": this.projectId,//项目id
  2233. "startDate": this.startDate,
  2234. "endDate": this.endDate,
  2235. }
  2236. queryPm2d5({ getParams }).then(res => {
  2237. console.log(res);
  2238. if (res.data) {
  2239. // 手动排序
  2240. res.data.sort((a, b) => {
  2241. return a.evaluationStandard - b.evaluationStandard
  2242. })
  2243. res.data.forEach((item, index) => {
  2244. item.proportion = parseInt(item.proportion * 100);
  2245. this.pmDate[index] = Object.assign(this.pmDate[index], item);
  2246. })
  2247. this.pdfPmDateShow = true;
  2248. }
  2249. })
  2250. },
  2251. toRemarkedit(value) {
  2252. this[value + 'Edit'] = true;
  2253. },
  2254. saveRemark(value) {
  2255. let postParams = {
  2256. "id": this.remarkId[this.envType],
  2257. "projectId": this.projectId,//项目id
  2258. "startDate": this.startDate,
  2259. "endDate": this.endDate,
  2260. "year": this.startDate.slice(0, 4),
  2261. "type": value == "typeRemark" ? 9 : this.indexMap[this.envType],//0 内外区 1 朝向 2 楼层 3 新风机组 4 温度 5 湿度 6 co2 7 pm2.5 8 甲醛 9, 周报备注
  2262. "quarterRemark": this.quarterRemark[this.envType],//时刻备注
  2263. }
  2264. value == "typeRemark" && (postParams.typeRemark = this.typeRemark);
  2265. saveRemark({ postParams }).then(res => {
  2266. if (res.result == 'success') {
  2267. this.$message.success('保存成功');
  2268. this.remarkId[this.envType] = res.id || '';
  2269. this[value + 'Edit'] = false;
  2270. }
  2271. })
  2272. },
  2273. cancelRemark(value) {
  2274. this[value + 'Edit'] = false;
  2275. },
  2276. tableRowClassName({ row, rowIndex }) {
  2277. const passValue = ['舒适', '新鲜空气', '优', '符合国标', '达标'];
  2278. if (!passValue.includes(row.assess)) {
  2279. return 'warning-row';
  2280. }
  2281. return '';
  2282. },
  2283. getCustormList() {
  2284. let postParams = {
  2285. "criteria": {
  2286. "projectId": this.projectId,
  2287. "startDate": this.startDate
  2288. }
  2289. }
  2290. // console.log(queryCustormList,77777)
  2291. queryCustormList({ postParams }).then(res => {
  2292. this.custormList = res.data || [];
  2293. const weekType = {
  2294. WeekDay: "工作日",
  2295. Weekend: "周末",
  2296. Holiday: "假日"
  2297. }
  2298. this.custormList.forEach(item => {
  2299. item.dayType = (item.endMinValue ? (item.endMinValue.slice(0, 2) + ':' + item.endMinValue.slice(2, 4)) : '-') + '~' + (item.endMaxValue ? (item.endMaxValue.slice(0, 2) + ':' + item.endMaxValue.slice(2, 4)) : '-');
  2300. })
  2301. })
  2302. },
  2303. changeInput(e, type) {
  2304. this.tableSave(e, type)
  2305. },
  2306. // 周报期数
  2307. getWeekNumber() {
  2308. let getParams = {
  2309. projectId: this.projectId,
  2310. startDate: this.startDate
  2311. }
  2312. queryWeekNumberHttp({ getParams }).then(res => {
  2313. // 总共的周报数量totalReportCount 年当前期数yearReportNum
  2314. this.totalReportCount = res.totalReportCount;
  2315. this.yearReportNum = res.yearReportNum;
  2316. })
  2317. },
  2318. async getSeasontype(falg = true) {
  2319. let getParams = {
  2320. projectId: this.projectId,
  2321. dateTiime: falg ? this.startDate : this.endDate
  2322. }
  2323. await querySeason({ getParams }).then(res => {
  2324. this.seasonType = res.content && res.content[0].seasonType || 'Warm';
  2325. })
  2326. },
  2327. tableSave(e, type) {
  2328. let getParams = {
  2329. projectId: this.projectId,
  2330. spaceId: e.spaceId,
  2331. startDate: this.startDate,
  2332. }
  2333. getParams[type + 'Remark'] = e[type + 'Remark'];
  2334. explainSave({ getParams }).then(res => {
  2335. })
  2336. },
  2337. dataChange(value) {
  2338. if (value) {
  2339. this.startDate = moment(value[0]).format("YYYYMMDD");
  2340. this.endDate = moment(value[1]).format("YYYYMMDD");
  2341. this.portDate = [moment(value[0]), moment(value[1])];
  2342. this.getweekDate(this.startDate, this.endDate);
  2343. this.getTableList("hotProprotion", "hotgirdDate", "hotRemark");
  2344. this.getTableList("coldProprotion", "coldgirdDate", "coldRemark");
  2345. this.getTableList("co2AbnormalTime", "co2girdDate", "co2Remark", 1000);
  2346. this.getTableList("hchoAbnormalTime", "hchogirdDate", "hchoRemark", 0.1);
  2347. this.getDayDate();
  2348. }
  2349. },
  2350. getWeekSpace(value) {
  2351. let postParams = {
  2352. "criteria": {
  2353. "projectId": this.projectId,
  2354. "startDate": this.startDate,
  2355. "endDate": this.endDate,
  2356. // "type":value,//0 内外区 1 朝向 2 楼层 3 新风机组 4 温度 5 湿度 6 co2 7 pm2.5 8 甲醛
  2357. }
  2358. }
  2359. if (value) {
  2360. postParams.criteria.type = 2;
  2361. }
  2362. queryWeekSpace({ postParams }).then(res => {
  2363. if (!res.content) {
  2364. return
  2365. }
  2366. let obj = {};
  2367. if (!value) {
  2368. let keyMap = {
  2369. 11: "CO2",
  2370. 13: "HCHO",
  2371. 10: "RH",
  2372. 12: "PM2d5",
  2373. 9: "Tdb",
  2374. 16: 'userAdjust',
  2375. 17: 'energyManage'
  2376. }
  2377. this.localtionTable.forEach(item => {
  2378. !(item == 'floorChart') && (obj[item] = []);
  2379. })
  2380. res.content.forEach(item => {
  2381. if (item.type < 4) {
  2382. item.type !== 2 && obj[this.localtionTable[item.type]].push(item);
  2383. } else if (item.type <= 8) {
  2384. let ctypeMap = { 4: 0, 5: 3, 6: 1, 7: 4, 8: 2 };
  2385. let ctype = ctypeMap[item.type];
  2386. //4 5 6 7 8
  2387. if (ctype == 4) {
  2388. this.surveyTable[ctype].weekAvg = (typeof item.avgDate == "number") ? (item.avgDate * this.multipleInit(item.startDate, 'week')).toFixed(this.surveyTable[ctype].init) : '--';
  2389. } else {
  2390. this.surveyTable[ctype].weekAvg = (typeof item.avgDate == "number") ? item.avgDate.toFixed(this.surveyTable[ctype].init) : '--';
  2391. }
  2392. (typeof item.normalProprotion == "number") && (this.surveyTable[ctype].weeknormalProprotion = (item.normalProprotion * 100).toFixed(0));
  2393. (typeof item.coldProprotion == "number") && (this.surveyTable[ctype].weekcoldProprotion = (item.coldProprotion * 100).toFixed(0));
  2394. (typeof item.hotProprotion == "number") && (this.surveyTable[ctype].weekhotProprotion = (item.hotProprotion * 100).toFixed(0));
  2395. (typeof item.chainRatio == "number") && (this.surveyTable[ctype].chainRatio = (item.chainRatio * 100).toFixed(0));
  2396. (typeof item.coldChainRatio == "number") && (this.surveyTable[ctype].coldChainRatio = (item.coldChainRatio * 100).toFixed(0));
  2397. (typeof item.hotChainRatio == "number") && (this.surveyTable[ctype].hotChainRatio = (item.hotChainRatio * 100).toFixed(0));
  2398. (typeof item.overNormalProprotion == "number") && (this.surveyTable[ctype].overNormalProprotion = (item.overNormalProprotion * 100).toFixed(0));
  2399. (typeof item.partialDryRate == "number") && (this.surveyTable[ctype].partialDryRate = (item.partialDryRate * 100).toFixed(0));
  2400. (typeof item.partialHumidityRate == "number") && (this.surveyTable[ctype].partialHumidityRate = (item.partialHumidityRate * 100).toFixed(0));
  2401. } else if (item.type === 14 || item.type === 15) {
  2402. let ctypeMap = { 14: 5, 15: 6 };
  2403. let ctype = ctypeMap[item.type];
  2404. let intList = {
  2405. totalEnergy: 1,
  2406. acTotalEnergy: 1,
  2407. acColdHotTotalEnergy: 1,
  2408. acTerTotalEnergy: 1,
  2409. seTotalEnergy: 1,
  2410. othersTotalEnergy: 1,
  2411. monthEnergy: 1,
  2412. yearEnergy: 1,
  2413. }
  2414. for (let key in item) {
  2415. intList[key] && (item[key] = parseInt(item[key]));
  2416. this.$set(this.surveyTable[ctype], key, item[key]);
  2417. }
  2418. } else {
  2419. this.$set(this.quarterRemark, keyMap[item.type], item.quarterRemark || '');
  2420. !this.remarkId[keyMap[item.type]] && (this.remarkId[keyMap[item.type]] = item.id || '');
  2421. item.type == 9 && (this.typeRemark = item.typeRemark || '');
  2422. }
  2423. })
  2424. for (let k in obj) {
  2425. if (k == "orientationChart") {
  2426. obj[k] = obj[k].sort((a, b) => a.typeCategory - b.typeCategory)
  2427. }
  2428. this.localtionDate[k] = this.arreyInit(obj[k]) || {};
  2429. }
  2430. this.surveyTable.forEach((item, index) => {
  2431. if (item.weekAvg || item.weekAvg == 0) {
  2432. // 判断评价
  2433. item.assess = this.makeAssess(item, index);
  2434. }
  2435. })
  2436. this.surveyTable[0].img && (this.reportImg = require(`../../../../static/images/${this.surveyTable[0].img}.png`));
  2437. } else {
  2438. obj.floorChart = res.content || [];
  2439. obj.floorChart = obj.floorChart.filter(item => item.objectName !== '楼顶');
  2440. this.localtionDate.floorChart = this.arreyInit(obj.floorChart) || {};
  2441. }
  2442. })
  2443. },
  2444. makeAssess(value, sgin) {
  2445. let assessList = [];
  2446. if (value.weekAvg == '--') {
  2447. return '--'
  2448. }
  2449. assessList.push(Number(value.weekAvg));
  2450. if (value.name == "温度" && this.seasonType) {
  2451. if (this.seasonType !== "Warm") {
  2452. value.assessTable = value.assessColdTable || []
  2453. } else {
  2454. value.assessTable = value.assessHotTable || [];
  2455. }
  2456. }
  2457. value.assessTable && value.assessTable.forEach(item => {
  2458. (typeof (item.min) === "number") && assessList.push(item.min);
  2459. })
  2460. assessList.sort((a, b) => a - b);
  2461. let index = assessList.lastIndexOf(Number(value.weekAvg)) || 1;
  2462. if (value.name == "温度") {
  2463. this.surveyTable[sgin].img = this.imgList[index - 1];
  2464. } else {
  2465. this.$set(this.surveyTable[sgin], 'img', value.assessTable[index - 1].type || 'happy');
  2466. // this.surveyTable[sgin].img = value.assessTable[index-1].type || 'happy';
  2467. }
  2468. return (value.assessTable[index - 1] && value.assessTable[index - 1].name) || '--';
  2469. },
  2470. getStandardList() {
  2471. let postParams = {
  2472. "criteria": {
  2473. "projectId": this.projectId,
  2474. "startDate": this.startDate
  2475. }
  2476. };
  2477. queryStandardList({ postParams }).then(res => {
  2478. this.StandardList = res.data || [];
  2479. })
  2480. },
  2481. getUserActivity() {
  2482. let postParams = {
  2483. "criteria": {
  2484. "projectId": this.projectId,
  2485. starDate: this.startDate,
  2486. endDate: this.endDate,
  2487. // "createTime":{
  2488. // "$gte":this.startDate.slice(0,4)+'-'+this.startDate.slice(4,6)+'-'+this.startDate.slice(6,8) ,
  2489. // "$lte":this.endDate.slice(0,4)+'-'+this.endDate.slice(4,6)+'-'+this.endDate.slice(6,8)
  2490. // },
  2491. },
  2492. }
  2493. queryUserActivity({ postParams }).then(res => {
  2494. this.userDate = res;
  2495. })
  2496. },
  2497. // 获取周逐刻
  2498. getTempRate() {
  2499. let postParams = {
  2500. "criteria": {
  2501. "projectId": this.projectId,
  2502. "date": {
  2503. "$gte": this.startDate,
  2504. "$lte": this.endDate
  2505. },
  2506. }
  2507. }
  2508. postParams.criteria.time = { $gte: "060000", $lte: "200000" };
  2509. queryTempRate({ postParams }).then(res => {
  2510. if (res.data) {
  2511. this.chartweekTemp = this.arreyInit(res.data);
  2512. this.chartweekTemp.coldSpaceProprotion && (this.chartweekTemp.coldProprotion = this.chartweekTemp.coldSpaceProprotion);
  2513. this.chartweekTemp.hotSpaceProprotion && (this.chartweekTemp.hotProprotion = this.chartweekTemp.hotSpaceProprotion);
  2514. this.chartweekTemp.normalSpaceProprotion && (this.chartweekTemp.normalProprotion = this.chartweekTemp.normalSpaceProprotion);
  2515. }
  2516. })
  2517. },
  2518. toDomposition(id) {
  2519. document.querySelector('#' + id).scrollIntoView(true)
  2520. },
  2521. // 14天
  2522. getweekDate(start, end) {
  2523. start = moment(start).subtract('days', 7).format("YYYYMMDD");
  2524. let postParams = {
  2525. "criteria": {
  2526. "projectId": this.projectId,
  2527. "date": {
  2528. "$gte": start,
  2529. "$lte": end
  2530. }
  2531. },
  2532. orders: [
  2533. {
  2534. column: "date",
  2535. asc: true,
  2536. }
  2537. ]
  2538. }
  2539. queryWeekday({ postParams }).then(res => {
  2540. res.count ? (this.chartweekDate = this.arreyInit(res.content, 'custom')) : (this.chartweekDate = {});
  2541. })
  2542. },
  2543. // 7天
  2544. async getDayDate() {
  2545. let postParams = {
  2546. "criteria": {
  2547. "projectId": this.projectId,
  2548. "date": {
  2549. "$gte": this.startDate,
  2550. "$lte": this.endDate
  2551. }
  2552. }
  2553. }
  2554. this.daysDate = [];
  2555. this.numIndex = 0;
  2556. // 周上
  2557. let custompostParams = JSON.parse(JSON.stringify(postParams));
  2558. custompostParams.criteria.time = { $gte: "060000", $lte: "200000" };
  2559. custompostParams.orders = [{ "column": "time", "asc": "true" }];
  2560. // Promise.all([
  2561. // queryDay({postParams:custompostParams}),
  2562. // querysectionSpace({postParams}),
  2563. // querysectionFloor({postParams})
  2564. // ]).then(data=>{
  2565. // console.log(data,"------------------------")
  2566. // })
  2567. await queryDay({ postParams: custompostParams }).then(async res => {
  2568. if (res.count) {
  2569. await this.getDategroup(res.content, "chartDate")
  2570. } else {
  2571. this.getDategroup([], "chartDate")
  2572. }
  2573. })
  2574. // 周左
  2575. querysectionSpace({ postParams }).then(async res => {
  2576. if (res.data) {
  2577. await this.getDategroup(res.data, "chartDateLeft");
  2578. } else {
  2579. this.getDategroup([], "chartDateLeft")
  2580. }
  2581. })
  2582. // 周右
  2583. querysectionFloor({ postParams }).then(async res => {
  2584. if (res.data) {
  2585. await this.getDategroup(res.data, "chartDateRight")
  2586. } else {
  2587. this.getDategroup([], "chartDateRight")
  2588. }
  2589. })
  2590. },
  2591. getDategroup(value, type) {
  2592. if (!Array.isArray(value)) {
  2593. return
  2594. }
  2595. this.numIndex = this.numIndex + 1;
  2596. let obj = {}
  2597. value.map(v => {
  2598. obj[v.date] = 0
  2599. })
  2600. let dataListlen = Object.keys(obj);
  2601. let dataList = dataListlen;
  2602. let result = dataList.map(v => {
  2603. let resObj = { name: v, pname: this.getWeek(moment(v).format('E')) };
  2604. resObj[type] = value.filter(_v => v == _v.date)
  2605. return resObj
  2606. })
  2607. if (this.daysDate && this.daysDate.length) {
  2608. this.daysDate.forEach(item => {
  2609. item = Object.assign(item, result.filter(_v => _v.name === item.name)[0])
  2610. if (type == "chartDate" && Array.isArray(item.chartDate)) {
  2611. item.chartDate = this.arreyInit(item.chartDate)
  2612. }
  2613. if (type == "chartDateRight" && Array.isArray(item.chartDateRight)) {
  2614. item.chartDateRight = this.arreyInit(item.chartDateRight)
  2615. }
  2616. })
  2617. } else {
  2618. this.daysDate = result;
  2619. this.daysDate.forEach(item => {
  2620. if (type == "chartDate" && Array.isArray(item.chartDate)) {
  2621. item.chartDate = this.arreyInit(item.chartDate)
  2622. }
  2623. if (type == "chartDateRight" && Array.isArray(item.chartDateRight)) {
  2624. item.chartDateRight = this.arreyInit(item.chartDateRight)
  2625. }
  2626. })
  2627. }
  2628. this.dayData = [];
  2629. let onceFlag = false;
  2630. this.daysDate.forEach((item, index) => {
  2631. if (!onceFlag) {
  2632. this.tableItem = index;
  2633. onceFlag = true;
  2634. }
  2635. let obj = {
  2636. name: `周${item.pname}`,
  2637. id: index
  2638. }
  2639. this.dayData.push(obj);
  2640. })
  2641. },
  2642. initTableTime(serviceTime) {
  2643. serviceTime = (serviceTime / 60)
  2644. let stringnumber = serviceTime.toString();
  2645. serviceTime = stringnumber.indexOf('.') === -1 ? serviceTime : serviceTime.toFixed(2);
  2646. return serviceTime
  2647. },
  2648. getTableList(value, date, remark, assessNum) {
  2649. let postParams = {
  2650. "criteria": {
  2651. "projectId": this.projectId,
  2652. "startDate": this.startDate,
  2653. },
  2654. page: 1,
  2655. size: 10,
  2656. "orders": [{ "column": value, "asc": false }]//hotProprotion 偏热列表 coldProprotion 偏冷列表
  2657. }
  2658. querySubstandardList({ postParams }).then(res => {
  2659. if (res.content) {
  2660. res.content.forEach(item => {
  2661. if (value == "hotProprotion") {
  2662. item.hotProprotion = parseInt(item.hotProprotion * 100);
  2663. } else {
  2664. item.coldProprotion = parseInt(item.coldProprotion * 100);
  2665. }
  2666. item.abnormalProprotion && (item.abnormalProprotion = parseInt(item.abnormalProprotion * 100));
  2667. item.validProprotion = typeof item.validProprotion == "number" ? parseInt(item.validProprotion * 100) : '--';
  2668. item.avgTemp = typeof item.avgTemp == "number" ? item.avgTemp.toFixed(1) : '--';
  2669. item.serviceTime && (item.serviceTime = this.initTableTime(item.serviceTime));
  2670. item.co2AbnormalTime && (item.co2AbnormalTime = this.initTableTime(item.co2AbnormalTime));
  2671. item.hchoAbnormalTime && (item.hchoAbnormalTime = this.initTableTime(item.hchoAbnormalTime));
  2672. })
  2673. res.content = res.content.filter(item => { return item.avgTemp !== '--' })
  2674. }
  2675. this[date] = res.content || [];
  2676. this[date].length && this[date].forEach((item, index) => {
  2677. this.$set(this[date][index], remark, item[remark] || '');
  2678. })
  2679. if (value === "hotProprotion" || value === "coldProprotion") {
  2680. this[date] = this[date].filter((item, index) => {
  2681. return item[value] >= 10 && item.avgTemp !== '--';
  2682. })
  2683. }
  2684. if (value === "co2AbnormalTime" || value === "hchoAbnormalTime") {
  2685. this[date] = this[date].slice(0, 5);
  2686. this[date] = this[date].filter(item => {
  2687. if (value === "co2AbnormalTime") {
  2688. return item.co2MaxSolubility > assessNum
  2689. } else {
  2690. return item.hchoMaxSolubility > assessNum
  2691. }
  2692. })
  2693. }
  2694. assessNum && this[date].forEach(item => {
  2695. if (value === "co2AbnormalTime") {
  2696. item.assess = item.co2MaxSolubility > assessNum ? '较高' : '正常';
  2697. item.co2MaxSolubility = (typeof (item.co2MaxSolubility) == 'number') ? item.co2MaxSolubility.toFixed(0) : '--';
  2698. } else {
  2699. item.assess = item.hchoMaxSolubility > assessNum ? '较高' : '正常';
  2700. item.hchoMaxSolubility = item.hchoMaxSolubility.toFixed(2);
  2701. }
  2702. })
  2703. })
  2704. },
  2705. generateDate(startDate, day) {
  2706. let start;
  2707. let startList = [];
  2708. for (let i = 0; i < day; i++) {
  2709. start = moment(startDate);
  2710. startList.push(start.add("days", i).format("YYYYMMDD"))
  2711. }
  2712. return startList
  2713. },
  2714. generateTime() {
  2715. let Timearray = [
  2716. "060000", "061500", "063000", "064500", "070000", "071500", "0,78000", "074500", "080000", "081500", "083000", "084500", "090000", "091500", "093000"
  2717. , "094500", "100000", "101500", "103000", "104500", "110000", "111500", "113000", "114500", "120000", "121500", "123000", "124500"
  2718. , "130000", "131500", "133000", "134500", "140000", "141500", "143000", "144500", "150000", "151500", "153000", "154500", "160000"
  2719. , "161500", "163000", "164500", "170000", "171500", "173000", "174500", "180000", "181500", "183000", "184500", "190000", "191500"
  2720. , "193000", "194500", "200000"
  2721. ]
  2722. return Timearray
  2723. },
  2724. arreyInit(arr, type) {
  2725. if (arr && !arr.length) {
  2726. return
  2727. }
  2728. if (type && type == 'custom') {
  2729. let startTime = moment(this.startDate).subtract('days', 7).format("YYYYMMDD")
  2730. let dataList = this.generateDate(startTime, 14);
  2731. let copeArr = dataList.map(index => {
  2732. let items = arr.filter(v => index === v.date).length && arr.filter(v => index === v.date)[0];
  2733. items.avgPm2d5 && (items.avgPm2d5 = items.avgPm2d5 * this.multipleInit(items.date, 'day'));
  2734. let itemsModel = {
  2735. avgTemp: -9999,
  2736. coldLastTime: -9999,
  2737. coldProprotion: -9999,
  2738. createTime: -9999,
  2739. date: index,
  2740. daySpaceNum: -9999,
  2741. hotLastTime: -9999,
  2742. hotProprotion: -9999,
  2743. initializeServiceCustomizationTime: -9999,
  2744. normalLastTime: -9999,
  2745. normalProprotion: -9999,
  2746. registeredSpaceNum: -9999,
  2747. }
  2748. return items ? items : { ...itemsModel, ...items }
  2749. })
  2750. arr = copeArr;
  2751. }
  2752. const obj = {};
  2753. let keysIndex = this.getKeysIndex(arr)
  2754. let keysArr = arr[keysIndex] && Object.keys(arr[keysIndex]);
  2755. keysArr.forEach(item => {
  2756. obj[item] = [];
  2757. })
  2758. arr.forEach(item => {
  2759. for (let keys in keysArr) {
  2760. if (!item.hasOwnProperty(keysArr[keys])) {
  2761. item[keysArr[keys]] = "-9999"
  2762. }
  2763. }
  2764. for (let key in item) {
  2765. item[key] = Number(item[key]) === -9999 ? null : item[key];
  2766. obj[key].push(item[key]);
  2767. }
  2768. });
  2769. return obj
  2770. },
  2771. getWeek(week) {
  2772. switch (Number(week)) {
  2773. case 1:
  2774. return '一'
  2775. case 2:
  2776. return '二'
  2777. case 3:
  2778. return '三'
  2779. case 4:
  2780. return '四'
  2781. case 5:
  2782. return '五'
  2783. case 6:
  2784. return '六'
  2785. case 7:
  2786. return '日'
  2787. default:
  2788. return '--'
  2789. }
  2790. },
  2791. getKeysIndex(arr) {
  2792. let value = JSON.parse(JSON.stringify(arr));
  2793. let valueArr = value.map(item => {
  2794. return item && Object.keys(item).length || 0
  2795. });
  2796. // let valueCope = value.filter(Boolean);
  2797. let valueCope = Math.max.call(null, ...valueArr);
  2798. return valueArr.indexOf(valueCope)
  2799. },
  2800. exportClick() {
  2801. this.getPdf('exportPdf', `${this.projectName} - 环境周报 ${moment(this.startDate).format("MM.DD")}~${moment(this.endDate).format("MM.DD")}`, `${this.projectName}`)
  2802. },
  2803. getEmailDate() {
  2804. let postParams = {
  2805. "criteria": {
  2806. "projectId": this.projectId,
  2807. },
  2808. "orders": [
  2809. {
  2810. "column": "updateTime",
  2811. "asc": false
  2812. }
  2813. ]
  2814. }
  2815. queryEmail({ postParams }).then(res => {
  2816. if (res.count) {
  2817. this.emailData = res.content;
  2818. this.noEmailuser = false;
  2819. } else {
  2820. this.noEmailuser = true
  2821. }
  2822. })
  2823. },
  2824. emailClick() {
  2825. // sagacloud-pdf-pages
  2826. let sendTime = moment().week(moment().week()).startOf('week').valueOf();
  2827. let postParams = {
  2828. "criteria": {
  2829. "projectId": this.projectId,
  2830. "sendTime": {
  2831. "$gte": sendTime + '' // 本周的开始时间,用于查询出已经发出过周报的邮箱
  2832. }
  2833. },
  2834. "orders": [
  2835. {
  2836. "column": "updateTime",
  2837. "asc": false
  2838. }
  2839. ]
  2840. }
  2841. queryEmail({ postParams }).then(res => {
  2842. if (res.count) {
  2843. // 已发送
  2844. this.checkSendEmail = true;
  2845. this.sendedUser = [];
  2846. this.noSendUser = [];
  2847. res.content.forEach(item => {
  2848. if (item.emailRecords && item.emailRecords.length) {
  2849. // 已发送的数据
  2850. this.sendedUser.push(item);
  2851. } else {
  2852. // 未发送的数据
  2853. this.noSendUser.push(item);
  2854. }
  2855. })
  2856. }
  2857. if (this.noSendUser.length === res.count) {
  2858. // 未发送
  2859. this.checkSendEmail = false
  2860. }
  2861. this.emailVisible = true;
  2862. })
  2863. },
  2864. sendEmail() {
  2865. let postParams = {
  2866. ids: [],
  2867. lastWeekMonday: this.startDate,
  2868. lastWeekSunday: this.endDate
  2869. }
  2870. if (!this.checkSendEmail) {
  2871. this.emailData.forEach((item) => {
  2872. postParams.ids.push(item.id)
  2873. })
  2874. } else {
  2875. postParams.ids = this.emailCheckList.concat(this.nosendCheckList)
  2876. }
  2877. passEmail({ postParams }).then(res => {
  2878. if (res.result = "success") {
  2879. this.$message.success('发送成功')
  2880. } else {
  2881. this.$message.error; ('发送失败')
  2882. }
  2883. this.emailVisible = false;
  2884. })
  2885. },
  2886. multipleInit(valDate, dateFlag) {
  2887. // 根据项目 和 日期判断数值
  2888. // 博瑞尚格 且 week 小于 5月3日 ; day 小于 5月8日的 乘1000
  2889. valDate = Number(valDate);
  2890. if (this.projectId === "Pj1101080259") {
  2891. if ((dateFlag === 'week' && valDate < 20210503) || (dateFlag === 'day' && valDate < 20210508)) {
  2892. return 1000;
  2893. }
  2894. }
  2895. return 1
  2896. },
  2897. },
  2898. watch: {
  2899. comstartDate: {
  2900. handler(newval) {
  2901. this.comstartDate = newval;
  2902. if (!this.comstartDate) {
  2903. return
  2904. }
  2905. this.dataChange([this.comstartDate, this.comendDate])
  2906. },
  2907. immediate: true
  2908. },
  2909. portDate(newval) {
  2910. this.portDate = newval;
  2911. },
  2912. tableItem() {
  2913. this.daysDateCurrent[0] = this.daysDate[this.tableItem];
  2914. },
  2915. chartweekDate: {
  2916. handler(newval) {
  2917. this.chartweekDate = newval;
  2918. },
  2919. deep: true
  2920. },
  2921. daysDate: {
  2922. handler(newval) {
  2923. this.daysDate = newval;
  2924. },
  2925. deep: true
  2926. },
  2927. numIndex(newval) {
  2928. if (this.numIndex == 3) {
  2929. this.daysDate = this.daysDate.filter(item => {
  2930. if (!!(item.chartDate || item.chartDateRight || (item.chartDateLeft && item.chartDateLeft.length))) {
  2931. return item
  2932. }
  2933. })
  2934. this.daysDate.forEach(item => {
  2935. let timeObj = item.chartDate.time;
  2936. (timeObj && timeObj.length !== 57) && this.timeArray.forEach((items, index) => {
  2937. if (!timeObj.includes(items)) {
  2938. item.chartDate.avgTemp && item.chartDate.avgTemp.splice(index, 0, null)
  2939. item.chartDate.coldSpaceNum && item.chartDate.coldSpaceNum.splice(index, 0, 0)
  2940. item.chartDate.coldSpaceProprotion && item.chartDate.coldSpaceProprotion.splice(index, 0, 0)
  2941. item.chartDate.hotSpaceNum && item.chartDate.hotSpaceNum.splice(index, 0, 0)
  2942. item.chartDate.hotSpaceProprotion && item.chartDate.hotSpaceProprotion.splice(index, 0, 0)
  2943. item.chartDate.normalSpaceNum && item.chartDate.normalSpaceNum.splice(index, 0, 0);
  2944. item.chartDate.normalSpaceProprotion && item.chartDate.normalSpaceProprotion.splice(index, 0, 0);
  2945. !item.chartDate.outSideTemp && (item.chartDate.outSideTemp = []);
  2946. (items.slice(1) == '0000') ? item.chartDate.outSideTemp.splice(Number(items.slice(0, 2)) - 6, 0, '-') : item.chartDate.outSideTemp.splice(index, 0, null);
  2947. item.chartDate.spaceNum && item.chartDate.spaceNum.splice(index, 0, 0);
  2948. item.chartDate.time.splice(index, 0, items);
  2949. }
  2950. })
  2951. })
  2952. this.dataDeal = true;
  2953. } else {
  2954. this.dataDeal = false;
  2955. }
  2956. }
  2957. },
  2958. computed: {
  2959. // ...mapGetters(['projectId']),
  2960. isUserorEngry() {
  2961. return function (value) {
  2962. if (value) {
  2963. return this.isSpecialType.includes(value)
  2964. }
  2965. return this.isSpecialType.includes(this.envType)
  2966. }
  2967. },
  2968. currentEnv() {
  2969. return this.surveyTable.findIndex(item => {
  2970. return item.id == this.envType
  2971. })
  2972. },
  2973. envTypelistnow() {
  2974. if (this.projectId !== "Pj1101080259") {
  2975. return this.envTypelist.slice(0, 6)
  2976. }
  2977. return this.envTypelist
  2978. },
  2979. surveyTablenow() {
  2980. if (this.projectId !== "Pj1101080259") {
  2981. return this.surveyTable.slice(0, 6)
  2982. }
  2983. return this.surveyTable
  2984. }
  2985. // slicesurveyTable(){
  2986. // return this.surveyTable.slice(0,5)
  2987. // }
  2988. },
  2989. }
  2990. </script>
  2991. <style lang="less" scoped>
  2992. .sended {
  2993. line-height: 25px;
  2994. }
  2995. .download_box {
  2996. display: flex;
  2997. justify-content: flex-end;
  2998. padding: 20px 20px 0 0;
  2999. // margin-bottom: 20px;
  3000. .ml20 {
  3001. margin-left: 20px;
  3002. }
  3003. }
  3004. .mp40 {
  3005. margin-top: 40px;
  3006. }
  3007. .mp80 {
  3008. margin-top: 170px;
  3009. }
  3010. .mp990 {
  3011. margin-top: 1020px;
  3012. }
  3013. .mp140 {
  3014. margin-top: 90px;
  3015. }
  3016. .mp400 {
  3017. margin-top: 620px;
  3018. }
  3019. .marginList(@Name,@number) {
  3020. .mb@{number} {
  3021. margin-@{Name}: @number*1px;
  3022. }
  3023. }
  3024. @bottom: 0, 5, 10, 16, 32, 40, 52, 100, 180, 200, 250, 300, 380, 430, 350, 475,
  3025. 480, 330, 450, 500, 520, 600, 690, 730, 900;
  3026. .loopMarginList(@i) when (@i < (length(@bottom)+1)) {
  3027. .marginList(bottom, extract(@bottom, @i));
  3028. .loopMarginList(@i+1);
  3029. }
  3030. .loopMarginList(1);
  3031. .pr65 {
  3032. padding-right: 65px;
  3033. }
  3034. .addmarkhg {
  3035. height: 200px;
  3036. }
  3037. .addmark {
  3038. user-select: none;
  3039. margin-top: 30px;
  3040. .remark_txt {
  3041. padding-bottom: 12px;
  3042. color: #1f2429;
  3043. font-size: 14px;
  3044. }
  3045. .remarkshow {
  3046. width: 100%;
  3047. height: 80px;
  3048. background: #f7f7f7;
  3049. padding: 10px;
  3050. box-sizing: border-box;
  3051. border-radius: 8px;
  3052. }
  3053. .remark_input {
  3054. margin-bottom: 20px;
  3055. }
  3056. }
  3057. .ml17 {
  3058. margin: 0 0 20px 31px;
  3059. position: relative;
  3060. &::before {
  3061. content: "";
  3062. display: inline-block;
  3063. position: absolute;
  3064. top: 7px;
  3065. left: -15px;
  3066. width: 6px;
  3067. height: 6px;
  3068. border-radius: 50%;
  3069. border: 1px solid #8d9399;
  3070. }
  3071. & > p {
  3072. margin: 0 0 8px 0;
  3073. }
  3074. }
  3075. .page_main {
  3076. width: 1300px; //最合适宽度
  3077. margin: auto;
  3078. position: relative;
  3079. background: #f7f9fa;
  3080. .page_header {
  3081. text-align: center;
  3082. // background: #ffffff;
  3083. position: relative;
  3084. padding: 40px 0 28px; //60px
  3085. padding-top: 10px;
  3086. font-size: 30px;
  3087. color: rgba(31, 36, 41, 1);
  3088. span {
  3089. font-size: 24px;
  3090. font-family: serif;
  3091. }
  3092. .pname {
  3093. position: absolute;
  3094. font-size: 24px;
  3095. right: 40px;
  3096. top: 49px;
  3097. }
  3098. }
  3099. .title_one_table {
  3100. & > .sj_table {
  3101. font-size: 16px;
  3102. }
  3103. }
  3104. .env_module {
  3105. background: #ffffff;
  3106. // overflow: hidden;
  3107. border-radius: 8px;
  3108. padding: 24px 0 48px 20px;
  3109. & /deep/ .el-table thead > tr {
  3110. background: #f8f9fa;
  3111. }
  3112. & /deep/ .el-table .warning-row {
  3113. background: #fff5e9;
  3114. color: #de7802;
  3115. }
  3116. .daytabs {
  3117. margin-left: 16px;
  3118. }
  3119. .sj_title {
  3120. text-align: center;
  3121. margin: 28px auto 36px;
  3122. font-size: 24px;
  3123. color: #1f2429;
  3124. line-height: 24px;
  3125. }
  3126. .title_one {
  3127. font-size: 26px;
  3128. }
  3129. .pm_container {
  3130. & > p {
  3131. font-size: 16px;
  3132. color: #1f2429;
  3133. padding: 26px 0;
  3134. }
  3135. .pm_table {
  3136. display: flex;
  3137. .left {
  3138. flex: 1;
  3139. padding: 0 50px 0 10px;
  3140. .pm_chart {
  3141. height: 250px;
  3142. }
  3143. .pm_count {
  3144. font-size: 14px;
  3145. margin-bottom: 15px;
  3146. span {
  3147. font-size: 20px;
  3148. }
  3149. }
  3150. }
  3151. .right {
  3152. margin-right: 52px;
  3153. width: 679px;
  3154. & /deep/ .el-table--mini td,
  3155. .el-table--mini th {
  3156. padding: 8px 0;
  3157. }
  3158. }
  3159. }
  3160. }
  3161. .sj_table {
  3162. margin-bottom: 18px;
  3163. }
  3164. .title_tips {
  3165. font-size: 12px;
  3166. font-weight: 400;
  3167. color: #8d9399;
  3168. line-height: 20px;
  3169. & > i {
  3170. margin-right: 5px;
  3171. }
  3172. }
  3173. .big_tips {
  3174. font-size: 14px;
  3175. }
  3176. .charttext_p {
  3177. float: right;
  3178. margin-top: 7px;
  3179. }
  3180. .charttext {
  3181. float: right;
  3182. }
  3183. .content_title {
  3184. font-size: 20px;
  3185. // display: inline-block;
  3186. margin-bottom: 24px;
  3187. &::before {
  3188. content: "";
  3189. display: inline-block;
  3190. width: 4px;
  3191. height: 20px;
  3192. margin: 4px 8px 0 0;
  3193. background-color: rgba(51, 153, 255, 1);
  3194. }
  3195. span {
  3196. vertical-align: top;
  3197. }
  3198. span:nth-child(2) {
  3199. font-size: 16px;
  3200. vertical-align: text-top;
  3201. color: #646a73;
  3202. }
  3203. }
  3204. .content_title_gray {
  3205. font-size: 16px;
  3206. line-height: 28px;
  3207. &::before {
  3208. background-color: #8d9399;
  3209. }
  3210. }
  3211. .content_title_noline {
  3212. font-size: 16px;
  3213. color: #1f2429;
  3214. line-height: 22px;
  3215. margin-left: 12px;
  3216. display: inline-block;
  3217. }
  3218. .room_table {
  3219. height: 56px;
  3220. margin: 0px 0 40px -30px;
  3221. & > div {
  3222. display: flex;
  3223. flex-direction: row;
  3224. align-items: center;
  3225. padding: 0 10px;
  3226. & > div:nth-child(1) {
  3227. width: 80px;
  3228. margin-right: 5px;
  3229. }
  3230. & > div:not(:first-child) {
  3231. text-align: center;
  3232. min-width: 40px;
  3233. }
  3234. & > div {
  3235. // margin-right: 33px;
  3236. // margin-right: 42.5px;
  3237. margin-right: 46.5px;
  3238. }
  3239. }
  3240. .room_table_name {
  3241. background: #f8f9fa;
  3242. height: 32px;
  3243. }
  3244. .room_table_number {
  3245. position: relative;
  3246. display: flex;
  3247. font-size: 14px;
  3248. & > div:nth-child(1) {
  3249. position: absolute;
  3250. left: 10px;
  3251. width: 71px;
  3252. line-height: 16px;
  3253. }
  3254. & > div:nth-child(2) {
  3255. flex: 1;
  3256. display: flex;
  3257. padding-left: 65px;
  3258. justify-content: space-around;
  3259. & > div {
  3260. min-width: 9px;
  3261. min-width: 13px;
  3262. }
  3263. }
  3264. margin-top: 8px;
  3265. height: 36px;
  3266. line-height: 36px;
  3267. border-bottom: 1px solid #eeeeee;
  3268. border-top: 1px solid #eeeeee;
  3269. // line-height: 50px;
  3270. }
  3271. }
  3272. .room_table_user {
  3273. height: auto;
  3274. }
  3275. .paramlist {
  3276. padding: 0 0 0 12px;
  3277. color: #8d9399;
  3278. .rh_img {
  3279. display: flex;
  3280. align-items: center;
  3281. margin: 8px 0 0 9px;
  3282. img {
  3283. width: 16px;
  3284. height: 16px;
  3285. margin-right: 4px;
  3286. }
  3287. }
  3288. & > li {
  3289. margin: 0 0 20px 0;
  3290. & > p i {
  3291. display: inline-block;
  3292. width: 6px;
  3293. height: 6px;
  3294. margin-right: 7px;
  3295. // background: #0091FF;
  3296. background: #8d9399;
  3297. border-radius: 50%;
  3298. }
  3299. .co2table {
  3300. margin: 16px 0;
  3301. }
  3302. .hum_list {
  3303. display: flex;
  3304. align-items: center;
  3305. margin: 15px 0 9px 10px;
  3306. color: #2b3036;
  3307. div {
  3308. // width: 182px;
  3309. padding: 0 16px;
  3310. height: 32px;
  3311. display: flex;
  3312. margin-right: 53px;
  3313. justify-content: center;
  3314. align-items: center;
  3315. background: #f8f9fa;
  3316. border-radius: 16px;
  3317. img {
  3318. width: 16px;
  3319. height: 16px;
  3320. }
  3321. span {
  3322. margin: 0 10px 0 5px;
  3323. }
  3324. }
  3325. }
  3326. }
  3327. }
  3328. .paramlist_explain {
  3329. & > li > p:nth-child(1) {
  3330. margin: 0 0 8px 0;
  3331. }
  3332. }
  3333. .sj_survey {
  3334. display: flex;
  3335. padding: 0 31px;
  3336. margin: 0 0 14px;
  3337. .sj_survey_left {
  3338. display: flex;
  3339. min-width: 160px;
  3340. max-width: 160px;
  3341. flex-direction: column;
  3342. border-right: 1px solid #eff0f1;
  3343. & > span {
  3344. font-size: 14px;
  3345. color: #646a73;
  3346. line-height: 19px;
  3347. }
  3348. .avgtemp {
  3349. font-size: 42px;
  3350. font-weight: 500;
  3351. color: #1f2329;
  3352. line-height: 59px;
  3353. & > span {
  3354. font-size: 24px;
  3355. }
  3356. }
  3357. .tempstatus {
  3358. width: 96px;
  3359. height: 26px;
  3360. display: flex;
  3361. justify-content: center;
  3362. align-items: center;
  3363. background: #f4f6f9;
  3364. border-radius: 16px;
  3365. color: #8d9399;
  3366. img {
  3367. width: 16px;
  3368. height: 16px;
  3369. margin-right: 6px;
  3370. }
  3371. }
  3372. }
  3373. .sj_survey_right {
  3374. display: flex;
  3375. .survey_chart {
  3376. width: 128px;
  3377. height: 128px;
  3378. margin: 0 82px 0 63px;
  3379. }
  3380. .right_ratelist {
  3381. display: flex;
  3382. flex-direction: row;
  3383. .rate_item {
  3384. margin-right: 106px;
  3385. & > div:nth-child(1) {
  3386. font-size: 14px;
  3387. color: #646a73;
  3388. line-height: 19px;
  3389. }
  3390. & > div:nth-child(2) {
  3391. margin-top: 12px;
  3392. font-size: 14px;
  3393. color: #646a73;
  3394. line-height: 19px;
  3395. div {
  3396. font-size: 28px;
  3397. color: #1f2329;
  3398. line-height: 37px;
  3399. & > span {
  3400. font-size: 12px;
  3401. }
  3402. }
  3403. p {
  3404. font-size: 12px;
  3405. color: #646a73;
  3406. line-height: 17px;
  3407. img {
  3408. width: 9px;
  3409. height: 12px;
  3410. margin-left: 12px;
  3411. }
  3412. }
  3413. }
  3414. }
  3415. }
  3416. }
  3417. }
  3418. .sj_reminder {
  3419. width: 100%;
  3420. padding: 16px 24px 0;
  3421. height: 136px;
  3422. background: #f8f9fa;
  3423. border-radius: 12px;
  3424. & > p {
  3425. font-size: 14px;
  3426. font-weight: 400;
  3427. color: #646c73;
  3428. line-height: 24px;
  3429. }
  3430. & > p:first-child {
  3431. color: #8d9399;
  3432. margin-bottom: 5px;
  3433. }
  3434. }
  3435. .sj_chartbox {
  3436. display: flex;
  3437. padding: 0 15px;
  3438. & > div {
  3439. flex: 1;
  3440. .day_title {
  3441. font-size: 16px;
  3442. color: #1f2429;
  3443. line-height: 22px;
  3444. }
  3445. .chart_sj_bottom {
  3446. display: flex;
  3447. position: relative;
  3448. height: 36px;
  3449. line-height: 36px;
  3450. border-bottom: 1px solid #eeeeee;
  3451. border-top: 1px solid #eeeeee;
  3452. & > div:nth-child(1) {
  3453. position: absolute;
  3454. }
  3455. .twoline {
  3456. left: -22px;
  3457. width: 37px;
  3458. line-height: 16px;
  3459. }
  3460. .chart_sj_bottom_main {
  3461. flex: 1;
  3462. display: flex;
  3463. justify-content: space-around;
  3464. }
  3465. }
  3466. }
  3467. }
  3468. .up_distribution {
  3469. height: 255px;
  3470. position: relative;
  3471. .up_distribution_text {
  3472. position: absolute;
  3473. top: 0;
  3474. right: 400px;
  3475. span {
  3476. display: inline-block;
  3477. width: 12px;
  3478. height: 12px;
  3479. margin-right: 10px;
  3480. background: #ff0000;
  3481. }
  3482. }
  3483. }
  3484. .content_body {
  3485. padding: 10px;
  3486. .body_title {
  3487. overflow: hidden;
  3488. line-height: 44px;
  3489. height: 44px;
  3490. font-size: 14px;
  3491. margin-bottom: 12px;
  3492. border-radius: 4px;
  3493. background: #f8f9fa;
  3494. width: 100%;
  3495. &::before {
  3496. content: "";
  3497. display: inline-block;
  3498. width: 7px;
  3499. height: 44px;
  3500. margin: 0px 8px 0 0;
  3501. background-color: #f9908b;
  3502. }
  3503. span {
  3504. vertical-align: top;
  3505. }
  3506. .temptable {
  3507. height: 400px !important;
  3508. }
  3509. .tabletag {
  3510. display: inline-block;
  3511. // height: 32px;
  3512. padding: 0 10px;
  3513. line-height: 18px;
  3514. font-size: 12px;
  3515. border-radius: 2px;
  3516. box-sizing: border-box;
  3517. white-space: nowrap;
  3518. margin: 13px 10px;
  3519. width: 44px;
  3520. height: 18px;
  3521. }
  3522. .taghot {
  3523. background: #fde3e2;
  3524. color: #ac2f28;
  3525. }
  3526. .tagclod {
  3527. background: #e1f2ff;
  3528. color: #0065b3;
  3529. }
  3530. }
  3531. .day_title {
  3532. display: inline-block;
  3533. height: 22px;
  3534. font-size: 16px;
  3535. color: rgba(31, 36, 41, 1);
  3536. line-height: 22px;
  3537. }
  3538. .oneday_title {
  3539. margin-bottom: 50px;
  3540. }
  3541. .body_coldtitle {
  3542. margin-top: 40px;
  3543. &::before {
  3544. background-color: #0091ff;
  3545. }
  3546. }
  3547. .twochart_box {
  3548. display: flex;
  3549. flex-direction: row;
  3550. & > div {
  3551. flex: 1;
  3552. .daychart {
  3553. min-width: 488px;
  3554. height: 285px;
  3555. }
  3556. .daylinechart {
  3557. margin-top: 25px;
  3558. }
  3559. .daybarchart {
  3560. height: 180px;
  3561. }
  3562. }
  3563. }
  3564. }
  3565. .user_total {
  3566. display: flex;
  3567. flex-wrap: nowrap;
  3568. height: 54px;
  3569. margin-bottom: 48px;
  3570. padding: 0 0 0 10px;
  3571. & > div {
  3572. display: flex;
  3573. flex: 1;
  3574. justify-content: center;
  3575. flex-direction: column;
  3576. align-items: center;
  3577. border-left: 1px solid #eff0f1;
  3578. & > div {
  3579. max-width: 130px;
  3580. min-width: 130px;
  3581. text-align: left;
  3582. }
  3583. & > div:nth-child(1) {
  3584. font-size: 14px;
  3585. color: #646a73;
  3586. line-height: 19px;
  3587. }
  3588. & > div:nth-child(2) {
  3589. font-size: 12px;
  3590. color: #000000;
  3591. line-height: 27px;
  3592. span {
  3593. font-size: 20px;
  3594. }
  3595. }
  3596. }
  3597. & > div:nth-child(1) {
  3598. border-left: 1px solid transparent;
  3599. align-items: flex-start;
  3600. }
  3601. }
  3602. .ft12 {
  3603. font-size: 12px;
  3604. }
  3605. }
  3606. .todom_box {
  3607. padding: 0 20px 20px;
  3608. font-size: 14px;
  3609. color: rgb(0, 145, 255);
  3610. & > div {
  3611. margin-top: 15px;
  3612. cursor: pointer;
  3613. }
  3614. }
  3615. .pageitem_box {
  3616. padding: 20px;
  3617. margin-bottom: 16px;
  3618. border-radius: 8px;
  3619. background: #ffffff;
  3620. .charttext_p {
  3621. float: right;
  3622. margin-top: 7px;
  3623. }
  3624. .charttext {
  3625. float: right;
  3626. }
  3627. .content_title {
  3628. font-size: 20px;
  3629. // font-weight: bold;
  3630. display: inline-block;
  3631. margin-bottom: 12px;
  3632. &::before {
  3633. content: "";
  3634. display: inline-block;
  3635. width: 4px;
  3636. height: 20px;
  3637. margin: 4px 8px 0 0;
  3638. background-color: rgba(51, 153, 255, 1);
  3639. }
  3640. span {
  3641. vertical-align: top;
  3642. }
  3643. span:nth-child(2) {
  3644. font-size: 16px;
  3645. vertical-align: text-top;
  3646. color: #646a73;
  3647. }
  3648. }
  3649. .room_table {
  3650. height: 56px;
  3651. margin: 0px 0 0 -30px;
  3652. & > div {
  3653. display: flex;
  3654. flex-direction: row;
  3655. align-items: center;
  3656. padding: 0 10px;
  3657. & > div:nth-child(1) {
  3658. width: 80px;
  3659. margin-right: 5px;
  3660. }
  3661. & > div:not(:first-child) {
  3662. text-align: center;
  3663. min-width: 40px;
  3664. }
  3665. & > div {
  3666. margin-right: 33px;
  3667. }
  3668. }
  3669. .room_table_name {
  3670. background: #f8f9fa;
  3671. height: 32px;
  3672. }
  3673. .room_table_number {
  3674. position: relative;
  3675. display: flex;
  3676. & > div:nth-child(1) {
  3677. position: absolute;
  3678. left: 10px;
  3679. width: 65px;
  3680. line-height: 16px;
  3681. }
  3682. & > div:nth-child(2) {
  3683. flex: 1;
  3684. display: flex;
  3685. padding-left: 65px;
  3686. justify-content: space-around;
  3687. & > div {
  3688. min-width: 9px;
  3689. }
  3690. }
  3691. margin-top: 8px;
  3692. height: 36px;
  3693. line-height: 36px;
  3694. border-bottom: 1px solid #eeeeee;
  3695. border-top: 1px solid #eeeeee;
  3696. }
  3697. }
  3698. .content_body {
  3699. padding: 10px;
  3700. .body_title {
  3701. overflow: hidden;
  3702. line-height: 44px;
  3703. height: 44px;
  3704. font-size: 14px;
  3705. // display: inline-flex;
  3706. margin-bottom: 12px;
  3707. border-radius: 4px;
  3708. background: #f8f9fa;
  3709. width: 100%;
  3710. &::before {
  3711. content: "";
  3712. display: inline-block;
  3713. width: 7px;
  3714. height: 44px;
  3715. margin: 0px 8px 0 0;
  3716. background-color: #f9908b;
  3717. }
  3718. span {
  3719. vertical-align: top;
  3720. }
  3721. .temptable {
  3722. height: 400px !important;
  3723. }
  3724. .tabletag {
  3725. display: inline-block;
  3726. // height: 32px;
  3727. padding: 0 10px;
  3728. line-height: 18px;
  3729. font-size: 12px;
  3730. border-radius: 2px;
  3731. box-sizing: border-box;
  3732. white-space: nowrap;
  3733. margin: 13px 10px;
  3734. width: 44px;
  3735. height: 18px;
  3736. }
  3737. .taghot {
  3738. background: #fde3e2;
  3739. color: #ac2f28;
  3740. }
  3741. .tagclod {
  3742. background: #e1f2ff;
  3743. color: #0065b3;
  3744. }
  3745. }
  3746. .day_title {
  3747. display: inline-block;
  3748. height: 22px;
  3749. font-size: 16px;
  3750. color: rgba(31, 36, 41, 1);
  3751. line-height: 22px;
  3752. }
  3753. .oneday_title {
  3754. margin-bottom: 50px;
  3755. }
  3756. .body_coldtitle {
  3757. margin-top: 25px;
  3758. &::before {
  3759. background-color: #0091ff;
  3760. }
  3761. }
  3762. .twochart_box {
  3763. display: flex;
  3764. flex-direction: row;
  3765. & > div {
  3766. flex: 1;
  3767. .daychart {
  3768. min-width: 488px;
  3769. height: 285px;
  3770. }
  3771. .daylinechart {
  3772. margin-top: 25px;
  3773. }
  3774. .daybarchart {
  3775. height: 180px;
  3776. }
  3777. }
  3778. }
  3779. }
  3780. }
  3781. }
  3782. #exportPdf {
  3783. /* display: none; */
  3784. position: absolute;
  3785. background: #ffffff;
  3786. left: -999999px;
  3787. top: 0;
  3788. // width: 1260px;
  3789. width: 1320px;
  3790. .page_header {
  3791. padding: 430px 0 158px;
  3792. .pname {
  3793. right: 70px;
  3794. top: 760px;
  3795. }
  3796. }
  3797. .env_module {
  3798. padding: 24px 0 20px;
  3799. & > div {
  3800. padding: 0 100px 0px;
  3801. }
  3802. & > section {
  3803. padding: 0 100px 0px;
  3804. }
  3805. & > .room_table {
  3806. .room_table_number {
  3807. & > div {
  3808. & > div:not(:first-child) {
  3809. text-align: center;
  3810. min-width: 41px;
  3811. }
  3812. }
  3813. & > div:nth-child(2) {
  3814. & > div {
  3815. min-width: 47px;
  3816. }
  3817. }
  3818. }
  3819. }
  3820. .pageitem_box_list {
  3821. padding: 0;
  3822. }
  3823. .pageitem_box {
  3824. // padding: 0 40px 12px;
  3825. padding: 0 70px 12px;
  3826. // margin-bottom: 10px;
  3827. }
  3828. .pageitem_box_coustom {
  3829. // padding: 0 40px;
  3830. padding: 0 70px;
  3831. }
  3832. .pageitem_box_first {
  3833. margin-bottom: 0px;
  3834. }
  3835. .pageitem_box_sec {
  3836. margin-bottom: 74px;
  3837. }
  3838. .pageitem_box_list > .pageitem_box:nth-child(2n + 0) {
  3839. // margin-bottom: 100px;
  3840. margin-bottom: 200px;
  3841. }
  3842. .pageitem_box:nth-child(1) {
  3843. margin-bottom: 0px;
  3844. }
  3845. .pageitem_box:last-child {
  3846. margin-bottom: 0px;
  3847. }
  3848. .pageitem_box_list > .pageitem_box:last-child {
  3849. margin-bottom: 0;
  3850. }
  3851. }
  3852. }
  3853. </style>