1

src/layout/components/Top.vue

@@ -1,39 +1,39 @@
 <script setup lang="ts">
-import {storeToRefs} from "pinia";
+import { storeToRefs } from "pinia";
 import EditMyPassword from "@/layout/components/myconst/editmypassword.vue";
-import {useUserStore} from "@/store/modules/user";
-import {useAppStore} from "@/store/modules/app";
-import {Position} from "@element-plus/icons-vue";
+import { useUserStore } from "@/store/modules/user";
+import { useAppStore } from "@/store/modules/app";
+import { Position } from "@element-plus/icons-vue";
 
 const userStore = useUserStore();
 const appStore = useAppStore();
-const {device} = storeToRefs(appStore); // 设备类型：desktop-宽屏设备 || mobile-窄屏设备
+const { device } = storeToRefs(appStore); // 设备类型：desktop-宽屏设备 || mobile-窄屏设备
 
 const myPasswordBoxIsShow = ref(false);
 
 const date: Date = new Date();
 
-const tipsType = ref<number>(1)
+const tipsType = ref<number>(1);
 //
 const greetings = computed(() => {
   if (date.getHours() >= 6 && date.getHours() < 8) {
-    tipsType.value = 1
+    tipsType.value = 1;
     return "晨起披衣出草堂，轩窗已自喜微凉🌅！";
   } else if (date.getHours() >= 8 && date.getHours() < 12) {
-    tipsType.value = 2
+    tipsType.value = 2;
     return "上午好🌞！";
   } else if (date.getHours() >= 12 && date.getHours() < 18) {
-    tipsType.value = 3
+    tipsType.value = 3;
     return "下午好☕！";
   } else if (date.getHours() >= 18 && date.getHours() < 24) {
-    tipsType.value = 4
+    tipsType.value = 4;
     return "晚上好🌃！";
   } else if (date.getHours() >= 0 && date.getHours() < 6) {
-    tipsType.value = 5
+    tipsType.value = 5;
     return "偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！";
   }
 });
-const {isFullscreen, toggle} = useFullscreen();
+const { isFullscreen, toggle } = useFullscreen();
 
 /**
  * 注销
@@ -58,9 +58,7 @@ function logout() {
 /**
  * 打开个人资料
  */
-const openMyContBox = () => {
-
-}
+const openMyContBox = () => {};
 /**
  * 修改个人密码
  */
@@ -68,17 +66,15 @@ const editMyPasswordForm = () => {
   // console.log("修改个人密码");
   myPasswordBoxIsShow.value = true;
   // console.log("修改个人密码",myPasswordBoxIsShow.value );
-}
-
+};
 </script>
 
 <template>
   <div class="top">
     <div class="logo">
-      <img src="../../assets/images/logo.png">
+      <img src="../../assets/images/logo.png" />
     </div>
     <div class="flex">
-
       <!--			&lt;!&ndash; 导航栏设置(窄屏隐藏)&ndash;&gt;-->
       <div v-if="device !== 'mobile'" class="setting-container">
         <!--				<el-text v-if="tipsType==1" class="mx-1" type="success">{{ greetings }}</el-text>-->
