소스 검색

职位详情样式调整

Xiao_123 1 개월 전
부모
커밋
d7f1afb666
3개의 변경된 파일270개의 추가작업 그리고 253개의 파일을 삭제
  1. 2 1
      pages.json
  2. 248 226
      pagesB/positionDetail/index.vue
  3. 20 26
      static/style/position/index.scss

+ 2 - 1
pages.json

@@ -266,7 +266,8 @@
 				{
 					"path": "positionDetail/index",
 					"style": {
-						"navigationBarTitleText": "职位详情"
+						"navigationBarTitleText": "职位详情",
+						"navigationStyle": "custom"
 					}
 				},
 				{

+ 248 - 226
pagesB/positionDetail/index.vue

@@ -1,226 +1,242 @@
 <template>
-  <layout-page>
-    <scroll-view class="scrollBox" style="position:relative;">
-      <view class="box">
-        <view v-if="loading" class="vertical80-center">{{ loadingText }}</view>
-        <view v-else>
-          <view class="mt-5" style="display: flex;">
-            <!-- 赏金 -->
-            <view v-if="info.hire && info.hirePrice" class="hirePrice ss-m-r-10 d-flex align-center">
-              <view class="iconfont icon-a-1_zhaopin ss-m-r-10" style="color: #e03506; font-size: 20px;"></view>
-              <view>{{ `赏金:${commissionCalculation(info.hirePrice / 100, 1)}元` }}</view>
-            </view>
-            <image v-if="isJobFair" src="/static/svg/jobFair.svg" class="ss-m-r-10" style="width: 30px; height: 30px;"></image>
-            <!-- 职位名称 -->
-            <h2 class="JobName" style="flex: 1;">{{ formatName(info.name) }}</h2>
-          </view>
-          <!-- 职位地区 -->
-          <view class="d-flex justify-space-between mt-5 align-center">
-            <view style="font-size: 14px; flex: 1; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-right: 30px;">
-              <span>
-                <span>{{positionInfo?.area?.str ?? '全国' }}</span>
-                <span class="viewider-mx" v-if="positionInfo?.eduName">|</span>
-                <span>{{positionInfo?.eduName }}</span>
-                <span class="viewider-mx" v-if="positionInfo?.expName">|</span>
-                <span>{{positionInfo?.expName }}</span>
-              </span>
-            </view>
-          </view>
-          <view class="d-flex justify-space-between mt-5 align-center">
-            <!-- 收藏职位 -->
-            <view @click="handleCollection" style="width: 36px;">
-              <uni-icons
-                :type="isCollection ? 'heart-filled' : 'heart'"
-                color="#fc6d5e"
-                class="mr"
-                size="25"
-              ></uni-icons>
-            </view>
-            <!-- 薪资 -->
-            <view>
-              <span v-if="!info.payFrom && !info.payTo" class="salary w-600">面议</span>
-              <span v-else class="salary w-600">{{ info.payFrom }}-{{ info.payTo }}/{{ positionInfo.payName }}</span>
-            </view>
-          </view>
-          <view class="font-size-13 color-999 ss-m-t-10" style="text-align: end;">更新时间:{{ timesTampChange(info?.refreshTime || info.updateTime, 'Y-M-D h:m') }}</view>
-          <!-- 标签 -->
-          <view class="tagList mt">
-            <view class="tag" v-for="(tag,i) in info?.tagList || []" :key="'tagList' + i">
-              {{ tag }}
-            </view>
-          </view>
-          <!-- 企业信息 -->
-          <view class="topLine mt-5 d-flex" @click="jumpToEnterpriseDetail(info.enterprise.id)">
-            <view class="avatarBox">
-              <image style="width: 40px; height: 40px;" :src="info.enterprise?.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'"></image>
-            </view>
-            <view >
-              <view class="contact-name">{{ info.contact?.name }}</view>
-              <view class="contact-info">{{ formatName(info.enterprise?.anotherName || info.enterprise?.name) }} {{ info.contact?.postNameCn ? '· ' + info.contact?.postNameCn : '' }}</view>
-            </view>
-          </view>
-          <!-- 岗位职责 -->
-          <view class="topLine fs14 mt-5">
-            <view class="fs15 w-600 my5">岗位职责</view>
-            <view v-if="!info.content"></view>
-            <rich-text v-else class="htmlCss" :nodes="cleanedHtml(info.content)"></rich-text>
-          </view>
-          <!-- 岗位要求 -->
-          <view class="topLine mt-5">
-            <view class="fs15 w-600 my5">岗位要求</view>
-            <view v-if="!info.requirement"></view>
-            <rich-text v-else class="htmlCss" :nodes="cleanedHtml(info.requirement)"></rich-text>
-          </view>
-          <!-- 工作地址 -->
-          <view class="topLine mt-5">
-            <view class="fs15 w-600 my5">工作地址</view>
-            <view class="my10">
-              <uni-icons
-                type="map-pin-ellipse"
-                color="#00B760"
-                class="mr"
-                size="25"
-              ></uni-icons>
-              <span style="color: var(--color-666);font-size: 15px;line-height: 26px;">{{ info.address || '' }}</span>
+  <view>
+    <Navbar title="职位详情" :textLeft="false" />
+    <layout-page>
+      <view :style="{'padding-top': navbarHeight + 'px'}">
+        <view class="defaultBgc">
+          <scroll-view class="scrollBox">
+            <view class="commonBackground"></view>
+            <view class="box" style="position: relative; z-index: 1;">
+              <view v-if="loading" class="vertical80-center">{{ loadingText }}</view>
+              <view v-else>
+                <view style="display: flex;">
+                  <!-- 赏金 -->
+                  <view v-if="info.hire && info.hirePrice" class="hirePrice ss-m-r-10 d-flex align-center">
+                    <view class="iconfont icon-a-1_zhaopin ss-m-r-10" style="color: #e03506; font-size: 20px;"></view>
+                    <view class="MiSans-Normal">{{ `赏金:${commissionCalculation(info.hirePrice / 100, 1)}元` }}</view>
+                  </view>
+                  <image v-if="isJobFair" src="/static/svg/jobFair.svg" class="ss-m-r-10" style="width: 30px; height: 30px;"></image>
+                  <!-- 职位名称 -->
+                  <h2 class="JobName MiSans-Semibold" style="flex: 1;">{{ formatName(info.name) }}</h2>
+                </view>
+                <!-- 职位地区 -->
+                <view class="d-flex justify-space-between mt-5 align-center">
+                  <view class="color-666" style="font-size: 28rpx; flex: 1; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; margin-right: 30px;">
+                    <span>
+                      <span class="MiSans-Normal">{{positionInfo?.area?.str ?? '全国' }}</span>
+                      <span class="viewider-mx" v-if="positionInfo?.eduName">|</span>
+                      <span class="MiSans-Normal">{{positionInfo?.eduName }}</span>
+                      <span class="viewider-mx" v-if="positionInfo?.expName">|</span>
+                      <span class="MiSans-Normal">{{positionInfo?.expName }}</span>
+                    </span>
+                  </view>
+                </view>
+                <view class="d-flex justify-space-between mt-5 align-center">
+                  <!-- 收藏职位 -->
+                  <view @click="handleCollection" class="d-flex align-center">
+                    <uni-icons
+                      :type="isCollection ? 'heart-filled' : 'heart'"
+                      color="#00B760"
+                      class="ss-m-r-10"
+                      size="25"
+                    ></uni-icons>
+                    <span class="color-primary MiSans-Normal">{{ isCollection  ? '取消收藏' : '收藏' }}</span>
+                  </view>
+                  <!-- 薪资 -->
+                  <view>
+                    <span v-if="!info.payFrom && !info.payTo" class="salary MiSans-Medium">面议</span>
+                    <span v-else class="salary MiSans-Medium">{{ info.payFrom }}-{{ info.payTo }}/{{ positionInfo.payName }}</span>
+                  </view>
+                </view>
+                <view class="font-size-13 color-999 ss-m-t-10 MiSans-Normal" style="text-align: end;">更新时间:{{ timesTampChange(info?.refreshTime || info.updateTime, 'Y-M-D h:m') }}</view>
+                <!-- 标签 -->
+                <view class="tagList mt">
+                  <view class="tag MiSans-Normal" v-for="(tag,i) in info?.tagList || []" :key="'tagList' + i">
+                    {{ tag }}
+                  </view>
+                </view>
+                <!-- 企业信息 -->
+                <view class="topLine mt-5 d-flex align-center" @click="jumpToEnterpriseDetail(info.enterprise.id)">
+                  <view class="avatarBox">
+                    <image class="default-border default-radius" style="width: 100rpx; height: 100rpx;" :src="info.enterprise?.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'"></image>
+                  </view>
+                  <view>
+                    <view class="contact-name MiSans-Medium default-text-color">{{ info.contact?.name }}</view>
+                    <view class="contact-info MiSans-Normal color-666">
+                      {{ formatName(info.enterprise?.anotherName || info.enterprise?.name) }} {{ info.contact?.postNameCn ? '· ' + info.contact?.postNameCn : '' }}
+                    </view>
+                  </view>
+                  <view class="d-flex align-center">
+                    <uni-icons type="right" size="20" color="#666"></uni-icons>
+                  </view>
+                </view>
+                <!-- 岗位职责 -->
+                <view class="topLine fs14 mt-5">
+                  <view class="MiSans-Semibold my5 font-size-17 title-text">岗位职责</view>
+                  <view v-if="!info.content"></view>
+                  <rich-text v-else class="htmlCss" :nodes="cleanedHtml(info.content)"></rich-text>
+                </view>
+                <!-- 岗位要求 -->
+                <view class="topLine mt-5">
+                  <view class="MiSans-Semibold my5 font-size-17 title-text">岗位要求</view>
+                  <view v-if="!info.requirement"></view>
+                  <rich-text v-else class="htmlCss" :nodes="cleanedHtml(info.requirement)"></rich-text>
+                </view>
+                <!-- 工作地址 -->
+                <view class="topLine mt-5">
+                  <view class="fs15 MiSans-Semibold my5">工作地址</view>
+                  <view class="my10">
+                    <uni-icons
+                      type="map-pin-ellipse"
+                      color="#00B760"
+                      class="mr"
+                      size="25"
+                    ></uni-icons>
+                    <span class="MiSans-Normal" style="color: var(--color-666);font-size: 15px;line-height: 26px;">{{ info.address || '' }}</span>
+                  </view>
+                </view>
+              </view>
             </view>
-          </view>
+          </scroll-view>
         </view>
       </view>
-    </scroll-view>
-    <!-- 分享 投递 -->
-    <view class="bottom-sticky" v-if="!loading && jobId">
-      <view class="bottom-content">
-        <!-- 已登录可以分享 -->
-        <button v-if="beenLogin" class="bottom-content-tool shareButtonCss" open-type="share">
-          <uni-icons type="redo-filled" size="24" color="#00B760" style="line-height: 24px;"/>
-          <span style="color:#00B760;font-weight:bold;line-height: 22px;">分享</span>
-        </button>
-        <!-- 未登录点击分享拉起登录 -->
-        <view v-else @click="handleClickShare" class="bottom-content-tool">
-          <uni-icons type="redo-filled" size="24" color="#00B760"/>
-          <span style="color:#00B760;font-weight:bold;">分享</span>
+      
+
+      <!-- 分享 投递 -->
+      <view class="bottom-sticky" style="z-index: 2;" v-if="!loading && jobId">
+        <view class="bottom-content">
+          <!-- 已登录可以分享 -->
+          <button v-if="beenLogin" class="bottom-content-tool shareButtonCss" open-type="share">
+            <uni-icons type="redo" size="30" color="#00B760" style="line-height: 30px;"/>
+            <span class="MiSans-Normal" style="color:#00B760;line-height: 22px;">分享</span>
+          </button>
+          <!-- 未登录点击分享拉起登录 -->
+          <view v-else @click="handleClickShare" class="bottom-content-tool">
+            <uni-icons type="redo" size="30" color="#00B760"/>
+            <span class="MiSans-Normal" style="color:#00B760;">分享</span>
+          </view>
+          <button class="btnStyle bgButtons MiSans-Medium" type="primary" plain="true" @tap="handleSend">立即沟通</button>
+          <button v-if="delivery" :disabled="true" class="buttons btnStyle disable MiSans-Medium">我已投递</button>
+          <button v-else class="buttons btnStyle MiSans-Medium" type="primary" @click="handleDelivery">我要投递</button>
         </view>
-        <button class="btnStyle bgButtons" type="primary" plain="true" @tap="handleSend">立即沟通</button>
-        <button v-if="delivery" :disabled="true" class="buttons btnStyle disable">我已投递</button>
-        <button v-else class="buttons btnStyle" type="primary" @click="handleDelivery">我要投递</button>
       </view>
-    </view>
-    <uni-popup
-        ref="poster"
-        type="center"
-        class="f-straight"
-        style="position: relative;"
-    >
-        <canvas
-          :style="{
-            width:`${appInfo.windowWidth}px;`,
-            height:`${appInfo.windowHeight}px;margin-left:-9999px; margin-top:-99.5vh;`
-          }" canvas-id="firstCanvas" id="firstCanvas"></canvas>
-        <image
-          :style="{ width:`${appInfo.windowWidth}px;`, height:`${appInfo.windowHeight*.9}px;`}"
-          :src="imgSrc"
-          mode="aspectFit"
-        />
-        <!-- <uni-icons v-if="!!imgSrc" type="clear" size="35" color="#FFF" style="position: absolute;top: 10px;right: 28px;" @click="posterClose"></uni-icons> -->
-    </uni-popup>
-    
-    <!-- 选择简历 -->
-    <uni-popup ref="popup" background-color="#fff" :mask-click="false" >
-      <view class="dialogBox" style="width: 86vw;">
-        <view class="dialog-title border-bottom">
-          <view class="title">选择简历</view>
-          <uni-icons type="close" color="grey" size="26" @click="popupClose" />
-        </view>
-        <!-- <view style="height: 1px; margin: 0 20rpx; background-color: #dedede;"></view> -->
-        <scroll-view class="dialog-content" scroll-y="true" style="max-height: 50vh; width: auto;">
-          <uni-card
-            v-for="(item, index) in resumeList"
-            :key="index"
-            shadow="0px 0px 3px 1px rgba(0,0,0,0.1)"
-            :is-shadow="true"
-            :border='false'
-             background-color="red"
-            :class="{'selected': selectIndex === index}"
-            @click="selectIndex = index"
-          >
-            <view class="d-flex align-center">
-              <view style="flex: 1;">
-                <view style="font-weight: bold;">
-                  <uni-icons v-if="selectIndex === index" color="green" type="checkmarkempty" size="18"></uni-icons>
-                  {{ item.title }}
+      
+      <uni-popup
+          ref="poster"
+          type="center"
+          class="f-straight"
+          style="position: relative;"
+      >
+          <canvas
+            :style="{
+              width:`${appInfo.windowWidth}px;`,
+              height:`${appInfo.windowHeight}px;margin-left:-9999px; margin-top:-99.5vh;`
+            }" canvas-id="firstCanvas" id="firstCanvas"></canvas>
+          <image
+            :style="{ width:`${appInfo.windowWidth}px;`, height:`${appInfo.windowHeight*.9}px;`}"
+            :src="imgSrc"
+            mode="aspectFit"
+          />
+      </uni-popup>
+      
+      <!-- 选择简历 -->
+      <uni-popup ref="popup" background-color="#fff" :mask-click="false" >
+        <view class="dialogBox" style="width: 86vw;">
+          <view class="dialog-title border-bottom">
+            <view class="title MiSans-Normal">选择简历</view>
+            <uni-icons type="close" color="grey" size="26" @click="popupClose" />
+          </view>
+          <!-- <view style="height: 1px; margin: 0 20rpx; background-color: #dedede;"></view> -->
+          <scroll-view class="dialog-content" scroll-y="true" style="max-height: 50vh; width: auto;">
+            <uni-card
+              v-for="(item, index) in resumeList"
+              :key="index"
+              shadow="0px 0px 3px 1px rgba(0,0,0,0.1)"
+              :is-shadow="true"
+              :border='false'
+              background-color="red"
+              :class="{'selected': selectIndex === index}"
+              @click="selectIndex = index"
+            >
+              <view class="d-flex align-center">
+                <view style="flex: 1;">
+                  <view class="MiSans-Mediuml default-text-color">
+                    <uni-icons v-if="selectIndex === index" color="green" type="checkmarkempty" size="18"></uni-icons>
+                    {{ item.title }}
+                  </view>
+                  <view class="MiSans-Normal color-666">上传时间:{{ timesTampChange(item.createTime, 'Y-M-D') }}</view>
+                </view>
+                <view class="ss-m-l-30" style="width: 60rpx;">
+                  <uni-icons @click="preview(item.url)" type="eye" size="24"></uni-icons>
                 </view>
