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"> <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
<el-form-item label="商品ID"> :model="jdQueryParams"
<el-input v-model="jdQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleJdQuery" /> @search="handleJdQuery"
</el-form-item> @reset="resetJdQuery"
<el-form-item label="产品类型"> >
<el-select v-model="jdQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;"> <template #form="{ expanded }">
<el-option <el-form
v-for="(value, key) in jdProductTypeMap" :inline="true"
:key="key" :model="jdQueryParams"
:label="key" class="demo-form-inline"
:value="key"> size="small"
</el-option> label-width="68px"
</el-select> >
</el-form-item> <el-form-item label="商品ID">
<el-form-item label="用户名"> <el-input v-model="jdQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleJdQuery" />
<el-input v-model="jdQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleJdQuery" /> </el-form-item>
</el-form-item> <el-form-item label="产品类型">
<el-form-item label="使用状态"> <el-select v-model="jdQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;">
<el-select v-model="jdQueryParams.isUse" placeholder="全部" clearable style="width: 120px;"> <el-option
<el-option label="未使用" :value="0" /> v-for="(value, key) in jdProductTypeMap"
<el-option label="已使用" :value="1" /> :key="key"
</el-select> :label="key"
</el-form-item> :value="key">
<el-form-item label="创建时间"> </el-option>
<el-date-picker </el-select>
v-model="jdDateRange" </el-form-item>
type="daterange" <el-form-item label="用户名">
range-separator="至" <el-input v-model="jdQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleJdQuery" />
start-placeholder="开始日期" </el-form-item>
end-placeholder="结束日期" <el-form-item label="使用状态">
value-format="yyyy-MM-dd" <el-select v-model="jdQueryParams.isUse" placeholder="全部" clearable style="width: 120px;">
@change="handleJdDateRangeChange" <el-option label="未使用" :value="0" />
/> <el-option label="已使用" :value="1" />
</el-form-item> </el-select>
<el-form-item> </el-form-item>
<el-button type="primary" icon="el-icon-search" size="small" @click="handleJdQuery">搜索</el-button> <el-form-item label="创建时间">
<el-button icon="el-icon-refresh" size="small" @click="resetJdQuery">重置</el-button> <el-date-picker
<el-button type="success" icon="el-icon-download" size="small" @click="handleJdExport">导出</el-button> v-model="jdDateRange"
</el-form-item> type="daterange"
</el-form> 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> <el-table v-loading="jdLoading" :data="jdList" border>
@@ -106,46 +134,74 @@
<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
<el-form-item label="商品ID"> :model="tbQueryParams"
<el-input v-model="tbQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleTbQuery" /> @search="handleTbQuery"
</el-form-item> @reset="resetTbQuery"
<el-form-item label="产品类型"> >
<el-select v-model="tbQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;"> <template #form="{ expanded }">
<el-option <el-form
v-for="(value, key) in tbProductTypeMap" :inline="true"
:key="key" :model="tbQueryParams"
:label="key" class="demo-form-inline"
:value="key"> size="small"
</el-option> label-width="68px"
</el-select> >
</el-form-item> <el-form-item label="商品ID">
<el-form-item label="用户名"> <el-input v-model="tbQueryParams.productId" placeholder="商品ID" clearable @keyup.enter.native="handleTbQuery" />
<el-input v-model="tbQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleTbQuery" /> </el-form-item>
</el-form-item> <el-form-item label="产品类型">
<el-form-item label="使用状态"> <el-select v-model="tbQueryParams.productType" placeholder="请选择" clearable filterable style="width: 200px;">
<el-select v-model="tbQueryParams.isUse" placeholder="全部" clearable style="width: 120px;"> <el-option
<el-option label="未使用" :value="0" /> v-for="(value, key) in tbProductTypeMap"
<el-option label="已使用" :value="1" /> :key="key"
</el-select> :label="key"
</el-form-item> :value="key">
<el-form-item label="创建时间"> </el-option>
<el-date-picker </el-select>
v-model="tbDateRange" </el-form-item>
type="daterange" <el-form-item label="用户名">
range-separator="至" <el-input v-model="tbQueryParams.userName" placeholder="用户名" clearable @keyup.enter.native="handleTbQuery" />
start-placeholder="开始日期" </el-form-item>
end-placeholder="结束日期" <el-form-item label="使用状态">
value-format="yyyy-MM-dd" <el-select v-model="tbQueryParams.isUse" placeholder="全部" clearable style="width: 120px;">
@change="handleTbDateRangeChange" <el-option label="未使用" :value="0" />
/> <el-option label="已使用" :value="1" />
</el-form-item> </el-select>
<el-form-item> </el-form-item>
<el-button type="primary" icon="el-icon-search" size="small" @click="handleTbQuery">搜索</el-button> <el-form-item label="创建时间">
<el-button icon="el-icon-refresh" size="small" @click="resetTbQuery">重置</el-button> <el-date-picker
<el-button type="success" icon="el-icon-download" size="small" @click="handleTbExport">导出</el-button> v-model="tbDateRange"
</el-form-item> type="daterange"
</el-form> 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> <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>

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

