Merge remote-tracking branch 'origin/dev' into dev

liuleilei

2023-09-11 faf1d3cc35a3a5f83558946c8056537a4d77fa1f

 minipro_standard/pages_adjust/pages/workOrderReporting/workOrderReporting.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1200 @@
<template>

   <view>

      <view class="tips-label">当前任务需要质检；产出后，请耐心等待质检员检验，并根据检验结果调整产出数据后再报工。</view>

      <workOrderInfo :orederMessage="info" />

      <!-- <u-tabs :list="tab" lineColor="#305ED5" :activeStyle="{color:'#305ED5'}" lineWidth="50%" :itemStyle="{width: '50%', boxSizing: 'border-box', height: '88rpx'}" @click="click"></u-tabs> -->

      <view class="bg_cate">

         <view @click="clickIten(index)" :class="typeView == index ? 'bg_cate_item active' : 'bg_cate_item'"

            v-for="(item, index) in cate" :key="index">{{ item.name }}</view>

      </view>

      <div class="bg_list" v-if="typeView === 0">

         <div class="bg_list_item">

            <div class="bg_list_item_top">

               <div class="bg_list_item_top_left">

                  <div class="bg_list_item_top_left_x bg_m"></div>

                  <span>投料明细</span>

               </div>

               <!-- proxy.$auth('h5:workorderinput:create') &&  -->

               <div class="bg_list_item_top_right" @click="jumpTL"

                  v-if="info.bomType !== 1 || info.bomType == 0 || !info.bomType">

                  <!-- v-if="proxy.$auth('h5:workorderinput:create') && (info.bomType !== 1 || info.bomType == 0 || !info.bomType)" -->

                  <!-- <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> -->

                  <!-- <img src="@/static/gongdan_ic_shoudong@2x.ong" alt="" /> -->

                  <image src="../../static/gongdan_ic_shoudong@2x.png" class="img28" mode=""></image>

                  <span class="cm">手动录入</span>

               </div>

            </div>



            <template v-if="feedingData && feedingData.length > 0">

               <u-swipe-action>

                  <u-swipe-action-item v-for="(item, index) in feedingData" :key="index" :options="options"

                     @click="deleItem(item.id, 'T')">

                     <div class="bg_list_item_h">

                        <div class="bg_list_item_num">

                           <div class="bg_list_item_num_item">

                              <!-- <span>{{item.code}}</span> -->

                              <div class="bg_list_item_num_item_wl">

                                 <span> {{ item.materialName || '墙体砖' }}{{ item.procedureName ? `&nbsp;|&nbsp;${item.procedureName}` : ''

                                 }}</span>

                                 <div class="bg_list_item_num_item_wl_lx">

                                    <span class="green" v-if="item.qualityType == 0">合格&nbsp;/&nbsp;</span>

                                    <span class="orange" v-if="item.qualityType == 1">不良&nbsp;/&nbsp;</span>

                                    <span class="red" v-if="item.qualityType == 2">报废&nbsp;/&nbsp;</span>

                                    <span>{{ item.locationName }}</span>

                                    <span>{{ item.batch ? `&nbsp;/&nbsp;${item.batch}` : '' }}</span>

                                 </div>

                              </div>

                              <div class="bg_list_item_num_item_sr">

                                 <!-- :disabled="!proxy.$auth('h5:workorderinput:update')" -->

                                 <input v-model="item.num"

                                    @blur="change(item.id, item.num, 'T', item.maxNum, item, item.unitAttribute)"

                                    type="number" />

                                 <span>{{ item.unitName }}</span>

                              </div>

                           </div>

                        </div>

                     </div>

                  </u-swipe-action-item>

               </u-swipe-action>



            </template>

            <template v-else>

               <div class="kong">

                  <span>暂无数据</span>

               </div>

            </template>

         </div>

         <div class="bg_list_item">

            <div class="bg_list_item_top">

               <div class="bg_list_item_top_left">

                  <div class="bg_list_item_top_left_x bg_m"></div>

                  <span>产出明细</span>

               </div>

            </div>

            <div class="bg_list_item_h">

               <div class="bg_list_item_num">

                  <div class="bg_list_item_num_item">

                     <span>良品数{{ info.umodel ? `(${info.umodel.name})` : '' }}</span>

                     <div class="bg_list_item_num_item_sr">

                        <!-- :disabled="!proxy.$auth('h5:workorderoutput:update')" -->

                        <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" -->

                        <input type="number" v-model="produceFrom.qualified"

                           @blur="changeCC('0', produceFrom.qualified, produceFrom.qualifiedId)"

                           placeholder="请输入" />

                        <span v-if="info.umodel">{{ info.umodel.name }}</span>

                     </div>

                  </div>

               </div>

            </div>

            <div class="bg_list_item_h">

               <div class="bg_list_item_num">

                  <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" -->

                  <div class="bg_list_item_num_item">

                     <span>不良数{{ info.umodel ? `(${info.umodel.name})` : '' }}</span>

                     <div class="bg_list_item_num_item_sr">

                        <!-- :disabled="!proxy.$auth('h5:workorderoutput:update')" -->

                        <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" -->

                        <input type="number" v-model="produceFrom.undesirable"

                           @blur="changeCC('1', produceFrom.undesirable, produceFrom.undesirableId)"

                           placeholder="请输入" />

                        <span v-if="info.umodel">{{ info.umodel.name }}</span>

                     </div>

                  </div>

               </div>

            </div>

            <div class="bg_list_item_h" v-if="produceFrom.undesirable > 0">

               <div class="bg_list_item_num">

                  <div class="bg_list_item_num_item" @click="badShow = true">

                     <span>不良项</span>

                     <div class="bg_list_item_num_item_sr">

                        <span class="wulll" :style="{ color: form.defectiveName ? '#305ED5' : '' }">{{ form.defectiveName ?

                          form.defectiveName : '设置' }}</span>

                        <image src="../../../static/ic_ar@2x.png" class="img_ar" mode=""></image>

                     </div>

                  </div>

               </div>

            </div>

         </div>

         <div class="bg_plan" @click="TimeShow = true">

            <div class="bg_plan_label">

               <span>报工时长</span>

            </div>

            <div class="bg_plan_label_val">

               <span

                  :style="{ color: form.durationName ? '#333' : '' }">{{ form.durationName ? form.durationName : '请选择' }}</span>

               <image src="../../../static/ic_ar@2x.png" class="img_ar" mode=""></image>

            </div>

         </div>

         <div class="bg_list_item" v-if="arrType && arrType.length > 0">

            <div class="bg_list_item_top">

               <div class="bg_list_item_top_left">

                  <div class="bg_list_item_top_left_x bg_m"></div>

                  <span>工资绩效</span>

               </div>

            </div>

            <div class="bg_list_item_h">

               <div class="bg_list_item_num">

                  <div class="bg_list_item_num_item">

                     <span>计件方式</span>

                     <div class="bg_list_item_num_item_list">

                        <div :class="form.index == index ? 'bg_list_item_num_item_list_item active' : 'bg_list_item_num_item_list_item'"

                           v-for="(item, index) in arrType" :key="index"

                           @click="clickPerformanceType(item, index)">

                           {{ item.name }}

                        </div>

                     </div>

                  </div>

               </div>

               <div class="bg_list_item_num">

                  <div class="bg_list_item_num_item">

                     <span>工资单价</span>

                     <div class="bg_list_item_num_item_sr">

                        <span class="color1">{{ (arrType[form.index].salary / 10 / 10).toFixed(2) }}元/{{ arrType[form.index].type ==

                        0 ? '件' : '时' }}</span>

                     </div>

                  </div>

               </div>

               <div class="bg_list_item_num">

                  <div class="bg_list_item_num_item">

                     <span>预计工资</span>

                     <div class="bg_list_item_num_item_sr">

                        <span class="color1">{{ expectedSalary }}元</span>

                     </div>

                  </div>

               </div>

               <div class="bg_list_item_num">

                  <div class="bg_list_item_num_item">

                     <span>达标率</span>

                     <div class="bg_list_item_num_item_sr">

                        <span class="color1">{{ complianceRate }}%</span>

                     </div>

                  </div>

               </div>

            </div>

         </div>

      </div>

      <div class="details_dj" v-if="typeView === 1">



         <div class="details_dj_list">

            <scroll-view scroll-y="true" refresher-enabled="true" @scrolltolower="getLists">

               <u-swipe-action v-for="(item, index) in djData" :key="index">

                  <u-swipe-action-item :options="options" @click="dele(item.id)">

                     <div class="details_dj_list_item">

                        <span>{{ item.attrName }}：{{ item.val }}</span>

                        <span>{{ item.userName }} {{ item.createTime }}</span>

                     </div>

                  </u-swipe-action-item>

               </u-swipe-action>

            </scroll-view>

         </div>

      </div>

      <!-- v-if="info.status === 2 || info.procedureNeedcheck === 1" -->

      <template>

         <div class="bh_zw"></div>

         <div class="bg_footer bg_f7">

            <div class="bg_footer_submit bg_m" v-if="typeView == 0" @click="submit">确认报工</div>

            <!-- proxy.$auth('h5:workorder:processRecord') &&  -->

            <div class="bg_footer_submit1" @click="jumpdj" v-if="typeView == 1">

               <image src="../../../static/gongdan_ic_shoudong@2x.png" class="fornt-img" mode=""></image>

               <span>新增点检</span>

            </div>

         </div>

      </template>

      <u-datetime-picker :show="TimeShow" @cancel="TimeShow=false" @confirm="timeConfirm" v-model="form.time"

         mode="time"></u-datetime-picker>

      <u-popup :show="badShow" @close="badShow=false" :round="8" closeable zIndex="20000">

         <view class="rp p40 contanir">

            <view class="c2 b tc">不良项</view>

            <view class="content bl_list">

               <div class="bl_list_item" v-for="(item, i) in cateList" :key="i" @click="changeChecked(i)">

                  <div class="bl_list_item_left">

                     <u-checkbox-group @change="changeChecked(i)">

                        <u-checkbox :key="index" :checked="item.active" :label="item.name" :name="item.name">

                        </u-checkbox>

                     </u-checkbox-group>

                  </div>

                  <div class="bl_list_item_right">

                     <input type="number" @click.stop v-model="item.num" placeholder="0" />

                  </div>

               </div>

            </view>

            <view class="flex ap tc bottom-view">

               <view class="fx1 ml20 ptb20 sbtn_green" @click="confirm">确定</view>

            </view>

         </view>

      </u-popup>

   </view>

