CC/ruoyi-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

11

Browse Source
This commit is contained in:
Leo
2026-01-06 01:38:33 +08:00
parent 70ce063aba
commit 7871acf214
5 changed files with 667 additions and 244 deletions
Download Patch File Download Diff File Expand all files Collapse all files

130
src/views/system/comment/index.vue
View File

@@ -5,7 +5,19 @@
<el-tab-pane label="京东评论" name="jd"> <el-tab-pane label="京东评论" name="jd">
<div class="comment-container"> <div class="comment-container">
<!-- 搜索区域 --> <!-- 搜索区域 -->
<el-form :inline="true" :model="jdQueryParams" class="demo-form-inline" size="small"> <mobile-search-form
:model="jdQueryParams"
@search="handleJdQuery"
@reset="resetJdQuery"
>
<template #form="{ expanded }">
<el-form
:inline="true"
:model="jdQueryParams"
class="demo-form-inline"
size="small"
label-width="68px"
>
<el-form-item label="商品ID"> <el-form-item label="商品ID">
<el-input v-model="jdQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleJdQuery" /> <el-input v-model="jdQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleJdQuery" />
</el-form-item> </el-form-item>
@@ -39,12 +51,28 @@
@change="handleJdDateRangeChange" @change="handleJdDateRangeChange"
/> />
</el-form-item> </el-form-item>
<el-form-item> <!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<el-button type="primary" icon="el-icon-search" size="small" @click="handleJdQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="small" @click="handleJdQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="small" @click="resetJdQuery">重置</el-button> <el-button icon="el-icon-refresh" size="small" @click="resetJdQuery">重置</el-button>
<el-button type="success" icon="el-icon-download" size="small" @click="handleJdExport">导出</el-button> <el-button type="success" icon="el-icon-download" size="small" @click="handleJdExport">导出</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template>
</mobile-search-form>
<!-- 操作按钮区域（移动端单独显示） -->
<div class="action-buttons-section mobile-only">
<mobile-button-group
:buttons="jdActionButtons"
:primary-count="2"
/>
</div>
<!-- 桌面端按钮组 -->
<div class="desktop-action-buttons desktop-only">
<el-button type="success" icon="el-icon-download" size="small" @click="handleJdExport">导出</el-button>
</div>
<!-- 表格区域 --> <!-- 表格区域 -->
<el-table v-loading="jdLoading" :data="jdList" border> <el-table v-loading="jdLoading" :data="jdList" border>
@@ -106,7 +134,19 @@
<el-tab-pane label="淘宝评论" name="tb"> <el-tab-pane label="淘宝评论" name="tb">
<div class="comment-container"> <div class="comment-container">
<!-- 搜索区域 --> <!-- 搜索区域 -->
<el-form :inline="true" :model="tbQueryParams" class="demo-form-inline" size="small"> <mobile-search-form
:model="tbQueryParams"
@search="handleTbQuery"
@reset="resetTbQuery"
>
<template #form="{ expanded }">
<el-form
:inline="true"
:model="tbQueryParams"
class="demo-form-inline"
size="small"
label-width="68px"
>
<el-form-item label="商品ID"> <el-form-item label="商品ID">
<el-input v-model="tbQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleTbQuery" /> <el-input v-model="tbQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleTbQuery" />
</el-form-item> </el-form-item>
@@ -140,12 +180,28 @@
@change="handleTbDateRangeChange" @change="handleTbDateRangeChange"
/> />
</el-form-item> </el-form-item>
<el-form-item> <!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<el-button type="primary" icon="el-icon-search" size="small" @click="handleTbQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="small" @click="handleTbQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="small" @click="resetTbQuery">重置</el-button> <el-button icon="el-icon-refresh" size="small" @click="resetTbQuery">重置</el-button>
<el-button type="success" icon="el-icon-download" size="small" @click="handleTbExport">导出</el-button> <el-button type="success" icon="el-icon-download" size="small" @click="handleTbExport">导出</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template>
</mobile-search-form>
<!-- 操作按钮区域（移动端单独显示） -->
<div class="action-buttons-section mobile-only">
<mobile-button-group
:buttons="tbActionButtons"
:primary-count="2"
/>
</div>
<!-- 桌面端按钮组 -->
<div class="desktop-action-buttons desktop-only">
<el-button type="success" icon="el-icon-download" size="small" @click="handleTbExport">导出</el-button>
</div>
<!-- 表格区域 --> <!-- 表格区域 -->
<el-table v-loading="tbLoading" :data="tbList" border> <el-table v-loading="tbLoading" :data="tbList" border>
@@ -281,9 +337,16 @@ import {
listTbComment, getTbComment, updateTbComment, delTbComment, resetTbCommentByProductId, listTbComment, getTbComment, updateTbComment, delTbComment, resetTbCommentByProductId,
getCommentStatistics, getJdProductTypeMap, getTbProductTypeMap getCommentStatistics, getJdProductTypeMap, getTbProductTypeMap
} from '@/api/jarvis/comment' } from '@/api/jarvis/comment'
import { mapGetters } from 'vuex'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
export default { export default {
name: 'CommentManagement', name: 'CommentManagement',
components: {
MobileSearchForm,
MobileButtonGroup
},
data() { data() {
return { return {
activeTab: 'jd', activeTab: 'jd',
@@ -326,6 +389,28 @@ export default {
imageList: [] imageList: []
} }
}, },
computed: {
...mapGetters(['device']),
isMobile() {
if (this.device === 'mobile') {
return true
}
if (typeof window !== 'undefined' && window.innerWidth < 768) {
return true
}
return false
},
jdActionButtons() {
return [
{ key: 'export', label: '导出', type: 'success', icon: 'el-icon-download', handler: () => this.handleJdExport(), disabled: false }
]
},
tbActionButtons() {
return [
{ key: 'export', label: '导出', type: 'success', icon: 'el-icon-download', handler: () => this.handleTbExport(), disabled: false }
]
}
},
created() { created() {
this.getJdList() this.getJdList()
this.getJdProductTypeMap() this.getJdProductTypeMap()
@@ -488,5 +573,42 @@ export default {
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
} }
/* 操作按钮区域 */
.action-buttons-section {
margin-top: 12px;
margin-bottom: 12px;
}
/* 移动端和桌面端按钮组显示控制 */
@media (max-width: 768px) {
.desktop-only {
display: none !important;
}
.action-buttons-section.mobile-only {
display: block;
}
}
@media (min-width: 769px) {
.mobile-only {
display: none !important;
}
.desktop-action-buttons.desktop-only {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 12px;
}
}
.desktop-action-buttons {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 12px;
}
</style> </style>

86
src/views/system/favoriteProduct/index.vue
View File

@@ -1,6 +1,19 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <mobile-search-form
:model="queryParams"
@search="handleQuery"
@reset="resetQuery"
>
<template #form="{ expanded }">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="商品名称" prop="productName"> <el-form-item label="商品名称" prop="productName">
<el-input <el-input
v-model="queryParams.productName" v-model="queryParams.productName"
@@ -31,13 +44,25 @@
<el-option label="否" :value="0" /> <el-option label="否" :value="0" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template>
</mobile-search-form>
<el-row :gutter="10" class="mb8"> <!-- 操作按钮区域（移动端单独显示） -->
<div class="action-buttons-section mobile-only">
<mobile-button-group
:buttons="actionButtons"
:primary-count="2"
/>
</div>
<!-- 桌面端按钮组 -->
<el-row :gutter="10" class="mb8 desktop-only">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
@@ -347,14 +372,38 @@
import { listFavoriteProduct, getFavoriteProduct, delFavoriteProduct, addFavoriteProduct, updateFavoriteProduct, updateTopStatus } from "@/api/system/favoriteProduct"; import { listFavoriteProduct, getFavoriteProduct, delFavoriteProduct, addFavoriteProduct, updateFavoriteProduct, updateTopStatus } from "@/api/system/favoriteProduct";
import { generatePromotionContent } from "@/api/system/jdorder"; import { generatePromotionContent } from "@/api/system/jdorder";
import { mapGetters, mapActions } from 'vuex' import { mapGetters, mapActions } from 'vuex'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
import PublishDialog from '@/components/PublishDialog.vue' import PublishDialog from '@/components/PublishDialog.vue'
// 自动加入常用逻辑由 PublishDialog 内部触发（线报、转链页面），本页主要用于打开发品弹窗 // 自动加入常用逻辑由 PublishDialog 内部触发（线报、转链页面），本页主要用于打开发品弹窗
export default { export default {
name: "FavoriteProduct", name: "FavoriteProduct",
components: { PublishDialog }, components: {
PublishDialog,
MobileSearchForm,
MobileButtonGroup
},
computed: { computed: {
...mapGetters(['favoriteProductRefreshKey']) ...mapGetters(['favoriteProductRefreshKey', 'device']),
isMobile() {
if (this.device === 'mobile') {
return true
}
if (typeof window !== 'undefined' && window.innerWidth < 768) {
return true
}
return false
},
actionButtons() {
return [
{ key: 'add', label: '新增', type: 'primary', icon: 'el-icon-plus', handler: () => this.handleAdd(), disabled: false },
{ key: 'update', label: '修改', type: 'success', icon: 'el-icon-edit', handler: () => this.handleUpdate(), disabled: this.single },
{ key: 'delete', label: '删除', type: 'danger', icon: 'el-icon-delete', handler: () => this.handleDelete(), disabled: this.multiple },
{ key: 'top', label: '批量置顶', type: 'warning', icon: 'el-icon-top', handler: () => this.handleBatchTop(), disabled: this.multiple },
{ key: 'export', label: '导出', type: 'info', icon: 'el-icon-download', handler: () => this.handleExport(), disabled: false }
]
}
}, },
data() { data() {
return { return {
@@ -628,4 +677,31 @@ export default {
.el-tag { .el-tag {
margin-right: 5px; margin-right: 5px;
} }
/* 操作按钮区域 */
.action-buttons-section {
margin-top: 12px;
margin-bottom: 12px;
}
/* 移动端和桌面端按钮组显示控制 */
@media (max-width: 768px) {
.desktop-only {
display: none !important;
}
.action-buttons-section.mobile-only {
display: block;
}
}
@media (min-width: 769px) {
.mobile-only {
display: none !important;
}
.desktop-only {
display: block;
}
}
</style> </style>

74
src/views/system/giftcoupon/index.vue
View File

@@ -3,7 +3,17 @@
<list-layout> <list-layout>
<!-- 搜索区域 --> <!-- 搜索区域 -->
<template #search> <template #search>
<el-form :inline="true" :model="queryParams" label-width="100px"> <mobile-search-form
:model="queryParams"
@search="handleQuery"
@reset="resetQuery"
>
<template #form="{ expanded }">
<el-form
:model="queryParams"
:inline="true"
label-width="100px"
>
<el-form-item label="礼金Key"> <el-form-item label="礼金Key">
<el-input v-model="queryParams.giftCouponKey" placeholder="礼金批次ID" clearable size="small" @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.giftCouponKey" placeholder="礼金批次ID" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
@@ -37,7 +47,8 @@
@change="handleDateRangeChange" @change="handleDateRangeChange"
/> />
</el-form-item> </el-form-item>
<el-form-item> <!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">搜索</el-button> <el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button size="small" icon="el-icon-refresh" @click="resetQuery">重置</el-button> <el-button size="small" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
<el-button type="success" size="small" icon="el-icon-plus" @click="handleCreate">创建礼金</el-button> <el-button type="success" size="small" icon="el-icon-plus" @click="handleCreate">创建礼金</el-button>
@@ -45,6 +56,22 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
</mobile-search-form>
<!-- 操作按钮区域（移动端单独显示） -->
<div class="action-buttons-section mobile-only">
<mobile-button-group
:buttons="actionButtons"
:primary-count="2"
/>
</div>
<!-- 桌面端按钮组 -->
<div class="desktop-action-buttons desktop-only">
<el-button type="success" size="small" icon="el-icon-plus" @click="handleCreate">创建礼金</el-button>
<el-button type="warning" size="small" icon="el-icon-download" @click="handleExport" v-hasPermi="['system:giftcoupon:export']">导出</el-button>
</div>
</template>
<!-- 统计信息卡片 --> <!-- 统计信息卡片 -->
<template #statistics> <template #statistics>
@@ -262,13 +289,18 @@
<script> <script>
import { listGiftCoupons, getGiftCoupon, getGiftCouponStatistics, exportGiftCoupons } from '@/api/system/giftcoupon' import { listGiftCoupons, getGiftCoupon, getGiftCouponStatistics, exportGiftCoupons } from '@/api/system/giftcoupon'
import { createGiftCoupon, transferWithGift, generatePromotionContent } from '@/api/system/jdorder' import { createGiftCoupon, transferWithGift, generatePromotionContent } from '@/api/system/jdorder'
import { mapGetters } from 'vuex'
import ListLayout from '@/components/ListLayout' import ListLayout from '@/components/ListLayout'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
import { parseTime } from '@/utils/ruoyi' import { parseTime } from '@/utils/ruoyi'
export default { export default {
name: 'GiftCoupon', name: 'GiftCoupon',
components: { components: {
ListLayout ListLayout,
MobileSearchForm,
MobileButtonGroup
}, },
data() { data() {
return { return {
@@ -924,6 +956,42 @@ export default {
</script> </script>
<style scoped> <style scoped>
/* 操作按钮区域 */
.action-buttons-section {
margin-top: 12px;
margin-bottom: 12px;
}
/* 移动端和桌面端按钮组显示控制 */
@media (max-width: 768px) {
.desktop-only {
display: none !important;
}
.action-buttons-section.mobile-only {
display: block;
}
}
@media (min-width: 769px) {
.mobile-only {
display: none !important;
}
.desktop-action-buttons.desktop-only {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 12px;
}
}
.desktop-action-buttons {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 12px;
}
.el-card { .el-card {
cursor: pointer; cursor: pointer;
} }

85
src/views/system/orderrows/index.vue
View File

@@ -2,7 +2,20 @@
<div class="app-container"> <div class="app-container">
<!-- 顶部搜索区域 --> <!-- 顶部搜索区域 -->
<div class="search-section"> <div class="search-section">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <mobile-search-form
:model="queryParams"
@search="handleQuery"
@reset="resetQuery"
>
<template #form="{ expanded }">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="京粉账号" prop="unionId"> <el-form-item label="京粉账号" prop="unionId">
<el-select v-model="queryParams.unionId" placeholder="请选择京粉账号" clearable style="width: 240px"> <el-select v-model="queryParams.unionId" placeholder="请选择京粉账号" clearable style="width: 240px">
<el-option <el-option
@@ -27,11 +40,14 @@
<el-form-item label="订单时间"> <el-form-item label="订单时间">
<el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template>
</mobile-search-form>
<!-- 统计悬浮模块 --> <!-- 统计悬浮模块 -->
<el-card class="statistics-card" shadow="hover" v-if="orderrowsList.length > 0"> <el-card class="statistics-card" shadow="hover" v-if="orderrowsList.length > 0">
@@ -100,7 +116,16 @@
</div> </div>
</el-card> </el-card>
<el-row :gutter="10" class="mb8"> <!-- 操作按钮区域（移动端单独显示） -->
<div class="action-buttons-section mobile-only">
<mobile-button-group
:buttons="actionButtons"
:primary-count="2"
/>
</div>
<!-- 桌面端按钮组 -->
<el-row :gutter="10" class="mb8 desktop-only">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:orderrows:add']">新增</el-button> <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:orderrows:add']">新增</el-button>
</el-col> </el-col>
@@ -295,9 +320,16 @@
<script> <script>
import { listOrderrows, getOrderrows, delOrderrows, addOrderrows, updateOrderrows, getValidCodeSelectData, getOrderStatistics } from "@/api/system/orderrows"; import { listOrderrows, getOrderrows, delOrderrows, addOrderrows, updateOrderrows, getValidCodeSelectData, getOrderStatistics } from "@/api/system/orderrows";
import { getAdminSelectData } from "@/api/system/superadmin"; import { getAdminSelectData } from "@/api/system/superadmin";
import { mapGetters } from 'vuex'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
export default { export default {
name: "Orderrows", name: "Orderrows",
components: {
MobileSearchForm,
MobileButtonGroup
},
data() { data() {
return { return {
// 遮罩层 // 遮罩层
@@ -354,6 +386,26 @@ export default {
} }
}; };
}, },
computed: {
...mapGetters(['device']),
isMobile() {
if (this.device === 'mobile') {
return true
}
if (typeof window !== 'undefined' && window.innerWidth < 768) {
return true
}
return false
},
actionButtons() {
return [
{ key: 'add', label: '新增', type: 'primary', icon: 'el-icon-plus', handler: () => this.handleAdd(), disabled: false },
{ key: 'update', label: '修改', type: 'success', icon: 'el-icon-edit', handler: () => this.handleUpdate(), disabled: this.single },
{ key: 'delete', label: '删除', type: 'danger', icon: 'el-icon-delete', handler: () => this.handleDelete(), disabled: this.multiple },
{ key: 'export', label: '导出', type: 'warning', icon: 'el-icon-download', handler: () => this.handleExport(), disabled: false }
]
}
},
created() { created() {
this.getList(); this.getList();
this.getAdminList(); this.getAdminList();
@@ -1105,4 +1157,31 @@ export default {
border-radius: 4px; border-radius: 4px;
padding: 10px 0; padding: 10px 0;
} }
/* 操作按钮区域 */
.action-buttons-section {
margin-top: 12px;
margin-bottom: 12px;
}
/* 移动端和桌面端按钮组显示控制 */
@media (max-width: 768px) {
.desktop-only {
display: none !important;
}
.action-buttons-section.mobile-only {
display: block;
}
}
@media (min-width: 769px) {
.mobile-only {
display: none !important;
}
.desktop-only {
display: block;
}
}
</style> </style>

86
src/views/system/role/index.vue
View File

@@ -3,7 +3,19 @@
<list-layout> <list-layout>
<!-- 搜索区域 --> <!-- 搜索区域 -->
<template #search> <template #search>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"> <mobile-search-form
:model="queryParams"
@search="handleQuery"
@reset="resetQuery"
>
<template #form="{ expanded }">
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
label-width="68px"
>
<el-form-item label="角色名称" prop="roleName"> <el-form-item label="角色名称" prop="roleName">
<el-input <el-input
v-model="queryParams.roleName" v-model="queryParams.roleName"
@@ -48,13 +60,25 @@
end-placeholder="结束日期" end-placeholder="结束日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template>
</mobile-search-form>
<el-row :gutter="10" class="mb8"> <!-- 操作按钮区域（移动端单独显示） -->
<div class="action-buttons-section mobile-only">
<mobile-button-group
:buttons="actionButtons"
:primary-count="2"
/>
</div>
<!-- 桌面端按钮组 -->
<el-row :gutter="10" class="mb8 desktop-only">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="primary" type="primary"
@@ -265,12 +289,17 @@
<script> <script>
import { listRole, getRole, delRole, addRole, updateRole, dataScope, changeRoleStatus, deptTreeSelect } from "@/api/system/role" import { listRole, getRole, delRole, addRole, updateRole, dataScope, changeRoleStatus, deptTreeSelect } from "@/api/system/role"
import { treeselect as menuTreeselect, roleMenuTreeselect } from "@/api/system/menu" import { treeselect as menuTreeselect, roleMenuTreeselect } from "@/api/system/menu"
import { mapGetters } from 'vuex'
import ListLayout from "@/components/ListLayout" import ListLayout from "@/components/ListLayout"
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
export default { export default {
name: "Role", name: "Role",
components: { components: {
ListLayout ListLayout,
MobileSearchForm,
MobileButtonGroup
}, },
dicts: ['sys_normal_disable'], dicts: ['sys_normal_disable'],
data() { data() {
@@ -356,6 +385,26 @@ export default {
} }
} }
}, },
computed: {
...mapGetters(['device']),
isMobile() {
if (this.device === 'mobile') {
return true
}
if (typeof window !== 'undefined' && window.innerWidth < 768) {
return true
}
return false
},
actionButtons() {
return [
{ key: 'add', label: '新增', type: 'primary', icon: 'el-icon-plus', handler: () => this.handleAdd(), disabled: false },
{ key: 'update', label: '修改', type: 'success', icon: 'el-icon-edit', handler: () => this.handleUpdate(), disabled: this.single },
{ key: 'delete', label: '删除', type: 'danger', icon: 'el-icon-delete', handler: () => this.handleDelete(), disabled: this.multiple },
{ key: 'export', label: '导出', type: 'warning', icon: 'el-icon-download', handler: () => this.handleExport(), disabled: false }
]
}
},
created() { created() {
this.getList() this.getList()
}, },
@@ -618,3 +667,32 @@ export default {
} }
} }
</script> </script>
<style scoped>
/* 操作按钮区域 */
.action-buttons-section {
margin-top: 12px;
margin-bottom: 12px;
}
/* 移动端和桌面端按钮组显示控制 */
@media (max-width: 768px) {
.desktop-only {
display: none !important;
}
.action-buttons-section.mobile-only {
display: block;
}
}
@media (min-width: 769px) {
.mobile-only {
display: none !important;
}
.desktop-only {
display: block;
}
}
</style>