12.8
Panzihang
parent
94839ae69d
commit
2ee6090029
|
|
@ -46,6 +46,8 @@ module.exports = {
|
|||
this.createShipmentShipLoadPlansRespList()
|
||||
// 创建作业查询明细
|
||||
this.createWorkQueryDetails()
|
||||
// 创建作业查询车架号明细
|
||||
this.createVinCodeDetails()
|
||||
// 创建下拉数据
|
||||
this.createShipOption()
|
||||
// 创建单证签名表
|
||||
|
|
@ -168,13 +170,19 @@ module.exports = {
|
|||
// 创建作业查询 shipmentShipLoadPlansRespList
|
||||
createShipmentShipLoadPlansRespList() {
|
||||
let sql =
|
||||
'CREATE TABLE if not exists shipmentShipLoadPlansRespList ("webId" text NOT NULL,"vtpId" text,"agentId" text,"agentName" text,"amount" text,"brdId" text,"brdName" text,"bvdId" text,"bvdName" text,"bvmId" text,"bvmName" text,"carHeight" text,"carLength" text,"carWidth" text,"customsDeclareNo" text,"customsDeclareStatus" text,"mnfBl" text,"potId" text,"potName" text,"sourceType" text,"vvyId" text,"vvyName" text,"yardPos" text,"webStatus" text,"webDate" text, PRIMARY KEY("webId"));'
|
||||
'CREATE TABLE if not exists shipmentShipLoadPlansRespList ("webId" text NOT NULL,"vtpId" text,"agentId" text,"agentName" text,"amount" text,"brdId" text,"brdName" text,"bvdId" text,"bvdName" text,"bvmId" text,"bvmName" text,"carHeight" text,"carLength" text,"carWidth" text,"consignee" text,"customsDeclareNo" text,"customsDeclareStatus" text,"ieFg" text,"ieFgNm" text,"mnfBl" text,"model" text,"potId" text,"potName" text,"sourceType" text,"sourceTypeNm" text,"spmId" text,"telephone" text,"ticketGtpks" text,"ticketVolume" text,"ticketWeight" text,"tradeType" text,"tradeTypeNm" text,"volume" text,"vslCnname" text,"vvyId" text,"vvyName" text,"weight" text,"yardPos" text,"webStatus" text,"webDate" text, PRIMARY KEY("webId"));'
|
||||
this.executeSql(sql)
|
||||
},
|
||||
// 创建作业查询明细 workQueryDetails
|
||||
createWorkQueryDetails() {
|
||||
let sql =
|
||||
'CREATE TABLE if not exists workQueryDetails ("webId" text NOT NULL,"vtpId" text,"contactId" text,"agentId" text,"agentName" text,"amount" text,"brdId" text,"brdName" text,"bvdId" text,"bvdName" text,"bvmId" text,"bvmName" text,"carHeight" text,"carLength" text,"carWidth" text,"consignee" text,"customsDeclareNo" text,"customsDeclareStatus" text,"importExportFlag" text,"mnfBl" text,"model" text,"potId" text,"potName" text,"sourceType" text,"spmId" text,"telephone" text,"ticketGtpks" text,"ticketVolume" text,"ticketWeight" text,"tradeType" text,"webStatus" text,"webDate" text, PRIMARY KEY("webId"));'
|
||||
'CREATE TABLE if not exists workQueryDetails ("webId" text NOT NULL,"vtpId" text,"contactId" text,"agentId" text,"agentName" text,"amount" text,"brdId" text,"brdName" text,"bvdId" text,"bvdName" text,"bvmId" text,"bvmName" text,"carHeight" text,"carLength" text,"carWidth" text,"consignee" text,"customsDeclareNo" text,"customsDeclareStatus" text,"ieFg" text,"ieFgNm" text,"mnfBl" text,"model" text,"potId" text,"potName" text,"sourceType" text,"sourceTypeNm" text,"spmId" text,"telephone" text,"ticketGtpks" text,"ticketVolume" text,"ticketWeight" text,"tradeType" text,"tradeTypeNm" text,"volume" text,"vslCnname" text,"vvyId" text,"vvyName" text,"weight" text,"yardPos" text,"webStatus" text,"webDate" text, PRIMARY KEY("webId"));'
|
||||
this.executeSql(sql)
|
||||
},
|
||||
// 创建作业查询车架号明细
|
||||
createVinCodeDetails() {
|
||||
let sql =
|
||||
'CREATE TABLE if not exists vinCodeDetails ("webId" text NOT NULL,"vtpId" text,"contactId" text,"godId" text,"storeArea" text,"storeLine" text,"storeSeat" text,"vinCode" text,"yacId" text,"yardId" text,"yardName" text,"yardPos" text,"webStatus" text,"webDate" text, PRIMARY KEY("webId"));'
|
||||
this.executeSql(sql)
|
||||
},
|
||||
// 创建下拉数据 shipOption
|
||||
|
|
|
|||
|
|
@ -60,6 +60,14 @@
|
|||
mounted() {
|
||||
this.vtpId = uni.getStorageSync('vtpId')
|
||||
this.executeSql1("voyageScheduleDataDetailRespDTOList")
|
||||
let that = this
|
||||
setTimeout(function() {
|
||||
that.shipList.forEach((v, index) => {
|
||||
if (v.vtpId == that.vtpId) {
|
||||
that.activeIndex = index
|
||||
}
|
||||
})
|
||||
}, 100)
|
||||
},
|
||||
methods: {
|
||||
// 船只
|
||||
|
|
@ -90,6 +98,7 @@
|
|||
this.$refs.popup.close()
|
||||
this.title = `${this.shipName} 进口航次：${this.inVvyName} / 出口航次：${this.outVvyName}`
|
||||
uni.setStorageSync('shipWorkTitle', this.title)
|
||||
this.$emit("isPreview", this.title)
|
||||
},
|
||||
// 查
|
||||
executeSql(sql) {
|
||||
|
|
@ -114,8 +123,32 @@
|
|||
shipName: v.spmName,
|
||||
vtpId: v.vtpId
|
||||
}
|
||||
this.shipList.push(obj)
|
||||
this.shipList.unshift(obj)
|
||||
})
|
||||
const array = this.shipList
|
||||
const mergedArray = array.reduce((accumulator, currentValue) => {
|
||||
const existingValue = accumulator.find(item => item.vtpId === currentValue.vtpId);
|
||||
if (existingValue) {
|
||||
// 如果找到了具有相同 vtpId 的元素，则合并它们的值
|
||||
if (existingValue.inVvyId == "") {
|
||||
existingValue.inVvyId = currentValue.inVvyId;
|
||||
}
|
||||
if (existingValue.inVvyName == "") {
|
||||
existingValue.inVvyName = currentValue.inVvyName;
|
||||
}
|
||||
if (existingValue.outVvyId == "") {
|
||||
existingValue.outVvyId = currentValue.outVvyId;
|
||||
}
|
||||
if (existingValue.outVvyName == "") {
|
||||
existingValue.outVvyName = currentValue.outVvyName;
|
||||
}
|
||||
} else {
|
||||
// 如果没有找到具有相同 vtpId 的元素，则将当前元素添加到 accumulator 中
|
||||
accumulator.push(currentValue);
|
||||
}
|
||||
return accumulator;
|
||||
}, []);
|
||||
this.shipList = mergedArray
|
||||
}).catch((error) => {
|
||||
// 在reject时执行的回调函数
|
||||
console.error(error);
|
||||
|
|
@ -155,7 +188,7 @@
|
|||
text-align: center;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.10);
|
||||
z-index: 9999;
|
||||
z-index: 997;
|
||||
|
||||
.icon {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -508,137 +508,71 @@
|
|||
</custom-tab-pane>
|
||||
<custom-tab-pane label="场位图" name="c1_3">
|
||||
<view class="main">
|
||||
<view>
|
||||
<template v-if="placeTabs == 0">
|
||||
<view class="field">
|
||||
<view class="boxTop">
|
||||
<view class="title">
|
||||
堆场
|
||||
<view></view>
|
||||
<view class="form">
|
||||
<view class="inputBox">
|
||||
<view class="leftInput">
|
||||
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="mnfBl"
|
||||
placeholder="提单号" @iconClick="search"></uni-easyinput>
|
||||
</view>
|
||||
<view class="option">
|
||||
<uni-data-select v-model="optionValue"
|
||||
:localdata="optionList"></uni-data-select>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fpList">
|
||||
<view class="fpInfo">
|
||||
<view class="fpTitle">
|
||||
港建库
|
||||
</view>
|
||||
<view class="fpListInfo">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
<view class="rightInput">
|
||||
<superwei-combox class="input dc" :candidates="dcList" :isJSON="true"
|
||||
keyName="pymName" placeholder="堆场" v-model="dcName"
|
||||
@select="dcSelect"></superwei-combox>
|
||||
<superwei-combox class="input" :candidates="qyList" :isJSON="true"
|
||||
keyName="pyaAreaCode" placeholder="区域" v-model="qyName"
|
||||
@select="qySelect"></superwei-combox>
|
||||
<superwei-combox class="input" :candidates="brandList" :isJSON="true"
|
||||
keyName="brdName" placeholder="品牌" v-model="brdName"
|
||||
@select="brandSelect"></superwei-combox>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoCarNum">
|
||||
<text>车位总数：120车位</text>
|
||||
<text>使用：40车位</text>
|
||||
<text>剩余：40车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
<text>已停放车辆：300辆</text>
|
||||
<view class="cwMain">
|
||||
<view class="cwTop">
|
||||
<view style="display: flex;">
|
||||
<view class="statusText">
|
||||
<view class="status kz"></view>
|
||||
<text>空置</text>
|
||||
</view>
|
||||
<view class="progressBox">
|
||||
<van-progress :percentage="itemSum2(2000)"
|
||||
:pivot-text="'1000/' + 2000" />
|
||||
<view class="statusText">
|
||||
<view class="status sy"></view>
|
||||
<text>使用</text>
|
||||
</view>
|
||||
<view class="carInfoList">
|
||||
<view class="carBrand" v-for="item in 4" :key="item">
|
||||
<view class="brandTitle">
|
||||
保时捷-轿车
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
400 辆，共5道12车位
|
||||
<view class="topRight">
|
||||
<p>港区:{{cwData.pamName}}</p>
|
||||
<p>船名/航次:{{cwData.voyName}}</p>
|
||||
<p>总数量:{{cwData.total}}</p>
|
||||
<p>已配数量:{{cwData.allocatNumber}}</p>
|
||||
<p>未配数量:{{cwData.notNumber}}</p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cwTitle">
|
||||
<view class="titleLeft">
|
||||
车道
|
||||
</view>
|
||||
<view class="titleRight">
|
||||
车位
|
||||
</view>
|
||||
</view>
|
||||
<view class="cwContent">
|
||||
<view class="cwLeftBox">
|
||||
<view class="cwLeft" v-for="item in cdList.length" :key="item">
|
||||
<template v-if="item > 0 && item <= 9">0</template>
|
||||
{{item}}道
|
||||
</view>
|
||||
</view>
|
||||
<view class="cwRightBox">
|
||||
<view class="cwRight"
|
||||
:style="{height:(item.index > 1 ? item.index*32 + 'px':''),background: (item.index > 1 ? '#C7D4F3':'')}"
|
||||
v-for="(item,idx) in rigthCw" :key="idx">
|
||||
<text v-if="item.name == '空置'">{{item.name}}</text>
|
||||
<p v-else>{{item.name}}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fpListInfo notListInfo">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="notTitle">
|
||||
未分配
|
||||
</view>
|
||||
<text>车位总数：120车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="tipInfo">
|
||||
未使用2车道20车位
|
||||
</view>
|
||||
</view>
|
||||
<view class="fpInfo">
|
||||
<view class="fpTitle">
|
||||
海棠库
|
||||
</view>
|
||||
<view class="fpListInfo notListInfo">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="notTitle">
|
||||
未分配
|
||||
</view>
|
||||
<text>车位总数：120车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="fpListInfo">
|
||||
<view class="carInfoList">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoCarNum">
|
||||
<text>车位总数：120车位</text>
|
||||
<text>使用：40车位</text>
|
||||
<text>剩余：40车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
<text>已停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="progressBox">
|
||||
<van-progress :percentage="itemSum2(2000)"
|
||||
:pivot-text="'1000/' + 2000" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="carInfoList">
|
||||
<view class="carBrand" v-for="item in 4" :key="item">
|
||||
<view class="brandTitle">
|
||||
保时捷-轿车
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
400 辆，共5道12车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<place @modifyPlaceTabs="modifyPlaceTabs"></place>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</custom-tab-pane>
|
||||
</custom-tabs>
|
||||
|
|
@ -692,7 +626,6 @@
|
|||
|
||||
<script>
|
||||
import HeadView from '@/components/head-view/head-view.vue';
|
||||
import place from './place.vue';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -712,10 +645,12 @@
|
|||
sendList: [{
|
||||
vale: "1",
|
||||
text: "已发送"
|
||||
}, {
|
||||
},
|
||||
{
|
||||
vale: "0",
|
||||
text: "未发送"
|
||||
}],
|
||||
}
|
||||
],
|
||||
sendValue: "",
|
||||
sendText: "",
|
||||
// 品牌
|
||||
|
|
@ -754,29 +689,22 @@
|
|||
zTjActive: -1,
|
||||
zTjList: {},
|
||||
|
||||
optionValue: "",
|
||||
optionList: [{
|
||||
value: "0",
|
||||
text: "全部堆场"
|
||||
},
|
||||
{
|
||||
alue: "1",
|
||||
text: "外六"
|
||||
},
|
||||
{
|
||||
alue: "2",
|
||||
text: "港建库"
|
||||
},
|
||||
{
|
||||
alue: "3",
|
||||
text: "高东库"
|
||||
},
|
||||
{
|
||||
alue: "4",
|
||||
text: "江海库"
|
||||
}
|
||||
],
|
||||
placeTabs: 0,
|
||||
// 场位图数据
|
||||
// 港区信息
|
||||
portObj: {},
|
||||
// 堆场信息
|
||||
dcId: "",
|
||||
dcName: "",
|
||||
dcList: [],
|
||||
// 区域信息
|
||||
qyId: "",
|
||||
qyName: "",
|
||||
qyList: "",
|
||||
// 车道信息
|
||||
cdList: [],
|
||||
// 场位信息
|
||||
cwData: {},
|
||||
rigthCw: [],
|
||||
|
||||
// 分页
|
||||
pageSize: 10,
|
||||
|
|
@ -790,31 +718,25 @@
|
|||
return sum
|
||||
};
|
||||
},
|
||||
itemSum2() {
|
||||
return function(item) {
|
||||
let sum = 1000 / item * 100
|
||||
return sum
|
||||
};
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.shipInfo = JSON.parse(decodeURIComponent(options.params)).shipInfo
|
||||
this.tradeType = JSON.parse(decodeURIComponent(options.params)).tradeType
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
this.portObj = uni.getStorageSync('portObj')
|
||||
this.title = `${this.shipInfo.spmIdDesc} / ${this.shipInfo.vvyName}`
|
||||
if (this.tabsValue == 0) {
|
||||
this.loadSumOrder() // 总指令：分页查询
|
||||
console.log(this.shipInfo)
|
||||
}
|
||||
this.getBrand() // 获取品牌
|
||||
this.getBvm() // 获取车型
|
||||
this.getRoleId() // 获取角色ID
|
||||
this.initAsk() // 获取装船要求
|
||||
this.getStatistics() // 获取统计数据
|
||||
|
||||
},
|
||||
components: {
|
||||
HeadView,
|
||||
place,
|
||||
},
|
||||
methods: {
|
||||
// 点击tabs
|
||||
|
|
@ -830,10 +752,16 @@
|
|||
this.current = 1
|
||||
this.zTjActive = -1
|
||||
this.zTjType = true
|
||||
this.dcId = ""
|
||||
this.dcName = ""
|
||||
this.qyId = ""
|
||||
this.qyName = ""
|
||||
if (e.value == 1 || e.value == 2) {
|
||||
this.loadOtherOrder()
|
||||
} else if (e.value == 0) {
|
||||
this.loadSumOrder()
|
||||
} else if (e.value == 3) {
|
||||
this.getDc()
|
||||
}
|
||||
this.directorList = []
|
||||
this.getRoleId()
|
||||
|
|
@ -845,6 +773,8 @@
|
|||
this.loadOtherOrder()
|
||||
} else if (this.tabsValue == 0) {
|
||||
this.loadSumOrder()
|
||||
} else if (this.tabsValue == 2) {
|
||||
this.getCw()
|
||||
}
|
||||
this.getStatistics()
|
||||
},
|
||||
|
|
@ -889,7 +819,6 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.zTjList = res.data.data[0]
|
||||
this.zTjList["totalSum"] = this.zTjList.totalSentCount + this.zTjList.totalNotSentCount
|
||||
this.zTjList["branchSum"] = this.zTjList.branchSentCount + this.zTjList
|
||||
|
|
@ -916,7 +845,6 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.itemList.push(...res.data.data.records)
|
||||
if (res.data.data.records.length == 10) {
|
||||
this.current++
|
||||
|
|
@ -950,7 +878,6 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.itemList.push(...res.data.data.records)
|
||||
if (res.data.data.records.length == 10) {
|
||||
this.current++
|
||||
|
|
@ -974,7 +901,6 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.$set(this.itemList[index], 'infoList', res.data.data)
|
||||
}
|
||||
})
|
||||
|
|
@ -1184,7 +1110,6 @@
|
|||
},
|
||||
method: 'PUT', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
if (res.data.status == 200) {
|
||||
this.loadOtherOrder()
|
||||
uni.showToast({
|
||||
|
|
@ -1290,6 +1215,8 @@
|
|||
this.loadSumOrder()
|
||||
} else if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||||
this.loadOtherOrder()
|
||||
} else if (this.tabsValue == 3) {
|
||||
this.getCw()
|
||||
}
|
||||
},
|
||||
// 获取车型
|
||||
|
|
@ -1322,7 +1249,6 @@
|
|||
}
|
||||
},
|
||||
toDetails(item, item2) {
|
||||
console.log(item, item2)
|
||||
let obj = {
|
||||
tradeName: "W",
|
||||
shipInfo: this.shipInfo,
|
||||
|
|
@ -1338,14 +1264,139 @@
|
|||
checkChange(e) {
|
||||
this.checkList = e.detail.value
|
||||
},
|
||||
// 点击车道
|
||||
toGoPlace() {
|
||||
this.placeTabs = 1;
|
||||
// 场位图相关
|
||||
// 获取堆场数据
|
||||
getDc() {
|
||||
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}`
|
||||
},
|
||||
// 子组件修改值
|
||||
modifyPlaceTabs(data) {
|
||||
this.placeTabs = data;
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.data.status == "200") {
|
||||
this.dcId = res.data.data[0].pymId
|
||||
this.dcName = res.data.data[0].pymName
|
||||
this.dcList = res.data.data
|
||||
this.getQy()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择堆场下拉数据
|
||||
dcSelect(e) {
|
||||
this.dcId = e.pymId
|
||||
this.dcName = e.pymName
|
||||
this.getQy()
|
||||
},
|
||||
// 获取区域数据
|
||||
getQy() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yard/sel/queryArea?pymId=${this.dcId}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.data.status == "200") {
|
||||
this.qyId = res.data.data[0].pyaId
|
||||
this.qyName = res.data.data[0].pyaAreaCode
|
||||
this.qyList = res.data.data
|
||||
this.getCd()
|
||||
this.getCw()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择区域下拉数据
|
||||
qySelect(e) {
|
||||
this.qyId = e.pyaId
|
||||
this.qyName = e.pyaAreaCode
|
||||
this.getCd()
|
||||
this.getCw()
|
||||
},
|
||||
// 获取车道数据
|
||||
getCd() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yard/sel/queryLanesByPyaId?pyaId=${this.qyId}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
if (res.data.status == "200") {
|
||||
this.cdList = res.data.data
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取数据
|
||||
getCw() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/shipment/unload/plans/pos/chart?brdId=${this.brdId}&mnfBl=${this.mnfBl}&vvyId=${this.shipInfo.vvyId}&pyaId=${this.qyId}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
if (res.data.status == "200") {
|
||||
this.cwData = res.data.data
|
||||
let arr = []
|
||||
let nArr = []
|
||||
let arr2 = []
|
||||
this.cdList.forEach(item => {
|
||||
arr.push({
|
||||
name: "空置",
|
||||
index: 1
|
||||
})
|
||||
})
|
||||
res.data.data.posChartRespDTOList.forEach(item => {
|
||||
nArr = []
|
||||
let num = Number(item.endLane) - Number(item.startLane) ? Number(item
|
||||
.endLane) - Number(item.startLane) : 1
|
||||
let Nnum = num > 1 ? num + 1 : num
|
||||
for (let i = 0; i < Nnum; i++) {
|
||||
nArr.push({
|
||||
name: item.plansGroupList[0]
|
||||
?.name,
|
||||
index: Nnum
|
||||
})
|
||||
}
|
||||
if (Nnum > 1) {
|
||||
arr.pop()
|
||||
}
|
||||
arr.splice(Number(item.startLane) - 1, num, ...nArr)
|
||||
})
|
||||
this.arrFrom(arr, arr2)
|
||||
this.rigthCw = arr2
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
arrFrom(arr, nArr) {
|
||||
nArr[nArr.length] = arr[0];
|
||||
for (let i = 1; i < arr.length; i++) {
|
||||
let flag = true;
|
||||
for (let j = 0; j < nArr.length; j++) {
|
||||
if (arr[i].name != '空置') {
|
||||
if (nArr[j].name === arr[i].name) {
|
||||
flag = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (flag) {
|
||||
nArr[nArr.length] = arr[i];
|
||||
}
|
||||
}
|
||||
return nArr;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1363,6 +1414,7 @@
|
|||
background-color: #F6F7F9;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
min-height: calc(100vh - 110px);
|
||||
|
||||
/deep/.tab .tab-bar {
|
||||
height: 66px;
|
||||
|
|
@ -1392,6 +1444,7 @@
|
|||
|
||||
/deep/.tab-pane {
|
||||
width: 100%;
|
||||
height: calc(100vh - 134px);
|
||||
}
|
||||
|
||||
.main {
|
||||
|
|
@ -1477,6 +1530,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.dc {
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
|
|
@ -2086,199 +2143,130 @@
|
|||
}
|
||||
}
|
||||
|
||||
.field {
|
||||
padding: 20px;
|
||||
background-color: #000;
|
||||
// 场位图样式
|
||||
.cwMain {
|
||||
width: 100%;
|
||||
height: calc(100vh - 134px);
|
||||
|
||||
.boxTop {
|
||||
.cwTop {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 36px;
|
||||
background: #FDFEFE;
|
||||
border: 1px solid #E1E5ED;
|
||||
|
||||
.title {
|
||||
.status {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin-right: 8px;
|
||||
border-radius: 50%;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.statusText {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
margin-right: 20px;
|
||||
font-size: 18px;
|
||||
|
||||
.kz {
|
||||
background: #EEEEEE;
|
||||
}
|
||||
|
||||
.sy {
|
||||
background: #4476F6;
|
||||
}
|
||||
}
|
||||
|
||||
.topRight {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.option {
|
||||
width: 200px;
|
||||
p {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.carTabs {
|
||||
.cwTitle {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
margin-top: 20px;
|
||||
border-radius: 8px;
|
||||
|
||||
/deep/.tab {
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
|
||||
.carList {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 20px;
|
||||
|
||||
.carInfo {
|
||||
width: 19%;
|
||||
padding: 20px;
|
||||
background-color: #ccc;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
background: #E1E5ED;
|
||||
border: 1px solid #DBDDE3;
|
||||
font-size: 15px;
|
||||
color: #0B266A;
|
||||
margin-bottom: 4px;
|
||||
|
||||
.partsList {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 20px;
|
||||
|
||||
.partsInfo {
|
||||
width: 19%;
|
||||
padding: 20px;
|
||||
background-color: #ccc;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.infoTitle {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.infoNum {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.fpList {
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.fpInfo {
|
||||
width: 49%;
|
||||
|
||||
}
|
||||
|
||||
.fpTitle {
|
||||
text-align: center;
|
||||
background: #262626;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.fpListInfo {
|
||||
padding: 20px 10px;
|
||||
background: #262626;
|
||||
color: #fff;
|
||||
margin-top: 10px;
|
||||
|
||||
.infoTop {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.infoTopTitle {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding-left: 10px;
|
||||
border-left: 5px solid #0079FE;
|
||||
.titleLeft {
|
||||
width: 128px;
|
||||
height: 100%;
|
||||
border-right: 1px solid #DBDDE3;
|
||||
}
|
||||
|
||||
.titleRight {
|
||||
width: calc(100% - 128px);
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.cwContent {
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
height: calc(100% - 83px);
|
||||
overflow: scroll;
|
||||
|
||||
.titleIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background: #0079FE;
|
||||
margin-left: 5px;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
margin-top: 5px;
|
||||
|
||||
/deep/.van-icon {
|
||||
transform: scale(0.8);
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
text {
|
||||
color: #0079FE;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.infoCarNum {
|
||||
.cwLeftBox {
|
||||
width: 128px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 10px;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
font-size: 15px;
|
||||
color: #0B266A;
|
||||
margin-right: 4px;
|
||||
|
||||
text {
|
||||
margin: 10px 20px;
|
||||
.cwLeft {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
border: 1px solid #DBDDE3;
|
||||
background: #E1E5ED;
|
||||
}
|
||||
}
|
||||
|
||||
.progressBox {
|
||||
width: 100%;
|
||||
}
|
||||
.cwRightBox {
|
||||
width: calc(100% - 128px);
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
|
||||
.carInfoList {
|
||||
.cwRight {
|
||||
height: 32px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
.carBrand {
|
||||
width: 32%;
|
||||
background-color: #2C2D2D;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.brandTitle {
|
||||
color: #0079FE;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notListInfo {
|
||||
.notTitle {
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.infoTop {
|
||||
text {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
margin-right: 30px;
|
||||
}
|
||||
padding: 5px;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #E4E4E4;
|
||||
border-radius: 1px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.tipInfo {
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
color: #5FE515;
|
||||
font-weight: bold;
|
||||
padding: 20px 0;
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
margin-top: 10px;
|
||||
p {
|
||||
background: #C7D4F3;
|
||||
color: #4476F6;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,358 +0,0 @@
|
|||
<template>
|
||||
<view class="place">
|
||||
<view class="placeTop">
|
||||
<view class="topLeft">
|
||||
堆场资源 B3区
|
||||
</view>
|
||||
<view class="topRight">
|
||||
<button @click="back"><text class="back">返回</text></button>
|
||||
<button @click="show"><text class="show">显示</text></button>
|
||||
</view>
|
||||
<view class="showBox" v-if="showType">
|
||||
<view class="showInfo">
|
||||
车道
|
||||
</view>
|
||||
<view class="showInfo">
|
||||
车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
<view class="infoLeft">
|
||||
<text>车位总数：12*15=180车位</text>
|
||||
<text>使用车位：40车位</text>
|
||||
<text>剩余车位：40车位</text>
|
||||
<text>虚拟场位：12车位</text>
|
||||
<text>可停放车辆：12辆</text>
|
||||
<text>已停放车辆：12辆</text>
|
||||
</view>
|
||||
<view class="infoRight">
|
||||
<view class="tipBox">
|
||||
<text>空置</text>
|
||||
<view class="colorBox vacant"></view>
|
||||
</view>
|
||||
<view class="tipBox">
|
||||
<text>使用</text>
|
||||
<view class="colorBox use"></view>
|
||||
</view>
|
||||
<view class="tipBox">
|
||||
<text>虚拟车位</text>
|
||||
<view class="colorBox virtually"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeList">
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
01道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType1">
|
||||
<view class="type1Box box1">
|
||||
宝马-轿车 12辆
|
||||
</view>
|
||||
<view class="type1Box box2">
|
||||
奔驰-轿车 12辆
|
||||
</view>
|
||||
<view class="type1Box box3">
|
||||
未使用：5车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
02道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType2">
|
||||
<view class="type2Box">
|
||||
<template v-for="(item, index) in type2List">
|
||||
<view class="type2info"
|
||||
:class="{'type0':item.type == 0, 'type1':item.type == 1, 'type2':item.type == 2}"
|
||||
:key="index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
03道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType3">
|
||||
未使用：5车位
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
04道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType3">
|
||||
未使用：5车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
type2List: [{
|
||||
id: "01",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
},
|
||||
{
|
||||
id: "02",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "03",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "04",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "05",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "06",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "07",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "08",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "09",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "10",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "11",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "12",
|
||||
name: "虚拟车位",
|
||||
type: 2,
|
||||
},
|
||||
],
|
||||
showType: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 点击返回
|
||||
back() {
|
||||
this.$emit("modifyPlaceTabs", 0)
|
||||
},
|
||||
// 点击显示
|
||||
show() {
|
||||
this.showType = !this.showType
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.place {
|
||||
.placeTop {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
|
||||
.topLeft {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.topRight {
|
||||
display: flex;
|
||||
|
||||
uni-button {
|
||||
margin-left: 30px;
|
||||
width: 100px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.back {
|
||||
color: #0079FE;
|
||||
}
|
||||
|
||||
.show {
|
||||
color: #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
.showBox {
|
||||
position: absolute;
|
||||
bottom: -102px;
|
||||
right: 25px;
|
||||
border: 1px solid #aaa;
|
||||
|
||||
.showInfo {
|
||||
padding: 20px 30px;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeInfo {
|
||||
padding: 10px 20px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
|
||||
.infoLeft {
|
||||
flex: 2;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
text {
|
||||
margin: 10px;
|
||||
margin-right: 0;
|
||||
padding-right: 10px;
|
||||
border-right: 1px solid #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
.infoRight {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
margin-left: 30px;
|
||||
|
||||
.tipBox {
|
||||
display: flex;
|
||||
margin: auto;
|
||||
|
||||
.colorBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.vacant {
|
||||
background-color: #aaa;
|
||||
}
|
||||
|
||||
.use {
|
||||
background-color: #0079FE;
|
||||
}
|
||||
|
||||
.virtually {
|
||||
background-color: #F86E56;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeList {
|
||||
padding: 20px;
|
||||
background-color: #000;
|
||||
|
||||
.listInfo {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
padding-left: 10px;
|
||||
border-left: 5px solid #0079FE;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.listType1 {
|
||||
display: flex;
|
||||
|
||||
.type1Box {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.box1 {
|
||||
flex: 1;
|
||||
background-color: #0079FE;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.box2 {
|
||||
flex: 1;
|
||||
background-color: #0079FE;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.box3 {
|
||||
flex: 2;
|
||||
background-color: #fff;
|
||||
color: #aaa
|
||||
}
|
||||
}
|
||||
|
||||
.listType2 {
|
||||
padding: 10px 0;
|
||||
background-color: #222;
|
||||
|
||||
.type2Box {
|
||||
display: flex;
|
||||
|
||||
.type2info {
|
||||
flex: 1;
|
||||
height: 150px;
|
||||
border-radius: 8px;
|
||||
margin: 0 5px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.type0 {
|
||||
background-color: #aaa;
|
||||
}
|
||||
|
||||
.type1 {
|
||||
background-color: #0079FE;
|
||||
}
|
||||
|
||||
.type2 {
|
||||
background-color: #F86E56;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.listType3 {
|
||||
height: 200px;
|
||||
text-align: center;
|
||||
color: #F86E56;
|
||||
line-height: 200px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
background-color: #aaa;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -619,139 +619,105 @@
|
|||
</view>
|
||||
</custom-tab-pane>
|
||||
<custom-tab-pane :label="cwtName" name="c1_4" v-if="cwtIsShow">
|
||||
<view class="main">
|
||||
<view>
|
||||
<template v-if="placeTabs == 0">
|
||||
<view class="field">
|
||||
<view class="main" v-if="isCwnum == 0">
|
||||
<view></view>
|
||||
<view class="form">
|
||||
<view class="inputBox">
|
||||
<view class="leftInput">
|
||||
<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="mnfBl"
|
||||
placeholder="提单号" @iconClick="search"></uni-easyinput>
|
||||
</view>
|
||||
<view class="rightInput">
|
||||
<superwei-combox class="input" :candidates="brandList" :isJSON="true"
|
||||
keyName="brdName" placeholder="品牌" v-model="brdName"
|
||||
@select="brandSelect"></superwei-combox>
|
||||
<superwei-combox class="input" :candidates="bvmList" :isJSON="true" keyName="name"
|
||||
placeholder="车型" v-model="bvmName" @select="bvmSelect"></superwei-combox>
|
||||
<superwei-combox class="input" :candidates="potList" :isJSON="true"
|
||||
keyName="potCnname" placeholder="港口" v-model="potName"
|
||||
@select="potSelect"></superwei-combox>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cwMain">
|
||||
<view class="cwLeft">
|
||||
<view class="leftData" v-for="(item,index) in dcList" :key="index"
|
||||
@click="clickLeft(item,index)" :class="{active:activeIndex == index}">
|
||||
<p>{{item.pymName}}</p>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cwRight">
|
||||
<view class="rightBox" v-for="(item,index) in qyList" :key="index">
|
||||
<view class="boxTop">
|
||||
<view class="title">
|
||||
堆场
|
||||
</view>
|
||||
<view class="option">
|
||||
<uni-data-select v-model="optionValue"
|
||||
:localdata="optionList"></uni-data-select>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fpList">
|
||||
<view class="fpInfo">
|
||||
<view class="fpTitle">
|
||||
港建库
|
||||
</view>
|
||||
<view class="fpListInfo">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoCarNum">
|
||||
<text>车位总数：120车位</text>
|
||||
<text>使用：40车位</text>
|
||||
<text>剩余：40车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
<text>已停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="progressBox">
|
||||
<van-progress :percentage="itemSum2(2000)"
|
||||
:pivot-text="'1000/' + 2000" />
|
||||
</view>
|
||||
<view class="carInfoList">
|
||||
<view class="carBrand" v-for="item in 4" :key="item">
|
||||
<view class="brandTitle">
|
||||
保时捷-轿车
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
400 辆，共5道12车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fpListInfo notListInfo">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="notTitle">
|
||||
未分配
|
||||
</view>
|
||||
<text>车位总数：120车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="tipInfo">
|
||||
未使用2车道20车位
|
||||
</view>
|
||||
</view>
|
||||
<view class="fpInfo">
|
||||
<view class="fpTitle">
|
||||
海棠库
|
||||
</view>
|
||||
<view class="fpListInfo notListInfo">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="notTitle">
|
||||
未分配
|
||||
</view>
|
||||
<text>车位总数：120车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="fpListInfo">
|
||||
<view class="carInfoList">
|
||||
<view class="infoTop">
|
||||
<view class="infoTopTitle">A1区（12*12）</view>
|
||||
<view class="titleRight" @click="toGoPlace">
|
||||
<text>车道</text>
|
||||
<view class="titleIcon">
|
||||
<van-icon name="arrow" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoCarNum">
|
||||
<text>车位总数：120车位</text>
|
||||
<text>使用：40车位</text>
|
||||
<text>剩余：40车位</text>
|
||||
<text>可停放车辆：300辆</text>
|
||||
<text>已停放车辆：300辆</text>
|
||||
</view>
|
||||
<view class="progressBox">
|
||||
<van-progress :percentage="itemSum2(2000)"
|
||||
:pivot-text="'1000/' + 2000" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="carInfoList">
|
||||
<view class="carBrand" v-for="item in 4" :key="item">
|
||||
<view class="brandTitle">
|
||||
保时捷-轿车
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
400 辆，共5道12车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<p>{{item.pyaAreaCode}}（{{item.totalLaneAmout}}/{{item.totalSeatAmout}}）</p>
|
||||
<text @click="clickLine(item)">车道</text>
|
||||
</view>
|
||||
<view class="boxContent">
|
||||
<view class="dataList">
|
||||
<p>车位总数：
|
||||
<template v-if="item.totalSeatAmout == null">-- </template>
|
||||
<template v-else>{{item.totalSeatAmout}}</template>
|
||||
车位
|
||||
</p>
|
||||
<p>使用：
|
||||
<template v-if="item.useSeatAmout == null">-- </template>
|
||||
<template v-else>{{item.useSeatAmout}}</template>
|
||||
车位
|
||||
</p>
|
||||
<p>剩余：
|
||||
<template v-if="item.remainSeatAmout == null">-- </template>
|
||||
<template v-else>{{item.remainSeatAmout}}</template>
|
||||
车位
|
||||
</p>
|
||||
<p>可停放车辆：
|
||||
<template v-if="item.unparkGoodsAmout == null">-- </template>
|
||||
<template v-else>{{item.unparkGoodsAmout}}</template>
|
||||
辆
|
||||
</p>
|
||||
<p>已停放车辆：
|
||||
<template v-if="item.stopGoodsAmout == null">-- </template>
|
||||
<template v-else>{{item.stopGoodsAmout}}</template>
|
||||
辆
|
||||
</p>
|
||||
</view>
|
||||
<view class="boxJd">
|
||||
<lx-progress-bar title="" :total="item.totalSeatAmout"
|
||||
:firstValue="item.stopGoodsAmout" contentColor="#0067CF" />
|
||||
<text>{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}</text>
|
||||
</view>
|
||||
<view class="carUl">
|
||||
<view class="carLi" v-for="(v,index2) in item.carStatisticsList"
|
||||
:key="index2" @click="clickCar(v)">
|
||||
<zb-tooltip placement="top-start" color="white"
|
||||
:visible.sync="v.isShow">
|
||||
<view slot="content">
|
||||
<view>
|
||||
<p v-for="(item2,idx) in v.carDetailList" :key="idx">
|
||||
{{item2.storeLine}}道，{{item2.storeSeatAmout}}车位
|
||||
</p>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 100%; height: 100%;">
|
||||
<p class="carTitle">{{v.brdName}}
|
||||
<template v-if="v.bvmName != ''">
|
||||
-
|
||||
</template>
|
||||
{{v.bvmName}}
|
||||
</p>
|
||||
<text>共{{v.carAmout}}辆</text>
|
||||
</view>
|
||||
</zb-tooltip>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-else>
|
||||
<place @modifyPlaceTabs="modifyPlaceTabs"></place>
|
||||
<place @modifyPlaceTabs="modifyPlaceTabs" :vvyId="shipInfo.vvyId" :pyaObj="pyaObj"
|
||||
:brdId="brdId" :bvmId="bvmId" :potId="potId" :mnfBl="mnfBl"></place>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</custom-tab-pane>
|
||||
<custom-tab-pane :label="zcyqName" name="c1_5" v-if="zcyqIsShow">
|
||||
<view></view>
|
||||
|
|
@ -813,7 +779,6 @@
|
|||
</uni-popup>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -827,6 +792,8 @@
|
|||
loginObj: {},
|
||||
tabsValue: 0, // 0(总指令) 1(分指令)
|
||||
shipInfo: {}, // 船只数据
|
||||
// 港区信息
|
||||
portObj: {},
|
||||
// 搜索框
|
||||
mnfBl: '', // 提单号
|
||||
mnfBlItem: {},
|
||||
|
|
@ -850,10 +817,12 @@
|
|||
sendList: [{
|
||||
vale: "1",
|
||||
text: "已发送"
|
||||
}, {
|
||||
},
|
||||
{
|
||||
vale: "0",
|
||||
text: "待发送"
|
||||
}],
|
||||
}
|
||||
],
|
||||
sendValue: "",
|
||||
sendText: "",
|
||||
// 指令下发弹窗负责人
|
||||
|
|
@ -884,29 +853,17 @@
|
|||
zTjList: {},
|
||||
shipDeck: "",
|
||||
|
||||
optionValue: "",
|
||||
optionList: [{
|
||||
value: "0",
|
||||
text: "全部堆场"
|
||||
},
|
||||
{
|
||||
alue: "1",
|
||||
text: "外六"
|
||||
},
|
||||
{
|
||||
alue: "2",
|
||||
text: "港建库"
|
||||
},
|
||||
{
|
||||
alue: "3",
|
||||
text: "高东库"
|
||||
},
|
||||
{
|
||||
alue: "4",
|
||||
text: "江海库"
|
||||
}
|
||||
],
|
||||
placeTabs: 0,
|
||||
// 场位图相关数据
|
||||
// 堆场
|
||||
dcId: "",
|
||||
dcName: "",
|
||||
dcList: [],
|
||||
// 区域
|
||||
pyaObj: "",
|
||||
qyList: [],
|
||||
activeIndex: 0,
|
||||
// 场位的状态 是否进入车道
|
||||
isCwnum: 0,
|
||||
|
||||
// 分页
|
||||
pageSize: 10,
|
||||
|
|
@ -947,19 +904,13 @@
|
|||
return sum
|
||||
};
|
||||
},
|
||||
itemSum2() {
|
||||
return function(item) {
|
||||
let sum = 1000 / item * 100
|
||||
return sum
|
||||
};
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.shipInfo = JSON.parse(decodeURIComponent(options.params)).shipInfo
|
||||
this.title = `${this.shipInfo.spmIdDesc} / ${this.shipInfo.vvyName}`
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
this.portObj = uni.getStorageSync('portObj')
|
||||
this.qxList = uni.getStorageSync('qxList')
|
||||
console.log(this.qxList)
|
||||
this.qxList.forEach(v => {
|
||||
if (v.code == "shipmentDirectives") {
|
||||
v.operates.forEach(e => {
|
||||
|
|
@ -1021,6 +972,7 @@
|
|||
this.shipDeck = ""
|
||||
this.current = 1
|
||||
this.zTjType = true
|
||||
this.activeIndex = 0
|
||||
if (e.value == 1 || e.value == 2) {
|
||||
this.loadOtherOrder()
|
||||
// this.askDisabled = true
|
||||
|
|
@ -1031,6 +983,8 @@
|
|||
this.getPotList()
|
||||
this.getImgInfo()
|
||||
this.getGoodsInfo()
|
||||
} else if (e.value == 4) {
|
||||
this.getDc()
|
||||
}
|
||||
this.directorList = []
|
||||
this.getRoleId()
|
||||
|
|
@ -1039,10 +993,13 @@
|
|||
search() {
|
||||
if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||||
this.loadOtherOrder()
|
||||
this.getStatistics()
|
||||
} else if (this.tabsValue == 0) {
|
||||
this.loadSumOrder()
|
||||
}
|
||||
this.getStatistics()
|
||||
} else if (this.tabsValue == 4) {
|
||||
this.getQy()
|
||||
}
|
||||
},
|
||||
// 点击总指令统计列表总标题
|
||||
clickTjHead(type) {
|
||||
|
|
@ -1511,6 +1468,8 @@
|
|||
this.loadSumOrder()
|
||||
} else if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||||
this.loadOtherOrder()
|
||||
} else if (this.tabsValue == 4) {
|
||||
this.getQy()
|
||||
}
|
||||
},
|
||||
// 获取港口
|
||||
|
|
@ -1540,6 +1499,8 @@
|
|||
this.loadSumOrder()
|
||||
} else if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||||
this.loadOtherOrder()
|
||||
} else if (this.tabsValue == 4) {
|
||||
this.getQy()
|
||||
}
|
||||
},
|
||||
// 获取车型
|
||||
|
|
@ -1569,6 +1530,8 @@
|
|||
this.loadSumOrder()
|
||||
} else if (this.tabsValue == 1 || this.tabsValue == 2) {
|
||||
this.loadOtherOrder()
|
||||
} else if (this.tabsValue == 4) {
|
||||
this.getQy()
|
||||
}
|
||||
},
|
||||
toDetails(id) {
|
||||
|
|
@ -1697,13 +1660,87 @@
|
|||
ctx.draw();
|
||||
},
|
||||
// 场位图相关
|
||||
// 获取左侧堆场列表
|
||||
getDc() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yardGoods/monitor/goods/manage/page?displayFlag=1&pamId=${this.portObj.portId}&vvyId=${this.shipInfo.vvyId}&size=100`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.data.status == "200") {
|
||||
this.dcList = res.data.data.records
|
||||
this.dcId = this.dcList[0].pymId
|
||||
this.dcName = this.dcList[0].pymName
|
||||
this.getQy()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点击左侧列表
|
||||
clickLeft(item, index) {
|
||||
this.dcId = item.pymId
|
||||
this.dcName = item.pymName
|
||||
this.activeIndex = index
|
||||
this.getQy()
|
||||
},
|
||||
// 获取右侧区域数据
|
||||
getQy() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yardGoods/monitor/region/statistics?vvyId=${this.shipInfo.vvyId}&pymId=${this.dcId}&displayFlag=1&brdId=${this.brdId}&bvmId=${this.bvmId}&potId=${this.potId}&mnfBl=${this.mnfBl}&size=1000`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.statusCode == 200) {
|
||||
console.log(res)
|
||||
this.qyList = res.data.data.records
|
||||
this.qyList.forEach(v => {
|
||||
if (v.remainSeatAmout == null) {
|
||||
this.$set(v, "remainSeatAmout", 0)
|
||||
}
|
||||
if (v.stopGoodsAmout == null) {
|
||||
this.$set(v, "stopGoodsAmout", 0)
|
||||
}
|
||||
if (v.totalLaneAmout == null) {
|
||||
this.$set(v, "totalLaneAmout", 0)
|
||||
}
|
||||
if (v.totalSeatAmout == null) {
|
||||
this.$set(v, "totalSeatAmout", 0)
|
||||
}
|
||||
if (v.unparkGoodsAmout == null) {
|
||||
this.$set(v, "unparkGoodsAmout", 0)
|
||||
}
|
||||
if (v.useSeatAmout == null) {
|
||||
this.$set(v, "useSeatAmout", 0)
|
||||
}
|
||||
if (v.carStatisticsList != null) {
|
||||
v.carStatisticsList.forEach(e => {
|
||||
this.$set(e, "isShow", false)
|
||||
})
|
||||
}
|
||||
})
|
||||
console.log(this.qyList)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点击车位查看详情
|
||||
clickCar(item) {
|
||||
item.isShow = !item.isShow
|
||||
},
|
||||
// 点击车道
|
||||
toGoPlace() {
|
||||
this.placeTabs = 1;
|
||||
clickLine(item) {
|
||||
this.pyaObj = item
|
||||
this.isCwnum = 1;
|
||||
},
|
||||
// 子组件修改值
|
||||
modifyPlaceTabs(data) {
|
||||
this.placeTabs = data;
|
||||
this.isCwnum = data;
|
||||
},
|
||||
}
|
||||
};
|
||||
|
|
@ -1751,6 +1788,7 @@
|
|||
|
||||
/deep/.tab-pane {
|
||||
width: 100%;
|
||||
height: calc(100vh - 134px);
|
||||
}
|
||||
|
||||
.main {
|
||||
|
|
@ -2450,199 +2488,157 @@
|
|||
}
|
||||
}
|
||||
|
||||
.field {
|
||||
padding: 20px;
|
||||
background-color: #000;
|
||||
// 场位图样式
|
||||
.cwMain {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: calc(100vh - 66px - 68px - 47px);
|
||||
|
||||
.cwLeft {
|
||||
width: 128px;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
overflow: scroll;
|
||||
|
||||
.leftData {
|
||||
width: 116px;
|
||||
height: 42px;
|
||||
text-align: center;
|
||||
line-height: 42px;
|
||||
margin: 4px 6px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #fff;
|
||||
background-color: #0372E0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.cwRight {
|
||||
width: calc(100% - 128px);
|
||||
height: 100%;
|
||||
overflow: scroll;
|
||||
padding-left: 18px;
|
||||
background: #F5F6FA;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 10px;
|
||||
padding: 8px 16px;
|
||||
|
||||
.rightBox {
|
||||
width: calc(33.3% - 10px);
|
||||
height: 214px;
|
||||
border: 1px solid #E1E5ED;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
/deep/.zb_tooltip_content {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.boxTop {
|
||||
display: flex;
|
||||
|
||||
.title {
|
||||
margin-right: 20px;
|
||||
font-size: 18px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.option {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
.carTabs {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
margin-top: 20px;
|
||||
border-radius: 8px;
|
||||
|
||||
/deep/.tab {
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
|
||||
.carList {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 20px;
|
||||
|
||||
.carInfo {
|
||||
width: 19%;
|
||||
padding: 20px;
|
||||
background-color: #ccc;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.partsList {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 20px;
|
||||
|
||||
.partsInfo {
|
||||
width: 19%;
|
||||
padding: 20px;
|
||||
background-color: #ccc;
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.infoTitle {
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.infoNum {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.fpList {
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
height: 32px;
|
||||
border-bottom: 1px solid #E1E5ED;
|
||||
line-height: 32px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 8px;
|
||||
background: #FAFAFA;
|
||||
|
||||
.fpInfo {
|
||||
width: 49%;
|
||||
|
||||
p {
|
||||
font-size: 14px;
|
||||
color: #0D518B;
|
||||
}
|
||||
|
||||
.fpTitle {
|
||||
text-align: center;
|
||||
background: #262626;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
text {
|
||||
font-size: 14px;
|
||||
color: #1677FF;
|
||||
}
|
||||
}
|
||||
|
||||
.fpListInfo {
|
||||
padding: 20px 10px;
|
||||
background: #262626;
|
||||
color: #fff;
|
||||
.boxContent {
|
||||
height: 180px;
|
||||
overflow: scroll;
|
||||
padding: 5px 8px;
|
||||
|
||||
.dataList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
p {
|
||||
margin-right: 10px;
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.boxJd {
|
||||
display: flex;
|
||||
margin-top: 10px;
|
||||
|
||||
.infoTop {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.infoTopTitle {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding-left: 10px;
|
||||
border-left: 5px solid #0079FE;
|
||||
text {
|
||||
margin-left: 10px;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.titleRight {
|
||||
display: flex;
|
||||
/deep/.progress-bar-title {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.titleIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background: #0079FE;
|
||||
margin-left: 5px;
|
||||
line-height: 16px;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
/deep/.bar {
|
||||
height: 8px;
|
||||
margin-top: 5px;
|
||||
width: 240px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/deep/.van-icon {
|
||||
transform: scale(0.8);
|
||||
margin-left: 2px;
|
||||
/deep/.progress-bar .bar-single {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
/deep/.progress-bar .bar-double {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/deep/.progress-bar .bar-interval {
|
||||
width: 0;
|
||||
}
|
||||
|
||||
/deep/.bar-text span {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
text {
|
||||
color: #0079FE;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.infoCarNum {
|
||||
.carUl {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 10px;
|
||||
|
||||
text {
|
||||
margin: 10px 20px;
|
||||
}
|
||||
}
|
||||
.carLi {
|
||||
width: calc(50% - 12px);
|
||||
height: 42px;
|
||||
margin: 8px 12px;
|
||||
margin-left: 0;
|
||||
background: #ffffff;
|
||||
border: 1px solid #e1e5ed;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 12px;
|
||||
line-height: 15px;
|
||||
padding: 4px 8px;
|
||||
|
||||
.progressBox {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.carInfoList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
|
||||
.carBrand {
|
||||
width: 32%;
|
||||
background-color: #2C2D2D;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.brandTitle {
|
||||
color: #0079FE;
|
||||
margin-bottom: 10px;
|
||||
.carTitle {
|
||||
font-size: 12px;
|
||||
color: #1677FF;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.notListInfo {
|
||||
.notTitle {
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin: 30px 0;
|
||||
}
|
||||
|
||||
.infoTop {
|
||||
text {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
text {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.tipInfo {
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
color: #5FE515;
|
||||
font-weight: bold;
|
||||
padding: 20px 0;
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,92 +2,140 @@
|
|||
<view class="place">
|
||||
<view class="placeTop">
|
||||
<view class="topLeft">
|
||||
堆场资源 B3区
|
||||
</view>
|
||||
<view class="topRight">
|
||||
<button @click="back"><text class="back">返回</text></button>
|
||||
<button @click="show"><text class="show">显示</text></button>
|
||||
</view>
|
||||
<view class="showBox" v-if="showType">
|
||||
<view class="showInfo">
|
||||
车道
|
||||
</view>
|
||||
<view class="showInfo">
|
||||
车位
|
||||
<view style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<view class="left" @click="back">
|
||||
<uni-icons type="back" size="16" color="#1677FF" />
|
||||
<text>返回</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
<view class="infoLeft">
|
||||
<text>车位总数：12*15=180车位</text>
|
||||
<text>使用车位：40车位</text>
|
||||
<text>剩余车位：40车位</text>
|
||||
<text>虚拟场位：12车位</text>
|
||||
<text>可停放车辆：12辆</text>
|
||||
<text>已停放车辆：12辆</text>
|
||||
</view>
|
||||
<view class="infoRight">
|
||||
<view class="tipBox">
|
||||
<view style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<view class="right">
|
||||
<view class="statusText">
|
||||
<view class="status kz"></view>
|
||||
<text>空置</text>
|
||||
<view class="colorBox vacant"></view>
|
||||
</view>
|
||||
<view class="tipBox">
|
||||
<view class="statusText">
|
||||
<view class="status sy"></view>
|
||||
<text>使用</text>
|
||||
<view class="colorBox use"></view>
|
||||
</view>
|
||||
<view class="tipBox">
|
||||
<view class="statusText">
|
||||
<view class="status xn"></view>
|
||||
<text>虚拟车位</text>
|
||||
<view class="colorBox virtually"></view>
|
||||
</view>
|
||||
<template v-if="selectValue == 2">
|
||||
<view class="statusText">
|
||||
<image src="../../static/images/wjhIcon.png" mode=""></image>
|
||||
<text>无计划</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeList">
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
01道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType1">
|
||||
<view class="type1Box box1">
|
||||
宝马-轿车 12辆
|
||||
</view>
|
||||
<view class="type1Box box2">
|
||||
奔驰-轿车 12辆
|
||||
</view>
|
||||
<view class="type1Box box3">
|
||||
未使用：5车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
02道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType2">
|
||||
<view class="type2Box">
|
||||
<template v-for="(item, index) in type2List">
|
||||
<view class="type2info"
|
||||
:class="{'type0':item.type == 0, 'type1':item.type == 1, 'type2':item.type == 2}"
|
||||
:key="index">
|
||||
{{item.name}}
|
||||
<view class="statusText">
|
||||
<image src="../../static/images/yjhIcon.png" mode=""></image>
|
||||
<text>有计划</text>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
03道（合计12辆车-13车位）
|
||||
<view class="topRight">
|
||||
<view class="rightImg">
|
||||
<image src="../../static/images/lineImg.png" mode=""></image>
|
||||
</view>
|
||||
<view class="listType3">
|
||||
未使用：5车位
|
||||
<uni-data-select v-model="selectValue" :localdata="selectList" @change="selectChange"></uni-data-select>
|
||||
<uni-icons type="bottom" size="16" color="#1677FF" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
04道（合计12辆车-13车位）
|
||||
<view class="placeText">
|
||||
<text>车位总数：{{lineData.totalSeatAmout}}车位</text>
|
||||
<text>使用车位：{{lineData.useSeatAmout}}车位</text>
|
||||
<text>剩余车位：{{lineData.remainSeatAmout}}车位</text>
|
||||
<text>虚拟场位：{{lineData.virtuaSeatAmout}}车位</text>
|
||||
<text>可停放车辆：{{lineData.unparkGoodsAmout}}辆</text>
|
||||
<text>已停放车辆：{{lineData.stopGoodsAmout}}辆</text>
|
||||
</view>
|
||||
<view class="listType3">
|
||||
未使用：5车位
|
||||
<view class="placeContent" v-if="selectValue == 1">
|
||||
<view class="placeList" style="border: 1px solid #E1E5ED;"
|
||||
v-for="(item,index) in lineData.lineStatisticsList">
|
||||
<view class="listLeft">
|
||||
<template>
|
||||
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}道</p>
|
||||
<text>已停{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}辆</text>
|
||||
</template>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<template v-for="(item2,index2) in item.carLineRespList" @click="showContent(item2)">
|
||||
<view class="rigthContent wsy" :key="index2" v-if="item2.type == '0' || item2.type == '3'">
|
||||
<text>{{item2.carSituation}}</text>
|
||||
</view>
|
||||
<view class="rigthContent sy" :key="index2" v-if="item2.type == '1'">
|
||||
<text v-if="item2.existFlag == '1'"
|
||||
class="gl">{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
<text v-else>{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
</view>
|
||||
<view class="rigthContent xn" :key="index2" v-if="item2.type == '2'">
|
||||
<text v-if="item2.existFlag == '1'"
|
||||
class="gl">{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
<text v-else>{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeContent" v-if="selectValue == 2">
|
||||
<!-- <view class="seatTitle">
|
||||
<view class="titleLeft">
|
||||
车位
|
||||
</view>
|
||||
<view class="titleRight">
|
||||
<p v-for="(item,index) in seatNum" :key="index">
|
||||
<template v-if="item >= 1 && item <= 9">0</template>
|
||||
{{item}}
|
||||
</p>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="placeList" v-for="(item,index) in seatData.seatCarStatisticsList">
|
||||
<view class="listLeft">
|
||||
<template>
|
||||
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}道</p>
|
||||
<text>已停{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}辆</text>
|
||||
</template>
|
||||
</view>
|
||||
<view class="listRightSeat">
|
||||
<template v-for="(item2,index2) in item.carStatisticsList">
|
||||
<view class="seatBox kz" :key="index2" v-if="item2.type == 0">
|
||||
<view class="planIcon">
|
||||
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
|
||||
</image>
|
||||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>空置</p>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
<view class="seatBox sy" :class="{syGl:item2.existFlag == '1'}" :key="index2"
|
||||
v-if="item2.type == 1">
|
||||
<view class="planIcon">
|
||||
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
|
||||
</image>
|
||||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>{{item2.brdName}}</p>
|
||||
<p>{{item2.bvmName}}</p>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
<view class="seatBox xn" :class="{xnGl:item2.existFlag == '1'}" :key="index2"
|
||||
v-if="item2.type == 2">
|
||||
<view class="planIcon">
|
||||
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
|
||||
</image>
|
||||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>{{item2.brdName}}</p>
|
||||
<p>{{item2.bvmName}}</p>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -98,259 +146,390 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
type2List: [{
|
||||
id: "01",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
loginObj: {},
|
||||
selectValue: "1",
|
||||
selectList: [{
|
||||
text: "车道",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
id: "02",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "03",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "04",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "05",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "06",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "07",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "08",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "09",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "10",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "11",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "12",
|
||||
name: "虚拟车位",
|
||||
type: 2,
|
||||
},
|
||||
],
|
||||
showType: false,
|
||||
text: "车位",
|
||||
value: "2",
|
||||
}
|
||||
],
|
||||
lineData: {},
|
||||
seatNum: 0,
|
||||
seatData: {},
|
||||
}
|
||||
},
|
||||
props: {
|
||||
vvyId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
pyaObj: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
},
|
||||
brdId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
bvmId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
potId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
mnfBl: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
this.getLineData()
|
||||
},
|
||||
methods: {
|
||||
// 点击返回
|
||||
back() {
|
||||
this.$emit("modifyPlaceTabs", 0)
|
||||
},
|
||||
// 点击显示
|
||||
show() {
|
||||
this.showType = !this.showType
|
||||
// 点击下拉切换车道车位
|
||||
selectChange(e) {
|
||||
this.selectValue = e
|
||||
if (this.selectValue == 2) {
|
||||
this.getSeatData()
|
||||
}
|
||||
},
|
||||
// 获取车道车辆情况
|
||||
getLineData() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yardGoods/monitor/line/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&bvmId=${this.bvmId}&potId=${this.potId}&mnfBl=${this.mnfBl}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
if (res.data.status == 200) {
|
||||
this.lineData = res.data.data
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取车位车辆情况
|
||||
getSeatData() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yardGoods/monitor/seat/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&bvmId=${this.bvmId}&potId=${this.potId}&mnfBl=${this.mnfBl}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.data.status == 200) {
|
||||
this.seatData = res.data.data
|
||||
console.log(this.seatData)
|
||||
let numList = []
|
||||
this.seatData.seatCarStatisticsList.forEach(v => {
|
||||
numList.push(v.carStatisticsList.length)
|
||||
})
|
||||
this.seatNum = Math.max(...numList)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.place {
|
||||
.placeTop {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
background-color: #F6F7F9;
|
||||
|
||||
.topLeft {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.left {
|
||||
font-size: 14px;
|
||||
color: #1677FF;
|
||||
margin-right: 48px;
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
|
||||
.status {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin-right: 8px;
|
||||
border-radius: 50%;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.statusText {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
margin-right: 20px;
|
||||
|
||||
.kz {
|
||||
background: #EEEEEE;
|
||||
border: 1px solid #DCDCDC;
|
||||
}
|
||||
|
||||
.sy {
|
||||
background: #4476F6;
|
||||
}
|
||||
|
||||
.xn {
|
||||
background: #FF6B3B;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 12px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.topRight {
|
||||
display: flex;
|
||||
|
||||
uni-button {
|
||||
margin-left: 30px;
|
||||
width: 100px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.back {
|
||||
color: #0079FE;
|
||||
}
|
||||
|
||||
.show {
|
||||
color: #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
.showBox {
|
||||
position: absolute;
|
||||
bottom: -102px;
|
||||
right: 25px;
|
||||
border: 1px solid #aaa;
|
||||
|
||||
.showInfo {
|
||||
padding: 20px 30px;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeInfo {
|
||||
padding: 10px 20px;
|
||||
background-color: #fff;
|
||||
.rightImg {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.infoLeft {
|
||||
flex: 2;
|
||||
image {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.uni-icons {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/deep/.uni-stat__select {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
/deep/.uni-select {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/deep/.uniui-clear:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/.uni-select__input-box {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/deep/.uni-select__input-text {
|
||||
color: #1677FF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeText {
|
||||
padding: 10px 16px;
|
||||
width: 100%;
|
||||
background: #E6F4FF;
|
||||
border: 1px solid #BAE0FF;
|
||||
|
||||
text {
|
||||
margin: 10px;
|
||||
margin-right: 0;
|
||||
padding-right: 10px;
|
||||
border-right: 1px solid #aaa;
|
||||
margin-right: 20px;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.infoRight {
|
||||
flex: 1;
|
||||
.placeContent {
|
||||
height: calc(100vh - 234px);
|
||||
overflow: scroll;
|
||||
|
||||
.seatTitle {
|
||||
display: flex;
|
||||
margin-left: 30px;
|
||||
height: 50px;
|
||||
border: 1px solid #E1E5ED;
|
||||
|
||||
.tipBox {
|
||||
.titleLeft {
|
||||
width: 80px;
|
||||
background: #E1E5ED;
|
||||
border: 1px solid #DBDDE3;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
margin: auto;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.colorBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-left: 5px;
|
||||
p {
|
||||
font-size: 14px;
|
||||
color: #0B266A;
|
||||
}
|
||||
}
|
||||
|
||||
.vacant {
|
||||
background-color: #aaa;
|
||||
}
|
||||
.titleRight {
|
||||
width: calc(100% - 80px);
|
||||
display: flex;
|
||||
|
||||
.use {
|
||||
background-color: #0079FE;
|
||||
}
|
||||
|
||||
.virtually {
|
||||
background-color: #F86E56;
|
||||
}
|
||||
p {
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeList {
|
||||
padding: 20px;
|
||||
background-color: #000;
|
||||
|
||||
.listInfo {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
padding-left: 10px;
|
||||
border-left: 5px solid #0079FE;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.listType1 {
|
||||
display: flex;
|
||||
height: 70px;
|
||||
|
||||
.type1Box {
|
||||
.listLeft {
|
||||
width: 80px;
|
||||
background: #E1E5ED;
|
||||
border: 1px solid #DBDDE3;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
height: 100px;
|
||||
|
||||
p {
|
||||
font-size: 14px;
|
||||
color: #0B266A;
|
||||
}
|
||||
|
||||
.box1 {
|
||||
text {
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.listRight {
|
||||
width: calc(100% - 80px);
|
||||
display: flex;
|
||||
padding: 0 12px;
|
||||
gap: 10px;
|
||||
|
||||
.rigthContent {
|
||||
flex: 1;
|
||||
background-color: #0079FE;
|
||||
text-align: center;
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
border: 1px solid #E1E5ED;
|
||||
margin: 7px 0;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.wsy {
|
||||
background: #EEEEEE;
|
||||
}
|
||||
|
||||
.sy {
|
||||
background: rgba(199, 212, 243, 0.8);
|
||||
color: #4476F6;
|
||||
|
||||
.gl {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
background: #4476F6;
|
||||
}
|
||||
}
|
||||
|
||||
.box2 {
|
||||
flex: 1;
|
||||
background-color: #0079FE;
|
||||
color: #fff
|
||||
.xn {
|
||||
background: rgba(253, 98, 98, 0.10);
|
||||
color: #FD6262;
|
||||
|
||||
.gl {
|
||||
color: #fff;
|
||||
background: #FF6B3B;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box3 {
|
||||
flex: 2;
|
||||
.listRightSeat {
|
||||
width: calc(100% - 80px);
|
||||
display: flex;
|
||||
|
||||
.seatBox {
|
||||
border: 1px solid #E1E5ED;
|
||||
min-width: 80px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
|
||||
p {
|
||||
text-align: center;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
p:last-child {
|
||||
color: #828CA7;
|
||||
}
|
||||
|
||||
.planIcon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
image {
|
||||
width: 12px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.kz {
|
||||
background: #F7F9FF;
|
||||
|
||||
p:first-child {
|
||||
width: 70%;
|
||||
margin-left: 15%;
|
||||
padding: 3px 0;
|
||||
background-color: #fff;
|
||||
color: #aaa
|
||||
border: 1px solid #E4E4E4;
|
||||
border-radius: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.listType2 {
|
||||
padding: 10px 0;
|
||||
background-color: #222;
|
||||
.sy {
|
||||
color: #4476F6;
|
||||
background: #D3DDF6;
|
||||
}
|
||||
|
||||
.type2Box {
|
||||
display: flex;
|
||||
|
||||
.type2info {
|
||||
flex: 1;
|
||||
height: 150px;
|
||||
border-radius: 8px;
|
||||
margin: 0 5px;
|
||||
.syGl {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background: #4476F6;
|
||||
}
|
||||
|
||||
.type0 {
|
||||
background-color: #aaa;
|
||||
.xn {
|
||||
color: #FD6262;
|
||||
background: rgba(253, 98, 98, 0.10);
|
||||
}
|
||||
|
||||
.type1 {
|
||||
background-color: #0079FE;
|
||||
.xnGl {
|
||||
color: #fff;
|
||||
background: #FF6B3B;
|
||||
}
|
||||
|
||||
.type2 {
|
||||
background-color: #F86E56;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.listType3 {
|
||||
height: 200px;
|
||||
text-align: center;
|
||||
color: #F86E56;
|
||||
line-height: 200px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
background-color: #aaa;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -65,9 +65,9 @@
|
|||
data() {
|
||||
return {
|
||||
// rtoswuhan1 wuhan_ceshi1
|
||||
account: 'rtoswuhan1',
|
||||
account: '',
|
||||
// q123456
|
||||
password: 'q123456',
|
||||
password: '',
|
||||
// 登录类型 pad
|
||||
mediaType: "pad",
|
||||
// 登录失败提示
|
||||
|
|
@ -216,7 +216,6 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res.data.data)
|
||||
uni.setStorageSync('qxList', res.data.data);
|
||||
},
|
||||
})
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -2,92 +2,140 @@
|
|||
<view class="place">
|
||||
<view class="placeTop">
|
||||
<view class="topLeft">
|
||||
堆场资源 B3区
|
||||
</view>
|
||||
<view class="topRight">
|
||||
<button @click="back"><text class="back">返回</text></button>
|
||||
<button @click="show"><text class="show">显示</text></button>
|
||||
</view>
|
||||
<view class="showBox" v-if="showType">
|
||||
<view class="showInfo">
|
||||
车道
|
||||
</view>
|
||||
<view class="showInfo">
|
||||
车位
|
||||
<view style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<view class="left" @click="back">
|
||||
<uni-icons type="back" size="16" color="#1677FF" />
|
||||
<text>返回</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeInfo">
|
||||
<view class="infoLeft">
|
||||
<text>车位总数：12*15=180车位</text>
|
||||
<text>使用车位：40车位</text>
|
||||
<text>剩余车位：40车位</text>
|
||||
<text>虚拟场位：12车位</text>
|
||||
<text>可停放车辆：12辆</text>
|
||||
<text>已停放车辆：12辆</text>
|
||||
</view>
|
||||
<view class="infoRight">
|
||||
<view class="tipBox">
|
||||
<view style="display: flex; flex-direction: column; justify-content: center;">
|
||||
<view class="right">
|
||||
<view class="statusText">
|
||||
<view class="status kz"></view>
|
||||
<text>空置</text>
|
||||
<view class="colorBox vacant"></view>
|
||||
</view>
|
||||
<view class="tipBox">
|
||||
<view class="statusText">
|
||||
<view class="status sy"></view>
|
||||
<text>使用</text>
|
||||
<view class="colorBox use"></view>
|
||||
</view>
|
||||
<view class="tipBox">
|
||||
<view class="statusText">
|
||||
<view class="status xn"></view>
|
||||
<text>虚拟车位</text>
|
||||
<view class="colorBox virtually"></view>
|
||||
</view>
|
||||
<template v-if="selectValue == 2">
|
||||
<view class="statusText">
|
||||
<image src="../../static/images/wjhIcon.png" mode=""></image>
|
||||
<text>无计划</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeList">
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
01道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType1">
|
||||
<view class="type1Box box1">
|
||||
宝马-轿车 12辆
|
||||
</view>
|
||||
<view class="type1Box box2">
|
||||
奔驰-轿车 12辆
|
||||
</view>
|
||||
<view class="type1Box box3">
|
||||
未使用：5车位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
02道（合计12辆车-13车位）
|
||||
</view>
|
||||
<view class="listType2">
|
||||
<view class="type2Box">
|
||||
<template v-for="(item, index) in type2List">
|
||||
<view class="type2info"
|
||||
:class="{'type0':item.type == 0, 'type1':item.type == 1, 'type2':item.type == 2}"
|
||||
:key="index">
|
||||
{{item.name}}
|
||||
<view class="statusText">
|
||||
<image src="../../static/images/yjhIcon.png" mode=""></image>
|
||||
<text>有计划</text>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
03道（合计12辆车-13车位）
|
||||
<view class="topRight">
|
||||
<view class="rightImg">
|
||||
<image src="../../static/images/lineImg.png" mode=""></image>
|
||||
</view>
|
||||
<view class="listType3">
|
||||
未使用：5车位
|
||||
<uni-data-select v-model="selectValue" :localdata="selectList" @change="selectChange"></uni-data-select>
|
||||
<uni-icons type="bottom" size="16" color="#1677FF" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="listInfo">
|
||||
<view class="title">
|
||||
04道（合计12辆车-13车位）
|
||||
<view class="placeText">
|
||||
<text>车位总数：{{lineData.totalSeatAmout}}车位</text>
|
||||
<text>使用车位：{{lineData.useSeatAmout}}车位</text>
|
||||
<text>剩余车位：{{lineData.remainSeatAmout}}车位</text>
|
||||
<text>虚拟场位：{{lineData.virtuaSeatAmout}}车位</text>
|
||||
<text>可停放车辆：{{lineData.unparkGoodsAmout}}辆</text>
|
||||
<text>已停放车辆：{{lineData.stopGoodsAmout}}辆</text>
|
||||
</view>
|
||||
<view class="listType3">
|
||||
未使用：5车位
|
||||
<view class="placeContent" v-if="selectValue == 1">
|
||||
<view class="placeList" style="border: 1px solid #E1E5ED;"
|
||||
v-for="(item,index) in lineData.lineStatisticsList">
|
||||
<view class="listLeft">
|
||||
<template>
|
||||
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}道</p>
|
||||
<text>已停{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}辆</text>
|
||||
</template>
|
||||
</view>
|
||||
<view class="listRight">
|
||||
<template v-for="(item2,index2) in item.carLineRespList" @click="showContent(item2)">
|
||||
<view class="rigthContent wsy" :key="index2" v-if="item2.type == '0' || item2.type == '3'">
|
||||
<text>{{item2.carSituation}}</text>
|
||||
</view>
|
||||
<view class="rigthContent sy" :key="index2" v-if="item2.type == '1'">
|
||||
<text v-if="item2.existFlag == '1'"
|
||||
class="gl">{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
<text v-else>{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
</view>
|
||||
<view class="rigthContent xn" :key="index2" v-if="item2.type == '2'">
|
||||
<text v-if="item2.existFlag == '1'"
|
||||
class="gl">{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
<text v-else>{{item2.carSituation}}{{item2.carAmout}}辆</text>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="placeContent" v-if="selectValue == 2">
|
||||
<!-- <view class="seatTitle">
|
||||
<view class="titleLeft">
|
||||
车位
|
||||
</view>
|
||||
<view class="titleRight">
|
||||
<p v-for="(item,index) in seatNum" :key="index">
|
||||
<template v-if="item >= 1 && item <= 9">0</template>
|
||||
{{item}}
|
||||
</p>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="placeList" v-for="(item,index) in seatData.seatCarStatisticsList">
|
||||
<view class="listLeft">
|
||||
<template>
|
||||
<p><template v-if="item.yalNo >= 1 && item.yalNo <= 9">0</template>{{item.yalNo}}道</p>
|
||||
<text>已停{{item.stopGoodsAmout}}/{{item.totalSeatAmout}}辆</text>
|
||||
</template>
|
||||
</view>
|
||||
<view class="listRightSeat">
|
||||
<template v-for="(item2,index2) in item.carStatisticsList">
|
||||
<view class="seatBox kz" :key="index2" v-if="item2.type == 0">
|
||||
<view class="planIcon">
|
||||
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
|
||||
</image>
|
||||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>空置</p>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
<view class="seatBox sy" :class="{syGl:item2.existFlag == '1'}" :key="index2"
|
||||
v-if="item2.type == 1">
|
||||
<view class="planIcon">
|
||||
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
|
||||
</image>
|
||||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>{{item2.brdName}}</p>
|
||||
<p>{{item2.bvmName}}</p>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
<view class="seatBox xn" :class="{xnGl:item2.existFlag == '1'}" :key="index2"
|
||||
v-if="item2.type == 2">
|
||||
<view class="planIcon">
|
||||
<image src="../../static/images/yjhIcon.png" mode="" v-if="item2.godStatus == 'P'">
|
||||
</image>
|
||||
<image src="../../static/images/wjhIcon.png" mode="" v-if="item2.godStatus == 'N'">
|
||||
</image>
|
||||
</view>
|
||||
<p>{{item2.brdName}}</p>
|
||||
<p>{{item2.bvmName}}</p>
|
||||
<p><template v-if="item2.yacNo >= 1 && item2.yacNo <= 9">0</template>{{item2.yacNo}}</p>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -98,259 +146,396 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
type2List: [{
|
||||
id: "01",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
loginObj: {},
|
||||
selectValue: "1",
|
||||
selectList: [{
|
||||
text: "车道",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
id: "02",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "03",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "04",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "05",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "06",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "07",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "08",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "09",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "10",
|
||||
name: "空置",
|
||||
type: 0,
|
||||
}, {
|
||||
id: "11",
|
||||
name: "宝马-轿车",
|
||||
type: 1,
|
||||
}, {
|
||||
id: "12",
|
||||
name: "虚拟车位",
|
||||
type: 2,
|
||||
},
|
||||
],
|
||||
showType: false,
|
||||
text: "车位",
|
||||
value: "2",
|
||||
}
|
||||
],
|
||||
lineData: {},
|
||||
seatNum: 0,
|
||||
seatData: {},
|
||||
}
|
||||
},
|
||||
props: {
|
||||
vvyId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
pyaObj: {
|
||||
type: Object,
|
||||
default: () => {}
|
||||
},
|
||||
brdId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
potId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
mnfBl: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
vinCode: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
},
|
||||
workId: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
this.getLineData()
|
||||
},
|
||||
methods: {
|
||||
// 点击返回
|
||||
back() {
|
||||
this.$emit("modifyPlaceTabs", 0)
|
||||
},
|
||||
// 点击显示
|
||||
show() {
|
||||
this.showType = !this.showType
|
||||
// 点击下拉切换车道车位
|
||||
selectChange(e) {
|
||||
this.selectValue = e
|
||||
if (this.selectValue == 2) {
|
||||
this.getSeatData()
|
||||
}
|
||||
},
|
||||
// 获取车道车辆情况
|
||||
getLineData() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yardGoods/monitor/line/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&bvmId=${this.bvmId}&potId=${this.potId}&vinCode=${this.vinCode}$workStatuss=${this.workId}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
if (res.data.status == 200) {
|
||||
this.lineData = res.data.data
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取车位车辆情况
|
||||
getSeatData() {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/yardGoods/monitor/seat/statistics?displayFlag=1&vvyId=${this.vvyId}&pyaId=${this.pyaObj.pyaId}&brdId=${this.brdId}&bvmId=${this.bvmId}&potId=${this.potId}&vinCode=${this.vinCode}$workStatuss=${this.workId}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.data.status == 200) {
|
||||
this.seatData = res.data.data
|
||||
console.log(this.seatData)
|
||||
let numList = []
|
||||
this.seatData.seatCarStatisticsList.forEach(v => {
|
||||
numList.push(v.carStatisticsList.length)
|
||||
})
|
||||
this.seatNum = Math.max(...numList)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.place {
|
||||
margin-top: 68px;
|
||||
|
||||
.placeTop {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
padding: 12px 16px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
background-color: #F6F7F9;
|
||||
|
||||
.topLeft {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.left {
|
||||
font-size: 14px;
|
||||
color: #1677FF;
|
||||
margin-right: 48px;
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
|
||||
.status {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin-right: 8px;
|
||||
border-radius: 50%;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.statusText {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
margin-right: 20px;
|
||||
|
||||
.kz {
|
||||
background: #EEEEEE;
|
||||
border: 1px solid #DCDCDC;
|
||||
}
|
||||
|
||||
.sy {
|
||||
background: #4476F6;
|
||||
}
|
||||
|
||||
.xn {
|
||||
background: #FF6B3B;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 12px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.topRight {
|
||||
display: flex;
|
||||
|
||||
uni-button {
|
||||
margin-left: 30px;
|
||||
width: 100px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.back {
|
||||
color: #0079FE;
|
||||
}
|
||||
|
||||
.show {
|
||||
color: #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
.showBox {
|
||||
position: absolute;
|
||||
bottom: -102px;
|
||||
right: 25px;
|
||||
border: 1px solid #aaa;
|
||||
|
||||
.showInfo {
|
||||
padding: 20px 30px;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeInfo {
|
||||
padding: 10px 20px;
|
||||
background-color: #fff;
|
||||
.rightImg {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.infoLeft {
|
||||
flex: 2;
|
||||
image {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.uni-icons {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/deep/.uni-stat__select {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
/deep/.uni-select {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/deep/.uniui-clear:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/deep/.uni-select__input-box {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/deep/.uni-select__input-text {
|
||||
color: #1677FF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeText {
|
||||
padding: 10px 16px;
|
||||
width: 100%;
|
||||
background: #E6F4FF;
|
||||
border: 1px solid #BAE0FF;
|
||||
|
||||
text {
|
||||
margin: 10px;
|
||||
margin-right: 0;
|
||||
padding-right: 10px;
|
||||
border-right: 1px solid #aaa;
|
||||
margin-right: 20px;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.infoRight {
|
||||
flex: 1;
|
||||
.placeContent {
|
||||
height: calc(100vh - 234px);
|
||||
overflow: scroll;
|
||||
|
||||
.seatTitle {
|
||||
display: flex;
|
||||
margin-left: 30px;
|
||||
height: 50px;
|
||||
border: 1px solid #E1E5ED;
|
||||
|
||||
.tipBox {
|
||||
.titleLeft {
|
||||
width: 80px;
|
||||
background: #E1E5ED;
|
||||
border: 1px solid #DBDDE3;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
margin: auto;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.colorBox {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-left: 5px;
|
||||
p {
|
||||
font-size: 14px;
|
||||
color: #0B266A;
|
||||
}
|
||||
}
|
||||
|
||||
.vacant {
|
||||
background-color: #aaa;
|
||||
}
|
||||
.titleRight {
|
||||
width: calc(100% - 80px);
|
||||
display: flex;
|
||||
|
||||
.use {
|
||||
background-color: #0079FE;
|
||||
}
|
||||
|
||||
.virtually {
|
||||
background-color: #F86E56;
|
||||
}
|
||||
p {
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeList {
|
||||
padding: 20px;
|
||||
background-color: #000;
|
||||
|
||||
.listInfo {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
padding-left: 10px;
|
||||
border-left: 5px solid #0079FE;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.listType1 {
|
||||
display: flex;
|
||||
height: 70px;
|
||||
|
||||
.type1Box {
|
||||
.listLeft {
|
||||
width: 80px;
|
||||
background: #E1E5ED;
|
||||
border: 1px solid #DBDDE3;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
height: 100px;
|
||||
|
||||
p {
|
||||
font-size: 14px;
|
||||
color: #0B266A;
|
||||
}
|
||||
|
||||
.box1 {
|
||||
text {
|
||||
font-size: 12px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.listRight {
|
||||
width: calc(100% - 80px);
|
||||
display: flex;
|
||||
padding: 0 12px;
|
||||
gap: 10px;
|
||||
|
||||
.rigthContent {
|
||||
flex: 1;
|
||||
background-color: #0079FE;
|
||||
text-align: center;
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
border: 1px solid #E1E5ED;
|
||||
margin: 7px 0;
|
||||
font-size: 14px;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.wsy {
|
||||
background: #EEEEEE;
|
||||
}
|
||||
|
||||
.sy {
|
||||
background: rgba(199, 212, 243, 0.8);
|
||||
color: #4476F6;
|
||||
|
||||
.gl {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
background: #4476F6;
|
||||
}
|
||||
}
|
||||
|
||||
.box2 {
|
||||
flex: 1;
|
||||
background-color: #0079FE;
|
||||
color: #fff
|
||||
.xn {
|
||||
background: rgba(253, 98, 98, 0.10);
|
||||
color: #FD6262;
|
||||
|
||||
.gl {
|
||||
color: #fff;
|
||||
background: #FF6B3B;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box3 {
|
||||
flex: 2;
|
||||
.listRightSeat {
|
||||
width: calc(100% - 80px);
|
||||
display: flex;
|
||||
|
||||
.seatBox {
|
||||
border: 1px solid #E1E5ED;
|
||||
min-width: 80px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
|
||||
p {
|
||||
text-align: center;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
p:last-child {
|
||||
color: #828CA7;
|
||||
}
|
||||
|
||||
.planIcon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
image {
|
||||
width: 12px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.kz {
|
||||
background: #F7F9FF;
|
||||
|
||||
p:first-child {
|
||||
width: 70%;
|
||||
margin-left: 15%;
|
||||
padding: 3px 0;
|
||||
background-color: #fff;
|
||||
color: #aaa
|
||||
border: 1px solid #E4E4E4;
|
||||
border-radius: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.listType2 {
|
||||
padding: 10px 0;
|
||||
background-color: #222;
|
||||
.sy {
|
||||
color: #4476F6;
|
||||
background: #D3DDF6;
|
||||
}
|
||||
|
||||
.type2Box {
|
||||
display: flex;
|
||||
|
||||
.type2info {
|
||||
flex: 1;
|
||||
height: 150px;
|
||||
border-radius: 8px;
|
||||
margin: 0 5px;
|
||||
.syGl {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
background: #4476F6;
|
||||
}
|
||||
|
||||
.type0 {
|
||||
background-color: #aaa;
|
||||
.xn {
|
||||
color: #FD6262;
|
||||
background: rgba(253, 98, 98, 0.10);
|
||||
}
|
||||
|
||||
.type1 {
|
||||
background-color: #0079FE;
|
||||
.xnGl {
|
||||
color: #fff;
|
||||
background: #FF6B3B;
|
||||
}
|
||||
|
||||
.type2 {
|
||||
background-color: #F86E56;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.listType3 {
|
||||
height: 200px;
|
||||
text-align: center;
|
||||
color: #F86E56;
|
||||
line-height: 200px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
background-color: #aaa;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -431,7 +431,6 @@
|
|||
success: (res) => {
|
||||
if (res.statusCode == 200) {
|
||||
this.infoData = res.data.data
|
||||
console.log(this.infoData)
|
||||
// 获取板车照片
|
||||
this.bcPhoto = this.infoData.boardCarPhotos
|
||||
this.infoData.boardCarPhotos.forEach(v => {
|
||||
|
|
@ -749,7 +748,7 @@
|
|||
// 修改残损
|
||||
togoCs() {
|
||||
let obj = {
|
||||
imgUrl: this.hzzsImg
|
||||
imgUrl: this.zsBase
|
||||
}
|
||||
const params = encodeURIComponent(JSON.stringify(obj));
|
||||
uni.navigateTo({
|
||||
|
|
|
|||
|
|
@ -468,6 +468,7 @@
|
|||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.leftHead {
|
||||
font-size: 16px;
|
||||
|
|
|
|||
|
|
@ -48,10 +48,30 @@
|
|||
// 获取传递的对象参数，使用decodeURIComponent解码，并转为对象
|
||||
this.imgUrl = JSON.parse(decodeURIComponent(options.params)).imgUrl
|
||||
}
|
||||
this.init()
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
if (this.imgUrl == "") {
|
||||
this.handleReset()
|
||||
} else {
|
||||
this.initImg(this.imgUrl)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initImg(name) {
|
||||
uni.request({
|
||||
url: `${this.$local}/api/file/url/?fileName=${name}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${this.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.statusCode == 200) {
|
||||
this.imgUrl = res.data
|
||||
this.init(this.imgUrl)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
init() {
|
||||
let that = this
|
||||
that.ctx = uni.createCanvasContext('mycanvas', that); //创建绘图对象
|
||||
|
|
@ -145,20 +165,7 @@
|
|||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.statusCode == 200) {
|
||||
uni.request({
|
||||
url: `${that.$local}/api/file/url/?fileName=${res.data.data[0].ptrDesc}`,
|
||||
header: {
|
||||
'Content-Type': 'application/json', //自定义请求头信息
|
||||
'Authorization': `Bearer ${that.loginObj.access_token}`
|
||||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
if (res.statusCode == 200) {
|
||||
that.imgUrl = res.data
|
||||
that.init()
|
||||
}
|
||||
}
|
||||
})
|
||||
that.initImg(res.data.data[0].ptrDesc)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -109,6 +109,14 @@
|
|||
current: 1,
|
||||
}
|
||||
},
|
||||
onBackPress(options) {
|
||||
// 触发返回就会调用此方法，这里实现的是禁用物理返回，顶部导航栏的自定义返回 uni.navigateBack 仍可使用
|
||||
if (options.from == 'backbutton') {
|
||||
return true;
|
||||
} else if (options.from == 'navigateBack') {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loginObj = uni.getStorageSync('loginObj')
|
||||
this.portObj = uni.getStorageSync('portObj')
|
||||
|
|
@ -204,7 +212,6 @@
|
|||
},
|
||||
method: 'GET', //请求方式，必须为大写
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.total = res.data.data.total
|
||||
this.itemList = res.data.data.records
|
||||
}
|
||||
|
|
|
|||
|
|
@ -185,7 +185,7 @@
|
|||
let sql = `DELETE FROM abnormalConditionRespList WHERE vacId = '${this.abnormalRow.vacId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.abnormalRow.vacId)) {
|
||||
if (reg.test(this.abnormalRow.vacId) == false) {
|
||||
this.delCtIds.push(this.abnormalRow.vacId)
|
||||
uni.setStorageSync('delCtIds', this.delCtIds);
|
||||
}
|
||||
|
|
@ -340,11 +340,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,37 +3,112 @@
|
|||
<head-view :title="title" url="/pages/shipWork/documentList"></head-view>
|
||||
<view class="container contentFixed">
|
||||
<view class="topBox">
|
||||
<view class="searchBox">
|
||||
<view class="leftInput">
|
||||
<uni-easyinput suffixIcon="search" v-model="searchValue" placeholder="品牌/提单号"
|
||||
@iconClick="iconClick"></uni-easyinput>
|
||||
<text @tap="screen">筛选</text>
|
||||
<fjj-condition ref='condition' @touchmove.stop :color="color" :list="menuList"
|
||||
:defaultValue="defaultValue" @result="resultConditon" />
|
||||
</view>
|
||||
<text @click="screen">筛选</text>
|
||||
</view>
|
||||
<uni-drawer ref="showRight" mode="right" :mask-click="false">
|
||||
<view class="scroll-view">
|
||||
<scroll-view class="scroll-view-box" scroll-y="true">
|
||||
<view class="drawerTop" @click="back">
|
||||
<image src="../../static/images/leftJt.png" mode=""></image>
|
||||
<text>返回</text>
|
||||
</view>
|
||||
<view class="drawerTitle">
|
||||
型号
|
||||
</view>
|
||||
<view class="selectBox">
|
||||
<view class="boxContent" v-for="(item,index) in modelList" :key="index"
|
||||
:class="{active:activeIndex == index}" @click="clickModel(item,index)">
|
||||
{{item.text}}
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="listInfo.length > 0">
|
||||
<view class="drawerTitle">
|
||||
品牌
|
||||
</view>
|
||||
<superwei-combox :candidates="brdList" :isJSON="true" keyName="text" placeholder="请选择品牌"
|
||||
v-model="brdName" @select="brdSelect"></superwei-combox>
|
||||
<view class="drawerTitle">
|
||||
车型
|
||||
</view>
|
||||
<superwei-combox :candidates="bvmList" :isJSON="true" keyName="text" placeholder="请选择车型"
|
||||
v-model="bvmName" @select="bvmSelect"></superwei-combox>
|
||||
<view class="drawerTitle">
|
||||
港口
|
||||
</view>
|
||||
<superwei-combox :candidates="potList" :isJSON="true" keyName="text" placeholder="请选择车型"
|
||||
v-model="potName" @select="potSelect"></superwei-combox>
|
||||
<view class="drawerTitle">
|
||||
重量
|
||||
</view>
|
||||
<view class="qjBox">
|
||||
<uni-easyinput v-model="minTon" class="input" type="number"></uni-easyinput>
|
||||
<text>吨</text>
|
||||
<text> - </text>
|
||||
<uni-easyinput v-model="maxTon" class="input" type="number"></uni-easyinput>
|
||||
<text>吨</text>
|
||||
</view>
|
||||
<view class="drawerTitle">
|
||||
宽
|
||||
</view>
|
||||
<view class="qjBox">
|
||||
<uni-easyinput v-model="minWidth" class="input" type="number"></uni-easyinput>
|
||||
<text>m</text>
|
||||
<text> - </text>
|
||||
<uni-easyinput v-model="maxWidth" class="input" type="number"></uni-easyinput>
|
||||
<text>m</text>
|
||||
</view>
|
||||
<view class="drawerTitle">
|
||||
高
|
||||
</view>
|
||||
<view class="qjBox">
|
||||
<uni-easyinput v-model="minHeight" class="input" type="number"></uni-easyinput>
|
||||
<text>m</text>
|
||||
<text> - </text>
|
||||
<uni-easyinput v-model="maxHeight" class="input" type="number"></uni-easyinput>
|
||||
<text>m</text>
|
||||
</view>
|
||||
<view class="bottomBtn">
|
||||
<view class="btn czBtn" @click="reset">
|
||||
重置
|
||||
</view>
|
||||
<view class="btn qrBtn" @click="confirm">
|
||||
确认
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
<template v-if=" listInfo.length> 0">
|
||||
<view class="ul">
|
||||
<view class="li" v-for="(item,index) in listInfo" :key="index" @click="togoCar(item)">
|
||||
<p class="title">品牌：{{item.brdName}}</p>
|
||||
<view class="liTitle">
|
||||
<image class="titleImg" src="../../static/images/zlIcon.png" mode="widthFix">
|
||||
</image>
|
||||
<p>品牌：{{item.brdName}}</p>
|
||||
</view>
|
||||
<view class="liContent">
|
||||
<p>提单号：{{item.mnfBl}}</p>
|
||||
<p>源类型：{{item.sourceType}}</p>
|
||||
<p>场位：{{item.yardPos}}</p>
|
||||
<p>数量：{{item.amount}}</p>
|
||||
<p>航次：{{item.vvyName}}</p>
|
||||
<p>港口：{{item.potName}}</p>
|
||||
<p>报关状态：{{item.customsDeclareStatus}}</p>
|
||||
<p>车型：{{item.bvmName}}</p>
|
||||
<p>数量：{{item.amount}}</p>
|
||||
<p>港口：{{item.potName}}</p>
|
||||
<p>报关单号：{{item.customsDeclareNo}}</p>
|
||||
<p>车型明细：{{item.bvdName}}</p>
|
||||
<p>货代：{{item.agentName}}</p>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pageBox" v-if="total > 0">
|
||||
<uni-pagination :show-icon="true" :total="total" :pageSize="pageSize" :current="current"
|
||||
@change="changePage" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<o-empty v-else height="70vh" bg="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -41,19 +116,47 @@
|
|||
|
||||
<script>
|
||||
import sqlite from "../../common/sqlite.js"
|
||||
import api from "../../common/api.js"
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: "船名 - 品牌明细",
|
||||
searchValue: "",
|
||||
color: '#4D7BFE',
|
||||
hasChoose: false,
|
||||
menuList: [],
|
||||
defaultValue: {},
|
||||
listInfo: [],
|
||||
allList: [],
|
||||
vtpId: "",
|
||||
|
||||
// 抽屉内容
|
||||
// 型号
|
||||
modelId: "",
|
||||
modelName: "",
|
||||
modelList: [],
|
||||
activeIndex: -1,
|
||||
// 品牌
|
||||
brdId: "",
|
||||
brdName: "",
|
||||
brdList: [],
|
||||
// 车型
|
||||
bvmId: "",
|
||||
bvmName: "",
|
||||
bvmList: [],
|
||||
// 港口
|
||||
potId: "",
|
||||
potName: "",
|
||||
potList: [],
|
||||
// 最小吨
|
||||
minTon: "",
|
||||
// 最大吨
|
||||
maxTon: "",
|
||||
// 最小宽度
|
||||
minWidth: "",
|
||||
// 最大宽度
|
||||
maxWidth: "",
|
||||
// 最小高度
|
||||
minHeight: "",
|
||||
// 最大高度
|
||||
maxHeight: "",
|
||||
|
||||
// 分页
|
||||
total: 0,
|
||||
pageSize: 3,
|
||||
|
|
@ -66,125 +169,6 @@
|
|||
this.vtpId = uni.getStorageSync('vtpId')
|
||||
this.executeSql1('shipmentShipLoadPlansRespList')
|
||||
this.executeSql1('shipInfoTable')
|
||||
setTimeout(() => {
|
||||
this.menuList = [{
|
||||
'title': '按港口',
|
||||
'type': 'custom',
|
||||
'key': 'custom1',
|
||||
'isMutiple': true, //多选
|
||||
'detailList': [{
|
||||
title: '港口1',
|
||||
value: "1",
|
||||
isSelected: true
|
||||
}, {
|
||||
title: '港口2',
|
||||
value: "2",
|
||||
}, {
|
||||
title: '港口3',
|
||||
value: "3",
|
||||
}, {
|
||||
title: '港口4',
|
||||
value: "4",
|
||||
}, {
|
||||
title: '港口5',
|
||||
value: "5",
|
||||
}, {
|
||||
title: '港口6',
|
||||
value: "6",
|
||||
}],
|
||||
}, {
|
||||
'title': '按车型',
|
||||
'type': 'custom',
|
||||
'key': 'custom2',
|
||||
'isMutiple': true, //多选
|
||||
'detailList': [{
|
||||
title: '车型1',
|
||||
value: "1",
|
||||
}, {
|
||||
title: '车型2',
|
||||
value: "2",
|
||||
}, {
|
||||
title: '车型3',
|
||||
value: "3",
|
||||
}, {
|
||||
title: '车型4',
|
||||
value: "4",
|
||||
}, {
|
||||
title: '车型5',
|
||||
value: "5",
|
||||
}, {
|
||||
title: '车型6',
|
||||
value: "6",
|
||||
}, {
|
||||
title: '车型7',
|
||||
value: "7",
|
||||
}],
|
||||
}, {
|
||||
'title': '按品牌',
|
||||
'type': 'custom',
|
||||
'key': 'custom3',
|
||||
'isMutiple': true, //多选
|
||||
'detailList': [{
|
||||
title: '品牌1',
|
||||
value: "1",
|
||||
}, {
|
||||
title: '品牌2',
|
||||
value: "2",
|
||||
}, {
|
||||
title: '品牌3',
|
||||
value: "3",
|
||||
}, {
|
||||
title: '品牌4',
|
||||
value: "4",
|
||||
}, {
|
||||
title: '品牌5',
|
||||
value: "5",
|
||||
}, {
|
||||
title: '品牌6',
|
||||
value: "6",
|
||||
}],
|
||||
}, {
|
||||
'title': '按型号',
|
||||
'type': 'custom',
|
||||
'key': 'custom4',
|
||||
'isMutiple': true, //多选
|
||||
'detailList': [{
|
||||
title: '型号1',
|
||||
value: "1",
|
||||
}, {
|
||||
title: '型号2',
|
||||
value: "2",
|
||||
}, {
|
||||
title: '型号3',
|
||||
value: "3",
|
||||
}, {
|
||||
title: '型号4',
|
||||
value: "4",
|
||||
}, {
|
||||
title: '型号5',
|
||||
value: "5",
|
||||
}, {
|
||||
title: '型号6',
|
||||
value: "6",
|
||||
}],
|
||||
}, {
|
||||
'title': '单选',
|
||||
'type': 'custom',
|
||||
'key': 'custom5',
|
||||
'isMutiple': false, //单选
|
||||
'detailList': [{
|
||||
title: '选项1',
|
||||
value: "1",
|
||||
}, {
|
||||
title: '选项2',
|
||||
value: "2",
|
||||
}],
|
||||
}, ]
|
||||
this.defaultValue = {
|
||||
custom1: ['1'],
|
||||
custom5: 1,
|
||||
};
|
||||
}, 2000)
|
||||
},
|
||||
methods: {
|
||||
// 查
|
||||
|
|
@ -195,10 +179,83 @@
|
|||
if (tableName == "shipInfoTable") {
|
||||
this.shipInfo = value[0]
|
||||
} else {
|
||||
console.log(value)
|
||||
this.allList = value
|
||||
this.total = value.length
|
||||
let newArr = this.getMapping(value, this.pageSize)
|
||||
this.listInfo = newArr[this.current - 1];
|
||||
this.listInfo.forEach(v => {
|
||||
if (v.brdName == "null") {
|
||||
this.$set(v, "brdName", "-")
|
||||
}
|
||||
if (v.mnfBl == "null") {
|
||||
this.$set(v, "mnfBl", "-")
|
||||
}
|
||||
if (v.sourceType == "null") {
|
||||
this.$set(v, "sourceType", "-")
|
||||
}
|
||||
if (v.yardPos == "null") {
|
||||
this.$set(v, "yardPos", "-")
|
||||
}
|
||||
if (v.vvyName == "null") {
|
||||
this.$set(v, "vvyName", "-")
|
||||
}
|
||||
if (v.customsDeclareStatus == "null") {
|
||||
this.$set(v, "customsDeclareStatus", "-")
|
||||
}
|
||||
if (v.bvmName == "null") {
|
||||
this.$set(v, "bvmName", "-")
|
||||
}
|
||||
if (v.amount == "null") {
|
||||
this.$set(v, "amount", "-")
|
||||
}
|
||||
if (v.potName == "null") {
|
||||
this.$set(v, "potName", "-")
|
||||
}
|
||||
if (v.customsDeclareNo == "null") {
|
||||
this.$set(v, "customsDeclareNo", "-")
|
||||
}
|
||||
if (v.bvdName == "null") {
|
||||
this.$set(v, "bvdName", "-")
|
||||
}
|
||||
if (v.agentName == "null") {
|
||||
this.$set(v, "agentName", "-")
|
||||
}
|
||||
})
|
||||
this.allList.forEach(v => {
|
||||
// 型号
|
||||
if (v.model != "null") {
|
||||
this.modelList.push({
|
||||
id: v.model,
|
||||
text: v.model
|
||||
})
|
||||
}
|
||||
// 品牌
|
||||
if (v.brdId != "null" && v.brdName != "null") {
|
||||
this.brdList.push({
|
||||
id: v.brdId,
|
||||
text: v.brdName
|
||||
})
|
||||
}
|
||||
// 车型
|
||||
if (v.bvmId != "null" && v.bvmName != "null") {
|
||||
this.bvmList.push({
|
||||
id: v.bvmId,
|
||||
text: v.bvmName
|
||||
})
|
||||
}
|
||||
// 港口
|
||||
if (v.potId != "null" && v.potName != "null") {
|
||||
this.potList.push({
|
||||
id: v.potId,
|
||||
text: v.potName
|
||||
})
|
||||
}
|
||||
})
|
||||
this.modelList = api.arrFrom(this.modelList, "text")
|
||||
this.brdList = api.arrFrom(this.brdList, "text")
|
||||
this.bvmList = api.arrFrom(this.bvmList, "text")
|
||||
this.potList = api.arrFrom(this.potList, "text")
|
||||
}
|
||||
}).catch((error) => {
|
||||
// 在reject时执行的回调函数
|
||||
|
|
@ -236,7 +293,8 @@
|
|||
newArr.push(this.allList[v])
|
||||
})
|
||||
this.listInfo = newArr
|
||||
this.total = 0
|
||||
} else {
|
||||
this.listInfo = []
|
||||
}
|
||||
} else {
|
||||
this.executeSql1('shipmentShipLoadPlansRespList')
|
||||
|
|
@ -244,17 +302,61 @@
|
|||
},
|
||||
// 点击筛选
|
||||
screen() {
|
||||
this.$refs.condition.visibleDrawer = true;
|
||||
this.$refs.showRight.open();
|
||||
},
|
||||
resultConditon(obj) {
|
||||
this.$refs.condition.visibleDrawer = false;
|
||||
this.hasChoose = obj.hasChoose;
|
||||
// 返回
|
||||
back() {
|
||||
this.$refs.showRight.close();
|
||||
},
|
||||
// 点击型号
|
||||
clickModel(item, index) {
|
||||
this.activeIndex = index
|
||||
},
|
||||
// 品牌下拉
|
||||
brdSelect(e) {
|
||||
this.brdId = e.id
|
||||
this.brdName = e.text
|
||||
},
|
||||
// 车型下拉
|
||||
bvmSelect(e) {
|
||||
this.bvmId = e.id
|
||||
this.bvmName = e.text
|
||||
},
|
||||
// 港口下拉
|
||||
potSelect(e) {
|
||||
this.potId = e.id
|
||||
this.potName = e.text
|
||||
},
|
||||
// 重置
|
||||
reset() {
|
||||
this.modelId = ""
|
||||
this.modelName = ""
|
||||
this.activeIndex = -1
|
||||
this.brdId = ""
|
||||
this.brdName = ""
|
||||
this.bvmId = ""
|
||||
this.bvmName = ""
|
||||
this.potId = ""
|
||||
this.potName = ""
|
||||
this.minTon = ""
|
||||
this.maxTon = ""
|
||||
this.minWidth = ""
|
||||
this.maxWidth = ""
|
||||
this.minHeight = ""
|
||||
this.maxHeight = ""
|
||||
},
|
||||
// 确认
|
||||
confirm() {
|
||||
this.$refs.showRight.close();
|
||||
},
|
||||
// 跳转车型明细
|
||||
togoCar(item) {
|
||||
uni.setStorageSync('brandRow', item);
|
||||
let obj = {
|
||||
id: item.webId,
|
||||
}
|
||||
const params = encodeURIComponent(JSON.stringify(obj));
|
||||
uni.navigateTo({
|
||||
url: `/pages/shipWork/carDetails`
|
||||
url: `/pages/shipWork/carDetails?params=${params}`
|
||||
})
|
||||
},
|
||||
}
|
||||
|
|
@ -264,44 +366,189 @@
|
|||
<style lang="less" scoped>
|
||||
.brandDetails {
|
||||
.container {
|
||||
padding: 30px 20px;
|
||||
background-color: #fff;
|
||||
padding-bottom: 30px;
|
||||
background-color: #F6F7F9;
|
||||
|
||||
.topBox {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
justify-content: space-between;
|
||||
background: #FAFAFA;
|
||||
border-top: 1px solid #EEEEEE;
|
||||
border-bottom: 1px solid #EEEEEE;
|
||||
padding: 5px 10px;
|
||||
|
||||
.searchBox {
|
||||
width: 33%;
|
||||
display: flex;
|
||||
.leftInput {
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
/deep/.uni-easyinput {
|
||||
width: 400px;
|
||||
|
||||
/deep/.content-clear-icon {
|
||||
padding-right: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.is-input-border {
|
||||
border-radius: 18.5px;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-left: 10px;
|
||||
margin-right: 10px;
|
||||
color: #2979ff;
|
||||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.uni-drawer__content {
|
||||
width: 500px;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
/* #ifndef APP-NVUE */
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/* #endif */
|
||||
flex: 1
|
||||
}
|
||||
|
||||
// 处理抽屉内容滚动
|
||||
.scroll-view-box {
|
||||
flex: 1;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 0 16px;
|
||||
|
||||
.drawerTop {
|
||||
display: flex;
|
||||
margin-top: 55px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
image {
|
||||
width: 14px;
|
||||
height: 24px;
|
||||
margin-right: 16px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
text {
|
||||
font-size: 20px;
|
||||
color: #23262E;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.drawerTitle {
|
||||
font-size: 14px;
|
||||
color: #23262E;
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
.selectBox {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.boxContent {
|
||||
width: 76px;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #EEEEEE;
|
||||
color: #23262E;
|
||||
line-height: 14px;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: rgba(0, 103, 207, .05);
|
||||
color: #0267CF;
|
||||
}
|
||||
}
|
||||
|
||||
.qjBox {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
/deep/.uni-easyinput {
|
||||
width: 96px;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
/deep/.uni-easyinput__content {
|
||||
width: 96px;
|
||||
}
|
||||
|
||||
text {
|
||||
line-height: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
.bottomBtn {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 12px 16px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0 -3px 7px 0 rgba(0, 0, 0, 0.10);
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
|
||||
.btn {
|
||||
width: 116px;
|
||||
height: 36px;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.czBtn {
|
||||
color: #0067CF;
|
||||
border: 1px solid #0067CF;
|
||||
}
|
||||
|
||||
.qrBtn {
|
||||
color: #fff;
|
||||
background: #0067CF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ul {
|
||||
padding: 20px 0;
|
||||
padding: 16px;
|
||||
|
||||
.li {
|
||||
background-color: #fff;
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
|
||||
.liTitle {
|
||||
display: flex;
|
||||
font-size: 16px;
|
||||
color: #23262E;
|
||||
font-weight: bold;
|
||||
|
||||
.titleImg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 5px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.liContent {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #ccc;
|
||||
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
p {
|
||||
width: 22%;
|
||||
|
|
@ -312,4 +559,5 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -3,31 +3,106 @@
|
|||
<head-view :title="title" url="/pages/shipWork/brandDetails"></head-view>
|
||||
<view class="container contentFixed">
|
||||
<view class="ul">
|
||||
<view class="li">船名：{{testInfo.vslCnname}}</view>
|
||||
<view class="li">航次：{{testInfo.vvyName}}</view>
|
||||
<view class="li">贸易类型：{{testInfo.tradeType}}</view>
|
||||
<view class="li">进出口：{{testInfo.importExportFlag}}</view>
|
||||
<view class="li">港口：{{testInfo.potName}}</view>
|
||||
<view class="li">提单号：{{testInfo.mnfBl}}</view>
|
||||
<view class="li">报关状态：{{testInfo.customsDeclareStatus}}</view>
|
||||
<view class="li">报关单号：{{testInfo.customsDeclareNo}}</view>
|
||||
<view class="li">货代：{{testInfo.agentName}}</view>
|
||||
<view class="li">联系人：{{testInfo.consignee}}</view>
|
||||
<view class="li">联系方式：{{testInfo.telephone}}</view>
|
||||
<view class="li">品牌：{{testInfo.brdName}}</view>
|
||||
<view class="li">车型：{{testInfo.bvmName}}</view>
|
||||
<view class="li">车型明细：{{testInfo.bvdName}}</view>
|
||||
<view class="li">型号：{{testInfo.model}}</view>
|
||||
<view class="li">源类型：{{testInfo.sourceType}}</view>
|
||||
<view class="li">数量：{{testInfo.amount}}</view>
|
||||
<view class="li">车长：{{testInfo.carLength}}</view>
|
||||
<view class="li">车宽：{{testInfo.carWidth}}</view>
|
||||
<view class="li">车高：{{testInfo.carHeight}}</view>
|
||||
<view class="li">重量：{{testInfo.weight}}</view>
|
||||
<view class="li">体积：{{testInfo.volume}}</view>
|
||||
<view class="li">单票数量：{{testInfo.ticketGtpks}}</view>
|
||||
<view class="li">单票重量：{{testInfo.ticketWeight}}</view>
|
||||
<view class="li">单票体积：{{testInfo.ticketVolume}}</view>
|
||||
<view class="li">船名：
|
||||
<text v-if="workDetails.vslCnname == 'null'">-</text>
|
||||
<text v-else>{{workDetails.vslCnname}}</text>
|
||||
</view>
|
||||
<view class="li">航次：
|
||||
<text v-if="workDetails.vvyName == 'null'">-</text>
|
||||
<text v-else>{{workDetails.vvyName}}</text>
|
||||
</view>
|
||||
<view class="li">贸易类型：
|
||||
<text v-if="workDetails.tradeTypeNm == 'null'">-</text>
|
||||
<text v-else>{{workDetails.tradeTypeNm}}</text>
|
||||
</view>
|
||||
<view class="li">进出口：
|
||||
<text v-if="workDetails.ieFgNm == 'null'">-</text>
|
||||
<text v-else>{{workDetails.ieFgNm}}</text>
|
||||
</view>
|
||||
<view class="li">港口：
|
||||
<text v-if="workDetails.potName == 'null'">-</text>
|
||||
<text v-else>{{workDetails.potName}}</text>
|
||||
</view>
|
||||
<view class="li">提单号：
|
||||
<text v-if="workDetails.mnfBl == 'null'">-</text>
|
||||
<text v-else>{{workDetails.mnfBl}}</text>
|
||||
</view>
|
||||
<view class="li">报关状态：
|
||||
<text v-if="workDetails.customsDeclareStatus == 'null'">-</text>
|
||||
<text v-else>{{workDetails.customsDeclareStatus}}</text>
|
||||
</view>
|
||||
<view class="li">报关单号：
|
||||
<text v-if="workDetails.customsDeclareNo == 'null'">-</text>
|
||||
<text v-else>{{workDetails.customsDeclareNo}}</text>
|
||||
</view>
|
||||
<view class="li">货代：
|
||||
<text v-if="workDetails.agentName == 'null'">-</text>
|
||||
<text v-else>{{workDetails.agentName}}</text>
|
||||
</view>
|
||||
<view class="li">联系人：
|
||||
<text v-if="workDetails.consignee == 'null'">-</text>
|
||||
<text v-else>{{workDetails.consignee}}</text>
|
||||
</view>
|
||||
<view class="li">联系方式：
|
||||
<text v-if="workDetails.telephone == 'null'">-</text>
|
||||
<text v-else>{{workDetails.telephone}}</text>
|
||||
</view>
|
||||
<view class="li">品牌：
|
||||
<text v-if="workDetails.brdName == 'null'">-</text>
|
||||
<text v-else>{{workDetails.brdName}}</text>
|
||||
</view>
|
||||
<view class="li">车型：
|
||||
<text v-if="workDetails.bvmName == 'null'">-</text>
|
||||
<text v-else>{{workDetails.bvmName}}</text>
|
||||
</view>
|
||||
<view class="li">车型明细：
|
||||
<text v-if="workDetails.bvdName == 'null'">-</text>
|
||||
<text v-else>{{workDetails.bvdName}}</text>
|
||||
</view>
|
||||
<view class="li">型号：
|
||||
<text v-if="workDetails.model == 'null'">-</text>
|
||||
<text v-else>{{workDetails.model}}</text>
|
||||
</view>
|
||||
<view class="li">源类型：
|
||||
<text v-if="workDetails.sourceType == 'null'">-</text>
|
||||
<text v-else>{{workDetails.sourceType}}</text>
|
||||
</view>
|
||||
<view class="li">数量：
|
||||
<text v-if="workDetails.amount == 'null'">-</text>
|
||||
<text v-else>{{workDetails.amount}}</text>
|
||||
</view>
|
||||
<view class="li">车长：
|
||||
<text v-if="workDetails.carLength == 'null'">-</text>
|
||||
<text v-else>{{workDetails.carLength}}</text>
|
||||
</view>
|
||||
<view class="li">车宽：
|
||||
<text v-if="workDetails.carWidth == 'null'">-</text>
|
||||
<text v-else>{{workDetails.carWidth}}</text>
|
||||
</view>
|
||||
<view class="li">车高：
|
||||
<text v-if="workDetails.carHeight == 'null'">-</text>
|
||||
<text v-else>{{workDetails.carHeight}}</text>
|
||||
</view>
|
||||
<view class="li">重量：
|
||||
<text v-if="workDetails.weight == 'null'">-</text>
|
||||
<text v-else>{{workDetails.weight}}</text>
|
||||
</view>
|
||||
<view class="li">体积：
|
||||
<text v-if="workDetails.volume == 'null'">-</text>
|
||||
<text v-else>{{workDetails.volume}}</text>
|
||||
</view>
|
||||
<view class="li">单票数量：
|
||||
<text v-if="workDetails.ticketGtpks == 'null'">-</text>
|
||||
<text v-else>{{workDetails.ticketGtpks}}</text>
|
||||
</view>
|
||||
<view class="li">单票重量：
|
||||
<text v-if="workDetails.ticketWeight == 'null'">-</text>
|
||||
<text v-else>{{workDetails.ticketWeight}}</text>
|
||||
</view>
|
||||
<view class="li">单票体积：
|
||||
<text v-if="workDetails.ticketVolume == 'null'">-</text>
|
||||
<text v-else>{{workDetails.ticketVolume}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tableInfo">
|
||||
<view class="title">车架号明细</view>
|
||||
|
|
@ -37,8 +112,8 @@
|
|||
<uni-th align="center">车架号/条形码</uni-th>
|
||||
<uni-th align="center">场位</uni-th>
|
||||
</uni-tr>
|
||||
<uni-tr v-for="(item, index) in testInfo.vinCodeDetails" :key="index">
|
||||
<uni-td align="center">{{ item.godId }}</uni-td>
|
||||
<uni-tr v-for="(item, index) in vinCodeDetails" :key="index">
|
||||
<uni-td align="center">{{ index + 1 }}</uni-td>
|
||||
<uni-td align="center">{{item.vinCode}}</uni-td>
|
||||
<uni-td align="center">{{ item.yardPos }}</uni-td>
|
||||
</uni-tr>
|
||||
|
|
@ -57,35 +132,8 @@
|
|||
data() {
|
||||
return {
|
||||
title: "船名 - 车型明细",
|
||||
testInfo: {
|
||||
vslCnname: "运程10",
|
||||
vvyName: "HC97759809",
|
||||
tradeType: "外贸",
|
||||
importExportFlag: "进口",
|
||||
potName: "巴塞罗那",
|
||||
mnfBl: "TD6955975087",
|
||||
customsDeclareStatus: "未报关",
|
||||
customsDeclareNo: "TD6955975087",
|
||||
agentName: "上海海通国际汽车物流有限公司",
|
||||
consignee: "张星星",
|
||||
telephone: "13266688888",
|
||||
brdName: "特斯拉",
|
||||
bvmName: "轿车",
|
||||
bvdName: "轿车",
|
||||
model: "STAY-CONNECTB",
|
||||
sourceType: "新能源",
|
||||
amount: "199",
|
||||
carLength: "199",
|
||||
carWidth: "199",
|
||||
carHeight: "199",
|
||||
weight: "1978",
|
||||
volume: "1978",
|
||||
ticketGtpks: "100",
|
||||
ticketWeight: "979",
|
||||
ticketVolume: "979",
|
||||
vinCodeDetails: []
|
||||
},
|
||||
barndRow: {},
|
||||
workDetails: {},
|
||||
vinCodeDetails: [],
|
||||
loading: false,
|
||||
// 每页数据量
|
||||
pageSize: 3,
|
||||
|
|
@ -93,16 +141,20 @@
|
|||
pageCurrent: 1,
|
||||
// 数据总量
|
||||
total: 0,
|
||||
|
||||
id: "",
|
||||
vtpId: "",
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.id = JSON.parse(decodeURIComponent(options.params)).id
|
||||
},
|
||||
mounted() {
|
||||
let title = uni.getStorageSync('shipWorkTitle')
|
||||
this.title = `${title} / 车型明细 `
|
||||
this.vtpId = uni.getStorageSync('vtpId')
|
||||
this.initData()
|
||||
this.executeSql1('shipInfoTable')
|
||||
this.executeSql2('workQueryDetails')
|
||||
this.executeSql2('vinCodeDetails')
|
||||
},
|
||||
methods: {
|
||||
// 查
|
||||
|
|
@ -116,31 +168,26 @@
|
|||
console.error(error);
|
||||
});
|
||||
},
|
||||
// 查
|
||||
executeSql2(tableName) {
|
||||
let sql = `select * from ${tableName} WHERE contactId = '${this.id}'`
|
||||
sqlite.executeSqlCeshi(sql).then((value) => {
|
||||
// 在resolve时执行的回调函数
|
||||
if (tableName == 'workQueryDetails') {
|
||||
this.workDetails = value[0]
|
||||
} else {
|
||||
this.total = value.length
|
||||
this.vinCodeDetails = value
|
||||
this.initData()
|
||||
}
|
||||
}).catch((error) => {
|
||||
// 在reject时执行的回调函数
|
||||
console.error(error);
|
||||
});
|
||||
},
|
||||
initData() {
|
||||
this.testInfo.vinCodeDetails = [{
|
||||
godId: "01",
|
||||
spdId: "",
|
||||
vinCode: "CJH67892734895917",
|
||||
yardPos: "A1-09-03",
|
||||
}, {
|
||||
godId: "02",
|
||||
spdId: "",
|
||||
vinCode: "CJH67892734895917",
|
||||
yardPos: "A1-09-03",
|
||||
}, {
|
||||
godId: "03",
|
||||
spdId: "",
|
||||
vinCode: "CJH67892734895917",
|
||||
yardPos: "A1-09-03",
|
||||
}, {
|
||||
godId: "04",
|
||||
spdId: "",
|
||||
vinCode: "CJH67892734895917",
|
||||
yardPos: "A1-09-03",
|
||||
}]
|
||||
this.total = this.testInfo.vinCodeDetails.length
|
||||
let newArr = this.getMapping(this.testInfo.vinCodeDetails, this.pageSize)
|
||||
this.testInfo.vinCodeDetails = newArr[this.pageCurrent - 1];
|
||||
let newArr = this.getMapping(this.vinCodeDetails, this.pageSize)
|
||||
this.vinCodeDetails = newArr[this.pageCurrent - 1];
|
||||
},
|
||||
// 点击分页
|
||||
pageChange(e) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<view class="documentList">
|
||||
<head-view :title="title" :type="true" url="/pages/shipWork/index"></head-view>
|
||||
<head-view :title="title" :type="true" url="/pages/shipWork/index" @isPreview="isPreview"></head-view>
|
||||
<!-- <uni-notice-bar show-icon single :text="noticeText" style="margin-top: 68px;" /> -->
|
||||
<view class="container">
|
||||
<view class="workBox">
|
||||
|
|
@ -140,6 +140,9 @@
|
|||
this.getTableStauts()
|
||||
},
|
||||
methods: {
|
||||
isPreview(e) {
|
||||
this.title = e
|
||||
},
|
||||
getTableStauts() {
|
||||
this.infoList.forEach((v, index) => {
|
||||
this.executeSql(v.tableName)
|
||||
|
|
|
|||
|
|
@ -234,7 +234,7 @@
|
|||
delAllData() {
|
||||
console.log('批量删除数据');
|
||||
this.allList.forEach(v => {
|
||||
let sql = `delete from ${v};`
|
||||
let sql = `delete from ${v} WHERE vtpId = '341a92f3c9ae3d4d228561d84984a1fb';`
|
||||
this.executeSql(sql)
|
||||
})
|
||||
uni.setStorageSync('delSrmIds', []);
|
||||
|
|
@ -242,7 +242,7 @@
|
|||
},
|
||||
dropTable() {
|
||||
console.log('删除表');
|
||||
let sql = 'DROP TABLE workSignTable;'
|
||||
let sql = 'DROP TABLE workQueryDetails;'
|
||||
this.executeSql(sql)
|
||||
},
|
||||
dropData() {
|
||||
|
|
@ -314,7 +314,6 @@
|
|||
},
|
||||
// 船名航次下拉选项
|
||||
select_json(e) {
|
||||
console.log(e)
|
||||
this.vvyId = e.vvyId
|
||||
this.vvyName = e.vvyName
|
||||
this.spmId = e.spmId
|
||||
|
|
@ -674,23 +673,43 @@
|
|||
let sql =
|
||||
`insert into shipmentShipLoadPlansRespList values('${v.splId}','${this.vtpId}','${v.agentId}','${v.agentName}',
|
||||
'${v.amount}','${v.brdId}','${v.brdName}','${v.bvdId}','${v.bvdName}','${v.bvmId}','${v.bvmName}',
|
||||
'${v.carHeight}','${v.carLength}','${v.carWidth}','${v.customsDeclareNo}','${v.customsDeclareStatus}',
|
||||
'${v.mnfBl}','${v.potId}','${v.potName}','${v.sourceType}','${v.vvyId}','${v.vvyName}','${v.yardPos}',
|
||||
'${webStatus}','${v.createTime}')`
|
||||
'${v.carHeight}','${v.carLength}','${v.carWidth}','${v.consignee}','${v.customsDeclareNo}',
|
||||
'${v.customsDeclareStatus}','${v.ieFg}','${v.ieFgNm}','${v.mnfBl}','${v.model}',
|
||||
'${v.potId}','${v.potName}','${v.sourceType}','${v.sourceTypeNm}','${v.spmId}',
|
||||
'${v.telephone}','${v.ticketGtpks}','${v.ticketVolume}','${v.ticketWeight}','${v.tradeType}',
|
||||
'${v.tradeTypeNm}','${v.volume}','${v.vslCnname}',
|
||||
'${v.vvyId}','${v.vvyName}','${v.weight}',
|
||||
'${v.yardPos}','${webStatus}','${v.createTime}')`
|
||||
this.executeSql(sql)
|
||||
if (v.workQueryDetails != null) {
|
||||
let sql2 =
|
||||
`insert into workQueryDetails values('${v.workQueryDetails.splId}','${this.vtpId}',${v.splId}','${v.workQueryDetails.agentId}',
|
||||
'${v.workQueryDetails.agentName}','${v.workQueryDetails.amount}','${v.workQueryDetails.brdId}','${v.workQueryDetails.brdName}',
|
||||
'${v.workQueryDetails.bvdId}','${v.workQueryDetails.bvdName}','${v.workQueryDetails.bvmId}','${v.workQueryDetails.bvmName}',
|
||||
`insert into workQueryDetails values('${v.workQueryDetails.splId}','${this.vtpId}','${v.splId}',
|
||||
'${v.workQueryDetails.agentId}',
|
||||
'${v.workQueryDetails.agentName}','${v.workQueryDetails.amount}','${v.workQueryDetails.brdId}',
|
||||
'${v.workQueryDetails.brdName}',
|
||||
'${v.workQueryDetails.bvdId}','${v.workQueryDetails.bvdName}','${v.workQueryDetails.bvmId}',
|
||||
'${v.workQueryDetails.bvmName}',
|
||||
'${v.workQueryDetails.carHeight}','${v.workQueryDetails.carLength}','${v.workQueryDetails.carWidth}',
|
||||
'${v.workQueryDetails.consignee}','${v.workQueryDetails.customsDeclareNo}','${v.workQueryDetails.customsDeclareStatus}',
|
||||
'${v.workQueryDetails.importExportFlag}','${v.workQueryDetails.mnfBl}','${v.workQueryDetails.model}',
|
||||
'${v.workQueryDetails.consignee}','${v.workQueryDetails.customsDeclareNo}',
|
||||
'${v.workQueryDetails.customsDeclareStatus}',
|
||||
'${v.workQueryDetails.ieFg}','${v.workQueryDetails.ieFgNm}','${v.workQueryDetails.mnfBl}',
|
||||
'${v.workQueryDetails.model}',
|
||||
'${v.workQueryDetails.potId}','${v.workQueryDetails.potName}','${v.workQueryDetails.sourceType}',
|
||||
'${v.workQueryDetails.sourceTypeNm}',
|
||||
'${v.workQueryDetails.spmId}','${v.workQueryDetails.telephone}','${v.workQueryDetails.ticketGtpks}',
|
||||
'${v.workQueryDetails.ticketVolume}','${v.workQueryDetails.ticketWeight}','${v.workQueryDetails.tradeType}',
|
||||
'${v.workQueryDetails.ticketVolume}','${v.workQueryDetails.ticketWeight}',
|
||||
'${v.workQueryDetails.tradeType}','${v.workQueryDetails.tradeTypeNm}','${v.workQueryDetails.volume}',
|
||||
'${v.workQueryDetails.vslCnname}','${v.workQueryDetails.vvyId}',
|
||||
'${v.workQueryDetails.vvyName}','${v.workQueryDetails.weight}','${v.workQueryDetails.yardPos}',
|
||||
'${webStatus}','${v.createTime}')`
|
||||
this.executeSql(sql2)
|
||||
v.workQueryDetails.vinCodeDetails.forEach(e => {
|
||||
let sql3 = `insert into vinCodeDetails values('${e.spdId}','${this.vtpId}','${e.splId}','${e.godId}',
|
||||
'${e.storeArea}','${e.storeLine}','${e.storeSeat}','${e.vinCode}','${e.yacId}','${e.yardId}',
|
||||
'${e.yardName}','${e.yardPos}',
|
||||
'${webStatus}','${v.createTime}')`
|
||||
this.executeSql(sql3)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -993,6 +1012,23 @@
|
|||
that.workSignTable = value
|
||||
} else if (tableName == 'evaluateTable') {
|
||||
that.evaluateTable = value
|
||||
that.evaluateTable.forEach(v => {
|
||||
if (v.evaluate == "null") {
|
||||
that.$set(v, "evaluate", null)
|
||||
}
|
||||
if (v.evaluate2 == "null") {
|
||||
that.$set(v, "evaluate2", null)
|
||||
}
|
||||
if (v.evaluate3 == "null") {
|
||||
that.$set(v, "evaluate3", null)
|
||||
}
|
||||
if (v.evaluate4 == "null") {
|
||||
that.$set(v, "evaluate4", null)
|
||||
}
|
||||
if (v.remake == "null") {
|
||||
that.$set(v, "remake", null)
|
||||
}
|
||||
})
|
||||
}
|
||||
}).catch((error) => {
|
||||
// 在reject时执行的回调函数
|
||||
|
|
|
|||
|
|
@ -250,7 +250,7 @@
|
|||
let sql = `DELETE FROM mafiListRespList WHERE smlId = '${this.mafiRow.smlId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.mafiRow.smlId)) {
|
||||
if (reg.test(this.mafiRow.smlId) == false) {
|
||||
this.delMfIds.push(this.mafiRow.smlId)
|
||||
uni.setStorageSync('delMfIds', this.delMfIds);
|
||||
}
|
||||
|
|
@ -397,11 +397,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -656,7 +656,6 @@
|
|||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -168,7 +168,7 @@
|
|||
let sql = `DELETE FROM shipmentLoadUnloadNoticeRespList WHERE sluId = '${this.noticeRow.sluId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.noticeRow.sluId)) {
|
||||
if (reg.test(this.noticeRow.sluId) == false) {
|
||||
this.delLnIds.push(this.noticeRow.sluId)
|
||||
uni.setStorageSync('delLnIds', this.delLnIds);
|
||||
}
|
||||
|
|
@ -302,11 +302,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -252,7 +252,7 @@
|
|||
let sql = `DELETE FROM shipmentQualityConsultationRespList WHERE vqcId = '${this.opinionRow.vqcId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.opinionRow.vqcId)) {
|
||||
if (reg.test(this.opinionRow.vqcId) == false) {
|
||||
this.delCsIds.push(this.opinionRow.vqcId)
|
||||
uni.setStorageSync('delCsIds', this.delCsIds);
|
||||
}
|
||||
|
|
@ -389,11 +389,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -342,12 +342,6 @@
|
|||
})
|
||||
}
|
||||
}
|
||||
|
||||
console.log(that.startTime)
|
||||
console.log(that.endTime)
|
||||
// this.datetime = e;
|
||||
// this.startTime = this.datetime[0]
|
||||
// this.endTime = this.datetime[1]
|
||||
},
|
||||
// 取消
|
||||
cancel() {
|
||||
|
|
@ -360,7 +354,7 @@
|
|||
let sql = `DELETE FROM messageRespList WHERE pmeId = '${this.peopleRow.pmeId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.peopleRow.pmeId)) {
|
||||
if (reg.test(this.peopleRow.pmeId) == false) {
|
||||
this.delPmIds.push(this.peopleRow.pmeId)
|
||||
uni.setStorageSync('delPmIds', this.delPmIds);
|
||||
}
|
||||
|
|
@ -505,11 +499,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1170,6 +1170,13 @@
|
|||
},
|
||||
// 保存
|
||||
save() {
|
||||
if (this.hcValue == "" || this.zxValue == "") {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
showCancel: false,
|
||||
content: '请输入必填项！'
|
||||
})
|
||||
} else {
|
||||
let date = new Date().getTime()
|
||||
let contactId = this.shipInfo.webId
|
||||
let webStatus = "0"
|
||||
|
|
@ -1368,6 +1375,7 @@
|
|||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
executeSql(sql) {
|
||||
sqlite.executeSqlCeshi(sql).then((value) => {
|
||||
|
|
|
|||
|
|
@ -199,7 +199,7 @@
|
|||
<view class="btnList">
|
||||
<van-button type="default" @click="cancel">取消</van-button>
|
||||
<template v-if="status == 0 || status == 4 || status == 5 || status == 'null'">
|
||||
<van-button type="danger" @click="del">删除</van-button>
|
||||
<!-- <van-button type="danger" @click="del">删除</van-button> -->
|
||||
<van-button type="info" @click="edit('edit')">编辑</van-button>
|
||||
</template>
|
||||
</view>
|
||||
|
|
@ -341,7 +341,7 @@
|
|||
uni.setStorageSync('tabsType', 1)
|
||||
this.dataInfo.forEach(v => {
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(v.webId)) {
|
||||
if (reg.test(v.webId) == false) {
|
||||
this.delSwmIds.push(v.webId)
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -249,7 +249,7 @@
|
|||
let sql = `DELETE FROM shipmentShipSupplyRespList WHERE sssId = '${this.supplyRow.sssId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.supplyRow.sssId)) {
|
||||
if (reg.test(this.supplyRow.sssId) == false) {
|
||||
this.delSsIds.push(this.supplyRow.sssId)
|
||||
uni.setStorageSync('delSsIds', this.delSsIds);
|
||||
}
|
||||
|
|
@ -388,11 +388,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -270,7 +270,7 @@
|
|||
let sql = `DELETE FROM attachUnmoorRespList WHERE sauId = '${this.untieRow.sauId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.untieRow.sauId)) {
|
||||
if (reg.test(this.untieRow.sauId) == false) {
|
||||
this.delSauIds.push(this.untieRow.sauId)
|
||||
uni.setStorageSync('delSauIds', this.delSauIds);
|
||||
}
|
||||
|
|
@ -410,11 +410,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -300,7 +300,7 @@
|
|||
let sql = `DELETE FROM shipmentAdviserLayoutRespList WHERE altId = '${this.assignRow.altId}';`
|
||||
this.executeSql(sql)
|
||||
let reg = RegExp(/-/)
|
||||
if (reg.test(this.assignRow.altId)) {
|
||||
if (reg.test(this.assignRow.altId) == false) {
|
||||
this.delAlIds.push(this.assignRow.altId)
|
||||
uni.setStorageSync('delAlIds', this.delAlIds);
|
||||
}
|
||||
|
|
@ -440,11 +440,17 @@
|
|||
}
|
||||
|
||||
.btnList {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 80px;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
/deep/ .van-button {
|
||||
margin: 30px 20px;
|
||||
margin: 15px 20px;
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 764 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 717 B |
Binary file not shown.
|
After Width: | Height: | Size: 776 B |
|
|
@ -0,0 +1,13 @@
|
|||
## 1.2.1（2021-11-22）
|
||||
- 修复 vue3中个别scss变量无法找到的问题
|
||||
## 1.2.0（2021-11-19）
|
||||
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
|
||||
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-drawer](https://uniapp.dcloud.io/component/uniui/uni-drawer)
|
||||
## 1.1.1（2021-07-30）
|
||||
- 优化 vue3下事件警告的问题
|
||||
## 1.1.0（2021-07-13）
|
||||
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
|
||||
## 1.0.7（2021-05-12）
|
||||
- 新增 组件示例地址
|
||||
## 1.0.6（2021-02-04）
|
||||
- 调整为uni_modules目录规范
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
// #ifdef H5
|
||||
export default {
|
||||
name: 'Keypress',
|
||||
props: {
|
||||
disable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
const keyNames = {
|
||||
esc: ['Esc', 'Escape'],
|
||||
tab: 'Tab',
|
||||
enter: 'Enter',
|
||||
space: [' ', 'Spacebar'],
|
||||
up: ['Up', 'ArrowUp'],
|
||||
left: ['Left', 'ArrowLeft'],
|
||||
right: ['Right', 'ArrowRight'],
|
||||
down: ['Down', 'ArrowDown'],
|
||||
delete: ['Backspace', 'Delete', 'Del']
|
||||
}
|
||||
const listener = ($event) => {
|
||||
if (this.disable) {
|
||||
return
|
||||
}
|
||||
const keyName = Object.keys(keyNames).find(key => {
|
||||
const keyName = $event.key
|
||||
const value = keyNames[key]
|
||||
return value === keyName || (Array.isArray(value) && value.includes(keyName))
|
||||
})
|
||||
if (keyName) {
|
||||
// 避免和其他按键事件冲突
|
||||
setTimeout(() => {
|
||||
this.$emit(keyName, {})
|
||||
}, 0)
|
||||
}
|
||||
}
|
||||
document.addEventListener('keyup', listener)
|
||||
// this.$once('hook:beforeDestroy', () => {
|
||||
// document.removeEventListener('keyup', listener)
|
||||
// })
|
||||
},
|
||||
render: () => {}
|
||||
}
|
||||
// #endif
|
||||
|
|
@ -0,0 +1,183 @@
|
|||
<template>
|
||||
<view v-if="visibleSync" :class="{ 'uni-drawer--visible': showDrawer }" class="uni-drawer" @touchmove.stop.prevent="clear">
|
||||
<view class="uni-drawer__mask" :class="{ 'uni-drawer__mask--visible': showDrawer && mask }" @tap="close('mask')" />
|
||||
<view class="uni-drawer__content" :class="{'uni-drawer--right': rightMode,'uni-drawer--left': !rightMode, 'uni-drawer__content--visible': showDrawer}" :style="{width:drawerWidth+'px'}">
|
||||
<slot />
|
||||
</view>
|
||||
<!-- #ifdef H5 -->
|
||||
<keypress @esc="close('mask')" />
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef H5
|
||||
import keypress from './keypress.js'
|
||||
// #endif
|
||||
/**
|
||||
* Drawer 抽屉
|
||||
* @description 抽屉侧滑菜单
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=26
|
||||
* @property {Boolean} mask = [true | false] 是否显示遮罩
|
||||
* @property {Boolean} maskClick = [true | false] 点击遮罩是否关闭
|
||||
* @property {Boolean} mode = [left | right] Drawer 滑出位置
|
||||
* @value left 从左侧滑出
|
||||
* @value right 从右侧侧滑出
|
||||
* @property {Number} width 抽屉的宽度 ，仅 vue 页面生效
|
||||
* @event {Function} close 组件关闭时触发事件
|
||||
*/
|
||||
export default {
|
||||
name: 'UniDrawer',
|
||||
components: {
|
||||
// #ifdef H5
|
||||
keypress
|
||||
// #endif
|
||||
},
|
||||
emits:['change'],
|
||||
props: {
|
||||
/**
|
||||
* 显示模式（左、右），只在初始化生效
|
||||
*/
|
||||
mode: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
/**
|
||||
* 蒙层显示状态
|
||||
*/
|
||||
mask: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
/**
|
||||
* 遮罩是否可点击关闭
|
||||
*/
|
||||
maskClick:{
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
/**
|
||||
* 抽屉宽度
|
||||
*/
|
||||
width: {
|
||||
type: Number,
|
||||
default: 220
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visibleSync: false,
|
||||
showDrawer: false,
|
||||
rightMode: false,
|
||||
watchTimer: null,
|
||||
drawerWidth: 220
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// #ifndef APP-NVUE
|
||||
this.drawerWidth = this.width
|
||||
// #endif
|
||||
this.rightMode = this.mode === 'right'
|
||||
},
|
||||
methods: {
|
||||
clear(){},
|
||||
close(type) {
|
||||
// fixed by mehaotian 抽屉尚未完全关闭或遮罩禁止点击时不触发以下逻辑
|
||||
if((type === 'mask' && !this.maskClick) || !this.visibleSync) return
|
||||
this._change('showDrawer', 'visibleSync', false)
|
||||
},
|
||||
open() {
|
||||
// fixed by mehaotian 处理重复点击打开的事件
|
||||
if(this.visibleSync) return
|
||||
this._change('visibleSync', 'showDrawer', true)
|
||||
},
|
||||
_change(param1, param2, status) {
|
||||
this[param1] = status
|
||||
if (this.watchTimer) {
|
||||
clearTimeout(this.watchTimer)
|
||||
}
|
||||
this.watchTimer = setTimeout(() => {
|
||||
this[param2] = status
|
||||
this.$emit('change',status)
|
||||
}, status ? 50 : 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$uni-mask: rgba($color: #000000, $alpha: 0.4) ;
|
||||
// 抽屉宽度
|
||||
$drawer-width: 220px;
|
||||
|
||||
.uni-drawer {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.uni-drawer__content {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: $drawer-width;
|
||||
bottom: 0;
|
||||
background-color: $uni-bg-color;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.uni-drawer--left {
|
||||
left: 0;
|
||||
/* #ifdef APP-NVUE */
|
||||
transform: translateX(-$drawer-width);
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
transform: translateX(-100%);
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-drawer--right {
|
||||
right: 0;
|
||||
/* #ifdef APP-NVUE */
|
||||
transform: translateX($drawer-width);
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
transform: translateX(100%);
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-drawer__content--visible {
|
||||
transform: translateX(0px);
|
||||
}
|
||||
|
||||
|
||||
.uni-drawer__mask {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background-color: $uni-mask;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
.uni-drawer__mask--visible {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
/* #endif */
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
{
|
||||
"id": "uni-drawer",
|
||||
"displayName": "uni-drawer 抽屉",
|
||||
"version": "1.2.1",
|
||||
"description": "抽屉式导航，用于展示侧滑菜单，侧滑导航。",
|
||||
"keywords": [
|
||||
"uni-ui",
|
||||
"uniui",
|
||||
"drawer",
|
||||
"抽屉",
|
||||
"侧滑导航"
|
||||
],
|
||||
"repository": "https://github.com/dcloudio/uni-ui",
|
||||
"engines": {
|
||||
"HBuilderX": ""
|
||||
},
|
||||
"directories": {
|
||||
"example": "../../temps/example_temps"
|
||||
},
|
||||
"dcloudext": {
|
||||
"category": [
|
||||
"前端组件",
|
||||
"通用组件"
|
||||
],
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": ["uni-scss"],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "y"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
},
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
|
||||
|
||||
## Drawer 抽屉
|
||||
> **组件名：uni-drawer**
|
||||
> 代码块： `uDrawer`
|
||||
|
||||
抽屉侧滑菜单。
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-drawer)
|
||||
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
## 1.0.11（2023-01-29）
|
||||
优化点击，加入点击自己再次点击也会关闭
|
||||
## 1.0.10（2023-01-17）
|
||||
优化
|
||||
## 1.0.9（2023-01-17）
|
||||
增加注释
|
||||
## 1.0.8（2022-08-18）
|
||||
优化细节
|
||||
## 1.0.67（2022-05-09）
|
||||
修复安卓报错
|
||||
## 1.0.6（2022-05-07）
|
||||
修改默认展示
|
||||
## 1.0.5（2022-04-28）
|
||||
进行优化
|
||||
## 1.0.4（2022-04-27）
|
||||
进行优化
|
||||
## 1.0.3（2022-04-25）
|
||||
去掉多余得注释
|
||||
## 1.0.2（2022-04-25）
|
||||
增加自定义主题颜色
|
||||
## 1.0.1（2022-04-25）
|
||||
进行优化显示
|
||||
## 1.0.0（2022-04-24）
|
||||
初始化
|
||||
|
|
@ -0,0 +1,290 @@
|
|||
<template>
|
||||
<view class="zb-tooltip" :style="{
|
||||
'--theme-bg-color':color
|
||||
}">
|
||||
<view class="zb_tooltip_content" @click.stop="handleClick">
|
||||
<slot></slot>
|
||||
<view class="zb_tooltip__popper"
|
||||
@click.stop="()=>{}"
|
||||
:style="[style,{
|
||||
visibility:isShow?'visible':'hidden',
|
||||
color:color==='white'?'':'#fff',
|
||||
boxShadow: color==='white'?'0 3px 6px -4px #0000001f, 0 6px 16px #00000014, 0 9px 28px 8px #0000000d':''
|
||||
}]" >
|
||||
<slot name="content">{{content}}</slot>
|
||||
<view class="zb_popper__icon" :style="[arrowStyle]" :class="[{
|
||||
'zb_popper__up':placement.indexOf('bottom')===0,
|
||||
'zb_popper__arrow':placement.indexOf('top')===0,
|
||||
'zb_popper__right':placement.indexOf('right')===0,
|
||||
'zb_popper__left':placement.indexOf('left')===0,
|
||||
}]">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
visible:Boolean,
|
||||
color:{
|
||||
type:String,
|
||||
default:'#303133',
|
||||
},
|
||||
placement:{
|
||||
type:String,
|
||||
default:'top',
|
||||
},
|
||||
content:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
show:{
|
||||
type:Boolean,
|
||||
default:false,
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
isShow :this.visible,
|
||||
title: 'Hello',
|
||||
arrowLeft:0,
|
||||
query:null,
|
||||
style:{
|
||||
|
||||
},
|
||||
arrowStyle:{}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
watch:{
|
||||
isShow:{
|
||||
handler(val){
|
||||
this.$emit('update:visible', val)
|
||||
},
|
||||
immediate:true,
|
||||
},
|
||||
visible:{
|
||||
handler(val){
|
||||
if(val){
|
||||
this.$nextTick(()=>{
|
||||
this.getPosition()
|
||||
})
|
||||
}
|
||||
this.isShow = val
|
||||
},
|
||||
immediate:true,
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
// #ifdef H5
|
||||
window.addEventListener('click',()=>{
|
||||
this.isShow = false
|
||||
})
|
||||
// #endif
|
||||
this.getPosition()
|
||||
},
|
||||
methods: {
|
||||
close(){
|
||||
this.isShow = false
|
||||
},
|
||||
fixedWrap(){
|
||||
this.isShow = false
|
||||
},
|
||||
async handleClick(){
|
||||
if(this.isShow){
|
||||
return this.isShow = false
|
||||
}
|
||||
await this.getPosition()
|
||||
this.isShow = true
|
||||
},
|
||||
getPosition(){
|
||||
return new Promise((resolve) => {
|
||||
uni.createSelectorQuery().in(this).selectAll('.zb_tooltip_content,.zb_tooltip__popper').boundingClientRect(async (data)=>{
|
||||
let {left,bottom,right,top,width,height} = data[0]
|
||||
let obj1 = data[1]
|
||||
let objStyle = {}
|
||||
let objStyle1 = {}
|
||||
switch(this.placement){
|
||||
case 'top':
|
||||
if(obj1.width > width){
|
||||
objStyle.left = `-${(obj1.width - width)/2}px`
|
||||
}else{
|
||||
objStyle.left = `${Math.abs(obj1.width - width)/2}px`
|
||||
}
|
||||
|
||||
objStyle.bottom =`${height+8}px`
|
||||
objStyle1.left = (obj1.width/2-6)+'px'
|
||||
break;
|
||||
case 'top-start':
|
||||
objStyle.left = `0px`
|
||||
objStyle.bottom =`${height+8}px`
|
||||
break;
|
||||
case 'top-end':
|
||||
objStyle.right = `0px`
|
||||
objStyle.bottom =`${height+8}px`
|
||||
objStyle1.right=`8px`
|
||||
break;
|
||||
case 'bottom':
|
||||
if(obj1.width>width){
|
||||
objStyle.left = `-${(obj1.width - width)/2}px`
|
||||
}else{
|
||||
objStyle.left = `${Math.abs(obj1.width - width)/2}px`
|
||||
}
|
||||
objStyle.top =`${height+8}px`
|
||||
objStyle1.left = (obj1.width/2-6)+'px'
|
||||
break;
|
||||
case 'bottom-start':
|
||||
objStyle.left = `0px`
|
||||
objStyle.top =`${height+8}px`
|
||||
objStyle1.left = `8px`
|
||||
break;
|
||||
|
||||
case 'bottom-end':
|
||||
objStyle.right = `0px`
|
||||
objStyle.top =`${height+8}px`
|
||||
objStyle1.right = `8px`
|
||||
break;
|
||||
|
||||
case 'right':
|
||||
objStyle.left = `${width+8}px`
|
||||
if(obj1.height>height){
|
||||
objStyle.top =`-${(obj1.height - height)/2}px`
|
||||
}else{
|
||||
objStyle.top =`${Math.abs((obj1.height - height)/2)}px`
|
||||
}
|
||||
|
||||
objStyle1.top = `${obj1.height/2-6}px`
|
||||
break;
|
||||
case 'right-start':
|
||||
objStyle.left = `${width+8}px`
|
||||
objStyle.top =`0px`
|
||||
objStyle1.top = `8px`
|
||||
break;
|
||||
|
||||
case 'right-end':
|
||||
objStyle.left = `${width+8}px`
|
||||
objStyle.bottom =`0px`
|
||||
objStyle1.bottom = `8px`
|
||||
break;
|
||||
|
||||
case 'left':
|
||||
objStyle.right = `${width+8}px`
|
||||
|
||||
if(obj1.height>height){
|
||||
objStyle.top =`-${(obj1.height - height)/2}px`
|
||||
}else{
|
||||
objStyle.top =`${Math.abs((obj1.height - height)/2)}px`
|
||||
}
|
||||
|
||||
objStyle1.top = `${obj1.height/2-6}px`
|
||||
break;
|
||||
|
||||
case 'left-start':
|
||||
objStyle.right = `${width+8}px`
|
||||
objStyle.top =`0px`
|
||||
objStyle1.top = `8px`
|
||||
break;
|
||||
|
||||
case 'left-end':
|
||||
objStyle.right = `${width+8}px`
|
||||
objStyle.bottom =`0px`
|
||||
objStyle1.bottom = `8px`
|
||||
break;
|
||||
}
|
||||
this.style = objStyle
|
||||
// 三角形箭头
|
||||
this.arrowStyle = objStyle1
|
||||
resolve()
|
||||
}).exec()
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$theme-bg-color: var(--theme-bg-color);
|
||||
|
||||
.zb-tooltip{
|
||||
position: relative;
|
||||
|
||||
}
|
||||
.zb_tooltip_content{
|
||||
height: 100%;
|
||||
/* float: left; */
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
||||
// display: flex;
|
||||
// flex-direction: row;
|
||||
// align-items: center;
|
||||
/* overflow: hidden; */
|
||||
}
|
||||
.zb_tooltip__popper{
|
||||
/* transform-origin: center top; */
|
||||
background: $theme-bg-color;
|
||||
|
||||
visibility: hidden;
|
||||
// color:'#fff';
|
||||
position: absolute;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
padding: 10px;
|
||||
min-width: 10px;
|
||||
word-wrap: break-word;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
z-index:9;
|
||||
}
|
||||
.zb_popper__icon{
|
||||
width: 0;
|
||||
height: 0;
|
||||
z-index:9;
|
||||
position: absolute;
|
||||
}
|
||||
.zb_popper__arrow{
|
||||
bottom: -5px;
|
||||
/* transform-origin: center top; */
|
||||
border-left: 6px solid transparent;
|
||||
border-right: 6px solid transparent;
|
||||
border-top: 6px solid $theme-bg-color;
|
||||
|
||||
}
|
||||
.zb_popper__right{
|
||||
border-top: 6px solid transparent;
|
||||
border-bottom: 6px solid transparent;
|
||||
border-right: 6px solid $theme-bg-color;
|
||||
left:-5px;
|
||||
}
|
||||
|
||||
.zb_popper__left{
|
||||
border-top: 6px solid transparent;
|
||||
border-bottom: 6px solid transparent;
|
||||
border-left: 6px solid $theme-bg-color;
|
||||
right:-5px;
|
||||
}
|
||||
|
||||
.zb_popper__up{
|
||||
border-left: 6px solid transparent;
|
||||
border-right: 6px solid transparent;
|
||||
border-bottom: 6px solid $theme-bg-color;
|
||||
top:-5px;
|
||||
}
|
||||
.fixed{
|
||||
position: absolute;width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
pointer-events: auto;
|
||||
background: red;
|
||||
z-index:-1;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,83 @@
|
|||
{
|
||||
"id": "zb-tooltip",
|
||||
"displayName": "zb-tooltip （文字提示气泡框）",
|
||||
"version": "1.0.11",
|
||||
"description": "简单的文字提示气泡框,可以自定义皮肤颜色",
|
||||
"keywords": [
|
||||
"tooltip",
|
||||
"tip",
|
||||
"文字提示",
|
||||
"气泡框",
|
||||
"自定义皮肤颜色、Popover"
|
||||
],
|
||||
"repository": "",
|
||||
"engines": {
|
||||
},
|
||||
"dcloudext": {
|
||||
"category": [
|
||||
"前端组件",
|
||||
"通用组件"
|
||||
],
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": ""
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "y",
|
||||
"aliyun": "y"
|
||||
},
|
||||
"client": {
|
||||
"Vue": {
|
||||
"vue2": "y",
|
||||
"vue3": "y"
|
||||
},
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "u"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "y",
|
||||
"百度": "y",
|
||||
"字节跳动": "y",
|
||||
"QQ": "y"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "y",
|
||||
"联盟": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
## 介绍
|
||||
基于uni-app开发的一个普通的提示组件，功能点击提示
|
||||
|
||||
|
||||
## 友情链接
|
||||
#### vue-admin-perfect —— [企业级、通用型中后台前端解决方案 预览地址](http://182.61.5.190:8889/)
|
||||
#### vue-admin-perfect —— [企业级、通用型中后台前端解决方案（基于vue3.0+TS+Element-Plus 最新版，同时支持电脑，手机，平板)](https://github.com/zouzhibin/vue-admin-perfect)
|
||||
|
||||
|
||||
## Tooltip 属性
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||
| ------ | ------ | ------ | ------ | ------ |
|
||||
| visible | 是否显示 tooltip，支持 .sync 修饰符 | Boolean |visible.sync | false |
|
||||
| content | 显示的内容，也可以通过 slot#content | String |-- | ' ' |
|
||||
| color | 自定义主题颜色| String |'#303133' | '#303133' |
|
||||
| placement | Tooltip 的出现位置 | String |top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end | top |
|
||||
|
||||
|
||||
## Slot 插槽
|
||||
| 参数 | 说明 |
|
||||
| ------ | ------ |
|
||||
| content | 显示提示框得内容 |
|
||||
|
||||
|
||||
```
|
||||
因为uniapp 中小程序中没有window对象，需手动调用 关闭
|
||||
第一种办法关闭：this.$refs.tooltip.close()
|
||||
第二种办法关闭：visible.sync = false
|
||||
|
||||
```
|
||||
Loading…
Reference in New Issue