feat: 详情页样式修改

src/components/common/CommonFooter.vue

 <template>
-  <div class="footer bg-[#1A1A1A] pb-4 pt-3 mt-[30px]">
+  <div class="footer mt-10 bg-[#1A1A1A] pb-4 pt-3">
     <div class="mx-auto w-[1200px]">
       <div class="flex justify-between">
         <div class="flex flex-col justify-between">

src/components/common/ImageList.vue

@@ -8,7 +8,7 @@
         @swiper="setMainSwiper"
         @slide-change="handleSlideChange"
       >
-        <SwiperSlide v-for="(image, index) of imageList" :key="index">
+        <SwiperSlide v-for="(image, index) of imageList" :key="index" class="text-[0px]">
           <CommonImage class="h-[434px] w-full" :src="image" />
         </SwiperSlide>
       </Swiper>
@@ -22,7 +22,7 @@
           free-mode
           @swiper="setThumbsSwiper"
         >
-          <SwiperSlide v-for="(image, index) of images" :key="index">
+          <SwiperSlide v-for="(image, index) of images" :key="index" class="text-[0px]">
             <CommonImage
               class="h-[92px] w-[130px] cursor-pointer rounded"
               :class="{ 'border border-[#2878ff] p-1': index === currentIndex }"

src/components/detail/ContactInfo.vue

 <!-- 联系人信息 -->
 <template>
-  <div class="flex h-[95px] flex-col">
+  <div class="flex flex-col justify-between">
     <div class="flex h-[100px] flex-none items-center justify-between bg-[#FAFAFC] px-10">
       <div class="flex items-center space-x-4">
         <div class="flex items-center justify-center">
@@ -11,7 +11,7 @@
           </div>
         </div>
         <div>
-          <div class="text-center font-yahei text-sm font-bold text-[#1A1A1A]">
+          <div class="text-center font-yahei text-lg font-bold leading-5 text-[#1A1A1A]">
             {{ personName || '暂无对接人' }}
           </div>
           <div class="mt-[5px] rounded-sm text-sm text-[#4F4F4F]">园区对接人</div>
@@ -27,7 +27,7 @@
         </div>
       </div>
     </div>
-    <div class="mt-[68px] flex justify-end px-10">
+    <div class="flex justify-end px-10">
       <div class="w-[68px]">
         <div class="flex items-center justify-center">
           <img src="@/assets/images/app-contact.png" class="h-[68px] w-[68px]" />

src/components/detail/DetailInfo.vue

@@ -3,12 +3,15 @@
     <div v-for="(line, index) of infos" :key="index" class="min-h-10 inline-flex w-full">
       <div v-for="col in line" :key="col.name" class="flex flex-1 text-xs text-[#1A1A1A]">
         <div
-          class="flex w-[160px] flex-none bg-[#FAFAFC] px-[30px] py-[10px] leading-5"
-          :class="{ '!w-[130px] !px-5': col.smallMode }"
+          class="flex w-[200px] flex-none bg-[#FAFAFC] px-[30px] py-[10px] leading-5"
+          :class="{ '!w-[160px] !px-5': col.smallMode }"
         >
           {{ col.name }}
         </div>
-        <div class="flex px-[30px] py-[10px] leading-5 outline outline-1 outline-[#FAFAFC]">
+        <div
+          :class="getValueClass(col, line)"
+          class="flex flex-1 !px-[30px] py-[10px] leading-5 outline outline-1 outline-[#FAFAFC]"
+        >
           <div class="info-value" :class="getValueClass(col, line)">
             {{ handleValue(col) }}
           </div>
