This commit is contained in:
余同学 2024-12-05 19:57:56 +08:00
parent b168ef73b2
commit a40bf2970e
9 changed files with 332 additions and 244 deletions

View File

@ -4,77 +4,107 @@
* 建议:
* 1. 代码中路由统一使用name属性跳转(不使用path属性)
*/
import Vue from 'vue'
import Router from 'vue-router'
import http from '@/utils/httpRequest'
import { isURL } from '@/utils/validate'
import { clearLoginInfo } from '@/utils'
import Vue from "vue";
import Router from "vue-router";
import http from "@/utils/httpRequest";
import { isURL } from "@/utils/validate";
import { clearLoginInfo } from "@/utils";
import FULL_ROUTERS from "./full-routers";
import $api from "@/api/index.js"
import { Loading } from 'element-ui';
import $api from "@/api/index.js";
import store from "@/store";
import { Loading } from "element-ui";
Vue.use(Router)
Vue.use(Router);
// 开发环境不使用懒加载, 因为懒加载页面太多的话会造成webpack热更新太慢, 所以只有生产环境使用懒加载
const _import = require('./import-' + process.env.NODE_ENV)
const _import = require("./import-" + process.env.NODE_ENV);
// 全局路由(无需嵌套上左右整体布局)
const globalRoutes = [
{ path: '/404', component: _import('common/404'), name: '404', meta: { title: '404未找到' } },
{ path: '/login', component: _import('common/login'), name: 'login', meta: { title: '登录' } },
{
path: "/404",
component: _import("common/404"),
name: "404",
meta: { title: "404未找到" },
},
{
path: "/login",
component: _import("common/login"),
name: "login",
meta: { title: "登录" },
},
//test用会员管理
]
];
// 主入口路由(需嵌套上左右整体布局)
const mainRoutes = {
path: '/',
component: _import('main'),
name: 'main',
redirect: { name: 'home' },
meta: { title: '主入口整体布局' },
path: "/",
component: _import("main"),
name: "main",
redirect: { name: "home" },
meta: { title: "主入口整体布局" },
children: [
// 通过meta对象设置路由展示方式
// 1. isTab: 是否通过tab展示内容, true: 是, false: 否
// 2. iframeUrl: 是否通过iframe嵌套展示内容, '以http[s]://开头': 是, '': 否
// 提示: 如需要通过iframe嵌套展示内容, 但不通过tab打开, 请自行创建组件使用iframe处理!
{ path: '/home', component: _import('common/home'), name: 'home', meta: { title: '首页' } },
{ path: '/theme', component: _import('common/theme'), name: 'theme', meta: { title: '主题' } },
{ path: '/demo-echarts', component: _import('demo/echarts'), name: 'demo-echarts', meta: { title: 'demo-echarts', isTab: true } }
{
path: "/home",
component: _import("common/home"),
name: "home",
meta: { title: "首页" },
},
{
path: "/theme",
component: _import("common/theme"),
name: "theme",
meta: { title: "主题" },
},
{
path: "/demo-echarts",
component: _import("demo/echarts"),
name: "demo-echarts",
meta: { title: "demo-echarts", isTab: true },
},
],
beforeEnter(to, from, next) {
let token = Vue.cookie.get('token')
let token = Vue.cookie.get("token");
if (!token || !/\S/.test(token)) {
clearLoginInfo()
next({ name: 'login' })
clearLoginInfo();
next({ name: "login" });
}
next()
}
}
next();
},
};
const router = new Router({
mode: 'hash',
mode: "hash",
// mode:"history",
scrollBehavior: () => ({ y: 0 }),
isAddDynamicMenuRoutes: false, // 是否已经添加动态(菜单)路由
routes: globalRoutes.concat(mainRoutes)
})
routes: globalRoutes.concat(mainRoutes),
});
router.beforeEach((to, from, next) => {
console.log("beforeEach");
// 添加动态(菜单)路由
// 1. 已经添加 or 全局路由, 直接访问
// 2. 获取菜单列表, 添加并保存本地存储
if (router.options.isAddDynamicMenuRoutes || fnCurrentRouteType(to, globalRoutes) === 'global') {
next()
if (
router.options.isAddDynamicMenuRoutes ||
fnCurrentRouteType(to, globalRoutes) === "global"
) {
next();
} else {
let loadingInstance = Loading.service({
text:"正在初始化中...",
background:'rgba(255,255,255,0.7)'
text: "正在初始化中...",
background: "rgba(255,255,255,0.7)",
});
$api.getUserInfo()
$api
.getUserInfo()
.then(({ data }) => {
const filterTreeData=(data, permissions) =>{
return data;//临时性返回所有菜单方便调试
const filterTreeData = (data, permissions) => {
return data; //临时性返回所有菜单方便调试
return data.reduce((filtered, node) => {
// 如果节点的权限在权限数组中
if (permissions.includes(node.url)) {
@ -83,32 +113,74 @@ router.beforeEach((to, from, next) => {
// 创建一个新的节点,包含过滤后的子节点
filtered.push({
...node,
list
list,
});
}
return filtered;
}, []);
}
};
console.log(data);
if (data.data.markets?.length > 0) {
// 存在多个市场
$api.mer_admin
.storeList({ marketId: data.data.markets[0].marketId })
.then((res) => {
store.commit("userData/setState", {
isMerchant: true,
marketList: data.data.markets,
storeList: res.data.data,
marketId: data.data.markets[0].marketId,
shopId: res.data.data[0].shopId,
});
});
console.log(data.data.markets);
} else if (data.data.shopId) {
// 存在单个店铺
store.commit("userData/setState", {
isMerchant: true,
marketList: [],
storeList: [],
marketId: "",
shopId: data.data.shopId,
});
} else {
// 不存在店铺
store.commit("userData/setState", {
isMerchant: false,
marketList: [],
storeList: [],
marketId: "",
shopId: "",
});
}
sessionStorage.setItem("userInfo", JSON.stringify(data.data));
sessionStorage.setItem('permissions', JSON.stringify(data.data.permissions || '[]'))
sessionStorage.setItem(
"permissions",
JSON.stringify(data.data.permissions || "[]")
);
//添加全量菜单,根据权限进行过滤
let _menu=filterTreeData(FULL_ROUTERS.menuList, data.data.permissions);
fnAddDynamicMenuRoutes(_menu)
sessionStorage.setItem('menuList', JSON.stringify(_menu))
router.options.isAddDynamicMenuRoutes = true
next({ ...to, replace: true })
let _menu = filterTreeData(
FULL_ROUTERS.menuList,
data.data.permissions
);
fnAddDynamicMenuRoutes(_menu);
sessionStorage.setItem("menuList", JSON.stringify(_menu));
router.options.isAddDynamicMenuRoutes = true;
next({ ...to, replace: true });
})
.catch((e) => {
sessionStorage.setItem('menuList', '[]')
sessionStorage.setItem('permissions', '[]')
console.log(`%c${e} 请求菜单列表和权限失败,跳转至登录页!!`, 'color:blue')
router.push({ name: 'login' })
next()
sessionStorage.setItem("menuList", "[]");
sessionStorage.setItem("permissions", "[]");
console.log(
`%c${e} 请求菜单列表和权限失败,跳转至登录页!!`,
"color:blue"
);
router.push({ name: "login" });
next();
})
.finally(()=>{
.finally(() => {
loadingInstance.close();
})
});
// http({
// url: '/sys/menu/nav',
// method: 'get',
@ -128,22 +200,25 @@ router.beforeEach((to, from, next) => {
// router.push({ name: 'login' })
// })
}
})
});
/**
* 判断当前路由类型, global: 全局路由, main: 主入口路由
* @param {*} route 当前路由
*/
function fnCurrentRouteType(route, globalRoutes = []) {
var temp = []
var temp = [];
for (var i = 0; i < globalRoutes.length; i++) {
if (route.path === globalRoutes[i].path) {
return 'global'
} else if (globalRoutes[i].children && globalRoutes[i].children.length >= 1) {
temp = temp.concat(globalRoutes[i].children)
return "global";
} else if (
globalRoutes[i].children &&
globalRoutes[i].children.length >= 1
) {
temp = temp.concat(globalRoutes[i].children);
}
}
return temp.length >= 1 ? fnCurrentRouteType(route, temp) : 'main'
return temp.length >= 1 ? fnCurrentRouteType(route, temp) : "main";
}
/**
@ -152,53 +227,59 @@ function fnCurrentRouteType(route, globalRoutes = []) {
* @param {*} routes 递归创建的动态(菜单)路由
*/
function fnAddDynamicMenuRoutes(menuList = [], routes = []) {
var temp = []
var temp = [];
for (var i = 0; i < menuList.length; i++) {
if (menuList[i].list && menuList[i].list.length >= 1) {
temp = temp.concat(menuList[i].list)
temp = temp.concat(menuList[i].list);
} else if (menuList[i].url && /\S/.test(menuList[i].url)) {
menuList[i].url = menuList[i].url.replace(/^\//, '')
menuList[i].url = menuList[i].url.replace(/^\//, "");
var route = {
path: menuList[i].url.replace('/', '-'),
path: menuList[i].url.replace("/", "-"),
component: null,
name: menuList[i].url.replace('/', '-'),
name: menuList[i].url.replace("/", "-"),
meta: {
menuId: menuList[i].menuId,
title: menuList[i].name,
isDynamic: true,
isTab: true,
iframeUrl: '',
isMicroApp:menuList[i].isMicroApp
}
}
iframeUrl: "",
isMicroApp: menuList[i].isMicroApp,
},
};
// url以http[s]://开头, 通过iframe展示,或者启用microApp框架
if (isURL(menuList[i].url)) {
route['path'] = `i-${menuList[i].menuId}`
route['name'] = `i-${menuList[i].menuId}`
route['meta']['iframeUrl'] = menuList[i].url
route["path"] = `i-${menuList[i].menuId}`;
route["name"] = `i-${menuList[i].menuId}`;
route["meta"]["iframeUrl"] = menuList[i].url;
} else {
try {
route['component'] = _import(`modules/${menuList[i].url}`) || null
} catch (e) { }
route["component"] = _import(`modules/${menuList[i].url}`) || null;
} catch (e) {}
}
routes.push(route)
routes.push(route);
}
}
if (temp.length >= 1) {
fnAddDynamicMenuRoutes(temp, routes)
fnAddDynamicMenuRoutes(temp, routes);
} else {
mainRoutes.name = 'main-dynamic'
mainRoutes.children = routes
router.addRoutes([
mainRoutes,
{ path: '*', redirect: { name: '404' } }
])
sessionStorage.setItem('dynamicMenuRoutes', JSON.stringify(mainRoutes.children || '[]'))
console.log('\n')
console.log('%c!<-------------------- 动态(菜单)路由 s -------------------->', 'color:blue')
console.log(mainRoutes.children)
console.log('%c!<-------------------- 动态(菜单)路由 e -------------------->', 'color:blue')
mainRoutes.name = "main-dynamic";
mainRoutes.children = routes;
router.addRoutes([mainRoutes, { path: "*", redirect: { name: "404" } }]);
sessionStorage.setItem(
"dynamicMenuRoutes",
JSON.stringify(mainRoutes.children || "[]")
);
console.log("\n");
console.log(
"%c!<-------------------- 动态(菜单)路由 s -------------------->",
"color:blue"
);
console.log(mainRoutes.children);
console.log(
"%c!<-------------------- 动态(菜单)路由 e -------------------->",
"color:blue"
);
}
}
export default router
export default router;

View File

@ -1,23 +1,25 @@
import Vue from 'vue'
import Vuex from 'vuex'
import cloneDeep from 'lodash/cloneDeep'
import common from './modules/common'
import user from './modules/user'
import Vue from "vue";
import Vuex from "vuex";
import cloneDeep from "lodash/cloneDeep";
import common from "./modules/common";
import user from "./modules/user";
import userData from "./modules/userData";
Vue.use(Vuex)
Vue.use(Vuex);
export default new Vuex.Store({
modules: {
common,
user
user,
userData,
},
mutations: {
// 重置vuex本地储存状态
resetStore (state) {
resetStore(state) {
Object.keys(state).forEach((key) => {
state[key] = cloneDeep(window.SITE_CONFIG['storeState'][key])
})
}
state[key] = cloneDeep(window.SITE_CONFIG["storeState"][key]);
});
},
strict: process.env.NODE_ENV !== 'production'
})
},
strict: process.env.NODE_ENV !== "production",
});

