浏览代码

样式修改

lifanagju_citu 1 月之前
父节点
当前提交
1d540fca6d
共有 2 个文件被更改,包括 243 次插入126 次删除
  1. 2 1
      pages.json
  2. 241 125
      pagesA/chart/index.vue

+ 2 - 1
pages.json

@@ -201,7 +201,8 @@
 				{
 					"path": "chart/index",
 					"style": {
-						"navigationBarTitleText": "我的聊天"
+						"navigationBarTitleText": "我的聊天",
+						"navigationStyle": "custom" 
 					}
 				},
 				{

+ 241 - 125
pagesA/chart/index.vue

@@ -1,16 +1,20 @@
 <template>
-  <view class="box defaultBgc">
-    <view class="box-top">
-      <view class="box-top-title">
-        {{ info.name }}
-        <text class="subText">
-          {{ info?.postName && info?.postName !== 'null' && info?.postName !== 'undefined' ? info.postName : '' }}
-          <text v-if="info?.postName && info?.postName !== 'null' && info?.postName !== 'undefined' && info.enterpriseName" class="gun">|</text>
-          {{ formatName(info.enterpriseName) }}
-        </text>
+  <view>
+    <Navbar :textLeft="false" title="我的聊天" />
+    <view class="box defaultBgc" :style="{'padding-top': navbarHeight + 'px', height: 'calc(100vh - ' + navbarHeight + 'px)'}">
+      <view class="commonBackground"></view>
+      <view class="box-top">
+        <image class="box-top-image" :src="getUserAvatar(info.avatar, info.sex, info.channelID === 'system' ? true : false)" ></image>
+        <view class="box-top-right MiSans-Normal">
+          <view class="box-top-right-title">{{ info.name }}</view>
+          <view class="box-top-right-subText">
+            {{ info?.postName && info?.postName !== 'null' && info?.postName !== 'undefined' ? info.postName : '' }}
+            <text v-if="info?.postName && info?.postName !== 'null' && info?.postName !== 'undefined' && info.enterpriseName" class="gun">|</text>
+            {{ formatName(info.enterpriseName) }}
+          </view>
+        </view>
+        <uni-notice-bar v-if="hasWaitingProcessingInterview" show-get-more single text="您有待处理的面试邀请,点击查看详情" @click="handleToCenter"/>
       </view>
-      <uni-notice-bar v-if="hasWaitingProcessingInterview" show-get-more single text="您有待处理的面试邀请,点击查看详情" @click="handleToCenter"/>
-    </view>
       <!-- newsId 需要和聊天列表里面的id对应 永远取最后列表中的最后一个就可以做到发送消息即时滚动到底部 -->
       <scroll-view ref="chatRef" :scroll-with-animation="scrollAnimation" :scroll-into-view="newsId" class="box-main" scroll-y="true">
         <view class="box-main-more" v-if="hasMore">
@@ -20,43 +24,74 @@
           <view class="box-main-time MiSans-Normal">{{ timesTampChange(+(val.timestamp.padEnd(13, '0'))) }}</view>
           <template v-if="val.payload?.type === 102">
             <view class="jobCard">
-              <view class="jobCard-title"> {{ formatName(val.payload?.content?.positionInfo?.name) }}</view>
-              <view
-                v-if="!val.payload?.content?.positionInfo?.payFrom && !val.payload?.content?.positionInfo?.payTo"
-                class="jobCard-subtitle">
-                薪酬待遇: 面议
+              <view class="ss-m-b-12">
+                <text class="jobCard-title MiSans-Medium ss-m-r-20"> {{ formatName(val.payload?.content?.positionInfo?.name) }}</text>
+                <text
+                  v-if="!val.payload?.content?.positionInfo?.payFrom && !val.payload?.content?.positionInfo?.payTo"
+                  class="salary-text">
+                    面议
+                </text>
+                <text
+                  v-else-if="val.payload?.content?.positionInfo?.payFrom-0 >= 1000"
+                  class="salary-text"
+                >
+                  <text>{{ val.payload?.content?.positionInfo?.payFrom ? val.payload?.content?.positionInfo?.payFrom/1000 : ''}}</text>
+                  <text>-</text>
+                  <text>{{ val.payload?.content?.positionInfo?.payTo ? val.payload?.content?.positionInfo?.payTo/1000 : ''}}K</text>
+                  <text>{{ val.payload?.content?.positionInfo?.payName ? '/' + val.payload?.content?.positionInfo?.payName : '' }}</text>
+                </text>
+                <text
+                  v-else
+                  class="salary-text"
+                >
+                  {{ val.payload?.content?.positionInfo?.payFrom || '' }}-{{ val.payload?.content?.positionInfo?.payTo || '' }}{{ val.payload?.content?.positionInfo?.payName ? '/' + val.payload?.content?.positionInfo?.payName : '' }}
+                </text>
               </view>
-              <view
-                v-else
-                class="jobCard-subtitle"
-              >
-                薪酬待遇: 
-                {{ val.payload?.content?.positionInfo?.payFrom ? val.payload?.content?.positionInfo?.payFrom + ' - ' : '' }}
-                {{ val.payload?.content?.positionInfo?.payTo }}
+              <view class="font-size-15 ss-m-b-15">
+                <span class="desc-tag">
+                  <span class="MiSans-Normal">{{val.payload?.content?.positionInfo?.area?.str ?? '全国' }}</span>
+                  <span class="divider-mx" v-if="val.payload?.content?.positionInfo?.eduName">|</span>
+                  <span class="MiSans-Normal">{{val.payload?.content?.positionInfo?.eduName }}</span>
+                  <span class="divider-mx" v-if="val.payload?.content?.positionInfo?.expName">|</span>
+                  <span class="MiSans-Normal">{{val.payload?.content?.positionInfo?.expName }}</span>
+                </span>
+              </view>
+              <view>
               </view>
               <view class="jobCard-tag">
                 <view
                   v-for="(v, i) in (val.payload?.content?.positionInfo?.enterprise?.welfareList || [])"
                   :key="val.message_id + v + i"
+                  class="tagItem"
                 >
-                  <uni-tag
+                  <!-- <uni-tag
                     :text="v"
+                    :circle="true"
+                    size="mini"
+                    class="ss-p-5"
                     type="success"
-                  />
+                  /> -->
+                  <view class="tag">{{ v }}</view>
                 </view>
               </view>
               <view class="jobCard-divider"></view>
-              <view class="jobCard-subtitle text-right">
-                <v-avatar size="24">
-                  <v-img :src="val.payload?.content?.positionInfo?.contact?.avatar"></v-img>
-                </v-avatar>
-                {{ val.payload?.content?.positionInfo?.contact?.name }}
-                {{ val.payload?.content?.positionInfo?.contact?.postNameCn }}
-                {{ formatName(val.payload?.content?.positionInfo?.enterprise?.anotherName || val.payload?.content?.positionInfo?.enterprise?.name) }}
+              <!-- 企业信息 -->
+              <view class="sub-li-bottom">
+                <view class="avatarBox">
+                  <image
+                    class="enterAvatar ml default-border default-radius"
+                    :src="val.payload?.content?.positionInfo?.enterprise?.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'"
+                  ></image>
+                </view>
+                <view class="ss-m-l-35">
+                  <view class="mr MiSans-Normal default-text-color">{{ formatName(val.payload?.content?.positionInfo?.enterprise?.anotherName || val.payload?.content?.positionInfo?.enterprise?.name) }}</view>
+                  <span class="color-666 MiSans-Normal ss-m-r-10">{{ val.payload?.content?.positionInfo?.enterprise?.industryName || '' }}</span>
+                  <span class="mr color-666 MiSans-Normal">{{ val.payload?.content?.positionInfo?.enterprise?.scaleName || '' }}</span>
+                </view>
               </view>
-              <div class="jobCard-subtitle text-right">
-                地址:{{ val.payload?.content?.positionInfo?.address }}
-              </div>
+              <!-- <div class="jobCard-subtitle text-right" v-if="val.payload?.content?.positionInfo?.address">
+                地址:{{ val.payload.content.positionInfo.address }}
+              </div> -->
             </view>
           </template>
           <view :class="['message-view_item', val.from_uid === IM.uid ? 'is-self' : 'is-other']">
@@ -127,91 +162,96 @@
           </view>
         </view>
       </scroll-view>
-      
-    <view class="box-bottom" v-if="channelItem?.channelID !== 'system'">
-      <view class="box-bottom-tool" style="display: flex; justify-content: space-between;">
-        <text class="toolBtn" :class="{ disabled: !isSendResume }" @tap="handleFindResume">{{ isSendResume ? '简历已投递' : '发送简历' }}</text>
-      </view>
-      
-      <view class="d-flex align-end textBox" v-if="channelItem?.channelID !== 'system'">
-        <textarea
-          v-model="inputValue"
-          :cursor-spacing="25"
-          :show-confirm-bar="false"
-          :disable-default-padding="true"
-          confirm-type="send"
-          auto-height
-          @confirm="handleSend"
-        />
-        <text class="submitBtn MiSans-Medium" @tap="handleSend">发 送</text>
+        
+      <view class="box-bottom" v-if="channelItem?.channelID !== 'system'">
+        <view class="box-bottom-tool" style="display: flex; justify-content: space-between;">
+          <text class="toolBtn" :class="{ disabled: !isSendResume }" @tap="handleFindResume">{{ isSendResume ? '简历已投递' : '发送简历' }}</text>
+        </view>
+        
+        <view class="d-flex align-end textBox" v-if="channelItem?.channelID !== 'system'">
+          <textarea
+            v-model="inputValue"
+            placeholder="介绍自己回复率更高哦~"
+            placeholder-style="color: #dddddd;"
+            class="MiSans-Normal"
+            :cursor-spacing="25"
+            :show-confirm-bar="false"
+            :disable-default-padding="true"
+            confirm-type="send"
+            auto-height
+            @confirm="handleSend"
+          />
+          <text class="submitBtn MiSans-Medium" @tap="handleSend">发 送</text>
+        </view>
       </view>
-    </view>
 
-    <uni-popup ref="positionPopup" background-color="#fff">
-      <view style="max-width: 85vw;">
+      <uni-popup ref="positionPopup" background-color="#fff">
+        <view style="max-width: 85vw;">
+          <view class="popup-title" style="min-width: 260px;">
+            <text class="MiSans-Normal">请选择要投递的职位</text>
+            <uni-icons type="closeempty" size="20" @tap="positionPopupClose"></uni-icons>
+          </view>
+          <view v-for="job in entPositionList" :key="job.value" class="popup-content" @tap="selectJobId = job.value">
+            <view class="iconBox">
+              <uni-icons
+                v-show="selectJobId === job.value"
+                type="checkmarkempty"
+                size="20"
+                :color="selectJobId === job.value ? '#43AC57' : '#999'">
+              </uni-icons>
+            </view>
+            <text class="text" :class="selectJobId === job.value ? 'active' : ''">{{ job.label }}</text>
+          </view>
+          <view v-if="entPositionTotal > 5" class="popup-upload ss-m-x-30" @click="changePositionData">
+            <text style="color: #43AC57;">{{ entPositionListLastData ? '没有更多职位了~ 再选一遍' : '换一批'}}</text>
+          </view>
+        </view>
+        <view class="popup-actions">
+          <button class="default" type="default" @click="selectPositionSubmit">确认</button>
+        </view>
+      </uni-popup>
+
+      <uni-popup ref="popup" background-color="#fff">
         <view class="popup-title" style="min-width: 260px;">
-          <text class="MiSans-Normal">请选择要投递的职位</text>
-          <uni-icons type="closeempty" size="20" @tap="positionPopupClose"></uni-icons>
+          <text>发送简历选择</text>
+          <uni-icons type="closeempty" size="20" @tap="handleClose"></uni-icons>
         </view>
-        <view v-for="job in entPositionList" :key="job.value" class="popup-content" @tap="selectJobId = job.value">
+        <view v-if="isStudent" class="ss-p-x-50" style="width: 272px;">
+          <studentDeliveryForm ref="studentDeliveryFormRef" prefix="实习" formLabelWidth="110px" />
+        </view>
+        <view v-for="resume in resumeList" :key="resume.id" class="popup-content" @tap="resumeCheck = resume">
           <view class="iconBox">
             <uni-icons
-              v-show="selectJobId === job.value"
+              v-show="resumeCheck.id === resume.id"
               type="checkmarkempty"
               size="20"
-              :color="selectJobId === job.value ? '#43AC57' : '#999'"></uni-icons>
+              :color="resumeCheck.id === resume.id ? '#43AC57' : '#999'"></uni-icons>
           </view>
-          <text class="text" :class="selectJobId === job.value ? 'active' : ''">{{ job.label }}</text>
-        </view>
-        <view v-if="entPositionTotal > 5" class="popup-upload ss-m-x-30" @click="changePositionData">
-          <text style="color: #43AC57;">{{ entPositionListLastData ? '没有更多职位了~ 再选一遍' : '换一批'}}</text>
+          <text class="text" :class="resumeCheck.id === resume.id ? 'active' : ''">{{ resume.title }}</text>
         </view>
-      </view>
-      <view class="popup-actions">
-        <button class="default" type="default" @click="selectPositionSubmit">确认</button>
-      </view>
-    </uni-popup>
-
-    <uni-popup ref="popup" background-color="#fff">
-      <view class="popup-title" style="min-width: 260px;">
-        <text>发送简历选择</text>
-        <uni-icons type="closeempty" size="20" @tap="handleClose"></uni-icons>
-      </view>
-      <view v-if="isStudent" class="ss-p-x-50" style="width: 272px;">
-        <studentDeliveryForm ref="studentDeliveryFormRef" prefix="实习" formLabelWidth="110px" />
-      </view>
-      <view v-for="resume in resumeList" :key="resume.id" class="popup-content" @tap="resumeCheck = resume">
-        <view class="iconBox">
-          <uni-icons
-            v-show="resumeCheck.id === resume.id"
-            type="checkmarkempty"
-            size="20"
-            :color="resumeCheck.id === resume.id ? '#43AC57' : '#999'"></uni-icons>
+        <view v-if="!resumeList.length" class="popup-upload" @click="handleUploadResume">
+          <view class="popup-upload-box">
+            <uni-icons type="plusempty" size="50" color="#f1f1f1"></uni-icons>
+          </view>
+          <text>温馨提示:您还未上传过简历,点击选取微信聊天文件投递。请在手机上打开此小程序进行文件上传,暂不支持在桌面版小程序中上传文件。</text>
         </view>
-        <text class="text" :class="resumeCheck.id === resume.id ? 'active' : ''">{{ resume.title }}</text>
-      </view>
-      <view v-if="!resumeList.length" class="popup-upload" @click="handleUploadResume">
-        <view class="popup-upload-box">
-          <uni-icons type="plusempty" size="50" color="#f1f1f1"></uni-icons>
+        <view v-if="resumeList.length" class="popup-actions">
+          <button class="default" type="default" @click="handleSendResume">发送简历</button>
         </view>
-        <text>温馨提示:您还未上传过简历,点击选取微信聊天文件投递。请在手机上打开此小程序进行文件上传,暂不支持在桌面版小程序中上传文件。</text>
-      </view>
-      <view v-if="resumeList.length" class="popup-actions">
-        <button class="default" type="default" @click="handleSendResume">发送简历</button>
-      </view>
-    </uni-popup>
-
-    <!-- <uni-popup ref="confirm" type="dialog">
-      <uni-popup-dialog
-        :type="isAgree ? 'success' : 'warn'"
-        cancelText="取消"
-        confirmText="确认" 
-        title="系统提示"
-        :content="isAgree ? '确认接受面试吗?' : '确认拒绝面试吗?'"
-        @confirm="handleConfirm"
-        @close="handleCloseConfirm"
-      ></uni-popup-dialog>
-    </uni-popup> -->
+      </uni-popup>
+
+      <!-- <uni-popup ref="confirm" type="dialog">
+        <uni-popup-dialog
+          :type="isAgree ? 'success' : 'warn'"
+          cancelText="取消"
+          confirmText="确认" 
+          title="系统提示"
+          :content="isAgree ? '确认接受面试吗?' : '确认拒绝面试吗?'"
+          @confirm="handleConfirm"
+          @close="handleCloseConfirm"
+        ></uni-popup-dialog>
+      </uni-popup> -->
+    </view>
   </view>
 </template>
 
@@ -237,6 +277,9 @@ import {
   jobCvRelHireSend
 } from '@/api/position'
 import studentDeliveryForm from '@/components/studentDeliveryForm'
+import Navbar from '@/components/Navbar'
+
+const navbarHeight = ref(uni.getStorageSync('navbarHeight'))
 
 const useUserStore = userStore()
 const IM = useIMStore()
@@ -269,7 +312,6 @@ const isSendResume = ref(false)
 const positionInfo = ref({})
 const isEmployment = ref('-1')
 
-// const isStudent = ref(false) // 已测试,待开放上线 
 const isStudent = ref(useUserStore?.baseInfo?.type && Boolean(Number(useUserStore.baseInfo.type) === 1))
 
 onMounted(() => {
@@ -695,6 +737,27 @@ onLoad(async (options) => {
 </script>
 
 <style lang="scss" scoped>
+.mr { margin-right: 20rpx; }
+.salary-text {
+  font-size: 36rpx;
+	color: #00B760;
+	text-align: center;
+  font-family: MiSans-Normal;
+	font-weight: 500;
+	text-transform: none;
+}
+.divider-mx{
+	margin: 0 10rpx;
+}
+.desc-tag {
+	font-family: MiSans, MiSans;
+	font-weight: 400;
+	font-size: 24rpx;
+	color: #666666;
+	text-align: left;
+	font-style: normal;
+	text-transform: none;
+}
 .white {
   color: #FFF !important;
 }
@@ -704,24 +767,56 @@ onLoad(async (options) => {
 .text-right {
   text-align: right !important;
 }
+.sub-li-bottom {
+  display: flex;
+  align-items: center;
+  font-size: 13px;
+  padding: 5px;
+  border-radius: 0 0 12px 12px;
+  // margin-bottom: 20rpx;
+  .avatarBox {
+    // max-width: 40px;
+    // max-height: 40px;
+    .enterAvatar{
+      width: 60rpx;
+      height: 60rpx;
+      border-radius: 50%;
+      margin: auto;
+    }
+  }
+}
 .box {
   width: 100%;
-  height: 100vh;
+  // height: 100vh;
   display: flex;
   flex-direction: column;
   &-top {
-    &-title {
-      padding: 0 60rpx;
-      box-sizing: border-box;
-      width: 100%;
+    z-index: 1;
+    // width: 100%;
+    padding: 30rpx 30rpx 0 30rpx;
+    display: flex;
+    justify-content: center;
+    &-image {
+      width: 80rpx;
       height: 80rpx;
-      line-height: 80rpx;
-      // text-align: center;
-      border-bottom: 2rpx solid #EEE;
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      .subText {
+      border-radius: 50%;
+      margin-right: 30rpx;
+    }
+    &-right {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      &-title {
+        box-sizing: border-box;
+        width: 100%;
+        // text-align: center;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        margin-bottom: 10rpx;
+      }
+      &-subText {
         font-size: .85em;
         color: #999;
         .gun {
@@ -799,12 +894,16 @@ onLoad(async (options) => {
     .jobCard {
       padding: 30rpx;
       background: #fbfbfb;
+      margin: 5px;
       margin-top: 20rpx;
       max-width: unset;
-      margin-right: 0;
       border-radius: 20rpx;
+      box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.1);
       &-title {
-        font-size: 1.2em;
+        // font-size: 1.2em;
+        font-weight: 600;
+        font-size: 30rpx;
+        margin-bottom: 30rpx;
       }
       &-subtitle {
         padding: 10rpx 0;
@@ -813,6 +912,17 @@ onLoad(async (options) => {
       &-tag {
         display: flex;
         flex-wrap: wrap;
+        .tagItem {
+          margin: 0 5px 3px 0;
+          .tag {
+            color: #d4f1e4;
+            background-color: #00B760;
+            padding: 2px 8px;
+            font-size: 24rpx;
+            border-radius: 30rpx;
+            font-family: MiSans-Normal;
+          }
+        }
       }
     }
     .message-view_item {
@@ -891,7 +1001,7 @@ onLoad(async (options) => {
   &-bottom {
     max-height: 300rpx;
     border-top: 2rpx solid #EEE;
-    background: rgba(230, 230, 230, 0.5);
+    background: #fff;
     padding: 20rpx 40rpx;
     box-sizing: border-box;
     &-tool {
@@ -914,7 +1024,7 @@ onLoad(async (options) => {
       max-height: 180rpx;
       padding: 20rpx;
       box-sizing: border-box;
-      background: #FFF;
+      background: #f5f5f5;
     }
     .submitBtn {
       width: 140rpx;
@@ -979,4 +1089,10 @@ onLoad(async (options) => {
     }
   }
 }
+// .commonBackground {
+//   z-index: 1;
+//   &::before {
+// 	  height: 100px !important;
+//   }
+// }
 </style>