matrix_components 2.0.315 → 2.0.317

package/dist/ComponentDemo/TestFormConfig.js

@@ -1,129 +0,0 @@
-// 测试表单配置文件 - 用于验证默认值加载功能
-export const formConfig = {
-  // 表单数据初始值
-  formData: {
-    testName: "默认姓名",
-    testEmail: "default@example.com",
-    testAge: 25,
-    testGender: "male",
-    testHobbies: ["reading", "music"],
-    testIsVip: true,
-    testScore: 80,
-    testBirthday: "1998-01-01",
-    testDescription: "这是默认的描述信息",
-  },
-
-  // 表单配置项
-  formItems: [
-    {
-      label: "姓名",
-      prop: "testName",
-      component: "input",
-      span: 12,
-      required: true,
-      placeholder: "请输入姓名",
-      props: {
-        clearable: true,
-      },
-    },
-    {
-      label: "邮箱",
-      prop: "testEmail",
-      component: "input",
-      span: 12,
-      required: true,
-      props: {
-        clearable: true,
-      },
-      rules: [
-        { type: "email", message: "请输入正确的邮箱地址", trigger: "blur" },
-      ],
-    },
-    {
-      label: "年龄",
-      prop: "testAge",
-      component: "number",
-      span: 12,
-      props: {
-        min: 1,
-        max: 120,
-        controlsPosition: "right",
-      },
-    },
-    {
-      label: "性别",
-      prop: "testGender",
-      component: "radio-group",
-      span: 12,
-      options: [
-        { label: "男", value: "male" },
-        { label: "女", value: "female" },
-      ],
-    },
-    {
-      label: "爱好",
-      prop: "testHobbies",
-      component: "checkbox-group",
-      span: 24,
-      options: [
-        { label: "读书", value: "reading" },
-        { label: "运动", value: "sports" },
-        { label: "音乐", value: "music" },
-        { label: "旅行", value: "travel" },
-      ],
-    },
-    {
-      label: "VIP用户",
-      prop: "testIsVip",
-      component: "switch",
-      span: 12,
-    },
-    {
-      label: "评分",
-      prop: "testScore",
-      component: "slider",
-      span: 12,
-      props: {
-        min: 0,
-        max: 100,
-        showStops: true,
-        showTooltip: false,
-      },
-    },
-    {
-      label: "生日",
-      prop: "testBirthday",
-      component: "date-picker",
-      span: 12,
-      props: {
-        type: "date",
-        format: "YYYY-MM-DD",
-        valueFormat: "YYYY-MM-DD",
-      },
-    },
-    {
-      label: "描述",
-      prop: "testDescription",
-      component: "textarea",
-      span: 24,
-      props: {
-        rows: 4,
-        maxlength: 200,
-        showWordLimit: true,
-      },
-    },
-  ],
-
-  // 表单验证规则
-  formRules: {
-    testName: [
-      { required: true, message: "请输入姓名"},
-    ],
-    testEmail: [{ required: true, message: "请输入邮箱地址"}],
-  },
-
-  // 下拉框选项数据源
-  optionsData: {},
-};
-
-export default formConfig;

package/dist/ComponentDemo/VideoDemo.vue

