style: 调整前端示例组件相关目录结构

2025-09-15 02:57:10 +08:00 · 2023-08-30 22:13:26 +08:00
parent 9baf341013
commit 5fb1607f2a
93 changed files with 77 additions and 77 deletions
--- a/continew-admin-ui/src/views/demo/profile/basic/components/profile-item.vue
+++ b/continew-admin-ui/src/views/demo/profile/basic/components/profile-item.vue
@@ -0,0 +1,148 @@
+<template>
+  <div class="item-container">
+    <a-space :size="16" direction="vertical" fill>
+      <a-descriptions
+        v-for="(item, idx) in blockDataList"
+        :key="idx"
+        :label-style="{
+          textAlign: 'right',
+          width: '200px',
+          paddingRight: '10px',
+          color: 'rgb(var(--gray-8))',
+        }"
+        :value-style="{ width: '400px' }"
+        :title="item.title"
+        :data="item.data"
+      >
+        <template #value="{ value }">
+          <a-skeleton v-if="loading" :animation="true">
+            <a-skeleton-line :widths="['200px']" :rows="1" />
+          </a-skeleton>
+          <span v-else>{{ value }}</span>
+        </template>
+      </a-descriptions>
+    </a-space>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { computed, PropType } from 'vue';
+  import { useI18n } from 'vue-i18n';
+  import { ProfileBasicRes } from '@/api/demo/profile';
+
+  type BlockList = {
+    title: string;
+    data: {
+      label: string;
+      value: string;
+    }[];
+  }[];
+
+  const props = defineProps({
+    type: {
+      type: String,
+      default: '',
+    },
+    renderData: {
+      type: Object as PropType<ProfileBasicRes>,
+      required: true,
+    },
+    loading: {
+      type: Boolean,
+      default: false,
+    },
+  });
+  const { t } = useI18n();
+  const blockDataList = computed<BlockList>(() => {
+    const { renderData } = props;
+    const result = [];
+    result.push({
+      title:
+        props.type === 'pre'
+          ? t('basicProfile.title.preVideo')
+          : t('basicProfile.title.video'),
+      data: [
+        {
+          label: t('basicProfile.label.video.mode'),
+          value: renderData?.video?.mode || '-',
+        },
+        {
+          label: t('basicProfile.label.video.acquisition.resolution'),
+          value: renderData?.video?.acquisition.resolution || '-',
+        },
+        {
+          label: t('basicProfile.label.video.acquisition.frameRate'),
+          value: `${renderData?.video?.acquisition.frameRate || '-'} fps`,
+        },
+        {
+          label: t('basicProfile.label.video.encoding.resolution'),
+          value: renderData?.video?.encoding.resolution || '-',
+        },
+        {
+          label: t('basicProfile.label.video.encoding.rate.min'),
+          value: `${renderData?.video?.encoding.rate.min || '-'} bps`,
+        },
+        {
+          label: t('basicProfile.label.video.encoding.rate.max'),
+          value: `${renderData?.video?.encoding.rate.max || '-'} bps`,
+        },
+        {
+          label: t('basicProfile.label.video.encoding.rate.default'),
+          value: `${renderData?.video?.encoding.rate.default || '-'} bps`,
+        },
+        {
+          label: t('basicProfile.label.video.encoding.frameRate'),
+          value: `${renderData?.video?.encoding.frameRate || '-'} fpx`,
+        },
+        {
+          label: t('basicProfile.label.video.encoding.profile'),
+          value: renderData?.video?.encoding.profile || '-',
+        },
+      ],
+    });
+
+    result.push({
+      title:
+        props.type === 'pre'
+          ? t('basicProfile.title.preAudio')
+          : t('basicProfile.title.audio'),
+      data: [
+        {
+          label: t('basicProfile.label.audio.mode'),
+          value: renderData?.audio?.mode || '-',
+        },
+        {
+          label: t('basicProfile.label.audio.acquisition.channels'),
+          value: `${renderData?.audio?.acquisition.channels || '-'} ${t(
+            'basicProfile.unit.audio.channels'
+          )}`,
+        },
+        {
+          label: t('basicProfile.label.audio.encoding.channels'),
+          value: `${renderData?.audio?.encoding.channels || '-'} ${t(
+            'basicProfile.unit.audio.channels'
+          )}`,
+        },
+        {
+          label: t('basicProfile.label.audio.encoding.rate'),
+          value: `${renderData?.audio?.encoding.rate || '-'} kbps`,
+        },
+        {
+          label: t('basicProfile.label.audio.encoding.profile'),
+          value: renderData?.audio?.encoding.profile || '-',
+        },
+      ],
+    });
+
+    return result;
+  });
+</script>
+
+<style scoped lang="less">
+  .item-container {
+    padding-top: 20px;
+    :deep(.arco-descriptions-item-label) {
+      font-weight: normal;
+    }
+  }
+</style>