复制帧功能

lefengyang

2026-08-27 6ff51a2017246dd3a77e4005f77352e7a803e0de

 ledApp/pages/addTemplate/addTemplate.vue

@@ -31,6 +31,22 @@
               </uv-upload>
            </view>
         </view>
         <view class="temp_item" v-if="!isEditMode">
            <view class="title">
               预制动画
            </view>
            <view class="item">
               <uv-radio-group v-model="selectedPreset" placement="column" @change="changePreset" labelSize="26rpx">
                  <uv-radio
                     class="spec_radio"
                     v-for="(item, index) in presetList"
                     :key="index"
                     :label="'预制动画：'+item.name+'（'+item.fpsTotal+'帧）'"
                     :name="item.name">
                  </uv-radio>
               </uv-radio-group>
            </view>
         </view>
         <view class="temp_item">
            <view class="title">
               屏幕规格
@@ -91,6 +107,7 @@
            </view>
            <view class="item">
               <uv-button text="编辑" @click="popupAnimationOpen(index)" shape="circle" size="small" color="linear-gradient( 142deg, #6FD2FF 0%, #268DFF 100%)"></uv-button>
               <uv-button text="复制" @click="copyFrame(index)" shape="circle" size="small" color="linear-gradient( 142deg, #FFB347 0%, #FF8C00 100%)"></uv-button>
            </view>
         </view>
      </view>
@@ -216,7 +233,8 @@
   import {
      templeteAdd,
      templeteInfo,
      templeteEdit
      templeteEdit,
      templeteList
   } from '@/api/api.js'
   let ctx = null
   export default {
@@ -311,6 +329,9 @@
            scrollLeft: 0,
            textType: 'overwrite',
            tempText: '',
            presetList: [],
            selectedPreset: '',
            isEditMode: false,
         }
      },
      computed: {
@@ -326,9 +347,12 @@
            this.tId = opt.id
            this.getTempleteInfo()
            this.titleName = '编辑模版'
            this.isEditMode = true
         }
         else{
            this.titleName = '新增模版'
            this.isEditMode = false
            this.getPresetList()
         }
      },
      onShow() {
@@ -348,6 +372,30 @@
         }
      },
      methods: {
         getPresetList() {
            templeteList({
               userId: 1,
               pageNum: 1,
               pageSize: 99
            }).then(res => {
               console.log('预制动画列表-------', res.rows)
               if(res.code == 200){
                  this.presetList = res.rows || []
               }
            })
         },
         changePreset(val) {
            const preset = this.presetList.find(item => item.name === val)
            if (preset) {
               this.specVal = preset.screen
               this.modeVal = preset.mode
               this.total = preset.fpsTotal
               this.speed = preset.speed
               if (preset.fpsList) {
                  this.fpsList = JSON.parse(preset.fpsList)
               }
            }
         },
         handleScroll(e){
            this.scrollLeft = e.detail.scrollLeft
         },
@@ -718,6 +766,26 @@
            const colCount = this.width * (this.modeVal == 2 ? 10 : 1)
            this.pixelData = new Array(this.height * colCount).fill('')
         },
         // 复制当前帧
         copyFrame(index) {
            uni.showModal({
               title: '提示',
               content: '确定要复制当前帧吗？',
               success: (res) => {
                  if (res.confirm) {
                     const source = this.fpsList[index];
                     const copy = source ? [...source] : null;
                     this.fpsList.splice(index + 1, 0, copy);
                     this.total = this.fpsList.length;
                     uni.showToast({
                        title: '复制成功',
                        icon: 'success',
                        duration: 1500
                     });
                  }
               }
            });
         },
         // 屏幕规格
         changeSpec(e) {
            const ratio = e.split('*');
@@ -1356,7 +1424,11 @@

         }

         .item {}
         .item {
            flex-direction:row;
            gap:20rpx;
            display:flex;
         }
      }

      .temp_item {