-                <view>上传时间:{{ timesTampChange(item.createTime, 'Y-M-D') }}</view>
-              </view>
-              <view class="ss-m-l-30" style="width: 60rpx;">
-                <uni-icons @click="preview(item.url)" type="eye" size="24"></uni-icons>
               </view>
-            </view>
-          </uni-card>
-          <view class="selectOnline" @click="handleUpload">选取微信聊天文件</view>
-        </scroll-view>
-        <view class="dialog-bottom" @click="deliverySubmit()">确认投递</view>
-      </view>
-    </uni-popup>
-
-    <!-- 实习到岗时间 -->
-    <uni-popup ref="practicePopup" :mask-click="false" >
-      <view class="dialogBox" style="width: 86vw; border-radius: 8px; background-color: #fff;">
-        <view class="dialog-title border-bottom">
-          <view class="title">实习到岗信息</view>
-          <uni-icons type="close" color="grey" size="26" @click="practicePopupClose" />
+            </uni-card>
+            <view class="selectOnline MiSans-Normal" @click="handleUpload">选取微信聊天文件</view>
+          </scroll-view>
+          <view class="dialog-bottom MiSans-Medium" @click="deliverySubmit()">确认投递</view>
         </view>
-        <scroll-view class="dialog-content" scroll-y="true" style="max-height: 50vh;">
-          <view class="ss-p-x-50">
-            <studentDeliveryForm ref="studentDeliveryFormRef" />
+      </uni-popup>
+
+      <!-- 实习到岗时间 -->
+      <uni-popup ref="practicePopup" :mask-click="false" >
+        <view class="dialogBox" style="width: 86vw; border-radius: 8px; background-color: #fff;">
+          <view class="dialog-title border-bottom">
+            <view class="title MiSans-Normal">实习到岗信息</view>
+            <uni-icons type="close" color="grey" size="26" @click="practicePopupClose" />
           </view>
