Your Creation详情页
This commit is contained in:
@@ -1,14 +1,18 @@
|
||||
<script setup lang="ts">
|
||||
import HeaderTitle from '@/components/HeaderTitle.vue'
|
||||
import FooterNavigation from '@/components/FooterNavigation.vue'
|
||||
import { ref } from 'vue'
|
||||
import GenerateLoading from '@/views/asistant/components/GenerateLoading.vue'
|
||||
import { ref,onMounted } from 'vue'
|
||||
const emit = defineEmits(['viewType'])
|
||||
import { useRouter } from 'vue-router'
|
||||
const router = useRouter()
|
||||
|
||||
const inputText = ref('')
|
||||
const isLoved = ref(false)
|
||||
|
||||
const loading = ref(true)
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 500);
|
||||
const onSend = () => {
|
||||
if (inputText.value === '') return
|
||||
const text = inputText.value
|
||||
@@ -34,40 +38,50 @@
|
||||
|
||||
<template>
|
||||
<header-title style-type="2" />
|
||||
<div class="customize">
|
||||
<div class="title">Customize your Look!</div>
|
||||
<p class="tip">Refine your Look</p>
|
||||
<div class="input-box">
|
||||
<div class="help">?</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="inputText"
|
||||
@keyup.enter="onSend"
|
||||
placeholder="Try: “Change background to Tokyo City”"
|
||||
/>
|
||||
<div class="send" @click="onSend"><SvgIcon name="send" size="48" /></div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<img src="@/assets/images/workshop/posture/posture_1.png" />
|
||||
<!-- <div class="select-box">
|
||||
<div class="loading" v-if="loading"><generate-loading /></div>
|
||||
<template v-else>
|
||||
<div class="customize">
|
||||
<div class="title">Customize your Look!</div>
|
||||
<p class="tip">Refine your Look</p>
|
||||
<div class="input-box">
|
||||
<div class="help">?</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="inputText"
|
||||
@keyup.enter="onSend"
|
||||
placeholder="Try: “Change background to Tokyo City”"
|
||||
/>
|
||||
<div class="send" @click="onSend"><SvgIcon name="send" size="48" /></div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<img src="@/assets/images/workshop/posture/posture_1.png" />
|
||||
<!-- <div class="select-box">
|
||||
<div class="icon"><SvgIcon name="history" size="35" /></div>
|
||||
<div class="label">History</div>
|
||||
<div class="icon"><SvgIcon name="xialajiantou" size="29" /></div>
|
||||
</div> -->
|
||||
<div class="icons">
|
||||
<div @click="onLove"><SvgIcon :name="`love_${isLoved ? 1 : 0}`" size="35" /></div>
|
||||
<div @click="onReload"><SvgIcon name="reload" size="35" /></div>
|
||||
<!-- <div @click="onDownload"><SvgIcon name="download" size="35" /></div> -->
|
||||
<div class="icons">
|
||||
<div @click="onLove"><SvgIcon :name="`love_${isLoved ? 1 : 0}`" size="35" /></div>
|
||||
<div @click="onReload"><SvgIcon name="reload" size="35" /></div>
|
||||
<!-- <div @click="onDownload"><SvgIcon name="download" size="35" /></div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<button @click="onFinish">Finish</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<button @click="onFinish">Finish</button>
|
||||
</div>
|
||||
</div>
|
||||
<footer-navigation />
|
||||
<footer-navigation />
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.loading{
|
||||
width: 100%;
|
||||
margin-top: 36.6rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.customize {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
@@ -189,6 +203,7 @@
|
||||
box-sizing: content-box;
|
||||
font-family: satoshiRegular;
|
||||
// margin: 0 1.8rem;
|
||||
border: none;
|
||||
margin: 0 5.2rem 0 auto;
|
||||
width: 23.8rem;
|
||||
height: 6.9rem;
|
||||
|
||||
Reference in New Issue
Block a user