调整 useBaseStore 为 useBase

This commit is contained in:
icssoa 2022-06-01 22:26:54 +08:00
parent eaee792bf5
commit 55cbb1d7bb
26 changed files with 171 additions and 104 deletions

View File

@ -1,6 +1,6 @@
{ {
"name": "front-next", "name": "front-next",
"version": "5.2.3", "version": "5.2.4",
"scripts": { "scripts": {
"dev": "vite --host", "dev": "vite --host",
"build": "vite build", "build": "vite build",

View File

@ -20,9 +20,9 @@
<script lang="ts" setup> <script lang="ts" setup>
import { ElConfigProvider } from "element-plus"; import { ElConfigProvider } from "element-plus";
import zhCn from "element-plus/lib/locale/lang/zh-cn"; import zhCn from "element-plus/lib/locale/lang/zh-cn";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
const { app } = useBaseStore(); const { app } = useBase();
</script> </script>
<style lang="scss" src="./assets/css/index.scss"></style> <style lang="scss" src="./assets/css/index.scss"></style>

View File

@ -2,7 +2,7 @@ import { createPinia } from "pinia";
import { App } from "vue"; import { App } from "vue";
import { useModule } from "./module"; import { useModule } from "./module";
import { router, viewer } from "./router"; import { router, viewer } from "./router";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import mitt from "mitt"; import mitt from "mitt";
import VueECharts from "vue-echarts"; import VueECharts from "vue-echarts";
import ElementPlus from "element-plus"; import ElementPlus from "element-plus";
@ -23,7 +23,7 @@ export async function bootstrap(Vue: App) {
Vue.component("v-chart", VueECharts); Vue.component("v-chart", VueECharts);
// 基础 // 基础
const { app, user, menu } = useBaseStore(); const { app, user, menu } = useBase();
// 加载模块 // 加载模块
useModule(Vue); useModule(Vue);

View File

@ -8,7 +8,7 @@ import {
RouteRecordRaw RouteRecordRaw
} from "vue-router"; } from "vue-router";
import { storage, config } from "/@/cool"; import { storage, config } from "/@/cool";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import { cloneDeep, isArray } from "lodash"; import { cloneDeep, isArray } from "lodash";
// 视图文件 // 视图文件
@ -50,7 +50,7 @@ const router = createRouter({
// 路由守卫 // 路由守卫
router.beforeEach((to: any, _: any, next: NavigationGuardNext) => { router.beforeEach((to: any, _: any, next: NavigationGuardNext) => {
const { user, process } = useBaseStore(); const { user, process } = useBase();
if (user.token) { if (user.token) {
if (to.path.includes("/login")) { if (to.path.includes("/login")) {

View File

@ -4,7 +4,7 @@ import "nprogress/nprogress.css";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { isDev, config } from "/@/cool"; import { isDev, config } from "/@/cool";
import { storage } from "/@/cool/utils"; import { storage } from "/@/cool/utils";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import { router } from "../router"; import { router } from "../router";
axios.defaults.timeout = 30000; axios.defaults.timeout = 30000;
@ -26,7 +26,7 @@ axios.interceptors.request.eject(axios._req);
// @ts-ignore // @ts-ignore
axios._req = axios.interceptors.request.use( axios._req = axios.interceptors.request.use(
(req: any) => { (req: any) => {
const { user } = useBaseStore(); const { user } = useBase();
if (req.url) { if (req.url) {
// 请求进度条 // 请求进度条

View File

@ -1,8 +1,8 @@
import { useBaseStore } from "../store"; import { useStore } from "../store";
import { isObject } from "lodash"; import { isObject } from "lodash";
function parse(value: any) { function parse(value: any) {
const { menu } = useBaseStore(); const { menu } = useStore();
if (typeof value == "string") { if (typeof value == "string") {
return value ? menu.perms.some((e: any) => e.includes(value.replace(/\s/g, ""))) : false; return value ? menu.perms.some((e: any) => e.includes(value.replace(/\s/g, ""))) : false;

View File

@ -1,8 +1,8 @@
import { useEventListener } from "@vueuse/core"; import { useEventListener } from "@vueuse/core";
import { useBaseStore } from "../store"; import { useStore } from "../store";
function resize() { function resize() {
const { app } = useBaseStore(); const { app } = useStore();
app.setBrowser(); app.setBrowser();
app.isFold = app.browser.isMini; app.isFold = app.browser.isMini;
} }

View File

@ -0,0 +1,61 @@
<template>
<el-select v-model="value" @change="onChange" clearable>
<el-option
v-for="(item, index) in options"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</template>
<script lang="ts">
import { useCrud } from "@cool-vue/crud";
import { defineComponent, PropType, ref, watch } from "vue";
export default defineComponent({
name: "cl-select",
props: {
modelValue: [String, Number],
options: {
type: Array as PropType<Array<{ label: string; value: any }>>,
default: () => []
},
prop: String
},
emits: ["update:modelValue", "change"],
setup(props, { emit }) {
// cl-crud
const Crud = useCrud();
const value = ref();
//
function onChange(val: string) {
emit("update:modelValue", val);
emit("change", val);
if (props.prop) {
Crud.value?.refresh({ page: 1, [props.prop]: val === "" ? undefined : val });
}
}
watch(
() => props.modelValue,
(val) => {
value.value = val;
},
{
immediate: true
}
);
return {
value,
onChange
};
}
});
</script>

View File

@ -1,4 +1,10 @@
import { useStore } from "./store";
import "./static/css/index.scss"; import "./static/css/index.scss";
export * from "./store"; export function useBase() {
return {
...useStore()
};
}
export * from "./common"; export * from "./common";

View File

@ -35,7 +35,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from "vue"; import { defineComponent, ref } from "vue";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { useBaseStore } from "/$/base/store"; import { useBase } from "/$/base";
export default defineComponent({ export default defineComponent({
props: { props: {
@ -45,7 +45,7 @@ export default defineComponent({
setup() { setup() {
const { router } = useCool(); const { router } = useCool();
const { user, menu } = useBaseStore(); const { user, menu } = useBase();
const url = ref<string>(""); const url = ref<string>("");
const isLogout = ref<boolean>(false); const isLogout = ref<boolean>(false);

View File

@ -2,6 +2,7 @@
<div class="app-process"> <div class="app-process">
<div class="app-process__back" @click="router.back"> <div class="app-process__back" @click="router.back">
<el-icon :size="15"><arrow-left /></el-icon> <el-icon :size="15"><arrow-left /></el-icon>
<span>返回</span>
</div> </div>
<div :ref="setRefs('scroller')" class="app-process__scroller"> <div :ref="setRefs('scroller')" class="app-process__scroller">
@ -30,10 +31,10 @@ import { last } from "lodash";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { ArrowLeft, Close } from "@element-plus/icons-vue"; import { ArrowLeft, Close } from "@element-plus/icons-vue";
import { ContextMenu } from "@cool-vue/crud"; import { ContextMenu } from "@cool-vue/crud";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
const { refs, setRefs, route, router } = useCool(); const { refs, setRefs, route, router } = useCool();
const { process } = useBaseStore(); const { process } = useBase();
// //
function toPath() { function toPath() {

View File

@ -19,14 +19,14 @@
import { computed, defineComponent, ref, watch } from "vue"; import { computed, defineComponent, ref, watch } from "vue";
import _ from "lodash"; import _ from "lodash";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { useBaseStore } from "/$/base/store"; import { useBase } from "/$/base";
export default defineComponent({ export default defineComponent({
name: "route-nav", name: "route-nav",
setup() { setup() {
const { route } = useCool(); const { route } = useCool();
const { app, menu } = useBaseStore(); const { app, menu } = useBase();
// //
const list = ref<any[]>([]); const list = ref<any[]>([]);

View File

@ -13,7 +13,7 @@
<script lang="tsx"> <script lang="tsx">
import { defineComponent, ref, watch, h } from "vue"; import { defineComponent, ref, watch, h } from "vue";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import Logo from "/@/assets/logo.png"; import Logo from "/@/assets/logo.png";
@ -24,7 +24,7 @@ export default defineComponent({
MenuNav: { MenuNav: {
setup() { setup() {
const { router, route } = useCool(); const { router, route } = useCool();
const { menu } = useBaseStore(); const { menu } = useBase();
// //
const visible = ref<boolean>(true); const visible = ref<boolean>(true);
@ -58,7 +58,7 @@ export default defineComponent({
}, },
render(ctx: any) { render(ctx: any) {
const { app } = useBaseStore(); const { app } = useBase();
function deepMenu(list: any[], index: number) { function deepMenu(list: any[], index: number) {
return list return list
@ -145,7 +145,7 @@ export default defineComponent({
return { return {
toHome, toHome,
Logo, Logo,
...useBaseStore() ...useBase()
}; };
} }
}); });

View File

@ -48,12 +48,12 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import RouteNav from "./route-nav.vue"; import RouteNav from "./route-nav.vue";
const { router } = useCool(); const { router } = useCool();
const { user, app } = useBaseStore(); const { user, app } = useBase();
// //
function onCommand(name: string) { function onCommand(name: string) {

View File

@ -10,9 +10,9 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed } from "vue"; import { computed } from "vue";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
const { app, process } = useBaseStore(); const { app, process } = useBase();
// //
const caches = computed(() => { const caches = computed(() => {

View File

@ -19,9 +19,9 @@ import Topbar from "./components/topbar.vue";
import Slider from "./components/slider.vue"; import Slider from "./components/slider.vue";
import Process from "./components/process.vue"; import Process from "./components/process.vue";
import Views from "./components/views.vue"; import Views from "./components/views.vue";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
const { app } = useBaseStore(); const { app } = useBase();
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -58,7 +58,7 @@
import { defineComponent, reactive, ref } from "vue"; import { defineComponent, reactive, ref } from "vue";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import Captcha from "./components/captcha.vue"; import Captcha from "./components/captcha.vue";
import Logo from "/@/assets/logo-text.png"; import Logo from "/@/assets/logo-text.png";
@ -75,7 +75,7 @@ export default defineComponent({
setup() { setup() {
const { refs, setRefs, router, service } = useCool(); const { refs, setRefs, router, service } = useCool();
const { user, menu } = useBaseStore(); const { user, menu } = useBase();
// 1 // 1
const saving = ref<boolean>(false); const saving = ref<boolean>(false);

View File

@ -3,7 +3,7 @@ import { useMenuStore } from "./menu";
import { useProcessStore } from "./process"; import { useProcessStore } from "./process";
import { useUserStore } from "./user"; import { useUserStore } from "./user";
export function useBaseStore() { export function useStore() {
const app = useAppStore(); const app = useAppStore();
const menu = useMenuStore(); const menu = useMenuStore();
const process = useProcessStore(); const process = useProcessStore();

View File

@ -1,6 +1,6 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
import { ref } from "vue"; import { ref } from "vue";
import { href, storage } from "/@/cool/utils"; import { storage } from "/@/cool/utils";
import { service, config, router } from "/@/cool"; import { service, config, router } from "/@/cool";
interface User { interface User {

View File

@ -27,7 +27,6 @@
<el-tree <el-tree
v-loading="loading" v-loading="loading"
node-key="id" node-key="id"
highlight-current
default-expand-all default-expand-all
:data="list" :data="list"
:props="{ :props="{
@ -41,9 +40,14 @@
> >
<template #default="{ node, data }"> <template #default="{ node, data }">
<div class="dept-tree__node"> <div class="dept-tree__node">
<span class="dept-tree__node-label" @click="rowClick(data)">{{ <span
node.label class="dept-tree__node-label"
}}</span> :class="{
'is-active': data.id == info?.id
}"
@click="rowClick(data)"
>{{ node.label }}</span
>
<span <span
v-if="app.browser.isMini" v-if="app.browser.isMini"
class="dept-tree__node-icon" class="dept-tree__node-icon"
@ -68,7 +72,7 @@ import { deepTree, revDeepTree } from "/@/cool/utils";
import { isArray } from "lodash"; import { isArray } from "lodash";
import { ContextMenu, useForm } from "@cool-vue/crud"; import { ContextMenu, useForm } from "@cool-vue/crud";
import { Refresh, Operation, MoreFilled } from "@element-plus/icons-vue"; import { Refresh, Operation, MoreFilled } from "@element-plus/icons-vue";
import { useBaseStore, checkPerm } from "/$/base"; import { useBase, checkPerm } from "/$/base";
export default defineComponent({ export default defineComponent({
name: "dept-tree", name: "dept-tree",
@ -98,6 +102,9 @@ export default defineComponent({
// //
const list = ref<any[]>([]); const list = ref<any[]>([]);
//
const info = ref();
// //
const loading = ref<boolean>(false); const loading = ref<boolean>(false);
@ -119,12 +126,18 @@ export default defineComponent({
// //
async function refresh() { async function refresh() {
isDrag.value = false;
loading.value = true; loading.value = true;
isDrag.value = false;
await service.base.sys.department.list().then((res: any[]) => { await service.base.sys.department.list().then((res: any[]) => {
list.value = deepTree(res); list.value = deepTree(res);
emit("list-change", list.value);
if (!info.value) {
info.value = list.value[0];
}
//
rowClick(info.value);
}); });
loading.value = false; loading.value = false;
@ -132,9 +145,12 @@ export default defineComponent({
// ids // ids
function rowClick(e: any) { function rowClick(e: any) {
const ids = e.children ? revDeepTree(e.children).map((e) => e.id) : []; if (e) {
ids.unshift(e.id); const ids = e.children ? revDeepTree(e.children).map((e) => e.id) : [];
emit("row-click", { item: e, ids }); ids.unshift(e.id);
info.value = e;
emit("row-click", { item: e, ids });
}
} }
// //
@ -211,6 +227,10 @@ export default defineComponent({
deleteUser: f deleteUser: f
}) })
.then(() => { .then(() => {
if (e.id == info.value.id) {
info.value = null;
}
if (f) { if (f) {
ElMessage.success("删除成功"); ElMessage.success("删除成功");
} else { } else {
@ -346,6 +366,7 @@ export default defineComponent({
return { return {
Form, Form,
list, list,
info,
loading, loading,
isDrag, isDrag,
onContextMenu, onContextMenu,
@ -356,7 +377,7 @@ export default defineComponent({
rowEdit, rowEdit,
rowDel, rowDel,
treeOrder, treeOrder,
...useBaseStore() ...useBase()
}; };
} }
}); });
@ -433,6 +454,11 @@ export default defineComponent({
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
&.is-active {
color: var(--color-primary);
font-weight: bold;
}
} }
&-icon { &-icon {

View File

@ -40,12 +40,12 @@ export default {
<script lang="ts" setup> <script lang="ts" setup>
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { reactive, ref } from "vue"; import { reactive, ref } from "vue";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { cloneDeep } from "lodash"; import { cloneDeep } from "lodash";
const { service } = useCool(); const { service } = useCool();
const { user } = useBaseStore(); const { user } = useBase();
// //
const form = reactive<any>(cloneDeep(user.info)); const form = reactive<any>(cloneDeep(user.info));

View File

@ -3,11 +3,7 @@
<div class="pane"> <div class="pane">
<!-- 组织架构 --> <!-- 组织架构 -->
<div class="dept" :class="[isExpand ? '_expand' : '_collapse']"> <div class="dept" :class="[isExpand ? '_expand' : '_collapse']">
<dept-tree <dept-tree @row-click="onDeptRowClick" @user-add="onDeptUserAdd" />
@row-click="onDeptRowClick"
@user-add="onDeptUserAdd"
@list-change="onDeptListChange"
/>
</div> </div>
<!-- 成员列表 --> <!-- 成员列表 -->
@ -18,7 +14,7 @@
<el-icon v-else><arrow-right /></el-icon> <el-icon v-else><arrow-right /></el-icon>
</div> </div>
<span>成员列表</span> <span>成员列表{{ selects.dept?.name }}</span>
</div> </div>
<div class="user__container"> <div class="user__container">
@ -94,12 +90,12 @@ import { useTable, useUpsert, useCrud } from "@cool-vue/crud";
import { reactive, ref, watch } from "vue"; import { reactive, ref, watch } from "vue";
import { ArrowLeft, ArrowRight } from "@element-plus/icons-vue"; import { ArrowLeft, ArrowRight } from "@element-plus/icons-vue";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { useBaseStore } from "../store"; import { useBase } from "/$/base";
import DeptMoveForm from "./components/dept-move"; import DeptMoveForm from "./components/dept-move";
import DeptTree from "./components/dept-tree.vue"; import DeptTree from "./components/dept-tree.vue";
const { service } = useCool(); const { service } = useCool();
const { app } = useBaseStore(); const { app } = useBase();
const DeptMove = ref<any>(); const DeptMove = ref<any>();
@ -112,18 +108,10 @@ const selects = reactive<any>({
ids: [] ids: []
}); });
//
const dept = ref<any[]>([]);
// cl-crud // cl-crud
const Crud = useCrud( const Crud = useCrud({
{ service: service.base.sys.user
service: service.base.sys.user });
},
(app) => {
app.refresh();
}
);
// cl-table // cl-table
const Table = useTable({ const Table = useTable({
@ -322,19 +310,9 @@ const Upsert = useUpsert({
], ],
onSubmit(_, data, { next }) { onSubmit(_, data, { next }) {
let departmentId = data.departmentId;
if (!departmentId) {
departmentId = selects.dept.id;
if (!departmentId) {
departmentId = dept.value[0].id;
}
}
next({ next({
...data, ...data,
departmentId departmentId: selects.dept.id
}); });
}, },
@ -363,17 +341,6 @@ const Upsert = useUpsert({
} }
}); });
//
watch(
() => app.browser.isMini,
(val: boolean) => {
isExpand.value = !val;
},
{
immediate: true
}
);
// //
function refresh(params: any) { function refresh(params: any) {
Crud.value?.refresh(params); Crud.value?.refresh(params);
@ -406,11 +373,6 @@ function onDeptUserAdd(item: any) {
}); });
} }
//
function onDeptListChange(list: any[]) {
dept.value = list;
}
// //
function deptExpand() { function deptExpand() {
isExpand.value = !isExpand.value; isExpand.value = !isExpand.value;
@ -428,6 +390,17 @@ async function toMove(e?: any) {
DeptMove.value.toMove(ids); DeptMove.value.toMove(ids);
} }
//
watch(
() => app.browser.isMini,
(val: boolean) => {
isExpand.value = !val;
},
{
immediate: true
}
);
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -137,7 +137,7 @@ import { useCool } from "/@/cool";
import { extname, module, uuid } from "/@/cool/utils"; import { extname, module, uuid } from "/@/cool/utils";
import { isArray, isNumber } from "lodash"; import { isArray, isNumber } from "lodash";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import Draggable from "vuedraggable"; import Draggable from "vuedraggable";
import { fileSize, fileName } from "../utils"; import { fileSize, fileName } from "../utils";
import dayjs from "dayjs"; import dayjs from "dayjs";
@ -182,7 +182,7 @@ const emit = defineEmits(["update:modelValue", "upload", "success", "error", "pr
const { service } = useCool(); const { service } = useCool();
// //
const { user } = useBaseStore(); const { user } = useBase();
// //
const { options } = module.get("upload"); const { options } = module.get("upload");

View File

@ -112,7 +112,7 @@ import { isEmpty } from "lodash";
import Category from "./space/category.vue"; import Category from "./space/category.vue";
import FileItem from "./space/file-item.vue"; import FileItem from "./space/file-item.vue";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { useBaseStore } from "/$/base"; import { useBase } from "/$/base";
import { Notebook, ArrowLeft, UploadFilled } from "@element-plus/icons-vue"; import { Notebook, ArrowLeft, UploadFilled } from "@element-plus/icons-vue";
const props = defineProps({ const props = defineProps({
@ -134,7 +134,7 @@ const emit = defineEmits(["update:modelValue", "confirm"]);
const { service } = useCool(); const { service } = useCool();
// //
const { app } = useBaseStore(); const { app } = useBase();
// //
const { options } = module.get("upload"); const { options } = module.get("upload");

View File

@ -38,12 +38,12 @@ import { computed, inject, onMounted, ref } from "vue";
import { isEmpty } from "lodash"; import { isEmpty } from "lodash";
import { useCool } from "/@/cool"; import { useCool } from "/@/cool";
import { ContextMenu, useForm } from "@cool-vue/crud"; import { ContextMenu, useForm } from "@cool-vue/crud";
import { useBaseStore } from "/$/base/store"; import { useBase } from "/$/base";
const { service } = useCool(); const { service } = useCool();
// //
const { app } = useBaseStore(); const { app } = useBase();
// //
const space = inject<any>("space"); const space = inject<any>("space");

View File

@ -56,11 +56,11 @@ export default (): UserConfig => {
polyfillDynamicImport: false, // 必须为false polyfillDynamicImport: false, // 必须为false
rollupOptions: { rollupOptions: {
output: { output: {
manualChunks(id) { // manualChunks(id) {
if (id.includes("node_modules")) { // if (id.includes("node_modules")) {
return id.toString().split("node_modules/")[1].split("/")[0].toString(); // return id.toString().split("node_modules/")[1].split("/")[0].toString();
} // }
} // }
} }
} }
} }