<template>
	<div style="width: 1200px; margin: auto">
		<div :class="$i18n.locale === 'zh' ? 'user-title1' : 'user-title2'">
			<div class="information">
				{{ $i18n.locale === 'zh' ? '快速选择：' : 'Quick selection' }}
			</div>
			<div
				@click="getInfo('0')"
				:class="informationsClass == 0 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '全部' : 'Whole' }}
			</div>
			<div
				@click="getInfo('1')"
				:class="informationsClass == 1 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '原煤' : 'Raw coal' }}
			</div>
			<div
				@click="getInfo('2')"
				:class="informationsClass == 2 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '洗精煤' : 'Washed coal' }}
			</div>
			<div
				@click="getInfo('3')"
				:class="informationsClass == 3 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '焦炭' : 'Coke' }}
			</div>
			<div
				@click="getInfo('4')"
				:class="informationsClass == 4 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '原油' : 'Crude oil' }}
			</div>
			<div
				@click="getInfo('5')"
				:class="informationsClass == 5 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '柴油' : 'Diesel oil' }}
			</div>
			<div
				@click="getInfo('6')"
				:class="informationsClass == 6 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '汽油/煤油' : 'Gasoline/Kerosene' }}
			</div>
			<div
				@click="getInfo('7')"
				:class="informationsClass == 7 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '天然气' : 'Natural gas' }}
			</div>
			<div
				@click="getInfo('8')"
				:class="informationsClass == 8 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '液化石油气' : 'Liquefied petroleum gas' }}
			</div>
			<div
				@click="getInfo('9')"
				:class="informationsClass == 9 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '氢' : 'Hydrogen' }}
			</div>
			<div
				@click="getInfo('10')"
				:class="informationsClass == 10 ? 'information2' : 'information1'"
			>
				{{ $i18n.locale === 'zh' ? '电力' : 'Power' }}
			</div>
		</div>
		<div v-if="userRaw" style="width: 98%; margin-left: 1% margin-bottom: 2%">
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-8.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '原煤' : 'Raw Coal' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="a"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('1')"
								@blur="lostBlur"
								@input="getNum('1')"
								:class="focusClass == 1 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="b"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('2')"
								@blur="lostBlur"
								@input="getNum('2')"
								:class="focusClass == 2 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="c"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('3')"
								@blur="lostBlur"
								@input="getNum('3')"
								:class="focusClass == 3 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="d"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('4')"
								@blur="lostBlur"
								@input="getNum('4')"
								:class="focusClass == 4 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getNum('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearNum">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.a * Number(0.714)).toFixed(3)"
								>{{ (this.a * Number(0.714)).toFixed(3) }}
							</span>
							<span :title="(this.a * Number(0.5)).toFixed(3)"
								>{{ (this.a * Number(0.5)).toFixed(3) }}
							</span>
							<span :title="(this.a * Number(20.936)).toFixed(3)">{{
								(this.a * Number(20.936)).toFixed(3)
							}}</span>
							<span :title="(this.a * Number(19.843)).toFixed(3)">{{
								(this.a * Number(19.843)).toFixed(3)
							}}</span>
							<span :title="(this.a * Number(5.004)).toFixed(3)"
								>{{ (this.a * Number(5.004)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.b * Number(0.324)).toFixed(3)"
								>{{ (this.b * Number(0.324)).toFixed(3) }}
							</span>
							<span :title="(this.b * Number(0.227)).toFixed(3)"
								>{{ (this.b * Number(0.227)).toFixed(3) }}
							</span>
							<span :title="(this.b * Number(9.495)).toFixed(3)">{{
								(this.b * Number(9.495)).toFixed(3)
							}}</span>
							<span :title="(this.b * Number(8.999)).toFixed(3)">{{
								(this.b * Number(8.999)).toFixed(3)
							}}</span>
							<span :title="(this.b * Number(2.269)).toFixed(3)"
								>{{ (this.b * Number(2.269)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.c * Number(0.726)).toFixed(3)"
								>{{ (this.c * Number(0.726)).toFixed(3) }}
							</span>
							<span :title="(this.c * Number(0.508)).toFixed(3)"
								>{{ (this.c * Number(0.508)).toFixed(3) }}
							</span>
							<span :title="(this.c * Number(21.27)).toFixed(3)">{{
								(this.c * Number(21.27)).toFixed(3)
							}}</span>
							<span :title="(this.c * Number(20.16)).toFixed(3)">{{
								(this.c * Number(20.16)).toFixed(3)
							}}</span>
							<span :title="(this.c * Number(5.083)).toFixed(3)"
								>{{ (this.c * Number(5.083)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.d * Number(0.648)).toFixed(3)"
								>{{ (this.d * Number(0.648)).toFixed(3) }}
							</span>
							<span :title="(this.d * Number(0.454)).toFixed(3)"
								>{{ (this.d * Number(0.454)).toFixed(3) }}
							</span>
							<span :title="(this.d * Number(18.998)).toFixed(3)">{{
								(this.d * Number(18.998)).toFixed(3)
							}}</span>
							<span :title="(this.d * Number(18.007)).toFixed(3)">{{
								(this.d * Number(18.007)).toFixed(3)
							}}</span>
							<span :title="(this.d * Number(4.541)).toFixed(3)"
								>{{ (this.d * Number(4.541)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div
			v-if="userWashed"
			style="width: 98%; margin-left: 1% margin-bottom: 2%"
		>
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-8.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '洗精煤' : 'Washed coal' }}
				</div>
			</div>

			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="e"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('5')"
								@blur="lostBlur"
								@input="getWashed('1')"
								:class="focusClass == 5 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="f"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('6')"
								@blur="lostBlur"
								@input="getWashed('2')"
								:class="focusClass == 6 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="g"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('7')"
								@blur="lostBlur"
								@input="getWashed('3')"
								:class="focusClass == 7 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="h"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('8')"
								@blur="lostBlur"
								@input="getWashed('4')"
								:class="focusClass == 8 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getWashed('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearWashed">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.e * Number(0.9)).toFixed(3)"
								>{{ (this.e * Number(0.9)).toFixed(3) }}
							</span>
							<span :title="(this.e * Number(0.63)).toFixed(3)"
								>{{ (this.e * Number(0.63)).toFixed(3) }}
							</span>
							<span :title="(this.e * Number(26.379)).toFixed(3)">{{
								(this.e * Number(26.379)).toFixed(3)
							}}</span>
							<span :title="(this.e * Number(25.002)).toFixed(3)">{{
								(this.e * Number(25.002)).toFixed(3)
							}}</span>
							<span :title="(this.e * Number(6.305)).toFixed(3)"
								>{{ (this.e * Number(6.305)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.f * Number(0.408)).toFixed(3)"
								>{{ (this.f * Number(0.408)).toFixed(3) }}
							</span>
							<span :title="(this.f * Number(0.286)).toFixed(3)"
								>{{ (this.f * Number(0.286)).toFixed(3) }}
							</span>
							<span :title="(this.f * Number(11.963)).toFixed(3)">{{
								(this.f * Number(11.963)).toFixed(3)
							}}</span>
							<span :title="(this.f * Number(11.339)).toFixed(3)">{{
								(this.f * Number(11.339)).toFixed(3)
							}}</span>
							<span :title="(this.f * Number(2.859)).toFixed(3)"
								>{{ (this.f * Number(2.859)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.g * Number(0.914)).toFixed(3)"
								>{{ (this.g * Number(0.914)).toFixed(3) }}
							</span>
							<span :title="(this.g * Number(0.64)).toFixed(3)"
								>{{ (this.g * Number(0.64)).toFixed(3) }}
							</span>
							<span :title="(this.g * Number(26.8)).toFixed(3)">{{
								(this.g * Number(26.8)).toFixed(3)
							}}</span>
							<span :title="(this.g * Number(25.401)).toFixed(3)">{{
								(this.g * Number(25.401)).toFixed(3)
							}}</span>
							<span :title="(this.g * Number(6.405)).toFixed(3)"
								>{{ (this.g * Number(6.405)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.h * Number(0.817)).toFixed(3)"
								>{{ (this.h * Number(0.817)).toFixed(3) }}
							</span>
							<span :title="(this.h * Number(0.572)).toFixed(3)"
								>{{ (this.h * Number(0.572)).toFixed(3) }}
							</span>
							<span :title="(this.h * Number(23.937)).toFixed(3)">{{
								(this.h * Number(23.937)).toFixed(3)
							}}</span>
							<span :title="(this.h * Number(22.688)).toFixed(3)">{{
								(this.h * Number(22.688)).toFixed(3)
							}}</span>
							<span :title="(this.h * Number(5.721)).toFixed(3)"
								>{{ (this.h * Number(5.721)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div v-if="userCoke" style="width: 98%; margin-left: 1% margin-bottom: 2%">
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-8.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '焦炭' : 'Coke' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="i"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('9')"
								@blur="lostBlur"
								@input="getCoke('1')"
								:class="focusClass == 9 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="j"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('10')"
								@blur="lostBlur"
								@input="getCoke('2')"
								:class="focusClass == 10 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="k"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('11')"
								@blur="lostBlur"
								@input="getCoke('3')"
								:class="focusClass == 11 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="l"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('12')"
								@blur="lostBlur"
								@input="getCoke('4')"
								:class="focusClass == 12 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getCoke('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearCoke">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.i * Number(0.971)).toFixed(3)"
								>{{ (this.i * Number(0.971)).toFixed(3) }}
							</span>
							<span :title="(this.i * Number(0.68)).toFixed(3)"
								>{{ (this.i * Number(0.68)).toFixed(3) }}
							</span>
							<span :title="(this.i * Number(28.472)).toFixed(3)">{{
								(this.i * Number(28.472)).toFixed(3)
							}}</span>
							<span :title="(this.i * Number(26.985)).toFixed(3)">{{
								(this.i * Number(26.985)).toFixed(3)
							}}</span>
							<span :title="(this.i * Number(6.805)).toFixed(3)"
								>{{ (this.i * Number(6.805)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.j * Number(0.441)).toFixed(3)"
								>{{ (this.j * Number(0.441)).toFixed(3) }}
							</span>
							<span :title="(this.j * Number(0.308)).toFixed(3)"
								>{{ (this.j * Number(0.308)).toFixed(3) }}
							</span>
							<span :title="(this.j * Number(12.912)).toFixed(3)">{{
								(this.j * Number(12.912)).toFixed(3)
							}}</span>
							<span :title="(this.j * Number(12.238)).toFixed(3)">{{
								(this.j * Number(12.238)).toFixed(3)
							}}</span>
							<span :title="(this.j * Number(3.086)).toFixed(3)"
								>{{ (this.j * Number(3.086)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.k * Number(0.987)).toFixed(3)"
								>{{ (this.k * Number(0.987)).toFixed(3) }}
							</span>
							<span :title="(this.k * Number(0.691)).toFixed(3)"
								>{{ (this.k * Number(0.691)).toFixed(3) }}
							</span>
							<span :title="(this.k * Number(28.926)).toFixed(3)">{{
								(this.k * Number(28.926)).toFixed(3)
							}}</span>
							<span :title="(this.k * Number(27.416)).toFixed(3)">{{
								(this.k * Number(27.416)).toFixed(3)
							}}</span>
							<span :title="(this.k * Number(6.913)).toFixed(3)"
								>{{ (this.k * Number(6.913)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.l * Number(0.881)).toFixed(3)"
								>{{ (this.l * Number(0.881)).toFixed(3) }}
							</span>
							<span :title="(this.l * Number(0.617)).toFixed(3)"
								>{{ (this.l * Number(0.617)).toFixed(3) }}
							</span>
							<span :title="(this.l * Number(25.836)).toFixed(3)">{{
								(this.l * Number(25.836)).toFixed(3)
							}}</span>
							<span :title="(this.l * Number(24.488)).toFixed(3)">{{
								(this.l * Number(24.488)).toFixed(3)
							}}</span>
							<span :title="(this.l * Number(6.175)).toFixed(3)"
								>{{ (this.l * Number(6.175)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div v-if="userCrude" style="width: 98%; margin-left: 1% margin-bottom: 2%">
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-5.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '原油' : 'Crude Oil' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '桶(bbl)' : 'bbl' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '千升(KL)' : 'KL' }}</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千美制加仑(kgal.US)' : 'kgal.US' }}
						</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千英制加仑(kgal.UK)' : 'kgal.UK' }}
						</li>
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="q"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('13')"
								@blur="lostBlur"
								@input="getOil('1')"
								:class="focusClass == 13 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="r"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('14')"
								@blur="lostBlur"
								@input="getOil('2')"
								:class="focusClass == 14 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="s"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('15')"
								@blur="lostBlur"
								@input="getOil('3')"
								:class="focusClass == 15 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="t"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('16')"
								@blur="lostBlur"
								@input="getOil('4')"
								:class="focusClass == 16 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="u"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('17')"
								@blur="lostBlur"
								@input="getOil('5')"
								:class="focusClass == 17 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getOil('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearOil">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.q * Number(0.195)).toFixed(3)"
								>{{ (this.q * Number(0.195)).toFixed(3) }}
							</span>
							<span :title="(this.q * Number(0.136)).toFixed(3)"
								>{{ (this.q * Number(0.136)).toFixed(3) }}
							</span>
							<span :title="(this.q * Number(5.712)).toFixed(3)">{{
								(this.q * Number(5.712)).toFixed(3)
							}}</span>
							<span :title="(this.q * Number(5.414)).toFixed(3)">{{
								(this.q * Number(5.414)).toFixed(3)
							}}</span>
							<span :title="(this.q * Number(1.365)).toFixed(3)"
								>{{ (this.q * Number(1.365)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.r * Number(1.219)).toFixed(3)"
								>{{ (this.r * Number(1.219)).toFixed(3) }}
							</span>
							<span :title="(this.r * Number(0.853)).toFixed(3)"
								>{{ (this.r * Number(0.853)).toFixed(3) }}
							</span>
							<span :title="(this.r * Number(35.727)).toFixed(3)">{{
								(this.r * Number(35.727)).toFixed(3)
							}}</span>
							<span :title="(this.r * Number(33.862)).toFixed(3)">{{
								(this.r * Number(33.862)).toFixed(3)
							}}</span>
							<span :title="(this.r * Number(8.539)).toFixed(3)"
								>{{ (this.r * Number(8.539)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.s * Number(4.638)).toFixed(3)"
								>{{ (this.s * Number(4.638)).toFixed(3) }}
							</span>
							<span :title="(this.s * Number(3.247)).toFixed(3)"
								>{{ (this.s * Number(3.247)).toFixed(3) }}
							</span>
							<span :title="(this.s * Number(135.949)).toFixed(3)">{{
								(this.s * Number(135.949)).toFixed(3)
							}}</span>
							<span :title="(this.s * Number(128.852)).toFixed(3)">{{
								(this.s * Number(128.852)).toFixed(3)
							}}</span>
							<span :title="(this.s * Number(32.491)).toFixed(3)"
								>{{ (this.s * Number(32.491)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.t * Number(5.568)).toFixed(3)"
								>{{ (this.t * Number(5.568)).toFixed(3) }}
							</span>
							<span :title="(this.t * Number(3.898)).toFixed(3)"
								>{{ (this.t * Number(3.898)).toFixed(3) }}
							</span>
							<span :title="(this.t * Number(163.204)).toFixed(3)">{{
								(this.t * Number(163.204)).toFixed(3)
							}}</span>
							<span :title="(this.t * Number(154.685)).toFixed(3)">{{
								(this.t * Number(154.685)).toFixed(3)
							}}</span>
							<span :title="(this.t * Number(39.005)).toFixed(3)"
								>{{ (this.t * Number(39.005)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.u * Number(1.429)).toFixed(3)"
								>{{ (this.u * Number(1.429)).toFixed(3) }}
							</span>
							<span :title="(this.u * Number(1.0)).toFixed(3)"
								>{{ (this.u * Number(1.0)).toFixed(3) }}
							</span>
							<span :title="(this.u * Number(41.872)).toFixed(3)">{{
								(this.u * Number(41.872)).toFixed(3)
							}}</span>
							<span :title="(this.u * Number(39.687)).toFixed(3)">{{
								(this.u * Number(39.687)).toFixed(3)
							}}</span>
							<span :title="(this.u * Number(10.007)).toFixed(3)"
								>{{ (this.u * Number(10.007)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div
			v-if="userDiesel"
			style="width: 98%; margin-left: 1% margin-bottom: 2%"
		>
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-5.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '柴油' : 'Diesel oil' }}
				</div>
			</div>

			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '千升(KL)' : 'KL' }}</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千美制加仑(kgal.US)' : 'kgal.US' }}
						</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千英制加仑(kgal.UK)' : 'kgal.UK' }}
						</li>
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="v"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('18')"
								@blur="lostBlur"
								@input="getDiesel('1')"
								:class="focusClass == 18 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="w"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('19')"
								@blur="lostBlur"
								@input="getDiesel('2')"
								:class="focusClass == 19 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="x"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('20')"
								@blur="lostBlur"
								@input="getDiesel('3')"
								:class="focusClass == 20 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="y"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('21')"
								@blur="lostBlur"
								@input="getDiesel('4')"
								:class="focusClass == 21 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getDiesel('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearDiesel">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.v * Number(1.243)).toFixed(3)"
								>{{ (this.v * Number(1.243)).toFixed(3) }}
							</span>
							<span :title="(this.v * Number(0.87)).toFixed(3)"
								>{{ (this.v * Number(0.87)).toFixed(3) }}
							</span>
							<span :title="(this.v * Number(36.44)).toFixed(3)">{{
								(this.v * Number(36.44)).toFixed(3)
							}}</span>
							<span :title="(this.v * Number(34.538)).toFixed(3)">{{
								(this.v * Number(34.538)).toFixed(3)
							}}</span>
							<span :title="(this.v * Number(8.709)).toFixed(3)"
								>{{ (this.v * Number(8.709)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.w * Number(4.731)).toFixed(3)"
								>{{ (this.w * Number(4.731)).toFixed(3) }}
							</span>
							<span :title="(this.w * Number(3.312)).toFixed(3)"
								>{{ (this.w * Number(3.312)).toFixed(3) }}
							</span>
							<span :title="(this.w * Number(138.661)).toFixed(3)">{{
								(this.w * Number(138.661)).toFixed(3)
							}}</span>
							<span :title="(this.w * Number(131.423)).toFixed(3)">{{
								(this.w * Number(131.423)).toFixed(3)
							}}</span>
							<span :title="(this.w * Number(33.14)).toFixed(3)"
								>{{ (this.w * Number(33.14)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.x * Number(5.679)).toFixed(3)"
								>{{ (this.x * Number(5.679)).toFixed(3) }}
							</span>
							<span :title="(this.x * Number(3.975)).toFixed(3)"
								>{{ (this.x * Number(3.975)).toFixed(3) }}
							</span>
							<span :title="(this.x * Number(166.46)).toFixed(3)">{{
								(this.x * Number(166.46)).toFixed(3)
							}}</span>
							<span :title="(this.x * Number(157.771)).toFixed(3)">{{
								(this.x * Number(157.771)).toFixed(3)
							}}</span>
							<span :title="(this.x * Number(39.783)).toFixed(3)"
								>{{ (this.x * Number(39.783)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.y * Number(1.457)).toFixed(3)"
								>{{ (this.y * Number(1.457)).toFixed(3) }}
							</span>
							<span :title="(this.y * Number(1.02)).toFixed(3)"
								>{{ (this.y * Number(1.02)).toFixed(3) }}
							</span>
							<span :title="(this.y * Number(42.708)).toFixed(3)">{{
								(this.y * Number(42.708)).toFixed(3)
							}}</span>
							<span :title="(this.y * Number(40.478)).toFixed(3)">{{
								(this.y * Number(40.478)).toFixed(3)
							}}</span>
							<span :title="(this.y * Number(10.207)).toFixed(3)"
								>{{ (this.y * Number(10.207)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div
			v-if="userGasoline"
			style="width: 98%; margin-left: 1% margin-bottom: 2%"
		>
			<div style="font-size: 22px; font-weight: 700">
				<div style="display: flex; margin-top: 20px">
					<div style="width: 40px; height: 40px">
						<img
							src="@/assets/userUntil-5.png"
							style="width: 100%; height: 100%"
						/>
					</div>
					<div
						style="
							font-size: 22px;
							font-weight: 700;
							height: 40px;
							line-height: 40px;
							margin-left: 10px;
						"
					>
						{{ $i18n.locale === 'zh' ? '汽油/煤油' : 'Gasoline/Kerosene' }}
					</div>
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '千升(KL)' : 'KL' }}</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千美制加仑(kgal.US)' : 'kgal.US' }}
						</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千英制加仑(kgal.UK)' : 'kgal.UK' }}
						</li>
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="a1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('22')"
								@blur="lostBlur"
								@input="getGasoline('1')"
								:class="focusClass == 22 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="b1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('23')"
								@blur="lostBlur"
								@input="getGasoline('2')"
								:class="focusClass == 23 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="c1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('24')"
								@blur="lostBlur"
								@input="getGasoline('3')"
								:class="focusClass == 24 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="d1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('25')"
								@blur="lostBlur"
								@input="getGasoline('4')"
								:class="focusClass == 25 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getGasoline('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearGasoline">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.a1 * Number(1.081)).toFixed(3)"
								>{{ (this.a1 * Number(1.081)).toFixed(3) }}
							</span>
							<span :title="(this.a1 * Number(0.757)).toFixed(3)"
								>{{ (this.a1 * Number(0.757)).toFixed(3) }}
							</span>
							<span :title="(this.a1 * Number(31.688)).toFixed(3)">{{
								(this.a1 * Number(31.688)).toFixed(3)
							}}</span>
							<span :title="(this.a1 * Number(30.033)).toFixed(3)">{{
								(this.a1 * Number(30.033)).toFixed(3)
							}}</span>
							<span :title="(this.a1 * Number(7.573)).toFixed(3)"
								>{{ (this.a1 * Number(7.573)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.b1 * Number(4.122)).toFixed(3)"
								>{{ (this.b1 * Number(4.122)).toFixed(3) }}
							</span>
							<span :title="(this.b1 * Number(2.885)).toFixed(3)"
								>{{ (this.b1 * Number(2.885)).toFixed(3) }}
							</span>
							<span :title="(this.b1 * Number(120.803)).toFixed(3)">{{
								(this.b1 * Number(120.803)).toFixed(3)
							}}</span>
							<span :title="(this.b1 * Number(114.497)).toFixed(3)">{{
								(this.b1 * Number(114.497)).toFixed(3)
							}}</span>
							<span :title="(this.b1 * Number(28.872)).toFixed(3)"
								>{{ (this.b1 * Number(28.872)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.c1 * Number(4.948)).toFixed(3)"
								>{{ (this.c1 * Number(4.948)).toFixed(3) }}
							</span>
							<span :title="(this.c1 * Number(3.464)).toFixed(3)"
								>{{ (this.c1 * Number(3.464)).toFixed(3) }}
							</span>
							<span :title="(this.c1 * Number(145.022)).toFixed(3)">{{
								(this.c1 * Number(145.022)).toFixed(3)
							}}</span>
							<span :title="(this.c1 * Number(137.452)).toFixed(3)">{{
								(this.c1 * Number(137.452)).toFixed(3)
							}}</span>
							<span :title="(this.c1 * Number(34.66)).toFixed(3)"
								>{{ (this.c1 * Number(34.66)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.d1 * Number(1.471)).toFixed(3)"
								>{{ (this.d1 * Number(1.471)).toFixed(3) }}
							</span>
							<span :title="(this.d1 * Number(1.03)).toFixed(3)"
								>{{ (this.d1 * Number(1.03)).toFixed(3) }}
							</span>
							<span :title="(this.d1 * Number(43.127)).toFixed(3)">{{
								(this.d1 * Number(43.127)).toFixed(3)
							}}</span>
							<span :title="(this.d1 * Number(40.875)).toFixed(3)">{{
								(this.d1 * Number(40.875)).toFixed(3)
							}}</span>
							<span :title="(this.d1 * Number(10.307)).toFixed(3)"
								>{{ (this.d1 * Number(10.307)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div
			v-if="userNatural"
			style="width: 98%; margin-left: 1% margin-bottom: 2%"
		>
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-1.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '天然气' : 'Natural gas' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '千立方米(k·m3)' : 'k·m3' }}</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千立方英尺(k·ft3)' : 'k·ft3' }}
						</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="e1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('26')"
								@blur="lostBlur"
								@input="getNatural('1')"
								:class="focusClass == 26 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="f1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('27')"
								@blur="lostBlur"
								@input="getNatural('2')"
								:class="focusClass == 27 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn-deft" @click="getNatural('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearNatural">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.e1 * Number(1.215)).toFixed(3)"
								>{{ (this.e1 * Number(1.215)).toFixed(3) }}
							</span>
							<span :title="(this.e1 * Number(0.851)).toFixed(3)"
								>{{ (this.e1 * Number(0.851)).toFixed(3) }}
							</span>
							<span :title="(this.e1 * Number(35.612)).toFixed(3)">{{
								(this.e1 * Number(35.612)).toFixed(3)
							}}</span>
							<span :title="(this.e1 * Number(33.753)).toFixed(3)">{{
								(this.e1 * Number(33.753)).toFixed(3)
							}}</span>
							<span :title="(this.e1 * Number(8.511)).toFixed(3)"
								>{{ (this.e1 * Number(8.511)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.f1 * Number(0.034)).toFixed(3)"
								>{{ (this.f1 * Number(0.034)).toFixed(3) }}
							</span>
							<span :title="(this.f1 * Number(0.024)).toFixed(3)"
								>{{ (this.f1 * Number(0.024)).toFixed(3) }}
							</span>
							<span :title="(this.f1 * Number(1.009)).toFixed(3)">{{
								(this.f1 * Number(1.009)).toFixed(3)
							}}</span>
							<span :title="(this.f1 * Number(0.956)).toFixed(3)">{{
								(this.f1 * Number(0.956)).toFixed(3)
							}}</span>
							<span :title="(this.f1 * Number(0.241)).toFixed(3)"
								>{{ (this.f1 * Number(0.241)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div
			v-if="userLiquefied"
			style="width: 98%; margin-left: 1% margin-bottom: 2%"
		>
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-1.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '液化石油气' : 'Liquefied petroleum gas' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="m"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('28')"
								@blur="lostBlur"
								@input="getGas('1')"
								:class="focusClass == 28 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="n"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('29')"
								@blur="lostBlur"
								@input="getGas('2')"
								:class="focusClass == 29 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="o"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('40')"
								@blur="lostBlur"
								@input="getGas('3')"
								:class="focusClass == 40 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="p"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('31')"
								@blur="lostBlur"
								@input="getGas('4')"
								:class="focusClass == 31 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getGas('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearGas">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.m * Number(1.714)).toFixed(3)"
								>{{ (this.m * Number(1.714)).toFixed(3) }}
							</span>
							<span :title="(this.m * Number(1.2)).toFixed(3)"
								>{{ (this.m * Number(1.2)).toFixed(3) }}
							</span>
							<span :title="(this.m * Number(50.246)).toFixed(3)">{{
								(this.m * Number(50.246)).toFixed(3)
							}}</span>
							<span :title="(this.m * Number(47.623)).toFixed(3)">{{
								(this.m * Number(47.623)).toFixed(3)
							}}</span>
							<span :title="(this.m * Number(12.009)).toFixed(3)"
								>{{ (this.m * Number(12.009)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.n * Number(0.777)).toFixed(3)"
								>{{ (this.n * Number(0.777)).toFixed(3) }}
							</span>
							<span :title="(this.n * Number(0.544)).toFixed(3)"
								>{{ (this.n * Number(0.544)).toFixed(3) }}
							</span>
							<span :title="(this.n * Number(22.787)).toFixed(3)">{{
								(this.n * Number(22.787)).toFixed(3)
							}}</span>
							<span :title="(this.n * Number(21.598)).toFixed(3)">{{
								(this.n * Number(21.598)).toFixed(3)
							}}</span>
							<span :title="(this.n * Number(5.446)).toFixed(3)"
								>{{ (this.n * Number(5.446)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.o * Number(1.742)).toFixed(3)"
								>{{ (this.o * Number(1.742)).toFixed(3) }}
							</span>
							<span :title="(this.o * Number(1.219)).toFixed(3)"
								>{{ (this.o * Number(1.219)).toFixed(3) }}
							</span>
							<span :title="(this.o * Number(51.048)).toFixed(3)">{{
								(this.o * Number(51.048)).toFixed(3)
							}}</span>
							<span :title="(this.o * Number(48.383)).toFixed(3)">{{
								(this.o * Number(48.383)).toFixed(3)
							}}</span>
							<span :title="(this.o * Number(12.2)).toFixed(3)"
								>{{ (this.o * Number(12.2)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.p * Number(1.556)).toFixed(3)"
								>{{ (this.p * Number(1.556)).toFixed(3) }}
							</span>
							<span :title="(this.p * Number(1.089)).toFixed(3)"
								>{{ (this.p * Number(1.089)).toFixed(3) }}
							</span>
							<span :title="(this.p * Number(45.595)).toFixed(3)">{{
								(this.p * Number(45.595)).toFixed(3)
							}}</span>
							<span :title="(this.p * Number(43.215)).toFixed(3)">{{
								(this.p * Number(43.215)).toFixed(3)
							}}</span>
							<span :title="(this.p * Number(10.897)).toFixed(3)"
								>{{ (this.p * Number(10.897)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div
			v-if="userHydrogen"
			style="width: 98%; margin-left: 1% margin-bottom: 2%"
		>
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-3.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '氢' : 'Hydrogen' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '千立方米(k·m3)' : 'k·m3' }}</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千立方英尺(k·ft3)' : 'k·ft3' }}
						</li>
						<li>{{ $i18n.locale === 'zh' ? '吨(t)' : 't' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '千磅(lb)' : 'lb' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '长吨(lt)' : 'lt' }}</li>
						<li>{{ $i18n.locale === 'zh' ? '短吨(st)' : 'st' }}</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="a2"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('32')"
								@blur="lostBlur"
								@input="getHydrogen('1')"
								:class="focusClass == 32 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="b2"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('33')"
								@blur="lostBlur"
								@input="getHydrogen('2')"
								:class="focusClass == 33 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="c2"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('34')"
								@blur="lostBlur"
								@input="getHydrogen('3')"
								:class="focusClass == 34 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="d2"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('35')"
								@blur="lostBlur"
								@input="getHydrogen('4')"
								:class="focusClass == 35 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="e2"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('36')"
								@blur="lostBlur"
								@input="getHydrogen('5')"
								:class="focusClass == 36 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="f2"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('37')"
								@blur="lostBlur"
								@input="getHydrogen('6')"
								:class="focusClass == 37 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%">
					<div>
						<el-button class="user-btn" @click="getHydrogen('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearHydrogen">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.a2 * Number(0.436)).toFixed(3)"
								>{{ (this.a2 * Number(0.436)).toFixed(3) }}
							</span>
							<span :title="(this.a2 * Number(0.305)).toFixed(3)"
								>{{ (this.a2 * Number(0.305)).toFixed(3) }}
							</span>
							<span :title="(this.a2 * Number(12.78)).toFixed(3)">{{
								(this.a2 * Number(12.78)).toFixed(3)
							}}</span>
							<span :title="(this.a2 * Number(12.112)).toFixed(3)">{{
								(this.a2 * Number(12.112)).toFixed(3)
							}}</span>
							<span :title="(this.a2 * Number(3.054)).toFixed(3)"
								>{{ (this.a2 * Number(3.054)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.b2 * Number(0.012)).toFixed(3)"
								>{{ (this.b2 * Number(0.012)).toFixed(3) }}
							</span>
							<span :title="(this.b2 * Number(0.009)).toFixed(3)"
								>{{ (this.b2 * Number(0.009)).toFixed(3) }}
							</span>
							<span :title="(this.b2 * Number(0.362)).toFixed(3)">{{
								(this.b2 * Number(0.362)).toFixed(3)
							}}</span>
							<span :title="(this.b2 * Number(0.343)).toFixed(3)">{{
								(this.b2 * Number(0.343)).toFixed(3)
							}}</span>
							<span :title="(this.b2 * Number(0.086)).toFixed(3)"
								>{{ (this.b2 * Number(0.086)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.c2 * Number(4.85)).toFixed(3)"
								>{{ (this.c2 * Number(4.85)).toFixed(3) }}
							</span>
							<span :title="(this.c2 * Number(3.395)).toFixed(3)"
								>{{ (this.c2 * Number(3.395)).toFixed(3) }}
							</span>
							<span :title="(this.c2 * Number(142.154)).toFixed(3)">{{
								(this.c2 * Number(142.154)).toFixed(3)
							}}</span>
							<span :title="(this.c2 * Number(134.733)).toFixed(3)">{{
								(this.c2 * Number(134.733)).toFixed(3)
							}}</span>
							<span :title="(this.c2 * Number(33.974)).toFixed(3)"
								>{{ (this.c2 * Number(33.974)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.d2 * Number(2.2)).toFixed(3)"
								>{{ (this.d2 * Number(2.2)).toFixed(3) }}
							</span>
							<span :title="(this.d2 * Number(1.54)).toFixed(3)"
								>{{ (this.d2 * Number(1.54)).toFixed(3) }}
							</span>
							<span :title="(this.d2 * Number(64.469)).toFixed(3)">{{
								(this.d2 * Number(64.469)).toFixed(3)
							}}</span>
							<span :title="(this.d2 * Number(61.103)).toFixed(3)">{{
								(this.d2 * Number(61.103)).toFixed(3)
							}}</span>
							<span :title="(this.d2 * Number(15.408)).toFixed(3)"
								>{{ (this.d2 * Number(15.408)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.e2 * Number(4.927)).toFixed(3)"
								>{{ (this.e2 * Number(4.927)).toFixed(3) }}
							</span>
							<span :title="(this.e2 * Number(3.449)).toFixed(3)"
								>{{ (this.e2 * Number(3.449)).toFixed(3) }}
							</span>
							<span :title="(this.e2 * Number(144.421)).toFixed(3)">{{
								(this.e2 * Number(144.421)).toFixed(3)
							}}</span>
							<span :title="(this.e2 * Number(136.882)).toFixed(3)">{{
								(this.e2 * Number(136.882)).toFixed(3)
							}}</span>
							<span :title="(this.e2 * Number(34.516)).toFixed(3)"
								>{{ (this.e2 * Number(34.516)).toFixed(3) }}
							</span>
						</li>
						<li>
							<span :title="(this.f2 * Number(4.401)).toFixed(3)"
								>{{ (this.f2 * Number(4.401)).toFixed(3) }}
							</span>
							<span :title="(this.f2 * Number(3.081)).toFixed(3)"
								>{{ (this.f2 * Number(3.081)).toFixed(3) }}
							</span>
							<span :title="(this.f2 * Number(128.996)).toFixed(3)">{{
								(this.f2 * Number(128.996)).toFixed(3)
							}}</span>
							<span :title="(this.f2 * Number(122.262)).toFixed(3)">{{
								(this.f2 * Number(122.262)).toFixed(3)
							}}</span>
							<span :title="(this.f2 * Number(30.83)).toFixed(3)"
								>{{ (this.f2 * Number(30.83)).toFixed(3) }}
							</span>
						</li>
					</ul>
				</div>
			</div>
		</div>
		<div v-if="userPower" style="width: 98%; margin-left: 1% margin-bottom: 2%">
			<div style="display: flex; margin-top: 20px">
				<div style="width: 40px; height: 40px">
					<img
						src="@/assets/userUntil-4.png"
						style="width: 100%; height: 100%"
					/>
				</div>
				<div
					style="
						font-size: 22px;
						font-weight: 700;
						height: 40px;
						line-height: 40px;
						margin-left: 10px;
					"
				>
					{{ $i18n.locale === 'zh' ? '电力' : 'Power' }}
				</div>
			</div>
			<div style="border-top: 1px solid #d7d7d7; margin-bottom: 20px"></div>
			<div style="display: flex; width: 100%; justify-content: space-between">
				<div style="display: flex; flex-wrap: wrap; width: 34%">
					<div
						style="
							width: 100%;
							height: 55px;
							line-height: 55px;
							text-align: center;
							font-size: 23px;
							border-top: 1px solid #dbdbdb;
							border-left: 1px solid #dbdbdb;
							border-right: 1px solid #dbdbdb;
						"
					>
						{{ $i18n.locale === 'zh' ? '物理单位' : 'Physical unit' }}
					</div>
					<ul class="text-title" style="width: 44%">
						<li>{{ $i18n.locale === 'zh' ? '千千瓦时(MWh)' : 'MWh' }}</li>
						<li>
							{{ $i18n.locale === 'zh' ? '千瓦时(kWh)' : 'kWh' }}
						</li>
					</ul>
					<ul style="width: 56%">
						<li>
							<el-input
								type="number"
								v-model="g1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('38')"
								@blur="lostBlur"
								@input="getPower('1')"
								:class="focusClass == 38 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
						<li>
							<el-input
								type="number"
								v-model="h1"
								:placeholder="this.$i18n.locale === 'zh' ? textInfo : textInfo1"
								@focus="getFocus('39')"
								@blur="lostBlur"
								@input="getPower('2')"
								:class="focusClass == 39 ? 'focusClass2' : 'focusClass1'"
							/>
						</li>
					</ul>
				</div>
				<div style="width: 11%; text-align: center !important">
					<div>
						<el-button class="user-btn-deft" @click="getPower('0')">{{
							$i18n.locale === 'zh' ? '换  算' : 'Conversion'
						}}</el-button>
					</div>
					<div>
						<el-button class="user-btn-clear" @click="clearPower">{{
							$i18n.locale === 'zh' ? '数据重置' : 'Data reset'
						}}</el-button>
					</div>
				</div>
				<div style="display: flex; flex-wrap: wrap; width: 54%">
					<div style="width: 100%; display: flex" class="title-top">
						<span>{{ $i18n.locale === 'zh' ? '标煤(tce)' : 'tce' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '标油(toe)' : 'toe' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉焦(GJ)' : 'GJ' }} </span>
						<span>{{ $i18n.locale === 'zh' ? '吉卡(Gcal)' : 'Gcal' }} </span>
						<span style="border-right: 1px solid #dbdbdb">{{
							$i18n.locale === 'zh' ? '百万英热单位(MBtu)' : 'MBtu'
						}}</span>
					</div>
					<ul style="width: 100%" class="ui-bgcText">
						<li>
							<span :title="(this.g1 * Number(0.123)).toFixed(3)"
								>{{ (this.g1 * Number(0.123)).toFixed(3) }}
							</span>
							<span :title="(this.g1 * Number(0.086)).toFixed(3)"
								>{{ (this.g1 * Number(0.086)).toFixed(3) }}
							</span>
							<span :title="(this.g1 * Number(3.602)).toFixed(3)">{{
								(this.g1 * Number(3.602)).toFixed(3)
							}}</span>
							<span :title="(this.g1 * Number(3.414)).toFixed(3)">{{
								(this.g1 * Number(3.414)).toFixed(3)
							}}</span>
							<span :title="(this.g1 * Number(0.861)).toFixed(3)"
								>{{ (this.g1 * Number(0.861)).toFixed(3) }}
							</span>
						</li>
						<li style="width: 100%; height: 41px; display: flex; border: none">
							<div
								style="
									width: 35.8%;
									height: 41px;
									line-height: 41px;
									text-align: center;
									border: 1px solid #dbdbdb;
									overflow: hidden;
									white-space: nowrap;
									text-overflow: ellipsis;
								"
								:title="(this.h1 * Number(301.5)).toFixed(3)"
							>
								{{ (this.h1 * Number(301.5)).toFixed(3)
								}}{{ $i18n.locale === 'zh' ? '克' : 'g' }}
							</div>
							<div
								style="
									width: 63.8%;
									height: 41px;
									line-height: 41px;
									text-align: center;
									border-top: 1px solid #dbdbdb;
									border-bottom: 1px solid #dbdbdb;
									border-right: 1px solid #dbdbdb;
									overflow: hidden;
									white-space: nowrap;
									text-overflow: ellipsis;
								"
								:title="(this.h1 * Number(0.3)).toFixed(3)"
							>
								{{ (this.h1 * Number(0.3)).toFixed(3)
								}}{{ $i18n.locale === 'zh' ? '立方米' : 'm3' }}
							</div>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
export default {
	name: 'unitConversion',
	data() {
		return {
			focusClass: '',
			userRaw: true,
			userWashed: true,
			userCoke: true,
			userCrude: true,
			userDiesel: true,
			userGasoline: true,
			userNatural: true,
			userLiquefied: true,
			userHydrogen: true,
			userPower: true,
			informationsClass: '0',
			textInfo: '请输入数值',
			textInfo1: 'Please enter a value',
			//原煤
			disabled: false,
			a: '',
			b: '',
			c: '',
			d: '',
			//洗精煤
			disabled1: false,
			e: '',
			f: '',
			g: '',
			h: '',
			//焦炭
			disabled2: false,
			i: '',
			j: '',
			k: '',
			l: '',
			//液化石油气
			disabled3: false,
			m: '',
			n: '',
			o: '',
			p: '',
			//原油
			disabled4: false,
			q: '',
			r: '',
			s: '',
			t: '',
			u: '',
			//柴油
			disabled5: false,
			v: '',
			w: '',
			x: '',
			y: '',
			//汽油/煤油
			disabled6: false,
			a1: '',
			b1: '',
			c1: '',
			d1: '',
			//天然气
			disabled7: false,
			e1: '',
			f1: '',
			//电力
			disabled8: false,
			g1: '',
			h1: '',
			//氢
			disabled9: false,
			a2: '',
			b2: '',
			c2: '',
			d2: '',
			e2: '',
			f2: '',
		}
	},
	mounted() {
		this.getInfo('0')
	},
	methods: {
		lostBlur() {
			this.focusClass = ''
		},
		getFocus(num) {
			this.focusClass = num
		},
		getInfo(num) {
			this.informationsClass = num
			if (num == '0') {
				this.userRaw = true
				this.userWashed = true
				this.userCoke = true
				this.userCrude = true
				this.userDiesel = true
				this.userGasoline = true
				this.userNatural = true
				this.userLiquefied = true
				this.userHydrogen = true
				this.userPower = true
			}
			if (num == '1') {
				this.userRaw = true
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '2') {
				this.userRaw = false
				this.userWashed = true
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '3') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = true
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '4') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = true
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '5') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = true
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '6') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = true
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '7') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = true
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '8') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = true
				this.userHydrogen = false
				this.userPower = false
			}
			if (num == '9') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = true
				this.userPower = false
			}
			if (num == '10') {
				this.userRaw = false
				this.userWashed = false
				this.userCoke = false
				this.userCrude = false
				this.userDiesel = false
				this.userGasoline = false
				this.userNatural = false
				this.userLiquefied = false
				this.userHydrogen = false
				this.userPower = true
			}
		},
		getNum(num) {
			// if (this.disabled == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled = true
			if (num == 0) {
				// if (this.a !== '') {
				// 	let a1 = Number(this.a)
				// 	this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.c = (a1 * Number(0.9843)).toFixed(3)
				// 	this.d = (a1 * Number(1.102)).toFixed(3)
				// }
				// if (this.b !== '') {
				// 	this.a = ((Number(this.b) * Number(1000)) / Number(2205)).toFixed(3)
				// 	let a1 = Number(this.a)
				// 	this.c = (a1 * Number(0.9843)).toFixed(3)
				// 	this.d = (a1 * Number(1.102)).toFixed(3)
				// }
				// if (this.c !== '') {
				// 	this.a = (Number(this.c) / Number(0.9843)).toFixed(3)
				// 	let a1 = Number(this.a)
				// 	this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.d = (a1 * Number(1.102)).toFixed(3)
				// }
				// if (this.d !== '') {
				// 	this.a = (Number(this.d) / Number(1.102)).toFixed(3)
				// 	let a1 = Number(this.a)
				// 	this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.c = (a1 * Number(0.9843)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.a === '') {
						this.disabled = false
						this.a = ''
						this.b = ''
						this.c = ''
						this.d = ''
					} else {
						let a1 = Number(this.a)
						this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.c = (a1 * Number(0.9843)).toFixed(3)
						this.d = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.b === '') {
						this.disabled = false
						this.a = ''
						this.b = ''
						this.c = ''
						this.d = ''
					} else {
						this.a = ((Number(this.b) * Number(1000)) / Number(2205)).toFixed(3)
						let a1 = Number(this.a)
						this.c = (a1 * Number(0.9843)).toFixed(3)
						this.d = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.c === '') {
						this.disabled = false
						this.a = ''
						this.b = ''
						this.c = ''
						this.d = ''
					} else {
						this.a = (Number(this.c) / Number(0.9843)).toFixed(3)
						let a1 = Number(this.a)
						this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.d = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.d === '') {
						this.disabled = false
						this.a = ''
						this.b = ''
						this.c = ''
						this.d = ''
					} else {
						this.a = (Number(this.d) / Number(1.102)).toFixed(3)
						let a1 = Number(this.a)
						this.b = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.c = (a1 * Number(0.9843)).toFixed(3)
					}
				}
			}
		},
		clearNum() {
			this.disabled = false
			this.a = ''
			this.b = ''
			this.c = ''
			this.d = ''
		},
		getWashed(num) {
			// if (this.disabled1 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled1 = true
			if (num == 0) {
				// if (this.e !== '') {
				// 	let a1 = Number(this.e)
				// 	this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.g = (a1 * Number(0.9843)).toFixed(3)
				// 	this.h = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.f !== '') {
				// 	this.e = ((Number(this.f) * Number(1000)) / Number(2205)).toFixed(3)
				// 	let a1 = Number(this.e)
				// 	this.g = (a1 * Number(0.9843)).toFixed(3)
				// 	this.h = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.g !== '') {
				// 	this.e = (Number(this.g) / Number(0.9843)).toFixed(3)
				// 	let a1 = Number(this.e)
				// 	this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.h = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.h !== '') {
				// 	this.e = (Number(this.h) / Number(1.102)).toFixed(3)
				// 	let a1 = Number(this.e)
				// 	this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.g = (a1 * Number(0.9843)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.e === '') {
						this.disabled1 = false
						this.e = ''
						this.f = ''
						this.g = ''
						this.h = ''
					} else {
						let a1 = Number(this.e)
						this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.g = (a1 * Number(0.9843)).toFixed(3)
						this.h = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.f === '') {
						this.disabled1 = false
						this.e = ''
						this.f = ''
						this.g = ''
						this.h = ''
					} else {
						this.e = ((Number(this.f) * Number(1000)) / Number(2205)).toFixed(3)
						let a1 = Number(this.e)
						this.g = (a1 * Number(0.9843)).toFixed(3)
						this.h = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.g === '') {
						this.disabled1 = false
						this.e = ''
						this.f = ''
						this.g = ''
						this.h = ''
					} else {
						this.e = (Number(this.g) / Number(0.9843)).toFixed(3)
						let a1 = Number(this.e)
						this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.h = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.h === '') {
						this.disabled1 = false
						this.e = ''
						this.f = ''
						this.g = ''
						this.h = ''
					} else {
						this.e = (Number(this.h) / Number(1.102)).toFixed(3)
						let a1 = Number(this.e)
						this.f = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.g = (a1 * Number(0.9843)).toFixed(3)
					}
				}
			}
		},
		clearWashed() {
			this.disabled1 = false
			this.e = ''
			this.f = ''
			this.g = ''
			this.h = ''
		},
		getCoke(num) {
			// if (this.disabled2 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled2 = true
			if (num == 0) {
				// if (this.i !== '') {
				// 	let a1 = Number(this.i)
				// 	this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.k = (a1 * Number(0.9843)).toFixed(3)
				// 	this.l = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.j !== '') {
				// 	this.i = ((Number(this.j) * Number(1000)) / Number(2205)).toFixed(3)
				// 	let a1 = Number(this.i)
				// 	this.k = (a1 * Number(0.9843)).toFixed(3)
				// 	this.l = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.k !== '') {
				// 	this.i = (Number(this.k) / Number(0.9843)).toFixed(3)
				// 	let a1 = Number(this.i)
				// 	this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.l = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.l !== '') {
				// 	this.i = (Number(this.l) / Number(1.102)).toFixed(3)
				// 	let a1 = Number(this.i)
				// 	this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.k = (a1 * Number(0.9843)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.i === '') {
						this.disabled2 = false
						this.i = ''
						this.j = ''
						this.k = ''
						this.l = ''
					} else {
						let a1 = Number(this.i)
						this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.k = (a1 * Number(0.9843)).toFixed(3)
						this.l = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.j === '') {
						this.disabled2 = false
						this.i = ''
						this.j = ''
						this.k = ''
						this.l = ''
					} else {
						this.i = ((Number(this.j) * Number(1000)) / Number(2205)).toFixed(3)
						let a1 = Number(this.i)
						this.k = (a1 * Number(0.9843)).toFixed(3)
						this.l = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.k === '') {
						this.disabled2 = false
						this.i = ''
						this.j = ''
						this.k = ''
						this.l = ''
					} else {
						this.i = (Number(this.k) / Number(0.9843)).toFixed(3)
						let a1 = Number(this.i)
						this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.l = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.l === '') {
						this.disabled2 = false
						this.i = ''
						this.j = ''
						this.k = ''
						this.l = ''
					} else {
						this.i = (Number(this.l) / Number(1.102)).toFixed(3)
						let a1 = Number(this.i)
						this.j = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.k = (a1 * Number(0.9843)).toFixed(3)
					}
				}
			}
		},
		clearCoke() {
			this.disabled2 = false
			this.i = ''
			this.j = ''
			this.k = ''
			this.l = ''
		},
		getGas(num) {
			// if (this.disabled3 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled3 = true
			if (num == 0) {
				// if (this.m !== '') {
				// 	let a1 = Number(this.m)
				// 	this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.o = (a1 * Number(0.9843)).toFixed(3)
				// 	this.p = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.n !== '') {
				// 	this.m = ((Number(this.n) * Number(1000)) / Number(2205)).toFixed(3)
				// 	let a1 = Number(this.m)
				// 	this.o = (a1 * Number(0.9843)).toFixed(3)
				// 	this.p = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.o !== '') {
				// 	this.m = (Number(this.o) / Number(0.9843)).toFixed(3)
				// 	let a1 = Number(this.m)
				// 	this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.p = (a1 * Number(1.102)).toFixed(3)
				// } else if (this.p !== '') {
				// 	this.m = (Number(this.p) / Number(1.102)).toFixed(3)
				// 	let a1 = Number(this.m)
				// 	this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
				// 	this.o = (a1 * Number(0.9843)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.m === '') {
						this.disabled3 = false
						this.m = ''
						this.n = ''
						this.o = ''
						this.p = ''
					} else {
						let a1 = Number(this.m)
						this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.o = (a1 * Number(0.9843)).toFixed(3)
						this.p = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.n === '') {
						this.disabled3 = false
						this.m = ''
						this.n = ''
						this.o = ''
						this.p = ''
					} else {
						this.m = ((Number(this.n) * Number(1000)) / Number(2205)).toFixed(3)
						let a1 = Number(this.m)
						this.o = (a1 * Number(0.9843)).toFixed(3)
						this.p = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.o === '') {
						this.disabled3 = false
						this.m = ''
						this.n = ''
						this.o = ''
						this.p = ''
					} else {
						this.m = (Number(this.o) / Number(0.9843)).toFixed(3)
						let a1 = Number(this.m)
						this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.p = (a1 * Number(1.102)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.p === '') {
						this.disabled3 = false
						this.m = ''
						this.n = ''
						this.o = ''
						this.p = ''
					} else {
						this.m = (Number(this.p) / Number(1.102)).toFixed(3)
						let a1 = Number(this.m)
						this.n = ((a1 * Number(2205)) / Number(1000)).toFixed(3)
						this.o = (a1 * Number(0.9843)).toFixed(3)
					}
				}
			}
		},
		clearGas() {
			this.disabled3 = false
			this.m = ''
			this.n = ''
			this.o = ''
			this.p = ''
		},
		getOil(num) {
			// if (this.disabled4 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled4 = true
			if (num == 0) {
				// if (this.q !== '') {
				// 	this.u = (Number(this.q) / Number(7.38)).toFixed(3)
				// 	let u1 = Number(this.u)
				// 	this.r = (u1 * Number(1.173)).toFixed(3)
				// 	this.s = (u1 * Number(0.3098)).toFixed(3)
				// 	this.t = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.r !== '') {
				// 	this.u = (Number(this.r) / Number(1.173)).toFixed(3)
				// 	let u1 = Number(this.u)
				// 	this.q = (u1 * Number(7.38)).toFixed(3)
				// 	this.s = (u1 * Number(0.3098)).toFixed(3)
				// 	this.t = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.s !== '') {
				// 	this.u = (Number(this.s) / Number(0.3098)).toFixed(3)
				// 	let u1 = Number(this.u)
				// 	this.q = (u1 * Number(7.38)).toFixed(3)
				// 	this.r = (u1 * Number(1.173)).toFixed(3)
				// 	this.t = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.t !== '') {
				// 	this.u = (Number(this.t) / Number(0.258)).toFixed(3)
				// 	let u1 = Number(this.u)
				// 	this.q = (u1 * Number(7.38)).toFixed(3)
				// 	this.r = (u1 * Number(1.173)).toFixed(3)
				// 	this.s = (u1 * Number(0.3098)).toFixed(3)
				// } else if (this.u !== '') {
				// 	let u1 = Number(this.u)
				// 	this.q = (u1 * Number(7.38)).toFixed(3)
				// 	this.r = (u1 * Number(1.173)).toFixed(3)
				// 	this.s = (u1 * Number(0.3098)).toFixed(3)
				// 	this.t = (u1 * Number(0.258)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.q === '') {
						this.disabled4 = false
						this.q = ''
						this.r = ''
						this.s = ''
						this.t = ''
						this.u = ''
					} else {
						this.u = (Number(this.q) / Number(7.38)).toFixed(3)
						let u1 = Number(this.u)
						this.r = (u1 * Number(1.173)).toFixed(3)
						this.s = (u1 * Number(0.3098)).toFixed(3)
						this.t = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.r === '') {
						this.disabled4 = false
						this.q = ''
						this.r = ''
						this.s = ''
						this.t = ''
						this.u = ''
					} else {
						this.u = (Number(this.r) / Number(1.173)).toFixed(3)
						let u1 = Number(this.u)
						this.q = (u1 * Number(7.38)).toFixed(3)
						this.s = (u1 * Number(0.3098)).toFixed(3)
						this.t = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.s === '') {
						this.disabled4 = false
						this.q = ''
						this.r = ''
						this.s = ''
						this.t = ''
						this.u = ''
					} else {
						this.u = (Number(this.s) / Number(0.3098)).toFixed(3)
						let u1 = Number(this.u)
						this.q = (u1 * Number(7.38)).toFixed(3)
						this.r = (u1 * Number(1.173)).toFixed(3)
						this.t = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.t === '') {
						this.disabled4 = false
						this.q = ''
						this.r = ''
						this.s = ''
						this.t = ''
						this.u = ''
					} else {
						this.u = (Number(this.t) / Number(0.258)).toFixed(3)
						let u1 = Number(this.u)
						this.q = (u1 * Number(7.38)).toFixed(3)
						this.r = (u1 * Number(1.173)).toFixed(3)
						this.s = (u1 * Number(0.3098)).toFixed(3)
					}
				} else if (num == '5') {
					if (this.u === '') {
						this.disabled4 = false
						this.q = ''
						this.r = ''
						this.s = ''
						this.t = ''
						this.u = ''
					} else {
						let u1 = Number(this.u)
						this.q = (u1 * Number(7.38)).toFixed(3)
						this.r = (u1 * Number(1.173)).toFixed(3)
						this.s = (u1 * Number(0.3098)).toFixed(3)
						this.t = (u1 * Number(0.258)).toFixed(3)
					}
				}
			}
		},
		clearOil() {
			this.disabled4 = false
			this.q = ''
			this.r = ''
			this.s = ''
			this.t = ''
			this.u = ''
		},
		getDiesel(num) {
			// if (this.disabled5 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled5 = true
			if (num == 0) {
				// if (this.v !== '') {
				// 	this.y = (Number(this.v) / Number(1.173)).toFixed(3)
				// 	let u1 = Number(this.y)
				// 	this.w = (u1 * Number(0.3098)).toFixed(3)
				// 	this.x = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.w !== '') {
				// 	this.y = (Number(this.w) / Number(0.3098)).toFixed(3)
				// 	let u1 = Number(this.y)
				// 	this.v = (u1 * Number(1.173)).toFixed(3)
				// 	this.x = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.x !== '') {
				// 	this.y = (Number(this.x) / Number(0.258)).toFixed(3)
				// 	let u1 = Number(this.y)
				// 	this.v = (u1 * Number(1.173)).toFixed(3)
				// 	this.w = (u1 * Number(0.3098)).toFixed(3)
				// } else if (this.y !== '') {
				// 	let u1 = Number(this.y)
				// 	this.v = (u1 * Number(1.173)).toFixed(3)
				// 	this.w = (u1 * Number(0.3098)).toFixed(3)
				// 	this.x = (u1 * Number(0.258)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.v === '') {
						this.disabled5 = false
						this.v = ''
						this.w = ''
						this.x = ''
						this.y = ''
					} else {
						this.y = (Number(this.v) / Number(1.173)).toFixed(3)
						let u1 = Number(this.y)
						this.w = (u1 * Number(0.3098)).toFixed(3)
						this.x = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.w === '') {
						this.disabled5 = false
						this.v = ''
						this.w = ''
						this.x = ''
						this.y = ''
					} else {
						this.y = (Number(this.w) / Number(0.3098)).toFixed(3)
						let u1 = Number(this.y)
						this.v = (u1 * Number(1.173)).toFixed(3)
						this.x = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.x === '') {
						this.disabled5 = false
						this.v = ''
						this.w = ''
						this.x = ''
						this.y = ''
					} else {
						this.y = (Number(this.x) / Number(0.258)).toFixed(3)
						let u1 = Number(this.y)
						this.v = (u1 * Number(1.173)).toFixed(3)
						this.w = (u1 * Number(0.3098)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.y === '') {
						this.disabled5 = false
						this.v = ''
						this.w = ''
						this.x = ''
						this.y = ''
					} else {
						let u1 = Number(this.y)
						this.v = (u1 * Number(1.173)).toFixed(3)
						this.w = (u1 * Number(0.3098)).toFixed(3)
						this.x = (u1 * Number(0.258)).toFixed(3)
					}
				}
			}
		},
		clearDiesel() {
			this.disabled5 = false
			this.v = ''
			this.w = ''
			this.x = ''
			this.y = ''
		},
		getGasoline(num) {
			// if (this.disabled6 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled6 = true
			if (num == 0) {
				// if (this.a1 !== '') {
				// 	this.d1 = (Number(this.a1) / Number(1.173)).toFixed(3)
				// 	let u1 = Number(this.d1)
				// 	this.b1 = (u1 * Number(0.3098)).toFixed(3)
				// 	this.c1 = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.b1 !== '') {
				// 	this.d1 = (Number(this.b1) / Number(0.3098)).toFixed(3)
				// 	let u1 = Number(this.d1)
				// 	this.a1 = (u1 * Number(1.173)).toFixed(3)
				// 	this.c1 = (u1 * Number(0.258)).toFixed(3)
				// } else if (this.c1 !== '') {
				// 	this.d1 = (Number(this.c1) / Number(0.258)).toFixed(3)
				// 	let u1 = Number(this.d1)
				// 	this.a1 = (u1 * Number(1.173)).toFixed(3)
				// 	this.b1 = (u1 * Number(0.3098)).toFixed(3)
				// } else if (this.d1 !== '') {
				// 	let u1 = Number(this.d1)
				// 	this.a1 = (u1 * Number(1.173)).toFixed(3)
				// 	this.b1 = (u1 * Number(0.3098)).toFixed(3)
				// 	this.c1 = (u1 * Number(0.258)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.a1 === '') {
						this.disabled6 = false
						this.a1 = ''
						this.b1 = ''
						this.c1 = ''
						this.d1 = ''
					} else {
						this.d1 = (Number(this.a1) / Number(1.173)).toFixed(3)
						let u1 = Number(this.d1)
						this.b1 = (u1 * Number(0.3098)).toFixed(3)
						this.c1 = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.b1 === '') {
						this.disabled6 = false
						this.a1 = ''
						this.b1 = ''
						this.c1 = ''
						this.d1 = ''
					} else {
						this.d1 = (Number(this.b1) / Number(0.3098)).toFixed(3)
						let u1 = Number(this.d1)
						this.a1 = (u1 * Number(1.173)).toFixed(3)
						this.c1 = (u1 * Number(0.258)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.c1 === '') {
						this.disabled6 = false
						this.a1 = ''
						this.b1 = ''
						this.c1 = ''
						this.d1 = ''
					} else {
						this.d1 = (Number(this.c1) / Number(0.258)).toFixed(3)
						let u1 = Number(this.d1)
						this.a1 = (u1 * Number(1.173)).toFixed(3)
						this.b1 = (u1 * Number(0.3098)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.d1 === '') {
						this.disabled6 = false
						this.a1 = ''
						this.b1 = ''
						this.c1 = ''
						this.d1 = ''
					} else {
						let u1 = Number(this.d1)
						this.a1 = (u1 * Number(1.173)).toFixed(3)
						this.b1 = (u1 * Number(0.3098)).toFixed(3)
						this.c1 = (u1 * Number(0.258)).toFixed(3)
					}
				}
			}
		},
		clearGasoline() {
			this.disabled6 = false
			this.a1 = ''
			this.b1 = ''
			this.c1 = ''
			this.d1 = ''
		},
		getNatural(num) {
			// if (this.disabled7 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled7 = true
			if (num == 0) {
				// if (this.e1 !== '') {
				// 	let e1 = Number(this.e1)
				// 	this.f1 = (e1 * Number(35.31)).toFixed(3)
				// } else if (this.f1 !== '') {
				// 	this.e1 = (Number(this.f1) / Number(35.31)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.e1 === '') {
						this.disabled7 = false
						this.e1 = ''
						this.f1 = ''
					} else {
						let e1 = Number(this.e1)
						this.f1 = (e1 * Number(35.31)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.f1 === '') {
						this.disabled7 = false
						this.e1 = ''
						this.f1 = ''
					} else {
						this.e1 = (Number(this.f1) / Number(35.31)).toFixed(3)
					}
				}
			}
		},
		clearNatural() {
			this.disabled7 = false
			this.e1 = ''
			this.f1 = ''
		},
		getPower(num) {
			// if (this.disabled8 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled8 = true
			if (num == 0) {
				// if (this.g1 !== '') {
				// 	this.h1 = (Number(this.g1) * Number(1000)).toFixed(3)
				// } else if (this.h1 !== '') {
				// 	this.g1 = (Number(this.h1) / Number(1000)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.g1 === '') {
						this.disabled8 = false
						this.g1 = ''
						this.h1 = ''
					} else {
						this.h1 = (Number(this.g1) * Number(1000)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.h1 === '') {
						this.disabled8 = false
						this.g1 = ''
						this.h1 = ''
					} else {
						this.g1 = (Number(this.h1) / Number(1000)).toFixed(3)
					}
				}
			}
		},
		clearPower() {
			this.disabled8 = false
			this.g1 = ''
			this.h1 = ''
		},
		getHydrogen(num) {
			// if (this.disabled9 == true) {
			// 	if (this.$i18n.locale === 'zh') {
			// 		this.$message.error('请清除数据之后再进行换算')
			// 	} else {
			// 		this.$message.error('Please clear the data before conversion')
			// 	}
			// 	return false
			// }
			// this.disabled9 = true
			if (num == 0) {
				// if (this.a2 !== '') {
				// 	this.c2 = (Number(this.a2) / Number(11124)).toFixed(3)
				// 	let c2 = Number(this.c2)
				// 	this.b2 = (c2 * Number(392771)).toFixed(3)
				// 	this.d2 = (c2 * Number(2.205)).toFixed(3)
				// 	this.e2 = (c2 * Number(0.9843)).toFixed(3)
				// 	this.f2 = (c2 * Number(1.102)).toFixed(3)
				// } else if (this.b2 !== '') {
				// 	this.c2 = (Number(this.b2) / Number(392771)).toFixed(3)
				// 	let c2 = Number(this.c2)
				// 	this.a2 = (c2 * Number(11124)).toFixed(3)
				// 	this.d2 = (c2 * Number(2.205)).toFixed(3)
				// 	this.e2 = (c2 * Number(0.9843)).toFixed(3)
				// 	this.f2 = (c2 * Number(1.102)).toFixed(3)
				// } else if (this.c2 !== '') {
				// 	let c2 = Number(this.c2)
				// 	this.a2 = (c2 * Number(11124)).toFixed(3)
				// 	this.b2 = (c2 * Number(392771)).toFixed(3)
				// 	this.d2 = (c2 * Number(2.205)).toFixed(3)
				// 	this.e2 = (c2 * Number(0.9843)).toFixed(3)
				// 	this.f2 = (c2 * Number(1.102)).toFixed(3)
				// } else if (this.d2 !== '') {
				// 	this.c2 = (Number(this.d2) / Number(2.205)).toFixed(3)
				// 	let c2 = Number(this.c2)
				// 	this.a2 = (c2 * Number(11124)).toFixed(3)
				// 	this.b2 = (c2 * Number(392771)).toFixed(3)
				// 	this.e2 = (c2 * Number(0.9843)).toFixed(3)
				// 	this.f2 = (c2 * Number(1.102)).toFixed(3)
				// } else if (this.e2 !== '') {
				// 	this.c2 = (Number(this.e2) / Number(0.9843)).toFixed(3)
				// 	let c2 = Number(this.c2)
				// 	this.a2 = (c2 * Number(11124)).toFixed(3)
				// 	this.b2 = (c2 * Number(392771)).toFixed(3)
				// 	this.d2 = (c2 * Number(2.205)).toFixed(3)
				// 	this.f2 = (c2 * Number(1.102)).toFixed(3)
				// } else if (this.f2 !== '') {
				// 	this.c2 = (Number(this.f2) / Number(1.102)).toFixed(3)
				// 	let c2 = Number(this.c2)
				// 	this.a2 = (c2 * Number(11124)).toFixed(3)
				// 	this.b2 = (c2 * Number(392771)).toFixed(3)
				// 	this.d2 = (c2 * Number(2.205)).toFixed(3)
				// 	this.e2 = (c2 * Number(0.9843)).toFixed(3)
				// }
			} else {
				if (num == '1') {
					if (this.a2 === '') {
						this.disabled9 = false
						this.a2 = ''
						this.b2 = ''
						this.c2 = ''
						this.d2 = ''
						this.e2 = ''
						this.f2 = ''
					} else {
						this.c2 = (Number(this.a2) / Number(11124)).toFixed(3)
						let c2 = Number(this.c2)
						this.b2 = (c2 * Number(392771)).toFixed(3)
						this.d2 = (c2 * Number(2.205)).toFixed(3)
						this.e2 = (c2 * Number(0.9843)).toFixed(3)
						this.f2 = (c2 * Number(1.102)).toFixed(3)
					}
				} else if (num == '2') {
					if (this.b2 === '') {
						this.disabled9 = false
						this.a2 = ''
						this.b2 = ''
						this.c2 = ''
						this.d2 = ''
						this.e2 = ''
						this.f2 = ''
					} else {
						this.c2 = (Number(this.b2) / Number(392771)).toFixed(3)
						let c2 = Number(this.c2)
						this.a2 = (c2 * Number(11124)).toFixed(3)
						this.d2 = (c2 * Number(2.205)).toFixed(3)
						this.e2 = (c2 * Number(0.9843)).toFixed(3)
						this.f2 = (c2 * Number(1.102)).toFixed(3)
					}
				} else if (num == '3') {
					if (this.c2 === '') {
						this.disabled9 = false
						this.a2 = ''
						this.b2 = ''
						this.c2 = ''
						this.d2 = ''
						this.e2 = ''
						this.f2 = ''
					} else {
						let c2 = Number(this.c2)
						this.a2 = (c2 * Number(11124)).toFixed(3)
						this.b2 = (c2 * Number(392771)).toFixed(3)
						this.d2 = (c2 * Number(2.205)).toFixed(3)
						this.e2 = (c2 * Number(0.9843)).toFixed(3)
						this.f2 = (c2 * Number(1.102)).toFixed(3)
					}
				} else if (num == '4') {
					if (this.d2 === '') {
						this.disabled9 = false
						this.a2 = ''
						this.b2 = ''
						this.c2 = ''
						this.d2 = ''
						this.e2 = ''
						this.f2 = ''
					} else {
						this.c2 = (Number(this.d2) / Number(2.205)).toFixed(3)
						let c2 = Number(this.c2)
						this.a2 = (c2 * Number(11124)).toFixed(3)
						this.b2 = (c2 * Number(392771)).toFixed(3)
						this.e2 = (c2 * Number(0.9843)).toFixed(3)
						this.f2 = (c2 * Number(1.102)).toFixed(3)
					}
				} else if (num == '5') {
					if (this.e2 === '') {
						this.disabled9 = false
						this.a2 = ''
						this.b2 = ''
						this.c2 = ''
						this.d2 = ''
						this.e2 = ''
						this.f2 = ''
					} else {
						this.c2 = (Number(this.e2) / Number(0.9843)).toFixed(3)
						let c2 = Number(this.c2)
						this.a2 = (c2 * Number(11124)).toFixed(3)
						this.b2 = (c2 * Number(392771)).toFixed(3)
						this.d2 = (c2 * Number(2.205)).toFixed(3)
						this.f2 = (c2 * Number(1.102)).toFixed(3)
					}
				} else if (num == '6') {
					if (this.f2 === '') {
						this.disabled9 = false
						this.a2 = ''
						this.b2 = ''
						this.c2 = ''
						this.d2 = ''
						this.e2 = ''
						this.f2 = ''
					} else {
						this.c2 = (Number(this.f2) / Number(1.102)).toFixed(3)
						let c2 = Number(this.c2)
						this.a2 = (c2 * Number(11124)).toFixed(3)
						this.b2 = (c2 * Number(392771)).toFixed(3)
						this.d2 = (c2 * Number(2.205)).toFixed(3)
						this.e2 = (c2 * Number(0.9843)).toFixed(3)
					}
				}
			}
		},
		clearHydrogen() {
			this.disabled9 = false
			this.a2 = ''
			this.b2 = ''
			this.c2 = ''
			this.d2 = ''
			this.e2 = ''
			this.f2 = ''
		},
	},
}
</script>
<style lang="less" scoped>
ul > li {
	height: 41px;
	line-height: 41px;
	border-top: 1px solid #dbdbdb;
	border-right: 1px solid #dbdbdb;
	display: flex;
}
ul > li:last-child {
	border-bottom: 1px solid #dbdbdb;
}
.none-title > li {
	border: none !important;
	height: 41px;
	line-height: 41px;
}
.title-top > span {
	width: 18%;
	height: 55px;
	line-height: 55px;
	text-align: center;
	border-left: 1px solid #dbdbdb;
	border-top: 1px solid #dbdbdb;
}
.title-top > span:last-child {
	width: 28%;
	height: 55px;
	line-height: 55px;
	text-align: center;
	border-left: 1px solid #dbdbdb;
	border-top: 1px solid #dbdbdb;
}
.text-title > li {
	padding-left: 10px;
	border-left: 1px solid #dbdbdb;
}
ul > li /deep/.el-input__inner {
	width: 100% !important;
	height: 100% !important;
	border: none;
	border-radius: 0;
	background-color: rgba(255, 255, 255, 0);
	color: #000;
}
/deep/ .el-input.is-disabled .el-input__inner {
	background-color: #fff;
	border-color: #fff;
	color: #000;
	cursor: not-allowed;
}
.ui-bgcText > li > span {
	width: 18%;
	height: 41px;
	line-height: 41px;
	text-align: center;
	// padding-left: 4px;
	border-left: 1px solid #dbdbdb;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.ui-bgcText > li > span:last-child {
	width: 28%;
	height: 41px;
	line-height: 41px;
	text-align: center;
	border-left: 1px solid #dbdbdb;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.information {
	display: inline-block;
	height: 100%;
	text-align: center;
	color: #343434;
	box-sizing: border-box;
	vertical-align: middle;
	font-weight: 600;
	padding: 0 20px;
}
.information1 {
	display: inline-block;
	height: 100%;
	text-align: center;
	color: #b7b7b7;
	box-sizing: border-box;
	vertical-align: middle;
	font-weight: 600;
	padding: 0 20px;
	cursor: pointer;
}

.information1:hover {
	color: #2c5589;
	cursor: pointer;
}

.information2 {
	display: inline-block;
	height: 100%;
	text-align: center;
	color: #fff;
	background-color: #105dbc;
	box-sizing: border-box;
	vertical-align: middle;
	border-radius: 10px;
	font-weight: 600;
	padding: 0 20px;
	cursor: pointer;
}
.focusClass1 {
	border: none;
}
.focusClass2 {
	border: 2px solid #c7d1dd;
	background-color: #f1f1f1;
}
/deep/.user-btn {
	margin-top: 90%;
	width: 100%;
	text-align: center !important;
	font-size: 16px;
	font-weight: 700;
	background-color: #105dbc;
	color: #fff;
	border-radius: 50px;
	border-bottom: 1px;
	border-right: 1px;
	box-shadow: 5px 5px 5px rgb(63, 62, 62);
}
/deep/.user-btn-deft {
	width: 100%;
	text-align: center !important;
	margin-top: 40%;
	font-size: 16px;
	font-weight: 700;
	background-color: #105dbc;
	color: #fff;
	border-radius: 50px;
	border-bottom: 1px;
	border-right: 1px;
	box-shadow: 5px 5px 5px rgb(63, 62, 62);
}
/deep/.user-btn-clear {
	width: 100%;
	text-align: center !important;
	margin-top: 5%;
	font-size: 16px;
	font-weight: 700;
	border-bottom: 1px;
	border-right: 1px;
	box-shadow: 5px 5px 5px rgb(63, 62, 62);
	background: linear-gradient(90deg, #3f9eff, #1674d5);
	color: #fff;
	border-radius: 50px;
}

/deep/ input::-webkit-outer-spin-button,
/deep/ input::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
}

/deep/ input[type='number'] {
	-moz-appearance: textfield !important;
}
.user-title1 {
	width: 100%;
	display: flex;
	height: 40px;
	line-height: 40px;
	margin-top: 12px;
	margin-bottom: 12px;
}
.user-title2 {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	height: 40px;
	line-height: 40px;
	margin-top: 14px;
	margin-bottom: 52px;
}
</style>
