k94314517
2023-09-05 fa2f172812de8344fa22c4ef088ea2a67257a0d3
minipro_standard/pages/allocation/allocation.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,269 @@
<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>