Files
jjx-wap/pages/work/apply.vue
T

255 lines
6.9 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view class="wrap">
<!-- 吸顶 -->
<u-sticky offset-top="0" customNavHeight="0">
<!-- 标题 -->
<uititle title="申请加工"></uititle>
</u-sticky>
<view class="layout layout-title m-top-20">填写合作信息</view>
<quote-remain-num v-if="reloaded && sheet" :amount="sheet.quoteAmount" type="process" :id="sheetId"/>
<view class="layout layout-publish m-top-20 bg-white">
<view class="card-title m-top-30">报价信息</view>
<view class="group flex align-center m-top-30">
<view class="lb need m-right-20">加工费总价:</view>
<view class="vl flex-1">
<u--input
placeholder="请输入内容"
border="surround"
v-model="formData.totalPrice"
suffixIcon="元"
suffixIconStyle="font-size: 24rpx;color: #909399"
></u--input>
</view>
</view>
<!-- <view class="group flex align-center m-top-30">-->
<!-- <view class="lb need m-right-20">人民币大写:</view>-->
<!-- <view class="vl flex-1">-->
<!-- <u&#45;&#45;input-->
<!-- placeholder="请输入内容"-->
<!-- border="surround"-->
<!-- v-model="value"-->
<!-- @change="change"-->
<!-- ></u&#45;&#45;input>-->
<!-- </view>-->
<!-- </view>-->
<view class="group flex items-start m-top-30">
<view class="lb m-right-20 w-25p mt-20">报价单详情:</view>
<view class="vl flex-1">
<u-textarea
placeholder="请输入报价单详情"
border="surround"
v-model="formData.remark"
suffixIconStyle="font-size: 24rpx;color: #909399"
></u-textarea>
</view>
</view>
<view class="card-title m-top-30">附件信息</view>
<view class="group m-top-20">
<view class="lb need m-right-20">附件内容:</view>
<view class="flex justify-between align-center m-top-20">
<view class="lbx flex-1">仅支持纵向PDF文档,报价附件将生成标准合同附件,请认真审阅。</view>
</view>
<view class="m-top-30">
<u-upload
accept="file"
:fileList="files"
@afterRead="afterRead"
@delete="deletePic"
multiple
:maxCount="10"
></u-upload>
</view>
</view>
</view>
<u-button class="public-btn m-top-30" text="提交申请" @click="submit"></u-button>
</view>
</template>
<script>
import uititle from '@/components/common/title'
import dayjs from "dayjs";
import md5 from "js-md5";
export default {
components: {
uititle,
},
data() {
return {
sheet: null,
fileList1: [],
sheetId: null,
formData: {
totalPrice: '',
files: [],
remark: '',
},
reloaded: false,
files: []
};
},
methods: {
handTag(val) {
val.checked = !val.checked
},
afterRead({file}) {
file.forEach(item => {
const suffix = item.name.split('.').pop()
uniCloud.uploadFile({
filePath: item.url,
cloudPath: dayjs().format('YYYY/MM/DD') + '/' + md5(item.name + Date.now().toString()) + `.${suffix}`,
success: ({fileID}) => {
uniCloud.getTempFileURL({
fileList: [fileID]
}).then(res => {
this.formData.files.push(res.fileList[0].tempFileURL)
this.files.push({
url: res.fileList[0].tempFileURL,
name: item.name
})
})
}
})
})
},
deletePic({index}) {
this.formData.files.splice(index, 1)
},
async submit() {
if (!this.formData.files || this.formData.files.length === 0) {
return this.$message.error('请上传报价附件')
}
const data = await vk.userCenter.getCurrentUserInfo();
const {userInfo} = data
if (userInfo.quoteTimes > 3) {
}
vk.callFunction({
url: 'client/process/quote/kh/addQuote',
title: '请求中...',
data: {
sheetId: this.sheetId,
...this.formData
},
success: (data) => {
this.$message({
message: "报价成功",
type: 'success'
})
vk.navigateBack()
}
});
},
getDetail() {
vk.callFunction({
url: 'client/process/sheet/pub/getInfo',
title: '请求中...',
data: {
id: this.sheetId
},
success: (res) => {
this.sheet = res
}
});
},
},
onLoad({sheetId}) {
this.sheetId = sheetId
this.getDetail()
},
onShow() {
this.reloaded = false
setTimeout(() => {
this.reloaded = true
}, 500)
}
}
</script>
<style lang="scss">
.layout-title {
padding: 20rpx 30rpx;
font-size: 28rpx;
font-weight: 600;
line-height: 44rpx;
color: #A92924;
}
.card-title {
position: relative;
padding-left: 20rpx;
font-size: 26rpx;
font-weight: 600;
line-height: 48rpx;
color: #A92924;
&:before {
position: absolute;
left: 0;
top: 50%;
z-index: 9;
margin-top: -14rpx;
content: '';
width: 4rpx;
height: 28rpx;
background: #A92924;
}
}
.public-btn {
width: 80%;
margin-top: 60rpx;
color: #ffffff;
background: #A92924;
}
.layout-publish {
margin: 20rpx 30rpx;
padding: 50rpx 30rpx;
border-radius: 18rpx;
}
.tag-title {
font-size: 26rpx;
line-height: 40rpx;
color: #000000;
.limit {
font-size: 24rpx;
color: #999999;
}
}
.tag-box {
padding: 20rpx 0;
.item {
padding: 6rpx 10rpx;
font-size: 24rpx;
line-height: 32rpx;
color: #555555;
}
.active {
color: #A92924;
}
}
.lb,.fix {
position: relative;
font-size: 26rpx;
line-height: 40rpx;
color: #666666;
}
.lbx {
font-size: 24rpx;
color: #999999;
}
.download {
padding: 8rpx 20rpx;
font-size: 24rpx;
line-height: 36rpx;
color: #A92924;
border: 1px solid #A92924;
}
.need::before {
position: absolute;
left: -16rpx;
top: 50%;
z-index: 9;
margin-top: -12rpx;
content: '*';
color: #A92924;
font-size: 32rpx;
line-height: 1;
}
</style>