</template>



<script>

   import workOrderInfo from '@/components/workOrderInfo.vue'

   import {

      getBarcodeContent,

      queryById,

      getOrocessRecord,

      deleteCT,

      updateById,

      comfirmDone,

      comfirmDoneStandard,

      getListByCondition,

      allForStandard,

      pageDJ,

      deletedj,

      dealWorkorderRecordStandard,

      getWorkorderRecordListStandard

   } from '@/util/api/WorkOrderAPI'

   import {

      categoryExtList,

      queryOne,

      queryList

   } from '@/util/api/PlanningAPI'
   import { REGULAR } from '@/util/utils'

   export default {

      components: {

         workOrderInfo

      },

      data() {

         return {

            cate: [{

                  name: '生产'

               },

               {

                  name: '点检'

               }

            ],

            form: {

               time: '',

               defective: [],

               defectiveName: '',

               durationName: '0小时0分钟',

               duration: 0,

               type: 0,

               index: 0

            },

            TimeShow: false,

            badShow: false,

            typeView: 0,

            workorderId: '',

            info: {},

            feedingData: [],

            options: [{

               text: '删除',

               style: {

                  backgroundColor: 'red',

               }

            }],

            arrType: [],

            // äº§å‡ºåˆæ ¼/不良

            produceFrom: {

               qualifiedId: '',

               qualified: '', // åˆæ ¼

               undesirableId: '',

               undesirable: '' // ä¸è‰¯

            },

            triggered: false,
            finished: true,

            djData: [],

            cateList: [],

            pages: {

               capacity: 10,

               page: 1,

               total: 0

            }

         };

      },

      onLoad(obj) {

         this.workorderId = obj.id

         this.queryByIds()

         this.getOrocessRecords()

         this.getData()
         uni.$on('spotAdd', () => {
            if (this.typeView == 1) {
               this.pages.page = 1
               this.pageDJs()
            }
         })

      },

      computed: {

         expectedSalary() {

            if (this.arrType.length === 0) return 0;

            // æŒ‰ä»¶è®¡ç®—

            if (this.arrType[this.form.index].type == 0) {

               if (!this.produceFrom.qualified) return 0

               if (this.arrType[this.form.index].unqualified == 1) { // æ˜¯å¦è®¡å…¥ä¸è‰¯å“

                  let total = Number(this.produceFrom.qualified) + Number(this.produceFrom.undesirable)

                  return (total * (this.arrType[this.form.index].salary / 100)).toFixed(2) || 0

               } else {

                  return (Number(this.produceFrom.qualified) * (this.arrType[this.form.index].salary / 100)).toFixed(

                     2) || 0

               }

            } else {

               if (!this.form.duration) return 0;

               let h = (this.form.duration / 60 / 60).toFixed(2)

               return (Number(h) * (this.arrType[this.form.index].salary / 10 / 10)).toFixed(2) || 0

            }

         },

         complianceRate() {

            if (this.arrType.length === 0) return 0;

            if (!this.produceFrom.qualified && !this.produceFrom.undesirable) return 0;

            if (!this.form.duration) return 0;

            if (!this.arrType[this.form.index].num) return 0;

            // æŒ‰ä»¶è®¡ç®—

            // if (infoBox.value.type == 0) {

            if (this.arrType[this.form.index].unqualified == 1) { // æ˜¯å¦è®¡å…¥ä¸è‰¯å“

               let a = ((Number(this.produceFrom.qualified) + Number(this.produceFrom.undesirable)) / (this.form

                  .duration / 3600)).toFixed(2)

               let b = (this.arrType[this.form.index].num / (this.arrType[form.index].times / 3600)).toFixed(2)

               return ((Number(a) / Number(b)) * 100).toFixed(2)

               // let total = (Number(from.qualified) + Number(from.undesirable)) / ((from.duration * 60 * 60) * infoBox.value.num / )

               // return total * infoBox.value.salary;

            } else {

               let a = (this.produceFrom.qualified / (this.form.duration / 3600)).toFixed(2)

               let b = (this.arrType[this.form.index].num / (this.arrType[this.form.index].times / 3600)).toFixed(2)

               return ((Number(a) / Number(b)) * 100).toFixed(2)

               // return Number(from.qualified) * infoBox.value.salary;

            }

         }

      },

      methods: {

         queryByIds() {

            queryById(this.workorderId)

               .then(res => {

                  this.info = res.data

                  queryList({

                     deleted: 0,

                     departId: res.data.factoryId,

                     materialId: res.data.materialId,

                     procedureId: res.data.procedureId

                  }).then(result => {

                     if (result.code === 200) {

                        if (result.data && result.data.length > 0) {

                           result.data.forEach((item, index) => {

                              item.name = item.type == 0 ? '计件' : '计时'

                              item.id = item.type

                              item.active = index == 0

                           })

                           this.arrType = result.data

                        } else {

                           this.arrType = []

                        }

                     }

                  })

               })

         },

         getOrocessRecords() {

            this.feedingData = []

            allForStandard({

               workorderId: this.workorderId,

               type: 0

            }).then(res => {

               if (res.code === 200) {

                  this.feedingData = res.data

               }

            })

         },

         getData() {

            categoryExtList({

               cateType: "3"

            }).then(res => {

               if (res.code === 200) {

                  res.data.forEach(item => {

                     item.active = false

                     item.num = ''

                  })

                  this.cateList = res.data

               }

            })

         },

         click() {



         },

         clickIten(index) {

            this.typeView = index

            if (this.typeView == 1) {
               this.pages.page = 1

               this.pageDJs()

            }

         },

         timeConfirm({

            value

         }) {

            console.log(value)

            let h = Number(value.substring(0, 2))

            let m = Number(value.substring(3, 5))

            let s = 0

            if (h > 0) {

               s += h * 60 * 60

            }

            if (m > 0) {

               s += m * 60

            }

            this.form.duration = s

            this.form.durationName = `${h}小时${m}分钟`

            this.TimeShow = false

         },

         // ç¼–辑投料/产出

         change(id, num, type, maxNum, item, unitAttribute) {

            let obj = item

            if (type === 'T') {

               if (unitAttribute == 0 && num != '') {

                  if (!REGULAR.positiveInteger.test(num)) {

                     obj.num = obj.ynum

                     Toast({

                        message: '只能输入正整数'

                     })

                     return

                  }

               }

               if (unitAttribute == 1 && num != '') {

                  if (!REGULAR.number.test(num)) {

                     Toast({

                        message: '只能输入正整数或小数（最多四位）'

                     })

                     obj.num = obj.ynum

                     return

                  }

               }

               if (num > maxNum) {

                  obj.num = obj.ynum

                  Toast.fail({

                     message: '超出工装总数'

                  })

                  return

               }

            } else if (type === 'C' && num > info.value.planNum) {

               obj.num = obj.ynum

               Toast.fail({

                  message: '产出数量不能超过计划数量'

               })

               return

            }

            // updateById({ id, num }).then(res => {

            //   if (res.code === 200 && type === 'T') {

            //     getOrocessRecords()

            //   } else if (res.code === 200 && type === 'C') {

            //     // getOrocessRecordCC()

            //   }

            // })

         },

         changeCC(downType, num, recordId) {

            if (!num) return

            console.log(Number(this.produceFrom.qualified) + Number(this.produceFrom.undesirable))

            if ((Number(this.produceFrom.qualified) + Number(this.produceFrom.undesirable)) > this.info.planNum) {

               uni.showToast({

                  title: '产出数量不能大于计划数量',

                  duration: 2000,

                  icon: 'none'

               })

               return

            }

            if (num >= 0) {

               this.form.defective = []

               this.form.defectiveName = ''

               // dealWorkorderRecordStandard({

               //     downType, num, recordId, workorderId: route.query.id

               // }).then(res => {

               //     if (res.code === 200) {

               //         getOrocessRecordCC()

               //     }

               // })

            } else {

               if (downType == 0) {

                  this.produceFrom.qualified = 0

               } else {

                  this.produceFrom.undesirable = 0

               }

               uni.showToast({

                  title: '产出数量不能小于',

                  duration: 2000,

                  icon: 'none'

               })

            }

         },

         clickPerformanceType(item, index) {

            this.form.index = index

            this.form.type = item.type

         },

         submit() {
            let createUnqualifiedDTOList = this.form.defective.map((item) => {
                return {
                  categoryId: item.id,
                  unQualifiedNum: item.num
                }
              })
              let createWorkorderRecordDTO = {
                workorderId: this.workorderId,
                duration: this.form.duration ? this.form.duration : 0,
                qualifiedNum: this.produceFrom.qualified ? this.produceFrom.qualified : 0,
                unQualifiedNum: this.produceFrom.undesirable ? this.produceFrom.undesirable : 0
              }
              // id: route.query.id
              comfirmDoneStandard({
                createUnqualifiedDTOList,
                createWorkorderRecordDTO
              }).then(res => {
                if (res.code === 200) {
                     uni.$u.toast('报工成功')
                  setTimeout(() => {
                    uni.navigateBack({ data: 2})
                  }, 2000)
                }
              })
         },

         jumpdj() {

            uni.navigateTo({

               url: `/pages_adjust/pages/spotCheck/spotCheck?id=${this.workorderId}`

            })

         },
         getLists() {
            if (!this.finished) {
               return
            }
            this.finished = false
            this.pages.page += 1
            this.pageDJs()
         },

         pageDJs() {
				
            pageDJ({

               capacity: this.pages.capacity,

               page: this.pages.page,

               model: {

                  workorderId: this.workorderId

               }

            }).then(res => {
               let {data} = res
               if (data.page == 1) {
                  this.djData = []
               }
               this.djData.push(...data.records)

               // loading.value = false

            }).catch(err => {

               // loading.value = false

               // finished.value = true

            })
            .finally(() => {
               this.finished = true
            })

         },

         dele(id) {

            deletedj(id)

               .then(res => {

                  if (res.code === 200) {

                     this.finished = true

                     this.pages.page = 1

                     this.pageDJs()

                  }

               })

         },

         confirm() {

            let isOpen = false

            this.cateList.forEach((item, index) => {

               if (item.active) {

                  isOpen = true

               }

            })

            if (!isOpen) {

               uni.showToast({

                  title: '请选择不良项',

                  duration: 2000,

                  icon: 'none'

               })

               return

            }

            let arr = []

            let total = 0

            let name = ''

            this.cateList.forEach((item, index) => {

               if (item.active) {

                  if (item.num <= 0) {

                     uni.showToast({

                        title: '不良数量必须大于0',

                        duration: 2000,

                        icon: 'none'

                     })

                     return

                  }

                  total = total += item.num

                  arr.push(item)

                  name += item.name + item.num + '；'

               }

            })

            if (total != Number(this.produceFrom.undesirable)) {

               uni.showToast({

                  title: '不良数必须等于产出不良数',

                  duration: 2000,

                  icon: 'none'

               })

               return

            }

            this.form.defective = arr

            this.form.defectiveName = name

            this.badShow = false

         },

         changeChecked(i) {

            this.cateList[i].active = !this.cateList[i].active

         },

         jumpTL() {

            uni.navigateTo({

               // url: ''

               url: `/pages_adjust/pages/manualFeed/manualFeed?id=${this.workorderId}`

            })

         }

      }

   }

