---
# System prepended metadata

title: 2/8&2/15交接Homework解答 程式碼+註解
tags: [HTA]

---

###### tags: `HTA`
# 2/8&2/15交接Homework解答 程式碼+註解

## 1. 嘗試於個人首頁登入時，利用彈跳對話框說明目前帳號需要處理案件之件數

1. 使用以下api，帶入使用者==account==、==bonita_id==，可取得各類型欲處理流程的種類(ex:A1、B2)及數量

```== 
https://api.testing.eirc.app/authority/v1.0/GetBonitaCaseCount/m1475369/110

//代入李信諳(製造部)account(m1475369)、bonita_id(110)
```
2. 回傳結果
```== JSON
{
    "code": 200,
    "timestamp": "2023-02-22T07:26:44Z",
    "body": [
        {
            "category": "B2",
            "count": 6,
            "name": "專案終止"
        },
        {
            "category": "B2",
            "count": 1,
            "name": "專案任務工作回報"
        },
        {
            "category": "Labor",
            "count": 1,
            "name": "異動記錄重新送審"
        },
        {
            "category": "B2",
            "count": 2,
            "name": "(突發)新增任務"
        }
    ]
}
```
3. src\app\api\http-api.service.ts api函式
```== typescript
getUserCaseCount(account: any, bonitaUserId: any) {
    const url = `${this.BaseUrl}/GetBonitaCaseCount/${account}/${bonitaUserId}`
    return this.http.get(url);
  }
```

4. src\app\views\features\dashboard\dashboard.component.ts 環境設定
```== typescript
//import彈跳視窗套件
import { MatDialog } from '@angular/material/dialog';
//import Case 彈跳視窗
import { CaseDialogComponent } from './case-dialog/case-dialog.component';

constructor(
    public dialog: MatDialog,
  ) {}

```
5. 加入openCase函式、傳入資料處理
```== typescript
//開啟彈跳視窗
openCase(data:any) {
    this.dialog.open(CaseDialogComponent, {
      data //要傳到彈跳視窗的資料
    });
  }

//取得使用者欲處理案件類別與數量
getUserCase(account: any, bonitaUserId: any) {
    this.HttpApiService.getUserCaseCount(account, bonitaUserId).subscribe(res => {
      this.userCaseDatas = res
      console.log("該使用者可執行的所有單據res", this.userCaseDatas)
      this.userCaseCount = this.userCaseDatas.body.length

      //篩選userCaseDatas類別
      for (let i in this.userCaseDatas.body) {
        if (this.userCaseDatas.body[i].category == "A1") {

          this.A1case(this.userCaseDatas.body[i].name, this.userCaseDatas.body[i].count)

        } else if (this.userCaseDatas.body[i].category == "B2") {

          this.B2case(this.userCaseDatas.body[i].name, this.userCaseDatas.body[i].count)

        } else if (this.userCaseDatas.body[i].category == "C2") {

          this.C2case(this.userCaseDatas.body[i].name, this.userCaseDatas.body[i].count)

        }

      }
      
      //A1List push進A1List
      for(let i in this.A1List){
        this.AllList.push(this.A1List[i])
      }
      
      //b2List push進A1List
      for(let i in this.b2List){
        this.AllList.push(this.b2List[i])
      }
      
      //將AllList傳進openCase函示
      this.openCase(this.AllList)
    })
  }
```

```
import { Component, OnInit, Inject, ViewChild, TemplateRef } from '@angular/core';
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
@Component({
  selector: 'app-case-dialog',
  templateUrl: './case-dialog.component.html',
  styleUrls: ['./case-dialog.component.scss']
})

export class CaseDialogComponent implements OnInit {

  constructor(
    @Inject(MAT_DIALOG_DATA) private data: any
  ) { }

  caseListData: any[] = []

  ngOnInit(): void {

    console.log(this.data)
    for(let i in this.data){
      this.caseListData.push(this.data[i])
    }

    console.log(this.caseListData)
  }


}
```



## 2. 判斷工時能自行修改之天數


```== typescript
//一天的毫秒數
let oneDayLong = 24 * 60 * 60 * 1000

//創建今日日期
this.day = new Date()

//今日的毫秒數
var today = Date.parse(this.day) 

console.log("today", today)

//宣告變數存放"提報日日期"
var startDay = this.laborHourData.date_for_start

//把提報日的日期轉為毫秒
startDay = Date.parse(startDay)

console.log("startDay", startDay)

//計算從 提報工時日 到 今日 的天數 (今日-提報日)/一天的毫秒=間隔幾日
var rangeDay = (today - startDay) / oneDayLong

//Math.floor向下取整數
console.log("today - startDay =", Math.floor(rangeDay)) 

//如果大於3日就需異動工時
if (Math.floor(rangeDay) > 3) {

  //將按鈕狀態改為異動工時之狀態
  this.modify_status = true

  Swal.fire(
    {
      title: `此筆工時需送審異動送審`,
      text: '超過可自行修改天數！',
      icon: 'warning',
      confirmButtonText: '確認!',
      confirmButtonColor: '#64c270',
      reverseButtons: true
    }
  )

} else {

  //維持自行更新工時之狀態
  this.modify_status = false
    }
});
```