menduner-uniapp/pagesB/positionDetail/index.vue

<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="d-flex justify-space-between">
            <h2 class="JobName ellipsis">
              {{ info.name }}
            </h2>
            <span class="salary w-600">{{ info.payFrom }}-{{ info.payTo }}/{{ positionInfo.payName }}</span>
          </view>
          <!-- 职位地区 收藏职位 -->
          <view class="d-flex justify-space-between mt-5">
            <view class="bold" style="font-size: 14px;">
              <span>
                <span>{{positionInfo?.areaName }}</span>
                <span class="viewider-mx">|</span>
                <span>{{positionInfo?.eduName }}</span>
                <span class="viewider-mx">|</span>
                <span>{{positionInfo?.expName }}</span>
              </span>
            </view>
            <!-- 收藏职位 -->
            <view @click="handleCollection">
              <uni-icons
                :type="isCollection ? 'heart-filled' : 'heart'"
                color="#fc6d5e"
                class="mr"
                size="25"
              ></uni-icons>
            </view>
          </view>
          <!-- 标签 -->
          <view class="tagList mt">
            <view class="tag" v-for="(tag,i) in info?.tagList || []" :key="'tagList' + i">
              {{ tag }}
            </view>
          </view>
          <!-- 赏金 -->
          <view v-if="info.hire" class="topLine mt-5" style="display: flex; align-items: center;">
            <view class="iconfont icon-a-1_zhaopin" style="color: #e03506; font-size: 30px;"></view>
            <view class="hirePrice">{{ `赏金：${commissionCalculation(info.hirePrice, 1)}元` }}</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="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="info.requirement"></rich-text>
          </view>
          <!-- 企业信息 -->
          <view class="topLine mt-5 d-flex">
            <view class="avatarBox">
              <image class="avatar" :src="info.contact?.avatar || 'https://minio.citupro.com/dev/menduner/7.png'"></image>
            </view>
            <view >
              <view class="contact-name">{{ info.contact?.name }}</view>
              <view class="contact-info">{{ info.enterprise?.name }} · {{ info.contact?.postNameCn }}</view>
            </view>
          </view>
          <!-- 工作地址 -->
          <view class="topLine mt-5">
            <view class="fs15 w-600 my5">工作地址</view>
            <view class="my10">
              <uni-icons
                type="map-pin-ellipse"
                color="#00897B"
                class="mr"
                size="25"
              ></uni-icons>
              <span style="color: var(--color-666);font-size: 15px;line-height: 26px;">{{ info.address }}</span>
            </view>
          </view>
        </view>
      </view>
    </scroll-view>
    <!-- 分享 投递 -->
    <view class="bottom-sticky" v-if="!loading && jobId">
      <view style="display: flex;justify-content: space-evenly;align-items: center;width: 100%;margin: 20rpx 0;">
        <view @click="handleClickShare" style="display: flex;justify-content: center;flex-direction: column;align-items: center;">
          <uni-icons type="redo-filled" size="24" color="#00897B"/>
          <span style="color:#00897B;font-weight:bold;">分享</span>
        </view>
        <button v-if="delivery" :disabled="true" class="buttons disable">我已投递</button>
        <button v-else class="buttons" @click="handleDelivery">我要投递</button>
      </view>
    </view>
    <!-- 选择简历 -->
    <uni-popup ref="popup" background-color="#fff" :mask-click="false" >
      <view class="dialogBox" style="width: 86vw;">
        <view class="dialog-title">
          <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 }}
                </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="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="分享到" @select="handleSelect"></uni-popup-share>
    </uni-popup>
  </layout-page>
</template>

<script setup>
import { commissionCalculation } from '@/utils/position'
import { timesTampChange } from '@/utils/date'
import { preview } from '@/utils/preview'
import { uploadFile } from '@/api/file'
import layoutPage from '@/layout'
import { ref } from 'vue';
import {
  jobCvRelSend,
  getPositionDetails,
  jobCvRelCheckSend,
  getPersonJobUnfavorite, // 取消收藏
  getPersonJobFavorite, // 收藏
  getJobFavoriteCheck
} from '@/api/position'
import { getPersonResumeCv, saveResume } from '@/api/user'
import { dealDictObjData } from '@/utils/position'
import { getAccessToken } from '@/utils/request'
import { onLoad } from '@dcloudio/uni-app';

