This commit is contained in:
lcw
2026-03-29 19:46:50 +08:00
parent 60de16032f
commit af838854fa
49 changed files with 9947 additions and 1512 deletions

View File

@ -1,147 +1,172 @@
<template>
<el-dialog v-model="dialogVisible" title="发布帖子" width="600px" :before-close="handleClose">
<el-form :model="form" :rules="rules" ref="formRef" label-width="80px">
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" placeholder="请输入帖子标题" maxlength="50" show-word-limit />
</el-form-item>
<el-dialog
v-model="dialogVisible"
class="luntan-tech-dialog"
title="发布帖子"
width="60%"
:before-close="handleClose"
>
<div style="overflow: auto; height: 60vh">
<el-form :model="form" :rules="rules" ref="formRef" label-width="80px">
<el-form-item label="标题" prop="title">
<el-input
v-model="form.title"
placeholder="请输入帖子标题"
maxlength="50"
show-word-limit
/>
</el-form-item>
<el-form-item label="内容" prop="content">
<el-input v-model="form.content" type="textarea" :rows="6" placeholder="请输入帖子内容" maxlength="500"
show-word-limit />
</el-form-item>
<el-form-item label="内容" prop="content">
<el-input
v-model="form.content"
type="textarea"
:rows="6"
placeholder="请输入帖子内容"
maxlength="500"
show-word-limit
/>
</el-form-item>
<el-form-item label="表情">
<V3Emoji
:options-name="optionsName"
@click-emoji="onEmojiClick"
:recent="true"
/>
</el-form-item>
<el-form-item label="表情">
<V3Emoji
:options-name="optionsName"
@click-emoji="onEmojiClick"
:recent="true"
/>
</el-form-item>
<el-form-item label="图片">
<Upload v-model="imageIds" :limit="9" :isImg="true" :isAll="true" />
</el-form-item>
</el-form>
<el-form-item label="图片">
<Upload v-model="imageIds" :limit="9" :isImg="true" :isAll="true" />
</el-form-item>
</el-form>
</div>
<template #footer>
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="handleSubmit" :loading="submitting">
发布
</el-button>
</template>
</el-dialog>
<template #footer>
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="handleSubmit" :loading="submitting">
发布
</el-button>
</template>
</el-dialog>
</template>
<script setup>
import { ref, watch } from 'vue'
import { ElMessage } from 'element-plus'
import V3Emoji from 'vue3-emoji'
import { tbGsxtXxltSave } from '@/api/tbGsxtXxltHf'
import { getItem } from '@/utils/storage.js'
import Upload from '@/components/MyComponents/Upload/index.vue'
import { ref, watch } from "vue";
import { ElMessage } from "element-plus";
import V3Emoji from "vue3-emoji";
import { tbGsxtXxltSave } from "@/api/tbGsxtXxltHf";
import { getItem } from "@/utils/storage.js";
import Upload from "@/components/MyComponents/Upload/index.vue";
const optionsName = {
'Smileys & Emotion': '笑脸&表情',
'Food & Drink': '食物&饮料',
'Animals & Nature': '动物&自然',
'Travel & Places': '旅行&地点',
'People & Body': '人物&身体',
Objects: '物品',
Symbols: '符号',
Flags: '旗帜',
Activities: '活动'
}
"Smileys & Emotion": "笑脸&表情",
"Food & Drink": "食物&饮料",
"Animals & Nature": "动物&自然",
"Travel & Places": "旅行&地点",
"People & Body": "人物&身体",
Objects: "物品",
Symbols: "符号",
Flags: "旗帜",
Activities: "活动"
};
const props = defineProps({
modelValue: {
type: Boolean,
default: false
}
})
modelValue: {
type: Boolean,
default: false
}
});
const emit = defineEmits(['update:modelValue', 'success'])
const emit = defineEmits(["update:modelValue", "success"]);
const dialogVisible = ref(false)
const formRef = ref()
const submitting = ref(false)
const imageIds = ref([])
const dialogVisible = ref(false);
const formRef = ref();
const submitting = ref(false);
const imageIds = ref([]);
const form = ref({
title: '',
content: ''
})
title: "",
content: ""
});
const rules = {
title: [
{ required: true, message: '请输入标题', trigger: 'blur' }
],
content: [
{ required: true, message: '请输入内容', trigger: 'blur' }
]
}
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
content: [{ required: true, message: "请输入内容", trigger: "blur" }]
};
watch(() => props.modelValue, (val) => {
dialogVisible.value = val
})
watch(
() => props.modelValue,
(val) => {
dialogVisible.value = val;
}
);
watch(dialogVisible, (val) => {
emit('update:modelValue', val)
if (!val) {
resetForm()
}
})
emit("update:modelValue", val);
if (!val) {
resetForm();
}
});
const onEmojiClick = (emoji) => {
form.value.content += emoji
}
form.value.content += emoji;
};
const handleClose = () => {
dialogVisible.value = false
}
dialogVisible.value = false;
};
const handleSubmit = async () => {
if (!formRef.value) return
if (!formRef.value) return;
await formRef.value.validate(async (valid) => {
if (valid) {
submitting.value = true
try {
const ltmasg = getItem('ltmasg')
await formRef.value.validate(async (valid) => {
if (valid) {
submitting.value = true;
try {
const ltmasg = getItem("ltmasg");
const postData = {
title: form.value.title,
content: form.value.content,
tp: imageIds.value.join(','),
fbrsfzh: ltmasg?.sfzh || '',
fbrxm: ltmasg?.xm || '',
fbrtx: ltmasg?.tx || ''
}
const postData = {
title: form.value.title,
content: form.value.content,
tp: imageIds.value.join(","),
fbrsfzh: ltmasg?.sfzh || "",
fbrxm: ltmasg?.xm || "",
fbrtx: ltmasg?.tx || ""
};
await tbGsxtXxltSave(postData)
await tbGsxtXxltSave(postData);
ElMessage.success('发布成功')
emit('success')
handleClose()
} catch (error) {
console.error('发布失败', error)
ElMessage.error('发布失败')
} finally {
submitting.value = false
}
}
})
}
ElMessage.success("发布成功");
emit("success");
handleClose();
} catch (error) {
console.error("发布失败", error);
ElMessage.error("发布失败");
} finally {
submitting.value = false;
}
}
});
};
const resetForm = () => {
form.value = {
title: '',
content: ''
}
imageIds.value = []
formRef.value?.resetFields()
}
form.value = {
title: "",
content: ""
};
imageIds.value = [];
formRef.value?.resetFields();
};
</script>
<style scoped lang="scss">
// 样式已由Upload组件内部处理</style>
// Upload 等子组件样式在各自内部
::v-deep .form-item-box {
width: 100% !important;
}
</style>
<style lang="scss">
@import "../styles/luntan-dialog-tech.scss";
</style>