@@ -1,43 +1,68 @@
<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
<el-form-item label="商品名称" prop="productName"> :model="queryParams"
<el-input @search="handleQuery"
v-model="queryParams.productName" @reset="resetQuery"
placeholder="请输入商品名称" >
clearable <template #form="{ expanded }">
@keyup.enter.native="handleQuery" <el-form
/> :model="queryParams"
</el-form-item> ref="queryForm"
<el-form-item label="店铺名称" prop="shopName"> size="small"
<el-input :inline="true"
v-model="queryParams.shopName" v-show="showSearch"
placeholder="请输入店铺名称" label-width="68px"
clearable >
@keyup.enter.native="handleQuery" <el-form-item label="商品名称" prop="productName">
/> <el-input
</el-form-item> v-model="queryParams.productName"
<el-form-item label="SKUID" prop="skuid"> placeholder="请输入商品名称"
<el-input clearable
v-model="queryParams.skuid" @keyup.enter.native="handleQuery"
placeholder="请输入SKUID" />
clearable </el-form-item>
@keyup.enter.native="handleQuery" <el-form-item label="店铺名称" prop="shopName">
/> <el-input
</el-form-item> v-model="queryParams.shopName"
<el-form-item label="是否置顶" prop="isTop"> placeholder="请输入店铺名称"
<el-select v-model="queryParams.isTop" placeholder="请选择" clearable> clearable
<el-option label="是" :value="1" /> @keyup.enter.native="handleQuery"
<el-option label="否" :value="0" /> />
</el-select> </el-form-item>
</el-form-item> <el-form-item label="SKUID" prop="skuid">
<el-form-item> <el-input
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> v-model="queryParams.skuid"
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> placeholder="请输入SKUID"
</el-form-item> clearable
</el-form> @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-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>

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

@@ -3,47 +3,74 @@
<list-layout> <list-layout>
<!-- 搜索区域 --> <!-- 搜索区域 -->
<template #search> <template #search>
<el-form :inline="true" :model="queryParams" label-width="100px"> <mobile-search-form
<el-form-item label="礼金Key"> :model="queryParams"
<el-input v-model="queryParams.giftCouponKey" placeholder="礼金批次ID" clearable size="small" @keyup.enter.native="handleQuery" /> @search="handleQuery"
</el-form-item> @reset="resetQuery"
<el-form-item label="商品SKU"> >
<el-input v-model="queryParams.skuId" placeholder="商品SKU ID" clearable size="small" @keyup.enter.native="handleQuery" /> <template #form="{ expanded }">
</el-form-item> <el-form
<el-form-item label="商品名称"> :model="queryParams"
<el-input v-model="queryParams.skuName" placeholder="商品名称" clearable size="small" @keyup.enter.native="handleQuery" /> :inline="true"
</el-form-item> label-width="100px"
<el-form-item label="类型"> >
<el-select v-model="queryParams.owner" placeholder="请选择" clearable size="small"> <el-form-item label="礼金Key">
<el-option label="自营" value="g" /> <el-input v-model="queryParams.giftCouponKey" placeholder="礼金批次ID" clearable size="small" @keyup.enter.native="handleQuery" />
<el-option label="POP" value="pop" /> </el-form-item>
</el-select> <el-form-item label="商品SKU">
</el-form-item> <el-input v-model="queryParams.skuId" placeholder="商品SKU ID" clearable size="small" @keyup.enter.native="handleQuery" />
<el-form-item label="过期状态"> </el-form-item>
<el-select v-model="queryParams.isExpired" placeholder="请选择" clearable size="small"> <el-form-item label="商品名称">
<el-option label="未过期" :value="0" /> <el-input v-model="queryParams.skuName" placeholder="商品名称" clearable size="small" @keyup.enter.native="handleQuery" />
<el-option label="已过期" :value="1" /> </el-form-item>
</el-select> <el-form-item label="类型">
</el-form-item> <el-select v-model="queryParams.owner" placeholder="请选择" clearable size="small">
<el-form-item label="创建时间"> <el-option label="自营" value="g" />
<el-date-picker <el-option label="POP" value="pop" />
v-model="dateRange" </el-select>
type="daterange" </el-form-item>
start-placeholder="开始日期" <el-form-item label="过期状态">
end-placeholder="结束日期" <el-select v-model="queryParams.isExpired" placeholder="请选择" clearable size="small">
value-format="yyyy-MM-dd" <el-option label="未过期" :value="0" />
size="small" <el-option label="已过期" :value="1" />
range-separator="至" </el-select>
@change="handleDateRangeChange" </el-form-item>
/> <el-form-item label="创建时间">
</el-form-item> <el-date-picker
<el-form-item> v-model="dateRange"
<el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">搜索</el-button> type="daterange"
<el-button size="small" icon="el-icon-refresh" @click="resetQuery">重置</el-button> start-placeholder="开始日期"
<el-button type="success" size="small" icon="el-icon-plus" @click="handleCreate">创建礼金</el-button> end-placeholder="结束日期"
<el-button type="warning" size="small" icon="el-icon-download" @click="handleExport" v-hasPermi="['system:giftcoupon:export']">导出</el-button> value-format="yyyy-MM-dd"
</el-form-item> size="small"
</el-form> 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> </template>
<!-- 统计信息卡片 --> <!-- 统计信息卡片 -->
@@ -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;
} }

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

