add
This commit is contained in:
parent
6dad68647a
commit
77293cd87d
@ -32,7 +32,7 @@ useWatchRoute((route) => {
|
||||
menuName.value = route.matched[0]?.meta?.title || ''
|
||||
if (menuList.length) {
|
||||
let index = menuList.findIndex(item => item.name == menuName.value)
|
||||
userStore.getUserInfoByID(menuList[index].id)
|
||||
userStore.getUserInfoByID(menuList[index]?.id || 173)
|
||||
}
|
||||
})
|
||||
|
||||
|
@ -1,27 +1,28 @@
|
||||
<template>
|
||||
<div class="flex pl-4 app-tabs bg-body">
|
||||
<div class="flex-1 min-w-0 menu">
|
||||
<div v-for="(item, index) in tabsLists" class="tab-pan" :class="{ act: (currentRoute == item.path) }">
|
||||
<span v-show="currentRoute == item.path" class="dot"></span>
|
||||
<span @click="handleChanges(item.fullPath)">{{ item.title }}</span>
|
||||
<el-icon @click="delTab(item.fullPath)">
|
||||
<Close />
|
||||
</el-icon>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<div class="menu flex-1 flex flex-wrap px-4">
|
||||
<div v-for="(item, index) in tabsLists" class="flex py-1 px-5 cursor-pointer mb-2 items-center"
|
||||
:class="{ act: (currentRoute == item.fullPath) }">
|
||||
<span v-show="currentRoute == item.fullPath" class="w-1.5 h-1.5 mr-1 bg-primary rounded"></span>
|
||||
<span @click="handleChanges(item.fullPath)">{{ item.title }}</span>
|
||||
<el-icon @click="delTab(item.fullPath)">
|
||||
<Close />
|
||||
</el-icon>
|
||||
</div>
|
||||
</div>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<span class="flex items-center px-3">
|
||||
<icon :size="16" name="el-icon-arrow-down" />
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item command="closeCurrent">关闭当前</el-dropdown-item>
|
||||
<el-dropdown-item command="closeOther">关闭其他</el-dropdown-item>
|
||||
<el-dropdown-item command="closeAll">关闭全部</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<span class="flex items-center px-3">
|
||||
<icon :size="16" name="el-icon-arrow-down" />
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item command="closeCurrent">关闭当前</el-dropdown-item>
|
||||
<el-dropdown-item command="closeOther">关闭其他</el-dropdown-item>
|
||||
<el-dropdown-item command="closeAll">关闭全部</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -29,86 +30,55 @@ import useMultipleTabs from "@/hooks/useMultipleTabs";
|
||||
import { useWatchRoute } from "@/hooks/useWatchRoute";
|
||||
import useTabsStore, { getRouteParams } from "@/stores/modules/multipleTabs";
|
||||
|
||||
|
||||
const currentRoute = ref("");
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const tabsStore = useTabsStore();
|
||||
const {
|
||||
removeOtherTab,
|
||||
addTab,
|
||||
removeAllTab,
|
||||
removeTab,
|
||||
tabsLists,
|
||||
currentTab,
|
||||
removeOtherTab,
|
||||
addTab,
|
||||
removeAllTab,
|
||||
removeTab,
|
||||
tabsLists,
|
||||
currentTab,
|
||||
} = useMultipleTabs();
|
||||
useWatchRoute(() => {
|
||||
addTab();
|
||||
|
||||
|
||||
useWatchRoute((route) => {
|
||||
currentRoute.value = route.fullPath;
|
||||
addTab();
|
||||
});
|
||||
|
||||
|
||||
|
||||
const handleChanges = (fullPath: any) => {
|
||||
const tabItem = tabsStore.tasMap[fullPath];
|
||||
router.push(getRouteParams(tabItem));
|
||||
const tabItem = tabsStore.tasMap[fullPath];
|
||||
router.push(getRouteParams(tabItem));
|
||||
};
|
||||
|
||||
const delTab = (fullPath, index) => {
|
||||
removeTab(fullPath);
|
||||
if (fullPath.includes(route.path)) {
|
||||
handleChanges(tabsLists.value[index].fullPath);
|
||||
}
|
||||
|
||||
const delTab = (fullPath: String) => {
|
||||
removeTab(fullPath);
|
||||
};
|
||||
const currentRoute = ref("");
|
||||
watch(
|
||||
() => route.path,
|
||||
(newCount, oldCount) => {
|
||||
currentRoute.value = newCount;
|
||||
},
|
||||
{
|
||||
immediate: true,
|
||||
deep: true,
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
const handleCommand = (command: any) => {
|
||||
switch (command) {
|
||||
case "closeCurrent":
|
||||
removeTab();
|
||||
break;
|
||||
case "closeOther":
|
||||
removeOtherTab();
|
||||
break;
|
||||
case "closeAll":
|
||||
removeAllTab();
|
||||
break;
|
||||
}
|
||||
switch (command) {
|
||||
case "closeCurrent":
|
||||
removeTab();
|
||||
break;
|
||||
case "closeOther":
|
||||
removeOtherTab();
|
||||
break;
|
||||
case "closeAll":
|
||||
removeAllTab();
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.menu {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.tab-pan {
|
||||
padding: 5px 20px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.act {
|
||||
background-color: var(--el-color-primary-light-9);
|
||||
color: var(--el-color-primary)
|
||||
}
|
||||
|
||||
.dot {
|
||||
display: inline-block;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
background-color: var(--el-color-primary);
|
||||
border-radius: 5px;
|
||||
margin-right: 5px;
|
||||
background-color: var(--el-color-primary-light-9);
|
||||
color: var(--el-color-primary)
|
||||
}
|
||||
</style>
|
@ -57,17 +57,6 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="执行人" prop="executor" show-overflow-tooltip />
|
||||
<el-table-column label="行动描述" prop="description" show-overflow-tooltip />
|
||||
<el-table-column label="附件/现场照片" prop="annex">
|
||||
<template #default="{ row }">
|
||||
|
||||
<div v-if="row.annex && row.annex.length > 0">
|
||||
<div v-for="item in row.annex">
|
||||
<el-image style="width:50px;height:50px;z-index: 9999;" :src="item" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>暂无附件/现场照片</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="位置" prop="coordinate" show-overflow-tooltip />
|
||||
<el-table-column label="下次回访日期" prop="next_follow_date" show-overflow-tooltip />
|
||||
|
||||
@ -223,4 +212,3 @@ const handledetail = async (data: any) => {
|
||||
|
||||
getLists()
|
||||
</script>
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user