Merge remote-tracking branch 'origin/feature/v1.2灵机空间-内容上传审核_rxd' into test

This commit is contained in:
rd
2025-08-14 18:06:01 +08:00
18 changed files with 157 additions and 70 deletions

View File

@ -12,7 +12,7 @@
:disabled="!props.src"
>
<template #content>
<div class="preview-container" :style="containerStyle">
<div class="preview-container">
<img :src="props.src" alt="preview" class="preview-image" />
</div>
</template>
@ -22,9 +22,9 @@
</template>
<script lang="ts" setup>
import { computed, onMounted, ref, watch } from 'vue';
import type { ImageOrientation } from '@/utils/tools';
import { getImageOrientationByUrl } from '@/utils/tools';
// import { computed, onMounted, ref, watch } from 'vue';
// import type { ImageOrientation } from '@/utils/tools';
// import { getImageOrientationByUrl } from '@/utils/tools';
interface Props {
src: string;
@ -39,30 +39,30 @@ const props = withDefaults(defineProps<Props>(), {
leaveDelay: 200,
});
const orientation = ref<ImageOrientation>('landscape');
// const orientation = ref<ImageOrientation>('landscape');
const resolveOrientation = async () => {
if (!props.src) {
orientation.value = 'landscape';
return;
}
const o = await getImageOrientationByUrl(props.src);
orientation.value = o === 'square' ? 'landscape' : o;
};
// const resolveOrientation = async () => {
// if (!props.src) {
// orientation.value = 'landscape';
// return;
// }
// const o = await getImageOrientationByUrl(props.src);
// orientation.value = o === 'square' ? 'landscape' : o;
// };
onMounted(resolveOrientation);
watch(() => props.src, resolveOrientation);
// onMounted(resolveOrientation);
// watch(() => props.src, resolveOrientation);
const containerStyle = computed(() => {
// 竖图: 306x400横图: 400x251
const isPortrait = orientation.value === 'portrait';
const width = isPortrait ? 306 : 400;
const height = isPortrait ? 400 : 251;
return {
width: `${width}px`,
height: `${height}px`,
} as Record<string, string>;
});
// const containerStyle = computed(() => {
// // 竖图: 306x400横图: 400x251
// const isPortrait = orientation.value === 'portrait';
// const width = isPortrait ? 306 : 400;
// const height = isPortrait ? 400 : 251;
// return {
// width: `${width}px`,
// height: `${height}px`,
// } as Record<string, string>;
// });
</script>
<style lang="scss">
@ -85,9 +85,9 @@ const containerStyle = computed(() => {
}
.preview-image {
width: 100%;
height: 100%;
object-fit: contain;
max-width: 368px;
max-height: 368px;
object-fit: scale-down;
}
}
</style>

View File

@ -3,6 +3,7 @@
.arco-pagination-item {
border-radius: 4px;
border: 1px solid var(--BG-300, #e6e6e8);
font-family: $font-family-manrope-regular;
&-ellipsis {
border: none;
}
@ -26,9 +27,9 @@
border: 1px solid var(--BG-300, #e6e6e8);
}
&-prepend {
color: var(--Text-2, #3c4043);
color: var(--Text-2, #55585f);
text-align: right;
font-family: $font-family-medium;
font-family: $font-family-regular;
font-size: 14px;
font-style: normal;
font-weight: 400;
@ -38,4 +39,12 @@
background-color: transparent;
}
}
.arco-pagination-total {
color: var(--Text-2, #55585f);
font-family: $font-family-regular;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px;
}
}

View File

@ -1,6 +1,6 @@
.arco-table {
@mixin table-cell-text {
color: var(--Text-1, #3C4043);
color: var(--Text-1, #211F24);
font-family: $font-family-regular;
font-size: 14px;
font-style: normal;

View File

@ -285,7 +285,7 @@ export default {
<div class="ai-suggest-box relative py-24px flex flex-col">
{!isEmpty(aiReview.value) && (
<div class="relative w-fit ml-24px mb-16px">
<span class="ai-text">AI 智能审核</span>
<span class="ai-text relative z-2">AI 智能审核</span>
<img src={icon1} class="w-80px h-10.8px absolute bottom-1px left--9px" />
</div>
)}

View File

@ -102,7 +102,7 @@ export default {
} else {
return (
<div class="main-img-box mb-16px relative overflow-hidden cursor-pointer">
<img src={coverImageUrl.value} class="w-100% h-100% object-cover absolute z-0 top-0 left-0" />
<img src={coverImageUrl.value} class="w-100% h-100% object-contain" />
</div>
);
}

View File

@ -68,10 +68,10 @@
aspect-ratio: 3 / 4;
}
.main-img-box {
width: 347px;
width: 320px;
height: auto;
max-height: 472px;
background: #fff;
aspect-ratio: 3/4;
}
.desc-img-wrap {
display: grid;

View File

@ -1,11 +1,25 @@
<template>
<div class="highlight-textarea-container">
<a-textarea ref="textareaWrapRef" v-model="inputValue" placeholder="请输入作品描述" :disabled="disabled" show-word-limit
:max-length="1000" size="large" class="textarea-input h-full w-full" @input="handleInput"
@focus="() => (focus = true)" @blur="() => (focus = false)" />
<a-textarea
ref="textareaWrapRef"
v-model="inputValue"
placeholder="请输入作品描述"
:disabled="disabled"
show-word-limit
:max-length="1000"
size="large"
class="textarea-input h-full w-full"
@input="handleInput"
@focus="() => (focus = true)"
@blur="() => (focus = false)"
/>
<div class="textarea-highlight" :class="{ focus: focus }" :style="{ visibility: inputValue ? 'visible' : 'hidden' }"
v-html="highlightedHtml" />
<div
class="textarea-highlight"
:class="{ focus: focus }"
:style="{ visibility: inputValue ? 'visible' : 'hidden' }"
v-html="highlightedHtml"
/>
</div>
</template>
@ -97,7 +111,8 @@ const generateHighlightedHtml = (): string => {
};
onMounted(() => {
nativeTextarea = (textareaWrapRef.value?.$el || textareaWrapRef.value)?.querySelector?.('textarea.arco-textarea') ||
nativeTextarea =
(textareaWrapRef.value?.$el || textareaWrapRef.value)?.querySelector?.('textarea.arco-textarea') ||
document.querySelector('.textarea-input .arco-textarea');
if (nativeTextarea) {
@ -158,7 +173,7 @@ const handleCompositionUpdate = () => {
font-weight: 400px;
border: 1px solid #d7d7d9;
border-radius: 4px;
resize: vertical;
resize: none;
white-space: pre-wrap;
word-wrap: break-word;
z-index: inherit;
@ -193,9 +208,8 @@ const handleCompositionUpdate = () => {
background: transparent;
color: transparent;
caret-color: #211f24 !important;
resize: none;
@include textarea-padding;
// -webkit-text-fill-color: transparent !important;
overflow-y: auto;
}

View File

@ -81,7 +81,7 @@ export default {
} else {
return (
<div class="main-img-box mb-16px relative overflow-hidden cursor-pointer">
<img src={coverImageUrl.value} class="w-100% h-100% object-contain absolute z-0 top-0 left-0" />
<img src={coverImageUrl.value} class="w-100% h-100% object-contain" />
</div>
);
}

View File

@ -22,8 +22,8 @@ $footer-height: 68px;
.main-img-box {
width: 320px;
height: auto;
max-height: 472px;
background: #fff;
aspect-ratio: 3/4;
}
.desc-img-wrap {
display: grid;

View File

@ -93,7 +93,7 @@ export default {
<>
<div class="manuscript-edit-wrap">
<div class="flex items-center mb-8px">
<span class="cts color-#4E5969 cursor-pointer" onClick={onBack}>
<span class="cts color-#4E5969 cursor-pointer" onClick={onCancel}>
内容稿件列表
</span>
<icon-oblique-line size="12" class="color-#C9CDD4 mx-4px" />

View File

@ -1,11 +1,25 @@
<template>
<div class="highlight-textarea-container">
<a-textarea ref="textareaWrapRef" v-model="inputValue" placeholder="请输入作品描述" :disabled="disabled" show-word-limit
:max-length="1000" size="large" class="textarea-input h-full w-full" @input="handleInput"
@focus="() => (focus = true)" @blur="() => (focus = false)" />
<a-textarea
ref="textareaWrapRef"
v-model="inputValue"
placeholder="请输入作品描述"
:disabled="disabled"
show-word-limit
:max-length="1000"
size="large"
class="textarea-input h-full w-full"
@input="handleInput"
@focus="() => (focus = true)"
@blur="() => (focus = false)"
/>
<div class="textarea-highlight" :class="{ focus: focus }" :style="{ visibility: inputValue ? 'visible' : 'hidden' }"
v-html="highlightedHtml" />
<div
class="textarea-highlight"
:class="{ focus: focus }"
:style="{ visibility: inputValue ? 'visible' : 'hidden' }"
v-html="highlightedHtml"
/>
</div>
</template>
@ -98,7 +112,8 @@ const generateHighlightedHtml = (): string => {
};
onMounted(() => {
nativeTextarea = (textareaWrapRef.value?.$el || textareaWrapRef.value)?.querySelector?.('textarea.arco-textarea') ||
nativeTextarea =
(textareaWrapRef.value?.$el || textareaWrapRef.value)?.querySelector?.('textarea.arco-textarea') ||
document.querySelector('.textarea-input .arco-textarea');
if (nativeTextarea) {
@ -159,7 +174,7 @@ const handleCompositionUpdate = () => {
font-weight: 400px;
border: 1px solid #d7d7d9;
border-radius: 4px;
resize: vertical;
resize: none;
white-space: pre-wrap;
word-wrap: break-word;
z-index: inherit;
@ -194,9 +209,8 @@ const handleCompositionUpdate = () => {
background: transparent;
color: transparent;
caret-color: #211f24 !important;
resize: none;
@include textarea-padding;
// -webkit-text-fill-color: transparent !important;
overflow-y: auto;
}

View File

@ -336,10 +336,9 @@ export default {
onInput={onChange}
placeholder="请输入作品描述"
size="large"
class="h-300px !w-784px"
class="textarea-box !w-784px"
show-word-limit
max-length={1000}
auto-size={{ minRows: 7, maxRows: 12 }}
/>
</FormItem>
{isVideo.value ? (

View File

@ -30,3 +30,9 @@
}
}
}
.textarea-box {
:deep(.arco-textarea) {
height: 140px;
max-height: 298px;
}
}

View File

@ -221,7 +221,7 @@ export default {
class="flex items-center w-fit h-24px px-8px rounded-2px"
style={{ backgroundColor: getStatusInfo(record.audit_status).backgroundColor }}
>
<span class="cts s1" style={{ color: getStatusInfo(record.audit_status).color }}>
<span class="cts s1 bold" style={{ color: getStatusInfo(record.audit_status).color }}>
{getStatusInfo(record.audit_status).name}
</span>
</div>
@ -238,20 +238,23 @@ export default {
class="mr-4px"
/>
<span
class="cts"
class={
class={`cts !text-14px !lh-22px ${
record.type === EnumManuscriptType.Image ? '!color-#25C883' : '!color-#6D4CFE'
}
}`}
>
{record.type === EnumManuscriptType.Image ? '图文' : '视频'}
</span>
</div>
);
} else if (column.dataIndex === 'last_modified_at') {
return exactFormatTime(
record.last_modified_at,
'YYYY-MM-DD HH:mm:ss',
'YYYY-MM-DD HH:mm:ss',
return (
<span class="cts num">
{exactFormatTime(
record.last_modified_at,
'YYYY-MM-DD HH:mm:ss',
'YYYY-MM-DD HH:mm:ss',
)}
</span>
);
} else {
return formatTableField(column, record, true);

View File

@ -8,6 +8,9 @@
&.bold {
font-family: $font-family-medium;
}
&.num {
font-family: $font-family-manrope-regular;
}
}
.filter-row-item {
.label {
@ -23,5 +26,43 @@
.arco-scrollbar-track {
display: none !important;
}
.arco-table {
.arco-table-container {
.arco-table-element {
thead {
.arco-table-tr {
.arco-table-th {
.arco-table-cell {
padding: 10px 16px !important;
}
}
}
}
tbody {
.arco-table-tr {
.arco-table-td {
.arco-table-cell {
padding: 6px 16px;
.arco-table-cell-content,
.arco-table-td-content {
font-size: 12px;
line-height: 20px;
}
}
}
}
}
}
}
}
.arco-pagination {
.arco-pagination-total,
.arco-pagination-jumper-prepend {
font-size: 14px;
}
.arco-pagination-jumper-prepend {
font-family: $font-family-regular;
}
}
}
}

View File

@ -79,8 +79,8 @@ export default {
);
} else {
return (
<div class="main-img-box mb-16px relative overflow-hidden cursor-pointer">
<img src={coverImageUrl.value} class="w-100% h-100% object-contain absolute z-0 top-0 left-0" />
<div class="main-img-box mb-16px overflow-hidden cursor-pointer">
<img src={coverImageUrl.value} class="w-100% h-100% object-contain" />
</div>
);
}

View File

@ -22,8 +22,9 @@ $footer-height: 68px;
.main-img-box {
width: 320px;
height: auto;
max-height: 472px;
background: #fff;
aspect-ratio: 3/4;
// aspect-ratio: 3/4;
}
.desc-img-wrap {
display: grid;

View File

@ -91,7 +91,7 @@ export default {
<>
<div class="manuscript-edit-wrap">
<div class="flex items-center mb-8px">
<span class="cts color-#4E5969 cursor-pointer" onClick={onBack}>
<span class="cts color-#4E5969 cursor-pointer" onClick={onCancel}>
内容稿件列表
</span>
<icon-oblique-line size="12" class="color-#C9CDD4 mx-4px" />