diff --git a/Dkl-vue3-ui-DP/src/components/Screenfull/index.vue b/Dkl-vue3-ui-DP/src/components/Screenfull/index.vue
new file mode 100644
index 0000000..2eced12
--- /dev/null
+++ b/Dkl-vue3-ui-DP/src/components/Screenfull/index.vue
@@ -0,0 +1,23 @@
+<template>
+  <div>
+    <!-- <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" @click="toggle" /> -->
+    <img src="../../assets/images/qp.png" @click="toggle" alt="" style="width:32px;height:32px;">
+  </div>
+</template>
+
+<script setup>
+import { useFullscreen } from '@vueuse/core'
+
+const { isFullscreen, enter, exit, toggle } = useFullscreen();
+</script>
+
+<style lang='scss' scoped>
+.screenfull-svg {
+  display: inline-block;
+  cursor: pointer;
+  fill: #5a5e66;
+  width: 20px;
+  height: 20px;
+  vertical-align: 10px;
+}
+</style>
\ No newline at end of file