pad-app/pages/quality/index.vue

415 lines
9.6 KiB
Vue

<template>
<view class="app">
<head-info :navIndex="3"></head-info>
<view class="container">
<view class="content">
<view class="form">
<!-- <button type="primary" class="button" @click="modify('add','')">
<uni-icons type="plusempty" color="#fff" size="20"></uni-icons>
</button> -->
<view class="right">
<superwei-combox class="select" :candidates="shipList" :isJSON="true" keyName="shipVvy"
placeholder="船名/航次" v-model="shipValue" @select="shipChange"
@input="shipInput"></superwei-combox>
<superwei-combox class="select" :candidates="brandList" :isJSON="true" keyName="brdName"
placeholder="品牌" v-model="brandValue" @select="brandChange"></superwei-combox>
</view>
</view>
<view class="itemList">
<template v-if="itemList.length > 0">
<view class="item" v-for="(item,index) in itemList" :key="index" @click="details(item)">
<view class="headTop">
<view class="leftHead">
<image src="../../static/images/zlIcon.png" mode=""></image>
<text>{{item.vinCode}}</text>
</view>
<view class="rightHead" @click.stop="modify('edit',item)">
<image src="../../static/images/editBtn.png"></image>
<text>编辑</text>
</view>
</view>
<view class="row">
<view class="col">
航次/船名:{{item.spmIdDesc}}
</view>
<view class="col">
作业时间:{{item.workTime}}
</view>
</view>
<view class="row">
<view class="col">
货物状态:{{item.godStatusName}}
</view>
<view class="col">
质损概况:{{item.damageSituationName}}
</view>
</view>
<view class="row">
<view class="col">
质损发生环节:{{item.qdLinkName}}
</view>
<view class="col">
车型:{{item.bvmName}}
</view>
</view>
<view class="row">
<view class="col">
品牌:{{item.brdName}}
</view>
<view class="col">
场位:{{item.pos}}
</view>
</view>
<view class="row">
<view class="col">
作业人:{{item.qdLiablePerson}}
</view>
<view class="col">
处置情况:{{item.disposalSituationName}}
</view>
</view>
<!-- <view class="rowFoot">
<view class="col">
编辑
</view>
<view class="col" @click.stop="del(item)">
删除
</view>
</view> -->
</view>
</template>
<o-empty v-else height="70vh" bg="#f5f6fa" />
</view>
<view class="pageBox" v-if="itemList.length > 0">
<uni-pagination :show-icon="true" :total="total" :pageSize="pageSize" :current="current"
@change="changePage" />
</view>
<uni-popup ref="popup" type="dialog">
<uni-popup-dialog confirmText="确定" content="是否删除该条数据?" @confirm="delConfirm"></uni-popup-dialog>
</uni-popup>
</view>
</view>
</view>
</template>
<script>
import HeadInfo from '@/components/head-info/head-info';
export default {
data() {
return {
loginObj: {},
// 查询值
queryValue: '',
// 品牌下拉
brandId: "",
brandValue: "",
brandList: [],
// 列表数据
itemList: [],
// 分页
total: 0,
pageSize: 10,
current: 1,
// 当前行数据
rowInfo: {},
// 港区信息
portObj: {},
// 船名下拉
shipList: [],
shipId: "",
shipValue: "",
shipSr: "",
vvyId: "",
}
},
onLoad() {
this.loginObj = uni.getStorageSync('loginObj')
this.portObj = uni.getStorageSync('portObj')
uni.setStorageSync('signObj', "")
this.initData()
this.getBrand()
this.getShip()
},
onBackPress(options) {
// 触发返回就会调用此方法,这里实现的是禁用物理返回,顶部导航栏的自定义返回 uni.navigateBack 仍可使用
if (options.from == 'backbutton') {
return true;
} else if (options.from == 'navigateBack') {
return false;
}
},
components: {
HeadInfo
},
methods: {
// 获取列表数据
initData() {
uni.request({
url: `${this.$local}/api/goodsQuality/page?current=${this.current}&page=${this.pageSize}&brdId=${this.brandId}&vvyId=${this.vvyId}`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'GET', //请求方式,必须为大写
success: (res) => {
console.log('接口返回------', res);
if (res.statusCode == 200) {
this.itemList = res.data.data.records
console.log(this.itemList)
this.total = res.data.data.total
}
}
})
},
// 获取船名
getShip() {
let ieType = ""
let pamId = this.portObj.portId
let spmId = ""
let tradeType = ""
uni.request({
url: `${this.$local}/api/shipInstructions/queryByKey?ieType=${ieType}&key=${this.shipSr}&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 => {
this.$set(v, "shipVvy", `${v.vslCnname} / ${v.vvyName} `)
})
console.log(this.shipList)
}
}
})
},
// 船名/航次
shipChange(e) {
this.shipId = e.vslCd
this.shipValue = e.shipVvy
this.vvyId = e.vvyId
this.current = 1
this.initData()
},
// 选择船输入框
shipInput(e) {
this.shipSr = e
this.getShip()
},
// 获取品牌
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) {
this.brandList = res.data.data
}
}
})
},
// 品牌下拉选择
brandChange(e) {
this.brandId = e.brdId
this.brandValue = e.brdName
this.current = 1
this.initData()
},
// 点击新增/编辑
modify(type, item) {
let obj = {
type: type,
ygqId: item.ygqId
}
const params = encodeURIComponent(JSON.stringify(obj));
uni.navigateTo({
url: `/pages/quality/edit?params=${params}`
})
},
// 点击详情
details(item) {
let obj = {
ygqId: item.ygqId
}
const params = encodeURIComponent(JSON.stringify(obj));
uni.navigateTo({
url: `/pages/quality/details?params=${params}`
})
},
// 点击删除
del(item) {
this.$refs.popup.open()
this.rowInfo = item
},
// 删除确认
delConfirm() {
uni.request({
url: `${this.$local}/api/goodsQuality/delQuality/${this.rowInfo.ygqId}`,
header: {
'Content-Type': 'application/json', //自定义请求头信息
'Authorization': `Bearer ${this.loginObj.access_token}`
},
method: 'DELETE', //请求方式,必须为大写
success: (res) => {
console.log('接口返回------', res);
if (res.statusCode == 200) {
uni.showToast({
icon: 'success',
title: '删除成功'
});
this.initData()
} else {
uni.showToast({
icon: 'error',
title: `${res.data.error_description}`
});
this.initData()
}
}
})
},
// 点击分页
changePage(e) {
this.current = e.current;
this.initData()
},
}
};
</script>
<style lang="less" scoped>
.content {
flex: 1;
padding-bottom: 20px;
margin-top: 115px;
.form {
width: 100%;
display: flex;
justify-content: flex-end;
background: #FAFAFA;
border-top: 1px solid #EEEEEE;
border-bottom: 1px solid #EEEEEE;
padding: 6px 10px;
position: fixed;
top: 66px;
z-index: 999;
.button {
width: 90px;
height: 35px;
line-height: 35px;
text-align: center;
margin: 0;
}
.right {
display: flex;
justify-content: space-between;
.select {
width: 170px;
height: 35px;
line-height: 35px;
background: transparent;
border: none;
/deep/.superwei-combox__input {
text-align: right;
padding-right: 6px;
}
/deep/.superwei-combox__input-plac {
color: #000;
}
}
.select:last-child {
width: 100px;
}
/deep/.is-input-border {
height: 35px;
}
}
}
.itemList {
padding: 16px;
display: flex;
flex-direction: column;
gap: 16px;
.item {
padding: 15px;
border-radius: 8px;
background-color: #fff;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #23262E;
gap: 12px;
.headTop {
width: 100%;
display: flex;
justify-content: space-between;
.leftHead {
font-size: 16px;
color: #23262E;
font-weight: bold;
display: flex;
image {
width: 18px;
height: 18px;
margin-right: 7px;
}
}
.rightHead {
font-size: 16px;
color: #1677FF;
display: flex;
image {
width: 16px;
height: 16px;
margin-right: 8px;
margin-top: 3px;
}
}
}
.row {
width: 18%;
flex-direction: column;
display: flex;
}
.col {
margin-bottom: 10px;
}
}
}
.pageBox {
margin-top: 20px;
}
}
</style>