<template>
|
<view>
|
<view class="main" v-for="(it,i) in dataList" :key="i">
|
<view class="main-left">{{it.key}}</view>
|
|
<view class="main-right"
|
v-show="!it.type">
|
{{it.value}}
|
</view>
|
|
<input class="main-right input"
|
v-show="it.type == 'input'"
|
type="text"
|
v-model="it.value"
|
>
|
<view class="main-right dis-center no-border" v-show="it.type == 'number-box'" >
|
<uni-number-box
|
color="#606266"
|
v-show="it.type == 'number-box'"
|
v-model="it.value"
|
:max="99999999999999"
|
:min="0"
|
:step='1'
|
@change="changeValue"
|
/>
|
</view>
|
|
<!-- todo: 日期选择 -->
|
</view>
|
|
<view class="footer">
|
<button @click="modify">modify</button>
|
<button @click="del">delete</button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
dataList: [
|
{key: '商品码',value: 'LSH90152025',valText: 'val-text'},
|
{key: '商品名称',value: '尼龙头（灰白）5.2x25'},
|
{key: '规格',value: '700*699*80'},
|
{key: '批号',value: '20231007204944',type: 'input'},
|
{key: '数量',value: 951326478,type: 'number-box',valText: 'val-num'},
|
],
|
baseIP:'',
|
basePORT:'',
|
index: 0,
|
}
|
},
|
onLoad(option) {
|
let _this = this
|
// #ifdef APP-NVUE
|
const eventChannel = this.$scope.eventChannel; // 兼容APP-NVUE
|
// #endif
|
// #ifndef APP-NVUE
|
const eventChannel = this.getOpenerEventChannel();
|
// #endif
|
|
// 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
|
eventChannel.on('param', function(res) {
|
_this.dataList = res.param
|
_this.index = res.index
|
})
|
|
|
},
|
methods: {
|
changeValue(value) {
|
this.val = value
|
},
|
modify() {
|
this.getOpenerEventChannel().emit('dataList', {data: this.dataList});
|
uni.navigateBack()
|
},
|
del() {
|
this.getOpenerEventChannel().emit('del', {data: this.index});
|
uni.navigateBack()
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.main {
|
display: flex;
|
min-height: 30px;
|
align-items: center;
|
margin-left: 8px;
|
padding: 8px;
|
}
|
.main-left {
|
width: 65px;
|
text-align: right;
|
color: #606266;
|
}
|
.main-right {
|
flex: 1;
|
margin-left: 8px;
|
display: flex;
|
flex-wrap: wrap;
|
/* word-wrap: break-word; */
|
word-break: break-all;
|
border: 1px solid #dcdfe6;
|
padding: 6px;
|
border-radius: 4px;
|
color: #a8abb2;
|
font-size: 12px;
|
}
|
.dis-center {
|
justify-content: center;
|
}
|
.no-border {
|
border: none;
|
}
|
.input {
|
color: #606266;
|
}
|
.footer {
|
height: 70px;
|
width: 100%;
|
background-color: #f8f8f8;
|
border-top: 1px solid #dcdfe6;
|
position: fixed;
|
bottom: 0;
|
display: flex;
|
align-items: center;
|
justify-content: space-around;
|
}
|
</style>
|
