wzp
2022-02-21 2667d6931e0f85f3dda26238330d9c45385025cf
assetMgtH5/pages/assets/list.vue
@@ -9,7 +9,7 @@
      </view>
      <view class="search-box">
         <view class="item">
            <u-search placeholder="请输入关键字" v-model="keyword" :clearabled="true" :show-action="false"></u-search>
            <u-search placeholder="请输入关键字" v-model="keyword" :clearabled="true" :show-action="false" @search="onSearch"></u-search>
         </view>
      </view>
      <view class="">
@@ -19,56 +19,62 @@
                  mode="widthFix"></image>
            </u-cell>
         </u-cell-group>
         <u-picker :show="show" ref="uPicker" :columns="columns" @confirm="confirm" @cancel="cancel"
         <u-picker :show="show" ref="uPicker" :columns="columns" keyName="name" @confirm="confirm" @cancel="cancel"
            @change="changeHandler">
         </u-picker>
      </view>
      <!-- 搜索结果 -->
      <view class="cu-list menu-avatar">
         <view class="cu-item">
            <view class="cu-avatar radius lg"
               style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big81007.jpg);">
            </view>
            <view class="content">
               <view>
                  <view class="text-cut text-bold text-xl">课桌</view>
                  <view class="cu-tag radius bg-orange sm">数量:100</view>
      <mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback">
         <view class="cu-list menu-avatar ">
            <view class="cu-item" v-for="(item,index) in assetsList" :key="index">
               <view class="cu-avatar radius lg bg-white"
                  style="background-image:url(../../static/device.png)">
               </view>
               <view class="text-gray text-sm flex">
                  <view class="text-cut">规格:120*120 白色 编码:1234533333</view>
               <view class="content">
                  <view>
                     <view class="text-cut text-bold text-xl">{{item.assets.name}}</view>
                     <view class="cu-tag radius bg-orange sm">已申请数量:{{item.quantity}}</view>
                  </view>
                  <view class="text-gray text-sm flex">
                     <view class="text-cut">规格:{{item.model?item.model:'无'}} 编码:{{item.serialNumber}}</view>
                  </view>
               </view>
            </view>
         </view>
      </view>
      </mescroll-body>
      <view class="">
      <!-- <view class="">
         <u-empty mode="search" icon="http://cdn.uviewui.com/uview/empty/search.png">
         </u-empty>
      </view>
      </view> -->
   </view>
</template>
<script>
   import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
   export default {
      mixins: [MescrollMixin], // 使用mixin
      data() {
         return {
            keyword: '',
            show: false,
            columns: [
               ['中国', '美国'],
               ['深圳', '厦门', '上海', '拉萨']
            ],
            columns: [],
            columnData: [
               ['深圳', '厦门', '上海', '拉萨'],
               ['得州', '华盛顿', '纽约', '阿拉斯加']
            ]
            ],
            newColumnData:[],
            assetsList: [],
            flag:false
         }
      },
      onShow() {
         this.getAssetList();
      async onLoad() {
         await this.getAssetsCategoryList();
      },
      onReady() {
      },
      methods: {
         changeHandler(e) {
            const {
@@ -97,22 +103,110 @@
         showPicker() {
            this.show = true;
         },
         //请求
         getAssetList() {
            this.$http.get('/assets/approval/search',{params:{pageNum:"1",pageSize:"10",keyStr:''}})
         onSearch(e) {
            console.log("搜索:" + this.keyword)
            this.page = 1;
            let page ={};
            page.num =1;
            this.upCallback(page);
         },
         upCallback(page) {
            
            let pageNum = page.num; //页码,默认从1开始
            let pageSize = 10; //页长,默认每页10条
            console.log(pageNum)
            this.$http.get('/assets/approval/myAssets', {
                  params: {
                     pageNum: pageNum,
                     pageSize: pageSize,
                     keyStr: this.keyword
                  }
               })
               .then(res => {
                  // debugger;
                  let data = res.data;
                  console.log(JSON.stringify(data.data))
                  let tt = data.data;
                  console.log(tt.length)
                  if (res.data.code === 0) {
                     let data = res.data.data;
                     console.log('总资产'+ data.length)
                     if (page.num == 1) this.assetsList = []; //如果是第一页,需手动置空列表
                     this.assetsList = this.assetsList.concat(data); //追加新数据
                     console.log(this.assetsList.length)
                     this.mescroll.endBySize(this.assetsList.length, res.data.total);
                  }
                  else{
                     this.mescroll.endBySize(0, 0);
                  }
               })
               .catch(err => {
                  this.mescroll.endErr();
                  console.log('异常', err);
               });
         },
         //资产类别
         async getAssetsCategoryList() {
            await this.$http.get('/assets/approval/getAssetsCategory')
               .then(res => {
                  // debugger;
                  let tt=[]
                  if(res.data.code===0){
                     let data = res.data.data;
                     for(let i=0;i<data.length;i++){
                        let jsonData={
                           id:data[i].id,
                           name:data[i].name
                        }
                        tt.push(jsonData);
                        this.getAssetsTypes(data[i].id);
                     }
                  }
                  let newCloumns=[];
                  newCloumns.push(tt);
                  // newCloumns.push(this.newColumnData[0]);
                  this.columns = newCloumns;
                  
               }).catch(err => {
                  console.log(err.data)
               })
         },
         async getAssetsTypes(id) {
            await this.$http.get('/assets/approval/getAssetsTypes',{params:{parentId:id}})
               .then(res => {
                  // debugger;
                  let typeData=[]
                  if(res.data.code===0){
                     let data = res.data.data;
                     for(let i=0;i<data.length;i++){
                        let jsonData={
                           id:data[i].id,
                           name:data[i].name
                        }
                        typeData.push(jsonData);
                     }
                  }
                  // console.log('typeData=',typeData)
                  this.columnData.push(typeData);
                  if(!this.flag){
                     this.columns.push(typeData);
                     this.flag=true;
                  }
               }).catch(err => {
                  console.log('错误',err)
               })
         }
      }