chat聊天功能
This commit is contained in:
2
.env.dev
2
.env.dev
@@ -8,5 +8,5 @@ VUE_APP_BASE_URL = 'https://develop.api.aida.com.hk'
|
|||||||
# 徐佩
|
# 徐佩
|
||||||
# VUE_APP_BASE_URL = 'http://192.168.31.118:5567'
|
# VUE_APP_BASE_URL = 'http://192.168.31.118:5567'
|
||||||
# 海波
|
# 海波
|
||||||
# VUE_APP_BASE_URL = 'http://192.168.1.7:5567'
|
VUE_APP_BASE_URL = 'http://192.168.1.3:5567'
|
||||||
|
|
||||||
|
|||||||
@@ -551,14 +551,12 @@ li {
|
|||||||
.ant-btn-primary {
|
.ant-btn-primary {
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
}
|
}
|
||||||
.ant-picker-range-wrapper,
|
|
||||||
.ant-picker-dropdown {
|
.ant-picker-dropdown {
|
||||||
border-radius: 2rem;
|
border-radius: 2rem;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border: 2px solid #000;
|
border: 2px solid #000;
|
||||||
}
|
}
|
||||||
.ant-picker-range-wrapper .ant-picker-range-arrow,
|
|
||||||
.ant-picker-dropdown .ant-picker-range-arrow {
|
.ant-picker-dropdown .ant-picker-range-arrow {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -612,7 +612,7 @@ input:focus{
|
|||||||
.ant-btn-primary{
|
.ant-btn-primary{
|
||||||
background-color: #000;
|
background-color: #000;
|
||||||
}
|
}
|
||||||
.ant-picker-range-wrapper,.ant-picker-dropdown{
|
.ant-picker-dropdown{
|
||||||
border-radius: 2rem;
|
border-radius: 2rem;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
|||||||
@@ -266,8 +266,8 @@ export default defineComponent({
|
|||||||
.account_page{
|
.account_page{
|
||||||
height: 100%;
|
height: 100%;
|
||||||
// overflow-y: auto;
|
// overflow-y: auto;
|
||||||
padding: 0 30rem;
|
padding: 0 7rem;
|
||||||
padding-top: 7rem;
|
padding-top: 4rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
.account_page_titleImg{
|
.account_page_titleImg{
|
||||||
|
|||||||
@@ -36,8 +36,8 @@
|
|||||||
{{ $t('cancelRenewal.subscriptionRenewal') }}
|
{{ $t('cancelRenewal.subscriptionRenewal') }}
|
||||||
</div>
|
</div>
|
||||||
<div class="button_box">
|
<div class="button_box">
|
||||||
<div class="gallery_btn white" v-if="userDetail.status != 'active' && userDetail.systemUser != 3" @click="subscribe">{{ $t('cancelRenewal.Continue') }}</div>
|
<div class="gallery_btn" v-if="userDetail.status == 'active' && userDetail.systemUser != 3" @click="cancelSubscription">{{ $t('cancelRenewal.cancel') }}</div>
|
||||||
<div class="gallery_btn" v-else @click="cancelSubscription">{{ $t('cancelRenewal.cancel') }}</div>
|
<div class="gallery_btn white" v-else @click="subscribe">{{ $t('cancelRenewal.Continue') }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="mark_loading" v-show="isShowMark">
|
<div class="mark_loading" v-show="isShowMark">
|
||||||
<a-spin size="large" />
|
<a-spin size="large" />
|
||||||
|
|||||||
196
src/component/Administrator/organization/add.vue
Normal file
196
src/component/Administrator/organization/add.vue
Normal file
@@ -0,0 +1,196 @@
|
|||||||
|
<template>
|
||||||
|
<div class="allUserPoerationModal" ref="allUserPoerationModal"></div>
|
||||||
|
<a-modal
|
||||||
|
class="allUserPoeration_modal generalModel"
|
||||||
|
v-model:visible="operationsModal"
|
||||||
|
:footer="null"
|
||||||
|
:get-container="() => $refs.allUserPoerationModal"
|
||||||
|
width="50%"
|
||||||
|
height="35rem"
|
||||||
|
:maskClosable="false"
|
||||||
|
:centered="true"
|
||||||
|
:closable="false"
|
||||||
|
:mask="true"
|
||||||
|
wrapClassName="#app"
|
||||||
|
:keyboard="false"
|
||||||
|
>
|
||||||
|
<div class="generalModel_btn">
|
||||||
|
<div class="generalModel_closeIcon" @click.stop="cancelDsign()">
|
||||||
|
<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
|
||||||
|
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
|
||||||
|
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal_title_text">
|
||||||
|
<div>{{ title }} User</div>
|
||||||
|
</div>
|
||||||
|
<div class="allUserPoeration_center admin_page">
|
||||||
|
<div class="admin_state_item">
|
||||||
|
<span>User Name: <span>*</span></span>
|
||||||
|
<input
|
||||||
|
:readonly="title != 'Add'"
|
||||||
|
:class="{active:title != 'Add'}"
|
||||||
|
v-model="name"
|
||||||
|
placeholder="Please enter user name"
|
||||||
|
type="text"
|
||||||
|
style="width: 250px"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="admin_state_item">
|
||||||
|
<span>User Type:<span>*</span></span>
|
||||||
|
<a-select
|
||||||
|
v-model:value="systemUser"
|
||||||
|
size="large"
|
||||||
|
style="width: 250px"
|
||||||
|
optionFilterProp="label"
|
||||||
|
:options="state"
|
||||||
|
placeholder="Please select"
|
||||||
|
allowClear
|
||||||
|
show-search
|
||||||
|
></a-select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="allUserPoeration_btn admin_page">
|
||||||
|
<div class="admin_search_item" @click="cancelDsign">
|
||||||
|
Close
|
||||||
|
</div>
|
||||||
|
<div class="admin_search_item" @click="setOk">
|
||||||
|
OK
|
||||||
|
</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 { Modal, message } from "ant-design-vue";
|
||||||
|
import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
|
||||||
|
import { formatTime } from "@/tool/util";
|
||||||
|
export default defineComponent({
|
||||||
|
components: {
|
||||||
|
},
|
||||||
|
emits: ['searchHistoryList'],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
let operations = reactive({
|
||||||
|
operationsModal:false,
|
||||||
|
operationsEdit:false,
|
||||||
|
loadingShow:false,
|
||||||
|
title:''
|
||||||
|
})
|
||||||
|
let operationsData = reactive({
|
||||||
|
name:'',
|
||||||
|
type:'Enterprise',
|
||||||
|
})
|
||||||
|
let state = ref([
|
||||||
|
{
|
||||||
|
label:'Enterprise',
|
||||||
|
value:'Enterprise',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label:'Education',
|
||||||
|
value:'Education',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
let init = (funStr,data)=>{
|
||||||
|
operations.operationsModal = true
|
||||||
|
operations.operationsEdit = true
|
||||||
|
operations.title = funStr
|
||||||
|
if(funStr == 'Add') operations.operationsEdit = false
|
||||||
|
if(funStr == 'Edit'){
|
||||||
|
operationsData.name=data.name
|
||||||
|
operationsData.type=data.type
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
let setAddData = ()=>{
|
||||||
|
return {
|
||||||
|
"name": operationsData.name,
|
||||||
|
"type": operationsData.type,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let setEditData = ()=>{
|
||||||
|
return {
|
||||||
|
"name": operationsData.country,
|
||||||
|
"type": operationsData.credits,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let cancelDsign = ()=>{
|
||||||
|
operationsData.name=''
|
||||||
|
operationsData.type='Enterprise'
|
||||||
|
}
|
||||||
|
let setOk = ()=>{
|
||||||
|
let data
|
||||||
|
if(operations.title == 'Add'){
|
||||||
|
data = setAddData()
|
||||||
|
if(!data.name)return message.warning('Please check the input box marked with *')
|
||||||
|
Https.axiosPost(Https.httpUrls.addOrganization, data).then(
|
||||||
|
(rv) => {
|
||||||
|
if (rv) {
|
||||||
|
cancelDsign()
|
||||||
|
emit('searchHistoryList')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
...toRefs(operations),
|
||||||
|
...toRefs(operationsData),
|
||||||
|
state,
|
||||||
|
cancelDsign,
|
||||||
|
init,
|
||||||
|
setOk,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
:deep(.allUserPoeration_modal){
|
||||||
|
.ant-modal-body{
|
||||||
|
height: auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
|
||||||
|
.allUserPoeration_modal {
|
||||||
|
.closeIcon {
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.allUserPoeration_btn{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
height: auto;
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 1rem 0;
|
||||||
|
.admin_search_item{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.allUserPoeration_center{
|
||||||
|
flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
230
src/component/Administrator/organization/organization.vue
Normal file
230
src/component/Administrator/organization/organization.vue
Normal file
@@ -0,0 +1,230 @@
|
|||||||
|
<template>
|
||||||
|
<div class="admin_page">
|
||||||
|
<div class="admin_table_search" >
|
||||||
|
<div class="admin_state">
|
||||||
|
<div class="admin_state_item">
|
||||||
|
<span>Status:</span>
|
||||||
|
<a-select
|
||||||
|
v-model:value="status"
|
||||||
|
size="large"
|
||||||
|
style="width: 250px"
|
||||||
|
optionFilterProp="label"
|
||||||
|
:options="statusList"
|
||||||
|
placeholder="Please select"
|
||||||
|
allowClear
|
||||||
|
show-search
|
||||||
|
></a-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="admin_search">
|
||||||
|
<div class="admin_search_item" @click="searchHistoryList">
|
||||||
|
Search
|
||||||
|
</div>
|
||||||
|
<div class="admin_search_item" @click="addhHistoryList">
|
||||||
|
Add
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="admin_table_content" ref="historyTable">
|
||||||
|
<a-table
|
||||||
|
@resizeColumn="handleResizeColumn"
|
||||||
|
:loading="tableLoading"
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="dataList"
|
||||||
|
:scroll="{ y: historyTableHeight }"
|
||||||
|
@change="changePage"
|
||||||
|
:showSorterTooltip='false'
|
||||||
|
:pagination="{
|
||||||
|
showSizeChanger: true,
|
||||||
|
current: currentPage,
|
||||||
|
pageSize: pageSize,
|
||||||
|
total: total,
|
||||||
|
showQuickJumper: true,
|
||||||
|
bordered: false,
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
</a-table>
|
||||||
|
</div>
|
||||||
|
<add ref="add" @searchHistoryList="searchHistoryList"></add>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import {
|
||||||
|
defineComponent,
|
||||||
|
ref,
|
||||||
|
createVNode,
|
||||||
|
computed,
|
||||||
|
reactive,
|
||||||
|
toRefs,
|
||||||
|
onMounted,
|
||||||
|
} from "vue";
|
||||||
|
import { formatTime } from "@/tool/util";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import {getCookie,clonAllCookie} from '@/tool/cookie'
|
||||||
|
import add from './add.vue'
|
||||||
|
export default defineComponent({
|
||||||
|
components: {add},
|
||||||
|
setup() {
|
||||||
|
const store:any = useStore()
|
||||||
|
let filter: any = reactive({
|
||||||
|
dataList: [],
|
||||||
|
tableLoading: false,
|
||||||
|
countryList: computed(()=>{
|
||||||
|
return store.state.adminPage.country
|
||||||
|
}),
|
||||||
|
add:null as any,
|
||||||
|
status:'',
|
||||||
|
});
|
||||||
|
let filterData: any = reactive({
|
||||||
|
currentPage: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
total: 0,
|
||||||
|
country: "",
|
||||||
|
status: "",
|
||||||
|
type: "",
|
||||||
|
});
|
||||||
|
let selectList=reactive({
|
||||||
|
statusList:[
|
||||||
|
{
|
||||||
|
label: "all",
|
||||||
|
value: "",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label:'Enterprise',
|
||||||
|
value:'Enterprise',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label:'Education',
|
||||||
|
value:'Education',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
})
|
||||||
|
let renameData: any = ref({}); //修改名字选中的数据
|
||||||
|
const columns: any = computed(() => {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
title: "City",
|
||||||
|
align: "center",
|
||||||
|
dataIndex: "city",
|
||||||
|
key: "city",
|
||||||
|
width:150,
|
||||||
|
ellipsis:true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Country",
|
||||||
|
align: "center",
|
||||||
|
dataIndex: "country",
|
||||||
|
key: "country",
|
||||||
|
width:150,
|
||||||
|
ellipsis:true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Create Time",
|
||||||
|
align: "center",
|
||||||
|
dataIndex: "createTime",
|
||||||
|
key: "createTime",
|
||||||
|
width:150,
|
||||||
|
ellipsis:true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Status",
|
||||||
|
align: "center",
|
||||||
|
dataIndex: "status",
|
||||||
|
key: "status",
|
||||||
|
fixed: "right",
|
||||||
|
width:150,
|
||||||
|
Operations: true,
|
||||||
|
ellipsis:true,
|
||||||
|
}
|
||||||
|
];
|
||||||
|
});
|
||||||
|
//改变页码
|
||||||
|
let changePage = (e: any, filters:any, sorter:any) => {
|
||||||
|
filterData.currentPage = e.current;
|
||||||
|
filterData.pageSize = e.pageSize;
|
||||||
|
gettrialList();
|
||||||
|
};
|
||||||
|
|
||||||
|
//查询列表
|
||||||
|
let searchHistoryList = () => {
|
||||||
|
filterData.currentPage = 1;
|
||||||
|
gettrialList();
|
||||||
|
};
|
||||||
|
//获取列表
|
||||||
|
let gettrialList = () => {
|
||||||
|
filter.tableLoading = true;
|
||||||
|
Https.axiosGet(Https.httpUrls.queryOrganization, {params:{type:'Enterprise'}}).then(
|
||||||
|
(rv: any) => {
|
||||||
|
if (rv) {
|
||||||
|
console.log(rv)
|
||||||
|
// this.dataList = rv
|
||||||
|
filter.dataList = rv.content;
|
||||||
|
filterData.total = rv.total;
|
||||||
|
filter.tableLoading = false;
|
||||||
|
|
||||||
|
// this.workspaceItem.position = this.singleTypeList[0].label
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
};
|
||||||
|
let addhHistoryList = () => {
|
||||||
|
filter.add.init('Add','')
|
||||||
|
};
|
||||||
|
onMounted(() => {
|
||||||
|
gettrialList();
|
||||||
|
});
|
||||||
|
return {
|
||||||
|
...toRefs(filter),
|
||||||
|
...toRefs(filterData),
|
||||||
|
...toRefs(selectList),
|
||||||
|
columns,
|
||||||
|
renameData,
|
||||||
|
changePage,
|
||||||
|
searchHistoryList,
|
||||||
|
gettrialList,
|
||||||
|
addhHistoryList,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
historyTableHeight: 0,
|
||||||
|
handleResizeColumn: (w: any, col: any) => {
|
||||||
|
col.width = w;
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
let historyTable: any = this.$refs.historyTable;
|
||||||
|
this.historyTableHeight = historyTable.clientHeight - 200;
|
||||||
|
},
|
||||||
|
methods: {},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.admin_page .admin_table_search .admin_state {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
:deep(.operate_list){
|
||||||
|
.fi{
|
||||||
|
font-size: 2rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
.success{
|
||||||
|
.fi-ss-check-circle{
|
||||||
|
color: #3ab45c;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.pending{
|
||||||
|
.fi-ss-check-circle{
|
||||||
|
color: #ffc628;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fail{
|
||||||
|
.fi-ss-check-circle{
|
||||||
|
color: #ff0000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -653,7 +653,6 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
.modal_imgItem{
|
.modal_imgItem{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
overflow: hidden;
|
|
||||||
top: 0;
|
top: 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -711,7 +711,6 @@ export default defineComponent({
|
|||||||
z-index: 3;
|
z-index: 3;
|
||||||
.modal_imgItem{
|
.modal_imgItem{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
overflow: hidden;
|
|
||||||
top: 0;
|
top: 0;
|
||||||
img{
|
img{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@@ -755,8 +755,8 @@ export default defineComponent({
|
|||||||
if(key == 'upImgFiles')imgWidth[key] = setImageWidth(key,img);
|
if(key == 'upImgFiles')imgWidth[key] = setImageWidth(key,img);
|
||||||
|
|
||||||
let url = imgUrl.split('?')[0]
|
let url = imgUrl.split('?')[0]
|
||||||
var match = url.match(/:(\d+)\/(.*)/);
|
var match = url.match(/^(?:https?:\/\/[^\/]+)\/(.*)/);
|
||||||
minioUrl = match[2]
|
minioUrl = match[1]
|
||||||
// let id =
|
// let id =
|
||||||
let proportion = img.height / img.width; //计算图形宽高比例
|
let proportion = img.height / img.width; //计算图形宽高比例
|
||||||
// let imgWidth = setImageWidth(key)
|
// let imgWidth = setImageWidth(key)
|
||||||
|
|||||||
@@ -246,7 +246,7 @@ export default defineComponent({
|
|||||||
sketchCategory,
|
sketchCategory,
|
||||||
UpgradePlan,
|
UpgradePlan,
|
||||||
},
|
},
|
||||||
props: ["msg",'sketchCatecoryList','scene'],
|
props: ["msg",'sketchCatecoryList','scene','gender'],
|
||||||
setup(props) {
|
setup(props) {
|
||||||
// console.log(prop.msg);
|
// console.log(prop.msg);
|
||||||
let userDetail:any= computed(()=>{
|
let userDetail:any= computed(()=>{
|
||||||
@@ -366,8 +366,8 @@ export default defineComponent({
|
|||||||
}),
|
}),
|
||||||
upload: {
|
upload: {
|
||||||
isPin: 0,
|
isPin: 0,
|
||||||
gender:'',
|
|
||||||
level1Type: prop.msg,
|
level1Type: prop.msg,
|
||||||
|
gender: prop.gender,
|
||||||
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
|
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||||
},
|
},
|
||||||
token: "",
|
token: "",
|
||||||
|
|||||||
@@ -607,7 +607,6 @@ export default defineComponent({
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
height: calc(30rem*1.2);
|
height: calc(30rem*1.2);
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
border-right: 1px solid #e5e5e5;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
&.moodboard_body::-webkit-scrollbar {
|
&.moodboard_body::-webkit-scrollbar {
|
||||||
@@ -705,8 +704,10 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
.modal_img_max{
|
.modal_img_max{
|
||||||
// flex: 1;
|
// flex: 1;
|
||||||
width: calc(57rem*1.2);
|
// width: calc(57rem*1.2);
|
||||||
height: calc(35rem*1.2);
|
// height: calc(35rem*1.2);
|
||||||
|
width: 100%;
|
||||||
|
aspect-ratio: 1.62 / 1;
|
||||||
position: relative;
|
position: relative;
|
||||||
.mark_loading{
|
.mark_loading{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -719,7 +719,6 @@ export default defineComponent({
|
|||||||
padding-top: calc(2.5rem*1.2);
|
padding-top: calc(2.5rem*1.2);
|
||||||
height: calc(30rem*1.2);
|
height: calc(30rem*1.2);
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
border-right: 1px solid #e5e5e5;
|
|
||||||
&.printboard_body::-webkit-scrollbar {
|
&.printboard_body::-webkit-scrollbar {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -127,6 +127,7 @@
|
|||||||
v-show="openClick == 3"
|
v-show="openClick == 3"
|
||||||
ref="Generate"
|
ref="Generate"
|
||||||
msg="Sketchboard"
|
msg="Sketchboard"
|
||||||
|
:gender="upload.gender"
|
||||||
:scene="scene"
|
:scene="scene"
|
||||||
:sketchCatecoryList="sketchCatecoryList"
|
:sketchCatecoryList="sketchCatecoryList"
|
||||||
></Generate>
|
></Generate>
|
||||||
@@ -682,7 +683,6 @@ export default defineComponent({
|
|||||||
padding-top: calc(2.5rem*1.2);
|
padding-top: calc(2.5rem*1.2);
|
||||||
height: calc(30rem*1.2);
|
height: calc(30rem*1.2);
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
border-right: 1px solid #e5e5e5;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
&.moodboard_body::-webkit-scrollbar {
|
&.moodboard_body::-webkit-scrollbar {
|
||||||
|
|||||||
@@ -299,7 +299,6 @@ export default defineComponent({
|
|||||||
// overflow-x: hidden;
|
// overflow-x: hidden;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
border-right: 1px solid #e5e5e5;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
.mark_loading{
|
.mark_loading{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -577,7 +577,6 @@ export default defineComponent({
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
height: calc(30rem*1.2);
|
height: calc(30rem*1.2);
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
border-right: 1px solid #e5e5e5;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
&.moodboard_body::-webkit-scrollbar {
|
&.moodboard_body::-webkit-scrollbar {
|
||||||
@@ -673,11 +672,10 @@ export default defineComponent({
|
|||||||
padding-block: calc(2rem*1.2);
|
padding-block: calc(2rem*1.2);
|
||||||
}
|
}
|
||||||
.modal_img_max{
|
.modal_img_max{
|
||||||
// flex: 1;
|
// width: calc(57rem*1.2);
|
||||||
// width: 57rem;
|
// height: calc(35rem*1.2);
|
||||||
// height: 35rem;
|
width: 100%;
|
||||||
width: 92rem;
|
aspect-ratio: 1.62 / 1;
|
||||||
height: 56.5rem;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
.mark_loading{
|
.mark_loading{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -923,7 +923,6 @@ export default defineComponent({
|
|||||||
position: relative;
|
position: relative;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
overflow: hidden;
|
|
||||||
.moreBox{
|
.moreBox{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 1rem;
|
right: 1rem;
|
||||||
|
|||||||
@@ -129,6 +129,7 @@
|
|||||||
ref="Generate"
|
ref="Generate"
|
||||||
msg="Sketchboard"
|
msg="Sketchboard"
|
||||||
:scene="scene"
|
:scene="scene"
|
||||||
|
:gender="workspace.sex"
|
||||||
:sketchCatecoryList="sketchCatecoryList"
|
:sketchCatecoryList="sketchCatecoryList"
|
||||||
></Generate>
|
></Generate>
|
||||||
</div>
|
</div>
|
||||||
@@ -685,7 +686,6 @@ export default defineComponent({
|
|||||||
padding-top: calc(2.5rem*1.2);
|
padding-top: calc(2.5rem*1.2);
|
||||||
height: calc(30rem*1.2);
|
height: calc(30rem*1.2);
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
border-right: 1px solid #e5e5e5;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
&.moodboard_body::-webkit-scrollbar {
|
&.moodboard_body::-webkit-scrollbar {
|
||||||
@@ -877,7 +877,6 @@ export default defineComponent({
|
|||||||
position: relative;
|
position: relative;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
overflow: hidden;
|
|
||||||
.moreBox{
|
.moreBox{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 1rem;
|
right: 1rem;
|
||||||
|
|||||||
@@ -1,12 +1,14 @@
|
|||||||
<template>
|
<template>
|
||||||
<div ref="placementModal" v-if="placementShow">
|
<div ref="placementModal" v-if="placementShow">
|
||||||
<a-modal class="generalModel fullScreen"
|
<a-modal class="generalModel "
|
||||||
|
:class="{fullScreen:!isPop}"
|
||||||
v-model:visible="placementShow"
|
v-model:visible="placementShow"
|
||||||
:footer="null"
|
:footer="null"
|
||||||
width="100%"
|
:width="isPop?'150rem':'100%'"
|
||||||
|
:height="isPop?'90rem':'100%'"
|
||||||
:get-container="() => $refs.placementModal"
|
:get-container="() => $refs.placementModal"
|
||||||
height="100%"
|
|
||||||
:maskClosable="false"
|
:maskClosable="false"
|
||||||
|
:mask="mannEditMask"
|
||||||
:keyboard="false"
|
:keyboard="false"
|
||||||
:centered="true"
|
:centered="true"
|
||||||
:closable="false"
|
:closable="false"
|
||||||
@@ -201,6 +203,16 @@ export default defineComponent({
|
|||||||
components:{
|
components:{
|
||||||
VueCropper,
|
VueCropper,
|
||||||
},
|
},
|
||||||
|
props: {
|
||||||
|
isPop: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
ageGroup: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
emits:['submit'],
|
emits:['submit'],
|
||||||
setup() {
|
setup() {
|
||||||
const store = useStore()
|
const store = useStore()
|
||||||
@@ -219,6 +231,7 @@ export default defineComponent({
|
|||||||
modelType:'Library',
|
modelType:'Library',
|
||||||
slider:50,
|
slider:50,
|
||||||
editOrUpload:'edit',//edit 编辑 upload 上传
|
editOrUpload:'edit',//edit 编辑 upload 上传
|
||||||
|
mannEditMask:false,
|
||||||
})
|
})
|
||||||
const dataDom = reactive({
|
const dataDom = reactive({
|
||||||
placement:null as any,
|
placement:null as any,
|
||||||
@@ -430,6 +443,7 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
async showPlacementModal(value:any,sex:any,type:any,editOrUpload:any){
|
async showPlacementModal(value:any,sex:any,type:any,editOrUpload:any){
|
||||||
// this.sex = arr[0].value
|
// this.sex = arr[0].value
|
||||||
|
|
||||||
this.editOrUpload = editOrUpload
|
this.editOrUpload = editOrUpload
|
||||||
this.placementShow = true
|
this.placementShow = true
|
||||||
this.isShowMark = true
|
this.isShowMark = true
|
||||||
@@ -848,7 +862,7 @@ export default defineComponent({
|
|||||||
cropper.getCropData(async (value:any) => {
|
cropper.getCropData(async (value:any) => {
|
||||||
// 转换为File对象
|
// 转换为File对象
|
||||||
if(this.printObject.templateId || this.printObject.id){
|
if(this.printObject.templateId || this.printObject.id){
|
||||||
this.printObject.id = this.printObject.relationId
|
if(this.printObject.relationId)this.printObject.id = this.printObject.relationId
|
||||||
this.confrimSubmit()
|
this.confrimSubmit()
|
||||||
}else{
|
}else{
|
||||||
let file:any = base64toFile(value,this.printObject.file.name || '-');
|
let file:any = base64toFile(value,this.printObject.file.name || '-');
|
||||||
@@ -988,8 +1002,8 @@ export default defineComponent({
|
|||||||
level2Type:'',
|
level2Type:'',
|
||||||
checkMd5:1,
|
checkMd5:1,
|
||||||
sex:this.sex,
|
sex:this.sex,
|
||||||
|
ageGroup:this.$props.ageGroup,
|
||||||
modelType:modelType,
|
modelType:modelType,
|
||||||
ageGroup:this.store.state.Workspace.probjects.ageGroup,
|
|
||||||
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
|
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||||
}
|
}
|
||||||
this.isShowMark = true
|
this.isShowMark = true
|
||||||
@@ -1133,19 +1147,22 @@ export default defineComponent({
|
|||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
:deep(.ant-modal-body){
|
:deep(.ant-modal-centered){
|
||||||
padding: 4rem 5rem;
|
// position: absolute;
|
||||||
margin-bottom: 0;
|
.ant-modal-body{
|
||||||
.generalModel_btn {
|
padding: 4rem 5rem;
|
||||||
.generalModel_closeIcon{
|
margin-bottom: 0;
|
||||||
transform: translate(-100%, 100%);
|
.generalModel_btn {
|
||||||
svg{
|
.generalModel_closeIcon{
|
||||||
color: #000;
|
transform: translate(-100%, 100%);
|
||||||
|
svg{
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.close_icon{
|
.close_icon{
|
||||||
width: 3.6rem;
|
width: 3.6rem;
|
||||||
height: 3.6rem;
|
height: 3.6rem;
|
||||||
@@ -1219,7 +1236,7 @@ export default defineComponent({
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 18rem;
|
top: 18rem;
|
||||||
left: 30rem;
|
left: 18rem;
|
||||||
.select_block{
|
.select_block{
|
||||||
// background: #FFFFFF;
|
// background: #FFFFFF;
|
||||||
margin-bottom: 3rem;
|
margin-bottom: 3rem;
|
||||||
|
|||||||
@@ -57,7 +57,7 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
<habitSetStyle ref="habitSetStyle" @setWorkspaceStyle="setWorkspaceStyle"></habitSetStyle>
|
<habitSetStyle ref="habitSetStyle" @setWorkspaceStyle="setWorkspaceStyle"></habitSetStyle>
|
||||||
<edit ref="edit" @submit="getModel"></edit>
|
<edit ref="edit" :ageGroup="selectObject.ageGroup" @submit="getModel"></edit>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
|||||||
@@ -279,7 +279,8 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
> .selectModel{
|
> .selectModel{
|
||||||
width: 70rem;
|
width: 40%;
|
||||||
|
// width: 70rem;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background: #f7f8fa;
|
background: #f7f8fa;
|
||||||
|
|||||||
@@ -158,6 +158,7 @@ export default defineComponent({
|
|||||||
const selectImgItem = (item:any,)=>{
|
const selectImgItem = (item:any,)=>{
|
||||||
data.selectImg = item
|
data.selectImg = item
|
||||||
data.fileList.forEach((listItem:any)=>listItem.isChecked = false)
|
data.fileList.forEach((listItem:any)=>listItem.isChecked = false)
|
||||||
|
console.log(data.currentList)
|
||||||
data.currentList.forEach((listItem:any)=>listItem.isChecked = false)
|
data.currentList.forEach((listItem:any)=>listItem.isChecked = false)
|
||||||
item.isChecked = true
|
item.isChecked = true
|
||||||
if(item.url || item.imgUrl)data.selectImg.minioUrl = getMinioUrl(item.url || item.imgUrl)
|
if(item.url || item.imgUrl)data.selectImg.minioUrl = getMinioUrl(item.url || item.imgUrl)
|
||||||
|
|||||||
@@ -81,6 +81,7 @@ export default defineComponent({
|
|||||||
canvas:null as any,
|
canvas:null as any,
|
||||||
})
|
})
|
||||||
const open = (str:any,button:any)=>{
|
const open = (str:any,button:any)=>{
|
||||||
|
console.log(button)
|
||||||
nextTick(()=>{
|
nextTick(()=>{
|
||||||
if(dataDom[str]?.openSetData){
|
if(dataDom[str]?.openSetData){
|
||||||
dataDom[str].openSetData(button)
|
dataDom[str].openSetData(button)
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -277,7 +277,7 @@ export default defineComponent({
|
|||||||
let bor = false
|
let bor = false
|
||||||
if(this.newPicName && this.selectCode == 'History'){//多选修改名字
|
if(this.newPicName && this.selectCode == 'History'){//多选修改名字
|
||||||
|
|
||||||
await Https.axiosPost(Https.httpUrls.updateUserGroupName, data).then(
|
await Https.axiosPost(Https.httpUrls.saveOrUpdate, data).then(
|
||||||
(rv: any) => {
|
(rv: any) => {
|
||||||
bor = true
|
bor = true
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -479,19 +479,18 @@ export default defineComponent({
|
|||||||
operationType: "LOGIN",
|
operationType: "LOGIN",
|
||||||
ip: "",
|
ip: "",
|
||||||
};
|
};
|
||||||
this.clearTimer()
|
|
||||||
this.time = 60;
|
|
||||||
this.emailStap = 2;
|
|
||||||
this.emailCode = ["", "", "", "", "", ""];
|
|
||||||
this.createTimer();
|
|
||||||
if (this.loginTime) {
|
if (this.loginTime) {
|
||||||
this.loginTime = false;
|
this.loginTime = false;
|
||||||
Https.axiosPost(Https.httpUrls.enterpriseLogin, data)
|
Https.axiosPost(Https.httpUrls.enterpriseLogin, data)
|
||||||
.then((rv: any) => {
|
.then((rv: any) => {
|
||||||
if (rv) {
|
if (rv) {
|
||||||
|
this.clearTimer()
|
||||||
|
this.time = 60;
|
||||||
|
this.emailStap = 2;
|
||||||
|
this.emailCode = ["", "", "", "", "", ""];
|
||||||
|
this.createTimer();
|
||||||
this.userId = rv.userId;
|
this.userId = rv.userId;
|
||||||
this.loginType = "email";
|
this.loginType = "email";
|
||||||
this.createTimer();
|
|
||||||
localStorage.setItem("loginEmail", this.email);
|
localStorage.setItem("loginEmail", this.email);
|
||||||
localStorage.setItem("loginPassword", this.password);
|
localStorage.setItem("loginPassword", this.password);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -460,11 +460,7 @@ export default defineComponent({
|
|||||||
ip: "",
|
ip: "",
|
||||||
};
|
};
|
||||||
// this.loginType = 'email'
|
// this.loginType = 'email'
|
||||||
this.clearTimer()
|
|
||||||
this.time = 60;
|
|
||||||
this.emailStap = 2;
|
|
||||||
this.emailCode = ["", "", "", "", "", ""];
|
|
||||||
this.createTimer();
|
|
||||||
if (this.loginTime) {
|
if (this.loginTime) {
|
||||||
this.loginTime = false;
|
this.loginTime = false;
|
||||||
Https.axiosPost(Https.httpUrls.preLogin, data)
|
Https.axiosPost(Https.httpUrls.preLogin, data)
|
||||||
@@ -473,6 +469,12 @@ export default defineComponent({
|
|||||||
// this.loginType = 'email'
|
// this.loginType = 'email'
|
||||||
// }
|
// }
|
||||||
if (rv) {
|
if (rv) {
|
||||||
|
this.clearTimer()
|
||||||
|
this.time = 60;
|
||||||
|
this.emailStap = 2;
|
||||||
|
this.emailCode = ["", "", "", "", "", ""];
|
||||||
|
this.createTimer();
|
||||||
|
|
||||||
this.userId = rv.userId;
|
this.userId = rv.userId;
|
||||||
this.loginType = "email";
|
this.loginType = "email";
|
||||||
|
|
||||||
|
|||||||
@@ -478,16 +478,17 @@ export default defineComponent({
|
|||||||
operationType: "LOGIN",
|
operationType: "LOGIN",
|
||||||
ip: "",
|
ip: "",
|
||||||
};
|
};
|
||||||
this.clearTimer()
|
|
||||||
this.time = 60;
|
|
||||||
this.emailStap = 2;
|
|
||||||
this.emailCode = ["", "", "", "", "", ""];
|
|
||||||
this.createTimer();
|
|
||||||
if (this.loginTime) {
|
if (this.loginTime) {
|
||||||
this.loginTime = false;
|
this.loginTime = false;
|
||||||
Https.axiosPost(Https.httpUrls.schoolLogin, data)
|
Https.axiosPost(Https.httpUrls.schoolLogin, data)
|
||||||
.then((rv: any) => {
|
.then((rv: any) => {
|
||||||
if (rv) {
|
if (rv) {
|
||||||
|
this.clearTimer()
|
||||||
|
this.time = 60;
|
||||||
|
this.emailStap = 2;
|
||||||
|
this.emailCode = ["", "", "", "", "", ""];
|
||||||
|
this.createTimer();
|
||||||
this.userId = rv.userId;
|
this.userId = rv.userId;
|
||||||
this.loginType = "email";
|
this.loginType = "email";
|
||||||
localStorage.setItem("loginEmail", this.email);
|
localStorage.setItem("loginEmail", this.email);
|
||||||
|
|||||||
531
src/component/home/chat/index.vue
Normal file
531
src/component/home/chat/index.vue
Normal file
@@ -0,0 +1,531 @@
|
|||||||
|
<template>
|
||||||
|
<div class="chat" :class="{active:!openChat}" @click.stop="">
|
||||||
|
<div v-show="!openChat" class="left" @click="()=>{openChat = !openChat;isChattingRecords=false}">
|
||||||
|
<i class="fi fi-br-angle-small-down"></i>
|
||||||
|
</div>
|
||||||
|
<div class="chatBox">
|
||||||
|
<div class="chattingRecords" v-show="chatList.length > 0 && isChattingRecords">
|
||||||
|
<div class="itemBox" ref="chatBox">
|
||||||
|
<div class="item" v-for="item in chatList" :class="{user:item.role == 'user'}">
|
||||||
|
<div class="textBox">
|
||||||
|
<div class="icon">ICON</div>
|
||||||
|
<div class="text" v-show="item.content.message || item.content.img || item.content.color">
|
||||||
|
<span>{{item.content.message}}</span>
|
||||||
|
<div class="fileBox">
|
||||||
|
<div v-if="item?.fileList?.length > 0" class="item" v-for="fileItem in item.fileList">
|
||||||
|
<div>{{fileItem.name}}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="imgBox">
|
||||||
|
<img v-if="item.content?.img?.length > 0" v-for="imgItem in item.content?.img" :src="imgItem.minioUrl" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="colorBox">
|
||||||
|
<div v-if="item.content?.color?.length > 0" class="item" v-for="colorItem in item.content?.color">
|
||||||
|
<div class="color" :style="{'background-color':`rgba(${colorItem.rgb.replace(/\s+/g, ',')})`}"></div>
|
||||||
|
<div class="text">{{ colorItem.rgb.replace(/\s+/g, ',') }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<i class="fi fi-br-loading" v-if="!item.content.message && !item.content.img && !item.content.color"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="content" @click="openChattingRecords">
|
||||||
|
<textarea ref="textarea" @input="inputText($event)" @keydown.enter.prevent="sendChat" placeholder="Write your message"></textarea>
|
||||||
|
<div class="btn">
|
||||||
|
<div class="uploadBox">
|
||||||
|
<div class="filList">
|
||||||
|
<div class="item" v-for="item,index in filList">
|
||||||
|
<div>{{item.name}}</div>
|
||||||
|
<span class="icon iconfont icon-shanchu" @click="deleteFile(item,index)"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<i class="fi fi-br-upload">
|
||||||
|
<input type="file" @change="handleFileUpload($event)">
|
||||||
|
</i>
|
||||||
|
</div>
|
||||||
|
<div class="sendBox">
|
||||||
|
<div class="enableThinking" :class="{active:enableThinking}" @click="()=>enableThinking = !enableThinking">Deep Thinking</div>
|
||||||
|
<div class="maxNum">{{ chatContent.length }}/10000</div>
|
||||||
|
<div class="send" :class="{active:chatContent.length>0}" @click="sendChat">
|
||||||
|
<i class="fi fi-ss-paper-plane-top"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-show="openChat" class="right" @click="()=>{openChat = !openChat;isChattingRecords=false}">
|
||||||
|
<i class="fi fi-br-angle-small-down"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,computed,ref,inject,nextTick,createVNode,toRefs, reactive, watch} from 'vue'
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { Modal,message,Upload,CascaderProps } from 'ant-design-vue';
|
||||||
|
import { useI18n } from 'vue-i18n'
|
||||||
|
import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
},
|
||||||
|
emits:['chatChange'],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
const store = useStore();
|
||||||
|
const data = reactive({
|
||||||
|
chatContent:'',
|
||||||
|
openChat:true,
|
||||||
|
chatList:[
|
||||||
|
] as any,
|
||||||
|
isChattingRecords:false,
|
||||||
|
selectObject:computed(()=>store.state.Workspace.probjects) as any,//选择的项目
|
||||||
|
filList:[] as any,
|
||||||
|
setIsShowMark:inject('setIsShowMark') as any,
|
||||||
|
isFinish:true,
|
||||||
|
enableThinking:false,//深度思考
|
||||||
|
})
|
||||||
|
const dataDom = reactive({
|
||||||
|
textarea:null as any,
|
||||||
|
chatBox:null as any,
|
||||||
|
})
|
||||||
|
watch(()=>data.selectObject.id,(newValue,oldValue)=>{
|
||||||
|
if(newValue){
|
||||||
|
getChatHistory(newValue)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const inputText = (e:any)=>{
|
||||||
|
if(e.target.value.length <= 1000){
|
||||||
|
data.chatContent = e.target.value
|
||||||
|
}else{
|
||||||
|
e.target.value = data.chatContent
|
||||||
|
}
|
||||||
|
e.target.style.height = `${e.target.scrollHeight}px`;
|
||||||
|
}
|
||||||
|
const sendChat = ()=>{
|
||||||
|
if(!data.isFinish)return
|
||||||
|
if(!data.chatContent)return
|
||||||
|
let fileList = JSON.parse(JSON.stringify(data.filList))
|
||||||
|
let fileUrl = (fileList.filter((item:any)=>item.type == 'file').length > 0) ? fileList.filter((item:any)=>item.type == 'file')[0].minioPath : ''
|
||||||
|
let imageUrlList = (fileList.filter((item:any)=>item.type == 'image').length > 0)? fileList.filter((item:any)=>item.type == 'image').map((item:any)=>item.minioPath).join(',') : ''
|
||||||
|
data.chatList.push({content:{message:data.chatContent},role:'user',fileList:fileList})
|
||||||
|
data.chatList.push({content:{message:''},role:'system'})
|
||||||
|
const eventSource = new EventSource(`${process.env.VUE_APP_BASE_URL}${Https.httpUrls.llmStream}?token=${getCookie('token')}&prompt=${data.chatContent}&projectId=${data.selectObject.id}&fileUrl=${fileUrl}&imageUrlList=${imageUrlList}&enableThinking=${data.enableThinking}`);
|
||||||
|
data.chatContent = ''
|
||||||
|
dataDom.textarea.value = ''
|
||||||
|
data.filList = []
|
||||||
|
eventSource.onmessage = function(event) {
|
||||||
|
data.isFinish = false
|
||||||
|
// console.log('收到数据:', JSON.parse(event.data));
|
||||||
|
// if(event.data.status == 'DESIGN_SIGNAL'){
|
||||||
|
// emit('chatChange',{type:'design'})
|
||||||
|
// }else if(event.data.status == 'RUNNING'){
|
||||||
|
// data.chatList[data.chatList.length-1].content.message+=JSON.parse(event.data).content
|
||||||
|
// }
|
||||||
|
const container = dataDom.chatBox;
|
||||||
|
container.scrollTop = container.scrollHeight;
|
||||||
|
if(JSON.parse(event.data).status == "[RUNNING]"){
|
||||||
|
data.chatList[data.chatList.length-1].content.message+=JSON.parse(event.data).content
|
||||||
|
}else{
|
||||||
|
if(JSON.parse(event.data).status == "[DESIGN_SIGNAL]"){
|
||||||
|
|
||||||
|
}else if(JSON.parse(event.data).status == "[COLOR_SIGNAL]"){
|
||||||
|
data.chatList.push({content:{message:''},role:'system'})
|
||||||
|
data.chatList[data.chatList.length-1].content.color = JSON.parse(JSON.parse(event.data).tools_data).receiveCollectionElementList
|
||||||
|
data.chatList.push({content:{message:''},role:'system'})
|
||||||
|
}else{
|
||||||
|
data.chatList.push({content:{message:''},role:'system'})
|
||||||
|
data.chatList[data.chatList.length-1].content.img = JSON.parse(JSON.parse(event.data).tools_data).receiveCollectionElementList
|
||||||
|
data.chatList.push({content:{message:''},role:'system'})
|
||||||
|
}
|
||||||
|
console.log(data.chatList[data.chatList.length-1].content)
|
||||||
|
emit('chatChange',{type:JSON.parse(event.data).status})
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
eventSource.onerror = function(error) {
|
||||||
|
console.log(error,EventSource.CLOSED,eventSource.readyState)
|
||||||
|
if (eventSource.readyState === EventSource.CLOSED) {
|
||||||
|
data.chatList[data.chatList.length-1].content.message='服务器繁忙,请稍后再试。'
|
||||||
|
|
||||||
|
} else {
|
||||||
|
eventSource.close()
|
||||||
|
data.isFinish = true
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
const getChatHistory = (objectId:number)=>{
|
||||||
|
let value = {
|
||||||
|
projectId:objectId,
|
||||||
|
page:1,
|
||||||
|
pageSize:100,
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.getChatHistory,value).then((rv)=>{
|
||||||
|
if(rv){
|
||||||
|
rv.content.forEach((item:any,index:number) => {
|
||||||
|
if(rv.content[rv.content.length - index -1].role == 'system'){
|
||||||
|
let text = rv.content[rv.content.length - index -1].content
|
||||||
|
if(rv.content[rv.content.length - index -1].isImage == 1){
|
||||||
|
rv.content[rv.content.length - index -1].content={
|
||||||
|
img : JSON.parse(rv.content[rv.content.length - index -1].content)
|
||||||
|
}
|
||||||
|
}else if(rv.content[rv.content.length - index -1].isImage==2){
|
||||||
|
rv.content[rv.content.length - index -1].content={
|
||||||
|
color : JSON.parse(rv.content[rv.content.length - index -1].content)
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
rv.content[rv.content.length - index -1].content = {
|
||||||
|
message:text
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
let content = JSON.parse(rv.content[rv.content.length - index -1].content)
|
||||||
|
content.fileList = []
|
||||||
|
if(content.file || content.image){
|
||||||
|
let getName = (url:any)=>{
|
||||||
|
let minio = url.splice('?')[0]
|
||||||
|
return minio.splice('/')[minio.splice('/').length-1]
|
||||||
|
}
|
||||||
|
if(content.file){
|
||||||
|
content.file.forEach((item:any)=>{
|
||||||
|
content.fileList.push({name:getName(item),type:'file',url:item})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if(content.image){
|
||||||
|
content.image.forEach((item:any)=>{
|
||||||
|
content.fileList.push({name:getName(item),type:'image',url:item})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
rv.content[rv.content.length - index -1].content = content
|
||||||
|
}
|
||||||
|
data.chatList.push(rv.content[rv.content.length - index -1])
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const openChattingRecords = ()=>{
|
||||||
|
data.isChattingRecords = true
|
||||||
|
let setRecords = ()=>{
|
||||||
|
data.isChattingRecords = false
|
||||||
|
document.removeEventListener('click',setRecords)
|
||||||
|
}
|
||||||
|
document.addEventListener('click',setRecords)
|
||||||
|
}
|
||||||
|
const handleFileUpload = (event:any)=>{
|
||||||
|
if (event.target.files[0].size > 5 * 1024 * 1024) { // 5MB
|
||||||
|
message.info('The file size cannot exceed 5MB.');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
let type = event.target.files[0].type.startsWith('image/')
|
||||||
|
if(type){
|
||||||
|
if(data.filList.filter((item:any)=>item.type == 'image').length >= 5){
|
||||||
|
message.info('You can only upload five pictures.');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(data.filList.filter((item:any)=>item.type == 'file').length >= 1){
|
||||||
|
message.info('You can only upload one file.');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
data.setIsShowMark(true)
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', event.target.files[0]);
|
||||||
|
let config:any = {
|
||||||
|
headers:{'Content-Type':'multipart/form-data','Accept':'*/*' },
|
||||||
|
params:formData,
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.llmUploadFile,formData,config)
|
||||||
|
.then((rv: any) => {
|
||||||
|
let obj = {
|
||||||
|
name:event.target.files[0].name,
|
||||||
|
type:type?'image':'file',
|
||||||
|
minioPath:rv[0],
|
||||||
|
url:rv[1],
|
||||||
|
}
|
||||||
|
data.filList.push(obj)
|
||||||
|
// data.filList.unshift(rv)
|
||||||
|
data.setIsShowMark(false)
|
||||||
|
}
|
||||||
|
).catch(rv=>{
|
||||||
|
data.setIsShowMark(false)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const deleteFile = (item:any,index:number)=>{
|
||||||
|
data.filList.splice(index,1)
|
||||||
|
}
|
||||||
|
return{
|
||||||
|
...toRefs(dataDom),
|
||||||
|
...toRefs(data),
|
||||||
|
inputText,
|
||||||
|
sendChat,
|
||||||
|
openChattingRecords,
|
||||||
|
handleFileUpload,
|
||||||
|
deleteFile,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.chat{
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
z-index: 999;
|
||||||
|
bottom: 3.2rem;
|
||||||
|
top: auto;
|
||||||
|
width: 50%;
|
||||||
|
transition: all .3s;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
display: flex;
|
||||||
|
border: 1px solid #e5e5e5;
|
||||||
|
background: #fff;
|
||||||
|
overflow: hidden;
|
||||||
|
&.active{
|
||||||
|
left: auto;
|
||||||
|
right: 0;
|
||||||
|
transform: translateX(calc(100% - 3rem));
|
||||||
|
}
|
||||||
|
> .chatBox{
|
||||||
|
flex: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
> .chattingRecords{
|
||||||
|
> .itemBox{
|
||||||
|
width: 100%;
|
||||||
|
padding: 1.6rem 2rem;
|
||||||
|
max-height: 75vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
> .item{
|
||||||
|
display: flex;
|
||||||
|
line-height: 1.75;
|
||||||
|
// width: min-content;
|
||||||
|
&.user{
|
||||||
|
> .textBox{
|
||||||
|
margin-left: auto;
|
||||||
|
background: #f5f5f5;
|
||||||
|
max-width: 60%;
|
||||||
|
> .text{
|
||||||
|
> .fileBox{
|
||||||
|
> .item{
|
||||||
|
height: 3rem;
|
||||||
|
padding: .5rem 1rem;
|
||||||
|
background: #efeff1;
|
||||||
|
border-radius: .5rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
display: flex;
|
||||||
|
> div{
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
max-width: 10rem;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .icon{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .textBox{
|
||||||
|
display: flex;
|
||||||
|
padding: 1.2rem 2rem;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
|
||||||
|
> .text{
|
||||||
|
// display: inline-block;
|
||||||
|
// width: min-content;
|
||||||
|
max-width: 100%;
|
||||||
|
width: 100%;
|
||||||
|
// width: min-content;
|
||||||
|
// word-wrap: break-word;
|
||||||
|
> .imgBox{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
img{
|
||||||
|
width: 10rem;
|
||||||
|
height: 10rem;
|
||||||
|
cursor: pointer;
|
||||||
|
margin: .5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .colorBox{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
>.item{
|
||||||
|
margin: .5rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
overflow: hidden;
|
||||||
|
border: 1px solid;
|
||||||
|
width: 10rem;
|
||||||
|
> .color{
|
||||||
|
width: 10rem;
|
||||||
|
height: 7rem;
|
||||||
|
}
|
||||||
|
> .text{
|
||||||
|
font-size: 1.4rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .icon{
|
||||||
|
margin-right: 1.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
> i{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
animation: loading 1s linear infinite;
|
||||||
|
@keyframes loading {
|
||||||
|
from{
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
to{
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .content{
|
||||||
|
background: #f5f5f5;
|
||||||
|
// border-radius: 2.4rem;
|
||||||
|
> textarea{
|
||||||
|
padding: 1.6rem 2rem 0;
|
||||||
|
background: #f5f5f5;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 7.2rem;
|
||||||
|
// border-radius: 2.4rem;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 2rem;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
resize: none;
|
||||||
|
border: none;
|
||||||
|
overflow-y: hidden;
|
||||||
|
}
|
||||||
|
> .btn{
|
||||||
|
padding: 0 1.2rem 1.2rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
> .uploadBox{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
> .filList{
|
||||||
|
display: flex;
|
||||||
|
> .item{
|
||||||
|
height: 3rem;
|
||||||
|
padding: .5rem 1rem;
|
||||||
|
background: #efeff1;
|
||||||
|
border-radius: .5rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
display: flex;
|
||||||
|
> div{
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
max-width: 10rem;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
> span{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
i{
|
||||||
|
font-size: 2rem;
|
||||||
|
display: flex;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
> input{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
&::-webkit-file-upload-button {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .sendBox{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
> .enableThinking{
|
||||||
|
width: 10rem;
|
||||||
|
padding: .2rem .4rem;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
border: 1px solid #000;
|
||||||
|
border-radius: .4rem;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 1rem;
|
||||||
|
&.active{
|
||||||
|
background: #000;
|
||||||
|
color: #fff;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .maxNum{
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin-right: .8rem;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
> .send{
|
||||||
|
opacity: .5;
|
||||||
|
cursor: no-drop;
|
||||||
|
&.active{
|
||||||
|
opacity: 1;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .right,> .left{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
width: 3rem;
|
||||||
|
justify-content: center;
|
||||||
|
> i{
|
||||||
|
display: flex;
|
||||||
|
font-size: 2rem;
|
||||||
|
transition: all .3s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .right{
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
> i{
|
||||||
|
transform: rotate(270deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .left{
|
||||||
|
border-right: 1px solid #e5e5e5;
|
||||||
|
> i{
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
0
src/component/home/design/childModel.vue
Normal file
0
src/component/home/design/childModel.vue
Normal file
1725
src/component/home/design/index.vue
Normal file
1725
src/component/home/design/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
394
src/component/home/index.vue
Normal file
394
src/component/home/index.vue
Normal file
@@ -0,0 +1,394 @@
|
|||||||
|
<template>
|
||||||
|
<div class="homeBox">
|
||||||
|
<div class="mark_loading" v-show="isShowMark">
|
||||||
|
<a-spin size="large" />
|
||||||
|
</div>
|
||||||
|
<div class="show">
|
||||||
|
<router-view v-if="(openType && openType != 'history' && !routeQuery.id) || $route.path != '/home'" @setTask="setTask">
|
||||||
|
</router-view>
|
||||||
|
<div v-else-if="routeQuery.id || openType == 'history'" class="function">
|
||||||
|
<design ref="design"></design>
|
||||||
|
</div>
|
||||||
|
<div v-else class="function">
|
||||||
|
<newPorject ref="newPorject"></newPorject>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<chat ref="chat" @chatChange="chatChange" v-if="openType"></chat>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,computed,ref,watch,nextTick,provide,toRefs, reactive} from 'vue'
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { useI18n } from 'vue-i18n'
|
||||||
|
import { useRouter,useRoute } from 'vue-router'
|
||||||
|
import design from "./design/index.vue"
|
||||||
|
import newPorject from "./newProject/index.vue"
|
||||||
|
import chat from "./chat/index.vue"
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
design,newPorject,chat
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
},
|
||||||
|
emits:['setTask'],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
const store = useStore();
|
||||||
|
const route = useRoute()
|
||||||
|
const data = reactive({
|
||||||
|
openType:'',
|
||||||
|
isShowMark:false,
|
||||||
|
routeQuery:{} as any,
|
||||||
|
selectObject:computed(()=>store.state.Workspace.probjects) as any,//选择的项目
|
||||||
|
|
||||||
|
})
|
||||||
|
const setIsShowMark = (boolean:boolean)=>{
|
||||||
|
data.isShowMark = boolean
|
||||||
|
}
|
||||||
|
provide('setIsShowMark',setIsShowMark)
|
||||||
|
const dataDom = reactive({
|
||||||
|
design:null as any,
|
||||||
|
newPorject:null as any,
|
||||||
|
})
|
||||||
|
watch(() => route.query,
|
||||||
|
(query, oldQuery) => {
|
||||||
|
console.log(route)
|
||||||
|
data.routeQuery = query
|
||||||
|
const key = Object.keys(query)?.[0]
|
||||||
|
if(key){
|
||||||
|
data.openType = Object.keys(query)[0]
|
||||||
|
}else{
|
||||||
|
data.openType = ''
|
||||||
|
}
|
||||||
|
nextTick(()=>{
|
||||||
|
if(query.id || query.history){
|
||||||
|
data.isShowMark = true
|
||||||
|
if(query.type == 'Works'){
|
||||||
|
getWorks(query.id || query.history)
|
||||||
|
}else{
|
||||||
|
getHistory(query.id || query.history)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
{ immediate: true } // 立即触发一次以处理初始参数
|
||||||
|
);
|
||||||
|
const createData = ()=>{
|
||||||
|
store.commit("clearAllData");
|
||||||
|
store.commit("clearAllCollection");
|
||||||
|
store.commit("setAllBoardDataChoose",{});
|
||||||
|
store.commit("clearShowSketchboard",{});
|
||||||
|
store.commit("clearAllCollection");
|
||||||
|
}
|
||||||
|
const getWorks = (id:any)=>{
|
||||||
|
let value:any = {
|
||||||
|
"accountId": 0,
|
||||||
|
"collectionId": 0,
|
||||||
|
"coverId": 0,
|
||||||
|
"createDate": "",
|
||||||
|
id,
|
||||||
|
"isDeleted": 0,
|
||||||
|
"portfolioDes": "",
|
||||||
|
"portfolioName": "",
|
||||||
|
"portfolioType": "",
|
||||||
|
"status": 0,
|
||||||
|
"updateDate": "",
|
||||||
|
"userLikeGroupId":''
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.setPorfolioChoose, value).then(
|
||||||
|
(rv: any) => {
|
||||||
|
setProjectData(rv)
|
||||||
|
}
|
||||||
|
).catch((res)=>{
|
||||||
|
data.isShowMark = false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
const getHistory = (id:any)=>{
|
||||||
|
let value = {
|
||||||
|
id,
|
||||||
|
}
|
||||||
|
if(!id)return
|
||||||
|
createData()
|
||||||
|
Https.axiosPost(Https.httpUrls.selectHistoryProject,value).then((rv: any) => {
|
||||||
|
setProjectData(rv)
|
||||||
|
}).catch((res)=>{
|
||||||
|
data.isShowMark = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const setTask = (item:any)=>{
|
||||||
|
emit('setTask',item)
|
||||||
|
}
|
||||||
|
const setProjectData = (rv:any)=>{
|
||||||
|
let storeData = {
|
||||||
|
name:rv.name,
|
||||||
|
id:rv.id,
|
||||||
|
type:rv.type,
|
||||||
|
httpType:rv.process,//项目类型
|
||||||
|
ageGroup:rv.workspaceVO.ageGroup,
|
||||||
|
style:rv.workspaceVO.style,
|
||||||
|
styleId:rv.workspaceVO.styleId,
|
||||||
|
styleName:rv.workspaceVO.styleName,
|
||||||
|
sex:rv.workspaceVO.sex,
|
||||||
|
systemDesignerPercentage:rv.workspaceVO.systemDesignerPercentage,
|
||||||
|
position:{
|
||||||
|
label:rv.workspaceVO.positionEnum.value,
|
||||||
|
value:rv.workspaceVO.positionEnum.name
|
||||||
|
},
|
||||||
|
positionList:[],
|
||||||
|
publishData:{
|
||||||
|
id:rv.portfolioDTO.id?rv.portfolioDTO.id:'',
|
||||||
|
portfolioDes:rv.portfolioDTO.portfolioDes?rv.portfolioDTO.portfolioDes:'',
|
||||||
|
portfolioName:rv.portfolioDTO.portfolioName?rv.portfolioDTO.portfolioName:'',
|
||||||
|
tagsDTO:rv.portfolioDTO.tagsDTO?rv.portfolioDTO.tagsDTO:[],
|
||||||
|
},
|
||||||
|
model:{}
|
||||||
|
}
|
||||||
|
let model:any = {}
|
||||||
|
let position = []
|
||||||
|
if(storeData.sex == "Female"){
|
||||||
|
model = {
|
||||||
|
id:rv.workspaceVO.mannequinFemaleId,
|
||||||
|
type:rv.workspaceVO.mannequinFemaleType,
|
||||||
|
url:rv.workspaceVO.femalePresignedUrl,
|
||||||
|
}
|
||||||
|
position = store.state.UserHabit.FemalePosition
|
||||||
|
}else{
|
||||||
|
model = {
|
||||||
|
id:rv.workspaceVO.mannequinMaleId,
|
||||||
|
type:rv.workspaceVO.mannequinMaleType,
|
||||||
|
url:rv.workspaceVO.malePresignedUrl,
|
||||||
|
}
|
||||||
|
position = store.state.UserHabit.MalePosition
|
||||||
|
}
|
||||||
|
storeData.model = model
|
||||||
|
data.selectObject.positionList = position
|
||||||
|
storeData.positionList = position
|
||||||
|
store.commit('setProbject',storeData)
|
||||||
|
// let list:any = projectList
|
||||||
|
// store.commit('setProjectList',list[type.value])
|
||||||
|
// nextTick(()=>{
|
||||||
|
// dataDom.workflow.isUpdataPorject = true
|
||||||
|
// })
|
||||||
|
|
||||||
|
getCollection()
|
||||||
|
}
|
||||||
|
// const setitemData = (arr:any)=>{
|
||||||
|
// return new Promise((resolve,reject)=>{
|
||||||
|
// nextTick(()=>{
|
||||||
|
// arr.forEach((rv:any)=>{
|
||||||
|
// if(arr.indexOf(rv) > -1 || !dataDom[rv])return
|
||||||
|
// dataDom[rv].openSetData()
|
||||||
|
// })
|
||||||
|
// resolve('')
|
||||||
|
// })
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
const getCollection = ()=>{
|
||||||
|
let value:any = {
|
||||||
|
"id":data.selectObject.id,
|
||||||
|
"moduleList":["moodBoard", "printBoard", "colorBoard", "sketchBoard",'design','toProduct','relight','poseTransfer','mannequin']
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.getModuleContent,value).then(async (rv)=>{
|
||||||
|
historyChooseData(rv)//设置历史数据
|
||||||
|
let allBoardData = ['sketchBoard','moodBoard','printBoard','colorBoard']
|
||||||
|
// let allBoardData = ['sketchBoard','moodBoard','printBoard','colorBoard','toProduct','relight','poseTransfer','mannequin']
|
||||||
|
let canvasData = ['canvas']
|
||||||
|
for (let index = 0; index < canvasData.length; index++) {
|
||||||
|
const item = canvasData[index];
|
||||||
|
await getCanvasData(item)
|
||||||
|
}
|
||||||
|
// await setitemData(allBoardData)
|
||||||
|
//还有一个canvas
|
||||||
|
if(rv.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
|
||||||
|
allBoardData.forEach((item)=>{
|
||||||
|
let value = {
|
||||||
|
type:item,
|
||||||
|
objectName:data.selectObject.type,
|
||||||
|
}
|
||||||
|
let arr = ['sketchBoard','moodBoard','printBoard','colorBoard']
|
||||||
|
if(arr.indexOf(item) != -1){
|
||||||
|
// store.dispatch('setAllBoardData',value)
|
||||||
|
}else{
|
||||||
|
store.dispatch('setModularData',value)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
data.isShowMark = false
|
||||||
|
dataDom.design.openSetData()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const getCanvasData = (str:any)=>{
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let value = {
|
||||||
|
module:str,
|
||||||
|
projectId:data.selectObject.id,
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.exportSearch, value)
|
||||||
|
.then((rv) => {
|
||||||
|
store.commit("setCanvasData", {type:str,file:rv});
|
||||||
|
resolve('')
|
||||||
|
})
|
||||||
|
.catch((rv) => {
|
||||||
|
resolve(null)
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const historyChooseData = (dataValue:any)=>{
|
||||||
|
let collectionData = {
|
||||||
|
disposeMoodboard: dataValue.moodBoard?.moodTemplateId?[{
|
||||||
|
id:dataValue.moodBoard.moodTemplateId,
|
||||||
|
imgUrl:dataValue.moodBoard.moodTemplateUrl,
|
||||||
|
resData:{
|
||||||
|
name:dataValue.moodBoard.moodTemplateName,
|
||||||
|
}
|
||||||
|
}]:[],
|
||||||
|
moodboardPosition:dataValue.moodBoard?.moodboardPosition?JSON.parse(dataValue.moodBoard.moodboardPosition):{},
|
||||||
|
moodboardFiles: dealViewChooseData(
|
||||||
|
dataValue.moodBoard?.moodBoards,"Moodboard"
|
||||||
|
),
|
||||||
|
printboardFiles: dealViewChooseData(
|
||||||
|
dataValue.printBoard,"Printboard"
|
||||||
|
),
|
||||||
|
generatePrintFiles: [],
|
||||||
|
colorBoards: dealViewChooseColor(
|
||||||
|
dataValue.colorBoard
|
||||||
|
),
|
||||||
|
sketchboardFiles: dealViewChooseData(
|
||||||
|
dataValue.sketchBoard,"Sketchboard"
|
||||||
|
),
|
||||||
|
};
|
||||||
|
if(dataValue.moodBoard?.moodTemplateId)store.commit("setMoodTemplateId", dataValue.moodBoard.moodTemplateId);
|
||||||
|
store.commit("setAllBoardDataChoose", collectionData);
|
||||||
|
store.commit("setShowSketchboard", dataValue.sketchBoards);
|
||||||
|
let likeDesignCollectionList:any = []
|
||||||
|
if(dataValue.design?.userLikeDetails){
|
||||||
|
dataValue.design?.userLikeDetails.map(
|
||||||
|
(v: any) => {
|
||||||
|
let dataValue = {
|
||||||
|
...v,
|
||||||
|
groupDetailId: v.id,
|
||||||
|
designItemUrl: v.designOutfitUrl,
|
||||||
|
designItemId: v.designItemId,
|
||||||
|
};
|
||||||
|
return dataValue;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
if(dataValue.design.userLikeDetails)store.commit("setLikeDesignCollectionList",dataValue.design.userLikeDetails);
|
||||||
|
store.commit("setUserGroupId", dataValue.design.userGroupId);
|
||||||
|
if(dataValue.toProduct){
|
||||||
|
let value = {
|
||||||
|
list: dataValue.toProduct,
|
||||||
|
str:'add',
|
||||||
|
index:-1,
|
||||||
|
}
|
||||||
|
store.commit("setToProductImage", value);
|
||||||
|
}
|
||||||
|
if(dataValue.relight){
|
||||||
|
let value = {
|
||||||
|
list: dataValue.relight,
|
||||||
|
str:'add',
|
||||||
|
index:-1,
|
||||||
|
}
|
||||||
|
store.commit("setRelightList", value);
|
||||||
|
}
|
||||||
|
if(dataValue.poseTransfer){
|
||||||
|
let value = {
|
||||||
|
list: dataValue.poseTransfer,
|
||||||
|
str:'add',
|
||||||
|
index:-1,
|
||||||
|
}
|
||||||
|
store.commit("setPoseTransfer", value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//统一处理选择组的渲染数据
|
||||||
|
const dealViewChooseData = (dataValue: any,str:string)=> {
|
||||||
|
if (!dataValue) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
let filesList = dataValue.map((v: any) => {
|
||||||
|
let newData: any = {
|
||||||
|
imgUrl: v.url?v.url:v.designOutfitUrl,
|
||||||
|
id: v.id,
|
||||||
|
status: "done",
|
||||||
|
resData: v,
|
||||||
|
type_:{
|
||||||
|
type1:'material',
|
||||||
|
type2:v.level1Type
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (v.level1Type === "Sketchboard") {
|
||||||
|
newData.pin = v.isPin;
|
||||||
|
newData.categoryValue = v.level2Type;
|
||||||
|
newData.level2Type = v.level2Type;
|
||||||
|
}
|
||||||
|
if (v.level1Type === "Printboard") {
|
||||||
|
newData.pin = v.isPin;
|
||||||
|
newData.level2Type = v.level2Type;
|
||||||
|
newData.categoryValue = v.level2Type;
|
||||||
|
}
|
||||||
|
return newData;
|
||||||
|
});
|
||||||
|
return filesList;
|
||||||
|
}
|
||||||
|
//统一处理选择组的渲染数据
|
||||||
|
const dealViewChooseColor = (dataValue: any)=>{
|
||||||
|
let colorList = dataValue.map((v: any) => {
|
||||||
|
let rgbValue = v.rgbValue.split(" ");
|
||||||
|
let newData: any = {
|
||||||
|
id: v.id,
|
||||||
|
name: v.name,
|
||||||
|
tcx: v.tcx || "",
|
||||||
|
rgbValue: {
|
||||||
|
r: rgbValue[0],
|
||||||
|
g: rgbValue[1],
|
||||||
|
b: rgbValue[2],
|
||||||
|
a: 1,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
if(v.gradient){
|
||||||
|
newData.gradient = v.gradient;
|
||||||
|
}else{
|
||||||
|
delete newData.gradient;
|
||||||
|
}
|
||||||
|
return newData;
|
||||||
|
});
|
||||||
|
return colorList;
|
||||||
|
}
|
||||||
|
const chatChange = (value:any)=>{
|
||||||
|
console.log(value)
|
||||||
|
if(value.type == '[DESIGN_SIGNAL]' && dataDom.design){
|
||||||
|
dataDom.design.designNewCollection()
|
||||||
|
}else{
|
||||||
|
getCollection()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return{
|
||||||
|
...toRefs(dataDom),
|
||||||
|
...toRefs(data),
|
||||||
|
setTask,
|
||||||
|
chatChange,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.homeBox{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
> .show{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
> .function{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
415
src/component/home/newProject/index.vue
Normal file
415
src/component/home/newProject/index.vue
Normal file
@@ -0,0 +1,415 @@
|
|||||||
|
<template>
|
||||||
|
<div class="newProject">
|
||||||
|
<div class="contentBox">
|
||||||
|
<div class="content">
|
||||||
|
<div class="title">How can I help you today?</div>
|
||||||
|
<div class="selectFlow">
|
||||||
|
<div class="select">
|
||||||
|
<div class="item" @click="setFlow(item)" :class="{active:item.title == selectFlow.title}" v-for="item in flowList">{{ item.title }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="describe">
|
||||||
|
<p v-for="item in selectFlow.describe">{{ item }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="chatOrSetting">
|
||||||
|
<div class="select">
|
||||||
|
<div class="item" @click="setChatOrSetting('chat')" :class="{active:chatOrSetting == 'chat'}">Chat</div>
|
||||||
|
<div class="item" @click="setChatOrSetting('setting')" :class="{active:chatOrSetting == 'setting'}">Setting</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="chatBox" v-show="chatOrSetting == 'chat'">
|
||||||
|
<textarea ref="textarea" @input="inputText($event)" placeholder="Write your message"></textarea>
|
||||||
|
<div class="btn">
|
||||||
|
<div class="uploadBox">
|
||||||
|
<div class="filList">
|
||||||
|
<div class="item" v-for="item,index in filList">
|
||||||
|
<div>{{item.name}}</div>
|
||||||
|
<span class="icon iconfont icon-shanchu" @click="deleteFile(item,index)"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<i class="fi fi-br-upload">
|
||||||
|
<input type="file" @change="handleFileUpload($event)">
|
||||||
|
</i>
|
||||||
|
</div>
|
||||||
|
<div class="sendBox">
|
||||||
|
<div class="maxNum">{{ chatContent.length }}/10000</div>
|
||||||
|
<div class="send" @click="sendChat">
|
||||||
|
<i class="fi fi-ss-paper-plane-top"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-show="chatOrSetting != 'chat'">
|
||||||
|
<workspace @setProject="setProject" :httpWorkflowType="selectFlow.value"></workspace>
|
||||||
|
</div>
|
||||||
|
<div class="hint" v-show="chatOrSetting == 'chat'">
|
||||||
|
<div class="item" v-for="item in hintList" @click="addChatContent(item)">{{ item }}</div>
|
||||||
|
</div>
|
||||||
|
{{ text }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mark_loading" v-show="loadingShow">
|
||||||
|
<a-spin size="large" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { Modal,message,Upload,CascaderProps } from 'ant-design-vue';
|
||||||
|
import { useI18n } from 'vue-i18n'
|
||||||
|
import {getCookie,clonAllCookie} from '@/tool/cookie'
|
||||||
|
import router from '@/router';
|
||||||
|
import workspace from './workspace.vue'
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
workspace,
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
},
|
||||||
|
emits:[],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
const store = useStore();
|
||||||
|
const data = reactive({
|
||||||
|
flowList:[
|
||||||
|
{
|
||||||
|
title:'Series Design',
|
||||||
|
value:'SERIES_DESIGN',
|
||||||
|
describe:[
|
||||||
|
'12312312',
|
||||||
|
'12312312',
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:'Single Design',
|
||||||
|
value:'SINGLE_DESIGN',
|
||||||
|
describe:[
|
||||||
|
'12312312',
|
||||||
|
'12312312',
|
||||||
|
]
|
||||||
|
},
|
||||||
|
],
|
||||||
|
selectFlow:{
|
||||||
|
title:'Series Design',
|
||||||
|
value:'SERIES_DESIGN',
|
||||||
|
describe:[
|
||||||
|
'12312312',
|
||||||
|
'12312312',
|
||||||
|
]
|
||||||
|
},
|
||||||
|
chatContent:'',
|
||||||
|
hintList:[
|
||||||
|
'描述1',
|
||||||
|
'描述3',
|
||||||
|
'描述2',
|
||||||
|
],
|
||||||
|
uploadFile:null as any,
|
||||||
|
loadingShow:false,
|
||||||
|
text:'',
|
||||||
|
filList:[] as any,
|
||||||
|
textarea:null as any,
|
||||||
|
chatOrSetting:'chat',
|
||||||
|
})
|
||||||
|
const dataDom = reactive({
|
||||||
|
})
|
||||||
|
const setFlow = (item:any)=>{
|
||||||
|
data.selectFlow = item
|
||||||
|
}
|
||||||
|
|
||||||
|
const inputText = (e:any)=>{
|
||||||
|
if(e.target.value.length <= 1000){
|
||||||
|
data.chatContent = e.target.value
|
||||||
|
}else{
|
||||||
|
e.target.value = data.chatContent
|
||||||
|
}
|
||||||
|
e.target.style.height = `${e.target.scrollHeight}px`;
|
||||||
|
}
|
||||||
|
const addChatContent = (item:any)=>{
|
||||||
|
if((data.textarea.value += item.length) > 10000)return
|
||||||
|
data.chatContent += item
|
||||||
|
data.textarea.value += item
|
||||||
|
}
|
||||||
|
const sendChat = ()=>{
|
||||||
|
if(!data.chatContent)return
|
||||||
|
data.loadingShow = true
|
||||||
|
Https.axiosGet(Https.httpUrls.chatCreateProject, {params:{prompt:data.chatContent,process:data.selectFlow.value}}).then((rv)=>{
|
||||||
|
if(rv){
|
||||||
|
data.loadingShow = false
|
||||||
|
router.push(`home?history=${rv}`)
|
||||||
|
}
|
||||||
|
}).catch(()=>{
|
||||||
|
data.loadingShow = false
|
||||||
|
})
|
||||||
|
|
||||||
|
// const eventSource = new EventSource(`http://192.168.1.3:5567${Https.httpUrls.chatCreateProject}?prompt=${data.chatContent}&token=${getCookie('token')}`,{
|
||||||
|
// });
|
||||||
|
// eventSource.onmessage = function(event) {
|
||||||
|
|
||||||
|
// data.text+=event.data
|
||||||
|
// console.log('收到数据:', event.data);
|
||||||
|
// };
|
||||||
|
// eventSource.onerror = function(error) {
|
||||||
|
// console.log(EventSource.CLOSED,EventSource)
|
||||||
|
// console.log(eventSource.readyState )
|
||||||
|
// if (eventSource.readyState === EventSource.CLOSED) {
|
||||||
|
// console.log('连接已正常关闭');
|
||||||
|
// } else {
|
||||||
|
// console.error('错误:', error);
|
||||||
|
// // 处理错误重连逻辑
|
||||||
|
// }
|
||||||
|
// eventSource.close()
|
||||||
|
// };
|
||||||
|
}
|
||||||
|
const handleFileUpload = (event:any)=>{
|
||||||
|
if (event.target.files[0].size > 5 * 1024 * 1024) { // 5MB
|
||||||
|
message.info('The file size cannot exceed 5MB.');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
let type = event.target.files[0].type.startsWith('image/')
|
||||||
|
if(type){
|
||||||
|
if(data.filList.filter((item:any)=>item.type == 'image').length >= 5){
|
||||||
|
message.info('You can only upload five pictures.');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(data.filList.filter((item:any)=>item.type == 'file').length >= 1){
|
||||||
|
message.info('You can only upload one file.');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
data.loadingShow = true
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append('file', event.target.files[0]);
|
||||||
|
let config:any = {
|
||||||
|
headers:{'Content-Type':'multipart/form-data','Accept':'*/*' },
|
||||||
|
params:formData,
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.llmUploadFile,formData,config)
|
||||||
|
.then((rv: any) => {
|
||||||
|
rv.name = event.target.files[0].name
|
||||||
|
rv.type = type?'image':'file'
|
||||||
|
data.filList.push(rv)
|
||||||
|
data.loadingShow = false
|
||||||
|
}
|
||||||
|
).catch(rv=>{
|
||||||
|
data.loadingShow = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const deleteFile = (item:any,index:number)=>{
|
||||||
|
data.filList.splice(index,1)
|
||||||
|
}
|
||||||
|
const setChatOrSetting = (str:any)=>{
|
||||||
|
data.chatOrSetting = str
|
||||||
|
}
|
||||||
|
const setProject = (item:any)=>{
|
||||||
|
router.push(`home?history=${item.id}`)
|
||||||
|
}
|
||||||
|
return{
|
||||||
|
...toRefs(dataDom),
|
||||||
|
...toRefs(data),
|
||||||
|
setFlow,
|
||||||
|
inputText,
|
||||||
|
addChatContent,
|
||||||
|
sendChat,
|
||||||
|
handleFileUpload,
|
||||||
|
deleteFile,
|
||||||
|
setChatOrSetting,
|
||||||
|
setProject,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.newProject{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
> .contentBox{
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100% - 7.8rem);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
> .content{
|
||||||
|
// background: red;
|
||||||
|
width: 88rem;
|
||||||
|
// height: 100%;
|
||||||
|
> .title{
|
||||||
|
font-size: 2rem;
|
||||||
|
font-weight: 600;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
> .selectFlow{
|
||||||
|
margin-top: 4.8rem;
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
border: 1px solid #0000001a;
|
||||||
|
padding: 1.2rem;
|
||||||
|
> .select{
|
||||||
|
border: 1px solid #0000001a;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
display: flex;
|
||||||
|
padding: .2rem;
|
||||||
|
border-radius: 2rem;
|
||||||
|
> div{
|
||||||
|
white-space: nowrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
border-radius: 2.2rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
padding: .6rem .8rem;
|
||||||
|
min-width: 25%;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #71717a;
|
||||||
|
cursor: pointer;
|
||||||
|
&.active{
|
||||||
|
background: #efeff1;
|
||||||
|
color: #3f3f46;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .describe{
|
||||||
|
margin-top: 1.6rem;
|
||||||
|
margin-left: .8rem;
|
||||||
|
> p{
|
||||||
|
margin: 0;
|
||||||
|
color: #71717a;
|
||||||
|
font-weight: 400;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .chatOrSetting{
|
||||||
|
margin-top: 2.4rem;
|
||||||
|
width: min-content;
|
||||||
|
margin-left: auto;
|
||||||
|
> .select{
|
||||||
|
border: 1px solid #0000001a;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
display: flex;
|
||||||
|
padding: .2rem;
|
||||||
|
border-radius: 2rem;
|
||||||
|
> div{
|
||||||
|
white-space: nowrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
border-radius: 2.2rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
padding: .6rem .8rem;
|
||||||
|
min-width: 10rem;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #71717a;
|
||||||
|
cursor: pointer;
|
||||||
|
&.active{
|
||||||
|
background: #efeff1;
|
||||||
|
color: #3f3f46;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .chatBox{
|
||||||
|
margin-top: .4rem;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
position: relative;
|
||||||
|
background: #f5f5f5;
|
||||||
|
> textarea{
|
||||||
|
padding: 1.6rem 2rem 0;
|
||||||
|
background: #f5f5f5;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 7.2rem;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 2rem;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
resize: none;
|
||||||
|
border: none;
|
||||||
|
overflow-y: hidden;
|
||||||
|
}
|
||||||
|
> .btn{
|
||||||
|
padding: 0 1.2rem 1.2rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
> .uploadBox{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
> .filList{
|
||||||
|
display: flex;
|
||||||
|
> .item{
|
||||||
|
height: 3rem;
|
||||||
|
padding: .5rem 1rem;
|
||||||
|
background: #efeff1;
|
||||||
|
border-radius: .5rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
line-height: 2rem;
|
||||||
|
display: flex;
|
||||||
|
> div{
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
max-width: 10rem;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
> span{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
i{
|
||||||
|
font-size: 2rem;
|
||||||
|
display: flex;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
> input{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
&::-webkit-file-upload-button {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .sendBox{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
> .maxNum{
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin-right: .8rem;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .hint{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 2.4rem;
|
||||||
|
> div{
|
||||||
|
background: #efeff1;
|
||||||
|
width: 25rem;
|
||||||
|
height: 4.8rem;
|
||||||
|
margin-right: 1.2rem;
|
||||||
|
border-radius: 1.6rem;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 1.2rem;
|
||||||
|
&:hover{
|
||||||
|
background: #f5f5f5;
|
||||||
|
}
|
||||||
|
:first-child{
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
376
src/component/home/newProject/workspace.vue
Normal file
376
src/component/home/newProject/workspace.vue
Normal file
@@ -0,0 +1,376 @@
|
|||||||
|
<template>
|
||||||
|
<div class="workspace">
|
||||||
|
<div class="workspaceBox">
|
||||||
|
<div class="projectName marginBottom" v-if="show.title">
|
||||||
|
<div class="text">Project name: <span style="color: red;">*</span></div>
|
||||||
|
<div class="input">
|
||||||
|
<input type="text" v-model="selectObject.name">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="gender marginBottom" v-if="show.age">
|
||||||
|
<div class="text">Role</div>
|
||||||
|
<div class="radio">
|
||||||
|
<label>
|
||||||
|
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Adult">
|
||||||
|
<span>Adult</span>
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Child">
|
||||||
|
<span>Child</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="gender marginBottom">
|
||||||
|
<div class="text">Gender:</div>
|
||||||
|
<div class="radio">
|
||||||
|
<label>
|
||||||
|
<input type="radio" name="gender" v-model="selectObject.sex" value="Female">
|
||||||
|
<span>Female</span>
|
||||||
|
</label>
|
||||||
|
<label>
|
||||||
|
<input type="radio" name="gender" v-model="selectObject.sex" value="Male">
|
||||||
|
<span>Male</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="style marginBottom" v-if="show.style">
|
||||||
|
<div class="text">Style:</div>
|
||||||
|
<div class="text">{{ selectObject?.styleName?selectObject?.styleName:'All' }}</div>
|
||||||
|
<div class="gallery_btn" style="line-height: 5rem;" @click="setStyle">{{ $t('Habit.Select') }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="systemDesigner marginBottom" v-if="show.systemDesigner">
|
||||||
|
<a-slider class="system_silder"
|
||||||
|
v-model:value="selectObject.systemDesignerPercentage"
|
||||||
|
:tip-formatter="formatter"
|
||||||
|
:tooltipVisible="false"
|
||||||
|
>
|
||||||
|
</a-slider>
|
||||||
|
<div class="text">
|
||||||
|
<div class="left">
|
||||||
|
{{ $t('Habit.System') }}<span>({{systemDesigner.designer}}%)</span>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
|
||||||
|
{{ $t('Habit.Designer') }}<span>({{systemDesigner.system}}%)</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="position marginBottom" style="display: flex; align-items: center;justify-content: space-between;" v-show="show.position">
|
||||||
|
<div class="text">
|
||||||
|
Category:
|
||||||
|
</div>
|
||||||
|
<generalMenu style="width:80%" :selectWidth="'100%'" :dataList="selectObject.positionList" @setprintModel="setprintModel" :item="selectObject.position"></generalMenu>
|
||||||
|
</div>
|
||||||
|
<div class="complete">
|
||||||
|
<div class="gallery_btn" @click="complete">Complete</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<habitSetStyle ref="habitSetStyle" @setWorkspaceStyle="setWorkspaceStyle" :mannequinStyle="mannequinStyle"></habitSetStyle>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,computed,watch,nextTick,onBeforeUnmount,toRefs, reactive, onMounted, inject} from 'vue'
|
||||||
|
// import setDesignItem from '@/component/Detail/setDesignItem2.vue'
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { useI18n } from 'vue-i18n'
|
||||||
|
// import workspace from './model/workspace.vue'
|
||||||
|
import router from '@/router';
|
||||||
|
import habitSetStyle from "@/component/Detail/habitSetStyle.vue";
|
||||||
|
import generalMenu from "@/component/HomePage/generalMenu.vue";
|
||||||
|
import { Https } from '@/tool/https';
|
||||||
|
import { position } from 'html2canvas/dist/types/css/property-descriptors/position';
|
||||||
|
import { id } from 'element-plus/es/locale';
|
||||||
|
import { message } from 'ant-design-vue';
|
||||||
|
import {projectList} from '@/tool/listData'
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
habitSetStyle,generalMenu
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
workflowType:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
httpWorkflowType:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
workflowTitle:{
|
||||||
|
type:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
firstTime:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
emits:['setProject'],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
const { t } = useI18n();
|
||||||
|
const store = useStore();
|
||||||
|
const data = reactive({
|
||||||
|
selectObject_:computed(()=>store.state.Workspace.probjects),//选择的项目
|
||||||
|
selectObject:{} as any,
|
||||||
|
femalePosition:computed(()=>store.state.UserHabit.FemalePosition),//男性衣服位置
|
||||||
|
malePosition:computed(()=>store.state.UserHabit.MalePosition),//女性衣服位置
|
||||||
|
mannequinStyle:computed(()=>store.state.UserHabit.mannequinStyle),//
|
||||||
|
show:{
|
||||||
|
title:true,
|
||||||
|
gender:true,
|
||||||
|
style:true,
|
||||||
|
age:true,
|
||||||
|
systemDesigner:true,
|
||||||
|
position:true,
|
||||||
|
},
|
||||||
|
systemDesigner:{
|
||||||
|
system:0,
|
||||||
|
designer:0,
|
||||||
|
},
|
||||||
|
setIsShowMark:inject('setIsShowMark') as any,
|
||||||
|
})
|
||||||
|
watch(()=>data.selectObject_,(newVal)=>{
|
||||||
|
data.selectObject = JSON.parse(JSON.stringify(newVal))
|
||||||
|
})
|
||||||
|
const dataDom = reactive({
|
||||||
|
habitSetStyle:null as any,
|
||||||
|
})
|
||||||
|
const setStyle = ()=>{
|
||||||
|
dataDom.habitSetStyle.init(data.selectObject);
|
||||||
|
}
|
||||||
|
const setWorkspaceStyle = (value:any)=>{
|
||||||
|
data.selectObject.styleName = value.name
|
||||||
|
data.selectObject.style = value.value
|
||||||
|
data.selectObject.styleId = value.id
|
||||||
|
// store.commit('setProbject',data)
|
||||||
|
}
|
||||||
|
const setprintModel = (value:any)=>{
|
||||||
|
data.selectObject.position = value
|
||||||
|
}
|
||||||
|
const formatter = (value: number)=>{
|
||||||
|
data.systemDesigner.system = 100 - value
|
||||||
|
data.systemDesigner.designer = value
|
||||||
|
let num = Math.abs((value-50)*2)
|
||||||
|
return `${num}%`;
|
||||||
|
}
|
||||||
|
const complete = ()=>{
|
||||||
|
if(!data.selectObject.name){
|
||||||
|
message.info(t('PrintboardUpload.jsContent7'))
|
||||||
|
return
|
||||||
|
}
|
||||||
|
let value = {
|
||||||
|
name:data.selectObject.name,
|
||||||
|
process:props.httpWorkflowType,
|
||||||
|
styleId:data.show.style?data.selectObject.styleId:null,
|
||||||
|
id:data.selectObject.id,
|
||||||
|
workspace:{
|
||||||
|
sex:data.selectObject.sex,
|
||||||
|
// sex:data.show.gender?data.selectObject.sex:null,
|
||||||
|
systemDesignerPercentage:data.show.systemDesigner?data.selectObject.systemDesignerPercentage:null,
|
||||||
|
position:data.show.position?data.selectObject.position.value:'Overall',
|
||||||
|
ageGroup:data.show.style?data.selectObject.ageGroup:null,
|
||||||
|
// position:data.selectObject,
|
||||||
|
} as any,
|
||||||
|
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.saveOrUpdate,value).then((rv)=>{
|
||||||
|
if(rv){
|
||||||
|
data.selectObject.id = rv.id
|
||||||
|
let model:any = {}
|
||||||
|
let position = []
|
||||||
|
if(data.selectObject.sex == "Female"){
|
||||||
|
// if(rv.workspaceVO.sex == "Female"){
|
||||||
|
model = {
|
||||||
|
id:rv.workspaceVO.mannequinFemaleId,
|
||||||
|
type:rv.workspaceVO.mannequinFemaleType,
|
||||||
|
url:rv.workspaceVO.femalePresignedUrl,
|
||||||
|
}
|
||||||
|
position = store.state.UserHabit.FemalePosition
|
||||||
|
}else{
|
||||||
|
model = {
|
||||||
|
id:rv.workspaceVO.mannequinMaleId,
|
||||||
|
type:rv.workspaceVO.mannequinMaleType,
|
||||||
|
url:rv.workspaceVO.malePresignedUrl,
|
||||||
|
}
|
||||||
|
position = store.state.UserHabit.MalePosition
|
||||||
|
}
|
||||||
|
// model.url = rv.workspaceVO.malePresignedUrl
|
||||||
|
data.selectObject.model = model
|
||||||
|
data.selectObject.positionList = position
|
||||||
|
// store.commit('setProbject',data.selectObject)
|
||||||
|
emit('setProject',data.selectObject)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const openSetData = ()=>{
|
||||||
|
|
||||||
|
}
|
||||||
|
onMounted(()=>{
|
||||||
|
data.selectObject = JSON.parse(JSON.stringify(data.selectObject_))
|
||||||
|
// data.show.gender = (props.workflowType == 'seriesDesign' || props.workflowType == 'singleProductDesign' || props.workflowType == 'printingDesign3D')
|
||||||
|
// data.show.style = (props.workflowType == 'seriesDesign' || props.workflowType == 'singleProductDesign')
|
||||||
|
// data.show.age = (props.workflowType == 'seriesDesign' || props.workflowType == 'singleProductDesign' || props.workflowType == 'sketchDesign')
|
||||||
|
// data.show.systemDesigner = (props.workflowType == 'seriesDesign' || props.workflowType == 'singleProductDesign')
|
||||||
|
// data.show.position = (props.workflowType == 'singleProductDesign')
|
||||||
|
|
||||||
|
if(!data.mannequinStyle){
|
||||||
|
data.setIsShowMark(true)
|
||||||
|
Https.axiosPost(Https.httpUrls.getStyleList, {}).then(
|
||||||
|
(rv) => {
|
||||||
|
data.setIsShowMark(false)
|
||||||
|
rv.forEach((item:any) => {
|
||||||
|
let name = item.value
|
||||||
|
item.value = item.name
|
||||||
|
item.name = name
|
||||||
|
});
|
||||||
|
data.selectObject.style = rv[0].value
|
||||||
|
data.selectObject.styleName = rv[0].name
|
||||||
|
data.selectObject.styleId = rv[0].id
|
||||||
|
store.commit('setMannequinStyle',rv)
|
||||||
|
}
|
||||||
|
).catch(res=>{
|
||||||
|
data.setIsShowMark(false)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
watch(()=>data.selectObject.sex,(newVal)=>{
|
||||||
|
if(newVal == 'Male'){
|
||||||
|
data.selectObject.positionList = data.malePosition
|
||||||
|
}else{
|
||||||
|
data.selectObject.positionList = data.femalePosition
|
||||||
|
}
|
||||||
|
data.selectObject.position = data.selectObject.positionList[0]
|
||||||
|
})
|
||||||
|
return{
|
||||||
|
projectList,
|
||||||
|
...toRefs(dataDom),
|
||||||
|
...toRefs(data),
|
||||||
|
setStyle,
|
||||||
|
setWorkspaceStyle,
|
||||||
|
setprintModel,
|
||||||
|
formatter,
|
||||||
|
complete,
|
||||||
|
openSetData,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.workspace{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
border: 1px solid #0000001a;
|
||||||
|
padding: 1.2rem;
|
||||||
|
border-radius: 2.4rem;
|
||||||
|
> .workspaceBox{
|
||||||
|
width: 55rem;
|
||||||
|
padding: 0 5rem;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
// display: flex;
|
||||||
|
// flex-wrap: wrap;
|
||||||
|
// justify-content: space-between;
|
||||||
|
// align-content: flex-start;
|
||||||
|
> .marginBottom{
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
// width: 44%;
|
||||||
|
}
|
||||||
|
> .title{
|
||||||
|
font-size: 2.7rem;
|
||||||
|
> span{
|
||||||
|
color: #999999;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .projectName{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
> .text{
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
> .input{
|
||||||
|
// flex: 1;
|
||||||
|
width: 80%;
|
||||||
|
padding: 1rem 2rem;
|
||||||
|
// padding: 2rem 2.7rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
border-radius: 1.6rem;
|
||||||
|
border: 2px solid #D0D0D0;
|
||||||
|
display: flex;
|
||||||
|
> input{
|
||||||
|
flex: 1;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
> i{
|
||||||
|
display: flex;
|
||||||
|
color: #999999;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 2.4rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .gender{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
> .text{
|
||||||
|
width: 8rem;
|
||||||
|
}
|
||||||
|
> .radio{
|
||||||
|
display: flex;
|
||||||
|
margin-left: 4.5rem;
|
||||||
|
> label{
|
||||||
|
display: flex;
|
||||||
|
margin-right: 4rem;
|
||||||
|
>input{
|
||||||
|
margin-right: 1.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .style{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
> .systemDesigner{
|
||||||
|
> .text{
|
||||||
|
margin-right: 1rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .position{
|
||||||
|
> .text{
|
||||||
|
margin-right: 1rem;
|
||||||
|
}
|
||||||
|
:deep(.generalMenu_printModel){
|
||||||
|
position: relative;
|
||||||
|
margin: 0;
|
||||||
|
> div,> ul{
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 1.6rem;
|
||||||
|
border: 2px solid #D0D0D0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
> .complete{
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
> div{
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -58,15 +58,43 @@
|
|||||||
</div> -->
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
<div class="password_input_block">
|
<div class="password_input_block">
|
||||||
|
<div v-show="passwordConditionShow" class="conditionShow">
|
||||||
|
<div class="item">
|
||||||
|
<div class="icon">
|
||||||
|
<i v-show="!passwordCondition.length" class="fi fi-br-cross-small"></i>
|
||||||
|
<i v-show="passwordCondition.length" class="fi fi-br-check"></i>
|
||||||
|
</div>
|
||||||
|
<div class="text">At least 8 characters long</div>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<div class="icon">
|
||||||
|
<i v-show="!passwordCondition.special" class="fi fi-br-cross-small"></i>
|
||||||
|
<i v-show="passwordCondition.special" class="fi fi-br-check"></i>
|
||||||
|
</div>
|
||||||
|
<div class="text">Must contain special characters</div>
|
||||||
|
</div>
|
||||||
|
<div class="item">
|
||||||
|
<div class="icon">
|
||||||
|
<i v-show="!passwordCondition.group" class="fi fi-br-cross-small"></i>
|
||||||
|
<i v-show="passwordCondition.group" class="fi fi-br-check"></i>
|
||||||
|
</div>
|
||||||
|
<div class="text">Mix of uppercase, lowercase and numbers</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<input
|
<input
|
||||||
class="login_form_input"
|
class="login_form_input"
|
||||||
|
:class="{active:Object.values(passwordCondition).filter(value => value === true).length<3}"
|
||||||
:type="passwordType"
|
:type="passwordType"
|
||||||
placeholder="Enter your password"
|
placeholder="Enter your password"
|
||||||
v-model="password"
|
v-model="password"
|
||||||
@keydown.enter="submitPerLogin()"
|
@keydown.enter="submitPerLogin()"
|
||||||
|
@input="passwordInput"
|
||||||
|
@focus="()=>passwordConditionShow = true"
|
||||||
|
@blur="()=>passwordConditionShow = false"
|
||||||
/>
|
/>
|
||||||
<div class="icon iconfont icon-yanjing_yincang_o password_show_icon" @click="changePasswordType()"></div>
|
<div class="icon iconfont icon-yanjing_yincang_o password_show_icon" @click="changePasswordType()"></div>
|
||||||
</div>
|
</div>
|
||||||
|
<span style="font-weight: 400;opacity: .7;">You must satisfy ALL password conditions to register.</span>
|
||||||
<div class="login_form_title marign_top30">Email</div>
|
<div class="login_form_title marign_top30">Email</div>
|
||||||
<input
|
<input
|
||||||
class="login_form_input"
|
class="login_form_input"
|
||||||
@@ -271,7 +299,13 @@ export default defineComponent({
|
|||||||
let register = reactive({
|
let register = reactive({
|
||||||
registerModel:false,
|
registerModel:false,
|
||||||
registerModelMask:true,
|
registerModelMask:true,
|
||||||
pageWidth:'50%'
|
pageWidth:'50%',
|
||||||
|
passwordConditionShow:false,
|
||||||
|
passwordCondition:{
|
||||||
|
length:false,
|
||||||
|
special:false,
|
||||||
|
group:false,
|
||||||
|
},
|
||||||
})
|
})
|
||||||
return{
|
return{
|
||||||
store,
|
store,
|
||||||
@@ -406,7 +440,15 @@ export default defineComponent({
|
|||||||
checkRobot() {
|
checkRobot() {
|
||||||
this.isCheckRobot = !this.isCheckRobot;
|
this.isCheckRobot = !this.isCheckRobot;
|
||||||
},
|
},
|
||||||
|
passwordInput(){
|
||||||
|
this.isPassword(this.password)
|
||||||
|
},
|
||||||
|
isPassword(password:any){
|
||||||
|
this.passwordCondition.length = /.{8,}/.test(password)
|
||||||
|
this.passwordCondition.special = /[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/.test(password)
|
||||||
|
this.passwordCondition.group = /[a-z]/.test(password) && /[A-Z]/.test(password) && /\d/.test(password)
|
||||||
|
return Object.values(this.passwordCondition).filter(value => value === true).length;
|
||||||
|
},
|
||||||
//提交账号密码预先登录
|
//提交账号密码预先登录
|
||||||
submitPerLogin() {
|
submitPerLogin() {
|
||||||
|
|
||||||
@@ -415,6 +457,9 @@ export default defineComponent({
|
|||||||
if(this.emailStap>=2){
|
if(this.emailStap>=2){
|
||||||
return;
|
return;
|
||||||
}else{
|
}else{
|
||||||
|
if (/aida/i.test(this.username)) {
|
||||||
|
message.info('The name cannot contain "AiDA" or any combination of its uppercase and lowercase forms.');
|
||||||
|
}
|
||||||
if (!this.username || !this.password) {
|
if (!this.username || !this.password) {
|
||||||
message.info("Please enter your account number or password");
|
message.info("Please enter your account number or password");
|
||||||
return;
|
return;
|
||||||
@@ -434,6 +479,11 @@ export default defineComponent({
|
|||||||
message.info("Agree to all terms, privacy fees and policies");
|
message.info("Agree to all terms, privacy fees and policies");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if(this.isPassword(this.password) < 3){
|
||||||
|
message.info("You must satisfy ALL password conditions to register.");
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
let data = {
|
let data = {
|
||||||
userPassword: md5(this.password + "abc"),
|
userPassword: md5(this.password + "abc"),
|
||||||
userName: this.username,
|
userName: this.username,
|
||||||
@@ -670,7 +720,7 @@ export default defineComponent({
|
|||||||
// width: 80%;
|
// width: 80%;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
// box-shadow: -0.3rem 2rem 5.9rem 0px rgba(200,200,200,0.3);
|
// box-shadow: -0.3rem 2rem 5.9rem 0px rgba(200,200,200,0.3);
|
||||||
padding: 3rem 6rem 6.5rem;
|
padding: 2rem 6rem 2rem;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@@ -766,6 +816,35 @@ export default defineComponent({
|
|||||||
top:1.7rem;
|
top:1.7rem;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
> .conditionShow{
|
||||||
|
bottom: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
left: auto;
|
||||||
|
transform: translateY(-5rem);
|
||||||
|
background: #404040;
|
||||||
|
color: #FFF;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 2rem;
|
||||||
|
> .item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: .5rem;
|
||||||
|
&:last-child{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
> .icon{
|
||||||
|
margin-right: 1rem;
|
||||||
|
i{
|
||||||
|
display: flex;
|
||||||
|
// &.fi-br-cross-small{
|
||||||
|
// color: red;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.login_form_input {
|
.login_form_input {
|
||||||
@@ -786,6 +865,9 @@ export default defineComponent({
|
|||||||
&::placeholder {
|
&::placeholder {
|
||||||
color: #a5b0c2;
|
color: #a5b0c2;
|
||||||
}
|
}
|
||||||
|
&.active{
|
||||||
|
border: 0.1rem solid red;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -296,8 +296,8 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
|
|
||||||
let url = imgUrl.split('?')[0]
|
let url = imgUrl.split('?')[0]
|
||||||
var match = url.match(/:(\d+)\/(.*)/);
|
var match = url.match(/^(?:https?:\/\/[^\/]+)\/(.*)/);
|
||||||
minioUrl = match[2]
|
minioUrl = match[1]
|
||||||
// let id =
|
// let id =
|
||||||
let proportion = img.height / img.width; //计算图形宽高比例
|
let proportion = img.height / img.width; //计算图形宽高比例
|
||||||
let scaleWH = imgWidth[key] / img.width; //计算放到画布上缩小倍率
|
let scaleWH = imgWidth[key] / img.width; //计算放到画布上缩小倍率
|
||||||
|
|||||||
@@ -1,77 +0,0 @@
|
|||||||
<template>
|
|
||||||
<nav class="homeMain_nav_content">
|
|
||||||
<!-- <router-link :class="['nav_item',$route.name === 'homePage' ? 'select_nav' : '', ]" :to="`/home/homePage`">
|
|
||||||
{{$t('Header.HOME')}}
|
|
||||||
</router-link>
|
|
||||||
<router-link :class="['nav_item',$route.name === 'library' ? 'select_nav' : '', ]" :to="`/home/library`">
|
|
||||||
{{$t('Header.LIBRARY')}}
|
|
||||||
</router-link>
|
|
||||||
<router-link :class="['nav_item',$route.name === 'history' ? 'select_nav' : '', ]" :to="`/home/history`">
|
|
||||||
{{$t('Header.HISTORY')}}
|
|
||||||
</router-link>
|
|
||||||
<router-link :class="['nav_item',$route.name === 'works' ? 'select_nav' : '', ]" :to="`/home/works`">
|
|
||||||
{{$t('Header.WORKS')}}
|
|
||||||
</router-link> -->
|
|
||||||
<router-link v-for="item in routerList" :class="['nav_item',item.routerName.indexOf($route.name) > -1 ? 'select_nav' : '', ]" :to="item.router">{{ item.name }}</router-link>
|
|
||||||
</nav>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script >
|
|
||||||
import { defineProps } from 'vue';
|
|
||||||
import { defineComponent, createVNode, ref, computed } from "vue";
|
|
||||||
export default defineComponent({
|
|
||||||
components: {
|
|
||||||
},
|
|
||||||
props:['routerList'],
|
|
||||||
setup(props,{emit}){
|
|
||||||
return {
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.homeMain_nav_content {
|
|
||||||
display: flex;
|
|
||||||
// margin-left: 28.9rem;
|
|
||||||
// margin-left: 46.2rem;
|
|
||||||
align-items: center;
|
|
||||||
height: 7rem;
|
|
||||||
justify-content: center;
|
|
||||||
.nav_item {
|
|
||||||
padding: 1.1rem 1rem;
|
|
||||||
border-bottom: 0.1rem solid transparent;
|
|
||||||
margin-right: 3.4rem;
|
|
||||||
font-size: 1.6rem;
|
|
||||||
line-height: 1.3rem;
|
|
||||||
// color: #333333;
|
|
||||||
color: #000;
|
|
||||||
cursor: pointer;
|
|
||||||
font-weight: 900;
|
|
||||||
position: relative;
|
|
||||||
&.nav_item:last-child{
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
&.nav_item::before {
|
|
||||||
position: absolute;
|
|
||||||
content: "";
|
|
||||||
display: block;
|
|
||||||
background: #000;
|
|
||||||
height: .3rem;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
bottom: .3rem;
|
|
||||||
width: 0px;
|
|
||||||
transition: 0.3s all;
|
|
||||||
}
|
|
||||||
&.select_nav {
|
|
||||||
color: #000;
|
|
||||||
transform: scale(1.15);
|
|
||||||
}
|
|
||||||
&.select_nav::before {
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
109
src/component/toolsPage/index.vue
Normal file
109
src/component/toolsPage/index.vue
Normal file
@@ -0,0 +1,109 @@
|
|||||||
|
<template>
|
||||||
|
<div class="tools">
|
||||||
|
<div class="modelBox">
|
||||||
|
<toProduct ref="toProduct"
|
||||||
|
:productimgMenu="{value:'ToProductImage',label:$t('ProductImg.ProductImage')}"
|
||||||
|
class="toProduct"
|
||||||
|
:isState="openType =='toProduct'"
|
||||||
|
v-if="openType == 'toProduct'"
|
||||||
|
></toProduct>
|
||||||
|
<toProduct ref="relight"
|
||||||
|
:productimgMenu="{value:'Relight',label:$t('ProductImg.Relight')}"
|
||||||
|
class="relight"
|
||||||
|
:isState="openType =='relight'"
|
||||||
|
v-if="openType == 'relight'"
|
||||||
|
></toProduct>
|
||||||
|
<poseTransfer v-if="openType == 'poseTransfer'" ref="poseTransfer"></poseTransfer>
|
||||||
|
<deReconstruction v-if="openType == 'deReconstruction'" ref="deReconstruction"></deReconstruction>
|
||||||
|
<patternMaking3D v-if="openType == 'patternMaking3D'" ref="patternMaking3D"></patternMaking3D>
|
||||||
|
<canvasUpload v-if="openType == 'canvasUpload'" ref="canvasUpload"></canvasUpload>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,computed,ref,provide,nextTick,watch,toRefs, reactive} from 'vue'
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { useI18n } from 'vue-i18n'
|
||||||
|
import { useRoute } from 'vue-router';
|
||||||
|
import MoodboardUpload from '@/component/HomePage/index/model/collection/MoodboardUpload.vue';
|
||||||
|
import PrintboardUpload from '@/component/HomePage/index/model/collection/PrintboardUpload.vue';
|
||||||
|
import ColorboardUpload from '@/component/HomePage/index/model/collection/ColorboardUpload.vue';
|
||||||
|
import toProduct from '@/component/HomePage/index/model/toProduct/index.vue';
|
||||||
|
import poseTransfer from '@/component/HomePage/index/model/poseTransfer/index.vue';
|
||||||
|
import deReconstruction from '@/component/HomePage/index/model/deReconstruction/index.vue';
|
||||||
|
import patternMaking3D from '@/component/HomePage/index/model/patternMaking3D/index.vue';
|
||||||
|
import canvasUpload from "@/component/Canvas/index.vue";
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
toProduct,poseTransfer,deReconstruction,patternMaking3D,canvasUpload
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
},
|
||||||
|
emits:[],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
const store = useStore();
|
||||||
|
const route = useRoute();
|
||||||
|
const data = reactive({
|
||||||
|
openType:'' as any,
|
||||||
|
isShowMark:false,
|
||||||
|
})
|
||||||
|
const dataDom:any = reactive({
|
||||||
|
toProduct:null as any,
|
||||||
|
relight:null as any,
|
||||||
|
poseTransfer:null as any,
|
||||||
|
deReconstruction:null as any,
|
||||||
|
patternMaking3D:null as any,
|
||||||
|
canvasUpload:null as any,
|
||||||
|
})
|
||||||
|
let driver__:any = computed(()=>{
|
||||||
|
return store.state.Guide.guide
|
||||||
|
})
|
||||||
|
provide('driver__',driver__)
|
||||||
|
const setIsShowMark = (boolean:boolean)=>{
|
||||||
|
data.isShowMark = boolean
|
||||||
|
}
|
||||||
|
const open = (str:any)=>{
|
||||||
|
nextTick(()=>{
|
||||||
|
if(dataDom[str]?.openSetData){
|
||||||
|
dataDom[str].openSetData()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
provide('setIsShowMark',setIsShowMark)
|
||||||
|
watch(() => route.query,
|
||||||
|
(query, oldQuery) => {
|
||||||
|
if(oldQuery && query?.tools == oldQuery?.tools)return
|
||||||
|
let str = query.tools
|
||||||
|
nextTick(()=>{
|
||||||
|
console.log(str)
|
||||||
|
data.openType = str
|
||||||
|
open(str)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
{ immediate: true } // 立即触发一次以处理初始参数
|
||||||
|
);
|
||||||
|
return{
|
||||||
|
...toRefs(dataDom),
|
||||||
|
...toRefs(data),
|
||||||
|
}
|
||||||
|
},
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.tools{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
.modelBox{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -58,12 +58,17 @@ const routes: Array<RouteRecordRaw> = [
|
|||||||
meta:{enter:'all',},
|
meta:{enter:'all',},
|
||||||
component: _import('HomeMain'),
|
component: _import('HomeMain'),
|
||||||
children:[
|
children:[
|
||||||
|
// {
|
||||||
|
// path: "",
|
||||||
|
// name:'HomeChil',
|
||||||
|
// redirect: "/home/homePage"
|
||||||
|
// },
|
||||||
{
|
{
|
||||||
path: "",
|
path:'tools',
|
||||||
name:'HomeChil',
|
name:'tools',
|
||||||
redirect: "/home/homePage"
|
meta:{enter:'all',},
|
||||||
},
|
component: _import_custom('HomeView/Tools.vue'),
|
||||||
{
|
},{
|
||||||
path:'homePage',
|
path:'homePage',
|
||||||
name:'homePage',
|
name:'homePage',
|
||||||
meta:{enter:'all',},
|
meta:{enter:'all',},
|
||||||
@@ -223,6 +228,11 @@ const routes: Array<RouteRecordRaw> = [
|
|||||||
name:'TransactionTable',
|
name:'TransactionTable',
|
||||||
meta:{enter:3,},
|
meta:{enter:3,},
|
||||||
component: _import_component('Administrator/Transaction/TransactionTable.vue'),
|
component: _import_component('Administrator/Transaction/TransactionTable.vue'),
|
||||||
|
},{
|
||||||
|
path:'organization',
|
||||||
|
name:'organization',
|
||||||
|
meta:{enter:3,},
|
||||||
|
component: _import_component('Administrator/organization/organization.vue'),
|
||||||
},
|
},
|
||||||
//企业版教育管理员页面
|
//企业版教育管理员页面
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -267,8 +267,8 @@ const UploadFilesModule : Module<UploadFiles,RootState> = {
|
|||||||
state.allBoardData.colorBoards = []
|
state.allBoardData.colorBoards = []
|
||||||
}
|
}
|
||||||
let navListData = (workspace as any).state.projectList
|
let navListData = (workspace as any).state.projectList
|
||||||
let index = navListData.findIndex((item:any) => item.value === data);
|
// let index = navListData.findIndex((item:any) => item.value === data);
|
||||||
navListData[index].select = false
|
// navListData[index].select = false
|
||||||
},
|
},
|
||||||
|
|
||||||
createModularData(state){
|
createModularData(state){
|
||||||
@@ -341,7 +341,7 @@ const UploadFilesModule : Module<UploadFiles,RootState> = {
|
|||||||
actions:{
|
actions:{
|
||||||
setAllBoardData({ state,commit },data) {
|
setAllBoardData({ state,commit },data) {
|
||||||
// commit('increment'); // 提交 mutation
|
// commit('increment'); // 提交 mutation
|
||||||
let navListData = JSON.parse(JSON.stringify((workspace as any).state.projectList))
|
// let navListData = JSON.parse(JSON.stringify((workspace as any).state.projectList))
|
||||||
let str:any = data.type
|
let str:any = data.type
|
||||||
let currentState = false
|
let currentState = false
|
||||||
if(str == 'moodBoard'){
|
if(str == 'moodBoard'){
|
||||||
@@ -361,13 +361,13 @@ const UploadFilesModule : Module<UploadFiles,RootState> = {
|
|||||||
state.allBoardData.colorBoards = state.colorBoards
|
state.allBoardData.colorBoards = state.colorBoards
|
||||||
if(state.colorBoards.length > 0)currentState = true
|
if(state.colorBoards.length > 0)currentState = true
|
||||||
}
|
}
|
||||||
let index = navListData.findIndex((item:any) => item.value === str);
|
// let index = navListData.findIndex((item:any) => item.value === str);
|
||||||
if(currentState){
|
// if(currentState){
|
||||||
navListData[index].select = true
|
// navListData[index].select = true
|
||||||
}else{
|
// }else{
|
||||||
navListData[index].select = false
|
// navListData[index].select = false
|
||||||
}
|
// }
|
||||||
commit('setProjectList',navListData)
|
// commit('setProjectList',navListData)
|
||||||
},
|
},
|
||||||
setModularData({ state,commit },data){
|
setModularData({ state,commit },data){
|
||||||
let navListData = JSON.parse(JSON.stringify((workspace as any).state.projectList)) as any
|
let navListData = JSON.parse(JSON.stringify((workspace as any).state.projectList)) as any
|
||||||
@@ -388,17 +388,17 @@ const UploadFilesModule : Module<UploadFiles,RootState> = {
|
|||||||
}else if(data.type == 'patternMaking3D'){
|
}else if(data.type == 'patternMaking3D'){
|
||||||
value = homeData.patternMaking3D
|
value = homeData.patternMaking3D
|
||||||
}
|
}
|
||||||
let index = navListData.findIndex((item:any) => item.value === data.type);
|
// let index = navListData.findIndex((item:any) => item.value === data.type);
|
||||||
if(
|
// if(
|
||||||
(value == null || value?.length == 0) ||
|
// (value == null || value?.length == 0) ||
|
||||||
(data.type == 'design' && !value.userlikeGroupId)
|
// (data.type == 'design' && !value.userlikeGroupId)
|
||||||
){
|
// ){
|
||||||
navListData[index].select = false
|
// navListData[index].select = false
|
||||||
}else{
|
// }else{
|
||||||
navListData[index].select = true
|
// navListData[index].select = true
|
||||||
}
|
// }
|
||||||
state.modularData[data.type] = value
|
state.modularData[data.type] = value
|
||||||
commit('setProjectList',navListData)
|
// commit('setProjectList',navListData)
|
||||||
},
|
},
|
||||||
getProjectData({ state,commit },str){
|
getProjectData({ state,commit },str){
|
||||||
return new Promise((resolve,reject) => {
|
return new Promise((resolve,reject) => {
|
||||||
|
|||||||
@@ -25,6 +25,7 @@ interface UserHabit{
|
|||||||
sex:any,
|
sex:any,
|
||||||
userDetail:any,
|
userDetail:any,
|
||||||
bindEmail:any,
|
bindEmail:any,
|
||||||
|
ageGroup:any,
|
||||||
}
|
}
|
||||||
|
|
||||||
const userHabit : Module<UserHabit,RootState> = {
|
const userHabit : Module<UserHabit,RootState> = {
|
||||||
@@ -62,6 +63,7 @@ const userHabit : Module<UserHabit,RootState> = {
|
|||||||
},
|
},
|
||||||
sex:{
|
sex:{
|
||||||
},
|
},
|
||||||
|
ageGroup:[],
|
||||||
userDetail:{
|
userDetail:{
|
||||||
email:'-------------',
|
email:'-------------',
|
||||||
userName: "---",
|
userName: "---",
|
||||||
@@ -170,6 +172,9 @@ const userHabit : Module<UserHabit,RootState> = {
|
|||||||
setSex(state,data){
|
setSex(state,data){
|
||||||
state.sex.value = data
|
state.sex.value = data
|
||||||
},
|
},
|
||||||
|
setAgeGroup(state,data){
|
||||||
|
state.ageGroup = data
|
||||||
|
},
|
||||||
createDetail(state,data){
|
createDetail(state,data){
|
||||||
state.userDetail = {
|
state.userDetail = {
|
||||||
email:'-------------',
|
email:'-------------',
|
||||||
@@ -336,7 +341,7 @@ const userHabit : Module<UserHabit,RootState> = {
|
|||||||
},
|
},
|
||||||
async getLangType(context){
|
async getLangType(context){
|
||||||
let allPromise = [];
|
let allPromise = [];
|
||||||
let getList = ['DesignElementsEnum','PrintboardLevel2TypeEnum','FemalePosition','MalePosition','SketchStyle','SketchGenerateType','Sex']
|
let getList = ['DesignElementsEnum','PrintboardLevel2TypeEnum','FemalePosition','MalePosition','SketchStyle','SketchGenerateType','Sex','AgeGroup']
|
||||||
let workspaceAllPosition:any = []
|
let workspaceAllPosition:any = []
|
||||||
let axiosGet = (item:any)=>{
|
let axiosGet = (item:any)=>{
|
||||||
return new Promise((resolve,reject) => {
|
return new Promise((resolve,reject) => {
|
||||||
@@ -365,6 +370,8 @@ const userHabit : Module<UserHabit,RootState> = {
|
|||||||
context.commit('setSketchGenerateType',rv)
|
context.commit('setSketchGenerateType',rv)
|
||||||
}else if(item == 'Sex'){
|
}else if(item == 'Sex'){
|
||||||
context.commit('setSex',rv)
|
context.commit('setSex',rv)
|
||||||
|
}else if(item == 'AgeGroup'){
|
||||||
|
context.commit('setAgeGroup',rv)
|
||||||
}
|
}
|
||||||
resolve('')
|
resolve('')
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -154,6 +154,13 @@ const adminRouter = {
|
|||||||
route:'/administrator/coupons',
|
route:'/administrator/coupons',
|
||||||
key:'sub12',
|
key:'sub12',
|
||||||
isShow:true,
|
isShow:true,
|
||||||
|
},{
|
||||||
|
|
||||||
|
name:'Organization',
|
||||||
|
icon:'usetime',
|
||||||
|
route:'/administrator/organization',
|
||||||
|
key:'sub13',
|
||||||
|
isShow:true,
|
||||||
}],
|
}],
|
||||||
schoolOrEnterprise:[
|
schoolOrEnterprise:[
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -213,6 +213,7 @@ export const Https = {
|
|||||||
queryUserGroup:`/api/history/queryUserGroup`, //History用户分页分组列表
|
queryUserGroup:`/api/history/queryUserGroup`, //History用户分页分组列表
|
||||||
deleteUserGroup:`/api/history/deleteUserGroup`, //History删除用户分组
|
deleteUserGroup:`/api/history/deleteUserGroup`, //History删除用户分组
|
||||||
updateUserGroupName:`/api/history/updateUserGroupName`, //History修改用户分组名
|
updateUserGroupName:`/api/history/updateUserGroupName`, //History修改用户分组名
|
||||||
|
saveOrUpdate:`/api/project/saveOrUpdate`, //History修改用户分组名
|
||||||
historyChoose:`/api/history/choose`, //History choose
|
historyChoose:`/api/history/choose`, //History choose
|
||||||
getDesignDetail:`/api/design/detail/getDetail`,//查询design详情
|
getDesignDetail:`/api/design/detail/getDetail`,//查询design详情
|
||||||
designSingleWithGradient:`/api/design/detail/designSingleWithGradient`,//查询需要更新mask列表
|
designSingleWithGradient:`/api/design/detail/designSingleWithGradient`,//查询需要更新mask列表
|
||||||
@@ -232,6 +233,11 @@ export const Https = {
|
|||||||
editRelPublicClassificationIdList:`/api/classification/editRelPublicClassificationIdList`,//多选修改公共标签
|
editRelPublicClassificationIdList:`/api/classification/editRelPublicClassificationIdList`,//多选修改公共标签
|
||||||
|
|
||||||
//模块化
|
//模块化
|
||||||
|
llmStream:`/api/llm/stream`,//聊天
|
||||||
|
chatCreateProject:`/api/llm/chatCreateProject`,//聊天创建项目
|
||||||
|
getChatHistory:`/api/llm/getChatHistory`,//获取聊天历史记录
|
||||||
|
llmUploadFile:`/api/llm/uploadFile`,//聊天上传文件
|
||||||
|
|
||||||
saveOrUpdate:`/api/project/saveOrUpdate`,//模块化新增修改
|
saveOrUpdate:`/api/project/saveOrUpdate`,//模块化新增修改
|
||||||
getModuleContent:`/api/project/getModuleContent`,//获取模块内容
|
getModuleContent:`/api/project/getModuleContent`,//获取模块内容
|
||||||
saveModuleContent:`/api/project/saveModuleContent`,//储存模块内容
|
saveModuleContent:`/api/project/saveModuleContent`,//储存模块内容
|
||||||
@@ -312,7 +318,9 @@ export const Https = {
|
|||||||
updatePromCodeInfo:`/api/stripe/updatePromCodeInfo`,//修改优惠码
|
updatePromCodeInfo:`/api/stripe/updatePromCodeInfo`,//修改优惠码
|
||||||
getAllCoupons:`/api/stripe/getAllCoupons`,//查询优惠码列表
|
getAllCoupons:`/api/stripe/getAllCoupons`,//查询优惠码列表
|
||||||
checkCoupon:`/api/stripe/checkCoupon`,//根据优惠码获取结算后的金额
|
checkCoupon:`/api/stripe/checkCoupon`,//根据优惠码获取结算后的金额
|
||||||
deletePromCode:`api/stripe/deletePromCode`,//删除优惠券
|
deletePromCode:`/api/stripe/deletePromCode`,//删除优惠券
|
||||||
|
addOrganization:`/api/inquiry/addOrganization`,//添加企业版或者教育版
|
||||||
|
queryOrganization:`/api/inquiry/queryOrganization`,//查询企业版或者教育版
|
||||||
|
|
||||||
|
|
||||||
//云生成
|
//云生成
|
||||||
@@ -418,7 +426,7 @@ export const Https = {
|
|||||||
|
|
||||||
axiosGet(url,config) {
|
axiosGet(url,config) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
if(isLoginTime) {
|
if(isLoginTime && url != '/api/portfolio/page') {
|
||||||
resolve('')
|
resolve('')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -432,7 +440,7 @@ export const Https = {
|
|||||||
|
|
||||||
axiosPut(url, data) {
|
axiosPut(url, data) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
if(isLoginTime) {
|
if(isLoginTime && url != '/api/portfolio/page') {
|
||||||
resolve('')
|
resolve('')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -446,7 +454,7 @@ export const Https = {
|
|||||||
|
|
||||||
axiosPost(url, data,config) {
|
axiosPost(url, data,config) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
if(isLoginTime) {
|
if(isLoginTime && url != '/api/portfolio/page') {
|
||||||
resolve('')
|
resolve('')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@@ -460,7 +468,7 @@ export const Https = {
|
|||||||
|
|
||||||
axiosDelete(url, newData) {
|
axiosDelete(url, newData) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
if(isLoginTime) {
|
if(isLoginTime && url != '/api/portfolio/page') {
|
||||||
resolve('')
|
resolve('')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -236,13 +236,71 @@ const openTypeList = (t)=>{
|
|||||||
tools:{
|
tools:{
|
||||||
icon:'fi-rr-magic-wand',
|
icon:'fi-rr-magic-wand',
|
||||||
label:'Advanced tools',
|
label:'Advanced tools',
|
||||||
value:'advancedTools',
|
value:'tools',
|
||||||
|
router:'/home/tools',
|
||||||
list:[
|
list:[
|
||||||
|
// {
|
||||||
|
// icon:'fi fi-rr-grid',
|
||||||
|
// value:'moodBoard',
|
||||||
|
// label:'Moodboard',
|
||||||
|
// router:'tools=moodBoard'
|
||||||
|
// },{
|
||||||
|
// icon:'fi fi-rs-objects-column',
|
||||||
|
// value:'printBoard',
|
||||||
|
// label:'Printboard',
|
||||||
|
// router:'tools=printBoard'
|
||||||
|
// },{
|
||||||
|
// icon:'fi fi-rr-palette',
|
||||||
|
// value:'colorBoard',
|
||||||
|
// label:'Colorboard',
|
||||||
|
// router:'tools=colorBoard'
|
||||||
|
// },{
|
||||||
|
// icon:'fi icon iconfont icon-a-waitao_changkuanwaitao11x',
|
||||||
|
// value:'sketchBoard',
|
||||||
|
// label:'Sketchboard',
|
||||||
|
// router:'tools=sketchBoard'
|
||||||
|
// },{
|
||||||
|
// icon:'fi fi-rs-people',
|
||||||
|
// value:'mannequin',
|
||||||
|
// label:'Mannequin',
|
||||||
|
// router:'tools=mannequin'
|
||||||
|
// },{
|
||||||
|
// icon:'fi fi-rs-paintbrush-pencil',
|
||||||
|
// value:'design',
|
||||||
|
// label:'Design',
|
||||||
|
// router:'tools=design'
|
||||||
|
// },
|
||||||
{
|
{
|
||||||
icon:'',
|
icon:'fi fi-ss-box-open',
|
||||||
label:'All',
|
value:'toProduct',
|
||||||
value:'all',
|
label:'To Product Image',
|
||||||
}
|
router:'tools=toProduct'
|
||||||
|
},{
|
||||||
|
icon:'fi fi-br-keyboard-brightness',
|
||||||
|
value:'relight',
|
||||||
|
label:'Relight',
|
||||||
|
router:'tools=relight'
|
||||||
|
},{
|
||||||
|
icon:'fi fi-rr-play-alt',
|
||||||
|
value:'poseTransfer',
|
||||||
|
label:'Transfer Pose',
|
||||||
|
router:'tools=poseTransfer'
|
||||||
|
},{
|
||||||
|
icon:'i class="fi fi-rr-puzzle-alt',
|
||||||
|
value:'deReconstruction',
|
||||||
|
label:'De/Reconstruction',
|
||||||
|
router:'tools=deReconstruction'
|
||||||
|
},{
|
||||||
|
icon:'fi fi-rr-cubes',
|
||||||
|
value:'patternMaking3D',
|
||||||
|
label:'3D Pattern Making',
|
||||||
|
router:'tools=patternMaking3D'
|
||||||
|
},{
|
||||||
|
icon:'fi fi-rr-pen-swirl',
|
||||||
|
value:'canvasUpload',
|
||||||
|
label:'Canvas',
|
||||||
|
router:'tools=canvasUpload'
|
||||||
|
},
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
library:{
|
library:{
|
||||||
@@ -289,11 +347,6 @@ const openTypeList = (t)=>{
|
|||||||
label:'History',
|
label:'History',
|
||||||
value:'history',
|
value:'history',
|
||||||
list:[
|
list:[
|
||||||
{
|
|
||||||
icon:'',
|
|
||||||
label:'All',
|
|
||||||
value:'all',
|
|
||||||
}
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
gallery:{
|
gallery:{
|
||||||
@@ -328,14 +381,14 @@ const openTypeList = (t)=>{
|
|||||||
event:{
|
event:{
|
||||||
icon:'fi-rr-calendar-star',
|
icon:'fi-rr-calendar-star',
|
||||||
label:'Event',
|
label:'Event',
|
||||||
value:'event',
|
value:'events',
|
||||||
router:'/home/events',
|
router:'/home/events',
|
||||||
list:[
|
list:[
|
||||||
{
|
{
|
||||||
icon:'',
|
icon:'',
|
||||||
label:'All',
|
label:'All',
|
||||||
value:'all',
|
value:'all',
|
||||||
router:''
|
router:'events=all'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -6,13 +6,13 @@
|
|||||||
<span>AiDA</span>
|
<span>AiDA</span>
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 24 24" data-v-1c7326d6=""><path fill-rule="evenodd" d="M6 5a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h2V5H6Zm4 0v14h8a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1h-8ZM3 6a3 3 0 0 1 3-3h12a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6Z" clip-rule="evenodd" data-v-1c7326d6=""></path></svg>
|
<svg xmlns="http://www.w3.org/2000/svg" width="2rem" height="2rem" fill="currentColor" viewBox="0 0 24 24" data-v-1c7326d6=""><path fill-rule="evenodd" d="M6 5a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h2V5H6Zm4 0v14h8a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1h-8ZM3 6a3 3 0 0 1 3-3h12a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6Z" clip-rule="evenodd" data-v-1c7326d6=""></path></svg>
|
||||||
</div>
|
</div>
|
||||||
<div class="newObj marginT2">
|
<div class="newObj marginT2" @click="newProject">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 25 24"><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12.5 5v14m-7-7h14"></path></svg>
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 25 24"><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12.5 5v14m-7-7h14"></path></svg>
|
||||||
<p>New Chat</p>
|
<p>New Project</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="navList marginT2">
|
<div class="navList marginT2">
|
||||||
<div class="tools list" v-for="item in openTypeList" :class="{active:openType == item.value}">
|
<div class="tools list" v-for="item in openTypeList" :class="{active:openType == item.value}">
|
||||||
<div class="titleBox" @click="setOpenType(item.value)">
|
<div class="titleBox" @click="setOpenType(item.value,item.list)">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<i :class="['fi',item.icon]"></i>
|
<i :class="['fi',item.icon]"></i>
|
||||||
<span>{{item.label}}</span>
|
<span>{{item.label}}</span>
|
||||||
@@ -22,21 +22,54 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="detailBox">
|
<div class="detailBox">
|
||||||
<div class="detail" v-show="openType == item.value">
|
<div class="detail" v-if="item.value != 'history'" v-show="openType == item.value">
|
||||||
<div class="detailItem" v-for="childItem in item.list" @click="setRouter(item,childItem)" :class="{active:openTypeChild == childItem.value}">
|
<div class="detailItem" v-for="childItem in item.list" @click="setRouter(item,childItem)" :class="{active:openTypeChild == childItem.value}">
|
||||||
<i v-show="childItem.icon" :class="['fi',childItem.icon]"></i>
|
<i v-show="childItem.icon" :class="['fi',childItem.icon]"></i>
|
||||||
<span>{{ childItem.label }}</span>
|
<div class="text">
|
||||||
|
<span>{{ childItem.label }}</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="detail" v-else>
|
||||||
|
<div class="detailItem history" v-for="childItem,index in item.list" @click="setHistory(item,childItem)" :class="{active:openTypeChild == childItem.id}">
|
||||||
|
<div class="text" style="width: 100%;">
|
||||||
|
<span :title="childItem.name" v-show="!childItem.editName">{{ childItem.name }}</span>
|
||||||
|
<textarea v-model="historyTextarea" v-show="childItem.editName"></textarea>
|
||||||
|
</div>
|
||||||
|
<div class="type">{{ childItem.process }}</div>
|
||||||
|
<div class="btn">
|
||||||
|
<i class="fi fi-br-menu-dots-vertical" v-show="!childItem.editName" @click.stop="editHistory(childItem,index,$event)"></i>
|
||||||
|
<i class="fi fi-br-check" v-show="childItem.editName" @click.stop="accomplishHistory(childItem,index,$event)"></i>
|
||||||
|
<div class="operation" v-show="selectHistoryIndex == index">
|
||||||
|
<div class="item" @click.stop="editName(childItem)">
|
||||||
|
<i class="fi fi-rr-edit"></i>
|
||||||
|
<span>Rename</span>
|
||||||
|
</div>
|
||||||
|
<div class="item" @click.stop="deleteItem(childItem)">
|
||||||
|
<i class="icon iconfont icon-shanchu operate_icon"></i>
|
||||||
|
<span>Delete</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-show="!isNoData" class="material_content_list_loding">
|
||||||
|
<span class="page_loading" v-show="!isShowLoading"></span>
|
||||||
|
<span v-show="isShowLoading">
|
||||||
|
<a-spin size="large" />
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<img v-show="isNoData && isNull" src="@/assets/images/homePage/null_img.png">
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="navListBottom">
|
<!-- <div class="navListBottom">
|
||||||
<div class="tools marginT2 list language" :class="{active:isLanguage}">
|
<div class="tools marginT2 list language" :class="{active:isLanguage}">
|
||||||
<div class="titleBox" @click="()=>isLanguage = !isLanguage">
|
<div class="titleBox" @click="()=>isLanguage = !isLanguage">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<i class="fi fi-br-angle-small-down"></i>
|
<i class="fi fi-br-globe"></i>
|
||||||
<span>Advanced Tools</span>
|
<span>Language</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<i class="fi fi-br-angle-small-down"></i>
|
<i class="fi fi-br-angle-small-down"></i>
|
||||||
@@ -45,7 +78,6 @@
|
|||||||
<div class="detailBox">
|
<div class="detailBox">
|
||||||
<div class="detail" v-show="isLanguage">
|
<div class="detail" v-show="isLanguage">
|
||||||
<div class="detailItem">
|
<div class="detailItem">
|
||||||
<!-- <i class="fi fi-br-angle-small-down"></i> -->
|
|
||||||
<span>AI Image Generator</span>
|
<span>AI Image Generator</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="detailItem active">
|
<div class="detailItem active">
|
||||||
@@ -55,6 +87,20 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div> -->
|
||||||
|
<div class="homeMain_right_content">
|
||||||
|
<div
|
||||||
|
class="button_second credits hideChecked"
|
||||||
|
>
|
||||||
|
{{$t('Header.Credits')}}:
|
||||||
|
<span :title="credits">
|
||||||
|
<div class="credits_item" v-for="item in String(credits)" :style="{'transform': 'translateY('+item*-100+'%)'}">
|
||||||
|
<div v-for="numItem in 10">{{ numItem-1 }}</div>
|
||||||
|
</div>
|
||||||
|
</span>
|
||||||
|
<i @click="getCredits" class="fi fi-br-refresh" :class="[activeCredits?'active':'']"></i>
|
||||||
|
<i @click="UpgradePlan" title="Purchase" class="fi fi-rr-shop"></i>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="userDetail.systemUser == 0 || userDetail.systemUser == 3" @click="openUpgradeToPro" class="gallery_btn gallery_btn_radius" style="width: 100%;">Upgrade to Pro</div>
|
<div v-if="userDetail.systemUser == 0 || userDetail.systemUser == 3" @click="openUpgradeToPro" class="gallery_btn gallery_btn_radius" style="width: 100%;">Upgrade to Pro</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -62,6 +108,22 @@
|
|||||||
<div class="rightBox">
|
<div class="rightBox">
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<div class="user">
|
<div class="user">
|
||||||
|
<div class="trialApproval">
|
||||||
|
<div class="message_iconItem">
|
||||||
|
<a-badge :count="messageNum">
|
||||||
|
<i class="fi fi-rr-envelope" @click="openMessage"></i>
|
||||||
|
</a-badge>
|
||||||
|
</div>
|
||||||
|
<div class="message_iconItem">
|
||||||
|
<a-badge :count="messageType?.newPosted">
|
||||||
|
<!-- <i class="fi fi-rr-envelope" @click="openMessage"></i> -->
|
||||||
|
<i class="fi fi-rr-bell" @click.stop="openNewPosted"></i>
|
||||||
|
</a-badge>
|
||||||
|
<div class="message_iconItem_value select_block" v-show="isNewPosted" style="width: 40rem">
|
||||||
|
<newPosted ref="newPosted"></newPosted>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="homeMain_user">
|
<div class="homeMain_user">
|
||||||
<div class="homeMain_user_icon" @click="openAccount">
|
<div class="homeMain_user_icon" @click="openAccount">
|
||||||
<img :src="userDetail.avatar" alt="">
|
<img :src="userDetail.avatar" alt="">
|
||||||
@@ -130,55 +192,19 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="router">
|
<div class="userSystem" v-if="userDetail.systemList.indexOf(1) == -1">
|
||||||
<router-view v-if="!getLangIsShowMark" @setTask="setTask" :getLangIsShowMark="getLangIsShowMark">
|
You can use these features only after becoming a regular user~
|
||||||
</router-view>
|
</div>
|
||||||
|
<div class="router" v-else-if="!getLangIsShowMark">
|
||||||
|
<home ref="home" @setTask="setTask" ></home>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<header class="homeMain_heade" v-show="false">
|
|
||||||
<div class="homeMain_right_content">
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="trialApproval button_second credits hideChecked"
|
|
||||||
>
|
|
||||||
{{$t('Header.Credits')}}:
|
|
||||||
<span :title="credits">
|
|
||||||
<div class="credits_item" v-for="item in String(credits)" :style="{'transform': 'translateY('+item*-100+'%)'}">
|
|
||||||
<div v-for="numItem in 10">{{ numItem-1 }}</div>
|
|
||||||
</div>
|
|
||||||
</span>
|
|
||||||
<i @click="getCredits" class="fi fi-br-refresh" :class="[activeCredits?'active':'']"></i>
|
|
||||||
<i @click="UpgradePlan" title="Purchase" class="fi fi-rr-shop"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- <navRouter :routerList="navRouterList"></navRouter> -->
|
|
||||||
<div class="homeMain_right">
|
|
||||||
<div class="trialApproval credits message">
|
|
||||||
<div class="message_iconItem">
|
|
||||||
<a-badge :count="messageNum">
|
|
||||||
<i class="fi fi-rr-envelope" @click="openMessage"></i>
|
|
||||||
</a-badge>
|
|
||||||
</div>
|
|
||||||
<div class="message_iconItem">
|
|
||||||
<a-badge :count="messageType?.newPosted">
|
|
||||||
<!-- <i class="fi fi-rr-envelope" @click="openMessage"></i> -->
|
|
||||||
<i class="fi fi-rr-bell" @click.stop="openNewPosted"></i>
|
|
||||||
</a-badge>
|
|
||||||
<div class="message_iconItem_value select_block" v-show="isNewPosted" style="width: 40rem">
|
|
||||||
<newPosted ref="newPosted"></newPosted>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- <Habit></Habit> -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<payOrder ref="payOrder"></payOrder>
|
|
||||||
<UpgradePlan ref="UpgradePlan"></UpgradePlan>
|
|
||||||
<TaskPage ref="TaskPage"></TaskPage>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
|
|
||||||
|
<payOrder ref="payOrder"></payOrder>
|
||||||
|
<UpgradePlan ref="UpgradePlan"></UpgradePlan>
|
||||||
|
<TaskPage ref="TaskPage"></TaskPage>
|
||||||
|
|
||||||
<div class="mark_loading" v-show="getLangIsShowMark">
|
<div class="mark_loading" v-show="getLangIsShowMark">
|
||||||
<a-spin size="large" />
|
<a-spin size="large" />
|
||||||
</div>
|
</div>
|
||||||
@@ -186,8 +212,6 @@
|
|||||||
<scaleVideo ref="scaleVideo"></scaleVideo>
|
<scaleVideo ref="scaleVideo"></scaleVideo>
|
||||||
<!-- 进行续订 -->
|
<!-- 进行续订 -->
|
||||||
<renew ref="renew"></renew>
|
<renew ref="renew"></renew>
|
||||||
<!-- 绑定邮箱 -->
|
|
||||||
<bindEmail ref="bindEmail"></bindEmail>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script >
|
<script >
|
||||||
@@ -206,8 +230,6 @@ import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
|
|||||||
import RobotAssist from "@/component/HomePage/RobotAssist.vue";
|
import RobotAssist from "@/component/HomePage/RobotAssist.vue";
|
||||||
import scaleVideo from "@/component/HomePage/scaleVideo.vue";
|
import scaleVideo from "@/component/HomePage/scaleVideo.vue";
|
||||||
import newPosted from "@/component/HomePage/newPosted.vue";
|
import newPosted from "@/component/HomePage/newPosted.vue";
|
||||||
import navRouter from "@/component/modules/navRouter.vue";
|
|
||||||
import bindEmail from "@/component/HomePage/bindEmail.vue";
|
|
||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
import { setLang } from "@/tool/guide";
|
import { setLang } from "@/tool/guide";
|
||||||
import showViewVideo from "@/tool/mount";
|
import showViewVideo from "@/tool/mount";
|
||||||
@@ -218,6 +240,7 @@ import MyWs from "@/tool/webSocket";
|
|||||||
import MyEvent from "@/tool/myEvents";
|
import MyEvent from "@/tool/myEvents";
|
||||||
import { useRouter,useRoute } from 'vue-router'
|
import { useRouter,useRoute } from 'vue-router'
|
||||||
import {openTypeList} from "@/tool/listData.js";
|
import {openTypeList} from "@/tool/listData.js";
|
||||||
|
import home from "@/component/home/index.vue";
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
VerificationCodeInput,
|
VerificationCodeInput,
|
||||||
@@ -229,8 +252,7 @@ export default defineComponent({
|
|||||||
UpgradePlan,
|
UpgradePlan,
|
||||||
payOrder,
|
payOrder,
|
||||||
TaskPage,
|
TaskPage,
|
||||||
navRouter,
|
home,
|
||||||
bindEmail,
|
|
||||||
},
|
},
|
||||||
setup(){
|
setup(){
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
@@ -243,17 +265,31 @@ export default defineComponent({
|
|||||||
openTypeChild:'',
|
openTypeChild:'',
|
||||||
isLanguage:false,
|
isLanguage:false,
|
||||||
openTypeList:openTypeList(t),
|
openTypeList:openTypeList(t),
|
||||||
|
|
||||||
|
})
|
||||||
|
const historyData = reactive({
|
||||||
|
isNoData:false,
|
||||||
|
isShowLoading:false,
|
||||||
|
isNull:false,
|
||||||
|
searchCollectionName:'',
|
||||||
|
historyTextarea:'',
|
||||||
|
historyList:[],
|
||||||
|
selectHistoryIndex:-1,
|
||||||
|
page:1,
|
||||||
|
size:10,
|
||||||
})
|
})
|
||||||
watch(() => route.query,
|
watch(() => route.query,
|
||||||
(query, oldQuery) => {
|
(query, oldQuery) => {
|
||||||
// if(oldQuery && query?.works == oldQuery?.works)return
|
|
||||||
console.log(query,oldQuery,Object.keys(query)[0]);
|
|
||||||
// homeMainData.openTypeList[Object.keys(query)[0]]
|
|
||||||
nextTick(()=>{
|
nextTick(()=>{
|
||||||
const key = Object.keys(query)?.[0]
|
const key = Object.keys(query)?.[0]
|
||||||
if(key){
|
if(key){
|
||||||
homeMainData.openType = Object.keys(query)[0]
|
if(query.id){
|
||||||
homeMainData.openTypeChild = query[Object.keys(query)[0]]
|
homeMainData.openType = 'history'
|
||||||
|
homeMainData.openTypeChild = query.id
|
||||||
|
}else{
|
||||||
|
homeMainData.openType = Object.keys(query)[0]
|
||||||
|
homeMainData.openTypeChild = query[Object.keys(query)[0]]
|
||||||
|
}
|
||||||
}else{
|
}else{
|
||||||
homeMainData.openType = ''
|
homeMainData.openType = ''
|
||||||
homeMainData.openTypeChild = ''
|
homeMainData.openTypeChild = ''
|
||||||
@@ -272,7 +308,6 @@ export default defineComponent({
|
|||||||
|
|
||||||
let activeCredits = ref(false)
|
let activeCredits = ref(false)
|
||||||
let getLangIsShowMark = ref(true)
|
let getLangIsShowMark = ref(true)
|
||||||
let navRouterList = ref([])
|
|
||||||
let messageNum = computed(()=>{
|
let messageNum = computed(()=>{
|
||||||
return store.state.UserHabit.messageSystem.messageNum
|
return store.state.UserHabit.messageSystem.messageNum
|
||||||
})
|
})
|
||||||
@@ -314,13 +349,6 @@ export default defineComponent({
|
|||||||
store.commit('setMessageSystem',data)
|
store.commit('setMessageSystem',data)
|
||||||
}
|
}
|
||||||
MyEvent.add('getMessage',getWsMessage)
|
MyEvent.add('getMessage',getWsMessage)
|
||||||
// setTimeout(() => {
|
|
||||||
// MyWs.sendMessage('aaaa')
|
|
||||||
// }, 3000);
|
|
||||||
// MyWs.ws.onmessage = (data)=>{
|
|
||||||
// console.log(JSON.parse(data.data),232);
|
|
||||||
// }
|
|
||||||
|
|
||||||
let openNewPosted = ()=>{
|
let openNewPosted = ()=>{
|
||||||
stateList.isNewPosted = !stateList.isNewPosted
|
stateList.isNewPosted = !stateList.isNewPosted
|
||||||
newPosted.value.init()
|
newPosted.value.init()
|
||||||
@@ -350,58 +378,182 @@ export default defineComponent({
|
|||||||
const openUpgradeToPro = ()=>{
|
const openUpgradeToPro = ()=>{
|
||||||
renew.value.init()
|
renew.value.init()
|
||||||
}
|
}
|
||||||
onMounted(()=>{
|
onMounted(async ()=>{
|
||||||
|
let test = getCookie('isTest')
|
||||||
|
let isTest =JSON.parse(test)
|
||||||
|
//判断账号剩余时间是否太短
|
||||||
|
let isModalOne = JSON.parse(sessionStorage.getItem("isTimeOne"))
|
||||||
|
if(!isModalOne){//判断是否是试用用户
|
||||||
|
await new Promise(async (resolve) => {
|
||||||
|
if(isTest){
|
||||||
|
resolve('')
|
||||||
|
}else{
|
||||||
|
await Https.axiosPost(Https.httpUrls.getExpiredTime,{}).then((rv) => {
|
||||||
|
if (rv) {
|
||||||
|
let dateNow = Date.now()
|
||||||
|
let date = new Date(dateNow)
|
||||||
|
let rvDate = new Date(rv);
|
||||||
|
let diffInMilliseconds = Math.abs(date - rvDate); // 获取时间差的毫秒数
|
||||||
|
let days = Math.floor(diffInMilliseconds / (24 * 60 * 60 * 1000)); // 计算天数
|
||||||
|
let hours = Math.floor((diffInMilliseconds % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000)); // 计算小时数
|
||||||
|
let minutes = Math.floor((diffInMilliseconds % (60 * 60 * 1000)) / (60 * 1000)); // 计算分钟数
|
||||||
|
if(days < 5){
|
||||||
|
setTimeout(() => {
|
||||||
|
let text = {
|
||||||
|
str:`${t('HomeView.jsContent4',{days:days,hours:hours})}<a href="https://code-create.com.hk/aida" target="_blank">${t('HomeView.jsContent8')}</a>`,
|
||||||
|
title:`${t('HomeView.jsContent7')}`,
|
||||||
|
}
|
||||||
|
dataDom.affiche.init(text)
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
resolve('')
|
||||||
|
}else{
|
||||||
|
resolve('')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
getUnreadCount()
|
getUnreadCount()
|
||||||
navRouterList.value = [
|
nextTick(()=>{
|
||||||
{
|
setPorfolioDom()
|
||||||
routerName:['homePage'],
|
})
|
||||||
router:'/home/homePage',
|
|
||||||
name:t('Header.HOME')
|
|
||||||
},{
|
|
||||||
routerName:['library'],
|
|
||||||
router:'/home/library',
|
|
||||||
name:t('Header.LIBRARY')
|
|
||||||
},{
|
|
||||||
routerName:['history'],
|
|
||||||
router:'/home/history',
|
|
||||||
name:t('Header.HISTORY')
|
|
||||||
},{
|
|
||||||
routerName:['works'],
|
|
||||||
router:'/home/works',
|
|
||||||
name:t('Header.WORKS')
|
|
||||||
},{
|
|
||||||
routerName:['events','eventsDetail'],
|
|
||||||
router:'/home/events',
|
|
||||||
name:t('Header.EVENTS')
|
|
||||||
},
|
|
||||||
]
|
|
||||||
})
|
})
|
||||||
const setOpenType = (type)=>{
|
const setOpenType = (type,list)=>{
|
||||||
if(homeMainData.openType == type){
|
if(homeMainData.openType == type){
|
||||||
homeMainData.openType = ''
|
homeMainData.openType = ''
|
||||||
}else {
|
}else {
|
||||||
homeMainData.openType = type
|
homeMainData.openType = type
|
||||||
if(type == 'history'){
|
if(type == 'history'){
|
||||||
|
if(list.length == 0){
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
let setPorfolioDom = ()=>{
|
||||||
|
historyData.isShowLoading = false
|
||||||
|
historyData.isNoData = false
|
||||||
|
let imgParent = document.querySelector('.homeMain_max .detailBox .material_content_list_loding .page_loading')
|
||||||
|
new IntersectionObserver(
|
||||||
|
(entries, observer) => {
|
||||||
|
// 如果不是相交,则直接返回
|
||||||
|
if (!entries[0].intersectionRatio) return;
|
||||||
|
getHistory()
|
||||||
|
historyData.page += 1
|
||||||
|
},
|
||||||
|
).observe(imgParent);
|
||||||
|
}
|
||||||
const setRouter = (item,childItem)=>{
|
const setRouter = (item,childItem)=>{
|
||||||
let itemRouter = item.router
|
let itemRouter = item.router
|
||||||
if(childItem.router)itemRouter = itemRouter + '?' + childItem.router
|
if(childItem.router)itemRouter = itemRouter + '?' + childItem.router
|
||||||
router.push(itemRouter)
|
router.push(itemRouter)
|
||||||
}
|
}
|
||||||
|
const setHistory = (item,childItem)=>{
|
||||||
|
router.push(`/home?history=${childItem.id}`)
|
||||||
|
// router.push(`/home?history=${childItem.id}`)
|
||||||
|
}
|
||||||
|
const getHistory = ()=>{
|
||||||
|
if(historyData.isShowLoading && !historyData.isNoData)return
|
||||||
|
historyData.isShowLoading = true
|
||||||
|
let data = {
|
||||||
|
classificationIdList:[],
|
||||||
|
page:historyData.page,
|
||||||
|
size:historyData.size,
|
||||||
|
collectionName:historyData.searchCollectionName,
|
||||||
|
// startDate:startDate,
|
||||||
|
// endDate:endDate,
|
||||||
|
// intersection:1,
|
||||||
|
}
|
||||||
|
Https.axiosPost( Https.httpUrls.historyProject, data).then(
|
||||||
|
// Https.axiosPost( Https.httpUrls.queryUserGroup, data).then(
|
||||||
|
(rv) => {
|
||||||
|
if(data.page == 1 && rv.content.length == 0){
|
||||||
|
historyData.isNull = true
|
||||||
|
}else{
|
||||||
|
historyData.isNull = false
|
||||||
|
}
|
||||||
|
if (rv.content.length > 0) {
|
||||||
|
historyData.isNull = false
|
||||||
|
homeMainData.openTypeList.history.list.push(...rv.content)
|
||||||
|
} else {
|
||||||
|
historyData.isNoData = true
|
||||||
|
}
|
||||||
|
historyData.isShowLoading = false
|
||||||
|
}
|
||||||
|
).catch(res=>{
|
||||||
|
historyData.isShowMark = false
|
||||||
|
if(data.page == 1){
|
||||||
|
historyData.isNull = true
|
||||||
|
}
|
||||||
|
historyData.isNoData = true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
const editHistory = (item,index,el)=>{
|
||||||
|
if(historyData.selectHistoryIndex == -1){
|
||||||
|
let top = el.target.parentNode.parentNode.getBoundingClientRect().top
|
||||||
|
let parentTop = el.target.parentNode.parentNode.parentNode.offsetTop
|
||||||
|
let parentHeight = el.target.parentNode.parentNode.parentNode.offsetHeight
|
||||||
|
let operation = el.target.parentNode.querySelector('.operation')
|
||||||
|
historyData.selectHistoryIndex = index
|
||||||
|
//判断弹窗是加载按钮上面还是下面
|
||||||
|
if((parentTop+parentHeight)/2 < top){//加在按钮上面
|
||||||
|
operation.classList.add('active')
|
||||||
|
}else{
|
||||||
|
operation.classList.remove('active')
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
historyData.selectHistoryIndex = -1
|
||||||
|
}
|
||||||
|
let operationCli = ()=>{
|
||||||
|
historyData.selectHistoryIndex = -1
|
||||||
|
document.removeEventListener("click", operationCli);
|
||||||
|
}
|
||||||
|
document.addEventListener("click",operationCli,);
|
||||||
|
}
|
||||||
|
const editName = (item)=>{
|
||||||
|
historyData.selectHistoryIndex = -1
|
||||||
|
homeMainData.openTypeList.history.list.forEach((item)=>{
|
||||||
|
item.editName = false
|
||||||
|
})
|
||||||
|
item.editName = true
|
||||||
|
historyData.historyTextarea = item.name
|
||||||
|
}
|
||||||
|
const deleteItem = ()=>{
|
||||||
|
|
||||||
|
}
|
||||||
|
const accomplishHistory = (item)=>{
|
||||||
|
let data = {
|
||||||
|
libraryIds:[],
|
||||||
|
libraryName:historyData.historyTextarea,//library名字
|
||||||
|
userGroupName:historyData.historyTextarea,//history名字
|
||||||
|
userGroupId :item.id,//history id
|
||||||
|
timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||||
|
}
|
||||||
|
Https.axiosPost(Https.httpUrls.saveOrUpdate, data).then(
|
||||||
|
(rv) => {
|
||||||
|
item.name = historyData.historyTextarea
|
||||||
|
item.editName = false
|
||||||
|
historyData.historyTextarea = ''
|
||||||
|
}
|
||||||
|
).catch((res)=>{
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
const newProject = ()=>{
|
||||||
|
router.push('/home')
|
||||||
|
}
|
||||||
return {
|
return {
|
||||||
store,
|
store,
|
||||||
userDetail,
|
userDetail,
|
||||||
t,
|
t,
|
||||||
...toRefs(homeMainData),
|
...toRefs(homeMainData),
|
||||||
|
...toRefs(historyData),
|
||||||
locale,
|
locale,
|
||||||
isMurmur,
|
isMurmur,
|
||||||
credits,
|
credits,
|
||||||
activeCredits,
|
activeCredits,
|
||||||
getLangIsShowMark,
|
getLangIsShowMark,
|
||||||
navRouterList,
|
|
||||||
messageNum,
|
messageNum,
|
||||||
messageType,
|
messageType,
|
||||||
...toRefs(stateList),
|
...toRefs(stateList),
|
||||||
@@ -413,6 +565,12 @@ export default defineComponent({
|
|||||||
openUpgradeToPro,
|
openUpgradeToPro,
|
||||||
setOpenType,
|
setOpenType,
|
||||||
setRouter,
|
setRouter,
|
||||||
|
setHistory,
|
||||||
|
editHistory,
|
||||||
|
editName,
|
||||||
|
deleteItem,
|
||||||
|
accomplishHistory,
|
||||||
|
newProject,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
@@ -440,10 +598,6 @@ export default defineComponent({
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
directives:{
|
directives:{
|
||||||
moveOpenDetal:{
|
|
||||||
mounted (el,binding) {
|
|
||||||
},
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
async mounted() {
|
async mounted() {
|
||||||
await new Promise((resolve, reject) => {
|
await new Promise((resolve, reject) => {
|
||||||
@@ -473,9 +627,7 @@ export default defineComponent({
|
|||||||
|
|
||||||
|
|
||||||
let tl1 = gsap.timeline({ paused: true });
|
let tl1 = gsap.timeline({ paused: true });
|
||||||
let heradeRight = document.querySelector('.homeMain_max .homeMain_right_content')
|
|
||||||
let userDetailMax = document.querySelector('.homeMain_max .homeMain_user')
|
let userDetailMax = document.querySelector('.homeMain_max .homeMain_user')
|
||||||
let userDetailIcon = document.querySelector('.homeMain_max .homeMain_user_icon')
|
|
||||||
let userDetail = document.querySelector('.homeMain_max .homeMain_user_detail')
|
let userDetail = document.querySelector('.homeMain_max .homeMain_user_detail')
|
||||||
// let anmiation = TweenMax.to(userDetailMax,1, {'margin-top':'30px',opacity:1})
|
// let anmiation = TweenMax.to(userDetailMax,1, {'margin-top':'30px',opacity:1})
|
||||||
// anmiation.stop()
|
// anmiation.stop()
|
||||||
@@ -495,7 +647,7 @@ export default defineComponent({
|
|||||||
tl1.play()
|
tl1.play()
|
||||||
}, 500);
|
}, 500);
|
||||||
})
|
})
|
||||||
heradeRight.addEventListener('mouseleave',(event)=>{
|
userDetailMax.addEventListener('mouseleave',(event)=>{
|
||||||
if(overTime){
|
if(overTime){
|
||||||
clearTimeout(overTime)
|
clearTimeout(overTime)
|
||||||
}
|
}
|
||||||
@@ -574,7 +726,6 @@ export default defineComponent({
|
|||||||
let data = {
|
let data = {
|
||||||
userId: this.userDetail.userId,
|
userId: this.userDetail.userId,
|
||||||
};
|
};
|
||||||
// console.log(getCookie("token"));
|
|
||||||
if(this.userDetail.systemUser == 3){
|
if(this.userDetail.systemUser == 3){
|
||||||
await Https.axiosGet(Https.httpUrls.trialUserLogout,).then((rv) => {
|
await Https.axiosGet(Https.httpUrls.trialUserLogout,).then((rv) => {
|
||||||
Https.axiosPost(Https.httpUrls.accountLogout, data).then((rv) => {
|
Https.axiosPost(Https.httpUrls.accountLogout, data).then((rv) => {
|
||||||
@@ -764,7 +915,11 @@ export default defineComponent({
|
|||||||
scrollbar-width: none;
|
scrollbar-width: none;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
> .detail{
|
> .detail{
|
||||||
|
position: relative;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
> img{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
> .detailItem{
|
> .detailItem{
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 1.2rem 1.1rem 1.2rem 2.2rem;
|
padding: 1.2rem 1.1rem 1.2rem 2.2rem;
|
||||||
@@ -774,20 +929,139 @@ export default defineComponent({
|
|||||||
border-radius: .8rem;
|
border-radius: .8rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
> i{
|
> i{
|
||||||
margin-right: .8rem;
|
margin-right: .8rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
> .text{
|
||||||
|
> span{
|
||||||
|
//只在一行显示
|
||||||
|
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
}
|
||||||
&.active{
|
&.active{
|
||||||
background: #f5f5f5;
|
background: #f5f5f5;
|
||||||
}
|
}
|
||||||
&:hover{
|
&:hover{
|
||||||
background: #f5f5f5;
|
background: #f5f5f5;
|
||||||
}
|
}
|
||||||
|
&.history{
|
||||||
|
background: #f5f5f5;
|
||||||
|
&:hover{
|
||||||
|
background: #fdfdfd;
|
||||||
|
}
|
||||||
|
&.active{
|
||||||
|
background: #fdfdfd;
|
||||||
|
}
|
||||||
|
> .text{
|
||||||
|
> span{
|
||||||
|
width: 100%;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 2rem;
|
||||||
|
margin-bottom: .8rem;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
> textarea{
|
||||||
|
resize: none;
|
||||||
|
border: none;
|
||||||
|
background: rgba(0, 0, 0, 0);
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 2rem;
|
||||||
|
height: 4rem;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .type{
|
||||||
|
border: 1px solid #0000000d;
|
||||||
|
padding: .4rem .8rem;
|
||||||
|
border-radius: .8rem;
|
||||||
|
color: #71717a;
|
||||||
|
font-size: 1.4rem;
|
||||||
|
max-width: 70%;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
> .btn{
|
||||||
|
border: 1px solid #0000000d;
|
||||||
|
border-radius: .8rem;
|
||||||
|
margin-left: auto;
|
||||||
|
position: relative;
|
||||||
|
> i{
|
||||||
|
width: 3rem;
|
||||||
|
height: 3rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
> .fi-br-check{
|
||||||
|
border-radius: 50%;
|
||||||
|
background: #38c793;
|
||||||
|
color: #fff;
|
||||||
|
width: 2rem;
|
||||||
|
height: 2rem;
|
||||||
|
}
|
||||||
|
> .operation{
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 3rem;
|
||||||
|
background: #e4e4e7;
|
||||||
|
border: 1px solid #d4d4d8;
|
||||||
|
border-radius: 1rem;
|
||||||
|
z-index: 7;
|
||||||
|
padding: .8rem;
|
||||||
|
box-shadow: 0 0 3.2rem -.8rem #1a1b1e33;
|
||||||
|
position: absolute;
|
||||||
|
&.active{
|
||||||
|
top: auto;
|
||||||
|
bottom: 3rem;
|
||||||
|
}
|
||||||
|
> .item{
|
||||||
|
padding: .8rem;
|
||||||
|
color: #52525b;
|
||||||
|
display: flex;
|
||||||
|
border-radius: .8rem;
|
||||||
|
cursor: pointer;
|
||||||
|
align-items: center;
|
||||||
|
> i{
|
||||||
|
font-size: 1.6rem;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
> span{
|
||||||
|
margin-left: .5rem;
|
||||||
|
}
|
||||||
|
&:hover{
|
||||||
|
background: #efeff1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
> .detailItem:last-child{
|
> .detailItem:last-child{
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
> .material_content_list_loding{
|
||||||
|
text-align: center;
|
||||||
|
height: 50px;
|
||||||
|
.page_loading{
|
||||||
|
display: block;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
img{
|
||||||
|
height: calc(10rem*1.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.active{
|
&.active{
|
||||||
@@ -884,6 +1158,81 @@ export default defineComponent({
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
> .homeMain_right_content {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
.homeMain_icon {
|
||||||
|
font-size: 3.6rem;
|
||||||
|
position: relative;
|
||||||
|
top: 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.username {
|
||||||
|
font-size: 1.6rem;
|
||||||
|
color: #1a1a1a;
|
||||||
|
margin: 0 0.8rem;
|
||||||
|
font-weight: 900;
|
||||||
|
span{
|
||||||
|
margin: .7rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.credits{
|
||||||
|
font-size: 1.6rem;
|
||||||
|
color: #1a1a1a;
|
||||||
|
font-weight: 900;
|
||||||
|
width: auto;
|
||||||
|
padding: 0 1.6rem;
|
||||||
|
cursor: auto;
|
||||||
|
display: flex;
|
||||||
|
line-height: 6rem;
|
||||||
|
height: 6rem;
|
||||||
|
box-sizing: content-box;
|
||||||
|
border-radius: 4rem;
|
||||||
|
span{
|
||||||
|
width: 5rem;
|
||||||
|
display: inline-block;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
margin-right: .9rem;
|
||||||
|
.credits_item{
|
||||||
|
transition: .3s all;
|
||||||
|
// height: 4rem;
|
||||||
|
height: 100%;
|
||||||
|
// height: 3.2rem;
|
||||||
|
div{
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
i{
|
||||||
|
height: 100%;
|
||||||
|
border-left: .1rem solid ;
|
||||||
|
padding-left: 1.3rem;
|
||||||
|
margin-left: 1.5rem;
|
||||||
|
font-size: 1.6rem;
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fi-br-refresh{
|
||||||
|
margin-left: 0;
|
||||||
|
border-left: none;
|
||||||
|
padding-left: 0;
|
||||||
|
&.active{
|
||||||
|
transition: all .3s;
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
> .gallery_btn{
|
> .gallery_btn{
|
||||||
margin-top: 1.2rem;
|
margin-top: 1.2rem;
|
||||||
}
|
}
|
||||||
@@ -898,12 +1247,33 @@ export default defineComponent({
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
> .user{
|
> .user{
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
padding: 2rem 2rem 0 0;
|
||||||
|
> .trialApproval{
|
||||||
|
display: flex;
|
||||||
|
margin-right: 1rem;
|
||||||
|
align-items: center;
|
||||||
|
> .message_iconItem{
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
i{
|
||||||
|
width: 3rem;
|
||||||
|
height: 3rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.homeMain_user{
|
.homeMain_user{
|
||||||
height: 6rem;
|
height: 6rem;
|
||||||
width: 6rem;
|
width: 6rem;
|
||||||
margin-left: auto;
|
// margin-left: auto;
|
||||||
|
|
||||||
position: relative;
|
position: relative;
|
||||||
.homeMain_user_icon{
|
.homeMain_user_icon{
|
||||||
height: 6rem;
|
height: 6rem;
|
||||||
@@ -1064,170 +1434,39 @@ export default defineComponent({
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 0 6rem;
|
padding: 0 6rem;
|
||||||
|
padding-bottom: 2rem;
|
||||||
}
|
}
|
||||||
}
|
> .userSystem{
|
||||||
}
|
top: 0;
|
||||||
}
|
left: 0;
|
||||||
.homeMain_heade {
|
position: absolute;
|
||||||
flex-shrink: 0;
|
width: 100%;
|
||||||
display: flex;
|
|
||||||
// padding: 0 30px;
|
|
||||||
padding: 2rem 6rem;
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
background: rgba(255, 255, 255, 0.2);
|
|
||||||
border-bottom: 1px solid #e1e1e1;
|
|
||||||
position: relative;
|
|
||||||
align-items: center;
|
|
||||||
z-index: 9;
|
|
||||||
background-color: #fff;
|
|
||||||
padding-right: 1rem;
|
|
||||||
.homeMain_right{
|
|
||||||
// width: 33%;
|
|
||||||
width: auto;
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
align-items: center;
|
|
||||||
margin-left: auto;
|
|
||||||
.message{
|
|
||||||
display: flex;
|
|
||||||
width: 6rem;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin: 0 2rem;
|
|
||||||
// padding: 1rem;
|
|
||||||
i{
|
|
||||||
margin-left: 0rem;
|
|
||||||
border-left: none;
|
|
||||||
padding-left: 0rem;
|
|
||||||
height: auto;
|
|
||||||
font-size: 2rem;
|
|
||||||
width: 3rem;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
span{
|
|
||||||
overflow: initial;
|
|
||||||
align-items: center;
|
|
||||||
width: auto;
|
|
||||||
margin: auto;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
.message_iconItem{
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
.message_iconItem_value{
|
|
||||||
padding: 1rem;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-96%);
|
|
||||||
top: 4rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.homeMain_logo {
|
|
||||||
width: 14.4rem;
|
|
||||||
height: 3.2rem;
|
|
||||||
margin: 2.1rem 2.8rem 0 ;
|
|
||||||
// position: absolute;
|
|
||||||
line-height: 2rem;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.homeMain_right_content {
|
|
||||||
// position: absolute;
|
|
||||||
top: 0;
|
|
||||||
// right: 3.2rem;
|
|
||||||
left: 0;
|
|
||||||
display: flex;
|
|
||||||
// width: 36%;
|
|
||||||
margin-right: 7rem;
|
|
||||||
width: auto;
|
|
||||||
height: 100%;
|
|
||||||
align-items: center;
|
|
||||||
.homeMain_icon {
|
|
||||||
font-size: 3.6rem;
|
|
||||||
position: relative;
|
|
||||||
top: 0.3rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.username {
|
|
||||||
font-size: 1.8rem;
|
|
||||||
color: #1a1a1a;
|
|
||||||
margin: 0 0.8rem;
|
|
||||||
font-weight: 900;
|
|
||||||
span{
|
|
||||||
margin: .7rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.credits{
|
|
||||||
font-size: 1.8rem;
|
|
||||||
color: #1a1a1a;
|
|
||||||
font-weight: 900;
|
|
||||||
width: auto;
|
|
||||||
padding: 0 1.6rem;
|
|
||||||
cursor: auto;
|
|
||||||
display: flex;
|
|
||||||
line-height: 6rem;
|
|
||||||
height: 6rem;
|
|
||||||
box-sizing: content-box;
|
|
||||||
border-radius: 4rem;
|
|
||||||
span{
|
|
||||||
width: 5rem;
|
|
||||||
display: inline-block;
|
|
||||||
overflow: hidden;
|
|
||||||
display: flex;
|
|
||||||
margin-right: .9rem;
|
|
||||||
.credits_item{
|
|
||||||
transition: .3s all;
|
|
||||||
// height: 4rem;
|
|
||||||
height: 100%;
|
|
||||||
// height: 3.2rem;
|
|
||||||
div{
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
i{
|
|
||||||
height: 100%;
|
height: 100%;
|
||||||
display: inline-block;
|
background: rgba(0, 0, 0, 0.4);
|
||||||
border-left: .1rem solid ;
|
z-index:2;
|
||||||
padding-left: 1.3rem;
|
display: flex;
|
||||||
margin-left: 1.5rem;
|
justify-content: center;
|
||||||
font-size: 1.8rem;
|
align-items: center;
|
||||||
cursor: pointer;
|
color: #fff;
|
||||||
}
|
font-weight: 600;
|
||||||
|
font-size: 4rem;
|
||||||
.fi-br-refresh{
|
|
||||||
margin-left: 0;
|
|
||||||
border-left: none;
|
|
||||||
padding-left: 0;
|
|
||||||
&.active{
|
|
||||||
transition: all .3s;
|
|
||||||
transform: rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.trialApproval{
|
}
|
||||||
margin-left: 2rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
}
|
||||||
.select_block {
|
.select_block {
|
||||||
z-index: 1050;
|
z-index: 1050;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 15.5rem;
|
right: 0rem;
|
||||||
top: 6rem;
|
top: 4rem;
|
||||||
width: 13.5rem;
|
width: 13.5rem;
|
||||||
background: #ffffff;
|
background: #ffffff;
|
||||||
box-shadow: 0px 0.4rem 0.4rem 0px rgba(0, 0, 0, 0.1);
|
box-shadow: 0px 0.4rem 0.4rem 0px rgba(0, 0, 0, 0.1);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
border: 1px solid #000000;
|
border: 1px solid #000000;
|
||||||
height: auto;
|
height: auto;
|
||||||
|
padding: 2rem;
|
||||||
|
border-radius: 2rem;
|
||||||
// &.select_list{
|
// &.select_list{
|
||||||
// top: 56%;
|
// top: 56%;
|
||||||
// left: 100%;
|
// left: 100%;
|
||||||
|
|||||||
43
src/views/HomeView/Tools.vue
Normal file
43
src/views/HomeView/Tools.vue
Normal file
@@ -0,0 +1,43 @@
|
|||||||
|
<template>
|
||||||
|
<div class="toolsPage">
|
||||||
|
<tools></tools>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
|
||||||
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { Https } from "@/tool/https";
|
||||||
|
import { useStore } from "vuex";
|
||||||
|
import { useI18n } from 'vue-i18n'
|
||||||
|
import tools from '@/component/toolsPage/index.vue'
|
||||||
|
export default defineComponent({
|
||||||
|
components:{
|
||||||
|
tools,
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
},
|
||||||
|
emits:[],
|
||||||
|
setup(props,{emit}) {
|
||||||
|
const store = useStore();
|
||||||
|
const data = reactive({
|
||||||
|
})
|
||||||
|
const dataDom = reactive({
|
||||||
|
})
|
||||||
|
return{
|
||||||
|
...toRefs(dataDom),
|
||||||
|
...toRefs(data),
|
||||||
|
}
|
||||||
|
},
|
||||||
|
provide() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.toolsPage{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -9,7 +9,7 @@
|
|||||||
<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'all' == worksSelect}" @click="setWorksSelect({value:'all'})">All</div>
|
<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'all' == worksSelect}" @click="setWorksSelect({value:'all'})">All</div>
|
||||||
<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'NewYear_2025' == worksSelect}" @click="setWorksSelect({value:'NewYear_2025'})">NewYear_2025</div>
|
<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'NewYear_2025' == worksSelect}" @click="setWorksSelect({value:'NewYear_2025'})">NewYear_2025</div>
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="page_content" >
|
<div class="page_content" ref="autoscrollDom">
|
||||||
<Falls ref="fall" @loadend="isShowMark = false" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
|
<Falls ref="fall" @loadend="isShowMark = false" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
|
||||||
<div class="page_loading_box" v-show="!isNoData">
|
<div class="page_loading_box" v-show="!isNoData">
|
||||||
<span class="page_loading" v-show="!isShowMark"></span>
|
<span class="page_loading" v-show="!isShowMark"></span>
|
||||||
@@ -28,7 +28,7 @@
|
|||||||
</template>
|
</template>
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { LoadingOutlined } from "@ant-design/icons-vue";
|
import { LoadingOutlined } from "@ant-design/icons-vue";
|
||||||
import { defineComponent,h ,toRefs,ref,reactive,onMounted,nextTick,watch,computed} from 'vue'
|
import { defineComponent,h ,toRefs,ref,reactive,onMounted,nextTick,watch,onBeforeUnmount} from 'vue'
|
||||||
// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
|
// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
|
||||||
import { Https } from "@/tool/https";
|
import { Https } from "@/tool/https";
|
||||||
import newScaleImage from "@/component/WorksPage/newScaleImage.vue";
|
import newScaleImage from "@/component/WorksPage/newScaleImage.vue";
|
||||||
@@ -45,6 +45,10 @@ export default defineComponent({
|
|||||||
generalMenu,
|
generalMenu,
|
||||||
},
|
},
|
||||||
props:{
|
props:{
|
||||||
|
autoscroll:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false,
|
||||||
|
},
|
||||||
isScroll:{
|
isScroll:{
|
||||||
type:Boolean,
|
type:Boolean,
|
||||||
default:true,
|
default:true,
|
||||||
@@ -101,6 +105,8 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
isShowMark:false,
|
isShowMark:false,
|
||||||
isNoData:false,//如果数据为空就不加载
|
isNoData:false,//如果数据为空就不加载
|
||||||
|
autoscrollDom:null as any,
|
||||||
|
autoscrollTime:null as any,
|
||||||
})
|
})
|
||||||
let menuList:any = ref([
|
let menuList:any = ref([
|
||||||
{
|
{
|
||||||
@@ -228,7 +234,6 @@ export default defineComponent({
|
|||||||
new IntersectionObserver(
|
new IntersectionObserver(
|
||||||
(entries, observer) => {
|
(entries, observer) => {
|
||||||
// 如果不是相交,则直接返回
|
// 如果不是相交,则直接返回
|
||||||
// console.log(entries[0]);
|
|
||||||
if (!entries[0].intersectionRatio) return;
|
if (!entries[0].intersectionRatio) return;
|
||||||
filter.getListDate.page += 1
|
filter.getListDate.page += 1
|
||||||
getPorfolio()
|
getPorfolio()
|
||||||
@@ -251,6 +256,50 @@ export default defineComponent({
|
|||||||
nextTick(()=>{
|
nextTick(()=>{
|
||||||
setPorfolioDom()
|
setPorfolioDom()
|
||||||
})
|
})
|
||||||
|
//对元素设置自动滚动,每次滚动10px
|
||||||
|
if (prop.autoscroll) {
|
||||||
|
let isAdd = true
|
||||||
|
filter.autoscrollTime = setInterval(() => {
|
||||||
|
// console.log(filter.autoscrollDom.scrollHeight,filter.autoscrollDom.scrollTop+ filter.autoscrollDom.clientHeight)
|
||||||
|
if(filter.autoscrollDom.scrollHeight > filter.autoscrollDom.scrollTop+ filter.autoscrollDom.clientHeight-3 && filter.autoscrollDom.scrollHeight < filter.autoscrollDom.scrollTop+ filter.autoscrollDom.clientHeight+3){
|
||||||
|
isAdd = false
|
||||||
|
}
|
||||||
|
if(filter.autoscrollDom.scrollTop < 3){
|
||||||
|
isAdd = true
|
||||||
|
}
|
||||||
|
if(isAdd){
|
||||||
|
filter.autoscrollDom.scrollTop += 2;
|
||||||
|
}else{
|
||||||
|
filter.autoscrollDom.scrollTop -= 2;
|
||||||
|
}
|
||||||
|
}, 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// const start = filter.autoscrollDom.scrollTop;
|
||||||
|
// const maxScroll = filter.autoscrollDom.scrollHeight - filter.autoscrollDom.clientHeight;
|
||||||
|
// const duration = 3000; // 完整滚动时长(ms)
|
||||||
|
// let startTime:any = null;
|
||||||
|
|
||||||
|
// function animate(currentTime:any) {
|
||||||
|
// if (!startTime) startTime = currentTime;
|
||||||
|
// const elapsed = currentTime - startTime;
|
||||||
|
// const progress = Math.min(elapsed / duration, 1); // 0~1
|
||||||
|
|
||||||
|
// // 缓动函数(easeInOutQuad)
|
||||||
|
// const easeProgress = progress < 0.5
|
||||||
|
// ? 2 * progress * progress
|
||||||
|
// : 1 - Math.pow(-2 * progress + 2, 2) / 2;
|
||||||
|
|
||||||
|
// filter.autoscrollDom.scrollTop = start + (maxScroll - start) * easeProgress;
|
||||||
|
|
||||||
|
// if (progress < 1) {
|
||||||
|
// filter.autoscrollTime = requestAnimationFrame(animate);
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// filter.autoscrollTime = requestAnimationFrame(animate);
|
||||||
|
|
||||||
let data = {
|
let data = {
|
||||||
id:router.currentRoute.value.query?.workId
|
id:router.currentRoute.value.query?.workId
|
||||||
}
|
}
|
||||||
@@ -258,6 +307,9 @@ export default defineComponent({
|
|||||||
getImgScale(data)
|
getImgScale(data)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
clearInterval(filter.autoscrollTime); // 清除定时器
|
||||||
|
})
|
||||||
return {
|
return {
|
||||||
...toRefs(filter),
|
...toRefs(filter),
|
||||||
menuList,
|
menuList,
|
||||||
@@ -298,6 +350,7 @@ export default defineComponent({
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
.page_content{
|
.page_content{
|
||||||
|
scrollbar-width: none;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -110,6 +110,24 @@
|
|||||||
></template>
|
></template>
|
||||||
</a-select>
|
</a-select>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="generalModel_state_item smail" v-if="selectCode == 'Models'">
|
||||||
|
<a-select
|
||||||
|
ref="select"
|
||||||
|
v-model:value="ageGroup"
|
||||||
|
:options="ageGroupList"
|
||||||
|
@change="getLibraryList"
|
||||||
|
style="width:20rem"
|
||||||
|
size="large"
|
||||||
|
:fieldNames="{ label: 'name', value: 'value' }"
|
||||||
|
>
|
||||||
|
<template #suffixIcon
|
||||||
|
><span
|
||||||
|
class="icon iconfont icon-xiala"
|
||||||
|
style="color: #343579"
|
||||||
|
></span
|
||||||
|
></template>
|
||||||
|
</a-select>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -231,7 +249,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 蒙层 start-->
|
<!-- 蒙层 start-->
|
||||||
<div class="mark_loading" v-show="isShowMark || getLangIsShowMark">
|
<div class="mark_loading" v-show="isShowMark">
|
||||||
<a-spin size="large" />
|
<a-spin size="large" />
|
||||||
</div>
|
</div>
|
||||||
<!-- 蒙层 end-->
|
<!-- 蒙层 end-->
|
||||||
@@ -463,7 +481,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>{{ ageGroup }}
|
||||||
|
<mannequinEdit ref="ModelPlacement" :ageGroup="ageGroup" :isPop="true" @submit="getLibraryList"></mannequinEdit>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -471,8 +490,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<searchLabel ref="searchLabel"></searchLabel>
|
<searchLabel ref="searchLabel"></searchLabel>
|
||||||
<scaleImage ref="scaleImage" :isCanvas="selectCode == 'Sketchboard'" :sex="workspace.sex"></scaleImage>
|
<scaleImage ref="scaleImage" :isCanvas="selectCode == 'Sketchboard'" :sex="workspace.sex"></scaleImage>
|
||||||
<ModelPlacement ref="ModelPlacement" @submitModelPlacement="getLibraryList"></ModelPlacement>
|
<!-- <ModelPlacement ref="ModelPlacement" @submitModelPlacement="getLibraryList"></ModelPlacement> -->
|
||||||
<ModelPlacementMobile ref="ModelPlacementMobile" @submitModelPlacement="getLibraryList"></ModelPlacementMobile>
|
|
||||||
<setLabel ref="setLabel"></setLabel>
|
<setLabel ref="setLabel"></setLabel>
|
||||||
<createSlogan ref="createSlogan" @setSloganData="setSloganData"></createSlogan>
|
<createSlogan ref="createSlogan" @setSloganData="setSloganData"></createSlogan>
|
||||||
<UpgradePlan ref="UpgradePlan"></UpgradePlan>
|
<UpgradePlan ref="UpgradePlan"></UpgradePlan>
|
||||||
@@ -485,10 +503,8 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { LoadingOutlined } from "@ant-design/icons-vue";
|
import { LoadingOutlined } from "@ant-design/icons-vue";
|
||||||
import { defineComponent,h ,ref,createVNode,nextTick,watch,provide,computed,reactive,toRefs} from 'vue'
|
import { defineComponent,h ,ref,createVNode,nextTick,watch,provide,computed,reactive,toRefs} from 'vue'
|
||||||
import ModelPlacement from '@/component/LibraryPage/ModelPlacement.vue';
|
|
||||||
// import ModelPlacement from '@/component/LibraryPage/ModelPlacementUpdata.vue';
|
// import ModelPlacement from '@/component/LibraryPage/ModelPlacementUpdata.vue';
|
||||||
import setLabel from '@/component/LibraryPage/setLabel.vue';
|
import setLabel from '@/component/LibraryPage/setLabel.vue';
|
||||||
import ModelPlacementMobile from '@/component/LibraryPage/ModelPlacementMobile.vue';
|
|
||||||
import brandDetail from '@/component/LibraryPage/brandDetail.vue';
|
import brandDetail from '@/component/LibraryPage/brandDetail.vue';
|
||||||
import createBrand from '@/component/LibraryPage/createBrand.vue';
|
import createBrand from '@/component/LibraryPage/createBrand.vue';
|
||||||
import searchLabel from '@/component/LibraryPage/searchLabel.vue';
|
import searchLabel from '@/component/LibraryPage/searchLabel.vue';
|
||||||
@@ -508,11 +524,10 @@ import { remove } from "jszip";
|
|||||||
import createSlogan from "@/component/HomePage/createSlogan.vue";
|
import createSlogan from "@/component/HomePage/createSlogan.vue";
|
||||||
import generalMenu from "@/component/HomePage/generalMenu.vue";
|
import generalMenu from "@/component/HomePage/generalMenu.vue";
|
||||||
import UpgradePlan from "@/component/HomePage/UpgradePlan.vue";
|
import UpgradePlan from "@/component/HomePage/UpgradePlan.vue";
|
||||||
|
import mannequinEdit from "@/component/HomePage/index/model/mannequin/edit.vue";
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
ModelPlacement,
|
|
||||||
setLabel,
|
setLabel,
|
||||||
ModelPlacementMobile,
|
|
||||||
brandDetail,
|
brandDetail,
|
||||||
createBrand,
|
createBrand,
|
||||||
searchLabel,
|
searchLabel,
|
||||||
@@ -523,12 +538,9 @@ export default defineComponent({
|
|||||||
createSlogan,
|
createSlogan,
|
||||||
generalMenu,
|
generalMenu,
|
||||||
UpgradePlan,
|
UpgradePlan,
|
||||||
|
mannequinEdit,
|
||||||
},
|
},
|
||||||
props:{
|
props:{
|
||||||
getLangIsShowMark:{
|
|
||||||
type:Boolean,
|
|
||||||
default:true,
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
@@ -548,7 +560,7 @@ export default defineComponent({
|
|||||||
]
|
]
|
||||||
})
|
})
|
||||||
let selectImgList:any = ref([])
|
let selectImgList:any = ref([])
|
||||||
let selectCode:any = ref('Moodboard')
|
let selectCode:any = ref('')
|
||||||
let searchPictureName = ref('')
|
let searchPictureName = ref('')
|
||||||
let searchPictureSeed:any = ref(0);
|
let searchPictureSeed:any = ref(0);
|
||||||
let designType:any = ref({
|
let designType:any = ref({
|
||||||
@@ -574,6 +586,8 @@ export default defineComponent({
|
|||||||
const pageData = reactive({
|
const pageData = reactive({
|
||||||
isBrandDetail:false,
|
isBrandDetail:false,
|
||||||
brandDNAList:[] as any,
|
brandDNAList:[] as any,
|
||||||
|
ageGroup:'',
|
||||||
|
ageGroupList:computed(()=>store.state.UserHabit.ageGroup),
|
||||||
})
|
})
|
||||||
let designTypeList:any = ref({
|
let designTypeList:any = ref({
|
||||||
Sketchboard:positionType,
|
Sketchboard:positionType,
|
||||||
@@ -733,6 +747,7 @@ export default defineComponent({
|
|||||||
level1Type:selectCode.value,
|
level1Type:selectCode.value,
|
||||||
level2Type:design,
|
level2Type:design,
|
||||||
page:1,
|
page:1,
|
||||||
|
ageGroup:pageData.ageGroup,
|
||||||
modelSex:sex.value?sex.value:'',
|
modelSex:sex.value?sex.value:'',
|
||||||
pictureName:searchPictureName.value,
|
pictureName:searchPictureName.value,
|
||||||
size:pageSize.value,
|
size:pageSize.value,
|
||||||
@@ -797,17 +812,6 @@ export default defineComponent({
|
|||||||
dataDom.createBrand.openAddBrand()
|
dataDom.createBrand.openAddBrand()
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(
|
|
||||||
() => props.getLangIsShowMark, // 这里使用了一个 getter 函数
|
|
||||||
(newValue, oldValue) => {
|
|
||||||
if(!newValue){
|
|
||||||
getLibraryList('')
|
|
||||||
getClass()
|
|
||||||
getSex()
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{immediate: true,}
|
|
||||||
)
|
|
||||||
return {
|
return {
|
||||||
...toRefs(dataDom),
|
...toRefs(dataDom),
|
||||||
...toRefs(pageData),
|
...toRefs(pageData),
|
||||||
@@ -906,9 +910,9 @@ export default defineComponent({
|
|||||||
handler(query, oldQuery) {
|
handler(query, oldQuery) {
|
||||||
if(oldQuery && query?.library == oldQuery?.library)return
|
if(oldQuery && query?.library == oldQuery?.library)return
|
||||||
let str = query.library
|
let str = query.library
|
||||||
|
if(!this.ageGroup)this.ageGroup = this.ageGroupList[0].value
|
||||||
if(!str)str = 'Moodboard'
|
if(!str)str = 'Moodboard'
|
||||||
nextTick(()=>{
|
nextTick(()=>{
|
||||||
console.log()
|
|
||||||
this.selectMenuItem({code:str})
|
this.selectMenuItem({code:str})
|
||||||
// setWorksSelect(str)
|
// setWorksSelect(str)
|
||||||
})
|
})
|
||||||
@@ -922,6 +926,8 @@ export default defineComponent({
|
|||||||
this.isTest =JSON.parse(isTest)
|
this.isTest =JSON.parse(isTest)
|
||||||
this.uploadUrl = getUploadUrl()
|
this.uploadUrl = getUploadUrl()
|
||||||
this.token = getCookie("token") || "";
|
this.token = getCookie("token") || "";
|
||||||
|
this.getClass()
|
||||||
|
this.getSex()
|
||||||
},
|
},
|
||||||
|
|
||||||
methods:{
|
methods:{
|
||||||
@@ -963,13 +969,13 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
selectMenuItem(menu:any){
|
selectMenuItem(menu:any){
|
||||||
|
|
||||||
if(menu.code != this.upload.level1Type){
|
if(menu.code != this.upload.level1Type){
|
||||||
this.selectCode = menu.code
|
this.selectCode = menu.code
|
||||||
this.currentPage = 1
|
this.currentPage = 1
|
||||||
this.total = 0
|
this.total = 0
|
||||||
if(menu.code == 'MyBrand'){
|
if(menu.code == 'MyBrand'){
|
||||||
this.getBrandDNAList()
|
this.getBrandDNAList()
|
||||||
|
this.upload.level1Type = menu.code
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
this.searchPictureName = ''
|
this.searchPictureName = ''
|
||||||
@@ -1390,14 +1396,15 @@ export default defineComponent({
|
|||||||
url:data.url,
|
url:data.url,
|
||||||
name:name,
|
name:name,
|
||||||
}
|
}
|
||||||
this.placementClick(newData)
|
this.placementClick(data)
|
||||||
},
|
},
|
||||||
|
|
||||||
//给模特打点编辑
|
//给模特打点编辑
|
||||||
placementClick(data:any){
|
placementClick(data:any){
|
||||||
// let placementModal:any = isMoible() ? this.$refs.ModelPlacementMobile : this.$refs.ModelPlacement
|
// let placementModal:any = isMoible() ? this.$refs.ModelPlacementMobile : this.$refs.ModelPlacement
|
||||||
let placementModal:any = this.$refs.ModelPlacement
|
let placementModal:any = this.$refs.ModelPlacement
|
||||||
placementModal.showPlacementModal(data,this.sex)
|
placementModal.mannEditMask = false
|
||||||
|
placementModal.showPlacementModal(data,this.sex,'Library')
|
||||||
},
|
},
|
||||||
setTextareaShow(){
|
setTextareaShow(){
|
||||||
this.isTextarea = !this.isTextarea
|
this.isTextarea = !this.isTextarea
|
||||||
@@ -1958,6 +1965,7 @@ export default defineComponent({
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
// width: calc(100% - 23.5rem);
|
// width: calc(100% - 23.5rem);
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
.header_operate_item{
|
.header_operate_item{
|
||||||
margin-right: 5rem;
|
margin-right: 5rem;
|
||||||
color: #C2C2C2;
|
color: #C2C2C2;
|
||||||
|
|||||||
@@ -1,7 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="loginPage">
|
<div class="loginPage">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<Works :isScroll="!isMask" :position="'login'"></Works>
|
<!-- :isScroll="!isMask" -->
|
||||||
|
<Works :autoscroll="true" :position="'login'"></Works>
|
||||||
<div class="mask" v-show="isMask" @click="()=>isMask = !isMask">
|
<div class="mask" v-show="isMask" @click="()=>isMask = !isMask">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="userNum">
|
<div class="userNum">
|
||||||
|
|||||||
Reference in New Issue
Block a user