<template>
|
<div
|
class="is-homepage bg-white"
|
style="display: flex; justify-content: center; align-items: center"
|
v-loading="state.isShowLoadingFrm"
|
element-loading-background="rgba(255,255,255, 0.8)"
|
>
|
<el-container class="o-site-main" style="max-width: 1440px; height: 100%">
|
<el-main style="height: 100%; overflow: unset">
|
<form style="height: 100%">
|
<div class="row js-sticky-parent" style="height: 100%">
|
<div class="small-12 large-6 columns" style="height: 100%">
|
<div class="js-sticky-column" style="height: 100%">
|
<div class="js-sticky-sidebar" style="height: 100%">
|
<div class="row align-justify align-middle">
|
<div class="columns">
|
<h2 class="cos-header" style="font-size: 40px; text-align: left; color: #3b3b3b">
|
{{ t('selectPage.workingConditions.TR') }}
|
</h2>
|
</div>
|
</div>
|
<div class="c-card" style="height: calc(100% - 65px); overflow: auto">
|
<div class="row">
|
<div class="columns c-quick-select__inputs">
|
<div class="row">
|
<!-- 流量输入 -->
|
<div class="columns">
|
<label class="c-form-label" for="FlowRated">{{ t('selectPage.flow.TR') }}</label>
|
<div class="o-input-select-combo js-ui-flowRated" style="position: relative">
|
<input
|
class="c-input-select-combo--left"
|
type="number"
|
v-model="state.formData.DpQ"
|
@input="handleInputDpQ"
|
id="FlowRated"
|
name="FlowRated"
|
size="1"
|
/>
|
<select
|
id="FlowRatedUnit"
|
name="FlowRatedUnit"
|
size="1"
|
class="c-input-select-combo--right"
|
v-model="state.formData.DpQu"
|
@change="handleDpQuSelect"
|
>
|
<option :value="item.value" :id="index" v-for="(item, index) in state.q_unit_list" :key="item.value">
|
{{ item.label }}
|
</option>
|
</select>
|
<label v-if="state.ruleDpQ" style="position: absolute; bottom: -2px; font-size: 10px; color: red"
|
>*{{ t('selectPage.flowRule.TR') }}</label>
|
</div>
|
</div>
|
<!-- 扬程输入 -->
|
<div class="columns">
|
<label class="c-form-label" for="HeadRated">{{ t('selectPage.head.TR') }}</label>
|
<div class="o-input-select-combo" style="position: relative">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
autofocus="autofocus"
|
id="HeadRated"
|
name="HeadRated"
|
v-model="state.formData.DpH"
|
@input="handleInputDpH"
|
size="1"
|
/>
|
<select
|
id="HeadRatedUnit"
|
name="FlowRatedUnit"
|
v-model="state.formData.DpHu"
|
@change="handleDpHuSelect"
|
size="1"
|
class="c-input-select-combo--right u-no-margin"
|
>
|
<option :value="item.value" :id="index" v-for="(item, index) in state.h_unit_list" :key="item.value">
|
{{ item.label }}
|
</option>
|
</select>
|
<label v-if="state.ruleDpH" style="position: absolute; bottom: -18px; font-size: 10px; color: red">
|
*{{ t('selectPage.headRule.TR') }}
|
</label>
|
</div>
|
</div>
|
</div>
|
<div class="row">
|
<!-- 应用运行配置文件 -->
|
<div class="columns">
|
<label class="c-form-label" for="trueWeightedEfficiencyProfile">{{ t('selectPage.driveType.TR') }}</label>
|
<select
|
class="u-no-margin"
|
id="loadProfileNameCOS"
|
name="loadProfileNameCOS"
|
v-model="state.formData.driveType"
|
@change="changeDriveType"
|
>
|
<option
|
v-for="item in state.driveTypeList"
|
:key="item.Value"
|
:value="item.Value"
|
:disabled="!item.Enable"
|
>
|
{{ item.Text }}
|
</option>
|
</select>
|
<p style="text-align: left">
|
<a @click="state.isShowMoreDesignPoint = !state.isShowMoreDesignPoint">
|
<span class="right u-pointer u-no-wrap">
|
{{ state.isShowMoreDesignPoint ? t('selectPage.hide.TR') : t('selectPage.moreDesignPoints.TR') }}
|
<span
|
:class="
|
state.isShowMoreDesignPoint ? 'fa fa-fw fa-angle-double-down' : 'fa fa-fw fa-angle-double-right'
|
"
|
></span>
|
</span>
|
</a>
|
</p>
|
</div>
|
<!-- 设置频率 -->
|
<div class="columns" v-if="state.formData.driveType != 3">
|
<label for="cos_cycle">{{ t('selectPage.setFrequency.TR') }}</label>
|
<div class="row align-middle">
|
<div class="columns" style="padding-left: 0px">
|
<select
|
id="Frequency"
|
name="Frequency"
|
size="1"
|
class="tableInputField"
|
v-model="state.formData.motorFrequence"
|
@change="handldHzSelect"
|
:disabled="state.formData.driveType == 3"
|
>
|
<option v-for="item in state.m_frequenceList" :key="item.Value" :value="item.Value" :id="item.Value">
|
{{ item.Text }}
|
</option>
|
</select>
|
</div>
|
<div class="shrink columns" style="margin-bottom: 20px"></div>
|
</div>
|
</div>
|
<!-- 设置柴油机转速 -->
|
<div class="columns" v-if="state.formData.driveType == 3">
|
<label for="cos_cycle">{{ t('selectPage.dieselEngineSpeed.TR') }}</label>
|
<div class="row align-middle" style="position: relative">
|
<div class="columns" style="padding-left: 0px">
|
<input
|
class="c-input-select-combo--left"
|
type="tel"
|
autofocus="autofocus"
|
v-model="state.formData.dieselSpeed"
|
/>
|
<!-- 柴油机转速设置 -->
|
<!-- <label v-if="ruleDieselSpeed"
|
style=" position: absolute; font-size: 10px; color: red; ">
|
*{{
|
t("selectPage.dieselEngineSpeedRule.TR")
|
}}
|
</label> -->
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 第二设计点 -->
|
<div class="row" v-if="state.isShowMoreDesignPoint">
|
<!-- 流量输入 -->
|
<div class="columns">
|
<label class="c-form-label" for="FlowRated2">{{ state.m_secondDpFlowText }}</label>
|
<div class="o-input-select-combo js-ui-flowRated">
|
<input
|
class="c-input-select-combo--left"
|
type="number"
|
autofocus="autofocus"
|
v-model="state.formData.DpQTwo"
|
id="FlowRated2"
|
name="FlowRated2"
|
size="1"
|
/>
|
</div>
|
</div>
|
<!-- 扬程输入 -->
|
<div class="columns">
|
<label class="c-form-label" for="HeadRated2">{{ state.m_secondDpHeadText }}</label>
|
<div class="o-input-select-combo">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
autofocus="autofocus"
|
id="HeadRated2"
|
name="HeadRated2"
|
v-model="state.formData.DpHTwo"
|
size="1"
|
/>
|
</div>
|
</div>
|
</div>
|
<!-- 第三设计点 -->
|
<div class="row" v-if="state.isShowMoreDesignPoint">
|
<!-- 流量输入 -->
|
<div class="columns">
|
<label class="c-form-label" for="FlowRated3">{{ state.m_thirdDpFlowText }}</label>
|
<div class="o-input-select-combo js-ui-flowRated">
|
<input
|
class="c-input-select-combo--left"
|
type="number"
|
autofocus="autofocus"
|
v-model="state.formData.DpQThree"
|
id="FlowRated3"
|
name="FlowRated3"
|
size="1"
|
/>
|
</div>
|
</div>
|
<!-- 扬程输入 -->
|
<div class="columns">
|
<label class="c-form-label" for="HeadRated3">{{ state.m_thirdDpHeadText }}</label>
|
<div class="o-input-select-combo">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
autofocus="autofocus"
|
id="HeadRated3"
|
name="HeadRated3"
|
v-model="state.formData.DpHThree"
|
size="1"
|
/>
|
</div>
|
</div>
|
</div>
|
<div class="row align-middle" v-if="state.isShowFirePumpType">
|
<div class="columns">
|
<label class="c-form-label" for="firePumpTypeComb">{{ t('selectPage.firePump.TR') }}</label>
|
<div>
|
<select
|
id="firePumpTypeComb"
|
name="firePumpTypeComb"
|
class="tableInputField"
|
v-model="state.formData.firePumpType"
|
@change="changeFirePumpType"
|
>
|
<option
|
v-for="item in state.firePumpTypeList"
|
:key="item.Value"
|
:disabled="!item.Enable"
|
:value="item.Value"
|
:id="item.Value"
|
>
|
{{ item.Text }}
|
</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<!-- 转速条件 -->
|
<div class="row align-middle">
|
<div class="columns" v-if="state.formData.driveType != 3">
|
<label class="c-form-label" for="motorPoleNumComb">{{ t('selectPage.motorPoleNum.TR') }}</label>
|
<div>
|
<select
|
id="motorPoleNumComb"
|
name="motorPoleNumComb"
|
class="tableInputField"
|
v-model="state.formData.motorPoleNum"
|
@change="changeMotorPoleNum"
|
>
|
<option v-for="item in state.MotorPoleList" :key="item.Value" :value="item.Value" :id="item.Value">
|
{{ item.Text }}
|
</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<!-- 电机功率 -->
|
<div class="row align-middle">
|
<div class="columns" v-if="state.formData.driveType != 3">
|
<label class="c-form-label" for="FlowRated3">{{ t('detailPage.motorPower.TR') }}(kw)</label>
|
<div class="o-input-select-combo js-ui-flowRated">
|
<input
|
class="c-input-select-combo--left"
|
type="number"
|
autofocus="autofocus"
|
v-model="state.formData.motorPower"
|
id="motorPowerComb"
|
name="motorPowerComb"
|
size="1"
|
/>
|
</div>
|
</div>
|
<div class="columns">
|
<label class="c-form-label" for="NPSHa">NPSHa</label>
|
<div class="o-input-select-combo js-ui-flowRated">
|
<input
|
class="c-input-select-combo--left"
|
type="number"
|
autofocus="autofocus"
|
size="1"
|
id="NPSHaComb"
|
name="NPSHaComb"
|
v-model="state.formData.NPSHa"
|
/>
|
</div>
|
</div>
|
</div>
|
<!-- 显示隐藏更多设置 -->
|
<p class="lead text-center">
|
<a class="js-cos-expand__more" @click="toggleShowMoreSetting" :class="state.isShowMoreSetting ? 'hide' : ''">
|
<i class="iconfont iconFontAwesomepluscircle"></i>
|
{{ t('selectPage.moreSet.TR') }}
|
</a>
|
<a class="js-cos-expand__less" @click="toggleShowMoreSetting" :class="state.isShowMoreSetting ? '' : 'hide'">
|
<i class="iconfont iconFontAwesomeminuscircle"></i>
|
{{ t('selectPage.put.TR') }}
|
</a>
|
</p>
|
<div class="js-cos-expand" v-show="state.isShowMoreSetting">
|
<!-- 电气标准 -->
|
<div class="row">
|
<div class="columns">
|
<label for="electricalStandard">{{ t('selectPage.motorPowerStd.TR') }}</label>
|
<select
|
id="electricalStandard"
|
v-model="state.formData.motorStd"
|
@change="changeMotorStd"
|
name="electricalStandard"
|
>
|
<option
|
v-for="item in state.m_motorStdList"
|
:key="item.Value"
|
:value="item.Value"
|
:id="item.Value"
|
:disabled="!item.Enable"
|
>
|
{{ item.Text }}
|
</option>
|
</select>
|
</div>
|
<div class="columns">
|
<label for="MinEta">{{ t('selectPage.e_requirements.TR') }}</label>
|
<input
|
v-model="state.formData.MinEta"
|
size="6"
|
type="number"
|
class="tableInputField"
|
:min="0"
|
:max="100"
|
@change="changeMinEta"
|
/>
|
</div>
|
</div>
|
<hr />
|
<!-- 介质名称 -->
|
<div class="row">
|
<!-- 可编辑的介质名称 -->
|
<div v-if="!state.isDiyJieZhi" class="columns" style="position: relative">
|
<label class="c-form-label" for="LiquidType">{{ t('selectPage.mediaName.TR') }}</label>
|
<input
|
v-model="state.formData.jzName"
|
size="6"
|
type="text"
|
class="tableInputField"
|
@change="handleJzName"
|
/>
|
</div>
|
<!-- 可输入可下拉选择的介质名称 -->
|
<div v-else class="columns jz-select-div" style="position: relative">
|
<label class="c-form-label" for="LiquidType">{{ t('selectPage.mediaName.TR') }}</label>
|
<el-popover
|
v-model="state.isShowJieZhiPopover"
|
placement="bottom"
|
width="400"
|
trigger="click"
|
popper-class="jiezhipopoverstyle"
|
:offset="0"
|
:popper-options="{
|
boundariesElement: 'viewport',
|
removeOnDestroy: true,
|
}"
|
>
|
<el-tree
|
:data="state.m_JieZhiTreeData"
|
:props="state.defaultProps"
|
highlight-current
|
@node-click="handleJieZhiNodeClick"
|
style="max-height: 180px; overflow: auto"
|
></el-tree>
|
<template #reference>
|
<div class="w100" style="position: relative">
|
<el-input v-model="state.formData.jzName">
|
<template #suffix>
|
<i class="el-input__icon el-icon-caret-bottom"></i>
|
</template>
|
</el-input>
|
<el-icon style="position: absolute; right: 20px; top: 12px">
|
<ArrowDownBold />
|
</el-icon>
|
</div>
|
</template>
|
</el-popover>
|
</div>
|
</div>
|
<div id="liquidCalloutDiv" class="callout grey js-liquid-properties-override">
|
<div class="row align-top">
|
<div class="shrink columns">
|
<div class="switch tiny">
|
<input
|
@change="changeJieZhiInputMehtod(isDiyJieZhi)"
|
v-model="state.isDiyJieZhi"
|
type="checkbox"
|
name="overrideLiquidProperties"
|
id="overrideLiquidProperties"
|
class="switch-input"
|
/>
|
<label for="overrideLiquidProperties" class="switch-paddle"></label>
|
</div>
|
</div>
|
<div class="columns u-no-padding shrink">
|
<label v-if="!state.isDiyJieZhi" for="overrideLiquidProperties">{{
|
t('selectPage.customMediaProp.TR')
|
}}</label>
|
<label v-else for="overrideLiquidProperties">
|
{{ t('selectPage.mediaLibrary.TR') }}
|
</label>
|
</div>
|
</div>
|
<div class="row">
|
<!-- 体积浓度 -->
|
<div class="columns">
|
<label class="c-form-label" for="VolumeConcentration">
|
{{ t('selectPage.volumeConcentration.TR') }}</label
|
>
|
<div class="o-input-select-combo">
|
<input
|
placeholder=""
|
v-model="state.formData.volumeConcentration"
|
@blur="handleVolumeConcentration"
|
oninput="value=value.replace(/[^0-9.]/g,'')"
|
size="6"
|
id="VolumeConcentration"
|
name="VolumeConcentration"
|
type="number"
|
class="c-input-select-combo--left"
|
/>
|
<select id="VolumeConcentration" size="1" disabled="true" class="c-input-select-combo--right">
|
<option selected value="8" id="8">%</option>
|
</select>
|
</div>
|
</div>
|
<!-- 温度 -->
|
<div class="columns">
|
<label class="c-form-label" for="TemperatureMax">{{ t('selectPage.maxTemperature.TR') }}</label>
|
<div class="o-input-select-combo">
|
<input
|
placeholder=""
|
v-model="state.formData.jzTemperature"
|
@blur="handleTemperature"
|
size="6"
|
id="TemperatureMax"
|
name="TemperatureMax"
|
type="text"
|
class="c-input-select-combo--left"
|
/>
|
<select id="TemperatureMaxUnit" size="1" class="c-input-select-combo--right">
|
<option selected value="8" id="8">℃</option>
|
<option value="22" id="22">°F</option>
|
<option value="139" id="139">°Ré</option>
|
<option value="50" id="50">K</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<div class="row">
|
<!-- 密度 -->
|
<div class="columns">
|
<label class="c-form-label" for="SGMax">{{ t('selectPage.maxDensity.TR') }}</label>
|
<div class="o-input-select-combo">
|
<input
|
v-model="state.formData.calcDensity"
|
size="6"
|
name="SGMax"
|
id="SGMax"
|
type="text"
|
class="c-input-select-combo--left"
|
/>
|
<select
|
name="FluidDensityUnit"
|
id="constFluidDensityUnit"
|
v-model="state.formData.miduUnit"
|
class="c-input-select-combo--right"
|
size="1"
|
>
|
<option v-for="item in state.MiDuOptionList" :value="item.value" :id="item.value" :key="item.vlaue">
|
{{ item.label }}
|
</option>
|
</select>
|
</div>
|
</div>
|
<!-- 粘度 -->
|
<div class="columns">
|
<label class="c-form-label" for="ViscosityRated">{{ t('selectPage.mediumViscosity.TR') }}</label>
|
<div class="o-input-select-combo">
|
<input
|
v-model="state.formData.calcViscosity"
|
size="6"
|
name="ViscosityRated"
|
id="ViscosityRated"
|
type="text"
|
class="c-input-select-combo--left"
|
/>
|
<select
|
name="ViscosityRatedUnit"
|
v-model="state.NianDuUnit"
|
id="ViscosityRatedUnit"
|
class="c-input-select-combo--right"
|
size="1"
|
>
|
<option
|
v-for="item in state.NianDuOptionList"
|
:value="item.value"
|
:id="item.value"
|
:key="item.value"
|
>
|
{{ item.label }}
|
</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<div class="row" style="position: relative">
|
<!-- 介质说明 -->
|
<div class="columns">
|
<label class="c-form-label" for="jzDesc"> {{ t('selectPage.mediaDescription.TR') }}</label>
|
<div class="o-input-select-combo">
|
<input
|
placeholder=""
|
type="text"
|
v-model="state.formData.jzDesc"
|
size="6"
|
id="jzDesc"
|
name="jzDesc"
|
class="c-input-select-combo--left"
|
/>
|
</div>
|
</div>
|
<!-- 是否含有介质颗粒 -->
|
<div class="columns" style="position: absolute; right: 0">
|
<label class="c-form-label" for="TemperatureMax"></label>
|
<div class="o-input-select-combo">
|
<el-checkbox v-model="state.formData.hasMediaParticles" />
|
<span> {{ t('selectPage.isMediumParticles.TR') }}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<!-- 检验容差标准 -->
|
<div class="row align-middle">
|
<div class="columns">
|
<label class="c-form-label" for="toleranceStandard">{{ t('selectPage.toleranceStand.TR') }}</label>
|
<div>
|
<select
|
id="toleranceStandard"
|
name="toleranceStandard"
|
class="tableInputField"
|
v-model="state.formData.ToleranceStand"
|
@change="changeToleranceStand"
|
>
|
<option
|
v-for="item in state.m_toleranceStandardList"
|
:key="item.value"
|
:disabled="item.disable"
|
:value="item.value"
|
:id="item.value"
|
>
|
{{ item.text }}
|
</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<!-- 检验容差等级 -->
|
<div class="row align-middle">
|
<div class="columns">
|
<label class="c-form-label" for="toleranceGrade">{{ t('selectPage.toleranceGrade.TR') }}</label>
|
<div>
|
<select
|
id="toleranceGrade"
|
name="toleranceGrade"
|
class="tableInputField"
|
v-model="state.formData.PointTolerance.ToleranceGrade"
|
@change="changeToleranceGrade"
|
>
|
<option
|
v-for="item in state.m_toleranceGradeList"
|
:key="item.value"
|
:value="item.value"
|
:id="item.value"
|
>
|
{{ item.text }}
|
</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
<div class="row">
|
<!-- 最小流量百分比 -->
|
<div class="columns" style="margin-bottom: 16px">
|
<label for="cos_cycle">{{ t('selectPage.MinFlowPercentage.TR') }}</label>
|
<div class="row align-middle">
|
<div class="columns" style="padding-left: 0px">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
autofocus="autofocus"
|
id="RatioMinQ"
|
name="RatioMinQ"
|
:disabled="!state.isToleranceLevelCustom"
|
v-model="state.formData.PointTolerance.RatioMinQ"
|
size="1"
|
/>
|
</div>
|
<div class="shrink columns">
|
<label>%</label>
|
</div>
|
</div>
|
</div>
|
<!-- 最大流量百分比 -->
|
<div class="columns" style="margin-bottom: 16px">
|
<label for="cos_cycle">{{ t('selectPage.MaxFlowPercentage.TR') }}</label>
|
<div class="row align-middle">
|
<div class="columns" style="padding-left: 0px">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
:disabled="!state.isToleranceLevelCustom"
|
autofocus="autofocus"
|
id="RatioMaxQ"
|
name="RatioMaxQ"
|
v-model="state.formData.PointTolerance.RatioMaxQ"
|
size="1"
|
/>
|
</div>
|
<div class="shrink columns">
|
<label>%</label>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="row">
|
<!-- 最小扬程百分比 -->
|
<div class="columns" style="margin-bottom: 16px">
|
<label for="cos_cycle">{{ t('selectPage.MinHeadPercentage.TR') }}</label>
|
<div class="row align-middle">
|
<div class="columns" style="padding-left: 0px">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
autofocus="autofocus"
|
id="RatioMinH"
|
:disabled="!state.isToleranceLevelCustom"
|
name="RatioMinH"
|
v-model="state.formData.PointTolerance.RatioMinH"
|
size="1"
|
/>
|
</div>
|
<div class="shrink columns">
|
<label>%</label>
|
</div>
|
</div>
|
</div>
|
<!-- 最大扬程百分比 -->
|
<div class="columns" style="margin-bottom: 16px">
|
<label for="cos_cycle">{{ t('selectPage.MaxHeadPercentage.TR') }}</label>
|
<div class="row align-middle">
|
<div class="columns" style="padding-left: 0px">
|
<input
|
class="c-input-select-combo--left u-no-margin"
|
type="number"
|
:disabled="!state.isToleranceLevelCustom"
|
autofocus="autofocus"
|
id="RatioMaxH"
|
name="RatioMaxH"
|
v-model="state.formData.PointTolerance.RatioMaxH"
|
size="1"
|
/>
|
</div>
|
<div class="shrink columns">
|
<label>%</label>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="row align-middle">
|
<div class="columns">
|
<el-checkbox v-model="state.formData.IsAllowCut"
|
><span style="font-size: 16px">{{ t('selectPage.allowCutting.TR') }}</span></el-checkbox
|
>
|
</div>
|
<div class="columns">
|
<el-checkbox v-model="state.formData.IsAllowFrequence"
|
><span style="font-size: 16px">{{ t('selectPage.allowFrequencyConversion.TR') }}</span></el-checkbox
|
>
|
</div>
|
</div>
|
</div>
|
<div v-if="!state.isShowMoreSetting" style="display: flex; justify-content: center; align-items: center;">
|
<a class="button" id="searchButton" @click.stop="nextPage">
|
{{ t('selectPage.nextStep.TR') }}
|
<span class="iconfont icona-AngleDoubleRight"></span>
|
</a>
|
</div>
|
</div>
|
<!-- <div v-if="!isShowMoreSetting"
|
@click.stop="nextPage">
|
<a class="button" id="searchButton">
|
{{ t("selectPage.nextStep.TR") }}
|
<span class="iconfont icona-AngleDoubleRight"></span>
|
</a>
|
</div> -->
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="small-12 large-6 columns" style="height: 100%">
|
<div style="height: 100%">
|
<div class="sticky-container" style="height: 64px">
|
<div
|
style="width: 100%; max-width: 570px; margin-top: 0px; top: 0px; bottom: auto"
|
class="sticky is-anchored is-at-top"
|
>
|
<div class="row align-justify">
|
<div class="columns">
|
<h2 class="cos-header" style="font-size: 40px; text-align: left; color: #3b3b3b">
|
{{ t('selectPage.productSeries.TR') }}
|
</h2>
|
</div>
|
<div class="columns text-right hide-for-small-only flex">
|
<div class="menu" v-if="state.isShowMoreSetting" @click.stop="nextPage">
|
<a class="button" id="searchButton">
|
{{ t('selectPage.nextStep.TR') }}
|
<span class="iconfont icona-AngleDoubleRight"></span>
|
</a>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
<div class="c-card" id="productLines" style="height: calc(100% - 65px); position: relative">
|
<selPumpSeries v-if="state.m_selPumpSeriesCtrlType" ref="pumpSeriesCtrl"></selPumpSeries>
|
<selPumpCatalog v-if="!state.m_selPumpSeriesCtrlType" ref="pumpCatalogCtrl"></selPumpCatalog>
|
</div>
|
</div>
|
</div>
|
</div>
|
</form>
|
</el-main>
|
</el-container>
|
</div>
|
</template>
|
<script setup name="selParasDefault">
|
import { onMounted, ref, reactive } from 'vue';
|
import { ElMessage, ElContainer, ElMain, ElAside, ElPopover, ElTree, ElInput } from 'element-plus';
|
import UnitHelper from '@/utils/unit.js';
|
import ConstParas from '@/utils/constParas.js';
|
import selPumpSeries from './selPumpSeries.vue';
|
import selPumpCatalog from './selPumpCatalog.vue';
|
|
import { GetParaPageInfo, GetLibrary4XPump, CalcJieZhiInfo } from '@/api/select';
|
import languageHelper from '@/utils/languageHelper.js';
|
import { initialSeriesApplication } from '@/hooks/useSeriesApplication';
|
import { useRoute, useRouter } from 'vue-router';
|
import { useSelect } from '@/stores/select';
|
import { useI18n } from 'vue-i18n';
|
|
const route = useRoute();
|
const router = useRouter();
|
const { t } = useI18n();
|
|
const selectStore = useSelect();
|
const m_currentLanguage = 0;
|
|
const pumpSeriesCtrl = ref();
|
const pumpCatalogCtrl = ref();
|
let state = reactive({
|
m_userType: 0,
|
m_Token: '',
|
|
m_selPumpSeriesCtrlType: true, // 表示选择类型控件
|
m_isSelectAllSeries: false, //是否全选
|
|
isShowFirePumpType: true, //是否显示消防泵类型
|
isShowMoreDesignPoint: false, //是否显示更多设计点
|
isShowMoreSetting: false, //显示更多设置
|
isShowLoadingFrm: true, //显示加载动画
|
isShowJieZhiPopover: false, //显示介质选择
|
MotorPoleList: [
|
//转速等级下拉框 仅驱动为电机时候使用
|
{ Value: '', Text: '不限' },
|
{ Value: '2', Text: '2p' },
|
{ Value: '4', Text: '4p' },
|
{ Value: '6', Text: '6p' },
|
{ Value: '8', Text: '8p' },
|
{ Value: '10', Text: '10p' },
|
{ Value: '12', Text: '12p' },
|
],
|
NianDuUnit: 0,
|
NianDuOptionList: UnitHelper.NianDu_Value_List,
|
|
MiDuOptionList: UnitHelper.MiDu_Value_List,
|
q_unit_list: UnitHelper.Q_Value_List,
|
h_unit_list: UnitHelper.H_Value_List,
|
|
m_toleranceStandardList: [], //检验容差标准下拉框数据
|
m_toleranceGradeList: [], //检验容差等级下拉框数据
|
|
m_motorStdList: [], //电机功率标准下拉框
|
driveTypeList: [], //驱动类型 下拉选择
|
firePumpTypeList: [], //消防泵类型下拉
|
m_frequenceList: [
|
{ Value: 50, Text: '50 HZ' },
|
{ Value: 60, Text: '60 HZ' },
|
], //频率下拉
|
|
isDiyJieZhi: false, //是否自定义介质属性
|
|
m_secondDpFlowText: '', //第二设计点流量显示的文字
|
m_secondDpHeadText: '', //第二设计点扬程的文字
|
m_thirdDpFlowText: '', //第三设计点流量显示的文字
|
|
formData: {
|
//表单数据
|
DpQ: '', //流量
|
DpQu: 1, //流量单位
|
DpH: '', //扬程
|
DpHu: 0, //扬程单位
|
DpQTwo: '', //第二流量设计点
|
DpHTwo: '', //第二扬程设计点
|
DpQThree: '', //第三流量设计点
|
DpHThree: '', //第三扬程设计点
|
|
motorFrequence: 50, //频率
|
motorPower: '', //电机功率
|
motorPoleNum: 'null', //电机级数
|
dieselSpeed: '', //柴油机转速
|
jzID: '1', //当前选中的介质ID
|
jzName: t('selectPage.cleanWater.TR'),
|
jzTemperature: '20.0', //温度
|
calcDensity: 1000, //密度
|
miduUnit: 0, //密度单位
|
calcViscosity: 1, //粘度
|
volumeConcentration: 100, //体积浓度
|
jzDesc: '', //介质说明
|
hasMediaParticles: false, //是否有介质颗粒
|
driveType: 0, //驱动类型 0电机 3柴油机
|
MinEta: '', //效率要求
|
firePumpType: 0, //消防泵类型
|
NPSHa: '', //气蚀
|
IsAllowCut: true, //是否允许切割
|
IsAllowFrequence: true, //是否允许变频
|
|
motorStd: 0, //电机标准
|
ToleranceStand: 1, //校验容差标准ID
|
PointTolerance: {
|
ToleranceGrade: '',
|
RatioMinQ: '',
|
RatioMaxQ: '',
|
RatioMinH: '',
|
RatioMaxH: '',
|
},
|
|
isVisCorrect: false, //是否修正粘度 默认false
|
},
|
ruleDpQ: false, //判断是否输入了流量
|
ruleDpH: false, //判断是否输入了扬程
|
ruleDieselSpeed: false,
|
ruleMotorPoleNum: false, //判断是否选择了电机极数
|
isToleranceLevelCustom: false,
|
pointToleranceConfig: window.pointToleranceConfig, //容差配置
|
m_JieZhiCalaStatus: 0, //当前介质计算状态，为1时且当前选择的是介质库则根据温度和体积浓度计算密度和粘度
|
m_JieZhiTreeData: [],
|
defaultProps: {
|
children: 'children',
|
label: 'label',
|
},
|
});
|
onMounted(() => {
|
|
translateUI();
|
//初始化配置
|
initConfig();
|
//初始化页面数据
|
//this.$nextTick(() => {});
|
initialSeriesApplication()
|
.then((res) => {
|
let result = res.data;
|
initialPageData(result);
|
})
|
.catch((err) => {});
|
});
|
//初始化页面数据
|
const initialPageData = async (seriesApplicationData) => {
|
GetParaPageInfo().then(async (res) => {
|
state.isShowLoadingFrm = false;
|
document.title = `${t('indexPage.intelligentSelection.TR')}`;
|
let result = res.data;
|
if (result.Code != 0) {
|
ElMessage.error(result.Message);
|
return;
|
}
|
if (result.Data.DriveTypeList) {
|
state.formData.driveType = result.Data.DriveTypeList[0].Value;
|
state.driveTypeList = result.Data.DriveTypeList;
|
}
|
if (result.Data.FireTypeList) {
|
state.formData.firePumpType = result.Data.FireTypeList[0].Value;
|
state.firePumpTypeList = result.Data.FireTypeList;
|
}
|
if (result.Data.MotorStdList) {
|
state.formData.motorStd = result.Data.MotorStdList[0].Value;
|
state.m_motorStdList = result.Data.MotorStdList;
|
}
|
|
if (result.Data.CatalogList && result.Data.SeriesList) {
|
var allCatalogList = result.Data.CatalogList;
|
var allSeriesList = result.Data.SeriesList;
|
getSelectSeriesCtrl().initData(allCatalogList, allSeriesList, m_currentLanguage, seriesApplicationData);
|
}
|
let JieZhi = await initJieZhi();
|
let treeData = buildJieZhiTreeData(JieZhi);
|
state.m_JieZhiTreeData = treeData;
|
|
//设置默认配置
|
setDefaultValue();
|
//设置容差标准
|
initalToleranceStandard();
|
//从历史表单中初始化
|
initDataFromHistory();
|
|
//传入类型列表 系列列表 驱动类型 电机频率
|
getSelectSeriesCtrl().filterSeriseList(state.formData.driveType, state.formData.motorFrequence, state.formData.firePumpType);
|
}).catch((err) => {
|
console.log(err, 849);
|
state.isShowLoadingFrm = false;
|
//console.log("请求失败:" + err);
|
});
|
};
|
// 获取介质库
|
const initJieZhi = () => {
|
return new Promise((resolve, reject) => {
|
GetLibrary4XPump().then((res) => {
|
let result = res.data;
|
if (result.Code != 0) {
|
ElMessage.error(result.Message);
|
resolve(null);
|
} else {
|
resolve(result.Data);
|
}
|
}).catch((err) => {
|
reject(err);
|
});
|
});
|
};
|
// 计算介质
|
const calcJieZhi = () => {
|
CalcJieZhiInfo({
|
JieZhiID: state.formData.jzID,
|
Wendu: state.formData.jzTemperature,
|
Nongdu: state.formData.volumeConcentration,
|
})
|
.then((res) => {
|
let result = res.data;
|
if (result.Code != 0) {
|
ElMessage.error(result.Message);
|
return;
|
} else {
|
state.formData.calcViscosity = result.Data.Midu;
|
state.formData.calcDensity = result.Data.Niandu;
|
}
|
})
|
.catch((err) => {
|
console.log(err, 849);
|
});
|
};
|
|
const buildJieZhiTreeData = (data) => {
|
if (!Array.isArray(data)) {
|
return [];
|
}
|
let treeData = [];
|
data.forEach((item) => {
|
let node = {
|
label: item.Name,
|
children: [],
|
};
|
if (item.Items && item.Items.length > 0) {
|
item.Items.forEach((child_node) => {
|
let treenode = {
|
label: child_node.Name,
|
option: child_node,
|
};
|
node.children.push(treenode);
|
});
|
}
|
treeData.push(node);
|
});
|
return treeData;
|
};
|
//初始化配置
|
const initConfig = () => {
|
let pageConfig = window.pageConfig;
|
const SelParasPage = pageConfig.SelParasPage;
|
var selectSeriesMethod = SelParasPage.SelectSeriesMethod;
|
if (selectSeriesMethod == 'bySeries') state.m_selPumpSeriesCtrlType = true;
|
else state.m_selPumpSeriesCtrlType = false;
|
|
state.isShowFirePumpType = SelParasPage.HasFirePump ?? true;
|
|
//初始化单位 --- 从用户设置中读取
|
state.formData.DpQu = 1;
|
state.formData.DpHu = 0;
|
};
|
//设置默认变量
|
const setDefaultValue = () => {
|
//是否有电气标准过滤
|
var pageConfig = window.pageConfig;
|
if (pageConfig.SelParasPage == null) {
|
return;
|
}
|
|
if (pageConfig.SelParasPage.defaultElectricalStandard) {
|
if (m_currentLanguage == 0) {
|
state.formData.motorStd = pageConfig.SelParasPage.defaultElectricalStandard.CN;
|
} else {
|
state.formData.motorStd = pageConfig.SelParasPage.defaultElectricalStandard.EN;
|
}
|
}
|
if (pageConfig.SelParasPage.defaultNianDuUnit) {
|
if (m_currentLanguage == 0) {
|
state.NianDuUnit = pageConfig.SelParasPage.defaultNianDuUnit.CN;
|
} else {
|
state.formData.motorStd = state.NianDuUnit = pageConfig.SelParasPage.defaultNianDuUnit.EN;
|
}
|
}
|
|
if (pageConfig.SelParasPage.defaultMotorFrequence) {
|
// console.log(this.m_currentLanguage,1110)
|
if (m_currentLanguage == 0) {
|
if (pageConfig.SelParasPage.defaultMotorFrequence.CN) {
|
state.formData.motorFrequence = pageConfig.SelParasPage.defaultMotorFrequence.CN;
|
}
|
} else if (m_currentLanguage == 2) {
|
if (pageConfig.SelParasPage.defaultMotorFrequence.EN) {
|
state.formData.motorFrequence = pageConfig.SelParasPage.defaultMotorFrequence.EN;
|
}
|
} else if (m_currentLanguage == 6) {
|
if (pageConfig.SelParasPage.defaultMotorFrequence.KO) {
|
state.formData.motorFrequence = pageConfig.SelParasPage.defaultMotorFrequence.KO;
|
}
|
} else if (m_currentLanguage == 5) {
|
if (pageConfig.SelParasPage.defaultMotorFrequence.RU) {
|
state.formData.motorFrequence = pageConfig.SelParasPage.defaultMotorFrequence.RU;
|
}
|
} else {
|
if (pageConfig.SelParasPage.defaultMotorFrequence.EN) {
|
state.formData.motorFrequence = pageConfig.SelParasPage.defaultMotorFrequence.EN;
|
}
|
}
|
}
|
};
|
//
|
const getSelectSeriesCtrl = () => {
|
if (state.m_selPumpSeriesCtrlType) {
|
return pumpSeriesCtrl.value;
|
} else {
|
return pumpCatalogCtrl.value;
|
}
|
};
|
//设置容差标准标准
|
const initalToleranceStandard = () => {
|
let currentLangName = 'CN';
|
let allStandardList = state.pointToleranceConfig.Standard4PumpSelectList;
|
let toleranceStandardList = [];
|
allStandardList.forEach((item) => {
|
let standColumn = { disable: false };
|
standColumn.text = item.Name;
|
standColumn.value = item.Value;
|
toleranceStandardList.push(standColumn);
|
});
|
state.m_toleranceStandardList = toleranceStandardList;
|
|
let defauleValueObj = state.pointToleranceConfig.DefaultValue;
|
|
let currentDefauleValue = null;
|
|
Object.keys(defauleValueObj).forEach((item) => {
|
if (item == currentLangName) {
|
currentDefauleValue = defauleValueObj[item];
|
}
|
});
|
if (currentDefauleValue == null) currentDefauleValue = defauleValueObj[currentLangName];
|
// 初始化容差等级列表
|
initialTolerantGrandList(currentDefauleValue.Standard, currentDefauleValue.ToleranceGrade);
|
};
|
|
//获取上次的表单填写记录
|
const initDataFromHistory = () => {
|
//获取上次的表单填写记录
|
let historyFormData = selectStore.ByParas.selectParas;
|
if (historyFormData == null) {
|
return;
|
}
|
if (historyFormData.DesignInfo == null) {
|
return;
|
}
|
if (historyFormData.FilterInfo == null) {
|
return;
|
}
|
|
state.formData.DpQ = historyFormData.DesignInfo.DpQ || state.formData.DpQ;
|
state.formData.DpQu = historyFormData.DesignInfo.UnitQ;
|
state.formData.DpH = historyFormData.DesignInfo.DpH || state.formData.DpH;
|
state.formData.DpHu = historyFormData.DesignInfo.UnitH;
|
state.formData.jzTemperature = historyFormData.FilterInfo.Temperature || 20;
|
|
if (historyFormData.FilterInfo.MotorFrequence) state.formData.motorFrequence = historyFormData.FilterInfo.MotorFrequence;
|
|
var firePumpType = historyFormData.FilterInfo.FirePumpType;
|
if (firePumpType == '2' || firePumpType == 2) {
|
firePumpType = '2';
|
} else if (firePumpType == '1' || firePumpType == 1) {
|
firePumpType = 1;
|
} else {
|
firePumpType = 0;
|
}
|
state.formData.firePumpType = firePumpType;
|
|
//历史介质参数
|
let jiezhiParas = historyFormData.JieZhi;
|
state.isDiyJieZhi = jiezhiParas.IsCustom ?? false;
|
state.formData.jzTemperature = historyFormData.FilterInfo.Temperature;
|
state.formData.volumeConcentration = jiezhiParas.V_C;
|
state.formData.jzID = jiezhiParas.ID;
|
state.formData.jzName = jiezhiParas.Name;
|
state.formData.miduUnit = jiezhiParas.MiDuUnit ?? state.formData.miduUnit;
|
state.NianDuUnit = jiezhiParas.NianDuUnit ?? state.NianDuUnit;
|
|
if (state.formData.miduUnit !== 0) {
|
jiezhiParas.CalcDensity = jiezhiParas.CalcDensity / 1000;
|
}
|
if (state.NianDuUnit == 1) {
|
jiezhiParas.CalcViscosity = jiezhiParas.CalcViscosity / 100;
|
}
|
if (state.NianDuUnit == 5) {
|
let temp = jiezhiParas.CalcDensity;
|
if (state.formData.miduUnit !== 0) temp * 1000;
|
jiezhiParas.CalcViscosity = jiezhiParas.CalcViscosity / temp;
|
}
|
state.formData.calcDensity = jiezhiParas.CalcDensity;
|
state.formData.calcViscosity = jiezhiParas.CalcViscosity;
|
|
state.formData.motorPoleNum = historyFormData.FilterInfo.MotorPoleNum;
|
state.formData.motorPower = historyFormData.FilterInfo.MotorPower;
|
state.formData.NPSHa = historyFormData.FilterInfo.NPSHa;
|
state.formData.MinEta = historyFormData.FilterInfo.MinEta;
|
state.formData.dieselSpeed = historyFormData.FilterInfo.DieselSpeed;
|
state.formData.driveType = historyFormData.FilterInfo.DriveType;
|
|
state.formData.IsAllowCut = historyFormData.DesignInfo.IsAllowCut ?? true;
|
state.formData.IsAllowFrequence = historyFormData.DesignInfo.IsAllowFrequence ?? true;
|
|
state.formData.ToleranceStand = historyFormData.DesignInfo.ToleranceStand || 1; //容差标准
|
// 获取当前的语言类型
|
let langType = languageHelper.getParaNameByType(languageHelper.getTypeFromRout(route.fullPath));
|
// 获取配置中容差等级的默认值
|
let defaultToleranceGrade = window.pointToleranceConfig.DefaultValue[langType].ToleranceGrade;
|
state.formData.PointTolerance.ToleranceGrade = defaultToleranceGrade; //容差等级
|
if (historyFormData.DesignInfo.PointTolerance) {
|
let ToleranceGrade = historyFormData.DesignInfo.PointTolerance.ToleranceGrade;
|
state.formData.PointTolerance.ToleranceGrade = ToleranceGrade;
|
}
|
if (historyFormData.DesignInfo.PointTolerance && historyFormData.DesignInfo.PointTolerance != '') {
|
state.formData.PointTolerance.RatioMinQ = parseFloat(historyFormData.DesignInfo.PointTolerance.RatioMinQ * 100).toFixed(1); //最小流量百分比
|
state.formData.PointTolerance.RatioMaxQ = parseFloat(historyFormData.DesignInfo.PointTolerance.RatioMaxQ * 100).toFixed(1); //最大流量百分比
|
state.formData.PointTolerance.RatioMinH = parseFloat(historyFormData.DesignInfo.PointTolerance.RatioMinH * 100).toFixed(1); //最小扬程百分比
|
state.formData.PointTolerance.RatioMaxH = parseFloat(historyFormData.DesignInfo.PointTolerance.RatioMaxH * 100).toFixed(1); //最大扬程百分比
|
}
|
|
if (state.formData.PointTolerance.ToleranceGrade == 0) {
|
//判断如果容差等级值为0，表示是自定义
|
state.isToleranceLevelCustom = true;
|
}
|
initialTolerantGrandList(state.formData.ToleranceStand, state.formData.PointTolerance.ToleranceGrade);
|
};
|
|
//显示或隐藏更多设置
|
const toggleShowMoreSetting = () => {
|
state.isShowMoreSetting = !state.isShowMoreSetting;
|
};
|
|
//监听流量输入
|
const handleInputDpQ = (val) => {
|
if (val) {
|
state.ruleDpQ = false;
|
} else {
|
state.ruleDpQ = true;
|
}
|
};
|
//监听扬程输入
|
const handleInputDpH = (val) => {
|
if (val) {
|
state.ruleDpH = false;
|
} else {
|
state.ruleDpH = true;
|
}
|
};
|
|
//监听驱动类型的选择
|
const changeDriveType = (e) => {
|
let driveType = e.target.value;
|
state.formData.driveType = driveType;
|
if (driveType !== 3) {
|
state.formData.dieselSpeed = '';
|
}
|
// getSelectSeriesCtrl().resetData()
|
getSelectSeriesCtrl().filterSeriseList(state.formData.driveType, state.formData.motorFrequence, state.formData.firePumpType);
|
};
|
|
//监听消防泵类型的下拉选择
|
const changeFirePumpType = (e) => {
|
state.formData.firePumpType = e.target.value;
|
|
if (state.formData.firePumpType == 2) {
|
state.formData.DpQu = 4;
|
} else {
|
state.formData.DpQu = 1;
|
}
|
getSelectSeriesCtrl().filterSeriseList(state.formData.driveType, state.formData.motorFrequence, state.formData.firePumpType);
|
};
|
//监听电气标准标准下拉选择
|
const changeMotorStd = (e) => {
|
state.formData.motorStd = e.target.value;
|
};
|
|
//监听转速下拉(驱动类型为电机)
|
const changeMotorPoleNum = (e) => {
|
state.formData.motorPoleNum = e.target.value;
|
};
|
//监听流量单位下拉框变化的值
|
const handleDpQuSelect = (val) => {
|
state.formData.DpQu = parseInt(val.target.value);
|
state.m_secondDpFlowText = `${t('selectPage.secondDpFlow.TR')}` + '(' + UnitHelper.GetUnitNameQ(state.formData.DpQu) + ')'; //第二设计点流量显示的文字
|
state.m_thirdDpFlowText = `${t('selectPage.thirdDpFlow.TR')}` + '(' + UnitHelper.GetUnitNameQ(state.formData.DpQu) + ')'; //第三设计点流量显示的文字
|
};
|
//监听扬程单位下拉框变化的值
|
const handleDpHuSelect = (val) => {
|
state.formData.DpHu = parseInt(val.target.value);
|
state.m_secondDpHeadText = `${t('selectPage.secondDpHead.TR')}` + '(' + UnitHelper.GetUnitNameH(state.formData.DpHu) + ')'; //第二设计点扬程显示的文字的文字
|
state.m_thirdDpHeadText = `${t('selectPage.thirdDpHead.TR')}` + '(' + UnitHelper.GetUnitNameH(state.formData.DpHu) + ')'; //第三设计点扬程显示的文字
|
};
|
//监听设置频率选择下拉
|
const handldHzSelect = (val) => {
|
state.formData.motorFrequence = parseInt(val.target.value);
|
getSelectSeriesCtrl().filterSeriseList(state.formData.driveType, state.formData.motorFrequence, state.formData.firePumpType);
|
};
|
// 监听介质的输入
|
const handleJzName = (e) => {
|
state.formData.jzName = e.target.value;
|
};
|
// 监听介质选择
|
const handleJieZhiNodeClick = (data) => {
|
if (data.option) {
|
state.formData.jzID = data.option.ID;
|
state.formData.jzName = data.option.Name;
|
state.formData.calcDensity = data.option.Density;
|
state.formData.calcViscosity = data.option.Viscosity;
|
state.formData.jzTemperature = data.option.Temperature;
|
state.m_JieZhiCalaStatus = data.option.CalcStatus;
|
state.isShowJieZhiPopover = false;
|
}
|
if (state.m_JieZhiCalaStatus == 1 && state.isDiyJieZhi) {
|
calcJieZhi();
|
}
|
};
|
// 监听介质体积浓度的输入
|
const handleVolumeConcentration = (e) => {
|
let value = e.target.value;
|
if (value >= 100) {
|
value = 100;
|
}
|
state.formData.volumeConcentration = value;
|
if (state.m_JieZhiCalaStatus == 1 && state.isDiyJieZhi) {
|
calcJieZhi();
|
}
|
};
|
// 监听介质温度的输入
|
const handleTemperature = (e) => {
|
let value = e.target.value;
|
state.formData.jzTemperature = value;
|
if (state.m_JieZhiCalaStatus == 1 && state.isDiyJieZhi) {
|
calcJieZhi();
|
}
|
};
|
// 监听效率差值输入
|
const changeMinEta = (e) => {
|
let value = e.target.value;
|
if (value > 100) {
|
state.formData.MinEta = 100;
|
return;
|
}
|
state.formData.MinEta = value;
|
};
|
//监听自定义介质属性的变化
|
const changeJieZhiInputMehtod = (e) => {};
|
//监听验证容差标准下拉
|
const changeToleranceStand = (e) => {
|
state.isToleranceLevelCustom = false;
|
let standard = parseInt(e.target.value);
|
let grade = 0;
|
|
let allStandardList = state.pointToleranceConfig.Standard4PumpSelectList;
|
allStandardList.forEach((item) => {
|
if (item.Value == standard) {
|
grade = item.DefaultGrade;
|
}
|
});
|
|
initialTolerantGrandList(standard, grade);
|
};
|
//修改标准后,构建等级下拉
|
const initialTolerantGrandList = (standard, sel_grade) => {
|
state.formData.ToleranceStand = standard;
|
let allStandardList = state.pointToleranceConfig.Standard4PumpSelectList;
|
allStandardList.forEach((item) => {
|
if (item.Value == standard) {
|
state.formData.PointTolerance.ToleranceGrade = item.ToleranceGrade[0].Value;
|
|
var toleranceGradeList = [];
|
item.ToleranceGrade.forEach((grade) => {
|
let gradeColumn = { disable: false };
|
gradeColumn.text = grade.Name;
|
gradeColumn.value = grade.Value;
|
toleranceGradeList.push(gradeColumn);
|
});
|
|
toleranceGradeList.push({
|
text: `${t('selectPage.custom.TR')}`,
|
value: 0,
|
disable: false,
|
});
|
|
state.m_toleranceGradeList = toleranceGradeList;
|
}
|
});
|
|
if (sel_grade != null && sel_grade != 0) {
|
state.formData.PointTolerance.ToleranceGrade = sel_grade;
|
buildToleranceRangData(sel_grade);
|
} else {
|
state.formData.PointTolerance.ToleranceGrade = sel_grade;
|
state.isToleranceLevelCustom = true;
|
checkCustomValueIsUse();
|
}
|
};
|
//监听验证容差等级下拉
|
const changeToleranceGrade = (e) => {
|
let grade = parseInt(e.target.value);
|
state.formData.PointTolerance.ToleranceGrade = grade;
|
if (grade == 0) {
|
state.isToleranceLevelCustom = true;
|
// 判断配置中是否有配置自定义容差范围得值
|
checkCustomValueIsUse();
|
} else {
|
state.isToleranceLevelCustom = false;
|
buildToleranceRangData(grade);
|
}
|
};
|
// 校验容差等级配置的自定义值是否可用
|
const checkCustomValueIsUse = () => {
|
// 自定义最小流量百分比
|
if (state.pointToleranceConfig.CustomValue.RatioMinQ.isUse) {
|
state.formData.PointTolerance.RatioMinQ = parseFloat(state.pointToleranceConfig.CustomValue.RatioMinQ.value * 100).toFixed(1);
|
}
|
// 自定义最大流量百分比
|
if (state.pointToleranceConfig.CustomValue.RatioMaxQ.isUse) {
|
state.formData.PointTolerance.RatioMaxQ = parseFloat(state.pointToleranceConfig.CustomValue.RatioMaxQ.value * 100).toFixed(1);
|
}
|
// 自定义最小扬程百分比
|
if (state.pointToleranceConfig.CustomValue.RatioMinH.isUse) {
|
state.formData.PointTolerance.RatioMinH = parseFloat(state.pointToleranceConfig.CustomValue.RatioMinH.value * 100).toFixed(1);
|
}
|
// 自定义最大扬程百分比
|
if (state.pointToleranceConfig.CustomValue.RatioMaxH.isUse) {
|
state.formData.PointTolerance.RatioMaxH = parseFloat(state.pointToleranceConfig.CustomValue.RatioMaxH.value * 100).toFixed(1);
|
}
|
};
|
//设置容差范围的数据
|
const buildToleranceRangData = (grade) => {
|
let grade_tol = state.pointToleranceConfig.getGradeValue(grade);
|
if (grade_tol != null) {
|
state.formData.PointTolerance.RatioMinQ = parseFloat(grade_tol.RatioMinQ * 100).toFixed(1); //最小流量百分比
|
state.formData.PointTolerance.RatioMaxQ = parseFloat(grade_tol.RatioMaxQ * 100).toFixed(1); //最大流量百分比
|
state.formData.PointTolerance.RatioMinH = parseFloat(grade_tol.RatioMinH * 100).toFixed(1); //最小扬程百分比
|
state.formData.PointTolerance.RatioMaxH = parseFloat(grade_tol.RatioMaxH * 100).toFixed(1); //最大扬程百分比
|
}
|
};
|
|
//界面翻译
|
const translateUI = () => {
|
//转速等级的语言转换处理
|
state.MotorPoleList[0].Text = `${t('selectPage.unlimited.TR')}`;
|
//第二、三 设计点流量、扬程 选择项文字的处理
|
state.m_secondDpFlowText = `${t('selectPage.secondDpFlow.TR')}(${UnitHelper.GetUnitNameQ(state.formData.DpQu)})`; //第二设计点流量显示的文字
|
state.m_secondDpHeadText = `${t('selectPage.secondDpHead.TR')}(${UnitHelper.GetUnitNameH(state.formData.DpHu)})`; //第二设计点扬程显示的文字的文字
|
state.m_thirdDpFlowText = `${t('selectPage.thirdDpFlow.TR')}(${UnitHelper.GetUnitNameQ(state.formData.DpQu)})`; //第三设计点流量显示的文字
|
state.m_thirdDpHeadText = `${t('selectPage.thirdDpHead.TR')}(${UnitHelper.GetUnitNameH(state.formData.DpHu)})`; //第三设计点扬程显示的文字
|
};
|
//返回上一页
|
const backTo = () => {};
|
//下一步
|
const nextPage = () => {
|
let cbData = getSelectSeriesCtrl().getSelectData();
|
|
if (cbData == null) return;
|
|
let selSeriesIDs = cbData.SeriesID;
|
let selCatalogIDs = cbData.CatalogID;
|
let selMethod = cbData.SelMethod;
|
if (selCatalogIDs == null || selCatalogIDs.length == 0) {
|
if (selSeriesIDs == null || selSeriesIDs.length == 0) return;
|
}
|
|
state.ruleDpQ = false;
|
state.ruleDpH = false;
|
state.ruleDieselSpeed = false;
|
if (state.formData.DpQ == '' || state.formData.DpH == '') {
|
state.ruleDpQ = true;
|
state.ruleDpH = true;
|
return;
|
}
|
if (state.formData.DpQ == '' || state.formData.DpH == '') {
|
state.ruleDpQ = true;
|
state.ruleDpH = true;
|
return;
|
}
|
//
|
if (state.formData.driveType == ConstParas.DriveType.Motor) {
|
if (state.formData.motorPoleNum == undefined) {
|
state.ruleMotorPoleNum = true;
|
return;
|
}
|
}
|
|
let calcDensity = state.formData.calcDensity;
|
let miduUnit = Number(state.formData.miduUnit);
|
if (miduUnit !== 0) {
|
calcDensity = Number(calcDensity) * 1000;
|
}
|
// 计算粘度
|
let calcNianDu = state.formData.calcViscosity;
|
let nianDuUnit = Number(state.NianDuUnit);
|
if (nianDuUnit == 1) {
|
calcNianDu = Number(calcNianDu) * 100;
|
}
|
|
if (nianDuUnit == 5) {
|
let temp = calcDensity;
|
if (miduUnit !== 0) temp = temp / 1000;
|
calcNianDu = calcNianDu / temp;
|
}
|
|
if (calcDensity > 5000) {
|
ElMessage.warning('最大密度不能大于5000');
|
return;
|
}
|
|
if (calcNianDu > 1000) {
|
ElMessage.warning('介质粘度不能大于1000');
|
return;
|
}
|
|
//保存参数到缓存里面
|
saveParas({
|
SelSeriesIDs: selSeriesIDs,
|
SelCatalogIDs: selCatalogIDs,
|
SelMethod: selMethod,
|
CalcDensity: calcDensity,
|
CalcNianDu: calcNianDu,
|
});
|
|
let path = '/Select/PumpList/Index';
|
router.push({
|
path: path,
|
});
|
};
|
//保存参数到缓存里面
|
const saveParas = (saveData) => {
|
let { SelSeriesIDs, SelCatalogIDs, SelMethod, CalcDensity, CalcNianDu } = saveData;
|
if (SelSeriesIDs == null) SelSeriesIDs = [];
|
if (SelCatalogIDs == null) SelCatalogIDs = [];
|
// 判断当前选型方法是不是按行业
|
if (SelMethod == null || SelMethod != 1) {
|
// 判断当前选型方法是否是按类型 m_selPumpSeriesCtrlType = true表示bySeries
|
if (state.m_selPumpSeriesCtrlType) {
|
// selMethod = 1 表示按系列选型
|
SelMethod = 1;
|
} else {
|
// selMethod = 0 表示按类型选型
|
SelMethod = 0;
|
}
|
} else {
|
SelMethod = 2;
|
}
|
//是否修正粘度 默认false
|
var isVisCorrect = false;
|
if (state.formData.calcViscosity && state.formData.calcViscosity > 30) isVisCorrect = true;
|
|
let post_data = {
|
//介质
|
JieZhi: {
|
ID: state.formData.jzID, //介质id
|
Name: state.formData.jzName, //介质名称
|
CalcDensity: CalcDensity, //密度
|
CalcViscosity: CalcNianDu, //粘度
|
Temperature: state.formData.jzTemperature, //温度
|
V_C: state.formData.volumeConcentration, //体积浓度
|
MiDuUnit: state.formData.miduUnit, //密度单位
|
NianDuUnit: state.NianDuUnit, //粘度单位
|
IsCustom: state.isDiyJieZhi, //是否自定义介质
|
},
|
//筛选信息
|
FilterInfo: {
|
DriveType: state.formData.driveType, //设备类型 0电机 3柴油机
|
KeyWord: '', //关键字 暂时默认空
|
MotorPoleNum: state.formData.motorPoleNum, //电机极数
|
DieselSpeed: state.formData.dieselSpeed, //柴油机转速
|
MotorFrequence: state.formData.motorFrequence, //电机赫兹
|
FirePumpType: state.formData.firePumpType, //消防泵类型
|
Temperature: state.formData.jzTemperature, //温度
|
MinEta: state.formData.MinEta, //效率要求
|
MotorStandard: state.formData.motorStd, //电机功率标准
|
MotorPower: state.formData.motorPower, //电机功率
|
NPSHa: state.formData.NPSHa, //气蚀
|
SeriesSelectMethod: SelMethod, //0 用的是 CatalogID 1 用的是SeriesID 2 行业
|
SeriesID: SelSeriesIDs.join(','), //泵系列ID 暂时默认为空
|
CatalogID: SelCatalogIDs.join(','), //泵类型id
|
},
|
//设计点参数
|
DesignInfo: {
|
UnitQ: state.formData.DpQu, //流量单位
|
UnitH: state.formData.DpHu, //扬程单位
|
DpQ: state.formData.DpQ, //输入的流量的值
|
DpH: state.formData.DpH, //输入的扬程的值
|
IsAllowCut: state.formData.IsAllowCut, //是否允许切割
|
IsAllowFrequence: state.formData.IsAllowFrequence, //是否允许变频
|
ToleranceStand: state.formData.ToleranceStand,
|
PointTolerance: {
|
ToleranceGrade: state.formData.PointTolerance.ToleranceGrade, //容差等级的值
|
RatioMinQ: parseFloat(parseInt(state.formData.PointTolerance.RatioMinQ * 10) / 1000).toFixed(2),
|
RatioMaxQ: parseFloat(parseInt(state.formData.PointTolerance.RatioMaxQ * 10) / 1000).toFixed(2),
|
RatioMinH: parseFloat(parseInt(state.formData.PointTolerance.RatioMinH * 10) / 1000).toFixed(2),
|
RatioMaxH: parseFloat(parseInt(state.formData.PointTolerance.RatioMaxH * 10) / 1000).toFixed(2),
|
},
|
IsVisCorrect: isVisCorrect,
|
},
|
};
|
|
//将筛选数据存储到缓存中
|
selectStore.setByParas({
|
selectParas: post_data,
|
});
|
};
|
</script>
|
<style lang="scss">
|
.is-homepage {
|
width: 100%;
|
height: 100%;
|
margin: 0;
|
padding: 0;
|
background-attachment: fixed;
|
background-position: center;
|
background-repeat: no-repeat;
|
background-size: cover;
|
color: #fefefe;
|
font-weight: normal;
|
line-height: 1.5;
|
|
a {
|
color: #0c3471;
|
line-height: inherit;
|
}
|
|
.o-site-main {
|
padding-top: 24px;
|
}
|
|
.large-2 {
|
flex: 0 0 16.6666666667%;
|
max-width: 16.6666666667%;
|
}
|
|
.columns {
|
padding: 0 15px;
|
}
|
|
.tabs {
|
margin: 0;
|
list-style-type: none;
|
background: transparent;
|
border: 1px solid transparent;
|
}
|
|
ul,
|
ol,
|
dl {
|
line-height: 1.5;
|
list-style-position: outside;
|
}
|
|
div,
|
dl,
|
dt,
|
dd,
|
ul,
|
ol,
|
li,
|
h1,
|
h2,
|
h3,
|
h4,
|
h5,
|
h6,
|
pre,
|
form,
|
p,
|
blockquote,
|
th,
|
td {
|
margin: 0;
|
padding: 0;
|
}
|
|
h1,
|
h2,
|
h3,
|
h4,
|
h5,
|
h6 {
|
font-weight: normal;
|
font-style: normal;
|
color: inherit;
|
text-rendering: optimizeLegibility;
|
margin-top: 0;
|
margin-bottom: 8px;
|
line-height: 1.4;
|
}
|
|
button,
|
input,
|
optgroup,
|
select,
|
textarea {
|
color: inherit;
|
font: inherit;
|
margin: 0;
|
}
|
|
.tabs::after {
|
clear: both;
|
}
|
|
.tabs::before,
|
.tabs::after {
|
content: ' ';
|
display: table;
|
flex-basis: 0;
|
order: 1;
|
}
|
|
.tabs.vertical > li {
|
width: auto;
|
float: none;
|
display: block;
|
}
|
|
.c-sidebar__item {
|
margin-bottom: 8px
|
}
|
|
li {
|
font-size: inherit;
|
}
|
|
a {
|
color: #0c3471;
|
text-decoration: none;
|
line-height: inherit;
|
cursor: pointer;
|
}
|
|
p {
|
font-size: inherit;
|
line-height: 1.5;
|
margin-bottom: 16px;
|
text-rendering: optimizeLegibility;
|
}
|
|
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
|
background-color: #0c3471;
|
border-color: #0c3471;
|
}
|
|
.el-radio-button:first-child .el-radio-button__inner {
|
border-top-left-radius: 4px;
|
border-bottom-left-radius: 4px;
|
}
|
|
.el-radio-button:last-child .el-radio-button__inner {
|
border-top-right-radius: 4px;
|
border-bottom-right-radius: 4px;
|
}
|
|
.tabs-title > a {
|
display: block;
|
padding: 20px 24px;
|
line-height: 1;
|
font-size: 12px;
|
}
|
|
.c-sidebar__item > .c-sidebar__link {
|
border-radius: 3px;
|
color: #16181a;
|
font-size: 16px;
|
padding: 8px 16px;
|
transition: background 150ms, color 150ms;
|
}
|
|
.c-sidebar__divider {
|
border-top: 1px solid #91a1aa;
|
margin-bottom: 12px;
|
}
|
|
.is-homepage .c-sidebar__item > .c-sidebar__link:hover,
|
.is-homepage .c-sidebar__item > .c-sidebar__link:focus {
|
color: #40464c;
|
}
|
|
.c-sidebar__item > .c-sidebar__link:hover,
|
.c-sidebar__item > .c-sidebar__link:focus {
|
background: #ced5d9;
|
color: #40464c;
|
}
|
|
.is-homepage .c-sidebar__item > .c-sidebar__link {
|
color: #fefefe;
|
}
|
|
.c-sidebar__item.is-active > .c-sidebar__link {
|
color: #0c3471;
|
font-weight: 700;
|
}
|
|
.row .row {
|
max-width: none;
|
}
|
|
.row {
|
display: flex;
|
flex-flow: row wrap;
|
}
|
|
.large-6 {
|
flex: 0 0 50%;
|
max-width: 50%;
|
}
|
|
.column,
|
.columns {
|
padding-left: 8px;
|
padding-right: 8px;
|
}
|
|
.align-middle {
|
align-items: center;
|
}
|
|
.align-justify {
|
justify-content: space-between;
|
}
|
|
.column,
|
.columns {
|
flex: 1 1 0px;
|
min-width: initial;
|
}
|
|
.c-card {
|
margin: 0 0 16px 0;
|
padding: 16px;
|
border-radius: 3px;
|
position: relative;
|
color: #16181a;
|
background: #fefefe;
|
border: 1px solid #dbe0e3;
|
box-shadow: 0 1px 3px rgba(145, 161, 170, 0.25);
|
}
|
|
.c-card > :last-child {
|
margin-bottom: 0;
|
}
|
|
.c-card > :first-child {
|
margin-top: 0;
|
}
|
|
label {
|
display: block;
|
margin: 0;
|
font-size: 16px;
|
font-weight: normal;
|
line-height: 1.5;
|
color: #16181a;
|
text-align: left;
|
}
|
|
.o-input-select-combo {
|
display: flex;
|
}
|
|
input {
|
line-height: normal;
|
}
|
|
input[disabled],
|
input:disabled {
|
cursor: not-allowed;
|
background-color: #f1f2f3;
|
}
|
|
select[disabled],
|
select:disabled {
|
cursor: not-allowed;
|
background: #fefefe;
|
}
|
|
[type='submit'],
|
[type='button'] {
|
border-radius: 3px;
|
}
|
|
[type='text'],
|
[type='password'],
|
[type='date'],
|
[type='datetime'],
|
[type='datetime-local'],
|
[type='month'],
|
[type='week'],
|
[type='email'],
|
[type='number'],
|
[type='search'],
|
[type='tel'],
|
[type='time'],
|
[type='url'],
|
[type='color'],
|
textarea {
|
display: block;
|
-moz-box-sizing: border-box;
|
box-sizing: border-box;
|
width: 100%;
|
height: 39px;
|
padding: 8px;
|
border: 1px solid #91a1aa;
|
margin: 0 0 16px;
|
font-family: inherit;
|
font-size: 16px;
|
color: #16181a;
|
background-color: #fefefe;
|
box-shadow: inset 0 1px 2px rgba(22, 24, 26, 0.1);
|
border-radius: 3px;
|
-webkit-transition: box-shadow 150ms, border-color 150ms ease-in-out;
|
transition: box-shadow 150ms, border-color 150ms ease-in-out;
|
}
|
|
.o-input-select-combo > * {
|
min-width: 0px;
|
}
|
|
.c-input-select-combo--left {
|
border-radius: 3px 0 0 3px;
|
}
|
|
button,
|
select {
|
text-transform: none;
|
}
|
|
select {
|
width: 100%;
|
border-radius: 3px;
|
}
|
|
select {
|
height: 39px;
|
padding: 8px;
|
border: 1px solid #91a1aa;
|
margin: 0 0 16px;
|
font-size: 16px;
|
font-family: inherit;
|
line-height: normal;
|
color: #16181a;
|
background-color: #fefefe;
|
border-radius: 3px;
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: rgb%2851, 51, 51%29'></polygon></svg>");
|
background-size: 9px 6px;
|
background-position: right -16px center;
|
background-origin: content-box;
|
background-repeat: no-repeat;
|
padding-right: 24px;
|
-webkit-appearance: none;
|
-moz-appearance: none;
|
cursor: pointer;
|
}
|
|
input[type='checkbox'],
|
input[type='radio'] {
|
box-sizing: border-box;
|
padding: 0;
|
}
|
|
.o-input-select-combo > * {
|
min-width: 0px;
|
}
|
|
.c-input-select-combo--right {
|
border-radius: 0 3px 3px 0;
|
}
|
|
.u-pointer,
|
.u-cursor-pointer {
|
cursor: pointer !important;
|
}
|
|
.u-no-wrap {
|
white-space: nowrap !important;
|
}
|
|
.lead {
|
font-size: 125%;
|
line-height: 1.6;
|
}
|
|
.text-center {
|
text-align: center;
|
}
|
|
.switch {
|
margin-bottom: 16px;
|
outline: 0;
|
position: relative;
|
-webkit-user-select: none;
|
-moz-user-select: none;
|
-ms-user-select: none;
|
user-select: none;
|
color: #fefefe;
|
font-weight: bold;
|
font-size:14px;
|
}
|
|
.button {
|
display: inline-block;
|
text-align: center;
|
line-height: 1;
|
cursor: pointer;
|
transition: background-color 0.25s ease-out, color 0.25s ease-out;
|
vertical-align: middle;
|
border: 1px solid transparent;
|
border-radius: 3px;
|
padding: 13.6px 16px;
|
margin: 0 0 16px 0;
|
font-size: 16px;
|
background-color: #0c3471;
|
color: #fff;
|
}
|
|
.button.grey {
|
background-color: #91a1aa;
|
color: #000;
|
}
|
|
input {
|
line-height: normal;
|
}
|
|
input:checked ~ .switch-paddle {
|
background: #0c3471;
|
}
|
|
[type='file'],
|
[type='checkbox'],
|
[type='radio'] {
|
margin: 0 0 16px;
|
}
|
|
.switch-input {
|
opacity: 0;
|
position: absolute;
|
}
|
|
input[type='checkbox'],
|
input[type='radio'] {
|
-moz-box-sizing: border-box;
|
box-sizing: border-box;
|
padding: 0;
|
}
|
|
[type='checkbox'] + label,
|
[type='radio'] + label {
|
display: inline-block;
|
margin-left: 8px;
|
margin-right: 16px;
|
margin-bottom: 0;
|
vertical-align: baseline;
|
}
|
|
[type='checkbox'] + label[for],
|
[type='radio'] + label[for] {
|
cursor: pointer;
|
}
|
|
.switch-paddle {
|
background: #dbe0e3;
|
cursor: pointer;
|
display: block;
|
position: relative;
|
width: 64px;
|
height: 32px;
|
-webkit-transition: all 0.25s ease-out;
|
transition: all 0.25s ease-out;
|
border-radius: 3px;
|
color: inherit;
|
font-weight: inherit;
|
}
|
|
.switch-paddle::after {
|
background: #fefefe;
|
content: '';
|
display: block;
|
position: absolute;
|
height: 24px;
|
left: 4px;
|
top: 4px;
|
width: 24px;
|
-webkit-transition: all 0.25s ease-out;
|
transition: all 0.25s ease-out;
|
-webkit-transform: translate3d(0, 0, 0);
|
-ms-transform: translate3d(0, 0, 0);
|
transform: translate3d(0, 0, 0);
|
border-radius: 3px;
|
}
|
|
.switch.tiny .switch-paddle {
|
width: 48px;
|
height: 24px;
|
font-size: 10px;
|
}
|
|
.switch.tiny input:checked ~ .switch-paddle::after {
|
left: 28px;
|
}
|
|
.switch.tiny .switch-paddle::after {
|
width: 16px;
|
height: 16px;
|
}
|
|
input + .switch-paddle {
|
margin: 0;
|
}
|
|
.callout {
|
margin: 0 0 16px 0;
|
padding: 16px;
|
border: none;
|
border-radius: 3px;
|
position: relative;
|
color: #16181a;
|
background-color: #fefefe;
|
}
|
|
.callout.grey {
|
background-color: #91a1aa;
|
}
|
|
.callout > :first-child {
|
margin-top: 0;
|
}
|
|
.shrink {
|
flex: 0 0 auto;
|
max-width: 100%;
|
}
|
|
.align-top {
|
align-items: flex-start;
|
}
|
|
.menu {
|
margin: 0;
|
list-style-type: none;
|
width: 100%;
|
display: flex;
|
flex-wrap: nowrap;
|
align-items: center;
|
flex-wrap: nowrap;
|
}
|
|
.menu > li {
|
flex: 0 0 auto;
|
}
|
|
.menu > li > a {
|
flex-flow: row nowrap;
|
}
|
|
.menu > li > a {
|
display: flex;
|
}
|
|
.menu > li > a {
|
display: block;
|
padding: 8px 16px;
|
line-height: 1;
|
}
|
|
.menu input,
|
.menu a,
|
.menu button {
|
margin-bottom: 0;
|
}
|
|
.shrink {
|
flex: 0 0 auto;
|
max-width: 100%;
|
}
|
|
.text-right {
|
text-align: right;
|
}
|
|
.menu input,
|
.menu a,
|
.menu button {
|
margin-bottom: 0;
|
}
|
|
.button,
|
.button:hover,
|
.button:focus {
|
color: #fff;
|
}
|
|
.button.micro {
|
font-size: 12px;
|
padding: 2px 8px
|
}
|
|
.u-no-margin {
|
margin: 0 !important;
|
}
|
|
.c-product-line-select {
|
border: 1px solid #ddd;
|
border-radius: 3px;
|
color: #555;
|
margin-top: 8px;
|
overflow: hidden;
|
}
|
|
.c-product-line-select.is-selected {
|
background-color: #efefef;
|
border-color: currentColor;
|
color: black;
|
}
|
|
.c-product-line-select__overview {
|
display: flex;
|
}
|
|
.c-product-line-select__select-button,
|
.c-product-line-select__summary-button {
|
background: 0;
|
border: 0;
|
border-radius: 0;
|
color: currentColor;
|
font-size: calc(0.5vw + 16px);
|
}
|
|
.c-product-line-select__select-button {
|
display: flex;
|
align-items: center;
|
flex-grow: 1;
|
padding: 0;
|
text-align: left;
|
}
|
|
.c-product-line-select__select-icon {
|
display: block;
|
flex: none;
|
padding: 16px;
|
}
|
|
.c-product-line-select__name {
|
flex-grow: 1;
|
font-size: calc(0.5vw + 12px);
|
padding: 16px 0 16px 32px;
|
}
|
|
.c-product-line-select__select-icon::before {
|
content: '\f096';
|
}
|
|
.c-product-line-select.is-selected .c-product-line-select__select-icon::before {
|
color: currentColor;
|
content: '\f046';
|
opacity: 1;
|
}
|
|
.c-product-line-select__select-button:hover .c-product-line-select__select-icon::before {
|
content: '\f046';
|
opacity: 0.5;
|
}
|
|
.c-product-line-select__image {
|
display: block;
|
flex: none;
|
max-width: -webkit-calc(4vw + 640px);
|
max-width: calc(4vw + 640px);
|
padding: 16px;
|
}
|
|
.c-product-line-select__summary-button {
|
background-color: #ddd;
|
color: currentColor;
|
flex: none;
|
padding: 0 12px;
|
}
|
|
.c-product-line-select__summary {
|
background-color: #ddd;
|
color: black;
|
padding: 16px;
|
text-align: left;
|
}
|
|
.u-no-margin {
|
margin: 0 !important;
|
}
|
|
.hide {
|
display: none !important;
|
}
|
|
.is-homepage .el-input.is-active .el-input__inner,
|
.el-input__inner:focus {
|
border-color: #000;
|
border-width: 2px;
|
}
|
|
.is-homepage .el-input--suffix .el-input__inner {
|
text-align: left;
|
}
|
|
.is-homepage .el-input__suffix {
|
right: 0;
|
top: -5px;
|
color: #000;
|
}
|
|
.jiezhipopoverstyle {
|
margin-top: 0px !important;
|
}
|
|
.jz-select-div {
|
.el-input__wrapper {
|
box-shadow: none;
|
}
|
|
.el-input__wrapper.is-focus {
|
box-shadow: none;
|
}
|
}
|
}
|
|
*,
|
*::before,
|
*::after {
|
-moz-box-sizing: inherit;
|
box-sizing: inherit;
|
}
|
</style>
|
