语言适配

This commit is contained in:
X1627315083
2024-06-21 10:30:09 +08:00
parent dc93403506
commit 8b0af784de
20 changed files with 476 additions and 150 deletions

View File

@@ -94,6 +94,7 @@ export default defineComponent({
{
title: 'Country',
align: "center",
width: 50,
ellipsis: true,
dataIndex: "country",
key: "country",

View File

@@ -163,14 +163,18 @@
</div> -->
<div class="color_setting_operateSingle">
<div class="started_btn" @click="setOperate">
<!-- <div class="started_btn" @click="setOperate">
{{ colorList[selectIndex]?.gradient?.gradientList?.length>1? 'Gradual Change':'Single'}}
</div>
</div> -->
<div class="color_setting_btn" :class="{active:!colorList[selectIndex]?.gradient?.gradientShow}">{{ $t('ColorboardUpload.Single') }}</div>
<a-switch :checked="colorList[selectIndex]?.gradient?.gradientShow" @click="setOperate"/>
<div class="color_setting_btn" :class="{active:colorList[selectIndex]?.gradient?.gradientShow}">{{ $t('ColorboardUpload.Gradual') }}</div>
</div>
<div class="color_setting_operate" v-if="colorList[selectIndex]?.gradient?.gradientShow">
<div class="color_setting_operate_item color_setting_operate_control">
<div class="operate_item_box">
<div>Alignment</div>
<div>{{ $t('ColorboardUpload.Alignment') }}</div>
</div>
<div class="operate_item_box operate_item_angle">
<div class="operate_item_angle_box" @mousedown="mousedownGradientAngle($event,'mousedown')" @touchstart="mousedownGradientAngle($event,'touchstart')">
@@ -1688,6 +1692,16 @@ export default defineComponent({
.color_setting_operateSingle{
text-align: center;
margin: 1rem 0;
display: flex;
justify-content: center;
.color_setting_btn{
margin: 0 1rem;
color: rgba(0, 0, 0, 0.5);
&.active{
color: rgba(0, 0, 0, 0.7);
font-weight: 900;
}
}
}
.color_setting_operate{
*{

View File

@@ -57,11 +57,11 @@
</div>
<div class="habit_Overal_Single habit_style">
<div class="habit_style_left">
<div>Style:</div>
<div>{{ $t('Habit.Style') }}:</div>
<span :title="workspaceItem.styleName">{{ workspaceItem.styleName }}</span>
</div>
<!-- <div class="button_second">选择</div> -->
<div class="started_btn" @click="setStyle">选择</div>
<div class="started_btn" @click="setStyle">{{ $t('Habit.Select') }}</div>
</div>
<div class="habit_Overal_Single">
<div
@@ -596,7 +596,7 @@ export default defineComponent({
//
setOverallSingle(){
if(this.workspaceItem.overallSingle){
this.workspaceItem.position = this.singleTypeList[0].name
this.workspaceItem.position = this.singleTypeList[0].value
this.workspaceItem.positionEnum = this.singleTypeList[0]
}else{
this.workspaceItem.position = 'Overall'
@@ -707,7 +707,7 @@ export default defineComponent({
//设置single & overall
setSingle(v:any){
this.openType.singleton = false
this.workspaceItem.position = v.name
this.workspaceItem.position = v.value
this.workspaceItem.positionEnum = v
},

View File

@@ -19,7 +19,7 @@
</div>
<div class="habitSetStyle_content" v-hoverAnmi>
<div class="modal_title_text">
<div>Style</div>
<div>{{ $t('Habit.Style') }}</div>
<div class="modal_title_text_intro"></div>
</div>
<div class="habitSetStyle_content_bottom">
@@ -34,7 +34,7 @@
OK
</div>
<div class="started_btn" @click="setClear()">
Clear
{{ $t('Habit.Clear') }}
</div>
</div>
@@ -55,7 +55,7 @@ import { Https } from "@/tool/https";
import { getCookie,setCookie } from "@/tool/cookie";
// import domTurnImg from '@/tool/domTurnImg'
import { downloadIamge } from "@/tool/util";
import { useI18n } from "vue-i18n";
export default defineComponent({
emits:['setParentData','setWorkspaceStyle'],
@@ -72,6 +72,7 @@ setup(props,{emit}) {
selectStyleName:'',
isShowMark:false,
})
const {t} = useI18n()
let getStyleList = ()=>{
habitSetStyleData.isShowMark = true
Https.axiosPost(Https.httpUrls.getStyleList, {}).then(
@@ -127,7 +128,7 @@ setup(props,{emit}) {
}else{
let _this = this
Modal.confirm({
title: 'It is detected that you have modified the style, may I ask whether the model is changed to the model corresponding to the style',
title: t('Habit.jsContent3'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',

View File

@@ -50,14 +50,18 @@
</div>
</div> -->
<div class="color_setting_operateSingle">
<div class="started_btn" @click="setOperate">
<!-- <div class="started_btn" @click="setOperate">
{{ colorList[selectIndex]?.gradient?.gradientShow? 'Gradual':'Single'}}
</div>
</div> -->
<div class="color_setting_btn" :class="{active:!colorList[selectIndex]?.gradient?.gradientShow}">{{ $t('ColorboardUpload.Single') }}</div>
<a-switch :checked="colorList[selectIndex]?.gradient?.gradientShow" @click="setOperate"/>
<div class="color_setting_btn" :class="{active:colorList[selectIndex]?.gradient?.gradientShow}">{{ $t('ColorboardUpload.Gradual') }}</div>
</div>
<div class="color_setting_operate" v-if="colorList[selectIndex]?.gradient?.gradientShow">
<div class="color_setting_operate_item color_setting_operate_control">
<div class="operate_item_box">
<div>Alignment</div>
<div>{{ $t('ColorboardUpload.Alignment') }}</div>
</div>
<div class="operate_item_box operate_item_angle">
<div class="operate_item_angle_box" @mousedown="mousedownGradientAngle($event,'mousedown')" @touchstart="mousedownGradientAngle($event,'touchstart')">
@@ -1125,6 +1129,16 @@ export default defineComponent({
.color_setting_operateSingle{
text-align: center;
margin: 1rem 0;
display: flex;
justify-content: center;
.color_setting_btn{
margin: 0 1rem;
color: rgba(0, 0, 0, 0.5);
&.active{
color: rgba(0, 0, 0, 0.7);
font-weight: 900;
}
}
}
.color_setting_operate{
*{

View File

@@ -206,8 +206,8 @@
</div>
<div class="exportCanvasBox_left_btn">
<div class="subitOkPreviewBtn" :class="{active:allBoardData.printboardFiles.length<=0}" :title="allBoardData.printboardFiles.length<=0?$t('exportModel.jsContent2'):''" @click="setHDExport">{{ $t('exportModel.HDExport') }}</div>
<div class="subitOkPreviewBtn" @click="setSubmit">Save</div>
<div class="subitOkPreviewBtn" @click="setShare">Share</div>
<div class="subitOkPreviewBtn" @click="setSubmit">{{ $t('exportModel.Save') }}</div>
<div class="subitOkPreviewBtn" @click="setShare">{{ $t('exportModel.Share') }}</div>
<div class="subitOkPreviewBtn Guide_1_32" @click="setExport">{{ $t('exportModel.Export') }}</div>
</div>
</div>
@@ -1842,7 +1842,7 @@ export default defineComponent({
formData.append('userLikeGroupId', userlikeGroupId);
let config = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*' }}
Https.axiosPost(Https.httpUrls.exportSave, formData,config).then((rv)=>{
message.success('save successfully')
message.success(t('exportModel.jsContent7'))
})
}
let setCanvasContent = ()=>{

View File

@@ -98,6 +98,7 @@
margin-top: calc(.3rem*1.2);
border-radius: calc(1rem*1.2);
overflow: hidden;
z-index: 3;
li{
// background: rgba(0,0,0,.2);
background: #cccccc;

View File

@@ -18,18 +18,18 @@
</div>
<div class="productImg_content">
<div class="modal_title_text">
<div>Finalize</div>
<div>{{$t('ProductImg.Finalize')}}</div>
<div class="modal_title_text_intro"></div>
</div>
<div class="productImg_content_bottom">
<div class="productImg_left">
<div class="productImg_content_item_title">Select Collection</div>
<div class="productImg_content_item_title">{{$t('ProductImg.SelectCollection')}}</div>
<div class="productImg_content_item_imgBox generalScroll" v-mousewheel>
<div class="content_item_imgBox_itemImg" v-for="item in likeDesignCollectionList" :key="item.id" >
<img @click="setGenerate(item)" v-lazy="item.designOutfitUrl" alt="" :class="{active:item.isChecked}">
</div>
</div>
<div class="productImg_content_item_title">Upload</div>
<div class="productImg_content_item_title">{{$t('ProductImg.Upload')}}</div>
<div class="productImg_content_item_imgBox generalScroll upload_item" v-mousewheel>
<div class="upload_file_item" v-for="(file, index) in fileList" :key="file">
<div class="upload_file_item_content" v-show="file?.status === 'uploading'" >
@@ -76,7 +76,10 @@
</a-upload>
</div>
</div>
<div class="productImg_content_item_title">Magic Tools</div>
<div class="productImg_content_item_title productImg_content_item_title_menu">
<span>{{$t('ProductImg.MagicTools')}}</span>
<generalMenu class="productImg_content_item_title_menubtn" :dataList="productimgMenuList" @setprintModel="setproduct" :item="productimgMenu"></generalMenu>
</div>
<div class="input_border productImg_content_item_generate">
<div class="input_box">
<div class="input_box_btnBox">
@@ -108,7 +111,7 @@
</div>
</div>
<div class="productImg_right">
<div class="productImg_content_item_title">Selected Product</div>
<div class="productImg_content_item_title">{{$t('ProductImg.GenerateProduct')}}</div>
<div class="productImg_right_item_box generalScroll" v-mousewheel>
<div class="productImg_right_item" v-for="item,index in generateList" :key="item">
<img :src="item.url" alt="">
@@ -121,8 +124,8 @@
</div>
</div>
<div class="productImg_content_item_title productImg_right_titleBtn">
Selected Product
<div class="button_second" @click="setExport">Export</div>
{{$t('ProductImg.SelectedProduct')}}
<div class="button_second" @click="setExport">{{$t('ProductImg.Export')}}</div>
</div>
<div class="productImg_right_item_box generalScroll" v-mousewheel>
<div class="productImg_right_item" v-for="item,index in likeList" :key="item">
@@ -161,11 +164,13 @@ import { useI18n } from "vue-i18n";
import ExportModel from "@/component/HomePage/ExportModel.vue";
import { useStore } from "vuex";
import scaleImage from "@/component/HomePage/scaleImage.vue";
import generalMenu from "@/component/HomePage/generalMenu.vue";
export default defineComponent({
components:{
ExportModel,
scaleImage,
generalMenu,
},
setup(props,{emit}) {
const store = useStore();
@@ -189,6 +194,13 @@ export default defineComponent({
],
})
let productimgMenuList = ref([
{
value:'ProductImage',
label:useI18n().t('ProductImg.ProductImage')
}
])
let productimgMenu = ref(productimgMenuList.value[0])
let ExportModel = ref()
let likeDesignCollectionList: any = computed(() => {
return store.state.HomeStoreModule.likeDesignCollectionList;
@@ -203,6 +215,9 @@ export default defineComponent({
userlikeGroupId = userGroupId
getLikeProductImage(userGroupId)
}
let setproduct = (value:any)=>{
productimgMenu.value = value
}
let getLikeProductImage = (userGroupId:any)=>{
let data = {
userLikeGroupId:userGroupId
@@ -219,7 +234,7 @@ export default defineComponent({
}
let cancelDsign = ()=>{
Modal.confirm({
title: 'Your changes will be lost if you navigate away from this page. Are you sure you want to leave this page?',
title: t('ProductImg.jsContent1'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
@@ -342,7 +357,7 @@ export default defineComponent({
}
})
if(selectArr.length == 0) {
message.info('Please select at least one picture')
message.info(t('ProductImg.jsContent2'))
return
}
let data:any ={
@@ -443,9 +458,12 @@ export default defineComponent({
productImg,
productImgMask,
...toRefs(productImgData),
productimgMenuList,
productimgMenu,
likeDesignCollectionList,
ExportModel,
init,
setproduct,
cancelDsign,
fileUploadChange,
beforeUpload,
@@ -547,6 +565,15 @@ export default defineComponent({
font-weight: 600;
font-size: 1.8rem;
margin-bottom: 1rem;
&.productImg_content_item_title_menu{
display: flex;
align-items: center;
justify-content: space-between;
.productImg_content_item_title_menubtn{
font-size: 1.6rem;
font-weight: 500;
}
}
}
.productImg_content_item_intro{
font-size: 1.4rem;

View File

@@ -338,7 +338,7 @@ export default defineComponent({
width: 40%;
width: 20%;
// width: 7rem;
width: 60px;
width: 70px;
justify-content: space-between;
>label{
// cursor: pointer;

View File

@@ -36,7 +36,7 @@
<div class="newScaleImage_right">
<div class="newScaleImage_right_content">
<div class="newScaleImage_right_content_type">
<div class="generate_item_title_left scaleImage_chunk_title">type{{ scaleImageData?.portfolioType=='History'? 'collection' : 'generate' }}</div>
<div class="generate_item_title_left scaleImage_chunk_title">{{$t('newScaleImage.Type')}}{{ scaleImageData?.portfolioType=='History'? 'Collection' : 'Printboard' }}</div>
</div>
<div v-if="true" class="newScaleImage_right_content_collection">
<div class="scaleImage_chunk_item content_left_collection_detail">
@@ -53,7 +53,7 @@
<img v-for="item in scaleImageData?.designPythonOutfitList" v-lazy="item.designUrl">
</div>
</div>
<div class="started_btn" @click="setChoose" :title="systemUser.value != 1?'请先登录或者升级为正式用户': scaleImageData.openSource == 0?'作者不允许二次创作':''" :class="{active:systemUser.value != 1?true:scaleImageData.openSource == 0}">二创</div>
<div class="started_btn" @click="setChoose" :title="systemUser.value != 1?$t('newScaleImage.jsContent1'): scaleImageData.openSource == 0?$t('newScaleImage.jsContent2'):''" :class="{active:systemUser.value != 1?true:scaleImageData.openSource == 0}">{{$t('newScaleImage.SecondaryCreation')}}</div>
</div>
<div v-else class="newScaleImage_right_content_generate">
<div class="scaleImage_chunk_item content_left_generate_item">
@@ -93,11 +93,11 @@
</div>
<div class="detail_right_date detail_left_right_item">
<div class="detail_right_date_setUp">
<div>创建时间</div>
<div>{{$t('newScaleImage.CreationTime')}}</div>
<span>{{ scaleImageData.createDate }}</span>
</div>
<div class="detail_right_date_upData">
<div>更新时间</div>
<div>{{$t('newScaleImage.UpdateTime')}}</div>
<span>{{ scaleImageData.updateDate }}</span>
</div>
</div>
@@ -145,12 +145,12 @@
</div>
</div>
<div class="newScaleImage_right_comment scaleImage_chunk_item">
<div class="scaleImage_chunk_title">Comment</div>
<div v-if="commentList.length === 0" class="newScaleImage_right_comment_null">
<div class="scaleImage_chunk_title">No Comments</div>
<div class="scaleImage_chunk_title">You can be the first!</div>
<div class="scaleImage_chunk_title">{{$t('newScaleImage.Comment')}}</div>
<div v-show="commentList.length === 0" class="newScaleImage_right_comment_null">
<div class="scaleImage_chunk_title">{{$t('newScaleImage.NoComments')}}</div>
<div class="scaleImage_chunk_title">{{$t('newScaleImage.first')}}</div>
</div>
<div v-else class="newScaleImage_right_comment_content">
<div v-show="commentList.length !== 0" class="newScaleImage_right_comment_content">
<div class="detail_left_content_item" v-for="item in commentList" :key="item.id">
<!-- <div class="detail_left_content_item_img">
<img v-lazy="scaleImageData?.imgUrl">
@@ -158,45 +158,62 @@
<div class="detail_left_content_item_content">
<div class="scaleImage_chunk_title_intro">{{ item?.userName }}</div>
<!-- <div class="scaleImage_chunk_title_intro">个性签名</div> -->
<div class="scaleImage_chunk_title" :class="[item.unfold?'':'active']">{{ item.comment }}</div>
<div v-commentUnfold="item" class="scaleImage_chunk_title" :class="[item.detailUnfold?'active':'']"><div>{{ item.comment }}</div></div>
<div class="scaleImage_chunk_title_intro" style="font-size: 1.2rem;" v>{{ item.createTimes }}</div>
<div class="detail_left_content_item_btn">
<div class="left_content_item_reply" @click.stop="setCommentReply(item,'parent')">
<i class="fi fi-rr-comment-alt-dots"></i>
回复
{{$t('newScaleImage.reply')}}
</div>
<!-- <div class="left_content_item_thumbs">
<i class="fi fi-sr-thumbs-up" :adminSix="!!true" style="color: rgb(158, 158, 167);"></i>
<span>123</span>
</div> -->
<!-- <div v-show="true" class="left_content_item_unfold" @click="()=>item.unfold = !item.unfold">展开</div> -->
</div>
<div class="detail_left_content_item_replyContent" v-for="children in item.childCommentVOList" :key="children.id">
<div class="detail_left_content_item_img">
<!-- <img v-lazy="scaleImageData?.imgUrl"> -->
<div class="left_content_item_btn">
<div class="left_content_item_delete" v-if="userInfo.userName === item.userName" @click="setDelete(item)">删除</div>
<div class="left_content_item_unfold" @click="()=>item.detailUnfold = !item.detailUnfold">{{item.detailUnfold?$t('newScaleImage.Collapse'):$t('newScaleImage.unfold')}}</div>
</div>
<div class="detail_left_content_item_content">
<div class="scaleImage_chunk_title">{{ children?.userName }}<span v-if="children?.replyTo" class="replyIcon"></span>{{ children?.replyTo }}</div>
<!-- <div class="scaleImage_chunk_title_intro">个性签名</div> -->
<div class="scaleImage_chunk_title" :class="[item.unfold?'':'active']">{{ children.comment }}</div>
<div class="scaleImage_chunk_title_intro" style="font-size: 1.2rem;" v>{{ children.createTimes }}</div>
</div>
<div v-if="item.childCommentVOList" class="detail_left_content_item_replyContent_box" :class="[item.unfold?'':'active']">
<div class="detail_left_content_item_replyContent" v-for="children in item.childCommentVOList" :key="children.id">
<div class="detail_left_content_item_img">
<!-- <img v-lazy="scaleImageData?.imgUrl"> -->
</div>
<div class="detail_left_content_item_content">
<div class="scaleImage_chunk_title_intro">{{ children?.userName }}<span v-if="children?.replyTo" class="replyIcon"></span>{{ children?.replyTo }}</div>
<!-- <div class="scaleImage_chunk_title_intro">个性签名</div> -->
<div v-commentUnfold="children" class="scaleImage_chunk_title" :class="[children.detailUnfold?'active':'']"><div>{{ children.comment }}</div></div>
<div class="scaleImage_chunk_title_intro" style="font-size: 1.2rem;" v>{{ children.createTimes }}</div>
<div class="detail_left_content_item_btn">
<div class="left_content_item_reply" @click.stop="setCommentReply(children,'son')">
<i class="fi fi-rr-comment-alt-dots"></i>
回复
</div>
<!-- <div class="left_content_item_thumbs">
<i class="fi fi-sr-thumbs-up" :adminSix="!!true" style="color: rgb(158, 158, 167);"></i>
<span>123</span>
</div> -->
<div v-show="false" class="left_content_item_unfold">展开</div>
<div class="detail_left_content_item_btn">
<div class="left_content_item_reply" @click.stop="setCommentReply(children,'son')">
<i class="fi fi-rr-comment-alt-dots"></i>
{{$t('newScaleImage.reply')}}
</div>
<!-- <div class="left_content_item_thumbs">
<i class="fi fi-sr-thumbs-up" :adminSix="!!true" style="color: rgb(158, 158, 167);"></i>
<span>123</span>
</div> -->
<div class="left_content_item_btn">
<div class="left_content_item_delete" v-if="userInfo.userName === children.userName" @click="setDelete(children)">删除</div>
<div class="left_content_item_unfold" @click="()=>children.detailUnfold = !children.detailUnfold">{{children.detailUnfold?$t('newScaleImage.Collapse'):$t('newScaleImage.unfold')}}</div>
</div>
</div>
</div>
</div>
</div>
<div v-if="item.childCommentVOList" @click.stop="()=>item.unfold = !item.unfold" class="detail_left_content_item_replyContent_box_btn">
{{$t('newScaleImage.replyAll')}}
<div class="icon iconfont icon-xiala" :class="{active:item.unfold}"></div>
</div>
</div>
</div>
<div class="newScaleImage_right_comment_loading" v-show="!isNoData">
<span class="page_loading" v-show="!isShowMark"></span>
<span v-show="isShowMark">
<a-spin size="large" />
</span>
</div>
</div>
<div class="newScaleImage_right_comment_setComment" @click.stop="">
<input type="text" ref="commentInputFocus" v-model="commentText" :placeholder="commentInput">
@@ -214,16 +231,20 @@
<script lang="ts">
import { defineComponent,watch,getCurrentInstance, h, ref ,toRefs,computed,reactive,triggerRef, nextTick, onMounted} from "vue";
import { Https } from "@/tool/https";
// import { getCookie } from "@/tool/cookie";
import { getCookie } from "@/tool/cookie";
// import domTurnImg from '@/tool/domTurnImg'
import { useStore } from "vuex";
import { useRouter } from 'vue-router'
import { downloadIamge,setPubDate } from "@/tool/util";
import { message } from "ant-design-vue";
import { useI18n } from 'vue-i18n';
export default defineComponent({
setup() {
let {t} = useI18n()
//首先在setup中定义
console.log(getCookie('userInfo'));
let userInfo = ref({});
const store = useStore();
const router = useRouter()
let scaleImage: any = ref(false);//弹窗
@@ -248,6 +269,8 @@ export default defineComponent({
commentText:'',
commentInput:'',//评论框提示词
commentList:[],
isNoData:false,
isShowMark:false,
})
let systemUser = computed(()=>{
return store.state.UserHabit.systemUser
@@ -271,6 +294,8 @@ export default defineComponent({
imgData.scaleImageData = {}
imgData.commentText = ''
imgData.scaleImageList = []
imgData.getCommentData.page = 1
imgData.getCommentData.size = 10
document.removeEventListener('click',removeCommentReply)
}
let download = ()=>{
@@ -309,7 +334,22 @@ export default defineComponent({
if(str == 'zan'){
}else{
getCommentPage()
getCommentPage('')
nextTick(()=>{
let imgParent:any = document.querySelector('.newScaleImage_modal .page_loading')
new IntersectionObserver(
(entries, observer) => {
// 如果不是相交,则直接返回
// console.log(entries[0]);
if (!entries[0].intersectionRatio) return;
imgData.getCommentData.size += 10
getCommentPage('')
},
// { root:worksPage }
).observe(imgParent);
})
}
}).catch((res)=>{
imgData.loadingShow = false
@@ -319,13 +359,11 @@ export default defineComponent({
let setChoose = () =>{
if(systemUser.value.value !== 1){
return message.info('请先登录或者升级为正式用户')
return message.info(t('newScaleImage.jsContent1'))
}
if(imgData.scaleImageData.openSource == 0){
return message.info('作者不允许二次创作哦')
return message.info(t('newScaleImage.jsContent2'))
}
console.log(imgData.scaleImageData);
router.push({name:'homePage',params: {id:imgData.scaleImageData.id,type:'Works'}})
// router.push({name:'homePage',params: {id:imgData.scaleImageData.userLikeGroupSourceId,type:'Works'}})
}
@@ -337,14 +375,14 @@ export default defineComponent({
imgData.commentReply.leve2Id = value.id
}
imgData.commentReply.name = value.userName
imgData.commentInput = `回复${imgData.commentReply.name}的评论`
imgData.commentInput = `${t('newScaleImage.reply')} ${imgData.commentReply.name}`
commentInputFocus.value.focus()
}
let removeCommentReply = ()=>{
imgData.commentReply.leve1Id = null
imgData.commentReply.leve2Id = null
imgData.commentReply.name = ''
imgData.commentInput = '请输入评论内容'
imgData.commentInput = t('newScaleImage.jsContent3')
}
let setComment = ()=>{
let data = {
@@ -360,17 +398,21 @@ export default defineComponent({
Https.axiosPost(Https.httpUrls.portfolioComment, data)
.then((rv) => {
imgData.commentText = ''
getCommentPage()
getCommentPage('comment')
})
.catch((rv) => {
});
}
let getCommentPage = ()=>{
let getCommentPage = (str:any)=>{
let data = imgData.getCommentData
imgData.isShowMark = true
Https.axiosPost(Https.httpUrls.portfolioCommentPage,data).then(
(rv: any) => {
imgData.commentList = rv.content
imgData.commentList.forEach((item:any)=>{
if(rv.content.length == imgData.commentList.length&&str != 'comment'){
imgData.isNoData = true
return
}
rv.content.forEach((item:any)=>{
item.createTimes = setPubDate(item.createTime)
if (item.childCommentVOList) {
item.childCommentVOList.forEach((obj:any)=>{
@@ -378,8 +420,13 @@ export default defineComponent({
})
}
})
// imgData.commentList.push(...rv.content)
imgData.commentList = rv.content
imgData.isShowMark = false
}
).catch((res)=>{
imgData.isShowMark = false
}
)
}
@@ -398,6 +445,9 @@ export default defineComponent({
})
.catch((rv) => {
});
}
let setDelete = (value:any)=>{
}
watch(()=>imgData.scaleImageIndex,
(newVal,oldVal)=>{
@@ -407,7 +457,12 @@ export default defineComponent({
imgData.scaleImageMarginTop = `${contentItemHeight*-(newVal) - contentItemHeight/2}rem`
}
)
onMounted(()=>{
let user:any = getCookie('userInfo')
userInfo = JSON.parse(user)
})
return {
userInfo,
scaleImage,
scaleImageMask,
...toRefs(imgData),
@@ -424,9 +479,25 @@ export default defineComponent({
setCommentReply,
setComment,
setPortfolioLike,
setDelete,
};
},
directives:{
commentUnfold:{
updated (el,binding) {
let parent = el.parentNode
let commentBtn = parent.querySelector('.left_content_item_unfold')
let commentDomSon = el.querySelector('div')
let maxHeight = Number((window.getComputedStyle(el).maxHeight).split('px')[0])
if(commentDomSon.offsetHeight > maxHeight){
commentBtn.style.display = 'block'
}else if(!binding.value.detailUnfold){
commentBtn.style.display = 'none'
}
}
},
mousewheel:{
mounted (el,binding:any) {
// let contentHeight = Number(getComputedStyle(el).getPropertyValue('--content-height').split('rem')[0]);
@@ -504,11 +575,17 @@ export default defineComponent({
border: .2rem solid var(--border-color);
background: #fff;
cursor: pointer;
}
.scaleImage_chunk_title{
font-size: 2.2rem;
font-weight: 600;
color: #000;
overflow: hidden;
max-height: 100px;
&.active{
max-height: max-content;
}
}
.scaleImage_chunk_title_comment{
font-size: 1.6rem;
@@ -754,6 +831,7 @@ export default defineComponent({
.newScaleImage_right_comment{
display: flex;
flex-direction: column;
padding-bottom: 0;
>.scaleImage_chunk_title{
text-align: center;
}
@@ -771,8 +849,8 @@ export default defineComponent({
}
.newScaleImage_right_comment_content{
max-height: 60rem;
overflow-y: auto;
// max-height: 60rem;
// overflow-y: auto;
.detail_left_content_item{
display: flex;
margin-bottom: var(--margin);
@@ -812,7 +890,7 @@ export default defineComponent({
display: flex;
align-items: center;
margin-top: 1rem;
.left_content_item_reply,.left_content_item_thumbs,.left_content_item_unfold{
.left_content_item_reply,.left_content_item_thumbs,.left_content_item_unfold,.left_content_item_delete{
cursor: pointer;
}
.left_content_item_reply:hover{
@@ -827,9 +905,36 @@ export default defineComponent({
display: flex;
}
}
.left_content_item_unfold{
.left_content_item_btn{
margin-left: auto;
margin-right: 1rem;
display: flex;
.left_content_item_delete{
}
.left_content_item_unfold{
margin-left: 1rem;
}
}
}
.detail_left_content_item_replyContent_box{
overflow: hidden;
transition: all .3s;
&.active{
height: 0;
margin: 0;
}
}
.detail_left_content_item_replyContent_box_btn{
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
div{
transition: all .3s;
}
.active{
transform: rotate(180deg);
}
}
.detail_left_content_item_replyContent{
@@ -839,12 +944,27 @@ export default defineComponent({
}
}
}
.newScaleImage_right_comment_loading{
text-align: center;
>span{
height: 7rem;
width: 6rem;
display: block;
margin: 0 auto;
}
}
.newScaleImage_right_comment_setComment{
display: flex;
align-items: center;
height: 4rem;
height: 8rem;
justify-content: center;
margin-top: var(--padding);
margin-top: 5rem;
position: sticky;
z-index: 2;
padding-bottom: var(--padding);
padding-top: var(--padding);
bottom: 0;
background: #f5f5f5;
input,.detail_left_setComment_btn{
border-radius: 1rem;
}

View File

@@ -18,13 +18,13 @@
</div>
<div class="publish_content">
<div class="modal_title_text">
<div>Publish</div>
<div>{{$t('Publish.Publish')}}</div>
<div class="modal_title_text_intro"></div>
</div>
<div class="publish_content_bottom">
<div class="publidh_left">
<div class="publidh_content_item">
<div class="publidh_content_item_title">Cover Picture</div>
<div class="publidh_content_item_title">{{$t('Publish.CoverPicture')}}</div>
<div class="publish_content_shrink publish_content_item">
<img v-lazy="selectDate.url" alt="">
</div>
@@ -32,15 +32,15 @@
</div>
<div class="publidh_right">
<div class="publidh_right_name publidh_content_item">
<div class="publidh_content_item_title">Collection Title</div>
<div class="publidh_content_item_title">{{$t('Publish.CollectionTitle')}}</div>
<input type="text" v-model="subPublishDate.portfolioName">
</div>
<div class="publidh_right_name publidh_content_item">
<div class="publidh_content_item_title">Description</div>
<div class="publidh_content_item_title">{{$t('Publish.Description')}}</div>
<textarea ref="textarea" v-model="subPublishDate.portfolioDes"></textarea>
</div>
<div class="publidh_right_detail publidh_content_item">
<div class="publidh_content_item_title">Permissions</div>
<div class="publidh_content_item_title">{{$t('Publish.Permissions')}}</div>
<!-- <div>
<a-checkbox @change="setPermissions" v-model:checked="setPermissionsAll">All.</a-checkbox>
</div> -->
@@ -54,7 +54,7 @@
<a-checkbox @change="setPermissionsItem()" v-model:checked="selectPermissions.isDisplayArea">Show locale or not.</a-checkbox>
</div> -->
<div>
<a-checkbox @change="setPermissionsItem()" v-model:checked="selectPermissions.isSecondaryCreation">Whether to allow other users to perform secondary creation.</a-checkbox>
<a-checkbox @change="setPermissionsItem()" v-model:checked="selectPermissions.isSecondaryCreation">{{$t('Publish.PermissionsItem1')}}</a-checkbox>
</div>
</div>
<!-- <div class="publidh_right_name publidh_content_item">
@@ -72,7 +72,7 @@
</div> -->
</div>
<div class="publidh_right_btn">
<div class="started_btn" @click="cancelDsign">Close</div>
<div class="started_btn" @click="cancelDsign">{{$t('Publish.Close')}}</div>
<div class="started_btn" @click="setPublish">{{beenPublished == 0?'Publish':'Updata Publish'}}</div>
</div>
</div>
@@ -93,9 +93,11 @@ import { getCookie,setCookie } from "@/tool/cookie";
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { Modal,message } from 'ant-design-vue';
import { downloadIamge,base64ToFile } from "@/tool/util";
import { useI18n } from 'vue-i18n';
export default defineComponent({
setup() {
let {t} = useI18n()
let publish: any = ref(false);//弹窗
let publishMask:any = ref(false)//弹窗遮罩
let publishData:any = reactive({
@@ -173,7 +175,7 @@ export default defineComponent({
}
let cancelDsign = ()=>{
Modal.confirm({
title: 'Your changes will be lost if you navigate away from this page. Are you sure you want to leave this page?',
title: t('Publish.jsContent1'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
@@ -186,13 +188,13 @@ export default defineComponent({
}
let setPublish= ()=>{
if(!publishData.subPublishDate.portfolioName){
return message.info('Please enter the name of your work')
return message.info(t('Publish.jsContent2'))
}
// if(!publishData.subPublishDate.portfolioDes){
// return message.info('Please enter a description')
// }
Modal.confirm({
title: 'This will publish your work to the square for all users to see. Please confirm whether to publish?',
title: t('Publish.jsContent3'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
@@ -220,7 +222,7 @@ export default defineComponent({
.then((rv) => {
cleardata()
publishData.isShowMark = false
message.success('Release success! You can find it in my work')
message.success(t('Publish.jsContent4'))
})
.catch((rv) => {
publishData.isShowMark = false