@@ -2,36 +2,52 @@
<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
<el-form-item label="京粉账号" prop="unionId"> :model="queryParams"
<el-select v-model="queryParams.unionId" placeholder="请选择京粉账号" clearable style="width: 240px"> @search="handleQuery"
<el-option @reset="resetQuery"
v-for="admin in adminList" >
:key="admin.value || admin.id" <template #form="{ expanded }">
:label="admin.label || (admin.name + ' (' + admin.wxid + ')')" <el-form
:value="admin.value || admin.id" :model="queryParams"
/> ref="queryForm"
</el-select> size="small"
</el-form-item> :inline="true"
<el-form-item label="订单号" prop="orderId"> v-show="showSearch"
<el-input v-model="queryParams.orderId" placeholder="请输入订单号" clearable style="width: 240px" @keyup.enter.native="handleQuery" /> label-width="68px"
</el-form-item> >
<el-form-item label="商品名称" prop="skuName"> <el-form-item label="京粉账号" prop="unionId">
<el-input v-model="queryParams.skuName" placeholder="请输入商品名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" /> <el-select v-model="queryParams.unionId" placeholder="请选择京粉账号" clearable style="width: 240px">
</el-form-item> <el-option
<el-form-item label="订单状态" prop="statusGroup"> v-for="admin in adminList"
<el-select v-model="queryParams.statusGroup" placeholder="订单状态" clearable style="width: 240px"> :key="admin.value || admin.id"
<el-option v-for="status in mergedStatusList" :key="status.value" :label="status.label" :value="status.value" /> :label="admin.label || (admin.name + ' (' + admin.wxid + ')')"
</el-select> :value="admin.value || admin.id"
</el-form-item> />
<el-form-item label="订单时间"> </el-select>
<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 label="订单号" prop="orderId">
<el-form-item> <el-input v-model="queryParams.orderId" placeholder="请输入订单号" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> </el-form-item>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> <el-form-item label="商品名称" prop="skuName">
</el-form-item> <el-input v-model="queryParams.skuName" placeholder="请输入商品名称" clearable style="width: 240px" @keyup.enter.native="handleQuery" />
</el-form> </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"> <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>

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

@@ -3,58 +3,82 @@
<list-layout> <list-layout>
<!-- 搜索区域 --> <!-- 搜索区域 -->
<template #search> <template #search>
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"> <mobile-search-form
<el-form-item label="角色名称" prop="roleName"> :model="queryParams"
<el-input @search="handleQuery"
v-model="queryParams.roleName" @reset="resetQuery"
placeholder="请输入角色名称" >
clearable <template #form="{ expanded }">
style="width: 240px" <el-form
@keyup.enter.native="handleQuery" :model="queryParams"
/> ref="queryForm"
</el-form-item> size="small"
<el-form-item label="权限字符" prop="roleKey"> :inline="true"
<el-input label-width="68px"
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 <el-form-item label="角色名称" prop="roleName">
v-for="dict in dict.type.sys_normal_disable" <el-input
:key="dict.value" v-model="queryParams.roleName"
:label="dict.label" placeholder="请输入角色名称"
:value="dict.value" clearable
/> style="width: 240px"
</el-select> @keyup.enter.native="handleQuery"
</el-form-item> />
<el-form-item label="创建时间"> </el-form-item>
<el-date-picker <el-form-item label="权限字符" prop="roleKey">
v-model="dateRange" <el-input
style="width: 240px" v-model="queryParams.roleKey"
value-format="yyyy-MM-dd" placeholder="请输入权限字符"
type="daterange" clearable
range-separator="-" style="width: 240px"
start-placeholder="开始日期" @keyup.enter.native="handleQuery"
end-placeholder="结束日期" />
></el-date-picker> </el-form-item>
</el-form-item> <el-form-item label="状态" prop="status">
<el-form-item> <el-select
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> v-model="queryParams.status"
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> placeholder="角色状态"
</el-form-item> clearable
</el-form> 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-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()
}, },
@@ -617,4 +666,33 @@ 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>