@sigmaott/base-next 1.4.54 → 1.4.56

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sigmaott/base-next",
   "type": "module",
-  "version": "1.4.54",
+  "version": "1.4.56",
   "publishConfig": {
     "access": "public"
   },
@@ -128,4 +128,4 @@
     "nuxt": "3.15.4",
     "vue-tsc": "^1.8.1"
   }
-}
+}

package/src/components/Channel/PresetConfigItemPId.vue

@@ -15,31 +15,30 @@ const isEvent = ref(inject('isEvent'))
 const isPackage = ref(inject('isPackage'))
 const { transcodeInput, packageInput } = useGetInputDetail({
   formValue,
-  isTranscode: computed(() => !!unref(isTranscode)),
+  isTranscode,
   isPackage,
   isEvent,
 })
 
-function getProgramIdByPid(pid: string) {
+function getProgramMapByPid(pid: string) {
   if (!pid)
     return null
-  let programs: any[] = []
-  let programMaps: any[] = []
 
-  if (isTranscode.value || isEvent.value) {
-    programs = Array.isArray(transcodeInput.value?.programs?.[0])
-      ? transcodeInput.value.programs[0]
-      : transcodeInput.value?.programs ?? []
-    programMaps = transcodeInput.value?.programMaps ?? []
-  }
-  else if (isPackage.value) {
-    programs = Array.isArray(packageInput.value?.programs?.[0])
-      ? packageInput.value.programs[0]
-      : packageInput.value?.programs ?? []
-    programMaps = packageInput.value?.programMaps ?? []
-  }
-  const programMap = programMaps.find((pm: any) => pm.pids?.split(',').includes(pid))
-  return programMap?.id
+  const programMaps: any[] = (isTranscode.value || isEvent.value)
+    ? (transcodeInput.value?.programMaps ?? [])
+    : (packageInput.value?.programMaps ?? [])
+
+  return programMaps.find((pm: any) => {
+    const rawPids = pm.pids || []
+    const pidList = Array.isArray(rawPids)
+      ? rawPids.map(String)
+      : (typeof rawPids === 'string' ? rawPids.split(',').map(s => s.trim()) : [])
+    return pidList.includes(String(pid))
+  })
+}
+
+function getProgramIdByPid(pid: string) {
+  return getProgramMapByPid(pid)?.id
 }
 
 const [inputPIdValue, inputPIdAttrs] = useElField<string>(getProp('streamId'), [
@@ -174,9 +173,12 @@ function getStream(type: string) {
   const filtered = programs.filter(program => program.type === type)
 
   const newOptions = filtered.map((program) => {
+    const programMap = getProgramMapByPid(program.id)
     return {
       ...program,
-      programId: getProgramIdByPid(program.id),
+      programId: programMap?.id,
+      programName: programMap?.name,
+      provider: programMap?.provider,
     }
   })
 
@@ -195,6 +197,33 @@ function handleChangeOutputPID(value: string) {
     ElMessage.error($t('SSConfig.output_pid_cannot_exceed_50_characters'))
   }
 }
+
+const groupedStreams = computed(() => {
+  const streams = getStream(mediaType.value || '')
+  const groups: any[] = []
+  const map = new Map()
+
+  streams.forEach((stream) => {
+    const key = stream.programId || 'default'
+    if (!map.has(key)) {
+      const label = [
+        stream.programName ? `${stream.programName}` : '',
+        stream.programId ? `(ID: ${stream.programId})` : '',
+        stream.provider ? `- ${stream.provider}` : '',
+      ].filter(Boolean).join(' ')
+
+      const group = {
+        label: label || 'Other Streams',
+        options: [],
+      }
+      map.set(key, group)
+      groups.push(group)
+    }
+    map.get(key).options.push(stream)
+  })
+
+  return groups
+})
 </script>
 
 <template>
@@ -205,10 +234,12 @@ function handleChangeOutputPID(value: string) {
     <el-form-item label="Input PID" v-bind="inputPIdAttrs" class="w-586px">
       <el-select v-model="inputPIdValue" clearable :placeholder="t('SSConfig.enter_the_pid_placeholder')" filterable
         allow-create @change="handleChangeInputPID">
-        <el-option v-for="(preset, index) in getStream(mediaType)" :key="`${preset.id} + ${index}`"
-          class="w-700px !h-auto" :value="preset.id" :label="preset.id">
-          <MediaInfoViewer :isShowPId="true" :media="preset" />
-        </el-option>
+        <el-option-group v-for="group in groupedStreams" :key="group.label" :label="group.label">
+          <el-option v-for="(preset, index) in group.options" :key="`${preset.id} + ${index}`" class="w-700px !h-auto"
+            :value="preset.id" :label="preset.id">
+            <MediaInfoViewer :isShowPId="true" :media="preset" />
+          </el-option>
+        </el-option-group>
       </el-select>
     </el-form-item>
     <el-form-item label="Output PID" v-bind="outputPIdAttrs" class="w-586px">
@@ -217,3 +248,11 @@ function handleChangeOutputPID(value: string) {
     </el-form-item>
   </div>
 </template>
+
+<style scoped lang="scss">
+:deep(.el-select-group__title) {
+  font-weight: bold !important;
+  color: var(--el-text-color-primary) !important;
+  font-size: 14px !important;
+}
+</style>