const sharePopup = ref()
const loading = ref(false)
const loadingText = ref('加载中 . . . ')

// 职位详情
const info = ref({})
const positionInfo = ref({})
const getPositionDetail = async () => {
  try {
    loading.value = true
    const { data } = await getPositionDetails({ id: jobId })
    info.value = data
    positionInfo.value = { ...dealDictObjData({}, info.value), ...info.value }
    loading.value = false
    console.log('positionInfo', positionInfo.value)
  } finally {
  }
}

let jobId = ''
onLoad((options) => {
  jobId = options?.id || ''
  if (jobId) {
    loading.value = true
    loadingText.value = '加载中 . . . '
    deliveryCheck()
    getCollectionStatus()
    getPositionDetail()
  } else {
    loadingText.value = '加载失败 . . . '
  }
})

// 效验是否有投递过简历
const delivery = ref(false) // 是否已投递简历
const deliveryCheck = async () => {
  try {
    if (!getAccessToken()) return delivery.value = false
    const { data } = await jobCvRelCheckSend({ jobId })
    delivery.value = Boolean(data)
  } finally {
  }
}

import { showAuthModal } from '@/hooks/useModal'
const popup = ref()
const uploadPopup = ref()
const resumeList = ref([])
const selectIndex = ref(null)
const handleDelivery = async () => {
  // 未登录
  if (!getAccessToken()) {
    uni.showToast({
      title:'请先登录',
      icon: 'none'
    })
    showAuthModal()
    return
  }
  // 已投递
  if (delivery.value) {
    uni.showToast({ title: '您已投递过该职位！', icon: 'none', duration: 2000, })
    return
  }
  const { data } = await getPersonResumeCv()
  resumeList.value = data
  // 未上传简历
  if (!resumeList.value?.length) return uploadPopup.value.open()
  popup.value.open()
}
const deliverySubmit = async (uploadFile) => {
  const resume = uploadFile ? uploadFile : resumeList.value[selectIndex.value]
  if (!resume) {
    selectIndex.value = null
    uni.showToast({ title: '请选择简历', icon: 'none', duration: 2000, })
    return
  }
  await jobCvRelSend({ jobId, title: resume.title, url: resume.url, type: info.value.hire ? 1 : 0 })
  uni.showToast({ title: '投递成功', icon: 'none', duration: 2000, })
  deliveryCheck()
  popup.value.close()
}

const popupClose = () => {
  selectIndex.value = null
  popup.value.close()
}

// 效验求职者是否有收藏该职位
const isCollection = ref(false)
const getCollectionStatus = async () => {
  if (!getAccessToken()) return isCollection.value = false
  const { data } = await getJobFavoriteCheck({ jobId })
  isCollection.value = Boolean(data)
}

// 操作 收藏&取消收藏职位
const handleCollection = async () => {
  const api = isCollection.value ? getPersonJobUnfavorite : getPersonJobFavorite
  await api(isCollection.value ? jobId : { jobId })
  await getCollectionStatus()
}

// 选取微信聊天文件
// 上传附件
const handleUpload = () => {
  wx.chooseMessageFile({
    count: 1,
    type: 'file',
    success (res) {
      const title = res.tempFiles[0].name
      const path = res.tempFiles[0].path
      //效验是否为支持的文件格式
      if(/\.(pdf|docx|doc)$/.test(title)){
        uploadFile(path).then(async (res) => {
          if (!res.data) {
            uni.showToast({
              title: '上传失败',
              icon: 'none'
            })
            return
          }
          await saveResume({ title, url: res.data })
          uni.showToast({
            title: '上传成功',
            icon: 'success'
          })
          deliverySubmit({ title, url: res.data })
        })
      }else{
        uni.showToast({
          icon: 'none',
          title: '请上传pdf、word类型的文件',
          duration: 2000
        })
        return
      }
    }
  })
}

// 分享
const handleClickShare = () => {
  sharePopup.value.open()
}

const handleSelect = (e) => {
  console.log(e, 'share')
  uni.showToast({ title: '正在努力建设中 . . .', icon: 'none', duration: 2000, })
}

</script>

<style scoped lang="scss">
@import '../../static/style/position/index.scss';
</style>