physicalUnitConversion.vue 100 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322
  1. <template>
  2. <div style="width: 1200px; margin: auto">
  3. <div :class="$i18n.locale === 'zh' ? 'user-title1' : 'user-title2'">
  4. <div class="information">
  5. {{ $i18n.locale === 'zh' ? '快速选择:' : 'Quick selection' }}
  6. </div>
  7. <div
  8. @click="getInfo('0')"
  9. :class="informationsClass == 0 ? 'information2' : 'information1'"
  10. >
  11. {{ $i18n.locale === 'zh' ? '全部' : 'Whole' }}
  12. </div>
  13. <div
  14. @click="getInfo('1')"
  15. :class="informationsClass == 1 ? 'information2' : 'information1'"
  16. >
  17. {{ $i18n.locale === 'zh' ? '原煤' : 'Raw coal' }}
  18. </div>
  19. <div
  20. @click="getInfo('2')"
  21. :class="informationsClass == 2 ? 'information2' : 'information1'"
  22. >
  23. {{ $i18n.locale === 'zh' ? '洗精煤' : 'Washed coal' }}
  24. </div>
  25. <div
  26. @click="getInfo('3')"
  27. :class="informationsClass == 3 ? 'information2' : 'information1'"
  28. >
  29. {{ $i18n.locale === 'zh' ? '焦炭' : 'Coke' }}
  30. </div>
  31. <div
  32. @click="getInfo('4')"
  33. :class="informationsClass == 4 ? 'information2' : 'information1'"
  34. >
  35. {{ $i18n.locale === 'zh' ? '原油' : 'Crude oil' }}
  36. </div>
  37. <div
  38. @click="getInfo('5')"
  39. :class="informationsClass == 5 ? 'information2' : 'information1'"
  40. >
  41. {{ $i18n.locale === 'zh' ? '柴油' : 'Diesel oil' }}
  42. </div>
  43. <div
  44. @click="getInfo('6')"
  45. :class="informationsClass == 6 ? 'information2' : 'information1'"
  46. >
  47. {{ $i18n.locale === 'zh' ? '汽油/煤油' : 'Gasoline/Kerosene' }}
  48. </div>
  49. <div
  50. @click="getInfo('7')"
  51. :class="informationsClass == 7 ? 'information2' : 'information1'"
  52. >
  53. {{ $i18n.locale === 'zh' ? '天然气' : 'Natural gas' }}
  54. </div>
  55. <div
  56. @click="getInfo('8')"
  57. :class="informationsClass == 8 ? 'information2' : 'information1'"
  58. >
  59. {{ $i18n.locale === 'zh' ? '液化石油气' : 'Liquefied petroleum gas' }}
  60. </div>
  61. <div
  62. @click="getInfo('9')"
  63. :class="informationsClass == 9 ? 'information2' : 'information1'"
  64. >
  65. {{ $i18n.locale === 'zh' ? '氢' : 'Hydrogen' }}
  66. </div>
  67. <div
  68. @click="getInfo('10')"
  69. :class="informationsClass == 10 ? 'information2' : 'information1'"
  70. >
  71. {{ $i18n.locale === 'zh' ? '电力' : 'Power' }}
  72. </div>
  73. </div>
  74. <div v-if="userRaw" style="width: 98%; margin-left: 1% margin-bottom: 2%">
  75. <div style="display: flex; margin-top: 20px">
  76. <div style="width: 40px; height: 40px">
  77. <img
  78. src="@/assets/userUntil-8.png"
  79. style="width: 100%; height: 100%"
  80. />
  81. </div>
  82. <div
  83. style="
  84. font-size: 22px;
  85. font-weight: 700;
  86. height: 40px;
  87. line-height: 40px;
  88. margin-left: 10px;
  89. "
  90. >
  91. {{ $i18n.locale === 'zh' ? '原煤' : 'Raw Coal' }}
  92. </div>
  93. </div>
  94. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  95. <div style="display: flex; width: 100%; justify-content: space-between">
  96. <div style="display: flex; flex-wrap: wrap; width: 34%">
  97. <div
  98. style="
  99. width: 100%;
  100. height: 55px;
  101. line-height: 55px;
  102. text-align: center;
  103. font-size: 23px;
  104. border-top: 1px solid #dbdbdb;
  105. border-left: 1px solid #dbdbdb;
  106. border-right: 1px solid #dbdbdb;
  107. "
  108. >
  109. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  110. </div>
  111. <ul class="text-title" style="width: 44%">
  112. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  113. <li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
  114. <li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
  115. <li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
  116. </ul>
  117. <ul style="width: 56%">
  118. <li>
  119. <el-input
  120. type="number"
  121. v-model="a"
  122. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  123. @focus="getFocus('1')"
  124. @blur="lostBlur"
  125. @input="getNum('1')"
  126. :class="focusClass == 1 ? 'focusClass2' : 'focusClass1'"
  127. />
  128. </li>
  129. <li>
  130. <el-input
  131. type="number"
  132. v-model="b"
  133. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  134. @focus="getFocus('2')"
  135. @blur="lostBlur"
  136. @input="getNum('2')"
  137. :class="focusClass == 2 ? 'focusClass2' : 'focusClass1'"
  138. />
  139. </li>
  140. <li>
  141. <el-input
  142. type="number"
  143. v-model="c"
  144. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  145. @focus="getFocus('3')"
  146. @blur="lostBlur"
  147. @input="getNum('3')"
  148. :class="focusClass == 3 ? 'focusClass2' : 'focusClass1'"
  149. />
  150. </li>
  151. <li>
  152. <el-input
  153. type="number"
  154. v-model="d"
  155. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  156. @focus="getFocus('4')"
  157. @blur="lostBlur"
  158. @input="getNum('4')"
  159. :class="focusClass == 4 ? 'focusClass2' : 'focusClass1'"
  160. />
  161. </li>
  162. </ul>
  163. </div>
  164. <div style="width: 11%">
  165. <div>
  166. <el-button class="user-btn" @click="getNum('0')">{{
  167. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  168. }}</el-button>
  169. </div>
  170. <div>
  171. <el-button class="user-btn-clear" @click="clearNum">{{
  172. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  173. }}</el-button>
  174. </div>
  175. </div>
  176. <div style="display: flex; flex-wrap: wrap; width: 54%">
  177. <div style="width: 100%; display: flex" class="title-top">
  178. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  179. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  180. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  181. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  182. <span style="border-right: 1px solid #dbdbdb">{{
  183. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  184. }}</span>
  185. </div>
  186. <ul style="width: 100%" class="ui-bgcText">
  187. <li>
  188. <span :title="(this.a * Number(0.714)).toFixed(3)"
  189. >{{ (this.a * Number(0.714)).toFixed(3) }}
  190. </span>
  191. <span :title="(this.a * Number(0.5)).toFixed(3)"
  192. >{{ (this.a * Number(0.5)).toFixed(3) }}
  193. </span>
  194. <span :title="(this.a * Number(20.936)).toFixed(3)">{{
  195. (this.a * Number(20.936)).toFixed(3)
  196. }}</span>
  197. <span :title="(this.a * Number(19.843)).toFixed(3)">{{
  198. (this.a * Number(19.843)).toFixed(3)
  199. }}</span>
  200. <span :title="(this.a * Number(5.004)).toFixed(3)"
  201. >{{ (this.a * Number(5.004)).toFixed(3) }}
  202. </span>
  203. </li>
  204. <li>
  205. <span :title="(this.b * Number(0.324)).toFixed(3)"
  206. >{{ (this.b * Number(0.324)).toFixed(3) }}
  207. </span>
  208. <span :title="(this.b * Number(0.227)).toFixed(3)"
  209. >{{ (this.b * Number(0.227)).toFixed(3) }}
  210. </span>
  211. <span :title="(this.b * Number(9.495)).toFixed(3)">{{
  212. (this.b * Number(9.495)).toFixed(3)
  213. }}</span>
  214. <span :title="(this.b * Number(8.999)).toFixed(3)">{{
  215. (this.b * Number(8.999)).toFixed(3)
  216. }}</span>
  217. <span :title="(this.b * Number(2.269)).toFixed(3)"
  218. >{{ (this.b * Number(2.269)).toFixed(3) }}
  219. </span>
  220. </li>
  221. <li>
  222. <span :title="(this.c * Number(0.726)).toFixed(3)"
  223. >{{ (this.c * Number(0.726)).toFixed(3) }}
  224. </span>
  225. <span :title="(this.c * Number(0.508)).toFixed(3)"
  226. >{{ (this.c * Number(0.508)).toFixed(3) }}
  227. </span>
  228. <span :title="(this.c * Number(21.27)).toFixed(3)">{{
  229. (this.c * Number(21.27)).toFixed(3)
  230. }}</span>
  231. <span :title="(this.c * Number(20.16)).toFixed(3)">{{
  232. (this.c * Number(20.16)).toFixed(3)
  233. }}</span>
  234. <span :title="(this.c * Number(5.083)).toFixed(3)"
  235. >{{ (this.c * Number(5.083)).toFixed(3) }}
  236. </span>
  237. </li>
  238. <li>
  239. <span :title="(this.d * Number(0.648)).toFixed(3)"
  240. >{{ (this.d * Number(0.648)).toFixed(3) }}
  241. </span>
  242. <span :title="(this.d * Number(0.454)).toFixed(3)"
  243. >{{ (this.d * Number(0.454)).toFixed(3) }}
  244. </span>
  245. <span :title="(this.d * Number(18.998)).toFixed(3)">{{
  246. (this.d * Number(18.998)).toFixed(3)
  247. }}</span>
  248. <span :title="(this.d * Number(18.007)).toFixed(3)">{{
  249. (this.d * Number(18.007)).toFixed(3)
  250. }}</span>
  251. <span :title="(this.d * Number(4.541)).toFixed(3)"
  252. >{{ (this.d * Number(4.541)).toFixed(3) }}
  253. </span>
  254. </li>
  255. </ul>
  256. </div>
  257. </div>
  258. </div>
  259. <div
  260. v-if="userWashed"
  261. style="width: 98%; margin-left: 1% margin-bottom: 2%"
  262. >
  263. <div style="display: flex; margin-top: 20px">
  264. <div style="width: 40px; height: 40px">
  265. <img
  266. src="@/assets/userUntil-8.png"
  267. style="width: 100%; height: 100%"
  268. />
  269. </div>
  270. <div
  271. style="
  272. font-size: 22px;
  273. font-weight: 700;
  274. height: 40px;
  275. line-height: 40px;
  276. margin-left: 10px;
  277. "
  278. >
  279. {{ $i18n.locale === 'zh' ? '洗精煤' : 'Washed coal' }}
  280. </div>
  281. </div>
  282. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  283. <div style="display: flex; width: 100%; justify-content: space-between">
  284. <div style="display: flex; flex-wrap: wrap; width: 34%">
  285. <div
  286. style="
  287. width: 100%;
  288. height: 55px;
  289. line-height: 55px;
  290. text-align: center;
  291. font-size: 23px;
  292. border-top: 1px solid #dbdbdb;
  293. border-left: 1px solid #dbdbdb;
  294. border-right: 1px solid #dbdbdb;
  295. "
  296. >
  297. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  298. </div>
  299. <ul class="text-title" style="width: 44%">
  300. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  301. <li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
  302. <li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
  303. <li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
  304. </ul>
  305. <ul style="width: 56%">
  306. <li>
  307. <el-input
  308. type="number"
  309. v-model="e"
  310. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  311. @focus="getFocus('5')"
  312. @blur="lostBlur"
  313. @input="getWashed('1')"
  314. :class="focusClass == 5 ? 'focusClass2' : 'focusClass1'"
  315. />
  316. </li>
  317. <li>
  318. <el-input
  319. type="number"
  320. v-model="f"
  321. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  322. @focus="getFocus('6')"
  323. @blur="lostBlur"
  324. @input="getWashed('2')"
  325. :class="focusClass == 6 ? 'focusClass2' : 'focusClass1'"
  326. />
  327. </li>
  328. <li>
  329. <el-input
  330. type="number"
  331. v-model="g"
  332. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  333. @focus="getFocus('7')"
  334. @blur="lostBlur"
  335. @input="getWashed('3')"
  336. :class="focusClass == 7 ? 'focusClass2' : 'focusClass1'"
  337. />
  338. </li>
  339. <li>
  340. <el-input
  341. type="number"
  342. v-model="h"
  343. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  344. @focus="getFocus('8')"
  345. @blur="lostBlur"
  346. @input="getWashed('4')"
  347. :class="focusClass == 8 ? 'focusClass2' : 'focusClass1'"
  348. />
  349. </li>
  350. </ul>
  351. </div>
  352. <div style="width: 11%">
  353. <div>
  354. <el-button class="user-btn" @click="getWashed('0')">{{
  355. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  356. }}</el-button>
  357. </div>
  358. <div>
  359. <el-button class="user-btn-clear" @click="clearWashed">{{
  360. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  361. }}</el-button>
  362. </div>
  363. </div>
  364. <div style="display: flex; flex-wrap: wrap; width: 54%">
  365. <div style="width: 100%; display: flex" class="title-top">
  366. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  367. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  368. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  369. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  370. <span style="border-right: 1px solid #dbdbdb">{{
  371. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  372. }}</span>
  373. </div>
  374. <ul style="width: 100%" class="ui-bgcText">
  375. <li>
  376. <span :title="(this.e * Number(0.9)).toFixed(3)"
  377. >{{ (this.e * Number(0.9)).toFixed(3) }}
  378. </span>
  379. <span :title="(this.e * Number(0.63)).toFixed(3)"
  380. >{{ (this.e * Number(0.63)).toFixed(3) }}
  381. </span>
  382. <span :title="(this.e * Number(26.379)).toFixed(3)">{{
  383. (this.e * Number(26.379)).toFixed(3)
  384. }}</span>
  385. <span :title="(this.e * Number(25.002)).toFixed(3)">{{
  386. (this.e * Number(25.002)).toFixed(3)
  387. }}</span>
  388. <span :title="(this.e * Number(6.305)).toFixed(3)"
  389. >{{ (this.e * Number(6.305)).toFixed(3) }}
  390. </span>
  391. </li>
  392. <li>
  393. <span :title="(this.f * Number(0.408)).toFixed(3)"
  394. >{{ (this.f * Number(0.408)).toFixed(3) }}
  395. </span>
  396. <span :title="(this.f * Number(0.286)).toFixed(3)"
  397. >{{ (this.f * Number(0.286)).toFixed(3) }}
  398. </span>
  399. <span :title="(this.f * Number(11.963)).toFixed(3)">{{
  400. (this.f * Number(11.963)).toFixed(3)
  401. }}</span>
  402. <span :title="(this.f * Number(11.339)).toFixed(3)">{{
  403. (this.f * Number(11.339)).toFixed(3)
  404. }}</span>
  405. <span :title="(this.f * Number(2.859)).toFixed(3)"
  406. >{{ (this.f * Number(2.859)).toFixed(3) }}
  407. </span>
  408. </li>
  409. <li>
  410. <span :title="(this.g * Number(0.914)).toFixed(3)"
  411. >{{ (this.g * Number(0.914)).toFixed(3) }}
  412. </span>
  413. <span :title="(this.g * Number(0.64)).toFixed(3)"
  414. >{{ (this.g * Number(0.64)).toFixed(3) }}
  415. </span>
  416. <span :title="(this.g * Number(26.8)).toFixed(3)">{{
  417. (this.g * Number(26.8)).toFixed(3)
  418. }}</span>
  419. <span :title="(this.g * Number(25.401)).toFixed(3)">{{
  420. (this.g * Number(25.401)).toFixed(3)
  421. }}</span>
  422. <span :title="(this.g * Number(6.405)).toFixed(3)"
  423. >{{ (this.g * Number(6.405)).toFixed(3) }}
  424. </span>
  425. </li>
  426. <li>
  427. <span :title="(this.h * Number(0.817)).toFixed(3)"
  428. >{{ (this.h * Number(0.817)).toFixed(3) }}
  429. </span>
  430. <span :title="(this.h * Number(0.572)).toFixed(3)"
  431. >{{ (this.h * Number(0.572)).toFixed(3) }}
  432. </span>
  433. <span :title="(this.h * Number(23.937)).toFixed(3)">{{
  434. (this.h * Number(23.937)).toFixed(3)
  435. }}</span>
  436. <span :title="(this.h * Number(22.688)).toFixed(3)">{{
  437. (this.h * Number(22.688)).toFixed(3)
  438. }}</span>
  439. <span :title="(this.h * Number(5.721)).toFixed(3)"
  440. >{{ (this.h * Number(5.721)).toFixed(3) }}
  441. </span>
  442. </li>
  443. </ul>
  444. </div>
  445. </div>
  446. </div>
  447. <div v-if="userCoke" style="width: 98%; margin-left: 1% margin-bottom: 2%">
  448. <div style="display: flex; margin-top: 20px">
  449. <div style="width: 40px; height: 40px">
  450. <img
  451. src="@/assets/userUntil-8.png"
  452. style="width: 100%; height: 100%"
  453. />
  454. </div>
  455. <div
  456. style="
  457. font-size: 22px;
  458. font-weight: 700;
  459. height: 40px;
  460. line-height: 40px;
  461. margin-left: 10px;
  462. "
  463. >
  464. {{ $i18n.locale === 'zh' ? '焦炭' : 'Coke' }}
  465. </div>
  466. </div>
  467. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  468. <div style="display: flex; width: 100%; justify-content: space-between">
  469. <div style="display: flex; flex-wrap: wrap; width: 34%">
  470. <div
  471. style="
  472. width: 100%;
  473. height: 55px;
  474. line-height: 55px;
  475. text-align: center;
  476. font-size: 23px;
  477. border-top: 1px solid #dbdbdb;
  478. border-left: 1px solid #dbdbdb;
  479. border-right: 1px solid #dbdbdb;
  480. "
  481. >
  482. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  483. </div>
  484. <ul class="text-title" style="width: 44%">
  485. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  486. <li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
  487. <li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
  488. <li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
  489. </ul>
  490. <ul style="width: 56%">
  491. <li>
  492. <el-input
  493. type="number"
  494. v-model="i"
  495. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  496. @focus="getFocus('9')"
  497. @blur="lostBlur"
  498. @input="getCoke('1')"
  499. :class="focusClass == 9 ? 'focusClass2' : 'focusClass1'"
  500. />
  501. </li>
  502. <li>
  503. <el-input
  504. type="number"
  505. v-model="j"
  506. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  507. @focus="getFocus('10')"
  508. @blur="lostBlur"
  509. @input="getCoke('2')"
  510. :class="focusClass == 10 ? 'focusClass2' : 'focusClass1'"
  511. />
  512. </li>
  513. <li>
  514. <el-input
  515. type="number"
  516. v-model="k"
  517. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  518. @focus="getFocus('11')"
  519. @blur="lostBlur"
  520. @input="getCoke('3')"
  521. :class="focusClass == 11 ? 'focusClass2' : 'focusClass1'"
  522. />
  523. </li>
  524. <li>
  525. <el-input
  526. type="number"
  527. v-model="l"
  528. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  529. @focus="getFocus('12')"
  530. @blur="lostBlur"
  531. @input="getCoke('4')"
  532. :class="focusClass == 12 ? 'focusClass2' : 'focusClass1'"
  533. />
  534. </li>
  535. </ul>
  536. </div>
  537. <div style="width: 11%">
  538. <div>
  539. <el-button class="user-btn" @click="getCoke('0')">{{
  540. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  541. }}</el-button>
  542. </div>
  543. <div>
  544. <el-button class="user-btn-clear" @click="clearCoke">{{
  545. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  546. }}</el-button>
  547. </div>
  548. </div>
  549. <div style="display: flex; flex-wrap: wrap; width: 54%">
  550. <div style="width: 100%; display: flex" class="title-top">
  551. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  552. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  553. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  554. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  555. <span style="border-right: 1px solid #dbdbdb">{{
  556. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  557. }}</span>
  558. </div>
  559. <ul style="width: 100%" class="ui-bgcText">
  560. <li>
  561. <span :title="(this.i * Number(0.971)).toFixed(3)"
  562. >{{ (this.i * Number(0.971)).toFixed(3) }}
  563. </span>
  564. <span :title="(this.i * Number(0.68)).toFixed(3)"
  565. >{{ (this.i * Number(0.68)).toFixed(3) }}
  566. </span>
  567. <span :title="(this.i * Number(28.472)).toFixed(3)">{{
  568. (this.i * Number(28.472)).toFixed(3)
  569. }}</span>
  570. <span :title="(this.i * Number(26.985)).toFixed(3)">{{
  571. (this.i * Number(26.985)).toFixed(3)
  572. }}</span>
  573. <span :title="(this.i * Number(6.805)).toFixed(3)"
  574. >{{ (this.i * Number(6.805)).toFixed(3) }}
  575. </span>
  576. </li>
  577. <li>
  578. <span :title="(this.j * Number(0.441)).toFixed(3)"
  579. >{{ (this.j * Number(0.441)).toFixed(3) }}
  580. </span>
  581. <span :title="(this.j * Number(0.308)).toFixed(3)"
  582. >{{ (this.j * Number(0.308)).toFixed(3) }}
  583. </span>
  584. <span :title="(this.j * Number(12.912)).toFixed(3)">{{
  585. (this.j * Number(12.912)).toFixed(3)
  586. }}</span>
  587. <span :title="(this.j * Number(12.238)).toFixed(3)">{{
  588. (this.j * Number(12.238)).toFixed(3)
  589. }}</span>
  590. <span :title="(this.j * Number(3.086)).toFixed(3)"
  591. >{{ (this.j * Number(3.086)).toFixed(3) }}
  592. </span>
  593. </li>
  594. <li>
  595. <span :title="(this.k * Number(0.987)).toFixed(3)"
  596. >{{ (this.k * Number(0.987)).toFixed(3) }}
  597. </span>
  598. <span :title="(this.k * Number(0.691)).toFixed(3)"
  599. >{{ (this.k * Number(0.691)).toFixed(3) }}
  600. </span>
  601. <span :title="(this.k * Number(28.926)).toFixed(3)">{{
  602. (this.k * Number(28.926)).toFixed(3)
  603. }}</span>
  604. <span :title="(this.k * Number(27.416)).toFixed(3)">{{
  605. (this.k * Number(27.416)).toFixed(3)
  606. }}</span>
  607. <span :title="(this.k * Number(6.913)).toFixed(3)"
  608. >{{ (this.k * Number(6.913)).toFixed(3) }}
  609. </span>
  610. </li>
  611. <li>
  612. <span :title="(this.l * Number(0.881)).toFixed(3)"
  613. >{{ (this.l * Number(0.881)).toFixed(3) }}
  614. </span>
  615. <span :title="(this.l * Number(0.617)).toFixed(3)"
  616. >{{ (this.l * Number(0.617)).toFixed(3) }}
  617. </span>
  618. <span :title="(this.l * Number(25.836)).toFixed(3)">{{
  619. (this.l * Number(25.836)).toFixed(3)
  620. }}</span>
  621. <span :title="(this.l * Number(24.488)).toFixed(3)">{{
  622. (this.l * Number(24.488)).toFixed(3)
  623. }}</span>
  624. <span :title="(this.l * Number(6.175)).toFixed(3)"
  625. >{{ (this.l * Number(6.175)).toFixed(3) }}
  626. </span>
  627. </li>
  628. </ul>
  629. </div>
  630. </div>
  631. </div>
  632. <div v-if="userCrude" style="width: 98%; margin-left: 1% margin-bottom: 2%">
  633. <div style="display: flex; margin-top: 20px">
  634. <div style="width: 40px; height: 40px">
  635. <img
  636. src="@/assets/userUntil-5.png"
  637. style="width: 100%; height: 100%"
  638. />
  639. </div>
  640. <div
  641. style="
  642. font-size: 22px;
  643. font-weight: 700;
  644. height: 40px;
  645. line-height: 40px;
  646. margin-left: 10px;
  647. "
  648. >
  649. {{ $i18n.locale === 'zh' ? '原油' : 'Crude Oil' }}
  650. </div>
  651. </div>
  652. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  653. <div style="display: flex; width: 100%; justify-content: space-between">
  654. <div style="display: flex; flex-wrap: wrap; width: 34%">
  655. <div
  656. style="
  657. width: 100%;
  658. height: 55px;
  659. line-height: 55px;
  660. text-align: center;
  661. font-size: 23px;
  662. border-top: 1px solid #dbdbdb;
  663. border-left: 1px solid #dbdbdb;
  664. border-right: 1px solid #dbdbdb;
  665. "
  666. >
  667. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  668. </div>
  669. <ul class="text-title" style="width: 44%">
  670. <li>{{ $i18n.locale === 'zh' ? '桶(bbl)' : 'bbl' }}</li>
  671. <li>{{ $i18n.locale === 'zh' ? '千升(KL)' : 'KL' }}</li>
  672. <li>
  673. {{ $i18n.locale === 'zh' ? '千美制加仑(kgal.US)' : 'kgal.US' }}
  674. </li>
  675. <li>
  676. {{ $i18n.locale === 'zh' ? '千英制加仑(kgal.UK)' : 'kgal.UK' }}
  677. </li>
  678. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  679. </ul>
  680. <ul style="width: 56%">
  681. <li>
  682. <el-input
  683. type="number"
  684. v-model="q"
  685. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  686. @focus="getFocus('13')"
  687. @blur="lostBlur"
  688. @input="getOil('1')"
  689. :class="focusClass == 13 ? 'focusClass2' : 'focusClass1'"
  690. />
  691. </li>
  692. <li>
  693. <el-input
  694. type="number"
  695. v-model="r"
  696. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  697. @focus="getFocus('14')"
  698. @blur="lostBlur"
  699. @input="getOil('2')"
  700. :class="focusClass == 14 ? 'focusClass2' : 'focusClass1'"
  701. />
  702. </li>
  703. <li>
  704. <el-input
  705. type="number"
  706. v-model="s"
  707. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  708. @focus="getFocus('15')"
  709. @blur="lostBlur"
  710. @input="getOil('3')"
  711. :class="focusClass == 15 ? 'focusClass2' : 'focusClass1'"
  712. />
  713. </li>
  714. <li>
  715. <el-input
  716. type="number"
  717. v-model="t"
  718. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  719. @focus="getFocus('16')"
  720. @blur="lostBlur"
  721. @input="getOil('4')"
  722. :class="focusClass == 16 ? 'focusClass2' : 'focusClass1'"
  723. />
  724. </li>
  725. <li>
  726. <el-input
  727. type="number"
  728. v-model="u"
  729. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  730. @focus="getFocus('17')"
  731. @blur="lostBlur"
  732. @input="getOil('5')"
  733. :class="focusClass == 17 ? 'focusClass2' : 'focusClass1'"
  734. />
  735. </li>
  736. </ul>
  737. </div>
  738. <div style="width: 11%">
  739. <div>
  740. <el-button class="user-btn" @click="getOil('0')">{{
  741. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  742. }}</el-button>
  743. </div>
  744. <div>
  745. <el-button class="user-btn-clear" @click="clearOil">{{
  746. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  747. }}</el-button>
  748. </div>
  749. </div>
  750. <div style="display: flex; flex-wrap: wrap; width: 54%">
  751. <div style="width: 100%; display: flex" class="title-top">
  752. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  753. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  754. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  755. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  756. <span style="border-right: 1px solid #dbdbdb">{{
  757. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  758. }}</span>
  759. </div>
  760. <ul style="width: 100%" class="ui-bgcText">
  761. <li>
  762. <span :title="(this.q * Number(0.195)).toFixed(3)"
  763. >{{ (this.q * Number(0.195)).toFixed(3) }}
  764. </span>
  765. <span :title="(this.q * Number(0.136)).toFixed(3)"
  766. >{{ (this.q * Number(0.136)).toFixed(3) }}
  767. </span>
  768. <span :title="(this.q * Number(5.712)).toFixed(3)">{{
  769. (this.q * Number(5.712)).toFixed(3)
  770. }}</span>
  771. <span :title="(this.q * Number(5.414)).toFixed(3)">{{
  772. (this.q * Number(5.414)).toFixed(3)
  773. }}</span>
  774. <span :title="(this.q * Number(1.365)).toFixed(3)"
  775. >{{ (this.q * Number(1.365)).toFixed(3) }}
  776. </span>
  777. </li>
  778. <li>
  779. <span :title="(this.r * Number(1.219)).toFixed(3)"
  780. >{{ (this.r * Number(1.219)).toFixed(3) }}
  781. </span>
  782. <span :title="(this.r * Number(0.853)).toFixed(3)"
  783. >{{ (this.r * Number(0.853)).toFixed(3) }}
  784. </span>
  785. <span :title="(this.r * Number(35.727)).toFixed(3)">{{
  786. (this.r * Number(35.727)).toFixed(3)
  787. }}</span>
  788. <span :title="(this.r * Number(33.862)).toFixed(3)">{{
  789. (this.r * Number(33.862)).toFixed(3)
  790. }}</span>
  791. <span :title="(this.r * Number(8.539)).toFixed(3)"
  792. >{{ (this.r * Number(8.539)).toFixed(3) }}
  793. </span>
  794. </li>
  795. <li>
  796. <span :title="(this.s * Number(4.638)).toFixed(3)"
  797. >{{ (this.s * Number(4.638)).toFixed(3) }}
  798. </span>
  799. <span :title="(this.s * Number(3.247)).toFixed(3)"
  800. >{{ (this.s * Number(3.247)).toFixed(3) }}
  801. </span>
  802. <span :title="(this.s * Number(135.949)).toFixed(3)">{{
  803. (this.s * Number(135.949)).toFixed(3)
  804. }}</span>
  805. <span :title="(this.s * Number(128.852)).toFixed(3)">{{
  806. (this.s * Number(128.852)).toFixed(3)
  807. }}</span>
  808. <span :title="(this.s * Number(32.491)).toFixed(3)"
  809. >{{ (this.s * Number(32.491)).toFixed(3) }}
  810. </span>
  811. </li>
  812. <li>
  813. <span :title="(this.t * Number(5.568)).toFixed(3)"
  814. >{{ (this.t * Number(5.568)).toFixed(3) }}
  815. </span>
  816. <span :title="(this.t * Number(3.898)).toFixed(3)"
  817. >{{ (this.t * Number(3.898)).toFixed(3) }}
  818. </span>
  819. <span :title="(this.t * Number(163.204)).toFixed(3)">{{
  820. (this.t * Number(163.204)).toFixed(3)
  821. }}</span>
  822. <span :title="(this.t * Number(154.685)).toFixed(3)">{{
  823. (this.t * Number(154.685)).toFixed(3)
  824. }}</span>
  825. <span :title="(this.t * Number(39.005)).toFixed(3)"
  826. >{{ (this.t * Number(39.005)).toFixed(3) }}
  827. </span>
  828. </li>
  829. <li>
  830. <span :title="(this.u * Number(1.429)).toFixed(3)"
  831. >{{ (this.u * Number(1.429)).toFixed(3) }}
  832. </span>
  833. <span :title="(this.u * Number(1.0)).toFixed(3)"
  834. >{{ (this.u * Number(1.0)).toFixed(3) }}
  835. </span>
  836. <span :title="(this.u * Number(41.872)).toFixed(3)">{{
  837. (this.u * Number(41.872)).toFixed(3)
  838. }}</span>
  839. <span :title="(this.u * Number(39.687)).toFixed(3)">{{
  840. (this.u * Number(39.687)).toFixed(3)
  841. }}</span>
  842. <span :title="(this.u * Number(10.007)).toFixed(3)"
  843. >{{ (this.u * Number(10.007)).toFixed(3) }}
  844. </span>
  845. </li>
  846. </ul>
  847. </div>
  848. </div>
  849. </div>
  850. <div
  851. v-if="userDiesel"
  852. style="width: 98%; margin-left: 1% margin-bottom: 2%"
  853. >
  854. <div style="display: flex; margin-top: 20px">
  855. <div style="width: 40px; height: 40px">
  856. <img
  857. src="@/assets/userUntil-5.png"
  858. style="width: 100%; height: 100%"
  859. />
  860. </div>
  861. <div
  862. style="
  863. font-size: 22px;
  864. font-weight: 700;
  865. height: 40px;
  866. line-height: 40px;
  867. margin-left: 10px;
  868. "
  869. >
  870. {{ $i18n.locale === 'zh' ? '柴油' : 'Diesel oil' }}
  871. </div>
  872. </div>
  873. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  874. <div style="display: flex; width: 100%; justify-content: space-between">
  875. <div style="display: flex; flex-wrap: wrap; width: 34%">
  876. <div
  877. style="
  878. width: 100%;
  879. height: 55px;
  880. line-height: 55px;
  881. text-align: center;
  882. font-size: 23px;
  883. border-top: 1px solid #dbdbdb;
  884. border-left: 1px solid #dbdbdb;
  885. border-right: 1px solid #dbdbdb;
  886. "
  887. >
  888. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  889. </div>
  890. <ul class="text-title" style="width: 44%">
  891. <li>{{ $i18n.locale === 'zh' ? '千升(KL)' : 'KL' }}</li>
  892. <li>
  893. {{ $i18n.locale === 'zh' ? '千美制加仑(kgal.US)' : 'kgal.US' }}
  894. </li>
  895. <li>
  896. {{ $i18n.locale === 'zh' ? '千英制加仑(kgal.UK)' : 'kgal.UK' }}
  897. </li>
  898. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  899. </ul>
  900. <ul style="width: 56%">
  901. <li>
  902. <el-input
  903. type="number"
  904. v-model="v"
  905. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  906. @focus="getFocus('18')"
  907. @blur="lostBlur"
  908. @input="getDiesel('1')"
  909. :class="focusClass == 18 ? 'focusClass2' : 'focusClass1'"
  910. />
  911. </li>
  912. <li>
  913. <el-input
  914. type="number"
  915. v-model="w"
  916. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  917. @focus="getFocus('19')"
  918. @blur="lostBlur"
  919. @input="getDiesel('2')"
  920. :class="focusClass == 19 ? 'focusClass2' : 'focusClass1'"
  921. />
  922. </li>
  923. <li>
  924. <el-input
  925. type="number"
  926. v-model="x"
  927. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  928. @focus="getFocus('20')"
  929. @blur="lostBlur"
  930. @input="getDiesel('3')"
  931. :class="focusClass == 20 ? 'focusClass2' : 'focusClass1'"
  932. />
  933. </li>
  934. <li>
  935. <el-input
  936. type="number"
  937. v-model="y"
  938. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  939. @focus="getFocus('21')"
  940. @blur="lostBlur"
  941. @input="getDiesel('4')"
  942. :class="focusClass == 21 ? 'focusClass2' : 'focusClass1'"
  943. />
  944. </li>
  945. </ul>
  946. </div>
  947. <div style="width: 11%">
  948. <div>
  949. <el-button class="user-btn" @click="getDiesel('0')">{{
  950. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  951. }}</el-button>
  952. </div>
  953. <div>
  954. <el-button class="user-btn-clear" @click="clearDiesel">{{
  955. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  956. }}</el-button>
  957. </div>
  958. </div>
  959. <div style="display: flex; flex-wrap: wrap; width: 54%">
  960. <div style="width: 100%; display: flex" class="title-top">
  961. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  962. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  963. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  964. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  965. <span style="border-right: 1px solid #dbdbdb">{{
  966. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  967. }}</span>
  968. </div>
  969. <ul style="width: 100%" class="ui-bgcText">
  970. <li>
  971. <span :title="(this.v * Number(1.243)).toFixed(3)"
  972. >{{ (this.v * Number(1.243)).toFixed(3) }}
  973. </span>
  974. <span :title="(this.v * Number(0.87)).toFixed(3)"
  975. >{{ (this.v * Number(0.87)).toFixed(3) }}
  976. </span>
  977. <span :title="(this.v * Number(36.44)).toFixed(3)">{{
  978. (this.v * Number(36.44)).toFixed(3)
  979. }}</span>
  980. <span :title="(this.v * Number(34.538)).toFixed(3)">{{
  981. (this.v * Number(34.538)).toFixed(3)
  982. }}</span>
  983. <span :title="(this.v * Number(8.709)).toFixed(3)"
  984. >{{ (this.v * Number(8.709)).toFixed(3) }}
  985. </span>
  986. </li>
  987. <li>
  988. <span :title="(this.w * Number(4.731)).toFixed(3)"
  989. >{{ (this.w * Number(4.731)).toFixed(3) }}
  990. </span>
  991. <span :title="(this.w * Number(3.312)).toFixed(3)"
  992. >{{ (this.w * Number(3.312)).toFixed(3) }}
  993. </span>
  994. <span :title="(this.w * Number(138.661)).toFixed(3)">{{
  995. (this.w * Number(138.661)).toFixed(3)
  996. }}</span>
  997. <span :title="(this.w * Number(131.423)).toFixed(3)">{{
  998. (this.w * Number(131.423)).toFixed(3)
  999. }}</span>
  1000. <span :title="(this.w * Number(33.14)).toFixed(3)"
  1001. >{{ (this.w * Number(33.14)).toFixed(3) }}
  1002. </span>
  1003. </li>
  1004. <li>
  1005. <span :title="(this.x * Number(5.679)).toFixed(3)"
  1006. >{{ (this.x * Number(5.679)).toFixed(3) }}
  1007. </span>
  1008. <span :title="(this.x * Number(3.975)).toFixed(3)"
  1009. >{{ (this.x * Number(3.975)).toFixed(3) }}
  1010. </span>
  1011. <span :title="(this.x * Number(166.46)).toFixed(3)">{{
  1012. (this.x * Number(166.46)).toFixed(3)
  1013. }}</span>
  1014. <span :title="(this.x * Number(157.771)).toFixed(3)">{{
  1015. (this.x * Number(157.771)).toFixed(3)
  1016. }}</span>
  1017. <span :title="(this.x * Number(39.783)).toFixed(3)"
  1018. >{{ (this.x * Number(39.783)).toFixed(3) }}
  1019. </span>
  1020. </li>
  1021. <li>
  1022. <span :title="(this.y * Number(1.457)).toFixed(3)"
  1023. >{{ (this.y * Number(1.457)).toFixed(3) }}
  1024. </span>
  1025. <span :title="(this.y * Number(1.02)).toFixed(3)"
  1026. >{{ (this.y * Number(1.02)).toFixed(3) }}
  1027. </span>
  1028. <span :title="(this.y * Number(42.708)).toFixed(3)">{{
  1029. (this.y * Number(42.708)).toFixed(3)
  1030. }}</span>
  1031. <span :title="(this.y * Number(40.478)).toFixed(3)">{{
  1032. (this.y * Number(40.478)).toFixed(3)
  1033. }}</span>
  1034. <span :title="(this.y * Number(10.207)).toFixed(3)"
  1035. >{{ (this.y * Number(10.207)).toFixed(3) }}
  1036. </span>
  1037. </li>
  1038. </ul>
  1039. </div>
  1040. </div>
  1041. </div>
  1042. <div
  1043. v-if="userGasoline"
  1044. style="width: 98%; margin-left: 1% margin-bottom: 2%"
  1045. >
  1046. <div style="font-size: 22px; font-weight: 700">
  1047. <div style="display: flex; margin-top: 20px">
  1048. <div style="width: 40px; height: 40px">
  1049. <img
  1050. src="@/assets/userUntil-5.png"
  1051. style="width: 100%; height: 100%"
  1052. />
  1053. </div>
  1054. <div
  1055. style="
  1056. font-size: 22px;
  1057. font-weight: 700;
  1058. height: 40px;
  1059. line-height: 40px;
  1060. margin-left: 10px;
  1061. "
  1062. >
  1063. {{ $i18n.locale === 'zh' ? '汽油/煤油' : 'Gasoline/Kerosene' }}
  1064. </div>
  1065. </div>
  1066. </div>
  1067. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  1068. <div style="display: flex; width: 100%; justify-content: space-between">
  1069. <div style="display: flex; flex-wrap: wrap; width: 34%">
  1070. <div
  1071. style="
  1072. width: 100%;
  1073. height: 55px;
  1074. line-height: 55px;
  1075. text-align: center;
  1076. font-size: 23px;
  1077. border-top: 1px solid #dbdbdb;
  1078. border-left: 1px solid #dbdbdb;
  1079. border-right: 1px solid #dbdbdb;
  1080. "
  1081. >
  1082. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  1083. </div>
  1084. <ul class="text-title" style="width: 44%">
  1085. <li>{{ $i18n.locale === 'zh' ? '千升(KL)' : 'KL' }}</li>
  1086. <li>
  1087. {{ $i18n.locale === 'zh' ? '千美制加仑(kgal.US)' : 'kgal.US' }}
  1088. </li>
  1089. <li>
  1090. {{ $i18n.locale === 'zh' ? '千英制加仑(kgal.UK)' : 'kgal.UK' }}
  1091. </li>
  1092. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  1093. </ul>
  1094. <ul style="width: 56%">
  1095. <li>
  1096. <el-input
  1097. type="number"
  1098. v-model="a1"
  1099. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1100. @focus="getFocus('22')"
  1101. @blur="lostBlur"
  1102. @input="getGasoline('1')"
  1103. :class="focusClass == 22 ? 'focusClass2' : 'focusClass1'"
  1104. />
  1105. </li>
  1106. <li>
  1107. <el-input
  1108. type="number"
  1109. v-model="b1"
  1110. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1111. @focus="getFocus('23')"
  1112. @blur="lostBlur"
  1113. @input="getGasoline('2')"
  1114. :class="focusClass == 23 ? 'focusClass2' : 'focusClass1'"
  1115. />
  1116. </li>
  1117. <li>
  1118. <el-input
  1119. type="number"
  1120. v-model="c1"
  1121. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1122. @focus="getFocus('24')"
  1123. @blur="lostBlur"
  1124. @input="getGasoline('3')"
  1125. :class="focusClass == 24 ? 'focusClass2' : 'focusClass1'"
  1126. />
  1127. </li>
  1128. <li>
  1129. <el-input
  1130. type="number"
  1131. v-model="d1"
  1132. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1133. @focus="getFocus('25')"
  1134. @blur="lostBlur"
  1135. @input="getGasoline('4')"
  1136. :class="focusClass == 25 ? 'focusClass2' : 'focusClass1'"
  1137. />
  1138. </li>
  1139. </ul>
  1140. </div>
  1141. <div style="width: 11%">
  1142. <div>
  1143. <el-button class="user-btn" @click="getGasoline('0')">{{
  1144. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  1145. }}</el-button>
  1146. </div>
  1147. <div>
  1148. <el-button class="user-btn-clear" @click="clearGasoline">{{
  1149. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  1150. }}</el-button>
  1151. </div>
  1152. </div>
  1153. <div style="display: flex; flex-wrap: wrap; width: 54%">
  1154. <div style="width: 100%; display: flex" class="title-top">
  1155. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  1156. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  1157. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  1158. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  1159. <span style="border-right: 1px solid #dbdbdb">{{
  1160. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  1161. }}</span>
  1162. </div>
  1163. <ul style="width: 100%" class="ui-bgcText">
  1164. <li>
  1165. <span :title="(this.a1 * Number(1.081)).toFixed(3)"
  1166. >{{ (this.a1 * Number(1.081)).toFixed(3) }}
  1167. </span>
  1168. <span :title="(this.a1 * Number(0.757)).toFixed(3)"
  1169. >{{ (this.a1 * Number(0.757)).toFixed(3) }}
  1170. </span>
  1171. <span :title="(this.a1 * Number(31.688)).toFixed(3)">{{
  1172. (this.a1 * Number(31.688)).toFixed(3)
  1173. }}</span>
  1174. <span :title="(this.a1 * Number(30.033)).toFixed(3)">{{
  1175. (this.a1 * Number(30.033)).toFixed(3)
  1176. }}</span>
  1177. <span :title="(this.a1 * Number(7.573)).toFixed(3)"
  1178. >{{ (this.a1 * Number(7.573)).toFixed(3) }}
  1179. </span>
  1180. </li>
  1181. <li>
  1182. <span :title="(this.b1 * Number(4.122)).toFixed(3)"
  1183. >{{ (this.b1 * Number(4.122)).toFixed(3) }}
  1184. </span>
  1185. <span :title="(this.b1 * Number(2.885)).toFixed(3)"
  1186. >{{ (this.b1 * Number(2.885)).toFixed(3) }}
  1187. </span>
  1188. <span :title="(this.b1 * Number(120.803)).toFixed(3)">{{
  1189. (this.b1 * Number(120.803)).toFixed(3)
  1190. }}</span>
  1191. <span :title="(this.b1 * Number(114.497)).toFixed(3)">{{
  1192. (this.b1 * Number(114.497)).toFixed(3)
  1193. }}</span>
  1194. <span :title="(this.b1 * Number(28.872)).toFixed(3)"
  1195. >{{ (this.b1 * Number(28.872)).toFixed(3) }}
  1196. </span>
  1197. </li>
  1198. <li>
  1199. <span :title="(this.c1 * Number(4.948)).toFixed(3)"
  1200. >{{ (this.c1 * Number(4.948)).toFixed(3) }}
  1201. </span>
  1202. <span :title="(this.c1 * Number(3.464)).toFixed(3)"
  1203. >{{ (this.c1 * Number(3.464)).toFixed(3) }}
  1204. </span>
  1205. <span :title="(this.c1 * Number(145.022)).toFixed(3)">{{
  1206. (this.c1 * Number(145.022)).toFixed(3)
  1207. }}</span>
  1208. <span :title="(this.c1 * Number(137.452)).toFixed(3)">{{
  1209. (this.c1 * Number(137.452)).toFixed(3)
  1210. }}</span>
  1211. <span :title="(this.c1 * Number(34.66)).toFixed(3)"
  1212. >{{ (this.c1 * Number(34.66)).toFixed(3) }}
  1213. </span>
  1214. </li>
  1215. <li>
  1216. <span :title="(this.d1 * Number(1.471)).toFixed(3)"
  1217. >{{ (this.d1 * Number(1.471)).toFixed(3) }}
  1218. </span>
  1219. <span :title="(this.d1 * Number(1.03)).toFixed(3)"
  1220. >{{ (this.d1 * Number(1.03)).toFixed(3) }}
  1221. </span>
  1222. <span :title="(this.d1 * Number(43.127)).toFixed(3)">{{
  1223. (this.d1 * Number(43.127)).toFixed(3)
  1224. }}</span>
  1225. <span :title="(this.d1 * Number(40.875)).toFixed(3)">{{
  1226. (this.d1 * Number(40.875)).toFixed(3)
  1227. }}</span>
  1228. <span :title="(this.d1 * Number(10.307)).toFixed(3)"
  1229. >{{ (this.d1 * Number(10.307)).toFixed(3) }}
  1230. </span>
  1231. </li>
  1232. </ul>
  1233. </div>
  1234. </div>
  1235. </div>
  1236. <div
  1237. v-if="userNatural"
  1238. style="width: 98%; margin-left: 1% margin-bottom: 2%"
  1239. >
  1240. <div style="display: flex; margin-top: 20px">
  1241. <div style="width: 40px; height: 40px">
  1242. <img
  1243. src="@/assets/userUntil-1.png"
  1244. style="width: 100%; height: 100%"
  1245. />
  1246. </div>
  1247. <div
  1248. style="
  1249. font-size: 22px;
  1250. font-weight: 700;
  1251. height: 40px;
  1252. line-height: 40px;
  1253. margin-left: 10px;
  1254. "
  1255. >
  1256. {{ $i18n.locale === 'zh' ? '天然气' : 'Natural gas' }}
  1257. </div>
  1258. </div>
  1259. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  1260. <div style="display: flex; width: 100%; justify-content: space-between">
  1261. <div style="display: flex; flex-wrap: wrap; width: 34%">
  1262. <div
  1263. style="
  1264. width: 100%;
  1265. height: 55px;
  1266. line-height: 55px;
  1267. text-align: center;
  1268. font-size: 23px;
  1269. border-top: 1px solid #dbdbdb;
  1270. border-left: 1px solid #dbdbdb;
  1271. border-right: 1px solid #dbdbdb;
  1272. "
  1273. >
  1274. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  1275. </div>
  1276. <ul class="text-title" style="width: 44%">
  1277. <li>{{ $i18n.locale === 'zh' ? '千立方米(k·m3)' : 'k·m3' }}</li>
  1278. <li>
  1279. {{ $i18n.locale === 'zh' ? '千立方英尺(k·ft3)' : 'k·ft3' }}
  1280. </li>
  1281. </ul>
  1282. <ul style="width: 56%">
  1283. <li>
  1284. <el-input
  1285. type="number"
  1286. v-model="e1"
  1287. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1288. @focus="getFocus('26')"
  1289. @blur="lostBlur"
  1290. @input="getNatural('1')"
  1291. :class="focusClass == 26 ? 'focusClass2' : 'focusClass1'"
  1292. />
  1293. </li>
  1294. <li>
  1295. <el-input
  1296. type="number"
  1297. v-model="f1"
  1298. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1299. @focus="getFocus('27')"
  1300. @blur="lostBlur"
  1301. @input="getNatural('2')"
  1302. :class="focusClass == 27 ? 'focusClass2' : 'focusClass1'"
  1303. />
  1304. </li>
  1305. </ul>
  1306. </div>
  1307. <div style="width: 11%">
  1308. <div>
  1309. <el-button class="user-btn-deft" @click="getNatural('0')">{{
  1310. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  1311. }}</el-button>
  1312. </div>
  1313. <div>
  1314. <el-button class="user-btn-clear" @click="clearNatural">{{
  1315. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  1316. }}</el-button>
  1317. </div>
  1318. </div>
  1319. <div style="display: flex; flex-wrap: wrap; width: 54%">
  1320. <div style="width: 100%; display: flex" class="title-top">
  1321. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  1322. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  1323. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  1324. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  1325. <span style="border-right: 1px solid #dbdbdb">{{
  1326. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  1327. }}</span>
  1328. </div>
  1329. <ul style="width: 100%" class="ui-bgcText">
  1330. <li>
  1331. <span :title="(this.e1 * Number(1.215)).toFixed(3)"
  1332. >{{ (this.e1 * Number(1.215)).toFixed(3) }}
  1333. </span>
  1334. <span :title="(this.e1 * Number(0.851)).toFixed(3)"
  1335. >{{ (this.e1 * Number(0.851)).toFixed(3) }}
  1336. </span>
  1337. <span :title="(this.e1 * Number(35.612)).toFixed(3)">{{
  1338. (this.e1 * Number(35.612)).toFixed(3)
  1339. }}</span>
  1340. <span :title="(this.e1 * Number(33.753)).toFixed(3)">{{
  1341. (this.e1 * Number(33.753)).toFixed(3)
  1342. }}</span>
  1343. <span :title="(this.e1 * Number(8.511)).toFixed(3)"
  1344. >{{ (this.e1 * Number(8.511)).toFixed(3) }}
  1345. </span>
  1346. </li>
  1347. <li>
  1348. <span :title="(this.f1 * Number(0.034)).toFixed(3)"
  1349. >{{ (this.f1 * Number(0.034)).toFixed(3) }}
  1350. </span>
  1351. <span :title="(this.f1 * Number(0.024)).toFixed(3)"
  1352. >{{ (this.f1 * Number(0.024)).toFixed(3) }}
  1353. </span>
  1354. <span :title="(this.f1 * Number(1.009)).toFixed(3)">{{
  1355. (this.f1 * Number(1.009)).toFixed(3)
  1356. }}</span>
  1357. <span :title="(this.f1 * Number(0.956)).toFixed(3)">{{
  1358. (this.f1 * Number(0.956)).toFixed(3)
  1359. }}</span>
  1360. <span :title="(this.f1 * Number(0.241)).toFixed(3)"
  1361. >{{ (this.f1 * Number(0.241)).toFixed(3) }}
  1362. </span>
  1363. </li>
  1364. </ul>
  1365. </div>
  1366. </div>
  1367. </div>
  1368. <div
  1369. v-if="userLiquefied"
  1370. style="width: 98%; margin-left: 1% margin-bottom: 2%"
  1371. >
  1372. <div style="display: flex; margin-top: 20px">
  1373. <div style="width: 40px; height: 40px">
  1374. <img
  1375. src="@/assets/userUntil-1.png"
  1376. style="width: 100%; height: 100%"
  1377. />
  1378. </div>
  1379. <div
  1380. style="
  1381. font-size: 22px;
  1382. font-weight: 700;
  1383. height: 40px;
  1384. line-height: 40px;
  1385. margin-left: 10px;
  1386. "
  1387. >
  1388. {{ $i18n.locale === 'zh' ? '液化石油气' : 'Liquefied petroleum gas' }}
  1389. </div>
  1390. </div>
  1391. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  1392. <div style="display: flex; width: 100%; justify-content: space-between">
  1393. <div style="display: flex; flex-wrap: wrap; width: 34%">
  1394. <div
  1395. style="
  1396. width: 100%;
  1397. height: 55px;
  1398. line-height: 55px;
  1399. text-align: center;
  1400. font-size: 23px;
  1401. border-top: 1px solid #dbdbdb;
  1402. border-left: 1px solid #dbdbdb;
  1403. border-right: 1px solid #dbdbdb;
  1404. "
  1405. >
  1406. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  1407. </div>
  1408. <ul class="text-title" style="width: 44%">
  1409. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  1410. <li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
  1411. <li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
  1412. <li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
  1413. </ul>
  1414. <ul style="width: 56%">
  1415. <li>
  1416. <el-input
  1417. type="number"
  1418. v-model="m"
  1419. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1420. @focus="getFocus('28')"
  1421. @blur="lostBlur"
  1422. @input="getGas('1')"
  1423. :class="focusClass == 28 ? 'focusClass2' : 'focusClass1'"
  1424. />
  1425. </li>
  1426. <li>
  1427. <el-input
  1428. type="number"
  1429. v-model="n"
  1430. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1431. @focus="getFocus('29')"
  1432. @blur="lostBlur"
  1433. @input="getGas('2')"
  1434. :class="focusClass == 29 ? 'focusClass2' : 'focusClass1'"
  1435. />
  1436. </li>
  1437. <li>
  1438. <el-input
  1439. type="number"
  1440. v-model="o"
  1441. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1442. @focus="getFocus('40')"
  1443. @blur="lostBlur"
  1444. @input="getGas('3')"
  1445. :class="focusClass == 40 ? 'focusClass2' : 'focusClass1'"
  1446. />
  1447. </li>
  1448. <li>
  1449. <el-input
  1450. type="number"
  1451. v-model="p"
  1452. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1453. @focus="getFocus('31')"
  1454. @blur="lostBlur"
  1455. @input="getGas('4')"
  1456. :class="focusClass == 31 ? 'focusClass2' : 'focusClass1'"
  1457. />
  1458. </li>
  1459. </ul>
  1460. </div>
  1461. <div style="width: 11%">
  1462. <div>
  1463. <el-button class="user-btn" @click="getGas('0')">{{
  1464. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  1465. }}</el-button>
  1466. </div>
  1467. <div>
  1468. <el-button class="user-btn-clear" @click="clearGas">{{
  1469. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  1470. }}</el-button>
  1471. </div>
  1472. </div>
  1473. <div style="display: flex; flex-wrap: wrap; width: 54%">
  1474. <div style="width: 100%; display: flex" class="title-top">
  1475. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  1476. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  1477. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  1478. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  1479. <span style="border-right: 1px solid #dbdbdb">{{
  1480. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  1481. }}</span>
  1482. </div>
  1483. <ul style="width: 100%" class="ui-bgcText">
  1484. <li>
  1485. <span :title="(this.m * Number(1.714)).toFixed(3)"
  1486. >{{ (this.m * Number(1.714)).toFixed(3) }}
  1487. </span>
  1488. <span :title="(this.m * Number(1.2)).toFixed(3)"
  1489. >{{ (this.m * Number(1.2)).toFixed(3) }}
  1490. </span>
  1491. <span :title="(this.m * Number(50.246)).toFixed(3)">{{
  1492. (this.m * Number(50.246)).toFixed(3)
  1493. }}</span>
  1494. <span :title="(this.m * Number(47.623)).toFixed(3)">{{
  1495. (this.m * Number(47.623)).toFixed(3)
  1496. }}</span>
  1497. <span :title="(this.m * Number(12.009)).toFixed(3)"
  1498. >{{ (this.m * Number(12.009)).toFixed(3) }}
  1499. </span>
  1500. </li>
  1501. <li>
  1502. <span :title="(this.n * Number(0.777)).toFixed(3)"
  1503. >{{ (this.n * Number(0.777)).toFixed(3) }}
  1504. </span>
  1505. <span :title="(this.n * Number(0.544)).toFixed(3)"
  1506. >{{ (this.n * Number(0.544)).toFixed(3) }}
  1507. </span>
  1508. <span :title="(this.n * Number(22.787)).toFixed(3)">{{
  1509. (this.n * Number(22.787)).toFixed(3)
  1510. }}</span>
  1511. <span :title="(this.n * Number(21.598)).toFixed(3)">{{
  1512. (this.n * Number(21.598)).toFixed(3)
  1513. }}</span>
  1514. <span :title="(this.n * Number(5.446)).toFixed(3)"
  1515. >{{ (this.n * Number(5.446)).toFixed(3) }}
  1516. </span>
  1517. </li>
  1518. <li>
  1519. <span :title="(this.o * Number(1.742)).toFixed(3)"
  1520. >{{ (this.o * Number(1.742)).toFixed(3) }}
  1521. </span>
  1522. <span :title="(this.o * Number(1.219)).toFixed(3)"
  1523. >{{ (this.o * Number(1.219)).toFixed(3) }}
  1524. </span>
  1525. <span :title="(this.o * Number(51.048)).toFixed(3)">{{
  1526. (this.o * Number(51.048)).toFixed(3)
  1527. }}</span>
  1528. <span :title="(this.o * Number(48.383)).toFixed(3)">{{
  1529. (this.o * Number(48.383)).toFixed(3)
  1530. }}</span>
  1531. <span :title="(this.o * Number(12.2)).toFixed(3)"
  1532. >{{ (this.o * Number(12.2)).toFixed(3) }}
  1533. </span>
  1534. </li>
  1535. <li>
  1536. <span :title="(this.p * Number(1.556)).toFixed(3)"
  1537. >{{ (this.p * Number(1.556)).toFixed(3) }}
  1538. </span>
  1539. <span :title="(this.p * Number(1.089)).toFixed(3)"
  1540. >{{ (this.p * Number(1.089)).toFixed(3) }}
  1541. </span>
  1542. <span :title="(this.p * Number(45.595)).toFixed(3)">{{
  1543. (this.p * Number(45.595)).toFixed(3)
  1544. }}</span>
  1545. <span :title="(this.p * Number(43.215)).toFixed(3)">{{
  1546. (this.p * Number(43.215)).toFixed(3)
  1547. }}</span>
  1548. <span :title="(this.p * Number(10.897)).toFixed(3)"
  1549. >{{ (this.p * Number(10.897)).toFixed(3) }}
  1550. </span>
  1551. </li>
  1552. </ul>
  1553. </div>
  1554. </div>
  1555. </div>
  1556. <div
  1557. v-if="userHydrogen"
  1558. style="width: 98%; margin-left: 1% margin-bottom: 2%"
  1559. >
  1560. <div style="display: flex; margin-top: 20px">
  1561. <div style="width: 40px; height: 40px">
  1562. <img
  1563. src="@/assets/userUntil-3.png"
  1564. style="width: 100%; height: 100%"
  1565. />
  1566. </div>
  1567. <div
  1568. style="
  1569. font-size: 22px;
  1570. font-weight: 700;
  1571. height: 40px;
  1572. line-height: 40px;
  1573. margin-left: 10px;
  1574. "
  1575. >
  1576. {{ $i18n.locale === 'zh' ? '氢' : 'Hydrogen' }}
  1577. </div>
  1578. </div>
  1579. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  1580. <div style="display: flex; width: 100%; justify-content: space-between">
  1581. <div style="display: flex; flex-wrap: wrap; width: 34%">
  1582. <div
  1583. style="
  1584. width: 100%;
  1585. height: 55px;
  1586. line-height: 55px;
  1587. text-align: center;
  1588. font-size: 23px;
  1589. border-top: 1px solid #dbdbdb;
  1590. border-left: 1px solid #dbdbdb;
  1591. border-right: 1px solid #dbdbdb;
  1592. "
  1593. >
  1594. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  1595. </div>
  1596. <ul class="text-title" style="width: 44%">
  1597. <li>{{ $i18n.locale === 'zh' ? '千立方米(k·m3)' : 'k·m3' }}</li>
  1598. <li>
  1599. {{ $i18n.locale === 'zh' ? '千立方英尺(k·ft3)' : 'k·ft3' }}
  1600. </li>
  1601. <li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
  1602. <li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
  1603. <li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
  1604. <li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
  1605. </ul>
  1606. <ul style="width: 56%">
  1607. <li>
  1608. <el-input
  1609. type="number"
  1610. v-model="a2"
  1611. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1612. @focus="getFocus('32')"
  1613. @blur="lostBlur"
  1614. @input="getHydrogen('1')"
  1615. :class="focusClass == 32 ? 'focusClass2' : 'focusClass1'"
  1616. />
  1617. </li>
  1618. <li>
  1619. <el-input
  1620. type="number"
  1621. v-model="b2"
  1622. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1623. @focus="getFocus('33')"
  1624. @blur="lostBlur"
  1625. @input="getHydrogen('2')"
  1626. :class="focusClass == 33 ? 'focusClass2' : 'focusClass1'"
  1627. />
  1628. </li>
  1629. <li>
  1630. <el-input
  1631. type="number"
  1632. v-model="c2"
  1633. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1634. @focus="getFocus('34')"
  1635. @blur="lostBlur"
  1636. @input="getHydrogen('3')"
  1637. :class="focusClass == 34 ? 'focusClass2' : 'focusClass1'"
  1638. />
  1639. </li>
  1640. <li>
  1641. <el-input
  1642. type="number"
  1643. v-model="d2"
  1644. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1645. @focus="getFocus('35')"
  1646. @blur="lostBlur"
  1647. @input="getHydrogen('4')"
  1648. :class="focusClass == 35 ? 'focusClass2' : 'focusClass1'"
  1649. />
  1650. </li>
  1651. <li>
  1652. <el-input
  1653. type="number"
  1654. v-model="e2"
  1655. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1656. @focus="getFocus('36')"
  1657. @blur="lostBlur"
  1658. @input="getHydrogen('5')"
  1659. :class="focusClass == 36 ? 'focusClass2' : 'focusClass1'"
  1660. />
  1661. </li>
  1662. <li>
  1663. <el-input
  1664. type="number"
  1665. v-model="f2"
  1666. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1667. @focus="getFocus('37')"
  1668. @blur="lostBlur"
  1669. @input="getHydrogen('6')"
  1670. :class="focusClass == 37 ? 'focusClass2' : 'focusClass1'"
  1671. />
  1672. </li>
  1673. </ul>
  1674. </div>
  1675. <div style="width: 11%">
  1676. <div>
  1677. <el-button class="user-btn" @click="getHydrogen('0')">{{
  1678. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  1679. }}</el-button>
  1680. </div>
  1681. <div>
  1682. <el-button class="user-btn-clear" @click="clearHydrogen">{{
  1683. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  1684. }}</el-button>
  1685. </div>
  1686. </div>
  1687. <div style="display: flex; flex-wrap: wrap; width: 54%">
  1688. <div style="width: 100%; display: flex" class="title-top">
  1689. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  1690. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  1691. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  1692. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  1693. <span style="border-right: 1px solid #dbdbdb">{{
  1694. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  1695. }}</span>
  1696. </div>
  1697. <ul style="width: 100%" class="ui-bgcText">
  1698. <li>
  1699. <span :title="(this.a2 * Number(0.436)).toFixed(3)"
  1700. >{{ (this.a2 * Number(0.436)).toFixed(3) }}
  1701. </span>
  1702. <span :title="(this.a2 * Number(0.305)).toFixed(3)"
  1703. >{{ (this.a2 * Number(0.305)).toFixed(3) }}
  1704. </span>
  1705. <span :title="(this.a2 * Number(12.78)).toFixed(3)">{{
  1706. (this.a2 * Number(12.78)).toFixed(3)
  1707. }}</span>
  1708. <span :title="(this.a2 * Number(12.112)).toFixed(3)">{{
  1709. (this.a2 * Number(12.112)).toFixed(3)
  1710. }}</span>
  1711. <span :title="(this.a2 * Number(3.054)).toFixed(3)"
  1712. >{{ (this.a2 * Number(3.054)).toFixed(3) }}
  1713. </span>
  1714. </li>
  1715. <li>
  1716. <span :title="(this.b2 * Number(0.012)).toFixed(3)"
  1717. >{{ (this.b2 * Number(0.012)).toFixed(3) }}
  1718. </span>
  1719. <span :title="(this.b2 * Number(0.009)).toFixed(3)"
  1720. >{{ (this.b2 * Number(0.009)).toFixed(3) }}
  1721. </span>
  1722. <span :title="(this.b2 * Number(0.362)).toFixed(3)">{{
  1723. (this.b2 * Number(0.362)).toFixed(3)
  1724. }}</span>
  1725. <span :title="(this.b2 * Number(0.343)).toFixed(3)">{{
  1726. (this.b2 * Number(0.343)).toFixed(3)
  1727. }}</span>
  1728. <span :title="(this.b2 * Number(0.086)).toFixed(3)"
  1729. >{{ (this.b2 * Number(0.086)).toFixed(3) }}
  1730. </span>
  1731. </li>
  1732. <li>
  1733. <span :title="(this.c2 * Number(4.85)).toFixed(3)"
  1734. >{{ (this.c2 * Number(4.85)).toFixed(3) }}
  1735. </span>
  1736. <span :title="(this.c2 * Number(3.395)).toFixed(3)"
  1737. >{{ (this.c2 * Number(3.395)).toFixed(3) }}
  1738. </span>
  1739. <span :title="(this.c2 * Number(142.154)).toFixed(3)">{{
  1740. (this.c2 * Number(142.154)).toFixed(3)
  1741. }}</span>
  1742. <span :title="(this.c2 * Number(134.733)).toFixed(3)">{{
  1743. (this.c2 * Number(134.733)).toFixed(3)
  1744. }}</span>
  1745. <span :title="(this.c2 * Number(33.974)).toFixed(3)"
  1746. >{{ (this.c2 * Number(33.974)).toFixed(3) }}
  1747. </span>
  1748. </li>
  1749. <li>
  1750. <span :title="(this.d2 * Number(2.2)).toFixed(3)"
  1751. >{{ (this.d2 * Number(2.2)).toFixed(3) }}
  1752. </span>
  1753. <span :title="(this.d2 * Number(1.54)).toFixed(3)"
  1754. >{{ (this.d2 * Number(1.54)).toFixed(3) }}
  1755. </span>
  1756. <span :title="(this.d2 * Number(64.469)).toFixed(3)">{{
  1757. (this.d2 * Number(64.469)).toFixed(3)
  1758. }}</span>
  1759. <span :title="(this.d2 * Number(61.103)).toFixed(3)">{{
  1760. (this.d2 * Number(61.103)).toFixed(3)
  1761. }}</span>
  1762. <span :title="(this.d2 * Number(15.408)).toFixed(3)"
  1763. >{{ (this.d2 * Number(15.408)).toFixed(3) }}
  1764. </span>
  1765. </li>
  1766. <li>
  1767. <span :title="(this.e2 * Number(4.927)).toFixed(3)"
  1768. >{{ (this.e2 * Number(4.927)).toFixed(3) }}
  1769. </span>
  1770. <span :title="(this.e2 * Number(3.449)).toFixed(3)"
  1771. >{{ (this.e2 * Number(3.449)).toFixed(3) }}
  1772. </span>
  1773. <span :title="(this.e2 * Number(144.421)).toFixed(3)">{{
  1774. (this.e2 * Number(144.421)).toFixed(3)
  1775. }}</span>
  1776. <span :title="(this.e2 * Number(136.882)).toFixed(3)">{{
  1777. (this.e2 * Number(136.882)).toFixed(3)
  1778. }}</span>
  1779. <span :title="(this.e2 * Number(34.516)).toFixed(3)"
  1780. >{{ (this.e2 * Number(34.516)).toFixed(3) }}
  1781. </span>
  1782. </li>
  1783. <li>
  1784. <span :title="(this.f2 * Number(4.401)).toFixed(3)"
  1785. >{{ (this.f2 * Number(4.401)).toFixed(3) }}
  1786. </span>
  1787. <span :title="(this.f2 * Number(3.081)).toFixed(3)"
  1788. >{{ (this.f2 * Number(3.081)).toFixed(3) }}
  1789. </span>
  1790. <span :title="(this.f2 * Number(128.996)).toFixed(3)">{{
  1791. (this.f2 * Number(128.996)).toFixed(3)
  1792. }}</span>
  1793. <span :title="(this.f2 * Number(122.262)).toFixed(3)">{{
  1794. (this.f2 * Number(122.262)).toFixed(3)
  1795. }}</span>
  1796. <span :title="(this.f2 * Number(30.83)).toFixed(3)"
  1797. >{{ (this.f2 * Number(30.83)).toFixed(3) }}
  1798. </span>
  1799. </li>
  1800. </ul>
  1801. </div>
  1802. </div>
  1803. </div>
  1804. <div v-if="userPower" style="width: 98%; margin-left: 1% margin-bottom: 2%">
  1805. <div style="display: flex; margin-top: 20px">
  1806. <div style="width: 40px; height: 40px">
  1807. <img
  1808. src="@/assets/userUntil-4.png"
  1809. style="width: 100%; height: 100%"
  1810. />
  1811. </div>
  1812. <div
  1813. style="
  1814. font-size: 22px;
  1815. font-weight: 700;
  1816. height: 40px;
  1817. line-height: 40px;
  1818. margin-left: 10px;
  1819. "
  1820. >
  1821. {{ $i18n.locale === 'zh' ? '电力' : 'Power' }}
  1822. </div>
  1823. </div>
  1824. <div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
  1825. <div style="display: flex; width: 100%; justify-content: space-between">
  1826. <div style="display: flex; flex-wrap: wrap; width: 34%">
  1827. <div
  1828. style="
  1829. width: 100%;
  1830. height: 55px;
  1831. line-height: 55px;
  1832. text-align: center;
  1833. font-size: 23px;
  1834. border-top: 1px solid #dbdbdb;
  1835. border-left: 1px solid #dbdbdb;
  1836. border-right: 1px solid #dbdbdb;
  1837. "
  1838. >
  1839. {{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
  1840. </div>
  1841. <ul class="text-title" style="width: 44%">
  1842. <li>{{ $i18n.locale === 'zh' ? '千千瓦时(MWh)' : 'MWh' }}</li>
  1843. <li>
  1844. {{ $i18n.locale === 'zh' ? '千瓦时(kWh)' : 'kWh' }}
  1845. </li>
  1846. </ul>
  1847. <ul style="width: 56%">
  1848. <li>
  1849. <el-input
  1850. type="number"
  1851. v-model="g1"
  1852. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1853. @focus="getFocus('38')"
  1854. @blur="lostBlur"
  1855. @input="getPower('1')"
  1856. :class="focusClass == 38 ? 'focusClass2' : 'focusClass1'"
  1857. />
  1858. </li>
  1859. <li>
  1860. <el-input
  1861. type="number"
  1862. v-model="h1"
  1863. :placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
  1864. @focus="getFocus('39')"
  1865. @blur="lostBlur"
  1866. @input="getPower('2')"
  1867. :class="focusClass == 39 ? 'focusClass2' : 'focusClass1'"
  1868. />
  1869. </li>
  1870. </ul>
  1871. </div>
  1872. <div style="width: 11%; text-align: center !important">
  1873. <div>
  1874. <el-button class="user-btn-deft" @click="getPower('0')">{{
  1875. $i18n.locale === 'zh' ? '换 算' : 'Conversion'
  1876. }}</el-button>
  1877. </div>
  1878. <div>
  1879. <el-button class="user-btn-clear" @click="clearPower">{{
  1880. $i18n.locale === 'zh' ? '数据重置' : 'Data reset'
  1881. }}</el-button>
  1882. </div>
  1883. </div>
  1884. <div style="display: flex; flex-wrap: wrap; width: 54%">
  1885. <div style="width: 100%; display: flex" class="title-top">
  1886. <span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
  1887. <span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
  1888. <span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
  1889. <span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
  1890. <span style="border-right: 1px solid #dbdbdb">{{
  1891. $i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
  1892. }}</span>
  1893. </div>
  1894. <ul style="width: 100%" class="ui-bgcText">
  1895. <li>
  1896. <span :title="(this.g1 * Number(0.123)).toFixed(3)"
  1897. >{{ (this.g1 * Number(0.123)).toFixed(3) }}
  1898. </span>
  1899. <span :title="(this.g1 * Number(0.086)).toFixed(3)"
  1900. >{{ (this.g1 * Number(0.086)).toFixed(3) }}
  1901. </span>
  1902. <span :title="(this.g1 * Number(3.602)).toFixed(3)">{{
  1903. (this.g1 * Number(3.602)).toFixed(3)
  1904. }}</span>
  1905. <span :title="(this.g1 * Number(3.414)).toFixed(3)">{{
  1906. (this.g1 * Number(3.414)).toFixed(3)
  1907. }}</span>
  1908. <span :title="(this.g1 * Number(0.861)).toFixed(3)"
  1909. >{{ (this.g1 * Number(0.861)).toFixed(3) }}
  1910. </span>
  1911. </li>
  1912. <li style="width: 100%; height: 41px; display: flex; border: none">
  1913. <div
  1914. style="
  1915. width: 35.8%;
  1916. height: 41px;
  1917. line-height: 41px;
  1918. text-align: center;
  1919. border: 1px solid #dbdbdb;
  1920. overflow: hidden;
  1921. white-space: nowrap;
  1922. text-overflow: ellipsis;
  1923. "
  1924. :title="(this.h1 * Number(301.5)).toFixed(3)"
  1925. >
  1926. {{ (this.h1 * Number(301.5)).toFixed(3)
  1927. }}{{ $i18n.locale === 'zh' ? '克' : 'g' }}
  1928. </div>
  1929. <div
  1930. style="
  1931. width: 63.8%;
  1932. height: 41px;
  1933. line-height: 41px;
  1934. text-align: center;
  1935. border-top: 1px solid #dbdbdb;
  1936. border-bottom: 1px solid #dbdbdb;
  1937. border-right: 1px solid #dbdbdb;
  1938. overflow: hidden;
  1939. white-space: nowrap;
  1940. text-overflow: ellipsis;
  1941. "
  1942. :title="(this.h1 * Number(0.3)).toFixed(3)"
  1943. >
  1944. {{ (this.h1 * Number(0.3)).toFixed(3)
  1945. }}{{ $i18n.locale === 'zh' ? '立方米' : 'm3' }}
  1946. </div>
  1947. </li>
  1948. </ul>
  1949. </div>
  1950. </div>
  1951. </div>
  1952. </div>
  1953. </template>
  1954. <script>
  1955. export default {
  1956. name: 'unitConversion',
  1957. data() {
  1958. return {
  1959. focusClass: '',
  1960. userRaw: true,
  1961. userWashed: true,
  1962. userCoke: true,
  1963. userCrude: true,
  1964. userDiesel: true,
  1965. userGasoline: true,
  1966. userNatural: true,
  1967. userLiquefied: true,
  1968. userHydrogen: true,
  1969. userPower: true,
  1970. informationsClass: '0',
  1971. textInfo: '请输入数值',
  1972. textInfo1: 'Please enter a value',
  1973. //原煤
  1974. disabled: false,
  1975. a: '',
  1976. b: '',
  1977. c: '',
  1978. d: '',
  1979. //洗精煤
  1980. disabled1: false,
  1981. e: '',
  1982. f: '',
  1983. g: '',
  1984. h: '',
  1985. //焦炭
  1986. disabled2: false,
  1987. i: '',
  1988. j: '',
  1989. k: '',
  1990. l: '',
  1991. //液化石油气
  1992. disabled3: false,
  1993. m: '',
  1994. n: '',
  1995. o: '',
  1996. p: '',
  1997. //原油
  1998. disabled4: false,
  1999. q: '',
  2000. r: '',
  2001. s: '',
  2002. t: '',
  2003. u: '',
  2004. //柴油
  2005. disabled5: false,
  2006. v: '',
  2007. w: '',
  2008. x: '',
  2009. y: '',
  2010. //汽油/煤油
  2011. disabled6: false,
  2012. a1: '',
  2013. b1: '',
  2014. c1: '',
  2015. d1: '',
  2016. //天然气
  2017. disabled7: false,
  2018. e1: '',
  2019. f1: '',
  2020. //电力
  2021. disabled8: false,
  2022. g1: '',
  2023. h1: '',
  2024. //氢
  2025. disabled9: false,
  2026. a2: '',
  2027. b2: '',
  2028. c2: '',
  2029. d2: '',
  2030. e2: '',
  2031. f2: '',
  2032. }
  2033. },
  2034. mounted() {
  2035. this.getInfo('0')
  2036. },
  2037. methods: {
  2038. lostBlur() {
  2039. this.focusClass = ''
  2040. },
  2041. getFocus(num) {
  2042. this.focusClass = num
  2043. },
  2044. getInfo(num) {
  2045. this.informationsClass = num
  2046. if (num == '0') {
  2047. this.userRaw = true
  2048. this.userWashed = true
  2049. this.userCoke = true
  2050. this.userCrude = true
  2051. this.userDiesel = true
  2052. this.userGasoline = true
  2053. this.userNatural = true
  2054. this.userLiquefied = true
  2055. this.userHydrogen = true
  2056. this.userPower = true
  2057. }
  2058. if (num == '1') {
  2059. this.userRaw = true
  2060. this.userWashed = false
  2061. this.userCoke = false
  2062. this.userCrude = false
  2063. this.userDiesel = false
  2064. this.userGasoline = false
  2065. this.userNatural = false
  2066. this.userLiquefied = false
  2067. this.userHydrogen = false
  2068. this.userPower = false
  2069. }
  2070. if (num == '2') {
  2071. this.userRaw = false
  2072. this.userWashed = true
  2073. this.userCoke = false
  2074. this.userCrude = false
  2075. this.userDiesel = false
  2076. this.userGasoline = false
  2077. this.userNatural = false
  2078. this.userLiquefied = false
  2079. this.userHydrogen = false
  2080. this.userPower = false
  2081. }
  2082. if (num == '3') {
  2083. this.userRaw = false
  2084. this.userWashed = false
  2085. this.userCoke = true
  2086. this.userCrude = false
  2087. this.userDiesel = false
  2088. this.userGasoline = false
  2089. this.userNatural = false
  2090. this.userLiquefied = false
  2091. this.userHydrogen = false
  2092. this.userPower = false
  2093. }
  2094. if (num == '4') {
  2095. this.userRaw = false
  2096. this.userWashed = false
  2097. this.userCoke = false
  2098. this.userCrude = true
  2099. this.userDiesel = false
  2100. this.userGasoline = false
  2101. this.userNatural = false
  2102. this.userLiquefied = false
  2103. this.userHydrogen = false
  2104. this.userPower = false
  2105. }
  2106. if (num == '5') {
  2107. this.userRaw = false
  2108. this.userWashed = false
  2109. this.userCoke = false
  2110. this.userCrude = false
  2111. this.userDiesel = true
  2112. this.userGasoline = false
  2113. this.userNatural = false
  2114. this.userLiquefied = false
  2115. this.userHydrogen = false
  2116. this.userPower = false
  2117. }
  2118. if (num == '6') {
  2119. this.userRaw = false
  2120. this.userWashed = false
  2121. this.userCoke = false
  2122. this.userCrude = false
  2123. this.userDiesel = false
  2124. this.userGasoline = true
  2125. this.userNatural = false
  2126. this.userLiquefied = false
  2127. this.userHydrogen = false
  2128. this.userPower = false
  2129. }
  2130. if (num == '7') {
  2131. this.userRaw = false
  2132. this.userWashed = false
  2133. this.userCoke = false
  2134. this.userCrude = false
  2135. this.userDiesel = false
  2136. this.userGasoline = false
  2137. this.userNatural = true
  2138. this.userLiquefied = false
  2139. this.userHydrogen = false
  2140. this.userPower = false
  2141. }
  2142. if (num == '8') {
  2143. this.userRaw = false
  2144. this.userWashed = false
  2145. this.userCoke = false
  2146. this.userCrude = false
  2147. this.userDiesel = false
  2148. this.userGasoline = false
  2149. this.userNatural = false
  2150. this.userLiquefied = true
  2151. this.userHydrogen = false
  2152. this.userPower = false
  2153. }
  2154. if (num == '9') {
  2155. this.userRaw = false
  2156. this.userWashed = false
  2157. this.userCoke = false
  2158. this.userCrude = false
  2159. this.userDiesel = false
  2160. this.userGasoline = false
  2161. this.userNatural = false
  2162. this.userLiquefied = false
  2163. this.userHydrogen = true
  2164. this.userPower = false
  2165. }
  2166. if (num == '10') {
  2167. this.userRaw = false
  2168. this.userWashed = false
  2169. this.userCoke = false
  2170. this.userCrude = false
  2171. this.userDiesel = false
  2172. this.userGasoline = false
  2173. this.userNatural = false
  2174. this.userLiquefied = false
  2175. this.userHydrogen = false
  2176. this.userPower = true
  2177. }
  2178. },
  2179. getNum(num) {
  2180. // if (this.disabled == true) {
  2181. // if (this.$i18n.locale === 'zh') {
  2182. // this.$message.error('请清除数据之后再进行换算')
  2183. // } else {
  2184. // this.$message.error('Please clear the data before conversion')
  2185. // }
  2186. // return false
  2187. // }
  2188. // this.disabled = true
  2189. if (num == 0) {
  2190. // if (this.a !== '') {
  2191. // let a1 = Number(this.a)
  2192. // this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2193. // this.c = (a1 * Number(0.9843)).toFixed(3)
  2194. // this.d = (a1 * Number(1.102)).toFixed(3)
  2195. // }
  2196. // if (this.b !== '') {
  2197. // this.a = ((Number(this.b) * Number(1000)) / Number(2205)).toFixed(3)
  2198. // let a1 = Number(this.a)
  2199. // this.c = (a1 * Number(0.9843)).toFixed(3)
  2200. // this.d = (a1 * Number(1.102)).toFixed(3)
  2201. // }
  2202. // if (this.c !== '') {
  2203. // this.a = (Number(this.c) / Number(0.9843)).toFixed(3)
  2204. // let a1 = Number(this.a)
  2205. // this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2206. // this.d = (a1 * Number(1.102)).toFixed(3)
  2207. // }
  2208. // if (this.d !== '') {
  2209. // this.a = (Number(this.d) / Number(1.102)).toFixed(3)
  2210. // let a1 = Number(this.a)
  2211. // this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2212. // this.c = (a1 * Number(0.9843)).toFixed(3)
  2213. // }
  2214. } else {
  2215. if (num == '1') {
  2216. if (this.a === '') {
  2217. this.disabled = false
  2218. this.a = ''
  2219. this.b = ''
  2220. this.c = ''
  2221. this.d = ''
  2222. } else {
  2223. let a1 = Number(this.a)
  2224. this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2225. this.c = (a1 * Number(0.9843)).toFixed(3)
  2226. this.d = (a1 * Number(1.102)).toFixed(3)
  2227. }
  2228. } else if (num == '2') {
  2229. if (this.b === '') {
  2230. this.disabled = false
  2231. this.a = ''
  2232. this.b = ''
  2233. this.c = ''
  2234. this.d = ''
  2235. } else {
  2236. this.a = ((Number(this.b) * Number(1000)) / Number(2205)).toFixed(3)
  2237. let a1 = Number(this.a)
  2238. this.c = (a1 * Number(0.9843)).toFixed(3)
  2239. this.d = (a1 * Number(1.102)).toFixed(3)
  2240. }
  2241. } else if (num == '3') {
  2242. if (this.c === '') {
  2243. this.disabled = false
  2244. this.a = ''
  2245. this.b = ''
  2246. this.c = ''
  2247. this.d = ''
  2248. } else {
  2249. this.a = (Number(this.c) / Number(0.9843)).toFixed(3)
  2250. let a1 = Number(this.a)
  2251. this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2252. this.d = (a1 * Number(1.102)).toFixed(3)
  2253. }
  2254. } else if (num == '4') {
  2255. if (this.d === '') {
  2256. this.disabled = false
  2257. this.a = ''
  2258. this.b = ''
  2259. this.c = ''
  2260. this.d = ''
  2261. } else {
  2262. this.a = (Number(this.d) / Number(1.102)).toFixed(3)
  2263. let a1 = Number(this.a)
  2264. this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2265. this.c = (a1 * Number(0.9843)).toFixed(3)
  2266. }
  2267. }
  2268. }
  2269. },
  2270. clearNum() {
  2271. this.disabled = false
  2272. this.a = ''
  2273. this.b = ''
  2274. this.c = ''
  2275. this.d = ''
  2276. },
  2277. getWashed(num) {
  2278. // if (this.disabled1 == true) {
  2279. // if (this.$i18n.locale === 'zh') {
  2280. // this.$message.error('请清除数据之后再进行换算')
  2281. // } else {
  2282. // this.$message.error('Please clear the data before conversion')
  2283. // }
  2284. // return false
  2285. // }
  2286. // this.disabled1 = true
  2287. if (num == 0) {
  2288. // if (this.e !== '') {
  2289. // let a1 = Number(this.e)
  2290. // this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2291. // this.g = (a1 * Number(0.9843)).toFixed(3)
  2292. // this.h = (a1 * Number(1.102)).toFixed(3)
  2293. // } else if (this.f !== '') {
  2294. // this.e = ((Number(this.f) * Number(1000)) / Number(2205)).toFixed(3)
  2295. // let a1 = Number(this.e)
  2296. // this.g = (a1 * Number(0.9843)).toFixed(3)
  2297. // this.h = (a1 * Number(1.102)).toFixed(3)
  2298. // } else if (this.g !== '') {
  2299. // this.e = (Number(this.g) / Number(0.9843)).toFixed(3)
  2300. // let a1 = Number(this.e)
  2301. // this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2302. // this.h = (a1 * Number(1.102)).toFixed(3)
  2303. // } else if (this.h !== '') {
  2304. // this.e = (Number(this.h) / Number(1.102)).toFixed(3)
  2305. // let a1 = Number(this.e)
  2306. // this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2307. // this.g = (a1 * Number(0.9843)).toFixed(3)
  2308. // }
  2309. } else {
  2310. if (num == '1') {
  2311. if (this.e === '') {
  2312. this.disabled1 = false
  2313. this.e = ''
  2314. this.f = ''
  2315. this.g = ''
  2316. this.h = ''
  2317. } else {
  2318. let a1 = Number(this.e)
  2319. this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2320. this.g = (a1 * Number(0.9843)).toFixed(3)
  2321. this.h = (a1 * Number(1.102)).toFixed(3)
  2322. }
  2323. } else if (num == '2') {
  2324. if (this.f === '') {
  2325. this.disabled1 = false
  2326. this.e = ''
  2327. this.f = ''
  2328. this.g = ''
  2329. this.h = ''
  2330. } else {
  2331. this.e = ((Number(this.f) * Number(1000)) / Number(2205)).toFixed(3)
  2332. let a1 = Number(this.e)
  2333. this.g = (a1 * Number(0.9843)).toFixed(3)
  2334. this.h = (a1 * Number(1.102)).toFixed(3)
  2335. }
  2336. } else if (num == '3') {
  2337. if (this.g === '') {
  2338. this.disabled1 = false
  2339. this.e = ''
  2340. this.f = ''
  2341. this.g = ''
  2342. this.h = ''
  2343. } else {
  2344. this.e = (Number(this.g) / Number(0.9843)).toFixed(3)
  2345. let a1 = Number(this.e)
  2346. this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2347. this.h = (a1 * Number(1.102)).toFixed(3)
  2348. }
  2349. } else if (num == '4') {
  2350. if (this.h === '') {
  2351. this.disabled1 = false
  2352. this.e = ''
  2353. this.f = ''
  2354. this.g = ''
  2355. this.h = ''
  2356. } else {
  2357. this.e = (Number(this.h) / Number(1.102)).toFixed(3)
  2358. let a1 = Number(this.e)
  2359. this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2360. this.g = (a1 * Number(0.9843)).toFixed(3)
  2361. }
  2362. }
  2363. }
  2364. },
  2365. clearWashed() {
  2366. this.disabled1 = false
  2367. this.e = ''
  2368. this.f = ''
  2369. this.g = ''
  2370. this.h = ''
  2371. },
  2372. getCoke(num) {
  2373. // if (this.disabled2 == true) {
  2374. // if (this.$i18n.locale === 'zh') {
  2375. // this.$message.error('请清除数据之后再进行换算')
  2376. // } else {
  2377. // this.$message.error('Please clear the data before conversion')
  2378. // }
  2379. // return false
  2380. // }
  2381. // this.disabled2 = true
  2382. if (num == 0) {
  2383. // if (this.i !== '') {
  2384. // let a1 = Number(this.i)
  2385. // this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2386. // this.k = (a1 * Number(0.9843)).toFixed(3)
  2387. // this.l = (a1 * Number(1.102)).toFixed(3)
  2388. // } else if (this.j !== '') {
  2389. // this.i = ((Number(this.j) * Number(1000)) / Number(2205)).toFixed(3)
  2390. // let a1 = Number(this.i)
  2391. // this.k = (a1 * Number(0.9843)).toFixed(3)
  2392. // this.l = (a1 * Number(1.102)).toFixed(3)
  2393. // } else if (this.k !== '') {
  2394. // this.i = (Number(this.k) / Number(0.9843)).toFixed(3)
  2395. // let a1 = Number(this.i)
  2396. // this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2397. // this.l = (a1 * Number(1.102)).toFixed(3)
  2398. // } else if (this.l !== '') {
  2399. // this.i = (Number(this.l) / Number(1.102)).toFixed(3)
  2400. // let a1 = Number(this.i)
  2401. // this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2402. // this.k = (a1 * Number(0.9843)).toFixed(3)
  2403. // }
  2404. } else {
  2405. if (num == '1') {
  2406. if (this.i === '') {
  2407. this.disabled2 = false
  2408. this.i = ''
  2409. this.j = ''
  2410. this.k = ''
  2411. this.l = ''
  2412. } else {
  2413. let a1 = Number(this.i)
  2414. this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2415. this.k = (a1 * Number(0.9843)).toFixed(3)
  2416. this.l = (a1 * Number(1.102)).toFixed(3)
  2417. }
  2418. } else if (num == '2') {
  2419. if (this.j === '') {
  2420. this.disabled2 = false
  2421. this.i = ''
  2422. this.j = ''
  2423. this.k = ''
  2424. this.l = ''
  2425. } else {
  2426. this.i = ((Number(this.j) * Number(1000)) / Number(2205)).toFixed(3)
  2427. let a1 = Number(this.i)
  2428. this.k = (a1 * Number(0.9843)).toFixed(3)
  2429. this.l = (a1 * Number(1.102)).toFixed(3)
  2430. }
  2431. } else if (num == '3') {
  2432. if (this.k === '') {
  2433. this.disabled2 = false
  2434. this.i = ''
  2435. this.j = ''
  2436. this.k = ''
  2437. this.l = ''
  2438. } else {
  2439. this.i = (Number(this.k) / Number(0.9843)).toFixed(3)
  2440. let a1 = Number(this.i)
  2441. this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2442. this.l = (a1 * Number(1.102)).toFixed(3)
  2443. }
  2444. } else if (num == '4') {
  2445. if (this.l === '') {
  2446. this.disabled2 = false
  2447. this.i = ''
  2448. this.j = ''
  2449. this.k = ''
  2450. this.l = ''
  2451. } else {
  2452. this.i = (Number(this.l) / Number(1.102)).toFixed(3)
  2453. let a1 = Number(this.i)
  2454. this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2455. this.k = (a1 * Number(0.9843)).toFixed(3)
  2456. }
  2457. }
  2458. }
  2459. },
  2460. clearCoke() {
  2461. this.disabled2 = false
  2462. this.i = ''
  2463. this.j = ''
  2464. this.k = ''
  2465. this.l = ''
  2466. },
  2467. getGas(num) {
  2468. // if (this.disabled3 == true) {
  2469. // if (this.$i18n.locale === 'zh') {
  2470. // this.$message.error('请清除数据之后再进行换算')
  2471. // } else {
  2472. // this.$message.error('Please clear the data before conversion')
  2473. // }
  2474. // return false
  2475. // }
  2476. // this.disabled3 = true
  2477. if (num == 0) {
  2478. // if (this.m !== '') {
  2479. // let a1 = Number(this.m)
  2480. // this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2481. // this.o = (a1 * Number(0.9843)).toFixed(3)
  2482. // this.p = (a1 * Number(1.102)).toFixed(3)
  2483. // } else if (this.n !== '') {
  2484. // this.m = ((Number(this.n) * Number(1000)) / Number(2205)).toFixed(3)
  2485. // let a1 = Number(this.m)
  2486. // this.o = (a1 * Number(0.9843)).toFixed(3)
  2487. // this.p = (a1 * Number(1.102)).toFixed(3)
  2488. // } else if (this.o !== '') {
  2489. // this.m = (Number(this.o) / Number(0.9843)).toFixed(3)
  2490. // let a1 = Number(this.m)
  2491. // this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2492. // this.p = (a1 * Number(1.102)).toFixed(3)
  2493. // } else if (this.p !== '') {
  2494. // this.m = (Number(this.p) / Number(1.102)).toFixed(3)
  2495. // let a1 = Number(this.m)
  2496. // this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2497. // this.o = (a1 * Number(0.9843)).toFixed(3)
  2498. // }
  2499. } else {
  2500. if (num == '1') {
  2501. if (this.m === '') {
  2502. this.disabled3 = false
  2503. this.m = ''
  2504. this.n = ''
  2505. this.o = ''
  2506. this.p = ''
  2507. } else {
  2508. let a1 = Number(this.m)
  2509. this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2510. this.o = (a1 * Number(0.9843)).toFixed(3)
  2511. this.p = (a1 * Number(1.102)).toFixed(3)
  2512. }
  2513. } else if (num == '2') {
  2514. if (this.n === '') {
  2515. this.disabled3 = false
  2516. this.m = ''
  2517. this.n = ''
  2518. this.o = ''
  2519. this.p = ''
  2520. } else {
  2521. this.m = ((Number(this.n) * Number(1000)) / Number(2205)).toFixed(3)
  2522. let a1 = Number(this.m)
  2523. this.o = (a1 * Number(0.9843)).toFixed(3)
  2524. this.p = (a1 * Number(1.102)).toFixed(3)
  2525. }
  2526. } else if (num == '3') {
  2527. if (this.o === '') {
  2528. this.disabled3 = false
  2529. this.m = ''
  2530. this.n = ''
  2531. this.o = ''
  2532. this.p = ''
  2533. } else {
  2534. this.m = (Number(this.o) / Number(0.9843)).toFixed(3)
  2535. let a1 = Number(this.m)
  2536. this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2537. this.p = (a1 * Number(1.102)).toFixed(3)
  2538. }
  2539. } else if (num == '4') {
  2540. if (this.p === '') {
  2541. this.disabled3 = false
  2542. this.m = ''
  2543. this.n = ''
  2544. this.o = ''
  2545. this.p = ''
  2546. } else {
  2547. this.m = (Number(this.p) / Number(1.102)).toFixed(3)
  2548. let a1 = Number(this.m)
  2549. this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
  2550. this.o = (a1 * Number(0.9843)).toFixed(3)
  2551. }
  2552. }
  2553. }
  2554. },
  2555. clearGas() {
  2556. this.disabled3 = false
  2557. this.m = ''
  2558. this.n = ''
  2559. this.o = ''
  2560. this.p = ''
  2561. },
  2562. getOil(num) {
  2563. // if (this.disabled4 == true) {
  2564. // if (this.$i18n.locale === 'zh') {
  2565. // this.$message.error('请清除数据之后再进行换算')
  2566. // } else {
  2567. // this.$message.error('Please clear the data before conversion')
  2568. // }
  2569. // return false
  2570. // }
  2571. // this.disabled4 = true
  2572. if (num == 0) {
  2573. // if (this.q !== '') {
  2574. // this.u = (Number(this.q) / Number(7.38)).toFixed(3)
  2575. // let u1 = Number(this.u)
  2576. // this.r = (u1 * Number(1.173)).toFixed(3)
  2577. // this.s = (u1 * Number(0.3098)).toFixed(3)
  2578. // this.t = (u1 * Number(0.258)).toFixed(3)
  2579. // } else if (this.r !== '') {
  2580. // this.u = (Number(this.r) / Number(1.173)).toFixed(3)
  2581. // let u1 = Number(this.u)
  2582. // this.q = (u1 * Number(7.38)).toFixed(3)
  2583. // this.s = (u1 * Number(0.3098)).toFixed(3)
  2584. // this.t = (u1 * Number(0.258)).toFixed(3)
  2585. // } else if (this.s !== '') {
  2586. // this.u = (Number(this.s) / Number(0.3098)).toFixed(3)
  2587. // let u1 = Number(this.u)
  2588. // this.q = (u1 * Number(7.38)).toFixed(3)
  2589. // this.r = (u1 * Number(1.173)).toFixed(3)
  2590. // this.t = (u1 * Number(0.258)).toFixed(3)
  2591. // } else if (this.t !== '') {
  2592. // this.u = (Number(this.t) / Number(0.258)).toFixed(3)
  2593. // let u1 = Number(this.u)
  2594. // this.q = (u1 * Number(7.38)).toFixed(3)
  2595. // this.r = (u1 * Number(1.173)).toFixed(3)
  2596. // this.s = (u1 * Number(0.3098)).toFixed(3)
  2597. // } else if (this.u !== '') {
  2598. // let u1 = Number(this.u)
  2599. // this.q = (u1 * Number(7.38)).toFixed(3)
  2600. // this.r = (u1 * Number(1.173)).toFixed(3)
  2601. // this.s = (u1 * Number(0.3098)).toFixed(3)
  2602. // this.t = (u1 * Number(0.258)).toFixed(3)
  2603. // }
  2604. } else {
  2605. if (num == '1') {
  2606. if (this.q === '') {
  2607. this.disabled4 = false
  2608. this.q = ''
  2609. this.r = ''
  2610. this.s = ''
  2611. this.t = ''
  2612. this.u = ''
  2613. } else {
  2614. this.u = (Number(this.q) / Number(7.38)).toFixed(3)
  2615. let u1 = Number(this.u)
  2616. this.r = (u1 * Number(1.173)).toFixed(3)
  2617. this.s = (u1 * Number(0.3098)).toFixed(3)
  2618. this.t = (u1 * Number(0.258)).toFixed(3)
  2619. }
  2620. } else if (num == '2') {
  2621. if (this.r === '') {
  2622. this.disabled4 = false
  2623. this.q = ''
  2624. this.r = ''
  2625. this.s = ''
  2626. this.t = ''
  2627. this.u = ''
  2628. } else {
  2629. this.u = (Number(this.r) / Number(1.173)).toFixed(3)
  2630. let u1 = Number(this.u)
  2631. this.q = (u1 * Number(7.38)).toFixed(3)
  2632. this.s = (u1 * Number(0.3098)).toFixed(3)
  2633. this.t = (u1 * Number(0.258)).toFixed(3)
  2634. }
  2635. } else if (num == '3') {
  2636. if (this.s === '') {
  2637. this.disabled4 = false
  2638. this.q = ''
  2639. this.r = ''
  2640. this.s = ''
  2641. this.t = ''
  2642. this.u = ''
  2643. } else {
  2644. this.u = (Number(this.s) / Number(0.3098)).toFixed(3)
  2645. let u1 = Number(this.u)
  2646. this.q = (u1 * Number(7.38)).toFixed(3)
  2647. this.r = (u1 * Number(1.173)).toFixed(3)
  2648. this.t = (u1 * Number(0.258)).toFixed(3)
  2649. }
  2650. } else if (num == '4') {
  2651. if (this.t === '') {
  2652. this.disabled4 = false
  2653. this.q = ''
  2654. this.r = ''
  2655. this.s = ''
  2656. this.t = ''
  2657. this.u = ''
  2658. } else {
  2659. this.u = (Number(this.t) / Number(0.258)).toFixed(3)
  2660. let u1 = Number(this.u)
  2661. this.q = (u1 * Number(7.38)).toFixed(3)
  2662. this.r = (u1 * Number(1.173)).toFixed(3)
  2663. this.s = (u1 * Number(0.3098)).toFixed(3)
  2664. }
  2665. } else if (num == '5') {
  2666. if (this.u === '') {
  2667. this.disabled4 = false
  2668. this.q = ''
  2669. this.r = ''
  2670. this.s = ''
  2671. this.t = ''
  2672. this.u = ''
  2673. } else {
  2674. let u1 = Number(this.u)
  2675. this.q = (u1 * Number(7.38)).toFixed(3)
  2676. this.r = (u1 * Number(1.173)).toFixed(3)
  2677. this.s = (u1 * Number(0.3098)).toFixed(3)
  2678. this.t = (u1 * Number(0.258)).toFixed(3)
  2679. }
  2680. }
  2681. }
  2682. },
  2683. clearOil() {
  2684. this.disabled4 = false
  2685. this.q = ''
  2686. this.r = ''
  2687. this.s = ''
  2688. this.t = ''
  2689. this.u = ''
  2690. },
  2691. getDiesel(num) {
  2692. // if (this.disabled5 == true) {
  2693. // if (this.$i18n.locale === 'zh') {
  2694. // this.$message.error('请清除数据之后再进行换算')
  2695. // } else {
  2696. // this.$message.error('Please clear the data before conversion')
  2697. // }
  2698. // return false
  2699. // }
  2700. // this.disabled5 = true
  2701. if (num == 0) {
  2702. // if (this.v !== '') {
  2703. // this.y = (Number(this.v) / Number(1.173)).toFixed(3)
  2704. // let u1 = Number(this.y)
  2705. // this.w = (u1 * Number(0.3098)).toFixed(3)
  2706. // this.x = (u1 * Number(0.258)).toFixed(3)
  2707. // } else if (this.w !== '') {
  2708. // this.y = (Number(this.w) / Number(0.3098)).toFixed(3)
  2709. // let u1 = Number(this.y)
  2710. // this.v = (u1 * Number(1.173)).toFixed(3)
  2711. // this.x = (u1 * Number(0.258)).toFixed(3)
  2712. // } else if (this.x !== '') {
  2713. // this.y = (Number(this.x) / Number(0.258)).toFixed(3)
  2714. // let u1 = Number(this.y)
  2715. // this.v = (u1 * Number(1.173)).toFixed(3)
  2716. // this.w = (u1 * Number(0.3098)).toFixed(3)
  2717. // } else if (this.y !== '') {
  2718. // let u1 = Number(this.y)
  2719. // this.v = (u1 * Number(1.173)).toFixed(3)
  2720. // this.w = (u1 * Number(0.3098)).toFixed(3)
  2721. // this.x = (u1 * Number(0.258)).toFixed(3)
  2722. // }
  2723. } else {
  2724. if (num == '1') {
  2725. if (this.v === '') {
  2726. this.disabled5 = false
  2727. this.v = ''
  2728. this.w = ''
  2729. this.x = ''
  2730. this.y = ''
  2731. } else {
  2732. this.y = (Number(this.v) / Number(1.173)).toFixed(3)
  2733. let u1 = Number(this.y)
  2734. this.w = (u1 * Number(0.3098)).toFixed(3)
  2735. this.x = (u1 * Number(0.258)).toFixed(3)
  2736. }
  2737. } else if (num == '2') {
  2738. if (this.w === '') {
  2739. this.disabled5 = false
  2740. this.v = ''
  2741. this.w = ''
  2742. this.x = ''
  2743. this.y = ''
  2744. } else {
  2745. this.y = (Number(this.w) / Number(0.3098)).toFixed(3)
  2746. let u1 = Number(this.y)
  2747. this.v = (u1 * Number(1.173)).toFixed(3)
  2748. this.x = (u1 * Number(0.258)).toFixed(3)
  2749. }
  2750. } else if (num == '3') {
  2751. if (this.x === '') {
  2752. this.disabled5 = false
  2753. this.v = ''
  2754. this.w = ''
  2755. this.x = ''
  2756. this.y = ''
  2757. } else {
  2758. this.y = (Number(this.x) / Number(0.258)).toFixed(3)
  2759. let u1 = Number(this.y)
  2760. this.v = (u1 * Number(1.173)).toFixed(3)
  2761. this.w = (u1 * Number(0.3098)).toFixed(3)
  2762. }
  2763. } else if (num == '4') {
  2764. if (this.y === '') {
  2765. this.disabled5 = false
  2766. this.v = ''
  2767. this.w = ''
  2768. this.x = ''
  2769. this.y = ''
  2770. } else {
  2771. let u1 = Number(this.y)
  2772. this.v = (u1 * Number(1.173)).toFixed(3)
  2773. this.w = (u1 * Number(0.3098)).toFixed(3)
  2774. this.x = (u1 * Number(0.258)).toFixed(3)
  2775. }
  2776. }
  2777. }
  2778. },
  2779. clearDiesel() {
  2780. this.disabled5 = false
  2781. this.v = ''
  2782. this.w = ''
  2783. this.x = ''
  2784. this.y = ''
  2785. },
  2786. getGasoline(num) {
  2787. // if (this.disabled6 == true) {
  2788. // if (this.$i18n.locale === 'zh') {
  2789. // this.$message.error('请清除数据之后再进行换算')
  2790. // } else {
  2791. // this.$message.error('Please clear the data before conversion')
  2792. // }
  2793. // return false
  2794. // }
  2795. // this.disabled6 = true
  2796. if (num == 0) {
  2797. // if (this.a1 !== '') {
  2798. // this.d1 = (Number(this.a1) / Number(1.173)).toFixed(3)
  2799. // let u1 = Number(this.d1)
  2800. // this.b1 = (u1 * Number(0.3098)).toFixed(3)
  2801. // this.c1 = (u1 * Number(0.258)).toFixed(3)
  2802. // } else if (this.b1 !== '') {
  2803. // this.d1 = (Number(this.b1) / Number(0.3098)).toFixed(3)
  2804. // let u1 = Number(this.d1)
  2805. // this.a1 = (u1 * Number(1.173)).toFixed(3)
  2806. // this.c1 = (u1 * Number(0.258)).toFixed(3)
  2807. // } else if (this.c1 !== '') {
  2808. // this.d1 = (Number(this.c1) / Number(0.258)).toFixed(3)
  2809. // let u1 = Number(this.d1)
  2810. // this.a1 = (u1 * Number(1.173)).toFixed(3)
  2811. // this.b1 = (u1 * Number(0.3098)).toFixed(3)
  2812. // } else if (this.d1 !== '') {
  2813. // let u1 = Number(this.d1)
  2814. // this.a1 = (u1 * Number(1.173)).toFixed(3)
  2815. // this.b1 = (u1 * Number(0.3098)).toFixed(3)
  2816. // this.c1 = (u1 * Number(0.258)).toFixed(3)
  2817. // }
  2818. } else {
  2819. if (num == '1') {
  2820. if (this.a1 === '') {
  2821. this.disabled6 = false
  2822. this.a1 = ''
  2823. this.b1 = ''
  2824. this.c1 = ''
  2825. this.d1 = ''
  2826. } else {
  2827. this.d1 = (Number(this.a1) / Number(1.173)).toFixed(3)
  2828. let u1 = Number(this.d1)
  2829. this.b1 = (u1 * Number(0.3098)).toFixed(3)
  2830. this.c1 = (u1 * Number(0.258)).toFixed(3)
  2831. }
  2832. } else if (num == '2') {
  2833. if (this.b1 === '') {
  2834. this.disabled6 = false
  2835. this.a1 = ''
  2836. this.b1 = ''
  2837. this.c1 = ''
  2838. this.d1 = ''
  2839. } else {
  2840. this.d1 = (Number(this.b1) / Number(0.3098)).toFixed(3)
  2841. let u1 = Number(this.d1)
  2842. this.a1 = (u1 * Number(1.173)).toFixed(3)
  2843. this.c1 = (u1 * Number(0.258)).toFixed(3)
  2844. }
  2845. } else if (num == '3') {
  2846. if (this.c1 === '') {
  2847. this.disabled6 = false
  2848. this.a1 = ''
  2849. this.b1 = ''
  2850. this.c1 = ''
  2851. this.d1 = ''
  2852. } else {
  2853. this.d1 = (Number(this.c1) / Number(0.258)).toFixed(3)
  2854. let u1 = Number(this.d1)
  2855. this.a1 = (u1 * Number(1.173)).toFixed(3)
  2856. this.b1 = (u1 * Number(0.3098)).toFixed(3)
  2857. }
  2858. } else if (num == '4') {
  2859. if (this.d1 === '') {
  2860. this.disabled6 = false
  2861. this.a1 = ''
  2862. this.b1 = ''
  2863. this.c1 = ''
  2864. this.d1 = ''
  2865. } else {
  2866. let u1 = Number(this.d1)
  2867. this.a1 = (u1 * Number(1.173)).toFixed(3)
  2868. this.b1 = (u1 * Number(0.3098)).toFixed(3)
  2869. this.c1 = (u1 * Number(0.258)).toFixed(3)
  2870. }
  2871. }
  2872. }
  2873. },
  2874. clearGasoline() {
  2875. this.disabled6 = false
  2876. this.a1 = ''
  2877. this.b1 = ''
  2878. this.c1 = ''
  2879. this.d1 = ''
  2880. },
  2881. getNatural(num) {
  2882. // if (this.disabled7 == true) {
  2883. // if (this.$i18n.locale === 'zh') {
  2884. // this.$message.error('请清除数据之后再进行换算')
  2885. // } else {
  2886. // this.$message.error('Please clear the data before conversion')
  2887. // }
  2888. // return false
  2889. // }
  2890. // this.disabled7 = true
  2891. if (num == 0) {
  2892. // if (this.e1 !== '') {
  2893. // let e1 = Number(this.e1)
  2894. // this.f1 = (e1 * Number(35.31)).toFixed(3)
  2895. // } else if (this.f1 !== '') {
  2896. // this.e1 = (Number(this.f1) / Number(35.31)).toFixed(3)
  2897. // }
  2898. } else {
  2899. if (num == '1') {
  2900. if (this.e1 === '') {
  2901. this.disabled7 = false
  2902. this.e1 = ''
  2903. this.f1 = ''
  2904. } else {
  2905. let e1 = Number(this.e1)
  2906. this.f1 = (e1 * Number(35.31)).toFixed(3)
  2907. }
  2908. } else if (num == '2') {
  2909. if (this.f1 === '') {
  2910. this.disabled7 = false
  2911. this.e1 = ''
  2912. this.f1 = ''
  2913. } else {
  2914. this.e1 = (Number(this.f1) / Number(35.31)).toFixed(3)
  2915. }
  2916. }
  2917. }
  2918. },
  2919. clearNatural() {
  2920. this.disabled7 = false
  2921. this.e1 = ''
  2922. this.f1 = ''
  2923. },
  2924. getPower(num) {
  2925. // if (this.disabled8 == true) {
  2926. // if (this.$i18n.locale === 'zh') {
  2927. // this.$message.error('请清除数据之后再进行换算')
  2928. // } else {
  2929. // this.$message.error('Please clear the data before conversion')
  2930. // }
  2931. // return false
  2932. // }
  2933. // this.disabled8 = true
  2934. if (num == 0) {
  2935. // if (this.g1 !== '') {
  2936. // this.h1 = (Number(this.g1) * Number(1000)).toFixed(3)
  2937. // } else if (this.h1 !== '') {
  2938. // this.g1 = (Number(this.h1) / Number(1000)).toFixed(3)
  2939. // }
  2940. } else {
  2941. if (num == '1') {
  2942. if (this.g1 === '') {
  2943. this.disabled8 = false
  2944. this.g1 = ''
  2945. this.h1 = ''
  2946. } else {
  2947. this.h1 = (Number(this.g1) * Number(1000)).toFixed(3)
  2948. }
  2949. } else if (num == '2') {
  2950. if (this.h1 === '') {
  2951. this.disabled8 = false
  2952. this.g1 = ''
  2953. this.h1 = ''
  2954. } else {
  2955. this.g1 = (Number(this.h1) / Number(1000)).toFixed(3)
  2956. }
  2957. }
  2958. }
  2959. },
  2960. clearPower() {
  2961. this.disabled8 = false
  2962. this.g1 = ''
  2963. this.h1 = ''
  2964. },
  2965. getHydrogen(num) {
  2966. // if (this.disabled9 == true) {
  2967. // if (this.$i18n.locale === 'zh') {
  2968. // this.$message.error('请清除数据之后再进行换算')
  2969. // } else {
  2970. // this.$message.error('Please clear the data before conversion')
  2971. // }
  2972. // return false
  2973. // }
  2974. // this.disabled9 = true
  2975. if (num == 0) {
  2976. // if (this.a2 !== '') {
  2977. // this.c2 = (Number(this.a2) / Number(11124)).toFixed(3)
  2978. // let c2 = Number(this.c2)
  2979. // this.b2 = (c2 * Number(392771)).toFixed(3)
  2980. // this.d2 = (c2 * Number(2.205)).toFixed(3)
  2981. // this.e2 = (c2 * Number(0.9843)).toFixed(3)
  2982. // this.f2 = (c2 * Number(1.102)).toFixed(3)
  2983. // } else if (this.b2 !== '') {
  2984. // this.c2 = (Number(this.b2) / Number(392771)).toFixed(3)
  2985. // let c2 = Number(this.c2)
  2986. // this.a2 = (c2 * Number(11124)).toFixed(3)
  2987. // this.d2 = (c2 * Number(2.205)).toFixed(3)
  2988. // this.e2 = (c2 * Number(0.9843)).toFixed(3)
  2989. // this.f2 = (c2 * Number(1.102)).toFixed(3)
  2990. // } else if (this.c2 !== '') {
  2991. // let c2 = Number(this.c2)
  2992. // this.a2 = (c2 * Number(11124)).toFixed(3)
  2993. // this.b2 = (c2 * Number(392771)).toFixed(3)
  2994. // this.d2 = (c2 * Number(2.205)).toFixed(3)
  2995. // this.e2 = (c2 * Number(0.9843)).toFixed(3)
  2996. // this.f2 = (c2 * Number(1.102)).toFixed(3)
  2997. // } else if (this.d2 !== '') {
  2998. // this.c2 = (Number(this.d2) / Number(2.205)).toFixed(3)
  2999. // let c2 = Number(this.c2)
  3000. // this.a2 = (c2 * Number(11124)).toFixed(3)
  3001. // this.b2 = (c2 * Number(392771)).toFixed(3)
  3002. // this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3003. // this.f2 = (c2 * Number(1.102)).toFixed(3)
  3004. // } else if (this.e2 !== '') {
  3005. // this.c2 = (Number(this.e2) / Number(0.9843)).toFixed(3)
  3006. // let c2 = Number(this.c2)
  3007. // this.a2 = (c2 * Number(11124)).toFixed(3)
  3008. // this.b2 = (c2 * Number(392771)).toFixed(3)
  3009. // this.d2 = (c2 * Number(2.205)).toFixed(3)
  3010. // this.f2 = (c2 * Number(1.102)).toFixed(3)
  3011. // } else if (this.f2 !== '') {
  3012. // this.c2 = (Number(this.f2) / Number(1.102)).toFixed(3)
  3013. // let c2 = Number(this.c2)
  3014. // this.a2 = (c2 * Number(11124)).toFixed(3)
  3015. // this.b2 = (c2 * Number(392771)).toFixed(3)
  3016. // this.d2 = (c2 * Number(2.205)).toFixed(3)
  3017. // this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3018. // }
  3019. } else {
  3020. if (num == '1') {
  3021. if (this.a2 === '') {
  3022. this.disabled9 = false
  3023. this.a2 = ''
  3024. this.b2 = ''
  3025. this.c2 = ''
  3026. this.d2 = ''
  3027. this.e2 = ''
  3028. this.f2 = ''
  3029. } else {
  3030. this.c2 = (Number(this.a2) / Number(11124)).toFixed(3)
  3031. let c2 = Number(this.c2)
  3032. this.b2 = (c2 * Number(392771)).toFixed(3)
  3033. this.d2 = (c2 * Number(2.205)).toFixed(3)
  3034. this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3035. this.f2 = (c2 * Number(1.102)).toFixed(3)
  3036. }
  3037. } else if (num == '2') {
  3038. if (this.b2 === '') {
  3039. this.disabled9 = false
  3040. this.a2 = ''
  3041. this.b2 = ''
  3042. this.c2 = ''
  3043. this.d2 = ''
  3044. this.e2 = ''
  3045. this.f2 = ''
  3046. } else {
  3047. this.c2 = (Number(this.b2) / Number(392771)).toFixed(3)
  3048. let c2 = Number(this.c2)
  3049. this.a2 = (c2 * Number(11124)).toFixed(3)
  3050. this.d2 = (c2 * Number(2.205)).toFixed(3)
  3051. this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3052. this.f2 = (c2 * Number(1.102)).toFixed(3)
  3053. }
  3054. } else if (num == '3') {
  3055. if (this.c2 === '') {
  3056. this.disabled9 = false
  3057. this.a2 = ''
  3058. this.b2 = ''
  3059. this.c2 = ''
  3060. this.d2 = ''
  3061. this.e2 = ''
  3062. this.f2 = ''
  3063. } else {
  3064. let c2 = Number(this.c2)
  3065. this.a2 = (c2 * Number(11124)).toFixed(3)
  3066. this.b2 = (c2 * Number(392771)).toFixed(3)
  3067. this.d2 = (c2 * Number(2.205)).toFixed(3)
  3068. this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3069. this.f2 = (c2 * Number(1.102)).toFixed(3)
  3070. }
  3071. } else if (num == '4') {
  3072. if (this.d2 === '') {
  3073. this.disabled9 = false
  3074. this.a2 = ''
  3075. this.b2 = ''
  3076. this.c2 = ''
  3077. this.d2 = ''
  3078. this.e2 = ''
  3079. this.f2 = ''
  3080. } else {
  3081. this.c2 = (Number(this.d2) / Number(2.205)).toFixed(3)
  3082. let c2 = Number(this.c2)
  3083. this.a2 = (c2 * Number(11124)).toFixed(3)
  3084. this.b2 = (c2 * Number(392771)).toFixed(3)
  3085. this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3086. this.f2 = (c2 * Number(1.102)).toFixed(3)
  3087. }
  3088. } else if (num == '5') {
  3089. if (this.e2 === '') {
  3090. this.disabled9 = false
  3091. this.a2 = ''
  3092. this.b2 = ''
  3093. this.c2 = ''
  3094. this.d2 = ''
  3095. this.e2 = ''
  3096. this.f2 = ''
  3097. } else {
  3098. this.c2 = (Number(this.e2) / Number(0.9843)).toFixed(3)
  3099. let c2 = Number(this.c2)
  3100. this.a2 = (c2 * Number(11124)).toFixed(3)
  3101. this.b2 = (c2 * Number(392771)).toFixed(3)
  3102. this.d2 = (c2 * Number(2.205)).toFixed(3)
  3103. this.f2 = (c2 * Number(1.102)).toFixed(3)
  3104. }
  3105. } else if (num == '6') {
  3106. if (this.f2 === '') {
  3107. this.disabled9 = false
  3108. this.a2 = ''
  3109. this.b2 = ''
  3110. this.c2 = ''
  3111. this.d2 = ''
  3112. this.e2 = ''
  3113. this.f2 = ''
  3114. } else {
  3115. this.c2 = (Number(this.f2) / Number(1.102)).toFixed(3)
  3116. let c2 = Number(this.c2)
  3117. this.a2 = (c2 * Number(11124)).toFixed(3)
  3118. this.b2 = (c2 * Number(392771)).toFixed(3)
  3119. this.d2 = (c2 * Number(2.205)).toFixed(3)
  3120. this.e2 = (c2 * Number(0.9843)).toFixed(3)
  3121. }
  3122. }
  3123. }
  3124. },
  3125. clearHydrogen() {
  3126. this.disabled9 = false
  3127. this.a2 = ''
  3128. this.b2 = ''
  3129. this.c2 = ''
  3130. this.d2 = ''
  3131. this.e2 = ''
  3132. this.f2 = ''
  3133. },
  3134. },
  3135. }
  3136. </script>
  3137. <style lang="less" scoped>
  3138. ul > li {
  3139. height: 41px;
  3140. line-height: 41px;
  3141. border-top: 1px solid #dbdbdb;
  3142. border-right: 1px solid #dbdbdb;
  3143. display: flex;
  3144. }
  3145. ul > li:last-child {
  3146. border-bottom: 1px solid #dbdbdb;
  3147. }
  3148. .none-title > li {
  3149. border: none !important;
  3150. height: 41px;
  3151. line-height: 41px;
  3152. }
  3153. .title-top > span {
  3154. width: 18%;
  3155. height: 55px;
  3156. line-height: 55px;
  3157. text-align: center;
  3158. border-left: 1px solid #dbdbdb;
  3159. border-top: 1px solid #dbdbdb;
  3160. }
  3161. .title-top > span:last-child {
  3162. width: 28%;
  3163. height: 55px;
  3164. line-height: 55px;
  3165. text-align: center;
  3166. border-left: 1px solid #dbdbdb;
  3167. border-top: 1px solid #dbdbdb;
  3168. }
  3169. .text-title > li {
  3170. padding-left: 10px;
  3171. border-left: 1px solid #dbdbdb;
  3172. }
  3173. ul > li /deep/.el-input__inner {
  3174. width: 100% !important;
  3175. height: 100% !important;
  3176. border: none;
  3177. border-radius: 0;
  3178. background-color: rgba(255, 255, 255, 0);
  3179. color: #000;
  3180. }
  3181. /deep/ .el-input.is-disabled .el-input__inner {
  3182. background-color: #fff;
  3183. border-color: #fff;
  3184. color: #000;
  3185. cursor: not-allowed;
  3186. }
  3187. .ui-bgcText > li > span {
  3188. width: 18%;
  3189. height: 41px;
  3190. line-height: 41px;
  3191. text-align: center;
  3192. // padding-left: 4px;
  3193. border-left: 1px solid #dbdbdb;
  3194. overflow: hidden;
  3195. white-space: nowrap;
  3196. text-overflow: ellipsis;
  3197. }
  3198. .ui-bgcText > li > span:last-child {
  3199. width: 28%;
  3200. height: 41px;
  3201. line-height: 41px;
  3202. text-align: center;
  3203. border-left: 1px solid #dbdbdb;
  3204. overflow: hidden;
  3205. white-space: nowrap;
  3206. text-overflow: ellipsis;
  3207. }
  3208. .information {
  3209. display: inline-block;
  3210. height: 100%;
  3211. text-align: center;
  3212. color: #343434;
  3213. box-sizing: border-box;
  3214. vertical-align: middle;
  3215. font-weight: 600;
  3216. padding: 0 20px;
  3217. }
  3218. .information1 {
  3219. display: inline-block;
  3220. height: 100%;
  3221. text-align: center;
  3222. color: #b7b7b7;
  3223. box-sizing: border-box;
  3224. vertical-align: middle;
  3225. font-weight: 600;
  3226. padding: 0 20px;
  3227. cursor: pointer;
  3228. }
  3229. .information1:hover {
  3230. color: #2c5589;
  3231. cursor: pointer;
  3232. }
  3233. .information2 {
  3234. display: inline-block;
  3235. height: 100%;
  3236. text-align: center;
  3237. color: #fff;
  3238. background-color: #105dbc;
  3239. box-sizing: border-box;
  3240. vertical-align: middle;
  3241. border-radius: 10px;
  3242. font-weight: 600;
  3243. padding: 0 20px;
  3244. cursor: pointer;
  3245. }
  3246. .focusClass1 {
  3247. border: none;
  3248. }
  3249. .focusClass2 {
  3250. border: 2px solid #c7d1dd;
  3251. background-color: #f1f1f1;
  3252. }
  3253. /deep/.user-btn {
  3254. margin-top: 90%;
  3255. width: 100%;
  3256. text-align: center !important;
  3257. font-size: 16px;
  3258. font-weight: 700;
  3259. background-color: #105dbc;
  3260. color: #fff;
  3261. border-radius: 50px;
  3262. border-bottom: 1px;
  3263. border-right: 1px;
  3264. box-shadow: 5px 5px 5px rgb(63, 62, 62);
  3265. }
  3266. /deep/.user-btn-deft {
  3267. width: 100%;
  3268. text-align: center !important;
  3269. margin-top: 40%;
  3270. font-size: 16px;
  3271. font-weight: 700;
  3272. background-color: #105dbc;
  3273. color: #fff;
  3274. border-radius: 50px;
  3275. border-bottom: 1px;
  3276. border-right: 1px;
  3277. box-shadow: 5px 5px 5px rgb(63, 62, 62);
  3278. }
  3279. /deep/.user-btn-clear {
  3280. width: 100%;
  3281. text-align: center !important;
  3282. margin-top: 5%;
  3283. font-size: 16px;
  3284. font-weight: 700;
  3285. border-bottom: 1px;
  3286. border-right: 1px;
  3287. box-shadow: 5px 5px 5px rgb(63, 62, 62);
  3288. background: linear-gradient(90deg, #3f9eff, #1674d5);
  3289. color: #fff;
  3290. border-radius: 50px;
  3291. }
  3292. /deep/ input::-webkit-outer-spin-button,
  3293. /deep/ input::-webkit-inner-spin-button {
  3294. -webkit-appearance: none !important;
  3295. }
  3296. /deep/ input[type='number'] {
  3297. -moz-appearance: textfield !important;
  3298. }
  3299. .user-title1 {
  3300. width: 100%;
  3301. display: flex;
  3302. height: 40px;
  3303. line-height: 40px;
  3304. margin-top: 12px;
  3305. margin-bottom: 12px;
  3306. }
  3307. .user-title2 {
  3308. width: 100%;
  3309. display: flex;
  3310. flex-wrap: wrap;
  3311. height: 40px;
  3312. line-height: 40px;
  3313. margin-top: 14px;
  3314. margin-bottom: 52px;
  3315. }
  3316. </style>