| New file | 
|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <view> | 
|---|
|  |  |  | <view class="box"> | 
|---|
|  |  |  | <view class="item" v-for="item in data" v-show="!item.hide"> | 
|---|
|  |  |  | <!-- key --> | 
|---|
|  |  |  | <view class="item-key">{{item.title}}</view> | 
|---|
|  |  |  | <!-- value --> | 
|---|
|  |  |  | <view class="item-text" v-if="item.type == 'text'">{{mat[item.field]}}</view> | 
|---|
|  |  |  | <!-- <view class="item-text" v-if="item.type == 'text'">{{item.value}}</view> --> | 
|---|
|  |  |  | <view class="item-input" v-if="item.type == 'input'" :style="'text-align:'+ float"> | 
|---|
|  |  |  | <input type="text" @blur="blur" @focus="focus" v-model="inputData"> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="item-input" v-if="item.type == 'number-box'"> | 
|---|
|  |  |  | <uni-number-box v-model="numberData" :max="99999999" :step='1' color="#747474" @change="changeValue" /> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="item-input" v-if="item.type == 'select'"> | 
|---|
|  |  |  | <riko-combox @input="select" :candidates="candidates" :value="city" :inputFlag="true"></riko-combox> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <view class="z-floor"> | 
|---|
|  |  |  | <view class="z-primary" @click="back">提取</view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | data() { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | candidates: [{name: 'box',id:1},{name: 'plan',id: 2}], | 
|---|
|  |  |  | city: null, | 
|---|
|  |  |  | data: [ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: '商品名称', | 
|---|
|  |  |  | field: 'maktx', | 
|---|
|  |  |  | hied: false, | 
|---|
|  |  |  | value: '123456', | 
|---|
|  |  |  | type: 'text' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: '商品编号', | 
|---|
|  |  |  | field: 'matnr', | 
|---|
|  |  |  | hied: false, | 
|---|
|  |  |  | value: '温度。空调', | 
|---|
|  |  |  | type: 'text' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: '规格', | 
|---|
|  |  |  | field: 'specs', | 
|---|
|  |  |  | hied: false, | 
|---|
|  |  |  | value: 'φ160*45φ160*45φ160*45φ160*45φ160*45φ160*45φ160*45φ160*45φ160*45φ160*45', | 
|---|
|  |  |  | type: 'text' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: '批号', | 
|---|
|  |  |  | field: 'batch', | 
|---|
|  |  |  | hied: false, | 
|---|
|  |  |  | value: '物料名称物', | 
|---|
|  |  |  | type: 'input' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: '数量', | 
|---|
|  |  |  | field: 'count', | 
|---|
|  |  |  | hied: false, | 
|---|
|  |  |  | value: '物料名称物', | 
|---|
|  |  |  | type: 'number-box' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // { | 
|---|
|  |  |  | //    title: '货主', | 
|---|
|  |  |  | //    field: 'maktx', | 
|---|
|  |  |  | //    hied: false, | 
|---|
|  |  |  | //    value: '物料名称物', | 
|---|
|  |  |  | //    type: 'select' | 
|---|
|  |  |  | // }, | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | mat: '', | 
|---|
|  |  |  | float: 'left', | 
|---|
|  |  |  | inputData: '', | 
|---|
|  |  |  | numberData: '' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | onLoad(option) { | 
|---|
|  |  |  | let _this = this | 
|---|
|  |  |  | const eventChannel = this.getOpenerEventChannel(); | 
|---|
|  |  |  | // 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据 | 
|---|
|  |  |  | eventChannel.on('mat', function(data) { | 
|---|
|  |  |  | _this.mat = data.mat | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | blur() { | 
|---|
|  |  |  | this.float = 'right' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | focus() { | 
|---|
|  |  |  | let newData = this.inputData | 
|---|
|  |  |  | this.inputData = '' | 
|---|
|  |  |  | this.float = 'left' | 
|---|
|  |  |  | this.inputData = newData | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | changeValue() { | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | select(e){ | 
|---|
|  |  |  | console.log(e); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | back() { | 
|---|
|  |  |  | if (this.mat.anfme === 0) { | 
|---|
|  |  |  | uni.showToast({title: '请输入数量', icon: "none", position: 'top'}); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.getOpenerEventChannel().emit('matList', {data: this.mat}); | 
|---|
|  |  |  | uni.navigateBack({ | 
|---|
|  |  |  |  | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style scoped> | 
|---|
|  |  |  | .box { | 
|---|
|  |  |  | min-height: 60rpx; | 
|---|
|  |  |  | /* background-color: #202124; */ | 
|---|
|  |  |  | /* color: #FFF; */ | 
|---|
|  |  |  | background-color: #FFF; | 
|---|
|  |  |  | margin: 16rpx; | 
|---|
|  |  |  | padding: 64rpx 32rpx 1rpx 32rpx; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .item { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | min-height: 60rpx; | 
|---|
|  |  |  | margin: 20rpx 0; | 
|---|
|  |  |  | border-bottom: 1px solid #efeef2; | 
|---|
|  |  |  | vertical-align: bottom; | 
|---|
|  |  |  | padding: 0 10rpx; | 
|---|
|  |  |  | line-height: 1.3; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .item:last-child { | 
|---|
|  |  |  | border-bottom: none; | 
|---|
|  |  |  | margin: 10rpx 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .item-key{ | 
|---|
|  |  |  | min-width: 6em; | 
|---|
|  |  |  | max-width: 6em; | 
|---|
|  |  |  | align-self: center; | 
|---|
|  |  |  | vertical-align: bottom; | 
|---|
|  |  |  | font-weight: bold; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .item-text { | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  | align-self: center; | 
|---|
|  |  |  | text-align: right; | 
|---|
|  |  |  | word-break: break-all | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .item-input { | 
|---|
|  |  |  | padding: 4rpx; | 
|---|
|  |  |  | flex: 1; | 
|---|
|  |  |  | align-self: center; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|