Task-2801167946019072: typewriter

vusion · Feb 16, 2024 · 6910753 · 6910753
1 parent 1498ada
commit 6910753
Show file tree

Hide file tree

Showing 9 changed files with 106 additions and 7 deletions.
diff --git a/packages/cw/cw_text_power_library/components/cw-typed-view/api.yaml b/packages/cw/cw_text_power_library/components/cw-typed-view/api.yaml
@@ -0,0 +1,20 @@
+- name: cw-typed-view
+  title: 打字机文本
+  type: both
+  belong: component
+  labels: [Runtime]
+  attrs:
+    - name: value
+      title: 文本内容
+      type: string
+      default: 请在这里输入内容
+      description: 需要传入的值
+    - name: typeSpeed
+      title: 打字速度
+      type: number
+      default: 40
+      description: 打字速度，单位为毫秒
+    - name: showCursor
+      title: 展示光标
+      type: boolean
+      default: false
diff --git a/packages/cw/cw_text_power_library/components/cw-typed-view/docs/blocks.md b/packages/cw/cw_text_power_library/components/cw-typed-view/docs/blocks.md
@@ -0,0 +1,5 @@
+### 基本用法
+
+``` html
+<cw-typed-view></cw-typed-view>
+```
diff --git a/packages/cw/cw_text_power_library/components/cw-typed-view/docs/examples.md b/packages/cw/cw_text_power_library/components/cw-typed-view/docs/examples.md
@@ -0,0 +1,5 @@
+### 基本用法
+
+``` html
+<cw-typed-view></cw-typed-view>
+```
diff --git a/packages/cw/cw_text_power_library/components/cw-typed-view/index.js b/packages/cw/cw_text_power_library/components/cw-typed-view/index.js
@@ -0,0 +1,3 @@
+import CwTypedView from "./index.vue"
+
+export default CwTypedView
diff --git a/packages/cw/cw_text_power_library/components/cw-typed-view/index.vue b/packages/cw/cw_text_power_library/components/cw-typed-view/index.vue
@@ -0,0 +1,62 @@
+<template>
+  <div style="display:flex">
+      <div ref="my-type" v-if="!inIDE" >
+      </div>
+      <div v-else>
+        {{value}}
+      </div>
+  </div>
+</template>
+
+<script>
+import Typed from 'typed.js';
+export default {
+    name:"cw-typed-view",
+    props:{
+      value:{
+        type:String,
+        default:"请在这里输入内容"
+      },
+      showCursor:{
+        type:Boolean,
+        default:false
+      },
+      typeSpeed:{
+        type:Number,
+        default:40
+      },
+      // backSpeed:{
+      //   type:Number,
+      //   default:40
+      // }
+    },
+    computed:{
+      inIDE(){
+        return this.$env&& this.$env.VUE_APP_DESIGNER || false
+      },
+    },
+    data(){
+      return {
+        typed:null
+      }},
+    
+    mounted(){
+      if(!this.inIDE){
+        this.typed = new Typed(this.$refs['my-type'], {
+                strings: [this.value],
+                typeSpeed: this.typeSpeed,
+                showCursor:this.showCursor,
+                // backSpeed: this.backSpeed,
+                // loop: true
+        });     
+      }
+    },
+    destroyed(){
+     this.typed && this.typed.destroy();
+    }
+}
+</script>
+
+<style>
+
+</style>
diff --git a/packages/cw/cw_text_power_library/index.js b/packages/cw/cw_text_power_library/index.js
@@ -1,6 +1,8 @@
 import CwWangEditor from './components/cw-wang-editor';
+import CwTypedView from './components/cw-typed-view';
 // COMPONENT IMPORTS
 export {
 	CwWangEditor,
+	CwTypedView,
 // COMPONENT EXPORTS
 };
diff --git a/packages/cw/cw_text_power_library/manifest b/packages/cw/cw_text_power_library/manifest
@@ -1,6 +1,6 @@
 Plugin-Version: 1.0.0
 Library-Type: Frontend
 Metadata-File: usage.json
-packages/extension/cw_text_power_library@1.0.8/dist-theme/demo.html: dist-theme/demo.html
-packages/extension/cw_text_power_library@1.0.8/dist-theme/index.js: dist-theme/index.js
-packages/extension/cw_text_power_library@1.0.8/dist-theme/index.js.map: dist-theme/index.js.map
+packages/extension/cw_text_power_library@1.1.0/dist-theme/demo.html: dist-theme/demo.html
+packages/extension/cw_text_power_library@1.1.0/dist-theme/index.js: dist-theme/index.js
+packages/extension/cw_text_power_library@1.1.0/dist-theme/index.js.map: dist-theme/index.js.map
diff --git a/packages/cw/cw_text_power_library/package.json b/packages/cw/cw_text_power_library/package.json
@@ -2,7 +2,7 @@
   "name": "cw_text_power_library",
   "title": "文本功能依赖库",
   "description": "",
-  "version": "1.0.8",
+  "version": "1.1.0",
   "main": "./index.js",
   "author": "",
   "repository": "",
@@ -30,16 +30,17 @@
   },
   "devDependencies": {
     "@vue/cli-service": "^4.4.1",
+    "cloud-ui.vusion": "^0.11.20",
     "core-js": "^3.6.5",
-    "vue-loader": "15.9.8",
+    "vue": "^2.6.10",
     "vue-cli-plugin-vusion": "0.14.2-beta",
-    "cloud-ui.vusion": "^0.11.20",
-    "vue": "^2.6.10"
+    "vue-loader": "15.9.8"
   },
   "dependencies": {
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "^1.0.2",
     "dompurify": "^3.0.6",
+    "typed.js": "^2.1.0",
     "v-viewer": "^1.6.4",
     "xss": "^1.0.14"
   },

diff --git a/packages/cw/cw_text_power_library/vusion.config.js b/packages/cw/cw_text_power_library/vusion.config.js
@@ -3,6 +3,7 @@ module.exports = {
     docs: {
         components: [
             { group: '组件', name: 'cw-wang-editor',path: "./components/cw-wang-editor/api.yaml"},,
+            { group: '组件', name: 'cw-typed-view',path: "./components/cw-typed-view/api.yaml"},,
             // Conponents Route List
         ],
     },