调整3d细节
This commit is contained in:
11
src/assets/icons/threeLogo.svg
Normal file
11
src/assets/icons/threeLogo.svg
Normal file
@@ -0,0 +1,11 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg id="_图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 317.48 276">
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
.cls-1 {
|
||||||
|
fill: #3d3d3d;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</defs>
|
||||||
|
<path class="cls-1" d="M163.55,24.01v45c1.72.15,3.22.97,4.68,1.82,25.29,14.72,55.93,30.25,79.63,46.38,3.63,2.47,7.09,3.95,6.74,9.26l.44,87.56,42.03,21.97,1.47-.48c-1.67-3.38-6.49-11.59-6.02-14.95.43-3.07,4.76-6.02,7.72-4.83,6.02,2.42,13.49,26.46,17.23,32.78-.48,3.25-2.61,5.32-5.68,6.25-4.74,1.44-23.8,4.07-28.91,4.18-3.4.07-6.4-1-7.16-4.66-2.05-9.87,12.33-6.96,17.82-9.76l-44.27-22.35-90.3,53.84-5.1-1.82-86.04-52.02-44.27,22.35c5.79,2.51,19.81.16,17.82,9.76-.76,3.66-3.75,4.73-7.16,4.66-5.09-.11-24.21-2.74-28.91-4.18C2.36,253.86,0,251.79,0,248.51c0-1.92,12.92-30.45,14.27-31.54,3.42-2.77,8.94-1.29,10.12,2.77,1.07,3.71-4.02,12.15-5.82,15.78l1.47.48,42.03-21.97.94-91.06,1.52-2.48,89.03-51.47V24.01c-4.23,2.5-6.74,10.94-11.74,11.85-4.41.8-7.9-2.86-7.11-7.11.29-1.59,16.86-24.35,18.85-26.23,3.6-3.39,6.45-3.32,9.99,0,1.99,1.87,18.56,24.64,18.85,26.23.79,4.25-2.7,7.91-7.11,7.11-5-.91-7.51-9.35-11.74-11.85ZM235.55,126l-1.66-2.82-74.9-43.16-77.44,45.49,76.58,45.51,77.43-45.01ZM152.55,258.01v-75.5l-78-46.5v75.5l74.45,45.55,3.55.95ZM242.55,136.01l-78,46.5v75.5l3.55-.95,74.45-45.55v-75.5Z"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/assets/images/threeLoading.png
Normal file
BIN
src/assets/images/threeLoading.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 698 B |
@@ -166,9 +166,15 @@ defineExpose({open})
|
|||||||
<div class="modelBox">
|
<div class="modelBox">
|
||||||
<div class="model" ref="threeDom">
|
<div class="model" ref="threeDom">
|
||||||
</div>
|
</div>
|
||||||
|
<div class="icon" v-show="!load.state">
|
||||||
|
<SvgIcon name="threeLogo" size="40" size-unit="px" />
|
||||||
|
</div>
|
||||||
<div class="load" v-show="load.state">
|
<div class="load" v-show="load.state">
|
||||||
<i class="fi fi-rr-cubes"></i>
|
<i class="fi fi-rr-cubes"></i>
|
||||||
<div class="text">Load...</div>
|
<div class="text">
|
||||||
|
<img src="@/assets/images/threeLoading.png" alt="">
|
||||||
|
{{ $t('threeModel.loading') }}
|
||||||
|
</div>
|
||||||
<div class="loadBox">
|
<div class="loadBox">
|
||||||
<div class="schedule" :style="{width:load.progress+'%'}"></div>
|
<div class="schedule" :style="{width:load.progress+'%'}"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -190,30 +196,49 @@ defineExpose({open})
|
|||||||
border: 1px solid #D9D9D9;
|
border: 1px solid #D9D9D9;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
> .icon{
|
||||||
|
position: absolute;
|
||||||
|
bottom: 2.4rem;
|
||||||
|
right: 2.4rem;
|
||||||
|
}
|
||||||
> .load{
|
> .load{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
background: rgba(0, 0, 0, .2);
|
background: #e6e6e6;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
> .text{
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
line-height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #747474;
|
||||||
|
> img{
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
> i{
|
> i{
|
||||||
font-size: 3rem;
|
font-size: 3rem;
|
||||||
}
|
}
|
||||||
> .loadBox{
|
> .loadBox{
|
||||||
width: 15rem;
|
width: 26rem;
|
||||||
height: 1rem;
|
height: 1rem;
|
||||||
border-radius: 1rem;
|
border-radius: 3.3rem;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
margin-top: 1.2rem;
|
||||||
> .schedule{
|
> .schedule{
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background: greenyellow;
|
border-radius: 3.3rem;
|
||||||
|
background: #848484;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -80,7 +80,7 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
font-size: 6px;
|
font-size: 9px;
|
||||||
color: #000;
|
color: #000;
|
||||||
border: 1px solid #d9d9d9;
|
border: 1px solid #d9d9d9;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|||||||
@@ -26,7 +26,7 @@
|
|||||||
default: '63vw'
|
default: '63vw'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const showDialog = ref(false)
|
const showDialog = ref(true)
|
||||||
const open = (url_: any) => {
|
const open = (url_: any) => {
|
||||||
showDialog.value = true
|
showDialog.value = true
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -187,5 +187,9 @@ export default {
|
|||||||
},
|
},
|
||||||
assistant: {
|
assistant: {
|
||||||
inputPlaceholder: 'Ask anything',
|
inputPlaceholder: 'Ask anything',
|
||||||
|
},
|
||||||
|
//3d面板
|
||||||
|
threeModel: {
|
||||||
|
loading: 'Loading',
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -182,5 +182,9 @@ export default {
|
|||||||
},
|
},
|
||||||
assistant: {
|
assistant: {
|
||||||
inputPlaceholder: '请输入'
|
inputPlaceholder: '请输入'
|
||||||
|
},
|
||||||
|
//3d面板
|
||||||
|
threeModel: {
|
||||||
|
loading: '加载中',
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user