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

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

@@ -5,46 +5,74 @@
<el-tab-pane label="京东评论" name="jd">
<div class="comment-container">
<!-- 搜索区域 -->
<el-form :inline="true" :model="jdQueryParams" class="demo-form-inline" size="small">
<el-form-item label="商品ID">
<el-input v-model="jdQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleJdQuery" />
</el-form-item>
<el-form-item label="产品类型">
<el-select v-model="jdQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;">
<el-option
v-for="(value, key) in jdProductTypeMap"
:key="key"
:label="key"
:value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名">
<el-input v-model="jdQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleJdQuery" />
</el-form-item>
<el-form-item label="使用状态">
<el-select v-model="jdQueryParams.isUse" placeholder="全部" clearable style="width: 120px;">
<el-option label="未使用" :value="0" />
<el-option label="已使用" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="jdDateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
@change="handleJdDateRangeChange"
/>
</el-form-item>
<el-form-item>
<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 type="success" icon="el-icon-download" size="small" @click="handleJdExport">导出</el-button>
</el-form-item>
</el-form>
<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-input v-model="jdQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleJdQuery" />
</el-form-item>
<el-form-item label="产品类型">
<el-select v-model="jdQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;">
<el-option
v-for="(value, key) in jdProductTypeMap"
:key="key"
:label="key"
:value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名">
<el-input v-model="jdQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleJdQuery" />
</el-form-item>
<el-form-item label="使用状态">
<el-select v-model="jdQueryParams.isUse" placeholder="全部" clearable style="width: 120px;">
<el-option label="未使用" :value="0" />
<el-option label="已使用" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="jdDateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
@change="handleJdDateRangeChange"
/>
</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 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-form-item>
</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>
@@ -106,46 +134,74 @@
<el-tab-pane label="淘宝评论" name="tb">
<div class="comment-container">
<!-- 搜索区域 -->
<el-form :inline="true" :model="tbQueryParams" class="demo-form-inline" size="small">
<el-form-item label="商品ID">
<el-input v-model="tbQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleTbQuery" />
</el-form-item>
<el-form-item label="产品类型">
<el-select v-model="tbQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;">
<el-option
v-for="(value, key) in tbProductTypeMap"
:key="key"
:label="key"
:value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名">
<el-input v-model="tbQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleTbQuery" />
</el-form-item>
<el-form-item label="使用状态">
<el-select v-model="tbQueryParams.isUse" placeholder="全部" clearable style="width: 120px;">
<el-option label="未使用" :value="0" />
<el-option label="已使用" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="tbDateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
@change="handleTbDateRangeChange"
/>
</el-form-item>
<el-form-item>
<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 type="success" icon="el-icon-download" size="small" @click="handleTbExport">导出</el-button>
</el-form-item>
</el-form>
<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-input v-model="tbQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleTbQuery" />
</el-form-item>
<el-form-item label="产品类型">
<el-select v-model="tbQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;">
<el-option
v-for="(value, key) in tbProductTypeMap"
:key="key"
:label="key"
:value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="用户名">
<el-input v-model="tbQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleTbQuery" />
</el-form-item>
<el-form-item label="使用状态">
<el-select v-model="tbQueryParams.isUse" placeholder="全部" clearable style="width: 120px;">
<el-option label="未使用" :value="0" />
<el-option label="已使用" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="tbDateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
@change="handleTbDateRangeChange"
/>
</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 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-form-item>
</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>
@@ -281,9 +337,16 @@ import {
listTbComment, getTbComment, updateTbComment, delTbComment, resetTbCommentByProductId,
getCommentStatistics, getJdProductTypeMap, getTbProductTypeMap
} from '@/api/jarvis/comment'
import { mapGetters } from 'vuex'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
export default {
name: 'CommentManagement',
components: {
MobileSearchForm,
MobileButtonGroup
},
data() {
return {
activeTab: 'jd',
@@ -326,6 +389,28 @@ export default {
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() {
this.getJdList()
this.getJdProductTypeMap()
@@ -488,5 +573,42 @@ export default {
flex-wrap: wrap;
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>

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

@@ -1,43 +1,68 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="商品名称" prop="productName">
<el-input
v-model="queryParams.productName"
placeholder="请输入商品名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="店铺名称" prop="shopName">
<el-input
v-model="queryParams.shopName"
placeholder="请输入店铺名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="SKUID" prop="skuid">
<el-input
v-model="queryParams.skuid"
placeholder="请输入SKUID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="是否置顶" prop="isTop">
<el-select v-model="queryParams.isTop" placeholder="请选择" clearable>
<el-option label="是" :value="1" />
<el-option label="否" :value="0" />
</el-select>
</el-form-item>
<el-form-item>
<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-form-item>
</el-form>
<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-input
v-model="queryParams.productName"
placeholder="请输入商品名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="店铺名称" prop="shopName">
<el-input
v-model="queryParams.shopName"
placeholder="请输入店铺名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="SKUID" prop="skuid">
<el-input
v-model="queryParams.skuid"
placeholder="请输入SKUID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="是否置顶" prop="isTop">
<el-select v-model="queryParams.isTop" placeholder="请选择" clearable>
<el-option label="是" :value="1" />
<el-option label="否" :value="0" />
</el-select>
</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 icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</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-button
type="primary"
@@ -347,14 +372,38 @@
import { listFavoriteProduct, getFavoriteProduct, delFavoriteProduct, addFavoriteProduct, updateFavoriteProduct, updateTopStatus } from "@/api/system/favoriteProduct";
import { generatePromotionContent } from "@/api/system/jdorder";
import { mapGetters, mapActions } from 'vuex'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
import PublishDialog from '@/components/PublishDialog.vue'
// 自动加入常用逻辑由 PublishDialog 内部触发（线报、转链页面），本页主要用于打开发品弹窗
export default {
name: "FavoriteProduct",
components: { PublishDialog },
components: {
PublishDialog,
MobileSearchForm,
MobileButtonGroup
},
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() {
return {
@@ -628,4 +677,31 @@ export default {
.el-tag {
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>

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

@@ -3,47 +3,74 @@
<list-layout>
<!-- 搜索区域 -->
<template #search>
<el-form :inline="true" :model="queryParams" label-width="100px">
<el-form-item label="礼金Key">
<el-input v-model="queryParams.giftCouponKey" placeholder="礼金批次ID" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="商品SKU">
<el-input v-model="queryParams.skuId" placeholder="商品SKU ID" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="商品名称">
<el-input v-model="queryParams.skuName" placeholder="商品名称" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="类型">
<el-select v-model="queryParams.owner" placeholder="请选择" clearable size="small">
<el-option label="自营" value="g" />
<el-option label="POP" value="pop" />
</el-select>
</el-form-item>
<el-form-item label="过期状态">
<el-select v-model="queryParams.isExpired" placeholder="请选择" clearable size="small">
<el-option label="未过期" :value="0" />
<el-option label="已过期" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="dateRange"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
size="small"
range-separator="至"
@change="handleDateRangeChange"
/>
</el-form-item>
<el-form-item>
<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 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>
</el-form-item>
</el-form>
<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-input v-model="queryParams.giftCouponKey" placeholder="礼金批次ID" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="商品SKU">
<el-input v-model="queryParams.skuId" placeholder="商品SKU ID" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="商品名称">
<el-input v-model="queryParams.skuName" placeholder="商品名称" clearable size="small" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="类型">
<el-select v-model="queryParams.owner" placeholder="请选择" clearable size="small">
<el-option label="自营" value="g" />
<el-option label="POP" value="pop" />
</el-select>
</el-form-item>
<el-form-item label="过期状态">
<el-select v-model="queryParams.isExpired" placeholder="请选择" clearable size="small">
<el-option label="未过期" :value="0" />
<el-option label="已过期" :value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="dateRange"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
size="small"
range-separator="至"
@change="handleDateRangeChange"
/>
</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 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="warning" size="small" icon="el-icon-download" @click="handleExport" v-hasPermi="['system:giftcoupon:export']">导出</el-button>
</el-form-item>
</el-form>
</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>
<!-- 统计信息卡片 -->
@@ -262,13 +289,18 @@
<script>
import { listGiftCoupons, getGiftCoupon, getGiftCouponStatistics, exportGiftCoupons } from '@/api/system/giftcoupon'
import { createGiftCoupon, transferWithGift, generatePromotionContent } from '@/api/system/jdorder'
import { mapGetters } from 'vuex'
import ListLayout from '@/components/ListLayout'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
import { parseTime } from '@/utils/ruoyi'
export default {
name: 'GiftCoupon',
components: {
ListLayout
ListLayout,
MobileSearchForm,
MobileButtonGroup
},
data() {
return {
@@ -924,6 +956,42 @@ export default {
</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-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 {
cursor: pointer;
}

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

@@ -2,36 +2,52 @@
<div class="app-container">
<!-- 顶部搜索区域 -->
<div class="search-section">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="京粉账号" prop="unionId">
<el-select v-model="queryParams.unionId" placeholder="请选择京粉账号" clearable style="width: 240px">
<el-option
v-for="admin in adminList"
:key="admin.value || admin.id"
:label="admin.label || (admin.name + ' (' + admin.wxid + ')')"
:value="admin.value || admin.id"
/>
</el-select>
</el-form-item>
<el-form-item label="订单号" prop="orderId">
<el-input v-model="queryParams.orderId" placeholder="请输入订单号" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="商品名称" prop="skuName">
<el-input v-model="queryParams.skuName" placeholder="请输入商品名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="订单状态" prop="statusGroup">
<el-select v-model="queryParams.statusGroup" placeholder="订单状态" clearable style="width: 240px">
<el-option v-for="status in mergedStatusList" :key="status.value" :label="status.label" :value="status.value" />
</el-select>
</el-form-item>
<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-form-item>
<el-form-item>
<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-form-item>
</el-form>
<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-select v-model="queryParams.unionId" placeholder="请选择京粉账号" clearable style="width: 240px">
<el-option
v-for="admin in adminList"
:key="admin.value || admin.id"
:label="admin.label || (admin.name + ' (' + admin.wxid + ')')"
:value="admin.value || admin.id"
/>
</el-select>
</el-form-item>
<el-form-item label="订单号" prop="orderId">
<el-input v-model="queryParams.orderId" placeholder="请输入订单号" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="商品名称" prop="skuName">
<el-input v-model="queryParams.skuName" placeholder="请输入商品名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="订单状态" prop="statusGroup">
<el-select v-model="queryParams.statusGroup" placeholder="订单状态" clearable style="width: 240px">
<el-option v-for="status in mergedStatusList" :key="status.value" :label="status.label" :value="status.value" />
</el-select>
</el-form-item>
<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-form-item>
<!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<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-form-item>
</el-form>
</template>
</mobile-search-form>
<!-- 统计悬浮模块 -->
<el-card class="statistics-card" shadow="hover" v-if="orderrowsList.length > 0">
@@ -100,7 +116,16 @@
</div>
</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-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:orderrows:add']">新增</el-button>
</el-col>
@@ -295,9 +320,16 @@
<script>
import { listOrderrows, getOrderrows, delOrderrows, addOrderrows, updateOrderrows, getValidCodeSelectData, getOrderStatistics } from "@/api/system/orderrows";
import { getAdminSelectData } from "@/api/system/superadmin";
import { mapGetters } from 'vuex'
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
export default {
name: "Orderrows",
components: {
MobileSearchForm,
MobileButtonGroup
},
data() {
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() {
this.getList();
this.getAdminList();
@@ -1105,4 +1157,31 @@ export default {
border-radius: 4px;
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>

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

@@ -3,58 +3,82 @@
<list-layout>
<!-- 搜索区域 -->
<template #search>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
<el-form-item label="角色名称" prop="roleName">
<el-input
v-model="queryParams.roleName"
placeholder="请输入角色名称"
clearable
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="权限字符" prop="roleKey">
<el-input
v-model="queryParams.roleKey"
placeholder="请输入权限字符"
clearable
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select
v-model="queryParams.status"
placeholder="角色状态"
clearable
style="width: 240px"
<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-option
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<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-form-item>
<el-form-item>
<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-form-item>
</el-form>
<el-form-item label="角色名称" prop="roleName">
<el-input
v-model="queryParams.roleName"
placeholder="请输入角色名称"
clearable
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="权限字符" prop="roleKey">
<el-input
v-model="queryParams.roleKey"
placeholder="请输入权限字符"
clearable
style="width: 240px"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="状态" prop="status">
<el-select
v-model="queryParams.status"
placeholder="角色状态"
clearable
style="width: 240px"
>
<el-option
v-for="dict in dict.type.sys_normal_disable"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<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-form-item>
<!-- 桌面端搜索按钮 -->
<el-form-item v-if="!expanded">
<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-form-item>
</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-button
type="primary"
@@ -265,12 +289,17 @@
<script>
import { listRole, getRole, delRole, addRole, updateRole, dataScope, changeRoleStatus, deptTreeSelect } from "@/api/system/role"
import { treeselect as menuTreeselect, roleMenuTreeselect } from "@/api/system/menu"
import { mapGetters } from 'vuex'
import ListLayout from "@/components/ListLayout"
import MobileSearchForm from '@/components/MobileSearchForm'
import MobileButtonGroup from '@/components/MobileButtonGroup'
export default {
name: "Role",
components: {
ListLayout
ListLayout,
MobileSearchForm,
MobileButtonGroup
},
dicts: ['sys_normal_disable'],
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() {
this.getList()
},
@@ -618,3 +667,32 @@ export default {
}
}
</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>