任务列表页面

2024-03-21 10:49:21 +08:00
parent c5e3a5036d
commit c8f6884e7d
23 changed files with 1353 additions and 184 deletions
--- a/public/index.html
+++ b/public/index.html
@@ -8,14 +8,14 @@
    <title>AiDA</title>
    <!-- <link href="https://fonts.font.im/css?family=Roboto:400,500,700,700i" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet"> -->
-	<link rel="stylesheet" href="./css/googleapis.css">
-	<link rel="stylesheet" href="./css/roboto.css">
+	<link rel="stylesheet" href="/css/googleapis.css">
+	<link rel="stylesheet" href="/css/roboto.css">
  </head>
  <body>
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/color-thief/2.3.0/color-thief.umd.js"></script> -->
-	<script src="./js/color-thief.js"></script>
-	<script src="./js/fabric.min.js"></script>
-	<script src="./js/fabric.brushes.js"></script>
+	<script src="/js/color-thief.js"></script>
+	<script src="/js/fabric.min.js"></script>
+	<script src="/js/fabric.brushes.js"></script>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
--- a/src/assets/style/style.less
+++ b/src/assets/style/style.less
@@ -452,6 +452,7 @@ input:focus{
 	// min-width: 1440px;
 	border-radius: 1rem;
 	overflow: hidden;
+	// height: 100%;
 	height: calc(100% - 7rem);
 	bottom: 0;
 	top: auto;
--- a/src/component/Administrator/TestClickData.vue
+++ b/src/component/Administrator/TestClickData.vue
@@ -53,15 +53,9 @@
 </template>
 <script lang="ts">
 import { defineComponent, ref, createVNode, computed } from "vue";
-import HeaderComponent from "@/component/HomePage/Header.vue";
-import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
 import { Https } from "@/tool/https";
-import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 export default defineComponent({
    components: {
-        HeaderComponent,
-        HistoryDetail,
-        RobotAssist,
    },
    setup() {
        let rangePickerValue: any = ref([]);
--- a/src/component/Administrator/allUser.vue
+++ b/src/component/Administrator/allUser.vue
@@ -29,21 +29,10 @@
 </template>
 <script lang="ts">
 import { defineComponent, ref, createVNode, computed } from "vue";
-import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
-import HeaderComponent from "@/component/HomePage/Header.vue";
-import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
-import router from "@/router/index";
 import { Https } from "@/tool/https";
-import { formatTime } from "@/tool/util";
-import { Modal, message } from "ant-design-vue";
-import RobotAssist from "@/component/HomePage/RobotAssist.vue";
-import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
-import { useI18n } from "vue-i18n";
+import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
 export default defineComponent({
    components: {
-        HeaderComponent,
-        HistoryDetail,
-        RobotAssist,
    },
    setup() {
        let renameData: any = ref({}); //修改名字选中的数据
--- a/src/component/Administrator/trialApproval.vue
+++ b/src/component/Administrator/trialApproval.vue
@@ -68,20 +68,10 @@
 <script lang="ts">
 import { defineComponent, ref, createVNode, computed } from "vue";
 import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
-import HeaderComponent from "@/component/HomePage/Header.vue";
-import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
-import router from "@/router/index";
 import { Https } from "@/tool/https";
-import { formatTime } from "@/tool/util";
 import { Modal, message } from "ant-design-vue";
-import RobotAssist from "@/component/HomePage/RobotAssist.vue";
-import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
-import { useI18n } from "vue-i18n";
 export default defineComponent({
    components: {
-        HeaderComponent,
-        HistoryDetail,
-        RobotAssist,
    },
    setup() {
        let renameData: any = ref({}); //修改名字选中的数据
--- a/src/component/HomePage/ExportModel.vue
+++ b/src/component/HomePage/ExportModel.vue
@@ -187,7 +187,7 @@
 				</div>
 				<div class="exportCanvasBox_right_btn">
 					<div class="subitOkPreviewBtn" :class="{active:credits<1}" @click="setHDExport">HD Export</div>
-					<div class="subitOkPreviewBtn" @click="setExport">Export</div>
+					<div class="subitOkPreviewBtn Guide_1_32" @click="setExport">Export</div>
 				</div>
            </div>
            <div class="mark_loading" v-show="isShowMark">
@@ -204,7 +204,9 @@ import scaleImage from "@/component/HomePage/scaleImage.vue";
 import ExportNewCoolection from "@/component/HomePage/ExportNewCoolection.vue";
 import { useStore } from "vuex";
 import JSZip, { forEach } from "jszip";
+// import fabric from 'fabric';
 import { message, Modal } from "ant-design-vue";
+import { openGuide,driverObj__ } from "@/tool/guide";
 const FileSaver = require("file-saver");
 import { exportSele,JSRectUpdata,JSchangeType,JScanvasMouseDown,JScanvasMouseMove,JScreateCheck,JSSetTexture } from "@/tool/canvasDrawing";
 export default defineComponent({
@@ -214,6 +216,9 @@ export default defineComponent({
    },
    props: ["msg", "sketchCatecoryList"],
    setup() {
+		let driver__ = computed(()=>{
+			return store.state.Guide.guide
+		})
        const store = useStore();

        let showUpgradePlan = ref(false);
@@ -271,6 +276,8 @@ export default defineComponent({
                    height: canvasWH.value.height,
                    isDrawingMode: false, // 开启绘图模式
                });
+				brushIndicator = clearBrushIndicator()
+
 				JSchangeType(canvas,'init')
 				canvasOnDrop()//开启鼠标到画布事件
 				setRemoveImage()//设置元素删除
@@ -411,7 +418,11 @@ export default defineComponent({
 					}
                }
 				updateCanvasState('')//加载完成后记录一下
+				if(driver__.value.driver){
+					driverObj__.moveNext()
+				}
            });
+			
        };
 		let deleteObject = (eventData, transform)=> {
 				// var target = [transform.target];
@@ -610,6 +621,9 @@ export default defineComponent({
                        FileSaver.saveAs(content, "DesignFiles"); // 利用file-saver保存文件  自定义文件名
                        isShowMark = false;
                    });
+					if(driver__.value.driver){
+						driverObj__.moveNext()
+					}
                })
                .catch((res) => {
                    // message.warning(t('HomeView.jsContent3'));
@@ -910,7 +924,7 @@ export default defineComponent({
 		}
 		let textureList = ref([])
 		for (let index = 0; index < 20; index++) {
-			textureList.value.push({value:index,url:`./image/texture/texture${index}.webp`})
+			textureList.value.push({value:index,url:`/image/texture/texture${index}.webp`})
 		}
 		let setTexture = async ()=>{
 			canvas.isDrawingMode = true//开启绘画模式
@@ -942,16 +956,20 @@ export default defineComponent({
 			}

 		}
-		let brushIndicator = new fabric.Circle({
-			radius:canvasPencilWidth.value/2,
-            fill: '#fff',
-			stroke: '#000',
-			strokeWidth: 0,
-            originX: 'center',
-            originY: 'center',
-			visible :true,
-			erasable: false,
-        });
+		let clearBrushIndicator = ()=>{
+			let cator = new fabric.Circle({
+				radius:canvasPencilWidth.value/2,
+				fill: '#fff',
+				stroke: '#000',
+				strokeWidth: 0,
+				originX: 'center',
+				originY: 'center',
+				visible :true,
+				erasable: false,
+			});
+			return cator
+		}
+		let brushIndicator 
 		let hexToRgba=(hex, alpha)=> {
 			const r = parseInt(hex.slice(1, 3), 16);
 			const g = parseInt(hex.slice(3, 5), 16);
@@ -961,31 +979,31 @@ export default defineComponent({
 		let brushList = ref([
 			{
 				value:'PencilBrush',
-				url:'./image/brush/PencilBrush.jpg'
+				url:'/image/brush/PencilBrush.jpg'
 			},{
 				value:'Marking',
-				url:'./image/brush/PencilBrush-2.jpg'
+				url:'/image/brush/PencilBrush-2.jpg'
 			},{
 				value:'InkBrush',
-				url:'./image/brush/InkBrush.jpg'
+				url:'/image/brush/InkBrush.jpg'
 			},{
 				value:'CrayonBrush',
-				url:'./image/brush/CrayonBrush.jpg'
+				url:'/image/brush/CrayonBrush.jpg'
 			},{
 				value:'RibbonBrush',
-				url:'./image/brush/RibbonBrush.jpg'
+				url:'/image/brush/RibbonBrush.jpg'
 			},{
 				value:'MarkerBrush',
-				url:'./image/brush/MarkerBrush.jpg'
+				url:'/image/brush/MarkerBrush.jpg'
 			},{
 				value:'WritingBrush',
-				url:'./image/brush/WritingBrush.jpg'
+				url:'/image/brush/WritingBrush.jpg'
 			},{
 				value:'LongfurBrush',
-				url:'./image/brush/LongfurBrush.jpg'
+				url:'/image/brush/LongfurBrush.jpg'
 			},{
 				value:'SpraypaintBrush',
-				url:'./image/brush/SpraypaintBrush.jpg'
+				url:'/image/brush/SpraypaintBrush.jpg'
 			},
 		])
 		let setPencil =()=>{
--- a/src/component/HomePage/Header.vue
+++ b/src/component/HomePage/Header.vue
@@ -47,38 +47,22 @@
 					<i @click="Assignment" class="fi fi-rr-gift" title="Assignment"></i>
 					<i @click="UpgradePlan" title="Purchase" class="fi fi-rr-shop"></i>
                </div>
-				<!-- <div
-					v-if="userInfo.userId == 83"
-					class="trialApproval button_second"
-                    @click="turnToPage('trialApproval')"
-                >
-					Trial Approval
-                </div> -->
            </div>
            <nav class="header_nav_content">
-                <div
-                    :class="[
-                        'nav_item',
-                        $route.name === 'home' ? 'select_nav' : '',
+                <div :class="['nav_item',$route.name === 'home' ? 'select_nav' : '',
                    ]"
                    @click="turnToPage('home')"
                >
 					{{$t('Header.HOME')}}
                </div>
                <div
-                    :class="[
-                        'nav_item',
-                        $route.name === 'library' ? 'select_nav' : '',
-                    ]"
+                    :class="['nav_item', $route.name === 'library' ? 'select_nav' : '',]"
                    @click="turnToPage('library')"
                >
 					{{$t('Header.LIBRARY')}}
                </div>
                <div
-                    :class="[
-                        'nav_item',
-                        $route.name === 'history' ? 'select_nav' : '',
-                    ]"
+                    :class="['nav_item',$route.name === 'history' ? 'select_nav' : '',]"
                    @click="turnToPage('history')"
                >
 					{{$t('Header.HISTORY')}}
@@ -92,8 +76,7 @@
                @click="turnToNewPage('https://www.aidlab.hk/en/')"
                src="@/assets/images/loginPage/aida_logo.png"
            />
-			<Habit></Habit>
-
+				<Habit></Habit>
 			</div>
        </header>
 		<nav class="select_block" v-show="isShowOperate">
--- a/src/component/HomePage/TaskDetailPage.vue
+++ b/src/component/HomePage/TaskDetailPage.vue
@@ -0,0 +1,327 @@
+<template>
+    <a-modal
+        class="modal_component TaskDetail_modal payOrder_modal"
+        v-model:visible="showPayOrder"
+        :footer="null"
+        width="78%"
+        :maskClosable="false"
+        :centered="true"
+        :closable="false"
+        wrapClassName="#app"
+        :keyboard="false"
+    >
+		<div class="payOrder_page ">
+			<div class="closeIcon">
+				<i class="fi fi-rr-cross-small" @click.stop="cancelDsign()"></i>
+			</div>
+			<div class="creditsDetail_table_search allOrder_table_search">
+				<div class="creditsDetail_state allOrder_state">
+					<div class="creditsDetail_state_item allOrder_state_item">
+						<span>State:</span>
+						<a-select style="width:25rem" v-model:value="currentState.value" size="large" optionFilterProp="label" :options="state" placeholder="Please select" allowClear show-search></a-select>
+					</div>
+				</div>
+
+				
+				<div class="creditsDetail_search allOrder_search">
+					<div
+						class="creditsDetail_search_item allOrder_search_item"
+						@click="searchcreditsDetailList()"
+					>
+						<span
+							class="icon iconfont icon-sousuo"
+						></span>
+					</div>
+				</div>
+			</div>
+			<div class="TaskDetail_page" ref="historyTable">
+				<a-table
+					:columns="columns"
+					:data-source="collectionList"
+					:scroll="{ y: historyTableHeight }"
+					@change="changePage"
+					:pagination="{
+						showSizeChanger: true,
+						current: currentPage,
+						pageSize: pageSize,
+						total: total,
+						showQuickJumper: true,
+						bordered: false,
+					}"
+				>
+					<template
+						#bodyCell="{ column, text, record, index }"
+					>
+						<div
+							class="operate_list"
+							v-if="column?.Operations"
+						>
+							<div class="operate_item">{{ $t('HistoryPage.Delete') }}</div>
+						</div>
+					</template>
+				</a-table>
+			</div>
+		</div>
+      
+	
+    </a-modal>
+	<div class="mark_loading" v-show="loadingShow">
+		<a-spin size="large" />
+	</div>
+</template>
+<script lang="ts">
+import { defineComponent, ref, createVNode, computed, nextTick } from "vue";
+import { Https } from "@/tool/https";
+import { formatTime } from "@/tool/util";
+import { Modal, message } from "ant-design-vue";
+import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
+import { useI18n } from "vue-i18n";
+export default defineComponent({
+    components: {
+    },
+    setup() {
+        let presentState: any = ref('paypal');
+        let showPayOrder: any = ref(false);
+        let loadingShow: any = ref(false);//原因
+        let { t } = useI18n();
+		const columns: any = computed(() => {
+            return [
+                {
+                    title: "Serial",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "orderNo",
+                    key: "orderNo",
+                },
+                {
+                    title: "Title",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "title",
+                    key: "title",
+                },
+                {
+                    title: "Money",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "totalFee",
+                    key: "totalFee",
+                },
+                {
+                    title: "Payment",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "paymentType",
+                    key: "paymentType",
+                },
+                {
+                    title: "State",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "orderStatus",
+                    key: "orderStatus",
+                },
+
+                // {
+                //     title: useI18n().t("HistoryPage.Operations"),
+                //     key: "operation",
+                //     align: "center",
+                //     // slots:{customRender:'action'}
+                //     Operations: true,
+                // },
+            ];
+		
+        });
+		let currentState = ref({
+			value:'income',
+		})
+		let state:any = ref([
+			{
+				label:'Income',
+				value:'income',
+			},
+			{
+				label:'Expend',
+				value:'expend',
+			},
+		])
+        let collectionList: any = ref([]);
+        return {
+            presentState,
+            showPayOrder,
+			loadingShow,
+            t,
+			columns,
+			currentState,
+			state,
+			collectionList,
+        };
+    },
+    data() {
+        return {
+			currentPage: 1,
+            pageSize: 10,
+            total: 0,
+			historyTableHeight: 0,
+        };
+    },
+    mounted() {
+		// let historyTable: any = this.$refs.historyTable;
+        // this.historyTableHeight = historyTable.clientHeight - 130;
+		// console.log(historyTable);
+	},
+    methods: {
+        init() {
+            this.showPayOrder = true;
+			this.currentPage = 1
+			this.pageSize = 10
+			this.getTaskDetail()
+        },
+		 //改变页码
+		 changePage(e: any) {
+            this.currentPage = e.current
+            this.pageSize = e.pageSize
+            this.getTaskDetail();
+        },
+		//查询列表
+		searchcreditsDetailList() {
+            this.currentPage = 1;
+            this.getTaskDetail();
+        },
+		getTaskDetail() {
+			let data = {
+				isIncome: this.currentState.value == 'income'?true:false,
+				page:this.currentPage,
+                size:this.pageSize,
+			}
+			console.log(data);
+			// getCreditsDetail
+			// orderInfoList
+            Https.axiosPost(Https.httpUrls.getCreditsDetail,data).then((rv: any) => {
+                this.total = rv.length;
+                this.collectionList = rv
+				if(this.currentPage > 1 && rv.content.length == 0){
+					this.currentPage = 1
+					this.getTaskDetail()
+				}else{
+					this.collectionList = rv.content
+					this.total = rv.total
+				}
+				
+            });
+        },
+		cancelDsign(){
+			this.showPayOrder = false
+		}
+    },
+});
+</script>
+<style lang="less">
+.TaskDetail_modal {
+   
+}
+</style>
+<style lang="less">
+.payOrder_modal {
+    .closeIcon {
+        z-index: 2;
+    }
+    .payOrder_page {
+        width: 100%;
+        height: 100%;
+        padding: 9rem;
+        overflow: hidden;
+        // min-width: 1440px;
+        position: relative;
+		.allOrder_table_search {
+		display: flex;
+		margin-top: 2rem;
+		padding: 2rem 3.5rem 5rem 2.8rem;
+		background: #fff;
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+		
+		.allOrder_search{
+			width: 20%;
+			.allOrder_search_item{
+				background: #343579;
+				border-color: #343579;
+				height: 4rem;
+				padding: .64rem 1.5rem;
+				font-size: 1.6rem;
+				border-radius: 2px;
+				display: inline-block;
+				color: #fff;
+				cursor: pointer;
+			}
+		}
+		.allOrder_state {
+			position: relative;
+			display: flex;
+			align-items: center;
+			width: 80%;
+			.allOrder_state_item{
+				display: flex;
+				align-items: center;
+				margin-right: 5rem;
+				>span{
+					font-size: 2rem;
+					font-weight: 400;
+					color: #030303;
+					margin-right: 15px;
+					flex-shrink: 0;
+					display: block;
+					min-width: 5rem;
+					text-align: left;
+				}
+				.ant-picker-range{
+					height: 5rem;
+				}
+				.ant-select-lg{
+					font-size: 14px;
+					.ant-select-selector{
+						height: 5rem;
+						.ant-select-selection-item{
+							line-height: 5rem;
+						}
+						input{
+							line-height: 5rem;
+							height: 5rem;
+						}
+					}
+				}
+			}
+			.allOrder_current{
+				background: #fff;
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+			}
+			.header_user_content {
+				position: absolute;
+				border: 2px solid;
+				border-radius: 1rem;
+				overflow: hidden;
+				top: 0;
+				transform: translateY(6rem);
+				z-index: 2;
+				display: none;
+				margin-left: -2rem;
+				.username{
+					padding: 0 2rem;
+					color: #000;
+				}
+				.username:hover{
+					background: #e1e1e1;
+				}
+				&.active{
+					display: block;
+				}
+			}
+		}
+	}
+	}
+}
+</style>
--- a/src/component/HomePage/TaskPage.vue
+++ b/src/component/HomePage/TaskPage.vue
@@ -7,8 +7,30 @@
 		placement="right"
 		@after-visible-change="afterVisibleChange"
 	>
+		<template #extra>
+			<div class="button_second" @click="openTaskDetailPage">Detailed Task</div>
+		</template>
 		<div class="task_content">
 			<div class="task_content_item" v-for="item in taskList">
+				<img v-if="item.state !== 'success'" src="@/assets/images/homePage/loading.gif" alt="">
+				<img v-else :src="item.inputParam.images" alt="">
+				<div class="task_content_item_text">
+					<div class="task_content_item_text_left modal_title_text">
+						<div class="task_content_item_text_left_titile">{{ item.title }}</div>
+						<div class="task_content_item_text_left_into modal_title_text_intro">{{ item.createDate }}</div>
+					</div>
+					<div class="task_content_item_text_right modal_title_text">
+						<div class="task_content_item_text_left_titile">{{ item.status }}</div>
+					</div>
+				</div>
+			</div>
+			<div class="task_content_more" v-show="taskListMore.length == 0" @click="setTaskListMore">
+				点击查看更多
+			</div>
+			<div class="task_content_select" v-show="taskListMore.length > 0">
+				<a-select :visibleChange="visibleChange()" v-model:value="currentState.value" size="large" optionFilterProp="label" :options="state" placeholder="Please select" :getPopupContainer="getPopupContainer" allowClear show-search></a-select>
+			</div>
+			<div class="task_content_item" v-for="item in taskListMore" v-show="taskListMore.length > 0">
 				<img v-if="item.state === '执行中' || item.state === '失败'" src="@/assets/images/homePage/loading.gif" alt="">
 				<img v-else :src="item.url" alt="">
 				<div class="task_content_item_text">
@@ -21,10 +43,11 @@
 					</div>
 				</div>
 			</div>
-			<div class="task_content_more">
-				点击查看更多
+			<div v-show="total > taskListMore?.length && total != 0 && taskListMore.length > 0" class="task_content_more" v-observe>
+				<img src="@/assets/images/homePage/loading.gif" alt="">
 			</div>
 		</div>
+		<TaskDetailPage ref="TaskDetailPage"></TaskDetailPage>
 	</a-drawer>
 </template>
 <script lang="ts">
@@ -32,12 +55,11 @@ import { message, Upload } from "ant-design-vue";
 import { defineComponent, computed, h, ref, nextTick, inject } from "vue";
 import { Https } from "@/tool/https";
 import { useStore } from "vuex";
-import GO from "@/tool/GO";
 // import { forEach } from "jszip";
-import scaleImage from "@/component/HomePage/scaleImage.vue";
+import TaskDetailPage from "@/component/HomePage/TaskDetailPage.vue";
 export default defineComponent({
 	components: {
-		scaleImage,	
+		TaskDetailPage,	
 	},
    props: ["msg",'sketchCatecoryList'],
    setup() {
@@ -45,41 +67,64 @@ export default defineComponent({
        const store = useStore();
       	let visible = ref<boolean>(false);
 		let taskList = ref([
-			{
-				title:'111111111111',
-				state:'执行中',
-				url:'@/assets/images/homePage/loading.gif',
-				time:'2024-3-18'
-			},{
-				title:'111111111111',
-				state:'已完成',
-				url:'./image/texture/texture0.webp',
-				time:'2024-3-18'
-			},{
-				title:'111111111111',
-				state:'失败',
-				url:'@/assets/images/homePage/loading.gif',
-				time:'2024-3-18'
-			},{
-				title:'111111111111',
-				state:'执行中',
-				url:'@/assets/images/homePage/loading.gif',
-				time:'2024-3-18'
-			},
+		
 		])
+		let taskListMore:any = ref([])
+		let state:any = ref([
+			{
+				label:'Income',
+				value:'income',
+			},
+			{
+				label:'Expend',
+				value:'expend',
+			}
+		])
+		let currentState = ref({
+			value:'income',
+		})
        return {
 			store,
 			visible,
 			taskList,
+			taskListMore,
+			state,
+			currentState,
        };
    },
    data(prop) {
        return {
+			currentPage: 1,
+            pageSize: 10,
+            total: 99,
 		}
    },
 	
    mounted() {
    },
+	directives:{
+		observe:{
+			mounted (el,binding) {
+				// console.log(binding.instance);
+				const ob = new IntersectionObserver(callback,{
+					root:null,
+					threshold:[0.1]
+				})
+				ob.observe(el)
+				// this.currentPage = 1
+				// this.pageSize = 12
+				let this_:any = binding.instance
+				function callback(entries:any, observer:any) {
+					entries.forEach((entry:any) => {
+						if (entry.isIntersecting) {
+							this_.getTaskList()
+						} else {
+						}
+					});
+				}
+			},
+		},
+	},
 	watch:{
 		// newWindowState:{
 		// 	handler(newVal,oldVal){
@@ -92,11 +137,55 @@ export default defineComponent({
 		
 	},
    methods: {
+		getPopupContainer(){
+			let dom = document.querySelector('.task_page .task_content_select')
+			return dom
+		},
        init(){
 			this.visible = true
+			Https.axiosGet(Https.httpUrls.getTasksList).then((rv)=>{
+
+				this.taskList = this.sort(rv)
+			})
+		},
+		sort(arr:any){
+			arr.sort((a:any, b:any) => {
+				var a_num = Date.parse(a.createDate);
+				var b_num = b.style.zIndex;
+				return a_num - b_num;
+			});
+			return arr
 		},
 		afterVisibleChange(bool:any){
+			if(!bool){
+				this.taskListMore = []
+			}
 			console.log(bool);
+		},
+		setTaskListMore(){
+			// this.taskListMore = this.taskList
+			
+			this.taskListMore.push(...this.taskList,...this.taskList)
+		},
+		openTaskDetailPage(){
+			let taskDetailPage:any = this.$refs.TaskDetailPage
+			this.visible = false
+			taskDetailPage.init()
+		},
+		visibleChange(){
+			this.pageSize = 10
+			this.currentPage = 1
+			this.total = 0
+		},
+		getTaskList(){
+			let data = {
+				size:this.pageSize,
+                page: this.currentPage,
+				aaa:this.currentState,
+			}
+			console.log(123123);
+			this.currentPage += 1
+			Https.axiosGet()
 		}
    },
 });
@@ -174,8 +263,17 @@ export default defineComponent({
 			line-height: 5rem;
 			text-align: center;
 			cursor: pointer;
+			img{
+				width: 100%;
+				height: 5rem;
+				object-fit: contain;
+			}
+		}
+		.task_content_select{
+			>div{
+				width: 100%;
+			}
 		}
-
 	}
 }
 	
--- a/src/component/HomePage/UpgradePlan.vue
+++ b/src/component/HomePage/UpgradePlan.vue
@@ -208,7 +208,11 @@ export default defineComponent({
 			// console.log(this.modeOfPayment,'alipay','paypal');
 			let url = window.location.href 
 			// url = url.replace(/\/[^/]+$/, '') + '/home';
-			url = url.replace(/\/[^/]+$/, '') + '/paySucceed';
+			// console.log(url);
+			let parsedUrl = new URL(url);
+			parsedUrl.pathname = '/';
+			console.log(parsedUrl);
+			url = parsedUrl.href + 'paySucceed';
 			if(!this.clause){
 				return
 			}
--- a/src/component/Pay/allOrder.vue
+++ b/src/component/Pay/allOrder.vue
@@ -22,7 +22,6 @@
 				</div>
 			</div>

-			
 			<div class="allOrder_search">
 				<div
 					class="allOrder_search_item"
@@ -257,7 +256,6 @@ export default defineComponent({
 			position: relative;
 			display: flex;
 			align-items: center;
-			cursor: pointer;
 			width: 80%;
 			.allOrder_state_item{
 				display: flex;
--- a/src/component/Pay/creditsDetail.vue
+++ b/src/component/Pay/creditsDetail.vue
@@ -22,7 +22,7 @@
 				</div>
 				<div class="creditsDetail_state_item">
 					<span>State:</span>
-					<a-select v-model:value="currentState.value" size="large" optionFilterProp="label" :options="state" placeholder="Please select" allowClear show-search></a-select>
+					<a-select v-model:value="currentState.value" style="width:25rem" size="large" optionFilterProp="label" :options="state" placeholder="Please select" allowClear show-search></a-select>
 				</div>
 			</div>

--- a/src/lang/en.ts
+++ b/src/lang/en.ts
@@ -414,7 +414,8 @@ export default {
 		guide46:"Preview printed design here.",
 		guide47:"Save printed design here.",
 		guide48:"Click here to finalize your modification.",
-		guide49:"Click here to export the collection you just designed.",
-		guide50:"Your guide is complete, and now the canvas is yours to create freely. For more insights and details, check out our demo video on the homepage at <a href='https://code-create.com.hk/aida/' style='pointer-events: auto;' target='_blank'>https://code-create.com.hk/aida/</a><br>You can restart the tutorial at any time by simply telling the robot that you want to.",
+		guide49:"Click here to access the export page.",
+		guide50:"Click here to export the collection you just designed.",
+		guide51:"Your guide is complete, and now the canvas is yours to create freely. For more insights and details, check out our demo video on the homepage at <a href='https://code-create.com.hk/aida/' style='pointer-events: auto;' target='_blank'>https://code-create.com.hk/aida/</a><br>You can restart the tutorial at any time by simply telling the robot that you want to.",
 	},
 }
--- a/src/main.ts
+++ b/src/main.ts
@@ -14,18 +14,12 @@ import i18n from './lang/index'
 import { getBrowserInfo, murmur } from './tool/util'
 import "../node_modules/@flaticon/flaticon-uicons/css/all/all.css"
 import { Https } from "@/tool/https";
+// import "@/tool/color-thief.js";
+// import "@/tool/fabric.brushes.js";
+// import "@/tool/fabric.min.js";

 flexible()
 import { getCookie, setCookie } from "@/tool/cookie";
-let token = getCookie("token");
-// Https.axiosGet(Https.httpUrls.endpoint)
-// 			.then((rv) => {
-// 				console.log(rv);
-				
-// 			})
-// 			.catch((res) => {
-// 			});
-
 router.beforeEach((to, from, next) => {
 	if(to.name == "login"){
 		if(window.location.search.substring(1) != 'oldHis'){
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -3,7 +3,8 @@ import { defineAsyncComponent } from 'vue'
 import { getBrowserInfo, murmur } from '@/tool/util'
 import { getCookie, setCookie } from "@/tool/cookie";
 const _import = (path: string) => defineAsyncComponent(() => import(`../views/${path}.vue`));
-const _import_custom = (path : string) => defineAsyncComponent(() => import(`../component/${path}`));
+const _import_component = (path : string) => defineAsyncComponent(() => import(`../component/${path}`));
+const _import_custom = (path : string) => defineAsyncComponent(() => import(`../views/${path}`));

 const routes: Array<RouteRecordRaw> = [
 	{
@@ -22,21 +23,45 @@ const routes: Array<RouteRecordRaw> = [
 		name: 'upgrade',
 		component: _import('Upgrade'),
 	},
+	// {
+	// 	path: '/home',
+	// 	name: 'home',
+	// 	component: _import('HomeView')
+	// },
 	{
 		path: '/home',
 		name: 'home',
-		component: _import('HomeView')
+		component: _import('HomeMain'),
+		children:[
+			{
+				path: "",
+				redirect: "home/homePage"
+			},
+			{
+				path:'homePage',
+				name:'homePage',
+				component: _import_custom('HomeView/HomeView.vue'),
+			},{
+				path:'library',
+				name:'library',
+				component: _import_custom('HomeView/library.vue'),
+			},{
+				path:'history',
+				name:'history',
+				component: _import_custom('HomeView/history.vue'),
+			},
+		]
 	},
 	{
 		path: '/demo',
 		name: 'demo',
 		component: _import('Demo')
 	},
-	{
-		path: '/history',
-		name: 'history',
-		component: _import('HistoryPage')
-	},
+	// {
+	// 	path: '/history',
+	// 	name: 'history',
+	// 	component: _import('history')
+	// },
 	// {
 	// 	path: '/testClickData',
 	// 	name: 'testClickData',
@@ -50,17 +75,17 @@ const routes: Array<RouteRecordRaw> = [
 			{
 				path:'allUser',
 				name:'allUser',
-				component: _import_custom('Administrator/allUser.vue'),
+				component: _import_component('Administrator/allUser.vue'),
 			},
 			{
 				path:'testClickData',
 				name:'testClickData',
-				component: _import_custom('Administrator/TestClickData.vue'),
+				component: _import_component('Administrator/TestClickData.vue'),
 			},
 			{
 				path:'trialApproval',
 				name:'trialApproval',
-				component: _import_custom('Administrator/trialApproval.vue'),
+				component: _import_component('Administrator/trialApproval.vue'),
 			},
 		]
 	},
@@ -74,11 +99,11 @@ const routes: Array<RouteRecordRaw> = [
 		name: 'paySucceed',
 		component: _import('paySucceed')
 	},
-	{
-		path: '/library',
-		name: 'library',
-		component: _import('LibraryPage')
-	},
+	// {
+	// 	path: '/library',
+	// 	name: 'library',
+	// 	component: _import('library')
+	// },
 	// {
 	// 	path: '/trialApproval',
 	// 	name: 'trialApproval',
@@ -125,7 +150,6 @@ router.beforeEach((to, from, next) => {
 			return false
 		}
 	});
-	
 	if (routeExists) {
 		if (isMurmur && murmurStr && token) {
 			const toName = to.name === 'login';
--- a/src/tool/cookie.js
+++ b/src/tool/cookie.js
@@ -2,7 +2,7 @@ const setCookie = (name,value) => {
    var Days = 100;
    var exp = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
-    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
+    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString()+ ";Path=/";
 }

 const getCookie = (name) => {
--- a/src/tool/guide.js
+++ b/src/tool/guide.js
@@ -111,14 +111,15 @@ function createDriver(){
 			{ element: '.Guide_1_25_1', popover: { title: '', description: i18n.guide47 ,side: "right",align: 'end' } },
 			{ element: '.Guide_1_26', popover: { title: '', description: i18n.guide48 } },
 			{ element: '.Guide_1_31', popover: { title: '', description: i18n.guide49 } },
-			{ element: '.Guide_1_99', popover: { title: 'Begin Your Design', description: i18n.guide50 } },
+			{ element: '.Guide_1_32', popover: { title: '', description: i18n.guide50 } },
+			{ element: '.Guide_1_99', popover: { title: 'Begin Your Design', description: i18n.guide51 } },
 		  ],
 		//   showProgress: true,//控制总页数和当前页数是否显示
 		allowClose:false,
 		showButtons:false,
 		stagePadding:10,//切口到元素的距离
 		stageRadius:5,//切口圆弧度
-		allowKeyboardControl:false,//控制是否可以键盘控制下一步
+		allowKeyboardControl:true,//控制是否可以键盘控制下一步
 		disableActiveInteraction:false,//是否禁用显示元素的交互
 		overlayOpacity:.4,
 		overlay: true,
@@ -136,6 +137,7 @@ function createDriver(){
 				driver : true,
 				stepsLenth:stepsLenth,
 			}
+			console.log(111);
 			store?.commit("setGuide", data);
 			if(options.state.activeIndex ==  0 ||
 				options.state.activeIndex ==  39
--- a/src/tool/https.js
+++ b/src/tool/https.js
@@ -210,6 +210,9 @@ export const Https = {
 		//查询某个时间内design点击次数
 		getDesignStatistic:`/api/inquiry/getDesignStatistic`,//拒绝审批

+		getTasksList:`/api/tasks/getList`,//获取档期那任务列表
+		getDesignStatistic:`/api/inquiry/getDesignStatistic`,//拒绝审批
+
    },

    axiosGet(url,config) {
--- a/src/views/HomeMain.vue
+++ b/src/views/HomeMain.vue
@@ -0,0 +1,765 @@
+<template>
+    <div class="homeMain_max Guide_1_16_1">
+        <header class="homeMain_heade">
+            <div class="homeMain_right_content">
+                <div class="homeMain_user_icon"></div>
+                <div class="homeMain_user_content">
+                    <div v-if="isTest" class="username"><span>/</span> {{$t('Header.hello')}}@{{ $t('isTest.userName') }}</div>
+                    <div v-else class="username"><span>/</span> {{$t('Header.hello')}}@{{ userInfo?.userName }}</div>
+                    <div
+						v-if="!isMurmur"
+                        :class="[
+                            'icon',
+                            'iconfont',
+                            'icon-xiala',
+                            isShowOperate ? 'icon_rotate' : '',
+                        ]"
+                        @click.stop="changeShowOperateContent()"
+                    ></div>
+                   
+                </div>
+				<div @click="openTask">abc</div>
+				<div
+					class="trialApproval button_second credits hideChecked"
+                >
+					Credits:&nbsp;
+					<span :title="credits">
+						<!-- <div>{{ String(credits.value[credits.value.legnth-1]) }}</div> -->
+						<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="Assignment" class="fi fi-rr-gift" title="Assignment"></i>
+					<i @click="UpgradePlan" title="Purchase" class="fi fi-rr-shop"></i>
+                </div>
+            </div>
+            <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>
+            </nav>
+           
+			<div class="homeMain_right">
+				<img
+                class="homeMain_logo"
+                @click="turnToNewPage('https://www.aidlab.hk/en/')"
+                src="@/assets/images/loginPage/aida_logo.png"
+            />
+				<Habit></Habit>
+			</div>
+			<nav class="select_block" v-show="isShowOperate">
+				<!-- <div class="select_item" @click="showBindEmailModal()">
+					<span class="icon iconfont icon-youxiang"></span><span class="select_item_des">{{$t('Header.bindEmail')}}</span>
+				</div> -->
+				<div class="select_item" @click.stop="isLanguage = !isLanguage">
+					<span class="icon iconfont icon-yuyan"></span>
+					<span class="select_item_des">{{$t('Header.language')}}</span>
+				</div>
+				<div class="select_item" @click="orderForm()">
+					
+					<i class="fi fi-rs-notebook"></i>
+					<span class="select_item_des">View Orders</span>
+				</div>
+				<div class="select_item" @click="logout()">
+					<span class="icon iconfont icon-tuichu"></span
+					><span class="select_item_des">{{$t('Header.logOff')}}</span>
+				</div>
+				
+			</nav>
+			<ul class="select_block select_list" v-show="isLanguage">
+				<li class="select_item" v-for="item in language"  @click="setLocale(item.value)">
+					<span class="select_item_des">{{ item.name }}</span>
+				</li>
+			</ul>
+			<payOrder ref="payOrder"></payOrder>
+			<UpgradePlan ref="UpgradePlan"></UpgradePlan>
+			<TaskPage ref="TaskPage"></TaskPage>
+        </header>
+	
+		<div class="homeMain_content_body">
+			<router-view/>
+		</div>
+		<RobotAssist></RobotAssist>
+    </div>
+	
+</template>
+<script >
+import { defineComponent, createVNode, ref, computed } from "vue";
+import { isEmail } from "@/tool/util";
+import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
+import payOrder from "@/component/Pay/payOrder.vue";
+import VerificationCodeInput from "@/component/LoginPage/verificationCodeInput.vue";
+import Habit from "@/component/Detail/habit.vue";
+import TaskPage from "@/component/HomePage/TaskPage.vue";
+import UpgradePlan from "@/component/HomePage/UpgradePlan.vue";
+import { Https } from "@/tool/https";
+import { Modal, message } from "ant-design-vue";
+import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
+import RobotAssist from "@/component/HomePage/RobotAssist.vue";
+import { useStore } from "vuex";
+import { setLang } from "@/tool/guide";
+import { useI18n } from "vue-i18n";
+export default defineComponent({
+    components: {
+        VerificationCodeInput,
+		Habit,
+		RobotAssist,
+		UpgradePlan,
+		payOrder,
+		TaskPage,
+    },
+	setup(){
+        const store = useStore();
+		const {t} = useI18n()
+		const {locale} = useI18n()
+		let isTest = ref()
+		let isMurmur = ref()
+		let credits = computed(()=>{
+			return store.state.UserHabit.credits.value
+		})
+		let activeCredits = ref(false)
+		return {
+			store,
+			t,
+			locale,
+			isTest,
+			isMurmur,
+			credits,
+			activeCredits,
+		}
+	},
+    data() {
+        return {
+            isShowOperate: false,
+            bindEmailVisible: false,
+            isHaveBindEmail: false,
+            bindEmailStep: 1,
+            email: "",
+            emailCode: ["", "", "", "", "", ""], //邮箱验证码
+            time: 60, //60秒倒计时
+            timer: 0,
+            userInfo: {},
+            timerOperate: null,
+            numTime: 30,
+            timerSec: null,
+            modalWarning: null,
+            isLanguage: false,
+
+			language:[
+				{name:'English',value:'ENGLISH'},
+				{name:'中文',value:'CHINESE_SIMPLIFIED'},
+				// {name:'한국인',value:'KOREAN'},
+				// {name:'にほんご',value:'JAPANESE'},
+				// {name:'Русский',value:'RUSSIAN'},
+				// {name:'Français',value:'FRENCH'},
+				// {name:'แบบไทย',value:'THAI'},
+				// {name:'Tiếng Việt',value:'VIETNAMESE'},
+				// {name:'Italiano',value:'ITALIAN'},       
+			],
+        };
+    },
+	watch: {
+		// credits.value(newVal,oldVal){
+		// 	console.log(String(newVal).length);
+		// }
+	},
+    mounted() {
+        let isTest = getCookie('isTest')//获取是否是试用用户
+        this.isTest =JSON.parse(isTest)
+        let isMurmur = getCookie('isMurmur')//获取是否是试用用户
+        this.isMurmur =JSON.parse(isMurmur)
+        this.userInfo = JSON.parse(getCookie("userInfo"));
+        if (!this.userInfo) {
+            this.$router.replace("/login");
+        } else {
+            this.accountIsLogin(this.userInfo);
+        }
+        this.isHaveBindEmail = this.userInfo?.email ? true : false;
+		if(!isMurmur){
+			this.operateClick();
+			document.addEventListener("click", this.operateClick);
+		}
+		this.getCredits()
+		this.getLang('')
+    },
+    methods: {
+        turnToNewPage(url) {
+            window.open(url);
+        },
+
+        turnToPage(name) {
+            let noRefresh = name === "home" ? true : false;
+            this.$router.push({ name: name, params: { noRefresh: noRefresh } });
+        },
+		UpgradePlan(){//购买积分
+			let UpgradePlan = this.$refs.UpgradePlan
+			UpgradePlan.init()
+		},
+		Assignment(){//任务
+			// let num = 123+this.credits
+			// this.store.commit('setCredits',num)
+		},
+		getCredits(){//刷新当前积分
+			if(!this.activeCredits){
+				this.activeCredits = true
+				this.store.dispatch('getCredits').then((rv)=>{
+					setTimeout(()=>{
+						this.activeCredits = false
+					},300)
+				})
+			}else{
+				this.activeCredits = false
+			}
+			
+			
+		},
+        //点击下拉图标出现操作
+        changeShowOperateContent() {
+            this.isShowOperate = !this.isShowOperate;
+            document.addEventListener(
+                "click",
+                this.closeShowOperateContent,
+                false
+            );
+        },
+		changeLanguage(){
+			this.isLanguage = !this.isLanguage;
+            document.addEventListener(
+                "click",
+                this.closeShowOperateContent,
+                false
+            );
+		},
+
+        //关闭下拉图标
+        closeShowOperateContent() {
+            this.isShowOperate = false;
+			this.isLanguage = false
+            document.removeEventListener("click", this.closeShowOperateContent);
+        },
+
+        //打开绑定邮箱弹窗
+        showBindEmailModal() {
+            this.bindEmailVisible = true;
+        },
+
+        emailNextStepFun() {
+            if (!isEmail(this.email)) {
+                message.info(this.t('Header.jsContent1'));
+                return;
+            }
+            let data = {
+                email: this.email,
+                operationType: "BIND_MAILBOX",
+            };
+            const hide = message.loading("loading", 0);
+            Https.axiosPost(Https.httpUrls.accountSendEmail, data)
+                .then((rv) => {
+                    if (rv) {
+                        this.bindEmailStep = 2;
+                        (this.emailCode = ["", "", "", "", "", ""]),
+                            this.createTimer();
+                        hide();
+                        message.success(this.t('Header.jsContent2'));
+                    }
+                })
+                .catch((res) => {
+                    hide();
+                });
+        },
+
+        //绑定邮箱的上一步
+        emailLastStepFun() {
+            this.bindEmailStep = 1;
+            this.email = "";
+            (this.emailCode = ["", "", "", "", "", ""]), this.clearTimer();
+        },
+
+        //创建定时器
+        createTimer() {
+            this.timer = setInterval(() => {
+                this.time--;
+                if (!this.time) {
+                    clearInterval(this.timer);
+                }
+            }, 1000);
+        },
+
+        //清除定时器
+        clearTimer() {
+            this.time = 60;
+            if (this.timer) {
+                clearInterval(this.timer);
+            }
+        },
+		//查看订单
+		orderForm(){
+			let payOrder = this.$refs.payOrder
+			payOrder.init()
+		},
+        //登出
+        async logout() {
+            let data = {
+                userId: this.userInfo.userId,
+            };
+			let isTest = getCookie('isTest')
+			// console.log(getCookie("token"));
+			if(JSON.parse(isTest)){
+				await Https.axiosGet(Https.httpUrls.trialUserLogout,).then((rv) => {
+					Https.axiosPost(Https.httpUrls.accountLogout, data).then((rv) => {
+						this.$router.replace("/login");
+						WriteCookie("token");
+					});
+				})
+			}else{
+				await Https.axiosPost(Https.httpUrls.accountLogout, data).then((rv) => {
+					WriteCookie("token");
+				});
+				this.$router.replace("/login");
+			}
+			// window.location.reload()
+            
+        },
+
+        //绑定邮箱
+        submitBindEmail(emailVerifyCode) {
+            let data = {
+                userEmail: this.email,
+                userId: this.userInfo.userId,
+                emailVerifyCode: emailVerifyCode,
+            };
+            Https.axiosPost(Https.httpUrls.accountBindEmail, data).then(
+                (rv) => {
+                    if (rv) {
+                        this.userInfo.email = this.email;
+                        setCookie("userInfo", JSON.stringify(this.userInfo));
+                        (this.bindEmailVisible = false),
+                            (this.bindEmailStep = 1);
+                        this.clearTimer();
+                        this.emailCode = ["", "", "", "", "", ""];
+                    }
+                }
+            );
+        },
+
+        //判断是否登录
+        accountIsLogin(userInfo) {
+            let data = {
+                userId: userInfo.userId,
+            };
+            Https.axiosPost(Https.httpUrls.accountIsLogin, data).then((rv) => {
+                if (!rv) {
+                    this.$router.replace("/login");
+                }
+            });
+        },
+
+        //点击重置判断是否长时间五操作
+        operateClick() {
+            if (this.timer) {
+                clearTimeout(this.timer);
+            }
+            let _this = this;
+            let timeNum = 1000 * 60 * 120;
+            this.timer = setTimeout(() => {
+                this.modalWarning = Modal.warning({
+                    title: () =>
+						this.t('Header.jsContent3',{numTime:_this.numTime}),
+                    icon: createVNode(ExclamationCircleOutlined),
+                    okText: "Ok",
+					centered:true,
+                    onOk() {
+                        _this.numTime = 30;
+                        clearInterval(_this.timerSec);
+                    },
+                });
+                _this.numCounter();
+            }, timeNum);
+        },
+
+        numCounter() {
+            this.timerSec = setInterval(() => {
+                if (this.numTime > 0) {
+                    this.numTime = this.numTime - 1;
+                } else {
+                    clearTimeout(this.timer);
+                    clearInterval(this.timerSec);
+                    this.logout();
+                    this.modalWarning.destroy();
+                }
+            }, 1000);
+        },
+		//获取当前语言
+		getLang(v){
+			let data
+			Https.axiosPost(Https.httpUrls.getUserLanguage, data).then(
+                (rv) => {
+                    if (rv) {
+						this.locale = rv
+						setLang(rv)
+                    }
+                }
+            );
+		},
+		setLang(v){
+			
+			Https.axiosGet(Https.httpUrls.changeUserLanguage,{params:{language:v}}).then((rv) => {
+				if (rv) {
+					if (rv) {
+                        let token = rv;
+                        setCookie("token", token);
+						this.getLang('')
+						// if(this.$router.currentRoute._value.path == '/home'){
+						// 	this.$router.push("/home")
+						// }else{
+						// 	this.$router.push("/home")
+						// }
+						this.store.commit('clearAllData')
+						window.location.reload()
+                    }
+				}
+			})
+		},
+		
+		setLocale(v){
+			this.setLang(v)
+		},
+		openTask(){
+			let taskPage = this.$refs.TaskPage
+			taskPage.init()
+		},
+    },
+});
+</script>
+
+<style lang="less" scoped>
+.homeMain_max{
+	position: relative;
+	display: flex;
+	height: 100%;
+	flex-direction: column;
+	.homeMain_content_body{
+		flex: 1;
+	}
+}
+.homeMain_heade {
+    display: flex;
+	justify-content: space-between;
+	// padding: 0 30px;
+	padding: 0 9rem;
+    width: 100%;
+    height: 7rem;
+    background: rgba(255, 255, 255, 0.2);
+    // border-bottom: 0.1rem solid rgba(3, 3, 3, 0.1);
+    position: relative;
+    align-items: center;
+
+	z-index: 1049;
+	background-color: #fff;
+	.homeMain_right{
+		width: 33%;
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+	}
+    .homeMain_logo {
+        width: 14.4rem;
+        height: 3.2rem;
+        margin: 2.1rem 2.8rem 0 ;
+		// position: absolute;
+		margin-top: 0;
+    }
+
+    .homeMain_nav_content {
+        display: flex;
+        // margin-left: 28.9rem;
+		// margin-left: 46.2rem;
+        align-items: 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:nth-child(3){
+				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%;
+			}
+        }
+    }
+
+    .homeMain_right_content {
+        // position: absolute;
+        top: 0;
+        // right: 3.2rem;
+		left: 0;
+        display: flex;
+		width: 33%;
+		height: 100%;
+		align-items: center;
+		overflow: hidden;
+        .homeMain_icon {
+            font-size: 3.6rem;
+            position: relative;
+            top: 0.3rem;
+        }
+		.homeMain_user_icon{
+			height: 4rem;
+			width: 4rem;
+			background-color: #000;
+			border-radius: 50%;
+			transform: translateX(-40%)scale(1.3);
+		}
+        .homeMain_user_content {
+            // margin-left: 2rem;
+            display: flex;
+            align-items: center;
+            position: relative;
+            // top: 1.2rem;
+            height: 3.7rem;
+			&.marLeft2{
+				margin-left: 2rem;
+			}
+            .username {
+                font-size: 1.8rem;
+                color: #1a1a1a;
+                margin: 0 0.8rem;
+				font-weight: 900;
+				span{
+					margin: .7rem;
+				}
+            }
+			
+            .icon-xiala {
+                font-size: 1.4rem;
+                cursor: pointer;
+				transition: .3s all;
+            }
+
+            .icon_rotate {
+                -moz-transform: rotate(180deg);
+                -webkit-transform: rotate(180deg);
+                transform: rotate(180deg);
+                animation-direction: 0.5s;
+            }
+        }
+		.credits{
+			font-size: 1.8rem;
+			color: #1a1a1a;
+			font-weight: 900;
+			width: auto;
+			padding: 0 1rem;
+			cursor: auto;
+			display: flex;
+			span{
+				width: 5rem;
+				display: inline-block;
+				overflow: hidden;
+				display: flex;
+				margin-right: .9rem;
+				.credits_item{
+					transition: .3s all;
+					div{
+						height: 100%;
+					}
+				}
+			}
+			i{
+				height: 100%;
+				display: inline-block;
+				border-left: .1rem solid ;
+				padding-left: .9rem;
+				margin-left: .9rem;
+				font-size: 1.8rem;
+				cursor: pointer;
+			}
+			.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 {
+	z-index: 1050;
+	position: absolute;
+	left: 15.5rem;
+	top: 4.7rem;
+	width: 11.4rem;
+	background: #ffffff;
+	box-shadow: 0px 0.4rem 0.4rem 0px rgba(0, 0, 0, 0.1);
+	overflow: hidden;
+	border: 1px solid #000000;
+	&.select_list{
+		// display: none;
+		transform: translateX(105%);
+		// transform: translateX(120%);
+	}
+	.select_item {
+		padding-left: 1.5rem;
+		height: 4.1rem;
+		color: #4d4d4d;
+		display: flex;
+		align-items: center;
+		cursor: pointer;
+		user-select: none;
+
+		&:hover {
+			background: #f7f7f7;
+		}
+
+		.iconfont {
+			font-size: 1.4rem;
+		}
+
+		.select_item_des {
+			font-size: 1.3rem;
+			margin-left: 0.8rem;
+		}
+	}
+}
+.modal_component {
+    .skip_content {
+        width: 6rem;
+        height: 3rem;
+        line-height: 2.8rem;
+        border: 0.1rem solid #343579;
+        font-size: 1.4rem;
+        color: #343579;
+        position: absolute;
+        top: 1.8rem;
+        right: 1.8rem;
+        cursor: pointer;
+    }
+
+    .bind_email_content {
+        padding: 4.8rem 9.2rem 6rem;
+
+        .bind_email_tip {
+            font-size: 1.8rem;
+            color: #a5b0c2;
+            line-height: 1.9rem;
+            text-align: center;
+        }
+        .bind_email {
+            margin-top: 2rem;
+            font-size: 2.2rem;
+            font-weight: 400;
+            color: #030303;
+            text-align: center;
+        }
+
+        .bind_email_form_content {
+            .bind_email_form_title {
+                font-size: 2.2rem;
+                font-weight: bold;
+                color: #030303;
+                line-height: 2.4rem;
+            }
+
+            .bind_email_form_input {
+                width: 100%;
+                height: 4.6rem;
+                margin-top: 1rem;
+                border: 0.1rem solid #b4bed7;
+                padding-left: 2.1rem;
+                line-height: 4.6rem;
+                font-size: 1.8rem;
+                box-sizing: border-box;
+
+                &::placeholder {
+                    color: #a5b0c2;
+                }
+            }
+        }
+
+        .bind_email_submit_button {
+            height: 4.6rem;
+            line-height: 4.6rem;
+            background: #343579;
+            font-size: 1.6rem;
+            font-weight: 500;
+            color: #ffffff;
+            width: 12.8rem;
+            text-align: center;
+            cursor: pointer;
+            margin: 3rem auto 0;
+        }
+
+        .icon--shangyibu {
+            font-size: 2.5rem;
+            font-weight: bold;
+            color: #030303;
+        }
+
+        .email_last_step_content {
+            margin-left: 1rem;
+            font-size: 2.2rem;
+            font-family: PingFang SC;
+            font-weight: bold;
+            color: #030303;
+        }
+
+        .tip_content {
+            font-size: 1.3rem;
+            font-weight: bold;
+            color: #343579;
+            cursor: pointer;
+        }
+
+        .email_last_step_des {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            margin-top: 2.5rem;
+            margin-bottom: 1.5rem;
+
+            .sent_email_content {
+                font-size: 1.8rem;
+                font-weight: bold;
+                color: #a5b0c2;
+            }
+        }
+    }
+}
+</style>
--- a/src/views/HomeView/HomeView.vue
+++ b/src/views/HomeView/HomeView.vue
@@ -1,6 +1,6 @@
 <template>
-	<div class="home_page Guide_1_16_1">
-		<HeaderComponent></HeaderComponent>
+	<div class="home_page">
+		<!-- <HeaderComponent></HeaderComponent> -->
 		<div class="page_content">
 			<!-- <img class="page_content_bg" src="@/assets/images/homePage/bg.png" /> -->
 			<div class="page_content_body">
@@ -209,7 +209,7 @@
 		</div>
 		<!-- design collection的进度蒙层  end-->
 		<affiche ref="affiche"></affiche>
-		<RobotAssist></RobotAssist>
+		<!-- <RobotAssist></RobotAssist> -->

 	</div>

@@ -218,14 +218,14 @@
 <script lang="ts">
 import { defineComponent, h, ref, computed ,inject,provide,nextTick,createVNode} from "vue";
 // import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
-import HeaderComponent from "@/component/HomePage/Header.vue";
+// import HeaderComponent from "@/component/HomePage/Header.vue";
 import CollectionModal from "@/component/HomePage/collectionModal.vue";
 import NewCollectionReview from "@/component/HomePage/NewCollectionReview.vue";
 import ExportNewCoolection from "@/component/HomePage/ExportNewCoolection.vue";
 import ExportModel from "@/component/HomePage/ExportModel.vue";
 import affiche from "@/component/HomePage/affiche.vue";
 import DesignDetail from "@/component/Detail/DesignDetail.vue";
-import RobotAssist from "@/component/HomePage/RobotAssist.vue";
+// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import html2canvas from "html2canvas";
 import { message,Modal } from "ant-design-vue";
 import { useStore } from "vuex";
@@ -234,7 +234,7 @@ import { rgbToHsv, dataURLtoBlob } from "@/tool/util";
 import { openGuide,driverObj__ } from "@/tool/guide";
 import { LoadingOutlined } from "@ant-design/icons-vue";
 import draggable from 'vuedraggable'
-import JSZip, { forEach } from "jszip";
+// import JSZip, { forEach } from "jszip";
 import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
 import i18n from "@/lang";
 import { useI18n } from "vue-i18n";
@@ -242,14 +242,14 @@ const FileSaver = require("file-saver");

 export default defineComponent({
 	components: {
-		HeaderComponent,
+		// HeaderComponent,
 		CollectionModal,
 		NewCollectionReview,
 		DesignDetail,
 		ExportNewCoolection,
 		ExportModel,
 		affiche,
-		RobotAssist,
+		// RobotAssist,
 		draggable
 	},
 	setup() {
@@ -1009,6 +1009,7 @@ export default defineComponent({
 		exportModel(){
 			let exportModel:any = this.$refs.ExportModel
 			exportModel.init()
+			
 		},

 		//打开图片详情
@@ -1071,7 +1072,7 @@ export default defineComponent({

 			.home_page_body {
 				width: 100%;
-				height: calc(100% - 7rem);
+				height: 100%;
 				display: flex;
 				// padding-left: 0.7rem;
 				box-sizing: border-box;
@@ -1396,27 +1397,4 @@ export default defineComponent({
 		}
 	}
 }
-</style>
-<style lang="less">
-
-	.ant-modal-mask{
-		background: linear-gradient(45deg, #eee4f3, #f3f4e6);
-		// min-width: 1440px;
-		border-radius: 1rem;
-		overflow: hidden;
-		height: calc(100% - 7rem);
-		bottom: 0;
-		top: auto;
-		margin: 0 9rem;
-	}
-	.ant-modal-centered{
-	top: 7rem;
-	// min-width: 1440px;
-	// left: 50%;
-	// margin-left: -50%;
-	.ant-modal{
-		// min-width: .65*1440px;
-	}
-	}
-
 </style>
--- a/src/views/HomeView/history.vue
+++ b/src/views/HomeView/history.vue
@@ -6,7 +6,7 @@
                src="@/assets/images/homePage/bg.png"
            />
            <div class="page_content_body">
-                <HeaderComponent></HeaderComponent>
+                <!-- <HeaderComponent></HeaderComponent> -->
                <div class="history_page_body">
                    <div class="history_header">{{ $t('HistoryPage.History') }}</div>
                    <div class="history_table_search">
@@ -80,7 +80,7 @@
        <HistoryDetail ref="historyDetail" :groupDetails="groupDetails" :collectionName="collectionName"></HistoryDetail>

 		<setLabel ref="setLabel"></setLabel>
-		<RobotAssist></RobotAssist>
+		<!-- <RobotAssist></RobotAssist> -->
 		<searchLabel ref="searchLabel"></searchLabel>
 		<div class="mark_loading" v-show="isShowMark">
            <a-spin size="large" />
@@ -89,12 +89,12 @@
 </template>
 <script lang="ts">
 import { defineComponent,ref,createVNode,computed,nextTick,provide} from 'vue'
-import HeaderComponent from "@/component/HomePage/Header.vue";
+// import HeaderComponent from "@/component/HomePage/Header.vue";
 import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
 import { Https } from "@/tool/https";
 import { formatTime } from "@/tool/util"
 import { Modal,message } from 'ant-design-vue';
-import RobotAssist from "@/component/HomePage/RobotAssist.vue";
+// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
 import { ElCascader } from 'element-plus'
 import { useI18n } from 'vue-i18n';
@@ -103,9 +103,9 @@ import searchLabel from '@/component/LibraryPage/searchLabel.vue';

 export default defineComponent({
    components: {
-        HeaderComponent,
+        // HeaderComponent,
        HistoryDetail,
-		RobotAssist,
+		// RobotAssist,
 		setLabel,
 		ElCascader,
 		searchLabel
@@ -319,7 +319,7 @@ export default defineComponent({
        },

        retrieveHome(record:any){
-            this.$router.push({name:'home',params: {id:record.id}})
+            this.$router.push({name:'homePage',params: {id:record.id}})
        },


@@ -388,7 +388,7 @@ export default defineComponent({

            .history_page_body{
                width: 100%;
-                height: calc(100% - 7rem);
+                height: 100%;
                padding: 0 2.5rem 4rem;
                box-sizing: border-box;

--- a/src/views/HomeView/library.vue
+++ b/src/views/HomeView/library.vue
@@ -6,7 +6,7 @@
                src="@/assets/images/homePage/bg.png"
            /> -->
            <div class="page_content_body">
-                <HeaderComponent></HeaderComponent>
+                <!-- <HeaderComponent></HeaderComponent> -->
                <div class="library_page_body">
                    <div class="library_body_left">
 						<div>
@@ -324,19 +324,19 @@

        </div>
        <!-- 蒙层 end-->
-		<RobotAssist></RobotAssist>
+		<!-- <RobotAssist></RobotAssist> -->

    </div>
 </template>
 <script lang="ts">
 import { LoadingOutlined } from "@ant-design/icons-vue";
 import { defineComponent,h ,ref,createVNode,nextTick,provide,computed} from 'vue'
-import HeaderComponent from "@/component/HomePage/Header.vue";
+// import HeaderComponent from "@/component/HomePage/Header.vue";
 import ModelPlacement from '@/component/LibraryPage/ModelPlacement.vue';
 import setLabel from '@/component/LibraryPage/setLabel.vue';
 import ModelPlacementMobile from '@/component/LibraryPage/ModelPlacementMobile.vue';
 import searchLabel from '@/component/LibraryPage/searchLabel.vue';
-import RobotAssist from "@/component/HomePage/RobotAssist.vue";
+// import RobotAssist from "@/component/HomePage/RobotAssist.vue";
 import { Modal,message,Upload,CascaderProps } from 'ant-design-vue';
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
 import {getUploadUrl,isMoible} from '@/tool/util'
@@ -349,12 +349,12 @@ import { ElCascader } from 'element-plus'
 import { remove } from "jszip";
 export default defineComponent({
    components: {
-        HeaderComponent,
+        // HeaderComponent,
        ModelPlacement,
 		setLabel,
        ModelPlacementMobile,
 		searchLabel,
-		RobotAssist,
+		// RobotAssist,
 		ElCascader,
 		scaleImage,
    },
@@ -1328,7 +1328,7 @@ export default defineComponent({
            .library_page_body{
 				overflow: hidden;
                width: 100%;
-                // height: calc(100% - 7rem);
+                // height: 100%;
 				flex: 1;
                box-sizing: border-box;
                display: flex;
--- a/src/views/OldHistoryPage.vue
+++ b/src/views/OldHistoryPage.vue
@@ -430,7 +430,7 @@ export default defineComponent({

            .history_page_body{
                width: 100%;
-                height: calc(100% - 7rem);
+                height: 100%;
                padding: 4rem 2.5rem 4rem;
 				margin-top: 4rem;
                box-sizing: border-box;