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

fix

Browse Source
This commit is contained in:
X1627315083
2024-08-13 09:36:13 +08:00
parent 1f5ddc604a
commit a0c3b06b80
23 changed files with 23125 additions and 22325 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.env.dev
View File

@@ -6,6 +6,6 @@ NODE_ENV = 'development'
VUE_APP_BASE_URL = 'https://develop.api.aida.com.hk'
# VUE_APP_BASE_URL = 'https://api.aida.com.hk'
# 佩佩
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'

44364
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

165
package.json
View File

@@ -1,83 +1,84 @@
{
"name": "aida",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"serve:test": "vue-cli-service serve --mode test",
"build:test": "vue-cli-service build --mode test_build",
"serve:dev": "vue-cli-service serve --mode dev",
"build:dev": "vue-cli-service build --mode dev_build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@ans1998/vue3-color": "^3.0.7",
"@flaticon/flaticon-uicons": "^2.3.0",
"@types/fingerprintjs2": "^2.0.0",
"ant-design-vue": "^3.2.12",
"axios": "^1.4.0",
"core-js": "^3.8.3",
"driver.js": "^1.3.1",
"echarts": "^5.5.1",
"element-plus": "^2.4.2",
"file-saver": "^2.0.5",
"fingerprintjs2": "^2.1.4",
"gsap": "^3.12.5",
"html2canvas": "^1.4.1",
"jszip": "^3.10.1",
"md5": "^2.3.0",
"quantize": "^1.0.2",
"sortablejs": "^1.15.0",
"swiper": "^11.1.4",
"vue": "^3.2.13",
"vue-class-component": "^8.0.0-0",
"vue-cropper": "^1.0.5",
"vue-i18n": "^9.6.1",
"vue-router": "^4.0.3",
"vuedraggable": "^4.1.0",
"vuex": "^4.0.0"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-plugin-typescript": "~5.0.0",
"@vue/cli-plugin-vuex": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"@vue/eslint-config-typescript": "^9.1.0",
"babel-eslint": "^10.1.0",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"less": "^4.1.3",
"less-loader": "^11.0.0",
"style-resources-loader": "^1.5.0",
"typescript": "~4.5.5",
"unplugin-element-plus": "^0.8.0",
"vue-cli-plugin-style-resources-loader": "^0.1.5",
"vue-lazyload": "^3.0.0-rc.2"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended",
"@vue/typescript/recommended"
],
"parserOptions": {
"ecmaVersion": 2020
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead",
"not ie 11"
]
}
"name": "aida",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"serve:test": "vue-cli-service serve --mode test",
"build:test": "vue-cli-service build --mode test_build",
"serve:dev": "vue-cli-service serve --mode dev",
"build:dev": "vue-cli-service build --mode dev_build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@ans1998/vue3-color": "^3.0.7",
"@flaticon/flaticon-uicons": "^2.3.0",
"@types/fingerprintjs2": "^2.0.0",
"ant-design-vue": "^3.2.12",
"axios": "^1.4.0",
"core-js": "^3.8.3",
"driver.js": "^1.3.1",
"echarts": "^5.5.1",
"element-plus": "^2.4.2",
"file-saver": "^2.0.5",
"fingerprintjs2": "^2.1.4",
"gsap": "^3.12.5",
"html2canvas": "^1.4.1",
"jszip": "^3.10.1",
"md5": "^2.3.0",
"quantize": "^1.0.2",
"sortablejs": "^1.15.0",
"swiper": "^11.1.4",
"vue": "^3.2.13",
"vue-class-component": "^8.0.0-0",
"vue-cropper": "^1.0.5",
"vue-i18n": "^9.6.1",
"vue-router": "^4.0.3",
"vuedraggable": "^4.1.0",
"vuex": "^4.0.0"
},
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-plugin-typescript": "~5.0.0",
"@vue/cli-plugin-vuex": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"@vue/eslint-config-typescript": "^9.1.0",
"babel-eslint": "^10.1.0",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"less": "^4.1.3",
"less-loader": "^11.0.0",
"style-resources-loader": "^1.5.0",
"typescript": "~4.5.5",
"unplugin-element-plus": "^0.8.0",
"vue-cli-plugin-style-resources-loader": "^0.1.5",
"vue-lazyload": "^3.0.0-rc.2"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended",
"@vue/typescript/recommended"
],
"parserOptions": {
"ecmaVersion": 2020
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead",
"not ie 11"
]
}

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

