公司信息展示-企业简介

src/layout/company/navBar.vue

@@ -105,7 +105,7 @@ const handleToPersonalCenter = () => {
   // router.push({ path: '/personalCenter' })
 }
 const handleEnterpriseClick = () => {
-  router.push({ path: '/enterprise/enterpriseCenter' })
+  router.push({ path: '/enterprise/enterpriseCenter?key=briefIntroduction' })
 }
 
 // 退出登录

src/views/enterprise/enterpriseCenter/components/introduction.vue

@@ -0,0 +1,70 @@
+<!-- 公司简介 -->
+<template>
+  <div>
+    <h4 class="mb-1">公司简介</h4>
+    <div class="requirement" v-html="props.info.enterprise?.introduce?.replace(/\n/g, '</br>')"></div>
+    <v-divider class="my-3"></v-divider>
+    <h4>作息时间</h4>
+    <div>
+      <v-icon class="mr-2" size="25" color="primary">mdi-alarm</v-icon>
+      <span class="workAndRest">{{ props.info.enterprise?.time }}</span>
+      <v-icon class="mr-2 ml-4" size="25" color="primary">mdi-calendar-range</v-icon>
+      <span class="workAndRest">{{ props.info.enterprise?.restType }}</span>
+    </div>
+    <v-divider class="my-3"></v-divider>
+    <h4>企业福利</h4>
+    <div class="welfare-tags">
+      <v-chip size="small" label v-for="(k, i) in info.enterprise?.welfareList" :key="i" class="mb-2 welfare-tags-item ellipsis" color="primary">{{ k }}</v-chip>
+    </div>
+    <v-divider class="my-3"></v-divider>
+    <h4 class="mb-1">关于我们</h4>
+    <div class="requirement" v-html="props.info.enterprise?.aboutUs?.replace(/\n/g, '</br>')"></div>
+  </div>
+</template>
+
+<script setup>
+defineOptions({name: 'enterprise-enterpriseCenter-introduction'})
+
+const props = defineProps({
+  info: {
+    type: Object,
+    default: () => {}
+  }
+})
+</script>
+
+<style scoped lang="scss">
+h4 { margin-bottom: 8px; }
+.requirement {
+  white-space: pre-wrap;
+  word-break: break-all;
+  line-height: 28px;
+  color: #333;
+  font-size: 15px;
+  text-align: justify;
+  letter-spacing: 0;
+  // width: 60%;
+}
+.workAndRest {
+  color: #666;
+  font-size: 15px;
+}
+.welfare-tags {
+  display: flex;
+  // width: 242px;
+  flex-wrap: wrap;
+  // height: 100px;
+  // overflow: hidden;
+  text-align: center;
+}
+.welfare-tags-item {
+  display: block;
+  width: 117px;
+  max-width: 117px;
+  text-align: center;
+  line-height: 26px;
+  margin-right: 8px;
+  // &:nth-child(2n) { margin-right: 0; }
+}
+</style>
+