bonus-material-app/src/pages/new-purchase/accept/conclusion.vue

<template>
    <view class="accept page-common">
        <div class="card">
            <uni-forms :model="formData" label-width="100" :border="true">
                <uni-forms-item label="物资名称：" name="maTypeName">
                    <span class="form-view">{{ formData.maTypeName }}</span>
                </uni-forms-item>

               <uni-forms-item label="物资规格：" name="typeName">
                    <span class="form-view">{{ formData.typeName }}</span>
                </uni-forms-item>

                <uni-forms-item label="到货数量：" name="purchaseNum">
                    <span class="form-view">{{ formData.purchaseNum }}</span>
                </uni-forms-item>

              	<uni-forms-item label="质保材料：" name="warnDocuments">
                    <uni-easyinput v-model="warnDocuments" placeholder="请输入质保材料" />
                </uni-forms-item>

                <uni-forms-item label="验收结论：" name="checkResult">
                    <uni-data-select v-model="checkResult"
                        :localdata="range">
                    </uni-data-select>
                </uni-forms-item>

                <uni-forms-item label="原因：" name="reason">
                    <uni-easyinput v-model="reason" placeholder="请输入原因" />
                </uni-forms-item>

                <uni-forms-item label="上传图片：" name="imgList">
                    <!-- <uni-file-picker fileMediatype="image" :image-styles="imageStyles"/> -->
                    <div class="upload" @click="uploadImg" v-if="imgBeseUrl==''">+</div>
                    <div class="upload" @click="uploadImg" v-else>
						<image :src="imgBeseUrl" style="width: 160rpx;height: 160rpx;" mode=""></image>
					</div>
                </uni-forms-item>
            </uni-forms>
        </div>

        <div class="btn">
            <button class="btn-cont" @click="reject">不合格</button>
            <button class="btn-cont" @click="pass">合格</button>
        </div>
    </view>
</template>

<script setup>
import { ref, reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { innerVerify } from '../../../services/purchase.js';
import { baseURL } from '@/utils/http'
const formData = ref({})
const checkResult = ref("合格")
const warnDocuments = ref("")
const reason = ref("")
const imgBeseUrl = ref("")//页面展示选中图片
const bmFileInfos = ref([])//请求图片参数


const range = reactive([{value:"合格",text:"合格"},{value:"不合格",text:"不合格" },])


//合格
const pass = () => { 
	let obj = {
		"taskId":formData.value.taskId,
		"typeId":formData.value.typeId,
		"manageType":formData.value.manageType,
		"status":3,
		"checkResult":checkResult.value,
        "reason":reason.value,
        "warnDocuments":warnDocuments.value,
		"bmFileInfos":bmFileInfos.value
	}
	console.log(obj)
	let param = {
		purchaseCheckDetailsList:[obj],
		verifyPass:true
	}
	console.log(param)
	innerVerify(param).then(res => { 
		console.log(res)
		if (res.code == 200) {
			uni.showToast({ title: res.msg, icon: 'none' })
			setTimeout(() => {
				uni.navigateBack({
					delta: 1 // 返回到已存在的页面
				});
			}, 500)
		}else{
			uni.showToast({ title: res.msg, icon: 'none' })
		}
		
	}).catch(error => {
		console.log(error) 
	})  
}
//不合格
const reject = () => { 
	let obj = {
		"taskId":formData.value.taskId,
		"typeId":formData.value.typeId,
		"manageType":formData.value.manageType,
		"status":1,
		"checkResult":checkResult.value,
		"reason":reason.value,
		"warnDocuments":warnDocuments.value,
		"bmFileInfos":bmFileInfos.value
	}
	console.log(obj)
	let param = {
		purchaseCheckDetailsList:[obj],
		verifyPass:false
	}
	console.log(param)
	innerVerify(param).then(res => { 
		console.log(res)
		if(res.code==200){
			uni.showToast({ title: '操作成功', icon: 'none' })
			uni.navigateBack({
				delta: 1 // 返回到已存在的页面
			});
		}else{
			uni.showToast({ title: res.msg, icon: 'none' })
		}
		
	}).catch(error => {
		console.log(error) 
	})  
}

//上传
const uploadImg = () => {
    uni.chooseImage({
    count: 1, //图片可选择数量
    sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
    sourceType: ['album', 'camera',], //album 从相册选图，camera 使用相机，默认二者都有。
    success: res => {
        console.log(res)
        let imgFiles = res.tempFilePaths //图片的本地文件路径列表
		imgBeseUrl.value = imgFiles[0]
        // console.log('本地地址', imgFiles)
        // console.log('请求地址', baseURL+"/file/upload") 
		uni.uploadFile({
			// url: baseURL+"/file/upload",//app
			url: "/file/upload",//h5
			filePath: imgFiles[0],
			name: 'file', 
			success: (res) => {
				res = JSON.parse(res.data)
				console.log('上传成功', res.code);
				console.log('上传成功', res.data);
				if(res.code&&res.code==200){
					let obj = {
						"name":res.data.name,
						"url":res.data.url,
						"taskType":"10"
					}
					// console.log(obj)
					bmFileInfos.value = [obj]
					uni.showToast({ title: '上传成功', icon: 'none' })
				}else{
					bmFileInfos.value = []
					uni.showToast({ title: '上传失败', icon: 'none' })
				}
			},
			fail: (err) => {
			  console.error('上传失败', err);
			}
		});
        // this.$refs.vForm.clearValidate()
    }
	})
}




onLoad((options)=>{
	console.log(options)
	formData.value = JSON.parse(options.item)
})
</script>

<style lang="scss">
.accept {
    padding: 10px;
    height: 100%;
    word-break: break-all;
}
.card {
    padding: 10px;
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 2upx 4upx 0 rgba(0, 0, 0, 0.1);
}
.form-view{
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
}
.upload {
    width: 80px;
    height: 80px;
    background-color: #f5f5f5;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    color: #ccc;
    margin-top: 10px;
}
.btn {
    display: flex;
    justify-content: space-around;
    margin-top: 30px;

    .btn-cont {
        width: 40%;
        height: 40px;
        line-height: 40px;
        text-align: center;
        background-color: #3784fb;
        color: #fff;
        border-radius: 20px;
        // 取消按钮淡蓝色
        &:first-child {
            background-color: #aacefb;
        }
    }
}
</style>