@@ -88,22 +84,20 @@ const editMyPasswordForm = () => {
         <!--				<el-text v-if="tipsType==5" class="mx-1">{{ greetings }}</el-text>-->
         <!--全屏 -->
         <div class="setting-item" @click="toggle">
-          <svg-icon
-              :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'"
-          />
+          <svg-icon :icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'" />
         </div>
         <!-- 布局大小 -->
         <el-tooltip content="布局大小" effect="dark" placement="bottom">
-          <size-select class="setting-item"/>
+          <size-select class="setting-item" />
         </el-tooltip>
         <!--语言选择-->
-        <lang-select class="setting-item"/>
+        <lang-select class="setting-item" />
       </div>
 
       <!--			&lt;!&ndash; 用户头像 &ndash;&gt;-->
       <el-dropdown trigger="click">
         <div class="avatar-container">
-          <img :src="userStore.avatar + '?imageView2/1/w/80/h/80'"/>
+          <img :src="userStore.avatar + '?imageView2/1/w/80/h/80'" />
           <span style="padding: 0 10px">{{ userStore.nickname }}</span>
           <arrow-down class="w-3 h-3"></arrow-down>
         </div>
@@ -112,8 +106,12 @@ const editMyPasswordForm = () => {
             <router-link to="/">
               <el-dropdown-item>{{ $t("navbar.dashboard") }}</el-dropdown-item>
             </router-link>
-            <el-dropdown-item @click="openMyContBox">{{ $t("navbar.archives") }}</el-dropdown-item>
-            <el-dropdown-item @click="editMyPasswordForm">{{ $t("navbar.password") }}</el-dropdown-item>
+            <el-dropdown-item @click="openMyContBox">{{
+              $t("navbar.archives")
+            }}</el-dropdown-item>
+            <el-dropdown-item @click="editMyPasswordForm">{{
+              $t("navbar.password")
+            }}</el-dropdown-item>
             <el-dropdown-item divided @click="logout">
               {{ $t("navbar.logout") }}
             </el-dropdown-item>
@@ -121,14 +119,14 @@ const editMyPasswordForm = () => {
         </template>
       </el-dropdown>
     </div>
-    <EditMyPassword v-model:editPasswordIsShow="myPasswordBoxIsShow"/>
+    <EditMyPassword v-model:editPasswordIsShow="myPasswordBoxIsShow" />
   </div>
 </template>
 
 <style scoped lang="scss">
 .top {
   height: 68px;
-  background: #1E5EFF;
+  background: #1e5eff;
   position: fixed;
   padding: 0 20px;
   top: 0;

src/layout/index.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import {computed, watchEffect} from "vue";
-import {useWindowSize} from "@vueuse/core";
-import {AppMain, Navbar, Settings, TagsView} from "./components/index";
+import { computed, watchEffect } from "vue";
+import { useWindowSize } from "@vueuse/core";
+import { AppMain, Navbar, Settings, TagsView } from "./components/index";
 import Sidebar from "./components/Sidebar/index.vue";
 import RightPanel from "@/components/RightPanel/index.vue";
-import Top from './components/Top.vue'
+import Top from "./components/Top.vue";
 
-import {useAppStore} from "@/store/modules/app";
-import {useSettingsStore} from "@/store/modules/settings";
+import { useAppStore } from "@/store/modules/app";
+import { useSettingsStore } from "@/store/modules/settings";
 
-const {width} = useWindowSize();
+const { width } = useWindowSize();
 
 /**
  * 响应式布局容器固定宽度
@@ -56,9 +56,7 @@ function handleOutsideClick() {
 </script>
 
 <template>
-
   <div :class="classObj" class="app-wrapper">
-
     <!-- 手机设备侧边栏打开遮罩层 -->
     <div
       v-if="classObj.mobile && classObj.openSidebar"
@@ -67,21 +65,20 @@ function handleOutsideClick() {
     ></div>
     <top></top>
 
-
-		<Sidebar class="sidebar-container"/>
+    <Sidebar class="sidebar-container" />
 
     <div :class="{ hasTagsView: showTagsView }" class="main-container">
-			<div :class="{ 'fixed-header': fixedHeader }" style="margin: 10px 20px 0 20px;">
+      <div :class="{ 'fixed-header': fixedHeader }" style="margin: 10px 20px 0 20px">
         <navbar></navbar>
-				<tags-view v-if="showTagsView"/>
+        <tags-view v-if="showTagsView" />
       </div>
 
       <!--主页面-->
-			<app-main/>
+      <app-main />
 
       <!-- 设置面板 -->
       <RightPanel v-if="showSettings">
-				<settings/>
+        <settings />
       </RightPanel>
     </div>
   </div>
@@ -89,7 +86,7 @@ function handleOutsideClick() {
 
 <style lang="scss" scoped>
 .app-wrapper {
-	background: #F5F6FA;
+  background: #f5f6fa;
   position: relative;
   width: 100%;
   height: 100%;
@@ -100,7 +97,6 @@ function handleOutsideClick() {
   // 	content: "";
   // }
 
-
   &.mobile.openSidebar {
     position: fixed;
     top: 0;

src/views/dashboard/index.vue

@@ -3,14 +3,17 @@
 @ 时间: 2023-11-06 13:39:13
 @ 备注: 首页
 -->
-<script lang='ts' setup>
-import * as echarts from 'echarts';	//引入图形界面
+<script lang="ts" setup>
+import * as echarts from "echarts"; //引入图形界面
 
 import { useUserStore } from "@/store/modules/user";
 
-
-import { orgInfo } from '@/api/displayboardapi/types'
-import { getOrgChiled,getCompanyDeparment,targetListForDepartment } from '@/api/displayboardapi/indexapi'
+import { orgInfo } from "@/api/displayboardapi/types";
+import {
+  getOrgChiled,
+  getCompanyDeparment,
+  targetListForDepartment,
+} from "@/api/displayboardapi/indexapi";
 
 import UserInfo from "@/views/dashboard/components/userinfo.vue";
 import SanLianpIng from "@/views/dashboard/components/sanlianping.vue";
@@ -22,36 +25,31 @@ import Application from "@/views/dashboard/components/application.vue";
 import HostNews from "@/views/dashboard/components/hostnews.vue";
 
 const userStore = useUserStore();
-const orgListCont = ref<orgInfo[]>([])
-const educationOrgId = ref<number>(309)
-const masterBody = ref<any>(null)
-const drawerWidht = ref<any>()
+const orgListCont = ref<orgInfo[]>([]);
+const educationOrgId = ref<number>(309);
+const masterBody = ref<any>(null);
+const drawerWidht = ref<any>();
 /**
  * 获取行政组织
  */
-function getOrgList(){
-	getOrgChiled({id:313})
-		.then(( {data} )=>{
+function getOrgList() {
+  getOrgChiled({ id: 313 }).then(({ data }) => {
     // console.log("获取行政组织-2-->",data)
-			orgListCont.value = data.list
-			educationOrgId.value = data.current
-		})
+    orgListCont.value = data.list;
+    educationOrgId.value = data.current;
+  });
 }
 
+const orgAllYears = ref<any>(); //当前年
 
-
-const orgAllYears = ref<any>()	//当前年
-
-const oenOrg = ref<any>() //单一行政组织
-
+const oenOrg = ref<any>(); //单一行政组织
 
 //渲染完页面再执行
 onMounted(() => {
-	
-	drawerWidht.value = masterBody.value?.clientWidth
+  drawerWidht.value = masterBody.value?.clientWidth;
   getOrgList();
   // console.log("热门新闻----100---->",drawerWidht.value)
-})
+});
 </script>
 <template>
   <div ref="masterBody" class="app_container">
@@ -76,53 +74,51 @@ onMounted(() => {
         <Application :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
       </div>
     </div>
-			<el-row :gutter="10" class="cart_top_juLi" >
+    <el-row :gutter="10" class="cart_top_juLi">
       <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="readback">
         <SanLianpIng />
       </el-col>
     </el-row>
-			
   </div>
 </template>
-<style  lang='scss' scoped>
-.app_container{
+<style lang="scss" scoped>
+.app_container {
   padding: 10px 20px 0px 20px;
   height: calc(100% - 10px);
   overflow: hidden;
   overflow-y: auto;
   width: 100%;
 }
-.orgAllMothsTitle{
-	width:100%;
+.orgAllMothsTitle {
+  width: 100%;
   display: flex;
   align-items: center;
-	justify-content:space-between;
-		
+  justify-content: space-between;
 }
-.span_icon_left{
-	margin-right:10px;
+.span_icon_left {
+  margin-right: 10px;
 }
-.cart_top_juLi{
-	margin-top:20px;
+.cart_top_juLi {
+  margin-top: 20px;
 }
-.titleInfo{
+.titleInfo {
   font-size: 20px;
   font-weight: bold;
 }
-.first-main{
+.first-main {
   display: flex;
   justify-content: space-between;
   height: 330px;
 }
-.main-width74{
+.main-width74 {
   width: calc(100% - 370px);
   height: 100%;
 }
-.main-width26{
+.main-width26 {
   width: 350px;
   height: 100%;
 }
-.main-width50{
+.main-width50 {
   width: calc(50% - 10px);
   height: 100%;
 }