<template>
|
<div>
|
<van-collapse v-model="activeNames">
|
<van-collapse-item :title="$t('detailPage.parameter.TR')">
|
<div style="display: flex; margin-top: 0.1rem">
|
<van-col :span="6">
|
<div class="table_box">
|
<div class="content2 table_head" style="border-top: 1px solid #e9e9e9">{{$t('detailPage.parameter.TR')}}</div>
|
</div>
|
</van-col>
|
<van-col :span="12">
|
<div class="table_box">
|
<div class="content2 table_head" style="border-top: 1px solid #e9e9e9">{{$t('detailPage.data.TR')}}</div>
|
</div>
|
</van-col>
|
<van-col :span="6">
|
<div class="table_box">
|
<div class="content3 table_head" style="border-top: 1px solid #e9e9e9">{{$t('detailPage.unit.TR')}}</div>
|
</div>
|
</van-col>
|
</div>
|
<div
|
style="display: flex; flex-direction: column"
|
v-for="(
|
mainParas_item, mainParas_index
|
) in paraTable4Disp.nodeList"
|
:key="'searchTable' + mainParas_index"
|
>
|
<div style="width: 100%">
|
<van-col :span="24" style="display: flex; width: 100%">
|
<van-col :span="6">
|
<div class="table_box">
|
<div class="content2">{{ mainParas_item.Name }}</div>
|
</div>
|
</van-col>
|
<van-col :span="12" style="display: flex">
|
<div class="table_box">
|
<div class="content2" v-if="mainParas_item.IsEditAble">
|
<van-field v-if="mainParas_item.Tag == 'RequestPointH'" v-model="mainParas_item.Value" label />
|
<span
|
@click.stop="clickGridRowRefreshByDp"
|
v-if="mainParas_item.Tag == 'RequestPointH'"
|
class="el-icon-refresh-right refresh_style"
|
></span>
|
<van-field
|
v-else-if="mainParas_item.Tag == 'MotorPower'"
|
readonly
|
clickable
|
style="text-align:center"
|
name="picker"
|
@click="showMotorValueComboxPicker(mainParas_index,mainParas_item)"
|
>
|
<template slot="input">
|
<div
|
style="text-decoration: underline;color: blue;width: 100%;text-align: center;font-size:12px;"
|
>{{mainParas_item.Value}}</div>
|
</template>
|
</van-field>
|
<van-field v-else v-model="mainParas_item.Value" label />
|
<van-popup
|
v-model="mainParas_item.isShowPicker"
|
position="bottom"
|
>
|
<van-picker
|
show-toolbar
|
:columns="getMotorValueList(mainParas_index)"
|
@confirm="onConfirmMotorValuChange"
|
@cancel="onCancelMotorValuChange"
|
/>
|
</van-popup>
|
</div>
|
<div class="content2" v-else>{{ mainParas_item.Value }}</div>
|
</div>
|
</van-col>
|
<van-col :span="6" style="display: flex">
|
<div class="table_box">
|
<div class="content3">{{ mainParas_item.UnitName }}</div>
|
</div>
|
</van-col>
|
</van-col>
|
</div>
|
</div>
|
</van-collapse-item>
|
</van-collapse>
|
</div>
|
</template>
|
<script>
|
import UnitHelper from "@/utils/unit";
|
import languageMixin from "@/mixin/language";
|
export default {
|
mixins: [languageMixin],
|
data() {
|
return {
|
show:true,
|
activeNames: ["1"],
|
m_chartType: 0,
|
paraTable4Disp: {}, //参数选型
|
MainParaItemList: [], //参数选型列表
|
|
unitSetting: {
|
Q: UnitHelper.Default.Q,
|
H: UnitHelper.Default.H,
|
P: UnitHelper.Default.P
|
} //默认单位
|
};
|
},
|
methods: {
|
//获取初始化
|
initPumpInfoData(val) {
|
//
|
let pumpInfoData = val;
|
if (pumpInfoData.SettingInfo == null) {
|
return;
|
}
|
if (pumpInfoData.MainParaItemList == null) {
|
return;
|
}
|
let _this = this;
|
|
_this.ChartType = pumpInfoData.BaseInfo.ChartType;
|
//console.log(_this.ChartType, 697);
|
_this.unitSetting.Q = pumpInfoData.SettingInfo.UnitQ;
|
_this.unitSetting.H = pumpInfoData.SettingInfo.UnitH;
|
_this.unitSetting.P = pumpInfoData.SettingInfo.UnitP;
|
|
_this.buildTable(pumpInfoData.MainParaItemList);
|
},
|
buildTable(mainParaItemList) {
|
if (mainParaItemList == null) {
|
return;
|
}
|
let _this = this;
|
_this.MainParaItemList = mainParaItemList;
|
// console.log(mainParaItemList, "mainParaItemList");
|
let langType = _this.getCurrentLanguageUrl();
|
let pointTable = {};
|
pointTable.title = `${this.$t("detailPage.parameterSelection.TR")}`;
|
pointTable.isShow = true;
|
pointTable.nodeList = [];
|
for (let i = 0; i < mainParaItemList.length; i++) {
|
let node = mainParaItemList[i];
|
//判断当前是不是英文
|
if(langType == "EN"){
|
node.Name = _this.getTranslateString(node.Name)
|
}
|
if (node.Tag == "RequestPointQ") {
|
node.userUnit = UnitHelper.Q_Value_List;
|
} else if (node.Tag == "RequestPointH") {
|
node.userUnit = UnitHelper.H_Value_List;
|
} else {
|
node.userUnit = [];
|
}
|
if (node.Tag == "MotorPower") {
|
node.Value = parseFloat(node.Value);
|
//将电机功率的值传给属性
|
this.$emit("cbChangeMotorPower", parseFloat(node.Value));
|
}
|
//console.log(node, 602);
|
pointTable.nodeList.push(node);
|
}
|
// console.log(pointTable, 661);
|
pointTable.nodeList.forEach(item=>{
|
item.isShowPicker = false
|
})
|
this.paraTable4Disp = pointTable
|
// console.log(this.paraTable4Disp,158)
|
},
|
//修改设计点参数后 刷新
|
refreshPumpInfoData(val) {
|
//
|
let _this = this;
|
var mainParaItemList = val.MainParaItemList;
|
for (var i = 0; i < mainParaItemList.length; i++) {
|
var item = mainParaItemList[i];
|
//console.log(item, 602);
|
if (item.Tag == "WrkD2") {
|
if (item.Value != null)
|
item.Value = parseFloat(item.Value).toFixed(1);
|
}
|
_this.setMainParaItemValue(item.Tag, item.Value);
|
}
|
},
|
//外部获取选型参数
|
getDesignParas() {
|
let obj = {};
|
let nodeList = this.paraTable4Disp.nodeList;
|
nodeList.forEach(item => {
|
if (item.Tag == "RequestPointQ") {
|
//流量
|
obj.DpQ = item.Value;
|
obj.DpQu = item.Unit;
|
}
|
if (item.Tag == "RequestPointH") {
|
//扬程
|
obj.DpH = item.Value;
|
obj.DpHu = item.Unit;
|
}
|
if (item.Tag == "WrkSpeed") {
|
//转速
|
obj.WrkSpeed = item.Value;
|
}
|
if (item.Tag == "WrkD2") {
|
//叶轮外径
|
obj.WrkD2 = item.Value;
|
}
|
});
|
return obj;
|
},
|
//点击刷新参数
|
clickGridRowRefreshByDp() {
|
//产品属性等信息变化后刷新图表等信息
|
let dp = this.getDesignParas();
|
//回调父窗体函数
|
this.$emit("cbRefreshByDp", dp);
|
//console.log(canShuXuanxing, obj);
|
//if (this.cbRefreshByDp != null)
|
// this.cbRefreshByDp(obj);
|
},
|
//设置值
|
setMainParaItemValue(tag, value) {
|
var mainParaItemList = this.MainParaItemList;
|
for (var i = 0; i < mainParaItemList.length; i++) {
|
var item = mainParaItemList[i];
|
if (item.Tag == tag) {
|
item.Value = value;
|
//console.log(item,380);
|
}
|
}
|
this.MainParaItemList = mainParaItemList;
|
|
var paraTable4Disp = this.paraTable4Disp;
|
for (var i = 0; i < paraTable4Disp.nodeList.length; i++) {
|
var item = paraTable4Disp.nodeList[i];
|
if (item.Tag == tag) {
|
item.Value = value;
|
//console.log(item,390);
|
}
|
}
|
this.paraTable4Disp = paraTable4Disp;
|
},
|
showMotorValueComboxPicker(index,item) {
|
this.currentShowPicker = [index]
|
item.isShowPicker = !item.isShowPicker
|
|
this.$set(this.paraTable4Disp.nodeList, index, item)
|
},
|
getMotorValueList(index) {
|
let list = this.paraTable4Disp.nodeList[index].Range;
|
if (!list) {
|
list = [];
|
}
|
return list;
|
},
|
//监听电机值选择
|
onConfirmMotorValuChange(value) {
|
let i = this.currentShowPicker[0];
|
this.paraTable4Disp.nodeList[i].Value = value;
|
this.paraTable4Disp.nodeList[i].isShowPicker = false;
|
// console.log(value,252)
|
this.$emit("cbChangeMotorPower", value);
|
},
|
//监听取消选择
|
onCancelMotorValuChange() {
|
let i = this.currentShowPicker[0];
|
this.paraTable4Disp.nodeList[i].isShowPicker = false;
|
},
|
//翻译
|
getTranslateString(cn) {
|
//if (m_localizationType == 0)
|
// return cn;
|
if (cn == "流量") return "Flow";
|
else if (cn == "压力") return "Press";
|
else if (cn == "扬程") return "Head";
|
else if (cn == "效率") return "Eta";
|
else if (cn == "功率") return "Power";
|
else if (cn == "转速") return "Speed";
|
else if (cn == "叶轮外径") return "Impeller Dia";
|
else if (cn == "电机功率") return "Motor Power";
|
else return cn;
|
},
|
}
|
};
|
</script>
|
<style lang="scss">
|
.table_box {
|
width: 99%;
|
height: 30px;
|
display: flex;
|
border-left: 1px solid #e9e9e9 !important;
|
border-bottom: 1px solid #e9e9e9 !important;
|
.content2 {
|
position: relative;
|
width: 100%;
|
height: 100%;
|
line-height: 30px;
|
text-align: center;
|
background-color: #fff;
|
border-top: 1px solid #e9e9e9 !important;
|
// border-right: 1px solid #e9e9e9;
|
border-bottom: 1px solid #e9e9e9 !important;
|
color: #000000;
|
font-size: 12px;
|
.van-cell {
|
padding: 0;
|
line-height: 30px;
|
input {
|
text-align: center;
|
font-size: 12px;
|
}
|
}
|
}
|
.content3 {
|
width: 100%;
|
height: 100%;
|
line-height: 30px;
|
text-align: center;
|
background-color: #fff;
|
border-top: 1px solid #e9e9e9 !important;
|
border-right: 1px solid #e9e9e9 !important;
|
border-bottom: 1px solid #e9e9e9 !important;
|
color: #000000;
|
font-size: 12px;
|
}
|
.table_head {
|
border-top: 1px solid #e9e9e9 !important;
|
border-bottom: 1px solid #e9e9e9 !important;
|
}
|
.refresh_style {
|
display: inline-block;
|
font-size: 22px;
|
color: rgb(64, 158, 255);
|
font-weight: bold;
|
position: absolute;
|
right: 5px;
|
top: 4px;
|
}
|
}
|
.van-hairline--top-bottom::after,
|
.van-hairline-unset--top-bottom::after {
|
border: unset;
|
}
|
</style>
|
