ソースを参照

模块结构调整完成

icssoa 4 年 前
コミット
453ef87983

+ 1 - 1
package.json

@@ -10,7 +10,7 @@
 	"dependencies": {
 		"axios": "^0.21.1",
 		"cl-admin": "^1.3.1",
-		"cl-admin-crud": "^1.4.0",
+		"cl-admin-crud": "^1.4.4",
 		"cl-admin-export": "^1.0.5",
 		"cl-admin-theme": "^0.0.3",
 		"clipboard": "^2.0.7",

+ 1 - 1
src/config/env.js

@@ -42,7 +42,7 @@ export const app = store.get("__app__") || {
 
 	theme: {
 		color: "", // 主题色
-		url: "http://192.168.199.148:5000/black/index.css" // 主题样式地址
+		url: "" // 主题样式地址
 	}
 };
 

+ 27 - 2
src/cool/modules/base/common/index.js

@@ -1,3 +1,4 @@
+import store from "@/store";
 import { iconfontUrl, app } from "@/config/env";
 import { createLink } from "../utils";
 import { colorPrimary } from "@/assets/css/common.scss";
@@ -18,9 +19,9 @@ if (iconfontUrl) {
 	createLink(iconfontUrl);
 }
 
-const requireAll = requireContext => requireContext.keys().map(requireContext);
 const req = require.context("@/icons/svg/", false, /\.svg$/);
-requireAll(req);
+
+req.keys().map(req);
 
 export function iconList() {
 	return req
@@ -30,3 +31,27 @@ export function iconList() {
 		.filter(e => e.includes("icon"))
 		.sort();
 }
+
+export const resize = () => {
+	if (document.body.clientWidth < 1000) {
+		store.commit("COLLAPSE_MENU", true);
+		store.commit("UPDATE_APP", {
+			conf: {
+				showAMenu: false
+			}
+		});
+	}
+	store.commit("SET_BROWSER");
+};
+
+window.onload = () => {
+	const observer = new MutationObserver(resize);
+
+	observer.observe(document.getElementById("app"), {
+		childList: true,
+		subtree: true
+	});
+
+	window.addEventListener("resize", resize);
+	resize();
+};

+ 4 - 1
src/cool/modules/base/components/menu/slider/index.js

@@ -48,7 +48,10 @@ export default {
 
 					if (e.type == 0) {
 						html = (
-							<el-submenu index={String(e.id)} key={e.id}>
+							<el-submenu
+								popper-class="cl-slider-menu__submenu"
+								index={String(e.id)}
+								key={e.id}>
 								<template slot="title">
 									<icon-svg name={e.icon}></icon-svg>
 									<span slot="title">{e.name}</span>

+ 18 - 14
src/cool/modules/base/components/menu/slider/index.scss

@@ -52,10 +52,24 @@
 	}
 }
 
-.el-menu {
-	&--vertical {
-		.el-submenu {
-			&__title {
+.cl-slider-menu__submenu {
+	background-color: #fff;
+
+	&.el-menu {
+		&--vertical {
+			.el-submenu {
+				&__title {
+					display: flex;
+					align-items: center;
+
+					.icon-svg {
+						font-size: 18px;
+						margin-right: 10px;
+					}
+				}
+			}
+
+			.el-menu-item {
 				display: flex;
 				align-items: center;
 
@@ -65,15 +79,5 @@
 				}
 			}
 		}
-
-		.el-menu-item {
-			display: flex;
-			align-items: center;
-
-			.icon-svg {
-				font-size: 18px;
-				margin-right: 10px;
-			}
-		}
 	}
 }

+ 2 - 2
src/cool/modules/base/index.js

@@ -5,8 +5,8 @@ import views from "./views";
 import store from "./store";
 import service from "./service";
 import directives, { checkPerm } from "./directives";
-import { iconList } from "./common";
+import { iconList, resize } from "./common";
 import "./static/css/index.scss";
 
-export { iconList, checkPerm };
+export { iconList, checkPerm, resize };
 export default { components, filters, pages, views, store, service, directives };

+ 0 - 3
src/cool/modules/base/store/app.js

@@ -1,9 +1,6 @@
 import { app } from "@/config/env";
 import { deepMerge, getBrowser } from "cl-admin/utils";
 import store from "store";
-import common from "@/assets/css/common.scss";
-
-console.log(common);
 
 export default {
 	state: {

+ 2 - 2
src/cool/modules/demo/views/demo.vue

@@ -158,7 +158,7 @@ export default {
 			font-size: 12px;
 
 			span {
-				background-color: #2f3447;
+				background-color: $color-primary;
 				color: #fff;
 				border-radius: 3px;
 				padding: 2px 5px;
@@ -190,7 +190,7 @@ export default {
 						position: absolute;
 						bottom: -2px;
 						left: 0;
-						background-color: #2f3447;
+						background-color: $color-primary;
 					}
 				}
 			}

+ 1 - 2
src/cool/modules/demo/views/upload.vue

@@ -47,8 +47,7 @@
 export default {
 	data() {
 		return {
-			urls:
-				"https://cool-admin.cn.utools.club/uploads//20210226/7102eec0-7787-11eb-9231-515715ba55d0.jpg"
+			urls: ""
 		};
 	},
 

+ 0 - 5
src/cool/modules/theme/components/index.js

@@ -1,5 +0,0 @@
-import Theme from "./theme";
-
-export default {
-	Theme
-};

+ 0 - 285
src/cool/modules/theme/components/theme.vue

@@ -1,285 +0,0 @@
-<template>
-	<div class="cl-theme">
-		<li @click="open">
-			<icon-svg :size="18" name="icon-theme"></icon-svg>
-		</li>
-
-		<!-- 系统设置 -->
-		<el-drawer title="系统设置" :visible.sync="drawer.visible" size="300px">
-			<div class="cl-theme__color is-card">
-				<p>主题</p>
-
-				<ul>
-					<el-tooltip
-						v-for="(item, name) in thems"
-						:key="name"
-						:content="item.label"
-						placement="top"
-					>
-						<li
-							:style="{
-								backgroundColor: item.color
-							}"
-							@click="setTheme(item)"
-						>
-							<i class="el-icon-check" v-if="item.color == app.theme.color"></i>
-						</li>
-					</el-tooltip>
-				</ul>
-			</div>
-
-			<div class="cl-theme__switch is-card">
-				<p>内容区域</p>
-
-				<ul>
-					<li>
-						<span>显示一级菜单栏</span>
-						<el-switch size="mini" v-model="app.conf.showAMenu"></el-switch>
-					</li>
-					<li>
-						<span>显示路由导航栏</span>
-						<el-switch size="mini" v-model="app.conf.showRouteNav"></el-switch>
-					</li>
-					<li>
-						<span>显示页面进程栏</span>
-						<el-switch size="mini" v-model="app.conf.showProcess"></el-switch>
-					</li>
-				</ul>
-			</div>
-
-			<div class="cl-theme__tips">
-				<el-alert
-					type="warning"
-					:closable="false"
-					show-icon
-					title="手动修改配置文件可设置为默认主题、布局。"
-				></el-alert>
-
-				<el-button
-					round
-					type="primary"
-					size="small"
-					style="width: 100%"
-					:disabled="!app.theme.url"
-					@click="openDesc"
-					>修改说明</el-button
-				>
-			</div>
-		</el-drawer>
-
-		<!-- 修改说明 -->
-		<cl-dialog
-			:visible.sync="desc.visible"
-			title="修改说明"
-			width="800px"
-			:props="{
-				'append-to-body': true
-			}"
-		>
-			<ul class="cl-theme__desc">
-				<li>
-					<p class="cl-theme__desc-label">修改主题色:</p>
-					<cl-codemirror v-model="desc.color"></cl-codemirror>
-				</li>
-
-				<li>
-					<p class="cl-theme__desc-label">修改应用配置:</p>
-					<cl-codemirror v-model="desc.conf"></cl-codemirror>
-				</li>
-			</ul>
-		</cl-dialog>
-	</div>
-</template>
-
-<script>
-import { mapGetters } from "vuex";
-import { isDev } from "@/config/env";
-
-export default {
-	name: "cl-theme",
-
-	data() {
-		return {
-			drawer: {
-				visible: false
-			},
-			desc: {
-				visible: false,
-				color: "",
-				conf: ""
-			},
-			thems: [
-				{
-					label: "钴蓝(默认)",
-					name: "blue",
-					color: "#4165d7"
-				},
-				{
-					label: "极黑",
-					name: "black",
-					color: "#2f3447"
-				},
-				{
-					label: "果绿色",
-					name: "green",
-					color: "#51C21A"
-				},
-				{
-					label: "酱紫色",
-					name: "purple",
-					color: "#d0378d"
-				}
-			],
-			isDev
-		};
-	},
-
-	computed: {
-		...mapGetters(["app", "modules"])
-	},
-
-	watch: {
-		app: {
-			deep: true,
-			handler() {
-				this.$store.commit("UPDATE_APP", this.app);
-			}
-		}
-	},
-
-	methods: {
-		open() {
-			this.drawer.visible = true;
-		},
-
-		close() {
-			this.drawer.visible = false;
-		},
-
-		// 设置主题
-		setTheme({ name, color, label }) {
-			this.$message.success(`切换主题:${label}`);
-
-			const theme = document.getElementById("theme-style");
-			const style = theme || document.createElement("link");
-
-			style.href = `${this.modules.theme.options.sourceUrl || "/theme/"}${name}.css`;
-
-			if (!theme) {
-				style.type = "text/css";
-				style.rel = "stylesheet";
-				style.id = "theme-style";
-
-				document
-					.getElementsByTagName("head")
-					.item(0)
-					.appendChild(style);
-			}
-
-			// 设置主题色和路径
-			this.app.theme.color = color;
-			this.app.theme.url = style.href;
-
-			// 设置 css 变量
-			document.getElementsByTagName("body")[0].style.setProperty("--color-primary", color);
-		},
-
-		// 打开修改说明
-		openDesc() {
-			this.desc.visible = true;
-
-			this.desc.color = `
-				// src/assets/css/common.scss
-				$primary: ${this.app.theme.color};
-			`;
-
-			this.desc.conf = `
-				// src/config/env.js
-				export const app = {
-					conf: ${JSON.stringify(this.app.conf)},
-					thems: {
-						url: "${this.app.theme.url}"
-					}
-				}
-			`;
-		}
-	}
-};
-</script>
-
-<style lang="scss" scoped>
-.cl-theme {
-	.is-card {
-		padding: 20px 0;
-		margin: 0 20px 20px 20px;
-		border-bottom: 1px solid #f7f7f7;
-
-		& > p {
-			font-size: 15px;
-			font-weight: bold;
-			margin-bottom: 10px;
-		}
-	}
-
-	&__switch {
-		ul {
-			width: 100%;
-
-			li {
-				display: flex;
-				justify-content: space-between;
-				align-items: center;
-				height: 40px;
-				list-style: none;
-
-				span {
-					font-size: 13px;
-				}
-			}
-		}
-	}
-
-	&__color {
-		ul {
-			display: flex;
-			margin-top: 20px;
-
-			li {
-				list-style: none;
-				height: 20px;
-				width: 20px;
-				border-radius: 3px;
-				margin-right: 10px;
-				text-align: center;
-				color: #fff;
-				line-height: 20px;
-
-				&:hover {
-					opacity: 0.7;
-				}
-			}
-		}
-	}
-
-	&__tips {
-		padding: 10px 20px;
-
-		.el-button {
-			margin-top: 20px;
-		}
-	}
-
-	&__desc {
-		padding: 10px;
-
-		&-label {
-			margin-bottom: 10px;
-		}
-
-		li {
-			list-style: none;
-			margin-bottom: 20px;
-		}
-	}
-}
-</style>

+ 0 - 3
src/cool/modules/theme/index.js

@@ -1,3 +0,0 @@
-import components from "./components";
-
-export default { components };

+ 1 - 5
src/cool/modules/upload/components/index.vue

@@ -445,7 +445,7 @@ export default {
 						// 上传
 						this.$service.common
 							.request({
-								url: res._host || res.host,
+								url: res.host,
 								method: "POST",
 								headers: {
 									"Content-Type": "multipart/form-data"
@@ -478,10 +478,6 @@ export default {
 						this.$service.common
 							.upload()
 							.then(res => {
-								if (isDev) {
-									res._host = "@/oss-upload";
-								}
-
 								next(res);
 							})
 							.catch(reject);

+ 2 - 14
src/pages/layout/index.vue

@@ -41,27 +41,15 @@ export default {
 	},
 
 	computed: {
-		...mapGetters(["menuCollapse", "app", "browser"]),
+		...mapGetters(["menuCollapse", "app"]),
 
 		isKeepAlive() {
 			return isEmpty(this.$route.meta.keepAlive) ? true : this.$route.meta.keepAlive;
 		}
 	},
 
-	created() {
-		const resize = () => {
-			if (document.body.clientWidth < 1000) {
-				this.COLLAPSE_MENU(true);
-			}
-			this.SET_BROWSER();
-		};
-
-		window.addEventListener("resize", resize);
-		resize();
-	},
-
 	methods: {
-		...mapMutations(["COLLAPSE_MENU", "SET_BROWSER"])
+		...mapMutations(["COLLAPSE_MENU"])
 	}
 };
 </script>

+ 0 - 24
vue.config.js

@@ -12,30 +12,6 @@ const PROXY_LIST = {
 		}
 	},
 
-	"/ap": {
-		target: "https://admin.cool-js.cool",
-		changeOrigin: true,
-		pathRewrite: {
-			"^/ap": ""
-		}
-	},
-
-	"/fz": {
-		target: "http://xfz520231.utools.club",
-		changeOrigin: true,
-		pathRewrite: {
-			"^/fz": ""
-		}
-	},
-
-	"/oss-upload": {
-		target: "https://cool-admin-pro.oss-cn-shanghai.aliyuncs.com",
-		changeOrigin: true,
-		pathRewrite: {
-			"^/oss-upload": ""
-		}
-	},
-
 	"/pro": {
 		target: "https://show.cool-admin.com",
 		changeOrigin: true,