Selaa lähdekoodia

天气 上海

viviandjava 5 kuukautta sitten
vanhempi
commit
3e7926a5fa
2 muutettua tiedostoa jossa 74 lisäystä ja 64 poistoa
  1. 5 0
      src/api/weather.ts
  2. 69 64
      src/layout/components/Navbar.vue

+ 5 - 0
src/api/weather.ts

@@ -16,7 +16,12 @@ export async function getWeather() {
     url: '/nmc_api/rest/weather?stationid=uKfig',
     method: 'get'
   }).then(res => res.data.real.weather)
+  const shanghaiWeather = await request({
+    url: '/nmc_api/rest/weather?stationid=QtPRO',
+    method: 'get'
+  }).then(res => res.data.real.weather)
   return Promise.resolve([
+    {city: '上海市', weather: `${shanghaiWeather.info} ${shanghaiWeather.temperature}℃`},
     {city: '嘉兴市', weather: `${jiaxinWeather.info} ${jiaxinWeather.temperature}℃`},
     {city: '黄山市', weather: `${huangshanWeather.info} ${huangshanWeather.temperature}℃`},
     {city: '宁德市', weather: `${ningdeWeather.info} ${ningdeWeather.temperature}℃`},

+ 69 - 64
src/layout/components/Navbar.vue

@@ -6,12 +6,13 @@ import { formatd } from '@/utils/ruoyi'
 import { Setting } from '@/utils/tdInstruction'
 import { getWeather } from '@/api/weather'
 import { ArrowDown } from '@element-plus/icons-vue'
+import { getLunar } from 'chinese-lunar-calendar'
 
 const route = useRoute()
 const router = useRouter()
 
 let navbarBackgroundImage = new URL('@/assets/images/layout/header-background.png', import.meta.url).href
-let navbarTitleImage = ref(new URL('@/assets/images/layout/header-title3.png', import.meta.url).href)
+let navbarTitleImage = ref(new URL('@/assets/images/layout/header-zh.png', import.meta.url).href)
 let menuLeftImage = ref(new URL('@/assets/images/layout/menu-left.png', import.meta.url).href)
 let menuRightImage = ref(new URL('@/assets/images/layout/menu-right.png', import.meta.url).href)
 const navbarBackgroundStyle = computed(() => {
@@ -20,54 +21,33 @@ const navbarBackgroundStyle = computed(() => {
 const showMenu = computed(() => route.path !== '/index')
 const leftMenu = computed(() => {
   return [
-    { name: '总  览', path: '/index', type: 'left', style: {} },
+    { name: '概况总览', path: '/index', type: 'left', style: {} },
     { name: '态势感知', path: '/situational/' + route.params.stcd, type: 'left', style: {} }
   ]
 })
 const rightMenu = computed(() => {
   return [
-    { name: '智慧运维', type: 'right', style: {},secMenu:[
-      {
-      name:"智慧运维",path:'/intelloper/' + route.params.stcd
-      },{
-      name:"设备清单",path:'/sw/' + route.params.stcd+"/shebei"
-      },
+    {
+      name: '智慧运维', type: 'right', style: {}, secMenu: [
         {
-      name:"备品备件",path:'/sw/' + route.params.stcd+"/shebei"
-      },{
-      name:"维护任务",path:'/sw/' + route.params.stcd+"/shebei"
-      },
-        {
-      name:"运维记录",path:'/sw/' + route.params.stcd+"/jilu"
-      },{
-      name:"故障报警",path:'/sw/' + route.params.stcd+"/bj"
-      },{
-      name:"告警记录",path:'/sw/' + route.params.stcd+"/gj"
-      }] },
-    { name: '业务管理', path: '/index', type: 'right', style: {} ,secMenu:[{
-        name:"实时水位",path:'/sw/' + route.params.stcd+"/sw"
-      },{
-        name:"实时流量",path:'/sw/' + route.params.stcd+"/flow"
-      },{
-        name:"实时雨量",path:'/sw/' + route.params.stcd+"/flow"
-      },{
-        name:"实时水质",path:'/sw/' + route.params.stcd+"/flow"
-      },{
-        name:"多站水情对比分析",path:'/sw/' + route.params.stcd+"/dzll"
-      },{
-        name:"多站雨情对比分析",path:'/sw/' + route.params.stcd+"/dzll"
-      },{
-        name:"多站流量对比分析",path:'/sw/' + route.params.stcd+"/dzll"
-      },{
-        name:"多站水质对比分析",path:'/sw/' + route.params.stcd+"/dzll"
-      },{
-        name:"站点管理",path:""
-      }] }
+          name: '智慧运维', path: '/intelloper/' + route.params.stcd
+        }, {
+          name: '测站运维', path: '/sw/' + route.params.stcd + '/shebei'
+        }]
+    },
+    {
+      name: '业务管理', path: '/index', type: 'right', style: {}, secMenu: [{
+        name: '实时监测', path: '/sw/' + route.params.stcd + '/sw'
+      }, {
+        name: '查询分析', path: '/sw/' + route.params.stcd + '/flow'
+      }]
+    }
   ]
 })
 
 const date = ref('')
 const time = ref('')
+const lunarDay = ref('')
 let tm = null
 const weather = ref('')
 const location = ref('')
@@ -78,15 +58,25 @@ function titleChange(path) {
   if (path.indexOf('63304700') > -1) {
     navbarTitleImage.value = new URL('@/assets/images/layout/header-title-tsq.png', import.meta.url).href
   } else {
-    navbarTitleImage.value = new URL('@/assets/images/layout/header-title3.png', import.meta.url).href
+    navbarTitleImage.value = new URL('@/assets/images/layout/header-zh.png', import.meta.url).href
   }
 }
 
 function getDateTime() {
-  const datetime = formatd(new Date(), 'yyyy-MM-dd hh:mm:ss')
+  const curdate = new Date()
+
+  const datetime = formatd(curdate, 'yyyy-MM-dd hh:mm:ss')
   date.value = datetime.split(' ')[0]
   time.value = datetime.split(' ')[1]
 
+  // 农历
+  // 初始化日历
+  const curYear = curdate.getFullYear() // 当前年份
+  const curMonth = curdate.getMonth() + 1 // 当前月份
+  const curDay = curdate.getDate() // 当前日期
+  const lunarDate = getLunar(curYear, curMonth, curDay)
+  lunarDay.value = lunarDate.lunarYear + lunarDate.dateStr
+
   if (tm !== time.value.substring(0, 5)) {
     tm = time.value.substring(0, 5)
     // Setting.setTime(tm)
@@ -146,23 +136,24 @@ onUnmounted(() => {
                  <arrow-down />
                </el-icon>
             </span>
-           <template #dropdown>
+            <template #dropdown>
               <el-dropdown-menu>
-                <el-dropdown-item v-for="i in item.secMenu" @click="jumpPage(i.path)">{{i.name}}</el-dropdown-item>
+                <el-dropdown-item v-for="i in item.secMenu" @click="jumpPage(i.path)">{{ i.name }}</el-dropdown-item>
               </el-dropdown-menu>
-           </template>
+            </template>
           </el-dropdown>
         </div>
       </div>
     </div>
-    <div class="weather-and-time">
-      <div class="weather-and-loc">
-        <div class="weather">{{ weather }}</div>
-        <div class="loc">{{ location }}</div>
-      </div>
-      <div class="datetime">
-        <div class="time">{{ time }}</div>
-        <div class="date">{{ date }}</div>
+    <div class="weather-and-loc">
+      <div class="weather">{{ weather }}</div>
+      <div class="loc">{{ location }}</div>
+    </div>
+    <div class="date-and-time">
+      <div class="time">{{ time }}</div>
+      <div class="date">
+        <div>{{ date }}</div>
+        <div>{{ lunarDay }}</div>
       </div>
     </div>
   </div>
@@ -205,13 +196,16 @@ onUnmounted(() => {
     .right-menu-list {
       margin-left: 16%;
     }
+
     .right-menu-list .el-dropdown-link {
       color: #fff;
       font-size: 1.2rem;
     }
+
     :deep(.el-tooltip__trigger:focus-visible) {
       outline: unset;
     }
+
     .menu-item {
       width: 15rem;
       height: 3rem;
@@ -230,7 +224,26 @@ onUnmounted(() => {
 
   }
 
-  .weather-and-time {
+  .weather-and-loc {
+    position: fixed;
+    top: 2vh;
+    left: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    font-weight: bold;
+    font-size: 1.2rem;
+    line-height: 1.2rem;
+    padding: 0 10px;
+
+    .loc {
+      text-align: right;
+      font-size: 0.8rem;
+    }
+
+  }
+
+  .date-and-time {
     position: fixed;
     top: 2vh;
     right: 0;
@@ -240,24 +253,16 @@ onUnmounted(() => {
     font-size: 1.2rem;
     line-height: 1.2rem;
 
-    .weather-and-loc {
+    .time {
       padding: 0 10px;
       border-right: 2px solid #fff;
 
-      .loc {
-        text-align: right;
-        font-size: 0.8rem;
-      }
-
     }
 
-    .datetime {
+    .date {
+      text-align: center;
       padding: 0 10px;
-
-      .date {
-        font-size: 0.8rem;
-      }
-
+      font-size: 0.8rem;
     }
 
   }