|
@@ -63,12 +63,14 @@ |
|
|
<div class="left-bottom"> |
|
|
<div class="left-bottom"> |
|
|
<div class="tab flex"> |
|
|
<div class="tab flex"> |
|
|
<div |
|
|
<div |
|
|
|
|
|
class="pointer" |
|
|
:class="showFace == 0 ? 'tabAvtive' : ''" |
|
|
:class="showFace == 0 ? 'tabAvtive' : ''" |
|
|
@click="ChangeShowFaceList(0)" |
|
|
@click="ChangeShowFaceList(0)" |
|
|
> |
|
|
> |
|
|
{{ $t("createVideo.availableMould") }} |
|
|
{{ $t("createVideo.availableMould") }} |
|
|
</div> |
|
|
</div> |
|
|
<div |
|
|
<div |
|
|
|
|
|
class="pointer" |
|
|
:class="showFace == 1 ? 'tabAvtive' : ''" |
|
|
:class="showFace == 1 ? 'tabAvtive' : ''" |
|
|
@click="ChangeShowFaceList(1)" |
|
|
@click="ChangeShowFaceList(1)" |
|
|
> |
|
|
> |
|
@@ -76,6 +78,13 @@ |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="faceList"> |
|
|
<div class="faceList"> |
|
|
|
|
|
<!-- 上传图片组件 --> |
|
|
|
|
|
<div v-if="showFace == 1" class="faceItem"> |
|
|
|
|
|
<span class="uploadImg" |
|
|
|
|
|
>+ |
|
|
|
|
|
<input class="pointer" type="file" @change="lookImg" /> |
|
|
|
|
|
</span> |
|
|
|
|
|
</div> |
|
|
<div |
|
|
<div |
|
|
class="faceItem pointer" |
|
|
class="faceItem pointer" |
|
|
@click="setImgUrl(item.material)" |
|
|
@click="setImgUrl(item.material)" |
|
@@ -289,7 +298,6 @@ const AiFaceList = ref([]); |
|
|
function getAiFaceList(pageNum, pageSize) { |
|
|
function getAiFaceList(pageNum, pageSize) { |
|
|
personPhotoList(pageNum, pageSize) |
|
|
personPhotoList(pageNum, pageSize) |
|
|
.then((res) => { |
|
|
.then((res) => { |
|
|
console.log(res, "res"); |
|
|
|
|
|
AiFaceList.value = res.data.list; |
|
|
AiFaceList.value = res.data.list; |
|
|
}) |
|
|
}) |
|
|
.catch((err) => { |
|
|
.catch((err) => { |
|
@@ -427,7 +435,8 @@ onMounted(() => { |
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
<style lang="scss" scoped> |
|
|
.page { |
|
|
.page { |
|
|
height: 1200px; |
|
|
|
|
|
|
|
|
// height: 1200px; |
|
|
|
|
|
height: calc(100vh - 80px); |
|
|
padding: 20px 0 0 40px; |
|
|
padding: 20px 0 0 40px; |
|
|
background-color: #fff; |
|
|
background-color: #fff; |
|
|
border-radius: 25px 0 0; |
|
|
border-radius: 25px 0 0; |
|
@@ -455,7 +464,8 @@ onMounted(() => { |
|
|
&-top { |
|
|
&-top { |
|
|
position: relative; |
|
|
position: relative; |
|
|
width: 100%; |
|
|
width: 100%; |
|
|
height: 65%; |
|
|
|
|
|
|
|
|
// height: 65%; |
|
|
|
|
|
height: 600px; |
|
|
|
|
|
|
|
|
.uploadBtn { |
|
|
.uploadBtn { |
|
|
position: relative; |
|
|
position: relative; |
|
@@ -590,12 +600,31 @@ onMounted(() => { |
|
|
height: 160px; |
|
|
height: 160px; |
|
|
overflow-y: scroll; |
|
|
overflow-y: scroll; |
|
|
.faceItem { |
|
|
.faceItem { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
margin-right: 10px; |
|
|
|
|
|
margin-bottom: 10px; |
|
|
width: 150px; |
|
|
width: 150px; |
|
|
height: 150px; |
|
|
height: 150px; |
|
|
padding: 0 25px; |
|
|
padding: 0 25px; |
|
|
line-height: 30px; |
|
|
|
|
|
|
|
|
line-height: 150px; |
|
|
text-align: center; |
|
|
text-align: center; |
|
|
|
|
|
|
|
|
|
|
|
border-radius: 50%; |
|
|
|
|
|
border: 2px solid #000; |
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
input { |
|
|
|
|
|
position: absolute; |
|
|
|
|
|
top: 0; |
|
|
|
|
|
left: 0; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 100%; |
|
|
|
|
|
opacity: 0; |
|
|
|
|
|
} |
|
|
|
|
|
.uploadImg { |
|
|
|
|
|
line-height: 145px; |
|
|
|
|
|
font-size: 50px; |
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
text-align: center; |
|
|
|
|
|
} |
|
|
p { |
|
|
p { |
|
|
height: 30px; |
|
|
height: 30px; |
|
|
} |
|
|
} |
|
@@ -605,7 +634,6 @@ onMounted(() => { |
|
|
.img { |
|
|
.img { |
|
|
width: 100px; |
|
|
width: 100px; |
|
|
height: 100px; |
|
|
height: 100px; |
|
|
// background-color: green; |
|
|
|
|
|
border-radius: 50%; |
|
|
border-radius: 50%; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|