pad-app/pages/quality/edit.vue

1775 lines
47 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="edit">
<head-view title="货物质损" url="/pages/quality/index"></head-view>
<view class="stepsBox" v-show="isShow">
<uni-steps :options="stepList" :active="active" />
</view>
<scroll-view>
<view class="container contentFixed">
<template v-if="active == 0">
<view class="blockBox">
<view class="formTitle">
<image src="../../static/images/goodsImg2.png"></image>
<p>质损发生环节</p>
</view>
<radio-group class="radioList" @change="radioChange">
<template v-for="(item, index) in radioList">
<label class="radioBox" :key="item.value">
<template>
<view>
<radio :value="item.value" :checked="item.checked" />
</view>
<view>{{item.name}}</view>
</template>
</label>
</template>
</radio-group>
<view class="radioInput">
<!-- <uInput v-model="feed" type="textarea" :autoHeight="true" placeholder="请输入客户反馈内容"
:maxLength="200" @click="inputFocus" @blur="inputBlur" v-if="current == '客户反馈'" />
</uInput>
<uInput v-model="remark" type="textarea" :autoHeight="true" placeholder="请输入其他内容"
:maxLength="200" @click="inputFocus" @blur="inputBlur" v-if="current == '其他'" />
</uInput> -->
<template v-if="isFeed">
<uni-easyinput type="textarea" autoHeight v-model="feed" placeholder="请输入客户反馈内容"
maxlength="200" @focus="inputFocus" @blur="inputBlur"></uni-easyinput>
</template>
<template v-if="isOther">
<uni-easyinput type="textarea" autoHeight v-model="remark" placeholder="请输入其他内容"
maxlength="200" @focus="inputFocus" @blur="inputBlur"></uni-easyinput>
</template>
</view>
</view>
<view class="blockBox">
<view class="formTitle tpTitle">
<image src="../../static/images/zlIcon.png"></image>
<p>板车照片上传<text>最多9张</text></p>
</view>
<view class="picture">
<uni-file-picker limit="9" v-model="bcPhoto2" @select="select"
@delete="photoDelete"></uni-file-picker>
</view>
</view>
<view class="blockBox">
<view class="formTitle tpTitle">
<image src="../../static/images/cpIcon.png"></image>
<p>板车车牌照上传<text>最多9张</text></p>
</view>
<view class="picture">
<uni-file-picker limit="9" v-model="bcLicense2" @select="select2"
@delete="photoDelete2"></uni-file-picker>
</view>
</view>
</template>
<template v-if="active == 1">
<view class="blockBox zsInfo">
<view class="li">
<p class="liTitle">车架号/条形码:</p>
<uni-easyinput class="inputBox wInput" v-model="carValue" placeholder="请输入车架号/条形码"
@blur="carBlur" :disabled="vinDisabled"></uni-easyinput>
<image src="../../static/images/sys.png" mode="" @click="getInfo"></image>
</view>
<view class="li textRight">
<p class="liTitle">船名/航次:</p>
<superwei-combox class="select" :candidates="shipList" :isJSON="true" keyName="vvyShip"
placeholder="请选择船名/航次" v-model="vvyShip" @select="shipChange"></superwei-combox>
</view>
<view class="li">
<p class="liTitle">车型:</p>
<uni-data-select v-model="carId" :localdata="carList" @change="carChange"
:disabled="carDisabled" placeholder="请选择车型"></uni-data-select>
</view>
<view class="li">
<p class="liTitle">品牌:</p>
<uni-data-select v-model="brandId" :localdata="brandList" @change="brandChange"
:disabled="brandDisabled" placeholder="请选择品牌"></uni-data-select>
</view>
<view class="li">
<p class="liTitle">质损时间:</p>
<uni-datetime-picker type="datetime" v-model="zsDate" @change="dateChange" />
</view>
<view class="li cwLi">
<p class="liTitle">场位:</p>
<uni-data-select v-model="yardId" :localdata="yardColumns" @change="yardChange"
:disabled="yardDisabled" placeholder="堆场"></uni-data-select>
<uni-data-select v-model="storeAreaId" :localdata="storeAreaColumns"
@change="storeAreaChange" :disabled="storeAreaDisabled"
placeholder="区域"></uni-data-select>
<uni-data-select v-model="storeLineId" :localdata="storeLineColumns"
@change="storeLineChange" :disabled="storeLineDisabled"
placeholder="车道"></uni-data-select>
<uni-data-select v-model="storeSeatId" :localdata="storeSeatColumns"
@change="storeSeatChange" :disabled="storeSeatDisabled"
placeholder="车位"></uni-data-select>
</view>
</view>
<view class="blockBox">
<view class="zsLi">
<p class="zsTitle">质损货物品类:</p>
<radio-group @change="radioChange2" class="radioList2">
<label class="radioBox" v-for="(item, index) in radioList2" :key="item.value">
<view>
<radio :value="item.value" :checked="item.checked" />
</view>
<view class="boxInfo">{{item.name}}</view>
</label>
</radio-group>
<uni-easyinput class="inputBox" v-model="other" placeholder="请输入内容" v-if="showInput2"
@focus="inputFocus" @blur="inputBlur"></uni-easyinput>
</view>
<view class="zsLi">
<p class="zsTitle">质损概况:</p>
<checkbox-group class="radioList2" @change="checkboxChange">
<label class="radioBox" v-for="item in checklist" :key="item.value">
<view>
<checkbox :value="item.value" :checked="item.checked" />
</view>
<view class="boxInfo">{{item.name}}</view>
</label>
</checkbox-group>
<uni-easyinput class="inputBox" v-model="other1" placeholder="请输入" v-if="showInput3"
@focus="inputFocus" @blur="inputBlur"></uni-easyinput>
</view>
<view class="zsLi">
<p class="zsTitle">损伤情况:</p>
<checkbox-group class="radioList2" @change="checkboxChange2">
<label class="radioBox" v-for="item in checklist2" :key="item.value">
<view>
<checkbox :value="item.value" :checked="item.checked" />
</view>
<view class="boxInfo">{{item.name}}</view>
</label>
</checkbox-group>
<uni-easyinput class="inputBox" v-model="other2" placeholder="请输入" v-if="showInput4"
@focus="inputFocus" @blur="inputBlur"></uni-easyinput>
</view>
<view class="zsLi">
<p class="zsTitle">处置情况:</p>
<checkbox-group class="radioList2" @change="checkboxChange3">
<label class="radioBox" v-for="item in checklist3" :key="item.value">
<view>
<checkbox :value="item.value" :checked="item.checked" />
</view>
<view class="boxInfo">{{item.name}}</view>
</label>
</checkbox-group>
<uni-easyinput class="inputBox" v-model="other3" placeholder="请输入" v-if="showInput5"
@focus="inputFocus" @blur="inputBlur"></uni-easyinput>
</view>
<view class="imageLi">
<image :src="hzzsImg" class="zshz" mode="widthFix" @click="togoCs" v-if="hzzsImg != ''">
</image>
</view>
</view>
</template>
<template v-if="active == 2">
<view class="blockBox">
<view class="formTitle tpTitle">
<image src="../../static/images/zsIcon.png"></image>
<p>质损照片<text>最多9张</text></p>
</view>
<view class="picture">
<uni-file-picker limit="9" v-model="zsPhoto2" @select="select3"
@delete="photoDelete3"></uni-file-picker>
</view>
</view>
<view class="blockBox">
<view class="formTitle tpTitle">
<image src="../../static/images/cjhIcon.png"></image>
<p>车架号图片上传<text>最多9张</text></p>
</view>
<view class="picture">
<uni-file-picker limit="9" v-model="carPhoto2" @select="select4"
@delete="photoDelete4"></uni-file-picker>
</view>
</view>
</template>
<template v-if="active == 3">
<view class="blockBox signBox">
<view class="flexLi">
<p class="title">质损负责人:</p>
<uni-easyinput class="inputBox" v-model="director" placeholder="请输入" @focus="inputFocus"
@blur="inputBlur"></uni-easyinput>
</view>
<view class="signContent">
<!-- <p class="siginTitle">请确保“字迹清晰”并尽量把“签字范围”撑满</p>
<signRegion></signRegion> -->
<p class="sign" @click="sign" v-if="signImg == ''">点击签名</p>
<template v-else>
<image :src="signImg"></image>
<!-- <p class="editSign" @click="sign">重新签名</p> -->
</template>
</view>
</view>
</template>
</view>
</scroll-view>
<view class="btnList" v-show="isShow">
<view class="btn leftBtn" @click="cancel">取消</view>
<view class="btn backBtn" @click="back" v-if="active > 0">上一步</view>
<view class="btn rightBtn" @click="next" v-if="active < 3">下一步</view>
<view class="btn rightBtn" @click="save" v-if="active == 3">提交</view>
</view>
<LotusLoading :lotusLoadingData="lotusLoadingData"></LotusLoading>
</view>
</template>
<script>
import LotusLoading from "../../components/Winglau14-lotusLoading/Winglau14-LotusLoading.vue";
import signRegion from "../quality/sign.vue";
import uInput from "../../components/u-input/index.vue";
export default {
name: "monEdit",
data() {
return {
isShow: true,
loginObj: {},
active: 0,
stepList: [{
title: '基本信息'
},
{
title: '质损信息'
},
{
title: '质损图片'
},
{
title: '签字'
}
],
ygqId: "",
type: "",
// 港区信息
portObj: {},
// 基本信息
radioList: [],
current: "", // 质损发生环节
currentValue: "",
feed: "", // 客户反馈
isFeed: false, // 客户反馈输入框
remark: "", // 其他
isOther: false, // 其他输入框
// 质损信息
carValue: "", // 车架号
godId: "", // 货物id
// 船名
shipId: "", // 船ID
shipName: "", // 船名
vvyShip: "",
shipList: [],
// 航次
vvyId: "",
vvyList: [],
// 车型
carId: "", // 车型ID
carModel: "", // 车型
carList: [],
// 品牌
brandId: "", // 品牌ID
brandValue: "", // 品牌
brandList: [],
// 堆场
yardId: "",
yardName: "",
yardColumns: [],
// 场位(区域)
storeAreaId: "",
storeArea: "",
storeAreaColumns: [],
// 场位(车道)
storeLineId: "",
storeLine: "",
storeLineId: "",
storeLineColumns: [],
// 场位(车位)
storeSeatId: "",
storeSeat: "",
storeSeatColumns: [],
zsDate: "", // 质损时间
// 是否禁用
vinDisabled: false, // 车架号输入禁用
shipDisabled: false, // 船名航次下拉禁用
carDisabled: false, // 车型下拉禁用
brandDisabled: false, // 品牌下拉禁用
yardDisabled: false, // 堆场下拉禁用
storeAreaDisabled: false, // 区域下拉禁用
storeLineDisabled: false, // 车道下拉禁用
storeSeatDisabled: false, // 车位下拉禁用
// 质损货物品类
radioList2: [],
radioData2: "",
showInput2: false,
current2: "",
currentValue2: 0,
other: "", // 质损货物品类其他
// 质损概况
checkValue: [], // 质损概况多选框选中
checklist: [], // 质损概况多选框
checkData: [],
showInput3: false,
other1: "", // 质损概况其他
// 损伤情况
checkValue2: [], // 损伤情况多选框选中
checklist2: [],
checkData2: [],
showInput4: false,
other2: "", // 损伤情况其他
// 处置状况
checkValue3: [], // 处置状况多选框选中
checklist3: [], // 处置情况多选框
checkData3: [],
showInput5: false,
other3: "", // 处置情况其他
// 上传板车照片
bcPhoto: [],
// 板车照片列表
bcPhoto2: [],
// 上传车牌照片
bcLicense: [],
// 板车车牌列表
bcLicense2: [],
// 上传质损照片照片
zsPhoto: [],
// 板车质损列表
zsPhoto2: [],
// 上传车架号图片
carPhoto: [],
// 车架号图片列表
carPhoto2: [],
// 质损负责人
director: "",
// 质损图地址
hzzsImg: "", // 绘制图
zsBase: "",
// 签名图片地址
signUrl: "",
signImg: "",
signBase: "",
lotusLoadingData: {
isShow: false //设置显示加载中组件true显示false隐藏
}
}
},
components: {
LotusLoading,
signRegion,
uInput
},
onShow() {
let signImg = uni.getStorageSync('signImg')
if (signImg != "") {
this.signImg = uni.getStorageSync('signImg')
}
if (this.signImg != "") {
this.baseImg(this.signImg, "1")
}
let hzzsImg = uni.getStorageSync('hzzsImg')
if (hzzsImg != "") {
this.hzzsImg = uni.getStorageSync('hzzsImg')
}
if (this.hzzsImg != "") {
this.baseImg(this.hzzsImg, "2")
}
},
onLoad(options) {
if ('params' in options) {
// 获取传递的对象参数使用decodeURIComponent解码并转为对象
this.ygqId = JSON.parse(decodeURIComponent(options.params)).ygqId
this.type = JSON.parse(decodeURIComponent(options.params)).type
}
this.loginObj = uni.getStorageSync('loginObj')
this.portObj = uni.getStorageSync('portObj')
this.getCar()
this.getBrand()
this.getShip()
this.yardData()
this.getImg()
this.getRadio()
this.getRadio2()
this.getCheck()
this.getCheck2()
this.getCheck3()
let that = this
if (this.type == 'edit') {
this.getRowInfo()
}
},
methods: {
// 输入框聚焦
inputFocus() {
this.isShow = false
},
// // 输入框失焦
inputBlur() {
this.isShow = true
},
// 编辑状态内容
getRowInfo() {
uni.request({
url: `${this.$local}/api/goodsQuality/getDetail?ygqId=${this.ygqId}`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
this.infoData = res.data.data
// 获取板车照片
this.bcPhoto = this.infoData.boardCarPhotos
this.infoData.boardCarPhotos.forEach(v => {
this.initImg(v.filePath, "1")
})
// 获取板车车牌照
this.bcLicense = this.infoData.boardCarLicensePlates
this.infoData.boardCarLicensePlates.forEach(v => {
this.initImg(v.filePath, "2")
})
// 获取质损照片
this.zsPhoto = this.infoData.qualityDamagePhotos
this.infoData.qualityDamagePhotos.forEach(v => {
this.initImg(v.filePath, "3")
})
// 获取车架号图片
this.carPhoto = this.infoData.carFrameNumberPhotos
this.infoData.carFrameNumberPhotos.forEach(v => {
this.initImg(v.filePath, "4")
})
if (this.infoData.signUrl != null) {
this.signBase = this.infoData.signUrl
this.initImg(this.infoData.signUrl, "5")
}
if (this.infoData.refImageUrl != null) {
this.zsBase = this.infoData.refImageUrl
this.initImg(this.infoData.refImageUrl, "6")
}
this.current = this.infoData.qdLink // 质损发生环节
if (this.current == '客户反馈') {
this.isFeed = true
} else if (this.current == '其他') {
this.isOther = true
}
this.radioList.forEach(v => {
if (v.name == this.infoData.qdLink) {
this.currentValue = v.value
this.$set(v, "checked", true)
} else {
this.$set(v, "checked", false)
}
})
this.feed = this.infoData.linkFeedback // 客户反馈
this.remark = this.infoData.linkOther // 其他
this.carValue = this.infoData.vinCode // 车架号
this.godId = this.infoData.godId // 货物id
this.shipId = this.infoData.spmId // 船名id
this.vvyId = this.infoData.vvyId // 航次id
this.vvyShip = this.infoData.spmIdAndVvyId // 船名航次
this.zsDate = this.infoData.qualityDamageTime // 质损时间
this.carId = this.infoData.goodsType // 车型
this.brandId = this.infoData.brdId // 品牌id
this.yardId = this.infoData.yardId // 堆场id
this.yardName = this.infoData.yardName // 堆场
this.storeAreaData(this.yardId) // 获取区域
this.storeAreaId = this.infoData.yarId // 区域id
this.storeArea = this.infoData.storeArea // 区域
this.storeLineData(this.storeAreaId) // 获取车道
this.storeLineId = this.infoData.yalId // 车道id
this.storeLine = this.infoData.storeLine // 车道
this.storeSeatData(this.storeLineId) // 获取车位
this.storeSeatId = this.infoData.yacId // 车位id
this.storeSeat = this.infoData.storeSeat // 车位
this.current2 = this.infoData.qdGodsCategory // 质损货物品类
if (this.current2 == '其他') {
this.showInput2 = true
}
this.radioList2.forEach(v => {
if (v.name == this.infoData.qdGodsCategory) {
this.currentValue2 = v.value
this.$set(v, "checked", true)
} else {
this.$set(v, "checked", false)
}
})
this.other = this.infoData.qdGcOther // 质损货物品类其他
this.checkData = this.infoData.qualityDamageSituation.split(",") // 质损概况
this.checklist.forEach(v => {
this.checkData.forEach(v2 => {
if (v.value == v2) {
this.$set(v, 'checked', true)
}
if (v2 == '3') {
this.showInput3 = true
}
})
})
this.other1 = this.infoData.qdsOther // 质损概况其他
this.checkData2 = this.infoData.damageSituation.split(",") // 损伤情况
this.checklist2.forEach(v => {
this.checkData2.forEach(v2 => {
if (v.value == v2) {
this.$set(v, 'checked', true)
}
if (v2 == '4') {
this.showInput4 = true
}
})
})
this.other2 = this.infoData.dsOther // 损伤情况其他
this.checkData3 = this.infoData.disposalSituation.split(",") // 处置情况
this.checklist3.forEach(v => {
this.checkData3.forEach(v2 => {
if (v.value == v2) {
this.$set(v, 'checked', true)
}
if (v2 == '4') {
this.showInput5 = true
}
})
})
this.other3 = this.infoData.dpsOther // 处置情况其他
this.director = this.infoData.qdLiablePerson // 质损负责人
this.ygqId = this.infoData.ygqId // 质量id
this.vinDisabled = true // 车架号输入禁用
}
}
})
},
// type 1 板车照片 2板车车牌照 3质损照片 4车架号图片 5签名 6参考图
initImg(fileName, type) {
uni.request({
url: `${this.$local}/api/file/url/?fileName=${fileName}`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
if (type == 1) {
this.bcPhoto2.push({
url: res.data
})
} else if (type == 2) {
this.bcLicense2.push({
url: res.data
})
} else if (type == 3) {
this.zsPhoto2.push({
url: res.data
})
} else if (type == 4) {
this.carPhoto2.push({
url: res.data
})
} else if (type == 5) {
this.signImg = res.data
} else if (type == 6) {
this.hzzsImg = res.data
}
}
}
})
},
// 质损发生环节选项
radioChange(evt) {
let currentIndex = 0
for (let i = 0; i < this.radioList.length; i++) {
if (this.radioList[i].value === evt.detail.value) {
currentIndex = i;
}
}
this.current = this.radioList[currentIndex].name
this.currentValue = this.radioList[currentIndex].value
this.radioList.forEach(v => {
if (this.current == v.name) {
this.$set(v, "checked", true)
} else {
this.$set(v, "checked", false)
}
})
if (this.current == "客户反馈") {
this.isFeed = true
this.isOther = false
} else if (this.current == '其他') {
this.isFeed = false
this.isOther = true
} else {
this.isFeed = false
this.isOther = false
}
},
// 质损货物品类
radioChange2(evt) {
this.radioData2 = evt.detail.value
let currentIndex = 0
for (let i = 0; i < this.radioList2.length; i++) {
if (this.radioList2[i].value === evt.detail.value) {
currentIndex = i;
}
}
this.current2 = this.radioList2[currentIndex].name
this.currentValue2 = this.radioList2[currentIndex].value
if (this.current2 == '其他') {
this.showInput2 = true
} else {
this.showInput2 = false
}
},
// 质损概况
checkboxChange(e) {
this.checkData = e.detail.value
if (e.detail.value == 3) {
this.showInput3 = true
} else {
this.showInput3 = false
}
var items = this.checklist
var values = e.detail.value
for (var i = 0, lenI = items.length; i < lenI; ++i) {
const item = items[i]
if (values.includes(item.value)) {
this.$set(item, 'checked', true)
} else {
this.$set(item, 'checked', false)
}
}
let newArr = []
this.checklist.forEach(v => {
if (v.checked) {
newArr.push(v.name)
}
})
this.checkValue = newArr.filter((v, index) => {
return newArr.indexOf(v) === index
})
this.checkValue.forEach(v => {
if (v == '其他') {
this.showInput3 = true
} else {
this.showInput3 = false
}
})
if (!this.showInput3) {
this.other1 = ''
}
},
// 损伤情况
checkboxChange2(e) {
this.checkData2 = e.detail.value
if (e.detail.value == 4) {
this.showInput4 = true
} else {
this.showInput4 = false
}
var items = this.checklist2,
values = e.detail.value;
for (var i = 0, lenI = items.length; i < lenI; ++i) {
const item = items[i]
if (values.includes(item.value)) {
this.$set(item, 'checked', true)
} else {
this.$set(item, 'checked', false)
}
}
let newArr = []
this.checklist2.forEach(v => {
if (v.checked) {
newArr.push(v.name)
}
})
this.checkValue2 = newArr.filter((v, index) => {
return newArr.indexOf(v) === index
})
this.checkValue2.forEach(v => {
if (v == '其他') {
this.showInput4 = true
} else {
this.showInput4 = false
}
})
if (!this.showInput4) {
this.other2 = ''
}
},
// 处置情况
checkboxChange3(e) {
this.checkData3 = e.detail.value
if (e.detail.value == 4) {
this.showInput5 = true
} else {
this.showInput5 = false
}
var items = this.checklist3,
values = e.detail.value;
for (var i = 0, lenI = items.length; i < lenI; ++i) {
const item = items[i]
if (values.includes(item.value)) {
this.$set(item, 'checked', true)
} else {
this.$set(item, 'checked', false)
}
}
let newArr = []
this.checklist3.forEach(v => {
if (v.checked) {
newArr.push(v.name)
}
})
this.checkValue3 = newArr.filter((v, index) => {
return newArr.indexOf(v) === index
})
this.checkValue3.forEach(v => {
if (v == '其他') {
this.showInput5 = true
} else {
this.showInput5 = false
}
})
if (!this.showInput5) {
this.other3 = ''
}
},
// 修改残损
togoCs() {
uni.navigateTo({
url: '/pages/quality/zsEdit'
})
},
// 点击签名
sign() {
uni.navigateTo({
url: '/pages/quality/sign'
})
},
// 通过接口获取图片地址 url Base64地址 type 1签名 2质损图
baseImg(url, type) {
let data = {
"fileName": "abc",
"base64Str": url
}
uni.request({
url: `${this.$local}/pub/file/uploadRaw`,
data: data,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'POST', //请求方式,必须为大写
success: (res) => {
if (type == 1) {
this.signBase = res.data
} else {
this.zsBase = res.data
}
}
})
},
// 车架号输入失焦
carBlur(e) {
this.carValue = e.detail.value
this.getYyInfo()
},
// 获取车辆信息
getInfo() {
this.getYyInfo()
},
// 获取预约信息接口
getYyInfo() {
uni.request({
url: `${this.$local}/api/goodsQuality/scan/${this.carValue}`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200 && res.data.data != null) {
this.godId = res.data.data.godId
// 船名
if (res.data.data.spmId != "") {
this.shipId = res.data.data.spmId
this.vvyId = res.data.data.vvyId
this.shipList.forEach(v => {
if (v.spmId == this.shipId) {
this.vvyShip = `${v.vslCnname}/${v.vvyName}`
}
})
// this.shipDisabled = true
}
// 车型
if (res.data.data.goodsType != "") {
this.carId = res.data.data.goodsType
// this.carDisabled = true
} else {
this.carDisabled = false
}
// 品牌
if (res.data.data.brdId != "") {
this.brandId = res.data.data.brdId
// this.brandDisabled = true
}
// 堆场
if (res.data.data.yardId != "") {
this.storeAreaData(res.data.data.yardId)
this.yardId = res.data.data.yardId
this.yardName = res.data.data.yardName
// this.yardDisabled = true
}
// 区域
if (res.data.data.yarId != "") {
this.storeLineData(res.data.data.yarId)
this.storeAreaId = res.data.data.yarId
this.storeArea = res.data.data.storeArea
// this.storeAreaDisabled = true
}
// 车道
if (res.data.data.yalId != "") {
this.storeSeatData(res.data.data.yalId)
this.storeLineId = res.data.data.yalId
this.storeLine = res.data.data.storeLine
// this.storeLineDisabled = true
}
// 车位
if (res.data.data.yacId != "") {
this.storeSeatId = res.data.data.yacId
this.storeSeat = res.data.data.storeSeat
// this.storeSeatDisabled = true
}
} else {
uni.showToast({
icon: "none",
title: `没有该车辆信息`
});
}
}
})
},
// 获取船名
getShip() {
let ieType = ""
let key = ""
let pamId = this.portObj.portId
let spmId = ""
let tradeType = ""
uni.request({
url: `${this.$local}/api/shipInstructions/queryByKey?ieType=${ieType}&key=${ieType}&pamId=${this.portObj.portId}&spmId=${spmId}&tradeType=${tradeType}`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
this.shipList = res.data.data
this.shipList.forEach(v => {
let vvyShip = `${v.vslCnname}/${v.vvyName}`
this.$set(v, "vvyShip", vvyShip)
})
}
}
})
},
// 船名/航次
shipChange(e) {
this.shipId = e.spmId
this.shipName = e.vslCnname
this.vvyId = e.vvyId
this.vvyShip = e.vvyShip
},
// 获取车型数据
getCar() {
uni.request({
url: `${this.$local}/api/miniapp/getVehicleModel`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
res.data.data.forEach(v => {
this.carList.push({
value: v.id,
text: v.name
})
})
}
}
})
},
// 车型
carChange(e) {
this.carId = e
this.carList.forEach(v => {
if (e == v.value) {
this.carModel = v.text
}
})
},
// 获取品牌
getBrand() {
uni.request({
url: `${this.$local}/api/miniapp/queryBrand`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
res.data.data.forEach(v => {
this.brandList.push({
value: v.brdId,
text: v.brdName
})
})
}
}
})
},
// 品牌
brandChange(e) {
this.brandId = e
this.brandList.forEach(v => {
if (e == v.value) {
this.brandValue = v.text
}
})
},
// 获取堆场数据
yardData() {
uni.request({
url: this.$local + '/api/yard/sel/query/yard?pamId=' + this.portObj.portId,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
res.data.data.forEach(v => {
this.yardColumns.push({
value: v.pymId,
text: v.pymName
})
})
}
}
})
},
// 获取区域数据
storeAreaData(id) {
this.storeAreaColumns = []
uni.request({
url: this.$local + '/api/yard/sel/queryArea?pymId=' + id,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
res.data.data.forEach(v => {
this.storeAreaColumns.push({
value: v.pyaId,
text: v.pyaAreaCode
})
})
}
})
},
// 获取车道数据
storeLineData(id) {
this.storeLineColumns = []
uni.request({
url: this.$local + '/api/yard/sel/queryLanesByPyaId?pyaId=' + id,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
res.data.data.forEach(v => {
this.storeLineColumns.push({
value: v.yalId,
text: v.yalNo
})
})
}
})
},
// 获取车位数据
storeSeatData(id) {
this.storeSeatColumns = []
uni.request({
url: this.$local + '/api/yard/sel/queryParkingSpacesByYalId?yalId=' + id,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
res.data.data.forEach(v => {
this.storeSeatColumns.push({
value: v.yacId,
text: v.yacNo
})
})
}
})
},
// 堆场
yardChange(e) {
this.yardId = e
this.yardColumns.forEach(v => {
if (e == v.value) {
this.yardName = v.text
}
})
this.storeArea = ""
this.storeLine = ""
this.storeSeat = ""
this.storeAreaData(this.yardId)
},
// 场位(区域)
storeAreaChange(e) {
this.storeAreaId = e
this.storeAreaColumns.forEach(v => {
if (e == v.value) {
this.storeArea = v.text
}
})
this.storeLine = ""
this.storeSeat = ""
this.storeLineData(this.storeAreaId)
},
// 场位(车道)
storeLineChange(e) {
this.storeLineId = e
this.storeLineColumns.forEach(v => {
if (e == v.value) {
this.storeLine = v.text
}
})
this.storeSeatData(this.storeLineId)
},
// 场位(车位)
storeSeatChange(e) {
this.storeSeatId = e
this.storeSeatColumns.forEach(v => {
if (e == v.value) {
this.storeSeat = v.text
}
})
},
// 质损日期
dateChange(e) {
this.zsDate = e
},
/// 获取质损图
getImg() {
uni.request({
url: this.$local + '/api/miniapp/typeRef/domain/REFERENCE_DIAGRAM',
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.data.status == 200) {
this.initImg(res.data.data[0].ptrDesc, '6')
}
}
})
},
// 获取枚举(质损发生环节)
getRadio() {
uni.request({
url: this.$local + '/api/miniapp/typeRef/domain/QUALITY_DAMAGE_LINK',
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.data.status == 200) {
res.data.data.forEach(v => {
this.radioList.push({
value: v.ptrCode,
name: v.ptrDesc
})
})
}
}
})
},
// 获取枚举(货物品类)
getRadio2() {
uni.request({
url: this.$local + '/api/miniapp/typeRef/domain/QUALITY_DAMAGED_GOODS_CATEGORY',
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.data.status == 200) {
res.data.data.forEach(v => {
this.radioList2.push({
value: v.ptrCode,
name: v.ptrDesc
})
})
}
}
})
},
// 获取枚举(质损概况)
getCheck() {
uni.request({
url: this.$local + '/api/miniapp/typeRef/domain/OVERVIEW_QUALITY_DAMAGE',
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.data.status == 200) {
res.data.data.forEach(v => {
this.checklist.push({
value: v.ptrCode,
name: v.ptrDesc
})
})
}
}
})
},
// 获取枚举(损伤情况)
getCheck2() {
uni.request({
url: this.$local + '/api/miniapp/typeRef/domain/DAMAGE_CONDITION',
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.data.status == 200) {
res.data.data.forEach(v => {
this.checklist2.push({
value: v.ptrCode,
name: v.ptrDesc
})
})
}
}
})
},
// 获取枚举(处置情况)
getCheck3() {
uni.request({
url: this.$local + '/api/miniapp/typeRef/domain/DISPOSAL_SITUATION',
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
if (res.data.status == 200) {
res.data.data.forEach(v => {
this.checklist3.push({
value: v.ptrCode,
name: v.ptrDesc
})
})
}
}
})
},
// 上传板车照片
select(e) {
this.lotusLoadingData.isShow = true
uni.uploadFile({
url: `${this.$local}/api/file/upload`, //上传图片api
header: {
'Authorization': `Bearer ${this.loginObj.access_token}`
},
filePath: e.tempFilePaths[0],
name: 'file',
success: (res) => {
this.lotusLoadingData.isShow = false
this.bcPhoto2.push(e.tempFiles[0])
let data = JSON.parse(res.data).data
this.bcPhoto.push(data)
},
})
},
// 上传板车照片移除
photoDelete(e) {
let delIndex = 0
this.bcPhoto2.forEach((v, index) => {
if (v.uuid == e.tempFile.uuid) {
delIndex = index
}
})
this.bcPhoto.splice(delIndex, 1)
this.bcPhoto2.splice(delIndex, 1)
},
// 上传板车车牌照
select2(e) {
this.lotusLoadingData.isShow = true
uni.uploadFile({
url: `${this.$local}/api/file/upload`, //上传图片api
header: {
// "Content-Type": "multipart/form-data",
'Authorization': `Bearer ${this.loginObj.access_token}`
},
filePath: e.tempFilePaths[0],
name: 'file',
success: (res) => {
this.lotusLoadingData.isShow = false
this.bcLicense2.push(e.tempFiles[0])
let data = JSON.parse(res.data).data
this.bcLicense.push(data)
},
})
},
// 上传板车车牌照移除
photoDelete2(e) {
let delIndex = 0
this.bcLicense2.forEach((v, index) => {
if (v.uuid == e.tempFile.uuid) {
delIndex = index
}
})
this.bcLicense.splice(delIndex, 1)
this.bcLicense2.splice(delIndex, 1)
},
// 上传质损照片
select3(e) {
this.lotusLoadingData.isShow = true
uni.uploadFile({
url: `${this.$local}/api/file/upload`, //上传图片api
header: {
// "Content-Type": "multipart/form-data",
'Authorization': `Bearer ${this.loginObj.access_token}`
},
filePath: e.tempFilePaths[0],
name: 'file',
success: (res) => {
this.lotusLoadingData.isShow = false
this.zsPhoto2.push(e.tempFiles[0])
let data = JSON.parse(res.data).data
this.zsPhoto.push(data)
},
})
},
// 上传质损照片移除
photoDelete3(e) {
let delIndex = 0
this.zsPhoto2.forEach((v, index) => {
if (v.uuid == e.tempFile.uuid) {
delIndex = index
}
})
this.zsPhoto.splice(delIndex, 1)
this.zsPhoto2.splice(delIndex, 1)
},
// 上传车架号图片
select4(e) {
this.lotusLoadingData.isShow = true
uni.uploadFile({
url: `${this.$local}/api/file/upload`, //上传图片api
header: {
// "Content-Type": "multipart/form-data",
'Authorization': `Bearer ${this.loginObj.access_token}`
},
filePath: e.tempFilePaths[0],
name: 'file',
success: (res) => {
this.lotusLoadingData.isShow = false
this.carPhoto2.push(e.tempFiles[0])
let data = JSON.parse(res.data).data
this.carPhoto.push(data)
},
})
},
// 上传车架号图片移除
photoDelete4(e) {
let delIndex = 0
this.carPhoto2.forEach((v, index) => {
if (v.uuid == e.tempFile.uuid) {
delIndex = index
}
})
this.carPhoto.splice(delIndex, 1)
this.carPhoto2.splice(delIndex, 1)
},
// 上一步
back() {
this.active--
},
// 下一步
next() {
this.active++
},
// 取消
cancel() {
uni.navigateTo({
url: '/pages/quality/index'
})
},
// 提交
save() {
if (this.current != '其他') {
this.remark = ""
} else if (this.current != '客户反馈') {
this.feed = ""
}
if (this.current2 != '其他') {
this.other = ""
}
let editReqDTO = {
"boardCarLicensePlates": this.bcLicense, // 板车车牌照
"boardCarPhotos": this.bcPhoto, // 板车照片
"brdId": this.brandId, // 品牌id
"carFrameNumberPhotos": this.carPhoto, // 车架号图片
"dasList": this.checkData2, // 损伤情况
"dsOther": this.other2, // 损伤情况其他备注
"dispList": this.checkData3, // 处置情况
"dpsOther": this.other3, // 处置情况其他备注
"editComplete": "1", // pad提交传 1 编辑完毕 扫描提交的数据不全不给后台展示
"godId": this.godId, // 货物id
"goodsType": this.carId, // 车型id
"linkFeedback": this.feed, // 客户反馈
"linkOther": this.remark, // 环节其他
"qdLink": this.current, // 质损发生环节
"qdGcOther": this.other, // 质损货物品类其他
"qdGodsCategory": this.current2, // 质损货物品类
"qdLiablePerson": this.director, // 质损责任人
"qdsList": this.checkData, // 质损情况多选
"qdsOther": this.other1, // 质损情况(概况)其他备注
"qualityDamagePhotos": this.zsPhoto, // 质损照片
"qualityDamageTime": this.zsDate, // 质损时间
"refImageUrl": this.zsBase, // 质损参考图地址
"removableFlag": "1", // 可删除标识 pad提交传 1
"signUrl": this.signBase, // 签名地址
"spmId": this.shipId, // 船舶id
"storeArea": this.storeArea, // 区域
"storeLine": this.storeLine, // 车道
"storeSeat": this.storeSeat, // 车位
"vvyId": this.vvyId, // 航次id
"yacId": this.storeSeatId, // 车位id
"yalId": this.storeLineId, // 车道id
"yarId": this.storeAreaId, // 区域id
"yardId": this.yardId, // 堆场id
"yardName": this.yardName, // 堆场
"ygqId": this.ygqId, // 质量id
"vinCode": this.carValue, // 车架号
}
uni.request({
url: `${this.$local}/api/goodsQuality/edit`,
data: editReqDTO,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'PUT', //请求方式,必须为大写
success: (res) => {
if (res.statusCode == 200) {
uni.setStorageSync('signImg', "")
uni.navigateTo({
url: '/pages/quality/index'
})
} else {
uni.showToast({
icon: "none",
title: `${res.data.error_description}`
});
}
}
})
},
}
}
</script>
<style lang="less" scoped>
.edit {
.stepsBox {
width: 100%;
position: fixed;
top: 68px;
padding: 20px 0;
display: flex;
flex-direction: column;
justify-content: center;
background: #fff;
z-index: 999;
/deep/.uni-steps {
height: 80px;
justify-content: center;
}
/deep/.uni-steps__row {
flex-direction: column-reverse;
}
/deep/.uni-steps__row-title {
font-size: 16px;
margin-top: 16px;
}
/deep/.uni-icons {
font-size: 20px !important;
}
/deep/.uni-steps__row-container {
margin-top: 14px;
}
}
.container {
margin-top: 186px;
padding: 16px;
padding-bottom: 90px;
input::placeholder {
color: #6a6a6a !important;
}
.blockBox {
padding: 24px 18px;
background: #fff;
margin-bottom: 16px;
}
.formTitle {
font-size: 18px;
color: #23262E;
font-weight: bold;
display: flex;
image {
width: 20px;
height: 20px;
margin-right: 10px;
margin-top: 3px;
}
}
.tpTitle {
color: #666666;
text {
font-size: 12px;
margin-left: 5px;
}
}
.radioList {
display: flex;
flex-wrap: wrap;
margin-top: 20px;
.radioBox {
display: flex;
width: 15%;
margin-top: 16px;
}
}
.radioInput {
width: 100%;
margin-top: 16px;
}
.picture {
margin-top: 30px;
/deep/.file-picker__box {
width: 120px !important;
height: 120px !important;
padding-top: 0;
}
}
.inputBox {
/deep/.is-input-border {
margin-left: 5px;
}
}
.wInput {
/deep/.is-input-border {
width: 98%;
margin-left: 5px;
}
}
.sign {
color: #2979ff;
line-height: 40px;
margin-left: 20px;
font-size: 16px;
}
.editSign {
color: red;
}
.flexLi {
display: flex;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid #EEEEEE;
p {
line-height: 36px;
margin-right: 5px;
}
}
.signContent {
// .siginTitle {
// width: 100%;
// text-align: center;
// font-size: 24px;
// color: #23262E;
// font-weight: bold;
// margin-bottom: 16px;
// }
uni-image {
width: 320px;
height: 240px;
}
}
.zsInfo {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
border-radius: 8px;
padding: 0 16px 10px;
.li {
width: 49%;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #EEEEEE;
padding: 16px;
.liTitle {
min-width: 120px;
font-size: 16px;
line-height: 34px;
}
image {
width: 36px;
height: 36px;
}
/deep/.uni-stat__select {
width: 40%;
justify-content: flex-end;
}
/deep/.uni-stat-box {
flex: none;
width: 45%;
}
/deep/.uni-select {
border: none;
}
/deep/.uni-select__input-box {
text-align: right;
}
/deep/.uni-select__input-text {
padding-right: 10px;
}
/deep/.uni-data-select {
background-color: #fff;
height: 35px;
width: 100%;
border: none;
}
/deep/.superwei-combox {
background-color: #fff;
height: 35px;
width: 40%;
border: none;
}
/deep/.uni-date-x--border {
border: none;
}
/deep/.uni-date__x-input {
text-align: right;
padding-right: 10px;
}
/deep/.uni-date-x .icon-calendar {
display: none;
}
}
.textRight {
/deep/.uni-input-wrapper {
text-align: right;
}
}
.cwLi {
width: 100%;
/deep/.uni-data-select {
margin-right: 10px;
}
/deep/.uni-data-select:last-child {
margin-right: 0;
}
/deep/.uni-stat__select {
margin-right: 10px;
}
/deep/.uni-stat__select:last-child {
margin-right: 0;
}
}
}
.zsLi {
width: 100%;
line-height: 36px;
display: flex;
margin-bottom: 15px;
.zsTitle {
width: 120px;
font-size: 16px;
color: #23262E;
font-weight: bold;
}
.radioList2 {
display: flex;
}
.radioBox {
display: flex;
margin-left: 20px;
.boxInfo {
display: flex;
margin-left: 5px;
/deep/.is-input-border {
width: 240px;
}
/deep/.uni-easyinput {
margin-left: 10px;
}
}
}
}
.imageLi {
width: 100%;
height: 440px;
position: relative;
.zshz {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
}
.signBox {
border-radius: 8px;
/deep/.is-input-border {
width: 300px;
}
.title {
font-size: 14px;
color: #23262E;
}
}
}
.btnList {
width: 100%;
background-color: #fff;
position: fixed;
bottom: 0;
display: flex;
justify-content: center;
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
padding: 20px 0;
z-index: 999;
.btn {
margin-left: 20px;
width: 120px;
height: 50px;
border-radius: 2px;
font-size: 18px;
line-height: 50px;
text-align: center;
}
.leftBtn {
background-color: #fff;
color: #333333;
border: 1px solid #E7E7E7;
}
.backBtn {
background: rgba(0, 103, 207, 0.1);
color: #0067CF;
}
.rightBtn {
background: #0067CF;
color: #fff;
}
}
}
</style>