diff --git a/src/component/DetailCopy/designDetail.vue b/src/component/DetailCopy/designDetail.vue
index d42e45d6..2edf1373 100644
--- a/src/component/DetailCopy/designDetail.vue
+++ b/src/component/DetailCopy/designDetail.vue
@@ -43,7 +43,9 @@
 				<div class="item">
 					<sketchLeft></sketchLeft>
 				</div>
-				<div></div>
+				<div class="item">
+					<model></model>
+				</div>
 				<div></div>
 				<div class="gallery_btn submit">Submit</div>
 			</div>
@@ -58,6 +60,7 @@
 <script lang="ts">
 import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
 import sketchLeft from './sketchLeft.vue'
+import model from './model/index.vue'
 
 // import setDesignItem from '@/component/Detail/setDesignItem2.vue'
 import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
@@ -70,7 +73,7 @@ import { useI18n } from 'vue-i18n'
 import addDetails from '@/component/Detail/addDetails.vue'
 export default defineComponent({
     components:{
-		sketchLeft,
+		sketchLeft,model
     },
     setup() {
         const store = useStore();
diff --git a/src/component/DetailCopy/model/index.vue b/src/component/DetailCopy/model/index.vue
new file mode 100644
index 00000000..982d639d
--- /dev/null
+++ b/src/component/DetailCopy/model/index.vue
@@ -0,0 +1,74 @@
+<template>
+    <div class="modelindex">
+		<div class="detail_btn">
+			<!-- 全屏 --> 
+			<i class="fi fi-bs-expand-arrows-alt" @click="showDesignImgDetail(2)"></i>
+			<!-- 编辑 -->
+			<i class="fi fi-rr-edit" :title="$t('DesignDetail.editTitle')" @click="showDesignImgDetail(3)"></i>
+			<i v-show="!body && !deleteShow" :title="$t('DesignDetail.DetailTitle')" class="fi fi-rr-trash" @click="deleteNav(0)"></i>
+			<i v-show="!body && deleteShow" class="fi fi-br-check" @click="deleteNav(1)"></i>
+
+			<!-- 层 -->
+			<i class="fi fi-rr-copy" :title="$t('DesignDetail.compareTitle')" @mousedown="mousedownDesignImg" @mouseup="mouseupDesignImg" @touchstart="mousedownDesignImg" @touchend="mouseupDesignImg"></i>
+			<i v-show="revocationShow>1" class="icon iconfont icon-chehui" @click="revocation"></i>
+			<i v-show="oppositeRevocationShow>=1" class="icon iconfont icon-fanchehui" @click="oppositeRevocation"></i>
+		</div>
+		<div>21313</div>
+    </div>
+</template>
+<script lang="ts">
+import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
+// import setDesignItem from '@/component/Detail/setDesignItem2.vue'
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
+import { Https } from "@/tool/https";
+import { useStore } from "vuex";
+import { useI18n } from 'vue-i18n'
+export default defineComponent({
+    components:{
+		
+    },
+    setup(props,{emit}) {
+        const store = useStore();
+		const detailData = reactive({
+			
+		})
+		const getDetailListData = reactive({
+			total:0,
+			pageSize:10,
+			currentPage:1,
+		})
+		const getDetailListDom = reactive({
+			libraryList:null as any,
+		})
+		
+		const showDesignImgDetail = ()=>{
+
+		}
+		const deleteNav = ()=>{
+
+		}
+        return{
+			...toRefs(detailData),
+			...toRefs(getDetailListData),
+			...toRefs(getDetailListDom),
+			showDesignImgDetail,
+			deleteNav,
+        }
+    },
+
+	provide() {
+		return {
+		}
+	},
+		
+})
+</script>
+<style lang="less" scoped>
+    .modelindex{
+		width: 80rem;
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		padding-top: 3rem;
+	}
+</style>
\ No newline at end of file
diff --git a/src/component/DetailCopy/model/modelPosition.vue b/src/component/DetailCopy/model/modelPosition.vue
new file mode 100644
index 00000000..e69de29b
diff --git a/src/component/DetailCopy/model/position.vue b/src/component/DetailCopy/model/position.vue
new file mode 100644
index 00000000..e69de29b
diff --git a/src/component/DetailCopy/sketchLeft.vue b/src/component/DetailCopy/sketchLeft.vue
index 8f544a71..b8e0f1b8 100644
--- a/src/component/DetailCopy/sketchLeft.vue
+++ b/src/component/DetailCopy/sketchLeft.vue
@@ -158,6 +158,7 @@ export default defineComponent({
 			overflow: hidden;
 			> .content_item{
 				height: 100%;
+				margin-top: 1rem;
 			}
 		}
 	}
diff --git a/src/component/HomePage/ExportModel.vue b/src/component/HomePage/ExportModel.vue
index 504eae6c..e89ca646 100644
--- a/src/component/HomePage/ExportModel.vue
+++ b/src/component/HomePage/ExportModel.vue
@@ -555,6 +555,8 @@ export default defineComponent({
         let createCanvas = (oldExportCanvas) => {
             showUpgradePlan.value = true;
 			clearTimeout(submitCanvasContent)
+			document.addEventListener("keydown", setCanvasKeyDown);
+			document.addEventListener("keyup", clearCanvasKeyDown);
 			normalCanvasState.value = []
 			reverseCanvasState.value = []
 			allBoardData.value.likeDesignCollectionList =
@@ -565,8 +567,6 @@ export default defineComponent({
 				let oldCanvasDom = canvasBox.querySelector('.canvas-container')
 				let oldCanvasDom1 =  canvasBox.querySelector('canvas')
 				var canvasDom = document.createElement("canvas");
-				document.addEventListener("keydown", setCanvasKeyDown);
-				document.addEventListener("keyup", clearCanvasKeyDown);
 				if(oldCanvasDom)oldCanvasDom.remove()
 				if(oldCanvasDom)loadingShow.value = false
 				if(oldCanvasDom1)oldCanvasDom1.remove()
@@ -1277,13 +1277,13 @@ export default defineComponent({
 					foldEnd('Enter')
 				}else if(event.key === 'Delete'){
 					deleteObject()
-				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && keyDown.indexOf('KeyZ') > -1 && keyDown.indexOf('ShiftLeft') > -1){
+				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && event.code == 'KeyZ' && keyDown.indexOf('ShiftLeft') > -1){
 					historyState('reverse')
-				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && keyDown.indexOf('KeyZ') > -1){
+				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && event.code == 'KeyZ'){
 					historyState('')
-				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && keyDown.indexOf('KeyC') > -1){
+				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && event.code == 'KeyC'){
 					copy()
-				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && keyDown.indexOf('KeyV') > -1){
+				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && event.code == 'KeyV'){
 					paste()
 				}else if(keyDown.indexOf('BracketLeft') > -1){
 					let width = canvasPencilWidth.value[operation.value]
@@ -1297,9 +1297,9 @@ export default defineComponent({
 					getColor()//吸色
 				}else if(keyDown.indexOf('KeyM') > -1){
 					setOperation('move')
-				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && keyDown.indexOf('KeyD') > -1){
+				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && event.code == 'KeyD'){
 					canvas.discardActiveObject().renderAll();
-				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && keyDown.indexOf('KeyO') > -1){
+				}else if((keyDown.indexOf('ControlLeft') > -1 || keyDown.indexOf('MetaLeft') > -1) && event.code == 'KeyO'){
 					let input = document.querySelector('.uploadImage input')
 					input.click()
 				}else if(keyDown.indexOf('Backquote') > -1){
@@ -1311,6 +1311,7 @@ export default defineComponent({
 					// }
 				}
 			}
+			console.log(keyDown);
 		}
 		let getColor = async ()=>{
 			try {
@@ -1328,9 +1329,15 @@ export default defineComponent({
 			}
 		}
 		let canvasKeyUp = (event) =>{
+			let keys = ['Enter','Delete','ControlLeft','KeyZ','ShiftLeft','KeyC','KeyV','BracketLeft','BracketRight','KeyI','KeyD','KeyO','Backquote','MetaLeft']
+			if(keys.indexOf(event.code) > -1){
+				event.preventDefault(); 
+			}
 				keyDown = keyDown.filter(function(item) {
 					return event.code !== item;
 				})
+			console.log(keyDown,'UP',event.code);
+
 				if(event.code == 'Backquote' && oldOperation){
 					// setOperation(oldOperation)
 					oldOperation  = ''