| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <view class="fp"> |
| | | <view class="fp_list"> |
| | | <view class="fp_list_item"> |
| | | <view class="fp_list_item_left"> |
| | | <text style="color: #f00;">*</text> |
| | | <text>计åç产æ°éï¼</text> |
| | | </view> |
| | | <view class="fp_list_item_right"> |
| | | <u--input placeholder="请è¾å
¥" :customStyle="{width: '180rpx'}" inputAlign="right" type="number" border="surround" v-model="form.num"></u--input> |
| | | </view> |
| | | </view> |
| | | <view class="fp_list_item"> |
| | | <view class="fp_list_item_left"> |
| | | <text style="color: #f00;">*</text> |
| | | <text>计åå¼å·¥æ¥æï¼</text> |
| | | </view> |
| | | <view class="fp_list_item_right" @click="timeShow = true"> |
| | | <text class="black" v-if="form.startTime">{{form.startTime}}</text> |
| | | <text v-else>å¹´ / æ / æ¥</text> |
| | | <u-icon name="arrow-right" color="#999999"></u-icon> |
| | | </view> |
| | | </view> |
| | | <view class="fp_list_item" @click="show = true"> |
| | | <view class="fp_list_item_left"> |
| | | <text>ç产设å¤</text> |
| | | </view> |
| | | <view class="fp_list_item_right"> |
| | | <text v-if="form.equipmentName" class="black">{{form.equipmentName}}</text> |
| | | <text v-else>è¯·éæ©</text> |
| | | <u-icon name="arrow-right" color="#999999"></u-icon> |
| | | </view> |
| | | </view> |
| | | <view class="fp_list_item1" v-show="form.equipmentName"> |
| | | <view class="fp_list_item_left"> |
| | | <text>ç产人å</text> |
| | | </view> |
| | | <view class="fp_list_item_right"> |
| | | <u-checkbox-group v-model="form.personnelId" v-show="personnelData.length > 0"> |
| | | <u-checkbox :name="item.id" v-for="(item, index) in personnelData" :key="index" activeColor="#4275FC">{{item.text}}</u-checkbox> |
| | | </u-checkbox-group> |
| | | <view class="wu" v-show="personnelData.length === 0"> |
| | | <text>ææ æ°æ®</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="fp_footer"> |
| | | <view class="fp_footer_close" @click="go">åæ¶</view> |
| | | <button class="fp_footer_submit" @click="submit">确认</button> |
| | | </view> |
| | | <!-- éæ©æ¥æ --> |
| | | <u-calendar :show="timeShow" @close="timeShow = false" @confirm="timeConfirm"></u-calendar> |
| | | <!-- éæ©è®¾å¤ --> |
| | | <u-picker :show="show" :columns="columns" @confirm="confirm" @cancel="show = false" keyName="label"></u-picker> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import { gsdate } from '@/util/utils.js' |
| | | export default { |
| | | data() { |
| | | return { |
| | | show: false, |
| | | columns: [[{ label: '设å¤ä¸' }]], |
| | | form: { |
| | | num: '', // ç产æ°é |
| | | startTime: gsdate(new Date()), // å¼å§æ¶é´ |
| | | equipmentId: '', // 设å¤id |
| | | equipmentName: '', // 设å¤åç§° |
| | | personnelId: [] // 人åid |
| | | }, |
| | | personnelData: [], // äººåæ°æ® |
| | | timeShow: false |
| | | }; |
| | | }, |
| | | onLoad(option) { |
| | | this.form.num = option.num |
| | | }, |
| | | methods: { |
| | | go() { |
| | | uni.navigateBack({ delta: 1 }); |
| | | }, |
| | | confirm(val) { |
| | | this.form.equipmentName = val.value[0].label |
| | | this.form.equipmentId = 1 |
| | | this.show = false |
| | | }, |
| | | timeConfirm(val) { |
| | | this.form.startTime = val[0] |
| | | this.timeShow = false |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .fp { |
| | | width: 100%; |
| | | height: 100%; |
| | | position: absolute; |
| | | background: #F7F7F7; |
| | | .fp_list { |
| | | display: flex; |
| | | flex-direction: column; |
| | | .fp_list_item1 { |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | padding: 20rpx 30rpx; |
| | | box-sizing: border-box; |
| | | background: #ffffff; |
| | | border-bottom: 1rpx solid #ececec; |
| | | .fp_list_item_left { |
| | | flex-shrink: 0; |
| | | margin-bottom: 20rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | text { |
| | | color: #222222; |
| | | font-size: 30rpx; |
| | | font-weight: 400; |
| | | } |
| | | } |
| | | .fp_list_item_right { |
| | | display: flex; |
| | | align-items: center; |
| | | .wu { |
| | | width: 100%; |
| | | margin: 30rpx 0; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | text { |
| | | font-size: 26rpx; |
| | | color: black; |
| | | } |
| | | } |
| | | .van-checkbox { |
| | | margin-right: 5rpx !important; |
| | | margin-top: 10rpx !important; |
| | | &:nth-child(1) { |
| | | margin-top: 0 !important; |
| | | } |
| | | &:nth-child(2) { |
| | | margin-top: 0 !important; |
| | | } |
| | | &:nth-child(3) { |
| | | margin-top: 0 !important; |
| | | } |
| | | .van-checkbox__label { |
| | | color: black !important; |
| | | } |
| | | } |
| | | .black { |
| | | color: black !important; |
| | | } |
| | | input { |
| | | width: 180rpx; |
| | | height: 60rpx; |
| | | border-radius: 8rpx; |
| | | border: 2rpx solid #E5E5E5; |
| | | padding: 0 30rpx; |
| | | text-align: right; |
| | | font-size: 25rpx; |
| | | } |
| | | text { |
| | | font-size: 28rpx; |
| | | font-weight: 400; |
| | | color: #999999; |
| | | margin-right: 20rpx; |
| | | } |
| | | } |
| | | } |
| | | .fp_list_item { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | padding: 0 30rpx; |
| | | height: 98rpx; |
| | | box-sizing: border-box; |
| | | background: #ffffff; |
| | | border-bottom: 1rpx solid #ececec; |
| | | .fp_list_item_left { |
| | | flex-shrink: 0; |
| | | b { |
| | | color: $nav-stateColor4; |
| | | font-size: 28rpx; |
| | | margin-right: 5rpx; |
| | | } |
| | | text { |
| | | color: #222222; |
| | | font-size: 30rpx; |
| | | font-weight: 400; |
| | | } |
| | | } |
| | | .fp_list_item_right { |
| | | display: flex; |
| | | align-items: center; |
| | | .wu { |
| | | text-align: center; |
| | | text { |
| | | font-size: 26rpx; |
| | | color: black; |
| | | } |
| | | } |
| | | .black { |
| | | color: black !important; |
| | | } |
| | | input { |
| | | width: 180rpx; |
| | | height: 60rpx; |
| | | border-radius: 8rpx; |
| | | border: 1rpx solid #E5E5E5; |
| | | padding: 0 30rpx; |
| | | text-align: right; |
| | | font-size: 25rpx; |
| | | } |
| | | text { |
| | | font-size: 28rpx; |
| | | font-weight: 400; |
| | | color: #999999; |
| | | margin-right: 20rpx; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .fp_footer { |
| | | width: 100%; |
| | | padding-left: 30rpx; |
| | | padding-right: 30rpx; |
| | | padding-bottom: 68rpx; |
| | | box-sizing: border-box; |
| | | position: fixed; |
| | | bottom: 0; |
| | | left: 0; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | .fp_footer_close { |
| | | width: 334rpx; |
| | | height: 88rpx; |
| | | background: #FFFFFF; |
| | | box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.08); |
| | | border-radius: 8rpx; |
| | | font-size: 30rpx; |
| | | font-weight: 500; |
| | | color: #666666; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | .fp_footer_submit { |
| | | width: 334rpx; |
| | | height: 88rpx; |
| | | border: none; |
| | | background: $nav-color; |
| | | box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.08); |
| | | border-radius: 8rpx; |
| | | font-size: 30rpx; |
| | | font-weight: 500; |
| | | color: #ffffff; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | } |
| | | } |
| | | </style> |