86 lines
3.7 KiB
JavaScript
86 lines
3.7 KiB
JavaScript
|
import __nuxt_component_0 from "../node_modules/nuxt/dist/app/components/nuxt-link.mjs";
|
||
|
|
import { defineComponent, ref, withCtx, createVNode, createTextVNode, toDisplayString } from "vue";
|
||
|
|
import { ssrRenderClass, ssrRenderComponent, ssrRenderList, ssrInterpolate } from "vue/server-renderer";
|
||
|
|
import { useRoute } from "vue-router";
|
||
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
||
|
|
__name: "NavBar",
|
||
|
|
__ssrInlineRender: true,
|
||
|
|
setup(__props) {
|
||
|
|
useRoute();
|
||
|
|
const mobileMenuOpen = ref(false);
|
||
|
|
const scrolled = ref(false);
|
||
|
|
const navItems = [
|
||
|
|
{ name: "首页", path: "/" },
|
||
|
|
{ name: "AWS产品", path: "/products" },
|
||
|
|
{ name: "解决方案", path: "/solutions" },
|
||
|
|
{ name: "客户案例", path: "/cases" },
|
||
|
|
{ name: "关于我们", path: "/about" },
|
||
|
|
{ name: "联系我们", path: "/contact" }
|
||
|
|
];
|
||
|
|
return (_ctx, _push, _parent, _attrs) => {
|
||
|
|
const _component_NuxtLink = __nuxt_component_0;
|
||
|
|
_push(`<!--[--><nav class="${ssrRenderClass(["bg-primary shadow-md fixed w-full z-50", { "nav-scrolled": scrolled.value }])}"><div class="container"><div class="flex items-center justify-between h-16">`);
|
||
|
|
_push(ssrRenderComponent(_component_NuxtLink, {
|
||
|
|
to: "/",
|
||
|
|
class: "flex items-center text-white"
|
||
|
|
}, {
|
||
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
||
|
|
if (_push2) {
|
||
|
|
_push2(`<i class="fas fa-cloud text-2xl mr-2"${_scopeId}></i><span class="text-xl font-bold"${_scopeId}>云服务专家</span>`);
|
||
|
|
} else {
|
||
|
|
return [
|
||
|
|
createVNode("i", { class: "fas fa-cloud text-2xl mr-2" }),
|
||
|
|
createVNode("span", { class: "text-xl font-bold" }, "云服务专家")
|
||
|
|
];
|
||
|
|
}
|
||
|
|
}),
|
||
|
|
_: 1
|
||
|
|
}, _parent));
|
||
|
|
_push(`<div class="hidden md:flex items-center space-x-8"><!--[-->`);
|
||
|
|
ssrRenderList(navItems, (item, index) => {
|
||
|
|
_push(ssrRenderComponent(_component_NuxtLink, {
|
||
|
|
key: index,
|
||
|
|
to: item.path,
|
||
|
|
class: ["text-white/85 hover:text-secondary transition-colors duration-300", { "text-white": _ctx.$route.path === item.path }]
|
||
|
|
}, {
|
||
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
||
|
|
if (_push2) {
|
||
|
|
_push2(`${ssrInterpolate(item.name)}`);
|
||
|
|
} else {
|
||
|
|
return [
|
||
|
|
createTextVNode(toDisplayString(item.name), 1)
|
||
|
|
];
|
||
|
|
}
|
||
|
|
}),
|
||
|
|
_: 2
|
||
|
|
}, _parent));
|
||
|
|
});
|
||
|
|
_push(`<!--]--></div><button class="md:hidden text-white p-2 rounded-lg hover:bg-white/10 transition-colors duration-300" aria-label="打开菜单"><i class="fas fa-bars text-xl"></i></button></div><div class="${ssrRenderClass(["md:hidden bg-primary absolute top-16 left-0 right-0 shadow-lg", { "hidden": !mobileMenuOpen.value }])}"><div class="container py-4"><div class="flex flex-col space-y-4"><!--[-->`);
|
||
|
|
ssrRenderList(navItems, (item, index) => {
|
||
|
|
_push(ssrRenderComponent(_component_NuxtLink, {
|
||
|
|
key: index,
|
||
|
|
to: item.path,
|
||
|
|
class: ["text-white/85 hover:text-secondary transition-colors duration-300 py-2", { "text-white": _ctx.$route.path === item.path }],
|
||
|
|
onClick: ($event) => mobileMenuOpen.value = false
|
||
|
|
}, {
|
||
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
||
|
|
if (_push2) {
|
||
|
|
_push2(`${ssrInterpolate(item.name)}`);
|
||
|
|
} else {
|
||
|
|
return [
|
||
|
|
createTextVNode(toDisplayString(item.name), 1)
|
||
|
|
];
|
||
|
|
}
|
||
|
|
}),
|
||
|
|
_: 2
|
||
|
|
}, _parent));
|
||
|
|
});
|
||
|
|
_push(`<!--]--></div></div></div></div></nav><div class="h-16"></div><!--]-->`);
|
||
|
|
};
|
||
|
|
}
|
||
|
|
});
|
||
|
|
export {
|
||
|
|
_sfc_main as default
|
||
|
|
};
|
||
|
|
//# sourceMappingURL=NavBar.vue2.mjs.map
|