-        </scroll-view>
-        <view class="d-bottom" @click="beforeHandleUploadSubmit()">确 认</view>
-      </view>
-    </uni-popup>
-
-    <!-- 上传简历 -->
-    <uni-popup ref="uploadPopup" type="dialog">
-			<uni-popup-dialog
-        type="warn"
-        cancelText="取消"
-        confirmText="确定"
-        title="系统提示"
-        content="您还未上传过简历,是否选取微信聊天文件投递?"
-        @confirm="handleUpload"
-				@close="uploadPopup.close()"
-      ></uni-popup-dialog>
-		</uni-popup>
-
-    <!-- 职位分享 -->
-    <uni-popup ref="sharePopup" type="share">
-      <uni-popup-share title="分享到">
-        <view class="share-pop">
-          <button class="f-straight" open-type="share">
-            <view class="share-round share-round-1" >
-              <uni-icons type="weixin" color="#FFF" size="30" />
+          <scroll-view class="dialog-content" scroll-y="true" style="max-height: 50vh;">
+            <view class="ss-p-x-50">
+              <studentDeliveryForm ref="studentDeliveryFormRef" />
             </view>
-            <view style="font-size:12px;">微信</view>
-          </button>
+          </scroll-view>
+          <view class="d-bottom MiSans-Medium" @click="beforeHandleUploadSubmit()">确 认</view>
         </view>
