You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
283 lines
8.7 KiB
283 lines
8.7 KiB
<template>
|
|
<view class="v-pages">
|
|
<!-- 页面 产品 -->
|
|
<view class="v-pages-product">
|
|
<view class="v-product-name">{{formData.productName}}</view>
|
|
<view class="v-product-code m-t-small"><text
|
|
class="iconfont icon-code m-r-small"></text>{{formData.traceabilityProduct}}</view>
|
|
</view>
|
|
|
|
<!-- 页面 表单 -->
|
|
<view class="v-form v-container" style="margin-top:-40px; padding-bottom:140rpx;">
|
|
<uni-forms :modelValue="formData" ref="formRef" :label-width="80" :rules="formRules">
|
|
<view class="v-form-item">
|
|
<view class="v-form-tip delivery m-t-small">配</view>
|
|
<uni-forms-item label="配送公司" name="logisticsId" required>
|
|
<picker @change="CustomChange" :value="CurrentCustomer" :range="CustomPickerList">
|
|
<view class="uni-input" v-if="CustomPickerList[CurrentCustomer]">
|
|
{{CustomPickerList[CurrentCustomer]}}
|
|
</view>
|
|
<view v-else class="placeholder">请选择配送公司<uni-icons type="down" size="14"></uni-icons></view>
|
|
</picker>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="配送人" name="deliveryMan" required>
|
|
<input v-model="formData.deliveryMan" placeholder="请输入配送人" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="配送日期" name="deliveryTime">
|
|
<uni-datetime-picker :clear-icon="false" type="date" returnType="timestamp" v-model="formData.deliveryTime" @change="changeLog($event)" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="所在地区" name="startRegion" required>
|
|
<view @tap="startOpen">
|
|
<text
|
|
v-if="startLocalData">{{startLocalData.provinceName}}/{{startLocalData.cityName}}/{{startLocalData.areaName}}</text>
|
|
<text class="placeholder" v-else>请选择所在地区</text>
|
|
<uni-icons type="down" size="14"></uni-icons>
|
|
</view>
|
|
<cityPicker :column="column" :default-value="defaultValue" :mask-close-able="startMaskCloseAble"
|
|
@confirm="startConfirm" @cancel="startCancel" :visible="startVisible" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="详细地址" name="startAddress" required>
|
|
<input v-model="formData.startAddress" placeholder="请输入详细地址" />
|
|
</uni-forms-item>
|
|
</view>
|
|
<view class="v-form-item">
|
|
<view class="v-form-tip received m-t-small">收</view>
|
|
<uni-forms-item label="接收人" name="receivedMan" class="no-border">
|
|
<input v-model="formData.receivedMan" placeholder="请输入接收人" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="接收日期" name="receivedTime">
|
|
<uni-datetime-picker :clear-icon="false" type="date" returnType="timestamp" v-model="formData.receivedTime" @change="changeLog($event)" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="所在地区" name="endRegion" required>
|
|
<view @tap="endOpen">
|
|
<text
|
|
v-if="endLocalData">{{endLocalData.provinceName}}/{{endLocalData.cityName}}/{{endLocalData.areaName}}</text>
|
|
<text class="placeholder" v-else>请选择所在地区</text>
|
|
<uni-icons type="down" size="14"></uni-icons>
|
|
</view>
|
|
<cityPicker :column="column" :default-value="defaultValue" :mask-close-able="endMaskCloseAble"
|
|
@confirm="endConfirm" @cancel="endCancel" :visible="endVisible" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="详细地址" name="endAddress" required>
|
|
<input v-model="formData.endAddress" placeholder="请输入详细地址" />
|
|
</uni-forms-item>
|
|
</view>
|
|
</uni-forms>
|
|
<view class="fixed fixedBottom v-container"><button class="v-primary-btn large"
|
|
@click="submitForm()">保存</button></view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as ProductApi from "@/api/traceability/product"
|
|
import * as DeliveryApi from "@/api/traceability/deliveryrecord"
|
|
import * as customApi from "@/api/traceability/custom"
|
|
import mix from '@/utils/mix.js'
|
|
import cityPicker from '@/uni_modules/piaoyi-cityPicker/components/piaoyi-cityPicker/piaoyi-cityPicker'
|
|
import {
|
|
getDictDatas,
|
|
DICT_TYPE
|
|
} from '@/utils/dict';
|
|
export default {
|
|
components: {
|
|
cityPicker
|
|
},
|
|
mixins: [mix],
|
|
data() {
|
|
return {
|
|
|
|
defaultValue: '',
|
|
column: 3,
|
|
startVisible: false,
|
|
startMaskCloseAble: true,
|
|
startLocalData: null,
|
|
endVisible: false,
|
|
endMaskCloseAble: true,
|
|
endLocalData: null,
|
|
|
|
ProductID: null,
|
|
|
|
CurrentCustomer: -1,
|
|
CustomList: [],
|
|
CustomPickerList: [],
|
|
|
|
formData: {
|
|
id: undefined,
|
|
productId: undefined,
|
|
productName: undefined,
|
|
traceabilityProduct: undefined,
|
|
logisticsId: undefined,
|
|
deliveryTime: undefined,
|
|
receivedTime: undefined,
|
|
deliveryMan: undefined,
|
|
receivedMan: undefined,
|
|
startProvince: undefined,
|
|
startCity: undefined,
|
|
startCountry: undefined,
|
|
startAddress: undefined,
|
|
endProvince: undefined,
|
|
endCity: undefined,
|
|
endCountry: undefined,
|
|
endAddress: undefined,
|
|
startRegion: undefined,
|
|
endRegion: undefined,
|
|
},
|
|
// 表单校验
|
|
formRules: {
|
|
logisticsId: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '配送公司不能为空！'
|
|
}]
|
|
},
|
|
deliveryMan: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '配送人不能为空！'
|
|
}]
|
|
},
|
|
deliveryTime: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '配送日期不能为空！'
|
|
}]
|
|
},
|
|
startAddress: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '详细地址不能为空！'
|
|
}]
|
|
},
|
|
endAddress: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '详细地址不能为空！'
|
|
}]
|
|
},
|
|
startRegion: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '所在区域不能为空！'
|
|
}]
|
|
},
|
|
endRegion: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '所在区域不能为空！'
|
|
}]
|
|
},
|
|
},
|
|
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
// 获取当前ID号
|
|
this.ProductID = JSON.parse(JSON.stringify(options.id))
|
|
// 获取页面
|
|
this.initialize(this.ProductID)
|
|
},
|
|
onReady() {
|
|
// 设置自定义表单校验规则，必须在节点渲染完毕后执行
|
|
this.$refs.formRef.setRules(this.formRules)
|
|
},
|
|
methods: {
|
|
changeLog(e) {
|
|
console.log('change事件:', e, this.formData);
|
|
},
|
|
// 页面初始化
|
|
async initialize(id) {
|
|
try {
|
|
this.getAllCustom()
|
|
/** 获取溯源产品 信息 */
|
|
const res = await ProductApi.getAllTraceableProducts(id)
|
|
this.formData.productId = id
|
|
this.formData.productName = res.data[0].processingName
|
|
this.formData.traceabilityProduct = res.data[0].traceabilityProduct
|
|
this.formData.deliveryTime = new Date()
|
|
|
|
} finally {}
|
|
},
|
|
|
|
/** 提交按钮 */
|
|
async submitForm() {
|
|
// 校验主表
|
|
try {
|
|
await this.$refs['formRef'].validate()
|
|
const data = this.formData
|
|
await DeliveryApi.createDeliveryRecord(data)
|
|
uni.showToast({
|
|
title: `保存成功`,
|
|
icon: 'success',
|
|
duration: 2000,
|
|
complete: function() {
|
|
uni.setStorageSync( 'canRefresh', 'true');
|
|
setTimeout(function() {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
}, 2000);
|
|
}
|
|
})
|
|
} catch (err) {
|
|
console.log("验证未通过")
|
|
} finally {}
|
|
},
|
|
|
|
// 获得配送公司列表
|
|
async getAllCustom() {
|
|
try {
|
|
const res = await customApi.getAllDeliveryCompany()
|
|
let newData = res.data
|
|
this.CustomList = newData
|
|
this.CustomPickerList = newData.map(item => {
|
|
return item.logisticsName
|
|
})
|
|
} finally {}
|
|
},
|
|
|
|
// 选择配送公司
|
|
CustomChange(e) {
|
|
this.CurrentCustomer = e.detail.value
|
|
this.formData.logisticsId = this.CustomList[this.CurrentCustomer].id
|
|
this.formData.deliveryMan = this.CustomList[this.CurrentCustomer].logisticsLeader
|
|
},
|
|
|
|
//配送地址
|
|
startOpen() {
|
|
this.startVisible = true
|
|
},
|
|
startConfirm(val) {
|
|
console.log(val)
|
|
this.startLocalData = val
|
|
this.startVisible = false
|
|
this.formData.startRegion = this.startLocalData.name
|
|
this.formData.startProvince = this.startLocalData.provinceCode
|
|
this.formData.startCity = this.startLocalData.cityCode
|
|
this.formData.startCountry = this.startLocalData.areaCode
|
|
},
|
|
startCancel() {
|
|
this.startVisible = false
|
|
},
|
|
|
|
//接收地址
|
|
endOpen() {
|
|
this.endVisible = true
|
|
},
|
|
endConfirm(val) {
|
|
this.endLocalData = val
|
|
this.endVisible = false
|
|
this.formData.endRegion = this.endLocalData.name
|
|
this.formData.endProvince = this.endLocalData.provinceCode
|
|
this.formData.endCity = this.endLocalData.cityCode
|
|
this.formData.endCountry = this.endLocalData.areaCode
|
|
},
|
|
endCancel() {
|
|
this.endVisible = false
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|
|
|