|
@@ -1,20 +1,30 @@
|
|
|
<template>
|
|
|
- <ui-group>
|
|
|
+ <ui-group borderBottom class="path-header">
|
|
|
<template #header>
|
|
|
- <ui-button @click="edit()">
|
|
|
+ <!-- <ui-button @click="edit()">
|
|
|
<ui-icon type="add" />
|
|
|
新增
|
|
|
- </ui-button>
|
|
|
+ </ui-button> -->
|
|
|
+ <div class="path-header-content">
|
|
|
+ <ui-input type="checkbox" v-model="all" label="全选" />
|
|
|
+ <ui-icon type="add" ctrl @click="edit()" />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</ui-group>
|
|
|
<ui-group class="path-group">
|
|
|
- <PathSign
|
|
|
- v-for="path in paths"
|
|
|
- :key="path.id"
|
|
|
- :path="path"
|
|
|
- @edit="edit(path)"
|
|
|
- @delete="deletePath(path)"
|
|
|
- />
|
|
|
+ <div v-for="path in paths" :key="path.id" class="path-item">
|
|
|
+ <ui-input
|
|
|
+ type="checkbox"
|
|
|
+ :modelValue="selects.includes(path)"
|
|
|
+ @update:modelValue="(select: boolean) => updateSelect(path, select)"
|
|
|
+ />
|
|
|
+ <PathSign
|
|
|
+ :path="path"
|
|
|
+ @edit="edit(path)"
|
|
|
+ @delete="deletePath(path)"
|
|
|
+ class="path-content"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</ui-group>
|
|
|
<EditPath :data="currentPath" v-if="currentPath" @applyGlobal="applyGlobal" />
|
|
|
</template>
|
|
@@ -32,6 +42,7 @@ import {
|
|
|
autoSavePaths,
|
|
|
createPath,
|
|
|
enterOld,
|
|
|
+ selectPaths,
|
|
|
save,
|
|
|
} from "@/store";
|
|
|
|
|
@@ -40,6 +51,9 @@ import { Dialog } from "bill/expose-common";
|
|
|
import { showPathsStack, showPathStack } from "@/env";
|
|
|
import { asyncTimeout } from "@/utils";
|
|
|
|
|
|
+const { all, selects, updateSelect } = selectPaths;
|
|
|
+
|
|
|
+
|
|
|
const currentPath = ref<Path | null>();
|
|
|
const leaveEdit = () => {
|
|
|
currentPath.value = null;
|
|
@@ -103,5 +117,28 @@ defineExpose({
|
|
|
|
|
|
.path-group {
|
|
|
padding-bottom: 50px;
|
|
|
+ .path-item {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 1px solid var(--colors-border-color);
|
|
|
+ }
|
|
|
+
|
|
|
+ .path-content {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.path-header-content {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style>
|
|
|
+.path-header.ui-group .border-bottom,
|
|
|
+.path-header.ui-group {
|
|
|
+ margin-bottom: 0;
|
|
|
}
|
|
|
</style>
|