将行业热门话题洞察的需要修改成columns

src/components/_base/navbar/index.vue

@@ -10,7 +10,9 @@ const clickExit = () => {
 };
 const getMenus = async () => {
   const res = await fetchMenusTree();
-  lists.value = res;
+  if (res.code == 200) {
+    lists.value = res.data;
+  }
 };
 onMounted(() => {
   getMenus();

src/components/container.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="container">
+    <div class="flex item-center arco-row-justify-space-between">
+      <h1 class="title">{{ props.title }}</h1>
+      <slot name="header"></slot>
+    </div>
+    <div>
+      <slot></slot>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+const props = defineProps<{
+  title: string;
+}>();
+</script>
+<style scoped lang="less">
+.container {
+  border: 1px solid var(--BG-300, rgba(230, 230, 232, 1));
+  background: var(--BG-white, rgba(255, 255, 255, 1));
+  padding: 16px 24px 20px 24px;
+  border-radius: 8px;
+}
+.title {
+  font-family: Alibaba PuHuiTi, serif;
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 24px;
+  vertical-align: middle;
+  margin: 0;
+  padding: 0;
+}
+</style>

src/components/customer-service-modal.vue

@@ -0,0 +1,12 @@
+<template>
+  <Modal title="扫描下面二维码联系客户" v-bind="$attrs">
+    <div class="text-center mt-16px mb-16px">
+      <img width="200" src="@/assets/customer-service.svg" alt="" />
+    </div>
+  </Modal>
+</template>
+<script setup lang="ts">
+import Modal from '@/components/modal.vue';
+</script>
+<style lang="less">
+</style>

src/components/delete-modal.vue

@@ -0,0 +1,58 @@
+<template>
+  <a-modal modal-class="delete-modal" body-class="body" cancel-text="返回" ok-text="确定删除" v-bind="$attrs">
+    <h2 class="delete-modal-title flex item-center">
+      <img src="@/assets/warning.svg" alt="" />
+      {{ $attrs.title }}
+    </h2>
+    <slot></slot>
+  </a-modal>
+</template>
+<script setup lang="ts">
+</script>
+<style lang="less">
+:deep(.arco-btn-status-danger) {
+  background-color: red !important;
+  width: 1000px !important;
+}
+.delete-modal {
+  .arco-modal-header {
+    display: none;
+  }
+  .delete-modal-title {
+    margin-top: 24px;
+    font-family: Alibaba PuHuiTi, serif;
+    font-weight: 400;
+    font-size: 14px;
+    color: var(--Text-1, rgba(33, 31, 36, 1));
+    img {
+      width: 20px;
+      height: 20px;
+      margin-right: 12px;
+    }
+  }
+  .arco-modal-footer {
+    border-top: none;
+    :first-child {
+      border: 1px solid var(--BG-500, rgba(177, 178, 181, 1));
+      border-radius: 4px;
+      padding: 7px 20px;
+      font-family: Alibaba PuHuiTi, serif;
+      font-weight: 400;
+      font-size: 14px;
+    }
+    :last-child {
+      border-radius: 4px;
+      padding: 7px 20px;
+      font-family: Alibaba PuHuiTi, serif;
+      font-weight: 400;
+      font-size: 14px;
+      margin-left: 16px;
+      border-color: var(--Functional-Danger-6, rgba(246, 75, 49, 1)) !important;
+      background-color: var(--Functional-Danger-6, rgba(246, 75, 49, 1)) !important;
+    }
+  }
+}
+.body {
+  padding: 0 24px;
+}
+</style>

src/components/join-modal.vue

@@ -0,0 +1,47 @@
+<template>
+  <Modal title="加入企业" @ok="handleJoin">
+    <div v-if="enterprise" class="join-body flex item-center">
+      <img src="@/assets/warning.svg" alt="" />
+      {{ `确定加入 “${enterprise.name}”吗？` }}
+    </div>
+  </Modal>
+</template>
+<script setup lang="ts">
+import Modal from '@components/modal.vue';
+import { ref, onMounted } from 'vue';
+import { getQueryParam } from '@/utils/helper';
+
+import { getEnterpriseByInviteCode, joinEnterpriseByInviteCode } from '@/api/all';
+const enterprise = ref();
+const inviteCode = ref();
+
+async function getEnterprise() {
+  inviteCode.value = getQueryParam('invite_code');
+  if (inviteCode.value) {
+    enterprise.value = await getEnterpriseByInviteCode(inviteCode.value);
+  }
+}
+
+async function handleJoin() {
+  await joinEnterpriseByInviteCode(inviteCode.value);
+  AMessage.success('加入成功');
+}
+onMounted(() => {
+  getEnterprise();
+});
+</script>
+<style lang="less">
+.join-body {
+  margin: 0;
+  font-family: Alibaba PuHuiTi, serif;
+  font-weight: 400;
+  font-size: 14px;
+  color: var(--Text-1, rgba(33, 31, 36, 1));
+  img {
+    width: 20px;
+    height: 20px;
+    margin-right: 12px;
+    margin-left: 0;
+  }
+}
+</style>

src/components/modal.vue

@@ -0,0 +1,38 @@
+<template>
+  <a-modal title-align="start" modal-class="modal" body-class="body" v-bind="$attrs" >
+    <slot></slot>
+  </a-modal>
+</template>
+<script setup lang="ts">
+
+</script>
+<style lang="less">
+.modal {
+  .arco-modal-header {
+    border-bottom: none;
+  }
+  .arco-modal-footer {
+    border-top: none;
+    :first-child {
+      border: 1px solid var(--BG-500, rgba(177, 178, 181, 1));
+      border-radius: 4px;
+      padding: 7px 20px;
+      font-family: Alibaba PuHuiTi, serif;
+      font-weight: 400;
+      font-size: 14px;
+    }
+    :last-child {
+      border-radius: 4px;
+      padding: 7px 20px;
+      font-family: Alibaba PuHuiTi, serif;
+      font-weight: 400;
+      font-size: 14px;
+      margin-left: 16px;
+    }
+  }
+}
+.body {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+</style>