<!-- -->
|
<template>
|
<div class="modelLibraryIndex_box" v-myTitle="{ title: $t('selectPage.model.TR') }">
|
<!-- 头部导航栏 -->
|
<van-nav-bar>
|
<template #left>
|
<div style="display: flex; align-items: center" @click="pageBack">
|
<van-icon name="arrow-left" size="18" />
|
<span></span>
|
</div>
|
</template>
|
<template #title>
|
<label style="color: #ffffff">{{ $t('selectPage.model.TR') }}</label>
|
</template>
|
<template #right> </template>
|
</van-nav-bar>
|
<div class="modelLibraryIndex_main">
|
<div style="display: flex">
|
<vcolorpicker v-model="model_background_color"></vcolorpicker>
|
<van-field
|
style="flex: 1"
|
readonly
|
clickable
|
:label="$t('selectPage.model.TR') + '：'"
|
:value="modelValue"
|
@click="showPicker = true"
|
/>
|
</div>
|
|
<van-popup
|
v-model="showPicker"
|
@closed="getSizeValue"
|
duration="0.2"
|
round
|
position="bottom"
|
>
|
<van-picker
|
show-toolbar
|
:columns="pumpList"
|
@cancel="showPicker = false"
|
@confirm="onConfirm"
|
>
|
<template #option="item">
|
<span>{{ item.Text }}</span>
|
</template>
|
</van-picker>
|
</van-popup>
|
<div style="width: 100%; height: calc(100% - 45px); position: relative">
|
<model3D ref="model3dCtrl"></model3D>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import model3D from "@/components/model3DContainer.vue";
|
import vcolorpicker from "./vcolorpicker.vue";
|
export default {
|
name: "Model3DSizeIndex",
|
components: {
|
model3D,
|
vcolorpicker,
|
},
|
data() {
|
return {
|
pumpList: [],
|
showPicker: false,
|
modelValue: "",
|
topTitle: "型号",
|
CorpName: "型号",
|
currentFilePath: "",
|
currentPumpInfo: null, //当前泵信息
|
m_currentLawNode: "", //当前加载模型节点
|
model_background_color: "#cc",
|
isload: false,
|
isShowColorPicker: false,
|
};
|
},
|
created() {},
|
mounted() {
|
var query_data = this.$route.query;
|
|
this.currentFilePath= query_data.FilePath;
|
this.initPumpList(query_data);
|
},
|
computed: {},
|
watch: {
|
model_background_color(val) {
|
this.isload && this.$refs.model3dCtrl.setBackgroundColor(val);
|
},
|
},
|
methods: {
|
//颜色选择确认
|
confirmColor() {
|
this.isShowColorPicker = false;
|
let val = this.model_background_color;
|
this.isload && this.$refs.model3dCtrl.setBackgroundColor(val.hex);
|
},
|
initModel3D(url) {
|
if (!url) return;
|
//加载三位模型
|
let _this = this;
|
_this.isload = false;
|
//console.log(url);
|
this.$refs.model3dCtrl.loadModel(url, true, function (val) {
|
_this.isload = true;
|
_this.pumpList.length > 0 && _this.getSizeValue();
|
});
|
},
|
initPumpList(lawNode) {
|
// console.log(lawNode,111)
|
if (lawNode == null) return;
|
|
this.m_currentLawNode = lawNode;
|
var SeriesID = lawNode.SeriesID;
|
var LawID = lawNode.LawID;
|
|
if (SeriesID == null || SeriesID == 0) return;
|
if (LawID == null || LawID == 0) return;
|
let _this = this;
|
let url =
|
globalConfig.WebApiUrl.MainUrl +
|
"v1/ModelLibrary/GetFileNameList?SeriesID=" +
|
lawNode.SeriesID +
|
"&LawID=" +
|
lawNode.LawID +
|
"&Lang=0";
|
|
this.$axios({
|
url: url,
|
method: "get",
|
}).then(function (res) {
|
let resData = res.data;
|
// console.log(resData, 116);
|
|
if (resData.Code != 0) {
|
_this.$toast(resData.Message);
|
resData.Data = [];
|
}
|
let pumpList = resData.Data;
|
|
_this.pumpList = pumpList;
|
if (pumpList.length != 0) {
|
_this.modelValue = pumpList[0].Text;
|
_this.currentPumpInfo = pumpList[0];
|
let url = globalConfig.WebApiUrl.FileUrl + _this.currentFilePath;
|
//console.log(url, 146);
|
|
setTimeout(() => {
|
_this.initModel3D(url);
|
}, 200);
|
}else{
|
_this.$toast("无法获取泵列表");
|
return;
|
}
|
});
|
},
|
downloadModel3D() {
|
this.$toast("如需下载模型，请联系义维科技");
|
return;
|
let FilePath = this.currentPumpInfo.FilePath;
|
let href = globalConfig.WebApiUrl.FileUrl + FilePath;
|
let a = document.createElement("a"); // 生成一个a元素
|
let event = new MouseEvent("click"); // 创建一个单击事件
|
a.href = href; // 将生成的URL设置为a.href属性
|
a.dispatchEvent(event); // 触发a的单击事件
|
},
|
onConfirm(value, key) {
|
this.showPicker = false;
|
|
this.modelValue = value.Text;
|
this.currentPumpInfo = value;
|
let url = globalConfig.WebApiUrl.FileUrl + this.currentFilePath;
|
},
|
getSizeValue() {
|
let _this = this;
|
let lawNode = this.m_currentLawNode;
|
//
|
// console.log(lawNode,140);
|
// return;
|
if (lawNode == null) return;
|
|
if (lawNode.IsHaveDim == "false") {
|
_this.$refs.model3dCtrl.setDimDisplay(false);
|
return;
|
}
|
let SeriesID = lawNode.SeriesID;
|
let LawID = lawNode.LawID;
|
let dispPumpName = this.modelValue;
|
let fileName = dispPumpName.replace("/", "-");
|
|
if (SeriesID == null || SeriesID == 0) return;
|
if (LawID == null || LawID == 0) return;
|
let url =
|
globalConfig.WebApiUrl.MainUrl +
|
"v1/ModelLibrary/GetProductDimList?SeriesID=" +
|
SeriesID +
|
"&LawID=" +
|
LawID +
|
"&FileName=" +
|
fileName +
|
"&Lang=0";
|
this.$axios({
|
url: url,
|
method: "get",
|
}).then(function (res) {
|
let resData = res.data;
|
// console.log(resData,300)
|
if (resData.Code != 0) {
|
//_this.$toast("ssss"+resData.Message);
|
_this.$refs.model3dCtrl.setDimDisplay(false);
|
return;
|
}
|
_this.$refs.model3dCtrl.setDimDisplay(true);
|
_this.$refs.model3dCtrl.updateSizeValue(resData.Data);
|
});
|
},
|
//返回上一页
|
pageBack() {
|
this.$router.go(-1);
|
},
|
},
|
};
|
</script>
|
<style lang="scss">
|
.modelLibraryIndex_box {
|
width: 100%;
|
height: 100vh;
|
.modelLibraryIndex_main {
|
width: 100%;
|
height: calc(100% - 46px);
|
background-color: #fafafa;
|
overflow: auto;
|
margin-top: 1px;
|
.van-cell__title,
|
.van-cell__value {
|
display: flex;
|
align-items: flex-start;
|
flex-direction: column;
|
color: #36489e !important;
|
}
|
.van-index-anchor {
|
text-align: left;
|
font-weight: 600;
|
}
|
}
|
}
|
</style>
|
