###### 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
}
});
```