@@ -1,297 +0,0 @@
-<script setup lang="ts">
-import { nextTick, onMounted, reactive, ref } from 'vue'
-
-const nsVideoRef = ref()
-
-// 视频信息
-const videoData = reactive({
-  // videoModel: 'hk',
-  // hkPath: '/martrix/cdn/h5player',
-  // 显示视频关闭按钮
-  showClose: true,
-  // 显示树
-  showTree: true,
-  // 树数据
-  treeData: [
-    {
-      id: '1',
-      label: '分组1',
-      children: [
-        {
-          id: '11',
-          label: '分组1-1',
-          children: [
-            {
-              videoModel: 'easyplayer',
-              id: '111',
-              label: '视频A--1视频A--1视频A--1',
-              url: 'http://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000001/hls.m3u8',
-              deviceId: 'a1',
-              channelId: 'a11',
-              icontype: 'on',
-            },
-            {
-              id: 'D',
-              label: '视频A--2',
-              url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000013.live.flv',
-              deviceId: 'b1',
-              channelId: 'b11',
-              icontype: 'off',
-            },
-          ],
-        },
-        {
-          id: 'b',
-          label: '分组b',
-          children: [
-            {
-              id: 'b1',
-              label: '视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1视频A--1',
-              url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000003.live.flv',
-              deviceId: 'a1',
-              channelId: 'a11',
-              icontype: 'on',
-            },
-            {
-              id: 'b2',
-              label: '视频A--2',
-              url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000015.live.flv',
-              deviceId: 'b1',
-              channelId: 'b11',
-              icontype: 'off',
-            },
-            {
-              id: 'b3',
-              label: '视频A--3',
-              url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000009.live.flv',
-              deviceId: 'c1',
-              channelId: 'c11',
-            },
-          ],
-        },
-      ],
-
-    },
-    {
-      id: 'xxx2',
-      label: '视频Zxxxx2',
-      url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000009.live.flv',
-      deviceId: '34020000001110000001',
-      channelId: '34020000001320000003',
-    },
-  ],
-  // 树节点对应的key(！！！用于改变选中后的颜色)
-  treeNodeKey: 'id',
-  // 树节点展开的key
-  treeExpandedKeys: ['11'],
-  // 树节点属性 (videoUrlKey值要和treeData中的播放地址key一致, 默认为url)
-  treeOptions: {
-    icontype: 'icontype',
-    background: 'background',
-    videoUrlKey: 'url',
-    children: 'children',
-    label: 'label',
-  },
-  // 获取、设置打开的播放视频信息
-  videoInfos: [
-    {
-      index: 0,
-      url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000001.live.flv',
-      info: {
-        videoModel: 'easyplayer',
-        id: 'xxx2',
-        url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000001.live.flv',
-        deviceId: 'c1',
-        channelId: 'c11',
-      },
-    },
-    {
-      index: 1,
-      url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000015.live.flv',
-      info: {
-        videoModel: 'easyplayer',
-        id: '222',
-        url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000015.live.flv',
-        deviceId: 'c2',
-        channelId: 'c11',
-      },
-    },
-    {
-      index: 2,
-      url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000009.live.flv',
-      info: {
-        videoModel: 'easyplayer',
-        id: 'xxx2',
-        url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000009.live.flv',
-        deviceId: 'c3',
-        channelId: 'c11',
-      },
-    },
-    {
-      index: 3,
-      url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000008.live.flv',
-      info: {
-        videoModel: 'easyplayer',
-        id: 'b3',
-        url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000008.live.flv',
-        deviceId: 'c4',
-        channelId: 'c11',
-      },
-    },
-  ],
-  // ！！！ 单点播放
-  videoSingleUrl: false,
-  // ！！！ 已经在播放的是否关闭后再点击打开(需要单点播 videoSingleUrl:true)
-  videoSingleClose: false,
-  // 回调函数后是否继续执行默认播放操作
-  callbackContinueExecute: true,
-  // 播放模式: 1: 单击,2: 双击
-  videoPlayModel: 1,
-  // 分屏模式: 1: 单屏, 2: 四屏, 3: 九屏
-  videoSplitType: 2,
-  // 显示分屏按钮
-  showVideoSplit: true,
-  // 分屏使用图标
-  // videoSplitUseIcon: true,
-  // 显示方向控制按钮
-  showVideoCtrls: true,
-  // 禁止控制按钮默认请求行为(默认false，true则不使用组件的发送请求仅调用自定义回调函数)
-  stopVideoCtrlMethods: true,
-  // 单个视频错误最大次数
-  videoErrorMaxCount: 3,
-  // easyplayer配置 (默认一般不需要配置, 加载不出来的时候修改)
-  videoConfig: {
-    MSE: true,
-    WCS: true,
-    WASM:true,
-    WASMSIMD: true,
-    isLive: true,
-    hasAudio: false,
-    stretch: true
-  },
-  // -----------事件回调-------------
-  // 点击树节点的操作
-  treeClick: () => {
-    console.log('点击树节点回调函数')
-  },
-  // 双击树节点的操作
-  treeDBClick: () => {
-    console.log('双击树节点回调函数')
-  },
-  // 右键树展示菜单
-  treeRightMenu: () => {
-    console.log('右键树展示菜单')
-  },
-  // 展开树节点
-  treeExpand: () => {
-    console.log('展开树节点')
-  },
-  // 视频错误回调函数
-  videoError: () => {
-    console.log('视频错误回调函数')
-  },
-})
-
-// 视频操作事件
-const videoEvent = {
-  up: () => {
-    console.log('视频向上移动操作')
-  },
-  down: () => {
-    console.log('视频向下移动操作')
-  },
-  left: () => {
-    console.log('视频向左移动操作')
-  },
-  right: () => {
-    console.log('视频向右移动操作')
-  },
-  zoomin: () => {
-    console.log('视频放大操作')
-  },
-  zoomout: () => {
-    console.log('视频缩小操作')
-  },
-  stop: () => {
-    console.log('视频停止操作')
-  },
-  speed: () => {
-    console.log('设置视频移动速度')
-  },
-  speak: () => {
-    console.log('视频开始说话')
-  },
-  scan: () => {
-    console.log('视频扫描')
-  },
-  cruise: () => {
-    console.log('视频巡航')
-  },
-  call: () => {
-    console.log('视频调用')
-  },
-}
-
-onMounted(() => {
-  // setTimeout(() => {
-  //   // ！！！暴露方法
-  //   // nsVideoRef.value.[setVideoUrl / removeVideo / fouceIndex / videoInfos / treeRef]
-  //   // 设置视频
-  //   videoData.videoInfos = [
-  //   {
-  //     index: 1,
-  //     url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000004.live.flv',
-  //     info: {
-  //       videoModel: 'easyplayer',
-  //       id: 'xxx',
-  //       label: '视频A--3',
-  //       url: 'ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000004.live.flv',
-  //       deviceId: 'c1',
-  //       channelId: 'c11',
-  //     },
-  //   },
-  // ]
-  // // }, 3000)
-  // setTimeout(() => {
-  //   // 关闭视频方法1：
-  //   nsVideoRef.value.removeVideo(7, true)
-  //   // 关闭视频方法2：
-  //   // nsVideoRef.value.setVideoUrl('', false, 7)
-  // }, 5000)
-  // 播放视频
-  // nextTick(()=>{
-  //   nsVideoRef.value.setVideoUrl('ws://199.10.9.192:30200/rtp/34020000001110000001_34020000001320000010.live.flv', false, 1, {
-  //     videoModel: 'easyplayer',
-  //     /* videoModel: 'hk',
-  //     hkPath: '/xxxx', */
-  //   })
-  // })
-})
-function changeSplitHandler(num: number) {
-  console.log('分屏模式：如1,2,3代表单屏，四屏，九屏', num)
-}
-</script>
-<template>
-  <div class="video-demo">
-    <h1 class="title" style="color: #fff" v-sline>视频组件(国标28181 + 海康威视)</h1>
-    <NsVideo class="nsvideo" ref="nsVideoRef" v-bind="videoData" v-on="videoEvent" @changeSplit='changeSplitHandler'>
-      <!-- 自定义插槽
-      <template #video-tree><span>左侧树-自定义插槽</span></template>
-      <template #video-player-head><span>播放区域头部-自定义插槽</span></template>
-      <template #video-player-view><span>播放区域主体-自定义插槽</span></template>
-      <template #video-player-foot><span>播放区域底部控制按钮-自定义插槽</span></template>
-      -->
-    </NsVideo>
-  </div>
-</template>
-<style scoped lang="scss">
-.video-demo {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  background-color: #0f2a3b;
-  .title {
-    margin-bottom: 10px;
-  }
-}
-</style>

