pad-app/pages/shipWork/untieCord.vue

113 lines
2.1 KiB
Vue

<template>
<view class="untieCord">
<view class="container">
<ul>
<li v-for="(item,index) in infoList" :key="index" @click="add('look')">
<view class="title">航次:{{item.val1}}</view>
<p>状态:{{item.val2}}</p>
<p>进出口:{{item.val3}}</p>
<p>贸易类型:{{item.val4}}</p>
<p>泊位:{{item.val5}}</p>
<p>系缆时间:{{item.val6}}</p>
</li>
</ul>
<view class="addBtn" @click="add('add')">+ </view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
infoList: [{
val1: "JK9795799",
val2: "待上传",
val3: "进口",
val4: "外贸",
val5: "一泊位",
val6: "05/30 8:00",
}, {
val1: "JK9795799",
val2: "待上传",
val3: "进口",
val4: "外贸",
val5: "一泊位",
val6: "05/30 8:00",
}, {
val1: "JK9795799",
val2: "待上传",
val3: "进口",
val4: "外贸",
val5: "一泊位",
val6: "05/30 8:00",
}]
}
},
methods: {
add(state) {
const obj = {
state: state,
}
const params = encodeURIComponent(JSON.stringify(obj));
uni.navigateTo({
url: `/pages/shipWork/untieAdd?params=${params}`
})
},
}
}
</script>
<style lang="less" scoped>
.untieCord {
.container {
padding: 30px 20px;
ul {
padding: 20px 0;
li {
display: flex;
justify-content: space-between;
border-bottom: 1px solid #ccc;
padding: 20px;
.title {
font-size: 16px;
font-weight: bold;
display: flex;
flex-direction: column;
justify-content: center;
}
.shift {
p {
font-size: 16px;
}
}
.state {
display: flex;
flex-direction: column;
justify-content: center;
}
}
}
.addBtn {
position: fixed;
right: 50px;
bottom: 50px;
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #2979ff;
color: #fff;
font-size: 24px;
text-align: center;
line-height: 100px;
font-weight: bold;
}
}
}
</style>