This commit is contained in:
parent
d953f5d7ac
commit
d8c44b2ef6
|
|
@ -28,8 +28,6 @@
|
|||
</template>
|
||||
|
||||
<script setup name="NavMenu">
|
||||
import {defineProps} from 'vue';
|
||||
|
||||
const props = defineProps(['navMenus']);
|
||||
|
||||
function hasChildren(item) {
|
||||
|
|
|
|||
|
|
@ -1,57 +1,53 @@
|
|||
<template>
|
||||
<div v-show="$route.meta.type=='iframe'" class="iframe-pages">
|
||||
<iframe v-for="item in iframeList" :key="item.meta.url" v-show="$route.meta.url==item.meta.url" :src="item.meta.url" frameborder='0'></iframe>
|
||||
<iframe v-for="item in iframeList" :key="item.meta.url" v-show="$route.meta.url==item.meta.url"
|
||||
:src="item.meta.url" frameborder='0'></iframe>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
<script setup>
|
||||
import {computed, watch} from "vue"
|
||||
import {useRoute} from "vue-router";
|
||||
import store from "@/store";
|
||||
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(e) {
|
||||
this.push(e)
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.push(this.$route);
|
||||
},
|
||||
computed:{
|
||||
iframeList(){
|
||||
return this.$store.state.iframe.iframeList
|
||||
},
|
||||
ismobile(){
|
||||
return this.$store.state.global.ismobile
|
||||
},
|
||||
layoutTags(){
|
||||
return this.$store.state.global.layoutTags
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const route = useRoute()
|
||||
const iframeList = computed(() => store.state.iframe.iframeList)
|
||||
const ismobile = computed(() => store.state.global.ismobile)
|
||||
const layoutTags = computed(() => store.state.global.layoutTags)
|
||||
|
||||
},
|
||||
methods: {
|
||||
push(route){
|
||||
if(route.meta.type == 'iframe'){
|
||||
if(this.ismobile || !this.layoutTags){
|
||||
this.$store.commit("setIframeList", route)
|
||||
}else{
|
||||
this.$store.commit("pushIframeList", route)
|
||||
}
|
||||
}else{
|
||||
if(this.ismobile || !this.layoutTags){
|
||||
this.$store.commit("clearIframeList")
|
||||
}
|
||||
}
|
||||
push(route)
|
||||
|
||||
watch(route, (e) => {
|
||||
push(e)
|
||||
})
|
||||
|
||||
function push(route) {
|
||||
if (route.meta.type == 'iframe') {
|
||||
if (ismobile || !layoutTags) {
|
||||
store.commit("setIframeList", route)
|
||||
} else {
|
||||
store.commit("pushIframeList", route)
|
||||
}
|
||||
} else {
|
||||
if (ismobile || !layoutTags) {
|
||||
store.commit("clearIframeList")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.iframe-pages {width:100%;height:100%;background: #fff;}
|
||||
iframe {border:0;width:100%;height:100%;display: block;}
|
||||
.iframe-pages {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
iframe {
|
||||
border: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<li v-for="item in msgList" v-bind:key="item.accept_id" @click="toMessage(item.accept_id)">
|
||||
<a :href="item.link" target="_blank">
|
||||
<div class="msg-list__main">
|
||||
<p :class="item.status == 0 ? 'unread' : ''">{{item.title}}</p>
|
||||
<p :class="item.status == 0 ? 'unread' : ''">{{ item.title }}</p>
|
||||
</div>
|
||||
<div class="msg-list__time">
|
||||
<p v-time.tip="item.create_time" :class="item.status == 0 ? 'unread' : ''"></p>
|
||||
|
|
@ -22,50 +22,99 @@
|
|||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
emits: ['closed'],
|
||||
data() {
|
||||
return {
|
||||
msgList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadData()
|
||||
},
|
||||
methods: {
|
||||
async loadData() {
|
||||
let res = await this.$API.home.message.newMsg()
|
||||
this.msgList = res.data
|
||||
},
|
||||
//标记已读
|
||||
async markRead(){
|
||||
let res = await this.$API.home.message.read()
|
||||
this.msgList.forEach((item) => {
|
||||
<script setup>
|
||||
import {ref, onMounted, getCurrentInstance} from "vue";
|
||||
import api from "@/api";
|
||||
import {useRouter} from "vue-router";
|
||||
|
||||
const emit = defineEmits(['closed']);
|
||||
const {proxy} = getCurrentInstance()
|
||||
const router = useRouter()
|
||||
|
||||
let msgList = ref([])
|
||||
|
||||
onMounted(() => {
|
||||
loadData()
|
||||
})
|
||||
|
||||
async function loadData() {
|
||||
// let res = await api.home.message.newMsg()
|
||||
// this.msgList = res.data
|
||||
}
|
||||
|
||||
//标记已读
|
||||
async function markRead() {
|
||||
// let res = await api.home.message.read()
|
||||
msgList.value.forEach((item) => {
|
||||
item.status = 1
|
||||
})
|
||||
this.$message.success(res.msg)
|
||||
this.$emit('closed', 0)
|
||||
},
|
||||
toMessage(accept_id) {
|
||||
this.$router.push({name: 'messageCenter', params: { accept_id: accept_id}})
|
||||
this.$emit('closed', -1)
|
||||
}
|
||||
}
|
||||
// proxy.$message.success(res.msg)
|
||||
emit('closed', 0)
|
||||
}
|
||||
|
||||
function toMessage(accept_id) {
|
||||
router.push({name: 'messageCenter', query: {accept_id: accept_id}})
|
||||
proxy.$emit('closed', -1)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.msg-list li {border-top:1px solid #eee;}
|
||||
.msg-list li a {display: flex;padding:20px;}
|
||||
.msg-list li a:hover {background: #ecf5ff;}
|
||||
.msg-list__main {flex: 1;}
|
||||
.msg-list__main h2 {font-size: 15px;font-weight: normal;color: #333;}
|
||||
.msg-list__main p {font-size: 12px;color: #999;line-height: 1.8;margin-top: 5px;}
|
||||
.msg-list__time {width: 100px;text-align: right;color: #999;}
|
||||
.msg-list__time p {font-size: 12px;color: #999;line-height: 1.8;margin-top: 5px;}
|
||||
.unread {color: #333 !important;}
|
||||
.dark .msg-list__main h2 {color: #d0d0d0;}
|
||||
.dark .msg-list li {border-top:1px solid #363636;}
|
||||
.dark .msg-list li a:hover {background: #383838;}
|
||||
.msg-list li {
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
.msg-list li a {
|
||||
display: flex;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.msg-list li a:hover {
|
||||
background: #ecf5ff;
|
||||
}
|
||||
|
||||
.msg-list__main {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.msg-list__main h2 {
|
||||
font-size: 15px;
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.msg-list__main p {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
line-height: 1.8;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.msg-list__time {
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.msg-list__time p {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
line-height: 1.8;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.unread {
|
||||
color: #333 !important;
|
||||
}
|
||||
|
||||
.dark .msg-list__main h2 {
|
||||
color: #d0d0d0;
|
||||
}
|
||||
|
||||
.dark .msg-list li {
|
||||
border-top: 1px solid #363636;
|
||||
}
|
||||
|
||||
.dark .msg-list li a:hover {
|
||||
background: #383838;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,20 @@
|
|||
<template>
|
||||
<div class="sc-search">
|
||||
<el-input ref="input" v-model="input" placeholder="搜索" size="large" clearable prefix-icon="el-icon-search" :trigger-on-focus="false" @input="inputChange"/>
|
||||
<el-input ref="input" v-model="searchText" placeholder="搜索" size="large" clearable prefix-icon="el-icon-search"
|
||||
:trigger-on-focus="false" @input="inputChange"/>
|
||||
<div class="sc-search-history" v-if="history.length>0">
|
||||
<el-tag closable effect="dark" type="info" v-for="(item, index) in history" :key="item" @click="historyClick(item)" @close="historyClose(index)">{{item}}</el-tag>
|
||||
<el-tag closable effect="dark" type="info" v-for="(item, index) in history" :key="item"
|
||||
@click="historyClick(item)" @close="historyClose(index)">{{ item }}
|
||||
</el-tag>
|
||||
</div>
|
||||
<div class="sc-search-result">
|
||||
<div class="sc-search-no-result" v-if="result.length<=0">暂无搜索结果</div>
|
||||
<ul v-else>
|
||||
<el-scrollbar max-height="366px">
|
||||
<li v-for="item in result" :key="item.path" @click="to(item)">
|
||||
<el-icon><component :is="item.icon || 'el-icon-menu'" /></el-icon>
|
||||
<el-icon>
|
||||
<component :is="item.icon || 'el-icon-menu'"/>
|
||||
</el-icon>
|
||||
<span class="title">{{ item.breadcrumb }}</span>
|
||||
</li>
|
||||
</el-scrollbar>
|
||||
|
|
@ -18,89 +23,96 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
input: "",
|
||||
menu: [],
|
||||
result: [],
|
||||
history: []
|
||||
<script setup>
|
||||
import {ref, onMounted, getCurrentInstance} from "vue";
|
||||
import tools from "@/utils/tools.js";
|
||||
import {useRouter} from "vue-router";
|
||||
|
||||
const {proxy} = getCurrentInstance()
|
||||
const router = useRouter()
|
||||
|
||||
let searchText = ref("")
|
||||
let menu = ref([])
|
||||
let result = ref([])
|
||||
let history = ref([])
|
||||
|
||||
console.log(searchText)
|
||||
|
||||
onMounted(() => {
|
||||
history.value = tools.data.get("SEARCH_HISTORY") || []
|
||||
const menuTree = tools.data.get("MENU");
|
||||
filterMenu(menuTree)
|
||||
proxy.$refs.input.focus()
|
||||
})
|
||||
|
||||
function inputChange(value) {
|
||||
if (value) {
|
||||
result.value = menuFilter(value)
|
||||
} else {
|
||||
result.value = []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
var searchHistory = this.$TOOL.data.get("SEARCH_HISTORY") || []
|
||||
this.history = searchHistory
|
||||
var menuTree = this.$TOOL.data.get("MENU")
|
||||
this.filterMenu(menuTree)
|
||||
this.$refs.input.focus()
|
||||
},
|
||||
methods: {
|
||||
inputChange(value){
|
||||
if(value){
|
||||
this.result = this.menuFilter(value)
|
||||
}else{
|
||||
this.result = []
|
||||
}
|
||||
},
|
||||
filterMenu(map){
|
||||
}
|
||||
|
||||
function filterMenu(map) {
|
||||
map.forEach(item => {
|
||||
if(item.meta.hidden || item.meta.type=="button"){
|
||||
if (item.meta.hidden || item.meta.type == "button") {
|
||||
return false
|
||||
}
|
||||
if(item.meta.type=='iframe'){
|
||||
if (item.meta.type == 'iframe') {
|
||||
item.path = `/i/${item.name}`
|
||||
}
|
||||
if(item.children&&item.children.length > 0&&!item.component){
|
||||
this.filterMenu(item.children)
|
||||
}else{
|
||||
this.menu.push(item)
|
||||
if (item.children && item.children.length > 0 && !item.component) {
|
||||
filterMenu(item.children)
|
||||
} else {
|
||||
menu.value.push(item)
|
||||
}
|
||||
})
|
||||
},
|
||||
menuFilter(queryString){
|
||||
var res = []
|
||||
}
|
||||
|
||||
function menuFilter(queryString) {
|
||||
const res = [];
|
||||
//过滤菜单树
|
||||
var filterMenu = []
|
||||
this.menu.forEach((item) => {
|
||||
let filterMenu = [];
|
||||
menu.value.forEach((item) => {
|
||||
filterMenu = filterMenu.concat(item.children.filter((v) => {
|
||||
if((v.meta.title).toLowerCase().indexOf(queryString.toLowerCase()) >= 0){
|
||||
if ((v.meta.title).toLowerCase().indexOf(queryString.toLowerCase()) >= 0) {
|
||||
return true
|
||||
}
|
||||
if((v.name).toLowerCase().indexOf(queryString.toLowerCase()) >= 0){
|
||||
if ((v.name).toLowerCase().indexOf(queryString.toLowerCase()) >= 0) {
|
||||
return true
|
||||
}
|
||||
}))
|
||||
})
|
||||
//匹配系统路由
|
||||
var router = this.$router.getRoutes()
|
||||
var filterRouter= filterMenu.map((m) => {
|
||||
if(m.meta.type == "link"){
|
||||
return router.find(r => r.path == '/'+m.path)
|
||||
}else{
|
||||
return router.find(r => r.path == m.path)
|
||||
const routes = router.getRoutes();
|
||||
const filterRouter = filterMenu.map((m) => {
|
||||
if (m.meta.type == "link") {
|
||||
return routes.find(r => r.path == '/' + m.path)
|
||||
} else {
|
||||
return routes.find(r => r.path == m.path)
|
||||
}
|
||||
})
|
||||
});
|
||||
//重组对象
|
||||
filterRouter.forEach(item => {
|
||||
res.push({
|
||||
name: item.name,
|
||||
type: item.meta.type,
|
||||
path: item.meta.type=="link"?item.path.slice(1):item.path,
|
||||
path: item.meta.type == "link" ? item.path.slice(1) : item.path,
|
||||
icon: item.meta.icon,
|
||||
title: item.meta.title,
|
||||
breadcrumb: item.meta.breadcrumb.map(v => v.meta.title).join(' - ')
|
||||
})
|
||||
})
|
||||
return res
|
||||
},
|
||||
to(item){
|
||||
if(!this.history.includes(this.input)){
|
||||
this.history.push(this.input)
|
||||
this.$TOOL.data.set("SEARCH_HISTORY", this.history)
|
||||
}
|
||||
|
||||
function to(item) {
|
||||
if (!history.value.includes(searchText.value)) {
|
||||
history.value.push(searchText.value)
|
||||
tools.data.set("SEARCH_HISTORY", history.value)
|
||||
}
|
||||
if(item.type=="link"){
|
||||
setTimeout(()=>{
|
||||
if (item.type == "link") {
|
||||
setTimeout(() => {
|
||||
let a = document.createElement("a")
|
||||
a.style = "display: none"
|
||||
a.target = "_blank"
|
||||
|
|
@ -109,34 +121,72 @@
|
|||
a.click()
|
||||
document.body.removeChild(a)
|
||||
}, 10);
|
||||
}else{
|
||||
this.$router.push({path: item.path})
|
||||
}
|
||||
this.$emit('success', true)
|
||||
},
|
||||
historyClick(text){
|
||||
this.input = text
|
||||
this.inputChange(text)
|
||||
},
|
||||
historyClose(index){
|
||||
this.history.splice(index, 1);
|
||||
if(this.history.length <= 0){
|
||||
this.$TOOL.data.remove("SEARCH_HISTORY")
|
||||
}else{
|
||||
this.$TOOL.data.set("SEARCH_HISTORY", this.history)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
router.push({path: item.path})
|
||||
}
|
||||
proxy.$emit('success', true)
|
||||
}
|
||||
|
||||
function historyClick(text) {
|
||||
searchText.value = text
|
||||
inputChange(text)
|
||||
}
|
||||
|
||||
function historyClose(index) {
|
||||
history.value.splice(index, 1);
|
||||
if (history.value.length <= 0) {
|
||||
tools.data.remove("SEARCH_HISTORY")
|
||||
} else {
|
||||
tools.data.set("SEARCH_HISTORY", history.value)
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.sc-search {}
|
||||
.sc-search-no-result {text-align: center;margin: 40px 0;color: #999;}
|
||||
.sc-search-history {margin-top: 10px;}
|
||||
.sc-search-history .el-tag {cursor: pointer;}
|
||||
.sc-search-result {margin-top: 15px;}
|
||||
.sc-search-result li {height:56px;padding:0 15px;background: var(--el-bg-color-overlay);border: 1px solid var(--el-border-color-light);list-style:none;border-radius: 4px;margin-bottom: 5px;font-size: 14px;display: flex;align-items: center;cursor: pointer;}
|
||||
.sc-search-result li i {font-size: 20px;margin-right: 15px;}
|
||||
.sc-search-result li:hover {background: var(--el-color-primary);color: #fff;border-color: var(--el-color-primary);}
|
||||
.sc-search {
|
||||
}
|
||||
|
||||
.sc-search-no-result {
|
||||
text-align: center;
|
||||
margin: 40px 0;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.sc-search-history {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.sc-search-history .el-tag {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sc-search-result {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.sc-search-result li {
|
||||
height: 56px;
|
||||
padding: 0 15px;
|
||||
background: var(--el-bg-color-overlay);
|
||||
border: 1px solid var(--el-border-color-light);
|
||||
list-style: none;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 5px;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sc-search-result li i {
|
||||
font-size: 20px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.sc-search-result li:hover {
|
||||
background: var(--el-color-primary);
|
||||
color: #fff;
|
||||
border-color: var(--el-color-primary);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -37,28 +37,30 @@
|
|||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
tasks: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
async getData(){
|
||||
this.loading = true
|
||||
var res = await this.$API.system.tasks.list()
|
||||
this.tasks = res.data
|
||||
this.loading = false
|
||||
},
|
||||
refresh(){
|
||||
this.getData()
|
||||
},
|
||||
download(row){
|
||||
<script setup>
|
||||
import {ref, onMounted} from "vue";
|
||||
import api from "@/api";
|
||||
|
||||
let loading = ref(false)
|
||||
let tasks = ref([])
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
getData()
|
||||
})
|
||||
|
||||
async function getData(){
|
||||
// loading.value = true
|
||||
// const res = await api.system.tasks.list();
|
||||
// tasks.value= res.data
|
||||
// loading.value = false
|
||||
}
|
||||
|
||||
function refresh(){
|
||||
getData()
|
||||
}
|
||||
|
||||
function download(row){
|
||||
let a = document.createElement("a")
|
||||
a.style = "display: none"
|
||||
a.target = "_blank"
|
||||
|
|
@ -66,11 +68,11 @@ export default {
|
|||
document.body.appendChild(a)
|
||||
a.click()
|
||||
document.body.removeChild(a)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.user-bar-tasks-item {margin-bottom: 10px;}
|
||||
.user-bar-tasks-item:hover {border-color: var(--el-color-primary);}
|
||||
|
|
|
|||
|
|
@ -4,26 +4,29 @@ import {RouteLocationNormalized, RouteLocationNormalizedLoaded} from "vue-router
|
|||
import tools from "@/utils/tools";
|
||||
|
||||
export function beforeEach(to: RouteLocationNormalized, from: RouteLocationNormalizedLoaded) {
|
||||
const adminMain = document.querySelector('#pi-main');
|
||||
if (!adminMain) {
|
||||
const piMain = document.querySelector('#pi-main');
|
||||
if (!piMain) {
|
||||
return false
|
||||
}
|
||||
|
||||
console.log(from)
|
||||
|
||||
store.commit("updateViewTags", {
|
||||
fullPath: from.fullPath,
|
||||
scrollTop: adminMain.scrollTop
|
||||
scrollTop: piMain.scrollTop
|
||||
})
|
||||
}
|
||||
|
||||
export function afterEach(to: RouteLocationNormalized) {
|
||||
const adminMain = document.querySelector('#pi-main');
|
||||
if (!adminMain) {
|
||||
const piMain = document.querySelector('#pi-main');
|
||||
if (!piMain) {
|
||||
return false
|
||||
}
|
||||
nextTick(() => {
|
||||
// @ts-ignore
|
||||
const beforeRoute = store.state.viewTags.viewTags.filter(v => v.fullPath == to.fullPath)[0];
|
||||
if (beforeRoute) {
|
||||
adminMain.scrollTop = beforeRoute.scrollTop || 0
|
||||
piMain.scrollTop = beforeRoute.scrollTop || 0
|
||||
}
|
||||
}).then(r => {
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue