Merge branch 'feature/0515-copy' into online

src/views/music-library/music-sheet/component/music-list.tsx

@@ -37,7 +37,7 @@ import { getMapValueByKey } from '@/utils/filters'
 import { appKey, musicSheetSourceType, musicSheetType } from '@/utils/constant'
 import { getSelectDataFromObj } from '@/utils/objectUtil'
 import { sysApplicationPage } from '@views/menu-manage/api'
-import { getOwnerName } from '@views/music-library/musicUtil'
+import {getOwnerName, copyText} from '@views/music-library/musicUtil'
 import styles from './music-list.module.less'
 import MusicCreateImg from '../modal/music-create-img'
 import TheTooltip from '@components/TheTooltip'
@@ -106,7 +106,11 @@ export default defineComponent({
                   <TheTooltip content={row.name} />
                 </NDescriptionsItem>
                 <NDescriptionsItem label="编号">
-                  <TheTooltip content={row.id} />
+                  <div onDblclick={() => {
+                    copyText(message,row.id)
+                  }}>
+                    <TheTooltip content={row.id}/>
+                  </div>
                 </NDescriptionsItem>
               </NDescriptions>
             )

src/views/music-library/musicUtil.ts

@@ -22,4 +22,47 @@ export const getOwnerName = (musicSheetExtend: any, sourceType: string) => {
     }
   }
   return ownerName;
+}
+
+export const copyText = (message: any, text: string) => {
+  // 数字没有 .length 不能执行selectText 需要转化成字符串
+  const textString = text.toString()
+  let input = document.querySelector('#copy-input') as HTMLInputElement
+  if (!input) {
+    input = document.createElement('input')
+    input.id = 'copy-input'
+    input.readOnly = true // 防止ios聚焦触发键盘事件
+    input.style.position = 'fixed'
+    input.style.left = '-1000px'
+    input.style.zIndex = '-1000'
+    // 为了处理，页面滑动到底部的问题
+    document.body.appendChild(input)
+    // document.querySelector('#input-copy-container')?.appendChild(input)
+  }
+
+  input.value = textString
+  // ios必须先选中文字且不支持 input.select();
+  selectText(input, 0, textString.length)
+  if (document.execCommand('copy')) {
+    document.execCommand('copy')
+    message.success('复制成功')
+  }
+  input.blur()
+
+  // input自带的select()方法在苹果端无法进行选择，所以需要自己去写一个类似的方法
+  // 选择文本。createTextRange(setSelectionRange)是input方法
+  function selectText(textbox: any, startIndex: any, stopIndex: any) {
+    if (textbox.createTextRange) {
+      //ie
+      const range = textbox.createTextRange()
+      range.collapse(true)
+      range.moveStart('character', startIndex) //起始光标
+      range.moveEnd('character', stopIndex - startIndex) //结束光标
+      range.select() //不兼容苹果
+    } else {
+      //firefox/chrome
+      textbox.setSelectionRange(startIndex, stopIndex)
+      textbox.focus()
+    }
+  }
 }

src/views/music-library/project-music-sheet/module/gym/music-sheet-gym.tsx

@@ -43,7 +43,7 @@ import UpdateMusic from '@views/music-library/project-music-sheet/module/gym/upd
 import { subjectPage, sysApplicationPage } from '@views/system-manage/api'
 import { filterTimes } from '@/utils/dateUtil'
 import deepClone from '@/utils/deep.clone'
-import { getOwnerName } from '@views/music-library/musicUtil'
+import {copyText, getOwnerName} from '@views/music-library/musicUtil'
 import MusicPreView from '@views/music-library/music-sheet/modal/musicPreView'
 import { HelpCircleOutline } from '@vicons/ionicons5'
 
@@ -301,7 +301,11 @@ export default defineComponent({
                   <TheTooltip content={row.name} />{' '}
                 </NDescriptionsItem>
                 <NDescriptionsItem label="曲目编号">
-                  <TheTooltip content={row.id} />{' '}
+                  <div onDblclick={() => {
+                    copyText(message,row.id)
+                  }}>
+                    <TheTooltip content={row.id}/>
+                  </div>
                 </NDescriptionsItem>
               </NDescriptions>
             </>

src/views/music-library/project-music-sheet/module/gyt/music-sheet-gyt.tsx

@@ -38,7 +38,7 @@ import {
 import { subjectPage, sysApplicationPage } from '@views/system-manage/api'
 import { filterTimes } from '@/utils/dateUtil'
 import deepClone from '@/utils/deep.clone'
-import { getOwnerName } from '@views/music-library/musicUtil'
+import {copyText, getOwnerName} from '@views/music-library/musicUtil'
 import UpdateMusic from '@views/music-library/project-music-sheet/module/gyt/updateMusic'
 import MusicPreView from "@views/music-library/music-sheet/modal/musicPreView";
 
@@ -296,7 +296,13 @@ export default defineComponent({
                 <NDescriptionsItem label="曲目名称">
                   <TheTooltip content={row.name} />{' '}
                 </NDescriptionsItem>
-                <NDescriptionsItem label="曲目编号"><TheTooltip content={row.id} />{' '}</NDescriptionsItem>
+                <NDescriptionsItem label="曲目编号">
+                  <div onDblclick={() => {
+                    copyText(message, row.id)
+                  }}>
+                    <TheTooltip content={row.id}/>
+                  </div>
+                </NDescriptionsItem>
               </NDescriptions>
             </>
           )

src/views/music-library/project-music-sheet/module/klx/music-sheet-klx.tsx

@@ -39,7 +39,7 @@ import {
 import { subjectPage, sysApplicationPage } from '@views/system-manage/api'
 import { filterTimes } from '@/utils/dateUtil'
 import deepClone from '@/utils/deep.clone'
-import { getOwnerName } from '@views/music-library/musicUtil'
+import {copyText, getOwnerName} from '@views/music-library/musicUtil'
 import UpdateMusic from '@views/music-library/project-music-sheet/module/klx/updateMusic'
 import MusicPreView from '@views/music-library/music-sheet/modal/musicPreView'
 
@@ -322,7 +322,11 @@ export default defineComponent({
                   <TheTooltip content={row.name} />{' '}
                 </NDescriptionsItem>
                 <NDescriptionsItem label="曲目编号">
-                  <TheTooltip content={row.id} />{' '}
+                  <div onDblclick={() => {
+                    copyText(message,row.id)
+                  }}>
+                    <TheTooltip content={row.id}/>
+                  </div>
                 </NDescriptionsItem>
               </NDescriptions>
             </>

src/views/music-library/project-music-sheet/module/kt/music-sheet-kt.tsx

@@ -36,7 +36,7 @@ import { sysApplicationPage } from '@views/menu-manage/api'
 import { musicSheetApplicationExtendSubjectList } from '@views/system-manage/api'
 import { filterTimes } from '@/utils/dateUtil'
 import deepClone from '@/utils/deep.clone'
-import { getOwnerName } from '@views/music-library/musicUtil'
+import {copyText, getOwnerName} from '@views/music-library/musicUtil'
 import MusicPreView from '@views/music-library/music-sheet/modal/musicPreView'
 
 export default defineComponent({
@@ -291,7 +291,11 @@ export default defineComponent({
                   <TheTooltip content={row.name} />{' '}
                 </NDescriptionsItem>
                 <NDescriptionsItem label="曲目编号">
-                  <TheTooltip content={row.id} />{' '}
+                  <div onDblclick={() => {
+                    copyText(message,row.id)
+                  }}>
+                    <TheTooltip content={row.id}/>
+                  </div>
                 </NDescriptionsItem>
               </NDescriptions>
             </>