配置调整，行政信息页面开发
This commit is contained in:
2090205686@qq.com
parent
04bd98eab5
commit
1af553dbc1
@ -1,5 +1,5 @@
|
||||
# 页面标题
|
||||
VITE_APP_TITLE = 运营云后台管理系统
|
||||
VITE_APP_TITLE = 政务云后台管理系统
|
||||
|
||||
# 开发环境配置
|
||||
VITE_APP_ENV = 'development'
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
# 页面标题
|
||||
VITE_APP_TITLE = 运营云后台管理系统
|
||||
VITE_APP_TITLE = 政务云后台管理系统
|
||||
|
||||
# 生产环境配置
|
||||
VITE_APP_ENV = 'production'
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
# 页面标题
|
||||
VITE_APP_TITLE = 运营云后台管理系统
|
||||
VITE_APP_TITLE = 政务云后台管理系统
|
||||
|
||||
# 测试环境配置
|
||||
VITE_APP_ENV = 'production'
|
||||
|
||||
# 测试环境
|
||||
VITE_APP_BASE_API = 'http://192.168.18.99:8080/'
|
||||
VITE_APP_BASE_API = 'http://192.168.18.99:8080'
|
||||
VITE_APP_PLATFORM = 'http://192.168.18.99/platform'
|
||||
|
||||
# 是否在打包时开启压缩，支持 gzip 和 brotli
|
||||
|
||||
@ -218,6 +218,7 @@
|
||||
height: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
min-width: 1000px;
|
||||
}
|
||||
// 表格组件中的各插槽元素自定义样式
|
||||
.custom-tooltip-content {
|
||||
|
||||
@ -59,6 +59,7 @@
|
||||
:label="column.label"
|
||||
:width="column.width"
|
||||
:align="column.align || 'center'"
|
||||
:fixed="column.fixed ?? false"
|
||||
:sortable="column.sortable"
|
||||
:header-class-name="column.headerClassName"
|
||||
>
|
||||
@ -340,7 +341,7 @@ onBeforeUnmount(() => {
|
||||
|
||||
/* 自定义鼠标悬停颜色 */
|
||||
:deep(.el-table__body tr:hover > td) {
|
||||
background-color: rgba(37, 191, 130, 0.1) !important;
|
||||
background-color: rgba(237 255 248) !important;
|
||||
}
|
||||
|
||||
/* 自定义表头样式 */
|
||||
|
||||
@ -2,9 +2,10 @@
|
||||
<section class="app-main">
|
||||
<router-view v-slot="{ Component, route }">
|
||||
<transition name="fade-transform" mode="out-in">
|
||||
<keep-alive :include="tagsViewStore.cachedViews">
|
||||
<!-- <keep-alive :include="tagsViewStore.cachedViews">
|
||||
<component v-if="!route.meta.link" :is="Component" :key="route.path"/>
|
||||
</keep-alive>
|
||||
</keep-alive> -->
|
||||
<component v-if="!route.meta.link" :is="Component" :key="route.path"/>
|
||||
</transition>
|
||||
</router-view>
|
||||
<iframe-toggle />
|
||||
|
||||
@ -7,19 +7,11 @@
|
||||
class="sidebar-logo-link"
|
||||
to="/"
|
||||
>
|
||||
<img
|
||||
v-if="logo"
|
||||
:src="logoY"
|
||||
class="sidebar-logo"
|
||||
/>
|
||||
<img v-if="logo" :src="logo" class="sidebar-logo" />
|
||||
<h1 v-else class="sidebar-title">{{ title }}</h1>
|
||||
</router-link>
|
||||
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
|
||||
<img
|
||||
v-if="logo"
|
||||
:src="logoY"
|
||||
class="sidebar-logo"
|
||||
/>
|
||||
<img v-if="logo" :src="logo" class="sidebar-logo" />
|
||||
<h1 class="sidebar-title">{{ title }}</h1>
|
||||
</router-link>
|
||||
</transition>
|
||||
@ -78,7 +70,6 @@ function getUser() {
|
||||
});
|
||||
}
|
||||
getUser();
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -74,7 +74,7 @@ export const constantRoutes = [
|
||||
meta: { title: '首页', icon: 'chart', affix: true }
|
||||
}
|
||||
]
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/goods',
|
||||
component: Layout,
|
||||
@ -149,46 +149,8 @@ export const constantRoutes = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/customer',
|
||||
name: "customer",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
alwaysShow: true,
|
||||
redirect: 'noredirect',
|
||||
meta: {
|
||||
icon: "peoples",
|
||||
link: null,
|
||||
noCache: false,
|
||||
title: "客户管理",
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'customer/customerManage',
|
||||
component: () => import('@/views/customer/customerManage'),
|
||||
name: 'customerManage',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "客户信息管理",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'customer/customerCategory',
|
||||
component: () => import('@/views/customer/customerCategory'),
|
||||
name: 'customerCategory',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "客户分类设置",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
}
|
||||
],
|
||||
},
|
||||
|
||||
// 产业运营云后台管理菜单【可访问页面参考】
|
||||
{
|
||||
path: '/goods',
|
||||
name: "goods",
|
||||
@ -253,123 +215,248 @@ export const constantRoutes = [
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// path: '/plant',
|
||||
// name: "plant",
|
||||
// component: Layout,
|
||||
// hidden: false,
|
||||
// alwaysShow: true,
|
||||
// redirect: 'noredirect',
|
||||
// meta: {
|
||||
// icon: "sunny",
|
||||
// link: null,
|
||||
// noCache: false,
|
||||
// title: "智慧种植",
|
||||
// },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'plant/ambient',
|
||||
// component: () => import('@/views/plant/ambient'),
|
||||
// name: 'ambient',
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "农业环境监测",
|
||||
// icon: "",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: 'plant/control',
|
||||
// component: () => import('@/views/plant/control'),
|
||||
// name: 'control',
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "生产管理控制",
|
||||
// icon: "",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// }
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// path: '/trade',
|
||||
// name: "trade",
|
||||
// component: Layout,
|
||||
// hidden: false,
|
||||
// alwaysShow: true,
|
||||
// redirect: 'noredirect',
|
||||
// meta: {
|
||||
// icon: "money",
|
||||
// link: null,
|
||||
// noCache: false,
|
||||
// title: "电商交易",
|
||||
// },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'trade/agriculturalinputstrading',
|
||||
// component: () => import('@/views/trade/agriculturalinputstrading'),
|
||||
// name: 'agriculturalinputstrading',
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "农资交易",
|
||||
// icon: "",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: 'trade/supplierServices',
|
||||
// component: () => import('@/views/trade/supplierServices'),
|
||||
// name: 'supplierServices',
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "供应商服务",
|
||||
// icon: "",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: 'trade/procurementServices',
|
||||
// component: () => import('@/views/trade/procurementServices'),
|
||||
// name: 'procurementServices',
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "采购商服务",
|
||||
// icon: "",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// },
|
||||
// {
|
||||
// path: 'trade/landTransaction',
|
||||
// component: () => import('@/views/trade/landTransaction'),
|
||||
// name: 'landTransaction',
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "土地交易",
|
||||
// icon: "",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// path: '/order',
|
||||
// name: "order",
|
||||
// component: Layout,
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "订单列表",
|
||||
// icon: "documentation",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// children: [
|
||||
// {
|
||||
// path: 'order/obligation',
|
||||
// component: () => import('@/views/order/obligation'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "待付款",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "obligation",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/sendGoods',
|
||||
// component: () => import('@/views/order/sendGoods'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "待发货",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "sendGoods",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/shipped',
|
||||
// component: () => import('@/views/order/shipped'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "已发货",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "shipped",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/receivedGoods',
|
||||
// component: () => import('@/views/order/receivedGoods'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "已收货",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "receivedGoods",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/completed',
|
||||
// component: () => import('@/views/order/completed'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "已完成",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "completed",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/cancelled',
|
||||
// component: () => import('@/views/order/cancelled'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "已取消",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "cancelled",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/salesService',
|
||||
// component: () => import('@/views/order/salesService'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "退货/退款",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "salesService",
|
||||
// },
|
||||
// {
|
||||
// path: 'order/refunded',
|
||||
// component: () => import('@/views/order/refunded'),
|
||||
// hidden: false,
|
||||
// meta: {
|
||||
// title: "已退货/退款",
|
||||
// noCache: false,
|
||||
// link: null,
|
||||
// },
|
||||
// name: "refunded",
|
||||
// },
|
||||
|
||||
// ],
|
||||
// },
|
||||
|
||||
// 政务云后台管理系统菜单
|
||||
{
|
||||
path: '/plant',
|
||||
name: "plant",
|
||||
path: "/mainbody",
|
||||
name: "mainbody",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
alwaysShow: true,
|
||||
redirect: 'noredirect',
|
||||
meta: {
|
||||
icon: "sunny",
|
||||
link: null,
|
||||
noCache: false,
|
||||
title: "智慧种植",
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'plant/ambient',
|
||||
component: () => import('@/views/plant/ambient'),
|
||||
name: 'ambient',
|
||||
path: "mainbody/index",
|
||||
component: () => import("@/views/mainbody/index"),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "农业环境监测",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'plant/control',
|
||||
component: () => import('@/views/plant/control'),
|
||||
name: 'control',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "生产管理控制",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
}
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/trade',
|
||||
name: "trade",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
alwaysShow: true,
|
||||
redirect: 'noredirect',
|
||||
meta: {
|
||||
icon: "money",
|
||||
link: null,
|
||||
noCache: false,
|
||||
title: "电商交易",
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'trade/agriculturalinputstrading',
|
||||
component: () => import('@/views/trade/agriculturalinputstrading'),
|
||||
name: 'agriculturalinputstrading',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "农资交易",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'trade/supplierServices',
|
||||
component: () => import('@/views/trade/supplierServices'),
|
||||
name: 'supplierServices',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "供应商服务",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'trade/procurementServices',
|
||||
component: () => import('@/views/trade/procurementServices'),
|
||||
name: 'procurementServices',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "采购商服务",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'trade/landTransaction',
|
||||
component: () => import('@/views/trade/landTransaction'),
|
||||
name: 'landTransaction',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "土地交易",
|
||||
icon: "",
|
||||
title: "生产经营主体",
|
||||
icon: "user",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "mainbody",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/brand',
|
||||
name: "brand",
|
||||
path: "/inputs",
|
||||
name: "inputs",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
children: [
|
||||
{
|
||||
path: 'brand/index',
|
||||
component: () => import('@/views/brand/index'),
|
||||
path: "inputs/index",
|
||||
component: () => import("@/views/inputs/index"),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "公共品牌",
|
||||
icon: "star",
|
||||
title: "投入品监管平台",
|
||||
icon: "tree",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
@ -378,108 +465,67 @@ export const constantRoutes = [
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/order',
|
||||
name: "order",
|
||||
path: '/region',
|
||||
name: "region",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
redirect: 'noredirect',
|
||||
children: [
|
||||
{
|
||||
path: 'region/index',
|
||||
component: () => import('@/views/region/index'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "行政信息",
|
||||
icon: "star",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "region",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "/traceability",
|
||||
name: "traceability",
|
||||
component: Layout,
|
||||
hidden: false,
|
||||
alwaysShow: true,
|
||||
redirect: "noredirect",
|
||||
meta: {
|
||||
title: "订单列表",
|
||||
icon: "documentation",
|
||||
noCache: false,
|
||||
icon: "tree-table",
|
||||
link: null,
|
||||
noCache: false,
|
||||
title: "溯源管理",
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'order/obligation',
|
||||
component: () => import('@/views/order/obligation'),
|
||||
path: "traceability/query",
|
||||
component: () => import("@/views/traceability/query"),
|
||||
name: "query",
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "待付款",
|
||||
title: "溯源查询",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "obligation",
|
||||
},
|
||||
{
|
||||
path: 'order/sendGoods',
|
||||
component: () => import('@/views/order/sendGoods'),
|
||||
path: "traceability/statistics",
|
||||
component: () => import("@/views/traceability/statistics"),
|
||||
name: "溯源统计",
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "待发货",
|
||||
title: "生产管理控制",
|
||||
icon: "icon-data",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "sendGoods",
|
||||
},
|
||||
{
|
||||
path: 'order/shipped',
|
||||
component: () => import('@/views/order/shipped'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已发货",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "shipped",
|
||||
},
|
||||
{
|
||||
path: 'order/receivedGoods',
|
||||
component: () => import('@/views/order/receivedGoods'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已收货",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "receivedGoods",
|
||||
},
|
||||
{
|
||||
path: 'order/completed',
|
||||
component: () => import('@/views/order/completed'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已完成",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "completed",
|
||||
},
|
||||
{
|
||||
path: 'order/cancelled',
|
||||
component: () => import('@/views/order/cancelled'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已取消",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "cancelled",
|
||||
},
|
||||
{
|
||||
path: 'order/salesService',
|
||||
component: () => import('@/views/order/salesService'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "退货/退款",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "salesService",
|
||||
},
|
||||
{
|
||||
path: 'order/refunded',
|
||||
component: () => import('@/views/order/refunded'),
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "已退货/退款",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
name: "refunded",
|
||||
},
|
||||
|
||||
],
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
// 动态路由，基于用户权限动态去加载
|
||||
|
||||
@ -7,7 +7,7 @@ export default {
|
||||
/**
|
||||
* 侧边栏主题 深色主题theme-dark，浅色主题theme-light
|
||||
*/
|
||||
sideTheme: 'theme-dark',
|
||||
sideTheme: 'theme-light',
|
||||
|
||||
/**
|
||||
* 是否系统布局配置
|
||||
|
||||
@ -14,7 +14,7 @@ const useSettingsStore = defineStore(
|
||||
{
|
||||
state: () => ({
|
||||
title: '',
|
||||
theme: storageSetting.theme || '#409EFF',
|
||||
theme: storageSetting.theme || '#25bf82',
|
||||
sideTheme: storageSetting.sideTheme || sideTheme,
|
||||
showSettings: showSettings,
|
||||
topNav: storageSetting.topNav === undefined ? topNav : storageSetting.topNav,
|
||||
|
||||
@ -1,6 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
开发中...
|
||||
</div>
|
||||
</template>
|
||||
<script setup></script>
|
||||
@ -1,325 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div class="container-custom">
|
||||
<!-- 搜索栏 -->
|
||||
<div ref="searchBarRef" class="search-box">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar-left">
|
||||
<el-form
|
||||
ref="searchForm"
|
||||
:inline="true"
|
||||
:model="formInline"
|
||||
class="demo-form-inline"
|
||||
:label-width="'auto'"
|
||||
>
|
||||
<el-form-item label="ID" prop="id">
|
||||
<el-input
|
||||
v-model="formInline.id"
|
||||
placeholder="用户ID"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="分类名称" prop="userCategoryName">
|
||||
<el-input
|
||||
v-model="formInline.userCategoryName"
|
||||
placeholder="用户分类名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户状态" prop="userStatus">
|
||||
<el-select v-model="formInline.userStatus" placeholder="请选择" clearable>
|
||||
<el-option label="异常" value="0" />
|
||||
<el-option label="正常" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="申请日期"
|
||||
prop="startDate"
|
||||
style="margin-right: 0"
|
||||
>
|
||||
<el-date-picker
|
||||
v-model="formInline.startDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择起始日期"
|
||||
clearable
|
||||
:disabled-date="disableStartDate"
|
||||
style="width: 160px"
|
||||
/>
|
||||
<span
|
||||
style="width: 30px; text-align: center; display: inline-block"
|
||||
>
|
||||
-
|
||||
</span>
|
||||
<el-date-picker
|
||||
v-model="formInline.endDate"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
placeholder="请选择截止日期"
|
||||
clearable
|
||||
:disabled-date="disableEndDate"
|
||||
style="width: 160px"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="search-bar-right">
|
||||
<el-button class="el-button-gry" type="primary" icon="Search" @click="onSubmit"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="Refresh"
|
||||
style="margin: 16px 0 0 0"
|
||||
@click="resetForm"
|
||||
>重置</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
|
||||
<tableComponent
|
||||
:table-data="tableData"
|
||||
:columns="columns"
|
||||
:show-border="false"
|
||||
:show-selection="false"
|
||||
:header-cell-class-name="getHeaderClass"
|
||||
@page-change="handlePaginationChange"
|
||||
@selection-change="handleSelectionChange"
|
||||
:total="tableTotal" :current-page="formInline.current" :page-size="formInline.size"
|
||||
>
|
||||
<!-- 自定义-状态 -->
|
||||
<template #userStatus="slotProps">
|
||||
<span v-if="slotProps.row.userStatus == 1" class="color-green"
|
||||
>正常</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.userStatus == 0" class="color-red"
|
||||
>异常</span
|
||||
>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button text class="el-button-custom" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||
<el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import Mock from "mockjs";
|
||||
import { id } from "element-plus/es/locales.mjs";
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const formInline = reactive({
|
||||
id: "",
|
||||
nickname: "",
|
||||
userName: "",
|
||||
userCategoryName: "",
|
||||
accountNumber: "",
|
||||
phoneNumber: "",
|
||||
sex: "",
|
||||
userStatus: "",
|
||||
userCategory: "",
|
||||
unitPrice: "",
|
||||
ordersNums: "",
|
||||
startDate: "",
|
||||
endDate: "",
|
||||
current: 1,
|
||||
size: 10,
|
||||
});
|
||||
|
||||
// 禁用开始日期的逻辑（不能晚于已选的结束日期）
|
||||
const disableStartDate = (time) => {
|
||||
if (!formInline.endDate) return false;
|
||||
const endDate = new Date(formInline.endDate);
|
||||
return time.getTime() > endDate.getTime();
|
||||
};
|
||||
|
||||
// 禁用结束日期的逻辑（不能早于已选的开始日期）
|
||||
const disableEndDate = (time) => {
|
||||
if (!formInline.startDate) return false;
|
||||
const startDate = new Date(formInline.startDate).setHours(0, 0, 0, 0);
|
||||
const currentDate = new Date(time).setHours(0, 0, 0, 0);
|
||||
return currentDate < startDate;
|
||||
};
|
||||
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期！");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期！");
|
||||
return;
|
||||
}
|
||||
console.log( formInline);
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
searchForm.value.resetFields();
|
||||
formInline.endDate = "";
|
||||
};
|
||||
|
||||
// 表格数据
|
||||
const tableData = ref([]);
|
||||
const tableLoading = ref(false);
|
||||
const tableTotal = ref(0);
|
||||
let nowClickRow = ref({});
|
||||
// 列配置
|
||||
const columns = ref([
|
||||
{ prop: "id", label: "ID" },
|
||||
{ prop: "nickname", label: "昵称", width: "120" },
|
||||
{ prop: "userName", label: "姓名" },
|
||||
{ prop: "accountNumber", label: "账号", width: "120" },
|
||||
{ prop: "phoneNumber", label: "手机号", width: "120" },
|
||||
{ prop: "sex", label: "性别" },
|
||||
{ prop: "userStatus", label: "用户状态", slotName: "userStatus" },
|
||||
{ prop: "userCategory", label: "用户分类" },
|
||||
{ prop: "unitPrice", label: "客单价" },
|
||||
{ prop: "ordersNums", label: "订单数目" },
|
||||
{ prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
|
||||
]);
|
||||
|
||||
// 生成食物主题昵称
|
||||
const generateFoodNickname = () => {
|
||||
// 形容词（情绪/风格）
|
||||
const adjectives = [
|
||||
"暴躁的",
|
||||
"快乐的",
|
||||
"忧郁的",
|
||||
"疯狂的",
|
||||
"安静的",
|
||||
"慵懒的",
|
||||
"甜甜的",
|
||||
"咸咸的",
|
||||
"酸酸的",
|
||||
"辣辣的",
|
||||
];
|
||||
|
||||
// 食物名词（仅限食物）
|
||||
const foods = [
|
||||
"辣椒",
|
||||
"西瓜",
|
||||
"土豆",
|
||||
"番茄",
|
||||
"黄瓜",
|
||||
"苹果",
|
||||
"蛋糕",
|
||||
"面包",
|
||||
"披萨",
|
||||
"冰淇淋",
|
||||
"奶茶",
|
||||
"咖啡",
|
||||
"啤酒",
|
||||
"炸鸡",
|
||||
];
|
||||
|
||||
// 随机组合：形容词 + 食物
|
||||
return Mock.mock(`@pick(${adjectives})`) + Mock.mock(`@pick(${foods})`);
|
||||
};
|
||||
// 生成模拟数据
|
||||
const generateMockData = () => {
|
||||
return Mock.mock({
|
||||
"list|10": [
|
||||
{
|
||||
"id|+1": 10000,
|
||||
nickname: () => generateFoodNickname(), //昵称
|
||||
userName: "@cname", //姓名
|
||||
accountNumber: Mock.mock("@id").toString().slice(0, 10), //账号
|
||||
phoneNumber: "@integer(13000000000, 18999999999)", //手机号
|
||||
sex: '@pick(["男", "女"])', //性别
|
||||
"userStatus|1": [0, 1], //0异常 1正常
|
||||
"userCategory|1":
|
||||
'@pick(["活跃/低消费", "活跃/中消费", "活跃/高消费"])', //用户分类
|
||||
unitPrice: "@float(10, 200, 2, 2)", //客单价
|
||||
ordersNums: "@integer(10, 200)",
|
||||
},
|
||||
],
|
||||
}).list;
|
||||
};
|
||||
// 加载数据
|
||||
const loadData = () => {
|
||||
// 模拟API请求延迟
|
||||
setTimeout(() => {
|
||||
tableData.value = generateMockData();
|
||||
tableTotal.value = tableData.value.length;
|
||||
}, 500);
|
||||
};
|
||||
// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
|
||||
const getHeaderClass = ({ column }) => {
|
||||
return "custom-header";
|
||||
};
|
||||
// 分页变化
|
||||
const handlePaginationChange = ({ page, pageSize }) => {
|
||||
console.log("分页变化:", page, pageSize);
|
||||
// 这里可以调用API获取新数据
|
||||
loadData();
|
||||
};
|
||||
// 多选框变化
|
||||
const handleSelectionChange = (selection) => {
|
||||
console.log("选中项:", selection);
|
||||
};
|
||||
|
||||
// 查看详情
|
||||
const seeDetails = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要查看详情的行:", row);
|
||||
};
|
||||
// 编辑操作
|
||||
const handleEdit = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要编辑的行:", row);
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要删除的行:", row);
|
||||
};
|
||||
|
||||
const titleRef = ref(null);
|
||||
const searchBarRef = ref(null);
|
||||
const tableViewportHeight = ref(0);
|
||||
// 精确计算可用高度
|
||||
const calculateTableHeight = () => {
|
||||
// 获取窗口总高度
|
||||
const windowHeight = window.innerHeight;
|
||||
|
||||
// 获取各组件高度
|
||||
const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
|
||||
const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
|
||||
|
||||
// 计算容器内边距补偿（根据实际样式调整）
|
||||
const paddingCompensation = 130;
|
||||
|
||||
// 最终计算
|
||||
tableViewportHeight.value =
|
||||
windowHeight - headerHeight - searchBarHeight - paddingCompensation;
|
||||
// console.log(tableViewportHeight.value);
|
||||
};
|
||||
// 组件挂载时加载数据
|
||||
onMounted(() => {
|
||||
loadData();
|
||||
|
||||
calculateTableHeight();
|
||||
|
||||
// 添加响应式监听
|
||||
window.addEventListener("resize", calculateTableHeight);
|
||||
|
||||
// 监听DOM变化（适用于动态变化的header/searchbar）
|
||||
const observer = new ResizeObserver(calculateTableHeight);
|
||||
if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
|
||||
if (searchBarRef.value) observer.observe(searchBarRef.value);
|
||||
});
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener("resize", calculateTableHeight);
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
@ -1,321 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div class="container-custom">
|
||||
<!-- 搜索栏 -->
|
||||
<div ref="searchBarRef" class="search-box">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar-left">
|
||||
<el-form ref="searchForm" :inline="true" :model="formInline" class="demo-form-inline" :label-width="'auto'">
|
||||
<el-form-item label="昵称" prop="nickname">
|
||||
<el-input v-model="formInline.nickname" placeholder="用户昵称" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="ID" prop="id">
|
||||
<el-input v-model="formInline.id" placeholder="用户ID" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="姓名" prop="userName">
|
||||
<el-input v-model="formInline.userName" placeholder="用户姓名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="账号" prop="accountNumber">
|
||||
<el-input v-model="formInline.accountNumber" placeholder="用户账号" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="phoneNumber">
|
||||
<el-input v-model="formInline.phoneNumber" placeholder="用户手机号" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="sex">
|
||||
<el-select v-model="formInline.sex" placeholder="请选择" clearable>
|
||||
<el-option label="男" value="1" />
|
||||
<el-option label="女" value="2" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户状态" prop="userStatus">
|
||||
<el-select v-model="formInline.userStatus" placeholder="请选择" clearable>
|
||||
<el-option label="异常" value="0" />
|
||||
<el-option label="正常" value="1" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户分类" prop="userCategory">
|
||||
<el-select v-model="formInline.userCategory" placeholder="请选择" clearable>
|
||||
<el-option label="活跃/低消费" value="1" />
|
||||
<el-option label="活跃/中消费" value="2" />
|
||||
<el-option label="活跃/高消费" value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="客单价" prop="unitPrice">
|
||||
<el-select v-model="formInline.unitPrice" placeholder="请选择" clearable>
|
||||
<el-option label="≤500" value="1" />
|
||||
<el-option label="≤1000" value="2" />
|
||||
<el-option label="≤1500" value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="订单数目" prop="ordersNums">
|
||||
<el-select v-model="formInline.ordersNums" placeholder="请选择" clearable>
|
||||
<el-option label="≤500" value="1" />
|
||||
<el-option label="≤1000" value="2" />
|
||||
<el-option label="≤1500" value="3" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请日期" prop="startDate" style="margin-right: 0">
|
||||
<el-date-picker v-model="formInline.startDate" type="date" value-format="YYYY-MM-DD"
|
||||
placeholder="请选择起始日期" clearable :disabled-date="disableStartDate" style="width: 160px" />
|
||||
<span style="width: 30px; text-align: center; display: inline-block">
|
||||
-
|
||||
</span>
|
||||
<el-date-picker v-model="formInline.endDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择截止日期"
|
||||
clearable :disabled-date="disableEndDate" style="width: 160px" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="search-bar-right">
|
||||
<el-button type="primary" class="el-button-gry" icon="Search" @click="onSubmit">查询</el-button>
|
||||
<el-button icon="Refresh" style="margin: 16px 0 0 0" @click="resetForm">重置</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
|
||||
<tableComponent :table-data="tableData" :columns="columns" :show-border="false" :show-selection="false"
|
||||
:header-cell-class-name="getHeaderClass" @page-change="handlePaginationChange"
|
||||
@selection-change="handleSelectionChange" :total="tableTotal" :current-page="formInline.current"
|
||||
:page-size="formInline.size">
|
||||
<!-- 自定义-状态 -->
|
||||
<template #userStatus="slotProps">
|
||||
<span v-if="slotProps.row.userStatus == 1" class="color-green">正常</span>
|
||||
<span v-else-if="slotProps.row.userStatus == 0" class="color-red">异常</span>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button text class="el-button-custom" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||
<el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import Mock from "mockjs";
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const iconSize = "16px";
|
||||
|
||||
const formInline = reactive({
|
||||
id: "",
|
||||
nickname: "",
|
||||
userName: "",
|
||||
accountNumber: "",
|
||||
phoneNumber: "",
|
||||
sex: "",
|
||||
userStatus: "",
|
||||
userCategory: "",
|
||||
unitPrice: "",
|
||||
ordersNums: "",
|
||||
startDate: "",
|
||||
endDate: "",
|
||||
current: 1,
|
||||
size: 10,
|
||||
});
|
||||
|
||||
// 禁用开始日期的逻辑（不能晚于已选的结束日期）
|
||||
const disableStartDate = (time) => {
|
||||
if (!formInline.endDate) return false;
|
||||
const endDate = new Date(formInline.endDate);
|
||||
return time.getTime() > endDate.getTime();
|
||||
};
|
||||
|
||||
// 禁用结束日期的逻辑（不能早于已选的开始日期）
|
||||
const disableEndDate = (time) => {
|
||||
if (!formInline.startDate) return false;
|
||||
const startDate = new Date(formInline.startDate).setHours(0, 0, 0, 0);
|
||||
const currentDate = new Date(time).setHours(0, 0, 0, 0);
|
||||
return currentDate < startDate;
|
||||
};
|
||||
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期！");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期！");
|
||||
return;
|
||||
}
|
||||
console.log( formInline);
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
searchForm.value.resetFields();
|
||||
formInline.endDate = "";
|
||||
};
|
||||
|
||||
// 表格数据
|
||||
const tableData = ref([]);
|
||||
const tableLoading = ref(false);
|
||||
const tableTotal = ref(0);
|
||||
let nowClickRow = ref({});
|
||||
// 列配置
|
||||
const columns = ref([
|
||||
{ prop: "id", label: "ID" },
|
||||
{ prop: "nickname", label: "昵称", width: "120" },
|
||||
{ prop: "userName", label: "姓名" },
|
||||
{ prop: "accountNumber", label: "账号" },
|
||||
{ prop: "phoneNumber", label: "手机号", width: "120" },
|
||||
{ prop: "sex", label: "性别" },
|
||||
{ prop: "userStatus", label: "用户状态", slotName: "userStatus" },
|
||||
{ prop: "userCategory", label: "用户分类" },
|
||||
{ prop: "unitPrice", label: "客单价" },
|
||||
{ prop: "ordersNums", label: "订单数目" },
|
||||
{ prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
|
||||
]);
|
||||
|
||||
// 生成食物主题昵称
|
||||
const generateFoodNickname = () => {
|
||||
// 形容词（情绪/风格）
|
||||
const adjectives = [
|
||||
"暴躁的",
|
||||
"快乐的",
|
||||
"忧郁的",
|
||||
"疯狂的",
|
||||
"安静的",
|
||||
"慵懒的",
|
||||
"甜甜的",
|
||||
"咸咸的",
|
||||
"酸酸的",
|
||||
"辣辣的",
|
||||
];
|
||||
|
||||
// 食物名词（仅限食物）
|
||||
const foods = [
|
||||
"辣椒",
|
||||
"西瓜",
|
||||
"土豆",
|
||||
"番茄",
|
||||
"黄瓜",
|
||||
"苹果",
|
||||
"蛋糕",
|
||||
"面包",
|
||||
"披萨",
|
||||
"冰淇淋",
|
||||
"奶茶",
|
||||
"咖啡",
|
||||
"啤酒",
|
||||
"炸鸡",
|
||||
];
|
||||
|
||||
// 随机组合：形容词 + 食物
|
||||
return Mock.mock(`@pick(${adjectives})`) + Mock.mock(`@pick(${foods})`);
|
||||
};
|
||||
// 生成模拟数据
|
||||
const generateMockData = () => {
|
||||
return Mock.mock({
|
||||
"list|10": [
|
||||
{
|
||||
"id|+1": 10000,
|
||||
nickname: () => generateFoodNickname(), //昵称
|
||||
userName: "@cname", //姓名
|
||||
accountNumber: Mock.mock("@id").toString().slice(0, 10), //账号
|
||||
phoneNumber: "@integer(13000000000, 18999999999)", //手机号
|
||||
sex: '@pick(["男", "女"])', //性别
|
||||
"userStatus|1": [0, 1], //0异常 1正常
|
||||
"userCategory|1":
|
||||
'@pick(["活跃/低消费", "活跃/中消费", "活跃/高消费"])', //用户分类
|
||||
unitPrice: "@float(10, 200, 2, 2)", //客单价
|
||||
ordersNums: "@integer(10, 200)",
|
||||
},
|
||||
],
|
||||
}).list;
|
||||
};
|
||||
// 加载数据
|
||||
const loadData = async () => {
|
||||
// 模拟API请求延迟
|
||||
setTimeout(() => {
|
||||
tableData.value = generateMockData();
|
||||
tableTotal.value = tableData.value.length;
|
||||
}, 500);
|
||||
// try {
|
||||
// let response = await getGoodManageInfo(formInline);
|
||||
// console.log(response);
|
||||
// if (response.code == 200) {
|
||||
// tableData.value = response.data.records;
|
||||
// tableTotal.value = response.data.total;
|
||||
// }
|
||||
// } catch (error) {
|
||||
// console.log(error);
|
||||
// }
|
||||
};
|
||||
// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
|
||||
const getHeaderClass = ({ column }) => {
|
||||
return "custom-header";
|
||||
};
|
||||
// 分页变化
|
||||
const handlePaginationChange = ({ page, pageSize }) => {
|
||||
console.log("分页变化:", page, pageSize);
|
||||
// 这里可以调用API获取新数据
|
||||
loadData();
|
||||
};
|
||||
// 多选框变化
|
||||
const handleSelectionChange = (selection) => {
|
||||
console.log("选中项:", selection);
|
||||
};
|
||||
|
||||
// 查看详情
|
||||
const seeDetails = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要查看详情的行:", row);
|
||||
};
|
||||
// 编辑操作
|
||||
const handleEdit = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要编辑的行:", row);
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要编辑的行:", row);
|
||||
};
|
||||
|
||||
|
||||
const titleRef = ref(null);
|
||||
const searchBarRef = ref(null);
|
||||
const tableViewportHeight = ref(0);
|
||||
// 精确计算可用高度
|
||||
const calculateTableHeight = () => {
|
||||
// 获取窗口总高度
|
||||
const windowHeight = window.innerHeight;
|
||||
|
||||
// 获取各组件高度
|
||||
const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
|
||||
const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
|
||||
|
||||
// 计算容器内边距补偿（根据实际样式调整）
|
||||
const paddingCompensation = 130;
|
||||
|
||||
// 最终计算
|
||||
tableViewportHeight.value =
|
||||
windowHeight - headerHeight - searchBarHeight - paddingCompensation;
|
||||
// console.log(tableViewportHeight.value);
|
||||
};
|
||||
// 组件挂载时加载数据
|
||||
onMounted(() => {
|
||||
loadData();
|
||||
|
||||
calculateTableHeight();
|
||||
|
||||
// 添加响应式监听
|
||||
window.addEventListener("resize", calculateTableHeight);
|
||||
|
||||
// 监听DOM变化（适用于动态变化的header/searchbar）
|
||||
const observer = new ResizeObserver(calculateTableHeight);
|
||||
if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
|
||||
if (searchBarRef.value) observer.observe(searchBarRef.value);
|
||||
});
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener("resize", calculateTableHeight);
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
@ -2,25 +2,22 @@
|
||||
<div class="app-container home">
|
||||
<el-row :gutter="20">
|
||||
<el-col :sm="24" :lg="16" style="padding-left: 20px">
|
||||
<h2>农业产业运营云平台 - 后台管理系统</h2>
|
||||
<p>
|
||||
是为农业产业园运营单位打造的一体化智能管理平台，旨在提升园区运营效率、优化业务流程、保障数据安全，实现运营服务的数字化、规范化和透明化。
|
||||
</p>
|
||||
<b>
|
||||
核心功能
|
||||
</b>
|
||||
<h2>农业产业政务云平台 - 后台管理系统</h2>
|
||||
<p>
|
||||
✅ 权限分级管理：支持多角色（如超级管理员、部门管理员、审核员）精细化权限控制，确保数据安全与操作合规。<br>
|
||||
✅ 业务协同办理：集成工单流转、事项审批、数据填报等功能，实现跨域高效协作。<br>
|
||||
✅ 数据可视化分析：动态展示园区服务、财政支出等关键指标，辅助园区管理决策。<br>
|
||||
✅ 安全审计追溯：操作日志全记录，支持敏感行为预警与责任追溯，符合等保要求。<br>
|
||||
✅ 移动端适配：支持PC端与移动端同步操作，满足园区运营事务处理需求。
|
||||
|
||||
是为县域监管部门打造的一体化智能管理平台，旨在提升农业政务监管效率、优化业务流程、保障数据安全，实现农业产业监管的数字化、规范化和透明化。
|
||||
</p>
|
||||
<b> 核心功能 </b>
|
||||
<p>
|
||||
✅ 权限分级管理：支持多角色（如超级管理员、部门管理员、审核员）精细化权限控制，确保数据安全与操作合规。<br />
|
||||
✅ 业务协同办理：集成工单流转、事项审批、数据填报等功能，实现跨域高效协作。<br />
|
||||
✅ 数据可视化分析：动态展示农资监管、农产品溯源等关键要素，辅助监管部门管理决策。<br />
|
||||
✅ 安全审计追溯：操作日志全记录，支持敏感行为预警与责任追溯，符合等保要求。<br />
|
||||
✅ 移动端适配：支持PC端与移动端同步操作，满足农业监管事务处理需求。
|
||||
</p>
|
||||
<b>系统价值</b>
|
||||
<p>
|
||||
🔹 提效减负：自动化流程减少人工干预，缩短办事周期。<br>
|
||||
🔹 阳光政务：全流程电子化留痕，增强公众监督与信任。<br>
|
||||
🔹 提效减负：自动化流程减少人工干预，缩短办事周期。<br />
|
||||
🔹 阳光政务：全流程电子化留痕，增强公众监督与信任。<br />
|
||||
🔹 资源整合：打破信息孤岛，实现跨系统数据互通共享。
|
||||
</p>
|
||||
<p>
|
||||
@ -79,7 +76,7 @@
|
||||
>http://47.109.205.240/platform</el-link
|
||||
>
|
||||
</p>
|
||||
<div style="height: 200px;"></div>
|
||||
<div style="height: 200px"></div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@ -266,22 +263,22 @@
|
||||
<span>客户端</span>
|
||||
</div>
|
||||
</template>
|
||||
<!-- <div class="body" v-if="state.user.userName == 'super'">
|
||||
<div class="body">
|
||||
<img
|
||||
src="@/assets/images/MXd3uUrO.png"
|
||||
alt="donate"
|
||||
style="width: 196px"
|
||||
/>
|
||||
<p style="width: 200px; text-align: center">政务云APP客户端</p>
|
||||
</div> -->
|
||||
<div class="body">
|
||||
</div>
|
||||
<!-- <div class="body" v-else>
|
||||
<img
|
||||
src="@/assets/images/4SVVtpob.png"
|
||||
alt="donate"
|
||||
style="width: 196px"
|
||||
/>
|
||||
<p style="width: 200px; text-align: center">运营云APP客户端</p>
|
||||
</div>
|
||||
</div> -->
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -292,21 +289,21 @@
|
||||
const version = ref("4.0.1");
|
||||
|
||||
// 获取用户这里用于临时根据账户判断角色，显示不同客户端app下载图片【没其他用途】
|
||||
import { getUserProfile } from "@/api/system/user"
|
||||
import { getUserProfile } from "@/api/system/user";
|
||||
const state = reactive({
|
||||
user: {},
|
||||
roleGroup: {},
|
||||
postGroup: {}
|
||||
})
|
||||
postGroup: {},
|
||||
});
|
||||
function getUser() {
|
||||
getUserProfile().then(response => {
|
||||
state.user = response.data
|
||||
state.roleGroup = response.roleGroup
|
||||
state.postGroup = response.postGroup
|
||||
console.log(state.user) // 获取用户信息
|
||||
})
|
||||
getUserProfile().then((response) => {
|
||||
state.user = response.data;
|
||||
state.roleGroup = response.roleGroup;
|
||||
state.postGroup = response.postGroup;
|
||||
console.log(state.user); // 获取用户信息
|
||||
});
|
||||
}
|
||||
getUser()
|
||||
getUser();
|
||||
|
||||
function goTarget(url) {
|
||||
window.open(url, "__blank");
|
||||
|
||||
48
src/views/region/index.vue
Normal file
48
src/views/region/index.vue
Normal file
@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div ref="buttonRef">
|
||||
<!-- 按钮组 -->
|
||||
<el-button icon="Sort" type="primary">{{ btnText }}</el-button>
|
||||
</div>
|
||||
<div class="table-cont">
|
||||
<el-table :data="tableData" style="width: 100%" row-key="id" border lazy v-loading="loading"
|
||||
:tree-props="{ children: 'areaChildVOS' }" default-expand-all>
|
||||
<el-table-column prop="areaName" label="区域名称" />
|
||||
<el-table-column prop="areaCode" label="区域代码" />
|
||||
<el-table-column prop="level" label="区域级别" />
|
||||
<el-table-column prop="operate" label="操作" slotName="operate">
|
||||
<template #default="slotProps">
|
||||
<el-button text type="success">新增</el-button>
|
||||
<el-button text type="success" v-if="slotProps.row.areaCode != 530000">编辑</el-button>
|
||||
<el-button text type="danger" v-if="slotProps.row.areaCode != 530000">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, onMounted } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { getRegion } from "@/api/common";
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const { params, query } = route
|
||||
|
||||
let btnText = ref('展开全部');
|
||||
|
||||
const tableData = ref([]);
|
||||
let loading = ref(false);
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
if (res.code === 200) {
|
||||
tableData.value = res.data;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getArea();
|
||||
});
|
||||
</script>
|
||||
<style scope></style>
|
||||
@ -33,9 +33,9 @@ export default defineConfig(({ mode, command }) => {
|
||||
chunkSizeWarningLimit: 2000,
|
||||
rollupOptions: {
|
||||
output: {
|
||||
chunkFileNames: "static/js/[name]-[hash].js",
|
||||
entryFileNames: "static/js/[name]-[hash].js",
|
||||
assetFileNames: "static/[ext]/[name]-[hash].[ext]",
|
||||
chunkFileNames: `static/js/[name]-${Date.now()}-[hash].js`,
|
||||
entryFileNames: `static/js/[name]-${Date.now()}-[hash].js`,
|
||||
assetFileNames: `static/[ext]/[name]-${Date.now()}-[hash].[ext]`,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user