Axios 통신 - Object with array key and array value 공부

https://doogle.link/axios-%EC%82%AC%EC%9A%A9%EC%8B%9C-%ED%8F%BC-%EB%8D%B0%EC%9D%B4%ED%84%B0-%EC%A0%84%EC%86%A1%ED%95%98%EA%B8%B0-%ED%8C%8C%EC%9D%BC-%EC%97%85%EB%A1%9C%EB%93%9C/

axios 사용시 폼 데이터 전송하기 (+파일 업로드) | 두글 블로그

https://forteleaf.tistory.com/entry/axiospost-%EC%97%90-form-%EB%8D%B0%EC%9D%B4%ED%84%B0%EB%A5%BC-%EB%84%A3%EA%B8%B0

axios.post 에 form 데이터를 넣기

https://britny-no.tistory.com/32

axios 비동기 post 전송

https://solbel.tistory.com/886

[vue.js] axios 사용시 폼 데이터 전송하기 (+파일 업로드) [펌]

 

 

 

 

 

1-1. 형태  : 오브젝트 안에 있는 다중 배열의 특정 value 추출하기

{ 
	[ key : value, 
      key : value ], 
    [ key : value, 
      key : value ], 
    [ key : value, 
      key : value ], 
     ....
     ....
     ....
}

 

[
	{"idx":417,"user_id":"selene","title":"12345678910","imgs":"/studio/RyfLIhi1638776087.png","made_type":"PC","down_count":0,"w_size":"2000.66674","h_size":"1043.66674","regdate":"2021-12-06 16:34:48","imgState":true},
    {"idx":416,"user_id":"selene","title":"123456789","imgs":"/studio/lIIWVFg1638776079.png","made_type":"PC","down_count":0,"w_size":"2000.66674","h_size":"1043.66674","regdate":"2021-12-06 16:34:39","imgState":true},
    {"idx":415,"user_id":"selene","title":"12345678","imgs":"/studio/7q6u27L1638776073.png","made_type":"PC","down_count":0,"w_size":"2000.66674","h_size":"1043.66674","regdate":"2021-12-06 16:34:33","imgState":true},
]

 

1-2. 처리구조

let deletes = this.workList.filter((item) => {
   if (item.imgState) {
     return item;
   }
 });


if (deletes.length > 0) {
    console.log(JSON.stringify(deletes));//들어오는 형태 찍어보기

    for(var i=0; i<deletes.length;i++){
      deletes.forEach((data)=>{

      this.$axios.post("/studio/deleteContent/",{idx:data.idx, imgs:data.imgs}).then(
        (res)=>{
          if(res.data){
            this.load_data();
            this.$emit("getWorkCount");
          }
        }
      )
    })
  }
}

 

 

2-1. 오브젝트 안에있는 1개 배열에서만 특정 value 추출하기 (아래와 같이 처리)

if(this.selectContent && this.selectType == 'delete'){
  console.log('deleteContents', JSON.stringify(this.selectContents));
  //return;
  this.$axios.post("/studio/deleteContents/",{items:this.selectContents}).then(
      (res)=>{
        if(res.data){
          this.load_data();
          this.$emit("getWorkCount");
      }
    }
  )
}

 

 

 

3-1.  다중 오브젝트 안에있는 특정 values 값을 추출 -> 새로운 배열 생성해서 concat으로 합친후 담아서 -> 문자형식의 숫자를 reduce 사용하여 sum 하기 

   for(var i=0;i<this.stages.length;i++){
                    for(let item of this.stages[i].items){
                        let height = Object.values(item)[0];
                        let width = Object.values(item)[11];

                        var arrHeight = new Array();
                        var arrWidth = new Array();

                        for(i=0; i<this.stages.length; i++){
                            arrHeight.push(height);
                        }

                        for(i=0; i<this.stages.length; i++){
                            arrWidth.push(width);
                        }


                        let totalHeight = arrHeight.concat(arrHeight);
                        let totalWidth = arrWidth.concat(arrWidth);


                        let heightSum = totalHeight.reduce((a,b)=>a+b);
                        let widthSum = totalWidth.reduce((a,b)=>a+b);

                        console.log(heightSum, 'heightSum ========')
                        console.log(widthSum, 'widthSum ========')

                        if(this.$store.state.studio.format=='gif' && widthSum>1920 && heightSum>1080){
                            //alert('1920px X 1080px 사이즈가 넘는 gif 사진은 다운로드가 불가능 합니다.')
                            this.$swal({title:'<span style="font-size:0.9rem">1920px X 1080px 사이즈가 넘는 gif 사진은 다운로드가 불가능 합니다.</span>',showCancelButton:false,confirmButtonText:"확인"});
                            return;
                        }
                    }
                }

 

 

4-1. SQL UNION, UNION ALL 사용, 한개의 컬럼 + 다중 row 의 숫자 값 합치기

 

- SQL UNION 사용하기

 `
    SELECT 
      COUNT(*) AS new_product,
      (SELECT COUNT(*) AS new_ads FROM ads WHERE regdate >=CURDATE()) AS new_ads
    FROM 
    products 
    WHERE 
    reg_date >= CURDATE()
    
    
    
    UNION
    
    SELECT 
      COUNT(*) AS new_product_parts,
      (SELECT COUNT(*) AS new_ads FROM ads WHERE regdate >=CURDATE()) AS new_ads
    FROM 
    products_parts 
    WHERE 
    regdate >= CURDATE()
  `

 

 

- SUM 하는 부분

load_recently_count(){
          this.$axios.get("/admin/getNewCount").then(
            (result)=>{
              if(result.data){
                const content1 = result.data[0].new_product;
                const content2 = result.data[1].new_product;
                const sumContents = content1 + content2;
                
                this.advBadge = result.data[0].new_ads;
                this.contentBadge = sumContents;
              }
            }
          )
        },

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

참고자료

 

https://java119.tistory.com/54

[JavaScript] JSON 데이터 다루기 문법 총 정리

 

 

https://www.delftstack.com/ko/howto/javascript/get-key-of-object-javascript/

JavaScript 객체의 키 가져오기

 

https://woo-yaa.tistory.com/34

자바스크립트 배열에 원하는 값 넣기

https://hianna.tistory.com/408

[Javascript] 배열의 합계, 평균 계산하기 - reduce(), reduceRight()

https://pangtrue.tistory.com/185

[Javascript] 객체(Object)의 키와 값 가져오기

https://zorba91.tistory.com/19

클라이언트단에서 json객체를 key값으로 value 뽑아내기