aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整library布局

Browse Source
This commit is contained in:
X1627315083
2024-12-27 14:38:21 +08:00
parent 7eb5c5cba5
commit f21c98c623
14 changed files with 452 additions and 394 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/assets/images/homePage/bankCard.svg
View File

@@ -1,3 +0,0 @@
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<path fill-rule="evenodd" clip-rule="evenodd" d="M16 4H0v-.75C0 2.56.448 2 1 2h14c.552 0 1 .56 1 1.25V4zm0 2.5V13a1 1 0 01-1 1H1a1 1 0 01-1-1V6.5h16zM4 10a1 1 0 100 2h1a1 1 0 100-2H4z" fill="#000"/>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 281 B

1
src/assets/images/homePage/stripe.svg Normal file
View File

@@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735265169559" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1495" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M802.158921 871.935232h-580.317842c-63.174813 0-114.374813-51.2-114.374812-114.374812V177.31934c0-63.174813 51.2-114.374813 114.374812-114.374812h580.317842c63.174813 0 114.374813 51.2 114.374812 114.374812v580.317841c0 63.098051-51.2 114.298051-114.374812 114.298051z" fill="#009BF1" p-id="1496"></path><path d="M469.627586 350.647076c0-25.638381 21.416492-35.54063 55.728936-35.540629 49.971814 0 113.376912 15.275562 163.271964 42.21889V202.804198c-54.423988-21.723538-108.771214-30.013793-163.195203-30.013793-133.181409 0-221.917841 69.546027-221.917841 185.763118 0 181.694753 249.552024 152.295052 249.552024 230.668666 0 30.397601-26.329235 40.146327-62.944527 40.146327-54.347226 0-124.507346-22.414393-179.622189-52.351425v147.919641c61.025487 26.252474 122.895352 37.306147 179.545427 37.306147 136.482159 0 230.515142-58.722639 230.515142-176.782009-0.076762-195.972414-250.933733-160.892354-250.933733-234.813794" fill="#FFFFFF" p-id="1497"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

155
src/assets/style/style.css
View File

