Merge remote-tracking branch 'origin/master'

NNowhZzU

2023-12-29 7fdc69ac6e262f7e203131c36cc4fbf2012f9e03

 north-glass-erp/northglass-erp/src/views/sd/product/SelectProduct.vue

@@ -3,15 +3,12 @@
import deepClone from "@/utils/deepClone"
import {ElDatePicker, ElMessage} from "element-plus"
import useProductGlassTypeStore from "@/stores/sd/product/productGlassType"
import useProductStore from "@/stores/sd/product/prduct"
import {onMounted, reactive, ref, watch} from "vue"
import {Search} from "@element-plus/icons-vue"
import GlassType from "@/components/sd/product/GlassType.vue"
import {useRouter} from  'vue-router'
import BasicTable from '@/components/basic/BasicTable.vue'
import scrollEvnt from "@/hook";
let productGlassTypeStore = useProductGlassTypeStore()
let productStore = useProductStore()
let router=useRouter()
//监听玻璃类型改变
watch(productGlassTypeStore,(newVal,oldVal) => {
@@ -20,54 +17,100 @@
  })
})

let scrollTop =ref(null)
let scrollHeight =ref(null)
let clientHeight =ref(null)
const  scrollEvnt = (row) => {
  // 内容高度
  scrollTop.value = row.$event.target.scrollTop
  scrollHeight.value = row.$event.target.scrollHeight
  clientHeight.value = row.$event.target.clientHeight
}


let produceList = ref([])
let pageNum=$ref(1)
watch(productStore,(newVal,oldVal) => {
  if(newVal.flag===true){
    pageNum=pageNum+1
let pageState = null
//监听产品滚动条状态，滚动到底部向后端请求数据
watch(scrollTop,(newVal,oldVal) => {
  //判断当前状态查询状态
  if(pageState!==null){
    return;
  }
  //判断滚动条上下滚动不是左右滚动，当左右滚动直接返回
  if((newVal === oldVal && newVal===0) || oldVal===null){
    return;
  }
  //判断是否滚到底部
  if ((Math.round(scrollTop.value + clientHeight.value)+5 >= scrollHeight.value ) ) {
    if(newVal>oldVal){
      //判断当前容器长度是否为500，并且当前页小于容器总数量
      if(produceList.length===500 && pageNum<(produceList.length/100)){
        pageNum=pageNum+5
      }else{
        pageNum=pageNum+1
      }
      pageState=true
    }
  }else if(newVal===0 && oldVal>0 && pageNum>1  ){  //判断是否滚到顶部并且大于容器数量
    //判断向上滚动当前页数是否大于容器数值
    if(pageNum>5){
      pageNum=pageNum-5
    }else if((produceList.length/100)>=5) {
      pageNum=pageNum-1
    }else{
      return
    }
    pageState =false
  }
  if(pageState!==null){
    gridOptions.loading=true
    request.get(`/product/${pageNum}/100`).then((res) => {
      try{
        if(res.code==200){
          if(pageState){
            produceList = produceList.concat(res.data)
            if(produceList.length>500){
              produceList=produceList.slice(100,600)
            }
          }else{
            produceList = res.data.concat(produceList)
            if(produceList.length>500){
              produceList=produceList.slice(0,500)
            }
          }
          xGrid.value.reloadData(produceList)
          pageState=null
        }else{
          ElMessage.warning(res.msg)
        }
      }finally {
        gridOptions.loading=false
      }
    })
  }


    //后端获取有多少页，超过多少页不再请求
    /*if(pageNum>5){
      console.log(newVal.pageNum)
      return
    }*/
    request.get(`/product/${pageNum}/100`).then((res) => {
      gridOptions.loading=true
      try{
        if(res.code==200){
          gridOptions.data=  gridOptions.data.concat(res.data)
          newVal.flag=false
          setTimeout(()=>{
            gridOptions.loading=false
          },1000)
        }else{
          ElMessage.warning(res.msg)
        }
      }finally {

      }
    })
  }

})

let flag = $ref(false)
request.get("/product/1/100").then((res) => {
  if(res.code==200){
    gridOptions.data= deepClone(res.data)
    flag = true
    produceList = produceList.value.concat(deepClone(res.data))

    xGrid.value.reloadData(produceList)
    gridOptions.loading=false
  }else{
    ElMessage.warning(res.msg)
    router.push("/login")
  }
})

//子组件接收参数
let tableProp = $ref({
  datas:null,
  footList:[],
  //筛选条件列
  filter:{
  },
})




@@ -91,18 +134,19 @@

const xGrid = ref()
const gridOptions = reactive({
  loading: false,
  loading: true,
  border:  "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe:true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮
  rowConfig: {isCurrent: true, isHover: true,height: 60, useKey: true},//鼠标移动或选择高亮
  id: 'demo_1',
  showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true ,gt:100},//开启虚拟滚动
  scrollX:{enabled: true},
  scrollY:{ enabled: true ,gt:0},//开启虚拟滚动
  showOverflow:true,
  columnConfig: {
    resizable: true,
@@ -139,7 +183,6 @@
    zoom: true,
    custom: true
  },
  data:  null,//table body实际数据
  footerMethod ({ columns, data }) {//页脚函数
    return[
      columns.map((column, columnIndex) => {