fix
This commit is contained in:
@@ -661,12 +661,11 @@ export default defineComponent({
|
||||
});
|
||||
},
|
||||
setGenerate(dataList:any){
|
||||
|
||||
let data = dataList
|
||||
let dataNum = dataList.length
|
||||
let state = true
|
||||
this.generateTime = setInterval(()=>{
|
||||
if(!this.isGenerate || !this.remGenerate)return
|
||||
if(!this.isGenerate)return
|
||||
if(!state)return
|
||||
state = false
|
||||
Https.axiosPost(Https.httpUrls.generateResult, data).then(
|
||||
|
||||
@@ -46,6 +46,9 @@
|
||||
<div class="modelBox">
|
||||
<div class="img">
|
||||
<img :src="selectModel.threeDPatternLayoutUrl" alt="">
|
||||
<div class="btn">
|
||||
<i class="fi fi-bs-expand-arrows-alt" @click.stop="openScaleImage()"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gallery_btn" @click="openDown()">Download</div>
|
||||
@@ -53,6 +56,7 @@
|
||||
<div class="download">
|
||||
<download ref="download"></download>
|
||||
</div>
|
||||
<scaleImage ref="scaleImage"></scaleImage>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
@@ -63,9 +67,10 @@ import { useStore } from "vuex";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import threeBox from "./three.vue"
|
||||
import download from "./download.vue"
|
||||
import scaleImage from "@/component/HomePage/scaleImage.vue";
|
||||
export default defineComponent({
|
||||
components:{
|
||||
threeBox,download
|
||||
threeBox,download,scaleImage
|
||||
},
|
||||
props:{
|
||||
},
|
||||
@@ -101,7 +106,7 @@ export default defineComponent({
|
||||
const setSelectModel = (item:any)=>{
|
||||
data.isShowMark = true
|
||||
const value = {
|
||||
threeDSimpleId:item.id,
|
||||
threeDSimpleId:item.threeDSimpleId,
|
||||
}
|
||||
Https.axiosPost(Https.httpUrls.getLayoutDetail,{},{params:value}).then((res:any)=>{
|
||||
data.selectModel = res
|
||||
@@ -122,11 +127,12 @@ export default defineComponent({
|
||||
const dataDom = reactive({
|
||||
threeBox:null as any,
|
||||
download:null as any,
|
||||
scaleImage:null as any,
|
||||
})
|
||||
const openSetData = ()=>{
|
||||
nextTick(()=>{
|
||||
let id = store.state.HomeStoreModule.patternMaking3D.threeDsimpleId
|
||||
if(id && data.selectModel.id == -1)setSelectModel({id})
|
||||
if(id && data.selectModel.id == -1)setSelectModel({threeDSimpleId:id})
|
||||
})
|
||||
setTimeout(()=>{
|
||||
data.maskShow = true
|
||||
@@ -177,6 +183,11 @@ export default defineComponent({
|
||||
const setMaterial = (item:any)=>{
|
||||
dataDom.threeBox.addMaterial(item)
|
||||
}
|
||||
const openScaleImage = ()=>{
|
||||
let scaleImage:any = dataDom.scaleImage
|
||||
scaleImage.isLike = false
|
||||
scaleImage.init([{imgUrl:data.selectModel.threeDPatternLayoutUrl}],0)
|
||||
}
|
||||
return{
|
||||
...toRefs(dataDom),
|
||||
...toRefs(data),
|
||||
@@ -187,6 +198,7 @@ export default defineComponent({
|
||||
openDown,
|
||||
setLibraryOrModel,
|
||||
setMaterial,
|
||||
openScaleImage
|
||||
}
|
||||
},
|
||||
directives:{
|
||||
@@ -322,6 +334,15 @@ export default defineComponent({
|
||||
>.img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
> .btn{
|
||||
position: absolute;
|
||||
right: 2rem;
|
||||
top: 2rem;
|
||||
> i{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@@ -2,28 +2,30 @@
|
||||
<div class="three">
|
||||
<div class="parameter">
|
||||
<label>
|
||||
<span>X:</span>
|
||||
<span>scaleX:</span>
|
||||
<a-slider class="system_silder"
|
||||
v-model:value="repeat.x"
|
||||
:tooltipVisible="false"
|
||||
@change="changeRepeat"
|
||||
:max="2"
|
||||
:max="6"
|
||||
:step="0.001"
|
||||
:min="0.002"
|
||||
>
|
||||
</a-slider>
|
||||
</label>
|
||||
<label>
|
||||
<span>Y:</span>
|
||||
<span>scaleY:</span>
|
||||
<a-slider class="system_silder"
|
||||
v-model:value="repeat.y"
|
||||
:tooltipVisible="false"
|
||||
@change="changeRepeat"
|
||||
:max="2"
|
||||
:step="0.01"
|
||||
:max="6"
|
||||
:min="0.002"
|
||||
:step="0.001"
|
||||
>
|
||||
</a-slider>
|
||||
</label>
|
||||
<i class="fi fi-br-link" :class="{'fi-br-link':isLock,'fi-bs-link-slash':!isLock}" @click="setLock"></i>
|
||||
</div>
|
||||
<div class="model" ref="threeDom">
|
||||
|
||||
@@ -81,6 +83,7 @@ export default defineComponent({
|
||||
y:1,
|
||||
},
|
||||
animationId:null as any,
|
||||
isLock:false,
|
||||
})
|
||||
const dataDom = reactive({
|
||||
threeDom:null as any,
|
||||
@@ -255,11 +258,14 @@ export default defineComponent({
|
||||
// 3. 配置纹理参数
|
||||
texture.wrapS = THREE.RepeatWrapping;
|
||||
texture.wrapT = THREE.RepeatWrapping;
|
||||
// texture.wrapS = THREE.ClampToEdgeWrapping; // 水平方向不重复
|
||||
// texture.wrapT = THREE.ClampToEdgeWrapping; // 垂直方向不重复
|
||||
|
||||
// texture.repeat.set(1, 1); // 纹理重复次数
|
||||
texture.anisotropy = 32; // 提高纹理清晰度
|
||||
data.group?.traverse((child:any) => {
|
||||
if (child.isMesh) {
|
||||
console.log(child.name)
|
||||
// 5. 创建新材质(根据需求选择材质类型)
|
||||
const textureWidth = texture.image.width;
|
||||
const textureHeight = texture.image.height;
|
||||
@@ -281,13 +287,40 @@ export default defineComponent({
|
||||
metalness: .2, // 金属质感 (0-1)
|
||||
side: THREE.DoubleSide // 双面渲染
|
||||
});
|
||||
// 6. 替换原有材质
|
||||
child.material = newMaterial;
|
||||
// 7. 如果需要单独控制某些子模型的UV
|
||||
if (child.geometry.attributes.uv) {
|
||||
// 可以在这里修改UV坐标
|
||||
const uvs = child.geometry.attributes.uv.array;
|
||||
// ...UV操作逻辑...
|
||||
// 计算UV边界
|
||||
let minU = Infinity, maxU = -Infinity;
|
||||
let minV = Infinity, maxV = -Infinity;
|
||||
|
||||
for (let i = 0; i < uvs.length; i += 2) {
|
||||
minU = Math.min(minU, uvs[i]);
|
||||
maxU = Math.max(maxU, uvs[i]);
|
||||
minV = Math.min(minV, uvs[i+1]);
|
||||
maxV = Math.max(maxV, uvs[i+1]);
|
||||
}
|
||||
|
||||
const uvWidth = maxU - minU;
|
||||
const uvHeight = maxV - minV;
|
||||
// 仅对非小UV区域设置材质
|
||||
if (!(uvWidth < 1.2 || uvHeight < 1.2)) {
|
||||
const newMaterial = new THREE.MeshStandardMaterial({
|
||||
map: texture,
|
||||
roughness: 0.7,
|
||||
metalness: 0.2,
|
||||
side: THREE.DoubleSide
|
||||
});
|
||||
child.material = newMaterial;
|
||||
}else{
|
||||
// child.material = new THREE.MeshStandardMaterial({
|
||||
// transparent: true,
|
||||
// opacity: 0, // 完全透明
|
||||
// side: THREE.DoubleSide
|
||||
// });
|
||||
}
|
||||
|
||||
child.geometry.attributes.uv.needsUpdate = true;
|
||||
}
|
||||
}
|
||||
data.load.state = false
|
||||
@@ -391,9 +424,14 @@ export default defineComponent({
|
||||
data.load.state = false
|
||||
}
|
||||
const changeRepeat = (e:any)=>{
|
||||
if(data.isLock)data.repeat.x = e
|
||||
if(data.isLock)data.repeat.y = e
|
||||
clearTimeout(dataTime.updataRepeat)
|
||||
dataTime.updataRepeat = setTimeout(()=>{
|
||||
data.textureLoader.repeat.set(2 - data.repeat.x,2 - data.repeat.y); // 纹理重复次数
|
||||
data.repeat.x = data.repeat.x == 6 ? 5.999 : data.repeat.x
|
||||
data.repeat.y = data.repeat.y == 6 ? 5.999 : data.repeat.y
|
||||
|
||||
data.textureLoader.repeat.set(6 - data.repeat.x,6 - data.repeat.y); // 纹理重复次数
|
||||
let value = {
|
||||
x:data.repeat.x,
|
||||
y:data.repeat.y,
|
||||
@@ -401,6 +439,9 @@ export default defineComponent({
|
||||
store.commit('setPatternMaking3D',value)
|
||||
},1000)
|
||||
}
|
||||
const setLock = ()=>{
|
||||
data.isLock = !data.isLock
|
||||
}
|
||||
onMounted(()=>{
|
||||
})
|
||||
onBeforeUnmount(()=>{
|
||||
@@ -432,6 +473,7 @@ export default defineComponent({
|
||||
openSetData,
|
||||
addMaterial,
|
||||
changeRepeat,
|
||||
setLock,
|
||||
}
|
||||
},
|
||||
provide() {
|
||||
@@ -449,6 +491,7 @@ export default defineComponent({
|
||||
overflow: hidden;
|
||||
> .parameter{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> label{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -462,6 +505,17 @@ export default defineComponent({
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
> i{
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
&.active{
|
||||
opacity: .7;
|
||||
}
|
||||
}
|
||||
}
|
||||
> .model{
|
||||
width: 100%;
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="gender marginBottom" v-if="show.age">
|
||||
<div class="text">Age</div>
|
||||
<div class="text">Role</div>
|
||||
<div class="radio">
|
||||
<label>
|
||||
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Adult">
|
||||
|
||||
Reference in New Issue
Block a user