-      </uni-popup-share>
-    </uni-popup>
-
-    <!-- 当前是赏金职位时,询问是否登录,不登录则没有赏金 -->
-    <uni-popup ref="loginPopup" type="dialog">
-			<uni-popup-dialog 
-        type="warn" 
-        cancelText="取消" 
-        confirmText="登录" 
-        title="系统提示" 
-        content="当前为赏金职位,不登录进行分享将无法获得赏金,是否登录?" 
-        @confirm="handleLoginConfirm"
-				@close="handleLoginClose" />
-		</uni-popup>
-
-    <view class="hideCanvasView">
-      <canvas class="shareCanvas" canvas-id="shareCanvas" style="width: 452px; height: 362px;"></canvas>
-    </view>
-  </layout-page>
+      </uni-popup>
+
+      <!-- 上传简历 -->
+      <uni-popup ref="uploadPopup" type="dialog">
+        <uni-popup-dialog
+          type="warn"
+          cancelText="取消"
+          confirmText="确定"
+          title="系统提示"
+          content="您还未上传过简历,是否选取微信聊天文件投递?"
+          @confirm="handleUpload"
+          @close="uploadPopup.close()"
+        ></uni-popup-dialog>
+      </uni-popup>
+
+      <!-- 职位分享 -->
+      <uni-popup ref="sharePopup" type="share">
+        <uni-popup-share title="分享到">
+          <view class="share-pop">
+            <button class="f-straight" open-type="share">
+              <view class="share-round share-round-1" >
+                <uni-icons type="weixin" color="#FFF" size="30" />
+              </view>
+              <view style="font-size:12px;">微信</view>
+            </button>
+          </view>
+        </uni-popup-share>
+      </uni-popup>
+
+      <!-- 当前是赏金职位时,询问是否登录,不登录则没有赏金 -->
+      <uni-popup ref="loginPopup" type="dialog">
+        <uni-popup-dialog 
+          type="warn" 
+          cancelText="取消" 
+          confirmText="登录" 
+          title="系统提示" 
+          content="当前为赏金职位,不登录进行分享将无法获得赏金,是否登录?" 
+          @confirm="handleLoginConfirm"
+          @close="handleLoginClose" />
+      </uni-popup>
+
+      <view class="hideCanvasView">
+        <canvas class="shareCanvas" canvas-id="shareCanvas" style="width: 452px; height: 362px;"></canvas>
+      </view>
+    </layout-page>
+  </view>
 </template>
 
 <script setup>