@@ -7,7 +7,7 @@ body,
font-family: 'Roboto', sans-serif;
overflow: hidden;
--aida-fsize2: calc(2.6rem);
--aida-fsize1-8: calc(1.8rem*1.2);
--aida-fsize1-8: calc(1.8rem);
--aida-fsize1-6: calc(1.6rem);
--aida-fsize1-4: calc(1.4rem*1.2);
--antd-wave-shadow-color: #39215b;
@@ -261,58 +261,9 @@ li {
transform: rotate(360deg);
}
}
.el-cascader {
font-size: 1.2rem;
width: 100%;
height: 3rem;
--el-color-primary: #d9d9d9;
--el-cascader-tag-background: #e1d9ec;
}
.el-cascader .el-input {
height: 100%;
}
.el-cascader .el-input .el-input__wrapper .el-input__inner {
height: 80% !important;
font-size: 1.2rem;
}
.el-popper {
padding: 0.5rem 1.1rem;
}
.el-cascader__tags,
.el-cascader__collapse-tag {
--el-color-primary: #d9d9d9;
--el-cascader-tag-background: #e1d9ec;
--el-fill-color: #e1d9ec;
height: 100%;
width: 90% !important;
flex-wrap: nowrap;
overflow: hidden;
align-items: center;
}
.el-cascader__tags .el-tag--light,
.el-cascader__collapse-tag .el-tag--light {
margin: 0 0 0 0.6rem;
padding-right: 0.5rem;
height: 80%;
--el-icon-size: 1.4rem;
display: flex;
}
.el-cascader__tags .el-tag--light .el-tag__content,
.el-cascader__collapse-tag .el-tag--light .el-tag__content {
font-size: 1.4rem;
color: #000;
}
.el-cascader__tags .el-cascader__search-input,
.el-cascader__collapse-tag .el-cascader__search-input {
height: 100%;
margin: 0 0 0 1.1rem;
}
.el-cascader__collapse-tag {
margin-bottom: 0.5rem;
}
.el-cascader__collapse-tag .el-cascader__collapse-tag .el-tag--light {
display: flex !important;
}
.hideEvents {
pointer-events: none !important;
}
@@ -729,6 +680,17 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
align-items: center;
margin-right: 5rem;
}
.generalModel_state .generalModel_state_item.smail > input {
padding: 1rem 2rem !important;
}
.generalModel_state .generalModel_state_item.smail .ant-picker-range,
.generalModel_state .generalModel_state_item.smail .ant-select-selector,
.generalModel_state .generalModel_state_item.smail .range_picker {
padding: 1rem 2rem !important;
}
.generalModel_state .generalModel_state_item.smail .el-cascader {
padding: 1rem 2rem;
}
.generalModel_state .generalModel_state_item > input {
height: 2.5rem !important;
border-radius: 4rem;
@@ -761,6 +723,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
box-sizing: content-box;
background-color: #f3f3f3;
width: calc(100% - 4rem);
border: 1px solid #000;
}
.generalModel_state .generalModel_state_item .ant-picker-input > input {
font-size: 1.8rem;
@@ -773,6 +736,79 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
display: flex;
align-items: center;
}
.generalModel_state .generalModel_state_item .el-cascader {
font-size: 1.8rem;
width: 100%;
border: 1px solid #dcdfe6;
border-radius: 4rem;
background-color: #fff;
height: 2.5rem;
padding: 2rem;
transition: all 0.3s;
box-sizing: content-box;
}
.generalModel_state .generalModel_state_item .el-cascader .el-cascader__tags,
.generalModel_state .generalModel_state_item .el-cascader .el-input {
height: 100%;
}
.generalModel_state .generalModel_state_item .el-cascader .el-input .el-input__wrapper {
box-shadow: none;
padding: 0;
width: 100%;
}
.generalModel_state .generalModel_state_item .el-cascader .el-input .el-input__wrapper .el-input__inner {
font-size: 1.8rem;
}
.generalModel_state .generalModel_state_item .el-cascader:hover {
border: 1px solid;
}
.generalModel_state .generalModel_state_item .el-cascader__tags {
padding-left: 1rem;
}
.generalModel_state .generalModel_state_item .el-cascader__tags,
.generalModel_state .generalModel_state_item .el-cascader__collapse-tag {
--el-color-primary: #d9d9d9;
--el-cascader-tag-background: #000;
--el-fill-color: #e1d9ec;
box-sizing: content-box;
width: 90% !important;
flex-wrap: nowrap;
overflow: hidden;
align-items: center;
}
.generalModel_state .generalModel_state_item .el-cascader__tags .el-tag--light,
.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-tag--light {
margin: 0 0 0 0.6rem;
padding-right: 0.5rem;
height: 70%;
--el-icon-size: 1.4rem;
display: flex;
}
.generalModel_state .generalModel_state_item .el-cascader__tags .el-tag--light .el-tag__content,
.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-tag--light .el-tag__content {
font-size: 1.4rem;
color: #fff;
}
.generalModel_state .generalModel_state_item .el-cascader__tags .el-cascader__search-input,
.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-cascader__search-input {
height: 100%;
}
.generalModel_state .generalModel_state_item .el-cascader__search-input,
.generalModel_state .generalModel_state_item .el-input__inner {
margin: 0;
width: 100%;
height: 4.6rem;
padding-left: 2.1rem;
line-height: 4.6rem;
font-size: 1.8rem;
box-sizing: border-box;
}
.generalModel_state .generalModel_state_item .el-cascader__collapse-tag {
margin-bottom: 0.5rem;
}
.generalModel_state .generalModel_state_item .el-cascader__collapse-tag .el-cascader__collapse-tag .el-tag--light {
display: flex !important;
}
.generalModel_state .generalModel_current {
background: #fff;
width: 100%;
@@ -801,6 +837,13 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
.generalModel_state .header_user_content.active {
display: block;
}
.ant-select-dropdown {
border: 1px solid #000;
border-radius: 1rem;
}
.ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
background-color: #f3f3f6;
}
.generalModel {
-moz-user-select: none;
-webkit-user-select: none;
@@ -1088,7 +1131,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
background: #543087 !important;
}
.ant-spin-dot-item {
background-color: #543087;
background-color: #000000;
}
.ant-spin {
color: #000;
@@ -1169,6 +1212,16 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
.ant-pagination-prev:hover .ant-pagination-item-link,
.ant-pagination-next:hover .ant-pagination-item-link {
color: #000;
background-color: #fff;
border: 1px solid #000;
}
.ant-pagination-item:hover {
border: 1px solid #000;
}
.ant-pagination-prev .ant-pagination-item-link,
.ant-pagination-next .ant-pagination-item-link {
background-color: #000;
color: #fff;
}
.ant-pagination-item:hover a {
color: #000;

167
src/assets/style/style.less
View File

@@ -7,7 +7,7 @@ html,body,#app{
overflow: hidden;
// --antd-wave-shadow-color: #341e57;
--aida-fsize2: calc(2.6rem);
--aida-fsize1-8: calc(1.8rem*1.2);
--aida-fsize1-8: calc(1.8rem);
--aida-fsize1-6: calc(1.6rem);
--aida-fsize1-4: calc(1.4rem*1.2);
--antd-wave-shadow-color:#39215b;
@@ -272,59 +272,11 @@ input:focus{
.el-cascader{
font-size: 1.2rem;
width: 100%;
height: 3rem;
--el-color-primary: #d9d9d9;
--el-cascader-tag-background:#e1d9ec;
.el-input{
height: 100%;
.el-input__wrapper{
.el-input__inner{
height: 80% !important;
font-size: 1.2rem;
}
}
}
}
.el-popper{
padding: .5rem 1.1rem;
}
.el-cascader__tags,.el-cascader__collapse-tag{
--el-color-primary: #d9d9d9;
--el-cascader-tag-background:#e1d9ec;
--el-fill-color:#e1d9ec;
height: 100%;
width: 90% !important;
flex-wrap: nowrap;
overflow: hidden;
align-items: center;
.el-tag--light{
margin: 0 0 0 .6rem;
padding-right: .5rem;
height: 80%;
--el-icon-size: 1.4rem;
display: flex;
.el-tag__content{
font-size: 1.4rem;
color: #000;
}
}
.el-cascader__search-input{
height: 100%;
margin: 0 0 0 1.1rem;
}
}
.el-cascader__collapse-tag{
margin-bottom: .5rem;
.el-cascader__collapse-tag{
.el-tag--light{
display: flex !important;
}
}
}
.hideEvents{
pointer-events:none !important;
*{
@@ -794,6 +746,18 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
display: flex;
align-items: center;
margin-right: 5rem;
&.smail{
>input{
padding: 1rem 2rem !important;
}
.ant-picker-range,.ant-select-selector,.range_picker{
padding: 1rem 2rem !important;
}
.el-cascader{
padding: 1rem 2rem;
}
}
>input{
height: 2.5rem !important;
border-radius: 4rem;
@@ -824,6 +788,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
box-sizing: content-box;
background-color: #f3f3f3;
width: calc(100% - 4rem);
border: 1px solid #000;
}
.ant-picker-input > input{
font-size: 1.8rem;
@@ -838,6 +803,78 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
}
}
}
.el-cascader{
font-size: 1.8rem;
width: 100%;
border: 1px solid #dcdfe6;
border-radius: 4rem;
background-color: #fff;
height: 2.5rem;
padding: 2rem;
transition: all .3s;
box-sizing: content-box;
.el-cascader__tags,.el-input{
height: 100%;
}
.el-input{
.el-input__wrapper{
box-shadow: none;
padding: 0;
width: 100%;
.el-input__inner{
font-size: 1.8rem;
}
}
}
}
.el-cascader:hover{
border: 1px solid;
}
.el-cascader__tags{
padding-left: 1rem;
}
.el-cascader__tags,.el-cascader__collapse-tag{
--el-color-primary: #d9d9d9;
--el-cascader-tag-background:#000;
--el-fill-color:#e1d9ec;
box-sizing: content-box;
width: 90% !important;
flex-wrap: nowrap;
overflow: hidden;
align-items: center;
.el-tag--light{
margin: 0 0 0 .6rem;
padding-right: .5rem;
height: 70%;
--el-icon-size: 1.4rem;
display: flex;
.el-tag__content{
font-size: 1.4rem;
color: #fff;
}
}
.el-cascader__search-input{
height: 100%;
}
}
.el-cascader__search-input,.el-input__inner{
margin: 0;
width: 100%;
height: 4.6rem;
padding-left: 2.1rem;
line-height: 4.6rem;
font-size: 1.8rem;
box-sizing: border-box;
}
.el-cascader__collapse-tag{
margin-bottom: .5rem;
.el-cascader__collapse-tag{
.el-tag--light{
display: flex !important;
}
}
}
}
.generalModel_current{
background: #fff;
@@ -869,6 +906,14 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
}
}
//下拉的内容
.ant-select-dropdown{
border: 1px solid #000;
border-radius: 1rem;
.ant-select-item-option-selected:not(.ant-select-item-option-disabled){
background-color: #f3f3f6;
}
}
.generalModel{//自带关闭的页面
-moz-user-select: none;
@@ -1192,7 +1237,7 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
}
//loding样式
.ant-spin-dot-item{
background-color: #543087;
background-color: #000000;
}
.ant-spin{
color: #000;
@@ -1271,9 +1316,21 @@ tr > .ant-picker-cell-in-view.ant-picker-cell-range-hover-start:last-child::afte
border-color: #000;
box-shadow: none;
}
.ant-pagination-prev:hover .ant-pagination-item-link,
.ant-pagination-next:hover .ant-pagination-item-link{
color: #000;
.ant-pagination-prev:hover .ant-pagination-item-link,
.ant-pagination-next:hover .ant-pagination-item-link {
color: #000;
background-color: #fff;
border: 1px solid #000;
}
.ant-pagination-item:hover{
border: 1px solid #000;
}
.ant-pagination-prev,
.ant-pagination-next{
.ant-pagination-item-link{
background-color: #000;
color: #fff;
}
}
.ant-pagination-item:hover a{
color: #000;

2
src/component/Account/frontPage/bindPage.vue
View File

@@ -23,7 +23,7 @@
</div>
<div class="gmail_btn">
<div v-if="!userDetail.accountExtendList?.Google && googleLoad" class="gallery_btn">{{ $t('frontPage.BindNow') }}</div>
<div v-else class="gallery_btn loading"><i class="fi fi-br-loading"></i></div>
<div v-else-if="!userDetail.accountExtendList?.Google" class="gallery_btn loading"><i class="fi fi-br-loading"></i></div>
<div v-show="!userDetail.accountExtendList?.Google" id="g_id_bind"></div>
<div v-if="userDetail.accountExtendList?.Google" class="gallery_btn" @click="ungroupGoogleModel">{{ $t('frontPage.Unbind') }}</div>
</div>

42
src/component/HomePage/ExportModel.vue
View File

@@ -169,9 +169,8 @@
<div class="shortcutKeys_list_item" v-for="item in keysList" :key="item.name">
<div class="name">{{ item.name }}</div>
<div class="key">
<div>{{ item.winDowKey }}</div>
<span style="margin: 0 1rem">/</span>
<div>{{ item.macKey }}</div>
<div v-if="!isWindow">{{ item.macKey }}</div>
<div v-else>{{ item.winDowKey }}</div>
</div>
</div>
</div>
@@ -186,14 +185,14 @@
<div class="exportCanvasBox_center_box exportCanvasBox_left">
<div class="exportCanvasBox_left_tool exportCanvasBox_title">
<div class="exportCanvasBox_left_tool_item">
<i class="icon iconfont icon-chehui" @click="historyState('')"></i>
<i class="icon iconfont icon-fanchehui" @click="historyState('reverse')"></i>
<i class="icon iconfont icon-bianji" @click="setOperation('pencil')" :class="{active:operation == 'pencil'}"></i>
<i class="icon iconfont icon-chehui" @click="historyState('')" :title="isWindow?'Ctrl+Z':'Command+Z'"></i>
<i class="icon iconfont icon-fanchehui" @click="historyState('reverse')" :title="isWindow?'Ctrl+Shift+Z':'Command+Ctrl+Z'"></i>
<i class="icon iconfont icon-bianji" @click="setOperation('pencil')" :class="{active:operation == 'pencil'}" :title="isWindow?'~':'~'"></i>
<i class="icon iconfont icon-caizhi" @click="setOperation('texture')" :class="{active:operation == 'texture'}"></i>
<i class="icon iconfont icon-move" @click="setOperation('move')" :class="{active:operation == 'move'}"></i>
<i class="icon iconfont icon-xiangpi_huaban1" @click="setOperation('eraser')" :class="{active:operation == 'eraser'}"></i>
<i class="icon iconfont icon-move" @click="setOperation('move')" :class="{active:operation == 'move'}" :title="isWindow?'M':'M'"></i>
<i class="icon iconfont icon-xiangpi_huaban1" @click="setOperation('eraser')" :class="{active:operation == 'eraser'}" :title="isWindow?'~':'~'"></i>
<label class="uploadImage">
<label class="uploadImage" :title="isWindow?'Ctrl+O':'Command+O'">
<i class="fi fi-br-upload" ></i>
<input type="file" @change="uploadImage" accept="image/*">
</label>
@@ -353,7 +352,7 @@ export default defineComponent({
let driver__ = computed(()=>{
return store.state.Guide.guide
})
let isWindow = true
let showUpgradePlan = ref(false);
let canvas = ref({});
// let canvasDom = ref()
@@ -414,6 +413,12 @@ export default defineComponent({
"likeDesignCollectionList",
productData.key,
];
const userAgent = navigator.userAgent.toLowerCase();
if (userAgent.indexOf('windows') !== -1) {
isWindow = true
}else if(userAgent.indexOf('macintosh') !== -1 || userAgent.indexOf('mac os') !== -1) {
isWindow = false
}
createCanvas()
}
let setCanvasData = async (oldExportCanvas)=>{
@@ -1290,16 +1295,20 @@ export default defineComponent({
setPencilWidth()
}else if(keyDown.indexOf('KeyI') > -1){
getColor()//吸色
}else if(keyDown.indexOf('KeyM') > -1){
setOperation('move')
}else if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyD') > -1){
canvas.discardActiveObject().renderAll();
}else if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyO') > -1){
let input = document.querySelector('.uploadImage input')
input.click()
}else if(keyDown.indexOf('Backquote') > -1){
if(operation.value == 'pencil' || operation.value == 'texture'){
oldOperation = operation.value
setOperation('eraser')
}
// if(operation.value == 'pencil' || operation.value == 'texture'){
let str = 'pencil'
if(operation.value == 'pencil')str = 'eraser'
oldOperation = operation.value
setOperation(str)
// }
}
}
}
@@ -1323,7 +1332,7 @@ export default defineComponent({
return event.code !== item;
})
if(event.code == 'Backquote' && oldOperation){
setOperation(oldOperation)
// setOperation(oldOperation)
oldOperation = ''
}
}
@@ -2183,6 +2192,7 @@ export default defineComponent({
toSvg,
t,
toSvg,
isWindow,//判断是window还是mac
showUpgradePlan,//当前弹窗是否打开
canvasWH,//画布初始宽高
pencilbtnStyle,//笔触按钮
@@ -2419,7 +2429,7 @@ export default defineComponent({
display: none;
position: absolute;
z-index: 2;
width: 45rem;
width: 30rem;
max-height: 45rem;
background: #f7f8fa;
border-radius: 2rem;

24
src/component/HomePage/Generate.vue
View File

@@ -602,21 +602,15 @@ export default defineComponent({
},10000)
Https.axiosPost(Https.httpUrls.generatePrepare, data).then(
(rv) => {
if(data.isTestUser){
if(rv.leftUsageCount >= 1){
message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:this.t('collectionModal.Moodboard')}));
}else if(rv.leftUsageCount == 0){
message.warning(this.t('Generate.jsContent9',{str:this.t('collectionModal.Moodboard')}));
this.isGenerate = false
return
}
}
// rv.uniqueId.forEach((item:any) => {
// let arr:any = {}
// arr.taskId = item
// arr.status = 'execution'
// this.fileList.unshift(arr)
// });
// if(data.isTestUser){
// if(rv.leftUsageCount >= 1){
// message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:this.t('collectionModal.Moodboard')}));
// }else if(rv.leftUsageCount == 0){
// message.warning(this.t('Generate.jsContent9',{str:this.t('collectionModal.Moodboard')}));
// this.isGenerate = false
// return
// }
// }
this.setGenerate(rv.uniqueId)
}

5
src/component/HomePage/UpgradePlan.vue
View File

@@ -44,7 +44,7 @@
</div>
</div>
</div>
<payMethod ref="payMethod" @completePayment="cancelDsign"></payMethod>
<payMethod ref="payMethod" @completePayment="cancelDsign" type="credits"></payMethod>
<!-- <div v-show="stepNum == 1" class="UpgradePlan_payAffirm">
<div class="UpgradePlan_payAffirm_title">{{ $t('upgradePlan.payment') }}</div>
@@ -207,7 +207,8 @@ export default defineComponent({
}
},
payment(){//付款
let url = window.location.href
// let url = window.location.href
let url = window.location.origin+'/paySucceed'
// url = url.replace(/\/[^/]+$/, '') + '/home';
// console.log(url);
let parsedUrl = new URL(url);

2
src/component/HomePage/renew.vue
View File

@@ -68,7 +68,7 @@
</div>
</div>
</a-modal>
<payMethod ref="payMethod" @completePayment="cancelDsign"></payMethod>
<payMethod ref="payMethod" @completePayment="cancelDsign" type="renew"></payMethod>
</template>
<script lang="ts">

4
src/component/HomePage/scaleImage.vue
View File

@@ -109,7 +109,7 @@
<div class="scaleImage_content_imgBox" :class="{active:isComparison}">
<img v-if="isComparison" :src="scaleImageList[scaleImageIndex]?.sourceUrl">
<generalMiniCanvas v-if="isCanvas" :imgUrl="scaleImageList[scaleImageIndex]?.imgUrl" @submitBase64Data="submitBase64Data"></generalMiniCanvas>
<img v-else :src="scaleImageList[scaleImageIndex]?.imgUrl">
<img v-else :src="scaleImageList[scaleImageIndex]?.imgUrl || scaleImageList[scaleImageIndex]?.url">
<div class="img_operate_block" v-if="isLike">
<i v-if="!scaleImageList[scaleImageIndex]?.like" class="fi fi-rr-heart operate_icon" @click.stop="LikeFile(scaleImageList[scaleImageIndex],'like')"></i>
@@ -123,7 +123,7 @@
</div>
<div class="nav_list" v-mousewheel>
<div class="nav_centent">
<img v-for="item,index in scaleImageList" @click="setScaleImageIndex(index)" :class="{active:index == scaleImageIndex}" :src="item?.imgUrl" :key="item.id">
<img v-for="item,index in scaleImageList" @click="setScaleImageIndex(index)" :class="{active:index == scaleImageIndex}" :src="item?.imgUrl || item?.url" :key="item.id">
</div>
</div>
<div class="nav_right">

27
src/component/Pay/payMethod.vue
View File

@@ -27,23 +27,21 @@
</div>
<div class="payMethodContent">
<div class="generalModelTitle">
{{ $t('upgradePlan.PurchasePoints') }}
</div>
<div class="generalModelInfo">
{{ $t('upgradePlan.paymentmethod') }}
</div>
<div class="payMethod_list">
<label class="payMethod_item">
<label class="payMethod_item" v-show="$props.type == 'credits'">
<input name="payAffirm" type="radio" value="paypal" v-model="modeOfPayment">
<img src="../../assets/images/homePage/paypal.svg" alt="">
<span>PayPal</span>
</label>
<label class="payMethod_item">
<input name="Stripe" type="radio" value="stripe" v-model="modeOfPayment">
<img src="../../assets/images/homePage/bankCard.svg" alt="">
<span>{{ $t('upgradePlan.CreditCard') }}</span>
<img src="../../assets/images/homePage/stripe.svg" alt="">
<!-- <span>{{ $t('upgradePlan.CreditCard') }}</span> -->
<span>Stripe</span>
</label>
<label class="payMethod_item">
<label class="payMethod_item" v-show="$props.type == 'credits'">
<input name="payAffirm" type="radio" value="alipay" v-model="modeOfPayment">
<img src="../../assets/images/homePage/alipay.svg" alt="">
<span>{{ $t('upgradePlan.Alipay') }}</span>
@@ -71,6 +69,9 @@
</div>
</div>
<div class="mark_loading" v-show="isShowMark_">
<a-spin size="large" />
</div>
<div class="mark_loading" v-show="isShowMark" state="true">
<div class="mark_loading_title">{{ $t('upgradePlan.completed') }}</div>
<div class="mark_loading_intro">{{ $t('upgradePlan.hint') }}</div>
@@ -98,6 +99,12 @@ export default defineComponent({
components: {
VerificationCodeInput,
},
props:{
type:{
type:String,
default:''
}
},
emits: ['completePayment'],
setup(prop,{emit}){
const store = useStore();
@@ -114,6 +121,7 @@ export default defineComponent({
clause:false,
newWindow:null as any,
isShowMark:false,
isShowMark_:false,
})
const init = (data:any)=>{
payMethod.payMethodModel = true
@@ -123,6 +131,7 @@ export default defineComponent({
payMethod.payMethodModel = false
}
const payAffirm = () => {
payMethodData.isShowMark_ = true
if(!payMethodData.clause){
let labelDisclaimer:any = payMethodData.labelDisclaimer
if(!labelDisclaimer.classList.contains('animation')){
@@ -134,7 +143,7 @@ export default defineComponent({
return
}
let httpsUrl
let url = window.location.href
let url = window.location.origin+'/paySucceed'
let payAffirmData = payMethodData.payAffirmData
let data = {
autoRenewal:true,//false为不自动续费
@@ -177,8 +186,10 @@ export default defineComponent({
window.location.href=herf;
}
payMethodData.isShowMark = true
payMethodData.isShowMark_ = false
}
).catch(res=>{
payMethodData.isShowMark_ = false
});
}
const setPaidBack = ()=>{

40
src/views/HomeView/HomeView.vue
View File

@@ -101,7 +101,7 @@
<div class="right_content_body">
<div class="right_content_img_block scroll_style Guide_1_17 active" :class="[driver__.driver?'showEvents':'']">
<div class="right_content_img_item">
<div class="right_content_img_item" ref="designImg">
<!-- <draggable
group="people" > -->
@@ -127,10 +127,8 @@
)">
</div>
</div>
<div class="content_img_block" v-show="showDesignMark">
<div class="content_img_flex" >
<img class="content_img" src="@/assets/images/homePage/loading.gif" />
</div>
<div class="content_img_block" v-show="showDesignMark" :style="collStyle">
<a-spin size="large"></a-spin>
</div>
<!-- </draggable> -->
<div class="content_img_block" :style="collStyle" draggable v-for="(
@@ -376,16 +374,30 @@ export default defineComponent({
},
collTime:null as any,
})
let designImg = ref()
const setSystemDesigner = (time:any)=>{
clearTimeout(collItemSize.collTime)
collItemSize.collTime = setTimeout(()=>{
let wScale = 60,hScale = 92.5
let num = collItemSize.collValue
let {width,height} = collItemSize.collStyle
collItemSize.collStyle.width = wScale * ((num<20?20:num) / 100) + 'rem'
collItemSize.collStyle.height = hScale * ((num<20?20:num) / 100) + 'rem'
let width = wScale * ((num<20?20:num) / 100)
let height =hScale * ((num<20?20:num) / 100)
collItemSize.collStyle.width = width + 'rem'
collItemSize.collStyle.height = height + 'rem'
setDesignImgWidth()
},time)
}
const setDesignImgWidth = ()=>{
nextTick(()=>{
let width = designImg.value.parentElement.offsetWidth
let sonDom = designImg.value.querySelectorAll('div')[0]
if(Math.floor(width / (sonDom.offsetWidth+10 + 1)) > (likeDesignCollectionList.value.length + designCollectionList.value.length)){
designImg.value.style.width = 100+'%'
}else{
designImg.value.style.width = Math.floor(width / (sonDom.offsetWidth+10 + 1)) * (sonDom.offsetWidth + 10 + 1) + 'px'
}
})
}
setSystemDesigner(0)
return {
store,
@@ -410,6 +422,8 @@ export default defineComponent({
portfolio,
setSystemDesigner,
...toRefs(collItemSize),
designImg,
setDesignImgWidth,
};
},
data() {
@@ -744,6 +758,7 @@ export default defineComponent({
await new Promise((resolve, reject) => {
setTimeout(() => {
this.designCollectionList.unshift(item)
this.setDesignImgWidth()
resolve('')
}, 200);
})
@@ -1131,6 +1146,7 @@ export default defineComponent({
likeDesignCollectionList
);
}
this.setDesignImgWidth()
},
//统一处理选择组的渲染数据
@@ -1544,6 +1560,7 @@ export default defineComponent({
align-items: center;
// padding-bottom: 1rem;
overflow-x: auto;
justify-content: center;
&.active::-webkit-scrollbar-button:single-button{
display: none;
}
@@ -1586,8 +1603,8 @@ export default defineComponent({
width: 24rem;
height: 37rem;
// height: 29.5rem;
margin-right: 1rem;
margin-bottom: 1rem;
box-sizing: border-box;
margin: 5px;
// min-height: 271px;
max-height: 100%;
@@ -1596,6 +1613,9 @@ export default defineComponent({
vertical-align: top;
flex-shrink: 0;
max-height: 100%;
display: flex;
align-items: center;
justify-content: center;
&:hover .icon_like,&:hover .icon_delete {
display: block;
}

373
src/views/HomeView/library.vue
View File

@@ -36,68 +36,80 @@
<div v-show="selectCode != 'Models' && selectCode != 'DesignElements'" class='header_operate_item pointer' :class="{operate_select:uploadGenerate == 'Generate'}" @click="uploadGenerateOpen('Generate')">{{ $t('LibraryPage.Generate') }}</div>
</div>
<div class="librart_headr_right">
<div class="select_block" v-show="selectCode == 'Sketchboard' || selectCode == 'Models'|| selectCode == 'DesignElements'|| selectCode == 'Printboard'" >
<a-select
ref="select"
v-show="selectCode != 'DesignElements' && selectCode != 'Printboard'"
v-model:value="sex"
:options="sexList"
:fieldNames="{ label: 'name', value: 'value' }"
@change="sexChange"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
<a-select
ref="select"
v-show="designTypeList[selectCode]?.[0]?.value && selectCode != 'Sketchboard'"
v-model:value="designType"
:options="designTypeList[selectCode]"
@change="handleChange"
:fieldNames="{ label: 'name', value: 'value' }"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
<a-select
ref="select"
v-show="designTypeList[selectCode]?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate != 'Generate'"
v-model:value="designType"
:options="designTypeList[selectCode]"
@change="handleChange"
:fieldNames="{ label: 'name', value: 'value' }"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
<a-select
ref="select"
v-show="SketchGenerateTypeList?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate == 'Generate'"
v-model:value="SketchGenerateType"
:options="SketchGenerateTypeList"
@change="setSketchGenerateType"
:fieldNames="{ label: 'name', value: 'value' }"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
<div class="librart_headr_right ">
<div class="generalModel_state " v-show="selectCode == 'Sketchboard' || selectCode == 'Models'|| selectCode == 'DesignElements'|| selectCode == 'Printboard'" >
<div class="generalModel_state_item smail" v-if="selectCode != 'DesignElements' && selectCode != 'Printboard'">
<a-select
ref="select"
v-model:value="sex"
:options="sexList"
size="large"
:fieldNames="{ label: 'name', value: 'value' }"
style="width:20rem"
@change="sexChange"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
</div>
<div class="generalModel_state_item smail" v-if="designTypeList[selectCode]?.[0]?.value && selectCode != 'Sketchboard'">
<a-select
ref="select"
v-model:value="designType"
:options="designTypeList[selectCode]"
@change="handleChange"
style="width:20rem"
size="large"
:fieldNames="{ label: 'name', value: 'value' }"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
</div>
<div class="generalModel_state_item smail" v-if="designTypeList[selectCode]?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate != 'Generate'">
<a-select
ref="select"
v-model:value="designType"
:options="designTypeList[selectCode]"
@change="handleChange"
style="width:20rem"
size="large"
:fieldNames="{ label: 'name', value: 'value' }"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
</div>
<div class="generalModel_state_item smail" v-if="SketchGenerateTypeList?.[0]?.value && selectCode == 'Sketchboard' && uploadGenerate == 'Generate'">
<a-select
ref="select"
v-model:value="SketchGenerateType"
:options="SketchGenerateTypeList"
@change="setSketchGenerateType"
style="width:20rem"
size="large"
:fieldNames="{ label: 'name', value: 'value' }"
>
<template #suffixIcon
><span
class="icon iconfont icon-xiala"
style="color: #343579"
></span
></template>
</a-select>
</div>
</div>
</div>
</div>
@@ -128,13 +140,16 @@
<div :class="['header_operate_item' , 'fontSize',selectImgList.length>0?'active':'']" @click="deleteBatchPic()">{{ $t('LibraryPage.Delete') }}</div>
<div :class="['header_operate_item' , 'fontSize',selectImgList.length>0?'active':'']" @click="showRenameModal(selectImgList,'batch')">{{ $t('LibraryPage.Rename') }}</div>
</div>
<div class="content_search_block">
<input
class="search_input"
:placeholder="$t('LibraryPage.inputContent1')"
v-model="searchPictureName"
@keydown.enter="getLibraryList('')">
<div class="search_cascader">
<div class="content_search_block generalModel_state">
<div class="generalModel_state_item smail">
<input
class="search_input"
style="background-color: #fff;"
:placeholder="$t('LibraryPage.inputContent1')"
v-model="searchPictureName"
@keydown.enter="getLibraryList('')">
</div>
<div class="generalModel_state_item search_cascader smail">
<el-cascader
:options="options"
filterable
@@ -162,13 +177,14 @@
<div :title="$t('LibraryPage.intersection')" @click="()=>intersection = 0" v-show="intersection == 1" :class="['icon', 'iconfont','icon-bingji1',]"></div>
</div>
<!-- <div class="search_icon_block" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div> -->
<div class="generage_btn search_icon_block" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div>
<div class="gallery_btn" style="padding: 1rem; line-height: 1;" @click="getLibraryList('')"><span class="icon iconfont icon-sousuo"></span></div>
</div>
<div v-show="imgList.length" :class="['check_all_block',selectImgList.length == imgList.length ? 'check_all' : '']" @click="selectAllImg()">
<div class="check_block"><div class="check_block_body" v-show="selectImgList.length == imgList.length && imgList.length"></div></div>
<div>{{ $t('LibraryPage.all') }}</div>
</div>
</div>
<div v-show="imgList.length" :class="['check_all_block',selectImgList.length == imgList.length ? 'check_all' : '']" @click="selectAllImg()">
<div class="check_block"><div class="check_block_body" v-show="selectImgList.length == imgList.length && imgList.length"></div></div>
<div>{{ $t('LibraryPage.all') }}</div>
</div>
</div>
<div class="content_body_table scroll_style">
@@ -185,6 +201,9 @@
</div>
<div class="img_operate_block" :title="t('LibraryPage.Delete')" @click.stop="deleteSinglePic(img,index)">
<span class="icon iconfont icon-shanchu operate_icon"></span>
</div>
<div class="img_operate_block">
<i class="fi fi-bs-expand-arrows-alt" @click.stop="scaleImage(index,imgList,'library')"></i>
</div>
</div>
</div>
@@ -391,16 +410,14 @@
<div class="img_operate_block" :title="t('LibraryPage.Delete')" @click.stop="deleteGenerate(index)">
<span class="icon iconfont icon-shanchu operate_icon"></span>
</div>
</div>
<div class="img_operate_content left" :class="[driver__.driver?'hideEvents':'']">
<div class="img_operate_block">
<i class="fi fi-bs-expand-arrows-alt" @click.stop="scaleImage(index)"></i>
<i class="fi fi-bs-expand-arrows-alt" @click.stop="scaleImage(index,generateList[selectCode],'generate')"></i>
</div>
<div class="img_operate_block">
<i v-if="!img.like" class="fi fi-rr-heart operate_icon" @click.stop="likeFile(img,'like')"></i>
<i v-else class="fi fi-sr-heart operate_icon" :adminLike="!!img.like" @click.stop="likeFile(img,'noLike')"></i>
</div>
</div>
</div>
</div>
<sketchCategory v-show="selectCode == 'Sketchboard'" :disignTypeList="designTypeList[selectCode]" :generateList="generateList['Sketchboard']" :item="img"></sketchCategory>
</div>
@@ -441,6 +458,7 @@ import ModelPlacement from '@/component/LibraryPage/ModelPlacement.vue';
import setLabel from '@/component/LibraryPage/setLabel.vue';
import ModelPlacementMobile from '@/component/LibraryPage/ModelPlacementMobile.vue';
import searchLabel from '@/component/LibraryPage/searchLabel.vue';
// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
import { Modal,message,Upload,CascaderProps } from 'ant-design-vue';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
@@ -1293,7 +1311,6 @@ export default defineComponent({
placementModal.showPlacementModal(data,this.sex)
},
setTextareaShow(){
this.isTextarea = !this.isTextarea
this.isTextarea = !this.isTextarea
if(this.isTextarea){
document.addEventListener('click',this.setTextareaShow)
@@ -1522,14 +1539,14 @@ export default defineComponent({
}else if(selectCodeStr == 'Sketchboard'){
str = this.t('collectionModal.Sketchboard')
}
if(rv.leftUsageCount >= 1){
message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:str}));
}else if(rv.leftUsageCount == 0){
message.warning(this.t('Generate.jsContent9',{str:str}));
this.isGenerate[selectCodeStr] = false
// this.isShowMark = false
return
}
// if(rv.leftUsageCount >= 1){
// message.warning(this.t('Generate.jsContent8',{num:rv.leftUsageCount,str:str}));
// }else if(rv.leftUsageCount == 0){
// message.warning(this.t('Generate.jsContent9',{str:str}));
// this.isGenerate[selectCodeStr] = false
// // this.isShowMark = false
// return
// }
}
this.setGenerate(selectCodeStr,rv.uniqueId)
@@ -1671,10 +1688,11 @@ export default defineComponent({
},
scaleImage(index:any){
scaleImage(index:any,list:any,str:any){
let scaleImage:any = this.$refs.scaleImage
scaleImage.scaleImageMask = true
scaleImage.init(this.generateList[this.selectCode],index)
str == 'library'?scaleImage.isLike = false:scaleImage.isLike = true
scaleImage.init(list,index)
},
onPaste(e:any){
if(e.clipboardData.items[0] && !this.isTextarea && this.selectCode !== 'Moodboard' && this.scene?.value != 'Slogan' && this.scene?.value != 'Logo'){
@@ -1748,29 +1766,27 @@ export default defineComponent({
}
.library_body_left{
// width: 27.5rem;
width: 36.5rem;
// width: 36.5rem;
width: 23rem;
height: 100%;
background: rgba(255,255,255,0.4);
margin-right: 5rem;
margin-right: 3rem;
background: #f7f8fa;
>div{
background: #f7f8fa;
border-radius: 2rem;
overflow: hidden;
padding: 2rem 0;
}
.library_menu_list{
padding-left: 2rem;
.menu_item{
width: 100%;
height: 6.8rem;
display: flex;
font-weight: 900;
align-items: center;
justify-content: space-between;
padding: 0 1rem 0 2.5rem;
padding: 1rem 3rem;
border-left: 0.5rem solid transparent;
// font-size: 1.6rem;
font-size: var(--aida-fsize2);
font-size: var(--aida-fsize1-8);
color: #030303;
cursor: pointer;
transition: all .3s;
@@ -1780,11 +1796,8 @@ export default defineComponent({
}
&.select_menu_item{
background: #fff;
border-radius: 2rem;
transform: translateX(2rem);
// background: #E6E6F6;
// border-color: #343579;;
background: #000;
color: #fff;
}
.menu_item_left{
@@ -1795,7 +1808,6 @@ export default defineComponent({
.fi{
font-size: 2.2rem;
display: flex;
color: #030303;
margin-right: 1.8rem;
}
}
@@ -1842,55 +1854,25 @@ export default defineComponent({
cursor: pointer;
}
&:last-child{
margin-right: 11rem;
margin-right: 7rem;
}
}
.content_search_block{
display: flex;
align-items: center;
width: 75rem;
.search_input{
height: 3rem;
border-radius: 0.5rem;
width: 20rem;
border: 1px solid rgba(0, 0, 0, 0.15);
padding-left: 1.5rem;
border: 0.1rem solid #F1F1F1;
font-size: 1.2rem;
font-weight: 400;
margin-right: 2rem;
&::placeholder {
color: #C2C2C2;
}
// width: 85rem;
margin-left: auto;
.generalModel_state_item,.gallery_btn{
margin-right: 3rem;
}
.search_cascader{
// width: 53%;
width: 38rem;
display: flex;
position: relative;
}
.search_icon_block{
width: 5.2rem;
height: 2.8rem;
line-height: 2.8rem;
text-align: center;
background: #343579;
background-color: #39215b;
cursor: pointer;
border-radius: 2rem;
margin-left: 3rem;
.icon-sousuo{
font-size: 1.6rem;
color: #FFFFFF;
}
width: 37rem;
}
.intersection{
margin-left: 3rem;
cursor: pointer;
margin-right: 3rem;
font-size: 3rem;
}
}
@@ -1899,10 +1881,9 @@ export default defineComponent({
display: flex;
padding: 0 3.5rem 0 2.8rem;
align-items: center;
justify-content: space-between;
background: rgba(255,255,255,0.4);
box-shadow: 0 0.2rem 0.8rem 0 rgba(238,238,244,0.25);
margin-bottom: 3rem;
.library_header_left{
height: 4rem;
display: flex;
@@ -1910,30 +1891,15 @@ export default defineComponent({
}
.librart_headr_right{
display: flex;
align-items: center;
.select_block{
// background: #FFFFFF;
color: #1A1A1A !important;
.generalModel_state_item{
margin-right: 2rem;
.ant-select-selector{
border: 2px solid !important;
background: #fff;
}
.ant-select{
.ant-select-arrow{
.icon-xiala{
margin-left: -2rem;
zoom: .7;
}
}
}
.icon-xiala{
color: #1A1A1A !important;
}
}
}
}
}
@@ -1947,23 +1913,24 @@ export default defineComponent({
width: 100%;
height: 100%;
background: #f6f5fa;
padding: 0 2rem 5rem 1rem;
padding: 2rem 4rem;
border-radius: 2rem;
overflow: hidden;
display: flex;
flex-direction: column;
.content_body_header{
height: 10rem;
// height: 10rem;
margin-bottom: 1rem;
display: flex;
justify-content: flex-end;
align-items: center;
// padding: 2rem 0 2rem 3rem;
padding-left: 3rem;
box-sizing: content-box;
justify-content: space-between;
.content_body_header_left{
display: flex;
align-items: center;
width: 100%;
}
.content_body_header_right{
display: flex;
@@ -2017,10 +1984,10 @@ export default defineComponent({
padding-bottom: 0;
background: rgba(0, 0, 0, 0);
width: 55rem;
--width:65%;
.input_box_btnBox{
background: #fff;
align-items: center;
width:65%;
.search_input{
height: 3rem;
}
@@ -2099,12 +2066,15 @@ export default defineComponent({
.img_operate_content{
position: absolute;
right: 0.6rem;
top: 0.6rem;
&.left{
left: 0.6rem;
right: auto;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
max-width: 90%;
display: flex;
flex-wrap: wrap;
>div{
margin-bottom: .5rem;
margin-right: .5rem;
}
}
.img_operate_block{
@@ -2202,37 +2172,6 @@ export default defineComponent({
color:#adabb9
}
}
.select_block{
display: flex;
justify-content: space-between;
font-size: 1.8rem;
color:#adabb9;
font-weight: 300;
.ant-select{
border-radius: 4px;
width: 48%;
border: 0.1rem solid #d9d9d9 !important;
.ant-select-arrow{
.icon-xiala{
margin-left: -0rem;
}
}
}
.ant-select-selection-item{
color:#262626;
font-weight: 300;
}
.ant-select-selector{
margin-left: 0rem;
color:#adabb9;
width: 100%;
padding-left: 2.1rem;
}
.icon-xiala{
color: #adabb9 !important;
font-weight: 400;
}
}
}
.rename_button_list{
@@ -2261,31 +2200,7 @@ export default defineComponent({
color: #FFFFFF;
}
}
.el-cascader{
.el-input--suffix{
--el-input-hover-border-color: #d9d9d9;
// border: .1rem solid #d9d9d9;
}
height: 4.6rem;
.el-tag__content{
line-height: 2.5;
.el-cascader__tags{
}
}
.el-input__wrapper{
padding-left: 0;
}
.el-cascader__search-input,.el-input__inner{
margin: 0;
width: 100%;
height: 4.6rem;
padding-left: 2.1rem;
line-height: 4.6rem;
font-size: 1.8rem;
box-sizing: border-box;
}
}
}

1
src/views/LoginPage.vue
View File

@@ -564,7 +564,6 @@ export default defineComponent({
}
if(rv.email)userid.email = rv.email
this.store.commit("upUserDetail", userid);
this.store.commit("setSystemUser", rv.systemUser);
if (window.innerWidth < 768) {
message.info(