generate交互更新
This commit is contained in:
7
.env.dev
7
.env.dev
@@ -3,7 +3,10 @@ NODE_ENV = 'development'
|
|||||||
# VUE_APP_BASE_URL = 'https://api.aida.com.hk'
|
# VUE_APP_BASE_URL = 'https://api.aida.com.hk'
|
||||||
|
|
||||||
# VUE_APP_BASE_URL = 'http://18.167.251.121:10086'
|
# VUE_APP_BASE_URL = 'http://18.167.251.121:10086'
|
||||||
# VUE_APP_BASE_URL = 'https://develop.api.aida.com.hk'
|
VUE_APP_BASE_URL = 'https://develop.api.aida.com.hk'
|
||||||
# VUE_APP_BASE_URL = 'http://192.168.1.9:17088'
|
# VUE_APP_BASE_URL = 'http://192.168.1.9:17088'
|
||||||
|
# VUE_APP_BASE_URL = 'http://192.168.1.9:5567'
|
||||||
|
# 佩佩
|
||||||
# VUE_APP_BASE_URL = 'http://192.168.1.7:5567'
|
# VUE_APP_BASE_URL = 'http://192.168.1.7:5567'
|
||||||
VUE_APP_BASE_URL = 'http://192.168.1.9:5567'
|
# 海波
|
||||||
|
# VUE_APP_BASE_URL = 'http://192.168.1.9:5567'
|
||||||
|
|||||||
BIN
public/css/slogan/CN_LongCang-Regular.ttf
Normal file
BIN
public/css/slogan/CN_LongCang-Regular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/CN_ZCOOLQingKeHuangYou-Regular.ttf
Normal file
BIN
public/css/slogan/CN_ZCOOLQingKeHuangYou-Regular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/CN_ZCOOLXiaoWei-Regular.ttf
Normal file
BIN
public/css/slogan/CN_ZCOOLXiaoWei-Regular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/CN_ZhiMangXing-Regular.ttf
Normal file
BIN
public/css/slogan/CN_ZhiMangXing-Regular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_AngryFontNew-Regular.ttf
Normal file
BIN
public/css/slogan/EN_AngryFontNew-Regular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_Caveat-VariableFont_wght.ttf
Normal file
BIN
public/css/slogan/EN_Caveat-VariableFont_wght.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_EvgenyRegular.ttf
Normal file
BIN
public/css/slogan/EN_EvgenyRegular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_Jaro-Regular-VariableFont_opsz.ttf
Normal file
BIN
public/css/slogan/EN_Jaro-Regular-VariableFont_opsz.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_NaughtySwines-Regular.ttf
Normal file
BIN
public/css/slogan/EN_NaughtySwines-Regular.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_Wallhynd.ttf
Normal file
BIN
public/css/slogan/EN_Wallhynd.ttf
Normal file
Binary file not shown.
BIN
public/css/slogan/EN_skeleboom.ttf
Normal file
BIN
public/css/slogan/EN_skeleboom.ttf
Normal file
Binary file not shown.
56
public/css/sloganFamily.css
Normal file
56
public/css/sloganFamily.css
Normal file
@@ -0,0 +1,56 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art1';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_Wallhynd.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art2';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_Caveat-VariableFont_wght.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art3';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_EvgenyRegular.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art4';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_AngryFontNew-Regular.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art5';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_skeleboom.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art6';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_Jaro-Regular-VariableFont_opsz.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'EN_slogan_art7';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/EN_NaughtySwines-Regular.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
/* cn */
|
||||||
|
@font-face {
|
||||||
|
font-family: 'CN_slogan_art1';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/CN_LongCang-Regular.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'CN_slogan_art2';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/CN_ZCOOLQingKeHuangYou-Regular.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'CN_slogan_art3';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/CN_ZCOOLXiaoWei-Regular.ttf') format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'CN_slogan_art4';
|
||||||
|
font-weight: normal;
|
||||||
|
src: url('slogan/CN_ZhiMangXing-Regular.ttf') format('truetype');
|
||||||
|
}
|
||||||
@@ -10,6 +10,7 @@
|
|||||||
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet"> -->
|
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet"> -->
|
||||||
<link rel="stylesheet" href="/css/googleapis.css">
|
<link rel="stylesheet" href="/css/googleapis.css">
|
||||||
<link rel="stylesheet" href="/css/roboto.css">
|
<link rel="stylesheet" href="/css/roboto.css">
|
||||||
|
<link rel="stylesheet" href="/css/sloganFamily.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/color-thief/2.3.0/color-thief.umd.js"></script> -->
|
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/color-thief/2.3.0/color-thief.umd.js"></script> -->
|
||||||
|
|||||||
@@ -618,6 +618,23 @@ li {
|
|||||||
.generalModel .fi-rr-arrow-small-left {
|
.generalModel .fi-rr-arrow-small-left {
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
}
|
}
|
||||||
|
.generalModel .collection_title {
|
||||||
|
position: absolute;
|
||||||
|
top: calc(4rem*1.2);
|
||||||
|
display: flex;
|
||||||
|
font-size: var(--aida-fsize2);
|
||||||
|
font-weight: 900;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.generalModel .collection_title .collection_title_text {
|
||||||
|
margin-right: calc(4rem*1.2);
|
||||||
|
}
|
||||||
|
.generalModel .collection_title .collection_title_text_intro {
|
||||||
|
font-size: calc(1.2rem*1.2);
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(0, 0, 0, 0.45);
|
||||||
|
}
|
||||||
.generalModel .generalModel_btn .generalModel_closeIcon {
|
.generalModel .generalModel_btn .generalModel_closeIcon {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: calc(2rem*1.2);
|
top: calc(2rem*1.2);
|
||||||
@@ -1292,7 +1309,6 @@ textarea:focus {
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
padding-top: calc(2.5rem*1.2);
|
|
||||||
padding-bottom: calc(2rem*1.2);
|
padding-bottom: calc(2rem*1.2);
|
||||||
background: #fff;
|
background: #fff;
|
||||||
top: 0;
|
top: 0;
|
||||||
@@ -1305,6 +1321,8 @@ textarea:focus {
|
|||||||
position: relative;
|
position: relative;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
.collection_modal_body .input_border .input_box.active input,
|
.collection_modal_body .input_border .input_box.active input,
|
||||||
.design_detail_modal_component .input_border .input_box.active input,
|
.design_detail_modal_component .input_border .input_box.active input,
|
||||||
@@ -1365,14 +1383,28 @@ textarea:focus {
|
|||||||
.library_page .input_border .search_keyword .search_keyword_center .search_keyword_center_item:last-child {
|
.library_page .input_border .search_keyword .search_keyword_center .search_keyword_center_item:last-child {
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
}
|
}
|
||||||
|
.collection_modal_body .input_border .input_box_btnBox,
|
||||||
|
.design_detail_modal_component .input_border .input_box_btnBox,
|
||||||
|
.library_page .input_border .input_box_btnBox {
|
||||||
|
border: calc(0.1rem*1.2) solid #F1F1F1;
|
||||||
|
width: var(--width);
|
||||||
|
display: flex;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.collection_modal_body .input_border .upload_item .upload_file_item,
|
||||||
|
.design_detail_modal_component .input_border .upload_item .upload_file_item,
|
||||||
|
.library_page .input_border .upload_item .upload_file_item {
|
||||||
|
width: 8rem;
|
||||||
|
height: 8rem;
|
||||||
|
}
|
||||||
.collection_modal_body .input_border input,
|
.collection_modal_body .input_border input,
|
||||||
.design_detail_modal_component .input_border input,
|
.design_detail_modal_component .input_border input,
|
||||||
.library_page .input_border input {
|
.library_page .input_border input {
|
||||||
|
width: 100%;
|
||||||
border-radius: calc(0.5rem*1.2);
|
border-radius: calc(0.5rem*1.2);
|
||||||
width: var(--width);
|
|
||||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||||
padding-left: calc(1.5rem*1.2);
|
padding-left: calc(1.5rem*1.2);
|
||||||
border: calc(0.1rem*1.2) solid #F1F1F1;
|
border: calc(0.1rem*1.2) solid #ffffff00;
|
||||||
font-size: calc(1.6rem*1.2);
|
font-size: calc(1.6rem*1.2);
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
@@ -1396,24 +1428,56 @@ textarea:focus {
|
|||||||
.library_page .input_border input.forbidden {
|
.library_page .input_border input.forbidden {
|
||||||
cursor: no-drop;
|
cursor: no-drop;
|
||||||
}
|
}
|
||||||
.collection_modal_body .input_border .icon-xiala,
|
.collection_modal_body .input_border .input_box_btnBox_upImg,
|
||||||
.design_detail_modal_component .input_border .icon-xiala,
|
.design_detail_modal_component .input_border .input_box_btnBox_upImg,
|
||||||
.library_page .input_border .icon-xiala {
|
.library_page .input_border .input_box_btnBox_upImg {
|
||||||
margin-left: 1rem;
|
height: 100%;
|
||||||
display: inline-block;
|
}
|
||||||
|
.collection_modal_body .input_border .fi,
|
||||||
|
.design_detail_modal_component .input_border .fi,
|
||||||
|
.library_page .input_border .fi {
|
||||||
|
margin-right: 1rem;
|
||||||
|
display: flex;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
|
position: relative;
|
||||||
|
z-index: 4;
|
||||||
|
width: 4rem;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
.collection_modal_body .input_border .icon-xiala.active,
|
.collection_modal_body .input_border .fi.active,
|
||||||
.design_detail_modal_component .input_border .icon-xiala.active,
|
.design_detail_modal_component .input_border .fi.active,
|
||||||
.library_page .input_border .icon-xiala.active {
|
.library_page .input_border .fi.active {
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
}
|
}
|
||||||
.collection_modal_body .input_border .icon-xiala.forbidden,
|
.collection_modal_body .input_border .fi.forbidden,
|
||||||
.design_detail_modal_component .input_border .icon-xiala.forbidden,
|
.design_detail_modal_component .input_border .fi.forbidden,
|
||||||
.library_page .input_border .icon-xiala.forbidden {
|
.library_page .input_border .fi.forbidden {
|
||||||
cursor: no-drop;
|
cursor: no-drop;
|
||||||
}
|
}
|
||||||
|
.collection_modal_body .input_border .search_upImg,
|
||||||
|
.design_detail_modal_component .input_border .search_upImg,
|
||||||
|
.library_page .input_border .search_upImg {
|
||||||
|
width: 4rem;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
.collection_modal_body .input_border .search_upImg span,
|
||||||
|
.design_detail_modal_component .input_border .search_upImg span,
|
||||||
|
.library_page .input_border .search_upImg span {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.collection_modal_body .input_border .search_upImg .ant-upload-select-picture-card,
|
||||||
|
.design_detail_modal_component .input_border .search_upImg .ant-upload-select-picture-card,
|
||||||
|
.library_page .input_border .search_upImg .ant-upload-select-picture-card {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
.collection_modal_body .input_border .search_textarea,
|
.collection_modal_body .input_border .search_textarea,
|
||||||
.design_detail_modal_component .input_border .search_textarea,
|
.design_detail_modal_component .input_border .search_textarea,
|
||||||
.library_page .input_border .search_textarea {
|
.library_page .input_border .search_textarea {
|
||||||
@@ -1428,18 +1492,6 @@ textarea:focus {
|
|||||||
top: 0.2rem;
|
top: 0.2rem;
|
||||||
border: 1px solid #dcdfe6;
|
border: 1px solid #dcdfe6;
|
||||||
}
|
}
|
||||||
.collection_modal_body .input_border span,
|
|
||||||
.design_detail_modal_component .input_border span,
|
|
||||||
.library_page .input_border span {
|
|
||||||
position: absolute;
|
|
||||||
bottom: -2rem;
|
|
||||||
left: 0;
|
|
||||||
zoom: 0.8;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
color: red;
|
|
||||||
opacity: 0;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.collection_modal_body .input_border .generage_btn,
|
.collection_modal_body .input_border .generage_btn,
|
||||||
.design_detail_modal_component .input_border .generage_btn,
|
.design_detail_modal_component .input_border .generage_btn,
|
||||||
.library_page .input_border .generage_btn {
|
.library_page .input_border .generage_btn {
|
||||||
@@ -1515,6 +1567,11 @@ textarea:focus {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
.collection_modal_body .upload_item .upload_file_item .upload_file_item_content:hover div,
|
||||||
|
.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content:hover div,
|
||||||
|
.library_page .upload_item .upload_file_item .upload_file_item_content:hover div {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
.collection_modal_body .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block,
|
.collection_modal_body .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block,
|
||||||
.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block,
|
.design_detail_modal_component .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block,
|
||||||
.library_page .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block {
|
.library_page .upload_item .upload_file_item .upload_file_item_content:hover .delete_file_block {
|
||||||
@@ -1570,6 +1627,11 @@ textarea:focus {
|
|||||||
.library_page .upload_item .upload_file_item .upload_img_icon {
|
.library_page .upload_item .upload_file_item .upload_img_icon {
|
||||||
width: calc(4.6rem*1.2);
|
width: calc(4.6rem*1.2);
|
||||||
}
|
}
|
||||||
|
.collection_modal_body .upload_item .upload_file_item:last-child,
|
||||||
|
.design_detail_modal_component .upload_item .upload_file_item:last-child,
|
||||||
|
.library_page .upload_item .upload_file_item:last-child {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
.generalModel_modal .ant-modal-content {
|
.generalModel_modal .ant-modal-content {
|
||||||
border-radius: calc(1rem * 1.2);
|
border-radius: calc(1rem * 1.2);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -707,6 +707,23 @@ input:focus{
|
|||||||
.fi-rr-down-to-line,.fi-rr-arrow-small-right,.fi-rr-arrow-small-left{
|
.fi-rr-down-to-line,.fi-rr-arrow-small-right,.fi-rr-arrow-small-left{
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
}
|
}
|
||||||
|
.collection_title{
|
||||||
|
position: absolute;
|
||||||
|
top: calc(4rem*1.2);
|
||||||
|
display: flex;
|
||||||
|
font-size: var(--aida-fsize2);
|
||||||
|
font-weight: 900;
|
||||||
|
color: rgba(0,0,0,.65);
|
||||||
|
align-items: center;
|
||||||
|
.collection_title_text{
|
||||||
|
margin-right: calc(4rem*1.2);
|
||||||
|
}
|
||||||
|
.collection_title_text_intro{
|
||||||
|
font-size: calc(1.2rem*1.2);
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(0,0,0,.45);
|
||||||
|
}
|
||||||
|
}
|
||||||
.generalModel_btn {
|
.generalModel_btn {
|
||||||
.generalModel_closeIcon{
|
.generalModel_closeIcon{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@@ -1396,7 +1413,6 @@ textarea:focus{
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
padding-top: calc(2.5rem*1.2);
|
|
||||||
padding-bottom: calc(2rem*1.2);
|
padding-bottom: calc(2rem*1.2);
|
||||||
background: #fff;
|
background: #fff;
|
||||||
top: 0;
|
top: 0;
|
||||||
@@ -1406,6 +1422,8 @@ textarea:focus{
|
|||||||
position: relative;
|
position: relative;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
&.active{
|
&.active{
|
||||||
input{
|
input{
|
||||||
// color: rgb(255, 0, .7);
|
// color: rgb(255, 0, .7);
|
||||||
@@ -1457,12 +1475,25 @@ textarea:focus{
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
input{
|
.input_box_btnBox{
|
||||||
border-radius: calc(.5rem*1.2);
|
border: calc(0.1rem*1.2) solid #F1F1F1;
|
||||||
width: var(--width);
|
width: var(--width);
|
||||||
|
display: flex;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.upload_item{
|
||||||
|
.upload_file_item{
|
||||||
|
width: 8rem;
|
||||||
|
height: 8rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
input{
|
||||||
|
width: 100%;
|
||||||
|
border-radius: calc(.5rem*1.2);
|
||||||
border: 1px solid rgba(0,0,0,.15);
|
border: 1px solid rgba(0,0,0,.15);
|
||||||
padding-left: calc(1.5rem*1.2);
|
padding-left: calc(1.5rem*1.2);
|
||||||
border: calc(0.1rem*1.2) solid #F1F1F1;
|
border: calc(0.1rem*1.2) solid #ffffff00;
|
||||||
|
// border: calc(0.1rem*1.2) solid #F1F1F1;
|
||||||
font-size: calc(1.6rem*1.2);
|
font-size: calc(1.6rem*1.2);
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
&input:-moz-placeholder{
|
&input:-moz-placeholder{
|
||||||
@@ -1480,11 +1511,20 @@ textarea:focus{
|
|||||||
cursor: no-drop;
|
cursor: no-drop;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.icon-xiala{
|
.input_box_btnBox_upImg{
|
||||||
margin-left:1rem;
|
height: 100%;
|
||||||
display: inline-block;
|
}
|
||||||
|
.fi{
|
||||||
|
margin-right:1rem;
|
||||||
|
display: flex;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all .3s;
|
transition: all .3s;
|
||||||
|
position: relative;
|
||||||
|
z-index: 4;
|
||||||
|
width: 4rem;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
justify-content: center;
|
||||||
&.active{
|
&.active{
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
}
|
}
|
||||||
@@ -1492,6 +1532,22 @@ textarea:focus{
|
|||||||
cursor: no-drop;
|
cursor: no-drop;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.search_upImg{
|
||||||
|
width: 4rem;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
opacity: 0;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
span{
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.ant-upload-select-picture-card{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
.search_textarea{
|
.search_textarea{
|
||||||
z-index:3;
|
z-index:3;
|
||||||
height: auto;
|
height: auto;
|
||||||
@@ -1506,20 +1562,15 @@ textarea:focus{
|
|||||||
border: 1px solid #dcdfe6;
|
border: 1px solid #dcdfe6;
|
||||||
}
|
}
|
||||||
|
|
||||||
span{
|
// span{
|
||||||
position: absolute;
|
// // bottom: -2rem;
|
||||||
// bottom: calc(0rem*1.2);
|
// left: 0;
|
||||||
bottom: -2rem;
|
// // zoom: .8;
|
||||||
left: 0;
|
// top: 0;
|
||||||
zoom: .8;
|
// font-size: 1.2rem;
|
||||||
// font-size: calc(1.2rem*1.2);
|
// color: red;
|
||||||
font-size: 1.2rem;
|
// width: 100%;
|
||||||
color: red;
|
// }
|
||||||
opacity: 0;
|
|
||||||
// transform: scale(.7);
|
|
||||||
// transform-origin: left bottom;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.generage_btn{
|
.generage_btn{
|
||||||
// margin: 0 auto;
|
// margin: 0 auto;
|
||||||
margin-left: 2rem;
|
margin-left: 2rem;
|
||||||
@@ -1581,7 +1632,9 @@ textarea:focus{
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
&:hover div {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
&:hover .delete_file_block {
|
&:hover .delete_file_block {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
@@ -1593,7 +1646,6 @@ textarea:focus{
|
|||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
}
|
}
|
||||||
|
|
||||||
.delete_file_block {
|
.delete_file_block {
|
||||||
display: none;
|
display: none;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@@ -1630,6 +1682,9 @@ textarea:focus{
|
|||||||
width: calc(4.6rem*1.2);
|
width: calc(4.6rem*1.2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.upload_file_item:last-child{
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.generalModel_modal{//公共弹窗
|
.generalModel_modal{//公共弹窗
|
||||||
|
|||||||
@@ -264,12 +264,12 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
let data = this.workspaceItem
|
let data = this.workspaceItem
|
||||||
delete data.isLastIndex
|
delete data.isLastIndex
|
||||||
this.putWorkspace(data,'')
|
this.putWorkspace(data,this.workspaceItem.id)
|
||||||
this.openType.model = false
|
this.openType.model = false
|
||||||
// this.getDetail(this.workspaceItem.id)
|
// this.getDetail(this.workspaceItem.id)
|
||||||
this.store.commit("setWorkspace", this.workspaceItem);
|
this.store.commit("setWorkspace", this.workspaceItem);
|
||||||
}else{
|
}else{
|
||||||
this.getworkspace()
|
this.getworkspace('detail')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -281,19 +281,20 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
'workspaceItem.id_':{
|
'workspace.id':{
|
||||||
handler(newVal:any,oldVal:any){
|
handler(newVal:any,oldVal:any){
|
||||||
this.workspace.workspaceList.forEach((v:any)=>{
|
// this.workspace.workspaceList.forEach((v:any)=>{
|
||||||
if(v.id == this.workspaceItem.id_){
|
// if(v.id == this.workspaceItem.id_){
|
||||||
this.workspaceItem = v
|
// this.workspaceItem = v
|
||||||
this.workspaceItem.id_ = v.id
|
// this.workspaceItem.id_ = v.id
|
||||||
}
|
// }
|
||||||
if(v.id == oldVal){
|
// if(v.id == oldVal){
|
||||||
delete v.isLastIndex
|
// delete v.isLastIndex
|
||||||
this.putWorkspace(v,newVal)
|
// this.putWorkspace(v,newVal)
|
||||||
}
|
// this.getDetail(newVal)
|
||||||
})
|
// }
|
||||||
this.getMannequins()
|
// })
|
||||||
|
this.getDetail(newVal)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
'openType.workspace':{
|
'openType.workspace':{
|
||||||
@@ -334,10 +335,8 @@ export default defineComponent({
|
|||||||
// new Promise((resolve) => {
|
// new Promise((resolve) => {
|
||||||
// this.getPosition(resolve)
|
// this.getPosition(resolve)
|
||||||
// })
|
// })
|
||||||
await this.getPosition()
|
await this.getPosition()//获取衣服类型
|
||||||
if(this.workspaceItem.id == -1){
|
this.getworkspace('')
|
||||||
this.getworkspace()
|
|
||||||
}
|
|
||||||
this.getSex()
|
this.getSex()
|
||||||
},
|
},
|
||||||
directives:{
|
directives:{
|
||||||
@@ -449,7 +448,7 @@ export default defineComponent({
|
|||||||
// this.getworkspace()
|
// this.getworkspace()
|
||||||
// this.setPosition('')
|
// this.setPosition('')
|
||||||
},
|
},
|
||||||
getworkspace(){
|
getworkspace(str:any){
|
||||||
// Https.axiosGet(Https.httpUrls.workspaceDetail,{params:{id:3}}).then((rv: any) => {
|
// Https.axiosGet(Https.httpUrls.workspaceDetail,{params:{id:3}}).then((rv: any) => {
|
||||||
// if (rv) {
|
// if (rv) {
|
||||||
// console.log(rv,'workspace');
|
// console.log(rv,'workspace');
|
||||||
@@ -464,58 +463,23 @@ export default defineComponent({
|
|||||||
|
|
||||||
Https.axiosPost(Https.httpUrls.workspaceList,data).then((rv: any) => {
|
Https.axiosPost(Https.httpUrls.workspaceList,data).then((rv: any) => {
|
||||||
if (rv) {
|
if (rv) {
|
||||||
this.getDetail(rv.id)
|
// rv.page.content.forEach((v:any) => {
|
||||||
this.total = rv.page.total
|
// v.id_ = v.id
|
||||||
|
// if(v.position == "Overall"){
|
||||||
|
// v.overallSingle = false
|
||||||
|
// }else{
|
||||||
|
// v.overallSingle = true
|
||||||
|
// }
|
||||||
|
// v.putName = false
|
||||||
|
// });
|
||||||
this.workspace.id = rv.id
|
this.workspace.id = rv.id
|
||||||
|
this.total = rv.page.total
|
||||||
this.workspace.workspaceList = rv.page.content
|
this.workspace.workspaceList = rv.page.content
|
||||||
return
|
|
||||||
rv.page.content.forEach((v:any) => {
|
|
||||||
// v.id_ = v.id
|
|
||||||
// if(v.position == "Overall"){
|
|
||||||
// v.overallSingle = false
|
|
||||||
// }else{
|
|
||||||
// v.overallSingle = true
|
|
||||||
// }
|
|
||||||
// v.putName = false
|
|
||||||
if(v.id == (this.workspaceItem.id == -1 ?rv.id:this.workspaceItem.id)){
|
|
||||||
// this.workspaceItem = v
|
|
||||||
// this.workspaceItem.keyWord = {
|
|
||||||
// Moodboard:[{
|
|
||||||
// name:'Moodboard',
|
|
||||||
// id:1,
|
|
||||||
// },{
|
|
||||||
// name:'Moodboard',
|
|
||||||
// id:2,
|
|
||||||
// },{
|
|
||||||
// name:'Moodboard',
|
|
||||||
// id:3,
|
|
||||||
// }],
|
|
||||||
// Printboard:[{
|
|
||||||
// name:'Printboard',
|
|
||||||
// id:1,
|
|
||||||
// },{
|
|
||||||
// name:'Printboard',
|
|
||||||
// id:2,
|
|
||||||
// },{
|
|
||||||
// name:'Printboard',
|
|
||||||
// id:3,
|
|
||||||
// }],
|
|
||||||
// Sketchboard:[{
|
|
||||||
// name:'Sketchboard',
|
|
||||||
// id:1,
|
|
||||||
// },{
|
|
||||||
// name:'Sketchboard',
|
|
||||||
// id:2,
|
|
||||||
// },{
|
|
||||||
// name:'Sketchboard',
|
|
||||||
// id:3,
|
|
||||||
// }],
|
|
||||||
// }
|
|
||||||
// this.setMannequinsSex()
|
|
||||||
// this.setPosition('')
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
|
// this.workspaceItem = v
|
||||||
|
|
||||||
|
// this.setMannequinsSex()
|
||||||
|
// this.setPosition('')
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
@@ -527,12 +491,43 @@ export default defineComponent({
|
|||||||
}else{
|
}else{
|
||||||
rv.overallSingle = true
|
rv.overallSingle = true
|
||||||
}
|
}
|
||||||
|
rv.keyWord = {
|
||||||
|
Moodboard:[{
|
||||||
|
name:'Moodboard',
|
||||||
|
id:1,
|
||||||
|
},{
|
||||||
|
name:'Moodboard',
|
||||||
|
id:2,
|
||||||
|
},{
|
||||||
|
name:'Moodboard',
|
||||||
|
id:3,
|
||||||
|
}],
|
||||||
|
Printboard:[{
|
||||||
|
name:'Printboard',
|
||||||
|
id:1,
|
||||||
|
},{
|
||||||
|
name:'Printboard',
|
||||||
|
id:2,
|
||||||
|
},{
|
||||||
|
name:'Printboard',
|
||||||
|
id:3,
|
||||||
|
}],
|
||||||
|
Sketchboard:[{
|
||||||
|
name:'Sketchboard',
|
||||||
|
id:1,
|
||||||
|
},{
|
||||||
|
name:'Sketchboard',
|
||||||
|
id:2,
|
||||||
|
},{
|
||||||
|
name:'Sketchboard',
|
||||||
|
id:3,
|
||||||
|
}],
|
||||||
|
}
|
||||||
rv.putName = false
|
rv.putName = false
|
||||||
this.workspaceItem = rv
|
this.workspaceItem = rv
|
||||||
console.log(rv);
|
|
||||||
|
|
||||||
this.setMannequinsSex()
|
this.setMannequinsSex()
|
||||||
this.setPosition('')
|
this.setPosition('')
|
||||||
|
// this.getworkspace()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
@@ -558,25 +553,30 @@ export default defineComponent({
|
|||||||
if(this.workspaceItem.id == -1){
|
if(this.workspaceItem.id == -1){
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
this.openType.model = false
|
||||||
Https.axiosPost(Https.httpUrls.workspacesaveOrUpdate,data).then((rv: any) => {
|
Https.axiosPost(Https.httpUrls.workspacesaveOrUpdate,data).then((rv: any) => {
|
||||||
if (rv) {
|
if (rv) {
|
||||||
if(index){
|
if(index){
|
||||||
// this.getDetail(index)
|
// this.getDetail(index)
|
||||||
}else{
|
}else{
|
||||||
// this.getworkspace()
|
}
|
||||||
|
if(index){
|
||||||
|
this.getDetail(index)
|
||||||
|
}else{
|
||||||
|
this.getworkspace('')
|
||||||
}
|
}
|
||||||
this.workspace.workspaceList[index].workSpaceName = this.workspaceItemName
|
this.workspace.workspaceList[index].workSpaceName = this.workspaceItemName
|
||||||
this.workspace.workspaceList[index].putName = false
|
this.workspace.workspaceList[index].putName = false
|
||||||
this.openType.addWorkspace = false
|
this.openType.addWorkspace = false
|
||||||
}
|
}
|
||||||
}).catch((res)=>{
|
}).catch((res)=>{
|
||||||
this.getworkspace()
|
// this.getworkspace()
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
deleteWorkspace(data:any){
|
deleteWorkspace(data:any){
|
||||||
Https.axiosDelete(Https.httpUrls.workspaceRemove,data).then((rv: any) => {
|
Https.axiosDelete(Https.httpUrls.workspaceRemove,data).then((rv: any) => {
|
||||||
if (rv) {
|
if (rv) {
|
||||||
this.getworkspace()
|
this.getworkspace('')
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
@@ -631,6 +631,7 @@ export default defineComponent({
|
|||||||
message.info(this.t('Habit.jsContent2'));
|
message.info(this.t('Habit.jsContent2'));
|
||||||
}else{
|
}else{
|
||||||
if(index == -1){
|
if(index == -1){
|
||||||
|
|
||||||
let data = {
|
let data = {
|
||||||
workSpaceName:this.workspaceItemName,
|
workSpaceName:this.workspaceItemName,
|
||||||
}
|
}
|
||||||
@@ -644,7 +645,7 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
data.workSpaceName = this.workspaceItemName
|
data.workSpaceName = this.workspaceItemName
|
||||||
this.putWorkspace(data,'')
|
this.putWorkspace(data,this.workspaceItem.id)
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -666,8 +667,9 @@ export default defineComponent({
|
|||||||
this.workspace.workspaceList.forEach((v:any) => {
|
this.workspace.workspaceList.forEach((v:any) => {
|
||||||
v.putName = false
|
v.putName = false
|
||||||
});
|
});
|
||||||
|
this.putWorkspace(this.workspaceItem,'')
|
||||||
this.workspaceItem.id_ = num
|
this.workspace.id = num
|
||||||
|
// this.workspaceItem.id_ = num
|
||||||
this.openType.workspace = false
|
this.openType.workspace = false
|
||||||
},
|
},
|
||||||
//新建参数
|
//新建参数
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="generate">
|
<div class="generate">
|
||||||
<div v-if="type_.type2 == 'Sketchboard'|| type_.type2 == 'Printboard'" class="generate_checkbox Guide_1_2_2" :class="[driver__.driver?'hideEvents':'']">
|
<div v-if="type_.type2 == 'Sketchboard'|| type_.type2 == 'Printboard'" class="generate_checkbox Guide_1_2_2" :class="[driver__.driver?'hideEvents':'']">
|
||||||
<div v-show="type_.type2 != 'Sketchboard'">
|
<!-- <div v-show="type_.type2 != 'Sketchboard'">
|
||||||
<label>
|
<label>
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
@@ -32,29 +32,86 @@
|
|||||||
/>
|
/>
|
||||||
<span>{{ $t('Generate.TextImage') }}</span>
|
<span>{{ $t('Generate.TextImage') }}</span>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div> -->
|
||||||
<div v-if="type_.type2 == 'Printboard'" class="printModel">
|
<!-- <generalMenu :dataList="checkbox" @setprintModel="emitSetKeyword" :item="selectCheckbox" :deleteItem="type_.type2 == 'Sketchboard'?0:-1" :driver__="driver__.driver" :driverClass="{class1: '',class2:'',classList:{item1:'',item2:'',item3:''}}"></generalMenu> -->
|
||||||
|
|
||||||
|
<generalMenu :dataList="printModelList" @setprintModel="setprintModel" :item="printModel" :driver__="driver__.driver" :driverClass="{class1: 'Guide_1_2_4',class2:'Guide_1_2_5'}"></generalMenu>
|
||||||
|
<!-- <generalMenu :dataList="sceneList" @setprintModel="setSceneList" :item="scene"></generalMenu> -->
|
||||||
|
<!-- <div v-if="type_.type2 == 'Printboard'" class="printModel">
|
||||||
<div @click.stop="PrintModel" class="Guide_1_2_4" :class="[driver__.driver?'showEvents':'']">{{ printModel.name }}</div>
|
<div @click.stop="PrintModel" class="Guide_1_2_4" :class="[driver__.driver?'showEvents':'']">{{ printModel.name }}</div>
|
||||||
<ul v-show="printModel.optype" class="Guide_1_2_5" :class="[driver__.driver?'showEvents':'']">
|
<ul v-show="printModel.optype" class="Guide_1_2_5" :class="[driver__.driver?'showEvents':'']">
|
||||||
<li class="printModel_item" @click="setprintModel(1)">{{ $t('Generate.Model1') }}</li>
|
<li class="printModel_item" @click="setprintModel(1)">{{ $t('Generate.Model1') }}</li>
|
||||||
<li class="printModel_item" @click="setprintModel(2)">{{ $t('Generate.Model2') }}</li>
|
<li class="printModel_item" @click="setprintModel(2)">{{ $t('Generate.Model2') }}</li>
|
||||||
<li class="printModel_item" @click="setprintModel(3)">{{ $t('Generate.Model3') }}</li>
|
<li class="printModel_item" @click="setprintModel(3)">{{ $t('Generate.Model3') }}</li>
|
||||||
<!-- <li v-show="(sketchboardList.length>=1 && moodboarList.length>=1&& checkbox[0].type) || (sketchboardList.length>=2 && checkbox[0].type) " class="printModel_item" @click="setprintModel(4)">{{ $t('Generate.Merge') }}</li> -->
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="input_border" >
|
<div class="input_border" >
|
||||||
<div class="input_box Guide_1_5" :class="[inputShow?'active':'',]">
|
<div class="input_box Guide_1_5" :class="[inputShow?'active':'',]">
|
||||||
<input
|
<div class="input_box_btnBox">
|
||||||
class="search_input"
|
<div class="upload_item">
|
||||||
@input="ifMaximumLength"
|
<div
|
||||||
:placeholder="$t('Generate.inputContent1')"
|
class="upload_file_item Guide_1_2_7"
|
||||||
:maxlength='inputShow?0:9999'
|
v-for="(file, index) in sketchboardList"
|
||||||
v-model="searchPictureName"
|
:key="file"
|
||||||
@keydown.enter="getgenerate()"
|
:class="[checkboxImage? 'forbidden':'',driver__.driver?'showEvents':'']"
|
||||||
@click="inputFocus()"
|
>
|
||||||
/>
|
<div
|
||||||
<i class="icon iconfont icon-xiala" :class="{active:isTextarea}" @click.stop="setTextareaShow"></i>
|
class="upload_file_item_content"
|
||||||
|
v-show="file?.status === 'uploading'"
|
||||||
|
>
|
||||||
|
<a-spin :indicator="indicator" tip="Uploading..." />
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="upload_file_item_content"
|
||||||
|
v-show="file?.status === 'done' || file?.base64"
|
||||||
|
>
|
||||||
|
<img :src="file?.imgUrl" class="upload_img" />
|
||||||
|
<!-- <div
|
||||||
|
class="delete_file_block"
|
||||||
|
:class="[driver__.driver?'hideEvents':'']"
|
||||||
|
@click.stop="deleteFile(index)"
|
||||||
|
>
|
||||||
|
<span class="icon iconfont icon-shanchu"></span>
|
||||||
|
</div> -->
|
||||||
|
<div class="delete_like_file_block" :class="[driver__.driver?'hideEvents':'']">
|
||||||
|
<span class="icon iconfont icon-shanchu operate_icon" @click.stop="deleteFile(index)"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<input
|
||||||
|
class="search_input"
|
||||||
|
@input="ifMaximumLength"
|
||||||
|
:placeholder="$t('Generate.inputContent1')"
|
||||||
|
:maxlength='inputShow?0:9999'
|
||||||
|
v-model="searchPictureName"
|
||||||
|
@keydown.enter="getgenerate()"
|
||||||
|
@click="inputFocus()"
|
||||||
|
/>
|
||||||
|
<i class="fi fi-br-upload" v-show="!isTextarea && upload.level1Type !== 'Moodboard'">
|
||||||
|
<a-upload
|
||||||
|
class="search_upImg"
|
||||||
|
:capture="null"
|
||||||
|
:action="uploadUrl + '/api/element/upload'"
|
||||||
|
list-type="picture-card"
|
||||||
|
:data="{
|
||||||
|
...upload,
|
||||||
|
}"
|
||||||
|
:maxCount='1'
|
||||||
|
:headers="{ Authorization: token }"
|
||||||
|
v-model:file-list="sketchboardList"
|
||||||
|
:before-upload="beforeUpload"
|
||||||
|
accept=".jpg,.png,.jpeg,.bmp"
|
||||||
|
@change="(file) => fileUploadChange(file)"
|
||||||
|
>
|
||||||
|
</a-upload>
|
||||||
|
</i>
|
||||||
|
<i v-show="!isTextarea" class="fi fi-br-expand" @click.stop="setTextareaShow"></i>
|
||||||
|
<i v-show="isTextarea" class="fi fi-bs-compress" @click.stop="setTextareaShow"></i>
|
||||||
|
<i v-show="scene?.value == 'slogan'" @click.stop="setSlogan" class="fi fi-rr-poll-h"></i>
|
||||||
|
<!-- <i class="icon iconfont icon-xiala" :class="{active:isTextarea}" @click.stop="setTextareaShow"></i> -->
|
||||||
|
</div>
|
||||||
<textarea
|
<textarea
|
||||||
v-show="isTextarea"
|
v-show="isTextarea"
|
||||||
class="search_textarea "
|
class="search_textarea "
|
||||||
@@ -79,22 +136,12 @@
|
|||||||
<div class="search_keyword" v-show="isInputFocus" @click.stop="">
|
<div class="search_keyword" v-show="isInputFocus" @click.stop="">
|
||||||
<div class="search_keyword_center">
|
<div class="search_keyword_center">
|
||||||
<div class="search_keyword_center_left">
|
<div class="search_keyword_center_left">
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
<div v-for="item in workspace?.keyWord?.[type_.type2]" @click.stop="cliSetKeyword(item.name)" class="search_keyword_center_item"> {{item.name}} </div>
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
<div @click.stop="cliSetKeyword('asdasd')" class="search_keyword_center_item">asdasd</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="type_.type2 == 'Sketchboard' || type_.type2 == 'Printboard'" class="generage_img Guide_1_6">
|
<!-- <div v-if="type_.type2 == 'Sketchboard' || type_.type2 == 'Printboard'" class="generage_img Guide_1_6">
|
||||||
<div class="upload_item">
|
<div class="upload_item">
|
||||||
<div
|
<div
|
||||||
class="upload_file_item Guide_1_2_7"
|
class="upload_file_item Guide_1_2_7"
|
||||||
@@ -123,36 +170,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
|
||||||
class="upload_file_item upload_component Guide_1_2_6"
|
|
||||||
:class="[driver__.driver?'showEvents':'']"
|
|
||||||
>
|
|
||||||
<a-upload
|
|
||||||
:capture="null"
|
|
||||||
:action="uploadUrl + '/api/element/upload'"
|
|
||||||
list-type="picture-card"
|
|
||||||
:data="{
|
|
||||||
...upload,
|
|
||||||
}"
|
|
||||||
:disabled="checkbox[1].type"
|
|
||||||
:headers="{ Authorization: token }"
|
|
||||||
v-model:file-list="sketchboardList"
|
|
||||||
:before-upload="beforeUpload"
|
|
||||||
multiple
|
|
||||||
accept=".jpg,.png,.jpeg,.bmp"
|
|
||||||
@change="(file) => fileUploadChange(file)"
|
|
||||||
>
|
|
||||||
<div
|
|
||||||
class="upload_tip_block"
|
|
||||||
>
|
|
||||||
<i class="fi fi-br-upload"></i>
|
|
||||||
<!-- <img class="upload_img_icon" src="@/assets/images/homePage/add_file.png"> -->
|
|
||||||
</div>
|
|
||||||
</a-upload>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
<div v-else class="generage_img Guide_1_6" :style="[loadingShow?'overflow:hidden':'']">
|
<div class="generage_img Guide_1_6" :style="[loadingShow?'overflow:hidden':'']">
|
||||||
<div
|
<div
|
||||||
class="generage_img_item"
|
class="generage_img_item"
|
||||||
v-for="(item, index) in fileList"
|
v-for="(item, index) in fileList"
|
||||||
@@ -160,7 +180,6 @@
|
|||||||
@click="generageAdd(item)"
|
@click="generageAdd(item)"
|
||||||
:class="[item.status != 'Success'?'hideEvents':'',item?.checked?'active':'']"
|
:class="[item.status != 'Success'?'hideEvents':'',item?.checked?'active':'']"
|
||||||
>
|
>
|
||||||
<!-- <img v-show="item.status != 'Success'" src="@/assets/images/homePage/loading.gif" alt=""> -->
|
|
||||||
<img v-lazy="item.imgUrl" @click.stop="generageAdd(item)">
|
<img v-lazy="item.imgUrl" @click.stop="generageAdd(item)">
|
||||||
<div
|
<div
|
||||||
class="delete_like_file_block left1"
|
class="delete_like_file_block left1"
|
||||||
@@ -176,14 +195,13 @@
|
|||||||
<span class="icon iconfont icon-shanchu operate_icon"></span>
|
<span class="icon iconfont icon-shanchu operate_icon"></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="mark_loading" v-show="loadingShow">
|
<div class="mark_loading" v-show="loadingShow">
|
||||||
<a-spin size="large" />
|
<a-spin size="large" />
|
||||||
<div v-show="remGenerate" :class="[driver__.driver?'hideEvents':'']" class="mark_loading_btn" @click="removeGenerate">{{$t('Generate.Close')}}</div>
|
<div v-show="remGenerate" :class="[driver__.driver?'hideEvents':'']" class="mark_loading_btn" @click="removeGenerate">{{$t('Generate.Close')}}</div>
|
||||||
</div>
|
</div>
|
||||||
<scaleImage ref="scaleImage"></scaleImage>
|
<scaleImage ref="scaleImage"></scaleImage>
|
||||||
|
<createSlogan ref="createSlogan" @setSloganData="setSloganData"></createSlogan>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
@@ -197,30 +215,62 @@ import { getCookie } from "@/tool/cookie";
|
|||||||
import { getUploadUrl } from "@/tool/util";
|
import { getUploadUrl } from "@/tool/util";
|
||||||
// import { forEach } from "jszip";
|
// import { forEach } from "jszip";
|
||||||
import scaleImage from "@/component/HomePage/scaleImage.vue";
|
import scaleImage from "@/component/HomePage/scaleImage.vue";
|
||||||
|
import generalMenu from "@/component/HomePage/generalMenu.vue";
|
||||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
import { openGuide,driverObj__,driverIndex__ } from "@/tool/guide";
|
import { openGuide,driverObj__,driverIndex__ } from "@/tool/guide";
|
||||||
|
import createSlogan from "@/component/HomePage/createSlogan.vue";
|
||||||
import { useI18n } from "vue-i18n";
|
import { useI18n } from "vue-i18n";
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
scaleImage,
|
scaleImage,
|
||||||
|
generalMenu,
|
||||||
|
createSlogan,
|
||||||
},
|
},
|
||||||
props: ["msg",'sketchCatecoryList'],
|
props: ["msg",'sketchCatecoryList','scene'],
|
||||||
setup() {
|
setup(props) {
|
||||||
// console.log(prop.msg);
|
// console.log(prop.msg);
|
||||||
let checkbox = ref([
|
let checkbox = ref([
|
||||||
{
|
{
|
||||||
name: "image",
|
name: "image",
|
||||||
type: true,
|
type: true,
|
||||||
|
label:useI18n().t('Generate.ImageOnly'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "text",
|
name: "text",
|
||||||
type: false,
|
type: false,
|
||||||
|
label:useI18n().t('Generate.TextOnly'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "text-image",
|
name: "text-image",
|
||||||
type: false,
|
type: false,
|
||||||
|
label:useI18n().t('Generate.TextImage')
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
|
let selectCheckbox = checkbox.value[0]
|
||||||
|
let printModelList = ref([
|
||||||
|
{
|
||||||
|
num:'',
|
||||||
|
optype:false,
|
||||||
|
value:'Painting Style',
|
||||||
|
label:useI18n().t('Generate.Model1')
|
||||||
|
},{
|
||||||
|
num:'',
|
||||||
|
optype:false,
|
||||||
|
value:'Illustration Style',
|
||||||
|
label:useI18n().t('Generate.Model2')
|
||||||
|
},{
|
||||||
|
num:'',
|
||||||
|
optype:false,
|
||||||
|
value:'Real Style',
|
||||||
|
label:useI18n().t('Generate.Model3')
|
||||||
|
},
|
||||||
|
])
|
||||||
|
let printModel = ref({
|
||||||
|
num:'',
|
||||||
|
optype:false,
|
||||||
|
value:'Painting Style',
|
||||||
|
label:useI18n().t('Generate.Model1')
|
||||||
|
})
|
||||||
let checkboxImage = ref()
|
let checkboxImage = ref()
|
||||||
let imgList = ref([]);
|
let imgList = ref([]);
|
||||||
let selectImgList: any = ref([]);
|
let selectImgList: any = ref([]);
|
||||||
@@ -240,14 +290,9 @@ export default defineComponent({
|
|||||||
let sketchboardList:any = ref([])
|
let sketchboardList:any = ref([])
|
||||||
let collectionElementid = ref()
|
let collectionElementid = ref()
|
||||||
let level2Type = ref('')
|
let level2Type = ref('')
|
||||||
let printModel = ref({
|
|
||||||
num:'',
|
|
||||||
optype:false,
|
|
||||||
value:'Painting Style',
|
|
||||||
name:useI18n().t('Generate.Model'+1)
|
|
||||||
})
|
|
||||||
// let printBoards:any = computed(()=>{return store.state.UploadFilesModule.printboard})
|
// let printBoards:any = computed(()=>{return store.state.UploadFilesModule.printboard})
|
||||||
let moodboarList:any = computed(()=>{return store.state.UploadFilesModule.moodboard})
|
// let moodboarList:any = computed(()=>{return store.state.UploadFilesModule.moodboard})
|
||||||
// let sketchCatecoryList:any = ref([])
|
// let sketchCatecoryList:any = ref([])
|
||||||
let workspace:any = ref({})
|
let workspace:any = ref({})
|
||||||
|
|
||||||
@@ -258,7 +303,6 @@ export default defineComponent({
|
|||||||
let driver__:any = inject('driver__')
|
let driver__:any = inject('driver__')
|
||||||
let {t} = useI18n()
|
let {t} = useI18n()
|
||||||
let isMmerge = ref(false)
|
let isMmerge = ref(false)
|
||||||
|
|
||||||
let isTest = ref()
|
let isTest = ref()
|
||||||
let userInfo:any = {}
|
let userInfo:any = {}
|
||||||
let generateId:any = ref([])
|
let generateId:any = ref([])
|
||||||
@@ -266,6 +310,7 @@ export default defineComponent({
|
|||||||
let generateProceedList = ref([])
|
let generateProceedList = ref([])
|
||||||
let remGenerate:any = ref(false)
|
let remGenerate:any = ref(false)
|
||||||
let remGenerateTime:any = ref()
|
let remGenerateTime:any = ref()
|
||||||
|
let scene:any = props.scene
|
||||||
return {
|
return {
|
||||||
imgList,
|
imgList,
|
||||||
selectImgList,
|
selectImgList,
|
||||||
@@ -279,6 +324,7 @@ export default defineComponent({
|
|||||||
searcMaterialhName,
|
searcMaterialhName,
|
||||||
designType,
|
designType,
|
||||||
checkbox,
|
checkbox,
|
||||||
|
selectCheckbox,
|
||||||
store,
|
store,
|
||||||
fileList,
|
fileList,
|
||||||
sketchboardList,
|
sketchboardList,
|
||||||
@@ -286,10 +332,13 @@ export default defineComponent({
|
|||||||
level2Type,
|
level2Type,
|
||||||
checkboxImage,
|
checkboxImage,
|
||||||
printModel,
|
printModel,
|
||||||
|
printModelList,
|
||||||
loadingShow,
|
loadingShow,
|
||||||
isGenerate,
|
isGenerate,
|
||||||
|
scene,
|
||||||
|
|
||||||
// printBoards,
|
// printBoards,
|
||||||
moodboarList,
|
// moodboarList,
|
||||||
// sketchCatecoryList,
|
// sketchCatecoryList,
|
||||||
workspace,
|
workspace,
|
||||||
inputShow,
|
inputShow,
|
||||||
@@ -327,7 +376,6 @@ export default defineComponent({
|
|||||||
type1: "generate",
|
type1: "generate",
|
||||||
type2: prop.msg,
|
type2: prop.msg,
|
||||||
},
|
},
|
||||||
workspaceCom:{},
|
|
||||||
isTextarea:false,
|
isTextarea:false,
|
||||||
isInputFocus:false,
|
isInputFocus:false,
|
||||||
};
|
};
|
||||||
@@ -346,26 +394,31 @@ export default defineComponent({
|
|||||||
let isTest:any = getCookie('isTest')
|
let isTest:any = getCookie('isTest')
|
||||||
this.isTest =JSON.parse(isTest)
|
this.isTest =JSON.parse(isTest)
|
||||||
this.uploadUrl = getUploadUrl();
|
this.uploadUrl = getUploadUrl();
|
||||||
this.workspaceCom = computed(()=>{
|
this.workspace = computed(()=>{
|
||||||
return this.store?.state?.Workspace?.workspace
|
return this.store?.state?.Workspace?.workspace
|
||||||
})
|
})
|
||||||
this.workspace = this.store.state.Workspace.workspace
|
|
||||||
if(this.type_.type2 == 'Sketchboard'){
|
if(this.type_.type2 == 'Sketchboard'){
|
||||||
this.checkbox=[
|
this.checkbox=[
|
||||||
{
|
{
|
||||||
name: "image",
|
name: "image",
|
||||||
type: false,
|
type: false,
|
||||||
},
|
label:useI18n().t('Generate.ImageOnly'),
|
||||||
{
|
},
|
||||||
name: "text",
|
{
|
||||||
type: true,
|
name: "text",
|
||||||
},
|
type: true,
|
||||||
{
|
label:useI18n().t('Generate.TextOnly'),
|
||||||
name: "text-image",
|
},
|
||||||
type: false,
|
{
|
||||||
},
|
name: "text-image",
|
||||||
]
|
type: false,
|
||||||
|
label:useI18n().t('Generate.TextImage')
|
||||||
|
},
|
||||||
|
]
|
||||||
|
this.selectCheckbox = this.checkbox[1]
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$emit('generateCheckbox',this.checkbox[0].type)
|
this.$emit('generateCheckbox',this.checkbox[0].type)
|
||||||
},
|
},
|
||||||
watch:{
|
watch:{
|
||||||
@@ -382,21 +435,20 @@ export default defineComponent({
|
|||||||
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
workspaceCom(newVal,oldVal){
|
workspace(newVal,oldVal){
|
||||||
this.workspace = newVal
|
|
||||||
this.upload.gender = newVal?.sexEnum?.name
|
this.upload.gender = newVal?.sexEnum?.name
|
||||||
},
|
},
|
||||||
moodboarList(newVal,oldVal){
|
// moodboarList(newVal,oldVal){
|
||||||
if(newVal.length>=1 || this.sketchboardList.length >= 2){
|
// if(newVal.length>=1 || this.sketchboardList.length >= 2){
|
||||||
}else{
|
// }else{
|
||||||
this.printModel = {
|
// this.printModel = {
|
||||||
num:'',
|
// num:'',
|
||||||
optype:false,
|
// optype:false,
|
||||||
value:'Painting Style',
|
// value:'Painting Style',
|
||||||
name:this.t('Generate.Model'+1)
|
// name:this.t('Generate.Model'+1)
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
},
|
// },
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
getSketchLabel(value: any) {
|
getSketchLabel(value: any) {
|
||||||
@@ -444,6 +496,14 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
return (isJpgOrPng && isLt2M) || Upload.LIST_IGNORE;
|
return (isJpgOrPng && isLt2M) || Upload.LIST_IGNORE;
|
||||||
},
|
},
|
||||||
|
emitSetKeyword(data:any){
|
||||||
|
this.selectCheckbox = data
|
||||||
|
this.checkbox.forEach((item:any,index:any) => {
|
||||||
|
if(item.name == data.name){
|
||||||
|
this.setKeyword(index)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
setKeyword(num: any) {
|
setKeyword(num: any) {
|
||||||
this.checkbox.forEach((v: any) => {
|
this.checkbox.forEach((v: any) => {
|
||||||
v.type = false;
|
v.type = false;
|
||||||
@@ -466,70 +526,30 @@ export default defineComponent({
|
|||||||
if(this.driver__.driver){
|
if(this.driver__.driver){
|
||||||
driverObj__.moveNext()
|
driverObj__.moveNext()
|
||||||
}
|
}
|
||||||
this.printModel = {
|
|
||||||
num:'',
|
|
||||||
optype:false,
|
|
||||||
value:'Painting Style',
|
|
||||||
name:this.t('Generate.Model'+1)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
PrintModel(){
|
setprintModel(value:any){
|
||||||
if(!this.printModel.optype){
|
this.printModel = value
|
||||||
document.addEventListener('click',this.removePrintModel)
|
|
||||||
}
|
|
||||||
this.printModel.optype = !this.printModel.optype
|
|
||||||
nextTick().then(()=>{
|
|
||||||
if(this.driver__.driver){
|
|
||||||
driverObj__.moveNext()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
removePrintModel(){
|
|
||||||
this.printModel.optype = false
|
|
||||||
document.removeEventListener('click',this.removePrintModel)
|
|
||||||
},
|
|
||||||
setprintModel(num:any){
|
|
||||||
let arr = ["Painting Style","Illustration Style","Real Style"]
|
|
||||||
if(num == 4){
|
|
||||||
this.printModel = {
|
|
||||||
num : 'Generate',
|
|
||||||
optype:false,
|
|
||||||
value:'',
|
|
||||||
name:this.t('Generate.Merge')
|
|
||||||
}
|
|
||||||
}else{
|
|
||||||
this.printModel = {
|
|
||||||
num : num,
|
|
||||||
value:arr[num-1],
|
|
||||||
optype:false,
|
|
||||||
name:this.t('Generate.Model'+num)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
nextTick().then(()=>{
|
|
||||||
if(this.driver__.driver){
|
|
||||||
driverObj__.moveNext()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
getgenerate(){
|
getgenerate(){
|
||||||
clearInterval(this.remGenerateTime)
|
clearInterval(this.remGenerateTime)
|
||||||
this.remGenerate = false
|
// this.remGenerate = false
|
||||||
// if(this.isTest){//试用用户禁止使用
|
// // if(this.isTest){//试用用户禁止使用
|
||||||
// message.info(
|
// // message.info(
|
||||||
// this.t('isTest.available')
|
// // this.t('isTest.available')
|
||||||
// );
|
// // );
|
||||||
// return
|
// // return
|
||||||
// }
|
// // }
|
||||||
if(this.isGenerate){
|
// if(this.isGenerate){
|
||||||
return
|
|
||||||
}
|
|
||||||
// if(!this.searchPictureName){
|
|
||||||
// message.info(
|
|
||||||
// this.t('Generate.jsContent3')
|
|
||||||
// );
|
|
||||||
// return
|
// return
|
||||||
// }
|
// }
|
||||||
|
// // if(!this.searchPictureName){
|
||||||
|
// // message.info(
|
||||||
|
// // this.t('Generate.jsContent3')
|
||||||
|
// // );
|
||||||
|
// // return
|
||||||
|
// // }
|
||||||
|
|
||||||
if(this.searchPictureName){
|
if(this.searchPictureName){
|
||||||
let arr = this.searchPictureName.split(/\s+/).length
|
let arr = this.searchPictureName.split(/\s+/).length
|
||||||
if(arr > 250){
|
if(arr > 250){
|
||||||
@@ -539,24 +559,33 @@ export default defineComponent({
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
}else{
|
}else{
|
||||||
message.info(
|
if(this.sketchboardList[0].imgUrl){
|
||||||
this.t('Generate.jsContent5')
|
|
||||||
);
|
}else{
|
||||||
return
|
message.info(
|
||||||
|
this.t('Generate.jsContent5')
|
||||||
|
);
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
let data = {
|
let data = {
|
||||||
generateType:'text',
|
generateType:'',
|
||||||
designType:'',
|
designType:'collection',
|
||||||
collectionElementId:'',
|
collectionElementId:this.sketchboardList[0].id?this.sketchboardList[0].id:'',
|
||||||
level1Type:this.upload.level1Type,
|
level1Type:this.upload.level1Type,
|
||||||
level2Type:'',
|
level2Type:this.scene?.value?this.scene?.value:'',
|
||||||
text:this.searchPictureName,
|
text:this.searchPictureName,
|
||||||
userId:this?.userInfo?.userId,
|
userId:this?.userInfo?.userId,
|
||||||
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
|
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||||
version:1,//为1就是Print
|
version:1,//为1就是Print
|
||||||
isTestUser:this.driver__.driver?false:this.isTest,
|
isTestUser:this.driver__.driver?false:this.isTest,
|
||||||
gender:'',
|
gender:'',
|
||||||
|
base64:this.sketchboardList[0].base64?this.sketchboardList[0].imgUrl:'',
|
||||||
}
|
}
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
return
|
||||||
this.isGenerate = true
|
this.isGenerate = true
|
||||||
Https.axiosPost(Https.httpUrls.generatePrepare, data).then(
|
Https.axiosPost(Https.httpUrls.generatePrepare, data).then(
|
||||||
(rv) => {
|
(rv) => {
|
||||||
@@ -670,8 +699,6 @@ export default defineComponent({
|
|||||||
this.isTextarea = !this.isTextarea
|
this.isTextarea = !this.isTextarea
|
||||||
},
|
},
|
||||||
cliSetKeyword(value:any){
|
cliSetKeyword(value:any){
|
||||||
console.log(this.workspace);
|
|
||||||
|
|
||||||
let str = ''
|
let str = ''
|
||||||
if(this.searchPictureName[this.searchPictureName.length-1] != ',' && this.searchPictureName.length != 0){
|
if(this.searchPictureName[this.searchPictureName.length-1] != ',' && this.searchPictureName.length != 0){
|
||||||
str = ','
|
str = ','
|
||||||
@@ -732,12 +759,7 @@ export default defineComponent({
|
|||||||
let fileList = this.sketchboardList.filter(
|
let fileList = this.sketchboardList.filter(
|
||||||
(v: any) => v.status === "done"
|
(v: any) => v.status === "done"
|
||||||
);
|
);
|
||||||
let arr = this.store.state.UploadFilesModule.sketchboard;
|
this.sketchboardList = fileList
|
||||||
if (arr.length >= 8) {
|
|
||||||
message.info(this.t('Generate.jsContent6'));
|
|
||||||
} else {
|
|
||||||
this.sketchboardList = fileList
|
|
||||||
}
|
|
||||||
nextTick().then(()=>{
|
nextTick().then(()=>{
|
||||||
if(this.driver__.driver){
|
if(this.driver__.driver){
|
||||||
driverObj__.moveNext()
|
driverObj__.moveNext()
|
||||||
@@ -765,50 +787,55 @@ export default defineComponent({
|
|||||||
message.warning(res.errMsg);
|
message.warning(res.errMsg);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
setSlogan(){
|
||||||
setSketchboardItem(item:any){
|
let createSlogan:any = this.$refs.createSlogan
|
||||||
if(this.checkboxImage){
|
createSlogan.init()
|
||||||
return
|
|
||||||
}
|
|
||||||
let parent:any = this.$parent
|
|
||||||
|
|
||||||
if(item.checked){
|
|
||||||
item.checked = false
|
|
||||||
this.collectionElementid = ''
|
|
||||||
}else{
|
|
||||||
let obj = {
|
|
||||||
imgId : item.id,
|
|
||||||
imgUr: item.imgUrl,
|
|
||||||
level2Type:item.category,
|
|
||||||
designType:'collection'
|
|
||||||
}
|
|
||||||
// parent.useGenerate.designType = 'collection'
|
|
||||||
this.$emit('setGenerate',obj)
|
|
||||||
this.sketchboardList.forEach((v:any)=>{
|
|
||||||
if(v.checked){
|
|
||||||
v.checked = false
|
|
||||||
}
|
|
||||||
})
|
|
||||||
item.checked = true
|
|
||||||
this.collectionElementid = item.id
|
|
||||||
}
|
|
||||||
this.level2Type = item.category
|
|
||||||
if(this.driver__.driver){
|
|
||||||
driverObj__.moveNext()
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
setSloganData(data:any){
|
||||||
|
this.sketchboardList = data
|
||||||
|
},
|
||||||
|
// setSketchboardItem(item:any){
|
||||||
|
// if(this.checkboxImage){
|
||||||
|
// return
|
||||||
|
// }
|
||||||
|
// let parent:any = this.$parent
|
||||||
|
|
||||||
|
// if(item.checked){
|
||||||
|
// item.checked = false
|
||||||
|
// this.collectionElementid = ''
|
||||||
|
// }else{
|
||||||
|
// let obj = {
|
||||||
|
// imgId : item.id,
|
||||||
|
// imgUr: item.imgUrl,
|
||||||
|
// level2Type:item.category,
|
||||||
|
// designType:'collection'
|
||||||
|
// }
|
||||||
|
// // parent.useGenerate.designType = 'collection'
|
||||||
|
// this.$emit('setGenerate',obj)
|
||||||
|
// this.sketchboardList.forEach((v:any)=>{
|
||||||
|
// if(v.checked){
|
||||||
|
// v.checked = false
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
// item.checked = true
|
||||||
|
// this.collectionElementid = item.id
|
||||||
|
// }
|
||||||
|
// this.level2Type = item.category
|
||||||
|
// if(this.driver__.driver){
|
||||||
|
// driverObj__.moveNext()
|
||||||
|
// }
|
||||||
|
// },
|
||||||
deleteFile(item: any) {
|
deleteFile(item: any) {
|
||||||
// this.sketchboardList
|
|
||||||
this.collectionElementid = ''
|
this.collectionElementid = ''
|
||||||
this.sketchboardList.splice(item, 1);
|
this.sketchboardList.splice(item, 1);
|
||||||
if((this.sketchboardList.length<2 && this.moodboarList.length == 0) || this.sketchboardList.length == 0){
|
// if((this.sketchboardList.length<2 && this.moodboarList.length == 0) || this.sketchboardList.length == 0){
|
||||||
this.printModel = {
|
// this.printModel = {
|
||||||
num:'',
|
// num:'',
|
||||||
optype:false,
|
// optype:false,
|
||||||
value:'Painting Style',
|
// value:'Painting Style',
|
||||||
name:this.t('Generate.Model'+1)
|
// label:this.t('Generate.Model'+1)
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
},
|
},
|
||||||
likeFile(item:any,str:string){
|
likeFile(item:any,str:string){
|
||||||
if(str == 'like'){
|
if(str == 'like'){
|
||||||
@@ -882,6 +909,7 @@ export default defineComponent({
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
border-right: 1px solid #e5e5e5;
|
border-right: 1px solid #e5e5e5;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
padding-top: calc(2.5rem*1.2);
|
||||||
&.generate::-webkit-scrollbar {
|
&.generate::-webkit-scrollbar {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
@@ -898,13 +926,12 @@ export default defineComponent({
|
|||||||
position: sticky;
|
position: sticky;
|
||||||
top: 0;
|
top: 0;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
padding-top: calc(2.5rem*1.2);
|
|
||||||
padding-bottom: calc(2rem*1.2);
|
padding-bottom: calc(2rem*1.2);
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
.generate_checkbox {
|
.generate_checkbox {
|
||||||
|
z-index: 10;
|
||||||
div {
|
div {
|
||||||
margin-right: calc(4rem*1.2);
|
|
||||||
label {
|
label {
|
||||||
display: flex;
|
display: flex;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@@ -919,42 +946,6 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.printModel{
|
|
||||||
>div{
|
|
||||||
width: calc(13rem*1.2);
|
|
||||||
// display: flex;
|
|
||||||
display: block;
|
|
||||||
border-radius: calc(1rem*1.2);
|
|
||||||
margin: 0;
|
|
||||||
border: 2px solid;
|
|
||||||
cursor: pointer;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
padding: 0 calc(1rem*1.2);
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
ul{
|
|
||||||
position: absolute;
|
|
||||||
width: calc(13rem*1.2);
|
|
||||||
text-align: center;
|
|
||||||
margin-top: calc(.3rem*1.2);
|
|
||||||
border-radius: calc(1rem*1.2);
|
|
||||||
overflow: hidden;
|
|
||||||
li{
|
|
||||||
background: rgba(0,0,0,.2);
|
|
||||||
line-height: 2;
|
|
||||||
cursor: pointer;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
padding: 0 calc(1rem*1.2);
|
|
||||||
&.printModel_item:hover{
|
|
||||||
background: rgba(0,0,0,.4);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.generage_input {
|
.generage_input {
|
||||||
}
|
}
|
||||||
.generage_img {
|
.generage_img {
|
||||||
|
|||||||
@@ -6,25 +6,32 @@
|
|||||||
<div class="upload_header_item">
|
<div class="upload_header_item">
|
||||||
<div class="switch_type_list">
|
<div class="switch_type_list">
|
||||||
<div
|
<div
|
||||||
@click.stop="open(1)"
|
|
||||||
class="switch_type_item"
|
class="switch_type_item"
|
||||||
:class="[openClick == 1 ? 'select_swtich' : '']"
|
:class="[openClick == 1 ? 'select_swtich' : '']"
|
||||||
>
|
>
|
||||||
<span>{{ $t('PrintboardUpload.Upload') }}</span>
|
<span @click.stop="open(1)">{{ $t('PrintboardUpload.Upload') }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
@click.stop="open(2)"
|
|
||||||
class="switch_type_item"
|
class="switch_type_item"
|
||||||
:class="[openClick == 2 ? 'select_swtich' : '']"
|
:class="[openClick == 2 ? 'select_swtich' : '']"
|
||||||
>
|
>
|
||||||
<span>{{ $t('PrintboardUpload.Library') }}</span>
|
<span @click.stop="open(2)">{{ $t('PrintboardUpload.Library') }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
@click.stop="open(3)"
|
|
||||||
class="switch_type_item Guide_1_2_1"
|
class="switch_type_item Guide_1_2_1"
|
||||||
:class="[openClick == 3 ? 'select_swtich' : '',driver__.driver?'showEvents':'']"
|
:class="[openClick == 3 ? 'select_swtich' : '',driver__.driver?'showEvents':'']"
|
||||||
>
|
>
|
||||||
<span>{{ $t('PrintboardUpload.Generate') }}</span>
|
<span @click.stop="open(3)">{{ $t('PrintboardUpload.Generate') }}</span>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div v-show="openClick == 3" class="generalMenu_printModel printMenu">
|
||||||
|
<div @click.stop="openPrintModel">{{ scene.label }} <i class="icon iconfont icon-xiala" :class="{forbidden:openMenu}"></i></div>
|
||||||
|
<ul v-show="openMenu">
|
||||||
|
<li v-for="item,index in sceneList" class="printModel_item" @click.stop="setSceneList(item)">{{ item.label }}</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -85,7 +92,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Material v-show="openClick == 2" ref="Material" msg="Printboard" @setLibrary = setSetchboardGenerate @confirmSelect="confirmSelect"></Material>
|
<Material v-show="openClick == 2" ref="Material" msg="Printboard" @setLibrary = setSetchboardGenerate @confirmSelect="confirmSelect"></Material>
|
||||||
<Generate v-show="openClick == 3" ref="Generate" msg="Printboard" @setGenerate = setSetchboardGenerate @generateCheckbox="getgenerateCheckbox"></Generate>
|
<Generate v-show="openClick == 3" ref="Generate" :scene="scene" msg="Printboard" @setGenerate = setSetchboardGenerate @generateCheckbox="getgenerateCheckbox"></Generate>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal_right">
|
<div class="modal_right">
|
||||||
<div class="modal_layout">
|
<div class="modal_layout">
|
||||||
@@ -105,8 +112,17 @@
|
|||||||
<div v-show="openClick == 3" class="modal_accomplish">
|
<div v-show="openClick == 3" class="modal_accomplish">
|
||||||
<div class="input_border">
|
<div class="input_border">
|
||||||
<div class="Guide_1_2_8 input_box" :class="[inputShow?'active':'',driver__.driver?'showEvents':'']">
|
<div class="Guide_1_2_8 input_box" :class="[inputShow?'active':'',driver__.driver?'showEvents':'']">
|
||||||
<input class="search_input" @input="ifMaximumLength" @keydown.enter="getgenerate" :maxlength='inputShow?0:9999' :class="{forbidden:generateCheckbox}" :readonly="generateCheckbox" :placeholder="$t('PrintboardUpload.inputContent1')" v-model="captionGeneration">
|
<div class="input_box_btnBox">
|
||||||
<i class="icon iconfont icon-xiala" :class="{active:isTextarea,forbidden:generateCheckbox}" @click.stop="setTextareaShow"></i>
|
<input class="search_input"
|
||||||
|
@click="inputFocus()"
|
||||||
|
@input="ifMaximumLength"
|
||||||
|
@keydown.enter="getgenerate"
|
||||||
|
:maxlength='inputShow?0:9999'
|
||||||
|
:class="{forbidden:generateCheckbox}"
|
||||||
|
:readonly="generateCheckbox"
|
||||||
|
:placeholder="$t('PrintboardUpload.inputContent1')" v-model="captionGeneration">
|
||||||
|
<i class="icon iconfont icon-xiala" :class="{active:isTextarea,forbidden:generateCheckbox}" @click.stop="setTextareaShow"></i>
|
||||||
|
</div>
|
||||||
<textarea class="search_textarea" v-show="isTextarea && !generateCheckbox" @input="ifMaximumLength" @keydown.enter="getgenerate" :maxlength='inputShow?0:9999' :class="{forbidden:generateCheckbox}" :readonly="generateCheckbox" v-model="captionGeneration">
|
<textarea class="search_textarea" v-show="isTextarea && !generateCheckbox" @input="ifMaximumLength" @keydown.enter="getgenerate" :maxlength='inputShow?0:9999' :class="{forbidden:generateCheckbox}" :readonly="generateCheckbox" v-model="captionGeneration">
|
||||||
</textarea>
|
</textarea>
|
||||||
<!-- <div class="generage_btn started_btn" @click.stop="getgenerate">{{ $t('PrintboardUpload.Generate') }}</div> -->
|
<!-- <div class="generage_btn started_btn" @click.stop="getgenerate">{{ $t('PrintboardUpload.Generate') }}</div> -->
|
||||||
@@ -125,6 +141,13 @@
|
|||||||
</div>
|
</div>
|
||||||
<span ref="inputShowText"></span>
|
<span ref="inputShowText"></span>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="search_keyword" v-show="isInputFocus" @click.stop="">
|
||||||
|
<div class="search_keyword_center">
|
||||||
|
<div class="search_keyword_center_left">
|
||||||
|
<div v-for="item in workspace?.keyWord?.[upload.level1Type]" @click.stop="cliSetKeyword(item.name)" class="search_keyword_center_item"> {{item.name}} </div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<!-- <div>
|
<!-- <div>
|
||||||
<div v-show="!isUseGenerate" @click="setUseGenerate">Printboard</div>
|
<div v-show="!isUseGenerate" @click="setUseGenerate">Printboard</div>
|
||||||
<div v-show="isUseGenerate" @click="setUseGenerate">Generate</div>
|
<div v-show="isUseGenerate" @click="setUseGenerate">Generate</div>
|
||||||
@@ -166,7 +189,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent,h,ref,computed,inject,createVNode, nextTick } from 'vue'
|
import { defineComponent,h,ref,computed,inject,createVNode,provide, nextTick } from 'vue'
|
||||||
import { LoadingOutlined } from '@ant-design/icons-vue';
|
import { LoadingOutlined } from '@ant-design/icons-vue';
|
||||||
import {getCookie} from '@/tool/cookie'
|
import {getCookie} from '@/tool/cookie'
|
||||||
import {getUploadUrl} from '@/tool/util'
|
import {getUploadUrl} from '@/tool/util'
|
||||||
@@ -182,6 +205,7 @@ import { openGuide,driverObj__ } from "@/tool/guide";
|
|||||||
import scaleImage from "@/component/HomePage/scaleImage.vue";
|
import scaleImage from "@/component/HomePage/scaleImage.vue";
|
||||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
|
import generalMenu from "@/component/HomePage/generalMenu.vue";
|
||||||
import { overflow } from 'html2canvas/dist/types/css/property-descriptors/overflow';
|
import { overflow } from 'html2canvas/dist/types/css/property-descriptors/overflow';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
@@ -190,6 +214,7 @@ export default defineComponent({
|
|||||||
Material,
|
Material,
|
||||||
Generate,
|
Generate,
|
||||||
scaleImage,
|
scaleImage,
|
||||||
|
generalMenu,
|
||||||
},
|
},
|
||||||
setup(){
|
setup(){
|
||||||
let store:any =useStore()
|
let store:any =useStore()
|
||||||
@@ -224,6 +249,24 @@ export default defineComponent({
|
|||||||
level2Type:'',
|
level2Type:'',
|
||||||
designType:''
|
designType:''
|
||||||
})
|
})
|
||||||
|
let workspace = ref({})
|
||||||
|
let sceneList = ref([
|
||||||
|
{
|
||||||
|
label:'pattern',
|
||||||
|
value:'pattern'
|
||||||
|
},{
|
||||||
|
label:'slogan',
|
||||||
|
value:'slogan'
|
||||||
|
},{
|
||||||
|
label:'logo',
|
||||||
|
value:'logo'
|
||||||
|
},
|
||||||
|
])
|
||||||
|
let scene = ref({
|
||||||
|
label:'pattern',
|
||||||
|
value:'pattern'
|
||||||
|
})
|
||||||
|
let openMenu = ref(false)
|
||||||
return {
|
return {
|
||||||
fileList,
|
fileList,
|
||||||
printImgList,
|
printImgList,
|
||||||
@@ -246,6 +289,10 @@ export default defineComponent({
|
|||||||
remGenerateTime,
|
remGenerateTime,
|
||||||
useGenerate,
|
useGenerate,
|
||||||
isUseGenerate,
|
isUseGenerate,
|
||||||
|
workspace,
|
||||||
|
sceneList,
|
||||||
|
scene,
|
||||||
|
openMenu,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed:{
|
computed:{
|
||||||
@@ -295,7 +342,7 @@ export default defineComponent({
|
|||||||
}),
|
}),
|
||||||
source:axios.CancelToken.source(),
|
source:axios.CancelToken.source(),
|
||||||
isTextarea:false,
|
isTextarea:false,
|
||||||
|
isInputFocus:false,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted(){
|
mounted(){
|
||||||
@@ -305,6 +352,9 @@ export default defineComponent({
|
|||||||
let isTest:any = getCookie('isTest')
|
let isTest:any = getCookie('isTest')
|
||||||
this.isTest =JSON.parse(isTest)
|
this.isTest =JSON.parse(isTest)
|
||||||
this.uploadUrl = getUploadUrl()
|
this.uploadUrl = getUploadUrl()
|
||||||
|
this.workspace = computed(()=>{
|
||||||
|
return this.store?.state?.Workspace?.workspace
|
||||||
|
})
|
||||||
if(this.driver__.driver){
|
if(this.driver__.driver){
|
||||||
this.captionGeneration = 'Elegant floral print for high-fashion attire'
|
this.captionGeneration = 'Elegant floral print for high-fashion attire'
|
||||||
}else{
|
}else{
|
||||||
@@ -669,6 +719,13 @@ export default defineComponent({
|
|||||||
if(this.generateCheckbox) return
|
if(this.generateCheckbox) return
|
||||||
this.isTextarea = !this.isTextarea
|
this.isTextarea = !this.isTextarea
|
||||||
},
|
},
|
||||||
|
cliSetKeyword(value:any){
|
||||||
|
let str = ''
|
||||||
|
if(this.captionGeneration[this.captionGeneration.length-1] != ',' && this.captionGeneration.length != 0){
|
||||||
|
str = ','
|
||||||
|
}
|
||||||
|
this.captionGeneration += str + value
|
||||||
|
},
|
||||||
ifMaximumLength(){
|
ifMaximumLength(){
|
||||||
this.inputTime = setTimeout(()=>{
|
this.inputTime = setTimeout(()=>{
|
||||||
if(this.captionGeneration?.split(/\s+/).length > 250){
|
if(this.captionGeneration?.split(/\s+/).length > 250){
|
||||||
@@ -679,6 +736,18 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
},500)
|
},500)
|
||||||
},
|
},
|
||||||
|
inputFocus(){
|
||||||
|
if(this.isInputFocus) return
|
||||||
|
if(this.generateCheckbox) return
|
||||||
|
this.isInputFocus = true
|
||||||
|
let setDomCli = ()=>{
|
||||||
|
this.isInputFocus = false
|
||||||
|
document.removeEventListener('click',setDomCli)
|
||||||
|
}
|
||||||
|
setTimeout(()=>{
|
||||||
|
document.addEventListener('click',setDomCli)
|
||||||
|
},200)
|
||||||
|
},
|
||||||
getgenerate(){
|
getgenerate(){
|
||||||
clearInterval(this.remGenerateTime)
|
clearInterval(this.remGenerateTime)
|
||||||
this.remGenerate = false
|
this.remGenerate = false
|
||||||
@@ -967,6 +1036,23 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
// }
|
// }
|
||||||
|
|
||||||
|
},
|
||||||
|
setSceneList(data:any){
|
||||||
|
if(this.scene.value === data.value) return
|
||||||
|
this.scene = data
|
||||||
|
console.log(data);
|
||||||
|
let generate:any = this.$refs.Generate
|
||||||
|
generate.scene = data
|
||||||
|
this.openMenu = false
|
||||||
|
},
|
||||||
|
openPrintModel(){
|
||||||
|
if(this.openMenu)return
|
||||||
|
document.addEventListener('click',this.removePrintModel)
|
||||||
|
this.openMenu = true
|
||||||
|
},
|
||||||
|
removePrintModel(){
|
||||||
|
this.openMenu = false
|
||||||
|
document.removeEventListener('click',this.removePrintModel)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -986,7 +1072,7 @@ export default defineComponent({
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
z-index: 11;
|
||||||
.switch_type_item {
|
.switch_type_item {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -1025,12 +1111,34 @@ export default defineComponent({
|
|||||||
&.select_swtich::before {
|
&.select_swtich::before {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.switch_icon {
|
.switch_icon {
|
||||||
font-size: calc(1.8rem*1.2);
|
font-size: calc(1.8rem*1.2);
|
||||||
margin-right: calc(0.8rem*1.2);
|
margin-right: calc(0.8rem*1.2);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.printMenu{
|
||||||
|
margin-right: 0;
|
||||||
|
margin-top: auto;
|
||||||
|
>div{
|
||||||
|
width: 14rem;
|
||||||
|
font-size: var(--aida-fsize1-6);
|
||||||
|
border: 0;
|
||||||
|
i{
|
||||||
|
transition: all .3s;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.forbidden{
|
||||||
|
transform: rotate(180deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ul{
|
||||||
|
width: 14rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.switch_type_item:nth-child(3){
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.printboard_body{
|
.printboard_body{
|
||||||
|
|||||||
@@ -139,8 +139,18 @@
|
|||||||
<div v-show="openClick == 3" class="modal_accomplish">
|
<div v-show="openClick == 3" class="modal_accomplish">
|
||||||
<div class="input_border">
|
<div class="input_border">
|
||||||
<div class="Guide_1_9_2 input_box" :class="[inputShow?'active':'',driver__.driver?'showEvents':'']">
|
<div class="Guide_1_9_2 input_box" :class="[inputShow?'active':'',driver__.driver?'showEvents':'']">
|
||||||
<input class="search_input" @input="ifMaximumLength" @keydown.enter="getgenerate" :maxlength='inputShow?0:9999' :class="{forbidden:generateCheckbox}" :readonly="generateCheckbox" :placeholder="$t('PrintboardUpload.inputContent1')" v-model="captionGeneration">
|
<div class="input_box_btnBox">
|
||||||
<i class="icon iconfont icon-xiala" :class="{active:isTextarea,forbidden:generateCheckbox}" @click.stop="setTextareaShow"></i>
|
<input class="search_input"
|
||||||
|
@click="inputFocus()"
|
||||||
|
@input="ifMaximumLength"
|
||||||
|
@keydown.enter="getgenerate"
|
||||||
|
:maxlength='inputShow?0:9999'
|
||||||
|
:class="{forbidden:generateCheckbox}"
|
||||||
|
:readonly="generateCheckbox"
|
||||||
|
:placeholder="$t('PrintboardUpload.inputContent1')"
|
||||||
|
v-model="captionGeneration">
|
||||||
|
<i class="icon iconfont icon-xiala" :class="{active:isTextarea,forbidden:generateCheckbox}" @click.stop="setTextareaShow"></i>
|
||||||
|
</div>
|
||||||
<textarea class="search_textarea" v-show="isTextarea && !generateCheckbox" @input="ifMaximumLength" @keydown.enter="getgenerate" :maxlength='inputShow?0:9999' :class="{forbidden:generateCheckbox}" :readonly="generateCheckbox" v-model="captionGeneration">
|
<textarea class="search_textarea" v-show="isTextarea && !generateCheckbox" @input="ifMaximumLength" @keydown.enter="getgenerate" :maxlength='inputShow?0:9999' :class="{forbidden:generateCheckbox}" :readonly="generateCheckbox" v-model="captionGeneration">
|
||||||
</textarea>
|
</textarea>
|
||||||
<!-- <div class="generage_btn started_btn" @click.stop="getgenerate">{{ $t('PrintboardUpload.Generate') }}</div> -->
|
<!-- <div class="generage_btn started_btn" @click.stop="getgenerate">{{ $t('PrintboardUpload.Generate') }}</div> -->
|
||||||
@@ -155,6 +165,13 @@
|
|||||||
</div>
|
</div>
|
||||||
<span ref="inputShowText"></span>
|
<span ref="inputShowText"></span>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="search_keyword" v-show="isInputFocus" @click.stop="">
|
||||||
|
<div class="search_keyword_center">
|
||||||
|
<div class="search_keyword_center_left">
|
||||||
|
<div v-for="item in workspace?.keyWord?.[upload.level1Type]" @click.stop="cliSetKeyword(item.name)" class="search_keyword_center_item"> {{item.name}} </div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<!-- <div>
|
<!-- <div>
|
||||||
<div v-show="!isUseGenerate" @click="setUseGenerate">Printboard</div>
|
<div v-show="!isUseGenerate" @click="setUseGenerate">Printboard</div>
|
||||||
<div v-show="isUseGenerate" @click="setUseGenerate">Generate</div>
|
<div v-show="isUseGenerate" @click="setUseGenerate">Generate</div>
|
||||||
@@ -297,8 +314,8 @@ export default defineComponent({
|
|||||||
token: "",
|
token: "",
|
||||||
uploadUrl: "",
|
uploadUrl: "",
|
||||||
captionGeneration:'',
|
captionGeneration:'',
|
||||||
workspaceCom:{},
|
|
||||||
isTextarea:false,
|
isTextarea:false,
|
||||||
|
isInputFocus:false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@@ -345,8 +362,7 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch:{
|
watch:{
|
||||||
workspaceCom(newVal,oldVal){
|
workspace(newVal,oldVal){
|
||||||
this.workspace = newVal
|
|
||||||
this.upload.gender = newVal?.sexEnum?.name
|
this.upload.gender = newVal?.sexEnum?.name
|
||||||
},
|
},
|
||||||
sketchboardList:{
|
sketchboardList:{
|
||||||
@@ -376,7 +392,7 @@ export default defineComponent({
|
|||||||
let isTest:any = getCookie('isTest')
|
let isTest:any = getCookie('isTest')
|
||||||
this.isTest =JSON.parse(isTest)
|
this.isTest =JSON.parse(isTest)
|
||||||
this.uploadUrl = getUploadUrl();
|
this.uploadUrl = getUploadUrl();
|
||||||
this.workspaceCom = computed(()=>{
|
this.workspace = computed(()=>{
|
||||||
return this.store?.state?.Workspace?.workspace
|
return this.store?.state?.Workspace?.workspace
|
||||||
})
|
})
|
||||||
if(this.driver__.driver){
|
if(this.driver__.driver){
|
||||||
@@ -517,6 +533,13 @@ export default defineComponent({
|
|||||||
if(this.generateCheckbox) return
|
if(this.generateCheckbox) return
|
||||||
this.isTextarea = !this.isTextarea
|
this.isTextarea = !this.isTextarea
|
||||||
},
|
},
|
||||||
|
cliSetKeyword(value:any){
|
||||||
|
let str = ''
|
||||||
|
if(this.captionGeneration[this.captionGeneration.length-1] != ',' && this.captionGeneration.length != 0){
|
||||||
|
str = ','
|
||||||
|
}
|
||||||
|
this.captionGeneration += str + value
|
||||||
|
},
|
||||||
ifMaximumLength(){
|
ifMaximumLength(){
|
||||||
clearTimeout(this.inputTime)
|
clearTimeout(this.inputTime)
|
||||||
let inputBox = document.getElementsByClassName('sketchboard_upload_modal')[0].getElementsByClassName('input_box')[0]
|
let inputBox = document.getElementsByClassName('sketchboard_upload_modal')[0].getElementsByClassName('input_box')[0]
|
||||||
@@ -533,7 +556,18 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
},500)
|
},500)
|
||||||
},
|
},
|
||||||
|
inputFocus(){
|
||||||
|
if(this.isInputFocus) return
|
||||||
|
if(this.generateCheckbox) return
|
||||||
|
this.isInputFocus = true
|
||||||
|
let setDomCli = ()=>{
|
||||||
|
this.isInputFocus = false
|
||||||
|
document.removeEventListener('click',setDomCli)
|
||||||
|
}
|
||||||
|
setTimeout(()=>{
|
||||||
|
document.addEventListener('click',setDomCli)
|
||||||
|
},200)
|
||||||
|
},
|
||||||
deleteFile(item: any) {
|
deleteFile(item: any) {
|
||||||
if(item?.type_?.type1 == 'generate' || item?.type_?.type1 == 'material'){
|
if(item?.type_?.type1 == 'generate' || item?.type_?.type1 == 'material'){
|
||||||
item.jsContent1 = this.t('uploadFile.jsContent1',{maxImg:20})
|
item.jsContent1 = this.t('uploadFile.jsContent1',{maxImg:20})
|
||||||
|
|||||||
@@ -78,19 +78,29 @@
|
|||||||
<label>
|
<label>
|
||||||
<input name="payAffirm" type="radio" value="paypal" v-model="modeOfPayment">
|
<input name="payAffirm" type="radio" value="paypal" v-model="modeOfPayment">
|
||||||
<img src="https://ecmb.bdimg.com/tam-ogel/-1860672422_-148079605_900_900.png" alt="">
|
<img src="https://ecmb.bdimg.com/tam-ogel/-1860672422_-148079605_900_900.png" alt="">
|
||||||
PayPal
|
<span>PayPal</span>
|
||||||
</label>
|
</label>
|
||||||
<div class="UpgradePlan_payAffirm_content_btn" :class="[modeOfPayment == 'paypal'?'active':'']">
|
<div class="UpgradePlan_payAffirm_content_btn" :class="[modeOfPayment == 'paypal'?'active':'']">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<!-- <label>
|
<label>
|
||||||
<input name="payAffirm" type="radio" value="alipay" v-model="modeOfPayment">
|
<input name="payAffirm" type="radio" value="alipay" v-model="modeOfPayment">
|
||||||
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAEXRFWHRTb2Z0d2FyZQBTbmlwYXN0ZV0Xzt0AAANmSURBVEiJvZZdaFxFFMd/M/cj926yu02MWWObEm3quoHGYBJBC4aCqbRRKoE+aLH6JhUFBT9Aij4oiooSfKn4oiA+FKlIkfbBj3TZYkGDDVWs1M1aaKgkJqEJazab+zE+3Gziunu3qwmep7kz95zfzH/OmRmhlFL8D6aXGl9ecjl2dpncnIe/QbQmIdmm8dwei/6OACGUUiqTc3nqxBKbvTgp4NjBRu7u1JEAo+nlTYcA+Ao+OFcEVqWbnPXqcoxZgvdGGtEljE95jJ4pXNcnN+evg+rdkyZTcOc2DYA//vTr8inF1sN+MDXQpCjrs4z1b10KbEP80w3XVzhVBAoFvf5AhL1JI3Sm93TqfP1krKL/xIUV3hmrlDQU9MLJAi+Kcof2qODUE1EAvvjZ4ZXTS6ETqRvkK8XANp2bYnKtrzmyLtXOVsnhgYYyn29/c8jOVt+7UBBAe1zS1SrL+j76rrjWbm0U9G7V6d0aJMhDOTc0Vk3QyZ9Wag0D8OEjTQBcnvfJzYWXSVVQS0QylNRJtmlYusDxFNN5RXbWZ2LKZSYfyNPZoq2l++c/1p5UBWgoafDq/giWDtN5haVB3BaUMl0p+GXG46tLDqmEhgCuFRTHz/8LUGeL5I3hCO+fK/LJeJGCE1RbxBR0JzQGu3T2pUxSCY1UQlvzuzzvs71Z4+J0+B4JpZTqeWsBgGcHLYQQvFvjaNGlYKTH4Oheu2Ls6oLPWNblm18dfphy8XyI25LM09HyFW1v1vjsQm0JpAjkBSi6iquLiltagsy8OS451GdyqM9kcVmRybmMXwlWWQaayfsMdulkck5VyI1NgjcfjNDfoeP5QVGfyTrcu0Pnsbss+jvW5YxZguFug+FuoxL06USR449HWfHg4++L/L4YZNcNjZKRHpNH+0222IJ8UXH0VIGxbDCh9KRLejJPKqFxeKCB+2830MvLr3yPAPbsNHhtn03UCgI6HmyxBWI168aveLx8eompa+Gnd1uT4OG+Bg7eYRKzRHVQadn7Uya72iUxW1BYgdy8TzrrcHG6vrsLwDYEB3YZvHSfHYB6317Y8DshzKSAiefjwVV+a6t2vf//s+1YjS0BjuwO6mezTQjBM4NW0C696zI5l9H0MpOzG39uSRGodGS3xdBtf3tubSxsffYXznw1EQcnMd4AAAAASUVORK5CYII=" alt="">
|
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAAEXRFWHRTb2Z0d2FyZQBTbmlwYXN0ZV0Xzt0AAANmSURBVEiJvZZdaFxFFMd/M/cj926yu02MWWObEm3quoHGYBJBC4aCqbRRKoE+aLH6JhUFBT9Aij4oiooSfKn4oiA+FKlIkfbBj3TZYkGDDVWs1M1aaKgkJqEJazab+zE+3Gziunu3qwmep7kz95zfzH/OmRmhlFL8D6aXGl9ecjl2dpncnIe/QbQmIdmm8dwei/6OACGUUiqTc3nqxBKbvTgp4NjBRu7u1JEAo+nlTYcA+Ao+OFcEVqWbnPXqcoxZgvdGGtEljE95jJ4pXNcnN+evg+rdkyZTcOc2DYA//vTr8inF1sN+MDXQpCjrs4z1b10KbEP80w3XVzhVBAoFvf5AhL1JI3Sm93TqfP1krKL/xIUV3hmrlDQU9MLJAi+Kcof2qODUE1EAvvjZ4ZXTS6ETqRvkK8XANp2bYnKtrzmyLtXOVsnhgYYyn29/c8jOVt+7UBBAe1zS1SrL+j76rrjWbm0U9G7V6d0aJMhDOTc0Vk3QyZ9Wag0D8OEjTQBcnvfJzYWXSVVQS0QylNRJtmlYusDxFNN5RXbWZ2LKZSYfyNPZoq2l++c/1p5UBWgoafDq/giWDtN5haVB3BaUMl0p+GXG46tLDqmEhgCuFRTHz/8LUGeL5I3hCO+fK/LJeJGCE1RbxBR0JzQGu3T2pUxSCY1UQlvzuzzvs71Z4+J0+B4JpZTqeWsBgGcHLYQQvFvjaNGlYKTH4Oheu2Ls6oLPWNblm18dfphy8XyI25LM09HyFW1v1vjsQm0JpAjkBSi6iquLiltagsy8OS451GdyqM9kcVmRybmMXwlWWQaayfsMdulkck5VyI1NgjcfjNDfoeP5QVGfyTrcu0Pnsbss+jvW5YxZguFug+FuoxL06USR449HWfHg4++L/L4YZNcNjZKRHpNH+0222IJ8UXH0VIGxbDCh9KRLejJPKqFxeKCB+2830MvLr3yPAPbsNHhtn03UCgI6HmyxBWI168aveLx8eompa+Gnd1uT4OG+Bg7eYRKzRHVQadn7Uya72iUxW1BYgdy8TzrrcHG6vrsLwDYEB3YZvHSfHYB6317Y8DshzKSAiefjwVV+a6t2vf//s+1YjS0BjuwO6mezTQjBM4NW0C696zI5l9H0MpOzG39uSRGodGS3xdBtf3tubSxsffYXznw1EQcnMd4AAAAASUVORK5CYII=" alt="">
|
||||||
支付宝
|
<span>支付宝</span>
|
||||||
|
<div v-show="modeOfPayment == 'alipay'" class="UpgradePlan_payAffirm_content_detail">
|
||||||
|
<label>
|
||||||
|
<input name="location" type="radio" value="ALIPAYHK" v-model="modeOfPaymentDetail">
|
||||||
|
<span>HK</span>
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input name="location" type="radio" value="ALIPAYCN" v-model="modeOfPaymentDetail">
|
||||||
|
<span>大陆</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
</label>
|
</label>
|
||||||
<div class="UpgradePlan_payAffirm_content_btn" :class="[modeOfPayment == 'alipay'?'active':'']">
|
<div class="UpgradePlan_payAffirm_content_btn" :class="[modeOfPayment == 'alipay'?'active':'']">
|
||||||
|
|
||||||
</div> -->
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="UpgradePlan_payAffirm_clause" ref="labelDisclaimer">
|
<div class="UpgradePlan_payAffirm_clause" ref="labelDisclaimer">
|
||||||
<label>
|
<label>
|
||||||
@@ -142,6 +152,7 @@ export default defineComponent({
|
|||||||
credits:45,
|
credits:45,
|
||||||
})
|
})
|
||||||
let modeOfPayment = ref('paypal')
|
let modeOfPayment = ref('paypal')
|
||||||
|
let modeOfPaymentDetail = ref('ALIPAYHK')
|
||||||
let clause = ref(false)//同意条款
|
let clause = ref(false)//同意条款
|
||||||
let productList:any = ref([])
|
let productList:any = ref([])
|
||||||
let payIndex = ref(0)
|
let payIndex = ref(0)
|
||||||
@@ -155,6 +166,7 @@ export default defineComponent({
|
|||||||
stepNum,
|
stepNum,
|
||||||
price,
|
price,
|
||||||
modeOfPayment,
|
modeOfPayment,
|
||||||
|
modeOfPaymentDetail,
|
||||||
clause,
|
clause,
|
||||||
productList,
|
productList,
|
||||||
payIndex,
|
payIndex,
|
||||||
@@ -209,7 +221,6 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
payment(){//付款
|
payment(){//付款
|
||||||
// console.log(this.modeOfPayment,'alipay','paypal');
|
|
||||||
let url = window.location.href
|
let url = window.location.href
|
||||||
// url = url.replace(/\/[^/]+$/, '') + '/home';
|
// url = url.replace(/\/[^/]+$/, '') + '/home';
|
||||||
// console.log(url);
|
// console.log(url);
|
||||||
@@ -227,12 +238,13 @@ export default defineComponent({
|
|||||||
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let httpsUrl = Https.httpUrls.payAlipay
|
let httpsUrl
|
||||||
|
|
||||||
if(this.modeOfPayment == 'paypal'){
|
if(this.modeOfPayment == 'paypal'){
|
||||||
httpsUrl = Https.httpUrls.payPaypal
|
httpsUrl = Https.httpUrls.payAlipay+`/${this.price.num}?returnUrl=${url}`
|
||||||
|
}else{
|
||||||
|
httpsUrl = Https.httpUrls.payAlipayHK+`?amount=${this.price.num}&wallet=${this.modeOfPaymentDetail}`
|
||||||
}
|
}
|
||||||
Https.axiosPost(httpsUrl+`/${this.price.num}?returnUrl=${url}`,).then(
|
Https.axiosPost(httpsUrl).then(
|
||||||
(rv: any) => {
|
(rv: any) => {
|
||||||
var width = 800;
|
var width = 800;
|
||||||
var height = 600;
|
var height = 600;
|
||||||
@@ -241,10 +253,12 @@ export default defineComponent({
|
|||||||
this.newWindow = window.open("", "_blank", "width=" + width + ", height=" + height + ", left=" + left + ", top=" + top);
|
this.newWindow = window.open("", "_blank", "width=" + width + ", height=" + height + ", left=" + left + ", top=" + top);
|
||||||
if(this.modeOfPayment == 'paypal'){
|
if(this.modeOfPayment == 'paypal'){
|
||||||
// 在新窗口中写入内容
|
// 在新窗口中写入内容
|
||||||
// newWindow.document.write(rv.approve);
|
|
||||||
this.newWindow.location.href = rv.approve;
|
this.newWindow.location.href = rv.approve;
|
||||||
}else{
|
}else{
|
||||||
this.newWindow.document.write(rv);
|
let data = JSON.parse(rv)
|
||||||
|
let herf = `${data.url}?${data.alipay_order_string}`
|
||||||
|
this.newWindow.location.href = herf;
|
||||||
|
// this.newWindow.document.write(herf);
|
||||||
}
|
}
|
||||||
this.isShowMark = true
|
this.isShowMark = true
|
||||||
// this.isShowMark = true
|
// this.isShowMark = true
|
||||||
@@ -445,7 +459,7 @@ export default defineComponent({
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin: 3rem 0;
|
margin: 3rem 0;
|
||||||
label{
|
>label{
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
@@ -458,6 +472,22 @@ export default defineComponent({
|
|||||||
// max-width: 4rem;
|
// max-width: 4rem;
|
||||||
width: 4rem;
|
width: 4rem;
|
||||||
}
|
}
|
||||||
|
.UpgradePlan_payAffirm_content_detail{
|
||||||
|
margin-left: auto;
|
||||||
|
display: flex;
|
||||||
|
>label{
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-right: 1rem;
|
||||||
|
span{
|
||||||
|
margin-left: .5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>label:last-child{
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.UpgradePlan_payAffirm_clause{
|
.UpgradePlan_payAffirm_clause{
|
||||||
|
|||||||
433
src/component/HomePage/createSlogan.vue
Normal file
433
src/component/HomePage/createSlogan.vue
Normal file
@@ -0,0 +1,433 @@
|
|||||||
|
<template>
|
||||||
|
<a-modal
|
||||||
|
class="clearSlogan_modal generalModel"
|
||||||
|
v-model:visible="showPayOrder"
|
||||||
|
:footer="null"
|
||||||
|
width="50%"
|
||||||
|
:maskClosable="false"
|
||||||
|
:centered="true"
|
||||||
|
:closable="false"
|
||||||
|
wrapClassName="#app"
|
||||||
|
:keyboard="false"
|
||||||
|
>
|
||||||
|
<div class="generalModel_btn">
|
||||||
|
<div class="generalModel_closeIcon" @click.stop="cancelDsign()">
|
||||||
|
<i class="fi fi-rr-cross-small"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="clearSlogan_center">
|
||||||
|
<div class="modal_title_text">
|
||||||
|
<div>Create Slogan</div>
|
||||||
|
<div class="modal_title_text_intro"></div>
|
||||||
|
</div>
|
||||||
|
<div class="exportCanvasBox_center">
|
||||||
|
<div v-show="textBtnShow" class="clearSlogan_center_item clearSlogan_center_btn_move">
|
||||||
|
<div class="clearSlogan_center_btn_item">
|
||||||
|
<div>Color</div>
|
||||||
|
<input type="color" v-model="fill">
|
||||||
|
</div>
|
||||||
|
<div class="clearSlogan_center_btn_item">
|
||||||
|
<div>font Size</div>
|
||||||
|
<input type="Number" v-model="fontSize">
|
||||||
|
</div>
|
||||||
|
<div class="clearSlogan_center_btn_item">
|
||||||
|
<div>Font Align</div>
|
||||||
|
<ul>
|
||||||
|
<i class="fi fi-br-align-left" @click="setTextData('textAlign','left')" :class="{active:textAlign === 'left'}"></i>
|
||||||
|
<i class="fi fi-br-align-center" @click="setTextData('textAlign','center')" :class="{active:textAlign === 'center'}"></i>
|
||||||
|
<i class="fi fi-br-symbol" @click="setTextData('textAlign','right')" :class="{active:textAlign === 'right'}"></i>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="clearSlogan_center_btn_item">
|
||||||
|
<div>Font Style</div>
|
||||||
|
<ul>
|
||||||
|
<i class="fi fi-br-border-top" @click="setTextData('overline','')" :class="{active:overline}"></i>
|
||||||
|
<i class="fi fi-br-border-center-h" @click="setTextData('linethrough','')" :class="{active:linethrough}"></i>
|
||||||
|
<i class="fi fi-br-border-bottom" @click="setTextData('underline','')" :class="{active:underline}"></i>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="clearSlogan_center_btn_item">
|
||||||
|
<div>Font Family</div>
|
||||||
|
<select v-model="fontFamily" :style="{'font-family':fontFamily}">
|
||||||
|
<option v-for="item in textFontFamilyList" :style="{'font-family':item.value}" :value="item.value">{{item.name}}</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="clearSlogan_center_btn clearSlogan_center_item">
|
||||||
|
<div @click="setTextFun('')" class="clearSlogan_center_btn_item">
|
||||||
|
<div>新增</div>
|
||||||
|
</div>
|
||||||
|
<div @click="removeTextFun()" class="clearSlogan_center_btn_item">
|
||||||
|
<div>删除</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="exportCanvasBox_submit" @click="setSubmit">
|
||||||
|
<div class="started_btn">
|
||||||
|
submit
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div></div>
|
||||||
|
</a-modal>
|
||||||
|
<div class="mark_loading" v-show="loadingShow">
|
||||||
|
<a-spin size="large" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs } from "vue";
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { formatTime } from "@/tool/util";
|
||||||
|
import { setCookie, getCookie } from "@/tool/cookie";
|
||||||
|
import { Modal, message } from "ant-design-vue";
|
||||||
|
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
|
||||||
|
import allOrder from "@/component/Pay/allOrder.vue";
|
||||||
|
import creditsDetail from "@/component/Pay/creditsDetail.vue";
|
||||||
|
import { useI18n } from "vue-i18n";
|
||||||
|
export default defineComponent({
|
||||||
|
components: {
|
||||||
|
creditsDetail,
|
||||||
|
allOrder,
|
||||||
|
},
|
||||||
|
emits: ['setSloganData'],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
let presentState = ref('paypal');
|
||||||
|
let showPayOrder = ref(false);
|
||||||
|
let loadingShow = ref(false);
|
||||||
|
let textBtnShow = ref(false)
|
||||||
|
let { t } = useI18n();
|
||||||
|
let canvas = reactive({});
|
||||||
|
let scale = 2;
|
||||||
|
let canvasWH = ref(0);
|
||||||
|
let textData = reactive({
|
||||||
|
fill:'#000000',
|
||||||
|
fontSize:'20',
|
||||||
|
fontFamily:'Arial',
|
||||||
|
textAlign:'left',
|
||||||
|
overline: false,
|
||||||
|
linethrough: false,
|
||||||
|
underline: false,
|
||||||
|
})
|
||||||
|
onMounted(()=>{
|
||||||
|
let arr = [
|
||||||
|
{ value: 'Arial', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art1', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art2', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art3', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art4', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art5', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art6', name: 'select font' },
|
||||||
|
{ value: 'EN_slogan_art7', name: 'select font' },
|
||||||
|
{ value: '微软雅黑', name: '请选择字体' },
|
||||||
|
{ value: 'CN_slogan_art1', name: '请选择字体' },
|
||||||
|
{ value: 'CN_slogan_art2', name: '请选择字体' },
|
||||||
|
{ value: 'CN_slogan_art3', name: '请选择字体' },
|
||||||
|
{ value: 'CN_slogan_art4', name: '请选择字体' },
|
||||||
|
{ value: '华文行楷', name: '请选择字体' },
|
||||||
|
{ value: '隶书', name: '请选择字体' },
|
||||||
|
]
|
||||||
|
textDataList.textFontFamilyList = arr
|
||||||
|
textData.fontFamily = arr[0].value
|
||||||
|
})
|
||||||
|
let textDataList = reactive({
|
||||||
|
textFontFamilyList: [],
|
||||||
|
})
|
||||||
|
|
||||||
|
let init = ()=>{
|
||||||
|
showPayOrder.value = true;
|
||||||
|
nextTick(()=>{
|
||||||
|
let canvasBox = document.querySelector(".clearSlogan_modal .exportCanvasBox_center");
|
||||||
|
let height = canvasBox.offsetHeight;
|
||||||
|
canvasBox.style.width = height+'px'
|
||||||
|
canvasWH.value = height
|
||||||
|
var canvasDom = document.createElement("canvas");
|
||||||
|
let oldCanvasDom = canvasBox.querySelector('canvas')
|
||||||
|
if(oldCanvasDom)canvasBox.removeChild(oldCanvasDom); // 清空原有内容
|
||||||
|
canvasBox.appendChild(canvasDom);
|
||||||
|
canvas = new fabric.Canvas(canvasDom, {
|
||||||
|
backgroundColor: "#e6e6e6",
|
||||||
|
width: canvasWH.value,
|
||||||
|
height: canvasWH.value,
|
||||||
|
isDrawingMode: false, // 开启绘图模式
|
||||||
|
});
|
||||||
|
canvas.on('object:moving',canvasMoving)
|
||||||
|
setTextFun('请输入一段话吧~')
|
||||||
|
// setRemoveImage()
|
||||||
|
fabric.Object.prototype.cornerSize = 10
|
||||||
|
fabric.Object.prototype.transparentCorners = false
|
||||||
|
canvas.on('mouse:down',setTextBtn)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
let selectTextbox = ref(null)
|
||||||
|
let setTextBtn = (e) =>{//点击判断是否点击到文字
|
||||||
|
var clickedObject = e.target;
|
||||||
|
if (clickedObject instanceof fabric.IText){
|
||||||
|
selectTextbox.value = clickedObject
|
||||||
|
textData.fill = clickedObject.fill
|
||||||
|
textData.fontSize = clickedObject.fontSize
|
||||||
|
textData.fontFamily = clickedObject.fontFamily
|
||||||
|
textData.textAlign = clickedObject.textAlign
|
||||||
|
textData.overline = clickedObject.overline
|
||||||
|
textData.linethrough = clickedObject.linethrough
|
||||||
|
textData.underline = clickedObject.underline
|
||||||
|
setBtnPosition(clickedObject)
|
||||||
|
}else{
|
||||||
|
selectTextbox.value = null
|
||||||
|
textBtnShow.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let messageShow = false
|
||||||
|
let canvasMoving = (options)=>{
|
||||||
|
let obj = options.target
|
||||||
|
isCanvasMoving(obj)
|
||||||
|
}
|
||||||
|
let isCanvasMoving = (obj)=>{
|
||||||
|
canvas.forEachObject(function(options) {
|
||||||
|
setBtnPosition(obj)
|
||||||
|
if(messageShow) return
|
||||||
|
if (options === obj) return
|
||||||
|
// 检查对象是否与另一个对象相交
|
||||||
|
if (obj.intersectsWithObject(options)) {
|
||||||
|
messageShow = true
|
||||||
|
message.info('看到输入的内容可能存在重叠,重叠会影响最终效果哦~',()=>{
|
||||||
|
messageShow = false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
let setBtnPosition = (obj)=>{//传入文字对象,设置工具位置
|
||||||
|
let domXY = {x:0,y:0}
|
||||||
|
textBtnShow.value = true
|
||||||
|
let scaleY = obj.scaleY?obj.scaleY:1
|
||||||
|
domXY = {
|
||||||
|
y:obj.top+obj.height * scaleY,
|
||||||
|
x:obj.left,
|
||||||
|
}
|
||||||
|
let dom = document.querySelector('.clearSlogan_modal .clearSlogan_center_btn_move')
|
||||||
|
domXY.x = domXY.x<0?0:domXY.x
|
||||||
|
dom.style.left = domXY.x+'px'
|
||||||
|
dom.style.top = (domXY.y + 5)+'px'
|
||||||
|
}
|
||||||
|
let setTextFun = (str)=>{
|
||||||
|
let textbox
|
||||||
|
textbox = new fabric.IText(str, {
|
||||||
|
fontSize: 20,
|
||||||
|
textAlign:'center'
|
||||||
|
|
||||||
|
// fill:canvasPencilColor.value,
|
||||||
|
})
|
||||||
|
textbox.set(textData)
|
||||||
|
textbox.set({
|
||||||
|
left:canvasWH.value/2 - textbox.width / 2,
|
||||||
|
top:canvasWH.value/2 - textbox.height / 2,
|
||||||
|
})
|
||||||
|
setBtnPosition(textbox)
|
||||||
|
canvas.add(textbox)
|
||||||
|
isCanvasMoving(textbox)
|
||||||
|
textbox.enterEditing();
|
||||||
|
canvas.setActiveObject(textbox).renderAll();
|
||||||
|
selectTextbox.value = textbox
|
||||||
|
}
|
||||||
|
let removeTextFun = ()=>{
|
||||||
|
let selectObj = canvas.getActiveObjects();
|
||||||
|
if(selectObj){
|
||||||
|
selectObj.forEach(function(object) {
|
||||||
|
canvas.remove(object);
|
||||||
|
textBtnShow.value = false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let watchTime
|
||||||
|
watch(textData,(newValue,oldValue)=>{
|
||||||
|
clearTimeout(watchTime)
|
||||||
|
watchTime = setTimeout(()=>{
|
||||||
|
if(selectTextbox.value){
|
||||||
|
selectTextbox.value.set(newValue)
|
||||||
|
canvas.renderAll();
|
||||||
|
}
|
||||||
|
},500)
|
||||||
|
|
||||||
|
})
|
||||||
|
let setTextData = (name,value)=>{
|
||||||
|
textData[name] = value?value:!textData[name]
|
||||||
|
}
|
||||||
|
let setSubmit = ()=>{
|
||||||
|
var allObjects = canvas.getObjects();
|
||||||
|
if(allObjects.length == 0){
|
||||||
|
message.info('最少需要创建一个文字')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
var canvasDom = document.createElement("canvas");
|
||||||
|
let exportCanvas = new fabric.Canvas(canvasDom, {
|
||||||
|
backgroundColor: "rgba(255, 255, 255,0)",
|
||||||
|
width: canvasWH.value*scale,
|
||||||
|
height: canvasWH.value*scale,
|
||||||
|
isDrawingMode: false, // 开启绘图模式
|
||||||
|
});
|
||||||
|
let canvasArr = canvas.getObjects()
|
||||||
|
canvasArr.forEach(item=>{
|
||||||
|
// let obj = fabric.util.object.clone(item);
|
||||||
|
let obj
|
||||||
|
item.clone((cloned)=>{
|
||||||
|
obj = cloned
|
||||||
|
})
|
||||||
|
obj.set(
|
||||||
|
{
|
||||||
|
scaleX:(item.scaleX?item.scaleX:1)*scale,
|
||||||
|
scaleY:(item.scaleY?item.scaleY:1)*scale,
|
||||||
|
left:item.left*scale,
|
||||||
|
top:item.top*scale,
|
||||||
|
}
|
||||||
|
)
|
||||||
|
exportCanvas.add(obj)
|
||||||
|
})
|
||||||
|
// textbox.set({
|
||||||
|
// left:canvasWH.value.width/2 - textbox.width / 2,
|
||||||
|
// top:canvasWH.value.height/2 - textbox.height / 2,
|
||||||
|
// })
|
||||||
|
let data = [{
|
||||||
|
imgUrl : exportCanvas.toDataURL('png'),
|
||||||
|
base64:true
|
||||||
|
}]
|
||||||
|
emit('setSloganData',data)
|
||||||
|
showPayOrder.value = false;
|
||||||
|
// console.log(exportCanvas.toDataURL('png') );
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
presentState,
|
||||||
|
showPayOrder,
|
||||||
|
loadingShow,
|
||||||
|
...toRefs(textData),
|
||||||
|
...toRefs(textDataList),
|
||||||
|
textBtnShow,
|
||||||
|
t,
|
||||||
|
init,
|
||||||
|
setTextFun,
|
||||||
|
removeTextFun,
|
||||||
|
setTextData,
|
||||||
|
setSubmit,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
|
||||||
|
cancelDsign(){
|
||||||
|
this.showPayOrder = false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
.clearSlogan_modal {
|
||||||
|
.closeIcon {
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.clearSlogan_center{
|
||||||
|
position: relative;
|
||||||
|
// width: calc(512px / 2);
|
||||||
|
// width: 256px;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
// height: calc(512px / 2);
|
||||||
|
margin: 0 auto;
|
||||||
|
.clearSlogan_center_item{
|
||||||
|
// position: relative;
|
||||||
|
background: #fff;
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
border: 0.2rem solid #c4c4c4;
|
||||||
|
width: 25rem;
|
||||||
|
border-radius: 4px; /* 设置圆角半径 */
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.clearSlogan_center_btn_item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1rem 0;
|
||||||
|
>*{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
>input{
|
||||||
|
width: 4rem;
|
||||||
|
height: 2.5rem;
|
||||||
|
border-radius: 4px; /* 设置圆角半径 */
|
||||||
|
}
|
||||||
|
input::-webkit-inner-spin-button,
|
||||||
|
input::-webkit-outer-spin-button {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
>select{
|
||||||
|
height: 2.5rem;
|
||||||
|
border: 0.2rem solid #c4c4c4 !important;
|
||||||
|
border-radius: 4px; /* 设置圆角半径 */
|
||||||
|
}
|
||||||
|
>select:focus-visible{
|
||||||
|
border: 0.2rem solid #c4c4c4;
|
||||||
|
}
|
||||||
|
div{
|
||||||
|
padding: 0 1rem;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
ul{
|
||||||
|
display: flex;
|
||||||
|
margin: 0;
|
||||||
|
i{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 2.5rem;
|
||||||
|
cursor: pointer;
|
||||||
|
width: 4rem;
|
||||||
|
height: 4rem;
|
||||||
|
&.active{
|
||||||
|
border: 1px solid;
|
||||||
|
border-radius: 0.4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.clearSlogan_center_btn{
|
||||||
|
top: 0px;
|
||||||
|
left: 50%;
|
||||||
|
width: auto;
|
||||||
|
transition: all 0.3s;
|
||||||
|
transform: translate(-50%,-100%);
|
||||||
|
}
|
||||||
|
.exportCanvasBox_center:hover .clearSlogan_center_btn{
|
||||||
|
transform: translate(-50%,0%);
|
||||||
|
z-index: 4;
|
||||||
|
}
|
||||||
|
.clearSlogan_center_btn_move{
|
||||||
|
position: absolute;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.exportCanvasBox_center{
|
||||||
|
height: 100%;
|
||||||
|
flex: 1;
|
||||||
|
position: relative;
|
||||||
|
margin: 0 auto;
|
||||||
|
overflow: hidden;
|
||||||
|
// overflow: scroll;
|
||||||
|
.canvas-container{
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.exportCanvasBox_submit{
|
||||||
|
margin-top: 2.4rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
124
src/component/HomePage/generalMenu.vue
Normal file
124
src/component/HomePage/generalMenu.vue
Normal file
@@ -0,0 +1,124 @@
|
|||||||
|
<template>
|
||||||
|
<div class="generalMenu_printModel">
|
||||||
|
<div @click.stop="openPrintModel" :class="driverClass.class1">{{ item.label }}</div>
|
||||||
|
<ul :class="driverClass.class2" v-show="openClick">
|
||||||
|
<li v-for="item,index in dataList" :class="{active:deleteItem == index}" class="printModel_item" @click="setprintModel(item,index)">{{ item.label }}</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,ref ,nextTick} from "vue";
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { openGuide,driverObj__ } from "@/tool/guide";
|
||||||
|
export default defineComponent({
|
||||||
|
name:'filterComponent',
|
||||||
|
props:{
|
||||||
|
item:{
|
||||||
|
type:Object
|
||||||
|
},
|
||||||
|
dataList:{
|
||||||
|
type:Array
|
||||||
|
},
|
||||||
|
driver__:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false,
|
||||||
|
},
|
||||||
|
deleteItem:{
|
||||||
|
type:Number,
|
||||||
|
default:-1
|
||||||
|
},
|
||||||
|
driverClass:{
|
||||||
|
type:Object,
|
||||||
|
default:{class1:'',class2:'',classList:{item1:'',item2:'',item3:''}},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
emits:['setprintModel'],
|
||||||
|
setup(props:any,{emit}){
|
||||||
|
let selectIndex = ref(0)
|
||||||
|
let openClick = ref(false)
|
||||||
|
|
||||||
|
let openPrintModel = ()=>{
|
||||||
|
document.addEventListener('click',removePrintModel)
|
||||||
|
openClick.value = true
|
||||||
|
nextTick().then(()=>{
|
||||||
|
if(props.driver__.driver){
|
||||||
|
driverObj__.moveNext()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
let setprintModel = (item:any,index:any)=>{
|
||||||
|
if(props.deleteItem == index) return
|
||||||
|
openClick.value = false
|
||||||
|
selectIndex = index
|
||||||
|
nextTick().then(()=>{
|
||||||
|
if(props.driver__.driver){
|
||||||
|
driverObj__.moveNext()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
emit('setprintModel',item)
|
||||||
|
}
|
||||||
|
let removePrintModel = ()=>{
|
||||||
|
openClick.value = false
|
||||||
|
document.removeEventListener('click',removePrintModel)
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
selectIndex,
|
||||||
|
openClick,
|
||||||
|
setprintModel,
|
||||||
|
openPrintModel,
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
//衣服类型下拉菜单
|
||||||
|
.generalMenu_printModel{
|
||||||
|
margin-right: 2rem;
|
||||||
|
>div{
|
||||||
|
width: calc(13rem*1.2);
|
||||||
|
// display: flex;
|
||||||
|
display: block;
|
||||||
|
border-radius: calc(1rem*1.2);
|
||||||
|
margin: 0;
|
||||||
|
border: 2px solid;
|
||||||
|
cursor: pointer;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
padding: 0 calc(1rem*1.2);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
ul{
|
||||||
|
position: absolute;
|
||||||
|
width: calc(13rem*1.2);
|
||||||
|
text-align: center;
|
||||||
|
margin-top: calc(.3rem*1.2);
|
||||||
|
border-radius: calc(1rem*1.2);
|
||||||
|
overflow: hidden;
|
||||||
|
li{
|
||||||
|
// background: rgba(0,0,0,.2);
|
||||||
|
background: #cccccc;
|
||||||
|
line-height: 2;
|
||||||
|
cursor: pointer;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
padding: 0 calc(1rem*1.2);
|
||||||
|
&.active{
|
||||||
|
// opacity: .4;
|
||||||
|
color: #a4a4a4 !important;
|
||||||
|
background: #ebebeb !important;
|
||||||
|
cursor: not-allowed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.printModel_item:hover{
|
||||||
|
// background: rgba(0,0,0,.4);
|
||||||
|
background: #999999;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
204
src/component/HomePage/printCategory.vue
Normal file
204
src/component/HomePage/printCategory.vue
Normal file
@@ -0,0 +1,204 @@
|
|||||||
|
<template>
|
||||||
|
<div class="operate_file_block">
|
||||||
|
<div class="select_img_type">
|
||||||
|
<div
|
||||||
|
class="select_category"
|
||||||
|
:class="driverClass.class1"
|
||||||
|
@click.stop="showFileCategory(item)"
|
||||||
|
>
|
||||||
|
{{ item.categoryValue }}
|
||||||
|
<div
|
||||||
|
:class="[
|
||||||
|
'icon',
|
||||||
|
'iconfont',
|
||||||
|
'icon-xiala',
|
||||||
|
item.categoryShow
|
||||||
|
? 'icon_rotate'
|
||||||
|
: '',
|
||||||
|
]"
|
||||||
|
></div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="category_list"
|
||||||
|
:class="driverClass.class2"
|
||||||
|
v-show="item.categoryShow"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
:class="[
|
||||||
|
'category_item',
|
||||||
|
item.category == cate.value
|
||||||
|
? 'select_category_item'
|
||||||
|
: '',
|
||||||
|
]"
|
||||||
|
v-for="(
|
||||||
|
cate, index
|
||||||
|
) in disignTypeList"
|
||||||
|
:key="index"
|
||||||
|
@click="
|
||||||
|
selectFileCategory(
|
||||||
|
item,
|
||||||
|
cate
|
||||||
|
)
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ cate.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,ref ,nextTick} from "vue";
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { openGuide,driverObj__ } from "@/tool/guide";
|
||||||
|
export default defineComponent({
|
||||||
|
name:'filterComponent',
|
||||||
|
props:{
|
||||||
|
disignTypeList:{
|
||||||
|
type:Object
|
||||||
|
},
|
||||||
|
item:{
|
||||||
|
type:Object
|
||||||
|
},
|
||||||
|
generateList:{
|
||||||
|
type:Array
|
||||||
|
},
|
||||||
|
isSetSketchCategory:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false,
|
||||||
|
},
|
||||||
|
driver__:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false,
|
||||||
|
},
|
||||||
|
driverClass:{
|
||||||
|
type:Object,
|
||||||
|
default:{class1:'',class2:''},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
setup(props:any){
|
||||||
|
let showFileCategory = (file:any)=> {
|
||||||
|
file.categoryShow = true;
|
||||||
|
nextTick().then(()=>{
|
||||||
|
if(props.driver__){
|
||||||
|
|
||||||
|
driverObj__.moveNext()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
document.addEventListener("click", hiddenFileCategory);
|
||||||
|
}
|
||||||
|
let hiddenFileCategory = () => {
|
||||||
|
for (let item of props.generateList) {
|
||||||
|
item.categoryShow = false;
|
||||||
|
}
|
||||||
|
document.removeEventListener("click", hiddenFileCategory);
|
||||||
|
}
|
||||||
|
let selectFileCategory = (file: any, cate: any) => {
|
||||||
|
for (let item of props.generateList) {
|
||||||
|
item.categoryShow = false;
|
||||||
|
}
|
||||||
|
file.categoryValue = cate.name;
|
||||||
|
file.category = cate.value;
|
||||||
|
if(props.isSetSketchCategory){
|
||||||
|
setSketchLibrary(props.item)
|
||||||
|
}
|
||||||
|
if(props.driver__){
|
||||||
|
driverObj__.moveNext()
|
||||||
|
}
|
||||||
|
// this.store.commit("sketchGenerateFiles", this.fileList);
|
||||||
|
|
||||||
|
}
|
||||||
|
let setSketchLibrary = (item:any)=>{
|
||||||
|
let data = {
|
||||||
|
libraryId:[item.id],
|
||||||
|
level2Type:item.category,
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.setSketchLibrary,data).then(
|
||||||
|
(rv: any) => {
|
||||||
|
}
|
||||||
|
).catch((res)=>{
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
showFileCategory,
|
||||||
|
selectFileCategory,
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
//衣服类型下拉菜单
|
||||||
|
.operate_file_block{
|
||||||
|
width: 100%;
|
||||||
|
height: 3rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
color: #FFFFFF;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
|
||||||
|
.select_img_type{
|
||||||
|
height: 100%;
|
||||||
|
line-height: 3rem;
|
||||||
|
text-align: center;
|
||||||
|
background: rgba(0,0,0,0.6);
|
||||||
|
position: relative;
|
||||||
|
overflow: initial !important;
|
||||||
|
.select_category{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.icon-xiala{
|
||||||
|
margin-left: 0.8rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon_rotate{
|
||||||
|
-moz-transform:rotate(180deg);
|
||||||
|
-webkit-transform:rotate(180deg);
|
||||||
|
transform: rotate(180deg);
|
||||||
|
animation-direction: 0.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category_list{
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
// top: 3.1rem;
|
||||||
|
margin-top: .2rem;
|
||||||
|
left: 0;
|
||||||
|
// background: rgba(0,0,0,0.4);
|
||||||
|
background-color: rgb(177 177 177);
|
||||||
|
border: 1px solid #343579;
|
||||||
|
border-radius: 0.8rem;
|
||||||
|
// overflow: hidden;
|
||||||
|
z-index: 3;
|
||||||
|
height: 9rem;
|
||||||
|
overflow-x: hidden;
|
||||||
|
&.category_list::-webkit-scrollbar{display: none;}
|
||||||
|
|
||||||
|
.category_item{
|
||||||
|
text-align: left;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
padding: 1rem 1.5rem;
|
||||||
|
line-height: 1.6rem;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #595959;
|
||||||
|
|
||||||
|
&.select_category_item{
|
||||||
|
background: linear-gradient(-137deg, #eeefdb, #e7dbed);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover{
|
||||||
|
background: linear-gradient(-137deg, #eeefdb, #e7dbed);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -139,6 +139,7 @@ export const Https = {
|
|||||||
//充值相关
|
//充值相关
|
||||||
productList:`/api/product/list`, //获取商品列表
|
productList:`/api/product/list`, //获取商品列表
|
||||||
payAlipay:`/api/ali-pay/trade/page/pay`, //支付宝确认支付
|
payAlipay:`/api/ali-pay/trade/page/pay`, //支付宝确认支付
|
||||||
|
payAlipayHK:`/api/alipay-hk/createOrder`, //香港支付宝确认支付
|
||||||
payPaypal:`/api/paypal/trade`, //paypal确认支付
|
payPaypal:`/api/paypal/trade`, //paypal确认支付
|
||||||
getCredits:`/api/credits/getCredits`, //查询用户积分
|
getCredits:`/api/credits/getCredits`, //查询用户积分
|
||||||
|
|
||||||
|
|||||||
@@ -875,7 +875,27 @@ export default defineComponent({
|
|||||||
centered:true,
|
centered:true,
|
||||||
onOk() {
|
onOk() {
|
||||||
data.deleteModelConfirm = 1
|
data.deleteModelConfirm = 1
|
||||||
|
let id = _this.store.state.Workspace.workspace.id
|
||||||
|
Https.axiosGet(Https.httpUrls.workspaceDetail,{params:{id:id}}).then((rv: any) => {
|
||||||
|
if (rv) {
|
||||||
|
if(rv.position == "Overall"){
|
||||||
|
rv.overallSingle = false
|
||||||
|
}else{
|
||||||
|
rv.overallSingle = true
|
||||||
|
}
|
||||||
|
if(rv.sexEnum.name == 'Female'){
|
||||||
|
rv.mannequinUrl = rv.femalePresignedUrl
|
||||||
|
rv.mannequinType = rv.mannequinFemaleType
|
||||||
|
rv.mannequinId = rv.mannequinFemaleId
|
||||||
|
}else if(rv.sexEnum.name == 'Male'){
|
||||||
|
rv.mannequinUrl = rv.malePresignedUrl
|
||||||
|
rv.mannequinType = rv.mannequinMaleType
|
||||||
|
rv.mannequinId = rv.mannequinMaleId
|
||||||
|
}
|
||||||
|
|
||||||
|
_this.store.commit("setWorkspace", rv);
|
||||||
|
}
|
||||||
|
})
|
||||||
_this.confirmDeletePic(data,index)
|
_this.confirmDeletePic(data,index)
|
||||||
},
|
},
|
||||||
onCancel(){
|
onCancel(){
|
||||||
|
|||||||
Reference in New Issue
Block a user