样品看板数据处理

src/views/demo/yangPin/yangPinShuJu/EntrustNumber.vue

@@ -30,36 +30,22 @@ export default {
       days:[],
       //月份天数
       day:0,
-      //已委托未收到样品数据
-      notReceivedNumber:[],
       //已收到样品数据
       received:[],
       //不合格样品数据
-      unqualifiedData:[],
+      // unqualifiedData:[],
       //留样样品数据
       retentionData:[],
+      //需要填充的数组
+      newArrayNum:[]
 }
   },
   created(){
-    
-    // this.getReceivedData()
     // this.getUnqualifiedData()
-    // this.getRetentionData()
-    // this.getInconformityData()
   },
   mounted() {
     this.getNowTime()
-    //初始化组件
-    // this.entrustNumberInit(this.days)s
   },
-  // watch: {
-  //   NowTime(newval,oldval) {
-  //     console.log("监听时间",val,NowTime)
-	//     //  console.log(val,'NowTime');
-	//      let mm = val.split('-');    //把2022-11变成需要传输的样子：2020和11
-	//      this.getDaysInMonth(mm[0],mm[1]) 
-	//  },
-  // },
 methods:{
     //样品相关数据时间控件 :页面进来显示当前时间
     getNowTime(){
@@ -78,7 +64,6 @@ methods:{
 
   //手动操作时间控件改变时间
   changeTime(e){
-    // Sat Jan 01 2022-09
     // console.log('改变时间',e)
     let year = e.slice(0,4)
     let month = e.slice(5,7)
@@ -87,66 +72,27 @@ methods:{
   //用户操作获取月份对应天数,
   getDaysInMonth(year,month){
     let temp = new Date(year,month,0);
-    this.day = temp.getDate(); //这里mm就是天数啦
+    this.day = temp.getDate(); 
     // console.log('当前月份：',month,',天数',this.day);
     for( let i=1;i <= this.day ;i++){
       this.days.push(i)
     }
     // console.log('月份每一天',this.days)
     // console.log('当前月天数',this.day)
-    this.entrustNumberInit(this.days)
     this.getReceivedData(this.day)
+   
+    
+    
   },
 
-    //用户手动查看某月份 的 样品相关数据
-  // changeTime(e){
-    // console.log(e,'未收到样品数据',this.notReceivedNumber)
-    // console.log(e,'已收到样品数据',this.received)
-    // this.filter(this.notReceivedNumber,'shou_yang_ri_qi_',e)
-    // console.log(this.filter(this.received,'shou_yang_ri_qi_',e))
-    // console.log(this.filter(this.unqualifiedData,'shou_yang_ri_qi_',e))
-    // console.log(this.filter(this.retentionData,'shou_yang_ri_qi_',e))
-  // },
-  //筛选月份数据   filter(要处理的数据，6，时间)
-  filter(array,keyname,date){
-    let res=[]
-    array.forEach(e => {
-      //用户选中的时间
-      let month= date.getMonth()+1
-      month = month < 10 ? ('0' + month) :month
-      let year =date.getFullYear()
-     //数据库里每一项的年，月
-      let year2= e[keyname].slice(0,4)
-      let month2=e[keyname].slice(5,7)
-      // console.log('用户选择的时间',year + '年'  + month + '月' )
-      // console.log('数据库里的时间',year2 + '年'  + month2 + '月' )
-      // console.log('已收到的每一项',array)
-      // console.log('当前项的收养日期',e[keyname])
-      //把用户选中的年，月 的样品相关数据筛选出来
-      if(year2==year && month2 ==month){
-        res.push(e)
-        // console.log("用户选择的时间 对应的数据",res)
-      }  
-    });
-    // return res
-  },
-  //1.未收到样品：已委托未收到样品数量:样品表有，登记表没有
-  // getNotReceivedData(){
-  //   let sql1 = "select t_mjypb.shu_liang_ ,t_mjypb.song_yang_ri_qi_ from t_mjypb where t_mjypb.yang_pin_bian_hao not in(select t_mjypdjb.wei_tuo_bian_hao_ from t_mjypdjb)"
-  //   curdPost('sql',sql1).then(response => { 
-  //   this.notReceivedNumber = response.variables.data
-  //   console.log('样品表未收样数据aa',this.notReceivedNumber)
-  //   })
-  // },
-  
- 
-  //2.已收到：样品登记表有数据
+  //
+  //1.已收到：样品登记表有数据
   getReceivedData(dayNum){
     // console.log('getReceivedData function ',dayNum)
     let sql2 = "select shou_yang_ri_qi_,shou_yang_shu_lia from t_mjypdjb"
       curdPost('sql',sql2).then(response => { 
       let data = response.variables.data
-      // console.log('已收',data)
+      console.log('已收',data)
       let newArray = data.reduce((total, cur, index) => {
         let hasValue = total.findIndex(current => {
           return current.shou_yang_ri_qi_ === cur.shou_yang_ri_qi_;
@@ -155,43 +101,70 @@ methods:{
         hasValue !== -1 && (total[hasValue].shou_yang_shu_lia = total[hasValue].shou_yang_shu_lia + cur.shou_yang_shu_lia);
         return total;
       }, []);
-      // console.log('日期数量11111111',newArray);
-      //创建一个当前月份天数的数组
-      let newArrayNUm = Array(dayNum)
-      // console.log('创建对应月份的数组',newArrayNUm.fill(0))
-      //遍历拿到的数组，截取出月份对应的
-      //console.log('已收到样品数据aa',this.received)
-      // let dataList = this.received.map((item)=>{
-      //   return isNaN(parseInt(item.shou_yang_shu_lia))?0:parseInt(item.shou_yang_shu_lia);
-      // });
-   
+      //console.log('日期数量11111111',newArray);
+      //创建一个长度为当前月份天数的数组
+      this.newArrayNum = Array(dayNum)
+      this.newArrayNum = this.newArrayNum.fill(0)
+      //console.log('创建对应月份的数组',this.newArrayNum)
+      //遍历拿到的数组，截取出月份对应的 // 2022-11-01
+      newArray.forEach(item =>{
+        let key = item.shou_yang_ri_qi_.slice(8,10) < 10 ?item.shou_yang_ri_qi_.slice(9,10) :item.shou_yang_ri_qi_.slice(8,10)
+        let value =parseInt(item.shou_yang_shu_lia)
+        this.newArrayNum.splice(key - 1,1,value)
+      })
+      //console.log('处理好的数据',this.newArrayNum)
+      //拿到月份数组和y轴数量数组
+      this.entrustNumberInit(this.days,this.newArrayNum)
     })
   },
   
-  //3.已经收到不合格xx
+  //2.已经收到不合格 xx
   getUnqualifiedData(){
     let sql3 = "select shou_yang_ri_qi_,shou_yang_shu_lia from t_mjypdjb where yan_shou_zhuang_t = '残缺'"
       curdPost('sql',sql3).then(response => { 
-      this.unqualifiedData = response.variables.data
-      // console.log('不合格样品数据',this.unqualifiedData)
+      let data = response.variables.data
+      console.log('不合格样品数据',data )
+      let newArray = data.reduce((total, cur, index) => {
+        let hasValue = total.findIndex(current => {
+          return current.shou_yang_ri_qi_ === cur.shou_yang_ri_qi_;
+        });
+        hasValue === -1 && total.push(cur);
+        hasValue !== -1 && (total[hasValue].shou_yang_shu_lia = total[hasValue].shou_yang_shu_lia + cur.shou_yang_shu_lia);
+        return total;
+      }, []);
+      //console.log('日期数量11111111',newArray);
+      //创建一个长度为当前月份天数的数组
+      this.newArrayNum = Array(dayNum)
+      this.newArrayNum = this.newArrayNum.fill(0)
+      //console.log('创建对应月份的数组',this.newArrayNum)
+      //遍历拿到的数组，截取出月份对应的 // 2022-11-01
+      newArray.forEach(item =>{
+        let key = item.shou_yang_ri_qi_.slice(8,10) < 10 ?item.shou_yang_ri_qi_.slice(9,10) :item.shou_yang_ri_qi_.slice(8,10)
+        let value =parseInt(item.shou_yang_shu_lia)
+        this.newArrayNum.splice(key - 1,1,value)
       })
-  },
-  //4.留样样品数据xx
+      console.log('处理好的数据',this.newArrayNum)
+      //拿到月份数组和y轴数量数组
+      // this.entrustNumberInit(this.days,this.newArrayNum)
+      
+      })
+    },
+     
+  //3.留样样品数据xx
    getRetentionData(){
     let sql4 = "select  shou_yang_ri_qi_,shou_yang_shu_lia from (select * from t_mjypdjb where  liu_yang_ri_qi_ ='' ) a where   a.shi_fou_liu_yang_ != '否'"
       curdPost('sql',sql4).then(response => { 
       this.retentionData = response.variables.data
-      // console.log('留样样品数据',this.retentionData)
+      console.log('留样样品数据',this.retentionData)
       })
 
    },
   
   //委托样品图表
-  entrustNumberInit(dayArray){
+  entrustNumberInit(dayArray,numAray){
+    console.log('拿到日期数组',dayArray)
+    console.log('拿到日期对应数量数组',this.newArrayNum)
     var entrustNumber = this.$echarts.init(this.$refs.Number_refs);
-    // var mWidth = $(".entrustNumber").width();  // 获取父节点宽高
-    // var mHeight = $(".entrustNumber").height();
-    // chart_preHist.resize({width:mWidth, height:mHeight})
     var entrustNumberOption = {
         xAxis:{
           type: "category",
@@ -206,15 +179,14 @@ methods:{
           axisLine: {
             lineStyle: {
               type: 'solid',
-              color: 'white',//坐标线的颜色
-                
+              color: 'white',//坐标线的颜色   
             }
           },
           axisLabel: {
             style: {
                 fill: '#fff'
             }
-        },
+          },
         },
         yAxis: {
           type: "value",
@@ -223,13 +195,11 @@ methods:{
             lineStyle: {
               type: 'solid',
               color: 'white',//坐标线的颜色
-                
             }
           },
-          //去除网格线
           splitLine: {
             show: false
-        },
+          },
         },
         grid:{
           left:'2%',
@@ -237,14 +207,12 @@ methods:{
           top:'15%',
           bottom:'2%',
           containLabel:true
-        
         },
         // tooltip悬浮提示框
         tooltip:{
           show:true
         },
         //图例的位置
-
         legend: {
           show:true, 
           orient: 'horizontal',  //horizontal 水平排列
@@ -253,63 +221,37 @@ methods:{
           lineStyle:{},
           textStyle: {
             color: '#fff',
-        },
+          },
         },
         //隐藏刻度线
         axisTick:{
-              show:false,
-            },
-      
+          show:false,
+        },
         series: [
           {
             type:"bar",
-            name:'未收到样品',
+            // type: 'line',
+            name:'已收到样品',
             label: {
               show: true,
               position: 'top',
               color:'#fff'
-             
             },
-           
-            data: [120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,167,128],
-            
-           //柱子的颜色
+            //柱子的颜色
             itemStyle:{
               show:true,
               color:'rgba(0, 186, 255, 0.4)',
             },
-          
-           
-            //背景颜色
-            // backgroundStyle: {
-            //   color: "rgba(0, 186, 255, 0.4)",
-            // },
-          },
-          {
-            name:'已收到样品',
-            type: 'line',
-            label: {
-              show: true,
-              position: 'bottom',
-              color:'#fff'  
-            },
-            data: [22 ,18, 33, 45, 63, 12, 20, 24, 23, 16, 12, 34,
-            22 ,18, 33, 45, 63, 12, 20, 24, 23, 16, 12, 34,
-            22 ,18, 12, 20, 24,  34],
-            itemStyle:{
-                color:'rgba(55, 162, 218, 0.6)'
-            },
-          
+            //data: [120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,167,128],
+            data:numAray 
           },
         ],
-        // series:this.series
     }
-      entrustNumber.setOption(entrustNumberOption)
+    entrustNumber.setOption(entrustNumberOption)
   }
 }
 }
 </script>
-
 <style lang="less" scoped>
 * body{
   padding: 0px;

src/views/demo/yangPin/yangPinShuJu/MonthlyNumber.vue

@@ -28,101 +28,92 @@
        entrustNumber:null,
        //已委托未收到样品数据
        notReceivedNumber:[],
-       //已收到样品数据
-       received:[],
-       //不合格样品数据
-       unqualifiedData:[],
        //留样样品数据
        retentionData:[],
+       //对应月份的每一天的数组
+       days:[],
+       //月份天数
+       day:0,
+      //需要填充的数组
+      newArrayNum:[]
        
  
  }
    },
    created(){
-     this.getNowTime()
-     this.getNotReceivedData()
-     this.getReceivedData()
-     this.getUnqualifiedData()
-     this.getRetentionData()
+    
    },
    mounted() {
-     //初始化组件
-     this.entrustNumberInit();
+    this.getNowTime()
+   
    },
  methods:{
-   //样品相关数据时间控件默认显示当前时间
+   //样品相关数据时间控件 :页面进来显示当前时间
    getNowTime(){
-       const nowDate = new Date();
-       const date = {
-           year: nowDate.getFullYear(),
-           month: nowDate.getMonth() + 1,
-       }
-       this.NowTime = date.year + '-' + date.month 
-     },
-     //用户手动查看某月份 的 样品相关数据
-   changeTime(e){
-    //  console.log(e,'未收到样品数据',this.notReceivedNumber)
-    //  console.log(e,'已收到样品数据',this.received)
-     // this.filter(this.notReceivedNumber,'shou_yang_ri_qi_',e)
-    //  console.log(this.filter(this.received,'shou_yang_ri_qi_',e))
-     // console.log(this.filter(this.unqualifiedData,'shou_yang_ri_qi_',e))
-     // console.log(this.filter(this.retentionData,'shou_yang_ri_qi_',e))
-       },
-       //筛选月份数据   filter(要处理的数据，6，时间)
-   filter(array,keyname,date){
-     let res=[]
-     array.forEach(e => {
-       //用户选中的时间
-       let month= date.getMonth()+1
-       month = month < 10 ? ('0' + month) :month
-       let year =date.getFullYear()
-      //数据库里每一项的年，月
-       let year2= e[keyname].slice(0,4)
-       let month2=e[keyname].slice(5,7)
-      //  console.log('用户选择的时间',year + '年'  + month + '月' )
-      //  console.log('数据库里的时间',year2 + '年'  + month2 + '月' )
-      //  console.log('已收到的每一项',array)
-      //  console.log('当前项的收养日期',e[keyname])
+      const nowDate = new Date();
+      const date = {
+        year: nowDate.getFullYear(),
+        month: nowDate.getMonth() + 1,
+    }
+      this.NowTime = date.year + '-' + date.month
+      // console.log('页面第一次进来显示时间',date.year,date.month)
+      //进来获取当前时间 之后获取当前月份天数 传给
+      this.getDaysInMonth(date.year,date.month)
       
-       //把用户选中的年，月 的样品相关数据筛选出来
-       if(year2==year && month2 ==month  ){
-         res.push(e)
-        //  console.log("用户选择的时间 对应的数据",res)
-       }  
-     });
-     // return res
-    
- 
-     
-   },
-   //1.未收到样品：已委托未收到样品数量:样品表有，登记表没有
-   getNotReceivedData(){
-       let sql1 = "select * from t_mjypb where t_mjypb.yang_pin_bian_hao not in(select t_mjypdjb.wei_tuo_bian_hao_ from t_mjypdjb)"
-       curdPost('sql',sql1).then(response => { 
-       this.notReceivedNumber = response.variables.data
-       // console.log('样品表未收样数据aa',this.notReceivedNumber)
-       })
-   },
+    },
    
-   //2.已收到：样品登记表有数据
-   getReceivedData(){
-     let sql2 = "select * from t_mjypdjb"
-       curdPost('sql',sql2).then(response => { 
-       this.received = response.variables.data
-       // console.log('已收到样品数据aa',this.received)
-       // let dataList = this.received.map((item)=>{
-       //   return isNaN(parseInt(item.shou_yang_shu_lia))?0:parseInt(item.shou_yang_shu_lia);
-       // });
-       // console.log('已收',dataList);
-     })
-   },
+
+  //手动操作时间控件改变时间
+  changeTime(e){
+    // console.log('改变时间',e)
+    let year = e.slice(0,4)
+    let month = e.slice(5,7)
+    this.getDaysInMonth(year,month)
+  },
+  //用户操作获取月份对应天数,
+  getDaysInMonth(year,month){
+    let temp = new Date(year,month,0);
+    this.day = temp.getDate(); 
+    // console.log('当前月份：',month,',天数',this.day);
+    for( let i=1;i <= this.day ;i++){
+      this.days.push(i)
+    }
+    // console.log('月份每一天',this.days)
+    // console.log('当前月天数',this.day)
+    this.getUnqualifiedData(this.day)
+  },
+   
+  
    
    //3.已经收到不合格xx
-   getUnqualifiedData(){
+   getUnqualifiedData(dayNum){
      let sql3 = "select * from t_mjypdjb where yan_shou_zhuang_t = '残缺'"
        curdPost('sql',sql3).then(response => { 
        this.unqualifiedData = response.variables.data
-       // console.log('不合格样品数据aa',this.unqualifiedData)
+       let data = response.variables.data
+       let newArray = data.reduce((total, cur, index) => {
+        let hasValue = total.findIndex(current => {
+          return current.shou_yang_ri_qi_ === cur.shou_yang_ri_qi_;
+        });
+        hasValue === -1 && total.push(cur);
+        hasValue !== -1 && (total[hasValue].shou_yang_shu_lia = total[hasValue].shou_yang_shu_lia + cur.shou_yang_shu_lia);
+        return total;
+      }, []);
+      //console.log('日期数量11111111',newArray);
+      //创建一个长度为当前月份天数的数组
+      this.newArrayNum = Array(dayNum)
+      this.newArrayNum = this.newArrayNum.fill(0)
+      //console.log('创建对应月份的数组',this.newArrayNum)
+      //遍历拿到的数组，截取出月份对应的 // 2022-11-01
+      newArray.forEach(item =>{
+        let key = item.shou_yang_ri_qi_.slice(8,10) < 10 ?item.shou_yang_ri_qi_.slice(9,10) :item.shou_yang_ri_qi_.slice(8,10)
+        let value =parseInt(item.shou_yang_shu_lia)
+        this.newArrayNum.splice(key - 1,1,value)
+      })
+      //console.log('处理好的数据',this.newArrayNum)
+      //拿到月份数组和y轴数量数组
+      this.entrustNumberInit(this.days,this.newArrayNum)
+
        })
    },
    //4.留样样品数据xx
@@ -136,15 +127,16 @@
     },
    
    //委托样品图表
-   entrustNumberInit(){
+   entrustNumberInit(dayArray,numAray){
      var entrustNumber = this.$echarts.init(this.$refs.Number_refs);
      var entrustNumberOption = {
          xAxis:{
            type: "category",
            //获取当前月的日期1到30日
-           data: ["1号", "2号", "3号", "4号", "5号", "6号", "7号","8号","9号","10号",
-           "11号","12号","13号", "14号", "15号", "16号", "17号", "18号", "19号","20号",
-           "21号","22号","23号","24号","25号","26号","27号","28号","29号","30号"],
+          //  data: ["1号", "2号", "3号", "4号", "5号", "6号", "7号","8号","9号","10号",
+          //  "11号","12号","13号", "14号", "15号", "16号", "17号", "18号", "19号","20号",
+          //  "21号","22号","23号","24号","25号","26号","27号","28号","29号","30号"],
+          data: dayArray,
            splitLine:{
              show:false
            },
@@ -213,15 +205,15 @@
          series: [
            {
              type:"bar",
-             name:'未检样品',
+             name:'不合格样品',
              label: {
                show: true,
                position: 'top',
                color:'#fff'
              },
             
-             data: [120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,167,128],
-             
+             //data: [120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,120, 200, 150, 80, 70, 110, 130,167,128],
+             data:numAray,
             //柱子的颜色
              itemStyle:{
                show:true,
@@ -229,24 +221,8 @@
                
              },
            },
-           {
-             name:'已检样品',
-             type: 'line',
-             label: {
-               show: true,
-               position: 'bottom',
-               color:'#fff'
-             },
-             data: [22 ,18, 33, 45, 63, 12, 20, 24, 23, 16, 12, 34,
-            22 ,18, 33, 45, 63, 12, 20, 24, 23, 16, 12, 34,
-            22 ,18, 12, 20, 24,  34],
-             itemStyle:{
-                 color:'rgba(55, 162, 218, 0.6)'
-             },
-           
-           },
+          
          ],
-         // series:this.series
      }
        entrustNumber.setOption(entrustNumberOption)
    }