liuleilei
2023-09-11 faf1d3cc35a3a5f83558946c8056537a4d77fa1f
minipro_standard/pages_adjust/components/user.vue
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,152 @@
<template>
   <u-popup :show="show" mode="bottom" :closeable="true" :round="10" @open="open" @close="close">
      <view class="title">
         <text>选择生产人员</text>
      </view>
      <view class="content">
         <view class="content_search">
            <u-search :showAction="false" placeholder="搜索姓名" v-model="form.name" @search="searchInput"></u-search>
         </view>
         <div class="content_total">共{{form.total}}条数据</div>
         <scroll-view class="content_list" scroll-y>
            <div class="content_list_item" v-for="(item, index) in list" :key="index" @click="jump(item)">
               <div class="content_list_item_name">
                  <span>{{item.name}}</span>
               </div>
            </div>
         </scroll-view>
      </view>
   </u-popup>
</template>
<script>
   import { allUser } from '@/util/api/PlanningAPI'
   export default {
      props: {
         show: Boolean
      },
      data() {
         return {
            list: [],
            loading: false,
            finished: false,
            refreshing: false,
            form: {
               capacity: 50,
               page: 0,
               total: 0,
               name: ''
            }
         };
      },
      methods: {
         // æœç´¢æ¡†
         searchInput(data) {
            this.form.page = 0
            this.finished = false
            this.list = []
            this.loadmore()
         },
         jump(item) {
            this.$emit('value', item)
         },
         open() {
            this.list = []
            this.form.page = 0
            this.finished = false
            this.list = []
            this.loadmore()
         },
         loadmore() {
            allUser({ name: this.form.name })
               .then(res => {
                  if (res.code === 200 && res.data && res.data.length !== 0) {
                     this.form.total = res.data.length
                     this.list = res.data
                  } else {
                     this.finished = true;
                  }
               }).catch(err => {
                  this.loading = false;
                  this.finished = true;
                  if (this.refreshing) {
                     this.list = []
                     this.refreshing = false;
                  }
               })
         },
         close() {
            this.$emit('close')
         }
      }
   }
</script>
<style lang="scss" scoped>
   .title {
        width: 100%;
      height: 85rpx;
      line-height: 85rpx;
      text-align: center;
      text {
         font-size: 30rpx;
         font-family: PingFangSC-Medium, PingFang SC;
         font-weight: 500;
         color: #222222;
      }
    }
   .content {
      width: 100%;
      .content_search {
         width: 100%;
         padding: 0 30rpx 30rpx 30rpx;
         background: white;
         position: sticky;
         top: 85rpx;
         z-index: 9;
         box-sizing: border-box;
      }
      .content_total {
         padding: 24rpx 30rpx;
         background: #F7F7F7;
         font-size: 24rpx;
         font-weight: 400;
         color: #666666;
      }
      .content_list {
         width: 100%;
         height: 800rpx;
         display: flex;
         flex-direction: column;
         .content_list_item {
            padding: 30rpx;
            display: flex;
            border-bottom: 1rpx solid #ececec;
            .serious {
               color: $nav-stateColor4 !important;
            }
            .success {
               color: $nav-stateColor2 !important;
            }
            .warning {
               color: $nav-stateColor5 !important;
            }
            .content_list_item_status {
               font-size: 28rpx;
               margin-right: 10rpx;
            }
            .content_list_item_name {
               width: 100%;
               display: flex;
               align-items: center;
               span {
                  font-size: 30rpx;
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: #222222;
               }
            }
         }
      }
   }
</style>