优化用户界面及功能，调整表格高度和搜索框宽度
This commit is contained in:
parent
dc10df8f64
commit
a10ecd6609
@ -32,4 +32,4 @@ VITE_APP_CLIENT_ID = 'e5cd7e4891bf95d1d19206ce24a7b32e'
|
||||
VITE_APP_WEBSOCKET = false
|
||||
|
||||
# sse 开关
|
||||
VITE_APP_SSE = true
|
||||
VITE_APP_SSE = false
|
||||
|
||||
@ -66,10 +66,10 @@
|
||||
"eslint": "8.57.0",
|
||||
"eslint-config-prettier": "9.1.0",
|
||||
"eslint-define-config": "2.1.0",
|
||||
"eslint-plugin-import": "2.29.1",
|
||||
"eslint-plugin-node": "11.1.0",
|
||||
"eslint-plugin-prettier": "5.1.3",
|
||||
"eslint-plugin-promise": "6.1.1",
|
||||
"eslint-plugin-node": "11.1.0",
|
||||
"eslint-plugin-import": "2.29.1",
|
||||
"eslint-plugin-vue": "9.23.0",
|
||||
"fast-glob": "3.3.2",
|
||||
"postcss": "8.4.36",
|
||||
@ -84,6 +84,7 @@
|
||||
"vite": "5.2.12",
|
||||
"vite-plugin-compression": "0.5.1",
|
||||
"vite-plugin-svg-icons": "2.0.1",
|
||||
"vite-plugin-vue-devtools": "^7.6.7",
|
||||
"vitest": "1.5.0",
|
||||
"vue-eslint-parser": "9.4.2",
|
||||
"vue-tsc": "2.0.13"
|
||||
|
||||
63
src/api/manage/article/index.ts
Normal file
63
src/api/manage/article/index.ts
Normal file
@ -0,0 +1,63 @@
|
||||
import request from '@/utils/request';
|
||||
import { AxiosPromise } from 'axios';
|
||||
import { ArticleVO, ArticleForm, ArticleQuery } from '@/api/system/article/types';
|
||||
|
||||
/**
|
||||
* 查询景点、租赁管理列表
|
||||
* @param query
|
||||
* @returns {*}
|
||||
*/
|
||||
|
||||
export const listArticle = (query?: ArticleQuery): AxiosPromise<ArticleVO[]> => {
|
||||
return request({
|
||||
url: '/system/article/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 查询景点、租赁管理详细
|
||||
* @param id
|
||||
*/
|
||||
export const getArticle = (id: string | number): AxiosPromise<ArticleVO> => {
|
||||
return request({
|
||||
url: '/system/article/' + id,
|
||||
method: 'get'
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 新增景点、租赁管理
|
||||
* @param data
|
||||
*/
|
||||
export const addArticle = (data: ArticleForm) => {
|
||||
return request({
|
||||
url: '/system/article',
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 修改景点、租赁管理
|
||||
* @param data
|
||||
*/
|
||||
export const updateArticle = (data: ArticleForm) => {
|
||||
return request({
|
||||
url: '/system/article',
|
||||
method: 'put',
|
||||
data: data
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 删除景点、租赁管理
|
||||
* @param id
|
||||
*/
|
||||
export const delArticle = (id: string | number | Array<string | number>) => {
|
||||
return request({
|
||||
url: '/system/article/' + id,
|
||||
method: 'delete'
|
||||
});
|
||||
};
|
||||
276
src/api/manage/article/types.ts
Normal file
276
src/api/manage/article/types.ts
Normal file
@ -0,0 +1,276 @@
|
||||
export interface ArticleVO {
|
||||
/**
|
||||
* 景点ID/租赁ID/游艇ID
|
||||
*/
|
||||
id: string | number;
|
||||
|
||||
/**
|
||||
* 类别 景点-0、租赁-1 游艇-2
|
||||
*/
|
||||
type: string;
|
||||
|
||||
/**
|
||||
* 二级类别（未定）
|
||||
*/
|
||||
secondType: string;
|
||||
|
||||
/**
|
||||
* 开放/营业
|
||||
*/
|
||||
isOpen: string;
|
||||
|
||||
/**
|
||||
* 景点属性/商家属性
|
||||
*/
|
||||
attribute: string;
|
||||
|
||||
/**
|
||||
* 状态 0-未发布 1-审核中 2-发布
|
||||
*/
|
||||
status: string;
|
||||
|
||||
/**
|
||||
* 省code
|
||||
*/
|
||||
province: string;
|
||||
|
||||
/**
|
||||
* 市/区
|
||||
*/
|
||||
city: string;
|
||||
|
||||
/**
|
||||
* 个人简介
|
||||
*/
|
||||
remark: string;
|
||||
|
||||
/**
|
||||
* 会员等级
|
||||
*/
|
||||
memberLevel: number;
|
||||
|
||||
/**
|
||||
* 标签
|
||||
*/
|
||||
tagId: string | number;
|
||||
|
||||
/**
|
||||
* 推荐语
|
||||
*/
|
||||
recommend: string;
|
||||
|
||||
/**
|
||||
* 介绍
|
||||
*/
|
||||
intro: string;
|
||||
|
||||
/**
|
||||
* 详细地址
|
||||
*/
|
||||
address: string;
|
||||
|
||||
/**
|
||||
* 经度
|
||||
*/
|
||||
longitude: number;
|
||||
|
||||
/**
|
||||
* 纬度
|
||||
*/
|
||||
latitude: number;
|
||||
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
orderNum: number;
|
||||
|
||||
/**
|
||||
* 景区等级
|
||||
*/
|
||||
level: number;
|
||||
|
||||
}
|
||||
|
||||
export interface ArticleForm extends BaseEntity {
|
||||
/**
|
||||
* 景点ID/租赁ID/游艇ID
|
||||
*/
|
||||
id?: string | number;
|
||||
|
||||
/**
|
||||
* 类别 景点-0、租赁-1 游艇-2
|
||||
*/
|
||||
type?: string;
|
||||
|
||||
/**
|
||||
* 二级类别（未定）
|
||||
*/
|
||||
secondType?: string;
|
||||
|
||||
/**
|
||||
* 开放/营业
|
||||
*/
|
||||
isOpen?: string;
|
||||
|
||||
/**
|
||||
* 景点属性/商家属性
|
||||
*/
|
||||
attribute?: string;
|
||||
|
||||
/**
|
||||
* 状态 0-未发布 1-审核中 2-发布
|
||||
*/
|
||||
status?: string;
|
||||
|
||||
/**
|
||||
* 省code
|
||||
*/
|
||||
province?: string;
|
||||
|
||||
/**
|
||||
* 市/区
|
||||
*/
|
||||
city?: string;
|
||||
|
||||
/**
|
||||
* 个人简介
|
||||
*/
|
||||
remark?: string;
|
||||
|
||||
/**
|
||||
* 会员等级
|
||||
*/
|
||||
memberLevel?: number;
|
||||
|
||||
/**
|
||||
* 标签
|
||||
*/
|
||||
tagId?: string | number;
|
||||
|
||||
/**
|
||||
* 推荐语
|
||||
*/
|
||||
recommend?: string;
|
||||
|
||||
/**
|
||||
* 介绍
|
||||
*/
|
||||
intro?: string;
|
||||
|
||||
/**
|
||||
* 详细地址
|
||||
*/
|
||||
address?: string;
|
||||
|
||||
/**
|
||||
* 经度
|
||||
*/
|
||||
longitude?: number;
|
||||
|
||||
/**
|
||||
* 纬度
|
||||
*/
|
||||
latitude?: number;
|
||||
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
orderNum?: number;
|
||||
|
||||
/**
|
||||
* 景区等级
|
||||
*/
|
||||
level?: number;
|
||||
|
||||
}
|
||||
|
||||
export interface ArticleQuery extends PageQuery {
|
||||
|
||||
/**
|
||||
* 类别 景点-0、租赁-1 游艇-2
|
||||
*/
|
||||
type?: string;
|
||||
|
||||
/**
|
||||
* 二级类别（未定）
|
||||
*/
|
||||
secondType?: string;
|
||||
|
||||
/**
|
||||
* 开放/营业
|
||||
*/
|
||||
isOpen?: string;
|
||||
|
||||
/**
|
||||
* 景点属性/商家属性
|
||||
*/
|
||||
attribute?: string;
|
||||
|
||||
/**
|
||||
* 状态 0-未发布 1-审核中 2-发布
|
||||
*/
|
||||
status?: string;
|
||||
|
||||
/**
|
||||
* 省code
|
||||
*/
|
||||
province?: string;
|
||||
|
||||
/**
|
||||
* 市/区
|
||||
*/
|
||||
city?: string;
|
||||
|
||||
/**
|
||||
* 会员等级
|
||||
*/
|
||||
memberLevel?: number;
|
||||
|
||||
/**
|
||||
* 标签
|
||||
*/
|
||||
tagId?: string | number;
|
||||
|
||||
/**
|
||||
* 推荐语
|
||||
*/
|
||||
recommend?: string;
|
||||
|
||||
/**
|
||||
* 介绍
|
||||
*/
|
||||
intro?: string;
|
||||
|
||||
/**
|
||||
* 详细地址
|
||||
*/
|
||||
address?: string;
|
||||
|
||||
/**
|
||||
* 经度
|
||||
*/
|
||||
longitude?: number;
|
||||
|
||||
/**
|
||||
* 纬度
|
||||
*/
|
||||
latitude?: number;
|
||||
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
orderNum?: number;
|
||||
|
||||
/**
|
||||
* 景区等级
|
||||
*/
|
||||
level?: number;
|
||||
|
||||
/**
|
||||
* 日期范围参数
|
||||
*/
|
||||
params?: any;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,4 +1,8 @@
|
||||
#app {
|
||||
// 列表上方搜索框宽度
|
||||
.inputWidth {
|
||||
width: 130px;
|
||||
}
|
||||
.main-container {
|
||||
height: 100%;
|
||||
transition: margin-left 0.28s;
|
||||
|
||||
@ -23,11 +23,11 @@
|
||||
|
||||
<!-- <header-search id="header-search" class="right-menu-item" /> -->
|
||||
<search-menu ref="searchMenuRef" />
|
||||
<el-tooltip content="搜索" effect="dark" placement="bottom">
|
||||
<!-- <el-tooltip content="搜索" effect="dark" placement="bottom">
|
||||
<div class="right-menu-item hover-effect" @click="openSearchMenu">
|
||||
<svg-icon class-name="search-icon" icon-class="search" />
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</el-tooltip> -->
|
||||
<!-- 消息 -->
|
||||
<el-tooltip :content="$t('navbar.message')" effect="dark" placement="bottom">
|
||||
<div>
|
||||
@ -43,7 +43,7 @@
|
||||
</el-popover>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="Github" effect="dark" placement="bottom">
|
||||
<!-- <el-tooltip content="Github" effect="dark" placement="bottom">
|
||||
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
|
||||
</el-tooltip>
|
||||
|
||||
@ -61,7 +61,7 @@
|
||||
|
||||
<el-tooltip :content="$t('navbar.layoutSize')" effect="dark" placement="bottom">
|
||||
<size-select id="size-select" class="right-menu-item hover-effect" />
|
||||
</el-tooltip>
|
||||
</el-tooltip> -->
|
||||
</template>
|
||||
<div class="avatar-container">
|
||||
<el-dropdown class="right-menu-item hover-effect" trigger="click" @command="handleCommand">
|
||||
|
||||
@ -34,7 +34,7 @@ defineProps({
|
||||
}
|
||||
});
|
||||
|
||||
const title = ref('RuoYi-Vue-Plus');
|
||||
const title = ref('导游后台管理系统');
|
||||
const settingsStore = useSettingsStore();
|
||||
const sideTheme = computed(() => settingsStore.sideTheme);
|
||||
</script>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
<app-main />
|
||||
<settings ref="settingRef" />
|
||||
</el-scrollbar> -->
|
||||
<div :class="{ 'fixed-header': fixedHeader }">
|
||||
<div :class="{ 'fixed-header': fixedHeader }" id="topBar">
|
||||
<navbar ref="navbarRef" @set-layout="setLayout" />
|
||||
<tags-view v-if="needTagsView" />
|
||||
</div>
|
||||
@ -27,7 +27,7 @@ import { AppMain, Navbar, Settings, TagsView } from './components';
|
||||
import useAppStore from '@/store/modules/app';
|
||||
import useSettingsStore from '@/store/modules/settings';
|
||||
import { initWebSocket } from '@/utils/websocket';
|
||||
import { initSSE } from "@/utils/sse";
|
||||
import { initSSE } from '@/utils/sse';
|
||||
|
||||
const settingsStore = useSettingsStore();
|
||||
const theme = computed(() => settingsStore.theme);
|
||||
|
||||
@ -9,7 +9,7 @@ import animate from '@/animate';
|
||||
import { download as dl } from '@/utils/request';
|
||||
import { useDict } from '@/utils/dict';
|
||||
import { getConfigKey, updateConfigByKey } from '@/api/system/config';
|
||||
import { parseTime, addDateRange, handleTree, selectDictLabel, selectDictLabels } from '@/utils/ruoyi';
|
||||
import { parseTime, addDateRange, handleTree, selectDictLabel, selectDictLabels, autoTableHeight } from '@/utils/ruoyi';
|
||||
|
||||
import { App } from 'vue';
|
||||
|
||||
@ -35,6 +35,7 @@ export default function installPlugin(app: App) {
|
||||
app.config.globalProperties.updateConfigByKey = updateConfigByKey;
|
||||
app.config.globalProperties.download = dl;
|
||||
app.config.globalProperties.parseTime = parseTime;
|
||||
app.config.globalProperties.autoTableHeight = autoTableHeight;
|
||||
app.config.globalProperties.handleTree = handleTree;
|
||||
app.config.globalProperties.addDateRange = addDateRange;
|
||||
app.config.globalProperties.selectDictLabel = selectDictLabel;
|
||||
|
||||
5
src/types/global.d.ts
vendored
5
src/types/global.d.ts
vendored
@ -27,6 +27,11 @@ declare global {
|
||||
* 是否显示
|
||||
*/
|
||||
visible: boolean;
|
||||
/**
|
||||
* 列表源数据
|
||||
*
|
||||
*/
|
||||
rowData?: any;
|
||||
}
|
||||
|
||||
declare interface UploadOption {
|
||||
|
||||
3
src/types/module.d.ts
vendored
3
src/types/module.d.ts
vendored
@ -5,7 +5,7 @@ import auth from '@/plugins/auth';
|
||||
import cache from '@/plugins/cache';
|
||||
import animate from '@/animate';
|
||||
import { useDict } from '@/utils/dict';
|
||||
import { handleTree, addDateRange, selectDictLabel, selectDictLabels, parseTime } from '@/utils/ruoyi';
|
||||
import { handleTree, addDateRange, selectDictLabel, selectDictLabels, parseTime, autoTableHeight } from '@/utils/ruoyi';
|
||||
import { getConfigKey, updateConfigByKey } from '@/api/system/config';
|
||||
import { download as rd } from '@/utils/request';
|
||||
|
||||
@ -26,6 +26,7 @@ declare module 'vue' {
|
||||
download: typeof rd;
|
||||
handleTree: typeof handleTree;
|
||||
getConfigKey: typeof getConfigKey;
|
||||
autoTableHeight: typeof autoTableHeight;
|
||||
updateConfigByKey: typeof updateConfigByKey;
|
||||
selectDictLabel: typeof selectDictLabel;
|
||||
selectDictLabels: typeof selectDictLabels;
|
||||
|
||||
@ -245,7 +245,16 @@ export const getNormalPath = (p: string): string => {
|
||||
export const blobValidate = (data: any) => {
|
||||
return data.type !== 'application/json';
|
||||
};
|
||||
|
||||
// 自动计算设置表格高度
|
||||
export const autoTableHeight = () => {
|
||||
// 视口高度 - 列表上方的元素高度
|
||||
let allHeight = window.innerHeight;
|
||||
let element = [document.getElementById('topBar'), document.getElementById('search_div'), document.getElementById('table_page')];
|
||||
let domHeight = element.map((item) => (item.offsetHeight ? item.offsetHeight : 0));
|
||||
let tableHeight = allHeight - domHeight[0] - domHeight[1] - 80 - 50;
|
||||
console.log('全局计算表格高度：', tableHeight, allHeight, domHeight[0], domHeight[1], domHeight[2]);
|
||||
return tableHeight;
|
||||
};
|
||||
export default {
|
||||
handleTree
|
||||
};
|
||||
|
||||
@ -2,9 +2,9 @@
|
||||
<div class="app-container home">
|
||||
<el-row :gutter="20">
|
||||
<el-col :sm="24" :lg="12" style="padding-left: 20px">
|
||||
<h2>RuoYi-Vue-Plus多租户管理系统</h2>
|
||||
<h2>岛游后台管理系统</h2>
|
||||
<p>
|
||||
RuoYi-Vue-Plus 是基于 RuoYi-Vue 针对 分布式集群 场景升级(不兼容原框架)
|
||||
岛游后台管理系统 是基于 RuoYi-Vue 针对 分布式集群 场景升级(不兼容原框架)
|
||||
<br />
|
||||
* 前端开发框架 Vue3、TS、Element Plus<br />
|
||||
* 后端开发框架 Spring Boot<br />
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div class="login">
|
||||
<el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form">
|
||||
<h3 class="title">岛游管理系统</h3>
|
||||
<el-form-item v-if="tenantEnabled" prop="tenantId">
|
||||
<h2 class="title">岛游后台管理系统</h2>
|
||||
<!-- <el-form-item v-if="tenantEnabled" prop="tenantId">
|
||||
<el-select v-model="loginForm.tenantId" filterable placeholder="请选择/输入公司名称" style="width: 100%">
|
||||
<el-option v-for="item in tenantList" :key="item.tenantId" :label="item.companyName" :value="item.tenantId"></el-option>
|
||||
<template #prefix><svg-icon icon-class="company" class="el-input__icon input-icon" /></template>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
<el-form-item prop="username">
|
||||
<el-input v-model="loginForm.username" type="text" size="large" auto-complete="off" placeholder="账号">
|
||||
<template #prefix><svg-icon icon-class="user" class="el-input__icon input-icon" /></template>
|
||||
@ -27,7 +27,7 @@
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-checkbox v-model="loginForm.rememberMe" style="margin: 0 0 25px 0">记住密码</el-checkbox>
|
||||
<el-form-item style="float: right">
|
||||
<!-- <el-form-item style="float: right">
|
||||
<el-button circle title="微信登录" @click="doSocialLogin('wechat')">
|
||||
<svg-icon icon-class="wechat" />
|
||||
</el-button>
|
||||
@ -43,7 +43,7 @@
|
||||
<el-button circle title="Github登录" @click="doSocialLogin('github')">
|
||||
<svg-icon icon-class="github" />
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
<el-form-item style="width: 100%">
|
||||
<el-button :loading="loading" size="large" type="primary" style="width: 100%" @click.prevent="handleLogin">
|
||||
<span v-if="!loading">登 录</span>
|
||||
@ -56,7 +56,7 @@
|
||||
</el-form>
|
||||
<!-- 底部 -->
|
||||
<div class="el-login-footer">
|
||||
<span>Copyright © 2018-2024 疯狂的狮子Li All Rights Reserved.</span>
|
||||
<span>Copyright © 2024 岛游 All Rights Reserved.</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
326
src/views/manage/articleManage/index.vue
Normal file
326
src/views/manage/articleManage/index.vue
Normal file
@ -0,0 +1,326 @@
|
||||
<!-- 文章管理列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="70px">
|
||||
<el-form-item label="文章标题" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入文章标题" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布状态" prop="">
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择发布状态" clearable>
|
||||
<el-option v-for="dict in note_publish_list" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:article:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:article:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="文章标题" align="center" prop="" />
|
||||
<el-table-column label="线路标签" align="center" prop="" />
|
||||
<el-table-column label="文章内容" align="center" prop="" />
|
||||
<el-table-column label="喜欢数" align="center" prop="" />
|
||||
<el-table-column label="线路评论数" align="center" prop="" />
|
||||
<el-table-column label="发布状态" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="发布" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
id="table_page"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改景点、租赁管理对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="articleFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="开放/营业" prop="isOpen">
|
||||
<el-input v-model="form.isOpen" placeholder="请输入开放/营业" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性/商家属性" prop="attribute">
|
||||
<el-input v-model="form.attribute" placeholder="请输入景点属性/商家属性" />
|
||||
</el-form-item>
|
||||
<el-form-item label="省code" prop="province">
|
||||
<el-input v-model="form.province" placeholder="请输入省code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="form.city" placeholder="请输入市/区" />
|
||||
</el-form-item>
|
||||
<el-form-item label="个人简介" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入个人简介" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="form.memberLevel" placeholder="请输入会员等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="form.tagId" placeholder="请输入标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="form.recommend" placeholder="请输入推荐语" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="请输入经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="请输入纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景区等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入景区等级" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const articleList = ref<ArticleVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
const note_publish_list = ref([
|
||||
{ label: '已发布', value: 1 },
|
||||
{ label: '未发布', value: 2 }
|
||||
]);
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const articleFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ArticleForm = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined
|
||||
};
|
||||
const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '景点ID/租赁ID/游艇ID不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '类别 景点-0、租赁-1 游艇-2不能为空', trigger: 'change' }],
|
||||
secondType: [{ required: true, message: '二级类别不能为空', trigger: 'change' }],
|
||||
isOpen: [{ required: true, message: '开放/营业不能为空', trigger: 'blur' }],
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-未发布 1-审核中 2-发布不能为空', trigger: 'change' }],
|
||||
province: [{ required: true, message: '省code不能为空', trigger: 'blur' }],
|
||||
city: [{ required: true, message: '市/区不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
intro: [{ required: true, message: '介绍不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '景区等级不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
articleFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
articleFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ArticleVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除景点、租赁管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delArticle(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/article/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`article_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
384
src/views/manage/bannerManage/index.vue
Normal file
384
src/views/manage/bannerManage/index.vue
Normal file
@ -0,0 +1,384 @@
|
||||
<!-- banner管理列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="70px">
|
||||
<el-form-item label="banner名称" prop="" label-width="90px">
|
||||
<el-input class="inputWidth" placeholder="请输入banner名称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布状态" prop="">
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择发布状态" clearable>
|
||||
<el-option v-for="dict in note_publish_list" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:article:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:article:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane label="发现页banner">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column label="banner名称" align="center" prop="" />
|
||||
<el-table-column label="图片" align="center" prop="" />
|
||||
<el-table-column label="跳转地址" align="center" prop="" />
|
||||
<el-table-column label="排序" align="center" prop="" />
|
||||
<el-table-column label="操作人" align="center" prop="" />
|
||||
<el-table-column label="操作时间" align="center" prop="" />
|
||||
<el-table-column label="状态" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="下架" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="上架" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="租车图片">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column label="banner名称" align="center" prop="" />
|
||||
<el-table-column label="图片" align="center" prop="" />
|
||||
<el-table-column label="跳转地址" align="center" prop="" />
|
||||
<el-table-column label="排序" align="center" prop="" />
|
||||
<el-table-column label="操作人" align="center" prop="" />
|
||||
<el-table-column label="操作时间" align="center" prop="" />
|
||||
<el-table-column label="状态" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="下架" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="上架" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="租游艇图片">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column label="banner名称" align="center" prop="" />
|
||||
<el-table-column label="图片" align="center" prop="" />
|
||||
<el-table-column label="跳转地址" align="center" prop="" />
|
||||
<el-table-column label="排序" align="center" prop="" />
|
||||
<el-table-column label="操作人" align="center" prop="" />
|
||||
<el-table-column label="操作时间" align="center" prop="" />
|
||||
<el-table-column label="状态" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="下架" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="上架" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
id="table_page"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<!-- 添加或修改景点、租赁管理对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="articleFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="开放/营业" prop="isOpen">
|
||||
<el-input v-model="form.isOpen" placeholder="请输入开放/营业" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性/商家属性" prop="attribute">
|
||||
<el-input v-model="form.attribute" placeholder="请输入景点属性/商家属性" />
|
||||
</el-form-item>
|
||||
<el-form-item label="省code" prop="province">
|
||||
<el-input v-model="form.province" placeholder="请输入省code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="form.city" placeholder="请输入市/区" />
|
||||
</el-form-item>
|
||||
<el-form-item label="个人简介" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入个人简介" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="form.memberLevel" placeholder="请输入会员等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="form.tagId" placeholder="请输入标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="form.recommend" placeholder="请输入推荐语" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="请输入经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="请输入纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景区等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入景区等级" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const articleList = ref<ArticleVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const articleFormRef = ref<ElFormInstance>();
|
||||
const note_publish_list = ref([
|
||||
{ label: '已发布', value: 1 },
|
||||
{ label: '未发布', value: 2 }
|
||||
]);
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ArticleForm = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined
|
||||
};
|
||||
const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '景点ID/租赁ID/游艇ID不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '类别 景点-0、租赁-1 游艇-2不能为空', trigger: 'change' }],
|
||||
secondType: [{ required: true, message: '二级类别不能为空', trigger: 'change' }],
|
||||
isOpen: [{ required: true, message: '开放/营业不能为空', trigger: 'blur' }],
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-未发布 1-审核中 2-发布不能为空', trigger: 'change' }],
|
||||
province: [{ required: true, message: '省code不能为空', trigger: 'blur' }],
|
||||
city: [{ required: true, message: '市/区不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
intro: [{ required: true, message: '介绍不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '景区等级不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
articleFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
articleFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ArticleVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除景点、租赁管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delArticle(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/article/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`article_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,32 +1,38 @@
|
||||
<!-- 用户列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
|
||||
:leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="80px">
|
||||
<el-form-item label="用户昵称" prop="nickName">
|
||||
<el-input v-model="queryParams.nickName" placeholder="请输入用户昵称" clearable @keyup.enter="handleQuery" />
|
||||
<el-input class="inputWidth" v-model="queryParams.nickName" placeholder="请输入用户昵称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号码" prop="phone">
|
||||
<el-input v-model="queryParams.phone" placeholder="请输入手机号码" clearable @keyup.enter="handleQuery" />
|
||||
<el-input class="inputWidth" v-model="queryParams.phone" placeholder="请输入手机号码" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户性别" prop="sex">
|
||||
<el-select v-model="queryParams.sex" placeholder="请选择用户性别" clearable>
|
||||
<el-select class="inputWidth" v-model="queryParams.sex" placeholder="请选择用户性别" clearable>
|
||||
<el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="帐号状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择帐号状态" clearable>
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择帐号状态" clearable>
|
||||
<el-option v-for="dict in dy_user_status" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="leveId">
|
||||
<el-input v-model="queryParams.leveId" placeholder="请输入会员等级" clearable @keyup.enter="handleQuery" />
|
||||
<el-input class="inputWidth" v-model="queryParams.leveId" placeholder="请输入会员等级" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<!-- <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['manage:dyUser:edit']"
|
||||
>封禁</el-button
|
||||
> -->
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['manage:dyUser:remove']"
|
||||
>注销</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
@ -34,88 +40,131 @@
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<!-- <template #header id="table_top">
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
|
||||
v-hasPermi="['manage:dyUser:edit']">封禁</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['manage:dyUser:edit']"
|
||||
>封禁</el-button
|
||||
>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"
|
||||
v-hasPermi="['manage:dyUser:remove']">注销</el-button>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['manage:dyUser:remove']"
|
||||
>注销</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
</template> -->
|
||||
|
||||
<el-table v-loading="loading" :data="dyUserList" @selection-change="handleSelectionChange" style="width: 100%">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="用户ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="帐号状态" align="center" prop="status">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="dyUserList" @selection-change="handleSelectionChange" style="width: 100%" border>
|
||||
<el-table-column fixed type="selection" width="55" align="center" />
|
||||
<el-table-column fixed label="用户ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column fixed label="帐号状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="dy_user_status" :value="scope.row.status" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="会员等级" align="center" prop="leveId" />
|
||||
<el-table-column label="昵称" align="center" prop="nickName" />
|
||||
<el-table-column fixed label="会员等级" align="center" prop="leveId" />
|
||||
<el-table-column fixed label="昵称" align="center" prop="nickName" />
|
||||
<el-table-column label="用户性别" align="center" prop="sex">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="sys_user_sex" :value="scope.row.sex" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 头像 背景图 -->
|
||||
<el-table-column width="110" label="手机号码" align="center" prop="phone"/>
|
||||
<el-table-column width="130" label="绑定微信账号" align="center" prop="openId"/>
|
||||
<el-table-column label="头像" align="center" prop="">
|
||||
<template #default="scope">
|
||||
<img src="" width="30" height="30" lt="" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="背景图" align="center" prop="">
|
||||
<template #default="scope">
|
||||
<img src="" width="30" height="30" lt="" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column width="120" label="手机号码" align="center" prop="phone" />
|
||||
<el-table-column width="130" label="绑定微信账号" align="center" prop="openId" />
|
||||
<el-table-column label="生日" align="center" prop="birthday" width="180">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.birthday, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column width="55" label="年龄" align="center" prop="age" />
|
||||
<el-table-column width="150" label="常住地" align="center" prop="address" />
|
||||
<el-table-column width="55" label="星座" align="center" prop="constellation" />
|
||||
<el-table-column width="100" label="职业" align="center" prop="occupation" />
|
||||
<el-table-column width="120" label="个人简介" align="center" prop="remark"/>
|
||||
<el-table-column width="120" label="积分" align="center" prop="score"/>
|
||||
<el-table-column width="130" label="封禁理由" align="center" prop="reason"/>
|
||||
<el-table-column width="100" label="封禁天数" align="center" prop="banDays">
|
||||
<el-table-column width="55" label="年龄" align="center" prop="age" />
|
||||
<el-table-column width="150" label="常住地" align="center" prop="address" />
|
||||
<el-table-column width="55" label="星座" align="center" prop="constellation" />
|
||||
<el-table-column width="100" label="职业" align="center" prop="occupation" />
|
||||
<el-table-column width="120" label="简介" align="center" prop="remark" />
|
||||
<el-table-column width="120" label="IP形象" align="center" prop="" />
|
||||
<el-table-column width="120" label="发布的笔记" align="center" prop="" />
|
||||
<el-table-column width="120" label="发布的活动" align="center" prop="" />
|
||||
<el-table-column width="120" label="关注的人" align="center" prop="" />
|
||||
<el-table-column width="120" label="粉丝数" align="center" prop="" />
|
||||
<el-table-column width="120" label="到过的景点" align="center" prop="" />
|
||||
<el-table-column width="120" label="点亮的城市" align="center" prop="" />
|
||||
<el-table-column width="120" label="获得的明信片" align="center" prop="" />
|
||||
<el-table-column width="120" label="我的愿望" align="center" prop="" />
|
||||
<el-table-column width="120" label="我的背包" align="center" prop="" />
|
||||
<el-table-column width="120" label="获得的物品" align="center" prop="" />
|
||||
|
||||
<el-table-column width="120" label="积分" align="center" prop="score" />
|
||||
<el-table-column width="120" label="收藏" align="center" prop="" />
|
||||
<el-table-column width="120" label="收货地址" align="center" prop="" />
|
||||
<el-table-column width="120" label="我的订单" align="center" prop="" />
|
||||
<el-table-column width="120" label="邀请人数" align="center" prop="" />
|
||||
<el-table-column width="120" label="处理方式" align="center" prop="" />
|
||||
<el-table-column width="130" label="封禁理由" align="center" prop="reason" show-overflow-tooltip />
|
||||
<el-table-column width="100" label="封禁天数" align="center" prop="banDays">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="dy_user_ban_days" :value="scope.row.banDays" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="最后登录IP" width="100" align="center" prop="loginIp"/>
|
||||
<el-table-column width="120" label="操作时间" align="center" prop="" />
|
||||
<el-table-column width="120" label="操作人" align="center" prop="" />
|
||||
|
||||
<!-- <el-table-column label="最后登录IP" width="100" align="center" prop="loginIp" />
|
||||
<el-table-column label="最后登录时间" align="center" prop="loginDate" width="180">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.loginDate, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column fixed="right" label="操作" min-width="120">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" size="small" @click="openbanned(scope.row)">封禁</el-button>
|
||||
<el-button link type="primary" size="small">权限</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
<pagination
|
||||
id="table_page"
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改C端用户信息对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body center>
|
||||
<el-form ref="dyUserFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="封禁理由" prop="reason">
|
||||
<el-input v-model="form.reason" placeholder="请输入封禁理由" />
|
||||
<el-form-item label="封禁原因" prop="reason">
|
||||
<el-select v-model="form.reason" placeholder="请选择封禁原因">
|
||||
<el-option v-for="dict in dy_user_ban_mode" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="封禁状态" prop="status">
|
||||
<el-form-item label="处理方式" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio v-for="dict in dy_user_status" :key="dict.value" :label="dict.label"
|
||||
:value="parseInt(dict.value)">{{dict.label}}</el-radio>
|
||||
<el-radio v-for="dict in dy_user_status" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)">{{ dict.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="封禁天数" prop="banDays">
|
||||
<el-form-item label="处理天数" prop="banDays">
|
||||
<el-select v-model="form.banDays" placeholder="请选择封禁天数">
|
||||
<el-option v-for="dict in dy_user_ban_days" :key="dict.value" :label="dict.label"
|
||||
:value="parseInt(dict.value)"></el-option>
|
||||
<el-option v-for="dict in dy_user_ban_days" :key="dict.value" :label="dict.label" :value="parseInt(dict.value)"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button :loading="buttonLoading" type="primary" @click="bannedUser">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
@ -128,7 +177,9 @@ import { listDyUser, getDyUser, delDyUser, addDyUser, updateDyUser } from '@/api
|
||||
import { DyUserVO, DyUserQuery, DyUserForm } from '@/api/manage/dyUser/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { dy_user_ban_days, dy_user_status, sys_user_sex } = toRefs<any>(proxy?.useDict('dy_user_ban_days', 'dy_user_status', 'sys_user_sex'));
|
||||
const { dy_user_ban_days, dy_user_status, sys_user_sex, dy_user_ban_mode } = toRefs<any>(
|
||||
proxy?.useDict('dy_user_ban_days', 'dy_user_status', 'sys_user_sex', 'dy_user_ban_mode')
|
||||
);
|
||||
|
||||
const dyUserList = ref<DyUserVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
@ -138,15 +189,16 @@ const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
const autoTableHeight = ref<number>(750);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const dyUserFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
rowData: {} as DyUserVO,
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: DyUserForm = {
|
||||
id: undefined,
|
||||
nickName: undefined,
|
||||
@ -169,7 +221,7 @@ const initFormData: DyUserForm = {
|
||||
banDays: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined
|
||||
}
|
||||
};
|
||||
const data = reactive<PageData<DyUserForm, DyUserQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
@ -194,21 +246,25 @@ const data = reactive<PageData<DyUserForm, DyUserQuery>>({
|
||||
banDays: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
params: {
|
||||
}
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [
|
||||
{ required: true, message: "用户ID不能为空", trigger: "blur" }
|
||||
],
|
||||
leveId: [
|
||||
{ required: true, message: "会员等级不能为空", trigger: "blur" }
|
||||
],
|
||||
reason: [{ required: true, message: '请选择封禁原因', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '请选择处理方式', trigger: 'blur' }],
|
||||
banDays: [{ required: true, message: '请选择处理天数', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询C端用户信息列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
@ -216,48 +272,48 @@ const getList = async () => {
|
||||
dyUserList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
}
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
dyUserFormRef.value?.resetFields();
|
||||
}
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
}
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
}
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: DyUserVO[]) => {
|
||||
ids.value = selection.map(item => item.id);
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
}
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: DyUserVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0]
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getDyUser(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = "封禁用户";
|
||||
}
|
||||
dialog.title = '封禁用户';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
@ -265,34 +321,63 @@ const submitForm = () => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateDyUser(form.value).finally(() => buttonLoading.value = false);
|
||||
await updateDyUser(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addDyUser(form.value).finally(() => buttonLoading.value = false);
|
||||
await addDyUser(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess("操作成功");
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: DyUserVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除C端用户信息编号为"' + _ids + '"的数据项？').finally(() => loading.value = false);
|
||||
await proxy?.$modal.confirm('是否确认删除C端用户信息编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delDyUser(_ids);
|
||||
proxy?.$modal.msgSuccess("删除成功");
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
};
|
||||
// 列表 操作项
|
||||
//打开封禁弹层
|
||||
const openbanned = async (row: DyUserVO) => {
|
||||
dialog.title = `封禁【${row.nickName}】`;
|
||||
dialog.visible = true;
|
||||
dialog.rowData = row;
|
||||
};
|
||||
/**
|
||||
* 封禁用户
|
||||
*/
|
||||
const bannedUser = async () => {
|
||||
dyUserFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
form.value.id = dialog.rowData.id;
|
||||
await updateDyUser(form.value).finally(() => (buttonLoading.value = false));
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-table .cell {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
<style scoped lang="scss">
|
||||
.el-table .cell {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.inputWidth {
|
||||
width: 130px;
|
||||
}
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
336
src/views/manage/noteManage/index.vue
Normal file
336
src/views/manage/noteManage/index.vue
Normal file
@ -0,0 +1,336 @@
|
||||
<!-- 笔记列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="70px">
|
||||
<el-form-item label="笔记标题" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入笔记标题" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布人" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入发布人" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标记地点" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入标记地点" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布状态" prop="">
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择发布状态" clearable>
|
||||
<el-option v-for="dict in note_publish_list" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:article:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:article:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="ID" align="center" prop="id" />
|
||||
<el-table-column label="笔记标题" align="center" prop="" />
|
||||
<el-table-column label="笔记封面" align="center" prop="" />
|
||||
<el-table-column label="笔记类别" align="center" prop="" />
|
||||
<el-table-column label="标记地点" align="center" prop="" />
|
||||
<el-table-column label="标签" align="center" prop="" />
|
||||
<el-table-column label="笔记详情" align="center" prop="" />
|
||||
<el-table-column label="笔记评论数" align="center" prop="" />
|
||||
<el-table-column label="笔记点赞数" align="center" prop="" />
|
||||
<el-table-column label="发布状态" align="center" prop="" />
|
||||
<el-table-column label="操作人" align="center" prop="" />
|
||||
<el-table-column label="操作时间" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="发布" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
id="table_page"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改景点、租赁管理对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="articleFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="开放/营业" prop="isOpen">
|
||||
<el-input v-model="form.isOpen" placeholder="请输入开放/营业" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性/商家属性" prop="attribute">
|
||||
<el-input v-model="form.attribute" placeholder="请输入景点属性/商家属性" />
|
||||
</el-form-item>
|
||||
<el-form-item label="省code" prop="province">
|
||||
<el-input v-model="form.province" placeholder="请输入省code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="form.city" placeholder="请输入市/区" />
|
||||
</el-form-item>
|
||||
<el-form-item label="个人简介" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入个人简介" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="form.memberLevel" placeholder="请输入会员等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="form.tagId" placeholder="请输入标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="form.recommend" placeholder="请输入推荐语" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="请输入经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="请输入纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景区等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入景区等级" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const articleList = ref<ArticleVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
const note_publish_list = ref([
|
||||
{ label: '已发布', value: 1 },
|
||||
{ label: '未发布', value: 2 }
|
||||
]);
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const articleFormRef = ref<ElFormInstance>();
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ArticleForm = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined
|
||||
};
|
||||
const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '景点ID/租赁ID/游艇ID不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '类别 景点-0、租赁-1 游艇-2不能为空', trigger: 'change' }],
|
||||
secondType: [{ required: true, message: '二级类别不能为空', trigger: 'change' }],
|
||||
isOpen: [{ required: true, message: '开放/营业不能为空', trigger: 'blur' }],
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-未发布 1-审核中 2-发布不能为空', trigger: 'change' }],
|
||||
province: [{ required: true, message: '省code不能为空', trigger: 'blur' }],
|
||||
city: [{ required: true, message: '市/区不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
intro: [{ required: true, message: '介绍不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '景区等级不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
articleFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
articleFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ArticleVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除景点、租赁管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delArticle(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/article/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`article_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
345
src/views/manage/partyManage/index.vue
Normal file
345
src/views/manage/partyManage/index.vue
Normal file
@ -0,0 +1,345 @@
|
||||
<!-- 活动列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="70px">
|
||||
<el-form-item label="行程路线" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入行程路线" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="线路地点" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入线路地点" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="线路类型" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入线路类型" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布状态" prop="">
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择发布状态" clearable>
|
||||
<el-option v-for="dict in note_publish_list" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:article:edit']"
|
||||
>编辑</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:article:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="ID" align="center" prop="id" fixed v-if="true" />
|
||||
<el-table-column label="活动名称" align="center" fixed prop="" />
|
||||
<el-table-column label="活动描述" align="center" fixed prop="" />
|
||||
<el-table-column label="活动图片" align="center" prop="" />
|
||||
<el-table-column label="排序" align="center" prop="" />
|
||||
<el-table-column label="活动人数" align="center" prop="" />
|
||||
<el-table-column label="报名人数" align="center" prop="" />
|
||||
<el-table-column label="挑选玩友" align="center" prop="" />
|
||||
<el-table-column label="活动时间" align="center" prop="" />
|
||||
<el-table-column label="报名截止时间" align="center" prop="" width="120px" />
|
||||
<el-table-column label="发布者地址" align="center" prop="" width="120px" />
|
||||
<el-table-column label="活动地点" align="center" prop="" />
|
||||
<el-table-column label="收费方式" align="center" prop="" />
|
||||
<el-table-column label="活动流程" align="center" prop="" />
|
||||
<el-table-column label="问答" align="center" prop="" />
|
||||
<el-table-column label="发布状态" align="center" prop="" />
|
||||
<el-table-column label="发布时间" align="center" prop="" />
|
||||
<el-table-column label="发布人员" align="center" prop="" />
|
||||
<el-table-column label="操作人员" align="center" prop="" />
|
||||
<el-table-column label="操作时间" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" width="150px" fixed="right" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="发布" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
id="table_page"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改景点、租赁管理对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="articleFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="开放/营业" prop="isOpen">
|
||||
<el-input v-model="form.isOpen" placeholder="请输入开放/营业" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性/商家属性" prop="attribute">
|
||||
<el-input v-model="form.attribute" placeholder="请输入景点属性/商家属性" />
|
||||
</el-form-item>
|
||||
<el-form-item label="省code" prop="province">
|
||||
<el-input v-model="form.province" placeholder="请输入省code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="form.city" placeholder="请输入市/区" />
|
||||
</el-form-item>
|
||||
<el-form-item label="个人简介" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入个人简介" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="form.memberLevel" placeholder="请输入会员等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="form.tagId" placeholder="请输入标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="form.recommend" placeholder="请输入推荐语" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="请输入经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="请输入纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景区等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入景区等级" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const articleList = ref<ArticleVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
const note_publish_list = ref([
|
||||
{ label: '已发布', value: 1 },
|
||||
{ label: '未发布', value: 2 }
|
||||
]);
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const articleFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ArticleForm = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined
|
||||
};
|
||||
const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '景点ID/租赁ID/游艇ID不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '类别 景点-0、租赁-1 游艇-2不能为空', trigger: 'change' }],
|
||||
secondType: [{ required: true, message: '二级类别不能为空', trigger: 'change' }],
|
||||
isOpen: [{ required: true, message: '开放/营业不能为空', trigger: 'blur' }],
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-未发布 1-审核中 2-发布不能为空', trigger: 'change' }],
|
||||
province: [{ required: true, message: '省code不能为空', trigger: 'blur' }],
|
||||
city: [{ required: true, message: '市/区不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
intro: [{ required: true, message: '介绍不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '景区等级不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
articleFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
articleFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ArticleVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除景点、租赁管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delArticle(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/article/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`article_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
328
src/views/manage/routeManage/index.vue
Normal file
328
src/views/manage/routeManage/index.vue
Normal file
@ -0,0 +1,328 @@
|
||||
<!-- 路线导航管理列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="70px">
|
||||
<el-form-item label="行程路线" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入行程路线" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布状态" prop="">
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择发布状态" clearable>
|
||||
<el-option v-for="dict in note_publish_list" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:article:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:article:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column label="ID" align="center" prop="id" />
|
||||
<el-table-column label="线路标题" align="center" prop="" />
|
||||
<el-table-column label="线路封面" align="center" prop="" />
|
||||
<el-table-column label="线路标签" align="center" prop="" />
|
||||
<el-table-column label="行程天数" align="center" prop="" />
|
||||
<el-table-column label="行程里数" align="center" prop="" />
|
||||
<el-table-column label="行驶时长" align="center" prop="" />
|
||||
<el-table-column label="最佳时间" align="center" prop="" />
|
||||
<el-table-column label="行程" align="center" prop="" />
|
||||
<el-table-column label="加入行程数" align="center" prop="" />
|
||||
<el-table-column label="喜欢数" align="center" prop="" />
|
||||
<el-table-column label="线路评论数" align="center" prop="" />
|
||||
<el-table-column label="发布状态" align="center" prop="" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="编辑" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
id="table_page"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改景点、租赁管理对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="articleFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="开放/营业" prop="isOpen">
|
||||
<el-input v-model="form.isOpen" placeholder="请输入开放/营业" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性/商家属性" prop="attribute">
|
||||
<el-input v-model="form.attribute" placeholder="请输入景点属性/商家属性" />
|
||||
</el-form-item>
|
||||
<el-form-item label="省code" prop="province">
|
||||
<el-input v-model="form.province" placeholder="请输入省code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="form.city" placeholder="请输入市/区" />
|
||||
</el-form-item>
|
||||
<el-form-item label="个人简介" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入个人简介" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="form.memberLevel" placeholder="请输入会员等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="form.tagId" placeholder="请输入标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="form.recommend" placeholder="请输入推荐语" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="请输入经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="请输入纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景区等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入景区等级" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const articleList = ref<ArticleVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
const note_publish_list = ref([
|
||||
{ label: '已发布', value: 1 },
|
||||
{ label: '未发布', value: 2 }
|
||||
]);
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const articleFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ArticleForm = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined
|
||||
};
|
||||
const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '景点ID/租赁ID/游艇ID不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '类别 景点-0、租赁-1 游艇-2不能为空', trigger: 'change' }],
|
||||
secondType: [{ required: true, message: '二级类别不能为空', trigger: 'change' }],
|
||||
isOpen: [{ required: true, message: '开放/营业不能为空', trigger: 'blur' }],
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-未发布 1-审核中 2-发布不能为空', trigger: 'change' }],
|
||||
province: [{ required: true, message: '省code不能为空', trigger: 'blur' }],
|
||||
city: [{ required: true, message: '市/区不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
intro: [{ required: true, message: '介绍不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '景区等级不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
articleFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
articleFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ArticleVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除景点、租赁管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delArticle(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/article/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`article_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
380
src/views/manage/scenic/index.vue
Normal file
380
src/views/manage/scenic/index.vue
Normal file
@ -0,0 +1,380 @@
|
||||
<!-- 景点列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="70px">
|
||||
<el-form-item label="景点名称" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入景点名称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="提示语" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入提示语" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="发布状态" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入提示语" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点等级" prop="">
|
||||
<el-input class="inputWidth" placeholder="请输入提示语" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否开放" prop="isOpen">
|
||||
<el-input class="inputWidth" v-model="queryParams.isOpen" placeholder="请输入开放/营业" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性" prop="attribute">
|
||||
<el-input class="inputWidth" v-model="queryParams.attribute" placeholder="请输入景点属性" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="一级标签" prop="attribute">
|
||||
<el-input class="inputWidth" v-model="queryParams.attribute" placeholder="请输入景点属性" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="二级标签" prop="attribute">
|
||||
<el-input class="inputWidth" v-model="queryParams.attribute" placeholder="请输入景点属性" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="省code" prop="province">
|
||||
<el-input v-model="queryParams.province" placeholder="请输入省code" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="queryParams.city" placeholder="请输入市/区" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="queryParams.memberLevel" placeholder="请输入会员等级" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="queryParams.tagId" placeholder="请输入标签" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="queryParams.recommend" placeholder="请输入推荐语" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="queryParams.intro" placeholder="请输入介绍" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="queryParams.address" placeholder="请输入详细地址" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="queryParams.longitude" placeholder="请输入经度" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="queryParams.latitude" placeholder="请输入纬度" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="queryParams.orderNum" placeholder="请输入排序" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item label="景区等级" prop="level">
|
||||
<el-input class="inputWidth" v-model="queryParams.level" placeholder="请输入景区等级" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:article:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:article:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="articleList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="景点ID/租赁ID/游艇ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="类别 景点-0、租赁-1 游艇-2" align="center" prop="type" />
|
||||
<el-table-column label="二级类别" align="center" prop="secondType" />
|
||||
<el-table-column label="开放/营业" align="center" prop="isOpen" />
|
||||
<el-table-column label="景点属性/商家属性" align="center" prop="attribute" />
|
||||
<el-table-column label="状态 0-未发布 1-审核中 2-发布" align="center" prop="status" />
|
||||
<el-table-column label="省code" align="center" prop="province" />
|
||||
<el-table-column label="市/区" align="center" prop="city" />
|
||||
<el-table-column label="个人简介" align="center" prop="remark" />
|
||||
<el-table-column label="会员等级" align="center" prop="memberLevel" />
|
||||
<el-table-column label="标签" align="center" prop="tagId" />
|
||||
<el-table-column label="推荐语" align="center" prop="recommend" />
|
||||
<el-table-column label="介绍" align="center" prop="intro" />
|
||||
<el-table-column label="详细地址" align="center" prop="address" />
|
||||
<el-table-column label="经度" align="center" prop="longitude" />
|
||||
<el-table-column label="纬度" align="center" prop="latitude" />
|
||||
<el-table-column label="排序" align="center" prop="orderNum" />
|
||||
<el-table-column label="景区等级" align="center" prop="level" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:article:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
id="table_page"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改景点、租赁管理对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="articleFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="开放/营业" prop="isOpen">
|
||||
<el-input v-model="form.isOpen" placeholder="请输入开放/营业" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景点属性/商家属性" prop="attribute">
|
||||
<el-input v-model="form.attribute" placeholder="请输入景点属性/商家属性" />
|
||||
</el-form-item>
|
||||
<el-form-item label="省code" prop="province">
|
||||
<el-input v-model="form.province" placeholder="请输入省code" />
|
||||
</el-form-item>
|
||||
<el-form-item label="市/区" prop="city">
|
||||
<el-input v-model="form.city" placeholder="请输入市/区" />
|
||||
</el-form-item>
|
||||
<el-form-item label="个人简介" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入个人简介" />
|
||||
</el-form-item>
|
||||
<el-form-item label="会员等级" prop="memberLevel">
|
||||
<el-input v-model="form.memberLevel" placeholder="请输入会员等级" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标签" prop="tagId">
|
||||
<el-input v-model="form.tagId" placeholder="请输入标签" />
|
||||
</el-form-item>
|
||||
<el-form-item label="推荐语" prop="recommend">
|
||||
<el-input v-model="form.recommend" placeholder="请输入推荐语" />
|
||||
</el-form-item>
|
||||
<el-form-item label="介绍" prop="intro">
|
||||
<el-input v-model="form.intro" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="address">
|
||||
<el-input v-model="form.address" placeholder="请输入详细地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="longitude">
|
||||
<el-input v-model="form.longitude" placeholder="请输入经度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="latitude">
|
||||
<el-input v-model="form.latitude" placeholder="请输入纬度" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="orderNum">
|
||||
<el-input v-model="form.orderNum" placeholder="请输入排序" />
|
||||
</el-form-item>
|
||||
<el-form-item label="景区等级" prop="level">
|
||||
<el-input v-model="form.level" placeholder="请输入景区等级" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="Article" lang="ts">
|
||||
import { listArticle, getArticle, delArticle, addArticle, updateArticle } from '@/api/manage/article';
|
||||
import { ArticleVO, ArticleQuery, ArticleForm } from '@/api/manage/article/types';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const articleList = ref<ArticleVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
const showSearch = ref(true);
|
||||
const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const articleFormRef = ref<ElFormInstance>();
|
||||
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const initFormData: ArticleForm = {
|
||||
id: undefined,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
remark: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined
|
||||
};
|
||||
const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
type: undefined,
|
||||
secondType: undefined,
|
||||
isOpen: undefined,
|
||||
attribute: undefined,
|
||||
status: undefined,
|
||||
province: undefined,
|
||||
city: undefined,
|
||||
memberLevel: undefined,
|
||||
tagId: undefined,
|
||||
recommend: undefined,
|
||||
intro: undefined,
|
||||
address: undefined,
|
||||
longitude: undefined,
|
||||
latitude: undefined,
|
||||
orderNum: undefined,
|
||||
level: undefined,
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [{ required: true, message: '景点ID/租赁ID/游艇ID不能为空', trigger: 'blur' }],
|
||||
type: [{ required: true, message: '类别 景点-0、租赁-1 游艇-2不能为空', trigger: 'change' }],
|
||||
secondType: [{ required: true, message: '二级类别不能为空', trigger: 'change' }],
|
||||
isOpen: [{ required: true, message: '开放/营业不能为空', trigger: 'blur' }],
|
||||
attribute: [{ required: true, message: '景点属性/商家属性不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态 0-未发布 1-审核中 2-发布不能为空', trigger: 'change' }],
|
||||
province: [{ required: true, message: '省code不能为空', trigger: 'blur' }],
|
||||
city: [{ required: true, message: '市/区不能为空', trigger: 'blur' }],
|
||||
remark: [{ required: true, message: '个人简介不能为空', trigger: 'blur' }],
|
||||
memberLevel: [{ required: true, message: '会员等级不能为空', trigger: 'blur' }],
|
||||
tagId: [{ required: true, message: '标签不能为空', trigger: 'blur' }],
|
||||
recommend: [{ required: true, message: '推荐语不能为空', trigger: 'blur' }],
|
||||
intro: [{ required: true, message: '介绍不能为空', trigger: 'blur' }],
|
||||
address: [{ required: true, message: '详细地址不能为空', trigger: 'blur' }],
|
||||
longitude: [{ required: true, message: '经度不能为空', trigger: 'blur' }],
|
||||
latitude: [{ required: true, message: '纬度不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
level: [{ required: true, message: '景区等级不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询景点、租赁管理列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listArticle(queryParams.value).finally(() => (loading.value = false));
|
||||
articleList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = { ...initFormData };
|
||||
articleFormRef.value?.resetFields();
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = '添加景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: ArticleVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = '修改景点、租赁管理';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
articleFormRef.value?.validate(async (valid: boolean) => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addArticle(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: ArticleVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除景点、租赁管理编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delArticle(_ids);
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
};
|
||||
|
||||
/** 导出按钮操作 */
|
||||
const handleExport = () => {
|
||||
proxy?.download(
|
||||
'system/article/export',
|
||||
{
|
||||
...queryParams.value
|
||||
},
|
||||
`article_${new Date().getTime()}.xlsx`
|
||||
);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,23 +1,32 @@
|
||||
<!-- 用户等级列表 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="等级名称" prop="levelName">
|
||||
<el-input v-model="queryParams.levelName" placeholder="请输入等级名称" clearable @keyup.enter="handleQuery" />
|
||||
<el-input class="inputWidth" v-model="queryParams.levelName" placeholder="请输入等级名称" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="积分上限" prop="score">
|
||||
<el-input v-model="queryParams.score" placeholder="请输入积分上限" clearable @keyup.enter="handleQuery" />
|
||||
<el-input class="inputWidth" v-model="queryParams.score" placeholder="请输入积分上限" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable >
|
||||
<el-option v-for="dict in dy_user_level_status" :key="dict.value" :label="dict.label" :value="dict.value"/>
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择状态" clearable>
|
||||
<el-option v-for="dict in dy_user_level_status" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['manage:userLevel:add']">新增</el-button>
|
||||
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['manage:userLevel:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['manage:userLevel:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
@ -25,31 +34,29 @@
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<!-- <template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['manage:userLevel:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['manage:userLevel:edit']">修改</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['manage:userLevel:edit']"
|
||||
>修改</el-button
|
||||
>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['manage:userLevel:remove']">删除</el-button>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['manage:userLevel:remove']"
|
||||
>删除</el-button
|
||||
>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
</template> -->
|
||||
|
||||
<el-table v-loading="loading" :data="userLevelList" @selection-change="handleSelectionChange">
|
||||
<el-table :height="autoTableHeight" v-loading="loading" :data="userLevelList" @selection-change="handleSelectionChange" border>
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="等级ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="等级名称" align="center" prop="levelName" />
|
||||
<el-table-column label="积分上限" align="center" prop="score" />
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="dy_user_level_status" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="用户等级" align="center" prop="levelName" />
|
||||
<el-table-column label="等级所达积分" align="center" prop="score" />
|
||||
<el-table-column label="排序" align="center" prop="orderNum" />
|
||||
<el-table-column label="创建者" align="center" prop="createBy" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
||||
@ -57,6 +64,13 @@
|
||||
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="dy_user_level_status" :value="scope.row.status" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="等级名称" align="center" prop="levelName" />
|
||||
<el-table-column label="积分上限" align="center" prop="score" /> -->
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
@ -69,7 +83,14 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
<pagination
|
||||
id="table_page"
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<!-- 添加或修改用户等级对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
@ -85,11 +106,7 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio
|
||||
v-for="dict in dy_user_level_status"
|
||||
:key="dict.value"
|
||||
:value="parseInt(dict.value)"
|
||||
>{{dict.label}}</el-radio>
|
||||
<el-radio v-for="dict in dy_user_level_status" :key="dict.value" :value="parseInt(dict.value)">{{ dict.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -109,7 +126,7 @@ import { UserLevelVO, UserLevelQuery, UserLevelForm } from '@/api/manage/userLev
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const { dy_user_level_status } = toRefs<any>(proxy?.useDict('dy_user_level_status'));
|
||||
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const userLevelList = ref<UserLevelVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
@ -133,9 +150,9 @@ const initFormData: UserLevelForm = {
|
||||
status: undefined,
|
||||
score: undefined,
|
||||
orderNum: undefined
|
||||
}
|
||||
};
|
||||
const data = reactive<PageData<UserLevelForm, UserLevelQuery>>({
|
||||
form: {...initFormData},
|
||||
form: { ...initFormData },
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
@ -143,30 +160,27 @@ const data = reactive<PageData<UserLevelForm, UserLevelQuery>>({
|
||||
status: undefined,
|
||||
score: undefined,
|
||||
orderNum: undefined,
|
||||
params: {
|
||||
}
|
||||
params: {}
|
||||
},
|
||||
rules: {
|
||||
id: [
|
||||
{ required: true, message: "等级ID不能为空", trigger: "blur" }
|
||||
],
|
||||
levelName: [
|
||||
{ required: true, message: "等级名称不能为空", trigger: "blur" }
|
||||
],
|
||||
status: [
|
||||
{ required: true, message: "状态不能为空", trigger: "change" }
|
||||
],
|
||||
score: [
|
||||
{ required: true, message: "积分上限不能为空", trigger: "blur" }
|
||||
],
|
||||
orderNum: [
|
||||
{ required: true, message: "排序不能为空", trigger: "blur" }
|
||||
]
|
||||
id: [{ required: true, message: '等级ID不能为空', trigger: 'blur' }],
|
||||
levelName: [{ required: true, message: '等级名称不能为空', trigger: 'blur' }],
|
||||
status: [{ required: true, message: '状态不能为空', trigger: 'change' }],
|
||||
score: [{ required: true, message: '积分上限不能为空', trigger: 'blur' }],
|
||||
orderNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }]
|
||||
}
|
||||
});
|
||||
|
||||
const { queryParams, form, rules } = toRefs(data);
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
/** 查询用户等级列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
@ -174,55 +188,55 @@ const getList = async () => {
|
||||
userLevelList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
/** 取消按钮 */
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
}
|
||||
};
|
||||
|
||||
/** 表单重置 */
|
||||
const reset = () => {
|
||||
form.value = {...initFormData};
|
||||
form.value = { ...initFormData };
|
||||
userLevelFormRef.value?.resetFields();
|
||||
}
|
||||
};
|
||||
|
||||
/** 搜索按钮操作 */
|
||||
const handleQuery = () => {
|
||||
queryParams.value.pageNum = 1;
|
||||
getList();
|
||||
}
|
||||
};
|
||||
|
||||
/** 重置按钮操作 */
|
||||
const resetQuery = () => {
|
||||
queryFormRef.value?.resetFields();
|
||||
handleQuery();
|
||||
}
|
||||
};
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: UserLevelVO[]) => {
|
||||
ids.value = selection.map(item => item.id);
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
}
|
||||
};
|
||||
|
||||
/** 新增按钮操作 */
|
||||
const handleAdd = () => {
|
||||
reset();
|
||||
dialog.visible = true;
|
||||
dialog.title = "添加用户等级";
|
||||
}
|
||||
dialog.title = '添加用户等级';
|
||||
};
|
||||
|
||||
/** 修改按钮操作 */
|
||||
const handleUpdate = async (row?: UserLevelVO) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0]
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getUserLevel(_id);
|
||||
Object.assign(form.value, res.data);
|
||||
dialog.visible = true;
|
||||
dialog.title = "修改用户等级";
|
||||
}
|
||||
dialog.title = '修改用户等级';
|
||||
};
|
||||
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
@ -230,27 +244,33 @@ const submitForm = () => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
if (form.value.id) {
|
||||
await updateUserLevel(form.value).finally(() => buttonLoading.value = false);
|
||||
await updateUserLevel(form.value).finally(() => (buttonLoading.value = false));
|
||||
} else {
|
||||
await addUserLevel(form.value).finally(() => buttonLoading.value = false);
|
||||
await addUserLevel(form.value).finally(() => (buttonLoading.value = false));
|
||||
}
|
||||
proxy?.$modal.msgSuccess("操作成功");
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
dialog.visible = false;
|
||||
await getList();
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (row?: UserLevelVO) => {
|
||||
const _ids = row?.id || ids.value;
|
||||
await proxy?.$modal.confirm('是否确认删除用户等级编号为"' + _ids + '"的数据项？').finally(() => loading.value = false);
|
||||
await proxy?.$modal.confirm('是否确认删除用户等级编号为"' + _ids + '"的数据项？').finally(() => (loading.value = false));
|
||||
await delUserLevel(_ids);
|
||||
proxy?.$modal.msgSuccess("删除成功");
|
||||
proxy?.$modal.msgSuccess('删除成功');
|
||||
await getList();
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -25,7 +25,7 @@ export default defineConfig(({ mode, command }: ConfigEnv): UserConfig => {
|
||||
open: true,
|
||||
proxy: {
|
||||
[env.VITE_APP_BASE_API]: {
|
||||
target: 'http://localhost:8080',
|
||||
target: 'http://192.168.18.23:8080',
|
||||
changeOrigin: true,
|
||||
ws: true,
|
||||
rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')
|
||||
|
||||
4
vite/plugins/devTools.ts
Normal file
4
vite/plugins/devTools.ts
Normal file
@ -0,0 +1,4 @@
|
||||
import VueDevTools from 'vite-plugin-vue-devtools'
|
||||
export default () => {
|
||||
return VueDevTools();
|
||||
};
|
||||
@ -8,11 +8,13 @@ import createCompression from './compression';
|
||||
import createSetupExtend from './setup-extend';
|
||||
import createI18n from './i18n';
|
||||
import path from 'path';
|
||||
import VueDevTools from './devTools';
|
||||
|
||||
export default (viteEnv: any, isBuild = false): [] => {
|
||||
const vitePlugins: any = [];
|
||||
vitePlugins.push(vue());
|
||||
vitePlugins.push(createUnoCss());
|
||||
vitePlugins.push(VueDevTools());
|
||||
vitePlugins.push(createAutoImport(path));
|
||||
vitePlugins.push(createComponents(path));
|
||||
vitePlugins.push(createCompression(viteEnv));
|
||||
|
||||
Loading…
Reference in New Issue
Block a user