修改视频部分内容

This commit is contained in:
qingyu 2025-06-26 15:23:34 +08:00
parent 26e985e99f
commit a47ab30f19
3 changed files with 57 additions and 26 deletions

View File

@ -73,6 +73,7 @@ import { config } from '@/config'
defineOptions({ defineOptions({
name: 'XUploadVideo', name: 'XUploadVideo',
}) })
defineProps({ defineProps({
modelValue: { modelValue: {
type: [String, Array], type: [String, Array],
@ -114,7 +115,8 @@ const fileList = ref([])
const uploadVideoRef = ref() const uploadVideoRef = ref()
const loading = computed(() => fileList.value.some((o) => STATUS_ENUM.is('uploading', o.status))) const loading = computed(() => fileList.value.some((o) => STATUS_ENUM.is('uploading', o.status)))
const showUploadBtn = computed(() => props.multiple || !fileList.value.length) const showUploadBtn = computed(() =>true)
//const showUploadBtn = computed(() => props.multiple || !fileList.value.length)
watch(() => props.modelValue, () => init()) watch(() => props.modelValue, () => init())
onMounted(() => init()) onMounted(() => init())
@ -141,7 +143,6 @@ function onBeforeUpload(file) {
return true return true
} }
function customRequest(file) { function customRequest(file) {
const record = getItem({ const record = getItem({
key: file.uid, key: file.uid,
@ -150,10 +151,11 @@ function customRequest(file) {
file, file,
}) })
//
const reader = new FileReader() const reader = new FileReader()
reader.onload = (e) => { reader.onload = (e) => {
record.src = e.target.result record.src = e.target.result
console.log('Preview loaded:', record.src)
fileList.value = [...fileList.value] //
} }
reader.readAsDataURL(file) reader.readAsDataURL(file)
@ -168,6 +170,39 @@ function customRequest(file) {
} }
} }
// function customRequest(file) {
// const record = getItem({
// key: file.uid,
// status: STATUS_ENUM.getValue('wait'),
// percent: 0,
// file,
// })
//
// //
// const reader = new FileReader()
// // reader.onload = (e) => {
// // record.src = e.target.result
// // }
// reader.onload = (e) => {
// record.src = e.target.result
// fileList.value = [...fileList.value] //
// }
//
// reader.readAsDataURL(file)
//
// if (props.multiple) {
// fileList.value.push(record)
// console.log('customRequest called:', file)
//
// } else {
// fileList.value = [record]
// }
//
// if (!loading.value) {
// doUpload()
// }
// }
async function doUpload() { async function doUpload() {
const index = findIndex(fileList.value, { status: STATUS_ENUM.getValue('wait') }) const index = findIndex(fileList.value, { status: STATUS_ENUM.getValue('wait') })
if (index === -1) return if (index === -1) return

View File

@ -9,12 +9,12 @@
<a-input :placeholder="'请输入标题'" v-model:value="formData.title"></a-input> <a-input :placeholder="'请输入标题'" v-model:value="formData.title"></a-input>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="24"> <!-- <a-col :span="24">-->
<a-form-item :label="'内容'" name="subheading"> <!-- <a-form-item :label="'内容'" name="subheading">-->
<!-- <a-textarea :placeholder="'内容'" v-model:value="formData.subheading"></a-textarea>--> <!--&lt;!&ndash; <a-textarea :placeholder="'内容'" v-model:value="formData.subheading"></a-textarea>&ndash;&gt;-->
<a-textarea :placeholder="'请输入内容'" v-model:value="formData.subheading"></a-textarea> <!-- <a-textarea :placeholder="'请输入内容'" v-model:value="formData.subheading"></a-textarea>-->
</a-form-item> <!-- </a-form-item>-->
</a-col> <!-- </a-col>-->
<a-col :span="24"> <a-col :span="24">
<a-form-item :label="'链接'" name="link"> <a-form-item :label="'链接'" name="link">
<a-input v-model:value="formData.link" :placeholder="'请输入链接'" /> <a-input v-model:value="formData.link" :placeholder="'请输入链接'" />
@ -36,17 +36,17 @@
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-item :label="'大图片'" name="fullImg"> <a-form-item :label="'大图片'" name="fullImg">
<x-upload-image v-model="formData.fullImg" @imgChange="(val) => imgChange(val, 'fullImg')" /> <x-upload-image v-model="fullImg" @imgChange="(val) => imgChange(val, 'fullImg')" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-item :label="'小图片'" name="smallImg"> <a-form-item :label="'小图片'" name="smallImg">
<x-upload-image v-model="formData.smallImg" @imgChange="(val) => imgChange(val, 'smallImg')" /> <x-upload-image v-model="smallImg" @imgChange="(val) => imgChange(val, 'smallImg')" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="24"> <a-col :span="24">
<a-form-item :label="'视频'" name="videoUrl"> <a-form-item :label="'视频'" name="videoUrl">
<x-upload-video v-model="formData.videoUrl" @imgChange="(val) => imgChange(val, 'videoUrl')" /> <x-upload-video v-model="videoUrl" @imgChange="(val) => imgChange(val, 'videoUrl')" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<!-- <a-col :span="24">--> <!-- <a-col :span="24">-->
@ -127,8 +127,6 @@ function handleCreate() {
}) })
formData.value.status = 'enabled' formData.value.status = 'enabled'
} }
/** /**
* 编辑 * 编辑
*/ */
@ -145,11 +143,10 @@ async function handleEdit(record = {}) {
formData.value = { ...data } formData.value = { ...data }
formData.value.pushAt = dayjs(data.pushAt) formData.value.pushAt = dayjs(data.pushAt)
console.log(formData.value) console.log(formData.value)
formData.value.fullImg = config('http.apiBasic') + data.fullImg fullImg.value = config('http.apiBasic') + data.fullImg
formData.value.smallImg = config('http.apiBasic') + data.smallImg smallImg.value = config('http.apiBasic') + data.smallImg
formData.value.videoUrl = config('http.apiBasic') + data.videoUrl videoUrl.value = config('http.apiBasic') + data.videoUrl
} }
/** /**
* 确定 * 确定
*/ */
@ -161,7 +158,6 @@ function handleOk() {
showLoading() showLoading()
const params = { const params = {
...values, ...values,
//img: formData.value.img,
fullImg: formData.value.fullImg, fullImg: formData.value.fullImg,
smallImg: formData.value.smallImg, smallImg: formData.value.smallImg,
videoUrl: formData.value.videoUrl, videoUrl: formData.value.videoUrl,

View File

@ -52,18 +52,18 @@
<a-image :width="60" :src="config('http.apiBasic') + record.smallImg || $imageErr.imgErr" /> <a-image :width="60" :src="config('http.apiBasic') + record.smallImg || $imageErr.imgErr" />
</template> </template>
<template v-if="'videoUrl' === column.dataIndex"> <template v-if="'videoUrl' === column.dataIndex">
<video :width="60" :src="config('http.apiBasic') + record.videoUrl || $mp4Err.mp4Err"/> <video :width="60" :src="config('http.apiBasic') + record.videoUrl || $imageErr.imgErr"/>
</template> </template>
<template v-if="column.dataIndex === 'title'"> <template v-if="column.dataIndex === 'title'">
<a-tooltip :title="record.title"> <a-tooltip :title="record.title">
<span>{{ record.title }}</span> <span>{{ record.title }}</span>
</a-tooltip> </a-tooltip>
</template> </template>
<template v-if="column.dataIndex === 'subheading'"> <!-- <template v-if="column.dataIndex === 'subheading'">-->
<a-tooltip :title="record.subheading"> <!-- <a-tooltip :title="record.subheading">-->
<span>{{ record.subheading }}</span> <!-- <span>{{ record.subheading }}</span>-->
</a-tooltip> <!-- </a-tooltip>-->
</template> <!-- </template>-->
<template v-if="column.dataIndex === 'link'"> <template v-if="column.dataIndex === 'link'">
<a-tooltip :title="record.link"> <a-tooltip :title="record.link">
<a :href="record.link" target="_blank" style="text-decoration: underline;">{{ <a :href="record.link" target="_blank" style="text-decoration: underline;">{{
@ -115,7 +115,7 @@ const columns = [
{ title: '小图片', dataIndex: 'smallImg', width: 100, align: 'center' }, { title: '小图片', dataIndex: 'smallImg', width: 100, align: 'center' },
{ title: '视频', dataIndex: 'videoUrl', width: 100, align: 'center' }, { title: '视频', dataIndex: 'videoUrl', width: 100, align: 'center' },
{ title: '标题', dataIndex: 'title', key: 'title' }, { title: '标题', dataIndex: 'title', key: 'title' },
{ title: '简介', dataIndex: 'subheading', key: 'subheading' }, // { title: '', dataIndex: 'subheading', key: 'subheading' },
{ title: '状态', dataIndex: 'status', width: 120, align: 'center' }, { title: '状态', dataIndex: 'status', width: 120, align: 'center' },
{ title: '发布日期', dataIndex: 'pushAt', width: 120, align: 'center' }, { title: '发布日期', dataIndex: 'pushAt', width: 120, align: 'center' },
{ title: '链接', dataIndex: 'link', align: 'center' }, { title: '链接', dataIndex: 'link', align: 'center' },