<template>
|
<!-- 添加购买证 -->
|
<view class="addTo-freightForwarder-drvier">
|
<view class="addForm">
|
<u--form labelPosition="top"
|
:rules="rules"
|
:model="form"
|
ref="form1">
|
<u-form-item labelWidth="20%"
|
label="证号"
|
ref="item1" prop="cardNumber"><u--input v-model="form.cardNumber"
|
:customStyle="{ border: '1px solid #dddddd' }"></u--input></u-form-item>
|
<u-form-item labelWidth="20%"
|
label="产品"
|
ref="item1"
|
@click="treeOpen"
|
prop='productId'>
|
<u--input placeholder="请选择产品"
|
v-model="productName"
|
class="input"
|
type="text"></u--input>
|
<qian-tree ref="tkitree"
|
:range="productData"
|
rangeKey='productName'
|
confirmColor="#4e8af7"
|
:selectParent="true"
|
title="选择产品"
|
@confirm="treeChooseValue" />
|
</u-form-item>
|
<u-form-item labelWidth="20%"
|
label="购买总量(KG)"
|
ref="item1" prop="buyTotal1">
|
<u--input v-model="buyTotal1"
|
:customStyle="{ border: '1px solid #dddddd' }"></u--input>
|
</u-form-item>
|
<u-form-item labelWidth="20%"
|
label="购买总量(吨)"
|
ref="item1" prop="buyTotal">
|
<u--input v-model="form.buyTotal" disabled
|
:customStyle="{ border: '1px solid #dddddd' }"></u--input>
|
</u-form-item>
|
<u-form-item labelWidth="25%"
|
label="时间">
|
<uni-datetime-picker v-model="range" type="daterange" @change="maskClick" />
|
</u-form-item>
|
<u-form-item labelWidth="25%"
|
label="购买证照片"
|
@click="beforeRead"
|
prop="buyFilePath"
|
required>
|
<u-upload :fileList="fileList1"
|
@afterRead="afterRead"
|
@delete="deletePic"
|
name="1"
|
multiple
|
:maxCount="1"
|
width="250"
|
height="150"
|
:previewFullImage="true"></u-upload>
|
</u-form-item>
|
</u--form>
|
</view>
|
<view class="addBtn"><u-button text="确认"
|
type="primary"
|
@click="addToHuoDaiOrDriver"
|
:loading="loading"></u-button></view>
|
</view>
|
</template>
|
|
<script>
|
import { customerId } from '@/utils/status.js';
|
import qianTree from '@/components/qian-tree/qian-tree.vue';
|
import { BaseUrl } from '@/api/publicInterface.js';
|
import { mapMutations, mapState } from 'vuex';
|
export default {
|
components: {
|
qianTree
|
},
|
onLoad(params) {
|
if(params.data){
|
this.form=Object.assign({},this.form,JSON.parse(decodeURIComponent(params.data)))
|
this.productName=this.form.productName
|
this.range=[this.form.startDate,this.form.endDate]
|
if (this.fileList1.length == 0 && this.form.buyFilePath) {
|
this.fileList1.push({
|
url: `${BaseUrl}${this.form.buyFilePath}`
|
});
|
}
|
}
|
},
|
watch:{
|
form(newval,oldval){
|
if(!newval||newval==''){
|
this.form.buyTotal=null
|
}else{
|
this.buyTotal1=(newval.buyTotal*1000).toFixed(2)
|
}
|
},
|
buyTotal1(newval,oldval){
|
if(!newval||newval==''){
|
this.form.buyTotal=null
|
}else{
|
this.form.buyTotal=(newval/1000).toFixed(2)
|
}
|
},
|
},
|
data() {
|
return {
|
buyTotal1:0,
|
form:{
|
buyTotal:0,
|
cardNumber:"",
|
customerId,
|
productId:"",
|
status:0,
|
endDate:"",
|
startDate:""
|
},
|
fileList1: [],
|
productName:"",
|
range:"",
|
productData:[],
|
rules: {
|
cardNumber: {
|
type: 'string',
|
required: true,
|
message: '请输入证号',
|
trigger: ['blur', 'change']
|
},
|
buyTotal: [{
|
type: 'number',
|
required: true,
|
message: '请输入购买总量',
|
// blur和change事件触发检验
|
trigger: ['blur', 'change']
|
}
|
]
|
},
|
};
|
BaseUrl
|
},
|
onShow() {
|
this.init();
|
},
|
methods: {
|
...mapMutations(['changeisUploadimg']),
|
init() {
|
this.$reqGet('getProductIsDanger').then(res => {
|
this.productData = res.data;
|
});
|
},
|
addToHuoDaiOrDriver() {
|
this.$refs.form1.validate().then(res => {
|
if (this.form.productId == '' ) {
|
uni.showToast({
|
title: '请选择产品！',
|
icon: 'error',
|
duration: 2000
|
});
|
}else if(this.form.startDate == ''||this.form.endDate == '' ) {
|
uni.showToast({
|
title: '请选择时间！',
|
icon: 'error',
|
duration: 2000
|
});
|
} else {
|
if(this.form.id){
|
this.$reqPut('putBuycard',{ ...this.form,status:0,}, 'json').then(result => {
|
if (result.code == 0) {
|
this.$u.toast('提交成功');
|
let timer = setTimeout(() => {
|
uni.navigateBack({
|
delta: 1
|
});
|
uni.$emit('needRefresh')
|
}, 500);
|
} else {
|
this.$u.toast(result.msg ? result.msg : '提交失败');
|
}
|
})
|
}else{
|
this.$reqPost('addBuycard', this.form, 'json').then(result => {
|
if (result.code == 0) {
|
this.$u.toast('提交成功');
|
let timer = setTimeout(() => {
|
uni.navigateBack({
|
delta: 1
|
});
|
uni.$emit('needRefresh')
|
}, 500);
|
} else {
|
this.$u.toast(result.msg ? result.msg : '提交失败');
|
}
|
});
|
}
|
}
|
})
|
},
|
maskClick(e){
|
this.form.startDate=e[0]
|
this.form.endDate=e[1]
|
},
|
findNameById(tree, idArr) {
|
let result = [];
|
function traverse(node, idArr) {
|
if (!node) return;
|
if (idArr.includes(node.id)) {
|
result.push({name:node.productName,id:node.id});
|
}
|
if (node.children && node.children.length > 0) {
|
node.children.forEach(child => {
|
traverse(child, idArr);
|
});
|
}
|
}
|
tree.forEach(node => {
|
traverse(node, idArr);
|
});
|
return result;
|
},
|
treeOpen() {
|
this.$refs.tkitree._show();
|
},
|
treeClose() {
|
this.$refs.tkitree._hide();
|
},
|
treeChooseValue(v) {
|
this.$refs.tkitree._hide();
|
let data=this.findNameById(this.productData, v)[0]
|
this.form.productId = data.id;
|
this.productName=data.name
|
this.$refs.form1.clearValidate('productId');
|
},
|
beforeRead() {
|
this.changeisUploadimg(true);
|
},
|
// 新增图片
|
async afterRead(event) {
|
// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
|
let lists = [].concat(event.file);
|
let fileListLen = this[`fileList${event.name}`].length;
|
lists.map(item => {
|
this[`fileList${event.name}`].push({
|
...item,
|
status: 'uploading',
|
message: '上传中'
|
});
|
});
|
for (let i = 0; i < lists.length; i++) {
|
const result = await this.uploadFilePromise(lists[i].url, event.name);
|
let item = this[`fileList${event.name}`][fileListLen];
|
this[`fileList${event.name}`].splice(
|
fileListLen,
|
1,
|
Object.assign(item, {
|
status: 'success',
|
message: '上传成功',
|
url: result
|
})
|
);
|
fileListLen++;
|
}
|
},
|
// 删除
|
deletePic(event) {
|
this.changeisUploadimg(true);
|
this[`fileList${event.name}`].splice(event.index, 1);
|
},
|
uploadFilePromise(url, num) {
|
return new Promise((resolve, reject) => {
|
let a = uni.uploadFile({
|
url: BaseUrl + '/admin/sys-file/uploadUnToken',
|
filePath: url,
|
name: 'file',
|
// formData: {
|
// user: 'test'
|
// },
|
success: res => {
|
this.form.buyFilePath = JSON.parse(res.data).data.url;
|
resolve(`${BaseUrl}${JSON.parse(res.data).data.url}`);
|
}
|
});
|
});
|
},
|
},
|
|
};
|
</script>
|
|
<style lang="scss"
|
scoped>
|
::v-deep.addTo-freightForwarder-drvier {
|
width: 90%;
|
margin: 0 auto;
|
|
.addForm {
|
margin: 0 auto;
|
}
|
|
.else-invite {
|
width: vww(150);
|
margin: 0 auto;
|
color: #3c9cff;
|
margin-top: vww(40);
|
}
|
|
.addBtn {
|
width: 90%;
|
// position: fixed;
|
// bottom: vww(48);
|
margin: 0 auto;
|
}
|
}
|
::v-deep.tki-tree .tki-tree-mask .tki-tree-cnt{
|
position: fixed;
|
top: 50vh;
|
}
|
</style>
|