</script>



<style lang="scss" scoped>

   .bg_cate {

      width: 100%;

      height: 88rpx;

      background: #FFFFFF;

      display: flex;

      align-items: center;



      .active {

         box-sizing: border-box;

         color: #305ED5 !important;

         font-weight: 500;

         border-bottom: 3rpx solid #305ED5;

      }



      .bg_cate_item {

         flex: 1;

         height: 100%;

         display: flex;

         align-items: center;

         justify-content: center;

         font-size: 30rpx;

         font-weight: 400;

         color: #555555;

      }

   }



   .bg_list {

      width: 100%;

      display: flex;

      flex-direction: column;

      margin-top: 30rpx;



      .bg_list_item {

         display: flex;

         flex-direction: column;

         // margin-bottom: 40rpx;

         border-bottom: 40rpx #f7f7f7 solid;



         .kong {

            text-align: center;

            padding: 30rpx 0;

            background: #ffffff;

            font-size: 25rpx;



            span {

               color: #474747;

            }

         }



         .bg_list_item_top {

            display: flex;

            align-items: center;

            justify-content: space-between;

            padding-left: 30rpx;

            padding-right: 30rpx;

            margin-bottom: 30rpx;



            .bg_list_item_top_left {

               display: flex;

               align-items: center;



               .left {

                  margin-left: 12rpx;

                  font-size: 28rpx;

               }



               .warning {

                  width: 8rpx;

                  height: 30rpx;

                  border-radius: 2rpx;

                  margin-right: 12rpx;

                  // background: $nav-stateColor5 !important;

               }



               .error {

                  width: 8rpx;

                  height: 30rpx;

                  border-radius: 2rpx;

                  margin-right: 12rpx;

                  // background: $nav-stateColor4 !important;

               }



               .bg_list_item_top_left_x {

                  width: 8rpx;

                  height: 30rpx;

                  // background: $nav-color;

                  border-radius: 2rpx;

                  margin-right: 12rpx;

               }



               span {

                  font-size: 32rpx;

                  font-weight: 500;

                  color: #222222;

                  display: flex;

                  align-items: center;

               }

            }



            .bg_list_item_top_right {

               display: flex;

               align-items: center;



               image {

                  width: 28rpx;

                  height: 28rpx;

                  margin-right: 12rpx;

               }



               span {

                  font-size: 28rpx;

                  font-weight: 400;

               }

            }

         }



         .bg_list_item_h {

            width: 100%;

            padding: 0 30rpx;

            box-sizing: border-box;

            background: white;



            .bg_list_item_num {

               width: 100%;

               min-height: 98rpx;

               background: white;

               display: flex;

               justify-content: center;

               align-items: center;

               border-bottom: 1rpx solid #E5E5E5;



               &:last-child {

                  border: none !important;

               }



               .kong {

                  text-align: center;

                  font-size: 25rpx;

                  padding: 30rpx 0;

                  background: #ffffff;

               }



               .bg_list_item_num_item {

                  width: 100%;

                  height: 100%;

                  display: flex;

                  align-items: center;

                  // height: 118rpx;

                  padding: 15rpx 0;

                  box-sizing: border-box;

                  justify-content: space-between;

                  border-bottom: 1rpx solid #E5E5E5;



                  &:last-child {

                     border: none;

                  }



                  .bg_list_item_num_item_list {

                     display: flex;

                     align-items: center;



                     .active {

                        background: #305ED5 !important;

                        color: #FFFFFF !important;

                     }



                     .bg_list_item_num_item_list_item {

                        width: 116rpx;

                        height: 62rpx;

                        line-height: 62rpx;

                        text-align: center;

                        background: #F2F2F2;

                        border-radius: 8rpx;

                        font-size: 26rpx;

                        font-family: PingFangSC-Regular, PingFang SC;

                        font-weight: 400;

                        color: #333333;

                        margin-right: 20rpx;



                        &:last-child {

                           margin: 0 !important;

                        }

                     }

                  }



                  .bg_list_item_num_item_wl {

                     flex-shrink: 0;

                     display: flex;

                     flex-direction: column;

                     font-size: 34rpx;

                     color: #222222;



                     .bg_list_item_num_item_wl_lx {

                        margin-top: 10rpx;

                        color: #222222;

                        font-size: 28rpx;

                     }

                  }



                  // .warning {

                  //    color: $nav-stateColor5 !important;

                  // }



                  // .err {

                  //    color: $nav-stateColor4 !important;

                  // }



                  img {

                     width: 12rpx;

                     height: 24rpx;

                     margin-left: 20rpx;

                  }



                  span {

                     flex-shrink: 0;

                     overflow: hidden;

                     text-overflow: ellipsis;

                     white-space: nowrap;



                     b {

                        font-size: 30rpx;

                        color: red;

                        margin-right: 5rpx;

                     }



                     // .warning {

                     //    color: $nav-stateColor5 !important;

                     //    margin-right: 5rpx;

                     // }



                     // .err {

                     //    color: $nav-stateColor4 !important;

                     //    margin-right: 5rpx;

                     // }



                     &:nth-child(1) {

                        font-size: 30rpx;

                        font-weight: 400;

                        color: #222222;

                     }



                     &:nth-child(2) {

                        font-size: 28rpx;

                        font-weight: 400;

                        color: #333333;

                        flex-shrink: 0;

                     }

                  }



                  .bg_list_item_num_item_sr {

                     flex: 1;

                     display: flex;

                     align-items: center;

                     justify-content: flex-end;



                     .color1 {

                        font-size: 28rpx;

                        font-family: PingFangSC-Regular, PingFang SC;

                        font-weight: 400;

                        color: #333333;

                     }



                     input::-webkit-input-placeholder {

                        font-size: 28rpx;

                     }



                     input {

                        text-align: right;

                        width: 180rpx;

                        height: 60rpx;

                        border-radius: 8rpx;

                        border: 1rpx solid #E5E5E5;

                        margin-right: 20rpx;

                        font-size: 28rpx;

                        font-weight: 400;

                        color: #333333;

                        padding: 0 30rpx

                     }



                     .wulll {

                        width: 400rpx;

                        text-align: right;

                        overflow: hidden;

                        white-space: nowrap;

                        text-overflow: ellipsis;

                     }



                     span {

                        font-size: 28rpx;

                        font-weight: 400;

                        color: #999999;

                     }

                  }

               }

            }

         }

      }

   }



   .bg_plan {

      width: 100%;

      // height: 98px;

      padding: 30rpx;

      box-sizing: border-box;

      background: #FFFFFF;

      margin-bottom: 40rpx;

      display: flex;

      align-items: center;

      justify-content: space-between;



      span {

         font-size: 30rpx;

         font-family: PingFangSC-Regular, PingFang SC;

         font-weight: 400;

         color: #222222;



         b {

            color: red;

         }

      }



      .bg_plan_nr {

         display: flex;

         flex-direction: column;



         span {

            font-size: 24rpx;

            font-family: PingFangSC-Regular, PingFang SC;

            font-weight: 400;

            color: #666666;

            margin-top: 20rpx;



            &:first-child {

               font-size: 32rpx;

               font-family: PingFangSC-Medium, PingFang SC;

               font-weight: 500;

               color: #333333;

               margin-top: 0 !important;

            }

         }

      }



      .bg_plan_label_val {

         display: flex;

         align-items: center;



         span {

            font-size: 28rpx;

            font-family: PingFangSC-Regular, PingFang SC;

            font-weight: 400;

            color: #999999;

         }





      }

   }



   .img_ar {

      width: 12rpx;

      height: 24rpx;

      margin-left: 20rpx;

   }



   .bh_zw {

      height: 160rpx;

   }



   .bg_footer {

      position: fixed;

      bottom: 0;

      left: 0;

      width: 100%;

      padding: 30rpx 30rpx 60rpx 30rpx;

      box-sizing: border-box;



      .bg_footer_submit1 {

         width: 690rpx;

         height: 76rpx;

         background: #FFFFFF;

         border-radius: 36rpx;

         border: 1rpx solid #E5E5E5;

         display: flex;

         align-items: center;

         justify-content: center;



         .fornt-img {

            width: 28rpx;

            height: 28rpx;

            margin-right: 12rpx;

         }



         span {

            font-size: 26rpx;

            font-family: PingFangSC-Regular, PingFang SC;

            font-weight: 400;

            color: #305ED5;

         }

      }



      .bg_footer_submit {

         width: 690rpx;

         height: 88rpx;

         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;

      }

   }



   .details_dj {

      display: flex;

      flex-direction: column;



      .details_dj_list {

         width: 100%;

         box-sizing: border-box;

         background: #ffffff;

         display: flex;

         flex-direction: column;



         .details_dj_list_item {

            display: flex;

            flex-direction: column;

            border-bottom: 1rpx solid #E5E5E5;

            padding: 30rpx;

            line-height: 42rpx;



            span {

               &:nth-child(1) {

                  font-size: 28rpx;

                  font-weight: 400;

                  color: #222222;

               }



               &:nth-child(2) {

                  font-size: 24rpx;

                  font-weight: 400;

                  color: #999999;

               }

            }

         }

      }



      .details_dj_title {

         width: 100%;

         display: flex;

         align-items: center;

         justify-content: space-between;

         padding: 0 30rpx 30rpx;

         box-sizing: border-box;



         .details_dj_title_left {

            display: flex;

            align-items: center;



            span {

               font-size: 32rpx;

               font-weight: 500;

               color: #222222;

            }

         }



      }

   }



   .contanir {

      height: calc(env(safe-area-inset-bottom) + 720rpx);



      .content {

         margin-top: 20rpx;



         .type-style {

            width: 325rpx;

            margin-bottom: 20rpx;

         }

      }

   }



   .bottom-view {

      left: 40rpx;

      right: 40rpx;

      bottom: 0

   }



   .bl_list {

      width: 100%;

      height: calc(100% - 168rpx);

      overflow-y: scroll;

      margin-top: 30rpx;



      .bl_list_item {

         width: 100%;

         height: 96rpx;

         display: flex;

         align-items: center;

         justify-content: space-between;

         border-bottom: 1rPX solid #E5E5E5;



         &:last-child {

            border: none !important;

         }



         .bl_list_item_left {

            flex: 1;

            display: flex;

            align-items: center;



            input {

               width: 30rpx;

               height: 30rpx;

               border: 1rpX solid #CCCCCC;

               margin: 0 !important;

            }



            span {

               font-size: 30rpx;

               color: #222222;

               margin-left: 10rpx;

            }

         }



         .bl_list_item_right {

            flex: 1;

            height: 50rpx;

            text-align: right;



            input {

               padding-left: 5rpx;

               width: 160rpx;

               height: 100%;

               padding: 0 30rpx;

               box-sizing: border-box;

               text-align: right;

               font-size: 28rpx;

               color: #333333;

               border-radius: 10rpx;

               border: 1rPX solid #CCCCCC;



               &::-webkit-input-placeholder {

                  font-size: 28rpx;

                  font-family: PingFangSC-Regular, PingFang SC;

                  font-weight: 400;

                  color: #999999;

               }

            }

         }

      }

   }

</style>