@@ -46,12 +49,12 @@ const handleValue = (col: Info) => {
 
 const getValueClass = (col: Info, line: Info[]) => {
   const classList = [];
-  if (line.length === 1) {
+  if (line.length === 1 && col.oneline) {
     classList.push('flex-1');
   } else if (col.smallMode) {
-    classList.push('w-[245px]');
+    classList.push('w-[342px]');
   } else {
-    classList.push('w-[303px]');
+    classList.push('w-[400px]');
   }
 
   if (col.smallMode) {

src/components/detail/DetailMain.vue

@@ -12,7 +12,7 @@
         {{ item.name }}
       </ElBreadcrumbItem>
     </ElBreadcrumb>
-    <div class="mt-5 py-5">
+    <div class="py-5">
       <div class="flex h-10 items-center">
         <div class="font-yahei text-[32px] font-bold leading-10 text-[#333333]">
           {{ detail.name }}
@@ -33,34 +33,34 @@
         <div class="mt-4">
           <ImageList :images="detail.imgUrlList"></ImageList>
         </div>
-        <div class="ml-4 mt-4 flex flex-col">
+        <div class="ml-[30px] mt-4 flex flex-col">
           <div>
             <div class="flex items-center space-x-[30px] font-yahei">
               <slot></slot>
             </div>
             <div class="mt-3">
               <div v-if="detail.investmentDetails.length" class="flex">
-                <div class="flex h-[22px] items-center font-yahei text-xs leading-5 text-[#4D4D4D]">
+                <div class="flex h-[38px] items-center font-yahei text-xs leading-5 text-[#4D4D4D]">
                   {{ isLand ? '产业方向' : '招商方向' }}
                 </div>
                 <div class="ml-[30px] flex flex-1 flex-wrap gap-[10px]">
                   <div
                     v-for="invest of formatedInvestmentDetails"
                     :key="invest.codeName"
-                    class="flex h-[22px] items-center rounded-sm bg-[#4F4F4F14] px-3 text-xs leading-[18px] text-[#4F4F4F]"
+                    class="flex h-[38px] items-center rounded-sm bg-[#4F4F4F14] px-3 text-xs leading-[18px] text-[#4F4F4F]"
                   >
                     {{ invest.codeName }}
                   </div>
                 </div>
               </div>
               <div v-if="area" class="mt-[13px] flex items-center">
-                <div class="flex h-[22px] items-center font-yahei text-xs leading-5 text-[#4D4D4D]">
+                <div class="flex h-[38px] items-center font-yahei text-xs leading-5 text-[#4D4D4D]">
                   所属地区
                 </div>
                 <div class="ml-[30px] font-yahei text-xs leading-5 text-[#1A1A1A]">{{ area }}</div>
               </div>
               <div v-if="detail.address" class="mt-2 flex items-center">
-                <div class="flex h-[22px] items-center font-yahei text-xs leading-5 text-[#4D4D4D]">
+                <div class="flex h-[38px] items-center font-yahei text-xs leading-5 text-[#4D4D4D]">
                   详细地址
                 </div>
                 <div class="ml-[30px] font-yahei text-xs leading-5 text-[#1A1A1A]">
@@ -69,9 +69,10 @@
               </div>
             </div>
           </div>
-          <div class="mt-[72px]">
+          <div class="mt-[68px] flex-1">
             <ContactInfo
               :id="detail.id"
+              class="h-full"
               :person-name="detail.contactPerson"
               :detail-type="type"
             ></ContactInfo>
@@ -194,7 +195,7 @@ const breadcrumbs = computed(() => {
       searchParams: {},
     },
     {
-      name: getName(provinceName).replace('市', ''),
+      name: getName(provinceName),
       searchParams: { provinceName },
     },
     {

src/components/detail/DetailMainInfo.vue

@@ -2,7 +2,7 @@
 <template>
   <div
     v-if="value"
-    class="flex h-[60px] w-[117px] flex-col items-center justify-center bg-[#FAFAFC]"
+    class="flex h-[80px] w-[164px] flex-col items-center justify-center bg-[#FAFAFC]"
   >
     <div class="text-base font-bold leading-5 text-[#1A1A1A]">{{ value + unit }}</div>
     <div class="mt-1 text-xs leading-5 text-[#4D4D4D]">{{ name }}</div>

src/components/detail/MiniListItem.vue

 <!-- 产业园、开发区内的载体、土地项 -->
 <template>
-  <div v-if="detail" class="w-[214px]">
+  <div v-if="detail" class="w-[272px]">
     <div @click="handleDetail">
-      <CommonImage class="h-[161px] w-full cursor-pointer rounded-sm" :src="detail.imgUrl" />
+      <CommonImage class="h-[204px] w-full cursor-pointer rounded-sm" :src="detail.imgUrl" />
     </div>
-    <div class="mt-3 cursor-pointer font-yahei text-base text-[#1A1A1A]" @click="handleDetail">
+    <div
+      class="mt-3 cursor-pointer font-yahei text-lg leading-6 text-[#1A1A1A]"
+      @click="handleDetail"
+    >
       {{ detail.name }}
     </div>
     <div class="mt-1 font-yahei text-xs text-[#4D4D4D]">

src/views/develop/DevelopZoneDetail.vue

@@ -158,7 +158,7 @@ const [industryPolicyIndex, industryPolicyTabs, industryPolicy] = useInfoTab<Pol
       [
         {
           name: '政策内容',
-          value: content,
+          value: content + content + content + content,
           customClass: 'ell3',
           oneline: true,
         },