@@ -1282,6 +1282,10 @@ li {
width: 2rem;
min-width: 2rem;
padding: 0;
font-size: 1.1rem;
display: flex;
align-items: center;
justify-content: center;
}
.homeMain_heade sup.ant-scroll-number .ant-scroll-number-only {
width: 100%;

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

@@ -1427,6 +1427,10 @@ input:focus{
width: 2rem;
min-width: 2rem;
padding: 0;
font-size: 1.1rem;
display: flex;
align-items: center;
justify-content: center;
.ant-scroll-number-only{
width: 100%;
height: 100%;

3
src/component/Account/account.vue
View File

@@ -88,6 +88,7 @@ export default defineComponent({
.account_page{
height: 100%;
overflow-y: auto;
padding: 0 9rem;
.account_page_titleImg{
img{
width: 100%;
@@ -96,7 +97,7 @@ export default defineComponent({
}
}
.account_page_content_box{
padding: 5rem 10rem;
padding: 5rem 0;
.account_page_content{
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;

14
src/component/Account/accountMessage.vue
View File

@@ -10,11 +10,15 @@
<a-tab-pane key="1" tab="系统消息">
<system ref="system"></system>
</a-tab-pane>
<a-tab-pane key="2" tab="私信" force-render>
<!-- <a-tab-pane key="2" tab="私信" force-render>
<privateChat ref="privateChat"></privateChat>
</a-tab-pane> -->
<a-tab-pane key="3" tab="评论">
<comment></comment>
</a-tab-pane>
<a-tab-pane key="4" tab="点赞">
<likeMessage></likeMessage>
</a-tab-pane>
<a-tab-pane key="3" tab="评论">Content of Tab Pane 3</a-tab-pane>
<a-tab-pane key="4" tab="点赞">Content of Tab Pane 3</a-tab-pane>
<a-tab-pane key="6" tab="新增粉丝">
<newFollow ref="newFollow"></newFollow>
</a-tab-pane>
@@ -32,12 +36,16 @@ import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
import system from '@/component/Account/message/system.vue'
import privateChat from '@/component/Account/message/privateChat.vue'
import newFollow from '@/component/Account/message/newFollow.vue'
import likeMessage from '@/component/Account/message/likeMessage.vue'
import comment from '@/component/Account/message/comment.vue'
import { useI18n } from 'vue-i18n'
export default defineComponent({
components:{
system,
privateChat,
newFollow,
likeMessage,
comment,
},
setup() {
const router = useRouter()

207
src/component/Account/message/comment.vue Normal file
View File

@@ -0,0 +1,207 @@
<template>
<div class="account_comment">
<div class="account_comment_title modal_title_text">
收到的评论
</div>
<div class="account_comment_center modal_title_text">
<div class="account_comment_item">
<div class="account_comment_item_right">
<div class="account_comment_item_right_img" @click="openOtherUsers">
<img src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" alt="">
</div>
<div class="account_comment_item_right_title">
<div class="account_comment_item_right_title_name">名字 <span>回复你的作品</span></div>
<div class="account_comment_item_right_title_center modal_title_text_assistant">回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容</div>
<div class="account_comment_item_right_works modal_title_text_intro">回复作品名</div>
</div>
</div>
<div class="account_comment_item_left">
<div class="account_comment_item_left_delete modal_title_text_intro">
<span class="icon iconfont icon-shanchu operate_icon"></span>
</div>
<div class="modal_title_text_intro">2024-06-05</div>
</div>
</div>
<div class="account_comment_item">
<div class="account_comment_item_right">
<div class="account_comment_item_right_img">
<img src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" alt="">
</div>
<div class="account_comment_item_right_title">
<div class="account_comment_item_right_title_name">名字 <span>回复你的作品</span></div>
<div class="account_comment_item_right_title_center modal_title_text_assistant">回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容回复内容</div>
<div class="account_comment_item_right_works modal_title_text_intro">回复作品名</div>
</div>
</div>
<div class="account_comment_item_left">
<div class="account_comment_item_left_delete modal_title_text_intro">
<span class="icon iconfont icon-shanchu operate_icon"></span>
</div>
<div class="modal_title_text_intro">2024-06-05</div>
</div>
</div>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,reactive,nextTick,toRefs,createVNode, onMounted} from 'vue'
import { Https } from "@/tool/https";
import { useRouter,useRoute } from 'vue-router'
import { Modal,message } from 'ant-design-vue';
import { useStore } from "vuex";
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
import { useI18n } from 'vue-i18n'
export default defineComponent({
components:{
},
setup() {
const router = useRouter()
const store = useStore();
let accountMessage = reactive({
activeKey: ref('1'),
followList:ref([
{
name:'张三',
avatar:'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png',
time:'2024-01-01 12:00:00',
content:'关注了你',
isRead:false
},
{
name:'李四',
avatar:'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png',
}
])
})
// let ws = new WebSocket('ws://127.0.0.1:3000')
// console.log(ws);
// ws.onopen = ()=>{
// console.log(222);
// let data = {
// cmd:4,
// data:{
// msg:'222'
// }
// }
// ws.send(JSON.stringify(data))
// // ws.onmessage = (data)=>{
// // console.log(data);
// // }
// }
// provide('exhibitionList',exhibitionList)
let openOtherUsers = ()=>{
const routeUrl = router.resolve({
path:'/home/otherUsers',
query:{
id:123
}
})
window.open(routeUrl.href,'_blank')
}
onMounted (()=>{
})
return{
...toRefs(accountMessage),
openOtherUsers,
}
},
data(){
return{
}
},
})
</script>
<style lang="less" scoped>
.account_comment{
width: 100%;
.account_comment_title{
display: flex;
align-items: center;
justify-content: space-between;
padding: 2rem 5rem;
border-bottom: 1px solid #e9eaec;
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;
border-radius: 5px;
.account_comment_title_setting{
cursor: pointer;
}
}
.account_comment_center{
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;
border-radius: 5px;
padding: 2rem 5rem;
.account_comment_item{
display: flex;
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem 0;
border-bottom: 1px solid #e9eaec;
.account_comment_item_right{
display: flex;
align-items: center;
margin-right: 1rem;
.account_comment_item_right_works{
cursor: pointer;
}
.account_comment_item_right_works:hover{
text-decoration: underline;
}
.account_comment_item_right_img{
width: 8rem;
height: 8rem;
margin-right: 2rem;
flex-shrink: 0;
cursor: pointer;
img{
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.account_comment_item_right_title{
display: flex;
flex-direction: column;
align-items: flex-start;
.account_comment_item_right_title_center{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.account_comment_item_right_title_name{
font-weight: 600;
font-weight: 500;
color: #000;
span{
font-weight: 500;
color: #9999aa;
}
}
}
}
.account_comment_item_left{
text-align: right;
flex-shrink: 0;
.account_comment_item_left_delete{
span{
cursor: pointer;
}
}
div{
padding: .5rem 2rem;
border-radius: 4rem;
}
}
}
.account_comment_item:last-child{
margin-bottom: 0;
border-bottom: none;
}
}
}
</style>

181
src/component/Account/message/likeMessage.vue Normal file
View File

@@ -0,0 +1,181 @@
<template>
<div class="account_like">
<div class="account_like_title modal_title_text">
点赞
</div>
<div class="account_like_center modal_title_text">
<div class="account_like_item">
<div class="account_like_item_right">
<div class="account_like_item_right_img">
<img src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" alt="">
</div>
<div class="account_like_item_right_title">
<div class="account_like_item_right_title_name">名字 <span>等人攒了你的作品</span></div>
<div>作品名字</div>
</div>
</div>
<div class="account_like_item_left">
<div class="account_like_item_left_delete modal_title_text_intro">
<span class="icon iconfont icon-shanchu operate_icon"></span>
</div>
<div class="modal_title_text_intro">2024-06-05</div>
</div>
</div>
<div class="account_like_item">
<div class="account_like_item_right">
<div class="account_like_item_right_img">
<img src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" alt="">
</div>
<div class="account_like_item_right_title">
<div class="account_like_item_right_title_name">名字 <span>等人攒了你的作品</span></div>
<div>作品名字</div>
</div>
</div>
<div class="account_like_item_left">
<div class="account_like_item_left_delete modal_title_text_intro">
<span class="icon iconfont icon-shanchu operate_icon"></span>
</div>
<div class="modal_title_text_intro">2024-06-05</div>
</div>
</div>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,reactive,nextTick,toRefs,createVNode, onMounted} from 'vue'
import { Https } from "@/tool/https";
import { useRouter,useRoute } from 'vue-router'
import { Modal,message } from 'ant-design-vue';
import { useStore } from "vuex";
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
import { useI18n } from 'vue-i18n'
export default defineComponent({
components:{
},
setup() {
const router = useRouter()
const store = useStore();
let accountMessage = reactive({
activeKey: ref('1'),
followList:ref([
{
name:'张三',
avatar:'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png',
time:'2024-01-01 12:00:00',
content:'关注了你',
isRead:false
},
{
name:'李四',
avatar:'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png',
}
])
})
// let ws = new WebSocket('ws://127.0.0.1:3000')
// console.log(ws);
// ws.onopen = ()=>{
// console.log(222);
// let data = {
// cmd:4,
// data:{
// msg:'222'
// }
// }
// ws.send(JSON.stringify(data))
// // ws.onmessage = (data)=>{
// // console.log(data);
// // }
// }
// provide('exhibitionList',exhibitionList)
onMounted (()=>{
})
return{
...toRefs(accountMessage),
}
},
data(){
return{
}
},
})
</script>
<style lang="less" scoped>
.account_like{
width: 100%;
.account_like_title{
display: flex;
align-items: center;
justify-content: space-between;
padding: 2rem 5rem;
border-bottom: 1px solid #e9eaec;
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;
border-radius: 5px;
.account_like_title_setting{
cursor: pointer;
}
}
.account_like_center{
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;
border-radius: 5px;
padding: 2rem 5rem;
.account_like_item{
display: flex;
display: flex;
justify-content: space-between;
align-items: center;
padding: 2rem 0;
border-bottom: 1px solid #e9eaec;
.account_like_item_right{
display: flex;
align-items: center;
margin-right: 1rem;
.account_like_item_right_img{
width: 8rem;
height: 8rem;
margin-right: 2rem;
flex-shrink: 0;
cursor: pointer;
img{
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.account_like_item_right_title{
.account_like_item_right_title_name{
font-weight: 600;
font-weight: 500;
color: #000;
span{
font-weight: 500;
color: #9999aa;
}
}
}
}
.account_like_item_left{
text-align: right;
flex-shrink: 0;
.account_like_item_left_delete{
span{
cursor: pointer;
}
}
div{
padding: .5rem 2rem;
border-radius: 4rem;
}
}
}
.account_like_item:last-child{
margin-bottom: 0;
border-bottom: none;
}
}
}
</style>

103
src/component/Account/message/newFollow.vue
View File

@@ -1,20 +1,38 @@
<template>
<div class="account_systemMessage">
<div class="account_systemMessage_title modal_title_text">
系统消息
<div class="account_newFollow">
<div class="account_newFollow_title modal_title_text">
新增粉丝
</div>
<div class="account_systemMessage_item modal_title_text">
<div class="account_systemMessage_item_title">
<div>Open Call for International Young Fashion Talent</div>
<div class="modal_title_text_intro">31 Aug 2024</div>
<div class="account_newFollow_center modal_title_text">
<div class="account_newFollow_item">
<div class="account_newFollow_item_right">
<div class="account_newFollow_item_right_img">
<img src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" alt="">
</div>
<div class="account_newFollow_item_right_title">
<div class="">名字</div>
<div class="modal_title_text_intro">2024-01-01 12:00:00 关注了你</div>
</div>
</div>
<div class="account_newFollow_item_left">
<div>回关</div>
</div>
</div>
<div class="modal_title_text_intro">
10 selected young fashion talent will be mentored by the AiDA development team to learn and explore the possibilities of AiDA. Each selected young fashion talent will create a 4-outfit collection themed “Culture” with AiDA. They will receive full technical support and subsidies for the associated production fee. Selected International/ Mainland young talent will also be able to attend the Culture X AI Internation Fashion Show in Hong Kong that is scheduled on 11 March 2025.
<span class="account_systemMessage_item_link">网页链接</span>
<div class="account_newFollow_item">
<div class="account_newFollow_item_right">
<div class="account_newFollow_item_right_img">
<img src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" alt="">
</div>
<div class="account_newFollow_item_right_title">
<div class="">名字</div>
<div class="modal_title_text_intro">2024-01-01 12:00:00 关注了你</div>
</div>
</div>
<div class="account_newFollow_item_left">
<div>回关</div>
</div>
</div>
</div>
<div></div>
<div></div>
</div>
</template>
<script lang="ts">
@@ -33,6 +51,19 @@ export default defineComponent({
const store = useStore();
let accountMessage = reactive({
activeKey: ref('1'),
followList:ref([
{
name:'张三',
avatar:'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png',
time:'2024-01-01 12:00:00',
content:'关注了你',
isRead:false
},
{
name:'李四',
avatar:'https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png',
}
])
})
// let ws = new WebSocket('ws://127.0.0.1:3000')
// console.log(ws);
@@ -66,9 +97,9 @@ export default defineComponent({
})
</script>
<style lang="less" scoped>
.account_systemMessage{
.account_newFollow{
width: 100%;
.account_systemMessage_title{
.account_newFollow_title{
display: flex;
align-items: center;
justify-content: space-between;
@@ -77,27 +108,49 @@ export default defineComponent({
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;
border-radius: 5px;
.account_systemMessage_title_setting{
.account_newFollow_title_setting{
cursor: pointer;
}
}
.account_systemMessage_item{
.account_newFollow_center{
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
border: 1px solid #e9eaec;
border-radius: 5px;
padding: 5rem 5rem;
.account_systemMessage_item_title{
padding: 2rem 5rem;
.account_newFollow_item{
display: flex;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 2rem;
.modal_title_text_intro{
margin-left: 4rem;
padding: 2rem 0;
border-bottom: 1px solid #e9eaec;
.account_newFollow_item_right{
display: flex;
align-items: center;
.account_newFollow_item_right_img{
width: 8rem;
height: 8rem;
margin-right: 2rem;
cursor: pointer;
img{
width: 100%;
height: 100%;
border-radius: 50%;
}
}
}
.account_newFollow_item_left{
div{
padding: .5rem 2rem;
border-radius: 4rem;
border: 2px solid #e9eaec;
cursor: pointer;
}
}
}
.account_systemMessage_item_link{
color: #39215b;
cursor: pointer;
font-weight: 600;
.account_newFollow_item:last-child{
margin-bottom: 0;
border-bottom: none;
}
}
}

198
src/component/Account/otherUsers.vue Normal file
View File

@@ -0,0 +1,198 @@
<template>
<div class="otherUsers">
<div class="otherUsers_page_titleImg">
<img src="https://code-create.com.hk/wp-content/uploads/2022/12/about_banner-1.jpg" alt="">
</div>
<div class="otherUsers_userDetail">
<div class="otherUsers_userDetail_img">
<img src="https://code-create.com.hk/wp-content/uploads/2022/12/about_banner-1.jpg" alt="">
</div>
<div class="otherUsers_userDetail_center">
<div class="otherUsers_userDetail_center_name modal_title_text">
<div>用户名</div>
<div class="userDetail_center_name_left">关注</div>
</div>
<div class="otherUsers_userDetail_center_data">
<div class="userDetail_center_data_item modal_title_text">
<div>99999</div>
<span class="modal_title_text_intro">访问量</span>
</div>
<div class="userDetail_center_data_item modal_title_text">
<div>123</div>
<span class="modal_title_text_intro">作品</span>
</div>
<div class="userDetail_center_data_item modal_title_text">
<div>999</div>
<span class="modal_title_text_intro">粉丝</span>
</div>
<div class="userDetail_center_data_item modal_title_text">
<div>22</div>
<span class="modal_title_text_intro">关注</span>
</div>
</div>
<div class="otherUsers_userDetail_center_signature">
<div class="modal_title_text">
<div class="modal_title_text_intro">个性签名个性签名个性签名</div>
</div>
</div>
</div>
</div>
<div class="otherUser_works">
<div class="otherUser_works_title modal_title_text">
<div>他的作品</div>
</div>
<Works :isScroll="false" :otherUsers="true" :userId=userId></Works>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,ref,reactive,nextTick,toRefs,createVNode, onMounted} from 'vue'
import { Https } from "@/tool/https";
import { useRouter,useRoute } from 'vue-router'
import { Modal,message } from 'ant-design-vue';
import { useStore } from "vuex";
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
import { useI18n } from 'vue-i18n'
import Works from '@/views/HomeView/Works.vue';
export default defineComponent({
components:{
Works
},
setup() {
const router:any = useRouter()
const store = useStore();
let otherUsers = reactive({
userId:'0'
})
// let ws = new WebSocket('ws://127.0.0.1:3000')
// console.log(ws);
// ws.onopen = ()=>{
// console.log(222);
// let data = {
// cmd:4,
// data:{
// msg:'222'
// }
// }
// ws.send(JSON.stringify(data))
// // ws.onmessage = (data)=>{
// // console.log(data);
// // }
// }
// provide('exhibitionList',exhibitionList)
onMounted (()=>{
otherUsers.userId = router.currentRoute.value.query?.id
// alert()
})
return{
...toRefs(otherUsers),
}
},
data(){
return{
}
},
})
</script>
<style lang="less" scoped>
.otherUsers{
width: 100%;
height: 100%;
padding: 0 9rem;
display: flex;
flex-direction: column;
overflow-y: auto;
.otherUsers_page_titleImg{
img{
width: 100%;
height: 30rem;
object-fit: cover;
}
}
.otherUsers_userDetail{
padding: 2rem;
display: flex;
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
margin-bottom: 2rem;
.modal_title_text{
margin-bottom: .5rem;
}
.otherUsers_userDetail_img{
width: 10rem;
height: 10rem;
// transform: translateY(-4rem);
margin-right: 4rem;
flex-shrink: 0;
img{
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50%;
}
}
.otherUsers_userDetail_center{
flex: 1;
.otherUsers_userDetail_center_name{
display: flex;
justify-content: space-between;
.userDetail_center_name_left{
padding: .5rem 2rem;
border-radius: 4rem;
border: 2px solid #e9eaec;
cursor: pointer;
}
}
.otherUsers_userDetail_center_data{
display: flex;
.userDetail_center_data_item{
display: flex;
>div{
margin-right: 1rem;
}
}
.userDetail_center_data_item::after{
content: '';
display: block;
width: 1px;
height: 2rem;
background-color: #ccc;
margin: 0 2rem;
}
.userDetail_center_data_item:last-child::after{
display: none;
}
}
.otherUsers_userDetail_center_signature{
>div{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
}
}
}
.otherUser_works{
height: auto;
box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.12);
position: relative;
padding: 0 2rem;
.otherUser_works_title{
padding: 2rem 0;
position: sticky;
top: 0;
background: #fff;
margin: 0;
z-index: 2;
}
.otherUser_works_content{
height: 200px;
width: 100%;
background: #ccc;
}
}
}
</style>

2
src/component/Detail/DesignDetail.vue
View File

@@ -463,6 +463,8 @@ export default defineComponent({
DesignDetailAlter.terminate()
// this.designItemDetail = {}
this.frontBack = {}
let setDesignItem:any = isMoible() ? this.$refs.setDesignItemMobile : this.$refs.setDesignItem
setDesignItem.clear()
}

24
src/component/Detail/setDesignItem.vue
View File

@@ -105,8 +105,12 @@ export default defineComponent({
return {
loadingShow:false,//加载中
store: useStore(),
setImgSizeTimeout:null
};
},
mounted () {
window.addEventListener('resize', this.setImgSizeTime);
},
methods: {
init(){
let DesignParent = this.$parent
@@ -134,7 +138,14 @@ export default defineComponent({
})
this.setImgSize()
},
setImgSizeTime(){
clearTimeout(this.setImgSizeTimeout)
this.setImgSizeTimeout = setTimeout(()=>{
this.setImgSize()
},300)
},
async setImgSize(){
this.frontBack.body = null
let designItemDetail = JSON.parse(JSON.stringify(this.store.state.DesignDetailModule.designItemDetail))
let front = []
let back = []
@@ -218,6 +229,9 @@ export default defineComponent({
}
return num
},
clear(){
window.removeEventListener('resize', this.setImgSizeTime);
},
setpitch(item,index){
this.frontBack.front.forEach((v)=>{
v.designOpenrtionBtn = false
@@ -472,6 +486,7 @@ export default defineComponent({
this.$emit('setDesignCoverage');
this.store.commit("setDesignItemDetail", designItemDetail);
this.setRevocation(designItemDetail,data)
this.clear()
}
).catch(res=>{
// this.$parent.loadingShow = false
@@ -506,13 +521,14 @@ export default defineComponent({
height: 100%;
width: 100%;
.designOpenrtion_centent{
flex: 1;
// flex: 1;
height: 100%;
display: flex;
flex-direction: column;
align-content: space-around;
flex-wrap: nowrap;
margin: 0 auto;
overflow: hidden;
// overflow: hidden;
justify-content: space-between;
position: relative;
user-select:none;
@@ -525,8 +541,8 @@ export default defineComponent({
width: auto;
height: auto;
position: relative;
height: 100%;
overflow: hidden;
height: calc(100% - 1.2rem - 4.8rem - 20%);
// overflow: hidden;
>img{
z-index: 2;
position: relative;

25
src/component/Detail/setDesignItemMobile.vue
View File

@@ -100,8 +100,12 @@ export default defineComponent({
return {
loadingShow:false,//加载中
store: useStore(),
setImgSizeTimeout:null
};
},
mounted () {
window.addEventListener('resize', this.setImgSizeTime);
},
methods: {
init(){
let DesignParent = this.$parent
@@ -129,7 +133,14 @@ export default defineComponent({
})
this.setImgSize()
},
setImgSizeTime(){
clearTimeout(this.setImgSizeTimeout)
this.setImgSizeTimeout = setTimeout(()=>{
this.setImgSize()
},300)
},
async setImgSize(){
this.frontBack.body = null
let designItemDetail = JSON.parse(JSON.stringify(this.store.state.DesignDetailModule.designItemDetail))
let front = []
let back = []
@@ -214,6 +225,9 @@ export default defineComponent({
}
return num
},
clear(){
window.removeEventListener('resize', this.setImgSizeTime);
},
setpitch(item,index){
this.frontBack.front.forEach((v)=>{
v.designOpenrtionBtn = false
@@ -439,6 +453,7 @@ export default defineComponent({
this.$emit('setDesignCoverage');
this.store.commit("setDesignItemDetail", designItemDetail);
this.setRevocation(designItemDetail,data)
this.clear()
}
).catch(res=>{
this.$emit('setParentLoadingShow');
@@ -477,13 +492,14 @@ export default defineComponent({
height: 100%;
width: 100%;
.designOpenrtion_centent{
flex: 1;
// flex: 1;
height: 100%;
display: flex;
flex-direction: column;
align-content: space-around;
flex-wrap: nowrap;
margin: 0 auto;
overflow: hidden;
// overflow: hidden;
justify-content: space-between;
position: relative;
user-select:none;
@@ -496,8 +512,9 @@ export default defineComponent({
width: auto;
height: auto;
position: relative;
height: 100%;
overflow: hidden;
// height: 100%;
// overflow: hidden;
height: calc(100% - 1.2rem - 4.8rem - 20%);
margin: 0 auto;
>img{
z-index: 2;

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

@@ -468,8 +468,10 @@ export default defineComponent({
for (const key in allBoardData.value) {
if (item == key) {
//循环渲染顺序
let imgWidth = setImageWidth(key); //这是设置画布等宽
let imgWidth //这是设置画布等宽
if(item !== 'likeDesignCollectionList' && item !== 'FinalizeImage'){
imgWidth = await setImageWidth(key);
}
let sketchGroupingItem = [];
if (
item == "moodboardFiles" &&
@@ -478,7 +480,7 @@ export default defineComponent({
continue;
}
for (const [allItemIndex, allItem,] of allBoardData.value[key].entries()) {
await new Promise((resolve, reject) => {
await new Promise(async (resolve, reject) => {
if(!allItem){
resolve()
}
@@ -497,9 +499,11 @@ export default defineComponent({
} else {
let itemCanvasImg = allItem.imgUrl;
if (key == "likeDesignCollectionList") {
itemCanvasImg =
allItem.designOutfitUrl;
}
if(item == 'likeDesignCollectionList' || item == 'FinalizeImage')imgWidth = await setImageWidth(key,itemCanvasImg);
fabric.Image.fromURL(itemCanvasImg,(img) => {
let scaleWH = imgWidth / img.width; //计算放到画布上缩小倍率
if(key == "sketchboardFiles"){
@@ -513,7 +517,7 @@ export default defineComponent({
position.y = maxHeight;
}
}
setCanvasImage(img,key,position.x,position.y,allItem)//设置图片
setCanvasImage(img,key,position.x,position.y,allItem,imgWidth)//设置图片
position.height = img.height * scaleWH + margin;
if (key == "sketchboardFiles") {
if (sketchGroupingItem.length <3) {
@@ -608,7 +612,7 @@ export default defineComponent({
}
let setImageWidth = (key)=>{
let setImageWidth = async (key,img)=>{
let imgWidth = canvasWH.value.width; //这是设置画布等宽
if (
disposeMoodboardShow &&
@@ -632,14 +636,29 @@ export default defineComponent({
sketchGrouping;
}
if (key == "likeDesignCollectionList" || key == 'FinalizeImage') {
imgWidth =
(canvasWH.value.width -
(likeDesign - 1) * 20) /
likeDesign;
if(img){
await new Promise((resolve, reject) => {
let imgObj = new Image();
imgObj.onload = function () {
let height = imgObj.height
imgObj.height = canvasWH.value.width / 4 * 1.8
let heightScale = imgObj.height / height
imgWidth = imgObj.width * heightScale
// imgObj.remove()
resolve(imgObj.width)
}
imgObj.src = img;
})
}
// imgWidth =
// (canvasWH.value.width -
// (likeDesign - 1) * 20) /
// likeDesign;
}
return imgWidth
}
let setCanvasImage = (img,key,left,top,data)=>{
let setCanvasImage = (img,key,left,top,data,imgWidth)=>{
// data
let imgId = 0
let minioUrl = ''//表示收藏或者generate
@@ -671,7 +690,7 @@ export default defineComponent({
minioUrl = match[2]
// let id =
let proportion = img.height / img.width; //计算图形宽高比例
let imgWidth = setImageWidth(key)
// let imgWidth = setImageWidth(key)
let scaleWH = imgWidth / img.width; //计算放到画布上缩小倍率
img.set({
// width: imgWidth/img.width,

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

@@ -760,7 +760,7 @@ methods: {
height: 14rem;
position: relative;
img{
width: 100%;
height: 100%;
cursor: pointer;
object-fit: contain;
opacity: .5;
@@ -825,7 +825,7 @@ methods: {
// width: 45%;
.productImg_content_item_imgBox{
.content_item_imgBox_itemImg{
width: 7rem;
width: auto;
flex-shrink: 0;
}
}

4
src/router/index.ts
View File

@@ -99,6 +99,10 @@ const routes: Array<RouteRecordRaw> = [
component: _import_component('Account/accountFollowFans.vue'),
}
]
},{
path:'otherUsers',
name:'otherUsers',
component: _import_component('Account/otherUsers.vue'),
}
]
},

4
src/store/homeStore/homeStore.ts
View File

@@ -10,7 +10,6 @@ interface DesignDetail{
templateImgUrl:any,
designId:any,
showSketchList:any,
}
const HomeStoreModule : Module<DesignDetail,RootState> = {
@@ -83,8 +82,7 @@ const HomeStoreModule : Module<DesignDetail,RootState> = {
state.templateId= ''
state.templateImgUrl = ''
},
},

9
src/store/userHabit/userHabit.ts
View File

@@ -14,6 +14,7 @@ interface UserHabit{
MalePosition:any,
Position:any,
systemUser:any,
messageSystem:any,
}
const userHabit : Module<UserHabit,RootState> = {
@@ -39,7 +40,9 @@ const userHabit : Module<UserHabit,RootState> = {
systemUser:{
value : -1
},
messageSystem:{
messageNum:4,
},
},
mutations:{
res_clothingType(state,data){
@@ -73,6 +76,10 @@ const userHabit : Module<UserHabit,RootState> = {
clearSystemUser(state){
state.systemUser.value = -1
},
setMessageSystem(state,data){
state.messageSystem = data
},
},
actions:{

2
src/tool/https.js
View File

@@ -88,6 +88,7 @@ axios.interceptors.response.use((res) =>{
}
}, function(error) {
if(error?.response?.status === 401 && router.currentRoute._value.name != 'setIdentification'){//如果是记录浏览器页面就不跳转login
clonAllCookie()
if(!isLoginTime){
isLoginTime = true
let isSystemUserRouteList = ['/Square']//如果是这两个页面就无需跳转未登录页
@@ -102,7 +103,6 @@ axios.interceptors.response.use((res) =>{
router.replace('/')
}
message.warning('Please login and try again~')
clonAllCookie()
store.commit('clearSystemUser')
setTimeout(()=>[
isLoginTime = false

46
src/tool/webSocket.js Normal file
View File

@@ -0,0 +1,46 @@
class MyWs {
constructor() {
this.ws = null;
// this.ws = new WebSocket();
}
linkWs(url) {
if (this.ws && this.ws.readyState == 1) return
this.ws = new WebSocket(url)
}
sendMessage(data) {
console.log(this);
if (this.ws && this.ws.readyState == 1) {
let obj = {
cmd: 1,
data: {
name: '123',
}
}
this.send(obj)
obj = {
cmd: 4,
data: {
msg: data,
}
}
this.send(obj)
// obj = {
// cmd: 6,
// data: {
// msg: data,
// }
// }
// this.send(obj,this.ws)
}
}
send(obj) {
console.log(2323);
this.ws.send(JSON.stringify(obj))
}
close(){
if (this.ws && this.ws.readyState == 1) {
this.ws.close()
}
}
}
export default new MyWs();

17
src/views/HomeMain.vue
View File

@@ -49,7 +49,7 @@
</div>
<div class="trialApproval button_second credits message">
<a-badge :count="5">
<a-badge :count="messageNum">
<i class="fi fi-rr-envelope" @click="openMessage"></i>
</a-badge>
</div>
@@ -169,6 +169,7 @@ import showViewVideo from "@/tool/mount";
import { useI18n } from "vue-i18n";
import { gsap, TweenMax,TweenLite } from "gsap";
import { ScrollTrigger } from "gsap/ScrollTrigger";
import MyWs from "@/tool/webSocket";
export default defineComponent({
components: {
VerificationCodeInput,
@@ -181,9 +182,18 @@ export default defineComponent({
navRouter,
},
setup(){
let url = '127.0.0.1:3000'
MyWs.linkWs("ws://"+url)
console.log();
setTimeout(() => {
MyWs.sendMessage('aaaa')
}, 3000);
const store = useStore();
const {t} = useI18n()
const {locale} = useI18n()
MyWs.ws.onmessage = (data)=>{
console.log(JSON.parse(data.data),232);
}
let isTest = ref()
let isMurmur = ref()
let credits = computed(()=>{
@@ -215,6 +225,10 @@ export default defineComponent({
name:t('Header.EVENTS')
},
]
let messageNum = computed(()=>{
return store.state.UserHabit.messageSystem.messageNum
})
store.commit('setMessageSystem',{messageNum:22})
return {
store,
t,
@@ -226,6 +240,7 @@ export default defineComponent({
getLangIsShowMark,
AdministratorUserIdList,
navRouterList,
messageNum,
}
},
data() {

27
src/views/HomeView/Works.vue
View File

@@ -1,9 +1,9 @@
<template>
<div class="works_page" :class="{active:isScroll}">
<div class="works_page" :class="{active:isScroll,'otherUsersActive':otherUsers}">
<!-- <div class="modal_title_text">
<div>Works</div>
</div> -->
<div class="modal_title_text modal_search">
<div class="modal_title_text modal_search" v-if="!otherUsers">
<div v-show="isScroll" v-for="item in worksType" :key="item" class="modal_title_text_assistant" @click="setWorksSelect(item)" :class="{active:item.value == worksSelect}">
{{ item.name }}
</div>
@@ -53,8 +53,16 @@ export default defineComponent({
type:Boolean,
default:true,
},
otherUsers:{
type:Boolean,
default:false,
},
userId:{
type:String,
default:'-1',
},
},
setup() {
setup(prop) {
let filter:any = reactive({
worksSelect: 'all',
isNull:true,
@@ -153,6 +161,9 @@ export default defineComponent({
let data = filter.getListDate
if(filter.isShowMark && !filter.isNoData)return
filter.isShowMark = true
// if(prop.otherUsers){
// console.log(prop.userId);
// }
Https.axiosPost(Https.httpUrls.getPorfolio, data)
.then((rv) => {
if(data.page == 1 && rv.content.length == 0){
@@ -198,7 +209,7 @@ export default defineComponent({
fall.value.deleteItem(value);
}
onMounted (()=>{
let setPorfolioDom = ()=>{
filter.isShowMark = false
filter.isNoData = false
getPorfolio()
@@ -214,6 +225,11 @@ export default defineComponent({
},
// { root:worksPage }
).observe(imgParent);
}
onMounted (()=>{
nextTick(()=>{
setPorfolioDom()
})
})
return {
...toRefs(filter),
@@ -310,6 +326,9 @@ export default defineComponent({
width: 100%;
}
}
&.otherUsersActive{
padding: 0;
}
}
</style>