front-end/ghsApp/src/admin/order/itemOrder.vue

<template>
  <div class="app-main app-content">
    <div class="list-wrap">
      <block v-if="!$util.isEmpty(list.data)">
        <div class="list" v-for="(item, index) in list.data" :key="index">
          <div v-if="!$util.isEmpty(item.orderInfo)">
            <OrderItem :item="item.orderInfo" @printOrder="printOrder"></OrderItem>
          </div>
          <div v-else>
            <OrderItem :ref="`orderRef${item.id}`" :item="item" @printOrder="printOrder" @directFh="directFh" @fillNoFh="fillNoFh"></OrderItem>
          </div>

        </div>
      </block>
      <block v-else>
        <app-wrapper-empty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
      </block>
    </div>

    <div class="app-footer" v-if="!$util.isEmpty(ids)">
      <div class="admin-button-com big blue" @click="batchFh()">全部发货</div>
      <div class="admin-button-com big blue" style="margin-left:50upx;" @click="batchPrint()">合并打印</div>
    </div>

		<modal-module :show="fhLabelShow" @click="fhConfirm" :maskClosable="true" title="物流信息" padding="30rpx 30rpx" >
      <template v-slot:content>
        <div class="app-modal-input-wrap">
          <div class="inp-list-line">
            <div class="line-label">物流名称</div>
            <div class="line-input">
            <input type="text" v-model="fhWl" @focus="fhWl=''" class="inp-input" />
            </div>
          </div>
          <div class="inp-list-line">
            <div class="line-label">物流单号</div>
            <div class="line-input">
            <input type="text" v-model="fhWlNo" :focus="fhWlFocus" @focus="fhWlNo=''" class="inp-input" />
            </div>
          </div>
        </div>
      </template>
		</modal-module>

  </div>