View File

@ -0,0 +1,30 @@
const state = {
isMerchant: false, //是否是经营者还是摊铺 不是就是为false
marketList: [], //经营的市场
storeList: [], //经营的店铺
marketId: "",
shopId: "",
};
// actions
const actions = {};
// mutations
const mutations = {
setState(state, data) {
console.log(data, "传过来的数据");
state.isMerchant = data.isMerchant;
state.marketList = data.marketList;
state.storeList = data.storeList;
state.marketId = data.marketId;
state.shopId = data.shopId;
},
};
export default {
namespaced: true,
state,
mutations,
actions,
};

View File

@ -1,5 +1,5 @@
<template>
<div style="height: calc(100vh - 200px)">
<div v-if="isMerchant" style="height: calc(100vh - 200px)">
<obj-table-plus
ref="oTable"
style="height: 100%"
@ -11,7 +11,12 @@
:enableAutoQuery="false"
>
<template slot="tableTop">
<el-form v-if="marketList.length > 0" :inline="true" :model="formInline" class="demo-form-inline">
<el-form
v-if="marketList.length > 0"
:inline="true"
:model="formInline"
class="demo-form-inline"
>
<el-form-item label="菜市场">
<el-select
@change="getData"
@ -88,6 +93,7 @@
</template>
<script>
import { mapState } from "vuex";
import AddOrUpdate from "./popup/add-or-update.vue";
// import viewDetails from "./popup/view-details.vue";
export default {
@ -108,43 +114,30 @@ export default {
},
productFilterType: "SALE",
selectList: [],
isShopId: false,
marketList: [],
storeList: [],
};
},
created() {
if (JSON.parse(sessionStorage.getItem("userInfo")).markets?.length > 0) {
this.isShopId = true;
this.formInline.marketId = JSON.parse(
sessionStorage.getItem("userInfo")
).markets[0].marketId;
this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
console.log(this.marketList);
this.getData();
} else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
(this.formInline.shopId = JSON.parse(
sessionStorage.getItem("userInfo")
).shopId),
(this.isShopId = true);
this.formInline = {
name: "",
marketId: this.marketId,
shopId: this.shopId,
};
this.$nextTick(() => {
this.$refs.oTable.reload();
});
} else {
this.isShopId = false;
}
},
methods: {
getData() {
this.$api.mer_admin
.storeList({ marketId: this.formInline.marketId })
.then((res) => {
this.storeList = res.data.data;
this.formInline.shopId = res.data.data[0].shopId;
this.$nextTick(() => {
this.$refs.oTable.reload();
});
});
// this.$api.mer_admin
// .storeList({ marketId: this.formInline.marketId })
// .then((res) => {
// this.storeList = res.data.data;
// this.formInline.shopId = res.data.data[0].shopId;
// this.$nextTick(() => {
// this.$refs.oTable.reload();
// });
// });
},
addProduct(row) {
this.$refs.addOrUpdate.toggle().add({
@ -324,6 +317,13 @@ export default {
},
};
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
</script>

View File

@ -1,6 +1,6 @@
<template>
<div>
<div v-if="shopId">
<div v-if="isMerchant">
<obj-table-plus
style="height: calc(100vh - 132px)"
ref="oTable"
@ -8,6 +8,7 @@
:tableCols="tableCols"
v-model="dataList"
@query="queryList"
:enableAutoQuery="false"
>
<template slot="flexEmpty">
<el-empty description="暂无数据"></el-empty>
@ -52,6 +53,7 @@
</template>
<script>
import { mapState } from "vuex";
import addTemplate from "./popup/add-template.vue";
export default {
components: { addTemplate },
@ -62,26 +64,16 @@ export default {
name: "",
linkId: "",
},
shopId: "",
marketList: "",
};
},
created() {
if (JSON.parse(sessionStorage.getItem("userInfo")).markets?.length > 0) {
this.shopId = true;
this.searchForm.linkId = JSON.parse(
sessionStorage.getItem("userInfo")
).markets[0].marketId;
this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
console.log(this.marketList);
} else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
this.searchForm.linkId = JSON.parse(
sessionStorage.getItem("userInfo")
).shopId;
this.shopId = true;
} else {
this.shopId = false;
}
this.searchForm = {
name: "",
linkId: this.marketId ? this.marketId : this.shopId,
};
this.$nextTick(() => {
this.$refs.oTable.reload();
});
},
methods: {
queryList(pageNo, pageSize) {
@ -105,8 +97,7 @@ export default {
Reset() {
this.searchForm = {
name: "",
linkId: JSON.parse(sessionStorage.getItem("userInfo")).markets[0]
.marketId,
linkId: this.marketId ? this.marketId : this.shopId,
};
this.$refs.oTable.reload();
},
@ -330,6 +321,13 @@ export default {
},
];
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
</script>

View File

@ -13,7 +13,7 @@
</div>
</div>
<div>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<!-- <el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="单位类型:">
<el-select
v-model="formInline.unitType"
@ -35,7 +35,7 @@
<el-button @click="getData" type="primary">查询</el-button>
<el-button @click="getData" type="primary">导出</el-button>
</el-form-item>
</el-form>
</el-form> -->
</div>
<div class="tipsLevel">
<div>
@ -89,6 +89,7 @@
</template>
<script>
import { mapState } from "vuex";
export default {
data() {
return {
@ -98,53 +99,46 @@ export default {
marketId: "",
shopId: "",
},
isShopId: false,
marketList: [],
storeList: [],
};
},
created() {
if (JSON.parse(sessionStorage.getItem("userInfo")).markets.length > 0) {
this.isShopId = true;
this.formInline.marketId = JSON.parse(
sessionStorage.getItem("userInfo")
).markets[0].marketId;
this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
console.log(this.marketList);
this.getData();
} else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
(this.formInline.shopId = JSON.parse(
sessionStorage.getItem("userInfo")
).shopId),
(this.isShopId = true);
this.$nextTick(() => {
this.formInline = {
unitType: JSON.parse(sessionStorage.getItem("userInfo")).unitType,
marketId: this.marketId,
shopId: "",
};
this.getList();
});
} else {
this.isShopId = false;
}
},
methods: {
getData() {
this.$api.mer_admin
.storeList({ marketId: this.formInline.marketId })
.then((res) => {
this.storeList = res.data.data;
// getData() {
// this.$api.mer_admin
// .storeList({ marketId: this.formInline.marketId })
// .then((res) => {
// this.storeList = res.data.data;
// this.formInline.shopId = res.data.data[0].shopId;
this.$nextTick(() => {
this.getList();
});
});
},
// this.$nextTick(() => {
// this.getList();
// });
// });
// },
getList() {
this.$api.marketing.marketingLevelPage(this.formInline).then((res) => {
console.log(res);
this.list = res.data.data;
});
},
add() {},
confirmEvent() {},
cancelEvent() {},
},
computed: {
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
</script>

View File

@ -138,6 +138,7 @@
<script>
// import AddOrUpdate from "./popup/add-or-update.vue";
// import viewDetails from "./popup/view-details.vue";
import { mapState } from "vuex";
export default {
// components: { AddOrUpdate },
data() {
@ -157,33 +158,18 @@ export default {
},
productFilterType: "SALE",
selectList: [],
isShopId: false,
marketList: [],
storeList: [],
value1: [],
};
},
created() {
if (JSON.parse(sessionStorage.getItem("userInfo")).markets.length > 0) {
this.isShopId = true;
this.formInline.marketId = JSON.parse(
sessionStorage.getItem("userInfo")
).markets[0].marketId;
this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
this.formInline.unitType = JSON.parse(sessionStorage.getItem("userInfo")).unitType
console.log(this.marketList);
this.getData();
} else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
(this.formInline.shopId = JSON.parse(
sessionStorage.getItem("userInfo")
).shopId),
(this.isShopId = true);
this.formInline = {
unitType: JSON.parse(sessionStorage.getItem("userInfo")).unitType,
marketId: this.marketId,
shopId: "",
};
this.$nextTick(() => {
this.$refs.oTable.reload();
});
} else {
this.isShopId = false;
}
},
methods: {
getData() {
@ -315,6 +301,13 @@ export default {
},
};
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
</script>

View File

@ -515,19 +515,13 @@ export default {
<el-button size="mini" type="primary" onClick={priceAdjustment}>
查看
</el-button>
<el-button
v-show={row.advanceSellStatus != "2"}
size="mini"
type="primary"
onClick={edit}
>
<el-button size="mini" type="primary" onClick={edit}>
编辑
</el-button>
<el-button
v-show={
row.advanceSellStatus != "0" &&
row.advanceSellStatus != "2"
row.advanceSellStatus != "0" && row.advanceSellStatus != "2"
}
size="mini"
type="primary"

View File

@ -1,6 +1,6 @@
<template>
<div>
<div v-if="isShopId" style="height: calc(100vh - 200px)">
<div v-if="isMerchant" style="height: calc(100vh - 200px)">
<obj-table-plus
ref="oTable"
style="height: 100%"
@ -103,6 +103,7 @@
</template>
<script>
import { mapState } from "vuex";
import AddDiscount from "./popup/add-discount.vue";
import AddPrice from "./popup/add-price.vue";
import AddOrUpdate from "./popup/add-or-update.vue";
@ -118,7 +119,6 @@ export default {
marketId: "",
shopId: "",
},
marketList: [],
tableProp: {
"auto-resize": true,
border: true,
@ -128,37 +128,24 @@ export default {
},
productFilterType: "SALE",
selectList: [],
isShopId: "",
storeList: [],
};
},
created() {
if (JSON.parse(sessionStorage.getItem("userInfo")).markets?.length > 0) {
this.isShopId = true;
this.formInline.marketId = JSON.parse(
sessionStorage.getItem("userInfo")
).markets[0].marketId;
this.marketList = JSON.parse(sessionStorage.getItem("userInfo")).markets;
console.log(this.marketList);
this.getData();
} else if (JSON.parse(sessionStorage.getItem("userInfo")).shopId) {
(this.formInline.shopId = JSON.parse(
sessionStorage.getItem("userInfo")
).shopId),
(this.isShopId = true);
this.formInline = {
name: "",
marketId: this.marketId,
shopId: this.shopId,
};
this.$nextTick(() => {
this.$refs.oTable.reload();
});
} else {
this.isShopId = false;
}
},
methods: {
//
getData() {
this.$api.mer_admin
.storeList({ marketId: this.formInline.marketId })
.then((res) => {
this.storeList = res.data.data;
this.formInline.shopId = res.data.data[0].shopId;
this.$nextTick(() => {
this.$refs.oTable.reload();
@ -192,6 +179,8 @@ export default {
});
},
queryList(pageNo, pageSize) {
console.log(this.formInline);
this.$api.mer_admin
.getProductPage({
p: {
@ -217,8 +206,8 @@ export default {
Reset() {
this.formInline = {
name: "",
marketId: JSON.parse(sessionStorage.getItem("userInfo")).markets[0]
.marketId,
marketId: this.marketId,
shopId: this.shopId,
};
this.$refs.oTable.reload();
},
@ -427,6 +416,13 @@ export default {
},
};
},
...mapState("userData", [
"isMerchant",
"marketList",
"storeList",
"marketId",
"shopId",
]),
},
};
</script>