menduner-uniapp/pagesA/resume/index.vue

<template>
  <view class="ss-p-b-100" style="height: 100vh; background-color: #f2f4f7;">
    <uni-notice-bar text="温馨提示：最多可以上传5份附件简历。请在手机上打开此小程序进行文件上传，暂不支持在桌面版小程序中上传文件。" />
    <view v-if="bioList?.length > 0">
      <view v-for="(item, index) in bioList" :key="index" class="default-border list-item">
        <view class="d-flex align-center">
          <view v-if="props.resumeAnalysis" class="ss-m-r-15">
            <radio :value="index" color="#00B760" :checked="index === checkedIndex" @tap="radioChange(index)" />
          </view>
          <view @click="preview(item.url)"  style="flex: 1;">
            <view class="MiSans-Semibold" style="font-weight: bold;">{{ item.title }}</view>
            <view class="color-666 MiSans-Normal ss-m-t-10 font-size-14">上传时间：{{ timesTampChange(item.createTime, 'Y-M-D') }}</view>
          </view>
          <view class="ss-m-l-30" style="width: 60rpx;">
            <uni-icons @click="handleOpenPopup(item)" type="more-filled" size="20"></uni-icons>
          </view>
        </view>
      </view>
		</view>
		<view v-else class="nodata-img-parent">
			<image src="https://minio.menduner.com/dev/bb43df1dc91945e05ee93da76e49b34f87b0d10203eb76c20e2d4999a13b9a0a.png" mode="widthFix" style="width: 100vw;height: 100vh;"></image>
		</view>
    <view class="bottom-sticky flex-column">
      <button v-if="props.resumeAnalysis" class="recomm-button" style="margin-bottom: 0; border-radius: 25px;" :loading="analysisLoading" @click="handleResumeAnalysis">开始解析</button>
      <button class="recomm-button MiSans-Medium" style="margin-bottom: 0; border-radius: 25px;" @click="handleUpload">微信聊天文件上传</button>
      <view class="color-primary font-size-14 ss-m-b-25 ss-m-t-10 MiSans-Normal" style="text-align: center;">上传文件大小不能超过20MB</view>
    </view>

    <uni-popup ref="popup" type="bottom">
      <button class="big-cancel-button MiSans-Normal" style="color: #666 !important;" @click="handleDelete">删除附件</button>
      <button class="big-cancel-button MiSans-Normal" @click="popup.close(); currentId = ''">取消</button>
    </uni-popup>
  </view>
</template>

<script setup>
import { ref } from 'vue'
import { getPersonResumeCv, saveResume, deleteResume } from '@/api/user'
import { uploadFile } from '@/api/file'
import { timesTampChange } from '@/utils/date'
import { preview } from '@/utils/preview'

const emit = defineEmits(['submit'])
const props = defineProps({
  resumeAnalysis: { type: Boolean, default: false }
})

// 获取附件
const bioList = ref([])
const getList = async () => {
  uni.showLoading({ title: '加载中...' })
  try {
    const { data } = await getPersonResumeCv()
    bioList.value = data
  } catch {
    uni.hideLoading()
  } finally {
    uni.hideLoading()
  }
}
getList()

// 更多
const currentId = ref('')
const popup = ref()
const handleOpenPopup = (item) => {
  currentId.value = item.id
  popup.value.open()
}

// 删除附件
const handleDelete = async () => {
  if (!currentId.value) return
  await deleteResume(currentId.value)
  uni.showToast({
    title: '删除成功',
    icon: 'success',
    duration: 2000
  })
  currentId.value = ''
  popup.value.close()
  getList()
}

// 上传附件
const handleUpload = () => {
  if (bioList.value.length >= 5) {
    uni.showToast({
      icon: 'none',
      title: '最多可上传5份简历'
    })
    return
  }
  // 检查API是否可用
  if (typeof wx === 'undefined' || typeof wx.chooseMessageFile !== 'function') {
    uni.showToast({
      icon: 'none',
      title: '当前环境不支持文件选择功能',
      duration: 3000
    })
    return
  }

  console.log('开始调用wx.chooseMessageFile')
  
  wx.chooseMessageFile({
    count: 1,
    type: 'file',
    success (res) {
      console.log('文件选择成功:', res)
      
      // 检查返回结果
      if (!res || !res.tempFiles || !res.tempFiles.length) {
        uni.showToast({
          icon: 'none',
          title: '文件选择失败，请重试',
          duration: 2000
        })
        return
      }

      // 限制文件上传大小
      const size = res.tempFiles[0].size
      if (size / (1024*1024) > 20) {
        uni.showToast({ icon: 'none', title: '文件大小不能超过20M' })
        return
      }

      const title = res.tempFiles[0].name
      const path = res.tempFiles[0].path
      //效验是否为支持的文件格式
      if(/\.(pdf|docx|doc)$/.test(title)){
        // 显示上传进度
        uni.showLoading({
          title: '上传中...'
        })
        
        uploadFile(path, 'attachment').then(async (res) => {
          uni.hideLoading()
          if (!res.data) {
            uni.showToast({
              title: '上传失败',
              icon: 'none'
            })
            return
          }
          await saveResume({ title, url: res.data })
          uni.showToast({
            title: '上传成功',
            icon: 'success'
          })
          getList()
        }).catch(error => {
          uni.hideLoading()
          console.error('上传文件失败:', error)
          uni.showToast({
            title: '上传失败，请重试',
            icon: 'none',
            duration: 2000
          })
        })
      }else{
        uni.showToast({
          icon: 'none',
          title: '请上传pdf、doc、docx类型的文件',
          duration: 2000
        })
        return
      }
    },
    fail (error) {
      console.error('文件选择失败:', error)
      uni.showToast({
        icon: 'none',
        title: '文件选择失败，请检查权限设置或重试',
        duration: 3000
      })
    }
  })
}

const fileUrl = ref('')
const checkedIndex = ref()
const radioChange = (index) => {
  if (!props.resumeAnalysis) return
  checkedIndex.value = index
  if (bioList.value[index]?.url) fileUrl.value = encodeURIComponent(bioList.value[index].url)
}

const analysisLoading = ref(false)
const handleResumeAnalysis = () => {
  if (!fileUrl.value) return uni.showToast({ icon: 'none', title: '请选择要解析的简历' })
  analysisLoading.value = true
  emit('submit', fileUrl.value)
	// uni.navigateTo({
	// 	url: `/pagesA/resumeAnalysis/index?fileUrl=${fileUrl.value}`
	// })
}

</script>

<style scoped lang="scss">
.list-item {
  margin: 30rpx;
  border-radius: 20rpx;
  padding: 30rpx;
  background-color: #fff;
  box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.17);
  &:last-child {
    margin-bottom: 0;
  }
  &:first-child {
    margin-top: 0;
  }
}
</style>