添加标签筛选及笔记详情查看功能
This commit is contained in:
@@ -37,8 +37,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<!-- <el-input class="inputWidth" v-model="queryParams.tagId" placeholder="请输入景点标签" clearable @keyup.enter="handleQuery" /> -->
|
||||
<el-select class="inputWidth" v-model="queryParams.tagId" placeholder="请选择标签" clearable>
|
||||
<el-select class="inputWidth" multiple v-model="queryParams.tagId" placeholder="请选择标签" clearable>
|
||||
<el-option v-for="dict in sys_user_tagOptions" :key="dict.id" :label="dict.title" :value="dict.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@@ -109,8 +108,16 @@
|
||||
<el-button link type="primary" @click="handleNote(scope.row)">11{{ scope.row.noteNumber }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="笔记评论数" align="center" prop="notebookCommentCount" width="90px" />
|
||||
<el-table-column label="笔记点赞数" align="center" prop="notebookAgreeCount" width="90px" />
|
||||
<el-table-column label="笔记评论数" align="center" prop="notebookCommentCount" width="90px">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleNote(scope.row)">11{{ scope.row.noteNumber }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="笔记点赞数" align="center" prop="notebookAgreeCount" width="90px">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleNote(scope.row)">11{{ scope.row.noteNumber }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 0-未发布 1-审核中 2-发布 -->
|
||||
<el-table-column label="发布状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
@@ -216,8 +223,8 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-select class="inputWidth" v-model="form.tagId" placeholder="请选择标签" clearable>
|
||||
<el-form-item label="标签" prop="tagId_copy">
|
||||
<el-select class="inputWidth" v-model="form.tagId_copy" multiple filterable placeholder="请选择标签" clearable>
|
||||
<el-option v-for="dict in sys_user_tagOptions" :key="dict.id" :label="dict.title" :value="String(dict.id)" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@@ -365,7 +372,7 @@
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-select class="inputWidth" v-model="form.tagId" placeholder="请选择标签" clearable>
|
||||
<el-select class="inputWidth" v-model="form.tagId" placeholder="请选择标签" clearable disabled>
|
||||
<el-option v-for="dict in sys_user_tagOptions" :key="dict.id" :label="dict.title" :value="String(dict.id)" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@@ -411,8 +418,15 @@
|
||||
</template>
|
||||
</el-dialog>
|
||||
<!-- 相关笔记 -->
|
||||
<el-dialog title="相关笔记" v-model="noteBookVisible" width="900px" append-to-body>
|
||||
<noteList :autoTableHeight="300" :tableList="noteList" :type="queryParams.type" :id="form.id"></noteList>
|
||||
<el-dialog title="相关笔记" v-model="noteBookVisible" width="1200px" append-to-body>
|
||||
<noteList
|
||||
:autoTableHeight="300"
|
||||
:sys_user_tagOptions="sys_user_tagOptions"
|
||||
:noteBookTagIds="noteBookTagIds"
|
||||
parentName="scenic"
|
||||
:type="queryParams.type"
|
||||
:id="form.id"
|
||||
></noteList>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="cancel('noteBookVisible')">关 闭</el-button>
|
||||
@@ -425,7 +439,7 @@
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listTag } from '@/api/manage/tag';
|
||||
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle, geocoder } from '@/api/manage/article';
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle, listByTagIdNotebook } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { getToken } from '@/utils/auth';
|
||||
@@ -454,7 +468,7 @@ const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
const noteList = ref([]); // 相关笔记列表
|
||||
const noteLists = ref([]); // 相关笔记列表
|
||||
const previewRef = ref(null);
|
||||
const previewVisible = ref(false); //预览弹层
|
||||
const dialogImageUrl = ref('');
|
||||
@@ -489,10 +503,11 @@ const initFormData: ArticleForm = {
|
||||
status: undefined,
|
||||
province: '',
|
||||
city: '',
|
||||
regionCode: '',
|
||||
region: '',
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
tagId_copy: [],
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
@@ -528,6 +543,7 @@ const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
tagId_copy: [],
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
@@ -547,7 +563,7 @@ const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
// remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
// memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
tagId_copy: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
@@ -637,7 +653,7 @@ const performSearch = async (text) => {
|
||||
data.result.address_components.street_number;
|
||||
form.value.latitude = data.result.location.lat;
|
||||
form.value.longitude = data.result.location.lng;
|
||||
form.value.regionCode = data.result.ad_info.adcode; //行政区划编码
|
||||
form.value.region = data.result.ad_info.adcode; //行政区划编码
|
||||
|
||||
// form.value.province = data.result.address_components.province;
|
||||
// form.value.city = data.result.address_components.city;
|
||||
@@ -668,7 +684,7 @@ const onClick = (e: any) => {
|
||||
form.value.longitude = data.result.location.lng;
|
||||
// form.value.province = data.result.address_component.province;
|
||||
// form.value.city = data.result.address_component.city;
|
||||
form.value.regionCode = data.result.ad_info.adcode; //行政区划编码
|
||||
form.value.region = data.result.ad_info.adcode; //行政区划编码
|
||||
center.value.lat = data.result.location.lat;
|
||||
center.value.lng = data.result.location.lng;
|
||||
searchLocation.value = data.result.formatted_addresses.recommend;
|
||||
@@ -682,6 +698,9 @@ const debouncedSearch = debounce(performSearch, 300); // 创建防抖后的搜
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
if (queryParams.value.tagId && queryParams.value.tagId.length > 0) {
|
||||
queryParams.value.tagId = queryParams.value.tagId.toString();
|
||||
}
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
@@ -697,6 +716,7 @@ const cancel = (type: string) => {
|
||||
}
|
||||
dialog.visible = false;
|
||||
noteBookVisible.value = false;
|
||||
noteBookTagIds.value = null; // 清空标签
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
@@ -755,13 +775,15 @@ const formatLevel = (level: number | string) => {
|
||||
/**
|
||||
* 标签格式化
|
||||
*/
|
||||
const formatTag = (tagId: string) => {
|
||||
const formatTag = (tagId: string | null) => {
|
||||
let tagString = '';
|
||||
for (let i = 0; i < sys_user_tagOptions.value.length; i++) {
|
||||
const element = sys_user_tagOptions.value[i];
|
||||
if (element.id == tagId) {
|
||||
return element.title;
|
||||
if (tagId?.includes(element.id)) {
|
||||
tagString += ',' + element.title;
|
||||
}
|
||||
}
|
||||
return tagString.substring(1);
|
||||
};
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
@@ -775,10 +797,14 @@ const handleAdd = () => {
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
const handleUpdate = async (row?: any) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
res.data.tagId_copy = res.data.tagId?.split(',');
|
||||
if (res.data.region == null) {
|
||||
res.data.region = res.data.city;
|
||||
}
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = queryParams.value.type == '0' ? '修改景点' : '修改商家';
|
||||
@@ -801,17 +827,23 @@ const handleDetail = async (row?: ArticleVO) => {
|
||||
* @param row 相关笔记
|
||||
*/
|
||||
const noteBookVisible = ref(false);
|
||||
const noteBookTagIds = ref(null); //相关笔记的标签id
|
||||
const handleNote = async (row?: ArticleVO) => {
|
||||
console.log(row);
|
||||
noteBookTagIds.value = null;
|
||||
noteBookTagIds.value = row?.tagId;
|
||||
noteBookVisible.value = true;
|
||||
console.log(row.tagId);
|
||||
};
|
||||
/** 新增景点,商家提交按钮 */
|
||||
const submitForm = async (type: string) => {
|
||||
form.value.type = queryParams.value.type;
|
||||
form.value.tagId = form.value.tagId_copy?.join(',');
|
||||
if (type == 'draft') {
|
||||
// 存草稿,不验证必填项
|
||||
form.value.status = '3'; //草稿状态为3
|
||||
buttonLoading.value = true;
|
||||
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user