Browse Source

部分问题修复

develop
fuguobin 1 year ago
parent
commit
b16924b9d1
  1. 2
      src/settings.ts
  2. 2
      src/types/auto-imports.d.ts
  3. 10
      src/views/dashboard/index.vue
  4. 8
      src/views/monitoring/devicemanage/components/main.vue
  5. 61
      src/views/monitoring/devicemanage/components/menu.vue
  6. 4
      vite.config.ts

2
src/settings.ts

@ -50,7 +50,7 @@ interface DefaultSettings {
} }
const defaultSettings: DefaultSettings = { const defaultSettings: DefaultSettings = {
title: 'vue-vite-project-admin', title: '联美运营驾驶舱管理系统',
showSettings: true, showSettings: true,
tagsView: true, tagsView: true,
fixedHeader: false, fixedHeader: false,

2
src/types/auto-imports.d.ts

@ -2,6 +2,7 @@
export {} export {}
declare global { declare global {
const EffectScope: typeof import('vue')['EffectScope'] const EffectScope: typeof import('vue')['EffectScope']
const ElForm: typeof import('element-plus/es')['ElForm']
const ElMessage: typeof import('element-plus/es')['ElMessage'] const ElMessage: typeof import('element-plus/es')['ElMessage']
const ElMessageBox: typeof import('element-plus/es')['ElMessageBox'] const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
const NEllipsis: typeof import('naive-ui')['NEllipsis'] const NEllipsis: typeof import('naive-ui')['NEllipsis']
@ -271,6 +272,7 @@ import { UnwrapRef } from 'vue'
declare module 'vue' { declare module 'vue' {
interface ComponentCustomProperties { interface ComponentCustomProperties {
readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']> readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']>
readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']> readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']> readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']>
readonly NEllipsis: UnwrapRef<typeof import('naive-ui')['NEllipsis']> readonly NEllipsis: UnwrapRef<typeof import('naive-ui')['NEllipsis']>

10
src/views/dashboard/index.vue

@ -18,10 +18,10 @@
</div> </div>
</div> </div>
</div> </div>
<!-- <div class="userNum flex column text-center"> <div class="userNum flex column text-center">
<div class="title">用户数</div> <div class="title">用户数</div>
<span><countTo :start="1" :end="userNumber" :duration="5000"></countTo></span> <span><countTo :start="1" :end="userNumber" :duration="5000"></countTo></span>
</div> --> </div>
<!-- <div class="currentTime flex column text-center"> <!-- <div class="currentTime flex column text-center">
<span>{{ currentTime }}</span> <span>{{ currentTime }}</span>
<span> <span>
@ -32,7 +32,7 @@
</div> </div>
</el-card> </el-card>
</section> </section>
<!-- <section class="dataCard"> <section class="dataCard">
<el-card shadow="always"> <el-card shadow="always">
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="6" v-for="item in cardData" :key="item.value"> <el-col :span="6" v-for="item in cardData" :key="item.value">
@ -62,7 +62,7 @@
<PieChart id="pieChart" height="300px" width="100%" /> <PieChart id="pieChart" height="300px" width="100%" />
</el-col> </el-col>
</el-row> </el-row>
</section> --> </section>
</div> </div>
</template> </template>
@ -117,7 +117,7 @@ const cardData: CardData[] = [
}, },
{ {
id: '3', id: '3',
title: '下载数', title: '订单数',
value: 2000, value: 2000,
time: 5000, time: 5000,
colors: ['#56cdf3', '#719de3'], colors: ['#56cdf3', '#719de3'],

8
src/views/monitoring/devicemanage/components/main.vue

@ -232,7 +232,7 @@ import mitt from '@/plugins/bus';
const value = ref(0) const value = ref(0)
// const active = ref(true) // const active = ref(true)
const menuKey = ref(); const deviceMenuKey = ref();
const infoData = ref([ const infoData = ref([
{ header_main: [] } { header_main: [] }
]); ]);
@ -246,15 +246,15 @@ defineProps({
default: 0, default: 0,
}, },
}); });
mitt.on('menuKey', (res: any) => { mitt.on('deviceMenuKey', (res: any) => {
// //
menuKey.value = res; deviceMenuKey.value = res;
gitDevice(); gitDevice();
}); });
function gitDevice() { function gitDevice() {
// //
const params = menuKey.value; const params = deviceMenuKey.value;
getViewInfo(params).then((res: any) => { getViewInfo(params).then((res: any) => {
if (res.code === 200) { if (res.code === 200) {
if (isCurrentRoute) { if (isCurrentRoute) {

61
src/views/monitoring/devicemanage/components/menu.vue

@ -1,15 +1,16 @@
<template> <template>
<el-menu ref="menuInstRef" class="menu" background-color="transparent" text-color="#84e0f7" <el-menu ref="menuInstRef" class="menu" background-color="transparent" text-color="#84e0f7" active-text-color="#ffd04b"
active-text-color="#ffd04b" :default-active="selectedKey" @open="openClick" @close="closeClick" @select="selectClick"> :default-active="selectedKey" unique-opened @open="openClick" @close="closeClick" @select="selectClick">
<el-sub-menu :index="`${item.deptId}`" v-for="(item, index) in menuOptions" :key="item.deptId"> <el-sub-menu :index="`${item.deptId}`" v-for="(item, index) in menuOptions" :key="item.deptId">
<template #title> <template #title>
<el-tooltip class="box-item" effect="dark" :content="item.deptName" placement="top-start"> <el-tooltip class="box-item" effect="dark" :content="item.deptName" placement="top-start">
<span>{{ item.deptName }}</span> <span>{{ item.deptName }}</span>
</el-tooltip> </el-tooltip>
</template> </template>
<el-sub-menu :index="`${result.deptId}`" v-for="(result, index) in item.children" :key="result.deptId" <el-sub-menu :index="`${result.deptId}`" v-for="(result, index) in item.children" :key="result.deptId">
@click.native="clickNative"> <template #title>
<template #title>{{ result.deptName }}</template> <div @click.native="clickNative(result)">{{ result.deptName }}</div>
</template>
<el-menu-item :index="`${res.deptId}`" v-for="(res, index) in result.children" :key="res.deptId"> <el-menu-item :index="`${res.deptId}`" v-for="(res, index) in result.children" :key="res.deptId">
<el-tooltip class="box-item" effect="dark" :content="res.deptName" placement="right-start"> <el-tooltip class="box-item" effect="dark" :content="res.deptName" placement="right-start">
<span>{{ res.deptName }}</span> <span>{{ res.deptName }}</span>
@ -21,7 +22,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { useRouter } from "vue-router"; import { useRoute } from "vue-router";
import { getDept, getDeviceList } from '@/api/device/index'; import { getDept, getDeviceList } from '@/api/device/index';
import { menuVo, deviceVo } from '@/api/device/types'; import { menuVo, deviceVo } from '@/api/device/types';
import mitt from '@/plugins/bus'; import mitt from '@/plugins/bus';
@ -29,29 +30,38 @@ const deptData = ref([]);
const selectedKey = ref(); const selectedKey = ref();
const menuOptions = ref<menuVo[]>(); const menuOptions = ref<menuVo[]>();
const deviceData = ref<deviceVo[]>(); const deviceData = ref<deviceVo[]>();
const id= const router = useRoute()
const emit = defineEmits(['tableMenuData']); const emit = defineEmits(['tableMenuData']);
onMounted(() => { onMounted(() => {
menuApi(); if (router.query?.id === undefined) {
menuApi('0');
} else {
menuApi('2');
}
}); });
function menuApi() { function menuApi(type: string) {
// //
getDept().then((res: any) => { getDept().then((res: any) => {
if (res.code === 200) { if (res.code === 200) {
const key =
res.data[0] && res.data[0].children && res.data[0].children.length > 0
? res.data[0].children[0].deptId
: res.data[0].deptId;
// removeChildren(res.data); // removeChildren(res.data);
deptData.value = res.data; deptData.value = res.data;
menuOptions.value=res.data // menuOptions.value = res.data
gitDevice(key, '0')
// selectedKey.value = key; // selectedKey.value = key;
// mitt.emit('menuKey', key); // mitt.emit('deviceMenuKey', key);
emit('tableMenuData', res.data); emit('tableMenuData', res.data);
if (type === '0') {
const key =
res.data[0] && res.data[0].children && res.data[0].children.length > 0
? res.data[0].children[0].deptId
: res.data[0].deptId;
gitDevice(key, '0')
} else {
const deptId = Number(sessionStorage.getItem('deptId'))
gitDevice(deptId, '2')
}
} }
}); });
} }
@ -78,14 +88,18 @@ function gitDevice(key: number, type: string) {
if (type === '0') { if (type === '0') {
const deptIdKey = res.data[0].deptId; const deptIdKey = res.data[0].deptId;
selectedKey.value = deptIdKey.toString(); selectedKey.value = deptIdKey.toString();
mitt.emit('menuKey', deptIdKey); mitt.emit('deviceMenuKey', deptIdKey);
} else if (type === '2') {
const deptIdKey = router.query?.id;
selectedKey.value = deptIdKey?.toString();
mitt.emit('deviceMenuKey', deptIdKey);
} }
// menuOptions.value = deptData.value menuOptions.value = deptData.value
deviceData.value = res.data; deviceData.value = res.data;
// console.log(menuOptions.value) // console.log(menuOptions.value)
// if (type === '0') { // if (type === '0') {
// selectedKey.value = res.data[0].deptId; // selectedKey.value = res.data[0].deptId;
// mitt.emit('menuKey', res.data[0].deptId); // mitt.emit('deviceMenuKey', res.data[0].deptId);
// } // }
} }
}); });
@ -109,14 +123,14 @@ function gitDevice(key: number, type: string) {
// function menuUpdateValue(key: number, item: MenuOption) { // function menuUpdateValue(key: number, item: MenuOption) {
// // // //
// // gitDevice(key, '1') // // gitDevice(key, '1')
// mitt.emit('menuKey', key); // mitt.emit('deviceMenuKey', key);
// console.log(key, item); // console.log(key, item);
// } // }
const openClick = (key: string, indexPath: string[]) => { const openClick = (key: string, indexPath: string[]) => {
//sub-menu //sub-menu
console.log("open-", key, indexPath) console.log("open-", key, indexPath)
gitDevice(Number(key), '1') // gitDevice(Number(key), '1')
} }
const closeClick = (key: string, keyPath: string[]) => { const closeClick = (key: string, keyPath: string[]) => {
//sub-menu //sub-menu
@ -125,11 +139,12 @@ const closeClick = (key: string, keyPath: string[]) => {
const selectClick = (key: string, keyPath: string[], item: any) => { const selectClick = (key: string, keyPath: string[], item: any) => {
// //
console.log("select-", key, keyPath, item) console.log("select-", key, keyPath, item)
mitt.emit('menuKey', key); mitt.emit('deviceMenuKey', key);
} }
function clickNative(item: any) { function clickNative(item: any) {
console.log("clickNative-",item) gitDevice(item.deptId, '1')
console.log("clickNative-", item)
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

4
vite.config.ts

@ -45,8 +45,8 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
hmr: true,//配置HMR hmr: true,//配置HMR
proxy: { proxy: {
[env.VITE_APP_BASE_API]: { [env.VITE_APP_BASE_API]: {
target: 'http://172.1.2.157:9000/',//本地接口地址 // target: 'http://172.1.2.157:9000/',//本地接口地址
// target: 'http://10.10.10.56:9000/',//线上接口地址 target: 'http://10.10.10.56:9000/',//线上接口地址
changeOrigin: true, changeOrigin: true,
rewrite: path => rewrite: path =>
path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '') path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')

Loading…
Cancel
Save