ソースを参照

键盘多个复制粘贴

ZaiZai 2 年 前
コミット
3bc9e39126

+ 80 - 3
src/components/table-form/index.vue

@@ -15,11 +15,12 @@
 </template>
 
 <script setup>
-import {ref, watch, onMounted, nextTick} from "vue"
+import {ref, watch, onMounted, nextTick, onUnmounted} from "vue"
 import {useAppStore} from "~src/store";
 import HTableForm from "~src/plugins/HTableForm"
 import notableform from '~src/assets/view/notableform.svg'
-import {getObjNullValue, isAsyncFunction, isString, getArrValue, deepClone} from "vue-utils-plus"
+import {getStoreData, setStoreData, delStoreData} from "~uti/storage";
+import {getObjNullValue, isAsyncFunction, isString, getArrValue, deepClone, getIndex} from "vue-utils-plus"
 
 const useAppState = useAppStore()
 
@@ -233,7 +234,10 @@ const getExcelHtml = async (pkeyId, func, keys) => {
                 //表单正则效验
                 onBlur: (event, key, reg, val, msg) => {
                     setTableFormBlurReg(pkeyId, event, key, reg, val, msg)
-                }
+                },
+                onLeftClick: (key) => {
+                    setShiftTableForm(key)
+                },
             })
             tableFormInfo.value.isRenderForm = true
             await nextTick(() => {
@@ -287,6 +291,79 @@ const onRightClick = (pkeyId, event, KeyName) => {
     emit('rightTap', {event, KeyName, startPos, endPos, pkeyId})
 }
 
+const isCtrlKey = ref(false)
+const checkKeyList = ref([])
+const copyKeyList = ref(getStoreData('TableFormCopyKeyList') || [])
+
+//设置选择数据
+const setShiftTableForm = (key) => {
+    if (isCtrlKey.value) {
+        const form = tableFormInfo.value
+        const keys = checkKeyList.value
+        const index = getIndex(keys, 'key', key)
+        if (index === -1) {
+            keys.push({key, val: form[key] ?? ''})
+        } else {
+            keys.splice(index, 1)
+        }
+        checkKeyList.value = keys
+        HTableForm.setCheckKeyStyle(key, index !== -1)
+        //console.log(keys)
+    }
+}
+
+//全局按键按下监听
+document.onkeydown = (event) => {
+    const {key, ctrlKey} = event
+    //按下ctrl键
+    if (ctrlKey && key === 'Control') {
+        //console.log('按下ctrl键')
+        isCtrlKey.value = true
+    }
+    //按下复制快捷键
+    if (ctrlKey && key === 'c') {
+        const keysList = deepClone(checkKeyList.value)
+        setStoreData('TableFormCopyKeyList', keysList)
+        copyKeyList.value = keysList
+        keysList.forEach(item => {
+            HTableForm.setCheckKeyStyle(item['key'], true)
+        })
+        checkKeyList.value = []
+    }
+    //按下粘贴快捷键
+    if (ctrlKey && key === 'v') {
+        const keysList = deepClone(copyKeyList.value)
+        const checkList = checkKeyList.value
+        checkList.forEach(item => {
+            if (keysList.length > 0) {
+                tableFormInfo.value[item['key']] = keysList[0]?.val ?? item['val']
+                keysList.splice(0, 1) //删除第一个元素
+            }
+            HTableForm.setCheckKeyStyle(item['key'], true)
+        })
+        //清除缓存
+        checkKeyList.value = []
+        copyKeyList.value = []
+        delStoreData('TableFormCopyKeyList')
+    }
+}
+
+//全局键盘放开监听
+document.onkeyup = (event) => {
+    const {key, ctrlKey} = event
+    if (!ctrlKey && key === 'Control') {
+        //console.log('放开ctrl键')
+        isCtrlKey.value = false
+    }
+}
+
+//卸载页面
+onUnmounted(() => {
+    document.onkeydown = null
+    document.onkeyup = null
+})
+
+
 //获取表单数据
 const getFormData = () => {
     return tableFormInfo.value

+ 9 - 2
src/plugins/HTableForm.js

@@ -57,6 +57,10 @@ export default class HTableForm {
                 },
             },
             methods: {
+                //鼠标右键菜单
+                contextmenuClick(event) {
+                    event.preventDefault();
+                },
                 //鼠标右键事件
                 RightClick(a, b, c, d, e, f, event) {
                     event.preventDefault();
@@ -119,7 +123,10 @@ export default class HTableForm {
                 },
                 //输入左键点击事件
                 inputLeftClick(event, key) {
-                    onLeftClick(key)
+                    event.preventDefault();
+                    if (onLeftClick) {
+                        onLeftClick(key)
+                    }
                 },
             }
         })
@@ -276,5 +283,5 @@ export default class HTableForm {
             }
         }
     }
-    
+
 }

+ 3 - 2
src/test/data.js

@@ -12,14 +12,15 @@ export const data = `
 <td style="color:rgb(0,0,0);font-family:宋体;font-size:11.0pt;background-color:rgb(255,255,255);vertical-align:center;text-align:left;word-wrap:inherit;height:26px;">承包单位:</td>
 <td colspan="4" style="color:rgb(0,0,0);font-family:宋体;font-size:11.0pt;background-color:rgb(255,255,255);vertical-align:center;text-align:left;word-wrap:inherit;height:26px;" titlexx="承包单位">
     <el-input type="text"
-    @contextmenu.prevent.native="RightClick(3,1,2,5,4,4,$event)"
+    @contextmenu.prevent.native="contextmenuClick($event)"
+    @mousedown.right.native="RightClick(3,1,2,5,4,4,$event)"
     trindex="3" tdindex="1" x1="2" x2="5" y1="4" y2="4"
     style="width:100%;height:100%;"
     placeholderxx="承包单位"
     @focus="getInformation('承包单位',3,1)"
     weighing="100.0" id="key_14__3_1" keyname="key_14__3_1"
     @blur="getRegularExpression($event,'','请输入字符串',3,1)"
-    @mousedown.left="inputLeftClick($event, 'key_14__3_1')"
+    @mousedown.left.native="inputLeftClick($event, 'key_14__3_1')"
     v-model="formData.key_14__3_1"></el-input>
 </td>
 <td style="color:rgb(0,0,0);font-family:宋体;font-size:11.0pt;background-color:rgb(255,255,255);vertical-align:center;text-align:left;word-wrap:inherit;height:26px;">合同段:</td>

+ 4 - 4
src/views/data-fill/collapse-form/index.vue

@@ -101,9 +101,10 @@
                             tab键向上一个填报框切换,tab向下一个填报框切换。Shift + 上 ( ↑ )、下 ( ↓ )、左 ( ← )、右 ( →
                             )键,切换填报输入框焦点。
                         </div>
-                        <div class="text-gray-400 tip-item">3、复制粘贴方法:点击需要操作的输入框,键盘按 ctrl + a
-                            (全选),ctrl + b
-                            (复制),ctrl + v (粘贴),可跨表复制粘贴,也可在同一表内复制粘贴,快捷键为电脑操作系统的默认快捷键。
+                        <div class="text-gray-400 tip-item">3、键盘按住 ctrl +
+                            点击,选择输入框,变为绿色边框,选中成功。选择完毕后,键盘按 ctrl + c 复制所选中的数据,
+                            再其它表内,或同一张表内,再次按住 ctrl + 点击,选择输入框。键盘按 ctrl + v
+                            依次粘贴所选的数据。(目前仅支持输入框和文本框的操作)
                         </div>
                         <div class="text-orange-500 tip-item">4、完善资料填写后记得一定要保存哦</div>
                         <div class="table-tip-foot">
@@ -243,7 +244,6 @@
         </HcDragModal>
     </template>
 
-
 </template>
 
 <script setup>