package/dist/ComponentDemo/WordDemo.vue

@@ -1,191 +0,0 @@
-<template>
-  <div class="demo-container">
-    <div class="control-panel">
-      <h3>Word 文档预览演示</h3>
-
-      <!-- 文件上传方式 -->
-      <div class="upload-section">
-        <h4>方式一：文件上传</h4>
-        <input
-          type="file"
-          @change="importWord(($event.target as any)?.files?.[0])"
-          accept=".docx"
-        />
-        <button @click="clearFile" :disabled="!file">清除文件</button>
-      </div>
-
-      <!-- URL方式 -->
-      <div class="url-section">
-        <h4>方式二：URL地址</h4>
-        <input
-          v-model="wordUrl"
-          type="text"
-          placeholder="请输入Word文档的URL地址"
-          class="url-input"
-        />
-        <button @click="loadFromUrl" :disabled="!wordUrl.trim()">加载URL</button>
-        <button @click="clearUrl" :disabled="!wordUrl">清除URL</button>
-      </div>
-    </div>
-
-    <!-- Word组件 -->
-    <div class="word-container">
-      <NsWord
-        v-if="counts"
-        ref="wordRef"
-        :url="currentUrl"
-        :hasTool="true"
-        :options="wordOptions">
-      </NsWord>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref, nextTick } from 'vue'
-
-const counts = ref(true)
-const file = ref()
-const wordRef = ref()
-const wordUrl = ref(
-  'https://501351981.github.io/vue-office/examples/dist/static/test-files/test.docx',
-)
-const currentUrl = ref(wordUrl.value)
-
-// Word文档配置选项
-const wordOptions = ref({
-  // 可以在这里配置@vue-office/docx的选项
-})
-
-function importWord(f: any) {
-  // 清除URL，使用文件上传
-  wordUrl.value = ''
-  file.value = f
-
-  if (f && f.name.endsWith('.docx')) {
-    // 创建文件URL
-    const fileUrl = URL.createObjectURL(f)
-    currentUrl.value = fileUrl
-  } else if (f) {
-    alert('请选择DOCX文件')
-    clearFile()
-  }
-}
-
-function loadFromUrl() {
-  if (wordUrl.value.trim()) {
-    // 清除文件，使用URL
-    clearFile()
-    currentUrl.value = wordUrl.value.trim()
-  }
-}
-
-function clearFile() {
-  file.value = null
-  if (currentUrl.value.startsWith('blob:')) {
-    URL.revokeObjectURL(currentUrl.value)
-  }
-  currentUrl.value = ''
-}
-
-function clearUrl() {
-  wordUrl.value = ''
-  currentUrl.value = ''
-}
-
-// 重新加载组件
-function reloadComponent() {
-  counts.value = false
-  nextTick(() => {
-    counts.value = true
-  })
-}
-</script>
-
-<style scoped lang="scss">
-.demo-container {
-  padding: 20px;
-  max-width: 1400px;
-  margin: 0 auto;
-}
-
-.control-panel {
-  background: #f5f5f5;
-  padding: 20px;
-  border-radius: 8px;
-  margin-bottom: 20px;
-
-  h3 {
-    margin: 0 0 20px 0;
-    color: #333;
-  }
-
-  h4 {
-    margin: 15px 0 10px 0;
-    color: #666;
-    font-size: 14px;
-  }
-}
-
-.upload-section,
-.url-section {
-  margin-bottom: 20px;
-  padding: 15px;
-  background: white;
-  border-radius: 6px;
-  border: 1px solid #e0e0e0;
-
-  input[type='file'] {
-    margin-right: 10px;
-  }
-
-  .url-input {
-    width: 300px;
-    padding: 8px 12px;
-    border: 1px solid #ddd;
-    border-radius: 4px;
-    margin-right: 10px;
-    font-size: 14px;
-
-    &:focus {
-      outline: none;
-      border-color: #409eff;
-    }
-  }
-
-  button {
-    padding: 8px 16px;
-    background: #409eff;
-    color: white;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-    margin-right: 10px;
-    font-size: 14px;
-
-    &:hover:not(:disabled) {
-      background: #337ecc;
-    }
-
-    &:disabled {
-      background: #c0c4cc;
-      cursor: not-allowed;
-    }
-  }
-}
-
-.word-container {
-  height: 600px;
-  border: 1px solid #e0e0e0;
-  border-radius: 8px;
-  overflow: hidden;
-  margin-bottom: 20px;
-}
-
-@media (max-width: 768px) {
-  .url-input {
-    width: 100% !important;
-    margin-bottom: 10px;
-  }
-}
-</style>