<template>
  <view>
    <qf-image-cropper
      ref="qfImageCropper"
      :width="200"
      :height="200"
      :src="cropImg"
      :rotatable="false"
      @crop="handleCrop"
    >
    </qf-image-cropper>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import QfImageCropper from '@/uni_modules/qf-image-cropper/components/qf-image-cropper/qf-image-cropper.vue';
import { uploadFile } from '@/utils';
const cropImg = ref('');

async function handleCrop(e) {
  try {
    uni.showLoading({
      title: '上传中...',
    });
    const { filePath, id } = await uploadFile(e.tempFilePath);
    uni.hideLoading();
    uni.navigateBack({
      delta: 1,
    });
    let file = { filePath: filePath, id: id, type: 1 };
    uni.$emit('filePathMsg', file);
    // uni.navigateTo({
    //   url: `/pages/mine/prefectInformation/index?filePath=${filePath}&id=${id}&type=1`,
    // });
  } catch (err) {
    uni.hideLoading();
  }
}
onLoad(option => {
  cropImg.value = option.file;
  uni.setNavigationBarColor({
    frontColor: '#ffffff', // 前景色值，包括按钮、标题、状态栏的颜色
    backgroundColor: '#2d2d2d', // 背景颜色值，包括背景、按钮等
  });
});
</script>