</template>
<script>
import AppWrapperEmpty from "@/components/app-wrapper-empty";
import ModalModule from "@/components/plugin/modal";
import { list } from "@/mixins";
import { mapGetters } from "vuex";
import { getOrderInfoList } from "@/api/order-item";
import orderMixin from "@/mixins/order";
import OrderItem from "../home/components/OrderItem"
import { getListB,cloudPrintOrder,mergePrintFn,allFhAction,orderFh} from "@/api/order";
export default {
  name: "itemOrder",
  components: {
    AppWrapperEmpty,
    ModalModule,
    OrderItem,
  },
  mixins: [list,orderMixin],
  computed: { ...mapGetters(["getLoginInfo", "getDictionariesInfo"]) },
  data() {
    return {
      ids:'',
      fhWlInfo:[],
      fhWlNo:'',
      fhWl:'顺丰',
      fhWlFocus:false,
      fhLabelShow:false,
    }
  },
  onPullDownRefresh() {
    this.resetList();
    this.getOrderList().then((res) => {
      uni.stopPullDownRefresh();
    });
  },
  onReachBottom() {
    if (!this.list.finished) {
      this.getOrderList().then((res) => {
        uni.stopPullDownRefresh();
      });
    } else {
      uni.stopPullDownRefresh();
    }
  },
  onLoad() {
    this.getOrderList()

		//返回上一页时不需要刷新
		let pages = getCurrentPages();
		let prevPage = pages[ pages.length - 2 ];
		prevPage.$vm.fromDetail = {status:1}

    this.ids = this.option.ids?this.option.ids:''

  },
  methods: {
    //这个有多处要同步修改，关键词：fh_express_pop
    fillNoFh(info){
      let that = this
      this.fhLabelShow = true
      this.fhWlInfo = info
			setTimeout(x => {
				this.$nextTick(() => {
          that.fhWlFocus = true
        })
			}, 200)
    },
    fhConfirm(val){
      let that = this
			if (val.index == 0) {
				that.fhLabelShow = false
				that.fhWlFocus = false
        that.fhWlNo = ''
				return
			}
      if (this.$util.isEmpty(this.fhWl)){
        that.$msg('请填写物流名称')
        return false
      }
      if (this.$util.isEmpty(this.fhWlNo)){
        that.$msg('请填写物流单号')
        return false
      }
      let id = that.fhWlInfo.id ? that.fhWlInfo.id : 0
      that.$util.confirmModal({content:'确认发货？'},() => {
          orderFh({id:id,fhType:1,fhWl:that.fhWl,fhWlNo:that.fhWlNo}).then(res=>{
            if(res.code == 1){
              that.$refs[`orderRef${id}`][0].currentStatus = 3
              that.fhLabelShow = false
              that.fhWlFocus = false
              that.fhWlNo = ''
              that.$msg('发货成功')
            }
          })
      })
    },
    init(){

    },
    directFh(info){
      let that = this
      that.$util.confirmModal({content:'确认发货？'},() => {
          orderFh({id:info.id,fhType:0}).then(res=>{
            if(res.code == 1){
              that.$refs[`orderRef${info.id}`][0].currentStatus = 3
              that.$msg('发货成功')
            }
          })
      })
    },
    batchFh(){
      let that = this
      if(this.option.ids && !this.$util.isEmpty(this.option.ids)){
        that.$util.confirmModal({content:'确认全部发货？'},() => {
          allFhAction({ids:this.option.ids}).then(res=>{
            if(res.code == 1){
              that.$msg('操作成功')
              that.resetList()
              that.getOrderList()
            }
          })
        })
      }else{
        this.$msg('没有订单')
      }
    },
    batchPrint(){
      let that = this
      if(this.option.ids && !this.$util.isEmpty(this.option.ids)){
        that.$util.confirmModal({content:'确认合并打印？'},() => {
          mergePrintFn({ids:this.option.ids}).then(res=>{
            if(res.code == 1){
              that.$msg('打印成功')
            }
          })
        })
      }else{
        this.$msg('没有订单')
      }
    },
    printOrder(item){
      let that = this
      uni.showLoading({title: '打印中...'});
      cloudPrintOrder({id:item.id}).then((res) => {
        uni.hideLoading()
        if(res.code == 1){
          if(res.data.hasNoPrint == 1){
            that.$util.confirmModal({content:'请先设置打印机'},() => {
              that.$util.pageTo({url: "/admin/shop/print"})
            })
          }else{
            item.printNum++
          }
        }
      })
    },
    getOrderList() {
      if(this.option.productId){
        return getOrderInfoList({ productId:this.option.productId, page: this.list.page }).then((res) => {
          this.completes(res)
        })      
      }
      if(this.option.customId){
        return getListB({ page: this.list.page,customId:this.option.customId }).then((res) => {
          this.completes(res)
        })
      }
      if(this.option.ids){
        return getListB({ page: this.list.page,ids:this.option.ids }).then((res) => {
          this.completes(res)
        }) 
      }
    }
  },
};
</script>
<style lang="scss" scoped>
page{
	width: 750upx;
	overflow: hidden;
}
.app-content {
	width: 100%;
  padding-bottom: 160upx;
	overflow: hidden;
  .select-dn_bx {
    padding-left: 18upx;
  }
  .app-tabs {
    position: fixed;
    width: 100%;
    z-index: 9;
  }
  .input-wrap_box {
    background-color: #fff;
    position: fixed;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100upx;
    display: flex;
    align-items: center;
    padding: 0 30upx;
    & > view:nth-child(2) {
      flex: 1;
    }
  }
  .list-wrap {
    padding-top: 20upx;
    .list {
      background-color: #fff;
      margin-bottom: 20upx;
    }
  }
}
.upload-confirm-wrap {
  max-height: 600upx;
  overflow-y: auto;
  .modal-tit {
    @include disFlex(center, center);
    font-size: 40upx;
    margin-top: 30upx;
    margin-bottom: 50upx;
    .iconfont {
      color: #09bb07;
      margin-right: 20upx;
      font-size: 50upx;
    }
  }
  .sel-wrap {
    color: $fontColor2;
    font-size: 32upx;
    .sel-tit {
      text-align: left;
    }
    .sel-btn {
      @include disFlex(center, flex-start);
      flex-wrap: wrap;
      padding: 10upx 0 40upx;
    }
  }
	// 按钮
	.app-footer {
		justify-content: flex-end;
	}
}
</style>