pad-app/pages/shipWork/noticeAdd.vue

348 lines
8.5 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="noticeAdd">
<head-view :title="title" url="/pages/shipWork/notice"></head-view>
<view class="container contentFixed">
<view class="info">
<view class="ul">
<view class="li">
<p>船名</p>
<text>{{shipInfo.vslCnname}}</text>
</view>
<view class="li">
<p><text class="required" v-if="obj.state != 'look'">*</text>航次:</p>
<uni-data-select v-model="vvyId" :localdata="hcList" @change="hcChange"
v-if="obj.state != 'look'"></uni-data-select>
<text v-else>{{vvyName}}</text>
</view>
<view class="li">
<p>进出口:</p>
<text>{{importExportFlagName}}</text>
</view>
<view class="li">
<p>贸易类型:</p>
<text>{{spmTradeName}}</text>
</view>
<view class="li">
<p><text class="required" v-if="obj.state != 'look'">*</text>作业日期:</p>
<uni-datetime-picker v-model="workDate" type="date" :clear-icon="false" @change="changeLog"
v-if="obj.state != 'look'" :border="false" />
<text v-else>{{workDate}}</text>
</view>
</view>
<uni-popup ref="popup" type="dialog">
<uni-popup-dialog type="error" confirmText="确定" title="通知" content="是否删除此条数据"
@confirm="delConfirm"></uni-popup-dialog>
</uni-popup>
<view class="btnList">
<view class="btn qx" @click="cancel">取消</view>
<view class="btn sc" v-if="obj.state == 'look'" @click="del">删除</view>
<view class="btn bc" v-if="obj.state == 'add' || obj.state == 'edit'" @click="save">保存</view>
<view class="btn bc" v-if="obj.state == 'look'" @click="toGo('edit')"></view>
</view>
</view>
</view>
</view>
</template>
<script>
import sqlite from "../../common/sqlite.js"
import api from "../../common/api.js"
import {
v4 as uuidv4
} from 'uuid';
export default {
data() {
return {
title: "",
shipInfo: {},
obj: {},
vtpId: "",
noticeRow: {},
noticeRowIndex: 0,
// 航次下拉框
vvyId: "",
vvyName: "",
hcList: [],
// 作业时间
workDate: [''],
// 删除船舶装卸通知书id
delLnIds: [],
vvyInfo: [],
importExportFlagName: "",
spmTradeName: "",
// 下拉数据
optionData: [],
}
},
onLoad(options) {
if ('params' in options) {
// 获取传递的对象参数使用decodeURIComponent解码并转为对象
this.obj = JSON.parse(decodeURIComponent(options.params))
}
},
mounted() {
this.vtpId = uni.getStorageSync('vtpId')
this.delLnIds = uni.getStorageSync("delLnIds")
this.executeSql1('shipOption')
this.executeSql1("shipInfoTable")
this.executeSql1("voyageScheduleDataDetailRespDTOList")
if (this.obj.state == "edit") {
this.title = "编辑船舶装卸通知书"
} else if (this.obj.state == "look") {
this.title = "查看船舶装卸通知书"
} else {
this.title = "新增船舶装卸通知书"
}
let that = this
setTimeout(() => {
if (that.obj.state == 'edit' || that.obj.state == 'look') {
that.getRow();
}
}, 100)
},
methods: {
// 查
executeSql1(tableName) {
let sql = `select * from ${tableName} WHERE vtpId = '${this.vtpId}'`
sqlite.executeSqlCeshi(sql).then((value) => {
// 在resolve时执行的回调函数
if (tableName == 'shipOption') {
this.optionData = value
} else if (tableName == 'shipInfoTable') {
this.shipInfo = value[0]
} else if (tableName == 'voyageScheduleDataDetailRespDTOList') {
this.vvyInfo = value
value.forEach((v, index) => {
this.hcList.push({
text: v.vvyName,
value: v.vvyId
})
})
}
}).catch((error) => {
// 在reject时执行的回调函数
console.error(error);
});
},
// 获取当前行信息
getRow() {
this.noticeRow = uni.getStorageSync('noticeRow');
this.noticeRowIndex = uni.getStorageSync('noticeRowIndex');
this.vvyId = this.noticeRow.vvyId
this.vvyName = this.noticeRow.vvyName
this.importExportFlagName = this.noticeRow.importExportFlagName
if (this.noticeRow.workDate == "null") {
this.workDate = ""
} else {
this.workDate = this.noticeRow.workDate
}
this.vvyInfo.forEach(v => {
if (this.vvyId == v.vvyId) {
this.spmTradeName = v.tradeTypeName
}
})
},
// 航次下拉
hcChange(e) {
this.vvyId = e;
this.hcList.forEach(v => {
if (v.value == e) {
this.vvyName = v.text
}
})
this.vvyInfo.forEach(v => {
if (v.vvyId == e) {
this.importExportFlagName = v.importExportFlagName
this.spmTradeName = v.tradeTypeName
}
})
},
// 作业时间
changeLog(e) {
this.workDate = e
},
// 取消
cancel() {
uni.navigateTo({
url: '/pages/shipWork/notice'
})
},
// 弹框删除
delConfirm() {
let sql = `DELETE FROM shipmentLoadUnloadNoticeRespList WHERE sluId = '${this.noticeRow.sluId}';`
this.executeSql(sql)
let reg = RegExp(/-/)
if (reg.test(this.noticeRow.sluId) == false) {
this.delLnIds.push(this.noticeRow.sluId)
uni.setStorageSync('delLnIds', this.delLnIds);
}
uni.navigateTo({
url: '/pages/shipWork/notice'
})
},
// 删除
del() {
this.$refs.popup.open()
},
// 保存
save() {
let date = new Date().getTime()
let sluId = uuidv4()
let webStatus = 0
let webDate = api.getDate(date)
if (this.obj.state == "edit") {
let sql =
`UPDATE shipmentLoadUnloadNoticeRespList SET vvyId = '${this.vvyId}', vvyName = '${this.vvyName}', importExportFlagName = '${this.importExportFlagName}',
workDate = '${this.workDate}',webStatus = '${webStatus}',webDate = '${webDate}' WHERE sluId = '${this.noticeRow.sluId}';`
this.executeSql(sql)
} else if (this.obj.state == "add") {
let sql = `insert into shipmentLoadUnloadNoticeRespList values('${sluId}','${this.vtpId}','${this.vvyId}','${this.vvyName}',
'${this.importExportFlagName}','${this.workDate}','${webStatus}','${webDate}')`
this.executeSql(sql)
}
uni.navigateTo({
url: '/pages/shipWork/notice'
})
},
// 编辑
toGo(state) {
this.obj.state = state;
const params = encodeURIComponent(JSON.stringify(this.obj));
uni.navigateTo({
url: `/pages/shipWork/noticeAdd?params=${params}`
})
},
executeSql(sql) {
sqlite.executeSqlCeshi(sql).then((value) => {
// 在resolve时执行的回调函数
}).catch((error) => {
// 在reject时执行的回调函数
console.error(error);
});
},
}
}
</script>
<style lang="less" scoped>
.noticeAdd {
.container {
padding: 16px;
background-color: #F6F7F9;
.info {
background-color: #fff;
}
.ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.li {
width: 49%;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #EEEEEE;
padding: 0 16px;
height: 56px;
line-height: 56px;
.required {
color: red;
margin-right: 5px;
}
/deep/.uni-numbox {
border: 1px solid #ccc;
box-sizing: border-box;
height: 38px;
margin-top: 8px;
}
/deep/.uni-numbox-btns {
padding: 0 14px;
box-sizing: border-box;
}
/deep/.uni-numbox__value {
width: 100px;
height: 35px;
line-height: 35px;
background-color: #fff !important;
}
/deep/.uni-date {
flex: none;
width: 25%;
text-align: right;
display: flex;
flex-direction: column;
justify-content: center;
}
/deep/.uni-date-x .icon-calendar {
display: none;
}
/deep/.uni-date-x {
height: 38px;
}
/deep/.uni-stat__select {
flex: none;
width: 30%;
}
/deep/.uni-select {
border: none;
}
/deep/.uni-select__input-text {
text-align: right;
padding-right: 10px;
}
}
}
.btnList {
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 80px;
background-color: #fff;
display: flex;
justify-content: center;
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
.btn {
margin: 15.5px 17px;
width: 200px;
height: 49px;
border-radius: 2px;
font-size: 18px;
text-align: center;
line-height: 49px;
}
.qx {
background-color: #eee;
}
.sc {
background-color: #E50101;
color: #fff;
}
.bc {
color: #fff;
background: #0067CF;
}
}
}
}
</style>