u

code/link56/link56-frontend-new/src/views/auth/forget.vue

@@ -134,6 +134,7 @@ function onSubmit() {
   display: flex;
   height: 100vh;
   overflow: hidden;
+  background-color: #fff;
 
   .auth-bg {
     width: 70%;

code/link56/link56-frontend-new/src/views/auth/login.vue

@@ -351,7 +351,7 @@ function navigateTo(path: string) {
   display: flex;
   height: 100vh;
   overflow: hidden;
-
+  background-color: #fff;
   .auth-bg {
     width: 70%;
     height: 100%;

code/link56/link56-frontend-new/src/views/company/detail/index.vue

@@ -0,0 +1,235 @@
+<script lang="ts" setup>
+import type { CompanyDetail } from '@/types/company'
+import { ElMessage } from 'element-plus'
+import { onMounted, ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import WangEditor from '@/components/wang-editor/index.vue'
+import { getCompanyDetailApi } from '@/request/api/company'
+
+const route = useRoute()
+const router = useRouter()
+
+const companyId = ref<number>(0)
+
+const companyDetail = ref<CompanyDetail>({
+  id: 0,
+  name: '',
+  areas: [],
+  industries: [],
+  logo: '',
+  profile: '',
+  phone: '',
+  email: '',
+  description: '',
+  users: [],
+})
+
+onMounted(() => {
+  companyId.value = Number(route.query.id) || 0
+
+  if (!companyId.value) {
+    router.push('/')
+    return
+  }
+
+  getCompanyDetailApi(companyId.value).then((res) => {
+    if (res.isSuccess) {
+      companyDetail.value = res.data
+    }
+    else {
+      ElMessage.error(res.message || '加载公司信息失败，请稍后再试')
+      router.push('/')
+    }
+  }).catch((err) => {
+    console.log(err)
+    ElMessage.error('加载公司信息失败，请稍后再试')
+  })
+})
+</script>
+
+<template>
+  <div class="company-detail-page">
+    <div class="detail-container">
+      <div class="header-region">
+        <el-avatar shape="square" :size="64" class="logo" :src="companyDetail.logo || '/no-avatar.png'" />
+        <div class="info">
+          <div class="title">
+            <span>{{ companyDetail.name }}</span>
+          </div>
+          <div class="tag-section">
+            <el-tag v-for="item in companyDetail.industries" :key="item" type="primary">
+              {{ item }}
+            </el-tag>
+          </div>
+        </div>
+      </div>
+
+      <div class="info-region">
+        <div id="basic" class="info-item">
+          <div class="info-header">
+            <span class="info-title">基础信息</span>
+          </div>
+
+          <el-descriptions border>
+            <el-descriptions-item label="电话">
+              {{ companyDetail.phone || '-' }}
+            </el-descriptions-item>
+            <el-descriptions-item label="邮箱">
+              {{ companyDetail.email || '-' }}
+            </el-descriptions-item>
+            <el-descriptions-item label="成立日期">
+              -
+            </el-descriptions-item>
+            <el-descriptions-item label="区域">
+              {{ companyDetail.areas.join('/') || '-' }}
+            </el-descriptions-item>
+            <el-descriptions-item label="详细地址" :span="2">
+              -
+            </el-descriptions-item>
+          </el-descriptions>
+        </div>
+
+        <div id="profile" class="info-item">
+          <div class="info-header">
+            <span class="info-title">公司简介</span>
+          </div>
+          <span class="company-profile">
+            {{ companyDetail.profile || '-' }}
+          </span>
+        </div>
+
+        <div id="users" class="info-item">
+          <div class="info-header">
+            <span class="info-title">公司成员</span>
+          </div>
+          <el-table :data="companyDetail.users" style="width: 100%" stripe border>
+            <el-table-column prop="name" label="姓名" width="180" />
+            <el-table-column prop="position" label="职务" width="180" />
+            <el-table-column prop="phone" label="手机号" width="180" />
+            <el-table-column prop="email" label="邮箱号" width="180" />
+            <el-table-column fixed="right" label="操作" min-width="120">
+              <template #default>
+                <el-button type="primary" size="small" text bg>
+                  发起聊天
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+
+        <div id="description" class="info-item">
+          <div class="info-header">
+            <span class="info-title">公司详细介绍</span>
+          </div>
+          <WangEditor v-model="companyDetail.description" mode="view" />
+        </div>
+      </div>
+    </div>
+    <div class="anchor-container">
+      <el-affix :offset="80">
+        <div class="anchor-title">
+          导航
+        </div>
+        <el-anchor :offset="70">
+          <el-anchor-link href="#basic">
+            基础信息
+          </el-anchor-link>
+          <el-anchor-link href="#profile">
+            公司简介
+          </el-anchor-link>
+          <el-anchor-link href="#users">
+            公司成员
+          </el-anchor-link>
+          <el-anchor-link href="#description">
+            公司详细介绍
+          </el-anchor-link>
+        </el-anchor>
+      </el-affix>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.company-detail-page {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  padding: 48px 0px;
+
+  .detail-container {
+    width: 1250px;
+
+    .header-region {
+      padding: 20px;
+      background-color: #fff;
+      display: flex;
+      .info {
+        margin-left: 16px;
+
+        .title {
+          font-weight: bold;
+          font-size: 22px;
+        }
+
+        .tag-section {
+          margin-top: 4px;
+          > * {
+            margin-right: 16px;
+          }
+        }
+      }
+    }
+
+    .info-region {
+      margin-top: 36px;
+      background-color: #fff;
+      padding: 16px;
+
+      .info-item {
+        margin-bottom: 24px;
+
+        :deep(.el-table__header) {
+          .el-table__cell {
+            background-color: #f5f7fa;
+          }
+        }
+      }
+
+      .info-header {
+        height: 32px;
+        margin-bottom: 10px;
+
+        .info-title {
+          font-weight: 600;
+          font-size: 18px;
+        }
+      }
+
+      .company-profile {
+        word-break: break-all;
+        color: #333;
+        font-size: 14px;
+        line-height: 1.6;
+      }
+    }
+  }
+
+  .anchor-container {
+    min-width: 200px;
+    margin-left: 40px;
+    .anchor-title {
+      background-color: #fff;
+      font-weight: 600;
+      font-size: 14px;
+      line-height: 30px;
+      padding-left: 14px;
+      border-top-left-radius: 4px;
+      border-top-right-radius: 4px;
+    }
+    :deep(.el-anchor) {
+      border-bottom-left-radius: 4px;
+      border-bottom-right-radius: 4px;
+    }
+  }
+}
+</style>

code/link56/link56-frontend-new/src/views/company/index.vue

@@ -1,23 +1,275 @@
 <script lang="ts" setup>
+import type { CompanyListItem } from '@/types/company'
+import { ElMessage } from 'element-plus'
+import { onMounted, reactive, ref } from 'vue'
+import { useRouter } from 'vue-router'
 import QueryCompany from '@/components/QueryCompany.vue'
+import { queryCompanyApi } from '@/request/api/company'
+import { useCommonStore } from '@/store/common'
+
+const router = useRouter()
+const commonStore = useCommonStore()
+
+const page = reactive<Pagination>({
+  current: 1,
+  pageSize: 10,
+  total: 0,
+})
+
+const loading = ref<boolean>(true)
+
+const companyList = ref<CompanyListItem[]>([])
+
+onMounted(() => {
+  getCompanyList()
+})
+
+function getCompanyList() {
+  loading.value = true
+
+  queryCompanyApi({
+    currentPage: page.current,
+    pageSize: page.pageSize,
+
+    areas: commonStore.companyQuery.areas.map((item: string[]) => item.join(',')),
+    industries: commonStore.companyQuery.industries,
+    name: commonStore.companyQuery.name,
+  }).then((res) => {
+    if (res.isSuccess) {
+      companyList.value = res.data.records
+      page.total = res.data.total
+    }
+    else {
+      ElMessage.error(res.message || '加载失败，请稍后再试')
+    }
+  }).catch((err) => {
+    console.log(err)
+    ElMessage.error('加载失败，请稍后再试')
+  }).finally(() => {
+    loading.value = false
+  })
+}
+
+function toDetail(data: CompanyListItem) {
+  router.push({
+    path: '/company/detail',
+    query: {
+      id: data.id,
+    },
+  })
+}
 </script>
 
 <template>
-  <div class="wrapper">
-    <div class="query">
-      <QueryCompany style="width: 1200px;" />
+  <div class="company-wrapper">
+    <div class="company-container">
+      <QueryCompany @search="getCompanyList()" />
+
+      <div class="list-container">
+        <div class="list-header">
+          <div class="search-title">
+            为您找到
+            <span>
+              {{ page.total }}
+            </span>
+            条相关企业
+          </div>
+        </div>
+        <div class="company-list">
+          <div v-for="item in companyList" :key="item.id" class="company-item">
+            <el-avatar shape="square" :src="item.logo || '/no-avatar.png'" :size="70" class="company-logo" />
+
+            <div class="company-info">
+              <div class="company-header">
+                <div class="company-name">
+                  {{ item.name }}
+                </div>
+              </div>
+              <div class="company-tags">
+                <el-tag v-for="tag in item.industries" :key="tag" type="primary" effect="dark">
+                  {{ tag }}
+                </el-tag>
+              </div>
+              <p class="company-profile">
+                {{ item.profile || '-' }}
+              </p>
+              <div class="company-footer">
+                <div class="company-details">
+                  <div class="detail-item">
+                    <i-material-symbols:location-on />
+                    <span>{{ item.areas.join('/') || '___' }}</span>
+                  </div>
+                  <div class="detail-item">
+                    <i-material-symbols:mail />
+                    <span>{{ item.email || '___' }}</span>
+                  </div>
+                  <div class="detail-item">
+                    <i-material-symbols:call />
+                    <span>{{ item.phone || '___' }}</span>
+                  </div>
+                </div>
+                <div class="company-actions">
+                  <el-button @click="toDetail(item)">
+                    <i-ri:information-2-line />
+                    <span class="button-text">
+                      详细
+                    </span>
+                  </el-button>
+
+                  <el-button type="primary">
+                    <i-ri:message-3-fill />
+                    <span class="button-text">
+                      发起聊天
+                    </span>
+                  </el-button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div class="company-pagination">
+        <el-pagination
+          v-model:current-page="page.current"
+          :page-size="page.pageSize"
+          :total="page.total"
+          layout="prev, pager, next"
+          background
+          size="large"
+        />
+      </div>
     </div>
   </div>
 </template>
 
 <style lang="scss" scoped>
-.wrapper {
+.company-wrapper {
   width: 100%;
-  .query {
+  display: flex;
+  justify-content: center;
+
+  .company-container {
+    padding: 48px 0px;
+    width: 1250px;
+  }
+
+  .list-container {
+    display: flex;
+    flex-direction: column;
+    margin-top: 36px;
+
+    .list-header {
+      padding: 16px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      border-bottom: 1px solid #f1f1f1;
+      background-color: #fff;
+      .search-title {
+        font-weight: bold;
+        span {
+          color: red;
+        }
+      }
+    }
+  }
+
+  .company-list {
+    display: flex;
+    flex-direction: column;
+
+    .company-item {
+      background-color: #fff;
+      border-radius: 4px;
+      padding: 13px 26px;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px solid #e0e0e0;
+      &:hover {
+        background-color: #f2f8fe;
+
+        .company-name {
+          color: var(--el-color-primary) !important;
+        }
+      }
+
+      .company-logo {
+        flex-shrink: 0;
+        margin-right: 20px;
+      }
+
+      .company-info {
+        flex: 1;
+
+        .company-header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-bottom: 6px;
+
+          .company-name {
+            font-size: 20px;
+            font-weight: 600;
+            color: #1e293b;
+            cursor: pointer;
+          }
+        }
+
+        .company-tags {
+          margin-bottom: 6px;
+          > * {
+            margin-right: 16px;
+          }
+        }
+
+        .company-profile {
+          color: #64748b;
+          line-height: 1.6;
+          margin-bottom: 8px;
+          font-size: 14px;
+        }
+
+        .company-footer {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+
+          .company-details {
+            display: flex;
+            color: #64748b;
+            font-size: 13px;
+
+            .detail-item {
+              display: flex;
+              align-items: center;
+              margin-right: 16px;
+              span {
+                margin-left: 4px;
+              }
+            }
+          }
+
+          .company-actions {
+            display: flex;
+            > * {
+              margin-left: 12px;
+            }
+
+            .button-text {
+              margin-left: 4px;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .company-pagination {
     display: flex;
     align-items: center;
     justify-content: center;
-    margin-top: 20px;
+    margin: 16px 0px;
   }
 }
 </style>

code/link56/link56-frontend-new/src/views/home/components/recommend.vue

@@ -127,7 +127,6 @@ defineProps({
     }
 
     .area-row:hover {
-      background-color: #f9f9fb;
     }
 
     .area-row:last-child {
@@ -139,7 +138,7 @@ defineProps({
       align-items: center;
       justify-content: center;
       width: 15%;
-      background-color: #f8f9fa;
+      background-color: #fcfcfd;
       color: #34495e;
       font-weight: bold;
       border-right: 1px solid #e0e3e8;

code/link56/link56-frontend-new/src/views/settings/index.vue

@@ -0,0 +1,12 @@
+<script lang="ts" setup>
+</script>
+
+<template>
+  <div class="">
+    settings
+  </div>
+</template>
+
+<style lang="scss" scoped>
+//
+</style>