布局修改 部分bug修复
This commit is contained in:
X1627315083
@@ -285,7 +285,6 @@ export default defineComponent({
|
||||
|
||||
.menu_title{
|
||||
font-size: 1.8rem;
|
||||
font-family: Adobe Heiti Std;
|
||||
font-weight: normal;
|
||||
color: #808185;
|
||||
}
|
||||
|
||||
@@ -3,14 +3,20 @@
|
||||
<div class="leftBox" :class="{leftHide:leftShow}">
|
||||
<div class="left">
|
||||
<div class="title">
|
||||
<span>AiDA</span>
|
||||
<!-- <span>AiDA</span> -->
|
||||
<img src="@/assets/images/homePage/aidaIcon.png" alt="">
|
||||
<svg @click="()=>leftShow=!leftShow" class="leftShowOrHide" xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 24 24" data-v-1c7326d6=""><path fill-rule="evenodd" d="M6 5a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h2V5H6Zm4 0v14h8a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1h-8ZM3 6a3 3 0 0 1 3-3h12a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6Z" clip-rule="evenodd" data-v-1c7326d6=""></path></svg>
|
||||
</div>
|
||||
<div class="newObj marginT2" @click="newProject">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 25 24"><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12.5 5v14m-7-7h14"></path></svg>
|
||||
<div class="newObj" @click="newProject">
|
||||
<!-- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 25 24"><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12.5 5v14m-7-7h14"></path></svg> -->
|
||||
|
||||
<svg width="19" height="16" viewBox="0 0 19 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<line x1="9.83398" y1="1" x2="9.83398" y2="15" stroke="black" stroke-width="4" stroke-linecap="round"/>
|
||||
<path d="M1.5 8H17.5" stroke="black" stroke-width="4" stroke-linecap="round"/>
|
||||
</svg>
|
||||
<p>{{$t('Header.NewProject')}}</p>
|
||||
</div>
|
||||
<div class="navList marginT2">
|
||||
<div class="navList ">
|
||||
<div class="tools list" v-for="item in openTypeList" :class="{active:openType == item.value,history:item.value == 'history'}">
|
||||
|
||||
<div class="titleBox" @click="setOpenType(item.value,item.list)">
|
||||
@@ -42,9 +48,10 @@
|
||||
<span :title="childItem.name" v-show="!childItem.editName">{{ childItem.name }}</span>
|
||||
<textarea v-model="historyData.historyTextarea" v-show="childItem.editName" @click.stop></textarea>
|
||||
</div>
|
||||
<div class="type" v-if="childItem.process == 'THREE_D_PLATE_MAKING'">3D Pattern Making</div>
|
||||
<div class="type" v-else>{{ childItem.process.replace(/_/g, ' ').toLowerCase().replace(/\b\w/g, char => char.toUpperCase()) }}</div>
|
||||
<div class="time">{{ childItem.updateTime.replace('T', ' ') }}</div>
|
||||
<!-- <div class="type" v-if="childItem.process == 'THREE_D_PLATE_MAKING'">3D Pattern Making</div>
|
||||
<div class="type" v-else>{{ childItem.process.replace(/_/g, ' ').toLowerCase().replace(/\b\w/g, char => char.toUpperCase()) }}</div> -->
|
||||
<div class="type">{{ $t(`Header.${childItem.process}`) }}</div>
|
||||
<div class="time">{{ childItem?.updateTime?.replace('T', ' ') }}</div>
|
||||
<div class="btn">
|
||||
<i class="fi fi-br-menu-dots-vertical" v-show="!childItem.editName" @click.stop="editHistory(childItem,index,$event,item[historyTypeItem])"></i>
|
||||
<i class="fi fi-br-check" v-show="childItem.editName" @click.stop="accomplishHistory(childItem,index,$event)"></i>
|
||||
@@ -57,10 +64,10 @@
|
||||
<i class="fi fi-rr-settings-sliders"></i>
|
||||
<span>{{$t('Header.Setting')}}</span>
|
||||
</div>
|
||||
<div class="item" v-if="bathGenerationList.indexOf(childItem.process)>-1" @click.stop="bathGeneration(childItem)">
|
||||
<!-- <div class="item" v-if="bathGenerationList.indexOf(childItem.process)>-1" @click.stop="bathGeneration(childItem)">
|
||||
<i class="fi fi-rr-cloud-upload-alt"></i>
|
||||
<span>{{$t('Header.BatchGeneration')}}</span>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="item" @click.stop="deleteItem(childItem)">
|
||||
<i class="icon iconfont icon-shanchu operate_icon"></i>
|
||||
<span>{{$t('Header.Delete')}}</span>
|
||||
@@ -82,14 +89,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="navListBottom">
|
||||
<div class="tools marginT2 marginB2 list" :class="{active:$route.name == 'cloud'}" @click="()=>$router.push('/home/cloud')">
|
||||
<!-- <div class="tools marginT2 marginB2 list" :class="{active:$route.name == 'cloud'}" @click="()=>$router.push('/home/cloud')">
|
||||
<div class="titleBox" style="margin-bottom: 0;">
|
||||
<div class="left">
|
||||
<i class="fi fi-rr-cloud-upload-alt"></i>
|
||||
<span>{{$t('Header.BatchGeneration')}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="tools list" :class="{active:isLanguage}">
|
||||
<div class="titleBox" @click="()=>isLanguage = !isLanguage">
|
||||
<div class="left">
|
||||
@@ -110,22 +117,12 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homeMain_right_content">
|
||||
<div
|
||||
class="button_second credits hideChecked"
|
||||
>
|
||||
{{$t('Header.Credits')}}:
|
||||
<span :title="credits">
|
||||
<div class="credits_item" v-for="item in String(credits)" :style="{'transform': 'translateY('+item*-100+'%)'}">
|
||||
<div v-if="item != '.'" v-for="numItem in 10">{{ numItem-1 }}</div>
|
||||
<div v-else>{{item}}</div>
|
||||
</div>
|
||||
</span>
|
||||
<i @click="getCredits" class="fi fi-br-refresh" :class="[activeCredits?'active':'']"></i>
|
||||
<i @click="UpgradePlan" title="Purchase" class="fi fi-rr-shop"></i>
|
||||
</div>
|
||||
<div class="segmentation"></div>
|
||||
<div v-if="userDetail.systemUser != 0 || userDetail.systemUser == 3" @click="openUpgradeToPro" class="gallery_btn gallery_btn_radius" style="width: 100%;display: flex;justify-content: center;align-items: center;">
|
||||
|
||||
<i class="fi fi-br-dollar" style="margin-right: .6rem;display: flex;"></i>
|
||||
{{$t('Header.openUpgrade')}}
|
||||
</div>
|
||||
<div v-if="userDetail.systemUser != 0 || userDetail.systemUser == 3" @click="openUpgradeToPro" class="gallery_btn gallery_btn_radius" style="width: 100%;">{{$t('Header.openUpgrade')}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightBox">
|
||||
@@ -139,21 +136,39 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="trialApproval">
|
||||
<div class="message_iconItem" style="display: flex;margin-left: .5rem">
|
||||
<div class="message_iconItem" style="display: flex;">
|
||||
<i class="fi fi-rs-interrogation" style="font-size: 2.4rem" @click="toUserManual"></i>
|
||||
</div>
|
||||
<div class="message_iconItem" style="display: flex;">
|
||||
<a-badge :count="messageNum">
|
||||
<i class="fi fi-rr-envelope" style="font-size: 2rem" @click="openMessage"></i>
|
||||
<i class="fi fi-rr-envelope" style="font-size: 2.4rem" @click="openMessage"></i>
|
||||
</a-badge>
|
||||
</div>
|
||||
<div class="message_iconItem" style="display: flex;margin-left: .5rem">
|
||||
<div class="message_iconItem" style="display: flex;">
|
||||
<a-badge :count="messageType?.newPosted">
|
||||
<!-- <i class="fi fi-rr-envelope" @click="openMessage"></i> -->
|
||||
<i class="fi fi-rr-bell" style="font-size: 2rem" @click.stop="openNewPosted"></i>
|
||||
<i class="fi fi-rr-bell" style="font-size: 2.4rem" @click.stop="openNewPosted"></i>
|
||||
</a-badge>
|
||||
<div class="message_iconItem_value select_block" v-show="isNewPosted" style="width: 40rem">
|
||||
<newPosted ref="newPosted"></newPosted>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homeMain_right_content">
|
||||
<div
|
||||
class="button_second credits hideChecked"
|
||||
>
|
||||
{{$t('Header.Credits')}}:
|
||||
<span :title="credits">
|
||||
<div class="credits_item" v-for="item in String(credits)" :style="{'transform': 'translateY('+item*-100+'%)'}">
|
||||
<div v-if="item != '.'" v-for="numItem in 10">{{ numItem-1 }}</div>
|
||||
<div v-else>{{item}}</div>
|
||||
</div>
|
||||
</span>
|
||||
<i @click="getCredits" class="fi fi-br-refresh" :class="[activeCredits?'active':'']"></i>
|
||||
<i @click="UpgradePlan" title="Purchase" class="fi fi-rr-shop"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homeMain_user">
|
||||
<div class="homeMain_user_icon" @click="openAccount">
|
||||
<img :src="userDetail.avatar" alt="">
|
||||
@@ -178,8 +193,8 @@
|
||||
<div class="homeMain_subscribe">
|
||||
<div>
|
||||
<span class="font">Status</span>
|
||||
<span v-if="userDetail.timeData.isExpiration" class="stateSucsess font">Valid <i class="fi fi-ss-check-circle"></i></span>
|
||||
<span v-else class="stateError font">Expire <i class="fi fi-ss-check-circle"></i></span>
|
||||
<span v-if="userDetail.timeData.isExpiration" class="stateSucsess font">{{$t('account.Valid')}} <i class="fi fi-ss-check-circle"></i></span>
|
||||
<span v-else class="stateError font">{{$t('account.Expire')}} <i class="fi fi-ss-check-circle"></i></span>
|
||||
<span class="time">{{ userDetail.timeData.text }}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -243,6 +258,8 @@
|
||||
<!-- 进行续订 -->
|
||||
<renew ref="renew"></renew>
|
||||
<projectSetting ref="projectSetting" @getHistory="settingGetHistory"></projectSetting>
|
||||
<!-- 未绑定邮箱弹窗 -->
|
||||
<bindEmail ref="bindEmail"></bindEmail>
|
||||
</div>
|
||||
</template>
|
||||
<script >
|
||||
@@ -250,7 +267,6 @@ import { defineComponent, createVNode, ref,toRefs, reactive, computed, onMounted
|
||||
import { isEmail } from "@/tool/util";
|
||||
import { setCookie, getCookie, WriteCookie,clonAllCookie } from "@/tool/cookie";
|
||||
import payOrder from "@/component/Pay/payOrder.vue";
|
||||
import VerificationCodeInput from "@/component/LoginPage/verificationCodeInput.vue";
|
||||
import renew from "@/component/HomePage/renew.vue";
|
||||
// import Habit from "@/component/Detail/habit.vue";
|
||||
import TaskPage from "@/component/HomePage/TaskPage.vue";
|
||||
@@ -273,9 +289,10 @@ import { useRouter,useRoute } from 'vue-router'
|
||||
import {openTypeList} from "@/tool/listData.js";
|
||||
import home from "@/component/home/index.vue";
|
||||
import projectSetting from '@/component/home/newProject/setting.vue'
|
||||
import bindEmail from "@/component/HomePage/bindEmail.vue";
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
VerificationCodeInput,
|
||||
renew,
|
||||
// Habit,
|
||||
RobotAssist,
|
||||
@@ -286,6 +303,7 @@ export default defineComponent({
|
||||
TaskPage,
|
||||
home,
|
||||
projectSetting,
|
||||
bindEmail,
|
||||
},
|
||||
setup(){
|
||||
const store = useStore();
|
||||
@@ -438,6 +456,10 @@ export default defineComponent({
|
||||
const openUpgradeToPro = ()=>{
|
||||
renew.value.init()
|
||||
}
|
||||
const toUserManual = ()=>{
|
||||
const route = router.resolve({ name: 'userManual' });
|
||||
window.open(route.href, '_blank');
|
||||
}
|
||||
onMounted(async ()=>{
|
||||
if((route.query?.id || route.query?.history) && !await getIdExistToHistory()){
|
||||
router.push('/home')
|
||||
@@ -516,7 +538,7 @@ export default defineComponent({
|
||||
const setHistory = (item,childItem)=>{
|
||||
// router.push(`/home/tools?tools=toProduct&id=${childItem.id}`)
|
||||
if(childItem.process == 'SERIES_DESIGN' || childItem.process == "SINGLE_DESIGN"){
|
||||
router.push(`/home?history=${childItem.id}`)
|
||||
router.push(`/home?history=${childItem?.id}`)
|
||||
}else{
|
||||
let processList = {
|
||||
toProduct:'TO_PRODUCT_IMAGE',
|
||||
@@ -689,6 +711,7 @@ export default defineComponent({
|
||||
}
|
||||
const setting = (item)=>{
|
||||
homeMainData.projectSetting.init(item)
|
||||
homeMainData.historyData.selectHistoryId = -1
|
||||
}
|
||||
const accomplishHistory = (item)=>{
|
||||
let data = {
|
||||
@@ -744,6 +767,7 @@ export default defineComponent({
|
||||
accomplishHistory,
|
||||
newProject,
|
||||
bathGeneration,
|
||||
toUserManual,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@@ -969,7 +993,7 @@ export default defineComponent({
|
||||
);
|
||||
},
|
||||
setLang(v){
|
||||
|
||||
this.getLangIsShowMark = true
|
||||
Https.axiosGet(Https.httpUrls.changeUserLanguage,{params:{language:v}}).then((rv) => {
|
||||
if (rv) {
|
||||
if (rv) {
|
||||
@@ -982,10 +1006,13 @@ export default defineComponent({
|
||||
// this.$router.push("/home")
|
||||
// }
|
||||
this.store.commit('clearAllData')
|
||||
// window.location.reload()
|
||||
window.location.href = '/home';
|
||||
window.location.reload()
|
||||
// window.location.href = '/home';
|
||||
}
|
||||
this.getLangIsShowMark = false
|
||||
}
|
||||
}).catch(()=>{
|
||||
this.getLangIsShowMark = false
|
||||
})
|
||||
},
|
||||
|
||||
@@ -1016,15 +1043,16 @@ export default defineComponent({
|
||||
height: 100%;
|
||||
background: #f5f5f5;
|
||||
overflow: hidden;
|
||||
width: 26rem;
|
||||
width: 29.5rem;
|
||||
transition: width .3s;
|
||||
&.leftHide{
|
||||
width: 0;
|
||||
}
|
||||
> .left{
|
||||
width: 26rem;
|
||||
// width: 26rem;
|
||||
width: 29.5rem;
|
||||
height: 100%;
|
||||
padding: 2rem;
|
||||
padding: 2.4rem 2.2rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.marginT2{
|
||||
@@ -1058,24 +1086,26 @@ export default defineComponent({
|
||||
> .titleBox{
|
||||
padding: 1.2rem;
|
||||
display: flex;
|
||||
font-size: 1.4rem;
|
||||
font-size: 1.8rem;
|
||||
cursor: pointer;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: 600;
|
||||
font-weight: 500;
|
||||
i{
|
||||
display: flex;
|
||||
font-size: 1.8rem;
|
||||
}
|
||||
> .left{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> i{
|
||||
margin-right: .8rem;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
> span{
|
||||
line-height: 2.4rem;
|
||||
color: #52525b;
|
||||
// color: #52525b;
|
||||
transition: all .3s;
|
||||
color: #000000BF;
|
||||
}
|
||||
}
|
||||
> .right{
|
||||
@@ -1098,6 +1128,7 @@ export default defineComponent({
|
||||
> .detail{
|
||||
position: relative;
|
||||
height: 100%;
|
||||
padding: 0 .5rem;
|
||||
> img{
|
||||
width: 100%;
|
||||
}
|
||||
@@ -1110,8 +1141,10 @@ export default defineComponent({
|
||||
}
|
||||
.detailItem{
|
||||
cursor: pointer;
|
||||
padding: 1.2rem 1.1rem 1.2rem 2.2rem;
|
||||
font-size: 1.4rem;
|
||||
padding: .8rem;
|
||||
// padding: 1.2rem 1.1rem 1.2rem 2.2rem;
|
||||
font-size: 1.8rem;
|
||||
// font-size: 1.4rem;
|
||||
font-weight: 400;
|
||||
margin-bottom: .4rem;
|
||||
border-radius: .8rem;
|
||||
@@ -1121,6 +1154,8 @@ export default defineComponent({
|
||||
// flex-wrap: nowrap;
|
||||
|
||||
&.history{
|
||||
padding: 1.2rem 1.1rem 1.2rem 2.2rem;
|
||||
margin-bottom: 1rem;
|
||||
> .text{
|
||||
flex-basis: 100%;
|
||||
}
|
||||
@@ -1130,7 +1165,8 @@ export default defineComponent({
|
||||
opacity: .5;
|
||||
}
|
||||
> i{
|
||||
margin-right: .8rem;
|
||||
font-size: 1.8rem;
|
||||
margin-right: 1rem;
|
||||
display: flex;
|
||||
}
|
||||
> .text{
|
||||
@@ -1146,18 +1182,23 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
&.active{
|
||||
background: #f5f5f5;
|
||||
// background: #f5f5f5;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
&:hover{
|
||||
background: #f5f5f5;
|
||||
// background: #f5f5f5;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
&.history{
|
||||
background: #f5f5f5;
|
||||
// background-color: #ffffff;
|
||||
&:hover{
|
||||
background: #fdfdfd;
|
||||
// background-color: #ffffff;
|
||||
}
|
||||
&.active{
|
||||
background: #fdfdfd;
|
||||
// background-color: #ffffff;
|
||||
}
|
||||
> .text{
|
||||
> span{
|
||||
@@ -1189,6 +1230,8 @@ export default defineComponent({
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
min-width: 40%;
|
||||
text-align: center;
|
||||
}
|
||||
> .btn{
|
||||
border: 1px solid #0000000d;
|
||||
@@ -1271,13 +1314,14 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
&.active{
|
||||
padding: 1.2rem;
|
||||
padding: 1.2rem 0;
|
||||
overflow: hidden;
|
||||
max-height: 100%;
|
||||
background: #00000008;
|
||||
> .titleBox{
|
||||
padding: 0;
|
||||
margin-bottom: 1.6rem;
|
||||
padding: 0 1.2rem;
|
||||
> .right{
|
||||
> i{
|
||||
transform: rotate(180deg);
|
||||
@@ -1332,6 +1376,9 @@ export default defineComponent({
|
||||
font-size: 2rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
> img{
|
||||
width: 2.7rem;
|
||||
}
|
||||
> svg{
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -1342,108 +1389,45 @@ export default defineComponent({
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 2.8rem;
|
||||
}
|
||||
> .segmentation{
|
||||
height: 2px;
|
||||
background: #0000000d;
|
||||
margin-top: 2rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
> .navListBottom{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
> .homeMain_right_content {
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
.homeMain_icon {
|
||||
font-size: 3.6rem;
|
||||
position: relative;
|
||||
top: 0.3rem;
|
||||
}
|
||||
|
||||
.username {
|
||||
font-size: 1.6rem;
|
||||
color: #1a1a1a;
|
||||
margin: 0 0.8rem;
|
||||
font-weight: 900;
|
||||
span{
|
||||
margin: .7rem;
|
||||
}
|
||||
}
|
||||
.credits{
|
||||
font-size: 1.6rem;
|
||||
color: #1a1a1a;
|
||||
font-weight: 900;
|
||||
width: auto;
|
||||
padding: 0 1.6rem;
|
||||
cursor: auto;
|
||||
display: flex;
|
||||
line-height: 6rem;
|
||||
height: 6rem;
|
||||
box-sizing: content-box;
|
||||
border-radius: 4rem;
|
||||
span{
|
||||
width: 5rem;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
margin-right: .9rem;
|
||||
.credits_item{
|
||||
transition: .3s all;
|
||||
// height: 4rem;
|
||||
height: 100%;
|
||||
// height: 3.2rem;
|
||||
div{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
i{
|
||||
height: 100%;
|
||||
border-left: .1rem solid ;
|
||||
padding-left: 1.3rem;
|
||||
margin-left: 1.5rem;
|
||||
font-size: 1.6rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.fi-br-refresh{
|
||||
margin-left: 0;
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
&.active{
|
||||
transition: all .3s;
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
> .gallery_btn{
|
||||
margin-top: 1.2rem;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.newObj{
|
||||
border-radius: 1.2rem;
|
||||
padding: 1.6rem 1.2rem;
|
||||
border: 1px solid #0003;
|
||||
border-radius: 2rem;
|
||||
border: 2px solid #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
margin-top: 4.2rem;
|
||||
width: 25.1rem;
|
||||
// height: 6.8rem;
|
||||
padding: calc(2rem - 2px) 0;
|
||||
> svg{
|
||||
margin-right: .4rem;
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
margin-right: 1.3rem;
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
}
|
||||
> p{
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
font-size: 2rem;
|
||||
font-weight: 500;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
@@ -1460,31 +1444,118 @@ export default defineComponent({
|
||||
margin-bottom: 1rem;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
padding: 2rem 2rem 1.2rem;
|
||||
padding: 3.2rem 2.1rem 1.2rem;
|
||||
align-items: center;
|
||||
> .left{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: auto;
|
||||
> .newObj{
|
||||
background: #f5f5f5;
|
||||
padding: 1.2rem;
|
||||
background: #fff;
|
||||
padding: 1.2rem 2.5rem;
|
||||
margin: 0;
|
||||
width: 17.7rem;
|
||||
border-radius: 3rem;
|
||||
p{
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
> svg{
|
||||
margin-right: 2rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
> .homeMain_right_content {
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 1.2rem;
|
||||
.homeMain_icon {
|
||||
font-size: 3.6rem;
|
||||
position: relative;
|
||||
top: 0.3rem;
|
||||
}
|
||||
|
||||
.username {
|
||||
font-size: 1.6rem;
|
||||
color: #1a1a1a;
|
||||
margin: 0 0.8rem;
|
||||
font-weight: 900;
|
||||
span{
|
||||
margin: .7rem;
|
||||
}
|
||||
}
|
||||
.credits{
|
||||
font-size: 1.6rem;
|
||||
color: #1a1a1a;
|
||||
font-weight: 500;
|
||||
cursor: auto;
|
||||
display: flex;
|
||||
line-height: calc(5rem - 4px);
|
||||
height: 5rem;
|
||||
border-radius: 3.4rem;
|
||||
justify-content: center;
|
||||
width: auto;
|
||||
// width: calc(25.3rem - 4px);
|
||||
padding: 0 1.2rem;
|
||||
border: 1.72px solid #000;
|
||||
span{
|
||||
width: 5rem;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
margin-right: 1.2rem;
|
||||
.credits_item{
|
||||
transition: .3s all;
|
||||
// height: 4rem;
|
||||
height: 100%;
|
||||
// height: 3.2rem;
|
||||
div{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
i{
|
||||
height: 100%;
|
||||
border-left: 1.72px solid ;
|
||||
padding-left: 1.3rem;
|
||||
margin-left: 1.5rem;
|
||||
font-size: 2.2rem;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.fi-rr-shop{
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
.fi-br-refresh{
|
||||
margin-left: 0;
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
&.active{
|
||||
transition: all .3s;
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
> .trialApproval{
|
||||
display: flex;
|
||||
margin-right: 1rem;
|
||||
align-items: center;
|
||||
> .message_iconItem{
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
margin-right: 1.4rem;
|
||||
i{
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -1492,16 +1563,16 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
.homeMain_user{
|
||||
height: 6rem;
|
||||
width: 6rem;
|
||||
height: 5.6rem;
|
||||
width: 5.6rem;
|
||||
// margin-left: auto;
|
||||
display: flex;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.homeMain_user_icon{
|
||||
height: 5rem;
|
||||
width: 5rem;
|
||||
height: 5.6rem;
|
||||
width: 5.6rem;
|
||||
position: relative;
|
||||
// transform-origin: top;
|
||||
overflow: hidden;
|
||||
@@ -1519,11 +1590,11 @@ export default defineComponent({
|
||||
// transition: all .3s;
|
||||
}
|
||||
.homeMain_user_detail{
|
||||
z-index: 999;
|
||||
z-index: 1050;
|
||||
position: absolute;
|
||||
top: calc(100% + .5rem);
|
||||
background: #fff;
|
||||
width: 32rem;
|
||||
width: 34rem;
|
||||
height: auto;
|
||||
opacity: 0;
|
||||
right: 0px;
|
||||
@@ -1803,7 +1874,6 @@ export default defineComponent({
|
||||
.email_last_step_content {
|
||||
margin-left: 1rem;
|
||||
font-size: 2.2rem;
|
||||
font-family: PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #030303;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,21 @@
|
||||
<template>
|
||||
<div class="homeRecommend_max">
|
||||
<div class="left">
|
||||
<div class="header">
|
||||
<div class="gallery_btn" @click="setLogin">Login</div>
|
||||
<div class="gallery_btn white" @click="signUp">Sign up</div>
|
||||
</div>
|
||||
<img class="bg" src="@/assets/images/homePage/squareBg.png" alt="">
|
||||
<div class="beForm">Developed by AiDLab<br />
|
||||
Commercialized by Code-Create</div>
|
||||
<div class="learnMore">
|
||||
<img src="@/assets/images/homePage/learnMore.png" alt="">
|
||||
<!-- <div class="title">AiDA</div>
|
||||
<div class="info">
|
||||
AI-based Interactive Design Assistant for Fashion
|
||||
</div> -->
|
||||
<!-- <div class="btn gallery_btn" @click="goLearnMore">Learn More</div> -->
|
||||
</div>
|
||||
<!-- <div class="left">
|
||||
<div class="logoBox">
|
||||
<img
|
||||
class="aiDalogo"
|
||||
@@ -19,21 +34,19 @@
|
||||
</div>
|
||||
<div class="continue gallery_btn gallery_btn_radius" @click="setLogin" style="min-width: 14rem;">
|
||||
Login
|
||||
<!-- <i class="fi fi-rr-arrow-right"></i> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<img class="model" src="@/assets/images/homePage/squareLeftImgModel.png" alt="">
|
||||
<img class="text" src="@/assets/images/homePage/squareLeftImgText.png" alt="">
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
<script >
|
||||
import { defineComponent, toRefs, reactive, ref , nextTick,computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import { isEmail } from "@/tool/util";
|
||||
import { setCookie, getCookie, WriteCookie,clonAllCookie } from "@/tool/cookie";
|
||||
import VerificationCodeInput from "@/component/LoginPage/verificationCodeInput.vue";
|
||||
import { Https } from "@/tool/https";
|
||||
import { Modal, message } from "ant-design-vue";
|
||||
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
|
||||
@@ -45,7 +58,6 @@ import { gsap, TweenMax } from "gsap";
|
||||
import { ScrollTrigger } from "gsap/ScrollTrigger";
|
||||
export default defineComponent({
|
||||
components: {
|
||||
VerificationCodeInput,
|
||||
},
|
||||
setup(){
|
||||
const store = useStore();
|
||||
@@ -83,15 +95,15 @@ export default defineComponent({
|
||||
const signUp = ()=>{
|
||||
router.push('/register');
|
||||
}
|
||||
const goLearnMore = ()=>{
|
||||
window.open('https://www.aida.com.hk/Square/works', '_blank');
|
||||
}
|
||||
onMounted(()=>{
|
||||
window.addEventListener('resize',updataIsMoblie)
|
||||
})
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', updataIsMoblie);
|
||||
});
|
||||
const turnToNewPage = (url)=>{
|
||||
window.open(url);
|
||||
}
|
||||
return {
|
||||
...toRefs(data),
|
||||
userDetail,
|
||||
@@ -99,8 +111,8 @@ export default defineComponent({
|
||||
registerModel,
|
||||
logout,
|
||||
goHome,
|
||||
turnToNewPage,
|
||||
signUp,
|
||||
goLearnMore,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@@ -149,9 +161,6 @@ export default defineComponent({
|
||||
// })
|
||||
},
|
||||
methods: {
|
||||
turnToNewPage(url) {
|
||||
window.open(url);
|
||||
},
|
||||
turnToWindow(url) {
|
||||
window.open(url);
|
||||
},
|
||||
@@ -164,85 +173,144 @@ export default defineComponent({
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
font-family: Satoshi;
|
||||
> .left,> .right{
|
||||
position: relative;
|
||||
> .header{
|
||||
padding: 3.2rem 4rem;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
margin-left: auto;
|
||||
> .gallery_btn{
|
||||
margin-right: 2rem;
|
||||
border: none;
|
||||
font-size: 1.7rem;
|
||||
width: 13rem;
|
||||
line-height: 6rem;
|
||||
font-weight: 500;
|
||||
border-radius: 4rem;
|
||||
&:last-child{
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
> .bg{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
object-fit: cover;
|
||||
}
|
||||
> .left{
|
||||
// width: 79rem;
|
||||
width: 45%;
|
||||
// position: absolute;
|
||||
// right: 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
> .logoBox{
|
||||
height: 4rem;
|
||||
position: absolute;
|
||||
left: 2rem;
|
||||
top: 2rem;
|
||||
img{
|
||||
height: 100%;
|
||||
margin-left: 2rem;
|
||||
}
|
||||
.codeCreatelogo{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
> .text{
|
||||
width: 68rem;
|
||||
> .title{
|
||||
// font-size: 4rem;
|
||||
font-size: 6.4rem;
|
||||
font-weight: 900;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 3.2rem;
|
||||
p{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
> .info{
|
||||
font-size: 2.4rem;
|
||||
// margin-bottom: 4rem;
|
||||
margin-bottom: 1.6rem;
|
||||
line-height: 1.2;
|
||||
> span{
|
||||
color: #0070c9;
|
||||
cursor: pointer;
|
||||
&:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
> .continue{
|
||||
font-size: 2.4rem;
|
||||
> i{
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
> .beForm{
|
||||
position: absolute;
|
||||
font-size: 2.1rem;
|
||||
bottom: 10rem;
|
||||
left: 10rem;
|
||||
}
|
||||
> .right{
|
||||
// width: 58%;
|
||||
position: relative;
|
||||
width: 55%;
|
||||
background: #d7d6d5;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
> .learnMore{
|
||||
position: absolute;
|
||||
bottom: 29rem;
|
||||
right: 10rem;
|
||||
width: 53.4rem;
|
||||
text-align: right;
|
||||
z-index: 2;
|
||||
> img{
|
||||
object-fit: cover;
|
||||
height: 19.5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
> .model{
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
> .text{
|
||||
height: 45rem;
|
||||
text-align: right;
|
||||
// > .title{
|
||||
// margin-bottom: .8rem;
|
||||
// font-size: 11.8rem;
|
||||
// font-weight: 500;
|
||||
// }
|
||||
// > .info{
|
||||
// font-family: 'pingfang_regular';
|
||||
// font-size: 2.8rem;
|
||||
// font-weight: 400;
|
||||
// margin-bottom: 2rem;
|
||||
// }
|
||||
> .btn{
|
||||
line-height: 6rem;
|
||||
width: 18rem;
|
||||
font-size: 2rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
// > .left,> .right{
|
||||
// height: 100%;
|
||||
// display: flex;
|
||||
// display: none;
|
||||
// }
|
||||
// > .left{
|
||||
// width: 45%;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
// position: relative;
|
||||
// > .logoBox{
|
||||
// height: 4rem;
|
||||
// position: absolute;
|
||||
// left: 2rem;
|
||||
// top: 2rem;
|
||||
// img{
|
||||
// height: 100%;
|
||||
// margin-left: 2rem;
|
||||
// }
|
||||
// .codeCreatelogo{
|
||||
// cursor: pointer;
|
||||
// }
|
||||
// }
|
||||
// > .text{
|
||||
// width: 68rem;
|
||||
// > .title{
|
||||
// font-size: 6.4rem;
|
||||
// font-weight: 900;
|
||||
// line-height: 1.2;
|
||||
// margin-bottom: 3.2rem;
|
||||
// p{
|
||||
// margin-bottom: 0;
|
||||
// }
|
||||
// }
|
||||
// > .info{
|
||||
// font-size: 2.4rem;
|
||||
// margin-bottom: 1.6rem;
|
||||
// line-height: 1.2;
|
||||
// > span{
|
||||
// color: #0070c9;
|
||||
// cursor: pointer;
|
||||
// &:hover{
|
||||
// text-decoration: underline;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// > .continue{
|
||||
// font-size: 2.4rem;
|
||||
// > i{
|
||||
// margin-left: 1rem;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// > .right{
|
||||
// position: relative;
|
||||
// width: 55%;
|
||||
// background: #d7d6d5;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// justify-content: flex-end;
|
||||
// > img{
|
||||
// object-fit: cover;
|
||||
// }
|
||||
// > .model{
|
||||
// height: 100%;
|
||||
// position: absolute;
|
||||
// left: 0;
|
||||
// }
|
||||
// > .text{
|
||||
// height: 45rem;
|
||||
// text-align: right;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,74 +0,0 @@
|
||||
<template>
|
||||
<div class="homeView">
|
||||
<!-- <homeIndex @setTask="()=>$emit('setTask')"></homeIndex> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import {
|
||||
defineComponent,
|
||||
h,
|
||||
ref,
|
||||
computed,
|
||||
reactive,
|
||||
toRefs,
|
||||
inject,
|
||||
provide,
|
||||
nextTick,
|
||||
createVNode,
|
||||
onBeforeUnmount,
|
||||
toRef,
|
||||
watch,
|
||||
} from "vue";
|
||||
// import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import CollectionModal from "@/component/HomePage/collectionModal.vue";
|
||||
import NewCollectionReview from "@/component/HomePage/NewCollectionReview.vue";
|
||||
import ExportNewCoolection from "@/component/HomePage/ExportNewCoolection.vue";
|
||||
import productImg from "@/component/HomePage/productImg.vue";
|
||||
import generalCanvas from "@/component/modules/generalCanvas.vue";
|
||||
import affiche from "@/component/HomePage/affiche.vue";
|
||||
import DesignDetail from "@/component/Detail/DesignDetail.vue";
|
||||
import DesignDetailcopy from "@/component/DetailCopy/designDetail.vue";
|
||||
// import homeIndex from "@/component/HomePage/index/index.vue";
|
||||
import html2canvas from "html2canvas";
|
||||
import { message, Modal } from "ant-design-vue";
|
||||
import { useStore } from "vuex";
|
||||
import { Https } from "@/tool/https";
|
||||
import { openGuide, driverObj__ } from "@/tool/guide";
|
||||
import {
|
||||
LoadingOutlined,
|
||||
ExclamationCircleOutlined,
|
||||
} from "@ant-design/icons-vue";
|
||||
// import JSZip, { forEach } from "jszip";
|
||||
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
|
||||
import i18n from "@/lang";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { getMousePosition } from "@/tool/mdEvent";
|
||||
import { removeClass } from "element-plus/es/utils";
|
||||
import FileSaver from "file-saver";
|
||||
|
||||
export default defineComponent({
|
||||
name: "homePage",
|
||||
components: {
|
||||
// homeIndex,
|
||||
NewCollectionReview,
|
||||
DesignDetail,
|
||||
ExportNewCoolection,
|
||||
affiche,
|
||||
productImg,
|
||||
generalCanvas,
|
||||
DesignDetailcopy,
|
||||
},
|
||||
emits: ["setTask"],
|
||||
setup(props, { emit }) {
|
||||
return {};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.homeView {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
@@ -984,7 +984,7 @@ export default defineComponent({
|
||||
scene:{
|
||||
handler(newVal,oldVal){
|
||||
if(this.selectCode == 'Printboard' && newVal.value == 'Slogan'){
|
||||
let sloganType = ['Blue and Yellow Starry Night','Green Cthulhu','Red and yellow fire style','Cyberpunk style','City skyline buildings','Red maple leaves','Golden Sunflower','Emerald Jungle Canopy','Pink Sakura Blossom']
|
||||
let sloganType = [this.t('Generate.BlueYelStarryNight'),this.t('Generate.GreenCthulhu'),this.t('Generate.RedYelFireStyle'),this.t('Generate.CyberpunkStyle'),this.t('Generate.CitySkyline'),this.t('Generate.RedMaple'),this.t('Generate.GoldSunflower'),this.t('Generate.EmrldJungle'),this.t('Generate.PinkSakura')]
|
||||
var randomNumber = Math.floor(Math.random() * sloganType.length);
|
||||
this.isSloganHint = sloganType[randomNumber]
|
||||
}else{
|
||||
@@ -1892,7 +1892,7 @@ export default defineComponent({
|
||||
button2.classList.add('started_btn','cascader_btn2')
|
||||
let divMax:any = document.createElement("div")
|
||||
divMax.classList.add('cascader_btn_max')
|
||||
button1.textContent = 'Edit'
|
||||
button1.textContent = this.t('LibraryPage.edit')
|
||||
// button2.textContent = '删除'
|
||||
button1.addEventListener('click',this.removeLabel,false)
|
||||
divMax.appendChild(button1)
|
||||
@@ -2097,7 +2097,8 @@ export default defineComponent({
|
||||
flex-direction: column;
|
||||
.header_operate_item{
|
||||
margin-right: 5rem;
|
||||
color: #C2C2C2;
|
||||
// color: #C2C2C2;
|
||||
color: #000;
|
||||
font-size: var(--aida-fsize1-8);
|
||||
.ant-upload{
|
||||
// font-size: 1.6rem;
|
||||
|
||||
@@ -2,24 +2,20 @@
|
||||
<div class="loginPage">
|
||||
<div class="left">
|
||||
<div class="imgBox">
|
||||
<img src="@/assets/images/homePage/loginLeftImg.png" alt="">
|
||||
<video src="@/assets/images/homePage/login_banner.mp4" autoplay muted loop playsinline webkit-playsinline x5-playsinline></video>
|
||||
</div>
|
||||
<div class="fixed">Designed with AiDA</div>
|
||||
<div class="mask" v-show="loginType">
|
||||
<!-- <div class="bg"></div> -->
|
||||
<img src="@/assets/images/homePage/maskIcon.png" alt="">
|
||||
</div>
|
||||
<!-- <Works :autoscroll="true" :position="'login'"></Works>
|
||||
<div class="mask" v-show="isMask" @click="() => (isMask = !isMask)">
|
||||
<div class="content">
|
||||
<div class="userNum">
|
||||
<div class="title">5 000 000 +</div>
|
||||
<div>HAPPY USERS</div>
|
||||
</div>
|
||||
<div class="info">AI that millions trust, every single day</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="right">
|
||||
<i class="fi fi-br-angle-left" @click="toBack" v-show="!loginType"></i>
|
||||
<div class="Text" v-show="!loginType">
|
||||
<img src="@/assets/images/homePage/aidaIcon.png" alt="">
|
||||
<div class="title">
|
||||
<p style="font-weight: 700;">Welcome to AiDA</p>
|
||||
<p style="font-weight: 400;">Bloom Your Creativity</p>
|
||||
<p>Welcome to <span>AiDA</span></p>
|
||||
</div>
|
||||
<div class="info">
|
||||
AiDA, a first-to-market technology that empowers fashion designers, based on their creative inspirations, to work with AI to create original designs.
|
||||
@@ -42,16 +38,15 @@
|
||||
</div>
|
||||
<div class="login" v-show="loginType">
|
||||
<div class="title">
|
||||
<i
|
||||
class="fi fi-br-angle-small-left"
|
||||
@click="() => (loginType = '')"
|
||||
></i>
|
||||
<i class="fi fi-br-angle-left" @click="loginBack"></i>
|
||||
<!-- <i class="fi fi-rr-arrow-left" @click="()=>loginType = ''"></i> -->
|
||||
<span>Log on to AiDA 3.0</span>
|
||||
</div>
|
||||
<personal v-show="loginType == 'personal'"></personal>
|
||||
<school v-show="loginType == 'school'"></school>
|
||||
<enterprise v-show="loginType == 'enterprise'"></enterprise>
|
||||
<div class="info" v-show="!loginType">Please fill your information below</div>
|
||||
<personal ref="personal" v-if="loginType == 'personal'"></personal>
|
||||
<school ref="school" v-if="loginType == 'school'"></school>
|
||||
<enterprise ref="enterprise" v-if="loginType == 'enterprise'"></enterprise>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -77,6 +72,7 @@ import Works from "@/views/HomeView/Works.vue";
|
||||
import { message } from "ant-design-vue";
|
||||
import { isEmail } from "@/tool/util";
|
||||
import personal from "@/component/LoginPage/login/personal.vue";
|
||||
import { useRoute,useRouter } from 'vue-router';
|
||||
import school from "@/component/LoginPage/login/school.vue";
|
||||
import enterprise from "@/component/LoginPage/login/enterprise.vue";
|
||||
export default defineComponent({
|
||||
@@ -90,18 +86,35 @@ export default defineComponent({
|
||||
emits: [],
|
||||
setup(props, { emit }) {
|
||||
const store = useStore();
|
||||
const router = useRouter()
|
||||
const loginData = reactive({
|
||||
loginType: "",
|
||||
isMask: true,
|
||||
});
|
||||
const dataDom = reactive({});
|
||||
const dataDom = reactive({
|
||||
personal: null as any,
|
||||
school: null as any,
|
||||
enterprise: null as any,
|
||||
}) as any;
|
||||
const setLoginType = (str: any) => {
|
||||
loginData.loginType = str;
|
||||
};
|
||||
const loginBack = ()=>{
|
||||
if(dataDom?.[loginData.loginType].emailStap == 2){
|
||||
dataDom[loginData.loginType].emailLastStepFun()
|
||||
}else{
|
||||
loginData.loginType = ''
|
||||
}
|
||||
}
|
||||
const toBack = ()=>{
|
||||
router.push('/Square')
|
||||
}
|
||||
return {
|
||||
...toRefs(dataDom),
|
||||
...toRefs(loginData),
|
||||
setLoginType,
|
||||
loginBack,
|
||||
toBack,
|
||||
};
|
||||
},
|
||||
provide() {
|
||||
@@ -115,101 +128,103 @@ export default defineComponent({
|
||||
height: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
font-family: 'Satoshi';
|
||||
background: #000;
|
||||
> .left,
|
||||
> .right {
|
||||
height: 100%;
|
||||
}
|
||||
> .left {
|
||||
width: 57%;
|
||||
width: 41%;
|
||||
// width: 55%;
|
||||
background: #f7f8fa;
|
||||
position: relative;
|
||||
background: #000;
|
||||
overflow: hidden;
|
||||
> .mask{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: linear-gradient(180deg, rgba(49, 49, 49, 0.3) -4.74%, rgba(0, 0, 0, 0.55) 103.32%);
|
||||
|
||||
}
|
||||
> .fixed{
|
||||
position: absolute;
|
||||
bottom: 1rem;
|
||||
right: 1rem;
|
||||
color: #fff;
|
||||
}
|
||||
> .imgBox{
|
||||
background: #000;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
> img{
|
||||
position: relative;
|
||||
|
||||
> video{
|
||||
width: 100%;
|
||||
object-fit: cover;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
> .mask {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(255, 255, 255, 0) 0%,
|
||||
rgba(0, 0, 0, 0.8) 100%
|
||||
);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
> .content {
|
||||
text-align: center;
|
||||
padding: 15rem;
|
||||
//黑色径向渐变
|
||||
background: radial-gradient(
|
||||
ellipse at center,
|
||||
rgba(0, 0, 0, 0.3) 0%,
|
||||
rgba(0, 0, 0, 0) 70%
|
||||
);
|
||||
.userNum {
|
||||
line-height: 1;
|
||||
margin-bottom: 3rem;
|
||||
> .title {
|
||||
font-size: 8rem;
|
||||
font-weight: 900;
|
||||
}
|
||||
> div {
|
||||
font-size: 3rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
> .info {
|
||||
font-size: 4rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
> .right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
width: 45%;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
background: #d9d9d9;
|
||||
border-radius: 7rem 0 0 7rem;
|
||||
background: #fff;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
> i{
|
||||
position: absolute;
|
||||
margin-right: 2.8rem;
|
||||
font-size: 2rem;
|
||||
cursor: pointer;
|
||||
align-items: center;
|
||||
width: 4.6rem;
|
||||
height: 4.6rem;
|
||||
border-radius: 1.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 1px solid #D8DADC;
|
||||
left: 4rem;
|
||||
top: 4rem;
|
||||
}
|
||||
> .Text {
|
||||
width: 65rem;
|
||||
width: 63rem;
|
||||
text-align: center;
|
||||
> img{
|
||||
width: 12rem;
|
||||
height: 12rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
> .title {
|
||||
font-size: 6.4rem;
|
||||
font-weight: 900;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 3.2rem;
|
||||
margin-bottom: 2.4rem;
|
||||
p{
|
||||
margin-bottom: 0;
|
||||
font-weight: 400;
|
||||
font-family: 'pingfang_regular';
|
||||
> span{
|
||||
font-weight: 500;
|
||||
font-family: 'pingfang_medium';
|
||||
}
|
||||
}
|
||||
}
|
||||
> .info {
|
||||
font-size: 2rem;
|
||||
font-size: 2.4rem;
|
||||
// margin-bottom: 4rem;
|
||||
margin-bottom: 0rem;
|
||||
margin-bottom: 7rem;
|
||||
font-weight: 300;
|
||||
line-height: 1.2;
|
||||
letter-spacing:-.5px;
|
||||
font-family: 'satoshi_light';
|
||||
}
|
||||
> .continue {
|
||||
> i {
|
||||
@@ -218,18 +233,18 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
> .loginBox {
|
||||
width: 44rem;
|
||||
margin-top: 7rem;
|
||||
width: 36.9rem;
|
||||
// margin-top: 7rem;
|
||||
&.active{
|
||||
width: 53rem;
|
||||
width: 63rem;
|
||||
}
|
||||
> .selectType {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
> .text {
|
||||
font-size: 3.2rem;
|
||||
font-size: 2.8rem;
|
||||
font-weight: 500;
|
||||
margin-bottom: 2rem;
|
||||
margin-bottom: 2.4rem;
|
||||
}
|
||||
> .typeList {
|
||||
> .gallery_btn{
|
||||
@@ -240,11 +255,13 @@ export default defineComponent({
|
||||
width: 100%;
|
||||
background: transparent;
|
||||
border-radius: 9rem;
|
||||
border: 2px solid;
|
||||
border: 1.3px solid;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 2rem;
|
||||
margin-bottom: 2.4rem;
|
||||
font-size: 2.4rem;
|
||||
font-weight: 500;
|
||||
color: #000;
|
||||
&:hover{
|
||||
background: #000;
|
||||
@@ -256,18 +273,32 @@ export default defineComponent({
|
||||
> .login {
|
||||
position: relative;
|
||||
> .title {
|
||||
font-size: 4rem;
|
||||
font-weight: 900;
|
||||
font-size: 3.6rem;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 1.2rem;
|
||||
> i {
|
||||
margin-right: 2rem;
|
||||
font-size: 3rem;
|
||||
margin-right: 2.8rem;
|
||||
font-size: 2rem;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
align-items: center;
|
||||
width: 4.6rem;
|
||||
height: 4.6rem;
|
||||
border-radius: 1.2rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
border: 1px solid #D8DADC;
|
||||
}
|
||||
|
||||
}
|
||||
> .info{
|
||||
font-weight: 500;
|
||||
font-size: 1.6rem;
|
||||
text-align: left;
|
||||
color: #667085;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,12 +3,22 @@
|
||||
<header class="homeRecommend_heade">
|
||||
<div class="homeRecommend_right_content">
|
||||
<div class="homeRecommend_user_content">
|
||||
<img
|
||||
<!-- <img
|
||||
class="homeRecommend_logo"
|
||||
@click="turnToNewPage('https://www.aidlab.hk/en/')"
|
||||
src="@/assets/images/loginPage/aida_logo.png"
|
||||
/> -->
|
||||
<!-- <img
|
||||
class="homeRecommend_logo"
|
||||
@click="turnToNewPage('https://www.aidlab.hk/en/')"
|
||||
src="@/assets/images/loginPage/aida_Logo_login.png"
|
||||
/> -->
|
||||
<img
|
||||
class="homeRecommend_logo"
|
||||
@click="turnToNewPage('/')"
|
||||
src="@/assets/images/homePage/aidaIcon.png"
|
||||
/>
|
||||
<div
|
||||
<!-- <div
|
||||
class="login_footer_item_text"
|
||||
@click="turnToWindow(
|
||||
'https://code-create.com.hk/aida-terms-and-conditions/'
|
||||
@@ -23,7 +33,7 @@
|
||||
)"
|
||||
>
|
||||
Privacy Policy
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="homeRecommend_right">
|
||||
@@ -164,7 +174,7 @@ export default defineComponent({
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// padding: 0 30px;
|
||||
padding: 1rem 4rem;
|
||||
padding: 2rem 4rem;
|
||||
width: 100%;
|
||||
// height: 7rem;
|
||||
flex-shrink: 0;
|
||||
@@ -173,8 +183,10 @@ export default defineComponent({
|
||||
position: absolute;
|
||||
align-items: center;
|
||||
z-index: 2;
|
||||
border-bottom: 1px solid #DDD;
|
||||
@media (max-width: 768px) {
|
||||
z-index: 1000;
|
||||
padding: 1.4rem 2.1rem;
|
||||
}
|
||||
.homeRecommend_right{
|
||||
width: 33%;
|
||||
@@ -188,14 +200,24 @@ export default defineComponent({
|
||||
// margin-left: 2rem;
|
||||
width: 13rem;
|
||||
text-align: center;
|
||||
@media (max-width: 768px) {
|
||||
width: 5.2rem;
|
||||
padding: 0;
|
||||
}
|
||||
&.gallery_btn:nth-child(1){
|
||||
margin-right: 3rem;
|
||||
@media (max-width: 768px) {
|
||||
margin-right: 1.8rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
> .cutLangue{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 4rem;
|
||||
@media (max-width: 768px) {
|
||||
margin-right: 2.8rem;
|
||||
}
|
||||
> i{
|
||||
font-size: 5rem;
|
||||
}
|
||||
@@ -203,10 +225,17 @@ export default defineComponent({
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
> i{
|
||||
font-size: 3.5rem;
|
||||
display: flex;
|
||||
margin-right: 1rem;
|
||||
@media (max-width: 768px) {
|
||||
margin-right: .7rem;
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
> button{
|
||||
@@ -219,12 +248,25 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
.homeRecommend_logo {
|
||||
width: 14.4rem;
|
||||
height: 3.2rem;
|
||||
// width: 14.4rem;
|
||||
height: 8rem;
|
||||
// height: 4rem;
|
||||
|
||||
margin-top: 0;
|
||||
margin-right: 2rem;
|
||||
@media (max-width: 768px) {
|
||||
// height: 1.76rem;
|
||||
height: 4.5rem;
|
||||
margin-right: .9rem;
|
||||
}
|
||||
// &:last-child{
|
||||
// margin-right: 2rem;
|
||||
// }
|
||||
}
|
||||
.login_footer_item_text{
|
||||
margin-left: 5rem;
|
||||
// margin-left: 5rem;
|
||||
margin-right: 2rem;
|
||||
font-size: 1.6rem;
|
||||
text-decoration: underline;
|
||||
display: none;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -82,31 +82,42 @@ export default defineComponent({
|
||||
// const route:any = useRoute()
|
||||
const store:any = useStore()
|
||||
const state:any = reactive({
|
||||
rootSubmenuKeys: [{
|
||||
name:'Affiliate Home',
|
||||
route:'/affiliate',
|
||||
icon:'yonghu',
|
||||
expandIcon:'icon-xiala',
|
||||
key:'sub1',
|
||||
isShow:true,
|
||||
// children: [
|
||||
// {
|
||||
// name:'User Management',
|
||||
// route:'/home/excil1',
|
||||
// icon:'',
|
||||
// key:'/home/excil22',
|
||||
// isShow:true,
|
||||
// },
|
||||
// {
|
||||
// code:'ROLE_MANAGER',
|
||||
// name:'Access Permission',
|
||||
// route:'/home/excil2',
|
||||
// icon:'',
|
||||
// key:'/home/excil33',
|
||||
// isShow:true,
|
||||
// },
|
||||
// ],
|
||||
},],
|
||||
rootSubmenuKeys: [
|
||||
{
|
||||
name:'Affiliate Home',
|
||||
route:'/affiliateHome',
|
||||
icon:'yonghu',
|
||||
expandIcon:'icon-xiala',
|
||||
key:'sub1',
|
||||
isShow:true,
|
||||
// children: [
|
||||
// {
|
||||
// name:'User Management',
|
||||
// route:'/home/excil1',
|
||||
// icon:'',
|
||||
// key:'/home/excil22',
|
||||
// isShow:true,
|
||||
// },
|
||||
// {
|
||||
// code:'ROLE_MANAGER',
|
||||
// name:'Access Permission',
|
||||
// route:'/home/excil2',
|
||||
// icon:'',
|
||||
// key:'/home/excil33',
|
||||
// isShow:true,
|
||||
// },
|
||||
// ],
|
||||
},
|
||||
{
|
||||
name:'Affiliate Referral',
|
||||
route:'/affiliateReferral',
|
||||
icon:'yonghu',
|
||||
expandIcon:'icon-xiala',
|
||||
key:'sub2',
|
||||
isShow:true,
|
||||
|
||||
},
|
||||
],
|
||||
openKeys: [],
|
||||
selectedKeys: ['sub1'],
|
||||
nowPageName:'Affiliate Home',//当前页面名称
|
||||
@@ -269,7 +280,6 @@ export default defineComponent({
|
||||
|
||||
.menu_title{
|
||||
font-size: 1.8rem;
|
||||
font-family: Adobe Heiti Std;
|
||||
font-weight: normal;
|
||||
color: #808185;
|
||||
}
|
||||
|
||||
@@ -1,129 +0,0 @@
|
||||
<template>
|
||||
<div class="identification_page">
|
||||
<div>序号：<input v-model="setId" type="text" autofocus /></div>
|
||||
<div>密钥：<input type="text" /></div>
|
||||
<div class="button" @click="setFingerprint2('set')">记录浏览器标识</div>
|
||||
<div class="button" @click="setFingerprint2('put')">更新浏览器标识</div>
|
||||
<div class="button" @click="setFingerprint2('delete')">注销浏览器标识</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, createVNode, computed } from "vue";
|
||||
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
|
||||
import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
|
||||
import router from "@/router/index";
|
||||
import { Https } from "@/tool/https";
|
||||
import { Modal, message } from "ant-design-vue";
|
||||
import RobotAssist from "@/component/HomePage/RobotAssist.vue";
|
||||
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import Fingerprint2 from "fingerprintjs2"; //获取浏览器唯一标识
|
||||
export default defineComponent({
|
||||
components: {
|
||||
HistoryDetail,
|
||||
RobotAssist,
|
||||
},
|
||||
setup() {
|
||||
let collectionList: any = ref([]);
|
||||
let userInfo: any = {};
|
||||
let status: any = ref(0);
|
||||
let voluntarily: any = ref(false);
|
||||
let setId: any = ref();
|
||||
return {
|
||||
collectionList,
|
||||
userInfo,
|
||||
status,
|
||||
voluntarily,
|
||||
setId,
|
||||
};
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
async setFingerprint2(str:any) {
|
||||
let murmur:any = ''
|
||||
await new Promise((resolve,reject)=>{
|
||||
Fingerprint2.get(function (components: any) {
|
||||
const values = components.map(function (
|
||||
component: any,
|
||||
index: any
|
||||
) {
|
||||
if (index === 0) {
|
||||
//把微信浏览器里UA的wifi或4G等网络替换成空,不然切换网络会ID不一样
|
||||
return component.value.replace(/\bNetType\/\w+\b/, "");
|
||||
}
|
||||
return component.value;
|
||||
});
|
||||
// 生成最终id murmur
|
||||
murmur = Fingerprint2.x64hash128(values.join(""), 31);
|
||||
resolve('')
|
||||
});
|
||||
})
|
||||
let data = {
|
||||
browserIdentifiers:murmur,
|
||||
id:this.setId
|
||||
}
|
||||
// console.log(data);
|
||||
// return
|
||||
|
||||
if(str == 'set' || str == 'put'){
|
||||
let url = Https.httpUrls.addNoLoginRequiredNew
|
||||
if(str == 'put')url = Https.httpUrls.updateNoLoginRequiredNew
|
||||
// return
|
||||
Https.axiosPost(url, data)
|
||||
.then((rv) => {
|
||||
localStorage.setItem('murmurStr',murmur)
|
||||
const htmlContent = rv
|
||||
const blob = new Blob([htmlContent], { type: "text/html" });
|
||||
const downloadLink = document.createElement("a");
|
||||
downloadLink.href = URL.createObjectURL(blob);
|
||||
downloadLink.download = "AiDA.html";
|
||||
downloadLink.click();
|
||||
// localStorage.setItem('id',this.setId)
|
||||
message.success('Created successfully');
|
||||
})
|
||||
.catch((res) => {
|
||||
});
|
||||
}else{
|
||||
data.id = ''
|
||||
Https.axiosPost(Https.httpUrls.deleteNoLoginRequiredNew, data)
|
||||
.then((rv) => {
|
||||
message.success('successfully delete');
|
||||
localStorage.removeItem('murmurStr')
|
||||
localStorage.removeItem('id')
|
||||
setCookie("isMurmur", false);
|
||||
WriteCookie("token");
|
||||
})
|
||||
.catch((res) => {
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
.identification_page {
|
||||
margin-top: 200px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
input {
|
||||
padding-left: 10px;
|
||||
border: 2px solid rgba(0, 0, 0, 0.2);
|
||||
border-radius: 10px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.button {
|
||||
margin-top: 20px;
|
||||
border: 2px solid;
|
||||
border-radius: 20px;
|
||||
padding: 0 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
27
src/views/userManual.vue
Normal file
27
src/views/userManual.vue
Normal file
@@ -0,0 +1,27 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
|
||||
//const props = defineProps({
|
||||
//})
|
||||
//const emit = defineEmits([
|
||||
//])
|
||||
let data = reactive({
|
||||
})
|
||||
onMounted(()=>{
|
||||
})
|
||||
onUnmounted(()=>{
|
||||
})
|
||||
defineExpose({})
|
||||
const {} = toRefs(data);
|
||||
</script>
|
||||
<template>
|
||||
<div class="userManual">
|
||||
<iframe src="https://aida-user-manual.super.site/" width="100%" height="100%" frameborder="0" allowfullscreen />
|
||||
</div>
|
||||
</template>
|
||||
<style lang="less" scoped>
|
||||
.userManual{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user