zhaochongyi
2024-08-30 7f164af532f66aff71419682c5b3f531b606983a
frontend/src/layouts/AppSider.vue
@@ -8,6 +8,12 @@
          :selectedKeys="[current]"
          @click="menuHandle"
      ></a-menu>
      <div class="sb">
        <a-tag :color="getServerStatusColor" >
          {{ getServerStatusText }}
        </a-tag>
         <span class="tip">读写器</span>
      </div>
    </a-layout-sider>
    <a-layout-content>
        <router-view />
@@ -15,9 +21,13 @@
  </a-layout>
</template>
<script setup>
import {ref, h, watch} from "vue";
  import {CloudServerOutlined,CreditCardOutlined,SettingOutlined} from '@ant-design/icons-vue';
import {ref, h, watch, computed} from "vue";
import {ipc} from '@/utils/ipcRenderer'
  import {CloudServerOutlined,CreditCardOutlined,SettingOutlined,SyncOutlined} from '@ant-design/icons-vue';
  import router from "@/router";
import {useRoute} from "vue-router";
  const route = useRoute();
  const menu = ref([
    {label: '通讯设置', key: 'Communication',icon:  h(CloudServerOutlined)},
    {label: '卡片设置', key: 'Card', icon: h(CreditCardOutlined)},
@@ -30,12 +40,30 @@
    current.value = e ? e.key: current.value;
    router.push({name: current.value});
  }
  current.value = router.currentRoute.value.name?router.currentRoute.value.name :'Communication'
  const status = ref(0);
  const getServerStatusColor = computed(()=>{
    if (status.value === 0){
      return 'error'
    }else if (status.value === 1){
      return 'success'
    }
  })
const getServerStatusText = computed(()=>{
    if (status.value === 0){
      return '未连接'
    }else if (status.value === 1){
      return '已连接'
    }
  })
 ipc.on('controller.icrf.service',(event,result)=>{
   console.log(result)
   status.value = result.status >0?1:0;
 })
  watch(()=>route.name,(val)=>{
    current.value = val;
  })
</script>
<style scoped lang="less">
#app-layout-sider{
@@ -52,4 +80,13 @@
  }
}
.sb{
  position: absolute;
  bottom: 10px;
  text-align: center;
  width: 100%;
  .tip{
    font-size: 12px;
  }
}
</style>