@@ -229,6 +245,7 @@ import { timesTampChange } from '@/utils/date'
 import { preview } from '@/utils/preview'
 import { uploadFile } from '@/api/file'
 import layoutPage from '@/layout'
+import Navbar from '@/components/Navbar'
 import { ref, watch, computed } from 'vue';
 import {
   jobCvRelSend,
@@ -251,6 +268,8 @@ import { formatName } from '@/utils/getText'
 import studentDeliveryForm from '@/components/studentDeliveryForm'
 // import { getShareQueryById } from '@/api/jobFair.js'
 
+const navbarHeight = ref(uni.getStorageSync('navbarHeight'))
+
 const useUserStore = userStore()
 const sharePopup = ref()
 const loading = ref(false)
@@ -738,6 +757,24 @@ const handleLoginConfirm = () => {
 
 <style scoped lang="scss">
 @import '../../static/style/position/index.scss';
+
+.commonBackground {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 160px;
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(180deg, #BCFEDE, #F7F8FA);
+  }
+}
+
 .hideCanvasView{
 	position: relative;
 }
@@ -761,7 +798,6 @@ const handleLoginConfirm = () => {
   .bgButtons {
     border: 2rpx solid #00B760;
     color: #00B760;
-    // background: #FFF;
     border-radius: 50rpx;
   }
   .shareButtonCss {
@@ -806,20 +842,6 @@ const handleLoginConfirm = () => {
         background-color:#3693cd;
     }
 }
-.preview {
-  position: fixed;
-  z-index: 9;
-  height: 100vh;
-  width: 100vw;
-  left: 0;
-  top: 0;
-  .image {
-    position: absolute;
-    width: 80%;
-    left: 10%;
-    top: 100rpx;
-  }
-}
 .border-bottom {
   border-bottom: 1px solid #eee;
 }

+ 20 - 26
static/style/position/index.scss

@@ -5,18 +5,7 @@
 .fs14 { font-size: 14px; }
 .fs15 { font-size: 15px; }
 .box {
-  padding: 10px 30rpx 100px;
-  background-color: #fff;
-}
-.shareCss {
-  background-color: #00B760 !important;
-  .box {
-    margin: 20px 24px;
-    border-radius: 10px;
-    background-color: #fff;
-    height: 194px;
-    overflow: hidden;
-  }
+  padding: 0 30rpx 100px;
 }
 
 .JobName {
@@ -60,10 +49,11 @@
   white-space: pre-wrap;
   word-break: break-all;
   line-height: 28px;
-  color: var(--color-333);
+  color: #666;
   font-size: 15px;
   text-align: justify;
   letter-spacing: 0;
+  font-family: MiSans-Normal;
 }
 
 //底部按钮公用定位
@@ -102,9 +92,9 @@
 
 }
 .avatarBox{
-	max-width: 40px;
-	max-height: 40px;
-  margin: 0 10px;
+	max-width: 100rpx;
+	max-height: 100rpx;
+  margin: 0 20px 0 0;
 }
 .avatar{
 	width: 40px;
@@ -125,25 +115,29 @@
   line-height: 41px;
   font-weight: 600;
   height: auto;
+  font-size: 34rpx;
   display: inline-block;
   vertical-align: sub;
 }
-.list-shape {
-	padding: 10px 30rpx 10px;
-  margin-top: 10px;
-  background-color: #fff;
-  .titleBox {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-  }
-}
 .viewider-mx{
 	margin: 0 10rpx;
 }
 .viewider {
 	color:#e4d4d2;
 }
+.title-text {
+  position: relative;
+  padding-left: 10px;
+  &::before {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 4px;
+    height: 17px;
+    width: 3px;
+    background-color: #00B760;
+  }
+}
 
 //公司名称
 .cer-end{